@import "https://fonts.googleapis.com/css2?family=JetBrains+Mono:wght@400;500;600;700;800&family=Plus+Jakarta+Sans:wght@400;500;600;700;800&display=swap";:root,:root[data-theme=dark]{--bg-main:#0a0c10;--bg-surface:#12151d;--bg-surface-elevated:#1a1e29;--bg-card:#151923;--bg-card-hover:#1e2332;--bg-input:#0e1118;--border-subtle:#242b3d;--border-focus:#3b82f6;--border-highlight:#f59e0b;--text-primary:#f8fafc;--text-secondary:#94a3b8;--text-muted:#64748b;--accent-amber:#f59e0b;--accent-amber-glow:#f59e0b40;--accent-cyan:#06b6d4;--accent-cyan-glow:#06b6d433;--accent-emerald:#10b981;--accent-rose:#f43f5e;--accent-purple:#8b5cf6;--radius-sm:6px;--radius-md:10px;--radius-lg:14px;--radius-full:9999px;--font-sans:"Plus Jakarta Sans", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;--font-mono:"JetBrains Mono", monospace;--shadow-card:0 4px 20px -2px #00000080;--shadow-glow:0 0 20px -3px #f59e0b59}:root[data-theme=light]{--bg-main:#f8fafc;--bg-surface:#fff;--bg-surface-elevated:#f1f5f9;--bg-card:#fff;--bg-card-hover:#f8fafc;--bg-input:#fff;--border-subtle:#e2e8f0;--border-focus:#2563eb;--border-highlight:#d97706;--text-primary:#0f172a;--text-secondary:#475569;--text-muted:#64748b;--accent-amber:#d97706;--accent-amber-glow:#d9770626;--accent-cyan:#0284c7;--accent-cyan-glow:#0284c726;--accent-emerald:#059669;--accent-rose:#e11d48;--accent-purple:#7c3aed;--radius-sm:6px;--radius-md:10px;--radius-lg:14px;--radius-full:9999px;--font-sans:"Plus Jakarta Sans", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;--font-mono:"JetBrains Mono", monospace;--shadow-card:0 4px 20px -2px #00000012;--shadow-glow:0 0 20px -3px #d9770633}*{box-sizing:border-box;margin:0;padding:0}body{font-family:var(--font-sans);background-color:var(--bg-main);color:var(--text-primary);-webkit-font-smoothing:antialiased;line-height:1.5;overflow-x:hidden}.app-layout{background:radial-gradient(circle at 50% 0,#151a28 0%,#0a0c10 70%);flex-direction:column;min-height:100vh;display:flex}[data-theme=light] .app-layout{background:radial-gradient(circle at 50% 0,#f1f5f9 0%,#fff 80%)}.app-header{-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);border-bottom:1px solid var(--border-subtle);z-index:50;background-color:#12151dd9;justify-content:space-between;align-items:center;padding:.5rem 1.25rem;display:flex;position:sticky;top:0}[data-theme=light] .app-header{background-color:#ffffffd9}.header-left{align-items:center;gap:.65rem;display:flex}.logo-badge{border-radius:var(--radius-sm);border:1.5px solid var(--accent-amber);background:#111827;flex-shrink:0;justify-content:center;align-items:center;width:32px;height:32px;padding:3px;transition:all .2s;display:flex;box-shadow:0 2px 10px #f59e0b40}[data-theme=light] .logo-badge{background:#fff;border-color:#d97706;box-shadow:0 2px 10px #d9770633}.metronome-logo-svg .metro-logo-body{fill:#1e293b}.metronome-logo-svg .metro-logo-arm,.metronome-logo-svg .metro-logo-bob{color:#f8fafc}[data-theme=light] .metronome-logo-svg .metro-logo-body{fill:#f1f5f9}[data-theme=light] .metronome-logo-svg .metro-logo-arm,[data-theme=light] .metronome-logo-svg .metro-logo-bob{color:#334155}.logo-title{letter-spacing:-.02em;color:var(--text-primary);font-size:1.05rem;font-weight:800;line-height:1.2}.logo-accent{color:var(--accent-amber)}.logo-metronome{color:#fff;font-weight:800}[data-theme=light] .logo-metronome{color:#0f172a}.logo-subtitle{color:var(--text-secondary);font-size:.68rem;font-weight:500;line-height:1.2}.btn-theme-toggle{background:var(--bg-surface-elevated);border:1px solid var(--border-subtle);border-radius:var(--radius-full);color:var(--text-primary);cursor:pointer;-webkit-user-select:none;user-select:none;white-space:nowrap;align-items:center;gap:.35rem;margin-left:.4rem;padding:.25rem .55rem;font-size:.72rem;font-weight:700;transition:all .2s cubic-bezier(.16,1,.3,1);display:inline-flex;box-shadow:0 1px 3px #0000001a}.btn-theme-toggle:hover{border-color:var(--accent-amber);background:var(--bg-card-hover);transform:translateY(-1px);box-shadow:0 2px 8px #00000026}.btn-theme-toggle .theme-icon-moon{color:#fbbf24}.btn-theme-toggle .theme-icon-sun{color:#f59e0b}.btn-riffloop-studio{border-radius:var(--radius-full);color:var(--accent-amber);cursor:pointer;-webkit-user-select:none;user-select:none;white-space:nowrap;background:#f59e0b1f;border:1px solid #f59e0b59;align-items:center;gap:.32rem;margin-left:.35rem;padding:.25rem .6rem;font-size:.72rem;font-weight:700;text-decoration:none;transition:all .2s cubic-bezier(.16,1,.3,1);display:inline-flex;box-shadow:0 1px 3px #0000001a}.btn-riffloop-studio:hover{background:var(--accent-amber);color:#0b0f17;border-color:var(--accent-amber);box-shadow:0 2px 10px var(--accent-amber-glow);transform:translateY(-1px)}.btn-riffloop-studio .riffloop-ext-icon{opacity:.85;transition:transform .15s}.btn-riffloop-studio:hover .riffloop-ext-icon{opacity:1;transform:translate(1px,-1px)}.riffloop-label-short{display:none}[data-theme=light] .btn-riffloop-studio{color:#d97706;background:#d9770617;border-color:#d9770647}[data-theme=light] .btn-riffloop-studio:hover{color:#fff;background:#d97706;border-color:#d97706;box-shadow:0 2px 10px #d9770640}.header-center{align-items:center;gap:.45rem;display:flex}.header-stat-pill{background:var(--bg-surface-elevated);border:1px solid var(--border-subtle);border-radius:var(--radius-full);align-items:center;gap:.35rem;padding:.22rem .55rem;font-size:.72rem;display:flex}.header-stat-pill.pill-active{border-color:var(--accent-amber);color:var(--accent-amber);background:#f59e0b26}.stat-label{color:var(--text-muted);letter-spacing:.05em;font-size:.62rem;font-weight:800}.stat-value{font-family:var(--font-mono);color:var(--text-primary);font-weight:700}.stat-unit{color:var(--accent-amber);font-size:.62rem}.header-right{align-items:center;gap:.45rem;display:flex}.btn-header-action{background:var(--bg-surface-elevated);border:1px solid var(--border-subtle);border-radius:var(--radius-md);color:var(--text-primary);cursor:pointer;align-items:center;gap:.35rem;padding:.35rem .65rem;font-size:.75rem;font-weight:600;transition:all .15s;display:inline-flex}.btn-header-action:hover{background:var(--bg-card-hover);border-color:var(--accent-amber);color:var(--text-primary);transform:translateY(-1px)}.btn-header-icon{border-radius:var(--radius-md);background:var(--bg-surface-elevated);border:1px solid var(--border-subtle);width:32px;height:32px;color:var(--text-secondary);cursor:pointer;justify-content:center;align-items:center;transition:all .15s;display:flex}.btn-header-icon:hover{color:var(--text-primary);border-color:var(--accent-amber);background:var(--bg-card-hover)}.app-main-content{flex-direction:column;flex:1;gap:.65rem;width:100%;max-width:820px;margin:0 auto;padding:.75rem 1rem 1.75rem;display:flex}.control-card{background:var(--bg-card);border:1px solid var(--border-subtle);border-radius:var(--radius-md);box-shadow:var(--shadow-card);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);padding:.75rem .95rem}.card-header{justify-content:space-between;align-items:center;margin-bottom:.55rem;display:flex}.card-title-group{align-items:center;gap:.6rem;display:flex}.card-icon{color:var(--accent-amber)}.card-title{color:var(--text-primary);font-size:.88rem;font-weight:700}.card-subtitle{color:var(--text-secondary);font-size:.68rem}.btn-toggle-switch{background:var(--bg-surface-elevated);border:1px solid var(--border-subtle);border-radius:var(--radius-full);cursor:pointer;align-items:center;gap:.4rem;padding:.2rem .5rem;transition:all .15s;display:flex}.btn-toggle-switch.switch-on{border-color:var(--accent-amber);background:#f59e0b33}.switch-knob{background:var(--text-muted);border-radius:50%;width:10px;height:10px;transition:all .15s}.switch-on .switch-knob{background:var(--accent-amber);box-shadow:0 0 6px var(--accent-amber)}.switch-text{color:var(--text-primary);letter-spacing:.04em;font-size:.66rem;font-weight:800}.bpm-hero-card{text-align:center;padding:.75rem 1rem .7rem;position:relative;overflow:hidden}.bpm-hero-card:before{content:"";pointer-events:none;background:radial-gradient(at top,#f59e0b1f,#0000 70%);width:400px;height:120px;position:absolute;top:0;left:50%;transform:translate(-50%)}.bpm-readout-container{flex-direction:column;justify-content:center;align-items:center;margin-bottom:.25rem;display:flex}.bpm-digits-wrapper{cursor:pointer;-webkit-user-select:none;user-select:none;justify-content:center;align-items:baseline;gap:.35rem;display:inline-flex}.bpm-digits{font-family:var(--font-mono);color:var(--accent-amber);text-shadow:0 0 32px var(--accent-amber-glow);letter-spacing:-.03em;font-size:clamp(2.8rem,7vw + .5rem,9.375rem);font-weight:800;line-height:.95;transition:font-size 50ms ease-out}.bpm-label{color:var(--text-secondary);letter-spacing:.05em;margin-left:.35rem;font-size:clamp(1.05rem,1.5vw + .4rem,2.1rem);font-weight:800}.bpm-inline-input{font-family:var(--font-mono);color:var(--accent-amber);background:var(--bg-input);border:2px solid var(--accent-amber);border-radius:var(--radius-md);text-align:center;width:clamp(180px,20vw + 60px,360px);box-shadow:0 0 20px var(--accent-amber-glow);outline:none;font-size:clamp(2.8rem,7vw + .5rem,9.375rem);font-weight:800}.tempo-term-badge{border-radius:var(--radius-full);background:var(--bg-surface-elevated);border:1px solid var(--border-subtle);cursor:pointer;align-items:center;gap:.4rem;margin-bottom:.55rem;padding:.2rem .75rem;transition:all .15s;display:inline-flex}.tempo-term-badge:hover{border-color:var(--accent-amber);background:var(--bg-card-hover);transform:translateY(-1px)}.tempo-italian{color:var(--text-primary);text-transform:uppercase;letter-spacing:.05em;font-size:.85rem;font-weight:800}.tempo-badge-divider{color:var(--text-muted)}.tempo-english{color:var(--text-secondary);font-size:.72rem;font-weight:500}.bpm-controls-bar{justify-content:center;align-items:center;gap:.55rem;width:100%;max-width:620px;margin:0 auto;display:flex}.btn-stepper{background:var(--bg-surface-elevated);border:1px solid var(--border-subtle);width:36px;height:36px;color:var(--text-primary);cursor:pointer;-webkit-user-select:none;user-select:none;border-radius:50%;flex-shrink:0;justify-content:center;align-items:center;font-size:1.1rem;font-weight:700;transition:all .12s;display:flex;box-shadow:0 2px 5px #0003}.btn-stepper:hover{background:var(--bg-card-hover);border-color:var(--accent-amber);color:var(--accent-amber);transform:scale(1.05)}.btn-stepper:active{background:#f59e0b26;transform:scale(.95)}.btn-stepper-small{width:30px;height:30px;font-size:.72rem;font-family:var(--font-mono);border-radius:var(--radius-sm)}.bpm-slider-container{flex-direction:column;flex:1;gap:.3rem;min-width:120px;display:flex}.bpm-slider{-webkit-appearance:none;background:var(--border-subtle);cursor:pointer;border-radius:3px;outline:none;width:100%;height:6px;transition:background .15s}.bpm-slider::-webkit-slider-thumb{-webkit-appearance:none;background:var(--accent-amber);width:18px;height:18px;box-shadow:0 0 10px var(--accent-amber);cursor:pointer;border-radius:50%;transition:transform .1s}.bpm-slider::-webkit-slider-thumb:hover{transform:scale(1.15)}.bpm-slider::-moz-range-thumb{background:var(--accent-amber);width:18px;height:18px;box-shadow:0 0 10px var(--accent-amber);cursor:pointer;border:none;border-radius:50%}.slider-labels{color:var(--text-muted);font-size:.64rem;font-family:var(--font-mono);justify-content:space-between;display:flex}.transport-play-card{padding:.55rem .95rem}.transport-main-row{flex-wrap:wrap;justify-content:center;align-items:center;gap:1.5rem;padding:.15rem 0;display:flex}.btn-play-master{background:var(--bg-surface-elevated);border:2px solid var(--accent-amber);width:62px;height:62px;color:var(--accent-amber);cursor:pointer;box-shadow:0 0 16px var(--accent-amber-glow);border-radius:50%;flex-shrink:0;justify-content:center;align-items:center;transition:all .15s;display:flex}.btn-play-master:hover{box-shadow:0 0 22px var(--accent-amber-glow);background:#f59e0b26;transform:scale(1.05)}.btn-play-master.is-playing{background:var(--accent-amber);color:#000;box-shadow:0 0 24px var(--accent-amber)}.btn-play-master:active{transform:scale(.96)}.tap-zone{text-align:center;cursor:pointer;background-color:var(--bg-surface-elevated);border:1px solid var(--border-subtle);border-radius:var(--radius-md);box-shadow:var(--shadow-card);width:110px;height:60px;color:var(--accent-cyan);-webkit-user-select:none;user-select:none;flex-direction:column;flex-shrink:0;justify-content:center;align-items:center;font-size:1.2rem;font-weight:800;transition:all .1s;display:flex}.tap-zone:hover{border-color:var(--accent-cyan);background:var(--bg-card-hover);transform:translateY(-1px)}.tap-zone:active,.tap-zone.tap-active{box-shadow:0 0 14px var(--accent-cyan-glow);border-color:var(--accent-cyan);background:#06b6d426;transform:scale(1.03)}.tap-subtext{color:var(--text-muted);text-transform:uppercase;margin-top:2px;font-size:.6rem;font-weight:600}.visualizer-card.visualizer-compact{gap:.25rem;padding:.4rem .85rem}.visualizer-header-bar{justify-content:space-between;align-items:center;margin-bottom:.2rem;display:flex}.visualizer-hint-text{color:var(--text-muted);letter-spacing:.02em;-webkit-user-select:none;user-select:none;align-items:center;gap:.28rem;font-size:.65rem;font-weight:600;display:inline-flex}.visualizer-hint-text .hint-icon{color:var(--accent-amber);opacity:.85}.visualizer-toggle-group{align-items:center;gap:.3rem;display:inline-flex}.btn-view-select{border-radius:var(--radius-sm);padding:.15rem .45rem!important;font-size:.66rem!important}.visualizer-beats-grid{flex-wrap:wrap;justify-content:center;align-items:stretch;gap:.3rem;display:flex}.metro-beat-box.metro-beat-mini{background:var(--bg-surface-elevated);border:1px solid var(--border-subtle);border-radius:var(--radius-sm);text-align:center;flex-direction:column;flex:1;justify-content:center;align-items:center;min-width:32px;max-width:68px;height:32px;padding:.1rem .2rem;transition:all 80ms cubic-bezier(.16,1,.3,1);display:flex;position:relative;overflow:hidden}.btn-beat-toggle{cursor:pointer;-webkit-user-select:none;user-select:none;border-style:solid;outline:none;font-family:inherit}.btn-beat-toggle:hover:not(.metro-beat-active):not(.metro-beat-downbeat):not(.metro-beat-muted){border-color:var(--accent-amber);background:var(--bg-card-hover);transform:translateY(-1px)}.metro-beat-box.metro-beat-muted{opacity:.45;background:#0f172a66;border:1px dashed #94a3b859}.metro-beat-box.metro-beat-muted:hover{opacity:.75;border-color:var(--accent-amber);background:#f59e0b0d}.metro-beat-box.metro-beat-muted .metro-beat-number{color:var(--text-muted);-webkit-text-decoration:line-through #ef4444;text-decoration:line-through #ef4444}.beat-mute-indicator{color:#ef4444;opacity:.85;justify-content:center;align-items:center;display:flex;position:absolute;top:2px;right:2px}.metro-beat-box.metro-beat-muted.metro-beat-muted-active{opacity:.8;border:1px solid var(--text-muted);background:#64748b33;transform:translateY(-1px);box-shadow:0 0 8px #94a3b833}.metro-beat-box.metro-beat-muted.metro-beat-muted-active .metro-beat-number{color:var(--text-secondary)}[data-theme=light] .metro-beat-box.metro-beat-muted{background:#f1f5f9;border-color:#cbd5e1}[data-theme=light] .metro-beat-box.metro-beat-muted:hover{border-color:var(--accent-amber);background:#e2e8f0}[data-theme=light] .metro-beat-box.metro-beat-muted.metro-beat-muted-active{background:#e2e8f0;border-color:#94a3b8}.metro-beat-mini .metro-beat-number{font-family:var(--font-mono);color:var(--text-muted);font-size:.95rem;font-weight:800;line-height:1;transition:color 80ms}.metro-beat-box.metro-beat-active{background:var(--accent-cyan);box-shadow:0 0 14px var(--accent-cyan-glow);border-color:#fff;transform:translateY(-2px)}.metro-beat-box.metro-beat-active .metro-beat-number{color:#000;font-weight:900}.metro-beat-box.metro-beat-downbeat{background:var(--accent-amber);box-shadow:0 0 16px var(--accent-amber-glow);border-color:#fff;transform:translateY(-2px)scale(1.02)}.metro-beat-box.metro-beat-downbeat .metro-beat-number{color:#000;font-weight:900}.pendulum-container{flex-direction:column;justify-content:center;align-items:center;padding:.3rem 0 .5rem;display:flex}.pendulum-container.pendulum-compact .metro-pendulum-svg{filter:drop-shadow(0 4px 12px #00000059);width:105px;height:130px;display:block;overflow:visible}.pendulum-container.pendulum-prominent .metro-pendulum-svg{filter:drop-shadow(0 6px 16px #00000073);width:125px;height:155px;display:block;overflow:visible}.metro-body-triangle{stroke:var(--accent-amber,#f59e0b);fill:#f59e0b0f;stroke-width:26px;stroke-linejoin:round;transition:stroke .2s,fill .2s}.metro-scale-line{stroke:#ffffff26;stroke-width:3px;stroke-dasharray:6 6}.metro-pendulum-arm-rod{stroke:#f8fafc;stroke-width:18px;stroke-linecap:round;transition:stroke .2s}.metro-pendulum-bob-circle{stroke:#f8fafc;stroke-width:8px;transition:stroke .2s,fill 80ms,filter 80ms}.metro-pivot-circle{fill:#38bdf8;stroke:#0006;stroke-width:3px}.metro-pivot-inner{fill:#0b0f17}[data-theme=light] .metro-pendulum-svg{filter:drop-shadow(0 3px 10px #0000001a)}[data-theme=light] .metro-body-triangle{stroke:#d97706;fill:#d977060d}[data-theme=light] .metro-scale-line{stroke:#0000001f}[data-theme=light] .metro-pendulum-arm-rod,[data-theme=light] .metro-pendulum-bob-circle{stroke:#1e293b}[data-theme=light] .metro-pivot-inner{fill:#fff}.audio-card{padding:.75rem .95rem}.audio-settings-grid{border-top:1px solid var(--border-subtle);grid-template-columns:1fr 1fr;gap:.75rem;margin-top:.65rem;padding-top:.65rem;display:grid}.volume-control-box{flex-direction:column;gap:.35rem;display:flex}.volume-header{justify-content:space-between;align-items:center;display:flex}.volume-slider-row{align-items:center;gap:.5rem;display:flex}.custom-volume-slider{-webkit-appearance:none;background:var(--border-subtle);cursor:pointer;border-radius:3px;outline:none;flex:1;height:5px}.custom-volume-slider::-webkit-slider-thumb{-webkit-appearance:none;background:var(--accent-amber);width:16px;height:16px;box-shadow:0 0 6px var(--accent-amber);cursor:pointer;border-radius:50%}.sound-presets-box{flex-direction:column;gap:.35rem;display:flex}.sound-buttons-grid{grid-template-columns:repeat(2,1fr);gap:.35rem;display:grid}.btn-sound-select{background:var(--bg-surface-elevated);border:1px solid var(--border-subtle);color:var(--text-secondary);border-radius:var(--radius-sm);cursor:pointer;justify-content:center;align-items:center;gap:.3rem;padding:.32rem .45rem;font-size:.72rem;font-weight:600;transition:all .12s;display:flex}.btn-sound-select:hover{background:var(--bg-card-hover);color:var(--text-primary)}.btn-sound-select.sound-active{border-color:var(--accent-amber);color:var(--accent-amber);background:#f59e0b26}.rhythm-card{flex-direction:column;justify-content:space-between;display:flex}.rhythm-settings-container{flex-direction:column;gap:.65rem;display:flex}.rhythm-top-row{flex-wrap:wrap;justify-content:space-between;align-items:center;gap:.65rem;display:flex}.beats-stepper-group{align-items:center;gap:.4rem;display:flex}.beats-value-box{font-family:var(--font-mono);color:var(--text-primary);text-align:center;min-width:40px;font-size:1.15rem;font-weight:800}.subdivisions-group{flex-direction:column;gap:.4rem;display:flex}.subdivisions-buttons-row{grid-template-columns:repeat(5,1fr);gap:.35rem;display:grid}.btn-subdivision{background:var(--bg-surface-elevated);border:1px solid var(--border-subtle);border-radius:var(--radius-sm);min-width:0;height:48px;color:var(--text-secondary);cursor:pointer;-webkit-user-select:none;user-select:none;flex-direction:column;justify-content:center;align-items:center;gap:.15rem;padding:.2rem .25rem;transition:all .15s;display:flex}.btn-subdivision:hover{background:var(--bg-card-hover);border-color:var(--text-muted);color:var(--text-primary)}.btn-subdivision.sub-active{border-color:var(--accent-amber);color:var(--accent-amber);box-shadow:0 0 12px var(--accent-amber-glow);background:#f59e0b26}.sub-note-icon{justify-content:center;align-items:center;width:22px;height:20px;display:flex}.sub-name{text-transform:uppercase;letter-spacing:.02em;white-space:nowrap;text-overflow:ellipsis;max-width:100%;font-size:.58rem;font-weight:700;overflow:hidden}.timer-card{flex-direction:column;gap:.45rem;display:flex}.timer-display-row{justify-content:center;align-items:center;gap:.65rem;display:flex}.timer-digits{font-family:var(--font-mono);color:var(--text-primary);background:var(--bg-surface-elevated);border:1px solid var(--border-subtle);border-radius:var(--radius-md);padding:.2rem .85rem;font-size:2rem;font-weight:800;line-height:1.1}.timer-digits.timer-running{color:var(--accent-amber);border-color:var(--accent-amber);box-shadow:0 0 12px var(--accent-amber-glow)}.timer-presets-row{flex-wrap:wrap;justify-content:center;align-items:center;gap:.35rem;display:flex}.btn-timer-chip{background:var(--bg-surface-elevated);border:1px solid var(--border-subtle);border-radius:var(--radius-full);color:var(--text-secondary);cursor:pointer;padding:.22rem .6rem;font-size:.7rem;font-weight:600;transition:all .12s}.btn-timer-chip:hover{background:var(--bg-card-hover);color:var(--text-primary);border-color:var(--accent-amber)}.btn-timer-chip.chip-active{background:var(--accent-amber);color:#000;border-color:var(--accent-amber);font-weight:800}.trainer-card{flex-direction:column;gap:.45rem;display:flex}.trainer-grid{grid-template-columns:repeat(3,1fr);gap:.55rem;display:grid}.trainer-field{flex-direction:column;gap:.25rem;display:flex}.trainer-select,.trainer-input{background:var(--bg-surface-elevated);border:1px solid var(--border-subtle);border-radius:var(--radius-md);color:var(--text-primary);font-family:var(--font-sans);outline:none;padding:.35rem .55rem;font-size:.78rem}.trainer-select:focus,.trainer-input:focus{border-color:var(--accent-amber)}.modal-backdrop{-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);z-index:100;background:#000000bf;justify-content:center;align-items:center;padding:1.5rem;display:flex;position:fixed;inset:0}.modal-container{background:var(--bg-surface);border:1px solid var(--border-subtle);border-radius:var(--radius-lg);box-shadow:var(--shadow-card);flex-direction:column;width:100%;max-width:680px;max-height:85vh;display:flex;overflow:hidden}.modal-header{border-bottom:1px solid var(--border-subtle);justify-content:space-between;align-items:center;padding:1.25rem 1.5rem;display:flex}.modal-title{color:var(--text-primary);align-items:center;gap:.6rem;font-size:1.15rem;font-weight:800;display:flex}.btn-modal-close{color:var(--text-muted);cursor:pointer;border-radius:var(--radius-sm);background:0 0;border:none;justify-content:center;align-items:center;padding:.35rem;display:flex}.btn-modal-close:hover{color:var(--text-primary);background:var(--bg-surface-elevated)}.modal-body{flex-direction:column;gap:1.25rem;padding:1.5rem;display:flex;overflow-y:auto}.tempo-table{border-collapse:collapse;width:100%;font-size:.85rem}.tempo-table th{text-align:left;border-bottom:2px solid var(--border-subtle);color:var(--text-secondary);text-transform:uppercase;padding:.65rem .75rem;font-size:.75rem;font-weight:700}.tempo-table td{border-bottom:1px solid var(--border-subtle);color:var(--text-primary);padding:.65rem .75rem}.tempo-table-row{cursor:pointer;transition:background .12s}.tempo-table-row:hover{background:var(--bg-surface-elevated)}.tempo-table-row.active-row{background:#f59e0b26;font-weight:700}.tempo-table-row.active-row td:first-child{color:var(--accent-amber)}.shortcuts-list{flex-direction:column;gap:.75rem;display:flex}.shortcut-item{border-bottom:1px solid var(--border-subtle);justify-content:space-between;align-items:center;padding:.5rem 0;display:flex}.shortcut-key{font-family:var(--font-mono);background:var(--bg-surface-elevated);border:1px solid var(--border-subtle);border-radius:var(--radius-sm);color:var(--accent-amber);padding:.2rem .5rem;font-size:.75rem;font-weight:700}.app-studio-footer{background-color:var(--bg-surface);border-top:1px solid var(--border-subtle);margin-top:auto;padding:1rem 1.25rem}.footer-container{flex-direction:column;gap:.6rem;max-width:1040px;margin:0 auto;display:flex}.footer-main-row{flex-wrap:wrap;justify-content:space-between;align-items:center;gap:.75rem;display:flex}.footer-brand{align-items:center;gap:.5rem;display:flex}.footer-logo-badge{border-radius:var(--radius-sm);border:1px solid var(--accent-amber);background:#111827;flex-shrink:0;justify-content:center;align-items:center;width:26px;height:26px;padding:2px;transition:all .2s;display:flex}[data-theme=light] .footer-logo-badge{background:#fff;border-color:#d97706}.footer-brand-name{color:var(--text-primary);font-size:.78rem;font-weight:700}.footer-brand-divider{color:var(--text-muted);margin:0 .2rem}.footer-copyright{color:var(--text-secondary);font-size:.72rem}.text-accent-gold{color:var(--accent-amber)}.footer-links-group{align-items:center;gap:.5rem;display:flex}.footer-nav-link{color:var(--text-secondary);cursor:pointer;background:0 0;border:none;align-items:center;gap:.3rem;font-size:.75rem;transition:color .12s;display:inline-flex}.footer-nav-link:hover{color:var(--accent-amber)}.footer-links-divider{color:var(--border-subtle)}.footer-disclaimer-row{border-top:1px solid var(--border-subtle);padding-top:.5rem}.footer-disclaimer-text{color:var(--text-muted);font-size:.68rem;line-height:1.35}@media (width<=768px){.app-header{padding:.45rem .85rem}.header-stat-pill,.header-action-label{display:none}.audio-settings-grid{grid-template-columns:1fr;gap:.65rem}.trainer-grid{grid-template-columns:1fr}}@media (width<=640px){.app-main-content{gap:.55rem;padding:.5rem .65rem 1.5rem}.control-card{padding:.65rem .75rem}.header-left{gap:.45rem}.logo-title{font-size:.95rem}.logo-subtitle{font-size:.62rem}.btn-theme-toggle .theme-toggle-label{display:none}.btn-theme-toggle{margin-left:.2rem;padding:.22rem .4rem}.btn-riffloop-studio .riffloop-label-full{display:none}.btn-riffloop-studio .riffloop-label-short{display:inline}.btn-riffloop-studio{margin-left:.2rem;padding:.22rem .42rem}.bpm-hero-card{padding:.65rem .65rem .55rem}.bpm-inline-input{width:150px;font-size:2.8rem}.bpm-controls-bar{gap:.35rem}.bpm-slider-container{min-width:80px}.slider-labels span:nth-child(2){display:none}.subdivisions-buttons-row{grid-template-columns:repeat(3,1fr)}.footer-main-row{flex-direction:column;align-items:flex-start;gap:.65rem}.footer-links-group{flex-wrap:wrap;gap:.45rem}}@media (width<=440px){.logo-title{font-size:.88rem}.btn-stepper{width:32px;height:32px;font-size:.95rem}.btn-stepper-small{width:26px;height:26px;font-size:.66rem}.tap-zone{width:95px;height:52px;font-size:1.05rem}.btn-play-master{width:56px;height:56px}.subdivisions-buttons-row{grid-template-columns:repeat(2,1fr)}.rhythm-top-row{flex-direction:column;align-items:flex-start}.timer-display-row{gap:.4rem}.timer-digits{padding:.15rem .6rem;font-size:1.65rem}}.musicians-guide-card{background:var(--bg-card);border:1px solid var(--border-color);border-radius:var(--radius-lg);box-shadow:var(--shadow-card);margin-top:.75rem;padding:1.1rem 1.25rem;transition:all .2s}.musicians-guide-card.is-collapsed{background:#12182699;border-color:#ffffff14;padding:.45rem .85rem}.musicians-guide-card.is-collapsed:hover{background:#f59e0b08;border-color:#f59e0b59;box-shadow:0 0 12px #f59e0b14}.musicians-guide-card.is-collapsed .guide-icon-wrap{width:28px;height:28px}.musicians-guide-card.is-collapsed .guide-main-title{font-size:.86rem;font-weight:600}.guide-header-bar{cursor:pointer;-webkit-user-select:none;user-select:none;justify-content:space-between;align-items:center;display:flex}.guide-header-bar:hover .guide-main-title{color:var(--accent-amber)}.guide-title-group{align-items:center;gap:.65rem;display:flex}.guide-titles-wrapper{flex-wrap:wrap;align-items:center;gap:.55rem;display:flex}.guide-icon-wrap{border-radius:var(--radius-md);background:#f59e0b1f;border:1px solid #f59e0b40;flex-shrink:0;justify-content:center;align-items:center;width:34px;height:34px;transition:all .15s;display:flex}.guide-main-title{color:var(--text-primary);letter-spacing:-.01em;margin:0;font-size:.98rem;font-weight:700;transition:color .15s}.guide-badge-pill{font-family:var(--font-sans);color:var(--accent-amber);letter-spacing:.02em;background:#f59e0b1f;border:1px solid #f59e0b40;border-radius:4px;padding:.1rem .45rem;font-size:.68rem;font-weight:700}.btn-guide-toggle{color:var(--text-muted);cursor:pointer;border-radius:var(--radius-md);background:0 0;border:none;justify-content:center;align-items:center;padding:.35rem;transition:color .15s,background .15s;display:flex}.btn-guide-toggle:hover{color:var(--text-primary);background:var(--bg-card-hover)}.guide-content-body.guide-collapsed{display:none}.guide-content-body.guide-open{border-top:1px solid var(--border-color);flex-direction:column;gap:1.6rem;margin-top:1rem;padding-top:1rem;animation:.2s ease-out guideFadeIn;display:flex}@keyframes guideFadeIn{0%{opacity:0;transform:translateY(-4px)}to{opacity:1;transform:translateY(0)}}.guide-block{flex-direction:column;gap:.5rem;display:flex}.guide-block-header{align-items:center;gap:.5rem;display:flex}.guide-block-header h3{color:var(--text-primary);margin:0;font-size:.95rem;font-weight:700}.guide-block-desc{color:var(--text-secondary);margin:0;font-size:.82rem;line-height:1.55}.guide-table-responsive{border-radius:var(--radius-md);border:1px solid var(--border-color);margin-top:.5rem;overflow-x:auto}.tempo-guide-table{border-collapse:collapse;text-align:left;width:100%;font-size:.82rem}.tempo-guide-table thead{border-bottom:1px solid var(--border-color);background:#00000040}.tempo-guide-table th{text-transform:uppercase;letter-spacing:.04em;color:var(--text-muted);padding:.55rem .75rem;font-size:.75rem;font-weight:700}.tempo-guide-table td{vertical-align:middle;border-bottom:1px solid #ffffff0a;padding:.6rem .75rem}.tempo-guide-table tr:last-child td{border-bottom:none}.tempo-guide-table tr:hover{background:#f59e0b0a}.tempo-guide-table tr.row-active-tempo{border-left:3px solid var(--accent-amber);background:#f59e0b1f}.term-cell{flex-direction:column;display:flex}.term-italian{color:var(--text-primary);font-weight:700}.term-english{color:var(--text-muted);font-size:.72rem}.bpm-range-pill{font-family:var(--font-mono);color:var(--accent-amber);white-space:nowrap;background:#f59e0b1a;border-radius:4px;padding:.18rem .5rem;font-size:.76rem;font-weight:600}.term-desc{color:var(--text-secondary);font-size:.76rem;line-height:1.4}.btn-table-set-bpm{font-family:var(--font-mono);background:var(--bg-card-hover);border:1px solid var(--border-color);color:var(--text-primary);border-radius:var(--radius-sm);cursor:pointer;white-space:nowrap;align-items:center;gap:.3rem;padding:.25rem .6rem;font-size:.74rem;font-weight:700;transition:all .15s;display:inline-flex}.btn-table-set-bpm:hover{border-color:var(--accent-amber);color:var(--accent-amber);background:#f59e0b1a}.btn-table-set-bpm.btn-active-set{background:var(--accent-amber);border-color:var(--accent-amber);color:#0b0f17;box-shadow:0 0 10px var(--accent-amber-glow)}.practice-tips-grid{grid-template-columns:repeat(2,1fr);gap:.75rem;margin-top:.4rem;display:grid}.practice-tip-card{border:1px solid var(--border-color);border-radius:var(--radius-md);background:#0003;padding:.75rem .85rem;position:relative}.tip-number{font-family:var(--font-mono);color:var(--accent-amber);background:#f59e0b26;border-radius:3px;margin-bottom:.3rem;padding:.1rem .35rem;font-size:.7rem;font-weight:800;display:inline-block}.practice-tip-card h4{color:var(--text-primary);margin:.2rem 0 .25rem;font-size:.84rem;font-weight:700}.practice-tip-card p{color:var(--text-secondary);margin:0;font-size:.76rem;line-height:1.45}.formula-callout{border-radius:var(--radius-md);background:#f59e0b14;border:1px dashed #f59e0b4d;flex-wrap:wrap;align-items:center;gap:.5rem;margin-top:.3rem;padding:.6rem .85rem;display:flex}.formula-title{color:var(--accent-amber);font-size:.8rem;font-weight:700}.formula-callout code{font-family:var(--font-mono);color:#38bdf8;font-size:.82rem;font-weight:700}.faq-accordion-group{flex-direction:column;gap:.5rem;margin-top:.3rem;display:flex}.faq-item{border:1px solid var(--border-color);border-radius:var(--radius-md);background:#00000026;transition:border-color .15s;overflow:hidden}.faq-item[open]{border-color:#f59e0b66}.faq-question{color:var(--text-primary);cursor:pointer;-webkit-user-select:none;user-select:none;justify-content:space-between;align-items:center;padding:.65rem .85rem;font-size:.84rem;font-weight:700;list-style:none;transition:color .15s;display:flex}.faq-question::-webkit-details-marker{display:none}.faq-question:after{content:"+";color:var(--text-muted);margin-left:.5rem;font-size:1.1rem;font-weight:400;transition:transform .2s}.faq-item[open] .faq-question:after{content:"−";color:var(--accent-amber)}.faq-question:hover{color:var(--accent-amber)}.faq-answer{color:var(--text-secondary);border-top:1px solid #ffffff0a;padding:.5rem .85rem .75rem;font-size:.8rem;line-height:1.5}@media (width<=640px){.practice-tips-grid{grid-template-columns:1fr}.tempo-guide-table th:nth-child(3),.tempo-guide-table td:nth-child(3){display:none}}[data-theme=light] .musicians-guide-card{background:#fff;border-color:#e2e8f0;box-shadow:0 4px 16px #0000000d}[data-theme=light] .musicians-guide-card.is-collapsed{background:#fff;border-color:#e2e8f0;box-shadow:0 2px 8px #0000000a}[data-theme=light] .musicians-guide-card.is-collapsed:hover{border-color:var(--accent-amber);background:#f8fafc;box-shadow:0 4px 14px #d977061f}[data-theme=light] .guide-icon-wrap{background:#d9770614;border-color:#d9770633}[data-theme=light] .guide-badge-pill{color:var(--accent-amber);background:#d9770614;border-color:#d9770640}[data-theme=light] .guide-content-body.guide-open{border-top-color:#e2e8f0}[data-theme=light] .guide-table-responsive{border-color:#e2e8f0}[data-theme=light] .tempo-guide-table thead{background:#f8fafc;border-bottom-color:#e2e8f0}[data-theme=light] .tempo-guide-table th{color:#64748b}[data-theme=light] .tempo-guide-table td{border-bottom-color:#f1f5f9}[data-theme=light] .tempo-guide-table tr:hover{background:#d977060a}[data-theme=light] .tempo-guide-table tr.row-active-tempo{border-left-color:var(--accent-amber);background:#d9770614}[data-theme=light] .btn-table-set-bpm{color:#0f172a;background:#f1f5f9;border-color:#cbd5e1}[data-theme=light] .btn-table-set-bpm:hover{border-color:var(--accent-amber);color:var(--accent-amber);background:#d977061a}[data-theme=light] .practice-tip-card{background:#f8fafc;border-color:#e2e8f0}[data-theme=light] .formula-callout{background:#d977060d;border-color:#d9770640}[data-theme=light] .formula-callout code{color:#0284c7}[data-theme=light] .faq-item{background:#f8fafc;border-color:#e2e8f0}[data-theme=light] .faq-item[open]{border-color:#d9770659}[data-theme=light] .faq-answer{color:#475569;border-top-color:#e2e8f0}