:root{--ink:#2b1d14;--ink-soft:#5a4636;--paper:#fff4dc;--paper-2:#f6e3bb;--paper-3:#e9cf9c;--blossom:#ff7aa2;--blossom-deep:#d9477a;--indigo:#3b3a8f;--red:#e2412f;--gold:#ffc53d;--gold-deep:#c98a00;--good:#3fbf6a;--good-deep:#1f7a41;--bad:#ff8a3d;--world:#6cc04a;--world-deep:#1f4d1a;--stage-w:1280px;--stage-h:720px;--font-letters:"Andika", "Comic Sans MS", system-ui, sans-serif;--font-display:"Luckiest Guy", "Baloo 2", system-ui, sans-serif;--font-ui:"Baloo 2", "Andika", system-ui, sans-serif;--shadow-press:0 7px 0 var(--ink);--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light;--sat:env(safe-area-inset-top);--sab:env(safe-area-inset-bottom);--sal:env(safe-area-inset-left);--sar:env(safe-area-inset-right)}*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}html,body,#root{height:100%;margin:0;overflow:hidden}body{font-family:var(--font-ui);color:var(--ink);-webkit-user-select:none;user-select:none;-webkit-touch-callout:none;touch-action:manipulation;overscroll-behavior:none;background:#1d1230}img{-webkit-user-drag:none;-webkit-user-select:none;user-select:none}button{font:inherit;color:inherit;cursor:pointer;background:0 0;border:0;padding:0}button:focus-visible{outline:4px solid var(--gold);outline-offset:4px}.viewport{background:radial-gradient(ellipse at center, color-mix(in srgb, var(--world) 45%, #1d1230) 0%, #1d1230 75%);place-items:center;transition:background .6s;display:grid;position:fixed;inset:0}.stage{width:var(--stage-w);height:var(--stage-h);transform-origin:0 0;contain:layout paint;touch-action:none;background:#222;border-radius:0;position:absolute;top:50%;left:50%;overflow:hidden}.scrollable{touch-action:pan-y}.scene{position:absolute;inset:0}.bg-img{object-fit:cover;filter:saturate(.88)brightness(1.04);width:100%;height:100%;position:absolute;inset:0}.vignette{pointer-events:none;background:radial-gradient(at 50% 45%,#0000 55%,#2b1d1459 100%);position:absolute;inset:0}.rotate{z-index:99;color:var(--paper);text-align:center;font-family:var(--font-display);letter-spacing:1px;background:#1d1230;flex-direction:column;justify-content:center;align-items:center;gap:24px;padding:24px;font-size:28px;display:none;position:fixed;inset:0}.rotate img{width:42vw;max-width:220px;animation:2.4s ease-in-out infinite tilt}@keyframes tilt{0%,30%{transform:rotate(0)}60%,to{transform:rotate(-90deg)}}@media (orientation:portrait) and (width<=700px){.rotate{display:flex}}.sprite{pointer-events:none;filter:drop-shadow(0 10px 8px #2b1d1447);will-change:transform;position:absolute}.shadow-blob{pointer-events:none;background:radial-gradient(#2b1d1459,#0000 70%);border-radius:50%;height:22px;position:absolute}.bob{animation:2.2s ease-in-out infinite bob}@keyframes bob{0%,to{transform:translateY(0)scale(1)}50%{transform:translateY(-8px)scale(.99,1.01)}}.breathe{transform-origin:50% 100%;animation:2.6s ease-in-out infinite breathe}@keyframes breathe{0%,to{transform:scale(1)}50%{transform:scale(1.02,.98)}}.float{animation:3s ease-in-out infinite floaty}@keyframes floaty{0%,to{transform:translateY(0)rotate(-2deg)}50%{transform:translateY(-18px)rotate(2deg)}}.flip{transform:scaleX(-1)}.panel{background:var(--paper);border:5px solid var(--ink);box-shadow:0 8px 0 var(--ink), 0 18px 30px #00000040;border-radius:28px}.tile{--size:104px;min-width:var(--size);height:var(--size);font-family:var(--font-letters);font-weight:700;font-size:calc(var(--size) * .62);color:var(--ink);background:linear-gradient(180deg, #fffaf0 0%, var(--paper) 55%, var(--paper-2) 100%);border:5px solid var(--ink);box-shadow:var(--shadow-press);touch-action:manipulation;border-radius:22px;place-items:center;padding:0 16px;line-height:1;transition:transform 80ms,box-shadow 80ms,opacity .2s;display:inline-grid;position:relative}.tile .g{letter-spacing:1px;transform:translateY(-4%)}.tile:active,.tile.pressed{box-shadow:0 1px 0 var(--ink);transform:translateY(6px)}.tile.used{opacity:.25;box-shadow:0 1px 0 var(--ink);pointer-events:none;transform:translateY(6px)scale(.92)}.tile.wrong{background:#ffe0cc;animation:.4s shake}.tile.right{background:linear-gradient(#eaffea,#bff0c9)}.tile.hint{animation:1s ease-in-out infinite hintglow}.tile.sm{--size:80px;border-width:4px;border-radius:18px}.tile.lg{--size:150px;border-width:6px;border-radius:30px}.tile.xl{--size:230px;box-shadow:0 10px 0 var(--ink);border-width:7px;border-radius:40px}@keyframes shake{0%,to{translate:0}20%{translate:-12px}40%{translate:10px}60%{translate:-7px}80%{translate:4px}}@keyframes hintglow{0%,to{box-shadow:var(--shadow-press), 0 0 0 0 #ffc53de6}50%{box-shadow:var(--shadow-press), 0 0 0 14px #ffc53d00}}.slots{justify-content:center;align-items:flex-end;gap:12px;display:flex}.slot{--size:104px;min-width:var(--size);height:var(--size);background:#fff4dcd1;border:5px dashed #2b1d14b3;border-radius:22px;place-items:center;display:grid;position:relative;box-shadow:inset 0 4px #2b1d1426}.slot.active{border-color:var(--gold-deep);background:#ffe596b3;animation:1.2s ease-in-out infinite slotpulse}.slot.filled{background:0 0;border:none}.slot .tile{width:100%;min-width:0;position:absolute;inset:0}@keyframes slotpulse{0%,to{transform:scale(1)}50%{transform:scale(1.05)}}.sb{background:var(--ink);border-radius:6px;height:10px;position:absolute;bottom:-22px;left:50%;translate:-50%}.sb.dot{border-radius:50%;width:12px;height:12px}.sb.bar{width:70%}.sb.two{background:radial-gradient(circle at 6px 6px, var(--ink) 5.5px, transparent 6.5px) 0 0 / 18px 12px repeat-x;border-radius:0;width:30px;height:12px}.sb.two.lit{background:radial-gradient(circle at 6px 6px, var(--gold-deep) 5.5px, transparent 6.5px) 0 0 / 18px 12px repeat-x;box-shadow:none}.sb.lit{background:var(--gold-deep);box-shadow:0 0 0 4px #ffc53d80}.btn-round{background:radial-gradient(circle at 35% 30%, #fff 0%, var(--gold) 45%, var(--gold-deep) 100%);border:5px solid var(--ink);width:92px;height:92px;box-shadow:0 6px 0 var(--ink);border-radius:50%;place-items:center;transition:transform 80ms,box-shadow 80ms;display:grid}.btn-round:active{box-shadow:0 1px 0 var(--ink);transform:translateY(5px)}.btn-round svg{width:54%;height:54%}.btn-round.sm{border-width:5px;width:84px;height:84px}.btn-round.go{background:radial-gradient(circle at 35% 30%, #d9ffe4 0%, var(--good) 50%, var(--good-deep) 100%)}.btn-round.pink{background:radial-gradient(circle at 35% 30%, #ffe3ee 0%, var(--blossom) 50%, var(--blossom-deep) 100%)}.btn-round.pulse{animation:1.3s ease-in-out infinite pulse}@keyframes pulse{0%,to{transform:scale(1)}50%{transform:scale(1.1)}}.topbar{z-index:20;pointer-events:none;align-items:center;gap:14px;display:flex;position:absolute;top:16px;left:18px;right:18px}.topbar>*{pointer-events:auto}.topbar .spacer{pointer-events:none;flex:1}.sensei-dock{z-index:30;pointer-events:none;width:190px;height:240px;position:absolute;bottom:0;left:8px}.sensei-dock img{transform-origin:50% 100%;width:190px;transition:transform .2s;position:absolute;bottom:-12px;left:0}.sensei-dock.talking img{animation:.35s ease-in-out infinite alternate talk}@keyframes talk{0%{transform:rotate(-1.5deg)scale(1)}to{transform:rotate(1.5deg)scale(1.02,.98)}}.bubble{z-index:31;max-width:520px;font-family:var(--font-ui);border:4px solid var(--ink);box-shadow:0 6px 0 var(--ink);pointer-events:none;background:#fffdf6;border-radius:26px;padding:14px 22px;font-size:25px;font-weight:700;line-height:1.2;animation:.25s cubic-bezier(.3,1.6,.6,1) pop;position:absolute;bottom:30px;left:150px}.bubble:before{content:"";border-left:4px solid var(--ink);border-bottom:4px solid var(--ink);background:#fffdf6;border-radius:0 0 0 6px;width:30px;height:30px;position:absolute;bottom:16px;left:-22px;transform:skewY(30deg)rotate(20deg)}.bubble.baron,.bubble.baron:before{background:#efe0ff}@keyframes pop{0%{opacity:0;transform:scale(.6)}to{opacity:1;transform:scale(1)}}.display{font-family:var(--font-display);color:var(--paper);letter-spacing:2px;-webkit-text-stroke:3px var(--ink);paint-order:stroke fill;text-shadow:0 6px 0 var(--ink)}.logo{font-family:var(--font-display);letter-spacing:4px;color:var(--paper);text-align:center;-webkit-text-stroke:10px var(--ink);paint-order:stroke fill;text-shadow:0 12px 0 var(--ink), 0 22px 30px #00000059;font-size:150px;line-height:.86;transform:rotate(-4deg)}.logo .l2{color:var(--red);font-size:190px;display:block}.logo .l1{color:var(--gold);display:block}.hearts{gap:6px;display:flex}.hearts img{width:50px;transition:transform .3s,opacity .3s,filter .3s}.hearts img.lost{filter:grayscale()brightness(.7);opacity:.5;transform:scale(.8)}.progress{border:4px solid var(--ink);background:#2b1d1459;border-radius:20px;flex:0 0 360px;height:30px;position:relative;overflow:hidden}.progress>div{background:linear-gradient(180deg, #ffe38a, var(--gold) 60%, var(--gold-deep));border-right:4px solid var(--ink);width:0;transition:width .5s cubic-bezier(.3,1.4,.6,1);position:absolute;inset:0}.progress img{width:52px;transition:left .5s;position:absolute;top:-14px}.card{background:var(--paper);border:5px solid var(--ink);box-shadow:0 8px 0 var(--ink), 0 20px 34px #00000040;border-radius:30px;place-items:center;display:grid;position:absolute}.card img{object-fit:contain;width:86%;height:86%}.center{position:absolute;top:50%;left:50%;translate:-50% -50%}.row{flex-wrap:wrap;justify-content:center;align-items:center;gap:14px;display:flex}.fade-in{animation:.5s both fadein}@keyframes fadein{0%{opacity:0}to{opacity:1}}.pop-in{animation:.45s cubic-bezier(.3,1.6,.6,1) both popin}@keyframes popin{0%{opacity:0;transform:scale(.3)}to{opacity:1;transform:scale(1)}}.drop-in{animation:.55s cubic-bezier(.3,1.5,.6,1) both dropin}@keyframes dropin{0%{transform:translateY(-120%)}to{transform:translateY(0)}}.hit{animation:.45s hitshake}@keyframes hitshake{0%,to{filter:none;translate:0}15%{filter:brightness(2.2)saturate(0);translate:18px -6px}35%{translate:-14px}55%{filter:none;translate:9px}75%{translate:-4px}}.screen-shake{animation:.4s screenshake}@keyframes screenshake{0%,to{translate:0}20%{translate:-10px 6px}40%{translate:9px -6px}60%{translate:-6px 3px}80%{translate:4px -2px}}.fullscreen-fade{z-index:90;pointer-events:none;background:#1d1230;animation:.6s forwards fadeout;position:absolute;inset:0}@keyframes fadeout{0%{opacity:1}to{opacity:0}}.caption-hidden .bubble,.bubble.notail:before{display:none}.sensei-dock.auto img{transition:transform .35s cubic-bezier(.3,1.4,.6,1)}.sensei-dock.auto.away img{transform:translateY(110%)}.map-next{animation:1.1s ease-in-out infinite mapnext}@keyframes mapnext{0%,to{translate:0;scale:1}50%{translate:0 -12px;scale:1.06}}.gem-ready{animation:1s ease-in-out infinite gemready}@keyframes gemready{0%,to{filter:drop-shadow(0 0 #ffc53d00);translate:0}50%{filter:drop-shadow(0 0 16px #ffc53df2);translate:0 -6px}}.gem-sparkle{pointer-events:none;background:radial-gradient(circle, #fff 0 18%, transparent 20%), conic-gradient(from 0deg, transparent 0 20deg, #fff 22deg 26deg, transparent 28deg 110deg, #fff 112deg 116deg, transparent 118deg 200deg, #fff 202deg 206deg, transparent 208deg 290deg, #fff 292deg 296deg, transparent 298deg);border-radius:50%;width:22%;height:22%;animation:2.2s ease-in-out infinite sparkle;position:absolute;top:6%;right:8%}@keyframes sparkle{0%,to{opacity:0;rotate:0deg;scale:.4}40%{opacity:1;scale:1}70%{opacity:0;rotate:90deg}}.help-btn{z-index:85;border:6px solid var(--ink);width:124px;height:124px;box-shadow:0 7px 0 var(--ink), 0 0 0 6px #fff4dccc;background:radial-gradient(circle at 40% 35%,#fff8e6,#ffd98a 70%,#e0a53a);border-radius:50%;position:absolute;bottom:14px;left:14px;overflow:visible}.help-face{object-fit:cover;border-radius:50%;width:calc(100% - 10px);height:calc(100% - 10px);position:absolute;inset:5px}.help-waves{fill:none;stroke:#ffc53d;stroke-width:7px;stroke-linecap:round;filter:drop-shadow(0 2px #2b1d14);width:44px;height:70px;position:absolute;top:50%;left:100%;translate:6px -50%}.help-waves path{opacity:0;animation:.9s ease-out infinite wave}.help-waves path:nth-child(2){animation-delay:.15s}.help-waves path:nth-child(3){animation-delay:.3s}@keyframes wave{0%{opacity:0}30%{opacity:1}to{opacity:0}}.help-q{background:var(--good);border:5px solid var(--ink);color:#fff;width:46px;height:46px;font-family:var(--font-display);text-align:center;text-shadow:0 2px 0 var(--ink);border-radius:50%;font-size:30px;line-height:38px;position:absolute;top:-10px;right:-10px}.help-btn.talking{animation:.5s ease-in-out infinite alternate helptalk}@keyframes helptalk{0%{scale:1}to{scale:1.07}}.help-btn.nudge{animation:1s ease-in-out infinite helpnudge}@keyframes helpnudge{0%,to{rotate:0deg;scale:1}20%{rotate:-8deg;scale:1.15}40%{rotate:8deg;scale:1.15}60%{rotate:0deg;scale:1.08}}@keyframes taphint{0%,to{transform:translate(0)scale(1)}45%{transform:translate(-10px,-18px)scale(1.05)}60%{transform:translate(0)scale(.92)}}.tape{z-index:2;background:repeating-linear-gradient(45deg,#ff7aa2bf 0 8px,#ffc8d7bf 8px 16px);border-radius:3px;width:70px;height:22px;position:absolute;top:2px;left:50%;translate:-50%;rotate:-4deg;box-shadow:0 1px 2px #0003}.sheet{background:#fff;border-radius:14px;position:relative;overflow:hidden;box-shadow:0 2px #e6c9bb,0 14px 30px #783c2840}.sheet:after{content:"";pointer-events:none;border-radius:inherit;mix-blend-mode:screen;background:linear-gradient(115deg,#fff0 30%,#ffffff8c 42%,#fff0 50%);position:absolute;inset:0}.gem-won{animation:3s ease-in-out infinite gemwon}@keyframes gemwon{0%,to{filter:brightness()}50%{filter:brightness(1.25)}}.btn-go-wide{font-family:var(--font-ui);color:#fff;text-shadow:0 2px #00000059;border:5px solid var(--ink);box-shadow:0 7px 0 var(--ink);background:linear-gradient(180deg, #7ce39a, var(--good) 60%, var(--good-deep));border-radius:999px;padding:18px 30px;font-size:32px;font-weight:800}.btn-go-wide:active{box-shadow:0 2px 0 var(--ink);transform:translateY(5px)}.name-input{width:560px;height:110px;font-family:var(--font-letters);text-align:center;color:var(--ink);border:6px solid var(--ink);-webkit-user-select:text;user-select:text;touch-action:manipulation;background:#fff;border-radius:26px;outline:none;font-size:72px;font-weight:700;box-shadow:inset 0 6px #2b1d141a}.name-input:focus{border-color:#3fbf6a;box-shadow:0 0 0 8px #3fbf6a4d}.villain-dark{background:radial-gradient(at 75% 40%,#5a145a26,#140014b8 75%);animation:.35s ease-out both vdark;position:absolute;inset:0}@keyframes vdark{0%{opacity:0}to{opacity:1}}.villain-card{background:radial-gradient(circle,#6d1a4a 0%,#2a0a2a 70%);border:7px solid #120412;border-radius:50%;width:330px;height:330px;animation:.45s cubic-bezier(.2,1.5,.4,1) both vin,1.2s ease-in-out .45s infinite vpulse;position:absolute;top:30px;right:30px;box-shadow:0 0 0 5px #b3264a,0 0 60px 20px #a028dcb3}.villain-clip{border-radius:50%;position:absolute;inset:0;overflow:hidden}.villain-clip img{transform-origin:50% 100%;width:112%;animation:.28s ease-in-out infinite alternate vtalk;position:absolute;bottom:-6%;left:50%;translate:-50%}.villain-name{white-space:nowrap;font-family:var(--font-display);color:#ffd2e6;letter-spacing:1px;background:#120412;border:4px solid #b3264a;border-radius:14px;padding:2px 18px;font-size:34px;position:absolute;bottom:-26px;left:50%;translate:-50%}@keyframes vin{0%{opacity:0;transform:translate(260px,-80px)rotate(25deg)scale(.4)}to{opacity:1;transform:none}}@keyframes vpulse{50%{box-shadow:0 0 0 5px #e0306a,0 0 90px 30px #aa28f0d9}}@keyframes vtalk{0%{transform:rotate(-2deg)scale(1)}to{transform:rotate(2deg)scale(1.03,.98)}}.help-btn.talking{box-shadow:0 7px 0 var(--ink), 0 0 0 8px #ffc53df2, 0 0 30px 8px #ffdc78e6}