:root{color:#f5f7f4;background:#111713;font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif;font-size:13px;line-height:1.32}*{box-sizing:border-box}html,body,#app{width:100%;height:100%;overflow:hidden}body{margin:0;min-width:1024px;background:#111713}.app-shell{width:100%;height:100dvh;padding:12px;display:grid;grid-template-rows:clamp(72px,10dvh,112px) minmax(0,1fr) auto;gap:10px;overflow:hidden}.top-bar{min-height:0;display:grid;grid-template-columns:minmax(0,1fr) auto;gap:14px;align-items:stretch;border:1px solid #334039;border-radius:8px;background:#151d18;padding:10px 12px}.title-block{min-width:0;display:grid;align-content:center}.eyebrow,.label{margin:0;color:#9fb0a5;font-size:10px;text-transform:uppercase;letter-spacing:0;font-weight:550}h1,h2,p{overflow-wrap:anywhere}h1{margin:2px 0 0;font-size:18px;line-height:1.18;letter-spacing:0;max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}h2{margin:0;font-size:14px;line-height:1.2;letter-spacing:0}.title-meta{margin:2px 0 0;color:#bdc8c0;font-size:12px;font-weight:500;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.status-stack{display:grid;grid-auto-flow:column;grid-auto-columns:max-content;gap:8px;align-content:center;justify-content:end}.pill{display:inline-flex;align-items:center;justify-content:center;min-height:34px;padding:0 12px;border:1px solid #3c493f;border-radius:6px;color:#d9e1da;font-size:11px;font-weight:550;white-space:nowrap}.pill.good{background:#1f6f49;border-color:#3caa72}.pill.warn{background:#745516;border-color:#a67c22}.pill.neutral{background:#1b2520}.studio-layout{min-height:0;display:grid;grid-template-columns:minmax(104px,12%) minmax(0,1.08fr) minmax(0,.94fr) minmax(104px,12%);grid-template-rows:minmax(0,1fr) clamp(112px,17dvh,164px) clamp(58px,8dvh,76px);grid-template-areas:"left primary browser right" "left quick quick right" "bottom bottom bottom bottom";gap:10px;overflow:hidden}.studio-rail,.primary-surface,.browser-surface,.quick-surface,.bottom-band,.config-surface{min-width:0;min-height:0;border:1px solid #334039;border-radius:8px;background:#151d18}.studio-rail-left{grid-area:left}.studio-rail-right{grid-area:right;grid-template-rows:minmax(96px,1fr) minmax(156px,1.15fr) minmax(86px,.8fr) minmax(96px,1fr)}.studio-rail{padding:8px;display:grid;grid-auto-rows:minmax(72px,1fr);gap:8px;overflow:hidden}.primary-surface{grid-area:primary;padding:10px;display:grid;grid-template-rows:clamp(74px,13dvh,118px) auto auto minmax(0,1fr);gap:8px;overflow:hidden}.browser-surface{grid-area:browser;padding:10px;display:grid;grid-template-rows:auto auto auto minmax(0,1fr);gap:8px;overflow:hidden}.quick-surface{grid-area:quick;padding:8px 10px;display:grid;grid-template-rows:auto minmax(0,1fr);gap:8px;overflow:hidden}.bottom-band{grid-area:bottom;display:grid;grid-template-columns:minmax(260px,.8fr) minmax(0,1.6fr) minmax(120px,.35fr);gap:10px;align-items:stretch;padding:8px;overflow:hidden}.primary-clock,.primary-current,.rail-status{border:1px solid #2e3932;border-radius:6px;background:#101612;padding:10px}.primary-clock{display:grid;grid-template-columns:minmax(0,1fr) auto;grid-template-rows:auto 1fr;gap:4px 14px;align-items:end}.primary-clock .label{grid-column:1 / -1}.primary-clock strong{font-size:24px;line-height:1}.primary-clock span:last-child{color:#bdc8c0;font-size:13px;font-weight:500;white-space:nowrap}.primary-current{display:grid;gap:4px}.primary-current h2{font-size:15px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.primary-current span:last-child,.rail-status small{color:#bdc8c0;font-weight:500;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.rail-status{display:grid;gap:6px;align-content:center}.rail-status strong{font-size:15px;line-height:1}.rail-status.compact{min-height:70px}.rail-button,.button,.icon-button,.screen-button,.jingle-button,.media-result{border:1px solid #445349;border-radius:6px;background:#233027;color:#f5f7f4;font:inherit;font-weight:500}.button,.icon-button,.screen-button,.jingle-button{cursor:pointer}.rail-button{min-width:0;padding:8px;display:grid;align-content:center;justify-items:center;gap:6px;text-align:center}.rail-button span{font-size:11px}.rail-button small,.jingle-button small{color:#aebbb3;font-weight:500;text-transform:uppercase;letter-spacing:0}.placeholder:disabled{opacity:.7;cursor:default}.button:disabled,.icon-button:disabled,.screen-button:disabled,.jingle-button:disabled,.media-result:disabled{opacity:.45;cursor:not-allowed}.button{min-height:44px;padding:0 14px}.icon-button{min-height:34px;padding:0 8px;font-size:11px}.screen-button{min-height:42px;padding:0 14px;font-size:12px}.screen-button.active,.button.play{background:#1f6f49;border-color:#3caa72}.button.stop,.icon-button.danger,.icon-button.stop{background:#6a2c24;border-color:#a64a3f}.button.next{background:#745516;border-color:#a67c22}.button.refill{background:#224f68;border-color:#3c85a8}.button.add{background:#246345}.icon-button.add{background:#246345;border-color:#3caa72}.icon-button.cue{background:#224f68;border-color:#3c85a8}.button.error{background:#6a2c24;border-color:#a64a3f}.button.subtle{background:#1b2520}.transport-buttons{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}.transport-buttons.vertical{grid-template-columns:1fr;grid-auto-rows:minmax(42px,1fr);min-height:0}.media-header,.queue-header,.jingle-header,.config-header{min-width:0;display:flex;justify-content:space-between;align-items:center;gap:8px}.queue-actions,.bottom-nav-group{display:flex;gap:8px;align-items:center}.browser-tabs{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:6px}.browser-tabs span{min-height:32px;display:grid;place-items:center;border:1px solid #2e3932;border-radius:6px;background:#1b2520;color:#aebbb3;font-size:11px;font-weight:500}.media-search-form{display:grid;grid-template-columns:minmax(160px,1fr) 96px;gap:8px}.media-search-form input,.jingle-config-row input{min-height:42px;border:1px solid #3a473f;border-radius:6px;background:#101612;color:#f5f7f4;padding:0 12px;font:inherit}.media-results,.queue-list,.jingle-config-list,.alerts{min-height:0;overflow:auto}.media-results,.queue-list{display:grid;gap:6px;align-content:start}.media-result{min-height:50px;display:grid;grid-template-columns:minmax(0,1fr) auto;gap:8px;align-items:center;text-align:left;padding:8px 10px}.media-result.cue-active{background:#1c2a21;border-color:#3caa72}.media-result-main{min-width:0;display:grid;gap:2px}.media-result-actions{display:flex;gap:6px;align-items:center}.media-result-actions .icon-button{min-width:46px}.media-title,.queue-title{font-weight:500;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.media-meta,.queue-artist,.queue-state{color:#aebbb3;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.media-meta{font-size:11px}.queue-row{min-height:48px;display:grid;grid-template-columns:36px minmax(84px,1.5fr) minmax(48px,.6fr) 64px 48px 56px 48px;gap:6px;align-items:center;padding:6px 8px;border:1px solid #2e3932;border-radius:6px;background:#151d18}.queue-row>*{min-width:0}.queue-row.current-row{min-height:60px;background:#1c2a21;border-color:#3caa72}.queue-number{color:#57c98b;font-weight:500}.row-spacer{min-width:0}.queue-empty{min-height:58px;display:grid;place-items:center;border:1px dashed #39473f;border-radius:6px;color:#9fb0a5;text-align:center;padding:8px}.jingle-buttons{min-height:0;display:grid;grid-template-columns:repeat(8,minmax(96px,1fr));gap:8px;overflow:hidden}.jingle-button{min-width:0;min-height:0;display:grid;align-content:center;justify-items:center;gap:4px;padding:8px;text-align:center}.jingle-button span{max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:12px}.jingle-button.playing{background:#1f6f49;border-color:#3caa72}.jingle-button.playing small{color:#f5f7f4}.bottom-alerts{min-width:0;min-height:0;overflow:hidden}.bottom-alerts .alerts{height:100%}.bottom-clock{display:grid;place-items:center;border:1px solid #2e3932;border-radius:6px;background:#101612;font-size:16px;font-weight:500}.studio-banner{margin-bottom:8px}.studio-banner .alert{min-height:44px;font-size:15px}.broadcast-good{color:#9fd7a8}.broadcast-warn{color:#f0c27a}.broadcast-neutral{color:#9fb0a5}.alerts{display:grid;gap:6px}.alert{min-height:38px;border-radius:6px;padding:8px 10px;background:#1c261f;color:#d7e0da;border:1px solid #38453d;font-weight:500}.alert.warn{background:#4f3c15}.alert.critical{background:#6a2c24}.alert.quiet{color:#9fb0a5}.config-grid{min-height:0;display:grid;grid-template-columns:minmax(420px,1.2fr) minmax(320px,.8fr);gap:12px;align-items:stretch;overflow:hidden}.config-surface{padding:14px;display:grid;grid-template-rows:auto minmax(0,1fr) auto;gap:10px;overflow:hidden}.jingle-config-form{display:grid;grid-template-rows:auto auto;align-content:start;gap:10px;min-height:0}.jingle-config-list{display:grid;gap:8px;align-content:start}.jingle-config-row{display:grid;grid-template-columns:minmax(90px,.7fr) minmax(140px,1fr) minmax(220px,1.6fr) minmax(120px,1fr) 96px;gap:8px}.config-spacer{min-height:42px}.scan-status{display:grid;gap:10px;align-content:start;min-height:0;overflow:auto}.scan-status strong{font-size:13px;overflow-wrap:anywhere}.scan-status span{color:#bdc8c0}.scan-errors{display:grid;gap:6px;color:#f2d2ca}@media(max-width:1180px){body{min-width:900px}.app-shell{padding:8px;gap:8px}.studio-layout{grid-template-columns:88px minmax(0,1.05fr) minmax(0,.9fr) 88px;gap:8px}.studio-rail{padding:6px;gap:6px}.queue-row{grid-template-columns:34px minmax(76px,1.5fr) minmax(44px,.55fr) 58px 44px 52px 44px}.jingle-buttons{grid-template-columns:repeat(6,minmax(86px,1fr))}}