.live-connect{display:grid;grid-template-columns:auto minmax(160px,1fr) auto auto;gap:14px;align-items:center;background:var(--panel);padding:22px;border:1px solid var(--line);border-radius:6px}.live-connect p{grid-column:1/-1;font-size:12px;color:var(--muted)}input{padding:10px;border:1px solid var(--line);border-radius:4px;background:#0b1521;color:var(--ink)}.live-connect .primary{width:auto;margin:0;border:0}.live-workspace{display:grid;grid-template-columns:minmax(0,1fr) 330px;gap:20px;margin-top:24px}.live-scene,.live-inspector{border:1px solid var(--line);border-radius:6px;overflow:hidden}.live-scene iframe{height:500px;display:block}.live-inspector{padding:22px;background:var(--panel)}.live-inspector p{font-size:12px;color:var(--muted);overflow-wrap:anywhere}.live-inspector pre{font:11px/1.6 ui-monospace;white-space:pre-wrap;overflow-wrap:anywhere;max-height:330px;overflow:auto}.live-inspector button{font-size:12px}#live-counts{font:11px ui-monospace;color:var(--muted)}#live-status{padding:12px 0;color:var(--accent)}#live-notes{display:flex;gap:8px;flex-wrap:wrap;margin-top:18px}#live-notes button{font-size:12px;text-align:left}#live-notes small{display:block;color:var(--muted)}#live-events li{padding:12px;font-size:12px;overflow-wrap:anywhere}#event-status{color:var(--muted)}button:disabled{opacity:.45;cursor:not-allowed}@media(max-width:950px){.live-workspace{grid-template-columns:1fr}.live-connect{grid-template-columns:1fr 1fr}.live-connect label,.live-connect input{grid-column:1/-1}.live-scene iframe{height:380px}.live-scene .transport{flex-wrap:wrap}}
/* Give the live graph the browser width; keep the replay exhibit unchanged. */
.live-main{max-width:none;padding-inline:clamp(16px,2vw,48px)}
.live-main .intro{padding:28px 0 20px}
.live-main h1{font-size:clamp(28px,2.6vw,42px);margin-bottom:12px}
.live-main .intro p:not(.eyebrow){max-width:900px}
.live-workspace{grid-template-columns:minmax(0,1fr) minmax(280px,320px);gap:16px}
.live-scene{min-width:0}
.live-scene iframe{height:clamp(560px,74vh,1200px)}
.live-scene .transport{flex-wrap:wrap}
.live-workspace.summary-hidden{grid-template-columns:minmax(0,1fr)}
.live-inspector[hidden]{display:none}
.live-inspector pre{max-height:55vh}
@media(max-width:950px){.live-workspace{grid-template-columns:minmax(0,1fr)}.live-scene iframe{height:clamp(380px,65svh,800px)}.live-connect{padding:16px;gap:10px}.live-main .intro{padding-top:20px}}
.live-section{border-top:1px solid var(--line);padding:22px 0}
.live-section>summary{font-size:18px;color:var(--ink);cursor:pointer;padding:8px 0}
.live-section>summary span{font-size:12px;color:var(--muted);margin-left:12px}
.live-section>p{font-size:12px;color:var(--muted);max-width:1100px}
.archive-controls{display:flex;align-items:center;flex-wrap:wrap;gap:16px;margin:18px 0 10px;font-size:12px}
.archive-warning{border-left:2px solid #b6a177;padding-left:12px}
#live-events>details{margin-top:12px;border:1px solid var(--line);border-radius:5px;padding:12px 16px}
#live-events summary{cursor:pointer;overflow-wrap:anywhere}
#live-events time{display:block;color:var(--muted);font:11px/1.7 ui-monospace;margin-bottom:8px}
#live-events ul{padding-left:20px}#live-events ul li{border:0;padding:3px 0}
@media(max-width:600px){.live-section>summary span{display:block;margin-left:0}#live-events>details{padding:10px}}

#reader-content{white-space:pre-wrap;overflow-wrap:anywhere}#reader-list{display:flex;flex-wrap:wrap;gap:8px}#reader-list button{max-width:100%;overflow-wrap:anywhere}#reader-provenance{overflow-wrap:anywhere}
