:root{color-scheme:dark;font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;background:#0b0d10;color:#f4f6f8}
*{box-sizing:border-box}body{margin:0;min-height:100vh;background:#0b0d10}button,input{font:inherit}button{border:0;border-radius:10px;padding:10px 16px;background:#f4f6f8;color:#0b0d10;font-weight:700;cursor:pointer}button:disabled{opacity:.45;cursor:not-allowed}button.ghost{background:transparent;color:#f4f6f8;border:1px solid #343a42}button.danger{color:#ffb1b1;border-color:#713a3a}input{width:100%;border:1px solid #343a42;border-radius:10px;background:#14181d;color:#f4f6f8;padding:11px 12px}h1,h2,p{margin-top:0}.shell{width:min(1080px,calc(100% - 32px));margin:0 auto;padding:28px 0 56px}.topbar,.section-title,.viewer-header,.viewer-actions{display:flex;align-items:center;justify-content:space-between;gap:16px}.panel{background:#12161b;border:1px solid #252b33;border-radius:16px;padding:20px}.narrow{max-width:440px;margin:56px auto}.stack{display:grid;gap:14px}.stack label{display:grid;gap:7px;color:#cbd1d8}.inline-form{display:flex;gap:10px;align-items:center;width:min(540px,100%)}.create-row{display:flex;justify-content:space-between;gap:22px;align-items:end}.rooms-section{margin-top:28px}.rooms{display:grid;gap:14px}.room-card{background:#12161b;border:1px solid #252b33;border-radius:16px;padding:18px}.room-head,.room-meta,.room-actions{display:flex;align-items:center;gap:12px;flex-wrap:wrap}.room-head{justify-content:space-between}.room-meta{color:#98a2ad;font-size:14px;margin:9px 0 14px}.room-actions{margin-top:14px}.viewer-link{display:flex;gap:8px;align-items:center;background:#0c0f13;border:1px solid #252b33;border-radius:10px;padding:8px 10px}.viewer-link code{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;flex:1}.status-dot{width:9px;height:9px;border-radius:50%;background:#59616b;display:inline-block}.status-dot.live{background:#4ade80}.muted{color:#98a2ad}.error{color:#ff9d9d;min-height:1.2em}.hidden{display:none!important}.viewer-body{background:#050607}.viewer-shell{min-height:100vh;display:grid;grid-template-rows:auto 1fr auto;gap:14px;padding:18px}.brand{font-size:14px;color:#98a2ad;letter-spacing:.08em;text-transform:uppercase}.room-title{font-size:20px;font-weight:700;margin-top:3px}.badge{font-size:12px;border-radius:999px;padding:7px 10px;background:#282e36;color:#c4cad1}.badge.live{background:#143a25;color:#83efad}.video-wrap{position:relative;display:grid;place-items:center;background:#000;border-radius:14px;overflow:hidden;min-height:0}video{width:100%;height:100%;max-height:calc(100vh - 150px);object-fit:contain;background:#000}.video-overlay{position:absolute;inset:0;display:grid;place-content:center;justify-items:center;gap:10px;background:rgba(0,0,0,.62)}.video-overlay p{margin:0;color:#d6dbe0}.viewer-actions{min-height:42px}@media(max-width:700px){.create-row{align-items:stretch;flex-direction:column}.inline-form{flex-direction:column;align-items:stretch}.shell{width:min(100% - 20px,1080px);padding-top:18px}}.cast-runtime{margin-top:14px;padding:12px;border:1px solid #252b33;border-radius:12px;background:#0c0f13}.cast-status{font-size:14px;font-weight:700;margin-bottom:10px}.cast-status.live{color:#83efad}.audio-monitor{display:grid;grid-template-columns:auto minmax(100px,1fr) 92px;gap:10px;align-items:center}.audio-label{font-size:13px;color:#cbd1d8}.audio-meter{height:10px;border-radius:999px;background:#252b33;overflow:hidden}.audio-meter-fill{height:100%;width:0%;background:#d6dbe0;transition:width .08s linear}.audio-level-text{font-variant-numeric:tabular-nums;text-align:right;font-size:12px;color:#cbd1d8}.audio-level-text.no-audio{color:#ff9d9d}.cast-detail{font-size:12px;margin-top:8px}@media(max-width:700px){.audio-monitor{grid-template-columns:auto 1fr}.audio-level-text{grid-column:2;text-align:left}}

/* Cast source VU meter — same visual grammar as Live Translator */
.cast-vu-panel{margin-top:12px}
.cast-vu-readout{display:grid;grid-template-columns:1fr auto auto;align-items:center;gap:10px;margin-bottom:6px;font-size:.72rem;font-weight:850;letter-spacing:.05em;color:#aab2bb}
.cast-vu-title{color:#cbd1d8}
.cast-vu-db{font-variant-numeric:tabular-nums;color:#dce1e6}
.cast-vu-clip{color:#ff7d7d;font-weight:900}
.cast-vu-meter{position:relative;height:14px;border-radius:5px;overflow:hidden;background:repeating-linear-gradient(90deg,#252b33 0,#252b33 calc(5% - 2px),#12161b calc(5% - 2px),#12161b 5%)}
.cast-vu-fill{position:absolute;inset:0;width:100%;background:linear-gradient(90deg,#1a8a4a 0%,#1a8a4a 80%,#c88408 80%,#c88408 90%,#c93737 90%,#c93737 100%);clip-path:inset(0 100% 0 0);transition:clip-path .04s linear}
.cast-vu-peak{position:absolute;top:0;bottom:0;left:0;width:2px;background:#f4f6f8;transform:translateX(-1px);transition:left .04s linear}
.cast-vu-scale{display:flex;justify-content:space-between;margin-top:4px;color:#69737e;font-size:.62rem;font-variant-numeric:tabular-nums}

.app-version{margin:2px 0 4px;font-size:.68rem;line-height:1.25;color:#69737e;font-weight:650;letter-spacing:.025em}
.viewer-header .app-version{margin-top:2px}


/* YouTube Relay */
.relay-top-actions{display:flex;gap:.65rem;align-items:center}
.ghost-link,.button-link{display:inline-flex;align-items:center;justify-content:center;text-decoration:none;border:1px solid var(--line,#d7d7d7);border-radius:.65rem;padding:.62rem .9rem;color:inherit;background:transparent}
.relay-create{display:grid;gap:1rem}
.relay-form{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:.75rem}
.relay-form input{min-width:0}
.relay-card{display:grid;gap:.9rem}
.relay-card-head{display:flex;justify-content:space-between;gap:1rem;align-items:flex-start}
.relay-detail{display:grid;grid-template-columns:minmax(0,2fr) minmax(10rem,1fr) minmax(6rem,.5fr);gap:.9rem;padding:.8rem 0;border-top:1px solid var(--line,#dedede);border-bottom:1px solid var(--line,#dedede)}
.relay-detail>div{min-width:0;overflow-wrap:anywhere}
.relay-link-row{overflow-wrap:anywhere}
.relay-link-row a{word-break:break-all}
.mono{font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,monospace;font-size:.9em}
.badge.live{font-weight:700}
@media(max-width:720px){
  .relay-form{grid-template-columns:1fr}
  .relay-detail{grid-template-columns:1fr}
  .relay-card-head{align-items:center}
}

.relay-title-row{display:flex;align-items:baseline;gap:.45rem;flex-wrap:wrap}
.relay-title-row h1,.relay-title-row .app-version{margin:0}

.relay-room-body{display:grid;grid-template-columns:minmax(0,1fr) 180px;gap:1rem;align-items:start}
.relay-room-main{min-width:0;display:grid;gap:.9rem}
.relay-room-source{margin:0}
.relay-qr{display:flex;align-items:center;justify-content:center;padding:.55rem;border:1px solid var(--line,#dedede);border-radius:.75rem;background:#fff}
.relay-qr img{display:block;width:160px;height:160px}
@media(max-width:720px){
  .relay-room-body{grid-template-columns:1fr}
  .relay-qr{justify-self:start}
}