@import url('https://fonts.googleapis.com/css2?family=Anton&family=Nunito:wght@400;700;900&display=swap');
:root{--bg:#07110b;--panel:#101d13;--green:#8dff45;--lime:#c3ff80;--white:#f5ffeF;--muted:#a8bba9;--line:#2f5835}
*{box-sizing:border-box}
body{margin:0;background:radial-gradient(ellipse at top,#18351e 0,#07110b 52%,#030704 100%);color:var(--white);font-family:Nunito,Arial,sans-serif;min-height:100vh}
body:before{content:"";position:fixed;inset:0;pointer-events:none;opacity:.12;background-image:radial-gradient(var(--green) .7px,transparent .7px);background-size:7px 7px}
.hidden{display:none!important}
.welcome-screen{min-height:100svh;display:grid;place-items:center;padding:22px}
.comic-panel{position:relative;background:linear-gradient(145deg,rgba(19,37,23,.97),rgba(7,16,10,.98));border:2px solid var(--green);box-shadow:7px 7px 0 #294d2c,0 0 28px #65ff3520;overflow:hidden}
.welcome-card{width:min(100%,410px);padding:34px 27px 30px;text-align:center;clip-path:polygon(0 0,96% 0,100% 4%,100% 100%,4% 100%,0 96%)}
.comic-tag{display:inline-block;padding:6px 12px;background:var(--green);color:#07110b;font-size:10px;font-weight:900;letter-spacing:2px;transform:rotate(-2deg)}
.brand-mark,.mini-logo{font-family:Anton,sans-serif;font-size:62px;line-height:1;margin:24px 0 10px;color:var(--white);text-shadow:3px 3px 0 #397a2d}
.brand-mark span,.mini-logo span{color:var(--green)}
h1,h2,h3,p{margin-top:0}
h1,h2,h3{font-family:Anton,Impact,sans-serif;letter-spacing:1.5px}
h1{font-size:38px;line-height:1.04;margin-bottom:14px}
h1 em,h2 em{font-style:normal;color:var(--green);text-shadow:2px 2px 0 #2e5728}
.welcome-copy{color:var(--muted);font-size:13px;line-height:1.7;max-width:290px;margin:0 auto 24px}
.primary-btn{border:0;background:var(--green);color:#07110b;font-weight:900;letter-spacing:1.5px;padding:15px 20px;cursor:pointer;font-family:Nunito,sans-serif;box-shadow:4px 4px 0 #35662e;transition:transform .15s,filter .15s}
.primary-btn:hover{filter:brightness(1.08);transform:translate(-1px,-1px)}
.primary-btn span{font-size:18px;margin-left:10px}
.text-btn{display:block;margin:17px auto 0;border:0;background:transparent;color:var(--lime);text-decoration:underline;cursor:pointer;font-weight:800}
.about-text{margin-top:18px;padding:12px;border:1px dashed var(--line);color:var(--muted);font-size:12px;line-height:1.6}
.halftone{position:absolute;width:120px;height:80px;right:-34px;bottom:-26px;transform:rotate(-25deg);opacity:.18;background-image:radial-gradient(var(--green) 1.4px,transparent 1.4px);background-size:7px 7px;pointer-events:none}
.app{max-width:760px;margin:auto;padding:0 16px 28px}
.topbar{display:flex;align-items:center;gap:12px;padding:19px 2px 22px}
.mini-logo{font-size:29px;margin:0;text-shadow:2px 2px 0 #397a2d}
.topbar b{display:block;font-size:13px;letter-spacing:1px}
.topbar small{display:block;color:var(--muted);font-size:9px;letter-spacing:1.4px;margin-top:3px}
.status-pill{margin-left:auto;border:1px solid var(--line);border-radius:30px;padding:6px 9px;color:var(--lime);font-size:9px;font-weight:900;letter-spacing:1px}
.status-pill i,.live-dot{display:inline-block;width:6px;height:6px;border-radius:50%;background:var(--green);box-shadow:0 0 9px var(--green);margin-right:5px}
.hero{min-height:220px;padding:25px 22px;margin-bottom:20px;display:flex;align-items:center}
.hero-copy{position:relative;z-index:1;max-width:70%}
.eyebrow{font-size:9px;font-weight:900;letter-spacing:2px;color:var(--lime)}
h2{font-size:47px;line-height:.95;margin:12px 0}
.hero p{max-width:300px;font-size:12px;color:var(--muted);line-height:1.6;margin-bottom:0}
.hero-burst{position:absolute;right:15px;top:44px;width:105px;height:105px;display:grid;place-content:center;text-align:center;background:var(--green);color:#07110b;font-family:Anton,sans-serif;font-size:23px;line-height:1.05;clip-path:polygon(50% 0%,61% 16%,80% 5%,82% 27%,100% 35%,86% 52%,98% 70%,76% 75%,70% 98%,51% 85%,33% 100%,27% 78%,4% 80%,15% 59%,0 43%,20% 31%,17% 10%,39% 17%)}
.hero-stripe{position:absolute;right:-30px;bottom:-34px;width:220px;height:90px;transform:rotate(-20deg);border-top:2px solid #7eff4a50;border-bottom:2px solid #7eff4a50}
.video-panel,.form-panel{padding:18px;margin-bottom:20px}
.section-heading{display:flex;align-items:center;gap:10px;margin-bottom:15px}
.section-heading h3{font-size:20px;margin:0}
.number{font-family:Anton,sans-serif;color:var(--green);font-size:18px}
.live-dot{margin-left:auto;width:auto;height:auto;border-radius:0;background:none;box-shadow:none;font-size:9px;font-weight:900;letter-spacing:1px}
.promo-video{width:100%;aspect-ratio:16/9;display:block;object-fit:cover;background:#030704;border:1px solid var(--line)}
.hint{font-size:11px;color:var(--muted);line-height:1.6;margin:10px 0 0}
label{display:block;font-size:12px;font-weight:900;margin:5px 0 8px}
input{width:100%;background:#07110b;border:1px solid #396541;padding:15px;color:var(--white);font:700 14px Nunito,sans-serif;outline:none}
input:focus{border-color:var(--green);box-shadow:0 0 0 3px #8dff4520}
.full{width:100%;margin-top:17px}
.result{padding:12px;margin-top:14px;border:1px solid var(--green);font-size:12px;line-height:1.6;color:var(--lime)}
.official-note{margin-top:18px;padding:14px;border-left:3px solid var(--green);background:#07110b}
.official-note b{font-size:12px;color:var(--lime)}
.official-note p{font-size:11px;line-height:1.7;color:var(--muted);margin:7px 0 10px}
.official-note a{color:var(--green);font-size:11px;font-weight:900;text-decoration:none}
footer{text-align:center;color:#66816a;font-size:9px;letter-spacing:1.5px;padding:12px}
@media(min-width:600px){.app{padding-top:10px}.hero{min-height:260px;padding:34px}.hero-burst{right:40px;width:130px;height:130px;font-size:28px}.video-panel,.form-panel{padding:24px}}