/* Palette refreshed v6.9.104 from the Claude Design handoff
   (design/handoff/administration-page-ui-improvements/). Value-only change —
   no token was renamed, added, or removed, so every rule in app.css keeps
   resolving exactly as before. Reviewed side-by-side first via
   design/build-preview.js before landing.

   Two deliberate carry-overs the design has no answer for:
   - --mvta-orange stays #ed7d31. The design has no orange at all, but
     .hero button/.primary still reads it. Left as-is rather than inventing
     a value; revisit if the Dashboard hero starts to clash.
   - --status-pending-* is mapped onto the warning ramp for the same reason,
     which makes "pending" and "warning" render identically (the Required vs
     Flagged missing-info badges are the visible case). Measured and accepted;
     restoring the orange values here is the one-line undo. */
:root {
  /* Greens and oranges are MVTA style-guide values. The previous --mvta-green
     #1f9d6c was on no palette AND failed contrast in every text role it held:
     3.44:1 as a link and as the primary button's white label, against a 4.5:1
     floor. Dark Green #00553D carries all of them at 8+:1.
     Dark theme cannot use it — #00553D on the dark surface is 1.76:1 — so dark
     takes Light Green #639281 (4.78:1 as text, 5.36:1 behind the button ink). */
  --mvta-green:#00553D; --mvta-green-dark:#173a2d; --mvta-green-deep:#0b1c15; --mvta-green-soft:rgba(0,85,61,0.10);
  --mvta-orange:#F78E1E; --mvta-orange-soft:#fff2e8; --bg:#f2f6f3; --surface:#ffffff; --surface-2:#f8faf8; --surface-3:#eef4f0;
  --text:#0e1e17; --muted:#4f6459; --border:rgba(13,35,26,0.10); --danger:#b3282e; --danger-soft:rgba(212,61,67,0.10);
  --success:#0b6b47; /* was #0f7a52: 4.32:1 on its own soft field over the
     page background. It measured 4.68:1 over a white card, which is how it
     passed inspection for so long — the failing case is the commoner one.
     The style guide has no success colour, so this ramp is semantic. */ --success-soft:rgba(31,157,108,0.12); --warning:#8a5407; --warning-soft:rgba(176,107,10,0.12);
  --shadow:0 12px 32px rgba(16,40,30,0.10); --shadow-lg:0 24px 60px rgba(16,40,30,0.10); --radius:14px; --sidebar:248px;

  /* accent aliases — generic names so components don't have to hardcode
     --mvta-green directly, matching the original design's accent/accent-
     hover/accent-soft/accent-text convention. Kept as aliases (not a
     redesign) so nothing already written against --mvta-green breaks.
     --accent-hover is now an explicit value rather than an alias of
     --mvta-green-dark: that token became the sidebar gradient's top stop
     (#173a2d), which is far too dark to read as a button hover. */
  --accent:var(--mvta-green); --accent-hover:#417B68; --accent-soft:var(--mvta-green-soft); --accent-text:#ffffff;
  /* Orange is a FILL only. White on Dark Orange is 2.37:1; dark ink is 7.27:1.
     Where orange must be text or a border on a light surface it has to be Burnt
     Orange instead — Dark Orange as text on white is 2.37:1. */
  --accent-on-orange:#0e1e17; --mvta-orange-ink:#C34B18;
  /* --accent-strong is the ONLY green that may sit under white text. Brand
     --mvta-green (#1f9d6c) against #fff measures 3.44:1, so every .primary
     button and the AI avatar failed the 4.5:1 floor app-wide. This is the
     brand green mixed 20% toward --mvta-green-deep: same hue, 4.72:1. Use
     --accent for surfaces, borders, and green-on-light text; use
     --accent-strong wherever --accent-text sits on top. */
  --accent-strong:#00553D;

  /* full status triads (bg/border/text), including draft/pending which
     v6 had no dedicated color for — draft uses a neutral gray, pending
     now follows the warning ramp (see the header note: the design has no
     orange to map it onto). */
  --status-draft-bg:#f8faf8; --status-draft-border:rgba(13,35,26,0.10); --status-draft-text:#84968c;
  --status-pending-bg:rgba(176,107,10,0.12); --status-pending-border:rgba(176,107,10,0.30); --status-pending-text:#b06b0a;
  --status-warning-bg:rgba(176,107,10,0.12); --status-warning-border:rgba(176,107,10,0.30); --status-warning-text:#b06b0a;
  --status-approved-bg:rgba(31,157,108,0.12); --status-approved-border:rgba(31,157,108,0.32); --status-approved-text:#1f9d6c;

  /* CONFIRMED BUG FIX — app.css references --brand/--brand-soft/
     --text-muted/--surface-muted/--surface-subtle across the pipeline
     stage rail, subtab active state, similarity score rings, QA avatars,
     QRG block selection, and badges, but none of these were ever defined
     here. An undefined custom property makes the whole declaration invalid
     at computed-value time, so every one of those rules was silently
     falling back to inherited/initial values (e.g. active subtabs and
     stage-rail progress not showing brand color at all). Aliased to the
     equivalent tokens that already exist, not a new color scheme. */
  --brand:var(--mvta-green); --brand-soft:var(--mvta-green-soft);
  --text-muted:var(--muted); --surface-muted:var(--surface-2); --surface-subtle:var(--surface-2);

  /* Drag-and-drop insertion indicator (QRG block reorder). Aliased to --accent
     rather than hardcoded: --mvta-green IS overridden in the dark block
     (#1f9d6c → #2ecf8a), so this resolves to a legible line in both themes
     with no separate dark override. Semantic name kept so the indicator can be
     tuned independently of the brand accent later without hunting call sites.
     NOTE: canvas-internal affordances do NOT use this — #qrg-canvas is always
     white in both themes, so those hardcode their color instead. */
  --drop-line:var(--accent);
  /* Dedicated document-preview tokens keep the print-like QRG canvas stable
     while making its palette explicit and auditable. */
  --qrg-paper:#ffffff; --qrg-ink:#333333; --qrg-green:#1b4d3e; --qrg-green-2:#2d6a4f;
  --qrg-muted:#666666; --qrg-info:#f0f7f5; --qrg-warning:#fffbea; --qrg-danger:#fdecea;

  /* Warning ramp, MVTA style guide. The --status-warning-* values above are an
     amber that appears on no MVTA palette, and body copy on its own 12% field
     measures 3.66:1 — under the 4.5:1 floor. A warmer tint cannot rescue it:
     Burnt Orange holds 4.5:1 only to about 4% opacity, which is invisible. So
     the colour moved off the field and into the icon, rule and lead.
     Gating   Burnt Orange on white ....... 4.84:1
     Advisory Dark Green on Icy Gray ...... 7.02:1 */
  --warn-gate-ink:#C34B18; --warn-gate-line:rgba(195,75,24,.38); --warn-gate-soft:rgba(195,75,24,.10);
  --warn-adv-field:#E5E5E1; --warn-adv-line:rgba(0,85,61,.18); --warn-adv-ink:#00553D; --warn-adv-soft:rgba(0,85,61,.10);
  /* Indeterminate progress. Dark Green would measure 1.76:1 on the dark track,
     so the dark theme takes Light Green instead — see the override below. */
  --run-ink:#00553D; --run-track:#E5E5E1; --run-soft:rgba(0,85,61,.12);
  /* The warning glyph, same 24-grid and 2.6 stroke as statusMarkSvg() in utils.js. */
  --alert-icon-danger:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M8.2 8.2l7.6 7.6M15.8 8.2l-7.6 7.6' fill='none' stroke='%23000' stroke-width='2.6' stroke-linecap='round'/%3E%3C/svg%3E");
  --alert-icon-success:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M4.5 12.5l5 5 10-11' fill='none' stroke='%23000' stroke-width='2.6' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
  --alert-icon-info:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Ccircle cx='12' cy='6.2' r='1.5' fill='%23000'/%3E%3Cpath d='M12 10.6v7.2' fill='none' stroke='%23000' stroke-width='2.6' stroke-linecap='round'/%3E%3C/svg%3E");
  /* The hero gradient's far stop. It cannot simply be --mvta-green: in dark that
     is Light Green, and the hero's white copy would sit at 2.99:1 on it. */
  --hero-to:var(--mvta-green);
  /* Governed status colours, MVTA-STY-001. The semantic ramp above
     (--danger #b3282e, --success #0b6b47, --warning #8a5407) appears on no MVTA
     palette; the note on --success says as much. These are the values the App
     already emits into finished documents, so operators read them daily:
       Never-Do Dark Red / Red Light .... §15.5.2, the QRG "Never Do" pair
       Warning field / Marker Amber ..... §15.5.2 warning callout, §2.6 markers
       Dark Teal / Teal Light ........... §15.5.2 data-grid cells
       Medium Teal ...................... §15.5.2 sub-headers
     Added ALONGSIDE the existing ramp, not over it — adopting them is per
     component, so nothing outside the screens that opt in can shift. Retiring
     --danger/--success onto these app-wide is a separate pass with its own
     contrast review (#7B1D1D on the dark surface is 1.5:1 and needs its own
     dark value, supplied below).
     Marker Amber is a FILL AND RULE ONLY: as text on white it measures 2.03:1.
     Every ink value here clears 4.5:1 on the field it is paired with. */
  --gov-red:#7B1D1D; --gov-red-field:#FDECEA;          /* ink on field 9.02:1 */
  --gov-amber-rule:#F5A623; --gov-amber-field:#FFFBEA; /* never ink */
  --gov-amber-ink:var(--warn-gate-ink);                /* #C34B18 on field 4.66:1 */
  --gov-teal:#1B4D3E; --gov-teal-field:#E8F4F0;        /* ink on field 8.55:1 */
  --gov-teal-mid:#2D6A4F;                              /* on page 5.86:1 */

  --warn-icon:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 6.5v7.2' fill='none' stroke='%23000' stroke-width='2.6' stroke-linecap='round'/%3E%3Ccircle cx='12' cy='18' r='1.5' fill='%23000'/%3E%3C/svg%3E");

}
/* Dark theme inverts the soft fill: it RECESSES rather than lifts. Brand
   Light Green is 4.78:1 on the bare dark surface, so any same-hue wash
   behind it drops below the 4.5:1 floor (a 0.18 green tint measured
   3.72:1). A deep green-black lifts the label back to 4.89:1 on surface
   and 5.12:1 on the page, and keeps the hue that plain black would lose. */
html[data-theme="dark"]{--bg:#0a1512;--surface:#122019;--surface-2:#0e1b16;--surface-3:#152720;--text:#f1f5f2;--muted:#9fb4a9;--border:rgba(255,255,255,0.09);--shadow:0 12px 32px rgba(0,0,0,0.35);--shadow-lg:0 24px 60px rgba(0,0,0,0.35);--mvta-green:#639281;--mvta-green-soft:rgba(0,30,21,0.55);--hero-to:#417B68;--danger:#ff7a7e;--danger-soft:rgba(255,122,126,0.13);--success:#2ecf8a;--success-soft:rgba(46,207,138,0.16);--warning:#f3ab5c;--warning-soft:rgba(243,171,92,0.15);
  --accent-hover:#7FA894; --accent-text:#04140d; --accent-on-orange:#0e1e17; --mvta-orange-ink:#FAAD60;
  /* Dark theme inverts the pairing: the bright green carries dark ink, so the
     brand green itself is already safe under --accent-text. */
  --accent-strong:var(--mvta-green);
  --status-draft-bg:#0e1b16; --status-draft-border:rgba(255,255,255,0.09); --status-draft-text:#698074;
  --status-pending-bg:rgba(243,171,92,0.15); --status-pending-border:rgba(243,171,92,0.35); --status-pending-text:#f3ab5c;
  --status-warning-bg:rgba(243,171,92,0.15); --status-warning-border:rgba(243,171,92,0.35); --status-warning-text:#f3ab5c;
  --status-approved-bg:rgba(46,207,138,0.16); --status-approved-border:rgba(46,207,138,0.38); --status-approved-text:#2ecf8a;
--warn-gate-ink:#FAAD60;--warn-gate-line:rgba(250,173,96,.42);--warn-gate-soft:rgba(250,173,96,.14);--warn-adv-field:var(--surface-2);--warn-adv-line:var(--border);--warn-adv-ink:var(--text);--warn-adv-soft:rgba(250,173,96,.14);--run-ink:#639281;--run-track:#152720;--run-soft:rgba(99,146,129,.18);
  /* The governed values are print colours picked for white paper and cannot be
     reused here: #7B1D1D on the dark surface is 1.5:1, #1B4D3E is 1.2:1, and
     the near-white fields would be brighter than the page. Each is lifted to
     the same role at dark-theme legibility, and the fields become recessed
     washes of their own hue rather than tints of white. */
  --gov-red:#ff9a90; --gov-red-field:rgba(255,122,126,0.13);
  --gov-amber-rule:#f3ab5c; --gov-amber-field:rgba(243,171,92,0.13);
  --gov-teal:#6fd1a6; --gov-teal-field:rgba(46,207,138,0.14);
  --gov-teal-mid:#8fc4ad;
}