@import url('https://fonts.googleapis.com/css2?family=Space+Grotesk:wght@500;600;700&family=Space+Mono:wght@700&display=swap');
:root{color-scheme:dark;font-family:'Space Grotesk',sans-serif;color:#fff0cf;background:#100b21}
*{box-sizing:border-box}
body{margin:0;min-height:100svh;display:grid;grid-template-rows:auto 1fr;background:linear-gradient(#10091dc9,#150a2780 55%,#10091de8),url('haunted-pond.png') center/cover fixed}
.countdown-header{display:flex;align-items:center;justify-content:space-between;gap:20px;padding:16px 28px;border-bottom:1px solid #c692ff22;background:#100b2188}
.countdown-header a{display:flex;align-items:center;gap:12px;color:#d6c3e5;text-decoration:none;font:700 9px/1.35 'Space Mono',monospace;letter-spacing:.8px}
.countdown-header img{width:30px;height:30px}.countdown-header a span{border-left:1px solid #c692ff44;padding-left:12px}
.reward-note{color:#ffdc96;font-size:12px}
main{place-self:center;width:min(calc(100% - 36px),980px);text-align:center;padding:clamp(28px,7vw,76px) 0;filter:drop-shadow(0 4px 18px #100719)}
h1{font-size:clamp(25px,6.4vw,76px);font-weight:700;line-height:1.15;letter-spacing:-.055em;white-space:nowrap;margin:0 0 clamp(40px,7vw,76px)}
.insertion{display:inline-block;position:relative;width:.85em;color:#ff728b;letter-spacing:0;vertical-align:baseline}
.insertion>span{position:absolute;left:50%;bottom:1.8em;transform:translateX(-50%) rotate(-9deg);font-family:'Comic Sans MS','Chalkboard SE',cursive;font-size:.55em;font-weight:700;line-height:1;white-space:nowrap}
.insertion>b{display:block;font-size:.65em;line-height:1;transform:translateY(-.08em)}
#countdown{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:clamp(7px,1.5vw,14px);max-width:520px;margin:auto}
#countdown>div{padding:clamp(14px,2vw,22px) 4px;border:1px solid #c692ff50;border-radius:12px;background:linear-gradient(145deg,#2a183ee8,#150e25ed);box-shadow:0 10px 35px #0004,inset 0 1px #ffffff0c}
#countdown strong{display:block;font:700 clamp(28px,5vw,52px)/1.15 'Space Mono',monospace;font-variant-numeric:tabular-nums;letter-spacing:-.06em;color:#ffdc96}
#countdown span{display:block;margin-top:12px;font-size:clamp(9px,1.3vw,12px);font-weight:600;letter-spacing:.15em;text-transform:uppercase;color:#d6c2e6}
#play{display:inline-block;padding:16px 36px;border:1px solid #e1b7ff;border-radius:10px;background:#a858e7;color:#fff0cf;text-decoration:none;font-weight:700;font-size:20px;box-shadow:0 4px 0 #573171}
#play:hover{background:#bb70f0}#play:focus-visible{outline:3px solid #ffdc96;outline-offset:5px}
[hidden]{display:none!important}
noscript p{font-size:13px;color:#d6c2e6}
@media(max-width:600px){.countdown-header{padding:13px 14px;gap:10px}.countdown-header a{font-size:7px;gap:7px;letter-spacing:.3px}.countdown-header img{width:25px;height:25px}.countdown-header a span{padding-left:7px}.reward-note{font-size:10px}}
@media(max-width:380px){#countdown span{letter-spacing:.05em}}
