@import url('https://fonts.googleapis.com/css2?family=Fraunces:opsz,wght@9..144,600;9..144,700&family=Inter:wght@400;500;600&family=IBM+Plex+Mono:wght@500&display=swap');

:root{
  --odd-primary:#241507;
  --odd-accent:#F2661D;
  --odd-accent-dark:#C9520F;
  --odd-surface:#FCEFE2;
  --odd-glass-bg:rgba(255,252,248,.12);
  --odd-glass-border:rgba(255,255,255,.25);
}
*{margin:0;padding:0;box-sizing:border-box;}
body{font-family:'Inter',sans-serif;background:var(--odd-primary);color:#fff;overflow-x:hidden;}

.odd-gate{position:relative;min-height:100vh;min-height:100dvh;display:flex;align-items:center;justify-content:center;text-align:center;overflow:hidden;padding:40px 24px;}
.odd-gate-video,.odd-gate-bg{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:0;}
.odd-gate-bg{background-size:cover;background-position:center;}
.odd-gate-overlay{position:absolute;inset:0;z-index:1;background:linear-gradient(180deg,rgba(36,21,7,.55) 0%,rgba(36,21,7,.75) 100%);}

.odd-gate-content{position:relative;z-index:2;max-width:600px;}
.odd-gate-logo{font-family:'Fraunces',serif;font-size:28px;font-weight:700;letter-spacing:.02em;animation:odd-gate-fade .7s ease both;}
.odd-gate-tagline{font-family:'IBM Plex Mono',monospace;font-size:11px;letter-spacing:.12em;text-transform:uppercase;color:var(--odd-accent);margin-top:4px;margin-bottom:36px;animation:odd-gate-fade .7s ease .05s both;}

.odd-gate-headline{font-family:'Fraunces',serif;font-size:clamp(36px,7vw,64px);font-weight:700;line-height:1.05;margin-bottom:16px;animation:odd-gate-fade .8s ease .1s both;}
.odd-gate-subtext{font-size:15px;opacity:.85;max-width:440px;margin:0 auto 36px;line-height:1.6;animation:odd-gate-fade .8s ease .2s both;}

.odd-gate-timer{display:flex;justify-content:center;gap:16px;margin-bottom:32px;flex-wrap:wrap;animation:odd-gate-fade .8s ease .3s both;}
.odd-gate-unit{display:flex;flex-direction:column;align-items:center;min-width:70px;}
.odd-gate-number{font-family:'IBM Plex Mono',monospace;font-size:clamp(28px,5vw,40px);font-weight:600;line-height:1;background:rgba(255,255,255,.08);border:1px solid var(--odd-glass-border);border-radius:12px;padding:14px 8px;min-width:70px;}
.odd-gate-label{font-family:'IBM Plex Mono',monospace;font-size:10px;letter-spacing:.08em;text-transform:uppercase;opacity:.65;margin-top:8px;}
.odd-gate-ended-message{font-family:'Fraunces',serif;font-size:24px;margin-bottom:32px;color:var(--odd-accent);}

.odd-gate-notify-form{display:flex;gap:10px;justify-content:center;flex-wrap:wrap;max-width:420px;margin:0 auto;padding:8px;border-radius:999px;animation:odd-gate-fade .8s ease .4s both;}
.odd-gate-notify-form.odd-glass{background:var(--odd-glass-bg);backdrop-filter:blur(14px) saturate(1.3);-webkit-backdrop-filter:blur(14px) saturate(1.3);border:1px solid var(--odd-glass-border);}
@supports not ((backdrop-filter: blur(1px)) or (-webkit-backdrop-filter: blur(1px))){.odd-gate-notify-form.odd-glass{background:rgba(36,21,7,.5);}}
.odd-gate-notify-form input{flex:1;min-width:200px;padding:12px 18px;border:none;border-radius:999px;font-size:14px;font-family:inherit;background:transparent;color:#fff;}
.odd-gate-notify-form input::placeholder{color:rgba(255,255,255,.6);}
.odd-gate-notify-form input:focus{outline:none;}
.odd-gate-notify-form button{padding:12px 26px;background:var(--odd-accent);color:#fff;border:none;border-radius:999px;font-weight:600;font-size:13px;letter-spacing:.03em;cursor:pointer;white-space:nowrap;transition:transform .2s ease;}
.odd-gate-notify-form button:hover{transform:translateY(-1px);}
.odd-gate-notify-message{margin-top:14px;font-size:13px;font-weight:600;}

@keyframes odd-gate-fade{from{opacity:0;transform:translateY(16px);}to{opacity:1;transform:translateY(0);}}
@media (prefers-reduced-motion: reduce){.odd-gate-logo,.odd-gate-tagline,.odd-gate-headline,.odd-gate-subtext,.odd-gate-timer,.odd-gate-notify-form{animation:none;}}

@media(max-width:480px){
	.odd-gate-unit{min-width:58px;}
	.odd-gate-number{font-size:24px;min-width:58px;padding:10px 6px;}
	.odd-gate-notify-form{padding:6px;}
	.odd-gate-notify-form input{min-width:150px;}
}