@keyframes hn-pr-flash{0%,to{opacity:1}40%{opacity:.35}}.hn-pr-keys,.hn-pr-layer,.hn-practice{--pr-ok:#1B7F47;--pr-ok-soft:rgba(27, 127, 71, .30);--pr-bad:#C2362B;--pr-bad-soft:rgba(194, 54, 43, .26);--pr-now:var(--accent)}:root[data-theme=dark] .hn-pr-keys,:root[data-theme=dark] .hn-pr-layer,:root[data-theme=dark] .hn-practice{--pr-ok:#5FD592;--pr-ok-soft:rgba(95, 213, 146, .34);--pr-bad:#FF8A7E;--pr-bad-soft:rgba(255, 138, 126, .32)}.hn-pr-layer{--pr-ok-line:#1B7F47;--pr-bad-line:#C2362B}.hn-practice{margin:0 0 14px;text-align:left;box-sizing:border-box;background:var(--surface);color:var(--ink);border:1px solid var(--line);border-radius:var(--r-lg)}.hn-practice__head{margin:0;font:inherit}.hn-practice__toggle{display:grid;grid-template-columns:auto 1fr auto;align-items:center;column-gap:12px;width:100%;min-height:52px;padding:8px 16px;box-sizing:border-box;border:0;border-radius:var(--r-lg);background:0 0;color:inherit;cursor:pointer;text-align:left;font:600 16px/1.25 var(--font-ui);-webkit-tap-highlight-color:transparent}.hn-practice__toggle:hover{background:var(--accent-soft)}.hn-practice__toggle:focus-visible{outline:2px solid var(--accent);outline-offset:-2px}.hn-practice__sum{min-width:0;font-weight:400;font-size:14px;color:var(--muted);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.hn-practice__chev{transition:transform .18s ease;color:var(--muted)}.hn-practice.is-open .hn-practice__chev{transform:rotate(180deg)}.hn-practice.is-open .hn-practice__toggle{border-bottom-left-radius:0;border-bottom-right-radius:0;border-bottom:1px solid var(--line-soft)}@media (prefers-reduced-motion:reduce){.hn-practice__chev{transition:none}}@media (max-width:559.98px){.hn-practice__sum{display:none}.hn-practice__toggle{grid-template-columns:1fr auto}}.hn-practice__body[hidden]{display:none}.hn-practice__body{padding:4px 16px 12px;font-family:var(--font-ui);font-size:15px;line-height:1.4}.hn-pr-group{margin:0;padding:12px 0 8px;border:0;min-width:0}.hn-pr-group+.hn-pr-group,.hn-pr-slot:not(:empty){border-top:1px solid var(--line-soft)}@media (min-width:820px){.hn-practice.is-open .hn-practice__body{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);column-gap:28px}.hn-practice__body .hn-pr-group+.hn-pr-group{border-top:0}.hn-practice__body .hn-pr-slot{grid-column:1/-1}.hn-pr-grid{grid-template-columns:5.5rem 5.5rem minmax(0,1fr)}}.hn-pr-group legend{padding:0;margin:0 0 8px;font:600 15px/1.3 var(--font-ui);color:var(--ink);float:left;width:100%}.hn-pr-group legend+*{clear:both}.hn-pr-grid{display:grid;grid-template-columns:6.5rem 6.5rem minmax(0,1fr);gap:12px;align-items:end}.hn-pr-field{display:block;min-width:0}.hn-pr-field .hn-label{font-weight:500;font-size:13px;color:var(--muted);margin-bottom:4px}.hn-pr-num{width:100%;min-height:44px;font-variant-numeric:tabular-nums}.hn-pr-field .hn-select{min-height:44px;font-size:15px;text-overflow:ellipsis}@media (max-width:559.98px){.hn-pr-grid{grid-template-columns:1fr 1fr}.hn-pr-field--line{grid-column:1/-1}}.hn-pr-actions{display:flex;flex-wrap:wrap;gap:8px;margin:10px 0 2px}.hn-pr-row{padding:2px 0}.hn-pr-row .hn-switch-row__help{max-width:52ch}.hn-pr-speedhint{margin:6px 0 0}.hn-practice__status{margin:0;padding:0 16px;min-height:0;font-size:13px;color:var(--muted)}.hn-practice__status:not(:empty){padding-bottom:12px}.hn-pr-beats{display:flex;gap:8px;margin:8px 0 2px;min-height:14px}.hn-pr-beats[hidden]{display:none}.hn-pr-beat{width:14px;height:14px;border-radius:50%;background:var(--track);box-shadow:inset 0 0 0 1px var(--line)}.hn-pr-beat.is-on{background:var(--accent);box-shadow:none}.hn-pr-beat[data-n="1"]{width:18px;margin-top:-2px;height:18px}.hn-practice.is-counting .hn-pr-beats{outline:2px solid var(--accent);outline-offset:4px;border-radius:10px}.learn-progress{position:relative}.hn-pr-band,.hn-pr-layer{position:absolute;pointer-events:none}.hn-pr-band{top:5px;height:12px;border-radius:3px;box-sizing:border-box;background:var(--player-hover, rgba(255, 255, 255, .25));border:1px solid var(--player-line, rgba(255, 255, 255, .8))}.hn-pr-band[hidden]{display:none}.hn-pr-layer{inset:0;z-index:3}.hn-pr-region{position:absolute;box-sizing:border-box;border-radius:8px;background:rgba(52,52,184,.1);border-left:3px solid var(--accent);border-right:3px solid var(--accent)}:root[data-theme=dark] .hn-pr-region{background:rgba(120,122,255,.16);border-color:#8284ff}.hn-pr-picking .learn-line-notation{cursor:pointer;outline:2px dashed var(--accent);outline-offset:2px;border-radius:6px}.hn-practice.is-picking .hn-pr-actions [data-pr=pick]{background:var(--accent);color:var(--on-accent)!important}.hn-pr-pa{padding:12px 0 4px}.hn-pr-pa legend{margin-bottom:8px}.hn-pr-pa__lead{margin:0 0 10px;color:var(--muted);font-size:14px}.hn-pr-pa__bar{display:flex;flex-wrap:wrap;align-items:center;gap:8px;margin:8px 0}.hn-pr-pa__bar .hn-select{min-height:44px;font-size:15px}.hn-pr-pa__oct{display:inline-flex;align-items:center;gap:8px}.hn-pr-pa__oct .hn-label{margin:0;font-weight:500}.hn-pr-device{font-size:13px;color:var(--muted);margin:4px 0 0}.hn-pr-warn{margin:8px 0;padding:10px 12px;border-radius:var(--r);background:var(--offline-bg, #FFF1D6);color:var(--offline-fg, #5C3900);font-size:14px}.hn-pr-score{margin:10px 0 4px;padding:14px 16px;border-radius:var(--r-md);background:var(--accent-soft);border:1px solid var(--line)}.hn-pr-score h3{margin:0 0 6px;font:600 16px/1.3 var(--font-ui)}.hn-pr-score dl{display:grid;grid-template-columns:max-content 1fr;gap:4px 16px;margin:0}.hn-pr-score dt{color:var(--muted);font-weight:400}.hn-pr-score dd{margin:0;font-weight:600;font-variant-numeric:tabular-nums}.hn-pr-mark,.hn-pr-mark::after{position:absolute;box-sizing:border-box}.hn-pr-mark{border-radius:10px;width:30px;margin-left:-15px;border:2px solid transparent;transition:opacity .25s ease}.hn-pr-mark::after{content:"";bottom:-13px;left:50%;width:18px;height:18px;margin-left:-9px;border-radius:50%;background-color:#fff;background-repeat:no-repeat;background-position:center;background-size:12px 12px;box-shadow:0 0 0 2px currentColor}.hn-pr-mark--now::after{display:none}.hn-pr-mark--ok{color:var(--pr-ok-line)}.hn-pr-mark--bad{color:var(--pr-bad-line)}.hn-pr-mark--now{background:rgba(52,52,184,.13);border-color:var(--pr-now)}.hn-pr-mark--ok{background:var(--pr-ok-soft);border-color:var(--pr-ok-line)}.hn-pr-mark--ok::after{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M3 8.5l3.2 3.2L13 4.8' fill='none' stroke='%231B7F47' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E")}.hn-pr-mark--bad{background:var(--pr-bad-soft);border-color:var(--pr-bad-line);animation:hn-pr-flash .45s ease-out 1}.hn-pr-mark--bad::after{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M4 4l8 8M12 4l-8 8' fill='none' stroke='%23C2362B' stroke-width='2.4' stroke-linecap='round'/%3E%3C/svg%3E")}@media (prefers-reduced-motion:reduce){.hn-pr-mark--bad{animation:none}.hn-pr-mark{transition:none}}.syl.hn-pr-ok .syl-ink{color:var(--pr-ok)}.syl.hn-pr-bad .syl-ink{color:var(--pr-bad)}.hn-pr-keys{margin:10px 0 4px;user-select:none;-webkit-user-select:none;touch-action:manipulation}.hn-pr-key,.hn-pr-keys__row{position:relative;display:flex}.hn-pr-keys__row{height:112px;max-width:560px}.hn-pr-key{flex:1 1 0;min-width:0;height:100%;margin:0 1px 0 0;border:1px solid var(--line);border-radius:0 0 8px 8px;background:#fff;color:#17182b;cursor:pointer;font:500 11px/1 var(--font-ui);align-items:flex-end;justify-content:center;padding:0 0 6px;-webkit-tap-highlight-color:transparent}.hn-pr-key.is-down,.hn-pr-key:active{background:#d8daff}.hn-pr-key--black{position:absolute;top:0;height:62%;z-index:1;flex:none;width:5.2%;margin:0 0 0-2.6%;background:#17182b;color:#fff;border-color:#17182b;border-radius:0 0 6px 6px;padding-bottom:4px}.hn-pr-key--black.is-down,.hn-pr-key--black:active{background:#4a4db0}.hn-pr-key:focus-visible{outline:3px solid var(--accent);outline-offset:1px;z-index:2}.hn-pr-key--hint::before{content:"";position:absolute;top:8px;left:50%;width:10px;height:10px;margin-left:-5px;border-radius:50%;background:var(--accent)}@media (max-width:559.98px){.hn-pr-keys__row{height:96px}}