:root{--green:#4f9d2f;--green-hi:#a8e85c;--green-lo:#2f6b1b;--amber:#f4a23c;--amber-hi:#ffd27a;--amber-lo:#b9661c;--blue:#4a6fd6;--purple:#8e2f6e;--red:#e8554a;--dark:#3a2a33;--dark-lo:#241823;--cream:#fdf6e8;--cream-2:#f1e6d0;--muted:#8a7a72;--bg:#1c1838;--shadow:0 24px 60px #24182352;--title:"Baloo 2", "Nunito", system-ui, sans-serif;--safe-l:env(safe-area-inset-left,0px);--safe-r:env(safe-area-inset-right,0px)}*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}html,body{height:100%;min-height:var(--app-h,100%);background:var(--bg);color:var(--dark);overscroll-behavior:none;touch-action:none;-webkit-user-select:none;user-select:none;-webkit-touch-callout:none;margin:0;font-family:system-ui,Nunito,sans-serif;overflow:hidden}#game{width:100%;height:100dvh;height:var(--app-h,100dvh);position:fixed;top:0;left:0}#game canvas{display:block}#ui{left:0;right:0;top:var(--vv-top,0);height:var(--vv-h,100%);pointer-events:none;z-index:10;zoom:var(--ui-zoom,1);position:fixed}#ui>*{pointer-events:auto}.panel{background:var(--cream);color:var(--dark);box-shadow:var(--shadow);text-align:center;border-radius:28px;width:min(92vw,480px);max-height:calc(100% - 12px);padding:18px 24px;position:absolute;top:50%;left:50%;overflow:auto;transform:translate(-50%,-50%)}.panel h2{font:800 30px/1.1 var(--title);color:var(--dark);text-transform:uppercase;margin:4px 0 10px}.panel p{color:var(--muted);margin:8px 0;font-weight:600}.panel b{color:var(--dark)}.panel input[type=text]{width:100%;font:800 24px var(--title);text-transform:uppercase;text-align:center;border:3px solid var(--cream-2);color:var(--dark);-webkit-user-select:text;user-select:text;letter-spacing:2px;background:#fff;border-radius:16px;outline:none;padding:8px 12px}.panel input[type=text]:focus{border-color:var(--green)}.btn{cursor:pointer;font:800 18px var(--title);text-transform:uppercase;letter-spacing:.5px;color:#5a2e14;background:linear-gradient(var(--amber-hi), var(--amber));min-width:120px;min-height:50px;box-shadow:0 6px 0 var(--amber-lo), 0 10px 18px #2418232e;border:0;border-radius:999px;justify-content:center;align-items:center;gap:8px;margin:6px 4px;padding:10px 22px 8px;transition:transform 80ms,box-shadow 80ms;display:inline-flex}.btn.green{color:#fff;background:linear-gradient(var(--green-hi), var(--green));box-shadow:0 6px 0 var(--green-lo), 0 10px 18px #2418232e;text-shadow:0 2px #0000002e}.btn.ghost{color:var(--muted);background:var(--cream-2);box-shadow:0 6px #d4c6ad}.btn.dark{color:#fff;background:var(--dark);box-shadow:0 6px 0 var(--dark-lo)}.btn.purple{color:#ffd27a;background:linear-gradient(#b0458e, var(--purple));box-shadow:0 6px #5e1c48}.btn:hover:not(:disabled){transform:translateY(-1px)}.btn:active:not(:disabled){transform:translateY(5px);box-shadow:0 1px #00000040}.btn:disabled{opacity:.5;cursor:default}.btn img{width:24px;height:24px}.btn.big{min-width:280px;min-height:60px;font-size:24px}.btn.wide{width:100%}.link{color:var(--blue);font:700 15px var(--title);cursor:pointer;background:0 0;border:0;text-decoration:underline}.error{min-height:1.2em;font-weight:800;color:var(--red)!important}.tip{color:var(--muted);font-size:14px;font-weight:600}.row{flex-wrap:wrap;justify-content:center;gap:4px;display:flex}label.check{color:var(--dark);justify-content:center;align-items:center;gap:8px;margin:8px 0;font-weight:700;display:flex}select{font:700 16px var(--title);border:2px solid var(--cream-2);border-radius:12px;padding:4px 8px}.badge{font:800 14px var(--title);color:#fff;background:var(--dark);border-radius:999px;align-items:center;gap:6px;padding:4px 14px;display:inline-flex}.badge.green{background:var(--green)}.badge.amber{background:var(--amber);color:#5a2e14}.badge.purple{background:var(--purple)}.badge.blue{background:var(--blue)}.menu{padding:14px calc(18px + var(--safe-r)) 14px calc(18px + var(--safe-l));flex-direction:column;display:flex;position:absolute;inset:0}.topbar{align-items:center;gap:10px;display:flex}.topbar .mini-logo{filter:drop-shadow(0 6px 10px #00000059);height:74px}.topbar .spacer{flex:1}.icon-btn{cursor:pointer;background:var(--cream);width:56px;height:56px;box-shadow:0 5px 0 #d4c6ad, var(--shadow);border:0;border-radius:18px;place-items:center;display:grid}.icon-btn img{width:30px;height:30px}.icon-btn:active{transform:translateY(4px);box-shadow:0 1px #d4c6ad}.modes{flex:1;grid-template-columns:1.35fr 1fr;align-items:center;gap:18px;min-height:0;padding:10px 0;display:grid}.mode-card{cursor:pointer;height:100%;max-height:640px;box-shadow:0 8px 0 #00000040, var(--shadow);text-align:left;color:#fff;background:#2a2457 50%/cover no-repeat;border:0;border-radius:30px;padding:0;transition:transform .12s;position:relative;overflow:hidden}.mode-card:active{transform:scale(.98)}.mode-card:after{content:"";background:linear-gradient(#0000 35%,#140c1ed9);position:absolute;inset:0}.mode-card .info{z-index:1;position:absolute;bottom:18px;left:22px;right:90px}.mode-card h3{font:800 40px/1 var(--title);text-shadow:0 3px #00000059;margin:6px 0 4px}.mode-card p{opacity:.9;margin:0;font-weight:600}.mode-card .play{z-index:1;background:linear-gradient(var(--green-hi), var(--green));width:64px;height:64px;box-shadow:0 5px 0 var(--green-lo);border-radius:50%;place-items:center;display:grid;position:absolute;bottom:18px;right:18px}.mode-card .play img{width:30px}.mode-card.secondary h3{font-size:30px}.offline-note{text-align:center;color:#ffd27a;font:700 15px var(--title)}.select-panel{border-radius:26px;width:min(96vw,940px);padding:10px 16px;top:auto;bottom:10px;transform:translate(-50%)}.select-panel .group{flex-wrap:wrap;justify-content:center;align-items:center;gap:8px;display:flex}.select-panel .label{font:800 14px var(--title);color:var(--muted);text-transform:uppercase}.chip{cursor:pointer;background:var(--cream-2);font:800 13px var(--title);color:var(--dark);text-transform:uppercase;border:3px solid #0000;border-radius:16px;width:86px;padding:0;overflow:hidden}.chip img{object-fit:cover;width:100%;height:44px;display:block}.chip span{padding:2px 0;display:block}.chip.on{border-color:var(--green);box-shadow:0 0 0 3px #4f9d2f40}.level.btn{min-width:100px;min-height:42px;font-size:16px}.result{-webkit-overflow-scrolling:touch;padding:18px calc(28px + var(--safe-r)) 18px calc(28px + var(--safe-l));color:#fff;grid-template-columns:1fr 1fr;align-items:center;gap:20px;display:grid;position:absolute;inset:0;overflow-y:auto}.result.victory{background:repeating-conic-gradient(at 50% 45%,#f7913a 0deg 9deg,#f9a74f 9deg 18deg),#f7913a}.result.victory:before{content:"";pointer-events:none;background:radial-gradient(circle at 50% 45%,#ffdc8c8c,#0000 60%);position:absolute;inset:0}.result.defeat{background:linear-gradient(#1f2a5a,#151b3d)}.result .hero{text-align:center;position:relative}.result h1{font:800 64px/1 var(--title);text-shadow:0 4px #0003;margin:0}.result.victory h1{color:#fff}.result .sub{font:700 18px var(--title);opacity:.92;margin:6px 0 4px}.result .stars{justify-content:center;align-items:flex-end;gap:4px;margin:6px 0;display:flex}.result .stars img{width:64px}.result .stars img:nth-child(2){width:86px;margin-bottom:14px}.result .portraits{justify-content:center;gap:10px;display:flex}.result .portraits img{filter:drop-shadow(0 8px 10px #0000004d);width:110px}.result .portraits img.loser{filter:grayscale(.8)brightness(.8);width:90px}.result .card{background:var(--cream);color:var(--dark);box-shadow:var(--shadow);border-radius:26px;padding:14px 18px;position:relative}.result .stat{border-bottom:1px solid var(--cream-2);color:var(--muted);justify-content:space-between;padding:8px 2px;font-weight:700;display:flex}.result .stat b{color:var(--dark);font:800 18px var(--title)}.result.defeat .card{color:#fff;background:#ffffff14;border:1px solid #ffffff26}.result.defeat .card h3{font:800 18px var(--title);color:#ffd27a;margin:0 0 6px}.result.defeat .card li{color:#e6e9ff;margin:4px 0;font-weight:600}.result.defeat .card ul{margin:0;padding-left:18px}.result .actions{flex-direction:column;align-items:stretch;gap:6px;margin-top:10px;display:flex}.result .actions .btn{margin:4px 0}.result .link{color:#fff;opacity:.9}.result.victory .link{color:#5a2e14}.result input[type=text]{width:100%;font:800 22px var(--title);text-transform:uppercase;text-align:center;border:3px solid var(--cream-2);-webkit-user-select:text;user-select:text;border-radius:14px;padding:8px}table.rank{border-collapse:separate;border-spacing:0 6px;width:100%;font-weight:800}table.rank td{background:#fff;padding:8px 10px}table.rank td:first-child{color:var(--amber-lo);font:800 20px var(--title);text-align:center;border-radius:14px 0 0 14px;width:2.2em}table.rank td:last-child{border-radius:0 14px 14px 0}table.rank tr.me td{background:#e5f6d8}table.rank td:nth-child(3){text-align:right;color:var(--green);font-family:var(--title)}table.rank small{color:var(--muted)}.code{font:800 58px var(--title);letter-spacing:8px;color:var(--dark);margin:4px 0}.rooms{max-height:30vh;margin:8px 0;padding:0;list-style:none;overflow:auto}.rooms li{background:#fff;border-radius:14px;justify-content:space-between;align-items:center;margin:4px 0;padding:6px 10px;display:flex}.rooms li span{font:800 22px var(--title);letter-spacing:3px}.modal{z-index:50;background:#140c1e99;justify-content:center;align-items:center;display:flex;position:absolute;inset:0}.modal .panel{width:min(96vw,780px);position:relative;top:auto;left:auto;transform:none}.help-grid{text-align:left;grid-template-columns:1fr 1.3fr;gap:14px;display:grid}.help-grid h3{font:800 20px var(--title);color:var(--green);text-transform:uppercase;margin:4px 0 8px}.help-grid p{color:var(--dark);font-weight:700;line-height:1.9}.help-row{align-items:center;gap:10px;margin:6px 0;font-weight:800;display:flex}.help-row img{width:40px;height:40px}.help-row span:last-child{color:var(--dark);margin-left:auto}.arrows{grid-template-columns:repeat(3,44px);gap:4px;margin-bottom:6px;display:grid}kbd{min-width:40px;height:40px;color:var(--dark);font:800 18px var(--title);background:url(/assets/ui/key.svg) 50%/100% 100% no-repeat;flex-shrink:0;justify-content:center;align-items:center;padding:0 8px 4px;display:inline-flex}kbd.wide{min-width:96px;font-size:15px}kbd.ghost{visibility:hidden}.or{color:var(--muted);margin:0 6px;font-size:13px}.help-foot{color:var(--muted);flex-wrap:wrap;justify-content:center;gap:6px 16px;margin:12px 0 6px;font-size:14px;font-weight:700;display:flex}.help-foot kbd{min-width:32px;height:32px;font-size:14px}.toast{background:var(--dark);color:#fff;font:700 15px var(--title);z-index:60;box-shadow:var(--shadow);border-radius:999px;padding:8px 18px;position:absolute;top:12px;left:50%;transform:translate(-50%)}.overlay-msg{color:#fff;font:800 24px var(--title);text-align:center;pointer-events:none;background:#241823d9;border-radius:20px;padding:12px 24px;position:absolute;top:42%;left:50%;transform:translate(-50%,-50%)}details.more summary{cursor:pointer;padding:4px;font-weight:800}#rotate{z-index:100;background:var(--bg);color:#fff;text-align:center;flex-direction:column;justify-content:center;align-items:center;display:none;position:fixed;inset:0}#rotate p{font:800 30px var(--title);margin:12px}#rotate .rotate-icon{font-size:64px;animation:2s ease-in-out infinite spin}@keyframes spin{0%,30%{transform:rotate(0)}60%,to{transform:rotate(-90deg)}}@media (orientation:portrait) and (pointer:coarse){#rotate{display:flex}}@media (height<=460px){.panel{border-radius:22px;padding:10px 16px}.panel h2{margin:2px 0 6px;font-size:22px}.btn{min-width:90px;min-height:40px;margin:4px 3px;padding:7px 16px 6px;font-size:15px}.btn.big{min-width:200px;min-height:46px;font-size:18px}.topbar .mini-logo{height:52px}.icon-btn{border-radius:14px;width:44px;height:44px}.icon-btn img{width:24px;height:24px}.menu{padding-top:8px;padding-bottom:10px}.modes{gap:12px;padding:6px 0 0}.mode-card{border-radius:22px}.mode-card h3{font-size:28px}.mode-card.secondary h3{font-size:22px}.mode-card p{font-size:12px}.mode-card .play{width:48px;height:48px;bottom:12px;right:12px}.mode-card .info{bottom:12px;left:14px;right:70px}.select-panel{padding:6px 10px;bottom:6px}.chip{width:64px;font-size:11px}.chip img{height:30px}.level.btn{min-width:76px;min-height:34px;font-size:13px}.result{padding:10px calc(16px + var(--safe-r)) 10px calc(16px + var(--safe-l));gap:12px}.result h1{font-size:42px}.result .stars img{width:44px}.result .stars img:nth-child(2){width:58px}.result .portraits img{width:70px}.result .portraits img.loser{width:56px}.result .card{padding:8px 14px}.result .stat{padding:4px 2px;font-size:13px}.help-grid{grid-template-columns:1fr 1fr;gap:6px}.modal .panel{padding:6px 10px}.help-grid p{line-height:1.5}kbd{min-width:30px;height:30px;font-size:14px}.help-row img{width:28px;height:28px}.help-foot{display:none}.code{font-size:40px}}body.short .result{align-items:start;gap:10px;padding-top:6px;padding-bottom:6px}body.short .result h1{font-size:30px}body.short .result .sub{margin:2px 0;font-size:13px}body.short .result .stars img{width:30px}body.short .result .stars img:nth-child(2){width:40px;margin-bottom:8px}body.short .result .portraits img{width:46px}body.short .result .portraits img.loser{width:38px}body.short .result .card{border-radius:18px;padding:6px 12px}body.short .result .stats{gap:8px;display:flex}body.short .result .stat{border:0;flex-direction:column;flex:1;align-items:center;padding:2px;font-size:11px}body.short .result .stat b{font-size:16px}body.short .result input[type=text]{padding:5px;font-size:18px}body.short .result .actions{margin-top:6px}body.short .result .actions .btn{min-height:38px}body.short .result.defeat .card li{margin:2px 0;font-size:12px}body.short .menu .topbar .mini-logo{height:40px}body.short .mode-card h3{font-size:22px}body.short .mode-card p{display:none}body.typing .result{grid-template-columns:1fr;align-items:start}body.typing .result .hero,body.typing .result .stats{display:none}body.typing .select-panel,body.typing .panel{top:4px;transform:translate(-50%)}.touch-help{width:min(96vw,820px)!important}.touch-grid{text-align:left;grid-template-columns:1fr 1.25fr;align-items:center;gap:14px;display:grid}.touch-grid p{color:var(--dark);font-size:14px;font-weight:600}.stick{background:#3a2a331f;border:4px solid #d9c9b0;border-radius:50%;width:150px;height:150px;margin:6px auto 4px;position:relative}.stick .knob{background:#f8e6d0;border-radius:50%;width:62px;height:62px;margin:-31px;position:absolute;top:50%;left:50%;box-shadow:0 5px #d4b896}.stick .d{font:800 13px var(--title);color:var(--dark);white-space:nowrap;position:absolute}.stick .up{top:-4px;left:50%;transform:translate(-50%,-100%)}.stick .down{bottom:-4px;left:50%;transform:translate(-50%,100%)}.stick .left{font-size:20px;top:50%;left:8px;transform:translateY(-50%)}.stick .right{font-size:20px;top:50%;right:8px;transform:translateY(-50%)}.tbtn{color:#fdf6e8;width:46px;height:46px;font:800 10px var(--title);background:#5c3d2e;border:3px solid #8a6a55;border-radius:50%;flex-shrink:0;place-items:center;display:inline-grid}.tbtn img{width:28px;height:28px}.tbtn.main{background:radial-gradient(#ffc46a,#f5a23a);border:4px solid #fff3df;width:54px;height:54px}.tbtn.super{color:#e3a6ff;background:#2b1d36;border:4px solid #c56bff}.touch-help .help-row span:last-child{margin-left:0;font-size:14px;font-weight:600}body.short .stick{width:100px;height:100px}body.short .stick .knob{width:40px;height:40px;margin:-20px}body.short .tbtn{width:34px;height:34px}body.short .tbtn.main{width:40px;height:40px}body.short .touch-help .help-row{margin:3px 0}.settings{width:min(96vw,820px)!important}.settings-grid{text-align:left;grid-template-columns:1fr 1fr;gap:6px 22px;display:grid}.settings h3{font:800 16px var(--title);color:var(--green);text-transform:uppercase;margin:8px 0 2px}.opt{color:var(--dark);grid-template-columns:1fr 1.1fr 44px;align-items:center;gap:8px;margin:4px 0;font-size:14px;font-weight:700;display:grid}.opt small{color:var(--muted);font-size:11px;font-weight:600;display:block}.opt output{font:800 13px var(--title);color:var(--muted);text-align:right}.opt select{grid-column:2/4}.switch-row{grid-template-columns:1fr auto}.opt input[type=range]{width:100%;accent-color:var(--green)}.opt input[type=checkbox]{width:22px;height:22px;accent-color:var(--green)}body.short .settings-grid{gap:0 14px}body.short .opt{margin:1px 0;font-size:12px}body.short .settings h3{margin:4px 0 0;font-size:13px}.touch-haptics{pointer-events:none;z-index:5;position:fixed;inset:0}.touch-haptics label{pointer-events:auto;touch-action:none;-webkit-user-select:none;user-select:none;border-radius:50%;position:fixed}.touch-haptics input{display:none}.fs-splash{right:calc(16px + var(--safe-r));min-width:0;position:absolute;top:12px}.namerow{align-items:center;gap:8px;display:flex}.namerow input[type=text]{flex:1;min-width:0}.namerow .btn{white-space:nowrap;min-width:0;margin:0}body.typing .result .card{padding:6px 10px}body.typing .result .card .tip,body.typing .result .actions{display:none}body.typing .result{padding-top:4px}body.short .select-panel{padding:4px 8px}body.short .select-panel .chip{border-width:2px;width:auto;padding:2px 8px}body.short .select-panel .chip img,body.short .select-panel .label,body.short .select-panel .tip{display:none}body.short .select-panel .btn.big{min-width:0;min-height:36px;font-size:15px}body.short .select-panel .btn{margin:2px}.stick{margin:22px auto 26px}body.short .stick{margin:16px auto 20px}.result .stat.points b{color:var(--green);font-size:22px}.breakdown{flex-wrap:wrap;gap:4px 6px;margin:6px 0 2px;display:flex}.breakdown span{background:var(--cream-2);font:700 12px var(--title);color:var(--muted);border-radius:999px;padding:2px 10px}.breakdown span b{color:var(--dark)}.breakdown .mult{color:var(--green-lo);background:#e5f6d8}body.short .breakdown span{padding:1px 7px;font-size:10px}body.typing .breakdown{display:none}table.rank tr[data-name]{cursor:pointer}table.rank td.more{color:var(--muted);font:800 20px var(--title);width:1em}table.rank small{font-weight:600}.panel.history{width:min(94vw,560px)}table.rank.hist td{font-size:14px}table.rank.hist td:last-child{color:var(--green);font-family:var(--title);text-align:right}.stage-group{flex-wrap:nowrap!important;justify-content:flex-start!important}.stage-strip{overscroll-behavior-x:contain;touch-action:pan-x;scroll-snap-type:x proximity;scrollbar-width:thin;flex:1;gap:6px;min-width:0;padding:4px 2px 6px;display:flex;overflow-x:auto}.stage-strip .chip{scroll-snap-align:center;flex:none;width:96px}.stage-strip .chip img{height:46px}.stage-strip .chip span{white-space:nowrap;text-overflow:ellipsis;padding:3px 2px;font-size:11px;line-height:1.1;overflow:hidden}body.short .stage-strip .chip{width:72px;padding:0}body.short .select-panel .stage-strip .chip img{height:28px;display:block}body.short .stage-strip .chip span{font-size:9px}