@layer theme{:root,:host{--font-sans:ui-sans-serif, system-ui, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";--font-mono:ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;--spacing:.25rem;--default-font-family:var(--font-sans);--default-mono-font-family:var(--font-mono)}}@layer base{*,:after,:before,::backdrop{box-sizing:border-box;border:0 solid;margin:0;padding:0}::file-selector-button{box-sizing:border-box;border:0 solid;margin:0;padding:0}html,:host{-webkit-text-size-adjust:100%;tab-size:4;line-height:1.5;font-family:var(--default-font-family,ui-sans-serif, system-ui, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji");font-feature-settings:var(--default-font-feature-settings,normal);font-variation-settings:var(--default-font-variation-settings,normal);-webkit-tap-highlight-color:transparent}hr{height:0;color:inherit;border-top-width:1px}abbr:where([title]){-webkit-text-decoration:underline dotted;text-decoration:underline dotted}h1,h2,h3,h4,h5,h6{font-size:inherit;font-weight:inherit}a{color:inherit;-webkit-text-decoration:inherit;-webkit-text-decoration:inherit;-webkit-text-decoration:inherit;-webkit-text-decoration:inherit;text-decoration:inherit}b,strong{font-weight:bolder}code,kbd,samp,pre{font-family:var(--default-mono-font-family,ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace);font-feature-settings:var(--default-mono-font-feature-settings,normal);font-variation-settings:var(--default-mono-font-variation-settings,normal);font-size:1em}small{font-size:80%}sub,sup{vertical-align:baseline;font-size:75%;line-height:0;position:relative}sub{bottom:-.25em}sup{top:-.5em}table{text-indent:0;border-color:inherit;border-collapse:collapse}:-moz-focusring{outline:auto}progress{vertical-align:baseline}summary{display:list-item}ol,ul,menu{list-style:none}img,svg,video,canvas,audio,iframe,embed,object{vertical-align:middle;display:block}img,video{max-width:100%;height:auto}button,input,select,optgroup,textarea{font:inherit;font-feature-settings:inherit;font-variation-settings:inherit;letter-spacing:inherit;color:inherit;opacity:1;background-color:#0000;border-radius:0}::file-selector-button{font:inherit;font-feature-settings:inherit;font-variation-settings:inherit;letter-spacing:inherit;color:inherit;opacity:1;background-color:#0000;border-radius:0}:where(select:is([multiple],[size])) optgroup{font-weight:bolder}:where(select:is([multiple],[size])) optgroup option{padding-inline-start:20px}::file-selector-button{margin-inline-end:4px}::placeholder{opacity:1}@supports (not ((-webkit-appearance:-apple-pay-button))) or (contain-intrinsic-size:1px){::placeholder{color:currentColor}@supports (color:color-mix(in lab, red, red)){::placeholder{color:color-mix(in oklab, currentcolor 50%, transparent)}}}textarea{resize:vertical}::-webkit-search-decoration{-webkit-appearance:none}::-webkit-date-and-time-value{min-height:1lh;text-align:inherit}::-webkit-datetime-edit{display:inline-flex}::-webkit-datetime-edit-fields-wrapper{padding:0}::-webkit-datetime-edit{padding-block:0}::-webkit-datetime-edit-year-field{padding-block:0}::-webkit-datetime-edit-month-field{padding-block:0}::-webkit-datetime-edit-day-field{padding-block:0}::-webkit-datetime-edit-hour-field{padding-block:0}::-webkit-datetime-edit-minute-field{padding-block:0}::-webkit-datetime-edit-second-field{padding-block:0}::-webkit-datetime-edit-millisecond-field{padding-block:0}::-webkit-datetime-edit-meridiem-field{padding-block:0}::-webkit-calendar-picker-indicator{line-height:1}:-moz-ui-invalid{box-shadow:none}button,input:where([type=button],[type=reset],[type=submit]){appearance:button}::file-selector-button{appearance:button}::-webkit-inner-spin-button{height:auto}::-webkit-outer-spin-button{height:auto}[hidden]:where(:not([hidden=until-found])){display:none!important}}@layer components;@layer utilities{.start{inset-inline-start:var(--spacing)}.end{inset-inline-end:var(--spacing)}}:root{--paper:#f4f0e7;--paper-deep:#e9e2d4;--ink:#20221f;--muted:#77756e;--line:#d7d0c3;--card:#fbf9f3;--coral:#f26c4f;--coral-dark:#d94d31;--blue:#53657d;--lime:#c8e26a;--shadow:0 18px 50px #2f2a221a}*{box-sizing:border-box}html{background:var(--paper)}body{background:var(--paper);color:var(--ink);margin:0;font-family:PingFang SC,Noto Sans CJK SC,Microsoft YaHei,system-ui,sans-serif}button,input{font:inherit}button{color:inherit}.app-shell{width:min(1600px,100%);min-height:100vh;margin:0 auto;padding:0 42px 28px;overflow:hidden}.topbar{border-bottom:1px solid var(--line);justify-content:space-between;align-items:center;height:78px;display:flex}.brand-lockup,.top-actions,.stage-toolbar,.stage-title,.stage-controls,.coach-row,.now-card,.feedback-card,.keyboard-head,.keyboard-foot,.song-meta,.level-card,.mode-switch,.notice-strip,.range-notice{align-items:center;display:flex}.brand-lockup{gap:12px}.brand-lockup strong{letter-spacing:.16em;font-size:16px;display:block}.brand-lockup small{color:var(--muted);letter-spacing:.18em;margin-top:3px;font-size:8px;display:block}.brand-mark{width:38px;height:30px;display:block;position:relative}.brand-mark i{background:var(--ink);width:8px;position:absolute;bottom:0;transform:skew(-8deg)}.brand-mark i:first-child{height:18px;left:1px}.brand-mark i:nth-child(2){background:var(--coral);height:29px;left:13px}.brand-mark i:nth-child(3){background:var(--blue);height:23px;left:25px}.top-actions{gap:10px}.upload-button,.midi-button{border:1px solid var(--line);cursor:pointer;background:0 0;height:42px;padding:0 17px;font-size:13px;font-weight:650}.upload-button{align-items:center;gap:8px;display:inline-flex}.upload-button input{opacity:0;width:1px;height:1px;position:absolute}.upload-button span{font-size:20px;line-height:1}.midi-button{background:var(--ink);color:#fff;border-color:var(--ink);align-items:center;gap:8px;display:flex}.midi-button.connected{background:#31493d;border-color:#31493d}.status-dot,.live-dot{background:var(--coral);border-radius:50%;width:7px;height:7px;box-shadow:0 0 0 4px #f26c4f24}.midi-button.connected .status-dot{background:var(--lime);box-shadow:0 0 0 4px #c8e26a24}.song-heading{justify-content:space-between;align-items:flex-end;padding:32px 0 24px;display:flex}.eyebrow{color:var(--coral-dark);letter-spacing:.2em;margin:0 0 6px;font-size:10px;font-weight:800}.song-heading h1{letter-spacing:-.05em;margin:0;font-family:Songti SC,STSong,serif;font-size:clamp(42px,4.5vw,72px);font-weight:700;line-height:.95}.song-meta{color:var(--muted);gap:8px;margin:14px 0 0;font-size:12px}.song-meta span{background:var(--muted);border-radius:50%;width:3px;height:3px}.song-source{text-align:right;padding-bottom:4px}.song-source span,.song-source strong{display:block}.song-source span{color:var(--muted);margin-bottom:5px;font-size:10px}.song-source strong{font-size:12px}.notice-strip,.range-notice{background:#edf3d9;border:1px solid #b7c98b;margin-bottom:16px}.notice-strip{gap:10px;min-height:42px;padding:8px 12px;font-size:12px}.notice-strip.error{background:#f8dfd8;border-color:#e6a99b}.notice-strip>span{background:var(--ink);color:#fff;border-radius:50%;place-items:center;width:23px;height:23px;display:grid}.notice-strip p{flex:1;margin:0}.notice-strip button{cursor:pointer;background:0 0;border:0;font-size:20px}.level-rail{border:1px solid var(--line);background:var(--card);grid-template-columns:repeat(4,1fr);gap:0;display:grid}.level-card{border:0;border-right:1px solid var(--line);text-align:left;cursor:pointer;background:0 0;gap:12px;min-width:0;height:96px;padding:14px 16px;transition:background .16s,color .16s}.level-card:last-child{border-right:0}.level-card:hover{background:#f0ebe1}.level-card.active{background:var(--ink);color:#fff}.level-card.done .level-number{background:var(--lime);color:var(--ink)}.level-number{border:1px solid;border-radius:50%;flex:0 0 34px;place-items:center;height:34px;font-size:11px;font-weight:800;display:grid}.level-copy{flex:1;min-width:0}.level-copy small,.level-copy strong,.level-copy em{display:block}.level-copy small{color:var(--coral);letter-spacing:.08em;font-size:9px;font-weight:800}.level-card.active .level-copy small{color:var(--lime)}.level-copy strong{margin-top:3px;font-size:16px}.level-copy em{color:var(--muted);white-space:nowrap;text-overflow:ellipsis;margin-top:5px;font-size:10px;font-style:normal;overflow:hidden}.level-card.active .level-copy em{color:#b8b8b2}.level-arrow{opacity:.45;font-size:17px}.range-notice{background:#fff1ca;border-color:#dec57c;gap:14px;margin-top:16px;padding:14px 16px;position:relative}.range-icon{background:#f1cd66;flex:0 0 38px;place-items:center;height:38px;font-size:18px;display:grid}.range-notice>div:nth-child(2){flex:1}.range-notice strong{font-size:13px}.range-notice p{color:#6f623f;margin:4px 0 0;font-size:11px;line-height:1.6}.range-notice button{cursor:pointer;background:0 0;border:1px solid #bfa757;padding:8px 12px;font-size:11px}.practice-stage{border:1px solid var(--line);background:var(--card);min-height:500px;box-shadow:var(--shadow);grid-template-columns:minmax(0,1fr) 275px;margin-top:18px;display:grid}.stage-main{min-width:0;padding:22px 24px}.song-panel{background:var(--paper-deep);border-left:1px solid var(--line);flex-direction:column;padding:20px;display:flex;position:relative;overflow:hidden}.stage-toolbar{justify-content:space-between;margin-bottom:18px}.stage-title{gap:11px}.stage-title>span{background:var(--coral);color:#fff;place-items:center;width:40px;height:40px;font-family:ui-monospace,monospace;font-size:12px;display:grid}.stage-title small{color:var(--muted);letter-spacing:.08em;font-size:9px}.stage-title h2{margin:2px 0 0;font-size:18px}.stage-controls{gap:8px}.soft-toggle,.play-button{border:1px solid var(--line);cursor:pointer;background:0 0;height:38px;padding:0 13px;font-size:11px;font-weight:700}.soft-toggle span{color:var(--muted);margin-left:6px}.soft-toggle.on{background:#e9f0d1;border-color:#b6c887}.soft-toggle.on span{color:#5f752e}.play-button{background:var(--ink);color:#fff;border-color:var(--ink);align-items:center;gap:8px;display:flex}.play-button span{color:var(--lime);font-size:10px}.karaoke-window{border:1px solid var(--line);background:#fffdf8}.timing-line{background:#e5dfd3;height:4px}.timing-line span{background:var(--coral);height:100%;transition:width .22s;display:block}.measure-labels{color:var(--muted);letter-spacing:.12em;justify-content:space-between;padding:12px 16px 8px;font-size:9px;display:flex}.chord-row{grid-template-columns:repeat(4,1fr);min-height:135px;padding:0 14px 12px;display:grid}.chord-cell{color:#aaa69e;border-right:1px solid #e6e0d5;flex-direction:column;justify-content:center;min-width:0;padding:12px 16px;display:flex;position:relative}.chord-cell:last-child{border-right:0}.chord-cell small{font-family:ui-monospace,monospace;font-size:9px}.chord-cell strong{letter-spacing:-.06em;margin-top:5px;font-family:Times New Roman,serif;font-size:clamp(33px,3.3vw,54px);line-height:1}.chord-cell span{white-space:nowrap;text-overflow:ellipsis;margin-top:8px;font-size:9px;overflow:hidden}.chord-cell i{letter-spacing:.09em;font-size:7px;font-style:normal;font-weight:900;position:absolute;top:8px;right:8px}.chord-cell.current{background:var(--coral);color:#fff;margin:0 4px;transform:translateY(-3px);box-shadow:0 8px 20px #d551312e}.chord-cell.passed{color:#7d8d4b;background:#f1f5e4}.lyric-lines{border-top:1px solid var(--line);text-align:center;min-height:103px;padding:18px 24px}.lyric-current{margin:0;font-family:Songti SC,STSong,serif;font-size:clamp(18px,2vw,27px);font-weight:700}.lyric-next{color:#aaa69d;margin:12px 0 0;font-size:13px}.coach-row{gap:12px;margin-top:14px}.now-card,.feedback-card{border:1px solid var(--line);min-height:72px;padding:12px 16px}.now-card{flex:1.35;gap:12px}.feedback-card{background:#f1eee7;flex:1;gap:11px}.feedback-card.success{background:#edf3d9;border-color:#b7c98b}.feedback-card>span{background:var(--blue);color:#fff;border-radius:50%;place-items:center;width:30px;height:30px;display:grid}.feedback-card.success>span{background:#6f8734}.pulse-ring{width:31px;height:31px;box-shadow:inset 0 0 0 3px var(--coral);border:7px solid #fee3dc;border-radius:50%}.now-card small,.feedback-card small{color:var(--muted);font-size:9px;display:block}.now-card strong,.feedback-card strong{margin-top:3px;font-size:13px;display:block}.now-card>div:nth-child(2) strong{font-family:Times New Roman,serif;font-size:25px}.note-pills{flex-wrap:wrap;justify-content:flex-end;gap:5px;margin-left:auto;display:flex}.note-pills span{background:var(--paper-deep);padding:5px 7px;font-family:ui-monospace,monospace;font-size:9px}.smart-chords{align-items:center;gap:7px;margin-top:12px;display:flex}.smart-chords>span{color:var(--muted);margin-right:6px;font-size:10px}.smart-chords button{border:1px solid var(--line);cursor:pointer;background:#fffdf8;width:55px;height:32px;font-family:Times New Roman,serif;font-weight:700}.smart-chords button:hover{background:var(--coral);color:#fff;border-color:var(--coral)}.album-art{aspect-ratio:1;background:var(--blue);color:#f8f1e3;grid-template-columns:repeat(2,1fr);gap:1px;width:100%;padding:25px;display:grid;position:relative;overflow:hidden}.album-art>span{z-index:1;text-align:center;align-self:center;font-family:Songti SC,serif;font-size:34px;font-weight:800}.album-art>span:nth-of-type(2),.album-art>span:nth-of-type(3){color:var(--lime)}.wind-lines{opacity:.38;position:absolute;inset:0;transform:rotate(-14deg)scale(1.3)}.wind-lines i{background:#fff;width:140%;height:1px;position:absolute;left:-20%}.wind-lines i:first-child{top:18%}.wind-lines i:nth-child(2){top:38%;left:-5%}.wind-lines i:nth-child(3){top:65%;left:-35%}.wind-lines i:nth-child(4){top:82%;left:0}.song-panel-copy{border-bottom:1px solid var(--line);padding:17px 0 15px}.song-panel-copy small{color:var(--coral-dark);letter-spacing:.08em;font-size:9px;font-weight:800}.song-panel-copy strong{margin-top:4px;font-size:21px;display:block}.song-panel-copy p{color:var(--muted);margin:7px 0 0;font-size:10px;line-height:1.6}.stat-grid{border-bottom:1px solid var(--line);grid-template-columns:1fr 1fr;display:grid}.stat-grid div{border-bottom:1px solid var(--line);padding:11px 0}.stat-grid div:nth-child(odd){border-right:1px solid var(--line)}.stat-grid div:nth-child(3),.stat-grid div:nth-child(4){border-bottom:0}.stat-grid div:nth-child(2n){padding-left:11px}.stat-grid small,.stat-grid strong{display:block}.stat-grid small{color:var(--muted);font-size:8px}.stat-grid strong{margin-top:3px;font-size:10px}.panel-warning{border-left:2px solid var(--coral);color:#7f6f64;margin:10px 0 0;padding-left:9px;font-size:9px;line-height:1.5}.song-panel img{filter:drop-shadow(0 8px 12px #00000029);width:112%;margin:auto -6% -11px}.keyboard-dock{border:1px solid var(--line);color:#fff;box-shadow:var(--shadow);background:#282a28;margin-top:18px;padding:18px 20px 12px}.keyboard-head{justify-content:space-between;margin-bottom:14px}.keyboard-head>div:first-child{align-items:center;gap:8px;display:flex}.keyboard-head strong{font-size:13px}.keyboard-head small{color:#9b9d97;font-size:9px}.mode-switch{border:1px solid #535650}.mode-switch button{color:#a9aaa4;cursor:pointer;background:0 0;border:0;border-right:1px solid #535650;height:30px;padding:0 11px;font-size:9px}.mode-switch button:last-child{border-right:0}.mode-switch button.active{background:var(--lime);color:var(--ink);font-weight:800}.piano{touch-action:none;scrollbar-width:thin;background:#161715;border:5px solid #161715;width:100%;height:132px;display:flex;position:relative;overflow:auto hidden}.piano-key{cursor:pointer;touch-action:none;border:0;border-right:1px solid #aaa;flex:1 0 0;min-width:17px;padding:0;position:relative}.piano-key.white{z-index:1;background:#faf9f4;height:122px}.piano-key.black{z-index:2;background:#171817;border:0;flex:0 0 2.1%;min-width:11px;height:78px;margin:0 -1.05%;box-shadow:0 4px 6px #0000008c}.keyboard-72 .piano-key.white{min-width:22px}.keyboard-72 .piano-key.black{flex-basis:15px;min-width:15px;margin:0 -7.5px}.piano-key.white span{color:#929087;font-size:7px;position:absolute;bottom:6px;left:50%;transform:translate(-50%)}.piano-key.target.white{box-shadow:inset 0 -12px 0 var(--coral);background:#f7c2b5}.piano-key.target.black{background:var(--coral);box-shadow:0 0 16px #f26c4fa6}.piano-key.preview.white{box-shadow:inset 0 -5px 0 var(--blue);background:#dfe4ec}.piano-key.preview.black{background:var(--blue)}.piano-key.pressed{filter:brightness(.86);transform:translateY(3px)}.piano-key>i{background:#fff;border-radius:50%;width:7px;height:7px;position:absolute;bottom:14px;left:50%;transform:translate(-50%);box-shadow:0 0 0 3px #ffffff47}.piano-key.black>i{bottom:8px}.piano-key.split:after{content:"Ⅱ";background:var(--lime);width:16px;height:18px;color:var(--ink);z-index:5;place-items:center;font-size:7px;font-weight:900;display:grid;position:absolute;top:0;left:-8px}.keyboard-foot{color:#90928c;justify-content:space-between;margin-top:9px;font-size:8px}.legend{align-items:center;gap:5px;display:flex}.legend i{width:9px;height:9px}.legend i.target{background:var(--coral)}.legend i.preview{background:var(--blue)}footer{color:var(--muted);letter-spacing:.04em;justify-content:space-between;padding-top:16px;font-size:8px;display:flex}@media (max-width:1050px){.app-shell{padding-inline:22px}.level-copy em{display:none}.practice-stage{grid-template-columns:1fr}.song-panel{border-left:0;border-top:1px solid var(--line);grid-template-columns:155px 1fr 1fr;gap:16px;display:grid}.album-art{grid-row:span 2}.song-panel-copy{padding-top:0}.song-panel img{display:none}.panel-warning{grid-column:2/4}}@media (max-width:720px){.app-shell{padding:0 12px 20px}.topbar{gap:12px;height:auto;min-height:68px}.brand-lockup small{display:none}.upload-button,.midi-button{justify-content:center;width:42px;padding:0;font-size:0}.upload-button span,.midi-button .status-dot{font-size:initial}.song-heading{align-items:flex-start;padding:24px 0 18px}.song-heading h1{font-size:48px}.song-meta{flex-wrap:wrap;max-width:280px}.song-source{max-width:120px}.level-rail{grid-template-columns:repeat(4,185px);overflow-x:auto}.level-card{height:78px}.practice-stage{margin-top:12px}.stage-main{padding:15px 12px}.stage-toolbar{align-items:flex-end}.stage-controls{flex-direction:column;align-items:stretch}.soft-toggle,.play-button{height:32px}.chord-row{grid-template-columns:repeat(4,105px);padding-inline:7px;overflow-x:auto}.chord-cell{padding-inline:10px}.chord-cell strong{font-size:36px}.lyric-lines{padding-inline:12px}.coach-row{flex-direction:column;align-items:stretch}.note-pills{margin-left:auto}.song-panel{grid-template-columns:110px 1fr;padding:14px}.song-panel-copy{padding-bottom:8px}.stat-grid{grid-column:2}.panel-warning{grid-column:1/3}.album-art{padding:12px}.album-art>span{font-size:24px}.keyboard-dock{padding:14px 8px 9px}.keyboard-head small{display:none}.piano{height:112px}.piano-key.white{min-width:25px;height:102px}.piano-key.black{flex-basis:16px;min-width:16px;height:65px;margin:0 -8px}.keyboard-foot span:nth-child(2){display:none}footer{flex-direction:column;gap:5px}}@media (prefers-reduced-motion:reduce){*,:before,:after{scroll-behavior:auto!important;transition:none!important}}