/* Same font, size and text baseline as the other nav links (Cato Oct 23: it sat lower, in Mono); only the › is blue.
   Wire top nav: "› desk" item, option D3b (approved).
   Markup:
   <a class="nav-desk" href="/desk" aria-current="page">
     <span class="chev" aria-hidden="true">›</span><span class="label">desk</span>
   </a>
   aria-current="page" only when on /desk. Other nav items unchanged. */

:root { --bg:#05080f; --fg:#e7eef8; --muted:#8ea0b8; --accent:#1c8cff; --border:#1a2738; }

.nav-desk { display:inline-flex; align-items:baseline; gap:6px; text-decoration:none; font:inherit; line-height:inherit; }
.nav-desk .chev  { font:700 1.15em/0 "IBM Plex Sans", sans-serif; color:var(--accent); transform:translateY(-1px); transition:transform .15s ease-out; }
.nav-desk .label { font:inherit; line-height:inherit; color:var(--muted); transition:color .15s ease-out; }

/* small blue square cursor after the label: invisible at rest (space kept, no shift), blinks only while the link is hovered or
   keyboard-focused (Cato Oct 25: it showed by default and looked odd; 4px = ~70% of the old 6px, near the x-height, whole px = crisp) */
.nav-desk::after { content:""; flex:none; width:4px; height:4px; margin-left:-3px; background:var(--accent); opacity:0; align-self:baseline; }

/* hover / keyboard focus / active page */
.nav-desk:hover .chev, .nav-desk:focus-visible .chev, .nav-desk[aria-current="page"] .chev { transform:translate(3px,-1px); }
.nav-desk:hover .label, .nav-desk:focus-visible .label, .nav-desk[aria-current="page"] .label { color:var(--accent); }
/* the square blinks ONLY while the link is hovered / keyboard-focused, never at rest or on the active page (Cato Oct 23 + Oct 25).
   Hover only on real pointers, so a tap on a phone does not leave it stuck on. */
.nav-desk[aria-current="page"]::after { opacity:0; animation:none; }
.nav-desk:focus-visible::after { animation:desk-cursor 1s steps(1) infinite; }
@media (hover: hover) { .nav-desk:hover::after { animation:desk-cursor 1s steps(1) infinite; } }
@keyframes desk-cursor { 0%,49% { opacity:1; } 50%,100% { opacity:0; } }

/* reduced motion: no slide, no blink, steady square */
@media (prefers-reduced-motion: reduce) {
  .nav-desk .chev, .nav-desk .label { transition:none; }
  .nav-desk::after { animation:none !important; }
  .nav-desk:hover .chev, .nav-desk:focus-visible .chev, .nav-desk[aria-current="page"] .chev { transform:translateY(-1px); }
  .nav-desk:focus-visible::after { opacity:1; }
}
@media (prefers-reduced-motion: reduce) and (hover: hover) {
  .nav-desk:hover::after { opacity:1; }
}

/* Wire pages (design2): the host pages' generic nav rules (underline/box-shadow on links, a.cur) never reach this item. */
header nav a.nav-desk, .nv a.nav-desk, nav a.nav-desk { text-decoration:none !important; box-shadow:none !important; background:none; border:0; font-style:normal; }
header nav a.nav-desk:hover, .nv a.nav-desk:hover { text-decoration:none !important; box-shadow:none !important; }
/* Some Wire pages use a generic .chev class elsewhere (panel toggles); keep it off this item. */
a.nav-desk .chev { border:0; border-radius:0; padding:0; margin:0; background:none; box-shadow:none; opacity:1; white-space:nowrap; }
/* Narrow screens: the Wire nav scrolls sideways, so "› desk" sticks to its right edge and is always in view (other items
   scroll under it behind a short fade). Desktop is unchanged. */
@media (max-width: 760px) {
  header nav a.nav-desk, .nv a.nav-desk { position: sticky; right: 0; z-index: 1; flex: none; padding-left: 16px; margin-left: -16px;
    background: linear-gradient(to right, rgba(5,8,15,0), var(--bg, #05080f) 12px) !important; }
}
/* Site top nav (Wire pages: Governance, Macro, Unlocks, Trends, Stats): one 20px gap at every width (fix-pages Oct 23: /trends and
   /stats had their own 12px at <=820px). Pages with an inline nav style already use 20px. */
header > .wrap > nav { gap: 20px; }
/* Metric-matched fallbacks for IBM Plex (fix-pages Oct 23): until the web font arrives (display=swap) text is set in a local
   Arial / Courier-class face scaled to Plex's advance widths and line metrics, so the swap does not reflow content that is now
   there at first paint (CLS). Widths measured against Plex Sans 400/500/600/700 and Plex Mono; Plex ascent/descent 1.025/0.275. */
@font-face{font-family:"Plex Sans FB";font-weight:400;src:local("Arial"),local("ArialMT"),local("Liberation Sans"),local("Arimo"),local("Helvetica");size-adjust:99.66%;ascent-override:102.85%;descent-override:27.59%;line-gap-override:0%}
@font-face{font-family:"Plex Sans FB";font-weight:500;src:local("Arial"),local("ArialMT"),local("Liberation Sans"),local("Arimo"),local("Helvetica");size-adjust:101.67%;ascent-override:100.82%;descent-override:27.05%;line-gap-override:0%}
@font-face{font-family:"Plex Sans FB";font-weight:600;src:local("Arial Bold"),local("Arial-BoldMT"),local("Liberation Sans Bold"),local("Arimo Bold"),local("Helvetica Bold");size-adjust:96.55%;ascent-override:106.16%;descent-override:28.48%;line-gap-override:0%}
@font-face{font-family:"Plex Sans FB";font-weight:700;src:local("Arial Bold"),local("Arial-BoldMT"),local("Liberation Sans Bold"),local("Arimo Bold"),local("Helvetica Bold");size-adjust:97.78%;ascent-override:104.83%;descent-override:28.12%;line-gap-override:0%}
@font-face{font-family:"Plex Mono FB";font-weight:400 700;src:local("Courier New"),local("CourierNewPSMT"),local("Liberation Mono"),local("Cousine"),local("Menlo");size-adjust:100%;ascent-override:102.5%;descent-override:27.5%;line-gap-override:0%}