:root {
  color-scheme: dark;
  --bg: #08090b;
  --panel: #111318;
  --panel-2: #171a20;
  --line: #2b2f37;
  --muted: #9298a4;
  --text: #f7f7f4;
  --red: #ff4b43;
  --red-dark: #b4201c;
  --amber: #f3bd4e;
  --cyan: #53d5df;
  font-family: "Lexend", ui-sans-serif, -apple-system, BlinkMacSystemFont, "SF Pro Display", "Helvetica Neue", sans-serif;
}

* { box-sizing: border-box; }
[hidden] { display: none !important; }

body {
  margin: 0;
  min-width: 320px;
  min-height: 100vh;
  background:
    radial-gradient(circle at 50% -20%, rgba(255, 75, 67, 0.09), transparent 36rem),
    var(--bg);
  color: var(--text);
}

button, input { font: inherit; }
button { color: inherit; }

.app-shell {
  width: min(1440px, 100%);
  min-height: 100vh;
  margin: 0 auto;
  padding: 0 28px 28px;
}

.topbar {
  position: sticky;
  top: 0;
  z-index: 30;
  min-height: 82px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  border-bottom: 1px solid var(--line);
  background: rgba(8,9,11,.96);
  backdrop-filter: blur(12px);
}

.brand-block, .topbar-status, .control-strip, .range-row, .segmented,
.timing-bar, .on-air-header, .on-air-meta, .on-air-live {
  display: flex;
  align-items: center;
}

.brand-logo { display: block; width: 165px; height: auto; padding: 4px 7px; border: 1px solid rgba(255,255,255,.72); border-radius: 6px; background: #f4f7fb; object-fit: contain; }
.brand-owner { margin-left: 10px; color: #777e89; font-size: .55rem; font-weight: 750; letter-spacing: .12em; white-space: nowrap; }

.eyebrow {
  margin: 0 0 3px;
  color: var(--muted);
  font-size: .72rem;
  font-weight: 800;
  letter-spacing: .18em;
}

h1, h2, p { margin-top: 0; }
h1 { margin-bottom: 0; font-size: 1.45rem; letter-spacing: .14em; }
h2 { margin-bottom: 0; font-size: 1.15rem; }
.legal-footer { padding: 18px 4px 0; color: #626975; font-size: .58rem; font-weight: 650; letter-spacing: .08em; text-align: right; }

.topbar-status { gap: 22px; }
.archive-button, .account-button { padding: 8px 11px; border: 1px solid #3a3e47; border-radius: 7px; background: #14171c; color: #d5d8de; font-size: .68rem; font-weight: 800; letter-spacing: .1em; cursor: pointer; }
.archive-button:hover, .account-button:hover { border-color: var(--cyan); color: white; }
.global-search-button kbd { margin-left: 5px; color: #858c97; font-size: .56rem; }
.account-button.connected { border-color: rgba(83,213,223,.55); color: var(--cyan); }
.audio-readiness { padding: 7px 9px; border: 1px solid #444a54; border-radius: 6px; color: #b9bec7; font-size: .62rem; font-weight: 850; letter-spacing: .08em; white-space: nowrap; }
.audio-readiness.ready { border-color: rgba(83,213,223,.48); background: rgba(83,213,223,.06); color: var(--cyan); }
.audio-readiness.loading { border-color: rgba(243,189,78,.45); color: var(--amber); }
.audio-readiness.error { border-color: rgba(255,75,67,.55); background: rgba(255,75,67,.06); color: #ff817b; }
.save-state { color: var(--cyan); font-size: .72rem; font-weight: 800; letter-spacing: .14em; }
#clock { box-sizing: content-box; flex: 0 0 8ch; width: 8ch; font-feature-settings: "tnum" 1; font-variant-numeric: tabular-nums; font-size: 1.15rem; font-weight: 700; text-align: right; white-space: nowrap; }

.control-strip {
  position: sticky;
  top: 82px;
  z-index: 29;
  align-items: stretch;
  gap: 0;
  margin: 22px 0;
  background: var(--panel);
  border: 1px solid var(--line);
  border-radius: 12px;
  overflow: hidden;
  box-shadow: 0 12px 28px rgba(0,0,0,.28);
}

.control-group {
  min-width: 190px;
  padding: 15px 18px;
  border-right: 1px solid var(--line);
}

.speed-control { flex: 1.45; }
.intro-control { flex: .55; }
.marker-control { flex: 1; }

.control-label-row { display: flex; justify-content: space-between; gap: 16px; }
.control-group label, .control-label { display: block; margin-bottom: 10px; color: #c7cbd2; font-size: .78rem; font-weight: 760; letter-spacing: .08em; text-transform: uppercase; }
.control-label-row output { color: var(--text); font-size: .85rem; font-weight: 720; }
.speed-readouts { display: flex; align-items: center; gap: 10px; margin-top: -5px; }
.speed-readouts > span { color: var(--cyan); font-size: .56rem; font-weight: 850; letter-spacing: .09em; white-space: nowrap; }
.speed-readouts button { padding: 5px 8px; border: 1px solid #424852; border-radius: 5px; background: #1b1e24; color: #dce0e5; font-size: .62rem; font-weight: 750; cursor: pointer; }
.speed-readouts button:hover { border-color: var(--cyan); color: white; }
.range-row { gap: 9px; }
.range-row > span { color: #6f7580; font-size: .6rem; font-weight: 800; }
input[type="range"] { flex: 1; accent-color: var(--red); }

.compact-number, .number-with-unit {
  border: 1px solid #3a3e47;
  background: #0c0e12;
  border-radius: 7px;
}
.compact-number { width: 58px; padding: 7px 5px; color: var(--text); text-align: center; }
.number-with-unit { display: flex; align-items: center; width: 160px; min-width: 160px; padding-right: 10px; }
.number-with-unit input { box-sizing: border-box; flex: 0 0 116px; min-width: 116px; width: 116px; padding: 8px 30px 8px 12px; border: 0; outline: 0; background: transparent; color: var(--text); font-size: 1.35rem; font-variant-numeric: tabular-nums; font-weight: 740; }
.number-with-unit span { flex: 0 0 auto; margin-left: 3px; color: var(--muted); font-size: .8rem; }

.segmented { width: fit-content; padding: 3px; background: #090a0d; border-radius: 7px; }
.segment, .place-button { border: 0; border-radius: 5px; background: transparent; cursor: pointer; }
.segment { padding: 7px 13px; color: var(--muted); font-size: .82rem; font-weight: 720; }
.segment.active { background: #30343c; color: var(--text); }
.place-button { margin-left: 10px; padding: 7px 10px; color: var(--cyan); font-size: .78rem; }
.place-button:disabled { opacity: 0; pointer-events: none; }

.on-air-button {
  min-width: 184px;
  border: 0;
  background: var(--red);
  color: #fff;
  font-size: 1rem;
  font-weight: 850;
  letter-spacing: .11em;
  cursor: pointer;
  transition: background .15s ease;
}
.on-air-button:hover { background: #ff615a; }
.on-air-button kbd { margin-left: 12px; padding: 3px 6px; border: 1px solid rgba(255,255,255,.3); border-radius: 4px; font-size: .68rem; font-weight: 600; }
.live-dot { display: inline-block; width: 8px; height: 8px; margin-right: 9px; border-radius: 50%; background: white; }

.workspace {
  min-width: 0;
  background: var(--panel);
  border: 1px solid var(--line);
  border-radius: 12px;
  overflow: hidden;
  box-shadow: 0 28px 80px rgba(0,0,0,.3);
}
.work-layout { display: grid; grid-template-columns: 330px minmax(0, 1fr); gap: 18px; align-items: start; }
.rundown-panel { position: sticky; top: 18px; overflow: hidden; background: var(--panel); border: 1px solid var(--line); border-radius: 12px; }
.rundown-heading { display: flex; align-items: center; justify-content: space-between; padding: 18px; border-bottom: 1px solid var(--line); }
.rundown-heading h2 { font-size: 1rem; }
.rundown-title, .rundown-date { display: block; max-width: 230px; padding: 0; border: 0; outline: 0; background: transparent; color: var(--text); }
.rundown-title { width: 100%; font-size: 1rem; font-weight: 750; }
.rundown-date { margin-top: 5px; color: var(--muted); font-size: .68rem; font-weight: 650; color-scheme: dark; }
.rundown-current-hint { display: block; max-width: 190px; margin-top: 6px; color: #666d78; font-size: .55rem; line-height: 1.35; }
.rundown-title:focus, .rundown-date:focus { box-shadow: 0 2px 0 var(--red); }
.add-item-button { width: 36px; height: 36px; border: 1px solid #414650; border-radius: 8px; background: #202329; color: var(--text); font-size: 1.35rem; cursor: pointer; }
.add-item-button:hover { border-color: var(--red); }
.rundown-summary { display: flex; align-items: center; justify-content: space-between; padding: 11px 16px; border-bottom: 1px solid var(--line); color: var(--muted); font-size: .68rem; font-weight: 800; letter-spacing: .1em; }
.rundown-summary strong { color: var(--text); font-size: .85rem; font-variant-numeric: tabular-nums; }
.rundown-save-row { display: grid; grid-template-columns: minmax(0, 1fr); gap: 7px; align-items: center; padding: 10px 14px; border-bottom: 1px solid var(--line); background: #111319; }
.rundown-save-row button[hidden] { display: none; }
.rundown-save-row button { padding: 8px 10px; border: 1px solid rgba(61,210,225,.55); border-radius: 6px; background: rgba(61,210,225,.08); color: var(--cyan); font-size: .7rem; font-weight: 800; cursor: pointer; }
.rundown-save-row button:hover { border-color: var(--cyan); color: white; }
.rundown-save-row button:disabled { opacity: .55; cursor: wait; }
.rundown-save-row .new-rundown-button { border-color: rgba(243,189,78,.48); background: rgba(243,189,78,.07); color: var(--amber); }
.rundown-save-row .new-rundown-button:hover { border-color: var(--amber); color: white; }
.rundown-save-row span { color: #7f8793; font-size: .6rem; line-height: 1.35; text-align: left; }
.template-controls { padding: 12px 14px 14px; border-bottom: 1px solid var(--line); background: #0d0f13; }
.template-controls label { display: block; margin-bottom: 7px; color: var(--muted); font-size: .62rem; font-weight: 800; letter-spacing: .12em; }
.template-row { display: grid; grid-template-columns: minmax(0, 1fr) auto auto; gap: 6px; }
.template-row select, .template-row button, .save-template-button { min-width: 0; border: 1px solid #3a3e47; border-radius: 6px; background: #171a20; color: var(--text); font-size: .7rem; }
.template-row select { width: 100%; padding: 7px 8px; }
.template-row button { padding: 7px 9px; cursor: pointer; }
.template-row button:disabled { opacity: .35; cursor: default; }
.template-row .delete-template-button { color: #ff9a95; }
.template-row .delete-template-button:not(:disabled):hover { border-color: var(--red); color: white; }
.save-template-button { width: 100%; margin-top: 7px; padding: 7px 9px; color: var(--cyan); cursor: pointer; }
.save-template-button:hover, .template-row button:not(:disabled):hover { border-color: #626977; }
.template-save-form { display: grid; grid-template-columns: minmax(0, 1fr) auto auto; gap: 5px; margin-top: 7px; }
.template-save-form[hidden] { display: none; }
.template-save-form input, .template-save-form button { min-width: 0; padding: 7px 8px; border: 1px solid #3a3e47; border-radius: 6px; background: #171a20; color: var(--text); font-size: .7rem; }
.template-save-form input:focus { border-color: var(--cyan); outline: 0; }
.template-save-form button { cursor: pointer; }
.template-save-form button:first-of-type { color: var(--cyan); }
.rundown-list { max-height: calc(100vh - 310px); margin: 0; padding: 8px; overflow-y: auto; list-style: none; }
.rundown-item { display: grid; grid-template-columns: 24px minmax(0, 1fr) auto; gap: 7px; align-items: center; margin-bottom: 5px; padding: 9px 7px; border: 1px solid transparent; border-radius: 8px; color: var(--muted); }
.rundown-item.active { border-color: rgba(255,75,67,.5); background: rgba(255,75,67,.08); color: var(--text); }
.rundown-item.dragging { opacity: .45; }
.rundown-item.drag-over { border-color: var(--cyan); background: rgba(83,213,223,.08); box-shadow: inset 3px 0 0 var(--cyan); }
.rundown-item.empty-slot .drag-handle { cursor: default; opacity: .45; }
.drag-handle { color: #656b76; cursor: grab; font-size: 1rem; text-align: center; }
.rundown-open { min-width: 0; padding: 0; border: 0; background: transparent; text-align: left; cursor: pointer; }
.rundown-open span { overflow: hidden; text-overflow: ellipsis; }
.rundown-row-top { display: flex; align-items: baseline; gap: 8px; }
.rundown-row-top strong { min-width: 0; overflow: hidden; color: inherit; font-size: .8rem; text-overflow: ellipsis; white-space: nowrap; }
.rundown-duration { flex: 0 0 auto; margin-left: auto; color: var(--muted); font-size: .68rem; font-variant-numeric: tabular-nums; }
.rundown-headline { display: block; margin-top: 5px; overflow: hidden; color: #e9e9e5; font-size: .78rem; font-weight: 650; line-height: 1.35; text-overflow: ellipsis; white-space: nowrap; }
.rundown-headline.empty { color: #6f7580; font-style: italic; font-weight: 500; }
.rundown-meta { display: block; margin-top: 5px; overflow: hidden; color: #777e89; font-size: .6rem; font-weight: 700; letter-spacing: .06em; text-overflow: ellipsis; white-space: nowrap; }
.rundown-meta .intro-badge { color: #ff918c; }
.rundown-meta .empty-badge { color: var(--amber); }
.rundown-actions { display: flex; gap: 2px; opacity: 0; }
.rundown-item:hover .rundown-actions, .rundown-item:focus-within .rundown-actions { opacity: 1; }
.rundown-actions button { width: 26px; height: 26px; padding: 0; border: 0; border-radius: 5px; background: #292d34; color: #b8bdc7; cursor: pointer; }
.rundown-actions button:hover { color: white; background: #3a3f48; }
.rundown-actions button:disabled { opacity: .25; cursor: default; }
.rundown-tip { margin: 0; padding: 13px 16px; border-top: 1px solid var(--line); color: #6f7580; font-size: .68rem; line-height: 1.45; }
.editor-heading { display: grid; grid-template-columns: minmax(0, 1fr); align-items: start; gap: 12px; padding: 16px 26px; border-bottom: 1px solid var(--line); }
.script-identity { display: grid; grid-template-columns: minmax(90px, .45fr) minmax(240px, 1.55fr); gap: 20px; width: 100%; max-width: 760px; min-width: 0; }
.script-identity label { display: block; margin-bottom: 5px; color: var(--muted); font-size: .62rem; font-weight: 800; letter-spacing: .14em; }
.script-slot, .script-title { width: 100%; padding: 0; border: 0; outline: 0; background: transparent; color: var(--text); }
.script-slot { font-size: 1rem; font-weight: 740; }
.script-title { font-size: 1.12rem; font-weight: 750; }
.script-slot:focus, .script-title:focus { box-shadow: 0 2px 0 var(--red); }
.script-title::placeholder { color: #626873; font-weight: 500; }
.editor-help { grid-column: 1 / -1; max-width: none; margin: 0; color: #858c97; font-size: .68rem; }
.editor-actions { display: flex; align-items: center; justify-content: flex-start; gap: 8px; min-width: 0; flex-wrap: wrap; }
.history-actions { display: flex; flex: 0 0 auto; gap: 3px; padding-right: 5px; border-right: 1px solid #353a43; }
.history-actions button { width: 32px; height: 32px; padding: 0; border: 1px solid #3d434e; border-radius: 6px; background: #171a20; color: #d4d8df; font-size: 1.05rem; cursor: pointer; }
.history-actions button:hover:not(:disabled) { border-color: var(--cyan); color: white; }
.history-actions button:disabled { opacity: .28; cursor: default; }
.editor-size-control { display: flex; align-items: center; gap: 6px; min-height: 34px; padding: 3px 6px 3px 9px; border: 1px solid #3d434e; border-radius: 7px; background: #171a20; }
.editor-size-control span { color: #858c97; font-size: .55rem; font-weight: 850; letter-spacing: .1em; }
.editor-size-control button { width: 29px; height: 27px; padding: 0; border: 0; border-radius: 5px; background: #252a32; color: #e3e6ea; font-size: .68rem; font-weight: 800; cursor: pointer; }
.editor-size-control button:hover { background: #303640; color: white; }
.editor-size-control input { flex: 0 1 86px; width: 86px; min-width: 50px; }
.editor-size-control output { min-width: 42px; color: var(--cyan); font-size: .55rem; font-weight: 800; text-align: right; }
.add-note-button, .add-audio-button, .add-onedrive-button { flex: 0 0 auto; padding: 9px 12px; border: 1px solid #49505b; border-radius: 7px; background: #1a1d23; color: var(--cyan); font-size: .68rem; font-weight: 850; letter-spacing: .08em; cursor: pointer; }
.add-note-button:hover, .add-audio-button:hover, .add-onedrive-button:hover { border-color: var(--cyan); background: #20252b; }
.add-note-button { color: var(--amber); }
.add-note-button:hover { border-color: var(--amber); }
.add-onedrive-button { color: #b9bec7; }
.add-onedrive-button.configured { color: #79aef8; }
.quick-mode-panel { display: grid; grid-template-columns: minmax(190px, .7fr) minmax(0, 1.3fr); gap: 18px; align-items: center; padding: 11px 26px; border-bottom: 1px solid var(--line); background: #0d1014; }
.quick-mode-heading { min-width: 0; }
.quick-mode-heading > div > span { display: block; margin-bottom: 3px; color: var(--cyan); font-size: .55rem; font-weight: 900; letter-spacing: .14em; }
.quick-mode-heading strong { display: block; overflow: hidden; color: #f0f2f3; font-size: .76rem; text-overflow: ellipsis; white-space: nowrap; }
.quick-mode-heading p { margin: 4px 0 0; color: #777f8a; font-size: .58rem; line-height: 1.35; }
.quick-mode-controls { display: flex; align-items: center; justify-content: flex-end; gap: 7px; min-width: 0; flex-wrap: wrap; }
.quick-mode-tabs { display: flex; padding: 3px; border: 1px solid #353b44; border-radius: 7px; background: #080a0d; }
.quick-mode-tabs button { padding: 7px 9px; border: 0; border-radius: 5px; background: transparent; color: #858c97; font: inherit; font-size: .58rem; font-weight: 850; cursor: pointer; }
.quick-mode-tabs button small { margin-left: 3px; color: #68707b; font-size: .52rem; font-variant-numeric: tabular-nums; }
.quick-mode-tabs button.active { background: #2b3038; color: white; }
.quick-mode-tabs button.active small { color: var(--cyan); }
.quick-mode-tabs button:disabled { opacity: .3; cursor: default; }
.quick-mode-controls label { display: flex; align-items: center; gap: 5px; color: #858c97; font-size: .54rem; font-weight: 850; letter-spacing: .08em; white-space: nowrap; }
.quick-mode-controls input { width: 52px; padding: 7px 5px; border: 1px solid #3c434d; border-radius: 6px; background: #171a20; color: white; font: inherit; font-size: .68rem; font-variant-numeric: tabular-nums; text-align: center; }
.quick-mode-generate { padding: 9px 11px; border: 1px solid rgba(83,213,223,.55); border-radius: 7px; background: rgba(83,213,223,.08); color: var(--cyan); font: inherit; font-size: .62rem; font-weight: 900; letter-spacing: .07em; cursor: pointer; }
.quick-mode-generate:hover:not(:disabled) { background: rgba(83,213,223,.15); }
.quick-mode-generate:disabled { opacity: .4; cursor: default; }
.script-editor {
  --editor-scale: 1;
  width: min(100%, 50ch);
  min-height: 500px;
  max-height: calc(100vh - 330px);
  margin: 0 auto;
  overflow-y: auto;
  padding: 42px 24px;
  outline: 0;
  caret-color: var(--red);
  white-space: pre-wrap;
  color: #f2f2ee;
  font-family: "Lexend", ui-sans-serif, sans-serif;
  font-size: calc(clamp(1.3rem, 2vw, 1.78rem) * var(--editor-scale));
  font-weight: 500;
  line-height: 1.62;
}
.script-editor:focus { box-shadow: inset 4px 0 0 var(--red); }
.script-editor.audio-drop-ready { border-radius: 10px; background: rgba(83,213,223,.06); box-shadow: inset 0 0 0 3px var(--cyan), inset 4px 0 0 var(--cyan); }
.script-editor.audio-drop-ready::before { content: "SLIPP LYDFILEN HER"; position: sticky; top: 8px; z-index: 5; display: block; width: max-content; margin: -24px auto 10px; padding: 6px 10px; border-radius: 999px; background: var(--cyan); color: #071014; font-size: .6rem; font-weight: 850; letter-spacing: .1em; pointer-events: none; }

.script-note {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
  align-items: start;
  gap: 10px;
  width: calc(100% + 1.25rem);
  margin: 14px 0 14px -1.25rem;
  padding: 10px 11px;
  border-left: 3px solid rgba(243,189,78,.65);
  border-radius: 0 7px 7px 0;
  background: rgba(243,189,78,.075);
  color: #aaa69a;
  font-family: "Lexend", ui-sans-serif, sans-serif;
  font-size: .68em;
  font-weight: 450;
  line-height: 1.48;
  white-space: normal;
}
.script-note-label { padding-top: 3px; color: rgba(243,189,78,.78); font-size: .55rem; font-weight: 850; letter-spacing: .12em; user-select: none; }
.script-note-text { min-width: 0; min-height: 1.48em; outline: 0; white-space: pre-wrap; overflow-wrap: anywhere; }
.script-note-text:empty::before { content: "Skriv informasjon som ikke skal leses …"; color: #706e68; pointer-events: none; }
.script-note-text:focus { color: #d0cbc0; }
.remove-note { align-self: center; padding: 4px 7px; border: 1px solid #45423a; border-radius: 5px; background: #211f1b; color: #9e8e76; font: inherit; font-size: .55rem; cursor: pointer; }
.remove-note:hover { border-color: var(--amber); color: #e2c481; }

.start-marker {
  display: flex;
  align-items: center;
  gap: 13px;
  width: 100%;
  margin: 24px 0;
  color: var(--red);
  font-family: "Lexend", ui-sans-serif, sans-serif;
  font-size: .84rem;
  font-weight: 900;
  letter-spacing: .12em;
  line-height: 1;
  user-select: none;
}
.start-marker[draggable="true"] { cursor: grab; }
.start-marker[draggable="true"]:active { cursor: grabbing; }
.marker-line { flex: 1; height: 2px; background: var(--red); box-shadow: 0 0 12px rgba(255,75,67,.35); }
.marker-label, .marker-detail { white-space: nowrap; }
.marker-detail { color: #ffaca8; font-size: .7rem; }
.play-icon { margin-right: 3px; }

.audio-cue {
  display: flex;
  align-items: center;
  gap: 8px;
  width: min(100%, 42ch);
  margin: 11px auto;
  padding: 7px 9px;
  border: 1px solid #414751;
  border-left: 3px solid var(--cyan);
  border-radius: 6px;
  background: #181c22;
  color: #f4f5f2;
  font-family: "Lexend", ui-sans-serif, sans-serif;
  font-size: .65rem;
  font-weight: 700;
  line-height: 1.25;
  white-space: normal;
  user-select: none;
}
.audio-cue[draggable="true"] { cursor: grab; }
.audio-cue[draggable="true"]:active { cursor: grabbing; }
.audio-cue.dragging { opacity: .4; }
.audio-cue-drag { color: #747c87; font-size: .9rem; }
.audio-cue-icon { color: var(--cyan); font-size: .82rem; }
.audio-cue-info { min-width: 0; flex: 1; }
.audio-cue-label, .audio-cue-name { display: block; }
.audio-cue-label { margin-bottom: 2px; color: var(--muted); font-size: .48rem; font-weight: 850; letter-spacing: .1em; }
.audio-cue-name { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.audio-cue-duration { color: #aeb4bd; font-size: .56rem; font-variant-numeric: tabular-nums; white-space: nowrap; }
.audio-cue-readiness { padding: 4px 5px; border: 1px solid #4a515c; border-radius: 4px; color: #aeb4bd; font-size: .47rem; font-weight: 900; letter-spacing: .07em; white-space: nowrap; }
.audio-cue[data-readiness="ready"] .audio-cue-readiness { border-color: rgba(83,213,223,.42); color: var(--cyan); }
.audio-cue[data-readiness="checking"] .audio-cue-readiness { border-color: rgba(243,189,78,.45); color: var(--amber); }
.audio-cue[data-readiness="missing"], .audio-cue[data-readiness="error"] { border-color: rgba(255,75,67,.6); border-left-color: var(--red); }
.audio-cue[data-readiness="missing"] .audio-cue-readiness, .audio-cue[data-readiness="error"] .audio-cue-readiness { border-color: rgba(255,75,67,.55); color: #ff817b; }
.audio-cue-actions { display: flex; gap: 4px; }
.audio-cue-actions button { padding: 5px 7px; border: 1px solid #464d58; border-radius: 5px; background: #242932; color: white; font-size: .56rem; font-weight: 750; cursor: pointer; }
.audio-cue-actions button:hover { border-color: var(--cyan); }
.audio-cue-actions .remove-audio { color: #ff9c97; }
.audio-cue.playing { border-color: var(--red); border-left-color: var(--red); box-shadow: 0 0 24px rgba(255,75,67,.14); }
.audio-cue.playing .audio-cue-icon, .audio-cue.playing .audio-cue-label { color: var(--red); }
.audio-cue.played { opacity: .52; }
.audio-cue.next { border-color: rgba(83,213,223,.75); background: #192127; }
.audio-waveform { display: flex; align-items: center; gap: 1px; width: 128px; height: 28px; overflow: hidden; }
.audio-waveform i { flex: 1 1 1px; min-width: 1px; border-radius: 1px; background: #59636d; transition: background .08s linear, opacity .12s ease; }
.audio-waveform i.elapsed { background: var(--red); }
.audio-waveform.loading { opacity: .35; }
.audio-cue.next .audio-waveform i { background: #50858a; }
.audio-cue.played .audio-waveform i { background: #596067; }

.timing-bar { min-height: 84px; border-top: 1px solid var(--line); background: #0d0f13; }
.timing-primary, .timing-stat { height: 84px; padding: 16px 24px; border-right: 1px solid var(--line); }
.timing-primary { min-width: 190px; }
.timing-primary span, .timing-stat span { display: block; margin-bottom: 5px; color: var(--muted); font-size: .66rem; font-weight: 800; letter-spacing: .13em; }
.timing-primary strong, .timing-stat strong { font-variant-numeric: tabular-nums; font-size: 1.35rem; }
.timing-primary strong { color: var(--text); font-size: 1.75rem; }
.timing-primary small { display: block; margin-top: 2px; color: #747b86; font-size: .55rem; font-weight: 750; letter-spacing: .06em; white-space: nowrap; }
.accent-stat strong { color: var(--red); }
.fit-status { margin-left: auto; margin-right: 24px; padding: 9px 12px; border: 1px solid rgba(83,213,223,.35); border-radius: 6px; color: var(--cyan); font-size: .72rem; font-weight: 850; letter-spacing: .1em; }
.fit-status.warning { border-color: rgba(255,75,67,.4); color: var(--red); }
.fit-status.short { border-color: rgba(243,189,78,.4); color: var(--amber); }

.morning-prep { padding: 22px 24px 26px; border-top: 1px solid var(--line); background: #101217; }
.morning-prep-header { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; }
.morning-prep-header > div { flex: 1 1 420px; min-width: 0; margin-right: auto; }
.morning-prep-kicker { display: block; margin-bottom: 4px; color: var(--cyan); font-size: .56rem; font-weight: 850; letter-spacing: .16em; }
.morning-prep h2 { margin: 0; font-size: 1.05rem; }
.morning-prep-header p { margin: 5px 0 0; color: #7f8792; font-size: .68rem; line-height: 1.45; }
.morning-prep-header button { flex: 0 0 auto; padding: 9px 12px; border: 1px solid #48515c; border-radius: 7px; background: #1a1e24; color: var(--text); font: inherit; font-size: .68rem; font-weight: 800; cursor: pointer; }
.morning-prep-header button:hover { border-color: var(--cyan); }
.morning-prep-drop { margin-top: 16px; padding: 16px; border: 1px dashed #3e5960; border-radius: 8px; color: #7c969b; font-size: .7rem; font-weight: 700; text-align: center; cursor: pointer; transition: border-color .15s ease, background .15s ease, color .15s ease; }
.morning-prep-drop:hover, .morning-prep-drop:focus, .morning-prep-drop.drop-ready { border-color: var(--cyan); outline: 0; background: rgba(83,213,223,.07); color: var(--cyan); }
.morning-prep-list { display: grid; grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); gap: 10px; margin-top: 14px; }
.morning-prep-list:empty { display: none; }
.prep-card { display: grid; grid-template-rows: auto 1fr auto; min-width: 0; min-height: 176px; padding: 14px; border: 1px solid #343a43; border-radius: 9px; background: #171a20; }
.prep-card.dragging { opacity: .48; }
.prep-card.used { border-color: #29484c; background: #141b20; }
.prep-card h3 { margin: 0; color: #f0f1f3; font-size: .84rem; line-height: 1.35; }
.prep-card p { display: -webkit-box; overflow: hidden; margin: 10px 0 12px; color: #989fa9; font-size: .68rem; line-height: 1.5; -webkit-box-orient: vertical; -webkit-line-clamp: 4; }
.prep-card-footer { display: flex; align-items: center; gap: 8px; }
.prep-card-meta { margin-right: auto; color: #6f7782; font-size: .55rem; font-weight: 750; letter-spacing: .06em; }
.prep-card.used .prep-card-meta { color: var(--cyan); }
.prep-card button { padding: 7px 9px; border: 1px solid rgba(83,213,223,.45); border-radius: 6px; background: rgba(83,213,223,.06); color: var(--cyan); font: inherit; font-size: .6rem; font-weight: 850; cursor: pointer; }
.prep-card button:hover { background: rgba(83,213,223,.13); }
.prep-card .prep-card-edit { border-color: #48515c; background: #1a1e24; color: #c6cbd2; }
.prep-card .prep-card-remove { border-color: rgba(255,75,67,.42); background: rgba(255,75,67,.05); color: #ff9c97; }
.prep-card .prep-card-remove:hover { border-color: var(--red); background: rgba(255,75,67,.12); }
.prep-edit-open { overflow: hidden; }
.prep-edit-open::after { content: ""; position: fixed; inset: 0; z-index: 44; background: rgba(3,4,6,.82); backdrop-filter: blur(5px); }
.prep-card.editing { position: fixed; inset: 18px; z-index: 80; display: block; width: min(1380px, calc(100vw - 36px)); height: calc(100dvh - 36px); margin: auto; padding: 0; overflow: hidden; border-color: rgba(83,213,223,.5); background: #11151a; box-shadow: 0 24px 80px rgba(0,0,0,.62); cursor: default; }
.prep-edit-form { display: grid; grid-template-rows: auto auto auto minmax(280px, 1fr) auto auto; gap: 14px; height: 100%; padding: 22px 24px 18px; overflow: auto; }
.prep-edit-heading { display: flex; align-items: center; justify-content: space-between; gap: 20px; padding-bottom: 14px; border-bottom: 1px solid #303741; }
.prep-edit-heading span { display: block; margin-bottom: 4px; color: var(--cyan); font-size: .55rem; font-weight: 850; letter-spacing: .15em; }
.prep-edit-heading h3 { margin: 0; font-size: 1.3rem; }
.prep-edit-heading p { margin: 0; color: #78818c; font-size: .64rem; }
.prep-edit-form label { display: grid; gap: 6px; color: #7f8792; font-size: .55rem; font-weight: 850; letter-spacing: .1em; }
.prep-edit-form input, .prep-edit-form textarea { width: 100%; padding: 10px 11px; border: 1px solid #404751; border-radius: 7px; outline: 0; background: #0e1014; color: #f0f1f3; font: inherit; font-size: .72rem; line-height: 1.5; resize: vertical; }
.prep-edit-form [data-prep-field="title"] { min-height: 74px; font-size: 1.15rem; font-weight: 750; line-height: 1.35; resize: none; }
.prep-edit-form [data-prep-field="body"] { min-height: 100%; padding: 18px; font-size: clamp(.95rem, 1.35vw, 1.2rem); line-height: 1.65; }
.prep-edit-form [data-prep-field="sources"] { min-height: 86px; }
.prep-edit-form input:focus, .prep-edit-form textarea:focus { border-color: var(--cyan); box-shadow: 0 0 0 2px rgba(83,213,223,.12); }
.prep-edit-actions { position: sticky; bottom: -18px; display: flex; justify-content: flex-end; gap: 8px; margin: 0 -24px -18px; padding: 12px 24px 18px; border-top: 1px solid #303741; background: #11151a; }
.prep-edit-actions button:first-child { border-color: #48515c; background: #1a1e24; color: #c6cbd2; }
.prep-edit-actions button:last-child { padding-inline: 13px; background: rgba(83,213,223,.12); color: #dfffff; }
.script-editor.prep-drop-ready { border-radius: 10px; background: rgba(83,213,223,.06); box-shadow: inset 0 0 0 3px var(--cyan), inset 4px 0 0 var(--cyan); }
.script-editor.prep-drop-ready::before { content: "SLIPP SAKEN I STIKKET"; position: sticky; top: 8px; z-index: 5; display: block; width: max-content; margin: -24px auto 10px; padding: 6px 10px; border-radius: 999px; background: var(--cyan); color: #071014; font-size: .6rem; font-weight: 850; letter-spacing: .1em; pointer-events: none; }

/* Kompakt arbeidsflate: daglige handlinger først, sjeldne valg i menyer. */
.topbar { min-height: 72px; }
.topbar-status { gap: 12px; }
.control-strip { top: 72px; min-height: 68px; margin: 14px 0 18px; overflow: visible; }
.control-strip > *:first-child { border-radius: 11px 0 0 11px; }
.compact-settings { position: relative; flex: .62; min-width: 205px; border-right: 1px solid var(--line); }
.compact-settings > summary { display: flex; align-items: center; gap: 10px; height: 100%; min-height: 66px; padding: 11px 16px; cursor: pointer; list-style: none; }
.compact-settings > summary::-webkit-details-marker, .template-controls > summary::-webkit-details-marker, .audio-source-menu > summary::-webkit-details-marker, .morning-prep-expanded > summary::-webkit-details-marker, .archive-more > summary::-webkit-details-marker { display: none; }
.compact-settings > summary > span:first-child { color: #aeb4bd; font-size: .62rem; font-weight: 850; letter-spacing: .1em; }
.compact-settings > summary output { margin-left: auto; color: white; font-size: .82rem; font-weight: 800; white-space: nowrap; }
.settings-chevron { color: #777f8a; transition: transform .15s ease; }
.compact-settings[open] .settings-chevron { transform: rotate(180deg); }
.speed-settings-panel { position: absolute; z-index: 35; top: calc(100% + 7px); left: 0; width: min(480px, 86vw); padding: 15px; border: 1px solid #424852; border-radius: 9px; background: #15181e; box-shadow: 0 18px 46px rgba(0,0,0,.58); }
.speed-settings-panel .control-label-row { align-items: center; }
.speed-settings-panel .control-group label, .speed-settings-panel label { margin-bottom: 0; }
.speed-settings-panel .range-row { margin-top: 12px; }
.control-group { min-width: 170px; padding: 10px 16px; }
.intro-control { flex: .48; }
.intro-control label, .marker-control .control-label { margin-bottom: 5px; font-size: .62rem; }
.number-with-unit { width: 145px; min-width: 145px; }
.number-with-unit input { flex-basis: 102px; width: 102px; min-width: 102px; padding-block: 5px; font-size: 1.08rem; }
.marker-control { display: flex; flex: .72; flex-wrap: wrap; align-content: center; align-items: center; gap: 5px 10px; }
.marker-control .control-label { flex: 1 0 100%; }
.place-button { margin-left: 0; }
.control-strip > .audio-readiness { align-self: center; margin: 0 14px; }
.on-air-button { min-width: 174px; border-radius: 0 11px 11px 0; }

.add-item-button { width: auto; min-width: 76px; padding: 0 10px; font-size: .7rem; font-weight: 850; letter-spacing: .05em; }
.template-controls { padding: 0; }
.template-controls > summary { display: flex; align-items: center; justify-content: space-between; padding: 11px 14px; color: var(--muted); font-size: .61rem; font-weight: 850; letter-spacing: .11em; cursor: pointer; list-style: none; }
.template-controls[open] > summary { border-bottom: 1px solid var(--line); color: #d3d7dd; }
.template-controls[open] > summary span { transform: rotate(180deg); }
.template-controls-body { padding: 11px 14px 14px; }

.audio-source-menu { position: relative; flex: 0 0 auto; }
.audio-source-menu > summary { padding: 9px 12px; border: 1px solid #49505b; border-radius: 7px; background: #1a1d23; color: var(--cyan); font-size: .68rem; font-weight: 850; letter-spacing: .08em; cursor: pointer; list-style: none; }
.audio-source-menu[open] > summary { border-color: var(--cyan); }
.audio-source-menu > div { position: absolute; z-index: 20; top: calc(100% + 6px); right: 0; display: grid; gap: 5px; min-width: 225px; padding: 8px; border: 1px solid #444b55; border-radius: 8px; background: #171a20; box-shadow: 0 14px 36px rgba(0,0,0,.5); }
.audio-source-menu .add-audio-button, .audio-source-menu .add-onedrive-button { width: 100%; padding: 9px 10px; border: 0; background: transparent; text-align: left; }
.audio-source-menu > div > span { padding: 6px 10px; border-top: 1px solid #333943; color: #727a85; font-size: .58rem; line-height: 1.4; }

.morning-prep-summary { padding: 15px 22px; }
.morning-prep-summary .morning-prep-header > div { flex-basis: 300px; }
.morning-prep-expanded { margin-top: 10px; border-top: 1px solid #292e36; }
.morning-prep-expanded > summary { padding: 11px 2px 0; color: #7e8691; font-size: .62rem; font-weight: 800; cursor: pointer; list-style: none; }
.morning-prep-expanded[open] > summary { color: #b9bec7; }
.morning-prep-expanded-actions { display: flex; justify-content: flex-end; margin-top: 8px; }
.morning-prep-expanded-actions button { padding: 7px 9px; border: 1px solid rgba(255,75,67,.4); border-radius: 6px; background: rgba(255,75,67,.06); color: #ff9a95; font: inherit; font-size: .62rem; font-weight: 800; cursor: pointer; }
.story-edit-host { position: absolute; width: 0; height: 0; margin: 0; overflow: visible; border: 0; }
.story-edit-host > summary { display: none; }
.story-edit-host .morning-prep-list { display: block; margin: 0; }
.story-edit-host .prep-card:not(.editing) { display: none; }

.archive-more { position: relative; }
.archive-more > summary { display: grid; width: 38px; height: 34px; border: 1px solid #3a3e47; border-radius: 6px; background: #1b1e24; color: #b8bec7; cursor: pointer; list-style: none; place-items: center; }
.archive-more > div { position: absolute; z-index: 5; top: calc(100% + 5px); right: 0; display: grid; gap: 4px; min-width: 110px; padding: 6px; border: 1px solid #424852; border-radius: 7px; background: #181b21; box-shadow: 0 12px 30px rgba(0,0,0,.5); }
.archive-more > div button { width: 100%; text-align: left; }
.on-air-rundown { grid-template-rows: auto minmax(0, 1fr); }

.on-air-view {
  --on-air-scale: .8;
  position: fixed;
  inset: 0;
  width: 100dvw;
  height: 100dvh;
  overflow: hidden;
  z-index: 100;
  display: none;
  grid-template-rows: auto minmax(0, 1fr) auto auto;
  background: #050506;
}
.on-air-view.visible { display: grid; }
.on-air-open { overflow: hidden; }
.on-air-header { min-height: 78px; justify-content: space-between; padding: 0 34px; border-bottom: 1px solid #2b2c31; }
.on-air-live { color: var(--red); font-size: 1.05rem; font-weight: 900; letter-spacing: .13em; }
.on-air-live span { width: 12px; height: 12px; margin-right: 11px; border-radius: 50%; background: var(--red); box-shadow: 0 0 17px var(--red); animation: pulse 1.5s infinite; }
.on-air-brand { display: flex; align-items: center; gap: 8px; min-width: 0; }
.on-air-brand img { display: block; width: clamp(76px, 7vw, 104px); height: auto; padding: 2px 4px; border-radius: 4px; background: #f4f7fb; object-fit: contain; }
.on-air-brand span { color: #737a85; font-size: .44rem; font-weight: 800; letter-spacing: .11em; white-space: nowrap; }
.on-air-meta { gap: 30px; color: #c8cad0; font-variant-numeric: tabular-nums; font-weight: 700; }
.on-air-header button { padding: 9px 12px; border: 1px solid #3a3c42; border-radius: 7px; background: #15171b; cursor: pointer; }
.on-air-header kbd { margin-left: 7px; color: var(--muted); }
.on-air-size-control { display: flex; align-items: center; gap: 8px; }
.on-air-size-label { color: var(--muted); font-size: .68rem; font-weight: 800; letter-spacing: .12em; }
.on-air-size-control button { min-width: 38px; padding-inline: 8px; font-weight: 800; }
.on-air-size-control input { width: clamp(80px, 9vw, 140px); accent-color: var(--red); }
.on-air-size-control output { min-width: 42px; color: #c8cad0; font-size: .75rem; font-variant-numeric: tabular-nums; text-align: right; }
.on-air-stage { display: grid; grid-template-columns: minmax(220px, 260px) minmax(0, 1fr); min-width: 0; min-height: 0; overflow: hidden; }
.on-air-rundown { display: grid; grid-template-rows: auto minmax(0, 1fr) auto; min-height: 0; border-right: 1px solid #292c32; background: #0a0b0d; }
.on-air-rundown header { padding: 18px 16px 14px; border-bottom: 1px solid #292c32; }
.on-air-rundown header span, .on-air-rundown header small { display: block; color: var(--muted); font-size: .58rem; font-weight: 850; letter-spacing: .12em; }
.on-air-rundown header strong { display: block; margin: 6px 0 2px; color: white; font-size: 1.55rem; font-variant-numeric: tabular-nums; }
.on-air-rundown ol { margin: 0; padding: 8px; overflow-y: auto; list-style: none; }
.on-air-rundown li { margin-bottom: 5px; }
.on-air-rundown li button { display: grid; grid-template-columns: 30px minmax(0, 1fr); width: 100%; padding: 10px 9px; border: 1px solid transparent; border-radius: 7px; background: transparent; color: #8f959f; text-align: left; cursor: pointer; }
.on-air-rundown li button:hover { border-color: #424852; background: #15181d; color: white; }
.on-air-rundown li.active button { border-color: var(--red); background: rgba(255,75,67,.12); color: white; box-shadow: inset 3px 0 0 var(--red); }
.on-air-rundown li.completed button { color: #666d77; }
.on-air-rundown li.skipped button { color: #b89657; }
.live-row-status { grid-row: 1 / 3; align-self: center; color: #727985; font-size: .65rem; font-weight: 900; text-align: center; }
.active .live-row-status { color: var(--red); }
.completed .live-row-status { color: var(--cyan); }
.skipped .live-row-status { color: var(--amber); }
.live-row-copy { min-width: 0; }
.live-row-copy strong, .live-row-copy span { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.live-row-copy strong { color: inherit; font-size: .75rem; }
.live-row-copy span { margin-top: 3px; font-size: .62rem; }
.live-row-duration { grid-column: 2; margin-top: 5px; color: #707782; font-size: .57rem; font-variant-numeric: tabular-nums; }
.on-air-rundown > p { margin: 0; padding: 11px 14px; border-top: 1px solid #292c32; color: #676e78; font-size: .58rem; }
.on-air-rundown kbd { padding: 2px 4px; border: 1px solid #3d424a; border-radius: 3px; background: #17191e; color: #b7bbc2; }
.on-air-script { width: 100%; min-width: 0; overflow-x: hidden; overflow-y: auto; padding: 6vh 7vw 22vh; outline: 0; scroll-behavior: smooth; }
.on-air-copy {
  width: min(100%, 50ch);
  max-width: 100%;
  margin-inline: auto;
  overflow-wrap: break-word;
  white-space: pre-wrap;
  color: white;
  font-family: "Lexend", ui-sans-serif, sans-serif;
  font-size: calc(clamp(2.1rem, 3.7vw, 3.9rem) * var(--on-air-scale));
  font-weight: 600;
  line-height: 1.38;
  letter-spacing: -.025em;
}
.on-air-marker { position: relative; margin: 3vh 0; padding: 10px 0; font-size: clamp(.78rem, 1.15vw, 1.08rem); }
.on-air-marker .marker-line { height: 3px; }
.on-air-marker .marker-detail { font-size: .64em; }
.after-copy { color: #fff; }
.on-air-footer { display: flex; align-items: center; gap: 22px; min-height: 82px; padding: 9px 34px; border-top: 1px solid #2b2c31; background: #0b0c0e; color: var(--muted); }
.on-air-item-position { min-width: 130px; max-width: 280px; }
.on-air-item-position span, .on-air-item-position strong { display: block; }
.on-air-item-position span { margin-bottom: 3px; font-size: .65rem; font-weight: 800; letter-spacing: .12em; }
.on-air-item-position strong { overflow: hidden; color: white; font-size: .9rem; text-overflow: ellipsis; white-space: nowrap; }
.on-air-remaining { display: flex; align-items: baseline; gap: 12px; white-space: nowrap; }
.on-air-remaining strong { color: var(--red); font-size: 1.6rem; font-variant-numeric: tabular-nums; }
.on-air-audio { display: flex; align-items: center; gap: 8px; min-width: 0; margin-right: auto; padding-left: 20px; border-left: 1px solid #30333a; }
.on-air-audio-info { min-width: 145px; max-width: 260px; }
.on-air-audio-info span, .on-air-audio-info strong { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.on-air-audio-info span { margin-bottom: 3px; color: var(--cyan); font-size: .6rem; font-weight: 850; letter-spacing: .1em; }
.on-air-audio-info strong { color: white; font-size: .78rem; }
.on-air-audio-progress { display: grid; grid-template-columns: 62px 110px; gap: 8px; align-items: center; }
.on-air-audio-progress > strong { color: var(--red); font-size: 1.2rem; font-variant-numeric: tabular-nums; letter-spacing: -.04em; text-align: right; }
.audio-progress-track { display: block; width: 100%; height: 8px; overflow: hidden; border-radius: 999px; background: #31363e; box-shadow: inset 0 0 0 1px rgba(255,255,255,.04); }
.audio-progress-track i { display: block; width: 0; height: 100%; border-radius: inherit; background: var(--red); box-shadow: 0 0 12px rgba(255,75,67,.5); }
.on-air-audio button { padding: 10px 12px; border: 1px solid #46515b; border-radius: 7px; background: #182229; color: white; font-size: .72rem; font-weight: 800; cursor: pointer; white-space: nowrap; }
.on-air-audio button:first-of-type { border-color: var(--cyan); color: #eaffff; }
.on-air-audio button:disabled { opacity: .3; cursor: default; }
.on-air-audio kbd { margin-left: 5px; color: var(--cyan); font-size: .62rem; }
.on-air-audio.is-playing .on-air-audio-info span { color: var(--red); }
.on-air-audio.is-playing button:first-of-type { border-color: #4a4d54; color: #7e838d; }
.on-air-audio.is-playing button:last-of-type { border-color: var(--red); color: #ffb5b1; }
.on-air-audio.no-audio { flex: 0 1 auto; opacity: .62; }
.on-air-audio.no-audio .on-air-audio-progress, .on-air-audio.no-audio button { display: none; }
.on-air-script .audio-cue { width: min(100%, 34rem); margin-block: 2.5vh; padding: 10px 13px; border-width: 1px 1px 1px 5px; font-size: clamp(.68rem, .85vw, .86rem); cursor: pointer; transition: border-color .12s ease, background .12s ease, transform .12s ease; }
.on-air-script .audio-cue:hover, .on-air-script .audio-cue:focus-visible { border-color: var(--cyan); background: #1c272e; outline: 0; transform: translateY(-1px); }
.on-air-script .audio-cue-label { font-size: .58em; }
.on-air-script .audio-cue-duration { min-width: 44px; color: #d8dadd; font-size: .78em; font-variant-numeric: tabular-nums; text-align: right; }
.on-air-script .audio-cue.playing .audio-cue-duration { color: var(--red); font-size: .9em; font-weight: 850; }
.on-air-script .script-note { width: min(100%, 34rem); margin: 2.5vh 0 2.5vh -1.25rem; padding: 11px 13px; color: #96938b; font-size: clamp(.72rem, 1vw, .95rem); background: rgba(243,189,78,.06); }
.on-air-script .script-note-text:empty::before { content: "Tom note"; }
.next-shot { display: grid; grid-template-columns: auto minmax(0, 1fr) auto; gap: 16px; align-items: center; min-width: 0; padding: 8px 24px; border-top: 1px solid #282c32; background: #111318; color: #818894; }
.next-shot-label span, .next-shot-label small { display: block; }
.next-shot-label span { color: var(--amber); font-size: .57rem; font-weight: 900; letter-spacing: .14em; }
.next-shot-label small { margin-top: 3px; font-size: .42rem; font-weight: 750; letter-spacing: .07em; white-space: nowrap; }
.next-shot-items { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); min-width: 0; }
.next-shot-item { min-width: 0; padding: 0 12px; border-left: 1px solid #30343b; }
.next-shot-item span, .next-shot-item strong, .next-shot-item small { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.next-shot-item span { color: #737b86; font-size: .48rem; font-weight: 900; letter-spacing: .12em; }
.next-shot-item strong { margin-top: 2px; color: #d5d8dc; font-size: .66rem; }
.next-shot-item small { margin-top: 2px; color: #6f7680; font-size: .5rem; font-variant-numeric: tabular-nums; }
.next-shot-item.current span { color: var(--cyan); }
.next-shot-item.current strong { color: white; }
.on-air-quick-modes { display: flex; gap: 4px; }
.on-air-quick-modes button { padding: 7px 8px; border: 1px solid #3b414a; border-radius: 5px; background: #181b20; color: #8d949e; font: inherit; font-size: .5rem; font-weight: 850; cursor: pointer; white-space: nowrap; }
.on-air-quick-modes button.active { border-color: var(--cyan); color: white; background: rgba(83,213,223,.1); }
.on-air-quick-modes button:disabled { display: none; }
.on-air-quick-modes kbd { margin-right: 3px; color: var(--cyan); }
.on-air-item-navigation { display: flex; gap: 6px; }
.next-item-button, .previous-item-button, .retake-item-button { padding: 11px 12px; border: 1px solid #424751; border-radius: 7px; background: #1a1d22; color: white; font-size: .7rem; font-weight: 750; cursor: pointer; white-space: nowrap; }
.next-item-button:not(:disabled):hover, .previous-item-button:not(:disabled):hover, .retake-item-button:hover { border-color: var(--red); }
.next-item-button:disabled, .previous-item-button:disabled { opacity: .35; cursor: default; }
.retake-item-button { border-color: #58616d; color: #e4e7eb; }
.retake-item-button kbd { margin-left: 4px; color: var(--cyan); font-size: .58rem; }

.global-search-view { position: fixed; inset: 0; z-index: 58; display: none; place-items: center; padding: 28px; background: rgba(3,4,6,.88); backdrop-filter: blur(12px); }
.global-search-view.visible { display: grid; }
.global-search-dialog { display: grid; grid-template-rows: auto auto minmax(0,1fr); width: min(980px,100%); height: min(780px,92dvh); overflow: hidden; border: 1px solid #3b424c; border-radius: 14px; background: #101217; box-shadow: 0 32px 110px rgba(0,0,0,.72); }
.global-search-header { display: flex; align-items: center; justify-content: space-between; gap: 18px; padding: 20px 24px; border-bottom: 1px solid var(--line); }
.global-search-header h2 { margin-top: 3px; font-size: 1.35rem; }
.global-search-header > button { width: 38px; height: 38px; border: 1px solid #3d434c; border-radius: 8px; background: #191c22; color: white; font-size: 1.35rem; cursor: pointer; }
.global-search-toolbar { display: grid; grid-template-columns: minmax(0,1fr) auto; gap: 12px; align-items: center; padding: 15px 24px; border-bottom: 1px solid var(--line); }
.global-search-toolbar input { width: 100%; padding: 12px 13px; border: 1px solid #414852; border-radius: 8px; outline: 0; background: #181b21; color: white; font: inherit; font-size: .8rem; }
.global-search-toolbar input:focus { border-color: var(--cyan); }
.global-search-toolbar span { color: #7d8590; font-size: .62rem; white-space: nowrap; }
.global-search-results { padding: 8px 24px 26px; overflow-y: auto; }
.global-search-empty { padding: 70px 20px; color: #777f89; text-align: center; }
.global-search-section { margin-top: 20px; }
.global-search-section > h3 { position: sticky; top: -8px; z-index: 2; margin: 0; padding: 12px 2px 9px; background: #101217; color: var(--cyan); font-size: .62rem; letter-spacing: .14em; }
.global-search-result { display: grid; grid-template-columns: minmax(0,1fr) auto; gap: 16px; align-items: center; padding: 14px 4px; border-bottom: 1px solid #2b3038; }
.global-search-result-copy { min-width: 0; }
.global-search-result-copy strong, .global-search-result-copy p, .global-search-result-copy small { display: block; }
.global-search-result-copy strong { overflow: hidden; color: #f0f2f4; font-size: .86rem; text-overflow: ellipsis; white-space: nowrap; }
.global-search-result-copy p { display: -webkit-box; overflow: hidden; margin: 6px 0 0; color: #9098a3; font-size: .68rem; line-height: 1.45; -webkit-box-orient: vertical; -webkit-line-clamp: 2; white-space: pre-wrap; }
.global-search-result-copy small { margin-top: 7px; color: #69727d; font-size: .56rem; }
.global-search-result > button { padding: 9px 11px; border: 1px solid rgba(83,213,223,.52); border-radius: 7px; background: rgba(83,213,223,.06); color: var(--cyan); font: inherit; font-size: .65rem; font-weight: 850; cursor: pointer; white-space: nowrap; }
.global-search-result > button:hover { background: rgba(83,213,223,.12); }
.global-search-result > button:disabled { opacity: .45; cursor: wait; }

.archive-view { position: fixed; inset: 0; z-index: 30; display: none; place-items: center; padding: 28px; background: rgba(3,4,6,.82); backdrop-filter: blur(10px); }
.archive-view.visible { display: grid; }
.archive-dialog { display: grid; grid-template-rows: auto auto minmax(0, 1fr); width: min(920px, 100%); height: min(760px, 92vh); overflow: hidden; border: 1px solid #383d47; border-radius: 14px; background: #101217; box-shadow: 0 30px 100px rgba(0,0,0,.65); }
.archive-header { display: flex; align-items: center; justify-content: space-between; padding: 20px 24px; border-bottom: 1px solid var(--line); }
.archive-header h2 { font-size: 1.35rem; }
.archive-header > button { width: 38px; height: 38px; border: 1px solid #3a3e47; border-radius: 8px; background: #191c22; color: white; font-size: 1.4rem; cursor: pointer; }
.archive-toolbar { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 10px; padding: 16px 24px; border-bottom: 1px solid var(--line); }
.archive-toolbar input, .archive-toolbar button { border: 1px solid #3a3e47; border-radius: 8px; background: #181b21; color: white; }
.archive-toolbar input { padding: 11px 13px; outline: 0; }
.archive-toolbar input:focus { border-color: var(--cyan); }
.archive-toolbar button { padding: 10px 14px; font-weight: 750; cursor: pointer; }
.archive-list { padding: 12px 24px 24px; overflow-y: auto; }
.archive-group { margin-top: 18px; }
.archive-group:first-child { margin-top: 2px; }
.archive-group > h3 { position: sticky; top: -12px; z-index: 1; margin: 0; padding: 10px 4px 8px; background: #101217; color: #8b929e; font-size: .63rem; letter-spacing: .16em; }
.archive-empty { padding: 48px 20px; color: var(--muted); text-align: center; }
.archive-item { display: grid; grid-template-columns: 105px minmax(0, 1fr) auto; gap: 18px; align-items: center; padding: 15px 4px; border-bottom: 1px solid var(--line); }
.archive-item.current { margin-inline: -10px; padding-inline: 14px; border: 1px solid rgba(255,75,67,.45); border-radius: 9px; background: rgba(255,75,67,.06); }
.archive-date { color: #d9dbe0; font-size: .8rem; font-variant-numeric: tabular-nums; font-weight: 750; }
.archive-info { min-width: 0; }
.archive-info strong, .archive-info span { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.archive-info strong { margin-bottom: 5px; font-size: .92rem; }
.archive-open-badge { display: inline-block; margin-left: 8px; padding: 3px 6px; border: 1px solid rgba(255,75,67,.5); border-radius: 999px; color: #ff928d; font-size: .52rem; letter-spacing: .1em; vertical-align: 2px; }
.archive-info span { color: var(--muted); font-size: .7rem; }
.archive-match { margin-top: 6px; color: #b9bec7 !important; font-style: italic; }
.archive-actions { display: flex; gap: 6px; }
.archive-actions button { padding: 8px 10px; border: 1px solid #3a3e47; border-radius: 6px; background: #1b1e24; color: white; font-size: .7rem; cursor: pointer; }
.archive-actions button:hover { border-color: var(--red); }
.archive-actions button:disabled { opacity: .45; cursor: default; }
.archive-actions .danger { color: #ff9a95; }

.story-archive-view { position: fixed; inset: 0; z-index: 45; display: none; place-items: center; padding: 24px; background: rgba(3,4,6,.86); backdrop-filter: blur(10px); }
.story-archive-view.visible { display: grid; }
.story-archive-view.drag-passthrough { opacity: .12; pointer-events: none; backdrop-filter: none; }
.story-archive-dialog { position: relative; display: grid; grid-template-rows: auto auto auto auto auto minmax(0, 1fr); width: min(1180px, 100%); height: min(850px, 94dvh); overflow: hidden; border: 1px solid #3a404a; border-radius: 14px; background: #101217; box-shadow: 0 30px 100px rgba(0,0,0,.7); }
.story-archive-header { display: flex; align-items: center; justify-content: space-between; padding: 20px 24px; border-bottom: 1px solid var(--line); }
.story-archive-header h2 { margin: 3px 0 0; font-size: 1.35rem; }
.story-archive-header span { display: block; margin-top: 6px; color: #7f8792; font-size: .68rem; }
.story-archive-header-actions { display: flex; align-items: center; gap: 7px; }
.story-archive-header-actions > button, .story-import-more > summary { min-height: 38px; padding: 9px 11px; border: 1px solid #3a3e47; border-radius: 8px; background: #191c22; color: white; font: inherit; font-size: .68rem; font-weight: 800; cursor: pointer; }
.story-archive-header-actions > button.primary { border-color: rgba(83,213,223,.58); color: var(--cyan); }
.story-archive-header-actions > button.primary:hover { background: rgba(83,213,223,.08); }
.story-archive-header-actions > button.story-archive-close { width: 38px; padding: 0; font-size: 1.35rem; }
.story-import-more { position: relative; }
.story-import-more > summary { display: grid; width: 38px; padding: 0; list-style: none; place-items: center; }
.story-import-more > summary::-webkit-details-marker { display: none; }
.story-import-more > div { position: absolute; z-index: 25; top: calc(100% + 6px); right: 0; min-width: 175px; padding: 6px; border: 1px solid #414852; border-radius: 7px; background: #181b21; box-shadow: 0 14px 36px rgba(0,0,0,.52); }
.story-import-more button { width: 100%; padding: 9px 10px; border: 0; border-radius: 5px; background: transparent; color: #ff928d; font: inherit; font-size: .65rem; font-weight: 800; text-align: left; cursor: pointer; }
.story-import-more button:hover { background: rgba(255,75,67,.1); }
.story-drop-hint { margin: 0; padding: 7px 24px; border-bottom: 1px solid var(--line); background: #0d1014; color: #69727d; font-size: .58rem; text-align: right; }
.story-archive-view.drop-ready .story-archive-dialog::after { content: "SLIPP WORD-FILENE HER"; position: absolute; z-index: 60; inset: 12px; display: grid; border: 3px dashed var(--cyan); border-radius: 12px; background: rgba(7,16,20,.94); color: var(--cyan); font-size: 1rem; font-weight: 900; letter-spacing: .12em; pointer-events: none; place-items: center; }
.story-archive-tabs { display: flex; gap: 8px; padding: 12px 24px 0; border-bottom: 1px solid var(--line); overflow-x: auto; }
.story-archive-tabs button { flex: 0 0 auto; padding: 9px 12px 11px; border: 0; border-bottom: 2px solid transparent; background: transparent; color: #858d98; font: inherit; font-size: .7rem; font-weight: 850; cursor: pointer; }
.story-archive-tabs button.active { border-bottom-color: var(--cyan); color: white; }
.story-archive-tabs span { display: inline-grid; min-width: 20px; margin-left: 5px; padding: 2px 5px; border-radius: 999px; background: #242931; color: #aab1bb; font-size: .55rem; place-items: center; }
.story-archive-tabs button.active span { background: rgba(83,213,223,.14); color: var(--cyan); }
.story-archive-toolbar { display: grid; grid-template-columns: minmax(240px, 1fr) 170px 150px auto; gap: 9px; padding: 14px 24px; border-bottom: 1px solid var(--line); }
.story-archive-toolbar input, .story-archive-toolbar select, .story-archive-toolbar button, .story-category-filter > summary { min-width: 0; padding: 10px 11px; border: 1px solid #3a414b; border-radius: 7px; outline: 0; background: #181b21; color: white; font: inherit; font-size: .7rem; color-scheme: dark; }
.story-archive-toolbar input:focus, .story-archive-toolbar select:focus, .story-category-filter > summary:focus { border-color: var(--cyan); }
.story-archive-toolbar button { cursor: pointer; }
.story-category-filter { position: relative; min-width: 0; }
.story-category-filter > summary { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; cursor: pointer; list-style: none; }
.story-category-filter > summary::-webkit-details-marker { display: none; }
.story-category-filter > div { position: absolute; z-index: 20; top: calc(100% + 6px); left: 0; display: grid; min-width: 220px; padding: 8px; border: 1px solid #444c57; border-radius: 8px; background: #171a20; box-shadow: 0 14px 35px rgba(0,0,0,.42); }
.story-category-filter label { display: flex; align-items: center; gap: 8px; padding: 7px 8px; border-radius: 5px; color: #c7cbd2; font-size: .68rem; cursor: pointer; }
.story-category-filter label:hover { background: #222730; color: white; }
.story-category-filter label:first-child { margin-bottom: 4px; padding-bottom: 9px; border-bottom: 1px solid #343a43; }
.story-category-filter input { width: auto; margin: 0; padding: 0; accent-color: var(--cyan); }
.story-selection-toolbar { display: flex; align-items: center; gap: 16px; min-height: 46px; padding: 8px 24px; border-bottom: 1px solid var(--line); background: #0e1014; }
.story-selection-toolbar label { display: flex; align-items: center; gap: 8px; color: #b6bdc6; font-size: .65rem; font-weight: 800; cursor: pointer; }
.story-selection-toolbar input { width: 16px; height: 16px; accent-color: var(--cyan); }
.story-selection-toolbar span { margin-right: auto; color: #737c87; font-size: .62rem; }
.story-selection-toolbar button { padding: 8px 11px; border: 1px solid rgba(255,75,67,.45); border-radius: 6px; background: rgba(255,75,67,.07); color: #ff928d; font: inherit; font-size: .64rem; font-weight: 850; cursor: pointer; }
.story-selection-toolbar button:disabled { opacity: .35; cursor: default; }
.story-archive-list { padding: 12px 24px 24px; overflow-y: auto; }
.language-profile-panel { margin:12px 24px 24px; padding:24px; overflow-y:auto; border:1px solid #35404d; border-radius:14px; background:#11161c; }
.language-profile-panel>header { display:flex; align-items:flex-start; justify-content:space-between; gap:20px; }
.language-profile-panel h3 { margin:5px 0 12px; }
.language-profile-panel h4 { margin:22px 0 10px; }
.language-approved-rules,.language-report { margin-top:18px; padding-top:4px; border-top:1px solid #303946; }
.language-approved-rules li,.language-report li { margin:.55rem 0; line-height:1.55; }
.language-report article { margin:14px 0; padding:14px; border-left:3px solid #43cad7; background:#151c24; }
.language-report article p { margin:7px 0; line-height:1.55; }
.language-report blockquote { margin:8px 0 0; color:#adb7c4; font-size:.9rem; line-height:1.5; }
.language-report textarea { width:100%; min-height:100px; box-sizing:border-box; margin:16px 0 10px; padding:14px; color:#f4f5f8; background:#0d1116; border:1px solid #465263; border-radius:8px; font:inherit; resize:vertical; }
.language-report-state { display:inline-flex; border:1px solid #d59b31; border-radius:999px; padding:4px 9px; color:#f1bd59; font-size:.72rem; font-weight:900; letter-spacing:.08em; }
.language-report-state.approved { border-color:#2b8791; color:#5ee8f3; }
.story-archive-empty { padding: 64px 20px; color: #777f8a; text-align: center; }
.story-archive-group { margin-top: 18px; }
.story-archive-group:first-child { margin-top: 0; }
.story-archive-group > h3 { position: sticky; top: -12px; z-index: 2; margin: 0; padding: 11px 4px 8px; background: #101217; color: #8f97a2; font-size: .62rem; letter-spacing: .14em; }
.story-archive-item { display: grid; grid-template-columns: auto minmax(0, 1fr) auto; gap: 14px; align-items: center; padding: 15px 4px; border-bottom: 1px solid #292e36; }
.story-archive-item.selected { margin-inline: -8px; padding-inline: 12px; border-radius: 8px; background: rgba(83,213,223,.06); }
.story-select { display: grid; width: 28px; height: 36px; cursor: pointer; place-items: center; }
.story-select input { width: 17px; height: 17px; accent-color: var(--cyan); }
.story-archive-item[draggable="true"] { cursor: grab; }
.story-archive-item.dragging { opacity: .45; }
.story-archive-copy { min-width: 0; }
.story-archive-copy h4 { margin: 0; overflow: hidden; color: #f0f1f3; font-size: .88rem; text-overflow: ellipsis; white-space: nowrap; }
.story-archive-copy > p { display: -webkit-box; overflow: hidden; margin: 7px 0 0; color: #8d949e; font-size: .68rem; line-height: 1.45; -webkit-box-orient: vertical; -webkit-line-clamp: 2; white-space: pre-wrap; }
.story-archive-info { display: flex; flex-wrap: wrap; align-items: center; gap: 7px 12px; margin-top: 9px; color: #727b87; font-size: .55rem; }
.story-category { display: inline-block; padding: 4px 6px; border: 1px solid #454c56; border-radius: 999px; color: #aeb4bd; font-size: .52rem; font-weight: 800; letter-spacing: .08em; }
.story-category.timeless { border-color: rgba(83,213,223,.5); color: var(--cyan); }
.story-category.current { border-color: rgba(255,75,67,.5); color: #ff918c; }
.story-category.week { border-color: rgba(243,189,78,.5); color: var(--amber); }
.story-category.serious { border-color: rgba(255,255,255,.38); color: white; }
.story-archive-actions { display: flex; gap: 7px; }
.story-archive-actions button { padding: 8px 10px; border: 1px solid #414852; border-radius: 6px; background: #1a1e24; color: #e6e8eb; font: inherit; font-size: .65rem; font-weight: 800; cursor: pointer; white-space: nowrap; }
.story-archive-actions button:last-child { border-color: rgba(83,213,223,.55); color: var(--cyan); }
.story-archive-actions button:hover { background: #222730; }
.story-archive-actions button.danger { border-color: rgba(255,75,67,.45); color: #ff928d; }

.story-destination-view { position: fixed; inset: 0; z-index: 55; display: none; place-items: center; padding: 24px; background: rgba(3,4,6,.9); backdrop-filter: blur(12px); }
.story-destination-view.visible { display: grid; }
.story-destination-dialog { display: grid; grid-template-rows: auto minmax(0, 1fr) auto; width: min(720px, 100%); max-height: min(780px, 92dvh); overflow: hidden; border: 1px solid #3a424d; border-radius: 14px; background: #11141a; box-shadow: 0 30px 100px rgba(0,0,0,.75); }
.story-destination-header { display: flex; align-items: flex-start; justify-content: space-between; gap: 18px; padding: 20px 22px; border-bottom: 1px solid var(--line); }
.story-destination-header h2 { margin: 3px 0 0; font-size: 1.3rem; }
.story-destination-header span { display: block; max-width: 58ch; margin-top: 7px; overflow: hidden; color: #929aa5; font-size: .72rem; line-height: 1.4; text-overflow: ellipsis; white-space: nowrap; }
.story-destination-header > button { flex: 0 0 auto; width: 38px; height: 38px; border: 1px solid #3d444e; border-radius: 8px; background: #1a1e24; color: white; font-size: 1.35rem; cursor: pointer; }
.story-destination-list { display: grid; gap: 8px; padding: 14px 18px; overflow-y: auto; }
.story-destination-option { display: grid; grid-template-columns: 42px minmax(0, 1fr) auto auto; gap: 12px; align-items: center; width: 100%; padding: 13px 14px; border: 1px solid #333a44; border-radius: 9px; background: #181c22; color: white; font: inherit; text-align: left; cursor: pointer; }
.story-destination-option:hover, .story-destination-option:focus-visible { border-color: var(--cyan); outline: 0; background: #1b2329; }
.story-destination-option.active { box-shadow: inset 3px 0 0 var(--cyan); }
.story-destination-number { color: #6f7884; font-size: .66rem; font-weight: 850; letter-spacing: .08em; }
.story-destination-copy { min-width: 0; }
.story-destination-copy strong, .story-destination-copy small { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.story-destination-copy strong { font-size: .86rem; }
.story-destination-copy small { margin-top: 4px; color: #8d96a1; font-size: .67rem; }
.story-destination-status { padding: 5px 7px; border-radius: 999px; font-size: .5rem; font-weight: 900; letter-spacing: .08em; white-space: nowrap; }
.story-destination-status.empty { background: rgba(83,213,223,.11); color: var(--cyan); }
.story-destination-status.occupied { background: rgba(243,189,78,.1); color: var(--amber); }
.story-destination-action { padding: 8px 10px; border: 1px solid rgba(83,213,223,.55); border-radius: 6px; color: var(--cyan); font-size: .64rem; font-weight: 850; white-space: nowrap; }
.story-destination-footer { display: flex; align-items: center; justify-content: space-between; gap: 18px; padding: 13px 18px; border-top: 1px solid var(--line); background: #0d0f13; }
.story-destination-footer p { margin: 0; color: #777f89; font-size: .62rem; line-height: 1.45; }
.story-destination-footer button { flex: 0 0 auto; padding: 9px 12px; border: 1px solid #414852; border-radius: 7px; background: #191d23; color: white; font: inherit; font-size: .67rem; font-weight: 800; cursor: pointer; }

.new-rundown-view { position: fixed; inset: 0; z-index: 36; display: none; place-items: center; padding: 24px; background: rgba(3,4,6,.84); backdrop-filter: blur(10px); }
.new-rundown-view.visible { display: grid; }
.new-rundown-dialog { width: min(520px, 100%); overflow: hidden; border: 1px solid #3a404a; border-radius: 13px; background: #111319; box-shadow: 0 28px 90px rgba(0,0,0,.7); }
.new-rundown-header { display: flex; align-items: center; justify-content: space-between; padding: 20px 22px; border-bottom: 1px solid var(--line); }
.new-rundown-header h2 { margin-top: 4px; font-size: 1.25rem; }
.new-rundown-header > button { width: 36px; height: 36px; border: 1px solid #3d424c; border-radius: 7px; background: #191c22; color: white; font-size: 1.25rem; cursor: pointer; }
.new-rundown-body { display: grid; gap: 8px; padding: 22px; }
.new-rundown-body label { margin-top: 7px; color: #a0a6b0; font-size: .65rem; font-weight: 800; letter-spacing: .1em; text-transform: uppercase; }
.new-rundown-body input, .new-rundown-body select { width: 100%; padding: 11px 12px; border: 1px solid #414751; border-radius: 7px; outline: 0; background: #191c22; color: white; font: inherit; color-scheme: dark; }
.new-rundown-body input:focus, .new-rundown-body select:focus { border-color: var(--cyan); }
.new-rundown-body p { margin: 9px 0 0; color: #858c97; font-size: .72rem; line-height: 1.5; }
.new-rundown-footer { display: flex; justify-content: flex-end; gap: 8px; padding: 14px 22px; border-top: 1px solid var(--line); background: #0d0f13; }
.new-rundown-footer button { padding: 10px 13px; border: 1px solid #414751; border-radius: 7px; background: #191c22; color: white; font-weight: 750; cursor: pointer; }
.new-rundown-footer button:last-child { border-color: var(--cyan); color: #eaffff; }

.account-view { position: fixed; inset: 0; z-index: 40; display: none; place-items: center; padding: 28px; background: rgba(3,4,6,.86); backdrop-filter: blur(10px); }
.account-view.visible { display: grid; }
.account-dialog { width: min(520px, 100%); overflow: hidden; border: 1px solid #3a404a; border-radius: 14px; background: #111318; box-shadow: 0 30px 100px rgba(0,0,0,.7); }
.account-header { display: flex; align-items: center; justify-content: space-between; padding: 20px 24px; border-bottom: 1px solid var(--line); }
.account-header h2 { font-size: 1.25rem; }
.account-header > button { width: 38px; height: 38px; border: 1px solid #3a3e47; border-radius: 8px; background: #191c22; color: white; font-size: 1.4rem; cursor: pointer; }
.account-body { padding: 22px 24px 24px; }
.cloud-setup-message { padding: 15px; border: 1px solid rgba(243,189,78,.4); border-radius: 8px; background: rgba(243,189,78,.05); }
.cloud-setup-message strong { color: var(--amber); font-size: .72rem; letter-spacing: .1em; }
.cloud-setup-message p { margin: 8px 0 0; color: #b8bdc6; font-size: .78rem; line-height: 1.55; }
.cloud-setup-message code { color: white; }
.login-form { display: grid; gap: 8px; }
.login-form label { margin-top: 6px; color: var(--muted); font-size: .66rem; font-weight: 850; letter-spacing: .1em; text-transform: uppercase; }
.login-form input { width: 100%; padding: 11px 12px; border: 1px solid #414751; border-radius: 7px; outline: 0; background: #191c22; color: white; }
.login-form input:focus { border-color: var(--cyan); }
.account-actions { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; margin-top: 10px; }
.account-actions button, .signed-in-panel button { padding: 11px 13px; border: 1px solid #46505a; border-radius: 7px; background: #1c2228; color: white; font-weight: 800; cursor: pointer; }
.account-actions button:first-child, .signed-in-panel button:first-of-type { border-color: var(--cyan); color: #eaffff; }
.signed-in-panel span, .signed-in-panel strong { display: block; }
.signed-in-panel span { color: var(--muted); font-size: .62rem; font-weight: 850; letter-spacing: .1em; }
.signed-in-panel strong { margin: 5px 0 14px; font-size: 1.05rem; }
.signed-in-panel p { color: #bbc0c8; font-size: .78rem; line-height: 1.5; }
.signed-in-panel button { margin-right: 6px; }
.signed-in-panel button.secondary { color: #b6bbc4; }
.account-message { min-height: 1.2em; margin: 14px 0 0; color: var(--amber); font-size: .72rem; line-height: 1.45; }

.calibration-view { position: fixed; inset: 0; z-index: 35; display: none; place-items: center; padding: 28px; background: rgba(3,4,6,.86); backdrop-filter: blur(10px); }
.calibration-view.visible { display: grid; }
.calibration-dialog { display: grid; grid-template-rows: auto minmax(0, 1fr) auto; width: min(820px, 100%); max-height: 92vh; overflow: hidden; border: 1px solid #3a404a; border-radius: 14px; background: #111318; box-shadow: 0 30px 100px rgba(0,0,0,.7); }
.calibration-header { display: flex; align-items: center; justify-content: space-between; padding: 20px 24px; border-bottom: 1px solid var(--line); }
.calibration-header h2 { font-size: 1.35rem; }
.calibration-header > button { width: 38px; height: 38px; border: 1px solid #3a3e47; border-radius: 8px; background: #191c22; color: white; font-size: 1.4rem; cursor: pointer; }
.calibration-body { padding: 22px 24px; overflow-y: auto; }
.calibration-intro { display: flex; align-items: start; justify-content: space-between; gap: 20px; }
.calibration-intro p { max-width: 590px; margin-bottom: 16px; color: #aeb3bc; font-size: .8rem; line-height: 1.55; }
.calibration-intro span { flex: 0 0 auto; padding: 6px 8px; border: 1px solid #444a54; border-radius: 5px; color: var(--cyan); font-size: .62rem; font-weight: 850; letter-spacing: .09em; }
#calibrationText { margin: 0; padding: 22px 24px; border: 1px solid #353a43; border-left: 5px solid var(--red); border-radius: 8px; background: #0c0e12; color: #f5f5f1; font-size: 1.15rem; font-weight: 550; line-height: 1.65; }
.calibration-clock { display: flex; align-items: baseline; justify-content: space-between; margin-top: 16px; }
.calibration-clock span { color: var(--muted); font-size: .65rem; font-weight: 850; letter-spacing: .12em; }
.calibration-clock strong { color: white; font-size: 2rem; font-variant-numeric: tabular-nums; }
.calibration-toggle { width: 100%; margin-top: 10px; padding: 13px; border: 0; border-radius: 8px; background: var(--red); color: white; font-weight: 850; letter-spacing: .06em; cursor: pointer; }
.calibration-toggle.running { background: #242831; box-shadow: inset 0 0 0 2px var(--red); }
.calibration-toggle:disabled { opacity: .35; cursor: default; }
.calibration-results { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 18px; margin-top: 18px; }
.calibration-attempts { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; }
.calibration-attempt { padding: 10px 11px; border: 1px solid #353a43; border-radius: 7px; background: #171a20; }
.calibration-attempt span, .calibration-attempt strong { display: block; }
.calibration-attempt span { color: var(--muted); font-size: .55rem; font-weight: 800; letter-spacing: .08em; }
.calibration-attempt strong { margin-top: 5px; font-size: .9rem; }
.calibration-attempt.empty strong { color: #5f6570; }
.calibration-average { min-width: 155px; padding: 10px 14px; border: 1px solid rgba(83,213,223,.4); border-radius: 7px; background: rgba(83,213,223,.06); text-align: right; }
.calibration-average span, .calibration-average strong { display: block; }
.calibration-average span { color: var(--cyan); font-size: .55rem; font-weight: 850; letter-spacing: .09em; }
.calibration-average strong { margin-top: 4px; color: white; font-size: 1.25rem; }
.calibration-note { margin: 14px 0 0; color: #747b86; font-size: .68rem; line-height: 1.5; }
.calibration-footer { display: flex; justify-content: flex-end; gap: 8px; padding: 14px 24px; border-top: 1px solid var(--line); background: #0d0f13; }
.calibration-footer button { padding: 10px 13px; border: 1px solid #414751; border-radius: 7px; background: #191c22; color: white; font-size: .72rem; font-weight: 750; cursor: pointer; }
.calibration-footer button:last-child { border-color: var(--cyan); color: #eaffff; }
.calibration-footer button:disabled { opacity: .3; cursor: default; }

@keyframes pulse { 50% { opacity: .55; box-shadow: 0 0 6px var(--red); } }

@media (max-width: 1200px) {
  .work-layout { grid-template-columns: clamp(255px, 27vw, 300px) minmax(0, 1fr); gap: 12px; }
  .editor-heading { padding-inline: 20px; }
  .quick-mode-panel { grid-template-columns: 1fr; gap: 8px; padding-inline: 20px; }
  .quick-mode-controls { justify-content: flex-start; }
  .script-identity { width: 100%; }
  .on-air-header { gap: 14px; padding-inline: 20px; }
  .on-air-meta { gap: 14px; margin-left: auto; }
  .on-air-stage { grid-template-columns: clamp(190px, 21vw, 230px) minmax(0, 1fr); }
  .on-air-script { padding: 5vh clamp(24px, 5vw, 64px) 24vh; }
  .on-air-copy {
    width: min(100%, 50ch);
    margin-inline: auto;
    font-size: calc(clamp(1.85rem, 3.4vw, 3.2rem) * var(--on-air-scale));
  }
  .on-air-footer {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 8px 14px;
    min-height: 0;
    padding: 8px 20px;
  }
  .next-shot { grid-template-columns: minmax(0, 1fr) auto; }
  .next-shot-label { display: none; }
  .on-air-item-position { display: none; }
  .on-air-audio { grid-column: 1; grid-row: 1; margin: 0; padding-left: 0; border-left: 0; }
  .on-air-remaining { grid-column: 2; grid-row: 1; }
  .on-air-item-navigation { grid-column: 1 / -1; grid-row: 2; justify-content: flex-end; }
}

@media (max-width: 920px) {
  .app-shell { padding-inline: 16px; }
  .control-strip { flex-wrap: wrap; }
  .speed-control { flex: 1 1 55%; }
  .intro-control { flex: 1 1 35%; }
  .marker-control { flex: 1 1 60%; border-top: 1px solid var(--line); }
  .control-strip > .audio-readiness { margin-inline: auto 14px; }
  .on-air-button { flex: 1 1 30%; min-height: 82px; border-top: 1px solid var(--line); }
  .script-editor { max-height: none; }
  .work-layout { grid-template-columns: minmax(225px, 28vw) minmax(0, 1fr); gap: 10px; }
  .rundown-heading { padding: 14px; }
  .rundown-title, .rundown-date { max-width: 165px; }
  .rundown-current-hint, .rundown-tip { display: none; }
  .template-controls { padding: 10px; }
  .rundown-list { max-height: calc(100vh - 375px); }
  .rundown-item { grid-template-columns: 18px minmax(0, 1fr); padding-inline: 4px; }
  .rundown-actions { display: none; }
  .editor-heading { grid-template-columns: 1fr; align-items: start; }
  .editor-actions { justify-content: flex-start; flex-wrap: wrap; }
  .editor-help { grid-column: 1; }
  .on-air-meta span { display: none; }
  .on-air-brand img { width: 76px; }
  .on-air-brand span { font-size: .38rem; }
  .on-air-size-control output { display: none; }
  .on-air-audio { padding-left: 0; border-left: 0; }
  .on-air-audio-info { max-width: 180px; }
  .on-air-audio-progress { grid-template-columns: 58px 80px; }
  .on-air-stage { display: block; min-height: 0; overflow: hidden; }
  .on-air-rundown { display: none; }
  .on-air-script { height: 100%; }
  .on-air-script { padding-inline: clamp(20px, 4vw, 42px); }
  .on-air-audio.no-audio { display: none; }
}

@media (max-width: 760px) {
  .control-strip { position: static; }
  .work-layout { grid-template-columns: 1fr; }
  .rundown-panel { position: static; }
  .template-controls { display: none; }
  .morning-prep-summary { padding-inline: 16px; }
  .rundown-list { display: flex; max-height: none; overflow-x: auto; }
  .rundown-item { flex: 0 0 210px; }
  .script-editor { min-height: 430px; max-height: none; }
  .quick-mode-panel { padding-inline: 16px; }
  .quick-mode-controls { display: grid; grid-template-columns: 1fr 1fr; }
  .quick-mode-tabs { grid-column: 1 / -1; }
  .quick-mode-tabs button { flex: 1; }
  .quick-mode-generate { grid-column: 1 / -1; }
  .on-air-header { min-height: 64px; padding-inline: 12px; }
  .on-air-live { font-size: .88rem; }
  .on-air-brand { gap: 5px; }
  .on-air-brand img { width: 68px; }
  .on-air-brand span { max-width: 68px; font-size: .34rem; line-height: 1.25; white-space: normal; }
  .on-air-size-label, .on-air-size-control input, .on-air-size-control output { display: none; }
  .on-air-size-control { gap: 5px; }
  .on-air-size-control button { min-width: 34px; padding-inline: 7px; }
  .on-air-header > button { padding-inline: 9px; }
  .on-air-header kbd { display: none; }
  .on-air-stage { display: block; min-height: 0; overflow: hidden; }
  .on-air-rundown { display: none; }
  .on-air-script { height: 100%; padding: 4vh clamp(18px, 5vw, 34px) 27vh; }
  .on-air-copy { width: 100%; max-width: 50ch; font-size: calc(1.85rem * var(--on-air-scale)); }
  .on-air-footer { grid-template-columns: minmax(0, 1fr); gap: 8px; padding: 8px 12px; }
  .next-shot { grid-template-columns: minmax(0, 1fr); padding: 7px 12px; }
  .next-shot-label { display: flex; align-items: center; justify-content: space-between; }
  .next-shot-label small { display: none; }
  .next-shot-items { grid-template-columns: 1fr 1fr; }
  .next-shot-item:nth-child(3) { display: none; }
  .on-air-quick-modes { justify-content: flex-end; }
  .on-air-audio { grid-column: 1; grid-row: 1; width: 100%; }
  .on-air-remaining { display: none; }
  .on-air-item-navigation { grid-column: 1; grid-row: 2; width: 100%; }
  .on-air-item-navigation button { flex: 1; }
  .story-archive-view { padding: 0; }
  .story-archive-dialog { width: 100%; height: 100%; border: 0; border-radius: 0; }
  .story-archive-header { flex-wrap: wrap; gap: 12px; padding-inline: 14px; }
  .story-archive-header-actions { width: 100%; }
  .story-archive-header-actions > button.primary { flex: 1; }
  .story-drop-hint { padding-inline: 14px; text-align: left; }
  .story-archive-toolbar { grid-template-columns: 1fr 1fr; padding-inline: 14px; }
  .story-archive-toolbar input:first-child { grid-column: 1 / -1; }
  .story-archive-list { padding-inline: 14px; }
  .story-selection-toolbar { padding-inline: 14px; }
  .story-archive-item { grid-template-columns: auto minmax(0, 1fr); gap: 10px; }
  .story-archive-actions { grid-column: 2; }
  .story-destination-view { padding: 0; }
  .story-destination-dialog { width: 100%; max-height: 100%; height: 100%; border: 0; border-radius: 0; }
  .story-destination-option { grid-template-columns: 34px minmax(0, 1fr) auto; }
  .story-destination-status { display: none; }
  .global-search-view { padding: 0; }
  .global-search-dialog { width: 100%; height: 100%; border: 0; border-radius: 0; }
  .global-search-toolbar { grid-template-columns: 1fr; padding-inline: 14px; }
  .global-search-toolbar span { white-space: normal; }
  .global-search-results { padding-inline: 14px; }
  .global-search-result { grid-template-columns: 1fr; }
  .global-search-result > button { justify-self: start; }
}

@media (max-width: 620px) {
  .topbar { min-height: 70px; }
  .save-state { display: none; }
  .topbar-status { gap: 5px; }
  .brand-logo { width: 112px; }
  .brand-owner, #clock { display: none; }
  .archive-button, .account-button { padding: 7px 6px; font-size: .55rem; letter-spacing: .06em; }
  .global-search-button kbd { display: none; }
  .audio-readiness { display: none; }
  .control-strip { display: block; }
  .compact-settings { min-width: 0; border-right: 0; border-bottom: 1px solid var(--line); }
  .compact-settings > summary { min-height: 58px; }
  .speed-settings-panel { position: static; width: 100%; border-width: 1px 0 0; border-radius: 0; box-shadow: none; }
  .control-group { border-right: 0; border-bottom: 1px solid var(--line); }
  .on-air-button { width: 100%; min-height: 64px; }
  .editor-heading { align-items: start; gap: 12px; }
  .script-identity { grid-template-columns: 1fr; gap: 10px; width: 100%; }
  .editor-help { max-width: none; }
  .editor-actions { flex-wrap: wrap; gap: 7px; }
  .editor-size-control { flex: 1 1 100%; }
  .editor-size-control input { flex: 1; }
  .script-editor { width: 100%; min-height: 450px; padding: 30px 20px; font-size: calc(1.25rem * var(--editor-scale)); }
  .morning-prep { padding-inline: 16px; }
  .morning-prep-header { align-items: flex-start; flex-wrap: wrap; }
  .morning-prep-header > div { flex: 1 1 100%; }
  .morning-prep-list { grid-template-columns: 1fr; }
  .prep-card.editing { inset: 0; width: 100vw; height: 100dvh; border: 0; border-radius: 0; }
  .prep-edit-form { padding: 16px; }
  .prep-edit-heading { align-items: flex-start; }
  .prep-edit-heading p { max-width: 145px; text-align: right; }
  .prep-edit-actions { bottom: -16px; margin: 0 -16px -16px; padding: 12px 16px 16px; }
  .timing-bar { flex-wrap: wrap; }
  .timing-primary, .timing-stat { min-width: 33.333%; flex: 1; padding: 14px 12px; }
  .fit-status { width: 100%; margin: 0; border-width: 1px 0 0; border-radius: 0; text-align: center; }
  .on-air-header { padding: 0 16px; }
  .on-air-meta { display: none; }
  .on-air-brand img { width: 62px; }
  .on-air-brand span { max-width: 54px; font-size: .3rem; }
  .on-air-meta span { display: none; }
  .on-air-size-label, .on-air-size-control input { display: none; }
  .on-air-script { padding: 5vh 6vw 18vh; }
  .on-air-stage { display: block; min-height: 0; overflow: hidden; }
  .on-air-rundown { display: none; }
  .on-air-copy { font-size: calc(2rem * var(--on-air-scale)); }
  .on-air-item-position, .on-air-remaining { display: none; }
  .on-air-footer { flex-wrap: wrap; gap: 8px 10px; padding: 8px 16px; }
  .on-air-audio { width: 100%; padding: 0; border: 0; }
  .on-air-audio-info { min-width: 0; flex: 1; }
  .on-air-audio-progress { grid-template-columns: 54px 64px; }
  .on-air-audio-progress > strong { font-size: 1rem; }
  .on-air-audio button { padding-inline: 9px; }
  .on-air-audio kbd { display: none; }
  .on-air-item-navigation { width: 100%; }
  .on-air-item-navigation button { flex: 1; }
  .on-air-remaining { margin-right: auto; }
  .on-air-remaining span { display: none; }
  .archive-view { padding: 0; }
  .archive-dialog { width: 100%; height: 100%; border: 0; border-radius: 0; }
  .archive-toolbar { grid-template-columns: 1fr; padding-inline: 16px; }
  .archive-list { padding-inline: 16px; }
.archive-item { grid-template-columns: 80px minmax(0, 1fr); gap: 10px; }
  .archive-actions { grid-column: 2; }
  .speed-readouts > span { display: none; }
  .calibration-view { padding: 0; }
  .account-view { padding: 0; }
  .account-dialog { width: 100%; min-height: 100%; border: 0; border-radius: 0; }
  .calibration-dialog { width: 100%; max-height: 100%; height: 100%; border: 0; border-radius: 0; }
  .calibration-body { padding: 18px 16px; }
  .calibration-intro { display: block; }
  #calibrationText { padding: 18px; font-size: 1rem; }
  .calibration-results { grid-template-columns: 1fr; }
  .calibration-footer { padding-inline: 16px; }
  .new-rundown-view { padding: 0; }
  .new-rundown-dialog { width: 100%; min-height: 100%; border: 0; border-radius: 0; }
}

@media (max-width: 460px) {
  .on-air-header { gap: 6px; padding-inline: 8px; }
  .on-air-live { width: 12px; font-size: 0; }
  .on-air-live span { margin-right: 0; }
  .on-air-brand { gap: 4px; }
  .on-air-brand img { width: 56px; }
  .on-air-brand span { max-width: 46px; font-size: .27rem; }
  .on-air-size-control button { min-width: 30px; padding: 7px 5px; }
  .on-air-header > button { padding: 8px 7px; font-size: .68rem; }
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { scroll-behavior: auto !important; animation: none !important; }
}

/* Separate internal news feed, below the existing editor. */
.news-feed { margin: 24px auto; max-width: 1500px; padding: 24px; }
.news-list { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 350px), 1fr)); gap: 16px; margin-top: 20px; }
.news-card { border: 1px solid #465263; border-radius: 12px; padding: 18px; background: rgba(127,127,127,.06); }
.news-card h3 { margin: 8px 0 12px; }
.news-card textarea { width: 100%; min-height: 140px; box-sizing: border-box; font: inherit; line-height: 1.6; padding: 12px; resize: vertical; background: #101923; color: #f4f5f8; border: 1px solid #465263; border-radius: 8px; }
.news-meta, .news-state { font-size: .82rem; opacity: .85; }
.news-actions { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 12px; }
.news-card details { margin-top: 12px; overflow-wrap: anywhere; }
.news-card a { color: #73ccff; }
body.on-air-open .news-feed { display: none; }

.news-feed-toggle { display:flex; flex-wrap:wrap; justify-content:space-between; gap:12px; cursor:pointer; font-weight:700; padding:8px 0; }
.news-feed-content { margin-top:20px; }
.news-story-dialog { width:min(920px, calc(100vw - 32px)); max-height:90vh; box-sizing:border-box; overflow:auto; padding:28px; border:1px solid #465263; border-radius:16px; background:#15191f; color:#f4f5f8; }
.news-story-dialog::backdrop {background:rgba(0,0,0,.75);}
.news-story-dialog header {display:flex;justify-content:space-between;align-items:flex-start;gap:20px;}
.news-story-dialog h2 {margin:0 0 16px;}
.news-story-dialog textarea {display:block;width:100%;box-sizing:border-box;min-height:160px;padding:18px;margin-top:12px;background:#101923;color:#f4f5f8;border:1px solid #465263;border-radius:8px;font:inherit;line-height:1.65;resize:vertical;}
.news-story-dialog #newsStoryEditor {min-height:44vh;font-size:1.15rem;}
.news-story-dialog a {color:#73ccff;}
.news-story-dialog details {margin-top:24px;}

.song-search-row {display:flex;gap:12px;margin-top:10px;}
.song-search-row input {flex:1;min-width:0;padding:12px;border:1px solid #465263;border-radius:8px;background:#101923;color:#f4f5f8;font:inherit;}
.song-intro-card {border-top:1px solid #465263;margin-top:22px;padding-top:12px;}
.song-intro-card h4 {margin:0 0 10px;}
.song-intro-card textarea {min-height:210px;}
.song-intro-card p {font-size:.85rem;line-height:1.7;}
.song-research-context {color:#aeb5c0;line-height:1.55;}
.song-angle-list {display:flex;flex-wrap:wrap;gap:8px;margin:8px 0 12px;}
.song-angle-list span,.song-material-category {display:inline-flex;width:max-content;border:1px solid #2b8791;border-radius:999px;padding:4px 9px;color:#5ee8f3;font-size:.72rem;font-weight:900;letter-spacing:.08em;text-transform:uppercase;}
.song-material-bank {margin-top:28px;border-top:1px solid #465263;padding-top:18px;}
.song-material-bank>h4 {margin:0 0 4px;}
.song-material-bank>p {margin:0 0 14px;color:#aeb5c0;font-size:.86rem;}
.song-material-bank article {padding:14px 0;border-top:1px solid #303946;}
.song-material-bank article>p {margin:9px 0;line-height:1.6;}
.song-material-actions {display:flex;align-items:center;flex-wrap:wrap;gap:12px;}
.song-material-actions details {margin:0;}
.song-material-actions a,.song-intro-card details a {color:#73ccff;}
@media(max-width:600px){.song-search-row{flex-direction:column;}#songDialog{padding:18px;}}

.prep-edit-form select { width: 100%; min-height: 46px; padding: 10px 40px 10px 12px; border: 1px solid #465263; border-radius: 8px; outline: 0; background: #181d25; color: #f0f1f3; font-family: inherit; font-size: .82rem; font-weight: 700; line-height: 1.3; color-scheme: dark; cursor: pointer; }
.prep-edit-form select:focus { border-color: var(--cyan); box-shadow: 0 0 0 2px rgba(83,213,223,.12); }

/* Compact traffic desk below the script, alongside the rundown. */
.editor-column { min-width:0; display:flex; flex-direction:column; gap:14px; align-self:stretch; }
.traffic-feed { margin-top:auto; min-width:0; border:1px solid var(--line); border-radius:10px; background:var(--panel); overflow:hidden; }
.traffic-feed > summary { display:flex; justify-content:space-between; gap:12px; cursor:pointer; padding:12px 16px; font-size:.72rem; font-weight:800; letter-spacing:.08em; list-style:none; }
.traffic-feed > summary small,.traffic-feed > summary > span:last-child { color:var(--muted); font-size:.65rem; font-weight:600; }
.traffic-toolbar { display:flex; align-items:center; flex-wrap:wrap; gap:8px 16px; padding:0 16px 9px; font-size:.65rem; color:var(--muted); }
.traffic-toolbar a { color:var(--cyan); }
.traffic-toolbar button { margin-left:auto; padding:4px 8px; border:1px solid var(--line); border-radius:5px; background:transparent; color:var(--text); cursor:pointer; font-size:.65rem; }
.traffic-list { max-height:200px; overflow-y:auto; overscroll-behavior:contain; padding:0 16px 8px; }
.traffic-list > p { color:var(--muted); font-size:.75rem; margin:5px 0; }
.traffic-row { display:grid; grid-template-columns:42px minmax(0,1fr) 24px; gap:4px 8px; padding:9px 0; border-top:1px solid var(--line); }
.traffic-row time { color:var(--cyan); font-size:.7rem; padding-top:3px; font-variant-numeric:tabular-nums; }
.traffic-open { text-align:left; padding:0; background:none; border:0; color:var(--text); font-size:.8rem; font-weight:750; cursor:pointer; }
.traffic-open:hover { color:var(--cyan); }
.traffic-remove { border:0; background:none; color:var(--muted); cursor:pointer; font-size:1rem; padding:0; }
.traffic-row > p { grid-column:2 / 3; margin:0; color:#bec4ce; font-size:.76rem; line-height:1.5; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; }
body.on-air-open .traffic-feed { display:none; }

/* Let the open traffic desk fill the remaining height beside the rundown. */
.traffic-feed[open] { flex:1; display:flex; flex-direction:column; }
.traffic-feed[open] > summary,.traffic-toolbar { flex-shrink:0; }
.traffic-feed[open] .traffic-list { flex:1; height:0; min-height:200px; max-height:none; }
@media(max-width:700px) {
  .traffic-feed[open] { flex:none; }
  .traffic-feed[open] .traffic-list { flex:none; height:auto; min-height:0; max-height:200px; }
}

/* Independent invite-only beta entry and profile form. */
body.beta-locked > :not(#betaGate) { display:none !important; }
#betaGate { max-width:760px; margin:5vh auto; padding:28px; border:1px solid #333; border-radius:14px; background:#14161c; color:#f6f7fb; }
#betaGate h1 small { display:block; font-size:13px; letter-spacing:2px; color:#f8aa67; }
#betaGate p { line-height:1.55; }
#betaGate form { display:grid; gap:16px; }
#betaGate label { display:grid; gap:6px; }
#betaGate input,#betaGate select,#betaGate textarea { box-sizing:border-box; width:100%; padding:10px; color:inherit; background:#222630; border:1px solid #555; border-radius:6px; }
#betaGate input[type=checkbox] { width:auto; }
#betaGate textarea { min-height:85px; }
#betaGate button { padding:12px 18px; border-radius:7px; background:#ff4b43; color:white; border:0; cursor:pointer; }
#betaGate [role=status] { color:#f8bd8c; }