:root{--bg:#161412;--surface:#1e1b18;--surface-2:#272320;--surface-3:#312d29;--surface-glow:#3a3530;--coral:#e2a594;--coral-dim:rgba(226,165,148,.12);--coral-glow:rgba(226,165,148,.2);--sage:#8ab4b0;--sage-dim:rgba(138,180,176,.12);--sage-glow:rgba(138,180,176,.25);--lavender:#b5a4d0;--lavender-dim:rgba(181,164,208,.1);--gold:#d0b48a;--gold-dim:rgba(208,180,138,.12);--dusty-rose:#c09090;--dusty-rose-dim:rgba(192,144,144,.12);--sky:#94b8d0;--sky-dim:rgba(148,184,208,.1);--text:#e0d8ce;--text-2:#a09688;--text-3:#8a7e72;--wood:#2a2018;--fret-wire:#706860;--fret-wire-shine:#908880;--nut-color:#d0c8b8;--string-bright:#a0988a;--string-dark:#605848;--radius:12px;--radius-sm:8px}*{margin:0;padding:0;box-sizing:border-box}body{font-family:Outfit,sans-serif;background:var(--bg);color:var(--text);min-height:100vh;padding:28px 16px;background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 256 256' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='0.015'/%3E%3C/svg%3E")}.app{max-width:1100px;margin:0 auto}.topbar{display:flex;align-items:center;justify-content:space-between;margin-bottom:24px;flex-wrap:wrap;gap:12px}.logo{font-size:18px;font-weight:300;color:var(--text-2);letter-spacing:2px}.logo em{font-style:normal;color:var(--coral);font-weight:500}.topbar-right{display:flex;gap:8px;align-items:center;flex-wrap:wrap}.btn{font-family:Outfit,sans-serif;font-size:13px;font-weight:500;padding:8px 16px;border-radius:20px;border:1px solid rgba(255,255,255,.06);background:var(--surface-2);color:var(--text-2);cursor:pointer;transition:all .25s ease;white-space:nowrap}.btn:hover{background:var(--surface-3);color:var(--text);border-color:#ffffff1a}.btn.accent{background:var(--coral-dim);color:var(--coral);border-color:#e2a59426}.btn.accent:hover{background:#e2a5942e}.btn.soft-green{background:var(--sage-dim);color:var(--sage);border-color:#8ab4b026}.btn.soft-green:hover{background:#8ab4b02e}.btn.soft-danger{color:var(--dusty-rose);border-color:#c0909026}.btn.soft-danger:hover{background:var(--dusty-rose-dim)}.btn:disabled{opacity:.3;cursor:default;pointer-events:none}select.ctrl{font-family:Outfit,sans-serif;font-size:13px;font-weight:500;padding:8px 28px 8px 12px;border-radius:20px;border:1px solid rgba(255,255,255,.06);background:var(--surface-2);color:var(--text-2);cursor:pointer;-moz-appearance:none;appearance:none;-webkit-appearance:none;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' fill='%23a09688' viewBox='0 0 16 16'%3E%3Cpath d='M8 11L3 6h10z'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 10px center}select.ctrl:focus{outline:none;border-color:var(--coral)}.mode-toggle{display:inline-flex;background:var(--surface);border-radius:20px;padding:3px;border:1px solid rgba(255,255,255,.04)}.mode-toggle button{font-family:Outfit,sans-serif;font-size:13px;font-weight:500;padding:6px 18px;border:none;border-radius:18px;background:transparent;color:var(--text-3);cursor:pointer;transition:all .25s ease}.mode-toggle button.active{background:var(--coral-dim);color:var(--coral)}.mode-toggle button:hover:not(.active){color:var(--text-2)}.fb-wrap{background:var(--wood);background-image:linear-gradient(180deg,rgba(0,0,0,.15) 0%,transparent 30%,transparent 70%,rgba(0,0,0,.15) 100%),url("data:image/svg+xml,%3Csvg width='200' height='200' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='w'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.03 0.15' numOctaves='5'/%3E%3CfeColorMatrix type='saturate' values='0'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23w)' opacity='0.08'/%3E%3C/svg%3E");border:1px solid rgba(255,255,255,.04);border-radius:var(--radius);padding:18px 14px 14px;margin-bottom:14px;overflow-x:auto;box-shadow:0 2px 20px #0000004d,inset 0 1px #ffffff08}.fret-nums{display:grid;min-width:900px;margin-bottom:6px}.fret-nums span{text-align:center;font-family:IBM Plex Mono,monospace;font-size:10px;color:var(--text-3);font-weight:400;opacity:.7}.fb{position:relative;display:grid;min-width:900px;border-left:6px solid var(--nut-color);border-radius:3px 0 0 3px;box-shadow:inset 1px 0 4px #0000004d}.s-row{display:grid;position:relative}.s-row:after{content:"";position:absolute;left:48px;right:0;top:50%;height:var(--sw,1.5px);background:linear-gradient(90deg,var(--string-bright),var(--string-dark) 40%,var(--string-dark));z-index:1;pointer-events:none;transform:translateY(-50%);border-radius:1px;box-shadow:0 1px 2px #0006}.s-label{display:flex;align-items:center;justify-content:center;font-family:IBM Plex Mono,monospace;font-size:10px;color:var(--text-3);font-weight:400;z-index:2}.f-cell{position:relative;display:flex;align-items:center;justify-content:center;border-right:2px solid var(--fret-wire);cursor:pointer;z-index:2;transition:background .2s ease}.f-cell:after{content:"";position:absolute;right:-1px;top:0;bottom:0;width:1px;background:var(--fret-wire-shine);opacity:.3;pointer-events:none}.f-cell:hover{background:#e2a5940a}.f-cell[data-fret="0"]{border-right:3px solid rgba(80,70,60,.6)}.f-cell[data-fret="0"]:after{display:none}.dot{width:30px;height:30px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-family:IBM Plex Mono,monospace;font-size:9px;font-weight:500;transition:all .25s ease;position:relative;z-index:3}.dot.ghost{opacity:0;color:var(--text-3)}.f-cell:hover .dot.ghost{opacity:.45;background:#e2a59414;color:var(--text-2)}.dot.on{opacity:1;background:var(--coral);color:var(--bg);font-weight:600;box-shadow:0 0 16px var(--coral-glow),0 2px 8px #0000004d;animation:bloom .3s ease-out}@keyframes bloom{0%{transform:scale(.5);opacity:.3}60%{transform:scale(1.1)}to{transform:scale(1);opacity:1}}.dot.hint{opacity:.5;background:#b5a4d024;border:1.5px dashed rgba(181,164,208,.45);color:var(--lavender);width:26px;height:26px;font-size:9px}.dot.on.hint{opacity:1;background:var(--coral);color:var(--bg);border:none;width:30px;height:30px;font-size:9px;box-shadow:0 0 16px var(--coral-glow),0 2px 8px #0000004d}.dot.root-hl{background:var(--sage)!important;color:var(--bg)!important;opacity:1!important;border:none!important;box-shadow:0 0 16px var(--sage-glow),0 2px 8px #0000004d!important;width:30px!important;height:30px!important;font-size:9px!important}.dot.chord-hl{opacity:.55;background:var(--gold-dim);border:1.5px solid rgba(208,180,138,.45);color:var(--gold);width:26px;height:26px;font-size:8px}.dot.on.chord-hl{opacity:1;background:var(--coral);color:var(--bg);border:none;width:30px;height:30px;font-size:9px;box-shadow:0 0 16px var(--coral-glow),0 2px 8px #0000004d}.inlay{position:absolute;width:10px;height:10px;background:radial-gradient(circle,#d0c8b81f,#d0c8b80a);border-radius:50%;pointer-events:none;z-index:0}.build-bar{display:none;align-items:center;justify-content:space-between;background:var(--surface);border:1px solid rgba(255,255,255,.04);border-radius:var(--radius);padding:12px 18px;margin-bottom:14px;gap:12px;flex-wrap:wrap}.build-bar.vis{display:flex}.build-hint{font-size:13px;color:var(--text-3);font-weight:400}.build-hint kbd{font-family:IBM Plex Mono,monospace;font-size:11px;background:var(--surface-3);border:1px solid rgba(255,255,255,.06);border-radius:4px;padding:2px 6px;color:var(--text-2)}.slot-count{font-family:IBM Plex Mono,monospace;font-size:12px;color:var(--text-3)}.prog-strip{display:none;background:var(--surface);border:1px solid rgba(255,255,255,.04);border-radius:var(--radius);padding:14px 18px;margin-bottom:14px}.prog-strip.vis{display:block}.prog-hdr{display:flex;align-items:center;justify-content:space-between;margin-bottom:12px}.section-label{font-size:11px;font-weight:600;color:var(--text-3);letter-spacing:1.5px;text-transform:uppercase}.prog-slots{display:flex;gap:6px;align-items:center;flex-wrap:wrap}.p-slot{background:var(--surface-2);border:1px solid rgba(255,255,255,.05);border-radius:var(--radius-sm);padding:8px 16px;text-align:center;cursor:pointer;transition:all .2s ease;position:relative;min-width:60px}.p-slot:hover{border-color:#ffffff1a;background:var(--surface-3)}.p-slot.editing{border-color:#e2a5944d;background:var(--coral-dim)}.p-slot .p-name{font-size:14px;font-weight:600;white-space:nowrap}.p-slot .p-sub{font-family:IBM Plex Mono,monospace;font-size:9px;color:var(--text-3);margin-top:2px}.p-slot .p-rm{position:absolute;top:-6px;right:-6px;width:18px;height:18px;background:var(--dusty-rose);color:var(--bg);border:2px solid var(--bg);border-radius:50%;font-size:10px;font-weight:700;cursor:pointer;display:flex;align-items:center;justify-content:center;opacity:0;transition:opacity .2s}.p-slot:hover .p-rm{opacity:1}.p-arrow{color:var(--text-3);font-size:14px;opacity:.4}.p-num{font-family:IBM Plex Mono,monospace;font-size:9px;color:var(--text-3);position:absolute;top:-8px;left:6px}@keyframes slotLand{0%{transform:scale(.8);opacity:.4}50%{transform:scale(1.06)}to{transform:scale(1);opacity:1}}.p-slot.just-added{animation:slotLand .35s ease-out}.scales-section{display:none;background:var(--surface);border:1px solid rgba(255,255,255,.04);border-radius:var(--radius);padding:18px;margin-bottom:14px}.scales-section.vis{display:block}.root-filter{display:flex;gap:4px;flex-wrap:wrap;margin-bottom:14px;align-items:center}.root-filter .rf-label{font-size:11px;font-weight:600;color:var(--text-3);letter-spacing:1.5px;text-transform:uppercase;margin-right:8px}.rf-btn{font-family:IBM Plex Mono,monospace;font-size:11px;font-weight:500;width:36px;height:30px;border-radius:8px;border:1px solid rgba(255,255,255,.04);background:var(--surface-2);color:var(--text-3);cursor:pointer;transition:all .2s ease;display:flex;align-items:center;justify-content:center}.rf-btn:hover{background:var(--surface-3);color:var(--text-2)}.rf-btn.active{background:var(--sage-dim);color:var(--sage);border-color:#8ab4b040}.rf-btn.available{color:var(--text-2);border-color:#ffffff14}.rf-btn.unavailable{opacity:.2;cursor:default}.top-picks{display:grid;grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:10px;margin-bottom:4px}.scale-cards{display:grid;grid-template-columns:repeat(auto-fill,minmax(210px,1fr));gap:8px}.s-card{background:var(--surface-2);border:1px solid rgba(255,255,255,.04);border-radius:var(--radius-sm);padding:12px 14px;cursor:pointer;transition:all .25s ease}.s-card:hover{border-color:#ffffff14;background:var(--surface-3);transform:translateY(-1px)}.s-card.sel{border-color:#e2a59440;background:var(--coral-dim)}.s-card.hover-preview{border-color:#b5a4d033;background:#b5a4d00f}.s-card .sc-top{display:flex;align-items:baseline;gap:8px;margin-bottom:4px}.s-card .sc-root{font-family:IBM Plex Mono,monospace;font-size:18px;font-weight:600;color:var(--coral)}.s-card.sel .sc-root{color:var(--sage)}.s-card .sc-name{font-size:14px;font-weight:500}.s-card .sc-vibe{font-size:12px;color:var(--text-3);font-style:italic;font-weight:300;margin-top:2px}.s-card .sc-pct{font-family:IBM Plex Mono,monospace;font-size:10px;font-weight:500;margin-left:auto}.sc-pct.hi{color:var(--sage)}.sc-pct.md{color:var(--gold)}.sc-pct.lo{color:var(--text-3)}.s-card .sc-notes{font-family:IBM Plex Mono,monospace;font-size:9px;color:var(--text-3);margin-top:6px;letter-spacing:.5px}.top-picks .s-card{padding:14px 16px}.top-picks .s-card .sc-root{font-size:20px}.top-picks .s-card .sc-name{font-size:15px}.explore-toggle{display:inline-flex;align-items:center;gap:6px;font-size:12px;font-weight:400;color:var(--text-3);cursor:pointer;padding:8px 0;margin-top:4px;transition:color .2s ease;background:none;border:none;font-family:Outfit,sans-serif}.explore-toggle:hover{color:var(--text-2)}.explore-toggle .arrow{display:inline-block;transition:transform .25s ease;font-size:10px}.explore-toggle.open .arrow{transform:rotate(90deg)}.explore-grid{display:none;margin-top:10px}.explore-grid.open{display:block}.chords-panel{display:none;background:var(--surface);border:1px solid rgba(255,255,255,.04);border-radius:var(--radius);padding:18px;margin-bottom:14px}.chords-panel.vis{display:block}.chord-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(105px,1fr));gap:8px}.cc{background:var(--surface-2);border:1px solid rgba(255,255,255,.04);border-radius:var(--radius-sm);padding:10px 8px;text-align:center;transition:all .2s ease;cursor:pointer}.cc:hover{background:var(--surface-3);border-color:#ffffff14}.cc.cc-active{border-color:#d0b48a4d;background:var(--gold-dim)}.cc .cr{font-family:IBM Plex Mono,monospace;font-size:10px;color:var(--gold);margin-bottom:3px;font-weight:500}.cc .cn{font-size:15px;font-weight:600}.cc .ct{font-family:IBM Plex Mono,monospace;font-size:9px;color:var(--text-3);margin-top:3px}.analysis{display:none;background:var(--surface);border:1px solid rgba(255,255,255,.04);border-radius:var(--radius);padding:18px;margin-bottom:14px}.analysis.vis{display:block}.interp-tabs{display:flex;gap:8px;margin-bottom:16px;flex-wrap:wrap}.interp-tab{font-family:Outfit,sans-serif;font-size:14px;font-weight:500;padding:10px 20px;border-radius:20px;border:1px solid rgba(255,255,255,.05);background:var(--surface-2);cursor:pointer;transition:all .25s ease;display:flex;flex-direction:column;align-items:center;gap:2px}.interp-tab:hover{background:var(--surface-3);border-color:#ffffff14}.interp-tab.active{border-color:#8ab4b04d;background:var(--sage-dim)}.interp-tab .it-key{font-weight:600}.interp-tab.active .it-key{color:var(--sage)}.interp-tab .it-vibe{font-size:10px;font-weight:300;color:var(--text-3);font-style:italic}.interp-body{display:none}.interp-body.active{display:block;animation:fadeUp .3s ease}@keyframes fadeUp{0%{opacity:0;transform:translateY(6px)}to{opacity:1;transform:translateY(0)}}.prog-row{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:14px;align-items:center}.pa-item{background:var(--surface-2);border:1px solid rgba(255,255,255,.04);border-radius:var(--radius-sm);padding:10px 16px;text-align:center;min-width:68px}.pa-item .pa-roman{font-family:IBM Plex Mono,monospace;font-size:11px;font-weight:600;color:var(--gold);margin-bottom:3px}.pa-item .pa-chord{font-size:16px;font-weight:600}.pa-item .pa-notes{font-family:IBM Plex Mono,monospace;font-size:9px;color:var(--text-3);margin-top:3px}.pa-arrow{color:var(--text-3);font-size:14px;opacity:.35}.dia-label{font-size:12px;color:var(--text-3);margin-bottom:8px;font-weight:400}.dia-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(95px,1fr));gap:6px}.dc{background:var(--surface-2);border-radius:var(--radius-sm);padding:8px;text-align:center}.dc .dc-r{font-family:IBM Plex Mono,monospace;font-size:9px;color:var(--gold);font-weight:500}.dc .dc-n{font-size:14px;font-weight:600}.dc .dc-t{font-family:IBM Plex Mono,monospace;font-size:8px;color:var(--text-3);margin-top:2px}.listen-panel{display:none;background:var(--surface);border:1px solid rgba(255,255,255,.04);border-radius:var(--radius);padding:18px;margin-bottom:14px}.listen-panel.vis{display:block}.listen-controls{display:flex;gap:10px;align-items:center;margin-bottom:16px;flex-wrap:wrap}.rec-btn{width:48px;height:48px;border-radius:50%;border:2px solid var(--coral);background:transparent;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:all .25s ease;position:relative}.rec-btn:hover{background:var(--coral-dim)}.rec-btn .rec-icon{width:18px;height:18px;border-radius:50%;background:var(--coral);transition:all .2s ease}.rec-btn.recording{border-color:var(--dusty-rose);animation:pulse 1.5s ease infinite}.rec-btn.recording .rec-icon{border-radius:4px;width:16px;height:16px;background:var(--dusty-rose)}@keyframes pulse{0%,to{box-shadow:0 0 #c090904d}50%{box-shadow:0 0 0 12px #c0909000}}.upload-label{font-family:Outfit,sans-serif;font-size:13px;font-weight:500;padding:8px 16px;border-radius:20px;border:1px solid rgba(255,255,255,.06);background:var(--surface-2);color:var(--text-2);cursor:pointer;transition:all .25s ease}.upload-label:hover{background:var(--surface-3);color:var(--text)}.upload-label input{display:none}.listen-status{font-size:13px;color:var(--text-3);font-weight:400;margin-left:4px}.listen-status .recording-time{color:var(--dusty-rose);font-family:IBM Plex Mono,monospace;font-weight:600}.chroma-wrap{display:flex;gap:4px;align-items:flex-end;height:60px;margin-bottom:14px;padding:0 2px}.chroma-bar{flex:1;border-radius:4px 4px 0 0;background:var(--surface-3);transition:height .3s ease,background .3s ease;min-height:4px;position:relative}.chroma-bar.active{background:var(--coral)}.chroma-bar .cb-label{position:absolute;bottom:-18px;left:50%;transform:translate(-50%);font-family:IBM Plex Mono,monospace;font-size:8px;color:var(--text-3);font-weight:500}.chroma-bar.active .cb-label{color:var(--coral)}.listen-results{display:flex;gap:16px;align-items:center;flex-wrap:wrap;margin-bottom:14px}.lr-item{display:flex;flex-direction:column;align-items:center;gap:2px}.lr-item .lr-val{font-family:IBM Plex Mono,monospace;font-size:20px;font-weight:700;color:var(--coral)}.lr-item .lr-label{font-size:10px;color:var(--text-3);text-transform:uppercase;letter-spacing:1px;font-weight:600}.waveform-wrap{position:relative;background:var(--surface-2);border:1px solid rgba(255,255,255,.04);border-radius:var(--radius-sm);overflow:hidden;margin-bottom:14px;height:140px}.waveform-wrap canvas{width:100%;height:100%;display:block}.waveform-empty{position:absolute;top:0;right:0;bottom:0;left:0;display:flex;align-items:center;justify-content:center;font-size:13px;color:var(--text-3);font-weight:300}.trim-overlay{position:absolute;top:0;bottom:0;background:#00000073;pointer-events:none;z-index:2}.trim-handle{position:absolute;top:0;bottom:0;width:6px;background:var(--coral);cursor:ew-resize;z-index:3;opacity:.7;transition:opacity .15s}.trim-handle:hover,.trim-handle.dragging{opacity:1;width:8px}.trim-handle:after{content:"";position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:2px;height:20px;background:#0006;border-radius:1px}.trim-info{position:absolute;bottom:6px;left:50%;transform:translate(-50%);font-family:IBM Plex Mono,monospace;font-size:10px;color:var(--text-3);z-index:4;background:#161412b3;padding:2px 8px;border-radius:4px;pointer-events:none}.notes-bar{background:var(--surface);border:1px solid rgba(255,255,255,.04);border-radius:var(--radius);padding:12px 18px;display:flex;align-items:center;gap:10px;flex-wrap:wrap}.nb-label{font-size:11px;font-weight:600;color:var(--text-3);letter-spacing:1.5px;text-transform:uppercase}.pc-badge{font-family:IBM Plex Mono,monospace;font-size:11px;font-weight:500;padding:3px 8px;border-radius:6px;background:var(--coral-dim);color:var(--coral)}.notes-detail{font-size:12px;color:var(--text-3);margin-left:auto;font-weight:300}.empty{text-align:center;color:var(--text-3);font-size:13px;padding:20px 12px;font-weight:300}.audio-toggle{display:flex;align-items:center;gap:5px;cursor:pointer;font-size:12px;color:var(--text-3);transition:color .2s;-webkit-user-select:none;user-select:none}.audio-toggle:hover{color:var(--text-2)}.audio-toggle .speaker{font-size:14px}.audio-toggle.on{color:var(--coral)}@media(max-width:768px){body{padding:14px 8px}.topbar{gap:8px;margin-bottom:16px}.topbar-right{width:100%;justify-content:space-between}.mode-toggle button{padding:6px 12px;font-size:12px}.fb-wrap{padding:12px 8px 10px;margin-bottom:10px}.fret-nums,.fb{min-width:700px}.fb{grid-template-rows:repeat(6,36px)!important}.dot{width:26px;height:26px;font-size:8px}.dot.on,.dot.root-hl,.dot.on.hint,.dot.on.chord-hl{width:26px!important;height:26px!important;font-size:8px!important}.dot.hint,.dot.chord-hl{width:22px;height:22px;font-size:8px}.s-row:after{left:40px}.build-bar{padding:10px 12px}.build-hint kbd{font-size:10px;padding:1px 4px}.prog-strip{padding:12px 14px}.p-slot{padding:6px 12px;min-width:50px}.top-picks{grid-template-columns:repeat(auto-fill,minmax(170px,1fr))}.scale-cards{grid-template-columns:repeat(auto-fill,minmax(160px,1fr))}.listen-panel{padding:14px}.waveform-wrap{height:110px}.chroma-wrap{height:50px}.notes-bar{padding:10px 14px}}@media(max-width:480px){body{padding:10px 6px}.topbar{gap:6px;margin-bottom:12px}.logo{font-size:15px}.mode-toggle button{padding:5px 10px;font-size:11px}.btn{font-size:12px;padding:6px 12px}select.ctrl{font-size:12px;padding:6px 10px}.fb-wrap{padding:8px 4px 6px;border-radius:8px}.fret-nums,.fb{min-width:560px}.fb{grid-template-rows:repeat(6,32px)!important}.dot{width:22px;height:22px;font-size:7px}.dot.on,.dot.root-hl,.dot.on.hint,.dot.on.chord-hl{width:22px!important;height:22px!important;font-size:7px!important}.dot.hint,.dot.chord-hl{width:18px;height:18px;font-size:7px}.s-label{font-size:9px}.s-row:after{left:32px}.fret-nums span{font-size:8px}.build-bar{padding:8px 10px;gap:8px}.build-hint{font-size:11px}.build-hint kbd{display:none}.slot-count{font-size:11px}.prog-strip{padding:10px 12px}.p-slot{padding:5px 10px;min-width:44px}.p-slot .p-name{font-size:12px}.p-slot .p-sub{font-size:8px}.top-picks,.scale-cards{grid-template-columns:1fr}.s-card .sc-root{font-size:16px}.s-card .sc-name{font-size:13px}.interp-tab{padding:8px 14px;font-size:13px}.listen-panel{padding:10px}.rec-btn{width:40px;height:40px}.rec-btn .rec-icon{width:14px;height:14px}.waveform-wrap{height:90px}.chroma-wrap{height:40px}.notes-bar{padding:8px 10px;gap:6px}.notes-detail{font-size:11px}.rf-btn{width:30px;height:26px;font-size:10px}.chord-grid{grid-template-columns:repeat(auto-fill,minmax(80px,1fr))}}.session-picker{position:relative}.session-btn{font-family:Outfit,sans-serif;font-size:13px;font-weight:500;padding:6px 12px;border-radius:20px;border:1px solid rgba(255,255,255,.06);background:var(--surface);color:var(--text-2);cursor:pointer;display:flex;align-items:center;gap:6px;transition:all .2s;white-space:nowrap}.session-btn:hover{background:var(--surface-2);color:var(--text)}.session-arrow{font-size:10px;opacity:.5}.session-dropdown{display:none;position:absolute;top:calc(100% + 6px);left:50%;transform:translate(-50%);min-width:220px;max-width:300px;background:var(--surface-2);border:1px solid rgba(255,255,255,.08);border-radius:var(--radius-sm);padding:8px 0;z-index:100;box-shadow:0 8px 24px #0006}.session-dropdown.open{display:block}.session-list{max-height:240px;overflow-y:auto;padding:0 4px}.session-item{display:flex;align-items:center;justify-content:space-between;gap:8px;padding:8px 12px;border-radius:6px;cursor:pointer;transition:background .15s}.session-item:hover{background:#ffffff0a}.session-item.active{background:var(--sage-dim)}.session-item-name{font-size:13px;color:var(--text);flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.session-item.active .session-item-name{color:var(--sage);font-weight:500}.session-item-meta{font-size:10px;color:var(--text-3);font-family:IBM Plex Mono,monospace;white-space:nowrap}.session-item-actions{display:flex;gap:2px;opacity:0;transition:opacity .15s}.session-item:hover .session-item-actions{opacity:1}.session-item-btn{background:none;border:none;color:var(--text-3);cursor:pointer;font-size:12px;padding:2px 5px;border-radius:4px;transition:color .15s,background .15s}.session-item-btn:hover{color:var(--text);background:#ffffff0f}.session-item-btn.del:hover{color:var(--dusty-rose);background:var(--dusty-rose-dim)}.session-actions{padding:6px 8px 2px;border-top:1px solid rgba(255,255,255,.06);margin-top:4px}.session-new{width:100%;font-size:12px;padding:6px 10px;text-align:center}.onboard-hint{display:flex;align-items:center;justify-content:space-between;padding:10px 16px;margin:0 0 10px;border-radius:var(--radius-sm);background:#8ab4b014;border:1px solid rgba(138,180,176,.18);opacity:0;transition:opacity .35s ease}.onboard-hint.vis{opacity:1}.onboard-text{font-size:13px;color:var(--sage);font-weight:400;letter-spacing:.2px}.onboard-dismiss{font-size:14px;color:var(--text-3);cursor:pointer;margin-left:12px;padding:2px 6px;border-radius:4px;transition:color .2s;line-height:1}.onboard-dismiss:hover{color:var(--text)}