*{margin:0;padding:0;box-sizing:border-box}:root{--bg-primary: #141416;--bg-secondary: #141416;--bg-tertiary: #1c1c20;--bg-elevated: #232328;--text-primary: #f4f4f5;--text-secondary: #a1a1aa;--text-muted: #71717a;--accent-blue: #d4884a;--accent-violet: #c07038;--accent-cyan: #e0a86e;--accent-gold: #eab308;--accent-green: #22c55e;--accent-red: #ef4444;--gradient-primary: linear-gradient(135deg, #d4884a 0%, #c07038 100%);--gradient-warm: linear-gradient(135deg, #eab308 0%, #f97316 100%);--border-color: rgba(255, 255, 255, .08);--border-subtle: rgba(255, 255, 255, .05);--shadow-sm: 0 1px 2px rgba(0, 0, 0, .4);--shadow: 0 4px 12px rgba(0, 0, 0, .35);--shadow-lg: 0 12px 40px rgba(0, 0, 0, .4);--radius-sm: 8px;--radius: 12px;--radius-lg: 16px;--radius-xl: 20px}body{font-family:Plus Jakarta Sans,-apple-system,BlinkMacSystemFont,sans-serif;background:var(--bg-primary);color:var(--text-primary);line-height:1.6;min-height:100vh;display:flex;flex-direction:column;-webkit-font-smoothing:antialiased}.container{width:100%;max-width:1600px;margin:0 auto;padding:24px;flex:1 0 auto;display:flex;flex-direction:column}.top-bar{display:grid;grid-template-columns:minmax(140px,1fr) auto minmax(140px,1fr);align-items:center;gap:18px;padding:0;margin-bottom:24px}.brand-lockup{display:flex;align-items:center;justify-self:start;padding:0;flex-shrink:0}.brand{font-size:1.4rem;font-weight:700;color:#fff;letter-spacing:-.02em;white-space:nowrap}.nav-links{display:flex;align-items:center;justify-self:center;gap:6px;flex-wrap:wrap;padding:4px;border:1px solid var(--border-color);border-radius:999px;background:#ffffff06;box-shadow:inset 0 1px #ffffff0a}.nav-dropdown{position:relative}.nav-dropdown-trigger{-webkit-user-select:none;user-select:none}.nav-dropdown-menu{display:none;position:absolute;top:100%;left:0;margin-top:4px;background:var(--bg-secondary);border:1px solid var(--border-color);border-radius:var(--radius-sm);box-shadow:var(--shadow-lg);z-index:100;min-width:140px;padding:4px;flex-direction:column}.nav-dropdown.open .nav-dropdown-menu{display:flex}.nav-dropdown-menu .menu-btn{width:100%;text-align:left;padding:8px 14px;border-radius:6px;white-space:nowrap}.nav-dropdown-menu .menu-btn:hover{background:var(--bg-tertiary)}.nav-dropdown-menu .menu-btn.active{background:#d4884a26}.menu-btn{background:transparent;color:var(--text-secondary);border:none;min-width:96px;padding:8px 18px;font-size:.82rem;font-weight:650;letter-spacing:.01em;border-radius:999px;cursor:pointer;transition:color .18s ease,background .18s ease,box-shadow .18s ease}.menu-btn:hover{color:var(--text-primary);background:#ffffff0e}.menu-btn.active{color:#fff;background:#d4884a2e;box-shadow:inset 0 0 0 1px #d4884a61}main{flex:1 0 auto;display:flex;flex-direction:column}.tab-content{display:none;flex:1 0 auto;width:100%;animation:fadeIn .3s ease-in-out}.tab-content.active{display:block}@keyframes fadeIn{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}.content-grid{display:grid;grid-template-columns:280px 1fr;gap:20px;margin-bottom:24px}.content-single{margin-bottom:24px}section{padding:0}section h2{font-size:1.2rem;font-weight:600;margin-bottom:16px;color:var(--text-primary);border-bottom:1px solid var(--border-color);padding-bottom:10px;letter-spacing:-.01em}.chord-selector-inline{display:flex;flex-direction:column;gap:5px;margin-bottom:10px;padding-right:73px}.selector-row{display:flex;align-items:center;gap:8px}.selector-label{font-size:.8rem;color:var(--text-secondary);white-space:nowrap;flex-shrink:0;min-width:65px;text-align:right}.root-buttons-row,.quality-buttons-row,.voicing-buttons-row{display:flex;flex-wrap:wrap;gap:4px;align-items:center}.root-btn,.quality-btn{background:var(--bg-tertiary);color:var(--text-primary);border:1px solid var(--border-color);padding:5px 10px;font-size:.8rem;border-radius:var(--radius-sm);cursor:pointer;transition:all .15s ease;font-weight:600;text-align:center;white-space:nowrap;line-height:1}.root-btn:hover,.quality-btn:hover{background:var(--bg-elevated);border-color:var(--accent-blue);color:var(--accent-blue)}.root-btn.active,.quality-btn.active{background:var(--gradient-primary);border-color:transparent;color:#fff;box-shadow:0 2px 8px #d4884a66}.root-btn-placeholder{display:none}.quality-btn.unavailable{opacity:.35;cursor:not-allowed}.quality-btn.unavailable:hover{background:var(--bg-tertiary);border-color:var(--border-color);color:var(--text-primary);transform:none}.quality-category{display:none}.chord-buttons{display:grid;grid-template-columns:repeat(3,1fr);gap:6px;overflow-y:auto;max-height:420px;padding-right:5px}.chord-buttons::-webkit-scrollbar{width:5px}.chord-buttons::-webkit-scrollbar-track{background:var(--bg-tertiary);border-radius:3px}.chord-buttons::-webkit-scrollbar-thumb{background:var(--border-color);border-radius:3px}.chord-btn{background:var(--bg-tertiary);color:var(--text-primary);border:1px solid var(--border-color);padding:8px 4px;font-size:.8rem;border-radius:var(--radius-sm);cursor:pointer;transition:all .2s ease;font-weight:600;text-align:center}.chord-btn:hover{background:var(--bg-elevated);border-color:var(--accent-blue)}.chord-btn.active{background:#d4884a33;border-color:var(--accent-blue);box-shadow:0 0 0 1px #d4884a40}.builder-play-controls{display:flex;align-items:center;justify-content:center;gap:12px;margin-bottom:12px}.play-builder-round{width:56px;height:56px;border-radius:50%;background:transparent;border:2px solid rgba(255,255,255,.5);color:#ffffffb3;font-size:1.3rem;cursor:pointer;display:flex;align-items:center;justify-content:center;padding:0;transition:all .2s ease}.play-builder-round:hover{border-color:#fffc;color:#fff}.play-builder-round:active{transform:scale(.95)}.loop-toggle-inline{display:flex;align-items:center;gap:5px;cursor:pointer;font-size:.8rem;color:var(--text-secondary)}.loop-toggle-inline input[type=checkbox]{width:14px;height:14px;accent-color:var(--accent-violet);cursor:pointer}.loop-toggle-inline:has(input:checked){color:var(--text-primary)}.fretboard-section{display:flex;flex-direction:column}.progression-builder{position:relative;padding:0;margin-bottom:20px}.builder-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:14px;padding-left:73px;padding-right:73px}.builder-header h3{font-size:1rem;font-weight:600;color:var(--text-primary);margin:0}.select-one-trigger{display:inline-flex;align-items:center;gap:4px;color:var(--accent-blue);cursor:pointer;transition:color .15s ease;white-space:nowrap}.select-one-trigger:hover{color:var(--text-primary)}.select-one-chevron{transition:transform .2s ease}.select-one-panel{display:none;position:absolute;top:0;left:0;right:0;z-index:10;background:#1a1a1e;border:1px solid rgba(255,255,255,.12);border-radius:8px;padding:12px;box-shadow:0 8px 30px #00000080}.select-one-panel.open{display:block}.select-one-panel .progression-list{max-height:360px;overflow-y:auto;scrollbar-width:thin;scrollbar-color:var(--border-color) transparent}.select-one-panel .progression-list::-webkit-scrollbar{width:4px}.select-one-panel .progression-list::-webkit-scrollbar-thumb{background:var(--border-color);border-radius:2px}.select-one-close{position:absolute;top:8px;right:8px;background:none;border:none;color:var(--text-muted);font-size:1rem;cursor:pointer;padding:0;line-height:1;transition:color .15s ease}.select-one-close:hover{color:var(--text-primary)}.select-one-panel .progression-filters{margin-bottom:8px}.builder-actions{display:flex;gap:8px;align-items:center}.loop-toggle{display:flex;align-items:center;gap:5px;cursor:pointer;font-size:.85rem;color:var(--text-secondary);margin-right:8px}.loop-toggle input[type=checkbox]{width:16px;height:16px;accent-color:var(--accent-violet);cursor:pointer}.loop-toggle:has(input:checked){color:var(--accent-violet)}.play-builder-btn{padding:8px 18px;background:var(--accent-green);color:#fff;border:none;border-radius:var(--radius-sm);font-weight:600;cursor:pointer;transition:all .2s ease}.play-builder-btn:hover:not(:disabled){filter:brightness(1.1);transform:translateY(-1px)}.play-builder-btn:disabled{opacity:.5;cursor:not-allowed}.clear-builder-btn{padding:8px 14px;background:transparent;color:var(--text-secondary);border:1px solid var(--border-color);border-radius:var(--radius-sm);cursor:pointer;transition:all .2s;font-weight:500}.clear-builder-btn:hover{background:var(--bg-elevated);color:var(--text-primary);border-color:var(--text-secondary)}.builder-slots-row{display:flex;align-items:center;padding-right:73px;gap:10px}.builder-inline-controls{display:flex;gap:6px;flex-shrink:0;align-items:center;width:73px;justify-content:flex-end}.builder-control-btn{width:30px;height:30px;border-radius:50%;background:transparent;border:1px solid rgba(255,255,255,.2);color:#fff6;font-size:.85rem;cursor:pointer;display:flex;align-items:center;justify-content:center;padding:0;transition:all .15s ease}.builder-control-btn:hover{border-color:#ffffff80;color:#ffffffb3}.builder-control-btn.active{border-color:var(--accent-blue);color:var(--accent-blue)}.builder-slots{position:relative;display:flex;gap:8px;flex-wrap:wrap;flex:1}.builder-slot{width:calc(12.5% - 7px);min-width:70px;height:44px;background:var(--bg-secondary);border:1px dashed var(--border-color);border-radius:var(--radius-sm);display:flex;flex-direction:column;align-items:center;justify-content:center;cursor:pointer;transition:all .2s ease;position:relative}.builder-slot:hover{border-color:var(--accent-blue);background:#d4884a14}.builder-slot.has-chord{border-style:solid;border-color:var(--accent-violet);background:#8b5cf61f}.builder-slot.drag-over{border-color:var(--accent-green);background:#22c55e26;transform:scale(1.02)}.builder-slot.playing{border-color:var(--accent-green);background:#22c55e33;animation:pulse-slot .5s ease-in-out}@keyframes pulse-slot{0%,to{transform:scale(1)}50%{transform:scale(1.05)}}.slot-chord{font-size:.9rem;font-weight:600;color:var(--text-primary);text-align:center;padding:2px}.builder-slot.has-chord .slot-chord{color:var(--accent-violet);font-weight:600}.slot-delete{position:absolute;top:2px;right:4px;border:none;background:transparent;color:var(--text-secondary);font-size:14px;line-height:1;cursor:pointer;display:none;padding:2px;transition:color .2s}.slot-delete:hover{color:var(--accent-red)}.slot-delete:focus{outline:none}.builder-slot.has-chord .slot-delete{display:block}.builder-hint{font-size:.75rem;color:var(--text-secondary);margin-top:10px;font-style:italic;padding-left:73px;padding-right:73px}.chord-info{text-align:center;margin-bottom:8px}.chord-details-chips{display:flex;flex-wrap:wrap;gap:6px}.chord-chip{padding:5px 14px;border:1px solid var(--border-color);border-radius:16px;background:var(--bg-primary);color:var(--text-secondary);font-size:.85rem;font-weight:600;cursor:pointer;transition:all .15s ease}.chord-chip:hover{border-color:var(--accent-blue);color:var(--text-primary)}.chord-chip.active{background:var(--accent-blue);border-color:var(--accent-blue);color:#fff}#chordName{font-size:1.5rem;font-weight:700;color:#fff;letter-spacing:-.02em;margin-bottom:6px}#chordDetails{color:var(--text-secondary);font-size:.85rem;font-family:Monaco,Menlo,monospace}#voicingSelector{display:none;flex-wrap:wrap;gap:4px;align-items:center}.voicing-label{display:none}.voicing-btn{background:var(--bg-tertiary);color:var(--text-primary);border:1px solid var(--border-color);padding:5px 10px;font-size:.8rem;border-radius:var(--radius-sm);cursor:pointer;transition:all .15s ease;font-weight:600;text-align:center;white-space:nowrap;line-height:1}.voicing-btn:hover{background:var(--bg-elevated);border-color:var(--accent-blue);color:var(--accent-blue)}.voicing-btn.active{background:var(--gradient-primary);border-color:transparent;color:#fff;box-shadow:0 2px 8px #d4884a66}.fretboard-container{position:relative;display:flex;justify-content:center;align-items:center;background:transparent;border-radius:var(--radius);padding:16px;margin-bottom:16px;overflow-x:auto;border:none;cursor:pointer}#fretboard{max-width:100%;height:auto;border-radius:var(--radius-sm);transition:transform .4s ease}.fretboard-container.view-3d{perspective:800px}.fretboard-container.view-3d #fretboard{transform:rotateX(35deg) scale(1.15);transform-origin:center bottom}.play-pattern-card{display:flex;flex-direction:column;align-items:flex-start;gap:4px;padding:16px 20px;background:#1e1e1e;border:1px solid #333;border-radius:12px;cursor:pointer;color:#fff;text-align:left;width:100%;transition:background .15s,border-color .15s}.play-pattern-card:hover{background:#252525;border-color:#4a90e2}.play-pattern-title{font-size:16px;font-weight:600}.play-pattern-sub{font-size:13px;color:#888}.play-canvas-wrap{perspective:800px;transition:perspective .4s;width:100%;overflow:hidden}.play-canvas-wrap #play-canvas{display:block;width:100%;transition:transform .4s ease}.play-canvas-wrap.view-3d #play-canvas{transform:rotateX(35deg) scale(1.25);transform-origin:center bottom}.play-play-btn{width:64px;height:64px;border-radius:50%;border:2px solid #fff;background:#111;color:#fff;font-size:22px;line-height:1;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:background .15s,transform .1s;flex-shrink:0}.play-play-btn:hover{background:#222;transform:scale(1.07)}.play-play-btn:active{transform:scale(.95)}.play-settings-btn{width:36px;height:36px;border-radius:50%;border:1px solid #444;background:#1a1a1a;color:#888;font-size:17px;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:color .15s,border-color .15s;flex-shrink:0}.play-settings-btn:hover{color:#ccc;border-color:#666}.play-settings-btn.active{color:#22c55e;border-color:#22c55e;box-shadow:0 0 14px #22c55e40}.play-btn{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);background:transparent;color:#ffffff40;border:2px solid rgba(255,255,255,.15);width:64px;height:64px;font-size:1.4rem;border-radius:50%;cursor:pointer;transition:all .2s ease;display:flex;align-items:center;justify-content:center;padding:0;opacity:0;pointer-events:none;z-index:1}.fretboard-container:hover .play-btn{opacity:1;pointer-events:auto}.play-btn:hover:not(:disabled){color:#ffffff73;border-color:#ffffff4d}.play-btn:active:not(:disabled){transform:translate(-50%,-50%) scale(.95)}.play-btn:disabled{display:none}.toggle-label{display:flex;align-items:center;gap:8px;padding:10px 16px;background:var(--bg-tertiary);border:2px solid var(--border-color);border-radius:6px;cursor:pointer;transition:all .2s ease;-webkit-user-select:none;user-select:none;font-size:.9rem;color:var(--text-secondary)}.toggle-label:hover{border-color:var(--accent-blue);color:var(--text-primary)}.toggle-label input[type=checkbox]{width:18px;height:18px;accent-color:var(--accent-blue);cursor:pointer}.toggle-label:has(input:checked){background:#d4884a1f;border-color:var(--accent-blue);color:var(--text-primary)}.toggle-label:has(input:checked) span{color:var(--accent-cyan)}.fretboard-toggles{display:flex;justify-content:flex-end;gap:14px;margin-bottom:8px;padding-right:73px}.fretboard-toggles .toggle-label{background:none;border:none;padding:0;font-size:.8rem;color:var(--text-secondary)}.fretboard-toggles .toggle-label:hover{border-color:transparent;color:var(--text-primary)}.fretboard-toggles .toggle-label:has(input:checked){background:none;border-color:transparent;color:var(--text-primary)}.fretboard-toggles .toggle-label:has(input:checked) span{color:var(--text-primary)}.fretboard-toggles .toggle-label input[type=checkbox]{-webkit-appearance:none;appearance:none;width:13px;height:13px;border:1px solid rgba(255,255,255,.2);border-radius:3px;background:transparent;cursor:pointer;position:relative;flex-shrink:0}.fretboard-toggles .toggle-label input[type=checkbox]:checked{border-color:#ffffff59}.fretboard-toggles .toggle-label input[type=checkbox]:checked:after{content:"✓";position:absolute;inset:0;display:flex;align-items:center;justify-content:center;font-size:.7rem;color:#fffc}.instrument-control{display:flex;align-items:center;gap:8px;flex-shrink:0;margin-left:auto}#instrumentSelect{padding:6px 10px;font-size:.8rem;background:var(--bg-tertiary);color:var(--text-primary);border:1px solid var(--border-color);border-radius:5px;cursor:pointer}#instrumentSelect:hover,#instrumentSelect:focus{border-color:var(--accent-blue);outline:none}#instrumentSelect:disabled{opacity:.5;cursor:not-allowed}#instrumentSelect optgroup{background:var(--bg-secondary);color:var(--accent-gold);font-weight:600;padding:5px 0}#instrumentSelect option{background:var(--bg-secondary);color:var(--text-primary);font-weight:400;padding:4px 8px}.loading-indicator{display:flex;align-items:center;gap:8px;color:var(--accent-blue);font-size:.85rem}.loading-spinner{width:16px;height:16px;border:2px solid var(--border-color);border-top-color:var(--accent-blue);border-radius:50%;animation:spin .8s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}.progressions-section{display:flex;flex-direction:column;margin-bottom:80px}.progression-filters{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:14px;align-items:center}.filter-dropdown{position:relative}.filter-trigger{display:flex;align-items:center;gap:6px;padding:5px 12px;border:1px solid var(--border-color);border-radius:6px;background:var(--bg-tertiary);color:var(--text-primary);font-size:.82rem;font-family:inherit;cursor:pointer;transition:all .15s ease;white-space:nowrap}.filter-trigger:hover{border-color:var(--accent-blue)}.filter-label{font-size:.68rem;font-weight:600;color:var(--text-secondary);text-transform:uppercase;letter-spacing:.4px}.filter-value{font-weight:500}.filter-chevron{opacity:.5;transition:transform .2s ease;flex-shrink:0}.filter-dropdown:hover .filter-chevron,.filter-dropdown.open .filter-chevron{transform:rotate(180deg);opacity:1}.filter-menu{position:absolute;top:calc(100% + 4px);left:0;min-width:160px;max-height:280px;overflow-y:auto;background:var(--bg-secondary);border:1px solid var(--border-color);border-radius:8px;box-shadow:0 8px 24px #00000059;z-index:100;padding:4px;opacity:0;visibility:hidden;transform:translateY(-4px);transition:opacity .15s ease,transform .15s ease,visibility .15s ease}.filter-dropdown:hover .filter-menu,.filter-dropdown.open .filter-menu{opacity:1;visibility:visible;transform:translateY(0)}.filter-menu::-webkit-scrollbar{width:4px}.filter-menu::-webkit-scrollbar-thumb{background:var(--border-color);border-radius:2px}.filter-option{display:block;width:100%;padding:6px 10px;border:none;border-radius:4px;background:none;color:var(--text-secondary);font-size:.8rem;font-family:inherit;text-align:left;cursor:pointer;transition:all .1s ease}.filter-option:hover{background:var(--bg-tertiary);color:var(--text-primary)}.filter-option.active{background:#60a5fa26;color:var(--accent-blue);font-weight:600}.filter-sort-icons{display:flex;gap:4px;margin-left:4px}.sort-icon-btn{display:flex;align-items:center;justify-content:center;width:32px;height:32px;border:1px solid var(--border-color);border-radius:6px;background:var(--bg-tertiary);color:var(--text-secondary);cursor:pointer;transition:all .15s ease}.sort-icon-btn:hover{border-color:var(--accent-blue);color:var(--text-primary)}.sort-icon-btn.active{background:#60a5fa26;border-color:var(--accent-blue);color:var(--accent-blue)}.sort-icon-btn.active svg{fill:var(--accent-blue)}.difficulty-badge{font-size:.65rem;font-weight:600;padding:2px 8px;border-radius:10px;text-transform:uppercase;letter-spacing:.3px;white-space:nowrap;flex-shrink:0}.difficulty-beginner{background:#4ade8026;color:#4ade80;border:1px solid rgba(74,222,128,.3)}.difficulty-intermediate{background:#fbbf2426;color:#fbbf24;border:1px solid rgba(251,191,36,.3)}.difficulty-advanced{background:#f8717126;color:#f87171;border:1px solid rgba(248,113,113,.3)}.progression-item-header{display:flex;justify-content:space-between;align-items:center;gap:8px;margin-bottom:4px}.progression-item-header h3{margin-bottom:0}.progression-empty{grid-column:1 / -1;text-align:center;padding:32px 16px;color:var(--text-secondary);font-size:.9rem;font-style:italic}.strumming-section{grid-column:1 / -1;padding:10px 0}.strumming-row{display:flex;align-items:center;gap:8px;padding-right:73px}.section-divider{border:none;border-top:1px solid rgba(255,255,255,.06);margin:12px 73px}.strumming-label{font-size:.8rem;color:var(--text-secondary);white-space:nowrap;flex-shrink:0}.chat-box{position:fixed;bottom:36px;left:50%;transform:translate(-50%);width:calc(100% - 40px);max-width:960px;z-index:1000;display:flex;flex-direction:column;gap:0}.chat-messages{max-height:220px;overflow-y:auto;display:flex;flex-direction:column;gap:8px;scrollbar-width:thin;scrollbar-color:var(--border-color) transparent}.chat-messages:empty{display:none}.chat-messages:not(:empty){margin-bottom:10px;padding:4px 2px}.chat-msg{font-size:.95rem;line-height:1.4;padding:8px 14px;border-radius:12px;max-width:85%;word-wrap:break-word}.chat-msg.user{align-self:flex-end;background:var(--accent-blue);color:#fff;border-bottom-right-radius:4px}.chat-msg.assistant{align-self:flex-start;background:var(--bg-tertiary);color:var(--text-primary);border-bottom-left-radius:4px}.chat-input-row{display:flex;align-items:center;background:#2a2a2e;border:none;border-radius:24px;padding:6px 8px 6px 18px;box-shadow:0 6px 30px #0006}.chat-input{flex:1;padding:10px 0;border:none;background:transparent;color:var(--text-primary);font-size:1.05rem;font-family:inherit;resize:none;overflow:hidden;line-height:1.5;max-height:130px}.chat-input:focus{outline:none}.chat-input::placeholder{color:var(--text-secondary)}.chat-send-btn{flex-shrink:0;width:42px;height:42px;border:none;border-radius:50%;background:var(--accent-blue);color:#fff;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:background .2s,transform .1s;margin-left:8px}.chat-send-btn:hover:not(:disabled){background:#2563eb;transform:scale(1.05)}.chat-send-btn:disabled{opacity:.5;cursor:not-allowed}.chat-box .ai-generated-progression{margin-top:8px}.ai-progression-card{background:var(--bg-tertiary);border:1px solid var(--accent-green);border-radius:10px;padding:10px 14px}.ai-progression-card h4{color:var(--accent-green);font-size:.95rem;margin-bottom:4px}.ai-progression-chords{font-size:1rem;font-weight:600;color:var(--text-primary);margin-bottom:4px;font-family:Courier New,monospace}.ai-progression-desc{font-size:.85rem;color:var(--text-secondary);margin-bottom:8px}.play-ai-btn{padding:6px 14px;background:var(--accent-green);color:var(--bg-primary);border:none;border-radius:6px;font-weight:600;font-size:.85rem;cursor:pointer;transition:background .2s}.play-ai-btn:hover{background:#27ae60}.chat-box .ai-error{margin-top:8px;padding:8px 12px;background:#e74c3c1a;border:1px solid var(--accent-red);border-radius:8px;color:var(--accent-red);font-size:.85rem}.progression-list{display:grid;grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:10px;margin-bottom:12px;overflow-y:auto;max-height:500px;padding-right:5px}.progression-list::-webkit-scrollbar{width:5px}.progression-list::-webkit-scrollbar-track{background:var(--bg-tertiary);border-radius:3px}.progression-list::-webkit-scrollbar-thumb{background:var(--border-color);border-radius:3px}.progression-item{position:relative;background:var(--bg-tertiary);padding:10px 12px;border-radius:6px;border:2px solid var(--border-color);transition:all .3s ease}.progression-item:hover{border-color:var(--accent-blue)}.progression-item.playing{border-color:var(--accent-violet);box-shadow:0 0 0 1px #8b5cf666,0 4px 12px #8b5cf633;animation:pulse 1s infinite}@keyframes pulse{0%,to{box-shadow:0 0 0 1px #8b5cf666,0 4px 12px #8b5cf633}50%{box-shadow:0 0 0 1px #8b5cf680,0 6px 20px #8b5cf64d}}.progression-item h3{font-size:.85rem;color:var(--text-primary);margin-bottom:4px}.progression-chords{color:var(--accent-violet);font-size:.8rem;margin-bottom:3px;font-weight:600}.progression-desc{color:var(--text-secondary);font-size:.7rem;margin-bottom:6px;font-style:italic}.play-progression-btn{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);background:var(--bg-secondary);color:var(--text-primary);border:1px solid var(--border-color);width:36px;height:36px;font-size:.85rem;border-radius:50%;cursor:pointer;transition:all .2s ease;opacity:0;pointer-events:none;display:flex;align-items:center;justify-content:center;padding:0;z-index:1}.progression-item:hover .play-progression-btn,.progression-item:hover .use-progression-btn{opacity:1;pointer-events:auto}.play-progression-btn:hover{background:var(--bg-tertiary);border-color:var(--text-secondary);box-shadow:0 2px 8px #0000004d}.progression-item.playing .play-progression-btn{opacity:1;pointer-events:auto}.use-progression-btn{position:absolute;bottom:10px;right:12px;background:#3898ec;color:#fff;border:none;padding:4px 14px;font-size:.65rem;font-weight:700;border-radius:4px;text-transform:uppercase;letter-spacing:.5px;cursor:pointer;transition:all .15s ease;opacity:0;pointer-events:none}.use-progression-btn:hover{background:#2a7ed4;box-shadow:0 2px 10px #3898ec66}.use-progression-btn:active{transform:scale(.96)}.pattern-control{flex-shrink:0}#patternSelect{padding:6px 10px;font-size:.8rem;background:var(--bg-tertiary);background-image:none;color:var(--text-primary);border:1px solid var(--border-color);border-radius:5px;cursor:pointer;-moz-appearance:none;-webkit-appearance:none;appearance:none;text-overflow:ellipsis}#patternSelect::-ms-expand{display:none}#patternSelect:hover,#patternSelect:focus{border-color:var(--accent-blue);outline:none}#patternSelect optgroup{background:var(--bg-secondary);color:var(--accent-gold);font-weight:600}#patternSelect option{background:var(--bg-secondary);color:var(--text-primary);font-weight:400}.pattern-notation{display:flex;align-items:center;gap:4px;flex:1;min-width:0;flex-wrap:wrap}.pattern-notation .beat{display:flex;align-items:center;justify-content:center;width:26px;height:26px;font-size:1.1rem;font-weight:600;border-radius:4px;transition:all .15s ease}.pattern-notation .beat-down{color:var(--accent-blue);background:#4a90e226}.pattern-notation .beat-up{color:var(--accent-green);background:#2ecc7126}.pattern-notation .beat-rest{color:var(--text-secondary);background:#8080801a}.pattern-notation .beat-mute{color:var(--accent-red);background:#e74c3c26}.pattern-notation .beat-accent{font-weight:800;border:2px solid currentColor}.pattern-notation .beat.playing{transform:scale(1.2);box-shadow:0 0 12px currentColor}.tempo-control{display:flex;align-items:center;gap:8px;flex-shrink:0}.tempo-display{font-size:.75rem;font-weight:600;color:var(--text-secondary);white-space:nowrap;min-width:52px}#tempoSlider{width:100px;height:4px;border-radius:3px;background:var(--border-color);outline:none;-webkit-appearance:none}#tempoSlider::-webkit-slider-thumb{-webkit-appearance:none;width:18px;height:18px;border-radius:50%;background:var(--gradient-primary);cursor:pointer;box-shadow:0 2px 6px #d4884a66}#tempoValue{color:var(--text-primary);font-weight:600;font-size:.75rem}.site-footer{padding:20px 24px;border-top:none;background:var(--bg-primary);flex-shrink:0}.footer-content{display:flex;align-items:center;justify-content:center;flex-wrap:wrap;gap:6px;font-size:.78rem;color:var(--text-muted)}.footer-brand{font-weight:600;color:var(--text-secondary);letter-spacing:.03em}.footer-sep{opacity:.4}.footer-links{display:inline-flex;gap:12px;margin-left:8px}.footer-links a{color:var(--text-muted);text-decoration:none;transition:color .2s}.footer-links a:hover{color:var(--text-primary)}.go-layout{display:flex;min-height:100%}.go-sidebar{width:180px;flex-shrink:0;display:flex;flex-direction:column;gap:2px;padding:20px 0 20px 12px;border-right:1px solid var(--border-color)}.go-sidebar-item{display:block;width:100%;text-align:left;padding:10px 14px;border:none;border-radius:var(--radius-sm, 6px);background:transparent;color:var(--text-muted);font-size:.85rem;cursor:pointer;transition:background .15s,color .15s}.go-sidebar-item:hover{background:var(--bg-tertiary);color:var(--text-primary)}.go-sidebar-item.active{background:#f59e0b1f;color:var(--accent-gold, #f59e0b);font-weight:600}.go-sidebar-item.done{color:var(--accent-green, #22c55e)}.go-sidebar-item.done:after{content:" ✓"}@media(max-width:640px){.go-layout{flex-direction:column}.go-sidebar{width:100%;flex-direction:row;overflow-x:auto;gap:4px;padding:10px;border-right:none;border-bottom:1px solid var(--border-color)}.go-sidebar-item{white-space:nowrap;padding:8px 12px;font-size:.8rem}}.go-container{max-width:560px;margin:0 auto;padding:40px 20px;flex:1}.onboarding-step{display:none}.onboarding-step.active{display:block;animation:onboardFadeIn .35s ease}@keyframes onboardFadeIn{0%{opacity:0;transform:translateY(12px)}to{opacity:1;transform:translateY(0)}}.onboarding-header{text-align:center;margin-bottom:32px}.onboarding-header h2{font-size:1.8rem;font-weight:600;color:var(--text-primary);margin-bottom:6px}.onboarding-subtitle{color:var(--text-muted);font-size:.95rem}.onboarding-progress{display:flex;justify-content:center;gap:8px;margin-top:20px}.progress-dot{width:10px;height:10px;border-radius:50%;background:var(--border-color);transition:background .3s,transform .3s}.progress-dot.active{background:var(--accent-gold, #f59e0b);transform:scale(1.25)}.progress-dot.done{background:#22c55e}.onboarding-question{font-size:1.15rem;font-weight:500;color:var(--text-primary);margin-bottom:16px;text-align:center}.onboarding-hint{text-align:center;color:var(--text-muted);font-size:.85rem;margin-bottom:16px}.onboarding-options{display:flex;flex-direction:column;gap:12px}.onboarding-option{display:flex;align-items:center;gap:14px;padding:16px 20px;background:var(--bg-secondary);border:1.5px solid var(--border-color);border-radius:var(--radius-lg, 12px);cursor:pointer;transition:border-color .2s,background .2s,transform .15s;text-align:left;color:var(--text-primary);font-family:inherit;font-size:inherit}.onboarding-option:hover{border-color:var(--accent-gold, #f59e0b);background:var(--bg-tertiary);transform:translateY(-1px)}.onboarding-option.selected{border-color:var(--accent-gold, #f59e0b);background:#f59e0b14}.option-icon{font-size:1.6rem;flex-shrink:0}.option-label{font-weight:600;font-size:1rem;display:block}.option-desc{font-size:.82rem;color:var(--text-muted);display:block;margin-top:2px}.genre-grid{flex-direction:row;flex-wrap:wrap;justify-content:center;gap:10px}.onboarding-chip{padding:10px 20px;border-radius:999px;border:1.5px solid var(--border-color);background:var(--bg-secondary);color:var(--text-primary);font-family:inherit;font-size:.9rem;font-weight:500;cursor:pointer;transition:border-color .2s,background .2s,transform .15s}.onboarding-chip:hover{border-color:var(--accent-gold, #f59e0b);transform:translateY(-1px)}.onboarding-chip.selected{border-color:var(--accent-gold, #f59e0b);background:#f59e0b1f;color:var(--accent-gold, #f59e0b)}.onboarding-next-btn{display:block;margin:28px auto 0;padding:12px 40px;border:none;border-radius:var(--radius-lg, 12px);background:var(--accent-gold, #f59e0b);color:#000;font-family:inherit;font-size:1rem;font-weight:600;cursor:pointer;transition:opacity .2s,transform .15s}.onboarding-next-btn:disabled{opacity:.35;cursor:not-allowed}.onboarding-next-btn:not(:disabled):hover{transform:translateY(-1px);opacity:.9}.onboarding-done{text-align:center;padding:40px 0}.onboarding-done-icon{width:64px;height:64px;line-height:64px;font-size:2rem;font-weight:700;border-radius:50%;background:#22c55e;color:#fff;margin:0 auto 20px}.onboarding-start-btn{margin-top:24px;padding:14px 48px;border:none;border-radius:var(--radius-lg, 12px);background:var(--accent-gold, #f59e0b);color:#000;font-family:inherit;font-size:1.05rem;font-weight:600;cursor:pointer;transition:opacity .2s,transform .15s}.onboarding-start-btn:hover{transform:translateY(-1px);opacity:.9}.onboarding-tuner-prompt{text-align:center;padding:20px 0}.tuner-prompt-icon{font-size:3rem;margin-bottom:12px}.onboarding-tuner-prompt p{color:var(--text-muted);margin-bottom:24px;font-size:.95rem}.onboarding-skip-link{display:block;margin:16px auto 0;background:none;border:none;color:var(--text-muted);font-family:inherit;font-size:.85rem;cursor:pointer;text-decoration:underline;transition:color .2s}.onboarding-skip-link:hover{color:var(--text-primary)}.chord-challenge{text-align:center;padding:16px 0}.chord-challenge-cards{display:flex;justify-content:center;gap:16px;flex-wrap:wrap;margin-bottom:24px}.chord-card{width:110px;display:flex;flex-direction:column;align-items:center;justify-content:flex-start;padding:8px 6px;border-radius:var(--radius-lg, 12px);border:2px solid var(--border-color);background:var(--bg-secondary);transition:border-color .3s,background .3s,transform .2s}.chord-card .chord-diagram{width:100%;height:auto;margin-bottom:2px}.chord-card .chord-card-name{font-size:.85rem;font-weight:700;color:var(--text-muted);transition:color .3s}.chord-card .chord-card-check{font-size:.9rem;margin-top:4px;opacity:0;transition:opacity .3s}.chord-card.current{border-color:var(--accent-gold, #f59e0b);background:#f59e0b14;transform:scale(1.08)}.chord-card.current .chord-card-name{color:var(--accent-gold, #f59e0b)}.chord-card.done{border-color:#22c55e;background:#22c55e14}.chord-card.done .chord-card-name{color:#22c55e}.chord-card.done .chord-card-check{opacity:1;color:#22c55e}.chord-challenge-status{font-size:1.1rem;color:var(--text-secondary);min-height:1.5em}.challenge-mic-select{display:flex;align-items:center;justify-content:center;gap:10px;margin-top:20px}.challenge-mic-select label{color:var(--text-muted);font-size:.85rem}.challenge-mic-select select{background:var(--bg-tertiary);color:var(--text-primary);border:1px solid var(--border-color);border-radius:var(--radius, 6px);padding:6px 10px;font-family:inherit;font-size:.85rem;max-width:280px}.note-exercise{text-align:center;padding:16px 0}.note-exercise-neck{display:flex;justify-content:center;margin-bottom:12px}.note-exercise-neck .neck-diagram{width:100%;max-width:400px;height:auto}.note-exercise-label{font-size:2rem;font-weight:700;color:var(--accent-gold, #f59e0b);text-align:center;margin-bottom:12px;transition:color .3s,transform .2s}.note-exercise-label.correct{color:#22c55e;transform:scale(1.1)}.note-exercise-target{display:flex;flex-direction:column;align-items:center;gap:4px;margin-bottom:20px}.note-target-name{font-size:3rem;font-weight:700;color:var(--accent-gold, #f59e0b);line-height:1;transition:color .3s,transform .2s}.note-target-name.correct{color:#22c55e;transform:scale(1.1)}.note-target-string{font-size:.95rem;color:var(--text-muted)}.note-target-fret{font-size:1.1rem;font-weight:500;color:var(--text-secondary)}.note-exercise-dots{display:flex;justify-content:center;gap:10px;margin-bottom:20px}.note-dot{width:14px;height:14px;border-radius:50%;border:2px solid var(--border-color);background:transparent;transition:background .3s,border-color .3s}.note-dot.current{border-color:var(--accent-gold, #f59e0b);background:#f59e0b33}.note-dot.done{border-color:#22c55e;background:#22c55e}.note-exercise-status{font-size:1.05rem;color:var(--text-secondary);min-height:1.5em}@media(max-width:1200px){.content-grid{grid-template-columns:250px 1fr}}@media(max-width:768px){header h1{font-size:1.8rem}.container{padding:18px 14px}.top-bar{grid-template-columns:1fr;justify-items:center;gap:12px;margin-bottom:18px}.brand-lockup,.nav-links{justify-self:center}.nav-links{max-width:100%;overflow-x:auto;flex-wrap:nowrap;scrollbar-width:none}.nav-links::-webkit-scrollbar{display:none}.content-grid{grid-template-columns:1fr}.chord-buttons{grid-template-columns:repeat(4,1fr);max-height:200px}.progressions-section{max-height:none}.menu-bar{gap:5px;padding:6px}.menu-btn{min-width:max-content;font-size:.8rem;padding:7px 13px}.progression-filters{gap:6px}.filter-trigger{padding:4px 8px;font-size:.78rem}.filter-menu{min-width:140px}}.tuner-container{max-width:600px;margin:0 auto;padding:20px;position:relative}.mic-permission-overlay{position:fixed;inset:0;background:#000000e6;display:flex;align-items:center;justify-content:center;z-index:1000;opacity:1;transition:opacity .3s ease}.mic-permission-overlay.hidden{opacity:0;pointer-events:none}.mic-permission-card{background:var(--bg-secondary);padding:40px 50px;border-radius:var(--radius-xl);text-align:center;border:1px solid var(--border-color);box-shadow:var(--shadow-lg);max-width:400px}.mic-icon-large{font-size:4rem;margin-bottom:20px}.mic-permission-card h3{font-size:1.5rem;color:var(--text-primary);margin-bottom:10px}.mic-permission-card p{color:var(--text-secondary);margin-bottom:25px}.request-mic-btn{background:var(--gradient-primary);color:#fff;border:none;padding:14px 32px;font-size:1.1rem;font-weight:600;border-radius:var(--radius);cursor:pointer;transition:all .2s ease;box-shadow:0 4px 12px #d4884a59}.request-mic-btn:hover{transform:translateY(-2px);box-shadow:0 8px 24px #d4884a73}.tuner-stage{background:var(--bg-secondary);border-radius:var(--radius-lg);padding:28px;border:1px solid var(--border-color);box-shadow:var(--shadow)}.tuner-heading{margin:0 0 16px;font-size:1.5rem;font-weight:300;letter-spacing:.02em;color:var(--text-secondary)}.tuner-top-bar{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:12px;margin-bottom:25px;padding-bottom:15px;border-bottom:1px solid var(--border-color)}.tuner-bottom-bar{display:flex;flex-wrap:wrap;justify-content:center;align-items:center;gap:16px;margin-top:20px;padding-top:15px}.tuning-selector{display:flex;align-items:center;gap:10px}.tuning-selector label{color:var(--text-secondary);font-size:.9rem}#tuningSelect{background:var(--bg-tertiary);color:var(--text-primary);border:1px solid var(--border-color);padding:8px 12px;border-radius:6px;font-size:.9rem;cursor:pointer}#tuningSelect:hover,#tuningSelect:focus{border-color:var(--accent-blue);outline:none}.input-selector{display:flex;align-items:center;gap:10px}.input-selector label{color:var(--text-secondary);font-size:.9rem}#inputSelect{background:var(--bg-tertiary);color:var(--text-primary);border:1px solid var(--border-color);padding:8px 12px;border-radius:6px;font-size:.9rem;cursor:pointer;min-width:160px;max-width:220px}#inputSelect:hover,#inputSelect:focus{border-color:var(--accent-blue);outline:none}.tuner-settings{display:flex;gap:8px}.settings-btn,.contrast-btn{background:var(--bg-tertiary);border:1px solid var(--border-color);color:var(--text-secondary);width:36px;height:36px;border-radius:6px;cursor:pointer;transition:all .2s ease;font-size:1rem}.settings-btn:hover,.contrast-btn:hover{background:var(--bg-primary);color:var(--text-primary);border-color:var(--accent-blue)}.contrast-btn.active{background:var(--gradient-primary);color:#fff;border-color:transparent}.tuning-dial-container{display:flex;flex-direction:column;align-items:center;margin-bottom:30px}.tuning-dial{position:relative;width:300px;height:180px;margin-bottom:15px}.dial-svg{width:100%;height:100%}.dial-arc-bg{fill:none;stroke:var(--bg-tertiary);stroke-width:20;stroke-linecap:round}.dial-arc-red-left,.dial-arc-red-right{fill:none;stroke:var(--accent-red);stroke-width:18;stroke-linecap:round;opacity:.75}.dial-arc-yellow-left,.dial-arc-yellow-right{fill:none;stroke:var(--accent-gold);stroke-width:18;stroke-linecap:round;opacity:.75}.dial-arc-green{fill:none;stroke:var(--accent-green);stroke-width:18;stroke-linecap:round;opacity:.9}.dial-center-notch{stroke:var(--accent-green);stroke-width:3;stroke-linecap:round}.dial-ticks line{stroke:var(--text-secondary);stroke-width:2;opacity:.5}.dial-needle-container{position:absolute;bottom:10px;left:50%;transform:translate(-50%) rotate(0);width:4px;height:110px;transform-origin:bottom center;transition:transform .12s cubic-bezier(.4,0,.2,1)}.dial-needle{position:absolute;bottom:8px;left:50%;transform:translate(-50%);width:4px;height:100px;background:linear-gradient(to top,var(--text-muted) 0%,var(--text-primary) 100%);border-radius:2px;transform-origin:bottom center;transition:transform .15s cubic-bezier(.4,0,.2,1);box-shadow:0 0 10px #fff3}.dial-needle.in-tune{background:linear-gradient(to top,#16a34a 0%,var(--accent-green) 100%);box-shadow:0 0 20px #22c55e80}.dial-needle.sharp{background:linear-gradient(to top,#b91c1c 0%,var(--accent-red) 100%)}.dial-needle.flat{background:linear-gradient(to top,var(--accent-blue) 0%,var(--accent-cyan) 100%)}.dial-needle-base{position:absolute;bottom:0;left:50%;transform:translate(-50%);width:16px;height:16px;background:var(--bg-tertiary);border:3px solid var(--text-secondary);border-radius:50%;z-index:1}.direction-arrow{position:absolute;bottom:50px;display:flex;flex-direction:column;align-items:center;opacity:0;transition:opacity .3s ease;pointer-events:none}.direction-arrow.visible{opacity:1}.direction-arrow.pulsing .arrow-icon{animation:arrowPulse .6s ease-in-out infinite}.arrow-left{left:20px}.arrow-right{right:20px}.arrow-icon{font-size:1.5rem;color:var(--accent-violet)}.arrow-text{font-size:.7rem;color:var(--text-secondary);margin-top:4px;white-space:nowrap}@keyframes arrowPulse{0%,to{transform:scale(1);opacity:1}50%{transform:scale(1.3);opacity:.7}}.lock-in-glow{position:absolute;inset:0;border-radius:50%;pointer-events:none;opacity:0;transition:opacity .3s ease}.lock-in-glow.active{opacity:1;background:radial-gradient(circle at 50% 100%,rgba(46,204,113,.3) 0%,transparent 70%);animation:lockInPulse .5s ease-out}@keyframes lockInPulse{0%{transform:scale(.95)}50%{transform:scale(1.02)}to{transform:scale(1)}}.note-display{text-align:center;margin-bottom:10px}.detected-note{font-size:4rem;font-weight:700;color:var(--text-primary);line-height:1;font-family:Helvetica Neue,Arial,sans-serif;transition:color .2s ease}.detected-note.in-tune{color:var(--accent-green);text-shadow:0 0 20px rgba(34,197,94,.5)}.cents-display{display:flex;align-items:baseline;justify-content:center;gap:4px;margin-top:5px}.cents-value{font-size:1.5rem;font-weight:600;color:var(--text-secondary);font-family:Monaco,Menlo,monospace}.cents-value.positive{color:var(--accent-red)}.cents-value.positive:before{content:"+"}.cents-value.negative{color:var(--accent-blue)}.cents-value.in-tune{color:var(--accent-green)}.cents-label{font-size:.8rem;color:var(--text-secondary)}.hz-display{font-size:.9rem;color:var(--text-secondary);font-family:Monaco,Menlo,monospace;margin-top:8px}.tuner-status{text-align:center;color:var(--text-secondary);font-size:1rem;font-style:italic;margin-bottom:20px}.tuner-status.active{color:var(--accent-blue);font-style:normal}.headstock-container{display:flex;justify-content:center;margin-bottom:25px}.headstock-svg{width:220px;height:260px;overflow:visible}.headstock-body{fill:#1a1a2e;stroke:var(--border-color);stroke-width:1.5}.string-post{fill:#888;stroke:#555;stroke-width:1}.headstock-string{stroke:#aaa;stroke-width:1.2;stroke-linecap:round;opacity:.5;transition:all .3s ease}.headstock-string:nth-child(7){stroke-width:2.8}.headstock-string:nth-child(8){stroke-width:2.3}.headstock-string:nth-child(9){stroke-width:1.8}.headstock-string:nth-child(10){stroke-width:1.4}.headstock-string:nth-child(11){stroke-width:1.1}.headstock-string:nth-child(12){stroke-width:.9}.headstock-string.active{stroke:var(--accent-violet);opacity:1;filter:drop-shadow(0 0 4px rgba(139,92,246,.6))}.headstock-string.in-tune{stroke:var(--accent-green);opacity:1;filter:drop-shadow(0 0 6px rgba(34,197,94,.7))}.headstock-nut{fill:#d4c9a8;stroke:#b8a97e;stroke-width:1}.headstock-neck{fill:#2a1810;stroke:none}.fret-line{stroke:#888;stroke-width:1.5;opacity:.6}.peg-shaft{stroke:#666;stroke-width:4;stroke-linecap:round}.peg-bg{fill:var(--bg-tertiary);stroke:var(--border-color);stroke-width:2;transition:all .2s ease}.peg-knob{fill:var(--bg-secondary);stroke:var(--text-muted);stroke-width:1.5;transition:all .2s ease}.peg-note{fill:var(--text-primary);font-size:13px;font-weight:700;text-anchor:middle;pointer-events:none;font-family:Helvetica Neue,Arial,sans-serif}.string-node{cursor:pointer;opacity:.65;transition:opacity .2s ease}.string-node:hover{opacity:.9}.string-node:hover .peg-bg{stroke:var(--accent-blue)}.string-node:focus-visible .peg-bg{stroke:var(--accent-blue);stroke-width:3}.string-node.active{opacity:1}.string-node.active .peg-bg{stroke:var(--accent-violet);fill:#8b5cf633;filter:drop-shadow(0 0 8px rgba(139,92,246,.5))}.string-node.active .peg-knob{stroke:var(--accent-violet)}.string-node.in-tune .peg-bg{stroke:var(--accent-green);fill:#22c55e33;filter:drop-shadow(0 0 10px rgba(34,197,94,.6))}.string-node.in-tune .peg-knob{stroke:var(--accent-green)}.string-node.in-tune .peg-note{fill:var(--accent-green)}.string-node.locked .peg-knob{stroke-dasharray:5 3;stroke:var(--accent-blue)}.string-node.locked .peg-note{fill:var(--accent-blue)}.string-node.ref-playing{opacity:1}.string-node.ref-playing .peg-knob{fill:var(--accent-blue);stroke:var(--accent-blue)}.string-node.ref-playing .peg-bg{stroke:var(--accent-blue);filter:drop-shadow(0 0 8px rgba(56,152,219,.6));animation:pegPulse .6s ease-in-out infinite}.string-node.ref-playing .peg-note{fill:#fff}@keyframes pegPulse{0%,to{transform:scale(1);transform-origin:center}50%{transform:scale(1.08);transform-origin:center}}.string-node.current{opacity:1}.string-node.current .peg-bg{stroke:var(--accent-gold, #f59e0b);fill:#f59e0b26;filter:drop-shadow(0 0 10px rgba(245,158,11,.5));animation:pegPulse 1.2s ease-in-out infinite}.string-node.current .peg-knob{stroke:var(--accent-gold, #f59e0b)}.string-node.current .peg-note{fill:var(--accent-gold, #f59e0b)}.string-node.tuned{opacity:1}.string-node.tuned .peg-bg{stroke:var(--accent-green);fill:#22c55e40;filter:drop-shadow(0 0 10px rgba(34,197,94,.6))}.string-node.tuned .peg-knob{stroke:var(--accent-green);fill:#22c55e1a}.string-node.tuned .peg-note{fill:var(--accent-green)}.tuner-instruction{text-align:center;padding:20px 0}.tuner-instruction-text{font-size:1.4rem;color:var(--text-primary);margin-bottom:8px}.tuner-instruction-text strong{color:var(--accent-gold, #f59e0b);font-size:1.6rem}.tuning-meter{margin:12px auto 8px;max-width:320px}.tuning-meter-svg{width:100%;height:auto}.meter-track{fill:var(--bg-tertiary, #1e1e2e);stroke:var(--border-color, #333);stroke-width:1}.meter-green-zone{fill:#22c55e2e;stroke:#22c55e59;stroke-width:1}.meter-center-line{stroke:var(--text-secondary, #888);stroke-width:1;stroke-dasharray:3 2;opacity:.5}.meter-string{stroke:var(--accent-gold, #f59e0b);stroke-width:3;stroke-linecap:round;filter:drop-shadow(0 0 4px rgba(245,158,11,.5));transition:x1 .12s ease-out,x2 .12s ease-out}.meter-string.in-tune{stroke:var(--accent-green);filter:drop-shadow(0 0 6px rgba(34,197,94,.7))}.meter-label{font-size:10px;fill:var(--text-secondary, #888);opacity:.6}.meter-label-flat{text-anchor:start}.meter-label-sharp{text-anchor:end}.tuner-complete{text-align:center;padding:24px 0;animation:tuneCompleteIn .5s ease-out}.tuner-complete-icon{font-size:3rem;color:var(--accent-green);line-height:1;margin-bottom:8px;filter:drop-shadow(0 0 12px rgba(34,197,94,.6))}.tuner-complete-text{font-size:1.5rem;font-weight:600;color:var(--accent-green)}@keyframes tuneCompleteIn{0%{opacity:0;transform:scale(.9)}to{opacity:1;transform:scale(1)}}.headstock-string.tuned{stroke:var(--accent-green);filter:drop-shadow(0 0 3px rgba(34,197,94,.5))}.headstock-string.current{stroke:var(--accent-gold, #f59e0b);filter:drop-shadow(0 0 3px rgba(245,158,11,.5))}.high-contrast .detected-note:after{content:"";display:block;margin:10px auto 0;width:0;height:0}.high-contrast .detected-note.sharp:after{border-left:12px solid transparent;border-right:12px solid transparent;border-bottom:18px solid #E74C3C}.high-contrast .detected-note.flat:after{border-left:12px solid transparent;border-right:12px solid transparent;border-top:18px solid #3498DB}.high-contrast .detected-note.in-tune:after{width:20px;height:20px;border-radius:50%;background:#2ecc71}.tuner-bottom-controls{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:20px;padding-top:20px;border-top:1px solid var(--border-color)}.input-meter-container{display:flex;align-items:center;gap:8px}.input-meter-label{font-size:.75rem;color:var(--text-secondary)}.input-meter{width:60px;height:8px;background:var(--bg-tertiary);border-radius:4px;overflow:hidden}.input-meter-fill{height:100%;width:0%;background:var(--gradient-primary);transition:width .05s ease;border-radius:4px}.sensitivity-control{position:relative}.sensitivity-btn{background:var(--bg-tertiary);border:1px solid var(--border-color);color:var(--text-secondary);width:36px;height:36px;border-radius:6px;cursor:pointer;font-size:1rem;transition:all .2s ease}.sensitivity-btn:hover,.sensitivity-btn.active{background:var(--bg-primary);border-color:var(--accent-blue);color:var(--text-primary)}.sensitivity-slider-container{position:absolute;bottom:50px;left:50%;transform:translate(-50%);background:var(--bg-secondary);border:1px solid var(--border-color);border-radius:8px;padding:15px;min-width:180px;display:none;box-shadow:0 10px 30px #0000004d;z-index:10}.sensitivity-slider-container.visible{display:block}.sensitivity-slider-container label{display:block;font-size:.85rem;color:var(--text-secondary);margin-bottom:10px}#sensitivitySlider{width:100%;height:6px;border-radius:3px;background:var(--bg-tertiary);outline:none;-webkit-appearance:none}#sensitivitySlider::-webkit-slider-thumb{-webkit-appearance:none;width:16px;height:16px;border-radius:50%;background:var(--accent-blue);cursor:pointer}.sensitivity-value{display:block;text-align:center;margin-top:8px;font-size:.85rem;color:var(--accent-blue);font-weight:600}.reference-tone-btn{display:flex;align-items:center;gap:6px;background:var(--bg-tertiary);border:1px solid var(--border-color);color:var(--text-secondary);padding:8px 14px;border-radius:6px;cursor:pointer;font-size:.85rem;transition:all .2s ease}.reference-tone-btn:hover{background:var(--bg-primary);border-color:var(--accent-blue);color:var(--text-primary)}.reference-tone-btn.active{background:var(--gradient-primary);border-color:transparent;color:#fff}.reference-tone-btn .speaker-icon{font-size:1rem}.ref-label{font-weight:600}.a4-reference{display:flex;align-items:center;gap:8px}.a4-reference label{font-size:.85rem;color:var(--text-secondary)}#a4Slider{width:80px;height:6px;border-radius:3px;background:var(--bg-tertiary);outline:none;-webkit-appearance:none}#a4Slider::-webkit-slider-thumb{-webkit-appearance:none;width:14px;height:14px;border-radius:50%;background:var(--gradient-primary);cursor:pointer;box-shadow:0 2px 6px #d4884a59}#a4Value{font-size:.85rem;color:var(--accent-violet);font-weight:600;min-width:55px}@media(max-width:600px){.tuner-container{padding:10px}.tuner-stage{padding:15px}.tuner-top-bar{flex-direction:column;gap:12px}.tuning-dial{width:260px;height:160px}.dial-needle{height:85px}.detected-note{font-size:3rem}.headstock-svg{width:190px;height:224px}.tuner-bottom-controls{flex-direction:column;gap:15px}.a4-reference{flex-wrap:wrap;justify-content:center}}@media(max-width:400px){.headstock-svg{width:165px;height:195px}.mic-permission-card{padding:25px 20px;margin:20px}}.lesson-container{max-width:860px;margin:0 auto;display:flex;flex-direction:column;gap:20px}.lesson-timer-bar{display:flex;align-items:center;gap:10px;justify-content:center;background:var(--bg-secondary);border:1px solid var(--border-color);border-radius:var(--radius);padding:8px 20px;font-size:.9rem}.timer-icon{font-size:1.1rem}.timer-label{color:var(--text-secondary)}.timer-value{font-weight:700;color:var(--accent-gold);font-family:Courier New,monospace}.timer-sep{color:var(--border-color)}.streak-badge{color:var(--text-secondary);font-size:.85rem}.browser-header{margin-bottom:16px}.browser-header h2{font-size:1.6rem;font-weight:700;color:var(--text-primary);margin-bottom:4px}.browser-subtitle{color:var(--text-secondary);font-size:.95rem}.lesson-cards{display:flex;flex-direction:column;gap:12px;margin-bottom:40px}.lesson-card{display:block;width:100%;text-align:left;background:var(--bg-secondary);border:1px solid var(--border-color);border-radius:var(--radius-lg);padding:20px 24px;cursor:pointer;transition:all .2s ease}.lesson-card:hover{border-color:var(--accent-gold);transform:translateY(-2px);box-shadow:var(--shadow-lg)}.lesson-card.completed{border-left:4px solid var(--accent-green)}.lesson-card.in-progress{border-left:4px solid var(--accent-gold)}.lcard-number{font-size:.75rem;text-transform:uppercase;letter-spacing:1px;color:var(--text-muted);margin-bottom:4px;font-weight:600}.lcard-title{font-size:1.25rem;font-weight:700;color:var(--text-primary);margin-bottom:4px}.lcard-subtitle{font-size:.9rem;color:var(--text-secondary);margin-bottom:10px}.lcard-meta{display:flex;gap:12px;align-items:center;font-size:.8rem}.lcard-difficulty{color:var(--text-muted);text-transform:capitalize}.lcard-duration{color:var(--text-muted)}.lcard-status{font-weight:600}.lcard-status--new{color:var(--text-muted)}.lcard-status--in-progress{color:var(--accent-gold)}.lcard-status--completed{color:var(--accent-green)}.lcard-progress{height:3px;background:var(--bg-tertiary);border-radius:2px;margin-top:10px;overflow:hidden}.lcard-progress-fill{height:100%;background:var(--accent-gold);border-radius:2px;transition:width .3s}.tools-header{margin-bottom:12px}.tools-header h2{font-size:1.3rem;font-weight:700;color:var(--text-primary);margin-bottom:4px}.tools-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}.tool-card{display:flex;flex-direction:column;align-items:center;text-align:center;background:var(--bg-secondary);border:1px solid var(--border-color);border-radius:var(--radius);padding:20px 12px;cursor:pointer;transition:all .2s ease}.tool-card:hover{border-color:var(--accent-gold);transform:translateY(-2px)}.tool-icon{font-size:1.6rem;margin-bottom:8px}.tool-name{font-weight:700;font-size:.95rem;color:var(--text-primary);margin-bottom:4px}.tool-desc{font-size:.8rem;color:var(--text-muted)}.lesson-top-bar{display:flex;align-items:center;gap:12px;margin-bottom:16px}.lesson-back-btn{background:none;border:1px solid var(--border-color);color:var(--text-secondary);padding:6px 14px;border-radius:var(--radius-sm);font-size:.85rem;cursor:pointer;white-space:nowrap;transition:all .15s}.lesson-back-btn:hover{color:var(--text-primary);border-color:var(--text-muted)}.lesson-progress-bar{flex:1;height:4px;background:var(--bg-tertiary);border-radius:2px;overflow:hidden}.lesson-progress-fill{height:100%;background:var(--accent-gold);border-radius:2px;transition:width .3s}.lesson-step-counter{font-size:.8rem;color:var(--text-muted);white-space:nowrap}.lesson-hero{text-align:center;margin-bottom:24px}.lesson-number{display:block;font-size:.75rem;text-transform:uppercase;letter-spacing:1.5px;color:var(--accent-gold);font-weight:700;margin-bottom:6px}.lesson-title{font-size:1.8rem;font-weight:700;color:var(--text-primary);margin-bottom:6px}.lesson-subtitle{font-size:1rem;color:var(--text-secondary);margin-bottom:12px}.lesson-meta{display:flex;gap:10px;justify-content:center;font-size:.8rem;flex-wrap:wrap}.lesson-diff{text-transform:capitalize;color:var(--text-muted);background:var(--bg-tertiary);padding:3px 10px;border-radius:var(--radius-sm)}.lesson-dur{color:var(--text-muted);background:var(--bg-tertiary);padding:3px 10px;border-radius:var(--radius-sm)}.lesson-tags{display:flex;gap:4px}.tag{background:var(--bg-tertiary);color:var(--text-muted);padding:3px 8px;border-radius:var(--radius-sm);font-size:.75rem}.lesson-steps{min-height:200px}.lstep{background:var(--bg-secondary);border:1px solid var(--border-color);border-radius:var(--radius-lg);padding:28px;margin-bottom:0;animation:fadeIn .3s ease}.lstep-title{font-size:1.25rem;font-weight:700;color:var(--text-primary);margin-bottom:14px}.lstep-body{color:var(--text-secondary);font-size:.95rem;line-height:1.7}.lstep-body p{margin-bottom:12px}.lstep-body p:last-child{margin-bottom:0}.lstep-body strong{color:var(--text-primary)}.lstep-body em{color:var(--accent-gold);font-style:italic}.lstep-body ul{padding-left:20px;margin:10px 0}.lstep-body li{margin-bottom:6px}.lstep-caption{font-size:.85rem;color:var(--text-muted);font-style:italic;margin-top:12px;text-align:center}.lstep--tip{background:#eab3080f;border-color:#eab30833;display:flex;gap:14px;align-items:flex-start}.tip-icon{font-size:1.5rem;flex-shrink:0;margin-top:2px}.tip-content{flex:1}.tip-title{font-size:1rem;font-weight:700;color:var(--accent-gold);margin-bottom:6px}.tip-content p{color:var(--text-secondary);font-size:.9rem;line-height:1.6}.guitar-tab{background:var(--bg-primary);border:1px solid var(--border-color);border-radius:var(--radius);padding:16px 20px;font-family:Courier New,Courier,monospace;font-size:.9rem;color:var(--accent-gold);line-height:1.5;overflow-x:auto;margin:14px 0}.chord-cards{display:flex;gap:8px;flex-wrap:wrap;justify-content:center;margin:16px 0}.step-chord-card{background:var(--bg-tertiary);border:2px solid var(--border-color);color:var(--text-primary);padding:10px 22px;border-radius:var(--radius-sm);font-weight:600;font-size:1rem;cursor:pointer;transition:all .15s}.step-chord-card:hover{border-color:var(--accent-gold)}.step-chord-card.active{background:var(--accent-gold);color:#000;border-color:var(--accent-gold)}.step-play-controls{display:flex;align-items:center;justify-content:center;gap:10px;margin:12px auto;flex-wrap:wrap}.step-play-btn{background:var(--accent-green);color:#fff;border:none;padding:10px 28px;border-radius:var(--radius-sm);font-size:.95rem;font-weight:600;cursor:pointer;transition:all .2s}.step-play-btn:hover{opacity:.9;transform:scale(1.02)}.step-stop-btn{background:var(--accent-red);color:#fff;border:none;padding:10px 28px;border-radius:var(--radius-sm);font-size:.95rem;font-weight:600;cursor:pointer;transition:all .2s}.step-stop-btn:hover{opacity:.9;transform:scale(1.02)}.loop-toggle-inline{display:flex;align-items:center;gap:6px;font-size:.85rem;color:var(--text-secondary);cursor:pointer;-webkit-user-select:none;user-select:none}.loop-toggle-inline input[type=checkbox]{accent-color:var(--accent-blue);width:16px;height:16px;cursor:pointer}.step-listen-btn{display:inline-block;margin:8px auto;background:var(--bg-elevated);color:var(--text-primary);border:1px solid var(--border-color);padding:8px 20px;border-radius:var(--radius-sm);font-size:.9rem;font-weight:600;cursor:pointer;transition:all .2s}.step-listen-btn:hover{border-color:var(--accent-blue)}.step-listen-btn.active{background:var(--accent-blue);color:#fff;border-color:var(--accent-blue)}.chord-feedback{text-align:center;padding:6px 12px;margin:6px auto;border-radius:var(--radius-sm);font-size:.85rem;font-weight:600;min-height:28px;transition:all .3s ease;color:var(--text-secondary)}.chord-feedback.match{background:#22c55e26;border:1px solid var(--accent-green);color:var(--accent-green)}.chord-feedback.mismatch{background:#ef444426;border:1px solid var(--accent-red);color:var(--accent-red)}.lstep--note-detect{text-align:center}.note-detect-controls{display:flex;align-items:center;justify-content:center;gap:16px;margin:12px 0}.note-detect-progress{font-size:.9rem;font-weight:600;color:var(--text-secondary)}.note-detect-feedback{text-align:center;padding:8px 16px;margin:8px auto;border-radius:var(--radius-sm);font-size:.9rem;font-weight:600;min-height:32px;transition:all .3s ease;color:var(--text-secondary)}.note-detect-feedback.match{background:#22c55e26;border:1px solid var(--accent-green);color:var(--accent-green)}.step-fretboard-wrap{background:var(--bg-tertiary);border-radius:var(--radius);padding:10px;margin:14px 0;overflow-x:auto;display:flex;justify-content:center}.step-fretboard{max-width:100%;height:auto;min-width:650px}.lesson-nav{display:flex;justify-content:space-between;margin-top:20px;padding-top:16px;border-top:1px solid var(--border-color)}.lesson-nav-btn{background:var(--bg-tertiary);border:1px solid var(--border-color);color:var(--text-primary);padding:10px 28px;border-radius:var(--radius-sm);font-size:.95rem;font-weight:600;cursor:pointer;transition:all .15s}.lesson-nav-btn:hover:not(:disabled){border-color:var(--accent-gold);transform:translateY(-1px)}.lesson-nav-btn:disabled{opacity:.3;cursor:not-allowed}.lesson-nav-btn.next{background:var(--accent-gold);color:#000;border-color:var(--accent-gold)}.lesson-nav-btn.next:disabled{background:var(--bg-tertiary);color:var(--text-muted);border-color:var(--border-color)}.lesson-section{background:var(--bg-secondary);border:1px solid var(--border-color);border-radius:var(--radius-lg);padding:24px}.lesson-section h2{font-size:1.3rem;font-weight:700;color:var(--accent-gold);margin-bottom:16px;padding-bottom:10px;border-bottom:1px solid var(--border-color)}.metronome-controls{display:flex;align-items:flex-end;gap:20px;flex-wrap:wrap}.metronome-bpm{flex:1;min-width:200px}.metronome-bpm label,.metronome-time-sig label{display:block;font-size:.85rem;color:var(--text-secondary);margin-bottom:6px}.metronome-bpm input[type=range]{width:100%;height:6px;border-radius:3px;background:var(--bg-tertiary);outline:none;-webkit-appearance:none}.metronome-bpm input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;width:18px;height:18px;border-radius:50%;background:var(--accent-gold);cursor:pointer}.metronome-bpm input[type=range]::-moz-range-thumb{width:18px;height:18px;border-radius:50%;background:var(--accent-gold);border:none;cursor:pointer}.bpm-value{display:inline-block;margin-top:4px;font-weight:700;color:var(--accent-gold);font-size:1.3rem}.metronome-time-sig select{padding:8px 12px;background:var(--bg-tertiary);color:var(--text-primary);border:1px solid var(--border-color);border-radius:var(--radius-sm);font-size:.95rem;cursor:pointer}.metronome-buttons{display:flex;gap:8px}.metronome-btn{padding:10px 24px;border:none;border-radius:var(--radius-sm);font-size:.95rem;font-weight:600;cursor:pointer;transition:all .2s ease}.metronome-btn.start{background:var(--accent-green);color:#fff}.metronome-btn.start.running{background:var(--accent-red)}.metronome-btn.start:hover{opacity:.9;transform:scale(1.02)}.metronome-btn.tap{background:var(--bg-tertiary);color:var(--text-primary);border:1px solid var(--border-color)}.metronome-btn.tap:hover{background:var(--bg-elevated)}.beat-indicators{display:flex;justify-content:center;gap:16px;margin-top:20px}.beat-dot{width:24px;height:24px;border-radius:50%;background:var(--bg-tertiary);border:2px solid var(--border-color);transition:all .08s ease}.beat-dot.active{background:var(--accent-gold);border-color:var(--accent-gold);box-shadow:0 0 12px #eab30880}.beat-dot.accent{background:var(--accent-red);border-color:var(--accent-red);box-shadow:0 0 16px #ef444480;transform:scale(1.15)}.trainer-chord-selectors{display:flex;align-items:center;justify-content:center;gap:16px;margin-bottom:20px;flex-wrap:wrap}.trainer-chord-pick label{display:block;font-size:.85rem;color:var(--text-secondary);margin-bottom:4px}.chord-select{padding:8px 14px;background:var(--bg-tertiary);color:var(--text-primary);border:1px solid var(--border-color);border-radius:var(--radius-sm);font-size:.95rem;min-width:160px;cursor:pointer}.trainer-arrow{font-size:1.8rem;color:var(--text-muted);margin-top:18px}.trainer-display{text-align:center;margin-bottom:16px}.trainer-current-chord{font-size:2rem;font-weight:700;color:var(--accent-gold);margin-bottom:12px}.trainer-stats{display:flex;justify-content:center;gap:24px;margin-bottom:8px}.stat-box{background:var(--bg-tertiary);border-radius:var(--radius-sm);padding:12px 20px;text-align:center;min-width:80px}.stat-label{display:block;font-size:.75rem;color:var(--text-muted);text-transform:uppercase;letter-spacing:.5px;margin-bottom:4px}.stat-value{font-size:1.4rem;font-weight:700;color:var(--text-primary)}.trainer-best{font-size:.9rem;color:var(--accent-green);font-weight:600}.trainer-controls{text-align:center}.trainer-btn{padding:12px 36px;border:none;border-radius:var(--radius-sm);font-size:1rem;font-weight:600;cursor:pointer;transition:all .2s ease}.trainer-btn.start{background:var(--accent-green);color:#fff}.trainer-btn.start.running{background:var(--accent-red)}.trainer-btn.start:hover{opacity:.9;transform:scale(1.02)}.trainer-btn.tap{background:var(--bg-tertiary);color:var(--text-primary);border:1px solid var(--border-color);margin-left:8px}.trainer-hint{margin-top:10px;font-size:.85rem;color:var(--text-muted)}.trainer-hint kbd{background:var(--bg-tertiary);border:1px solid var(--border-color);border-radius:4px;padding:2px 6px;font-size:.8rem;font-family:monospace}.scale-controls{display:flex;gap:20px;align-items:flex-start;flex-wrap:wrap;margin-bottom:16px}.scale-root-selector label,.scale-type-selector label{display:block;font-size:.85rem;color:var(--text-secondary);margin-bottom:6px}.scale-root-buttons{display:flex;flex-wrap:wrap;gap:4px}.scale-root-btn{width:38px;height:34px;background:var(--bg-tertiary);color:var(--text-primary);border:1px solid var(--border-color);border-radius:var(--radius-sm);font-size:.8rem;font-weight:600;cursor:pointer;transition:all .15s ease}.scale-root-btn:hover{background:var(--bg-elevated);border-color:var(--accent-gold)}.scale-root-btn.active{background:var(--accent-gold);color:#000;border-color:var(--accent-gold)}.scale-type-selector select{padding:8px 14px;background:var(--bg-tertiary);color:var(--text-primary);border:1px solid var(--border-color);border-radius:var(--radius-sm);font-size:.95rem;cursor:pointer;min-width:200px}.scale-legend{display:flex;justify-content:center;gap:20px;margin:12px 0}.legend-item{display:flex;align-items:center;gap:6px;font-size:.85rem;color:var(--text-secondary)}.legend-dot{width:14px;height:14px;border-radius:50%;display:inline-block}.legend-dot.root{background:gold}.legend-dot.third{background:#4a90e2}.legend-dot.fifth{background:#2ecc71}.legend-dot.other{background:#a0a0a0b3}.scale-chords-row{text-align:center;margin-top:10px}.scale-chords-row label{display:block;font-size:.8rem;color:var(--text-secondary);margin-bottom:6px}.scale-chord-chips{display:flex;justify-content:center;gap:8px;flex-wrap:wrap}.scale-chord-chip{background:var(--bg-secondary);border:1px solid var(--border-color);border-radius:6px;padding:4px 10px;font-size:.85rem;color:var(--text-primary)}.chord-numeral{font-size:.7rem;color:var(--text-secondary);margin-right:4px}#toolScaleType optgroup{font-weight:600;font-style:normal}#toolScaleType option{font-weight:400;padding-left:8px}.inline-metronome,.inline-trainer{margin-top:14px}@media(max-width:768px){.lesson-container{gap:14px}.tools-grid{grid-template-columns:1fr}.metronome-controls{flex-direction:column;gap:12px}.metronome-bpm{min-width:100%}.trainer-chord-selectors{flex-direction:column;gap:8px}.trainer-arrow{margin-top:0;transform:rotate(90deg)}.trainer-stats{gap:10px}.stat-box{padding:8px 12px;min-width:60px}.scale-controls{flex-direction:column}.lstep{padding:20px}.lesson-hero{padding:0 8px}.lesson-title{font-size:1.4rem}}@media(max-width:400px){.tools-grid{grid-template-columns:1fr}.lesson-section,.lstep{padding:16px}.guitar-tab{font-size:.75rem;padding:12px}}.pm-container{max-width:900px;margin:0 auto}.pm-hero{text-align:center;margin-bottom:28px}.pm-hero h2{font-size:1.8rem;font-weight:700;background:var(--gradient-primary);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;margin-bottom:4px}.pm-hero-sub{color:var(--text-secondary);font-size:.95rem}.pm-progress-section{background:var(--bg-secondary);border:1px solid var(--border-color);border-radius:var(--radius);padding:20px 24px;margin-bottom:24px}.pm-stats-row{display:flex;justify-content:space-around;gap:12px;margin-bottom:16px}.pm-stat{text-align:center}.pm-stat-value{display:block;font-size:1.6rem;font-weight:700;color:var(--text-primary)}.pm-stat-label{font-size:.75rem;color:var(--text-muted);text-transform:uppercase;letter-spacing:.5px}.pm-week-activity{display:flex;justify-content:center;gap:14px}.pm-week-day{display:flex;flex-direction:column;align-items:center;gap:4px}.pm-week-day span{font-size:.7rem;color:var(--text-muted)}.pm-week-dot{width:12px;height:12px;border-radius:50%;background:var(--bg-tertiary);border:1px solid var(--border-color);transition:all .2s}.pm-week-day.active .pm-week-dot{background:var(--accent-green);border-color:var(--accent-green);box-shadow:0 0 6px #22c55e66}.pm-routines{display:grid;grid-template-columns:1fr 1fr 1fr;gap:20px}@media(max-width:900px){.pm-routines{grid-template-columns:1fr 1fr}}@media(max-width:550px){.pm-routines{grid-template-columns:1fr}}.pm-routine-column{display:flex;flex-direction:column;gap:8px}.pm-column-title{font-size:.8rem;font-weight:600;color:var(--text-muted);text-transform:uppercase;letter-spacing:.6px;margin-bottom:8px}padding-left: 4px; } .pm-routine-card{display:flex;align-items:center;justify-content:space-between;width:100%;background:#16161a;border:1px solid var(--border-color);border-radius:var(--radius-sm);padding:12px 14px;cursor:pointer;transition:all .15s ease;text-align:left;color:var(--text-primary);font-family:inherit;font-size:inherit;-webkit-appearance:none;appearance:none}.pm-routine-card:hover{border-color:var(--accent-blue);background:var(--bg-tertiary);transform:translate(2px)}.pm-routine-info{display:flex;flex-direction:column;gap:2px}.pm-routine-name{font-weight:600;font-size:.95rem}.pm-routine-desc{font-size:.8rem;color:var(--text-secondary)}.pm-routine-meta{display:flex;align-items:center;gap:10px;flex-shrink:0}.pm-routine-duration{font-size:.8rem;color:var(--text-muted);font-variant-numeric:tabular-nums}.pm-routine-best{background:var(--accent-green);color:#000;font-size:.7rem;font-weight:700;padding:2px 8px;border-radius:999px}.pm-routine-new{background:var(--accent-blue);color:#fff;font-size:.65rem;font-weight:700;padding:2px 8px;border-radius:999px;letter-spacing:.5px}.study-container{max-width:780px;margin:0 auto;padding:20px 16px}.study-title{margin:0 0 4px}.study-subtitle{color:var(--text-secondary);font-size:.9rem;margin:0 0 20px}.study-topics{display:flex;flex-direction:column;gap:8px}.study-card{background:var(--bg-secondary);border:1px solid var(--border-color);border-radius:var(--radius-sm);overflow:hidden}.study-card summary{padding:12px 16px;font-weight:600;font-size:.95rem;cursor:pointer;list-style:none;display:flex;align-items:center;gap:8px}.study-card summary:before{content:"▸";font-size:.8rem;color:var(--text-muted);transition:transform .15s}.study-card[open] summary:before{transform:rotate(90deg)}.study-card summary::-webkit-details-marker{display:none}.study-body{padding:0 16px 14px;font-size:.88rem;line-height:1.6;color:var(--text-secondary)}.study-body p{margin:0 0 8px}.study-body strong{color:var(--text-primary)}.study-note-row{font-family:monospace;font-size:.9rem;color:var(--text-primary);background:var(--bg-primary);padding:8px 14px;border-radius:6px;margin:6px 0 10px;letter-spacing:1px}.study-table{width:100%;border-collapse:collapse;margin:8px 0 10px;font-size:.82rem}.study-table th{text-align:left;padding:6px 10px;font-weight:600;color:var(--text-muted);border-bottom:1px solid var(--border-color);font-size:.75rem;text-transform:uppercase;letter-spacing:.4px}.study-table td{padding:5px 10px;border-bottom:1px solid var(--border-color);color:var(--text-primary)}.study-table tr:last-child td{border-bottom:none}.pm-session-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:20px}.pm-back-btn{background:none;border:1px solid var(--border-color);color:var(--text-secondary);padding:6px 14px;border-radius:var(--radius-sm);cursor:pointer;font-size:.85rem;font-family:inherit;transition:all .15s}.pm-back-btn:hover{border-color:var(--text-secondary);color:var(--text-primary)}.pm-session-name{font-weight:600;font-size:1rem;color:var(--text-primary)}.pm-timer{font-size:1.4rem;font-weight:700;font-variant-numeric:tabular-nums;color:var(--text-primary);background:var(--bg-tertiary);padding:4px 16px;border-radius:var(--radius-sm);min-width:80px;text-align:center}.pm-timer-warning{color:var(--accent-red);animation:pm-pulse .5s ease infinite alternate}@keyframes pm-pulse{0%{opacity:1}to{opacity:.5}}.pm-chord-display{text-align:center;padding:24px;margin-bottom:16px;background:var(--bg-secondary);border:2px solid var(--border-color);border-radius:var(--radius);transition:all .3s ease}.pm-chord-display.pm-match-success{border-color:var(--accent-green);background:#22c55e14;box-shadow:0 0 24px #22c55e26}.pm-current-chord{font-size:2.8rem;font-weight:800;color:var(--accent-gold);transition:transform .2s ease}.pm-current-chord.pm-chord-pop{animation:pm-pop .3s ease}@keyframes pm-pop{0%{transform:scale(.8);opacity:.5}60%{transform:scale(1.08)}to{transform:scale(1);opacity:1}}.pm-instruction{font-size:.85rem;color:var(--text-muted);margin-top:4px}.pm-fretboard-wrap{display:flex;justify-content:center;background:var(--bg-tertiary);border-radius:var(--radius);padding:12px;margin-bottom:12px;overflow-x:auto}.pm-fretboard-wrap canvas{max-width:100%;height:auto;border-radius:8px;min-width:700px}.pm-confidence-bar{height:6px;background:var(--bg-tertiary);border-radius:3px;margin-bottom:16px;overflow:hidden}.pm-confidence-fill{height:100%;width:0%;border-radius:3px;transition:width .25s ease,background .3s}.pm-confidence-low{background:var(--accent-red)}.pm-confidence-mid{background:var(--accent-gold)}.pm-confidence-good{background:var(--accent-green)}.pm-session-stats{display:flex;justify-content:space-around;gap:8px;margin-bottom:16px;padding:12px;background:var(--bg-secondary);border-radius:var(--radius-sm);border:1px solid var(--border-color)}.pm-mini-stat{text-align:center}.pm-mini-stat span{display:block;font-size:1.3rem;font-weight:700;color:var(--text-primary);font-variant-numeric:tabular-nums}.pm-mini-stat label{font-size:.7rem;color:var(--text-muted);text-transform:uppercase;letter-spacing:.3px}.pm-session-controls{display:flex;justify-content:center;gap:10px;flex-wrap:wrap}.pm-btn{font-family:inherit;font-size:.9rem;font-weight:600;padding:10px 22px;border-radius:var(--radius-sm);cursor:pointer;transition:all .15s ease;border:none}.pm-btn-primary{background:var(--accent-green);color:#000}.pm-btn-primary:hover{background:#16a34a;transform:translateY(-1px);box-shadow:0 4px 12px #22c55e4d}.pm-btn-secondary{background:var(--bg-tertiary);color:var(--text-primary);border:1px solid var(--border-color)}.pm-btn-secondary:hover{border-color:var(--accent-blue);background:var(--bg-elevated)}.pm-btn-ghost{background:transparent;color:var(--text-secondary);border:1px solid var(--border-color)}.pm-btn-ghost:hover{color:var(--text-primary);border-color:var(--text-muted)}.pm-results{text-align:center;padding:40px 20px}.pm-results h3{font-size:1.1rem;color:var(--text-secondary);font-weight:500;margin-bottom:28px}.pm-results-grade{font-size:2rem;font-weight:800;margin-bottom:8px}.pm-grade-a{color:var(--accent-green)}.pm-grade-b{color:var(--accent-gold)}.pm-grade-c{color:var(--accent-blue)}.pm-grade-d{color:var(--text-secondary)}.pm-results-stats{display:flex;justify-content:center;gap:28px;margin-bottom:32px;flex-wrap:wrap}.pm-result-stat{text-align:center}.pm-result-value{display:block;font-size:1.8rem;font-weight:700;color:var(--text-primary);font-variant-numeric:tabular-nums}.pm-result-label{font-size:.75rem;color:var(--text-muted);text-transform:uppercase;letter-spacing:.5px}.pm-results-actions{display:flex;justify-content:center;gap:12px}@media(max-width:600px){.pm-stats-row{flex-wrap:wrap;gap:8px}.pm-stat{min-width:60px}.pm-current-chord{font-size:2rem}.pm-session-header{flex-wrap:wrap;gap:8px}.pm-results-stats{gap:16px}.pm-result-value{font-size:1.4rem}}.pm-scale-top-row{display:flex;align-items:center;justify-content:center;gap:16px;padding:8px 16px;margin-bottom:4px}.pm-play-btn{background:var(--bg-secondary);border:1.5px solid var(--border-color);border-radius:10px;width:52px;height:44px;font-size:1.4rem;line-height:1;cursor:pointer;color:var(--text-primary);display:flex;align-items:center;justify-content:center;flex-shrink:0;transition:background .15s,border-color .15s}.pm-play-btn:hover{background:var(--bg-tertiary, #2a2a2e);border-color:var(--text-secondary)}.pm-bpm-control{display:flex;align-items:center;gap:8px;background:var(--bg-secondary);border:1.5px solid var(--border-color);border-radius:10px;padding:8px 14px;height:44px;box-sizing:border-box}.pm-bpm-control label{font-size:.8rem;color:var(--text-secondary);white-space:nowrap}.pm-bpm-control input[type=range]{width:140px}.pm-bpm-control span{font-family:monospace;font-size:.85rem;min-width:32px;text-align:right;color:var(--text-primary)}.pm-metro-controls{background:var(--bg-secondary);border-radius:10px;padding:12px 16px;margin:12px 0}.pm-metro-toggles{display:flex;gap:20px;margin-bottom:8px}.pm-metro-toggle-label{display:flex;align-items:center;gap:8px;font-weight:600;font-size:.9rem;color:var(--text-primary);cursor:pointer}.pm-metro-sliders{display:flex;flex-direction:column;gap:6px}.pm-slider-row{display:flex;align-items:center;gap:8px}.pm-slider-row label{font-size:.8rem;color:var(--text-secondary);min-width:70px}.pm-slider-row input[type=range]{flex:1}.pm-slider-row span{font-family:monospace;font-size:.85rem;min-width:40px;text-align:right;color:var(--text-primary)}.pm-slider-unit{font-size:.75rem;color:var(--text-muted);min-width:20px!important;text-align:left!important}.pm-chromagram{padding:12px 16px;background:var(--bg-secondary);border-radius:var(--radius);border:1px solid var(--border-color);margin:0 auto 12px;max-width:560px}.pm-chroma-bins{display:flex;gap:4px;align-items:flex-end;height:64px}.pm-chroma-bin{flex:1;display:flex;flex-direction:column;align-items:center;height:100%;position:relative;justify-content:flex-end}.pm-chroma-bar{width:100%;min-height:2px;background:var(--border-color);border-radius:2px 2px 0 0;transition:height .12s ease,background .12s ease}.pm-chroma-hit .pm-chroma-bar{background:var(--accent-green)}.pm-chroma-miss .pm-chroma-bar{background:var(--accent-red);opacity:.4}.pm-chroma-extra .pm-chroma-bar{background:var(--accent-gold);opacity:.6}.pm-chroma-label{font-size:.6rem;color:var(--text-secondary, #888);margin-top:4px;font-weight:600;letter-spacing:.02em}.pm-chroma-hit .pm-chroma-label{color:var(--accent-green)}.pm-chroma-miss .pm-chroma-label{color:var(--accent-red)}.pm-string-voicing{display:flex;justify-content:center;gap:12px;margin-top:10px;padding-top:8px;border-top:1px solid var(--border-color)}.pm-string-dot{width:28px;height:28px;border-radius:50%;border:2px solid var(--border-color);display:flex;align-items:center;justify-content:center;transition:all .15s ease}.pm-string-dot span{font-size:.65rem;font-weight:700;color:var(--text-secondary, #888)}.pm-string-dot.pm-string-active{border-color:var(--accent-green);background:#4caf5026}.pm-string-dot.pm-string-active span{color:var(--accent-green)}.pm-string-dot.pm-string-muted{border-color:var(--border-color);background:transparent;opacity:.35}.pm-string-dot.pm-string-muted span{text-decoration:line-through}.note-detect-metronome{display:flex;align-items:center;gap:12px;margin:10px 0;padding:10px 14px;background:var(--bg-tertiary);border-radius:var(--radius-sm);border:1px solid var(--border-color);flex-wrap:wrap}.nd-metro-toggle{display:flex;align-items:center;gap:6px;cursor:pointer;font-size:.85rem;color:var(--text-secondary);font-weight:600;white-space:nowrap}.nd-metro-toggle input[type=checkbox]{width:16px;height:16px;accent-color:var(--accent-blue);cursor:pointer}.nd-metro-toggle:has(input:checked){color:var(--accent-blue)}.nd-metro-settings{display:flex;align-items:center;gap:10px;flex-wrap:wrap}.nd-bpm-slider{width:100px;height:4px;border-radius:2px;background:var(--border-color);outline:none;-webkit-appearance:none}.nd-bpm-slider::-webkit-slider-thumb{-webkit-appearance:none;width:14px;height:14px;border-radius:50%;background:var(--accent-blue);cursor:pointer;box-shadow:0 1px 4px #d4884a4d}.nd-bpm-label{font-size:.8rem;color:var(--accent-blue);font-weight:600;font-family:Monaco,Menlo,monospace;min-width:55px}.nd-beat-dots{display:flex;gap:5px;align-items:center}.nd-beat-dot{width:10px;height:10px;border-radius:50%;background:var(--bg-elevated);border:1px solid var(--border-color);transition:all .08s ease}.nd-beat-dot.active{background:var(--accent-blue);border-color:var(--accent-blue);box-shadow:0 0 8px #d4884a80;transform:scale(1.3)}.nd-calibration{display:flex;align-items:center;gap:6px;font-size:.8rem;color:var(--text-secondary)}.nd-calibration label{white-space:nowrap}.nd-calibration input[type=range]{width:80px}.nd-recalibrate-btn{padding:2px 8px;font-size:.75rem;border-radius:4px;border:1px solid var(--text-secondary);background:transparent;color:var(--text-secondary);cursor:pointer;white-space:nowrap}.nd-recalibrate-btn:hover{background:var(--text-secondary);color:var(--bg-primary)}.nd-cal-status{font-size:.7rem;color:var(--text-secondary);opacity:.8;white-space:nowrap}.note-detect-timing{display:flex;flex-wrap:wrap;gap:6px;margin:8px 0;min-height:28px;align-items:center}.timing-badge{display:inline-block;padding:3px 10px;border-radius:12px;font-size:.72rem;font-weight:700;letter-spacing:.02em;animation:timing-pop .25s ease-out}.timing-perfect{background:#22c55e33;color:#22c55e;border:1px solid rgba(34,197,94,.4)}.timing-good{background:#eab30833;color:#eab308;border:1px solid rgba(234,179,8,.4)}.timing-early{background:#60a5fa33;color:#60a5fa;border:1px solid rgba(96,165,250,.4)}.timing-late{background:#ef444433;color:#ef4444;border:1px solid rgba(239,68,68,.4)}@keyframes timing-pop{0%{transform:scale(.6);opacity:0}60%{transform:scale(1.1)}to{transform:scale(1);opacity:1}}.timing-summary{display:flex;flex-wrap:wrap;gap:14px;justify-content:center;padding:10px 14px;margin-top:8px;background:var(--bg-tertiary);border-radius:var(--radius-sm);border:1px solid var(--border-color);animation:timing-pop .3s ease-out}.timing-summary-stat{font-size:.8rem;color:var(--text-secondary)}.timing-summary-stat strong{color:var(--text-primary)}.timing-summary-stat.timing-perfect strong{color:#22c55e}.timing-summary-stat.timing-good strong{color:#eab308}.timing-graph-wrap{margin:8px auto 12px;max-width:1100px;border-radius:var(--radius-sm);overflow:hidden;border:1px solid var(--border-subtle);background:#0d0d0f}.timing-graph-canvas{display:block;width:100%;height:120px}.timing-test-settings{display:grid;grid-template-columns:1fr 1fr;gap:8px 16px}.timing-test-setting{display:flex;flex-direction:column;gap:2px}.timing-test-setting label{font-size:12px;color:#aaa}.timing-test-stats{display:flex;gap:16px;font-family:monospace;font-size:13px;color:#ccc}.tone-note-display{background:var(--bg-secondary);border:1px solid var(--border-color);border-radius:var(--radius-lg);padding:32px 24px;margin-bottom:24px}.tone-note-name{font-size:5rem;font-weight:700;line-height:1;color:var(--text-primary);font-family:Plus Jakarta Sans,sans-serif}.tone-note-octave{font-size:1.5rem;font-weight:500;color:var(--text-muted);margin-top:4px}.tone-note-cents{font-family:monospace;font-size:1.1rem;color:var(--text-secondary);margin-top:8px}.tone-note-cents.in-tune{color:var(--accent-green)}.tone-note-freq{font-family:monospace;font-size:.85rem;color:var(--text-muted);margin-top:4px}.tone-note-display.tone-flash{animation:toneFlash .3s ease}@keyframes toneFlash{0%{border-color:var(--accent-blue);box-shadow:0 0 20px #d4884a40}to{border-color:var(--border-color);box-shadow:none}}.tone-history{display:flex;gap:8px;flex-wrap:wrap;justify-content:center}.tone-history-chip{background:var(--bg-tertiary);color:var(--text-secondary);border:1px solid var(--border-color);border-radius:6px;padding:4px 12px;font-family:monospace;font-size:14px;font-weight:600}.auth-btn{padding:7px 16px;border-radius:999px;border:1px solid var(--border-color);background:#ffffff0a;color:var(--text-primary);font-family:inherit;font-size:13px;font-weight:600;cursor:pointer;transition:background .15s,border-color .15s;justify-self:end;white-space:nowrap}.auth-btn:hover{background:#ffffff14}.auth-btn--signed-in{width:34px;height:34px;padding:0;border-radius:50%;background:var(--gradient-primary);border-color:transparent;font-size:14px;font-weight:700;display:flex;align-items:center;justify-content:center}.auth-overlay{display:none;position:fixed;inset:0;background:#0000008c;z-index:900;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px)}.auth-overlay.open{display:block}.auth-modal{display:none;position:fixed;top:50%;left:50%;transform:translate(-50%,-50%);z-index:901;background:var(--bg-elevated);border:1px solid var(--border-color);border-radius:var(--radius-lg);box-shadow:var(--shadow-lg);padding:32px;width:360px;max-width:calc(100vw - 32px)}.auth-modal.open{display:block}.auth-modal-close{position:absolute;top:14px;right:16px;background:none;border:none;color:var(--text-muted);font-size:16px;cursor:pointer;padding:4px 8px;border-radius:6px;transition:color .15s}.auth-modal-close:hover{color:var(--text-primary)}.auth-tabs{display:flex;gap:4px;margin-bottom:24px;border-bottom:1px solid var(--border-color);padding-bottom:0}.auth-tab{background:none;border:none;border-bottom:2px solid transparent;color:var(--text-muted);font-family:inherit;font-size:14px;font-weight:600;cursor:pointer;padding:8px 12px;margin-bottom:-1px;transition:color .15s,border-color .15s}.auth-tab.active{color:var(--text-primary);border-bottom-color:var(--accent-blue)}.auth-form{display:none;flex-direction:column;gap:16px}.auth-form.active{display:flex}.auth-field{display:flex;flex-direction:column;gap:6px}.auth-field label{font-size:12px;font-weight:600;color:var(--text-secondary);text-transform:uppercase;letter-spacing:.05em}.auth-field input{background:var(--bg-tertiary);border:1px solid var(--border-color);border-radius:var(--radius-sm);color:var(--text-primary);font-family:inherit;font-size:14px;padding:10px 12px;outline:none;transition:border-color .15s}.auth-field input:focus{border-color:var(--accent-blue)}.auth-error{font-size:13px;color:var(--accent-red);min-height:1em}.auth-success{font-size:13px;color:var(--accent-green);min-height:1em}.auth-submit{padding:11px;border-radius:var(--radius-sm);border:none;background:var(--gradient-primary);color:#fff;font-family:inherit;font-size:14px;font-weight:700;cursor:pointer;transition:opacity .15s;margin-top:4px}.auth-submit:hover{opacity:.88}.auth-submit:disabled{opacity:.5;cursor:default}.auth-submit--outline{background:none;border:1px solid var(--border-color);color:var(--text-secondary)}.auth-submit--outline:hover{opacity:1;border-color:var(--accent-red);color:var(--accent-red)}.auth-back-link{background:none;border:none;color:var(--text-muted);font-size:13px;cursor:pointer;padding:8px 0 0}.auth-back-link:hover{color:var(--text-secondary)}#gate-code{text-align:center;font-size:24px;letter-spacing:8px;font-weight:600}.auth-profile-avatar{width:56px;height:56px;border-radius:50%;background:var(--gradient-primary);display:flex;align-items:center;justify-content:center;font-size:22px;font-weight:700;margin:8px auto 12px}.auth-profile-email{text-align:center;font-size:14px;color:var(--text-secondary);margin-bottom:8px;word-break:break-all}.auth-gate{position:fixed;inset:0;display:flex;align-items:center;justify-content:center;background:var(--bg-primary);z-index:800;padding:24px}.auth-gate:before{content:"";position:fixed;inset:0;background:radial-gradient(ellipse 60% 50% at 20% 60%,rgba(212,136,74,.08) 0%,transparent 70%),radial-gradient(ellipse 40% 40% at 80% 30%,rgba(192,112,56,.06) 0%,transparent 70%);pointer-events:none}.auth-gate-card{background:var(--bg-elevated);border:1px solid var(--border-color);border-radius:var(--radius-xl);box-shadow:var(--shadow-lg);padding:40px;width:100%;max-width:400px;display:flex;flex-direction:column;gap:20px;position:relative;z-index:1}.auth-gate-brand{display:flex;align-items:center;gap:10px;justify-content:center}.auth-gate-logo{font-size:2rem}.auth-gate-name{font-size:2rem;font-weight:700;letter-spacing:-.03em;color:var(--text-primary)}.auth-gate-tagline{text-align:center;font-size:14px;color:var(--text-muted);margin-top:-12px}.auth-gate-form{display:flex;flex-direction:column;gap:16px}#auth-modal.open{display:flex;flex-direction:column;align-items:center;gap:12px;padding:32px}.auth-modal-link{background:none;border:1px solid var(--border-color);border-radius:var(--radius-sm);color:var(--text-primary);font-family:inherit;font-size:14px;font-weight:600;padding:10px;cursor:pointer;width:100%;transition:background .15s,border-color .15s}.auth-modal-link:hover{background:#ffffff0f;border-color:var(--accent-blue)}.user-logs-panel{display:none;position:fixed;inset:0;background:var(--bg-primary);z-index:850;overflow-y:auto;padding:24px}.user-logs-panel.open{display:block}.user-logs-header{display:flex;justify-content:space-between;align-items:center;max-width:700px;margin:0 auto 24px}.user-logs-header h2{font-size:1.4rem;font-weight:700}.user-logs-body{max-width:700px;margin:0 auto}.user-logs-loading,.user-logs-empty{text-align:center;color:var(--text-muted);font-size:14px;padding:40px 0}.user-logs-date-group{margin-bottom:24px}.user-logs-date{font-size:12px;font-weight:600;color:var(--text-muted);text-transform:uppercase;letter-spacing:.05em;margin-bottom:8px;padding-bottom:6px;border-bottom:1px solid var(--border-color)}.user-logs-entry{display:flex;justify-content:space-between;align-items:center;padding:10px 12px;border-radius:var(--radius-sm);transition:background .12s}.user-logs-entry:hover{background:#ffffff08}.user-logs-entry-left{display:flex;align-items:center;gap:10px}.user-logs-status{width:8px;height:8px;border-radius:50%;flex-shrink:0}.user-logs-status--completed{background:var(--accent-green)}.user-logs-status--unfinished{background:var(--text-muted);opacity:.5}.user-logs-tab{font-size:14px;font-weight:600;display:block}.user-logs-meta{font-size:12px;color:var(--text-muted);display:block;margin-top:2px}.user-logs-score{display:flex;gap:6px;flex-wrap:wrap}.user-logs-score-chip{background:var(--bg-tertiary);border:1px solid var(--border-color);border-radius:6px;padding:3px 10px;font-size:12px;font-weight:600;color:var(--text-secondary);font-family:monospace}.go-recommendations{text-align:center;padding:40px 20px;max-width:600px;margin:0 auto}.go-recommendations h2{font-size:1.6rem;font-weight:700;margin-bottom:4px}.go-rec-subtitle{color:var(--text-muted);font-size:14px;margin-bottom:32px}.go-rec-cards{display:grid;grid-template-columns:1fr 1fr;gap:12px}.go-rec-card{display:flex;flex-direction:column;align-items:center;gap:8px;padding:24px 16px;background:var(--bg-elevated);border:1px solid var(--border-color);border-radius:var(--radius-lg);cursor:pointer;transition:border-color .15s,background .15s;font-family:inherit;color:var(--text-primary)}.go-rec-card:hover{border-color:var(--accent-blue);background:#ffffff0a}.go-rec-icon{font-size:1.6rem}.go-rec-title{font-size:15px;font-weight:700}.go-rec-desc{font-size:12px;color:var(--text-muted)}