:root{
  --bg:#120b20;--card:#211536;--card2:#2b1b46;--text:#fff8ff;--muted:#bcb0ca;
  --pink:#ff4fb9;--orange:#ff8a3d;--cyan:#47d7ff;--lime:#b8ff64;--gold:#ffd66b;
  --red:#ff6176;--blue:#6387ff;--shadow:0 22px 55px rgba(0,0,0,.34)
}
*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}
html,body{margin:0;min-height:100%;background:var(--bg);color:var(--text);font-family:"Heebo",system-ui,sans-serif;overflow-x:hidden}
body{min-height:100dvh;background:radial-gradient(circle at 8% 5%,rgba(255,79,185,.23),transparent 30%),radial-gradient(circle at 94% 16%,rgba(71,215,255,.16),transparent 28%),linear-gradient(180deg,#180e29 0%,#0d0917 100%)}
button{font:inherit;color:inherit;cursor:pointer}.grain{position:fixed;inset:0;pointer-events:none;opacity:.07;z-index:20;background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.6'/%3E%3C/svg%3E")}
.screen{display:none;min-height:100dvh;padding:max(14px,env(safe-area-inset-top)) 18px max(24px,env(safe-area-inset-bottom));position:relative}.screen.active{display:block;animation:screenIn .32s ease both}@keyframes screenIn{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}
.topbar{height:48px;display:flex;align-items:center;justify-content:space-between;gap:10px}.mini-brand{font-weight:900;letter-spacing:.08em;font-size:13px;color:#e8ddf5}.icon-btn{width:42px;height:42px;border-radius:14px;border:1px solid rgba(255,255,255,.13);background:rgba(255,255,255,.07);font-weight:900;font-size:20px}.icon-btn.on{background:rgba(184,255,100,.16);border-color:rgba(184,255,100,.4);color:var(--lime)}
.hero{max-width:470px;margin:10px auto 0;text-align:center}.eyebrow{display:inline-flex;padding:7px 11px;border-radius:999px;background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.1);font-size:11px;font-weight:800;color:#d7cee0;margin-top:8px}.hero h1{font-size:clamp(46px,14vw,72px);line-height:.92;margin:18px 0 12px;letter-spacing:-.055em}.hero h1 span{display:inline-block;background:linear-gradient(135deg,var(--pink),var(--orange));-webkit-background-clip:text;color:transparent;transform:rotate(-3deg)}.subtitle{max-width:385px;margin:0 auto;color:var(--muted);font-size:14px;line-height:1.55}.choose-title{margin:10px 0 8px;font-size:20px}
.lia-host{display:flex;align-items:center;justify-content:center;gap:12px;margin:18px auto 4px;direction:ltr}.lia-bubble{direction:rtl;max-width:220px;text-align:right;background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.09);padding:10px 12px;border-radius:17px 17px 17px 5px;color:#eee6f4;font-size:11px;line-height:1.4}
.character-picks{display:grid;grid-template-columns:1fr 1fr;gap:12px;max-width:410px;margin:0 auto}.pick-card{border:1px solid rgba(255,255,255,.12);background:linear-gradient(180deg,rgba(255,255,255,.09),rgba(255,255,255,.04));border-radius:24px;padding:10px 8px 14px;min-height:235px;display:flex;flex-direction:column;align-items:center;justify-content:end;overflow:hidden;position:relative}.pick-card:active{transform:scale(.985)}.pick-card.tom{box-shadow:inset 0 0 0 1px rgba(255,97,118,.05)}.pick-card.liav{box-shadow:inset 0 0 0 1px rgba(99,135,255,.05)}.pick-card b{font-size:20px;margin-top:4px}.pick-card small{font-size:9px;color:#a99db8;max-width:135px;line-height:1.35}.tiny-note{margin-top:10px;font-size:10px;color:#8f849d}
.stickman,.tiny-stick{position:relative;width:120px;height:165px;direction:ltr}.big-stick{transform-origin:50% 80%;margin-bottom:-2px}.tilt-left{transform:rotate(-3deg)}.tilt-right{transform:rotate(3deg)}.tiny-stick{width:56px;height:83px;flex:0 0 auto}.stick-head{position:absolute;left:50%;top:-5px;transform:translateX(-50%) rotate(-4deg);z-index:5;overflow:visible;background:transparent;border:0;box-shadow:none}.big-stick .stick-head{width:86px;height:86px}.tiny-stick .stick-head{width:42px;height:42px}.stick-head img{width:100%;height:100%;object-fit:contain;filter:drop-shadow(3px 4px 2px rgba(0,0,0,.28))}.tom-head img{object-position:50% 28%;transform:scale(1.08)}.liav-head img{object-position:50% 23%;transform:scale(1.08)}.lia-head img{object-position:50% 24%;transform:scale(1.08)}.bad-paste{filter:contrast(1.04) saturate(.95)}.big-stick .stick-body{position:absolute;left:50%;top:76px;width:6px;height:55px;background:#f6eddf;border-radius:999px;transform:translateX(-50%);box-shadow:2px 0 0 rgba(0,0,0,.25)}.tiny-stick .stick-body{position:absolute;left:50%;top:36px;width:3px;height:28px;background:#f6eddf;border-radius:999px;transform:translateX(-50%)}.stick-arm,.stick-leg{position:absolute;background:#f6eddf;border-radius:999px;transform-origin:top center}.big-stick .stick-arm{width:5px;height:48px;top:84px;left:58px}.big-stick .a1{transform:rotate(52deg)}.big-stick .a2{transform:rotate(-50deg)}.big-stick .stick-leg{width:6px;height:52px;top:123px;left:57px}.big-stick .l1{transform:rotate(28deg)}.big-stick .l2{transform:rotate(-28deg)}.tiny-stick .stick-arm{width:3px;height:23px;top:41px;left:27px}.tiny-stick .a1{transform:rotate(55deg)}.tiny-stick .a2{transform:rotate(-45deg)}.tiny-stick .stick-leg{width:3px;height:27px;top:62px;left:27px}.tiny-stick .l1{transform:rotate(30deg)}.tiny-stick .l2{transform:rotate(-30deg)}
.round-label{font-size:12px;font-weight:900;color:#b8adc7}.score-pill{font-size:11px;font-weight:900;padding:8px 10px;border-radius:999px;background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.08)}.game-wrap{max-width:470px;margin:0 auto}.lia-reaction{display:flex;align-items:center;gap:10px;margin:12px 0 14px}.mini-face{width:54px;height:54px;overflow:visible;background:transparent;transform:rotate(-4deg)}.mini-face img{width:100%;height:100%;object-fit:contain;object-position:50% 20%;transform:scale(1.08);filter:drop-shadow(3px 4px 2px rgba(0,0,0,.25))}.speech{font-size:12px;line-height:1.35;background:rgba(255,255,255,.08);padding:9px 12px;border-radius:14px 14px 4px 14px;flex:1;color:#e6dfec}
.game-card{background:linear-gradient(180deg,rgba(45,29,72,.94),rgba(29,19,46,.96));border:1px solid rgba(255,255,255,.09);border-radius:28px;padding:20px;box-shadow:var(--shadow);min-height:590px;position:relative;overflow:hidden}.game-card:after{content:"";position:absolute;width:190px;height:190px;border-radius:50%;right:-90px;top:-100px;background:radial-gradient(circle,rgba(255,79,185,.22),transparent 68%);pointer-events:none}.game-icon{font-size:42px}.game-title{font-size:31px;line-height:1.04;margin:8px 0 6px;letter-spacing:-.035em}.game-sub{color:#bcb0ca;font-size:13px;line-height:1.45;margin-bottom:18px}.turn-banner{display:flex;align-items:center;gap:10px;background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.08);border-radius:18px;padding:9px 10px;margin:10px 0 16px}.turn-avatar{width:48px;height:48px;overflow:visible;background:transparent;transform:rotate(-4deg);flex:0 0 auto}.turn-avatar img{width:100%;height:100%;object-fit:contain;filter:drop-shadow(2px 3px 2px rgba(0,0,0,.25))}.turn-avatar.tom img{object-position:50% 28%;transform:scale(1.05)}.turn-avatar.liav img{object-position:50% 22%;transform:scale(1.08)}.turn-copy{display:flex;flex-direction:column;text-align:right}.turn-copy b{font-size:13px}.turn-copy small{color:#a99eb7;font-size:10px}
.timer{text-align:center;font-size:42px;font-weight:900;letter-spacing:-.04em;margin:8px 0}.stairs-arena{height:260px;position:relative;margin:8px 0 14px}.stairs{position:absolute;inset:8px 4px 0}.step{height:26px;border-top:4px solid rgba(255,255,255,.6);border-left:4px solid rgba(255,255,255,.6);margin-right:auto}.runner{position:absolute;width:58px;height:58px;overflow:visible;background:transparent;transition:top .06s,left .06s;z-index:3;transform:rotate(-5deg)}.runner img{width:100%;height:100%;object-fit:contain;filter:drop-shadow(2px 3px 2px rgba(0,0,0,.25))}.runner.tom img{object-position:50% 28%;transform:scale(1.05)}.runner.liav img{object-position:50% 22%;transform:scale(1.08)}.tap-zone,.big-action{width:100%;border:0;border-radius:18px;background:linear-gradient(135deg,var(--pink),var(--orange));padding:15px;font-weight:900;font-size:17px;box-shadow:0 12px 28px rgba(255,79,185,.22)}.tap-zone.active{transform:scale(.99)}
.meter-wrap{margin:22px 0}.meter-stage{display:grid;grid-template-columns:auto 78px;gap:14px;align-items:stretch;justify-content:center;direction:rtl}.meter-track{height:300px;width:64px;border-radius:999px;background:linear-gradient(180deg,#89ffad 0%,#ffd66b 47%,#ff596c 100%);position:relative;border:5px solid rgba(255,255,255,.1)}.meter-target{position:absolute;left:-8px;right:-8px;height:43px;bottom:7%;border:4px solid #fff;border-radius:14px;box-shadow:0 0 0 4px rgba(255,255,255,.12)}.meter-pin{position:absolute;left:-17px;width:88px;height:8px;border-radius:999px;background:#fff;box-shadow:0 4px 12px rgba(0,0,0,.35)}.meter-labels{height:300px;display:flex;flex-direction:column;justify-content:space-between;font-size:10px;color:#b8aec4;text-align:right;padding:3px 0 5px;line-height:1.15}.meter-labels span:last-child{color:#ff8d9b;font-weight:900}.meter-labels span:first-child{color:#a8ffbf;font-weight:900}
.timing-hint{text-align:center;font-size:12px;font-weight:900;color:#fff;padding:9px 12px;margin:4px 0 -8px;border-radius:12px;background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.12)}.meter-target{display:flex;align-items:center;justify-content:center}.meter-target span{position:absolute;left:calc(100% + 13px);white-space:nowrap;padding:4px 7px;border-radius:8px;background:#fff;color:#211536;font-size:10px;font-weight:900;box-shadow:0 4px 12px rgba(0,0,0,.24)}
.rail{height:300px;position:relative;overflow:hidden;border-radius:20px;background:repeating-linear-gradient(0deg,rgba(255,255,255,.05) 0 5px,transparent 5px 18px),#171022;border:1px solid rgba(255,255,255,.08)}.track{position:absolute;top:0;bottom:0;width:4px;background:#766b83;box-shadow:20px 0 0 #766b83}.t1{left:22%}.t2{left:69%}.cart{position:absolute;bottom:18px;left:calc(50% - 29px);width:58px;height:58px;display:grid;place-items:center;font-size:34px;border-radius:18px;background:rgba(255,255,255,.12);transition:left .1s}.train{position:absolute;top:-90px;width:66px;height:70px;font-size:48px;display:grid;place-items:center}.rail-controls{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:12px;direction:ltr}.mini-btn{border:0;border-radius:18px;background:rgba(255,255,255,.1);padding:16px;font-weight:900;font-size:25px}.answer-list{display:grid;gap:10px}.answer{border:1px solid rgba(255,255,255,.11);background:rgba(255,255,255,.07);border-radius:16px;padding:14px;text-align:right;font-weight:800}.answer.good{background:rgba(184,255,100,.17);border-color:rgba(184,255,100,.55)}.answer.bad{background:rgba(255,97,118,.17);border-color:rgba(255,97,118,.55)}
.primary-btn,.ghost-btn{width:100%;border:0;border-radius:19px;padding:16px 18px;font-weight:900;font-size:17px}.primary-btn{background:linear-gradient(135deg,var(--pink),var(--orange));box-shadow:0 14px 30px rgba(255,79,185,.28)}.primary-btn:active{transform:translateY(2px) scale(.99)}.ghost-btn{margin-top:10px;background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.12)}.text-btn{border:0;background:transparent;color:#a99eb7;font-weight:800;margin-top:13px;text-decoration:underline}.result-wrap{max-width:430px;margin:10px auto 0;text-align:center;position:relative}.winner-stick-wrap{height:190px;display:grid;place-items:center;margin-top:3px}.winner-stick-wrap .big-stick{transform:rotate(-2deg) scale(1.04)}.result-kicker{font-size:11px;color:var(--gold);font-weight:900;letter-spacing:.08em}.result-wrap h2{font-size:34px;line-height:1;margin:8px 0}.winner-name{font-size:44px;font-weight:900;background:linear-gradient(135deg,var(--pink),var(--orange));-webkit-background-clip:text;color:transparent}.result-wrap p{color:#c0b4cc;line-height:1.5;font-size:14px;max-width:360px;margin:8px auto 16px}.final-score{font-size:28px;font-weight:900;padding:14px;border-radius:18px;background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.08);margin-bottom:10px}.breakdown{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin:10px 0 16px}.break-item{padding:10px;border-radius:14px;background:rgba(255,255,255,.055);border:1px solid rgba(255,255,255,.07)}.break-item b{display:block;font-size:18px}.break-item span{font-size:9px;color:#a99eb7}.confetti{position:absolute;inset:-20px 0 auto;height:270px;overflow:hidden;pointer-events:none}.confetti i{position:absolute;top:-20px;width:8px;height:14px;border-radius:3px;animation:fall 3s linear infinite}@keyframes fall{to{transform:translateY(300px) rotate(500deg)}}
.modal{position:fixed;inset:0;z-index:40;background:rgba(7,5,12,.75);backdrop-filter:blur(8px);display:grid;place-items:center;padding:20px}.modal.hidden{display:none}.modal-card{max-width:390px;background:#211536;border:1px solid rgba(255,255,255,.1);border-radius:26px;padding:25px;position:relative;box-shadow:var(--shadow)}.modal-card h3{font-size:24px;margin:8px 0}.modal-card p{color:#c0b4cc;line-height:1.55}.modal-card .muted{font-size:12px;color:#91859e}.modal-x{position:absolute;left:14px;top:12px;border:0;background:transparent;font-size:30px}.modal-emoji{font-size:40px}.toast{position:fixed;left:50%;bottom:calc(24px + env(safe-area-inset-bottom));transform:translate(-50%,20px);background:#fff;color:#160f26;font-weight:900;font-size:12px;padding:11px 16px;border-radius:999px;z-index:60;opacity:0;pointer-events:none;transition:.22s;max-width:88%;text-align:center}.toast.show{opacity:1;transform:translate(-50%,0)}
@media(max-width:360px){.hero h1{font-size:46px}.pick-card{min-height:220px}.big-stick{transform:scale(.9)}.character-picks{gap:8px}.game-card{padding:17px}}
