:root{--space-1: 8px;--space-2: 16px;--space-3: 24px;--space-4: 32px;--space-5: 40px;--surface-1: var(--bg);--surface-2: var(--glass);--border-1: var(--border-default);--border-2: var(--border-subtle);--text-1: var(--fg);--text-2: var(--text-dim)}.session-panel{position:absolute;left:var(--space-3);top:var(--space-3);padding:var(--space-3);max-width:380px;color:var(--text-1);font-family:var(--font-sans);border:1px solid var(--border-2);border-radius:2px;z-index:200;background:var(--bg);backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);box-shadow:0 8px 24px #00000080,inset 0 1px #ffffff0d;border-color:var(--accent-dim);transition:border-color .1s ease}.session-panel__grid{display:grid;grid-template-columns:auto 1fr;column-gap:var(--space-2);row-gap:var(--space-1);margin-bottom:var(--space-2)}.session-panel__grid>div:nth-child(odd){font-family:var(--font-sans);font-size:11px;color:var(--text-2);text-transform:uppercase;letter-spacing:.02em}.session-panel__grid>div:nth-child(2n){font-family:var(--font-mono);font-size:11px;color:var(--text-1);text-align:right}.session-panel__header{display:flex;align-items:baseline;justify-content:space-between;margin-bottom:var(--space-2);padding-bottom:var(--space-1);border-bottom:1px solid var(--border-2);font-family:var(--font-mono);font-size:10px;letter-spacing:.08em;text-transform:uppercase}.session-panel__number{opacity:.7;font-weight:400}.session-panel__title{opacity:.9;font-weight:600}.session-panel__exit-btn{margin-left:auto;padding:2px 8px;background:#320c0cd9;border:1px solid rgba(204,96,96,.55);color:#f0a8a8;font-family:var(--font-mono, "VT323", monospace);font-size:9px;font-weight:600;letter-spacing:.1em;text-transform:uppercase;cursor:pointer;transition:all .15s ease}.session-panel__exit-btn:hover{background:#461010f2;border-color:#dc8282d9;color:#ffd6d6}.session-panel__exit-btn:focus-visible{outline:1px solid rgba(255,80,80,.8);outline-offset:2px}.session-panel__exit-btn:active{transform:scale(.95)}.session-panel:before,.session-panel:after{content:"";position:absolute;width:16px;height:16px;border:1px solid var(--border-1);opacity:.5;pointer-events:none}.session-panel:before{top:8px;left:8px;border-right:none;border-bottom:none}.session-panel:after{top:8px;right:8px;border-left:none;border-bottom:none}.session-panel__transport{display:flex;gap:var(--space-1);margin:var(--space-2) 0 var(--space-1);flex-wrap:wrap}.session-panel__transport-button{font-family:var(--font-sans);font-size:12px;font-weight:500;padding:6px 12px;border-radius:2px;border:1px solid var(--border-2);background:var(--surface-2);color:var(--text-1);cursor:pointer;transition:all var(--transition-micro, .1s cubic-bezier(.19, 1, .22, 1)),transform var(--duration-instant, 50ms) ease-out;position:relative;overflow:hidden}.session-panel__transport-button:before{content:"";position:absolute;top:0;left:-100%;width:50%;height:100%;background:linear-gradient(90deg,transparent 0%,rgba(255,255,255,.1) 50%,transparent 100%);transform:skew(-25deg);transition:left .4s ease-out;pointer-events:none}.session-panel__transport-button:hover:before{left:150%}.session-panel__transport-button:hover{background:var(--surface-1);border-color:var(--border-1)}.session-panel__transport-button:active{transform:translateY(1px)}.session-panel__transport-button.is-recording{color:#ef4444;border-color:#ef4444;background:#ef444426;animation:pulse-recording 1.5s ease-in-out infinite}.session-panel__transport-button.is-playing{color:var(--accent);border-color:var(--accent);background:#4ae0e026;box-shadow:0 0 8px #4ae0e033}.session-panel__transport-button.is-stopped{color:var(--text-2);border-color:var(--border-2);background:var(--surface-2)}.session-panel__transport-button:focus-visible{outline:2px solid var(--accent);outline-offset:2px}@keyframes pulse-recording{0%,to{opacity:1;box-shadow:0 0 8px #ef44444d}50%{opacity:.7;box-shadow:0 0 16px #ef444480}}@keyframes pulse{0%,to{opacity:1}50%{opacity:.6}}.session-panel__kbd-hints{display:flex;gap:var(--space-1);margin-top:4px;font-family:var(--font-mono);font-size:9px;color:var(--text-2);justify-content:flex-start}.session-panel__kbd-hints>span{min-width:60px;text-align:center}.session-panel__level-bar{position:relative;height:6px;background:#ffffff1f;border-radius:1px;overflow:hidden}.session-panel__level-fill{position:absolute;left:0;top:0;bottom:0;width:0%;background:var(--accent);transition:width .05s linear}.session-panel__grid-controls{display:flex;align-items:center;gap:8px}.session-panel__grid-preset{padding:4px 8px;background:#0009;color:#ffffffe6;border:1px solid rgba(255,255,255,.15);border-radius:0;font-family:var(--font-mono);font-size:10px;cursor:pointer;transition:all .15s ease}.session-panel__grid-preset:hover{border-color:var(--accent);background:#4ae0e00d}.session-panel__grid-preset:focus-visible{outline:2px solid var(--accent);outline-offset:2px}.session-panel__grid-toggle{width:24px;height:24px;padding:0;background:#0009;color:var(--accent);border:1px solid rgba(255,255,255,.15);border-radius:0;cursor:pointer;font-size:14px;display:flex;align-items:center;justify-content:center;transition:all .15s ease}.session-panel__grid-toggle:hover{border-color:var(--accent);background:#4ae0e01a}.session-panel__grid-toggle:focus-visible{outline:2px solid var(--accent);outline-offset:2px}.session-panel__grid-controls .session-panel__kbd-hint{font-family:var(--font-mono);font-size:9px;color:#ffffff80;letter-spacing:.05em}.session-panel__stats{display:flex;flex-direction:column;gap:4px;margin:var(--space-2) 0;padding:var(--space-1);background:#0000004d;border-radius:2px}.session-panel__stats>div{font-family:var(--font-mono);font-size:10px;font-variant-numeric:tabular-nums;color:var(--text-2)}.session-panel__actions{display:flex;flex-wrap:wrap;gap:var(--space-1);margin-top:var(--space-2)}.session-panel__action-button{font-family:var(--font-sans);font-size:12px;font-weight:500;padding:8px 16px;border-radius:2px;border:1px solid var(--border-2);background:transparent;color:var(--text-1);cursor:pointer;transition:all .15s ease}.session-panel__action-button:hover{background:var(--surface-2);border-color:var(--border-1)}.session-panel__action-button:active{transform:translateY(1px)}.session-panel__action-button.primary{background:var(--surface-2);border-color:var(--border-1)}.control-panel:before,.control-panel:after{content:"";position:absolute;width:16px;height:16px;border:1px solid var(--border-1);opacity:.5;pointer-events:none}.control-panel:before{top:8px;left:8px;border-right:none;border-bottom:none}.control-panel:after{top:8px;right:8px;border-left:none;border-bottom:none}.layer-item.locked{opacity:.6;pointer-events:none;cursor:not-allowed}.layer-item.locked input,.layer-item.locked select,.layer-item.locked button{cursor:not-allowed;opacity:.5}.layer-item.locked .layer-name{text-decoration:line-through;opacity:.7}:root{--duration-instant: 50ms;--duration-fast: .1s;--duration-normal: .2s;--duration-slow: .4s;--duration-dramatic: .6s;--ease-out-expo: cubic-bezier(.19, 1, .22, 1);--ease-out-back: cubic-bezier(.34, 1.56, .64, 1);--ease-in-out-circ: cubic-bezier(.85, 0, .15, 1);--ease-spring: cubic-bezier(.175, .885, .32, 1.275);--ease-bounce: cubic-bezier(.68, -.55, .265, 1.55);--transition-micro: var(--duration-fast) var(--ease-out-expo);--transition-standard: var(--duration-normal) var(--ease-out-expo);--transition-emphasis: var(--duration-slow) var(--ease-spring);--stagger-1: 0ms;--stagger-2: 30ms;--stagger-3: 60ms;--stagger-4: 90ms;--stagger-5: .12s}:root{--accent-primary: var(--accent);--accent-primary-hover: var(--accent-hover);--accent-primary-glow: var(--accent-glow);--accent-primary-strong-glow: var(--accent-dim);--accent-secondary: #f59e0b;--accent-secondary-hover: #fbbf24;--accent-secondary-glow: rgba(245, 158, 11, .15);--accent-tertiary: #d946ef;--accent-tertiary-hover: #e879f9;--accent-tertiary-glow: rgba(217, 70, 239, .15);--color-success: #22c55e;--color-success-glow: rgba(34, 197, 94, .15);--color-warning: #f59e0b;--color-warning-glow: rgba(245, 158, 11, .15);--color-error: #ef4444;--color-error-glow: rgba(239, 68, 68, .15);--color-info: var(--accent-primary);--color-info-glow: var(--accent-primary-glow);--temperature-warm: rgba(255, 180, 100, .05);--temperature-cool: rgba(100, 180, 255, .05);--temperature-current: var(--temperature-cool);--gradient-accent: linear-gradient( 135deg, var(--accent-primary) 0%, var(--accent-tertiary) 100% );--gradient-accent-subtle: linear-gradient( 135deg, var(--accent-glow) 0%, var(--accent-tertiary-glow) 100% )}:root{--surface-gradient-1: linear-gradient( 180deg, var(--border-subtle) 0%, transparent 50%, var(--border-subtle) 100% );--surface-gradient-radial: radial-gradient( ellipse at 50% 0%, var(--accent-glow) 0%, transparent 70% );--noise-texture: url("data:image/svg+xml,%3Csvg viewBox='0 0 200 200' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='noise'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.65' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23noise)'/%3E%3C/svg%3E");--edge-highlight-top: linear-gradient( 180deg, var(--border-default) 0%, transparent 2px );--edge-highlight-left: linear-gradient( 90deg, var(--border-subtle) 0%, transparent 2px );--inner-shadow-subtle: inset 0 1px 0 var(--border-subtle);--inner-shadow-deep: inset 0 2px 4px rgba(0, 0, 0, .3)}.glass-enhanced{position:relative;background:var(--surface-gradient-1),var(--bg);box-shadow:var(--inner-shadow-subtle)}.glass-enhanced:before{content:"";position:absolute;inset:0;background:var(--surface-gradient-radial);pointer-events:none}.noise-overlay:after{content:"";position:absolute;inset:0;background:var(--noise-texture);opacity:.03;pointer-events:none;mix-blend-mode:overlay}.frosted-edge{border-top:1px solid var(--border-default);box-shadow:var(--inner-shadow-subtle),0 -1px #00000080}.micro-scale{transition:transform var(--transition-micro),box-shadow var(--transition-micro)}.micro-scale:hover{transform:scale(1.02)}.micro-scale:active{transform:scale(.98)}.press-feedback{transition:transform var(--duration-instant) ease-out,filter var(--duration-instant) ease-out}.press-feedback:active{transform:translateY(1px) scale(.99);filter:brightness(.95)}.shimmer{position:relative;overflow:hidden}.shimmer:before{content:"";position:absolute;top:0;left:-100%;width:50%;height:100%;background:linear-gradient(90deg,transparent 0%,rgba(255,255,255,.1) 50%,transparent 100%);transform:skew(-25deg);transition:left .5s ease-out}.shimmer:hover:before{left:150%}@keyframes glow-pulse{0%,to{box-shadow:0 0 8px var(--glow-color, var(--accent-primary-glow))}50%{box-shadow:0 0 20px var(--glow-color, var(--accent-primary-strong-glow))}}.glow-pulse{animation:glow-pulse 2s ease-in-out infinite}@keyframes border-glow{0%,to{border-color:#4ae0e04d}50%{border-color:#4ae0e099}}.border-glow{animation:border-glow 2s ease-in-out infinite}.ripple{position:relative;overflow:hidden}.ripple:after{content:"";position:absolute;border-radius:50%;background:#fff3;transform:scale(0);animation:none;pointer-events:none}.ripple.ripple-active:after{animation:ripple-expand .4s ease-out}@keyframes ripple-expand{to{transform:scale(4);opacity:0}}:root{--shadow-xs: 0 1px 2px rgba(0, 0, 0, .5);--shadow-sm: 0 2px 4px rgba(0, 0, 0, .5), 0 1px 2px rgba(0, 0, 0, .3);--shadow-md: 0 4px 8px rgba(0, 0, 0, .5), 0 2px 4px rgba(0, 0, 0, .3);--shadow-lg: 0 8px 16px rgba(0, 0, 0, .5), 0 4px 8px rgba(0, 0, 0, .3);--shadow-xl: 0 16px 32px rgba(0, 0, 0, .6), 0 8px 16px rgba(0, 0, 0, .4);--shadow-2xl: 0 24px 48px rgba(0, 0, 0, .7), 0 12px 24px rgba(0, 0, 0, .5);--shadow-glow-cyan: 0 0 20px rgba(74, 224, 224, .3);--shadow-glow-amber: 0 0 20px rgba(245, 158, 11, .3);--shadow-glow-magenta: 0 0 20px rgba(217, 70, 239, .3)}.elevation-1{box-shadow:var(--shadow-sm)}.elevation-2{box-shadow:var(--shadow-md)}.elevation-3{box-shadow:var(--shadow-lg)}.elevation-4{box-shadow:var(--shadow-xl)}.lift-on-hover{transition:transform var(--transition-standard),box-shadow var(--transition-standard)}.lift-on-hover:hover{transform:translateY(-2px);box-shadow:var(--shadow-lg)}.depth-blur-1{filter:blur(0)}.depth-blur-2{filter:blur(.5px);opacity:.9}.depth-blur-3{filter:blur(1px);opacity:.8}.crt-scanlines{position:relative}.crt-scanlines:after{content:"";position:absolute;inset:0;background:repeating-linear-gradient(0deg,rgba(0,0,0,.1) 0px,rgba(0,0,0,.1) 1px,transparent 1px,transparent 2px);pointer-events:none;opacity:.3}.chromatic-hover{transition:filter var(--transition-micro)}.chromatic-hover:hover{filter:drop-shadow(-1px 0 0 rgba(255,0,0,.3)) drop-shadow(1px 0 0 rgba(0,255,255,.3))}@keyframes glitch-text{0%,90%,to{opacity:1;transform:none;clip-path:none}92%{opacity:.8;transform:translate(-2px);clip-path:inset(20% 0 40% 0)}94%{opacity:.9;transform:translate(2px);clip-path:inset(60% 0 10% 0)}96%{opacity:.85;transform:translate(-1px);clip-path:inset(30% 0 50% 0)}98%{opacity:.95;transform:translate(1px);clip-path:inset(70% 0 5% 0)}}.glitch-text{animation:glitch-text 4s ease-in-out infinite}@keyframes glitch-subtle{0%,95%,to{transform:none}96%{transform:translate(1px)}97%{transform:translate(-1px)}98%{transform:translate(.5px)}}.glitch-subtle:hover{animation:glitch-subtle .3s ease-in-out}@keyframes vhs-noise{0%,to{background-position:0 0}10%{background-position:-5% -10%}30%{background-position:3% 15%}50%{background-position:-2% 5%}70%{background-position:5% -5%}90%{background-position:-1% 10%}}.vhs-noise:before{content:"";position:absolute;inset:0;background:linear-gradient(transparent 0%,rgba(255,255,255,.02) 50%,transparent 50%);background-size:100% 4px;animation:vhs-noise .5s steps(10) infinite;pointer-events:none;opacity:0;transition:opacity var(--transition-standard)}.vhs-noise:hover:before{opacity:1}.pixel-grid{image-rendering:pixelated;image-rendering:crisp-edges}@keyframes skeleton-shimmer{0%{background-position:-200% 0}to{background-position:200% 0}}.skeleton{background:linear-gradient(90deg,#ffffff0d 25%,#ffffff1a 37%,#ffffff0d 63%);background-size:200% 100%;animation:skeleton-shimmer 1.5s ease-in-out infinite}.skeleton-text{height:1em;border-radius:2px;margin-bottom:.5em}.skeleton-box{height:100px;border-radius:2px}@keyframes pulse-placeholder{0%,to{opacity:.4}50%{opacity:.7}}.pulse-placeholder{background:#ffffff1a;animation:pulse-placeholder 1.5s ease-in-out infinite}.progress-bar{height:4px;background:#ffffff1a;overflow:hidden;position:relative}.progress-bar-fill{height:100%;background:var(--accent-primary);transition:width var(--transition-standard)}@keyframes progress-indeterminate{0%{left:-50%;width:50%}to{left:100%;width:30%}}.progress-bar-indeterminate .progress-bar-fill{position:absolute;animation:progress-indeterminate 1.5s ease-in-out infinite}.progress-bar-audio .progress-bar-fill{background:linear-gradient(90deg,var(--accent-primary) 0%,var(--accent-tertiary) 50%,var(--accent-primary) 100%);background-size:200% 100%;animation:gradient-shift 2s ease-in-out infinite}@keyframes gradient-shift{0%,to{background-position:0% 50%}50%{background-position:100% 50%}}.status-indicator{width:8px;height:8px;border-radius:50%;background:var(--color-success);box-shadow:0 0 8px var(--color-success-glow)}.status-indicator.disconnected{background:var(--color-error);box-shadow:0 0 8px var(--color-error-glow)}.status-indicator.connecting{background:var(--color-warning);box-shadow:0 0 8px var(--color-warning-glow);animation:pulse-placeholder 1s ease-in-out infinite}@keyframes spin{to{transform:rotate(360deg)}}.spinner{width:24px;height:24px;border:2px solid rgba(255,255,255,.1);border-top-color:var(--accent-primary);border-radius:50%;animation:spin .8s linear infinite}.spinner-sm{width:16px;height:16px}.spinner-lg{width:32px;height:32px}:root{--audio-level: 0;--audio-bass: 0;--audio-mid: 0;--audio-high: 0;--audio-beat: 0}.audio-border{border-color:rgba(74,224,224,calc(.2 + var(--audio-level) * .4));box-shadow:0 0 calc(8px + var(--audio-level) * 16px) rgba(74,224,224,calc(.1 + var(--audio-level) * .3));transition:border-color 50ms,box-shadow 50ms}.audio-breathe{background-color:rgba(0,0,0,calc(.7 + var(--audio-bass) * .15));transition:background-color .1s}.audio-accent-bass{--accent-primary: hsl(180, 70%, calc(55% + var(--audio-bass) * 15%))}.audio-beat-pulse{transform:scale(calc(1 + var(--audio-beat) * .03));transition:transform 50ms}@keyframes beat-shake{0%,to{transform:translate(0)}25%{transform:translate(-2px)}75%{transform:translate(2px)}}.audio-beat-shake{animation:none}.audio-beat-shake.beat-active{animation:beat-shake .1s ease-out}.audio-gradient-bg{background:linear-gradient(135deg,rgba(74,224,224,calc(.05 + var(--audio-bass) * .1)),rgba(217,70,239,calc(.03 + var(--audio-high) * .08)));transition:background .1s}@keyframes fade-in-up{0%{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}@keyframes fade-in-scale{0%{opacity:0;transform:scale(.95)}to{opacity:1;transform:scale(1)}}@keyframes slide-in-right{0%{opacity:0;transform:translate(20px)}to{opacity:1;transform:translate(0)}}.stagger-enter>*{opacity:0;animation:fade-in-up var(--duration-normal) var(--ease-out-expo) forwards}.stagger-enter>*:nth-child(1){animation-delay:var(--stagger-1)}.stagger-enter>*:nth-child(2){animation-delay:var(--stagger-2)}.stagger-enter>*:nth-child(3){animation-delay:var(--stagger-3)}.stagger-enter>*:nth-child(4){animation-delay:var(--stagger-4)}.stagger-enter>*:nth-child(5){animation-delay:var(--stagger-5)}.stagger-enter>*:nth-child(n+6){animation-delay:calc(var(--stagger-5) + 30ms)}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}@keyframes fadeOut{0%{opacity:1}to{opacity:0}}@keyframes slideInUp{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}@keyframes slideOutDown{0%{opacity:1;transform:translateY(0)}to{opacity:0;transform:translateY(20px)}}.texture-preview-modal{all:initial;display:flex;align-items:center;justify-content:center;position:fixed;inset:0;z-index:2100;animation:fadeIn var(--duration-normal) var(--ease-out-expo)}.texture-preview-modal *{box-sizing:border-box}.texture-preview-modal .modal-overlay{position:absolute;inset:0;background:#00000080;backdrop-filter:blur(4px);cursor:pointer}.texture-preview-modal .modal-content{position:relative;background:var(--bg);border-radius:12px;max-width:600px;width:90%;max-height:80vh;overflow-y:auto;box-shadow:var(--shadow-2xl);display:flex;flex-direction:column;animation:fadeIn var(--duration-normal) var(--ease-out-expo)}.texture-preview-modal .modal-header{padding:24px;border-bottom:1px solid var(--border-subtle);display:flex;align-items:center;justify-content:space-between;flex-shrink:0}.texture-preview-modal .modal-header h2{margin:0;font-size:18px;font-weight:600;color:var(--fg);font-family:-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif}.texture-preview-modal .modal-close{background:none;border:none;color:var(--text-dim);font-size:24px;cursor:pointer;padding:0;width:32px;height:32px;display:flex;align-items:center;justify-content:center;border-radius:4px;transition:all var(--transition-micro);flex-shrink:0}.texture-preview-modal .modal-close:hover{background:var(--border-subtle);color:var(--fg)}.texture-preview-modal .modal-body{padding:24px;flex:1;display:flex;align-items:center;justify-content:center;min-height:300px;background:var(--bg)}.texture-preview-modal .preview-image,.texture-preview-modal .preview-video{max-width:100%;max-height:100%;border-radius:8px;object-fit:contain}.texture-preview-modal .modal-info{padding:16px 24px;border-top:1px solid var(--border-subtle);background:var(--bg);flex-shrink:0}.texture-preview-modal .file-info{margin:0;padding:0;display:grid;grid-template-columns:80px 1fr;gap:12px 8px;font-size:13px;font-family:monospace;color:var(--text-primary)}.texture-preview-modal .file-info dt{font-weight:600;color:var(--fg)}.texture-preview-modal .file-info dd{margin:0;word-break:break-all}.texture-preview-modal .modal-actions{padding:16px 24px;border-top:1px solid var(--border-subtle);display:flex;gap:12px;justify-content:flex-end;flex-shrink:0}.texture-preview-modal .action-btn{padding:8px 16px;border:none;border-radius:6px;font-size:14px;font-weight:600;cursor:pointer;transition:all var(--transition-micro);font-family:-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif}.texture-preview-modal .cancel-btn{background:var(--border-subtle);color:var(--text-primary)}.texture-preview-modal .cancel-btn:hover{background:var(--border-active);color:var(--fg)}.texture-preview-modal .confirm-btn{background:var(--accent);color:var(--bg);font-weight:700}.texture-preview-modal .confirm-btn:hover{background:var(--accent-hover);transform:scale(1.02)}.texture-preview-modal .confirm-btn:active{transform:scale(.98)}.texture-loading-indicator{position:fixed;top:50%;left:50%;transform:translate(-50%,-50%);background:var(--bg);padding:32px;border-radius:8px;z-index:2000;display:flex;flex-direction:column;align-items:center;gap:16px;backdrop-filter:blur(4px);animation:fadeIn var(--duration-fast) var(--ease-out-expo)}.texture-loading-indicator .loading-overlay{display:flex;flex-direction:column;align-items:center;gap:16px}.texture-loading-indicator .loading-spinner{width:50px;height:50px;position:relative;display:inline-block}.texture-loading-indicator .spinner-ring{position:absolute;width:100%;height:100%;border:3px solid var(--accent-glow);border-radius:50%;animation:spin var(--duration-slow) linear infinite}.texture-loading-indicator .spinner-ring:nth-child(1){border-top-color:var(--accent)}.texture-loading-indicator .spinner-ring:nth-child(2){width:75%;height:75%;top:12.5%;left:12.5%;border-top-color:var(--accent-tertiary);animation-duration:1.2s;animation-direction:reverse}.texture-loading-indicator .spinner-ring:nth-child(3){width:50%;height:50%;top:25%;left:25%;border-top-color:var(--accent-glow);animation-duration:.6s}.texture-loading-indicator .loading-text{margin:0;color:var(--fg);font-size:14px;font-weight:500;text-align:center;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif}.texture-error-notification{position:fixed;bottom:20px;right:20px;background:var(--color-error);color:#fff;padding:16px 20px;border-radius:6px;font-size:14px;z-index:1000;max-width:320px;box-shadow:var(--shadow-lg);animation:slideInUp var(--duration-normal) var(--ease-out-expo);border-left:4px solid var(--color-error-glow);font-family:-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif}.preset-qr-modal{all:initial;display:flex;align-items:center;justify-content:center;position:fixed;inset:0;z-index:2100;animation:fadeIn var(--duration-normal) var(--ease-out-expo)}.preset-qr-modal *{box-sizing:border-box}.preset-qr-modal .qr-modal-overlay{position:absolute;inset:0;background:var(--bg);backdrop-filter:blur(4px);cursor:pointer}.preset-qr-modal .qr-modal-content{position:relative;background:var(--bg);border-radius:12px;max-width:500px;width:90%;box-shadow:var(--shadow-2xl);display:flex;flex-direction:column;animation:fadeIn var(--duration-normal) var(--ease-out-expo)}.preset-qr-modal .qr-modal-header{padding:24px;border-bottom:1px solid var(--border-subtle);display:flex;align-items:center;justify-content:space-between;flex-shrink:0}.preset-qr-modal .qr-modal-header h2{margin:0;font-size:18px;font-weight:600;color:var(--fg);font-family:-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif}.preset-qr-modal .qr-modal-close{background:none;border:none;color:var(--text-dim);font-size:24px;cursor:pointer;padding:0;width:32px;height:32px;display:flex;align-items:center;justify-content:center;border-radius:4px;transition:all var(--transition-micro);flex-shrink:0;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif}.preset-qr-modal .qr-modal-close:hover{background:var(--border-subtle);color:var(--fg)}.preset-qr-modal .qr-modal-body{padding:32px 24px;flex:1;display:flex;flex-direction:column;align-items:center;gap:24px;background:var(--bg)}.preset-qr-modal .qr-code-container{padding:16px;background:#fff;border-radius:8px;box-shadow:0 4px 12px #0000004d}.preset-qr-modal .qr-code-image{display:block;max-width:300px;height:auto;image-rendering:pixelated;image-rendering:crisp-edges}.preset-qr-modal .qr-info{text-align:center;color:var(--fg);font-family:-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif}.preset-qr-modal .qr-info p{margin:4px 0;font-size:14px;line-height:1.4}.preset-qr-modal .qr-info p:first-child{font-weight:600}.preset-qr-modal .qr-actions{display:flex;gap:12px;justify-content:center;flex-wrap:wrap}.preset-qr-modal .qr-btn{padding:10px 16px;border:1px solid var(--border-default);background:var(--bg);color:var(--text-primary);border-radius:6px;font-size:14px;font-weight:500;cursor:pointer;transition:all var(--transition-micro);font-family:-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif}.preset-qr-modal .qr-btn:hover{background:var(--border-subtle);border-color:var(--accent);transform:scale(1.02)}.preset-qr-modal .qr-btn:active{transform:scale(.98)}.preset-qr-modal .qr-modal-footer{padding:16px 24px;border-top:1px solid var(--border-subtle);text-align:center;color:var(--text-dim);font-size:12px;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif}@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}.glitch-text,.glitch-subtle,.vhs-noise:before,.crt-scanlines:after,.chromatic-hover:hover,.shimmer:before{animation:none!important;filter:none!important;opacity:0!important}.glow-pulse,.border-glow{animation:none!important}}@keyframes control-flash{0%,to{background-color:transparent}50%{background-color:#4ae0e033;box-shadow:0 0 8px #4ae0e04d}}.control-changed{animation:control-flash .3s ease-out}@keyframes pulse{0%,to{transform:scale(1);opacity:1}50%{transform:scale(1.03);opacity:.9}}.pulse-active{animation:pulse 1.5s ease-in-out infinite}@keyframes ripple{0%{transform:scale(0);opacity:1}to{transform:scale(4);opacity:0}}.ripple{position:absolute;border-radius:50%;background:#ffffff80;width:20px;height:20px;margin-left:-10px;margin-top:-10px;animation:ripple .6s ease-out;pointer-events:none}@keyframes shake{0%,to{transform:translate(0)}10%,30%,50%,70%,90%{transform:translate(-5px)}20%,40%,60%,80%{transform:translate(5px)}}.shake{animation:shake .5s cubic-bezier(.36,.07,.19,.97)}.glowing{transition:box-shadow .2s ease}.active-control{border-color:var(--color-primary);background-color:#4ae0e01a}.smooth-transition{transition:all .2s ease}.focus-glow:focus-within{box-shadow:0 0 8px #4ae0e080}@keyframes button-press{0%{transform:scale(1)}50%{transform:scale(.95)}to{transform:scale(1)}}.button-pressed{animation:button-press .2s ease-out}@keyframes value-flash{0%,to{color:inherit}50%{color:var(--color-primary)}}.value-changed{animation:value-flash .4s ease-out}@keyframes loading-pulse{0%,to{opacity:1}50%{opacity:.5}}.loading-pulse{animation:loading-pulse 1s ease-in-out infinite}.numeric-input{display:grid;grid-template-columns:1fr auto;grid-template-rows:auto auto;gap:.4rem .6rem;align-items:center;padding:.3rem 0;border-radius:4px;transition:background-color .2s ease}.numeric-input.focused{background-color:#4ae0e00d}.numeric-input__label{grid-column:1;grid-row:1;font-size:.7rem;font-weight:500;color:var(--color-text-secondary, #a0a0a0);text-transform:uppercase;letter-spacing:.05em}.numeric-input__slider{grid-column:1 / -1;grid-row:2;width:100%;height:4px;-webkit-appearance:none;appearance:none;background:linear-gradient(to right,#4ae0e04d,#4ae0e099);outline:none;border-radius:2px;cursor:pointer;transition:height .1s ease,background .2s ease}.numeric-input__slider:hover{height:6px}.numeric-input__slider:focus{height:6px;background:linear-gradient(to right,#4ae0e080,#4ae0e0cc)}.numeric-input__slider::-webkit-slider-thumb{-webkit-appearance:none;appearance:none;width:14px;height:14px;background:#4ae0e0;border:2px solid #fff;border-radius:50%;cursor:pointer;box-shadow:0 1px 3px #0000004d;transition:transform .1s ease,box-shadow .1s ease}.numeric-input__slider::-webkit-slider-thumb:hover{transform:scale(1.15);box-shadow:0 2px 6px #4ae0e080}.numeric-input__slider::-webkit-slider-thumb:active{transform:scale(1.05)}.numeric-input__slider::-moz-range-thumb{width:14px;height:14px;background:#4ae0e0;border:2px solid #fff;border-radius:50%;cursor:pointer;box-shadow:0 1px 3px #0000004d;transition:transform .1s ease,box-shadow .1s ease}.numeric-input__slider::-moz-range-thumb:hover{transform:scale(1.15);box-shadow:0 2px 6px #4ae0e080}.numeric-input__slider::-moz-range-thumb:active{transform:scale(1.05)}.numeric-input__text{grid-column:2;grid-row:1;width:4.5rem;padding:.25rem .4rem;font-size:.75rem;font-family:Monaco,Courier New,monospace;font-weight:500;text-align:right;border:1px solid rgba(74,224,224,.3);background:#14141ecc;color:var(--color-text, #e0e0e0);border-radius:3px;outline:none;transition:border-color .2s ease,background-color .2s ease,box-shadow .2s ease}.numeric-input__text:hover{border-color:#4ae0e080;background:#14141ee6}.numeric-input__text:focus{border-color:#4ae0e0;background:#1e1e28;box-shadow:0 0 0 2px #4ae0e033}.numeric-input__text::selection{background:#4ae0e066}.numeric-input.compact{gap:.2rem .4rem}.numeric-input.compact .numeric-input__label{font-size:.65rem}.numeric-input.compact .numeric-input__text{width:4rem;padding:.2rem .3rem;font-size:.7rem}.numeric-input.compact .numeric-input__slider{height:3px}.numeric-input.error .numeric-input__text{border-color:#f44;background:#ff44441a}.numeric-input.error .numeric-input__slider{background:linear-gradient(to right,#ff44444d,#f449)}.numeric-input.disabled{opacity:.5;pointer-events:none}.numeric-input.disabled .numeric-input__slider{background:#8080804d}.numeric-input.disabled .numeric-input__text{color:var(--color-text-disabled, #666);background:#32323c80}*{margin:0;padding:0;box-sizing:border-box}:root{color-scheme:light dark;--accent: #4ae0e0;--accent-dim: rgba(74, 224, 224, .4);--accent-glow: rgba(74, 224, 224, .15);--accent-hover: #5ee8e8;--bg: #ffffff;--fg: rgba(0, 0, 0, .92);--glass: rgba(255, 255, 255, .95);--surface: rgba(240, 240, 245, .8);--border-subtle: rgba(0, 0, 0, .06);--border-default: rgba(0, 0, 0, .12);--border-active: rgba(0, 0, 0, .2);--border-structure: rgba(0, 0, 0, .12);--text-primary: rgba(0, 0, 0, .8);--text-dim: rgba(0, 0, 0, .65);--band-low: rgba(0, 150, 200, .5);--band-mid: rgba(180, 0, 180, .5);--band-high: rgba(200, 180, 0, .5);--band-onset: rgba(200, 100, 0, .5)}@media(prefers-color-scheme:dark){:root{--bg: #000000;--fg: rgba(255, 255, 255, .92);--glass: rgba(0, 0, 0, .35);--surface: rgba(0, 0, 0, .6);--border-subtle: rgba(255, 255, 255, .08);--border-default: rgba(255, 255, 255, .12);--border-active: rgba(255, 255, 255, .2);--border-structure: rgba(255, 255, 255, .12);--text-primary: rgba(255, 255, 255, .8);--text-dim: rgba(255, 255, 255, .65);--band-low: rgba(0, 212, 255, .6);--band-mid: rgba(255, 0, 255, .6);--band-high: rgba(255, 255, 0, .6);--band-onset: rgba(255, 128, 0, .6)}}:root{--grid-unit: 8px;--spacing-half: calc(var(--grid-unit) * .5);--spacing-1: calc(var(--grid-unit) * 1);--spacing-2: calc(var(--grid-unit) * 2);--spacing-3: calc(var(--grid-unit) * 3);--spacing-4: calc(var(--grid-unit) * 4);--spacing-5: calc(var(--grid-unit) * 5);--spacing-6: calc(var(--grid-unit) * 6);--font-display: -apple-system, BlinkMacSystemFont, "Segoe UI", "Helvetica Neue", sans-serif;--font-sans: -apple-system, BlinkMacSystemFont, "Segoe UI", "Helvetica Neue", sans-serif;--font-mono: "SF Mono", "Monaco", "Menlo", "Consolas", "Liberation Mono", monospace;--text-xs: 11px;--text-sm: 12px;--text-base: 14px;--text-md: 14px;--text-lg: 16px;--text-xl: 20px;--text-2xl: 24px;--text-3xl: 32px;--text-4xl: 40px;--text-5xl: 48px;--line-height-tight: 1.15;--line-height-normal: 1.55;--line-height-relaxed: 1.8;--radius-sm: 4px;--radius-md: 8px;--radius-lg: 12px;--radius-full: 99999px;--transition-fast: .15s ease;--transition-normal: .2s ease;--z-canvas: 1;--z-controls: 100;--z-tooltip: 200;--z-modal: 500;--z-frame: 1000}@media(max-width:1024px){:root{--spacing-half: calc(var(--grid-unit) * .44);--spacing-1: calc(var(--grid-unit) * .88);--spacing-2: calc(var(--grid-unit) * 1.76);--spacing-3: calc(var(--grid-unit) * 2.64);--spacing-4: calc(var(--grid-unit) * 3.52);--spacing-5: calc(var(--grid-unit) * 4.4);--spacing-6: calc(var(--grid-unit) * 5.28);--text-xs: 10.2px;--text-sm: 11.2px;--text-base: 13px;--text-md: 13px;--text-lg: 14.9px;--text-xl: 18.6px;--text-2xl: 22.3px;--text-3xl: 29.8px;--text-4xl: 37.2px;--text-5xl: 44.6px;--line-height-tight: 1.17;--line-height-normal: 1.57;--line-height-relaxed: 1.78}}@media(max-width:768px){:root{--spacing-half: calc(var(--grid-unit) * .39);--spacing-1: calc(var(--grid-unit) * .78);--spacing-2: calc(var(--grid-unit) * 1.56);--spacing-3: calc(var(--grid-unit) * 2.34);--spacing-4: calc(var(--grid-unit) * 3.12);--spacing-5: calc(var(--grid-unit) * 3.9);--spacing-6: calc(var(--grid-unit) * 4.68);--text-xs: 9.7px;--text-sm: 10.6px;--text-base: 12.3px;--text-md: 12.3px;--text-lg: 14.1px;--text-xl: 17.6px;--text-2xl: 21.1px;--text-3xl: 28.2px;--text-4xl: 35.2px;--text-5xl: 42.2px;--line-height-tight: 1.2;--line-height-normal: 1.65;--line-height-relaxed: 1.9}.icon-btn{min-width:40px;min-height:40px;padding:8px}.icon-btn svg{width:18px;height:18px}}@media(max-width:375px){:root{--spacing-half: calc(var(--grid-unit) * .34);--spacing-1: calc(var(--grid-unit) * .68);--spacing-2: calc(var(--grid-unit) * 1.36);--spacing-3: calc(var(--grid-unit) * 2.04);--spacing-4: calc(var(--grid-unit) * 2.72);--spacing-5: calc(var(--grid-unit) * 3.4);--spacing-6: calc(var(--grid-unit) * 4.08);--text-xs: 9.35px;--text-sm: 10.2px;--text-base: 11.9px;--text-md: 11.9px;--text-lg: 13.6px;--text-xl: 17px;--text-2xl: 20.4px;--text-3xl: 27.2px;--text-4xl: 34px;--text-5xl: 40.8px;--line-height-tight: 1.22;--line-height-normal: 1.62;--line-height-relaxed: 1.88}.ui-panel{padding:var(--spacing-1)}.control-panel{width:100%;max-width:480px}}html,body{width:100%;height:100%;overflow:hidden;background:var(--bg);color:var(--fg);font-family:var(--font-sans);font-size:var(--text-base)}#app{position:fixed;inset:0;z-index:0}.wav-bootstrap-fallback{position:absolute;inset:0;display:grid;align-content:center;justify-items:center;gap:.75rem;padding:1.5rem;text-align:center;color:var(--fg);background:radial-gradient(circle at top,rgba(255,92,92,.2),transparent 45%),linear-gradient(180deg,#101010f2,#060606fa)}.wav-bootstrap-fallback h1{margin:0;font-size:var(--text-xl)}.wav-bootstrap-fallback p{margin:0;max-width:40rem;color:#ffffffd6}.wav-bootstrap-fallback-hint{font-size:var(--text-sm);color:#ffffffb8}canvas{display:block}.ui-overlay{position:fixed;inset:0;z-index:10;pointer-events:none}.ui-overlay>*{pointer-events:auto}:focus-visible{outline:3px solid var(--color-accent, #4ae0e0);outline-offset:2px;box-shadow:0 0 0 2px var(--bg, #000),0 0 12px #4ae0e066;border-radius:2px}button:focus-visible,[role=button]:focus-visible,input:focus-visible,[role=tab]:focus-visible{outline:3px solid var(--color-accent, #4ae0e0);outline-offset:2px}input[type=range]:focus-visible{outline:none;box-shadow:0 0 0 3px var(--bg, #000),0 0 16px #4ae0e080}select:focus-visible,textarea:focus-visible{outline:3px solid var(--color-accent, #4ae0e0);outline-offset:2px}html{scroll-behavior:smooth;-webkit-font-smoothing:antialiased;-webkit-text-size-adjust:100%;-webkit-tap-highlight-color:transparent;-webkit-touch-callout:none}@supports ((-webkit-backdrop-filter: blur(10px)) or (backdrop-filter: blur(10px))){.ui-panel,.control-panel{-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}}*{scrollbar-width:thin;scrollbar-color:rgba(74,224,224,.3) transparent}@media(prefers-contrast:more){:root{--border-structure: rgba(255, 255, 255, .25);--color-text-dim: rgba(255, 255, 255, .75)}:focus-visible{outline-width:4px}}@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important;scroll-behavior:auto!important}}@media(forced-colors:active){:focus-visible{outline:3px solid LinkText;outline-offset:2px}button,[role=button],input{border-color:CanvasText}a{color:LinkText}}@media(prefers-color-scheme:light){a{color:#06c}a:visited{color:#7030a0}code,pre{background-color:#f0f0f0;color:#1e1e1e}}.icon-btn,.ui-panel,.control-panel{will-change:transform,opacity;transform:translateZ(0);-webkit-transform:translate3d(0,0,0);backface-visibility:hidden;-webkit-backface-visibility:hidden}canvas{image-rendering:auto;-ms-interpolation-mode:nearest-neighbor;image-rendering:crisp-edges}@supports (font-feature-settings: "ss01"){body{font-feature-settings:"ss01"}}body{text-rendering:optimizeLegibility;-webkit-font-variant-ligatures:common-ligatures;font-variant-ligatures:common-ligatures}button,[role=button]{text-rendering:optimizeSpeed;letter-spacing:.2px;-webkit-text-size-adjust:none}h1,h2,h3,h4,h5,h6{font-weight:600;letter-spacing:-.3px;line-height:1.2}code{font-family:var(--font-mono);font-size:.95em;letter-spacing:.1px}pre{overflow:auto;-webkit-overflow-scrolling:touch}.ui-panel{background:var(--surface);border:1px solid var(--border-structure);border-radius:var(--radius-md);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);padding:var(--spacing-2)}[title],.has-tooltip{position:relative}.has-tooltip:after{content:attr(data-tooltip);position:absolute;bottom:100%;left:50%;transform:translate(-50%) translateY(-8px);padding:8px 12px;background:var(--bg);color:var(--fg);font-size:12px;font-family:var(--font-sans);font-weight:500;white-space:nowrap;border:1px solid var(--border-subtle);border-radius:var(--radius-sm);box-shadow:0 4px 12px #00000080,0 0 12px var(--accent-glow);z-index:var(--z-tooltip);opacity:0;pointer-events:none;transition:opacity .2s ease,transform .2s ease}.has-tooltip:hover:after,.has-tooltip:focus:after,.has-tooltip:focus-visible:after{opacity:1;transform:translate(-50%) translateY(-4px)}.icon-btn{display:inline-flex;align-items:center;justify-content:center;min-width:44px;min-height:44px;padding:10px;background:var(--border-subtle);border:1px solid var(--border-default);border-radius:var(--radius-md);cursor:pointer;transition:all var(--transition-fast);position:relative;overflow:hidden;font-weight:500}.icon-btn:before{content:"";position:absolute;inset:0;background:linear-gradient(135deg,var(--accent-glow) 0%,transparent 100%);opacity:0;transition:opacity var(--transition-fast);pointer-events:none}.icon-btn:hover{background:linear-gradient(135deg,var(--accent-glow) 0%,var(--border-subtle) 100%);border-color:var(--accent-dim);box-shadow:0 4px 12px var(--accent-glow)}.icon-btn:hover:before{opacity:1}.icon-btn:active{transform:scale(.96);box-shadow:0 2px 8px var(--accent-glow) inset}.icon-btn:focus-visible{outline:3px solid var(--accent);outline-offset:2px;box-shadow:0 0 0 2px var(--bg),0 0 12px var(--accent-glow),0 4px 12px var(--accent-glow)}.icon-btn svg{width:20px;height:20px;position:relative;z-index:1}.control-panel{position:fixed;right:0;top:0;bottom:0;width:480px;z-index:100;animation:fade-in-up var(--duration-slow, .4s) var(--ease-out-expo, cubic-bezier(.19, 1, .22, 1));display:flex;flex-direction:column;overflow-x:hidden;overflow-y:hidden;background:var(--bg);backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);box-shadow:var(--shadow-lg, 0 8px 16px rgba(0, 0, 0, .5)),var(--inner-shadow-subtle, inset 0 1px 0 rgba(255, 255, 255, .05));border-left:1px solid var(--border-subtle)}.control-panel::-webkit-scrollbar{width:8px}.control-panel::-webkit-scrollbar-track{background:transparent}.control-panel::-webkit-scrollbar-thumb{background:var(--border-active);border-radius:4px}.control-panel::-webkit-scrollbar-thumb:hover{background:var(--text-dim)}.control-panel-resize-handle{position:absolute;left:0;top:0;bottom:0;width:6px;cursor:ew-resize;z-index:1;background:transparent;border-left:1px solid transparent;transition:background-color .12s ease,border-color .12s ease;user-select:none;-webkit-user-select:none;touch-action:none}.control-panel-resize-handle:hover,.control-panel-resize-handle.is-dragging{background:#ffffff14;border-left-color:var(--border-active, rgba(255, 255, 255, .18))}.control-panel-resize-handle:focus-visible{outline:2px solid var(--focus-ring, #4c9aff);outline-offset:-2px}@media(prefers-reduced-motion:reduce){.control-panel-resize-handle{transition:none}}@media(max-width:767px){.control-panel-resize-handle{display:none}}@keyframes panel-slide-in{0%{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}@media(prefers-reduced-motion:reduce){.control-panel{animation:none}}@media(max-width:768px){.control-panel{width:280px}.section-header{padding:var(--spacing-1) var(--spacing-2)}}@media(max-width:480px){.control-panel{width:100%;max-width:100vw;transform:translate(100%);transition:transform .3s ease}.control-panel.mobile-visible{transform:translate(0)}.mobile-panel-toggle{display:flex;position:fixed;right:16px;bottom:16px;width:48px;height:48px;padding:0;background:#000000d9;border:1px solid rgba(255,255,255,.15);color:var(--color-accent, #4ae0e0);font-size:20px;z-index:101;cursor:pointer;align-items:center;justify-content:center;transition:all var(--transition-fast, .15s ease)}.mobile-panel-toggle:hover{background:#4ae0e01a;border-color:var(--color-accent, #4ae0e0)}.mobile-panel-toggle:focus-visible{outline:2px solid var(--color-accent, #4ae0e0);outline-offset:2px}.mobile-panel-close{display:flex;width:100%;padding:var(--spacing-2);background:transparent;border:none;border-bottom:1px solid rgba(255,255,255,.1);color:var(--fg, rgba(255, 255, 255, .92));font-family:var(--font-mono);font-size:var(--text-sm, 12px);text-transform:uppercase;letter-spacing:.05em;cursor:pointer;align-items:center;justify-content:space-between}.mobile-panel-close:hover{background:#ffffff0d}.grid-toggle-wrapper{display:none!important}.session-panel{max-width:calc(100vw - 32px)}}@media(min-width:481px){.mobile-panel-toggle{display:none}.mobile-panel-toggle.panel-hidden{display:flex;position:fixed;right:16px;bottom:16px;width:48px;height:48px;padding:0;background:#000000d9;border:1px solid rgba(255,255,255,.15);color:var(--color-accent, #4ae0e0);font-size:20px;z-index:101;cursor:pointer;align-items:center;justify-content:center;transition:all var(--transition-fast, .15s ease);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px)}.mobile-panel-toggle.panel-hidden:hover{background:#4ae0e01a;border-color:var(--color-accent, #4ae0e0);transform:scale(1.05)}.mobile-panel-toggle.panel-hidden:focus-visible{outline:2px solid var(--color-accent, #4ae0e0);outline-offset:2px}.mobile-panel-close{display:none}}@media(min-width:1920px){.control-panel{width:420px}.session-panel{max-width:420px;padding:var(--space-4, 32px)}.layer-item{padding:12px 16px}}@media(min-width:2560px){.control-panel{width:480px}.session-panel{max-width:480px}}.toggle-button{display:flex;align-items:center;justify-content:center;gap:var(--spacing-1);padding:var(--spacing-1) var(--spacing-2);background:#000000b3;color:#fff;border:none;border-bottom:1px solid rgba(255,255,255,.1);border-radius:0;cursor:pointer;font-size:var(--text-md);font-weight:500;backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);width:100%;margin-bottom:var(--spacing-1);transition:background var(--transition-fast),border-color var(--transition-fast)}.toggle-button:hover{background:#000c;border-bottom-color:#fff3}.toggle-button .icon{flex-shrink:0}.controls-content{flex:1;min-height:0;background:#ffffff0a;border:none;border-radius:0;padding:var(--spacing-2);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);display:flex;flex-direction:column;gap:var(--spacing-2);overflow-y:auto;overflow-x:hidden;width:100%;box-sizing:border-box}.section{margin-bottom:0;padding:var(--spacing-2);background:var(--bg);border-bottom:1px solid var(--border-subtle);border-radius:0}.section:first-child{border-top:1px solid var(--border-subtle)}.section:last-child{margin-bottom:0}#layers{flex:1;display:flex;flex-direction:column;min-height:300px}.section h3{font-size:14px;font-weight:700;margin-bottom:var(--spacing-1);color:var(--fg);text-transform:uppercase;letter-spacing:.12em;text-shadow:0 2px 8px var(--accent-glow)}.section h4{font-size:13px;font-weight:600;margin-bottom:var(--spacing-1);color:var(--text-primary);letter-spacing:.05em}.subsection{margin-top:var( --spacing-2 );margin-bottom:var(--spacing-1);padding:var(--spacing-1);padding-left:var(--spacing-2);border-left:2px solid var(--border-subtle);background:var(--glass)}.subsection:first-child{margin-top:0}.subsection h4{margin-bottom:var(--spacing-1);padding-bottom:4px;border-bottom:1px solid var(--border-subtle)}.section label{display:flex;align-items:center;justify-content:space-between;gap:var(--spacing-2);margin-bottom:var(--spacing-1);padding:4px 0;font-size:var(--text-base)}.section label span{color:var(--text-primary);min-width:100px;flex-shrink:0;font-family:var(--font-sans);font-size:12px;font-weight:500;letter-spacing:.03em}.section label:has(input[type=range]){padding:6px 0;border-bottom:1px solid var(--border-subtle)}.section label:has(input[type=range]):last-child{border-bottom:none}.section input[type=range]{flex:1;min-width:120px;-webkit-appearance:none;appearance:none;background:transparent;height:24px}.section input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;width:16px;height:16px;background:var(--accent);border:none;border-radius:50%;cursor:pointer;margin-top:-6px;transition:all var(--transition-fast)}.section input[type=range]::-webkit-slider-thumb:hover{transform:scale(1.2);box-shadow:0 0 8px var(--accent-glow)}.section input[type=range]::-moz-range-thumb{width:16px;height:16px;background:var(--accent);border:none;border-radius:50%;cursor:pointer}.section input[type=range]::-webkit-slider-runnable-track{height:4px;background:var(--border-active);border-radius:2px}.section input[type=range]::-moz-range-track{height:4px;background:var(--border-active);border-radius:2px}.section output{min-width:48px;padding:4px 8px;text-align:right;font-variant-numeric:tabular-nums;font-family:var(--font-mono);color:var(--text-primary);font-size:11px;font-weight:500;background:var(--bg);border:1px solid var(--border-subtle);border-radius:2px}.section select{flex:1;min-width:140px;padding:8px 32px 8px 12px;background:var(--bg);color:var(--fg);border:1px solid var(--border-default);border-radius:0;font-size:var(--text-base);font-family:var(--font-mono);cursor:pointer;appearance:none;-webkit-appearance:none;-moz-appearance:none;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='rgba(255,255,255,0.6)' stroke-width='2'%3E%3Cpolyline points='6,9 12,15 18,9'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 10px center;background-size:12px;transition:all var(--transition-fast)}.section select:hover{border-color:var(--accent-dim);background-color:var(--bg)}.section select:focus{border-color:var(--accent);background-color:var(--bg);box-shadow:0 0 0 2px var(--accent-glow)}.section select:focus:not(:focus-visible){outline:none}.section select:focus-visible{outline:2px solid var(--accent);outline-offset:2px}.section select option{background:var(--bg);color:var(--fg);padding:8px 12px}.section input[type=text]{flex:1;min-width:100px;padding:6px var(--spacing-1);background:var(--bg);color:var(--fg);border:1px solid var(--border-default);border-radius:var(--radius-sm);font-size:var(--text-base);font-family:var(--font-sans)}.section input[type=text]::placeholder{color:var(--text-dim)}.section input[type=text]:focus{border-color:var(--accent);background:var(--bg)}.section .hint{margin-top:var(--spacing-1)}.section .hint small{font-size:var(--text-xs);color:#ffffffa6}.button-group{display:grid;grid-template-columns:repeat(auto-fit,minmax(70px,1fr));gap:1px;margin-top:var(--spacing-1);background:var(--border-subtle);border-radius:0}.button-group button{padding:10px 8px;background:var(--bg);color:var(--text-primary);border:none;border-radius:0;cursor:pointer;font-size:var(--text-sm);font-family:var(--font-mono);font-weight:500;text-transform:uppercase;letter-spacing:.03em;transition:background var(--transition-micro, .1s cubic-bezier(.19, 1, .22, 1)),color var(--transition-micro, .1s cubic-bezier(.19, 1, .22, 1)),transform var(--duration-instant, 50ms) ease-out,box-shadow var(--transition-micro, .1s cubic-bezier(.19, 1, .22, 1));position:relative;overflow:hidden}.button-group button:before{content:"";position:absolute;top:0;left:-100%;width:50%;height:100%;background:linear-gradient(90deg,transparent 0%,var(--border-subtle) 50%,transparent 100%);transform:skew(-25deg);transition:left .4s ease-out;pointer-events:none}.button-group button:hover:before{left:150%}.button-group button:hover{background:var(--border-active);color:var(--fg);box-shadow:var(--shadow-sm, 0 2px 4px rgba(0, 0, 0, .5))}.button-group button:active{background:var(--accent-glow);transform:translateY(1px) scale(.99)}.button-group button:focus-visible{outline:2px solid var(--accent);outline-offset:-2px}.button-group button.active,.button-group button[aria-pressed=true]{background:var(--accent-dim);color:var(--accent);border-bottom:2px solid var(--accent)}.file-input-wrapper{position:fixed;left:var(--spacing-2);bottom:var(--spacing-2);z-index:100}.file-button{display:flex;align-items:center;justify-content:center;gap:var(--spacing-1);min-width:44px;min-height:44px;padding:var(--spacing-1) var(--spacing-2);background:var(--bg);color:var(--text-dim);border:1px solid var(--border-default);border-radius:0;cursor:pointer;font-family:var(--font-mono, "SF Mono", Monaco, Menlo, monospace);font-size:var(--text-xs);text-transform:uppercase;letter-spacing:.05em;backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);transition:all var(--transition-fast)}.file-button:hover{background:var(--bg);color:var(--fg);border-color:var(--accent)}.file-button:focus-visible{outline:2px solid var(--accent);outline-offset:2px}.drop-zone{display:none;padding:var(--spacing-2);margin-top:var(--spacing-1);max-width:240px;background:var(--bg);border:1px dashed var(--border-default);text-align:center;cursor:pointer;transition:all var(--transition-normal);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px)}.file-input-wrapper:hover .drop-zone,.file-input-wrapper:focus-within .drop-zone{display:block}.drop-zone:hover{background:var(--bg);border-color:var(--accent)}.drop-zone.drag-over{background:var(--accent-glow);border-color:var(--accent)}.drop-zone:focus-visible{outline:2px solid var(--accent);outline-offset:-2px;border-color:var(--accent)}.drop-zone p{margin:0;color:var(--text-dim);font-family:var(--font-mono, "SF Mono", Monaco, Menlo, monospace);font-size:var(--text-xs)}.drop-zone .file-hint{margin-top:var(--spacing-1);font-size:var(--text-xs);color:var(--text-dim);text-transform:uppercase;letter-spacing:.05em}.current-file{padding:var(--spacing-1) var(--spacing-2);background:var(--bg);color:var(--text-primary);border:1px solid var(--border-default);border-radius:var(--radius-md);font-size:var(--text-base);margin-top:var(--spacing-1);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px)}.control-panel::-webkit-scrollbar{width:var(--spacing-1)}.control-panel::-webkit-scrollbar-track{background:#0003;border-radius:var(--radius-sm)}.control-panel::-webkit-scrollbar-thumb{background:#fff3;border-radius:var(--radius-sm)}.control-panel::-webkit-scrollbar-thumb:hover{background:#ffffff4d}.help-overlay{position:fixed;inset:0;background:var(--bg);display:flex;align-items:center;justify-content:center;z-index:1000;backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px)}.help-content{background:var(--bg);border:1px solid var(--border-default);padding:var(--spacing-4);max-width:800px;max-height:90vh;overflow-y:auto}.help-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:var(--spacing-3);padding-bottom:var(--spacing-2);border-bottom:1px solid var(--border-subtle)}.help-header h2{font-size:var(--text-xl);font-weight:600;color:var(--fg);margin:0}.help-close{background:transparent;border:none;color:var(--text-dim);font-size:32px;line-height:1;cursor:pointer;padding:0;min-width:44px;min-height:44px;display:flex;align-items:center;justify-content:center;border-radius:var(--radius-sm);transition:all var(--transition-normal)}.help-close:hover{background:var(--border-subtle);color:var(--fg)}.help-section{margin-bottom:var(--spacing-3)}.help-section:last-child{margin-bottom:0}.help-section h3{font-size:var(--text-lg);font-weight:600;margin-bottom:var(--spacing-1);color:var(--fg)}.help-section p{margin-bottom:var(--spacing-1);color:var(--text-primary);line-height:1.6}.help-section ul{margin-left:20px;color:var(--text-primary);line-height:1.8}.help-section li{margin-bottom:6px}.help-section strong{color:var(--fg);font-weight:600}.shortcuts-grid{display:grid;grid-template-columns:1fr;gap:var(--spacing-1);margin-top:var(--spacing-1)}.shortcut-item{display:flex;align-items:center;gap:var(--spacing-2);padding:var(--spacing-1);background:transparent;border-bottom:1px solid var(--border-subtle)}.shortcut-keys{display:flex;gap:var(--spacing-1);align-items:center;min-width:140px}.shortcut-desc{flex:1;color:var(--text-primary);font-size:var(--text-md)}kbd{background:var(--border-subtle);border:1px solid var(--border-default);padding:4px var(--spacing-1);font-family:var(--font-mono);font-size:var(--text-sm);font-weight:500;color:var(--fg)}.help-footer{margin-top:var(--spacing-3);padding-top:var(--spacing-2);border-top:1px solid var(--border-subtle);text-align:left}.help-footer p{margin:0;color:var(--text-dim);font-size:var(--text-base)}.help-content::-webkit-scrollbar{width:var(--spacing-1)}.help-content::-webkit-scrollbar-track{background:transparent}.help-content::-webkit-scrollbar-thumb{background:var(--border-active);border-radius:var(--radius-sm)}.help-content::-webkit-scrollbar-thumb:hover{background:var(--text-dim)}.top-left-panel{position:fixed;left:var(--spacing-2);top:var(--spacing-2);display:flex;flex-direction:column;gap:var(--spacing-1);z-index:100}.top-left-panel .panel-row{display:flex;gap:var(--spacing-1);align-items:center}.top-left-panel button{display:flex;align-items:center;justify-content:center;gap:var(--spacing-1);padding:var(--spacing-1) var(--spacing-2);background:var(--bg);color:var(--fg);border:1px solid var(--border-default);border-radius:var(--radius-md);cursor:pointer;font-size:var(--text-base);font-weight:500;backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);transition:background var(--transition-fast),border-color var(--transition-fast)}.top-left-panel button:hover{background:var(--bg);border-color:var(--accent)}.top-left-panel button.active,.top-left-panel button.recording{background:var(--accent-dim);border-color:var(--accent)}.top-left-panel .icon-btn{padding:var(--spacing-1);min-width:44px;min-height:44px}.audio-level-meter{display:flex;align-items:center;gap:var(--spacing-1);padding:var(--spacing-1) var(--spacing-2);background:var(--bg);border:1px solid var(--border-default);border-radius:var(--radius-md);font-size:var(--text-sm);font-family:var(--font-mono);color:var(--text-primary);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);min-width:180px}.renderer-display{display:flex;align-items:center;gap:var(--spacing-1);padding:var(--spacing-1) var(--spacing-2);background:var(--bg);border:1px solid var(--border-default);border-radius:var(--radius-md);font-size:var(--text-xs);color:var(--text-dim);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px)}.top-right-meta{position:fixed;right:var(--spacing-2);top:var(--spacing-2);display:flex;gap:var(--spacing-1);z-index:99}.gap-1{gap:var(--spacing-1)}.gap-2{gap:var(--spacing-2)}.gap-3{gap:var(--spacing-3)}.gap-4{gap:var(--spacing-4)}.p-1{padding:var(--spacing-1)}.p-2{padding:var(--spacing-2)}.p-3{padding:var(--spacing-3)}.p-4{padding:var(--spacing-4)}.m-1{margin:var(--spacing-1)}.m-2{margin:var(--spacing-2)}.m-3{margin:var(--spacing-3)}.m-4{margin:var(--spacing-4)}.text-xs{font-size:var(--text-xs)}.text-sm{font-size:var(--text-sm)}.text-base{font-size:var(--text-base)}.text-md{font-size:var(--text-md)}.text-lg{font-size:var(--text-lg)}.font-mono{font-family:var(--font-mono)}.icon{display:inline-flex;vertical-align:middle;flex-shrink:0}.device-selector-overlay{position:fixed;inset:0;background:var(--bg);display:flex;align-items:center;justify-content:center;z-index:1000;backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px)}.device-selector-modal{background:var(--bg);border:1px solid var(--border-default);padding:var(--spacing-3);max-width:400px;width:90%}.device-selector-modal h3{display:flex;align-items:center;gap:var(--spacing-1);font-size:var(--text-lg);font-weight:600;margin-bottom:var(--spacing-2);padding-bottom:var(--spacing-2);border-bottom:1px solid var(--border-subtle)}.device-selector-modal select{width:100%;padding:var(--spacing-1);background:var(--bg);color:var(--fg);border:1px solid var(--border-default);border-radius:var(--radius-md);font-size:var(--text-base);margin-bottom:var(--spacing-2)}.device-selector-modal .button-group{display:flex;gap:var(--spacing-1)}.device-selector-modal button{flex:1;padding:var(--spacing-1) var(--spacing-2);border-radius:var(--radius-md);font-size:var(--text-base);font-weight:500;cursor:pointer;transition:background var(--transition-fast)}.device-selector-modal button.primary{background:var(--accent-dim);color:var(--fg);border:1px solid var(--accent)}.device-selector-modal button.primary:hover{background:var(--accent);color:var(--bg)}.device-selector-modal button.secondary{background:transparent;color:var(--text-dim);border:1px solid var(--border-default)}.device-selector-modal button.secondary:hover{background:var(--border-subtle);color:var(--fg)}.video-controls{display:flex;gap:var(--spacing-1);margin-top:var(--spacing-1)}.video-controls button{display:flex;align-items:center;justify-content:center;padding:var(--spacing-1);background:#ffffff1a;border:1px solid rgba(255,255,255,.2);border-radius:var(--radius-sm);color:#fff;cursor:pointer;transition:background var(--transition-fast)}.video-controls button:hover{background:#fff3}.video-controls button.active{background:#64c8ff33;border-color:#64c8ff66}.texture-controls{display:flex;gap:var(--spacing-1);margin-top:var(--spacing-1)}.texture-controls button{display:flex;align-items:center;justify-content:center;gap:var(--spacing-1);padding:var(--spacing-1);background:#ffffff1a;border:1px solid rgba(255,255,255,.2);border-radius:var(--radius-sm);color:#fff;cursor:pointer;font-size:var(--text-sm);transition:background var(--transition-fast)}.texture-controls button:hover{background:#fff3}.checkbox-label{cursor:pointer;max-width:100%;overflow:hidden}.checkbox-label input[type=checkbox]{width:18px;height:18px;flex-shrink:0;cursor:pointer}.timeline{display:flex;align-items:center;gap:var(--spacing-1);padding:var(--spacing-1) var(--spacing-2);background:var(--glass);backdrop-filter:blur(8px);border:1px solid var(--border-structure);border-radius:var(--radius-md)}.timeline .time{font-family:var(--font-mono);font-size:var(--text-xs);color:#fff9;min-width:40px}.timeline .current-time{text-align:right}.timeline .duration{text-align:left}.timeline .progress-container{position:relative;flex:1;height:2px;background:#ffffff1a;overflow:visible}.timeline .progress-bar{position:absolute;top:0;left:0;height:100%;width:0%;background:#fff9;transition:width .1s linear;pointer-events:none}.timeline .scrubber{position:absolute;top:50%;left:0;width:100%;height:20px;transform:translateY(-50%);margin:0;padding:0;background:transparent;-webkit-appearance:none;appearance:none;cursor:pointer}.timeline .scrubber::-webkit-slider-thumb{-webkit-appearance:none;width:12px;height:12px;background:#fff;border-radius:50%;cursor:pointer;box-shadow:0 0 4px #0000004d;transition:transform var(--transition-fast)}.timeline .scrubber::-webkit-slider-thumb:hover{transform:scale(1.2)}.timeline .scrubber::-moz-range-thumb{width:12px;height:12px;background:#fff;border:none;border-radius:50%;cursor:pointer;box-shadow:0 0 4px #0000004d}.timeline .scrubber::-webkit-slider-runnable-track{background:transparent}.timeline .scrubber::-moz-range-track{background:transparent}.transport-controls{display:flex;align-items:center;gap:var(--spacing-1)}.transport-controls button{display:flex;align-items:center;justify-content:center;min-width:44px;min-height:44px;padding:var(--spacing-1);background:transparent;border:1px solid transparent;border-radius:var(--radius-sm);color:var(--fg);cursor:pointer;transition:all var(--transition-fast)}.transport-controls button:hover{background:#ffffff1a;border-color:var(--border)}.transport-controls button.active{background:#ffffff26;border-color:var(--border-active)}.transport-controls button svg{width:16px;height:16px}.transport-controls .play-pause{min-width:44px;min-height:44px}.transport-controls .play-pause svg{width:20px;height:20px}.transport-controls .play-pause,.transport-controls .record-btn{background:var(--color-accent-glow);border-color:#4ae0e04d}.transport-controls .play-pause:hover,.transport-controls .record-btn:hover{background:#4ae0e040;border-color:var(--color-accent)}.transport-controls .play-pause.active,.transport-controls .record-btn.active{background:var(--color-accent);color:#000;border-color:var(--color-accent)}.transport-controls .record-btn.recording{background:#ef4444cc;border-color:#ef4444;color:#fff;animation:pulse-recording 1.5s ease-in-out infinite}@keyframes pulse-recording{0%,to{opacity:1}50%{opacity:.7}}@media(prefers-reduced-motion:reduce){.transport-controls .record-btn.recording{animation:none}}.playlist-panel{position:fixed;right:-320px;top:50%;transform:translateY(-50%);width:300px;max-height:70vh;background:#0a0a0ae6;backdrop-filter:blur(10px);border:1px solid var(--border-structure);border-right:none;display:flex;flex-direction:column;overflow:hidden;transition:right var(--transition-normal);z-index:50}.playlist-panel.open{right:0}.playlist-header{display:flex;align-items:center;justify-content:space-between;padding:var(--spacing-2);border-bottom:1px solid var(--border-subtle)}.playlist-header h3{display:flex;align-items:center;gap:var(--spacing-1);margin:0;font-size:var(--text-sm);font-weight:600;text-transform:uppercase;letter-spacing:.05em;color:var(--fg)}.playlist-header .close-btn{display:flex;align-items:center;justify-content:center;min-width:44px;min-height:44px;padding:10px;background:transparent;border:none;color:var(--fg);cursor:pointer;opacity:.7;transition:opacity var(--transition-fast)}.playlist-header .close-btn:hover{opacity:1}.dropzone{padding:var(--spacing-2);margin:var(--spacing-2);border:1px solid var(--border);cursor:pointer;transition:all var(--transition-fast)}.dropzone:hover,.dropzone.dragover{border-color:var(--border-active);background:#ffffff0d}.dropzone-content{display:flex;flex-direction:column;align-items:flex-start;gap:var(--spacing-1);color:#fff9;font-size:var(--text-xs);text-align:left}.track-list{flex:1;overflow-y:auto;margin:0;padding:0;list-style:none}.track-item{display:flex;align-items:center;gap:var(--spacing-1);padding:var(--spacing-1) var(--spacing-2);border-bottom:1px solid var(--border-subtle);cursor:pointer;transition:background var(--transition-fast)}.track-item:hover{background:#ffffff0d}.track-item.current{background:#ffffff1a;border-left:2px solid white}.track-item.empty{justify-content:center;cursor:default}.track-item .handle{display:flex;align-items:center;opacity:.4;cursor:grab}.track-item .handle:hover{opacity:.8}.track-item .type-icon{display:flex;align-items:center;opacity:.6}.track-item .name{flex:1;font-size:var(--text-xs);color:var(--fg);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.track-item .duration{font-family:var(--font-mono);font-size:var(--text-xs);color:#ffffffa6}.track-item .remove-btn{display:flex;align-items:center;justify-content:center;width:20px;height:20px;padding:0;background:transparent;border:none;color:var(--fg);cursor:pointer;opacity:0;transition:opacity var(--transition-fast)}.track-item:hover .remove-btn{opacity:.5}.track-item .remove-btn:hover{opacity:1;color:#ff6b6b}.track-item .empty-text{font-size:var(--text-xs);color:#fff9;font-style:italic}.about-overlay{position:fixed;inset:0;background:#000000d9;display:flex;align-items:center;justify-content:center;z-index:1000;backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px)}.about-content{position:relative;background:#0a0a0af2;border:1px solid rgba(255,255,255,.12);padding:var(--spacing-4);max-width:400px;width:90%;text-align:left}.about-close{position:absolute;top:var(--spacing-2);right:var(--spacing-2);background:transparent;border:none;color:#fff9;cursor:pointer;padding:var(--spacing-1);display:flex;align-items:center;justify-content:center;border-radius:var(--radius-sm);transition:all var(--transition-normal)}.about-close:hover{background:#ffffff1a;color:#ffffffe6}.about-logo{margin-bottom:var(--spacing-2);color:#ffffffe6}.about-content h2{font-size:var(--text-xl);font-weight:700;color:#fffffff2;margin:0 0 var(--spacing-1) 0;letter-spacing:-.02em}.about-content .version{font-family:var(--font-mono);font-size:var(--text-sm);color:#ffffff80;margin:0 0 var(--spacing-2) 0}.about-content .description{font-size:var(--text-sm);color:#ffffffb3;line-height:1.6;margin:0 0 var(--spacing-3) 0}.about-features{display:grid;grid-template-columns:1fr 1fr;gap:var(--spacing-2);margin-bottom:var(--spacing-3);padding:var(--spacing-2);background:#ffffff08;border:1px solid var(--border-subtle)}.about-features .feature-item{display:flex;align-items:center;gap:var(--spacing-1);font-size:var(--text-xs);color:#ffffffb3;text-align:left}.about-features .feature-item svg{color:#ffffff80;flex-shrink:0}.about-links{display:flex;gap:var(--spacing-2);justify-content:flex-start;margin-bottom:var(--spacing-3)}.about-links a{font-size:var(--text-sm);color:#fff9;text-decoration:none;transition:color var(--transition-fast)}.about-links a:hover{color:#fffffff2}.about-footer{border-top:1px solid var(--border-subtle);padding-top:var(--spacing-2)}.about-footer p{font-size:var(--text-xs);color:#fff6;margin:0}.about-footer p:first-child{margin-bottom:4px}.about-footer .copyright{font-size:10px;color:#ffffff4d}.layers-section{position:relative;flex:1;display:flex;flex-direction:column;min-height:300px}.layer-toolbar{display:flex;gap:4px;margin-bottom:var(--spacing-1);padding:4px;background:#0000004d;border:1px solid rgba(255,255,255,.08)}.layer-toolbar .toolbar-btn{min-width:36px;height:36px;padding:0;background:#ffffff0d;border:1px solid rgba(255,255,255,.1);color:#ffffffb3;cursor:pointer;font-size:14px;font-weight:500;display:flex;align-items:center;justify-content:center;transition:all .1s ease}.layer-toolbar .toolbar-btn:hover{background:#ffffff1f;border-color:#fff3;color:#fff}.layer-toolbar .toolbar-btn:active{background:#ffffff2e;transform:scale(.95)}.layer-toolbar .toolbar-btn:focus-visible{outline:2px solid var(--color-accent, #4ae0e0);outline-offset:1px}.layer-toolbar #addLayerBtn{background:#4ae0e01a;border-color:#4ae0e04d;color:var(--color-accent, #4ae0e0);font-size:18px;font-weight:600}.layer-toolbar #addLayerBtn:hover{background:#4ae0e033;border-color:#4ae0e080;color:#4ae0e0}.layer-toolbar #addLayerBtn[aria-expanded=true]{background:#4ae0e040;border-color:var(--color-accent, #4ae0e0)}.layer-toolbar .toolbar-spacer{flex:1;min-width:8px}.layer-toolbar .midi-btn{font-size:10px;font-weight:600;letter-spacing:.05em;padding:0 12px;min-width:auto;background:#000000a6;border-color:#ffffff40;color:#fffffff2}.layer-toolbar .midi-btn:hover{background:#000c;border-color:#fff6;color:#fff}.layer-list{flex:1;min-height:0;overflow-y:auto;overflow-x:hidden;border:1px solid rgba(255,255,255,.1);background:#0003;scrollbar-width:thin;scrollbar-color:rgba(255,255,255,.2) transparent}.layer-list::-webkit-scrollbar{width:6px}.layer-list::-webkit-scrollbar-thumb{background:#fff3;border-radius:3px}.zone-group{border-bottom:1px solid rgba(255,255,255,.1)}.zone-group:last-child{border-bottom:none}.zone-header{display:flex;align-items:center;gap:var(--spacing-1);padding:4px var(--spacing-1);background:#ffffff08;font-size:var(--text-xs);text-transform:uppercase;letter-spacing:.5px;opacity:.75}.zone-indicator{width:8px;height:8px;border-radius:2px}.zone-indicator.fg{background:#ff6b6b}.zone-indicator.mg{background:#4ecdc4}.zone-count{margin-left:auto;font-size:9px;opacity:.5}.zone-layers{min-height:4px}.zone-layers:empty:after{content:"Empty";display:block;padding:4px var(--spacing-1) 4px 22px;font-size:var(--text-xs);opacity:.3;font-style:italic}.layer-item{display:flex;flex-direction:column;gap:0;padding:0 0 0 22px;cursor:pointer;border-bottom:1px solid rgba(255,255,255,.02);border-left:2px solid transparent;overflow:hidden;min-width:0;transition:background var(--transition-micro, .1s cubic-bezier(.19, 1, .22, 1)),border-color var(--transition-micro, .1s cubic-bezier(.19, 1, .22, 1)),transform var(--duration-instant, 50ms) ease-out,box-shadow var(--transition-micro, .1s cubic-bezier(.19, 1, .22, 1));opacity:0;animation:layer-item-enter var(--duration-normal, .3s) var(--ease-out-expo, cubic-bezier(.19, 1, .22, 1)) forwards}.layer-item:nth-child(1){animation-delay:calc(var(--stagger-1, 50ms))}.layer-item:nth-child(2){animation-delay:calc(var(--stagger-2, .1s))}.layer-item:nth-child(3){animation-delay:calc(var(--stagger-3, .15s))}.layer-item:nth-child(4){animation-delay:calc(var(--stagger-4, .2s))}.layer-item:nth-child(5){animation-delay:calc(var(--stagger-5, .25s))}.layer-item:nth-child(6){animation-delay:calc(var(--stagger-6, .3s))}.layer-item:nth-child(7){animation-delay:calc(var(--stagger-7, .35s))}.layer-item:nth-child(8){animation-delay:calc(var(--stagger-8, .4s))}.layer-item:nth-child(9){animation-delay:calc(var(--stagger-9, .45s))}.layer-item:nth-child(10){animation-delay:calc(var(--stagger-10, .5s))}@keyframes layer-item-enter{0%{opacity:0;transform:translate(-8px)}to{opacity:1;transform:translate(0)}}.layer-item:last-child{border-bottom:none}.layer-item:hover{background:#4ae0e00d;border-left-color:var(--color-accent);transform:translate(2px);box-shadow:0 2px 8px #0000004d,0 0 12px #4ae0e01a}.layer-item:active{transform:translate(1px) scale(.99);background:#4ae0e014}.layer-item:focus-visible{outline:2px solid var(--color-accent);outline-offset:-2px;background:#4ae0e00f}.layer-item.active{background:#ffffff26;border-left:2px solid #4a9eff;padding-left:20px}.layer-visibility{opacity:.6;cursor:pointer;position:relative;transition:opacity var(--transition-micro, .1s cubic-bezier(.19, 1, .22, 1)),transform var(--duration-instant, 50ms) ease-out}.layer-visibility:hover{opacity:1;transform:scale(1.1)}.layer-visibility:active{transform:scale(.9);opacity:.8}.layer-visibility.hidden{opacity:.2}.layer-visibility.hidden:hover{opacity:.5}.layer-name{flex:1;font-size:var(--text-sm);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.layer-type{font-size:var(--text-xs);opacity:.5;text-transform:uppercase}.layer-solo{min-width:44px;min-height:44px;text-align:center;font-size:10px;border-radius:2px;background:transparent;cursor:pointer;opacity:.4;padding:14px;position:relative;overflow:hidden;transition:opacity var(--transition-micro, .1s cubic-bezier(.19, 1, .22, 1)),transform var(--duration-instant, 50ms) ease-out,background var(--transition-micro, .1s cubic-bezier(.19, 1, .22, 1)),box-shadow var(--transition-micro, .1s cubic-bezier(.19, 1, .22, 1))}.layer-solo:before{content:"";position:absolute;top:0;left:-100%;width:50%;height:100%;background:linear-gradient(90deg,transparent 0%,rgba(255,255,255,.1) 50%,transparent 100%);transform:skew(-25deg);transition:left .3s ease-out;pointer-events:none}.layer-solo:hover:before{left:150%}.layer-solo:hover{opacity:.8;background:#ffffff08}.layer-solo:active{transform:scale(.95);opacity:1}.layer-solo:focus-visible{outline:2px solid var(--color-accent);outline-offset:2px;opacity:.9}.layer-solo.locked{opacity:.8;color:#ff9500;box-shadow:0 0 8px #ff950033}.dropdown-menu{position:fixed;background:#0a0a0afa;border:1px solid rgba(255,255,255,.2);padding:8px 0;z-index:10000;min-width:200px;max-width:280px;backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);box-shadow:0 12px 40px #000000b3,0 4px 12px #00000080,inset 0 1px #ffffff0d;opacity:0;visibility:hidden;transform:translateY(-8px) scale(.95);transition:opacity .15s ease,transform .15s ease,visibility .15s;pointer-events:none}.dropdown-menu.open{opacity:1;visibility:visible;transform:translateY(0) scale(1);pointer-events:auto}.dropdown-menu.closing{opacity:0;visibility:hidden;transform:translateY(-4px) scale(.98);pointer-events:none}@media(prefers-reduced-motion:reduce){.dropdown-menu,.dropdown-menu.open,.dropdown-menu.closing{transition:none;transform:none}}.dropdown-menu .menu-section{padding:10px 14px 6px;font-size:9px;font-weight:700;text-transform:uppercase;letter-spacing:.12em;color:var(--color-accent, #4ae0e0);border-top:1px solid rgba(255,255,255,.08);margin-top:6px}.dropdown-menu .menu-section:first-child{border-top:none;margin-top:0;padding-top:4px}.dropdown-menu button[data-type]{display:flex;align-items:center;gap:10px;width:100%;padding:12px 14px;text-align:left;background:transparent;border:none;color:#ffffffd9;cursor:pointer;font-size:12px;font-family:var(--font-mono);transition:background .1s ease,color .1s ease,padding-left .1s ease;position:relative}.dropdown-menu button[data-type]:before{content:"";position:absolute;left:0;top:50%;transform:translateY(-50%);width:2px;height:0;background:var(--color-accent, #4ae0e0);transition:height .1s ease}.dropdown-menu button[data-type]:hover{background:#4ae0e014;color:#fff;padding-left:18px}.dropdown-menu button[data-type]:hover:before{height:60%}.dropdown-menu button[data-type]:active{background:#4ae0e026}.dropdown-menu button[data-type]:focus-visible{outline:2px solid var(--color-accent);outline-offset:-2px;background:#4ae0e014}.dropdown-menu button:not([data-type]){display:flex;align-items:center;gap:var(--spacing-1);width:100%;padding:10px 14px;text-align:left;background:transparent;border:none;color:#ffffffd9;cursor:pointer;font-size:var(--text-sm);font-family:var(--font-mono);transition:background var(--transition-fast),color var(--transition-fast)}.dropdown-menu button:not([data-type]):hover{background:#4ae0e01a;color:#fff}.dropdown-menu button.danger{color:#ef4444e6}.dropdown-menu button.danger:hover{background:#ef444426;color:#ef4444}.dropdown-trigger{position:relative}.dropdown-trigger[aria-expanded=true] .dropdown-icon{transform:rotate(180deg)}.dropdown-icon{transition:transform var(--transition-fast)}.layer-toggles{display:flex;gap:var(--spacing-2);margin-top:var(--spacing-1)}.layer-toggles .checkbox-label{flex:1}.layer-list::-webkit-scrollbar{width:4px}.layer-list::-webkit-scrollbar-track{background:#0003}.layer-list::-webkit-scrollbar-thumb{background:#fff3;border-radius:2px}.layer-list::-webkit-scrollbar-thumb:hover{background:#ffffff4d}.layer-item{will-change:background-color,opacity;transition:background var(--transition-fast),opacity var(--transition-fast)}.layer-header{display:flex;align-items:center;gap:var(--spacing-1);padding:6px var(--spacing-1);cursor:pointer;background:transparent;transition:background var(--transition-fast);overflow:hidden;min-width:0}.layer-header:hover{background:#ffffff0d}.layer-expand-btn{min-width:44px;min-height:44px;padding:0;background:transparent;border:1px solid transparent;border-radius:4px;color:#ffffff80;cursor:pointer;font-size:10px;display:flex;align-items:center;justify-content:center;transition:all var(--transition-fast)}.layer-expand-btn:hover{color:#ffffffe6;background:#ffffff14;border-color:#ffffff1a}.layer-expand-btn:focus-visible{outline:2px solid var(--color-accent);outline-offset:1px}.layer-item.expanded .layer-expand-btn{transform:rotate(90deg);color:var(--color-accent)}.layer-item.expanded .layer-expand-btn:hover{background:#4ae0e01a}.layer-color-swatch{width:12px;height:12px;border-radius:2px;border:1px solid rgba(255,255,255,.2);flex-shrink:0}.layer-icon{width:16px;height:16px;display:flex;align-items:center;justify-content:center;font-size:12px;color:#fff9;flex-shrink:0}.layer-icon[data-shape=sphere]:before{content:"◉"}.layer-icon[data-shape=polyhedron]:before{content:"⬡"}.layer-icon[data-shape=rings]:before{content:"◎"}.layer-icon[data-shape=particles]:before{content:"✦"}.layer-icon[data-shape=spectral-bars]:before{content:"▮"}.layer-icon[data-shape=typography]:before{content:"T";font-weight:700}.layer-icon[data-shape=box]:before{content:"▢"}.layer-icon[data-shape=pyramid]:before{content:"△"}.layer-zone-pill{font-size:8px;text-transform:uppercase;letter-spacing:.5px;padding:2px 4px;background:#ffffff1a;border-radius:2px;color:#fff9;flex-shrink:0}.layer-zone-pill[data-zone=overlay]{background:#ff6b6b33;color:#ff6b6b}.layer-zone-pill[data-zone=hero]{background:#4a9eff33;color:#4a9eff}.layer-zone-pill[data-zone=effects]{background:#4ecdc433;color:#4ecdc4}.layer-zone-pill[data-zone=background]{background:#45b7d133;color:#45b7d1}.layer-opacity-badge{font-family:var(--font-mono);font-size:9px;color:#ffffff80;min-width:28px;text-align:right}.layer-btn{min-width:32px;min-height:32px;padding:6px;background:transparent;border:1px solid transparent;border-radius:2px;color:#fff6;cursor:pointer;font-size:10px;display:flex;align-items:center;justify-content:center;position:relative;overflow:hidden;flex-shrink:0;transition:background var(--transition-micro, .1s cubic-bezier(.19, 1, .22, 1)),color var(--transition-micro, .1s cubic-bezier(.19, 1, .22, 1)),transform var(--duration-instant, 50ms) ease-out,border-color var(--transition-micro, .1s cubic-bezier(.19, 1, .22, 1)),box-shadow var(--transition-micro, .1s cubic-bezier(.19, 1, .22, 1))}.layer-btn:before{content:"";position:absolute;top:0;left:-100%;width:50%;height:100%;background:linear-gradient(90deg,transparent 0%,rgba(255,255,255,.08) 50%,transparent 100%);transform:skew(-25deg);transition:left .3s ease-out;pointer-events:none}.layer-btn:hover:before{left:150%}.layer-btn:hover{background:#ffffff1a;color:#fffc}.layer-btn:active{transform:scale(.95)}.layer-btn:focus-visible{outline:2px solid var(--color-accent);outline-offset:2px}.layer-btn.layer-visible[data-active=true]{color:#ffffffe6}.layer-btn.layer-visible[data-active=false]{color:#fff3}.layer-btn.layer-solo[data-active=true]{background:#4ae0e04d;color:#4ae0e0;border-color:#4ae0e080}.layer-btn.layer-lock[data-active=true]{color:#f94}.layer-visible{position:relative}.layer-visible.off:after{content:"";position:absolute;top:50%;left:50%;width:18px;height:2px;background:#ff6464e6;transform:translate(-50%,-50%) rotate(-45deg);pointer-events:none;border-radius:1px}.layer-visible.off span{opacity:.35}.layer-delete{opacity:.4;color:#ff6464cc;transition:opacity .15s ease,color .15s ease,transform .1s ease;font-size:12px}.layer-delete:hover{opacity:1;color:#f55;transform:scale(1.1)}.layer-item:hover .layer-delete{opacity:.7}.layer-delete:active{transform:scale(.9)}.layer-item[data-visible=false]{opacity:.5}.layer-item[data-visible=false] .layer-name{text-decoration:line-through;color:#fff6}.layer-item[data-solo=true]{background:#4ae0e01a;border-left:2px solid #4ae0e0;padding-left:18px}.layer-item[data-locked=true]{opacity:.7}.layer-item[data-locked=true] .layer-lock{color:#f94}.layer-properties{display:grid;grid-template-rows:0fr;padding:0 var(--spacing-2);padding-left:30px;background:#0006;border-top:1px solid rgba(255,255,255,.05);transition:grid-template-rows .2s ease-out,padding .2s ease-out;overflow:hidden}.layer-properties>*{overflow:hidden}.layer-item.expanded .layer-properties{grid-template-rows:1fr;padding-top:var(--spacing-1);padding-bottom:var(--spacing-2)}.layer-properties-content{min-height:0;transition:opacity .15s ease-out .05s;opacity:0}.layer-item.expanded .layer-properties-content{opacity:1}@media(prefers-reduced-motion:reduce){.layer-properties,.layer-properties-content{transition:none}}.texture-upload-section{margin-top:var(--spacing-2);padding-top:var(--spacing-2);border-top:1px solid rgba(255,255,255,.05)}.texture-row{display:flex;align-items:center;gap:var(--spacing-2)}.texture-label{font-size:var(--text-xs);color:#fff9;text-transform:uppercase;letter-spacing:.05em;min-width:60px}.texture-buttons{display:flex;gap:var(--spacing-1);flex:1}.texture-btn{display:flex;align-items:center;gap:var(--spacing-half);padding:6px 10px;background:#0006;border:1px solid rgba(255,255,255,.15);color:#fffc;font-size:var(--text-xs);font-family:var(--font-mono);cursor:pointer;transition:all var(--transition-fast)}.texture-btn:hover{background:#4ae0e01a;border-color:#4ae0e04d;color:var(--color-accent)}.texture-btn:focus-visible{outline:2px solid var(--color-accent);outline-offset:1px}.texture-icon{font-size:14px}.texture-text{text-transform:uppercase;letter-spacing:.02em}.texture-clear{padding:6px;background:#ff44441a;border-color:#ff44444d;color:#f44c}.texture-clear:hover{background:#f443;border-color:#ff444480;color:#f44}.texture-clear.hidden{display:none}.position-controls{margin-top:var(--spacing-2);padding-top:var(--spacing-2);border-top:1px solid rgba(255,255,255,.05)}.position-controls .property-row{margin-bottom:var(--spacing-1)}.position-controls .property-row:last-child{margin-bottom:0}.position-controls label span{display:inline-block;min-width:70px;color:#fff9;font-size:var(--text-xs)}.layer-quick-actions{display:flex;gap:var(--spacing-2);margin-bottom:var(--spacing-1);padding-bottom:var(--spacing-1);border-bottom:1px solid rgba(255,255,255,.05)}.record-btn{transition:all var(--transition-fast)}.record-btn[data-recording=true]{background:#f446!important;border-color:#f449!important;color:#fff;will-change:opacity;animation:record-pulse 1s infinite}.record-btn[data-recording=true]:before{content:"●";color:#f44;margin-right:6px;font-size:10px}@keyframes record-pulse{0%,to{opacity:1}50%{opacity:.7}}.record-time{font-family:var(--font-mono);font-size:var(--text-xs);color:#fffc;margin-left:6px}.toggle-switch{width:36px;height:20px;border-radius:10px;background:#ffffff1a;border:1px solid rgba(255,255,255,.15);position:relative;cursor:pointer;transition:background var(--transition-fast),border-color var(--transition-fast);flex-shrink:0}.toggle-switch:hover{background:#ffffff26}.toggle-switch[data-on=true]{background:#4ae0e0;border-color:#4ae0e080}.toggle-switch:after{content:"";width:16px;height:16px;border-radius:50%;background:#fff;position:absolute;top:1px;left:1px;transition:left .15s ease;box-shadow:0 1px 3px #0000004d}.toggle-switch[data-on=true]:after{left:17px}button.toggle-switch{border:none;padding:0}button.toggle-switch:focus{outline:2px solid rgba(74,224,224,.5);outline-offset:2px}.routing-block,.subsection{transition:border-color var(--transition-fast)}.routing-block[data-band=low],.subsection:has(h4:first-child:contains("Low")){border-left:3px solid rgba(0,212,255,.6)}.routing-block[data-band=mid]{border-left:3px solid rgba(255,0,255,.6)}.routing-block[data-band=high]{border-left:3px solid rgba(255,255,0,.6)}.routing-block[data-band=onset]{border-left:3px solid rgba(255,128,0,.6)}.section .subsection:nth-child(1){border-left-color:#00d4ff99}.section .subsection:nth-child(2){border-left-color:#f0f9}.section .subsection:nth-child(3){border-left-color:#ff09}.section .subsection:nth-child(4){border-left-color:#ff800099}.shortcut-triggered{animation:shortcut-flash .2s ease}@keyframes shortcut-flash{0%{background:#4a9eff4d}to{background:transparent}}.toggle-button kbd,button kbd{font-size:9px;opacity:.5;margin-left:4px}details.section{margin-bottom:var(--spacing-2);padding-bottom:0;border-bottom:1px solid var(--border-subtle)}details.section.layers-section{flex:1 0 auto;display:flex;flex-direction:column;min-height:300px}details.section.layers-section[open]{flex:1 0 auto;min-height:300px}details.section.layers-section>summary{flex-shrink:0}details.section.layers-section .section-content{flex:1;display:flex;flex-direction:column;min-height:0}details.section:last-child{border-bottom:none}details.section summary{font-size:var( --text-md );font-weight:600;color:#ffffffe6;text-transform:uppercase;letter-spacing:.08em;cursor:pointer;padding:var(--spacing-1) var(--spacing-1);margin:calc(-1 * var(--spacing-1));margin-bottom:0;list-style:none;display:flex;align-items:center;gap:var(--spacing-1);border-radius:0;transition:background var(--transition-fast)}details.section summary:hover{background:#ffffff08}details.section summary::-webkit-details-marker{display:none}details.section summary:before{content:"▶";font-size:8px;color:#ffffff80;transition:transform var(--transition-fast)}details.section[open] summary:before{transform:rotate(90deg);color:var(--color-accent)}details.section[open] summary{color:#fff}details.section .section-content{padding-top:var(--spacing-2);padding-bottom:var(--spacing-1);animation:section-content-fade .2s ease-out}@keyframes section-content-fade{0%{opacity:0;transform:translateY(-4px)}to{opacity:1;transform:translateY(0)}}@media(prefers-reduced-motion:reduce){details.section .section-content{animation:none}}details.section summary .non-default-indicator{width:6px;height:6px;border-radius:50%;background:#4ae0e0;margin-left:auto;display:none}details.section[data-has-changes=true] summary .non-default-indicator{display:block}.slider-track{position:relative}.slider-track:after{content:"";position:absolute;width:2px;height:8px;background:#ffffff4d;top:50%;transform:translateY(-50%);left:calc(var(--default-percent, 50%) * 1%);pointer-events:none}.midi-panel{position:fixed;right:-320px;top:50%;transform:translateY(-50%);width:300px;max-height:400px;background:#0a0a0af2;backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);border:1px solid var(--border-structure);border-right:none;transition:right .3s cubic-bezier(.4,0,.2,1);z-index:200;overflow:hidden}.midi-panel[data-open=true]{right:0}.midi-panel-header{display:flex;align-items:center;justify-content:space-between;padding:var(--spacing-2);border-bottom:1px solid var(--border-subtle);background:#ffffff05}.midi-panel-header h3{font-size:var(--text-sm);font-weight:600;text-transform:uppercase;letter-spacing:.08em;margin:0;color:#ffffffe6}.midi-panel-close{min-width:44px;min-height:44px;padding:0;background:transparent;border:none;color:#ffffff80;cursor:pointer;font-size:18px;line-height:1;display:flex;align-items:center;justify-content:center;border-radius:var(--radius-sm);transition:all var(--transition-fast)}.midi-panel-close:hover{background:#ffffff1a;color:#ffffffe6}.midi-device-list{padding:var(--spacing-2);max-height:180px;overflow-y:auto}.midi-device{display:flex;align-items:center;gap:var(--spacing-1);padding:var(--spacing-1);background:#ffffff08;margin-bottom:4px;font-size:var(--text-sm);border-radius:2px;transition:background var(--transition-fast)}.midi-device:hover{background:#ffffff0f}.midi-device:last-child{margin-bottom:0}.midi-device-status{width:8px;height:8px;border-radius:50%;background:#ffffff4d;flex-shrink:0;transition:background var(--transition-fast)}.midi-device[data-connected=true] .midi-device-status{background:#4ae0e0;box-shadow:0 0 6px #4ae0e080}.midi-device[data-connected=false] .midi-device-status{background:#fff3}.midi-device-name{flex:1;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;color:#fffc}.midi-device-type{font-size:9px;text-transform:uppercase;padding:2px 4px;background:#ffffff1a;border-radius:2px;color:#ffffff80;flex-shrink:0}.midi-device[data-type=input] .midi-device-type{background:#4a9eff33;color:#4a9eff}.midi-device[data-type=output] .midi-device-type{background:#ff6b6b33;color:#ff6b6b}.midi-device-empty{justify-content:center;color:#fff6;font-style:italic;background:transparent}.midi-device-empty:hover{background:transparent}.midi-learn-section{padding:var(--spacing-2);border-top:1px solid var(--border-subtle);background:#ffffff05}.midi-learn-btn{width:100%;min-height:44px;padding:var(--spacing-1) var(--spacing-2);background:#ff00ff26;border:1px solid rgba(255,0,255,.3);color:#fff;cursor:pointer;font-size:var(--text-sm);font-weight:500;border-radius:2px;transition:all var(--transition-fast);margin-bottom:var(--spacing-1)}.midi-learn-btn:hover{background:#ff00ff40;border-color:#ff00ff80}.midi-learn-btn[data-learning=true]{background:#f0f6;border-color:#ff00ffb3;animation:midi-learn-pulse 1s infinite}.midi-learn-status{display:block;font-size:var(--text-xs);color:#ffffff80;text-align:center}@keyframes midi-learn-pulse{0%,to{opacity:1;box-shadow:0 0 #f0f6}50%{opacity:.8;box-shadow:0 0 12px 2px #ff00ff4d}}.midi-activity{display:flex;align-items:center;gap:var(--spacing-1);padding:var(--spacing-1) var(--spacing-2);border-top:1px solid var(--border-subtle)}.midi-activity-indicator{width:10px;height:10px;border-radius:50%;background:#ffffff26;transition:background .05s ease,box-shadow .05s ease}.midi-activity-indicator.active{background:#4ae0e0;box-shadow:0 0 8px #4ae0e099}.midi-activity-label{font-size:var(--text-xs);color:#fff6;text-transform:uppercase;letter-spacing:.5px}.midi-btn{font-size:var(--text-xs)!important;font-weight:600;text-transform:uppercase;letter-spacing:.5px}.midi-btn.active{background:#ff00ff40!important;border-color:#ff00ff80!important;color:#f8f}.toolbar-spacer{flex:1}.midi-device-list::-webkit-scrollbar{width:4px}.midi-device-list::-webkit-scrollbar-track{background:#0003}.midi-device-list::-webkit-scrollbar-thumb{background:#fff3;border-radius:2px}.midi-device-list::-webkit-scrollbar-thumb:hover{background:#ffffff4d}.midi-learn-btn[data-active=true]{background:#ff00ff80;animation:midi-pulse 1s infinite}@keyframes midi-pulse{0%,to{opacity:1}50%{opacity:.6}}.layer-btn[title],.toolbar-btn[title]{position:relative}button[role=switch]{cursor:pointer}button[role=switch]:focus-visible{outline:2px solid #4ae0e0;outline-offset:2px}@media(prefers-reduced-motion:reduce){.record-btn[data-recording=true],.layer-item.shortcut-triggered,.midi-learn-btn[data-active=true]{animation:none}.layer-expand-btn,details.section summary:before,.toggle-switch:after{transition:none}}.zone-indicator.ol{background:#ff6b6b}.zone-indicator.hr{background:#4a9eff}.zone-indicator.fx{background:#4ecdc4}.zone-indicator.bg{background:#45b7d1}.section-marker{color:var(--color-text-dim);margin-right:6px;font-weight:400;opacity:.6}.section-header{font-family:var(--font-mono);font-size:var(--text-xs);text-transform:uppercase;letter-spacing:.08em;color:var(--color-text-dim);display:flex;align-items:center;gap:var(--spacing-half)}.section-header .section-marker:before{content:"/"}.section-count{font-family:var(--font-mono);font-size:.9em;color:var(--color-text-dim);opacity:.6;margin-left:4px}.section-count:before{content:"("}.section-count:after{content:")"}.kbd-hint{font-family:var(--font-mono);font-size:9px;color:var(--color-text-dim);opacity:.5;margin-left:6px;letter-spacing:.02em}.kbd-hint:before{content:"["}.kbd-hint:after{content:"]"}.transport-btn .kbd-hint{opacity:.4}.transport-btn:hover .kbd-hint{opacity:.7}.metadata-row{display:flex;align-items:baseline;gap:var(--spacing-1);font-family:var(--font-mono);font-size:var(--text-xs)}.metadata-label{color:var(--color-text-dim);text-transform:uppercase;letter-spacing:.08em;opacity:.6}.metadata-label:after{content:":"}.metadata-value{color:var(--color-text)}.tag-list{display:flex;align-items:center;gap:0;font-family:var(--font-mono);font-size:var(--text-xs);text-transform:uppercase;letter-spacing:.05em}.tag-item+.tag-item:before{content:"|";margin:0 8px;color:var(--color-text-dim);opacity:.3}.figure-label{font-family:var(--font-mono);font-size:9px;color:var(--color-text-dim);text-transform:uppercase;letter-spacing:.1em;opacity:.5}.figure-label:before{content:"[ "}.figure-label:after{content:" ]"}.link-external:after{content:" ↗";font-size:.8em;opacity:.6}#control-panel,.control-panel{font-family:var(--font-mono);letter-spacing:.02em}.slider-label,.slider-value,.toggle-label{font-family:inherit;text-transform:uppercase;font-size:var(--text-xs)}.status-coordinates{font-family:var(--font-mono);font-size:var(--text-xs);color:var(--color-text-dim);letter-spacing:.05em;margin-left:16px}.coord-label{color:var(--color-accent);margin-right:2px}.coord-x,.coord-y{font-variant-numeric:tabular-nums;min-width:4ch;display:inline-block}body.controls-hidden .status-coordinates{display:none}.status-render{font-family:var(--font-mono);font-size:var(--text-xs);color:var(--color-text-dim);text-transform:uppercase;letter-spacing:.08em}.render-fps,.render-resolution,.render-backend{color:var(--color-text)}.status-panel .fps-value{font-variant-numeric:tabular-nums}.routing-block[data-band=low]{border-left:3px solid var(--color-band-low)}.routing-block[data-band=mid]{border-left:3px solid var(--color-band-mid)}.routing-block[data-band=high]{border-left:3px solid var(--color-band-high)}.routing-block[data-band=onset]{border-left:3px solid var(--color-band-onset)}@media(prefers-reduced-motion:reduce){.layer-item{animation:none;opacity:1;transform:none}.layer-btn:before,.layer-solo:before,.button-group button:before,.session-panel__transport-button:before{display:none}.layer-item:hover,.layer-item:active,.layer-btn:hover,.layer-btn:active,.layer-solo:hover,.layer-solo:active,.layer-visibility:hover,.layer-visibility:active{transform:none}.layer-item,.layer-btn,.layer-solo,.layer-visibility,.button-group button,.session-panel__transport-button{transition:none}}.modal-overlay{position:fixed;inset:0;background:#000000bf;display:flex;align-items:center;justify-content:center;z-index:var(--z-modal);backdrop-filter:blur(4px)}.modal-dialog{background:var(--bg);border:1px solid var(--border-active);padding:var(--spacing-4);min-width:400px;max-width:600px}.modal-content{display:flex;flex-direction:column;gap:var(--spacing-3)}.modal-content p,.modal-dialog-title{color:var(--fg);font-size:var(--text-base);margin:0;font-weight:var(--font-weight-medium, 500);line-height:1.4}.modal-input{background:var(--glass);border:1px solid var(--border);color:var(--fg);padding:var(--spacing-2);font-family:var(--font-sans);font-size:var(--text-base);outline:none;transition:border-color var(--transition-fast)}.modal-input:focus{border-color:var(--border-active);background:#00000080}.modal-buttons{display:flex;gap:var(--spacing-2);justify-content:flex-end}.modal-btn{padding:var(--spacing-2) var(--spacing-3);background:var(--glass);border:1px solid var(--border);color:var(--fg);font-family:var(--font-sans);font-size:var(--text-sm);cursor:pointer;transition:all var(--transition-fast);text-transform:uppercase;letter-spacing:.5px}.modal-btn:hover{border-color:var(--border-active);background:#0009}.modal-btn-ok{background:#4ae0e01a;border-color:var(--color-accent-dim)}.modal-btn-ok:hover{background:#4ae0e033;border-color:var(--color-accent)}@media(prefers-reduced-motion:reduce){.modal-overlay{backdrop-filter:none}.modal-input,.modal-btn{transition:none}}.shader-panel .section-header{display:flex;align-items:center;gap:8px}.shader-layer-indicator{margin-left:auto;font-size:10px;opacity:.75;letter-spacing:.04em}.shader-popout-btn{font-size:11px;border:1px solid rgba(255,255,255,.22);background:#ffffff0f;color:#ffffffe6;padding:2px 8px;cursor:pointer}.shader-tabs{display:grid;grid-template-columns:1fr 1fr;gap:6px;margin-bottom:10px}.shader-tabs .tab-btn{border:1px solid rgba(255,255,255,.2);background:#0006;color:#fffc;padding:6px 8px;cursor:pointer;font-size:12px;text-transform:uppercase}.shader-tabs .tab-btn.active{border-color:#4ae0e0a6;color:#fff}.shader-panel .tab-content{display:none}.shader-panel .tab-content.active{display:block}.shader-preset-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:6px}.shader-preset-card{border:1px solid rgba(255,255,255,.2);background:#00000059;color:#ffffffe6;text-align:left;padding:8px;cursor:pointer;display:grid;gap:4px}.shader-preset-card.active{border-color:#4ae0e0bf;background:#4ae0e01f}.shader-preset-name{font-size:12px;font-weight:600}.shader-preset-category{font-size:10px;opacity:.7;text-transform:uppercase}.shader-actions{margin-top:8px;display:flex;justify-content:flex-end}.shader-actions .import-shader-btn{border:1px solid rgba(255,255,255,.25);background:#ffffff14;color:#fffffff2;padding:5px 10px;cursor:pointer}.shader-uniform-controls{display:grid;gap:8px}.shader-uniform-control label{display:block;margin-bottom:4px;font-size:12px}.shader-slider-row{display:grid;grid-template-columns:1fr auto;gap:8px;align-items:center}.shader-slider-row .value{font-size:11px;min-width:40px;text-align:right;opacity:.75}.shader-checkbox-row{display:flex;align-items:center;gap:8px}.shader-status{margin-top:10px;border-top:1px solid rgba(255,255,255,.15);padding-top:8px;display:flex;gap:8px;align-items:center;font-size:11px}.shader-status.compiled{color:#7af09cf2}.shader-status.error{color:#ff7d7df2}.shader-no-selection.hidden{display:none}.model-asset-section{margin-top:8px;border-top:1px dashed rgba(255,255,255,.14);padding-top:8px}.model-asset-section small{opacity:.75;font-size:11px}.model-asset-section .model-asset-missing{color:#ff9191f2}@media(min-width:1200px){.shader-panel.is-popout{position:fixed;right:24px;top:88px;width:320px;max-height:calc(100vh - 120px);overflow:auto;z-index:120;box-shadow:0 8px 40px #00000073}}@media(max-width:1199px){.shader-popout-btn{display:none}}.skip-link{position:absolute;top:-100px;left:50%;transform:translate(-50%);background:var(--bg, #000);color:var(--color-accent, #4ae0e0);padding:8px 16px;text-decoration:none;font-family:var(--font-mono, "SF Mono", Monaco, Menlo, monospace);font-size:12px;border:1px solid var(--color-accent, #4ae0e0);border-radius:var(--radius-md, 4px);z-index:10002;transition:top var(--transition-fast, .15s ease)}.skip-link:focus{top:8px;outline:2px solid var(--color-accent, #4ae0e0);outline-offset:2px}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border-width:0}[data-panel-id]:focus-visible{outline:3px solid var(--color-accent, #4ae0e0);outline-offset:0px;box-shadow:0 0 0 1px #000c,0 0 12px #4ae0e033}canvas:focus-visible{outline:3px solid var(--color-accent, #4ae0e0);outline-offset:-3px;box-shadow:inset 0 0 0 3px #4ae0e026}#panel-focus-announcer{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border-width:0}@media(prefers-contrast:more){[data-panel-id]:focus-visible{outline-width:4px;outline-color:Highlight;box-shadow:none}canvas:focus-visible{outline-width:4px;outline-color:Highlight;box-shadow:none}}@media(prefers-reduced-motion:reduce){.skip-link{transition:none}}.notification-container{position:fixed;top:16px;right:16px;z-index:10000;display:flex;flex-direction:column;gap:8px;pointer-events:none;max-width:400px}.toast{display:flex;align-items:center;gap:12px;padding:12px 16px;min-width:280px;max-width:400px;background:var(--bg);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);border:1px solid var(--border-subtle);box-shadow:0 4px 16px #00000080;font-family:var(--font-mono, "SF Mono", Monaco, Menlo, monospace);font-size:12px;pointer-events:auto;animation:toast-in .3s ease-out}.toast-icon{font-size:16px;font-weight:700;flex-shrink:0;width:20px;text-align:center}.toast-message{flex:1;color:var(--fg);line-height:1.4;word-wrap:break-word}.toast-close{background:none;border:none;color:var(--text-dim);font-size:20px;cursor:pointer;padding:0;min-width:44px;min-height:44px;flex-shrink:0;transition:color var(--transition-fast, .15s ease);display:flex;align-items:center;justify-content:center}.toast-close:hover{color:var(--fg)}.toast-close:focus-visible{outline:2px solid var(--accent);outline-offset:2px}.toast-info{border-left:3px solid var(--accent)}.toast-info .toast-icon{color:var(--accent)}.toast-success{border-left:3px solid var(--color-success)}.toast-success .toast-icon{color:var(--color-success)}.toast-warning{border-left:3px solid var(--color-warning)}.toast-warning .toast-icon{color:var(--color-warning)}.toast-error{border-left:3px solid var(--color-error)}.toast-error .toast-icon{color:var(--color-error)}@keyframes toast-in{0%{opacity:0;transform:translate(100px)}to{opacity:1;transform:translate(0)}}.toast.fade-out{animation:toast-out .3s ease-out forwards}@keyframes toast-out{0%{opacity:1;transform:translate(0)}to{opacity:0;transform:translate(100px)}}.error-modal-overlay{position:fixed;top:0;left:0;width:100%;height:100%;background:var(--bg);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);display:flex;align-items:center;justify-content:center;z-index:10001;animation:modal-fade-in .3s ease-out}.error-modal{background:var(--bg);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);border:1px solid var(--color-error);padding:32px;max-width:500px;width:90%;box-shadow:0 8px 32px #000000b3}.error-title{font-family:var(--font-mono, "SF Mono", Monaco, Menlo, monospace);font-size:18px;color:var(--color-error);margin:0 0 16px;font-weight:600;text-transform:uppercase;letter-spacing:.05em}.error-message{font-family:var(--font-mono, "SF Mono", Monaco, Menlo, monospace);font-size:14px;color:var(--fg);line-height:1.6;margin:0 0 24px}.error-close{background:var(--color-error-glow);border:1px solid var(--color-error);color:var(--color-error);padding:10px 20px;font-family:var(--font-mono, "SF Mono", Monaco, Menlo, monospace);font-size:12px;text-transform:uppercase;letter-spacing:.05em;cursor:pointer;transition:all var(--transition-fast, .15s ease);width:100%;min-height:44px}.error-close:hover{background:var(--color-error);color:var(--bg)}.error-close:focus-visible{outline:2px solid var(--color-error);outline-offset:2px}@keyframes modal-fade-in{0%{opacity:0}to{opacity:1}}.error-modal-overlay.fade-out{animation:modal-fade-out .3s ease-out forwards}@keyframes modal-fade-out{0%{opacity:1}to{opacity:0}}@media(prefers-reduced-motion:reduce){.toast{animation:none}.toast.fade-out{animation:none;opacity:0}.error-modal-overlay{animation:none}.error-modal-overlay.fade-out{animation:none;opacity:0}}@media(max-width:768px){.notification-container{top:8px;right:8px;left:8px;max-width:none}.toast{min-width:auto;max-width:none}.error-modal{width:95%;padding:24px}}.welcome-overlay{position:fixed;inset:0;display:none;align-items:center;justify-content:center;background:var(--glass);backdrop-filter:blur(2px);z-index:var(--z-modal, 500);opacity:0;transition:opacity .3s ease}.welcome-overlay.visible{display:flex;opacity:1}.welcome-content{max-width:440px;width:90%;padding:var(--spacing-4, 32px);background:var(--bg);border:1px solid var(--accent-dim);border-radius:var(--radius-lg, 6px);box-shadow:0 8px 32px #000000b3,0 0 60px var(--accent-glow),inset 0 1px 0 var(--border-subtle);animation:welcome-fade-in .3s ease-out}@keyframes welcome-fade-in{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}.welcome-header{text-align:center;margin-bottom:var(--spacing-4, 32px)}.welcome-logo{display:flex;justify-content:center;margin-bottom:var(--spacing-2, 16px);color:var(--accent)}.welcome-logo svg{width:48px;height:48px}.welcome-title{font-family:var(--font-display, "Inter", system-ui, sans-serif);font-size:36px;font-weight:700;color:var(--fg);margin:0 0 var(--spacing-1, 8px) 0;letter-spacing:-.02em;text-shadow:0 0 40px var(--accent-glow)}.welcome-subtitle{font-family:var( --font-sans, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif );font-size:var(--text-sm, 12px);color:var(--text-dim);margin:0;text-transform:uppercase;letter-spacing:.1em;font-weight:500}.welcome-body{margin-bottom:var(--spacing-3, 24px)}.welcome-instruction{font-family:var( --font-sans, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif );font-size:var(--text-base, 14px);color:var(--fg);margin:0 0 var(--spacing-2, 16px) 0;text-align:center;line-height:var(--line-height-normal, 1.5)}.welcome-options{display:flex;flex-direction:column;gap:var(--spacing-2, 16px);margin-bottom:var(--spacing-3, 24px)}.welcome-option{display:flex;align-items:center;gap:var(--spacing-2, 16px);padding:var(--spacing-2, 16px);background:var(--border-subtle);border:1px solid var(--border-default);border-radius:var(--radius-md, 8px);color:var(--fg);cursor:pointer;transition:all var(--transition-fast, .15s ease);text-align:left;font-family:var( --font-sans, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif )}.welcome-option--primary{background:var(--accent);border-color:var(--accent);color:var(--bg);font-weight:600;box-shadow:0 4px 16px var(--accent-glow);position:relative;overflow:hidden}.welcome-option--primary .welcome-option-icon{color:var(--bg)}.welcome-option--primary .welcome-option-label small{color:var(--bg);opacity:.7}.welcome-option:hover{background:var(--border-active);border-color:var(--accent);box-shadow:0 2px 8px var(--accent-glow)}.welcome-option--primary:hover{background:var(--accent-hover);border-color:var(--accent-hover);box-shadow:0 6px 20px var(--accent-dim);transform:translateY(-2px)}.welcome-option:focus-visible{outline:3px solid var(--accent);outline-offset:2px;box-shadow:0 0 0 2px var(--bg),0 0 12px var(--accent-glow)}.welcome-option-icon{display:flex;align-items:center;justify-content:center;width:48px;height:48px;flex-shrink:0;color:var(--accent)}.welcome-option-icon svg{width:32px;height:32px}.welcome-option-label{display:flex;flex-direction:column;gap:4px}.welcome-option-label strong{font-size:var(--text-md, 14px);font-weight:500}.welcome-option-label small{font-size:var(--text-xs, 11px);color:var(--text-dim);text-transform:uppercase;letter-spacing:.05em}.welcome-drop-zone{position:relative;padding:var(--spacing-2, 16px);border:1px dashed var(--border-default);border-radius:var(--radius-md, 4px);background:var(--border-subtle);text-align:center;transition:all var(--transition-fast, .15s ease);cursor:pointer}.welcome-drop-zone p{font-family:var(--font-mono, "SF Mono", Monaco, Menlo, monospace);font-size:var(--text-xs, 11px);color:var(--text-dim);margin:0}.welcome-drop-zone:hover{border-color:var(--accent);border-style:solid;background:var(--accent-glow);box-shadow:0 0 24px var(--accent-glow),inset 0 0 16px #4ae0e00a}.welcome-drop-zone:focus-visible{outline:3px solid var(--accent);outline-offset:-2px;border-color:var(--accent);box-shadow:0 0 24px var(--accent-glow),inset 0 0 16px #4ae0e01a,inset 0 0 0 1px var(--accent)}.welcome-footer{display:flex;align-items:center;justify-content:space-between;padding-top:var(--spacing-2, 16px);border-top:1px solid var(--border-subtle)}.welcome-hint{font-family:var(--font-mono, "SF Mono", Monaco, Menlo, monospace);font-size:var(--text-xs, 11px);color:var(--text-dim);margin:0}.welcome-hint kbd{display:inline-block;padding:2px 6px;background:var(--border-subtle);border:1px solid var(--border-default);font-family:var(--font-mono, "SF Mono", Monaco, Menlo, monospace);font-size:var(--text-xs, 11px);font-weight:600}.welcome-dismiss{background:none;border:1px solid var(--border-default);color:var(--text-dim);padding:var(--spacing-1, 8px) var(--spacing-2, 16px);font-family:var(--font-mono, "SF Mono", Monaco, Menlo, monospace);font-size:var(--text-xs, 11px);text-transform:uppercase;letter-spacing:.05em;cursor:pointer;transition:all var(--transition-fast, .15s ease)}.welcome-dismiss:hover{border-color:var(--fg);color:var(--fg)}.welcome-dismiss:focus-visible{outline:3px solid var(--accent);outline-offset:2px;box-shadow:0 0 0 2px var(--bg),0 0 12px var(--accent-glow)}.welcome-close{position:absolute;top:var(--spacing-2, 16px);right:var(--spacing-2, 16px);display:flex;align-items:center;justify-content:center;width:44px;height:44px;padding:0;background:var(--border-subtle);border:1px solid var(--border-default);border-radius:var(--radius-md, 8px);color:var(--text-dim);cursor:pointer;transition:all var(--transition-fast, .15s ease);font-size:18px;line-height:1;z-index:10}.welcome-close:hover{background:var(--accent-glow);border-color:var(--accent-dim);color:var(--fg);box-shadow:0 4px 12px var(--accent-glow)}.welcome-close:active{transform:scale(.96)}.welcome-close:focus-visible{outline:3px solid var(--accent);outline-offset:2px;box-shadow:0 0 0 2px var(--bg),0 0 12px var(--accent-glow),0 4px 12px var(--accent-glow)}.welcome-overlay.drag-active .welcome-drop-zone{border-color:var(--accent);background:var(--accent-glow)}.welcome-overlay.drag-active{background:#0009}.welcome-overlay.drag-active .welcome-drop-zone{border-color:var(--color-accent, #4ae0e0);background:#4ae0e01a}@media(prefers-reduced-motion:reduce){.welcome-overlay{transition:none}.welcome-content{animation:none}.welcome-option,.welcome-drop-zone,.welcome-dismiss{transition:none}}@media(max-width:480px){.welcome-overlay{align-items:flex-start;padding:var(--spacing-2, 16px);overflow-y:auto;background:#00000080}.welcome-content{padding:var(--spacing-2, 16px);margin-top:var(--spacing-3, 24px);margin-bottom:var(--spacing-2, 16px);max-height:calc(100vh - 48px);max-height:calc(100dvh - 48px);overflow-y:auto}.welcome-header{margin-bottom:var(--spacing-2, 16px)}.welcome-title{font-size:28px;letter-spacing:-.01em}.welcome-subtitle{font-size:var(--text-xs, 11px)}.welcome-options{gap:var(--spacing-1, 8px)}.welcome-option{padding:var(--spacing-1, 8px) var(--spacing-2, 16px);gap:var(--spacing-1, 8px)}.welcome-option-icon{width:36px;height:36px}.welcome-option-icon svg{width:24px;height:24px}.welcome-body{margin-bottom:var(--spacing-2, 16px)}.welcome-drop-zone{padding:var(--spacing-1, 8px)}.welcome-footer{flex-direction:column;gap:var(--spacing-1, 8px);text-align:center;padding-top:var(--spacing-1, 8px)}}.wav-intro-overlay svg{position:absolute;width:0;height:0}.wav-intro-overlay{position:fixed;inset:0;display:none;align-items:center;justify-content:center;background:#0a0a0a;z-index:1000;opacity:0;transition:opacity .3s ease;overflow:hidden}.wav-intro-overlay.visible{opacity:1}.wav-intro-overlay[data-state=closing]{opacity:0}.wav-intro-static{position:absolute;inset:-10%;width:120%;height:120%;background:repeating-conic-gradient(from 0deg at 50% 50%,#000,#1a1a1a,#0a0a0a,#151515,#000 2deg),repeating-linear-gradient(90deg,#0a0a0a,#151515,#0a0a0a 4px);background-blend-mode:overlay;filter:url(#noise) contrast(1.5) brightness(.8);opacity:.85;animation:wav-static-move .08s steps(6) infinite;pointer-events:none}@keyframes wav-static-move{0%{transform:translate(0)}25%{transform:translate(-2%,1%)}50%{transform:translate(1%,-2%)}75%{transform:translate(-1%,2%)}to{transform:translate(2%,-1%)}}.wav-intro-static:before{content:"";position:absolute;inset:0;background:repeating-linear-gradient(0deg,transparent 0px,transparent 2px,rgba(255,255,255,.03) 2px,rgba(255,255,255,.03) 4px);animation:wav-static-lines .1s steps(2) infinite}@keyframes wav-static-lines{0%{transform:translateY(0)}to{transform:translateY(4px)}}.wav-intro-static:after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,transparent 0%,rgba(255,255,255,.05) 50%,transparent 100%);animation:wav-static-flicker 3s ease-in-out infinite;opacity:0}@keyframes wav-static-flicker{0%,92%,to{opacity:0;transform:translateY(-100%)}94%{opacity:1;transform:translateY(0)}96%{opacity:1;transform:translateY(100%)}}.wav-intro-stack{width:100%;height:100%;display:flex;align-items:center;justify-content:center;padding:24px;box-sizing:border-box;position:relative;z-index:1}.wav-intro-crt{position:relative;width:min(85vw,calc(85vh * 4 / 3));aspect-ratio:4 / 3;background:transparent;overflow:hidden;clip-path:url(#crt-shape);border-radius:8%/6%}.wav-intro-crt-wrapper{position:relative;filter:drop-shadow(0 0 80px rgba(74,224,224,.1)) drop-shadow(0 20px 60px rgba(0,0,0,.8))}.wav-intro-crt-wrapper:before{content:"";position:absolute;inset:-4%;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='-3 -3 106 106' preserveAspectRatio='none'%3E%3Cpath d='M 6,8 Q 50,-3 94,8 Q 103,50 94,92 Q 50,103 6,92 Q -3,50 6,8 Z' fill='none' stroke='rgba(255,255,255,0.05)' stroke-width='1'/%3E%3C/svg%3E");background-size:100% 100%;background-repeat:no-repeat;pointer-events:none;z-index:-1}.wav-intro-crt:before{content:"";position:absolute;inset:0;border-radius:inherit;background:repeating-linear-gradient(0deg,transparent 0px,transparent 1px,rgba(0,0,0,.25) 1px,rgba(0,0,0,.25) 2px),repeating-linear-gradient(0deg,transparent 0px,transparent 4px,rgba(0,0,0,.08) 4px,rgba(0,0,0,.08) 8px);pointer-events:none;z-index:10;animation:wav-scanline-flicker .05s steps(2) infinite}@keyframes wav-scanline-flicker{0%{opacity:.9}to{opacity:1}}.wav-intro-crt:after{content:"";position:absolute;inset:0;border-radius:inherit;background:radial-gradient(ellipse 90% 90% at center,transparent 0%,transparent 40%,rgba(0,0,0,.2) 55%,rgba(0,0,0,.5) 70%,rgba(0,0,0,.75) 85%,rgba(0,0,0,.95) 100%),radial-gradient(ellipse 80% 80% at center,rgba(120,255,200,.03) 0%,transparent 50%),linear-gradient(125deg,rgba(255,255,255,.12) 0%,rgba(255,255,255,.05) 15%,transparent 35%,transparent 100%),linear-gradient(305deg,rgba(255,255,255,.04) 0%,transparent 20%);box-shadow:inset 0 0 150px #00000080,inset 0 0 60px #0000004d,inset 4px 4px 10px #ffffff0a,inset -3px -3px 8px #0006;pointer-events:none;z-index:11}.wav-intro-channel{position:absolute;top:12px;right:16px;font-family:VT323,Courier New,Lucida Console,monospace;font-size:clamp(24px,4vw,36px);font-weight:400;color:#32cd32;text-shadow:0 0 8px rgba(50,205,50,.8),0 0 16px rgba(50,205,50,.5),0 0 24px rgba(50,205,50,.3);letter-spacing:.05em;z-index:15;pointer-events:none;filter:blur(.3px);animation:wav-channel-flicker 4s ease-in-out infinite}@keyframes wav-channel-flicker{0%,95%,to{opacity:1}96%{opacity:.8}97%{opacity:1}98%{opacity:.9}}.wav-intro-gif-bg{position:absolute;inset:0;overflow:hidden;z-index:1}.wav-intro-gif-bg img{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);min-width:105%;min-height:105%;width:auto;height:auto;object-fit:cover;filter:url(#barrel)}.wav-intro-video{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);min-width:105%;min-height:105%;width:auto;height:auto;object-fit:cover;display:block;opacity:0;pointer-events:none}.wav-intro-crt .wav-intro-video+.wav-intro-glass{content:"";position:absolute;inset:0;border-radius:inherit;pointer-events:none;z-index:4}.wav-intro-ui{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;background:#0009;opacity:0;transition:opacity .4s ease;pointer-events:none;z-index:5;border-radius:inherit}.wav-intro-crt[data-mode=poster] .wav-intro-ui{opacity:1;pointer-events:auto;cursor:pointer}.wav-intro-content{text-align:center;padding:20px}.wav-intro-title{font-family:JetBrains Mono,Fira Code,SF Mono,monospace;font-size:clamp(24px,5vw,48px);font-weight:700;color:#fff;text-transform:uppercase;letter-spacing:.25em;text-shadow:0 0 10px rgba(74,224,224,.8),0 0 20px rgba(74,224,224,.5),0 0 40px rgba(74,224,224,.3);margin-bottom:24px}.wav-intro-prompt{font-family:JetBrains Mono,Fira Code,SF Mono,monospace;font-size:clamp(12px,2vw,18px);color:#ffffffe6;animation:wav-pulse-text 2s ease-in-out infinite;text-shadow:0 0 10px rgba(74,224,224,.5)}@keyframes wav-pulse-text{0%,to{opacity:.7;text-shadow:0 0 5px rgba(74,224,224,.3)}50%{opacity:1;text-shadow:0 0 15px rgba(74,224,224,.6)}}.wav-intro-hint{font-family:JetBrains Mono,Fira Code,SF Mono,monospace;font-size:11px;color:#ffffff59;margin-top:20px;text-align:center;letter-spacing:.05em;position:absolute;bottom:20px;left:0;right:0;z-index:2}.wav-intro-skip{position:absolute;bottom:16px;right:16px;font-family:JetBrains Mono,Fira Code,SF Mono,monospace;font-size:11px;color:#ffffff80;background:#0009;border:1px solid rgba(255,255,255,.2);border-radius:4px;padding:6px 12px;cursor:pointer;transition:all .2s ease;z-index:20;opacity:0;animation:wav-fade-in-skip .5s ease 1s forwards}@keyframes wav-fade-in-skip{to{opacity:1}}.wav-intro-skip:hover{color:#ffffffe6;border-color:#4ae0e080;background:#000c}.wav-intro-skip:focus-visible{outline:2px solid rgba(74,224,224,.8);outline-offset:2px}.wav-intro-crt[data-mode=poster] .wav-intro-skip{display:none}.wav-intro-crt{animation:wav-crt-power-on .8s ease-out forwards}@keyframes wav-crt-power-on{0%{transform:scaleY(.01);filter:brightness(2)}40%{transform:scaleY(.01);filter:brightness(2)}60%{transform:scale(1);filter:brightness(1.5)}to{transform:scale(1);filter:brightness(1)}}.wav-intro-stack:before{content:"";position:absolute;width:min(92vw,calc(92vh * 4 / 3));aspect-ratio:4 / 3;border-radius:12px;background:transparent;box-shadow:0 0 120px 20px #4ae0e014;pointer-events:none;z-index:0}@media(prefers-reduced-motion:reduce){.wav-intro-overlay,.wav-intro-ui{transition:none}.wav-intro-prompt{animation:none;opacity:.9}.wav-intro-skip{animation:none;opacity:1}.wav-intro-static{animation:none}.wav-intro-static:before{animation:none}.wav-intro-static:after{animation:none}.wav-intro-crt{animation:none}.wav-intro-crt:before{animation:none}.wav-intro-channel{animation:none}}@media(max-width:600px){.wav-intro-stack{padding:12px}.wav-intro-crt{width:min(95vw,calc(80vh * 4 / 3));border-radius:4%/3%;box-shadow:inset 0 0 40px #000000e6,0 0 0 3px #1a1a1a,0 0 0 6px #0a0a0a,0 15px 50px #000c}.wav-intro-skip{bottom:10px;right:10px;padding:5px 10px;font-size:10px}.wav-intro-static{opacity:.7}}.wav-intro-crt[data-mode=poster] .wav-intro-ui{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:clamp(12px,2.5vh,24px);padding:clamp(16px,3vh,28px) 5%;background:linear-gradient(to bottom,transparent 0%,rgba(0,0,0,.55) 20%,rgba(0,0,0,.85) 100%);inset:auto 0 0;height:38%}.wav-intro-columns{display:grid;grid-template-columns:auto auto;gap:clamp(40px,8vw,80px);width:100%;max-width:900px;justify-content:center;align-items:start}.wav-intro-col-left{display:flex;align-items:center;gap:clamp(12px,2vw,20px)}.wav-intro-portrait{width:clamp(66px,13.2vw,106px);height:clamp(66px,13.2vw,106px);flex-shrink:0;border:2px solid rgba(74,224,224,.5);overflow:hidden;image-rendering:pixelated;background:#00000080}.wav-intro-portrait img{width:100%;height:100%;object-fit:cover;image-rendering:pixelated}.wav-intro-bio-text{display:flex;flex-direction:column;align-items:flex-start;gap:2px}.wav-intro-byline{font-family:VT323,Courier New,monospace;font-size:clamp(13px,2.1vw,19px);color:#fff9;letter-spacing:.1em}.wav-intro-name{font-family:VT323,Courier New,monospace;font-size:clamp(19px,3.3vw,26px);font-weight:400;color:#4ae0e0;letter-spacing:.1em;text-shadow:0 0 10px rgba(74,224,224,.5)}.wav-intro-link{font-family:VT323,Courier New,monospace;font-size:clamp(13px,2.1vw,18px);color:#ff69b4;text-decoration:none;letter-spacing:.05em;transition:all .2s ease}.wav-intro-link:hover{color:#f9c;text-shadow:0 0 10px rgba(255,105,180,.6)}.wav-intro-roles{font-family:VT323,Courier New,monospace;font-size:clamp(12px,2vw,16px);color:#fff9;letter-spacing:.15em;margin-top:4px}.wav-intro-col-right{display:flex;flex-direction:column;align-items:flex-start;gap:clamp(8px,1.5vh,14px);padding-left:clamp(24px,4vw,40px);border-left:1px solid rgba(74,224,224,.25)}.wav-intro-tagline{font-family:VT323,Courier New,monospace;font-size:clamp(15px,2.6vw,21px);color:#fffffff2;line-height:1.3;margin:0;font-style:italic;text-shadow:0 0 8px rgba(74,224,224,.3)}.wav-intro-instructions{list-style:none;padding:0;margin:0;display:flex;flex-direction:column;align-items:flex-start;gap:clamp(2px,.5vh,4px)}.wav-intro-instructions li{font-family:VT323,Courier New,monospace;font-size:clamp(14px,2.4vw,19px);color:#fffc;display:flex;align-items:center;gap:6px}.wav-intro-bullet{color:#32cd32;text-shadow:0 0 5px rgba(50,205,50,.5)}.wav-intro-start-btn{margin-top:clamp(8px,1.5vh,16px);padding:clamp(10px,2vh,16px) clamp(20px,5vw,40px);background:#4ae0e033;border:2px solid rgba(74,224,224,.7);border-radius:2px;cursor:pointer;transition:all .2s ease;box-shadow:inset 1px 1px #ffffff26,0 0 20px #4ae0e04d,0 4px 16px #00000080}.wav-intro-start-btn:hover,.wav-intro-start-btn:focus{background:#4ae0e04d;border-color:#4ae0e0;box-shadow:inset 1px 1px #fff3,0 0 30px #4ae0e080,0 4px 20px #0009}.wav-intro-start-btn:focus-visible{outline:2px solid #4ae0e0;outline-offset:2px}.wav-intro-start-text{font-family:VT323,Courier New,monospace;font-size:clamp(14px,2.5vw,20px);color:#4ae0e0;letter-spacing:.15em;text-shadow:0 0 12px rgba(74,224,224,.7);animation:wav-pulse-start 1.5s ease-in-out infinite}@keyframes wav-pulse-start{0%,to{opacity:.8}50%{opacity:1}}.wav-intro-tech{font-family:VT323,Courier New,monospace;font-size:clamp(12px,1.9vw,15px);color:#ffffff80;letter-spacing:.2em;margin:0;text-shadow:0 1px 4px rgba(0,0,0,.8)}@media(max-width:600px){.wav-intro-crt[data-mode=poster] .wav-intro-ui{padding:0 4% clamp(8px,2vh,12px);gap:6px;height:60%}.wav-intro-columns{grid-template-columns:1fr;gap:8px}.wav-intro-col-left{justify-self:center}.wav-intro-col-right{align-items:center;text-align:center;padding-left:0;border-left:none;padding-top:12px;border-top:1px solid rgba(74,224,224,.25)}.wav-intro-instructions{align-items:center}}@media(max-height:400px){.wav-intro-crt[data-mode=poster] .wav-intro-ui{padding:0 3% 8px;gap:4px;height:50%}.wav-intro-columns{gap:12px}.wav-intro-portrait{width:59px;height:59px}.wav-intro-instructions{flex-direction:row;flex-wrap:wrap;justify-content:center;gap:2px 12px}}@media(prefers-reduced-motion:reduce){.wav-intro-start-text{animation:none;opacity:1}}.wav-activation-prompt{position:fixed;bottom:24px;left:50%;transform:translate(-50%);display:flex;flex-direction:column;align-items:center;gap:8px;z-index:9999;padding:16px 24px;background:var(--bg);border-radius:12px;backdrop-filter:blur(12px);border:1px solid var(--border-subtle);transition:opacity .3s ease}.wav-activation-content{display:flex;flex-direction:column;align-items:center;gap:8px}.wav-activation-status{color:var(--text-dim);font-family:var(--font-mono, monospace);font-size:11px;text-transform:uppercase;letter-spacing:.05em}.wav-activation-btn{display:flex;align-items:center;gap:8px;padding:12px 24px;background:var(--border-subtle);border:1px solid var(--border-default);border-radius:8px;color:var(--fg);font-family:var(--font-mono, monospace);font-size:14px;cursor:pointer;transition:all .2s ease;backdrop-filter:blur(8px)}.wav-activation-btn:hover{background:var(--border-active);border-color:var(--accent-dim)}.wav-activation-btn:focus-visible{outline:2px solid var(--accent);outline-offset:2px}.wav-activation-btn:active{transform:scale(.98)}.wav-activation-icon{font-size:16px}.wav-activation-hint{color:var(--text-dim);font-family:var(--font-mono, monospace);font-size:12px;transition:opacity .3s ease}.wav-activation-hint.fading{opacity:0}.wav-activation-error{display:flex;flex-direction:column;align-items:center;gap:8px;padding:16px;background:var(--color-error-glow);border:1px solid var(--color-error);border-radius:8px;backdrop-filter:blur(8px)}.wav-activation-error-text{color:var(--color-error);font-family:var(--font-mono, monospace);font-size:13px;text-align:center;max-width:280px}.wav-activation-retry{padding:8px 16px;background:var(--border-subtle);border:1px solid var(--border-default);border-radius:6px;color:var(--fg);font-family:var(--font-mono, monospace);font-size:13px;cursor:pointer;transition:all .2s ease}.wav-activation-retry:hover{background:var(--border-active);border-color:var(--accent-dim)}.wav-activation-retry:focus-visible{outline:2px solid var(--accent);outline-offset:2px}.wav-activation-prompt.hidden,.wav-activation-content.hidden,.wav-activation-error.hidden{display:none}@media(prefers-reduced-motion:reduce){.wav-activation-prompt,.wav-activation-btn,.wav-activation-hint,.wav-activation-retry{transition:none}.wav-activation-btn:active{transform:none}}