/* ── Unified private-preview navigation ─────────────────────────
   One bar, pixel-identical on every password-protected page. Fully
   self-contained: it defines its own fonts, sizes, colors, and gutter
   so it renders the same regardless of which wing's stylesheet
   (splash.css or understand/essay.css) the page loads. Estate pages
   keep the .topbar class on the shell — filing-ladder and index-bar
   docking JS measures it — so this uses header.pvbar specificity to
   beat splash.css's .topbar rules, and must load AFTER them. */

header.pvbar{
  --pv-paper:oklch(0.13 0.006 75);
  --pv-ink:oklch(0.96 0.01 85);
  --pv-muted:oklch(0.62 0.012 85);
  --pv-faint:oklch(0.42 0.010 85);
  --pv-ghost:oklch(0.28 0.008 85);
  --pv-signal:oklch(0.82 0.16 75);
  --pv-mono:'JetBrains Mono',ui-monospace,Menlo,monospace;
  --pv-display:'Space Grotesk',-apple-system,system-ui,sans-serif;
  --pv-gutter:clamp(20px,4vw,56px);
  position:sticky;top:0;z-index:40;
  display:flex;justify-content:space-between;align-items:center;
  column-gap:28px;row-gap:10px;flex-wrap:wrap;
  padding:12px var(--pv-gutter);
  font-family:var(--pv-mono);font-size:11.5px;line-height:1.4;
  letter-spacing:normal;text-transform:none;color:var(--pv-muted);
  background:color-mix(in oklch,var(--pv-paper) 82%,transparent);
  backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);
  border-bottom:1px solid var(--pv-ghost);
}
header.pvbar .pvbrand{display:inline-flex;align-items:center;gap:10px;color:var(--pv-ink);font-family:var(--pv-display);font-weight:700;font-size:13.5px;letter-spacing:.08em;text-decoration:none;white-space:nowrap;margin:0}
header.pvbar .pvglyph{width:13px;height:13px;border:1.5px solid var(--pv-signal);transform:rotate(45deg);position:relative;flex:none;box-shadow:none;background:transparent}
header.pvbar .pvglyph::before{content:'';position:absolute;inset:3px;background:var(--pv-signal)}
header.pvbar .pvtm{font-size:.55em;vertical-align:.4em;color:var(--pv-faint);font-weight:400;letter-spacing:0}
header.pvbar .pvtag{color:var(--pv-faint);font-family:var(--pv-mono);font-weight:400;font-size:9.5px;letter-spacing:.14em;text-transform:uppercase;border:1px solid var(--pv-ghost);padding:3px 7px;border-radius:2px;margin-left:6px;white-space:nowrap}
header.pvbar .pvnav{display:flex;column-gap:24px;row-gap:8px;flex-wrap:wrap;align-items:baseline;margin:0}
header.pvbar .pvgroup{display:flex;gap:13px;align-items:baseline;white-space:nowrap}
header.pvbar .pvlabel{color:var(--pv-faint);letter-spacing:.2em;text-transform:uppercase;font-size:9.5px}
header.pvbar .pvgroup a{color:var(--pv-muted);text-decoration:none;font-family:var(--pv-mono);font-size:11.5px;letter-spacing:.05em;text-transform:none;transition:color 120ms ease}
header.pvbar .pvgroup a:hover{color:var(--pv-signal)}
header.pvbar .pvgroup a.on{color:var(--pv-signal)}
header.pvbar .pvsep{width:1px;align-self:stretch;background:var(--pv-ghost)}
@media (max-width:860px){
  header.pvbar{font-size:11px;column-gap:18px}
  header.pvbar .pvnav{width:100%}
  header.pvbar .pvsep{display:none}
  header.pvbar .pvgroup{flex-wrap:wrap;white-space:normal;row-gap:4px}
  header.pvbar .pvgroup a{font-size:11px}
}