:root{
  --ground:#06090C; --surface:#0C1218; --surface-2:#121A22; --surface-3:#18222C;
  --hairline:rgba(140,200,190,.10); --hairline-2:rgba(140,200,190,.20);
  --graticule:rgba(53,240,192,.045);
  --trace:#35F0C0; --trace-dim:rgba(53,240,192,.14);
  --hot:#FFB020;   --hot-dim:rgba(255,176,32,.14);
  --fail:#FF5C46;  --fail-dim:rgba(255,92,70,.16);
  --text:#E4EDF0; --text-2:#9DAFB6; --text-3:#7A8C94;   /* text-3 lifted from #62757D for AA */
  --radius:3px; --radius-lg:4px;
  --font-display:"Azeret Mono",ui-monospace,"SF Mono",Menlo,monospace;
  --font-body:"Public Sans",-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
  --font-code:"JetBrains Mono",ui-monospace,"SF Mono",Menlo,monospace;
  --motion:cubic-bezier(.22,.61,.36,1);
  --page-w:1240px;
  color-scheme:dark;
}
*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--ground);color:var(--text);font-family:var(--font-body);
  font-size:15px;line-height:1.6;-webkit-font-smoothing:antialiased;overflow-x:hidden}
a{color:inherit;text-decoration:none}
button{font:inherit;color:inherit;background:none;border:none;cursor:pointer}
:focus-visible{outline:2px solid var(--trace);outline-offset:3px;border-radius:2px}
.graticule{position:fixed;inset:0;z-index:0;pointer-events:none;
  background-image:linear-gradient(var(--graticule) 1px,transparent 1px),
                   linear-gradient(90deg,var(--graticule) 1px,transparent 1px);
  background-size:44px 44px;
  mask-image:radial-gradient(ellipse 130% 100% at 50% 0%,#000 25%,transparent 80%);
  -webkit-mask-image:radial-gradient(ellipse 130% 100% at 50% 0%,#000 25%,transparent 80%)}
.wrap{position:relative;z-index:1;max-width:var(--page-w);margin:0 auto;padding:0 24px}
[id]{scroll-margin-top:112px}
.label{font-family:var(--font-display);font-size:10px;font-weight:600;letter-spacing:.14em;
  text-transform:uppercase;color:var(--text-3)}
#progress{position:fixed;top:0;left:0;height:2px;width:0;z-index:70;
  background:linear-gradient(90deg,var(--hot),var(--trace));box-shadow:0 0 10px rgba(53,240,192,.7)}

/* skip link */
.skip{position:absolute;left:-9999px;top:0;z-index:200;background:var(--trace);color:#04120E;
  padding:11px 18px;font-family:var(--font-display);font-size:12px;font-weight:700;
  letter-spacing:.08em;text-transform:uppercase;border-radius:0 0 4px 0}
.skip:focus{left:0}

/* wordmark + buzz */
.wm{font-family:var(--font-display);font-weight:800;font-size:15px;letter-spacing:-.02em;
  color:var(--text);white-space:nowrap;display:inline-flex}
.wm i{font-style:normal;display:inline-block;will-change:transform;transition:text-shadow .2s}
.wm .sep{color:var(--trace)}
@keyframes buzz{
  0%  {transform:translate(0,0) rotate(0)}
  20% {transform:translate(calc(var(--amp) * -1px), calc(var(--amp) * .7px)) rotate(calc(var(--amp) * -.5deg))}
  40% {transform:translate(calc(var(--amp) * .9px),  calc(var(--amp) * -.6px)) rotate(calc(var(--amp) * .4deg))}
  60% {transform:translate(calc(var(--amp) * -.7px), calc(var(--amp) * -.9px)) rotate(calc(var(--amp) * .5deg))}
  80% {transform:translate(calc(var(--amp) * .8px),  calc(var(--amp) * .5px)) rotate(calc(var(--amp) * -.3deg))}
  100%{transform:translate(0,0) rotate(0)}
}
.buzz .wm i{animation:buzz .055s linear infinite}
.buzz .wm{text-shadow:.6px 0 rgba(255,176,32,.55), -.6px 0 rgba(53,240,192,.55)}

/* header */
header.site{position:sticky;top:0;z-index:40;background:rgba(6,9,12,.86);
  backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);border-bottom:1px solid var(--hairline)}
.hbar{display:flex;align-items:center;gap:22px;height:58px}
.mark{display:flex;align-items:center;gap:9px;flex-shrink:0}
nav.main{display:flex;gap:2px}
nav.main a{font-family:var(--font-display);font-size:11px;font-weight:600;letter-spacing:.1em;
  text-transform:uppercase;color:var(--text-3);padding:7px 11px;border-radius:var(--radius);
  white-space:nowrap;transition:color .16s var(--motion),background .16s var(--motion)}
nav.main a:hover{color:var(--text);background:var(--surface-2)}
nav.main a.on{color:var(--trace);background:var(--trace-dim)}
.hspace{flex:1}
.ghost{font-family:var(--font-display);font-size:11px;font-weight:600;letter-spacing:.08em;
  text-transform:uppercase;padding:8px 14px;border:1px solid var(--hairline-2);
  border-radius:var(--radius);color:var(--text-2);transition:all .16s var(--motion);white-space:nowrap}
.ghost:hover{color:var(--ground);background:var(--trace);border-color:var(--trace)}
@media (max-width:860px){
  .hbar{flex-wrap:wrap;height:auto;padding-top:8px;padding-bottom:8px;gap:10px 16px}
  nav.main{order:3;width:100%;overflow-x:auto;-webkit-overflow-scrolling:touch;scrollbar-width:none;margin:0 -24px;padding:0 20px}
  nav.main::-webkit-scrollbar{display:none}
  .ghost{padding:7px 11px}
}

/* ad slots — reserved, dormant. Nothing renders until body.ads-on is set by a consent-aware loader (ADS.md). */
.ad{display:none}
body.ads-on .ad{display:block;margin:34px auto 0}
body.ads-on .ad[hidden]{display:block}
.ad-box{min-height:120px;border:1px dashed var(--hairline-2);border-radius:var(--radius-lg);display:grid;place-items:center;
  background:var(--surface);color:var(--text-3)}

/* footer */
footer.site{position:relative;z-index:1;margin-top:70px;border-top:1px solid var(--hairline);padding:32px 0 44px}
.f-in{display:flex;justify-content:space-between;gap:24px;flex-wrap:wrap;align-items:flex-start}
.f-note{font-size:12.5px;color:var(--text-3);max-width:44ch;margin:10px 0 0}
.f-note a{color:var(--text-2);border-bottom:1px solid var(--hairline-2)}
.f-cols{display:flex;gap:48px;flex-wrap:wrap}
.f-col{display:flex;flex-direction:column;gap:7px}
.f-col a{font-size:12.5px;color:var(--text-3);transition:color .14s var(--motion)}
.f-col a:hover{color:var(--trace)}

@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  .buzz .wm i{animation:none}
  .buzz .wm{text-shadow:none}
}
