/* Ludika: shared margins, identity and 30% transparent panels, across all views. */
:root{--ludika-width:1240px;--ludika-gutter:clamp(16px,4vw,48px);--media-accent:#1677ed;--media-deep:#115cb9;--media-soft:#e7f0fe;--panel-surface:rgba(255,255,255,.70)}
body[data-media=tv]{--media-accent:#078653;--media-deep:#05653e;--media-soft:#e1f3e9}
body[data-media=webinar]{--media-accent:#b95008;--media-deep:#913b04;--media-soft:#fff0df}
body[data-media=rooms]{--media-accent:#7c3acb;--media-deep:#5d249f;--media-soft:#efe5fb}
body[data-media]{margin:0;min-height:100svh;color:#101b2e}
body[data-media]>:is(header,main,footer){width:min(var(--ludika-width),calc(100% - var(--ludika-gutter)*2));max-width:var(--ludika-width);margin-inline:auto;min-width:0}
body[data-media]>header{padding:8px 0 0;display:flex;flex-direction:row;justify-content:flex-start;align-items:center;text-align:left}
.ludika-identity{display:flex;flex-direction:row;align-items:center;justify-content:flex-start;gap:16px;text-decoration:none;color:inherit;min-width:0;max-width:100%}
.ludika-logo{display:block;width:147px;height:98px;flex:none;object-fit:contain;border-radius:12px}
.ludika-medium{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:40px;padding:10px 16px;border:1px solid color-mix(in srgb,var(--media-accent) 35%,transparent);border-radius:12px;background:var(--media-soft);color:var(--media-deep);font-size:16px;font-weight:650;letter-spacing:1.6px;line-height:1.2;min-width:0;text-align:center;white-space:nowrap}
.ludika-medium::before{content:'';width:6px;height:6px;flex:none;border-radius:50%;background:var(--media-accent)}
body[data-media=media]>main>section{width:100%}
header .ludika-navigation{display:flex;flex-wrap:wrap;justify-content:center;align-items:center;gap:6px 12px;width:100%;margin:0}
header .ludika-navigation a{padding:9px 12px;border-radius:8px;color:#26344a;background:rgba(255,255,255,.7);font-size:11px;font-weight:600;line-height:1.5;text-decoration:none;white-space:nowrap}
header .ludika-navigation a[aria-current=page]{background:var(--media-soft);color:var(--media-deep);box-shadow:inset 0 -2px var(--media-accent)}
header .ludika-navigation a:hover{color:var(--media-deep);background:var(--media-soft)}
body[data-media]>main{padding:16px 0 32px;display:grid;justify-items:center;gap:24px}
body[data-media]>main>*{min-width:0;max-width:100%;margin-inline:auto}
body[data-media] :is(.player-card,.schedule-card,.channel-card,.panel,.intro-card,.join-card,.room,.director-console,.preview-card,.whiteboard){background:var(--panel-surface);border-color:rgba(255,255,255,.85);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px)}
body[data-media] :is(.player-card,.schedule-card,.channel-card,.lower-grid,.welcome,.room){width:100%;max-width:100%;margin-inline:auto}
body[data-media] .welcome{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,1fr);align-items:stretch;gap:24px}
body[data-media] :is(.intro-card,.join-card,.channel-card,.player-card,.schedule-card,.panel,.room){padding:clamp(20px,2.5vw,34px)}
body[data-media] .lower-grid{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,1fr);gap:24px}
body[data-media] .room-layout{grid-template-columns:minmax(0,1fr) 260px;gap:24px;align-items:start}
body[data-media] :is(.stage-wrap,.participants-panel,.intro-card,.join-card,.panel,.preview-card){min-width:0}
body[data-media] .signal-dot,body[data-media] .small-dot{background:var(--media-accent);box-shadow:0 0 0 4px var(--media-soft)}
body[data-media] :is(.primary,#start-button,#retry-button),body[data-media] .toolbar button[aria-pressed=true],body[data-media] .view-buttons button[aria-pressed=true],body[data-media] .focus-screen{background:var(--media-accent);color:white}
body[data-media] :is(.scene-buttons button,.preview-actions button,.workspace-bar button,.board-toolbar button,#participants button){background:var(--media-soft);color:var(--media-deep)}
body[data-media] .view-buttons button[aria-pressed=true]{background:var(--media-accent);color:white}
body[data-media] :is(.mode,.on-air .eyebrow,.schedule-row time,.event-icon,.avatar,.room-count strong){color:var(--media-deep)}
body[data-media] :is(.event-icon,.avatar){background:var(--media-soft)}
body[data-media] :is(button,a,input,select,[tabindex]):focus-visible{outline:3px solid var(--media-accent);outline-offset:3px}
body[data-media] input{accent-color:var(--media-accent)}
body[data-media] #playlist button[aria-current=true]{background:var(--media-soft);color:var(--media-deep)}
body[data-media]>footer{padding:0 0 24px;display:flex;justify-content:space-between;gap:12px;font-size:10px;line-height:1.6}
@media(max-width:900px){body[data-media] .room-layout{grid-template-columns:minmax(0,1fr)}body[data-media] .participants-panel{padding-top:18px}}
@media(max-width:760px){body[data-media] :is(.welcome,.lower-grid){grid-template-columns:minmax(0,1fr)}body[data-media] .welcome{max-width:620px}body[data-media] .welcome>*{width:100%}body[data-media]>header{padding-top:8px}.ludika-logo{width:126px;height:84px}.ludika-identity{gap:12px}.ludika-medium{font-size:14px;padding:8px 12px;min-height:36px;gap:7px;letter-spacing:1px}body[data-media]>main{padding-top:12px;gap:20px}body[data-media]>footer{flex-wrap:wrap}}