/* Component: fixed nav bar + ticker */
/* ---------- NAV (169:3736) ---------- */
.top{position:fixed;left:50%;top:8px;z-index:20;width:min(calc(755 * var(--n)), calc(100vw - 24px));transform:translateX(-50%)}
.nav{position:relative;height:calc(67 * var(--n));display:flex;align-items:center;justify-content:space-between;padding:calc(8.69 * var(--n));background:var(--ink);border-radius:calc(7.45 * var(--n));box-shadow:0 0 0 1px rgba(244,244,244,.08)}
.menu{display:flex;align-items:center;gap:calc(14 * var(--n));height:calc(50 * var(--n));padding:0 calc(19.9 * var(--n)) 0 0;color:var(--bg);font-size:calc(22.35 * var(--n));line-height:1;letter-spacing:-.02em}
.menu .bx{display:grid;place-items:center;width:calc(50 * var(--n));height:calc(50 * var(--n));border-radius:calc(5 * var(--n));background:#343131;transition:background .3s}
.menu:hover .bx{background:#403c3c}
.burger{position:relative;width:calc(24 * var(--n));height:calc(8 * var(--n))}
.burger::before,.burger::after{content:"";position:absolute;left:0;right:0;height:1px;background:var(--bg);transition:transform .4s var(--ease-out)}
.burger::before{top:0}.burger::after{bottom:0}
.menu:hover .burger::before{transform:translateY(calc(4 * var(--n)))}
.menu:hover .burger::after{transform:translateY(calc(-4 * var(--n)))}
.logo{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);display:grid;place-items:center}
.logo img,.logo svg{grid-area:1/1;display:block;overflow:visible}
.logo path,.logo g{transform-box:fill-box}
.logo .full{width:calc(141.433 * var(--n));height:calc(32.733 * var(--n))}
.book{margin-left:auto;height:calc(50 * var(--n));padding:0 20px;display:grid;place-items:center;background:var(--green);border-radius:calc(6 * var(--n));color:var(--ink);font-size:calc(22.35 * var(--n));letter-spacing:-.02em;white-space:nowrap;overflow:hidden}
.book span{display:block;transition:transform .45s var(--ease-out)}
.book:hover span{transform:translateY(-2px)}

/* menu hidden for now: there is no menu yet (2026-10-21). Remove this rule when it exists */
.nav .menu{display:none}

/* ticker under the nav (Osmo-style) */
.tick{margin-top:calc(8 * var(--n));height:calc(26 * var(--n));background:var(--green);border-radius:calc(2.48 * var(--n));overflow:hidden;display:flex;align-items:center;font-family:var(--mono);font-size:calc(15 * var(--n));line-height:1;color:var(--ink);white-space:nowrap}
.tick .run{display:flex;flex:none;will-change:transform}
.tick .run span{padding:0 calc(14 * var(--n))}
.tick .run i{font-style:normal}


@media (max-width:820px){
  .top{top:10px;width:calc(100vw - 20px)}
  .nav{height:58px;padding:8px;border-radius:8px}
  .menu{height:42px;gap:10px;padding:0 8px;font-size:16px}
  .burger{width:22px;height:8px}
  .logo .full{width:86px;height:19.9px}
  .book{height:42px;padding:0 20px;font-size:15px;border-radius:3px}
  .tick{margin-top:6px;height:24px;font-size:13px;border-radius:3px}
}