.layer-info-banner{display:flex;align-items:center;gap:1rem;padding:1rem 1.5rem;background:#ffffff0d;border-radius:12px;margin-bottom:2rem;flex-wrap:wrap}.layer-info-banner .info-text{color:var(--text-secondary);font-size:.9rem;margin-left:auto}.knob-showcase{display:flex;gap:2rem;flex-wrap:wrap;padding:1.5rem;background:#0000004d;border-radius:12px;min-height:140px;align-items:center;justify-content:center}.large-knob-section{margin:3rem 0;padding:2rem;background:var(--bg-card);border-radius:16px;border:1px solid rgba(255,255,255,.1)}.large-knob-section h2{color:var(--accent-secondary);margin-bottom:.5rem}.large-knob-section>.description{color:var(--text-secondary);margin-bottom:1.5rem}.large-knob-container{display:flex;flex-direction:column;align-items:center;gap:2rem}.layer-toggles{display:flex;gap:1rem;flex-wrap:wrap;padding:1rem;background:#0000004d;border-radius:8px}.layer-toggles label{display:flex;align-items:center;gap:.5rem;cursor:pointer}.layer-toggles input[type=checkbox]{width:18px;height:18px;accent-color:var(--accent-primary)}.large-knob-wrapper{width:200px;height:200px;position:relative;display:flex;align-items:center;justify-content:center}.knob-info{display:flex;gap:3rem}.knob-stat{display:flex;flex-direction:column;align-items:center;gap:.5rem}.stat-label{font-size:.8rem;color:var(--text-secondary);text-transform:uppercase;letter-spacing:1px}.stat-value{font-family:Courier New,monospace;font-size:2rem;color:var(--accent-primary);font-weight:700}.mixer-section{margin:3rem 0;padding:2rem;background:var(--bg-card);border-radius:16px;border:1px solid rgba(255,255,255,.1)}.mixer-section h2{color:var(--accent-secondary);margin-bottom:.5rem}.mixer-section>.description{color:var(--text-secondary);margin-bottom:1.5rem}.mixer-console{display:flex;gap:.5rem;overflow-x:auto;padding:1.5rem;background:linear-gradient(145deg,#1a1a2a,#0a0a15);border-radius:16px;box-shadow:inset 0 2px 10px #00000080,0 5px 20px #0000004d}.mixer-channel{display:flex;flex-direction:column;align-items:center;gap:.75rem;padding:1rem;background:#0000004d;border-radius:8px;min-width:80px}.channel-label{font-size:.7rem;color:var(--text-secondary);text-transform:uppercase;letter-spacing:1px}.channel-value{font-family:Courier New,monospace;font-size:.8rem;color:var(--accent-primary);background:#00000080;padding:.25rem .5rem;border-radius:4px}.channel-meter{width:8px;height:60px;background:#00000080;border-radius:4px;position:relative;overflow:hidden}.meter-fill{position:absolute;bottom:0;left:0;right:0;background:linear-gradient(to top,var(--accent-primary),var(--accent-warning),var(--accent-danger));transition:height .1s ease}.advanced-knobs-section{margin:3rem 0}.advanced-knobs-section h2{color:var(--accent-primary);margin-bottom:1.5rem;text-align:center}.vintage-knob{width:70px;height:70px;border-radius:50%;background:conic-gradient(from 180deg,#4a4a4a,#6a6a6a,#3a3a3a,#5a5a5a,#4a4a4a);position:relative;cursor:grab;box-shadow:0 3px 10px #00000080,inset 0 2px 5px #ffffff1a,inset 0 -2px 5px #0000004d}.vintage-knob:before{content:"";position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:30px;height:30px;border-radius:50%;background:radial-gradient(circle at 40% 40%,#5a5a5a,#2a2a2a);box-shadow:inset 0 2px 5px #00000080}.vintage-knob:after{content:"";position:absolute;top:8px;left:50%;transform:translate(-50%);width:3px;height:15px;background:#ddd;border-radius:2px}.led-ring-knob{width:80px;height:80px;position:relative}.led-ring{position:absolute;width:100%;height:100%;border-radius:50%}.led-dot{position:absolute;width:6px;height:6px;border-radius:50%;background:#333;box-shadow:inset 0 1px 2px #00000080}.led-dot.active{background:var(--accent-primary);box-shadow:0 0 10px var(--accent-primary)}.digital-encoder{display:flex;flex-direction:column;align-items:center;gap:.5rem}.encoder-display{font-family:Courier New,monospace;font-size:1.2rem;color:var(--accent-secondary);background:#00000080;padding:.25rem .75rem;border-radius:4px;border:1px solid rgba(0,170,255,.3)}.encoder-body{width:50px;height:50px;border-radius:50%;background:linear-gradient(145deg,#3a3a4a,#1a1a2a);position:relative;cursor:grab;border:2px solid #444}.encoder-notch{position:absolute;width:100%;height:100%;pointer-events:none}.encoder-notch:before{content:"";position:absolute;top:5px;left:50%;transform:translate(-50%);width:4px;height:8px;background:var(--accent-secondary);border-radius:2px}.illuminated-knob{width:70px;height:70px;position:relative}.illuminated-knob .glow-ring{position:absolute;top:-10px;left:-10px;width:90px;height:90px;border-radius:50%;background:radial-gradient(circle,rgba(0,255,136,.3),transparent 70%);animation:pulse 2s ease-in-out infinite}.illuminated-knob .knob-body{position:relative;width:100%;height:100%;border-radius:50%;background:linear-gradient(145deg,#3a3a4a,#1a1a2a);cursor:grab;z-index:1}.step-knob{width:60px;height:60px;position:relative}.step-markers{position:absolute;width:100%;height:100%}.step-marker{position:absolute;width:2px;height:8px;background:#555;transform-origin:center 30px;left:calc(50% - 1px)}.step-marker.active{background:var(--accent-primary);box-shadow:0 0 5px var(--accent-primary)}.step-knob-body{position:absolute;top:8px;left:8px;width:44px;height:44px;border-radius:50%;background:conic-gradient(from 180deg,#3a3a4a,#5a5a6a,#3a3a4a);cursor:grab}.step-knob-body:after{content:"";position:absolute;top:5px;left:50%;transform:translate(-50%);width:3px;height:12px;background:var(--accent-primary);border-radius:2px}.meter-knob{width:100px;height:100px;position:relative}.meter-arc{position:absolute;width:100%;height:100%}.meter-knob-body{position:absolute;top:20px;left:20px;width:60px;height:60px;border-radius:50%;background:linear-gradient(145deg,#3a3a4a,#1a1a2a);cursor:grab;z-index:1}.dual-knob{width:80px;height:80px;position:relative}.outer-ring{position:absolute;width:100%;height:100%;border-radius:50%;background:conic-gradient(from 180deg,#4a4a5a,#6a6a7a,#4a4a5a);cursor:grab}.outer-ring:after{content:"";position:absolute;top:5px;left:50%;transform:translate(-50%);width:4px;height:10px;background:var(--accent-secondary);border-radius:2px}.inner-knob{position:absolute;top:15px;left:15px;width:50px;height:50px;border-radius:50%;background:linear-gradient(145deg,#3a3a4a,#1a1a2a);cursor:grab;z-index:1}.inner-knob:after{content:"";position:absolute;top:8px;left:50%;transform:translate(-50%);width:3px;height:10px;background:var(--accent-primary);border-radius:2px}@media (max-width: 768px){.mixer-console{gap:.25rem}.mixer-channel{min-width:60px;padding:.75rem}.knob-info{gap:2rem}.stat-value{font-size:1.5rem}}
