/* Modular boards extend the guild palette without changing library or mixer styles. */
.topbar{gap:12px}.sidebar-toggle{flex:none;display:flex;align-items:center;gap:6px}.breadcrumbs{min-width:0}.top-actions{margin-left:auto}
#app.sidebar-collapsed{grid-template-columns:minmax(0,1fr) 320px}#app.sidebar-collapsed.stage-collapsed{grid-template-columns:minmax(0,1fr)}
#app.sidebar-collapsed>.sidebar{display:none}
.scene-tools{display:flex;gap:8px;flex-wrap:wrap;flex:none}
.soundboard-layout.modular-board{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px;align-items:start}
.board-panel{min-width:0;background:#1b1c23;border:1px solid #48424a;border-radius:12px;overflow:hidden}
.panel-width-2{grid-column:span 2}.panel-width-3{grid-column:span 3}
.panel-header{display:flex;justify-content:space-between;gap:8px;align-items:center;padding:10px 12px;border-bottom:1px solid #48424a;min-height:52px}
.panel-header h3{display:flex;align-items:center;gap:7px;min-width:0;overflow-wrap:anywhere;margin:0;font-size:.76rem;letter-spacing:.04em;color:#dfc8a6}
.panel-header h3 span{font-size:.66rem;color:#b7adb7;font-weight:400}.panel-header .ui-icon{width:16px;height:16px;flex:none}
.panel-header>div{display:flex;flex:none;gap:2px;flex-wrap:wrap;max-width:110px;justify-content:flex-end}.panel-header button{min-height:30px;padding:5px 7px}
.panel-content{height:var(--panel-height,clamp(240px,calc(100dvh - 420px),650px));overflow:auto;overscroll-behavior:contain;padding:10px;display:grid;gap:10px;align-content:start;grid-auto-rows:max-content;scrollbar-width:thin;scrollbar-color:#776448 #1b1c23}
.panel-height-240 .panel-content{height:240px}.panel-height-360 .panel-content{height:360px}.panel-height-480 .panel-content{height:480px}.panel-height-640 .panel-content{height:640px}
.panel-grid .panel-content{grid-template-columns:repeat(auto-fill,minmax(min(145px,100%),1fr))}.panel-list .panel-content{grid-template-columns:minmax(0,1fr)}
.modular-board .sound-pad{background:var(--pad-surface);border-color:var(--pad-border,#856c40);box-shadow:inset 3px 0 var(--pad-accent)}
.color-amber{--pad-accent:#e3bd7b;--pad-surface:#3c3020;--pad-border:#997944}.color-copper{--pad-accent:#eab293;--pad-surface:#452d23;--pad-border:#9d654b}.color-sage{--pad-accent:#b5d3b5;--pad-surface:#293b2b;--pad-border:#638365}.color-arcane{--pad-accent:#d6b5ef;--pad-surface:#3d2c4a;--pad-border:#9267b0}.color-slate{--pad-accent:#c6d1e1;--pad-surface:#303947;--pad-border:#74849e}.color-ruby{--pad-accent:#ffaaa4;--pad-surface:#4d272a;--pad-border:#b66166}.color-rose{--pad-accent:#f4b5d4;--pad-surface:#482c3d;--pad-border:#a46587}.color-teal{--pad-accent:#a1e2d6;--pad-surface:#203e3a;--pad-border:#538b80}.color-ocean{--pad-accent:#acd8f5;--pad-surface:#243d50;--pad-border:#598cab}.color-indigo{--pad-accent:#c2beff;--pad-surface:#323052;--pad-border:#7a75b7}.color-lime{--pad-accent:#d5de99;--pad-surface:#393d24;--pad-border:#8b9453}.color-sand{--pad-accent:#ecd8b8;--pad-surface:#40372b;--pad-border:#988364}
.modular-board .pad-trigger:hover{background:#ffffff0c}.modular-board .sound-pad.is-playing{border-color:var(--pad-accent);box-shadow:inset 3px 0 var(--pad-accent),inset 0 0 0 1px var(--pad-accent)}
.modular-board .pad-state,.modular-board .pad-label small{color:#e1dce3}.modular-board .pad-note{color:#eee3d3}.modular-board .pad-actions,.modular-board .pad-organize{border-color:#ffffff20}.modular-board .pad-actions button{color:#f4edf5}
.panel-list .efeito .pad-trigger{flex-direction:row;align-items:center;min-height:52px;padding:12px;gap:10px}.panel-list .efeito .pad-symbol{width:24px;height:24px}.panel-list .efeito .pad-label strong{font-size:.83rem}
.panel-compact .pad-trigger,.panel-compact .efeito .pad-trigger{min-height:42px;padding:9px 11px;flex-direction:row;align-items:center;gap:8px}.panel-compact .pad-label strong{font-size:.78rem}.panel-compact .pad-symbol{width:20px;height:20px}.panel-compact .pad-label small{margin-top:2px}.panel-compact .pad-state{padding-bottom:5px;min-height:18px}.panel-compact .pad-actions{padding:2px 4px}.panel-compact .pad-actions button{font-size:.64rem;padding:3px 5px}.panel-compact .pad-note{margin-bottom:5px}
.hide-info .pad-label small{display:none}.hide-notes .pad-note{display:none}
@media(min-width:701px) and (max-width:1379px){#app.sidebar-collapsed{grid-template-columns:minmax(0,1fr)}#app.sidebar-collapsed .stage{grid-column:1}.modular-board .panel-header{padding:8px}.panel-header>div{max-width:72px}.panel-grid .panel-content{grid-template-columns:repeat(auto-fill,minmax(min(120px,100%),1fr))}}
@media(min-width:701px) and (max-width:1024px){.performance-bar{gap:9px;padding:10px}.view-boards:has(.performance-bar) .page-heading{margin-bottom:12px}.view-boards .heading-buttons{max-width:none}.scene-bar{margin-bottom:10px}.scene-heading p{display:none}.scene-heading{margin-bottom:10px}.panel-content{height:var(--panel-height,clamp(240px,calc(100dvh - 480px),600px))}.modular-board{gap:8px!important}}
@media(max-width:700px){#app.sidebar-collapsed,#app.sidebar-collapsed.stage-collapsed{display:block}.sidebar-toggle span{display:none}.topbar .breadcrumbs{display:none}.top-actions{gap:5px}.top-actions #syncState{display:none}.soundboard-layout.modular-board{grid-template-columns:minmax(0,1fr);gap:12px}.panel-width-2,.panel-width-3{grid-column:auto}.panel-content{height:240px}.panel-grid .panel-content{grid-template-columns:repeat(auto-fill,minmax(135px,1fr))}.panel-header>div{max-width:none}.scene-tools{width:100%}.modular-board .pad-actions button{min-height:36px}.sidebar-toggle{min-width:38px}.panel-header button{min-height:36px}}

.board-card-status .ui-icon{width:12px;height:12px;vertical-align:-2px}