:root {
  --ink: #212121;
  --muted: #596170;
  --paper: #f5f6f6;
  --paper-soft: #f8fafb;
  --card: #ffffff;
  --line: #d8dce4;
  --green: #0094d4;
  --green-dark: #202430;
  --mint: #dff4fc;
  --gold: #c98a2e;
  --red: #a14343;
  --danger: #a14343;
  --blue: #2e3346;
  --shadow: 0 12px 30px rgba(32, 36, 48, 0.07);
}

* { box-sizing: border-box; }

body {
  margin: 0;
  color: var(--ink);
  background: var(--paper);
  font-family: Montserrat, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  line-height: 1.5;
}

.auth-pending .topbar, .auth-pending .demo-banner, .auth-pending .shell { display: none; }
.auth-gate { min-height: 100vh; display: flex; flex-direction: column; justify-content: center; align-items: center; gap: .8rem; padding: 2rem; background: #f5f6f6; }
.auth-gate.hidden { display: none; }
.auth-card { width: min(460px, 100%); display: grid; gap: 1rem; padding: 2rem; border-radius: 20px; background: #fff; box-shadow: 0 20px 60px rgba(9, 40, 32, .16); }
.auth-card label { display: grid; gap: .35rem; }
.auth-card.hidden { display: none; }
.auth-form-message { min-height: 1.5rem; margin: 0; color: #8f1d1d; font-weight: 700; }
.recovery-codes { white-space: pre-wrap; font: 600 .95rem ui-monospace, monospace; background: #f3f7f5; padding: 1rem; border-radius: 10px; }
.composer-panel { margin: 1rem 0; }
.composer-tabs { display: flex; flex-wrap: wrap; gap: .5rem; margin: 1rem 0; }
.global-media-switch { display:flex; flex-wrap:wrap; align-items:center; gap:.65rem; margin:1rem 0; padding:.85rem; border:1px solid #b9dce9; border-radius:12px; background:#eef9fd; }
.global-media-switch span { margin-right:auto; color:var(--muted); font-size:.9rem; }
.composer-view { display: grid; gap: 1rem; }
.preview-pair { display:grid; grid-template-columns:minmax(0,1fr) minmax(280px,420px); gap:1rem; align-items:start; }
.preview-pair > * { min-width:0; }
.composer-view .post-preview { max-height:680px; overflow:auto; }
.composer-view .media-stage { width:100%; max-height:420px; }
.composer-view .media-stage .media-preview { max-height:420px; }
.composer-view .media-stage img { max-height:420px; object-fit:contain; }
.post-preview { display: grid; gap: .65rem; border: 1px solid #d8dce4; border-radius: 14px; padding: 1rem; background: #fff; overflow-wrap: anywhere; }
.mobile-preview { width: min(390px, 100%); border-radius: 30px; box-shadow: 0 0 0 6px #202430, 0 18px 40px rgba(32,36,48,.16); padding: 1.25rem; }
.post-preview img, .media-preview img { display:block; width: 100%; height:100%; object-fit: cover; }
.media-preview { position: relative; display:block; min-height:0; }
.official-media-fallback { position:absolute; inset:0; display:none; place-content:center; gap:.4rem; padding:clamp(18px,5vw,44px); color:#fff; background:linear-gradient(145deg,#202430,#2e3346); text-align:center; }
.official-media-fallback.visible { display:grid; }
.official-media-fallback strong { color:#fff; font-size:clamp(16px,2vw,24px); }
.official-media-fallback span { color:#dff4fc; }
.media-linkedin { aspect-ratio: 1.91/1; background:#eef3f8; }
.media-x { aspect-ratio: 16/9; background:#eff3f4; }
.media-instagram { aspect-ratio: 4/5; background:#fafafa; }
.media-payment_radar { aspect-ratio: 16/9; background:#202430; }
.media-preview, .media-empty { overflow:hidden; border-radius: 8px; }
.media-stage { position:relative; display:block; min-width:0; overflow:hidden; border-radius:8px; background:#eef3f8; isolation:isolate; }
.media-stage > .media-preview, .media-stage > .media-empty, .media-stage > .publisher-link-card { width:100%; margin:0; }
.brand-media-overlay { position:absolute; z-index:4; pointer-events:none; font-style:normal; letter-spacing:0; }
.brand-media-overlay strong, .brand-media-overlay small { display:block; color:inherit; }
.brand-media-overlay strong { font-size:clamp(10px,1.15vw,15px); font-weight:800; line-height:1.2; }
.brand-media-overlay small { font-size:clamp(8px,.9vw,12px); line-height:1.25; opacity:.92; }
.overlay-background-dark { color:#fff; background:rgba(32,36,48,.88); }
.overlay-background-light { color:#202430; background:rgba(255,255,255,.88); }
.overlay-brand { display:flex; flex:0 0 auto; align-items:center; gap:.38rem; white-space:nowrap; }
.overlay-hook-crop { position:relative; display:block; width:17px; height:25px; overflow:hidden; flex:0 0 auto; }
.overlay-hook-crop img { position:absolute; width:239%; max-width:none; height:auto; left:-69%; top:-32%; }
.brand-overlay-bottom_bar { inset:auto 0 0; display:flex; justify-content:space-between; align-items:center; gap:1rem; min-height:40px; padding:.48rem .75rem; border-top:1px solid rgba(0,148,212,.75); }
.brand-overlay-bottom_bar .overlay-source { min-width:0; text-align:left; }
.brand-overlay-corner_tag { max-width:min(78%,340px); padding:.48rem .62rem; border-left:3px solid #0094d4; border-radius:7px; box-shadow:0 3px 12px rgba(0,0,0,.18); }
.brand-overlay-corner_tag .overlay-source { margin-top:.16rem; }
.overlay-corner-top_left { inset:.7rem auto auto .7rem; }
.overlay-corner-top_right { inset:.7rem .7rem auto auto; }
.overlay-corner-bottom_left { inset:auto auto .7rem .7rem; }
.overlay-corner-bottom_right { inset:auto .7rem .7rem auto; }
.media-stage.overlay-on .source-media-credit { display:none; }
.media-empty { display:grid; place-items:center; min-height:180px; padding:20px; color:var(--muted); background:repeating-linear-gradient(135deg,#f5f6f6,#f5f6f6 16px,#fff 16px,#fff 32px); text-align:center; }
.preview-header { display:flex; align-items:center; gap:10px; }
.preview-header div { display:grid; }
.preview-avatar { display:grid; place-items:center; width:42px; height:42px; border-radius:50%; color:white; background:#0094d4; font-weight:800; }
.preview-mode, .preview-header small, .preview-cta { color:var(--muted); }
.preview-actions { padding-top:10px; border-top:1px solid var(--line); color:var(--muted); font-weight:700; word-spacing:14px; }
.platform-linkedin { border-top:4px solid #0a66c2; }
.platform-x { color:#0f1419; border-color:#cfd9de; border-radius:0; }
.platform-instagram { background:linear-gradient(#fff,#fff) padding-box,linear-gradient(45deg,#f9ce34,#ee2a7b,#6228d7) border-box; border:3px solid transparent; }
.platform-payment_radar { padding:clamp(18px,4vw,42px); color:#212121; background:#f5f6f6; border-top:8px solid #0094d4; }
.platform-payment_radar h4 { font-size:clamp(24px,4vw,44px); line-height:1.08; }
.radar-kicker { color:#0094d4; font-size:12px; font-weight:800; letter-spacing:.14em; }
.preview-copy { white-space:pre-wrap; }
.preview-link { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; color:#0094d4; }
.play-state { position: absolute; z-index:2; inset: auto 1rem 1rem 1rem; padding: .65rem; border-radius: 8px; background: rgba(0,0,0,.76); color: #fff; }
.source-media-credit { position:absolute; z-index:2; inset:auto 0 0 0; padding:.55rem .75rem; color:#fff; background:rgba(20,24,34,.82); font-size:11px; line-height:1.35; }
.play-state + .source-media-credit, .source-media-credit:has(+ .play-state) { bottom:3.9rem; }
.media-empty { min-height: 140px; display: grid; place-items: center; border: 1px dashed #9eb8ad; border-radius: 12px; color: #587068; }
.publisher-link-card { display:grid; align-content:center; gap:.5rem; min-height:180px; padding:clamp(20px,4vw,46px); color:#fff; background:linear-gradient(145deg,#202430,#2e3346); text-align:center; }
.publisher-link-card span { color:#dff4fc; }
.x-draft-card { display:grid; gap:.85rem; }
.x-post-copy { margin:0; padding:1rem; white-space:pre-wrap; overflow-wrap:anywhere; font:inherit; background:#f4f7f8; border:1px solid var(--line); border-radius:8px; }
.x-draft-image { display:block; width:min(100%,540px); max-height:540px; object-fit:contain; background:#eef3f5; border:1px solid var(--line); border-radius:8px; }
.button-link { display:inline-flex; align-items:center; justify-content:center; padding:.7rem 1rem; border-radius:6px; text-decoration:none; font-weight:700; }
.composer-form { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: .75rem; }
.composer-form label { display: grid; gap: .3rem; }
.composer-form label:nth-child(2), .composer-form label:nth-child(n+8) { grid-column: 1/-1; }
.media-framing-controls { grid-column:1/-1; display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:.75rem; padding:1rem; border:1px solid var(--line); border-radius:12px; background:#f8fafb; }
.media-framing-controls legend { padding:0 .35rem; font-weight:800; }
.media-framing-controls p { grid-column:1/-1; margin:0; color:var(--muted); }
.media-framing-controls label { display:grid; grid-column:auto !important; gap:.3rem; }
.media-framing-controls output { margin-left:.35rem; font-weight:800; }
.media-framing-controls:not(.manual-active) label:not(:first-of-type) { opacity:.55; }
.media-framing-controls button { align-self:end; }
.brand-overlay-controls { grid-column:1/-1; display:grid; grid-template-columns:repeat(4,minmax(150px,1fr)); gap:.75rem; align-items:end; padding:1rem; border:1px solid #b9dce9; border-radius:12px; background:#eef9fd; }
.brand-overlay-controls legend { padding:0 .35rem; font-weight:800; }
.brand-overlay-controls p { grid-column:1/-1; margin:0; color:var(--muted); }
.brand-overlay-controls label { display:grid; grid-column:auto !important; gap:.3rem; }
.brand-overlay-controls .overlay-toggle { display:flex; align-items:center; min-height:44px; gap:.5rem; font-weight:800; }
.brand-overlay-controls .overlay-source-example { align-self:center; color:var(--muted); font-size:.9rem; }
.brand-overlay-controls button { align-self:end; }
@media (max-width:900px) { .brand-overlay-controls { grid-template-columns:1fr 1fr; } .brand-overlay-controls .overlay-source-example { grid-column:1/-1; } }
.generated-visual-history { display:grid; grid-template-columns:repeat(auto-fill,minmax(270px,1fr)); gap:.75rem; margin:.75rem 0 1rem; padding:.9rem; border:1px solid var(--line); border-radius:12px; background:#fff; }
.generated-visual-history .history-heading { grid-column:1/-1; display:flex; gap:.6rem; align-items:baseline; flex-wrap:wrap; }
.generated-visual-history .history-heading span, .generated-visual-history > p { color:var(--muted); }
.generated-option { display:grid; grid-template-columns:84px 1fr; gap:.65rem; align-items:center; padding:.5rem; border:1px solid var(--line); border-radius:10px; background:#f8fafb; }
.generated-option.selected { border:2px solid var(--blue); }
.generated-option img { width:84px; height:64px; object-fit:contain; background:#edf2f5; border-radius:7px; }
.generated-option div { display:grid; gap:.3rem; min-width:0; }
.generated-option small { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
@media (max-width: 850px) { .preview-pair, .composer-form { grid-template-columns: 1fr; } .composer-form label { grid-column: 1 !important; } .media-framing-controls, .brand-overlay-controls { grid-template-columns:1fr; } .brand-overlay-controls p { grid-column:1; } }

button, input, select, textarea { font: inherit; }
button { cursor: pointer; }
.link-button { background: transparent; border: 0; color: var(--blue); padding: 0; text-align: left; text-decoration: underline; width: fit-content; }
.icon-dark { background: #202430; color: #fff; }
.icon-napapay_blue { background: #0094D4; color: #fff; }
.icon-light { background: #fff; color: #212121; }

.topbar {
  min-height: 86px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 16px 30px;
  color: white;
  background: var(--ink);
}

.topbar h1 { margin: 0; font-family: Montserrat, ui-sans-serif, sans-serif; font-size: 30px; letter-spacing: -0.02em; }
.eyebrow { margin: 0 0 3px; color: #86b8a8; font-size: 11px; font-weight: 800; letter-spacing: .14em; text-transform: uppercase; }
.mode { border: 1px solid #42655a; border-radius: 999px; padding: 8px 13px; font-size: 13px; }
.mode span { display: inline-block; width: 8px; height: 8px; margin-right: 7px; border-radius: 50%; background: #60d6a7; }
.topbar-actions { display:flex; align-items:center; gap:10px; }
.demo-banner { padding: 9px 30px; color: #664712; background: #fff0ce; border-bottom: 1px solid #ead5a7; font-size: 13px; text-align: center; }

.shell { min-height: calc(100vh - 122px); display: grid; grid-template-columns: 220px minmax(0, 1fr); }
.sidebar { padding: 24px 14px; background: #e8eae4; border-right: 1px solid var(--line); }
.nav-item { width: 100%; padding: 11px 14px; margin-bottom: 5px; color: #43514c; text-align: left; background: transparent; border: 0; border-radius: 8px; font-weight: 700; }
.nav-item:hover, .nav-item:focus-visible { background: #dce2dc; }
.nav-item.active { color: white; background: var(--green); }

main { min-width: 0; padding: 30px clamp(20px, 4vw, 56px) 70px; }
.view { display: none; }
.active-view { display: block; }
.view-heading { display: flex; align-items: end; justify-content: space-between; gap: 20px; margin-bottom: 24px; }
.view-heading h2 { margin: 0; font-family: Montserrat, ui-sans-serif, sans-serif; font-size: clamp(28px, 4vw, 42px); letter-spacing: -.03em; }
.date-control { max-width: 190px; }

.summary-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 14px; margin-bottom: 28px; }
.summary-card { padding: 17px; background: var(--card); border: 1px solid var(--line); border-radius: 12px; box-shadow: var(--shadow); text-align:left; }
.summary-button:hover, .summary-button:focus, .clickable-card:hover, .clickable-card:focus { border-color:#0094d4; box-shadow:0 0 0 3px rgba(0,148,212,.13),var(--shadow); }
.summary-card strong { display: block; font-size: 28px; font-family: Montserrat, ui-sans-serif, sans-serif; }
.summary-card span { color: var(--muted); font-size: 13px; }
.section-heading { display: flex; justify-content: space-between; align-items: baseline; gap: 15px; }
.section-heading h3 { margin-bottom: 10px; }
.section-heading p { color: var(--muted); font-size: 13px; }
.slot-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; margin-bottom: 24px; }
.slot-card { min-height: 260px; display: flex; flex-direction: column; padding: 18px; background: var(--card); border: 1px solid var(--line); border-radius: 14px; box-shadow: var(--shadow); }
.slot-number { color: var(--muted); font-size: 12px; font-weight: 800; text-transform: uppercase; letter-spacing: .12em; }
.slot-card h4 { margin: 14px 0 8px; font-family: Montserrat, ui-sans-serif, sans-serif; font-size: 21px; line-height: 1.2; }
.slot-card p { color: var(--muted); font-size: 13px; }
.slot-card .slot-footer { margin-top: auto; }
.empty-slot { border-style: dashed; justify-content: center; align-items: center; color: var(--muted); text-align: center; box-shadow: none; }

.panel { background: var(--card); border: 1px solid var(--line); border-radius: 14px; box-shadow: var(--shadow); }
.activity-panel { padding: 18px 22px; }
.activity-item { display: grid; grid-template-columns: 160px 1fr auto; gap: 16px; padding: 10px 0; border-top: 1px solid #edf0ec; font-size: 13px; }
.activity-item:first-child { border-top: 0; }
.activity-item time { color: var(--muted); }
.activity-button { width:100%; border:0; background:transparent; color:inherit; text-align:left; }
.activity-button:hover, .activity-button:focus { background:#f2f8fb; }
.queue-controls { display:grid; grid-template-columns:minmax(240px,2fr) repeat(4,minmax(130px,1fr)); gap:.75rem; align-items:end; margin-bottom:1rem; }
.queue-controls label { display:grid; gap:.3rem; }
.assistant-toggle { position:static; padding:.65rem .9rem; border:1px solid #42655a; border-radius:999px; color:#fff; background:#202430; box-shadow:none; font-weight:800; }
.assistant-toggle:hover, .assistant-toggle:focus-visible { background:#0094d4; }
.assistant-panel { position:fixed; z-index:50; right:24px; bottom:82px; width:min(430px,calc(100vw - 28px)); max-height:min(690px,calc(100vh - 110px)); display:grid; grid-template-rows:auto 1fr auto; overflow:hidden; border:1px solid var(--line); border-radius:18px; background:#fff; box-shadow:0 24px 70px rgba(32,36,48,.3); }
.assistant-panel.hidden { display:none; }
.assistant-panel header { display:flex; justify-content:space-between; gap:1rem; padding:1rem; color:#fff; background:#202430; }
.assistant-panel header div { display:grid; }
.assistant-panel header small { color:#dff4fc; }
.assistant-messages { min-height:240px; overflow:auto; display:grid; align-content:start; gap:.75rem; padding:1rem; }
.assistant-message { padding:.75rem .9rem; border-radius:12px; white-space:pre-wrap; }
.operator-message { margin-left:2rem; color:#fff; background:#0094d4; }
.assistant-answer { margin-right:2rem; background:#eef3f5; }
.assistant-panel form { display:grid; grid-template-columns:1fr auto; gap:.6rem; padding:1rem; border-top:1px solid var(--line); }
.assistant-panel textarea { resize:vertical; }
@media (max-width:900px) { .queue-controls { grid-template-columns:1fr 1fr; } }
@media (max-width:520px) { .queue-controls { grid-template-columns:1fr; } .assistant-panel { right:14px; bottom:74px; } .mode { display:none; } }

.image-studio-layout { display:grid; grid-template-columns:minmax(220px,.32fr) minmax(0,1fr); gap:18px; align-items:start; }
.studio-project-list { display:grid; gap:8px; }
.studio-project { display:grid; gap:3px; width:100%; text-align:left; }
.studio-project small { opacity:.78; }
.studio-heading, .history-heading { display:flex; justify-content:space-between; align-items:flex-start; gap:18px; margin-bottom:14px; }
.history-heading { align-items:baseline; }
.history-heading span { color:var(--muted); font-size:12px; }
.studio-direction { display:grid; gap:14px; padding:18px; border:1px solid var(--line); border-radius:14px; background:var(--soft); }
.studio-direction details { display:grid; gap:12px; }
.studio-direction details[open] { padding:12px; border:1px solid var(--line); border-radius:10px; background:#fff; }
.studio-direction summary { cursor:pointer; font-weight:800; }
.studio-preparation { display:grid; gap:16px; margin-top:18px; padding:18px; border:2px solid rgba(0,148,212,.38); border-radius:14px; background:#f2fbff; }
.studio-preparation textarea { min-height:260px; }
.studio-generation-grid > .studio-refinement { grid-column:1 / -1; margin-top:0; scroll-margin-top:24px; box-shadow:0 10px 28px rgba(0,82,120,.14); }
.studio-refinement-request { margin:0; font-weight:700; }
.studio-scan-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:10px; }
.studio-scan-item { min-width:0; padding:12px; border:1px solid var(--line); border-radius:10px; background:#fff; }
.studio-scan-item small { display:block; margin-bottom:5px; color:#007eae; font-weight:800; text-transform:uppercase; letter-spacing:.04em; }
.studio-scan-item p { margin:0; white-space:pre-wrap; }
.studio-source-media, .studio-references, .studio-generations, .studio-platforms, .studio-job { margin-top:20px; }
.studio-source-media { padding:16px; border:1px solid #b8dcea; border-radius:14px; background:#f3fbfe; }
.studio-source-media .history-heading > div:first-child { display:grid; gap:5px; }
.studio-source-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:14px; }
.studio-source-card { display:grid; align-content:start; gap:9px; min-width:0; padding:12px; border:1px solid var(--line); border-radius:12px; background:#fff; }
.studio-source-card.selected { border-color:#0094d4; box-shadow:0 0 0 2px rgba(0,148,212,.14); }
.studio-source-card > img, .source-media-unavailable { width:100%; aspect-ratio:16/9; border-radius:8px; background:#202430; }
.studio-source-card > img { object-fit:contain; }
.source-media-unavailable { display:grid; place-items:center; padding:18px; color:#dff4fc; text-align:center; }
.studio-reference-grid, .studio-generation-grid, .studio-platform-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:14px; }
.studio-reference, .studio-generation, .studio-platform-card { display:grid; gap:9px; min-width:0; padding:12px; border:1px solid var(--line); border-radius:12px; background:#fff; }
.studio-reference.selected, .studio-generation.selected { border-color:#0094d4; box-shadow:0 0 0 2px rgba(0,148,212,.14); }
.studio-reference img, .studio-generation img, .studio-platform-card img { width:100%; aspect-ratio:16/9; object-fit:contain; border-radius:8px; background:#202430; }
.studio-reference img { aspect-ratio:4/3; }
.studio-platform-card img[alt^="Instagram"] { aspect-ratio:4/5; }
.studio-generation-meta { display:flex; justify-content:space-between; gap:10px; align-items:baseline; }
.studio-upload-row { display:flex; flex-wrap:wrap; gap:9px; margin-top:8px; }
.studio-upload { display:grid; gap:8px; margin-top:12px; }
.studio-upload-instruction { width:100%; padding:8px 10px; border:1px solid var(--line); border-radius:8px; font-family:inherit; font-size:13px; resize:vertical; min-height:44px; background:#fff; }
.studio-reference-instruction { width:100%; padding:8px 10px; border:1px solid var(--line); border-radius:8px; font-family:inherit; font-size:12px; resize:vertical; min-height:44px; background:#fff; }
.studio-working-refine { display:grid; gap:10px; margin-top:16px; padding:14px; border-radius:12px; background:rgba(0,148,212,.10); border:1px solid rgba(0,148,212,.45); }
.studio-working-refine::before { content:"Type an instruction, then click Apply to chain a new version. Ctrl+Enter also applies."; font-size:12px; color:#036; font-weight:600; letter-spacing:.02em; }
.studio-working-refine-input { width:100%; padding:10px 12px; border:1px solid #0094d4; border-radius:8px; font-family:inherit; font-size:14px; resize:vertical; min-height:64px; background:#fff; }
.studio-working-refine button { font-size:15px; padding:10px 18px; }
.studio-working-refine-buttons { display:flex; gap:10px; flex-wrap:wrap; }
.studio-working-panel { margin-top:20px; padding:20px; border:2px solid rgba(0,148,212,.55); border-radius:16px; background:#fbfeff; box-shadow:0 10px 32px rgba(0,82,120,.10); }
.studio-working-body { display:grid; grid-template-columns:minmax(0,3fr) minmax(0,2fr); gap:18px; align-items:start; margin-top:12px; }
.studio-working-image { width:100%; height:auto; border-radius:12px; border:1px solid var(--line); background:#fff; display:block; }

/* Region editor */
.studio-working-stage { position:relative; user-select:none; touch-action:none; }
.studio-working-stage .studio-regions-overlay { position:absolute; inset:0; pointer-events:none; }
.studio-working-stage .studio-region-box { position:absolute; border:2px solid #ff8f00; background:rgba(255,143,0,.18); border-radius:4px; box-shadow:0 0 0 1px rgba(255,255,255,.85) inset; }
.studio-working-stage .studio-region-preview { border-style:dashed; background:rgba(255,143,0,.10); }
.studio-working-stage .studio-region-num { position:absolute; top:-10px; left:-10px; width:22px; height:22px; border-radius:50%; background:#ff8f00; color:#fff; font-weight:700; font-size:12px; display:flex; align-items:center; justify-content:center; box-shadow:0 2px 6px rgba(0,0,0,.25); }
.studio-working-panel .studio-region-toolbar { display:flex; align-items:center; gap:10px; margin-top:12px; flex-wrap:wrap; }
.studio-working-panel .studio-region-hint { font-size:12px; color:#557; }
.studio-regions-list { list-style:none; margin:10px 0 0; padding:0; display:grid; gap:8px; }
.studio-region-item { display:grid; grid-template-columns:26px 140px minmax(0,1fr) 32px; gap:8px; align-items:center; padding:8px 10px; border:1px solid var(--line); border-radius:8px; background:#fffef7; }
.studio-region-item-num { width:22px; height:22px; border-radius:50%; background:#ff8f00; color:#fff; font-weight:700; font-size:12px; display:flex; align-items:center; justify-content:center; }
.studio-region-item select, .studio-region-target { padding:6px 8px; border:1px solid var(--line); border-radius:6px; font-family:inherit; font-size:13px; background:#fff; }
.studio-region-remove { padding:2px 6px; font-size:14px; line-height:1; }
/* When draw mode is active, image itself receives a crosshair cursor */
.studio-working-stage:has(> .studio-region-preview), .studio-working-panel .primary + .ghost, .studio-working-panel button.primary { cursor:default; }
.studio-working-stage { cursor:default; }
.studio-working-panel .studio-region-toolbar button.primary { cursor:crosshair; }
.studio-working-panel .studio-region-toolbar button.primary ~ * { }
/* When Draw button is toggled primary, the stage should show crosshair; achieved with body-level attribute or class — fallback: give stage crosshair when overlay has pointer-events on. */
.studio-regions-overlay[data-active="true"] { pointer-events:auto; cursor:crosshair; }
.studio-version-strip { display:flex; flex-wrap:wrap; gap:10px; align-content:flex-start; }
.studio-version-item { display:grid; gap:4px; margin:0; padding:6px; border:1px solid var(--line); border-radius:8px; background:#fff; width:140px; }
.studio-version-item img { width:100%; height:auto; border-radius:6px; display:block; }
.studio-version-item figcaption { font-size:11px; opacity:.78; text-align:center; }
.studio-version-item-current { border-color:rgba(0,148,212,.55); box-shadow:0 4px 10px rgba(0,82,120,.10); }
@media (max-width:900px) { .studio-working-body { grid-template-columns:1fr; } }
.studio-job { display:grid; grid-template-columns:minmax(180px,1fr) minmax(0,2fr); gap:12px; align-items:center; padding:14px; border-radius:10px; background:#e9f7fd; }
.studio-job progress { width:100%; accent-color:#0094d4; }
@media (max-width:900px) {
  .image-studio-layout { grid-template-columns:1fr; }
  .studio-source-grid, .studio-reference-grid, .studio-generation-grid, .studio-platform-grid { grid-template-columns:1fr; }
  .studio-scan-grid { grid-template-columns:1fr; }
  .studio-heading, .history-heading { display:grid; }
}

.badge { display: inline-flex; align-items: center; max-width: 100%; padding: 4px 8px; border-radius: 999px; font-size: 11px; font-weight: 800; text-transform: uppercase; letter-spacing: .04em; background: #e6ece8; }
.badge.approved_text, .badge.approved_final, .badge.verified { color: #07513c; background: var(--mint); }
.badge.editorial_review, .badge.needs_review { color: #63460e; background: #fff0ce; }
.badge.revision_requested, .badge.conflicted { color: #724343; background: #f8dede; }
.badge.rejected { color: white; background: var(--red); }
.score { display: inline-flex; align-items: center; justify-content: center; width: 48px; height: 48px; border-radius: 50%; color: white; background: var(--green); font-weight: 800; }

.form-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 17px; padding: 24px; }
.wide { grid-column: 1 / -1; }
label { display: grid; gap: 6px; color: #495750; font-size: 12px; font-weight: 800; letter-spacing: .02em; }
input, select, textarea { width: 100%; padding: 10px 11px; color: var(--ink); background: white; border: 1px solid #bdc8c1; border-radius: 7px; font-weight: 500; }
textarea { resize: vertical; }
input:focus, select:focus, textarea:focus { outline: 3px solid rgba(13, 107, 80, .16); border-color: var(--green); }
.form-actions { display: flex; align-items: center; gap: 14px; }
.platform-targets { display:flex; flex-wrap:wrap; gap:10px 24px; padding:14px; border:1px solid #bdc8c1; border-radius:7px; }
.platform-targets legend { padding:0 6px; color:#495750; font-size:12px; font-weight:800; }
.platform-targets label { display:flex; align-items:center; gap:7px; }
.platform-targets input { width:auto; }
.simple-intake { max-width: 980px; }
.simple-intake textarea { font-size: 16px; line-height: 1.5; }
.intake-prompt span { font-weight: 500; }
.intake-files { padding: 12px 14px; border: 1px solid var(--line); border-radius: 7px; background: var(--soft); }
.intake-files summary { cursor: pointer; color: var(--ink); font-weight: 800; }
.intake-file-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 17px; padding-top: 14px; }
.primary, .secondary, .danger, .ghost { padding: 9px 14px; border-radius: 7px; border: 1px solid transparent; font-weight: 800; }
.primary { color: white; background: var(--green); }
.primary:hover { background: var(--green-dark); }
.secondary { color: var(--green-dark); background: var(--mint); }
.danger { color: white; background: var(--red); }
.ghost { color: var(--ink); background: transparent; border-color: var(--line); }
.hidden { display: none !important; }

.table-wrap { overflow-x: auto; }
table { width: 100%; border-collapse: collapse; }
th, td { padding: 13px 15px; text-align: left; border-bottom: 1px solid #e7ebe7; font-size: 13px; }
th { color: var(--muted); background: #f7f8f5; font-size: 11px; text-transform: uppercase; letter-spacing: .08em; }
tr:last-child td { border-bottom: 0; }
.row-button { padding: 5px 0; color: var(--green); background: transparent; border: 0; font-weight: 800; text-align: left; }

.detail-header { display: flex; align-items: start; justify-content: space-between; gap: 20px; margin-bottom: 20px; }
.detail-header h2 { margin: 7px 0; font-family: Montserrat, ui-sans-serif, sans-serif; font-size: clamp(28px, 4vw, 43px); line-height: 1.08; }
.back-button { margin-bottom: 16px; }
.detail-grid { display: grid; grid-template-columns: 1.2fr .8fr; gap: 18px; }
.detail-panel { padding: 20px; }
.detail-panel h3 { margin-top: 0; }
.fact-list { display: grid; gap: 12px; margin: 0; }
.fact-list div { padding-bottom: 10px; border-bottom: 1px solid #e9ede9; }
.fact-list dt { color: var(--muted); font-size: 11px; font-weight: 800; text-transform: uppercase; letter-spacing: .08em; }
.fact-list dd { margin: 3px 0 0; overflow-wrap: anywhere; }
.fact-list a { color: var(--green); }
.editor-form { display: grid; gap: 14px; }
.platform-tabs { display: flex; gap: 7px; margin-bottom: 10px; }
.platform-tabs button { padding: 7px 10px; border: 1px solid var(--line); background: white; border-radius: 999px; font-weight: 700; }
.platform-tabs button.active { color: white; background: var(--blue); }
.draft-editor { min-height: 210px; }
.workflow-box { margin-top: 18px; padding-top: 18px; border-top: 1px solid var(--line); }
.workflow-actions { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 9px; }
.comments { display: grid; gap: 9px; }
.comment { padding: 11px; border-radius: 8px; background: #f4f6f2; }
.comment strong { display: block; font-size: 12px; }
.comment time { color: var(--muted); font-size: 11px; }
.timeline { display: grid; gap: 8px; }
.timeline-item { padding-left: 12px; border-left: 2px solid #cfd8d2; font-size: 12px; }
.article-preview { max-height: 500px; padding: 16px; overflow: auto; white-space: pre-wrap; background: #f5f6f6; border: 1px solid var(--line); border-radius: 8px; font-family: Montserrat, ui-sans-serif, sans-serif; }

.compact-form { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); align-items: end; gap: 12px; padding: 18px; margin-bottom: 18px; }
.cards-list, .connector-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 13px; }
.list-card, .connector-card { padding: 18px; background: white; border: 1px solid var(--line); border-radius: 12px; }
.list-card h3, .connector-card h3 { margin: 4px 0 7px; }
.list-card p, .connector-card p { margin: 4px 0; color: var(--muted); font-size: 13px; }
.connector-card { opacity: .75; }
.connector-credential-form { display:grid; grid-template-columns:minmax(220px,1fr) minmax(220px,1fr) auto; gap:12px; align-items:end; margin-top:14px; }
.connector-status { color: var(--red); font-size: 11px; font-weight: 900; letter-spacing: .1em; text-transform: uppercase; }

.status-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; margin-bottom: 18px; }
.status-card { padding: 22px; }
.status-card h3 { margin: 4px 0 18px; font-family: Montserrat, ui-sans-serif, sans-serif; font-size: 25px; }
.status-card .fact-list, .status-card > div { margin: 7px 0; }
.exclusion-card { color: white; background: var(--ink); }
.exclusion-card .eyebrow { color: #84d6bb; }
.control-row, .inline-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 9px; }
.control-row label { min-width: 230px; margin-left: auto; }
.source-form { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.source-form label:nth-of-type(2), .source-form label:nth-of-type(5) { grid-column: span 2; }
.checkbox { display: flex; grid-auto-flow: column; align-items: center; justify-content: start; gap: 8px; }
.checkbox input { width: auto; }
fieldset { border: 1px solid var(--line); border-radius: 8px; }
legend { color: var(--muted); font-size: 12px; font-weight: 800; }
.progress-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; }
.progress-grid > div { padding: 10px; background: #f5f7f4; border-radius: 8px; }
.asset-importer > #asset-analyze { width: 100%; padding: 16px 20px; margin-bottom: 18px; font-size: 16px; }
.notice { padding: 12px 16px; color: #664712; background: #fff0ce; border: 1px solid #ead5a7; border-radius: 9px; }
.brand-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(210px, 1fr)); gap: 14px; margin: 18px 0; }
.brand-section { margin: 18px 0; padding: 20px; }
.brand-reference { display: grid; gap: 8px; align-content: start; padding: 14px; border: 1px solid var(--line); border-radius: 10px; background: white; }
.brand-reference img { width: 100%; aspect-ratio: 4/3; object-fit: contain; background: #f5f6f6; }
.swatch-row { display: flex; flex-wrap: wrap; gap: 10px; }
.swatch { width: 120px; min-height: 75px; padding: 10px; border: 1px solid var(--line); border-radius: 8px; font-size: 11px; font-weight: 700; }
.decision-card { margin: 12px 0; padding: 14px; border-left: 4px solid #0094d4; background: #f5f6f6; }
.dropzone { display: grid; place-items: center; min-height: 130px; margin: 12px 0; padding: 20px; border: 2px dashed #0094d4; border-radius: 14px; color: #2e3346; background: #f5f6f6; font-weight: 700; }
.dropzone.dragging { color: white; background: #2e3346; }
.asset-importer .compact-form { grid-template-columns: minmax(260px, 1fr) auto; padding: 10px 0; margin: 0; box-shadow: none; border: 0; }
.progress-track { min-height: 32px; margin-top: 12px; padding: 8px 12px; border-radius: 8px; background: #f5f6f6; }
.asset-select { display: flex; align-items: center; gap: 8px; }
.asset-select input { width: auto; }
.banner-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 15px; margin: 18px 0; }
.banner-card { display: grid; gap: 10px; padding: 12px; }
.svg-preview { display: block; width: 100%; max-height: 300px; object-fit: contain; background: #eef1ed; border-radius: 8px; }
.icon-size-strip { display: flex; align-items: end; gap: 14px; min-height: 118px; padding: 10px; background: rgba(255,255,255,.82); border-radius: 8px; color: #212121; }
.icon-size-strip span { display: grid; justify-items: center; gap: 5px; }
.icon-size-strip img { display: block; object-fit: contain; }
td a { display: block; max-width: 300px; color: var(--green); overflow-wrap: anywhere; }
td .inline-actions { min-width: 240px; }
pre { max-width: 100%; overflow: auto; white-space: pre-wrap; }

.toast { position: fixed; right: 20px; bottom: 20px; max-width: 360px; padding: 12px 15px; color: white; background: var(--ink); border-radius: 8px; box-shadow: var(--shadow); transform: translateY(120px); transition: transform .2s; }
.toast.visible { transform: translateY(0); }
.error { color: var(--red); font-weight: 700; }

@media (max-width: 1000px) {
  .summary-grid { grid-template-columns: repeat(2, 1fr); }
  .slot-grid { grid-template-columns: 1fr; }
  .compact-form { grid-template-columns: repeat(2, 1fr); }
  .detail-grid { grid-template-columns: 1fr; }
  .status-grid, .banner-grid { grid-template-columns: 1fr; }
  .source-form { grid-template-columns: repeat(2, 1fr); }
}

@media (max-width: 700px) {
  .topbar { padding: 14px 18px; }
  .mode { display: none; }
  .demo-banner { padding-inline: 15px; }
  .shell { display: block; }
  .sidebar { position: sticky; top: 0; z-index: 3; display: flex; gap: 5px; padding: 8px; overflow-x: auto; border-right: 0; border-bottom: 1px solid var(--line); }
  .nav-item { width: auto; flex: 0 0 auto; margin: 0; padding: 8px 10px; font-size: 12px; }
  main { padding: 22px 14px 60px; }
  .view-heading { align-items: start; flex-direction: column; }
  .summary-grid, .form-grid, .cards-list, .connector-grid, .connector-credential-form, .compact-form, .source-form, .progress-grid { grid-template-columns: 1fr; }
  .intake-file-grid { grid-template-columns: 1fr; }
  .source-form label:nth-of-type(2), .source-form label:nth-of-type(5) { grid-column: auto; }
  .wide { grid-column: auto; }
  .activity-item { grid-template-columns: 1fr; gap: 2px; }
  .detail-header { flex-direction: column; }
}
.visual-generation-editor { display:grid; gap:.65rem; padding:1rem; border:1px solid var(--line); border-radius:12px; background:var(--soft); }
.visual-generation-editor label { display:grid; gap:.35rem; font-weight:700; }
.visual-generation-prompt { min-height:7rem; resize:vertical; }
.visual-generation-progress { width:100%; height:.8rem; accent-color:var(--blue); }
.rejection-origin { display:flex; flex-wrap:wrap; gap:.5rem 1rem; align-items:center; margin:.75rem 0; }
.rejection-origin span { flex:1 1 30rem; }
.x-draft-exact-preview { display:block; width:min(100%,480px); max-height:300px; margin:.65rem 0; object-fit:contain; border:1px solid var(--line); border-radius:8px; background:var(--soft); }
.publication-panel { margin: 1rem 0; }
.publication-heading { display:flex; align-items:flex-start; justify-content:space-between; gap:1rem; }
.publication-heading h3 { margin:.2rem 0; }
.publication-state-grid { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:.75rem; margin:1rem 0; }
.publication-state-grid > div { padding:.75rem; border:1px solid var(--line); border-radius:8px; background:var(--paper-soft); }
.publication-state-grid dt { font-size:.7rem; letter-spacing:.08em; text-transform:uppercase; color:var(--muted); }
.publication-state-grid dd { margin:.35rem 0 0; overflow-wrap:anywhere; }
.publication-blockers { border-left:4px solid var(--danger); background:#fff5f3; padding:.8rem 1rem; }
.publication-blockers:focus { outline:3px solid color-mix(in srgb, var(--danger) 35%, transparent); outline-offset:2px; }
.publication-blockers ul { margin:.5rem 0 0; }
.publication-ready { border-left:4px solid var(--mint); background:#effbf7; padding:.8rem 1rem; }
.publication-connection-action { display:flex; flex-wrap:wrap; align-items:center; gap:.45rem .75rem; margin:.8rem 0; padding:.8rem 1rem; border-left:4px solid var(--warning); background:#fff8e8; }
.publication-connection-action button { margin-left:auto; }
.publication-controls { display:flex; flex-wrap:wrap; align-items:center; gap:.65rem; margin:1rem 0; }
.publication-controls .blocked-action { border:1px solid var(--danger); background:#fff5f3; color:var(--danger); cursor:pointer; font-weight:700; }
.publication-controls input,.publication-controls select { width:auto; min-width:13rem; }
.publication-media-form { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:.75rem; border-top:1px solid var(--line); padding-top:1rem; }
.publication-media-form h4,.publication-media-form p,.publication-media-form button { grid-column:1/-1; }
.publication-activity { border-top:1px solid var(--line); margin-top:1rem; padding-top:1rem; }
.publication-activity-row { display:flex; flex-wrap:wrap; align-items:center; gap:.65rem; padding:.55rem 0; border-top:1px solid var(--line); }
.publication-activity-row .error-text { color:var(--danger); flex-basis:100%; }
@media (max-width:900px) { .publication-state-grid,.publication-media-form { grid-template-columns:1fr; } }

.publication-featured{display:flex;align-items:center;gap:.7rem;margin:1rem 0;padding:.85rem 1rem;border:1px solid var(--border);border-radius:12px}.publication-featured input{width:20px;height:20px}.publication-featured small{margin-left:auto;color:var(--muted)}

.youtube-snapshot-picker { display: grid; gap: 12px; margin-top: 12px; padding: 14px; border: 1px solid var(--line); border-radius: 12px; background: #f5f6f6; }
.youtube-snapshot-grid { display: grid; grid-template-columns: repeat(auto-fit,minmax(150px,1fr)); gap: 12px; }
.youtube-snapshot-option { display: grid; gap: 7px; padding: 8px; border: 1px solid var(--line); border-radius: 10px; background: white; }
.youtube-snapshot-option img { width: 100%; aspect-ratio: 16/9; object-fit: contain; border-radius: 6px; background: #111; }
.youtube-custom-time { display: flex; flex-wrap: wrap; align-items: end; gap: 10px; }
.youtube-custom-time label { min-width: 190px; flex: 1; }

.publication-matrix td { min-width:10rem; vertical-align:top; }
.publication-matrix td:first-child { min-width:18rem; }
.publication-matrix td:last-child { min-width:12rem; }
.publication-matrix td > strong,
.publication-matrix td > small,
.destination-cell > * { display:block; margin-bottom:.35rem; }
.destination-cell .badge { display:inline-block; }
.destination-cell a { font-weight:700; }
.layout-manager { display:grid; gap:.75rem; }
.layout-row {
  display:grid;
  grid-template-columns:2rem 2rem minmax(15rem,1fr) auto auto auto;
  gap:1rem;
  align-items:center;
  margin:0;
}
.layout-row[draggable="true"] { cursor:grab; }
.layout-row[draggable="true"]:active { cursor:grabbing; }
.drag-handle { color:var(--muted); font-size:1.25rem; letter-spacing:-.3rem; }
.layout-position {
  display:grid;
  place-items:center;
  width:2rem;
  height:2rem;
  border-radius:50%;
  background:var(--paper-soft);
}
.layout-story strong,
.layout-story small { display:block; }

@media (max-width:1050px) {
  .layout-row { grid-template-columns:2rem 2rem 1fr; }
  .layout-row > label,
  .layout-row > .inline-actions { grid-column:3; }
  .publication-matrix { min-width:72rem; }
}
.translation-manager{margin:20px 0;padding:24px}
.translation-manager-heading{display:flex;align-items:flex-start;justify-content:space-between;gap:24px}
.translation-manager-heading h3{margin:2px 0 7px}
.translation-manager-heading p:last-child{max-width:820px;margin:0;color:var(--muted)}
.translation-original{flex:0 0 auto;padding:9px 13px;border:1px solid #0094d4;border-radius:999px;color:#007fb8;background:rgba(0,148,212,.08);font-size:12px;font-weight:850}
.translation-choices{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:10px;margin:20px 0}
.translation-choice{display:grid;grid-template-columns:auto 1fr;gap:9px 10px;align-items:start;padding:13px;border:1px solid var(--line);border-radius:12px;background:var(--paper-soft)}
.translation-choice input{margin-top:3px}
.translation-choice span{display:grid;gap:3px;min-width:0}
.translation-choice small{color:var(--muted);font-size:11px;line-height:1.35}
.translation-choice .badge{grid-column:2;width:max-content}
.translation-actions{margin-top:0}
.translation-previews{display:grid;gap:8px;margin-top:18px}
.translation-previews details{padding:10px 12px;border:1px solid var(--line);border-radius:10px}
@media(max-width:1100px){.translation-choices{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:680px){.translation-manager-heading{flex-direction:column}.translation-choices{grid-template-columns:1fr}}

/* scheduler live progress */
.scheduler-progress-cell { min-width: 200px; }
.scheduler-progress-bar { width: 180px; height: 8px; accent-color: var(--blue); display: block; margin-bottom: 4px; }
.scheduler-progress-stats { font-size: 11px; color: #6b7480; margin-top: 2px; }
.scheduler-progress-state { font-size: 11px; color: #0f766e; margin-top: 2px; }
.scheduler-progress-cell-idle { color: #8a919b; }

/* ===== Roundups (Stage 2) ===== */
.roundups-layout { display: grid; grid-template-columns: 260px 1fr; gap: 16px; margin-top: 12px; }
.roundups-list { background: #fff; border: 1px solid #e5e7eb; border-radius: 8px; padding: 12px; min-height: 300px; }
.roundups-list-heading { font-size: 11px; text-transform: uppercase; letter-spacing: 0.06em; color: #6b7480; margin: 10px 0 4px; }
.roundups-list-heading:first-child { margin-top: 0; }
.roundups-list-item { display: flex; flex-direction: column; align-items: flex-start; gap: 2px; width: 100%; text-align: left; padding: 8px 10px; margin-bottom: 4px; background: transparent; border: 1px solid transparent; border-radius: 6px; cursor: pointer; }
.roundups-list-item:hover { background: #f5f7fa; border-color: #e5e7eb; }
.roundups-list-item.active { background: #eff6ff; border-color: #93c5fd; }
.roundups-list-item strong { font-size: 13px; }
.roundups-list-item .muted { font-size: 11px; }
.roundups-detail { background: #fff; border: 1px solid #e5e7eb; border-radius: 8px; padding: 16px; min-height: 300px; }
.roundup-detail-header { display: flex; justify-content: space-between; align-items: flex-start; gap: 16px; margin-bottom: 12px; }
.roundup-detail-header h3 { margin: 4px 0; }
.roundup-detail-header .actions { display: flex; gap: 8px; flex-shrink: 0; }
.roundup-items { padding: 12px; margin-top: 12px; }
.roundup-items h4 { margin: 0 0 8px; font-size: 13px; }
.roundup-item { display: flex; align-items: center; gap: 10px; padding: 8px; border: 1px solid #e5e7eb; border-radius: 6px; margin-bottom: 6px; background: #fff; cursor: grab; }
.roundup-item.excluded { opacity: 0.5; background: #f9fafb; }
.roundup-item.dragging { opacity: 0.4; }
.roundup-item .drag-handle { color: #b5bcc7; cursor: grab; font-size: 14px; user-select: none; padding: 0 4px; }
.roundup-item .pos { font-family: ui-monospace, monospace; color: #6b7480; font-size: 11px; min-width: 26px; }
.roundup-item .grow { flex: 1; min-width: 0; }
.roundup-item .grow strong { display: block; font-size: 13px; line-height: 1.3; }
.roundup-item .grow p { margin: 2px 0 0; font-size: 11px; }
.stack-field { display: flex; flex-direction: column; gap: 6px; margin: 12px 0; }
.stack-field textarea { padding: 8px; border: 1px solid #e5e7eb; border-radius: 6px; font-family: inherit; font-size: 13px; resize: vertical; }
.stack-field button { align-self: flex-start; }
.inline-field { display: inline-flex; align-items: center; gap: 6px; font-size: 12px; color: #6b7480; }
.inline-field select { padding: 4px 6px; border: 1px solid #e5e7eb; border-radius: 4px; }

/* Delivery status indicators (added 2026-09-08) */
.status-ok { color: #22c55e; font-weight: 500; }
.status-warn { color: #f59e0b; font-weight: 500; }
.delivery-status { margin-top: 4px; font-size: 12px; }
.intro-dirty-flag { margin-left: 8px; font-size: 12px; }

/* Update Bot — the exact Markdown that will be appended to the article.
   Bordered and monospace so an editor can see the real line breaks and the
   source link before approving, rather than a paraphrase of them. Brand blue
   (#0094d4) matches .decision-card's own accent. */
.dev-proposed { margin: 10px 0; }
.dev-proposed-body {
  margin: 4px 0 0;
  padding: 10px 12px;
  background: #ffffff;
  border: 1px solid #cfd8de;
  border-left: 3px solid #0094d4;
  border-radius: 3px;
  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  font-size: 12.5px;
  line-height: 1.55;
  color: #212121;
  white-space: pre-wrap;
  overflow-wrap: anywhere;
}

/* DECORATED CARDS 2026-09-16 --------------------------------------------- */
.decor-controls { border:1px solid rgba(0,148,212,.28); border-radius:10px; padding:14px 16px; margin:14px 0; }
.decor-controls legend { font-weight:700; padding:0 6px; }
.decor-controls > p { color:#475569; margin:.2rem 0 .8rem; }
.decor-controls label { display:block; margin:.45rem 0; }
/* display:block above centres a checkbox above its text. Toggles must read as
   one line: box, then label, left-aligned. */
.decor-controls label.overlay-toggle { display:flex; align-items:center; gap:.5rem;
  margin:.7rem 0; font-weight:600; }
.decor-controls label.overlay-toggle input[type=checkbox] { width:auto; margin:0; flex:0 0 auto; }
.decor-controls label { font-weight:600; color:#334155; font-size:.9rem; }
.decor-controls select, .decor-controls textarea { font-weight:400; margin-top:.25rem; }
.decor-controls select, .decor-controls textarea { width:100%; }
.decor-controls input[type=range] { width:100%; }
.decor-controls.unavailable { opacity:.55; }
.decor-advice { list-style:none; padding:0; margin:.5rem 0 0; }
.decor-advice .warn { background:rgba(234,179,8,.12); border-left:3px solid #eab308;
  padding:.4rem .6rem; margin:.3rem 0; border-radius:3px; font-size:.86rem; }
/* The preview is a real 4:5 / 9:16 card, so cap it by HEIGHT -- capping width
   would let a 9:16 card run off the bottom of the panel. */
.decor-preview { display:flex; gap:12px; align-items:flex-start; margin-top:.8rem; flex-wrap:wrap; }
.decor-preview-image, .decor-preview-video { max-height:420px; max-width:100%; width:auto;
  border-radius:8px; border:1px solid rgba(15,23,42,.14); background:#0f172a; }
.decor-preview-video.hidden, .decor-controls input[type=file].hidden { display:none; }

/* Decorated card inside the post preview.
   It must NOT inherit .media-preview's platform aspect box + object-fit:cover --
   that exists to crop a publisher image to the platform shape, and it sliced the
   headline off the top of a 4:5 card. The card is final artwork: show it whole,
   capped by HEIGHT so a 9:16 card cannot run past the preview. */
.media-stage.decor-stage { overflow: visible; aspect-ratio: auto; min-height: 0; }
.decor-post-wrap { display:block; width:100%; aspect-ratio:auto; overflow:visible;
  background:none; min-height:0; }
.decor-post-media { display:block !important; width:auto !important; height:auto !important;
  max-height:460px; max-width:100%; margin:0 auto; object-fit:contain !important;
  aspect-ratio:auto !important; border-radius:8px; }
.decor-post-wrap.needs-render .decor-post-media { opacity:.72; }
.decor-pending { display:block; margin:.55rem auto 0; max-width:34rem; text-align:center;
  background:rgba(234,179,8,.14); border-left:3px solid #eab308; color:#713f12;
  padding:.45rem .7rem; border-radius:3px; font-size:.85rem; }

/* Whether the decorated card is actually the media that will post. The panel
   used to preview a finished card with the toggle off, which read as ready. */
.decor-usage { margin:.15rem 0 .6rem; padding:.4rem .6rem; border-radius:3px;
  font-size:.85rem; font-weight:600; }
.decor-usage.active { background:rgba(16,185,129,.12); border-left:3px solid #10b981; color:#065f46; }
.decor-usage.inactive { background:rgba(239,68,68,.10); border-left:3px solid #ef4444; color:#7f1d1d; }
.decor-controls.decor-off .decor-preview { opacity:.5; }

/* Label every card preview with whether it is the media that will post. Two
   unlabelled near-identical cards side by side is how an operator ends up
   thinking the preview is showing a stale image. */
.decor-shot { margin:0; display:flex; flex-direction:column; gap:.35rem; }
.decor-shot.hidden { display:none; }
.decor-shot-label { font-size:.8rem; font-weight:600; padding:.25rem .45rem;
  border-radius:3px; max-width:100%; }
.decor-shot-label.outgoing { background:rgba(16,185,129,.12); color:#065f46; }
.decor-shot-label.pending  { background:rgba(234,179,8,.16);  color:#713f12; }

/* SURFACES 2026-09-20 — per-destination selection */
.surface-panel { margin:.6rem 0 1rem; padding:.7rem .9rem; border:1px solid #d5dbe3; border-radius:5px; }
.surface-panel legend { font-weight:600; padding:0 .35rem; }
.surface-rows { display:flex; flex-direction:column; gap:.3rem; margin:.5rem 0; }
.surface-row { display:grid; grid-template-columns:auto 15rem 1fr auto; align-items:center;
  gap:.6rem; padding:.35rem .5rem; border-radius:4px; background:#f7f9fb; cursor:pointer; }
.surface-row:hover { background:#eef3f8; }
.surface-name { font-weight:600; }
.surface-note { color:#5b6773; font-size:.84rem; }
.surface-state { font-size:.84rem; padding:.15rem .5rem; border-radius:3px; white-space:nowrap; }
.surface-state.good { background:rgba(16,185,129,.14); color:#065f46; }
.surface-state.bad { background:rgba(220,38,38,.12); color:#991b1b; white-space:normal; }
.surface-state.pending { background:rgba(245,158,11,.15); color:#92400e; }
.surface-state.off { background:#e8ecf0; color:#6b7480; }
.surface-summary { margin:.4rem 0; font-weight:600; }
.surface-actions { display:flex; gap:.5rem; margin-top:.5rem; flex-wrap:wrap; }
/* Same clipping cause as above: this row did not wrap, so on a phone the main
   publish button ran off the right edge with its text cut mid-sentence. */
.surface-actions > button { flex:1 1 auto; min-width:0; white-space:normal; }
@media (max-width:860px){ .surface-row{ grid-template-columns:auto 1fr; row-gap:.2rem; }
  .surface-note,.surface-state{ grid-column:2; } }

/* SURFACES v2 2026-09-20 — expandable per-destination rows */
.surface-item { border-radius:4px; overflow:hidden; margin-bottom:.25rem; }
.surface-row { display:grid; grid-template-columns:auto auto 14rem 1fr auto; align-items:center;
  gap:.55rem; padding:.4rem .55rem; background:#f7f9fb; cursor:pointer; }
.surface-row:hover { background:#eaf1f8; }
/* THE PER-DESTINATION PUBLISH BUTTON WAS INVISIBLE ON A PHONE.
   `.surface-row` is a 5-column grid; the button was appended as a 6th child,
   so the browser created an implicit 6th column and pushed it past the right
   edge of a narrow viewport. On Pavel's phone the panel simply had no publish
   control at all, while curl proved the server was sending one.
   Give it a full-width row of its own beneath the label, at both widths. */
.surface-row { grid-auto-rows:min-content; }
.surface-publish { grid-column:1 / -1; width:100%; margin:.35rem 0 .1rem;
  padding:.6rem .7rem; font-weight:700; font-size:.95rem; border-radius:5px;
  white-space:normal; line-height:1.25; }
@media (max-width:860px){
  .surface-publish { font-size:1rem; padding:.7rem .7rem; }
}
.surface-caret { color:#5b6773; width:1rem; }
.surface-body { padding:.6rem .8rem .8rem 2.6rem; background:#fdfefe; border-top:1px solid #e3e9ef; }
.surface-body.hidden { display:none; }
.surface-strip { display:flex; gap:.6rem; overflow-x:auto; padding-bottom:.5rem;
  scroll-snap-type:x mandatory; -webkit-overflow-scrolling:touch; }
.surface-tile { margin:0; flex:0 0 auto; width:min(62vw, 260px); scroll-snap-align:start; }
.surface-tile img { width:100%; border:1px solid #d5dbe3; border-radius:3px; display:block; }
.surface-tile figcaption { font-size:.74rem; color:#5b6773; text-align:center; margin-top:.15rem; }
/* The cover slide is a VIDEO when "first slide = video" is ticked. Only
   `.surface-tile img` had a width, so the <video> rendered at zero size and
   the Cover simply vanished from the strip -- the row appeared to start at
   tile 2. Match the still tile exactly so the strip stays aligned. */
.surface-tile-clip { width:100%; aspect-ratio:4/5; object-fit:cover;
  border:1px solid #d5dbe3; border-radius:3px; display:block; background:#000; }
/* The cover slide carries a label so a video first slide is unmistakable even
   before it loads, instead of reading as an empty gap. */
.surface-tile-badge { position:absolute; left:.3rem; top:.3rem; z-index:2;
  background:rgba(0,0,0,.72); color:#fff; font-size:.7rem; line-height:1;
  padding:.22rem .38rem; border-radius:3px; letter-spacing:.02em; }
.surface-tile-wrap { position:relative; display:block; }
.surface-tile figcaption { font-size:.8rem; }
/* Audition bar under each destination's music dropdown. */
.surface-music-player { width:100%; max-width:320px; height:32px; margin:.15rem 0 .35rem; display:block; }
.surface-clip { max-width:180px; border:1px solid #d5dbe3; border-radius:3px; display:block; }
.surface-caption { margin-top:.6rem; padding:.45rem .6rem; background:#f4f7fa;
  border-left:3px solid #0094d4; border-radius:3px; }
.surface-caption-head { display:flex; justify-content:space-between; align-items:center; gap:1rem; }
.surface-caption-body { margin:.3rem 0 0; font-size:.86rem; color:#2b333c; white-space:pre-wrap; }
.surface-trim { font-size:.78rem; color:#5b6773; }
.surface-trim.warn { color:#92400e; font-weight:600; }
.surface-warn { margin:.5rem 0 0; padding:.35rem .55rem; font-size:.84rem;
  background:rgba(245,158,11,.14); color:#92400e; border-radius:3px; }
.surface-empty { margin:0; color:#5b6773; font-size:.88rem; }
@media (max-width:860px){ .surface-row{ grid-template-columns:auto auto 1fr; row-gap:.2rem; }
  .surface-note,.surface-state{ grid-column:3; } .surface-body{ padding-left:1rem; } }

/* Per-destination render settings, inside the row */
.surface-settings { display:flex; flex-wrap:wrap; gap:.75rem; align-items:flex-start;
  margin:0 0 .7rem; padding:.5rem .6rem; background:#eef3f8; border-radius:3px; }
.surface-set-field { display:flex; flex-direction:column; gap:.15rem; font-size:.8rem; }
.surface-set-field > span { color:#44505c; font-weight:600; }
.surface-set { padding:.2rem .35rem; border:1px solid #c6cfd8; border-radius:3px;
  background:#fff; font-size:.84rem; min-width:9rem; }
.surface-secs { min-width:5rem; }
.surface-set-wide .surface-set { min-width:15rem; max-width:22rem; }
.surface-media { max-width:22rem; }
.surface-cover-row { display:flex; align-items:center; gap:.3rem; padding:.25rem 0;
  font-size:.84rem; white-space:nowrap; }
.surface-cover-tick { margin:0; }
.surface-inherit { color:#6b7480; font-size:.74rem; font-style:normal; }
.surface-set-field { min-height:3.1rem; }
.surface-inherit { display:block; min-height:1rem; }



/* ---- Live render bar + publication receipts (2026-09-22) ----------------
   The bar is driven by surface_render_jobs, so it repaints from the server on
   load instead of dying with the tab that started the render. */
.render-bar { margin:.45rem 0 .35rem; }
.render-bar.hidden { display:none; }
.render-bar-track { height:.5rem; border-radius:999px; background:#e3e9f0;
  overflow:hidden; }
.render-bar-fill { height:100%; width:0%; border-radius:999px;
  background:linear-gradient(90deg,#0094d4,#00b4f0);
  transition:width .45s ease; }
.render-bar.done .render-bar-fill { background:#10b981; }
.render-bar.failed .render-bar-fill { background:#dc2626; }
.render-bar-line { display:flex; gap:.5rem; align-items:baseline;
  margin-top:.25rem; font-size:.82rem; }
.render-bar-pct { font-variant-numeric:tabular-nums; font-weight:600;
  color:#1f2937; white-space:nowrap; }
.render-bar-msg { color:#4b5563; }
@media (prefers-reduced-motion:reduce){
  .render-bar-fill { transition:none; } }

/* Receipt sits directly under the destination's own publish button, which is
   the red bar Pavel means. Warn-only: it never disables the button. */
.surface-receipt { grid-column:1 / -1; margin:.1rem 0 .35rem;
  padding:.4rem .55rem; border-radius:4px; font-size:.82rem;
  background:rgba(245,158,11,.13); color:#7c4a03;
  border-left:3px solid #f59e0b; line-height:1.45; }
.surface-receipt strong { color:#6b3d02; }
.receipt-link { margin-left:.5rem; color:#0094d4; text-decoration:underline; }
.receipt-history { margin-top:.25rem; padding-top:.25rem;
  border-top:1px solid rgba(124,74,3,.18); opacity:.85; }
.receipt-history > div { display:flex; gap:.4rem; align-items:baseline; }

.receipt-id { opacity:.8; font-variant-numeric:tabular-nums; }

/* ---- Kobra Steward (2026-09-23) ---- */
.stw-panel{padding:18px 22px;margin-bottom:16px}
.stw-panel h3{margin:0 0 6px}
.stw-choice{display:grid;grid-template-columns:repeat(2,minmax(0,260px));gap:14px;margin:16px 0 12px}
.stw-opt{display:flex;flex-direction:column;align-items:flex-start;gap:6px;padding:14px;border:2px solid var(--line,#d6dde3);border-radius:14px;background:transparent;text-align:left;cursor:pointer;font:inherit;color:inherit}
.stw-opt:hover{border-color:#0094d4}
.stw-opt.stw-on{border-color:#0094d4;background:rgba(0,148,212,.07);box-shadow:0 0 0 3px rgba(0,148,212,.15)}
.stw-opt small{opacity:.75;font-size:12px}
.stw-diagram{display:grid;grid-template-columns:1fr 36%;gap:6px;width:100%;height:70px;padding:8px;border-radius:8px;background:rgba(0,0,0,.05)}
.stw-diagram-left{grid-template-columns:36% 1fr}
.stw-diagram i{display:block;border-radius:5px}
.stw-diagram .stw-text{background:repeating-linear-gradient(180deg,rgba(0,0,0,.18) 0 4px,transparent 4px 10px)}
.stw-diagram .stw-rail{background:rgba(0,148,212,.35)}
.stw-status{font-weight:650;margin:6px 0 2px}
.stw-next ul{margin:8px 0 0;padding-left:18px;line-height:1.7}

/* Kobra Steward -> Steward findings (2026-09-24) */
.stw-f-card{border-top:1px solid var(--line,#e3e6ea);padding:.5rem 0}
.stw-f-card summary{display:flex;justify-content:space-between;gap:1rem;cursor:pointer}
.stw-f-count{font-variant-numeric:tabular-nums;font-weight:600}
.stw-f-list{margin:.4rem 0 0 1.1rem;font-size:.9em}

/* Kobra Steward -> Translation (2026-09-24) */
.stw-t-table{border-collapse:collapse;margin:.4rem 0 .6rem;font-size:.9em}
.stw-t-table th,.stw-t-table td{padding:.25rem .6rem;border-bottom:1px solid var(--line,#e3e6ea);text-align:right}
.stw-t-table th:first-child,.stw-t-table td:first-child{text-align:left}
.stw-t-flag{color:#b45309;font-weight:600}

/* Per-destination live render bars (2026-09-25): tiles and video, read
   from the server job rows so they survive sleep, background and reload. */
.dest-progress { margin:.1rem 0 .45rem 1.9rem; display:grid; gap:.22rem; }
.dest-progress-line { display:grid; grid-template-columns:3.4rem minmax(6rem,14rem) 1fr;
  align-items:center; gap:.55rem; font-size:.8rem; }
.dest-progress-kind { font-weight:600; color:#1f2937; }
.dest-progress-track { height:.42rem; border-radius:999px; background:#e3e9f0; overflow:hidden; }
.dest-progress-fill { height:100%; width:0; border-radius:999px;
  background:linear-gradient(90deg,#0094d4,#00b4f0); transition:width .45s ease; }
.dest-progress-line.running .dest-progress-fill {
  background:repeating-linear-gradient(115deg,#0094d4 0 10px,#27b6ec 10px 20px);
  background-size:40px 100%; animation:destbar 1.1s linear infinite; }
.dest-progress-line.done .dest-progress-fill { background:#10b981; }
.dest-progress-line.failed .dest-progress-fill { background:#dc2626; width:100% !important; }
.dest-progress-line.skip .dest-progress-kind, .dest-progress-line.skip .dest-progress-text { color:#9ca3af; }
.dest-progress-text { color:#4b5563; font-variant-numeric:tabular-nums; overflow-wrap:anywhere; }
.dest-progress-line.failed .dest-progress-text { color:#b91c1c; }
@keyframes destbar { to { background-position:40px 0; } }
@media (prefers-reduced-motion:reduce){ .dest-progress-fill { transition:none; animation:none !important; } }
@media (max-width:640px){ .dest-progress { margin-left:.4rem; }
  .dest-progress-line { grid-template-columns:3rem 1fr; }
  .dest-progress-text { grid-column:1 / -1; } }
.surface-publish:disabled, #surface-publish-all:disabled { opacity:.45; cursor:not-allowed; }
/* 2026-10-05 LinkedIn page kit (article publisher) */
.li-page-kit{display:flex;flex-wrap:wrap;gap:8px;align-items:center;margin:10px 0;padding:10px;border-radius:8px;background:rgba(10,102,194,.07)}
.li-page-kit strong{width:100%}

/* Radar promo video tab. Moved out of an inline <style> in index.html on 2026-10-07: the page's
   Content-Security-Policy (style-src 'self') blocks inline styles, so these rules never applied. */
#promo-video .pv-dest{display:flex;gap:8px;align-items:center;flex-wrap:wrap;padding:6px 0}
#promo-video .pv-grid{display:flex;gap:14px;flex-wrap:wrap}
#promo-video .pv-card{width:230px;display:flex;flex-direction:column;gap:6px}
#promo-video .pv-kit{display:flex;flex-direction:column;gap:6px;margin-top:4px}
#promo-video .pv-kit .button-link,#promo-video .pv-kit button{text-align:center;font-size:13px;padding:7px 8px}
#promo-video .pv-poster{width:230px;border-radius:12px;cursor:pointer;background:#0d111c}
#promo-video .pv-post{font-size:13px;word-break:break-all}
#promo-video .pv-cap{width:100%;box-sizing:border-box;font-size:13px;min-height:120px}
#promo-video progress{width:100%}
#promo-video textarea{width:100%;min-height:90px}
#promo-video .pv-mirror{display:flex;flex-direction:column;gap:4px;border-top:1px solid #e3e6ea;padding-top:6px}

/* 2026-10-08: which home account a conversation was addressed to (NapaPay / Payment Radar) */
.conv-acct { font-weight: 600; }
/* 2026-10-08: "Reply on X yourself" is the backup when Studio can post through the right account */
.gr-xbtn.gr-xbtn-backup, .conv-xbtn.conv-xbtn-backup { background: transparent; color: inherit; border: 1px solid currentColor; }

/* MEDIA_EMBED_V1 (2026-10-09): Video & audio panel */
.media-embed-panel .media-embed-preview{margin:10px 0;max-width:640px}
.media-embed-panel .media-embed-video iframe{width:100%;aspect-ratio:16/9;border:0;border-radius:10px;background:#000}
.media-embed-panel .media-embed-audio iframe{width:100%;height:175px;border:0;border-radius:10px}
.media-embed-panel audio{width:100%}
.media-embed-panel img{max-width:100%;border-radius:10px}
.media-embed-panel .media-embed-toggle{display:inline-flex!important;flex-direction:row!important;align-items:center;gap:6px;font-weight:650;font-size:15px;white-space:nowrap;width:auto;margin:0;text-transform:none;letter-spacing:normal;color:inherit}
.media-embed-panel .media-embed-toggle input{width:auto;margin:0}

/* Review groups (2026-10-10) */
.queue-group-row td{background:var(--surface-2,#f3f6f9);padding:10px 12px;font-size:13px;letter-spacing:.02em}
.queue-group-sub{color:#0b8f9c;font-weight:600}
.queue-priority td:first-child{box-shadow:inset 3px 0 0 #0b84ee}
.queue-hosp{display:inline-block;margin:0 8px 4px 0;padding:2px 8px;border-radius:999px;background:#0b8f9c;color:#fff;font-size:11px;font-weight:700;letter-spacing:.04em;text-transform:uppercase;vertical-align:middle}
.queue-note{display:block;margin-top:3px;color:var(--muted,#5b6675);font-size:12px;line-height:1.4}
.review-nav{margin-top:10px;align-items:center}.review-pos{font-size:12px;color:var(--muted,#5b6675);margin-right:auto}

/* Placement + pipeline (2026-10-10) */
.placement-panel{margin-top:12px;padding:10px 12px;border:1px solid var(--line,#d9dee5);border-radius:8px}
.placement-panel h4{margin:0 0 6px}
.placement-row{display:grid;grid-template-columns:150px 1fr;gap:8px;padding:3px 0;font-size:.92em}
.readiness-ready{background:#dff5e7;color:#14532d}.readiness-not_ready,.readiness-needs_research,.readiness-needs_update{background:#fff4d6;color:#713f12}
.readiness-duplicate,.readiness-stale{background:#eceff3;color:#374151}
.pipeline-panel{margin:12px 0}.pipeline-panel h3{margin:0 0 8px}.pipeline-bad td{background:#fff1f1}
@media (max-width:700px){.placement-row{grid-template-columns:1fr}}
/* Existing editorial desk, compact at iPhone widths. */
#candidate-table{overflow:visible;min-width:0}
.desk-tabs,.desk-actions{display:flex;flex-wrap:wrap;gap:.5rem}
.desk-tabs button{white-space:normal;text-align:left}
.desk-intro{max-width:80ch;margin:1rem 0}
.desk-cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,32rem),1fr));gap:1rem}
.desk-day-groups{display:grid;gap:1.5rem}.desk-day-section{border-top:1px solid var(--border,#334155);padding-top:.75rem}.desk-day-heading{margin:0 0 .75rem;font-size:1.05rem}
.desk-card{border:1px solid var(--border,#334155);border-radius:12px;padding:1rem;min-width:0;overflow-wrap:anywhere}
.desk-card-heading{display:flex;align-items:flex-start;justify-content:space-between;gap:.6rem}
.desk-title{font-size:1.05rem;font-weight:600;text-align:left;white-space:normal;min-width:0}
.desk-card .badge{flex-shrink:0;white-space:normal;max-width:10rem}
.desk-summary,.desk-source,.desk-destination,.desk-evidence,.desk-next,.desk-progress{font-size:.9rem;line-height:1.5;margin:.6rem 0}
.desk-blockers{padding-left:1.2rem;font-size:.9rem;line-height:1.5}
.desk-card blockquote{margin:.6rem 0;padding:.6rem;border-left:3px solid var(--border,#334155);font-size:.9rem}
.desk-actions a{display:inline-flex;align-items:center;text-decoration:none;padding:.55rem .75rem;border-radius:8px;min-height:44px}
.desk-select{display:inline-flex;align-items:center;gap:.4rem}
@media(max-width:600px){
 #queue .view-heading{display:block}#queue .queue-controls{display:grid;grid-template-columns:1fr;min-width:0}
 #queue .queue-controls>*{min-width:0;max-width:100%}#queue input,#queue select{width:100%;min-width:0;box-sizing:border-box}
 #candidate-table{padding:.75rem}.desk-cards{display:block}.desk-card{margin-bottom:.75rem;padding:.75rem}
 .desk-card-heading{display:block}.desk-card-heading .badge{display:inline-block;margin:.4rem 0}
 .desk-tabs{display:grid;grid-template-columns:1fr 1fr}.desk-tabs button{font-size:.82rem;min-height:48px;margin:0}
 .desk-actions>*{max-width:100%;min-height:44px}.desk-card details{min-width:0}
 .workflow-box,.placement-panel,.placement-row{min-width:0;overflow-wrap:anywhere}
}
@media(max-width:600px){#queue input[type="checkbox"]{width:auto;min-width:18px}.desk-select{flex-direction:row;white-space:nowrap;width:auto;gap:.4rem}}

/* Private reading preview: existing Radar palette, saved media and authenticated editor. */
.editorial-reading-package{max-width:900px;margin:0 auto;padding:clamp(18px,4vw,38px);overflow-wrap:anywhere;}
.editorial-reading-package h1{font-size:clamp(25px,4vw,38px);line-height:1.2;}
.editorial-version{font-size:12px;}
.editorial-hero{margin:24px 0;}
.editorial-banner-stage{aspect-ratio:16/9;position:relative;overflow:hidden;}
.editorial-banner-stage .media-preview{height:100%;width:100%;}
.editorial-banner-image{display:block;width:100%;height:100%;}
.editorial-hero figcaption{font-size:12px;margin-top:8px;overflow-wrap:anywhere;}
.editorial-article-body{font-size:17px;line-height:1.7;}
.editorial-article-body h2,.editorial-article-body h3{line-height:1.3;margin-top:28px;}
.editorial-review-notes{border-top:1px solid var(--border);margin-top:28px;padding-top:18px;}
.editorial-review-actions{margin-top:24px;flex-wrap:wrap;}
.editorial-review-actions a{display:inline-block;text-decoration:none;padding:10px 14px;border-radius:6px;}
@media(max-width:650px){.editorial-reading-package{width:100%;min-width:0;box-sizing:border-box;}.editorial-review-actions>*{width:100%;box-sizing:border-box;text-align:center;}.editorial-article-body{font-size:16px;}.editorial-banner-stage .brand-overlay-bottom_bar{max-height:35%;}}

.editorial-source-gallery img{max-width:100%;max-height:260px;object-fit:contain;}.editorial-source-gallery figure{margin:18px 0;}

/* Candidate-specific decisions in the private reading preview. */
.editorial-decision-panel{border-top:1px solid var(--border);margin-top:24px;padding-top:18px;}
.editorial-decision-panel textarea{width:100%;max-width:100%;box-sizing:border-box;min-height:90px;}
.editorial-decision-receipt{margin-top:18px;padding:16px;border:1px solid var(--border);border-radius:8px;overflow-wrap:anywhere;}
.editorial-source-gallery img{display:block;max-width:100%;max-height:240px;object-fit:contain;}
.editorial-source-gallery figure{margin:16px 0;}
.editorial-source-gallery figcaption{font-size:12px;overflow-wrap:anywhere;}