html,body{margin:0;padding:0;width:100%;height:100%;overflow:hidden}#root{position:fixed;top:0;left:0;width:100%;height:100vh;height:100dvh;overflow:hidden}:root{font-family:system-ui,Avenir,Helvetica,Arial,sans-serif;line-height:1.5;font-weight:400;color-scheme:light dark;color:#ffffffde;background-color:#242424;font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;--pad-gap: 4px}a{font-weight:500;color:#646cff;text-decoration:inherit}a:hover{color:#535bf2}h1{font-size:3.2em;line-height:1.1}button{border-radius:8px;border:1px solid transparent;padding:.6em 1.2em;font-size:1em;font-weight:500;font-family:inherit;background-color:#1a1a1a;cursor:pointer;transition:border-color .25s}button:hover{border-color:#646cff}button:focus,button:focus-visible{outline:4px auto -webkit-focus-ring-color}@media(prefers-color-scheme:light){:root{color:var(--text, #213547);background-color:var(--background, #e8e4dc)}a:hover{color:#747bff}button{background-color:var(--surface, #f9f9f9)}}html[data-theme] body,html[data-theme] #root,html[data-theme] .app-wrapper,html[data-theme] .app,html[data-theme] .app-main,html[data-theme] .bottom-row,html[data-theme] .tab-section,html[data-theme] .device-section,html[data-theme] .sound-edit-section{background:transparent!important}html[data-theme] .app-header,html[data-theme] .app-footer{background:var(--surface)!important;backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px)}html[data-theme] .tab-content,html[data-theme] .library-panel,html[data-theme] .chat-container,html[data-theme] .transport-bar,html[data-theme] .mixer-panel,html[data-theme] .sequencer-panel,html[data-theme] .midi-panel,html[data-theme] .controls-panel,html[data-theme] .pad-grid-wrapper,html[data-theme] .cloud-hub,html[data-theme] .settings-panel,html[data-theme] .video-panel,html[data-theme] .css-panel{background:var(--surface)}html[data-theme] .header-right button{color:var(--primary)}html[data-theme] .header-right button:hover{background:var(--primary)!important;border-color:var(--primary)!important;color:#000!important}html[data-theme=vaporwave]{--background: #150028;--surface: rgba(30, 0, 55, .78);--primary: #ff6ec7;--secondary: #a855f7;--accent: #06b6d4;--text: #ffccf5;--text-muted: rgba(255, 160, 230, .55);--pad-empty: rgba(168, 85, 247, .25);--pad-filled: #ff6ec7;--pad-active: #c084fc;--pad-playing: #06b6d4;--waveform: #06b6d4;background-image:linear-gradient(160deg,#2a0040,#1a0035 40%,#0d1a40,#051a2a)!important;background-size:cover!important;background-attachment:fixed!important}html[data-theme=scanlines]{--background: #020e08;--surface: rgba(5, 22, 12, .82);--primary: #00ff7a;--secondary: #00cc60;--accent: #00ffa0;--text: #ccffe8;--text-muted: rgba(0, 200, 100, .55);--pad-empty: rgba(0, 200, 100, .2);--pad-filled: #00cc60;--pad-active: #00ff7a;--pad-playing: #00ffa0;--waveform: #00ff7a;background:#020e08!important}html[data-theme=aurora]{--background: #020d10;--surface: rgba(4, 20, 26, .8);--primary: #10b981;--secondary: #3b82f6;--accent: #8b5cf6;--text: #ccfff5;--text-muted: rgba(16, 185, 130, .55);--pad-empty: rgba(59, 130, 246, .2);--pad-filled: #10b981;--pad-active: #3b82f6;--pad-playing: #8b5cf6;--waveform: #10b981;background-image:radial-gradient(ellipse 80% 50% at 25% 60%,rgba(16,185,129,.55) 0%,transparent 65%),radial-gradient(ellipse 65% 40% at 75% 35%,rgba(59,130,246,.45) 0%,transparent 65%),radial-gradient(ellipse 55% 55% at 50% 85%,rgba(139,92,246,.35) 0%,transparent 65%),linear-gradient(180deg,#020d14,#030a10)!important;background-size:cover!important;background-attachment:fixed!important}html[data-theme=neon]{--background: #0d0017;--surface: rgba(18, 0, 28, .8);--primary: #ff0080;--secondary: #00c8ff;--accent: #cc00ff;--text: #ffccff;--text-muted: rgba(255, 0, 128, .55);--pad-empty: rgba(200, 0, 255, .2);--pad-filled: #ff0080;--pad-active: #cc00ff;--pad-playing: #00c8ff;--waveform: #00c8ff;background-image:radial-gradient(ellipse 55% 65% at 15% 50%,rgba(255,0,128,.4) 0%,transparent 70%),radial-gradient(ellipse 55% 65% at 85% 50%,rgba(0,200,255,.4) 0%,transparent 70%),radial-gradient(ellipse 40% 40% at 50% 50%,rgba(204,0,255,.2) 0%,transparent 70%),linear-gradient(180deg,#0d0017,#12001e)!important;background-size:cover!important;background-attachment:fixed!important}html[data-theme=static]{--background: #120800;--surface: rgba(24, 12, 0, .82);--primary: #ff8c00;--secondary: #ff6400;--accent: #ffc800;--text: #fff0cc;--text-muted: rgba(255, 140, 0, .55);--pad-empty: rgba(255, 140, 0, .2);--pad-filled: #ff8c00;--pad-active: #ffc800;--pad-playing: #ff6400;--waveform: #ffc800;background-image:radial-gradient(ellipse 70% 50% at 50% 50%,rgba(255,140,0,.12) 0%,transparent 70%),linear-gradient(180deg,#1a0a00,#120800,#0e0500)!important;background-size:cover!important;background-attachment:fixed!important}html[data-theme=matrix]{--background: #000800;--surface: rgba(0, 14, 0, .82);--primary: #00ff46;--secondary: #00cc37;--accent: #00ff46;--text: #ccffcc;--text-muted: rgba(0, 200, 55, .55);--pad-empty: rgba(0, 200, 55, .18);--pad-filled: #00cc37;--pad-active: #00ff46;--pad-playing: #88ff00;--waveform: #00ff46;background-image:radial-gradient(ellipse at 50% 100%,rgba(0,255,70,.18) 0%,transparent 60%),linear-gradient(180deg,#000800,#000400)!important;background-size:cover!important;background-attachment:fixed!important}button:not(.connect-btn):not(.hub-sign-in-btn):not(.hub-btn):not(.a11y-theme-btn):not(.tab-button):not(.step-btn):not(.ovw-step):not(.piano-step):not(.pad):not(.transport-btn):not(.source-btn):not(.mode-btn):not(.solo-btn):not(.mute-btn):not(.layout-btn):not(.style-btn):not(.fullscreen-btn):not(.user-avatar-btn):not(.user-login-btn):not(.social-save-btn):not(.social-custom-add-btn){background:var(--surface)!important;color:var(--text)!important;border:1px solid color-mix(in srgb,var(--text) 18%,transparent)!important}button:not(.connect-btn):not(.hub-sign-in-btn):not(.hub-btn):not(.a11y-theme-btn):not(.tab-button):not(.step-btn):not(.ovw-step):not(.piano-step):not(.pad):not(.transport-btn):not(.source-btn):not(.mode-btn):not(.solo-btn):not(.mute-btn):not(.layout-btn):not(.style-btn):not(.fullscreen-btn):not(.user-avatar-btn):not(.user-login-btn):not(.social-save-btn):not(.social-custom-add-btn):hover:not(:disabled){background:var(--accent)!important;color:var(--accent-contrast, #fff)!important;border-color:var(--accent)!important}button.active:not(.tab-button):not(.step-btn):not(.ovw-step):not(.connect-btn):not(.source-btn):not(.mode-btn):not(.solo-btn):not(.mute-btn):not(.hub-nav-btn):not(.hub-sub-tab):not(.a11y-theme-btn):not(.pad){background:var(--secondary)!important;color:var(--accent-contrast, #fff)!important;border-color:var(--secondary)!important}.tab-button.active{background:var(--accent)!important;border-color:var(--accent)!important;color:var(--accent-contrast, #fff)!important}html[data-theme-polarity=light] input,html[data-theme-polarity=light] select,html[data-theme-polarity=light] textarea{border:1px solid rgba(0,0,0,.28)!important;color:var(--text)!important;background-color:#fff!important}html[data-theme-polarity=light] .transport,html[data-theme-polarity=light] .tab-content,html[data-theme-polarity=light] .library-panel,html[data-theme-polarity=light] .sequencer-panel,html[data-theme-polarity=light] .mixer-panel,html[data-theme-polarity=light] .cloud-hub,html[data-theme-polarity=light] .pad-grid-wrapper,html[data-theme-polarity=light] .settings-panel{border-color:var(--border-subtle)!important}html[data-theme-polarity=light] .channel-strip,html[data-theme-polarity=light] .hub-item,html[data-theme-polarity=light] .library-item,html[data-theme-polarity=light] .scene-item,html[data-theme-polarity=light] .pad{border:1px solid var(--border-subtle)!important}html[data-theme-polarity=light] .mixer-header,html[data-theme-polarity=light] .library-header,html[data-theme-polarity=light] .seq-header,html[data-theme-polarity=light] .hub-header{border-bottom:1px solid var(--border-subtle)!important}html[data-theme-polarity=light] .transport-btn,html[data-theme-polarity=light] .transport-bpm,html[data-theme-polarity=light] .transport-step,html[data-theme-polarity=light] .transport-status,html[data-theme-polarity=light] .transport-time-counter{border:1px solid var(--border-subtle)!important;color:var(--text)!important}html[data-theme-polarity=light] .step-btn,html[data-theme-polarity=light] .ovw-step{border:1px solid var(--border-subtle)!important;background:var(--surface)!important;color:var(--text)!important}html[data-theme-polarity=light] .step-btn.active,html[data-theme-polarity=light] .ovw-step.active{background:var(--secondary)!important;border-color:var(--secondary)!important;box-shadow:0 0 5px color-mix(in srgb,var(--secondary) 55%,transparent)!important;color:#fff!important;opacity:1!important}html[data-theme-polarity=light] .source-btn.active,html[data-theme-polarity=light] .mode-btn.active{background:var(--secondary)!important;border-color:var(--secondary)!important;color:#fff!important}html[data-theme-polarity=light] .step-btn.current,html[data-theme-polarity=light] .ovw-step.current{box-shadow:0 0 0 2px var(--accent)!important}html[data-theme-polarity=light] .step-btn.active.current,html[data-theme-polarity=light] .ovw-step.active.current{background:var(--secondary)!important;box-shadow:0 0 0 2px var(--accent),0 0 8px var(--secondary)!important}html[data-theme-polarity=light] .step-btn.downbeat,html[data-theme-polarity=light] .ovw-step.downbeat{border-left:2px solid var(--secondary)!important}html[data-theme] .transport{background:var(--surface)!important;border-top-color:#80808033!important}html[data-theme] .transport-time-counter{background:color-mix(in srgb,var(--background) 90%,#000)!important;border-color:#80808059!important}html[data-theme] .time-value{color:var(--accent)!important}html[data-theme] .transport-bpm,html[data-theme] .transport-step,html[data-theme] .transport-status{background:color-mix(in srgb,var(--background) 70%,transparent)!important;border-color:#80808040!important}html[data-theme] .bpm-value,html[data-theme] .step-value{color:var(--secondary)!important}html[data-theme] .bpm-unit,html[data-theme] .step-unit,html[data-theme] .time-unit,html[data-theme] .transport-help span{color:var(--text-muted)!important}html[data-theme] .transport-btn{background:var(--surface)!important;color:var(--text)!important;border-color:#80808040!important}html[data-theme] .transport-btn:hover{border-color:var(--primary)!important;color:var(--primary)!important}html[data-theme] .transport-status.playing{color:var(--accent)!important;border-color:var(--accent)!important}html[data-theme] .transport-status.playing .status-dot{background:var(--accent)!important;box-shadow:0 0 8px var(--accent)!important}html[data-theme] .mixer,html[data-theme] .mixer-header,html[data-theme] .mixer-style-toggle,html[data-theme] .mixer-layout-toggle,html[data-theme] .mixer-channels{background:var(--surface)!important}html[data-theme] .mixer-header{border-bottom-color:#80808033!important}html[data-theme] .mixer-header-sep{background:#80808033!important}html[data-theme] .mixer-title{color:var(--primary)!important;text-shadow:0 0 8px var(--primary)!important}html[data-theme] .layout-btn{background:color-mix(in srgb,var(--surface) 80%,transparent)!important;color:var(--text-muted)!important;border-color:#8080804d!important}html[data-theme] .layout-btn:hover{background:color-mix(in srgb,var(--primary) 15%,transparent)!important;color:var(--text)!important;border-color:var(--primary)!important}html[data-theme] .fullscreen-btn{background:var(--surface)!important;color:var(--text-muted)!important;border-color:var(--text-muted)!important}html[data-theme] .fullscreen-btn:hover{color:var(--primary)!important;border-color:var(--primary)!important}html[data-theme] .channel-strip,html[data-theme] .channel-bg,html[data-theme] .mini-channel{background:color-mix(in srgb,var(--surface) 60%,transparent)!important;border-color:#80808033!important}html[data-theme] .channel-strip:hover{border-color:var(--primary)!important;box-shadow:0 0 8px color-mix(in srgb,var(--primary) 30%,transparent)!important}html[data-theme] .channel-name,html[data-theme] .channel-label,html[data-theme] .ch-name,html[data-theme] .ch-label{color:var(--text)!important}html[data-theme] .channel-number,html[data-theme] .ch-num{color:var(--text-muted)!important}html[data-theme] .channel-strip.selected,html[data-theme] .channel-strip.active,html[data-theme] .mini-channel.selected{border-color:var(--primary)!important;box-shadow:0 0 10px color-mix(in srgb,var(--primary) 40%,transparent)!important}html[data-theme] .fader-track,html[data-theme] .fader-bg{background:color-mix(in srgb,var(--background) 80%,#000)!important;border-color:#8080804d!important}html[data-theme] .fader-fill,html[data-theme] .fader-level{background:linear-gradient(0deg,var(--secondary) 0%,var(--primary) 100%)!important}html[data-theme] .fader-thumb,html[data-theme] .fader-handle{background:var(--text)!important;border-color:var(--primary)!important;box-shadow:0 0 6px color-mix(in srgb,var(--primary) 50%,transparent)!important}html[data-theme] .knob-track,html[data-theme] .rotary-bg{background:color-mix(in srgb,var(--background) 80%,#000)!important;border-color:#8080804d!important}html[data-theme] .knob-fill,html[data-theme] .rotary-fill{background:var(--accent)!important}html[data-theme] .knob-thumb,html[data-theme] .rotary-thumb{background:var(--text)!important;border-color:var(--accent)!important}html[data-theme] .solo-btn,html[data-theme] .mute-btn{background:color-mix(in srgb,var(--surface) 80%,transparent)!important;border-color:#8080804d!important;color:var(--text-muted)!important}html[data-theme] .solo-btn.active,html[data-theme] .mute-btn.active{background:var(--secondary)!important;border-color:var(--secondary)!important;color:#fff!important}html[data-theme] .solo-btn:hover{border-color:var(--accent)!important;color:var(--accent)!important}html[data-theme] .mute-btn:hover{border-color:var(--primary)!important;color:var(--primary)!important}html[data-theme] .vu-bg,html[data-theme] .vu-meter-bg{background:color-mix(in srgb,var(--background) 90%,#000)!important;border-color:#80808033!important}html[data-theme] .volume-label,html[data-theme] .db-label,html[data-theme] .mixer-label{color:var(--text-muted)!important}html[data-theme] .ch-value,html[data-theme] .channel-value,html[data-theme] .mixer-value{color:var(--accent)!important}html[data-theme] .sequencer{background:var(--surface)!important}html[data-theme] .sequencer-header{background:color-mix(in srgb,var(--background) 80%,transparent)!important;border-bottom-color:color-mix(in srgb,var(--primary) 40%,transparent)!important}html[data-theme] .sequencer-title{color:var(--secondary)!important}html[data-theme] .mode-toggle,html[data-theme] .layout-toggle{background:color-mix(in srgb,var(--surface) 80%,transparent)!important}html[data-theme] .bpm-input{background:color-mix(in srgb,var(--background) 70%,transparent)!important;color:var(--text)!important;border-color:var(--text-muted)!important}html[data-theme] .step-btn{background:color-mix(in srgb,var(--background) 60%,transparent)!important;border-color:color-mix(in srgb,var(--primary) 20%,rgba(128,128,128,.3))!important}html[data-theme] .step-btn.downbeat{border-left-color:color-mix(in srgb,var(--primary) 70%,transparent)!important;border-left-width:2px!important}html[data-theme] .step-btn:hover{background:color-mix(in srgb,var(--primary) 18%,transparent)!important;border-color:var(--primary)!important}html[data-theme] .step-btn.active{background:var(--accent)!important;border-color:var(--accent)!important;box-shadow:0 0 8px color-mix(in srgb,var(--accent) 70%,transparent)!important}html[data-theme] .step-btn.current{box-shadow:0 0 0 2px var(--primary),0 0 8px var(--primary)!important}html[data-theme] .piano-step{background:color-mix(in srgb,var(--background) 55%,transparent)!important}html[data-theme] .piano-step:hover{background:color-mix(in srgb,var(--primary) 25%,transparent)!important;opacity:1!important}html[data-theme] .piano-step.active{background:var(--accent)!important;box-shadow:0 0 6px color-mix(in srgb,var(--accent) 80%,transparent)!important}html[data-theme] .piano-step.current{outline:2px solid var(--primary)!important;outline-offset:-2px!important}html[data-theme] .piano-step.bar-start{border-left:2px solid color-mix(in srgb,var(--primary) 80%,transparent)!important}html[data-theme] .piano-step.beat-start{border-left:1px solid color-mix(in srgb,var(--primary) 40%,transparent)!important}html[data-theme] .piano-pad-key{background:color-mix(in srgb,var(--surface) 70%,transparent)!important;border-color:color-mix(in srgb,var(--primary) 30%,transparent)!important;color:var(--text)!important}html[data-theme] .piano-row.selected-row .piano-pad-key{background:color-mix(in srgb,var(--accent) 30%,var(--surface))!important;border-color:var(--accent)!important;color:var(--accent)!important}html[data-theme] .piano-roll-grid{border-color:color-mix(in srgb,var(--primary) 25%,transparent)!important}html[data-theme] .scene-item,html[data-theme] .pattern-item{background:color-mix(in srgb,var(--surface) 60%,transparent)!important;border-color:#80808033!important;color:var(--text)!important}html[data-theme] .scene-item.active,html[data-theme] .pattern-item.active{background:var(--accent)!important;border-color:var(--accent)!important;color:var(--accent-contrast, #fff)!important}html[data-theme] .scene-item.active .scene-id,html[data-theme] .scene-item.active .scene-bars{color:var(--accent-contrast, #fff)!important}html[data-theme] .display.sound-edit-window{background:linear-gradient(180deg,color-mix(in srgb,var(--background) 85%,var(--secondary)) 0%,var(--background) 100%)!important;border:1px solid color-mix(in srgb,var(--primary) 40%,transparent)!important;box-shadow:inset 0 1px 2px #0000004d,0 2px 8px color-mix(in srgb,var(--primary) 20%,transparent)!important}html[data-theme] .display-waveform{background:color-mix(in srgb,var(--background) 80%,#000)!important;border-color:color-mix(in srgb,var(--waveform) 30%,transparent)!important}html[data-theme] .waveform-placeholder,html[data-theme] .waveform-hint{color:var(--text-muted)!important}html[data-theme] .sound-name,html[data-theme] .display-sound-name,html[data-theme] .sound-title{color:var(--text)!important}html[data-theme] .sound-stats-value,html[data-theme] .display-stat-value,html[data-theme] .stat-value{color:var(--accent)!important}html[data-theme] .sound-stats-label,html[data-theme] .display-stat-label,html[data-theme] .stat-label,html[data-theme] .display-controls .knob-label,html[data-theme] .display-controls .control-label{color:var(--text-muted)!important}html[data-theme] .display-controls .knob-value,html[data-theme] .display-controls .control-value{color:var(--primary)!important}html[data-theme] .loop-marker,html[data-theme] .trim-marker,html[data-theme] .playhead{background:var(--accent)!important;box-shadow:0 0 6px var(--accent)!important}html[data-theme] .library{background:var(--surface)!important;border:1px solid color-mix(in srgb,var(--primary) 25%,transparent)!important}html[data-theme] .library-header{background:color-mix(in srgb,var(--background) 70%,transparent)!important;border-bottom-color:#80808033!important}html[data-theme] .library-header h3{color:var(--secondary)!important}html[data-theme] .library-search input,html[data-theme] .search-input{background:color-mix(in srgb,var(--background) 70%,transparent)!important;color:var(--text)!important;border-color:#8080804d!important}html[data-theme] .sample-item,html[data-theme] .library-item{border-bottom-color:#8080801a!important;color:var(--text)!important}html[data-theme] .sample-item:hover,html[data-theme] .library-item:hover{background:color-mix(in srgb,var(--primary) 12%,transparent)!important}html[data-theme] .sample-item.selected,html[data-theme] .library-item.selected,html[data-theme] .sample-item.active,html[data-theme] .library-item.active{background:color-mix(in srgb,var(--accent) 20%,transparent)!important;border-left:2px solid var(--accent)!important}html[data-theme] .sample-name,html[data-theme] .item-name{color:var(--text)!important}html[data-theme] .sample-meta,html[data-theme] .item-meta,html[data-theme] .sample-bpm,html[data-theme] .sample-key{color:var(--text-muted)!important}html[data-theme] .category-label,html[data-theme] .folder-label{color:var(--primary)!important;background:color-mix(in srgb,var(--primary) 10%,transparent)!important;border-color:color-mix(in srgb,var(--primary) 30%,transparent)!important}html[data-theme] .sample-waveform-bar{background:var(--accent)!important}html[data-theme] .midi-panel{background:transparent!important}html[data-theme] .midi-devices-row{background:color-mix(in srgb,var(--background) 70%,transparent)!important}html[data-theme] .midi-header-sep{background:#80808033!important}html[data-theme] .midi-io-btn{background:var(--surface)!important;color:var(--text-muted)!important;border-color:#8080804d!important}html[data-theme] .midi-io-btn.active,html[data-theme] .midi-io-btn.selected{background:color-mix(in srgb,var(--accent) 20%,var(--surface))!important;color:var(--accent)!important;border-color:var(--accent)!important}html[data-theme] .pad-grid-wrapper,html[data-theme] .pad-grid{background:transparent!important}html[data-theme] .pad-label,html[data-theme] .pad-number{color:var(--text-muted)!important}html[data-theme] .tab-bar{background:color-mix(in srgb,var(--background) 60%,transparent)!important}html[data-theme] .tab-button{color:var(--text)!important;border-color:#80808033!important;background:#8080800f!important}html[data-theme] .tab-button:hover{color:var(--accent-contrast, #fff)!important;background:var(--accent)!important;border-color:var(--accent)!important;opacity:.85}html[data-theme] .tab-button.active{color:var(--accent-contrast, #fff)!important;background:var(--accent)!important;border-color:var(--accent)!important}html[data-theme] .tab-content{background:var(--surface)!important;border-color:color-mix(in srgb,var(--secondary) 50%,transparent)!important}html[data-theme] .settings-panel{background:var(--surface)!important}html[data-theme] .settings-section,html[data-theme] .settings-group{background:color-mix(in srgb,var(--background) 50%,transparent)!important;border-color:#80808026!important}html[data-theme] .settings-label{color:var(--text-muted)!important}html[data-theme] .settings-value{color:var(--text)!important}html[data-theme] .video-panel{background:var(--surface)!important}html[data-theme] .video-panel-header{background:color-mix(in srgb,var(--background) 70%,transparent)!important;border-bottom-color:#80808033!important}html[data-theme] .video-panel-title{color:var(--secondary)!important}html[data-theme] .cloud-hub{background:var(--surface)!important}html[data-theme] .cloud-hub-header{background:color-mix(in srgb,var(--background) 70%,transparent)!important;border-bottom-color:#80808033!important}html[data-theme] .chat-container{background:var(--surface)!important}html[data-theme] .chat-header{background:color-mix(in srgb,var(--background) 70%,transparent)!important;border-bottom-color:#80808033!important}html[data-theme] .chat-message{background:color-mix(in srgb,var(--surface) 60%,transparent)!important;border-color:#80808026!important;color:var(--text)!important}html[data-theme] .chat-message.own{background:color-mix(in srgb,var(--secondary) 20%,var(--surface))!important;border-color:color-mix(in srgb,var(--secondary) 40%,transparent)!important}html[data-theme] .chat-input-area{background:color-mix(in srgb,var(--background) 70%,transparent)!important;border-top-color:#80808033!important}html[data-theme] .chat-input{background:color-mix(in srgb,var(--background) 70%,transparent)!important;color:var(--text)!important;border-color:#8080804d!important}html[data-theme] .css-panel{background:var(--surface)!important;border-left-color:#80808033!important}html[data-theme] button:not(.tab-button):not(.transport-btn):not(.pad):not(.step-btn):not(.piano-step):not(.ovw-step):not(.connect-btn):not(.slot-action-btn):not(.bank-btn):not(.bank-page-btn):not(.mode-btn):not(.source-btn):not(.solo-btn):not(.mute-btn):not(.a11y-theme-btn){background:var(--surface)!important;color:var(--text)!important;border-color:#80808040!important}html[data-theme] button:not(.tab-button):not(.transport-btn):not(.pad):not(.step-btn):not(.piano-step):not(.ovw-step):not(.connect-btn):not(.slot-action-btn):not(.bank-btn):not(.bank-page-btn):not(.mode-btn):not(.source-btn):not(.solo-btn):not(.mute-btn):not(.a11y-theme-btn):hover{border-color:var(--primary)!important;color:var(--primary)!important}html[data-theme] button.primary,html[data-theme] .btn-primary,html[data-theme] button[class*=primary]{background:var(--primary)!important;color:#000!important;border-color:var(--primary)!important}html[data-theme] button.secondary,html[data-theme] .btn-secondary,html[data-theme] button[class*=secondary]{background:var(--secondary)!important;color:#fff!important;border-color:var(--secondary)!important}html[data-theme] .active-item,html[data-theme] [class*=active]:not(.transport-btn):not(.pad):not(.step-btn):not(.piano-step):not(.ovw-step):not(.source-btn):not(.tab-button):not(.mode-btn):not(.layout-btn):not(.scene-item):not(.pad-select-item):not(.arrangement-item):not(.available-scene):not(.sync-btn):not(.bars-btn):not(.available-scene){color:var(--accent)!important;border-color:var(--accent)!important}html[data-theme] .source-btn.active{background:var(--accent)!important;border-color:var(--accent)!important;color:var(--accent-contrast, #fff)!important}html[data-theme] .mode-btn.active{background:var(--accent)!important;color:var(--accent-contrast, #fff)!important}html[data-theme] .selected,html[data-theme] [aria-selected=true]{border-color:var(--accent)!important;color:var(--accent)!important}html[data-theme] .library,html[data-theme] .sequencer,html[data-theme] .mixer,html[data-theme] .midi-panel>*:first-child,html[data-theme] .display.sound-edit-window{box-shadow:0 0 0 1px color-mix(in srgb,var(--primary) 30%,transparent),0 4px 24px color-mix(in srgb,var(--primary) 10%,transparent)!important}html[data-theme] ::-webkit-scrollbar-track{background:color-mix(in srgb,var(--background) 80%,transparent)!important}html[data-theme] ::-webkit-scrollbar-thumb{background:color-mix(in srgb,var(--primary) 40%,transparent)!important;border-radius:4px!important}html[data-theme] ::-webkit-scrollbar-thumb:hover{background:var(--primary)!important}html[data-theme] select{background:var(--surface)!important;color:var(--text)!important;border-color:#8080804d!important}html[data-theme] input[type=text],html[data-theme] input[type=search],html[data-theme] input[type=number],html[data-theme] textarea{background:color-mix(in srgb,var(--background) 70%,transparent)!important;color:var(--text)!important;border-color:#8080804d!important}html[data-theme] input:focus,html[data-theme] textarea:focus,html[data-theme] select:focus{border-color:var(--primary)!important;outline:none!important;box-shadow:0 0 0 2px color-mix(in srgb,var(--primary) 30%,transparent)!important}html[data-theme] input[type=range]{accent-color:var(--primary)!important}html[data-theme] .ep-info-dropdown .ep-info-panel,html[data-theme] .ep-info-panel{background:color-mix(in srgb,var(--background) 90%,#000)!important;border-color:var(--primary)!important;color:var(--text)!important}html[data-theme] .ep-info-btn{color:var(--accent)!important;border-color:var(--accent)!important;background:var(--surface)!important}html[data-theme] .modal-overlay{background:#0009!important;-webkit-backdrop-filter:blur(6px)!important;backdrop-filter:blur(6px)!important}html[data-theme] .modal-content,html[data-theme] .modal,html[data-theme] .dialog{background:color-mix(in srgb,var(--surface) 95%,#000)!important;border:1px solid color-mix(in srgb,var(--primary) 40%,transparent)!important;color:var(--text)!important;box-shadow:0 0 40px color-mix(in srgb,var(--primary) 20%,transparent)!important}html[data-theme] .header-controls button,html[data-theme] .header-controls select,html[data-theme] .header-controls input{background:var(--surface)!important;color:var(--text)!important;border-color:#80808040!important}html[data-theme] .header-controls button:hover{border-color:var(--primary)!important;color:var(--primary)!important}@media(max-width:768px){button,[role=button],.pad,.ep-pad,.step-btn,.tab-button{touch-action:manipulation}.bottom-row,.transport{display:none!important}.tab-section{flex:1 1 auto!important;height:auto!important;min-height:0!important;overflow:hidden}.app-main{display:flex!important;flex-direction:column!important;min-height:0}.tab-content{flex:1;min-height:0;overflow:hidden}.tab-panel,.tab-panel .pad-grid-container{height:100%;overflow:hidden}.tab-panel .library{height:100%;overflow-y:auto;-webkit-overflow-scrolling:touch}.app-header{height:46px!important;min-height:46px!important;max-height:46px!important;flex-wrap:nowrap!important;padding:4px 8px!important;gap:5px!important;overflow:hidden}.title-riddim,.title-logo-image{display:none!important}.logo-image{height:28px!important}.header-right{gap:3px!important;flex-shrink:0}.header-right button{width:32px!important;height:32px!important;min-width:32px!important;padding:0!important}.mobile-project-bar{display:flex;align-items:center;gap:4px;padding:2px 8px;background:var(--surface);border-bottom:1px solid var(--background);flex-shrink:0;min-height:30px;max-height:34px;overflow:hidden}.mobile-project-bar button{font-size:9px!important;padding:2px 6px!important;height:24px!important}.tab-bar{overflow-x:auto!important;overflow-y:hidden!important;flex-wrap:nowrap!important;-webkit-overflow-scrolling:touch;scrollbar-width:none!important;max-width:100%}.tab-bar::-webkit-scrollbar{display:none!important}.tab-button{flex-shrink:0!important;padding:5px 9px!important;font-size:9px!important;white-space:nowrap}.tab-button .tab-icon{display:none!important}.pad-controls-header{height:auto!important;min-height:auto!important;flex-wrap:wrap;gap:4px;padding:4px 6px}.sequencer-header{padding:4px 8px;gap:4px;overflow-x:auto;overflow-y:hidden;flex-wrap:nowrap!important;-webkit-overflow-scrolling:touch;scrollbar-width:none}.sequencer-header::-webkit-scrollbar{display:none}.step-grid-container{padding:4px;overflow:hidden}.step-grid{overflow:auto;-webkit-overflow-scrolling:touch}.step-row{flex-wrap:nowrap}.step-btn{width:22px;height:22px;min-width:22px}.step-grid-container.layout-compact .step-btn{width:16px;height:16px;min-width:16px}.mixer-header{overflow-x:auto;overflow-y:hidden;flex-wrap:nowrap!important;-webkit-overflow-scrolling:touch;scrollbar-width:none;padding:4px 8px;gap:4px}.mixer-header::-webkit-scrollbar{display:none}.mixer-channels{overflow-x:auto;-webkit-overflow-scrolling:touch}.hub-header,.hub-sub-tabs{overflow-x:auto;overflow-y:hidden;flex-wrap:nowrap!important;-webkit-overflow-scrolling:touch;scrollbar-width:none}.hub-header::-webkit-scrollbar,.hub-sub-tabs::-webkit-scrollbar{display:none}.hub-content{overflow-y:auto;-webkit-overflow-scrolling:touch}.midi-panel-header,.video-panel-header{overflow-x:auto;overflow-y:hidden;flex-wrap:nowrap!important;-webkit-overflow-scrolling:touch;scrollbar-width:none}.midi-panel-header::-webkit-scrollbar,.video-panel-header::-webkit-scrollbar{display:none}.paywall-modal,.modal,.cloud-projects-modal{width:95vw!important;max-width:95vw!important}.settings-content,.admin-panel,.user-dashboard{overflow-y:auto;-webkit-overflow-scrolling:touch}}@media(max-width:900px)and (max-height:500px)and (orientation:landscape){.app-header{height:38px!important;min-height:38px!important;max-height:38px!important;padding:2px 6px!important;gap:4px!important}.logo-image{height:24px!important}.header-right button{width:28px!important;height:28px!important;min-width:28px!important}.mobile-project-bar{min-height:24px!important;max-height:26px!important;padding:1px 6px!important}.mobile-project-bar button{height:20px!important;font-size:8px!important;padding:1px 5px!important}.tab-button{padding:3px 7px!important;font-size:8px!important}.step-btn{width:18px!important;height:18px!important;min-width:18px!important}}@media(max-width:400px){.app-header{height:42px!important;min-height:42px!important;max-height:42px!important;padding:3px 6px!important;gap:3px!important}.logo-image{height:24px!important}.header-right button{width:28px!important;height:28px!important;min-width:28px!important}.tab-button{padding:4px 7px!important;font-size:8px!important}.all-groups{grid-template-columns:repeat(2,1fr)!important;grid-template-rows:repeat(2,1fr)!important;gap:2px}.step-btn{width:18px!important;height:18px!important;min-width:18px!important}}.tooltip-anchor{position:relative;display:inline-flex;align-items:center}.tooltip-anchor.tooltip-fill{display:flex;flex:1;min-width:0;height:100%;overflow:hidden;align-items:stretch}.tooltip-bubble{position:absolute;z-index:9999;display:flex;flex-direction:column;gap:6px;width:240px;max-width:90vw;background:#111827;color:#e5e7eb;border:1px solid #d35400;border-radius:8px;padding:10px 12px;box-shadow:0 8px 24px #0009,0 0 0 1px #d3540026;font-size:13px;line-height:1.5;font-family:var(--font-primary, "Inter", sans-serif);font-weight:400;text-align:left;animation:tooltip-fadein .15s ease;pointer-events:none}.tooltip-bubble:has(.tooltip-iframe){pointer-events:auto;width:300px}@keyframes tooltip-fadein{0%{opacity:0;transform:translateY(4px)}to{opacity:1;transform:translateY(0)}}.tooltip-top .tooltip-bubble{bottom:calc(100% + 8px);left:50%;transform:translate(-50%)}.tooltip-bottom .tooltip-bubble{top:calc(100% + 8px);left:50%;transform:translate(-50%)}.tooltip-right .tooltip-bubble{left:calc(100% + 8px);top:50%;transform:translateY(-50%)}.tooltip-left .tooltip-bubble{right:calc(100% + 8px);top:50%;transform:translateY(-50%)}.tooltip-top .tooltip-bubble:after{content:"";position:absolute;top:100%;left:50%;transform:translate(-50%);border:6px solid transparent;border-top-color:#d35400}.tooltip-bottom .tooltip-bubble:after{content:"";position:absolute;bottom:100%;left:50%;transform:translate(-50%);border:6px solid transparent;border-bottom-color:#d35400}.tooltip-right .tooltip-bubble:after{content:"";position:absolute;right:100%;top:50%;transform:translateY(-50%);border:6px solid transparent;border-right-color:#d35400}.tooltip-left .tooltip-bubble:after{content:"";position:absolute;left:100%;top:50%;transform:translateY(-50%);border:6px solid transparent;border-left-color:#d35400}.tooltip-header{display:flex;align-items:center;gap:5px;color:#d35400;margin-bottom:2px}.tooltip-id-label{font-size:9px;font-weight:700;text-transform:uppercase;letter-spacing:.04em;opacity:.7}.tooltip-text{color:#d1d5db;font-size:13px;line-height:1.55}.tooltip-video-wrapper{display:block;margin-top:4px;border-radius:6px;overflow:hidden;border:1px solid rgba(211,84,0,.3);position:relative}.tooltip-iframe{display:block;width:100%;height:168px;border:none;pointer-events:none}.tooltip-fullscreen-btn{position:absolute;bottom:6px;right:6px;display:inline-flex;align-items:center;gap:4px;padding:4px 8px;background:#000000b3;border:1px solid rgba(255,255,255,.25);border-radius:4px;color:#fff;font-size:9px;font-weight:700;font-family:var(--font-mono, monospace);letter-spacing:.05em;cursor:pointer;pointer-events:auto;transition:background .15s;z-index:2}.tooltip-fullscreen-btn:hover{background:#d35400d9;border-color:#d3540099}.info-toggle-btn{display:inline-flex;align-items:center;justify-content:center;gap:5px;padding:0 10px;height:36px;border-radius:6px;border:1px solid rgba(128,128,128,.3);background:transparent;cursor:pointer;color:var(--secondary, #d35400);transition:all .15s ease;flex-shrink:0}.info-toggle-btn svg{width:14px;height:14px;flex-shrink:0}.info-toggle-label{font-family:var(--font-mono, monospace);font-size:10px;font-weight:700;letter-spacing:.8px;white-space:nowrap}.info-toggle-btn:hover,.info-toggle-btn.active{background:var(--secondary, #d35400);border-color:var(--secondary, #d35400);color:var(--secondary-contrast, #fff)}.info-toggle-btn.active{animation:tooltip-pulse .4s ease}@keyframes tooltip-pulse{0%{box-shadow:0 0 #d3540080}70%{box-shadow:0 0 0 8px #d3540000}to{box-shadow:0 0 #d3540000}}.tooltip-hint-banner{position:fixed;bottom:80px;left:50%;transform:translate(-50%);background:#111827;color:#e5e7eb;border:1px solid #d35400;border-radius:8px;padding:8px 16px;font-size:11px;white-space:nowrap;z-index:10000;box-shadow:0 4px 16px #00000080;animation:hint-banner-in .3s ease,hint-banner-out .4s ease 2.5s forwards;pointer-events:none}@keyframes hint-banner-in{0%{opacity:0;transform:translate(-50%) translateY(8px)}to{opacity:1;transform:translate(-50%) translateY(0)}}@keyframes hint-banner-out{0%{opacity:1}to{opacity:0}}.welcome-overlay{position:fixed;inset:0;z-index:9999;display:flex;align-items:center;justify-content:center;padding:16px;overflow:hidden;animation:welcome-fade-in .4s ease}.welcome-preview-fullscreen{position:absolute;inset:0;z-index:0;animation:welcome-preview-fadein .35s ease;overflow:hidden}.welcome-preview-color{animation:welcome-preview-fadein .35s ease}@keyframes welcome-preview-fadein{0%{opacity:0}to{opacity:1}}.welcome-dim{position:absolute;inset:0;z-index:1;background:#00000073;-webkit-backdrop-filter:blur(3px);backdrop-filter:blur(3px)}@keyframes welcome-fade-in{0%{opacity:0}to{opacity:1}}.welcome-modal{position:relative;z-index:2;width:100%;max-width:560px;max-height:90vh;border-radius:12px;overflow:hidden;display:flex;flex-direction:column;box-shadow:0 24px 80px #000c,0 0 0 1px #ffffff14;animation:welcome-slide-up .4s cubic-bezier(.34,1.56,.64,1)}@keyframes welcome-slide-up{0%{transform:translateY(30px) scale(.96);opacity:0}to{transform:translateY(0) scale(1);opacity:1}}.welcome-header{position:relative;padding:28px 28px 20px;background:#0000008c;border-bottom:1px solid rgba(255,255,255,.1);display:flex;align-items:center;justify-content:space-between;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Helvetica,Arial,sans-serif}.welcome-title{font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Helvetica,Arial,sans-serif;font-size:26px;font-weight:800;letter-spacing:4px;text-transform:uppercase;color:#fff;margin:0;text-shadow:0 0 20px rgba(255,255,255,.5)}.welcome-subtitle{font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Helvetica,Arial,sans-serif;font-size:11px;font-weight:400;letter-spacing:2px;text-transform:uppercase;color:#ffffff8c;margin:4px 0 0}.welcome-close{background:#ffffff1a;border:1px solid rgba(255,255,255,.15);color:#ffffffb3;width:32px;height:32px;border-radius:50%;font-size:18px;line-height:1;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:all .15s ease;flex-shrink:0}.welcome-close:hover{background:#fff3;color:#fff}.welcome-body{padding:24px 28px;background:#00000080;overflow-y:auto;flex:1}.welcome-section-label{font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Helvetica,Arial,sans-serif;font-size:10px;font-weight:700;letter-spacing:2px;text-transform:uppercase;color:#ffffff73;margin:0 0 14px}.welcome-theme-grid-4{display:grid;grid-template-columns:repeat(2,1fr);gap:12px}.welcome-vibe-card{position:relative;display:flex;flex-direction:column;border-radius:10px;overflow:hidden;cursor:pointer;border:2px solid rgba(255,255,255,.12);transition:border-color .2s,transform .2s,box-shadow .2s;background:#0000004d;padding:0;text-align:left}.welcome-vibe-card:hover{border-color:#ffffff80;transform:scale(1.03);box-shadow:0 10px 30px #00000080}.welcome-vibe-card.selected{border-color:#fff;box-shadow:0 0 0 1px #fff,0 10px 30px #0009}.welcome-vibe-card.selected:after{content:"✓";position:absolute;top:8px;right:10px;font-size:14px;font-weight:700;color:#fff;text-shadow:0 1px 4px rgba(0,0,0,.8);z-index:5}.vibe-preview{position:relative;width:100%;aspect-ratio:4 / 3;display:flex;flex-direction:column;gap:4px;padding:6px;overflow:hidden}.vibe-topbar{display:flex;align-items:center;gap:4px;padding:4px 6px;border-radius:4px;height:14px}.vibe-dot{display:block;width:6px;height:6px;border-radius:50%}.vibe-pads{flex:1;display:grid;grid-template-columns:repeat(4,1fr);grid-template-rows:repeat(3,1fr);gap:3px}.vibe-pad{display:block;border-radius:3px;opacity:.9}.vibe-waveform{height:10px;border-radius:3px;display:flex;align-items:center;padding:0 4px;overflow:hidden}.vibe-waveform span{display:block;width:60%;height:3px;border-radius:1px;opacity:.8}.vibe-label{display:block;padding:8px 10px 10px;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Helvetica,Arial,sans-serif;font-size:10px;font-weight:700;letter-spacing:1.5px;text-transform:uppercase;text-align:center;background:#0006}.welcome-footer{padding:16px 28px 20px;background:#0009;border-top:1px solid rgba(255,255,255,.08);display:flex;align-items:center;justify-content:space-between;gap:12px}.welcome-skip{background:transparent;border:1px solid rgba(255,255,255,.2);color:#ffffff80;padding:8px 16px;border-radius:6px;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Helvetica,Arial,sans-serif;font-size:11px;font-weight:600;letter-spacing:1px;text-transform:uppercase;cursor:pointer;transition:all .15s}.welcome-skip:hover{border-color:#fff6;color:#fffc}.welcome-start{background:#fff;border:none;color:#000;padding:10px 28px;border-radius:6px;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Helvetica,Arial,sans-serif;font-size:12px;font-weight:800;letter-spacing:2px;text-transform:uppercase;cursor:pointer;transition:all .15s;flex:1;max-width:200px}.welcome-start:hover{background:#e8e8e8;transform:scale(1.02)}.welcome-start:active{transform:scale(.98)}.welcome-loading{font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Helvetica,Arial,sans-serif;font-size:12px;letter-spacing:2px;color:#fff6;text-align:center;padding:32px 0;text-transform:uppercase}.pad{position:relative;width:100%;height:100%;border-radius:3px;border:1px solid rgba(128,128,128,.3);cursor:grab;transition:box-shadow .1s ease,border-color .1s ease,filter .1s ease;-webkit-user-select:none;user-select:none;touch-action:none;box-shadow:0 1px 2px #0000001a,inset 0 1px #fff3;overflow:hidden;box-sizing:border-box;min-width:0;min-height:0}.pad-inner{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:space-between;padding:4px;overflow:hidden;z-index:1}.pad:hover{box-shadow:0 2px 4px #0003,inset 0 1px #ffffff4d;filter:brightness(1.08);border-color:#fff6}.pad:active{cursor:grabbing;filter:brightness(.95)}.pad.selected{border-color:var(--accent, #2d5a4a);box-shadow:0 0 0 2px #2d5a4a66,0 2px 4px #00000026}.pad.batch-selected{border-color:var(--secondary, #d35400);box-shadow:0 0 0 1px #d3540066,0 1px 2px #0000001a}.pad.dragging{cursor:grabbing;z-index:100;opacity:.8}.pad.has-sample{border-color:#ffffff4d}.pad-bg-overlay{position:absolute;inset:0;border-radius:3px;pointer-events:none;z-index:0}.pad-image-overlay{position:absolute;inset:0;border-radius:3px;pointer-events:none;z-index:0;background-size:cover;background-position:center;background-repeat:no-repeat}.pad-video-overlay{position:absolute;inset:0;border-radius:3px;pointer-events:none;z-index:0;overflow:hidden}.pad-video-overlay video{width:100%;height:100%;object-fit:cover}.pad-header{display:flex;justify-content:space-between;align-items:flex-start;width:100%;flex-shrink:0}.pad-id{font-family:var(--font-mono, monospace);font-size:12px;font-weight:700;color:var(--pad-empty-contrast, var(--text, #1a1a1a));opacity:.7;line-height:1}.pad.has-sample .pad-id{color:var(--pad-filled-contrast, white);opacity:.8}.pad-key-hint{font-family:var(--font-mono, monospace);font-size:10px;font-weight:600;color:var(--pad-empty-contrast, var(--text, #1a1a1a));opacity:.5;line-height:1;text-transform:uppercase;background:#80808026;padding:2px 4px;border-radius:2px}.pad.has-sample .pad-key-hint{color:var(--pad-filled-contrast, white);background:#80808040;opacity:.7}.pad-sample-number{font-family:var(--font-mono, monospace);font-size:22px;font-weight:800;color:var(--pad-filled-contrast, white);text-shadow:0 1px 2px rgba(0,0,0,.25);line-height:1;letter-spacing:-.5px;flex-shrink:0}.pad-empty-indicator{font-family:var(--font-mono, monospace);font-size:12px;color:var(--pad-empty-contrast, var(--text, #1a1a1a));opacity:.3;line-height:1}.pad-sample-name{font-family:var(--font-mono, monospace);font-size:12px;font-weight:600;color:var(--pad-filled-contrast, white);opacity:.9;text-transform:uppercase;letter-spacing:.2px;line-height:1;max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;text-shadow:0 1px 1px rgba(0,0,0,.3);flex-shrink:0}.drop-indicator{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);font-size:12px;font-weight:700;color:#fff;text-shadow:0 1px 2px rgba(0,0,0,.5);pointer-events:none;z-index:5}.pad.playing{animation:pad-pulse .15s ease-out}@keyframes pad-pulse{0%{filter:brightness(1)}50%{filter:brightness(1.3)}to{filter:brightness(1)}}.pad.url-drop-target{outline:2px dashed var(--secondary, #d35400);outline-offset:-2px;background-color:#d3540033!important}.url-drop-indicator{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);font-size:20px;pointer-events:none;z-index:10;animation:url-drop-pulse .5s ease-in-out infinite}@keyframes url-drop-pulse{0%,to{opacity:1;transform:translate(-50%,-50%) scale(1)}50%{opacity:.7;transform:translate(-50%,-50%) scale(1.2)}}.media-url-indicator{position:absolute;top:2px;right:2px;font-size:10px;background:#0009;color:#fff;padding:1px 3px;border-radius:2px;pointer-events:none;z-index:4}.pad.has-media-url{border-color:var(--accent, #2d5a4a)}.pad.flashing{animation:pad-flash .2s ease-out}@keyframes pad-flash{0%{background-color:#fffc;box-shadow:0 1px 2px #0000001a,inset 0 1px #fff3,0 0 8px #fff9}to{background-color:inherit;box-shadow:0 1px 2px #0000001a,inset 0 1px #fff3}}@media(max-width:600px){.pad-sample-number{font-size:12px}.pad-id{font-size:7px}.pad-key-hint,.pad-sample-name{font-size:6px}}.pad-key-mode-note{font-size:13px;font-weight:700;color:var(--pad-filled-contrast, white);line-height:1;text-align:center}.pad-key-mode-label{font-size:8px;letter-spacing:.1em;color:var(--pad-filled-contrast, white);opacity:.65;text-align:center}.pad.key-mode-source{box-shadow:0 0 0 2px var(--secondary) inset}.loop-badge{position:absolute;bottom:3px;right:3px;font-size:7px;font-weight:700;letter-spacing:.05em;padding:1px 3px;border-radius:2px;background:#ff8c0059;color:#ff8c00;pointer-events:none;line-height:1.2}.loop-badge.active{background:#ff8c00bf;color:#fff;box-shadow:0 0 6px #ff8c0099}.loop-badge.gate{background:#60c8ff59;color:#60c8ff}.mute-group-badge{position:absolute;top:3px;right:3px;width:12px;height:12px;border-radius:50%;font-size:7px;font-weight:800;display:flex;align-items:center;justify-content:center;pointer-events:none;line-height:1}.mute-group-badge.mg-1{background:#ff5757;color:#fff}.mute-group-badge.mg-2{background:#57d6ff;color:#000}.mute-group-badge.mg-3{background:#57ff8c;color:#000}.mute-group-badge.mg-4{background:#d657ff;color:#fff}.pad.loop-mode{box-shadow:0 0 0 1px #ff8c0073 inset}.pad.gate-mode{box-shadow:0 0 0 1px #60c8ff73 inset}.pad-waveform-svg{position:absolute;inset:0;width:100%;height:100%;display:block;pointer-events:none;transition:opacity .1s}.pad.playing .pad-waveform-svg{filter:brightness(1.5) drop-shadow(0 0 4px currentColor)}.pad-waveform-svg.playing{animation:wave-pulse .15s ease-out}@keyframes wave-pulse{0%{opacity:.6;transform:scaleY(.85)}60%{opacity:1;transform:scaleY(1.08)}to{opacity:1;transform:scaleY(1)}}.pad-inner.wave-view{position:relative;justify-content:flex-end;padding-bottom:4px}.pad-wave-label{position:absolute;bottom:0;left:0;right:0;padding:0 4px 3px;display:flex;flex-direction:column;align-items:flex-start;gap:0px;pointer-events:none;background:linear-gradient(to top,#000000a6,#0000);border-radius:0 0 4px 4px}.pad-wave-label .pad-id{font-size:8px;font-weight:800;color:#ffffff8c;line-height:1;letter-spacing:.05em}.pad-wave-name{font-size:8px;font-weight:600;color:#ffffffe6;line-height:1.25;letter-spacing:.02em;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:100%}.pad-inner.wave-view:not(:has(.pad-waveform-svg)) .pad-wave-label{display:none}.wave-view-btn{padding:3px 8px;font-size:10px;font-weight:700;letter-spacing:.06em;border-radius:3px;border:1px solid rgba(255,255,255,.2);background:transparent;color:var(--text-muted, #888);cursor:pointer;transition:all .15s;white-space:nowrap}.wave-view-btn:hover{background:#ffffff14;color:var(--text, #eee)}.wave-view-btn.active{background:#00ff7a26;color:#00ff7a;border-color:#00ff7a73;box-shadow:0 0 8px #00ff7a33}.pad.wave-view .pad-sample-number,.pad.wave-view .pad-header{display:none}.paywall-overlay{position:fixed;inset:0;background:#000000a6;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);z-index:900}.paywall-modal{position:fixed;top:50%;left:50%;transform:translate(-50%,-50%);z-index:901;background:#0f0f0f;border:1px solid #2a2a2a;border-radius:14px;width:min(700px,96vw);max-height:90vh;overflow-y:auto;padding:28px;box-shadow:0 24px 80px #000000b3;color:#e8e8e8;font-family:var(--font-mono, "IBM Plex Mono", monospace)}.paywall-header{display:flex;align-items:flex-start;justify-content:space-between;margin-bottom:20px;gap:12px}.paywall-title{font-size:1.25rem;font-weight:700;letter-spacing:.04em;text-transform:uppercase;color:#fff;margin:0 0 4px}.paywall-subtitle{font-size:.8rem;color:#888;margin:0}.paywall-close{background:none;border:1px solid #333;color:#888;border-radius:50%;width:28px;height:28px;cursor:pointer;font-size:.75rem;display:flex;align-items:center;justify-content:center;flex-shrink:0;transition:color .15s,border-color .15s}.paywall-close:hover{color:#fff;border-color:#666}.paywall-current-plan{display:flex;align-items:center;gap:14px;background:#2563eb1a;border:1px solid rgba(37,99,235,.3);border-radius:10px;padding:14px 18px;margin-bottom:20px}.paywall-plan-badge{font-size:.65rem;font-weight:700;letter-spacing:.08em;padding:3px 8px;border-radius:4px;flex-shrink:0}.paywall-plan-badge.pro{background:#2563eb;color:#fff}.paywall-plan-status{font-size:.8rem;color:#aaa;margin:0 0 6px}.paywall-portal-btn{background:none;border:1px solid #2563eb;color:#60a5fa;padding:6px 14px;border-radius:6px;font-size:.75rem;cursor:pointer;font-family:inherit;transition:background .15s}.paywall-portal-btn:hover:not(:disabled){background:#2563eb33}.paywall-plans{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin-bottom:18px}@media(max-width:540px){.paywall-plans{grid-template-columns:1fr}}.paywall-plan{background:#161616;border:1px solid #2a2a2a;border-radius:12px;padding:20px;display:flex;flex-direction:column;gap:16px}.paywall-plan.highlight{border-color:#2563eb;box-shadow:0 0 0 1px #2563eb4d inset}.paywall-plan.current{border-color:#22c55e}.plan-header{display:flex;align-items:flex-start;justify-content:space-between;gap:8px}.plan-name{font-size:.7rem;font-weight:700;letter-spacing:.1em;color:#888}.pro-plan .plan-name{color:#60a5fa}.plan-price{font-size:1.6rem;font-weight:700;color:#fff;line-height:1}.price-period{font-size:.75rem;color:#666}.plan-pricing{display:flex;flex-direction:column;align-items:flex-end;gap:6px}.price-note{font-size:.65rem;color:#666}.billing-toggle{display:flex;background:#1e1e1e;border:1px solid #333;border-radius:6px;overflow:hidden}.billing-btn{background:none;border:none;color:#666;padding:4px 8px;font-size:.65rem;font-family:inherit;cursor:pointer;display:flex;align-items:center;gap:4px;transition:color .15s,background .15s}.billing-btn.active{background:#2563eb;color:#fff}.save-badge{background:#15803d;color:#fff;font-size:.55rem;padding:1px 4px;border-radius:3px}.plan-features{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:7px;flex:1}.plan-features li{font-size:.75rem;display:flex;align-items:flex-start;gap:7px;line-height:1.4}.feat-yes:before{content:"✓";color:#22c55e;font-size:.7rem;margin-top:1px;flex-shrink:0}.feat-no{color:#444}.feat-no:before{content:"—";color:#333;font-size:.7rem;flex-shrink:0}.plan-ctas{display:flex;flex-direction:column;gap:8px}.paywall-stripe-btn{width:100%;background:#2563eb;color:#fff;border:none;padding:12px;border-radius:8px;font-size:.85rem;font-weight:700;font-family:inherit;cursor:pointer;letter-spacing:.04em;transition:background .15s,transform .1s}.paywall-stripe-btn:hover:not(:disabled){background:#1d4ed8;transform:translateY(-1px)}.paywall-stripe-btn:active:not(:disabled){transform:translateY(0)}.paywall-stripe-btn:disabled{opacity:.5;cursor:not-allowed}.paywall-moonpay-btn{width:100%;background:#1a1a2e;color:#a78bfa;border:1px solid #4c1d95;padding:10px;border-radius:8px;font-size:.78rem;font-weight:600;font-family:inherit;cursor:pointer;transition:background .15s}.paywall-moonpay-btn:hover:not(:disabled){background:#2a1a4e}.paywall-moonpay-btn:disabled{opacity:.5;cursor:not-allowed}.plan-current-label{font-size:.68rem;font-weight:700;letter-spacing:.08em;color:#888;text-align:center;text-transform:uppercase}.plan-current-label.pro{color:#2563eb}.paywall-signin-prompt{font-size:.75rem;color:#666;text-align:center;margin:0}.paywall-usage-note{font-size:.7rem;color:#555;line-height:1.5;border-top:1px solid #1e1e1e;padding-top:14px;margin:0 0 8px}.paywall-error{font-size:.75rem;color:#f87171;background:#ef44441a;border:1px solid rgba(239,68,68,.25);border-radius:6px;padding:8px 12px;margin-top:8px}.paywall-moonpay-frame{padding:0;overflow:hidden;width:min(480px,96vw);height:660px;display:flex;flex-direction:column}.paywall-moonpay-frame .paywall-header{padding:16px 20px;margin-bottom:0;border-bottom:1px solid #1e1e1e}.moonpay-iframe{flex:1;border:none;width:100%}.paywall-moonpay-note{font-size:.68rem;color:#555;text-align:center;padding:10px;margin:0;border-top:1px solid #1e1e1e}.gsm-overlay{position:fixed;inset:0;background:#000000b8;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);z-index:960}.gsm-modal{position:fixed;top:50%;left:50%;transform:translate(-50%,-50%);z-index:961;background:#0d0d0d;border:1px solid #2a2a2a;border-radius:16px;width:min(520px,96vw);max-height:90vh;overflow:hidden;display:flex;flex-direction:column;box-shadow:0 32px 100px #000c,0 0 0 1px #ffffff0a;color:#e8e8e8;font-family:var(--font-mono, "IBM Plex Mono", monospace)}.gsm-header{display:flex;align-items:center;justify-content:space-between;padding:18px 20px 14px;border-bottom:1px solid #1a1a1a;flex-shrink:0;gap:12px}.gsm-header-left{display:flex;align-items:center;gap:12px}.gsm-icon{font-size:1.5rem;line-height:1;flex-shrink:0}.gsm-title{font-size:.95rem;font-weight:700;color:#fff;margin:0 0 2px;letter-spacing:.02em}.gsm-subtitle{font-size:.65rem;color:#888;text-transform:uppercase;letter-spacing:.07em}.gsm-subtitle--warn{color:#f59e0b}.gsm-no-pad-warn{display:flex;align-items:flex-start;gap:8px;background:#f59e0b1a;border:1px solid rgba(245,158,11,.35);border-radius:8px;padding:10px 12px;font-size:.75rem;color:#fbbf24;line-height:1.45}.gsm-header-right{display:flex;align-items:center;gap:8px;flex-shrink:0}.gsm-pro-badge{font-size:.58rem;font-weight:700;letter-spacing:.1em;padding:2px 7px;border-radius:3px;background:#2563eb40;color:#60a5fa;border:1px solid rgba(37,99,235,.4)}.gsm-close-btn{background:none;border:1px solid #333;color:#666;width:28px;height:28px;border-radius:50%;cursor:pointer;font-size:.75rem;display:flex;align-items:center;justify-content:center;transition:color .15s,border-color .15s}.gsm-close-btn:hover{color:#fff;border-color:#666}.gsm-body{flex:1;overflow-y:auto;padding:18px 20px;display:flex;flex-direction:column;gap:16px}.gsm-section{display:flex;flex-direction:column;gap:8px}.gsm-label{font-size:.68rem;text-transform:uppercase;letter-spacing:.07em;color:#bbb;font-weight:700}.gsm-label-hint{font-size:.62rem;text-transform:none;letter-spacing:0;color:#999;font-weight:400}.gsm-type-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:6px}.gsm-type-btn{background:#111;border:1px solid #2a2a2a;border-radius:8px;padding:12px 6px 10px;cursor:pointer;display:flex;flex-direction:column;align-items:center;gap:7px;transition:all .15s;color:#888}.gsm-type-btn:hover{border-color:#555;background:#181818;color:#ccc}.gsm-type-btn.active{border-color:#2563eb;background:#2563eb24;color:#93c5fd}.gsm-type-icon{width:26px;height:26px;display:flex;align-items:center;justify-content:center;flex-shrink:0}.gsm-type-icon svg{width:26px;height:26px}.gsm-type-label{font-size:.62rem;text-transform:uppercase;letter-spacing:.07em;color:inherit;font-family:inherit;font-weight:600}.gsm-type-btn.active .gsm-type-label{color:#93c5fd}.gsm-textarea{background:#111;border:1px solid #2a2a2a;border-radius:8px;color:#e8e8e8;padding:10px 12px;font-size:.8rem;font-family:inherit;resize:vertical;outline:none;line-height:1.5;transition:border-color .15s}.gsm-textarea::placeholder{color:#444}.gsm-textarea:focus{border-color:#2563eb}.gsm-textarea:disabled{opacity:.5;cursor:not-allowed}.gsm-sliders{display:grid;grid-template-columns:1fr 1fr;gap:14px}@media(max-width:420px){.gsm-sliders{grid-template-columns:1fr}}.gsm-slider-group{display:flex;flex-direction:column;gap:6px}.gsm-slider-header{display:flex;justify-content:space-between;align-items:baseline}.gsm-slider-value{font-size:.8rem;color:#60a5fa;font-weight:700}.gsm-range{width:100%;height:18px;-webkit-appearance:none;appearance:none;background:transparent;cursor:pointer;outline:none;padding:0;margin:0}.gsm-range::-webkit-slider-runnable-track{height:6px;border-radius:3px;background:linear-gradient(to right,#2563eb 0%,#2563eb var(--fill-pct, 0%),rgba(255,255,255,.14) var(--fill-pct, 0%),rgba(255,255,255,.14) 100%);border:1px solid rgba(255,255,255,.1)}.gsm-range::-webkit-slider-thumb{-webkit-appearance:none;width:18px;height:18px;border-radius:50%;background:#fff;border:2.5px solid #2563eb;cursor:pointer;box-shadow:0 0 0 3px #2563eb40,0 2px 6px #00000080;margin-top:-7px;transition:border-color .15s,box-shadow .15s}.gsm-range::-webkit-slider-thumb:hover{border-color:#60a5fa;box-shadow:0 0 0 4px #3b82f659,0 2px 6px #00000080}.gsm-range::-moz-range-track{height:6px;border-radius:3px;background:#ffffff24;border:1px solid rgba(255,255,255,.1)}.gsm-range::-moz-range-progress{height:6px;border-radius:3px 0 0 3px;background:#2563eb}.gsm-range::-moz-range-thumb{width:16px;height:16px;border-radius:50%;background:#fff;border:2.5px solid #2563eb;cursor:pointer;box-shadow:0 0 0 3px #2563eb40,0 2px 6px #00000080;transition:border-color .15s,box-shadow .15s}.gsm-range:disabled{opacity:.4;cursor:not-allowed}.gsm-slider-ticks{display:flex;justify-content:space-between;font-size:.55rem;color:#888;letter-spacing:.04em}.gsm-gemini-row{background:#0f0f1a;border:1px solid #1e1e3a;border-radius:8px;padding:10px 12px;display:flex;flex-direction:column;gap:4px}.gsm-toggle-label{display:flex;align-items:center;gap:10px;cursor:pointer}.gsm-toggle-input{display:none}.gsm-toggle-track{width:32px;height:18px;background:#222;border-radius:9px;position:relative;flex-shrink:0;transition:background .2s}.gsm-toggle-input:checked+.gsm-toggle-track{background:#2563eb}.gsm-toggle-thumb{position:absolute;top:2px;left:2px;width:14px;height:14px;background:#fff;border-radius:50%;transition:transform .2s}.gsm-toggle-input:checked+.gsm-toggle-track .gsm-toggle-thumb{transform:translate(14px)}.gsm-toggle-text{font-size:.75rem;color:#ccc}.gsm-gemini-hint{font-size:.63rem;color:#888;padding-left:42px}.gsm-error{background:#ef444414;border:1px solid rgba(239,68,68,.3);border-radius:8px;padding:10px 12px;font-size:.75rem;color:#f87171;display:flex;align-items:flex-start;gap:8px}.gsm-error-icon{flex-shrink:0}.gsm-error-dismiss{background:none;border:none;color:#f87171;cursor:pointer;margin-left:auto;flex-shrink:0;padding:0;font-size:.75rem}.gsm-result{background:#0d1a0d;border:1px solid #1a3a1a;border-radius:10px;padding:14px;display:flex;flex-direction:column;gap:12px}.gsm-result-header{display:flex;align-items:center;gap:10px}.gsm-result-icon{font-size:1.3rem}.gsm-result-title{display:block;font-size:.82rem;font-weight:700;color:#22c55e}.gsm-result-info{display:block;font-size:.65rem;color:#555;text-transform:uppercase;letter-spacing:.06em}.gsm-result-prompt{background:#0a0a0a;border-radius:6px;padding:8px 10px;display:flex;flex-direction:column;gap:4px}.gsm-result-prompt-label{font-size:.6rem;text-transform:uppercase;letter-spacing:.07em;color:#60a5fa}.gsm-result-prompt-text{font-size:.72rem;color:#888;margin:0;line-height:1.5;font-style:italic}.gsm-result-actions{display:flex;gap:8px;flex-wrap:wrap}.gsm-preview-btn{background:#111;border:1px solid #333;color:#ccc;padding:7px 14px;border-radius:6px;font-size:.75rem;font-family:inherit;cursor:pointer;transition:all .15s}.gsm-preview-btn:hover{border-color:#555;color:#fff}.gsm-preview-btn.playing{border-color:#f59e0b;color:#f59e0b}.gsm-load-btn{background:#2563eb;border:none;color:#fff;padding:7px 16px;border-radius:6px;font-size:.75rem;font-weight:700;font-family:inherit;cursor:pointer;transition:background .15s;flex:1}.gsm-load-btn:hover{background:#1d4ed8}.gsm-retry-btn{background:none;border:1px solid #222;color:#555;padding:7px 10px;border-radius:6px;font-size:.75rem;font-family:inherit;cursor:pointer;transition:all .15s}.gsm-retry-btn:hover{color:#aaa;border-color:#444}.gsm-footer{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:14px 20px;border-top:1px solid #1a1a1a;flex-shrink:0;background:#0a0a0a}.gsm-footer-note{font-size:.62rem;color:#888;white-space:nowrap}.gsm-generate-btn{background:linear-gradient(135deg,#2563eb,#7c3aed);border:none;color:#fff;padding:9px 20px;border-radius:8px;font-size:.8rem;font-weight:700;font-family:inherit;cursor:pointer;transition:opacity .15s,transform .1s;display:flex;align-items:center;gap:8px;white-space:nowrap}.gsm-generate-btn:hover:not(:disabled){opacity:.9;transform:translateY(-1px)}.gsm-generate-btn:disabled{opacity:.4;cursor:not-allowed;transform:none}.gsm-spinner{display:inline-block;width:12px;height:12px;border:2px solid rgba(255,255,255,.3);border-top-color:#fff;border-radius:50%;animation:gsm-spin .7s linear infinite}@keyframes gsm-spin{to{transform:rotate(360deg)}}.pad-grid-container{display:flex;flex-direction:column;gap:4px;padding:6px;background:var(--surface, #f5f2eb);border-radius:6px;outline:none;width:100%;height:100%;overflow:hidden;box-sizing:border-box}.pad-grid-container:focus{box-shadow:inset 0 0 0 1px var(--accent, #2d5a4a)}.pad-controls-header{display:flex;align-items:center;justify-content:flex-start;gap:8px;padding:6px 12px;background:var(--surface, #f5f2eb);border-bottom:1px solid var(--background, #e8e4dc);flex-shrink:0;height:52px;min-height:52px}.pad-fill-controls{display:flex;align-items:center;gap:4px;flex-wrap:wrap}.fill-btn,.clear-btn,.ai-sound-btn,.wave-view-btn,.sort-btn,.library-toggle-header-btn{font-family:var(--font-mono, monospace);font-size:11px;font-weight:700;padding:5px 10px;height:30px;border:1px solid rgba(128,128,128,.3);border-radius:4px;cursor:pointer;text-transform:uppercase;letter-spacing:.3px;transition:all .15s ease;display:flex;align-items:center;justify-content:center;white-space:nowrap}.fill-btn{background:var(--accent, #2d5a4a);color:#fff}.fill-btn:hover{background:var(--accent-hover, #3d6a5a)}.clear-btn{background:var(--surface, #f5f2eb);color:var(--text, #1a1a1a)}.clear-btn:hover{background:#ffebeb;border-color:#dc3545;color:#dc3545}.ai-sound-btn{background:linear-gradient(135deg,#2563eb33,#7c3aed33);color:#a78bfa;border-color:#7c3aed59}.ai-sound-btn:hover{background:linear-gradient(135deg,#2563eb59,#7c3aed59);color:#c4b5fd;border-color:#7c3aed99}.sort-buttons{display:flex;gap:4px;flex-wrap:wrap}.sort-btn{background:var(--surface, #f5f2eb);color:var(--text-muted, #666)}.sort-btn:hover{background:var(--background, #e8e4dc);border-color:var(--secondary, #d35400);color:var(--text, #1a1a1a)}.sort-btn.active{background:var(--secondary, #d35400);color:#fff;border-color:var(--secondary, #d35400)}.pad-stats{font-family:var(--font-mono, monospace);font-size:12px;font-weight:700;color:var(--text-muted, #666);padding:5px 10px;height:30px;background:var(--surface, #f5f2eb);border:1px solid rgba(128,128,128,.3);border-radius:4px;display:flex;align-items:center}.library-toggle-header-btn{background:var(--secondary, #d35400);color:#fff;border-color:var(--secondary, #d35400);white-space:nowrap;margin-left:auto}.library-toggle-header-btn:hover{filter:brightness(1.1)}.drag-mode-indicator{display:flex;align-items:center;gap:6px;font-family:var(--font-mono, monospace);font-size:10px;color:var(--text-muted, #666666);padding:5px 10px;height:30px;background:var(--surface, #f5f2eb);border:1px solid rgba(128,128,128,.3);border-radius:4px}.key-cmd{display:flex;align-items:center;gap:3px;padding:2px 6px;border-radius:3px;transition:all .15s ease;color:var(--text-muted, #666)}.key-cmd.active{background:var(--secondary, #d35400);color:#fff}.key-symbol{font-size:14px;font-weight:700;line-height:1}.key-label{font-size:9px;font-weight:600;text-transform:uppercase;letter-spacing:.3px}.key-divider{color:var(--text-muted, #666);opacity:.4}.current-mode{font-weight:700;color:var(--accent, #2d5a4a);text-transform:uppercase;letter-spacing:.3px;margin-left:4px}.all-groups{display:grid;grid-template-columns:repeat(4,1fr);grid-template-rows:1fr;gap:4px;flex:1;min-height:0;overflow:hidden}.group-section{background:var(--background, #e8e4dc);border-radius:4px;padding:3px;border:1px solid var(--secondary, #d35400);display:flex;flex-direction:column;box-shadow:0 1px 3px #d3540026;min-height:0;min-width:0;overflow:hidden}.group-header{font-family:var(--font-mono, monospace);font-size:12px;font-weight:900;text-align:center;color:var(--secondary, #d35400);padding:2px 0;line-height:1;letter-spacing:.5px;flex-shrink:0}.pad-grid{display:grid;grid-template-columns:repeat(3,1fr);grid-auto-rows:1fr;gap:2px;flex:1;min-height:0;min-width:0;overflow:hidden;grid-template-rows:repeat(4,1fr)}@media(max-width:1100px){.pad-controls-header{height:48px;min-height:48px;padding:5px 10px}.fill-btn,.clear-btn,.sort-btn,.library-toggle-header-btn,.pad-stats{padding:4px 8px;font-size:10px;height:26px}}@media(max-width:900px){.pad-controls-header{height:44px;min-height:44px;padding:4px 8px;gap:4px}.fill-btn,.clear-btn,.sort-btn,.library-toggle-header-btn,.pad-stats{padding:3px 6px;font-size:9px;height:24px}.all-groups{grid-template-columns:repeat(2,1fr);grid-template-rows:repeat(2,1fr)}.group-header{font-size:11px}.drag-mode-indicator{font-size:8px;padding:3px 8px;gap:4px}.key-symbol{font-size:12px}.key-label{font-size:8px}.key-cmd{padding:1px 4px}}@media(max-width:500px){.pad-grid-container{padding:4px;gap:3px}.pad-controls-header{height:auto;min-height:auto;flex-wrap:wrap;padding:4px;gap:3px}.pad-fill-controls{width:100%;justify-content:center;flex-wrap:wrap}.sort-buttons{flex-wrap:wrap;justify-content:center}.fill-btn,.clear-btn,.sort-btn,.library-toggle-header-btn,.pad-stats{font-size:8px;padding:3px 5px;height:20px}.all-groups{grid-template-columns:repeat(2,1fr);grid-template-rows:repeat(2,1fr);gap:3px}.group-section{padding:2px}.group-header{font-size:9px;padding:1px 0}.pad-grid{gap:1px}.drag-mode-indicator{font-size:7px;padding:2px 4px;gap:3px}.key-symbol{font-size:10px}.key-label{font-size:6px}.key-cmd{padding:1px 3px}}.layer-toggle{display:flex;gap:2px;flex-shrink:0;background:var(--background);border:1px solid rgba(128,128,128,.3);border-radius:5px;padding:2px}.layer-btn{font-family:var(--font-mono, monospace);font-size:10px;font-weight:800;letter-spacing:.5px;padding:4px 10px;border-radius:3px;border:none;cursor:pointer;color:var(--text-muted);background:transparent;transition:all .12s ease;display:flex;align-items:center;gap:4px;position:relative}.layer-btn:hover{color:var(--text);background:#8080801f}.layer-btn.active,.layer-btn.ep.active{background:var(--secondary, #d35400);color:#fff}.layer-btn.ep.connected:not(.active){color:var(--secondary, #d35400);opacity:.8}.layer-ep-dot{width:5px;height:5px;border-radius:50%;background:#4ade80;animation:ep-pulse 2s ease-in-out infinite;flex-shrink:0}@keyframes ep-pulse{0%,to{opacity:1}50%{opacity:.4}}.ep-bank-nav{display:flex;align-items:center;gap:6px}.ep-bank-btn{font-size:11px;font-weight:700;width:24px;height:24px;border-radius:4px;border:1px solid rgba(128,128,128,.3);background:transparent;color:var(--text-muted);cursor:pointer;display:flex;align-items:center;justify-content:center;padding:0;transition:all .12s}.ep-bank-btn:hover:not(:disabled){border-color:#2563eb;color:#60a5fa}.ep-bank-btn:disabled{opacity:.3;cursor:not-allowed}.ep-bank-label{font-family:var(--font-mono, monospace);font-size:12px;font-weight:700;color:var(--text);letter-spacing:.3px;white-space:nowrap}.ep-bank-slots{color:var(--text-muted);font-weight:500}.ep-sync-info{font-size:11px;font-family:var(--font-mono, monospace)}.ep-syncing{color:#facc15}.ep-synced{color:#4ade80}.ep-disconnected{color:var(--text-muted)}.pad-stats.ep{color:#60a5fa}.all-groups.ep-layer{background:#2563eb0a;border-radius:6px;padding:4px}.ep-group-header{color:#60a5fa!important}.ep-pad{position:relative;display:flex;flex-direction:column;align-items:flex-start;justify-content:flex-start;padding:4px 5px;border-radius:4px;border:1px solid rgba(37,99,235,.2);background:#2563eb0f;cursor:pointer;transition:all .1s ease;min-height:52px;overflow:hidden;gap:1px}.ep-pad:hover{border-color:#2563eb80;background:#2563eb1f}.ep-pad.filled{border-color:#2563eb66;background:#2563eb1a}.ep-pad.filled:hover{border-color:#3b82f6;background:#3b82f633}.ep-pad.playing{border-color:#4ade80;background:#4ade8026;box-shadow:0 0 0 1px #4ade80}.ep-pad-slot{font-family:var(--font-mono, monospace);font-size:8px;font-weight:700;color:#60a5fa99;line-height:1}.ep-pad-name{font-size:9px;font-weight:600;color:var(--text);line-height:1.2;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:100%}.ep-pad-dur{font-family:var(--font-mono, monospace);font-size:8px;color:var(--text-muted);line-height:1}.ep-pad-empty-label{font-size:10px;color:#60a5fa4d;margin:auto;align-self:center;width:100%;text-align:center}.ep-pad-pull{position:absolute;top:3px;right:3px;width:16px;height:16px;border-radius:3px;border:1px solid rgba(74,222,128,.4);background:#4ade801a;color:#4ade80;font-size:10px;line-height:1;cursor:pointer;display:none;align-items:center;justify-content:center;padding:0;font-weight:700;transition:all .1s}.ep-pad:hover .ep-pad-pull{display:flex}.ep-pad-pull:hover{background:#4ade8040;border-color:#4ade80}.ep-device-switcher{display:flex;gap:3px;align-items:center;padding:0 4px;border-right:1px solid var(--surface, #ccc);margin-right:4px}.ep-device-tab{font-family:var(--font-mono, monospace);font-size:9px;font-weight:700;letter-spacing:.5px;padding:3px 7px;border:1px solid rgba(37,99,235,.3);border-radius:3px;background:transparent;color:#2563eb99;cursor:pointer;transition:all .12s ease;display:flex;align-items:center;gap:3px;white-space:nowrap}.ep-device-tab:hover{background:#2563eb14;border-color:#2563eb;color:#2563eb}.ep-device-tab.active{background:#2563eb;border-color:#2563eb;color:#fff}.ep-device-loading{font-size:10px;animation:ep-pulse 1s ease-in-out infinite}.key-mode-controls{display:flex;align-items:center;gap:4px;flex-wrap:wrap;margin-top:4px}.key-mode-btn{background:var(--surface);border:1px solid rgba(128,128,128,.35);color:var(--text);padding:4px 9px;border-radius:4px;font-size:10px;font-weight:700;letter-spacing:.08em;cursor:pointer;transition:background .1s,color .1s}.key-mode-btn:hover,.key-mode-btn.active{background:var(--secondary);color:var(--secondary-contrast,#fff);border-color:var(--secondary)}.key-mode-select{background:var(--surface);border:1px solid rgba(128,128,128,.3);color:var(--text);font-size:10px;border-radius:4px;padding:3px 5px;height:24px;cursor:pointer}.key-mode-scale{max-width:96px}.key-mode-octave{display:flex;align-items:center;gap:2px}.key-oct-btn{background:var(--surface);border:1px solid rgba(128,128,128,.3);color:var(--text);width:18px;height:20px;border-radius:3px;cursor:pointer;font-size:12px;display:flex;align-items:center;justify-content:center;line-height:1}.key-oct-btn:hover{background:var(--secondary);color:var(--secondary-contrast,#fff)}.key-oct-label{font-size:10px;font-weight:600;color:var(--text);min-width:22px;text-align:center}.key-mode-source-label{font-size:9px;color:var(--text-muted);margin-left:2px}.pad.key-mode-active:not(.key-mode-source){opacity:.82}.display.sound-edit-window{position:relative;display:flex;flex-direction:row;background:linear-gradient(180deg,#1a3d2e,#0d2a1f);border-radius:6px;padding:12px 16px;width:100%;height:100%;gap:16px;align-items:stretch;box-shadow:inset 0 1px 2px #0000004d,0 2px 8px #0003;min-height:140px}.display-expand-btn{position:absolute;top:6px;right:8px;display:flex;align-items:center;gap:4px;padding:3px 8px;font-family:var(--font-mono, monospace);font-size:9px;font-weight:700;letter-spacing:1px;background:#80808033;color:var(--secondary, #d35400);border:1px solid rgba(128,128,128,.35);border-radius:4px;cursor:pointer;z-index:10;transition:all .15s ease}.display-expand-btn:hover,.display-expand-btn.active{background:var(--secondary, #d35400);color:var(--secondary-contrast, #fff);border-color:var(--secondary, #d35400)}.display-waveform-container{flex:1;min-width:200px;display:flex;flex-direction:column}.display-waveform{position:relative;background:#000000bf;border-radius:4px;padding:8px;height:100%;min-height:140px;flex:1;border:1px solid rgba(74,222,128,.25)}.waveform-canvas{display:block;width:100%;height:100%}.waveform-placeholder{height:100%;display:flex;align-items:center;justify-content:center;color:#4ade80;font-family:var(--font-mono, monospace);font-size:11px;opacity:.4;text-transform:uppercase;letter-spacing:.5px}.waveform-markers{position:absolute;inset:8px;pointer-events:none}.marker{position:absolute;top:0;bottom:0;width:2px;pointer-events:auto;cursor:ew-resize;transition:none}.marker.in-marker{background:var(--secondary, #d35400);box-shadow:0 0 8px var(--secondary, #d35400)}.marker.out-marker{background:#3b82f6;box-shadow:0 0 8px #3b82f6}.marker.dragging{width:3px}.marker.in-marker.dragging{box-shadow:0 0 12px var(--secondary, #d35400)}.marker.out-marker.dragging{box-shadow:0 0 12px #3b82f6}.marker-handle{position:absolute;top:-18px;left:50%;transform:translate(-50%);font-family:var(--font-mono, monospace);font-size:9px;font-weight:700;padding:2px 4px;border-radius:2px;white-space:nowrap;pointer-events:auto;cursor:ew-resize}.in-marker .marker-handle{background:var(--secondary, #d35400);color:#fff}.out-marker .marker-handle{background:#3b82f6;color:#fff}.marker:hover .marker-handle,.marker.dragging .marker-handle{transform:translate(-50%) scale(1.1)}.selection-region{position:absolute;top:0;bottom:0;background:#4ade8026;border-left:none;border-right:none;pointer-events:none}.display-controls-panel{display:flex;flex-direction:column;gap:8px;min-width:320px;max-width:400px;flex-shrink:0}.display-info-row{display:flex;align-items:center;gap:12px;padding:6px 10px;background:#00000073;border:1px solid rgba(255,255,255,.1);border-radius:4px}.info-section{display:flex;align-items:center;gap:4px}.info-section.pad-info{flex-shrink:0}.info-label{font-family:var(--font-mono, monospace);font-size:9px;color:#fff;opacity:1;text-transform:uppercase;letter-spacing:.3px;font-weight:700}.info-value{font-family:var(--font-mono, monospace);font-size:11px;color:#fff;font-weight:700}.info-value.pad-indicator{background:#4ade80;color:#0d2a1f;padding:2px 8px;border-radius:3px;font-size:10px}.sample-name-section{flex:1;min-width:0}.sample-name{font-family:var(--font-mono, monospace);font-size:10px;color:#fff;font-weight:600;text-transform:uppercase;letter-spacing:.3px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.control-row{display:flex;gap:12px;padding:6px 10px;background:#00000073;border:1px solid rgba(255,255,255,.08);border-radius:4px;align-items:center}.control-group{display:flex;align-items:center;gap:6px;flex:1;min-width:0}.control-group.length-display{flex:0 0 auto;background:#4ade801a;padding:4px 8px;border-radius:3px}.control-row.envelope-row{background:#8b5cf633;border:1px solid rgba(167,139,250,.45)}.control-label{font-family:var(--font-mono, monospace);font-size:9px;font-weight:700;color:#fff;min-width:32px;flex-shrink:0;white-space:nowrap;letter-spacing:.5px}.control-slider{flex:1;height:6px;-webkit-appearance:none;appearance:none;background:#ffffff40;border-radius:3px;cursor:pointer;min-width:60px;border:1px solid rgba(255,255,255,.15)}.control-slider::-webkit-slider-thumb{-webkit-appearance:none;appearance:none;width:14px;height:14px;background:#4ade80;border-radius:50%;cursor:grab;box-shadow:0 1px 3px #0000004d;transition:transform .1s ease}.control-slider::-webkit-slider-thumb:hover{transform:scale(1.15)}.control-slider::-webkit-slider-thumb:active{cursor:grabbing}.control-slider:disabled{opacity:.3;cursor:not-allowed}.control-slider:disabled::-webkit-slider-thumb{cursor:not-allowed}.control-value{font-family:var(--font-mono, monospace);font-size:9px;color:#fff;font-weight:600;min-width:40px;text-align:right;flex-shrink:0;white-space:nowrap}.control-value.highlight{font-size:10px;font-weight:700;color:#4ade80}.actions-row{display:flex;gap:10px;justify-content:flex-end}.action-btn{padding:6px 14px;border:none;border-radius:4px;font-family:var(--font-mono, monospace);font-size:10px;font-weight:700;letter-spacing:.5px;cursor:pointer;transition:all .15s ease}.action-btn:disabled{opacity:.3;cursor:not-allowed}.oneshot-btn{background:#3b82f659;color:#bfdbfe;border:1px solid #3b82f6}.oneshot-btn:hover:not(:disabled){background:#3b82f68c;color:#fff}.oneshot-btn.active{background:#3b82f6;color:#fff;border-color:#93c5fd}.oneshot-btn.active:hover:not(:disabled){background:#2563eb}.reverse-btn{background:#8b5cf659;color:#ddd6fe;border:1px solid #8b5cf6}.reverse-btn:hover:not(:disabled){background:#8b5cf68c;color:#fff}.reverse-btn.active{background:#8b5cf6;color:#fff;border-color:#c4b5fd}.reverse-btn.active:hover:not(:disabled){background:#7c3aed}.preview-btn{background:#4ade80;color:#0d2a1f}.preview-btn:hover:not(:disabled){background:#22c55e;transform:scale(1.02)}.preview-btn:active:not(:disabled){transform:scale(.98)}.preview-btn.playing{background:#ef4444;color:#fff}.preview-btn.playing:hover:not(:disabled){background:#dc2626}.reset-btn{background:#9ca3af4d;color:#f3f4f6;border:1px solid rgba(209,213,219,.6)}.reset-btn:hover:not(:disabled){background:#9ca3af80;color:#fff}.remove-btn{background:#ef444459;color:#fecaca;border:1px solid #ef4444}.remove-btn:hover:not(:disabled){background:#ef4444;color:#fff}.device-status{display:flex;align-items:center;gap:6px;font-family:var(--font-mono, monospace);font-size:9px;color:#d1fae5;text-transform:uppercase;letter-spacing:.3px;padding:4px 10px;opacity:1;font-weight:600}.status-dot{width:6px;height:6px;border-radius:50%}.status-dot.connected{background:#4ade80;box-shadow:0 0 4px #4ade80;animation:pulse 2s infinite}.status-dot.disconnected{background:#ef4444;box-shadow:0 0 4px #ef4444}@media(max-width:900px){.display.sound-edit-window{flex-direction:column}.display-waveform-container{min-height:120px}.display-controls-panel{min-width:100%;max-width:100%}}@media(max-width:600px){.control-row{flex-wrap:wrap}.control-group{min-width:45%}}.lop-row{display:flex;align-items:center;gap:12px;flex-wrap:wrap;margin-top:2px}.lop-section,.mute-group-section{display:flex;align-items:center;gap:6px}.lop-buttons,.mute-group-buttons{display:flex;gap:3px}.lop-btn,.mg-btn{padding:3px 7px;font-size:10px;font-weight:700;letter-spacing:.05em;border-radius:3px;border:1px solid rgba(255,255,255,.15);background:transparent;color:var(--text-muted, #888);cursor:pointer;transition:background .12s,color .12s;line-height:1.4}.lop-btn:hover:not(:disabled),.mg-btn:hover:not(:disabled){background:#ffffff14;color:var(--text, #eee)}.lop-btn:disabled,.mg-btn:disabled{opacity:.35;cursor:default}.lop-btn.active{background:#ffffff26;color:var(--text, #eee);border-color:#ffffff59}.lop-btn.lop-loop.active{background:#ff8c0040;color:#ff8c00;border-color:#ff8c00;box-shadow:0 0 6px #ff8c004d}.lop-btn.lop-gate.active{background:#60c8ff33;color:#60c8ff;border-color:#60c8ff}.mg-btn.mg-1.active{background:#ff575766;color:#fff;border-color:#ff5757}.mg-btn.mg-2.active{background:#57d6ff66;color:#000;border-color:#57d6ff}.mg-btn.mg-3.active{background:#57ff8c66;color:#000;border-color:#57ff8c}.mg-btn.mg-4.active{background:#d657ff66;color:#fff;border-color:#d657ff}.mg-btn.mg-off.active{background:#ffffff1a;color:var(--text, #eee);border-color:#ffffff4d}.ai-cat-overlay{position:fixed;inset:0;background:#0009;display:flex;align-items:center;justify-content:center;z-index:1000;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px)}.ai-cat-modal{background:var(--surface, #f5f2eb);border-radius:12px;width:95%;max-width:700px;max-height:85vh;overflow:hidden;display:flex;flex-direction:column;box-shadow:0 8px 32px #0000004d;border:2px solid var(--secondary, #d35400)}.ai-cat-header{display:flex;justify-content:space-between;align-items:center;padding:16px 20px;background:var(--secondary, #d35400);color:#fff}.ai-cat-header h2{margin:0;font-size:16px;font-weight:700;font-family:var(--font-mono, monospace);text-transform:uppercase;letter-spacing:.5px}.ai-cat-close{background:none;border:none;color:#fff;font-size:24px;cursor:pointer;padding:0;line-height:1;opacity:.8;transition:opacity .2s}.ai-cat-close:hover{opacity:1}.ai-cat-content{padding:20px;overflow-y:auto;display:flex;flex-direction:column;gap:16px;flex:1}.ai-cat-processing{display:flex;flex-direction:column;align-items:center;padding:40px 20px;gap:20px}.ai-cat-spinner{width:40px;height:40px;border:3px solid var(--background, #e8e4dc);border-top-color:var(--secondary, #d35400);border-radius:50%;animation:ai-spin .8s linear infinite}@keyframes ai-spin{to{transform:rotate(360deg)}}.ai-cat-progress-info{display:flex;flex-direction:column;align-items:center;gap:8px;width:100%;max-width:300px}.ai-cat-progress-text{font-family:var(--font-mono, monospace);font-size:12px;color:var(--text-muted, #666)}.ai-cat-progress-bar{width:100%;height:6px;background:var(--background, #e8e4dc);border-radius:3px;overflow:hidden}.ai-cat-progress-fill{height:100%;background:var(--secondary, #d35400);transition:width .3s ease}.ai-cat-progress-count{font-family:var(--font-mono, monospace);font-size:14px;font-weight:700;color:var(--text, #1a1a1a)}.ai-cat-error{display:flex;align-items:center;gap:12px;padding:16px;background:#e74c3c1a;border:1px solid #e74c3c;border-radius:8px}.ai-cat-error-icon{width:24px;height:24px;background:#e74c3c;color:#fff;border-radius:50%;display:flex;align-items:center;justify-content:center;font-weight:700;flex-shrink:0}.ai-cat-error-text{flex:1;font-size:12px;color:#c0392b}.ai-cat-retry-btn{padding:6px 12px;background:#e74c3c;color:#fff;border:none;border-radius:4px;font-family:var(--font-mono, monospace);font-size:11px;font-weight:700;cursor:pointer;text-transform:uppercase}.ai-cat-retry-btn:hover{background:#c0392b}.ai-cat-stats{display:flex;gap:16px;font-family:var(--font-mono, monospace);font-size:11px;color:var(--text-muted, #666)}.ai-cat-stats span{display:flex;align-items:center;gap:6px}.ai-cat-stats span:nth-child(1):before{content:"";width:8px;height:8px;background:#27ae60;border-radius:50%}.ai-cat-stats span:nth-child(2):before{content:"";width:8px;height:8px;background:#f39c12;border-radius:50%}.ai-cat-stats span:nth-child(3):before{content:"";width:8px;height:8px;background:#e74c3c;border-radius:50%}.ai-cat-th-play{width:32px;padding:6px 4px!important}.ai-cat-play{width:32px;padding:4px!important;text-align:center}.ai-cat-play-btn{width:24px;height:24px;border-radius:50%;border:1px solid var(--secondary, #d35400);background:transparent;color:var(--secondary, #d35400);cursor:pointer;font-size:8px;display:inline-flex;align-items:center;justify-content:center;transition:all .15s;padding:0;line-height:1}.ai-cat-play-btn:hover:not(:disabled){background:var(--secondary, #d35400);color:#fff}.ai-cat-play-btn.playing{background:var(--secondary, #d35400);color:#fff}.ai-cat-play-btn:disabled{opacity:.3;cursor:not-allowed;border-color:#999;color:#999}.ai-cat-results{flex:1;overflow-y:auto;border:1px solid var(--background, #e8e4dc);border-radius:8px;max-height:400px}.ai-cat-table{width:100%;border-collapse:collapse;font-family:var(--font-mono, monospace);font-size:11px}.ai-cat-table th,.ai-cat-table td{padding:10px 12px;text-align:left;border-bottom:1px solid var(--background, #e8e4dc)}.ai-cat-table th{background:var(--background, #e8e4dc);font-weight:700;text-transform:uppercase;color:var(--text-muted, #666);font-size:10px;position:sticky;top:0}.ai-cat-table tbody tr:hover{background:#d354000d}.ai-cat-filename{max-width:200px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:var(--text, #1a1a1a)}.ai-cat-select{padding:4px 8px;border:1px solid var(--background, #e8e4dc);border-radius:4px;font-family:var(--font-mono, monospace);font-size:10px;background:var(--surface);cursor:pointer;font-weight:600}.ai-cat-select:focus{outline:none;border-color:var(--secondary, #d35400)}.ai-cat-source{display:inline-block;padding:2px 6px;border-radius:3px;font-size:9px;font-weight:700}.ai-cat-source-pattern{background:#2d5a4a26;color:var(--accent, #2d5a4a)}.ai-cat-source-ai{background:#d3540026;color:var(--secondary, #d35400)}.ai-cat-source-audio{background:#3498db26;color:#3498db}.ai-cat-confidence{font-weight:700;font-size:10px}.ai-cat-actions{display:flex;justify-content:flex-end;gap:12px;padding-top:16px;border-top:1px solid var(--background, #e8e4dc)}.ai-cat-btn{padding:10px 20px;border:none;border-radius:6px;font-family:var(--font-mono, monospace);font-size:12px;font-weight:700;text-transform:uppercase;cursor:pointer;transition:all .2s}.ai-cat-btn.primary{background:var(--secondary, #d35400);color:#fff}.ai-cat-btn.primary:hover{filter:brightness(1.1)}.ai-cat-btn.secondary{background:var(--background, #e8e4dc);color:var(--text, #1a1a1a)}.ai-cat-btn.secondary:hover{background:var(--accent, #2d5a4a);color:#fff}.ai-cat-empty{text-align:center;padding:40px;color:var(--text-muted, #666)}@media(max-width:600px){.ai-cat-modal{max-height:95vh;border-radius:8px}.ai-cat-table th:nth-child(4),.ai-cat-table td:nth-child(4){display:none}.ai-cat-filename{max-width:120px}.ai-cat-actions{flex-direction:column}.ai-cat-btn{width:100%}}.ai-settings-overlay{position:fixed;inset:0;background:#0009;display:flex;align-items:center;justify-content:center;z-index:1000;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px)}.ai-settings-modal{background:var(--surface, #f5f2eb);border-radius:12px;width:90%;max-width:500px;max-height:85vh;overflow:hidden;display:flex;flex-direction:column;box-shadow:0 8px 32px #0000004d;border:2px solid var(--secondary, #d35400)}.ai-settings-header{display:flex;justify-content:space-between;align-items:center;padding:16px 20px;background:var(--secondary, #d35400);color:#fff}.ai-settings-header h2{margin:0;font-size:16px;font-weight:700;font-family:var(--font-mono, monospace);text-transform:uppercase;letter-spacing:.5px}.ai-settings-close{background:none;border:none;color:#fff;font-size:24px;cursor:pointer;padding:0;line-height:1;opacity:.8;transition:opacity .2s}.ai-settings-close:hover{opacity:1}.ai-settings-content{padding:20px;overflow-y:auto;display:flex;flex-direction:column;gap:20px}.ai-settings-section{display:flex;flex-direction:column;gap:8px}.ai-settings-label{font-family:var(--font-mono, monospace);font-size:11px;font-weight:700;text-transform:uppercase;color:var(--text-muted, #666);letter-spacing:.5px}.ai-provider-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:8px}.ai-provider-btn{display:flex;flex-direction:column;align-items:flex-start;padding:12px;border:2px solid var(--background, #e8e4dc);border-radius:8px;background:var(--surface);cursor:pointer;transition:all .2s;text-align:left}.ai-provider-btn:hover{border-color:var(--secondary, #d35400)}.ai-provider-btn.active{border-color:var(--secondary, #d35400);background:#d354001a}.ai-provider-btn .provider-name{font-family:var(--font-mono, monospace);font-size:12px;font-weight:700;color:var(--text, #1a1a1a)}.ai-provider-btn .provider-desc{font-size:10px;color:var(--text-muted, #666);margin-top:2px}.ai-api-key-input{display:flex;gap:8px}.ai-input{flex:1;padding:10px 12px;border:2px solid var(--background, #e8e4dc);border-radius:6px;font-family:var(--font-mono, monospace);font-size:12px;background:var(--surface);transition:border-color .2s}.ai-input:focus{outline:none;border-color:var(--secondary, #d35400)}.ai-toggle-visibility{background:var(--background, #e8e4dc);border:none;border-radius:6px;padding:0 12px;cursor:pointer;font-size:14px;transition:background .2s}.ai-toggle-visibility:hover{background:var(--secondary, #d35400)}.ai-api-key-actions{display:flex;gap:8px}.ai-btn{padding:8px 16px;border:none;border-radius:6px;font-family:var(--font-mono, monospace);font-size:11px;font-weight:700;text-transform:uppercase;cursor:pointer;transition:all .2s}.ai-btn.primary{background:var(--secondary, #d35400);color:#fff}.ai-btn.primary:hover:not(:disabled){filter:brightness(1.1)}.ai-btn.secondary{background:var(--background, #e8e4dc);color:var(--text, #1a1a1a)}.ai-btn.secondary:hover:not(:disabled){background:var(--accent, #2d5a4a);color:#fff}.ai-btn:disabled{opacity:.5;cursor:not-allowed}.ai-test-result{padding:8px 12px;border-radius:6px;font-family:var(--font-mono, monospace);font-size:11px}.ai-test-result.success{background:#27ae6026;color:#27ae60;border:1px solid #27ae60}.ai-test-result.error{background:#e74c3c26;color:#e74c3c;border:1px solid #e74c3c}.ai-select{padding:10px 12px;border:2px solid var(--background, #e8e4dc);border-radius:6px;font-family:var(--font-mono, monospace);font-size:12px;background:var(--surface);cursor:pointer}.ai-select:focus{outline:none;border-color:var(--secondary, #d35400)}.ai-toggle-row{display:flex;justify-content:space-between;align-items:center;padding:8px 0}.ai-toggle-label{font-size:12px;color:var(--text, #1a1a1a)}.ai-toggle{width:48px;height:26px;background:var(--background, #e8e4dc);border:none;border-radius:13px;cursor:pointer;position:relative;transition:background .2s}.ai-toggle.active{background:var(--secondary, #d35400)}.ai-toggle-slider{position:absolute;top:3px;left:3px;width:20px;height:20px;background:var(--surface);border-radius:50%;transition:transform .2s;box-shadow:0 2px 4px #0003}.ai-toggle.active .ai-toggle-slider{transform:translate(22px)}.ai-settings-hint{font-size:10px;color:var(--text-muted, #666);margin:0;line-height:1.4}.ai-settings-info{background:#2d5a4a1a;border:1px solid var(--accent, #2d5a4a);border-radius:8px;padding:16px}.ai-settings-info h4{margin:0 0 12px;font-family:var(--font-mono, monospace);font-size:12px;font-weight:700;color:var(--accent, #2d5a4a);text-transform:uppercase}.ai-settings-info ol{margin:0 0 12px;padding-left:20px;font-size:11px;color:var(--text, #1a1a1a);line-height:1.6}.ai-settings-info p{margin:0;font-size:10px;color:var(--text-muted, #666);font-style:italic}@media(max-width:500px){.ai-provider-grid{grid-template-columns:1fr}.ai-settings-modal{max-height:95vh;border-radius:8px}}.device-browser{display:flex;flex-direction:column;height:100%;background:var(--surface, #f5f2eb);border-radius:4px;overflow:hidden}.device-browser-header{display:flex;justify-content:space-between;align-items:center;padding:8px 12px;background:var(--primary, #1a1a1a);color:var(--surface, #f5f2eb);font-size:11px;font-weight:600;letter-spacing:.5px}.device-browser-close{background:none;border:none;color:var(--surface, #f5f2eb);font-size:16px;cursor:pointer;padding:0 4px;opacity:.7;transition:opacity .15s}.device-browser-close:hover{opacity:1}.device-connection{display:flex;align-items:center;gap:8px;padding:6px 8px;background:var(--surface, #f5f2eb);border-bottom:1px solid var(--background, #e8e4dc)}.connect-btn{padding:4px 12px;font-size:10px;font-weight:600;background:var(--secondary, #d35400);border:1px solid transparent;color:#fff!important;cursor:pointer;border-radius:3px;transition:all .15s}.connect-btn.connected{background:var(--accent, #2d5a4a);color:#fff!important}.connect-btn:disabled{opacity:.65;cursor:not-allowed;color:#fff!important}.device-status{font-size:10px;color:var(--accent, #2d5a4a);font-weight:600}.device-error{font-size:9px;color:#c0392b;margin-left:auto}.device-not-connected{flex:1;display:flex;align-items:center;justify-content:center;padding:24px}.connect-prompt{display:flex;flex-direction:column;align-items:center;gap:12px;text-align:center;padding:24px;background:var(--background, #e8e4dc);border-radius:8px;max-width:280px}.connect-icon{font-size:32px}.connect-text{font-size:13px;font-weight:600;color:var(--text, #1a1a1a)}.connect-hint{font-size:11px;color:var(--text-muted, #666)}.bank-page-nav{display:flex;align-items:center;justify-content:center;gap:12px;padding:6px;background:var(--background, #e8e4dc)}.bank-page-btn{width:28px;height:24px;font-size:12px;background:var(--surface, #f5f2eb);border:1px solid var(--primary, #1a1a1a);color:var(--primary, #1a1a1a);cursor:pointer;border-radius:3px;transition:all .15s}.bank-page-btn:hover:not(:disabled){background:var(--primary, #1a1a1a);color:var(--surface, #f5f2eb)}.bank-page-btn:disabled{opacity:.3;cursor:not-allowed}.bank-page-label{font-size:10px;font-weight:600;color:var(--text, #1a1a1a);letter-spacing:.5px}.bank-selector{display:grid;grid-template-columns:repeat(10,1fr);gap:2px;padding:4px 6px;background:var(--surface, #f5f2eb)}.bank-btn{padding:4px 0;font-size:9px;font-weight:600;font-family:var(--font-mono, monospace);background:var(--background, #e8e4dc);border:1px solid transparent;color:var(--text-muted, #666);cursor:pointer;transition:all .15s}.bank-btn:hover{background:var(--secondary, #d35400);color:#fff}.bank-btn.active{background:var(--primary, #1a1a1a);color:var(--surface, #f5f2eb)}.current-bank-label{text-align:center;padding:4px;font-size:10px;font-weight:600;color:var(--text-muted, #666);background:var(--surface, #f5f2eb);border-bottom:1px solid var(--background, #e8e4dc);letter-spacing:.5px}.device-slots{flex:1;overflow-y:auto;display:flex;flex-direction:column;gap:2px;padding:4px}.device-slot:hover{background:var(--surface, #f5f2eb);border-color:var(--secondary, #d35400)}.device-slot.filled{background:var(--surface, #f5f2eb);border-color:var(--pad-filled, #d35400);border-left:3px solid var(--pad-filled, #d35400)}.device-slot.empty{opacity:.6;cursor:default}.device-slot.drop-over{background:var(--secondary, #d35400);border-color:var(--secondary, #d35400)}.device-slot.drop-over *{color:#fff!important}.device-slot.dragging{opacity:.5}.slot-number{font-size:10px;font-weight:700;font-family:var(--font-mono, monospace);color:var(--text-muted, #666)}.device-slot.filled .slot-number{color:var(--secondary, #d35400)}.slot-name{font-size:11px;font-weight:500;color:var(--text, #1a1a1a);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.device-slot.empty .slot-name{color:var(--text-muted, #666)}.slot-duration{font-size:9px;font-family:var(--font-mono, monospace);color:var(--text-muted, #666);text-align:right}.transfer-progress{padding:4px 8px 6px;background:var(--surface, #f5f2eb);border-bottom:1px solid var(--background, #e8e4dc)}.transfer-progress-label{display:flex;justify-content:space-between;font-size:9px;font-weight:600;color:var(--text, #1a1a1a);margin-bottom:3px}.transfer-progress-size{color:var(--text-muted, #666);font-weight:400}.transfer-progress-bar{height:4px;background:var(--background, #e8e4dc);border-radius:2px;overflow:hidden}.transfer-progress-fill{height:100%;background:var(--secondary, #d35400);border-radius:2px;transition:width .3s ease}.slot-actions{display:flex;align-items:center;gap:2px;justify-content:flex-end}.slot-action-btn{width:20px;height:20px;padding:0;font-size:12px;font-weight:700;line-height:20px;text-align:center;border:1px solid var(--text-muted, #999);border-radius:3px;cursor:pointer;transition:all .12s ease;background:var(--background, #e8e4dc);color:var(--text, #1a1a1a)}.slot-action-btn.download-btn:hover{background:var(--accent, #2d5a4a);border-color:var(--accent, #2d5a4a);color:#fff}.slot-action-btn.delete-btn:hover{background:#e74c3c;border-color:#e74c3c;color:#fff}.slot-audio-badge{font-size:11px;color:var(--accent, #2d5a4a);font-weight:700}.slot-size{font-size:8px;font-family:var(--font-mono, monospace);color:var(--text-muted, #666);min-width:28px;text-align:right}.device-slot.busy{opacity:.7;pointer-events:none}.slot-busy-label{font-size:9px;font-weight:600;color:var(--secondary, #d35400);animation:pulse-opacity 1s ease-in-out infinite}@keyframes pulse-opacity{0%,to{opacity:1}50%{opacity:.4}}.slot-error-label{font-size:9px;color:#e74c3c;font-weight:600}.device-slot.has-audio{border-left:3px solid var(--accent, #2d5a4a)}.device-slot.has-audio .slot-number{color:var(--accent, #2d5a4a)}.device-slot{display:grid;grid-template-columns:36px 1fr auto;gap:4px;align-items:center;padding:6px 8px;background:var(--background, #e8e4dc);border:1px solid transparent;border-radius:3px;cursor:pointer;transition:all .15s}.device-browser-footer{display:flex;justify-content:center;gap:8px;padding:6px;font-size:9px;color:var(--text-muted, #666);background:var(--background, #e8e4dc);border-top:1px solid var(--surface, #f5f2eb)}.library{display:flex;flex-direction:column;background:var(--surface);border-radius:8px;box-shadow:0 4px 12px #00000014;overflow:hidden;min-width:0;height:100%;outline:none}.library:focus{box-shadow:0 4px 12px #00000014,0 0 0 2px var(--accent, #2ecc71)}.library-header{display:flex;justify-content:flex-end;align-items:center;gap:8px;padding:6px 12px;background:var(--surface, #f5f2eb);border-bottom:1px solid var(--background, #e8e4dc);flex-shrink:0;height:52px;min-height:52px;position:sticky;top:0;z-index:10}.library-header h3{font-family:var(--font-mono, monospace);font-size:12px;font-weight:700;letter-spacing:.5px;margin:0;color:var(--text, #1a1a1a);white-space:nowrap}.library-source-toggle{display:flex;gap:4px;flex-wrap:nowrap}.source-btn{padding:5px 10px;height:30px;border:1px solid rgba(128,128,128,.3);border-radius:4px;background:var(--surface, #f5f2eb);color:var(--text, #1a1a1a);font-family:var(--font-mono, monospace);font-size:11px;font-weight:700;letter-spacing:.3px;text-transform:uppercase;cursor:pointer;transition:all .15s ease;display:flex;align-items:center;justify-content:center;white-space:nowrap}.source-btn:hover{background:var(--background, #e8e4dc);border-color:var(--secondary, #d35400)}.source-btn.active{background:var(--secondary, #d35400);color:var(--secondary-contrast, #fff);border-color:var(--secondary, #d35400)}.source-btn.ep-connected:not(.active){color:var(--secondary, #d35400);border-color:var(--secondary, #d35400);background:var(--background, #e8e4dc)}.source-btn.ep-connected:not(.active):hover{background:var(--surface, #f5f2eb);border-color:var(--secondary, #d35400)}.source-btn.ep-connected.active{background:var(--secondary, #d35400);border-color:var(--secondary, #d35400);color:var(--secondary-contrast, #fff)}.ep-btn-count{display:inline-flex;align-items:center;justify-content:center;min-width:14px;height:14px;padding:0 3px;margin-left:3px;background:var(--secondary, #d35400);color:var(--secondary-contrast, #fff);font-size:8px;font-weight:900;border-radius:7px;vertical-align:middle;line-height:1}.source-btn.ep-connected.active .ep-btn-count{background:#ffffff4d}.source-btn.video-btn.active{background:var(--accent, #2d5a4a);border-color:var(--accent, #2d5a4a)}.library-content{display:flex;flex:1;overflow:hidden;min-height:0;margin:6px 8px 0}.library-list{flex:1;overflow-y:auto;border-right:1px solid var(--background, #f5f5f0);display:grid;grid-template-columns:repeat(auto-fill,minmax(160px,1fr));gap:2px;padding:4px;align-content:start}.library-empty{padding:24px;text-align:center;color:var(--text-muted, #666666);font-family:var(--font-mono, monospace);font-size:12px;grid-column:1 / -1}.library-item{display:grid;grid-template-columns:28px 1fr 40px;gap:4px;padding:5px 6px;cursor:grab;border:1px solid var(--background, #f5f5f0);border-radius:4px;transition:background .1s ease;align-items:center;touch-action:none;-webkit-user-select:none;user-select:none;background:var(--surface)}.library-item:hover{background:var(--background, #f5f5f0)}.library-item.selected{background:var(--secondary, #d35400);color:#fff}.library-item.dragging{opacity:.5;cursor:grabbing}.item-number{font-family:var(--font-mono, monospace);font-size:11px;opacity:.7}.item-name{font-family:var(--font-mono, monospace);font-size:11px;font-weight:600;text-transform:uppercase;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.item-duration,.item-size{font-family:var(--font-mono, monospace);font-size:10px;opacity:.6;text-align:right}.library-categories{display:flex;flex-direction:column;padding:2px;gap:0;background:var(--background, #f5f5f0);overflow:hidden;flex-shrink:0;height:100%}.category-btn{display:flex;flex-direction:row;align-items:center;justify-content:space-between;padding:4px 6px;border:none;border-radius:3px;background:transparent;cursor:pointer;transition:all .15s ease;text-align:left;flex:1;min-height:0;color:var(--text, #1a1a1a)}.category-btn:hover{background:var(--surface)}.category-btn.active{background:var(--secondary, #d35400);color:#fff}.category-label{font-family:var(--font-mono, monospace);font-size:10px;font-weight:700;letter-spacing:.3px;color:inherit}.category-range{font-family:var(--font-mono, monospace);font-size:9px;opacity:.8;margin-left:4px;color:inherit}.library-footer{display:flex;justify-content:space-between;align-items:center;gap:8px;padding:3px 8px;margin:0 8px;background:var(--background, #f5f5f0);border-radius:4px;font-family:var(--font-mono, monospace);font-size:7px;color:var(--text-muted, #666666);text-transform:uppercase;letter-spacing:.3px}.upload-cloud-btn{padding:4px 8px;font-family:var(--font-mono, monospace);font-size:8px;font-weight:700;background:linear-gradient(135deg,#3b82f6,#1d4ed8);color:#fff;border:none;border-radius:4px;cursor:pointer;transition:all .15s ease;text-transform:uppercase}.upload-cloud-btn:hover:not(:disabled){background:linear-gradient(135deg,#2563eb,#1e40af);transform:scale(1.05)}.upload-cloud-btn:disabled{opacity:.6;cursor:not-allowed}.library-formats{display:flex;justify-content:center;padding:2px 8px;margin:0 8px 8px;background:var(--background, #f5f5f0);border-radius:4px;font-family:var(--font-mono, monospace);font-size:6px;color:var(--text-muted, #666666);text-transform:uppercase;letter-spacing:.3px}.library-list::-webkit-scrollbar,.library-categories::-webkit-scrollbar{width:6px}.library-list::-webkit-scrollbar-track,.library-categories::-webkit-scrollbar-track{background:var(--background, #f5f5f0)}.library-list::-webkit-scrollbar-thumb,.library-categories::-webkit-scrollbar-thumb{background:var(--text-muted, #666666);border-radius:3px}.library-list::-webkit-scrollbar-thumb:hover,.library-categories::-webkit-scrollbar-thumb:hover{background:var(--primary, #1a1a1a)}.source-btn.sys-btn{background:var(--accent, #2d5a4a);color:#fff;border-color:var(--accent, #2d5a4a)}.source-btn.sys-btn:not(.active){background:var(--surface);color:var(--accent, #2d5a4a);border-color:var(--accent, #2d5a4a)}.sys-panel{display:flex;flex-direction:column;margin:6px 8px 0;background:var(--background, #f5f5f0);border-radius:6px;overflow:hidden;flex:1;min-height:0}.sys-panel-header{display:flex;justify-content:space-between;align-items:center;padding:8px 12px;background:var(--accent, #2d5a4a);color:#fff;font-family:var(--font-mono, monospace);font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:.5px}.sys-panel-close{background:none;border:none;color:#fff;font-size:16px;cursor:pointer;opacity:.8;transition:opacity .15s ease}.sys-panel-close:hover{opacity:1}.sys-admin-section{padding:10px 12px;border-bottom:1px solid rgba(128,128,128,.25);background:#2d5a4a1a}.sys-admin-header{font-family:var(--font-mono, monospace);font-size:9px;font-weight:700;text-transform:uppercase;color:var(--accent, #2d5a4a);margin-bottom:8px}.sys-add-bank{display:flex;gap:8px}.sys-bank-name-input{flex:1;padding:6px 10px;border:1px solid rgba(128,128,128,.35);border-radius:4px;font-family:var(--font-mono, monospace);font-size:11px;background:var(--surface);color:var(--text)}.sys-bank-name-input:focus{outline:none;border-color:var(--accent, #2d5a4a)}.sys-upload-btn{padding:6px 12px;background:var(--accent, #2d5a4a);color:#fff;border:none;border-radius:4px;font-family:var(--font-mono, monospace);font-size:10px;font-weight:700;cursor:pointer;transition:all .15s ease;white-space:nowrap}.sys-upload-btn:hover:not(:disabled){filter:brightness(1.1)}.sys-upload-btn:disabled{opacity:.5;cursor:not-allowed}.sys-banks-list{flex:1;overflow-y:auto;padding:8px}.sys-empty{padding:24px;text-align:center;color:var(--text-muted, #666);font-family:var(--font-mono, monospace);font-size:11px}.sys-bank-item{display:flex;justify-content:space-between;align-items:center;padding:10px 12px;background:var(--surface);border-radius:4px;margin-bottom:6px}.sys-bank-info{display:flex;flex-direction:column;gap:2px}.sys-bank-name{font-family:var(--font-mono, monospace);font-size:12px;font-weight:700;color:var(--text, #1a1a1a)}.sys-bank-count{font-family:var(--font-mono, monospace);font-size:9px;color:var(--text-muted, #666)}.sys-bank-actions{display:flex;gap:6px}.sys-load-btn{padding:5px 12px;background:var(--secondary, #d35400);color:#fff;border:none;border-radius:4px;font-family:var(--font-mono, monospace);font-size:10px;font-weight:700;cursor:pointer;transition:all .15s ease}.sys-load-btn:hover{filter:brightness(1.1)}.sys-delete-btn{width:24px;height:24px;background:#e74c3c;color:#fff;border:none;border-radius:4px;font-size:14px;cursor:pointer;transition:all .15s ease;display:flex;align-items:center;justify-content:center}.sys-delete-btn:hover{filter:brightness(1.1)}.source-btn.video-btn{background:#9b59b6;color:#fff;border-color:#9b59b6}.source-btn.video-btn:not(.active){background:var(--surface);color:#9b59b6;border-color:#9b59b6}.source-btn.video-btn.active{background:#8e44ad;border-color:#8e44ad}.source-btn.ai-btn{background:linear-gradient(135deg,#e74c3c,#f39c12);color:#fff;border-color:#e74c3c;font-weight:700}.source-btn.ai-btn:hover{filter:brightness(1.1);border-color:#c0392b}.source-btn.ai-settings-btn{background:var(--background, #e8e4dc);color:var(--text-muted, #666);border-color:#8080804d;font-size:14px;padding:5px 8px;min-width:30px}.source-btn.ai-settings-btn:hover{background:var(--secondary, #d35400);color:#fff;border-color:var(--secondary, #d35400)}.video-library-panel{display:flex;flex-direction:column;margin:6px 8px 0;background:var(--background, #f5f5f0);border-radius:6px;overflow:hidden;flex:1;min-height:0}.video-panel-header{display:flex;justify-content:space-between;align-items:center;padding:8px 12px;background:#9b59b6;color:#fff;font-family:var(--font-mono, monospace);font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:.5px}.video-panel-close{background:none;border:none;color:#fff;font-size:16px;cursor:pointer;opacity:.8;transition:opacity .15s ease}.video-panel-close:hover{opacity:1}.video-admin-section{padding:10px 12px;border-bottom:1px solid rgba(128,128,128,.25);background:#9b59b61a}.video-admin-header{font-family:var(--font-mono, monospace);font-size:9px;font-weight:700;text-transform:uppercase;color:#9b59b6;margin-bottom:8px}.video-user-section{padding:10px 12px;border-bottom:1px solid rgba(128,128,128,.25)}.video-section-header{font-family:var(--font-mono, monospace);font-size:9px;font-weight:700;text-transform:uppercase;color:var(--text-muted, #666);margin-bottom:8px}.video-add-controls{display:flex;flex-direction:column;gap:8px}.video-upload-btn{padding:6px 12px;background:#9b59b6;color:#fff;border:none;border-radius:4px;font-family:var(--font-mono, monospace);font-size:10px;font-weight:700;cursor:pointer;transition:all .15s ease;white-space:nowrap}.video-upload-btn:hover{filter:brightness(1.1)}.video-url-row{display:flex;gap:6px}.video-url-input{flex:1;padding:6px 10px;border:1px solid rgba(128,128,128,.35);border-radius:4px;font-family:var(--font-mono, monospace);font-size:10px;background:var(--surface);color:var(--text)}.video-url-input:focus{outline:none;border-color:#9b59b6}.video-url-btn{padding:6px 12px;background:#9b59b6;color:#fff;border:none;border-radius:4px;font-family:var(--font-mono, monospace);font-size:10px;font-weight:700;cursor:pointer}.video-list{flex:1;overflow-y:auto;padding:8px}.video-section{margin-bottom:12px}.video-section-label{font-family:var(--font-mono, monospace);font-size:8px;font-weight:700;text-transform:uppercase;color:var(--text-muted, #666);margin-bottom:6px;padding:4px 6px;background:#80808026;border-radius:3px}.video-empty{padding:24px;text-align:center;color:var(--text-muted, #666);font-family:var(--font-mono, monospace);font-size:11px}.video-library-item{display:flex;align-items:center;gap:8px;padding:6px 8px;background:var(--surface);border-radius:4px;margin-bottom:6px;cursor:grab;transition:all .15s ease}.video-library-item:hover{background:var(--surface, #f5f2eb);box-shadow:0 2px 6px #0000001a}.video-library-item.dragging{opacity:.5;cursor:grabbing}.video-item-preview{width:48px;height:32px;background:#1a1a1a;border-radius:3px;overflow:hidden;flex-shrink:0}.video-item-preview video{width:100%;height:100%;object-fit:cover}.video-item-info{flex:1;min-width:0;display:flex;flex-direction:column;gap:2px}.video-item-name{font-family:var(--font-mono, monospace);font-size:10px;font-weight:600;color:var(--text, #1a1a1a);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.video-item-type{font-family:var(--font-mono, monospace);font-size:8px;color:var(--text-muted, #666)}.video-item-remove{width:20px;height:20px;background:#e74c3c;color:#fff;border:none;border-radius:3px;font-size:12px;cursor:pointer;display:flex;align-items:center;justify-content:center;opacity:0;transition:opacity .15s ease;flex-shrink:0}.video-library-item:hover .video-item-remove{opacity:1}.video-item-remove:hover{filter:brightness(1.1)}.video-help{padding:6px 12px;background:#9b59b61a;font-family:var(--font-mono, monospace);font-size:8px;color:#9b59b6;text-align:center}.connection-panel{display:flex;align-items:center;gap:8px;padding:2px 8px;background:transparent;border-radius:3px}.connection-status{display:flex;align-items:center;gap:3px}.status-indicator{width:6px;height:6px;border-radius:50%;transition:all .3s ease;flex-shrink:0}.status-indicator.connected{background:var(--accent, #2ecc71);box-shadow:0 0 4px var(--accent, #2ecc71)}.status-indicator.disconnected{background:var(--text-muted, #666666)}.status-text{font-family:var(--font-mono, monospace);font-size:11px;font-weight:500;white-space:nowrap}.midi-live-stats{display:flex;align-items:center;gap:6px}.midi-stat{font-family:var(--font-mono, monospace);font-size:10px;font-weight:700;letter-spacing:.5px;padding:2px 6px;border-radius:3px;white-space:nowrap;text-transform:uppercase}.bpm-stat{background:#d354001f;color:var(--secondary, #d35400);border:1px solid rgba(211,84,0,.25)}.note-stat{background:#2d5a4a1f;color:var(--accent, #2d5a4a);border:1px solid rgba(45,90,74,.25)}.out-stat{background:#27ae601f;color:#27ae60;border:1px solid rgba(39,174,96,.3);animation:pulse-dot 2s ease-in-out infinite}@keyframes pulse-dot{0%,to{opacity:1}50%{opacity:.5}}.connection-error{font-family:var(--font-mono, monospace);font-size:8px;color:#ef4444;padding:2px 4px;background:#ef44441a;border-radius:2px}.connect-btn{font-family:var(--font-mono, monospace);font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:.3px;padding:8px 12px;border:1px solid rgba(128,128,128,.3);border-radius:4px;cursor:pointer;transition:all .15s ease;background:var(--secondary, #d35400);color:#fff!important;white-space:nowrap;height:36px;display:flex;align-items:center}.connect-btn:hover{filter:brightness(1.15)}.connect-btn:active{filter:brightness(.9)}.connect-btn.disconnect{background:var(--text-muted, #666);border-color:#80808059;color:#fff!important}.theme-selector{display:flex;flex-direction:column;gap:8px;padding:12px;background:var(--surface);border-radius:8px;box-shadow:0 2px 8px #0000000f}.theme-selector h4{font-family:var(--font-mono, monospace);font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:1px;margin:0 0 8px;color:var(--text-muted, #666666)}.theme-options{display:flex;gap:8px}.theme-option{width:32px;height:32px;border-radius:6px;border:2px solid transparent;cursor:pointer;transition:all .15s ease;display:flex;align-items:center;justify-content:center}.theme-option:hover{transform:scale(1.1)}.theme-option.active{border-color:var(--primary, #1a1a1a);box-shadow:0 0 0 2px var(--background, #f5f5f0)}.toolbar{display:flex;gap:8px;padding:8px 12px;background:var(--surface);border-radius:8px;box-shadow:0 2px 8px #0000000f}.toolbar-btn{font-family:var(--font-mono, monospace);font-size:10px;font-weight:700;text-transform:uppercase;letter-spacing:.5px;padding:8px 12px;border:none;border-radius:4px;cursor:pointer;transition:all .15s ease;background:var(--background, #f5f5f0);color:var(--text, #1a1a1a)}.toolbar-btn:hover,.toolbar-btn.active{background:var(--secondary, #d35400);color:#fff}.toolbar-btn:disabled{opacity:.5;cursor:not-allowed}.project-controls{display:flex;align-items:center;gap:8px}.project-name-section{display:flex;align-items:center}.project-name{font-family:var(--font-mono, monospace);font-size:11px;font-weight:600;color:var(--text, #1a1a1a);cursor:pointer;padding:6px 10px;border-radius:4px;background:#80808026;border:1px solid rgba(128,128,128,.3);transition:background .15s ease;max-width:140px;min-width:100px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;height:36px;display:flex;align-items:center}.project-name:hover{background:#80808026}.project-name-input{font-family:var(--font-mono, monospace);font-size:11px;font-weight:600;color:var(--text, #1a1a1a);padding:6px 10px;border-radius:4px;border:1px solid var(--accent, #2d5a4a);background:var(--surface);outline:none;max-width:140px;min-width:100px;height:36px;box-sizing:border-box}.project-buttons{display:flex;gap:6px}.project-btn{font-family:var(--font-mono, monospace);font-size:11px;font-weight:700;letter-spacing:.3px;padding:8px 12px;border:1px solid rgba(128,128,128,.3);border-radius:4px;cursor:pointer;transition:all .15s ease;background:var(--surface, #f5f2eb);color:var(--text, #1a1a1a);box-shadow:0 1px 2px #0000001a;white-space:nowrap;height:36px;display:flex;align-items:center}.project-btn:hover{background:var(--accent, #2d5a4a);color:#fff}.project-btn:active{filter:brightness(.95)}.project-btn.active{background:var(--accent, #2d5a4a);color:#fff}.project-btn.syncing{background:var(--secondary, #d35400);color:#fff;cursor:wait}.project-btn:disabled{opacity:.7;cursor:not-allowed}.cloud-indicator{margin-left:6px;font-size:10px;color:var(--accent, #2d5a4a)}.load-btn-wrapper{position:relative}.load-menu{position:absolute;top:100%;left:0;margin-top:4px;background:var(--surface);border:1px solid rgba(128,128,128,.3);border-radius:4px;box-shadow:0 4px 12px #00000026;z-index:1000;min-width:160px;max-height:240px;overflow-y:auto}.load-menu-item{display:block;width:100%;padding:8px 12px;border:none;background:none;text-align:left;font-family:var(--font-mono, monospace);font-size:10px;font-weight:600;color:var(--text, #1a1a1a);cursor:pointer;transition:background .1s ease;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.load-menu-item:hover{background:var(--background, #e8e4dc)}.load-menu-item.active{background:var(--accent, #2d5a4a);color:#fff}.load-menu-item.load-local{border-top:1px solid rgba(128,128,128,.25);color:var(--text-muted, #666);font-style:italic}.load-menu-item.load-local:hover{color:var(--text, #1a1a1a)}@media(max-width:900px){.project-name{font-size:9px;padding:5px 8px;max-width:80px;height:28px}.project-btn{font-size:9px;padding:5px 8px;height:28px}}@media(max-width:768px){.project-controls{gap:2px}.project-name{max-width:60px;font-size:8px;padding:4px 6px;height:24px}.project-btn{font-size:8px;padding:4px 6px;height:24px}}.version-modal-overlay{position:fixed;inset:0;background:#0009;display:flex;align-items:center;justify-content:center;z-index:2000;-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px)}.version-modal{background:var(--surface, #f5f2eb);border-radius:8px;box-shadow:0 8px 32px #0000004d;width:90%;max-width:500px;max-height:80vh;display:flex;flex-direction:column;overflow:hidden}.version-modal-header{display:flex;align-items:center;justify-content:space-between;padding:16px 20px;border-bottom:1px solid rgba(128,128,128,.25);background:#80808026}.version-modal-header h2{margin:0;font-family:var(--font-mono, monospace);font-size:14px;font-weight:700;letter-spacing:.5px;color:var(--text, #1a1a1a)}.version-modal-close{background:none;border:none;font-size:24px;cursor:pointer;color:var(--text-muted, #666);padding:0;line-height:1;transition:color .15s ease}.version-modal-close:hover{color:var(--text, #1a1a1a)}.version-modal-content{flex:1;overflow-y:auto;padding:16px 20px}.version-loading{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:40px 20px;gap:12px;color:var(--text-muted, #666)}.version-spinner{width:24px;height:24px;border:2px solid rgba(128,128,128,.25);border-top-color:var(--accent, #2d5a4a);border-radius:50%;animation:spin .8s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}.version-error{display:flex;flex-direction:column;align-items:center;gap:12px;padding:20px;background:#d354001a;border-radius:6px;color:var(--secondary, #d35400)}.version-error button{padding:8px 16px;background:var(--secondary, #d35400);color:#fff;border:none;border-radius:4px;cursor:pointer;font-family:var(--font-mono, monospace);font-size:11px;font-weight:600}.version-empty{text-align:center;padding:40px 20px;color:var(--text-muted, #666)}.version-empty p{margin:0 0 8px}.version-empty-hint{font-size:11px;opacity:.7}.version-list{display:flex;flex-direction:column;gap:8px}.version-item{display:flex;align-items:center;justify-content:space-between;padding:12px 16px;background:var(--surface);border:1px solid rgba(128,128,128,.25);border-radius:6px;transition:border-color .15s ease}.version-item:hover{border-color:var(--accent, #2d5a4a)}.version-info{display:flex;flex-direction:column;gap:4px}.version-type{display:inline-block;padding:2px 6px;border-radius:3px;font-family:var(--font-mono, monospace);font-size:9px;font-weight:700;letter-spacing:.5px;width:fit-content}.version-type.type-auto{background:#80808026;color:var(--text-muted, #666)}.version-type.type-manual{background:var(--accent, #2d5a4a);color:#fff}.version-type.type-saveas{background:var(--secondary, #d35400);color:#fff}.version-date{font-family:var(--font-mono, monospace);font-size:11px;color:var(--text, #1a1a1a)}.version-name{font-family:var(--font-mono, monospace);font-size:10px;color:var(--text-muted, #666);font-style:italic}.version-actions{display:flex;gap:6px}.version-btn{padding:6px 12px;border:1px solid rgba(128,128,128,.3);border-radius:4px;font-family:var(--font-mono, monospace);font-size:10px;font-weight:700;cursor:pointer;transition:all .15s ease}.version-btn.restore{background:var(--accent, #2d5a4a);color:#fff;border-color:var(--accent, #2d5a4a)}.version-btn.restore:hover{filter:brightness(1.1)}.version-btn.restore:disabled{opacity:.6;cursor:not-allowed}.version-btn.delete{background:transparent;color:var(--text-muted, #666)}.version-btn.delete:hover{background:#d354001a;color:var(--secondary, #d35400);border-color:var(--secondary, #d35400)}.version-btn.delete:disabled{opacity:.5;cursor:not-allowed}.version-modal-footer{padding:12px 20px;border-top:1px solid rgba(128,128,128,.25);background:#80808026}.version-footer-hint{font-family:var(--font-mono, monospace);font-size:10px;color:var(--text-muted, #666)}@media(max-width:600px){.version-modal{width:95%;max-height:90vh}.version-item{flex-direction:column;align-items:flex-start;gap:10px}.version-actions{width:100%}.version-btn{flex:1;text-align:center}}.auth-video-bg{position:fixed;inset:0;z-index:1999;overflow:hidden}.auth-video-bg video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:0;transition:opacity .8s ease}.auth-video-bg video.visible{opacity:1}.auth-video-bg .auth-bg-gif{position:absolute;inset:0;background-size:cover;background-position:center;opacity:0;transition:opacity .8s ease}.auth-video-bg .auth-bg-gif.visible{opacity:1}.auth-video-dim{position:fixed;inset:0;z-index:2000;background:#0000008c;backdrop-filter:blur(3px);-webkit-backdrop-filter:blur(3px);pointer-events:none}.auth-video-dim.no-video{background:#000000a6;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px)}.auth-modal-overlay{position:fixed;inset:0;z-index:2000;background:transparent}.auth-modal{position:fixed;top:50%;left:50%;transform:translate(-50%,-50%);background:#0f0a19e0;border:1px solid rgba(255,255,255,.1);border-radius:12px;padding:28px;width:90%;max-width:380px;z-index:2002;box-shadow:0 24px 80px #000000b3,0 0 0 1px #ffffff0f;color:#fff;backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px)}.auth-modal-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:20px}.auth-modal-header h2{margin:0;font-family:var(--font-mono, monospace);font-size:18px;font-weight:700;color:#fff}.auth-close-btn{background:#ffffff1a;border:1px solid rgba(255,255,255,.15);font-size:16px;cursor:pointer;color:#ffffffb3;padding:4px 10px;border-radius:50%;line-height:1;transition:all .15s}.auth-close-btn:hover{background:#80808026}.auth-form{display:flex;flex-direction:column;gap:16px}.auth-field{display:flex;flex-direction:column;gap:6px}.auth-field label{font-family:var(--font-mono, monospace);font-size:11px;font-weight:600;color:#ffffff8c;text-transform:uppercase;letter-spacing:.5px}.auth-field input{font-family:var(--font-primary, sans-serif);font-size:14px;padding:10px 12px;border:1px solid rgba(255,255,255,.15);border-radius:6px;background:#ffffff14;color:#fff;transition:border-color .15s ease}.auth-field input::placeholder{color:#ffffff4d}.auth-field input:focus{outline:none;border-color:var(--primary, #ff6ec7);background:#ffffff1f}.auth-field input:disabled{opacity:.6;cursor:not-allowed}.auth-error{font-family:var(--font-mono, monospace);font-size:12px;color:#ef4444;padding:8px 12px;background:#ef44441a;border-radius:4px}.auth-submit-btn{font-family:var(--font-mono, monospace);font-size:13px;font-weight:700;text-transform:uppercase;letter-spacing:.5px;padding:12px 16px;border:none;border-radius:6px;background:var(--secondary, #d35400);color:#fff;cursor:pointer;transition:all .15s ease}.auth-submit-btn:hover:not(:disabled){filter:brightness(1.1)}.auth-submit-btn:disabled{opacity:.6;cursor:not-allowed}.auth-divider{display:flex;align-items:center;gap:12px;margin:16px 0}.auth-divider:before,.auth-divider:after{content:"";flex:1;height:1px;background:#80808026}.auth-divider span{font-family:var(--font-mono, monospace);font-size:11px;color:#ffffff73;text-transform:uppercase}.auth-google-btn{display:flex;align-items:center;justify-content:center;gap:10px;font-family:var(--font-primary, sans-serif);font-size:14px;font-weight:500;padding:12px 16px;border:1px solid rgba(255,255,255,.15);border-radius:6px;background:#ffffff14;color:#fff;cursor:pointer;transition:all .15s ease;width:100%}.auth-google-btn:hover:not(:disabled){background:#ffffff24;border-color:#ffffff40}.auth-google-btn:disabled{opacity:.6;cursor:not-allowed}.auth-switch{margin-top:16px;text-align:center;font-family:var(--font-mono, monospace);font-size:12px;color:#ffffff73}.auth-switch button{background:none;border:none;color:var(--primary, #ff6ec7);font-family:inherit;font-size:inherit;font-weight:600;cursor:pointer;padding:0}.auth-switch button:hover{text-decoration:underline}.store{display:flex;flex-direction:column;height:100%;overflow:hidden}.store-header{padding:12px 16px;background:var(--primary, #1a1a1a);color:var(--surface, #f5f2eb)}.store-title{display:flex;align-items:center;gap:8px;font-size:14px;font-weight:700;letter-spacing:1px}.store-icon{font-size:16px}.store-subtitle{font-size:10px;color:var(--secondary, #d35400);margin-top:2px}.store-featured{padding:12px;background:var(--background, #e8e4dc)}.section-title{font-size:11px;font-weight:700;color:var(--text-muted, #666);margin-bottom:8px;letter-spacing:.5px}.featured-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}.featured-card{background:var(--surface, #f5f2eb);border-radius:6px;overflow:hidden;cursor:pointer;transition:transform .15s,box-shadow .15s}.featured-card:hover{transform:translateY(-2px);box-shadow:0 4px 12px #00000026}.featured-image{height:60px;position:relative;display:flex;align-items:center;justify-content:center}.featured-info{padding:8px;display:flex;flex-direction:column;gap:2px}.featured-name{font-size:10px;font-weight:600;color:var(--text, #1a1a1a);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.featured-price{font-size:11px;font-weight:700;color:var(--secondary, #d35400)}.badge{position:absolute;top:4px;right:4px;font-size:8px;font-weight:700;padding:2px 6px;border-radius:3px;text-transform:uppercase}.badge.new{background:var(--secondary, #d35400);color:#fff}.badge.custom{background:var(--accent, #2d5a4a);color:#fff}.store-filters{padding:8px 12px;background:var(--surface, #f5f2eb);border-bottom:1px solid var(--background, #e8e4dc);display:flex;flex-direction:column;gap:8px}.filter-group{display:flex;align-items:center;gap:8px}.filter-group label{font-size:10px;font-weight:600;color:var(--text-muted, #666);min-width:60px}.filter-buttons{display:flex;gap:4px;flex-wrap:wrap}.filter-btn{padding:4px 8px;font-size:9px;font-weight:600;background:var(--background, #e8e4dc);border:1px solid transparent;color:var(--text-muted, #666);border-radius:3px;cursor:pointer;transition:all .15s}.filter-btn:hover{background:var(--secondary, #d35400);color:#fff}.filter-btn.active{background:var(--primary, #1a1a1a);color:var(--surface, #f5f2eb)}.store-products{flex:1;overflow-y:auto;padding:12px}.products-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:8px}.product-card{background:var(--surface, #f5f2eb);border-radius:6px;overflow:hidden;cursor:pointer;transition:transform .15s,box-shadow .15s;border:1px solid var(--background, #e8e4dc)}.product-card:hover{transform:translateY(-2px);box-shadow:0 4px 12px #0000001a;border-color:var(--secondary, #d35400)}.product-image{height:80px;position:relative;display:flex;align-items:center;justify-content:center}.product-info{padding:8px;display:flex;flex-direction:column;gap:2px}.product-name{font-size:11px;font-weight:600;color:var(--text, #1a1a1a);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.product-category{font-size:9px;color:var(--text-muted, #666);text-transform:uppercase}.product-footer{display:flex;justify-content:space-between;align-items:center;margin-top:4px}.product-price{font-size:12px;font-weight:700;color:var(--secondary, #d35400)}.product-colors{display:flex;gap:3px}.color-dot{width:10px;height:10px;border-radius:50%;border:1px solid rgba(128,128,128,.35)}.more-colors{font-size:8px;color:var(--text-muted, #666)}.product-modal-overlay{position:fixed;inset:0;background:#0009;display:flex;align-items:center;justify-content:center;z-index:1000;padding:20px}.product-modal{background:var(--surface, #f5f2eb);border-radius:12px;max-width:500px;width:100%;max-height:90vh;overflow-y:auto;position:relative}.modal-close{position:absolute;top:12px;right:12px;width:28px;height:28px;background:#00000080;border:none;color:#fff;font-size:18px;border-radius:50%;cursor:pointer;z-index:1}.modal-content{display:flex;flex-direction:column}.modal-image{height:200px;position:relative;display:flex;align-items:center;justify-content:center}.modal-info{padding:20px}.modal-info h2{margin:0 0 8px;font-size:18px;color:var(--text, #1a1a1a)}.modal-description{font-size:12px;color:var(--text-muted, #666);line-height:1.5;margin:0 0 16px}.modal-meta{display:flex;gap:12px;margin-bottom:16px}.modal-category{font-size:10px;font-weight:600;color:var(--secondary, #d35400);background:#d354001a;padding:4px 8px;border-radius:4px}.modal-devices{font-size:10px;color:var(--text-muted, #666);background:var(--background, #e8e4dc);padding:4px 8px;border-radius:4px}.modal-options{margin-bottom:16px}.modal-options label{display:block;font-size:10px;font-weight:600;color:var(--text-muted, #666);margin-bottom:8px}.color-options{display:flex;gap:8px}.color-btn{width:32px;height:32px;border-radius:50%;border:2px solid transparent;cursor:pointer;position:relative;transition:transform .15s}.color-btn:hover{transform:scale(1.1)}.color-btn.active{border-color:var(--primary, #1a1a1a)}.premium-dot{position:absolute;top:-4px;right:-4px;font-size:10px;color:gold}.custom-color-picker{display:flex;align-items:center;gap:12px}.custom-color-picker input[type=color]{width:40px;height:40px;border:none;border-radius:8px;cursor:pointer}.color-hex{font-size:12px;font-family:monospace;color:var(--text-muted, #666)}.material-options{display:flex;gap:8px}.material-btn{padding:6px 12px;font-size:10px;font-weight:600;background:var(--background, #e8e4dc);border:1px solid transparent;border-radius:4px;cursor:pointer;transition:all .15s}.material-btn:hover,.material-btn.active{background:var(--primary, #1a1a1a);color:var(--surface, #f5f2eb)}.modal-footer{display:flex;justify-content:space-between;align-items:center;padding-top:16px;border-top:1px solid var(--background, #e8e4dc)}.modal-price{font-size:24px;font-weight:700;color:var(--secondary, #d35400)}.add-to-cart-btn{padding:12px 24px;font-size:12px;font-weight:700;background:var(--secondary, #d35400);border:none;color:#fff;border-radius:6px;cursor:pointer;transition:all .15s}.add-to-cart-btn:hover{filter:brightness(1.1);transform:translateY(-1px)}.events-panel{display:flex;flex-direction:column;height:100%;overflow:hidden;background:var(--bg, #111);color:var(--text, #eee);font-family:inherit}.events-launch-banner{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:14px 18px;background:linear-gradient(135deg,var(--primary, #7c3aed) 0%,var(--secondary, #db2777) 100%);color:#fff;flex-shrink:0}.events-banner-text{display:flex;align-items:center;gap:12px}.events-banner-icon{font-size:24px;flex-shrink:0}.events-banner-text strong{display:block;font-size:14px;font-weight:700;letter-spacing:.02em}.events-banner-text p{margin:2px 0 0;font-size:12px;opacity:.88}.events-create-btn{padding:7px 16px;border-radius:6px;border:2px solid rgba(255,255,255,.7);background:#ffffff26;color:#fff;font-size:13px;font-weight:700;cursor:pointer;white-space:nowrap;transition:background .15s,border-color .15s}.events-create-btn:hover{background:#ffffff47;border-color:#fff}.events-header{display:flex;align-items:center;gap:10px;padding:10px 14px;border-bottom:1px solid var(--border, rgba(255,255,255,.09));flex-shrink:0;flex-wrap:wrap}.events-tabs{display:flex;gap:4px}.events-tab{padding:5px 12px;border-radius:20px;border:1px solid var(--border, rgba(255,255,255,.15));background:transparent;color:var(--text-muted, #888);font-size:12px;cursor:pointer;transition:all .15s}.events-tab:hover{background:var(--hover, rgba(255,255,255,.07));color:var(--text, #eee)}.events-tab.active{background:var(--primary, #7c3aed);border-color:var(--primary, #7c3aed);color:#fff;font-weight:600}.events-controls{display:flex;gap:8px;align-items:center;margin-left:auto;flex-wrap:wrap}.events-search{padding:5px 10px;border-radius:6px;border:1px solid var(--border, rgba(255,255,255,.15));background:var(--input-bg, rgba(255,255,255,.06));color:var(--text, #eee);font-size:12px;width:160px;outline:none;transition:border-color .15s}.events-search:focus{border-color:var(--primary, #7c3aed)}.events-search::placeholder{color:var(--text-muted, #666)}.events-filter-cat{padding:5px 8px;border-radius:6px;border:1px solid var(--border, rgba(255,255,255,.15));background:var(--input-bg, rgba(255,255,255,.06));color:var(--text, #eee);font-size:12px;outline:none;cursor:pointer}.events-add-btn{padding:5px 12px;border-radius:6px;border:1px solid var(--primary, #7c3aed);background:transparent;color:var(--primary, #7c3aed);font-size:12px;font-weight:600;cursor:pointer;white-space:nowrap;transition:all .15s}.events-add-btn:hover{background:var(--primary, #7c3aed);color:#fff}.events-grid{flex:1;overflow-y:auto;padding:14px;display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:14px;align-content:start}.events-loading,.events-empty{grid-column:1 / -1;text-align:center;padding:48px 24px;color:var(--text-muted, #666);font-size:14px}.event-card{display:flex;flex-direction:column;border-radius:10px;border:1px solid var(--border, rgba(255,255,255,.1));background:var(--card-bg, rgba(255,255,255,.04));overflow:hidden;transition:border-color .18s,box-shadow .18s}.event-card:hover{border-color:var(--primary, #7c3aed);box-shadow:0 4px 18px #7c3aed2e}.event-card-image{width:100%;aspect-ratio:16/9;overflow:hidden;flex-shrink:0}.event-card-image img{width:100%;height:100%;object-fit:cover;transition:transform .3s ease}.event-card:hover .event-card-image img{transform:scale(1.04)}.event-card-body{padding:12px 14px;display:flex;flex-direction:column;gap:5px}.event-card-meta{display:flex;align-items:center;gap:6px;flex-wrap:wrap}.event-card-category{padding:2px 8px;border-radius:10px;background:var(--primary, #7c3aed);color:#fff;font-size:10px;font-weight:700;text-transform:uppercase;letter-spacing:.05em}.event-card-status{padding:2px 8px;border-radius:10px;font-size:10px;font-weight:600;text-transform:uppercase}.event-status-published{background:#22c55e33;color:#22c55e}.event-status-draft{background:#eab30833;color:#eab308}.event-status-cancelled{background:#ef444433;color:#ef4444}.event-card-title{margin:0;font-size:15px;font-weight:700;color:var(--text, #eee);line-height:1.3}.event-card-datetime,.event-card-venue,.event-card-artists{font-size:12px;color:var(--text-muted, #999);line-height:1.4}.event-card-description{margin:6px 0 0;font-size:13px;color:var(--text, #ccc);line-height:1.55}.event-card-tickets{display:flex;flex-direction:column;gap:4px;margin-top:8px}.event-ticket-badge{display:flex;align-items:center;gap:8px;padding:5px 10px;border-radius:6px;background:var(--input-bg, rgba(255,255,255,.05));font-size:12px}.event-ticket-name{flex:1;font-weight:600;color:var(--text, #eee)}.event-ticket-price{color:var(--primary, #7c3aed);font-weight:700}.event-ticket-qty{color:var(--text-muted, #888);font-size:11px}.event-buy-tickets-btn{display:inline-block;margin-top:10px;padding:8px 18px;border-radius:8px;background:var(--primary, #7c3aed);color:#fff;font-size:13px;font-weight:700;text-decoration:none;text-align:center;transition:opacity .15s}.event-buy-tickets-btn:hover{opacity:.85}.event-card-actions{display:flex;align-items:center;gap:8px;margin-top:8px;padding-top:8px;border-top:1px solid var(--border, rgba(255,255,255,.08))}.event-card-btn{padding:4px 10px;border-radius:5px;border:1px solid var(--border, rgba(255,255,255,.15));background:transparent;color:var(--text-muted, #aaa);font-size:11px;cursor:pointer;transition:all .15s}.event-card-btn:hover{border-color:var(--primary, #7c3aed);color:var(--primary, #7c3aed)}.event-card-edit-btn{margin-left:auto}.event-card-likes{font-size:12px;color:var(--text-muted, #888)}.event-modal-overlay{position:fixed;inset:0;z-index:1000;background:#000000b8;display:flex;align-items:flex-start;justify-content:center;padding:24px 16px;overflow-y:auto;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px)}.event-modal{width:100%;max-width:680px;background:var(--surface, #1a1a2e);border-radius:14px;border:1px solid var(--border, rgba(255,255,255,.12));display:flex;flex-direction:column;max-height:calc(100vh - 48px);overflow:hidden;box-shadow:0 24px 64px #00000080}.event-modal-header{display:flex;align-items:center;justify-content:space-between;padding:16px 20px;border-bottom:1px solid var(--border, rgba(255,255,255,.1));flex-shrink:0}.event-modal-header h2{margin:0;font-size:18px;font-weight:700;color:var(--text, #eee)}.event-modal-close{width:28px;height:28px;border-radius:50%;border:none;background:var(--hover, rgba(255,255,255,.08));color:var(--text-muted, #aaa);font-size:13px;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:background .15s,color .15s}.event-modal-close:hover{background:#ef444433;color:#ef4444}.event-modal-body{flex:1;overflow-y:auto;padding:18px 20px;display:flex;flex-direction:column;gap:16px}.event-error-banner{padding:10px 14px;border-radius:8px;background:#ef444426;border:1px solid rgba(239,68,68,.35);color:#f87171;font-size:13px;line-height:1.4}.event-form-section{display:flex;flex-direction:column;gap:6px}.event-form-section-header{display:flex;align-items:center;justify-content:space-between}.event-form-label{font-size:12px;font-weight:600;color:var(--text-muted, #aaa);text-transform:uppercase;letter-spacing:.06em}.event-form-optional{font-weight:400;text-transform:none;letter-spacing:0;opacity:.7}.event-form-row{display:flex;gap:8px;flex-wrap:wrap}.event-form-row .event-form-section{flex:1;min-width:120px}.event-form-row>.event-form-input{flex:1;min-width:100px}.event-form-input{padding:8px 11px;border-radius:7px;border:1px solid var(--border, rgba(255,255,255,.12));background:var(--input-bg, rgba(255,255,255,.06));color:var(--text, #eee);font-size:13px;outline:none;width:100%;box-sizing:border-box;transition:border-color .15s;font-family:inherit}.event-form-input:focus{border-color:var(--primary, #7c3aed)}.event-form-input::placeholder{color:var(--text-muted, #555)}.event-form-select{cursor:pointer;appearance:auto}.event-form-textarea{padding:8px 11px;border-radius:7px;border:1px solid var(--border, rgba(255,255,255,.12));background:var(--input-bg, rgba(255,255,255,.06));color:var(--text, #eee);font-size:13px;outline:none;width:100%;box-sizing:border-box;resize:vertical;min-height:80px;transition:border-color .15s;font-family:inherit;line-height:1.5}.event-form-textarea:focus{border-color:var(--primary, #7c3aed)}.event-form-textarea::placeholder{color:var(--text-muted, #555)}.event-image-dropzone{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:5px;padding:22px 16px;border-radius:10px;border:2px dashed var(--border, rgba(255,255,255,.18));background:var(--input-bg, rgba(255,255,255,.03));cursor:pointer;text-align:center;font-size:13px;color:var(--text-muted, #888);transition:border-color .18s,background .18s;-webkit-user-select:none;user-select:none}.event-image-dropzone:hover,.event-image-dropzone.drag-over{border-color:var(--primary, #7c3aed);background:#7c3aed0f}.event-image-dropzone.uploading{opacity:.7;cursor:wait}.event-upload-icon{font-size:26px;margin-bottom:2px}.event-upload-hint{font-size:11px;opacity:.6}.event-upload-spinner{font-size:13px;color:var(--primary, #7c3aed);animation:pulse 1s ease-in-out infinite alternate}@keyframes pulse{0%{opacity:.5}to{opacity:1}}.event-image-previews{display:flex;gap:8px;flex-wrap:wrap;margin-top:4px}.event-image-thumb{position:relative;width:80px;height:80px;border-radius:8px;overflow:hidden;border:1px solid var(--border, rgba(255,255,255,.1));flex-shrink:0}.event-image-thumb img{width:100%;height:100%;object-fit:cover}.event-image-remove{position:absolute;top:3px;right:3px;width:18px;height:18px;border-radius:50%;border:none;background:#000000b3;color:#fff;font-size:9px;cursor:pointer;display:flex;align-items:center;justify-content:center;line-height:1;transition:background .15s}.event-image-remove:hover{background:#ef4444d9}.event-image-main-badge{position:absolute;bottom:3px;left:3px;padding:1px 5px;border-radius:4px;background:var(--primary, #7c3aed);color:#fff;font-size:9px;font-weight:700;text-transform:uppercase}.event-place-suggestions{position:absolute;top:calc(100% + 4px);left:0;right:0;z-index:200;list-style:none;margin:0;padding:4px 0;border-radius:8px;border:1px solid var(--border, rgba(255,255,255,.15));background:var(--surface, #1a1a2e);box-shadow:0 8px 24px #0006;max-height:220px;overflow-y:auto}.event-place-suggestions li{display:flex;align-items:flex-start;gap:8px;padding:8px 12px;font-size:12px;color:var(--text, #ddd);cursor:pointer;transition:background .12s}.event-place-suggestions li:hover{background:var(--hover, rgba(255,255,255,.07))}.place-icon{flex-shrink:0;font-size:13px}.place-powered-by{font-size:10px!important;color:var(--text-muted, #666)!important;cursor:default!important;padding:4px 12px!important;justify-content:flex-end!important;border-top:1px solid var(--border, rgba(255,255,255,.08))}.place-powered-by:hover{background:transparent!important}.event-artist-row{display:flex;gap:6px;align-items:center;flex-wrap:wrap}.event-artist-row .event-form-input{flex:1;min-width:90px}.event-ticket-tier{padding:10px 12px;border-radius:8px;border:1px solid var(--border, rgba(255,255,255,.1));background:var(--input-bg, rgba(255,255,255,.03));display:flex;flex-direction:column;gap:8px}.event-price-input{position:relative;display:flex;align-items:center;flex:1;min-width:90px}.event-price-currency{position:absolute;left:10px;font-size:13px;color:var(--text-muted, #888);pointer-events:none}.event-price-input .event-form-input{padding-left:22px}.event-qty-input{max-width:80px}.event-tier-paywall{display:flex;align-items:center;gap:8px;flex-wrap:wrap}.event-tier-paywall-label{font-size:11px;color:var(--text-muted, #888);white-space:nowrap}.event-tier-paywall .event-form-input{flex:1;min-width:160px}.event-add-row-btn{padding:4px 10px;border-radius:5px;border:1px solid var(--primary, #7c3aed);background:transparent;color:var(--primary, #7c3aed);font-size:11px;font-weight:600;cursor:pointer;transition:all .15s}.event-add-row-btn:hover{background:var(--primary, #7c3aed);color:#fff}.event-remove-row-btn{width:26px;height:26px;border-radius:5px;border:1px solid rgba(239,68,68,.3);background:transparent;color:#ef4444;font-size:11px;cursor:pointer;display:flex;align-items:center;justify-content:center;flex-shrink:0;transition:background .15s}.event-remove-row-btn:hover{background:#ef444426}.event-empty-hint{margin:0;font-size:12px;color:var(--text-muted, #666);font-style:italic}.event-modal-footer{display:flex;align-items:center;gap:8px;padding:14px 20px;border-top:1px solid var(--border, rgba(255,255,255,.1));flex-shrink:0;justify-content:flex-end}.event-btn-cancel{padding:8px 16px;border-radius:7px;border:1px solid var(--border, rgba(255,255,255,.15));background:transparent;color:var(--text-muted, #aaa);font-size:13px;cursor:pointer;margin-right:auto;transition:all .15s}.event-btn-cancel:hover{background:var(--hover, rgba(255,255,255,.07));color:var(--text, #eee)}.event-btn-cancel:disabled{opacity:.4;cursor:not-allowed}.event-btn-draft{padding:8px 16px;border-radius:7px;border:1px solid var(--border, rgba(255,255,255,.2));background:transparent;color:var(--text, #ddd);font-size:13px;font-weight:600;cursor:pointer;transition:all .15s}.event-btn-draft:hover{background:var(--hover, rgba(255,255,255,.09))}.event-btn-draft:disabled{opacity:.4;cursor:not-allowed}.event-btn-create{padding:8px 20px;border-radius:7px;border:none;background:var(--primary, #7c3aed);color:#fff;font-size:13px;font-weight:700;cursor:pointer;transition:opacity .15s,filter .15s}.event-btn-create:hover{filter:brightness(1.1)}.event-btn-create:disabled{opacity:.5;cursor:not-allowed}.events-toast{position:fixed;bottom:24px;left:50%;transform:translate(-50%);z-index:2000;padding:10px 20px;border-radius:8px;font-size:13px;font-weight:600;pointer-events:none;animation:slideUp .25s ease;white-space:nowrap;box-shadow:0 4px 16px #0000004d}.events-toast-success{background:#22c55ef2;color:#fff}.events-toast-error{background:#ef4444f2;color:#fff}@keyframes slideUp{0%{opacity:0;transform:translate(-50%) translateY(12px)}to{opacity:1;transform:translate(-50%) translateY(0)}}.events-grid::-webkit-scrollbar,.event-modal-body::-webkit-scrollbar{width:5px}.events-grid::-webkit-scrollbar-track,.event-modal-body::-webkit-scrollbar-track{background:transparent}.events-grid::-webkit-scrollbar-thumb,.event-modal-body::-webkit-scrollbar-thumb{background:var(--border, rgba(255,255,255,.12));border-radius:3px}.events-grid::-webkit-scrollbar-thumb:hover,.event-modal-body::-webkit-scrollbar-thumb:hover{background:var(--text-muted, rgba(255,255,255,.22))}@media(max-width:500px){.events-header{flex-direction:column;align-items:stretch}.events-controls{margin-left:0;width:100%}.events-search{width:100%}.event-modal{border-radius:10px 10px 0 0;max-height:90vh}.event-modal-overlay{padding:0;align-items:flex-end}}.cloud-hub-page{display:flex;height:100%;overflow:hidden;background:var(--background, #e8e4dc);font-family:var(--font-mono, monospace);font-size:12px}.hub-sidebar{width:160px;min-width:140px;background:var(--surface, #f5f2eb);border-right:2px solid var(--background, #e8e4dc);display:flex;flex-direction:column;padding:12px 0;gap:2px;overflow-y:auto}.hub-sidebar-title{display:flex;align-items:center;gap:6px;padding:6px 14px 12px;font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:.5px;color:var(--secondary, #d35400);border-bottom:1px solid var(--background, #e8e4dc);margin-bottom:6px}.hub-nav-btn{display:flex;align-items:center;gap:8px;padding:8px 14px;background:none;border:none;cursor:pointer;font-family:var(--font-mono, monospace);font-size:11px;font-weight:600;color:var(--text-muted, #666);text-align:left;transition:all .15s;border-left:3px solid transparent;width:100%}.hub-nav-btn:hover{background:var(--background, #e8e4dc);color:var(--text, #1a1a1a)}.hub-nav-btn.active{color:var(--accent, #00e5ff);border-left-color:var(--accent, #00e5ff);border-left-width:3px;background:color-mix(in srgb,var(--accent, #00e5ff) 14%,var(--surface, #f5f2eb));font-weight:700}.hub-nav-btn.locked{opacity:.6}.hub-nav-icon{font-size:14px;min-width:18px;text-align:center}.hub-nav-label{flex:1;text-transform:uppercase;letter-spacing:.3px}.hub-nav-lock{font-size:10px;opacity:.7}.hub-sidebar-user{margin-top:auto;padding:12px 14px 6px;border-top:1px solid var(--background, #e8e4dc);font-size:9px;color:var(--text-muted, #666)}.hub-sidebar-email{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;margin-bottom:4px}.hub-main{flex:1;overflow-y:auto;padding:20px}.hub-signed-out{display:flex;align-items:center;justify-content:center}.hub-sign-in-prompt{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:16px;padding:40px;text-align:center}.hub-sign-in-icon{color:var(--secondary, #d35400);opacity:.6}.hub-sign-in-text{color:var(--text-muted, #888);font-size:14px;margin:0;font-family:var(--font-mono);letter-spacing:.5px}.hub-sign-in-btn{padding:10px 32px;background:var(--secondary, #d35400);color:var(--secondary-contrast, #fff);border:none;border-radius:6px;font-family:var(--font-mono);font-size:13px;font-weight:700;letter-spacing:1px;text-transform:uppercase;cursor:pointer;transition:filter .15s ease,transform .1s ease}.hub-sign-in-btn:hover{filter:brightness(1.15)}.hub-sign-in-btn:active{transform:scale(.97)}.hub-section{width:100%}.hub-section-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:10px;gap:12px}.hub-section-header h4{margin:0;font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:.5px;color:var(--text-muted, #666)}.hub-header-actions{display:flex;align-items:center;gap:8px}.hub-admin-note{font-size:9px;color:var(--secondary, #d35400);font-weight:700;text-transform:uppercase}.hub-sync-bar{display:flex;align-items:center;justify-content:space-between;padding:8px 12px;background:#d354000f;border:1px solid rgba(211,84,0,.2);border-radius:6px;margin-bottom:12px;font-size:11px}.hub-sync-status{color:var(--text-muted, #666)}.hub-create-row{display:flex;gap:8px;margin-bottom:10px}.hub-input{flex:1;padding:7px 10px;border:1px solid var(--background, #e8e4dc);border-radius:4px;background:var(--surface, #f5f2eb);font-family:var(--font-mono, monospace);font-size:11px;color:var(--text, #1a1a1a)}.hub-input:focus{outline:none;border-color:var(--secondary, #d35400)}.hub-input.small{padding:4px 8px;font-size:10px;flex:0 1 160px}.hub-select{padding:4px 8px;border:1px solid var(--background, #e8e4dc);border-radius:4px;background:var(--surface, #f5f2eb);font-family:var(--font-mono, monospace);font-size:10px;color:var(--text, #1a1a1a);cursor:pointer}.hub-select.small{padding:3px 6px;font-size:10px}.hub-group{border:1px solid var(--background, #e8e4dc);border-radius:6px;margin-bottom:8px;overflow:hidden}.hub-group-header{display:flex;align-items:center;gap:8px;padding:8px 12px;background:var(--surface, #f5f2eb);cursor:pointer;font-size:11px;font-weight:700;text-transform:uppercase;color:var(--text, #1a1a1a);-webkit-user-select:none;user-select:none;transition:background .15s}.hub-group-header:hover{background:var(--background, #e8e4dc)}.hub-group-chevron{color:var(--text-muted, #666);font-size:10px}.hub-group-name{flex:1}.hub-group-count{font-size:9px;color:var(--text-muted, #666);background:var(--background, #e8e4dc);padding:2px 6px;border-radius:10px}.hub-group-projects{background:var(--background, #e8e4dc);padding:8px;display:flex;flex-direction:column;gap:4px}.hub-list{display:flex;flex-direction:column;gap:4px}.hub-item{display:flex;align-items:center;gap:10px;padding:8px 12px;background:var(--surface, #f5f2eb);border:1px solid var(--background, #e8e4dc);border-radius:6px;transition:border-color .15s}.hub-item:hover{border-color:#d3540040}.hub-item.active{border-color:var(--secondary, #d35400);border-width:2px;background:color-mix(in srgb,var(--secondary, #d35400) 10%,var(--surface, #f5f2eb))}.hub-item.official{border-color:#2d5a4a4d}.hub-item.compact{padding:6px 10px;border-radius:4px}.hub-item-info{flex:1;min-width:0;display:flex;flex-direction:column;gap:2px}.hub-item-name{font-size:11px;font-weight:700;color:var(--text, #1a1a1a);display:flex;align-items:center;gap:6px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.hub-item-meta{font-size:9px;color:var(--text-muted, #666)}.hub-item-actions{display:flex;align-items:center;gap:4px;flex-shrink:0}.hub-btn{padding:5px 10px;border:1px solid var(--background, #e8e4dc);border-radius:4px;background:var(--surface, #f5f2eb);color:var(--text, #1a1a1a);font-family:var(--font-mono, monospace);font-size:10px;font-weight:700;text-transform:uppercase;cursor:pointer;transition:all .15s;white-space:nowrap}.hub-btn:hover:not(:disabled){background:var(--background, #e8e4dc)}.hub-btn:disabled{opacity:.5;cursor:not-allowed}.hub-btn.primary{background:var(--secondary, #d35400);color:#fff;border-color:var(--secondary, #d35400)}.hub-btn.primary:hover:not(:disabled){filter:brightness(1.1)}.hub-btn.danger{background:#e74c3c;color:#fff;border-color:#e74c3c}.hub-btn.danger:hover:not(:disabled){background:#c0392b}.hub-btn.danger-subtle{color:#e74c3c;border-color:transparent;background:none;padding:4px 6px}.hub-btn.danger-subtle:hover:not(:disabled){background:#e74c3c1a}.hub-btn.following{background:var(--accent, #2d5a4a);color:#fff;border-color:var(--accent, #2d5a4a)}.hub-btn.admin-btn{background:#d354001a;color:var(--secondary, #d35400);border-color:#d354004d}.hub-btn.admin-btn:hover:not(:disabled){background:#d3540033}.hub-btn.icon-btn{padding:4px 7px}.hub-btn.small{padding:3px 7px;font-size:9px}.hub-btn.visibility-btn{padding:4px 7px;font-size:14px;background:none;border-color:transparent}.hub-btn.visibility-btn.public{color:var(--accent, #2d5a4a)}.hub-refresh-btn{padding:3px 8px;border:1px solid var(--background, #e8e4dc);border-radius:4px;background:none;color:var(--text-muted, #666);font-size:14px;cursor:pointer;transition:all .15s;line-height:1}.hub-refresh-btn:hover:not(:disabled){color:var(--text, #1a1a1a);background:var(--background, #e8e4dc)}.role-badge{display:inline-block;padding:1px 5px;border-radius:3px;font-size:8px;font-weight:700;text-transform:uppercase;letter-spacing:.3px;line-height:1.4}.role-badge.admin{background:#d3540026;color:var(--secondary, #d35400)}.role-badge.vip{background:#2d5a4a26;color:var(--accent, #2d5a4a)}.official-tag{display:inline-block;padding:1px 5px;border-radius:3px;font-size:8px;font-weight:700;text-transform:uppercase;background:#2d5a4a26;color:var(--accent, #2d5a4a)}.user-item{align-items:center}.user-avatar{width:32px;height:32px;border-radius:50%;object-fit:cover;flex-shrink:0}.user-avatar-placeholder{width:32px;height:32px;border-radius:50%;background:var(--secondary, #d35400);color:#fff;display:flex;align-items:center;justify-content:center;font-weight:700;font-size:13px;flex-shrink:0}.theme-list{gap:6px}.theme-item{flex-wrap:wrap}.theme-preview{width:32px;height:32px;border-radius:4px;border:2px solid;flex-shrink:0;overflow:hidden;display:flex;align-items:flex-end}.theme-accent{width:100%;height:8px}.hub-sub-tabs{display:flex;gap:2px;margin-bottom:14px;border-bottom:2px solid var(--background, #e8e4dc);padding-bottom:0}.hub-sub-tab{padding:6px 14px;border:none;border-bottom:2px solid transparent;background:none;font-family:var(--font-mono, monospace);font-size:10px;font-weight:700;text-transform:uppercase;color:var(--text-muted, #666);cursor:pointer;transition:all .15s;margin-bottom:-2px}.hub-sub-tab:hover{color:var(--text, #1a1a1a)}.hub-sub-tab.active{color:var(--accent, #00e5ff);border-bottom-color:var(--accent, #00e5ff);border-bottom-width:3px;font-weight:700;background:color-mix(in srgb,var(--accent, #00e5ff) 8%,transparent)}.hub-ai-samples{padding:8px 0}.ai-sample-list{display:flex;flex-direction:column;gap:0}.ai-sample-item{display:flex;align-items:center;gap:10px}.ai-sample-category-badge{flex-shrink:0;font-size:9px;font-weight:700;letter-spacing:.06em;padding:2px 6px;border-radius:3px;background:#2563eb1f;color:var(--accent, #2563eb);border:1px solid rgba(37,99,235,.25);min-width:52px;text-align:center}.hub-btn.active{background:#2563eb2e;color:var(--accent, #2563eb);border-color:var(--accent, #2563eb)}.hub-media-desc{font-size:10px;color:var(--text-muted, #666);margin:0 0 12px;line-height:1.5}.hub-media-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(120px,1fr));gap:10px}.hub-media-item{background:var(--surface, #f5f2eb);border:1px solid var(--background, #e8e4dc);border-radius:6px;overflow:hidden;position:relative}.media-thumb{width:100%;height:80px;object-fit:cover;display:block}.media-info{padding:4px 6px}.media-name{font-size:9px;color:var(--text-muted, #666);display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.media-delete{position:absolute;top:4px;right:4px;width:20px;height:20px;border-radius:50%;border:none;background:#00000080;color:#fff;font-size:14px;line-height:1;cursor:pointer;display:flex;align-items:center;justify-content:center;opacity:0;transition:opacity .15s}.hub-media-item:hover .media-delete{opacity:1}.media-actions{display:flex;gap:4px;padding:4px 6px}.hub-loading{color:var(--text-muted, #666);font-size:11px;padding:20px;text-align:center}.hub-empty{color:var(--text-muted, #666);font-size:11px;padding:20px;text-align:center;background:var(--surface, #f5f2eb);border:1px dashed var(--background, #e8e4dc);border-radius:6px}.hub-empty.small{padding:8px 12px;font-size:10px;text-align:left}.backup-importer{padding:4px 0}.backup-description{font-size:12px;color:var(--text-muted, #666);line-height:1.5;margin-bottom:16px}.backup-description p{margin:0 0 6px}.backup-description code{font-family:monospace;background:var(--background, #e8e4dc);padding:1px 4px;border-radius:3px;font-size:11px}.backup-tip{background:var(--surface, #f5f2eb);border-left:3px solid var(--secondary, #d35400);padding:8px 10px;border-radius:0 4px 4px 0;font-size:11px;margin-top:6px}.backup-pick-row{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:16px}.backup-pick-btn{font-size:13px;padding:10px 20px}.backup-log{background:var(--display-bg, #0f0f0f);border:1px solid rgba(255,255,255,.08);border-radius:6px;padding:10px 12px;font-family:monospace;font-size:11px;max-height:180px;overflow-y:auto;margin-bottom:8px}.backup-log-line{padding:2px 0;line-height:1.4;color:var(--display-text, #4ade80)}.backup-log-line.ok{color:#4ade80}.backup-log-line.warn{color:#f59e0b}.backup-log-line.err{color:#f87171}.backup-log-line.info{color:#fff9}.backup-projects{margin-top:4px}.backup-errors{margin-top:12px;font-size:11px}.backup-errors strong{display:block;margin-bottom:6px;color:var(--text-muted, #666)}@media(max-width:640px){.hub-sidebar{width:120px;min-width:100px}.hub-nav-label{font-size:9px}.hub-main{padding:12px}}.bm{display:flex;flex-direction:column;gap:14px}.bm-header{display:flex;align-items:center;gap:10px}.bm-updated{font-size:.68rem;color:#666}.bm-stats{display:grid;grid-template-columns:repeat(4,1fr);gap:8px}@media(max-width:600px){.bm-stats{grid-template-columns:repeat(2,1fr)}}.bm-stat{background:#ffffff0a;border:1px solid rgba(255,255,255,.07);border-radius:8px;padding:12px 10px;display:flex;flex-direction:column;align-items:center;gap:4px;text-align:center}.bm-stat-accent{border-color:#d3540066;background:#d3540014}.bm-stat-value{font-size:1.35rem;font-weight:700;color:var(--text, #e8e4dc);line-height:1}.bm-stat-label{font-size:.63rem;color:#777;text-transform:uppercase;letter-spacing:.05em}.bm-block{background:#ffffff06;border:1px solid rgba(255,255,255,.06);border-radius:8px;padding:12px}.bm-block-title{font-size:10px;font-weight:700;text-transform:uppercase;letter-spacing:.07em;color:#777;margin-bottom:12px;display:flex;align-items:center;justify-content:space-between;gap:8px}.bm-cost-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(155px,1fr));gap:8px}.bm-cost-field{display:flex;flex-direction:column;gap:3px}.bm-cost-label{font-size:.63rem;color:#888;text-transform:uppercase;letter-spacing:.04em;line-height:1.3}.bm-cost-hint{font-size:.6rem;color:#555;font-style:italic}.bm-note{font-size:.68rem;color:#555;font-style:italic}.bm-pnl{display:flex;flex-direction:column;gap:4px;margin-bottom:14px}.bm-pnl-row{display:flex;justify-content:space-between;align-items:center;font-size:.77rem;color:#bbb;padding:3px 0}.bm-pnl-bold{font-weight:700;color:var(--text, #e8e4dc)}.bm-divider{height:1px;background:#ffffff12;margin:4px 0}.bm-green{color:#4ade80}.bm-red{color:#f87171}.bm-amber{color:#fbbf24}.bm-recommend{background:#d3540014;border:1px solid rgba(211,84,0,.22);border-radius:7px;padding:12px 14px}.bm-recommend-label{font-size:.67rem;font-weight:700;text-transform:uppercase;letter-spacing:.06em;color:#d35400;margin-bottom:6px}.bm-recommend-body{display:flex;align-items:baseline;gap:12px;margin-bottom:6px;flex-wrap:wrap}.bm-recommend-price{font-size:1.3rem;font-weight:700;color:#fb923c}.bm-recommend-sub{font-size:.74rem;color:#999}.bm-recommend-note{font-size:.68rem;color:#666;margin:0;line-height:1.5}.bm-hours-summary{font-size:.68rem;color:#666;font-weight:400;text-transform:none;letter-spacing:0}.bm-hours-add{display:flex;gap:6px;margin-bottom:10px;flex-wrap:wrap;align-items:center}.bm-date-input{max-width:130px}.bm-hrs-input{max-width:72px}.bm-desc-input{flex:1;min-width:140px}.bm-hours-table{display:flex;flex-direction:column;gap:2px;max-height:260px;overflow-y:auto}.bm-hours-header{display:grid;grid-template-columns:92px 52px 1fr 22px;gap:6px;font-size:.63rem;font-weight:700;text-transform:uppercase;letter-spacing:.06em;color:#555;padding:0 4px 6px;border-bottom:1px solid rgba(255,255,255,.07);position:sticky;top:0;background:inherit}.bm-hours-row{display:grid;grid-template-columns:92px 52px 1fr 22px;gap:6px;font-size:.75rem;color:#bbb;padding:4px;border-radius:4px;align-items:center;transition:background .1s}.bm-hours-row:hover{background:#ffffff08}.bm-h-date{color:#666;font-size:.7rem}.bm-h-hrs{color:#fb923c;font-weight:600}.bm-hours-del{background:none;border:none;color:#444;cursor:pointer;font-size:15px;padding:0;line-height:1;border-radius:3px;transition:color .12s}.bm-hours-del:hover{color:#f87171}.bm-loading,.bm-empty{font-size:.74rem;color:#555;text-align:center;padding:14px;font-style:italic}.admin-panel{background:var(--surface, #f5f2eb);border:2px solid var(--secondary, #d35400);border-radius:8px;padding:16px;margin-top:16px}.admin-header{display:flex;align-items:center;gap:12px;margin-bottom:16px;padding-bottom:12px;border-bottom:1px solid var(--border, #ccc)}.admin-header h3{margin:0;font-size:14px;font-weight:700;color:var(--text, #1a1a1a)}.admin-badge{background:var(--secondary, #d35400);color:#fff;font-size:9px;font-weight:700;padding:2px 6px;border-radius:3px;letter-spacing:.5px}.admin-section{margin-bottom:16px;padding-bottom:12px;border-bottom:1px dashed var(--border, #ccc)}.admin-section:last-of-type{border-bottom:none;margin-bottom:12px}.admin-section h4{margin:0 0 8px;font-size:12px;font-weight:600;color:var(--text, #1a1a1a)}.admin-description{font-size:11px;color:var(--text-muted, #666);margin:0 0 12px;line-height:1.4}.admin-row{display:flex;align-items:center;gap:12px}.admin-btn{padding:8px 16px;font-size:11px;font-weight:600;border:1px solid var(--border, #ccc);border-radius:4px;background:var(--background, #e8e4dc);color:var(--text, #1a1a1a);cursor:pointer;transition:all .15s ease}.admin-btn:hover:not(:disabled){background:var(--surface, #f5f2eb);border-color:var(--secondary, #d35400)}.admin-btn:disabled{opacity:.5;cursor:not-allowed}.admin-btn.primary{background:var(--secondary, #d35400);color:#fff;border-color:var(--secondary, #d35400)}.admin-btn.primary:hover:not(:disabled){background:#e67e22;border-color:#e67e22}.seed-status{font-size:11px;font-weight:600}.seed-status.seeded{color:var(--accent, #27ae60)}.seed-status.not-seeded{color:var(--secondary, #d35400)}.admin-status{padding:10px 12px;border-radius:4px;font-size:11px;font-weight:500;margin-bottom:12px}.admin-status.idle{background:var(--background, #e8e4dc);color:var(--text-muted, #666)}.admin-status.success{background:#27ae6026;color:#27ae60;border:1px solid rgba(39,174,96,.3)}.admin-status.error{background:#e74c3c26;color:#e74c3c;border:1px solid rgba(231,76,60,.3)}.admin-info{background:var(--background, #e8e4dc);padding:10px 12px;border-radius:4px;font-size:10px;color:var(--text-muted, #666)}.admin-info p{margin:0;line-height:1.6}.admin-info strong{color:var(--text, #1a1a1a)}.admin-input-group{margin-bottom:12px}.admin-input-group label{display:block;font-size:10px;font-weight:600;color:var(--text, #1a1a1a);margin-bottom:4px}.admin-input{width:100%;padding:8px 10px;font-size:11px;font-family:monospace;border:1px solid var(--border, #ccc);border-radius:4px;background:var(--background, #e8e4dc);color:var(--text, #1a1a1a);transition:border-color .15s}.admin-input:focus{outline:none;border-color:var(--secondary, #d35400)}.admin-input::placeholder{color:var(--text-muted, #999)}.input-hint{display:block;font-size:9px;color:var(--text-muted, #666);margin-top:4px}.admin-description a{color:var(--secondary, #d35400);text-decoration:none}.admin-description a:hover{text-decoration:underline}.admin-section-toggle{display:flex;align-items:center;justify-content:space-between;cursor:pointer;padding:2px 0 6px;-webkit-user-select:none;user-select:none}.admin-section-toggle:hover h4{color:var(--secondary, #d35400)}.admin-toggle-icon{font-size:10px;color:var(--text-muted, #666)}.admin-btn.small{padding:4px 8px;font-size:10px;height:26px}.admin-btn.full-width{width:100%;justify-content:center}.admin-btn.danger{border-color:#e74c3c;color:#e74c3c}.admin-btn.danger:hover:not(:disabled){background:#e74c3c1f}.theme-editor{display:flex;gap:12px;margin-top:8px;min-height:320px}.theme-editor-list{flex:0 0 160px;display:flex;flex-direction:column}.theme-editor-list-header{display:flex;align-items:center;justify-content:space-between;font-size:10px;font-weight:600;color:var(--text-muted, #666);margin-bottom:4px;text-transform:uppercase;letter-spacing:.4px}.theme-editor-list-items{flex:1;overflow-y:auto;display:flex;flex-direction:column;gap:2px;max-height:260px;border:1px solid var(--border, rgba(128,128,128,.3));border-radius:4px;padding:4px;background:var(--background, #1a1a1a)}.theme-list-item{display:flex;align-items:center;gap:6px;padding:5px 7px;border-radius:3px;border:1px solid transparent;cursor:pointer;text-align:left;background:transparent;transition:all .12s}.theme-list-item:hover{background:#8080801f;border-color:#80808040}.theme-list-item.active{background:#8080802e;border-color:var(--secondary, #d35400)}.theme-list-swatch{flex-shrink:0;width:18px;height:18px;border-radius:3px}.theme-list-name{font-size:10px;font-weight:500;color:var(--text, #e8e4dc);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.theme-list-empty{font-size:10px;color:var(--text-muted, #666);padding:8px;text-align:center;line-height:1.4}.theme-editor-form{flex:1;min-width:0;display:flex;flex-direction:column;gap:10px}.theme-editor-form-header{display:flex;align-items:center;gap:8px}.theme-name-input{flex:1;font-size:13px!important;font-weight:600!important}.theme-creating-badge{flex-shrink:0;background:#27ae60;color:#fff;font-size:9px;font-weight:700;padding:2px 6px;border-radius:3px;letter-spacing:.5px}.theme-color-group{border:1px solid rgba(128,128,128,.2);border-radius:4px;padding:8px}.theme-color-group-label{font-size:9px;font-weight:700;color:var(--text-muted, #666);text-transform:uppercase;letter-spacing:.5px;margin-bottom:6px}.theme-color-row{display:flex;flex-wrap:wrap;gap:8px}.theme-color-field{display:flex;flex-direction:column;gap:3px;min-width:80px}.theme-color-label{font-size:9px;font-weight:600;color:var(--text-muted, #888);text-transform:uppercase;letter-spacing:.3px;white-space:nowrap}.theme-color-inputs{display:flex;align-items:center;gap:4px}.theme-color-picker{width:28px;height:24px;padding:1px;border:1px solid rgba(128,128,128,.3);border-radius:3px;cursor:pointer;background:none;flex-shrink:0}.theme-color-hex{width:70px!important;padding:3px 5px!important;font-size:10px!important;font-family:monospace!important;height:24px!important}.theme-mini-preview{border:2px solid;border-radius:6px;padding:8px 10px;display:flex;align-items:center;gap:10px}.theme-preview-pads{display:grid;grid-template-columns:1fr 1fr;gap:3px;flex-shrink:0}.theme-preview-pad{width:14px;height:14px;border-radius:2px}.theme-preview-meta{flex:1;display:flex;flex-direction:column;gap:2px;font-size:10px;font-weight:600}.theme-preview-waveform{display:flex;align-items:flex-end;gap:1px;height:32px;flex-shrink:0}.theme-preview-bar{width:3px;border-radius:1px;opacity:.85}.theme-editor-actions{display:flex;gap:6px;flex-wrap:wrap}@media(max-width:600px){.theme-editor{flex-direction:column}.theme-editor-list{flex:none}.theme-editor-list-items{max-height:120px}.theme-color-row{gap:6px}.theme-color-field{min-width:72px}}.admin-cli-box{margin-top:12px;background:#0a0a0a;border:1px solid #1e1e1e;border-radius:8px;padding:12px 14px}.admin-cli-label{font-size:.68rem;color:#666;margin:0 0 8px;text-transform:uppercase;letter-spacing:.05em}.admin-cli{display:block;font-size:.72rem;color:#22c55e;white-space:pre;overflow-x:auto;line-height:1.7;font-family:IBM Plex Mono,monospace;-webkit-user-select:all;user-select:all}.flag-group{margin-bottom:14px}.flag-group-label{font-size:10px;font-weight:700;text-transform:uppercase;letter-spacing:.07em;color:#666;margin-bottom:5px}.flag-table{display:flex;flex-direction:column;gap:3px}.flag-row{display:grid;grid-template-columns:1fr auto auto;gap:6px;align-items:center;padding:5px 8px;border-radius:5px;background:#ffffff06;border:1px solid rgba(255,255,255,.05);transition:opacity .15s}.flag-row-hidden{opacity:.4}.flag-name{font-size:.78rem;color:var(--text, #e8e4dc)}.flag-toggle,.flag-tier{font-size:.68rem;font-weight:600;padding:3px 9px;border-radius:4px;border:1px solid transparent;cursor:pointer;white-space:nowrap;transition:filter .12s;min-width:72px;text-align:center;line-height:1.4}.flag-toggle:hover,.flag-tier:hover{filter:brightness(1.25)}.flag-toggle.flag-visible{background:#166534;color:#bbf7d0;border-color:#15803d}.flag-toggle.flag-hidden{background:#7f1d1d;color:#fecaca;border-color:#991b1b}.flag-tier.flag-free{background:#1e3a5f;color:#bfdbfe;border-color:#1d4ed8}.flag-tier.flag-pro{background:#78350f;color:#fde68a;border-color:#92400e}.branding-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:12px;margin-top:8px}.branding-slot{background:#ffffff0a;border:1px solid rgba(255,255,255,.1);border-radius:8px;padding:12px;display:flex;flex-direction:column;gap:6px}.branding-slot-header{display:flex;justify-content:space-between;align-items:baseline;gap:6px}.branding-slot-label{font-size:.78rem;font-weight:700;color:var(--text, #e8e4dc)}.branding-slot-rec{font-size:.62rem;color:#888;white-space:nowrap}.branding-slot-desc{font-size:.68rem;color:#777;margin:0;line-height:1.4}.branding-preview-box{width:100%;height:72px;background:#0000004d;border:1px dashed rgba(255,255,255,.1);border-radius:6px;display:flex;align-items:center;justify-content:center;overflow:hidden}.branding-preview-img{max-width:100%;max-height:100%;object-fit:contain}.branding-preview-empty{font-size:.68rem;color:#444;font-style:italic}.branding-file-input{position:absolute;width:1px;height:1px;opacity:0;overflow:hidden;clip:rect(0 0 0 0)}.branding-choose-btn{display:inline-block;cursor:pointer;text-align:center;font-size:.72rem}.branding-filename{font-size:.65rem;color:#888;word-break:break-all;line-height:1.3}.branding-live-badge{font-size:.65rem;color:#4ade80;font-weight:600}.tooltip-editor-table{display:flex;flex-direction:column;gap:10px;margin-top:10px;max-height:520px;overflow-y:auto;padding-right:4px}.tooltip-editor-row{display:grid;grid-template-columns:200px 1fr;gap:10px;align-items:start;padding:10px;background:#ffffff08;border:1px solid rgba(255,255,255,.07);border-radius:6px}.tooltip-editor-id{font-size:.68rem;font-weight:700;font-family:var(--font-mono, monospace);color:#d35400;word-break:break-all;padding-top:2px}.tooltip-editor-fields{display:flex;flex-direction:column;gap:6px}.tooltip-editor-textarea{font-size:.72rem;resize:vertical;min-height:56px}.tooltip-editor-url{font-size:.72rem}.free-pro-list{display:flex;flex-direction:column;gap:4px;margin-bottom:4px}.free-pro-item{display:flex;align-items:center;gap:8px;padding:4px 8px;background:var(--surface, #f5f2eb);border:1px solid rgba(128,128,128,.25);border-radius:4px}.free-pro-email{flex:1;font-family:var(--font-mono, monospace);font-size:11px;color:var(--text, #1a1a1a)}.admin-input{padding:6px 10px;border:1px solid rgba(128,128,128,.35);border-radius:4px;background:var(--surface, #f5f2eb);color:var(--text, #1a1a1a);font-family:var(--font-mono, monospace);font-size:12px}.danger-btn{background:transparent!important;border-color:#e74c3c!important;color:#e74c3c!important;padding:2px 8px!important;font-size:16px!important;line-height:1!important}.danger-btn:hover{background:#e74c3c!important;color:#fff!important}.intro-gifs-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(120px,1fr));gap:10px;margin-bottom:14px}.intro-gif-item{position:relative;border-radius:6px;overflow:hidden;border:1px solid rgba(0,0,0,.12);background:#111;transition:border-color .15s ease}.intro-gif-item:hover{border-color:#e74c3c}.intro-gif-preview{width:100%;aspect-ratio:16/9;object-fit:cover;display:block}.intro-gif-name{display:block;font-size:10px;font-weight:600;letter-spacing:.5px;text-transform:uppercase;padding:4px 6px;background:#000000b3;color:#fffc;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.intro-gif-delete{position:absolute;top:4px;right:4px;width:26px;height:26px;padding:0!important;font-size:16px!important;border-radius:50%!important;display:flex;align-items:center;justify-content:center;background:#e74c3c!important;border-color:#ffffff80!important;color:#fff!important;opacity:.85;transition:opacity .15s ease,transform .1s ease!important;cursor:pointer!important}.intro-gif-delete:hover{opacity:1!important;transform:scale(1.15)!important;background:#c0392b!important}.intro-gif-upload-row{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin-top:10px}.intro-gif-name-input{flex:1;min-width:140px;padding:6px 10px;border-radius:4px;border:1px solid var(--secondary, #d35400);background:var(--surface, #fff);color:var(--text, #1a1a1a);font-size:12px}.admin-btn.danger{background:transparent;border-color:#e74c3c;color:#e74c3c}.admin-btn.danger:hover{background:#e74c3c;color:#fff}.css-panel-overlay{position:fixed;inset:0;background:#0000004d;z-index:998;opacity:0;pointer-events:none;transition:opacity .25s ease}.css-panel-overlay.open{opacity:1;pointer-events:auto}.css-panel{position:fixed;top:0;right:0;width:280px;height:100vh;background:var(--surface);border-left:2px solid var(--secondary);z-index:999;display:flex;flex-direction:column;box-shadow:-4px 0 20px #00000026;transform:translate(100%);transition:transform .25s ease}.css-panel.open{transform:translate(0)}.css-panel-header{display:flex;justify-content:space-between;align-items:center;padding:16px 20px;border-bottom:1px solid var(--background)}.css-panel-header h3{margin:0;font-family:var(--font-mono);font-size:14px;font-weight:700;text-transform:uppercase;letter-spacing:1px;color:var(--primary)}.css-panel-close{width:28px;height:28px;border:none;background:var(--background);color:var(--text);font-size:20px;cursor:pointer;border-radius:4px;display:flex;align-items:center;justify-content:center;padding:0;line-height:1}.css-panel-close:hover{background:var(--secondary);color:var(--secondary-contrast, #fff)}.css-panel-header-actions{display:flex;gap:6px;margin-left:auto;margin-right:12px}.css-panel-action-btn{padding:4px 10px;font-family:var(--font-mono);font-size:10px;font-weight:700;text-transform:uppercase;background:var(--background);border:1px solid rgba(128,128,128,.3);border-radius:4px;cursor:pointer;color:var(--text);transition:all .15s ease}.css-panel-action-btn:hover:not(:disabled){background:var(--pad-empty)}.css-panel-action-btn.primary{background:var(--secondary);color:var(--secondary-contrast, #fff);border-color:var(--secondary)}.css-panel-action-btn.primary:hover:not(:disabled){filter:brightness(1.1)}.css-panel-action-btn:disabled{opacity:.6;cursor:not-allowed}.css-panel-action-btn.success{background:#27ae60!important;border-color:#27ae60!important;color:#fff!important}.css-panel-action-btn.error{background:#e74c3c!important;border-color:#e74c3c!important;color:#fff!important}.theme-selector{display:flex;flex-direction:column;gap:8px}.theme-select{width:100%;padding:8px 10px;font-family:var(--font-mono);font-size:11px;border:1px solid rgba(128,128,128,.3);border-radius:4px;background:var(--background);color:var(--text);cursor:pointer}.theme-select:focus{outline:none;border-color:var(--secondary)}.current-theme-preview{display:flex;gap:6px}.theme-color-chip{width:24px;height:24px;border-radius:4px;border:1px solid rgba(128,128,128,.35)}.css-panel-content{flex:1;padding:20px;overflow-y:auto}.css-panel-section{margin-bottom:24px}.css-panel-label{display:block;font-family:var(--font-mono);font-size:10px;font-weight:700;text-transform:uppercase;letter-spacing:.5px;color:var(--text-muted);margin-bottom:12px}.css-panel-layout-btns{display:flex;gap:6px}.css-panel-layout-btn{flex:1;padding:8px 12px;border:2px solid var(--background);background:var(--background);color:var(--text);font-family:var(--font-mono);font-size:10px;font-weight:700;text-transform:uppercase;letter-spacing:.5px;cursor:pointer;border-radius:4px;transition:all .15s ease}.css-panel-layout-btn:hover{border-color:var(--secondary)}.css-panel-layout-btn.active{background:var(--secondary);border-color:var(--secondary);color:var(--secondary-contrast, #fff)}.css-panel-file-input{display:none}.css-panel-upload-btn{display:block;width:100%;padding:12px 16px;background:var(--background);border:2px dashed var(--text-muted);color:var(--text);font-family:var(--font-mono);font-size:12px;text-align:center;cursor:pointer;border-radius:6px;transition:all .15s ease}.css-panel-upload-btn:hover{border-color:var(--secondary);color:var(--secondary);background:var(--surface)}.bg-mode-row{display:flex;gap:4px;margin-bottom:8px}.bg-mode-btn{flex:1;padding:6px 0;font-family:var(--font-mono);font-size:10px;font-weight:700;text-transform:uppercase;letter-spacing:.5px;background:var(--background);border:1px solid rgba(128,128,128,.3);color:var(--text-muted);cursor:pointer;border-radius:4px;transition:all .15s ease}.bg-mode-btn:hover{border-color:var(--secondary);color:var(--text)}.bg-mode-btn.active{background:var(--secondary);color:var(--secondary-contrast, #fff);border-color:var(--secondary)}.bg-opacity-row,.bg-grid-cols-row{display:flex;align-items:center;gap:8px;margin-bottom:8px}.bg-opacity-label{font-family:var(--font-mono);font-size:9px;font-weight:700;text-transform:uppercase;color:var(--text-muted);min-width:44px;flex-shrink:0}.bg-opacity-slider{flex:1;height:4px;-webkit-appearance:none;appearance:none;background:#8080804d;border-radius:2px;cursor:pointer;outline:none}.bg-opacity-slider::-webkit-slider-thumb{-webkit-appearance:none;width:14px;height:14px;border-radius:50%;background:var(--secondary, #d35400);cursor:pointer;border:2px solid rgba(255,255,255,.15);box-shadow:0 1px 3px #0000004d}.bg-opacity-slider::-moz-range-thumb{width:14px;height:14px;border-radius:50%;background:var(--secondary, #d35400);cursor:pointer;border:2px solid rgba(255,255,255,.15);box-shadow:0 1px 3px #0000004d}.bg-opacity-value{font-family:var(--font-mono);font-size:10px;color:var(--text-muted);min-width:28px;text-align:right;flex-shrink:0}.css-panel-backgrounds{display:grid;grid-template-columns:repeat(5,1fr);gap:8px}.css-panel-bg-item{position:relative}.css-panel-bg-thumb{width:100%;aspect-ratio:1;border:2px solid var(--background);border-radius:6px;background-size:cover;background-position:center;cursor:pointer;transition:all .15s ease;padding:0}.css-panel-bg-thumb:hover{border-color:var(--secondary)}.css-panel-bg-thumb.active{border-color:var(--secondary);box-shadow:0 0 0 2px var(--secondary)}.css-panel-bg-thumb .bg-none{font-family:var(--font-mono);font-size:9px;color:var(--text-muted);text-transform:uppercase}.css-panel-bg-remove{position:absolute;top:-6px;right:-6px;width:18px;height:18px;border:none;background:var(--secondary);color:var(--secondary-contrast, #fff);font-size:12px;border-radius:50%;cursor:pointer;display:flex;align-items:center;justify-content:center;padding:0;line-height:1;opacity:0;transition:opacity .15s ease}.css-panel-bg-item:hover .css-panel-bg-remove{opacity:1}.css-panel-bg-remove:hover{background:#c0392b}.css-panel-restore-btn{width:100%;margin-top:12px;padding:10px 16px;background:transparent;border:1px solid var(--text-muted);color:var(--text-muted);font-family:var(--font-mono);font-size:11px;text-transform:uppercase;letter-spacing:.5px;cursor:pointer;border-radius:4px;transition:all .15s ease}.css-panel-restore-btn:hover{border-color:var(--secondary);color:var(--secondary)}.css-panel-divider{padding-top:16px;margin-top:8px;border-top:1px solid var(--background)}.logo-upload-row{display:flex;align-items:center;gap:10px}.logo-preview-container{position:relative;flex-shrink:0}.logo-preview{width:60px;height:40px;object-fit:contain;border:2px solid var(--background);border-radius:4px;background:var(--surface)}.logo-remove-btn{position:absolute;top:-6px;right:-6px;width:18px;height:18px;border:none;background:var(--secondary);color:var(--secondary-contrast, #fff);font-size:12px;border-radius:50%;cursor:pointer;display:flex;align-items:center;justify-content:center;padding:0;line-height:1}.logo-remove-btn:hover{background:#c0392b}.logo-default-text{font-family:var(--font-mono);font-size:10px;color:var(--text-muted);flex:1}.title-text-preview{display:flex;align-items:center;gap:6px;position:relative;flex:1}.title-text-value{font-family:var(--font-mono);font-size:12px;font-weight:700;color:var(--text);background:var(--background);padding:4px 8px;border-radius:4px;max-width:120px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.logo-upload-btn{padding:6px 12px;background:var(--secondary);border:none;color:var(--secondary-contrast, #fff);font-family:var(--font-mono);font-size:10px;font-weight:700;text-transform:uppercase;letter-spacing:.5px;cursor:pointer;border-radius:4px;transition:all .15s ease}.logo-upload-btn:hover{background:#e67e22}.logo-upload-btn.active{background:var(--primary);color:var(--surface)}.logo-url-row{display:flex;align-items:center;gap:6px;margin-top:8px}.logo-url-input{flex:1;padding:6px 8px;border:1px solid var(--background);border-radius:4px;font-family:var(--font-mono);font-size:10px;color:var(--text);background:var(--surface)}.logo-url-input:focus{outline:none;border-color:var(--secondary)}.logo-url-input::placeholder{color:var(--text-muted);opacity:.7}.logo-url-submit{padding:6px 10px;background:var(--accent);border:none;color:#fff;font-family:var(--font-mono);font-size:10px;font-weight:700;text-transform:uppercase;cursor:pointer;border-radius:4px;transition:all .15s ease}.logo-url-submit:hover{background:#3d6a5a}.pad-bg-color-row{display:flex;align-items:center;gap:8px;margin-bottom:12px}.pad-bg-color-input{width:36px;height:36px;padding:0;border:2px solid var(--background);border-radius:6px;cursor:pointer;background:none}.pad-bg-color-input::-webkit-color-swatch-wrapper{padding:2px}.pad-bg-color-input::-webkit-color-swatch{border:none;border-radius:4px}.pad-bg-color-input:hover{border-color:var(--secondary)}.pad-bg-opacity-slider{flex:1;height:6px;-webkit-appearance:none;appearance:none;background:var(--background);border-radius:3px;cursor:pointer}.pad-bg-opacity-slider::-webkit-slider-thumb{-webkit-appearance:none;width:14px;height:14px;background:var(--secondary);border-radius:50%;cursor:pointer;border:2px solid white;box-shadow:0 1px 3px #0003}.pad-bg-opacity-slider::-moz-range-thumb{width:14px;height:14px;background:var(--secondary);border-radius:50%;cursor:pointer;border:2px solid white;box-shadow:0 1px 3px #0003}.pad-bg-opacity-value{font-family:var(--font-mono);font-size:10px;color:var(--text-muted);min-width:32px;text-align:right}.pad-bg-add-btn{width:32px;height:32px;border:2px solid var(--secondary);background:var(--secondary);color:var(--secondary-contrast, #fff);font-size:18px;font-weight:700;border-radius:6px;cursor:pointer;display:flex;align-items:center;justify-content:center;padding:0;line-height:1;transition:all .15s ease}.pad-bg-add-btn:hover{background:#e67e22;border-color:#e67e22}.pad-bg-upload{margin-top:0;font-size:10px}.pad-bg-item{display:flex;flex-direction:column;gap:4px}.pad-bg-item-opacity{width:100%;height:4px;-webkit-appearance:none;appearance:none;background:var(--background);border-radius:2px;cursor:pointer;margin-top:2px}.pad-bg-item-opacity::-webkit-slider-thumb{-webkit-appearance:none;width:10px;height:10px;background:var(--secondary);border-radius:50%;cursor:pointer;border:1px solid white}.pad-bg-item-opacity::-moz-range-thumb{width:10px;height:10px;background:var(--secondary);border-radius:50%;cursor:pointer;border:1px solid white}.css-panel-hint{font-family:var(--font-mono);font-size:9px;color:var(--text-muted);margin:0 0 12px}.pad-media-dropzone{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px;padding:16px;border:2px dashed var(--text-muted);border-radius:8px;background:var(--background);transition:all .2s ease;cursor:pointer;min-height:60px}.pad-media-dropzone span{font-family:var(--font-mono);font-size:10px;color:var(--text-muted)}.pad-media-dropzone:hover,.pad-media-dropzone:focus{border-color:var(--secondary);background:var(--surface)}.pad-media-dropzone.drag-over{border-color:var(--secondary);background:#d354001a;border-style:solid}.pad-media-browse-btn{padding:6px 14px;background:var(--secondary);border:none;color:var(--secondary-contrast, #fff);font-family:var(--font-mono);font-size:10px;font-weight:700;text-transform:uppercase;letter-spacing:.5px;cursor:pointer;border-radius:4px;transition:all .15s ease}.pad-media-browse-btn:hover{background:#e67e22}.pad-media-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:8px;margin-top:12px;overflow-y:auto;padding-right:4px}.pad-image-item{position:relative}.pad-image-item.dragging{opacity:.5}.pad-image-thumb{width:100%;aspect-ratio:1;border:2px solid var(--background);border-radius:6px;background-size:cover;background-position:center;cursor:grab;transition:all .15s ease}.pad-image-thumb:hover{border-color:var(--secondary);transform:scale(1.05)}.pad-image-thumb:active{cursor:grabbing}.pad-image-remove{position:absolute;top:-6px;right:-6px;width:16px;height:16px;border:none;background:var(--secondary);color:var(--secondary-contrast, #fff);font-size:11px;border-radius:50%;cursor:pointer;display:flex;align-items:center;justify-content:center;padding:0;line-height:1;opacity:0;transition:opacity .15s ease}.pad-image-item:hover .pad-image-remove{opacity:1}.pad-image-remove:hover{background:#c0392b}.library-tabs{display:flex;gap:4px;margin-bottom:12px;background:var(--background);padding:4px;border-radius:6px}.library-tab{flex:1;padding:8px 12px;border:none;background:transparent;color:var(--text-muted);font-family:var(--font-mono);font-size:10px;font-weight:700;text-transform:uppercase;letter-spacing:.5px;cursor:pointer;border-radius:4px;transition:all .15s ease}.library-tab:hover{color:var(--text)}.library-tab.active{background:var(--secondary);color:var(--secondary-contrast, #fff)}.library-empty{font-family:var(--font-mono);font-size:10px;color:var(--text-muted);text-align:center;padding:20px;background:var(--background);border-radius:6px;margin-top:12px}.waveform-color-row{display:flex;align-items:center;gap:10px}.waveform-color-input{width:40px;height:40px;padding:0;border:2px solid var(--background);border-radius:6px;cursor:pointer;background:none}.waveform-color-input::-webkit-color-swatch-wrapper{padding:2px}.waveform-color-input::-webkit-color-swatch{border:none;border-radius:4px}.waveform-color-value{font-family:var(--font-mono);font-size:11px;color:var(--text-muted);text-transform:uppercase}.waveform-color-reset{font-family:var(--font-mono);font-size:9px;padding:4px 8px;border:1px solid var(--background);background:var(--background);color:var(--text-muted);border-radius:4px;cursor:pointer;text-transform:uppercase;letter-spacing:.3px;transition:all .15s ease}.waveform-color-reset:hover{background:var(--secondary);color:var(--secondary-contrast, #fff);border-color:var(--secondary)}.toggle-row{display:flex;align-items:center;justify-content:space-between;padding:8px 0}.toggle-label{font-family:var(--font-mono);font-size:11px;color:var(--text)}.toggle-btn{padding:6px 14px;border:1px solid var(--background);background:var(--background);color:var(--text-muted);font-family:var(--font-mono);font-size:10px;font-weight:700;text-transform:uppercase;letter-spacing:.5px;cursor:pointer;border-radius:4px;transition:all .15s ease;min-width:50px}.toggle-btn:hover{border-color:var(--secondary)}.toggle-btn.active{background:var(--secondary);color:var(--secondary-contrast, #fff);border-color:var(--secondary)}.accessibility-theme-grid{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-top:4px}.a11y-theme-btn{display:flex;flex-direction:column;align-items:flex-start;gap:6px;padding:10px 10px 8px;border-radius:6px;cursor:pointer;transition:all .15s ease;font-family:var(--font-mono);font-size:9px;font-weight:700;text-transform:uppercase;letter-spacing:.5px;min-height:52px}.a11y-theme-btn:hover{filter:brightness(1.15)}.a11y-theme-btn.active{box-shadow:0 0 0 3px var(--secondary)}.a11y-theme-label{line-height:1.2;word-break:break-word}.a11y-theme-chips{display:flex;gap:4px}.a11y-theme-chips span{display:block;width:10px;height:10px;border-radius:2px}.font-scale-row{display:flex;align-items:center;gap:8px;padding:2px 0}.font-scale-small{font-size:10px;color:var(--text-muted);line-height:1;flex-shrink:0}.font-scale-large{font-size:16px;color:var(--text-muted);line-height:1;flex-shrink:0}.font-scale-slider{flex:1;height:4px;cursor:pointer;accent-color:var(--secondary, #d35400);-webkit-appearance:none;appearance:none;background:#8080804d;border-radius:2px;outline:none}.font-scale-slider::-webkit-slider-thumb{-webkit-appearance:none;appearance:none;width:16px;height:16px;border-radius:50%;background:var(--secondary, #d35400);cursor:pointer;border:2px solid rgba(255,255,255,.15);box-shadow:0 1px 3px #0006}.font-scale-slider::-moz-range-thumb{width:16px;height:16px;border-radius:50%;background:var(--secondary, #d35400);cursor:pointer;border:2px solid rgba(255,255,255,.15);box-shadow:0 1px 3px #0006}.font-scale-slider::-webkit-slider-runnable-track{background:#8080804d;border-radius:2px;height:4px}.font-scale-slider::-moz-range-track{background:#8080804d;border-radius:2px;height:4px}.font-scale-input{width:40px;padding:2px 4px;font-size:10px;font-weight:600;font-family:monospace;border:1px solid rgba(128,128,128,.3);border-radius:3px;background:transparent;color:var(--text-muted);text-align:center;cursor:text;-moz-appearance:textfield;flex-shrink:0}.font-scale-input::-webkit-inner-spin-button,.font-scale-input::-webkit-outer-spin-button{-webkit-appearance:none;margin:0}.font-scale-input:focus{outline:none;border-color:var(--secondary, #d35400);color:var(--secondary, #d35400)}.font-scale-reset{flex-shrink:0;padding:2px 5px;font-size:13px;border:1px solid rgba(128,128,128,.3);border-radius:3px;background:transparent;color:var(--text-muted);cursor:pointer;transition:opacity .15s,color .15s,border-color .15s;line-height:1}.font-scale-reset:hover{border-color:var(--secondary, #d35400);color:var(--secondary, #d35400)}.css-panel-trigger{height:36px;padding:0 10px;gap:5px;border:1px solid rgba(128,128,128,.3);background:transparent;color:var(--secondary, #d35400);border-radius:6px;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:all .15s ease;flex-shrink:0}.css-panel-trigger-label{font-family:var(--font-mono, monospace);font-size:10px;font-weight:700;letter-spacing:.8px;white-space:nowrap}.css-panel-trigger:hover{background:var(--secondary, #d35400);border-color:var(--secondary, #d35400);color:var(--secondary-contrast, #fff)}.css-panel-trigger:active{transform:scale(.95)}.css-panel-trigger svg{transition:transform .3s ease}.css-panel-trigger:hover svg{transform:rotate(45deg)}.tab-container{display:flex;flex-direction:column;height:100%;min-height:0;overflow:hidden}.tab-bar{display:flex;gap:2px;padding:4px 4px 0;background:var(--background);flex-shrink:0;border-bottom:1px solid var(--secondary)}.tab-button{display:flex;align-items:center;gap:4px;padding:6px 12px;font-family:var(--font-mono);font-size:12px;font-weight:600;letter-spacing:1px;text-transform:uppercase;background:var(--background);color:var(--text);border:1px solid rgba(128,128,128,.35);border-bottom:none;border-radius:4px 4px 0 0;cursor:pointer;transition:all .15s ease}.tab-button:hover{color:var(--accent-contrast, #fff);background:var(--accent);border-color:var(--accent);opacity:.85}.tab-button.active{color:var(--accent-contrast, #fff);background:var(--accent);border-color:var(--accent);border-bottom:2px solid var(--accent);margin-bottom:-1px;z-index:1;font-weight:700}.tab-icon{font-size:14px;opacity:.8}.tab-label{white-space:nowrap}.tab-content{flex:1;min-height:0;background:var(--surface);border:1px solid var(--secondary);border-radius:0 4px 4px;overflow:hidden;isolation:isolate}.tab-panel{height:100%;overflow:hidden;display:flex;flex-direction:column}.tab-panel[style*="display: none"]{pointer-events:none;visibility:hidden}@media(max-width:768px){.tab-bar{overflow-x:auto;overflow-y:hidden;flex-wrap:nowrap;-webkit-overflow-scrolling:touch;scrollbar-width:none;scroll-behavior:smooth}.tab-bar::-webkit-scrollbar{display:none}.tab-button{flex-shrink:0;padding:5px 10px;font-size:10px}}@media(max-width:500px){.tab-button{padding:4px 8px;font-size:9px}.tab-icon{display:none}}.midi-panel{display:flex;flex-direction:column;height:100%;gap:4px;padding:8px;overflow:hidden}.midi-header{flex-shrink:0;position:relative}.midi-devices-row{display:flex;align-items:center;justify-content:flex-start;gap:6px;padding:5px 8px;background:var(--background);border-radius:6px;min-height:34px;flex-wrap:nowrap;overflow-x:auto}.midi-header-spacer{flex:1}.midi-header-sep{display:inline-block;width:1px;height:18px;background:#ffffff1f;flex-shrink:0}.devices-section{display:flex;align-items:center;gap:6px;flex-shrink:0}.midi-io-buttons{display:flex;gap:4px}.midi-io-btn{display:flex;align-items:center;gap:4px;padding:6px 12px;border:1px solid var(--text-muted);background:var(--surface);color:var(--text-muted);font-family:var(--font-mono);font-size:10px;font-weight:700;cursor:pointer;border-radius:4px;transition:all .15s ease}.midi-io-btn:hover{border-color:var(--secondary);color:var(--secondary)}.midi-io-btn .io-indicator{width:8px;height:8px;border-radius:50%;background:#666;transition:all .15s ease}.midi-in-btn.connected{border-color:#27ae60;color:#27ae60}.midi-in-btn.connected .io-indicator{background:#27ae60;box-shadow:0 0 6px #27ae60;animation:pulse 1.5s infinite}.midi-out-btn.connected{border-color:#3498db;color:#3498db}.midi-out-btn.connected .io-indicator{background:#3498db;box-shadow:0 0 6px #3498db;animation:pulse 1.5s infinite}.io-label{letter-spacing:.5px}.connected-device{display:flex;align-items:center;gap:6px;padding:4px 8px 4px 6px;background:var(--surface);border-radius:4px;border:1px solid var(--background)}.connected-device.input{border-color:#27ae604d}.connected-device.output{border-color:#3498db4d}.device-indicator{width:8px;height:8px;border-radius:50%;animation:pulse 1.5s infinite}.connected-device.input .device-indicator{background:#27ae60;box-shadow:0 0 6px #27ae60}.connected-device.output .device-indicator{background:#3498db;box-shadow:0 0 6px #3498db}.device-label{font-family:var(--font-mono);font-size:9px;font-weight:600;color:var(--text);max-width:100px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.device-disconnect{width:16px;height:16px;border:none;background:transparent;color:var(--text-muted);font-size:12px;cursor:pointer;border-radius:2px;display:flex;align-items:center;justify-content:center;padding:0;line-height:1;transition:all .15s ease}.device-disconnect:hover{background:#e74c3c;color:#fff}.device-selector-dropdown.input-dropdown,.device-selector-dropdown.output-dropdown{left:auto;right:auto;min-width:200px}.device-selector-dropdown{position:absolute;top:100%;left:0;right:0;background:var(--surface);border:1px solid var(--background);border-radius:6px;box-shadow:0 4px 12px #0003;z-index:100;max-height:200px;overflow-y:auto;display:none;margin-top:4px}.device-selector-dropdown.show{display:block}.dropdown-empty{padding:12px;font-family:var(--font-mono);font-size:10px;color:var(--text-muted);text-align:center}.dropdown-device{display:flex;align-items:center;gap:8px;width:100%;padding:10px 12px;border:none;background:transparent;color:var(--text);font-family:var(--font-mono);font-size:10px;text-align:left;cursor:pointer;transition:background .15s ease}.dropdown-device:hover{background:var(--background)}.device-type-badge{font-size:8px;font-weight:700;padding:2px 6px;border-radius:2px;text-transform:uppercase}.device-type-badge.input{background:#27ae6033;color:#27ae60}.device-type-badge.output{background:#3498db33;color:#3498db}.mode-buttons{display:flex;gap:2px;background:var(--surface);padding:2px;border-radius:4px;flex-shrink:0}.mode-btn{padding:6px 10px;border:none;background:transparent;color:var(--text-muted);font-family:var(--font-mono);font-size:10px;cursor:pointer;border-radius:3px;transition:all .15s ease}.mode-icon{font-size:11px}.log-controls{display:flex;gap:6px;align-items:center}.scroll-lock-btn{padding:4px 8px;border:1px solid var(--text-muted);background:transparent;color:var(--text-muted);font-size:12px;cursor:pointer;border-radius:3px;transition:all .15s ease}.scroll-lock-btn:hover{border-color:var(--secondary)}.scroll-lock-btn.locked{background:var(--secondary);border-color:var(--secondary)}.clear-log-btn{font-family:var(--font-mono);font-size:8px;font-weight:700;padding:4px 10px;background:transparent;color:var(--text-muted);border:1px solid var(--text-muted);border-radius:3px;cursor:pointer;text-transform:uppercase;transition:all .15s ease}.clear-log-btn:hover{background:var(--text-muted);color:var(--surface)}.expand-btn{display:flex;align-items:center;gap:4px;padding:4px 10px;background:var(--surface);border:1px solid var(--text-muted);border-radius:4px;color:var(--text-muted);font-family:var(--font-mono);font-size:10px;font-weight:700;cursor:pointer;transition:all .15s ease}.expand-btn:hover{background:var(--background);color:var(--text);border-color:var(--secondary)}.expand-btn.active{background:var(--secondary);border-color:var(--secondary);color:var(--secondary-contrast, #fff)}.midi-visualization{flex:1;min-height:0;overflow:hidden;border-radius:6px;background:#1a1a1a}.midi-log{height:100%;overflow-y:auto;padding:6px;font-family:var(--font-mono);font-size:9px;position:relative}.midi-log.scroll-locked{border:2px solid var(--secondary);border-radius:6px}.log-empty{color:var(--text-muted);text-align:center;padding:20px}.log-entry{display:flex;align-items:center;gap:6px;padding:3px 6px;border-radius:3px;margin-bottom:2px}.log-entry.midi-in{background:#27ae601a}.log-entry.midi-out{background:#3498db1a}.log-time{color:var(--text-muted);font-size:8px}.log-direction{font-weight:700;width:10px;font-size:8px}.log-direction.in{color:#27ae60}.log-direction.out{color:#3498db}.log-type{color:#f39c12;font-weight:600;min-width:55px}.log-channel{color:#9b59b6;min-width:26px}.log-note{font-weight:600;min-width:30px}.log-velocity,.log-value{color:#3498db;min-width:30px}.log-device{color:var(--text-muted);font-size:8px;margin-left:auto;max-width:80px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.resume-scroll-btn{position:sticky;bottom:0;left:0;right:0;width:100%;padding:8px;background:var(--secondary);color:var(--secondary-contrast, #fff);border:none;font-family:var(--font-mono);font-size:10px;font-weight:600;cursor:pointer;transition:background .15s ease}.resume-scroll-btn:hover{background:#e67e22}.notes-grid{display:grid;grid-template-columns:repeat(16,1fr);grid-template-rows:repeat(8,1fr);gap:2px;height:100%;padding:8px}.note-cell{border-radius:2px;border:1px solid rgba(255,255,255,.05);transition:all .1s ease}.note-cell.active{transform:scale(1.1);box-shadow:0 0 10px currentColor}.spectrum-view{display:flex;flex-direction:column;height:100%;padding:8px;gap:4px}.spectrum-group{display:flex;flex:1;gap:4px;min-height:0}.spectrum-group-label{width:20px;display:flex;align-items:center;justify-content:center;font-family:var(--font-mono);font-size:11px;font-weight:700;color:var(--secondary);flex-shrink:0}.spectrum-group-bars{display:flex;flex:1;gap:2px;align-items:flex-end}.spectrum-bar-container{flex:1;display:flex;flex-direction:column;align-items:center;height:100%;position:relative}.spectrum-bar{width:100%;border-radius:2px 2px 0 0;transition:height .05s ease-out,box-shadow .05s ease-out;margin-top:auto;min-height:2px}.spectrum-bar.active{animation:pulse-glow .2s ease-out}@keyframes pulse-glow{0%{transform:scaleY(1.2)}to{transform:scaleY(1)}}.spectrum-label{font-family:var(--font-mono);font-size:7px;color:var(--text-muted);position:absolute;bottom:-12px}.midi-log::-webkit-scrollbar{width:6px}.midi-log::-webkit-scrollbar-track{background:#2a2a2a;border-radius:3px}.midi-log::-webkit-scrollbar-thumb{background:#444;border-radius:3px}.midi-log::-webkit-scrollbar-thumb:hover{background:#555}.midi-in-label-group{display:flex;align-items:center;gap:5px;flex-shrink:0}.mic-label{font-family:var(--font-mono, monospace);font-size:11px;font-weight:700;color:var(--text-muted, #888);letter-spacing:1px;text-transform:uppercase}.mic-indicator{font-size:9px;color:#555;transition:color .2s,text-shadow .2s}.mic-indicator.connected{color:#22c55e;text-shadow:0 0 5px #22c55e;animation:pulse 1.5s infinite}.mic-select{font-family:var(--font-mono, monospace);font-size:11px;padding:3px 6px;border:1px solid rgba(255,255,255,.12);border-radius:4px;background:var(--surface, #1a1a1a);color:var(--text, #ccc);cursor:pointer;min-width:120px;max-width:200px;height:26px;flex-shrink:1}.mic-select:focus{outline:none;border-color:var(--accent, #ff6600)}.mic-map-group{display:flex;align-items:center;gap:5px;flex-shrink:0}.mic-map-label{font-family:var(--font-mono, monospace);font-size:10px;font-weight:600;color:var(--text-muted, #888);text-transform:uppercase;letter-spacing:.5px}.mic-map-select{font-family:var(--font-mono, monospace);font-size:11px;padding:4px 8px;border:1px solid rgba(255,255,255,.12);border-radius:4px;background:var(--surface, #1a1a1a);color:var(--text, #ccc);cursor:pointer;height:28px}.mic-map-select:focus{outline:none;border-color:var(--accent, #ff6600)}.midi-header,.midi-devices-row{flex-wrap:nowrap!important;overflow-x:auto!important;scrollbar-width:none}.midi-devices-row::-webkit-scrollbar{display:none}.midi-devices-row .midi-io-btn{padding:4px 8px!important;font-size:9px!important;white-space:nowrap}.midi-devices-row .mode-btn{padding:4px 7px!important;font-size:9px!important;white-space:nowrap}.midi-devices-row .expand-btn{padding:3px 8px!important;font-size:9px!important;white-space:nowrap}.midi-devices-row .clear-log-btn{padding:3px 8px!important;font-size:8px!important;white-space:nowrap}.midi-devices-row .scroll-lock-btn{padding:3px 6px!important;font-size:10px!important}.midi-devices-row .mic-select{min-width:90px!important;max-width:160px!important;font-size:10px!important}.midi-devices-row .mic-map-select{min-width:80px!important;max-width:140px!important;font-size:10px!important;padding:3px 5px!important}.midi-devices-row .mic-label{font-size:10px!important;white-space:nowrap}.midi-devices-row .mic-map-label{font-size:9px!important;white-space:nowrap}.midi-devices-row .connected-device{flex-shrink:0}.midi-devices-row .device-label{max-width:70px!important}.mixer{display:flex;flex-direction:column;height:100%;padding:0;gap:0;overflow:hidden;background:#1a1a1a;border-radius:4px}.mixer-header{display:flex;align-items:center;justify-content:flex-start;gap:6px 8px;padding:5px 10px;background:#1a1a1a;border-bottom:1px solid #444;flex-shrink:0;flex-wrap:nowrap;overflow-x:auto}.mixer-header-sep{display:inline-block;width:1px;height:18px;background:#ffffff26;flex-shrink:0}.mixer-title{font-family:var(--font-mono);font-size:14px;font-weight:900;color:#fff;letter-spacing:2px;text-shadow:0 0 6px rgba(255,255,255,.6)}.mixer-header-controls{display:flex;align-items:center;gap:12px}.mixer-style-toggle,.mixer-layout-toggle{display:flex;gap:2px;background:#1a1a1a;padding:2px;border-radius:4px}.layout-btn{font-family:var(--font-mono);font-size:9px;font-weight:700;padding:4px 10px;border:1px solid #444;border-radius:3px;background:#2a2a2a;color:#888;cursor:pointer;transition:all .15s ease;text-transform:uppercase;letter-spacing:.5px}.layout-btn:hover{background:#3a3a3a;color:#ccc;border-color:#666}.layout-btn.active{background:var(--secondary);border-color:var(--secondary);color:var(--secondary-contrast, #fff)}.fullscreen-btn{display:flex;align-items:center;gap:4px;padding:4px 10px;background:var(--surface);border:1px solid var(--text-muted);border-radius:4px;color:var(--text-muted);font-family:var(--font-mono);font-size:10px;font-weight:700;cursor:pointer;transition:all .15s ease}.fullscreen-btn:hover{background:var(--background);color:var(--text);border-color:var(--secondary)}.fullscreen-btn.active{background:var(--secondary);border-color:var(--secondary);color:var(--secondary-contrast, #fff)}.style-btn{display:flex;align-items:center;justify-content:center;width:28px;height:28px;background:var(--surface);border:1px solid var(--text-muted);border-radius:4px;color:var(--text-muted);cursor:pointer;transition:all .15s ease}.style-btn:hover{background:var(--background);color:var(--text)}.style-btn.active{background:var(--secondary);border-color:var(--secondary);color:var(--secondary-contrast, #fff)}.mixer-content{display:flex;flex:1;min-height:0;padding:8px;gap:8px;overflow:hidden}.mixer-channels{display:flex;flex:1;gap:8px;overflow-x:auto;overflow-y:hidden;padding-bottom:4px}.mixer-group{display:flex;flex-direction:column;gap:4px;flex-shrink:0;height:100%}.mixer-group-label{font-family:var(--font-mono);font-size:12px;font-weight:900;color:#fff;text-align:center;padding:4px 6px;background:#000;border-radius:3px;flex-shrink:0;border:1px solid #ff8800;text-shadow:0 0 4px rgba(255,136,0,.8)}.mixer-group-channels{display:flex;gap:2px;flex:1;min-height:0}.mixer-master{flex-shrink:0;padding-left:8px;border-left:2px solid var(--secondary);display:flex;height:100%}.channel-strip.fader-style{display:flex;flex-direction:column;align-items:center;gap:5px;padding:7px 5px;background:#242424;border:1px solid #555;border-radius:4px;width:46px;min-width:46px;height:100%}.channel-strip.fader-style.empty{opacity:.5}.channel-strip.fader-style.playing{box-shadow:0 0 8px var(--pad-playing),inset 0 0 4px #27ae6033}.channel-strip.fader-style.playing .channel-label{color:var(--pad-playing)}.channel-strip.fader-style.master{width:56px;min-width:56px;background:linear-gradient(180deg,var(--secondary) 0%,var(--background) 20%)}.channel-strip.fader-style .channel-label{font-family:var(--font-mono);font-size:10px;font-weight:700;color:#fff;text-align:center;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;width:100%;flex-shrink:0}.channel-strip.fader-style.master .channel-label{color:#fff}.channel-strip.fader-style .eq-section{display:flex;flex-direction:column;gap:2px;width:100%;flex-shrink:0}.eq-control{display:flex;align-items:center;gap:2px}.eq-label{font-family:var(--font-mono);font-size:9px;color:#aaa;width:14px;font-weight:700}.eq-knob{flex:1;height:6px;-webkit-appearance:none;appearance:none;background:#444;border-radius:3px;cursor:pointer}.eq-knob::-webkit-slider-thumb{-webkit-appearance:none;width:14px;height:14px;background:var(--secondary, #d35400);border-radius:50%;cursor:pointer;border:2px solid #fff;box-shadow:0 0 4px #00000080}.eq-value{font-family:var(--font-mono);font-size:8px;color:#ccc;width:16px;text-align:right}.channel-strip.fader-style .pan-section{display:flex;flex-direction:column;align-items:center;gap:2px;width:100%;flex-shrink:0}.pan-label{font-family:var(--font-mono);font-size:9px;color:#aaa;font-weight:700}.pan-slider{width:100%;height:6px;-webkit-appearance:none;appearance:none;background:linear-gradient(90deg,#3498db,#555,#e74c3c);border-radius:3px;cursor:pointer}.pan-slider::-webkit-slider-thumb{-webkit-appearance:none;width:14px;height:14px;background:#fff;border:2px solid var(--secondary, #d35400);border-radius:50%;cursor:pointer;box-shadow:0 0 4px #00000080}.pan-value{font-family:var(--font-mono);font-size:8px;color:#ccc}.channel-strip.fader-style .fader-section{display:flex;flex-direction:row;align-items:stretch;gap:2px;height:20%;min-height:50px;max-height:80px;width:100%;flex-shrink:0}.fader-track{position:relative;flex:1;width:100%;height:100%;background:#1a1a1a;border:1px solid #333;border-radius:3px;overflow:hidden}.fader-meter{position:absolute;bottom:0;left:0;right:0;background:linear-gradient(0deg,var(--pad-playing) 0%,var(--pad-filled) 70%,#e74c3c 100%);opacity:.3;transition:opacity .1s ease;pointer-events:none}.fader-meter.active{opacity:1;animation:meter-pulse .15s ease-out}@keyframes meter-pulse{0%{filter:brightness(1.5)}to{filter:brightness(1)}}.volume-fader{position:relative;writing-mode:vertical-lr;direction:rtl;width:100%;height:100%;-webkit-appearance:none;appearance:none;background:transparent;cursor:pointer;z-index:2}.volume-fader::-webkit-slider-thumb{-webkit-appearance:none;width:28px;height:10px;background:linear-gradient(180deg,var(--surface) 0%,color-mix(in srgb,var(--surface) 70%,#000) 100%);border:1px solid #999;border-radius:2px;cursor:pointer;box-shadow:0 1px 3px #0006}.master-fader{min-height:80px}.volume-value{font-family:var(--font-mono);font-size:11px;font-weight:900;color:#0f8;flex-shrink:0;text-shadow:0 0 4px rgba(0,255,136,.6)}.button-section{display:flex;gap:2px;flex-shrink:0}.mute-btn,.solo-btn{width:16px;height:16px;font-family:var(--font-mono);font-size:8px;font-weight:700;border:none;border-radius:2px;cursor:pointer;transition:all .1s ease;padding:0}.mute-btn{background:var(--surface);color:var(--text-muted)}.mute-btn.active{background:#e74c3c;color:#fff}.solo-btn{background:var(--surface);color:var(--text-muted)}.solo-btn.active{background:#f1c40f;color:var(--text)}.channel-strip.rotary-style{display:flex;flex-direction:column;align-items:center;gap:7px;padding:7px 5px;background:#242424;border:1px solid #555;border-radius:4px;width:64px;min-width:64px;height:100%}.channel-strip.rotary-style.empty{opacity:.5}.channel-strip.rotary-style.playing{box-shadow:0 0 8px var(--pad-playing),inset 0 0 4px #27ae6033}.channel-strip.rotary-style.playing .channel-label{color:var(--pad-playing)}.channel-strip.rotary-style.master{width:72px;min-width:72px;background:linear-gradient(180deg,var(--secondary) 0%,var(--background) 15%)}.channel-strip.rotary-style .channel-label{font-family:var(--font-mono);font-size:10px;font-weight:700;color:#fff;text-align:center;flex-shrink:0}.channel-strip.rotary-style.master .channel-label{color:#fff}.rotary-knob-container{display:flex;flex-direction:column;align-items:center;gap:2px}.rotary-label{font-family:var(--font-mono);font-size:9px;color:#aaa;text-transform:uppercase;font-weight:600}.rotary-knob{cursor:pointer;-webkit-user-select:none;user-select:none}.rotary-knob:hover{filter:brightness(1.1)}.rotary-row{display:flex;gap:4px;flex-shrink:0}.rotary-value{font-size:11px;text-align:center;color:#ddd;font-family:var(--font-mono)}.master-value{font-size:13px;color:#fff}.led-meter{position:absolute;inset:2px;display:flex;flex-direction:column;gap:1px;background:#0a0a0a;border-radius:2px;padding:2px;box-shadow:inset 0 1px 3px #000c;z-index:0;pointer-events:none}.led{flex:1;min-height:2px;border-radius:1px;transition:opacity .05s ease}.led-green{background:#0d2b0d;box-shadow:inset 0 1px #ffffff0d}.led-green.active{background:#2ecc71;box-shadow:0 0 8px #2ecc71,inset 0 1px #ffffff80}.led-yellow{background:#2b2b0d;box-shadow:inset 0 1px #ffffff0d}.led-yellow.active{background:#f39c12;box-shadow:0 0 8px #f39c12,inset 0 1px #ffffff80}.led-red{background:#2b0d0d;box-shadow:inset 0 1px #ffffff0d}.led-red.active{background:#e74c3c;box-shadow:0 0 8px #e74c3c,inset 0 1px #ffffff80}.led.peak{animation:led-peak .15s ease-out}@keyframes led-peak{0%{filter:brightness(1.5);transform:scaleY(1.1)}to{filter:brightness(1);transform:scaleY(1)}}.channel-strip.hybrid-style{display:flex;flex-direction:column;align-items:center;gap:4px;padding:6px 4px;background:#2a2a2a;border:1px solid #444;border-radius:4px;width:48px;min-width:48px;height:100%}.channel-strip.hybrid-style.empty{opacity:.5}.channel-strip.hybrid-style.playing{box-shadow:0 0 10px var(--pad-playing),inset 0 0 6px #27ae604d}.channel-strip.hybrid-style.playing .channel-label{color:var(--pad-playing)}.channel-strip.hybrid-style.master{width:64px;min-width:64px;background:linear-gradient(180deg,var(--secondary) 0%,var(--background) 15%)}.channel-strip.hybrid-style .channel-label{font-family:var(--font-mono);font-size:9px;font-weight:700;color:#fff;text-align:center;flex-shrink:0}.channel-strip.hybrid-style.master .channel-label{color:#fff}.hybrid-eq-row{display:flex;gap:2px;flex-shrink:0}.mini-knob-container{transform:scale(.9)}.hybrid-pan{flex-shrink:0}.hybrid-fader-section{display:flex;align-items:stretch;gap:2px;height:20%;min-height:50px;max-height:80px;width:100%;flex-shrink:0}.hybrid-fader-track{position:relative;flex:1;height:100%}.hybrid-fader{writing-mode:vertical-lr;direction:rtl}.hybrid-volume{font-size:8px;min-width:20px;text-align:center}.hybrid-buttons{flex-shrink:0}.channel-sample-info{display:flex;flex-direction:column;align-items:center;gap:1px;width:100%;padding-top:4px;border-top:1px solid rgba(128,128,128,.25);flex-shrink:0}.channel-sample-info .sample-id{font-family:var(--font-mono);font-size:7px;font-weight:700;color:var(--secondary)}.channel-sample-info .sample-name{font-family:var(--font-mono);font-size:6px;color:var(--text-muted);text-align:center;max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}input[type=range]{-webkit-appearance:none;appearance:none;background:#333;border-radius:4px;cursor:pointer}input[type=range]::-webkit-slider-track{background:#333;border-radius:4px}input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;appearance:none;background:linear-gradient(180deg,var(--surface) 0%,color-mix(in srgb,var(--surface) 80%,#000) 50%,color-mix(in srgb,var(--surface) 60%,#000) 100%);border:2px solid #666;border-radius:4px;cursor:pointer;box-shadow:0 2px 4px #0000004d}input[type=range]::-webkit-slider-thumb:hover{background:linear-gradient(180deg,var(--surface) 0%,color-mix(in srgb,var(--surface) 90%,#000) 50%,color-mix(in srgb,var(--surface) 75%,#000) 100%);border-color:var(--secondary)}.volume-fader::-webkit-slider-thumb{width:24px;height:12px;background:linear-gradient(180deg,#f5f5f5,#e0e0e0 20%,#666 21%,#888,#666 79%,#e0e0e0 80%,#f5f5f5);border:1px solid #444;border-radius:3px;box-shadow:0 2px 4px #0006,inset 0 1px #ffffff4d}.volume-fader::-webkit-slider-thumb:hover{background:linear-gradient(180deg,#fff,#f0f0f0 20%,#777 21%,#999,#777 79%,#f0f0f0 80%,#fff)}.mixer-channels::-webkit-scrollbar{height:6px}.mixer-channels::-webkit-scrollbar-track{background:var(--surface);border-radius:3px}.mixer-channels::-webkit-scrollbar-thumb{background:var(--text-muted);border-radius:3px}.mixer-channels::-webkit-scrollbar-thumb:hover{background:var(--secondary)}.master-fx-buttons{display:flex;gap:4px;flex-shrink:0;margin:4px 0}.master-fx-btn{font-family:var(--font-mono);font-size:8px;font-weight:700;padding:4px 8px;border:1px solid var(--text-muted);border-radius:3px;background:transparent;color:var(--text-muted);cursor:pointer;transition:all .15s ease}.master-fx-btn:hover{border-color:var(--secondary);color:var(--secondary)}.master-fx-btn.active{background:var(--secondary);border-color:var(--secondary);color:var(--secondary-contrast, #fff)}.comp-btn.active{background:#e74c3c;border-color:#e74c3c}.eq-btn.active{background:#3498db;border-color:#3498db}.fx-popup{position:absolute;bottom:100%;right:0;width:320px;background:var(--background);border:1px solid var(--secondary);border-radius:8px;box-shadow:0 -4px 20px #0000004d;z-index:1000;margin-bottom:8px}.eq-popup{width:420px}.fx-popup-header{display:flex;align-items:center;gap:8px;padding:8px 12px;background:var(--secondary);border-radius:7px 7px 0 0}.fx-popup-title{font-family:var(--font-mono);font-size:11px;font-weight:700;color:#fff;flex:1}.fx-bypass-btn{font-family:var(--font-mono);font-size:9px;font-weight:700;padding:4px 10px;border:1px solid rgba(255,255,255,.3);border-radius:3px;background:transparent;color:#ffffffb3;cursor:pointer;transition:all .15s ease}.fx-bypass-btn.active{background:#27ae60;border-color:#27ae60;color:#fff}.fx-popup-close{width:24px;height:24px;border:none;background:transparent;color:#fff;font-size:18px;cursor:pointer;display:flex;align-items:center;justify-content:center;border-radius:4px;transition:background .15s ease}.fx-popup-close:hover{background:#fff3}.fx-row{display:flex;align-items:center;gap:8px;padding:8px 12px;border-bottom:1px solid var(--surface)}.fx-row label{font-family:var(--font-mono);font-size:9px;font-weight:600;color:var(--text-muted);min-width:50px}.fx-model-buttons,.fx-preset-buttons{display:flex;gap:4px;flex:1}.fx-model-buttons button,.fx-preset-buttons button{flex:1;font-family:var(--font-mono);font-size:8px;font-weight:700;padding:6px 8px;border:1px solid var(--text-muted);border-radius:3px;background:transparent;color:var(--text-muted);cursor:pointer;transition:all .15s ease}.fx-model-buttons button:hover,.fx-preset-buttons button:hover{border-color:var(--secondary);color:var(--secondary)}.fx-model-buttons button.active,.fx-preset-buttons button.active{background:var(--secondary);border-color:var(--secondary);color:var(--secondary-contrast, #fff)}.fx-controls{display:grid;grid-template-columns:repeat(2,1fr);gap:8px;padding:12px}.fx-control{display:flex;flex-direction:column;gap:4px}.fx-control label{font-family:var(--font-mono);font-size:8px;font-weight:600;color:var(--text-muted);text-transform:uppercase}.fx-control input[type=range]{width:100%;height:4px;-webkit-appearance:none;appearance:none;background:var(--surface);border-radius:2px;cursor:pointer}.fx-control input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;width:12px;height:12px;background:var(--secondary);border-radius:50%;cursor:pointer}.fx-control span{font-family:var(--font-mono);font-size:9px;color:var(--text);text-align:right}.eq-bands{display:flex;gap:2px;padding:12px}.eq-band{flex:1;display:flex;flex-direction:column;gap:6px;padding:8px;background:var(--surface);border-radius:4px}.eq-band-header{display:flex;align-items:center;justify-content:space-between}.eq-band-header span{font-family:var(--font-mono);font-size:9px;font-weight:700;color:var(--secondary)}.eq-band-header button{font-family:var(--font-mono);font-size:7px;font-weight:700;padding:2px 6px;border:1px solid var(--text-muted);border-radius:2px;background:transparent;color:var(--text-muted);cursor:pointer}.eq-band-header button.active{background:#27ae60;border-color:#27ae60;color:#fff}.eq-band-control{display:flex;flex-direction:column;gap:2px}.eq-band-control label{font-family:var(--font-mono);font-size:7px;color:var(--text-muted)}.eq-band-control input[type=range]{width:100%;height:3px;-webkit-appearance:none;appearance:none;background:var(--background);border-radius:2px;cursor:pointer}.eq-band-control input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;width:10px;height:10px;background:var(--secondary);border-radius:50%;cursor:pointer}.eq-band-control span{font-family:var(--font-mono);font-size:8px;color:var(--text)}.snapshot-control{position:relative}.snapshot-btn{font-family:var(--font-mono);font-size:10px;font-weight:700;padding:4px 10px;border:1px solid var(--text-muted);border-radius:4px;background:transparent;color:var(--text-muted);cursor:pointer;transition:all .15s ease}.snapshot-btn:hover{border-color:var(--secondary);color:var(--secondary)}.snapshot-menu{position:absolute;top:100%;left:0;margin-top:4px;background:var(--background);border:1px solid var(--text-muted);border-radius:6px;box-shadow:0 4px 12px #0003;z-index:100;min-width:150px;overflow:hidden}.snapshot-save{width:100%;padding:10px 12px;border:none;border-bottom:1px solid var(--surface);background:var(--secondary);color:var(--secondary-contrast, #fff);font-family:var(--font-mono);font-size:10px;font-weight:600;cursor:pointer;text-align:left}.snapshot-save:hover{background:#e67e22}.snapshot-empty{padding:12px;font-family:var(--font-mono);font-size:9px;color:var(--text-muted);text-align:center}.snapshot-item{width:100%;padding:10px 12px;border:none;background:transparent;color:var(--text);font-family:var(--font-mono);font-size:10px;text-align:left;cursor:pointer;transition:background .15s ease}.snapshot-item:hover{background:var(--surface)}@media(max-width:800px){.mixer-header,.mixer-header-controls{flex-wrap:wrap;gap:8px}.channel-strip.fader-style{width:36px;min-width:36px}.channel-strip.rotary-style{width:48px;min-width:48px}.channel-strip.hybrid-style{width:42px;min-width:42px}.eq-section,.hybrid-eq-row{display:none}}@media(max-width:600px){.mixer-content{padding:4px;gap:4px}.channel-strip.fader-style{width:32px;min-width:32px;padding:4px 2px}.channel-strip.rotary-style{width:40px;min-width:40px;padding:4px}.channel-strip.hybrid-style{width:36px;min-width:36px;padding:4px 2px}.channel-strip.fader-style .channel-label,.channel-strip.rotary-style .channel-label,.channel-strip.hybrid-style .channel-label{font-size:7px}.rotary-row{flex-direction:column}.hybrid-pan,.channel-sample-info,.pan-section{display:none}.volume-fader::-webkit-slider-thumb{width:20px;height:10px}.fx-popup{width:280px;left:0;right:auto}.eq-popup{width:100%;max-width:340px}.eq-bands{flex-wrap:wrap}.eq-band{min-width:60px}.fx-controls{grid-template-columns:1fr}}@media(max-width:400px){.mixer-header{padding:4px 8px}.mixer-title{font-size:10px}.mixer-style-toggle,.mixer-layout-toggle{gap:2px}.style-btn,.layout-btn{width:24px;height:24px;padding:2px 4px;font-size:7px}.fullscreen-btn span{display:none}.snapshot-btn{font-size:9px;padding:3px 8px}}.channel-strip.layout-ssl{display:flex;flex-direction:column;align-items:center;gap:4px;padding:6px 4px;background:linear-gradient(180deg,#3a3a3a,#2a2a2a);border:1px solid #555;border-radius:4px;width:48px;min-width:48px;height:100%;box-shadow:inset 0 1px #ffffff0d,0 2px 4px #0000004d}.channel-strip.layout-ssl.empty{opacity:.5}.channel-strip.layout-ssl.playing{box-shadow:0 0 12px #f39c12,inset 0 0 6px #f39c124d;border-color:#f39c12}.channel-strip.layout-ssl.master{width:64px;min-width:64px;background:linear-gradient(180deg,#e74c3c,#3a3a3a 15%,#2a2a2a);border-color:#e74c3c}.channel-strip.layout-ssl .channel-label{font-family:var(--font-mono);font-size:12px;font-weight:900;color:#fff;text-align:center;flex-shrink:0;background:#000;padding:4px 5px;border-radius:2px;width:100%;text-shadow:0 0 6px rgba(255,255,255,.8);letter-spacing:.5px;border:1px solid #ffee00}.channel-strip.layout-ssl.master .channel-label{color:#fe0;background:#000;border:2px solid #ffee00;text-shadow:0 0 8px rgba(255,238,0,.9)}.channel-strip.layout-ssl .eq-row{display:flex;gap:2px;flex-shrink:0}.channel-strip.layout-ssl .pan-knob{flex-shrink:0}.channel-strip.layout-ssl .fader-section{display:flex;flex-direction:row;align-items:stretch;gap:2px;flex:1;min-height:60px;width:100%}.mixer-ssl .mute-btn.active{background:#c0392b}.mixer-ssl .solo-btn.active{background:#f39c12;color:var(--text)}.channel-strip.layout-api{display:flex;flex-direction:column;align-items:center;gap:4px;padding:6px 4px;background:linear-gradient(180deg,#2c3e50,#1a252f);border:2px solid #3498db;border-radius:6px;width:52px;min-width:52px;height:100%;box-shadow:inset 0 1px #3498db33,0 2px 8px #0006}.channel-strip.layout-api.empty{opacity:.5;border-color:#555}.channel-strip.layout-api.playing{box-shadow:0 0 15px #1abc9c,inset 0 0 8px #1abc9c4d;border-color:#1abc9c}.channel-strip.layout-api.master{width:68px;min-width:68px;background:linear-gradient(180deg,#9b59b6,#2c3e50 20%,#1a252f);border-color:#9b59b6}.channel-strip.layout-api .channel-label{font-family:var(--font-mono);font-size:12px;font-weight:900;color:#fff;text-align:center;flex-shrink:0;text-transform:uppercase;letter-spacing:1px;background:#1a252f;padding:3px 4px;border-radius:3px;border:1px solid #00ffcc;text-shadow:0 0 6px rgba(0,255,204,.8)}.channel-strip.layout-api.master .channel-label{color:#fff;background:#1a252f;border:2px solid #ff66ff;text-shadow:0 0 8px rgba(255,102,255,.9)}.channel-strip.layout-api .eq-row{display:flex;gap:4px;flex-shrink:0}.channel-strip.layout-api .pan-knob{flex-shrink:0}.channel-strip.layout-api .fader-section{display:flex;flex-direction:row;align-items:stretch;gap:2px;flex:1;min-height:60px;width:100%}.channel-strip.layout-api .button-section{display:flex;gap:3px;flex-shrink:0}.mixer-api .mute-btn{border-radius:4px}.mixer-api .mute-btn.active{background:#e74c3c}.mixer-api .solo-btn{border-radius:4px}.mixer-api .solo-btn.active{background:#1abc9c;color:#fff}.channel-strip.layout-riddim{display:flex;flex-direction:column;align-items:center;gap:3px;padding:4px 3px;background:#f5f2eb;border:1px solid #d4d0c8;border-radius:3px;width:40px;min-width:40px;height:100%;box-shadow:0 1px 3px #0000001a}.channel-strip.layout-riddim.empty{opacity:.6;background:#e8e4dc}.channel-strip.layout-riddim.playing{box-shadow:0 0 8px #d35400,inset 0 0 4px #d3540033;border-color:#d35400}.channel-strip.layout-riddim.master{width:52px;min-width:52px;background:linear-gradient(180deg,#d35400,#f5f2eb 10%);border-color:#d35400}.channel-strip.layout-riddim .channel-label{font-family:var(--font-mono);font-size:10px;font-weight:900;color:var(--text);text-align:center;flex-shrink:0;letter-spacing:.5px;background:#fff;padding:2px 3px;border-radius:2px;border:1px solid #000}.channel-strip.layout-riddim.master .channel-label{color:#fff;background:#c0392b;font-size:11px;font-weight:900;border:2px solid #fff;text-shadow:0 1px 2px rgba(0,0,0,.5)}.channel-strip.layout-riddim .eq-row{display:flex;gap:1px;flex-shrink:0}.channel-strip.layout-riddim .pan-knob{flex-shrink:0}.channel-strip.layout-riddim .fader-section{display:flex;flex-direction:row;align-items:stretch;gap:1px;flex:1;min-height:50px;width:100%}.channel-strip.layout-riddim .fader-track{background:#d4d0c8;border-color:#bbb}.channel-strip.layout-riddim .mute-btn,.channel-strip.layout-riddim .solo-btn{width:14px;height:14px;font-size:7px;border-radius:2px}.channel-strip.layout-riddim .mute-btn{background:#e8e4dc;color:#666;border:1px solid #bbb}.channel-strip.layout-riddim .mute-btn.active{background:#e74c3c;color:#fff;border-color:#c0392b}.channel-strip.layout-riddim .solo-btn{background:#e8e4dc;color:#666;border:1px solid #bbb}.channel-strip.layout-riddim .solo-btn.active{background:#27ae60;color:#fff;border-color:#1e8449}.channel-strip.layout-riddim .led-meter{background:#d4d0c8;box-shadow:inset 0 1px 2px #0003}.channel-strip.layout-riddim .volume-fader::-webkit-slider-thumb{background:linear-gradient(180deg,#f39c12,#d35400);border-color:#c0392b}.channel-strip.layout-riddim .channel-sample-info{border-top-color:#d4d0c8}.channel-strip.layout-riddim .channel-sample-info .sample-id{color:#c0392b;font-size:7px;font-weight:700}.channel-strip.layout-riddim .channel-sample-info .sample-name{font-size:6px;color:var(--text-muted);font-weight:600}.mixer-ssl{background:#1a1a1a}.mixer-ssl .mixer-header{background:linear-gradient(180deg,#3a3a3a,#1a1a1a);border-bottom-color:#f39c12}.mixer-ssl .mixer-group-label{background:#fc0;color:var(--text);font-weight:800}.mixer-api{background:#1a252f}.mixer-api .mixer-header{background:linear-gradient(180deg,#2c3e50,#1a252f);border-bottom-color:#3498db}.mixer-api .mixer-title{color:#5dade2;text-shadow:0 0 2px rgba(93,173,226,.5)}.mixer-api .mixer-group-label{background:#3498db;color:#fff}.mixer-api .mixer-master{border-left-color:#9b59b6}.mixer-riddim{background:#e8e4dc}.mixer-riddim .mixer-header{background:#f5f2eb;border-bottom-color:#d35400}.mixer-riddim .mixer-title{color:var(--text);font-weight:800}.mixer-riddim .mixer-group-label{background:#d35400;color:#fff;font-size:9px}.mixer-riddim .mixer-master{border-left-color:#d35400}.mixer-riddim .mixer-content{background:#e8e4dc}@media(max-width:800px){.channel-strip.layout-ssl,.channel-strip.layout-api{width:42px;min-width:42px}.channel-strip.layout-riddim{width:36px;min-width:36px}.channel-strip.layout-ssl.master,.channel-strip.layout-api.master{width:56px;min-width:56px}.channel-strip.layout-riddim.master{width:44px;min-width:44px}.channel-strip.layout-ssl .eq-row,.channel-strip.layout-api .eq-row,.channel-strip.layout-riddim .eq-row{display:none}}@media(max-width:600px){.channel-strip.layout-ssl,.channel-strip.layout-api{width:36px;min-width:36px;padding:4px 2px}.channel-strip.layout-riddim{width:30px;min-width:30px;padding:3px 2px}.channel-strip.layout-ssl .channel-label,.channel-strip.layout-api .channel-label{font-size:7px}.channel-strip.layout-riddim .channel-label{font-size:6px}.channel-strip.layout-ssl .pan-knob,.channel-strip.layout-api .pan-knob,.channel-strip.layout-riddim .pan-knob,.channel-strip.layout-ssl .channel-sample-info,.channel-strip.layout-api .channel-sample-info,.channel-strip.layout-riddim .channel-sample-info{display:none}}.mixer-fader{background:#0d0d0d}.mixer-fader .mixer-header{background:linear-gradient(180deg,#1a1a1a,#0d0d0d);border-bottom:2px solid #00ff88}.mixer-fader .mixer-title{color:#0f8;font-size:14px;text-shadow:0 0 8px rgba(0,255,136,.6)}.fader-channels{display:flex;flex:1;gap:4px;overflow-x:auto;overflow-y:hidden;padding-bottom:4px;height:100%}.fader-group{display:flex;flex-direction:column;gap:4px;flex-shrink:0;height:100%}.fader-group-label{font-family:var(--font-mono);font-size:12px;font-weight:800;color:#0f8;text-align:center;padding:4px 8px;background:#1a1a1a;border-radius:3px;flex-shrink:0;text-shadow:0 0 6px rgba(0,255,136,.5);letter-spacing:1px}.fader-group-channels{display:flex;gap:3px;flex:1;min-height:0}.fader-master-section{flex-shrink:0;padding-left:12px;border-left:3px solid #ff4444;display:flex;height:100%}.fader-channel{display:flex;flex-direction:column;width:54px;min-width:54px;height:100%;background:linear-gradient(180deg,#1a1a1a,#0a0a0a);border:1px solid #333;border-radius:4px;padding:6px 4px;gap:4px}.fader-channel.empty{opacity:.4}.fader-channel.playing{border-color:#0f8;box-shadow:0 0 12px #0f86,inset 0 0 8px #00ff881a}.fader-channel.master{width:72px;min-width:72px;background:linear-gradient(180deg,#f44,#1a1a1a 15%,#0a0a0a);border-color:#f44}.fader-buttons{display:flex;gap:4px;justify-content:center;flex-shrink:0}.fader-mute,.fader-solo{width:22px;height:22px;font-family:var(--font-mono);font-size:10px;font-weight:800;border:none;border-radius:3px;cursor:pointer;transition:all .1s ease}.fader-mute{background:#2a2a2a;color:#666}.fader-mute.active{background:#f33;color:#fff;box-shadow:0 0 8px #f339}.fader-solo{background:#2a2a2a;color:#666}.fader-solo.active{background:#fc0;color:var(--text);box-shadow:0 0 8px #fc09}.fader-master-label{font-family:var(--font-mono);font-size:10px;font-weight:800;color:#f44;text-shadow:0 0 4px rgba(255,68,68,.6)}.fader-value{font-family:var(--font-mono);font-size:14px;font-weight:800;color:#0f8;text-align:center;flex-shrink:0;text-shadow:0 0 6px rgba(0,255,136,.5)}.fader-value.master-value{color:#f44;font-size:16px;text-shadow:0 0 6px rgba(255,68,68,.5)}.fader-main{flex:1;display:flex;justify-content:stretch;min-height:80px}.fader-track-vertical{position:relative;width:100%;height:100%;background:#0a0a0a;border:2px solid #333;border-radius:4px;overflow:hidden}.fader-track-vertical.master-track{width:100%;border-color:#f44}.fader-track-vertical .led-meter{position:absolute;inset:4px;z-index:0}.fader-slider-vertical{position:absolute;top:0;left:50%;transform:translate(-50%);writing-mode:vertical-lr;direction:rtl;width:100%;height:100%;-webkit-appearance:none;appearance:none;background:transparent;cursor:pointer;z-index:2}.fader-slider-vertical::-webkit-slider-thumb{-webkit-appearance:none;width:36px;height:14px;background:linear-gradient(180deg,#f0f0f0,#ddd 20%,#555 22%,#777,#555 78%,#ddd 80%,#f0f0f0);border:2px solid #00ff88;border-radius:4px;cursor:pointer;box-shadow:0 2px 6px #00000080,0 0 8px #00ff884d}.fader-slider-vertical::-webkit-slider-thumb:hover{border-color:#0fa;box-shadow:0 2px 6px #00000080,0 0 12px #00ff8880}.fader-slider-vertical.master-slider::-webkit-slider-thumb{width:44px;height:16px;border-color:#f44;box-shadow:0 2px 6px #00000080,0 0 8px #ff44444d}.fader-pan-section{display:flex;flex-direction:column;align-items:center;gap:2px;flex-shrink:0;padding:4px 0}.fader-pan-label{font-family:var(--font-mono);font-size:9px;font-weight:700;color:#888;letter-spacing:1px}.fader-pan-slider{width:100%;height:8px;-webkit-appearance:none;appearance:none;background:linear-gradient(90deg,#3498db,#333,#e74c3c);border-radius:4px;cursor:pointer}.fader-pan-slider::-webkit-slider-thumb{-webkit-appearance:none;width:12px;height:16px;background:linear-gradient(180deg,var(--surface) 0%,color-mix(in srgb,var(--surface) 70%,#000) 100%);border:1px solid #666;border-radius:3px;cursor:pointer;box-shadow:0 1px 3px #0006}.fader-name{flex-shrink:0;text-align:center;min-height:20px;display:flex;align-items:center;justify-content:center;cursor:pointer}.fader-name-text{font-family:var(--font-mono);font-size:10px;font-weight:700;color:#fff;text-transform:uppercase;letter-spacing:.5px;padding:2px 4px;background:#222;border-radius:3px;max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.fader-name-text.master-name{color:#f44;text-shadow:0 0 4px rgba(255,68,68,.5);background:#1a0a0a}.fader-name-input{width:100%;font-family:var(--font-mono);font-size:10px;font-weight:700;color:#0f8;background:#000;border:1px solid #00ff88;border-radius:3px;padding:2px 4px;text-align:center;text-transform:uppercase;outline:none}.fader-name:hover .fader-name-text{background:#333}@media(max-width:800px){.fader-channel{width:46px;min-width:46px}.fader-channel.master{width:60px;min-width:60px}.fader-mute,.fader-solo{width:18px;height:18px;font-size:8px}.fader-value{font-size:12px}.fader-track-vertical{width:26px}}@media(max-width:600px){.fader-channel{width:40px;min-width:40px;padding:4px 2px}.fader-channel.master{width:52px;min-width:52px}.fader-pan-section{display:none}.fader-name-text{font-size:8px}.fader-group-label{font-size:10px}}.mixer-header{background:#111;border-bottom:1px solid #333}.mixer-title{font-size:12px;letter-spacing:1px;color:#fff}.layout-btn{font-size:12px;font-weight:700;padding:4px 10px;background:#2a2a2a;color:#ccc;border:1px solid #555;border-radius:3px}.layout-btn:hover{background:#3a3a3a;color:#fff;border-color:#888}.layout-btn.active{background:var(--secondary, #d35400);border-color:var(--secondary, #d35400);color:#fff}.snapshot-btn{font-size:12px;font-weight:700;padding:4px 10px;background:#2a2a2a;color:#ccc;border:1px solid #555;border-radius:3px;cursor:pointer;font-family:var(--font-mono)}.snapshot-btn:hover{background:#3a3a3a;color:#fff;border-color:#888}.fullscreen-btn{font-size:12px;font-weight:700;background:#2a2a2a;color:#ccc;border:1px solid #555}.fullscreen-btn:hover{background:#3a3a3a;color:#fff;border-color:#888}.fullscreen-btn.active{background:var(--secondary, #d35400);border-color:var(--secondary, #d35400);color:#fff}.rotary-knob-container{display:flex;flex-direction:column;align-items:center;gap:0;position:relative}.rotary-label{font-family:var(--font-mono);font-size:7px;font-weight:700;text-transform:uppercase;letter-spacing:.3px;color:#aaa;text-align:center;line-height:1;margin-bottom:1px}.rotary-value{font-family:var(--font-mono);font-size:7px;font-weight:700;color:#666;text-align:center;line-height:1;margin-top:1px;transition:color .1s;white-space:nowrap}.rotary-knob-container.interacting .rotary-value,.rotary-knob-container:hover .rotary-value{color:#fff}.pan-slider-section{display:flex;align-items:center;width:100%;gap:2px;flex-shrink:0;padding:2px}.pan-lr{font-family:var(--font-mono);font-size:7px;font-weight:900;color:#666;flex-shrink:0;line-height:1}.pan-slider-wrap{flex:1;display:flex;flex-direction:column;align-items:center;gap:1px;position:relative}.pan-slider{width:100%;height:4px;-webkit-appearance:none;appearance:none;background:#333;border-radius:2px;outline:none;cursor:pointer}.pan-slider::-webkit-slider-thumb{-webkit-appearance:none;width:8px;height:14px;background:#888;border-radius:2px;cursor:pointer;border:1px solid #555}.pan-slider::-moz-range-thumb{width:8px;height:14px;background:#888;border-radius:2px;cursor:pointer;border:1px solid #555}.pan-value{font-family:var(--font-mono);font-size:6px;font-weight:700;color:#666;text-align:center;line-height:1}.sends-row{display:flex;gap:2px;flex-shrink:0;width:100%;justify-content:center;padding:1px 0}.sends-empty{height:36px}.mixer-returns{display:flex;flex-direction:column;flex-shrink:0;border-left:2px solid #333;padding-left:6px;padding-right:4px}.returns-group-label{font-family:var(--font-mono);font-size:9px;font-weight:900;letter-spacing:1px;text-align:center;padding:4px 6px;border-bottom:1px solid #333;color:#c678dd;text-transform:uppercase;flex-shrink:0}.mixer-group-label{font-family:var(--font-mono);font-size:9px;font-weight:900;letter-spacing:1px;text-align:center;padding:4px 6px;border-bottom:1px solid #444;color:#999;text-transform:uppercase;flex-shrink:0}.return-strip{border-style:dashed!important}.return-reverb .return-label{color:#c678dd!important;border-color:#c678dd!important}.return-delay .return-label{color:#56b6c2!important;border-color:#56b6c2!important}.fader-master-fx{display:flex;gap:3px;flex-shrink:0;padding:2px 0}.fader-fx-btn{flex:1;padding:3px 4px;font-family:var(--font-mono);font-size:8px;font-weight:900;letter-spacing:.3px;text-transform:uppercase;border:1px solid #555;border-radius:3px;background:#252525;color:#999;cursor:pointer;transition:all .12s}.fader-fx-btn:hover{background:#333;color:#fff;border-color:#888}.fader-fx-btn.comp-btn.active{background:#b8860b;color:#fff;border-color:#daa520}.fader-fx-btn.eq-btn.active{background:#1e6b3a;color:#fff;border-color:#2ecc71}.channel-strip.layout-riddim{display:flex;flex-direction:column;align-items:center;gap:3px;padding:5px 3px;background:#0d0d0d;border:1px solid #2a2a2a;border-radius:3px;width:48px;min-width:48px;height:100%;box-shadow:inset 0 0 0 1px #ff66000d}.channel-strip.layout-riddim.empty{opacity:.35}.channel-strip.layout-riddim.has-content{border-color:#2e2218}.channel-strip.layout-riddim.playing{box-shadow:0 0 14px #f609,inset 0 0 6px #ff660026;border-color:#f60}.channel-strip.layout-riddim.master{width:58px;min-width:58px;background:#0d0d0d;border:2px solid #ff6600}.channel-strip.layout-riddim .channel-label{font-family:var(--font-mono);font-size:10px;font-weight:900;color:#ff8c00;text-align:center;flex-shrink:0;background:#000;padding:2px 3px;border-radius:2px;border:1px solid #ff6600;width:100%;letter-spacing:.3px;text-transform:uppercase}.channel-strip.layout-riddim.master .channel-label{background:#f60;color:#fff;border-color:#ff9a3c;font-size:11px}.channel-strip.layout-riddim .eq-row,.channel-strip.layout-riddim .sends-row{display:flex;gap:2px;flex-shrink:0}.channel-strip.layout-riddim .fader-section{display:flex;flex-direction:row;align-items:stretch;gap:2px;flex:1;min-height:38px;width:100%}.channel-strip.layout-riddim .fader-track{background:#1a1a1a;border-color:#2a2a2a}.channel-strip.layout-riddim .volume-fader::-webkit-slider-thumb{background:linear-gradient(180deg,#ff9a3c,#c40);border-color:#f60}.channel-strip.layout-riddim .led-meter{background:#111}.channel-strip.layout-riddim .button-section{display:flex;gap:2px;flex-shrink:0}.channel-strip.layout-riddim .mute-btn,.channel-strip.layout-riddim .solo-btn{width:18px;height:14px;font-size:7px;font-weight:900;border-radius:2px;background:#1a1a1a;color:#555;border:1px solid #2a2a2a;cursor:pointer}.channel-strip.layout-riddim .mute-btn.active{background:#c20;color:#fff;border-color:#f30;box-shadow:0 0 4px #ff000080}.channel-strip.layout-riddim .solo-btn.active{background:#ff8c00;color:#000;border-color:#fa0;box-shadow:0 0 4px #ffaa0080}.channel-strip.layout-riddim .channel-sample-info{border-top-color:#2a2a2a}.channel-strip.layout-riddim .channel-sample-info .sample-id,.channel-strip.layout-riddim .channel-sample-info .sample-name{color:#640}.channel-strip.layout-riddim .pan-slider{background:linear-gradient(to right,#222,#f60,#222)}.channel-strip.layout-riddim .pan-slider::-webkit-slider-thumb{background:#ff9a3c;border-color:#c50}.channel-strip.layout-riddim .pan-lr{color:#444}.channel-strip.layout-riddim .pan-value{color:#f60}.channel-strip.layout-riddim .rotary-label{color:#642}.channel-strip.layout-riddim.return-reverb{border-color:#3d1a52;border-style:dashed}.channel-strip.layout-riddim.return-delay{border-color:#0f3038;border-style:dashed}.channel-strip.layout-ssl{display:flex;flex-direction:column;align-items:center;gap:3px;padding:5px 3px;background:linear-gradient(180deg,#1e1e1e,#141414);border:1px solid #404040;border-radius:4px;width:52px;min-width:52px;height:100%;box-shadow:inset 0 1px #ffffff0a,0 2px 6px #00000080}.channel-strip.layout-ssl.empty{opacity:.4}.channel-strip.layout-ssl.has-content{border-color:#505050}.channel-strip.layout-ssl.playing{box-shadow:0 0 16px #00e67680,inset 0 0 8px #00e67614;border-color:#00e676}.channel-strip.layout-ssl.master{width:62px;min-width:62px;background:linear-gradient(180deg,#021,#1e1e1e 20%);border:2px solid #00e676}.channel-strip.layout-ssl .channel-label{font-family:var(--font-mono);font-size:11px;font-weight:900;color:#fff;text-align:center;flex-shrink:0;background:#000;padding:2px 4px;border-radius:2px;border:1px solid #00e676;width:100%;letter-spacing:.5px;text-shadow:0 0 6px rgba(0,230,118,.7)}.channel-strip.layout-ssl.master .channel-label{background:#00440a;color:#0f8;border:2px solid #00e676;text-shadow:0 0 8px rgba(0,255,136,.9)}.channel-strip.layout-ssl .eq-row,.channel-strip.layout-ssl .sends-row{display:flex;gap:2px;flex-shrink:0}.channel-strip.layout-ssl .fader-section{display:flex;flex-direction:row;align-items:stretch;gap:2px;flex:1;min-height:38px;width:100%}.channel-strip.layout-ssl .fader-track{background:#0a0a0a;border-color:#333}.channel-strip.layout-ssl .volume-fader::-webkit-slider-thumb{background:linear-gradient(180deg,#00e676,#00882c);border-color:#0c5;box-shadow:0 0 4px #00e67699}.channel-strip.layout-ssl .led-meter{background:#0a0a0a}.channel-strip.layout-ssl .button-section{display:flex;gap:2px;flex-shrink:0}.channel-strip.layout-ssl .mute-btn,.channel-strip.layout-ssl .solo-btn{width:18px;height:14px;font-size:7px;font-weight:900;border-radius:2px;background:#1a1a1a;color:#666;border:1px solid #404040;cursor:pointer}.channel-strip.layout-ssl .mute-btn.active{background:#c62828;color:#fff;border-color:#ef5350;box-shadow:0 0 4px #ef535099}.channel-strip.layout-ssl .solo-btn.active{background:#f9a825;color:#000;border-color:#fdd835;box-shadow:0 0 4px #fdd83599}.channel-strip.layout-ssl .channel-sample-info{border-top-color:#333}.channel-strip.layout-ssl .channel-sample-info .sample-id,.channel-strip.layout-ssl .channel-sample-info .sample-name{color:#5a7a5a}.channel-strip.layout-ssl .pan-slider{background:linear-gradient(to right,#111,#00e676,#111)}.channel-strip.layout-ssl .pan-slider::-webkit-slider-thumb{background:#00e676;border-color:#093}.channel-strip.layout-ssl .pan-lr{color:#3a6a3a}.channel-strip.layout-ssl .pan-value{color:#0c5}.channel-strip.layout-ssl .rotary-label{color:#3a6a3a}.mixer-ssl .mute-btn.active{background:#c62828}.mixer-ssl .solo-btn.active{background:#f9a825;color:#000}.channel-strip.layout-api{display:flex;flex-direction:column;align-items:center;gap:3px;padding:5px 3px;background:linear-gradient(180deg,#0f1932,#08101f);border:1px solid #1e3660;border-radius:5px;width:52px;min-width:52px;height:100%;box-shadow:inset 0 1px #3d8eff1a,0 2px 8px #0009}.channel-strip.layout-api.empty{opacity:.35;border-color:#0f1e3a}.channel-strip.layout-api.has-content{border-color:#1e4080}.channel-strip.layout-api.playing{box-shadow:0 0 18px #3d8eff99,inset 0 0 8px #3d8eff1f;border-color:#3d8eff}.channel-strip.layout-api.master{width:62px;min-width:62px;background:linear-gradient(180deg,#050e22,#0f1932);border:2px solid #3d8eff}.channel-strip.layout-api .channel-label{font-family:var(--font-mono);font-size:11px;font-weight:900;color:#b8d4ff;text-align:center;flex-shrink:0;background:#050e22;padding:2px 4px;border-radius:3px;border:1px solid #3d8eff;width:100%;letter-spacing:.5px;text-shadow:0 0 6px rgba(61,142,255,.7)}.channel-strip.layout-api.master .channel-label{background:#0a2060;color:#fff;border:2px solid #5599ff;text-shadow:0 0 8px rgba(85,153,255,.9)}.channel-strip.layout-api .eq-row,.channel-strip.layout-api .sends-row{display:flex;gap:2px;flex-shrink:0}.channel-strip.layout-api .fader-section{display:flex;flex-direction:row;align-items:stretch;gap:2px;flex:1;min-height:38px;width:100%}.channel-strip.layout-api .fader-track{background:#050e22;border-color:#1a3060}.channel-strip.layout-api .volume-fader::-webkit-slider-thumb{background:linear-gradient(180deg,#59f,#1a44bb);border-color:#3d8eff;box-shadow:0 0 4px #3d8effb3}.channel-strip.layout-api .led-meter{background:#05101e}.channel-strip.layout-api .button-section{display:flex;gap:2px;flex-shrink:0}.channel-strip.layout-api .mute-btn,.channel-strip.layout-api .solo-btn{width:18px;height:14px;font-size:7px;font-weight:900;border-radius:3px;background:#0f1932;color:#4a7aaa;border:1px solid #1e3660;cursor:pointer}.channel-strip.layout-api .mute-btn.active{background:#bf360c;color:#fff;border-color:#ff5722;box-shadow:0 0 4px #ff572299}.channel-strip.layout-api .solo-btn.active{background:#006064;color:#00e5ff;border-color:#00bcd4;box-shadow:0 0 4px #00bcd499}.channel-strip.layout-api .channel-sample-info{border-top-color:#1a3060}.channel-strip.layout-api .channel-sample-info .sample-id,.channel-strip.layout-api .channel-sample-info .sample-name{color:#2a5090}.channel-strip.layout-api .pan-slider{background:linear-gradient(to right,#050e22,#3d8eff,#050e22)}.channel-strip.layout-api .pan-slider::-webkit-slider-thumb{background:#59f;border-color:#1a44bb;box-shadow:0 0 3px #3d8effb3}.channel-strip.layout-api .pan-lr{color:#1e4080}.channel-strip.layout-api .pan-value{color:#3d8eff}.channel-strip.layout-api .rotary-label{color:#2a5090}.mixer-api .mute-btn.active{background:#bf360c;border-radius:3px}.mixer-api .solo-btn.active{background:#006064;color:#00e5ff;border-radius:3px}.channel-strip.layout-ssl .fader-section,.channel-strip.layout-api .fader-section{min-height:38px}.master-fx-buttons{display:flex;gap:3px;flex-shrink:0;width:100%}.master-fx-btn{flex:1;padding:3px 2px;font-family:var(--font-mono);font-size:8px;font-weight:900;text-transform:uppercase;letter-spacing:.3px;border:1px solid #555;border-radius:3px;background:#252525;color:#aaa;cursor:pointer;transition:all .12s}.master-fx-btn:hover{background:#333;color:#fff;border-color:#888}.master-fx-btn.comp-btn.active{background:#7a5800;color:#fdd835;border-color:#c69500}.master-fx-btn.eq-btn.active{background:#004d1a;color:#00e676;border-color:#00c853}.mixer-audio-interface-row{display:contents}.audio-if-group{display:flex;align-items:center;gap:6px}.audio-if-label{font-family:var(--font-mono, monospace);font-size:10px;font-weight:700;color:var(--text-muted, #888);letter-spacing:1px;min-width:24px}.audio-if-select{font-family:var(--font-mono, monospace);font-size:11px;padding:2px 6px;border:1px solid rgba(255,255,255,.1);border-radius:4px;background:#0000004d;color:#ccc;cursor:pointer;height:24px;min-width:100px;max-width:180px;flex-shrink:1}.audio-if-select:focus{outline:none;border-color:var(--accent, #ff6600)}.audio-if-refresh{font-size:14px;background:#ffffff0d;border:1px solid rgba(255,255,255,.1);border-radius:4px;color:#888;cursor:pointer;padding:2px 7px;height:26px;line-height:1;transition:color .15s,border-color .15s}.audio-if-refresh:hover{color:#ccc;border-color:#ffffff40}.mixer-riddim .audio-if-label{color:#f60}.mixer-riddim .audio-if-select:focus{border-color:#f60}.mixer-ssl .audio-if-label{color:#00e676}.mixer-ssl .audio-if-select:focus{border-color:#00e676}.mixer-api .audio-if-label{color:#3d8eff}.mixer-api .audio-if-select:focus{border-color:#3d8eff}.knobs-col{display:flex;flex-direction:column;align-items:center;gap:4px;flex-shrink:0;padding:2px 0}.channel-strip .eq-row,.channel-strip .sends-row{display:flex;flex-direction:column;align-items:center;gap:4px;flex-shrink:0}.channel-strip .rotary-label{font-size:8px!important;font-weight:800!important;color:#fff!important;letter-spacing:.5px;text-shadow:0 0 4px rgba(0,0,0,.9)}.channel-strip .rotary-value{font-size:9px!important;font-weight:700!important;color:#fff!important;background:#000000b3;padding:1px 3px;border-radius:2px}.channel-strip .channel-label{font-weight:800!important;color:#fff!important;text-shadow:0 1px 3px rgba(0,0,0,.8)!important}.channel-strip .pan-value{font-weight:700!important;color:#fff!important}.channel-strip .pan-lr{color:#ffffff80!important}.mixer-riddim .channel-strip.layout-riddim{background:#0e0e0e;border:1px solid rgba(255,102,0,.4);border-radius:6px}.mixer-riddim .channel-strip.layout-riddim.has-content{background:#121212;border-color:#ff7800a6;box-shadow:0 0 6px #f603}.mixer-riddim .channel-strip.layout-riddim.playing{background:#191000;border-color:#f60;box-shadow:0 0 10px #ff660073}.mixer-riddim .channel-strip.layout-riddim .channel-label{color:#f60!important;text-shadow:0 0 6px rgba(255,102,0,.6)!important}.mixer-riddim .channel-strip.layout-riddim .sample-name{color:#ddd!important;font-weight:600}.mixer-riddim .channel-strip.layout-riddim .sample-id{color:#f60!important;font-weight:700}.mixer-riddim .channel-strip.layout-riddim .mute-btn{background:#2a2a2a;color:#bbb;border:1px solid #555}.mixer-riddim .channel-strip.layout-riddim .mute-btn.active{background:#c20;color:#fff;border-color:#f30}.mixer-riddim .channel-strip.layout-riddim .solo-btn{background:#2a2a2a;color:#bbb;border:1px solid #555}.mixer-riddim .channel-strip.layout-riddim .solo-btn.active{background:#f60;color:#000;border-color:#f80}.mixer-riddim .channel-strip.layout-riddim.return-reverb{border-color:#9b59b6b3!important;box-shadow:0 0 6px #9b59b633}.mixer-riddim .channel-strip.layout-riddim.return-delay{border-color:#00bcd4b3!important;box-shadow:0 0 6px #00bcd433}.mixer-ssl .channel-strip.layout-ssl{background:#0d0d0d;border:1px solid rgba(0,230,118,.35);border-radius:4px}.mixer-ssl .channel-strip.layout-ssl.has-content{border-color:#00e67699}.mixer-ssl .channel-strip.layout-ssl.playing{border-color:#00e676;box-shadow:0 0 8px #00e67666}.mixer-ssl .channel-strip.layout-ssl .channel-label{color:#00e676!important}.mixer-api .channel-strip.layout-api{background:#0d0d0d;border:1px solid rgba(61,142,255,.35);border-radius:4px}.mixer-api .channel-strip.layout-api.has-content{border-color:#3d8eff99}.mixer-api .channel-strip.layout-api.playing{border-color:#3d8eff;box-shadow:0 0 8px #3d8eff66}.mixer-api .channel-strip.layout-api .channel-label{color:#5fa8ff!important}.channel-strip .fader-section{flex:1 1 80px;min-height:60px;max-height:none}.channel-strip.master-strip .fader-section,.channel-strip.master .fader-section,.master-fader-section{flex:1 1 100px;min-height:80px}.mixer-fader .fader-channels{display:flex;gap:2px;height:100%;overflow-x:auto;padding:6px 8px;background:#0a0a0a}.mixer-fader .fader-group{display:flex;flex-direction:column;border-right:1px solid #333;padding-right:4px}.mixer-fader .fader-group-label{font-family:var(--font-mono, monospace);font-size:11px;font-weight:900;color:#f60;letter-spacing:2px;text-align:center;padding:3px 0;border-bottom:1px solid #ff6600;margin-bottom:4px;text-shadow:0 0 6px rgba(255,102,0,.5)}.mixer-fader .fader-group-channels{display:flex;gap:3px;flex:1}.mixer-fader .fader-channel{background:#111;border:1px solid #2a2a2a;border-top:2px solid #333}.mixer-fader .fader-channel.has-content{background:#141414;border-color:#444;border-top-color:#666}.mixer-fader .fader-channel.playing{background:#131800;border-color:#0f8;border-top-color:#0f8;box-shadow:0 0 8px #00ff8840}.mixer-fader .fader-mute{background:#2a2a2a;color:#bbb;border:1px solid #444}.mixer-fader .fader-mute.active{background:#c20;color:#fff;border-color:#f30;box-shadow:0 0 6px #ff330080}.mixer-fader .fader-solo{background:#2a2a2a;color:#bbb;border:1px solid #444}.mixer-fader .fader-solo.active{background:#c90;color:#000;border-color:#fc0;box-shadow:0 0 6px #ffcc0080}.mixer-fader .fader-value{color:#0f8!important;font-size:12px!important}.mixer-fader .fader-name-text{color:#fff!important;background:#1e1e1e!important;border:1px solid #333}.mixer-fader .fader-pan-label{color:#aaa!important}.mixer-fader .fader-master-section{border-left:2px solid #ff4444;padding-left:6px}.mixer-fader .fader-channel.master{background:#180a0a!important;border-color:#c33!important;border-top-color:#f44!important;box-shadow:0 0 10px #f443}.mixer-fader .fader-master-label{color:#f44!important}.mixer-master-section{display:flex;flex-direction:column;align-items:center;flex-shrink:0;padding:0 4px;border-left:2px solid rgba(255,255,255,.15);gap:4px}.master-section-label{font-family:var(--font-mono, monospace);font-size:9px;font-weight:900;color:#fff;letter-spacing:2px;padding:2px 0;text-shadow:0 0 6px rgba(255,255,255,.3)}.channel-strip.master-strip{display:flex;flex-direction:column;align-items:center;width:52px;min-width:52px;gap:5px;padding:6px 4px;background:#100808;border:1px solid rgba(255,68,68,.5);border-top:3px solid #ff4444;border-radius:4px;box-shadow:0 0 10px #f443}.channel-strip.master-strip .master-fx-btn{display:flex;align-items:center;justify-content:space-between;width:100%;padding:4px 6px;font-family:var(--font-mono, monospace);font-size:9px;font-weight:900;letter-spacing:1px;border-radius:3px;cursor:pointer;transition:all .12s;border:1px solid #444;background:#1a1a1a;color:#888}.channel-strip.master-strip .master-fx-btn:hover{background:#252525;color:#ccc;border-color:#666}.channel-strip.master-strip .master-fx-btn.active.comp-btn{background:#1a0f00;border-color:#c80;color:#fc0;box-shadow:0 0 5px #ffcc004d}.channel-strip.master-strip .master-fx-btn.active.eq-btn{background:#001a10;border-color:#0c6;color:#0f8;box-shadow:0 0 5px #00ff884d}.master-fx-led{display:inline-block;width:6px;height:6px;border-radius:50%;background:#333;border:1px solid #555;flex-shrink:0}.master-fx-led.on{background:#0f8;border-color:#0fa;box-shadow:0 0 4px #00ff88b3}.master-fx-btn.active.comp-btn .master-fx-led.on{background:#fc0;border-color:#ffe066;box-shadow:0 0 4px #ffcc00b3}.master-vol-value{font-family:var(--font-mono, monospace);font-size:13px;font-weight:900;color:#f44!important;text-shadow:0 0 6px rgba(255,68,68,.5)}.channel-strip.master-strip .volume-fader::-webkit-slider-thumb{background:linear-gradient(180deg,#f66,#a22)!important;border-color:#f44!important;width:28px!important;height:12px!important}.return-strip-header{display:flex;align-items:center;justify-content:space-between;width:100%;padding:0 2px;flex-shrink:0}.return-settings-btn{background:none;border:none;font-size:12px;cursor:pointer;opacity:.5;padding:0 2px;transition:opacity .15s;line-height:1}.return-settings-btn:hover,.return-settings-btn.active{opacity:1}.return-settings-popup{position:absolute;bottom:calc(100% + 8px);left:0;z-index:1000;min-width:240px;background:#1a1a1a;border:1px solid #444;border-radius:8px;box-shadow:0 8px 32px #0009;padding:0;overflow:hidden}.return-popup-body{padding:10px 12px;display:flex;flex-direction:column;gap:10px}.return-popup-section{display:flex;flex-direction:column;gap:6px}.return-popup-section-label{font-family:var(--font-mono, monospace);font-size:9px;font-weight:900;color:#888;letter-spacing:2px;border-bottom:1px solid #333;padding-bottom:3px}.return-eq-knobs{display:flex;gap:8px;justify-content:center;padding:4px 0}.return-popup-reset{align-self:flex-end;font-family:var(--font-mono, monospace);font-size:9px;font-weight:700;letter-spacing:1px;padding:4px 10px;background:#2a2a2a;color:#888;border:1px solid #444;border-radius:3px;cursor:pointer;transition:all .12s}.return-popup-reset:hover{background:#333;color:#ccc}.mixer-returns{border-left:2px solid rgba(255,255,255,.12);padding-left:4px}.returns-group-label{font-family:var(--font-mono, monospace);font-size:9px;font-weight:900;color:#888;letter-spacing:2px;text-align:center;padding:2px 0;margin-bottom:2px}.return-strip.layout-reverb{border-color:#9b59b680!important;border-top:2px solid #9b59b6!important}.return-strip.layout-delay{border-color:#00bcd480!important;border-top:2px solid #00bcd4!important}.return-strip.muted{opacity:.55}.mixer-header,.mixer-header-controls{flex-wrap:nowrap!important;overflow-x:auto!important}.mixer-header .layout-btn{padding:3px 7px!important;font-size:9px!important;white-space:nowrap}.mixer-header .fullscreen-btn span,.mixer-header .fullscreen-btn{white-space:nowrap;font-size:9px!important;padding:3px 7px!important}.mixer-header .snapshot-btn{font-size:9px!important;padding:3px 7px!important;white-space:nowrap}.mixer-header .audio-if-select{min-width:80px!important;max-width:150px!important}.mixer-header .mixer-title{white-space:nowrap;flex-shrink:0}.sequencer{display:flex;flex-direction:column;height:100%;background:var(--surface);border-radius:4px;overflow:hidden}.sequencer-header{display:flex;align-items:center;justify-content:flex-start;gap:8px 12px;padding:8px 12px;background:var(--background);border-bottom:1px solid var(--text-muted);flex-shrink:0;flex-wrap:wrap}.sequencer-header>.fullscreen-btn{margin-left:auto}.sequencer-title{font-family:var(--font-mono);font-size:11px;font-weight:700;color:var(--secondary);letter-spacing:1px}.mode-toggle{display:flex;gap:2px;background:var(--surface);padding:2px;border-radius:4px}.mode-btn{font-family:var(--font-mono);font-size:9px;font-weight:700;padding:4px 10px;border:none;border-radius:3px;background:transparent;color:var(--text-muted);cursor:pointer;transition:all .15s ease}.mode-btn:hover{color:var(--text)}.mode-btn.active{background:var(--secondary);color:var(--secondary-contrast, #fff)}.layout-toggle{display:flex;gap:2px;background:var(--surface);padding:2px;border-radius:4px}.layout-btn{font-family:var(--font-mono);font-size:9px;font-weight:700;padding:4px 8px;border:none;border-radius:3px;background:transparent;color:var(--text-muted);cursor:pointer;transition:all .15s ease}.layout-btn:hover{color:var(--text)}.layout-btn.active{background:var(--accent);color:var(--accent-contrast, #fff)}.bpm-section{display:flex;align-items:center;gap:6px}.bpm-label,.sync-label{font-family:var(--font-mono);font-size:8px;color:var(--text-muted)}.bpm-input{width:50px;font-family:var(--font-mono);font-size:12px;font-weight:700;padding:4px 6px;border:1px solid var(--text-muted);border-radius:3px;background:var(--background);color:var(--text);text-align:center}.bpm-input:disabled{opacity:.6}.external-bpm{font-family:var(--font-mono);font-size:8px;color:var(--secondary)}.swing-section{display:flex;align-items:center;gap:5px}.swing-label{font-family:var(--font-mono);font-size:8px;color:var(--text-muted);white-space:nowrap}.swing-slider{-webkit-appearance:none;appearance:none;width:64px;height:4px;border-radius:2px;background:var(--text-muted);outline:none;cursor:pointer}.swing-slider::-webkit-slider-thumb{-webkit-appearance:none;appearance:none;width:12px;height:12px;border-radius:50%;background:var(--secondary, #d35400);cursor:pointer}.swing-slider::-moz-range-thumb{width:12px;height:12px;border-radius:50%;background:var(--secondary, #d35400);cursor:pointer;border:none}.swing-value{font-family:var(--font-mono);font-size:9px;color:var(--text);min-width:28px}.sync-section{display:flex;align-items:center;gap:6px}.sync-buttons{display:flex;gap:2px}.sync-btn{font-family:var(--font-mono);font-size:9px;font-weight:600;padding:4px 8px;border:1px solid var(--text-muted);border-radius:3px;background:var(--surface);color:var(--text-muted);cursor:pointer;transition:all .1s ease}.sync-btn:hover{background:var(--background);color:var(--text)}.sync-btn.active{background:var(--secondary);color:var(--secondary-contrast, #fff);border-color:var(--secondary)}.bars-control{display:flex;align-items:center;gap:4px}.bars-label{font-family:var(--font-mono);font-size:8px;color:var(--text-muted)}.bars-btn-ctrl{width:22px;height:22px;font-size:14px;font-weight:700;border:1px solid var(--text-muted);border-radius:3px;background:var(--surface);color:var(--text);cursor:pointer;transition:all .1s ease;display:flex;align-items:center;justify-content:center}.bars-btn-ctrl:hover:not(:disabled){background:var(--secondary);color:var(--secondary-contrast, #fff);border-color:var(--secondary)}.bars-btn-ctrl:disabled{opacity:.4;cursor:not-allowed}.bars-value{font-family:var(--font-mono);font-size:14px;font-weight:700;color:var(--secondary);min-width:24px;text-align:center}.sequencer .fullscreen-btn{display:flex;align-items:center;gap:4px;padding:4px 10px;background:var(--surface);border:1px solid var(--text-muted);border-radius:4px;color:var(--text-muted);font-family:var(--font-mono);font-size:10px;font-weight:700;cursor:pointer;transition:all .15s ease}.sequencer .fullscreen-btn:hover{background:var(--background);color:var(--text);border-color:var(--secondary)}.sequencer .fullscreen-btn.active{background:var(--secondary);border-color:var(--secondary);color:var(--secondary-contrast, #fff)}.seq-transport-buttons{display:flex;align-items:center;gap:4px}.seq-transport-btn{display:flex;align-items:center;justify-content:center;gap:4px;padding:6px 10px;height:32px;background:var(--surface);border:1px solid rgba(128,128,128,.3);border-radius:4px;color:var(--text);font-family:var(--font-mono);font-size:10px;font-weight:700;cursor:pointer;transition:all .15s ease}.seq-transport-btn:hover{background:var(--background);border-color:var(--secondary)}.seq-transport-btn:active{transform:translateY(1px)}.seq-transport-btn svg{width:12px;height:12px}.seq-transport-btn.rewind-btn:hover,.seq-transport-btn.ff-btn:hover{color:#3498db;border-color:#3498db}.seq-transport-btn.record-btn:hover{color:#e74c3c;border-color:#e74c3c}.seq-transport-btn.record-btn.active{background:#e74c3c;border-color:#e74c3c;color:#fff}.seq-transport-btn.play-btn{color:#27ae60;border-color:#27ae60}.seq-transport-btn.play-btn:hover{background:#27ae6026;color:#27ae60;border-color:#27ae60}.seq-transport-btn.play-btn.active{background:#27ae60;border-color:#27ae60;color:#fff;opacity:1}.seq-transport-btn.stop-btn:hover{color:#f39c12;border-color:#f39c12}.seq-transport-btn:disabled{opacity:.4;cursor:not-allowed}.seq-transport-btn:disabled:hover{transform:none;background:var(--surface);border-color:#8080804d;color:var(--text)}.status-bar{display:flex;align-items:center;gap:16px;padding:6px 12px;background:#0003;border-bottom:1px solid var(--text-muted);flex-shrink:0}.step-display{display:flex;align-items:center;gap:4px;font-family:var(--font-mono);padding:4px 10px;background:var(--background);border-radius:4px}.step-label{font-size:8px;color:var(--text-muted)}.step-value{font-size:14px;font-weight:700;color:var(--secondary)}.step-sep{font-size:10px;color:var(--text-muted)}.step-total{font-size:11px;color:var(--text-muted)}.scene-info{display:flex;align-items:center;gap:8px;font-family:var(--font-mono)}.scene-info-label{font-size:11px;font-weight:600;color:var(--text)}.scene-info-bars{font-size:9px;color:var(--text-muted);background:#0003;padding:2px 6px;border-radius:3px}.playing-indicator{display:flex;align-items:center;gap:6px;font-family:var(--font-mono);font-size:10px;font-weight:600;color:#4ade80;margin-left:auto}.playing-dot{width:8px;height:8px;border-radius:50%;background:#4ade80;animation:pulse-dot 1s ease-in-out infinite}@keyframes pulse-dot{0%,to{opacity:1}50%{opacity:.4}}.sequencer-content{display:flex;flex:1;min-height:0;overflow:hidden}.scene-selector{width:140px;background:var(--background);border-right:1px solid var(--text-muted);display:flex;flex-direction:column;flex-shrink:0}.scene-header{padding:6px 8px;border-bottom:1px solid var(--text-muted)}.scene-header span{font-family:var(--font-mono);font-size:8px;color:var(--text-muted)}.scene-actions{display:flex;gap:4px;margin-top:4px}.scene-actions button{width:24px;height:20px;font-size:12px;border:1px solid var(--text-muted);border-radius:3px;background:var(--surface);color:var(--text);cursor:pointer}.scene-actions button:hover{background:var(--secondary);color:var(--secondary-contrast, #fff);border-color:var(--secondary)}.scene-actions button:disabled{opacity:.5;cursor:not-allowed}.scene-list{flex:1;overflow-y:auto;padding:4px}.scene-item{display:flex;align-items:center;justify-content:space-between;width:100%;padding:8px 10px;margin-bottom:3px;border:1px solid rgba(255,255,255,.15);border-radius:4px;background:#ffffff14;cursor:pointer;transition:all .15s ease}.scene-item:hover{border-color:var(--secondary);background:#d3540026}.scene-item.active{background:var(--secondary);color:var(--secondary-contrast, #fff);border-color:var(--secondary);box-shadow:0 2px 8px #d354004d}.scene-id{font-family:var(--font-mono);font-size:12px;font-weight:700;color:var(--text)}.scene-item.active .scene-id{color:var(--secondary-contrast, #fff)!important}.scene-bars{font-family:var(--font-mono);font-size:9px;color:var(--text-muted);background:#0003;padding:2px 4px;border-radius:2px}.scene-item.active .scene-bars{background:#fff3;color:var(--secondary-contrast, #fff)!important}.bars-selector{padding:8px;border-top:1px solid var(--text-muted);display:flex;align-items:center;gap:4px;flex-wrap:wrap}.bars-selector span{font-family:var(--font-mono);font-size:8px;color:var(--text-muted);width:100%;margin-bottom:4px}.bars-btn{flex:1;padding:4px;font-family:var(--font-mono);font-size:10px;border:1px solid var(--text-muted);border-radius:3px;background:var(--surface);color:var(--text);cursor:pointer}.bars-btn.active{background:var(--accent);color:var(--accent-contrast, #fff);border-color:var(--accent)}.pad-selector{width:160px;background:var(--background);border-right:1px solid var(--text-muted);display:flex;flex-direction:column;flex-shrink:0;overflow:hidden}.pad-selector-label{font-family:var(--font-mono);font-size:8px;color:var(--text-muted);padding:8px;border-bottom:1px solid var(--text-muted);flex-shrink:0}.pad-selector-list{flex:1;overflow-y:auto;padding:4px;display:flex;flex-direction:column;gap:2px}.pad-select-item{display:flex;align-items:center;gap:8px;width:100%;padding:6px 8px;border:1px solid transparent;border-radius:3px;background:var(--surface);cursor:pointer;transition:all .1s ease;text-align:left}.pad-select-item:hover{border-color:var(--secondary);background:#d354001a}.pad-select-item.selected{background:var(--secondary);color:var(--secondary-contrast, #fff);border-color:var(--secondary)}.pad-select-item.has-sample{background:#2d5a4a33;border-color:#2d5a4a4d}.pad-select-item.has-sample.selected{background:var(--secondary);border-color:var(--secondary)}.pad-select-item.has-steps{border-left:3px solid var(--accent)}.pad-select-id{font-family:var(--font-mono);font-size:10px;font-weight:700;color:var(--text);min-width:28px}.pad-select-item.selected .pad-select-id{color:#fff}.pad-select-name{font-family:var(--font-mono);font-size:8px;color:var(--text-muted);flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.pad-select-item.selected .pad-select-name{color:#fffc}.pad-select-steps{font-size:8px;color:var(--accent)}.pad-select-item.selected .pad-select-steps{color:#fff}.step-grid-container{flex:1;display:flex;flex-direction:column;min-width:0;padding:8px;overflow:hidden}.step-grid-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:8px;flex-shrink:0}.selected-pad-label{font-family:var(--font-mono);font-size:14px;font-weight:700;color:var(--secondary)}.pattern-info{font-family:var(--font-mono);font-size:10px;color:var(--text-muted)}.step-grid{flex:1;min-height:0;overflow:auto;display:flex;flex-direction:column;gap:4px}.step-row{display:flex;align-items:center;gap:2px;flex-shrink:0}.row-label{font-family:var(--font-mono);font-size:8px;color:var(--text-muted);width:24px;text-align:right;padding-right:4px;flex-shrink:0}.step-btn{width:28px;height:28px;min-width:28px;border:1px solid var(--text-muted);border-radius:3px;background:var(--surface);cursor:pointer;transition:all .1s ease;position:relative;flex-shrink:0}.step-btn.downbeat{border-left-width:2px;border-left-color:var(--secondary)}.step-btn:hover{background:var(--background);border-color:var(--secondary)}.step-btn.active{background:var(--accent, var(--pad-filled));border-color:var(--accent, var(--pad-filled));box-shadow:0 0 6px color-mix(in srgb,var(--accent, var(--pad-filled)) 60%,transparent)}.step-btn.current{box-shadow:0 0 0 2px var(--pad-playing)}.step-btn.active.current{box-shadow:0 0 0 2px var(--pad-playing),0 0 8px var(--accent, var(--pad-filled))}.step-indicator{display:block;width:10px;height:10px;background:var(--surface);border-radius:50%;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}.step-grid-container.layout-compact .step-btn{width:18px;height:18px;min-width:18px}.step-grid-container.layout-compact .step-indicator{width:6px;height:6px}.step-grid-container.layout-compact .row-label{font-size:7px;width:20px}.step-grid-container.layout-linear{overflow-x:auto;overflow-y:hidden}.step-grid-container.layout-linear .step-grid{flex-direction:row;flex-wrap:nowrap;overflow-x:auto;overflow-y:hidden;padding-bottom:8px}.step-grid-container.layout-linear .step-row{flex-direction:row;flex-wrap:nowrap}.step-grid-container.layout-linear .step-btn{width:32px;height:48px;min-width:32px;border-radius:4px}.step-grid-container.layout-linear .step-btn.downbeat{border-left-width:3px;background:#d354001a}.step-grid-container.layout-linear .step-indicator{width:12px;height:12px}.step-grid-container.layout-linear .row-label{display:none}.song-mode{display:flex;flex:1;min-height:0}.song-scenes{width:160px;background:var(--background);border-right:1px solid var(--text-muted);display:flex;flex-direction:column;flex-shrink:0}.song-section-header{padding:8px;border-bottom:1px solid var(--text-muted);display:flex;justify-content:space-between;align-items:center}.song-section-header span{font-family:var(--font-mono);font-size:8px;color:var(--text-muted)}.clear-song-btn{font-family:var(--font-mono);font-size:8px;padding:2px 6px;border:1px solid #e74c3c;border-radius:3px;background:transparent;color:#e74c3c;cursor:pointer}.clear-song-btn:hover{background:#e74c3c;color:#fff}.available-scenes{flex:1;overflow-y:auto;padding:4px 0;display:flex;flex-direction:column;gap:2px}.available-scene{display:flex;flex-direction:row;align-items:center;gap:8px;width:100%;padding:7px 12px;border:1px solid rgba(128,128,128,.25);border-left:3px solid transparent;border-radius:3px;background:transparent;cursor:pointer;font-family:var(--font-mono);transition:all .15s ease;margin-bottom:2px}.available-scene:hover{background:var(--accent);color:var(--accent-contrast, #fff);border-color:var(--accent);transform:scale(1.02)}.available-scene span{font-size:13px;font-weight:700;color:var(--text);min-width:22px}.available-scene:hover span{color:var(--accent-contrast, #fff)}.scene-bars-small{font-size:9px;color:var(--text-muted)}.available-scene:hover .scene-bars-small{color:var(--accent-contrast, #fff);opacity:.75}.song-arrangement{flex:1;display:flex;flex-direction:column;min-width:0}.arrangement-list{flex:1;overflow-x:auto;overflow-y:hidden;padding:10px 12px;display:flex;flex-direction:row;align-items:flex-start;gap:6px}.empty-song{font-family:var(--font-mono);font-size:11px;color:var(--text-muted);text-align:center;padding:20px}.arrangement-item{display:flex;flex-direction:column;align-items:center;gap:4px;padding:10px 8px 8px;min-width:60px;max-width:80px;flex-shrink:0;background:#8080801a;border:1px solid rgba(128,128,128,.4);border-radius:6px;cursor:grab;transition:all .15s ease}.arrangement-item:hover{background:#8080802e;border-color:#80808099}.arrangement-item.playing{background:var(--accent);color:var(--accent-contrast, #fff);border-color:var(--accent);box-shadow:0 2px 12px color-mix(in srgb,var(--accent) 40%,transparent)}.arr-position{font-family:var(--font-mono);font-size:11px;font-weight:600;color:var(--text-muted);width:24px;background:#0003;padding:2px 6px;border-radius:3px;text-align:center}.arrangement-item.playing .arr-position{background:#00000026;color:var(--accent-contrast, #fff)}.arr-scene{font-family:var(--font-mono);font-size:16px;font-weight:700;color:var(--text)}.arrangement-item.playing .arr-scene{color:var(--accent-contrast, #fff)}.arr-repeats{font-family:var(--font-mono);font-size:11px;font-weight:600;color:var(--accent);background:#2d5a4a33;padding:3px 6px;border-radius:3px}.arrangement-item.playing .arr-repeats{background:#00000026;color:var(--accent-contrast, #fff)}.arr-bars{font-family:var(--font-mono);font-size:10px;color:var(--text-muted)}.arrangement-item.playing .arr-bars{color:var(--accent-contrast, #fff);opacity:.75}.arrangement-item.dragging{background:var(--accent);border-color:var(--accent);box-shadow:0 4px 16px #0000004d;cursor:grabbing}.arrangement-item.dragging .arr-scene,.arrangement-item.dragging .arr-position,.arrangement-item.dragging .arr-bars,.arrangement-item.dragging .arr-repeats{color:var(--accent-contrast, #fff)}.arrangement-item.dragging .arr-repeats{background:#00000026}.arr-actions{display:flex;gap:3px;margin-left:0;margin-top:2px}.arr-actions button{width:24px;height:20px;font-size:10px;font-weight:700;border:1px solid rgba(128,128,128,.5);border-radius:3px;background:var(--surface);color:var(--text);cursor:pointer;display:flex;align-items:center;justify-content:center;transition:all .12s}.arr-actions button:hover{background:var(--accent);color:var(--accent-contrast, #fff);border-color:var(--accent)}.arr-actions button.arr-remove{color:#e05555;border-color:#e0555566}.arr-actions button.arr-remove:hover{background:#e05555;color:#fff;border-color:#e05555}.scene-list::-webkit-scrollbar,.step-grid::-webkit-scrollbar,.available-scenes::-webkit-scrollbar{width:6px}.arrangement-list::-webkit-scrollbar{height:4px}.scene-list::-webkit-scrollbar-track,.step-grid::-webkit-scrollbar-track,.available-scenes::-webkit-scrollbar-track,.arrangement-list::-webkit-scrollbar-track{background:var(--surface);border-radius:3px}.scene-list::-webkit-scrollbar-thumb,.step-grid::-webkit-scrollbar-thumb,.available-scenes::-webkit-scrollbar-thumb,.arrangement-list::-webkit-scrollbar-thumb{background:var(--text-muted);border-radius:3px}@media(max-width:800px){.scene-selector,.pad-selector{width:100px}.step-btn{width:20px;height:20px}}@media(max-width:600px){.sequencer-header{flex-wrap:wrap;gap:8px}.pad-selector{display:none}.step-btn{width:16px;height:16px}.song-scenes{width:120px}}.layout-overview{flex:1;display:flex;flex-direction:column;overflow:hidden;min-width:0}.overview-empty{flex:1;display:flex;align-items:center;justify-content:center;color:var(--text-muted);font-family:var(--font-mono);font-size:11px;opacity:.6}.overview-grid{flex:1;overflow-y:auto;overflow-x:auto;display:flex;flex-direction:column;gap:2px;padding:4px 6px}.overview-ruler{display:flex;align-items:center;gap:1px;padding-bottom:2px;border-bottom:1px solid var(--text-muted);opacity:.5;flex-shrink:0}.ruler-tick{width:22px;height:14px;font-family:var(--font-mono);font-size:8px;color:var(--text-muted);text-align:center;flex-shrink:0}.ruler-tick.bar-start{color:var(--secondary);font-weight:700}.ruler-tick.current{color:var(--accent);font-weight:700}.overview-pad-label{width:76px;flex-shrink:0}.overview-row{display:flex;align-items:center;gap:3px;flex-shrink:0}.overview-pad-label{width:76px;flex-shrink:0;display:flex;flex-direction:column;align-items:flex-start;justify-content:center;padding:2px 6px;background:var(--surface);border:1px solid transparent;border-radius:4px;cursor:pointer;transition:border-color .15s;height:28px}.overview-pad-label.selected{border-color:var(--accent);background:color-mix(in srgb,var(--accent) 10%,var(--surface))}.overview-pad-label:hover{border-color:var(--text-muted)}.ovw-pad-id{font-family:var(--font-mono);font-size:9px;font-weight:700;color:var(--secondary)}.ovw-sample-name{font-family:var(--font-mono);font-size:8px;color:var(--text-muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:100%}.overview-steps{display:flex;gap:1px;flex-wrap:nowrap}.ovw-step{width:22px!important;height:24px!important;min-width:unset!important;padding:0!important;border-radius:3px;flex-shrink:0}.ovw-step.active,html[data-theme] .ovw-step.active,html:not([data-theme]) .ovw-step.active{background:var(--accent, var(--secondary))!important;border-color:var(--accent, var(--secondary))!important;box-shadow:0 0 6px color-mix(in srgb,var(--accent, var(--secondary)) 60%,transparent)!important}.layout-piano{flex:1;display:flex;flex-direction:column;overflow:hidden;min-width:0}.piano-roll-toolbar{display:flex;align-items:center;gap:8px;padding:6px 10px;background:var(--background);border-bottom:1px solid var(--text-muted);flex-shrink:0;flex-wrap:wrap}.piano-roll-label{font-family:var(--font-mono);font-size:9px;font-weight:700;color:var(--text-muted);letter-spacing:1px}.quantize-mode-btns{display:flex;gap:2px;background:var(--surface);padding:2px;border-radius:4px}.quantize-btn{font-family:var(--font-mono);font-size:9px;font-weight:700;padding:3px 8px;border:none;border-radius:3px;background:transparent;color:var(--text-muted);cursor:pointer;transition:all .15s;letter-spacing:.5px}.quantize-btn.active{background:var(--secondary);color:var(--secondary-contrast, #fff)}.quantize-btn:hover:not(.active){background:var(--surface-hover, rgba(255,255,255,.06))}.quantize-amount{display:flex;align-items:center;gap:6px}.quantize-amount-label{font-family:var(--font-mono);font-size:10px;color:var(--secondary);min-width:32px}.quantize-slider{width:80px;accent-color:var(--secondary)}.quantize-apply-btn{font-family:var(--font-mono);font-size:9px;font-weight:700;padding:3px 10px;border:1px solid var(--secondary);border-radius:4px;background:transparent;color:var(--secondary);cursor:pointer;letter-spacing:.5px}.quantize-apply-btn:hover{background:var(--secondary);color:var(--secondary-contrast, #fff)}.piano-roll-grid{flex:1;overflow-y:auto;overflow-x:auto;display:flex;flex-direction:column;gap:1px;padding:4px 6px}.piano-row{display:flex;align-items:center;gap:2px;flex-shrink:0}.piano-row.selected-row .piano-pad-key{border-color:var(--accent);background:color-mix(in srgb,var(--accent) 12%,var(--surface))}.piano-pad-key{width:80px;flex-shrink:0;display:flex;flex-direction:column;align-items:flex-start;justify-content:center;padding:2px 6px;background:var(--surface);border:1px solid transparent;border-radius:4px;cursor:pointer;height:26px;transition:border-color .15s}.piano-pad-key:hover{border-color:var(--text-muted)}.piano-key-id{font-family:var(--font-mono);font-size:9px;font-weight:700;color:var(--secondary)}.piano-key-name{font-family:var(--font-mono);font-size:8px;color:var(--text-muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:100%}.piano-steps{display:flex;gap:1px;flex-wrap:nowrap}.piano-step{width:24px;height:22px;border:none;border-radius:3px;background:var(--surface);cursor:pointer;transition:background .1s;flex-shrink:0;position:relative}.piano-step:hover{background:var(--text-muted);opacity:.6}.piano-step.active{background:var(--accent);box-shadow:0 0 4px color-mix(in srgb,var(--accent) 60%,transparent)}.piano-step.current{outline:2px solid #fff;outline-offset:-2px}.piano-step.bar-start{border-left:2px solid var(--secondary)}.piano-step.beat-start{border-left:1px solid var(--text-muted)}.sequencer-title{font-size:12px!important}.scene-header span,.pad-selector-label,.song-section-header span{font-size:12px!important;color:var(--text)!important}.pad-select-id{font-size:12px!important}.pad-select-name{font-size:10px!important}.step-label,.step-value,.step-sep,.step-total,.scene-info-label,.scene-info-bars{font-size:12px!important}.mode-btn{font-size:11px!important;padding:5px 10px!important}.layout-btn{font-size:10px!important}.bpm-label,.bars-label,.sync-label,.swing-label{font-size:11px!important}.swing-value{font-size:10px!important}.scene-id{font-size:12px!important}.scene-bars{font-size:10px!important}.scene-actions button{display:inline-flex!important;align-items:center!important;justify-content:center!important;width:28px!important;height:28px!important;font-size:14px!important;line-height:1!important;padding:0!important}.layout-piano{display:flex;flex-direction:column;height:100%;overflow:hidden}.piano-roll-toolbar{display:flex;align-items:center;gap:6px;padding:5px 8px;background:var(--surface);border-bottom:1px solid rgba(128,128,128,.2);flex-wrap:wrap;flex-shrink:0}.roll-divider{width:1px;height:18px;background:#8080804d;margin:0 2px}.roll-zoom-controls{display:flex;align-items:center;gap:3px}.roll-zoom-btn{background:var(--surface);border:1px solid rgba(128,128,128,.3);color:var(--text);width:22px;height:22px;border-radius:4px;cursor:pointer;font-size:14px;line-height:1;display:flex;align-items:center;justify-content:center}.roll-zoom-btn:hover{background:var(--secondary);color:var(--secondary-contrast,#fff)}.roll-zoom-label{font-size:10px;color:var(--text-muted);min-width:30px;text-align:center}.piano-roll-label{font-size:10px;color:var(--text-muted);font-weight:600;letter-spacing:.05em}.quantize-grid-select{background:var(--surface);border:1px solid rgba(128,128,128,.3);color:var(--text);font-size:10px;border-radius:4px;padding:2px 4px;height:22px;cursor:pointer}.quantize-grid-select:focus{outline:none;border-color:var(--secondary)}.roll-swing-label{font-size:10px;color:var(--text-muted);margin-left:2px}.piano-roll-scroll{flex:1;overflow-y:auto;overflow-x:auto;position:relative}.piano-roll-body{display:flex;position:sticky;top:0;z-index:10;background:var(--surface);border-bottom:1px solid rgba(128,128,128,.2)}.piano-key-gutter{width:70px;flex-shrink:0;background:var(--surface)}.piano-roll-timeline{position:relative;height:18px;flex-shrink:0}.roll-marker{position:absolute;top:0;height:100%;display:flex;align-items:center;pointer-events:none}.roll-marker span{font-size:9px;color:var(--text-muted);padding-left:2px}.roll-marker-bar:before{content:"";position:absolute;left:0;top:0;width:1px;height:100%;background:#80808080}.roll-marker-beat:before{content:"";position:absolute;left:0;top:50%;width:1px;height:50%;background:#80808040}.piano-roll-rows{display:flex;flex-direction:column}.piano-roll-row{display:flex;align-items:stretch;height:28px;border-bottom:1px solid rgba(128,128,128,.12)}.piano-roll-row.selected-row{background:#80808012}.piano-roll-row.selected-row .piano-pad-key{border-color:var(--secondary);color:var(--secondary-contrast, #fff);background:var(--secondary)}.piano-pad-key{width:70px;flex-shrink:0;display:flex;flex-direction:column;align-items:flex-start;justify-content:center;padding:0 6px;background:var(--surface);border:none;border-right:1px solid rgba(128,128,128,.2);cursor:pointer;color:var(--text);gap:1px;position:sticky;left:0;z-index:5}.piano-pad-key:hover{background:var(--secondary);color:var(--secondary-contrast,#fff)}.piano-key-id{font-size:9px;font-weight:700}.piano-key-name{font-size:8px;color:var(--text-muted);white-space:nowrap;overflow:hidden;max-width:56px}.piano-roll-lane{position:relative;height:28px;cursor:crosshair;flex-shrink:0}.roll-grid-line{position:absolute;top:0;height:100%;width:1px;pointer-events:none}.roll-grid-line-bar{background:#80808059}.roll-grid-line-beat{background:#8080802e}.roll-grid-line-sub{background:#80808012}.roll-playhead{position:absolute;top:0;width:2px;height:100%;background:var(--secondary);opacity:.85;pointer-events:none;z-index:4}.roll-note{position:absolute;top:3px;height:22px;background:var(--secondary);border-radius:3px;cursor:grab;z-index:3;-webkit-user-select:none;user-select:none;box-shadow:0 1px 3px #0000004d;display:flex;align-items:stretch}.roll-note:hover{filter:brightness(1.15)}.roll-note:active{cursor:grabbing}.roll-note-resize-handle{position:absolute;right:0;top:0;width:8px;height:100%;cursor:ew-resize;background:#ffffff26;border-radius:0 3px 3px 0}.roll-note-resize-handle:hover{background:#ffffff4d}.video-panel{display:flex;flex-direction:column;height:100%;background:var(--surface, #f5f2eb)}.video-panel-header{display:flex;align-items:center;justify-content:flex-start;gap:8px 12px;padding:6px 12px;background:var(--background);border-bottom:1px solid var(--text-muted);flex-shrink:0;flex-wrap:wrap}.video-panel-title{font-family:var(--font-mono);font-size:11px;font-weight:700;color:var(--secondary);letter-spacing:1px;white-space:nowrap;flex-shrink:0}.video-display-modes{display:flex;gap:4px;flex-shrink:0}.display-mode-btn{width:28px;height:28px;border:1px solid var(--text-muted);border-radius:4px;background:var(--surface);color:var(--text);font-family:var(--font-mono);font-size:12px;font-weight:700;cursor:pointer;transition:all .15s ease;display:flex;align-items:center;justify-content:center}.display-mode-btn:hover{background:var(--background);border-color:var(--secondary)}.display-mode-btn.active{background:var(--secondary);border-color:var(--secondary);color:var(--secondary-contrast, #fff)}.video-fx-controls{display:flex;gap:4px;flex-shrink:0}.fx-btn{padding:4px 8px;border:1px solid var(--text-muted);border-radius:4px;background:var(--surface);color:var(--text);font-family:var(--font-mono);font-size:9px;font-weight:700;cursor:pointer;transition:all .15s ease}.fx-btn:hover{background:var(--background);border-color:#9b59b6}.fx-btn.active{background:#9b59b6;border-color:#9b59b6;color:#fff}.video-panel-header .expand-btn{display:flex;align-items:center;gap:4px;padding:4px 10px;background:var(--surface);border:1px solid var(--text-muted);border-radius:4px;color:var(--text-muted);font-family:var(--font-mono);font-size:10px;font-weight:700;cursor:pointer;transition:all .15s ease;margin-left:auto;flex-shrink:0}.video-panel-header .expand-btn:hover{background:var(--background);color:var(--text);border-color:var(--secondary)}.video-panel-header .expand-btn.active{background:var(--secondary);border-color:var(--secondary);color:var(--secondary-contrast, #fff)}.video-panel-content{display:flex;gap:16px;flex:1;padding:12px;min-height:0}.video-preview-section{flex:1;display:flex;flex-direction:column;gap:12px;min-width:0}.video-preview{flex:1;background:#000;border-radius:8px;overflow:hidden;display:flex;align-items:center;justify-content:center;min-height:200px;position:relative}.video-player{width:100%;height:100%;object-fit:contain;transition:filter .3s ease}.video-preview.mode-1 .video-player{position:absolute;inset:0}.video-preview.mode-2{display:grid;grid-template-columns:1fr 1fr;gap:2px}.video-preview.mode-2 .video-player{position:relative;width:100%;height:100%}.video-preview.mode-2 .video-player.secondary{transform:scaleX(-1)}.video-preview.mode-4{display:grid;grid-template-columns:1fr 1fr;grid-template-rows:1fr 1fr;gap:2px}.video-preview.mode-4 .video-player{position:relative;width:100%;height:100%}.video-preview.mode-4 .video-player.quad-2{transform:scaleX(-1)}.video-preview.mode-4 .video-player.quad-3{transform:scaleY(-1)}.video-preview.mode-4 .video-player.quad-4{transform:scale(-1)}.video-preview.mode-5{display:grid;grid-template-columns:repeat(3,1fr);grid-template-rows:repeat(2,1fr);gap:2px}.video-preview.mode-5 .video-player{position:relative;width:100%;height:100%;clip-path:polygon(50% 0%,100% 50%,50% 100%,0% 50%)}.video-preview.mode-5 .video-player:first-child{grid-column:2;grid-row:1}.video-preview.mode-5 .video-player.shape-2{grid-column:1;grid-row:1 / 3;transform:rotate(45deg) scale(.8)}.video-preview.mode-5 .video-player.shape-3{grid-column:3;grid-row:1 / 3;transform:rotate(-45deg) scale(.8)}.video-preview.mode-5 .video-player.shape-4{grid-column:2;grid-row:2;clip-path:circle(45%);transform:scale(1.1)}.video-preview.mode-5 .video-player.shape-5{position:absolute;inset:20%;clip-path:polygon(50% 0%,100% 38%,82% 100%,18% 100%,0% 38%);z-index:2;opacity:.7}.video-placeholder{color:#666;font-family:var(--font-mono, monospace);font-size:12px;text-transform:uppercase;letter-spacing:.5px}.video-controls{display:flex;gap:8px}.video-btn{flex:1;padding:10px 16px;border:none;border-radius:6px;font-family:var(--font-mono, monospace);font-size:11px;font-weight:700;cursor:pointer;transition:all .15s ease}.video-btn.play-btn{background:var(--accent, #2d5a4a);color:#fff}.video-btn.play-btn:hover{filter:brightness(1.1)}.video-btn.remove-btn{background:#e74c3c;color:#fff}.video-btn.remove-btn:hover{filter:brightness(1.1)}.video-assign-section{width:280px;display:flex;flex-direction:column;gap:12px;flex-shrink:0}.video-info-row{display:flex;gap:12px;padding:10px;background:var(--background, #e8e4dc);border-radius:6px}.info-item{display:flex;flex-direction:column;gap:2px}.info-label{font-family:var(--font-mono, monospace);font-size:9px;font-weight:700;text-transform:uppercase;color:var(--text-muted, #666)}.info-value{font-family:var(--font-mono, monospace);font-size:14px;font-weight:700;color:var(--text, #1a1a1a)}.info-value.sample-name{font-size:11px;max-width:150px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.video-current{padding:10px;background:#2d5a4a1a;border-radius:6px;display:flex;flex-direction:column;gap:4px}.video-current-label{font-family:var(--font-mono, monospace);font-size:9px;font-weight:700;text-transform:uppercase;color:var(--accent, #2d5a4a)}.video-current-name{font-family:var(--font-mono, monospace);font-size:12px;font-weight:700;color:var(--text, #1a1a1a)}.video-current-type{font-family:var(--font-mono, monospace);font-size:9px;color:var(--text-muted, #666)}.video-assign-controls{display:flex;flex-direction:column;gap:12px}.assign-section{display:flex;flex-direction:column;gap:6px}.assign-label{font-family:var(--font-mono, monospace);font-size:10px;font-weight:700;text-transform:uppercase;color:var(--text-muted, #666)}.video-file-input{display:none}.video-upload-btn{display:block;padding:10px 16px;background:var(--secondary, #d35400);color:#fff;border-radius:6px;font-family:var(--font-mono, monospace);font-size:11px;font-weight:700;text-align:center;cursor:pointer;transition:all .15s ease}.video-upload-btn:hover:not(.disabled){filter:brightness(1.1)}.video-upload-btn.disabled{opacity:.5;cursor:not-allowed}.url-input-row{display:flex;gap:6px}.video-url-input{flex:1;padding:8px 10px;border:1px solid rgba(128,128,128,.35);border-radius:4px;font-family:var(--font-mono, monospace);font-size:11px;background:var(--surface)}.video-url-input:focus{outline:none;border-color:var(--accent, #2d5a4a)}.video-url-input:disabled{opacity:.5;cursor:not-allowed}.video-url-btn{padding:8px 12px;background:var(--accent, #2d5a4a);color:#fff;border:none;border-radius:4px;font-family:var(--font-mono, monospace);font-size:10px;font-weight:700;cursor:pointer;transition:all .15s ease}.video-url-btn:hover:not(:disabled){filter:brightness(1.1)}.video-url-btn:disabled{opacity:.5;cursor:not-allowed}.url-hint{font-family:var(--font-mono, monospace);font-size:9px;color:var(--text-muted, #666);margin:0}.url-mode-toggle{display:flex;gap:3px;margin-bottom:6px;background:var(--background, #e8e4dc);border-radius:5px;padding:2px}.url-mode-btn{flex:1;font-family:var(--font-mono, monospace);font-size:9px;font-weight:700;letter-spacing:.3px;padding:4px 6px;border:none;border-radius:3px;cursor:pointer;background:transparent;color:var(--text-muted, #666);transition:all .12s ease;white-space:nowrap}.url-mode-btn:hover{background:#80808026;color:var(--text, #1a1a1a)}.url-mode-btn.active{background:var(--accent, #2d5a4a);color:#fff}.url-mode-btn:nth-child(1).active{background:var(--secondary, #d35400)}.url-mode-btn:nth-child(3).active{background:#7c3aed}.url-status{font-family:var(--font-mono, monospace);font-size:9px;font-weight:700;margin:3px 0 0;padding:3px 6px;border-radius:3px}.url-status.done{color:#4ade80;background:#4ade801a}.url-status.error{color:#ef4444;background:#ef44441a}.url-status.loading{color:#facc15;background:#facc151a}.video-url-btn.loading{opacity:.7;cursor:wait}.video-formats{padding:8px 10px;background:var(--background, #e8e4dc);border-radius:4px;font-family:var(--font-mono, monospace);font-size:9px;color:var(--text-muted, #666);text-align:center}.video-help{margin-top:auto;padding:10px;background:#80808026;border-radius:6px}.video-help p{font-family:var(--font-mono, monospace);font-size:10px;color:var(--text-muted, #666);margin:0 0 6px;line-height:1.4}.video-help p:last-child{margin-bottom:0}.video-panel.editor .video-preview-section{flex:2}.video-panel.editor .video-assign-section{flex:1;min-width:250px}.video-editor-controls{background:var(--background, #e8e4dc);border-radius:8px;padding:12px;margin-top:8px}.editor-timeline{display:flex;flex-direction:column;gap:10px}.timeline-label{font-family:var(--font-mono, monospace);font-size:11px;font-weight:700;color:var(--secondary, #d35400);letter-spacing:.5px}.timeline-markers{display:flex;gap:16px}.marker-control{flex:1;display:flex;align-items:center;gap:8px}.marker-control label{font-family:var(--font-mono, monospace);font-size:10px;font-weight:700;color:var(--text-muted, #666);min-width:30px}.marker-slider{flex:1;height:8px;border-radius:4px;appearance:none;background:var(--surface, #f5f2eb);cursor:pointer}.marker-slider::-webkit-slider-thumb{appearance:none;width:16px;height:16px;border-radius:50%;cursor:pointer}.marker-slider.in-slider::-webkit-slider-thumb{background:var(--accent, #2d5a4a)}.marker-slider.out-slider::-webkit-slider-thumb{background:var(--secondary, #d35400)}.marker-value{font-family:var(--font-mono, monospace);font-size:10px;font-weight:700;color:var(--text, #1a1a1a);min-width:35px;text-align:right}.timeline-bar{height:24px;background:var(--surface, #f5f2eb);border-radius:4px;position:relative;margin:4px 0}.timeline-range{position:absolute;top:4px;bottom:4px;background:#2d5a4a4d;border-radius:2px}.timeline-in,.timeline-out{position:absolute;top:0;bottom:0;width:4px;border-radius:2px;transform:translate(-50%)}.timeline-in{background:var(--accent, #2d5a4a)}.timeline-out{background:var(--secondary, #d35400)}.editor-actions{display:flex;gap:8px;margin-top:4px}.editor-btn{flex:1;padding:8px 12px;border:1px solid rgba(128,128,128,.3);border-radius:4px;background:var(--surface, #f5f2eb);color:var(--text, #1a1a1a);font-family:var(--font-mono, monospace);font-size:10px;font-weight:700;cursor:pointer;transition:all .15s ease}.editor-btn:hover{background:var(--secondary, #d35400);border-color:var(--secondary, #d35400);color:#fff}@media(max-width:1100px){.video-panel-header{padding:5px 10px}}@media(max-width:900px){.video-panel-content{flex-direction:column;padding:8px}.video-assign-section{width:100%}}.social-panel{display:flex;flex-direction:column;height:100%;overflow:hidden;background:var(--background);color:var(--text);font-family:var(--font-primary, sans-serif)}.social-toolbar{display:flex;align-items:center;gap:10px;padding:10px 14px;border-bottom:1px solid rgba(128,128,128,.18);flex-shrink:0;flex-wrap:wrap}.social-toolbar-title{font-family:var(--font-mono, monospace);font-size:13px;font-weight:700;letter-spacing:1px;text-transform:uppercase;color:var(--text);flex:1;min-width:80px}.social-toolbar-tabs{display:flex;gap:4px}.social-tab-btn{font-family:var(--font-mono, monospace);font-size:10px;font-weight:600;text-transform:uppercase;letter-spacing:.5px;padding:5px 12px;border-radius:4px;border:1px solid rgba(128,128,128,.25);background:transparent;color:var(--text-muted);cursor:pointer;transition:all .15s ease}.social-tab-btn.active,.social-tab-btn:hover{background:var(--secondary);color:#fff;border-color:var(--secondary)}.social-save-btn{font-family:var(--font-mono, monospace);font-size:10px;font-weight:700;text-transform:uppercase;letter-spacing:.5px;padding:5px 14px;border-radius:4px;border:none;background:var(--accent);color:#fff;cursor:pointer;transition:all .15s ease;margin-left:auto;flex-shrink:0}.social-save-btn:hover{filter:brightness(1.1)}.social-save-btn:disabled{opacity:.5;cursor:default}.social-save-status{font-family:var(--font-mono, monospace);font-size:10px;color:var(--accent);opacity:0;transition:opacity .3s ease}.social-save-status.visible{opacity:1}.social-body{flex:1;overflow-y:auto;padding:16px 14px}.social-section-label{font-family:var(--font-mono, monospace);font-size:10px;font-weight:700;text-transform:uppercase;letter-spacing:1px;color:var(--text-muted);margin:0 0 12px}.social-platform-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:10px;margin-bottom:20px}.social-card{background:var(--surface);border-radius:8px;border:1px solid rgba(128,128,128,.15);overflow:hidden;transition:border-color .15s ease}.social-card.has-handle{border-color:var(--secondary)}.social-card-header{display:flex;align-items:center;gap:10px;padding:10px 12px 8px}.social-card-icon{width:32px;height:32px;border-radius:8px;display:flex;align-items:center;justify-content:center;font-size:16px;flex-shrink:0;font-weight:700}.social-card-icon.ig{background:linear-gradient(135deg,#f09433,#e6683c,#dc2743,#cc2366,#bc1888);color:#fff}.social-card-icon.tt,.social-card-icon.tw{background:#000;color:#fff}.social-card-icon.yt{background:red;color:#fff}.social-card-icon.sc{background:#f50;color:#fff}.social-card-icon.sp{background:#1db954;color:#fff}.social-card-icon.mc{background:#40c0d0;color:#fff}.social-card-icon.fb{background:#1877f2;color:#fff}.social-card-icon.li{background:#0077b5;color:#fff}.social-card-icon.custom{background:var(--accent);color:#fff}.social-card-name{font-family:var(--font-mono, monospace);font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:.5px;color:var(--text);flex:1}.social-card-link-btn{width:26px;height:26px;border-radius:4px;border:1px solid rgba(128,128,128,.2);background:transparent;color:var(--text-muted);font-size:13px;display:flex;align-items:center;justify-content:center;cursor:pointer;text-decoration:none;transition:all .15s ease;flex-shrink:0}.social-card-link-btn:hover{background:var(--secondary);color:#fff;border-color:var(--secondary)}.social-card-input-row{display:flex;align-items:center;gap:0;margin:0 12px 10px;border:1px solid rgba(128,128,128,.2);border-radius:6px;overflow:hidden;background:var(--background)}.social-card-prefix{padding:7px 8px 7px 10px;font-family:var(--font-mono, monospace);font-size:11px;color:var(--text-muted);white-space:nowrap;border-right:1px solid rgba(128,128,128,.15);background:#80808012;-webkit-user-select:none;user-select:none;flex-shrink:0}.social-card-input{flex:1;min-width:0;padding:7px 10px;font-family:var(--font-primary, sans-serif);font-size:13px;background:transparent;border:none;color:var(--text);outline:none}.social-card-input::placeholder{color:var(--text-muted);opacity:.5}.social-card-embed-toggle{width:100%;padding:6px 12px;font-family:var(--font-mono, monospace);font-size:10px;font-weight:600;text-transform:uppercase;letter-spacing:.5px;border:none;border-top:1px solid rgba(128,128,128,.12);background:#8080800f;color:var(--text-muted);cursor:pointer;transition:all .15s ease;text-align:left;display:flex;align-items:center;gap:6px}.social-card-embed-toggle:hover{background:#8080801f;color:var(--text)}.social-card-embed-toggle .toggle-arrow{transition:transform .2s ease}.social-card-embed-toggle .toggle-arrow.open{transform:rotate(90deg)}.social-card-embed{border-top:1px solid rgba(128,128,128,.12);overflow:hidden;max-height:0;transition:max-height .3s ease}.social-card-embed.open{max-height:400px}.social-card-embed iframe{width:100%;border:none;display:block}.social-custom-section{margin-top:8px;padding-top:16px;border-top:1px solid rgba(128,128,128,.12)}.social-custom-add{display:flex;gap:8px;flex-wrap:wrap;margin-top:10px}.social-custom-input{flex:1;min-width:140px;padding:8px 10px;font-family:var(--font-primary, sans-serif);font-size:13px;border:1px solid rgba(128,128,128,.22);border-radius:6px;background:var(--surface);color:var(--text);outline:none}.social-custom-input:focus{border-color:var(--secondary)}.social-custom-add-btn{padding:8px 16px;font-family:var(--font-mono, monospace);font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:.5px;border:none;border-radius:6px;background:var(--secondary);color:#fff;cursor:pointer;flex-shrink:0;transition:all .15s ease}.social-custom-add-btn:hover{filter:brightness(1.1)}.social-custom-cards{display:flex;flex-direction:column;gap:8px;margin-top:12px}.social-custom-card{display:flex;align-items:center;gap:10px;padding:10px 12px;background:var(--surface);border:1px solid rgba(128,128,128,.15);border-radius:8px}.social-custom-card .social-card-name{flex:0 0 auto;width:90px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.social-custom-card input{flex:1;padding:6px 10px;font-family:var(--font-primary, sans-serif);font-size:13px;border:1px solid rgba(128,128,128,.2);border-radius:5px;background:var(--background);color:var(--text);outline:none;min-width:0}.social-custom-card input:focus{border-color:var(--secondary)}.social-custom-remove{width:26px;height:26px;border-radius:4px;border:1px solid rgba(128,128,128,.2);background:transparent;color:var(--text-muted);font-size:14px;display:flex;align-items:center;justify-content:center;cursor:pointer;transition:all .15s;flex-shrink:0}.social-custom-remove:hover{background:#ef4444;border-color:#ef4444;color:#fff}.social-auth-prompt{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:12px;padding:60px 20px;text-align:center;color:var(--text-muted);font-family:var(--font-mono, monospace);font-size:12px;text-transform:uppercase;letter-spacing:.5px}.todo-overlay{position:fixed;inset:0;background:#000000b3;z-index:1000}.todo-modal{position:fixed;top:50%;left:50%;transform:translate(-50%,-50%);width:90%;max-width:600px;max-height:80vh;background:#1a1a1a;border:1px solid #333;border-radius:12px;display:flex;flex-direction:column;z-index:1001;overflow:hidden;box-shadow:0 10px 40px #00000080}.todo-header{display:flex;align-items:center;gap:12px;padding:16px 20px;background:linear-gradient(135deg,#2a2a2a,#1a1a1a);border-bottom:1px solid #333}.todo-header h2{margin:0;font-family:var(--font-mono);font-size:18px;font-weight:800;color:#fff;letter-spacing:1px}.todo-stats{display:flex;gap:12px;margin-left:auto}.todo-stat{font-family:var(--font-mono);font-size:11px;font-weight:600;padding:4px 8px;border-radius:4px}.todo-stat.active{background:#00ff8826;color:#0f8}.todo-stat.completed{background:#64646433;color:#888}.todo-close{padding:6px;background:transparent;border:none;color:#666;cursor:pointer;border-radius:4px;transition:all .15s ease}.todo-close:hover{background:#333;color:#fff}.todo-add{display:flex;gap:8px;padding:16px 20px;background:#222;border-bottom:1px solid #333;flex-wrap:wrap}.todo-input{flex:1;min-width:200px;padding:10px 14px;background:#1a1a1a;border:1px solid #444;border-radius:6px;color:#fff;font-family:var(--font-mono);font-size:13px;outline:none;transition:border-color .15s ease}.todo-input:focus{border-color:#0f8}.todo-input::placeholder{color:#666}.todo-priority-select{padding:10px 12px;background:#1a1a1a;border:1px solid #444;border-radius:6px;color:#fff;font-family:var(--font-mono);font-size:12px;cursor:pointer;outline:none}.todo-priority-select:focus{border-color:#0f8}.todo-category-input{width:120px;padding:10px 12px;background:#1a1a1a;border:1px solid #444;border-radius:6px;color:#fff;font-family:var(--font-mono);font-size:12px;outline:none}.todo-category-input:focus{border-color:#0f8}.todo-add-btn{padding:10px 20px;background:linear-gradient(135deg,#0f8,#00cc6a);border:none;border-radius:6px;color:var(--text);font-family:var(--font-mono);font-size:12px;font-weight:700;cursor:pointer;transition:all .15s ease}.todo-add-btn:hover:not(:disabled){transform:translateY(-1px);box-shadow:0 4px 12px #00ff884d}.todo-add-btn:disabled{opacity:.5;cursor:not-allowed}.todo-filters{display:flex;gap:4px;padding:12px 20px;background:#1a1a1a;border-bottom:1px solid #333}.todo-filter{padding:6px 14px;background:transparent;border:1px solid #444;border-radius:4px;color:#888;font-family:var(--font-mono);font-size:11px;font-weight:600;cursor:pointer;transition:all .15s ease}.todo-filter:hover{background:#2a2a2a;color:#ccc}.todo-filter.active{background:var(--secondary, #d35400);border-color:var(--secondary, #d35400);color:#fff}.todo-list{flex:1;overflow-y:auto;padding:12px 20px}.todo-loading,.todo-empty{padding:40px 20px;text-align:center;color:#666;font-family:var(--font-mono);font-size:13px}.todo-item{display:flex;align-items:center;gap:12px;padding:12px 14px;background:#222;border:1px solid #333;border-radius:8px;margin-bottom:8px;transition:all .15s ease}.todo-item:hover{border-color:#444;background:#2a2a2a}.todo-item.completed{opacity:.6}.todo-item.completed .todo-text{text-decoration:line-through;color:#666}.todo-item.priority-high{border-left:3px solid #ff4444}.todo-item.priority-medium{border-left:3px solid #ffaa00}.todo-item.priority-low{border-left:3px solid #00cc6a}.todo-checkbox{width:22px;height:22px;min-width:22px;display:flex;align-items:center;justify-content:center;background:#1a1a1a;border:2px solid #444;border-radius:6px;cursor:pointer;transition:all .15s ease}.todo-checkbox:hover{border-color:#0f8}.todo-checkbox.checked{background:#0f8;border-color:#0f8}.todo-checkbox.checked svg{color:var(--text)}.todo-content{flex:1;display:flex;align-items:center;gap:8px;cursor:pointer;min-width:0}.todo-text{font-family:var(--font-primary);font-size:14px;color:#fff;flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.todo-category{font-family:var(--font-mono);font-size:10px;font-weight:600;padding:2px 8px;background:#6464ff26;color:#88f;border-radius:4px;flex-shrink:0}.todo-priority-badge{font-family:var(--font-mono);font-size:9px;font-weight:700;padding:2px 6px;border-radius:3px;text-transform:uppercase;flex-shrink:0}.todo-priority-badge.high{background:#f443;color:#f66}.todo-priority-badge.medium{background:#fa03;color:#fa0}.todo-priority-badge.low{background:#00cc6a33;color:#00cc6a}.todo-actions{display:flex;gap:4px;opacity:0;transition:opacity .15s ease}.todo-item:hover .todo-actions{opacity:1}.todo-edit-btn,.todo-delete-btn{padding:6px;background:transparent;border:none;color:#666;cursor:pointer;border-radius:4px;transition:all .15s ease}.todo-edit-btn:hover{background:#333;color:#fff}.todo-delete-btn:hover{background:#f443;color:#f66}.todo-edit-row{flex:1;display:flex;gap:8px}.todo-edit-input{flex:1;padding:8px 12px;background:#1a1a1a;border:1px solid #00ff88;border-radius:4px;color:#fff;font-family:var(--font-primary);font-size:14px;outline:none}.todo-save-btn,.todo-cancel-btn{padding:6px 12px;border:none;border-radius:4px;font-family:var(--font-mono);font-size:11px;font-weight:600;cursor:pointer;transition:all .15s ease}.todo-save-btn{background:#0f8;color:var(--text)}.todo-save-btn:hover{background:#00cc6a}.todo-cancel-btn{background:#333;color:#888}.todo-cancel-btn:hover{background:#444;color:#fff}@media(max-width:600px){.todo-modal{width:95%;max-height:90vh}.todo-add{flex-direction:column}.todo-input{min-width:100%}.todo-priority-select,.todo-category-input{width:100%}.todo-content{flex-wrap:wrap}.todo-actions{opacity:1}}.ud-overlay{position:fixed;inset:0;background:#000000a6;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);z-index:900}.ud-modal{position:fixed;top:50%;left:50%;transform:translate(-50%,-50%);z-index:901;background:#0f0f0f;border:1px solid #2a2a2a;border-radius:14px;width:min(560px,96vw);max-height:88vh;overflow:hidden;display:flex;flex-direction:column;box-shadow:0 24px 80px #000000b3;color:#e8e8e8;font-family:var(--font-mono, "IBM Plex Mono", monospace)}.ud-header{display:flex;align-items:center;justify-content:space-between;padding:20px 22px 14px;border-bottom:1px solid #1a1a1a;flex-shrink:0;gap:12px}.ud-header-left{display:flex;align-items:center;gap:12px;min-width:0}.ud-avatar{width:38px;height:38px;border-radius:50%;object-fit:cover;flex-shrink:0}.ud-title{font-size:.95rem;font-weight:700;color:#fff;margin:0 0 4px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:280px}.ud-tier-badge{font-size:.58rem;font-weight:700;letter-spacing:.08em;padding:2px 7px;border-radius:3px}.ud-tier-badge.pro{background:#2563eb33;color:#60a5fa}.ud-tier-badge.free{background:#ffffff0d;color:#555}.ud-close-btn{background:none;border:1px solid #333;color:#888;width:28px;height:28px;border-radius:50%;cursor:pointer;font-size:.75rem;display:flex;align-items:center;justify-content:center;flex-shrink:0;transition:color .15s}.ud-close-btn:hover{color:#fff;border-color:#666}.ud-nav{display:flex;gap:2px;padding:10px 22px;border-bottom:1px solid #1a1a1a;flex-shrink:0}.ud-nav-btn{background:none;border:1px solid transparent;color:#555;padding:5px 14px;border-radius:6px;font-size:.72rem;font-weight:600;font-family:inherit;letter-spacing:.05em;text-transform:uppercase;cursor:pointer;transition:all .15s}.ud-nav-btn:hover{color:#aaa}.ud-nav-btn.active{background:#1a1a2e;color:#60a5fa;border-color:#2563eb}.ud-body{flex:1;overflow-y:auto;padding:20px 22px}.ud-section{display:flex;flex-direction:column;gap:16px}.ud-loading{text-align:center;color:#444;padding:40px;font-size:.8rem}.ud-sub-card{background:#111;border:1px solid #1e1e1e;border-radius:10px;padding:16px;display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap}.ud-sub-info{display:flex;align-items:center;gap:10px;flex-wrap:wrap}.ud-sub-label{font-size:.65rem;text-transform:uppercase;letter-spacing:.07em;color:#666}.ud-plan-badge{font-size:.62rem;font-weight:700;letter-spacing:.08em;padding:3px 8px;border-radius:4px}.ud-plan-badge.pro{background:#2563eb;color:#fff}.ud-plan-badge.free{background:#222;color:#888}.ud-sub-status{font-size:.7rem;color:#888}.ud-portal-btn{background:none;border:1px solid #2563eb;color:#60a5fa;padding:7px 14px;border-radius:6px;font-size:.72rem;font-family:inherit;cursor:pointer;white-space:nowrap;transition:background .15s}.ud-portal-btn:hover{background:#2563eb26}.ud-upgrade-btn{background:#2563eb;border:none;color:#fff;padding:8px 16px;border-radius:6px;font-size:.75rem;font-weight:700;font-family:inherit;cursor:pointer;white-space:nowrap;transition:background .15s}.ud-upgrade-btn:hover{background:#1d4ed8}.ud-stats-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:10px}@media(max-width:480px){.ud-stats-grid{grid-template-columns:repeat(2,1fr)}}.ud-stat{background:#111;border:1px solid #1e1e1e;border-radius:8px;padding:12px;text-align:center;display:flex;flex-direction:column;gap:4px}.ud-stat-v{font-size:1.2rem;font-weight:700;color:#fff}.ud-stat-l{font-size:.6rem;text-transform:uppercase;letter-spacing:.07em;color:#555}.ud-quick-links{display:flex;gap:8px;flex-wrap:wrap}.ud-ql-btn{background:none;border:1px solid #2a2a2a;color:#666;padding:7px 14px;border-radius:6px;font-size:.72rem;font-family:inherit;cursor:pointer;transition:all .15s}.ud-ql-btn:hover{color:#ccc;border-color:#555}.ud-ql-btn.primary{background:#2563eb;border-color:#2563eb;color:#fff;font-weight:700}.ud-ql-btn.primary:hover{background:#1d4ed8}.ud-usage-card{background:#111;border:1px solid #1e1e1e;border-radius:10px;padding:16px;display:flex;flex-direction:column;gap:10px}.ud-usage-header{display:flex;justify-content:space-between;font-size:.8rem;color:#aaa}.ud-usage-header strong{font-size:1.1rem;color:#fff}.ud-progress{height:6px;background:#1e1e1e;border-radius:3px;overflow:hidden;position:relative}.ud-progress-bar{height:100%;border-radius:3px;transition:width .4s ease}.ud-progress-label{position:absolute;right:0;top:-16px;font-size:.6rem;color:#555}.ud-usage-note{font-size:.65rem;color:#555;margin:0;line-height:1.5}.ud-bill-card{background:#111;border:1px solid #1e1e1e;border-radius:10px;padding:20px;display:flex;flex-direction:column;gap:14px}.ud-bill-title{font-size:.72rem;text-transform:uppercase;letter-spacing:.07em;color:#666;margin:0}.ud-bill-lines{display:flex;flex-direction:column;gap:8px}.ud-bill-line{display:flex;justify-content:space-between;font-size:.78rem;color:#888;padding-bottom:8px;border-bottom:1px solid #1a1a1a}.ud-bill-line strong{color:#ccc}.ud-bill-line.total{font-weight:700;color:#fff;border-bottom:none;font-size:.9rem}.ud-bill-line.total strong{color:#22c55e;font-size:1.1rem}.ud-bill-note{font-size:.65rem;color:#555;line-height:1.5;margin:0}.adm-overlay{position:fixed;inset:0;background:#000000b3;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);z-index:950}.adm-modal{position:fixed;inset:0;z-index:951;background:#0a0a0a;display:flex;flex-direction:column;font-family:var(--font-mono, "IBM Plex Mono", monospace);color:#e8e8e8}.adm-header{display:flex;align-items:center;justify-content:space-between;padding:14px 24px;border-bottom:1px solid #1e1e1e;flex-shrink:0}.adm-header-left{display:flex;align-items:center;gap:12px}.adm-badge{background:#2563eb;color:#fff;font-size:.6rem;font-weight:700;letter-spacing:.1em;padding:3px 7px;border-radius:4px}.adm-title{font-size:1.1rem;font-weight:700;letter-spacing:.04em;text-transform:uppercase;color:#fff;margin:0}.adm-header-right{display:flex;align-items:center;gap:8px}.adm-refresh-btn,.adm-close-btn{background:none;border:1px solid #333;color:#888;width:30px;height:30px;border-radius:50%;cursor:pointer;font-size:.85rem;display:flex;align-items:center;justify-content:center;transition:color .15s,border-color .15s}.adm-refresh-btn:hover,.adm-close-btn:hover{color:#fff;border-color:#666}.adm-nav{display:flex;gap:4px;padding:10px 24px;border-bottom:1px solid #1a1a1a;flex-shrink:0}.adm-nav-btn{background:none;border:1px solid transparent;color:#666;padding:6px 16px;border-radius:6px;font-size:.78rem;font-weight:600;font-family:inherit;letter-spacing:.05em;text-transform:uppercase;cursor:pointer;transition:color .15s,background .15s,border-color .15s}.adm-nav-btn:hover{color:#ccc}.adm-nav-btn.active{background:#1a1a2e;color:#60a5fa;border-color:#2563eb}.adm-body{flex:1;overflow-y:auto;padding:24px}.adm-section{display:flex;flex-direction:column;gap:20px}.adm-loading{text-align:center;color:#444;padding:60px;font-size:.85rem}.adm-stat-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(160px,1fr));gap:12px}.adm-stat-card{background:#111;border:1px solid #1e1e1e;border-top-width:3px;border-radius:10px;padding:14px 16px;display:flex;flex-direction:column;gap:4px}.adm-stat-label{font-size:.65rem;text-transform:uppercase;letter-spacing:.07em;color:#666}.adm-stat-value{font-size:1.7rem;font-weight:700;line-height:1}.adm-stat-sub{font-size:.65rem;color:#555}.adm-charts-row{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:16px}.adm-chart-card{background:#111;border:1px solid #1e1e1e;border-radius:10px;padding:16px}.adm-chart-card h4{font-size:.7rem;text-transform:uppercase;letter-spacing:.07em;color:#666;margin:0 0 12px}.donut-wrap{display:flex;align-items:center;gap:16px}.donut-legend{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:6px}.donut-legend li{font-size:.7rem;color:#aaa;display:flex;align-items:center;gap:6px}.donut-legend li span{display:inline-block;width:10px;height:10px;border-radius:2px;flex-shrink:0}.bar-chart{display:flex;align-items:flex-end;gap:3px;height:80px}.bar-col{display:flex;flex-direction:column;align-items:center;gap:3px}.bar-fill{border-radius:3px 3px 0 0;min-height:2px;transition:height .3s}.bar-label{font-size:.55rem;color:#555;white-space:nowrap}.adm-sparkline-row{display:flex;align-items:center;gap:8px;margin-top:8px}.adm-sparkline-label{font-size:.6rem;color:#555}.adm-rev-lines{display:flex;flex-direction:column;gap:8px}.adm-rev-line{display:flex;justify-content:space-between;font-size:.75rem;color:#888;padding-bottom:6px;border-bottom:1px solid #1a1a1a}.adm-rev-total{font-weight:700;color:#ccc;border-bottom:none}.adm-rev-note{font-size:.65rem;color:#444;margin:8px 0 0;line-height:1.5}.adm-health-row{display:flex;align-items:center;gap:14px;flex-wrap:wrap;background:#111;border:1px solid #1e1e1e;border-radius:8px;padding:12px 16px}.adm-health-item{display:flex;align-items:center;gap:6px;font-size:.72rem;color:#888}.adm-health-dot{width:7px;height:7px;border-radius:50%;background:#374151}.adm-health-item.ok .adm-health-dot{background:#22c55e}.adm-health-item.warn .adm-health-dot{background:#f59e0b}.adm-health-item.error .adm-health-dot{background:#ef4444}.adm-status-link{font-size:.68rem;color:#2563eb;text-decoration:none;margin-left:auto}.adm-status-link:hover{text-decoration:underline}.adm-users-toolbar{display:flex;align-items:center;gap:10px;flex-wrap:wrap}.adm-search{flex:1;min-width:180px;background:#111;border:1px solid #2a2a2a;border-radius:6px;color:#e8e8e8;padding:7px 12px;font-size:.78rem;font-family:inherit;outline:none}.adm-search:focus{border-color:#2563eb}.adm-select{background:#111;border:1px solid #2a2a2a;border-radius:6px;color:#e8e8e8;padding:7px 10px;font-size:.75rem;font-family:inherit;cursor:pointer;outline:none}.adm-count{font-size:.7rem;color:#555;white-space:nowrap}.adm-table-wrap{overflow-x:auto;border-radius:8px;border:1px solid #1e1e1e}.adm-table{width:100%;border-collapse:collapse;font-size:.75rem}.adm-table th{background:#111;color:#555;font-weight:700;letter-spacing:.06em;text-transform:uppercase;font-size:.62rem;padding:9px 12px;text-align:left;white-space:nowrap}.adm-table td{padding:8px 12px;border-top:1px solid #161616;color:#ccc;white-space:nowrap}.adm-table tr:hover td{background:#111}.adm-email{max-width:200px;overflow:hidden;text-overflow:ellipsis}.adm-muted{color:#555}.adm-center{text-align:center}.adm-mono{font-family:IBM Plex Mono,monospace;font-size:.65rem}.adm-role-badge,.adm-tier-badge,.adm-status-badge{font-size:.6rem;font-weight:700;letter-spacing:.08em;padding:2px 6px;border-radius:3px}.adm-role-badge.admin{background:#a78bfa26;color:#a78bfa}.adm-role-badge.user{background:#ffffff0d;color:#666}.adm-tier-badge.pro{background:#2563eb33;color:#60a5fa}.adm-tier-badge.free{background:#ffffff0d;color:#555}.adm-status-badge.active{background:#22c55e26;color:#22c55e}.adm-status-badge.inactive,.adm-status-badge.cancelled{background:#ffffff0d;color:#555}.adm-status-badge.past_due{background:#ef444426;color:#f87171}.adm-status-badge.trialing{background:#f59e0b26;color:#f59e0b}.adm-rev-overview{display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:14px}.adm-rev-card{background:#111;border:1px solid #1e1e1e;border-radius:10px;padding:16px;display:flex;flex-direction:column;gap:6px}.adm-rev-card span{font-size:.68rem;color:#666;text-transform:uppercase;letter-spacing:.06em}.adm-rev-card strong{font-size:1.5rem;font-weight:700;color:#22c55e}.adm-rev-card small{font-size:.65rem;color:#444}.adm-rev-table-wrap h4{font-size:.72rem;text-transform:uppercase;letter-spacing:.07em;color:#666;margin:0 0 10px}.adm-stripe-links{display:flex;gap:12px;flex-wrap:wrap}.adm-ext-link{font-size:.75rem;color:#2563eb;text-decoration:none;border:1px solid rgba(37,99,235,.3);padding:6px 14px;border-radius:6px;transition:background .15s}.adm-ext-link:hover{background:#2563eb1a;text-decoration:none}.user-login-btn{font-family:var(--font-mono, monospace);font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:.3px;padding:8px 12px;border:none;border-radius:4px;background:var(--secondary, #d35400);color:#fff;cursor:pointer;transition:all .15s ease;height:36px}.user-login-btn:hover{filter:brightness(1.1)}.user-menu{position:relative}.user-avatar-btn{position:relative;font-family:var(--font-mono, monospace);font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:.3px;padding:8px 12px;border:none;border-radius:4px;background:var(--secondary, #d35400);color:#fff;cursor:pointer;display:flex;align-items:center;gap:6px;transition:all .15s ease;height:36px}.user-avatar-btn:hover{filter:brightness(1.1)}.user-avatar-img{width:20px;height:20px;border-radius:50%;object-fit:cover}.user-avatar-initial{font-family:var(--font-mono, monospace);font-size:11px;font-weight:700;color:#fff}.admin-badge{font-family:var(--font-mono, monospace);font-size:9px;font-weight:700;color:#fff;background:var(--accent, #2d5a4a);padding:2px 4px;border-radius:2px;margin-left:2px}.user-dropdown-overlay{position:fixed;inset:0;z-index:1999}.user-dropdown{position:fixed;top:56px;right:12px;background:var(--surface, #f5f2eb);border:1px solid rgba(128,128,128,.2);border-radius:8px;box-shadow:0 8px 24px #00000040;min-width:240px;z-index:2000;overflow:hidden}.user-dropdown-header{padding:16px;display:flex;gap:12px;align-items:flex-start}.user-dropdown-avatar{width:48px;height:48px;border-radius:50%;object-fit:cover;flex-shrink:0}.user-dropdown-avatar-placeholder{width:48px;height:48px;border-radius:50%;background:var(--accent, #2d5a4a);color:#fff;display:flex;align-items:center;justify-content:center;font-family:var(--font-mono, monospace);font-size:18px;font-weight:700;flex-shrink:0}.user-dropdown-info{flex:1;min-width:0;display:flex;flex-direction:column;gap:2px}.user-dropdown-name{font-family:var(--font-mono, monospace);font-size:12px;font-weight:700;color:var(--text, #1a1a1a)}.user-dropdown-email{font-family:var(--font-mono, monospace);font-size:10px;color:var(--text-muted, #666);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.user-dropdown-bio{font-family:var(--font-mono, monospace);font-size:10px;color:var(--text, #1a1a1a);margin-top:4px;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}.user-dropdown-role{font-family:var(--font-mono, monospace);font-size:9px;font-weight:700;color:var(--accent, #2d5a4a);text-transform:uppercase;margin-top:4px}.user-dropdown-stats{display:flex;justify-content:space-around;padding:12px 16px;background:var(--background, #e8e4dc)}.stat-item{display:flex;flex-direction:column;align-items:center;gap:2px}.stat-value{font-family:var(--font-mono, monospace);font-size:14px;font-weight:700;color:var(--text, #1a1a1a)}.stat-label{font-family:var(--font-mono, monospace);font-size:9px;color:var(--text-muted, #666);text-transform:uppercase}.user-dropdown-divider{height:1px;background:#80808026}.user-dropdown-item{display:block;width:100%;padding:10px 16px;text-align:left;font-family:var(--font-mono, monospace);font-size:11px;color:var(--text, #1a1a1a);background:none;border:none;cursor:pointer;transition:background .15s ease}.user-dropdown-item:hover{background:#80808026}.user-dropdown-item:disabled{opacity:.6;cursor:not-allowed}.user-dropdown-section{padding:8px 16px 4px;font-family:var(--font-mono, monospace);font-size:9px;font-weight:700;text-transform:uppercase;letter-spacing:.5px;color:var(--text-muted, #666)}.user-dropdown-item{display:flex;align-items:center;gap:8px}.user-dropdown-item.admin-action{color:var(--accent, #2d5a4a)}.user-dropdown-item.admin-action:hover{background:#2d5a4a1a}.user-dropdown-item.signout{color:var(--secondary, #d35400)}.user-dropdown-item.signout:hover{background:#d354001a}.profile-edit-overlay{position:fixed;inset:0;background:#00000080;z-index:3000}.profile-edit-modal{position:fixed;top:50%;left:50%;transform:translate(-50%,-50%);width:90%;max-width:400px;background:var(--surface, #f5f2eb);border-radius:12px;box-shadow:0 8px 32px #0000004d;z-index:3001;overflow:hidden}.profile-edit-header{display:flex;justify-content:space-between;align-items:center;padding:16px 20px;border-bottom:1px solid rgba(128,128,128,.25)}.profile-edit-header h3{font-family:var(--font-mono, monospace);font-size:14px;font-weight:700;text-transform:uppercase;color:var(--text, #1a1a1a);margin:0}.profile-edit-close{padding:4px;background:none;border:none;cursor:pointer;color:var(--text-muted, #666);border-radius:4px;transition:all .15s ease}.profile-edit-close:hover{background:#80808026;color:var(--text, #1a1a1a)}.profile-edit-body{padding:20px}.profile-edit-avatar{display:flex;justify-content:center;margin-bottom:20px}.profile-edit-avatar img{width:80px;height:80px;border-radius:50%;object-fit:cover}.avatar-placeholder-large{width:80px;height:80px;border-radius:50%;background:var(--accent, #2d5a4a);color:#fff;display:flex;align-items:center;justify-content:center;font-family:var(--font-mono, monospace);font-size:28px;font-weight:700}.profile-edit-field{margin-bottom:16px}.profile-edit-field label{display:block;font-family:var(--font-mono, monospace);font-size:10px;font-weight:700;text-transform:uppercase;color:var(--text-muted, #666);margin-bottom:6px}.profile-edit-field input,.profile-edit-field textarea{width:100%;padding:10px 12px;font-family:var(--font-mono, monospace);font-size:12px;border:1px solid rgba(128,128,128,.3);border-radius:6px;background:var(--background, #e8e4dc);color:var(--text, #1a1a1a);resize:none}.profile-edit-field input:focus,.profile-edit-field textarea:focus{outline:none;border-color:var(--secondary, #d35400)}.profile-edit-footer{display:flex;justify-content:flex-end;gap:12px;padding:16px 20px;border-top:1px solid rgba(128,128,128,.25)}.profile-cancel-btn{padding:10px 16px;font-family:var(--font-mono, monospace);font-size:11px;font-weight:700;background:none;border:1px solid rgba(128,128,128,.3);border-radius:6px;color:var(--text, #1a1a1a);cursor:pointer;transition:all .15s ease}.profile-cancel-btn:hover{background:#80808026}.profile-save-btn{padding:10px 20px;font-family:var(--font-mono, monospace);font-size:11px;font-weight:700;background:var(--secondary, #d35400);color:#fff;border:none;border-radius:6px;cursor:pointer;transition:all .15s ease}.profile-save-btn:hover:not(:disabled){filter:brightness(1.1)}.profile-save-btn:disabled{opacity:.6;cursor:not-allowed}.chat-button-container{position:relative}.chat-btn{font-family:var(--font-mono, monospace);font-size:11px;font-weight:700;padding:8px 12px;border:1px solid rgba(211,84,0,.55);border-radius:6px;background:var(--btn-color, var(--surface, #242424));color:var(--secondary, #d35400);cursor:pointer;transition:all .15s ease;height:36px;display:flex;align-items:center;gap:4px;position:relative}.chat-btn:hover{background:var(--secondary, #d35400);border-color:var(--secondary, #d35400);color:#fff}.unread-badge{position:absolute;top:-4px;right:-4px;background:var(--secondary, #d35400);color:#fff;font-size:9px;font-weight:700;padding:2px 5px;border-radius:10px;min-width:16px;text-align:center}.chat-overlay{position:fixed;inset:0;z-index:1999}.chat-dropdown{position:absolute;top:calc(100% + 8px);right:0;width:320px;max-height:480px;background:var(--surface, #f5f2eb);border-radius:8px;box-shadow:0 4px 20px #00000040;z-index:2000;display:flex;flex-direction:column;overflow:hidden}.chat-header{padding:12px 16px;border-bottom:1px solid rgba(128,128,128,.25)}.chat-title{font-family:var(--font-mono, monospace);font-size:12px;font-weight:700;text-transform:uppercase;color:var(--text, #1a1a1a)}.chat-tabs{display:flex;border-bottom:1px solid rgba(128,128,128,.25)}.chat-tab{flex:1;padding:8px;font-family:var(--font-mono, monospace);font-size:10px;font-weight:700;text-transform:uppercase;background:none;border:none;color:var(--text-muted, #666);cursor:pointer;transition:all .15s ease}.chat-tab:hover{color:var(--text, #1a1a1a)}.chat-tab.active{color:var(--secondary, #d35400);border-bottom:2px solid var(--secondary, #d35400)}.chat-search{padding:8px 12px;border-bottom:1px solid rgba(128,128,128,.25)}.chat-search input{width:100%;padding:8px 12px;font-family:var(--font-mono, monospace);font-size:11px;border:1px solid rgba(128,128,128,.3);border-radius:4px;background:var(--background, #e8e4dc);color:var(--text, #1a1a1a)}.chat-search input:focus{outline:none;border-color:var(--secondary, #d35400)}.chat-list{flex:1;overflow-y:auto;max-height:320px}.chat-empty{padding:24px;text-align:center;font-family:var(--font-mono, monospace);font-size:11px;color:var(--text-muted, #666)}.chat-list-item{display:flex;align-items:center;gap:10px;width:100%;padding:10px 12px;background:none;border:none;border-bottom:1px solid rgba(128,128,128,.2);cursor:pointer;text-align:left;transition:background .15s ease}.chat-list-item:hover{background:#80808026}.chat-list-item.unread{background:#d3540014}.chat-avatar{width:36px;height:36px;border-radius:50%;object-fit:cover}.chat-avatar-placeholder{width:36px;height:36px;border-radius:50%;background:var(--accent, #2d5a4a);color:#fff;display:flex;align-items:center;justify-content:center;font-family:var(--font-mono, monospace);font-size:14px;font-weight:700}.chat-avatar-placeholder.small{width:28px;height:28px;font-size:11px}.chat-item-info{flex:1;min-width:0}.chat-item-name{display:block;font-family:var(--font-mono, monospace);font-size:11px;font-weight:700;color:var(--text, #1a1a1a);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.chat-item-preview,.chat-item-stats{display:block;font-family:var(--font-mono, monospace);font-size:10px;color:var(--text-muted, #666);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;margin-top:2px}.chat-item-badge{background:var(--secondary, #d35400);color:#fff;font-family:var(--font-mono, monospace);font-size:9px;font-weight:700;padding:2px 6px;border-radius:10px;min-width:18px;text-align:center}.chat-window{display:flex;flex-direction:column;height:100%;max-height:480px}.chat-window-header{display:flex;align-items:center;gap:10px;padding:10px 12px;border-bottom:1px solid rgba(128,128,128,.25)}.chat-back-btn{padding:6px;background:none;border:none;border-radius:4px;cursor:pointer;color:var(--text, #1a1a1a);transition:background .15s ease}.chat-back-btn:hover{background:#80808026}.chat-window-avatar{width:28px;height:28px;border-radius:50%;object-fit:cover}.chat-window-name{font-family:var(--font-mono, monospace);font-size:12px;font-weight:700;color:var(--text, #1a1a1a)}.chat-messages{flex:1;overflow-y:auto;padding:12px;display:flex;flex-direction:column;gap:8px;background:var(--background, #e8e4dc)}.chat-messages-empty{flex:1;display:flex;align-items:center;justify-content:center;font-family:var(--font-mono, monospace);font-size:11px;color:var(--text-muted, #666)}.chat-message{display:flex;align-items:flex-end;gap:4px;max-width:85%}.chat-message.sent{align-self:flex-end;flex-direction:row-reverse}.chat-message.received{align-self:flex-start}.chat-message-content{padding:8px 12px;border-radius:12px;font-family:var(--font-mono, monospace);font-size:11px}.chat-message.sent .chat-message-content{background:var(--secondary, #d35400);color:#fff;border-bottom-right-radius:4px}.chat-message.received .chat-message-content{background:var(--surface, #f5f2eb);color:var(--text, #1a1a1a);border-bottom-left-radius:4px}.chat-message-content p{margin:0;word-wrap:break-word}.chat-message-time{display:block;font-size:9px;opacity:.7;margin-top:4px;text-align:right}.chat-unsend-btn{flex-shrink:0;background:none;border:none;color:transparent;font-size:10px;padding:2px 4px;cursor:pointer;border-radius:4px;line-height:1;transition:color .15s,background .15s;align-self:center}.chat-message.sent:hover .chat-unsend-btn{color:#ffffff80}.chat-unsend-btn:hover{color:#f87171!important;background:#f871711f}.chat-input-container{display:flex;gap:8px;padding:10px 12px;border-top:1px solid rgba(128,128,128,.25);background:var(--surface, #f5f2eb)}.chat-input{flex:1;padding:8px 12px;font-family:var(--font-mono, monospace);font-size:11px;border:1px solid rgba(128,128,128,.3);border-radius:20px;background:var(--background, #e8e4dc);color:var(--text, #1a1a1a)}.chat-input:focus{outline:none;border-color:var(--secondary, #d35400)}.chat-send-btn{padding:8px 12px;background:var(--secondary, #d35400);color:#fff;border:none;border-radius:20px;cursor:pointer;transition:all .15s ease;display:flex;align-items:center;justify-content:center}.chat-send-btn:hover:not(:disabled){filter:brightness(1.1)}.chat-send-btn:disabled{opacity:.5;cursor:not-allowed}.mobile-chat-fab{position:fixed;bottom:16px;right:16px;z-index:999}.mobile-chat-fab .chat-btn{width:52px;height:52px;border-radius:50%;padding:0;justify-content:center;box-shadow:0 4px 16px #00000073;font-size:0}.mobile-chat-fab .chat-dropdown{top:auto;bottom:calc(100% + 10px);right:0;left:auto;width:min(320px,90vw);max-height:min(480px,70vh)}.transport{display:flex;align-items:center;justify-content:space-between;padding:6px 12px;background:var(--surface);border-top:1px solid var(--background);flex-shrink:0;height:52px;min-height:52px}.transport-help{display:flex;gap:16px;font-family:var(--font-mono);font-size:10px;color:var(--text-muted);text-transform:uppercase;letter-spacing:.3px}.transport-help span{white-space:nowrap}.transport-buttons{display:flex;align-items:center;gap:4px}.transport-btn{display:flex;align-items:center;justify-content:center;gap:4px;padding:8px 12px;height:36px;background:var(--surface);border:1px solid rgba(128,128,128,.25);border-radius:4px;color:var(--text);font-family:var(--font-mono);font-size:11px;font-weight:700;cursor:pointer;transition:all .15s ease}.transport-btn:hover{background:var(--background);border-color:var(--secondary)}.transport-btn:active{transform:translateY(1px)}.transport-btn svg{width:14px;height:14px}.rewind-btn:hover,.ff-btn:hover{color:#3498db;border-color:#3498db}.record-btn:hover{color:#e74c3c;border-color:#e74c3c}.record-btn.active{background:#e74c3c;border-color:#e74c3c;color:#fff}.play-btn:hover{color:#27ae60;border-color:#27ae60}.play-btn.active{background:#27ae60;border-color:#27ae60;color:#fff}.stop-btn:hover{color:#f39c12;border-color:#f39c12}.transport-info{display:flex;align-items:center;gap:8px}.transport-time-counter{display:flex;flex-direction:column;align-items:center;gap:2px;padding:4px 10px;height:36px;background:#1a1a1a;border:1px solid rgba(128,128,128,.35);border-radius:4px;min-width:100px}.time-value{font-family:var(--font-mono);font-size:13px;font-weight:700;color:#4ade80;letter-spacing:1px}.time-unit{font-family:var(--font-mono);font-size:7px;font-weight:600;color:var(--text-muted);letter-spacing:.5px;text-transform:uppercase}.transport-bpm,.transport-step{display:flex;align-items:center;gap:4px;padding:8px 12px;height:36px;background:var(--background);border:1px solid rgba(128,128,128,.25);border-radius:4px}.bpm-value,.step-value{font-family:var(--font-mono);font-size:14px;font-weight:700;color:var(--secondary)}.bpm-unit,.step-unit{font-family:var(--font-mono);font-size:9px;font-weight:700;color:var(--text-muted);letter-spacing:.5px}.transport-status{display:flex;align-items:center;gap:6px;padding:8px 12px;height:36px;background:var(--background);border:1px solid rgba(128,128,128,.25);border-radius:4px;font-family:var(--font-mono);font-size:10px;font-weight:700;letter-spacing:.5px}.transport-status.playing{color:#27ae60;border-color:#27ae60}.transport-status.recording{color:#e74c3c;border-color:#e74c3c}.status-dot{width:8px;height:8px;border-radius:50%;animation:status-blink .5s infinite}.transport-status.playing .status-dot{background:#27ae60;box-shadow:0 0 8px #27ae60}.transport-status.recording .status-dot{background:#e74c3c;box-shadow:0 0 8px #e74c3c}@keyframes status-blink{0%,to{opacity:1}50%{opacity:.4}}.transport-brand{display:flex;align-items:center;gap:6px;font-family:var(--font-mono);font-size:10px;color:var(--text-muted)}.transport-brand a{color:var(--secondary);text-decoration:none;font-weight:700}.transport-brand a:hover{text-decoration:underline}@media(max-width:1100px){.transport{height:48px;min-height:48px;padding:5px 10px}.transport-btn{padding:6px 10px;height:32px;font-size:10px}.transport-btn svg{width:12px;height:12px}.transport-bpm,.transport-step,.transport-status{padding:6px 10px;height:32px}.transport-time-counter{padding:3px 8px;height:32px;min-width:90px}.time-value{font-size:11px}.time-unit{font-size:6px}.bpm-value,.step-value{font-size:12px}.transport-help{font-size:9px;gap:10px}}@media(max-width:900px){.transport{height:44px;min-height:44px;padding:4px 8px}.transport-btn{padding:5px 8px;height:28px;font-size:9px}.transport-btn svg{width:10px;height:10px}.transport-bpm,.transport-step,.transport-status{padding:4px 8px;height:28px}.transport-time-counter{padding:2px 6px;height:28px;min-width:80px}.time-value{font-size:10px}.time-unit{font-size:5px}.bpm-value,.step-value{font-size:11px}.transport-help{display:none}.transport-brand{font-size:9px}}.desktop-only{display:flex}.mobile-only{display:none}@media(max-width:768px){.desktop-only{display:none!important}.mobile-only{display:flex!important}.transport{flex-direction:column;height:auto;min-height:auto;padding:4px 8px;gap:4px}.transport-info-row{display:flex;align-items:center;justify-content:center;gap:4px;width:100%;flex-wrap:wrap}.transport-info-row .transport-time-counter{padding:2px 6px;height:26px;min-width:70px}.transport-info-row .time-value{font-size:9px}.transport-info-row .time-unit{font-size:5px}.transport-info-row .transport-bpm,.transport-info-row .transport-step{padding:3px 6px;height:26px;gap:2px}.transport-info-row .bpm-value,.transport-info-row .step-value{font-size:10px}.transport-info-row .bpm-unit,.transport-info-row .step-unit{font-size:7px}.transport-info-row .transport-status{padding:3px 6px;height:26px}.transport-controls-row{display:flex;align-items:center;justify-content:space-between;width:100%;gap:4px}.transport-controls-row .transport-buttons{flex:1;justify-content:center;gap:2px}.transport-controls-row .transport-btn{padding:4px 6px;height:32px;font-size:7px;gap:2px}.transport-controls-row .transport-btn svg{width:12px;height:12px}.transport-controls-row .transport-btn span{display:none}.mobile-action-btn{flex-shrink:0}.mobile-action-btn .css-panel-toggle,.mobile-action-btn .chat-btn{width:32px;height:32px;border-radius:4px}}@media(max-width:480px){.transport{padding:3px 6px;gap:3px}.transport-info-row{gap:2px}.transport-info-row .transport-time-counter{padding:1px 4px;height:22px;min-width:60px}.transport-info-row .time-value{font-size:8px}.transport-info-row .transport-bpm,.transport-info-row .transport-step{padding:2px 4px;height:22px}.transport-info-row .bpm-value,.transport-info-row .step-value{font-size:9px}.transport-controls-row .transport-btn{padding:3px 4px;height:28px}.transport-controls-row .transport-btn svg{width:10px;height:10px}.mobile-action-btn .css-panel-toggle,.mobile-action-btn .chat-btn{width:28px;height:28px}}.mobile-transport{display:flex;align-items:center;gap:3px;flex-shrink:0}.mt-btn{display:flex;align-items:center;justify-content:center;width:30px;height:30px;border-radius:4px;border:1px solid rgba(128,128,128,.3);background:var(--surface);color:var(--text);cursor:pointer;transition:all .12s ease;padding:0;flex-shrink:0}.mt-btn:hover:not(:disabled){border-color:var(--secondary);color:var(--secondary)}.mt-btn:disabled{opacity:.4;cursor:default}.mt-play.active{background:#27ae60;border-color:#27ae60;color:#fff}.mt-stop:hover:not(:disabled){border-color:#f39c12;color:#f39c12}.mt-rec.active{background:#e74c3c;border-color:#e74c3c;color:#fff;animation:mt-rec-pulse .8s ease-in-out infinite}@keyframes mt-rec-pulse{0%,to{opacity:1}50%{opacity:.7}}.mt-counter{display:flex;align-items:center;gap:6px;padding:0 8px;height:30px;background:#111;border:1px solid rgba(128,128,128,.25);border-radius:4px;flex-shrink:0}.mt-pos{font-family:var(--font-mono, monospace);font-size:12px;font-weight:700;color:#4ade80;letter-spacing:1px}.mt-bpm{font-family:var(--font-mono, monospace);font-size:12px;font-weight:700;color:var(--secondary, #d35400);white-space:nowrap}.mt-bpm-unit{font-size:8px;font-weight:600;color:var(--text-muted);margin-left:2px}.mt-dot{width:7px;height:7px;border-radius:50%;flex-shrink:0;animation:mt-dot-blink .6s ease-in-out infinite}.mt-dot.play{background:#27ae60;box-shadow:0 0 6px #27ae60}.mt-dot.rec{background:#e74c3c;box-shadow:0 0 6px #e74c3c}@keyframes mt-dot-blink{0%,to{opacity:1}50%{opacity:.3}}@media(max-height:420px)and (orientation:landscape){.mt-btn{width:26px;height:26px}.mt-counter{height:26px;padding:0 6px}.mt-pos,.mt-bpm{font-size:10px}}*{box-sizing:border-box}button{color:var(--text);background-color:var(--surface);border:1px solid var(--border-subtle, rgba(128, 128, 128, .3));border-radius:3px;font-family:var(--font-primary)}input,select,textarea{color:var(--text);background-color:var(--surface);border-color:var(--border-subtle, rgba(128, 128, 128, .3))}input::placeholder,textarea::placeholder{color:var(--text-muted)}.header-controls button,.header-controls select,.header-controls input{border-color:var(--border-subtle, rgba(128, 128, 128, .25))!important}:root{--background: #e8e4dc;--surface: #f5f2eb;--primary: #1a1a1a;--secondary: #d35400;--accent: #2d5a4a;--text: #1a1a1a;--text-muted: #666666;--pad-empty: #d4d0c8;--pad-filled: #d35400;--pad-active: #e67e22;--pad-playing: #27ae60;--waveform: #2d5a4a;--font-primary: "Inter", "Helvetica Neue", sans-serif;--font-mono: "JetBrains Mono", "Monaco", monospace;--border-subtle: rgba(128, 128, 128, .3);--border-mid: rgba(128, 128, 128, .2)}html,body{margin:0;padding:0;font-family:var(--font-primary);background:var(--background);color:var(--text)}#root{width:100vw;height:100vh;height:100dvh;overflow:hidden}.app-wrapper{display:flex;flex-direction:row;width:100%;height:100%;overflow:hidden}.app{display:flex;flex-direction:column;flex:1;min-width:0;height:100%;overflow:hidden;position:relative;transform:translateZ(0);will-change:contents;transition:flex .3s ease}.app-bg-overlay{position:absolute;inset:0;z-index:0;pointer-events:none}.app-header{display:flex;align-items:center;padding:6px 12px;background:var(--surface);border-bottom:1px solid var(--background);flex-shrink:0;gap:12px;height:52px;position:relative;z-index:1;overflow:visible;min-width:0}.header-left{display:flex;align-items:center;gap:10px;flex-shrink:0}.logo-image{height:38px;width:auto;flex-shrink:0}.title-riddim{font-family:var(--font-mono);font-size:20px;font-weight:700;letter-spacing:3px;color:var(--primary);text-transform:uppercase;white-space:nowrap;margin-right:12px}.title-logo-image{height:34px;width:auto;max-width:150px;object-fit:contain;margin-right:12px}.header-right{display:flex;align-items:center;gap:8px;flex-shrink:0;margin-left:auto}.header-controls{display:flex;align-items:center;gap:12px;flex:1;justify-content:flex-start;min-width:0;overflow:hidden;flex-wrap:nowrap}.header-controls>*{flex-shrink:1;min-width:0;max-width:100%}.header-controls button,.header-controls select{font-size:11px;padding:5px 10px;height:30px;border:1px solid rgba(128,128,128,.25)}.header-controls input{border:1px solid rgba(128,128,128,.25)}.ep-info-dropdown{position:relative;flex-shrink:0;margin-right:16px}.ep-info-btn{font-family:var(--font-mono);font-size:11px;font-weight:700;padding:5px 10px;height:30px;border:1px solid var(--accent, #2d5a4a);border-radius:4px;background:var(--accent, #2d5a4a);color:#fff;text-decoration:none;text-transform:uppercase;letter-spacing:.3px;display:flex;align-items:center;justify-content:center;cursor:pointer;transition:all .15s ease;white-space:nowrap}.ep-info-btn:hover{filter:brightness(1.15)}.ep-info-menu{position:absolute;top:100%;left:0;margin-top:4px;background:var(--surface);border:1px solid rgba(128,128,128,.25);border-radius:4px;box-shadow:0 4px 12px #00000026;min-width:160px;z-index:1000;overflow:hidden}.ep-info-menu-item{display:block;padding:10px 14px;font-family:var(--font-mono);font-size:11px;font-weight:600;color:var(--text);text-decoration:none;text-transform:uppercase;letter-spacing:.3px;transition:all .15s ease;border-bottom:1px solid rgba(128,128,128,.15)}.ep-info-menu-item:last-child{border-bottom:none}.ep-info-menu-item:hover{background:var(--accent, #2d5a4a);color:#fff}.mobile-project-bar{display:none}@media(max-width:768px){.mobile-project-bar{display:flex;align-items:center;gap:4px;padding:3px 8px;background:var(--surface);border-bottom:1px solid var(--background);flex-shrink:0;overflow:hidden;min-height:0}}@media(max-width:1100px){.app-header{height:48px;padding:5px 10px;gap:8px}.logo-image{height:34px}.title-riddim{font-size:17px;letter-spacing:2px}.header-controls{gap:6px}.header-controls button,.header-controls select,.ep-info-btn{padding:4px 8px;font-size:10px;height:26px}}@media(max-width:900px){.app-header{height:44px;padding:4px 8px;gap:6px}.header-left{gap:6px}.logo-image{height:30px}.title-riddim{font-size:15px;letter-spacing:1.5px}.title-logo-image{height:26px;max-width:100px}.header-controls{gap:4px}.header-controls button,.header-controls select,.ep-info-btn{padding:3px 6px;font-size:9px;height:24px}}.app-main{display:flex;flex-direction:column;flex:1;padding:0;gap:0;overflow:hidden;min-height:0;position:relative;z-index:1}.bottom-row{display:flex;flex-direction:row;flex:1;width:100%;min-height:0;gap:0;overflow:hidden;position:relative}.device-section{display:flex;height:100%;min-width:0;flex:1}.bottom-row .library-section{height:100%;flex-shrink:0;overflow:hidden}.library-resize-handle{width:6px;height:100%;flex-shrink:0;cursor:col-resize;background:transparent;position:relative;z-index:10;transition:background .15s ease}.library-resize-handle:after{content:"";position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:2px;height:40px;border-radius:2px;background:var(--secondary);opacity:.35;transition:opacity .15s ease,height .15s ease}.library-resize-handle:hover:after,.library-resize-handle:active:after{opacity:.85;height:70px}.bottom-row.library-hidden .device-section{flex:1}.device-section.layout-left{justify-content:flex-start}.device-section.layout-center{justify-content:center}.device-section.layout-right{justify-content:flex-end}.tab-section{width:100%;flex-shrink:0;min-height:0;overflow:hidden}@media(max-width:900px){.bottom-row{flex-direction:column;gap:4px}.bottom-row .library-section{width:100%;max-width:100%;min-width:100%;height:140px;max-height:140px;order:2}.bottom-row .device-section{order:1;flex:1}}.section-divider{width:100%;height:0;flex-shrink:0}.sound-edit-section{width:100%;flex-shrink:0;min-height:0;overflow:hidden}.sound-edit-section .sound-edit-window{height:100%}.library-section{min-width:0;min-height:0;overflow:hidden;flex-shrink:0}.app-footer{display:flex;justify-content:space-between;align-items:center;padding:clamp(4px,.4vw,8px) clamp(12px,1vw,20px);background:var(--surface);border-top:1px solid var(--background);flex-shrink:0;position:relative;z-index:1}.footer-help{display:flex;gap:clamp(8px,1vw,16px);font-family:var(--font-mono);font-size:clamp(8px,.5vw,12px);color:var(--text-muted);text-transform:uppercase;letter-spacing:.3px}.footer-brand{display:flex;align-items:center;gap:clamp(4px,.3vw,8px);font-family:var(--font-mono);font-size:clamp(8px,.5vw,12px);color:var(--text-muted)}.footer-brand a{color:var(--secondary);text-decoration:none;font-weight:700}.footer-brand a:hover{text-decoration:underline}.css-panel-toggle{width:30px;height:30px;border-radius:4px;background:var(--secondary);color:var(--secondary-contrast, #fff);border:none;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:all .2s ease;flex-shrink:0;margin-left:auto}.css-panel-toggle:hover{transform:scale(1.05);background:var(--pad-active)}.css-panel-toggle svg{width:18px;height:18px}.css-panel{width:0;height:100%;background:var(--surface);box-shadow:-4px 0 24px #0003;display:flex;flex-direction:column;overflow:hidden;transition:width .3s ease;flex-shrink:0}.css-panel.open{width:320px}.css-panel-header{display:flex;justify-content:space-between;align-items:center;padding:16px;border-bottom:2px solid var(--background)}.css-panel-title{font-family:var(--font-mono);font-size:14px;font-weight:700;letter-spacing:1px;margin:0}.css-panel-close{background:none;border:none;cursor:pointer;padding:8px;color:var(--text-muted);transition:color .15s ease}.css-panel-close:hover{color:var(--text)}.css-panel-content{flex:1;overflow-y:auto;padding:16px}.css-panel-overlay{display:none}@media(max-width:1200px){.footer-help{flex-wrap:wrap;gap:10px}}@media(max-width:768px){.app-header{height:auto;padding:4px 8px;gap:4px;flex-wrap:wrap}.header-left{gap:6px}.logo-image{height:28px}.title-riddim{font-size:14px;letter-spacing:1px}.title-logo-image{height:24px;max-width:90px}.header-controls{order:3;width:100%;gap:4px;overflow-x:auto}.header-controls button,.header-controls select,.ep-info-btn{padding:3px 6px;font-size:8px;height:22px}.header-right{gap:6px}.header-right .chat-btn,.header-right .css-panel-toggle{display:none}.app-main{padding:0;gap:0}.css-panel.open{width:100%}.app-wrapper.css-panel-open .app{display:none}.app-wrapper.css-panel-open .css-panel.open{width:100%}}@media(max-width:480px){.app-header{padding:3px 6px;gap:3px}.header-left{gap:4px}.logo-image{height:24px}.title-riddim{font-size:12px;letter-spacing:.5px}.title-logo-image{height:20px;max-width:70px}.header-controls{gap:3px}.header-controls button,.header-controls select,.ep-info-btn{padding:2px 4px;font-size:7px;height:20px}.header-right{gap:4px}.header-right button{padding:2px 4px;font-size:7px;height:20px}}@keyframes pulse{0%,to{opacity:1}50%{opacity:.5}}@keyframes shake{0%,to{transform:translate(0)}25%{transform:translate(-4px)}75%{transform:translate(4px)}}.pulse{animation:pulse 1s ease-in-out infinite}.shake{animation:shake .3s ease-in-out}.header-right button{border:1px solid rgba(128,128,128,.3);border-radius:6px;height:36px;min-width:36px;background:transparent;box-sizing:border-box;color:var(--secondary, #d35400)}.header-right button.active,.header-right button[aria-pressed=true]{border-color:var(--accent, #27ae60)}.header-right button:hover{background:var(--secondary, #d35400)!important;border-color:var(--secondary, #d35400)!important;color:#fff!important}.header-right .connect-btn{background:var(--secondary, #d35400);border-color:var(--secondary, #d35400);color:#fff}.header-right .connect-btn.disconnect{background:var(--text-muted, #666);border-color:#80808073;color:#fff}.header-right .connect-btn:hover{filter:brightness(1.15);color:#fff}.header-right button[style*=background],.header-right button.filled{color:#fff}