:root{--bg1: #2a1056;--bg2: #5b2bc0;--bg3: #7a3ff0;--cream: #fff6e3;--gold: #ffd34e;--pink: #ff7ec4;--sky: #c9a7ff;--bronty-d: #268367}*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}html,body{height:100%;margin:0;overflow:hidden;font-family:Fredoka,system-ui,sans-serif;background:#1c0b3a;color:#fff;user-select:none;-webkit-user-select:none}#app{position:fixed;inset:0;display:flex;flex-direction:column;background:radial-gradient(1200px 600px at 80% -10%,rgba(255,255,255,.12),transparent 60%),radial-gradient(900px 500px at 10% 120%,rgba(122,63,240,.5),transparent 60%),linear-gradient(160deg,var(--bg1),var(--bg2) 60%,var(--bg3))}#app:before{content:"";position:absolute;inset:0;pointer-events:none;background-image:radial-gradient(2px 2px at 20% 30%,rgba(255,255,255,.7),transparent),radial-gradient(2px 2px at 70% 20%,rgba(255,255,255,.5),transparent),radial-gradient(1.5px 1.5px at 40% 60%,rgba(255,255,255,.5),transparent),radial-gradient(2px 2px at 88% 50%,rgba(255,255,255,.45),transparent),radial-gradient(1.5px 1.5px at 55% 12%,rgba(255,255,255,.6),transparent);opacity:.7}#stage{flex:1 1 auto;position:relative;min-height:0}canvas{position:absolute;inset:0;width:100%;height:100%;display:block}#hud{position:absolute;top:0;left:0;right:0;display:flex;justify-content:space-between;align-items:flex-start;padding:12px 16px;pointer-events:none;z-index:5}.hud-left{display:flex;align-items:center;gap:10px}.hud-btn{pointer-events:auto;background:#1c0b3a8c;border:2px solid rgba(255,255,255,.25);border-radius:14px;color:#fff;font-size:22px;font-weight:900;line-height:1;padding:7px 14px;cursor:pointer;backdrop-filter:blur(4px)}.hud-btn.hidden{display:none}.badge{background:#1c0b3a8c;border:2px solid rgba(255,255,255,.25);border-radius:16px;padding:6px 14px;backdrop-filter:blur(4px);display:flex;align-items:center;gap:8px}.badge .lbl{font-size:13px;letter-spacing:.5px;opacity:.85;font-weight:600;text-transform:uppercase}.badge .val{font-family:Lilita One,cursive;font-size:30px;line-height:1;color:var(--gold)}#streakBadge .val{color:var(--pink)}#streakFlames{font-size:22px}#kb-wrap{flex:0 0 auto;padding:10px 10px 14px;z-index:4}#keyboard{position:relative;height:120px;max-width:1100px;margin:0 auto;display:flex;gap:0}.wkey{position:relative;flex:1 1 0;height:100%;background:linear-gradient(#fffdf7,#f2e9d6);border:1px solid #d8cdb4;border-radius:0 0 10px 10px;box-shadow:inset 0 -6px #00000014;cursor:pointer;touch-action:none;display:flex;align-items:flex-end;justify-content:center;padding-bottom:8px}.wkey .name{font-weight:700;color:#7a6a4f;font-size:15px;pointer-events:none}.wkey.landmark{background:linear-gradient(#fff3cf,#ffe49e)}.wkey.landmark .name{color:#b07d12}.wkey.down{background:linear-gradient(#ffe49e,#ffcf5c);transform:translateY(2px);box-shadow:inset 0 -3px #0000001f}.bkey{position:absolute;top:0;height:50%;width:5.5%;background:linear-gradient(#42345a,#241836);border-radius:0 0 7px 7px;box-shadow:0 4px #00000059,inset 0 -3px #ffffff14;cursor:pointer;touch-action:none;z-index:3;transform:translate(-50%)}.bkey.down{background:linear-gradient(#241836,#160d24);transform:translate(-50%) translateY(2px)}.overlay{position:absolute;inset:0;z-index:20;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding:18px;background:#1408288c;backdrop-filter:blur(3px)}.panel{display:flex;flex-direction:column;align-items:center;max-width:min(620px,92vw);max-height:92%;overflow:auto;padding:22px 30px 26px;border-radius:28px;background:linear-gradient(160deg,#3c1e78f5,#221046f5);border:3px solid rgba(255,255,255,.18);box-shadow:0 18px 50px #00000073,inset 0 2px #ffffff1f}.panel-wide{max-width:min(820px,94vw)}.overlay h1{font-family:Lilita One,cursive;font-size:clamp(34px,7vw,68px);margin:0 0 6px;color:#fff;text-shadow:0 4px 0 var(--bronty-d),0 0 30px rgba(255,210,78,.5)}.overlay p{font-size:clamp(15px,2.4vw,20px);max-width:560px;line-height:1.45;color:#ece3ff;margin:6px 0 22px}.btn{font-family:Lilita One,cursive;font-size:26px;letter-spacing:.5px;color:#3a2a10;background:linear-gradient(#ffe07a,#ffc23d);border:none;border-radius:18px;padding:14px 38px;cursor:pointer;box-shadow:0 6px #c98a14,0 10px 24px #00000059;transition:transform .08s,box-shadow .08s}.btn:active{transform:translateY(4px);box-shadow:0 2px #c98a14,0 4px 12px #00000059}.hidden{display:none!important}#rotate{z-index:40;background:#140828f7}#rotate .ph{font-size:64px;animation:rot 2.4s ease-in-out infinite}@keyframes rot{0%,40%{transform:rotate(0)}60%,to{transform:rotate(-90deg)}}#bigBronty{font-size:60px;margin-bottom:4px}.result-mood{font-size:80px;margin:4px}.new-best{background:var(--pink);color:#fff;padding:6px 16px;border-radius:999px;font-size:14px;font-weight:900;margin-bottom:12px;text-transform:uppercase;letter-spacing:1px;box-shadow:0 3px #0003}.stat-row{display:flex;gap:28px;margin:10px 0 24px}.stat{background:#1c0b3a80;border:2px solid rgba(255,255,255,.2);border-radius:16px;padding:12px 22px}.stat .n{font-family:Lilita One,cursive;font-size:40px;color:var(--gold);line-height:1}.stat .k{font-size:13px;text-transform:uppercase;letter-spacing:1px;opacity:.8}.level-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:14px;width:100%;margin-top:16px}.level-card{display:flex;flex-direction:column;align-items:center;gap:6px;padding:16px 12px;font-family:inherit;color:#3a2a10;background:linear-gradient(#fff3cf,#ffe49e);border:3px solid rgba(255,255,255,.55);border-radius:18px;cursor:pointer;box-shadow:0 5px #c98a14;transition:transform .08s,box-shadow .08s}.level-card:active{transform:translateY(3px);box-shadow:0 2px #c98a14}.level-card .lvl-num{font-family:Lilita One,cursive;font-size:30px;line-height:1;color:#b07d12}.level-card .lvl-name{font-weight:700;font-size:15px}.level-card.locked{color:#cfc1ee;background:#ffffff14;border-color:#ffffff26;box-shadow:none;cursor:not-allowed}.level-card.locked .lvl-num{color:#cfc1ee}.btn-row{display:flex;gap:14px;flex-wrap:wrap;justify-content:center}.btn-ghost{background:#ffffff1f;color:#fff;box-shadow:0 6px #00000040,0 10px 24px #0000004d}.btn-ghost:active{box-shadow:0 2px #00000040,0 4px 12px #0000004d}.new-best.unlock{background:#6fcf5a}.icon-btn{position:fixed;top:10px;left:50%;transform:translate(-50%);z-index:30;pointer-events:auto;background:#1c0b3a8c;border:2px solid rgba(255,255,255,.25);border-radius:14px;font-size:22px;line-height:1;padding:8px 12px;cursor:pointer;backdrop-filter:blur(4px)}.ls-footer{display:flex;flex-wrap:wrap;gap:16px;align-items:center;justify-content:space-between;width:100%;margin-top:18px}.volume-row{display:flex;align-items:center;gap:10px;font-size:18px;color:#fff}.volume-row input[type=range]{width:140px;accent-color:var(--gold);cursor:pointer}.btn-sm{font-size:18px;padding:8px 18px}.practice-screen{position:absolute;inset:0;z-index:20;pointer-events:none}.practice-screen.hidden{display:none}.practice-bar{pointer-events:auto;position:absolute;top:0;left:0;right:0;display:flex;align-items:center;justify-content:space-between;gap:12px;padding:12px 16px;background:linear-gradient(#1c0b3aeb,#1c0b3a00)}.pb-left{display:flex;align-items:center;gap:14px}.seg{display:inline-flex;background:#1c0b3a80;border:2px solid rgba(255,255,255,.2);border-radius:999px;padding:3px;gap:3px}.seg-btn{font-family:inherit;font-weight:700;font-size:15px;color:#d9ccff;background:transparent;border:none;border-radius:999px;padding:8px 16px;cursor:pointer;white-space:nowrap;transition:background .12s,color .12s}.seg-btn.active{background:var(--gold);color:#3a2a10;box-shadow:0 2px #c98a14}.mode-seg{margin:10px 0 2px}.overlay p.ls-tagline{margin:2px 0 4px;font-size:clamp(13px,2vw,17px)}.title-dino{display:inline-block;transform:scaleX(-1)}.practice-title{font-family:Lilita One,cursive;font-size:24px;color:#fff;text-shadow:0 2px 0 var(--bronty-d)}