:root {
  color-scheme: dark;
  --ink: #f6edda;
  --muted: #b9c4d4;
  --paper: #071321;
  --surface: #0c1d30;
  --line: #294057;
  --gold: #e5aa3f;
  --green: #329250;
  --green-bright: #43b967;
  font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}

* { box-sizing: border-box; }
[hidden] { display: none !important; }
body { margin: 0; min-width: 320px; background: radial-gradient(circle at 50% 0%, #142d46 0, var(--paper) 42rem); color: var(--ink); }
button, textarea { font: inherit; }
.shell { width: min(100%, 740px); margin: 0 auto; padding: 2rem 1rem 3rem; }
.masthead { padding: 1rem .35rem 1.8rem; text-align: center; border-bottom: 1px solid var(--line); }
.private-label, .proposal-index, h3 { margin: 0 0 .6rem; color: var(--gold); font-size: .76rem; font-weight: 800; letter-spacing: .16em; text-transform: uppercase; }
h1 { margin: 0; font-family: Georgia, serif; font-size: clamp(2rem, 8vw, 3.6rem); font-weight: 500; line-height: 1.04; }
.intro { max-width: 31rem; margin: 1rem auto 0; color: var(--muted); line-height: 1.5; }
.loading, .access-card { margin: 2rem 0; padding: 1.2rem; border: 1px solid var(--line); border-radius: 18px; background: rgba(12, 29, 48, .78); color: var(--muted); }
.queue { margin-top: 1.8rem; }
.queue-heading { display: flex; align-items: end; justify-content: space-between; gap: 1rem; }
.queue-heading h2 { margin: 0; font-family: Georgia, serif; font-size: clamp(2rem, 8vw, 3rem); font-weight: 500; }
.queue-count { flex: none; border: 1px solid var(--line); border-radius: 999px; padding: .35rem .7rem; color: var(--gold); font-size: .82rem; font-weight: 800; }
.queue-intro { margin: .8rem 0 1.2rem; color: var(--muted); line-height: 1.5; }
.alerts-card { display: grid; grid-template-columns: 1fr; gap: .9rem; align-items: center; margin: 0 0 1.2rem; padding: 1rem; border: 1px solid #365b7c; border-radius: 15px; background: rgba(28, 69, 102, .18); }
.alerts-card .private-label { margin-bottom: .4rem; }
.alerts-copy, .alerts-status { margin: 0; color: var(--muted); line-height: 1.45; }
.alerts-status { margin-top: .35rem; color: #b8d8ff; font-size: .84rem; font-weight: 700; }
.alerts-status[data-state="error"] { color: #ffb3a6; }
.alerts-button { min-height: 2.8rem; border: 1px solid #75a7d0; border-radius: 11px; padding: .7rem 1rem; background: #143552; color: white; font-weight: 800; cursor: pointer; }
.alerts-button:disabled { opacity: .6; cursor: wait; }
.batch-scope, .production-scope { margin: 0 0 1.2rem; padding: 1rem; border: 1px solid rgba(229, 170, 63, .42); border-radius: 15px; background: rgba(229, 170, 63, .07); }
.batch-scope p, .production-scope p { margin: 0; line-height: 1.5; }
.batch-scope .private-label { margin-bottom: .5rem; }
.batch-cost, .production-cost { margin-top: .45rem !important; color: #ffd38b; font-weight: 850; }
.batch-boundary, .production-boundary { margin-top: .55rem !important; color: var(--muted); font-size: .84rem; }
.decision-receipt { margin-top: 1.5rem; padding: 1.15rem; border: 1px solid rgba(67, 185, 103, .58); border-radius: 16px; background: rgba(50, 146, 80, .11); }
.decision-receipt .private-label { color: #8fe0a9; }
.receipt-title { margin: 0; color: #f5ffef; font-family: Georgia, serif; font-size: 1.65rem; letter-spacing: normal; text-transform: none; }
.receipt-summary, .receipt-next { margin: .7rem 0 0; color: var(--muted); line-height: 1.5; }
.receipt-note-wrap { margin-top: .9rem; padding: .85rem; border-radius: 11px; background: rgba(0, 0, 0, .2); }
.receipt-note-label { margin: 0 0 .35rem; color: #ffd38b; font-size: .76rem; font-weight: 800; letter-spacing: .09em; text-transform: uppercase; }
.receipt-note { margin: 0; color: #fff9eb; line-height: 1.5; white-space: pre-wrap; }
.queue-list { display: grid; gap: .85rem; }
.queue-item { display: grid; grid-template-columns: 5.5rem 1fr auto; gap: .9rem; align-items: center; min-height: 7.2rem; overflow: hidden; border: 1px solid var(--line); border-radius: 17px; background: linear-gradient(145deg, rgba(15, 37, 60, .98), rgba(7, 19, 33, .98)); color: inherit; text-decoration: none; box-shadow: 0 12px 34px rgba(0,0,0,.18); }
.queue-item:focus-visible { outline: 3px solid var(--gold); outline-offset: 3px; }
.queue-image { width: 100%; height: 100%; min-height: 7.2rem; object-fit: cover; }
.queue-copy { display: grid; gap: .35rem; padding-block: .85rem; }
.queue-title { font-family: Georgia, serif; font-size: 1.18rem; line-height: 1.08; }
.queue-meta { color: var(--muted); font-size: .78rem; line-height: 1.35; }
.queue-status { color: #b8d8ff; font-size: .8rem; font-weight: 800; }
.queue-status[data-decision="approved"] { color: #9fe2b4; }
.queue-status[data-decision="approved_with_changes"] { color: #ffd38b; }
.queue-status[data-decision="changes_requested"] { color: #ffb6a9; }
.queue-arrow { padding-right: 1rem; color: var(--gold); font-size: 1.35rem; }
.proposal-list { display: grid; gap: 1.5rem; margin-top: 1.5rem; }
.proposal { overflow: hidden; border: 1px solid var(--line); border-radius: 20px; background: linear-gradient(145deg, rgba(15, 37, 60, .98), rgba(7, 19, 33, .98)); box-shadow: 0 18px 50px rgba(0,0,0,.25); }
.back-link { display: block; padding: 1rem 1.2rem; border-bottom: 1px solid var(--line); color: #c8d9eb; font-weight: 750; text-decoration: none; }
.back-link:hover { color: white; }
.proposal-image-wrap { position: relative; aspect-ratio: 9 / 11; background: #142337; }
.proposal-image { width: 100%; height: 100%; object-fit: cover; display: block; }
.duration { position: absolute; right: .9rem; bottom: .9rem; border: 1px solid var(--gold); border-radius: 999px; padding: .32rem .62rem; background: rgba(5, 17, 28, .85); color: #ffca73; font-weight: 750; }
.proposal-body { padding: 1.25rem; }
.proposal-title { margin: 0 0 1rem; font-family: Georgia, serif; font-size: clamp(1.75rem, 7vw, 2.7rem); font-weight: 500; line-height: 1.05; }
.story-truth { margin: 0 0 1.35rem; color: var(--muted); line-height: 1.55; }
.proposal section { margin-top: 1.45rem; }
blockquote { margin: 0; padding: 1rem; border-left: 3px solid var(--gold); background: rgba(0,0,0,.16); color: #fff9eb; font-family: Georgia, serif; font-size: 1.1rem; line-height: 1.55; }
.listen-button { width: 100%; margin-top: .8rem; padding: .78rem 1rem; border: 1px solid #587696; border-radius: 12px; background: #10243b; color: var(--ink); font-weight: 750; cursor: pointer; }
.listen-button:disabled { opacity: .7; cursor: wait; }
.audio-note, .disclosure { margin: .55rem 0 0; color: var(--muted); font-size: .84rem; line-height: 1.45; }
.visual-beats, .sources { display: grid; gap: .65rem; margin: 0; padding-left: 1.25rem; color: var(--muted); line-height: 1.5; }
.feedback-label { display: grid; gap: .55rem; margin-top: 1.55rem; color: var(--ink); font-weight: 750; }
.feedback { width: 100%; resize: vertical; border: 1px solid #39546f; border-radius: 12px; padding: .8rem; background: #071421; color: var(--ink); line-height: 1.4; }
.actions { display: grid; grid-template-columns: 1fr; gap: .7rem; margin-top: .85rem; }
.approve, .approve-with-changes, .revise { min-height: 3.15rem; border-radius: 12px; padding: .75rem 1rem; font-weight: 800; cursor: pointer; }
.approve { border: 1px solid var(--green-bright); background: linear-gradient(135deg, var(--green-bright), var(--green)); color: white; }
.approve-with-changes { border: 1px solid var(--gold); background: rgba(229, 170, 63, .12); color: #ffd38b; }
.revise { border: 1px solid #657891; background: transparent; color: var(--ink); }
.approve:disabled, .approve-with-changes:disabled, .revise:disabled { opacity: .55; cursor: wait; }
.review-status { min-height: 1.4rem; margin: .85rem 0 0; color: #a7d9b7; font-weight: 650; }
.review-status[data-state="error"], .loading[data-state="error"] { color: #ffb3a6; }
@media (min-width: 560px) { .shell { padding-inline: 1.5rem; } .alerts-card { grid-template-columns: 1fr auto; } .proposal-image-wrap { aspect-ratio: 16 / 10; } .actions { grid-template-columns: 1fr 1fr 1fr; } }
@media (max-width: 380px) { .queue-item { grid-template-columns: 4.7rem 1fr auto; } .queue-image { min-height: 6.8rem; } }
