/* ============================================================
   BETA — rectangular nav, sitewide (every page except b.html,
   the untouched original home page).
   Corner roundness: change the two numbers below, or override
   --a-dock-radius / --a-dock-inner-radius (Variant A does this
   from its config.js).  0 = sharp corners, 999px = pill.
   ============================================================ */
.nav-dock, .toggle-dock{
  border-radius: var(--a-dock-radius, 10px);
  border-color: color-mix(in srgb, var(--ink) 16%, transparent);
}
.toggle-dock{ padding:6px; gap:8px; }
.mode-toggle{
  border-radius: var(--a-dock-inner-radius, 7px);
  background: color-mix(in srgb, var(--ink) 8%, transparent);
}
.mode-btn{ border-radius: calc(var(--a-dock-inner-radius, 7px) - 1px); padding:9px 18px; }
.mute-btn{ border-radius: var(--a-dock-inner-radius, 7px); }

/* plain logo mark (no dark circle): black in light mode, white in dark mode */
.logo-tab{ background:transparent; border-radius: var(--a-dock-inner-radius, 7px); width:46px; }
.logo-tab .logo-mark{ width:22px; }
.logo-tab .logo-mark-light{ display:none; }
.logo-tab .logo-mark-dark{ display:block; }
body[data-theme="dark"] .logo-tab .logo-mark-light{ display:block; }
body[data-theme="dark"] .logo-tab .logo-mark-dark{ display:none; }
.nav-links a{ border-radius: var(--a-dock-inner-radius, 7px); }

/* phone menu drawer + hamburger */
.nav-hamburger{ border-radius: var(--a-dock-inner-radius, 7px); }
@media (max-width:640px){
  .nav-collapsible{ border-radius: var(--a-dock-radius, 10px); }
  .nav-links a{ border-radius: var(--a-dock-inner-radius, 7px); }
}