/* Integrity-style look, shared by the v2 console, brief, sign-in and password pages.

   Every value here was measured from IntegrityCONNECT (agent portal) or PlanEnroll on
   2026-10-27, or matched by eye where it could not be measured. The token sheet in
   helix/clients/stamper-senior-insurance/app/STATE.md names the reference behind each.
   Our own CSS and an open font; nothing of Integrity's is loaded or copied.

   Dark mode pairs every surface token with its ink. Never paint a background with a
   token that does not flip (the 2026-09-22 trap in the classic console). */
:root{
  /* chrome */
  --nav-bar:#052a63;          /* top bar, measured */
  --nav-ink:#ffffff;
  --nav-ink-soft:#b9cdf2;
  --side:#ffffff;             /* left rail */
  --side-active:#dfeafb;      /* active rail item, measured */
  /* ground and surfaces */
  --ground:#f1f1f1;           /* content ground, measured */
  --surface:#ffffff;
  --surface-2:#f7f8fa;        /* inset rows inside a white panel */
  --line:#cccccc;             /* tab bar, section cards, measured */
  --line-soft:#dddddd;        /* inner cards, choice rows, measured */
  --row-line:#f1f1f1;         /* table row divider, 2px, measured */
  --field-line:#c4c4c4;       /* search field, measured */
  /* type */
  --ink:#434a51;              /* body text, measured */
  --ink-strong:#052a63;       /* headings and values, measured */
  --muted:#666666;            /* labels; Integrity's #717171 darkened to pass AA on the ground */
  /* action */
  --blue:#2a63e6;             /* Integrity fills #4178ff (3.9:1 with white); darkened for AA */
  --blue-hover:#1f52c8;
  --blue-ink:#1f55d0;         /* blue text on a blue tint */
  --blue-tint:#e7f3ff;        /* active tab, measured */
  --link:#236c9e;             /* quiet text links, measured */
  /* status pills, measured where Integrity shows them */
  --warn-ink:#9a4d00; --warn-bg:#fdece0;
  --bad-ink:#ac0e16;  --bad-bg:#f8e4e5;
  --good-ink:#1e7a3a; --good-bg:#e3f4e8;
  --info-ink:#1f55d0; --info-bg:#e7f3ff;
  --neutral-ink:#434a51; --neutral-bg:#ececec;
  --mark:#fff1b8;
  --zebra:#f1faff;            /* compare rows, measured */
  --facts:#f2f9ff;            /* plan card facts block, measured */
  /* shape */
  --r-pill:24px; --r-panel:16px; --r-card:12px; --r-tile:8px; --r-field:4px;
  --shadow-btn:0 1px 2px rgba(5,42,99,.18);
  --shadow-pop:0 12px 40px rgba(5,42,99,.22);
  --font:"Source Sans 3","Segoe UI",system-ui,-apple-system,sans-serif;
  --mono:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;
  color-scheme:light;
}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]){
  --nav-bar:#0a1a36; --nav-ink:#ffffff; --nav-ink-soft:#a9bde4;
  --side:#161b22; --side-active:#1d2b47;
  --ground:#0f1318; --surface:#181e26; --surface-2:#1f262f;
  --line:#343d48; --line-soft:#2c343e; --row-line:#232a33; --field-line:#46505c;
  --ink:#d3d9e0; --ink-strong:#eef3fa; --muted:#a2acb7;
  --blue:#4d7fff; --blue-hover:#6b95ff; --blue-ink:#9dbaff; --blue-tint:#1d2b47; --link:#8fbbe0;
  --warn-ink:#f2b27a; --warn-bg:#3a2614; --bad-ink:#f39a9f; --bad-bg:#3d1a1d;
  --good-ink:#86d39e; --good-bg:#16301f; --info-ink:#9dbaff; --info-bg:#1d2b47;
  --neutral-ink:#c6cdd5; --neutral-bg:#2a313a; --mark:#5a4a12; --zebra:#1b2430; --facts:#1c2533;
  --shadow-btn:none; --shadow-pop:0 12px 40px rgba(0,0,0,.55);
  color-scheme:dark;
}}
:root[data-theme="dark"]{
  --nav-bar:#0a1a36; --nav-ink:#ffffff; --nav-ink-soft:#a9bde4;
  --side:#161b22; --side-active:#1d2b47;
  --ground:#0f1318; --surface:#181e26; --surface-2:#1f262f;
  --line:#343d48; --line-soft:#2c343e; --row-line:#232a33; --field-line:#46505c;
  --ink:#d3d9e0; --ink-strong:#eef3fa; --muted:#a2acb7;
  --blue:#4d7fff; --blue-hover:#6b95ff; --blue-ink:#9dbaff; --blue-tint:#1d2b47; --link:#8fbbe0;
  --warn-ink:#f2b27a; --warn-bg:#3a2614; --bad-ink:#f39a9f; --bad-bg:#3d1a1d;
  --good-ink:#86d39e; --good-bg:#16301f; --info-ink:#9dbaff; --info-bg:#1d2b47;
  --neutral-ink:#c6cdd5; --neutral-bg:#2a313a; --mark:#5a4a12; --zebra:#1b2430; --facts:#1c2533;
  --shadow-btn:none; --shadow-pop:0 12px 40px rgba(0,0,0,.55);
  color-scheme:dark;
}

/* plans.js still reads the classic token names; map them onto ours so anything it
   draws that this sheet does not restyle still lands on the right colours. */
:root{
  --color-divider:var(--line-soft); --color-accent:var(--blue);
  --color-accent-600:var(--blue); --color-accent-700:var(--blue-ink);
  --color-accent-800:var(--blue-ink); --color-accent-900:var(--ink-strong);
  --color-accent-100:var(--blue-tint);
  --color-neutral-200:var(--neutral-bg); --color-neutral-300:var(--line-soft);
  --color-neutral-400:var(--field-line); --color-neutral-500:var(--muted);
  --color-neutral-600:var(--muted); --color-neutral-700:var(--muted);
  --color-neutral-800:var(--ink); --color-surface:var(--surface);
  --font-heading:var(--font); --font-body:var(--font); --panel:var(--surface);
}

*,*::before,*::after{box-sizing:border-box}
[hidden]{display:none !important}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--ground);color:var(--ink);font-family:var(--font);
  font-size:16px;line-height:1.5}
h1,h2,h3,h4,h5,h6{font-family:var(--font);color:var(--ink-strong);margin:0;line-height:1.2}
h1{font-size:32px;font-weight:400}
h2{font-size:32px;font-weight:400}
h3{font-size:28px;font-weight:400}
h4{font-size:20px;font-weight:600}
h5{font-size:18px;font-weight:600}
/* Integrity's section titles are sentence case at 24px in navy. No caps, no tracking. */
h6{font-size:20px;font-weight:400;letter-spacing:0;text-transform:none;color:var(--ink-strong)}
a{color:var(--blue)}
a:hover{color:var(--blue-hover)}
:focus-visible{outline:2px solid var(--blue);outline-offset:2px}
.muted{color:var(--muted)}
.blueprint{position:relative}

/* Buttons. Pills, as in the portal: filled for the one main action on a screen,
   outlined for the next, text-only for the rest. Every button keeps its text label. */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:6px;cursor:pointer;
  font:600 15px/1.2 var(--font);text-decoration:none;white-space:nowrap;
  min-height:40px;padding:8px 18px;border-radius:var(--r-pill);
  background:var(--surface);color:var(--blue);border:1px solid var(--blue)}
.btn:hover{background:var(--blue-tint);color:var(--blue-ink)}
.btn-primary{background:var(--blue);border-color:var(--blue);color:#fff;
  box-shadow:var(--shadow-btn)}
.btn-primary:hover{background:var(--blue-hover);border-color:var(--blue-hover);color:#fff}
.btn-sm{min-height:34px;padding:6px 14px;font-size:14px}
.btn-ghost{background:transparent;border-color:transparent;color:var(--blue);box-shadow:none}
.btn-ghost:hover{background:var(--blue-tint)}
.btn.danger{color:var(--bad-ink);border-color:transparent;background:transparent}
.btn.danger:hover{background:var(--bad-bg)}
.btn.danger.armed{background:var(--bad-ink);border-color:var(--bad-ink);color:#fff}
:root[data-theme="dark"] .btn.danger.armed{color:#1a0507}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]) .btn.danger.armed{color:#1a0507}}
.btn[disabled]{opacity:.5;cursor:not-allowed}

/* Fields: outlined, 4px corners, a blue ring on focus. */
.input,select.who-sel{width:100%;min-height:40px;padding:8px 12px;font:400 16px/1.3 var(--font);
  color:var(--ink);background:var(--surface);border:1px solid var(--field-line);
  border-radius:var(--r-field);caret-color:var(--blue)}
.input:focus,select.who-sel:focus{outline:none;border-color:var(--blue);
  box-shadow:0 0 0 1px var(--blue)}
.input::placeholder{color:var(--muted)}
label{color:var(--ink-strong);font-size:14px;font-weight:600}
label .input{margin-top:6px;font-weight:400}

/* Status pills, the portal's "Medium / High / Active" shape. Text, never colour alone. */
.tag,.pill{display:inline-flex;align-items:center;gap:4px;font-size:13px;font-weight:600;
  line-height:1.2;padding:4px 10px;border-radius:100px;white-space:nowrap;
  background:var(--neutral-bg);color:var(--neutral-ink);border:0}
.tag-accent{background:var(--info-bg);color:var(--info-ink)}
.tag-good{background:var(--good-bg);color:var(--good-ink)}
.tag-neutral{background:var(--neutral-bg);color:var(--neutral-ink)}
.tag-outline{background:var(--warn-bg);color:var(--warn-ink)}
.tag-dead{background:var(--bad-bg);color:var(--bad-ink)}

.toast{position:fixed;left:50%;transform:translateX(-50%);bottom:26px;z-index:80;
  background:var(--ink-strong);color:var(--surface);padding:12px 20px;font-size:15px;
  border-radius:var(--r-tile);box-shadow:var(--shadow-pop)}
:root[data-theme="dark"] .toast{background:#e9eef6;color:#0f1318}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]) .toast{background:#e9eef6;color:#0f1318}}

/* Top bar shared by every staff page. Our own name in plain type, no mark or logo. */
.v2bar{display:flex;align-items:center;gap:20px;min-height:76px;padding:10px 32px;
  background:var(--nav-bar);color:var(--nav-ink);flex-wrap:wrap}
/* The agency's own logo (white version, from stamperins.com) with the tool's name beside it. */
.v2brand{display:inline-flex;align-items:center;gap:14px;color:var(--nav-ink);text-decoration:none;white-space:nowrap}
.v2logo{display:block;height:54px;width:auto}
.v2brand span{font-size:17px;font-weight:400;color:var(--nav-ink-soft);padding-left:14px;
  border-left:1px solid rgba(255,255,255,.28);line-height:28px}
.v2bar .iconbtn,.v2bar .barlink{display:inline-flex;align-items:center;gap:7px;
  font:500 14px/1 var(--font);min-height:36px;padding:8px 14px;cursor:pointer;
  background:transparent;color:var(--nav-ink);border:1px solid transparent;
  border-radius:var(--r-pill);text-decoration:none;white-space:nowrap}
.v2bar .iconbtn:hover,.v2bar .barlink:hover{background:rgba(255,255,255,.12);color:var(--nav-ink)}
.v2bar .iconbtn svg{display:block}
.v2bar .classic{color:var(--nav-ink-soft);font-size:14px;text-decoration:underline;
  text-underline-offset:3px;padding:8px 4px;white-space:nowrap}
.v2bar .classic:hover{color:var(--nav-ink)}
@media (max-width:720px){
  .v2bar{padding:10px 16px;gap:8px;min-height:60px}
  .v2logo{height:42px}
  .v2brand span{font-size:15px;padding-left:10px}
  .v2brand{gap:10px}
  .v2bar .iconbtn,.v2bar .barlink,.v2bar .classic{min-height:44px}
}