/* NimbleOS v2 shell · operational screen styles (the product look, not the spec browser).
   Reuses the tokens from styles.css (--accent, --bg-*, --text-*). Component classes prefixed op-. */

.op-head { display:flex; align-items:flex-start; justify-content:space-between; gap:16px; margin-bottom:16px; flex-wrap:wrap; }
.op-head-right { flex-wrap:wrap; justify-content:flex-end; }
.op-h1 { margin:0; font-size:24px; font-weight:600; letter-spacing:-0.2px; }
.op-sub { color:var(--text-secondary); margin-top:4px; font-size:13px; }
.op-head-right { display:flex; align-items:center; gap:12px; flex-shrink:0; }
.op-viewas { display:flex; align-items:center; gap:6px; }
.op-viewas-label { font-size:11px; color:var(--text-tertiary); text-transform:uppercase; letter-spacing:0.8px; }
.op-chip { font-size:12px; padding:5px 11px; border-radius:999px; border:0.5px solid var(--border-strong); background:var(--bg-surface); color:var(--text-secondary); cursor:pointer; }
.op-chip:hover { border-color:var(--accent); color:var(--accent); }
.op-chip.active { background:var(--accent); color:#fff; border-color:var(--accent); }
.op-reset { font-size:11px; padding:5px 10px; border-radius:6px; border:0.5px solid var(--border-soft); background:transparent; color:var(--text-tertiary); cursor:pointer; }
.op-reset:hover { color:var(--text-secondary); border-color:var(--border-strong); }

/* Capacity banner */
.op-capacity { display:flex; gap:12px; align-items:flex-start; background:#faeeda; color:#854f0b; border-radius:var(--radius-lg); padding:12px 16px; margin-bottom:18px; font-size:13px; line-height:1.55; }
.op-cap-icon { width:20px; height:20px; border-radius:50%; background:#854f0b; color:#faeeda; display:flex; align-items:center; justify-content:center; font-weight:700; flex-shrink:0; font-size:13px; }

/* Groups */
.op-group { margin-bottom:22px; }
.op-group-head { display:flex; align-items:center; gap:9px; margin-bottom:10px; }
.op-group-dot { width:9px; height:9px; border-radius:50%; background:var(--text-tertiary); }
.op-group.tone-red .op-group-dot { background:#a32d2d; }
.op-group.tone-amber .op-group-dot { background:#d9822b; }
.op-group.tone-teal .op-group-dot { background:var(--nimble-teal); }
.op-group.tone-blue .op-group-dot { background:#185fa5; }
.op-group-label { font-size:14px; font-weight:600; }
.op-group-count { font-size:11px; padding:1px 8px; border-radius:999px; background:var(--bg-muted); color:var(--text-secondary); }
.op-group-note { font-size:12px; color:var(--text-tertiary); margin-left:6px; }

/* Item card */
.op-item { display:flex; background:var(--bg-surface); border:0.5px solid var(--border-soft); border-radius:var(--radius-lg); overflow:hidden; margin-bottom:9px; }
.op-item:hover { border-color:var(--border-strong); }
.op-item.incomplete { border-style:dashed; border-color:var(--border-strong); background:var(--bg-muted); }
.op-item-stripe { width:4px; flex-shrink:0; }
.op-item-body { padding:13px 16px; flex:1; min-width:0; }
.op-item-title-row { display:flex; align-items:center; gap:8px; flex-wrap:wrap; margin-bottom:6px; }
.op-item-title { font-size:14.5px; font-weight:500; }
.op-urg { font-size:10px; font-weight:600; padding:2px 7px; border-radius:4px; text-transform:uppercase; letter-spacing:0.5px; }
.op-urg-urgent { background:#fcebeb; color:#a32d2d; }
.op-urg-today { background:#faeeda; color:#854f0b; }
.op-urg-this-week { background:#e6f1fb; color:#185fa5; }
.op-urg-later { background:var(--bg-muted); color:var(--text-tertiary); }
.op-reqchip { font-size:11px; padding:2px 8px; border-radius:999px; background:var(--accent); color:#fff; }
.op-conf { font-size:10px; padding:2px 7px; border-radius:999px; }
.op-conf-high { background:#eaf3de; color:#2c6b2c; }
.op-conf-medium { background:#faeeda; color:#854f0b; }
.op-conf-low { background:#fcebeb; color:#a32d2d; }
.op-badge { font-size:10px; padding:2px 7px; border-radius:999px; background:var(--bg-muted); color:var(--text-secondary); }
.op-badge.ok { background:#eaf3de; color:#2c6b2c; }

.op-why { font-size:13px; color:var(--text-secondary); line-height:1.5; margin-bottom:10px; }
.op-why-k { color:var(--text-tertiary); }

.op-meta { display:flex; flex-wrap:wrap; gap:18px; margin-bottom:9px; }
.op-meta-cell { min-width:0; }
.op-meta-k { font-size:10px; text-transform:uppercase; letter-spacing:0.6px; color:var(--text-tertiary); }
.op-meta-v { font-size:13px; color:var(--text-primary); }
.op-acct-dot { display:inline-block; width:8px; height:8px; border-radius:2px; margin-right:5px; vertical-align:middle; }

.op-req, .op-dep { font-size:12.5px; color:var(--text-secondary); margin-bottom:4px; line-height:1.5; }
.op-req-k, .op-dep-k { color:var(--text-tertiary); }

.op-actions { display:flex; flex-wrap:wrap; gap:7px; margin-top:11px; }
.op-act { font-size:12px; padding:5px 11px; border-radius:6px; border:0.5px solid var(--border-strong); background:var(--bg-surface); color:var(--text-secondary); cursor:pointer; }
.op-act:hover { border-color:var(--accent); color:var(--accent); }
.op-act.primary { background:var(--accent); color:#fff; border-color:var(--accent); }
.op-act.primary:hover { opacity:0.9; color:#fff; }
.op-act.ghost { border-color:transparent; color:var(--text-tertiary); }
.op-act.ghost:hover { color:#a32d2d; border-color:transparent; }

.op-empty { padding:40px; text-align:center; color:var(--text-tertiary); }

/* Toast */
.op-toast { position:fixed; bottom:54px; right:16px; background:#1f1f1d; color:#fff; font-size:12.5px; padding:9px 14px; border-radius:8px; z-index:120; display:flex; align-items:center; gap:12px; max-width:380px; }
.op-toast-undo { background:transparent; border:0.5px solid rgba(255,255,255,0.4); color:#fff; font-size:11px; padding:3px 9px; border-radius:5px; cursor:pointer; }

/* Stub */
.op-stub { background:var(--bg-surface); border:1px dashed var(--border-strong); border-radius:var(--radius-lg); padding:32px; }
.op-stub h2 { margin:0 0 8px; font-size:18px; }
.op-stub p { color:var(--text-secondary); margin:0 0 10px; max-width:64ch; }
.op-stub-hint { font-size:12.5px; color:var(--text-tertiary); }

/* Insight screen */
.op-ins-picker { display:flex; gap:7px; flex-wrap:wrap; margin-bottom:18px; }
.op-ins-chip { display:flex; align-items:center; gap:6px; padding:5px 11px; border-radius:999px; border:0.5px solid var(--border-strong); background:var(--bg-surface); color:var(--text-secondary); text-decoration:none; font-size:12px; }
.op-ins-chip:hover { border-color:var(--accent); color:var(--accent); }
.op-ins-chip.active { background:var(--accent); color:#fff; border-color:var(--accent); }
.op-ins-chip.dismissed { opacity:0.4; }
.op-ins-sev { width:8px; height:8px; border-radius:50%; flex-shrink:0; background:var(--text-tertiary); }
.op-ins-sev-urgent { background:#a32d2d; }
.op-ins-sev-today { background:#d9822b; }
.op-ins-sev-this-week { background:#185fa5; }
.op-ins-done { color:#2c6b2c; font-size:10px; }

.op-ins-panel { background:var(--bg-surface); border:0.5px solid var(--border-soft); border-radius:var(--radius-lg); padding:22px; }
.op-ins-title-row { display:flex; align-items:center; gap:9px; margin-bottom:8px; flex-wrap:wrap; }
.op-ins-id { font-size:11px; color:var(--text-tertiary); letter-spacing:0.5px; font-weight:600; }
.op-ins-kind { font-size:10px; padding:2px 7px; border-radius:999px; }
.op-ins-kind-risk { background:#fcebeb; color:#a32d2d; }
.op-ins-kind-opportunity { background:#eaf3de; color:#2c6b2c; }
.op-ins-kind-data-health { background:var(--bg-muted); color:var(--text-secondary); }
.op-ins-h2 { margin:0 0 18px; font-size:19px; font-weight:600; line-height:1.3; }

.op-ins-section { margin-bottom:14px; }
.op-ins-section-label { font-size:10px; text-transform:uppercase; letter-spacing:0.7px; color:var(--text-tertiary); margin-bottom:4px; }
.op-ins-section-body { font-size:13.5px; color:var(--text-primary); line-height:1.55; }
.op-ins-rec .op-ins-section-body { font-weight:500; }

.op-ins-conf-band { border-radius:8px; padding:11px 14px; margin-bottom:14px; font-size:13px; line-height:1.55; }
.op-ins-conf-high { background:#eaf3de; color:#2c6b2c; }
.op-ins-conf-medium { background:#faeeda; color:#854f0b; }
.op-ins-conf-low { background:#fcebeb; color:#a32d2d; }

.op-ins-list { margin:0; padding-left:18px; font-size:13px; color:var(--text-secondary); line-height:1.6; }
.op-ins-ev-row { display:flex; flex-wrap:wrap; gap:7px; }

.op-ins-routing { border-top:0.5px solid var(--border-soft); padding-top:16px; margin-top:18px; }
.op-ins-routing-label { font-size:10px; text-transform:uppercase; letter-spacing:0.7px; color:var(--text-tertiary); margin-bottom:11px; }
.op-ins-owner-suggest { font-size:12.5px; color:var(--text-secondary); margin-top:10px; }
.op-act.done { opacity:0.5; cursor:default; }
.op-ins-linked { font-size:12.5px; color:var(--text-secondary); margin-top:14px; padding-top:14px; border-top:0.5px solid var(--border-soft); }
.op-ins-linked-link { color:var(--accent); text-decoration:none; }
.op-ins-linked-link:hover { text-decoration:underline; }

/* Account Home */
.op-home-verdict { border-radius:var(--radius-lg); padding:14px 16px; margin-bottom:16px; }
.op-home-verdict-medium { background:#faeeda; }
.op-home-verdict-high { background:#eaf3de; }
.op-home-verdict-low { background:#fcebeb; }
.op-home-verdict-row { display:flex; align-items:center; gap:10px; margin-bottom:5px; }
.op-home-verdict-label { font-size:10px; text-transform:uppercase; letter-spacing:0.7px; color:var(--text-tertiary); }
.op-home-verdict-text { font-size:13.5px; line-height:1.5; }
.op-home-verdict-blind { font-size:12px; margin-top:5px; opacity:0.75; }
.op-home-scope-flag { font-weight:600; }
.op-home-cols { display:grid; grid-template-columns:1fr 1fr; gap:16px; margin-bottom:16px; }
@media (max-width:700px) { .op-home-cols { grid-template-columns:1fr; } }
.op-home-col {}
.op-home-section { background:var(--bg-surface); border:0.5px solid var(--border-soft); border-radius:var(--radius-lg); padding:14px 16px; margin-bottom:14px; }
.op-home-attn-row, .op-home-dec-row, .op-home-ins-row, .op-home-proj-row { display:flex; align-items:center; gap:8px; padding:6px 0; border-bottom:0.5px solid var(--border-soft); flex-wrap:wrap; }
.op-home-attn-row:last-child, .op-home-dec-row:last-child, .op-home-ins-row:last-child, .op-home-proj-row:last-child { border-bottom:none; }
.op-home-attn-title { flex:1; font-size:13px; color:var(--text-primary); min-width:0; }
.op-home-dec-meta { font-size:11px; color:var(--text-tertiary); width:100%; padding-left:4px; }
.op-home-link { font-size:12px; color:var(--accent); text-decoration:none; flex-shrink:0; }
.op-home-proj-status { font-size:10px; padding:2px 7px; border-radius:4px; background:var(--bg-muted); color:var(--text-secondary); }
.op-home-proj-status-blocked { background:#fcebeb; color:#a32d2d; }
.op-home-proj-status-in-progress { background:#eaf3de; color:#2c6b2c; }
.op-home-proj-status-waiting { background:#faeeda; color:#854f0b; }
.op-home-proj-status-review { background:#e6f1fb; color:#185fa5; }
.op-home-proj-blocker { font-size:10px; padding:2px 6px; border-radius:4px; background:#fcebeb; color:#a32d2d; }
.op-home-scope { font-size:10px; padding:2px 6px; border-radius:4px; background:#faeeda; color:#854f0b; }
.op-home-conf-strip { display:flex; align-items:center; gap:12px; padding:11px 14px; background:var(--bg-muted); border-radius:var(--radius-lg); font-size:12px; }
.op-home-conf-note { color:var(--text-tertiary); }

/* Account Projects */
.op-proj-board { display:flex; gap:14px; overflow-x:auto; padding-bottom:8px; margin-bottom:16px; }
.op-proj-col { min-width:240px; flex-shrink:0; }
.op-proj-col-head { display:flex; align-items:center; gap:8px; margin-bottom:10px; }
.op-proj-col-label { font-size:12px; font-weight:600; color:var(--text-secondary); text-transform:uppercase; letter-spacing:0.5px; }
.op-proj-card { background:var(--bg-surface); border:0.5px solid var(--border-soft); border-radius:var(--radius-lg); padding:13px 14px; margin-bottom:8px; }
.op-proj-card.blocked { border-color:#f0c0c0; background:#fdf5f5; }
.op-proj-card.oos { border-style:dashed; }
.op-proj-card-title-row { display:flex; align-items:center; gap:7px; flex-wrap:wrap; margin-bottom:4px; }
.op-proj-id { font-size:10px; color:var(--text-tertiary); letter-spacing:0.4px; font-weight:600; }
.op-proj-oos { font-size:10px; padding:2px 6px; border-radius:4px; background:#faeeda; color:#854f0b; }
.op-proj-card-name { font-size:13.5px; font-weight:500; margin-bottom:8px; }
.op-proj-blocker-note { font-size:12.5px; color:#a32d2d; margin-bottom:8px; line-height:1.4; }
.op-proj-links { display:flex; gap:6px; flex-wrap:wrap; margin-top:6px; }
.op-proj-links a { text-decoration:none; }

/* Sales / CRM */
.op-crm-pipeline-strip { display:flex; gap:10px; flex-wrap:wrap; margin-bottom:20px; }
.op-crm-stage-pill { display:flex; align-items:center; gap:7px; padding:6px 12px; background:var(--bg-surface); border:0.5px solid var(--border-soft); border-radius:999px; font-size:12px; }
.op-crm-stage-label { color:var(--text-secondary); }
.op-crm-dossier { background:var(--bg-surface); border:0.5px solid var(--border-soft); border-radius:var(--radius-lg); padding:18px; margin-bottom:16px; }
.op-crm-biz-head { display:flex; align-items:flex-start; justify-content:space-between; gap:12px; margin-bottom:10px; flex-wrap:wrap; }
.op-crm-biz-name { font-size:17px; font-weight:600; }
.op-crm-biz-meta { font-size:12px; color:var(--text-tertiary); margin-top:2px; }
.op-crm-biz-badges { display:flex; gap:8px; align-items:center; flex-shrink:0; flex-wrap:wrap; }
.op-crm-icp { font-size:11px; padding:3px 8px; border-radius:999px; }
.op-crm-icp-high { background:#eaf3de; color:#2c6b2c; }
.op-crm-icp-medium { background:#faeeda; color:#854f0b; }
.op-crm-icp-low { background:#fcebeb; color:#a32d2d; }
.op-crm-pain { font-size:13px; color:var(--text-secondary); margin-bottom:5px; line-height:1.45; }
.op-crm-opp { background:var(--bg-muted); border:0.5px solid var(--border-soft); border-radius:var(--radius-lg); padding:14px 16px; margin-top:14px; }
.op-crm-opp-head { display:flex; align-items:center; gap:9px; margin-bottom:10px; flex-wrap:wrap; }
.op-crm-stage-badge { font-size:11px; padding:3px 8px; border-radius:4px; background:var(--accent); color:#fff; }
.op-crm-opp-id { font-size:11px; color:var(--text-tertiary); letter-spacing:0.4px; }
.op-crm-value { font-size:13px; font-weight:600; color:var(--text-primary); margin-left:auto; }
.op-crm-workflows { margin:12px 0; }
.op-crm-wf-row { display:flex; align-items:center; gap:9px; padding:5px 0; border-bottom:0.5px solid var(--border-soft); font-size:12.5px; }
.op-crm-wf-row:last-child { border-bottom:none; }
.op-crm-wf-dot { width:8px; height:8px; border-radius:50%; flex-shrink:0; background:var(--text-tertiary); }
.op-crm-wf-dot.built { background:#2c6b2c; }
.op-crm-wf-dot.designed { background:#d9822b; }
.op-crm-wf-dot.future { background:var(--border-strong); }
.op-crm-wf-label { width:140px; flex-shrink:0; color:var(--text-primary); }
.op-crm-wf-status { color:var(--text-tertiary); }
.op-crm-ghl-status { font-size:12.5px; color:var(--text-secondary); margin:8px 0; }
.op-crm-ghl-update { background:#fff8e1; border:0.5px solid #f0c040; border-radius:var(--radius-lg); padding:12px 14px; margin-top:12px; }
.op-crm-ghl-update.approved { background:#eaf3de; border-color:#b3d68a; }
.op-crm-ghl-update-label { font-size:11px; text-transform:uppercase; letter-spacing:0.7px; color:var(--text-tertiary); margin-bottom:5px; }
.op-crm-ghl-update-body { font-size:13px; color:var(--text-primary); margin-bottom:10px; }

/* Sales / CRM (OPS-207): source-mix rows, per-account GHL leads */
.op-sales-source-mix { display:flex; flex-direction:column; gap:0; border:0.5px solid var(--border-soft); border-radius:var(--radius-lg); overflow:hidden; margin-bottom:20px; }
.op-sales-source-row { display:flex; justify-content:space-between; gap:10px; padding:8px 14px; border-bottom:0.5px solid var(--border-soft); font-size:12.5px; }
.op-sales-source-row:last-child { border-bottom:none; }
.op-sales-source-name { color:var(--text-primary); }
.op-sales-source-count { color:var(--text-tertiary); font-weight:600; }

/* Website & Search */
.op-ws-section { margin-bottom:22px; }
.op-ws-table { display:flex; flex-direction:column; gap:0; border:0.5px solid var(--border-soft); border-radius:var(--radius-lg); overflow:hidden; }
.op-ws-row { display:grid; grid-template-columns:80px 1fr 1fr 80px; gap:10px; align-items:start; padding:10px 14px; border-bottom:0.5px solid var(--border-soft); font-size:12.5px; }
.op-ws-row:last-child { border-bottom:none; }
.op-ws-who { font-size:10px; font-weight:600; padding:2px 6px; border-radius:4px; text-align:center; }
.op-ws-who-agent { background:#e6f1fb; color:#185fa5; }
.op-ws-who-human { background:#eaf3de; color:#2c6b2c; }
.op-ws-who-outreach { background:#faeeda; color:#854f0b; }
.op-ws-signal { color:var(--text-primary); }
.op-ws-action { color:var(--text-secondary); }
.op-ws-future-row { display:flex; align-items:flex-start; gap:12px; padding:10px 0; border-bottom:0.5px solid var(--border-soft); font-size:12.5px; flex-wrap:wrap; }
.op-ws-future-row:last-child { border-bottom:none; }
.op-ws-future-label { font-weight:500; width:180px; flex-shrink:0; color:var(--text-primary); }
.op-ws-future-note { flex:1; color:var(--text-secondary); }

/* Paid Media · tab nav styles moved to styles.css (.op-pm-tabs / .op-pm-tab) */

/* Paid Media scoreboard row (spec §3.1): 4-up story-cards at the top of the screen. */
.op-pm-scoreboard-section { margin-bottom:22px; }
.op-pm-scoreboard-head { display:flex; align-items:baseline; justify-content:space-between; gap:12px; margin-bottom:10px; flex-wrap:wrap; }
.op-pm-scoreboard-title { font-size:14px; font-weight:600; }
.op-pm-scoreboard-window { font-size:11px; color:var(--text-tertiary); }
.op-pm-scoreboard { display:grid; grid-template-columns:repeat(4,1fr); gap:10px; align-items:start; }
/* OPS-243 C: prevent grid blowout from white-space:nowrap content inside tiles */
.op-pm-scoreboard > * { min-width: 0; }
@media (max-width:1000px) { .op-pm-scoreboard { grid-template-columns:repeat(2,1fr); } }
@media (max-width:560px)  { .op-pm-scoreboard { grid-template-columns:1fr; } }

/* Website & SEO verdict row (spec §4.1): 3-up story-cards, same section shell
   as the Paid Media scoreboard, one fewer column. */
.op-ws-verdict-scoreboard { display:grid; grid-template-columns:repeat(3,1fr); gap:12px; align-items:start; }
@media (max-width:900px) { .op-ws-verdict-scoreboard { grid-template-columns:repeat(2,1fr); } }
@media (max-width:560px) { .op-ws-verdict-scoreboard { grid-template-columns:1fr; } }

/* Paid Media By Ad table (spec §3.3): one merged ads table, paused toggle,
   low-volume rows greyed. */
.op-pm-byad-section { margin-bottom:22px; }
.op-pm-byad-head { display:flex; align-items:baseline; justify-content:space-between; gap:12px; margin-bottom:10px; flex-wrap:wrap; }
.op-pm-byad-title { font-size:14px; font-weight:600; }
.op-pm-byad-window { font-size:11px; color:var(--text-tertiary); margin-right:auto; margin-left:8px; }
.op-pm-byad-toggle { display:flex; align-items:center; gap:6px; font-size:12px; color:var(--text-secondary); cursor:pointer; }
.op-pm-byad-scroll { overflow-x:auto; border:0.5px solid var(--border-soft); border-radius:var(--radius-lg); }
.op-pm-byad-table { width:100%; border-collapse:collapse; font-size:12.5px; }
.op-pm-byad-table th { text-align:right; font-weight:600; color:var(--text-secondary); background:var(--bg-muted); padding:9px 12px; white-space:normal; vertical-align:bottom; border-bottom:0.5px solid var(--border-soft); }
/* OPS-254: let multi-word metric headers wrap so the columns stay tight
   (bigger thumbnails buy their width from wrapped headers + wrapped ad names). */
.op-pm-byad-table th.op-pm-byad-c-num { max-width:80px; }
.op-pm-byad-table td { text-align:right; padding:9px 12px; white-space:nowrap; border-bottom:0.5px solid var(--border-soft); color:var(--text-primary); }
.op-pm-byad-table tr:last-child td { border-bottom:0; }
.op-pm-byad-c-name { text-align:left !important; }
.op-pm-byad-c-status { text-align:center !important; }
/* OPS-252 fix: pin the ad-identity column so it stays visible while the wider
   classification columns scroll horizontally (thumbnail folded into this cell). */
.op-pm-byad-table th.op-pm-byad-c-name,
.op-pm-byad-table td.op-pm-byad-c-name { position:sticky; left:0; z-index:2; min-width:250px; max-width:310px; box-shadow:1px 0 0 var(--border-soft); }
.op-pm-byad-table td.op-pm-byad-c-name { background:var(--bg-surface,#fff); }
.op-pm-byad-table th.op-pm-byad-c-name { background:var(--bg-muted); }
.op-pm-byad-c-name-inner { display:flex; align-items:center; gap:11px; }
.op-pm-byad-c-name-text { display:flex; flex-direction:column; gap:2px; min-width:0; }
/* OPS-254: wrap the ad name (up to 3 lines) instead of truncating, so the
   identity column stays narrow while the thumbnail can be large. */
.op-pm-byad-name-label { white-space:normal; overflow-wrap:anywhere; display:-webkit-box; -webkit-line-clamp:3; -webkit-box-orient:vertical; overflow:hidden; }
/* Action prose wraps in a narrow column instead of forcing the table wider. */
.op-pm-byad-table th.op-pm-byad-c-action { text-align:left; }
.op-pm-byad-table td.op-pm-byad-c-action { white-space:normal; max-width:190px; text-align:left; color:var(--text-secondary); font-size:11.5px; line-height:1.35; }
.op-pm-byad-row-low td { color:var(--text-tertiary); }
.op-pm-byad-floor-tag { display:inline-block; margin-left:8px; font-size:10px; padding:1px 7px; border-radius:999px; background:var(--bg-muted); color:var(--text-tertiary); }
.op-pm-byad-foot { margin-top:10px; }
.op-pm-byad-foot p { font-size:11px; color:var(--text-tertiary); margin:4px 0; }

/* Campaigns mirror (OPS-195): secondary drill-down, campaign -> adset -> ad tree. */
.op-pm-mir-section { margin-bottom:22px; }
.op-pm-mir-head { display:flex; align-items:baseline; justify-content:space-between; gap:12px; margin-bottom:6px; flex-wrap:wrap; }
.op-pm-mir-title { font-size:14px; font-weight:600; }
.op-pm-mir-window { font-size:11px; color:var(--text-tertiary); margin-right:auto; margin-left:8px; }
.op-pm-mir-toggle { display:flex; align-items:center; gap:6px; font-size:12px; color:var(--text-secondary); cursor:pointer; }
.op-pm-mir-caption { font-size:11px; color:var(--text-tertiary); margin:0 0 10px; }
.op-pm-mir-scroll { overflow-x:auto; overflow-y:auto; max-height:70vh; border:0.5px solid var(--border-soft); border-radius:var(--radius-lg); }
.op-pm-mir-table { width:100%; border-collapse:collapse; font-size:12.5px; }
.op-pm-mir-table th { text-align:right; font-weight:600; color:var(--text-secondary); background:var(--bg-muted); padding:8px 10px; white-space:nowrap; border-bottom:0.5px solid var(--border-soft); position:sticky; top:0; z-index:1; }
.op-pm-mir-table td { text-align:right; padding:8px 10px; white-space:nowrap; border-bottom:0.5px solid var(--border-soft); color:var(--text-primary); }
.op-pm-mir-table tr:last-child td { border-bottom:0; }
.op-pm-mir-c-name { text-align:left !important; }
.op-pm-mir-c-status { text-align:center !important; }
.op-pm-mir-c-thumb { text-align:left !important; width:40px; padding-left:6px !important; padding-right:0 !important; }
.op-pm-mir-c-form { text-align:left !important; color:var(--text-tertiary); font-size:11px; }
.op-pm-mir-thumb { width:28px; height:28px; object-fit:cover; border-radius:4px; display:block; }
.op-pm-mir-toggle-col { width:20px; }
.op-pm-mir-toggle-cell { width:20px; }
.op-pm-mir-toggle-btn { border:0; background:none; cursor:pointer; font-size:11px; color:var(--text-secondary); padding:0 4px 0 0; }
.op-pm-mir-name { display:inline-block; }
.op-pm-mir-campaign td { font-weight:600; background:var(--bg-muted); }
.op-pm-mir-adset td { color:var(--text-secondary); }
.op-pm-mir-foot { margin-top:10px; }
.op-pm-mir-foot p { font-size:11px; color:var(--text-tertiary); margin:4px 0; }

/* Creative fatigue board (spec §3.2): one story-card per active creative. */
.op-pm-fatigue-section { margin-bottom:22px; }
.op-pm-fatigue-head { display:flex; align-items:baseline; justify-content:space-between; gap:12px; margin-bottom:10px; flex-wrap:wrap; }
.op-pm-fatigue-title { font-size:14px; font-weight:600; }
.op-pm-fatigue-window { font-size:11px; color:var(--text-tertiary); }
.op-pm-fatigue-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:12px; align-items:start; }
@media (max-width:1100px) { .op-pm-fatigue-grid { grid-template-columns:repeat(2,1fr); } }
@media (max-width:640px)  { .op-pm-fatigue-grid { grid-template-columns:1fr; } }
.op-pm-fatigue-foot { margin-top:10px; }
.op-pm-fatigue-foot p { font-size:11px; color:var(--text-tertiary); margin:4px 0; }
/* P1-7 aggregate lines (too-early / learning), replacing one card per ad. */
.op-pm-fatigue-agg { font-size:var(--fs-support); color:var(--text-tertiary); margin:6px 0; }

/* Angle / format matrix (spec §3.4): rows = angle, cols = format. */
.op-pm-angle-section { margin-bottom:22px; }
.op-pm-angle-head { display:flex; align-items:baseline; justify-content:space-between; gap:12px; margin-bottom:10px; flex-wrap:wrap; }
.op-pm-angle-title { font-size:14px; font-weight:600; }
.op-pm-angle-window { font-size:11px; color:var(--text-tertiary); }
.op-pm-angle-scroll { overflow-x:auto; border:0.5px solid var(--border-soft); border-radius:var(--radius-lg); }
.op-pm-angle-table { width:100%; border-collapse:collapse; font-size:12.5px; }
.op-pm-angle-table th { text-align:center; font-weight:600; color:var(--text-secondary); background:var(--bg-muted); padding:9px 12px; white-space:nowrap; border-bottom:0.5px solid var(--border-soft); }
.op-pm-angle-table td { text-align:center; padding:9px 12px; white-space:nowrap; border-bottom:0.5px solid var(--border-soft); color:var(--text-primary); vertical-align:middle; }
.op-pm-angle-table tr:last-child td { border-bottom:0; }
.op-pm-angle-c-angle { text-align:left !important; font-weight:500; max-width:220px; white-space:normal; }
.op-pm-angle-cpl { font-weight:600; font-variant-numeric:tabular-nums; }
.op-pm-angle-share { font-size:10.5px; color:var(--text-tertiary); margin-top:2px; }
.op-pm-angle-cell-low .op-pm-angle-cpl, .op-pm-angle-cell-low .op-pm-angle-share { color:var(--text-tertiary); opacity:0.72; }
.op-pm-angle-empty { color:var(--text-tertiary); }
.op-pm-angle-foot { margin-top:10px; }
.op-pm-angle-foot p { font-size:11px; color:var(--text-tertiary); margin:4px 0; }

/* OPS-278: format performance table + per-angle format gate */
.op-pm-fmt-untagged { color:var(--text-tertiary); font-style:italic; }
.op-pm-angle-fmt-line { font-size:11px; color:var(--text-tertiary); display:block; margin-top:3px; }

/* Step 5: Arbisan commercial chain (spec §3.5) */
.op-pm-chain-section { margin-bottom:22px; }
.op-pm-chain-head { display:flex; align-items:baseline; justify-content:space-between; gap:12px; margin-bottom:10px; flex-wrap:wrap; }
.op-pm-chain-title { font-size:14px; font-weight:600; }
.op-pm-chain-window { font-size:11px; color:var(--text-tertiary); }

/* MMW blended paid-payback cards (Conversions tab): 7d / 28d / lifetime side by
   side, collapsing to one column on narrow viewports. Cards are storycards. */
.op-pm-shopify-cards { display:grid; grid-template-columns:repeat(3,1fr); gap:12px; align-items:start; }
@media (max-width:900px) { .op-pm-shopify-cards { grid-template-columns:1fr; } }
/* Honest attribution caveat (blended-only / UTM coverage). Product-mode-visible
   because storycard footnotes only render in Spec mode (§2b.7). */
.op-pm-shopify-note { margin:10px 2px 0; font-size:11px; line-height:1.5; color:var(--text-tertiary); }

.op-pm-strip { display:grid; grid-template-columns:repeat(6,1fr); gap:1px; background:var(--border-soft); border:0.5px solid var(--border-soft); border-radius:var(--radius-lg); overflow:hidden; margin-bottom:10px; }
@media (max-width:700px) { .op-pm-strip { grid-template-columns:repeat(3,1fr); } }
.op-pm-strip-cell { background:var(--bg-surface); padding:11px 14px; }
.op-pm-strip-label { font-size:10px; text-transform:uppercase; letter-spacing:0.6px; color:var(--text-tertiary); margin-bottom:3px; }
.op-pm-strip-val { font-size:18px; font-weight:600; color:var(--text-primary); line-height:1.2; }
.op-pm-strip-sub { font-size:11px; color:var(--text-tertiary); margin-top:2px; }
.op-pm-pace-hot  { color:#d9822b; }
.op-pm-pace-cold { color:#a32d2d; }

.op-pm-conn-row { display:flex; align-items:center; gap:8px; flex-wrap:wrap; margin-bottom:18px; }
.op-pm-conn { font-size:11px; padding:3px 9px; border-radius:999px; }
.op-pm-conn-live    { background:#eaf3de; color:#2c6b2c; }
.op-pm-conn-partial { background:#faeeda; color:#854f0b; }
.op-pm-conn-missing { background:#fcebeb; color:#a32d2d; }
.op-pm-updated { font-size:11px; color:var(--text-tertiary); margin-left:auto; }

.op-pm-funnel { display:flex; flex-direction:column; gap:4px; margin-bottom:16px; }
.op-pm-funnel-step { display:flex; align-items:flex-start; justify-content:space-between; gap:12px; background:var(--bg-surface); border:0.5px solid var(--border-soft); border-radius:var(--radius-lg); padding:11px 14px; flex-wrap:wrap; }
.op-pm-funnel-step.blind { background:var(--bg-muted); border-style:dashed; }
.op-pm-funnel-left { display:flex; align-items:flex-start; gap:11px; flex:1; min-width:0; }
.op-pm-funnel-right { display:flex; align-items:center; gap:10px; flex-shrink:0; }
.op-pm-step-num { width:22px; height:22px; border-radius:50%; background:var(--bg-muted); border:0.5px solid var(--border-strong); color:var(--text-tertiary); font-size:11px; font-weight:600; display:flex; align-items:center; justify-content:center; flex-shrink:0; }
.op-pm-step-name { font-size:13.5px; font-weight:500; color:var(--text-primary); }
.op-pm-step-sub  { font-size:12px; color:var(--text-secondary); }
.op-pm-step-cvr  { font-size:11px; color:var(--text-tertiary); margin-top:2px; }
.op-pm-step-note { font-size:12px; color:var(--text-secondary); margin-top:6px; line-height:1.45; width:100%; padding-top:6px; border-top:0.5px solid var(--border-soft); }
.op-pm-blind-note { color:#854f0b; }
.op-pm-step-value { font-size:18px; font-weight:600; color:var(--text-primary); }
.op-pm-step-blind-val { font-size:13px; color:var(--text-tertiary); font-style:italic; }
.op-pm-rag { font-size:10px; font-weight:600; padding:2px 7px; border-radius:4px; text-transform:uppercase; letter-spacing:0.4px; }
.op-pm-rag-green { background:#eaf3de; color:#2c6b2c; }
.op-pm-rag-amber { background:#faeeda; color:#854f0b; }
.op-pm-rag-red   { background:#fcebeb; color:#a32d2d; }
.op-pm-rag-grey  { background:var(--bg-muted); color:var(--text-tertiary); }
.op-pm-rag-blind { background:#faeeda; color:#854f0b; font-style:italic; }

.op-pm-cc-wrap { display:flex; flex-direction:column; gap:6px; }
.op-pm-cc-row { border-radius:var(--radius-lg); padding:10px 14px; }
.op-pm-cc-ok   { background:#eaf3de; }
.op-pm-cc-warn { background:#faeeda; }
.op-pm-cc-label { font-size:12.5px; font-weight:500; color:var(--text-primary); margin-bottom:4px; }
.op-pm-cc-vals  { display:flex; gap:14px; margin-bottom:3px; }
.op-pm-cc-val   { font-size:12.5px; color:var(--text-secondary); }
.op-pm-cc-note  { font-size:11.5px; color:var(--text-tertiary); }

.op-pm-level-toggle { display:flex; gap:2px; background:var(--bg-muted); border-radius:6px; padding:2px; width:fit-content; margin-bottom:14px; }
.op-pm-level-btn { font-size:12px; padding:5px 12px; border-radius:5px; border:none; background:transparent; color:var(--text-secondary); cursor:pointer; }
.op-pm-level-btn.active { background:var(--bg-surface); color:var(--text-primary); box-shadow:0 0 0 0.5px var(--border-soft); }
.op-pm-table-head { background:var(--bg-muted); }
.op-pm-table-row { display:grid; grid-template-columns:3fr repeat(8,1fr); gap:0; border-bottom:0.5px solid var(--border-soft); }
@media (max-width:900px) { .op-pm-table-row { grid-template-columns:2fr repeat(5,1fr); } }
.op-pm-th { font-size:10px; text-transform:uppercase; letter-spacing:0.5px; color:var(--text-tertiary); padding:8px 10px; }
.op-pm-td { font-size:13px; padding:10px 10px; color:var(--text-primary); }
.op-pm-td-name { padding:10px 10px; }
.op-pm-row-name { font-size:13px; font-weight:500; color:var(--text-primary); }
.op-pm-row-status { font-size:10px; color:var(--text-tertiary); margin-top:2px; }
.op-pm-status-ACTIVE { color:#2c6b2c; }
.op-pm-status-PAUSED { color:#854f0b; }
.op-pm-rag-cell-green { color:#2c6b2c; font-weight:500; }
.op-pm-rag-cell-amber { color:#854f0b; font-weight:500; }
.op-pm-rag-cell-red   { color:#a32d2d; font-weight:500; }

.op-pm-ad-card { background:var(--bg-surface); border:0.5px solid var(--border-soft); border-radius:var(--radius-lg); padding:14px 16px; margin-bottom:10px; }
.op-pm-ad-title-row { display:flex; align-items:center; gap:9px; flex-wrap:wrap; margin-bottom:7px; }
.op-pm-ad-rank { font-size:11px; font-weight:600; padding:2px 7px; border-radius:4px; background:var(--bg-muted); color:var(--text-secondary); }
.op-pm-ad-rank.top { background:#faeeda; color:#854f0b; }
.op-pm-ad-name { font-size:13.5px; font-weight:500; flex:1; min-width:0; }
.op-pm-ad-status { font-size:10px; font-weight:600; padding:2px 8px; border-radius:999px; flex-shrink:0; }
.op-pm-adst-fresh   { background:#eaf3de; color:#2c6b2c; }
.op-pm-adst-tiring  { background:#faeeda; color:#854f0b; }
.op-pm-adst-fatigued { background:#fcebeb; color:#a32d2d; }
.op-pm-ad-headline { font-size:13px; color:var(--text-secondary); font-style:italic; margin-bottom:10px; line-height:1.4; }
.op-pm-ad-metrics { display:grid; grid-template-columns:repeat(7,1fr); gap:1px; background:var(--border-soft); border:0.5px solid var(--border-soft); border-radius:var(--radius-lg); overflow:hidden; }
@media (max-width:700px) { .op-pm-ad-metrics { grid-template-columns:repeat(4,1fr); } }
.op-pm-ad-metric { background:var(--bg-surface); padding:8px 10px; }
.op-pm-ad-metric-label { font-size:10px; text-transform:uppercase; letter-spacing:0.5px; color:var(--text-tertiary); }
.op-pm-ad-metric-val { font-size:15px; font-weight:600; color:var(--text-primary); margin-top:2px; }

/* ── Website & Search ─────────────────────────────────────── */
.op-ws-strip { display:grid; grid-template-columns:repeat(4,1fr); gap:1px; background:var(--border-soft); border:0.5px solid var(--border-soft); border-radius:var(--radius-lg); overflow:hidden; margin-bottom:12px; }
.op-ws-strip-cell { background:var(--bg-surface); padding:12px 14px; }
.op-ws-strip-main { font-size:20px; font-weight:700; color:var(--text-primary); margin:2px 0; }
.op-ws-strip-sub { font-size:11px; color:var(--text-tertiary); }
@media (max-width:700px) { .op-ws-strip { grid-template-columns:repeat(2,1fr); } }

.op-ws-section-label { font-size:10px; text-transform:uppercase; letter-spacing:0.8px; color:var(--text-tertiary); font-weight:600; margin:18px 0 8px; }

.op-ws-intent-bar { display:flex; height:10px; border-radius:5px; overflow:hidden; margin-bottom:12px; gap:2px; }
.op-ws-intent-seg { height:100%; border-radius:2px; transition:opacity 0.15s; }
.op-ws-intent-seg:hover { opacity:0.75; }

.op-ws-bucket-grid { display:grid; grid-template-columns:repeat(5,1fr); gap:8px; margin-bottom:16px; }
@media (max-width:700px) { .op-ws-bucket-grid { grid-template-columns:repeat(2,1fr); } }
.op-ws-bucket { background:var(--bg-surface); border:0.5px solid var(--border-soft); border-radius:var(--radius-md); padding:12px; position:relative; }
.op-ws-bucket-dot { display:inline-block; width:8px; height:8px; border-radius:50%; margin-bottom:6px; }
.op-ws-bucket-name { font-size:11px; font-weight:600; color:var(--text-secondary); text-transform:uppercase; letter-spacing:0.4px; margin-bottom:6px; }
.op-ws-bucket-val { font-size:20px; font-weight:700; color:var(--text-primary); }
.op-ws-bucket-pct { font-size:12px; color:var(--text-secondary); margin-bottom:4px; }
.op-ws-bucket-eng { font-size:11px; color:var(--text-tertiary); }

.op-ws-device-row { display:flex; gap:8px; margin-bottom:16px; }
.op-ws-device-chip { background:var(--bg-surface); border:0.5px solid var(--border-soft); border-radius:var(--radius-md); padding:10px 16px; text-align:center; }
.op-ws-device-label { font-size:11px; color:var(--text-secondary); }
.op-ws-device-pct { font-size:18px; font-weight:700; color:var(--text-primary); margin-top:2px; }

/* Landing pages */
.op-ws-lp-row { display:grid; grid-template-columns:3fr repeat(5,1fr); gap:1px; background:var(--border-soft); }
.op-ws-lp-row-28d { grid-template-columns:3fr repeat(6,1fr) 0.9fr; }
.op-ws-lp-head { background:var(--bg-muted); }
.op-ws-lp-th { background:var(--bg-muted); padding:7px 10px; font-size:10px; text-transform:uppercase; letter-spacing:0.5px; color:var(--text-tertiary); font-weight:600; }
.op-ws-lp-td { background:var(--bg-surface); padding:10px; font-size:13px; color:var(--text-primary); display:flex; align-items:center; }
.op-ws-lp-name { flex-direction:column; align-items:flex-start; gap:2px; }
.op-ws-lp-title { font-weight:500; }
.op-ws-lp-url { font-size:11px; color:var(--text-tertiary); }

.op-ws-lp-row-low .op-ws-lp-td { opacity:0.55; }
.op-ws-lp-floor { font-size:10px; color:var(--text-tertiary); font-style:italic; margin-top:2px; }

.op-ws-lp-spark-td { padding:6px 10px; }
.op-ws-lp-spark { display:block; }
.op-ws-lp-spark-line { fill:none; stroke:var(--text-secondary); stroke-width:1.5; }
.op-ws-lp-spark-empty { color:var(--text-tertiary); font-size:12px; }

.op-ws-lp-delta { font-size:12px; font-weight:600; }
.op-ws-lp-delta-up { color:#2c6b2c; }
.op-ws-lp-delta-down { color:#a32d2d; }
.op-ws-lp-delta-flat { color:var(--text-tertiary); font-weight:500; }

.op-ws-lp-health { font-size:11px; font-weight:600; padding:3px 8px; border-radius:var(--radius-md); }
.op-ws-lp-health-traffic { color:#a32d2d; background:rgba(163,45,45,0.1); }
.op-ws-lp-health-leaking { color:#b8791a; background:rgba(184,121,26,0.1); }
.op-ws-lp-health-converting { color:#2c6b2c; background:rgba(44,107,44,0.1); }
.op-ws-lp-health-na { color:var(--text-tertiary); font-weight:500; }

.op-ws-lp-switcher { display:flex; align-items:center; gap:8px; margin-bottom:12px; }
.op-ws-lp-switcher-label { font-size:12px; color:var(--text-secondary); }
.op-ws-lp-switcher-select { font-size:13px; padding:4px 8px; border-radius:var(--radius-md); border:0.5px solid var(--border-soft); background:var(--bg-surface); color:var(--text-primary); }

.op-ws-lp-footnote { font-size:11px; color:var(--text-tertiary); margin-top:10px; line-height:1.5; }

/* Search */
.op-ws-lift-banner { display:flex; align-items:center; gap:12px; background:var(--bg-surface); border:0.5px solid var(--border-soft); border-radius:var(--radius-md); padding:12px 16px; margin-bottom:16px; }
.op-ws-lift-label { font-size:11px; text-transform:uppercase; letter-spacing:0.5px; color:var(--text-secondary); font-weight:600; }
.op-ws-lift-val { font-size:16px; font-weight:700; color:#16a34a; }
.op-ws-search-split { display:grid; grid-template-columns:1fr 1fr; gap:12px; margin-bottom:20px; }
@media (max-width:600px) { .op-ws-search-split { grid-template-columns:1fr; } }
.op-ws-search-card { background:var(--bg-surface); border:0.5px solid var(--border-soft); border-radius:var(--radius-lg); padding:16px; }
.op-ws-search-card-title { font-size:12px; font-weight:700; text-transform:uppercase; letter-spacing:0.5px; color:var(--text-secondary); margin-bottom:12px; }
.op-ws-search-card-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:8px; margin-bottom:10px; }
.op-ws-search-metric-val { font-size:18px; font-weight:700; color:var(--text-primary); }
.op-ws-search-metric-label { font-size:10px; color:var(--text-tertiary); margin-top:2px; }
.op-ws-search-note { font-size:11px; color:var(--text-tertiary); padding-top:8px; border-top:0.5px solid var(--border-soft); }
.op-ws-query-row { display:grid; grid-template-columns:3fr repeat(4,1fr); gap:1px; background:var(--border-soft); }
.op-ws-query-head { background:var(--bg-muted); }
.op-ws-query-th { background:var(--bg-muted); padding:7px 10px; font-size:10px; text-transform:uppercase; letter-spacing:0.5px; color:var(--text-tertiary); font-weight:600; }
.op-ws-query-td { background:var(--bg-surface); padding:10px; font-size:13px; color:var(--text-primary); }
.op-ws-query-name { font-weight:400; }

/* Behaviour */
.op-ws-beh-note { font-size:12px; color:var(--text-secondary); margin-bottom:4px; display:flex; align-items:center; gap:8px; }
.op-ws-beh-sessions { font-size:12px; color:var(--text-tertiary); margin-bottom:8px; }
.op-ws-beh-row { display:flex; justify-content:space-between; align-items:flex-start; background:var(--bg-surface); border:0.5px solid var(--border-soft); border-radius:var(--radius-md); padding:12px; margin-bottom:8px; }
.op-ws-beh-page { font-size:13px; font-weight:500; color:var(--text-primary); }
.op-ws-beh-url { font-size:11px; color:var(--text-tertiary); margin-top:2px; }
.op-ws-beh-count { font-size:13px; font-weight:600; color:#dc2626; text-align:right; }
.op-ws-beh-issue { font-size:11px; color:var(--text-secondary); text-align:right; margin-top:2px; }
.op-ws-sd-head { display:grid; grid-template-columns:2fr repeat(3,1fr); gap:1px; background:var(--border-soft); margin-top:4px; }
.op-ws-sd-row { display:grid; grid-template-columns:2fr repeat(3,1fr); gap:1px; background:var(--border-soft); }
.op-ws-sd-th { background:var(--bg-muted); padding:7px 10px; font-size:10px; text-transform:uppercase; letter-spacing:0.5px; color:var(--text-tertiary); font-weight:600; }
.op-ws-sd-name { background:var(--bg-surface); padding:10px; font-size:13px; font-weight:500; color:var(--text-primary); }

/* Coming soon */
.op-coming-soon { text-align:center; padding:60px 24px; }
.op-cs-icon { font-size:28px; color:var(--text-tertiary); margin-bottom:12px; }
.op-cs-title { font-size:16px; font-weight:600; color:var(--text-secondary); margin-bottom:8px; }
.op-cs-note { font-size:13px; color:var(--text-tertiary); max-width:400px; margin:0 auto; }

/* Account 3-tab horizontal nav */
.account-tabs { display:flex; gap:0; border-bottom:1.5px solid var(--border-soft); padding:0 24px; background:var(--bg-surface); margin-bottom:0; }
.account-tabs a { padding:12px 18px; font-size:13px; font-weight:500; color:var(--text-secondary); text-decoration:none; border-bottom:2px solid transparent; margin-bottom:-1.5px; transition:color 0.15s, border-color 0.15s; }
.account-tabs a:hover { color:var(--text-primary); }
.account-tabs a.active { color:var(--accent); border-bottom-color:var(--accent); font-weight:600; }

/* Account Summary screen */
.op-sum-verdict { background:var(--bg-muted); border:1px solid var(--border-soft); border-radius:8px; padding:18px 20px; margin:20px 24px 0; }
.op-sum-verdict-label { font-size:10px; font-weight:700; letter-spacing:0.8px; color:var(--text-tertiary); text-transform:uppercase; margin-bottom:8px; }
.op-sum-verdict-text { font-size:15px; color:var(--text-primary); line-height:1.5; margin-bottom:10px; }
.op-sum-conf { display:flex; align-items:center; gap:8px; }
.op-sum-conf-label { font-size:11px; color:var(--text-tertiary); }
.op-sum-conf-val { font-size:11px; font-weight:600; padding:2px 8px; border-radius:4px; text-transform:capitalize; }
.op-sum-conf-green { background:#d4edda; color:#1a6630; }
.op-sum-conf-amber { background:#fff3cd; color:#856404; }
.op-sum-conf-red { background:#f8d7da; color:#721c24; }
.op-sum-conf-grey { background:var(--bg-muted); color:var(--text-tertiary); }

.op-sum-signals { display:grid; grid-template-columns:repeat(3,1fr); gap:12px; margin:16px 24px 0; }
.op-sum-signal-cell { background:var(--bg-surface); border:1px solid var(--border-soft); border-radius:7px; padding:14px 16px; }
.op-sum-signal-cell.green { border-left:3px solid #28a745; }
.op-sum-signal-cell.amber { border-left:3px solid #ffc107; }
.op-sum-signal-cell.red { border-left:3px solid #dc3545; }
.op-sum-signal-label { font-size:11px; color:var(--text-tertiary); margin-bottom:4px; font-weight:500; }
.op-sum-signal-val { font-size:15px; font-weight:600; color:var(--text-primary); }

.op-sum-data-conf { font-size:12px; color:var(--text-tertiary); margin:12px 24px 0; }
.op-sum-dc-val { font-weight:600; color:var(--text-secondary); text-transform:capitalize; }

.op-sum-section-label { font-size:10px; font-weight:700; letter-spacing:0.8px; color:var(--text-tertiary); text-transform:uppercase; margin:20px 24px 10px; }
.op-sum-insight { background:var(--bg-surface); border:1px solid var(--border-soft); border-radius:7px; padding:14px 16px; margin:0 24px 10px; }
.op-sum-insight-text { font-size:13px; color:var(--text-primary); line-height:1.5; }
.op-sum-insight-action { font-size:12px; color:var(--accent); margin-top:6px; font-weight:500; }
.op-sum-insight-empty .op-sum-insight-text { color:var(--text-tertiary); font-style:italic; }

/* Rail coming-soon module items */
.rail-cs-title { opacity:0.6; }
.rail-link-cs { opacity:0.45; cursor:default; pointer-events:none; }

/* View toggle in topbar */
.op-viewtoggle { display:flex; gap:2px; background:var(--bg-muted); border-radius:6px; padding:2px; }
.op-viewtoggle button { font-size:11px; padding:4px 10px; border-radius:5px; border:none; background:transparent; color:var(--text-secondary); cursor:pointer; }
.op-viewtoggle button.active { background:var(--bg-surface); color:var(--text-primary); box-shadow:0 0 0 0.5px var(--border-soft); }

/* Story-card · shared v2 scoreboard primitive (spec §3 law 7).
   Ported from prototype .lp-story*, re-tokenised. Tone carries the verdict;
   below the sample floor tone is suppressed and the card greys (law 5). */
.op-storycard { background:var(--bg-surface); border:1px solid var(--border-soft); border-left:3px solid var(--border-strong); border-radius:var(--radius); padding:11px 13px; display:flex; flex-direction:column; gap:6px; }
.op-storycard-positive { border-left-color:var(--status-live); }
.op-storycard-warning  { border-left-color:var(--nimble-orange); }
.op-storycard-negative { border-left-color:var(--status-gap); }

.op-storycard-eyebrow { font-size:var(--fs-eyebrow); font-weight:600; letter-spacing:0.15em; text-transform:uppercase; color:var(--text-tertiary); }
.op-storycard-grid { display:flex; flex-direction:column; gap:6px; }
.op-storycard-hero { display:flex; flex-direction:column; gap:3px; }
/* §2b.2: hero colour is ink by default; state colour lives on the delta pill.
   .op-storycard-heroverdict is the named exception (hero VALUE is the verdict
   word itself, e.g. fatigue bands) · only those keep the tone colour here. */
.op-storycard-num { font-size:var(--fs-hero); font-weight:700; color:var(--text-primary); line-height:1.05; font-variant-numeric:tabular-nums; letter-spacing:-0.02em; }
.op-storycard-positive .op-storycard-heroverdict { color:var(--status-live); }
.op-storycard-warning  .op-storycard-heroverdict { color:var(--nimble-orange); }
.op-storycard-negative .op-storycard-heroverdict { color:var(--status-gap); }
.op-storycard-num-label { font-size:var(--fs-eyebrow); color:var(--text-tertiary); font-weight:500; text-transform:uppercase; letter-spacing:0.05em; line-height:1.35; }

.op-storycard-delta { display:inline-flex; align-items:center; gap:4px; width:fit-content; margin-top:6px; padding:2px 6px; border-radius:4px; font-size:10.5px; font-weight:600; font-variant-numeric:tabular-nums; }
.op-storycard-delta-arrow { font-size:12px; line-height:1; font-weight:700; }
.op-storycard-delta-text { font-size:10px; font-weight:500; }
.op-storycard-delta-up   { background:var(--status-live-bg); color:var(--status-live); border:1px solid var(--status-live); }
.op-storycard-delta-down { background:var(--bg-muted); color:var(--nimble-orange); border:1px solid var(--nimble-orange); }
.op-storycard-delta-flat { background:var(--bg-muted); color:var(--text-tertiary); border:1px solid var(--border-soft); }

.op-storycard-support { display:flex; flex-direction:column; gap:3px; padding-top:6px; border-top:1px solid var(--border-soft); }
.op-storycard-row { display:flex; justify-content:space-between; align-items:baseline; gap:10px; font-size:12px; line-height:1.35; overflow:hidden; }
.op-storycard-row-stacked { flex-direction:column; align-items:flex-start; gap:1px; }
/* OPS-243 C: labels must not wrap inside constrained tiles */
.op-storycard-row-k { color:var(--text-secondary); font-weight:400; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; flex-shrink:1; min-width:0; }
/* OPS-243 C: values nowrap for numbers; muted (footnote) rows allowed to wrap */
.op-storycard-row-v { color:var(--accent); font-weight:500; font-variant-numeric:tabular-nums; font-size:13px; white-space:nowrap; letter-spacing:-0.01em; flex-shrink:0; }
.op-storycard-row-muted .op-storycard-row-v, .op-pm-scoreboard .op-storycard-row-stacked .op-storycard-row-v { white-space:normal; word-break:break-word; }
.op-storycard-row-muted, .op-storycard-row-muted.op-storycard-row-v { color:var(--text-tertiary); font-weight:400; }
.op-storycard-row-negative .op-storycard-row-v { color:var(--status-gap); font-weight:600; }
.op-storycard-row-warning  .op-storycard-row-v { color:var(--nimble-orange); font-weight:600; }
.op-storycard-row-positive .op-storycard-row-v { color:var(--status-live); font-weight:600; }
.op-storycard-row-grouped .op-storycard-row-k { color:var(--text-primary); font-weight:600; font-size:13px; }
.op-storycard-row-grouped .op-storycard-row-v { color:var(--text-secondary); font-weight:400; font-size:12.5px; }

.op-storycard-floor { font-size:var(--fs-eyebrow); font-weight:600; color:var(--text-tertiary); letter-spacing:0.02em; }
.op-storycard-foot { font-size:var(--fs-eyebrow); color:var(--text-tertiary); font-style:italic; line-height:1.45; margin-top:2px; }
.op-storycard-low { opacity:0.62; }
.op-storycard-low .op-storycard-num { color:var(--text-tertiary); }

/* §2b.2 rule 5: verb-first action line, watch/act state only. */
.op-storycard-action { font-size:var(--fs-support); font-weight:600; color:var(--nimble-orange); line-height:1.4; margin-top:2px; }

/* §2b's "one screen = one question" header (NIMBLE_STORYCARD.renderHeader),
   sits above a module's tile strip. */
.op-page-answer { display:flex; flex-wrap:wrap; align-items:baseline; gap:8px; font-size:var(--fs-answer); font-weight:600; color:var(--text-primary); margin:4px 0 20px; line-height:1.35; }
.op-page-answer-q { color:var(--text-secondary); font-weight:500; }
.op-page-answer-a { color:var(--text-primary); }

/* §2b.5: "Show all N" table-cap toggle. */
.op-storycard-showall { align-self:flex-start; margin-top:8px; padding:6px 12px; border-radius:var(--radius); border:1px solid var(--border-soft); background:var(--bg-surface); color:var(--accent); font-size:var(--fs-support); font-weight:600; cursor:pointer; }
.op-storycard-showall:hover { background:var(--bg-muted); }

/* Compression pass §5.1: shared disclosure primitive (NIMBLE_STORYCARD.disclose).
   Consistent with the existing ad-hoc <details> sites (.op-pm-demo-disclose,
   .op-pm-fatigue-agg-block): border-top rule + uppercase muted summary label,
   no browser marker. */
.op-disclose { margin:14px 0 6px; border-top:1px solid var(--border-soft); padding-top:10px; }
.op-disclose-summary { font-size:11px; font-weight:600; letter-spacing:0.05em; text-transform:uppercase; color:var(--text-tertiary); cursor:pointer; list-style:none; }
.op-disclose-summary::-webkit-details-marker { display:none; }
.op-disclose-body { margin-top:8px; }

/* Slice 3: product-CPL unlabelled-spend note (operational-pm-scoreboard.js).
   Muted below the 20% threshold, promoted to a visible line above it (the
   hard rule: an unclassified quarter-or-more of spend suppresses the verdict,
   never hides quietly). */
.op-pm-unlabelled-muted { font-size:var(--fs-support); color:var(--text-tertiary); margin:10px 2px 0; }
.op-pm-unlabelled-prominent { font-size:var(--fs-support); font-weight:600; color:var(--nimble-orange); margin:10px 2px 0; }

/* Slice 3: native Timeline sub-tab (operational-pm-timeline.js). */
.op-pm-plan-context { font-size:var(--fs-support); color:var(--text-tertiary); margin-top:14px; }

.op-pm-pva { border:1px solid var(--border-soft); border-radius:var(--radius); padding:16px 20px; }
.op-pm-pva-title { font-size:var(--fs-eyebrow); font-weight:600; letter-spacing:0.1em; text-transform:uppercase; color:var(--text-tertiary); margin-bottom:12px; }
.op-pm-pva-chart { display:block; width:100%; height:auto; max-height:140px; }
.op-pm-pva-chart-line { fill:none; stroke:var(--accent); stroke-width:2; }
.op-pm-pva-chart-marker { stroke:var(--nimble-orange); stroke-width:1; stroke-dasharray:3,2; }
.op-pm-pva-markers { margin-top:14px; display:flex; flex-direction:column; gap:8px; }
.op-pm-pva-marker-row { display:flex; flex-wrap:wrap; justify-content:space-between; gap:8px; font-size:var(--fs-support); border-top:1px solid var(--border-soft); padding-top:8px; }
.op-pm-pva-marker-what { color:var(--text-primary); font-weight:500; }
.op-pm-pva-marker-delta { color:var(--text-secondary); font-variant-numeric:tabular-nums; white-space:nowrap; }

/* Slice 4c: Monthly sub-tab (operational-pm-monthly.js). */
.op-pm-monthly-head { margin-bottom:10px; }
.op-pm-monthly-title { font-size:14px; font-weight:600; }
.op-pm-monthly-window { font-size:var(--fs-support); color:var(--text-tertiary); margin:0 0 20px; }
.op-pm-monthly-chart-wrap { border:1px solid var(--border-soft); border-radius:var(--radius); padding:16px 20px; margin-bottom:12px; }
.op-pm-monthly-chart-title { font-size:var(--fs-eyebrow); font-weight:600; letter-spacing:0.1em; text-transform:uppercase; color:var(--text-tertiary); margin-bottom:12px; }
.op-pm-monthly-chart { display:block; width:100%; height:auto; max-height:180px; }
.op-pm-monthly-axis-label { font-size:9px; fill:var(--text-tertiary); text-anchor:middle; }
.op-pm-monthly-seg-mql         { fill:var(--nimble-teal); }
.op-pm-monthly-seg-oosa        { fill:var(--nimble-orange); }
.op-pm-monthly-seg-unqualified { fill:var(--text-tertiary); opacity:0.5; }
.op-pm-monthly-seg-meta        { fill:var(--channel-meta); }
.op-pm-monthly-seg-google      { fill:var(--channel-google); }
.op-pm-monthly-seg-seo         { fill:var(--channel-seo); }
.op-pm-monthly-seg-other       { fill:var(--text-tertiary); opacity:0.5; }
.op-pm-monthly-legend { display:flex; flex-wrap:wrap; gap:14px; margin:0 0 20px; }
.op-pm-monthly-legend-item { display:flex; align-items:center; gap:6px; font-size:var(--fs-support); color:var(--text-secondary); }
.op-pm-monthly-legend-swatch { width:10px; height:10px; border-radius:2px; display:inline-block; }
.op-pm-monthly-legend-mql         { background:var(--nimble-teal); }
.op-pm-monthly-legend-oosa        { background:var(--nimble-orange); }
.op-pm-monthly-legend-unqualified { background:var(--text-tertiary); opacity:0.5; }
.op-pm-monthly-legend-meta        { background:var(--channel-meta); }
.op-pm-monthly-legend-google      { background:var(--channel-google); }
.op-pm-monthly-legend-seo         { background:var(--channel-seo); }
.op-pm-monthly-legend-other       { background:var(--text-tertiary); opacity:0.5; }
.op-pm-monthly-note { font-size:var(--fs-support); color:var(--text-tertiary); margin:0 0 20px; }
.op-pm-monthly-table-wrap { overflow-x:auto; }
.op-pm-monthly-table { width:100%; border-collapse:collapse; font-size:var(--fs-support); }
.op-pm-monthly-table th { text-align:right; font-weight:600; color:var(--text-tertiary); font-size:var(--fs-eyebrow); letter-spacing:0.05em; text-transform:uppercase; padding:6px 10px; border-bottom:1px solid var(--border-soft); }
.op-pm-monthly-table th:first-child, .op-pm-monthly-table-month { text-align:left; }
.op-pm-monthly-table td { padding:6px 10px; border-bottom:0.5px solid var(--border-soft); }
.op-pm-monthly-table-num { text-align:right; font-variant-numeric:tabular-nums; }
.op-pm-pva-marker-delta-muted { color:var(--text-tertiary); font-style:italic; }

/* Overview daily/monthly pulse (Slice R1, LP only) */
.op-ov-pulse-section { margin-bottom:24px; }
.op-ov-pulse-grid { display:grid; grid-template-columns:repeat(2, minmax(0, 1fr)); gap:12px; margin-top:10px; max-width:860px; }
.op-ov-pulse-bar-wrap { width:100%; height:6px; border-radius:999px; background:var(--bg-muted); margin:10px 0 2px; overflow:hidden; }
.op-ov-pulse-bar { height:100%; border-radius:999px; background:var(--channel-lp-navy); }
.op-ov-pulse-bar-positive { background:var(--status-live); }
.op-ov-pulse-bar-warning  { background:var(--nimble-orange); }
.op-ov-pulse-daily { margin-top:10px; padding:10px 14px; border:1px solid var(--border-soft); border-radius:var(--radius); background:var(--bg-surface); max-width:860px; }
.op-ov-pulse-daily-text { font-size:13.5px; font-weight:600; color:var(--text-primary); }
.op-ov-pulse-anomaly { font-size:var(--fs-support); font-weight:600; margin-top:6px; }
.op-ov-pulse-anomaly-up   { color:var(--status-live); }
.op-ov-pulse-anomaly-down { color:var(--nimble-orange); }
.op-ov-pulse-daily-note { font-size:var(--fs-support); color:var(--text-tertiary); margin-top:6px; }
@media (max-width:768px) { .op-ov-pulse-grid { grid-template-columns:1fr; } }

/* OPS-308: per-channel verdict tiles are clickable story-cards */
.op-ov-verdict-link { display:block; text-decoration:none; color:inherit; }
.op-ov-verdict-link:hover .op-storycard { border-color:var(--channel-lp-navy); }

/* ── Fable design pass (2026-07-12) ─────────────────────────────────────── */

/* Freeze / change-window banner (Paid Media, plan-scoped) */
.op-pm-freeze-banner { background:#fdf6ec; border:1px solid #e8d5b5; border-left:3px solid #c98f2d; border-radius:var(--radius); padding:10px 16px; margin-bottom:16px; font-size:13px; color:#7a5c1e; }

/* OOSA demoted flag (fires only when rising on pace) */
.op-pm-oosa-flag { font-size:13px; color:#8a5a2e; background:#fdf6ec; border-radius:var(--radius); padding:8px 14px; margin-top:12px; }

/* Monthly: side-by-side product charts, value labels, target line */
.op-pm-monthly-product-row { display:grid; grid-template-columns:1fr 1fr; gap:12px; }
@media (max-width: 900px) { .op-pm-monthly-product-row { grid-template-columns:1fr; } }
.op-pm-monthly-value-label { font-size:11px; font-weight:700; fill:var(--ink); text-anchor:middle; font-variant-numeric:tabular-nums; }
/* Walkthrough-5 §B: per-segment label inside each bar (carport n / patio n) */
.op-pm-monthly-seg-label { font-size:9px; font-weight:700; fill:#fff; text-anchor:middle; font-variant-numeric:tabular-nums; pointer-events:none; }
.op-pm-monthly-target-line { stroke:var(--nimble-orange); stroke-width:3; stroke-dasharray:7 4; opacity:1; }

/* Per-LP detail (revived v1 audit-LP template) */
.op-lpd-head { margin-bottom:20px; }
.op-lpd-back { display:inline-block; font-size:12px; font-weight:600; color:var(--accent); text-decoration:none; margin-bottom:10px; cursor:pointer; }
.op-lpd-back:hover { text-decoration:underline; }
.op-lpd-title { font-size:20px; font-weight:700; margin:0 0 4px; }
.op-lpd-meta { font-size:12px; color:var(--muted-ink); }
.op-lpd-section { margin-top:24px; }
.op-lpd-chart-wrap { border:1px solid var(--border-soft); border-radius:var(--radius); padding:16px 20px; margin-top:10px; }
.op-lpd-chart { width:100%; height:auto; display:block; }
.op-lpd-bar { fill:var(--channel-meta); opacity:0.75; }
.op-lpd-bar-peak { opacity:1; }
.op-lpd-bar-label { font-size:11px; font-weight:700; fill:var(--ink); text-anchor:middle; font-variant-numeric:tabular-nums; }
.op-lpd-axis-label { font-size:10px; fill:var(--muted-ink); text-anchor:middle; }
.op-lpd-launch-line { stroke:#c98f2d; stroke-width:1.5; stroke-dasharray:3 3; }
.op-lpd-launch-label { font-size:10px; fill:#8a5a2e; }
.op-lpd-pending-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:12px; margin-top:24px; }
@media (max-width: 900px) { .op-lpd-pending-grid { grid-template-columns:1fr; } }
.op-lpd-pending { border:1px dashed var(--border-soft); border-radius:var(--radius); padding:14px 16px; }
.op-lpd-pending-title { font-size:11px; font-weight:700; letter-spacing:0.06em; text-transform:uppercase; color:var(--muted-ink); margin-bottom:6px; }
.op-lpd-pending-line { font-size:12px; color:var(--muted-ink); margin:0; line-height:1.5; }

/* Clickable LP rows */
.op-ws-lp-row-click { cursor:pointer; }
.op-ws-lp-row-click:hover { background:rgba(0,0,0,0.025); }

/* Insights SAMPLE honesty banner */
.op-ins-sample-banner { display:flex; align-items:center; gap:10px; font-size:13px; color:var(--muted-ink); background:#fdf6ec; border:1px solid #e8d5b5; border-radius:var(--radius); padding:10px 14px; margin:0 0 16px; }
.op-ins-sample-chip { font-size:10px; font-weight:800; letter-spacing:0.08em; color:#8a5a2e; border:1px solid #c98f2d; border-radius:999px; padding:2px 8px; flex-shrink:0; }

/* Timeline lane chips + marker lanes */
.op-pm-pva-lane-chips { display:flex; gap:6px; margin:10px 0 8px; }
.op-pm-pva-lane-chip { font-size:11px; font-weight:600; border:1px solid var(--border-soft); background:transparent; border-radius:999px; padding:3px 10px; cursor:pointer; color:var(--muted-ink); text-transform:capitalize; }
.op-pm-pva-lane-chip.active { background:var(--accent); color:#fff; border-color:var(--accent); }
.op-pm-pva-marker-lane { font-size:10px; font-weight:700; letter-spacing:0.05em; text-transform:uppercase; border-radius:999px; padding:1px 8px; margin-right:8px; flex-shrink:0; }
.op-pm-pva-lane-paid { background:rgba(74,144,217,0.14); color:#2a6099; }
.op-pm-pva-lane-seo { background:rgba(46,125,91,0.14); color:#2e7d5b; }
.op-pm-pva-lane-tracking { background:rgba(201,143,45,0.16); color:#8a5a2e; }
.op-pm-pva-lane-plan { background:rgba(0,68,71,0.10); color:var(--accent); }
.op-pm-monthly-target-label { font-size:10px; font-weight:600; fill:var(--ink); opacity:0.6; }

/* ── Fable design pass round 2 ──────────────────────────────────────────── */
/* Creative thumbnails: By Ad rows + story cards (fatigue/mirror) */
.op-pm-byad-c-thumb { width:44px; }
.op-pm-ad-thumb { width:40px; height:40px; object-fit:cover; border-radius:6px; display:block; }
.op-storycard-thumbrow { display:flex; align-items:center; gap:10px; margin-bottom:8px; }
.op-storycard-thumb { width:48px; height:48px; object-fit:cover; border-radius:6px; flex-shrink:0; }
.op-storycard-thumbrow .op-storycard-eyebrow { margin-bottom:0; }

/* LP row explicit drill affordance */
.op-ws-lp-view { color:var(--accent); font-weight:600; font-size:12px; white-space:nowrap; }

/* Monthly charts: legible at real widths */
.op-pm-monthly-axis-label { font-size:12px; }
.op-pm-monthly-value-label { font-size:13px; }
.op-pm-monthly-chart-title { font-size:12px; font-weight:700; letter-spacing:0.05em; text-transform:uppercase; color:var(--muted-ink); }
@media (max-width: 1250px) { .op-pm-monthly-product-row { grid-template-columns:1fr; } }

/* Product spend colours: LP's own palette (never Nimble teal) */
.op-pm-monthly-seg-patio { fill:#24466b; }
.op-pm-monthly-seg-carport { fill:#d9a441; }
.op-pm-monthly-seg-unlabelled { fill:#c8cfce; }
.op-pm-monthly-legend-patio { background:#24466b; }
.op-pm-monthly-legend-carport { background:#d9a441; }
.op-pm-monthly-legend-unlabelled { background:#c8cfce; }
.op-sales-monthly { margin-top:28px; }

/* ── Per-LP detail round 3: v1 density ─────────────────────────────────── */
.op-lpd-conv-dot { fill:#2e7d5b; opacity:0.85; }
.op-lpd-callout { background:#eef3f2; border-left:3px solid #8ca786; border-radius:var(--radius); padding:10px 16px; margin-top:14px; font-size:13.5px; }
.op-lpd-callout p { margin:0; }
.op-lpd-mid-grid { display:grid; grid-template-columns:1fr 1fr; gap:12px; margin-top:20px; }
@media (max-width: 1000px) { .op-lpd-mid-grid { grid-template-columns:1fr; } }
.op-lpd-week, .op-lpd-siblings { border:1px solid var(--border-soft); border-radius:var(--radius); padding:14px 16px; }
.op-lpd-week-rows { display:flex; flex-direction:column; gap:5px; margin-top:8px; }
.op-lpd-week-row { display:flex; align-items:center; gap:8px; }
.op-lpd-week-day { font-size:11px; font-weight:600; color:var(--muted-ink); width:32px; flex-shrink:0; }
.op-lpd-week-barwrap { flex:1; background:rgba(0,0,0,0.04); border-radius:3px; height:12px; }
.op-lpd-week-bar { background:var(--channel-meta); height:12px; border-radius:3px; min-width:2px; }
.op-lpd-week-val { font-size:11px; font-variant-numeric:tabular-nums; width:28px; text-align:right; color:var(--muted-ink); }
.op-lpd-sib-row { display:grid; grid-template-columns:2fr 1fr 1fr 1fr; gap:6px; padding:6px 0; border-bottom:1px solid var(--border-soft); font-size:12.5px; align-items:center; }
.op-lpd-sib-row:last-child { border-bottom:none; }
.op-lpd-sib-current { font-weight:700; }
.op-lpd-sib-name { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.op-lpd-sib-link { color:var(--accent); cursor:pointer; }
.op-lpd-sib-link:hover { text-decoration:underline; }
.op-lpd-sib-num { text-align:right; font-variant-numeric:tabular-nums; }
.op-lpd-pending-grid-2 { grid-template-columns:repeat(2,1fr); }

/* ── Fable final pass ───────────────────────────────────────────────────── */
/* Fatigue queue table */
.op-pm-fatigue-tablewrap { overflow-x:auto; border:1px solid var(--border-soft); border-radius:var(--radius); }
.op-pm-fatigue-table { width:100%; border-collapse:collapse; font-size:13px; }
.op-pm-fatigue-table th { text-align:left; font-size:10.5px; font-weight:700; letter-spacing:0.06em; text-transform:uppercase; color:var(--muted-ink); padding:10px 12px; border-bottom:1px solid var(--border-soft); }
.op-pm-fatigue-table td { padding:9px 12px; border-bottom:1px solid var(--border-soft); vertical-align:middle; }
.op-pm-fatigue-table tbody tr:last-child td { border-bottom:none; }
.op-pm-fatigue-row-act { background:rgba(179,64,42,0.045); }
.op-pm-fatigue-c-thumb { width:48px; }
.op-pm-fatigue-concept { font-weight:600; }
.op-pm-fatigue-fullname { font-size:10.5px; color:var(--muted-ink); max-width:340px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.op-pm-fatigue-c-num { text-align:right; font-variant-numeric:tabular-nums; white-space:nowrap; }
.op-pm-fatigue-bad { color:#b3402a; font-weight:700; }
.op-pm-fatigue-c-note { font-size:12px; color:var(--muted-ink); max-width:220px; }
.op-pm-fatigue-chip { font-size:10.5px; font-weight:700; letter-spacing:0.04em; border-radius:999px; padding:2px 10px; white-space:nowrap; }
.op-pm-fatigue-chip-healthy { background:rgba(46,125,91,0.12); color:#2e7d5b; }
.op-pm-fatigue-chip-early { background:rgba(201,143,45,0.16); color:#8a5a2e; }
.op-pm-fatigue-chip-active, .op-pm-fatigue-chip-crisis { background:rgba(179,64,42,0.12); color:#b3402a; }

/* OPS-282: last-known status chip (Fatigue inline, By Ad column) + as-of date,
   campaign/adset context, and the month summary/framing lines. */
.op-pm-status-chip { font-size:10px; font-weight:600; letter-spacing:0.02em; border-radius:999px; padding:2px 8px; white-space:nowrap; display:inline-block; }
.op-pm-status-chip-positive { background:rgba(44,107,44,0.12); color:#2c6b2c; }
.op-pm-status-chip-caution { background:rgba(133,79,11,0.14); color:#854f0b; }
.op-pm-status-chip-muted { background:var(--bg-muted); color:var(--text-tertiary,#888780); }
.op-pm-status-asof { font-size:10.5px; color:var(--text-tertiary,#888780); margin-top:2px; }
.op-pm-fatigue-namehead { display:flex; align-items:center; gap:8px; flex-wrap:wrap; }
.op-pm-fatigue-campaign-line { font-size:10.5px; color:var(--muted-ink); max-width:340px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.op-pm-fatigue-summary-line { font-size:12px; color:var(--text-secondary); margin-bottom:8px; }
.op-pm-byad-framing { font-size:11px; color:var(--text-tertiary); margin:2px 0 8px; }

/* Angle groups */
.op-pm-angle-group { border:1px solid var(--border-soft); border-radius:var(--radius); margin-top:8px; padding:0; }
.op-pm-angle-summary { display:flex; justify-content:space-between; gap:12px; padding:10px 14px; cursor:pointer; font-size:13px; list-style:none; }
.op-pm-angle-summary::-webkit-details-marker { display:none; }
.op-pm-angle-name { font-weight:600; }
.op-pm-angle-stats { color:var(--muted-ink); font-variant-numeric:tabular-nums; white-space:nowrap; }
.op-pm-angle-adrow { display:grid; grid-template-columns:44px minmax(120px,1fr) minmax(320px,1.7fr) 74px 74px 62px; gap:10px; align-items:center; padding:7px 14px; border-top:1px solid var(--border-soft); font-size:12.5px; }
.op-pm-angle-adname { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; color:var(--muted-ink); }
.op-pm-angle-adnum { text-align:right; font-variant-numeric:tabular-nums; }
/* recat editor sits inline in the row's middle column (OPS-267) */
.op-pm-angle-recatcell .op-pm-recat { padding:0; border:none; }
.op-pm-angle-recatcell .op-pm-recat-select { max-width:150px; }

/* demographics: age sparkline (replaces the number heatmap, OPS-267) */
.op-pm-demo-agecol { text-align:left; font-size:10.5px; color:var(--text-tertiary); }
.op-pm-demo-agecell { padding:6px 10px; }
.op-pm-demo-spark { display:inline-flex; align-items:flex-end; gap:5px; height:32px; vertical-align:middle; }
.op-pm-demo-sparkcol { display:flex; flex-direction:column; align-items:center; justify-content:flex-end; width:34px; height:100%; }
.op-pm-demo-sparkbar { width:100%; background:var(--nimble-teal); border-radius:3px 3px 0 0; min-height:2px; }
.op-pm-demo-sparklbl { font-size:8.5px; color:var(--text-tertiary); margin-top:2px; white-space:nowrap; }
.op-pm-demo-peak { font-size:10.5px; color:var(--muted-ink); display:inline-block; vertical-align:middle; margin:0 0 0 14px; white-space:nowrap; }

/* verdict layer (OPS-268) */
.op-pm-verdict-answer { margin:4px 0 14px; }
.op-pm-verdict-role { display:inline-block; font-size:10.5px; font-weight:700; letter-spacing:0.03em; padding:2px 9px; border-radius:10px; }
.op-pm-verdict-role-ok { background:var(--nimble-teal); color:#fff; }
.op-pm-verdict-role-info { background:color-mix(in srgb, var(--nimble-orange) 20%, transparent); color:var(--nimble-orange); }
.op-pm-verdict-role-alert { background:var(--nimble-orange); color:#fff; }
.op-pm-verdict-role-muted { background:var(--border-soft); color:var(--muted-ink); }
.op-pm-verdict-over { color:var(--nimble-orange); font-weight:600; }
.op-pm-verdict-band { color:var(--text-tertiary); font-size:11px; }
.op-pm-verdict-table td { padding:8px 10px; }
.op-pm-demo-disclose { margin:14px 0 6px; border-top:1px solid var(--border-soft); padding-top:10px; }
.op-pm-demo-disclose > summary { font-size:11px; font-weight:600; letter-spacing:0.05em; text-transform:uppercase; color:var(--text-tertiary); cursor:pointer; }

/* Timeline range head */
.op-pm-pva-head { display:flex; justify-content:space-between; align-items:center; gap:12px; }
.op-pm-pva-window { font-size:11px; color:var(--muted-ink); margin:6px 0 4px; }

/* ── Fable polish pass ──────────────────────────────────────────────────── */
.op-pm-monthly-chart { width:100%; height:auto; display:block; }
.op-pm-monthly-chart-wrap { padding:12px 14px; }
.op-pm-monthly-bandzone { fill:rgba(46,125,91,0.10); }
.op-pm-monthly-cplbar { fill:#7a94ad; }
.op-pm-monthly-cplbar-over { fill:#b3402a; opacity:0.85; }

/* §10.3 · Products view: MTD/in-progress-period distinct styling + period toggle. */
.op-pm-seg-provisional { opacity:0.5; stroke:var(--text-tertiary); stroke-width:1; stroke-dasharray:3 2; }
.op-pm-monthly-cplbar-provisional { opacity:0.5; stroke:var(--text-tertiary); stroke-width:1; stroke-dasharray:3 2; }
.op-pm-axis-provisional { font-weight:700; }
.op-pm-provisional-caption { font-size:11.5px; color:var(--text-tertiary); font-style:italic; margin:2px 0 10px; }
.op-pm-products-answer { font-size:13.5px; font-weight:600; color:var(--text-primary); margin:0 0 4px; }
.op-pm-products-answer-note { font-size:11.5px; color:var(--text-tertiary); margin:0 0 14px; }
.op-pm-period-toggle { display:flex; gap:6px; margin:0 0 14px; flex-wrap:wrap; }
.op-pm-period-btn { font-size:12.5px; font-weight:600; padding:5px 12px; border-radius:6px; border:0.5px solid var(--border-soft); background:transparent; color:var(--text-tertiary); cursor:pointer; }
.op-pm-period-btn:hover { color:var(--text-primary); }
.op-pm-period-btn.active { background:var(--brand-teal, #004447); border-color:var(--brand-teal, #004447); color:#fff; }
.op-pm-fatigue-agg-block { margin-top:10px; border:1px dashed var(--border-soft); border-radius:var(--radius); padding:8px 12px; }
.op-pm-fatigue-agg { cursor:pointer; font-size:12.5px; color:var(--muted-ink); list-style:none; }
.op-pm-fatigue-agg::-webkit-details-marker { display:none; }
.op-pm-fatigue-agg-list { display:grid; grid-template-columns:repeat(auto-fill,minmax(220px,1fr)); gap:4px 16px; padding:8px 4px 2px; }
.op-pm-fatigue-agg-item { font-size:12px; color:var(--muted-ink); overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.op-pm-thumb-ph { display:flex; align-items:center; justify-content:center; width:40px; height:40px; border-radius:6px; background:rgba(36,70,107,0.10); color:#24466b; font-weight:800; font-size:14px; }
.op-pm-fatigue-c-thumb { position:relative; }
.op-pm-thumb-over { position:absolute; top:9px; left:12px; }

/* ═══ Walkthrough-3 build (2026-07-12n) ══════════════════════════════════ */

/* §A1 · page-level tabs at the very top, prominent enough to be seen.
   Walkthrough-5: the base .op-pm-tabs is already a rectangular underline bar; this
   override just gives the top-level tabs a slightly larger hit target + font. */
.op-pm-tabs-top { margin:4px 0 20px; }
.op-pm-tabs-top .op-pm-tab { font-size:14px; padding:10px 18px 13px; }

/* §2b.5 · collapsed answer strip on non-Summary views (walkthrough-5 redesign).
   Two product rows (carport + patio) with CPL, band range, and a status chip.
   Old single-paragraph .op-pm-collapsed-answer kept for any callers that still use it. */
.op-pm-collapsed-answer { font-size:13px; color:var(--muted-ink); margin:0 0 14px; padding:8px 12px; background:var(--surface-soft, rgba(0,68,71,0.04)); border-radius:8px; }

/* §2 · slim context ribbon on the working tabs (replaces the tall answer block). */
.op-pm-ribbon { display:flex; align-items:center; flex-wrap:wrap; gap:6px 10px; max-height:40px; overflow:hidden; margin:0 0 16px; padding:9px 14px; font-size:13px; text-decoration:none; background:var(--surface-soft, rgba(0,68,71,0.04)); border:0.5px solid var(--border-soft); border-radius:8px; }
.op-pm-ribbon:hover { border-color:var(--brand-teal, #004447); }
.op-pm-ribbon-seg { color:var(--text-primary); font-weight:600; font-variant-numeric:tabular-nums; }
.op-pm-ribbon-sep { color:var(--text-tertiary); }
/* Compression pass §5.2: in-band/over-band/over-alarm as tint only, no words in the segment text. */
.op-pm-ribbon-seg-positive { color:var(--status-live); }
.op-pm-ribbon-seg-warning { color:var(--nimble-orange); }
.op-pm-ribbon-seg-negative { color:var(--status-gap); }

/* §2 · component-local sub-view toggle (Performance / Ads tabs). */
.op-pm-subtoggle { display:flex; gap:6px; margin:0 0 16px; flex-wrap:wrap; }
.op-pm-subtoggle-btn { font-size:13px; font-weight:600; padding:6px 14px; border-radius:6px; border:0.5px solid var(--border-soft); background:transparent; color:var(--text-tertiary); cursor:pointer; }
.op-pm-subtoggle-btn:hover { color:var(--text-primary); }
.op-pm-subtoggle-btn.active { background:var(--brand-teal, #004447); border-color:var(--brand-teal, #004447); color:#fff; }

/* §2 · Budget & mix sub-view (Performance tab). */
.op-pm-budget { margin:0 0 8px; }
.op-pm-budget-headline { font-size:14px; font-weight:700; color:var(--text-primary); margin-bottom:8px; }
.op-pm-budget-bar { height:10px; border-radius:5px; background:var(--surface-soft, rgba(0,68,71,0.08)); overflow:hidden; }
.op-pm-budget-bar-fill { height:100%; background:var(--brand-teal, #004447); }
.op-pm-budget-note { font-size:11.5px; color:var(--text-tertiary); margin:6px 0 0; }
.op-pm-budget-mix { margin-top:20px; }
.op-pm-budget-mix-title { font-size:13px; font-weight:700; color:var(--text-primary); margin-bottom:8px; }
.op-pm-budget-mix-bar { display:flex; height:14px; border-radius:4px; overflow:hidden; background:var(--surface-soft, rgba(0,68,71,0.08)); }
.op-pm-budget-mix-seg { height:100%; }
.op-pm-budget-mix-seg.op-pm-monthly-seg-patio { background:#24466b; }
.op-pm-budget-mix-seg.op-pm-monthly-seg-carport { background:#d9a441; }
.op-pm-budget-mix-legend { font-size:11.5px; color:var(--text-tertiary); margin:6px 0 0; }

/* §A3 · pulse tiles: §2b scale (walkthrough-5: three-tile top row) */
.op-ov-pulse-grid { max-width:880px; gap:16px; }
.op-ov-pulse-grid-3 { grid-template-columns:1fr 1fr 1fr; }
@media (max-width:780px) { .op-ov-pulse-grid-3 { grid-template-columns:1fr; } }
@media (max-width:960px) and (min-width:781px) { .op-ov-pulse-grid-3 { grid-template-columns:1fr 1fr; } }
.op-ov-pulse-section .op-storycard { padding:16px 18px; }
.op-ov-pulse-section .op-storycard-row { padding:4px 0; }
/* What's new section */
.op-ov-whats-new { margin:20px 0 0; max-width:880px; }
.op-ov-wn-eyebrow { font-size:10.5px; font-weight:700; letter-spacing:0.1em; text-transform:uppercase; color:var(--text-tertiary); margin:0 0 10px; }
/* Unqualified leads block */
.op-ov-unq-block { padding:10px 14px; background:var(--bg-muted); border-radius:8px; margin-bottom:10px; border-left:3px solid #d9822b; }
.op-ov-unq-eyebrow { font-size:10px; font-weight:700; letter-spacing:0.08em; text-transform:uppercase; color:#854f0b; margin-bottom:4px; }
.op-ov-unq-count { font-size:13px; color:var(--text-primary); margin:0; }
.op-ov-unq-row { display:flex; gap:8px; align-items:center; padding:3px 0; font-size:13px; }
.op-ov-unq-name { font-weight:600; color:var(--text-primary); }
.op-ov-unq-reason { color:var(--text-tertiary); font-size:12px; }
/* OOSA block */
.op-ov-oosa-block { padding:8px 14px; background:var(--bg-muted); border-radius:8px; margin-bottom:10px; }
.op-ov-oosa-spike { background:#faeeda; border-left:3px solid #d9822b; }
.op-ov-oosa-text { font-size:13px; color:var(--text-secondary); margin:0; line-height:1.5; }

/* OPS-258 · Risk fingerprint rebuilt to the appendix's 5-section layout.
   Reuses the --status-*/.op-pill-* tokens + .op-pm-exec/.op-pm-riskcard card
   anatomy already established for the OPS-248 decision layer, rather than the
   prior tone-specific red/amber/green rules (removed below). */
.op-rf-section { margin-top:20px; max-width:960px; }

.op-rf-header { margin-bottom:14px; }
.op-rf-question { font-size:11px; font-weight:700; letter-spacing:0.06em; text-transform:uppercase; color:var(--text-tertiary); margin:0 0 4px; }
.op-rf-answer { font-size:var(--fs-answer,17px); line-height:1.5; color:var(--text-primary); margin:0; max-width:820px; }

/* Section 2 · single wide verdict card */
.op-rf-card { padding:18px 20px; border-radius:var(--radius-lg,12px); border:1px solid var(--border-soft,rgba(0,0,0,.08)); border-left-width:4px; background:var(--bg-surface,#fff); box-shadow:0 1px 2px rgba(26,43,44,.05); margin-bottom:16px; }
.op-rf-card-on_track { border-left-color:var(--status-on-track); }
.op-rf-card-watch { border-left-color:var(--status-watch); }
.op-rf-card-act { border-left-color:var(--status-act); }
.op-rf-card-hold { border-left-color:var(--status-hold); }
.op-rf-card-data_limited { border-left-color:var(--status-data-limited); }
.op-rf-card-pillrow { display:flex; align-items:center; gap:10px; flex-wrap:wrap; margin-bottom:10px; }
.op-rf-card-underlying { font-size:12px; color:var(--text-tertiary); }
.op-rf-card-chips { display:flex; flex-wrap:wrap; gap:6px; margin-bottom:8px; }
.op-rf-chip { font-size:11.5px; font-weight:600; padding:3px 10px; border-radius:999px; border:1px solid; }
.op-rf-chip-act   { color:var(--status-act);   background:rgba(154,44,31,.07);  border-color:rgba(154,44,31,.25); }
.op-rf-chip-watch { color:var(--status-watch); background:rgba(168,114,10,.08); border-color:rgba(168,114,10,.25); }
.op-rf-card-quiet { font-size:13px; color:var(--text-tertiary); margin:4px 0 8px; }
.op-rf-card-note { font-size:12.5px; color:#7a5000; background:#fffaea; border-left:3px solid #d4920a; border-radius:0 4px 4px 0; padding:6px 10px; margin:0 0 8px; max-width:680px; line-height:1.5; }
.op-rf-card-meta { display:flex; gap:16px; flex-wrap:wrap; font-size:13px; color:var(--text-secondary); margin-bottom:8px; }
.op-rf-card-confidence { font-size:11.5px; color:var(--text-tertiary); margin:0; }
/* OPS-294: "See what to do" CTA -- routes the verdict to the Brief decision. */
.op-rf-card-cta { display:inline-block; margin-top:10px; font-size:12.5px; font-weight:600; color:var(--nimble-teal,#004447); text-decoration:none; }
.op-rf-card-cta:hover { text-decoration:underline; }

/* Section 3 · leading-signal stepper: horizontal on desktop, stacked below 760px */
.op-rf-stepper { display:flex; gap:14px; margin-bottom:16px; }
@media (max-width:760px) { .op-rf-stepper { flex-direction:column; } }
.op-rf-step { flex:1; min-width:0; padding:12px 14px; border:1px solid var(--border-soft,rgba(0,0,0,.08)); border-radius:var(--radius,8px); background:var(--bg-surface,#fff); }
.op-rf-step-badge { display:inline-block; font-size:9.5px; font-weight:800; letter-spacing:0.06em; text-transform:uppercase; padding:2px 8px; border-radius:999px; margin-bottom:6px; }
.op-rf-step-badge-clear     { color:var(--status-on-track);     background:rgba(30,107,58,.09); }
.op-rf-step-badge-early     { color:var(--status-watch);        background:rgba(168,114,10,.10); }
.op-rf-step-badge-fired     { color:var(--status-act);          background:rgba(154,44,31,.09); }
.op-rf-step-badge-responded { color:var(--status-hold);         background:rgba(20,96,107,.09); }
.op-rf-step-badge-limited   { color:var(--status-data-limited); background:rgba(74,85,96,.10); }
.op-rf-step-label { font-size:13.5px; font-weight:600; color:var(--text-primary); margin-bottom:4px; }
.op-rf-step-value { font-size:12px; color:var(--text-secondary); margin-bottom:2px; }
.op-rf-step-since { font-size:11.5px; color:var(--text-tertiary); margin-bottom:4px; }
.op-rf-step-meaning { font-size:12px; color:var(--text-secondary); line-height:1.4; }

/* Section 4 · context, visually subordinate */
.op-rf-context { opacity:0.7; margin-bottom:18px; }
.op-rf-context-title { font-size:11px; color:var(--text-tertiary); margin:0 0 6px; }
.op-rf-context-row { display:flex; gap:18px; flex-wrap:wrap; font-size:12.5px; color:var(--text-secondary); }
.op-rf-context-quiet { font-size:12px; color:var(--text-tertiary); margin:4px 0 0; font-style:italic; }

/* Section 5 · historical replay table */
.op-rf-replay { margin-bottom:16px; }
.op-rf-replay-title { font-size:12.5px; color:var(--text-tertiary); margin:0 0 8px; }
.op-rf-table { border-collapse:collapse; font-size:12.5px; font-variant-numeric:tabular-nums; width:100%; }
.op-rf-table th { text-align:right; font-size:10.5px; letter-spacing:0.04em; text-transform:uppercase; color:var(--text-tertiary); padding:4px 10px 4px 0; font-weight:600; }
.op-rf-table td { text-align:right; padding:3px 10px 3px 0; color:var(--text-primary); }
.op-rf-table .op-rf-c-month, .op-rf-table th:first-child { text-align:left; color:var(--muted-ink); }
.op-rf-table .op-rf-c-fired, .op-rf-table th:nth-last-child(2) { text-align:left; }
.op-rf-table .op-rf-c-activity, .op-rf-table th:last-child { text-align:left; color:var(--text-tertiary); }
.op-rf-row-mtd td { font-style:italic; color:var(--text-tertiary); }
.op-rf-replay-foot { font-size:11.5px; color:var(--text-tertiary); margin-top:8px; max-width:680px; }

/* Section 6 · why this matters (standing doctrine) */
.op-rf-doctrine { padding:12px 16px; background:var(--bg-muted,#f1efe8); border-radius:var(--radius,8px); border-left:3px solid var(--nimble-teal,#004447); max-width:820px; }
.op-rf-doctrine-title { font-size:11px; font-weight:700; letter-spacing:0.06em; text-transform:uppercase; color:var(--text-tertiary); margin:0 0 4px; }
.op-rf-doctrine-text { font-size:13px; line-height:1.55; color:var(--text-primary); margin:0; }

/* OPS-243 D: ad-level actions block under the fingerprint tile */
.op-pm-fingerprint-adlevel { margin-top:14px; padding:10px 14px; background:var(--bg-muted); border-radius:var(--radius); border-left:3px solid var(--border-strong); max-width:880px; }
.op-pm-fingerprint-adlevel-title { font-size:10px; font-weight:600; text-transform:uppercase; letter-spacing:0.12em; color:var(--text-tertiary); margin-bottom:6px; }
.op-pm-fingerprint-adlevel-row { font-size:13px; color:var(--text-primary); margin:3px 0; line-height:1.45; }
.op-pm-fingerprint-adlevel-empty { color:var(--text-tertiary); font-style:italic; }

/* OPS-290 item 2: Evidence layer secondary detail (Products/Budget/Geography),
   demoted below the now-primary risk-fingerprint sequence above. */
.op-evidence-secondary { margin-top:28px; padding-top:20px; border-top:1px solid var(--border-soft,rgba(0,0,0,.08)); }
.op-evidence-secondary-title { font-size:11px; font-weight:700; letter-spacing:0.06em; text-transform:uppercase; color:var(--text-tertiary); margin:0 0 10px; }

/* §D · single fatigue header eyebrow + durable thumbs */
.op-pm-view-eyebrow { font-size:11px; font-weight:600; letter-spacing:0.08em; text-transform:uppercase; color:var(--text-tertiary); margin:2px 0 6px; }
.op-pm-thumbwrap { position:relative; display:inline-block; width:40px; height:40px; }
.op-pm-thumbwrap .op-pm-thumb-over { top:0; left:0; }

/* §E · angle bar charts */
.op-pm-anglebar-grid { display:grid; grid-template-columns:repeat(auto-fit, minmax(280px, 1fr)); gap:20px; margin:14px 0 6px; }
.op-pm-anglebar-title { font-size:11px; font-weight:600; letter-spacing:0.06em; text-transform:uppercase; color:var(--text-tertiary); margin-bottom:8px; }
.op-pm-anglebar-row { display:grid; grid-template-columns:minmax(90px, 1.4fr) 2fr auto; gap:8px; align-items:center; padding:2.5px 0; }
.op-pm-anglebar-label { font-size:12px; color:var(--muted-ink); overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.op-pm-anglebar-track { display:block; height:12px; background:var(--border-soft); border-radius:6px; overflow:hidden; }
.op-pm-anglebar-bar { display:block; height:100%; background:var(--nimble-teal); border-radius:6px; }
.op-pm-anglebar-bar-cost { background:var(--nimble-orange); }
.op-pm-anglebar-val { font-size:12px; font-variant-numeric:tabular-nums; color:var(--text-primary); min-width:44px; text-align:right; }
.op-pm-anglebar-cat { font-size:10.5px; font-weight:700; letter-spacing:0.05em; text-transform:uppercase; color:var(--nimble-teal); margin:9px 0 3px; padding-bottom:2px; border-bottom:1px solid var(--border-soft); }
.op-pm-anglebar-cat:first-child { margin-top:0; }
.op-pm-angle-attrnote { font-size:11px; color:var(--text-tertiary); margin:2px 0 4px; line-height:1.45; }
.op-pm-angle-prodchips { margin:2px 0 10px; }

/* Angle governance (OPS-262): inline classification editor per ad row */
.op-pm-recat { padding:6px 0 12px 14px; }
.op-pm-recat-body { display:flex; flex-wrap:wrap; align-items:center; gap:6px; }
.op-pm-recat-loading, .op-pm-recat-tbc { font-size:11.5px; color:var(--text-tertiary); }
.op-pm-recat-selects { display:flex; gap:6px; }
.op-pm-recat-select { font-size:12px; padding:4px 7px; border:1px solid var(--border-soft); border-radius:7px; background:var(--surface, #fff); color:var(--text-primary); max-width:190px; }
.op-pm-recat-tags { display:flex; flex-wrap:wrap; align-items:center; gap:5px; }
.op-pm-recat-tag { font-size:11px; padding:2px 8px; border:1px solid var(--nimble-teal); border-radius:11px; background:var(--nimble-teal); color:#fff; cursor:pointer; }
.op-pm-recat-addtag { font-size:11px; padding:3px 6px; border:1px dashed var(--border-soft); border-radius:11px; background:transparent; color:var(--muted-ink); cursor:pointer; }
.op-pm-recat-status { font-size:11px; min-width:52px; color:var(--text-tertiary); }
.op-pm-recat-status.ok { color:var(--nimble-teal); }
.op-pm-recat-status.err { color:var(--nimble-orange); }

/* Build #4: demographics by angle */
.op-pm-demo-table td, .op-pm-demo-table th { vertical-align:middle; }
/* demographics-by-angle: hug content + left-align so the table doesn't spread
   thin across the full width (the "so much white" fix). Row height is cut by
   the inline peak label above; wrapper shrinks to the table on wide screens
   but still scrolls on narrow ones. */
.op-pm-demo-scroll { display:inline-block; max-width:100%; }
.op-pm-demo-table { width:auto; }
.op-pm-demo-table th, .op-pm-demo-table td { text-align:left; }
.op-pm-demo-agecell { padding:8px 12px; }
.op-pm-demo-c { font-size:12px; color:var(--text-primary); padding:6px 10px; font-variant-numeric:tabular-nums; }
.op-pm-demo-genbar { display:flex; height:8px; width:120px; border-radius:5px; overflow:hidden; background:var(--border-soft); }
.op-pm-demo-seg { display:block; height:100%; }
.op-pm-demo-seg-m { background:var(--nimble-teal); }
.op-pm-demo-seg-f { background:var(--nimble-orange); }
.op-pm-demo-seg-u { background:var(--border-soft); }
.op-pm-demo-genlbl { font-size:11px; color:var(--muted-ink); margin-top:3px; }
/* demographics upgrade: overall panel + heatmap + skew */
.op-pm-demo-sublbl { font-size:10.5px; font-weight:700; letter-spacing:0.05em; text-transform:uppercase; color:var(--text-tertiary); margin:14px 0 6px; }
.op-pm-demo-overall { display:grid; grid-template-columns:repeat(auto-fit,minmax(180px,1fr)); gap:12px; margin-bottom:6px; }
.op-pm-demo-ovcard { border:1px solid var(--border-soft); border-radius:10px; padding:11px 13px; background:var(--surface,#fff); }
.op-pm-demo-ovlbl { font-size:11px; font-weight:700; letter-spacing:0.04em; text-transform:uppercase; color:var(--nimble-teal); }
.op-pm-demo-ovreach { font-size:12px; color:var(--muted-ink); margin:2px 0 6px; font-variant-numeric:tabular-nums; }
.op-pm-demo-ovcard .op-pm-demo-genbar { width:100%; }
.op-pm-demo-ovage { font-size:11.5px; color:var(--text-primary); margin-top:5px; }
.op-pm-demo-skew { display:inline-block; font-size:11px; font-weight:600; padding:1px 7px; margin:0 4px 3px 0; border-radius:9px; background:var(--border-soft); color:var(--muted-ink); }
.op-pm-demo-skew.male, .op-pm-demo-skew.older { background:color-mix(in srgb, var(--nimble-teal) 16%, transparent); color:var(--nimble-teal); }
.op-pm-demo-skew.female, .op-pm-demo-skew.younger { background:color-mix(in srgb, var(--nimble-orange) 16%, transparent); color:var(--nimble-orange); }
.op-pm-demo-heatcol { font-size:10.5px; color:var(--text-tertiary); text-align:center; padding:4px 2px; }
.op-pm-demo-heat { text-align:center; padding:0; height:30px; min-width:46px; border:1px solid var(--surface,#fff); }
.op-pm-demo-heatpct { font-size:10.5px; color:var(--text-primary); font-variant-numeric:tabular-nums; }
.op-pm-demo-heatpct.on { color:#fff; }

/* Living Plan Slice 1 (OPS-265): Current Plan view */
.op-pm-plan-section { margin-bottom:20px; }
.op-pm-plan-q { font-size:12px; letter-spacing:0.04em; text-transform:uppercase; color:var(--text-tertiary); font-weight:600; }
.op-pm-plan-answer { font-size:15px; color:var(--text-primary); margin:4px 0 14px; line-height:1.45; max-width:760px; }
.op-pm-plan-cards { display:grid; grid-template-columns:repeat(auto-fit,minmax(190px,1fr)); gap:12px; margin-bottom:16px; }
.op-pm-plan-card { border:1px solid var(--border-soft); border-radius:10px; padding:12px 14px; background:var(--surface,#fff); }
.op-pm-plan-card-alert { border-color:var(--nimble-orange); background:color-mix(in srgb, var(--nimble-orange) 6%, var(--surface,#fff)); }
.op-pm-plan-card-lbl { font-size:10.5px; letter-spacing:0.05em; text-transform:uppercase; color:var(--text-tertiary); font-weight:600; }
.op-pm-plan-card-val { font-size:15px; font-weight:600; color:var(--text-primary); margin-top:4px; line-height:1.3; }
.op-pm-plan-card-sub { font-size:11.5px; color:var(--muted-ink); margin-top:3px; }
.op-pm-plan-card-alert .op-pm-plan-card-sub { color:var(--nimble-orange); font-weight:600; }
.op-pm-plan-stepper { display:flex; flex-wrap:wrap; gap:6px; margin-bottom:18px; }
.op-pm-plan-step { font-size:11px; padding:4px 10px; border-radius:13px; border:1px solid var(--border-soft); color:var(--text-tertiary); background:transparent; }
.op-pm-plan-step.done { color:var(--nimble-teal); border-color:var(--nimble-teal); }
.op-pm-plan-step.active { background:var(--nimble-teal); border-color:var(--nimble-teal); color:#fff; font-weight:600; }
/* A1 polish: guardrails collapse behind a disclosure so the top of Activity
   leads with the next move; the summary turns into an alarm when breached. */
.op-pm-plan-guards-det { margin:6px 0 16px; }
.op-pm-plan-guards-summary { font-size:11px; text-transform:uppercase; letter-spacing:0.8px; color:var(--text-tertiary); font-weight:600; cursor:pointer; padding:4px 0; list-style:revert; }
.op-pm-plan-guards-summary.breached { color:var(--nimble-orange); }
.op-pm-plan-guards-det[open] .op-pm-plan-guards-summary { margin-bottom:6px; }
.op-pm-plan-datenote { font-size:11.5px; color:var(--text-tertiary); margin:0 0 8px; font-style:italic; }
.op-pm-plan-guards { list-style:none; padding:0; margin:6px 0 16px; }
.op-pm-plan-guard { font-size:12.5px; color:var(--text-primary); padding:5px 0 5px 16px; position:relative; border-bottom:1px solid var(--border-soft); }
.op-pm-plan-guard::before { content:"·"; position:absolute; left:4px; color:var(--nimble-teal); }
.op-pm-plan-guard.breached { color:var(--nimble-orange); font-weight:600; }
.op-pm-plan-feed { margin:6px 0 16px; }
.op-pm-plan-act { padding:9px 0; border-bottom:1px solid var(--border-soft); }
.op-pm-plan-act-head { display:flex; flex-wrap:wrap; align-items:center; gap:8px; }
.op-pm-plan-act-date { font-size:11.5px; color:var(--text-tertiary); font-variant-numeric:tabular-nums; min-width:52px; }
.op-pm-plan-act-title { font-size:13px; color:var(--text-primary); font-weight:600; }
.op-pm-plan-badge { font-size:10px; font-weight:700; letter-spacing:0.04em; text-transform:uppercase; padding:1px 7px; border-radius:9px; background:var(--border-soft); color:var(--muted-ink); }
.op-pm-plan-badge.alert { background:var(--nimble-orange); color:#fff; }
.op-pm-plan-act-body { font-size:12px; color:var(--muted-ink); margin:4px 0 0 60px; line-height:1.45; }
.op-pm-plan-act-field { font-size:12px; color:var(--muted-ink); margin:4px 0 0 60px; line-height:1.45; }
.op-pm-plan-act-field b { color:var(--text-secondary); font-weight:600; }
.op-pm-plan-act-outcome { color:var(--nimble-teal); }
.op-pm-plan-act-review { font-size:11.5px; color:var(--nimble-teal); margin:3px 0 0 60px; }
.op-pm-plan-why { margin-top:6px; font-size:12.5px; }
.op-pm-plan-why > summary { color:var(--text-tertiary); cursor:pointer; }
.op-pm-plan-why p { font-size:12.5px; color:var(--muted-ink); margin:6px 0 0; max-width:760px; line-height:1.5; }

/* OPS-290 item 4 (Activity layer): freeze status bar, what's-next, and change-timeline severity */
.op-pm-freeze { border:1px solid var(--border-soft); border-radius:var(--radius); padding:12px 14px; margin:4px 0 18px; background:var(--surface,#fff); }
.op-pm-freeze-title { font-size:13px; font-weight:600; color:var(--text-primary); margin-bottom:8px; }
.op-pm-freeze-bar { height:10px; border-radius:6px; background:var(--border-soft); position:relative; overflow:hidden; }
.op-pm-freeze-bar-fill { position:absolute; top:0; bottom:0; left:0; background:var(--nimble-teal); opacity:.55; }
.op-pm-freeze-bar-today { position:absolute; top:-3px; width:2px; height:16px; background:var(--nimble-orange); transform:translateX(-1px); }
.op-pm-freeze-meta { display:flex; justify-content:space-between; font-size:11px; color:var(--muted-ink); margin-top:6px; }

.op-pm-whatsnext { margin:6px 0 16px; }
.op-pm-whatsnext-row { display:flex; gap:10px; font-size:12.5px; padding:5px 0; border-bottom:1px solid var(--border-soft); }
.op-pm-whatsnext-row:last-child { border-bottom:none; }
.op-pm-whatsnext-date { color:var(--text-tertiary); font-variant-numeric:tabular-nums; min-width:60px; flex-shrink:0; }
.op-pm-whatsnext-label { color:var(--text-primary); }

.op-pm-plan-act-preview-warn { color:var(--nimble-orange); font-weight:600; }
.op-pm-plan-act-preview-crit { color:var(--status-act); font-weight:600; }
.op-pm-plan-act-row-warn > summary { border-left:3px solid var(--nimble-orange); padding-left:8px; margin-left:-8px; }
.op-pm-plan-act-row-crit > summary { border-left:3px solid var(--status-act); padding-left:8px; margin-left:-8px; }

/* §F · website pages: nav groups, sort bar, form fills, SEO chips */
.op-ws-sortbar { display:flex; align-items:center; gap:8px; margin:6px 0 10px; }
.op-ws-sortbar-label { font-size:11px; letter-spacing:0.05em; text-transform:uppercase; color:var(--text-tertiary); font-weight:600; }
.op-ws-page-group { margin-bottom:10px; border:1px solid var(--border-soft); border-radius:10px; background:var(--surface, #fff); overflow:hidden; }
.op-ws-page-group-head { display:flex; justify-content:space-between; align-items:center; gap:12px; padding:10px 14px; cursor:pointer; list-style:none; }
.op-ws-page-group-head::-webkit-details-marker { display:none; }
.op-ws-page-group-name { font-size:13.5px; font-weight:600; color:var(--text-primary); }
.op-ws-page-group-stats { font-size:12px; color:var(--muted-ink); font-variant-numeric:tabular-nums; }
.op-ws-lp-row-pages { grid-template-columns:3fr 1fr 1.2fr 1fr 1fr; }
.op-ws-lp-conv { font-weight:600; color:var(--nimble-teal); }
.op-ws-seo-chip { display:inline-block; margin-left:8px; padding:1px 7px; font-size:10px; font-weight:600; letter-spacing:0.04em; border:1px solid var(--nimble-orange); color:var(--nimble-orange); border-radius:9px; vertical-align:1px; }
.op-ws-seo-log { margin:0 0 10px; font-size:12.5px; }
.op-ws-seo-log > summary { color:var(--text-tertiary); cursor:pointer; }
.op-ws-seo-log-item { padding:3px 0 0 14px; color:var(--muted-ink); }

/* §F · search rebuild */
.op-ws-search-qgrid { display:grid; grid-template-columns:repeat(auto-fit, minmax(300px, 1fr)); gap:16px; max-width:880px; margin-bottom:18px; }
.op-ws-push-row { display:grid; grid-template-columns:1.4fr 2fr auto; gap:12px; align-items:center; padding:8px 12px; border:1px solid var(--border-soft); border-radius:8px; margin-bottom:6px; background:var(--surface, #fff); }
.op-ws-push-query { font-size:13.5px; font-weight:600; color:var(--text-primary); }
.op-ws-push-stats { font-size:12px; color:var(--muted-ink); font-variant-numeric:tabular-nums; }
.op-ws-push-verb { font-size:12px; color:var(--nimble-orange); font-weight:600; }
.op-ws-query-detail { margin:10px 0; font-size:12.5px; }
.op-ws-query-detail > summary { color:var(--text-tertiary); cursor:pointer; margin-bottom:6px; }

/* §F · behaviour bot trend */
.op-ws-beh-bot-trend { font-size:12px; color:var(--muted-ink); margin:8px 0 2px; font-variant-numeric:tabular-nums; }

/* §G · old-vs-new generation strip */
.op-ws-gen-strip { display:grid; grid-template-columns:repeat(auto-fit, minmax(300px, 1fr)); gap:16px; max-width:880px; }
.op-ws-gen-card { border:1px solid var(--border-soft); border-radius:10px; padding:14px 16px; background:var(--surface, #fff); }
.op-ws-gen-title { font-size:13.5px; font-weight:700; color:var(--text-primary); margin-bottom:8px; }
.op-ws-gen-row { display:flex; justify-content:space-between; gap:10px; font-size:12.5px; padding:3px 0; }
.op-ws-gen-k { color:var(--text-tertiary); }
.op-ws-gen-v { color:var(--text-primary); font-variant-numeric:tabular-nums; text-align:right; }
.op-ws-gen-row-new .op-ws-gen-v { font-weight:600; }
.op-ws-gen-verdict { font-size:12px; margin-top:6px; font-weight:600; }
.op-ws-gen-good { color:var(--status-live); }
.op-ws-gen-watch { color:var(--nimble-orange); }
.op-ws-gen-note { font-size:11px; color:var(--text-tertiary); margin-top:6px; }

/* Design lockdown (walkthrough-4): The Math tile matches the pulse grid width;
   page-answer line tightened so the header block stops dominating the fold. */
.op-ov-pulse-section > .op-storycard { max-width:860px; }
.op-page-answer { margin-bottom:14px; }
.op-page-answer-a { line-height:1.35; }
.op-pm-pva-alarm-line { stroke:var(--nimble-orange); stroke-width:1.5; stroke-dasharray:5 4; }
.op-pm-fatigue-watchnum { color:var(--nimble-orange); font-weight:600; }

/* OPS-243 B: council by month table (Sales/CRM) */
.op-sales-council-section { margin-top:20px; }
.op-sales-council-table { width:100%; border-collapse:collapse; font-size:12.5px; font-variant-numeric:tabular-nums; overflow-x:auto; display:block; }
.op-sales-council-table th { text-align:right; font-size:10.5px; letter-spacing:0.07em; text-transform:uppercase; color:var(--text-tertiary); padding:5px 10px 5px 0; font-weight:600; border-bottom:1px solid var(--border-soft); white-space:nowrap; }
.op-sales-council-table td { text-align:right; padding:5px 10px 5px 0; color:var(--text-primary); border-bottom:0.5px solid var(--border-soft); }
.op-sales-council-table .op-sct-label { text-align:left; font-weight:500; }
.op-sales-council-table .op-sct-month { text-align:left; font-size:11px; color:var(--text-tertiary); letter-spacing:0.04em; text-transform:uppercase; font-weight:600; padding-top:8px; }
.op-sales-council-table .op-sct-ambig { font-size:10.5px; color:var(--text-tertiary); font-style:italic; }
.op-sales-council-filter { display:flex; gap:8px; flex-wrap:wrap; margin-bottom:12px; margin-top:8px; }
.op-sales-council-filter-btn { padding:4px 12px; border-radius:20px; border:1px solid var(--border-soft); background:var(--bg-surface); color:var(--text-secondary); font-size:12px; cursor:pointer; transition:background 0.15s; }
.op-sales-council-filter-btn.active { background:var(--nimble-teal, #004447); color:#fff; border-color:var(--nimble-teal, #004447); }

/* Walkthrough-5 live-walk fixes (OPS-245 §A) */
.op-pm-monthly-target-label { fill:var(--nimble-orange); font-weight:800; font-size:13px; paint-order:stroke; stroke:#fdfcf9; stroke-width:3px; }
.op-pm-monthly-seg-label-out { font-size:11px; font-weight:700; fill:var(--text-primary); font-variant-numeric:tabular-nums; paint-order:stroke; stroke:#fdfcf9; stroke-width:2.5px; }
/* Fingerprint signal rows: one consistent grid (chip · name / detail below),
   no more inline-vs-wrapped jumping between rows */
.op-pm-fp-signal-row:not(.op-pm-fp-signal-quiet) { display:grid; grid-template-columns:76px 1fr; column-gap:10px; row-gap:2px; align-items:start; flex-wrap:initial; }
.op-pm-fp-signal-row:not(.op-pm-fp-signal-quiet) > :first-child { grid-column:1; grid-row:1; }
.op-pm-fp-signal-row:not(.op-pm-fp-signal-quiet) .op-pm-fp-signal-name { grid-column:2; grid-row:1; }
.op-pm-fp-signal-row:not(.op-pm-fp-signal-quiet) .op-pm-fp-signal-detail { grid-column:2; grid-row:2; font-size:12.5px; color:var(--text-secondary); }
/* Overview rhythm: equal-height tiles per row, consistent section gaps */
.op-ov-pulse-grid { align-items:stretch; }
.op-ov-pulse-grid .op-storycard { height:100%; }
.op-ov-wn-line { font-size:13px; color:var(--text-primary); margin:6px 0 0; }
/* No silent value clipping anywhere: long values wrap instead */
.op-storycard-row-v { white-space:normal; overflow-wrap:anywhere; text-align:right; }

/* OPS-246 §B: Library shelf (account:library) */
.op-lib-group { margin-top:22px; max-width:860px; }
.op-lib-group-head { display:flex; align-items:center; gap:8px; font-size:11px; letter-spacing:0.08em; text-transform:uppercase; color:var(--text-tertiary); font-weight:700; padding-bottom:6px; border-bottom:1px solid var(--border-soft); }
.op-lib-group-count { background:rgba(0,68,71,0.08); color:var(--nimble-teal, #004447); border-radius:10px; padding:1px 8px; font-size:10.5px; }
.op-lib-doc { border-bottom:0.5px solid var(--border-soft); }
.op-lib-doc-summary { display:flex; align-items:baseline; justify-content:space-between; gap:14px; padding:10px 2px; cursor:pointer; list-style-position:outside; }
.op-lib-doc-summary:hover { background:var(--bg-surface); }
.op-lib-doc-title { font-size:13.5px; font-weight:600; color:var(--text-primary); }
.op-lib-doc-meta { font-size:11.5px; color:var(--text-tertiary); white-space:nowrap; }
.op-lib-doc-desc { font-size:12.5px; color:var(--text-secondary); padding:0 2px 8px 18px; }
.op-lib-doc-body { padding:6px 18px 18px; font-size:13.5px; line-height:1.55; color:var(--text-primary); max-width:760px; }
.op-lib-doc-body h1, .op-lib-doc-body h2 { font-size:16px; margin:18px 0 8px; }
.op-lib-doc-body h3 { font-size:14px; margin:14px 0 6px; }
.op-lib-doc-body h4 { font-size:13px; margin:12px 0 4px; }
.op-lib-doc-body p { margin:8px 0; }
.op-lib-doc-body ul, .op-lib-doc-body ol { margin:8px 0; padding-left:22px; }
.op-lib-doc-body li { margin:3px 0; }
.op-lib-doc-body code { background:var(--bg-surface); border-radius:3px; padding:1px 4px; font-size:12px; }
.op-lib-doc-body blockquote { border-left:3px solid var(--border-soft); margin:10px 0; padding:2px 12px; color:var(--text-secondary); }
.op-lib-doc-body table { border-collapse:collapse; margin:10px 0; font-size:12.5px; font-variant-numeric:tabular-nums; display:block; overflow-x:auto; }
.op-lib-doc-body th { text-align:left; font-size:11px; text-transform:uppercase; letter-spacing:0.05em; color:var(--text-tertiary); padding:4px 12px 4px 0; border-bottom:1px solid var(--border-soft); }
.op-lib-doc-body td { padding:4px 12px 4px 0; border-bottom:0.5px solid var(--border-soft); }
.op-lib-doc-body hr { border:none; border-top:1px solid var(--border-soft); margin:14px 0; }
.op-lib-empty { max-width:640px; margin-top:18px; font-size:13.5px; color:var(--text-secondary); line-height:1.5; }
.op-lib-foot { margin-top:24px; font-size:11.5px; color:var(--text-tertiary); }

/* OPS-255: Library layout -- collapsible left nav + reading pane */
.op-lib-layout { display:flex; gap:0; align-items:stretch; min-height:72vh; margin-top:16px; }
.op-lib-nav { flex:0 0 220px; width:220px; min-width:220px; border-right:1px solid var(--border-soft); display:flex; flex-direction:column; transition:flex 0.18s ease, width 0.18s ease, min-width 0.18s ease; }
.op-lib-layout--collapsed .op-lib-nav { flex:0 0 36px; width:36px; min-width:36px; }
.op-lib-nav-toggle { flex:none; align-self:flex-end; background:none; border:none; cursor:pointer; color:var(--nimble-teal,#004447); font-size:14px; font-weight:700; padding:6px 10px; line-height:1; }
.op-lib-nav-toggle:hover { color:var(--text-primary); }
.op-lib-nav-inner { overflow:hidden; flex:1 1 auto; overflow-y:auto; padding-bottom:12px; }
.op-lib-layout--collapsed .op-lib-nav-inner { display:none; }
.op-lib-nav-group-head { font-size:10.5px; letter-spacing:0.08em; text-transform:uppercase; color:var(--text-tertiary); font-weight:700; padding:14px 12px 4px; }
.op-lib-nav-item { display:block; width:100%; text-align:left; background:none; border:none; cursor:pointer; padding:7px 12px; border-radius:4px; }
.op-lib-nav-item:hover { background:var(--bg-surface); }
.op-lib-nav-item--active { background:rgba(0,68,71,0.08); }
.op-lib-nav-item--active .op-lib-nav-item-title { color:var(--nimble-teal,#004447); }
.op-lib-nav-item-title { display:block; font-size:13px; font-weight:600; color:var(--text-primary); line-height:1.3; }
.op-lib-nav-item-meta { display:block; font-size:11px; color:var(--text-tertiary); margin-top:2px; }
.op-lib-pane { flex:1 1 auto; min-width:0; padding:0 20px 24px; }
.op-lib-pane-meta { font-size:11.5px; color:var(--text-tertiary); margin-bottom:10px; }
.op-lib-frame { width:100%; height:72vh; min-height:520px; border:none; border-radius:4px; display:block; }
.op-lib-frame-loading { font-size:13px; color:var(--text-tertiary); padding:24px 0; }
.op-lib-frame-error { font-size:13px; color:var(--text-secondary); padding:24px 0; max-width:520px; line-height:1.5; }

/* OPS-246 §C1: By Ad window/product chips + 2x thumbnails */
.op-pm-byad-chips { display:flex; gap:8px; flex-wrap:wrap; margin:10px 0 2px; }
.op-pm-byad-chips-prod { margin-top:6px; }
.op-pm-byad-chip { padding:4px 12px; border-radius:4px; border:1px solid var(--border-soft); background:var(--bg-surface); color:var(--text-secondary); font-size:12px; cursor:pointer; transition:background 0.15s; }
.op-pm-byad-chip.active { background:var(--nimble-teal, #004447); color:#fff; border-color:var(--nimble-teal, #004447); }
.op-pm-byad-table .op-pm-ad-thumb, .op-pm-byad-table .op-pm-thumbwrap { width:72px; height:72px; flex:0 0 auto; }
.op-pm-byad-table .op-pm-thumbwrap .op-pm-ad-thumb { width:72px; height:72px; }

/* OPS-246 §C2: fatigue expanded lists with thumbnails + lifetime */
.op-pm-fatigue-agg-item-rich { display:flex; gap:10px; align-items:center; padding:5px 0; }
.op-pm-fatigue-agg-concept { font-size:12.5px; font-weight:600; color:var(--text-primary); }
.op-pm-fatigue-agg-life { font-size:11.5px; color:var(--text-tertiary); }

/* OPS-246 §C3: angle unclassified note + launch-date column */
.op-pm-angle-unclassified-note { font-size:12.5px; color:var(--nimble-orange); font-weight:600; margin:8px 0 4px; }
.op-pm-angle-adlive { color:var(--text-tertiary); font-size:11.5px; }

/* OPS-246 §C4: LP daily chart · all-column labels + dot legend */
.op-lpd-bar-label-sm { font-size:8.5px; font-weight:600; opacity:0.75; }
.op-lpd-chart-legend { display:flex; align-items:center; gap:6px; font-size:11.5px; color:var(--text-tertiary); margin-top:4px; }
.op-lpd-legend-dot { width:8px; height:8px; border-radius:50%; background:#2e7d5b; opacity:0.85; display:inline-block; }

/* OPS-246 catch 5: v1 Prototype insight-card port on Overview NOTES ·
   faded-teal tile background (the "faded blue" try), teal left border,
   icon bubble. Count pill mirrors the Prototype's zone-head count. */
.op-sum-insight-v1info { display:flex; gap:10px; align-items:flex-start; background:rgba(0,68,71,0.04); border-left:4px solid var(--nimble-teal, #004447); border-radius:8px; padding:10px 14px; }
.op-sum-insight-ico { width:26px; height:26px; border-radius:50%; background:rgba(0,68,71,0.1); color:var(--nimble-teal, #004447); display:flex; align-items:center; justify-content:center; font-size:13px; flex:0 0 auto; margin-top:1px; }
.op-sum-insight-body { flex:1; min-width:0; }
.op-sum-note-count { background:rgba(0,68,71,0.08); color:var(--nimble-teal, #004447); border-radius:10px; padding:1px 8px; font-size:10.5px; margin-left:8px; }

/* ── OPS-248 · Deterministic decision layer (Paid Media UX Tier 1) ─────────
   Six canonical status colours (scope v2 §7.3): small pills / tints only,
   never a full-card fill. Executive card anatomy per §7.5: eyebrow > hero >
   pill > max 2 support rows > one action line, equal heights in the row. */
:root {
  --status-on-track: #1e6b3a;   /* deep green */
  --status-watch:    #a8720a;   /* amber */
  --status-act:      #9a2c1f;   /* dark red */
  --status-hold:     #14606b;   /* teal-blue */
  --status-too-early:#6f6e68;   /* neutral grey */
  --status-data-limited:#4a5560;/* slate */
}
.op-pill { display:inline-block; font-size:10px; font-weight:700; letter-spacing:.4px; text-transform:uppercase; padding:2px 8px; border-radius:999px; border:1px solid transparent; white-space:nowrap; }
.op-pill-on_track     { color:var(--status-on-track);     background:rgba(30,107,58,.09);  border-color:rgba(30,107,58,.25); }
.op-pill-watch        { color:var(--status-watch);        background:rgba(168,114,10,.10); border-color:rgba(168,114,10,.28); }
.op-pill-act          { color:var(--status-act);          background:rgba(154,44,31,.09);  border-color:rgba(154,44,31,.28); }
.op-pill-hold         { color:var(--status-hold);         background:rgba(20,96,107,.09);  border-color:rgba(20,96,107,.28); }
.op-pill-too_early    { color:var(--status-too-early);    background:rgba(111,110,104,.10);border-color:rgba(111,110,104,.26); }
.op-pill-data_limited { color:var(--status-data-limited); background:rgba(74,85,96,.10);   border-color:rgba(74,85,96,.26); }

.op-pm-decisions-section { margin-bottom:28px; }
.op-pm-exec-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:14px; align-items:stretch; }
.op-pm-exec-grid > * { min-width:0; }
@media (max-width:1000px) { .op-pm-exec-grid { grid-template-columns:repeat(2,1fr); } }
@media (max-width:560px)  { .op-pm-exec-grid { grid-template-columns:1fr; } }

.op-pm-exec { display:flex; flex-direction:column; background:var(--bg-surface,#fff); border:1px solid var(--border-soft,rgba(0,0,0,.08)); border-radius:var(--radius-lg,12px); box-shadow:0 1px 2px rgba(26,43,44,.05); padding:20px; min-height:176px; }
.op-pm-exec-eyebrow { font-size:11px; font-weight:600; letter-spacing:.6px; text-transform:uppercase; color:var(--text-tertiary,#888780); margin-bottom:8px; }
.op-pm-exec-herowrap { margin-bottom:8px; }
.op-pm-exec-hero { font-size:30px; font-weight:700; line-height:1.1; color:var(--text-primary,#1f1f1d); font-variant-numeric:tabular-nums; }
.op-pm-exec-hero-state { font-size:26px; }
.op-pm-state-hold { color:var(--status-hold); }
.op-pm-state-act { color:var(--status-act); }
.op-pm-state-watch { color:var(--status-watch); }
.op-pm-state-on_track { color:var(--status-on-track); }
.op-pm-state-too_early { color:var(--status-too-early); }
.op-pm-state-data_limited { color:var(--status-data-limited); }
.op-pm-exec-herolabel { font-size:12px; color:var(--text-secondary,#5f5e5a); margin-top:3px; }
.op-pm-exec-pills { display:flex; gap:6px; align-items:center; margin-bottom:10px; }
.op-pm-exec-maturity { font-size:10px; color:var(--text-tertiary,#888780); text-transform:capitalize; }
.op-pm-exec-support { margin-top:auto; display:flex; flex-direction:column; gap:5px; }
.op-pm-exec-suprow { display:flex; justify-content:space-between; gap:10px; font-size:13px; }
.op-pm-exec-suplabel { color:var(--text-secondary,#5f5e5a); }
.op-pm-exec-supval { color:var(--text-primary,#1f1f1d); font-variant-numeric:tabular-nums; text-align:right; }
.op-pm-exec-action { font-size:13px; color:var(--text-primary,#1f1f1d); border-top:1px solid var(--border-soft,rgba(0,0,0,.08)); padding-top:8px; margin:10px 0 0; }
.op-pm-exec-reason { font-size:13px; line-height:1.45; color:var(--text-secondary,#5f5e5a); margin:0 0 10px; display:-webkit-box; -webkit-line-clamp:4; -webkit-box-orient:vertical; overflow:hidden; }
.op-pm-exec-evidence { font-size:12px; font-weight:600; color:var(--nimble-teal,#004447); text-decoration:none; margin-top:8px; }
.op-pm-exec-evidence:hover { text-decoration:underline; }

/* Risk roll-up card (was a one-line strip; Alex 2026-07-13: an ACT state
   needs presence). State-tinted left edge + fired-signal chips. */
.op-pm-riskcard { display:block; margin-top:14px; padding:16px 18px; border-radius:var(--radius-lg,12px); border:1px solid var(--border-soft,rgba(0,0,0,.08)); border-left-width:4px; background:var(--bg-surface,#fff); box-shadow:0 1px 2px rgba(26,43,44,.05); text-decoration:none; color:inherit; transition:background .14s ease; }
.op-pm-riskcard:hover { background:var(--bg-muted,#f1efe8); }
.op-pm-riskcard-act { border-left-color:var(--status-act); }
.op-pm-riskcard-watch { border-left-color:var(--status-watch); }
.op-pm-riskcard-hold { border-left-color:var(--status-hold); }
.op-pm-riskcard-on_track { border-left-color:var(--status-on-track); }
.op-pm-riskcard-data_limited { border-left-color:var(--status-data-limited); }
.op-pm-riskcard-head { display:flex; align-items:center; gap:10px; margin-bottom:8px; }
.op-pm-riskcard-cta { font-size:12px; font-weight:600; color:var(--nimble-teal,#004447); margin-left:auto; }
.op-pm-riskcard-text { font-size:14px; line-height:1.45; color:var(--text-primary,#1f1f1d); margin:0; }
.op-pm-riskcard-chips { display:flex; flex-wrap:wrap; gap:6px; margin-top:10px; }
.op-pm-riskcard-chip { font-size:11.5px; font-weight:600; padding:3px 10px; border-radius:999px; border:1px solid; }
.op-pm-riskcard-chip-act { color:var(--status-act); background:rgba(154,44,31,.07); border-color:rgba(154,44,31,.25); }
.op-pm-riskcard-chip-watch { color:var(--status-watch); background:rgba(168,114,10,.08); border-color:rgba(168,114,10,.25); }
.op-pm-riskcard-chip-hold { color:var(--status-hold); background:rgba(20,96,107,.07); border-color:rgba(20,96,107,.25); }
.op-pm-riskcard-chip-data_limited { color:var(--status-data-limited); background:rgba(74,85,96,.08); border-color:rgba(74,85,96,.24); }
/* §6.1 compression pass: covered/not-covered + next-review meta line. */
.op-pm-riskcard-meta { font-size:12.5px; color:var(--text-secondary,#5f5e5a); margin:8px 0 0; }

/* Brief hero band (polish pass B2): the one dominant decision, promoted above
   the portfolio row. State-tinted left edge, big verdict word + open count. */
.op-pm-hero { display:block; padding:20px 22px; border:1px solid var(--border-soft,rgba(0,0,0,.08)); border-left-width:5px; border-radius:var(--radius-lg,12px); background:var(--bg-surface,#fff); box-shadow:0 1px 3px rgba(26,43,44,.06); }
.op-pm-hero-act { border-left-color:var(--status-act); }
.op-pm-hero-watch { border-left-color:var(--status-watch); }
.op-pm-hero-on_track { border-left-color:var(--status-on-track); }
.op-pm-hero-hold { border-left-color:var(--status-hold); }
.op-pm-hero-too_early { border-left-color:var(--status-too-early); }
.op-pm-hero-data_limited { border-left-color:var(--status-data-limited); }
.op-pm-hero-top { display:flex; align-items:baseline; gap:14px; flex-wrap:wrap; margin-bottom:8px; }
.op-pm-hero-state { font-size:28px; font-weight:800; line-height:1; }
.op-pm-hero-count { font-size:13px; font-weight:600; color:var(--text-secondary,#5f5e5a); }
.op-pm-hero-headline { font-size:16px; line-height:1.4; font-weight:600; color:var(--text-primary,#1f1f1d); margin:0 0 8px; }
/* OPS-300 PR2: the one secondary stat (driving tile's CPL vs band) and the
   what-changed/frozen one-liner -- same weight as the action line below. */
.op-pm-hero-stat { font-size:14px; line-height:1.45; color:var(--text-primary,#1f1f1d); margin:0 0 8px; }
.op-pm-hero-changed { font-size:14px; line-height:1.45; color:var(--text-secondary,#5f5e5a); margin:0 0 12px; }
.op-pm-hero-action { font-size:14px; line-height:1.45; color:var(--text-primary,#1f1f1d); margin:0 0 12px; }
.op-pm-hero-foot { display:flex; align-items:center; gap:16px; flex-wrap:wrap; }
.op-pm-hero-checkpoint { font-size:12.5px; font-weight:600; color:var(--text-secondary,#5f5e5a); }

/* Portfolio detail: the per-product cards, demoted below the hero. */
.op-pm-exec-grid.op-pm-exec-grid-support { grid-template-columns:repeat(3,1fr); gap:12px; }
@media (max-width:900px) { .op-pm-exec-grid.op-pm-exec-grid-support { grid-template-columns:1fr; } }
.op-pm-exec-grid-support .op-pm-exec { min-height:auto; padding:16px; box-shadow:none; background:var(--bg-muted,#f7f6f1); }
.op-pm-exec-grid-support .op-pm-exec-hero { font-size:24px; }
.op-pm-decisions-foot { font-size:11.5px; color:var(--text-tertiary,#888780); margin:12px 0 0; }

/* Ads · Gallery (§11.7, OPS-249) */
.op-pm-gal-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:14px; }
@media (max-width:1350px) { .op-pm-gal-grid { grid-template-columns:repeat(3,1fr); } }
@media (max-width:900px)  { .op-pm-gal-grid { grid-template-columns:repeat(2,1fr); } }
@media (max-width:560px)  { .op-pm-gal-grid { grid-template-columns:1fr; } }
.op-pm-gal-card { border:1px solid var(--border-soft,rgba(0,0,0,.08)); border-radius:var(--radius-lg,10px); background:var(--bg-surface,#fff); overflow:hidden; cursor:pointer; display:flex; flex-direction:column; }
.op-pm-gal-card:hover, .op-pm-gal-card:focus-visible { border-color:var(--brand-teal,#004447); outline:none; }
.op-pm-gal-thumb { position:relative; width:100%; aspect-ratio:4/5; background:rgba(0,0,0,.03); }
.op-pm-gal-thumb-inner { width:100%; height:100%; }
.op-pm-gal-thumb .op-pm-thumbwrap { position:absolute; inset:0; width:100%; height:100%; }
.op-pm-gal-thumb .op-pm-ad-thumb, .op-pm-gal-thumb .op-pm-thumb-over { width:100%; height:100%; object-fit:cover; border-radius:0; top:0; left:0; }
.op-pm-gal-thumb .op-pm-thumb-ph { width:100%; height:100%; border-radius:0; font-size:22px; }
.op-pm-gal-body { padding:10px 12px 12px; display:flex; flex-direction:column; gap:6px; }
.op-pm-gal-name { font-size:13.5px; font-weight:700; color:var(--text-primary,#1f1f1d); line-height:1.3; }
.op-pm-gal-tags { display:flex; flex-wrap:wrap; gap:5px; }
.op-pm-gal-tag { font-size:10.5px; font-weight:600; color:var(--text-secondary,#5f5e5a); background:rgba(0,0,0,.05); border-radius:999px; padding:2px 8px; }
.op-pm-gal-maturity { font-size:11.5px; color:var(--text-tertiary,#888780); }
.op-pm-gal-foot { font-size:11.5px; color:var(--text-tertiary,#888780); margin:14px 0 0; }

/* Ad drawer (§11.8, OPS-249) -- appended to document.body, not #page
   (see the container-type forward-guard next to #page in styles.css). */
.op-pm-drawer-root { position:fixed; inset:0; z-index:200; }
/* Angle creative-set drawer (OPS-276): LOWER z-index than the ad drawer above
   so opening an ad from inside it always paints on top, regardless of DOM
   insertion order (each module's mount node is created once and reused). */
.op-pm-angledrawer-root { position:fixed; inset:0; z-index:190; }
.op-pm-angledrawer-adrow { display:grid; grid-template-columns:44px minmax(120px,1fr) minmax(220px,1.6fr) 74px 74px 62px; gap:10px; align-items:center; width:100%; padding:8px 0; border-top:1px solid var(--border-soft); border-left:0; border-right:0; border-bottom:0; background:transparent; font:inherit; text-align:left; cursor:pointer; }
.op-pm-angledrawer-adrow:first-child { border-top:0; }
.op-pm-angledrawer-adrow:hover, .op-pm-angledrawer-adrow:focus-visible { background:var(--bg-muted); }
.op-pm-drawer-backdrop { position:absolute; inset:0; background:rgba(0,0,0,.35); }
.op-pm-drawer-panel { position:absolute; top:0; right:0; bottom:0; width:480px; max-width:92vw; background:var(--bg-surface,#fff); box-shadow:-8px 0 24px rgba(0,0,0,.15); overflow-y:auto; padding:20px 22px 28px; }
.op-pm-drawer-head { display:flex; align-items:flex-start; justify-content:space-between; gap:12px; margin-bottom:14px; }
.op-pm-drawer-title { font-size:16px; font-weight:700; color:var(--text-primary,#1f1f1d); line-height:1.35; }
.op-pm-drawer-close { border:none; background:transparent; font-size:22px; line-height:1; cursor:pointer; color:var(--text-secondary,#5f5e5a); padding:2px 6px; }
.op-pm-drawer-close:hover, .op-pm-drawer-close:focus-visible { color:var(--text-primary,#1f1f1d); }
.op-pm-drawer-thumb { width:100%; aspect-ratio:4/5; background:rgba(0,0,0,.03); border-radius:var(--radius-lg,10px); overflow:hidden; position:relative; margin-bottom:16px; }
.op-pm-drawer-thumb-inner { width:100%; height:100%; }
.op-pm-drawer-thumb .op-pm-thumbwrap { position:absolute; inset:0; width:100%; height:100%; }
.op-pm-drawer-thumb .op-pm-ad-thumb, .op-pm-drawer-thumb .op-pm-thumb-over { width:100%; height:100%; object-fit:cover; border-radius:0; top:0; left:0; }
.op-pm-drawer-thumb .op-pm-thumb-ph { width:100%; height:100%; border-radius:0; font-size:28px; }
.op-pm-drawer-section { margin-bottom:16px; }
.op-pm-drawer-section-title { font-size:11.5px; font-weight:700; text-transform:uppercase; letter-spacing:.5px; color:var(--text-tertiary,#888780); margin-bottom:8px; }
.op-pm-drawer-row { display:flex; justify-content:space-between; gap:12px; font-size:13px; padding:4px 0; border-bottom:0.5px solid var(--border-soft,rgba(0,0,0,.06)); }
.op-pm-drawer-k { color:var(--text-secondary,#5f5e5a); }
.op-pm-drawer-v { color:var(--text-primary,#1f1f1d); font-weight:600; text-align:right; }
.op-pm-drawer-caveat { font-size:11.5px; color:var(--text-tertiary,#888780); margin-top:6px; }
.op-pm-drawer-actions { display:flex; gap:10px; margin-top:8px; }
.op-pm-drawer-action { font-size:12.5px; font-weight:700; color:#fff; background:var(--brand-teal,#004447); border-radius:var(--radius,8px); padding:8px 14px; text-decoration:none; }
.op-pm-drawer-action:hover { opacity:.9; }

.op-pm-byad-row-clickable { cursor:pointer; }
.op-pm-byad-row-clickable:hover { background:rgba(0,68,71,0.04); }

/* OPS-250 phase B: §15.6 attribution-confidence pill */
.op-pm-conf { display:inline-block; font-size:10.5px; font-weight:700; line-height:1.4; border-radius:999px; padding:2px 9px; letter-spacing:.01em; white-space:nowrap; }
.op-pm-conf-high { background:rgba(0,68,71,0.12); color:var(--brand-teal,#004447); }
.op-pm-conf-medium { background:rgba(210,128,77,0.16); color:#a85a26; }
.op-pm-conf-low { background:rgba(0,0,0,0.06); color:var(--text-secondary,#5f5e5a); }
.op-pm-conf-unmatched { background:transparent; color:var(--text-tertiary,#888780); border:0.5px solid var(--border-soft,rgba(0,0,0,0.12)); }
.op-pm-gal-card .op-pm-conf { align-self:flex-start; margin-top:2px; }

/* OPS-252 Tier 2: §11.6 classification pills (8-way). Restrained status colour
   per §7 (tone drives the pill, one accent per row). */
.op-pm-cls { display:inline-block; font-size:10.5px; font-weight:700; line-height:1.4; border-radius:999px; padding:2px 9px; letter-spacing:.01em; white-space:nowrap; }
.op-pm-cls-winner { background:rgba(46,139,87,0.14); color:#1f7a4d; }
.op-pm-cls-core { background:rgba(0,68,71,0.12); color:var(--brand-teal,#004447); }
.op-pm-cls-emerging { background:rgba(0,68,71,0.07); color:var(--brand-teal,#004447); }
.op-pm-cls-watch { background:rgba(210,128,77,0.18); color:#a85a26; }
.op-pm-cls-protect { background:rgba(178,58,58,0.14); color:#9a2c2c; }
.op-pm-cls-retire { background:rgba(178,58,58,0.16); color:#8f2525; }
.op-pm-cls-learning { background:rgba(0,0,0,0.06); color:var(--text-secondary,#5f5e5a); }
.op-pm-cls-insufficient { background:transparent; color:var(--text-tertiary,#888780); border:0.5px solid var(--border-soft,rgba(0,0,0,0.12)); }
/* OPS-272: two fatigue-only states, reusing the §11.6 pill component (retire/protect/watch above are shared with the Fatigue tab). */
.op-pm-cls-no_fatigue { background:rgba(46,139,87,0.14); color:#1f7a4d; }
.op-pm-cls-hold { background:rgba(0,0,0,0.06); color:var(--text-secondary,#5f5e5a); }
.op-pm-gal-pills { display:flex; flex-wrap:wrap; gap:6px; margin-top:2px; }

/* OPS-272: §12.3 four-card fatigue summary row, reusing the §11.3 op-pm-adcard component. */
.op-pm-fatigue-cards-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:14px; margin:0 0 18px; }
@media (max-width:1100px) { .op-pm-fatigue-cards-grid { grid-template-columns:repeat(2,1fr); } }
@media (max-width:640px)  { .op-pm-fatigue-cards-grid { grid-template-columns:1fr; } }
.op-pm-fatigue-card-value { font-size:20px; font-weight:700; }
.op-pm-fatigue-card-note { font-size:11.5px; color:var(--text-tertiary,#888780); }
.op-pm-fatigue-quiet { font-size:11px; color:var(--text-tertiary,#888780); font-style:italic; margin-top:2px; }
.op-pm-fatigue-row-clickable { cursor:pointer; }
.op-pm-fatigue-row-clickable:hover { background:rgba(0,68,71,0.04); }
.op-pm-fatigue-allclear { margin:10px 0; }

/* OPS-314: Mirror's 4-chip verdict vocabulary (KEEP/WATCH/REPLACE + a
   distinct dashed "gated" state for immature ads -- never a fabricated
   WATCH). Reuses the §11.6 pill component's sizing, own colours: keep
   reads as the winner/core green, watch as the amber, replace as the
   retire red; gated is deliberately muted + dashed, not a solid tone, so
   it never reads as a call. */
.op-pm-verdict { display:inline-block; font-size:10.5px; font-weight:700; line-height:1.4; border-radius:999px; padding:2px 9px; letter-spacing:.01em; white-space:nowrap; }
.op-pm-verdict-keep { background:rgba(46,139,87,0.14); color:#1f7a4d; }
.op-pm-verdict-watch { background:rgba(210,128,77,0.18); color:#a85a26; }
.op-pm-verdict-replace { background:rgba(178,58,58,0.16); color:#8f2525; }
.op-pm-verdict-gated { background:transparent; color:var(--text-tertiary,#888780); border:1px dashed var(--border-soft,rgba(0,0,0,0.18)); }
.op-pm-mir-row-clickable { cursor:pointer; }
.op-pm-mir-row-clickable:hover { background:rgba(0,68,71,0.04); }

/* OPS-314: Snapshot's diagnosis line + retire-call card. */
.op-pm-brief-diagnosis { margin:0 0 16px; }
.op-pm-brief-diagnosis-link { display:inline-block; font-size:12.5px; font-weight:600; color:var(--brand-teal,#004447); text-decoration:none; margin-top:2px; }
.op-pm-brief-diagnosis-link:hover { text-decoration:underline; }
.op-pm-brief-retirecall { background:var(--surface-2,#faf9f6); border:1px solid var(--border-soft,rgba(0,0,0,0.1)); border-radius:8px; padding:12px 16px; margin:0 0 16px; }
.op-pm-brief-retirecall-line { margin:4px 0 6px; font-size:13.5px; }

/* OPS-314: Results tab -- "what we did on paid" list, reusing plan_activity. */
.op-pm-results-whatwedid { margin-top:18px; }
.op-pm-results-wwd-list { border-top:1px solid var(--border-soft,rgba(0,0,0,0.1)); }
.op-pm-results-wwd-row { display:flex; gap:14px; padding:9px 0; border-bottom:1px solid var(--border-soft,rgba(0,0,0,0.08)); font-size:13px; }
.op-pm-results-wwd-date { flex:none; width:78px; color:var(--text-tertiary,#888780); font-variant-numeric:tabular-nums; }
.op-pm-results-wwd-title { flex:1; }

/* §11.3 three top cards */
.op-pm-adcards-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:14px; margin:0 0 18px; }
.op-pm-adcard { border:1px solid var(--border-soft,rgba(0,0,0,.08)); border-radius:var(--radius-lg,10px); background:var(--bg-surface,#fff); padding:14px 16px; display:flex; flex-direction:column; gap:8px; min-height:176px; }
.op-pm-adcard-eyebrow { font-size:10.5px; font-weight:700; letter-spacing:.06em; text-transform:uppercase; color:var(--text-tertiary,#888780); }
.op-pm-adcard-empty { font-size:12.5px; color:var(--text-tertiary,#888780); margin:0; }
.op-pm-adcard-asset { display:flex; gap:10px; align-items:flex-start; }
.op-pm-adcard-thumb { width:52px; height:52px; border-radius:8px; object-fit:cover; flex:0 0 auto; }
.op-pm-adcard-assetmeta { display:flex; flex-direction:column; gap:5px; min-width:0; }
.op-pm-adcard-name { font-size:13.5px; font-weight:700; color:var(--text-primary,#2b2a27); overflow:hidden; text-overflow:ellipsis; }
.op-pm-adcard-tags { display:flex; flex-wrap:wrap; gap:5px; }
.op-pm-adcard-evidence { font-size:12.5px; color:var(--text-secondary,#5f5e5a); line-height:1.45; }
.op-pm-adcard-action { font-size:12.5px; font-weight:600; color:var(--brand-teal,#004447); line-height:1.45; }
.op-pm-adcard-more { font-size:11px; color:var(--text-tertiary,#888780); margin-top:auto; }
.op-pm-adcard-foot { display:flex; flex-wrap:wrap; gap:8px; align-items:center; margin-top:auto; font-size:11.5px; color:var(--text-tertiary,#888780); }
.op-pm-adcard-covrow { display:flex; justify-content:space-between; gap:10px; font-size:12.5px; padding:3px 0; border-bottom:0.5px solid var(--border-soft,rgba(0,0,0,.06)); }
.op-pm-adcard-covrow:last-child { border-bottom:0; }
.op-pm-adcard-covlabel { color:var(--text-secondary,#5f5e5a); }
.op-pm-adcard-covval { font-weight:700; color:var(--text-primary,#2b2a27); }
.op-pm-byad-chips-sort { align-items:center; }
.op-pm-byad-chips-lbl { font-size:11px; font-weight:600; color:var(--text-tertiary,#888780); margin-right:2px; }
@media (max-width:900px) { .op-pm-adcards-grid { grid-template-columns:1fr; } }

/* OPS-250 phase B: §15.3 freshness pill + tooltip */
.op-pm-fresh { position:relative; display:inline-flex; margin:0 0 16px; }
.op-pm-decisions-foot + .op-pm-fresh, .op-pm-fresh:last-child { margin-bottom:0; }
.op-pm-fresh-pill { display:inline-flex; align-items:center; gap:7px; font-size:12px; font-weight:600; padding:5px 11px; border-radius:999px; background:var(--surface-soft,rgba(0,68,71,0.04)); border:0.5px solid var(--border-soft,rgba(0,0,0,0.12)); color:var(--text-secondary,#5f5e5a); cursor:default; }
.op-pm-fresh-dot { width:8px; height:8px; border-radius:50%; flex:0 0 auto; background:var(--text-tertiary,#888780); }
.op-pm-fresh-fresh .op-pm-fresh-dot { background:#2e8b57; }
.op-pm-fresh-stale .op-pm-fresh-dot { background:#d2804d; }
.op-pm-fresh-partial .op-pm-fresh-dot { background:#d2804d; }
.op-pm-fresh-failed .op-pm-fresh-dot { background:#c0392b; }
.op-pm-fresh-tip { position:absolute; z-index:40; top:calc(100% + 6px); left:0; min-width:260px; padding:10px 12px; background:var(--surface,#fff); border:0.5px solid var(--border-soft,rgba(0,0,0,0.14)); border-radius:8px; box-shadow:0 6px 20px rgba(0,0,0,0.12); opacity:0; visibility:hidden; transition:opacity .12s ease; pointer-events:none; }
.op-pm-fresh:hover .op-pm-fresh-tip, .op-pm-fresh-pill:focus-visible + .op-pm-fresh-tip { opacity:1; visibility:visible; }
.op-pm-fresh-tiprow { display:flex; justify-content:space-between; gap:14px; font-size:12px; padding:2px 0; }
.op-pm-fresh-tipk { color:var(--text-tertiary,#888780); }
.op-pm-fresh-tipv { color:var(--text-primary); font-weight:600; font-variant-numeric:tabular-nums; }
.op-pm-fresh-tipnote { font-size:11px; color:var(--text-tertiary,#888780); margin-top:6px; padding-top:6px; border-top:0.5px solid var(--border-soft,rgba(0,0,0,0.1)); }

/* Angles Phase 2 (OPS-276): next-brief decision card + compact clickable
   angle rows (replace the always-rendered ads-by-angle list). */
.op-pm-nextbrief { border:1px solid var(--nimble-teal); border-radius:var(--radius-lg,10px); padding:14px 16px; margin-bottom:16px; background:color-mix(in srgb, var(--nimble-teal) 5%, var(--surface,#fff)); }
.op-pm-nextbrief-eyebrow { font-size:10.5px; font-weight:700; letter-spacing:0.06em; text-transform:uppercase; color:var(--nimble-teal); }
.op-pm-nextbrief-headline { font-size:16px; font-weight:700; color:var(--text-primary); margin-top:4px; }
.op-pm-nextbrief-sub { font-size:12.5px; color:var(--muted-ink); margin-top:5px; }
.op-pm-nextbrief-action { font-size:12.5px; font-weight:600; color:var(--nimble-teal); margin-top:8px; }

.op-pm-angle-rowbtn { display:flex; justify-content:space-between; align-items:center; gap:12px; width:100%; padding:10px 14px; margin-top:8px; border:1px solid var(--border-soft); border-radius:var(--radius,8px); background:var(--surface,#fff); font:inherit; text-align:left; cursor:pointer; }
.op-pm-angle-rowbtn:first-of-type { margin-top:8px; }
.op-pm-angle-rowbtn:hover, .op-pm-angle-rowbtn:focus-visible { border-color:var(--nimble-teal); background:var(--bg-muted); }

/* Compression-pass Batch 3 (2026-07-17, §6.3): Decisions sub-view's compact,
   non-interactive angle shortlist row -- name + role chip, then one computed
   action line. No click affordance (unlike .op-pm-angle-rowbtn above, which
   stays Creative-sets-only). */
.op-pm-angle-shortlist-row { display:flex; flex-direction:column; gap:2px; padding:8px 0; border-bottom:1px solid var(--border-soft); }
.op-pm-angle-shortlist-row:last-child { border-bottom:none; }
.op-pm-angle-shortlist-head { display:flex; align-items:center; gap:8px; }
.op-pm-angle-shortlist-action { font-size:12.5px; color:var(--muted-ink); }

/* OPS-294: Coverage vs plan (Angles sub-view) -- summary bar + flag chips.
   Table/scroll/section-label shells are reused from existing Angles classes. */
.op-pm-cov-summary { display:flex; flex-wrap:wrap; align-items:baseline; gap:10px; margin:0 0 14px; }
.op-pm-cov-pct { font-size:16px; font-weight:700; color:var(--text-primary); }
.op-pm-cov-caveat { font-size:12px; color:var(--text-tertiary); }
.op-pm-cov-flag { display:inline-block; font-size:11.5px; font-weight:600; padding:2px 9px; border-radius:999px; }
.op-pm-cov-flag-gap { color:var(--status-act,#9a2c1f); background:rgba(154,44,31,.09); }
.op-pm-cov-flag-over { color:var(--status-watch,#a8720a); background:rgba(168,114,10,.09); }
.op-pm-cov-flag-ok { color:var(--nimble-teal,#004447); background:rgba(0,68,71,.08); }
.op-pm-cov-flag-offplan { color:var(--text-secondary); background:var(--border-soft); }

/* OPS-302: Creative > Live coverage summary line -- account-wide (all products),
   deliberately styled like the pm-cov flag chips above (same variables) since
   it is the same underlying concept at a coarser grain. */
.op-creative-covhead { margin-bottom:4px; }
.op-creative-covline { display:flex; flex-wrap:wrap; gap:8px; align-items:baseline; margin:0 0 18px; }
.op-creative-cov { display:inline-block; font-size:13px; font-weight:600; padding:4px 11px; border-radius:999px;
  border:1px solid var(--border-soft); color:var(--text-primary); background:var(--bg-surface); }
.op-creative-cov-gap { color:var(--status-act,#9a2c1f); border-color:var(--status-act,#9a2c1f); background:rgba(154,44,31,.09); }
.op-creative-cov-over { color:var(--status-watch,#a8720a); border-color:var(--status-watch,#a8720a); background:rgba(168,114,10,.09); }
.op-creative-block { margin-top:26px; }
.op-creative-body { margin-top:14px; }

/* Ads-tab merge (2026-07-19): campaign / ad set group headers on By Ad */
.op-pm-byad-grp { display:flex; align-items:baseline; justify-content:space-between; gap:12px; margin:18px 0 6px; }
.op-pm-byad-grp-campaign { border-bottom:2px solid var(--nimble-teal, #004447); padding-bottom:6px; margin-top:26px; }
.op-pm-byad-grp-campaign .op-pm-byad-grp-name { font-size:15px; font-weight:700; color:var(--nimble-teal, #004447); }
.op-pm-byad-grp-adset { margin-left:2px; }
.op-pm-byad-grp-adset .op-pm-byad-grp-name { font-size:13px; font-weight:600; color:var(--text-secondary, #555); }
.op-pm-byad-grp-sub { font-size:12px; color:var(--text-secondary, #555); white-space:nowrap; }
.op-pm-byad-chips-group { align-items:center; }

/* Ads-tab density pass (2026-07-19): collapsible campaign groups + compact grouped tables */
button.op-pm-byad-grp-campaign { width:100%; background:none; border:0; border-bottom:2px solid var(--nimble-teal, #004447); cursor:pointer; font:inherit; text-align:left; padding:0 0 6px; }
button.op-pm-byad-grp-campaign:hover .op-pm-byad-grp-name { color:var(--nimble-teal-dark, #002a2c); }
.op-pm-byad-grp-caret { font-size:12px; margin-right:8px; color:var(--text-secondary, #555); flex:none; }
.op-pm-byad-grp-content { margin-bottom:4px; }
/* Compact grouped tables: decision columns only, sized to avoid horizontal scroll */
.op-pm-byad-table-compact { width:100%; table-layout:auto; }
.op-pm-byad-table-compact td.op-pm-byad-c-action { max-width:none; width:24%; min-width:150px; }
.op-pm-byad-table-compact .op-pm-byad-c-name { max-width:260px; }
.op-pm-byad-table-compact td, .op-pm-byad-table-compact th { padding-left:8px; padding-right:8px; }

/* ── Paid Media · sub-nav (OPS-290 vertical rail, 2026-07-19; OPS-315
   converted to a horizontal tab row, 2026-07-27) ─────────────────────────
   Nav on top / active-tab panel full-width below, matching the shell's
   existing horizontal .account-tabs underline convention. Nav row scrolls
   horizontally on narrow screens rather than wrapping/overflowing. */
.op-pm-layers { display:flex; flex-direction:column; gap:14px; margin-top:4px; }
.op-pm-subnav { display:flex; gap:0; border-bottom:1.5px solid var(--border-soft); overflow-x:auto; white-space:nowrap; }
.op-pm-subnav-item { padding:10px 16px; font-size:13px; font-weight:500; color:var(--text-secondary); text-decoration:none;
  border-bottom:2px solid transparent; margin-bottom:-1.5px; flex:0 0 auto; transition:color .15s ease, border-color .15s ease; }
.op-pm-subnav-item:hover { color:var(--text-primary); }
.op-pm-subnav-item.active { color:var(--accent); border-bottom-color:var(--accent); font-weight:600; }
.op-pm-layer-panel { min-width:0; }

/* Brief · OPS-301 scoreboard-first redesign */

/* Vitals scoreboard (operational-pm-vitals.js): reuses the existing
   .op-pm-scoreboard grid (defined above, fold.js) unchanged. The structure-
   risk tile wraps a storycard in a plain link -- strip anchor defaults so it
   reads identically to the other (non-clickable) tiles beside it. */
.op-pm-vitals-section { margin:0 0 18px; }
.op-pm-vitals-link { display:block; color:inherit; text-decoration:none; }
.op-pm-vitals-link:hover .op-storycard { box-shadow:0 2px 6px rgba(26,43,44,.10); }

/* Context strip: frozen/review status + the 3 go-deeper links, replacing the
   old bare "Go deeper" row. */
.op-pm-brief-context { display:flex; gap:16px; align-items:baseline; flex-wrap:wrap;
  margin:0 0 18px; padding-bottom:14px; border-bottom:1px solid var(--border-soft); }
.op-pm-brief-context-status { font-size:13px; font-weight:600; color:var(--text-secondary,#5f5e5a); }
.op-pm-brief-context-links { display:flex; gap:16px; flex-wrap:wrap; }
.op-pm-brief-context-link { font-size:13px; font-weight:600; color:var(--accent); text-decoration:underline; text-underline-offset:2px; }

/* The call, on_track path: one plain line, no hero card. */
.op-pm-ontrack-line { font-size:15px; font-weight:600; color:var(--status-on-track, var(--nimble-teal,#004447)); margin:0 0 18px; }

/* ===== My Work, real comms_signal data (OPS-323) ===== */

/* Local-only banner. Deliberately the loudest thing on the screen after the H1:
   the verbs persist to localStorage, so a reload makes a local dismissal look
   durable unless the screen keeps saying otherwise. */
.op-localonly { border:1.5px solid #a32d2d; border-left-width:6px; border-radius:8px; background:rgba(163,45,45,0.08); padding:12px 16px; margin:0 0 16px; }
.op-localonly-title { font-size:14px; font-weight:600; color:#a32d2d; margin-bottom:4px; }
.op-localonly-body { font-size:13px; line-height:1.55; color:var(--text-secondary); }
.op-localonly-state { display:flex; align-items:center; gap:10px; flex-wrap:wrap; margin-top:10px; font-size:12.5px; color:#a32d2d; font-weight:600; }

/* The permanent unattributable counter. Not a callout that can be dismissed and
   not styled as an error: it is a standing backlog readout. */
.op-unattr { border:0.5px solid var(--border-strong); border-left:6px solid var(--nimble-orange); border-radius:8px; background:var(--bg-muted); padding:12px 16px; margin:0 0 18px; }
.op-unattr-head { display:flex; align-items:baseline; gap:9px; }
.op-unattr-mark { width:18px; height:18px; flex:0 0 18px; border-radius:50%; background:var(--nimble-orange); color:#fff; font-size:12px; font-weight:700; text-align:center; line-height:18px; }
.op-unattr-line { font-size:14px; }
.op-unattr-why { font-size:12.5px; line-height:1.55; color:var(--text-secondary); margin-top:6px; }
.op-unattr-det { margin-top:10px; font-size:12.5px; }
.op-unattr-det summary { cursor:pointer; color:var(--text-secondary); }
.op-unattr-names { display:flex; flex-wrap:wrap; gap:6px; margin:10px 0; }
.op-unattr-chip { font-size:11.5px; padding:3px 9px; border-radius:999px; background:var(--bg-surface); border:0.5px solid var(--border-soft); color:var(--text-secondary); }
.op-unattr-anon { color:var(--text-tertiary); margin-bottom:8px; }
.op-unattr-convs { margin:0; padding-left:18px; color:var(--text-secondary); line-height:1.6; }

/* A locally-touched card is visibly not-saved, and dismissed items land in
   .op-touched rather than disappearing. */
.op-item-local { border-color:#a32d2d; border-style:dashed; background:rgba(163,45,45,0.04); }
.op-badge-local { font-size:10.5px; font-weight:700; letter-spacing:0.04em; text-transform:uppercase; padding:2px 8px; border-radius:4px; background:#a32d2d; color:#fff; }
.op-badge-unknown { font-size:11px; font-weight:600; padding:2px 8px; border-radius:4px; background:var(--bg-muted); border:0.5px solid var(--border-strong); color:var(--text-secondary); margin-left:8px; }
.op-touched .op-group-label { color:#a32d2d; }
/* The unavailable state is neither a pass nor a failure: grey, and a question mark,
   so it cannot be skim-read as the green zero state. */
.op-unattr-mark.unknown { background:var(--text-tertiary); }

/* ===== OPS-323 My Work compression pass (2026-08-24) ==========================
   Collapsed card = two lines via native <details>. Lane heads become toggles.
   The op-item* classes above are UNTOUCHED: the fixture path in operational.js
   still renders them, and the changed-locally section reuses op-item-local. */
.op-sig { display:block; background:var(--bg-surface); border:0.5px solid var(--border-soft); border-radius:var(--radius-lg); margin-bottom:6px; overflow:hidden; }
.op-sig:hover { border-color:var(--border-strong); }
.op-sig-sum { display:flex; align-items:stretch; gap:0; cursor:pointer; list-style:none; padding:0; }
.op-sig-sum::-webkit-details-marker { display:none; }
.op-sig-stripe { width:4px; flex-shrink:0; background:var(--accent, #888); }
.op-sig-line { flex:1; min-width:0; padding:9px 14px; display:flex; flex-direction:column; gap:3px; }
.op-sig-title { font-size:14px; font-weight:500; line-height:1.35; }
.op-sig-sub { display:flex; align-items:center; flex-wrap:wrap; gap:8px; }
.op-sig-chip { font-size:11px; padding:1px 8px; border-radius:9px; background:var(--bg-muted); color:var(--text-secondary); border:0.5px solid var(--border-soft); white-space:nowrap; }
.op-sig-chip-await { color:var(--text-primary); font-weight:600; }
.op-sig-when { font-size:11.5px; color:var(--text-tertiary); }
.op-sig[open] { border-color:var(--border-strong); }
.op-sig[open] .op-sig-title { font-weight:600; }
.op-sig-body { padding:4px 14px 13px 18px; border-top:0.5px dashed var(--border-soft); }
.op-sig-body .op-why { margin-top:8px; }
.op-sig-body .op-meta { margin:10px 0 0; }
.op-sig-body .op-actions { margin-top:11px; }
/* the unknown chip shrank but stays on the collapsed card: honesty does not go behind a click */
.op-sig .op-badge-unknown { font-size:10px; padding:1px 7px; }

/* ===== topic repeats (2026-09-02) ============================================
   The repeat chip is amber and sits on the COLLAPSED card, beside the title, for
   the same reason the unknown chip does: "promised four times and still not done"
   is a finding, not a detail. The earlier mentions themselves are behind the
   expand, because those are the evidence, not the headline. */
.op-badge-repeat { font-size:10.5px; font-weight:700; letter-spacing:0.02em; padding:2px 8px; border-radius:999px; background:#d9822b; color:#fff; white-space:nowrap; }
.op-repeat-row { font-size:12px; color:var(--text-secondary); line-height:1.55; padding:2px 0 2px 10px; border-left:2px solid var(--border-soft); margin-top:4px; }
.op-repeat-basis { font-size:11.5px; color:var(--text-tertiary); margin-top:6px; font-style:italic; }

/* lane heads as toggles */
.op-group-toggle { width:100%; text-align:left; background:none; border:0; cursor:pointer; font:inherit; color:inherit; }
.op-group-toggle:hover .op-group-label { text-decoration:underline; }
.op-group-chev { width:14px; display:inline-block; color:var(--text-tertiary); font-size:11px; }
.op-group-closed { padding-bottom:2px; }
.op-group-closed .op-group-head { margin-bottom:0; }

/* the standing banner, one line + expand. Colour and border unchanged: still unmissable. */
.op-localonly-slim { padding:8px 14px; }
.op-localonly-slim summary { cursor:pointer; list-style:none; }
.op-localonly-slim summary::-webkit-details-marker { display:none; }
.op-localonly-slim summary::after { content:" · why?"; font-weight:400; font-size:12px; color:var(--text-tertiary); }
.op-localonly-slim details[open] summary::after { content:""; }
.op-localonly-slim .op-localonly-body { margin-top:6px; }