/* HPMG dashboard shared themed stylesheet. Colors outside token definitions use var(--token). */
:root { color-scheme: dark; --bg:#070a12; --panel:#0d1322; --panel2:#111827; --line:#243044; --text:#e5e7eb; --muted:#94a3b8; --blue:#60a5fa; --green:#22c55e; --red:#ef4444; --yellow:#f59e0b; }
* { box-sizing:border-box } body { margin:0; font-family: Aptos, ui-sans-serif, system-ui, -apple-system, Segoe UI, sans-serif; background: radial-gradient(circle at top left,var(--panel2) 0,var(--bg) 38%); color:var(--text); overflow-x:hidden; }
a { color:inherit; text-decoration:none } .app { display:flex; min-height:100vh; }
.sidebar { width:286px; padding:0; background:rgba(8,13,25,.92); border-right:1px solid var(--line); position:sticky; top:0; height:100vh; transition:width .18s ease, transform .18s ease; z-index:30; }
.sidebar-content { padding:22px; height:100%; overflow-x:hidden; overflow-y:auto; display:flex; flex-direction:column; -webkit-overflow-scrolling:touch; overscroll-behavior:contain; transition:opacity .14s ease, transform .18s ease; }
.sidebar.collapsed { width:0; border-right-color:transparent; } .sidebar.collapsed .sidebar-content { opacity:0; pointer-events:none; transform:translateX(-18px); }
.pull-tab { position:absolute; right:-32px; top:96px; width:32px; height:46px; border:1px solid var(--line); border-left:0; border-radius:0 12px 12px 0; background:var(--panel); color:var(--text); display:grid; place-items:center; padding:0; font-size:20px; box-shadow:10px 12px 30px rgba(0,0,0,.28); }
.pull-tab:focus-visible { outline:2px solid var(--blue); outline-offset:3px } .sidebar.collapsed .pull-tab { right:-32px; }
.brand { margin-bottom:22px; display:block; border-radius:14px; padding:4px 6px; margin-left:-6px } .brand-link:hover { background:var(--hover-bg) } .brand-link:focus-visible { outline:2px solid var(--blue); outline-offset:3px } .brand h1 { font-size:20px; margin:0 0 5px } .brand p { margin:0; color:var(--muted); font-size:13px }
.nav { display:flex; gap:12px; padding:12px; border:1px solid transparent; border-radius:14px; margin:9px 0; align-items:center; flex:0 0 auto; } .nav:hover,.nav.active { background:var(--hover-bg); border-color:var(--line) }
.nav-ops { margin:8px 0; border:1px solid var(--line); border-radius:16px; background:color-mix(in srgb,var(--panel) 54%,transparent); overflow:hidden; flex:0 0 auto; }
.nav-ops summary { list-style:none; cursor:pointer; padding:12px; color:var(--text); display:flex; flex-direction:column; gap:3px; font-weight:900; }
.nav-ops summary::-webkit-details-marker { display:none; }
.nav-ops summary::after { content:'▾'; align-self:flex-end; margin-top:-28px; color:var(--muted); transition:transform .16s ease; }
.nav-ops[open] summary::after { transform:rotate(180deg); }
.nav-ops summary small { color:var(--muted); font-size:12px; font-weight:700; }
.nav-ops .nav { margin:6px 8px 8px; padding:10px; }
.nav-ops .nav:first-of-type { margin-top:0; }
.nav span { width:10px; height:36px; border-radius:20px; flex:0 0 auto } .nav small { display:block; color:var(--muted); margin-top:3px; font-size:12px }
.nav strong { display:flex; align-items:center; gap:7px; flex-wrap:wrap } .nav-chip { display:inline-flex; align-items:center; justify-content:center; min-width:22px; height:22px; padding:0 7px; border-radius:999px; background:var(--yellow); color:var(--panel); font-style:normal; font-size:12px; font-weight:900; line-height:1; box-shadow:0 0 0 2px color-mix(in srgb,var(--yellow) 18%,transparent) }
.nav-alert { border-color:color-mix(in srgb,var(--yellow) 55%,var(--line)); background:linear-gradient(135deg,color-mix(in srgb,var(--yellow) 16%,var(--panel)),color-mix(in srgb,var(--red) 10%,var(--surface-strong))); margin-bottom:14px } .nav-alert:hover,.nav-alert.active { border-color:var(--yellow); background:linear-gradient(135deg,color-mix(in srgb,var(--yellow) 22%,var(--panel)),color-mix(in srgb,var(--red) 14%,var(--surface-strong))) } .nav-alert-icon { width:36px !important; height:36px !important; display:grid; place-items:center; background:color-mix(in srgb,var(--yellow) 18%,var(--surface-strong)); color:var(--yellow); border:1px solid color-mix(in srgb,var(--yellow) 55%,var(--line)); font-size:18px }
.nav-section-label { margin:18px 8px 6px; color:var(--muted); font-size:11px; text-transform:uppercase; letter-spacing:.14em; font-weight:900 }
.settings-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:16px } .settings-card { display:block; min-width:0; transition:border-color .16s ease, transform .16s ease, background .16s ease } .settings-card:hover,.settings-card:focus-visible { border-color:var(--blue); transform:translateY(-1px); outline:none; background:rgba(17,24,39,.92) } .settings-card h2 { margin:0 0 8px } .settings-card p { margin:0 0 14px; line-height:1.4 } .settings-link-list { display:flex; gap:8px; flex-wrap:wrap; margin-top:12px }
.sidebar-footer { margin-top:auto; padding-top:16px; flex:0 0 auto }
.main { flex:1; width:100%; padding:28px; max-width:1760px; min-width:0; overflow-x:hidden; } .main > *,.main > section > * { min-width:0; max-width:100% } .top { display:flex; justify-content:space-between; gap:18px; align-items:flex-start; margin-bottom:22px }
.pill { padding:8px 11px; border:1px solid var(--line); color:var(--muted); border-radius:999px; font-size:12px; background:rgba(17,24,39,.7); display:inline-block }
.grid { display:grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap:16px } .card { background:rgba(13,19,34,.87); border:1px solid var(--line); border-radius:18px; padding:18px; box-shadow:0 20px 60px rgba(0,0,0,.25) }
.card h2,.card h3 { margin-top:0 } .card p,.card .muted { overflow-wrap:anywhere } .muted { color:var(--muted) } .stat { font-size:30px; font-weight:800; margin:8px 0 }
.chat { display:grid; grid-template-columns: 1fr 390px; gap:18px } .messages { min-height:460px; max-height:62vh; overflow:auto; padding:10px; background:rgba(2,6,23,.55); border-radius:16px; border:1px solid var(--line) }
.msg { margin:12px; padding:13px 15px; border-radius:15px; white-space:pre-wrap; line-height:1.45 } .user { background:var(--blue); margin-left:12% } .assistant { background:var(--panel2); margin-right:12% }
textarea,input,select { width:100%; border:1px solid var(--line); background:var(--input-bg); color:var(--text); border-radius:13px; padding:12px; font:inherit } textarea { min-height:130px; resize:vertical }
button,.btn { border:0; background:linear-gradient(135deg,var(--blue),var(--blue)); color:white; padding:11px 14px; border-radius:12px; font-weight:700; cursor:pointer; display:inline-block }
.btn2 { background:var(--panel2); border:1px solid var(--line) } .danger { background:var(--red) } .approve { background:linear-gradient(135deg,var(--green),var(--green)); }
.action { border:1px solid var(--line); border-radius:14px; padding:12px; margin:12px 0; background:var(--surface-strong) } .status { font-size:12px; text-transform:uppercase; letter-spacing:.08em; color:var(--muted)}
.status.pending { color:var(--yellow) } .status.running { color:var(--blue) } .status.completed { color:var(--green) } .status.failed { color:var(--red) } .status.cancelled { color:var(--muted) } .status-dot { display:inline-block; width:.65em; height:.65em; border-radius:999px; background:currentColor; margin-right:6px; vertical-align:middle; box-shadow:0 0 0 3px color-mix(in srgb,currentColor 16%,transparent) } .status-label { font-weight:900 } .status-id { color:var(--muted) }
.actions-row { display:flex; gap:8px; flex-wrap:wrap; align-items:center } .mini { font-size:12px; padding:7px 9px } .kbd { font-family:ui-monospace,Menlo,monospace; background:var(--input-bg); border:1px solid var(--line); border-radius:8px; padding:2px 6px }
.notice { border:1px solid var(--green); background:color-mix(in srgb,var(--green) 10%,var(--panel)); color:var(--green); border-radius:14px; padding:12px; margin:12px 0 }
.warn { border-color:var(--yellow); background:color-mix(in srgb,var(--yellow) 10%,var(--panel)); color:var(--yellow) }
.job-meta { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:10px; margin:12px 0 } .job-meta div { background:var(--input-bg); border:1px solid var(--line); border-radius:12px; padding:10px }
.progress { height:9px; background:var(--line); border-radius:999px; overflow:hidden; margin:6px 0 12px } .bar { height:100%; background:linear-gradient(90deg,var(--green),var(--blue)); border-radius:999px }
.artifact { display:block; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; margin:4px 0 }
.meta-page { display:grid; gap:18px; min-width:0 } .meta-hero { display:grid; grid-template-columns:1fr minmax(260px,360px); gap:18px; align-items:stretch; margin-bottom:4px; min-width:0 }
.eyebrow { margin:0 0 8px; color:var(--blue); font-size:12px; text-transform:uppercase; letter-spacing:.14em; font-weight:800 }
.snapshot-card,.summary-primary,.meta-metric,.meta-job { background:linear-gradient(180deg,rgba(15,23,42,.96),rgba(8,13,25,.96)); border:1px solid var(--line); border-radius:18px; box-shadow:0 18px 55px rgba(0,0,0,.24) }
.sop-hero { display:grid; grid-template-columns:1fr minmax(260px,360px); gap:18px; align-items:stretch; margin-bottom:18px; min-width:0 }
.sop-job-card { background:linear-gradient(180deg,rgba(15,23,42,.96),rgba(8,13,25,.96)); border:1px solid var(--line); border-radius:18px; padding:18px; box-shadow:0 18px 55px rgba(0,0,0,.24); min-width:0 }
.sop-job-card h2 { margin:0 0 6px; overflow-wrap:anywhere } .sop-markdown h2,.sop-markdown h3,.sop-markdown h4 { margin-top:18px } .sop-markdown p,.sop-markdown li { line-height:1.42; overflow-wrap:anywhere }
.sop-pre { white-space:pre-wrap; overflow-wrap:anywhere; word-break:break-word; background:var(--input-bg); border:1px solid var(--line); border-radius:14px; padding:14px; max-height:520px; overflow:auto; font-family:ui-monospace,Menlo,monospace; font-size:12px; line-height:1.38 }
.sop-editor textarea { white-space:pre-wrap; overflow:auto } .sop-two { grid-template-columns:1fr 1fr } .sop-summary { margin-bottom:18px } .sop-jobs { margin-top:18px }
.creative-sops-page { display:grid; gap:18px; min-width:0 }
.creative-sops-table-wrap { margin-top:4px }
.creative-sops-page .mba-account-table { width:100%; min-width:980px; border-collapse:collapse; background:var(--surface-bg); color:var(--text) }
.creative-sops-page .mba-account-table th,.creative-sops-page .mba-account-table td { color:var(--text); border-bottom:1px solid var(--line); padding:10px 11px; vertical-align:top; text-align:left }
.creative-sops-page .mba-account-table th { color:var(--muted); font-size:11px; text-transform:uppercase; letter-spacing:.07em; background:var(--surface-muted) }
.creative-sops-page .mba-account-table td strong { color:var(--text) }
.creative-sops-page .mba-account-table tbody tr:last-child td { border-bottom:0 }
.creative-sops-page .mba-account-table-wrap { overflow-x:auto; border:1px solid var(--line); border-radius:16px; background:var(--surface-bg) }
.creative-sops-table td small { display:block; color:var(--muted); margin-top:4px; max-width:520px; overflow-wrap:anywhere }
.creative-sops-shared { margin-top:4px }
.admin-users-page { display:grid; gap:18px; min-width:0 }
.admin-users-page .mba-account-table-wrap { overflow-x:auto; border:1px solid var(--line); border-radius:16px; background:var(--surface-bg) }
.admin-users-page .mba-account-table { width:100%; min-width:920px; border-collapse:collapse; background:var(--surface-bg); color:var(--text) }
.admin-users-page .mba-account-table th,.admin-users-page .mba-account-table td { color:var(--text); border-bottom:1px solid var(--line); padding:12px; vertical-align:top; text-align:left }
.admin-users-page .mba-account-table th { color:var(--muted); font-size:11px; text-transform:uppercase; letter-spacing:.07em; background:var(--surface-muted) }
.admin-users-page .mba-account-table td strong,.admin-users-page .mba-account-table label { color:var(--text) }
.admin-users-page .mba-account-table td small { display:block; color:var(--muted); margin-top:4px; overflow-wrap:anywhere }
.admin-users-page .mba-account-table tbody tr:last-child td { border-bottom:0 }
.admin-users-page .user-cap-grid { grid-template-columns:repeat(2,minmax(180px,1fr)); gap:10px; margin-bottom:10px }
.admin-users-page .status-control { display:flex; gap:8px; align-items:center; padding:8px 10px; border:1px solid var(--line); border-radius:12px; background:var(--input-bg) }
.admin-users-page .status-control input { width:auto; min-width:16px }
.blockers-page { display:grid; gap:18px; min-width:0 } .blocker-total { display:grid; place-items:center; min-width:76px; height:76px; border-radius:22px; background:linear-gradient(135deg,color-mix(in srgb,var(--yellow) 22%,var(--panel)),color-mix(in srgb,var(--red) 12%,var(--surface-strong))); border:1px solid color-mix(in srgb,var(--yellow) 55%,var(--line)); color:var(--yellow); font-size:38px; font-weight:950; box-shadow:0 18px 55px color-mix(in srgb,var(--yellow) 13%,transparent) }
.tasks-page { display:grid; gap:18px; min-width:0 } .task-quick-add { background:linear-gradient(180deg,color-mix(in srgb,var(--panel2) 88%,transparent),var(--surface-bg)) } .task-form { display:grid; gap:12px } .task-form-grid { grid-template-columns:minmax(220px,1.2fr) minmax(180px,.8fr) minmax(150px,.5fr) minmax(220px,1fr); align-items:end } .task-tabs { display:flex; gap:8px; flex-wrap:wrap; align-items:center } .task-tabs .pill { border-color:var(--line); background:var(--surface-strong) } .task-tabs .active-filter { color:var(--text); border-color:var(--blue); box-shadow:0 0 0 2px var(--focus-ring) } .tasks-table-wrap { overflow-x:auto; border:1px solid var(--line); border-radius:16px; background:var(--surface-bg) } .tasks-table { width:100%; min-width:980px; border-collapse:collapse; color:var(--text) } .tasks-table th,.tasks-table td { color:var(--text); border-bottom:1px solid var(--line); padding:12px; vertical-align:top; text-align:left } .tasks-table th:first-child,.tasks-table td:first-child { min-width:220px } .tasks-table th:nth-child(4),.tasks-table td:nth-child(4) { min-width:240px } .tasks-table th:last-child,.tasks-table td:last-child { min-width:170px } .tasks-table th { color:var(--muted); font-size:11px; text-transform:uppercase; letter-spacing:.07em; background:var(--surface-muted) } .tasks-table td strong { display:block; margin-bottom:4px; overflow-wrap:anywhere } .tasks-table td small { display:block; color:var(--muted); margin-top:4px; overflow-wrap:anywhere } .tasks-table details summary { margin:0; color:var(--text) } .tasks-table details p { max-width:460px; margin:8px 0 0; color:var(--muted); line-height:1.4; overflow-wrap:anywhere } .task-actions { min-width:190px } .task-actions form { display:flex; gap:7px; align-items:center; margin:0 } .task-reassign-form { flex:1 1 220px } .task-reassign-form select { min-width:150px; padding:8px }
.blockers-table-wrap { overflow-x:auto; border:1px solid var(--line); border-radius:16px; background:var(--surface-bg) } .blockers-table { width:100%; min-width:780px; border-collapse:collapse; color:var(--text) } .blockers-table th,.blockers-table td { color:var(--text); border-bottom:1px solid var(--line); padding:12px; vertical-align:top; text-align:left } .blockers-table th { color:var(--muted); font-size:11px; text-transform:uppercase; letter-spacing:.07em; background:var(--surface-muted) } .blockers-table td strong { display:block; overflow-wrap:anywhere; line-height:1.35 } .blockers-table td small { display:block; color:var(--muted); margin-top:5px } .blockers-table tr.needs-human { background:color-mix(in srgb,var(--yellow) 5%,transparent) } .blockers-table tr.source-unavailable { opacity:.82 }
.creative-sop-detail-grid { grid-template-columns:minmax(0,1fr) minmax(0,1fr) }
.creative-sop-companion-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:18px; min-width:0 }
.creative-sop-companion { max-height:620px; overflow:auto }
.creative-sop-markdown { line-height:1.55; overflow-wrap:anywhere }
.creative-sop-markdown h1,.creative-sop-markdown h2,.creative-sop-markdown h3,.creative-sop-markdown h4 { margin:1em 0 .45em; line-height:1.2 }
.creative-sop-markdown p { margin:.55em 0 }
.creative-sop-markdown blockquote { margin:.7em 0; padding:9px 12px; border:1px solid var(--line); background:var(--surface-strong); color:var(--muted); border-radius:10px }
.creative-sop-markdown ul { padding-left:22px }
.creative-sop-edit-form { margin-bottom:18px }
.creative-sop-submit-row { display:flex; justify-content:flex-end; padding-top:10px }
.competitor-pages-page { display:grid; gap:18px; min-width:0 }
.competitor-hero { align-items:stretch }
.competitor-hero-stat { min-width:180px; border:1px solid var(--line); border-radius:18px; padding:16px; background:linear-gradient(180deg,var(--panel2),var(--surface-strong)); display:flex; flex-direction:column; justify-content:center; gap:5px }
.competitor-hero-stat span { color:var(--muted); font-size:12px; text-transform:uppercase; letter-spacing:.08em; font-weight:800 }
.competitor-hero-stat strong { font-size:34px; line-height:1 }
.competitor-pending { display:grid; gap:12px }
.competitor-review-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:14px }
.competitor-review-card { border:1px solid var(--line); border-radius:18px; padding:16px; background:linear-gradient(180deg,var(--panel2),var(--surface-strong)); min-width:0 }
.competitor-review-main { display:flex; justify-content:space-between; gap:14px; align-items:flex-start }
.competitor-review-card h2 { margin:0 0 5px; overflow-wrap:anywhere }
.competitor-evidence-full { margin:12px 0; line-height:1.45; overflow-wrap:anywhere }
.competitor-review-actions,.competitor-inline-reject,.competitor-row-reject { display:flex; gap:8px; align-items:center; flex-wrap:wrap }
.competitor-inline-reject,.competitor-row-reject { flex:1 1 260px }
.competitor-inline-reject input,.competitor-row-reject input { min-width:130px; flex:1 1 140px }
.competitor-status { display:inline-flex; align-items:center; border:1px solid var(--line); border-radius:999px; padding:6px 9px; font-size:12px; font-weight:900 }
.competitor-status.active { color:var(--green); background:color-mix(in srgb,var(--green) 12%,var(--panel)); border-color:color-mix(in srgb,var(--green) 55%,var(--line)) }
.competitor-status.suggested { color:var(--yellow); background:color-mix(in srgb,var(--yellow) 12%,var(--panel)); border-color:color-mix(in srgb,var(--yellow) 55%,var(--line)) }
.competitor-status.paused { color:var(--muted); background:var(--surface-strong) }
.competitor-status.rejected { color:var(--red); background:color-mix(in srgb,var(--red) 12%,var(--panel)); border-color:color-mix(in srgb,var(--red) 55%,var(--line)) }
.competitor-table-wrap { overflow-x:auto; border:1px solid var(--line); border-radius:16px; background:var(--surface-bg) }
.competitor-pages-page .mba-account-table { width:100%; min-width:1040px; border-collapse:collapse; background:var(--surface-bg); color:var(--text) }
.competitor-pages-page .mba-account-table th,.competitor-pages-page .mba-account-table td { color:var(--text); border-bottom:1px solid var(--line); padding:10px 11px; vertical-align:top; text-align:left }
.competitor-pages-page .mba-account-table th { color:var(--muted); font-size:11px; text-transform:uppercase; letter-spacing:.07em; background:var(--surface-muted) }
.competitor-pages-page .mba-account-table td strong { color:var(--text) }
.competitor-pages-page .mba-account-table tbody tr:last-child td { border-bottom:0 }
.competitor-table-wrap td small { display:block; margin-top:5px; color:var(--muted); max-width:460px; overflow-wrap:anywhere }
.competitor-actions { min-width:260px }
.competitor-filter-card { padding:12px 14px }
.competitor-filter-form .job-meta { align-items:end }
.competitor-form-grid { margin-bottom:14px }
.competitor-detail-grid { grid-template-columns:minmax(0,1.5fr) minmax(260px,.65fr) }
.competitor-dl { display:grid; grid-template-columns:150px minmax(0,1fr); gap:10px 14px; margin:0 }
.competitor-dl dt { color:var(--muted); font-size:12px; text-transform:uppercase; letter-spacing:.08em; font-weight:900 }
.competitor-dl dd { margin:0; overflow-wrap:anywhere }
.competitor-notes { white-space:pre-wrap; overflow-wrap:anywhere; background:var(--input-bg); border:1px solid var(--line); border-radius:12px; padding:10px; max-height:260px; overflow:auto }
.md-editor-shell { border:1px solid var(--line); background:var(--surface-strong); border-radius:18px; margin:12px 0 16px; overflow:hidden; min-width:0 }
.md-editor-toolbar { display:flex; justify-content:space-between; gap:14px; align-items:flex-start; padding:12px; border-bottom:1px solid var(--line); background:linear-gradient(180deg,var(--panel2),var(--surface-strong)) }
.md-editor-toolbar strong { display:block; margin-bottom:3px } .md-editor-toolbar .muted { display:block; font-size:12px }
.md-editor-body { display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:0; min-height:460px }
.md-pane { display:flex; flex-direction:column; min-width:0; margin:0; border-right:1px solid var(--line) } .md-pane:last-child { border-right:0 }
.md-pane > span { padding:9px 12px; color:var(--muted); font-size:11px; text-transform:uppercase; letter-spacing:.08em; border-bottom:1px solid var(--line); background:var(--surface-strong) }
.md-source { flex:1; min-height:460px; resize:vertical; border:0; border-radius:0; background:var(--input-bg); font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,monospace; line-height:1.55; font-size:14px }
.md-preview { flex:1; min-height:460px; overflow:auto; padding:18px 22px; background:var(--surface-strong); line-height:1.6 }
.md-preview h1,.md-preview h2,.md-preview h3,.md-preview h4 { margin:1.05em 0 .45em; line-height:1.22 } .md-preview h1:first-child,.md-preview h2:first-child,.md-preview h3:first-child { margin-top:0 }
.md-preview p { margin:.55em 0 } .md-preview ul,.md-preview ol { padding-left:22px } .md-preview li { margin:.35em 0 }
.md-preview code { background:var(--input-bg); border:1px solid var(--line); border-radius:6px; padding:1px 5px; color:var(--blue) } .md-preview pre { background:var(--input-bg); border:1px solid var(--line); border-radius:12px; padding:12px; overflow:auto }
.md-editor-shell.preview-only .md-pane:first-child,.md-editor-shell.edit-only .md-preview-pane { display:none } .md-editor-shell.preview-only .md-editor-body,.md-editor-shell.edit-only .md-editor-body { grid-template-columns:1fr }
.md-editor-shell.is-expanded { position:fixed; inset:14px; z-index:90; margin:0; display:flex; flex-direction:column; box-shadow:0 30px 120px rgba(0,0,0,.72); background:var(--surface-strong) }
.md-editor-shell.is-expanded .md-editor-body { flex:1; min-height:0 } .md-editor-shell.is-expanded .md-source,.md-editor-shell.is-expanded .md-preview { min-height:0; height:100%; resize:none }
body.md-focus-active { overflow:hidden }
.snapshot-card { padding:18px; display:flex; flex-direction:column; justify-content:center; gap:6px } .snapshot-card span,.summary-primary span,.meta-metric span,.job-stamp span,.last-done span { color:var(--muted); font-size:12px; text-transform:uppercase; letter-spacing:.08em }
.snapshot-card strong,.summary-primary strong { font-size:18px } .snapshot-card small,.summary-primary small,.meta-metric small,.last-done small { color:var(--muted) } .last-task-summary strong { display:block; font-size:20px; line-height:1.2; max-width:100%; overflow-wrap:anywhere } .last-task-summary small { display:block; margin-top:7px }
.meta-summary { display:grid; grid-template-columns:minmax(340px,2.1fr) repeat(5,1fr); gap:12px } .summary-primary,.meta-metric { padding:15px } .meta-metric { display:flex; flex-direction:column; gap:5px; min-width:0 } .meta-metric strong { font-size:26px; overflow-wrap:anywhere } .meta-metric.live strong { color:var(--green) } .meta-metric.danger strong { color:var(--red) }
.jobs-stack { display:grid; gap:14px; min-width:0 } .meta-job { padding:18px; min-width:0 } .job-head { display:flex; justify-content:space-between; gap:16px; align-items:flex-start; min-width:0 } .job-head h3 { margin:7px 0 0; overflow-wrap:anywhere } .job-stamp { text-align:right; min-width:220px }
.last-done { margin:14px 0; padding:14px; border-radius:16px; background:var(--surface-strong); border:1px solid var(--line); display:grid; gap:4px } .last-done strong { color:var(--text); font-size:18px }
.meta-strip { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:10px } .job-progress { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:14px; margin:16px 0 }
.progress-row { background:var(--surface-strong); border:1px solid var(--line); border-radius:14px; padding:12px } .progress-label { display:flex; justify-content:space-between; gap:10px; margin-bottom:6px } .progress-label span { color:var(--muted) }
.job-detail-grid { display:grid; grid-template-columns:minmax(260px,.8fr) 1.2fr; gap:14px } .job-detail-grid section { background:var(--surface-strong); border:1px solid var(--line); border-radius:14px; padding:14px } .job-detail-grid h4 { margin:0 0 8px } .job-detail-grid li { margin-bottom:7px; line-height:1.32 }
.dupe-selection-block { margin:16px 0; background:var(--surface-strong); border:1px solid var(--line); border-radius:16px; padding:14px; min-width:0 } .dupe-selection-head { display:flex; justify-content:space-between; gap:16px; align-items:flex-start; margin-bottom:12px } .dupe-selection-head h3 { margin:0 0 5px; overflow-wrap:anywhere } .dupe-selection-head .muted { margin:0 0 6px; line-height:1.35; overflow-wrap:anywhere } .dupe-generated { min-width:150px; text-align:right } .dupe-generated span { color:var(--muted); font-size:11px; text-transform:uppercase; letter-spacing:.08em } .dupe-generated strong { display:block; margin-top:4px; color:var(--text) }
.dupe-card-grid { display:grid; grid-template-columns:1fr; gap:12px; min-width:0 } .dupe-card { display:grid; grid-template-columns:156px minmax(0,1fr) minmax(220px,.45fr); gap:14px; background:var(--input-bg); border:1px solid var(--line); border-radius:14px; padding:12px; min-width:0; align-items:start } .dupe-preview { width:156px; aspect-ratio:16/10; border-radius:12px; overflow:hidden; background:var(--text); border:1px solid var(--line); display:grid; place-items:center } .dupe-preview img { width:100%; height:100%; object-fit:cover; display:block } .dupe-preview-empty { padding:10px; text-align:center; color:var(--muted); font-size:11px } .dupe-preview-empty strong { display:block; color:var(--text); margin-bottom:4px } .dupe-card-body { min-width:0; display:grid; gap:9px } .dupe-card-title { display:flex; justify-content:space-between; gap:12px; align-items:flex-start } .dupe-card-title h4 { margin:0; font-size:16px; line-height:1.22; overflow-wrap:anywhere } .dupe-subtitle { margin:4px 0 0; color:var(--muted); font-size:12px; line-height:1.25 } .dupe-count { flex:0 0 auto; border:1px solid var(--text); background:var(--text); color:var(--text); border-radius:999px; padding:4px 8px; font-size:11px; font-weight:800 } .muted-count { border-color:var(--line); background:var(--panel2); color:var(--muted) } .dupe-primary,.dupe-why { margin:0; font-size:13px; line-height:1.4; color:var(--text); overflow-wrap:anywhere } .dupe-why { color:var(--muted) } .dupe-source-list { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:7px } .dupe-source-list div { background:var(--surface-strong); border:1px solid var(--line); border-radius:10px; padding:7px; min-width:0 } .dupe-source-list span,.dupe-asset-ids span { display:block; color:var(--muted); font-size:10px; text-transform:uppercase; letter-spacing:.06em } .dupe-source-list strong { display:block; color:var(--text); font-size:12px; line-height:1.25; overflow-wrap:anywhere } .dupe-source-list code,.dupe-asset-ids code { color:var(--muted); font-family:ui-monospace,Menlo,monospace; font-size:11px; overflow-wrap:anywhere; word-break:break-word } .dupe-asset-ids { display:flex; flex-wrap:wrap; gap:8px } .dupe-asset-ids span { background:var(--surface-strong); border:1px solid var(--line); border-radius:999px; padding:5px 8px; text-transform:none; letter-spacing:0 } .dupe-card-side { min-width:0; display:grid; gap:9px } .dupe-stats { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:6px } .dupe-stats span { background:var(--surface-strong); border:1px solid var(--line); border-radius:9px; padding:7px; min-width:0 } .dupe-stats em { display:block; font-style:normal; color:var(--muted); font-size:10px; text-transform:uppercase; letter-spacing:.06em } .dupe-stats strong { display:block; font-size:13px; color:var(--text); overflow-wrap:anywhere } .scheduled-selection { margin:12px 0 } .scheduled-selection > summary { color:var(--text); font-weight:900 } .scheduled-selection .dupe-selection-block { margin-top:10px }
.pair-list { list-style:none; padding:0; margin:0; display:grid; gap:8px } .pair-list li { display:flex; justify-content:space-between; gap:12px; border-bottom:1px solid var(--line); padding:7px 0 } .pair-list span { color:var(--muted) }
.health-hero { display:grid; grid-template-columns:1fr minmax(260px,360px); gap:18px; align-items:stretch; margin-bottom:18px; min-width:0 } .health-hero h2 { margin:0 0 5px; font-size:30px }
.metered-nous-fallback-banner { border:2px solid var(--red); background:linear-gradient(135deg,color-mix(in srgb,var(--red) 34%,var(--panel)),color-mix(in srgb,var(--red) 18%,var(--surface-strong))); color:var(--text); border-radius:20px; padding:18px; margin:0 0 18px; box-shadow:0 0 0 1px color-mix(in srgb,var(--red) 35%,transparent),0 22px 70px color-mix(in srgb,var(--red) 18%,transparent) }
.metered-nous-fallback-banner h2 { margin:0 0 8px; color:var(--text); font-size:28px; letter-spacing:-.02em }
.metered-nous-fallback-banner p { margin:6px 0; line-height:1.35 }
.metered-nous-fallback-facts { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:10px; margin-top:12px }
.metered-nous-fallback-facts span { display:block; background:color-mix(in srgb,var(--panel) 72%,transparent); border:1px solid color-mix(in srgb,var(--red) 45%,var(--line)); border-radius:14px; padding:11px; min-width:0 }
.metered-nous-fallback-facts small { display:block; color:var(--text); opacity:.78; font-size:11px; text-transform:uppercase; letter-spacing:.08em; font-weight:900; margin-bottom:5px }
.metered-nous-fallback-facts strong { display:block; font-size:20px; overflow-wrap:anywhere }
.health-grid { margin-top:18px } .health-card { min-width:0 } .health-card h2,.health-card h3 { margin-bottom:14px } .codex-card { grid-column:span 2 }
.health-row { display:flex; justify-content:space-between; gap:14px; align-items:flex-start; margin:10px 0 7px } .health-row strong { display:block; overflow-wrap:anywhere } .health-row small { display:block; color:var(--muted); margin-top:4px; line-height:1.3 } .health-row span { font-size:22px; font-weight:800; color:var(--text); white-space:nowrap }
.health-meter { height:10px; background:var(--panel2); border:1px solid var(--line); border-radius:999px; overflow:hidden; margin-bottom:12px } .health-meter div { height:100%; border-radius:999px; transition:width .18s ease }
.codex-card-head { display:flex; justify-content:space-between; gap:14px; align-items:flex-start; margin-bottom:12px } .codex-card-head h2 { margin:0 0 6px }
.ai-intensity-strip { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:10px; margin:12px 0 14px; min-width:0 } .ai-intensity-metric,.account-ai-pulse span { background:var(--input-bg); border:1px solid var(--line); border-radius:14px; padding:12px; min-width:0; box-shadow:inset 0 1px 0 rgba(255,255,255,.035) } .ai-intensity-metric span { display:block; color:var(--blue); font-size:11px; font-weight:900; text-transform:uppercase; letter-spacing:.08em; margin-bottom:6px } .ai-intensity-metric strong { display:block; color:var(--text); font-size:23px; line-height:1.05; overflow-wrap:anywhere } .ai-intensity-metric small { display:block; color:var(--muted); margin-top:7px; line-height:1.32 }
.codex-account-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px; min-width:0 } .codex-account { background:var(--surface-strong); border:1px solid var(--line); border-radius:16px; padding:14px; min-width:0 } .codex-account.active { border-color:var(--green); background:linear-gradient(180deg,rgba(5,46,22,.42),rgba(7,17,29,.96)); box-shadow:0 0 0 1px rgba(34,197,94,.16) inset }
.codex-account-title { display:flex; justify-content:space-between; gap:10px; align-items:flex-start; margin-bottom:10px } .codex-account-title h3 { margin:0; font-size:22px } .codex-plan-row { display:flex; gap:8px; align-items:center; flex-wrap:wrap; margin-bottom:10px } .active-pill { border-color:var(--green); color:var(--green); background:color-mix(in srgb,var(--green) 14%,var(--panel)) } .standby-pill { color:var(--muted); background:var(--panel2) }
.account-ai-pulse { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:8px; margin:8px 0 12px } .account-ai-pulse strong { display:block; color:var(--yellow); font-size:17px; line-height:1.1; overflow-wrap:anywhere } .account-ai-pulse small { display:block; color:var(--muted); margin-top:4px; font-size:11px; text-transform:uppercase; letter-spacing:.06em } .ai-pace-note { margin:-4px 0 12px; border:1px solid var(--line); border-radius:13px; padding:10px 11px; background:var(--input-bg) } .ai-pace-note strong { display:block; font-size:13px; margin-bottom:3px } .ai-pace-note span { display:block; color:var(--muted); font-size:12px; line-height:1.35 } .ai-pace-note.safe { border-color:var(--green); background:rgba(5,46,22,.34) } .ai-pace-note.safe strong { color:var(--green) } .ai-pace-note.warn { border-color:var(--text); background:rgba(69,26,3,.38) } .ai-pace-note.warn strong { color:var(--yellow) } .ai-pace-note.danger { border-color:var(--red); background:rgba(69,10,10,.42) } .ai-pace-note.danger strong { color:var(--text) }
.provider-health-cards { grid-template-columns:repeat(2,minmax(0,1fr)); }
.provider-health-card { display:flex; flex-direction:column; gap:12px; }
.provider-health-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:10px; }
.provider-health-metric { background:var(--surface-strong); border:1px solid var(--line); border-radius:14px; padding:12px; min-width:0; }
.provider-health-metric span,.provider-health-metric small { display:block; color:var(--muted); }
.provider-health-metric strong { display:block; margin:5px 0; font-size:20px; overflow-wrap:anywhere; }
@media (max-width:760px) { .provider-health-cards,.provider-health-grid { grid-template-columns:1fr; } }
.portal-balance-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:10px; margin:12px 0 } .portal-balance-grid div { background:var(--surface-strong); border:1px solid var(--line); border-radius:14px; padding:12px; min-width:0 } .portal-balance-grid span { display:block; color:var(--muted); font-size:11px; font-weight:900; text-transform:uppercase; letter-spacing:.08em; margin-bottom:5px } .portal-balance-grid strong { display:block; font-size:24px; color:var(--green); overflow-wrap:anywhere } .portal-balance-grid small { color:var(--muted); line-height:1.3 }
@media (max-width: 900px) { .codex-card { grid-column:auto } .ai-intensity-strip { grid-template-columns:repeat(2,minmax(0,1fr)) } .codex-account-grid,.portal-balance-grid { grid-template-columns:1fr } .codex-account-title { display:block } .codex-account-title .pill { margin-top:8px } }
.cooldown-carousel { background:linear-gradient(180deg,rgba(15,23,42,.96),rgba(8,13,25,.96)); border:1px solid var(--line); border-radius:18px; padding:18px; box-shadow:0 18px 55px rgba(0,0,0,.24); overflow:hidden }
.carousel-head { display:flex; justify-content:space-between; gap:18px; align-items:flex-start; margin-bottom:12px } .carousel-head h2 { margin:0 0 5px }
.cooldown-nav { display:flex; gap:8px; flex-wrap:wrap; justify-content:flex-end; align-items:center }
.carousel-position { display:inline-flex; align-items:center; min-height:31px; padding:0 10px; border-radius:999px; background:var(--input-bg); border:1px solid var(--line); color:var(--text); font-size:12px; font-weight:800; letter-spacing:.06em }
.cooldown-track { display:flex; gap:14px; overflow-x:auto; scroll-snap-type:x mandatory; scroll-padding:2px; padding:2px 2px 12px; -webkit-overflow-scrolling:touch }
.cooldown-track::-webkit-scrollbar { height:9px } .cooldown-track::-webkit-scrollbar-thumb { background:var(--line); border-radius:999px }
.cooldown-card { flex:0 0 min(520px,86vw); scroll-snap-align:start; background:var(--surface-strong); border:1px solid var(--line); border-radius:16px; padding:16px; min-height:265px }
.cooldown-card h3 { margin:8px 0 12px; overflow-wrap:anywhere } .cooldown-card p { line-height:1.38; overflow-wrap:anywhere; word-break:break-word } .cooldown-card .kbd { overflow-wrap:anywhere }
.usage-headers { margin-top:12px; background:var(--input-bg); border:1px solid var(--line); border-radius:12px; padding:10px } .usage-headers strong { display:block; color:var(--text); font-size:12px; text-transform:uppercase; letter-spacing:.08em; margin-bottom:6px } .usage-headers pre { margin:0; white-space:pre-wrap; overflow-wrap:anywhere; word-break:break-word; color:var(--muted); font-size:12px; line-height:1.35; font-family:ui-monospace,Menlo,monospace }
.cooldown-facts { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:8px; margin:12px 0 }
.cooldown-facts span { background:var(--input-bg); border:1px solid var(--line); border-radius:12px; padding:9px; color:var(--muted); font-size:12px } .cooldown-facts strong { display:block; color:var(--text); margin-top:3px; overflow-wrap:anywhere }
.home-overview { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:16px; margin-bottom:18px } .overview-card { background:linear-gradient(180deg,rgba(15,23,42,.96),rgba(8,13,25,.96)); border:1px solid var(--line); border-radius:20px; padding:18px; box-shadow:0 18px 55px rgba(0,0,0,.24); min-width:0 } .overview-card.primary { display:grid; grid-template-columns:1fr auto; gap:14px; align-items:start } .overview-card.wide { grid-column:1 / -1 } .big-number { font-size:56px; line-height:.95; font-weight:900; color:var(--text) }
.queue-totals { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:10px; margin:12px 0 } .queue-totals span,.perf-window { background:var(--surface-strong); border:1px solid var(--line); border-radius:14px; padding:12px; min-width:0 } .queue-totals strong,.perf-window strong { display:block; font-size:22px; color:var(--text) } details summary { cursor:pointer; color:var(--text); font-weight:800; margin-top:10px } .mini-list small { display:block; color:var(--muted); margin-top:3px } .section-head { display:flex; justify-content:space-between; gap:16px; align-items:flex-start; margin-bottom:12px }
.perf-matrix { overflow-x:auto; display:grid; gap:10px; padding-bottom:4px } .perf-header,.perf-row { display:grid; grid-template-columns:minmax(128px,.62fr) repeat(var(--product-count,3),minmax(220px,1fr)); gap:10px; align-items:stretch; min-width:min(100%, 920px) }
.perf-product-head,.perf-row-label { background:var(--surface-strong); border:1px solid var(--line); border-radius:14px; padding:12px; min-width:0 } .perf-product-head h3 { margin:0 0 5px; font-size:18px } .perf-product-head small,.perf-row-label small { display:block; color:var(--muted); line-height:1.35; overflow-wrap:anywhere } .perf-row-label span { display:block; color:var(--text); font-size:15px; font-weight:900; letter-spacing:.03em; text-transform:uppercase }
.perf-window { display:grid; gap:8px } .perf-window span { color:var(--muted); font-size:12px; text-transform:uppercase; letter-spacing:.08em } .perf-window .perf-spend { font-size:18px; color:var(--text) } .perf-window small { display:block; color:var(--muted); margin-top:0; line-height:1.35 } .perf-window.unavailable strong { color:var(--yellow) }
.roas-badge { border-radius:15px; border:1px solid var(--line); background:var(--input-bg); padding:11px 12px; min-height:92px; display:flex; flex-direction:column; justify-content:center; box-shadow:inset 0 1px 0 rgba(255,255,255,.04) } .roas-badge span { color:inherit; opacity:.82 } .roas-badge strong { display:block; font-size:38px; line-height:.95; letter-spacing:-.05em; color:inherit } .roas-badge em { margin-top:5px; font-size:12px; font-style:normal; font-weight:800 } .perf-window.roas-red .roas-badge { color:var(--text); background:linear-gradient(180deg,rgba(127,29,29,.72),rgba(69,10,10,.72)); border-color:var(--red) } .perf-window.roas-yellow .roas-badge { color:var(--yellow); background:linear-gradient(180deg,rgba(120,53,15,.72),rgba(69,26,3,.72)); border-color:var(--yellow) } .perf-window.roas-green .roas-badge { color:var(--green); background:linear-gradient(180deg,rgba(20,83,45,.72),rgba(5,46,22,.72)); border-color:var(--green) } .perf-window.roas-na .roas-badge { color:var(--muted); background:var(--input-bg); border-color:var(--line) } .compact-stats { margin:18px 0 } .home-activity-grid { grid-template-columns:1fr 1fr; margin-top:18px } .disk-codex-grid { align-items:stretch } .services-grid { grid-template-columns:minmax(0,1fr) }

.media-buyer-config-page { display:grid; gap:16px; min-width:0 } .media-buyer-config-page .mba-metric { background:var(--surface-bg); border-color:var(--line); color:var(--text); box-shadow:0 10px 28px rgba(15,23,42,.08) } .media-buyer-config-page .mba-metric span,.media-buyer-config-page .mba-metric small { color:var(--muted) } .media-buyer-config-page .mba-metric strong { color:var(--text) } .media-buyer-config-page .settings-grid { margin-bottom:14px } .media-buyer-config-page label { display:block; color:var(--text); font-weight:800; font-size:13px } .media-buyer-config-page label input,.media-buyer-config-page label select,.media-buyer-config-page label textarea { margin-top:6px; font-weight:500 } .media-buyer-config-page .card,.media-buyer-config-page .sop-job-card,.media-buyer-config-page .mba-account-table-wrap { background:var(--surface-bg); border-color:var(--line); color:var(--text) } .mba-account-table-wrap { overflow-x:auto; border:1px solid var(--line); border-radius:16px } .media-buyer-config-page .mba-account-table { width:100%; min-width:1080px; border-collapse:collapse; background:var(--surface-bg) } .media-buyer-config-page .mba-account-table th,.media-buyer-config-page .mba-account-table td { color:var(--text); border-bottom:1px solid var(--line); padding:10px 11px; vertical-align:top; text-align:left } .media-buyer-config-page .mba-account-table th { color:var(--muted); font-size:11px; text-transform:uppercase; letter-spacing:.07em; background:var(--surface-muted) } .media-buyer-config-page .mba-account-table td strong { color:var(--text) } .media-buyer-config-page td small,.media-buyer-config-page a small,.source-note { display:block; color:var(--muted); margin-top:4px; overflow-wrap:anywhere } .mba-config-filters .job-meta { grid-template-columns:repeat(4,minmax(0,1fr)) } .product-badge,.active-state,.mutation-state { display:inline-flex; align-items:center; border-radius:999px; border:1px solid transparent; padding:5px 9px; font-size:12px; font-weight:900; white-space:nowrap } .media-buyer-config-page .status-control { gap:8px; justify-content:flex-start; min-width:220px; width:auto; white-space:normal } .media-buyer-config-page .status-control input { margin:0; width:auto } .product-novapaw { background:color-mix(in srgb,var(--green) 14%,var(--panel)); color:var(--green); border-color:var(--green) } .product-novalift { background:color-mix(in srgb,var(--blue) 14%,var(--panel)); color:var(--blue); border-color:var(--blue) } .product-novapod { background:color-mix(in srgb,var(--yellow) 14%,var(--panel)); color:var(--yellow); border-color:var(--yellow) } .product-cross_product { background:var(--surface-muted); color:var(--muted); border-color:var(--line) } .active-state.active { background:color-mix(in srgb,var(--green) 14%,var(--panel)); color:var(--green); border-color:var(--green) } .active-state.idle { color:var(--muted); background:transparent; border-color:var(--line) } .mutation-state.allowed { background:color-mix(in srgb,var(--green) 14%,var(--panel)); color:var(--green); border-color:var(--green) } .mutation-state.blocked { background:color-mix(in srgb,var(--red) 14%,var(--panel)); color:var(--red); border-color:var(--red) } .plain-meta { color:var(--text) } .strategy-actions { display:flex; gap:7px; flex-wrap:wrap; margin-top:7px } .strategy-edit-layout { display:grid; grid-template-columns:minmax(0,1fr) minmax(260px,360px); gap:16px; align-items:start } .strategy-edit-accounts ul { margin:8px 0 0; padding-left:18px } .strategy-edit-accounts li { margin:7px 0; line-height:1.35 } .config-source-note { border:1px solid var(--line); background:var(--surface-muted); border-radius:14px; padding:11px 12px; color:var(--muted); line-height:1.35 } :root[data-dashboard-theme="night"] .product-novapaw { background:rgba(34,197,94,.14); color:var(--green); border-color:var(--green) } :root[data-dashboard-theme="night"] .product-novalift { background:rgba(96,165,250,.14); color:var(--blue); border-color:var(--text) } :root[data-dashboard-theme="night"] .product-novapod { background:rgba(168,85,247,.16); color:var(--text); border-color:var(--text) } :root[data-dashboard-theme="night"] .product-cross_product { background:var(--panel2); color:var(--muted); border-color:var(--line) } :root[data-dashboard-theme="night"] .active-state.active,:root[data-dashboard-theme="night"] .mutation-state.allowed { background:rgba(34,197,94,.14); color:var(--green); border-color:var(--green) } :root[data-dashboard-theme="night"] .mutation-state.blocked { background:rgba(239,68,68,.14); color:var(--text); border-color:var(--red) } @media (max-width:900px) { .strategy-edit-layout { grid-template-columns:1fr } .media-buyer-config-page .mba-account-table { min-width:980px } }.media-buyer-accounts-page,.media-buyer-account-detail-page { display:grid; gap:16px; min-width:0 } .mba-toggles,.mba-filter-row,.mba-chip-row { display:flex; flex-wrap:wrap; gap:8px; align-items:center } .mba-toggles { justify-content:flex-end } .mba-toggles .active,.mba-filter-row .active { border-color:var(--text); color:var(--text); background:var(--text) } .mba-summary { display:grid; grid-template-columns:repeat(6,minmax(0,1fr)); gap:10px } .mba-metric { background:var(--surface-strong); border:1px solid var(--line); border-radius:14px; padding:12px; min-width:0 } .mba-metric span { display:block; color:var(--muted); font-size:11px; text-transform:uppercase; letter-spacing:.08em; margin-bottom:5px } .mba-metric strong { display:block; font-size:22px; overflow-wrap:anywhere } .mba-account-list,.mba-campaign-list { display:grid; gap:14px } .mba-account-card,.mba-campaign-card { background:linear-gradient(180deg,rgba(15,23,42,.96),rgba(8,13,25,.96)); border:1px solid var(--line); border-radius:18px; padding:18px; box-shadow:0 18px 55px rgba(0,0,0,.24); min-width:0 } .mba-account-table-wrap { overflow-x:auto; border:1px solid var(--line); border-radius:18px; background:linear-gradient(180deg,rgba(15,23,42,.96),rgba(8,13,25,.96)); box-shadow:0 18px 55px rgba(0,0,0,.24) } .mba-account-table { width:100%; min-width:1180px; border-collapse:separate; border-spacing:0 } .mba-account-table th,.mba-account-table td { padding:12px 11px; border-bottom:1px solid var(--line); vertical-align:top; text-align:left } .mba-account-table th { position:sticky; top:0; background:var(--text); z-index:1; color:var(--muted); font-size:11px; text-transform:uppercase; letter-spacing:.08em } .mba-account-table th button { width:100%; border:0; background:transparent; color:inherit; font:inherit; cursor:pointer; display:flex; gap:5px; align-items:center; justify-content:flex-start; padding:0 } .mba-account-table tbody tr:hover { background:rgba(34,211,238,.05) } .mba-account-table tbody tr:last-child td { border-bottom:0 } .mba-account-table .num { text-align:right; white-space:nowrap } .mba-account-table .num strong { color:var(--text) } .mba-account-cell a { display:grid; gap:5px; min-width:230px } .mba-account-cell strong,.mba-strategy-cell strong { color:var(--text) } .mba-strategy-cell { min-width:220px } .mba-strategy-cell small { display:block; margin-top:4px; color:var(--muted); line-height:1.35 } .mba-tw-cell { min-width:190px } .pill.compact { padding:5px 8px; font-size:11px } .mba-product-pill { background:var(--surface-muted); border-color:var(--line); color:var(--text) } .sort-indicator { color:var(--text); min-width:10px } .mba-account-head { display:flex; justify-content:space-between; gap:16px; align-items:flex-start; min-width:0 } .mba-account-head h1,.mba-account-head h2 { margin:0 0 6px; overflow-wrap:anywhere } .mba-metrics { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:10px; margin:14px 0 } .mba-detail-block { background:var(--surface-strong); border:1px solid var(--line); border-radius:14px; padding:12px; margin:12px 0 } .mba-detail-block h3 { margin:0 0 8px } .pill.active { border-color:var(--text); color:var(--text); background:var(--text) }
.dupe-campaign-page { display:grid; gap:16px; min-width:0 } .dupe-campaign-hero { display:grid; grid-template-columns:minmax(0,1fr) minmax(240px,360px); gap:16px; align-items:stretch; background:linear-gradient(180deg,rgba(15,23,42,.96),rgba(8,13,25,.94)); border:1px solid var(--line); border-radius:20px; padding:18px; box-shadow:0 18px 55px rgba(0,0,0,.24); min-width:0 } .dupe-campaign-hero h1 { margin:0 0 8px; font-size:34px; letter-spacing:-.03em } .dupe-safety-note { margin:10px 0 0; color:var(--green); font-weight:800 } .dupe-campaign-policy { background:var(--surface-strong); border:1px solid var(--line); border-radius:16px; padding:15px; display:flex; flex-direction:column; gap:6px; min-width:0 } .dupe-campaign-policy span,.dupe-campaign-pill em { color:var(--muted); font-size:11px; text-transform:uppercase; letter-spacing:.08em; font-style:normal } .dupe-campaign-policy strong { font-size:24px; color:var(--text) } .dupe-campaign-policy small { color:var(--muted); line-height:1.35 } .dupe-campaign-toolbar { display:flex; justify-content:space-between; gap:12px; align-items:center; flex-wrap:wrap } .dupe-product-toggle,.dupe-bucket-tabs { display:flex; gap:8px; flex-wrap:wrap } .dupe-product-link,.dupe-bucket-tab,.dupe-sort-link { border:1px solid var(--line); background:var(--surface-strong); border-radius:999px; padding:9px 12px; color:var(--muted); font-weight:800 } .dupe-product-link.active,.dupe-bucket-tab.active,.dupe-sort-link.active { background:var(--text); border-color:var(--blue); color:var(--text) } .dupe-sort-controls { display:flex; gap:8px; align-items:center; flex-wrap:wrap; margin-left:auto } .dupe-sort-controls label { color:var(--muted); font-size:11px; text-transform:uppercase; letter-spacing:.08em; font-weight:900 } .dupe-sort-controls select { background:var(--surface-strong); color:var(--text); border:1px solid var(--line); border-radius:999px; padding:9px 12px; font-weight:800 } .dupe-sort-links { display:flex; gap:6px; flex-wrap:wrap } .dupe-sort-link { font-size:12px; padding:8px 10px } .dupe-bucket-tab strong { margin-left:5px; color:var(--panel2) } .dupe-campaign-summary { display:grid; grid-template-columns:repeat(5,minmax(0,1fr)); gap:10px } .dupe-campaign-pill { border:1px solid var(--line); background:var(--surface-strong); border-radius:14px; padding:10px 12px; display:flex; flex-direction:column; gap:4px; min-width:0 } .dupe-campaign-pill strong { color:var(--text); font-size:17px; overflow-wrap:anywhere } .dupe-campaign-pill.winner strong { color:var(--green) } .dupe-campaign-pill.undetermined strong,.dupe-campaign-pill.warn strong { color:var(--yellow) } .dupe-campaign-pill.loser strong { color:var(--red) } .dupe-campaign-stack { display:grid; gap:14px; min-width:0 } .dupe-campaign-card { display:grid; grid-template-columns:220px minmax(0,1fr) minmax(190px,.32fr); gap:14px; background:linear-gradient(180deg,rgba(15,23,42,.96),rgba(5,10,20,.98)); border:1px solid var(--line); border-radius:20px; padding:14px; min-width:0; box-shadow:0 18px 55px rgba(0,0,0,.22) } .dupe-campaign-card.winner { border-color:var(--green) } .dupe-campaign-card.loser { border-color:var(--red) } .dupe-campaign-card.undetermined { border-color:var(--text) } .dupe-campaign-preview { width:220px; min-height:160px; border-radius:16px; background:var(--input-bg); border:1px solid var(--line); overflow:hidden; display:grid; place-items:center; align-self:start } .dupe-campaign-preview img { width:100%; height:100%; min-height:160px; object-fit:cover; display:block } .dupe-campaign-preview-empty { padding:15px; text-align:center; color:var(--muted) } .dupe-campaign-preview-empty strong { display:block; color:var(--muted); margin-bottom:5px } .dupe-campaign-main,.dupe-campaign-settings { min-width:0 } .dupe-campaign-card-head { display:flex; justify-content:space-between; gap:14px; align-items:flex-start; margin-bottom:10px } .dupe-campaign-card-head h3 { margin:5px 0 3px; overflow-wrap:anywhere; font-size:20px } .dupe-launch-time { text-align:right; min-width:120px } .dupe-launch-time span { display:block; color:var(--muted); font-size:11px; text-transform:uppercase; letter-spacing:.08em } .dupe-launch-time strong { display:block; max-width:160px; overflow-wrap:anywhere; line-height:1.15; font-size:14px } .dupe-campaign-badge { display:inline-flex; border-radius:999px; padding:5px 9px; background:var(--line); color:var(--text); font-size:11px; font-weight:900; text-transform:uppercase; letter-spacing:.07em } .dupe-campaign-badge.winner { background:var(--green); color:var(--green) } .dupe-campaign-badge.loser { background:var(--red); color:var(--text) } .dupe-campaign-badge.undetermined { background:var(--text); color:var(--yellow) } .dupe-campaign-metrics,.dupe-campaign-settings { display:grid; gap:8px } .dupe-campaign-metrics { grid-template-columns:repeat(6,minmax(0,1fr)); margin:10px 0 } .dupe-location-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:10px } .dupe-location-card,.dupe-why-selected,.dupe-campaign-settings,.dupe-campaign-empty { background:var(--surface-strong); border:1px solid var(--line); border-radius:16px; padding:12px; min-width:0 } .dupe-location-card h4,.dupe-why-selected h4,.dupe-campaign-settings h4 { margin:0 0 8px } .dupe-location-list { display:grid; gap:7px } .dupe-location-list div { display:grid; gap:2px; border-bottom:1px solid var(--text); padding-bottom:7px } .dupe-location-list div:last-child { border-bottom:0; padding-bottom:0 } .dupe-location-list span { color:var(--muted); font-size:11px; text-transform:uppercase; letter-spacing:.07em } .dupe-location-list strong { overflow-wrap:anywhere } .dupe-location-list code { color:var(--blue); font-size:11px; overflow-wrap:anywhere; white-space:normal } .dupe-why-selected { margin-top:10px } .dupe-why-selected p { margin:0 0 8px; line-height:1.38; overflow-wrap:anywhere } .dupe-reason-codes,.dupe-warning-chips { display:flex; gap:6px; flex-wrap:wrap } .dupe-reason-codes span,.dupe-warning-chips span { border:1px solid var(--line); background:var(--input-bg); border-radius:999px; padding:5px 8px; color:var(--muted); font-size:12px } .dupe-warning-chips { margin-top:10px } .dupe-warning-chips span { color:var(--yellow); border-color:var(--text); background:color-mix(in srgb,var(--yellow) 10%,var(--panel)) } .dupe-warning-chips span.ok { color:var(--green); border-color:var(--green); background:color-mix(in srgb,var(--green) 14%,var(--panel)) } .dupe-selected-drawer ul { margin:8px 0 0; padding-left:18px } .dupe-selected-drawer li { margin:6px 0 } .dupe-selected-drawer small { display:block; color:var(--muted); margin-top:2px } .dupe-campaign-settings .dupe-campaign-pill { background:var(--input-bg) } .dupe-campaign-empty { padding:24px; text-align:center }
@media (max-width: 1100px) { .media-buyer-accounts-page .section-head,.media-buyer-account-detail-page .section-head { display:block } .mba-toggles { justify-content:flex-start; margin-top:10px } .mba-summary,.mba-metrics { grid-template-columns:repeat(2,minmax(0,1fr)) } .mba-account-head { display:block } .mba-account-head .pill { margin-top:10px } .meta-hero,.meta-summary,.meta-strip,.job-progress,.job-detail-grid,.home-overview,.perf-grid,.sop-hero,.sop-two,.md-editor-body,.settings-grid,.dupe-campaign-hero,.dupe-location-grid { grid-template-columns:1fr } .task-form-grid { grid-template-columns:repeat(2,minmax(0,1fr)) } .task-form-grid label { min-width:0 } .dupe-campaign-card { grid-template-columns:180px minmax(0,1fr) } .dupe-campaign-settings { grid-column:1 / -1; grid-template-columns:repeat(4,minmax(0,1fr)) } .dupe-campaign-preview { width:180px } .section-head { display:block } .job-head { display:block } .job-stamp { text-align:left; margin-top:12px } }
@media (max-width: 900px) { .app,.chat { display:block } .home-overview { display:block } .overview-card { margin-bottom:12px } .overview-card.wide { grid-column:auto } .big-number { font-size:42px } .sidebar { position:fixed; width:280px; height:100dvh; max-height:100dvh; left:0; transform:translateX(0); box-shadow:18px 0 50px rgba(0,0,0,.35) } .sidebar-content { padding-bottom:calc(22px + env(safe-area-inset-bottom, 0px)); max-height:100dvh } .sidebar.collapsed { width:0; transform:translateX(-100%); } .pull-tab { right:-40px; top:18px; width:40px; height:48px } .grid,.home-activity-grid { grid-template-columns:1fr } .main { padding:18px; padding-top:82px; width:100% } }
@media (max-width: 700px) { body { background:var(--app-bg) } .main { padding-left:12px; padding-right:12px } .top { display:block } .meta-page { gap:12px; max-width:100% } .meta-hero { display:block; margin-bottom:0 } .meta-hero h1 { font-size:26px; margin:4px 0 } .meta-hero .muted { font-size:14px; line-height:1.35 } .eyebrow { font-size:10px; letter-spacing:.1em } .snapshot-card { display:none } .meta-summary { grid-template-columns:repeat(3,minmax(0,1fr)); gap:8px; max-width:100%; min-width:0 } .summary-primary { grid-column:1/-1 } .summary-primary,.meta-metric { padding:10px; border-radius:14px; box-shadow:none; min-width:0 } .last-task-summary strong { font-size:15px } .meta-summary > .meta-metric:nth-last-child(-n+2) { display:none } .meta-metric span { font-size:10px } .meta-metric strong { font-size:18px } .jobs-stack { gap:10px; max-width:100% } .meta-job { padding:12px; border-radius:16px; box-shadow:none; max-width:100% } .job-head h3 { font-size:16px; line-height:1.25 } .status { font-size:10px; letter-spacing:.05em; line-height:1.35; overflow-wrap:anywhere; word-break:break-word } .job-stamp,.last-done,.job-detail-grid { display:none } .notice { padding:10px; font-size:13px; line-height:1.35 } .meta-strip { grid-template-columns:1fr 1fr; gap:8px; max-width:100%; min-width:0 } .meta-strip .meta-metric:nth-child(4) { display:none } .job-progress { grid-template-columns:1fr; gap:8px; margin:10px 0 0; max-width:100% } .progress-row { padding:9px; border-radius:12px; min-width:0 } .progress-label { font-size:13px; margin-bottom:4px } .progress { height:7px; margin-bottom:0 } .health-hero { display:block } .health-hero h2 { font-size:24px } .health-grid { margin-top:10px } .codex-card { grid-column:auto } .health-row { display:block } .health-row span { display:block; margin-top:6px; font-size:18px } .cooldown-carousel { padding:12px; border-radius:16px } .carousel-head { display:block } .cooldown-nav { justify-content:flex-start; margin-top:10px } .cooldown-card { flex-basis:calc(100vw - 50px); padding:12px; min-height:250px } .cooldown-facts { grid-template-columns:1fr; gap:6px } .meta-hero,.notice,.card,.grid { min-width:0; max-width:100% } .meta-hero p,.notice,.card p,.card .muted,.kbd { overflow-wrap:anywhere; word-break:break-word } .actions-row .btn { max-width:100% } }
.home-top { margin-bottom:12px } .home-top h1 { margin:0 } .mobile-label { display:none }
.home-overview.compact-home { grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px; margin-bottom:14px } .compact-home .overview-card { padding:14px; border-radius:16px; box-shadow:none } .compact-home .overview-card.wide,.compact-home .performance-card { grid-column:1 / -1 }
.report-section { margin-top:18px } .report-section table { width:100%; border-collapse:collapse; min-width:760px } .report-section th,.report-section td { text-align:left; border-bottom:1px solid var(--line); padding:9px; vertical-align:top } .report-section th { color:var(--muted); font-size:12px; text-transform:uppercase; letter-spacing:.08em }
.card-title-row { display:flex; justify-content:space-between; align-items:flex-start; gap:12px; margin-bottom:10px } .overview-link { display:block; color:inherit; text-decoration:none; transition:border-color .16s ease, transform .16s ease, background .16s ease } .overview-link:hover,.overview-link:focus-visible { border-color:var(--blue); transform:translateY(-1px); outline:none } .overview-link:focus-visible { box-shadow:0 0 0 3px rgba(56,189,248,.18) } .compact-home h2 { margin:0; font-size:20px; line-height:1.12 } .compact-home .eyebrow { margin:0 0 4px } .compact-home .big-number { font-size:44px; line-height:.88 } .compact-home .pair-list { margin-top:4px } .compact-home .pair-list li { padding:6px 0; gap:10px }
.compact-section-head { margin-bottom:8px } .product-perf-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:10px } .product-perf-card { background:var(--surface-strong); border:1px solid var(--line); border-radius:14px; padding:12px; min-width:0 } .product-perf-head { display:flex; justify-content:space-between; align-items:center; gap:8px; margin-bottom:8px } .product-perf-head h3 { margin:0; font-size:16px } .product-perf-head span,.metric-pair span,.roi-chip span { color:var(--muted); font-size:11px; font-weight:800; text-transform:uppercase; letter-spacing:.08em } .metric-pair strong { display:block; margin-top:3px; color:var(--text); font-size:22px } .roi-chip { margin-top:8px; border-radius:13px; border:1px solid var(--line); background:var(--input-bg); padding:10px; min-height:68px; display:flex; flex-direction:column; justify-content:center } .roi-chip strong { display:block; color:inherit; font-size:32px; line-height:.95; letter-spacing:-.04em } .product-perf-card.roas-red .roi-chip { color:var(--text); background:linear-gradient(180deg,rgba(127,29,29,.72),rgba(69,10,10,.72)); border-color:var(--red) } .product-perf-card.roas-yellow .roi-chip { color:var(--yellow); background:linear-gradient(180deg,rgba(120,53,15,.72),rgba(69,26,3,.72)); border-color:var(--yellow) } .product-perf-card.roas-green .roi-chip { color:var(--green); background:linear-gradient(180deg,rgba(20,83,45,.72),rgba(5,46,22,.72)); border-color:var(--green) } .product-perf-card.roas-na .roi-chip { color:var(--muted); background:var(--input-bg); border-color:var(--line) } .product-perf-card.unavailable strong { color:var(--yellow) } .product-perf-card small { display:block; color:var(--muted); line-height:1.3; overflow-wrap:anywhere }
.home-schedule-ops { display:grid; gap:10px; margin-top:4px } .home-task-card { background:linear-gradient(180deg,rgba(10,17,31,.98),rgba(5,10,20,.98)); border:1px solid var(--line); border-radius:14px; padding:12px; min-width:0 } .home-task-head .eyebrow { color:var(--muted); font-size:10px; font-weight:900; text-transform:uppercase; letter-spacing:.08em } .home-task-head { display:flex; justify-content:space-between; gap:10px; align-items:flex-start; margin-bottom:6px } .home-task-head h2 { margin:0; font-size:18px } .home-task-list { list-style:none; display:grid; gap:6px; padding:0; margin:0 0 8px } .home-task-list li { display:grid; grid-template-columns:minmax(0,1fr) auto; gap:10px; align-items:center; padding:7px 0; border-top:1px solid var(--line) } .home-task-list li:first-child { border-top:0 } .home-task-list strong,.home-task-list span { display:block; overflow-wrap:anywhere } .home-task-list strong { font-size:13px; line-height:1.2 } .home-task-list span { color:var(--muted); font-size:11px; margin-top:2px } .home-task-list time { color:var(--text); font-size:12px; font-weight:800; white-space:nowrap } .home-task-error { margin:6px 0 0 }
@media (max-width: 900px) { .home-mobile-fit { margin-top:-24px } .home-top { margin-bottom:7px } .home-top h1 { display:none } .home-top .pill { padding:5px 8px; font-size:11px } .desktop-label { display:none } .mobile-label { display:inline } .home-overview.compact-home { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:8px; margin-bottom:8px } .compact-home .overview-card { margin-bottom:0; padding:9px; border-radius:13px } .compact-home .overview-card.wide,.compact-home .performance-card { grid-column:1 / -1 } .compact-home h2 { font-size:14px; line-height:1.05 } .compact-home .eyebrow { font-size:9px; margin-bottom:2px } .compact-home .big-number { font-size:30px; line-height:.9 } .card-title-row { gap:6px; margin-bottom:4px } .compact-home .pair-list { margin-top:1px; gap:3px } .compact-home .pair-list li { padding:3px 0; gap:6px; font-size:12px } .compact-section-head { margin-bottom:5px } .compact-section-head h2 { font-size:15px; margin:0 } .product-perf-grid { grid-template-columns:repeat(3,minmax(0,1fr)); gap:6px } .product-perf-card { padding:7px; border-radius:11px } .product-perf-head { margin-bottom:4px } .product-perf-head h3 { font-size:12px; line-height:1.05 } .product-perf-head span { display:none } .metric-pair span,.roi-chip span { font-size:9px; letter-spacing:.06em } .metric-pair strong { font-size:15px; margin-top:1px } .roi-chip { margin-top:4px; padding:6px; min-height:42px; border-radius:10px } .roi-chip strong { font-size:21px; line-height:.9 } .home-schedule-ops { gap:8px } .home-task-card { padding:8px; border-radius:12px } .home-task-head { margin-bottom:3px } .home-task-head h2 { font-size:14px } .home-task-list { gap:2px; margin-bottom:4px } .home-task-list li { padding:5px 0; grid-template-columns:minmax(0,1fr) auto; gap:7px } .home-task-list strong { font-size:11px } .home-task-list span { font-size:10px } .home-task-list time { font-size:10px } }
@media (max-width: 900px) { .dupe-card { grid-template-columns:132px minmax(0,1fr); } .dupe-card-side { grid-column:1 / -1 } .dupe-preview { width:132px } .dupe-source-list { grid-template-columns:1fr } .dupe-campaign-card { grid-template-columns:1fr; padding:12px } .dupe-campaign-preview { width:100%; min-height:180px } .dupe-campaign-settings { grid-column:auto; grid-template-columns:repeat(2,minmax(0,1fr)) } .dupe-campaign-summary,.dupe-campaign-metrics { grid-template-columns:repeat(2,minmax(0,1fr)) } .dupe-campaign-card-head { display:block } .dupe-launch-time { text-align:left; margin-top:8px } }
@media (max-width: 700px) { .tasks-page { gap:12px } .tasks-page .top { margin-bottom:8px } .task-form-grid { display:grid; grid-template-columns:1fr; gap:10px } .task-form-grid label { min-width:0 } .task-quick-add { padding:18px } .task-tabs { gap:8px } .tasks-table { min-width:720px } .tasks-table th,.tasks-table td { padding:10px 12px } }

:root {
  color-scheme: light dark;
  --app-bg: radial-gradient(circle at top left,#13203f 0,#070a12 38%);
  --sidebar-bg: rgba(8,13,25,.92);
  --surface-bg: rgba(13,19,34,.87);
  --surface-strong: #07111d;
  --surface-muted: #020617;
  --hover-bg: #121a2c;
  --input-bg: #020617;
  --focus-ring: rgba(96,165,250,.32);
}
@media (prefers-color-scheme: light) {
  :root:not([data-dashboard-theme="night"]) {
    color-scheme: light;
    --bg:#f6f8fb; --panel:#ffffff; --panel2:#f8fafc; --line:#c4cedb; --text:#0f172a; --muted:#475569;
    --blue:#0369a1; --green:#047857; --red:#b91c1c; --yellow:#b45309;
    --app-bg: linear-gradient(180deg,#eef6ff 0,#f7f9fc 34%,#f8fafc 100%);
    --sidebar-bg: rgba(255,255,255,.92);
    --surface-bg: rgba(255,255,255,.98);
    --surface-strong: #ffffff;
    --surface-muted: #eef3f8;
    --hover-bg: #e8f1fb;
    --input-bg: #ffffff;
    --focus-ring: rgba(3,105,161,.24);
  }
}
:root[data-dashboard-theme="day"] {
  color-scheme: light;
  --bg:#f6f8fb; --panel:#ffffff; --panel2:#f8fafc; --line:#c4cedb; --text:#0f172a; --muted:#475569;
  --blue:#0369a1; --green:#047857; --red:#b91c1c; --yellow:#b45309;
  --app-bg: linear-gradient(180deg,#eef6ff 0,#f7f9fc 34%,#f8fafc 100%);
  --sidebar-bg: rgba(255,255,255,.92);
  --surface-bg: rgba(255,255,255,.98);
  --surface-strong: #ffffff;
  --surface-muted: #eef3f8;
  --hover-bg: #e8f1fb;
  --input-bg: #ffffff;
  --focus-ring: rgba(3,105,161,.24);
}
:root[data-dashboard-theme="night"] {
  color-scheme: dark;
  --bg:#070a12; --panel:#0d1322; --panel2:#111827; --line:#243044; --text:#e5e7eb; --muted:#94a3b8;
  --blue:#60a5fa; --green:#22c55e; --red:#ef4444; --yellow:#f59e0b;
  --app-bg: radial-gradient(circle at top left,#13203f 0,#070a12 38%);
  --sidebar-bg: rgba(8,13,25,.92);
  --surface-bg: rgba(13,19,34,.87);
  --surface-strong: #07111d;
  --surface-muted: #020617;
  --hover-bg: #121a2c;
  --input-bg: #020617;
  --focus-ring: rgba(96,165,250,.32);
}
body { background: var(--app-bg); color: var(--text); }
.sidebar { background: var(--sidebar-bg); backdrop-filter: blur(18px); }
.pull-tab { background: var(--panel); color: var(--text); }
.brand-link:hover,.nav:hover,.nav.active,.settings-card:hover,.settings-card:focus-visible { background: var(--hover-bg); }
.card,.overview-card,.snapshot-card,.summary-primary,.meta-metric,.meta-job,.sop-job-card,.cooldown-carousel,.dupe-campaign-hero,.mba-card,.account-card,.report-section .table-wrap { background: var(--surface-bg); border-color: var(--line); color: var(--text); }
.messages,.action,.job-meta div,.last-done,.progress-row,.dupe-selection-block,.cooldown-card,.usage-headers,.queue-totals span,.perf-window,.product-perf-card,.home-task-card,.md-editor-shell,.md-preview,.sop-pre,.report-section table { background: var(--surface-strong); border-color: var(--line); color: var(--text); }
input,textarea,select,.kbd,.progress,.health-meter,.roas-badge,.carousel-position { background: var(--input-bg); border-color: var(--line); color: var(--text); }
.nav,.pill,.btn2,.settings-card,.report-section th,.report-section td { border-color: var(--line); color: var(--text); }
.nav small,.brand p,.muted,.status,.nav-section-label,.health-row small,.snapshot-card span,.summary-primary span,.meta-metric span,.job-stamp span,.last-done span,.perf-window span,.product-perf-head span,.metric-pair span,.roi-chip span { color: var(--muted); }
.dashboard-theme-control { display:grid; grid-template-columns:1fr repeat(3,auto); gap:6px; align-items:center; margin:10px 0 14px; padding:10px; border:1px solid var(--line); border-radius:14px; background:var(--surface-muted); }
.dashboard-theme-control span { color:var(--muted); font-size:11px; font-weight:900; text-transform:uppercase; letter-spacing:.08em; }
.dashboard-theme-control button { appearance:none; border:1px solid transparent; background:transparent; color:var(--muted); border-radius:999px; padding:7px 8px; font-size:12px; font-weight:900; cursor:pointer; }
.dashboard-theme-control button.active { border-color:var(--blue); background:color-mix(in srgb,var(--blue) 14%,transparent); color:var(--text); }
.dashboard-theme-control button:focus-visible { outline:2px solid var(--blue); outline-offset:2px; }
.main > .dashboard-theme-control { width:max-content; margin:0 0 14px auto; grid-template-columns:auto repeat(3,auto); box-shadow:0 10px 30px color-mix(in srgb,var(--line) 30%,transparent); }

@media (prefers-color-scheme: light) {
  :root:not([data-dashboard-theme="night"]) .overview-card,
  :root:not([data-dashboard-theme="night"]) .product-perf-card,
  :root:not([data-dashboard-theme="night"]) .home-task-card,
  :root:not([data-dashboard-theme="night"]) .perf-window,
  :root:not([data-dashboard-theme="night"]) .perf-product-head,
  :root:not([data-dashboard-theme="night"]) .perf-row-label,
  :root:not([data-dashboard-theme="night"]) .queue-totals span {
    background:var(--panel);
    border-color:var(--line);
    box-shadow:0 8px 22px rgba(15,23,42,.07);
  }
  :root:not([data-dashboard-theme="night"]) .big-number,
  :root:not([data-dashboard-theme="night"]) .home-task-list time,
  :root:not([data-dashboard-theme="night"]) details summary,
  :root:not([data-dashboard-theme="night"]) .perf-row-label span {
    color:var(--green);
  }
  :root:not([data-dashboard-theme="night"]) .queue-totals strong,
  :root:not([data-dashboard-theme="night"]) .perf-window strong,
  :root:not([data-dashboard-theme="night"]) .metric-pair strong,
  :root:not([data-dashboard-theme="night"]) .perf-window .perf-spend {
    color:var(--text);
  }
  :root:not([data-dashboard-theme="night"]) .mini-list small,
  :root:not([data-dashboard-theme="night"]) .perf-product-head small,
  :root:not([data-dashboard-theme="night"]) .perf-row-label small,
  :root:not([data-dashboard-theme="night"]) .perf-window small,
  :root:not([data-dashboard-theme="night"]) .product-perf-card small,
  :root:not([data-dashboard-theme="night"]) .home-task-list span,
  :root:not([data-dashboard-theme="night"]) .home-task-head .eyebrow {
    color:var(--muted);
  }
  :root:not([data-dashboard-theme="night"]) .home-task-list li {
    border-top-color:var(--line);
  }
}
@media (prefers-color-scheme: light) {
  :root:not([data-dashboard-theme="night"]) .pill,
  :root:not([data-dashboard-theme="night"]) .btn2,
  :root:not([data-dashboard-theme="night"]) .kbd,
  :root:not([data-dashboard-theme="night"]) .carousel-position {
    background:var(--surface-muted);
    border-color:var(--line);
    color:var(--text);
  }
  :root:not([data-dashboard-theme="night"]) .product-perf-card.roas-red .roi-chip,
  :root:not([data-dashboard-theme="night"]) .perf-window.roas-red .roas-badge {
    color:var(--red);
    background:color-mix(in srgb,var(--red) 14%,var(--panel));
    border-color:var(--red);
  }
  :root:not([data-dashboard-theme="night"]) .product-perf-card.roas-yellow .roi-chip,
  :root:not([data-dashboard-theme="night"]) .perf-window.roas-yellow .roas-badge {
    color:var(--yellow);
    background:color-mix(in srgb,var(--yellow) 14%,var(--panel));
    border-color:var(--yellow);
  }
  :root:not([data-dashboard-theme="night"]) .product-perf-card.roas-green .roi-chip,
  :root:not([data-dashboard-theme="night"]) .perf-window.roas-green .roas-badge {
    color:var(--green);
    background:color-mix(in srgb,var(--green) 14%,var(--panel));
    border-color:var(--green);
  }
  :root:not([data-dashboard-theme="night"]) .product-perf-card.roas-na .roi-chip,
  :root:not([data-dashboard-theme="night"]) .perf-window.roas-na .roas-badge {
    color:var(--line);
    background:var(--panel2);
    border-color:var(--muted);
  }
  :root:not([data-dashboard-theme="night"]) .product-perf-card.unavailable strong,
  :root:not([data-dashboard-theme="night"]) .perf-window.unavailable strong {
    color:var(--yellow);
  }
}
:root[data-dashboard-theme="day"] .overview-card,
:root[data-dashboard-theme="day"] .product-perf-card,
:root[data-dashboard-theme="day"] .home-task-card,
:root[data-dashboard-theme="day"] .perf-window,
:root[data-dashboard-theme="day"] .perf-product-head,
:root[data-dashboard-theme="day"] .perf-row-label,
:root[data-dashboard-theme="day"] .queue-totals span {
  background:var(--panel);
  border-color:var(--line);
  box-shadow:0 8px 22px rgba(15,23,42,.07);
}
:root[data-dashboard-theme="day"] .big-number,
:root[data-dashboard-theme="day"] .home-task-list time,
:root[data-dashboard-theme="day"] details summary,
:root[data-dashboard-theme="day"] .perf-row-label span {
  color:var(--green);
}
:root[data-dashboard-theme="day"] .queue-totals strong,
:root[data-dashboard-theme="day"] .perf-window strong,
:root[data-dashboard-theme="day"] .metric-pair strong,
:root[data-dashboard-theme="day"] .perf-window .perf-spend {
  color:var(--text);
}
:root[data-dashboard-theme="day"] .mini-list small,
:root[data-dashboard-theme="day"] .perf-product-head small,
:root[data-dashboard-theme="day"] .perf-row-label small,
:root[data-dashboard-theme="day"] .perf-window small,
:root[data-dashboard-theme="day"] .product-perf-card small,
:root[data-dashboard-theme="day"] .home-task-list span,
:root[data-dashboard-theme="day"] .home-task-head .eyebrow {
  color:var(--muted);
}
:root[data-dashboard-theme="day"] .home-task-list li {
  border-top-color:var(--line);
}

:root[data-dashboard-theme="day"] .pill,
:root[data-dashboard-theme="day"] .btn2,
:root[data-dashboard-theme="day"] .kbd,
:root[data-dashboard-theme="day"] .carousel-position {
  background:var(--surface-muted);
  border-color:var(--line);
  color:var(--text);
}
:root[data-dashboard-theme="day"] .product-perf-card.roas-red .roi-chip,
:root[data-dashboard-theme="day"] .perf-window.roas-red .roas-badge {
  color:var(--red);
  background:color-mix(in srgb,var(--red) 14%,var(--panel));
  border-color:var(--red);
}
:root[data-dashboard-theme="day"] .product-perf-card.roas-yellow .roi-chip,
:root[data-dashboard-theme="day"] .perf-window.roas-yellow .roas-badge {
  color:var(--yellow);
  background:color-mix(in srgb,var(--yellow) 14%,var(--panel));
  border-color:var(--yellow);
}
:root[data-dashboard-theme="day"] .product-perf-card.roas-green .roi-chip,
:root[data-dashboard-theme="day"] .perf-window.roas-green .roas-badge {
  color:var(--green);
  background:color-mix(in srgb,var(--green) 14%,var(--panel));
  border-color:var(--green);
}
:root[data-dashboard-theme="day"] .product-perf-card.roas-na .roi-chip,
:root[data-dashboard-theme="day"] .perf-window.roas-na .roas-badge {
  color:var(--line);
  background:var(--panel2);
  border-color:var(--muted);
}
:root[data-dashboard-theme="day"] .product-perf-card.unavailable strong,
:root[data-dashboard-theme="day"] .perf-window.unavailable strong {
  color:var(--yellow);
}
@media (prefers-color-scheme: light) {
  :root:not([data-dashboard-theme="night"]) .mba-metric,
  :root:not([data-dashboard-theme="night"]) .mba-summary,
  :root:not([data-dashboard-theme="night"]) .codex-account,
  :root:not([data-dashboard-theme="night"]) .dupe-card,
  :root:not([data-dashboard-theme="night"]) .job-detail-grid section,
  :root:not([data-dashboard-theme="night"]) .portal-balance-grid div,
  :root:not([data-dashboard-theme="night"]) .ai-intensity-metric,
  :root:not([data-dashboard-theme="night"]) .ai-pace-note {
    background:var(--surface-strong);
    border-color:var(--line);
    color:var(--text);
    box-shadow:0 8px 22px color-mix(in srgb,var(--line) 24%,transparent);
  }
  :root:not([data-dashboard-theme="night"]) .status.pending { color:var(--yellow); }
  :root:not([data-dashboard-theme="night"]) .status.running { color:var(--blue); }
  :root:not([data-dashboard-theme="night"]) .status.completed { color:var(--green); }
  :root:not([data-dashboard-theme="night"]) .status.failed { color:var(--red); }
  :root:not([data-dashboard-theme="night"]) .status.cancelled { color:var(--muted); }
  :root:not([data-dashboard-theme="night"]) .meta-metric.live strong { color:var(--green); }
  :root:not([data-dashboard-theme="night"]) .meta-metric.danger strong { color:var(--red); }
}
:root[data-dashboard-theme="day"] .mba-metric,
:root[data-dashboard-theme="day"] .mba-summary,
:root[data-dashboard-theme="day"] .codex-account,
:root[data-dashboard-theme="day"] .dupe-card,
:root[data-dashboard-theme="day"] .job-detail-grid section,
:root[data-dashboard-theme="day"] .portal-balance-grid div,
:root[data-dashboard-theme="day"] .ai-intensity-metric,
:root[data-dashboard-theme="day"] .ai-pace-note,
:root[data-dashboard-theme="night"] .mba-metric,
:root[data-dashboard-theme="night"] .mba-summary,
:root[data-dashboard-theme="night"] .codex-account,
:root[data-dashboard-theme="night"] .dupe-card,
:root[data-dashboard-theme="night"] .job-detail-grid section,
:root[data-dashboard-theme="night"] .portal-balance-grid div,
:root[data-dashboard-theme="night"] .ai-intensity-metric,
:root[data-dashboard-theme="night"] .ai-pace-note {
  background:var(--surface-strong);
  border-color:var(--line);
  color:var(--text);
  box-shadow:0 8px 22px color-mix(in srgb,var(--line) 24%,transparent);
}
:root[data-dashboard-theme="day"] .status.pending,
:root[data-dashboard-theme="night"] .status.pending { color:var(--yellow); }
:root[data-dashboard-theme="day"] .status.running,
:root[data-dashboard-theme="night"] .status.running { color:var(--blue); }
:root[data-dashboard-theme="day"] .status.completed,
:root[data-dashboard-theme="night"] .status.completed { color:var(--green); }
:root[data-dashboard-theme="day"] .status.failed,
:root[data-dashboard-theme="night"] .status.failed { color:var(--red); }
:root[data-dashboard-theme="day"] .status.cancelled,
:root[data-dashboard-theme="night"] .status.cancelled { color:var(--muted); }
:root[data-dashboard-theme="day"] .meta-metric.live strong,
:root[data-dashboard-theme="night"] .meta-metric.live strong { color:var(--green); }
:root[data-dashboard-theme="day"] .meta-metric.danger strong,
:root[data-dashboard-theme="night"] .meta-metric.danger strong { color:var(--red); }
@media (max-width: 900px) { .dashboard-theme-control { grid-template-columns:1fr; } .dashboard-theme-control button { text-align:left; } .main > .dashboard-theme-control { grid-template-columns:auto repeat(3,auto); margin-bottom:18px; } .main > .dashboard-theme-control + .home-mobile-fit { margin-top:0; } }
@media (max-width: 900px) { .creative-sop-detail-grid,.creative-sop-companion-grid,.competitor-review-grid,.competitor-detail-grid { grid-template-columns:1fr } .creative-sops-page .top,.competitor-pages-page .top { display:block } .creative-sops-page .top .actions-row,.competitor-pages-page .top .actions-row { margin-top:12px } .creative-sop-submit-row { justify-content:stretch } .creative-sop-submit-row .btn { width:100%; text-align:center } .competitor-hero-stat { margin-top:12px } .competitor-review-main,.competitor-review-actions { display:block } .competitor-inline-reject,.competitor-row-reject { display:grid; grid-template-columns:1fr; margin-top:8px } .competitor-dl { grid-template-columns:1fr } }

@media (max-width: 560px) { .dupe-selection-head { display:block } .dupe-generated { text-align:left; margin-top:8px } .dupe-card { grid-template-columns:1fr; padding:10px } .dupe-preview { width:100%; max-height:190px } .dupe-card-side { grid-column:auto } .dupe-card-title { display:block } .dupe-count { display:inline-block; margin-top:7px } .dupe-stats { grid-template-columns:repeat(2,minmax(0,1fr)) } .dupe-campaign-hero { padding:13px; border-radius:16px } .dupe-campaign-hero h1 { font-size:26px } .dupe-campaign-toolbar { display:grid; gap:10px } .dupe-product-toggle,.dupe-bucket-tabs { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:7px } .dupe-product-link,.dupe-bucket-tab { text-align:center; padding:8px } .dupe-campaign-summary,.dupe-campaign-metrics,.dupe-campaign-settings { grid-template-columns:1fr 1fr } .dupe-campaign-card { border-radius:16px; padding:10px } .dupe-campaign-preview { min-height:150px } .dupe-location-card,.dupe-why-selected,.dupe-campaign-settings { padding:10px } }/* Phase 2 extracted login styles: login now uses the shared themed stylesheet. */
.login-page {
  margin:0;
  min-height:100vh;
  display:grid;
  place-items:start center;
  font-family:system-ui,-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;
  padding:12vh 18px 32px;
}
.login {
  width:min(420px,100%);
  padding:24px;
  background:var(--surface-bg);
  border:1px solid var(--line);
  border-radius:20px;
  box-shadow:0 20px 60px color-mix(in srgb,var(--line) 35%,transparent);
}
.login h1 { margin:0 0 8px; }
.login input,.login button {
  box-sizing:border-box;
  width:100%;
  padding:12px;
  margin:8px 0;
  border-radius:12px;
  border:1px solid var(--line);
  background:var(--input-bg);
  color:var(--text);
  font:inherit;
}
.login button {
  background:var(--blue);
  border:0;
  color:white;
  font-weight:800;
  cursor:pointer;
}
.login button:focus-visible,.login input:focus-visible { outline:2px solid var(--blue); outline-offset:2px; }
.login-error {
  border:1px solid var(--red);
  background:color-mix(in srgb,var(--red) 12%,var(--panel));
  color:var(--red);
  border-radius:12px;
  padding:10px 12px;
  margin:12px 0;
  font-weight:800;
}
.home-poll-status,.meta-poll-status {
  display:inline-flex;
  align-items:center;
  gap:6px;
}
.nav-accent { display:block; }
.nav-accent-reports { background:var(--blue); }
.nav-accent-meta-jobs { background:var(--green); }
.nav-accent-meta-cooldowns { background:color-mix(in srgb,var(--blue) 86%,var(--green)); }
.nav-accent-strategies { background:var(--green); }
.nav-accent-diagrams { background:var(--yellow); }
.nav-accent-decisions { background:var(--yellow); }
.nav-accent-comments { background:var(--red); }
.nav-accent-settings { background:color-mix(in srgb,var(--blue) 62%,var(--red)); }
.nav-chip-review { background:var(--yellow); color:var(--panel); box-shadow:0 0 0 2px color-mix(in srgb,var(--yellow) 18%,transparent); }
.nav-chip-action { background:var(--red); color:white; box-shadow:0 0 0 2px color-mix(in srgb,var(--red) 24%,transparent); font-weight:950; }
.nav-alert.nav-alert-neutral { border-color:color-mix(in srgb,var(--line) 78%,transparent); background:color-mix(in srgb,var(--surface-strong) 82%,transparent); color:var(--muted); }
.nav-alert.nav-alert-neutral:hover,.nav-alert.nav-alert-neutral.active { border-color:var(--line); background:var(--hover-bg); color:var(--text); }
.nav-alert.nav-alert-neutral .nav-alert-icon { background:var(--surface-strong); color:var(--muted); border-color:var(--line); }
.nav-alert.nav-alert-action { border-color:color-mix(in srgb,var(--red) 66%,var(--line)); background:linear-gradient(135deg,color-mix(in srgb,var(--red) 20%,var(--panel)),color-mix(in srgb,var(--red) 10%,var(--surface-strong))); box-shadow:0 0 0 1px color-mix(in srgb,var(--red) 18%,transparent); }
.nav-alert.nav-alert-action:hover,.nav-alert.nav-alert-action.active { border-color:var(--red); background:linear-gradient(135deg,color-mix(in srgb,var(--red) 26%,var(--panel)),color-mix(in srgb,var(--red) 14%,var(--surface-strong))); }
.nav-alert.nav-alert-action .nav-alert-icon { background:color-mix(in srgb,var(--red) 18%,var(--surface-strong)); color:var(--red); border-color:color-mix(in srgb,var(--red) 58%,var(--line)); }
.badge-legend { display:grid; gap:6px; margin:0 0 12px; padding:10px; border:1px solid var(--line); border-radius:13px; background:var(--surface-strong); color:var(--muted); font-size:11px; font-weight:800; line-height:1.25; }
.badge-legend span { display:flex; gap:7px; align-items:center; }
.legend-dot { width:9px; height:9px; border-radius:999px; display:inline-block; flex:0 0 auto; }
.legend-review { background:var(--yellow); box-shadow:0 0 0 2px color-mix(in srgb,var(--yellow) 18%,transparent); }
.legend-action { background:var(--red); box-shadow:0 0 0 2px color-mix(in srgb,var(--red) 24%,transparent); }
@media (max-width: 900px) { .badge-legend { font-size:10px; padding:8px; margin-bottom:10px; } }

/* Dev Queue — read-only Goal state and dispatcher evidence. */
.dev-queue-page { display:grid; gap:18px; min-width:0; }
.dev-queue-top { margin-bottom:0; }
.dev-queue-top h1 { margin:2px 0 7px; font-size:clamp(30px,4vw,46px); letter-spacing:-.035em; }
.dev-dispatcher { border:2px solid var(--green); border-radius:20px; padding:17px; background:linear-gradient(135deg,color-mix(in srgb,var(--green) 12%,var(--surface-bg)),var(--surface-bg)); box-shadow:0 18px 50px color-mix(in srgb,var(--green) 9%,transparent); }
.dev-dispatcher-danger { border-color:var(--red); background:linear-gradient(135deg,color-mix(in srgb,var(--red) 20%,var(--surface-bg)),var(--surface-bg)); box-shadow:0 18px 60px color-mix(in srgb,var(--red) 14%,transparent); }
.dev-health-title,.dev-table-card .section-head,.dev-chart-card .section-head,.dev-log-card .section-head { display:flex; justify-content:space-between; gap:16px; align-items:flex-start; }
.dev-health-title h2 { margin:0; font-size:24px; }
.dev-health-status { display:inline-flex; padding:7px 10px; border-radius:999px; border:1px solid currentColor; color:var(--green); font-size:11px; font-weight:950; text-transform:uppercase; letter-spacing:.09em; }
.dev-dispatcher-danger .dev-health-status { color:var(--red); }
.dev-health-reasons { margin:7px 0 0; color:var(--red); font-weight:850; }
.dev-health-facts { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:10px; margin-top:14px; }
.dev-health-facts>div { min-width:0; padding:11px; border:1px solid var(--line); border-radius:13px; background:color-mix(in srgb,var(--surface-strong) 86%,transparent); }
.dev-health-facts span,.dev-summary-card span { display:block; color:var(--muted); font-size:11px; font-weight:900; text-transform:uppercase; letter-spacing:.08em; margin-bottom:5px; }
.dev-health-facts strong { display:block; overflow-wrap:anywhere; font-size:14px; }
.dev-summary { display:grid; grid-template-columns:repeat(5,minmax(0,1fr)); gap:10px; }
.dev-summary-card { padding:14px; border:1px solid var(--line); border-radius:15px; background:var(--surface-bg); box-shadow:inset 4px 0 0 var(--blue); }
.dev-summary-card strong { display:block; font-size:30px; line-height:1; }
.dev-tone-yellow { box-shadow:inset 4px 0 0 var(--yellow); }.dev-tone-red { box-shadow:inset 4px 0 0 var(--red); }.dev-tone-green { box-shadow:inset 4px 0 0 var(--green); }
.dev-table-card,.dev-chart-card,.dev-log-card { min-width:0; }
.dev-table-card .section-head,.dev-chart-card .section-head,.dev-log-card .section-head { margin-bottom:13px; }
.dev-table-card h2,.dev-chart-card h2,.dev-log-card h2 { margin:0 0 5px; }
.dev-table-scroll { overflow-x:auto; border:1px solid var(--line); border-radius:14px; background:var(--surface-strong); scrollbar-gutter:stable; }
.dev-table-scroll:focus-visible { outline:2px solid var(--blue); outline-offset:3px; }
.dev-queue-table { width:100%; min-width:1500px; border-collapse:collapse; color:var(--text); }
.dev-queue-table th,.dev-queue-table td { padding:11px; border-bottom:1px solid var(--line); text-align:left; vertical-align:top; }
.dev-queue-table th { position:sticky; top:0; z-index:2; background:var(--surface-muted); color:var(--muted); font-size:11px; text-transform:uppercase; letter-spacing:.07em; }
.dev-queue-table th:first-child,.dev-queue-table td:first-child { width:300px; max-width:360px; }
.dev-queue-table tbody:last-child tr:last-child td { border-bottom:0; }
.dev-row-blocked { background:color-mix(in srgb,var(--red) 6%,transparent); }
.dev-row-unparseable { background:color-mix(in srgb,var(--red) 11%,transparent); }
.dev-goal-detail summary { margin:0; color:var(--text); font-size:14px; line-height:1.35; }
.dev-goal-detail[open] summary { color:var(--blue); }
.dev-detail-body { margin-top:10px; padding:11px; border:1px solid var(--line); border-radius:12px; background:var(--input-bg); line-height:1.4; }
.dev-detail-body p { margin:0 0 8px; }.dev-detail-body ul { margin:5px 0 9px; padding-left:19px; }
.dev-detail-body code,.dev-blocker-cell { overflow-wrap:anywhere; word-break:break-word; }
.dev-status,.dev-hold-chip { display:inline-flex; margin:0 5px 5px 0; padding:5px 8px; border:1px solid currentColor; border-radius:999px; font-size:10px; font-weight:950; letter-spacing:.07em; text-transform:uppercase; white-space:nowrap; }
.dev-status-queued { color:var(--yellow); background:color-mix(in srgb,var(--yellow) 10%,var(--panel)); }
.dev-status-dispatched,.dev-status-in-progress { color:var(--blue); background:color-mix(in srgb,var(--blue) 10%,var(--panel)); }
.dev-status-blocked,.dev-status-unparseable { color:var(--red); background:color-mix(in srgb,var(--red) 12%,var(--panel)); }
.dev-status-done { color:var(--green); background:color-mix(in srgb,var(--green) 10%,var(--panel)); }
.dev-hold-chip { color:var(--yellow); border-style:dashed; }
.dev-ts-empty { color:var(--muted); }.dev-ts-unparsed { color:var(--red); }.dev-ts-unparsed em,.dev-queue-table time+em,.dev-raw-times em { display:inline-flex; color:var(--red); font-size:10px; font-style:normal; font-weight:900; }
.dev-blocker-cell { min-width:420px; max-width:520px; line-height:1.38; }
.dev-empty-state { padding:24px; border:2px solid var(--red); border-radius:18px; background:color-mix(in srgb,var(--red) 13%,var(--surface-bg)); color:var(--text); }
.dev-empty-state strong { display:block; color:var(--red); font-size:22px; }.dev-empty-state p { margin:8px 0 0; }
.dev-chart-legend { display:flex; gap:12px; flex-wrap:wrap; color:var(--muted); font-size:12px; font-weight:850; }
.dev-chart-legend span { display:flex; gap:6px; align-items:center; }.dev-chart-legend i { width:10px; height:10px; border-radius:3px; }.dev-chart-legend .created { background:var(--yellow); }.dev-chart-legend .done { background:var(--green); }
.dev-chart { display:grid; grid-template-columns:repeat(14,minmax(36px,1fr)); gap:7px; height:220px; padding:18px 8px 0; border-left:1px solid var(--line); border-bottom:1px solid var(--line); overflow-x:auto; }
.dev-chart-day { display:grid; grid-template-rows:minmax(0,1fr) auto; gap:7px; min-width:36px; text-align:center; }
.dev-bars { display:flex; gap:3px; align-items:flex-end; justify-content:center; min-height:160px; }
.dev-bar { display:flex; align-items:flex-start; justify-content:center; width:42%; min-height:2px; border-radius:5px 5px 1px 1px; font-style:normal; }
.dev-bar-created { background:var(--yellow); }.dev-bar-done { background:var(--green); }
.dev-bar span { margin-top:-16px; color:var(--text); font-size:10px; font-weight:900; }.dev-chart-day small { color:var(--muted); font-size:10px; }
.dev-log-card pre { max-height:250px; overflow:auto; white-space:pre-wrap; overflow-wrap:anywhere; padding:13px; border:1px solid var(--line); border-radius:13px; background:var(--input-bg); color:var(--text); font-size:12px; line-height:1.45; }
.dev-log-links { columns:2; padding-left:20px; }.dev-log-links li { break-inside:avoid; margin:6px 0; overflow-wrap:anywhere; }.dev-log-links a { color:var(--blue); text-decoration:underline; text-underline-offset:2px; }
@media (max-width:900px) { .dev-queue-page { gap:12px; }.dev-health-facts { grid-template-columns:repeat(2,minmax(0,1fr)); }.dev-summary { grid-template-columns:repeat(3,minmax(0,1fr)); }.dev-summary-card { padding:11px; }.dev-summary-card strong { font-size:25px; }.dev-table-card,.dev-chart-card,.dev-log-card { padding:14px; }.dev-queue-table th:first-child,.dev-queue-table td:first-child { position:sticky; left:0; z-index:1; width:220px; min-width:220px; max-width:220px; background:var(--surface-strong); box-shadow:8px 0 15px color-mix(in srgb,var(--bg) 18%,transparent); }.dev-queue-table th:first-child { z-index:3; background:var(--surface-muted); }.dev-log-links { columns:1; } }
@media (max-width:600px) { .dev-queue-top .pill { margin-top:8px; }.dev-health-title,.dev-table-card .section-head,.dev-chart-card .section-head,.dev-log-card .section-head { display:block; }.dev-health-status,.dev-done-toggle { margin-top:9px; }.dev-health-facts { grid-template-columns:1fr; }.dev-summary { grid-template-columns:repeat(2,minmax(0,1fr)); }.dev-chart-card { overflow:hidden; }.dev-chart { margin-right:-14px; }.dev-queue-table th,.dev-queue-table td { padding:9px; }.dev-blocker-cell { min-width:360px; } }

/* Media Buyer performance — read-only, three-level drill-down. */
.perf-detail-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}.perf-detail-grid article{display:grid;gap:5px;padding:16px;border:1px solid var(--line);border-radius:14px;background:var(--surface-bg)}.perf-detail-grid span{color:var(--muted);font-size:12px;font-weight:800;letter-spacing:.04em;text-transform:uppercase}.perf-detail-grid strong{font-size:clamp(18px,2.5vw,27px);overflow-wrap:anywhere}@media(max-width:760px){.perf-detail-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.perf-detail-grid article{padding:13px}}
.perf-page{display:grid;gap:18px;min-width:0}.perf-page>header h1{margin:2px 0 7px;font-size:clamp(28px,4vw,46px);letter-spacing:-.035em}.perf-page>header p:not(.eyebrow){margin:0;color:var(--muted)}.perf-tabs,.perf-filters{display:flex;gap:8px;align-items:center;flex-wrap:wrap}.perf-tab,.perf-filter{padding:8px 12px;border:1px solid var(--line);border-radius:999px;background:var(--surface-bg);font-weight:800;font-size:13px}.perf-tab.active,.perf-filter.active{border-color:var(--blue);background:color-mix(in srgb,var(--blue) 15%,var(--surface-bg));color:var(--blue)}.perf-custom{display:flex;gap:8px;align-items:end;margin-left:auto}.perf-custom label{font-size:11px;color:var(--muted);font-weight:800}.perf-custom input{padding:7px 9px;margin-top:3px;min-width:138px}.perf-custom button{padding:8px 12px}.perf-window-note{margin:-10px 0 0;color:var(--muted);font-size:12px}.perf-chart{border:1px solid var(--line);border-radius:18px;background:linear-gradient(180deg,var(--surface-bg),var(--surface-strong));padding:16px;overflow:hidden}.perf-chart svg{width:100%;height:auto;min-height:180px}.perf-chart rect{fill:color-mix(in srgb,var(--blue) 55%,var(--panel))}.perf-chart polyline{stroke:var(--green);stroke-width:4;stroke-linecap:round;stroke-linejoin:round}.perf-chart text{fill:var(--muted);font-size:10px}.perf-chart-key{display:flex;gap:18px;font-size:12px;font-weight:800}.perf-chart-key span:before{content:'';display:inline-block;width:10px;height:10px;border-radius:3px;margin-right:6px}.spend-key:before{background:var(--blue)}.roas-key:before{background:var(--green)}.perf-table-wrap{overflow-x:auto;border:1px solid var(--line);border-radius:18px;background:var(--surface-bg)}.perf-table-wrap table{width:100%;min-width:980px;border-collapse:collapse}.perf-table-wrap th,.perf-table-wrap td{padding:12px 14px;border-bottom:1px solid var(--line);text-align:right;vertical-align:top;white-space:nowrap}.perf-table-wrap th{color:var(--muted);font-size:11px;letter-spacing:.06em;text-transform:uppercase;background:var(--surface-muted)}.perf-table-wrap th:first-child,.perf-table-wrap td:first-child{text-align:left;position:sticky;left:0;background:var(--surface-bg);z-index:1;min-width:250px}.perf-table-wrap th:first-child{background:var(--surface-muted);z-index:2}.perf-table-wrap tbody tr{cursor:pointer}.perf-table-wrap tbody tr:hover td{background:var(--hover-bg)}.perf-table-wrap td small{display:block;color:var(--muted);margin-top:4px}.perf-table-wrap .perf-dark{opacity:.58}.perf-empty{padding:32px;border:1px dashed var(--yellow);border-radius:16px;background:color-mix(in srgb,var(--yellow) 8%,var(--surface-bg));color:var(--yellow);font-weight:800;text-align:center}.perf-footnote{color:var(--muted);font-size:12px;line-height:1.5;margin:0}.perf-back{color:var(--blue);font-weight:800;width:max-content}.perf-ad{display:grid;grid-template-columns:minmax(190px,280px) minmax(0,1fr) minmax(150px,210px);gap:18px;border:1px solid var(--line);border-radius:18px;background:var(--surface-bg);padding:16px;align-items:start}.perf-ad-media{aspect-ratio:1/1;border-radius:14px;overflow:hidden;background:var(--input-bg);display:grid;place-items:center}.perf-ad-media img,.perf-ad-media video{width:100%;height:100%;object-fit:cover}.perf-media-missing{padding:18px;text-align:center;color:var(--muted)}.perf-ad-body h2{font-size:18px;margin:8px 0 3px;overflow-wrap:anywhere}.perf-ad-body>small{color:var(--muted);overflow-wrap:anywhere}.perf-chips{display:flex;gap:7px;flex-wrap:wrap}.perf-chips span{padding:5px 8px;border-radius:999px;background:color-mix(in srgb,var(--blue) 12%,var(--surface-strong));color:var(--blue);font-size:11px;font-weight:900}.perf-copy{margin-top:14px;padding-top:14px;border-top:1px solid var(--line)}.perf-copy p{white-space:pre-wrap;line-height:1.5;max-height:220px;overflow:auto;color:var(--text)}.perf-copy-missing{margin-top:14px;padding:13px;border:2px solid var(--red);border-radius:12px;background:color-mix(in srgb,var(--red) 12%,var(--surface-bg));color:var(--red);font-weight:950;letter-spacing:.05em}.perf-ad dl{display:grid;gap:7px;margin:0}.perf-ad dl div{display:flex;justify-content:space-between;gap:8px;border-bottom:1px solid var(--line);padding:7px 0}.perf-ad dt{color:var(--muted);font-size:12px}.perf-ad dd{margin:0;font-weight:900}
@media(max-width:760px){.perf-page{gap:14px}.perf-custom{width:100%;margin:0;display:grid;grid-template-columns:1fr 1fr auto}.perf-custom input{min-width:0}.perf-table-wrap{margin-right:-12px}.perf-ad{grid-template-columns:100px minmax(0,1fr);gap:12px}.perf-ad-media{grid-row:1}.perf-ad dl{grid-column:1/-1;grid-template-columns:repeat(2,minmax(0,1fr))}.perf-ad dl div{display:block}.perf-ad dd{margin-top:3px}.perf-copy p{max-height:180px}.perf-chart{padding:10px}.perf-chart svg{min-width:620px}.perf-chart{overflow-x:auto}}

/* Account intervention ledger: prediction timing, matured evidence, calibration. */
.interventions-panel{display:grid;gap:14px;padding:18px;border:1px solid var(--line);border-radius:18px;background:var(--surface-bg);min-width:0}.interventions-head{display:grid;grid-template-columns:minmax(0,1fr) minmax(230px,320px);gap:18px;align-items:start}.interventions-head h2{margin:2px 0 5px;font-size:26px;letter-spacing:-.025em}.interventions-head p:not(.eyebrow){margin:0;color:var(--muted)}.intervention-calibration{display:grid;gap:4px;padding:13px 14px;border:1px solid var(--line);border-radius:14px;background:var(--surface-strong)}.intervention-calibration span,.intervention-calibration small{color:var(--muted)}.intervention-calibration span{font-size:11px;font-weight:900;letter-spacing:.07em;text-transform:uppercase}.intervention-calibration strong{font-size:24px;line-height:1.1}.intervention-compliance{display:flex;gap:10px;align-items:center;padding:13px 14px;border:2px solid var(--yellow);border-radius:13px;background:color-mix(in srgb,var(--yellow) 12%,var(--surface-bg));color:var(--text)}.intervention-compliance strong{flex:0 0 auto;color:var(--yellow);font-size:12px;letter-spacing:.08em}.intervention-columns{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px;align-items:start}.intervention-columns>section{display:grid;gap:10px;min-width:0}.intervention-section-title{display:flex;justify-content:space-between;align-items:center;gap:10px}.intervention-section-title h3{margin:0;font-size:15px}.intervention-section-title span{display:grid;place-items:center;min-width:25px;height:25px;border:1px solid var(--line);border-radius:999px;color:var(--muted);font-size:12px;font-weight:900}.intervention-card,.intervention-empty{display:grid;gap:9px;padding:13px;border:1px solid var(--line);border-radius:14px;background:var(--surface-strong);min-width:0}.intervention-card.overdue{border-color:var(--red)}.intervention-card-head{display:flex;justify-content:space-between;align-items:flex-start;gap:12px}.intervention-card-head h3{margin:3px 0 0;font-size:17px;overflow-wrap:anywhere}.intervention-id{color:var(--muted);font-size:11px;font-weight:850;letter-spacing:.04em}.intervention-countdown{flex:0 0 auto;padding:6px 8px;border:1px solid var(--blue);border-radius:9px;color:var(--blue);font-size:12px}.overdue .intervention-countdown{border-color:var(--red);color:var(--red)}.intervention-change,.intervention-card p{margin:0;color:var(--text);line-height:1.45;overflow-wrap:anywhere}.intervention-card dl{display:grid;gap:6px;margin:0}.intervention-card dl div{display:grid;grid-template-columns:82px minmax(0,1fr);gap:8px}.intervention-card dt{color:var(--muted);font-size:12px}.intervention-card dd{margin:0;font-size:12px;overflow-wrap:anywhere}.intervention-card small,.intervention-empty span{color:var(--muted)}.intervention-empty strong{color:var(--text)}.intervention-verdict{padding:6px 8px;border:1px solid var(--line);border-radius:999px;font-size:11px;font-weight:900;text-transform:uppercase}.verdict-confirmed{border-color:var(--green);color:var(--green)}.verdict-partial{border-color:var(--yellow);color:var(--yellow)}.verdict-refuted{border-color:var(--red);color:var(--red)}.verdict-confounded{border-color:var(--blue);color:var(--blue)}.intervention-lesson{padding-top:8px;border-top:1px solid var(--line)}
@media(max-width:860px){.interventions-head,.intervention-columns{grid-template-columns:1fr}.intervention-calibration{max-width:none}}
@media(max-width:520px){.interventions-panel{padding:13px;margin-left:18px;margin-right:-4px}.intervention-card-head{display:grid}.intervention-countdown,.intervention-verdict{justify-self:start}.intervention-compliance{display:grid}.intervention-card dl div{grid-template-columns:1fr;gap:2px}}