@font-face{font-family:"Clash Grotesk";src:url("../clash-400.woff2") format("woff2");font-weight:400;font-display:swap}
@font-face{font-family:"Clash Grotesk";src:url("../clash-500.woff2") format("woff2");font-weight:500;font-display:swap}
@font-face{font-family:"Clash Grotesk";src:url("../clash-600.woff2") format("woff2");font-weight:600;font-display:swap}
:root{--paper:#edf3f0;--step:#dfe9e4;--ink:#10231f;--muted:#3f5650;--pine:#123029;--pine2:#1c4c3f;--gold:#f4c95d;--red:#c9352c;--on:#fff;--r:20px;--m:12px;--ease:cubic-bezier(.16,1,.3,1)}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth}
html,body{overflow-x:clip}
body{margin:0;background:var(--paper);color:var(--ink);font:400 18px/1.45 "Clash Grotesk",ui-sans-serif,system-ui,sans-serif}
a{color:inherit}img{display:block;max-width:100%;height:auto}
h1,h2,h3,p,ul,ol{margin:0;padding:0}ul,ol{list-style:none}
h1,h2,h3{font-weight:500;letter-spacing:-.03em;line-height:.98}
:focus-visible{outline:3px solid var(--red);outline-offset:3px}
.vh{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
.hp{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}

.page{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:var(--m);padding:var(--m);align-items:start}
.stage{position:sticky;top:var(--m);height:calc(100svh - 2*var(--m));order:2;display:flex;flex-direction:column;background:var(--pine);border-radius:var(--r);overflow:hidden}
.tv{position:relative;flex:1;min-height:0;color:#fff}
.caption{height:56px;display:flex;align-items:center;padding:0 24px;background:var(--step);color:var(--ink);font-size:16px;font-weight:500}
#snow{position:absolute;inset:0;width:100%;height:100%;pointer-events:none}
.screen{position:absolute;inset:0;opacity:0;visibility:hidden;transform:scale(1.03);transition:opacity .7s var(--ease),transform 1.1s var(--ease),visibility 0s .7s;display:flex;flex-direction:column;justify-content:center}
.screen.is-on{opacity:1;visibility:visible;transform:none;transition:opacity .7s var(--ease),transform 1.1s var(--ease)}
.screen img{width:100%;height:100%;object-fit:contain}

[data-screen=survey]{padding:clamp(16px,2.4vw,36px);gap:clamp(10px,1.3vw,18px);z-index:2}
.scorebar{display:flex;gap:10px;justify-content:center}
.score{display:flex;gap:12px;align-items:baseline;padding:8px 16px;border-radius:12px;background:var(--pine2);font-size:16px}
.score b{font-weight:500}.score output{color:var(--gold);font-size:26px;font-weight:600;font-variant-numeric:tabular-nums}
.q{font-size:clamp(24px,2.7vw,42px);line-height:1.05;letter-spacing:-.02em;font-weight:500;text-align:center;text-wrap:balance}
.tiles{display:grid;grid-template-columns:1fr 1fr;gap:clamp(8px,.8vw,12px);perspective:900px}
.tile{position:relative;height:clamp(52px,6.6vh,76px);border:0;border-radius:12px;background:var(--pine2);color:var(--gold);font:inherit;font-size:clamp(16px,1.4vw,22px);font-weight:600;cursor:pointer;display:flex;align-items:center;justify-content:center;padding:0 14px;transition:transform .16s var(--ease),background .2s;-webkit-tap-highlight-color:transparent;touch-action:manipulation}
.tile:hover{background:#245c4c}.tile:active{transform:scale(.97)}
.tile .ans,.tile .pts{display:none}
.tile.on{justify-content:space-between;background:#fff;color:var(--ink);cursor:default;animation:flip .5s var(--ease)}
.tile.on .num{display:none}.tile.on .ans,.tile.on .pts{display:block}
.tile .ans{text-align:left;line-height:1.1}
.tile .pts{min-width:42px;padding:3px 8px;border-radius:8px;background:var(--red);color:#fff;font-variant-numeric:tabular-nums}
html:not(.js) .tile{justify-content:space-between;background:#fff;color:var(--ink)}html:not(.js) .tile .num{display:none}html:not(.js) .tile .ans,html:not(.js) .tile .pts{display:block}
@keyframes flip{from{transform:rotateX(-88deg)}to{transform:none}}
.controls{display:flex;gap:10px;align-items:center;justify-content:center;flex-wrap:wrap}
.pot{font-size:18px;font-weight:500}.pot output{color:var(--gold);font-size:26px;font-weight:600;font-variant-numeric:tabular-nums;margin-left:4px}
.strikes{display:flex;gap:6px}.strikes i{position:relative;width:30px;height:30px;border-radius:8px;background:var(--pine2);transition:background .2s}
.strikes i.hit{background:var(--red);animation:shake .34s var(--ease)}
.strikes i.hit::after{content:"\00d7";position:absolute;inset:0;display:grid;place-items:center;color:#fff;font-size:24px;font-weight:600;line-height:1}
@keyframes shake{0%{transform:scale(1.5) rotate(-8deg)}60%{transform:scale(.94) rotate(3deg)}100%{transform:none}}
.key{min-height:44px;padding:0 16px;border:0;border-radius:99px;background:var(--pine2);color:#fff;font:500 16px/1 "Clash Grotesk",sans-serif;cursor:pointer;transition:transform .16s var(--ease),background .2s;touch-action:manipulation}
.key:hover{background:#245c4c}.key:active{transform:scale(.96)}.key.strike{background:var(--red)}.key.strike:hover{background:#ae2b24}.key.gold{background:var(--gold);color:var(--ink)}.key.gold:hover{background:#f8d67c}
.key:disabled{opacity:.55;cursor:default}

.sheet{order:1;min-width:0;padding:0 clamp(20px,3.6vw,64px)}
.nav{display:flex;align-items:center;justify-content:space-between;gap:20px;height:84px}
.mark img{width:172px}
.links{display:flex;gap:24px}.links a{text-decoration:none;font-size:16px;font-weight:500;background:linear-gradient(currentColor,currentColor) 0 100%/0 2px no-repeat;transition:background-size .3s var(--ease);padding-bottom:2px}
.links a:hover{background-size:100% 2px}
.hero{min-height:calc(100svh - 96px);display:flex;flex-direction:column;justify-content:center;padding:0 0 72px;scroll-margin-top:0}
h1{font-size:clamp(52px,7.3vw,112px);line-height:.92;letter-spacing:-.04em;margin-bottom:36px}h1 span{display:block}
.lead{font-size:24px;line-height:1.3;max-width:27em;margin-bottom:36px}
.soon{font-weight:500;margin-bottom:14px}
.btn{display:inline-flex;align-items:center;justify-content:center;min-height:56px;padding:0 28px;border:0;border-radius:99px;background:var(--red);color:#fff;font:500 18px/1 "Clash Grotesk",sans-serif;text-decoration:none;cursor:pointer;white-space:nowrap;transition:transform .16s var(--ease),background .2s}
.btn:hover{background:#ae2b24}.btn:active{transform:scale(.97)}
.btn.invert{background:var(--gold);color:var(--ink)}.btn.invert:hover{background:#f8d67c}
.buy{display:flex;gap:24px;align-items:center;flex-wrap:wrap}.plain{font-weight:500}
.row{display:flex;gap:8px;padding:6px;background:#fff;border-radius:99px;max-width:560px}
input[type=email]{flex:1;min-width:0;height:56px;padding:0 20px;border:0;border-radius:99px;background:transparent;color:var(--ink);font:inherit}
input[type=email]::placeholder{color:#5d7069}
.check{display:flex;gap:10px;margin-top:14px;font-size:16px;line-height:1.3;color:var(--muted)}.check input{flex:none;width:20px;height:20px;margin:0;accent-color:var(--red)}
.error{margin-bottom:12px;color:#a62a22;font-weight:500}
.done{font-size:24px;line-height:1.25;font-weight:500;color:var(--pine2);max-width:22em}

section{scroll-margin-top:24px}
h2{font-size:clamp(38px,3.8vw,56px)}
.games{padding-top:40px}
.game{min-height:88svh;display:flex;flex-direction:column;justify-content:center;padding:40px 0}
.game h3{font-size:clamp(34px,3.2vw,48px);margin-bottom:20px}
.game .line{font-size:24px;line-height:1.3;max-width:26em;margin-bottom:28px}
.big{font-size:24px;font-weight:500;line-height:1;margin-bottom:24px}.big b{display:inline-block;font-weight:500;font-size:clamp(52px,7.3vw,112px);line-height:.9;letter-spacing:-.04em;color:var(--red);margin-right:6px}
.phone-shot{display:none}
.game li{position:relative;padding:4px 0 4px 24px}.game li::before{content:"";position:absolute;left:0;top:.72em;width:10px;height:10px;border-radius:50%;background:var(--pine2)}
.more,.tag{align-self:flex-start;margin-top:24px;font-weight:500}
.more{transition:color .2s}.more:hover{color:var(--red)}

.deal{margin:48px calc(-1*clamp(20px,3.6vw,64px)) 0;padding:clamp(56px,6vw,96px) clamp(20px,3.6vw,64px);background:var(--pine);color:#fff;border-radius:var(--r)}
.deal h2{font-size:clamp(46px,5.5vw,84px);margin-bottom:28px}.deal #deal{color:var(--gold)}
.deal p{font-size:24px;line-height:1.3;max-width:26em;margin-bottom:32px}
.inside{padding:160px 0 80px}.inside h2{margin-bottom:40px}
.rows li{display:flex;align-items:baseline;justify-content:space-between;gap:20px;padding:10px 0;font-size:24px;line-height:1.2}
.rows b{font-weight:500;color:var(--red);font-variant-numeric:tabular-nums}
.how{padding-top:80px}.how li{min-height:66svh;display:flex;flex-direction:column;justify-content:center}
.how h3{font-size:clamp(34px,3.2vw,48px);margin-bottom:18px}.how li p{font-size:24px;line-height:1.3;max-width:25em}
.faq{padding:120px 0 40px}.faq h2{margin-bottom:32px}
details{padding:14px 0}summary{position:relative;list-style:none;cursor:pointer;font-size:24px;font-weight:500;line-height:1.2;padding-right:36px;transition:color .2s}
summary::-webkit-details-marker{display:none}summary:hover{color:var(--red)}
summary::after{content:"";position:absolute;right:6px;top:.3em;width:10px;height:10px;border-right:2px solid;border-bottom:2px solid;transform:rotate(45deg);transition:transform .28s var(--ease)}
details[open] summary::after{transform:translateY(5px) rotate(225deg)}
details p{padding-top:10px;max-width:32em}
.close{padding:140px 0 120px}.close p{font-size:24px;line-height:1.3;max-width:20em;margin-bottom:28px;font-weight:500}

.foot{position:relative;height:66svh;min-height:440px;margin-top:var(--m);overflow:hidden;color:#fff;background:var(--red)}
.foot-top{position:absolute;left:32px;right:32px;top:32px;display:flex;justify-content:space-between;gap:24px;flex-wrap:wrap;font-size:16px;font-weight:500}
.wordmark{position:absolute;left:24px;right:24px;bottom:56px;font-size:13.4vw;line-height:.96;letter-spacing:-.05em;font-weight:500;white-space:nowrap;overflow:hidden;margin:0;padding-bottom:.06em}
.wordmark span{display:inline-block}
.legal{position:absolute;left:32px;bottom:18px;font-size:15px}

.tv.cover{display:grid;place-items:center;padding:clamp(16px,2.4vw,40px)}.tv.cover img{width:100%;height:100%;object-fit:contain}
.p-hero{min-height:calc(100svh - 96px);display:flex;flex-direction:column;justify-content:center;align-items:flex-start;padding-bottom:64px}
.p-title{font-size:clamp(46px,5.4vw,84px);line-height:.96;letter-spacing:-.04em;margin-bottom:24px}
.p-price{margin:4px 0 28px;font-size:24px}.p-price b{font-weight:500;font-size:clamp(46px,5.4vw,84px);letter-spacing:-.04em;color:var(--red);line-height:1}.p-price s{color:var(--muted)}
.p-note{margin-top:20px;font-size:16px;color:var(--muted)}
.prose{padding-bottom:40px;max-width:38em}.prose h2,.prose h3,.prose h4{font-size:28px;line-height:1.1;margin:44px 0 12px;letter-spacing:-.02em}.prose p{margin:0 0 14px}.prose ul{margin:0 0 14px}.prose li{position:relative;padding:4px 0 4px 24px}.prose li::before{content:"";position:absolute;left:0;top:.72em;width:10px;height:10px;border-radius:50%;background:var(--pine2)}
.p-more{padding:80px 0 120px}.rows a{text-decoration:none;transition:color .2s}.rows a:hover{color:var(--red)}

@media (max-width:900px){
  body{font-size:17px}
  .page{display:flex;flex-direction:column;gap:0;padding:0 0 0}.sheet{display:contents}.nav{order:0}.hero,.p-hero{order:1}.stage{order:2}.sheet>section{order:3}.sheet>*{margin-inline:20px}.sheet>.deal{margin-inline:0;padding-inline:20px}
  .stage{position:relative;top:auto;height:auto;min-height:0;margin:0 12px;align-self:stretch;border-radius:var(--r)}.tv{height:400px;flex:none}
  .phone-shot{display:block;width:100%;border-radius:var(--r);margin-bottom:24px}
  .caption{display:none}
  [data-screen=survey]{padding:10px 12px;gap:6px}
  .scorebar .score{padding:3px 12px}.score output{font-size:20px}
  .q{font-size:20px}.tile{height:42px;font-size:16px;padding:0 10px}.tile .pts{min-width:32px;padding:1px 6px}.tiles{gap:5px}
  .controls{gap:6px}.controls .pot{display:none}.key.strike{min-height:40px}.key{min-height:44px;padding:0 13px;font-size:15px}
  .screen img{object-fit:contain}
  .nav{height:72px}.links{display:none}.mark img{width:150px}
  .hero{min-height:auto;padding:8px 0 36px}.p-hero{min-height:auto;padding:8px 0 36px}.p-title{font-size:12vw}.tv.cover{height:auto;aspect-ratio:1}
  h1{font-size:clamp(52px,14vw,92px);margin-bottom:20px}.lead,.game .line,.deal p,.how li p,.rows li,.close p{font-size:20px}
  .row{flex-direction:column;background:none;padding:0;border-radius:0}input[type=email]{flex:none;background:#fff}.row .btn{width:100%}
  .game{min-height:0;padding:40px 0}.deal{border-radius:0}.deal h2{font-size:12vw}
  .inside{padding:100px 0 40px}.how li{min-height:0;padding:36px 0}.rows{max-width:520px}.close p{max-width:none}.big b{font-size:clamp(52px,14vw,92px)}summary{font-size:20px}.faq{padding-top:80px}.close{padding:120px 0}
  .foot{height:64svh}.foot-top{left:20px;right:20px;top:24px}.wordmark{left:16px;right:16px;font-size:23vw;white-space:normal;bottom:44px}.wordmark span{display:block}.legal{left:20px}
}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}.screen,.screen.is-on,.tile,.btn,.key,summary::after{transition:none}.tile.on,.strikes i.hit{animation:none}.screen{transform:none}#snow{display:none}}