.topbar{position:sticky;top:0;z-index:30;background:color-mix(in srgb,var(--paper) 94%,transparent);backdrop-filter:blur(16px);padding:17px max(24px,calc((100% - 1280px)/2));gap:20px}.topbar .wordmark{font:25px/1.2 var(--serif);letter-spacing:-.6px;min-height:44px;display:inline-flex;align-items:center;margin-right:auto;text-decoration:none;white-space:nowrap}.case-name-part{display:inline-block;vertical-align:bottom;overflow:hidden;max-width:0;opacity:0;animation:case-unfold 14s ease-in-out infinite}.case-dot{color:var(--clay)}.wordmark:hover .case-name-part,.wordmark:focus-visible .case-name-part{animation:none;max-width:140px;opacity:1;transition:max-width .5s,opacity .5s}.case-motion{background:transparent;border:0;min-width:44px;min-height:44px;color:var(--ink);font-size:15px;cursor:pointer}.topbar .case-home{min-height:44px;display:inline-flex;align-items:center;font:12px var(--sans);text-decoration:none;color:var(--muted)}.topbar :focus-visible{outline:2px solid var(--clay);outline-offset:4px}.case-motion-paused .case-name-part{animation:none;max-width:0;opacity:0}
@keyframes case-unfold{0%,18%,85%,100%{max-width:0;opacity:0}29%,70%{max-width:140px;opacity:1}}
@media(max-width:420px){.topbar{padding:14px 18px;gap:7px}.topbar .wordmark{font-size:22px}.topbar .case-home{font-size:10px}.case-language{padding:8px 10px}.topbar .case-name-part{animation:none;max-width:0;opacity:0}}
@media(prefers-reduced-motion:reduce){.case-name-part{animation:none;max-width:0;opacity:0}}
.topbar .wordmark span{padding:0;color:inherit}.topbar .wordmark .case-dot{color:var(--clay)}
