@font-face { font-family: "Anton"; src: url(fonts/anton-400-latin.woff2) format("woff2"); font-display: swap; }
@font-face { font-family: "Oswald"; font-weight: 500; src: url(fonts/oswald-500-latin.woff2) format("woff2"); font-display: swap; }
@font-face { font-family: "Oswald"; font-weight: 700; src: url(fonts/oswald-700-latin.woff2) format("woff2"); font-display: swap; }
@font-face { font-family: "Inter"; font-weight: 400; src: url(fonts/inter-400-latin.woff2) format("woff2"); font-display: swap; }
@font-face { font-family: "Inter"; font-weight: 600; src: url(fonts/inter-600-latin.woff2) format("woff2"); font-display: swap; }
:root { --lime: #c6ff1a; --pink: #ff2d95; --ink: #f2f2f2; --mut: #8c8c8c; --bg: #060606; --mono: ui-monospace, "Cascadia Mono", Consolas, "Courier New", monospace; }
* { box-sizing: border-box; margin: 0; }
html, body { min-height: 100%; background: var(--bg); color: var(--ink); font-family: "Inter", system-ui, sans-serif; }
body { min-height: 100dvh; display: grid; grid-template-columns: minmax(0, 1fr); align-content: center; padding: 40px max(20px, 10vw) 70px; }
.lime { color: var(--lime); } .pink { color: var(--pink); } .dim { color: #4f6a00; }

.brand { display: flex; align-items: center; gap: 16px; margin-bottom: 22px; }
.brand svg { width: 64px; height: 65px; flex: none; }
.word { font-family: "Anton", Impact, sans-serif; font-size: clamp(48px, 9vw, 118px); letter-spacing: .02em; line-height: .9; text-transform: uppercase; }
.word b { color: var(--pink); font-weight: 400; }

/* Terminal lines type in one after another */
.term { font: 20px/1.9 var(--mono); color: #9fd400; }
.term > div { opacity: 0; animation: show .01s forwards; white-space: pre; }
.term > div:nth-child(1) { animation-delay: .3s; }
.term > div:nth-child(2) { animation-delay: .9s; }
.term > div:nth-child(3) { animation-delay: 1.4s; }
.term > div:nth-child(4) { animation-delay: 1.9s; }
.term > div:nth-child(5) { animation-delay: 2.5s; }
.term > div:nth-child(6) { animation-delay: 3.1s; }
@keyframes show { to { opacity: 1; } }
.cur { display: inline-block; width: 10px; height: 18px; background: var(--lime); vertical-align: -3px; animation: blink 1s steps(1) infinite; }
@keyframes blink { 50% { opacity: 0; } }

.cta { margin-top: 30px; opacity: 0; animation: show .01s 3.6s forwards; }
.btn { display: inline-flex; align-items: center; gap: 12px; min-height: 52px; padding: 0 26px; border: 2px solid var(--lime); background: var(--lime); color: #000; font: 700 17px "Oswald", sans-serif; letter-spacing: .14em; text-transform: uppercase; cursor: pointer; transition: background .15s, color .15s; }
.btn:hover { background: #000; color: var(--lime); }
.btn:focus-visible, .x:focus-visible, .pick label:focus-within, input:focus-visible { outline: 3px solid var(--pink); outline-offset: 3px; }
.btn[disabled] { opacity: .6; cursor: wait; }
.cta p { margin-top: 12px; font: 13px/1.5 var(--mono); color: #6f6f6f; }

.foot { position: fixed; left: 0; right: 0; bottom: 0; padding: 14px max(20px, 10vw); font: 500 11px/1.4 "Oswald", sans-serif; letter-spacing: .14em; color: #777; text-transform: uppercase; background: linear-gradient(transparent, var(--bg) 40%); }

/* Pop-up */
dialog { margin: auto; width: min(480px, calc(100vw - 32px)); max-height: calc(100dvh - 32px); padding: 0; border: 1px solid #2a2a2a; border-top: 3px solid var(--lime); background: #0c0c0c; color: var(--ink); }
dialog::backdrop { background: rgba(0,0,0,.82); }
.pop { padding: 26px 24px 22px; position: relative; }
.pop h2 { font: 400 34px/1 "Anton", sans-serif; letter-spacing: .03em; text-transform: uppercase; }
.pop h2 b { color: var(--lime); font-weight: 400; }
.pop .sub { margin: 8px 0 20px; font: 14px/1.5 var(--mono); color: #9a9a9a; }
.x { position: absolute; top: 10px; right: 10px; width: 44px; height: 44px; border: 0; background: none; color: #9a9a9a; font-size: 26px; cursor: pointer; }
.x:hover { color: var(--ink); }
fieldset { border: 0; padding: 0; margin: 0 0 16px; }
legend, .lab { display: block; margin-bottom: 8px; font: 700 12px "Oswald", sans-serif; letter-spacing: .16em; text-transform: uppercase; color: #bdbdbd; }
.pick { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.pick label { display: block; padding: 12px 12px 11px; border: 1px solid #333; cursor: pointer; }
.pick input { position: absolute; opacity: 0; pointer-events: none; }
.pick strong { display: block; font: 700 16px "Oswald", sans-serif; letter-spacing: .1em; }
.pick span { display: block; margin-top: 3px; font-size: 12px; line-height: 1.35; color: #8c8c8c; }
.pick label:has(input:checked) { border-color: var(--lime); background: rgba(198,255,26,.07); }
.pick label:has(input:checked) strong { color: var(--lime); }
.field { margin-bottom: 16px; }
.field input { width: 100%; height: 48px; padding: 0 14px; border: 1px solid #333; background: #000; color: var(--ink); font: 16px "Inter", sans-serif; }
.field input[aria-invalid] { border-color: var(--pink); }
.field small { display: block; margin-top: 6px; font-size: 12px; color: #777; }
.check { display: flex; gap: 10px; align-items: flex-start; margin-bottom: 18px; font-size: 14px; line-height: 1.4; color: #cfcfcf; cursor: pointer; }
.check input { width: 20px; height: 20px; margin-top: 1px; accent-color: var(--lime); flex: none; }
.hp { position: absolute; left: -9999px; width: 1px; height: 1px; overflow: hidden; }
.msg { margin-bottom: 14px; font: 14px/1.4 var(--mono); color: var(--pink); }
.pop .btn { width: 100%; justify-content: center; }
.fine { margin-top: 14px; font-size: 12px; line-height: 1.5; color: #6f6f6f; }
.done { font: 17px/1.8 var(--mono); color: #9fd400; }
.done p { margin-top: 14px; font: 15px/1.5 "Inter", sans-serif; color: #bdbdbd; }

@media (max-width: 600px) {
  body { padding: 32px 20px 70px; }
  .brand svg { width: 44px; height: 45px; }
  .term { font-size: 14px; }
  .cur { width: 8px; height: 14px; }
  .btn { width: 100%; justify-content: center; }
  .foot { padding: 14px 20px; }
  .pop h2 { font-size: 28px; }
}
@media (prefers-reduced-motion: reduce) { *, *::before { animation: none !important; } .term > div, .cta { opacity: 1; } }
.opt { color: #666; }
.ts { margin-bottom: 14px; min-height: 0; }
.foot a { color: #8a8a8a; text-decoration: none; border-bottom: 1px solid #333; }
.foot a:hover { color: var(--lime); }
.fine a { color: #9a9a9a; }
/* Privacy page */
body.doc { display: block; padding: 40px max(20px, 10vw) 80px; }
.doc-main { max-width: 680px; }
.doc-back { display: inline-block; margin-bottom: 18px; font: 600 13px var(--mono); color: var(--lime); text-decoration: none; }
.doc .word { font-size: clamp(44px, 7vw, 72px); }
.doc-date { margin: 8px 0 26px; font: 13px var(--mono); color: #777; }
.doc h2 { margin: 26px 0 8px; font: 700 16px "Oswald", sans-serif; letter-spacing: .14em; text-transform: uppercase; color: var(--lime); }
.doc p, .doc li { font-size: 16px; line-height: 1.6; color: #cfcfcf; }
.doc ul { padding-left: 20px; display: grid; gap: 6px; }
.doc b { color: #fff; }
.doc a { color: var(--lime); }
.doc .foot { position: static; padding: 30px 0 0; background: none; }