@font-face{font-family:"Cormorant Garamond";font-style:italic;font-weight:300;font-display:swap;src:url(fonts/cormorant-italic-300.woff2) format("woff2")}
@font-face{font-family:"Cormorant Garamond";font-style:normal;font-weight:300;font-display:swap;src:url(fonts/cormorant-300.woff2) format("woff2")}
@font-face{font-family:"IBM Plex Mono";font-style:normal;font-weight:300;font-display:swap;src:url(fonts/plexmono-300.woff2) format("woff2")}
@font-face{font-family:"IBM Plex Mono";font-style:normal;font-weight:400;font-display:swap;src:url(fonts/plexmono-400.woff2) format("woff2")}
:root{--ink:#09071a;--halide:#d8d4cb;--ash:#6b5a8f;--safelight:#9D6AEF;--deep:#310487;--mid:#5D14C6}
*{box-sizing:border-box;margin:0;padding:0}
html,body{min-height:100%}
body{background:var(--ink);color:var(--halide);font-family:"IBM Plex Mono",ui-monospace,monospace;font-weight:300;-webkit-font-smoothing:antialiased;
  display:grid;grid-template-rows:auto 1fr auto;min-height:100vh;padding:clamp(20px,3vw,36px)}
a{color:inherit;text-decoration:none}
header,footer{display:flex;justify-content:space-between;align-items:baseline;font-size:11px;letter-spacing:.2em;text-transform:uppercase;color:var(--ash)}
header b{font-weight:400;color:var(--halide)}
header a:hover,footer a:hover{color:var(--halide)}
main{display:flex;flex-direction:column;justify-content:center;align-items:center;text-align:center;gap:28px;padding:48px 0}
h1{font-family:"Cormorant Garamond",Georgia,serif;font-weight:300;font-style:italic;font-size:clamp(38px,7vw,96px);line-height:1;letter-spacing:-.01em;max-width:14ch}
.sub{font-size:12px;letter-spacing:.14em;color:var(--ash);max-width:48ch;line-height:1.8}
.lamp-dot::before{content:"";display:inline-block;width:6px;height:6px;border-radius:50%;background:var(--safelight);margin-right:12px;vertical-align:middle;box-shadow:0 0 12px var(--mid)}
.grain{position:fixed;inset:-50%;width:200%;height:200%;pointer-events:none;z-index:3;opacity:.16;animation:grain .6s steps(4) infinite;
  background:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='200' height='200'><filter id='n'><feTurbulence baseFrequency='.9' numOctaves='2' stitchTiles='stitch'/><feColorMatrix values='0 0 0 0 0  0 0 0 0 0  0 0 0 0 0  0 0 0 .5 0'/></filter><rect width='100%' height='100%' filter='url(%23n)'/></svg>")}
@keyframes grain{0%{transform:translate(0,0)}25%{transform:translate(-2%,1%)}50%{transform:translate(1%,-2%)}75%{transform:translate(-1%,-1%)}100%{transform:translate(2%,2%)}}
@media (prefers-reduced-motion:reduce){.grain{animation:none}}
:focus-visible{outline:1px solid var(--halide);outline-offset:4px}

.brand{display:inline-flex;align-items:center;gap:10px}
.brand img{display:block;transform:translateY(-1px)}

h1 em,.tenets p em{color:var(--safelight)}
a:hover{color:var(--halide)}
.cta:hover,.links a:hover,.contact:hover{border-color:var(--safelight)!important}

/* ---------- terminal ---------- */
#dbx-term{position:fixed;left:0;right:0;bottom:0;z-index:20;max-height:46vh;display:flex;flex-direction:column;background:rgba(9,7,26,.96);border-top:1px solid var(--ash);font-family:"IBM Plex Mono",ui-monospace,monospace;font-size:13px;letter-spacing:.04em;color:var(--halide);backdrop-filter:blur(6px);cursor:auto}
#dbx-term[hidden]{display:none}
#dbx-term .out{flex:1;overflow:auto;padding:16px 20px 8px;line-height:1.8;white-space:pre-wrap}
#dbx-term .out .cmd{color:var(--ash)}
#dbx-term .row{display:flex;gap:10px;padding:8px 20px 16px;align-items:center}
#dbx-term .ps{color:var(--safelight)}
#dbx-term input{flex:1;background:transparent;border:0;color:var(--halide);font:inherit;letter-spacing:inherit;outline:none;caret-color:var(--safelight)}
[data-term]{background:none;border:0;color:inherit;font:inherit;letter-spacing:inherit;text-transform:inherit;cursor:pointer;padding:0}
[data-term]:hover{color:var(--halide)}

/* ---------- print: everything comes out redacted ---------- */
@media print{
  @page{margin:20mm}
  body{background:#fff!important;color:#000!important;display:block;min-height:0;padding:0}
  .grain,.lamp,.cursor,.latent,#fixed,#dbx-term,footer button,[data-term],.links a small,img{display:none!important}
  header,footer{color:#000}
  h1{color:#000;font-size:36pt}
  .sub,.tenets p,.tenets h2,td,.foot,.links a,label,textarea,input,.name,.intro p,.status{background:#000!important;color:#000!important;border-color:#000!important;-webkit-print-color-adjust:exact;print-color-adjust:exact}
  .r{background:#000!important}
  a[href^="mailto"],.contact,header b{background:none!important;color:#000!important}
  body::after{content:"Printed from darkbox.agency. Redacted by default.";display:block;margin-top:24pt;font:9pt "IBM Plex Mono",monospace;letter-spacing:.2em;text-transform:uppercase;color:#000}
}
