:root{--background:#f7f8fb;--foreground:#17191f;--muted:#626b78;--surface:#fff;--surface-muted:#eef2f6;--line:#d8dde6;--line-strong:#9da8b8;--blue:#3557ff;--blue-dark:#2434b5;--teal:#009f90;--green:#178355;--red:#c24152;--amber:#d68b18;--coral:#ff5b63;--pink:#d83f87;--lime:#8fc53d;--violet:#7b55ff;--ink:#111217;--ink-2:#1c1d25;--detector-ink:#101624;--detector-panel:#151e2d;--detector-muted:#9aa8ba;--detector-glow:#2fd6bd;--detector-gold:#f5bd4f;--black-key:#171821;--black-key-line:#303241;--white-key:#fffdfa;--white-key-width:58px;--black-key-width:40px;--key-height:184px}html{height:100%;scroll-padding-top:88px}html,body{max-width:100vw;overflow-x:hidden}body{min-height:100%;color:var(--foreground);background:linear-gradient(180deg, #f7f8fb 0%, #eef5f1 42%, #f8f8f4 100%), var(--background);font-family:var(--font-geist-sans), Arial, Helvetica, sans-serif;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;flex-direction:column;display:flex}*{box-sizing:border-box;margin:0;padding:0}a{color:inherit;text-decoration:none}button,input{font:inherit}button{border:0}button:focus-visible,a:focus-visible,input:focus-visible{outline-offset:3px;outline:3px solid #265df247}.sr-only{clip:rect(0, 0, 0, 0);white-space:nowrap;border:0;width:1px;height:1px;margin:-1px;padding:0;position:absolute;overflow:hidden}.page-shell{min-height:100vh}.content-wrap{width:min(1120px,100vw - 32px);margin:0 auto}.site-frame{flex-direction:column;min-height:100vh;display:flex}.site-main{flex:1}.site-header{z-index:20;color:#fff;-webkit-backdrop-filter:blur(18px);backdrop-filter:blur(18px);background:#111217f0;border-bottom:1px solid #ffffff1a;position:sticky;top:0}.site-nav{align-items:center;gap:18px;width:min(1180px,100vw - 32px);min-height:72px;margin:0 auto;display:flex}.site-brand{align-items:center;gap:11px;min-width:0;display:inline-flex}.site-brand-mark{aspect-ratio:1;color:#111217;background:linear-gradient(135deg,#ffd86b,#7ef2d8);border:1px solid #ffffff2e;border-radius:8px;flex:none;justify-content:center;align-items:center;width:40px;font-size:.82rem;font-weight:900;display:inline-flex;box-shadow:0 10px 24px #7ef2d824}.site-brand strong,.site-brand small{display:block}.site-brand strong{color:#fff;font-size:.98rem;line-height:1.1}.site-brand small{color:#f8fbff94;margin-top:3px;font-size:.76rem}.site-nav-links{flex:1;justify-content:center;gap:6px;min-width:0;display:flex}.site-nav-links a,.site-nav-cta{white-space:nowrap;border-radius:7px;justify-content:center;align-items:center;min-height:38px;font-size:.9rem;font-weight:740;transition:color .14s,background .14s,transform .14s;display:inline-flex}.site-nav-links a{color:#f8fbffb8;padding:9px 11px}.site-nav-cta{color:#111217;background:#ffd86b;padding:9px 15px;box-shadow:0 10px 22px #ffd86b29}.site-nav-cta:hover{background:#ffe48c;transform:translateY(-1px)}.site-footer{color:#f8fbffc2;background:linear-gradient(135deg,#3557ff1f,#0000 36%),linear-gradient(250deg,#7ef2d817,#0000 34%),#111217;border-top:1px solid #ffffff1a}.site-footer-inner{grid-template-columns:minmax(0,1.35fr) minmax(150px,.55fr) minmax(170px,.65fr) minmax(170px,.65fr);gap:36px;width:min(1180px,100vw - 32px);margin:0 auto;padding:38px 0 30px;display:grid}.site-brand-footer .site-brand-mark{width:36px}.site-footer-brand p{color:#f8fbffa3;max-width:430px;margin-top:14px}.site-footer-group h2{color:#fff;letter-spacing:0;text-transform:uppercase;margin-bottom:12px;font-size:.82rem}.site-footer-links{gap:9px;display:grid}.site-footer-links a{color:#f8fbffa8;width:fit-content;font-weight:650}.site-footer-links a:hover{color:#7ef2d8}.site-footer-bottom{color:#f8fbff85;border-top:1px solid #ffffff1a;flex-wrap:wrap;justify-content:space-between;gap:10px;width:min(1180px,100vw - 32px);margin:0 auto;padding:16px 0 22px;font-size:.84rem;display:flex}.legal-page{background:linear-gradient(180deg, #fff 0%, #f1f6f8 54%, #f8f8f4 100%), var(--background)}.legal-hero{border-bottom:1px solid var(--line);background:linear-gradient(135deg,#3557ff14,#0000 36%),#fff;padding:68px 0 42px}.legal-updated{color:var(--foreground);margin-top:18px;font-weight:740}.legal-content{padding:42px 0 72px}.legal-document{gap:14px;width:min(860px,100vw - 32px);margin:0 auto;display:grid}.legal-document article{border:1px solid var(--line);background:#ffffffdb;border-radius:8px;padding:24px;box-shadow:0 16px 34px #1720330f}.legal-document h2{color:var(--foreground);margin-bottom:12px;font-size:1.18rem}.legal-document p+p{margin-top:10px}.product-page{min-height:100vh;color:var(--foreground);background:linear-gradient(180deg, #fff 0%, #f4f8fb 46%, #f8f8f4 100%), var(--background)}.product-shell{width:min(1180px,100vw - 32px);margin:0 auto}.product-hero{border-bottom:1px solid var(--line);background:linear-gradient(#fff 0%,#f4f7fa 100%);padding:0 0 36px}.product-hero-layout{text-align:center;flex-direction:column;justify-content:center;align-items:center;gap:14px;min-height:clamp(620px,100svh - 72px,820px);padding:28px 0 20px;display:flex}.product-copy{justify-items:center;gap:5px;width:100%;max-width:680px;display:grid}.product-copy h1{color:#202734;max-width:680px;margin-top:0;font-size:clamp(1.12rem,1.6vw,1.3rem);font-weight:820;line-height:1.18}.product-copy .eyebrow{color:#5b6573;font-size:.7rem;font-weight:820}.product-lead{color:#43505f;max-width:540px;margin-top:16px;font-size:1.08rem}.product-actions{flex-wrap:wrap;gap:12px;margin-top:22px;display:flex}.product-stat-row{grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;max-width:560px;margin-top:22px;display:grid}.product-stat-row span{border:1px solid var(--line);background:#ffffffc2;border-radius:8px;gap:3px;min-width:0;padding:13px;display:grid;box-shadow:0 12px 28px #1720330f}.product-stat-row strong{color:var(--foreground);font-size:1.28rem;line-height:1}.product-stat-row small{color:var(--muted);font-size:.82rem}.product-secondary-link{min-height:52px;color:var(--blue-dark);align-items:center;font-weight:780;display:inline-flex}.product-secondary-link:hover{color:var(--blue)}.product-quick-strip{width:min(640px,100%);color:var(--muted);flex-wrap:wrap;justify-content:center;gap:8px;margin:0 auto 2px;display:flex}.product-quick-strip a,.product-quick-strip span{background:#fffc;border:1px solid #11121717;border-radius:7px;justify-content:center;align-items:center;gap:5px;min-height:34px;padding:7px 10px;display:inline-flex;box-shadow:0 8px 18px #1720330b}.product-quick-strip strong{color:var(--foreground);font-size:.95rem;line-height:1}.product-quick-strip small{text-transform:uppercase;font-size:.72rem;font-weight:760;line-height:1}.product-continue-chip{color:var(--blue-dark);font-size:.84rem;font-weight:820}.hero-trainer-card{--white-key-width:clamp(52px, 8vw, 64px);--black-key-width:clamp(40px, 5vw, 44px);--key-height:clamp(168px, 28vw, 210px);background:linear-gradient(180deg, #fffffffa, #f7fafdfa), var(--surface);border:1px solid #1112171f;border-radius:8px;gap:14px;width:100%;min-width:0;max-width:640px;margin:0 auto;padding:18px;display:grid;box-shadow:0 22px 56px #17203321}.hero-trainer-top,.hero-trainer-stats{justify-content:space-between;align-items:center;gap:12px;display:flex}.hero-trainer-top span{color:var(--teal);text-transform:uppercase;font-size:.78rem;font-weight:800}.hero-trainer-top strong{color:var(--foreground);font-size:1rem}.hero-trainer-feedback{min-height:58px;color:var(--foreground);background:#f8fbff;border:1px solid #11121717;border-radius:8px;align-items:center;padding:12px 13px;font-weight:720;display:grid}.hero-trainer-actions{grid-template-columns:minmax(0,1fr) auto;align-items:stretch;gap:10px;display:grid}.hero-trainer-card .button{min-height:46px}.hero-trainer-card .hero-hear-button{min-height:60px;font-size:1.04rem;font-weight:870;position:relative;box-shadow:0 14px 28px #3557ff47,0 0 #3557ff33}.hero-trainer-card .hero-hear-button[data-attention=true]{animation:1.8s ease-out 3 hero-hear-pulse}.hero-trainer-card .hero-hear-button[data-playing=true]:after{content:"";opacity:.72;background:currentColor;border-radius:999px;width:7px;height:7px;animation:.72s ease-in-out infinite playing-dot-pulse}.hero-trainer-card .hero-replay-button{color:#3d4654;background:#eef3f7;min-width:116px}.hero-trainer-card .piano-scroll{background:linear-gradient(180deg, #f8fbff, #eaf0f6), var(--surface-muted);border-color:#1112171f;padding:16px 10px 18px}.hero-trainer-card .full-piano-keyboard{--white-key-width:clamp(52px, 7vw, 64px);--black-key-width:clamp(40px, 4.8vw, 44px);--key-height:clamp(130px, 20vw, 156px);scroll-behavior:smooth;scrollbar-gutter:stable}.full-piano-keyboard .note-label{font-size:.62rem}.hero-trainer-stats{border:1px solid var(--line);border-radius:8px;grid-template-columns:repeat(3,minmax(0,1fr));display:grid;overflow:hidden}.hero-trainer-stats span{border-right:1px solid var(--line);background:#fff;gap:2px;min-width:0;padding:10px 11px;display:grid}.hero-trainer-stats span:last-child{border-right:0}.hero-trainer-stats small{color:var(--muted);text-transform:uppercase;font-size:.74rem;font-weight:760}.hero-trainer-stats strong{color:var(--foreground);font-size:1.08rem}.note-preview-panel{border:1px solid var(--line);background:linear-gradient(180deg, #fffffff5, #f8fbfff5), var(--surface);border-radius:8px;align-content:start;gap:12px;padding:16px;display:grid;box-shadow:0 20px 48px #1720331a}.preview-panel-header{color:var(--muted);justify-content:space-between;align-items:center;gap:12px;font-weight:740;display:flex}.preview-panel-header strong{color:var(--blue-dark);font-size:1.1rem}.preview-wave{background-color:#f7fafc;background-image:linear-gradient(#3557ff0f 1px,#0000 1px),linear-gradient(90deg,#3557ff0d 1px,#0000 1px),none;background-position:0 0,0 0,0 0;background-repeat:repeat,repeat,repeat;background-size:24px 24px;background-attachment:scroll,scroll,scroll;background-origin:padding-box,padding-box,padding-box;background-clip:border-box,border-box,border-box;border:1px solid #dbe4ef;border-radius:8px;place-items:center;min-height:138px;display:grid;overflow:hidden}.preview-wave svg{width:min(100%,360px);height:auto}.preview-wave path{fill:none;stroke:var(--teal);stroke-linecap:round;stroke-width:5px;stroke-dasharray:18 14;filter:drop-shadow(0 6px 14px #009f9033);animation:1.9s linear infinite preview-wave-drift}.preview-note-row{grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;display:grid}.preview-note-button{border:1px solid var(--line);min-height:42px;color:var(--foreground);cursor:pointer;background:#fff;border-radius:7px;font-weight:800;transition:transform .14s,border-color .14s,box-shadow .14s}.preview-note-button:hover{border-color:#3557ff70;transform:translateY(-1px);box-shadow:0 10px 20px #17203314}.preview-help{color:var(--muted);font-size:.9rem}.preview-keybed{background:#111217;border-radius:8px;grid-template-columns:repeat(12,minmax(0,1fr));gap:4px;height:82px;padding:8px;display:grid;position:relative}.preview-keybed span{background:#fffdfa;border-radius:0 0 6px 6px;align-self:stretch}.preview-keybed .is-black{z-index:1;background:#171821;height:64%}.preview-keybed .is-active{background:#ffd86b;box-shadow:0 0 0 4px #ffd86b29}.product-mode-panel{background:#ffffffd1;border:1px solid #d8e0ebe6;border-radius:8px;gap:10px;width:100%;max-width:680px;margin:0 auto;padding:12px;display:grid;box-shadow:0 18px 42px #17203312}.mode-switchboard-top{background:#f8fbff;border:1px solid #11121714;border-radius:8px;grid-template-columns:minmax(190px,.86fr) minmax(0,1fr);align-items:center;gap:12px;padding:10px;display:grid}.mode-switchboard-top .mode-keyboard-preview{height:54px}.mode-switchboard-copy{text-align:left;gap:3px;display:grid}.mode-switchboard-copy h2{color:var(--foreground);font-size:1rem;line-height:1.15}.product-section-heading{justify-content:space-between;align-items:end;gap:24px;margin-bottom:10px;display:flex}.product-section-heading h2{margin-top:6px;font-size:clamp(1.45rem,2.4vw,2rem)}.product-section-heading p{max-width:420px}.training-mode-grid{flex-wrap:wrap;gap:8px;display:flex}.training-mode-card{--mode-accent:var(--blue);border:1px solid var(--line);background:#fff;border-radius:8px;flex:120px;justify-content:center;align-items:center;gap:8px;min-width:120px;min-height:42px;padding:8px 10px;transition:transform .16s,border-color .16s,box-shadow .16s;display:inline-flex;position:relative}.training-mode-card:before{background:var(--mode-accent);content:"";border-radius:999px;flex:none;width:8px;height:8px}.training-mode-card[data-accent=teal]{--mode-accent:var(--teal)}.training-mode-card[data-accent=green]{--mode-accent:var(--green)}.training-mode-card[data-accent=amber]{--mode-accent:var(--amber)}.training-mode-card[data-accent=violet]{--mode-accent:var(--violet)}.training-mode-card:hover{border-color:var(--mode-accent);transform:translateY(-2px);box-shadow:0 16px 30px #17203317}.training-mode-title{min-width:0;color:var(--foreground);text-overflow:ellipsis;white-space:nowrap;flex:0 auto;font-size:.88rem;font-weight:820;line-height:1.15;overflow:hidden}.training-mode-description{color:var(--muted);font-size:.94rem;line-height:1.5}.training-mode-action{color:var(--mode-accent);flex:none;font-size:.78rem;font-weight:820}.mode-keyboard-preview{background:#111217;border-radius:8px;grid-template-columns:repeat(7,minmax(0,1fr));height:56px;padding:6px;display:grid;position:relative;overflow:hidden}.mode-keyboard-preview span{background:#fffdfa;border-right:1px solid #d3d9e2;border-radius:0 0 5px 5px}.mode-keyboard-preview span:first-child{border-left:1px solid #d3d9e2}.mode-keyboard-preview .is-hot,.mode-keyboard-preview .mode-black-key.is-hot{background:#ffd86b;box-shadow:inset 0 0 0 2px #11121724}.training-mode-card[data-accent=teal] .mode-keyboard-preview .is-hot{background:#7ef2d8}.training-mode-card[data-accent=green] .mode-keyboard-preview .is-hot{background:#9ee6b8}.training-mode-card[data-accent=amber] .mode-keyboard-preview .is-hot{background:#ffd86b}.training-mode-card[data-accent=violet] .mode-keyboard-preview .is-hot{background:#c8bbff}.mode-black-key{z-index:2;background:var(--black-key);border-radius:0 0 4px 4px;width:10%;height:34px;position:absolute;top:6px;box-shadow:0 6px 12px #00000047}.mode-black-0{left:16%}.mode-black-1{left:29%}.mode-black-2{left:56%}.mode-black-3{left:69%}.mode-black-4{left:82%}.product-section{padding:42px 0}.product-guide-section{padding:16px 0 44px}.landing-guide-disclosure summary{border:1px solid var(--line);width:fit-content;min-height:38px;color:var(--blue-dark);cursor:pointer;background:#fff;border-radius:8px;padding:8px 12px;font-weight:800;list-style:none}.landing-guide-disclosure summary::-webkit-details-marker{display:none}.landing-guide-disclosure[open] summary{margin-bottom:14px}.practice-info-grid{grid-template-columns:minmax(0,1.15fr) minmax(280px,.85fr);gap:16px;display:grid}.practice-info-panel{border:1px solid var(--line);background:#ffffffdb;border-radius:8px;padding:24px}.practice-info-panel h2{margin-top:7px;font-size:clamp(1.45rem,2.5vw,2.1rem)}.practice-step-list{gap:12px;margin-top:18px;display:grid}.practice-step-list article{border:1px solid var(--line);background:#fff;border-radius:8px;grid-template-columns:42px minmax(0,1fr);align-items:start;gap:13px;padding:13px;display:grid}.practice-step-list article>span{color:#fff;background:var(--blue);border-radius:8px;justify-content:center;align-items:center;width:36px;height:36px;font-weight:850;display:inline-flex}.practice-step-list h3{margin-bottom:3px}.detector-info-panel{background:linear-gradient(135deg,#f5bd4f21,#0000 38%),#ffffffdb;align-content:start;gap:14px;display:grid}.game-page{color:#f8fbff;background:linear-gradient(#ffffff09 1px,#0000 1px) 0 0/34px 34px,linear-gradient(90deg,#ffffff08 1px,#0000 1px) 0 0/34px 34px,linear-gradient(145deg,#111217 0%,#20202b 48%,#151a18 100%);min-height:100vh}.game-shell{width:min(1180px,100vw - 32px);margin:0 auto}.game-hero{border-bottom:1px solid #ffffff1a;min-height:auto;padding:56px 0 34px;position:relative;overflow:hidden}.game-hero:before{pointer-events:none;content:"";background:linear-gradient(115deg,#3557ff52,#0000 28%),linear-gradient(245deg,#ff5b633d,#0000 30%),linear-gradient(#0000 72%,#00000042);position:absolute;inset:0}.game-hero-grid{z-index:1;grid-template-columns:minmax(0,1fr) minmax(360px,.8fr);align-items:center;gap:48px;display:grid;position:relative}.game-copy{max-width:720px}.game-eyebrow{color:#7ef2d8}.game-copy h1{color:#fff;max-width:760px;margin-top:12px;font-size:clamp(2.7rem,5.8vw,4.9rem);line-height:.98}.game-lead{color:#f8fbffc2;max-width:660px;margin-top:22px;font-size:1.14rem}.game-actions{flex-wrap:wrap;gap:12px;margin-top:28px;display:flex}.button-xl{min-height:52px;padding:14px 20px}.game-score-strip{grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;max-width:560px;margin-top:28px;display:grid}.game-score-strip span{-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px);background:#ffffff12;border:1px solid #ffffff1f;border-radius:8px;gap:3px;min-width:0;padding:14px;display:grid}.game-score-strip strong{color:#fff;font-size:1.42rem;line-height:1}.game-score-strip small{color:#f8fbffa3;font-size:.82rem}.quest-console{background:linear-gradient(#ffffff1a,#ffffff0a),#161821;border:1px solid #ffffff24;border-radius:8px;padding:16px;position:relative;overflow:hidden;box-shadow:0 28px 80px #00000057,inset 0 1px #ffffff24}.quest-console:after{pointer-events:none;content:"";background:repeating-linear-gradient(0deg,#ffffff08 0 1px,#0000 1px 6px);position:absolute;inset:0}.console-top{z-index:1;color:#f8fbffb3;justify-content:space-between;align-items:center;gap:12px;min-height:42px;padding:0 2px 12px;font-weight:760;display:flex;position:relative}.console-top strong{color:#ffd86b}.sound-arena{z-index:1;background:linear-gradient(#7ef2d814,#0000),#10121a;border:1px solid #ffffff1a;border-radius:8px;min-height:300px;position:relative;overflow:hidden}.sound-scope{width:calc(100% - 36px);height:calc(100% - 36px);position:absolute;inset:18px}.scope-grid{fill:none;stroke:#ffffff14;stroke-width:1px}.scope-wave{fill:none;stroke:#7ef2d8;stroke-linecap:round;stroke-width:5px;filter:drop-shadow(0 0 14px #7ef2d861);stroke-dasharray:18 14;animation:1.8s linear infinite scope-dash}.scope-wave-back{stroke:#ff5b63b8;stroke-width:3px;animation-duration:2.4s}.scope-hit{fill:#ffd86b;filter:drop-shadow(0 0 14px #ffd86b7a);transform-origin:50%;animation:1.2s ease-in-out infinite scope-hit}.scope-hit-two{animation-delay:.42s}.cue-note{z-index:1;color:#111217;background:#ffd86b;border:1px solid #ffffff2e;border-radius:8px;justify-content:center;align-items:center;width:58px;height:58px;font-weight:850;animation:2.2s ease-in-out infinite cue-float;display:inline-flex;position:absolute;box-shadow:0 16px 34px #0000003d}.cue-button{cursor:pointer;transition:transform .14s,box-shadow .14s,filter .14s}.cue-button:hover{filter:saturate(1.18);transform:translateY(-5px)scale(1.04)}.cue-button:active{transform:translateY(0)scale(.96)}.cue-note-a{top:34px;left:34px}.cue-note-b{background:#7ef2d8;animation-delay:.78s;bottom:34px;right:38px}.cue-note-c{background:#ff7a6d;animation-delay:.38s;top:calc(50% - 29px);left:calc(50% - 29px)}.cue-note[data-tone=coral]{color:#fff}.combo-spark{z-index:2;color:#111217;background:#ffd86b;border:1px solid #ffffff2e;border-radius:999px;padding:7px 10px;font-size:.82rem;font-weight:900;animation:.56s cubic-bezier(.2,.9,.2,1) both spark-pop;position:absolute;top:26px;right:26px;box-shadow:0 12px 28px #0000003d}.fever-panel{z-index:1;background:#ffffff0f;border:1px solid #ffffff1a;border-radius:8px;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;margin-top:12px;padding:12px;display:grid;position:relative}.fever-panel div:not(.fever-track){gap:2px;display:grid}.fever-panel span{color:#f8fbff9e;font-size:.78rem;font-weight:720}.fever-panel strong{color:#fff;font-size:1.02rem}.fever-track{background:#ffffff1c;border-radius:999px;grid-column:1/-1;height:9px;overflow:hidden}.fever-track span{border-radius:inherit;background:linear-gradient(90deg,#ff7a6d,#ffd86b,#7ef2d8);height:100%;transition:width .18s;display:block;box-shadow:0 0 18px #ffd86b47}.console-keybed{z-index:1;background:#08090d;border-radius:8px;grid-template-columns:repeat(12,minmax(0,1fr));gap:5px;height:102px;margin-top:14px;padding:9px;display:grid;position:relative}.console-keybed span{background:#fffdfa;border-radius:0 0 6px 6px;align-self:stretch}.console-keybed .is-black{z-index:1;background:#171821;height:66%;box-shadow:0 10px 18px #00000057}.console-keybed .is-hot,.console-keybed .is-pulse{background:#ffd86b;box-shadow:0 0 0 4px #ffd86b1f}.console-keybed .is-pulse{animation:1.2s ease-in-out infinite key-pulse}.game-section{padding:42px 0}.game-section-tight{padding-top:0}.game-heading{justify-content:space-between;align-items:end;gap:24px;margin-bottom:20px;display:flex}.game-heading h2,.loop-panel h2,.boss-panel h2{color:#fff;font-size:clamp(1.7rem,3vw,2.4rem);line-height:1.08}.text-link{color:#7ef2d8;font-weight:780}.mission-grid{grid-template-columns:repeat(auto-fit,minmax(190px,1fr));gap:14px;display:grid}.mission-card{color:#fff;background:#ffffff12;border:1px solid #ffffff1f;border-radius:8px;gap:12px;min-height:220px;padding:20px;transition:transform .18s,border-color .18s,background .18s;display:grid;position:relative;overflow:hidden}.mission-card:before{background:var(--coral);content:"";height:4px;position:absolute;inset:0 0 auto}.mission-card[data-accent=cyan]:before{background:#7ef2d8}.mission-card[data-accent=lime]:before{background:var(--lime)}.mission-card[data-accent=violet]:before{background:var(--violet)}.mission-card[data-accent=gold]:before{background:#ffd86b}.mission-card:hover{background:#ffffff1a;border-color:#ffffff47;transform:translateY(-4px)}.mission-level{color:#f8fbff99;text-transform:uppercase;font-size:.78rem;font-weight:820}.mission-title{font-size:1.35rem;font-weight:850;line-height:1.05}.mission-description{color:#f8fbffb3;line-height:1.55}.mission-footer{gap:5px;margin-top:auto;display:grid}.mission-footer small{color:#f8fbff94;font-size:.8rem}.mission-footer strong{color:#ffd86b}.loop-grid{grid-template-columns:minmax(0,1.1fr) minmax(280px,.9fr);align-items:stretch;gap:18px;display:grid}.loop-panel,.boss-panel{background:#ffffff12;border:1px solid #ffffff1f;border-radius:8px;padding:24px}.loop-steps{gap:12px;margin-top:20px;display:grid}.loop-steps article{border:1px solid #ffffff1a;border-radius:8px;grid-template-columns:46px minmax(0,1fr);align-items:start;gap:14px;padding:14px;display:grid}.loop-steps article>span{color:#111217;background:#7ef2d8;border-radius:8px;justify-content:center;align-items:center;width:42px;height:42px;font-weight:850;display:inline-flex}.loop-steps h3{color:#fff;font-size:1.02rem}.loop-steps p,.boss-panel p{color:#f8fbffb3}.boss-panel{background:linear-gradient(135deg,#ffd86b24,#0000 38%),#ffffff12;align-content:start;gap:16px;display:grid}.hero-section{border-bottom:1px solid var(--line);background:#fff;padding:64px 0 38px}.training-page,.training-game-page{background:linear-gradient(180deg, #f7f8fb 0%, #eef5f1 46%, #f8f8f4 100%), var(--background)}.training-header-section{border-bottom:1px solid var(--line);background:linear-gradient(135deg,#3557ff14,#0000 34%),#fff;padding:44px 0 30px}.training-header-wrap{display:block}.training-header-compact{padding:18px 0}.training-compact-copy{grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:18px;display:grid}.training-compact-copy h1{margin-top:5px;font-size:clamp(1.55rem,3vw,2.35rem);line-height:1.05}.training-compact-copy .back-link{white-space:nowrap;margin-top:0}.training-hero-section{color:#fff;background:linear-gradient(#ffffff0a 1px,#0000 1px) 0 0/30px 30px,linear-gradient(90deg,#ffffff09 1px,#0000 1px) 0 0/30px 30px,linear-gradient(135deg,#111217 0%,#20202b 58%,#171b18 100%);border-bottom:0;padding:58px 0 36px;position:relative;overflow:hidden}.back-link{width:fit-content;color:var(--blue-dark);margin-top:16px;font-weight:780;display:inline-flex}.training-hero-section:before{pointer-events:none;content:"";background:linear-gradient(110deg,#3557ff38,#0000 34%),linear-gradient(250deg,#8fc53d33,#0000 30%);position:absolute;inset:0}.training-hero-grid{z-index:1;position:relative}.training-hero-section h1{color:#fff}.training-hero-section .lead{color:#f8fbffbd}.training-chip-row,.mission-chip-row{flex-wrap:wrap;gap:8px;margin-top:22px;display:flex}.training-chip-row span,.mission-chip-row span{border:1px solid var(--line);min-height:32px;color:var(--muted);background:#f8fbff;border-radius:999px;align-items:center;padding:7px 10px;font-size:.84rem;font-weight:760;display:inline-flex}.training-hero-console{background:#ffffff14;border:1px solid #ffffff24;border-radius:8px;gap:14px;padding:16px;display:grid;position:relative;overflow:hidden;box-shadow:0 24px 64px #0000004d}.training-console-screen{background:linear-gradient(#7ef2d81a,#0000),#10121a;border:1px solid #ffffff1a;border-radius:8px;place-items:center;min-height:128px;display:grid;position:relative;overflow:hidden}.training-console-screen span{opacity:0;border:1px solid #7ef2d857;border-radius:999px;width:210px;height:70px;animation:2.1s ease-out infinite console-wave;position:absolute;transform:scale(.5)}.training-console-screen span:nth-child(2){animation-delay:.52s}.training-console-screen span:nth-child(3){animation-delay:1.04s}.training-console-screen strong{z-index:1;color:#ffd86b;text-transform:uppercase;font-size:1.6rem;position:relative}.hero-grid{grid-template-columns:minmax(0,1fr) 360px;align-items:center;gap:42px;display:grid}.hero-copy{max-width:780px}.eyebrow,.mode-card-meta,.feedback-label,.detected-label{color:var(--teal);letter-spacing:0;text-transform:uppercase;font-size:.78rem;font-weight:750}h1,h2,h3{letter-spacing:0}h1{max-width:820px;margin-top:10px;font-size:3rem;line-height:1.05}h2{font-size:1.35rem;line-height:1.25}h3{font-size:1rem}p{color:var(--muted);line-height:1.65}.lead{max-width:720px;margin-top:18px;font-size:1.08rem}.mini-keyboard-visual{border:1px solid var(--line);background:var(--surface-muted);border-radius:8px;grid-template-columns:repeat(7,1fr);height:154px;padding:14px;display:grid;position:relative;box-shadow:0 16px 38px #17203314}.mini-keyboard-game{height:154px;box-shadow:none;background:#08090d;border-color:#ffffff1f}.mini-keyboard-visual span:not(.black){background:var(--white-key);border:1px solid #cfd8e4;border-right:0;border-radius:0 0 6px 6px;align-self:stretch}.mini-keyboard-game span:not(.black){border-color:#ffffff3d}.mini-keyboard-visual span:not(.black):last-child{border-right:1px solid #cfd8e4}.mini-keyboard-visual .black{z-index:2;background:var(--black-key);border-radius:0 0 5px 5px;justify-self:center;width:72%;height:60%;margin-left:-50%;position:relative}.mini-keyboard-visual .is-hot{background:#ffd86b!important}.mini-keyboard-visual .is-pulse{animation:1.2s ease-in-out infinite key-pulse;background:#7ef2d8!important}.content-section,.tool-section{padding:38px 0}.training-page .settings-row{padding-top:18px}.learning-section{padding:0 0 54px}.learning-disclosure summary{min-height:54px;color:var(--foreground);cursor:pointer;justify-content:space-between;align-items:center;gap:16px;padding:0;list-style:none;display:flex}.learning-disclosure summary::-webkit-details-marker{display:none}.learning-disclosure summary span{color:var(--teal);text-transform:uppercase;font-size:.78rem;font-weight:800}.learning-disclosure summary strong{color:var(--blue-dark);font-size:.96rem}.learning-disclosure summary:after{border:1px solid var(--line);content:"+";background:#fff;border-radius:8px;justify-content:center;align-items:center;width:30px;height:30px;font-weight:850;display:inline-flex}.learning-disclosure[open] summary{margin-bottom:14px}.learning-disclosure[open] summary:after{content:"-"}.compact-section{padding-top:10px}.section-heading{justify-content:space-between;align-items:end;gap:24px;margin-bottom:20px;display:flex}.mode-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:14px;display:grid}.mode-card,.learning-block,.faq-grid article{border:1px solid var(--line);background:var(--surface);border-radius:8px;min-height:100%;padding:22px}.mode-card{flex-direction:column;gap:10px;transition:border-color .16s,transform .16s,box-shadow .16s;display:flex}.mode-card:hover{border-color:#265df28c;transform:translateY(-2px);box-shadow:0 14px 26px #17203317}.mode-card-title{font-size:1.12rem;font-weight:780}.mode-card-description{color:var(--muted);line-height:1.55}.mode-card-action{color:var(--blue);margin-top:auto;font-weight:700}.path-panel{border:1px solid var(--line);background:var(--surface);border-radius:8px;padding:20px 22px}.path-row,.related-links{flex-wrap:wrap;align-items:center;gap:10px;margin-top:12px;display:flex}.path-row a,.related-links a{border:1px solid var(--line);color:var(--blue-dark);background:#f8fbff;border-radius:6px;padding:8px 11px;font-weight:650}.path-row span{color:var(--line-strong)}.faq-grid,.learning-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:14px;display:grid}.faq-grid article h2,.learning-block h2{margin-bottom:10px}.related-block{grid-column:1/-1}.difficulty-selector{grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;margin-bottom:14px;display:grid}.settings-row{flex-wrap:wrap;justify-content:space-between;align-items:center;gap:12px;padding-top:26px;display:flex}.settings-row .difficulty-selector{flex:520px;margin-bottom:0}.settings-row .toggle-control{flex:none}.settings-static{border:1px solid var(--line);background:#fff;border-radius:8px;gap:3px;min-height:54px;padding:10px 13px;display:grid}.settings-static span{color:var(--muted);text-transform:uppercase;font-size:.78rem;font-weight:760}.settings-static strong{color:var(--foreground);font-size:.98rem}.difficulty-selector button,.tuning-selector button{border:1px solid var(--line);min-height:44px;color:var(--foreground);background:var(--surface);cursor:pointer;text-align:left;border-radius:8px;gap:4px;padding:10px 14px;display:grid}.difficulty-selector button.is-active,.tuning-selector button.is-active{border-color:var(--blue);box-shadow:inset 0 0 0 1px var(--blue)}.training-card,.detector-card{border:1px solid var(--line);background:var(--surface);border-radius:8px;padding:18px;box-shadow:0 18px 42px #17203314}.training-tool-card,.training-game-card{background:linear-gradient(180deg, #fffffffa, #f7fafdfa), var(--surface);border-color:#1112171a;position:relative;overflow:hidden;box-shadow:0 22px 56px #1720331f}.training-tool-card:before,.training-game-card:before{background:linear-gradient(90deg, var(--coral), #ffd86b, #7ef2d8, var(--violet));content:"";height:4px;position:absolute;inset:0 0 auto}.training-card-header,.detector-header{grid-template-columns:minmax(0,1fr) auto;align-items:start;gap:20px;margin-bottom:12px;display:grid}.training-card-header h2,.detector-header h2{margin:7px 0 6px}.training-progress,.mission-progress{background:#e3e9f2;border-radius:999px;width:min(320px,100%);height:9px;margin-top:14px;position:relative;overflow:hidden}.training-progress span,.mission-progress span{border-radius:inherit;background:linear-gradient(90deg, var(--coral), #ffd86b);height:100%;transition:width .18s;display:block;box-shadow:0 0 18px #ff5b6347}.training-status-rack,.mission-status-rack{grid-template-columns:repeat(3,minmax(0,max-content));gap:8px;margin-top:12px;display:grid}.training-status-rack span,.mission-status-rack span{background:#fff;border:1px solid #11121714;border-radius:8px;gap:2px;min-width:94px;padding:9px 10px;display:grid;box-shadow:0 8px 18px #1720330f}.training-status-rack small,.mission-status-rack small{color:var(--muted);text-transform:uppercase;font-size:.72rem;font-weight:760}.training-status-rack strong,.mission-status-rack strong{color:var(--foreground);font-size:.92rem}.training-status-rack[data-status=answering] span:first-child,.mission-status-rack[data-status=answering] span:first-child{background:#fff5f1;border-color:#ff5b634d}.training-status-rack[data-status=feedback] span:nth-child(2),.training-status-rack[data-status=playing] span:first-child,.mission-status-rack[data-status=feedback] span:nth-child(2),.mission-status-rack[data-status=playing] span:first-child{background:#f0fffb;border-color:#7ef2d85c}.stats-panel{border:1px solid var(--line);border-radius:8px;grid-template-columns:repeat(4,minmax(74px,1fr));display:grid;overflow:hidden}.stats-panel div,.summary-grid div,.detected-grid div{border-right:1px solid var(--line);background:#f8fbff;gap:3px;padding:12px;display:grid}.training-tool-card .stats-panel,.training-game-card .stats-panel{border-color:#1112171f;box-shadow:0 10px 24px #17203314}.training-tool-card .stats-panel div,.training-game-card .stats-panel div{background:linear-gradient(#fff,#f4f7fb),#f8fbff}.stats-panel div:last-child,.summary-grid div:last-child,.detected-grid div:last-child{border-right:0}.stats-panel span,.summary-grid span,.detected-grid span,.signal-meter span,.stability-row span{color:var(--muted);font-size:.82rem}.stats-panel strong,.summary-grid strong,.detected-grid b,.signal-meter strong,.stability-row strong{color:var(--foreground);font-size:1rem}.training-controls,.detector-actions{flex-wrap:wrap;align-items:center;gap:10px;margin-bottom:12px;display:flex}.button{cursor:pointer;border-radius:7px;justify-content:center;align-items:center;gap:8px;min-height:42px;padding:10px 16px;font-weight:740;transition:transform .14s,box-shadow .14s,background .14s;display:inline-flex}.button:hover:not(:disabled){transform:translateY(-1px)}.button:disabled{cursor:not-allowed;opacity:.54}.button-primary{color:#fff;background:linear-gradient(135deg, var(--blue), var(--violet));box-shadow:0 10px 22px #3557ff3d}.button-primary:hover:not(:disabled){background:linear-gradient(135deg, var(--blue-dark), #5b3ff0)}.button-secondary{color:var(--foreground);border:1px solid var(--line);background:#edf2f8}.helper-text,.privacy-note,.status-strip{color:var(--muted);background:#f8fbff;border-radius:7px;margin:10px 0 14px;padding:10px 12px}.training-tool-card .helper-text,.training-tool-card .privacy-note,.training-tool-card .status-strip,.training-game-card .helper-text,.training-game-card .privacy-note,.training-game-card .status-strip{background:#fffaf0;border:1px solid #11121714}.status-error{color:var(--red)!important;background:#fff5f5!important;border-color:#b8323257!important}.piano-scroll{border:1px solid var(--line);background:var(--surface-muted);scrollbar-width:thin;border-radius:8px;padding:14px 6px 20px;position:relative;overflow-x:auto;-webkit-mask-image:linear-gradient(90deg,#0000 0,#000 18px calc(100% - 18px),#0000 100%);mask-image:linear-gradient(90deg,#0000 0,#000 18px calc(100% - 18px),#0000 100%)}.training-tool-card .piano-scroll,.training-game-card .piano-scroll{background:linear-gradient(180deg, #f8fbff, #eaf0f6), var(--surface-muted);border-color:#1112171f}.piano-frame{height:var(--key-height);margin:0 auto;position:relative}.white-key-row{height:100%;display:flex}.piano-key{cursor:pointer;-webkit-user-select:none;user-select:none;touch-action:manipulation;transition:transform .12s,box-shadow .12s,background .12s}.piano-key:disabled{cursor:not-allowed}.piano-key-white{flex:0 0 var(--white-key-width);width:var(--white-key-width);color:#172033;background:var(--white-key);border:1px solid #bfc9d7;border-right:0;border-radius:0 0 6px 6px;justify-content:center;align-items:flex-end;height:100%;padding:0 4px 10px;display:flex;position:relative}.piano-key-white:last-child{border-right:1px solid #bfc9d7}.piano-key-black{z-index:3;width:var(--black-key-width);border:1px solid var(--black-key-line);color:#fff;background:var(--black-key);border-radius:0 0 5px 5px;justify-content:center;align-items:flex-end;height:62%;padding:0 3px 9px;display:flex;position:absolute;top:0;box-shadow:0 7px 10px #17203338}.piano-key-content{text-align:center;justify-items:center;gap:4px;width:100%;min-width:0;display:grid}.note-label{overflow-wrap:anywhere;font-size:.76rem;font-weight:760;line-height:1.05}.note-label-both{gap:2px}.key-state-text{overflow-wrap:anywhere;font-size:.64rem;font-weight:720;line-height:1.05}.key-shortcut{color:#202734;min-width:24px;max-width:100%;min-height:17px;font-family:var(--font-geist-mono), ui-monospace, monospace;text-overflow:ellipsis;white-space:nowrap;background:#ffffffb8;border:1px solid #17203329;border-radius:4px;justify-content:center;align-items:center;padding:2px 4px;font-size:.55rem;font-weight:820;line-height:1;display:inline-flex;overflow:hidden}.key-shortcut-combo{padding-inline:3px;font-size:.5rem}.piano-shortcut-map{height:32px;margin:10px auto 0;position:relative}.piano-shortcut-octave{color:#172033ad;background:#ffffffb8;border:1px solid #1720331f;border-radius:6px;justify-content:center;align-items:center;gap:5px;min-width:32px;height:28px;padding:3px 5px;display:inline-flex;position:absolute;top:0;overflow:hidden;box-shadow:inset 0 1px #fffc}.piano-shortcut-octave kbd{color:#172033;min-width:18px;height:18px;font-family:var(--font-geist-mono), ui-monospace, monospace;background:#fff;border:1px solid #17203324;border-radius:4px;justify-content:center;align-items:center;font-size:.62rem;font-weight:840;line-height:1;display:inline-flex}.piano-shortcut-octave span{text-overflow:ellipsis;white-space:nowrap;min-width:0;font-size:.6rem;font-weight:760;line-height:1;overflow:hidden}.piano-key-black .key-shortcut{color:#fff;background:#ffffff1f;border-color:#fff3}.piano-key.is-selected{box-shadow:inset 0 0 0 3px #3557ffd1,0 0 0 5px #3557ff14}.piano-key.is-correct{color:#fff;background:linear-gradient(180deg, #1fa96f, var(--green));box-shadow:inset 0 0 0 3px #ffffff73,0 0 0 6px #1783551f}.piano-key.is-wrong{color:#fff;background:linear-gradient(180deg, #e05265, var(--red));animation:.22s ease-out wrong-key-shake;box-shadow:inset 0 0 0 3px #ffffff73,0 0 0 6px #c241521a}.piano-key.is-detected{color:#172033;background:#f7c85f;box-shadow:inset 0 0 0 3px #17203347}.piano-key:disabled:not(.is-correct):not(.is-wrong):not(.is-detected):not(.is-selected){opacity:.58}@media (hover:hover) and (pointer:fine){.piano-key:hover:not(:disabled){transform:translateY(-2px)}}.feedback-panel{border:1px solid var(--line);background:#f8fbff;border-radius:8px;min-height:66px;margin-top:14px;padding:12px}.training-tool-card .feedback-panel,.training-game-card .feedback-panel{background:#fff;border-color:#1112171a;box-shadow:0 10px 22px #1720330f}.feedback-panel p{color:var(--foreground);white-space:pre-line;margin-top:6px}.feedback-correct{background:#f1fbf5;border-color:#17724561}.feedback-correct .feedback-label{color:var(--green)}.feedback-wrong{background:#fff7f7;border-color:#b8323252;animation:.24s ease-out wrong-feedback-shake}.feedback-wrong .feedback-label{color:var(--red)}.session-summary{gap:16px;max-width:680px;display:grid}.session-summary h2{font-size:2rem}.summary-grid,.detected-grid{border:1px solid var(--line);border-radius:8px;grid-template-columns:repeat(2,minmax(0,1fr));display:grid;overflow:hidden}.mistake-list{gap:10px;display:grid}.mistake-list ul{gap:8px;list-style:none;display:grid}.mistake-list li{color:var(--muted);background:#f8fbff;border-radius:7px;justify-content:space-between;gap:12px;padding:10px 12px;display:flex}.muted-text{color:var(--muted)}.detector-section{padding-top:26px}.detector-console{background:linear-gradient(180deg, #fffffffa, #f7fafdfa), var(--surface);border-color:#cbd6e4;position:relative;overflow:hidden;box-shadow:0 22px 56px #1720331c}.detector-console:before{background:linear-gradient(90deg, var(--detector-ink), var(--detector-glow), var(--detector-gold));content:"";height:3px;position:absolute;inset:0 0 auto}.detector-console .detector-header{align-items:center;margin-bottom:16px}.detector-intro{max-width:660px}.detector-control-stack{justify-items:end;gap:12px;display:grid}.detector-live-pill{width:fit-content;min-height:32px;color:var(--foreground);white-space:nowrap;background:#fff;border:1px solid #1016241a;border-radius:999px;align-items:center;padding:6px 10px;font-size:.84rem;font-weight:750;display:inline-flex;box-shadow:0 8px 18px #17203314}.detector-live-pill span{background:var(--line-strong);border-radius:999px;width:8px;height:8px;margin-right:8px}.detector-live-pill[data-state=listening] span{background:var(--detector-glow);animation:1.4s ease-in-out infinite detector-live-pulse;box-shadow:0 0 0 5px #2fd6bd29}.detector-live-pill[data-state=requesting] span{background:var(--detector-gold);box-shadow:0 0 0 5px #f5bd4f29}.detector-live-pill[data-state=error] span{background:var(--red);box-shadow:0 0 0 5px #b8323221}.detector-control-stack .detector-actions{justify-content:flex-end;margin-bottom:0}.detector-button{justify-content:center;align-items:center;gap:8px;min-width:98px;display:inline-flex}.button-dot{opacity:.92;background:currentColor;border-radius:999px;width:9px;height:9px}.button-primary .button-dot{background:#fff}.button-stop{opacity:.82;background:currentColor;border-radius:2px;width:10px;height:10px}.detector-options{flex-wrap:wrap;align-items:center;gap:14px;margin-bottom:16px;display:flex}.detector-options-panel{background:#f8fbffdb;border:1px solid #aab7c875;border-radius:8px;justify-content:space-between;padding:12px}.detector-option-group{flex-wrap:wrap;align-items:center;gap:10px;display:flex}.detector-option-label{color:var(--muted);text-transform:uppercase;font-size:.78rem;font-weight:760}.tuning-selector{background:#edf2f8;border:1px solid #d8e0ebe6;border-radius:8px;flex-wrap:wrap;gap:4px;padding:3px;display:inline-flex}.tuning-selector button{min-height:34px;box-shadow:none;text-align:center;white-space:nowrap;background:0 0;border:0;border-radius:6px;justify-content:center;align-items:center;padding:8px 10px;transition:color .14s,background .14s,box-shadow .14s,transform .14s;display:inline-flex}.tuning-selector button:hover{transform:translateY(-1px)}.tuning-selector button.is-active{background:#fff;border-color:#0000;box-shadow:0 6px 16px #1720331a}.toggle-control{min-height:38px;color:var(--foreground);background:#fff;border:1px solid #d8e0ebf5;border-radius:999px;align-items:center;gap:9px;padding:6px 9px 6px 7px;font-weight:650;display:inline-flex;position:relative}.toggle-control input{opacity:0;width:1px;height:1px;position:absolute}.toggle-switch{background:#d8e0eb;border-radius:999px;align-items:center;width:38px;height:22px;padding:3px;transition:background .16s,box-shadow .16s;display:inline-flex}.toggle-switch span{background:#fff;border-radius:999px;width:16px;height:16px;transition:transform .16s;display:block;box-shadow:0 3px 8px #17203333}.toggle-control input:checked+.toggle-switch{background:var(--detector-ink)}.toggle-control input:checked+.toggle-switch span{transform:translate(16px)}.toggle-control input:focus-visible+.toggle-switch{box-shadow:0 0 0 3px #265df238}.detector-stage{isolation:isolate;color:#fff;background:linear-gradient(#ffffff09 1px, transparent 1px), linear-gradient(90deg, #ffffff08 1px, transparent 1px), linear-gradient(135deg, var(--detector-ink) 0%, var(--detector-panel) 60%, #242334 100%);background-size:26px 26px,26px 26px,auto;border-radius:8px;grid-template-columns:minmax(0,1.12fr) minmax(260px,.88fr);gap:28px;min-height:282px;margin-bottom:18px;padding:24px;display:grid;position:relative;overflow:hidden;box-shadow:inset 0 1px #ffffff14}.detector-wave-field{z-index:-1;pointer-events:none;position:absolute;inset:0;overflow:hidden}.detector-wave-field span{aspect-ratio:1;opacity:0;border:1px solid #2fd6bd47;border-radius:999px;width:min(58vw,430px);animation:2.6s ease-out infinite detector-wave;position:absolute;top:50%;left:24%;transform:translate(-50%,-50%)scale(.34)}.detector-wave-field span:nth-child(2){animation-delay:.56s}.detector-wave-field span:nth-child(3){animation-delay:1.12s}.detector-console:not(.is-listening) .detector-wave-field span{opacity:.12;animation-play-state:paused}.detected-note-card,.signal-meter,.detector-status{border:1px solid var(--line);background:#f8fbff;border-radius:8px;min-height:170px;padding:16px}.detector-stage .detected-note-card,.detector-stage .signal-meter,.detector-stage .detector-status{color:#fff;background:0 0;border:0;border-radius:0;min-height:auto;padding:0}.detector-stage .detected-note-card{align-content:center;gap:18px;display:grid}.detected-note-main{gap:8px;display:grid}.detected-note-card strong{margin:8px 0 12px;font-size:2rem;line-height:1;display:block}.detector-stage .detected-label{color:var(--detector-glow)}.detector-stage .detected-note-card strong{color:#fff;text-shadow:0 18px 44px #00000052;margin:0;font-size:clamp(4.4rem,12vw,7.4rem);font-weight:820;line-height:.9}.detected-note-main>span{color:#ebf3fbc2;font-size:.94rem;font-weight:680}.detected-note-card.is-stable .detected-note-main>span{color:#c8fff1}.detector-stage .detected-grid{border:0;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px;overflow:visible}.detector-stage .detected-grid div{-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);background:#ffffff12;border:1px solid #ffffff1a;border-radius:8px;min-width:0;padding:10px 12px}.detector-stage .detected-grid span,.detector-stage .signal-meter span,.detector-stage .stability-row span{color:#ebf3fb9e}.detector-stage .detected-grid b,.detector-stage .signal-meter strong,.detector-stage .stability-row strong{color:#fff}.detector-stage-side{align-content:center;gap:18px;display:grid}.signal-meter{align-content:center;gap:10px;display:grid}.meter-readout{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;display:grid}.meter-readout div{gap:3px;display:grid}.stability-row{justify-content:space-between;gap:12px;display:flex}.meter-track{background:#ffffff24;border-radius:999px;height:9px;overflow:hidden}.meter-track span{border-radius:inherit;background:linear-gradient(90deg, var(--detector-glow), #97f3dd);height:100%;transition:width .16s;display:block;box-shadow:0 0 18px #2fd6bd52}.meter-track-secondary span{background:linear-gradient(90deg, var(--detector-gold), #f8e28d);box-shadow:0 0 18px #f5bd4f42}.detector-status{align-content:center;gap:8px;display:grid}.detector-stage .detector-status{border-top:1px solid #ffffff1f;align-content:start;gap:10px;padding-top:18px}.detector-status span{width:fit-content;color:var(--muted);text-transform:capitalize;background:#edf2f8;border-radius:999px;padding:4px 8px;font-weight:720}.detector-stage .detector-status span{color:#fff;background:#ffffff1a}.detector-stage .detector-status p{color:#ebf3fbc2}.detector-status.status-listening span{color:#fff;background:var(--green)}.detector-stage .detector-status.status-listening span{color:var(--detector-ink);background:var(--detector-glow)}.detector-stage .detector-status.status-error{color:#ffd0d0!important;background:0 0!important;border-color:#ffbebe59!important}.detector-stage .detector-status.status-error span{color:#ffd0d0;background:#b8323233}.detector-console .piano-scroll{background:linear-gradient(180deg, #f8fbff, #eef4f9), var(--surface-muted);border-color:#aab7c88f;margin-top:16px}.detector-console .piano-key{transition:transform .14s,box-shadow .14s,background .14s}@media (hover:hover) and (pointer:fine){.detector-console .piano-key:hover:not(:disabled){transform:translateY(-2px)}}.detector-console .piano-key.is-detected{color:var(--detector-ink);background:#ffd76a;animation:1.2s ease-in-out infinite detected-key-pulse;box-shadow:inset 0 0 0 3px #1016243d,0 0 0 6px #f5bd4f26}.detector-console .piano-key-black.is-detected{color:var(--detector-ink);background:#ffd76a}.detector-console .privacy-note{color:var(--muted);background:0 0;margin:12px 0 0;padding:0;font-size:.92rem}@keyframes preview-wave-drift{to{stroke-dashoffset:-64px}}@keyframes scope-dash{to{stroke-dashoffset:-64px}}@keyframes scope-hit{0%,to{opacity:.72;transform:scale(.84)}50%{opacity:1;transform:scale(1.18)}}@keyframes cue-float{0%,to{transform:translateY(0)}50%{transform:translateY(-10px)}}@keyframes spark-pop{0%{opacity:0;transform:translateY(10px)scale(.72)rotate(-4deg)}55%{opacity:1;transform:translateY(-4px)scale(1.08)rotate(2deg)}to{opacity:0;transform:translateY(-18px)scale(.96)rotate(0)}}@keyframes key-pulse{0%,to{box-shadow:0 0 0 4px #ffd86b1f}50%{box-shadow:0 0 0 8px #ffd86b0a}}@keyframes hero-hear-pulse{0%,to{box-shadow:0 14px 28px #3557ff47,0 0 #3557ff33}50%{box-shadow:0 16px 32px #3557ff4d,0 0 0 9px #3557ff14}}@keyframes playing-dot-pulse{0%,to{opacity:.45;transform:scale(.78)}50%{opacity:1;transform:scale(1.12)}}@keyframes wrong-feedback-shake{0%,to{transform:translate(0)}25%{transform:translate(-4px)}55%{transform:translate(3px)}}@keyframes wrong-key-shake{0%,to{transform:translate(0)}30%{transform:translate(-3px)}60%{transform:translate(2px)}}@keyframes console-wave{0%{opacity:0;transform:scale(.42)}25%{opacity:.68}to{opacity:0;transform:scale(1.35)}}@keyframes detector-live-pulse{0%,to{box-shadow:0 0 0 4px #2fd6bd29}50%{box-shadow:0 0 0 8px #2fd6bd0a}}@keyframes detector-wave{0%{opacity:0;transform:translate(-50%,-50%)scale(.34)}20%{opacity:.54}to{opacity:0;transform:translate(-50%,-50%)scale(1.18)}}@keyframes detected-key-pulse{0%,to{box-shadow:inset 0 0 0 3px #1016243d,0 0 0 5px #f5bd4f1f}50%{box-shadow:inset 0 0 0 3px #1016243d,0 0 0 9px #f5bd4f08}}.product-console-page .product-hero{isolation:isolate;background:linear-gradient(#ffffff0a 1px,#0000 1px) 0 0/30px 30px,linear-gradient(90deg,#ffffff09 1px,#0000 1px) 0 0/30px 30px,linear-gradient(#111217 0%,#141b26 52%,#0f1218 100%);border-bottom:1px solid #ffffff14;padding:0 0 24px;position:relative;overflow:hidden}.product-console-page .product-hero:before{z-index:-1;content:"";pointer-events:none;background:linear-gradient(105deg,#3557ff2e,#0000 38%),linear-gradient(250deg,#7ef2d824,#0000 34%);position:absolute;inset:0}.product-console-page .product-hero-layout{z-index:1;gap:13px;min-height:calc(100svh - 72px);padding:18px 0 16px;position:relative}.console-hero-copy{gap:7px;max-width:760px}.console-hero-copy h1{color:#fff;text-wrap:balance;max-width:760px;font-size:clamp(1.75rem,4vw,3.1rem);line-height:.98}.console-hero-copy .eyebrow{color:#7ef2d8}.console-hero-copy p{color:#ebf3fbad;max-width:520px;font-size:.96rem;line-height:1.45}.product-console-stage{gap:12px;width:min(760px,100%);margin:0 auto;display:grid}.product-console-page .product-quick-strip{color:#ebf3fba8;width:100%;margin:0}.product-console-page .product-quick-strip a,.product-console-page .product-quick-strip span{color:#ebf3fbcc;box-shadow:none;-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);background:#fff1;border-color:#ffffff1c}.product-console-page .product-quick-strip strong{color:#fff}.product-console-page .product-continue-chip{color:#ffd86b}.hero-trainer-card{--white-key-width:clamp(52px, 7vw, 64px);--black-key-width:clamp(40px, 4.8vw, 44px);--key-height:clamp(172px, 24vw, 214px);color:#fff;background:linear-gradient(#ffffff14,#ffffff09),#151b26;border-color:#ffffff21;max-width:760px;padding:16px;box-shadow:0 28px 70px #0000005c,inset 0 1px #ffffff14}.hero-trainer-top span{color:#7ef2d8}.hero-trainer-top strong,.hero-trainer-stats strong{color:#fff}.hero-trainer-feedback{color:#fff;background:#0d131df5;border-color:#ffffff1a;box-shadow:inset 0 0 0 1px #ffffff06}.hero-trainer-feedback[data-result=answering]{background:#1a264ec7;border-color:#587bff73}.hero-trainer-feedback[data-result=playing]{background:#0d3431b8;border-color:#7ef2d866}.hero-trainer-feedback[data-result=correct]{color:#c9fff1;background:#124d38b8;border-color:#7ef2d880}.hero-trainer-feedback[data-result=wrong]{color:#ffd5d9;background:#551c27ad;border-color:#ff78857a}.hero-trainer-statusbar{grid-template-columns:repeat(3,minmax(0,1fr));gap:7px;display:grid}.hero-trainer-statusbar span{color:#ebf3fb8f;text-transform:uppercase;background:#ffffff0b;border:1px solid #ffffff17;border-radius:7px;justify-content:center;align-items:center;min-height:30px;font-size:.76rem;font-weight:820;display:inline-flex}.hero-trainer-statusbar span[data-active=true]{color:#111217;background:#ffd86b;border-color:#ffd86b80}.hero-trainer-card .hero-replay-button{color:#f8fbffe0;background:#ffffff14;border-color:#ffffff1f}.hero-trainer-card .piano-scroll,.training-tool-card .piano-scroll,.detector-console .piano-scroll{background:linear-gradient(#ffffff14,#ffffff09),#0d131d;border-color:#ffffff1f;box-shadow:inset 0 1px #ffffff0f}.hero-trainer-stats{border-color:#ffffff1a}.hero-trainer-stats span{background:#ffffff0e;border-color:#ffffff1a}.hero-trainer-stats small{color:#ebf3fb94}.product-console-page .product-mode-panel{max-width:760px;box-shadow:none;-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px);background:#ffffff0e;border-color:#ffffff1a}.product-console-page .mode-switchboard-top{background:#0d131dd1;border-color:#ffffff17;grid-template-columns:minmax(170px,.62fr) minmax(0,1fr)}.product-console-page .mode-switchboard-copy h2,.product-console-page .training-mode-title{color:#fff}.product-console-page .training-mode-card{background:#fff1;border-color:#ffffff1a}.product-console-page .training-mode-card:hover{border-color:var(--mode-accent);background:#ffffff1a;box-shadow:0 18px 34px #00000038}.product-console-page .product-guide-section{color:var(--foreground);background:#f7f8fb}.training-page{color:#f8fbff;background:linear-gradient(#ffffff09 1px,#0000 1px) 0 0/30px 30px,linear-gradient(90deg,#ffffff08 1px,#0000 1px) 0 0/30px 30px,linear-gradient(#111217 0%,#111821 100%)}.training-page .training-header-section{background:#111217f5;border-bottom:1px solid #ffffff14;padding:12px 0}.training-page .training-compact-copy h1{color:#fff;font-size:clamp(1.08rem,2vw,1.42rem)}.training-page .training-compact-copy .eyebrow{color:#7ef2d8}.training-page .back-link{color:#ffd86b;background:#ffffff0f;border:1px solid #ffffff1a;border-radius:7px;align-items:center;min-height:36px;padding:7px 10px}.training-page .tool-section{padding:14px 0 42px}.training-console-wrap{gap:12px;display:grid}.training-console-settings{-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px);background:#ffffff0f;border:1px solid #ffffff1a;border-radius:8px;padding:10px}.training-console-settings .difficulty-selector button,.training-console-settings .settings-static,.training-console-settings .toggle-control{color:#fff;background:#ffffff14;border-color:#ffffff1f}.training-console-settings .difficulty-selector button.is-active{border-color:#ffd86b;box-shadow:inset 0 0 0 1px #ffd86b}.training-console-settings .difficulty-selector span,.training-console-settings .settings-static span{color:#ebf3fb99}.training-console-settings .difficulty-selector strong,.training-console-settings .settings-static strong{color:#fff}.training-tool-card{color:#fff;background:linear-gradient(#ffffff14,#ffffff09),#151b26;border-color:#ffffff21;box-shadow:0 28px 70px #00000057,inset 0 1px #ffffff14}.training-tool-card:before{background:linear-gradient(90deg,#ffd86b,#7ef2d8,#7b55ff)}.training-tool-card .training-card-header h2{color:#fff}.training-tool-card .training-progress{background:#ffffff1f}.training-tool-card .stats-panel{border-color:#ffffff1c}.training-tool-card .stats-panel div{background:#ffffff0f;border-color:#ffffff1a}.training-tool-card .stats-panel span{color:#ebf3fb99}.training-tool-card .stats-panel strong{color:#fff}.training-action-stage{background:#0d131dd1;border:1px solid #ffffff1a;border-radius:8px;justify-content:space-between;align-items:center;gap:14px;min-height:68px;margin-bottom:14px;padding:12px;display:flex}.training-action-stage[data-status=playing]{border-color:#7ef2d857}.training-action-stage[data-status=answering]{border-color:#587bff6b}.training-action-stage[data-status=feedback]{border-color:#ffd86b70}.training-action-hint{color:#fff;margin:0;font-size:clamp(1.02rem,2vw,1.38rem);font-weight:820;line-height:1.2}.training-tool-card .training-controls{flex:none;justify-content:flex-end;margin-bottom:0}.training-tool-card .feedback-panel{color:#fff;box-shadow:none;background:#ffffff0f;border-color:#ffffff1a}.training-tool-card .feedback-panel p{color:#fff}.training-tool-card .feedback-correct{background:#124d389e;border-color:#7ef2d86b}.training-tool-card .feedback-wrong{background:#551c279e;border-color:#ff78856b}.training-tool-card .privacy-note,.training-tool-card .status-strip{color:#ebf3fbb8;background:#ffffff0f;border-color:#ffffff1c}.training-page .learning-section{background:#f7f8fb}.detector-section{padding-top:14px;padding-bottom:42px}.detector-console{color:#fff;background:linear-gradient(#ffffff14,#ffffff09),#151b26;border-color:#ffffff21;box-shadow:0 28px 70px #00000057,inset 0 1px #ffffff14}.detector-console .detector-header{margin-bottom:10px}.detector-intro h2{color:#fff;font-size:clamp(1.28rem,2.3vw,1.7rem)}.detector-intro p{color:#ebf3fba8;line-height:1.35}.detector-live-pill{color:#fff;box-shadow:none;background:#ffffff12;border-color:#ffffff1a}.detector-options-panel{background:#0d131dd1;border-color:#ffffff1a}.detector-option-label,.detector-console .privacy-note{color:#ebf3fb9e}.detector-options-panel .toggle-control,.detector-options-panel .tuning-selector{color:#fff;background:#ffffff14;border-color:#ffffff1f}.detector-options-panel .tuning-selector button{color:#ebf3fbc7}.detector-options-panel .tuning-selector button.is-active{color:#111217;background:#ffd86b}.detector-stage{min-height:220px;margin-bottom:14px;padding:20px}.detector-stage .detected-note-card strong{font-size:clamp(3.7rem,9vw,6.2rem)}.site-header{color:#111217;-webkit-backdrop-filter:blur(18px);backdrop-filter:blur(18px);background:#fffffff0;border-bottom:1px solid #1112171a}.site-nav{min-height:64px}.site-brand strong{color:#111217;font-weight:900}.site-brand-mark{box-shadow:none;background:#ffd72f;border-color:#111217;border-radius:999px}.site-nav-links a{color:#111217a3}.site-nav-links a:hover{color:#111217;background:#1112170f}.site-nav-cta{color:#111217;min-width:86px;box-shadow:none;background:#ffd72f;border:2px solid #111217;border-radius:8px}.site-nav-cta:hover{background:#ffe57a}.product-console-page{color:#111217;background:#f4f0e8}.product-console-page .product-hero{background:linear-gradient(#ffffffe0,#f4f0e8eb),#f4f0e8;border-bottom:1px solid #1112171a;padding:0 0 28px}.product-console-page .product-hero:before{display:none}.product-console-page .product-hero-layout{justify-content:start;gap:20px;min-height:calc(100svh - 64px);padding:0 0 22px}.lesson-hero-player{grid-template-columns:minmax(0,1.1fr) minmax(360px,.72fr);align-items:center;gap:28px;width:100%;min-height:min(720px,100svh - 118px);display:grid}.lesson-hero-media{isolation:isolate;background:linear-gradient(110deg,#fffffff5 0%,#ffffffb8 42%,#ecf0ec85 100%),radial-gradient(circle at 18% 72%,#ffd72f38,#0000 32%),linear-gradient(135deg,#f7f4ed 0%,#eff4f2 100%);border:1px solid #11121717;border-radius:8px;min-height:min(690px,100svh - 112px);position:relative;overflow:hidden;box-shadow:0 28px 70px #1112171f}.lesson-hero-media:before{content:"";display:none}.lesson-player-visual{width:min(74%,640px);min-width:420px;position:absolute;top:36px;right:-60px;transform:rotate(-2deg)}.lesson-player-screen{background:linear-gradient(#7ef2d814 1px,#0000 1px) 0 0/30px 30px,linear-gradient(90deg,#7ef2d80f 1px,#0000 1px) 0 0/30px 30px,linear-gradient(145deg,#141822,#202431 60%,#241f28);border:10px solid #111217e0;border-radius:8px;height:clamp(270px,34vw,410px);position:relative;overflow:hidden;box-shadow:0 28px 70px #11121747}.lesson-lane{background:#ffffff29;width:1px;position:absolute;top:0;bottom:28%}.lesson-lane-1{left:28%}.lesson-lane-2{left:52%}.lesson-lane-3{left:73%}.falling-note{background:#7ef2d8d1;border-radius:7px;width:22px;height:92px;animation:4.2s linear infinite lesson-note-drop;position:absolute;box-shadow:0 0 22px #7ef2d85c}.falling-note-a{animation-delay:-900ms;left:27%}.falling-note-b{background:#6987ffcc;height:128px;animation-delay:-2300ms;left:50%;box-shadow:0 0 22px #6987ff52}.falling-note-c{height:74px;animation-delay:-1600ms;left:61%}.falling-note-d{background:#ffd86bdb;height:118px;animation-delay:-3100ms;left:73%;box-shadow:0 0 22px #ffd86b52}.falling-note-e{height:82px;animation-delay:-400ms;left:84%}.lesson-player-keyboard{background:#10131b;border-top:1px solid #fff3;grid-template-columns:repeat(14,minmax(0,1fr));height:30%;display:grid;position:absolute;bottom:0;left:0;right:0}.lesson-player-keyboard span{background:linear-gradient(#fff,#eceef1);border-right:1px solid #c6c9ce}.lesson-player-keyboard i{background:#111217;border-radius:0 0 5px 5px;width:4.9%;height:63%;position:absolute;top:0;box-shadow:0 9px 18px #00000059}.lesson-player-keyboard i:first-of-type{left:8%}.lesson-player-keyboard i:nth-of-type(2){left:15%}.lesson-player-keyboard i:nth-of-type(3){left:29%}.lesson-player-keyboard i:nth-of-type(4){left:36%}.lesson-player-keyboard i:nth-of-type(5){left:43%}.lesson-player-keyboard i:nth-of-type(6){left:58%}.lesson-player-keyboard i:nth-of-type(7){left:65%}.lesson-player-keyboard i:nth-of-type(8){left:79%}.lesson-player-keyboard i:nth-of-type(9){left:86%}.lesson-player-keyboard i:nth-of-type(10){left:93%}.lesson-player-caption{color:#111217a3;justify-content:space-between;align-items:center;gap:12px;margin-top:10px;padding:0 10px;font-weight:760;display:flex}.lesson-player-caption strong{color:#111217}.lesson-hero-media .console-hero-copy{text-align:left;justify-items:start;max-width:620px;display:grid;position:absolute;bottom:74px;left:40px;right:36px}.lesson-hero-media .console-hero-copy h1{color:#111217;text-transform:uppercase;font-size:clamp(3rem,7vw,5.4rem);font-weight:920;line-height:.92}.lesson-hero-media .console-hero-copy .eyebrow{color:#111217}.lesson-hero-media .console-hero-copy p{color:#111217b8;max-width:460px;font-size:1rem;font-weight:700;line-height:1.34}.lesson-watch-button{z-index:2;color:#111217;background:#ffd72f;border:2px solid #111217;border-radius:8px;justify-content:center;align-items:center;gap:10px;min-height:50px;padding:12px 24px;font-weight:880;display:inline-flex;position:absolute;top:53%;left:50%;transform:translate(-50%,-50%);box-shadow:0 16px 36px #11121724}.lesson-watch-button span{text-transform:uppercase;border-left:1px solid #11121738;padding-left:8px;font-size:.72rem}.lesson-hero-player .product-console-stage{width:100%;max-width:520px;margin:0}.lesson-hero-player .hero-trainer-card{border-color:#11121729;max-width:520px;box-shadow:0 30px 80px #11121738}.lesson-songbook{width:100%;max-width:none;box-shadow:none;-webkit-backdrop-filter:none;backdrop-filter:none;background:0 0;border:0;margin:0}.product-console-page .lesson-songbook .mode-switchboard-top{background:#ffffffb8;border-color:#1112171a;grid-template-columns:minmax(220px,.34fr) minmax(0,1fr)}.product-console-page .lesson-songbook .mode-switchboard-copy h2,.product-console-page .lesson-songbook .training-mode-title{color:#111217}.lesson-songbook .training-mode-grid{grid-template-columns:repeat(5,minmax(0,1fr));gap:10px;display:grid}.product-console-page .lesson-songbook .training-mode-card{color:#111217;background:#ffffffc7;border-color:#1112171f;place-content:start stretch;justify-items:start;gap:6px;min-width:0;min-height:132px;padding:14px;display:grid}.product-console-page .lesson-songbook .training-mode-card:before{border-radius:999px;width:22px;height:4px}.training-mode-kicker{color:#1112178f;text-transform:uppercase;font-size:.72rem;font-weight:850}.lesson-songbook .training-mode-description{color:#1112179e;font-size:.84rem;line-height:1.32}.lesson-songbook .training-mode-action{color:#111217;margin-top:auto;font-size:.82rem}.practice-workbench{isolation:isolate;background:linear-gradient(#ffffff09 1px,#0000 1px) 0 0/32px 32px,linear-gradient(90deg,#ffffff08 1px,#0000 1px) 0 0/32px 32px,linear-gradient(155deg,#090b10 0%,#151010 40%,#10181a 68%,#0c0d12 100%);min-height:calc(100svh - 72px);padding:clamp(18px,3vw,34px) 0;position:relative;overflow:hidden}.practice-workbench:before{z-index:-1;content:"";pointer-events:none;background:linear-gradient(105deg,#f3c96929,#0000 34%),linear-gradient(245deg,#58dfc71f,#0000 32%),linear-gradient(#0000 60%,#0000005c);position:absolute;inset:0}.practice-workbench-layout{grid-template-columns:minmax(0,1fr) minmax(280px,340px);align-items:stretch;gap:clamp(16px,2.6vw,28px);display:grid}.studio-stage,.studio-side-panel{-webkit-backdrop-filter:blur(18px);backdrop-filter:blur(18px);background:linear-gradient(#ffffff13,#ffffff08),#080a0fdb;border:1px solid #ffffff1f;border-radius:8px;box-shadow:0 30px 90px #00000057,inset 0 1px #ffffff17}.studio-stage{gap:12px;min-width:0;padding:clamp(14px,2vw,22px);display:grid}.studio-stage-header{justify-content:space-between;align-items:start;gap:14px;display:flex}.studio-stage-header h1{color:#fff;margin-top:4px;font-size:clamp(1.45rem,2.6vw,2.35rem);line-height:1.18}.studio-stage-header .eyebrow,.studio-side-panel .eyebrow{color:#58dfc7}.studio-live-pill{color:#ebf7f5d1;background:#58dfc714;border:1px solid #58dfc747;border-radius:999px;flex:none;align-items:center;gap:8px;min-height:34px;padding:8px 10px;font-size:.78rem;font-weight:820;display:inline-flex}.studio-live-pill span{background:#58dfc7;border-radius:999px;width:8px;height:8px;box-shadow:0 0 0 5px #58dfc71f}.practice-workbench .product-quick-strip{justify-content:flex-start}.practice-workbench .product-quick-strip a,.practice-workbench .product-quick-strip span{color:#f5f8fbcc;background:#ffffff0e;border-color:#ffffff1f}.practice-workbench .product-quick-strip strong{color:#fff}.practice-workbench .product-continue-chip{color:#f3c969}.practice-workbench .hero-trainer-card{--white-key-width:clamp(58px, 6.4vw, 74px);--black-key-width:clamp(40px, 4vw, 46px);--key-height:clamp(164px, 21vw, 206px);background:linear-gradient(#ffffff17,#ffffff09),#111620;border-color:#ffffff24;gap:10px;max-width:none;min-height:100%;padding:clamp(12px,1.7vw,18px);box-shadow:0 24px 70px #00000052,inset 0 1px #ffffff14}.practice-workbench .hero-trainer-top{align-items:start}.practice-workbench .hero-trainer-top div,.hero-status-readout{gap:3px;display:grid}.practice-workbench .hero-trainer-top span,.hero-status-readout small{color:#ebf7f594;text-transform:uppercase;font-size:.72rem;font-weight:820}.practice-workbench .hero-trainer-top strong,.hero-status-readout strong{color:#fff;font-size:1rem}.hero-status-readout{text-align:right;justify-items:end}.hero-sound-stage{background:linear-gradient(#58dfc70f 1px,#0000 1px) 0 0/22px 22px,linear-gradient(90deg,#58dfc70b 1px,#0000 1px) 0 0/22px 22px,linear-gradient(#0c1219cc,#07090df0);border:1px solid #ffffff1a;border-radius:8px;align-items:center;min-height:clamp(88px,12vw,124px);display:grid;position:relative;overflow:hidden}.hero-sound-stage:before{content:"";background:linear-gradient(90deg,#0000,#f3c96947,#0000),#ffffff0a;height:36px;position:absolute;bottom:0;left:0;right:0}.hero-scope-line{opacity:.78;transform-origin:50%;background:linear-gradient(90deg,#0000,#58dfc7d1,#0000);border-radius:999px;height:2px;animation:2.2s ease-in-out infinite hero-scope-scan;position:absolute;left:7%;right:7%;box-shadow:0 0 18px #58dfc747}.hero-scope-line-a{top:36%}.hero-scope-line-b{background:linear-gradient(90deg,#0000,#f3c969d1,#0000);animation-delay:.36s;top:52%}.hero-scope-line-c{background:linear-gradient(90deg,#0000,#ff6b5da3,#0000);animation-delay:.72s;top:68%}.hero-sound-node{background:#f3c969;border:1px solid #ffffff2e;border-radius:6px;width:44px;height:18px;animation:2.6s ease-in-out infinite hero-note-lift;position:absolute;bottom:22px;box-shadow:0 12px 28px #00000052}.hero-sound-node-a{left:18%}.hero-sound-node-b{background:#58dfc7;width:36px;animation-delay:.44s;left:48%}.hero-sound-node-c{background:#ff6b5d;width:40px;animation-delay:.88s;left:72%}.practice-workbench .hero-trainer-statusbar{gap:9px}.practice-workbench .hero-trainer-statusbar span{color:#f5f8fb9e;background:#ffffff0e;border-color:#ffffff1c;min-height:32px}.practice-workbench .hero-trainer-statusbar span[data-active=true]{color:#111217;background:#f3c969;border-color:#f3c969b3}.practice-workbench .hero-trainer-feedback{background:#06080cd1;border-color:#ffffff1c;min-height:48px}.practice-workbench .hero-trainer-card .hero-hear-button{color:#111217;background:linear-gradient(135deg,#f3c969,#58dfc7);min-height:52px;box-shadow:0 16px 34px #f3c9692e,0 12px 28px #58dfc71f}.practice-workbench .hero-trainer-card .hero-hear-button:hover:not(:disabled){background:linear-gradient(135deg,#ffe08a,#7df5df)}.practice-workbench .hero-trainer-card .hero-replay-button{color:#f5f8fbe0;background:#ffffff13;border-color:#ffffff24;min-width:112px}.practice-workbench .hero-trainer-card .piano-scroll{background:linear-gradient(#ffffff14,#ffffff08),#080b10;border-color:#ffffff21;padding:14px clamp(10px,2vw,16px) 16px;overflow-x:auto}.practice-workbench .home-octave-keyboard .piano-frame{width:min(100%, calc(7 * var(--white-key-width)))!important}.practice-workbench .home-octave-keyboard .piano-key-white{background:linear-gradient(#fffdf7 0%,#e7ebee 82%,#cfd5dc 100%);border-color:#c3cad3e6;box-shadow:inset 0 -10px 14px #0000001a,inset 0 1px #ffffffd9}.practice-workbench .home-octave-keyboard .piano-key-black{background:linear-gradient(#2d3039 0%,#11131a 58%,#050609 100%);border-color:#ffffff14;box-shadow:0 13px 20px #0000006b,inset 0 1px #ffffff1f}.practice-workbench .home-octave-keyboard .note-label{font-size:.8rem;font-weight:880}@media (hover:hover) and (pointer:fine){.practice-workbench .piano-key:hover:not(:disabled){filter:saturate(1.08);transform:translateY(3px)}}.practice-workbench .piano-key.is-selected,.practice-workbench .piano-key.is-detected{box-shadow:inset 0 0 0 3px #11121757,0 0 0 6px #f3c96929,0 0 28px #f3c96947}.practice-workbench .piano-key.is-correct{color:#10211d;background:linear-gradient(#7df5df,#42c6af);box-shadow:inset 0 0 0 3px #fff6,0 0 0 6px #58dfc726,0 0 32px #58dfc752}.practice-workbench .piano-key.is-wrong{background:linear-gradient(#ff8a7f,#d94d4a);box-shadow:inset 0 0 0 3px #ffffff57,0 0 0 6px #ff6b5d21,0 0 30px #ff6b5d42}.practice-workbench .hero-trainer-stats{border-color:#ffffff1c}.practice-workbench .hero-trainer-stats span{background:linear-gradient(#ffffff12,#ffffff09),#ffffff09;border-color:#ffffff1a}.practice-workbench .hero-trainer-stats small{color:#f5f8fb8f}.studio-side-panel{align-self:start;gap:12px;padding:14px;display:grid}.studio-side-panel .mode-switchboard-top{background:0 0;border:0;grid-template-columns:1fr;gap:10px;padding:0}.studio-side-panel .mode-keyboard-preview{background:#07090d;border:1px solid #ffffff1c;height:68px}.studio-side-panel .mode-switchboard-copy h2,.studio-side-panel .training-mode-title{color:#fff}.studio-side-panel .training-mode-grid{grid-template-columns:1fr;gap:9px;display:grid}.studio-side-panel .training-mode-card{color:#f5f8fbc2;min-width:0;min-height:68px;box-shadow:none;background:#ffffff0e;border-color:#ffffff1a;grid-template-columns:auto minmax(0,1fr) auto;justify-content:stretch;align-items:center;gap:4px 10px;padding:12px;display:grid}.studio-side-panel .training-mode-card:before{border-radius:999px;grid-row:1/span 2;width:5px;height:32px}.studio-side-panel .training-mode-card:hover{border-color:color-mix(in srgb, var(--mode-accent) 70%, #fff 15%);background:#ffffff16;box-shadow:0 16px 36px #0000002e}.studio-side-panel .training-mode-kicker{color:#f5f8fb80;grid-column:2}.studio-side-panel .training-mode-title{grid-column:2;font-size:.95rem}.studio-side-panel .training-mode-description{color:#f5f8fb9e;grid-column:2;font-size:.82rem;line-height:1.28}.studio-side-panel .training-mode-action{color:#f3c969;grid-area:1/3/span 2;align-self:center}@keyframes hero-scope-scan{0%,to{opacity:.4;transform:scaleX(.68)}50%{opacity:.92;transform:scaleX(1)}}@keyframes hero-note-lift{0%,to{opacity:.48;transform:translateY(16px) rotate(var(--note-tilt,0deg)) scale(.88)}46%{opacity:.95;transform:translateY(-42px) rotate(calc(var(--note-tilt,0deg) + 7deg)) scale(1.08)}}@keyframes hero-staff-breathe{0%,to{opacity:.32;transform:scaleX(.84)}50%{opacity:.7;transform:scaleX(1)}}@keyframes dancing-note-bounce{0%,to{opacity:.22;transform:translate3d(0, 20px, 0) rotate(var(--note-rotate)) scale(.88)}18%{opacity:.72}48%{opacity:.9;transform:translate3d(0, -22px, 0) rotate(calc(var(--note-rotate) + 7deg)) scale(1.08)}76%{opacity:.44;transform:translate3d(0, 4px, 0) rotate(var(--note-rotate)) scale(.96)}}@keyframes dancing-beat-pulse{0%{opacity:0;transform:scale(.58)}18%{opacity:.62}to{opacity:0;transform:scale(1.34)}}@keyframes dancing-staff-drift{0%,to{transform:translate3d(-1.5%, 0, 0) rotate(var(--staff-tilt))}50%{transform:translate3d(1.5%, -8px, 0) rotate(calc(var(--staff-tilt) + 1deg))}}@media (max-width:980px){.practice-workbench-layout{grid-template-columns:1fr}.studio-side-panel{align-self:stretch}.studio-side-panel .mode-switchboard-top{grid-template-columns:minmax(170px,.4fr) minmax(0,1fr);align-items:center}.studio-side-panel .training-mode-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}@media (max-width:700px){.site-header{background:#0d0f14f0}.practice-workbench{min-height:calc(100svh - 58px);padding:10px 0 18px}.practice-workbench-layout{gap:10px}.studio-stage,.studio-side-panel{padding:10px}.studio-stage-header{display:grid}.studio-stage-header h1{font-size:1.28rem}.studio-live-pill{width:fit-content}.practice-workbench .product-quick-strip{gap:6px}.practice-workbench .hero-trainer-card{--white-key-width:clamp(52px, 13vw, 60px);--black-key-width:clamp(40px, 8vw, 44px);--key-height:clamp(134px, 37vw, 158px);padding:10px}.hero-sound-stage{min-height:76px}.hero-sound-node{width:34px;height:15px;bottom:20px}.practice-workbench .hero-trainer-actions{grid-template-columns:1fr}.practice-workbench .hero-trainer-card .hero-replay-button{min-width:0}.practice-workbench .hero-trainer-card .piano-scroll{padding:12px 6px 16px}.studio-side-panel .mode-switchboard-top,.studio-side-panel .training-mode-grid{grid-template-columns:1fr}.studio-side-panel .mode-keyboard-preview{height:54px}.studio-side-panel .training-mode-card{min-height:62px}}@keyframes lesson-note-drop{0%{opacity:0;transform:translateY(-150%)}12%{opacity:1}78%{opacity:1}to{opacity:0;transform:translateY(330%)}}@media (max-width:920px){.site-nav{flex-wrap:wrap;min-height:auto;padding:12px 0}.site-nav-links{flex:0 0 100%;order:3;justify-content:flex-start;width:100%;max-width:100%;padding-bottom:2px;overflow-x:auto}.site-footer-inner{grid-template-columns:repeat(2,minmax(0,1fr))}.site-footer-brand{grid-column:1/-1}.product-hero-layout,.practice-info-grid{grid-template-columns:1fr}.note-preview-panel{max-width:560px}.hero-trainer-card{max-width:640px}.training-mode-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.product-section-heading{align-items:start;display:grid}.game-hero-grid,.loop-grid{grid-template-columns:1fr}.quest-console{max-width:560px}.mission-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.hero-grid,.training-card-header,.detector-header{grid-template-columns:1fr}.training-compact-copy{grid-template-columns:1fr;gap:10px}.training-compact-copy .back-link{width:fit-content}.detector-control-stack{justify-items:start}.detector-control-stack .detector-actions{justify-content:flex-start}.detector-stage{grid-template-columns:1fr}.detector-stage .detected-grid,.mode-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.stats-panel{width:100%}.lesson-hero-player{grid-template-columns:1fr;min-height:auto;padding-top:16px}.lesson-hero-media{min-height:600px}.lesson-hero-player .product-console-stage{max-width:680px;margin:0 auto}.lesson-songbook .training-mode-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}@media (max-width:700px){:root{--white-key-width:58px;--black-key-width:40px;--key-height:164px}html{scroll-padding-top:124px}.site-nav{flex-wrap:nowrap;justify-content:space-between;gap:10px;width:min(100vw - 22px,1180px)}.site-brand{gap:8px}.site-brand-mark{width:34px}.site-brand strong{font-size:.9rem}.site-brand small,.site-nav-links{display:none}.site-nav-links a{min-height:34px;padding:8px 9px;font-size:.84rem}.site-nav-cta{min-height:34px;padding:8px 12px;font-size:.86rem}.site-footer-inner,.site-footer-bottom,.legal-document{width:min(100vw - 22px,1180px)}.site-footer-inner{grid-template-columns:1fr;gap:24px;padding:30px 0 24px}.site-footer-bottom{display:grid}.legal-hero{padding:42px 0 30px}.legal-content{padding:30px 0 48px}.legal-document article{padding:18px}.content-wrap{width:min(100vw - 22px,1120px)}.product-shell{width:min(100vw - 22px,1180px)}.product-hero{padding:0 0 28px}.product-hero-layout{gap:12px;min-height:calc(100svh - 58px);padding:18px 0 16px}.product-copy h1{font-size:1.12rem}.product-copy .eyebrow{font-size:.68rem}.product-lead{margin-top:14px;font-size:1rem;line-height:1.5}.product-actions{margin-top:18px}.product-stat-row{grid-template-columns:repeat(3,minmax(0,1fr));gap:7px;margin-top:14px}.product-stat-row span{padding:8px}.product-stat-row strong{font-size:1.1rem}.product-stat-row small{font-size:.72rem}.product-quick-strip{gap:6px}.product-quick-strip a,.product-quick-strip span{min-height:32px;padding:7px 8px}.note-preview-panel{padding:12px}.hero-trainer-card{--white-key-width:clamp(52px, 14vw, 60px);--black-key-width:clamp(40px, 8vw, 44px);--key-height:clamp(148px, 43vw, 178px);padding:12px}.hero-trainer-actions{gap:8px}.hero-trainer-card .hero-hear-button{min-height:56px}.hero-trainer-card .hero-replay-button{min-width:104px}.preview-wave{min-height:104px}.preview-keybed{height:56px}.product-mode-panel{margin:0 auto;padding:10px}.mode-switchboard-top{grid-template-columns:minmax(160px,.8fr) minmax(0,1fr);gap:8px}.mode-switchboard-copy{text-align:left}.mode-switchboard-top .mode-keyboard-preview{height:50px}.training-mode-grid,.practice-info-grid{grid-template-columns:1fr}.training-mode-card{flex-basis:calc(50% - 4px);min-height:auto;padding:10px}.mode-keyboard-preview{height:58px}.mode-black-key{height:34px}.product-section{padding:34px 0}.practice-info-panel{padding:18px}.practice-step-list article{grid-template-columns:38px minmax(0,1fr);padding:12px}.practice-step-list article>span{width:34px;height:34px}.game-shell{width:min(100vw - 22px,1180px)}.game-hero{min-height:auto;padding:28px 0 14px}.game-copy h1{font-size:2.38rem}.game-lead{margin-top:14px;font-size:.98rem;line-height:1.5}.game-actions{margin-top:20px}.game-score-strip{grid-template-columns:repeat(3,minmax(0,1fr));gap:7px;margin-top:12px}.game-score-strip span{padding:8px}.game-score-strip strong{font-size:1.2rem}.game-score-strip small{font-size:.72rem}.game-hero-grid{gap:18px}.quest-console{padding:8px}.console-top{min-height:34px;padding-bottom:7px}.game-section{padding:34px 0}.mission-grid{grid-template-columns:1fr}.game-heading{align-items:start;display:grid}.sound-arena{min-height:124px}.cue-note{width:50px;height:50px;font-size:.92rem}.cue-note-c{top:calc(50% - 25px);left:calc(50% - 25px)}.combo-spark{top:18px;right:18px}.console-keybed{height:52px;margin-top:7px}.fever-panel{gap:7px;margin-top:7px;padding:7px}.training-status-rack,.mission-status-rack{grid-template-columns:1fr}.mission-card{min-height:220px}.loop-panel,.boss-panel{padding:18px}.loop-steps article{grid-template-columns:38px minmax(0,1fr);padding:12px}.loop-steps article>span{width:36px;height:36px}.hero-section{padding:42px 0 28px}.training-header-compact{padding:14px 0}.training-compact-copy h1{font-size:1.72rem}.training-compact-copy>p:not(.eyebrow){font-size:.92rem}h1{font-size:2.15rem}.lead{font-size:1rem}.mode-grid,.faq-grid,.learning-grid,.difficulty-selector,.stats-panel,.summary-grid,.detected-grid{grid-template-columns:1fr}.settings-row{padding-top:18px;display:grid}.settings-row .difficulty-selector,.settings-row .toggle-control,.settings-static{width:100%}.stats-panel div,.summary-grid div,.detected-grid div{border-right:0;border-bottom:1px solid var(--line)}.stats-panel div:last-child,.summary-grid div:last-child,.detected-grid div:last-child{border-bottom:0}.training-card,.detector-card,.mode-card,.learning-block,.faq-grid article{padding:16px}.learning-disclosure summary{grid-template-columns:minmax(0,1fr) 30px;gap:8px;display:grid}.learning-disclosure summary strong{grid-column:1}.learning-disclosure summary:after{grid-area:1/2/span 2}.detector-stage{min-height:auto;padding:18px}.detector-wave-field span{width:420px;left:50%}.detector-options-panel,.detector-option-group{align-items:stretch}.detector-option-group,.tuning-selector{width:100%}.tuning-selector button{flex:1 1 0;min-width:0;font-size:.9rem}.toggle-control{justify-content:space-between;width:100%}.detector-stage .detected-note-card strong{font-size:clamp(3.3rem,23vw,5.4rem)}.detector-stage .detected-grid,.meter-readout{grid-template-columns:1fr}.training-controls,.detector-actions{align-items:stretch}.training-controls .button,.detector-actions .button{flex:140px}.product-console-page .product-hero-layout{gap:10px;min-height:calc(100svh - 58px);padding:12px 0 14px}.console-hero-copy h1{font-size:clamp(1.72rem,10vw,2.5rem)}.console-hero-copy p{max-width:330px;font-size:.9rem;line-height:1.38}.product-console-stage{gap:10px}.product-console-page .mode-switchboard-top{grid-template-columns:1fr}.product-console-page .mode-switchboard-copy{text-align:center}.hero-trainer-statusbar span{min-height:28px;font-size:.7rem}.training-page .training-header-section{padding:10px 0}.training-page .training-compact-copy h1{font-size:1.12rem}.training-console-settings{gap:8px;padding:8px}.training-action-stage{align-items:stretch;gap:10px;display:grid}.training-action-hint{text-align:center;font-size:1.04rem}.training-tool-card .training-controls{justify-content:stretch}.detector-intro h2{font-size:1.24rem}.detector-stage{min-height:auto;margin-bottom:12px}.site-header{background:#fffffff5}.lesson-hero-player{gap:12px;padding-top:10px}.lesson-hero-media{min-height:520px}.lesson-hero-media:before{opacity:.76;width:66%}.lesson-player-visual{width:118%;min-width:520px;top:28px;right:-132px}.lesson-player-screen{border-width:8px;height:260px}.lesson-player-caption{display:none}.lesson-hero-media .console-hero-copy{bottom:52px;left:20px;right:20px}.lesson-hero-media .console-hero-copy h1{font-size:clamp(2.35rem,13vw,3.4rem)}.lesson-hero-media .console-hero-copy p{max-width:300px;font-size:.9rem}.lesson-watch-button{white-space:nowrap;min-height:44px;padding:10px 16px;top:49%}.lesson-songbook{padding:8px}.product-console-page .lesson-songbook .mode-switchboard-top,.lesson-songbook .training-mode-grid{grid-template-columns:1fr}.product-console-page .lesson-songbook .training-mode-card{min-height:104px}body .site-header{background:#0d0f14f0}}body .site-header{color:#f8fbff;background:#0c0e13f0;border-bottom:1px solid #ffffff1a}body .site-brand strong{color:#fff}body .site-brand-mark{background:linear-gradient(135deg,#f3c969,#58dfc7);border-color:#fff3;border-radius:8px}body .site-nav-links a{color:#f8fbffad}body .site-nav-links a:hover{color:#fff;background:#ffffff14}body .site-nav-cta{color:#111217;background:#f3c969;border:1px solid #ffffff24}body .site-nav-cta:hover{background:#ffe08a}.immersive-home{background:#07080c}.site-frame:has(.immersive-home) .site-header{display:none}.site-frame:has(.immersive-home) .immersive-piano-shell{min-height:100svh}.site-frame:has(.immersive-home) .immersive-piano-console{min-height:calc(100svh - 24px)}.immersive-piano-shell{isolation:isolate;background:radial-gradient(circle at 18% 18%,#58dfc729,#0000 28%),radial-gradient(circle at 82% 8%,#f3c9691f,#0000 30%),radial-gradient(at 52% 82%,#2a4c5f57,#0000 42%),linear-gradient(#10141b 0%,#07090f 52%,#030304 100%);min-height:calc(100svh - 72px);padding:10px 0 14px;position:relative;overflow:hidden}.immersive-piano-shell:before{z-index:0;content:"";opacity:.92;pointer-events:none;background:linear-gradient(115deg,#7df5df1a,#0000 42%),linear-gradient(255deg,#f3c96914,#0000 36%),radial-gradient(at 50% 115%,#0000009e,#0000 54%);position:absolute;inset:0}.immersive-piano-console{z-index:1;isolation:isolate;grid-template-rows:auto minmax(0,1fr);gap:10px;width:min(100vw - 20px,1760px);min-height:calc(100svh - 96px);display:grid;position:relative}.dancing-notes-backdrop{z-index:0;opacity:.86;pointer-events:none;border-radius:10px;position:absolute;inset:-10px -8px;overflow:hidden}.dancing-notes-backdrop:before,.dancing-notes-backdrop:after{content:"";pointer-events:none;position:absolute;inset:0}.dancing-notes-backdrop:before{opacity:.72;background:linear-gradient(90deg,#0000,#7df5df14,#0000),radial-gradient(circle at 50% 46%,#7df5df1a,#0000 28%)}.dancing-notes-backdrop:after{background:linear-gradient(#ffffff09,#0000 18% 68%,#0000006b),radial-gradient(circle at 68% 28%,#f3c9691a,#0000 24%)}.dancing-staff{--staff-tilt:-3deg;opacity:.34;transform:rotate(var(--staff-tilt));gap:10px;animation:13s ease-in-out infinite dancing-staff-drift;display:grid;position:absolute;left:3%;right:3%}.dancing-staff span{background:linear-gradient(90deg,#0000,#d3fff794,#0000);height:1px;display:block;box-shadow:0 0 16px #58dfc71f}.dancing-staff-a{top:18%}.dancing-staff-b{--staff-tilt:2.5deg;opacity:.24;transform:rotate(var(--staff-tilt));animation-delay:-5.8s;top:47%}.dancing-beat{aspect-ratio:1;filter:blur(.1px);opacity:0;background:radial-gradient(circle,#7df5df1f,#0000 62%);border:1px solid #7df5df29;border-radius:50%;width:clamp(78px,10vw,180px);animation:4.8s ease-out infinite dancing-beat-pulse;position:absolute}.dancing-beat-a{top:35%;left:8%}.dancing-beat-b{background:radial-gradient(circle,#f3c9691f,#0000 62%);border-color:#f3c96926;animation-delay:-1.8s;top:20%;right:18%}.dancing-beat-c{animation-delay:-3.1s;bottom:18%;left:54%}.dancing-note{left:var(--note-left);top:var(--note-top);color:#d3fff7a3;font-family:Georgia,Times New Roman,serif;font-size:var(--note-size);text-shadow:0 0 18px #58dfc747,0 10px 26px #00000052;transform-origin:50% 70%;animation:dancing-note-bounce var(--note-speed) cubic-bezier(.2, .78, .28, 1) infinite;animation-delay:var(--note-delay);line-height:1;position:absolute}.dancing-note-a{--note-left:9%;--note-top:20%;--note-size:clamp(1.7rem, 4.4vw, 5.2rem);--note-speed:4.6s;--note-delay:-.6s;--note-rotate:-12deg}.dancing-note-b{--note-left:21%;--note-top:56%;--note-size:clamp(1.35rem, 3vw, 3.7rem);--note-speed:5.4s;--note-delay:-2.2s;--note-rotate:9deg;color:#f3c96975}.dancing-note-c{--note-left:42%;--note-top:14%;--note-size:clamp(1.4rem, 3.5vw, 4.4rem);--note-speed:4.9s;--note-delay:-3s;--note-rotate:4deg}.dancing-note-d{--note-left:72%;--note-top:42%;--note-size:clamp(1.6rem, 4vw, 4.9rem);--note-speed:5.8s;--note-delay:-1.4s;--note-rotate:-7deg;color:#7df5df85}.dancing-note-e{--note-left:84%;--note-top:17%;--note-size:clamp(1.25rem, 2.8vw, 3.4rem);--note-speed:5s;--note-delay:-3.7s;--note-rotate:12deg;color:#ffffff57}.dancing-note-f{--note-left:57%;--note-top:67%;--note-size:clamp(1.1rem, 2.6vw, 3rem);--note-speed:6.1s;--note-delay:-4.2s;--note-rotate:-4deg;color:#f3c96966}.immersive-console-topbar{z-index:2;-webkit-backdrop-filter:blur(18px);backdrop-filter:blur(18px);background:linear-gradient(#ffffff16,#ffffff0b),#161b24e0;border:1px solid #ffffff1c;border-radius:8px;grid-template-columns:minmax(250px,.95fr) minmax(0,1.4fr) minmax(190px,.55fr);align-items:center;gap:18px;min-height:86px;padding:10px 18px;display:grid;position:relative;box-shadow:0 22px 70px #0000005c,inset 0 1px #ffffff14}.immersive-console-brand{align-items:center;gap:12px;min-width:0;display:inline-flex}.immersive-brand-mark{aspect-ratio:1;background:linear-gradient(135deg,#f3c969 0 46%,#0000 46%),linear-gradient(315deg,#58dfc7 0 46%,#252a34 46%);border:1px solid #ffffff2e;border-radius:8px;flex:none;width:48px;position:relative;box-shadow:0 14px 30px #00000047}.immersive-brand-mark:after{content:"";background:#fff;border-radius:999px;width:16px;height:5px;position:absolute;bottom:9px;right:9px;box-shadow:-12px -12px 0 -1px #ffffffe6}.immersive-console-brand strong,.immersive-console-brand small{display:block}.immersive-console-brand strong{color:#fff;text-transform:uppercase;font-size:clamp(1rem,1.5vw,1.34rem);font-weight:920;line-height:1}.immersive-console-brand small{color:#58dfc7;letter-spacing:0;text-transform:uppercase;margin-top:6px;font-size:.72rem;font-weight:850}.immersive-console-nav{justify-content:center;gap:clamp(8px,1.3vw,18px);min-width:0;display:flex}.immersive-console-nav a{color:#f5f8fbb3;text-transform:uppercase;justify-items:center;gap:7px;min-width:72px;font-size:.72rem;font-weight:880;line-height:1;transition:color .15s,transform .15s;display:grid}.immersive-console-nav a span{background:linear-gradient(#ffffff1f,#ffffff0a),#ffffff0a;border:1px solid #ffffff1a;border-radius:8px;width:48px;height:42px;display:block;position:relative}.immersive-console-nav a span:before,.immersive-console-nav a span:after{opacity:.86;content:"";border-top:2px solid;border-bottom:2px solid;position:absolute;inset:13px 12px}.immersive-console-nav a span:after{border-top:0;border-bottom:2px solid #58dfc7;height:12px;inset:18px 17px 0}.immersive-console-nav a:hover{color:#fff;transform:translateY(-1px)}.immersive-console-nav a:hover span{background:#58dfc71a;border-color:#58dfc759}.immersive-mode-switch{grid-template-columns:repeat(2,minmax(0,1fr));justify-self:center;gap:10px;width:min(520px,100%);min-width:0;display:grid}.immersive-mode-switch button{color:#f5f8fbad;text-align:left;cursor:pointer;background:linear-gradient(#ffffff17,#ffffff09),#ffffff0a;border:1px solid #ffffff1c;border-radius:8px;gap:4px;min-width:0;min-height:58px;padding:10px 14px;transition:border-color .15s,background .15s,color .15s,transform .15s;display:grid}.immersive-mode-switch button:hover{color:#fff;transform:translateY(-1px)}.immersive-mode-switch button[data-active=true]{color:#fff;background:linear-gradient(135deg,#f3c9692e,#58dfc729),#ffffff13;border-color:#58dfc780;box-shadow:inset 0 1px #ffffff1a,0 12px 34px #58dfc71a}.immersive-mode-switch strong,.immersive-mode-switch span{text-overflow:ellipsis;white-space:nowrap;display:block;overflow:hidden}.immersive-mode-switch strong{text-transform:uppercase;font-size:clamp(1.02rem,1.7vw,1.32rem);font-weight:930;line-height:1}.immersive-mode-switch span{color:#f5f8fb8f;text-transform:uppercase;font-size:.7rem;font-weight:790}.immersive-mode-switch button[data-active=true] span{color:#58dfc7}.immersive-sound-chip{color:#f5f8fbe6;background:#06080c8a;border:1px solid #ffffff1c;border-radius:8px;justify-content:center;justify-self:end;align-items:center;gap:9px;min-width:182px;min-height:48px;padding:9px 12px;font-size:.88rem;font-weight:820;display:flex}.immersive-sound-chip span{color:#58dfc7;font-family:var(--font-geist-mono), monospace;font-weight:900}.practice-workbench .immersive-trainer{--white-key-width:calc(100% / 52);--black-key-width:calc(var(--white-key-width) * .64);--key-height:clamp(172px, 24svh, 286px);z-index:2;background:linear-gradient(#ffffff0d,#ffffff05),#05070aeb;border-color:#ffffff1f;grid-template-rows:minmax(290px,1fr) auto;gap:0;max-width:none;min-height:calc(100svh - 192px);padding:0;display:grid;position:relative;overflow:hidden;box-shadow:0 28px 80px #00000061,inset 0 1px #ffffff0f}.immersive-stage-panel{min-height:0;padding:clamp(14px,1.8vw,24px);display:grid;position:relative}.immersive-trainer .hero-trainer-top{z-index:2;align-self:start;position:relative}.immersive-trainer .hero-trainer-top span,.immersive-trainer .hero-status-readout small{color:#f5f8fb94}.immersive-trainer .hero-trainer-top strong,.immersive-trainer .hero-status-readout strong{color:#fff}.immersive-trainer .hero-sound-stage{isolation:isolate;background:radial-gradient(at 50% 42%,#7df5df1f,#0000 42%),radial-gradient(circle at 18% 74%,#f3c96914,#0000 28%),radial-gradient(circle at 80% 28%,#4e78ff14,#0000 30%),linear-gradient(#0c1119 0%,#05070c 64%,#030304 100%);border:0;border-radius:0;min-height:0;position:absolute;inset:0}.immersive-trainer .hero-sound-stage:before{z-index:0;opacity:.55;background:repeating-linear-gradient(#d3fff733 0 1px,#0000 1px 13px);height:58px;inset:32% clamp(18px,7vw,132px) auto;-webkit-mask-image:linear-gradient(90deg,#0000,#000 14% 86%,#0000);mask-image:linear-gradient(90deg,#0000,#000 14% 86%,#0000)}.immersive-trainer .hero-sound-stage:after{z-index:0;content:"";pointer-events:none;background:linear-gradient(#ffffff09,#0000 22% 72%,#0000005c),radial-gradient(at 50% 78%,#7df5df1a,#0000 30%);position:absolute;inset:0}.immersive-trainer .hero-scope-line{z-index:1;opacity:.55;background:linear-gradient(90deg,#0000,#7df5df94,#0000);height:1px;animation:4.2s ease-in-out infinite hero-staff-breathe;left:clamp(22px,8vw,150px);right:clamp(22px,8vw,150px);box-shadow:0 14px #7df5df2e,0 28px #7df5df1a}.immersive-trainer .hero-scope-line-a{top:30%}.immersive-trainer .hero-scope-line-b{background:linear-gradient(90deg,#0000,#f3c9696b,#0000);animation-delay:-1.4s;top:50%;box-shadow:0 14px #f3c9691f,0 28px #f3c96912}.immersive-trainer .hero-scope-line-c{background:linear-gradient(90deg,#0000,#fff3,#0000);animation-delay:-2.8s;top:70%;box-shadow:0 14px #ffffff12,0 28px #ffffff0a}.immersive-trainer .hero-sound-node{top:var(--node-top);z-index:1;width:auto;height:auto;box-shadow:none;color:#7df5df8c;text-shadow:0 0 18px #58dfc73d,0 16px 32px #00000052;background:0 0;border:0;font-family:Georgia,Times New Roman,serif;font-size:clamp(1.6rem,4.2vw,5.4rem);line-height:1;bottom:auto}.immersive-trainer .hero-sound-node:before{content:"♪"}.immersive-trainer .hero-sound-node-a{--node-top:56%;--note-tilt:-10deg;left:17%}.immersive-trainer .hero-sound-node-b{--node-top:24%;--note-tilt:8deg;color:#f3c96975;left:47%}.immersive-trainer .hero-sound-node-b:before{content:"♫"}.immersive-trainer .hero-sound-node-c{--node-top:48%;--note-tilt:5deg;color:#d3fff761;left:74%}.immersive-trainer .hero-sound-node-c:before{content:"♬"}.immersive-note-readout{z-index:2;color:#fff;text-align:center;text-shadow:0 18px 46px #0009;justify-items:center;gap:4px;width:min(720px,100% - 40px);display:grid;position:absolute;top:48%;left:50%;transform:translate(-50%,-50%)}.immersive-note-readout small{color:#f5f8fba3;text-transform:uppercase;font-size:clamp(.78rem,1.4vw,1.02rem);font-weight:820}.immersive-note-readout strong{color:#fff;text-transform:uppercase;font-size:clamp(4.4rem,12vw,10rem);font-weight:930;line-height:.9}.immersive-note-readout[data-result=correct] strong{color:#7df5df}.immersive-note-readout[data-result=wrong] strong{color:#ff8a7f}.immersive-trainer[data-mode=play] .immersive-note-readout{top:40%}.hear-key-range{z-index:1;pointer-events:none;background:linear-gradient(#0000,#58dfc714),linear-gradient(90deg,#0000,#f3c9691a,#0000);border-top:1px solid #58dfc747;width:42%;height:clamp(52px,8svh,82px);position:absolute;bottom:0;left:31%}.play-roll{z-index:2;background:linear-gradient(#ffffff0b 1px,#0000 1px) 0 0/20px 20px,linear-gradient(90deg,#ffffff0b 1px,#0000 1px) 0 0/36px 36px,#04070bb8;border:1px solid #ffffff1a;border-radius:8px;height:clamp(72px,11svh,112px);position:absolute;bottom:clamp(104px,16svh,138px);left:clamp(22px,8vw,130px);right:clamp(22px,8vw,130px);overflow:hidden;box-shadow:inset 0 1px #ffffff0d,0 18px 44px #0003}.play-roll:before{content:"";opacity:.55;pointer-events:none;background:linear-gradient(90deg,#58dfc71f,#0000 28%,#f3c9691a);position:absolute;inset:0}.play-roll-note{left:var(--event-left);bottom:var(--event-bottom);z-index:1;width:var(--event-width);background:linear-gradient(135deg,#f3c969,#58dfc7);border:1px solid #fff3;border-radius:999px;min-width:12px;height:10px;position:absolute;box-shadow:0 0 20px #58dfc747,0 8px 18px #0000003d}.play-roll-empty{color:#f5f8fb73;text-transform:uppercase;font-size:.72rem;font-weight:850;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}.play-transport-panel{z-index:4;justify-items:center;gap:10px;width:min(620px,100% - 32px);display:grid;position:absolute;bottom:clamp(16px,3.4svh,32px);left:50%;transform:translate(-50%)}.play-transport-panel .play-record-button,.play-transport-panel .play-record-button:hover:not(:disabled){position:relative;bottom:auto;left:auto;transform:none}.play-utility-bar{justify-content:center;gap:8px;width:100%;min-width:0;display:flex}.play-utility-bar .button{color:#f5f8fbe6;text-transform:uppercase;background:#06080cad;border-color:#ffffff1f;min-width:0;min-height:38px;padding:9px 12px;font-size:.74rem}.play-utility-bar .button:hover:not(:disabled){background:#58dfc71f}.immersive-trainer .immersive-hear-button{z-index:3;color:#111217;text-transform:uppercase;background:linear-gradient(135deg,#f3c969,#58dfc7);border:1px solid #ffffff29;border-radius:8px;min-width:132px;min-height:50px;font-size:.95rem;position:absolute;bottom:clamp(22px,4.4svh,48px);left:50%;transform:translate(-50%);box-shadow:0 18px 42px #00000052,0 0 34px #58dfc724}.immersive-trainer .immersive-hear-button:hover:not(:disabled){background:linear-gradient(135deg,#ffe08a,#7df5df);transform:translate(-50%,-1px)}.immersive-trainer .play-transport-panel .play-record-button,.immersive-trainer .play-transport-panel .play-record-button:hover:not(:disabled){position:relative;bottom:auto;left:auto;transform:none}.immersive-trainer .status-strip{left:18px;right:18px;bottom:calc(var(--key-height) + 16px);z-index:4;position:absolute}.practice-workbench .immersive-trainer .home-full-keyboard{--white-key-width:calc(100% / 52);--black-key-width:calc(var(--white-key-width) * .64);--key-height:clamp(172px, 24svh, 286px);scrollbar-width:none;background:linear-gradient(#7df5df1f,#0000 13px),#040506;border:0;border-top:1px solid #7df5df57;border-radius:0;padding:0;overflow:hidden;box-shadow:0 -16px 48px #7df5df14,inset 0 1px #ffffff14;-webkit-mask-image:none;mask-image:none}.practice-workbench .immersive-trainer .home-full-keyboard::-webkit-scrollbar{display:none}.practice-workbench .immersive-trainer .home-full-keyboard .piano-frame{height:var(--key-height);margin:0;width:100%!important}.practice-workbench .immersive-trainer .home-full-keyboard .piano-key{transform-origin:top;transition:transform 90ms,filter .12s,box-shadow .12s,background .12s}.practice-workbench .immersive-trainer .home-full-keyboard .piano-key-white{flex-basis:var(--white-key-width);width:var(--white-key-width);background:linear-gradient(90deg,#0000001a,#0000 18% 82%,#00000021),linear-gradient(#fffdf9 0%,#f3f1ec 62%,#c8cdd3 100%);border-color:#191b20c7;border-radius:0 0 4px 4px;padding:0;box-shadow:inset 0 -13px 16px #0000001f,inset 0 1px #ffffffe6}.practice-workbench .immersive-trainer .home-full-keyboard .piano-key-black{width:var(--black-key-width);background:linear-gradient(90deg,#ffffff17,#0000 22% 78%,#00000073),linear-gradient(#313640 0%,#11131a 58%,#030304 100%);border-color:#ffffff14;border-radius:0 0 4px 4px;padding:0;box-shadow:0 12px 18px #00000075,inset 0 1px #ffffff21}.practice-workbench .immersive-trainer .home-full-keyboard .piano-key-content{justify-content:center;align-items:flex-end;width:100%;height:100%;padding-bottom:clamp(8px,1.2svh,14px);display:flex}.practice-workbench .immersive-trainer .home-full-keyboard .note-label,.practice-workbench .immersive-trainer .home-full-keyboard .key-state-text{display:none}.practice-workbench .immersive-trainer .home-full-keyboard .key-shortcut{color:#111217c2;text-transform:none;background:linear-gradient(#ffffffb8,#bec4cac7),#ffffff80;border-color:#1112172e;border-radius:4px;width:min(18px,100% - 2px);min-width:0;height:clamp(13px,1.35vw,18px);min-height:0;padding:0 2px;font-size:clamp(.5rem,.82vw,.68rem);line-height:1;box-shadow:0 1px 2px #00000038,inset 0 1px #ffffffb8}.practice-workbench .immersive-trainer .home-full-keyboard .key-shortcut-combo{color:#11121794;width:min(24px,100% - 1px);height:clamp(12px,1.15vw,16px);padding:0 1px;font-size:clamp(.34rem,.56vw,.52rem);font-weight:820}.practice-workbench .immersive-trainer .home-full-keyboard .piano-key-black .key-shortcut{color:#f5f8fbc7;background:linear-gradient(#767b8480,#25282fb8),#ffffff14;border-color:#ffffff29;width:min(17px,100% - 2px);box-shadow:0 1px 2px #00000057,inset 0 1px #ffffff1f}.practice-workbench .immersive-trainer .home-full-keyboard .piano-key-black .key-shortcut-combo{color:#f5f8fba8}.practice-workbench .immersive-trainer .home-full-keyboard .piano-key:active{z-index:6;transform:translateY(4px)scaleX(1.45)}.practice-workbench .immersive-trainer .home-full-keyboard .piano-key-black:active{transform:translateY(3px)scaleX(1.28)}.practice-workbench .immersive-trainer .home-full-keyboard .piano-key.is-selected,.practice-workbench .immersive-trainer .home-full-keyboard .piano-key.is-detected{z-index:5;filter:brightness(1.05)saturate(1.1);box-shadow:inset 0 0 0 2px #11121757,0 0 0 3px #f3c9692e,0 0 22px #f3c96961}.practice-workbench .immersive-trainer .home-full-keyboard .piano-key.is-correct{background:linear-gradient(#7df5df,#34bea8);box-shadow:inset 0 0 0 2px #ffffff6b,0 0 0 3px #58dfc726,0 0 26px #58dfc75c}.practice-workbench .immersive-trainer .home-full-keyboard .piano-key.is-wrong{background:linear-gradient(#ff8a7f,#d94d4a);box-shadow:inset 0 0 0 2px #ffffff57,0 0 0 3px #ff6b5d21,0 0 24px #ff6b5d4d}.home-seo-band{color:var(--foreground);background:linear-gradient(180deg, #f8faf8 0%, #fff 46%, #f4f8fb 100%), var(--background);border-top:1px solid #ffffff14}.home-seo-content{gap:54px;width:min(1180px,100vw - 40px);padding:86px 0 104px;display:grid}.home-seo-intro{gap:18px;max-width:900px;display:grid}.home-seo-kicker{color:var(--teal);letter-spacing:0;text-transform:uppercase;font-size:.78rem;font-weight:860;line-height:1.2}.home-seo-intro h1{max-width:980px;color:var(--foreground);margin:0;font-size:clamp(2.2rem,5vw,4.45rem);line-height:1.02}.home-seo-intro p:not(.home-seo-kicker){max-width:760px;color:var(--muted);font-size:1.08rem;line-height:1.75}.home-seo-facts{border-top:1px solid var(--line);border-bottom:1px solid var(--line);grid-template-columns:repeat(3,minmax(0,1fr));gap:0;padding:8px 0;display:grid}.home-seo-facts article,.home-seo-panel,.home-seo-question-grid article{border:1px solid var(--line);background:#ffffffe6;border-radius:8px;box-shadow:0 16px 36px #1720330f}.home-seo-facts article{min-height:0;box-shadow:none;background:0 0;border:0;border-radius:0;gap:10px;padding:24px 30px 26px 0;display:grid}.home-seo-facts article+article{border-left:1px solid var(--line);padding-left:30px}.home-seo-facts strong{color:var(--blue-dark);font-family:var(--font-geist-mono), monospace;font-size:clamp(2.1rem,5vw,3.8rem);font-weight:920;line-height:.95}.home-seo-facts span{color:var(--foreground);font-size:1rem;font-weight:820}.home-seo-facts p,.home-seo-panel p,.home-seo-question-grid p{color:var(--muted);line-height:1.68}.home-seo-grid{grid-template-columns:minmax(0,1.05fr) minmax(340px,.95fr);align-items:start;gap:44px 50px;display:grid}.home-seo-panel{border:0;border-top:1px solid var(--line);box-shadow:none;background:0 0;border-radius:0;align-content:start;gap:18px;padding:30px 0 0;display:grid}.home-seo-panel h2,.home-seo-section-heading h2{color:var(--foreground);font-size:clamp(1.36rem,2.1vw,2.05rem);line-height:1.14}.home-seo-wide{grid-column:1/-1;grid-template-columns:minmax(0,.82fr) minmax(360px,1.18fr);column-gap:46px}.home-seo-wide .home-seo-kicker,.home-seo-wide h2,.home-seo-wide p{grid-column:1}.home-seo-wide .birthday-note-lines{grid-area:1/2/span 3;align-self:start}.labeled-key-map{border-top:1px solid var(--line);gap:0;display:grid}.labeled-key-map div{border:0;border-bottom:1px solid var(--line);background:0 0;border-radius:0;grid-template-columns:64px minmax(0,1fr);gap:16px;min-height:0;padding:16px 0;display:grid}.labeled-key-map dt{color:var(--foreground);font-family:var(--font-geist-mono), monospace;font-size:1.1rem;font-weight:900}.labeled-key-map dd{color:var(--muted);line-height:1.65}.birthday-note-lines{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;display:grid}.birthday-note-lines code{overflow-wrap:anywhere;min-width:0;color:var(--blue-dark);font-family:var(--font-geist-mono), monospace;background:#f5f8ff;border:1px solid #3557ff29;border-radius:8px;padding:16px 18px;font-size:.95rem;font-weight:820;line-height:1.5}.home-seo-questions{gap:24px;padding-top:4px;display:grid}.home-seo-section-heading{gap:10px;max-width:760px;display:grid}.home-seo-question-grid{border-top:1px solid var(--line);grid-template-columns:repeat(2,minmax(0,1fr));gap:0 54px;display:grid}.home-seo-question-grid article{border:0;border-bottom:1px solid var(--line);box-shadow:none;background:0 0;border-radius:0;gap:12px;padding:24px 0 26px;display:grid}.home-seo-question-grid h3{color:var(--foreground);font-size:1.08rem;line-height:1.25}.home-seo-links{flex-wrap:wrap;gap:12px;padding-top:2px;display:flex}.home-seo-links a{border:1px solid var(--line);min-height:46px;color:var(--blue-dark);background:#fff;border-radius:8px;align-items:center;padding:12px 16px;font-weight:760;transition:border-color .14s,background .14s,transform .14s;display:inline-flex}.home-seo-links a:hover{background:#f5f8ff;border-color:#3557ff5c;transform:translateY(-1px)}.home-seo-card-link{width:fit-content;min-height:38px;color:var(--blue-dark);align-items:center;margin-top:2px;font-weight:790;display:inline-flex}.home-seo-card-link:hover{color:var(--blue)}.seo-keyword-page{color:var(--foreground);background:linear-gradient(180deg, #fff 0%, #f6f9f8 44%, #f4f8fb 100%), var(--background)}.seo-keyword-hero{border-bottom:1px solid var(--line);background:linear-gradient(135deg,#3557ff12,#0000 36%),linear-gradient(250deg,#009f9014,#0000 34%),#fff;padding:74px 0 56px}.seo-keyword-hero-grid{grid-template-columns:minmax(0,.95fr) minmax(420px,1.05fr);align-items:center;gap:46px;display:grid}.seo-keyword-copy{gap:18px;display:grid}.seo-keyword-copy h1{max-width:760px;color:var(--foreground);margin:0;font-size:clamp(2.2rem,5vw,4.4rem);line-height:1.02}.seo-keyword-copy p:not(.home-seo-kicker){max-width:720px;color:var(--muted);font-size:1.08rem;line-height:1.72}.seo-keyword-actions{flex-wrap:wrap;gap:10px;padding-top:6px;display:flex}.seo-keyword-actions a,.seo-related-links a{border:1px solid var(--line);min-height:42px;color:var(--blue-dark);background:#fff;border-radius:8px;align-items:center;padding:10px 13px;font-weight:780;display:inline-flex}.seo-keyword-actions a:first-child{color:#fff;background:linear-gradient(135deg, var(--blue), var(--violet));border-color:#3557ff4d}.seo-keyword-actions a:hover,.seo-related-links a:hover{background:#f5f8ff;border-color:#3557ff61}.seo-keyword-actions a:first-child:hover{background:linear-gradient(135deg, var(--blue-dark), #5b3ff0)}.seo-keyword-visual{gap:14px;min-width:0;display:grid}.seo-keyboard-figure{gap:12px;min-width:0;display:grid}.seo-keyboard-scroll{--seo-white-key-width:clamp(44px, 5.8vw, 58px);--seo-black-key-width:clamp(30px, 4vw, 40px);--seo-key-height:clamp(124px, 18vw, 170px);background:linear-gradient(180deg, #f8fbff, #e9f0f6), var(--surface-muted);scrollbar-width:thin;border:1px solid #1112171f;border-radius:8px;padding:14px 10px 18px;overflow-x:auto;box-shadow:0 20px 46px #1720331a}.seo-keyboard-frame{width:var(--seo-keyboard-width);height:var(--seo-key-height);margin:0 auto;position:relative}.seo-white-key-row{height:100%;display:flex}.seo-key{-webkit-user-select:none;user-select:none}.seo-key-white{flex:0 0 var(--seo-white-key-width);width:var(--seo-white-key-width);color:#172033;background:var(--white-key);border:1px solid #bec9d8;border-right:0;border-radius:0 0 6px 6px;justify-content:center;align-items:flex-end;height:100%;padding:0 4px 10px;display:flex}.seo-key-white:last-child{border-right:1px solid #bec9d8}.seo-key-black{z-index:2;width:var(--seo-black-key-width);border:1px solid var(--black-key-line);color:#fff;background:var(--black-key);border-radius:0 0 5px 5px;justify-content:center;align-items:flex-end;height:62%;padding:0 3px 9px;display:flex;position:absolute;top:0;box-shadow:0 7px 10px #17203338}.seo-key span{overflow-wrap:anywhere;text-align:center;max-width:100%;font-size:.68rem;font-weight:820;line-height:1.05;display:block}.seo-key.is-highlighted{color:#101624;background:#ffd86b;box-shadow:inset 0 0 0 2px #1112172e,0 0 0 4px #ffd86b2e}.seo-keyboard-figure figcaption{color:var(--muted);font-size:.9rem;line-height:1.55}.seo-note-lines{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;display:grid}.seo-note-lines code{overflow-wrap:anywhere;min-width:0;color:var(--blue-dark);font-family:var(--font-geist-mono), monospace;background:#f5f8ff;border:1px solid #3557ff29;border-radius:8px;padding:13px 14px;font-size:.88rem;font-weight:820;line-height:1.5}.seo-fact-band{border-bottom:1px solid var(--line);background:#ffffff9e}.seo-fact-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:0;display:grid}.seo-fact-grid article{gap:8px;min-width:0;padding:28px 28px 30px 0;display:grid}.seo-fact-grid article+article{border-left:1px solid var(--line);padding-left:28px}.seo-fact-grid strong{color:var(--blue-dark);font-family:var(--font-geist-mono), monospace;font-size:clamp(1.6rem,4vw,2.8rem);line-height:1}.seo-fact-grid span{color:var(--foreground);font-weight:820}.seo-fact-grid p{color:var(--muted);line-height:1.62}.seo-body-section,.seo-table-section,.seo-faq-section{padding:58px 0}.seo-body-grid{grid-template-columns:minmax(0,1fr) minmax(300px,.42fr);align-items:start;gap:54px;display:grid}.seo-article-stack{gap:30px;display:grid}.seo-section-block{border-top:1px solid var(--line);gap:12px;padding-top:26px;display:grid}.seo-section-block:first-child{border-top:0;padding-top:0}.seo-section-block h2,.seo-side-block h2,.seo-table-wrap h2{color:var(--foreground);font-size:clamp(1.25rem,2vw,1.8rem)}.seo-section-block p{max-width:780px;color:var(--muted);line-height:1.72}.seo-side-panel{gap:16px;display:grid;position:sticky;top:92px}.seo-side-block{border:1px solid var(--line);background:#ffffffdb;border-radius:8px;gap:14px;padding:20px;display:grid;box-shadow:0 16px 34px #1720330f}.seo-side-block ol{color:var(--muted);gap:10px;padding-left:22px;line-height:1.55;display:grid}.seo-side-block li::marker{color:var(--blue-dark);font-weight:860}.seo-related-links{gap:9px;display:grid}.seo-table-section{border-top:1px solid var(--line);border-bottom:1px solid var(--line);background:linear-gradient(#ffffffb8,#f4f8fbd1),#f4f8fb}.seo-table-wrap{gap:18px;display:grid}.seo-table-scroll{border:1px solid var(--line);background:#fff;border-radius:8px;overflow-x:auto;box-shadow:0 16px 34px #1720330f}.seo-table-scroll table{border-collapse:collapse;width:100%;min-width:560px}.seo-table-scroll th,.seo-table-scroll td{border-bottom:1px solid var(--line);text-align:left;vertical-align:top;padding:14px 16px}.seo-table-scroll th{color:var(--foreground);text-transform:uppercase;background:#f8fbff;font-size:.82rem}.seo-table-scroll td{color:var(--muted);line-height:1.5}.seo-table-scroll tr:last-child td{border-bottom:0}.seo-faq-wrap{gap:24px;display:grid}.seo-faq-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;display:grid}.seo-faq-grid article{border:1px solid var(--line);background:#fff;border-radius:8px;gap:10px;padding:20px;display:grid;box-shadow:0 14px 28px #1720330d}.seo-faq-grid h3{color:var(--foreground);font-size:1rem;line-height:1.28}.seo-faq-grid p{color:var(--muted);line-height:1.62}@media (max-width:980px){.immersive-console-topbar{grid-template-columns:1fr;justify-items:stretch;gap:14px}.immersive-console-nav{justify-content:space-between}.immersive-mode-switch,.immersive-sound-chip{justify-self:stretch}.practice-workbench .immersive-trainer{min-height:calc(100svh - 254px)}.home-seo-facts,.home-seo-question-grid,.birthday-note-lines{grid-template-columns:repeat(2,minmax(0,1fr))}.home-seo-content{gap:46px;padding:70px 0 84px}.home-seo-grid,.home-seo-wide,.seo-keyword-hero-grid,.seo-body-grid{grid-template-columns:1fr}.seo-side-panel{position:static}.seo-faq-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.home-seo-wide .home-seo-kicker,.home-seo-wide h2,.home-seo-wide p,.home-seo-wide .birthday-note-lines{grid-area:auto}.home-seo-facts article:nth-child(odd){border-left:0;padding-left:0}.home-seo-facts article:nth-child(n+3){border-top:1px solid var(--line)}}@media (max-width:700px){.immersive-piano-shell{min-height:calc(100svh - 58px);padding:8px 0 10px}.immersive-piano-console{gap:8px;width:min(100vw - 12px,1760px);min-height:calc(100svh - 76px)}.dancing-notes-backdrop{opacity:.58;inset:-6px}.dancing-staff-b,.dancing-note-e,.dancing-note-f,.dancing-beat-c{display:none}.immersive-console-topbar{min-height:auto;padding:10px}.immersive-brand-mark{width:38px}.immersive-console-brand strong{font-size:.95rem}.immersive-console-brand small{font-size:.66rem}.immersive-console-nav{grid-template-columns:repeat(5,minmax(0,1fr));gap:6px;display:grid}.immersive-mode-switch{gap:6px}.immersive-mode-switch button{min-height:50px;padding:9px 10px}.immersive-mode-switch strong{font-size:.98rem}.immersive-mode-switch span{font-size:.6rem}.immersive-console-nav a{min-width:0;font-size:.62rem}.immersive-console-nav a span{width:100%;max-width:42px;height:34px}.immersive-sound-chip{min-width:0;min-height:38px;font-size:.8rem}.practice-workbench .immersive-trainer{--key-height:clamp(128px, 26svh, 176px);grid-template-rows:minmax(250px,1fr) auto;min-height:calc(100svh - 246px)}.immersive-stage-panel{padding:12px}.immersive-note-readout strong{font-size:clamp(3.3rem,18vw,5.8rem)}.immersive-trainer .immersive-hear-button{min-width:110px;min-height:44px;bottom:20px}.immersive-trainer[data-mode=play] .immersive-note-readout{top:36%}.play-roll{height:72px;bottom:112px;left:14px;right:14px}.play-transport-panel{gap:8px;width:calc(100% - 18px);bottom:14px}.play-utility-bar{gap:5px}.play-utility-bar .button{flex:1 1 0;min-height:34px;padding:8px 6px;font-size:.62rem}.practice-workbench .immersive-trainer .home-full-keyboard{--key-height:clamp(128px, 26svh, 176px)}.home-seo-content{gap:38px;width:min(100vw - 24px,1120px);padding:48px 0 60px}.home-seo-intro h1{font-size:clamp(2rem,12vw,3.2rem);line-height:1}.home-seo-intro p:not(.home-seo-kicker){font-size:.98rem;line-height:1.62}.home-seo-facts,.home-seo-grid,.home-seo-question-grid,.labeled-key-map,.birthday-note-lines,.seo-fact-grid,.seo-note-lines,.seo-faq-grid{grid-template-columns:1fr}.seo-keyword-hero{padding:46px 0 38px}.seo-keyword-copy h1{font-size:clamp(2rem,12vw,3.2rem)}.seo-keyword-copy p:not(.home-seo-kicker){font-size:.98rem;line-height:1.62}.seo-keyword-actions,.seo-related-links{display:grid}.seo-keyword-actions a,.seo-related-links a{justify-content:center;width:100%}.seo-keyboard-scroll{--seo-white-key-width:42px;--seo-black-key-width:30px;--seo-key-height:124px;padding:12px 8px 16px}.seo-key span{font-size:.58rem}.seo-fact-grid article,.seo-fact-grid article+article{border-left:0;border-top:1px solid var(--line);padding:20px 0}.seo-fact-grid article:first-child{border-top:0}.seo-body-section,.seo-table-section,.seo-faq-section{padding:42px 0}.seo-body-grid{gap:34px}.home-seo-facts article,.home-seo-panel,.home-seo-question-grid article{padding:20px 0}.home-seo-panel{padding:24px 0 0}.home-seo-facts article+article,.home-seo-facts article:nth-child(n+3){border-left:0;border-top:1px solid var(--line);padding-left:0}.home-seo-facts article,.labeled-key-map div{min-height:auto}.labeled-key-map div{grid-template-columns:52px minmax(0,1fr);gap:12px}.home-seo-links{display:grid}.home-seo-links a{justify-content:center;width:100%}}@media (prefers-reduced-motion:reduce){.preview-wave path,.hero-scope-line,.hero-sound-node,.dancing-staff,.dancing-beat,.dancing-note,.scope-wave,.scope-hit,.cue-note,.hero-hear-button[data-attention=true],.hero-hear-button[data-playing=true]:after,.combo-spark,.falling-note,.console-keybed .is-pulse,.mini-keyboard-visual .is-pulse,.training-console-screen span,.feedback-wrong,.piano-key.is-wrong,.detector-live-pill[data-state=listening] span,.detector-wave-field span,.detector-console .piano-key.is-detected{animation:none}.detector-console .piano-key,.piano-key,.mission-card,.cue-button,.button,.training-progress span,.mission-progress span,.fever-track span,.meter-track span,.toggle-switch,.toggle-switch span,.tuning-selector button{transition-duration:1ms}}