.sp-app{max-width:1040px;margin:0 auto;padding:28px 16px 64px;color:var(--gl-ink);font-family:"Ubuntu",sans-serif}.sp-app [hidden]{display:none !important}.sp-app button{font-family:inherit;-webkit-tap-highlight-color:rgba(0,0,0,0)}.sp-app svg:not(.sp-board):not(.sp-figure){fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}.sp-top{display:flex;align-items:flex-end;justify-content:space-between;flex-wrap:wrap;gap:14px 24px}.sp-title h1{font-size:clamp(1.45rem,2.6vw,1.85rem);font-weight:800;color:var(--gl-ink);margin:0 0 4px}.sp-title p{margin:0;color:var(--gl-gray-500);max-width:520px;line-height:1.45}.sp-master-link{display:inline-block;margin-top:6px;font-size:.9rem;font-weight:700;color:var(--gl-gold-deep);text-decoration:none}.sp-master-link::after{content:" ›"}.sp-master-link:hover{color:var(--gl-gold-dark);text-decoration:underline}.sp-modes{display:flex;background:var(--gl-gray-100);border-radius:14px;padding:4px;gap:2px}.sp-mode{display:flex;align-items:center;gap:8px;border:0;background:rgba(0,0,0,0);border-radius:11px;padding:9px 14px;font-weight:700;font-size:.92rem;color:var(--gl-gray-500);cursor:pointer;transition:background .15s,color .15s}.sp-mode svg{width:18px;height:18px}.sp-mode.is-active{background:var(--gl-white);color:var(--gl-ink);box-shadow:0 1px 4px rgba(var(--gl-black-rgb), 0.12)}.sp-picker{display:flex;flex-wrap:wrap;gap:8px;margin:20px 0 12px}.sp-chip{position:relative;display:flex;flex-direction:column;align-items:flex-start;gap:1px;min-width:96px;border:1px solid var(--gl-gray-200);background:var(--gl-white);border-radius:12px;padding:8px 34px 8px 13px;text-align:left;cursor:pointer;transition:border-color .15s,box-shadow .15s}.sp-chip::after{content:"";position:absolute;right:14px;top:50%;width:7px;height:7px;margin-top:-6px;border-right:2px solid var(--gl-gray-400);border-bottom:2px solid var(--gl-gray-400);transform:rotate(45deg);transition:transform .15s}.sp-chip strong{font-size:.98rem;white-space:nowrap}.sp-chip:hover{border-color:var(--gl-gray-300)}.sp-chip.is-open{border-color:var(--gl-gold);box-shadow:0 0 0 3px rgba(var(--gl-gold-rgb), 0.18)}.sp-chip.is-open::after{transform:rotate(-135deg);margin-top:-2px}.sp-chip-label{font-size:.68rem;font-weight:700;text-transform:uppercase;letter-spacing:.05em;color:var(--gl-gray-400)}.sp-backdrop{position:fixed;inset:0;z-index:1150}.sp-panel{position:relative;z-index:1160;background:var(--gl-white);border:1px solid var(--gl-gray-200);border-radius:16px;padding:18px;margin-bottom:14px;box-shadow:0 16px 40px rgba(15,18,30,.12);animation:sp-panel-in .16s ease-out}.sp-panel h2{font-size:.74rem;font-weight:800;text-transform:uppercase;letter-spacing:.05em;color:var(--gl-gray-500);margin:0 0 10px}.sp-panel h2:not(:first-child){margin-top:18px}@keyframes sp-panel-in{from{opacity:0;transform:translateY(-6px)}}.sp-grid{display:grid;gap:8px}.sp-grid-keys{grid-template-columns:repeat(6, 1fr)}.sp-grid-pos{grid-template-columns:repeat(auto-fill, minmax(64px, 1fr))}.sp-grid-rhythm{grid-template-columns:repeat(4, 1fr)}.sp-grid-rhythm .sp-option{align-items:center;text-align:center;gap:4px;padding:12px 8px 10px}.sp-figure{height:32px;width:auto;margin-bottom:2px;fill:var(--gl-ink);stroke:none}.sp-figure text{font-size:9px;font-weight:800;font-style:italic}.sp-list{display:grid;grid-template-columns:repeat(auto-fill, minmax(220px, 1fr));gap:8px}.sp-option{display:flex;flex-direction:column;align-items:flex-start;justify-content:center;gap:2px;min-height:46px;border:1px solid var(--gl-gray-200);background:var(--gl-white);border-radius:11px;padding:9px 13px;text-align:left;font-weight:700;font-size:.95rem;color:var(--gl-ink);cursor:pointer;transition:border-color .12s,background .12s}.sp-option small{font-weight:500;font-size:.8rem;color:var(--gl-gray-500)}.sp-option:hover{border-color:var(--gl-gray-300)}.sp-option.is-active{border-color:var(--gl-gold);background:var(--gl-warm-bg);box-shadow:inset 0 0 0 1px var(--gl-gold)}.sp-grid-keys .sp-option,.sp-grid-pos .sp-option{align-items:center;font-size:1.05rem}.sp-panel-note{margin:10px 0 0;font-size:.85rem;color:var(--gl-gray-500)}.sp-panel-note:empty{display:none}.sp-stage{position:relative;scroll-margin-top:104px;background:radial-gradient(120% 120% at 50% 0%, #252a37 0%, #15171e 62%);color:#f4f5f7;border-radius:22px;padding:20px 22px 18px;box-shadow:0 22px 50px rgba(15,18,30,.22)}.sp-hud{display:flex;align-items:flex-start;justify-content:space-between;gap:16px}.sp-hud-main{display:flex;flex-wrap:wrap;gap:10px 34px}.sp-hud-main>div{display:flex;flex-direction:column;gap:2px}.sp-hud-main>div strong{font-size:clamp(2.1rem,5vw,2.9rem);font-weight:800;line-height:1;letter-spacing:-0.01em}.sp-hud-chord strong{color:#2dd4bf}.sp-hud-note strong{color:var(--gl-gold)}.sp-hud-label{font-size:.7rem;font-weight:700;text-transform:uppercase;letter-spacing:.08em;color:#9aa0ad}.sp-hud-next{font-size:.92rem;color:#9aa0ad;min-height:1.3em}.sp-hud-next b{color:#f4f5f7;font-weight:700}.sp-hud-chord.is-change strong{animation:sp-chord .45s ease-out}@keyframes sp-chord{0%{transform:scale(1.15);text-shadow:0 0 22px rgba(45,212,191,.7)}}.sp-tempo{display:flex;align-items:center;gap:10px;flex:none}.sp-icon-btn{display:grid;place-items:center;width:40px;height:40px;border-radius:50%;border:1px solid rgba(255,255,255,.09);background:rgba(255,255,255,.06);color:#f4f5f7;cursor:pointer;transition:background .12s}.sp-icon-btn svg{width:18px;height:18px}.sp-icon-btn:hover{background:rgba(255,255,255,.12)}.sp-bpm{display:flex;flex-direction:column;align-items:center;margin:0;line-height:1}.sp-bpm input{width:3.1ch;border:0;padding:0;background:rgba(0,0,0,0);color:#f4f5f7;font-size:2.3rem;font-weight:800;text-align:center;-moz-appearance:textfield}.sp-bpm input::-webkit-inner-spin-button,.sp-bpm input::-webkit-outer-spin-button{-webkit-appearance:none}.sp-bpm input:focus{outline:none}.sp-bpm span{font-size:.68rem;font-weight:700;letter-spacing:.08em;color:#9aa0ad}.sp-form{display:grid;grid-template-columns:repeat(4, 1fr);gap:6px;margin:18px 0 2px}.sp-form span{padding:6px 10px;border-radius:8px;border:1px solid rgba(255,255,255,.09);background:rgba(255,255,255,.03);font-weight:700;font-size:.9rem;color:#9aa0ad;transition:background .15s,color .15s,border-color .15s}.sp-form span.is-now{background:rgba(45,212,191,.16);border-color:#2dd4bf;color:#f4f5f7}.sp-form span.is-next{border-color:rgba(45,212,191,.35)}.sp-neck{position:relative;margin:14px -8px 0}.sp-board-wrap{overflow-x:auto;-webkit-overflow-scrolling:touch;scrollbar-width:none}.sp-board-wrap::-webkit-scrollbar{display:none}.sp-board{display:block;width:100%;max-width:680px;min-width:440px;height:auto;margin:0 auto}.sp-board .sp-string{stroke:#d6d9df}.sp-board .sp-fret{stroke:#8e929c;stroke-width:2.5}.sp-board .sp-nut{stroke:#ece4d2;stroke-width:7}.sp-board .sp-inlay{fill:#efe6d2;opacity:.28}.sp-board .sp-fret-num{fill:#9aa0ad;font-size:13px;font-weight:700;text-anchor:middle}.sp-dot{transition:opacity .15s}.sp-dot .sp-dot-ring{fill:none;stroke:rgba(0,0,0,0);stroke-width:3}.sp-dot .sp-dot-body{fill:#eef0f4;stroke:rgba(0,0,0,.35);stroke-width:1;transition:fill .12s}.sp-dot text{fill:#15171e;font-size:11px;font-weight:800;text-anchor:middle;pointer-events:none}.sp-dot.is-root .sp-dot-body{fill:#a578dc}.sp-dot.is-root text{fill:#fff}.sp-dot.is-done{opacity:.35}.sp-dot.is-target{filter:drop-shadow(0 0 9px rgba(239, 182, 39, 0.85))}.sp-dot.is-target .sp-dot-body{fill:var(--gl-gold)}.sp-dot.is-target text{fill:#15171e}.sp-dot.is-target .sp-dot-ring{stroke:var(--gl-gold);transform-box:fill-box;transform-origin:center;animation:sp-pulse 1s ease-out infinite}.sp-dot.is-miss .sp-dot-body{animation:sp-miss .6s ease-out}.sp-dot.is-chord{filter:drop-shadow(0 0 7px rgba(45, 212, 191, 0.55))}.sp-dot.is-chord .sp-dot-body{fill:#2dd4bf}.sp-dot.is-chord text{fill:#0b1f1d}.sp-dot.is-off-chord .sp-dot-body{fill:#3b404d}.sp-dot.is-off-chord text{fill:#c9cdd6}.sp-dot.is-heard .sp-dot-ring{stroke:#fff;stroke-width:3.5}.sp-dot.is-heard-chord .sp-dot-ring{stroke:#2dd4bf}@keyframes sp-pulse{0%{opacity:1;transform:scale(0.9)}100%{opacity:0;transform:scale(1.55)}}@keyframes sp-miss{0%,45%{fill:#f87171}}.sp-count{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;font-size:clamp(4rem,12vw,7rem);font-weight:800;color:#fff;text-shadow:0 6px 30px rgba(0,0,0,.5);background:rgba(21,23,30,.45);border-radius:14px;pointer-events:none}.sp-count.is-tick{animation:sp-count .5s ease-out}@keyframes sp-count{0%{transform:scale(1.35);opacity:.4}}.sp-beats{display:flex;justify-content:center;gap:10px;margin-top:6px}.sp-beats span{width:9px;height:9px;border-radius:50%;background:rgba(255,255,255,.14);transition:background .06s,transform .06s}.sp-beats span.is-on{background:var(--gl-gold);transform:scale(1.3)}.sp-beats span:first-child.is-on{background:#fff}.sp-route{display:flex;flex-wrap:wrap;justify-content:center;gap:4px;margin:12px auto 0;max-width:760px}.sp-route span{flex:1 1 6px;max-width:20px;height:4px;border-radius:2px;background:rgba(255,255,255,.12)}.sp-route span.is-done{background:rgba(255,255,255,.45)}.sp-route span.is-target{background:var(--gl-gold)}.sp-legend{display:flex;justify-content:center;gap:18px;flex-wrap:wrap;margin:12px 0 0;font-size:.84rem;color:#9aa0ad}.sp-legend span::before{content:"";display:inline-block;width:10px;height:10px;border-radius:50%;margin-right:7px;vertical-align:-1px}.sp-legend .sp-legend-chord::before{background:#2dd4bf}.sp-legend .sp-legend-scale::before{background:#3b404d}.sp-status{min-height:2.9em;margin:12px auto 10px;max-width:620px;text-align:center;font-size:1.02rem;font-weight:600;line-height:1.45;color:#9aa0ad}.sp-status.is-ok{color:#f4f5f7}.sp-status.is-miss{color:#f87171}.sp-transport{display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:14px}.sp-transport-side{display:flex;align-items:center;gap:14px;min-width:0}.sp-transport-right{justify-content:flex-end}.sp-play{display:grid;place-items:center;width:76px;height:76px;border-radius:50%;border:0;background:var(--gl-gold);color:#15171e;box-shadow:0 10px 28px rgba(var(--gl-gold-rgb), 0.35);cursor:pointer;transition:transform .12s,background .12s}.sp-play svg{width:30px;height:30px;fill:currentColor;stroke:none}.sp-play .sp-stop-icon{display:none}.sp-play:hover{transform:scale(1.04)}.sp-play:active{transform:scale(0.97)}.sp-play:disabled{opacity:.6;cursor:wait}.is-running .sp-play{background:#f4f5f7;box-shadow:0 10px 28px rgba(0,0,0,.35)}.is-running .sp-play .sp-play-icon{display:none}.is-running .sp-play .sp-stop-icon{display:block}.sp-toggle{display:inline-flex;background:rgba(255,255,255,.06);border-radius:10px;padding:3px}.sp-toggle button{border:0;background:rgba(0,0,0,0);color:#9aa0ad;font-weight:700;font-size:.82rem;padding:6px 11px;border-radius:8px;cursor:pointer}.sp-toggle button.is-active{background:rgba(255,255,255,.14);color:#f4f5f7}.sp-meter{display:flex;align-items:center;gap:8px}.sp-meter svg{width:16px;height:16px;color:#9aa0ad}.sp-meter strong{min-width:2.6em;font-size:.9rem;color:#f4f5f7}.sp-meter-bar{width:64px;height:6px;border-radius:3px;background:rgba(255,255,255,.1);overflow:hidden}.sp-meter-bar span{display:block;height:100%;width:0;background:#34d399;transition:width .06s linear}.sp-volume{display:flex;align-items:center;gap:8px;margin:0}.sp-volume svg{width:18px;height:18px;color:#9aa0ad}.sp-volume input{width:96px;accent-color:var(--gl-gold)}.sp-demo-btn{display:inline-flex;align-items:center;gap:7px}.sp-demo-btn svg{width:16px;height:16px}.sp-app.is-demo .sp-demo-btn{background:var(--gl-gold);border-color:var(--gl-gold);color:#15171e}.sp-text-btn{border:1px solid rgba(255,255,255,.09);background:rgba(0,0,0,0);color:#f4f5f7;border-radius:10px;padding:8px 12px;font-weight:700;font-size:.84rem;cursor:pointer;white-space:nowrap}.sp-text-btn:hover{background:rgba(255,255,255,.06)}.sp-switches{display:flex;flex-wrap:wrap;align-items:center;gap:10px 24px;margin-top:18px;padding-top:14px;border-top:1px solid rgba(255,255,255,.09)}.sp-switch{display:flex;align-items:center;gap:10px;margin:0;cursor:pointer}.sp-switch input{position:absolute;opacity:0;pointer-events:none}.sp-switch span{position:relative;flex:none;width:34px;height:20px;border-radius:10px;background:rgba(255,255,255,.18);transition:background .15s}.sp-switch span::after{content:"";position:absolute;left:2px;top:2px;width:16px;height:16px;border-radius:50%;background:#fff;transition:transform .15s}.sp-switch input:checked+span{background:var(--gl-gold)}.sp-switch input:checked+span::after{transform:translateX(14px)}.sp-switch input:focus-visible+span{box-shadow:0 0 0 3px rgba(var(--gl-gold-rgb), 0.4)}.sp-switch em{font-style:normal;font-size:.88rem;color:#9aa0ad}.sp-hint{flex-basis:100%;margin:0;font-size:.82rem;color:#9aa0ad}.sp-progress{padding:0;display:grid;grid-template-columns:repeat(auto-fit, minmax(180px, 1fr));gap:12px;margin-top:16px}.sp-stat{background:var(--gl-white);border:1px solid var(--gl-gray-200);border-radius:14px;padding:14px 16px}.sp-stat span{display:block;font-size:.8rem;color:var(--gl-gray-500)}.sp-stat strong{font-size:1.45rem;font-weight:800;font-variant-numeric:tabular-nums}.sp-stat-progress{position:relative}.sp-stat-progress>span{display:flex;align-items:center;gap:7px}.sp-live-dot{width:8px;height:8px;border-radius:50%;background:var(--gl-gray-300);transition:background .2s}.sp-live-dot.is-on{background:#16a34a;box-shadow:0 0 0 4px rgba(22,163,74,.15)}.sp-stat-link{position:absolute;right:14px;top:13px;font-size:.78rem;font-weight:700;color:var(--gl-gold-deep);text-decoration:none}.sp-stat-link::after{content:" ›"}.sp-stat-link:hover{text-decoration:underline}.sp-history{padding:0;margin-top:22px}.sp-history h2{font-size:.78rem;font-weight:800;text-transform:uppercase;letter-spacing:.05em;color:var(--gl-gray-500);margin:0 0 10px}.sp-history-list{list-style:none;margin:0;padding:4px 16px;background:var(--gl-white);border:1px solid var(--gl-gray-200);border-radius:14px}.sp-history-list li{display:grid;grid-template-columns:110px 1fr auto;align-items:center;gap:14px;padding:11px 0}.sp-history-list li+li{border-top:1px solid var(--gl-gray-100)}.sp-h-date{font-size:.82rem;font-weight:600;color:var(--gl-gray-500)}.sp-h-main{display:flex;flex-direction:column;min-width:0}.sp-h-main b{font-size:.95rem}.sp-h-main small{font-size:.8rem;color:var(--gl-gray-500)}.sp-h-metric{text-align:right;font-size:.82rem;color:var(--gl-gray-500);white-space:nowrap}.sp-h-metric b{font-size:1.15rem;color:var(--gl-ink)}.sp-h-metric small{display:block;font-size:.75rem}.sp-log{grid-column:1/-1;list-style:none;margin:0;padding:6px 16px;background:var(--gl-white);border:1px solid var(--gl-gray-200);border-radius:14px}.sp-log:empty{display:none}.sp-log li{position:relative;padding:9px 0 9px 22px;font-size:.92rem}.sp-log li+li{border-top:1px solid var(--gl-gray-100)}.sp-log li::before{content:"";position:absolute;left:3px;top:50%;width:9px;height:9px;margin-top:-4px;border-radius:50%}.sp-log li.is-clean::before{background:#16a34a}.sp-log li.is-dirty::before{background:var(--gl-gray-300)}.sp-summary{position:fixed;inset:0;z-index:1300;display:flex;align-items:center;justify-content:center;padding:16px;background:rgba(15,17,24,.55);backdrop-filter:blur(4px)}.sp-summary-card{width:100%;max-width:420px;background:var(--gl-white);border-radius:22px;padding:26px 24px 22px;box-shadow:0 30px 70px rgba(0,0,0,.3);animation:sp-panel-in .2s ease-out}.sp-summary-card h2{font-size:1.4rem;font-weight:800;margin:0 0 4px}.sp-summary-what{color:var(--gl-gray-500);margin:0 0 18px}.sp-summary-stats{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin:0 0 20px}.sp-summary-stats div{background:var(--gl-gray-50);border-radius:12px;padding:12px 14px}.sp-summary-stats dt{font-size:.78rem;font-weight:600;color:var(--gl-gray-500)}.sp-summary-stats dd{margin:2px 0 0;font-size:1.5rem;font-weight:800;font-variant-numeric:tabular-nums}.sp-summary-save{margin:-6px 0 16px;font-size:.88rem;color:var(--gl-gray-500)}.sp-summary-save:empty{display:none}.sp-summary-save a{font-weight:700;color:var(--gl-gold-deep)}.sp-primary{width:100%;height:48px;border:0;border-radius:12px;background:var(--gl-gold);color:var(--gl-ink);font-weight:800;font-size:1rem;cursor:pointer}.sp-primary:hover{background:var(--gl-gold-hover)}.sp-toast{position:fixed;left:50%;top:84px;z-index:1400;transform:translate(-50%, -12px);background:var(--gl-ink);color:var(--gl-white);padding:10px 18px;border-radius:12px;font-weight:700;box-shadow:0 12px 30px rgba(0,0,0,.25);opacity:0;pointer-events:none;max-width:calc(100vw - 32px)}.sp-toast.is-visible{animation:sp-toast 3.2s ease forwards}@keyframes sp-toast{0%{opacity:0;transform:translate(-50%, -12px)}8%,85%{opacity:1;transform:translate(-50%, 0)}100%{opacity:0;transform:translate(-50%, -12px)}}.sp-app:not(.is-follow) .sp-follow-only,.sp-app:not(.is-improv) .sp-improv-only,.sp-app:not(.has-backing) .sp-backing-only,.is-follow .sp-mic-only,.is-improv .sp-mic-only,.is-improv .sp-route-only,.is-follow .sp-mic-meter,.is-follow .sp-mic-hint,.is-improv:not(.has-improv-mic) .sp-mic-meter,.is-improv:not(.has-improv-mic) .sp-mic-hint,.has-backing .sp-metronome-only{display:none !important}@media only screen and (max-width:991px){.sp-app{padding-top:18px}.sp-top{align-items:stretch}.sp-modes{width:100%}.sp-mode{flex:1;justify-content:center;padding:9px 6px}.sp-picker{flex-wrap:nowrap;overflow-x:auto;margin:16px -16px 12px;padding:2px 16px;scrollbar-width:none}.sp-picker::-webkit-scrollbar{display:none}.sp-chip{flex:none}.sp-backdrop{background:rgba(15,17,24,.45)}.sp-app .sp-panel{position:fixed;left:0;right:0;bottom:0;margin:0;max-height:78svh;overflow-y:auto;border-radius:20px 20px 0 0;padding:20px 16px 28px;animation:sp-sheet-in .2s ease-out}@supports(height: 100lvh){.sp-app .sp-panel{padding-bottom:max(28px,100lvh - 100svh + 20px)}}.sp-grid-keys{grid-template-columns:repeat(4, 1fr)}.sp-grid-rhythm{grid-template-columns:repeat(2, 1fr)}.sp-list{grid-template-columns:1fr}.sp-stage{border-radius:18px;padding:16px 14px 14px}.sp-bpm input{font-size:2rem}.sp-transport{grid-template-columns:1fr;justify-items:center}.sp-play{order:-1}.sp-transport-side{width:100%;justify-content:center;flex-wrap:wrap}.sp-progress{grid-template-columns:repeat(auto-fit, minmax(100px, 1fr));gap:8px}.sp-stat{padding:10px 12px}.sp-stat-link{position:static;display:inline-block;margin-top:2px;font-size:.72rem}.sp-history-list li{grid-template-columns:1fr auto;gap:4px 12px}.sp-h-date{grid-column:1/-1}.sp-h-date span{font-size:.72rem;line-height:1.25}.sp-h-date strong{font-size:1.15rem}.sp-board{min-width:0}}@keyframes sp-sheet-in{from{transform:translateY(40px);opacity:0}}@media only screen and (max-width:991px){body.sp-focus{overflow:hidden}body.sp-focus .sp-stage{position:fixed;inset:0 0 auto 0;z-index:1100;height:100vh;height:100lvh;margin:0;border-radius:0;display:flex;flex-direction:column;padding:max(14px,env(safe-area-inset-top)) 14px 20px;padding-bottom:max(100lvh - 100svh + 20px,env(safe-area-inset-bottom));overflow-y:auto;overscroll-behavior:contain}body.sp-focus .sp-neck{margin:auto -6px}body.sp-focus .sp-board{min-width:0}body.sp-focus .sp-switches,body.sp-focus .sp-hint{display:none}body.sp-focus .sp-toast{top:16px}}/*# sourceMappingURL=scale-practice.css.map */