/* ─── HAND-MAINTAINED as of the Phase 3 CSS refactor (see docs/css-refactor-plan.md).
   This file was originally machine-generated, but chrome/annotation/badge type and
   color values below (divider headings, screen-id/desc, badges, component-spec,
   annotations, and Halyard's dialog transcript) were hand-edited to hold their
   correct final values directly, replacing screens-type.css's !important overrides
   (deleted; its job is done). If this file is ever regenerated, those hand-edited
   declarations must be re-applied — grep this repo's docs/css-refactor-plan.md
   Phase 3 for the full rule-by-rule mapping. ───────────────────────────────────── */
/* MERIDIAN palette (financial-print voice: hairlines, no shadows/radii, warm
   paper, one loud red for state). Consolidated 2026-08-07 - was a base blue/teal
   set overridden by a body.proj-meridian repalette; folded into this one block.
   Edit colours HERE. */
.wf-embed{--navy:#1B1A17;--teal:#1B1A17;--teal-light:#F1EEE7;--gold:#8A6A22;--gold-light:#F5F0E1;--green:#2F5D3A;--green-light:#EDF1EA;--red:#9C2B1B;--red-light:#F7EAE6;--slate:#4A463F;--slate-light:#F7F5F0;--stone:#7C776E;--rule:#D6D1C6;--wf-border:#C9C3B6;--white:#FDFCF9;--black:#1B1A17;--page-bg:#ECEAE3;--wf-bg:#F7F5F0;--cream:#F7F5F0;--sand:#F1EEE7;--accent:#1B1A17;--accent2:#8A6A22;--bg-hero:#1B1A17;--annotation:#E84855;--anno-bg:var(--white);--mono:'DM Mono', ui-monospace, monospace;--sans:'Libre Franklin', system-ui, sans-serif;font-family:var(--sans);background:var(--page-bg);color:var(--black);font-size:13px;line-height:1.5;scroll-behavior:smooth}
@scope (.wf-embed){.pf-nav-link.active{color:#E8E6F0;background:rgba(157,143,224,0.12)}
*{box-sizing:border-box;margin:0;padding:0}
.snav-item.current{color:var(--gold);border-bottom-color:var(--gold)}
.wf-section{background:var(--paper)}
*{box-sizing:border-box;margin:0;padding:0}
.cover-index-item.active{background:rgba(10,126,140,0.2);color:var(--white);border-top-color:var(--teal)}
.cover-index-item.active .num{color:var(--teal)}
.wf-frame{width:1280px;background:var(--wf-bg);border:1.5px solid var(--wf-border);border-radius:4px;overflow:hidden;position:relative;margin-bottom:32px}
.browser-bar{background:#E8EAED;border-bottom:1px solid #C8CDD6;padding:8px 12px;display:flex;align-items:center;gap:10px}
.browser-dots{display:flex;gap:5px}
.browser-dots span{width:10px;height:10px;border-radius:50%}
.browser-dots .d1{background:#FF5F57}
.browser-dots .d2{background:#FFBD2E}
.browser-dots .d3{background:#28C840}
.browser-url{flex:1;background:var(--white);border:1px solid #C8CDD6;border-radius:12px;padding:3px 12px;font-family:var(--mono);font-size:10px;color:var(--slate);max-width:400px}
.app-shell{display:flex;min-height:640px}
.sidebar{width:200px;background:var(--navy);flex-shrink:0;display:flex;flex-direction:column;padding:0}
.sidebar-logo{padding:18px 20px 14px;border-bottom:1px solid rgba(255,255,255,0.08);display:flex;align-items:center;gap:8px}
.sidebar-logo-mark{width:24px;height:24px;background:var(--teal);border-radius:4px;display:flex;align-items:center;justify-content:center;font-family:var(--mono);font-size:10px;font-weight:700;color:var(--white)}
.sidebar-logo-text{font-size:13px;font-weight:700;color:var(--white);letter-spacing:0.04em}
.sidebar-nav{padding:8px 0;flex:1}
.nav-section-label{font-family:var(--mono);font-size:9px;letter-spacing:0.12em;text-transform:uppercase;color:rgba(255,255,255,0.25);padding:12px 20px 4px}
.nav-item{display:flex;align-items:center;gap:9px;padding:8px 20px;font-size:12px;color:rgba(255,255,255,0.55);cursor:pointer;position:relative;transition:all 0.15s}
.nav-item:hover{color:rgba(255,255,255,0.9);background:rgba(255,255,255,0.05)}
.nav-item.active{color:var(--white);background:rgba(10,126,140,0.2)}
.nav-item.active::before{content:"";position:absolute;left:0;top:0;bottom:0;width:2px;background:var(--teal)}
.nav-icon{width:15px;height:15px;background:currentColor;border-radius:2px;opacity:0.7;flex-shrink:0}
.nav-icon.circle{border-radius:50%}
.nav-icon.rect-wide{width:18px;height:11px}
.nav-badge{margin-left:auto;background:var(--red);color:var(--white);font-family:var(--mono);font-size:9px;padding:1px 5px;border-radius:8px}
.sidebar-bottom{padding:12px 0;border-top:1px solid rgba(255,255,255,0.08)}
.user-chip{padding:8px 20px;display:flex;align-items:center;gap:9px}
.user-avatar{width:26px;height:26px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:10px;font-weight:700;color:var(--white);flex-shrink:0}
.user-info{min-width:0}
.user-name{font-size:11px;font-weight:600;color:var(--white);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.user-role{font-family:var(--mono);font-size:9px;color:rgba(255,255,255,0.35)}
.main-content{flex:1;display:flex;flex-direction:column;min-width:0;overflow:hidden}
.topbar{background:var(--white);border-bottom:1px solid var(--rule);padding:0 24px;height:48px;display:flex;align-items:center;justify-content:space-between;flex-shrink:0}
.topbar-breadcrumb{display:flex;align-items:center;gap:6px;font-size:12px;color:var(--slate)}
.topbar-breadcrumb .sep{opacity:0.4}
.topbar-breadcrumb .current{color:var(--navy);font-weight:600}
.topbar-actions{display:flex;align-items:center;gap:10px}
.topbar-sync{font-family:var(--mono);font-size:9px;color:var(--teal);padding:3px 8px;background:var(--teal-light);border-radius:2px;display:flex;align-items:center;gap:4px}
.topbar-sync::before{content:"●";font-size:8px;color:var(--teal)}
.icon-btn{width:28px;height:28px;border-radius:4px;background:var(--slate-light);border:1px solid var(--rule);display:flex;align-items:center;justify-content:center;cursor:pointer}
.icon-btn-dot{width:14px;height:14px;background:var(--slate);border-radius:2px;opacity:0.5}
.alert-bell{width:14px;height:14px;border-radius:50% 50%0 0;background:var(--slate);opacity:0.5;position:relative}
.notif-badge{width:8px;height:8px;background:var(--red);border-radius:50%;border:1.5px solid var(--white);position:absolute;top:-3px;right:-3px}
.page-body{flex:1;padding:20px 24px;overflow-y:auto;background:var(--slate-light)}
.page-heading{display:flex;align-items:flex-end;justify-content:space-between;margin-bottom:16px}
.page-heading h2{font-size:20px;font-weight:700;color:var(--navy)}
.page-heading .subtext{font-size:11px;color:var(--slate);margin-top:3px}
.btn{padding:7px 14px;border-radius:3px;font-size:12px;font-weight:600;cursor:pointer;border:none;display:inline-flex;align-items:center;gap:6px}
.btn-primary{background:var(--teal);color:var(--white)}
.btn-secondary{background:var(--white);color:var(--navy);border:1px solid var(--rule)}
.btn-ghost{background:transparent;color:var(--slate);border:1px solid var(--rule)}
.alert-rail{background:var(--red-light);border:1px solid #E8A8A4;border-left:3px solid var(--red);padding:10px 14px;display:flex;align-items:center;gap:12px;border-radius:3px;margin-bottom:16px}
.alert-rail .alert-dot{width:8px;height:8px;border-radius:50%;background:var(--red);flex-shrink:0}
.alert-rail .alert-text{font-size:12px;color:var(--black);flex:1}
.alert-rail .alert-text strong{color:var(--red)}
.alert-rail .alert-action{font-size:11px;font-weight:600;color:var(--red);cursor:pointer;white-space:nowrap}
.card-grid{display:grid;gap:12px}
.g2{grid-template-columns:1fr 1fr}
.g3{grid-template-columns:1fr 1fr 1fr}
.g4{grid-template-columns:repeat(4,1fr)}
.g-3-1{grid-template-columns:3fr 1fr}
.g-2-1{grid-template-columns:2fr 1fr}
.g-1-2{grid-template-columns:1fr 2fr}
.card{background:var(--white);border:1px solid var(--rule);border-radius:4px;padding:16px}
.card-label{font-family:var(--mono);font-size:9px;letter-spacing:0.12em;text-transform:uppercase;color:var(--slate);margin-bottom:8px}
.card-value{font-size:28px;font-weight:700;color:var(--navy);line-height:1;margin-bottom:4px}
.card-value.large{font-size:38px}
.card-value.medium{font-size:22px}
.card-sub{font-size:11px;color:var(--slate)}
.card-sub.positive{color:var(--green)}
.card-sub.negative{color:var(--red)}
.card-sub.warning{color:var(--gold)}
.card-title{font-size:13px;font-weight:700;color:var(--navy);margin-bottom:10px}
.freshness{display:inline-flex;align-items:center;gap:4px;font-family:var(--mono);font-size:9px;padding:2px 6px;border-radius:2px;margin-top:6px}
.freshness.live{background:var(--green-light);color:var(--green)}
.freshness.stale{background:var(--gold-light);color:var(--gold)}
.freshness::before{content:"●";font-size:7px}
.sparkline{height:36px;background:linear-gradient(180deg,transparent 0%,rgba(10,126,140,0.08) 100%);border-bottom:1.5px solid var(--teal);border-radius:2px;position:relative;overflow:hidden;margin-top:8px}
.sparkline::after{content:"";position:absolute;bottom:0;left:0;right:0;height:70%;background:url(data:image/svg+xml,%3Csvg\ viewBox=\'0\ 0\ 200\ 40\'\ xmlns=\'http://www.w3.org/2000/svg\'%3E%3Cpolyline\ points=\'0,35\ 25,28\ 50,30\ 75,22\ 100,25\ 125,18\ 150,20\ 175,12\ 200,8\'\ fill=\'none\'\ stroke=\'%230A7E8C\'\ stroke-width=\'1.5\'/%3E%3C/svg%3E)no-repeat bottom/100%auto}
.mini-bars{display:flex;align-items:flex-end;gap:3px;height:40px;margin-top:8px}
.mini-bar{flex:1;border-radius:2px 2px 0 0;min-height:4px}
.entity-list{display:flex;flex-direction:column;gap:1px}
.entity-row{display:flex;align-items:center;padding:9px 12px;background:var(--slate-light);border-radius:2px;gap:10px}
.entity-row:hover{background:var(--teal-light);cursor:pointer}
.entity-dot{width:8px;height:8px;border-radius:50%;flex-shrink:0}
.entity-name{font-size:12px;font-weight:600;color:var(--navy);flex:1}
.entity-value{font-size:13px;font-weight:700;color:var(--navy);font-family:var(--mono)}
.entity-delta{font-size:10px;font-family:var(--mono)}
.entity-delta.up{color:var(--green)}
.entity-delta.down{color:var(--red)}
.entity-bar-wrap{width:80px;height:4px;background:var(--rule);border-radius:2px;overflow:hidden}
.entity-bar{height:100%;border-radius:2px}
.status-pill{display:inline-flex;align-items:center;gap:4px;padding:3px 8px;border-radius:12px;font-family:var(--mono);font-size:9px;font-weight:600;letter-spacing:0.06em;text-transform:uppercase}
.status-pill::before{content:"●";font-size:7px}
.pill-green{background:var(--green-light);color:var(--green)}
.pill-amber{background:var(--gold-light);color:var(--gold)}
.pill-red{background:var(--red-light);color:var(--red)}
.data-table{width:100%;border-collapse:collapse}
.data-table th{background:var(--navy);color:var(--white);font-family:var(--mono);font-size:9px;letter-spacing:0.1em;text-transform:uppercase;padding:8px 12px;text-align:left;font-weight:600}
.data-table th.right{text-align:right}
.data-table td{padding:8px 12px;font-size:12px;border-bottom:1px solid var(--rule);color:var(--black)}
.data-table td.mono{font-family:var(--mono);font-size:11px}
.data-table td.right{text-align:right}
.data-table tr:nth-child(even) td{background:var(--slate-light)}
.data-table tr:hover td{background:var(--teal-light);cursor:pointer}
.data-table .row-action{color:var(--teal);font-weight:600;cursor:pointer}
.form-group{margin-bottom:14px}
.form-label{display:block;font-family:var(--mono);font-size:10px;letter-spacing:0.1em;text-transform:uppercase;color:var(--slate);margin-bottom:5px}
.form-label .required{color:var(--red);margin-left:2px}
.form-input{width:100%;background:var(--white);border:1px solid var(--rule);border-radius:3px;padding:8px 10px;font-size:12px;color:var(--navy);font-family:var(--sans)}
.form-input:focus{outline:none;border-color:var(--teal);box-shadow:0 0 0 3px rgba(10,126,140,0.1)}
.form-input.filled{background:var(--slate-light)}
.form-input.error{border-color:var(--red);background:var(--red-light)}
.form-hint{font-size:10px;color:var(--slate);margin-top:4px}
.validation-block{border:1px solid var(--rule);border-radius:3px;overflow:hidden;margin-top:12px}
.validation-header{background:var(--navy);padding:8px 12px;font-family:var(--mono);font-size:10px;color:var(--white);letter-spacing:0.1em;text-transform:uppercase}
.validation-row{display:flex;align-items:center;gap:10px;padding:8px 12px;border-bottom:1px solid var(--rule);font-size:12px}
.validation-row:last-child{border-bottom:none}
.v-icon{width:14px;height:14px;border-radius:50%;flex-shrink:0;display:flex;align-items:center;justify-content:center;font-size:8px;font-weight:700}
.v-pass{background:var(--green);color:var(--white)}
.v-fail{background:var(--red);color:var(--white)}
.v-warn{background:var(--gold);color:var(--white)}
.v-label{flex:1;color:var(--black)}
.v-detail{font-family:var(--mono);font-size:10px;color:var(--slate)}
.approval-chain{display:flex;flex-direction:column;gap:0}
.approval-step{display:flex;align-items:flex-start;gap:12px;padding:12px 0;position:relative}
.approval-step:not(:last-child)::after{content:"";position:absolute;left:11px;top:36px;bottom:0;width:2px;background:var(--rule)}
.approval-step.complete::after{background:var(--green)}
.step-dot{width:24px;height:24px;border-radius:50%;flex-shrink:0;display:flex;align-items:center;justify-content:center;font-size:10px;font-weight:700;border:2px solid var(--rule);background:var(--white);color:var(--slate);z-index:1}
.step-dot.complete{background:var(--green);border-color:var(--green);color:var(--white)}
.step-dot.active{background:var(--gold-light);border-color:var(--gold);color:var(--gold)}
.step-dot.pending{background:var(--white);border-color:var(--rule);color:var(--rule)}
.step-info{flex:1}
.step-role{font-size:11px;font-family:var(--mono);color:var(--slate);text-transform:uppercase;letter-spacing:0.08em}
.step-name{font-size:13px;font-weight:600;color:var(--navy)}
.step-time{font-size:10px;color:var(--slate);margin-top:2px}
.step-time.approved{color:var(--green)}
.step-time.pending{color:var(--gold)}
.covenant-gauge{position:relative;margin:12px 0}
.gauge-track{height:8px;background:var(--rule);border-radius:4px;overflow:hidden}
.gauge-fill{height:100%;border-radius:4px;transition:width 0.3s}
.gauge-fill.green{background:var(--green)}
.gauge-fill.amber{background:var(--gold)}
.gauge-fill.red{background:var(--red)}
.gauge-labels{display:flex;justify-content:space-between;margin-top:4px;font-family:var(--mono);font-size:9px;color:var(--slate)}
.forecast-grid{width:100%;border-collapse:collapse;font-size:11px}
.forecast-grid th{padding:6px 8px;background:var(--navy);color:rgba(255,255,255,0.7);font-family:var(--mono);font-size:9px;text-align:right;border-right:1px solid rgba(255,255,255,0.08);font-weight:500}
.forecast-grid th.label{text-align:left;min-width:140px}
.forecast-grid th.current{color:var(--white);background:rgba(10,126,140,0.4)}
.forecast-grid td{padding:6px 8px;text-align:right;border-bottom:1px solid var(--rule);border-right:1px solid var(--rule);font-family:var(--mono);color:var(--navy)}
.forecast-grid td.label{text-align:left;font-family:var(--sans);color:var(--black);font-size:12px;font-weight:500}
.forecast-grid td.section-header{background:var(--slate-light);font-family:var(--mono);font-size:9px;text-transform:uppercase;letter-spacing:0.1em;color:var(--slate);font-weight:700;text-align:left;border-top:2px solid var(--rule)}
.forecast-grid td.positive{color:var(--green)}
.forecast-grid td.negative{color:var(--red)}
.forecast-grid td.stale{background:var(--gold-light)}
.forecast-grid td.current-col{background:rgba(10,126,140,0.05)}
.forecast-grid tr.total-row td{font-weight:700;background:var(--navy);color:var(--white);font-size:12px}
.sla-timer{display:inline-flex;align-items:center;gap:5px;font-family:var(--mono);font-size:10px;padding:3px 8px;border-radius:2px}
.sla-warn{background:var(--gold-light);color:var(--gold)}
.sla-crit{background:var(--red-light);color:var(--red)}
.tabs{display:flex;border-bottom:2px solid var(--rule);margin-bottom:16px;gap:0}
.tab{padding:8px 16px;font-size:12px;font-weight:600;color:var(--slate);cursor:pointer;border-bottom:2px solid transparent;margin-bottom:-2px}
.tab.active{color:var(--teal);border-bottom-color:var(--teal)}
.annotation-notes{font-family:var(--anno-type);margin-top:24px;background:var(--paper-2);border-radius:3px;padding:16px 20px}
.annotation-notes h4{font-family:var(--anno-type);font-size:10px;text-transform:uppercase;margin-bottom:12px}
.anno-list{display:flex;flex-direction:column;gap:8px}
.anno-item{display:flex;align-items:flex-start;gap:10px}
.anno-num{min-width:18px;height:18px;border-radius:50%;font-size:9px;font-weight:700;font-family:var(--anno-type);display:flex;align-items:center;justify-content:center;flex-shrink:0;margin-top:1px}
.anno-text{font-size:12px;color:var(--ink);line-height:1.55}
.anno-text strong{color:var(--ink);font-weight:700}
.anno-text .state-ref{font-family:var(--anno-type);font-size:10px;background:var(--paper);color:var(--mid);border:1px solid var(--line);padding:1px 5px;border-radius:2px}
.anno-text .flow-ref{font-family:var(--anno-type);font-size:10px;background:var(--paper);color:var(--mid);border:1px solid var(--line);padding:1px 5px;border-radius:2px}
.anno-text .ia-ref{font-family:var(--anno-type);font-size:10px;background:var(--paper);color:var(--mid);border:1px solid var(--line);padding:1px 5px;border-radius:2px}
.responsive-notes{margin-top:16px;display:grid;grid-template-columns:repeat(3,1fr);gap:8px}
.resp-card{padding:12px 14px;background:var(--paper);border:1px solid var(--line);border-radius:2px}
.resp-card h5{font-family:var(--site-mono);font-size:9px;letter-spacing:0.1em;text-transform:uppercase;color:var(--ink);margin-bottom:6px}
.resp-card ul{padding-left:12px}
.resp-card li{font-family:var(--body);font-size:11px;color:var(--mid);line-height:1.6}
.component-spec{margin-top:16px;border:1px solid var(--line);border-radius:3px;overflow:hidden}
.component-spec-header{background:var(--paper-2);padding:8px 14px;font-family:var(--site-mono);font-size:10px;color:var(--mid);letter-spacing:0.1em;text-transform:uppercase;border-bottom:1px solid var(--line)}
.spec-row{display:flex;border-bottom:1px solid var(--line);font-size:12px}
.spec-row:last-child{border-bottom:none}
.spec-key{width:160px;padding:8px 14px;font-weight:600;color:var(--mid);background:var(--paper-2);border-right:1px solid var(--line);flex-shrink:0;font-size:11px}
.spec-val{padding:8px 14px;color:var(--ink);line-height:1.5}
.spec-val code{font-family:var(--site-mono);font-size:10px;background:var(--paper-2);color:var(--mid);padding:1px 5px;border-radius:2px}
.c-c3b77f{background:var(--navy)}
.c-c451fd{position:relative}
.c-8b6852{font-size:11px}
.c-9c6869{display:flex;gap:8px}
.c-fa3e1c{margin-bottom:12px}
.c-f710ab{border-top:3px solid var(--teal);grid-column:span 2}
.c-ee7752{height:40%;background:var(--teal-light);border:1px solid var(--teal)}
.c-a6548b{height:65%;background:var(--teal)}
.c-246ef0{height:50%;background:var(--teal-light);border:1px solid var(--teal)}
.c-c502d6{height:80%;background:var(--teal)}
.c-9b5568{height:45%;background:var(--teal-light);border:1px solid var(--teal)}
.c-d88a25{height:90%;background:var(--teal)}
.c-6acc0d{height:60%;background:var(--teal)}
.c-e09362{color:var(--red)}
.c-fa8e24{height:60%;background:var(--red-light);border:1px solid var(--red)}
.c-9247ef{height:45%;background:var(--red-light);border:1px solid var(--red)}
.c-812ccf{height:70%;background:var(--red)}
.c-739f21{height:35%;background:var(--red-light);border:1px solid var(--red)}
.c-d1986b{height:80%;background:var(--red)}
.c-d3bd2f{height:50%;background:var(--red-light);border:1px solid var(--red)}
.c-a1c2f5{height:40%;background:var(--red-light);border:1px solid var(--red)}
.c-d0d42c{background:#1A5276}
.c-aea753{width:80%;background:#1A5276}
.c-208cea{background:var(--teal)}
.c-48ee7b{width:32%;background:var(--teal)}
.c-d8d566{background:var(--gold)}
.c-27826e{width:22%;background:var(--gold)}
.c-d86041{background:var(--slate)}
.c-19e637{width:9%;background:var(--slate)}
.c-553a64{margin-top:14px}
.c-9796dd{display:flex;justify-content:space-between;font-size:10px;color:var(--slate);font-family:var(--mono);margin-top:4px}
.c-bbc017{display:flex;flex-direction:column;gap:12px}
.c-e77389{border-top:3px solid var(--gold)}
.c-905cf6{display:flex;flex-direction:column;gap:8px;margin-top:4px}
.c-a45b11{display:flex;justify-content:space-between;font-size:11px;margin-bottom:4px}
.c-932b7b{font-weight:600;color:var(--navy)}
.c-b60a0b{font-family:var(--mono);color:var(--gold);font-size:10px}
.c-e65692{width:91%}
.c-793659{color:var(--gold)}
.c-17a66b{font-family:var(--mono);color:var(--green);font-size:10px}
.c-6d5673{width:100%}
.c-4bfd80{color:var(--green)}
.c-518cc7{width:60%}
.c-0e3c26{margin-top:10px;font-size:10px;color:var(--slate);font-family:var(--mono)}
.c-85d970{border-top:3px solid var(--red)}
.c-342cda{margin-top:10px;display:flex;flex-direction:column;gap:4px}
.c-760ae8{display:flex;justify-content:space-between;font-size:11px;padding:6px 8px;background:var(--red-light);border-radius:2px}
.c-e634e6{font-weight:600}
.c-1e733f{display:flex;justify-content:space-between;font-size:11px;padding:6px 8px;background:var(--gold-light);border-radius:2px}
.c-b3fefb{width:100%;margin-top:10px;font-size:11px;justify-content:center}
.c-fa8ecc{border-top:3px solid var(--teal)}
.c-4bb5d7{font-family:var(--mono);font-size:10px}
.c-3503ba{display:flex;flex-direction:column;gap:6px}
.c-65dfcb{padding:8px;background:var(--red-light);border-left:3px solid var(--red);border-radius:2px;font-size:11px}
.c-821f5f{display:flex;justify-content:space-between;margin-bottom:3px}
.c-6ccd80{font-family:var(--mono)}
.c-6c21bc{color:var(--slate)}
.c-a18ac8{margin-top:4px}
.c-a7accd{padding:8px;background:var(--slate-light);border-radius:2px;font-size:11px}
.c-5559f1{font-family:var(--mono);color:var(--green)}
.c-80fd57{background:var(--gold)}
.c-faaa79{display:flex;gap:8px;align-items:center}
.c-2784b3{font-size:11px;color:var(--slate)}
.c-08f249{padding:0;overflow:auto;margin-bottom:12px}
.c-a1ab12{color:rgba(255,255,255,0.4);font-size:8px}
.c-d7f28c{color:rgba(0,0,0,0.3)}
.c-f4fbf6{background:#EEF9F0;border:1px solid var(--green);font-weight:700}
.c-948945{color:#FFAAAA}
.c-4703ee{font-weight:700;color:var(--teal)}
.c-d5f7cc{color:var(--teal);font-weight:700}
.c-9b3c76{color:var(--gold);font-weight:700}
.c-4e0609{display:flex;flex-direction:column;gap:6px;margin-top:4px}
.c-9a5cbb{padding:8px;background:var(--gold-light);border-left:3px solid var(--gold);border-radius:2px;font-size:11px}
.c-0a197f{font-weight:700;color:var(--navy);margin-bottom:2px}
.c-159386{font-size:10px;margin-top:6px;padding:4px 8px}
.c-5e482e{color:var(--teal);font-weight:600}
.c-510ea6{display:flex;justify-content:space-between;align-items:center}
.c-1386d5{margin:0}
.c-e3c362{gap:8px;margin-bottom:14px}
.c-e7ec54{margin-bottom:0}
.c-4e38c8{font-family:var(--mono);font-weight:700}
.c-8919ee{color:var(--teal)}
.c-5b5703{border-top:3px solid var(--slate)}
.c-829da7{font-size:11px;color:var(--slate);margin-bottom:12px}
.c-2ef174{color:var(--rule)}
.c-5a0488{background:var(--slate-light);padding:8px;border-radius:2px;font-size:11px;color:var(--slate);margin-top:8px}
.c-df8892{width:100%;justify-content:center;font-size:13px;padding:12px}
.c-80ac72{font-size:10px;color:var(--slate);text-align:center}
.c-7f18f5{display:flex;gap:40px;align-items:flex-start;flex-wrap:wrap}
.c-5cd105{flex-shrink:0}
.c-5f5dfe{width:320px;background:transparent;border-radius:0;padding:0}
.c-3fff8e{background:#000;border-radius:0;overflow:hidden}
.c-03f646{background:var(--navy);padding:12px 20px 0}
.c-2723fb{display:flex;justify-content:space-between;font-size:10px;color:rgba(255,255,255,0.5);font-family:var(--mono);padding-bottom:8px}
.c-cc3f5e{background:rgba(255,255,255,0.05);border-radius:8px;padding:8px 12px;margin-bottom:10px;display:flex;align-items:center;gap:8px}
.c-571fb9{font-size:11px;color:rgba(255,255,255,0.5)}
.c-cd085a{font-size:11px;color:var(--white);font-weight:600;flex:1}
.c-b487c0{width:22px;height:22px;background:var(--navy);font-size:9px}
.c-01fada{background:var(--slate-light);padding:14px;min-height:540px}
.c-5194e9{background:var(--red-light);border:1px solid var(--red);border-radius:6px;padding:8px 12px;display:flex;align-items:center;gap:8px;margin-bottom:12px}
.c-a915d0{width:8px;height:8px;border-radius:50%;background:var(--red);flex-shrink:0}
.c-0e3c24{font-size:11px;color:var(--red);font-weight:700;flex:1}
.c-b0e060{font-family:var(--mono);font-size:10px;color:var(--red)}
.c-c7fee5{background:var(--white);border-radius:6px;padding:14px;margin-bottom:10px;border:1px solid var(--rule)}
.c-daee39{font-family:var(--mono);font-size:9px;color:var(--slate);letter-spacing:0.1em;text-transform:uppercase;margin-bottom:8px}
.c-9afbc4{font-size:28px;font-weight:700;color:var(--navy);margin-bottom:4px}
.c-f543b2{font-size:12px;color:var(--slate)}
.c-ee3c1b{font-size:11px;color:var(--slate);margin-top:2px}
.c-c36c0a{margin-top:10px;padding-top:10px;border-top:1px solid var(--rule)}
.c-9a3844{display:flex;justify-content:space-between;font-size:11px;margin-bottom:5px}
.c-b2691c{font-family:var(--mono);font-size:10px;color:var(--navy)}
.c-526f94{display:flex;justify-content:space-between;font-size:11px}
.c-211de5{background:var(--white);border-radius:6px;padding:12px;margin-bottom:10px;border:1px solid var(--rule)}
.c-433137{font-size:11px;font-weight:700;color:var(--navy);margin-bottom:8px}
.c-aa5bec{display:flex;align-items:center;gap:8px;margin-bottom:6px}
.c-dcdc4f{width:20px;height:20px;font-size:8px}
.c-8938fc{font-size:11px;font-weight:600;color:var(--navy)}
.c-df6780{font-size:10px;color:var(--green)}
.c-2a9780{display:flex;align-items:center;gap:8px}
.c-16ba10{font-size:11px;font-weight:600;color:var(--gold)}
.c-e80e64{font-size:10px;color:var(--gold)}
.c-0b9e96{background:var(--green-light);border:1px solid var(--green);border-radius:6px;padding:8px 12px;margin-bottom:12px;display:flex;align-items:center;gap:8px}
.c-8e6872{color:var(--green);font-size:13px;font-weight:700}
.c-a556bc{font-size:11px;color:var(--green);font-weight:600}
.c-535c02{width:100%;padding:14px;background:var(--teal);color:var(--white);border:none;border-radius:6px;font-size:14px;font-weight:700;margin-bottom:8px;cursor:pointer}
.c-59f5b0{width:100%;padding:12px;background:var(--white);color:var(--red);border:1px solid var(--red);border-radius:6px;font-size:13px;font-weight:600;cursor:pointer}
.c-e01db0{flex:1;min-width:300px}
.c-53896a{margin-top:0}
.c-b0043e{margin-top:16px}
.c-a12242{background:var(--green)}
.c-95ffec{background:var(--gold-light);border-color:#E8C87A;border-left-color:var(--gold)}
.c-ed14d6{color:var(--black)}
.c-8e8697{margin-bottom:16px}
.c-fbf92c{display:flex;justify-content:space-between;align-items:center;margin-bottom:8px}
.c-58cb42{display:flex;align-items:baseline;gap:6px;margin-bottom:4px}
.c-5594f2{display:flex;justify-content:space-between;font-size:11px;margin-top:8px}
.c-b7c7b3{color:var(--red);font-weight:700}
.c-619f8b{display:flex;justify-content:space-between;font-size:11px;margin-top:4px}
.c-b5ea72{color:var(--gold);font-family:var(--mono)}
.c-3aa131{color:var(--red);font-weight:600}
.c-2e9f42{margin-top:10px;border-bottom-color:var(--gold);background:linear-gradient(180deg,transparent,rgba(196,146,42,0.08))}
.c-5ffe6a{width:100%;justify-content:center;font-size:11px;margin-top:10px}
.c-f7cc10{border-top:3px solid var(--green)}
.c-ae7c8c{color:var(--green);font-weight:700}
.c-06b5d1{color:var(--green);font-family:var(--mono)}
.c-2f342b{color:var(--green);font-weight:600}
.c-5371db{margin-top:10px}
.c-ef9a4d{display:flex;gap:0;margin-top:8px}
.c-97e158{flex:1;padding:12px;background:var(--green-light);border-radius:3px 0 0 3px;border:1px solid var(--green);text-align:center}
.c-a18cd0{font-family:var(--mono);font-size:9px;color:var(--green);text-transform:uppercase;letter-spacing:0.1em;margin-bottom:4px}
.c-12ff87{font-size:13px;font-weight:700;color:var(--navy)}
.c-249e52{font-size:10px;color:var(--slate)}
.c-455bda{flex:1;padding:12px;background:var(--white);border:1px solid var(--rule);border-left:none;text-align:center}
.c-06cfd3{font-family:var(--mono);font-size:9px;color:var(--slate);text-transform:uppercase;letter-spacing:0.1em;margin-bottom:4px}
.c-84b0da{flex:1.5;padding:12px;background:var(--slate-light);border-radius:0 3px 3px 0;border:1px solid var(--rule);border-left:none;display:flex;align-items:center;justify-content:center}
.c-d1b3a7{font-size:11px;justify-content:center}
@media (max-width:760px){.screen-section{padding:16px 20px}
.screen-header{flex-wrap:wrap;row-gap:10px}
.topbar{flex-wrap:wrap;row-gap:10px}
.page-heading{flex-wrap:wrap;row-gap:10px}
.gauge-labels{flex-wrap:wrap;row-gap:10px}
.c-9796dd{flex-wrap:wrap;row-gap:10px}
.c-a45b11{flex-wrap:wrap;row-gap:10px}
.c-760ae8{flex-wrap:wrap;row-gap:10px}
.c-1e733f{flex-wrap:wrap;row-gap:10px}
.c-821f5f{flex-wrap:wrap;row-gap:10px}
.c-510ea6{flex-wrap:wrap;row-gap:10px}
.c-2723fb{flex-wrap:wrap;row-gap:10px}
.c-9a3844{flex-wrap:wrap;row-gap:10px}
.c-526f94{flex-wrap:wrap;row-gap:10px}
.c-fbf92c{flex-wrap:wrap;row-gap:10px}
.c-5594f2{flex-wrap:wrap;row-gap:10px}
.c-619f8b{flex-wrap:wrap;row-gap:10px}
table{display:block;overflow-x:auto;-webkit-overflow-scrolling:touch}
}
}

/* ─── the following migrated from revamp.css (Phase 4 completion, now that
   Phase 5's hashed-class retirement is done). Hand-owned like the rest of
   this file — see the header note about hand-maintenance from Phase 3. ─── */

/* MERIDIAN palette now lives in the .wf-embed token block at the top of this
   file (consolidated 2026-08-07). Only the non-token print treatment remains below. */
/* the print look is INSIDE the window — the window itself keeps the one
   shared drop shadow (see screens.css's "one staging treatment"), so the
   frame classes are excluded from this reset. Round UI atoms (traffic-light
   dots .d1/.d2/.d3, .notif-badge, .nav-badge, .alert-dot) are also excluded so
   they keep their intended radius — added 2026-08-06, they were being squared
   off (see the round-2 restores at the bottom of this file). */
body.proj-meridian .wf-embed *:not(.wf):not(.wf-frame):not(.phone-frame):not(.c-3fff8e):not(.c-01fada):not(.d1):not(.d2):not(.d3):not(.notif-badge):not(.nav-badge):not(.alert-dot):not(.user-avatar),
body.proj-meridian .wf-embed *::before,
body.proj-meridian .wf-embed *::after {
  box-shadow: none !important;
  border-radius: 0 !important;
  font-variant-numeric: tabular-nums;
}
body.proj-meridian .wf-embed .c-3fff8e {
  border-radius: 0 !important;
  overflow: hidden !important;
  box-shadow: 0 16px 36px -14px rgba(22,21,20,.22), 0 5px 14px -6px rgba(22,21,20,.12) !important;
}
body.proj-meridian .wf-embed .c-01fada {
  border-radius: 0 !important;
}
body.proj-meridian .wf-embed .card,
body.proj-meridian .wf-embed .panel { background: transparent !important; }
/* provenance marks — a dagger and a rule, the print convention for
   "this figure is estimated, not reconciled" (was a warning-triangle glyph) */
body.proj-meridian .prov-flag {
  font-family: var(--mono); font-size: .78em; font-weight: 500;
  color: #9C2B1B; padding-left: 2px; vertical-align: super; line-height: 0;
}
body.proj-meridian .wf-embed .stale,
body.proj-meridian .wf-embed td.stale {
  color: #6E6A62 !important;
  text-decoration: underline dotted #9C2B1B 1px;
  text-underline-offset: 3px;
}

/* ─── VISUAL REPAIR 2026-08-06 — real nav icons + rebuilt sparklines ─────────
   Targeted-repair pass, Meridian as the template for the other live-mockup
   projects. Lives in the per-project override tier (body.proj-meridian .wf-embed)
   so it out-specifies the scoped generated rules — see §3 of
   docs/screens-encapsulation-contract.md. The nav squares and empty sparkline
   divs were replaced with inline SVG in meridian.html + meridian-full.html
   (scratchpad/meridian_icons.py). Icons inherit the nav item's currentColor, so
   active/hover state colouring keeps working for free. Logo mark and the two
   topbar dots (bell / apps) are intentionally left for the next pass. */
body.proj-meridian .wf-embed .nav-icon,
body.proj-meridian .wf-embed .nav-icon.circle,
body.proj-meridian .wf-embed .nav-icon.rect-wide {
  width: 16px; height: 16px; background: none; border-radius: 0;
  opacity: 1; display: inline-flex; align-items: center; justify-content: center;
}
body.proj-meridian .wf-embed .nav-icon svg { width: 16px; height: 16px; display: block; }

/* Sparklines: the trend line is an ink hairline (financial-print voice); the
   one covenant heading toward a breach uses the reserved state-red plus a
   dashed limit line. --teal/--red resolve to the Meridian repalette above. */
body.proj-meridian .wf-embed .sparkline .spk-svg { display: block; width: 100%; height: 100%; }
body.proj-meridian .wf-embed .sparkline .spk {
  fill: none; stroke: var(--teal); stroke-width: 1.5;
  vector-effect: non-scaling-stroke; stroke-linecap: round; stroke-linejoin: round;
}
body.proj-meridian .wf-embed .sparkline.risk .spk { stroke: var(--red); }
body.proj-meridian .wf-embed .sparkline .spk-thresh {
  fill: none; stroke: var(--red); stroke-width: 1; stroke-dasharray: 3 3;
  vector-effect: non-scaling-stroke; opacity: .55;
}

/* ─── LOGO (added 2026-08-06, SVG supplied by Rod) — the real Meridian mark
   replaces the "M" badge in the sidebar. A logo is brand identity, so it keeps
   its own mint/teal colours (exempt from the financial-print monochrome). The
   mark becomes a transparent, aspect-preserving container; the dark sidebar
   (--navy) gives the mint enough contrast. Asset: assets/meridian-logo.svg. */
/* logo is now icon-only (wordmark removed from markup 2026-08-07) — centre the
   mark in the sidebar header. */
body.proj-meridian .wf-embed .sidebar-logo { justify-content: center; }
body.proj-meridian .wf-embed .sidebar-logo-mark {
  width: auto; height: 24px; background: none; border-radius: 0; overflow: visible;
  display: inline-flex; align-items: center; justify-content: center; flex-shrink: 0;
}
body.proj-meridian .wf-embed .sidebar-logo-img {
  height: 24px; width: auto; display: block;
}

/* ─── TOPBAR ICONS (2026-08-06) — bell (notifications) + search replace the two
   placeholder shapes. Muted --slate line-icons on the white topbar; the bell
   keeps its red .notif-badge overlay. */
body.proj-meridian .wf-embed .alert-bell {
  width: 16px; height: 16px; background: none; border-radius: 0; opacity: 1;
  position: relative; display: inline-flex; align-items: center; justify-content: center;
}
body.proj-meridian .wf-embed .icon-btn-dot {
  width: 16px; height: 16px; background: none; border-radius: 0; opacity: 1;
  display: inline-flex; align-items: center; justify-content: center;
}
body.proj-meridian .wf-embed .alert-bell svg,
body.proj-meridian .wf-embed .icon-btn-dot svg {
  width: 15px; height: 15px; display: block; stroke: var(--slate); fill: none;
}

/* ─── MINI-BAR POLISH (2026-08-06) — the two-tone bar chart pairs solid ink bars
   with light (--sand) bars, but on the warm page ground the light bars were
   near-invisible (~#F1EEE7 on ~#F6F4EF) so the chart read as broken. Ground the
   group on a hairline baseline and give every bar a 1px ink edge: solid bars are
   unchanged, light bars become clean hollow bars — a legible solid/hollow pair,
   on-language for the financial-print look. box-sizing:border-box (mockup reset)
   keeps the border from changing bar size. */
body.proj-meridian .wf-embed .mini-bars {
  border-bottom: 1px solid var(--rule); padding-bottom: 0;
}
/* Bar strokes removed (Rod 2026-08-07). The two near-cream "secondary" bar
   tones vanished against the warm page, which is why they'd been outlined;
   instead of a stroke, darken those tones to visible mid-values so every bar
   reads as a clean solid fill. Scoped to .mini-bar so the shared hashed
   classes aren't affected elsewhere; height still comes from each hashed class. */
body.proj-meridian .wf-embed .mini-bar.c-ee7752,
body.proj-meridian .wf-embed .mini-bar.c-246ef0,
body.proj-meridian .wf-embed .mini-bar.c-9b5568 { background: #B9B1A0 !important; border: none !important; }
body.proj-meridian .wf-embed .mini-bar.c-fa8e24,
body.proj-meridian .wf-embed .mini-bar.c-9247ef,
body.proj-meridian .wf-embed .mini-bar.c-739f21,
body.proj-meridian .wf-embed .mini-bar.c-d3bd2f,
body.proj-meridian .wf-embed .mini-bar.c-a1c2f5 { background: #D2A08F !important; border: none !important; }

/* ─── ROUND 2 (2026-08-06, from Rod's screenshot review) ─────────────────────
   Several fixes below undo casualties of this file's own `border-radius:0
   !important` repalette reset (the *:not(...) rule above), which squared off
   every dot/badge/traffic-light. Each restore needs !important + a more
   specific selector (body.proj-meridian .wf-embed .x = 0,3,1+) than the reset
   (0,2,1) to win. */

/* 1 · light-grey stroke on every screen frame (kept alongside the staging
   shadow from screens.css, which set border:none — overridden here). */
body.proj-meridian .wf-embed .wf-frame,
body.proj-meridian .wf-embed .wf {
  border: 1px solid var(--rule) !important;
}

/* 2 · wordmark set in the site's Newsreader serif instead of Libre Franklin. */
body.proj-meridian .wf-embed .sidebar-logo-text {
  font-family: 'Newsreader', Georgia, serif;
  font-weight: 500; font-size: 15px; letter-spacing: .01em;
}

/* 3 · sparklines: kill the original hardcoded-teal polyline (drawn by
   .sparkline::after) that was double-lining with the real SVG line added in
   round 1, and drop the teal/amber area tint. Keep a light baseline. */
body.proj-meridian .wf-embed .sparkline::after { content: none !important; }
body.proj-meridian .wf-embed .sparkline {
  background: none !important;
  border-bottom: 1px solid var(--rule) !important;
}

/* 4 · top icons stand on their own — remove the button box; the red alert
   notification dot goes back to a round dot. */
body.proj-meridian .wf-embed .icon-btn {
  background: none !important; border: none !important;
  width: auto; height: auto; padding: 0;
}
body.proj-meridian .wf-embed .notif-badge { border-radius: 50% !important; }

/* 5 · browser chrome: round traffic-light buttons (the URL field was removed
   from the markup). */
body.proj-meridian .wf-embed .browser-dots span { border-radius: 50% !important; }

/* 6 · anomaly band: the square before the text is now a warning icon. */
body.proj-meridian .wf-embed .alert-rail .alert-dot {
  width: 16px; height: 16px; background: none !important; flex-shrink: 0;
  display: inline-flex; align-items: center; justify-content: center;
}
body.proj-meridian .wf-embed .alert-rail .alert-dot svg {
  width: 16px; height: 16px; display: block; stroke: var(--red); fill: none;
}

/* 7 · the red count badge next to Payments back to a round pill. */
body.proj-meridian .wf-embed .nav-badge { border-radius: 999px !important; }

/* 8 · user avatars — round again (excluded from the radius reset above), and a
   hairline ring so they read as discs on the dark sidebar. Without it Maya
   Chen's avatar (fill = --navy/ink #1B1A17) is invisible against the same-ink
   sidebar; the ring reveals it and quietly unifies the gold/green ones too. On
   the light approval screen the ring just fades out — harmless. */
body.proj-meridian .wf-embed .user-avatar {
  border: 1px solid rgba(255,255,255,.22);
}