/* Keep the permanent brand dock centred while its supplied artwork dissolves. */
.animated-logo-dock.floating-dock{grid-template-columns:54px minmax(0,1fr) auto}
.animated-logo-dock .dock-mark{position:relative;overflow:hidden;border-radius:14px;background:rgba(255,255,255,.8)}
.animated-logo-dock .dock-mark .dock-logo-frame{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;border-radius:0;opacity:0;transition:opacity 1.5s ease-in-out}
.animated-logo-dock .dock-mark .dock-logo-frame.is-current{opacity:1}
.animated-logo-dock .dock-copy{min-width:0}
.animated-logo-dock .dock-sub{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.animated-logo-dock .dock-word{display:none}
.dock-animation-toggle{font:inherit;font-size:11px;color:#31505b;background:rgba(255,255,255,.65);border:1px solid rgba(92,130,146,.28);border-radius:999px;min-height:44px;padding:0 12px;cursor:pointer}
.dock-animation-toggle:hover{background:rgba(255,255,255,.95)}
.dock-animation-toggle:focus-visible{outline:2px solid #08759f;outline-offset:3px}
@media(prefers-reduced-motion:reduce){.animated-logo-dock .dock-mark .dock-logo-frame{transition:none}}

/* The full signature panel links to its collection; motion remains a separate control. */
.dock-page-link{position:absolute;inset:0;border-radius:inherit;z-index:2}
.dock-page-link:hover{background:rgba(255,255,255,.12)}
.dock-page-link:focus-visible{outline:3px solid #08759f;outline-offset:4px}
.dock-animation-toggle{position:relative;z-index:3}

/* Enlarge the visible panel, rather than only its transparent link overlay. */
@media (hover: hover) and (pointer: fine) and (prefers-reduced-motion: no-preference) {
  .floating-dock:has(> .dock-page-link){transition:transform 180ms ease}
  .floating-dock:has(> .dock-page-link:hover){transform:translateX(-50%) scale(1.03)}
  :root .floating-dock a.dock-page-link:hover{scale:1}
}

/* The header and dock use the same frames and crossfade cadence. */
.site-header .brand .header-synced-mark{position:relative;display:inline-block;flex:0 0 98.26px;width:98.26px;height:98.26px;overflow:hidden;border-radius:10px}
.site-header .brand > .brand-mark{flex-shrink:0}
.site-header .brand > .brand-mark > img{width:98.26px;height:98.26px}
.site-header .brand .header-synced-mark .dock-logo-frame{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;border-radius:0;opacity:0;transition:opacity 1.5s ease-in-out}
.site-header .brand .header-synced-mark .dock-logo-frame.is-current{opacity:1}
@media(prefers-reduced-motion:reduce){.site-header .brand .header-synced-mark .dock-logo-frame{transition:none}}