@font-face{font-family:Geist;font-style:normal;font-weight:100 900;font-display:swap;src:url(/fonts/geist-latin.woff2) format('woff2')}
@font-face{font-family:"Geist Mono";font-style:normal;font-weight:100 900;font-display:swap;src:url(/fonts/geist-mono-latin.woff2) format('woff2')}

/* Near-black base, Bone text, one yellow signal used sparingly (caret, focus, hover). */
:root{
  --void:#070707; --surface:#0f0f0f; --border:#1a1a1a; --border-2:#262626;
  --paper:#ece8e1; --paper-2:#b9b5ae; --muted:#6f6b66; --accent:#f2d43b;
  --sans:Geist,Inter,system-ui,sans-serif; --mono:"Geist Mono",ui-monospace,monospace;
  --pad:clamp(16px,6vw,96px);
  color-scheme:dark;
}

*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;background:var(--void)}
body{margin:0;min-height:100vh;min-height:100svh;display:flex;flex-direction:column;overflow-x:hidden;position:relative;
  color:var(--paper);font-family:var(--sans);font-size:17px;line-height:1.6;-webkit-font-smoothing:antialiased;
  background-color:var(--void);
  background-image:radial-gradient(rgba(236,232,225,.045) 1px,transparent 1.3px);
  background-size:22px 22px;background-position:11px 11px}
/* Film grain */
body:before{content:"";position:fixed;inset:0;z-index:-1;pointer-events:none;background:url(/grain.svg);opacity:.09;mix-blend-mode:overlay}
/* Vignette: pulls the edges into black */
body:after{content:"";position:fixed;inset:0;z-index:-1;pointer-events:none;background:radial-gradient(ellipse 80% 75% at 40% 50%,transparent 40%,rgba(0,0,0,.75) 100%)}
h1,p,ul{margin:0}
ul{padding:0;list-style:none}
a{color:inherit}
::selection{background:var(--accent);color:var(--void)}
:focus-visible{outline:1px solid var(--accent);outline-offset:4px}

/* Very faint scanlines, barely perceptible */
.scan{position:fixed;inset:0;z-index:-1;pointer-events:none;
  background:repeating-linear-gradient(to bottom,rgba(255,255,255,.018) 0 1px,transparent 1px 3px)}

/* Halftone crescent from the kit symbol, dim, bleeding off the right */
.mark{position:fixed;z-index:-2;pointer-events:none;
  width:min(96vh,920px);aspect-ratio:1;right:calc(min(96vh,920px) * -.3);top:50%;translate:0 -50%;
  background:url(/mark-dither.svg) center/contain no-repeat;opacity:.11;
  -webkit-mask-image:radial-gradient(circle at 50% 50%,#000 28%,transparent 70%);mask-image:radial-gradient(circle at 50% 50%,#000 28%,transparent 70%)}

/* Registration marks in the corners */
.corner{position:fixed;width:14px;height:14px;pointer-events:none;border-color:var(--border-2);border-style:solid;border-width:0}
.tl{top:16px;left:16px;border-top-width:1px;border-left-width:1px}
.tr{top:16px;right:16px;border-top-width:1px;border-right-width:1px}
.bl{bottom:16px;left:16px;border-bottom-width:1px;border-left-width:1px}
.br{bottom:16px;right:16px;border-bottom-width:1px;border-right-width:1px}

.meta,.foot{display:flex;justify-content:space-between;gap:16px;width:100%;max-width:1200px;margin-inline:auto;padding:28px var(--pad);
  font-family:var(--mono);font-size:11px;letter-spacing:.16em;text-transform:uppercase;color:var(--muted)}

.page{flex:1;display:flex;flex-direction:column;justify-content:center;align-items:flex-start;
  width:100%;max-width:1200px;margin-inline:auto;padding:48px var(--pad)}

.brand{display:flex;align-items:center;gap:16px;margin-bottom:56px}
.brand .sym{width:40px;height:40px}
.brand .word{width:164px;height:auto}

.status{display:flex;align-items:center;gap:8px;font-family:var(--mono);font-size:13px;letter-spacing:.04em;color:var(--muted);margin-bottom:20px}
.status .prompt,.status .arrow{color:#4a4744}
.status .val{color:var(--paper-2)}
.caret{display:inline-block;width:8px;height:15px;margin-left:2px;background:var(--accent);animation:blink 1.1s steps(1) infinite}
@keyframes blink{50%{opacity:0}}
@media (prefers-reduced-motion:reduce){.caret{animation:none}}

.lede{max-width:30ch;font-size:clamp(24px,3vw,32px);line-height:1.25;font-weight:500;letter-spacing:-.02em;color:var(--paper);margin-bottom:40px}

.mail{font-family:var(--mono);font-size:15px;color:var(--paper-2);text-decoration:none;border-bottom:1px solid var(--border-2);padding-bottom:3px;transition:color .2s,border-color .2s;margin-bottom:28px}
.mail:hover{color:var(--paper);border-color:var(--accent)}

.social{display:flex;flex-wrap:wrap;gap:10px}
.social a{display:inline-flex;align-items:center;gap:10px;height:42px;padding:0 16px;
  border:1px solid var(--border-2);background:rgba(15,15,15,.8);
  font-family:var(--mono);font-size:12px;letter-spacing:.14em;text-transform:uppercase;color:var(--paper-2);text-decoration:none;
  transition:color .2s,border-color .2s,background-color .2s}
.social a:hover{color:var(--paper);border-color:#4a4744;background:var(--surface)}
.social a:hover svg{color:var(--accent)}
.social svg{width:15px;height:15px;fill:currentColor;transition:color .2s}

@media (max-width:640px){
  .mark{width:110vw;right:-45vw;opacity:.08}
  .brand{margin-bottom:40px}
  .meta span:last-child,.foot span:last-child{display:none}
  .corner{display:none}
}