:root{--bg:#fff8ec;--card:#fff;--ink:#2b2340;--muted:#7a7291;--line:#eadfcb;--track:#efe6d6;--primary:#7c5cff;--primary-dark:#5a3ee0;--good:#2fbf71;--good-dark:#229a59;--good-soft:#dcf7e8;--bad:#ff5a5f;--bad-dark:#d8393e;--bad-soft:#ffe3e3;--fire:#ff8a1f;--gem:#1fa8e8;--gold:#ffb020;--radius:20px;--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light}*{box-sizing:border-box}[hidden]{display:none!important}html,body{min-height:100%;margin:0}body{background:var(--bg);color:var(--ink);-webkit-text-size-adjust:100%;-webkit-tap-highlight-color:transparent;touch-action:manipulation;overscroll-behavior-y:none;font:18px/1.4 ui-rounded,SF Pro Rounded,-apple-system,Nunito,Segoe UI,sans-serif}h1,h2{margin:0;line-height:1.15}.btn{font:inherit;letter-spacing:.02em;cursor:pointer;min-height:48px;color:var(--ink);background:#fff;border:2px solid #0000;border-radius:16px;padding:10px 22px;font-weight:800;transition:transform 80ms,box-shadow 80ms}.btn:active:not(:disabled){transform:translateY(3px)}.btn:disabled{opacity:.5;cursor:default}.btn:focus-visible,.node:focus-visible,.chip:focus-visible,input:focus-visible,select:focus-visible{outline-offset:2px;outline:4px solid #c9baff}.btn-primary{background:var(--primary);color:#fff;box-shadow:0 4px 0 var(--primary-dark)}.btn-primary:active:not(:disabled){box-shadow:0 1px 0 var(--primary-dark)}.btn-secondary{border-color:var(--line);box-shadow:0 4px 0 var(--line);color:var(--primary);background:#fff}.btn-good{background:var(--good);color:#fff;box-shadow:0 4px 0 var(--good-dark)}.btn-bad{background:var(--bad);color:#fff;box-shadow:0 4px 0 var(--bad-dark)}.btn-nearly{color:#fff;background:#f59f00;box-shadow:0 4px #b87400}.btn-danger{border-color:var(--bad);color:var(--bad);background:#fff}.btn-quiet{color:var(--muted);background:0 0;padding:8px 12px}.btn-link{color:var(--muted);background:0 0;font-weight:600;text-decoration:underline}.btn-big{width:100%;max-width:420px;min-height:60px;font-size:1.15rem}.btn-icon{width:48px;padding:0;font-size:1.4rem}.logo{align-items:center;gap:calc(var(--logo-size) * .14);display:inline-flex}.logo-mark{height:calc(var(--logo-size) * 1.35);width:auto}.logo-word{font-weight:900;font-size:var(--logo-size);letter-spacing:-.02em;background:linear-gradient(#5a3ee0,#2c1577);color:#0000;-webkit-background-clip:text;background-clip:text;margin-bottom:-.18em;padding-bottom:.18em;line-height:1}.welcome-logo{margin-bottom:-4px}.welcome{place-items:center;min-height:100vh;padding:24px 16px;display:grid}.welcome-card{text-align:center;justify-items:center;gap:16px;width:100%;max-width:520px;display:grid}.welcome-card h1{font-size:1.8rem}.welcome-card p{color:var(--muted);margin:0}.paywall-try{justify-items:center;gap:10px;width:100%;display:grid}.paywall-try h2{margin:0;font-size:1.2rem}.paywall-tasters{flex-wrap:wrap;justify-content:center;gap:10px;display:flex}.paywall-taster{border:2px solid var(--line);border-radius:var(--radius);min-width:0;max-width:220px;font:inherit;color:var(--ink);cursor:pointer;box-shadow:0 4px 0 var(--line);background:#fff;flex:140px;justify-items:center;gap:2px;padding:10px 12px;display:grid}.paywall-taster span{color:var(--muted);font-size:.9rem}.paywall-taster .paywall-taster-icon{color:inherit;font-size:1.8rem}.results-choice{grid-template-columns:1fr 1fr;gap:10px;width:100%;display:grid}.taster-more{border:2px dashed var(--primary);border-radius:var(--radius);text-align:center;background:#fff;justify-items:center;gap:6px;padding:12px 16px;display:grid}.taster-more p{color:var(--muted);margin:0}.restore-offer{border:2px dashed var(--line);border-radius:var(--radius);justify-items:center;gap:10px;margin-top:8px;padding:14px;display:grid}.backup-row{flex-wrap:wrap;justify-content:space-between;align-items:center;gap:8px;display:flex}.field{text-align:left;gap:6px;width:100%;max-width:420px;font-weight:700;display:grid}.field input,.field select{font:inherit;border:2px solid var(--line);color:var(--ink);background:#fff;border-radius:14px;padding:12px 14px;font-size:1.2rem}.chips{flex-wrap:wrap;justify-content:center;gap:8px;display:flex}.chip{font:inherit;border:2px solid var(--line);cursor:pointer;min-height:48px;color:var(--ink);background:#fff;border-radius:999px;padding:10px 18px;font-weight:700}.chip-on{border-color:var(--primary);color:var(--primary-dark);background:#efeaff}.pulse{font-weight:700;animation:1.4s ease-in-out infinite pulse;color:var(--primary)!important}@keyframes pulse{50%{opacity:.45}}.home{max-width:720px;margin:0 auto;padding:0 16px 120px}.topbar{z-index:5;padding:max(12px, env(safe-area-inset-top)) 0 12px;background:var(--bg);align-items:center;gap:8px;display:flex;position:sticky;top:0}.spacer{flex:1}.topbar .btn-quiet{white-space:nowrap}.pill{border:2px solid var(--line);white-space:nowrap;background:#fff;border-radius:999px;padding:6px 12px;font-weight:800}.pill-fire{color:var(--fire)}.pill-gem{color:var(--gem)}.pill-xp{color:var(--gold)}.pill-unit{opacity:.85;font-size:.75em;font-weight:800}.hero{grid-template-columns:auto 1fr;align-items:center;gap:12px 16px;margin:4px 0 20px;display:grid}.bubble{border:2px solid var(--line);background:#fff;border-radius:18px;padding:12px 16px;font-size:1.2rem;font-weight:600;position:relative}.bubble:before{content:"";border:10px solid #0000;border-right-color:var(--line);border-left:0;position:absolute;top:26px;left:-10px}.hero>.dragon{grid-row:span 2}.grow{color:var(--ink);flex-wrap:wrap;align-items:center;gap:6px 10px;font-weight:700;display:flex}.grow-name{font-size:1.05rem}.grow-bar{background:var(--track);border-radius:999px;flex:120px;max-width:220px;height:12px;overflow:hidden}.grow-bar span{background:linear-gradient(90deg,#2fbf71,#ffc233);border-radius:999px;height:100%;display:block}.grow-sub{color:var(--muted);font-size:.9rem}.goal-card{border:2px solid var(--line);border-radius:var(--radius);background:#fff;grid-column:1/-1;align-items:center;gap:16px;padding:12px 16px;display:flex}.goal-title{font-size:1.1rem;font-weight:800}.goal-sub{color:var(--muted)}.goal-prize{font:inherit;color:var(--primary-dark);text-align:left;cursor:pointer;background:0 0;border:0;margin-top:2px;padding:0;font-weight:700;display:block}.week-card{background:var(--good-soft);border:2px solid var(--good);border-radius:var(--radius);flex-wrap:wrap;justify-content:space-between;align-items:center;gap:8px 12px;padding:10px 14px;display:flex}.help-tips{gap:4px;margin:0;padding-left:20px;display:grid}.help-note{border:2px solid var(--gold);background:#fff6dc;border-radius:14px;padding:10px 12px}.goal-ring{color:var(--ink);flex:none}.review-card{border-radius:var(--radius);background:linear-gradient(135deg,#fff1e0,#ffe3c2);border:2px solid #ffb865;align-items:center;gap:14px;margin:-4px 0 24px;padding:14px 16px;display:flex;box-shadow:0 4px #ffcf99}.review-card.review-done{border-color:var(--line);box-shadow:0 4px 0 var(--line);background:#fff}.review-icon{font-size:2.2rem}.review-text{flex:1}.review-text h2{font-size:1.2rem}.review-text p{color:#7a4a14;margin:2px 0 0;font-size:1.1rem}.review-done .review-text p{color:var(--muted)}.btn-review{background:var(--fire);color:#fff;min-width:96px;box-shadow:0 4px #d86a00}.unit{margin-bottom:28px}.unit-banner{color:#fff;border-radius:var(--radius);padding:16px 20px;box-shadow:0 4px #0000001f}.unit-banner h2{font-size:1.35rem}.unit-banner p{opacity:.95;margin:4px 0 0}.unit-banner .unit-skip{color:#fff;background:#ffffff38;border:2px solid #fff9;min-height:40px;margin-top:10px;padding:6px 14px;font-size:.95rem;font-weight:700}.unit-num{text-transform:uppercase;letter-spacing:.08em;opacity:.9;font-size:.8rem;font-weight:800}.nodes{justify-items:center;gap:34px;margin:0;padding:34px 0 0;list-style:none;display:grid}.nodes li{justify-items:center;display:grid;position:relative}.node{cursor:pointer;width:76px;height:76px;font:inherit;color:#fff;background:var(--unit);border:0;border-radius:50%;font-size:1.8rem;font-weight:800;box-shadow:0 6px #0000002e}.node:active:not(:disabled){transform:translateY(4px);box-shadow:0 2px #0000002e}.node-locked{color:#fff;cursor:default;background:#ddd5c6;box-shadow:0 6px #c4baa8}.node-check{width:88px;height:88px;font-size:2.2rem}.node-current{outline:6px solid color-mix(in srgb, var(--unit) 30%, transparent);outline-offset:4px;animation:1.6s ease-in-out infinite bob}.start-tag{color:var(--primary);border:2px solid var(--line);white-space:nowrap;background:#fff;border-radius:12px;padding:4px 10px;font-size:.85rem;font-weight:800;animation:1.6s ease-in-out infinite bob;position:absolute;bottom:calc(100% + 6px)}@keyframes bob{50%{transform:translateY(-5px)}}.continue-tag{color:var(--muted);animation:none}.node-continue{outline:4px dashed color-mix(in srgb, var(--unit) 45%, transparent);outline-offset:4px}.sheet-backdrop{z-index:20;background:#2b234059;justify-content:center;align-items:flex-end;display:flex;position:fixed;inset:0}.sheet{width:100%;max-width:720px;padding:24px 20px max(24px, env(safe-area-inset-bottom));text-align:center;border-top:8px solid var(--unit);background:#fff;border-radius:26px 26px 0 0;justify-items:center;gap:10px;animation:.18s ease-out rise;display:grid}.sheet-unit{color:var(--muted);font-weight:700}.sheet-notes{color:var(--muted);margin:0 0 8px;font-size:1.2rem;font-weight:600}.position-cue{text-align:center;border-radius:16px;align-self:center;max-width:560px;padding:8px 18px}.position-cue .position-name{align-items:center;gap:6px;font-size:1.35rem;font-weight:800;display:inline-flex}.position-cue .position-where{margin-top:2px;font-size:1.1rem;font-weight:600}.position-top{justify-content:center;align-items:center;gap:8px;display:flex}.position-toggle{font:inherit;color:inherit;cursor:pointer;background:0 0;border:0;padding:0}.position-toggle:disabled{cursor:default;opacity:1}.position-cue .position-more{opacity:.7;margin-left:2px;font-size:.9rem}.position-hand{margin-top:6px}.position-hand .keyboard{margin:0 auto}.position-first{margin-top:4px;font-size:1.1rem;font-weight:800}.position-right{color:#4b3f75;background:#f3f0fa;border:2px solid #d9d0f2}.position-left{color:#a61e4d;background:#ffe3ec;border:2px solid #f7a8c2}.position-left .hand-icon{display:inline-block;transform:scaleX(-1)}.sheet-skip{color:var(--ink);margin:0 0 10px;font-weight:600}@keyframes rise{0%{opacity:0;transform:translateY(40px)}}.lesson{flex-direction:column;max-width:820px;min-height:100vh;margin:0 auto;padding:0 16px;display:flex}.lesson-top{padding:max(12px, env(safe-area-inset-top)) 0 12px;align-items:center;gap:12px;display:flex}.bar{background:var(--track);border-radius:999px;flex:1;height:18px;overflow:hidden}.bar-fill{background:var(--good);border-radius:999px;height:100%;transition:width .3s}.combo{text-align:right;min-width:64px;color:var(--fire);font-size:1.2rem;font-weight:800}.voice-toggle{flex:none;font-size:1.4rem}.voice-toggle.muted{opacity:.85;background:#ece8f3;border-radius:999px}.combo-on{animation:.3s pop}@keyframes pop{50%{transform:scale(1.3)}}.lesson-body{flex-direction:column;flex:1;justify-content:center;align-items:center;gap:20px;padding:0 0 150px;display:flex}.prompt{text-align:center;font-size:1.9rem}:root{--tap:#f08c00;--tap-soft:#fff1d6;--play:#1f8fd1;--play-soft:#e3f3fc;--learn:#7c5cff;--learn-soft:#efeaff}.lesson[data-mode]:before,.guide:before{content:"";z-index:-1;transition:background-color .3s;position:fixed;inset:0}.lesson[data-mode=tap]:before{background:var(--tap-soft)}.lesson[data-mode=play]:before{background:var(--play-soft)}.lesson[data-mode=learn]:before,.guide:before{background:var(--learn-soft)}.lesson[data-mode=tap] .staff-card{border-color:var(--tap)}.lesson[data-mode=play] .staff-card{border-color:var(--play)}.mode-banner{color:#fff;letter-spacing:.01em;border-radius:999px;align-items:center;gap:10px;padding:8px 20px 8px 14px;font-size:1.35rem;font-weight:900;display:inline-flex;box-shadow:0 4px #0000001f}.mode-banner .mode-icon{font-size:1.6rem;line-height:1}.mode-tap{background:var(--tap)}.mode-play{background:var(--play)}.mode-learn{background:var(--learn)}.mode-switched{animation:.7s cubic-bezier(.2,1.6,.4,1) mode-pop}.mode-switched .mode-icon{animation:.7s mode-wiggle}@keyframes mode-pop{0%{transform:scale(.6)}55%{transform:scale(1.18)}to{transform:scale(1)}}@keyframes mode-wiggle{20%,60%{transform:rotate(-18deg)}40%,80%{transform:rotate(18deg)}}.answers .btn-answer{animation:.32s both answer-in}.answers .btn-answer:nth-child(2){animation-delay:50ms}.answers .btn-answer:nth-child(3){animation-delay:.1s}.answers .btn-answer:nth-child(4){animation-delay:.15s}.answers .btn-answer:nth-child(5){animation-delay:.2s}@keyframes answer-in{0%{opacity:0;transform:translateY(24px)}}.guide-body{justify-content:flex-start;gap:16px;padding-top:12px}.guide-talk{border:2px solid var(--line);background:#fff;border-radius:20px;align-items:center;gap:14px;width:100%;max-width:620px;padding:14px 20px;display:flex}.guide-text{margin:0;font-size:1.45rem;font-weight:700;line-height:1.4}.guide-picture{width:100%;max-width:620px}.node-guide{font-size:1.6rem;border:4px solid var(--unit)!important;color:var(--unit)!important;background:#fff!important}.node-guide.node-locked{opacity:.55}.staff-card{border:2px solid var(--line);width:100%;max-width:620px;box-shadow:0 6px 0 var(--line);background:#fff;border-radius:26px;padding:12px 16px;position:relative}.staff svg{width:100%;height:auto;display:block}.hand-tag{z-index:1;white-space:nowrap;pointer-events:none;border-radius:999px;align-items:center;gap:4px;padding:3px 10px 3px 8px;font-size:.85rem;font-weight:800;display:flex;position:absolute;left:12px}.hand-top{top:10px}.staff-card:has(>.hand-tag){padding-top:40px}.hand-bottom{bottom:10px}.key-tag{z-index:1;color:var(--unit,#6e6686);white-space:nowrap;pointer-events:none;background:#f3f0fa;border-radius:999px;padding:3px 10px;font-size:.85rem;font-weight:800;position:absolute;top:10px;right:12px}.staff-card:has(>.key-tag){padding-top:40px}.hand-right{color:#6e6686;background:#f3f0fa}.hand-left{color:#c2255c;background:#ffe3ec;border:2px solid #f7a8c2}.hand-left .hand-icon{display:inline-block;transform:scaleX(-1)}.staff-grand{position:relative}.staff-grand .hand-tag{left:auto;right:0}.staff-grand .hand-top{top:0}.staff-grand .hand-bottom{bottom:0}.meet-name{background:var(--unit);color:#fff;box-sizing:border-box;white-space:nowrap;border-radius:27px;place-items:center;min-width:54px;height:54px;padding:0 14px;font-size:1.8rem;font-weight:900;display:grid;position:absolute;top:10px;right:14px}.meet{border:2px solid var(--line);background:#fff;border-radius:18px;align-items:center;gap:12px;max-width:620px;padding:14px 20px;display:flex}.meet p{margin:0;font-size:1.4rem;font-weight:700;line-height:1.35}.shake{animation:.36s shake}@keyframes shake{20%,60%{transform:translate(-8px)}40%,80%{transform:translate(8px)}}.answers{grid-template-columns:repeat(4,1fr);gap:12px;width:100%;max-width:620px;display:grid}.btn-answer{border:2px solid var(--line);min-height:84px;box-shadow:0 5px 0 var(--line);font-size:2rem}.answers-words{grid-template-columns:repeat(auto-fit,minmax(120px,1fr))}.answers-words .btn-answer{white-space:normal;min-width:0;min-height:72px;padding:6px 8px;font-size:1.1rem;line-height:1.2}.start-hint{margin:0;font-size:1.35rem}.hand-intro{text-align:center;width:100%;max-width:560px;margin:0 auto}.hand-intro p{margin:0 0 4px;font-size:1.1rem;font-weight:700}.btn-answer.right{background:var(--good-soft);border-color:var(--good);color:var(--good-dark);box-shadow:0 5px 0 var(--good);opacity:1}.btn-answer.wrong{background:var(--bad-soft);border-color:var(--bad);color:var(--bad-dark);box-shadow:0 5px 0 var(--bad);opacity:1}.listen{justify-items:center;gap:10px;display:grid}.mic{--level:0;border:2px solid var(--line);color:var(--primary);background:#fff;border-radius:999px;align-items:center;gap:10px;padding:8px 18px;font-weight:700;display:flex}.mic-icon{font-size:1.3rem}.mic-bars{align-items:end;gap:3px;height:22px;display:flex}.mic-bars i{background:var(--primary);width:5px;height:calc(4px + var(--level) * 18px);border-radius:3px;transition:height 80ms linear}.mic-bars i:nth-child(2),.mic-bars i:nth-child(4){height:calc(4px + var(--level) * 12px)}.mic-bars i:first-child,.mic-bars i:nth-child(5){height:calc(4px + var(--level) * 7px)}.try-again{color:var(--bad-dark);text-align:center;background:#fff0f0;border:2px solid #ffc9c9;border-radius:14px;margin:0;padding:6px 14px;font-size:1.35rem;font-weight:800}.hint{color:var(--muted);margin:0;font-size:1.3rem;font-weight:800}.sheet-feedback{z-index:10;padding:20px max(24px, calc((100vw - 780px) / 2)) max(22px, env(safe-area-inset-bottom));justify-content:space-between;align-items:center;gap:16px;animation:.16s ease-out rise;display:flex;position:fixed;bottom:0;left:0;right:0}.sheet-feedback.good{background:var(--good-soft);color:var(--good-dark)}.sheet-feedback.bad{background:var(--bad-soft);color:var(--bad-dark)}.sheet-feedback.nearly{color:#9a5b00;background:#fff3d6}.fb-title{font-size:1.7rem;font-weight:900}.fb-sub{font-size:1.2rem;font-weight:700}.fb-why{max-width:34em;font-size:1.05rem}.fb-buttons{flex-shrink:0;align-items:center;gap:8px;display:flex}.btn-why{color:inherit;font-weight:800}.results{text-align:center;align-content:start;justify-items:center;gap:16px;max-width:620px;min-height:100vh;margin:0 auto;padding:32px 16px;display:grid;position:relative;overflow:hidden}.results h1{font-size:2rem}.results-sub{color:var(--muted);margin:-8px 0 0;font-weight:700}.tiles{grid-template-columns:repeat(2,1fr);gap:12px;width:100%;display:grid}.tile{background:#fff;border:3px solid;border-radius:18px;gap:2px;padding:10px;display:grid}.tile span{text-transform:uppercase;letter-spacing:.06em;font-size:.8rem;font-weight:800}.tile strong{font-size:1.6rem}.tile-xp{border-color:var(--gold);color:#b87900}.tile-acc{border-color:var(--good);color:var(--good-dark)}.tile-speed{border-color:var(--gem);color:#0f7fb3}.tile-combo{border-color:var(--fire);color:#c05f00}.chest-stage{--glow:#29b6f6;justify-items:center;gap:6px;width:100%;padding:8px 0 4px;display:grid}.chest-button{cursor:pointer;background:0 0;border:0;width:190px;height:190px;padding:0;position:relative}.chest-button:disabled{cursor:default}.chest-button:focus-visible{outline-offset:4px;border-radius:24px;outline:4px solid #c9baff}.chest-art{width:100%;height:100%;position:relative;overflow:visible}.chest-glow{opacity:0;background:radial-gradient(circle, color-mix(in srgb, var(--glow) 75%, transparent) 0%, transparent 65%);border-radius:50%;transition:background 60ms linear;position:absolute;inset:-30px}.chest-lid{transform-box:view-box;transform-origin:140px 62px;transition:transform .38s cubic-bezier(.2,1.6,.4,1)}.chest-inner-glow{fill:var(--glow);opacity:0}.chest-closed .chest-art{animation:1.6s ease-in-out infinite wiggle}.chest-closed .chest-glow{opacity:.35;background:radial-gradient(circle,#ffc54299 0%,#0000 65%);animation:1.6s ease-in-out infinite pulse}.chest-shaking .chest-art{animation:.11s linear infinite rattle}.chest-shaking .chest-glow{opacity:1}.chest-open .chest-glow{opacity:1;animation:.7s ease-out glowpop}.chest-open .chest-lid{transform:translate(4px,-6px)rotate(20deg)}.chest-open .chest-inner-glow{opacity:.9}.chest-open .chest-body{transform-box:view-box;transform-origin:80px 128px;animation:.35s pop}.rarity-legendary .chest-glow{filter:blur(22px);opacity:.85;background:conic-gradient(#ff5d8f,#ffb020,#fff06a,#2fbf71,#29b6f6,#a259ff,#ff5d8f);animation:2.4s linear infinite spin}.chest-sparks{pointer-events:none;position:absolute;top:45%;left:50%}.chest-sparks i{opacity:0;font-style:normal;animation:1.1s cubic-bezier(.15,.8,.3,1) forwards burst;position:absolute;top:-12px;left:-12px}.chest-caption{min-height:88px;color:var(--muted);align-content:start;justify-items:center;gap:2px;font-weight:800;display:grid}.chest-rarity{letter-spacing:.06em;text-transform:uppercase;color:color-mix(in srgb, var(--glow) 70%, #2b2340);text-shadow:0 2px #00000014;font-size:1.1rem;animation:.4s pop}.rarity-legendary .chest-rarity,.rarity-epic .chest-rarity{font-size:1.6rem}.chest-gems{color:#0f7fb3;font-variant-numeric:tabular-nums;font-size:2.2rem}.chest-bonus{color:var(--gem)}.chest-total{font-size:.9rem;font-weight:700}@keyframes wiggle{0%,70%,to{transform:rotate(0)}76%{transform:rotate(-6deg)}82%{transform:rotate(6deg)}88%{transform:rotate(-4deg)}94%{transform:rotate(3deg)}}@keyframes rattle{0%{transform:translate(0)rotate(0)}25%{transform:translate(-3px,1px)rotate(-4deg)}50%{transform:translate(2px,-2px)rotate(3deg)}75%{transform:translate(3px,1px)rotate(-2deg)}}@keyframes glowpop{0%{transform:scale(.3)}to{transform:scale(1)}}@keyframes spin{to{transform:rotate(360deg)}}@keyframes burst{0%{opacity:1;transform:translate(0)scale(.3)}60%{opacity:1;transform:translate(var(--dx), var(--dy)) scale(1.1)}to{opacity:0;transform:translate(calc(var(--dx) * 1.1), calc(var(--dy) + 40px)) scale(.9)}}.reminder-offer{border-radius:var(--radius);border:2px solid var(--line);text-align:left;background:#fff;gap:6px;padding:14px 16px;display:grid}.reminder-offer p{margin:0}.streak-card{text-align:left;border:2px solid var(--fire);background:#fff1e0;border-radius:18px;align-items:center;gap:14px;width:100%;padding:12px 16px;display:flex}.streak-card.quiet{border-color:var(--line);background:#fff}.streak-fire{font-size:2.6rem;animation:.6s 2 pop}.confetti{pointer-events:none;position:absolute;inset:0}.confetti i{border-radius:2px;width:10px;height:16px;animation:linear forwards fall;position:absolute;top:-20px}@keyframes fall{to{opacity:.8;transform:translateY(110vh)rotate(540deg)}}.parent{max-width:760px;padding:max(12px, env(safe-area-inset-top)) 16px 60px;gap:16px;margin:0 auto;display:grid}.parent.gate{place-items:center;min-height:100vh}.parent-top{align-items:center;gap:8px;display:flex}.card{border:2px solid var(--line);border-radius:var(--radius);background:#fff;gap:12px;padding:18px;display:grid}.card h2{font-size:1.2rem}.improve-preview{white-space:pre-wrap;font:inherit;background:var(--bg);border:2px solid var(--line);border-radius:12px;max-height:320px;margin:0;padding:10px 12px;font-size:.9rem;overflow:auto}.reading-progress h3{margin:6px 0 0;font-size:1rem}.reading-progress .gain{color:var(--good-dark);font-weight:700}.weak-notes{gap:4px;margin:0;padding-left:20px;display:grid}.reading-details summary{cursor:pointer;color:var(--muted);padding:4px 0;font-weight:700}.card p{margin:0}.row{flex-wrap:wrap;align-items:center;gap:10px;display:flex}.muted{color:var(--muted)}.check{align-items:center;gap:10px;min-height:44px;font-weight:700;display:flex}.check input{width:22px;height:22px;accent-color:var(--primary)}.table-wrap{overflow-x:auto}table{border-collapse:collapse;width:100%;font-size:.95rem}th,td{text-align:left;border-bottom:1px solid var(--line);white-space:nowrap;padding:8px}td.slow{color:var(--bad-dark);font-weight:800}td.fast{color:var(--good-dark);font-weight:800}.activity{grid-template-columns:repeat(14,1fr);gap:6px;height:120px;display:grid}.activity-day{color:var(--muted);grid-template-rows:1fr auto;justify-items:center;gap:4px;font-size:.75rem;display:grid}.activity-bar-wrap{background:var(--track);border-radius:6px;align-items:flex-end;width:100%;display:flex;overflow:hidden}.activity-bar{background:var(--fire);width:100%;min-height:2px}.activity-bar.met{background:var(--good)}button.pill{font:inherit;cursor:pointer;font-weight:800}.btn-shop{border-color:var(--line);color:var(--gem);min-height:40px;box-shadow:0 3px 0 var(--line);white-space:nowrap;background:#fff;padding:6px 14px}.shop{max-width:760px;margin:0 auto;padding:0 16px 140px}.shop-title{font-size:1.5rem}.shop-hero{place-items:center;padding:8px 0 44px;display:grid;position:relative}.shop-toast{background:var(--good);color:#fff;box-shadow:0 4px 0 var(--good-dark);border-radius:999px;padding:8px 18px;font-weight:800;animation:.35s pop;position:absolute;bottom:4px}.tabs{gap:8px;margin-bottom:8px;display:flex}.tab{font:inherit;border:2px solid var(--line);min-height:48px;color:var(--muted);cursor:pointer;background:#fff;border-radius:14px;flex:1;font-weight:800}.tab[aria-selected=true]{background:var(--primary);border-color:var(--primary);color:#fff}.shop-section{margin:18px 0 10px;font-size:1.1rem}.shop-grid{grid-template-columns:repeat(auto-fill,minmax(104px,1fr));gap:12px;display:grid}.shop-item{font:inherit;border:3px solid var(--line);box-shadow:0 4px 0 var(--line);cursor:pointer;color:var(--ink);background:#fff;border-radius:18px;justify-items:center;gap:2px;padding:10px 6px 12px;display:grid}.shop-item:active{box-shadow:0 1px 0 var(--line);transform:translateY(3px)}.shop-item.wearing{border-color:var(--good);box-shadow:0 4px 0 var(--good)}.shop-item.previewing{border-color:var(--primary);box-shadow:0 4px 0 var(--primary)}.shop-item.pricey .price{opacity:.55}.shop-item-name{font-weight:800}.shop-item-state{color:var(--muted);font-size:.9rem;font-weight:700}.shop-item.wearing .shop-item-state{color:var(--good-dark)}.price{color:#0f7fb3;white-space:nowrap;font-weight:800}.btn-primary .price{color:#fff}.shop-list{gap:12px;margin-top:12px;display:grid}.shop-row{border:2px solid var(--line);background:#fff;border-radius:18px;align-items:center;gap:14px;padding:12px 16px;display:flex}.shop-row-icon{font-size:2.2rem}.shop-row-text{flex:1;display:grid}.shop-row-text span{color:var(--muted);font-size:.95rem}.shop-row.claim.given{opacity:.6}.shop-empty{text-align:center;color:var(--muted);padding:24px 8px;font-weight:700}.shop-buy{z-index:10;border-top:2px solid var(--line);padding:16px max(20px, calc((100vw - 720px) / 2)) max(16px, env(safe-area-inset-bottom));background:#fff;align-items:center;gap:12px;animation:.16s ease-out rise;display:flex;position:fixed;bottom:0;left:0;right:0}.shop-buy>div{flex:1}.odds-link{margin:24px auto 0;display:block}.odds{border-collapse:collapse;width:100%;max-width:480px}.odds td{border-bottom:1px solid var(--line);text-align:left;white-space:normal;padding:6px 8px}.odds td:first-child{font-weight:900}.sheet-emoji{font-size:3rem}.claims{border:2px dashed var(--line);border-radius:14px;gap:8px;margin:8px 0 14px;padding:12px;display:grid}.claim-row{flex-wrap:wrap;justify-content:space-between;align-items:center;gap:10px;display:flex}.prize-form{flex-wrap:wrap;gap:8px;display:flex}.prize-form select,.prize-form input{font:inherit;border:2px solid var(--line);color:var(--ink);background:#fff;border-radius:12px;padding:10px 12px}.prize-form input:first-of-type{flex:1;min-width:180px}.prize-cost{width:90px}.reminder-time{font:inherit;border:2px solid var(--line);color:var(--ink);background:#fff;border-radius:12px;padding:8px 10px}.card .chips{justify-content:flex-start}.card .chip{min-height:40px;padding:6px 12px;font-size:.9rem}.dragon{flex:none;overflow:visible}.dragon-all{transform-box:view-box;transform-origin:100px 190px}.dragon-wing{transform-box:view-box;transform-origin:66px 106px}.mood-idle .dragon-all,.mood-think .dragon-all{animation:3s ease-in-out infinite breathe}.mood-happy .dragon-all{animation:1.8s ease-in-out infinite hop}.mood-cheer .dragon-all{animation:.6s ease-in-out infinite alternate jump}.mood-cheer .dragon-wing{animation:.3s ease-in-out infinite alternate flap}.mood-happy .dragon-wing{animation:1.8s ease-in-out infinite flap}.dragon-sparkles{animation:.8s ease-in-out infinite alternate twinkle}.dragon-halo{transform-box:view-box;transform-origin:100px 92px;animation:24s linear infinite spin}@keyframes breathe{50%{transform:scale(1.02,1.035)}}@keyframes hop{0%,70%,to{transform:translateY(0)}80%{transform:translateY(-8px)}90%{transform:translateY(0)}}@keyframes jump{to{transform:translateY(-10px)}}@keyframes flap{to{transform:rotate(-14deg)}}@keyframes twinkle{to{opacity:.3}}@media (prefers-reduced-motion:reduce){*,:before,:after{transition:none!important;animation:none!important}}@media (width<=560px){.answers{grid-template-columns:repeat(2,1fr)}.prompt{font-size:1.4rem}.hero{grid-template-columns:1fr;justify-items:center}.grow{justify-content:center}.bubble:before{display:none}.goal-card{width:100%}.meet p,.guide-text{font-size:1.2rem}}.players{min-height:100vh;padding:max(40px, env(safe-area-inset-top)) 16px 40px;flex-direction:column;align-items:center;gap:16px;display:flex}.players h1{margin:0;font-size:2rem}.player-grid{grid-template-columns:repeat(auto-fill,minmax(180px,1fr));gap:16px;width:100%;max-width:760px;display:grid}.player-card{font:inherit;color:inherit;cursor:pointer;border:3px solid var(--line);box-shadow:0 6px 0 var(--line);background:#fff;border-radius:22px;justify-items:center;gap:6px;padding:18px 12px;display:grid}.player-card strong{font-size:1.3rem}.player-card:active{box-shadow:0 2px 0 var(--line);transform:translateY(4px)}.player-current{border-color:#7c5cff;box-shadow:0 6px #c9baff}.player-stats{color:var(--muted);font-weight:700}.player-add{border-style:dashed}.player-plus{color:#7c5cff;place-items:center;width:110px;height:110px;font-size:4rem;font-weight:900;display:grid}.pill-player{font:inherit;cursor:pointer;font-weight:800}.parent-player h2{margin:8px 0 0;font-size:1.5rem}.player-row{align-items:center}.player-row-pick{font:inherit;color:inherit;cursor:pointer;text-align:left;background:0 0;border:2px solid #0000;border-radius:14px;align-items:center;gap:10px;padding:4px 10px 4px 4px;display:flex}.player-row-on .player-row-pick{background:#efeaff;border-color:#7c5cff}.btn-speak{vertical-align:middle;border:2px solid var(--line);cursor:pointer;width:48px;height:48px;box-shadow:0 3px 0 var(--line);background:#fff;border-radius:50%;flex:none;place-items:center;font-size:1.4rem;display:inline-grid}.btn-speak:active{box-shadow:0 1px 0 var(--line);transform:translateY(2px)}.btn-speak.speaking{background:#efeaff;border-color:#7c5cff;animation:1s ease-in-out infinite speak-pulse}@keyframes speak-pulse{50%{box-shadow:0 0 0 6px #7c5cff33}}.try-again .btn-speak,.fb-sub .btn-speak{width:36px;height:36px;font-size:1.05rem}.keyboard{width:100%;max-width:520px;margin:4px auto 0;display:block}.meet .btn-speak{margin-left:auto}:root{--screen:#0f9d8f;--screen-soft:#dff5f1}.lesson[data-mode=screen]:before{background:var(--screen-soft)}.lesson[data-mode=screen] .staff-card{border-color:var(--screen)}.mode-screen{background:var(--screen)}.play-keyboard{touch-action:manipulation;-webkit-user-select:none;user-select:none;cursor:pointer;width:100%;max-width:760px;margin:0 auto;display:block}.play-keyboard-off{opacity:.6;pointer-events:none}.input-switch{color:var(--muted);flex-wrap:wrap;align-items:center;gap:8px;margin:4px 0 14px;font-weight:800;display:flex}.input-switch button{font:inherit;border:2px solid var(--line);color:var(--ink);cursor:pointer;background:#fff;border-radius:999px;padding:8px 16px;font-weight:800}.input-switch button.on{background:#e3f3fc;border-color:#1f8fd1}.input-switch button.on-screen{border-color:var(--screen);background:var(--screen-soft)}.input-switch small{color:var(--muted);font-size:.8em;font-weight:800;line-height:1.1;display:block}.input-switch button{line-height:1.2}.input-switch small.gems-all{color:#0f7fb3}.results-screen{color:var(--screen);text-align:center;margin:-4px 0 0;font-size:1.15rem;font-weight:800}.activity-bar{position:relative;overflow:hidden}.activity-screen{background:repeating-linear-gradient(45deg,#ffffff8c 0 4px,#0000 4px 8px);position:absolute;top:0;left:0;right:0}.activity-legend{margin:6px 0 0;font-size:.9rem}.input-choice{margin:4px 0 14px}.input-choice .input-switch{margin:0}.input-note{color:var(--screen);margin:6px 0 0;font-size:1.1rem;font-weight:800}.screen-ask .screen-ask-gems{color:#0f7fb3;font-size:1.3rem;font-weight:800}.screen-ask{text-align:center;justify-items:center;gap:10px;display:grid}.screen-ask h2{margin:0}.screen-ask p{margin:0;font-size:1.1rem}.bonuses{gap:8px;width:100%;max-width:588px;margin:0;padding:0;list-style:none;display:grid}.bonuses li{background:#fff7e0;border:2px solid #ffd27a;border-radius:14px;justify-content:space-between;align-items:center;gap:12px;padding:10px 16px;font-weight:700;display:flex}.bonuses strong{color:var(--gold);white-space:nowrap}.swatches{flex-wrap:wrap;justify-content:center;gap:10px;display:flex}.swatch{font:inherit;border:3px solid var(--line);min-width:86px;color:var(--ink);cursor:pointer;background:#fff;border-radius:16px;justify-items:center;gap:6px;padding:10px 14px;font-weight:800;display:grid}.swatch-dot{border-radius:50%;width:40px;height:40px;box-shadow:inset 0 -4px #00000026}.swatch-on{border-color:var(--primary);background:#efeaff}.hear-it{margin:8px auto 0;font-size:1.1rem;font-weight:800;display:block}.btn-listen{min-height:64px;margin:4px auto 0;padding:10px 28px;font-size:1.4rem;display:block}.guide-nav{justify-content:center;align-items:stretch;gap:12px;width:100%;max-width:620px;display:flex}.guide-nav .btn-big{flex:1}.guide-back{flex:none;min-height:40px;padding:6px 14px;font-size:1rem}.guide-back:disabled{visibility:hidden}.sheet-where{color:var(--muted);margin-top:2px;font-size:.85rem;font-weight:700}.lesson-where{text-align:center;color:var(--muted);letter-spacing:.02em;margin:-6px 0 4px;font-size:.8rem;font-weight:700}.grew-card{text-align:center;background:#fff8d6;border:2px solid #ffd84d;border-radius:18px;gap:2px;max-width:520px;padding:10px 18px;display:grid}.grew-card strong{font-size:1.25rem}.retry-card{text-align:left;border:2px solid var(--line);background:#fff;border-radius:18px;align-items:center;gap:12px;max-width:520px;padding:12px 16px;display:flex}.retry-card p{margin:4px 0 0}.retry-card.skip-passed{border-color:#2fbf71}.rarity-treasure .chest-glow{filter:blur(24px);opacity:.95;background:conic-gradient(#ff5dd8,#a259ff,#29b6f6,#2fbf71,#fff06a,#ff5dd8);animation:1.6s linear infinite spin}.rarity-treasure .chest-rarity{font-size:1.7rem}.chest-treasure{text-align:left;background:#fff;border:2px solid #ff5dd8;border-radius:16px;align-items:center;gap:10px;max-width:360px;margin-top:8px;padding:8px 12px;animation:.4s pop;display:flex}.treasure-locked{opacity:.7;cursor:default}.treasure-mystery{place-items:center;height:76px;font-size:2.2rem;display:grid}.lesson{height:100dvh;min-height:0}.lesson-top{flex:none}.lesson-body{flex:auto;justify-content:center;gap:clamp(10px,2.4vh,28px);min-height:0;padding:0 0 12px;overflow-y:auto}.guide-body{justify-content:center}.lesson-body>*{flex:none}.staff svg{max-height:clamp(110px,25vh,360px)}.keyboard{max-height:clamp(64px,12vh,160px)}.play-keyboard{max-height:clamp(110px,20vh,200px)}.guide-talk .dragon,.meet .dragon{flex:none;width:clamp(48px,7vh,88px);height:auto}.lesson-body:has(+.sheet-feedback){padding-bottom:96px}@media (height<=1000px){.prompt{margin:0;font-size:1.5rem}.mode-banner{padding:6px 16px 6px 12px;font-size:1.1rem}.mode-banner .mode-icon{font-size:1.3rem}.guide-text{font-size:1.25rem;line-height:1.3}.guide-talk,.meet{padding:10px 16px}.meet p{font-size:1.15rem}.btn-answer{min-height:64px;font-size:1.7rem}.answers-words .btn-answer{min-height:56px}.btn-big{min-height:50px}.try-again,.start-hint{font-size:1.15rem}.hint{font-size:1.3rem}.meet-name{min-width:44px;height:44px;font-size:1.4rem;top:8px;right:10px}.fb-title{font-size:1.4rem}.sheet-feedback{padding-top:14px;padding-bottom:max(14px, env(safe-area-inset-bottom));flex-wrap:wrap;gap:10px}.sheet-feedback>div:first-child{flex:220px}.fb-buttons{margin-left:auto}.lesson-top{padding-bottom:6px}.staff-card{padding:8px 12px}}@media (orientation:landscape) and (height<=900px){.lesson{max-width:1100px}.lesson-body{grid-template-columns:minmax(0,1.15fr) minmax(0,1fr);grid-auto-rows:min-content;grid-auto-flow:dense;align-content:center;place-items:center;gap:14px 24px;display:grid}.lesson-body>*{grid-column:2;width:100%;max-width:480px}.lesson-body>.mode-banner,.lesson-body>.prompt{grid-column:1/-1;width:auto;max-width:none}.lesson-body>.staff-card{grid-area:3/1/span 4;max-width:560px}.guide-body>.guide-picture{grid-area:2/1/span 5;max-width:560px}.lesson-body>.play-keyboard{grid-column:1/-1;max-width:900px}.lesson-body>.listen,.lesson-body>.hear-it{justify-self:center;width:auto}.staff svg{max-height:clamp(110px,34vh,320px)}.keyboard{max-height:clamp(60px,15vh,140px)}.play-keyboard{max-height:clamp(100px,22vh,190px)}.answers{grid-template-columns:repeat(2,1fr)}}.lesson-body:has(.play-keyboard) .keyboard{max-height:clamp(56px,9vh,120px)}.lesson-body:has(.play-keyboard) .staff svg{max-height:clamp(100px,20vh,300px)}@media (orientation:landscape) and (height<=900px){.lesson-body:has(.play-keyboard) .staff svg{max-height:clamp(90px,24vh,260px)}.lesson-body:has(.play-keyboard) .keyboard{max-height:clamp(50px,11vh,110px)}}.results-main,.results-side{align-content:start;justify-items:center;gap:12px;width:100%;display:grid}@media (height<=1100px){.results{padding:max(16px, env(safe-area-inset-top)) 16px 16px;gap:10px;min-height:100dvh}.results .dragon{width:clamp(80px,12vh,150px);height:auto}.results h1{margin:0;font-size:1.6rem}.results .tile{padding:8px 10px}}@media (orientation:landscape) and (height<=900px){.results{box-sizing:border-box;grid-template-columns:1fr 1fr;align-items:center;column-gap:32px;max-width:1040px;height:100dvh}.results-main,.results-side{align-content:center}}.lesson-body:has(.play-keyboard){gap:clamp(8px,1.5vh,18px)}@media (height<=1100px){.results .dragon{width:clamp(70px,10vh,130px)}.results .chest-art{width:clamp(110px,16vh,180px);height:auto}.results .streak-card{padding-top:8px;padding-bottom:8px}.results .tiles{grid-template-columns:repeat(4,1fr);gap:8px}.results .tile strong{font-size:1.3rem}.results .tile span{font-size:.68rem}.results .retry-card p{font-size:.95rem}.results .chest-stage{gap:2px;padding:0}.chest-treasure{padding:6px 10px;font-size:.95rem}.chest-treasure .dragon{width:72px;height:auto}}.chest-treasure{color:var(--ink,#2b2340)}@media (orientation:landscape) and (height<=900px){.results .tiles{grid-template-columns:repeat(2,1fr)}}.keyboard text{pointer-events:none}.keyboard-tap{touch-action:manipulation;-webkit-user-select:none;user-select:none}.explore-hint{color:var(--learn);text-align:center;margin:0;font-size:1.3rem;font-weight:800}.explore-todo{border:2px solid var(--learn);background:#fff;border-radius:14px;padding:6px 14px}.hint{color:var(--learn);text-align:center;background:#fff;border:2px solid #d9cffd;border-radius:16px;max-width:600px;padding:8px 16px;font-size:1.4rem;line-height:1.35}.hint-mic{color:#0f7fb3;border-color:#9fd3ef}.clue{justify-items:center;gap:8px;width:100%;display:grid}.btn-clue{min-height:48px;font-size:1.15rem}.btn-clue.nudge{animation:1.4s ease-in-out 2 clue-glow}@keyframes clue-glow{50%{transform:scale(1.05);box-shadow:0 0 0 6px #7c5cff59}}.clue-nudge{color:var(--muted);font-size:1rem;font-weight:700}.results-helped{color:var(--learn);text-align:center;margin:0;font-weight:700}.lesson-body{justify-content:safe center}@media (width<=500px){.lesson{padding:0 12px}.lesson-top{padding-top:max(8px, env(safe-area-inset-top));padding-bottom:4px}.combo{min-width:44px;font-size:1rem}.voice-toggle{font-size:1.2rem}.lesson-where{margin:-4px 0 2px;font-size:.7rem}.lesson-body{gap:clamp(6px,1.4vh,14px);padding-bottom:8px}.mode-banner{gap:6px;padding:4px 12px 4px 10px;font-size:.95rem}.mode-banner .mode-icon{font-size:1.1rem}.prompt{font-size:1.2rem}.prompt .btn-speak,.guide-talk .btn-speak,.meet .btn-speak{transform:scale(.85)}.staff-card{border-radius:18px;padding:4px 8px}.hand-tag{padding:2px 8px 2px 6px;font-size:.7rem;left:8px}.position-cue{padding:4px 12px}.position-cue .position-name{font-size:1.1rem}.position-cue .position-where{font-size:.95rem}.hand-top{top:6px}.staff-card:has(>.hand-tag){padding-top:28px}.hand-bottom{bottom:6px}.staff svg{max-height:clamp(90px,20vh,220px)}.keyboard{max-height:clamp(48px,9vh,90px)}.lesson-body:has(.play-keyboard) .staff svg{max-height:clamp(80px,16vh,180px)}.lesson-body:has(.play-keyboard) .keyboard{max-height:clamp(40px,7vh,70px)}.play-keyboard{max-height:clamp(100px,18vh,160px)}.guide-text,.meet p{font-size:1rem;line-height:1.3}.guide-talk,.meet{border-radius:14px;gap:8px;padding:8px 10px}.guide-talk .dragon,.meet .dragon{width:clamp(36px,5vh,52px)}.meet-name{min-width:34px;height:34px;padding:0 10px;font-size:1.1rem;top:6px;right:8px}.btn-answer{min-height:52px;font-size:1.5rem}.answers-words .btn-answer{min-height:48px;font-size:1rem}.answers{gap:8px}.btn-big{min-height:46px}.try-again,.start-hint{font-size:.95rem}.explore-hint{font-size:1.15rem}.hint{padding:6px 12px;font-size:1.25rem}.btn-clue{min-height:42px;font-size:1rem}.mic{padding:3px 12px;font-size:.9rem}.hear-it{margin-top:2px;font-size:.95rem}.fb-title{font-size:1.2rem}.fb-sub{font-size:.95rem}.sheet-feedback{padding:10px 14px max(12px, env(safe-area-inset-bottom))}.lesson-body:has(+.sheet-feedback){padding-bottom:76px}.results{padding:max(10px, env(safe-area-inset-top)) 12px 12px;gap:6px}.results-main,.results-side{gap:6px}.results .dragon{width:clamp(52px,8vh,90px)}.results h1{font-size:1.3rem}.results-sub{font-size:.85rem}.results-screen{font-size:.95rem}.results .tiles{grid-template-columns:repeat(4,1fr);gap:5px}.results .tile{border-width:2px;border-radius:12px;padding:5px 4px}.results .tile span{letter-spacing:.02em;font-size:.55rem}.results .tile strong{font-size:1.05rem}.results .retry-card{gap:8px;padding:8px 10px}.results .retry-card .dragon{width:40px}.results .retry-card p{font-size:.85rem}.results .chest-art{width:clamp(80px,12vh,130px)}.results .chest-caption{font-size:.9rem}.results .streak-card{gap:8px;padding:6px 10px;font-size:.9rem}.results .streak-card .goal-ring{width:44px;height:44px}.results .btn-big{min-height:46px}.bonuses{font-size:.85rem}}@media (width<=500px) and (height>=780px){.staff svg{max-height:clamp(90px,25vh,260px)}.keyboard{max-height:clamp(48px,13vh,130px)}.lesson-body:has(.play-keyboard) .staff svg{max-height:clamp(80px,19vh,200px)}.lesson-body:has(.play-keyboard) .keyboard{max-height:clamp(40px,8vh,80px)}}@media (width<=500px) and (height<=700px){.staff svg{max-height:clamp(80px,17vh,200px)}.lesson-body:has(.play-keyboard) .staff svg{max-height:clamp(70px,13vh,160px)}.lesson-body:has(.play-keyboard) .keyboard{max-height:36px}.lesson-where{display:none}}@media (width<=500px){.results .chest-button{width:130px;height:125px}.results .chest-art{width:100%}.results .chest-caption{min-height:0}}@media (height<=1100px){.results .chest-button{width:clamp(120px,17vh,190px);height:clamp(110px,16.5vh,190px)}}@media (width<=500px){.welcome{padding:max(12px, env(safe-area-inset-top)) 12px 12px}.welcome-card{gap:10px}.welcome-card h1{font-size:1.35rem}.welcome-card .dragon{width:clamp(90px,18vh,160px);height:auto}.swatches{flex-wrap:nowrap;gap:6px}.swatch{flex:1 1 0;min-width:0;padding:8px 6px;font-size:.85rem}.swatch-dot{width:30px;height:30px}.chips{gap:6px}.chips .chip,.chips button{padding:6px 12px;font-size:.9rem}.wide-only{display:none}.topbar{gap:5px;padding-left:0;padding-right:0}.topbar .pill{padding:4px 8px;font-size:.85rem}.topbar .pill-player{text-overflow:ellipsis;min-width:0;max-width:28vw;overflow:hidden}.topbar .btn-shop,.topbar .btn-quiet{min-height:36px;padding:4px 10px;font-size:1rem}.pill-player{text-overflow:ellipsis;max-width:30vw;overflow:hidden}.hero .dragon{width:96px;height:auto}}.btn-grownups{position:relative}.prize-badge{color:#fff;background:#ff5d8f;border-radius:999px;padding:1px 5px;font-size:.7rem;font-weight:900;line-height:1.4;position:absolute;top:-4px;right:-6px;box-shadow:0 2px #0000001f}.claims h3{margin:0 0 6px}.claims-waiting{border:2px solid var(--gold);background:#fff7e6}.claim-actions{flex:none;gap:6px;display:flex}.claim-given span{font-size:.95rem}.rhythm-staff{width:100%;position:relative}.rhythm-card .staff svg{max-height:220px}.scan-strip{flex-wrap:wrap;justify-content:center;gap:6px;margin:0;padding:0;list-style:none;display:flex}.scan-strip li{border:2px solid var(--line);color:var(--muted);background:#fff;border-radius:999px;padding:4px 10px;font-size:.9rem;font-weight:800;transition:transform .15s,background-color .15s}.scan-strip li.done{color:#2b8a3e;background:#d3f9d8;border-color:#2fbf71}.scan-strip li.now{background:var(--play);border-color:var(--play);color:#fff;transform:scale(1.12)}.scan-step{justify-items:center;gap:10px;width:100%;max-width:620px;display:grid}.prep-listen{color:var(--play);margin:0;font-weight:800}.prep-done{color:#2b8a3e;margin:0;font-size:1.2rem;font-weight:800}.prep-step .tap-pad{width:min(100%,420px)}.scan-nav{flex-wrap:wrap;justify-content:center;align-items:center;gap:10px;display:flex}.scan-jump{font:inherit;color:inherit;cursor:pointer;background:0 0;border:0;padding:0}.scan-text{text-align:center;margin:0;font-size:1.3rem;font-weight:700;line-height:1.4}.scan-icon{font-size:1.6rem}@media (width<=500px){.scan-strip li{padding:3px 7px;font-size:.75rem}.scan-text{font-size:1.05rem}}.sing-ghost{pointer-events:none;opacity:0;background:#6e668673;border:2px solid #6e6686cc;border-radius:50%;transition:top 60ms linear,background-color .12s;position:absolute;transform:translate(-50%,-50%)rotate(-20deg)}.sing-ghost.ghost-in-tune{background:#2fbf7180;border-color:#2fbf71}.sing-tuner{border:2px solid var(--line);background:#fff;border-radius:999px;padding:6px 18px;transition:background-color .12s,color .12s}.sing-tuner[data-reading=in-tune]{color:#2b8a3e;background:#d3f9d8;border-color:#2fbf71}.sing-tuner[data-reading=higher],.sing-tuner[data-reading=lower]{color:#c25e00;background:#fff3bf;border-color:#f59f00}.sing-buttons{flex-wrap:wrap;justify-content:center;gap:12px;display:flex}.sing-buttons .btn-big{min-width:200px}.staff-card.tune-card{max-width:980px}@media (height<=1200px) and (width>=700px){.ahead-lesson .lesson-body{gap:clamp(8px,1.6vh,18px)}.ahead-lesson .position-hand .keyboard{max-height:clamp(56px,8vh,100px)}.ahead-lesson .rhythm-card .staff svg{max-height:190px}.ahead-lesson .tap-pad-small{min-height:72px}.ahead-lesson .start-hint{margin:0;font-size:1.05rem}}@media (orientation:landscape) and (height<=900px){.lesson-body>.staff-card.tune-card{grid-area:auto/1/auto/-1;max-width:980px}}.playhead{background:var(--play);opacity:0;width:6px;box-shadow:0 0 12px color-mix(in srgb, var(--play) 60%, transparent);pointer-events:none;border-radius:3px;margin-left:-3px;position:absolute;top:6%;bottom:14%}.beat-ball{opacity:0;pointer-events:none;background:radial-gradient(circle at 35% 35%,#ffd8a8,#f76707);border-radius:50%;width:18px;height:18px;margin:-9px 0 0 -9px;position:absolute;box-shadow:0 2px 4px #00000040}.beat-ball-land{transform:scale(1.25,.8)}.count-badge{background:var(--play);color:#fff;text-align:center;pointer-events:none;border-radius:999px;min-width:56px;padding:2px 12px;font-size:2rem;font-weight:900;line-height:1.3;position:absolute;top:6px;right:12px}.rhythm-card-buttons{flex-wrap:wrap;justify-content:center;gap:10px;margin-top:8px;display:flex}.rhythm-card-buttons .hear-it{margin:0}.tempo-control{align-items:center;gap:10px;font-size:1.1rem;font-weight:800;display:flex}.tempo-note{vertical-align:-.1em;font-size:1.6em;line-height:0}.tempo-control small{color:var(--muted);font-weight:600}.replay-nav{width:100%;max-width:620px;color:var(--muted);justify-content:space-between;align-items:center;gap:8px;font-weight:700;display:flex}.echo-buttons{align-items:center;margin-top:0}.tap-pad-small{min-height:90px;margin-top:8px}.tap-pad-idle{opacity:.55;font-size:1.15rem}.tap-pad-go{outline:4px solid var(--screen);animation:.5s ease-in-out infinite alternate tap-pulse}@keyframes tap-pulse{to{outline-color:color-mix(in srgb, var(--screen) 30%, transparent)}}.rhythm-live{outline:4px solid color-mix(in srgb, var(--play) 35%, transparent)}.rhythm-go{align-content:center;justify-items:center;gap:10px;min-height:130px;display:grid}.count-in{color:var(--play);font-size:4.5rem;font-weight:900;line-height:1}.rhythm-status{color:var(--play);align-items:center;gap:8px;font-size:1.6rem;font-weight:900;display:flex}.tap-pad{border-radius:var(--radius);background:var(--screen-soft);width:100%;min-height:140px;color:var(--screen);font:inherit;touch-action:manipulation;-webkit-user-select:none;user-select:none;box-shadow:inset 0 -6px 0 color-mix(in srgb, var(--screen) 25%, transparent);border:0;font-size:1.6rem;font-weight:900}.tap-pad:not(:disabled):active{background:color-mix(in srgb, var(--screen) 25%, white)}.tap-pad:disabled{opacity:.5}.rhythm-options{gap:10px;width:100%;display:grid}.rhythm-option{background:#fff;padding:4px 8px}.rhythm-option .staff svg{max-height:160px}@media (width<=560px){.count-in{font-size:3.2rem}.tap-pad{min-height:110px}}.tempo-buttons{vertical-align:middle;gap:6px;margin-left:8px;display:inline-flex}.tempo-btn{border:2px solid var(--line,#e3d9c6);cursor:pointer;background:#fff;border-radius:999px;min-width:40px;height:32px;font-size:1rem;line-height:1}.tempo-btn:disabled{opacity:.4;cursor:default}.rhythm-lines{flex-direction:column;gap:0;display:flex}.rhythm-scroll{overflow:hidden}.rhythm-scroll .staff{will-change:transform;width:max-content}.rhythm-scroll .staff svg{max-height:none}.now-line{background:var(--play);opacity:.6;pointer-events:none;border-radius:3px;width:6px;margin-left:-3px;position:absolute;top:4%;bottom:10%}.rhythm-staff .staff svg g{transition:opacity .12s linear}.rhythm-staff .live path,.rhythm-staff .live rect{fill:var(--live);stroke:var(--live)}.reading-icon{font-size:2.4rem}.flash-card{align-content:center;min-height:200px;display:grid;position:relative}.flash-cover{color:var(--play);justify-items:center;gap:14px;padding:24px 0;font-size:1.6rem;font-weight:900;display:grid}.flash-cover>span{font-size:3rem}.flash-dots{gap:10px;display:flex}.flash-dots i{background:var(--track);border-radius:50%;width:18px;height:18px}.flash-dots i.done{background:var(--good)}.flash-timer{background:var(--play);transform-origin:0;border-radius:4px;height:8px;margin:8px 12px 0;animation:linear forwards flash-shrink}@keyframes flash-shrink{0%{transform:scaleX(1)}to{transform:scaleX(0)}}.flash-dragon{position:fixed;bottom:16px;right:16px}.look-first{justify-items:center;gap:10px;width:100%;max-width:560px;display:grid}.look-timer{width:100%;margin:0}.no-look-row{align-items:center;gap:6px;display:flex}.no-look{color:var(--muted);align-items:center;gap:8px;font-size:1rem;font-weight:700;display:flex}.btn-help{border:2px solid var(--line);border-radius:50%;width:32px;height:32px;padding:0;font-weight:900}.towel-help{max-width:640px}.towel-steps{grid-template-columns:repeat(3,1fr);gap:12px;margin:12px 0;display:grid}.towel-steps figure{text-align:center;justify-items:center;gap:6px;margin:0;font-size:.95rem;display:grid}.towel-steps svg{width:100%;max-width:160px;height:auto}.towel-eyes{font-size:3rem;line-height:110px}@media (width<=560px){.towel-steps{grid-template-columns:1fr}.towel-eyes{line-height:1.4}}.no-look input{width:22px;height:22px}.mark-pulse{animation:1.2s ease-in-out infinite mark-pulse}@keyframes mark-pulse{0%,to{opacity:1}50%{opacity:.55}}@media (prefers-reduced-motion:reduce){.mark-pulse{animation:none}}.fb-buttons{flex-wrap:wrap;justify-content:flex-end;align-items:center;gap:8px;display:flex}.paywall{max-width:640px;min-height:100dvh;padding:max(12px, env(safe-area-inset-top)) 16px max(24px, env(safe-area-inset-bottom));text-align:center;flex-direction:column;align-items:center;gap:14px;margin:0 auto;display:flex}.paywall-top{align-self:stretch;display:flex}.paywall h1{margin:0;font-size:1.9rem}.paywall-lead{margin:0;font-size:1.15rem;font-weight:700}.paywall-units{flex-wrap:wrap;justify-content:center;gap:8px;margin:0;padding:0;list-style:none;display:flex}.paywall-units li{border:2px solid color-mix(in srgb, var(--unit) 45%, transparent);background:#fff;border-radius:999px;align-items:center;gap:6px;padding:5px 12px 5px 5px;font-size:.95rem;font-weight:800;display:flex}.paywall-unit-num{background:var(--unit);color:#fff;border-radius:50%;place-items:center;width:24px;height:24px;font-size:.8rem;display:grid}.paywall-buy{justify-items:center;gap:12px;width:100%;display:grid}.paywall-options{grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:12px;width:100%;display:grid}.paywall-option{border:2px solid var(--line);border-radius:var(--radius);background:#fff;justify-items:center;gap:6px;padding:16px;display:grid}.paywall-option h2{margin:0;font-size:1.2rem}.paywall-price{margin:0;font-size:1.7rem;font-weight:900}.paywall-price span{color:var(--muted,#6e6686);font-size:1rem;font-weight:700}.paywall-trial{color:#2b8a3e;margin:0 0 6px;font-weight:700}.paywall-note,.paywall-status{margin:0;font-weight:700}.paywall-small{color:var(--muted,#6e6686);margin:0;font-size:.8rem;line-height:1.45}.node-bonus:not(.node-locked){color:#5a3a00!important;background:#ffd84d!important;box-shadow:0 6px #d9a400!important}.node-bonus{width:64px;height:64px;font-size:1.6rem}.tune-card{justify-items:center;gap:8px}.bar-wrap{flex:1;align-items:center;min-width:0;display:flex;position:relative}.bar-rider{pointer-events:none;line-height:0;transition:left .3s;position:absolute;top:50%;transform:translate(-50%,-62%)}.bar-rider .dragon{filter:drop-shadow(0 2px 2px #28146e40)}.rider-hop{animation:.6s ease-out rider-hop}@keyframes rider-hop{0%,to{transform:translateY(0)rotate(0)}35%{transform:translateY(-9px)rotate(-8deg)}70%{transform:translateY(0)rotate(4deg)}}.mood-sleepy .dragon-all{animation:4.5s ease-in-out infinite breathe}.mood-sleepy .dragon-head{transform-box:view-box;transform-origin:100px 118px;transform:rotate(9deg)}.dragon-zzz text{animation:2.4s ease-in-out infinite zzz}.dragon-zzz text:nth-child(2){animation-delay:.4s}.dragon-zzz text:nth-child(3){animation-delay:.8s}@keyframes zzz{0%,to{opacity:.15}50%{opacity:.8}}.dash-ready{text-align:center;justify-items:center;gap:12px;max-width:520px;display:grid}.dash-ready h1{margin:0}.dash-best{color:var(--fire);margin:0;font-weight:800}.dash-score{min-width:72px}.dash-in{animation:.18s ease-out dash-in}@keyframes dash-in{0%{opacity:.4;transform:scale(.94)}}
