@font-face{font-family:"Geist";font-weight:500;font-display:swap;src:url("/assets/fonts/geist-sans-latin-500-normal.woff2") format("woff2")}
@font-face{font-family:"Geist";font-weight:600;font-display:swap;src:url("/assets/fonts/geist-sans-latin-600-normal.woff2") format("woff2")}
@font-face{font-family:"Geist";font-weight:700;font-display:swap;src:url("/assets/fonts/geist-sans-latin-700-normal.woff2") format("woff2")}
@font-face{font-family:"Geist Mono";font-weight:400;font-display:swap;src:url("/assets/fonts/geist-mono-latin-400-normal.woff2") format("woff2")}

:root{--ink:#0A0B0D;--panel:#121418;--line:#343941;--text:#EDEEF0;--muted:#9AA1AB;--signal:#C8F135;--signal-hi:#E2FF7A;--bad:#FF8A7A;
  --owl-big:min(58vw,340px);--owl-small:clamp(88px,17vw,172px);--word:clamp(42px,9.6vw,108px)}
*{box-sizing:border-box}
html{background:var(--ink);color-scheme:dark}
body{margin:0;min-height:100svh;background:var(--ink);color:var(--text);font-family:"Geist",ui-sans-serif,system-ui,-apple-system,"Segoe UI",sans-serif;
  background-image:radial-gradient(circle,#15181d 1.2px,transparent 1.8px);background-size:56px 56px;background-position:28px 28px;overflow-x:hidden}
body::after{content:"";position:fixed;inset:0;pointer-events:none;background:radial-gradient(ellipse at 50% 45%,transparent 38%,rgba(0,0,0,.72) 100%);z-index:1}
a{color:var(--signal)}a:hover{color:var(--signal-hi)}
:focus-visible{outline:2px solid var(--signal);outline-offset:3px;border-radius:6px}

/* stage light */
.spot{position:fixed;inset:0;pointer-events:none;z-index:0;
  background:radial-gradient(circle at 50% 44%,rgba(200,241,53,.13),rgba(237,238,240,.06) 20%,transparent 54%)}
.js .spot{opacity:0}
.js.lit .spot{animation:lamp 1.5s linear both,breathe 7s ease-in-out 1.5s infinite}
@keyframes lamp{0%{opacity:0}8%{opacity:.85}12%{opacity:.1}22%{opacity:.9}27%{opacity:.35}40%,100%{opacity:1}}
@keyframes breathe{50%{opacity:.72}}

/* cinema bars that pull away when the title lands */
.bar{position:fixed;left:0;right:0;height:11vh;background:#000;z-index:3;transform:scaleY(0);transition:transform 1.3s cubic-bezier(.7,0,.2,1)}
.bar-top{top:0;transform-origin:top}.bar-bottom{bottom:0;transform-origin:bottom}
.js.intro .bar{transform:scaleY(1)}
.js.intro.settled .bar{transform:scaleY(0)}

.stage{position:relative;z-index:2;min-height:100svh;display:grid;place-items:center;padding:72px 16px 64px}
.col{width:100%;max-width:760px;display:flex;flex-direction:column;align-items:center;text-align:center}

/* the logo: owl, then the name */
.lockup{display:flex;align-items:center;justify-content:center;gap:clamp(6px,1.4vw,16px);max-width:100%}
.owl{display:block;width:var(--owl-small);height:var(--owl-small);flex:0 0 auto;
  transition:width 1.7s cubic-bezier(.65,0,.2,1),height 1.7s cubic-bezier(.65,0,.2,1),opacity 1.1s ease,filter 1.4s ease}
.word{display:inline-block;overflow:hidden;white-space:nowrap;transition:width 1.7s cubic-bezier(.65,0,.2,1)}
.word-in{display:inline-block;padding:0 .06em .08em 0;font-size:var(--word);font-weight:700;letter-spacing:-.055em;line-height:1}
.ch{display:inline-block}
.lime{color:var(--signal)}

.js.intro .owl{width:var(--owl-big);height:var(--owl-big);opacity:0;filter:brightness(.35)}
.js.intro.lit .owl{opacity:1;filter:none}
.js.intro .word{width:0}
.js.intro.spread .owl{width:var(--owl-small);height:var(--owl-small)}
.js.intro .ch{opacity:0;transform:translateX(-.3em);transition:opacity .55s ease,transform .7s cubic-bezier(.2,.7,.2,1)}
.js.intro.spread .ch{opacity:1;transform:none}
.js.intro.spread .ch:nth-child(1){transition-delay:.35s}.js.intro.spread .ch:nth-child(2){transition-delay:.47s}
.js.intro.spread .ch:nth-child(3){transition-delay:.59s}.js.intro.spread .ch:nth-child(4){transition-delay:.71s}
.js.intro.spread .ch:nth-child(5){transition-delay:.9s}.js.intro.spread .ch:nth-child(6){transition-delay:1.02s}
.js.intro.spread .ch:nth-child(7){transition-delay:1.14s}

/* everything under the logo */
.content{display:grid;grid-template-rows:1fr;width:100%;transition:grid-template-rows 1.2s cubic-bezier(.65,0,.2,1),opacity 1s ease .35s}
.inner{min-height:0;overflow:hidden;display:flex;flex-direction:column;align-items:center;gap:18px;padding-top:28px}
.js.intro .content{grid-template-rows:0fr;opacity:0}
.js.intro.settled .content{grid-template-rows:1fr;opacity:1}

.pill{margin:0;padding:6px 12px;border-radius:999px;border:1px solid #3B4A18;background:#1B2208;color:var(--signal);
  font-family:"Geist Mono",ui-monospace,Menlo,monospace;font-size:12px;letter-spacing:.1em;text-transform:uppercase}
h1{margin:0;font-size:clamp(40px,8vw,84px);font-weight:600;letter-spacing:-.045em;line-height:1}
.sub{margin:0;max-width:30em;font-size:clamp(16px,2.2vw,19px);line-height:1.55;color:#B8BEC6;text-wrap:balance}

.notify{width:100%;max-width:480px;margin-top:10px;display:flex;flex-direction:column;gap:10px;text-align:left}
.notify label{font-size:14px;font-weight:500}
.row{display:flex;gap:10px;flex-wrap:wrap}
.row input{flex:1 1 220px;min-width:0;height:52px;padding:0 16px;border:1px solid var(--line);border-radius:12px;background:#0E1013;color:var(--text);font:500 16px "Geist",sans-serif}
.row input::placeholder{color:#7E858F}
.row input:focus-visible{outline-offset:0;border-color:var(--signal)}
.row button{flex:0 0 auto;height:52px;padding:0 22px;border:0;border-radius:12px;background:var(--signal);color:var(--ink);font:600 16px "Geist",sans-serif;cursor:pointer}
.row button:hover{background:var(--signal-hi)}
.row button[disabled]{opacity:.6;cursor:progress}
.hp{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}
.turnstile:empty{display:none}
.status{margin:0;min-height:1.4em;font-size:14px;line-height:1.4;color:var(--signal)}
.status.bad{color:var(--bad)}
.fine{margin:0;font-size:13px;line-height:1.5;color:var(--muted)}
.notify.done .row,.notify.done label{display:none}

.sound{position:fixed;top:16px;right:16px;z-index:5;height:44px;padding:0 14px;display:inline-flex;align-items:center;gap:8px;border-radius:999px;
  border:1px solid var(--line);background:rgba(18,20,24,.85);color:var(--text);font:500 14px "Geist",sans-serif;cursor:pointer}
.sound:hover{border-color:#4A515B}
.sound .ico-on{display:none}.sound[aria-pressed="true"] .ico-on{display:block}.sound[aria-pressed="true"] .ico-off{display:none}
.sound[aria-pressed="true"]{color:var(--signal);border-color:#3B4A18}
.sound.nudge{animation:nudge 1.8s ease-in-out infinite}
@keyframes nudge{50%{box-shadow:0 0 0 6px rgba(200,241,53,.16);border-color:var(--signal)}}
html:not(.js) .sound{display:none}

.foot{position:fixed;left:0;right:0;bottom:14px;z-index:2;text-align:center;font-family:"Geist Mono",ui-monospace,monospace;font-size:12px;color:#7E858F;pointer-events:none}
@media (max-height:640px){.foot{position:static;padding:0 0 16px}}

@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation:none !important;transition:none !important}
  .js .spot{opacity:1}
}