:root{
  --mono:"Courier Prime","Courier New",monospace;
  --sans:"Inter",sans-serif;
  --ease:cubic-bezier(.22,1,.36,1);
}
*{box-sizing:border-box}
html,body{margin:0;min-height:100%;background:#000}
body{min-height:100vh;color:#fff;font-family:var(--mono);-webkit-font-smoothing:antialiased}
button,input{font:inherit}
button{appearance:none;-webkit-appearance:none;border-radius:0}
.gate{position:relative;min-height:100vh;min-height:100svh;overflow:hidden;background:#000}
.gate-video,.gate-overlay{position:fixed;inset:0}
.gate-video video{width:100%;height:100%;object-fit:cover;filter:saturate(.78) contrast(1.04)}
.gate-overlay{
  background:linear-gradient(180deg,rgba(0,0,0,.60),rgba(0,0,0,.70)),
             radial-gradient(circle at 50% 42%,rgba(255,255,255,.05),transparent 42%);
}
.gate-stage{position:relative;z-index:2;min-height:100vh;min-height:100svh;display:grid;place-items:center;padding:36px 20px}
.gate-stack{width:min(680px,100%);display:grid;justify-items:center;gap:30px;text-align:center;animation:gateIn .9s var(--ease) both}
.gate-logo{width:min(320px,72vw);height:auto;display:block;object-fit:contain;filter:brightness(1.08)}
.gate-release{display:grid;gap:7px}
.gate-kicker,.gate-time,.gate-footer,.gate-message{margin:0;font-size:10px;line-height:1.4;letter-spacing:.15em;text-transform:uppercase}
.gate-kicker{color:rgba(255,255,255,.56)}
.gate-release h1{margin:0;font-size:12px;font-weight:400;letter-spacing:.12em}
.gate-time{color:rgba(255,255,255,.82)}
.gate-countdown{display:grid;grid-template-columns:auto 14px auto 14px auto 14px auto;align-items:start;gap:8px}
.gate-countdown div{min-width:74px;display:grid;gap:7px}
.gate-countdown strong{font-family:var(--sans);font-size:30px;line-height:1;font-weight:300;letter-spacing:.04em;font-variant-numeric:tabular-nums}
.gate-countdown span{font-size:8px;letter-spacing:.14em;color:rgba(255,255,255,.52)}
.gate-countdown i{margin-top:3px;font-family:var(--sans);font-size:22px;line-height:1;font-style:normal;font-weight:300;color:rgba(255,255,255,.48)}
.gate-form{width:min(390px,100%);display:grid;gap:9px}
.gate-form>label{justify-self:start;font-size:9px;letter-spacing:.14em;color:rgba(255,255,255,.65)}
.gate-input-row{display:grid;grid-template-columns:1fr auto;border-bottom:1px solid rgba(255,255,255,.42)}
.gate-input-row input{width:100%;min-width:0;height:46px;padding:0 4px;border:0;outline:0;background:transparent;color:#fff;font-family:var(--mono);font-size:12px;letter-spacing:.08em}
.gate-input-row input::placeholder{color:rgba(255,255,255,.35)}
.gate-input-row button{min-width:76px;border:0;background:transparent;color:#fff;cursor:pointer;font-size:10px;letter-spacing:.12em;transition:opacity .2s ease}
.gate-input-row button:hover{opacity:.55}
.gate-input-row button:disabled{opacity:.3;cursor:default}
.gate-message{min-height:16px;color:rgba(255,255,255,.58);text-align:left}
.gate-message.is-error{color:#fff}
.gate-footer{margin-top:4px;color:rgba(255,255,255,.35);font-size:8px}
@keyframes gateIn{from{opacity:0;transform:translateY(16px)}to{opacity:1;transform:translateY(0)}}
@media(max-width:620px){
  .gate-stage{padding:30px 16px}
  .gate-stack{gap:26px}
  .gate-countdown{width:100%;grid-template-columns:repeat(4,1fr);gap:6px}
  .gate-countdown i{display:none}
  .gate-countdown div{min-width:0}
  .gate-countdown strong{font-size:24px}
  .gate-countdown span{font-size:7px;letter-spacing:.08em}
}
@media(max-width:380px){
  .gate-countdown strong{font-size:20px}
  .gate-logo{width:min(270px,72vw)}
}
@media(prefers-reduced-motion:reduce){.gate-stack{animation:none}}