@import"https://fonts.googleapis.com/css2?family=DM+Mono:wght@400;500&family=Manrope:wght@400;500;600;700;800&family=Noto+Music&display=swap";.login-page[data-v-5bcab052]{position:relative;min-height:100vh;min-height:100dvh;display:grid;grid-template-columns:minmax(0,1.15fr) minmax(420px,.85fr);overflow:hidden;background:radial-gradient(circle at 22% 25%,rgba(162,202,113,.13),transparent 32rem),radial-gradient(circle at 72% 84%,rgba(70,98,84,.1),transparent 26rem),var(--bg-deep)}.login-grid[data-v-5bcab052]{position:absolute;inset:0;opacity:.4;background-image:linear-gradient(rgba(255,255,255,.018) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.018) 1px,transparent 1px);background-size:42px 42px;-webkit-mask-image:linear-gradient(90deg,#000,transparent 80%);mask-image:linear-gradient(90deg,#000,transparent 80%)}.login-intro[data-v-5bcab052],.login-panel[data-v-5bcab052]{position:relative;z-index:1}.login-intro[data-v-5bcab052]{min-height:100vh;min-height:100dvh;display:flex;flex-direction:column;padding:clamp(28px,5vw,72px)}.login-brand[data-v-5bcab052]{width:fit-content;display:flex;align-items:center;gap:12px;color:var(--text-primary);text-decoration:none}.login-copy[data-v-5bcab052]{margin:auto 0}.login-copy h1[data-v-5bcab052]{max-width:750px;margin:18px 0 20px;font-size:clamp(3rem,6.2vw,6.7rem);letter-spacing:-.075em;line-height:.96}.login-copy h1 em[data-v-5bcab052]{color:var(--accent);font-style:normal}.login-copy p[data-v-5bcab052]{max-width:510px;margin:0;color:var(--text-muted);font-size:clamp(.85rem,1.2vw,1rem);line-height:1.7}.login-staff[data-v-5bcab052]{position:relative;width:min(100%,560px);height:70px;display:flex;flex-direction:column;justify-content:space-between;margin-top:auto;opacity:.28}.login-staff i[data-v-5bcab052]{width:100%;border-top:1px solid #89968f}.login-staff span[data-v-5bcab052]{position:absolute;right:24%;top:50%;width:34px;height:26px;display:grid;place-items:center;border-radius:50%;background:var(--accent);color:#11170e;font-family:DM Mono,monospace;font-size:.78rem;font-weight:800;transform:translateY(-50%) rotate(-9deg)}.login-panel[data-v-5bcab052]{display:grid;place-items:center;padding:clamp(22px,5vw,70px);border-left:1px solid var(--line-soft);background:#0c120fad;-webkit-backdrop-filter:blur(22px) saturate(120%);backdrop-filter:blur(22px) saturate(120%)}.login-card[data-v-5bcab052]{width:min(100%,430px);padding:clamp(28px,3.5vw,44px);border:1px solid var(--line-soft);border-radius:26px;background:linear-gradient(145deg,rgba(255,255,255,.045),transparent 36%),#111815d1;box-shadow:0 32px 90px #00000052,inset 0 1px #ffffff09}.login-card-heading[data-v-5bcab052]{display:flex;align-items:flex-start;gap:14px;margin-bottom:38px}.login-index[data-v-5bcab052]{padding-top:7px;color:var(--accent);font-family:DM Mono,monospace;font-size:.62rem}.login-card-heading h2[data-v-5bcab052]{margin:0;font-size:2rem;letter-spacing:-.055em}.login-card-heading p[data-v-5bcab052]{margin:5px 0 0;color:var(--text-muted);font-size:.76rem}.login-form[data-v-5bcab052]{display:flex;flex-direction:column}.login-form>label[data-v-5bcab052]{margin:0 0 8px;color:var(--text-muted);font-family:DM Mono,monospace;font-size:.57rem;letter-spacing:.1em}.login-form>label[data-v-5bcab052]:not(:first-child){margin-top:20px}.login-input[data-v-5bcab052]{height:50px;display:flex;align-items:center;gap:10px;padding:0 14px;border:1px solid var(--line);border-radius:11px;background:linear-gradient(145deg,var(--panel-raised),var(--panel-light));transition:border-color .16s ease,box-shadow .16s ease}.login-input[data-v-5bcab052]:focus-within{border-color:#d2ff51b3;box-shadow:0 0 0 3px #d2ff510f}.login-input>svg[data-v-5bcab052],.password-toggle svg[data-v-5bcab052]{width:17px;flex:0 0 auto;fill:none;stroke:var(--text-faint);stroke-linecap:round;stroke-linejoin:round;stroke-width:1.6}.login-input input[data-v-5bcab052]{min-width:0;height:100%;flex:1;border:0;outline:0;background:transparent;color:var(--text-primary);font-size:.78rem}.login-input input[data-v-5bcab052]::placeholder{color:var(--text-faint)}.password-toggle[data-v-5bcab052]{width:30px;height:30px;display:grid;place-items:center;padding:0;border:0;background:transparent;cursor:pointer}.login-error[data-v-5bcab052]{margin:14px 0 0;padding:10px 12px;border:1px solid rgba(255,111,92,.25);border-radius:7px;background:#ff6f5c12;color:#ff9d8d;font-size:.7rem}.login-submit[data-v-5bcab052]{height:49px;display:flex;align-items:center;justify-content:center;gap:10px;margin-top:28px;border:0;border-radius:11px;background:linear-gradient(135deg,#d8ff6c,var(--accent-strong));box-shadow:0 14px 34px #a3c94124,inset 0 1px #fff6;color:#10160e;font-family:DM Mono,monospace;font-size:.65rem;font-weight:800;letter-spacing:.07em;cursor:pointer}.login-submit[data-v-5bcab052]:disabled{opacity:.65}.login-submit svg[data-v-5bcab052]{width:16px;fill:none;stroke:currentColor;stroke-linecap:round;stroke-linejoin:round;stroke-width:1.8}.login-spinner[data-v-5bcab052]{width:15px;height:15px;border:2px solid rgba(16,22,14,.3);border-top-color:#10160e;border-radius:50%;animation:spin-5bcab052 .7s linear infinite}.login-security[data-v-5bcab052]{display:flex;align-items:center;justify-content:center;gap:7px;margin-top:25px;color:var(--text-faint);font-size:.62rem}.login-security svg[data-v-5bcab052]{width:14px;fill:none;stroke:var(--text-faint);stroke-linecap:round;stroke-linejoin:round;stroke-width:1.6}@keyframes spin-5bcab052{to{transform:rotate(360deg)}}@media(max-width:900px){.login-page[data-v-5bcab052]{grid-template-columns:1fr}.login-intro[data-v-5bcab052]{min-height:auto;padding-bottom:22px}.login-copy[data-v-5bcab052],.login-staff[data-v-5bcab052]{display:none}.login-panel[data-v-5bcab052]{min-height:calc(100vh - 86px);border-top:1px solid var(--line-soft);border-left:0}}@media(max-width:520px){.login-intro[data-v-5bcab052]{padding:20px}.login-panel[data-v-5bcab052]{align-items:start;padding:34px 16px 28px}.login-card[data-v-5bcab052]{padding:28px 22px;border-radius:20px}}.fretboard-region[data-v-70b860e6]{width:100%}.fretboard-scroll[data-v-70b860e6]{width:100%;overflow-x:auto;padding:0 0 .6rem;overscroll-behavior-x:contain;scroll-behavior:smooth;scrollbar-color:rgba(210,255,81,.35) rgba(255,255,255,.04);touch-action:pan-x;-webkit-overflow-scrolling:touch}.fretboard[data-v-70b860e6]{display:grid;grid-template-columns:68px repeat(var(--fret-count),minmax(64px,1fr));min-width:calc(68px + var(--fret-count) * 64px);border:1px solid #4d5149;border-radius:16px;background:repeating-linear-gradient(2deg,rgba(255,255,255,.016) 0 1px,transparent 1px 6px),linear-gradient(90deg,#211b18,#30251f 48%,#211b18);box-shadow:0 20px 52px #0000003d,inset 0 1px #ffffff0e;overflow:hidden}.corner-label[data-v-70b860e6],.fret-label[data-v-70b860e6]{min-height:42px;display:flex;align-items:center;justify-content:center;border-bottom:1px solid #484b44;color:var(--text-muted);font-size:.66rem;font-weight:700;letter-spacing:.08em}.corner-label[data-v-70b860e6]{position:sticky;z-index:4;left:0;background:#141714;box-shadow:5px 0 10px #00000029}.fret-label[data-v-70b860e6]{position:relative;border-left:1px solid #484b44}.fret-dots[data-v-70b860e6]{position:absolute;bottom:5px;left:50%;display:flex;gap:4px;transform:translate(-50%)}.fret-dots i[data-v-70b860e6]{width:4px;height:4px;border-radius:50%;background:#a59f8a;box-shadow:0 1px 2px #00000080}.string-label[data-v-70b860e6]{position:sticky;z-index:3;left:0;min-height:55px;display:flex;align-items:center;justify-content:center;gap:6px;border-top:1px solid rgba(255,255,255,.025);border-right:1px solid #4d5149;background:#141714;color:#9da9a3;transition:color .18s ease,background .18s ease;box-shadow:5px 0 10px #00000029}.has-open-string .string-label[data-v-70b860e6]{border-right:6px solid #d7d0b9;box-shadow:8px 0 14px #00000038}.string-label strong[data-v-70b860e6]{font-size:1rem}.string-label small[data-v-70b860e6]{color:#65716b;font-size:.62rem}.string-label.selected[data-v-70b860e6]{background:#d2ff5117;color:var(--accent)}.string-label.answer[data-v-70b860e6]{background:radial-gradient(circle at center,#cdf45c2e,#141714 72%)}.fret-cell[data-v-70b860e6]{position:relative;min-height:55px;border-left:2px solid #8d938c;border-top:1px solid rgba(255,255,255,.025);background:repeating-linear-gradient(2deg,rgba(255,255,255,.014) 0 1px,transparent 1px 6px),linear-gradient(90deg,#2b211c,#382a22 55%,#2a201b);box-shadow:inset 2px 0 #ffffff14,inset -1px 0 #00000038}.fret-cell[data-v-70b860e6]:after{content:"";position:absolute;z-index:1;top:50%;right:0;left:0;height:var(--string-weight);background:linear-gradient(#eef1ef,#87918c 48%,#d9dedb 54%,#737d78);box-shadow:0 1px 2px #000000d1;opacity:.55;transform:translateY(-50%)}.fret-cell.selected[data-v-70b860e6]:after{background:#dce3df;opacity:.88}.fret-cell.answer[data-v-70b860e6]{background:radial-gradient(circle at center,rgba(205,244,92,.24),transparent 54%),linear-gradient(90deg,#2b211c,#382a22 55%,#2a201b)}.note-marker[data-v-70b860e6]{position:absolute;z-index:2;top:50%;left:50%;width:38px;height:38px;display:grid;place-items:center;border:3px solid #273022;border-radius:50%;background:linear-gradient(145deg,#dcff76,var(--accent-strong));box-shadow:0 0 0 3px #cdf45c24,0 10px 24px #0000006b;color:#11170e;font-size:.78rem;font-weight:900;transform:translate(-50%,-50%);animation:marker-arrive-70b860e6 .42s cubic-bezier(.22,1,.36,1) both}.fretboard-hint[data-v-70b860e6]{margin:.5rem 0 0;color:var(--text-faint);font-size:.72rem;text-align:right}.fretboard-hint[data-v-70b860e6]:before{content:"↔";margin-right:7px;color:var(--accent)}@keyframes marker-arrive-70b860e6{0%{opacity:0;transform:translate(-50%,-50%) scale(.55)}to{opacity:1;transform:translate(-50%,-50%) scale(1)}}@media(pointer:coarse){.fretboard[data-v-70b860e6]{grid-template-columns:76px repeat(var(--fret-count),minmax(72px,1fr));min-width:calc(76px + var(--fret-count) * 72px)}.fret-label[data-v-70b860e6]{min-height:46px}.string-label[data-v-70b860e6],.fret-cell[data-v-70b860e6]{min-height:62px}.fretboard-hint[data-v-70b860e6]{min-height:28px;display:flex;align-items:center;justify-content:flex-end;font-size:.76rem}}.staff-wrap[data-v-824f6de1]{position:relative;width:min(100%,760px);padding:0 1rem;overflow:hidden;border:1px solid rgba(255,255,255,.72);border-radius:22px;background:repeating-linear-gradient(0deg,rgba(42,48,45,.018) 0 1px,transparent 1px 5px),radial-gradient(circle at 18% 10%,#faf7ee,transparent 32rem),var(--paper);box-shadow:0 24px 60px #0000003d,inset 0 0 42px #5b4f390e;color-scheme:light}.staff-wrap[data-v-824f6de1]:before{content:"";position:absolute;inset:10px;pointer-events:none;border:1px solid rgba(45,52,48,.055);border-radius:14px}.staff[data-v-824f6de1]{display:block;width:100%;height:clamp(240px,34vw,340px);overflow:visible}.staff-line[data-v-824f6de1],.staff-edge[data-v-824f6de1],.ledger-line[data-v-824f6de1]{stroke:var(--paper-ink);stroke-width:2}.ledger-line[data-v-824f6de1]{stroke-width:2.4}.clef[data-v-824f6de1]{fill:var(--paper-ink);font-family:Noto Music,Bravura Text,Segoe UI Symbol,serif}.treble-clef[data-v-824f6de1]{font-size:114px}.bass-clef[data-v-824f6de1]{fill:var(--paper-ink)}.note-head[data-v-824f6de1]{fill:#94b62f;stroke:none;filter:drop-shadow(0 3px 3px rgba(56,69,25,.18))}.note-stem[data-v-824f6de1]{stroke:#7f9d27;stroke-width:3;filter:drop-shadow(0 2px 2px rgba(56,69,25,.14))}.accidental[data-v-824f6de1]{fill:var(--paper-ink);font-family:Georgia,serif;font-size:35px;font-weight:700}.clef-label[data-v-824f6de1]{position:absolute;right:16px;bottom:12px;padding:4px 7px;border-radius:6px;background:#29302d0e;color:#626b67;font-size:.7rem;letter-spacing:.08em;text-transform:uppercase}.auth-loading[data-v-5c49f342]{min-height:100vh;min-height:100dvh;display:flex;align-items:center;justify-content:center;gap:12px;background:var(--bg-deep)}.auth-loading .brand-mark[data-v-5c49f342]{animation:loading-pulse-5c49f342 1s ease-in-out infinite alternate}@keyframes loading-pulse-5c49f342{to{opacity:.45;transform:rotate(-6deg) scale(.92)}}:root{color-scheme:dark;--bg: #0b100e;--bg-deep: #070b09;--panel: #111815;--panel-light: #18211d;--panel-raised: #1c2722;--line: #35413c;--line-soft: rgba(202, 218, 210, .12);--accent: #cdf45c;--accent-strong: #b8dd47;--accent-soft: rgba(205, 244, 92, .14);--paper: #f1ede2;--paper-ink: #29302d;--text-primary: #f3f6f4;--text-secondary: #b7c1bc;--text-muted: #8d9993;--text-faint: #68746e;--warning: #ffb45f;--radius-sm: 10px;--radius-md: 16px;--radius-lg: 24px;--shadow-panel: 0 28px 80px rgba(0, 0, 0, .28);font-family:Manrope,system-ui,sans-serif;font-synthesis:none;text-rendering:optimizeLegibility}*{box-sizing:border-box}html{min-width:320px;min-height:100%;background:var(--bg-deep)}body{min-width:320px;min-height:100vh;margin:0;background:radial-gradient(circle at 82% 4%,rgba(137,176,103,.11),transparent 34rem),radial-gradient(circle at 8% 82%,rgba(74,105,89,.08),transparent 30rem),var(--bg);color:var(--text-primary);-webkit-text-size-adjust:100%}::selection{background:var(--accent);color:#10150f}button,input{font:inherit}button{color:inherit}button:focus-visible,input:focus-visible,a:focus-visible{outline:2px solid var(--accent);outline-offset:3px}button:disabled{cursor:not-allowed}.app-shell{min-height:100vh;min-height:100dvh}.topbar{position:sticky;z-index:20;top:0;height:68px;display:grid;grid-template-columns:245px 1fr auto;align-items:center;padding:0 max(28px,env(safe-area-inset-right)) 0 max(28px,env(safe-area-inset-left));border-bottom:1px solid rgba(205,244,92,.08);background:#070b09d1;box-shadow:0 10px 35px #0000001f;-webkit-backdrop-filter:blur(22px) saturate(130%);backdrop-filter:blur(22px) saturate(130%)}.brand{display:flex;align-items:center;gap:12px;color:var(--text-primary);text-decoration:none}.brand-mark{position:relative;width:29px;height:29px;display:flex;align-items:center;justify-content:center;gap:3px;border:1px solid rgba(210,255,81,.45);border-radius:10px;background:linear-gradient(145deg,#cdf45c26,#cdf45c09);box-shadow:inset 0 1px #ffffff14,0 8px 24px #0000002e;transform:rotate(-6deg)}.brand-mark i{width:2px;border-radius:2px;background:var(--accent)}.brand-mark i:nth-child(1){height:9px}.brand-mark i:nth-child(2){height:17px}.brand-mark i:nth-child(3){height:12px}.brand-name{font-size:1.14rem;font-weight:800;letter-spacing:-.045em}.brand-name span{color:var(--accent)}.topbar-context{display:flex;align-items:center;justify-content:center;gap:9px;color:var(--text-muted);font-family:DM Mono,monospace;font-size:.64rem;letter-spacing:.12em}.status-dot{width:6px;height:6px;border-radius:50%;background:var(--accent);box-shadow:0 0 8px #d2ff5199}.user-button{min-width:34px;height:34px;display:flex;align-items:center;justify-content:center;gap:8px;padding:0 11px;border:1px solid var(--line);border-radius:18px;background:#18211dd1;color:var(--text-secondary);font-size:.66rem;cursor:pointer}.user-button svg{width:16px;fill:none;stroke:var(--text-secondary);stroke-linecap:round;stroke-linejoin:round;stroke-width:1.7}.user-button:hover{border-color:#d2ff5173;color:var(--accent)}.app-body{display:grid;grid-template-columns:245px minmax(0,1fr);min-height:calc(100vh - 68px)}.sidebar{position:sticky;top:68px;height:calc(100vh - 68px);display:flex;flex-direction:column;justify-content:space-between;padding:34px 17px 24px;border-right:1px solid var(--line-soft);background:linear-gradient(180deg,#0e1411d1,#0a0f0d9e)}.nav-heading{margin:0 14px 14px;color:var(--text-faint);font-family:DM Mono,monospace;font-size:.61rem;letter-spacing:.14em}.nav-item{width:100%;display:flex;align-items:center;gap:13px;padding:12px 14px;border:0;border-radius:12px;background:transparent;color:var(--text-muted);cursor:pointer;text-align:left}.nav-item+.nav-item{margin-top:4px}.nav-item svg{width:19px;flex:0 0 auto;fill:none;stroke:currentColor;stroke-linecap:round;stroke-linejoin:round;stroke-width:1.5}.nav-item span{display:flex;flex-direction:column;gap:2px}.nav-item strong{font-size:.78rem;font-weight:600}.nav-item small{color:var(--text-faint);font-size:.62rem}.nav-item.active{background:linear-gradient(90deg,#cdf45c29,#cdf45c0d);box-shadow:inset 3px 0 var(--accent);color:var(--accent)}.nav-item.active small{color:#91a45c}.nav-item:disabled{opacity:.56}.session-card{display:flex;gap:10px;padding:13px;border:1px solid var(--line-soft);border-radius:14px;background:linear-gradient(145deg,#ffffff09,#ffffff03)}.session-icon{width:26px;height:26px;display:grid;flex:0 0 auto;place-items:center;border-radius:50%;background:#d2ff5114}.session-icon svg{width:14px;fill:none;stroke:var(--accent);stroke-linecap:round;stroke-linejoin:round;stroke-width:1.5}.session-card>div{min-width:0;flex:1}.session-card small{display:block;color:var(--text-faint);font-family:DM Mono,monospace;font-size:.52rem;letter-spacing:.1em}.session-card strong{display:block;margin-top:2px;font-size:.66rem;font-weight:600}.main-content{min-width:0;padding:38px clamp(24px,4vw,64px) 56px}.page-heading{max-width:1500px;display:flex;align-items:flex-end;justify-content:space-between;margin:0 auto 27px}.eyebrow,.state-kicker{display:flex;align-items:center;gap:8px;color:var(--accent);font-family:DM Mono,monospace;font-size:.6rem;letter-spacing:.13em}.eyebrow>span{width:18px;height:1px;background:var(--accent)}.page-heading h1{margin:7px 0 3px;font-size:clamp(1.8rem,3.2vw,2.65rem);letter-spacing:-.055em;line-height:1.05}.page-heading p{margin:0;color:var(--text-muted);font-size:.84rem}.level-badge{display:flex;flex-direction:column;align-items:flex-end;gap:3px;padding-right:4px}.level-badge span{padding:3px 7px;border:1px solid rgba(210,255,81,.25);border-radius:4px;color:var(--accent);font-family:DM Mono,monospace;font-size:.53rem;letter-spacing:.1em}.level-badge strong{color:var(--text-muted);font-size:.67rem;font-weight:500}.workspace{position:relative;max-width:1500px;display:grid;grid-template-columns:minmax(290px,340px) minmax(0,1fr);margin:0 auto;overflow:hidden;border:1px solid var(--line-soft);border-radius:var(--radius-lg);background:#0f1613c7;box-shadow:var(--shadow-panel),inset 0 1px #ffffff06;transition:grid-template-columns .36s cubic-bezier(.22,1,.36,1)}.workspace.focus-mode{grid-template-columns:0 minmax(0,1fr)}.config-panel{min-width:0;max-height:1100px;overflow:hidden;padding:24px 23px;border-right:1px solid var(--line-soft);background:linear-gradient(160deg,rgba(255,255,255,.035),transparent 38%),#0b110e8c;opacity:1;transform:translate(0);transition:max-height .34s ease,padding .34s ease,border-color .22s ease,opacity .18s ease,transform .34s cubic-bezier(.22,1,.36,1),visibility .34s}.workspace.focus-mode .config-panel{max-height:0;padding:0;border-color:transparent;opacity:0;visibility:hidden;transform:translate(-22px)}.panel-title,.panel-title>div{display:flex;align-items:center}.panel-title{justify-content:space-between;margin-bottom:25px}.step-number{margin-right:10px;color:var(--accent);font-family:DM Mono,monospace;font-size:.65rem}.panel-title h2{margin:0;font-size:.93rem;letter-spacing:-.02em}.reset-button{padding:4px 0;border:0;background:transparent;color:var(--text-faint);font-family:DM Mono,monospace;font-size:.56rem;letter-spacing:.1em;cursor:pointer}.reset-button:hover:not(:disabled){color:var(--accent)}fieldset{min-width:0;margin:0 0 20px;padding:0;border:0}fieldset:disabled{opacity:.58}legend,.legend-row legend{margin:0 0 9px;color:var(--text-muted);font-family:DM Mono,monospace;font-size:.64rem;letter-spacing:.11em}.instrument-switch{display:grid;grid-template-columns:1fr 1fr;gap:7px}.instrument-switch button,.string-grid button,.mode-list button,.duration-presets button{border:1px solid var(--line);background:linear-gradient(145deg,var(--panel-raised),var(--panel-light));cursor:pointer;transition:border-color .16s ease,background .16s ease,color .16s ease,transform .16s ease}.instrument-switch button{height:45px;display:flex;align-items:center;justify-content:center;gap:8px;border-radius:11px;color:var(--text-muted);font-size:.72rem;font-weight:600}.instrument-switch svg{width:18px;fill:none;stroke:currentColor;stroke-linecap:round;stroke-linejoin:round;stroke-width:1.4}.instrument-switch button.active,.string-grid button.active,.mode-list button.active,.duration-presets button.active{border-color:#d2ff5185;background:linear-gradient(145deg,#cdf45c2e,#cdf45c12);box-shadow:inset 0 0 0 1px #cdf45c14;color:var(--accent)}.instrument-switch button:hover:not(.active),.string-grid button:hover:not(.active),.mode-list button:hover:not(.active),.duration-presets button:hover:not(.active){border-color:#53615b;transform:translateY(-1px)}.string-grid{display:grid;grid-template-columns:repeat(6,1fr);gap:5px}.string-grid button{aspect-ratio:1 / 1.05;display:flex;flex-direction:column;align-items:center;justify-content:center;border-radius:10px;color:var(--text-secondary)}.string-grid strong{font-size:.8rem}.string-grid small{color:var(--text-faint);font-family:DM Mono,monospace;font-size:.58rem}.string-grid button.active small{color:#9cb358}.range-inputs{display:grid;grid-template-columns:1fr 20px 1fr;align-items:end;gap:7px}.range-inputs label{display:flex;flex-direction:column;gap:5px}.range-inputs label span{color:var(--text-faint);font-family:DM Mono,monospace;font-size:.58rem}.range-inputs input{width:100%;height:39px;padding:0 9px;border:1px solid var(--line);border-radius:10px;outline:0;background:var(--panel-light);color:var(--text-primary);font-family:DM Mono,monospace;font-size:.73rem}.range-inputs input:focus{border-color:var(--accent)}.range-line{height:1px;margin-bottom:19px;background:var(--line)}.field-error{margin:6px 0 0;color:#ff927e;font-size:.63rem}.note-filter-toggle{display:grid;grid-template-columns:auto minmax(0,1fr);grid-template-rows:auto auto;align-items:center;column-gap:11px;min-height:56px;padding:9px 11px;border:1px solid var(--line);border-radius:11px;background:linear-gradient(145deg,var(--panel-raised),var(--panel-light));color:var(--text-muted);cursor:pointer;transition:border-color .16s ease,background .16s ease,color .16s ease}.note-filter-toggle.active{border-color:#cdf45c85;background:linear-gradient(145deg,#cdf45c29,#cdf45c0f);color:var(--accent)}.note-filter-toggle input{position:absolute;width:1px;height:1px;overflow:hidden;opacity:0}.toggle-switch{position:relative;width:38px;height:22px;grid-row:1 / 3;border:1px solid #4a5751;border-radius:999px;background:#101713;box-shadow:inset 0 2px 5px #00000047;transition:border-color .18s ease,background .18s ease}.toggle-switch i{position:absolute;top:3px;left:3px;width:14px;height:14px;border-radius:50%;background:var(--text-muted);box-shadow:0 2px 5px #00000059;transition:background .18s ease,transform .18s cubic-bezier(.22,1,.36,1)}.note-filter-toggle input:checked+.toggle-switch{border-color:#cdf45c99;background:#cdf45c29}.note-filter-toggle input:checked+.toggle-switch i{background:var(--accent);transform:translate(16px)}.note-filter-toggle input:focus-visible+.toggle-switch{outline:2px solid var(--accent);outline-offset:3px}.toggle-copy{min-width:0;display:flex;flex-direction:column;gap:2px}.toggle-copy strong{color:var(--text-secondary);font-size:.7rem;font-weight:650}.note-filter-toggle.active .toggle-copy strong{color:var(--accent)}.toggle-copy small{color:var(--text-faint);font-size:.57rem}.legend-row{display:flex;align-items:center;justify-content:space-between}.legend-row legend{margin:0}.legend-row output{color:var(--accent);font-family:DM Mono,monospace;font-size:.61rem}.duration-slider{width:100%;height:5px;margin:13px 0 3px;appearance:none;border-radius:3px;outline:0;background:linear-gradient(90deg,var(--accent) 0 var(--duration-progress),#293630 var(--duration-progress) 100%)}.duration-slider::-webkit-slider-thumb{width:18px;height:18px;appearance:none;border:3px solid var(--panel);border-radius:50%;background:var(--accent);box-shadow:0 0 0 1px var(--accent);cursor:grab}.duration-slider::-moz-range-thumb{width:13px;height:13px;border:3px solid var(--panel);border-radius:50%;background:var(--accent);box-shadow:0 0 0 1px var(--accent)}.slider-labels{display:flex;justify-content:space-between;color:var(--text-faint);font-family:DM Mono,monospace;font-size:.58rem}.duration-presets{display:grid;grid-template-columns:repeat(4,1fr);gap:5px;margin-top:10px}.duration-presets button{min-height:30px;padding:0;border-radius:8px;color:var(--text-muted);font-family:DM Mono,monospace;font-size:.62rem}.mode-list{display:grid;grid-template-columns:repeat(3,1fr);gap:5px}.mode-list button{min-width:0;display:flex;align-items:center;justify-content:center;gap:5px;min-height:52px;padding:9px 7px;border-radius:10px;color:var(--text-muted)}.mode-list button>span:nth-child(2){min-width:0;display:flex;flex-direction:column;align-items:flex-start}.mode-list strong{max-width:100%;overflow:hidden;font-size:.65rem;font-weight:600;text-overflow:ellipsis}.mode-list small{color:var(--text-faint);font-size:.55rem}.radio-dot{width:7px;height:7px;flex:0 0 auto;border:1px solid currentColor;border-radius:50%}.mode-list button.active .radio-dot{border:2px solid var(--panel-light);background:var(--accent);box-shadow:0 0 0 1px var(--accent)}.start-button{width:100%;height:43px;display:flex;align-items:center;justify-content:center;gap:9px;border:0;border-radius:11px;background:linear-gradient(135deg,#d8ff6c,var(--accent-strong));box-shadow:0 12px 30px #a3c94124,inset 0 1px #fff6;color:#10160e;font-family:DM Mono,monospace;font-size:.65rem;font-weight:700;letter-spacing:.07em;cursor:pointer;transition:box-shadow .18s ease,transform .18s ease}.start-button:hover:not(:disabled){box-shadow:0 10px 32px #d2ff512e;transform:translateY(-1px)}.start-button:disabled{opacity:.45}.start-button svg{width:15px;fill:none;stroke:currentColor;stroke-linecap:round;stroke-linejoin:round;stroke-width:1.8}.exercise-panel{min-width:0;scroll-margin-top:80px;display:grid;grid-template-rows:auto minmax(520px,1fr) auto;background:radial-gradient(circle at 50% 38%,rgba(205,244,92,.035),transparent 34rem),linear-gradient(rgba(255,255,255,.009) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.009) 1px,transparent 1px),#0e1512;background-size:auto,40px 40px,40px 40px,auto;transition:background .3s ease}.exercise-topline{min-height:60px;display:flex;align-items:center;justify-content:space-between;gap:16px;padding:0 27px;border-bottom:1px solid var(--line-soft);background:#0d1411db;-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px)}.exercise-status,.config-summary{display:flex;align-items:center;color:var(--text-muted);font-family:DM Mono,monospace;font-size:.62rem;letter-spacing:.09em}.exercise-status{gap:8px}.exercise-status>span{width:6px;height:6px;border-radius:50%;background:var(--text-faint)}.exercise-status>span.live{background:var(--accent);box-shadow:0 0 0 4px #d2ff5117;animation:pulse 1.4s ease-in-out infinite}.exercise-status>span.solved{background:#63e6a0}.config-summary{gap:11px}.config-summary i,.exercise-footer i{width:2px;height:2px;border-radius:50%;background:var(--text-faint)}.idle-state,.prompt-state,.reveal-state{min-width:0;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:38px clamp(26px,5vw,72px);animation:state-in .26s ease-out both}.idle-visual{position:relative;width:245px;height:112px;display:grid;place-items:center;margin-bottom:22px}.fret-lines{position:absolute;inset:0;display:flex;justify-content:space-between;border-top:1px solid #314039;border-bottom:1px solid #314039;transform:perspective(300px) rotateX(8deg)}.fret-lines:before,.fret-lines:after{content:"";position:absolute;right:0;left:0;top:33%;border-top:1px solid #314039}.fret-lines:after{top:66%}.fret-lines i{height:100%;border-left:1px solid #394941}.idle-visual>span{z-index:2;width:59px;height:59px;display:grid;place-items:center;border:1px solid rgba(210,255,81,.42);border-radius:50%;background:#14201b;box-shadow:0 0 0 8px #0f1815d1,0 0 26px #d2ff510f;color:var(--accent);font-family:DM Mono,monospace;font-size:1.45rem}.state-kicker{justify-content:center}.idle-state h2{margin:9px 0 7px;font-size:clamp(1.25rem,2.2vw,1.65rem);letter-spacing:-.045em;text-align:center}.idle-state>p{max-width:420px;margin:0;color:var(--text-muted);font-size:.82rem;line-height:1.7;text-align:center}.idle-instructions{display:flex;align-items:center;margin-top:26px;color:var(--text-muted);font-family:DM Mono,monospace;font-size:.64rem;letter-spacing:.05em}.idle-instructions span{display:flex;align-items:center;gap:6px}.idle-instructions b{width:17px;height:17px;display:grid;place-items:center;border:1px solid var(--line);border-radius:50%;color:var(--accent);font-size:.5rem}.idle-instructions i{width:32px;height:1px;margin:0 10px;background:var(--line)}.prompt-state{justify-content:flex-start;width:100%}.timer-row{align-self:flex-start;display:flex;align-items:center;gap:12px}.timer{position:relative;width:48px;height:48px}.timer svg{width:100%;transform:rotate(-90deg)}.timer circle{fill:none;stroke-width:2.5}.timer-track{stroke:var(--line)}.timer-progress{stroke:var(--accent);stroke-linecap:round;stroke-dasharray:125.664;transition:stroke-dashoffset .1s linear}.timer.urgent .timer-progress{stroke:var(--warning)}.timer.urgent>strong{color:var(--warning);animation:urgent-tick 1s ease-in-out infinite}.timer>strong{position:absolute;inset:0;display:grid;place-items:center;font-family:DM Mono,monospace;font-size:.74rem}.timer-row>div:last-child{display:flex;flex-direction:column;gap:1px}.timer-row small{color:var(--text-faint);font-family:DM Mono,monospace;font-size:.58rem;letter-spacing:.1em}.timer-row strong{font-size:.82rem;font-weight:600}.note-prompt{width:100%;display:grid;grid-template-columns:minmax(150px,.65fr) minmax(340px,1.6fr);align-items:center;gap:clamp(22px,4vw,50px);margin:auto 0;padding:30px 0}.note-prompt.staff-only{display:flex;justify-content:center}.note-name{display:flex;flex-direction:column;align-items:center}.note-name>span{color:var(--accent);font-family:DM Mono,monospace;font-size:clamp(5rem,10vw,9.5rem);font-weight:500;letter-spacing:-.12em;line-height:.9;text-shadow:0 0 45px rgba(210,255,81,.1);animation:note-arrive .42s cubic-bezier(.22,1,.36,1) both}.note-name small{margin-top:24px;color:var(--text-faint);font-family:DM Mono,monospace;font-size:.6rem;letter-spacing:.12em}.timer-bar{width:100%;height:2px;overflow:hidden;background:var(--line)}.timer-bar i{display:block;height:100%;background:var(--accent);transition:width .1s linear}.reveal-button{margin-top:15px;min-height:38px;margin-bottom:-8px;padding:5px 12px;border:1px solid transparent;border-radius:9px;background:transparent;color:var(--text-muted);font-family:DM Mono,monospace;font-size:.6rem;letter-spacing:.09em;cursor:pointer}.reveal-button:hover{border-color:var(--line);background:#ffffff06;color:var(--accent)}.reveal-state{justify-content:flex-start;width:100%}.answer-heading{width:100%;display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:14px;margin-bottom:40px}.answer-target{width:39px;height:39px;display:grid;place-items:center;border:1px solid rgba(210,255,81,.3);border-radius:12px;background:linear-gradient(145deg,#cdf45c2e,#cdf45c0f);transform:rotate(-4deg)}.answer-target svg{width:19px;fill:none;stroke:var(--accent);stroke-linecap:round;stroke-linejoin:round;stroke-width:2}.answer-heading .state-kicker{justify-content:flex-start}.answer-heading h2{margin:4px 0 0;font-size:clamp(1.05rem,2vw,1.45rem);letter-spacing:-.035em}.answer-heading h2 span{color:var(--accent)}.scientific-note{padding:8px 10px;border:1px solid var(--line);border-radius:7px;color:var(--text-muted);font-family:DM Mono,monospace;font-size:.7rem}.answer-actions{width:100%;display:flex;justify-content:flex-end;gap:10px;margin-top:32px}.secondary-button{height:39px;padding:0 17px;border:1px solid var(--line);border-radius:10px;background:linear-gradient(145deg,var(--panel-raised),var(--panel-light));color:var(--text-muted);font-family:DM Mono,monospace;font-size:.55rem;letter-spacing:.07em;cursor:pointer}.secondary-button:hover{border-color:var(--text-faint);color:var(--text-primary)}.start-button.compact{width:auto;height:39px;padding:0 20px}.exercise-footer{min-height:43px;display:flex;align-items:center;justify-content:flex-end;gap:8px;padding:0 27px;border-top:1px solid var(--line-soft);background:#0d1411db;color:var(--text-faint);font-family:DM Mono,monospace;font-size:.57rem;letter-spacing:.08em}.exercise-footer strong{color:var(--text-muted);font-weight:500}.exercise-footer i{margin:0 5px}@keyframes pulse{50%{opacity:.42}}@keyframes state-in{0%{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}@keyframes note-arrive{0%{opacity:0;transform:translateY(10px) scale(.88)}to{opacity:1;transform:translateY(0) scale(1)}}@keyframes urgent-tick{50%{opacity:.55;transform:scale(.94)}}@media(max-width:1240px){.topbar{grid-template-columns:1fr auto}.topbar-context,.sidebar{display:none}.app-body{display:block}.workspace{grid-template-columns:minmax(280px,320px) minmax(0,1fr)}.workspace.focus-mode{grid-template-columns:0 minmax(0,1fr)}.main-content{padding-right:max(24px,env(safe-area-inset-right));padding-left:max(24px,env(safe-area-inset-left))}.note-name>span{font-size:clamp(5rem,10vw,7.5rem)}}@media(max-width:900px),(max-width:1240px)and (orientation:portrait){.topbar{grid-template-columns:1fr auto}.main-content{padding:28px max(18px,env(safe-area-inset-right)) max(40px,env(safe-area-inset-bottom)) max(18px,env(safe-area-inset-left))}.workspace{grid-template-columns:1fr}.workspace.focus-mode{grid-template-columns:0 minmax(0,1fr)}.config-panel{border-right:0;border-bottom:1px solid var(--line-soft)}.exercise-panel{grid-template-rows:auto minmax(580px,1fr) auto;scroll-margin-top:76px}.config-panel{padding:28px clamp(22px,7vw,56px)}.string-grid button,.instrument-switch button,.start-button,.mode-list button{min-height:48px}.range-inputs input{min-height:46px}.prompt-state,.reveal-state{padding-right:clamp(22px,5vw,44px);padding-left:clamp(22px,5vw,44px)}.note-prompt{grid-template-columns:1fr;justify-items:center}}@media(max-width:560px){.topbar{height:60px;padding:0 max(17px,env(safe-area-inset-right)) 0 max(17px,env(safe-area-inset-left))}.main-content{padding:22px 12px 30px}.page-heading{align-items:flex-start}.page-heading p{max-width:260px}.level-badge{display:none}.exercise-topline{align-items:flex-start;flex-direction:column;gap:7px;padding:13px 18px}.config-summary{flex-wrap:wrap}.idle-state,.prompt-state,.reveal-state{padding:32px 18px}.idle-visual{width:200px}.idle-instructions i{width:15px;margin:0 5px}.note-prompt{display:flex;flex-direction:column;gap:20px}.answer-heading{grid-template-columns:auto 1fr}.scientific-note{display:none}.answer-actions{align-items:stretch;flex-direction:column-reverse}.start-button.compact{width:100%}.exercise-footer{justify-content:center;padding:0 13px}.user-button span{display:none}.user-button{width:36px;padding:0;border-radius:50%}}@media(max-width:1240px)and (orientation:landscape)and (max-height:900px){.main-content{padding-top:26px}.page-heading{margin-bottom:18px}.prompt-state,.reveal-state{padding-top:26px;padding-bottom:26px}.note-prompt{padding-top:20px;padding-bottom:20px}}@media(prefers-reduced-motion:reduce){*,*:before,*:after{scroll-behavior:auto!important;animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}}