/* Live viewer layouts. Tiles are never removed from the page when the layout changes (only restyled), so switching back never goes blank. */
.bar{display:flex;flex-wrap:wrap;gap:6px;align-items:center;margin-bottom:10px}
.bar .lbl{color:var(--mute);font-size:11px;letter-spacing:.14em;text-transform:uppercase;margin-right:4px}
.bar button{font:inherit;font-size:12px;border:1px solid var(--line);background:transparent;color:var(--fg,#dbe4ff);border-radius:var(--t-r1,4px);padding:5px 10px;cursor:pointer}
.bar button[aria-pressed=true]{border-color:#b44fff;color:#e0aaff}
.cams{display:grid;gap:8px;position:relative}
.cam{position:relative;background:#05070d;border:1px solid #2a3659;border-radius:var(--t-r2,6px);overflow:hidden;aspect-ratio:16/9;cursor:pointer;min-width:0}
.cam video{width:100%;height:100%;object-fit:contain;background:#000;display:block}
.cam .cap{position:absolute;left:8px;bottom:6px;font-size:12px;color:#fff;text-shadow:0 0 4px #000;pointer-events:none}
.cam .wait{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;color:#8a93b3;font-size:13px;pointer-events:none;text-align:center;padding:8px}
.cam[data-live=true] .wait{display:none}
.cam.sel{border-color:#b44fff}
/* focus: selected full width, the rest in a strip under it */
.cams.focus{grid-template-columns:repeat(auto-fit,minmax(130px,1fr))}
.cams.focus .cam.sel{grid-column:1/-1}
/* grid: all equal */
.cams.grid{grid-template-columns:repeat(auto-fit,minmax(260px,1fr))}
/* side: exactly two columns */
.cams.side{grid-template-columns:repeat(2,minmax(0,1fr))}
/* single: only the selected one */
.cams.single .cam:not(.sel){display:none}
/* pip: selected full, others small in the corner */
.cams.pip{display:block}
.cams.pip .cam.sel{width:100%}
.cams.pip .cam:not(.sel){position:absolute;right:8px;width:24%;min-width:96px;z-index:2}
.cams.pip .cam:not(.sel){top:calc(8px + var(--pi,0) * 25%)}
.log{height:240px;overflow-y:auto;background:#05070d;border:1px solid #2a3659;border-radius:var(--t-r2,6px);padding:8px 10px;font-size:13px}
.log .m{margin:0 0 6px;overflow-wrap:anywhere}.log .n{color:#7df9ff;margin-right:6px}.log .m.host .n{color:#ff5c8a}
#chatform{display:flex;gap:8px;margin-top:8px}#chatform input{flex:1;min-width:0;background:#0a0d17;border:1px solid #2a3659;border-radius:var(--t-r1,4px);color:#dbe4ff;padding:10px;font:inherit}