/* RosiliOne — patient platform.
   Identity: "civic authority, human warmth." Deep institutional teal + brass,
   Open Sans Hebrew throughout — a clean, modern, highly-legible sans built for
   UI and Hebrew; hierarchy carried by weight/size, not a second family.
   Self-hosted (no CDN — a government-inspected product owns its assets).
   Hebrew RTL. IS 5568 / WCAG 2.0 AA: large type, high contrast, visible focus. */

/* ---------- Self-hosted fonts (Open Sans Hebrew + Latin) ---------- */
@font-face { font-family: "Open Sans"; font-weight: 400; font-display: swap; src: url("./fonts/open-sans-hebrew-400-normal.woff2") format("woff2"); unicode-range: U+0590-05FF,U+200C-2010,U+20AA,U+25CC,U+FB1D-FB4F; }
@font-face { font-family: "Open Sans"; font-weight: 400; font-display: swap; src: url("./fonts/open-sans-latin-400-normal.woff2") format("woff2"); unicode-range: U+0000-00FF,U+2000-206F,U+2074,U+20AC,U+2122; }
@font-face { font-family: "Open Sans"; font-weight: 600; font-display: swap; src: url("./fonts/open-sans-hebrew-600-normal.woff2") format("woff2"); unicode-range: U+0590-05FF,U+200C-2010,U+20AA,U+25CC,U+FB1D-FB4F; }
@font-face { font-family: "Open Sans"; font-weight: 600; font-display: swap; src: url("./fonts/open-sans-latin-600-normal.woff2") format("woff2"); unicode-range: U+0000-00FF,U+2000-206F,U+2074,U+20AC,U+2122; }
@font-face { font-family: "Open Sans"; font-weight: 700; font-display: swap; src: url("./fonts/open-sans-hebrew-700-normal.woff2") format("woff2"); unicode-range: U+0590-05FF,U+200C-2010,U+20AA,U+25CC,U+FB1D-FB4F; }
@font-face { font-family: "Open Sans"; font-weight: 700; font-display: swap; src: url("./fonts/open-sans-latin-700-normal.woff2") format("woff2"); unicode-range: U+0000-00FF,U+2000-206F,U+2074,U+20AC,U+2122; }
@font-face { font-family: "Open Sans"; font-weight: 800; font-display: swap; src: url("./fonts/open-sans-hebrew-800-normal.woff2") format("woff2"); unicode-range: U+0590-05FF,U+200C-2010,U+20AA,U+25CC,U+FB1D-FB4F; }
@font-face { font-family: "Open Sans"; font-weight: 800; font-display: swap; src: url("./fonts/open-sans-latin-800-normal.woff2") format("woff2"); unicode-range: U+0000-00FF,U+2000-206F,U+2074,U+20AC,U+2122; }

/* ---------- Tokens ---------- */
:root {
  --serif: "Open Sans", "Segoe UI", system-ui, sans-serif;
  --sans: "Open Sans", "Segoe UI", system-ui, -apple-system, "Arial Hebrew", sans-serif;

  --ground: #f6f8f9; --surface: #ffffff; --surface-2: #f2f6f6;
  --ink: #12242b; --ink-soft: #48606a; --ink-faint: #566e78;
  --line: #e3eaeb; --line-strong: #c3d0d2;
  --brand: #0b4f57; --brand-deep: #073a41; --brand-ink: #094048; --brand-wash: #e0edee;
  --gold: #a8781a; --gold-ink: #7f5a10; --gold-wash: #f4ecd8;
  --ok: #17703f; --ok-wash: #ddefe6; --warn: #91600f; --warn-wash: #f4ebd5;
  --crit: #a53a30; --crit-wash: #f4dedb;
  --focus: #1667d6;
  --r-lg: 14px; --r: 12px; --r-sm: 8px;
  --shadow: 0 1px 2px rgba(9,40,45,.04);
  --shadow-lift: 0 4px 14px rgba(9,40,45,.08);
  --maxw: 1200px;
  font-size: 18px;
}
@media (prefers-color-scheme: dark) {
  /* This dark block is REACHABLE and in use: apps/advisor, apps/provider and
     apps/ops share this stylesheet and do NOT lock a theme, so they render
     Dark Ops via prefers-color-scheme. The patient portal alone locks
     data-theme="light" (index.html) — light-only by design (pharmacy-floor:
     every reference site is light), so this override intentionally never
     applies to it. Not dead code. */
  :root:not([data-theme="light"]) {
    --ground: #0a1518; --surface: #0f2126; --surface-2: #152d32;
    --ink: #e7eff0; --ink-soft: #9fb6ba; --ink-faint: #8aa2a8;
    --line: #21393e; --line-strong: #2d4c52;
    --brand: #3fb0b8; --brand-deep: #58c7cd; --brand-ink: #8ddce0; --brand-wash: #10322f;
    --gold: #d0a13f; --gold-ink: #e3bd6c; --gold-wash: #33280f;
    --ok: #46c184; --ok-wash: #12301f; --warn: #d59a3c; --warn-wash: #322610;
    --crit: #e0685f; --crit-wash: #331a1a;
    --shadow: 0 1px 2px rgba(0,0,0,.25);
    --shadow-lift: 0 4px 14px rgba(0,0,0,.35);
  }
}

* { box-sizing: border-box; }
[hidden] { display: none !important; }
/* iOS Safari "font boosting" inflates text ~1.5-1.75x on phones without this
   guard — the whole page reads as bloated. User zoom (IS 5568) still works. */
html { -webkit-text-size-adjust: 100%; text-size-adjust: 100%; }
html, body { margin: 0; padding: 0; }
body { background: var(--ground); color: var(--ink); font-family: var(--sans); line-height: 1.55; font-size: 1rem;
  -webkit-font-smoothing: antialiased; text-rendering: optimizeLegibility; }
/* Form controls don't inherit the page font by default (they fall back to
   Arial/system) — force every button/input to use Open Sans so text inside
   buttons (client names, situation cards, stat tiles) matches the rest. */
button, input, select, textarea { font-family: inherit; }
h1, h2, h3 { font-family: var(--serif); margin: 0; letter-spacing: -.01em; }
h1 { font-weight: 600; }
h2, h3 { font-weight: 600; }
.visually-hidden { position: absolute; width: 1px; height: 1px; margin: -1px; padding: 0; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0; }
.skip-link { position: absolute; inset-inline-start: 12px; top: -60px; background: var(--brand); color: #fff; padding: 12px 18px; border-radius: 10px; z-index: 80; transition: top .15s; }
.skip-link:focus { top: 12px; }
:focus-visible { outline: 3px solid var(--focus); outline-offset: 2px; border-radius: 6px; }
#screen:focus, #screen:focus-visible { outline: none; }
.muted { color: var(--ink-soft); }
/* Keep help/explainer paragraphs at a readable measure. */
.card > .muted, .card p.muted { max-width: 62ch; }
.muted-lg { color: var(--ink-soft); font-size: 1.1rem; margin: .5rem 0 0; }
.brand-mark { color: var(--gold); }

/* ---------- Buttons ---------- */
.btn, .btn-primary, .btn-ghost { appearance: none; cursor: pointer; font-family: var(--sans); font-weight: 600; font-size: 1rem; border-radius: 10px; border: 1.5px solid transparent; min-height: 44px; padding: 9px 18px; transition: transform .12s, background .15s, border-color .15s; }
.btn-primary { background: var(--brand); color: #fff; box-shadow: var(--shadow); }
.btn-primary:hover { background: var(--brand-deep); }
.btn-ghost { background: var(--surface); color: var(--brand-ink); border-color: var(--brand); }
.btn-ghost:hover { background: var(--brand-wash); }
.btn-block { display: block; width: 100%; text-align: center; }
/* Quiet, non-alarming logout: neutral text, not a full-width red danger bar. */
.btn-quiet { display: inline-flex; align-items: center; gap: 6px; margin: 20px 2px 4px; padding: 8px 4px; min-height: 44px; background: none; border: 0; color: var(--ink-soft); font: inherit; cursor: pointer; text-decoration: underline; text-underline-offset: 3px; }
.btn-quiet:hover, .btn-quiet:focus-visible { color: var(--ink); }
.btn-sm { min-height: 40px; padding: 8px 16px; font-size: .92rem; }
.btn-link { background: none; border: 0; color: var(--brand-ink); font: inherit; font-weight: 700; cursor: pointer; padding: 10px; }
.danger { color: var(--crit); border-color: var(--crit); }
.danger:hover { background: var(--crit-wash); }

/* ================= AUTH (split) ================= */
/* Auth is a single centred column at ALL widths. The two-track brand+form
   split repeatedly overflowed horizontally on some browsers/fonts (an RTL
   grid min-content interaction that resisted every clip/shrink fix and pushed
   the sign-in form off-screen). The clean centred column — previously the
   mobile layout — is robust everywhere; the brand shows as a compact banner. */
.auth { min-height: 100dvh; display: block; }
.auth .auth-brand { display: none; }
.auth .auth-stage { display: block; inline-size: 100%; margin-inline: auto; max-inline-size: 560px; padding: clamp(20px, 4vh, 44px) 16px; }
.auth .auth-brand-m { display: flex; flex-wrap: wrap; justify-content: center; align-items: center; gap: 8px; margin: 4px 0 10px; }
.auth .auth-card { margin-inline: auto; max-inline-size: min(460px, 100%); }
.auth-brand, .auth-stage { min-inline-size: 0; }
.auth-brand { background:
    radial-gradient(900px 500px at 80% -10%, rgba(168,120,26,.22) 0%, transparent 55%),
    linear-gradient(155deg, var(--brand-deep), var(--brand) 65%);
  color: #eaf5f5; padding: clamp(32px, 5vw, 64px); display: flex; flex-direction: column; gap: 24px; }
.auth-brand .brand { font-weight: 800; font-size: 1.25rem; display: inline-flex; align-items: center; gap: 9px; }
.auth-brand .brand-mark { color: var(--gold); }
.ab-body { margin-block: auto; max-width: min(34ch, 100%); }
.ab-eyebrow { font-weight: 700; font-size: .82rem; letter-spacing: .14em; text-transform: uppercase; color: #b9d8d8; margin: 0 0 20px; }
.ab-title { font-family: var(--serif); font-weight: 800; font-size: clamp(1.9rem, 2.7vw, 2.8rem); line-height: 1.2; margin: 0 0 20px; color: #fff; text-wrap: balance; }
.ab-lead { font-size: 1.12rem; line-height: 1.6; color: #d3e6e6; margin: 0 0 30px; }
.ab-points { list-style: none; margin: 0; padding: 0; display: grid; gap: 16px; }
.ab-points li { display: flex; align-items: flex-start; gap: 13px; font-size: 1.02rem; color: #e8f4f4; }
.ab-points b { color: #fff; }
.ab-ic { flex: 0 0 auto; width: 34px; height: 34px; border-radius: 9px; display: grid; place-items: center; background: rgba(255,255,255,.1); color: var(--gold); font-weight: 800; }
.ab-foot { margin-top: 8px; }
.gov-chip { display: inline-flex; align-items: center; gap: 9px; font-size: .84rem; font-weight: 700; color: #cfe6e6; background: rgba(255,255,255,.08); border: 1px solid rgba(255,255,255,.14); border-radius: 999px; padding: 7px 15px; }
.gov-dot, .trust-dot { width: 8px; height: 8px; border-radius: 50%; background: var(--gold); box-shadow: 0 0 0 3px rgba(168,120,26,.25); }

.auth-stage { display: grid; place-items: center; padding: clamp(24px, 4vw, 48px); min-inline-size: 0; }
.auth-card { width: min(420px, 100%); }
.auth-brand-m { display: none; } /* mobile-only band; shown in the ≤768px block */
/* Language-first entry (Sam 2026-08-15): pick your language before anything
   asks you a question. Self-labeled buttons — no translation needed to find yours. */
.auth-langs { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 22px; }
.auth-lang { font: inherit; font-size: .88rem; font-weight: 700; cursor: pointer; border: 1.5px solid var(--line-strong); background: var(--surface); color: var(--ink-soft); border-radius: 999px; padding: 7px 14px; min-height: 40px; transition: border-color .15s, background .15s, color .15s; }
.auth-lang:hover { border-color: var(--brand); color: var(--brand-ink); }
.auth-lang.on { background: var(--brand); border-color: transparent; color: #fff; }
.auth-step h2 { font-size: clamp(1.5rem, 2.5vw, 1.8rem); margin: 4px 0 8px; }
.step-eyebrow { font-weight: 700; font-size: .78rem; letter-spacing: .12em; text-transform: uppercase; color: var(--gold-ink); margin: 0; }
.step-sub { color: var(--ink-soft); font-size: 1.05rem; margin: 0 0 26px; }
.field { display: grid; gap: 9px; margin-bottom: 22px; }
.field-label { font-weight: 600; font-size: .95rem; }
.field input { font: inherit; font-weight: 600; padding: 15px 16px; border-radius: var(--r-sm); border: 1.5px solid var(--line-strong); background: var(--surface); color: var(--ink); min-height: 56px; letter-spacing: 1.5px; }
.field input:focus { border-color: var(--brand); }
.step-note { margin: 22px 0 0; font-size: .84rem; color: var(--ink-faint); text-align: center; }
.code-boxes { display: flex; gap: 12px; direction: ltr; justify-content: center; margin-bottom: 26px; }
.code-box { width: 62px; height: 72px; text-align: center; font-size: 1.9rem; font-weight: 800; border: 1.5px solid var(--line-strong); border-radius: var(--r-sm); background: var(--surface); color: var(--ink); }
.code-box:focus { border-color: var(--brand); }
.auth-legal { margin: 28px 0 0; font-size: .82rem; color: var(--ink-faint); text-align: center; max-width: 42ch; }

/* ================= APP SHELL ================= */
/* App-shell (Sam 2026-08-23): fixed-height frame so the chrome (topnav + tab
   bar) never moves and content scrolls inside .app-scroll — kills the
   "endless rolling page" feel on every screen at once. */
.app { height: 100dvh; overflow: hidden; display: flex; flex-direction: column; }
.app-scroll { flex: 1 1 auto; min-height: 0; overflow-y: auto; overscroll-behavior: contain; display: flex; flex-direction: column; }
.topnav { position: sticky; top: 0; z-index: 40; background: color-mix(in srgb, var(--surface) 88%, transparent); backdrop-filter: blur(10px); border-block-end: 1px solid var(--line); box-shadow: 0 1px 0 var(--line), 0 4px 16px rgba(9,40,45,.05); }
.topnav-inner { max-width: var(--maxw); margin: 0 auto; display: flex; align-items: center; gap: 14px; padding: 0 clamp(16px, 3vw, 32px); min-height: 52px; }
.topnav .brand { font-weight: 800; font-size: 1.08rem; display: inline-flex; align-items: center; gap: 8px; flex: 0 0 auto; }
.mainnav { display: flex; gap: 2px; flex: 1 1 auto; }
.nav-item { background: none; border: 0; cursor: pointer; font: inherit; font-weight: 600; font-size: .95rem; color: var(--ink-soft); padding: 6px 12px; border-radius: 8px; position: relative; }
.nav-item:hover { color: var(--ink); background: var(--surface-2); }
.nav-item.active { color: var(--brand-ink); }
.nav-item.active::after { content: ""; position: absolute; inset-inline: 12px; bottom: -1px; height: 2.5px; border-radius: 3px 3px 0 0; background: var(--gold); }
.topnav-actions { display: flex; align-items: center; gap: 8px; flex: 0 0 auto; }
.trust-badge { display: inline-flex; align-items: center; gap: 7px; font-size: .78rem; font-weight: 700; color: var(--brand-ink); background: var(--brand-wash); border-radius: 999px; padding: 5px 11px; }
.icon-btn { position: relative; background: none; border: 0; border-radius: 9px; width: 42px; height: 42px; cursor: pointer; color: var(--ink-soft); display: grid; place-items: center; }
.icon-btn:hover { background: var(--surface-2); color: var(--ink); }
.icon-btn.logout:hover { color: var(--crit); }
.bell-wrap { position: relative; }
.bell-badge { position: absolute; top: -5px; inset-inline-end: -5px; background: var(--crit); color: #fff; font-size: .68rem; font-weight: 800; min-width: 19px; height: 19px; border-radius: 999px; display: grid; place-items: center; padding: 0 5px; }
.bell-panel { position: fixed; top: 58px; inset-inline-start: 12px; inset-inline-end: 12px; max-width: 380px; margin-inline-start: auto; background: var(--surface); border: 1px solid var(--line); border-radius: 12px; box-shadow: var(--shadow-lift); padding: 6px 16px; z-index: 50; max-height: min(60vh, 480px); overflow-y: auto; }
.bell-panel h3 { font-family: var(--sans); font-size: .9rem; color: var(--ink-faint); margin: 10px 0 2px; font-weight: 600; }
.profile-chip { display: flex; align-items: center; gap: 8px; background: none; border: 0; border-radius: 999px; padding: 3px 10px 3px 4px; cursor: pointer; font: inherit; font-weight: 600; font-size: .92rem; min-height: 42px; }
.profile-chip:hover { background: var(--surface-2); }
.avatar { flex: 0 0 auto; width: 30px; height: 30px; border-radius: 999px; background: var(--brand); color: #fff; display: grid; place-items: center; font-weight: 700; }
.avatar-lg { width: 46px; height: 46px; font-size: 1.15rem; }

.app-body { flex: 1 0 auto; width: 100%; max-width: var(--maxw); margin: 0 auto; padding: clamp(16px, 2.5vw, 30px) clamp(16px, 3vw, 32px) 56px; }
.app-topline { display: flex; align-items: center; gap: 16px; min-height: 0; margin-bottom: 10px; }
.greet { display: none; }
.screen-back { display: inline-flex; align-items: center; gap: 7px; background: var(--surface); border: 1px solid var(--line); border-radius: 999px; padding: 6px 14px; cursor: pointer; font: inherit; font-weight: 600; color: var(--ink); }
.screen-back:hover { border-color: var(--brand); color: var(--brand-ink); }
.greet { font-weight: 600; color: var(--ink-soft); font-size: 1.02rem; }

/* Footer (institutional anchor) */
.site-foot { background: linear-gradient(180deg, var(--brand-deep), #052a30); color: #cfe4e4; margin-top: auto; }
.foot-inner { max-width: var(--maxw); margin: 0 auto; padding: 40px clamp(16px, 3vw, 32px); display: grid; grid-template-columns: 1.4fr 1fr 1fr 1fr; gap: 30px; }
.foot-brand { font-weight: 800; font-size: 1.15rem; color: #fff; }
.foot-brand .brand-mark { color: var(--gold); }
.foot-brand p { font-weight: 400; font-size: .92rem; color: #a9cccc; margin: 10px 0 0; max-width: 30ch; }
.foot-col h4 { font-family: var(--sans); font-size: .82rem; letter-spacing: .08em; text-transform: uppercase; color: var(--gold); margin: 0 0 10px; font-weight: 800; }
.foot-col p { font-size: .9rem; color: #a9cccc; margin: 0; line-height: 1.55; }
.foot-legal { border-block-start: 1px solid rgba(255,255,255,.1); text-align: center; padding: 16px; font-size: .82rem; color: #85adad; }

/* Bottom tabbar (mobile) */
.tabbar { display: none; position: sticky; bottom: 0; z-index: 45; background: var(--surface); border-block-start: 1.5px solid var(--line); padding: 6px 6px calc(6px + env(safe-area-inset-bottom)); }
.tab { flex: 1 1 0; display: flex; flex-direction: column; align-items: center; gap: 3px; background: none; border: 0; cursor: pointer; font: inherit; font-size: .72rem; font-weight: 700; color: var(--ink-soft); padding: 8px 2px; border-radius: 10px; }
.tab-ic { display: grid; place-items: center; height: 22px; }
/* Line icons (apps/shared/icons.js): inherit currentColor, never stretch. */
svg.ic { display: inline-block; vertical-align: -3px; flex: 0 0 auto; }
.switch-ic { display: inline-grid; place-items: center; color: var(--brand-ink); }
.tab.active { color: var(--brand-ink); }
.tab { position: relative; }
/* v3 5-tab bar: raised center "דיווח" report FAB */
.tabbar-5 { display: none; align-items: flex-end; }
.tab-report { position: relative; }
.tab-fab { display: grid; place-items: center; inline-size: 52px; block-size: 52px; border-radius: 50%; background: var(--brand); color: #fff; box-shadow: 0 4px 12px rgba(11,79,87,.35); margin-block-start: -22px; border: 3px solid var(--surface); }
.tab-report:hover .tab-fab { background: var(--brand-deep); }
.tab-report > span:last-child { margin-block-start: 2px; }
/* notifications tab badge (red dot) */
.tab-badge { position: absolute; top: 6px; inset-inline-start: calc(50% + 6px); inline-size: 8px; block-size: 8px; border-radius: 50%; background: var(--gold); }
.tab-badge.urgent { background: var(--crit); }
/* "עוד" more sheet */
.more-sheet { position: fixed; inset: 0; z-index: 60; display: flex; align-items: flex-end; }
.more-backdrop { position: absolute; inset: 0; background: rgba(9,40,45,.42); }
.more-panel { position: relative; inline-size: 100%; background: var(--surface); border-radius: 18px 18px 0 0; padding: 10px 18px calc(20px + env(safe-area-inset-bottom)); box-shadow: 0 -6px 24px rgba(9,40,45,.18); animation: sheet-up .2s ease; }
@keyframes sheet-up { from { transform: translateY(16px); opacity: .6; } to { transform: none; opacity: 1; } }
.more-handle { inline-size: 40px; block-size: 4px; border-radius: 999px; background: var(--line-strong); margin: 4px auto 12px; }
.more-title { font-size: 1.05rem; font-weight: 800; margin: 0 2px 12px; color: var(--ink); }
.more-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 10px; }
.more-item { display: grid; justify-items: center; gap: 7px; text-align: center; background: var(--surface-2); border: 1px solid var(--line); border-radius: var(--r); padding: 14px 6px; font: inherit; font-size: .74rem; font-weight: 700; color: var(--ink); cursor: pointer; }
.more-item:hover { border-color: var(--brand); }
.mi-ic { display: grid; place-items: center; color: var(--brand-ink); }
.more-close-btn { inline-size: 100%; margin-top: 14px; justify-content: center; }
body.sheet-open { overflow: hidden; }
@media (max-width: 380px) { .more-grid { grid-template-columns: repeat(3, 1fr); } }

/* ================= SHARED ================= */
.card { background: var(--surface); border: 1px solid var(--line); border-radius: 14px; box-shadow: var(--shadow); padding: 14px 16px; margin-bottom: 12px; }
.card h2 { font-size: 1rem; font-weight: 700; margin: 0 0 10px; }
.card-head { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-bottom: 12px; }
.count-chip { background: var(--surface-2); color: var(--ink-soft); font-weight: 700; border-radius: 999px; padding: 3px 12px; font-size: .88rem; font-family: var(--sans); }
.screen-head { padding: 4px 2px 15px; }
.screen-head h1 { font-size: clamp(1.3rem, 2.5vw, 1.6rem); }
.eyebrow { display: inline-block; font-weight: 700; font-size: .78rem; letter-spacing: .1em; text-transform: uppercase; color: var(--gold-ink); margin: 0 0 12px; }
.disclaimer-note { color: var(--ink-soft); font-size: .95rem; background: var(--surface); border: 1.5px solid var(--line); border-inline-start: 3px solid var(--gold); border-radius: var(--r); padding: 16px 18px; margin-top: 8px; }

/* ================= DASHBOARD ================= */
.hero-empty { text-align: center; padding: 40px 16px; display: grid; gap: 14px; justify-items: center; }
.hero-empty h1 { font-size: clamp(1.6rem, 4vw, 2.2rem); }
.dash-head { padding: 4px 2px 6px; }
.dash-head h1 { font-size: clamp(1.2rem, 2.2vw, 1.45rem); }
.stat-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 10px; margin: 14px 0; }
.stat { display: flex; flex-direction: row-reverse; justify-content: space-between; align-items: center; gap: 10px; background: var(--surface); border: 1px solid var(--line); border-radius: 12px; box-shadow: var(--shadow); padding: 10px 14px; min-height: 62px; cursor: pointer; text-align: start; transition: border-color .15s; }
.stat:hover { border-color: var(--brand); }
.stat-big { font-size: 1.35rem; font-weight: 700; color: var(--brand-ink); line-height: 1; font-variant-numeric: tabular-nums; }
.stat:nth-child(2) .stat-big { color: var(--gold-ink); }
.stat-label { font-size: .88rem; color: var(--ink-soft); font-weight: 400; line-height: 1.3; }
.ring { --pct: 0; width: 46px; height: 46px; border-radius: 50%; background: conic-gradient(var(--brand) calc(var(--pct)*1%), var(--line) 0); display: grid; place-items: center; position: relative; flex: 0 0 auto; }
.ring::before { content: ""; position: absolute; inset: 5px; border-radius: 50%; background: var(--surface); }
.ring span { position: relative; font-weight: 700; font-size: .78rem; color: var(--brand-ink); font-family: var(--sans); font-variant-numeric: tabular-nums; }
.dash-cols { display: grid; grid-template-columns: 1fr 1fr; gap: 18px; align-items: start; }
/* Home desktop composition (mockup v5 p12): benefit / daily check-in / quick
   actions flow as three top-aligned columns on wide screens; on phone + tablet
   (≤900px) the grid collapses to the single stacked column the mobile app uses.
   Card margins are neutralised inside the grid so `gap` is the only spacer. */
.dash-grid { display: grid; grid-template-columns: 1fr; gap: 12px; align-items: start; margin-bottom: 12px; }
.dash-grid > * { margin-bottom: 0; }
@media (min-width: 901px) {
  .dash-grid { grid-template-columns: 1fr 1.25fr 1fr; gap: 20px; margin-bottom: 18px; }
}
.col { display: grid; gap: 18px; }
.claim-card .claim-top { display: flex; align-items: center; gap: 15px; margin-bottom: 16px; }
.claim-emoji { width: 48px; height: 48px; display: grid; place-items: center; color: var(--brand-ink); background: var(--brand-wash); border-radius: 12px; flex: 0 0 auto; }
.claim-actions { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 16px; }
.next-step { font-size: 1.1rem; line-height: 1.55; margin: 0; }
.bar { position: relative; height: 12px; border-radius: 999px; background: var(--line-strong); overflow: hidden; box-shadow: inset 0 1px 2px rgba(9,40,45,.1); }
.bar::after { content: ""; position: absolute; inset: 0; border-radius: inherit; background: linear-gradient(180deg, rgba(255,255,255,.32), rgba(255,255,255,0) 62%); pointer-events: none; }
.bar-fill { height: 100%; background: linear-gradient(90deg, var(--brand), var(--brand-deep)); border-radius: 999px; transition: inline-size .35s ease; }
.bar-label { margin: 10px 2px 0; font-size: 1rem; color: var(--ink-soft); }
.bar-label strong { color: var(--brand-ink); }
.alert-list { display: grid; gap: 0; }
.alert-row { display: flex; align-items: flex-start; gap: 12px; text-align: start; width: 100%; background: none; border: 0; border-block-end: 1px solid var(--line); border-radius: 0; padding: 13px 2px; cursor: pointer; font: inherit; color: var(--ink); transition: background .15s; }
.alert-row:last-child { border-block-end: 0; }
.alert-row:hover { background: var(--surface-2); }
.alert-ic { flex: 0 0 auto; display: grid; place-items: center; color: var(--brand-ink); margin-top: 1px; }
.alert-body { display: grid; gap: 3px; font-size: 1rem; }
.alert-cat { font-size: .74rem; font-weight: 700; letter-spacing: .04em; text-transform: uppercase; color: var(--ink-faint); }
/* Catalog notification rows (the "עדכונים" inbox section) */
.bell-panel h3.bell-sub { margin-top: 14px; }
.notif-row { display: flex; align-items: flex-start; gap: 12px; text-align: start; width: 100%; background: none; border: 0; border-block-end: 1px solid var(--line); padding: 13px 2px; cursor: pointer; font: inherit; color: var(--ink); transition: background .15s; }
.notif-row:last-child { border-block-end: 0; }
.notif-row:hover { background: var(--surface-2); }
.notif-row::before { content: ""; flex: 0 0 auto; width: 7px; height: 7px; border-radius: 50%; background: var(--brand); margin-top: 8px; }
.notif-row.read { color: var(--ink-soft); }
.notif-row.read::before { background: transparent; }
.notif-row.read .notif-title { font-weight: 600; }
.notif-title { font-weight: 800; }
.notif-body { font-size: .92rem; color: var(--ink-soft); }
.notif-sev-warning { color: var(--gold-ink); }
.notif-sev-success { color: var(--brand-ink); }
.quick-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
.quick { display: flex; align-items: center; gap: 11px; background: var(--surface); border: 1px solid var(--line); border-radius: var(--r); padding: 16px; cursor: pointer; font: inherit; font-weight: 600; color: var(--ink); text-align: start; box-shadow: var(--shadow); transition: transform .12s, border-color .15s, box-shadow .15s, color .15s; }
.quick:hover { border-color: var(--brand); color: var(--brand-ink); }
.quick .q-ic { display: grid; place-items: center; color: var(--brand-ink); }

/* ---- Redesign v1.3 (mockup build): benefit-estimate hero ---- */
.benefit-hero { padding: 18px 18px 14px; }
.benefit-hero .bh-head h2 { font-size: 1rem; margin: 0; }
.bh-body { display: flex; align-items: center; gap: 18px; margin: 14px 0; }
.bh-ring { display: grid; justify-items: center; gap: 5px; flex: 0 0 auto; }
.ring-lg { width: 74px; height: 74px; }
.ring-lg::before { inset: 8px; }
.ring-lg span { font-size: 1.05rem; }
.bh-ring-label { font-size: .72rem; }
.bh-money { flex: 1 1 auto; display: grid; gap: 3px; align-content: center; }
.bh-amount { font-size: 2.1rem; font-weight: 800; color: var(--brand-ink); line-height: 1; font-variant-numeric: tabular-nums; letter-spacing: -.01em; }
.bh-amount-sub { font-size: .85rem; color: var(--ink-soft); }
.bh-prov { font-size: .68rem; font-weight: 700; margin-top: 2px; }
.bh-prov.official { color: var(--brand-ink); }
.bh-prov.self { color: var(--ink-faint); }
.bh-locked { display: inline-flex; align-items: center; gap: 8px; color: var(--ink-soft); font-weight: 600; }
.bh-wallet { color: var(--brand); opacity: .8; flex: 0 0 auto; align-self: center; }
.bh-foot { display: flex; align-items: center; justify-content: space-between; gap: 12px; border-top: 1px solid var(--line); padding-top: 12px; flex-wrap: wrap; }
.bh-foot .muted { margin: 0; }
.bh-link { font-weight: 700; color: var(--brand-ink); }

/* ---- Redesign v1.3: case-status list ---- */
.cs-list { display: grid; gap: 8px; }
.cs-row { display: flex; align-items: center; gap: 12px; inline-size: 100%; background: var(--surface-2); border: 1px solid var(--line); border-radius: var(--r-sm); padding: 12px 14px; cursor: pointer; font: inherit; text-align: start; transition: border-color .15s; }
.cs-row:hover { border-color: var(--brand); }
.cs-ic { display: grid; place-items: center; color: var(--brand-ink); flex: 0 0 auto; }
.cs-main { display: grid; gap: 1px; flex: 1 1 auto; min-inline-size: 0; }
.cs-label { font-weight: 600; color: var(--ink); }
.cs-sub { margin: 0; }
.cs-pill { flex: 0 0 auto; font-size: .74rem; font-weight: 700; padding: 3px 11px; border-radius: var(--r-sm); white-space: nowrap; }
.cs-ok { background: var(--ok-wash); color: var(--ok); }
.cs-gold { background: var(--gold-wash); color: var(--gold-ink); }
.cs-warn { background: var(--warn-wash); color: var(--warn); }
/* 3-up quick grid — .dash prefix (0,2,0) beats the .quick-grid 1-col media rule (0,1,0) */
.dash .quick-grid-3 { grid-template-columns: repeat(4, 1fr); }
@media (max-width: 900px) { .dash .quick-grid-3 { grid-template-columns: repeat(3, 1fr); } }
@media (max-width: 560px) { .dash .quick-grid-3 { grid-template-columns: repeat(2, 1fr); } }

/* ---- Redesign v1.3: rights screen — claim progress cards + stepper ---- */
.rights-sec-h { font-size: 1.02rem; margin: 20px 0 10px; color: var(--ink); }
.claim-progress { margin-bottom: 12px; }
.claim-progress.cp-active { border-color: var(--brand); }
.cp-head { display: flex; align-items: flex-start; gap: 12px; }
.cp-ic { display: grid; place-items: center; inline-size: 42px; block-size: 42px; border-radius: 50%; background: var(--brand-wash); color: var(--brand-ink); flex: 0 0 auto; }
.cp-title { flex: 1 1 auto; min-inline-size: 0; }
.cp-title h2 { font-size: 1rem; margin: 0 0 2px; }
.cp-title p { margin: 0; }
.cp-head .cs-pill { margin-block-start: 4px; }
.cs-brand { background: var(--brand-wash); color: var(--brand-ink); }
.cp-stepper { display: flex; align-items: flex-start; margin: 16px 2px 10px; }
.cp-step { flex: 1 1 0; display: grid; justify-items: center; gap: 5px; position: relative; min-inline-size: 0; }
/* connector line: drawn from each step (except the first) toward the previous one */
.cp-step:not(:first-child)::before { content: ""; position: absolute; inset-block-start: 8px; inset-inline-start: -50%; inline-size: 100%; block-size: 2px; background: var(--line-strong); }
.cp-step.past:not(:first-child)::before, .cp-step.now:not(:first-child)::before { background: var(--brand); }
.cp-dot { position: relative; z-index: 1; display: grid; place-items: center; inline-size: 22px; block-size: 22px; border-radius: 50%; background: var(--surface); border: 2px solid var(--line-strong); color: var(--ink-faint); }
.cp-dot .cp-n { font-size: .72rem; font-weight: 800; font-variant-numeric: tabular-nums; }
.cp-step.past .cp-dot { background: var(--brand); border-color: var(--brand); color: #fff; }
.cp-step.now .cp-dot { border-color: var(--brand); background: var(--brand); color: #fff; box-shadow: 0 0 0 3px var(--brand-wash); }
.cp-step.now .cp-dot .cp-n { color: #fff; }
/* connector line sits behind the (now bigger) dots */
.cp-step:not(:first-child)::before { inset-block-start: 11px; }
/* form chips under the stepper (v3 rights) */
.cp-forms { display: flex; flex-wrap: wrap; gap: 8px; border-top: 1px solid var(--line); padding-top: 12px; margin-top: 4px; }
.cp-form-chip { display: inline-flex; align-items: center; gap: 6px; font: inherit; font-size: .82rem; font-weight: 700; color: var(--brand-ink); background: var(--surface-2); border: 1px solid var(--line); border-radius: var(--r-sm); padding: 7px 11px; cursor: pointer; }
.cp-form-chip:hover { border-color: var(--brand); }
.cp-form-chip span { display: inline-grid; place-items: center; }
.cp-form-docs { color: var(--ink-soft); }

/* Recognitions table (v3) */
.rec-card { padding: 8px 14px 12px; }
.rec-table { display: grid; }
.rec-row { display: grid; grid-template-columns: 1fr 1.1fr 1.4fr auto; gap: 10px; align-items: center; padding: 11px 2px; border-block-end: 1px solid var(--line); }
.rec-row:last-child { border-block-end: 0; }
.rec-head { font-size: .74rem; font-weight: 800; color: var(--ink-soft); border-block-end: 1.5px solid var(--line); padding-block: 6px; }
.rec-pct { font-weight: 800; color: var(--brand-ink); font-variant-numeric: tabular-nums; display: flex; align-items: baseline; gap: 6px; }
.rec-perm { font-size: .68rem; font-weight: 700; color: var(--ink-faint); }
.rec-date { color: var(--ink-soft); font-size: .88rem; font-variant-numeric: tabular-nums; }
.rec-kind { font-weight: 600; color: var(--ink); font-size: .9rem; }
.rec-pill { display: inline-flex; align-items: center; gap: 4px; }
.rec-pill svg { display: inline-block; }

/* v3 catalogue card: icon + body + chevron */
.right-card.rc-v3 { display: flex; align-items: center; gap: 13px; text-align: start; }
.rc-ic { display: grid; place-items: center; inline-size: 42px; block-size: 42px; border-radius: 11px; background: var(--brand-wash); color: var(--brand-ink); flex: 0 0 auto; }
.rc-body { flex: 1 1 auto; display: grid; gap: 2px; min-inline-size: 0; }
.rc-title { font-weight: 800; font-size: 1rem; color: var(--ink); }
.rc-sum { font-size: .86rem; color: var(--ink-soft); }
.rc-go { flex: 0 0 auto; font-size: 1.5rem; color: var(--line-strong); font-weight: 400; line-height: 1; }
.right-card.rc-v3:hover .rc-go { color: var(--brand); }
.cp-step-label { font-size: .68rem; color: var(--ink-faint); text-align: center; line-height: 1.2; }
.cp-step.now .cp-step-label { color: var(--brand-ink); font-weight: 700; }
.cp-step.past .cp-step-label { color: var(--ink-soft); }
.cp-foot { display: flex; align-items: center; justify-content: space-between; gap: 10px; border-top: 1px solid var(--line); padding-top: 10px; }
.cp-active-tag { display: inline-flex; align-items: center; gap: 5px; font-size: .78rem; font-weight: 700; color: var(--ok); }
.cp-foot .linklike { font-weight: 700; color: var(--brand-ink); }
.cs-static { cursor: default; }
.cs-static:hover { border-color: var(--line); }
.rights-assure { display: flex; align-items: center; gap: 10px; background: var(--brand-wash); border-radius: var(--r); padding: 12px 16px; margin: 16px 0; color: var(--brand-ink); }
.rights-assure p { margin: 0; font-size: .9rem; font-weight: 600; }
.ra-ic { display: grid; place-items: center; flex: 0 0 auto; }

/* ---- Redesign v1.3: money screen — estimate hero + breakdown + note ---- */
.money-hero-wrap { display: grid; gap: 14px; margin-bottom: 14px; }
.money-hero { text-align: center; padding: 22px 18px 18px; background: linear-gradient(180deg, var(--brand-wash), var(--surface)); border-color: var(--brand); }
.mh-eyebrow { margin: 0 0 6px; font-size: .78rem; font-weight: 800; letter-spacing: .06em; color: var(--brand-ink); text-transform: uppercase; }
.money-hero .money-big { justify-content: center; }
.mh-date { display: inline-flex; align-items: center; gap: 6px; margin: 8px 0 0; }
.mb-rows { display: grid; }
.mb-row { display: flex; align-items: baseline; justify-content: space-between; gap: 14px; padding: 10px 2px; border-block-end: 1px solid var(--line); }
.mb-label { color: var(--ink-soft); font-size: .92rem; }
.mb-amount { font-weight: 700; color: var(--ink); font-variant-numeric: tabular-nums; white-space: nowrap; }
.mb-total { border-block-end: 0; padding-block-start: 12px; }
.mb-total .mb-label { color: var(--ink); font-weight: 800; }
.mb-total .mb-amount { color: var(--brand-ink); font-size: 1.1rem; font-weight: 800; }
.money-breakdown .money-explain { margin-block-start: 10px; }
.money-note { display: flex; gap: 10px; align-items: flex-start; background: var(--gold-wash); border-radius: var(--r); padding: 14px 16px; color: var(--ink); }
.money-note strong { display: block; margin-bottom: 4px; color: var(--gold-ink); font-size: .9rem; }
.money-note .money-disc { margin: 0 0 6px; background: none; border-radius: 0; padding: 0; font-size: .88rem; }
.mn-ic { color: var(--gold-ink); flex: 0 0 auto; margin-block-start: 2px; }

/* ---- Redesign v1.3: docs screen — progress ring card + privacy line ---- */
.docs-progress { display: flex; align-items: center; gap: 16px; margin-bottom: 14px; }
.docs-progress .ring-lg span { font-size: .92rem; }
.dp-main { flex: 1 1 auto; min-inline-size: 0; display: grid; gap: 5px; }
.dp-title { margin: 0; font-weight: 800; font-size: .95rem; color: var(--ink); }
.dp-main .muted { margin: 0; }
.on-device-line { display: flex; align-items: center; gap: 10px; margin: 16px 0 0; font-size: .85rem; font-weight: 600; color: var(--brand-ink); background: var(--brand-wash); border-radius: var(--r); padding: 12px 14px; }

/* ---- v3 committee journey — icons + sub-labels ("מסע הוועדה") ---- */
.cj-card { margin-bottom: 16px; }
.cj-h-ic { display: inline-grid; place-items: center; vertical-align: middle; color: var(--brand-ink); }
.cj-card .cj-stepper { display: flex; align-items: flex-start; margin-top: 6px; background: none; border: 0; padding: 0; }
.cj-step { flex: 1 1 0; display: grid; justify-items: center; gap: 5px; position: relative; min-inline-size: 0; text-align: center; }
.cj-step:not(:first-child)::before { content: ""; position: absolute; inset-block-start: 21px; inset-inline-start: -50%; inline-size: 100%; block-size: 2px; background: var(--line-strong); z-index: 0; }
.cj-step.past:not(:first-child)::before, .cj-step.now:not(:first-child)::before { background: var(--brand); }
.cj-dot { position: relative; z-index: 1; display: grid; place-items: center; inline-size: 44px; block-size: 44px; border-radius: 50%; background: var(--surface); border: 2px solid var(--line-strong); color: var(--ink-faint); }
.cj-step.past .cj-dot { background: var(--brand); border-color: var(--brand); color: #fff; }
.cj-step.now .cj-dot { background: var(--brand); border-color: var(--brand); color: #fff; box-shadow: 0 0 0 4px var(--brand-wash); }
.cj-lbl { font-size: .82rem; font-weight: 800; color: var(--ink); }
.cj-step.now .cj-lbl { color: var(--brand-ink); }
.cj-sub { font-size: .66rem; color: var(--ink-faint); line-height: 1.25; }
/* legacy numbered journey stepper (kept for any other caller) */
.cp-stepper.cj-stepper { background: var(--surface); border: 1px solid var(--line); border-radius: var(--r); padding: 16px 12px 12px; margin: 0 0 16px; }
.cp-n { font-size: .72rem; font-weight: 700; color: var(--ink-soft); }
.cp-step.now .cp-n { color: #fff; }
.checklist-card .card-head { margin-bottom: 10px; }
.prep-list { display: grid; }
.prep-row { display: flex; align-items: center; gap: 11px; padding: 10px 2px; border-block-end: 1px solid var(--line); }
.prep-row:last-child { border-block-end: 0; }
.prep-dot { display: grid; place-items: center; inline-size: 22px; block-size: 22px; border-radius: 50%; border: 2px solid var(--line-strong); background: var(--surface); color: #fff; flex: 0 0 auto; }
.prep-row.ok .prep-dot { background: var(--ok); border-color: var(--ok); }
.prep-label { flex: 1 1 auto; font-weight: 600; color: var(--ink); font-size: .95rem; }
.prep-row:not(.ok) .prep-label { color: var(--ink-soft); font-weight: 500; }
.prep-state { flex: 0 0 auto; }
.cj-status .card-head { margin-bottom: 6px; }

/* ---- Redesign v1.3: check-in stepper ---- */
.ck-steps { display: flex; margin: 12px 0 14px; }
.ck-step { flex: 1 1 0; display: grid; justify-items: center; gap: 4px; position: relative; min-inline-size: 0; }
.ck-step:not(:first-child)::before { content: ""; position: absolute; inset-block-start: 12px; inset-inline-start: -50%; inline-size: 100%; block-size: 2px; background: var(--line-strong); }
.ck-step.past:not(:first-child)::before, .ck-step.now:not(:first-child)::before { background: var(--brand); }
.ck-dot { position: relative; z-index: 1; display: grid; place-items: center; inline-size: 25px; block-size: 25px; border-radius: 50%; background: var(--surface); border: 2px solid var(--line-strong); font-size: .74rem; font-weight: 700; color: var(--ink-soft); }
.ck-step.past .ck-dot { background: var(--brand); border-color: var(--brand); color: #fff; }
.ck-step.now .ck-dot { border-color: var(--brand); background: var(--brand); color: #fff; }
.ck-lbl { font-size: .68rem; color: var(--ink-faint); text-align: center; }
.ck-step.now .ck-lbl { color: var(--brand-ink); font-weight: 700; }
.ck-q { font-weight: 700; font-size: 1rem; margin: 4px 0 10px; color: var(--ink); }
.ck-start { inline-size: 100%; justify-content: center; margin-block-start: 4px; }
.ck-back { margin-block-start: 10px; color: var(--ink-soft); }
.ck-summary { display: flex; gap: 10px; flex-wrap: wrap; margin: 10px 0; }
.ck-dim { display: grid; justify-items: center; gap: 2px; background: var(--surface-2); border: 1px solid var(--line); border-radius: var(--r-sm); padding: 8px 14px; min-inline-size: 64px; }
.ck-dim-v { font-size: 1.15rem; font-weight: 800; color: var(--brand-ink); font-variant-numeric: tabular-nums; }
.ck-dim-k { font-size: .72rem; color: var(--ink-soft); }

/* ================= SITUATIONS ================= */
.situations { display: grid; gap: 0; max-width: 620px; background: var(--surface); border: 1px solid var(--line); border-radius: var(--r-lg); padding: 4px 18px; box-shadow: var(--shadow); }
.situation { display: flex; align-items: center; gap: 14px; text-align: start; background: none; border: 0; border-block-end: 1px solid var(--line); border-radius: 0; padding: 16px 2px; cursor: pointer; min-height: 64px; color: var(--ink); font-size: 1.02rem; font-weight: 400; transition: background .15s; }
.situation:last-child { border-block-end: 0; }
.situation:hover { background: var(--surface-2); }
.situation .emoji { display: grid; place-items: center; color: var(--brand); flex: 0 0 auto; }

/* ================= RIGHTS ================= */
.rights-list { display: grid; grid-template-columns: repeat(2, 1fr); gap: 12px; }
.right-card { background: var(--surface); border: 1px solid var(--line); border-radius: var(--r-lg); padding: 16px 18px; text-align: start; cursor: pointer; box-shadow: var(--shadow); color: var(--ink); display: block; transition: transform .12s, border-color .15s, box-shadow .15s; }
.right-card:hover { border-color: var(--brand); }
.right-card h2 { font-size: 1.15rem; margin: 0 0 8px; }
.right-card p { margin: 0; color: var(--ink-soft); font-size: 1.02rem; }
.right-card .more { margin-top: 15px; display: inline-flex; align-items: center; gap: 8px; color: var(--brand-ink); font-weight: 800; }
.detail { max-width: 760px; }
.detail h1 { font-size: clamp(1.4rem, 3vw, 1.8rem); margin-bottom: 6px; }
.detail .detail-sub { color: var(--ink-soft); font-size: 1.12rem; margin: 0 0 24px; }
.detail section { padding: 22px 0; border-block-start: 1.5px solid var(--line); }
.detail section:first-of-type { border-block-start: 0; padding-top: 0; }
.detail h3 { font-family: var(--sans); font-size: .98rem; letter-spacing: .04em; color: var(--gold-ink); text-transform: uppercase; margin: 0 0 14px; font-weight: 800; }
.p-lg { font-size: 1.12rem; margin: 0; line-height: 1.6; }
.detail ul { margin: 0; padding: 0; list-style: none; display: grid; gap: 12px; }
.detail li { display: flex; align-items: flex-start; gap: 12px; font-size: 1.1rem; line-height: 1.55; }
.detail li::before { content: "•"; color: var(--gold); font-weight: 900; font-size: 1.4rem; line-height: 1.1; }
.detail ol { margin: 0; padding: 0; list-style: none; counter-reset: step; display: grid; gap: 14px; }
.detail ol li { counter-increment: step; }
.detail ol li::before { content: counter(step); color: #fff; background: var(--brand); min-width: 34px; height: 34px; border-radius: 999px; display: grid; place-items: center; font-family: var(--sans); font-weight: 800; font-size: 1rem; flex: 0 0 auto; }
.pill-form { display: inline-block; background: var(--gold-wash); color: var(--gold-ink); border-radius: 7px; padding: 2px 10px; font-weight: 800; font-size: .9rem; margin-inline-start: 8px; }
.source-links { display: grid; gap: 12px; }
.source-links a { display: inline-flex; align-items: center; gap: 10px; color: var(--brand-ink); font-weight: 700; font-size: 1.05rem; text-decoration: none; }
.source-links a::before { content: "↗"; color: var(--gold); font-weight: 900; }
.source-links a:hover { text-decoration: underline; text-underline-offset: 4px; }

/* ---------- Community correction to public rights content ---------- */
.correct-card { margin-top: 14px; }
.correct-toggle { display: flex; align-items: center; justify-content: space-between; gap: 12px; width: 100%; background: none; border: 0; font: inherit; font-weight: 700; color: var(--brand-ink); cursor: pointer; padding: 6px 0; text-align: start; }
.correct-toggle > span:first-child { display: inline-flex; align-items: center; gap: 10px; }
.correct-chevron { transition: transform .15s; }
.correct-toggle.open .correct-chevron { transform: rotate(180deg); }
.correct-body { display: grid; gap: 14px; margin-top: 12px; padding-top: 14px; border-top: 1px solid var(--line); }
.correct-note { font-size: .88rem; border-inline-start: 2px solid var(--gold); padding-inline-start: 12px; }
.correct-body textarea { font: inherit; padding: 10px 12px; border-radius: var(--r-sm); border: 1px solid var(--line-strong); background: var(--surface); color: var(--ink); width: 100%; box-sizing: border-box; resize: vertical; }
.correct-status:not(:empty) { color: var(--danger, #a12); font-size: .9rem; font-weight: 700; }

/* ================= MONEY ================= */
.money-inputs { display: grid; gap: 16px; }
.fld { display: grid; gap: 8px; font-weight: 600; font-size: 1rem; min-width: 0; }
/* Redesign v1.3 (profile p22): filled-required indicator — a green check once a
   spine-required field has a value. Text fields: absolutely-placed at inline-end;
   date field: inline check next to the label. */
.fld-vc { position: relative; }
.fld-vc > input { padding-inline-end: 38px; }
.fld-vc-ic { position: absolute; inset-inline-end: 12px; inset-block-end: 12px; display: none; place-items: center; inline-size: 20px; block-size: 20px; border-radius: 50%; background: var(--ok); color: #fff; }
.fld-vc.is-filled .fld-vc-ic { display: grid; }
.fld-vc-inline { display: inline-grid; place-items: center; inline-size: 18px; block-size: 18px; border-radius: 50%; background: var(--ok); color: #fff; vertical-align: middle; }
.fld input, .fld select { font: inherit; font-weight: 600; padding: 10px 12px; border-radius: var(--r-sm); border: 1px solid var(--line-strong); background: var(--surface); color: var(--ink); min-height: 44px; width: 100%; min-width: 0; box-sizing: border-box; }
.fld input:focus, .fld select:focus { border-color: var(--brand); }
.fld-check { display: flex; flex-direction: row-reverse; align-items: center; justify-content: flex-end; gap: 12px; }
.fld-check input { width: 26px; height: 26px; min-height: 0; accent-color: var(--brand); }
.money-result { border-top: 3px solid var(--gold); }
.money-big { font-family: var(--sans); font-size: clamp(2rem, 6vw, 2.8rem); font-weight: 800; color: var(--gold-ink); line-height: 1.04; letter-spacing: -1px; display: flex; align-items: baseline; gap: 6px; flex-wrap: wrap; font-variant-numeric: tabular-nums; }
.money-cur { font-size: .55em; }
.money-per { font-size: .3em; color: var(--ink-soft); font-weight: 700; letter-spacing: 0; }
.money-none { font-size: 1.4rem; color: var(--ink-soft); }
.money-explain { font-size: 1.08rem; margin: 16px 0 0; line-height: 1.6; }
.money-disc { font-size: .92rem; color: var(--ink-soft); margin: 14px 0 0; background: var(--surface-2); border-radius: var(--r-sm); padding: 12px 15px; }

/* ================= DOCUMENTS ================= */
.docs-ready { margin-bottom: 18px; }
.docs-list { display: grid; gap: 11px; }
.doc-row { display: flex; align-items: flex-start; gap: 12px; cursor: pointer; background: var(--surface); border: 1px solid var(--line); border-radius: var(--r); padding: 12px 16px; transition: border-color .15s, background .15s, box-shadow .15s, transform .12s; }
.doc-row:hover { border-color: var(--line-strong); background: var(--surface-2); }
.doc-have { background: var(--brand-wash); border-color: var(--brand); }
/* Redesign v1.3: the "I have this" checkbox as the mockup's round check circle —
   same input, same semantics, custom face. */
.doc-row input { appearance: none; -webkit-appearance: none; width: 26px; height: 26px; margin-top: 2px; flex: 0 0 auto; border: 2px solid var(--line-strong); border-radius: 50%; background: var(--surface); display: grid; place-items: center; cursor: pointer; transition: background .15s, border-color .15s; }
.doc-row input:checked { background: var(--ok) url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="white" stroke-width="3.4" stroke-linecap="round" stroke-linejoin="round"><path d="M5 12.5l4.5 4.5L19 7.5"/></svg>') center / 15px no-repeat; border-color: var(--ok); }
.doc-row input:focus-visible { outline: 3px solid var(--focus); outline-offset: 2px; }
.doc-text { display: grid; gap: 5px; }
.doc-label { font-weight: 700; font-size: 1.08rem; }
.doc-badge { justify-self: start; font-size: .78rem; font-weight: 800; padding: 3px 10px; border-radius: 999px; }
.doc-yes { background: var(--brand); color: #fff; }
.doc-req { background: var(--gold-wash); color: var(--gold-ink); }
.doc-opt { background: var(--surface-2); color: var(--ink-soft); border: 1px solid var(--line); }
.doc-note { font-size: .94rem; color: var(--ink-soft); }

/* ================= COMMITTEE ================= */
.c-card h3 { font-family: var(--serif); font-size: 1.35rem; margin: 0 0 12px; color: var(--brand-ink); }
.c-card ul { margin: 0; padding: 0; list-style: none; display: grid; gap: 11px; }
.c-card > ul li { display: flex; align-items: flex-start; gap: 12px; font-size: 1.06rem; line-height: 1.55; }
.c-card > ul li::before { content: "•"; color: var(--gold); font-weight: 900; font-size: 1.4rem; line-height: 1.05; }
.prec { display: grid; gap: 15px; margin-top: 6px; }
.prec li { display: grid; gap: 5px; }
.prec-cite { font-weight: 800; font-size: 1.02rem; }
.prec-cite .ok { color: var(--ok); }
.prec-hold { color: var(--ink-soft); font-size: 1rem; line-height: 1.5; }
.prec-lookup { margin: 16px 0 0; font-size: .94rem; color: var(--ink-soft); background: var(--surface-2); border-radius: var(--r-sm); padding: 13px 16px; }
.packet-cta { display: flex; align-items: center; justify-content: space-between; gap: 18px; flex-wrap: wrap; border-inline-start: 3px solid var(--gold); }
.packet-cta h3 { font-family: var(--serif); font-size: 1.3rem; margin: 0 0 4px; }
.packet-cta .muted { font-size: .95rem; max-width: 54ch; }

/* ================= PACKET ================= */
.packet-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 16px; flex-wrap: wrap; }
.packet { max-width: 800px; padding: 36px 34px; }
.pk-top { border-block-end: 2px solid var(--ink); padding-block-end: 18px; margin-block-end: 8px; }
.pk-brand-row { display: flex; align-items: baseline; justify-content: space-between; gap: 12px; margin-block-end: 14px; }
.pk-brand { font-weight: 800; color: var(--brand-ink); }
.pk-date { font-size: .84rem; color: var(--ink-faint); font-variant-numeric: tabular-nums; }
.pk-top h2 { font-size: clamp(1.6rem, 4vw, 2.1rem); margin: 0 0 16px; text-wrap: balance; }
.pk-meta { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1px; background: var(--line); border: 1px solid var(--line); border-radius: 10px; overflow: hidden; margin-block-end: 14px; }
.pk-cell { background: var(--surface); padding: 11px 14px; display: grid; gap: 3px; }
.pk-k { font-size: .72rem; letter-spacing: .05em; text-transform: uppercase; color: var(--ink-faint); font-weight: 700; }
.pk-v { font-weight: 700; font-size: 1rem; }
.pk-sec { padding-block: 18px; border-block-start: 1.5px solid var(--line); }
.pk-sec:first-of-type { border-block-start: 0; }
.pk-sec h2 { font-family: var(--sans); font-size: 1.1rem; font-weight: 800; color: var(--brand-ink); margin: 0 0 12px; display: flex; align-items: center; gap: 10px; }
.pk-num { flex: 0 0 auto; width: 27px; height: 27px; border-radius: 8px; background: var(--brand); color: #fff; display: grid; place-items: center; font-size: .85rem; font-weight: 800; }
.pk-sec ul { margin: 0; padding: 0; list-style: none; display: grid; gap: 10px; }
.pk-sec li { display: flex; align-items: flex-start; gap: 11px; font-size: 1.05rem; line-height: 1.5; }
.pk-sec li::before { content: "•"; color: var(--gold); font-weight: 900; font-size: 1.35rem; line-height: 1.05; }
.pk-foot { border-block-start: 2px solid var(--ink); margin-block-start: 14px; padding-block-start: 16px; }
.pk-foot-h { font-family: var(--sans); font-size: .95rem; color: var(--ink-soft); margin: 0 0 10px; font-weight: 800; }
.pk-disc { font-size: .92rem; color: var(--ink-soft); margin: 0 0 8px; }
.pk-note { margin: 18px 0 0; font-size: .82rem; color: var(--ink-faint); }

/* ================= PROFILE ================= */
.profile-card { display: flex; align-items: center; gap: 18px; }
.profile-card h2 { margin: 0; }
.claim-switch { display: grid; gap: 10px; }
.switch-row { display: flex; align-items: center; gap: 12px; background: var(--surface-2); border: 1px solid var(--line); border-radius: var(--r); padding: 12px 16px; cursor: pointer; font: inherit; font-weight: 700; color: var(--ink); text-align: start; }
.switch-row.active { background: var(--brand-wash); border-color: var(--brand); color: var(--brand-ink); }
.switch-now { margin-inline-start: auto; font-size: .76rem; font-weight: 600; background: var(--brand-wash); color: var(--brand-ink); border-radius: 999px; padding: 3px 11px; white-space: nowrap; flex: 0 0 auto; }
.share-row { display: flex; align-items: center; justify-content: space-between; gap: 12px; background: var(--surface-2); border: 1px solid var(--line); border-radius: var(--r); padding: 12px 16px; margin-top: 4px; }
.share-row strong { font-weight: 800; }
.share-log { list-style: none; margin: 14px 0 0; padding: 12px 0 0; border-top: 1px solid var(--line); display: grid; gap: 7px; font-size: .9rem; }
.share-log li { color: var(--ink); }

/* ===== Find a provider (marketplace) ===== */
.verified { font-size: .72rem; font-weight: 700; color: var(--ok); background: var(--ok-wash); border-radius: 999px; padding: 2px 9px; white-space: nowrap; }
.find-modes { display: flex; gap: 8px; margin-bottom: 14px; }
.fm { font: inherit; font-weight: 600; cursor: pointer; border: 1px solid var(--line-strong); background: var(--surface); color: var(--ink-soft); border-radius: 999px; padding: 8px 18px; min-height: 44px; display: inline-flex; align-items: center; }
.fm.on { background: var(--brand); color: #fff; border-color: transparent; }
.find-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); gap: 12px 14px; }
.find-go { margin-top: 16px; }
.win-head { display: flex; align-items: center; justify-content: space-between; margin: 18px 0 10px; font-weight: 700; }
.win-row { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; padding: 6px 0; }
.win-row select, .win-row input { font: inherit; font-weight: 600; padding: 9px 11px; border: 1px solid var(--line-strong); border-radius: 8px; background: var(--surface-2); color: var(--ink); min-height: 44px; }
.win-row span { color: var(--ink-soft); font-weight: 700; }
.win-del { margin-inline-start: auto; width: 44px; height: 44px; border-radius: 8px; border: 1px solid var(--line); background: var(--surface); color: var(--ink-soft); cursor: pointer; }
.win-del:hover { border-color: var(--crit); color: var(--crit); background: var(--crit-wash); }
.prov-list { display: grid; gap: 12px; }
.prov-card { display: flex; align-items: center; justify-content: space-between; gap: 14px; background: var(--surface); border: 1px solid var(--line); border-radius: 14px; padding: 16px 18px; box-shadow: var(--shadow); }
.prov-main { display: grid; gap: 3px; min-width: 0; }
.prov-name { font-weight: 800; font-size: 1.08rem; display: flex; align-items: center; gap: 8px; }
.prov-sub { color: var(--ink-soft); font-weight: 600; }
.prov-meta { color: var(--ink-faint); font-size: .9rem; }
.prov-when { font-size: .95rem; margin-top: 3px; }
.no-match { text-align: center; }
.find-online { margin-top: 12px; }
.prov-avatar { flex: 0 0 auto; width: 52px; height: 52px; border-radius: 14px; background: linear-gradient(145deg, var(--brand), var(--brand-deep)); color: #fff; display: grid; place-items: center; font-weight: 800; font-size: 1.3rem; box-shadow: 0 2px 6px rgba(9,40,45,.2), inset 0 1px 0 rgba(255,255,255,.15); }
.prov-open { background: none; border: 0; padding: 0; font: inherit; cursor: pointer; text-align: start; }
.prov-open:hover { text-decoration: underline; text-underline-offset: 3px; }
.online-badge { font-size: .72rem; font-weight: 800; color: var(--brand-ink); background: var(--brand-wash); border-radius: 999px; padding: 2px 9px; }
.prov-bio { margin: 4px 0 0; color: var(--ink-soft); font-size: .92rem; line-height: 1.5; }
.prov-acts { display: grid; gap: 7px; flex: 0 0 auto; justify-items: stretch; }
/* Provider profile page */
.prof-head { display: flex; gap: 16px; align-items: flex-start; padding-bottom: 16px; border-bottom: 1px solid var(--line); }
.prof-avatar { flex: 0 0 auto; width: 76px; height: 76px; border-radius: 18px; background: linear-gradient(145deg, var(--brand), var(--brand-deep)); color: #fff; display: grid; place-items: center; font-weight: 800; font-size: 2rem; box-shadow: 0 3px 9px rgba(9,40,45,.25), inset 0 1px 0 rgba(255,255,255,.15); }
.prof-id h1 { font-size: 1.3rem; display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }
.prof-sub { margin: 3px 0 0; color: var(--ink-soft); font-weight: 600; }
.prof-meta { margin: 3px 0 0; color: var(--ink-faint); font-size: .92rem; }
.prof-chips { display: flex; flex-wrap: wrap; gap: 6px; margin: 8px 0 4px; }
.prof-sec { padding: 15px 0; border-bottom: 1px solid var(--line); }
.prof-sec h2 { font-size: 1.05rem; margin: 0 0 8px; }
.prof-sec p { margin: 0; line-height: 1.65; }
.prof-sec ul { margin: 0; padding-inline-start: 20px; display: grid; gap: 5px; }
.prof-slots { display: flex; flex-wrap: wrap; gap: 8px; }
.prof-slot { font: inherit; font-weight: 700; cursor: pointer; background: var(--brand-wash); color: var(--brand-ink); border: 1px solid var(--brand); border-radius: 10px; padding: 9px 15px; transition: transform .12s, box-shadow .15s; }
.prof-slot:hover { border-color: var(--brand); }
.prof-disclaimer { margin: 14px 0 0; color: var(--ink-faint); font-size: .82rem; }
.doc-find { font: inherit; font-size: .82rem; font-weight: 700; color: var(--brand-ink); background: var(--brand-wash); border: 1px solid var(--brand); border-radius: 999px; padding: 10px 14px; min-height: 44px; cursor: pointer; justify-self: start; margin-top: 4px; }
.doc-find:hover { background: var(--surface); }
.find-doc-note { border-inline-start: 3px solid var(--gold); font-size: .95rem; padding: 10px 14px; box-shadow: none; margin-bottom: 10px; }
.f17-box { background: var(--gold-wash); border: 1px solid var(--gold); border-radius: 10px; padding: 11px 14px; font-size: .92rem; }
.f17-box p { margin: 5px 0 0; line-height: 1.55; }
.f17-sla { color: var(--gold-ink); font-weight: 700; font-size: .84rem; }
/* Guided match wizard */
.wiz-bar { margin-bottom: 6px; }
.wiz-pct { color: var(--ink-faint); font-size: .82rem; margin: 0 0 16px; }
.wiz-q { font-size: 1.25rem; margin: 0 0 12px; }
.wiz-opts { display: grid; gap: 8px; margin: 12px 0; }
.wopt { display: grid; gap: 3px; background: var(--surface); border: 1px solid var(--line); border-radius: 12px; padding: 11px 14px; cursor: pointer; transition: border-color .15s, background .15s, box-shadow .15s; }
.wopt:hover { border-color: var(--line-strong); box-shadow: var(--shadow); }
.wopt.on, .wopt:has(input:checked) { border-color: var(--brand); background: var(--brand-wash); }
.wopt input { position: absolute; opacity: 0; }
.wopt:has(input:focus-visible) { outline: 3px solid var(--focus); outline-offset: 2px; }
.wopt-l { font-weight: 600; }
.wopt-eg { color: var(--ink-soft); font-size: .88rem; }
.wiz-city { margin-top: 12px; max-width: 300px; }
.wiz-fund-extra { margin-top: 12px; }
.wiz-nav { display: flex; justify-content: space-between; align-items: center; margin-top: 18px; }
.fee-note { color: var(--ink-faint); font-size: .84rem; margin: 12px 2px 0; }
/* Guided intake (registration funnel) — reuses the wiz/wopt vocabulary */
.intake-conds { grid-template-columns: repeat(auto-fill, minmax(190px, 1fr)); margin-top: 6px; }
.intake-other, .intake-evdate { margin-top: 14px; max-width: 340px; }
.intake-sumrow { grid-template-columns: 1fr 1.4fr; }
.claim-row { grid-template-columns: 1fr 1.6fr; }
.claim-row .pk-v { font-weight: 700; }
/* Condition insights */
.cond-insights { margin-top: 14px; display: grid; gap: 10px; }
.cond-row { display: grid; gap: 8px; background: var(--surface-2); border: 1px solid var(--line); border-radius: 12px; padding: 12px 14px; }
.cond-name { font-weight: 800; }
.cond-acts { display: flex; flex-wrap: wrap; gap: 8px; }
.causal-toggle { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; font-size: 1rem; font-weight: 700; color: var(--ink-soft); min-height: 44px; }
.causal-toggle input[type="checkbox"] { width: 24px; height: 24px; accent-color: var(--brand); }
.causal-toggle input[type="date"] { font: inherit; padding: 6px 10px; border: 1px solid var(--line-strong); border-radius: 8px; background: var(--surface); color: var(--ink); }
.cond-note { font-size: .82rem; }
.causal-card { border-inline-start: 3px solid var(--gold); }
/* Funding-program card */
.prog-form { display: grid; grid-template-columns: repeat(auto-fit, minmax(170px, 1fr)); gap: 12px; align-items: end; }
.prog-row { display: grid; gap: 10px; background: var(--surface-2); border: 1px solid var(--line); border-radius: 12px; padding: 13px 15px; }
.prog-bar { height: 10px; }
.prog-row .btn-ghost { justify-self: start; }
.appt-list { display: grid; gap: 10px; }
.appt { display: flex; align-items: center; justify-content: space-between; gap: 12px; background: var(--surface-2); border: 1px solid var(--line); border-radius: 12px; padding: 13px 15px; }
.appt-accepted { border-inline-start: 3px solid var(--ok); }
.appt-requested { border-inline-start: 3px solid var(--gold); }
.appt-declined, .appt-cancelled { opacity: .6; }
.appt-completed { border-inline-start: 3px solid var(--brand); }
.link-reqs { border-inline-start: 3px solid var(--gold); }
.link-list { display: grid; gap: 10px; }
.link-row { display: flex; align-items: center; justify-content: space-between; gap: 12px; background: var(--surface-2); border: 1px solid var(--line); border-radius: 12px; padding: 13px 15px; }
.link-acts { display: flex; gap: 8px; flex: 0 0 auto; }
.meds-form { display: grid; gap: 10px; }
.meds-form textarea { font: inherit; padding: 12px 14px; border: 1px solid var(--line-strong); border-radius: 10px; background: var(--surface-2); color: var(--ink); resize: vertical; }
.meds-form textarea:focus { border-color: var(--brand); }
.meds-form button { justify-self: start; }
/* Family (rights unit) */
.fam-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); gap: 12px; margin-bottom: 12px; }
.fam-kids-head { display: flex; align-items: center; justify-content: space-between; font-weight: 700; margin: 6px 0 6px; }
.kid-row { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; padding: 6px 0; }
.kid-row input[type="text"] { flex: 1 1 160px; font: inherit; font-weight: 600; padding: 9px 12px; border: 1px solid var(--line-strong); border-radius: 8px; background: var(--surface-2); color: var(--ink); min-height: 44px; }
.kid-rec { display: flex; align-items: center; gap: 8px; font-size: .92rem; font-weight: 700; color: var(--ink-soft); }
.kid-rec input { width: 20px; height: 20px; accent-color: var(--brand); }
.kid-row .kid-year { flex: 0 1 110px; }
.kid-row .kid-tier { flex: 0 1 110px; font: inherit; padding: 9px 10px; min-height: 44px; border: 1px solid var(--line-strong); border-radius: 8px; background: var(--surface-2); color: var(--ink); }
.kid-row { border-bottom: 1px solid var(--line); }
/* Boolean toggle field. */
.toggle-fld { flex-direction: row; align-items: center; gap: 12px; cursor: pointer; font-weight: 700; font-size: .95rem; }
.toggle-fld input { width: 24px; height: 24px; accent-color: var(--brand); flex: none; }
.spouse-sub { border-inline-start: 3px solid var(--line-strong); }
.fam-save { margin-top: 10px; }
.fam-hint { display: flex; align-items: center; justify-content: space-between; gap: 12px; flex-wrap: wrap; margin-top: 14px; padding: 12px 14px; background: var(--gold-wash); border: 1px solid var(--gold); border-radius: 10px; font-size: .95rem; }
/* תעודת נכה wallet card */
.cert-card { background: linear-gradient(135deg, var(--brand), var(--brand-deep)); color: #fff; border-radius: 14px; padding: 18px 20px; max-width: 380px; box-shadow: var(--shadow-lift); display: grid; gap: 4px; margin-bottom: 12px; }
.cert-title { font-weight: 800; font-size: 1.1rem; letter-spacing: .02em; }
.cert-num { font-variant-numeric: tabular-nums; opacity: .92; }
.cert-valid { font-size: .88rem; opacity: .85; }
.cert-holder { margin-top: 8px; font-weight: 700; border-top: 1px solid rgba(255,255,255,.25); padding-top: 8px; }
.cert-form { display: grid; grid-template-columns: repeat(auto-fit, minmax(170px, 1fr)); gap: 12px; align-items: end; }
.appt-main { display: grid; gap: 6px; min-width: 0; }
.prov-prereq { font-size: .85rem; color: var(--gold-ink); margin-top: 3px; }
.appt-prereq { font-size: .82rem; font-weight: 700; border-radius: 8px; padding: 5px 10px; display: inline-block; border: 1px solid transparent; text-align: start; font-family: inherit; }
.appt-prereq.ok { color: var(--ok); background: var(--ok-wash); }
.appt-prereq.warn { color: var(--warn); background: var(--warn-wash); cursor: pointer; }
.appt-prereq.warn:hover { border-color: var(--warn); }
.notif-table { display: grid; gap: 2px; }
.notif-row { display: grid; grid-template-columns: 1.6fr repeat(3, 1fr); align-items: center; gap: 6px; border-radius: 9px; }
.notif-row:not(.notif-head):hover { background: var(--surface-2); }
.notif-head { font-size: .9rem; color: var(--ink-soft); font-weight: 800; border-block-end: 1.5px solid var(--line); padding: 6px 8px; }
.notif-cat { font-weight: 700; font-size: 1rem; padding-inline-start: 8px; }
/* Each toggle fills a 44px tap cell; the whole label is clickable. */
.notif-cell { display: flex; align-items: center; justify-content: center; gap: 8px; min-height: 44px; border-radius: 8px; cursor: pointer; }
.notif-cell:hover { background: var(--surface-2); }
.notif-cell input { width: 24px; height: 24px; accent-color: var(--brand); cursor: pointer; }
.notif-cell input:not(:checked) { outline: 1px solid var(--line-strong); outline-offset: -1px; border-radius: 4px; }
.notif-cell-ch { display: none; font-size: .92rem; color: var(--ink-soft); }
/* Narrow: drop the header, stack rows into per-category blocks with each
   toggle showing its own channel name. */
@media (max-width: 560px) {
  .notif-head { display: none; }
  .notif-row { grid-template-columns: 1fr; gap: 2px; padding: 8px 4px; border: 1px solid var(--line); border-radius: 10px; margin-bottom: 8px; }
  .notif-cat { padding: 2px 8px 6px; }
  .notif-cell { justify-content: flex-start; padding-inline: 10px; }
  .notif-cell-ch { display: inline; }
}

/* ================= RESPONSIVE ================= */
@media (max-width: 900px) {
  /* Mobile: drop the two-track grid entirely — a simple centred block can't blow out */
  .auth { display: block; }
  .auth-stage { display: block; inline-size: 100%; padding: 20px 16px 24px; }
  .auth-card { margin-inline: auto; max-inline-size: 100%; }
  .auth-brand { display: none; }
  .auth-card { border-radius: var(--r-lg); background: var(--surface); box-shadow: var(--shadow-lift); padding: 16px 18px 18px; }
  /* v6 centred brand (mark + wordmark + tagline), shown on mobile after the language row */
  .auth-brand-m { display: flex; flex-wrap: wrap; justify-content: center; align-items: center; gap: 8px; margin: 4px 0 6px; }
  .auth-step { padding-block-end: 4px; }
  .mainnav { display: none; }
  .trust-badge { display: none; }
  .tabbar { display: flex; }
  .app-body { padding-bottom: 90px; }
  .stat-grid { grid-template-columns: repeat(2, 1fr); gap: 8px; }
  .stat { padding: 9px 12px; min-height: 56px; }
  .dash-cols, .rights-list, .quick-grid { grid-template-columns: 1fr; }
  .situations { grid-template-columns: 1fr; }
  .foot-inner { grid-template-columns: 1fr 1fr; }
}
@media (max-width: 520px) { .foot-inner { grid-template-columns: 1fr; } }
/* Phone compaction: chrome and controls tighten so content leads. Root drops a
   notch (17px — still above the 16px console base); tap targets stay ≥44px. */
@media (max-width: 640px) {
  :root { font-size: 16px; }
  .topnav-inner { gap: 8px; min-height: 48px; padding: 0 12px; }
  .topnav .brand { font-size: 1rem; }
  .icon-btn { width: 44px; height: 44px; font-size: .95rem; }
  .app-body { padding: 14px 14px 90px; }
  .screen-head { padding: 2px 2px 10px; }
  .screen-head h1 { font-size: 1.25rem; }
  .muted-lg { font-size: .98rem; margin-top: .35rem; }
  .card { padding: 12px 14px; border-radius: 12px; }
  .situation { min-height: 58px; padding: 14px 2px; font-size: 1rem; gap: 12px; }
  .situations { padding: 2px 14px; }
  .find-modes { flex-wrap: wrap; gap: 6px; }
  .fm { padding: 8px 14px; font-size: .92rem; }
  .wopt { padding: 11px 13px; border-radius: 10px; }
  .wiz-q { font-size: 1.1rem; }
  .tab { font-size: .68rem; padding: 6px 2px; }
  .tab-ic { height: 20px; }
  .tab-ic svg { width: 19px; height: 19px; }
  .claim-emoji { width: 42px; height: 42px; border-radius: 11px; }
  .hero-empty h1 { font-size: 1.45rem; }
}

/* ================= PRINT (packet) ================= */
@media print {
  .topnav, .tabbar, .site-foot, .app-topline, .no-print, .packet-head .btn, .screen-head { display: none !important; }
  .app-body { max-width: 100%; padding: 0; }
  .packet { border: 0; box-shadow: none; padding: 0; margin: 0; max-width: 100%; }
  body { background: #fff; }
  .pk-sec { break-inside: avoid; }
}
@media (prefers-reduced-motion: reduce) { * { transition: none !important; animation: none !important; } }

/* Profile: secondary cards flow two-up on wide screens (long-page review finding) */
.profile-grid { display: grid; gap: 12px; }
.profile-grid > .card { margin-bottom: 0; }
/* profile is single-column (see .profile-page) */
/* Find: secondary filters behind a disclosure */
.find-more { margin-top: 12px; }
.find-more summary { cursor: pointer; font-weight: 700; color: var(--brand-ink); padding: 8px 2px; }
.find-more[open] summary { margin-bottom: 10px; }

/* ---------- Case-file attachments + packet compilation ---------- */
.narrow-card { max-width: 720px; }
.doc-item { margin-bottom: 10px; }
.doc-item .doc-row { margin-bottom: 0; }
.doc-files { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; padding: 5px 4px 0; }
.file-chip { display: inline-flex; align-items: center; gap: 8px; background: var(--surface-2); border: 1px solid var(--line); border-radius: 12px; padding: 6px 6px 6px 12px; font-size: .8rem; color: var(--ink-soft); max-width: 100%; }
.file-chip .file-main { display: grid; gap: 1px; min-width: 0; }
.file-chip .file-meta { font-size: .72rem; color: var(--ink-faint); }
.file-chip.file-nameonly { border-color: var(--gold); background: var(--gold-wash); }
.file-chip .file-warn { font-size: .74rem; color: var(--gold); font-weight: 600; }
.file-del { flex: none; background: none; border: 0; cursor: pointer; color: var(--ink-soft); font-size: .9rem; width: 40px; height: 40px; border-radius: 999px; display: grid; place-items: center; }
.file-del:hover, .file-del:focus-visible { color: var(--crit); background: var(--crit-wash); }
.doc-reuse { font-size: .74rem; font-weight: 700; color: var(--brand-ink); border: 1px solid var(--line-strong); border-radius: 6px; padding: 1px 7px; }
.doc-attach { background: none; border: 0; cursor: pointer; color: var(--brand-ink); font: inherit; font-size: .85rem; font-weight: 600; padding: 4px 8px; min-height: 40px; display: inline-flex; align-items: center; }
.doc-attach:hover { text-decoration: underline; }
.doc-find { min-height: 40px; }
/* Optional documents subordinated under a heading; ticking never reorders. */
.docs-opt-head { font-size: .82rem; font-weight: 800; color: var(--ink-faint); letter-spacing: .02em; margin: 16px 2px 4px; padding-top: 10px; border-top: 1px solid var(--line); }
/* v3 counted section headers */
.docs-sec-head { display: flex; align-items: center; gap: 8px; margin: 18px 2px 8px; }
.docs-sec-head:first-child { margin-top: 4px; }
.docs-sec-head h3 { font-size: .98rem; font-weight: 800; color: var(--ink); margin: 0; }
.dsh-n { color: var(--ink-soft); font-weight: 700; }
.dsh-dot { inline-size: 9px; block-size: 9px; border-radius: 50%; flex: 0 0 auto; }
.dsh-req { background: var(--brand); }
.dsh-opt { background: var(--gold); }
.doc-recommended { opacity: .92; }
.doc-recommended .doc-label { font-weight: 600; }
.pk-table { display: grid; }
.pk-row { display: grid; grid-template-columns: 1.3fr auto 1fr; gap: 12px; align-items: baseline; padding: 7px 0; border-block-end: 1px solid var(--line); font-size: .92rem; }
.pk-row:last-child { border-block-end: 0; }
.pk-yes { color: var(--ok); font-weight: 600; }
.pk-no { color: var(--crit); font-weight: 600; }
.pk-files { color: var(--ink-faint); font-size: .85rem; }
.pk-sess { color: var(--ink-soft); }
.pk-annex { margin: 0 0 16px; break-inside: avoid; }
.pk-annex img { max-width: 100%; max-height: 480px; border: 1px solid var(--line); border-radius: 8px; }
.pk-annex figcaption { font-size: .82rem; color: var(--ink-faint); margin-top: 5px; }

/* ---------- Taxonomy v2: funding hints + access badges ---------- */
.fund-hint { font-weight: 400; font-size: .8rem; color: var(--ink-faint); line-height: 1.45; }
.fund-note { font-size: .85rem; color: var(--ink-soft); background: var(--surface-2); border-radius: 10px; padding: 10px 14px; margin: 12px 0 0; line-height: 1.55; }
.access-badge { font-size: .72rem; font-weight: 600; color: var(--warn); background: var(--warn-wash); border-radius: 999px; padding: 2px 9px; white-space: nowrap; margin-inline-start: 4px; }
.conflict-card { border-inline-start: 3px solid var(--warn); }
.f17-sla bdi { font-weight: 600; }

/* ---------- Signups + proxy authority (RBAC, 2026-08-13) ---------- */
.signup-type { border: 0; padding: 0; margin: 0 0 14px; display: grid; gap: 8px; }
.stype { display: flex; align-items: center; gap: 10px; background: var(--surface); border: 1px solid var(--line); border-radius: 10px; padding: 11px 14px; cursor: pointer; font-size: .95rem; }
.stype:has(input:checked) { border-color: var(--brand); background: var(--brand-wash); }
.stype input { width: 20px; height: 20px; accent-color: var(--brand); }

/* ---- Login / Registration — 1:1 rebuild of mockup v6 (p3 login / p4 register) ---- */
/* language row: text links + one leading globe; selected gets a teal underline */
.auth-langs { display: flex; flex-wrap: wrap; align-items: center; gap: 13px; margin-bottom: 16px; }
.auth-lang { font: inherit; font-size: .92rem; font-weight: 700; cursor: pointer; border: 0; background: none; color: var(--ink-soft); padding: 3px 1px 6px; border-bottom: 2px solid transparent; display: inline-flex; align-items: center; gap: 5px; min-height: 34px; }
.auth-lang:hover { color: var(--brand-ink); }
.auth-lang.on { color: var(--brand-ink); border-bottom-color: var(--brand); background: none; }
.auth-lang .al-globe { display: none; }
.auth-lang:first-child .al-globe { display: inline-flex; color: var(--ink-faint); }
/* centred brand (mark + wordmark + tagline) — mark left of the LTR wordmark */
/* display comes from .auth-brand-m rules (none on desktop, flex in the mobile block) — a base display:flex here USED to win the cascade and leak the mobile band onto desktop */
.v6-brand { flex-wrap: wrap; justify-content: center; align-items: center; gap: 8px; direction: ltr; }
.v6-brand .v6-tag { direction: rtl; }
.v6-brand .v6-mark { color: var(--brand); display: inline-flex; }
.v6-brand .v6-word { font-weight: 800; font-size: 1.7rem; color: var(--brand-ink); letter-spacing: -.01em; }
.v6-brand .v6-tag { flex-basis: 100%; text-align: center; margin: 3px 0 0; font-size: .88rem; color: var(--ink-soft); }
/* mode toggle: register | login cards */
.auth-modes { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; margin: 16px 0 18px; }
.auth-mode { display: flex; align-items: center; justify-content: center; gap: 9px; cursor: pointer; font: inherit; text-align: start; background: var(--surface); border: 1.5px solid var(--line-strong); border-radius: 12px; padding: 13px 12px; color: var(--ink-soft); transition: background .15s, border-color .15s, color .15s; }
.auth-mode .am-ic { flex: 0 0 auto; display: inline-flex; }
.auth-mode .am-txt { display: grid; gap: 1px; }
.auth-mode .am-txt b { font-weight: 800; font-size: 1rem; }
.auth-mode .am-txt span { font-size: .74rem; opacity: .85; }
.auth-mode:hover { border-color: var(--brand); }
.auth-mode.on { background: var(--brand); border-color: transparent; color: #fff; box-shadow: var(--shadow); }
/* field head: label + info/icon */
.auth-fieldhead { display: flex; align-items: center; justify-content: flex-end; gap: 8px; margin: 16px 2px 9px; color: var(--brand-ink); }
.auth-fieldhead:first-of-type { margin-top: 2px; }
.afh-label { font-weight: 800; font-size: .98rem; }
.afh-hint { font-weight: 500; font-size: .78rem; color: var(--ink-soft); margin-inline-end: auto; }
.afh-ic, .afh-info { display: inline-flex; color: var(--brand-ink); }
.afh-info { color: var(--ink-faint); order: 9; }
/* registration cards — text (start) + icon (end); selected fills teal */
.stype-cards { border: 0; padding: 0; margin: 0; min-inline-size: 0; }
.stype-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.stype-card { position: relative; display: flex; align-items: center; gap: 10px; background: var(--surface); border: 1.5px solid var(--line-strong); border-radius: 12px; padding: 12px 13px; cursor: pointer; transition: border-color .15s, background .15s, box-shadow .15s, color .15s; min-inline-size: 0; }
.stype-card input { position: absolute; opacity: 0; inline-size: 1px; block-size: 1px; }
.stype-card .sc-txt { display: grid; gap: 2px; min-inline-size: 0; flex: 1 1 auto; }
.stype-card .sc-t { font-weight: 800; font-size: .95rem; }
.stype-card .sc-d { font-size: .74rem; color: var(--ink-soft); line-height: 1.3; }
.stype-card .sc-ic { flex: 0 0 auto; color: var(--ink-soft); display: inline-flex; }
.stype-card:hover { border-color: var(--brand); }
.stype-card:has(input:checked) { border-color: transparent; background: var(--brand); box-shadow: var(--shadow); }
.stype-card:has(input:checked) .sc-t { color: #fff; }
.stype-card:has(input:checked) .sc-d { color: rgba(255,255,255,.85); }
.stype-card:has(input:checked) .sc-ic { color: #fff; }
.stype-card:has(input:focus-visible) { outline: 3px solid var(--focus); outline-offset: 2px; }
/* ID input with a trailing (inline-end = left in RTL) icon */
.auth-input-wrap { position: relative; }
.auth-input-wrap .aiw-ic { position: absolute; inset-inline-end: 14px; top: 50%; transform: translateY(-50%); color: var(--ink-faint); pointer-events: none; }
.auth-input-wrap input { font: inherit; font-weight: 600; inline-size: 100%; padding-block: 15px; padding-inline: 16px 44px; border-radius: var(--r-sm); border: 1.5px solid var(--line-strong); background: var(--surface); color: var(--ink); min-block-size: 54px; text-align: start; }
.auth-input-wrap input:focus { border-color: var(--brand); outline: none; }
/* login ID field: id-card icon (end/left) + a green check (start/right) once valid */
.v6-login-id input { padding-inline: 44px 44px; }
.v6-login-id .aiw-check { position: absolute; inset-inline-start: 14px; top: 50%; transform: translateY(-50%); color: var(--ok); display: none; pointer-events: none; }
.v6-login-id.valid .aiw-check { display: inline-flex; }
.v6-login-id.valid input { border-color: var(--ok); }
/* SMS code boxes — even row; RTL so entry starts on the right box (Hebrew-natural) */
.auth-view .code-boxes { justify-content: space-between; gap: 10px; direction: rtl; margin: 0 0 8px; }
.auth-view .code-box { flex: 1 1 0; inline-size: auto; min-inline-size: 0; block-size: 62px; font-size: 1.6rem; letter-spacing: 0; }
/* generic v6 card (rounded, subtle) used by login rows + notes */
.v6-card { background: var(--surface); border: 1.5px solid var(--line); border-radius: 12px; padding: 14px 16px; margin-bottom: 12px; }
.v6-card .v6-ic { display: inline-flex; color: var(--ink-soft); flex: 0 0 auto; }
.v6-idrow { display: flex; align-items: center; gap: 10px; }
.v6-idrow .v6-check { color: var(--ok); display: inline-flex; flex: 0 0 auto; }
.v6-idrow .v6-idrow-label { flex: 1 1 auto; text-align: end; font-weight: 800; color: var(--ink); }
.v6-idrow .v6-ic { color: var(--brand-ink); }
.v6-smscard .v6-cardhead { display: flex; align-items: center; justify-content: flex-end; gap: 8px; margin-bottom: 11px; }
.v6-smscard .v6-cardhead-label { font-weight: 800; color: var(--brand-ink); }
.v6-smscard .v6-cardhead .v6-ic { color: var(--brand-ink); }
.v6-hint { display: flex; align-items: center; justify-content: flex-end; gap: 6px; margin: 0; font-size: .78rem; color: var(--ink-soft); }
.v6-hint .v6-ic { color: var(--ink-faint); }
/* resend-code link */
.v6-resend { background: none; border: 0; color: var(--brand-ink); font: inherit; font-size: .82rem; font-weight: 700; cursor: pointer; text-decoration: underline; text-underline-offset: 3px; padding: 5px 2px 0; }
.v6-resend:hover { color: var(--brand); }
.v6-smscard .v6-resend { display: block; margin-inline-start: auto; }
.v6-reg-hint { display: flex; align-items: center; justify-content: flex-end; flex-wrap: wrap; gap: 6px; margin: 6px 0 12px; font-size: .78rem; color: var(--ink-soft); }
.v6-reg-hint .v6-resend { padding: 0; }
/* login anon button + register anon toggle + notes — shared row layout */
.v6-anonbtn, .v6-anontoggle, .v6-privacy, .v6-localnote { display: flex; align-items: center; gap: 12px; text-align: start; inline-size: 100%; }
.v6-anonbtn { cursor: pointer; font: inherit; }
.v6-anonbtn:hover { border-color: var(--brand); }
.v6-anon-txt, .v6-priv-txt { display: grid; gap: 2px; flex: 1 1 auto; min-inline-size: 0; }
.v6-anon-txt b { font-weight: 800; font-size: .98rem; color: var(--ink); }
.v6-anon-txt span { font-size: .78rem; color: var(--ink-soft); }
.v6-anonbtn .v6-anon-ic { color: var(--brand-ink); }
.v6-priv-txt b { font-weight: 800; font-size: .9rem; color: var(--ink); }
.v6-priv-txt span { font-size: .78rem; color: var(--ink-soft); }
.v6-privacy { background: var(--ok-wash); border-color: color-mix(in srgb, var(--ok) 35%, transparent); }
.v6-privacy .v6-priv-ic { color: var(--ok); }
.v6-anontoggle { background: var(--ok-wash); border-color: color-mix(in srgb, var(--ok) 30%, transparent); cursor: pointer; }
.v6-anontoggle .v6-anon-ic { color: var(--ok); }
.v6-localnote { background: var(--surface-2); }

/* Two-door entry (demo vs real app) + real sign-in */
.door-grid { display: grid; gap: 12px; margin: 6px 0 14px; }
.door-card { display: flex; align-items: center; gap: 14px; inline-size: 100%; text-align: start; cursor: pointer; font: inherit; background: var(--surface-2); border: 1px solid var(--line); border-radius: var(--r-lg); padding: 16px 18px; color: var(--ink); transition: border-color .15s, box-shadow .15s; }
.door-card:hover { border-color: var(--brand); box-shadow: 0 2px 12px color-mix(in srgb, var(--brand) 14%, transparent); }
.door-card .door-ic { flex: 0 0 auto; inline-size: 44px; block-size: 44px; display: grid; place-items: center; border-radius: 12px; background: var(--brand); color: #fff; }
.door-card .door-txt { display: grid; gap: 3px; flex: 1 1 auto; min-inline-size: 0; }
.door-card .door-txt b { font-weight: 800; font-size: 1.02rem; color: var(--ink); }
.door-card .door-txt span { font-size: .82rem; color: var(--ink-soft); line-height: 1.45; }
.door-card .door-arrow { color: var(--brand); font-size: 1.15rem; flex: 0 0 auto; }
.door-note { font-size: .82rem; color: var(--ink-soft); line-height: 1.55; margin: 4px 2px 0; }
.door-back, .door-toggle-reg { background: none; border: 0; color: var(--brand); font: inherit; cursor: pointer; padding: 6px 2px; }
.door-back { margin-bottom: 6px; }
.door-toggle-reg { display: block; margin: 12px auto 0; }
.auth-msg { min-block-size: 1.2em; font-size: .86rem; color: var(--crit); margin: 8px 2px 0; text-align: center; }
#real-reg-wrap { display: grid; gap: 10px; margin-bottom: 10px; }
.v6-localnote .v6-priv-ic { color: var(--ink-soft); }
/* the recommended-anonymous switch */
.v6-switch { position: relative; flex: 0 0 auto; inline-size: 44px; block-size: 26px; }
.v6-switch input { position: absolute; opacity: 0; inline-size: 100%; block-size: 100%; margin: 0; cursor: pointer; }
.v6-slider { position: absolute; inset: 0; background: var(--line-strong); border-radius: 999px; transition: background .15s; }
.v6-slider::before { content: ""; position: absolute; inset-inline-start: 3px; top: 3px; inline-size: 20px; block-size: 20px; background: #fff; border-radius: 50%; transition: transform .15s; box-shadow: 0 1px 2px rgba(0,0,0,.25); }
.v6-switch input:checked + .v6-slider { background: var(--ok); }
.v6-switch input:checked + .v6-slider::before { transform: translateX(18px); }
[dir="rtl"] .v6-switch input:checked + .v6-slider::before { transform: translateX(-18px); }
.v6-switch input:focus-visible + .v6-slider { outline: 3px solid var(--focus); outline-offset: 2px; }
/* continue button (register) */
.v6-continue { display: inline-flex; align-items: center; justify-content: center; gap: 9px; margin-top: 4px; }
.v6-continue .vc-arrow { font-size: 1.1em; }
/* owner footer (mockup: 🔒 SR SOFTWARES LTD) */
.auth-owner { display: flex; flex-direction: column; align-items: center; gap: 2px; font-size: .8rem; color: var(--ink-soft); }
.auth-owner .ao-name { font-weight: 800; letter-spacing: .04em; color: var(--ink-soft); }
.auth-owner .ao-copy { font-size: .74rem; color: var(--ink-faint); }
.subject-switch { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; margin: 0 0 14px; }
.proxy-add { display: grid; grid-template-columns: 1.4fr 1fr 1fr auto; gap: 10px; align-items: end; margin-top: 8px; }
.proxy-add .fld { gap: 4px; font-size: .82rem; font-weight: 700; color: var(--ink-soft); }
.proxy-add .proxy-add-btn { min-height: 44px; }
@media (max-width: 560px) { .proxy-add { grid-template-columns: 1fr 1fr; } .proxy-add .proxy-add-btn { grid-column: 1 / -1; } }
.share-pick { flex: 1; }

/* ---------- Professional representatives (BL/73) ---------- */
.rep-row { align-items: flex-start; flex-wrap: wrap; }
.rep-row .rep-scopes { font-size: .8rem; }
.rep-actions { display: flex; gap: 8px; align-items: center; flex-wrap: wrap; }
.rep-add { grid-template-columns: 1.4fr 1fr 1fr 1fr auto; }
.rep-add .rep-subj-field { grid-column: 1 / -1; font-size: .82rem; font-weight: 700; color: var(--ink-soft); }
.rep-add .rep-subj-field .check-group { grid-template-columns: repeat(auto-fill, minmax(180px, 1fr)); margin-top: 4px; }
@media (max-width: 560px) { .rep-add { grid-template-columns: 1fr 1fr; } .rep-add .proxy-add-btn { grid-column: 1 / -1; } }
.bl73-doc .bl73-legal { font-size: .82rem; color: var(--ink-soft); margin-top: 6px; }
.bl73-table .bl73-subj { grid-template-columns: 1.4fr auto 1.4fr; align-items: center; }
.bl73-subj .bl73-sig { font-variant-numeric: tabular-nums; color: var(--ink-soft); text-align: end; }
.pk-warn { border: 1px solid var(--gold); background: var(--gold-wash); border-radius: var(--r); padding: 8px 12px; margin-top: 8px; }
.pk-warn p { font-size: .84rem; margin: 2px 0; }

/* ---------- Term glossary (ⓘ popovers) + language picker ---------- */
.term { position: relative; display: inline; }
.term-translit { font-style: italic; color: var(--ink-soft); }
.term-i { position: relative; display: inline-grid; place-items: center; width: 18px; height: 18px; margin-inline-start: 4px; vertical-align: 2px; border: 1.2px solid var(--brand); border-radius: 999px; background: none; color: var(--brand-ink); font-size: .68rem; font-weight: 700; font-family: var(--serif); font-style: italic; cursor: pointer; padding: 0; line-height: 1; }
/* Expand the tap area to ~30px without enlarging the inline badge. */
.term-i::after { content: ""; position: absolute; inset: -6px; }
.term-i:hover { background: var(--brand-wash); }
.term-pop { position: absolute; z-index: 60; top: calc(100% + 7px); inset-inline-start: 0; min-width: 260px; max-width: min(340px, calc(100vw - 24px)); background: var(--surface); border: 1px solid var(--line-strong); border-radius: 10px; box-shadow: var(--shadow-lift); padding: 12px 14px; font-size: .88rem; font-weight: 400; line-height: 1.55; color: var(--ink); text-align: start; white-space: normal; }
.term-pop strong { color: var(--brand-ink); }
@media (hover: hover) { .term:hover > .term-pop[hidden], .term-i:focus-visible + .term-pop[hidden] { display: block !important; } }
.lang-row { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 10px; }
@media (max-width: 480px) { .term-pop { min-width: 0; inset-inline-start: auto; inset-inline-end: 0; } }

/* ---------- Profile masonry + med/condition pickers ---------- */
/* Profile = a full-height workspace screen (mockup Phase-1): the rail is its own
   column, and the identity head + completeness live at the top of the SAME main
   column as the section, so there's exactly one content scroll — never a rolling
   page. While the profile is showing, the app frame stops scrolling and the
   marketing footer steps aside (it's an app screen, not a document). */
.app-scroll:has(.profile-page) { overflow: hidden; }
.app-scroll:has(.profile-page) .site-foot { display: none; }
.app-body:has(.profile-page) { flex: 1 1 auto; min-height: 0; padding: 0; display: flex; }
#screen:has(.profile-page) { flex: 1 1 auto; min-height: 0; display: flex; flex-direction: column; }
.profile-page { width: 100%; flex: 1 1 auto; min-height: 0; display: flex; flex-direction: column; }
.profile-page > .section-shell { flex: 1 1 auto; min-height: 0; margin-top: 0; }
.profile-page .section-body { overflow-y: auto; min-height: 0; overscroll-behavior: contain; padding: 20px clamp(16px, 2.2vw, 26px) 28px; }
.profile-page > .btn-quiet { flex: 0 0 auto; align-self: flex-start; margin: 4px clamp(16px, 2.2vw, 26px) 10px; }
/* Desktop: rail is a fixed-width, independently-scrolling column with a divider. */
@media (min-width: 721px) {
  .profile-page > .section-shell { grid-template-columns: 236px 1fr; grid-template-rows: minmax(0, 1fr); gap: 0; }
  .profile-page .section-nav { align-self: stretch; position: static; overflow-y: auto; padding: 16px 14px; border-inline-end: 1px solid var(--line); }
}
/* Mobile: horizontal chip rail on top, section fills the rest and scrolls. */
@media (max-width: 720px) {
  .profile-page > .section-shell { grid-template-rows: auto 1fr; min-height: 0; }
  .profile-page .section-nav { padding: 10px 12px; }
  .profile-page .section-body { padding: 14px 14px 24px; }
}
/* Identity head — lives at the top of the main column, above the section. */
.profile-head { display: flex; align-items: center; flex-wrap: wrap; gap: 12px 18px; background: var(--surface); border: 1px solid var(--line); border-radius: var(--r-lg); padding: 16px 18px; margin-bottom: 16px; }
.profile-head .avatar-lg { flex: 0 0 auto; }
.profile-head .ph-meta { flex: 1 1 180px; min-width: 150px; }
.profile-head .ph-meta h1 { margin: 0 0 3px; font-size: clamp(1.15rem, 2vw, 1.4rem); }
.profile-head .ph-meta .muted { margin: 0; font-size: .92rem; }
.ph-complete { flex: 1 1 100%; }
.ph-complete-top { display: flex; justify-content: space-between; align-items: baseline; font-size: .82rem; color: var(--ink-soft); margin-bottom: 5px; }
.ph-complete-label { font-weight: 600; }
.ph-complete-pct { font-weight: 800; color: var(--ink); font-variant-numeric: tabular-nums; }
.ph-complete .cbar { height: 7px; border-radius: 999px; background: var(--surface-2); overflow: hidden; }
.ph-complete .cbar > span { display: block; height: 100%; background: var(--brand); border-radius: 999px; transition: width .3s; }
.ph-complete.done .cbar > span { background: var(--ok); }
.ph-missing { margin: 7px 0 0; font-size: .8rem; color: var(--ink-faint); line-height: 1.4; }
.ph-missing-list { color: var(--ink-soft); }

/* ---- Workspace tool screens (find / rights / docs / committee) ---- */
/* Same app-screen feel as the profile: while one is showing, the app frame stops
   scrolling and the marketing footer steps aside, the screen head PINS to the top,
   and the content below it scrolls in one bounded region — not a rolling page. */
.app-scroll:has(#screen.screen-ws) { overflow: hidden; }
.app-scroll:has(#screen.screen-ws) .site-foot { display: none; }
.app-body:has(#screen.screen-ws) { flex: 1 1 auto; min-height: 0; padding: 0; display: flex; }
#screen.screen-ws { flex: 1 1 auto; min-height: 0; overflow-y: auto; overscroll-behavior: contain; padding: 0 clamp(16px, 3vw, 32px) 40px; }
#screen.screen-ws > .screen-head { position: sticky; top: 0; z-index: 3; background: var(--ground); padding: clamp(12px, 2vw, 20px) 0 12px; margin-bottom: 4px; }
/* Balanced multi-column: cards flow and the browser equalises column heights,
   so both columns fill and the section is ~half as tall as a single stack — no
   giant lopsided column with an empty half beside it (the "rolling page" bug). */
.profile-cols { columns: 2; column-gap: 16px; }
.profile-cols > .card { break-inside: avoid; margin-bottom: 12px; }
@media (max-width: 900px) { .profile-cols { columns: 1; } }
/* Section eyebrow between the identity block and the card columns. */
.profile-section-label { font-size: .78rem; font-weight: 800; letter-spacing: .04em; text-transform: uppercase; color: var(--ink-faint); margin: 18px 2px 2px; }

.chip-list { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 12px; }
/* A chip is a pill wrapping an editable label button + a remove button. */
.med-chip { display: inline-flex; align-items: stretch; background: var(--surface-2); border: 1px solid var(--line); border-radius: 999px; overflow: hidden; }
.med-chip .chip-edit { font: inherit; font-size: 1rem; line-height: 1.2; cursor: pointer; background: none; border: 0; color: var(--ink); padding: 7px 6px 7px 14px; min-height: 40px; }
.med-chip .chip-edit:hover { color: var(--brand); }
.med-chip-linked { border-color: var(--gold); background: var(--gold-wash); }
/* Non-colour marker so the event link is legible without relying on hue. */
.chip-tag { font-size: .72rem; font-weight: 800; color: var(--gold-ink, var(--brand)); border: 1px solid var(--gold); border-radius: 6px; padding: 1px 5px; margin-inline-end: 2px; }
.chip-x { background: none; border: 0; cursor: pointer; color: var(--ink-soft); font-size: 1rem; width: 40px; min-height: 40px; border-radius: 999px; display: grid; place-items: center; flex: none; }
.chip-x:hover, .chip-x:focus-visible { color: var(--crit); background: var(--crit-wash); }
/* Standalone condition chips keep the ✕ inside a padded pill. */
.med-chip > span:first-child { display: inline-flex; align-items: center; padding: 5px 6px 5px 14px; font-size: 1rem; }

/* Picker: labelled name (combobox) + dose + Add, wrapping on narrow widths. */
.picker { display: grid; grid-template-columns: 2fr 1fr auto; gap: 10px; align-items: end; }
.picker-field { display: grid; gap: 4px; position: relative; min-width: 0; }
.picker-field > label { font-size: .82rem; font-weight: 700; color: var(--ink-soft); }
.picker-field input { font: inherit; padding: 10px 12px; border: 1px solid var(--line-strong); border-radius: 9px; background: var(--surface); color: var(--ink); min-height: 44px; min-width: 0; width: 100%; }
.picker-field input::placeholder { color: var(--ink-soft); opacity: 1; }
.picker .picker-add { min-height: 44px; align-self: end; }
.fld-error { color: var(--crit); font-size: .82rem; margin: 2px 0 0; }
/* Filtering suggestion list under the combobox input. */
.combo-list { position: absolute; z-index: 20; inset-inline: 0; top: calc(100% + 4px); margin: 0; padding: 4px; list-style: none; background: var(--surface); border: 1px solid var(--line-strong); border-radius: 10px; box-shadow: var(--shadow-panel); max-height: 260px; overflow-y: auto; }
.combo-list li { padding: 10px 12px; min-height: 42px; display: flex; align-items: center; border-radius: 7px; cursor: pointer; font-size: 1rem; }
.combo-list li:hover, .combo-list li:focus-visible { background: var(--surface-2); }
@media (max-width: 560px) { .picker { grid-template-columns: 1fr; } .picker .picker-add { width: 100%; } }

/* Profile v2 field blocks — shared by the demographic/clinical/financial cards. */
.v2-fields { display: grid; gap: 14px; }
.fld-label { display: block; font-size: .9rem; font-weight: 700; color: var(--ink); margin-bottom: 6px; }
.sens { font-size: .68rem; font-weight: 700; border-radius: 5px; padding: 1px 6px; margin-inline-start: 6px; vertical-align: 1px; }
.sens-phi { color: var(--gold); border: 1px solid var(--gold); background: var(--gold-wash); }
.sens-opt { color: var(--ink-soft); border: 1px solid var(--line-strong); }
.derived { margin: -6px 0 0; font-size: .9rem; font-weight: 700; color: var(--brand-ink); }
/* Big day / month / year selects — native date pickers open on the wrong decade. */
.dmy { display: grid; grid-template-columns: 1fr 1fr 1.3fr; gap: 8px; }
.dmy select { font: inherit; min-height: 46px; padding: 8px 10px; border: 1px solid var(--line-strong); border-radius: 9px; background: var(--surface); color: var(--ink); }
/* Segmented single-choice control. */
.seg { display: flex; flex-wrap: wrap; gap: 8px; }
.seg-opt { flex: 0 1 auto; }
.tz-line { display: flex; align-items: center; gap: 10px; font-size: 1.05rem; font-weight: 700; }
.tz-valid { font-size: .74rem; font-weight: 700; border-radius: 5px; padding: 1px 7px; }
.tz-valid.ok { color: var(--ok, var(--brand-ink)); border: 1px solid var(--line-strong); }
.tz-valid.bad { color: var(--crit); border: 1px solid var(--crit); background: var(--crit-wash); }
.two-up { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.two-up.street-row { grid-template-columns: 2.4fr 1fr; }
/* Collapsible sub-groups (full address, emergency contact) — kept closed so the
   card isn't a wall; the sensitive block is asked only if the user opens it. */
.v2-more { border: 1px solid var(--line); border-radius: 10px; padding: 4px 12px; background: var(--surface-2); }
.v2-more > summary { cursor: pointer; font-weight: 700; font-size: .92rem; padding: 8px 2px; list-style: none; }
.v2-more > summary::-webkit-details-marker { display: none; }
.v2-more > summary::before { content: "+"; display: inline-grid; place-items: center; width: 20px; height: 20px; margin-inline-end: 6px; border: 1px solid var(--line-strong); border-radius: 5px; font-weight: 800; color: var(--ink-soft); }
.v2-more[open] > summary::before { content: "−"; }
.v2-sub { padding: 4px 2px 12px; }
.small-note { font-size: .82rem; margin: 0 2px 8px; }
.notif-dest { font-size: .9rem; font-weight: 700; margin: 0 0 10px; }
.notif-dest-missing { font-weight: 600; color: var(--crit); }
/* Repeatable structured-row lists (specialists, hospitalizations, determinations…). */
.v2-list { display: grid; gap: 8px; }
.list-rows { display: grid; gap: 6px; }
.list-row { display: flex; align-items: center; gap: 8px; background: var(--surface-2); border: 1px solid var(--line); border-radius: 9px; padding: 8px 6px 8px 12px; }
.list-sum { flex: 1; font-size: .92rem; min-width: 0; }
.list-empty { font-size: .86rem; margin: 0; }
.list-add { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; }
.list-add input, .list-add select { flex: 1 1 120px; min-width: 0; font: inherit; padding: 9px 11px; min-height: 44px; border: 1px solid var(--line-strong); border-radius: 9px; background: var(--surface); color: var(--ink); }
.list-add input::placeholder { color: var(--ink-soft); opacity: 1; }
/* Multi-select checkbox group. */
.check-group { display: grid; gap: 4px; }
.cg-opt { display: flex; align-items: center; gap: 10px; min-height: 44px; padding: 4px 8px; border-radius: 8px; cursor: pointer; font-size: .95rem; }
.cg-opt:hover { background: var(--surface-2); }
.cg-opt input { width: 22px; height: 22px; accent-color: var(--brand); }
.v2-fields textarea { font: inherit; padding: 10px 12px; border: 1px solid var(--line-strong); border-radius: 9px; background: var(--surface); color: var(--ink); resize: vertical; min-height: 72px; }
.derived.urgent { color: var(--crit); }
/* Consent card + proxy verification. */
.consent-toggle { align-items: flex-start; padding: 10px 12px; border: 1px solid var(--line-strong); border-radius: 10px; background: var(--surface-2); }
.vbadge { font-size: .68rem; font-weight: 800; border-radius: 5px; padding: 1px 7px; margin-inline-start: 4px; vertical-align: 1px; }
.vbadge-ok { color: var(--brand-ink); border: 1px solid var(--line-strong); }
.vbadge-self { color: var(--gold); border: 1px solid var(--gold); background: var(--gold-wash); }
.px-row .px-scope, .px-row .px-warn { font-size: .82rem; }
.px-warn { color: var(--crit); margin: 4px 0 0; }
.proxy-scope-field { grid-column: 1 / -1; }
.proxy-scope-field .check-group { margin-top: 4px; }
.authority-banner { background: var(--gold-wash); border: 1px solid var(--gold); border-radius: 10px; padding: 10px 14px; margin-bottom: 12px; font-weight: 700; font-size: .92rem; color: var(--ink); }
/* Profile completeness cue. */
.completeness { background: var(--surface); border: 1px solid var(--line); border-radius: 12px; padding: 14px 16px; margin-bottom: 14px; }
.completeness .cbar { height: 8px; border-radius: 999px; background: var(--surface-2); overflow: hidden; margin-bottom: 8px; }
.completeness .cbar > span { display: block; height: 100%; background: var(--brand); border-radius: 999px; transition: width .3s; }
.completeness.done .cbar > span { background: var(--ok, var(--brand)); }
.completeness p { margin: 0; font-size: .9rem; color: var(--ink-soft); }
.completeness strong { color: var(--ink); font-weight: 700; }
/* Conditional deadline countdown banner above the stat grid. */
/* Official-draft form look: bordered field boxes like a real government form,
   with a form-number box in the header — clearly RosiliOne-branded טיוטה. */
.official-draft { border: 2px solid var(--ink); }
.draft-form-head { display: flex; align-items: stretch; gap: 16px; border-bottom: 2px solid var(--ink); padding-bottom: 14px; margin-bottom: 18px; }
.dfh-brand { display: flex; flex-direction: column; gap: 6px; align-items: flex-start; }
.dfh-draft-tag { font-size: .72rem; font-weight: 800; letter-spacing: .06em; color: var(--gold-ink); border: 1.5px dashed var(--gold); border-radius: 6px; padding: 2px 8px; }
.dfh-title { flex: 1; } .dfh-title h2 { font-size: 1.25rem; margin: 0 0 4px; } .dfh-sub { font-size: .82rem; color: var(--ink-soft); margin: 0; }
.dfh-numbox { border: 2px solid var(--ink); border-radius: 8px; padding: 8px 14px; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 2px; font-weight: 800; font-size: 1.05rem; }
.dfh-numbox span { font-size: .68rem; font-weight: 600; color: var(--ink-faint); }
.draft-sec { padding: 14px 0; border-bottom: 1px solid var(--line); }
.draft-sec-h { display: flex; align-items: center; gap: 10px; font-size: .95rem; font-weight: 800; color: var(--brand-ink); margin: 0 0 10px; }
.draft-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(230px, 1fr)); gap: 8px; }
.draft-fld { border: 1px solid var(--line-strong); border-radius: 6px; padding: 6px 10px; display: grid; gap: 2px; background: var(--surface); }
.draft-k { font-size: .7rem; font-weight: 700; color: var(--ink-faint); text-transform: uppercase; letter-spacing: .03em; }
.draft-v { font-weight: 700; font-size: .95rem; min-height: 1.3em; }
.draft-decl { font-size: .92rem; margin: 0 0 10px; }
.sig-area { display: flex; gap: 18px; align-items: flex-start; flex-wrap: wrap; }
.sig-box { border: 1px solid var(--line-strong); border-radius: 6px; padding: 6px; display: grid; gap: 4px; justify-items: center; background: var(--surface); }
#sig-pad { touch-action: none; background: #fff; border: 1px dashed var(--line-strong); border-radius: 4px; cursor: crosshair; max-width: 100%; }
.sig-img { max-width: 320px; max-height: 110px; }
.sig-print-line { display: none; }
.sig-caption { font-size: .72rem; color: var(--ink-faint); font-weight: 700; }
.sig-side { display: grid; gap: 10px; max-width: 320px; }
.sig-actions { display: flex; gap: 8px; flex-wrap: wrap; }
.sig-type-field { display: grid; gap: 4px; }
.sig-type-field .draft-k { text-transform: none; letter-spacing: 0; }
.sig-name-input { border: 1px solid var(--line-strong); border-radius: 6px; padding: 6px 10px; font: inherit; }
.sig-note { font-size: .8rem; }
@media print { #sig-pad { display: none; } .sig-print-line { display: block; width: 300px; border-bottom: 1.5px solid var(--ink); height: 70px; } }
.pdf-viewer { margin-top: 14px; }
.pdf-viewer summary { cursor: pointer; padding: 4px 0; }
.pdf-embed { width: 100%; height: 720px; margin-top: 12px; border: 1px solid var(--line-strong); border-radius: 8px; }

/* Split-screen live-fill: the mirrored draft (editable) beside the REAL BTL
   PDF, sticky so the official form stays in view while the user types. */
.form-split { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 14px; align-items: start; }
.form-split-draft { min-width: 0; }
.form-split-pdf { position: sticky; top: 14px; min-width: 0; }
.pdf-side-head { display: flex; align-items: center; justify-content: space-between; gap: 10px; margin-bottom: 8px; font-size: .92rem; }
.pdf-side-note { font-size: .8rem; color: var(--ink-soft); line-height: 1.5; margin: 0 0 8px; }
.pdf-side { height: 78vh; margin-top: 0; }
/* Editable field inside a draft box: same look as the value line, but live. */
.draft-edit { border-color: var(--brand); }
.draft-input { border: 0; padding: 0; margin: 0; background: transparent; font: inherit; font-weight: 700; font-size: .95rem; color: var(--ink); width: 100%; min-height: 1.3em; }
.draft-input:focus { outline: none; box-shadow: none; }
.draft-fld.draft-edit:focus-within { border-color: var(--brand); box-shadow: 0 0 0 2px var(--focus-ring, var(--brand)); }
/* Submission guide — how to actually send this form, step by step. */
.submit-guide { margin-top: 14px; }
.submit-steps { margin: 0; padding-inline-start: 22px; display: grid; gap: 10px; font-size: .95rem; line-height: 1.6; }
.submit-steps li::marker { font-weight: 800; color: var(--brand-ink); }
@media (max-width: 1000px) { .form-split { grid-template-columns: 1fr; } .form-split-pdf { position: static; } .pdf-side { height: 60vh; } }
@media print { .no-print { display: none !important; } .form-split { display: block; } }

/* Draft worksheet note — shown for forms whose full section structure we
   haven't verified yet; the complete form is the embedded PDF beside it. */
.draft-worksheet-note { font-size: .9rem; line-height: 1.55; background: var(--surface-2); border-inline-start: 3px solid var(--brand); border-radius: 6px; padding: 10px 12px; margin: 0 0 14px; }

/* Draft: divider before supporting (non-form-field) sections, so nothing
   masquerades as a numbered form field (section-number alignment fix). */
.draft-support-divider { display: flex; align-items: center; gap: 10px; margin: 18px 0 6px; font-size: .82rem; font-weight: 700; color: var(--ink-faint); }
.draft-support-divider::before, .draft-support-divider::after { content: ""; flex: 1; height: 1px; background: var(--line); }
.draft-manual .draft-sec-h { color: var(--ink-soft); }
.draft-fld-note { grid-column: 1 / -1; background: var(--surface-2); border-style: dashed; }
.draft-fld-note .draft-v { color: var(--ink-faint); font-weight: 600; font-style: italic; }
.draft-support .draft-support-h { color: var(--ink-soft); font-weight: 700; }
.draft-support .draft-support-h::before { content: "•"; margin-inline-end: 8px; color: var(--ink-faint); }

/* Live-fill head actions + iframe PDF (the filled official form) */
.head-actions { display: flex; gap: 8px; flex-wrap: wrap; align-items: center; }
iframe.pdf-embed { border: 1px solid var(--line-strong); border-radius: 8px; background: #fff; }
#fill-status { flex-basis: 100%; }
.btn[disabled], .form-btn[hidden] { opacity: .55; pointer-events: none; }

/* תט"ר + reimbursement guide card (event tracks) */
.tatar-card .tatar-intro { margin: 4px 0 12px; font-size: .9rem; }
.tatar-h { font-size: .98rem; font-weight: 800; color: var(--brand-ink); margin: 16px 0 6px; }
.tatar-list { margin: 0; padding-inline-start: 20px; display: grid; gap: 6px; font-size: .92rem; line-height: 1.55; }
.tatar-forms { display: flex; gap: 8px; flex-wrap: wrap; margin: 8px 0 2px; }
.tatar-conflict { display: flex; align-items: flex-start; gap: 6px; font-size: .85rem; border-inline-start: 2px solid var(--gold, var(--brand)); padding-inline-start: 10px; margin-top: 12px; }

/* The complex-situation screen (התמונה המלאה) */
.sit-claim { grid-template-columns: 1.4fr 1fr 1.2fr; align-items: center; }
.sit-step { grid-template-columns: auto 1fr auto; align-items: center; }
.sit-combined h2 { color: var(--brand-ink); }
.sit-guidance { margin: 0; padding-inline-start: 20px; display: grid; gap: 8px; font-size: .95rem; line-height: 1.6; }

/* Benefit-combination engine card (how rights interact) */
.combo-card .combi-list { display: grid; grid-template-columns: minmax(0, 1fr); gap: 10px; margin-top: 12px; }
.combo-row { min-width: 0; border: 1px solid var(--line); border-radius: 8px; padding: 10px 12px; border-inline-start-width: 3px; overflow-wrap: anywhere; }
.combo-row.ci-election { border-inline-start-color: var(--danger, #c0392b); }
.combo-row.ci-conversion { border-inline-start-color: var(--gold, #b8860b); }
.combo-row.ci-offset { border-inline-start-color: var(--brand); }
.combo-row.ci-indep { border-inline-start-color: var(--ok, #2e7d32); }
.combo-pair { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; font-size: .95rem; }
.combo-x { color: var(--ink-faint); }
.combo-kind { margin-inline-start: auto; font-size: .78rem; font-weight: 700; color: var(--ink-soft); background: var(--surface-2); padding: 2px 8px; border-radius: 999px; }
.combo-note { margin: 6px 0 0; font-size: .9rem; line-height: 1.55; }
.combo-src { margin: 4px 0 0; font-size: .78rem; color: var(--ink-faint); }

/* F1: official BTL forms directory + official-form action cards */
.official-form-card { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; margin-bottom: 14px; font-size: .95rem; }
.form-btn { text-decoration: none; display: inline-flex; align-items: center; }
.forms-search-card { margin-bottom: 14px; }
.forms-count { margin: 8px 0 0; font-size: .88rem; }
.forms-cat { margin-bottom: 10px; }
.forms-cat summary { cursor: pointer; font-size: 1.05rem; padding: 4px 0; display: flex; align-items: center; gap: 10px; }
.forms-list { margin-top: 10px; display: grid; gap: 0; }
.form-row { display: flex; align-items: flex-start; justify-content: space-between; gap: 14px; padding: 12px 0; border-top: 1px solid var(--line); }
.form-main { display: grid; gap: 4px; min-width: 0; }
.form-name { font-weight: 700; }
.form-num { color: var(--ink-faint); font-weight: 600; font-size: .9rem; }
.form-desc { color: var(--ink-soft); font-size: .88rem; line-height: 1.5; }
.form-actions { display: flex; gap: 8px; flex: 0 0 auto; flex-wrap: wrap; justify-content: flex-end; }
.forms-src { font-size: .82rem; margin-top: 14px; }
@media (max-width: 560px) { .form-row { flex-direction: column; } .form-actions { justify-content: flex-start; } }

/* B2: user-present BTL document-pack guide */
.btlpack-card { margin-top: 14px; }
.btlpack-steps { margin: 0 0 14px; padding-inline-start: 20px; display: grid; gap: 8px; font-size: .95rem; }
.btlpack-row { grid-template-columns: 1fr auto; align-items: center; }
.btlpack-where { display: block; font-size: .8rem; color: var(--ink-faint); margin-top: 2px; }
.btlpack-note { font-size: .85rem; border-inline-start: 2px solid var(--brand); padding-inline-start: 12px; margin-top: 12px; }
.btlpack-foia { font-size: .9rem; margin: 10px 0 0; }
.access-mark { margin-top: 14px; display: flex; align-items: center; gap: 14px; flex-wrap: wrap; }

/* V4: advisor-opened case awaiting the owner's approval */
.approval-banner { display: flex; align-items: flex-start; gap: 12px; background: var(--brand-wash); border: 1px solid var(--brand); border-radius: 12px; padding: 14px 16px; margin-bottom: 14px; }
.approval-banner .ab-ic { display: grid; place-items: center; flex: none; color: var(--brand-ink); margin-top: 2px; }
.approval-banner .ab-body { flex: 1; font-size: .98rem; }
.approval-banner .ab-sub { display: block; font-size: .85rem; color: var(--ink-soft); margin-top: 4px; }
.approval-banner .ab-actions { display: flex; gap: 8px; align-items: center; flex-wrap: wrap; }
.deadline-banner { display: flex; align-items: center; gap: 12px; width: 100%; text-align: start; cursor: pointer;
  background: var(--gold-wash); border: 1px solid var(--gold); border-radius: 12px; padding: 12px 16px; margin-bottom: 14px; color: var(--ink); font: inherit; }
.deadline-banner.urgent { background: var(--crit-wash); border-color: var(--crit); }
.deadline-banner .db-ic { display: grid; place-items: center; flex: none; color: var(--gold); }
.deadline-banner.urgent .db-ic { color: var(--crit); }
.deadline-banner .db-body { display: grid; gap: 2px; min-width: 0; }
.deadline-banner .db-cat { font-size: .74rem; font-weight: 800; letter-spacing: .03em; color: var(--ink-soft); }
.deadline-banner .db-body > span:last-child { font-weight: 700; font-size: .95rem; }
.deadline-banner:hover { filter: brightness(0.98); }
/* Urgent alert rows lead with a crit stripe. */
.alert-row.urgent { border-inline-start: 3px solid var(--crit); background: var(--crit-wash); }
.alert-row.urgent .alert-cat { color: var(--crit); }
.bell-badge.urgent { animation: badgePulse 1.6s ease-in-out infinite; }
@keyframes badgePulse { 0%, 100% { transform: scale(1); } 50% { transform: scale(1.18); } }
@media (prefers-reduced-motion: reduce) { .bell-badge.urgent { animation: none; } }
/* Person-completeness line inside the case card (distinct from docs readiness). */
.spine-line { margin-top: 8px; }
.spine-bar { background: var(--surface-2); }
.linklike { background: none; border: 0; padding: 0; color: var(--brand-ink); font: inherit; font-weight: 700; cursor: pointer; text-decoration: underline; text-underline-offset: 2px; }
.linklike:hover { color: var(--brand); }
/* Money-tile provenance qualifier — official % vs self-guess. */
.stat-prov { display: block; margin-top: 3px; font-size: .66rem; font-weight: 700; }
.stat-prov.official { color: var(--brand-ink); }
.stat-prov.self { color: var(--ink-faint); }
/* Money screen provenance chip (parity with the home tile). */
.money-prov { display: inline-block; margin-top: 4px; font-size: .78rem; font-weight: 700; padding: 1px 8px; border-radius: 6px; border: 1px solid var(--line-strong); }
.money-prov.official { color: var(--brand-ink); }
.money-prov.self { color: var(--ink-faint); }
/* Consent-locked money screen. */
.money-locked { display: grid; place-items: center; gap: 12px; text-align: center; padding: 28px 20px; }
.money-locked .ml-ic { color: var(--gold); }
.money-empty { display: grid; gap: 10px; }
.money-empty-actions { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 4px; }
/* Election-of-benefits — the most irreversible decision, pinned on the case card. */
.election-warn { display: flex; gap: 12px; align-items: flex-start; background: var(--crit-wash); border: 1px solid var(--crit); border-radius: 10px; padding: 12px 14px; margin: 10px 0; }
.election-warn .ew-ic { color: var(--crit); flex: none; display: grid; place-items: center; }
.election-warn strong { color: var(--crit); display: block; font-size: .92rem; }
.election-warn p { margin: 4px 0 6px; font-size: .88rem; color: var(--ink); }
.age-chip { display: inline-block; font-size: .74rem; font-weight: 700; color: var(--ink-soft); border: 1px solid var(--line); border-radius: 6px; padding: 0 6px; margin-inline-start: 4px; }
.count-chip.urgent { background: var(--crit); color: #fff; }
.alert-seeall { width: 100%; text-align: center; background: none; border: 1px dashed var(--line-strong); border-radius: 9px; padding: 9px; margin-top: 4px; color: var(--brand-ink); font: inherit; font-weight: 700; cursor: pointer; min-height: 40px; }
.alert-seeall:hover { background: var(--surface-2); }
/* Documents: standing on-device privacy line + consent-locked attach. */
.on-device-line { display: flex; align-items: center; gap: 6px; margin: 14px 0 0; font-size: .82rem; color: var(--ink-soft); }
.on-device-line .odl-ic { display: grid; place-items: center; color: var(--brand-ink); }
.doc-attach.doc-locked { color: var(--gold); border-color: var(--gold); background: var(--gold-wash); display: inline-flex; align-items: center; gap: 5px; }
/* Personalized issuer line — "ask the doctor you already see". */
.doc-issuer { display: block; font-size: .82rem; color: var(--brand-ink); margin-top: 3px; }
/* V2 adaptive docs: what else a present document unlocks + honest complete-file note */
.doc-unlocks { display: inline-flex; align-items: center; gap: 6px; font-size: .82rem; font-weight: 600; color: var(--brand-ink); margin-top: 3px; }
.docs-complete-note { font-size: .9rem; color: var(--ink-soft); border-inline-start: 2px solid var(--gold); padding-inline-start: 12px; margin: 10px 0 0; max-width: 640px; }
/* Third row state — profile implies part of this, but not the official paper. */
.doc-implied { display: block; font-size: .82rem; font-weight: 600; color: var(--gold); background: var(--gold-wash); border: 1px solid var(--gold); border-radius: 7px; padding: 4px 8px; margin-top: 4px; }
/* Revived staleness warnings + forward CTA into committee prep. */
.stale-warns { margin-top: 8px; display: grid; gap: 4px; }
.stale-warn { display: flex; align-items: flex-start; gap: 6px; margin: 0; font-size: .82rem; color: var(--gold); }
.stale-warn svg { flex: none; margin-top: 2px; }
.docs-forward { display: grid; gap: 10px; }
.docs-forward-actions { display: flex; flex-wrap: wrap; gap: 8px; }

/* Section navigator (reusable, Sam 2026-08-17): a rail of sections + one active
   body, replacing endless-scroll settings pages. Rail beside the body on wide
   screens; a horizontal scrollable chip row above it on narrow. Tokens only. */
.section-shell { display: grid; grid-template-columns: 210px 1fr; gap: 20px; align-items: stretch; margin-top: 10px; min-height: 0; }
.section-nav { display: flex; flex-direction: column; gap: 4px; align-self: start; position: sticky; top: 4px; }
.section-nav-item { display: flex; align-items: center; gap: 10px; inline-size: 100%; text-align: start; padding: 11px 14px; border: 1px solid transparent; border-radius: var(--r-sm); background: transparent; color: var(--ink-soft); font: inherit; font-weight: 600; cursor: pointer; transition: background .12s ease, color .12s ease; }
.section-nav-item .sn-ic { display: inline-flex; color: var(--ink-faint); flex: 0 0 auto; }
.section-nav-item:hover { background: var(--surface-2); color: var(--ink); }
.section-nav-item.on { background: var(--surface-2); color: var(--brand-ink); border-color: var(--line); font-weight: 800; }
.section-nav-item.on .sn-ic { color: var(--brand); }
.section-body { min-inline-size: 0; }
.section-body:focus { outline: none; }

@media (max-width: 720px) {
  .section-shell { grid-template-columns: 1fr; gap: 12px; }
  .section-nav { flex-direction: row; position: sticky; top: 0; z-index: 2; background: var(--ground); overflow-x: auto; gap: 6px; padding-block-end: 4px; scroll-snap-type: x proximity; }
  .section-nav-item { inline-size: auto; flex: 0 0 auto; scroll-snap-align: start; padding: 9px 14px; border-radius: 999px; border-color: var(--line); }
  .section-nav-item .sn-label { white-space: nowrap; }
}

/* Care-continuity rows */
.cont-row { padding: 8px 0; border-block-end: 1px solid var(--line); }
.cont-row:last-child { border-block-end: 0; }
.cont-line { font-weight: 700; margin: 0 0 6px; }
.cont-renew { margin-top: 8px; }
.cont-renew > summary { cursor: pointer; }
.cont-draft { margin-top: 10px; }

/* Communication-style tags on provider cards */
.prov-style { display: flex; flex-wrap: wrap; gap: 5px; align-items: center; margin: 4px 0 2px; }
.style-tag { font-size: .74rem; font-weight: 700; color: var(--ink-soft); background: var(--surface-2); border: 1px solid var(--line); border-radius: 999px; padding: 2px 9px; }
.style-tag.style-fit { color: var(--brand-ink); border-color: var(--brand); background: var(--brand-wash, var(--surface-2)); }
.style-fit-note { font-size: .76rem; font-weight: 800; color: var(--brand-ink); }
.wiz-style { margin-top: 4px; }

/* Daily mood check-in */
/* 5 across always — the wizard asks one question at a time, so the row must
   never wrap 4+1 at 375px. min-width:0 lets the buttons shrink evenly. */
.mood-row { display: flex; gap: 8px; margin: 8px 0; }
.mood-btn { flex: 1 1 0; min-inline-size: 0; display: flex; flex-direction: column; align-items: center; gap: 3px; padding: 10px 4px; border: 1.5px solid var(--line-strong); border-radius: var(--r-sm); background: var(--surface); color: var(--ink-soft); font: inherit; cursor: pointer; transition: border-color .12s, background .12s; }
.mood-btn .mood-l { overflow-wrap: anywhere; text-align: center; }
.mood-btn:hover { border-color: var(--brand); }
.mood-btn.on { border-color: var(--brand); background: var(--surface-2); color: var(--brand-ink); font-weight: 800; }
.mood-btn .mood-n { font-size: 1.1rem; font-weight: 800; }
.mood-btn .mood-l { font-size: .78rem; }
.checkin-note-row { display: flex; gap: 8px; align-items: center; margin-top: 6px; }
.checkin-note-row input { flex: 1; min-height: 40px; padding: 6px 12px; border: 1px solid var(--line-strong); border-radius: 9px; background: var(--surface); color: var(--ink); font: inherit; }
.checkin-done { color: var(--ok, #2e7d32); }
.mood-trend { margin-top: 10px; }
.mood-spark { display: flex; align-items: flex-end; gap: 4px; height: 40px; margin: 6px 0; }
.mood-spark .ms-bar { flex: 1; min-width: 8px; background: linear-gradient(180deg, var(--brand), var(--brand-deep)); border-radius: 3px 3px 0 0; }

/* Support & helplines directory */
.res-emergency { display: flex; gap: 12px; align-items: center; border: 1px solid var(--crit, #c0392b); background: var(--crit-wash, var(--surface-2)); }
.res-emergency .ml-ic { color: var(--crit, #c0392b); flex: none; }
.res-emergency p { margin: 0; font-weight: 700; }
.res-list { display: grid; gap: 4px; }
.res-row { display: flex; gap: 14px; align-items: center; justify-content: space-between; flex-wrap: wrap; padding: 12px 0; border-block-end: 1px solid var(--line); }
.res-row:last-child { border-block-end: 0; }
.res-main { flex: 1 1 240px; min-width: 0; }
.res-desc { margin: 3px 0 0; font-size: .9rem; color: var(--ink-soft); }
.res-hours { margin: 3px 0 0; display: inline-flex; align-items: center; gap: 5px; }
.res-hours .rh-ic { display: inline-grid; place-items: center; }
.res-acts { display: flex; gap: 8px; flex: 0 0 auto; align-items: center; }
/* Redesign v1.3 (support p23): prominent call pill with phone glyph + verified chip */
.res-call { display: inline-flex; align-items: center; gap: 8px; font-size: 1.05rem; font-weight: 800; padding: 11px 16px; font-variant-numeric: tabular-nums; }
.res-call .rc-ic { display: inline-grid; place-items: center; }
.res-trust { display: inline-flex; align-items: center; gap: 7px; font-size: .82rem; font-weight: 700; color: var(--brand-ink); background: var(--brand-wash); border-radius: 999px; padding: 6px 14px; margin: 0 0 14px; }
.res-trust .rt-ic { display: inline-grid; place-items: center; }

/* Half-anonymous mode banner */
.anon-banner { display: flex; gap: 12px; align-items: center; flex-wrap: wrap; background: var(--surface-2); border: 1px solid var(--line-strong); border-radius: var(--r); padding: 10px 14px; margin-bottom: 12px; }
.anon-banner .ab-ic { color: var(--ink-soft); flex: none; }
.anon-banner p { margin: 0; flex: 1 1 220px; font-size: .9rem; color: var(--ink-soft); }

/* ================= Fidelity pass — mockup p16 (patient home) ================= */
/* Dark-teal hero header carrying the greeting (the mockup's signature top). */
.home-hero { background:
    radial-gradient(600px 320px at 85% -40%, rgba(168,120,26,.20), transparent 55%),
    linear-gradient(160deg, var(--brand-deep), var(--brand) 78%);
  color: #eaf5f5; border-radius: var(--r-lg); padding: 24px 22px; margin-bottom: 18px; box-shadow: var(--shadow-lift); }
.hh-eyebrow { margin: 0 0 5px; font-size: .76rem; font-weight: 800; letter-spacing: .05em; color: var(--gold); }
.hh-title { margin: 0; font-size: clamp(1.5rem, 5vw, 1.9rem); font-weight: 800; color: #fff; letter-spacing: -.01em; }
.hh-sub { margin: 6px 0 0; font-size: .95rem; opacity: .82; }

/* Quick actions as clean vertical tiles (icon over label), like the mockup. */
.quick-card .quick { flex-direction: column; align-items: center; text-align: center; gap: 9px; padding: 16px 8px; }
.quick-card .quick .q-ic { color: var(--brand-ink); }
.quick-card .quick .q-l { font-size: .84rem; font-weight: 700; line-height: 1.2; }

/* Compact benefit-election safety strip (replaces the alarming red block). */
.election-strip { display: flex; align-items: center; gap: 10px; inline-size: 100%; text-align: start; font: inherit; cursor: pointer;
  background: var(--gold-wash); border: 1px solid color-mix(in srgb, var(--gold) 40%, transparent); border-radius: var(--r); padding: 11px 14px; margin-bottom: 14px; color: var(--gold-ink); }
.election-strip .es-ic { flex: 0 0 auto; display: grid; place-items: center; }
.election-strip .es-text { flex: 1 1 auto; font-size: .88rem; font-weight: 600; min-inline-size: 0; }
.election-strip .es-text strong { font-weight: 800; }
.election-strip .es-go { flex: 0 0 auto; font-weight: 800; }
.election-strip:hover { border-color: var(--gold); }

/* Sparkline reads as a chart, not a solid block. */
.mood-spark { max-width: 168px; }

@media (max-width: 640px) {
  /* Teal app bar + teal hero card = the mockup's unified top. */
  .topnav { background: var(--brand-deep); border-block-end: 0; box-shadow: none; backdrop-filter: none; }
  .topnav .brand, .topnav .brand-mark { color: #fff; }
  .topnav .brand-mark { color: var(--gold); }
  .topnav .icon-btn, .topnav .chip-name { color: #eaf5f5; }
  .home-hero { padding: 20px 18px 22px; }
  .quick-card .quick { padding: 14px 6px; }
  /* Slim footer on mobile — the mockup has none; keep only brand + legal + owner. */
  .site-foot .foot-col { display: none; }
  .site-foot .foot-brand p { display: none; }
  .site-foot .foot-inner { padding: 20px 16px 8px; gap: 8px; }
  .site-foot .foot-legal { padding: 12px 16px; }
}

/* ---- v3 situation: weighted-% header (big number + per-condition bars) ---- */
.sc-grid { display: flex; align-items: center; gap: 18px; margin: 10px 0 6px; }
.sc-bars { flex: 1 1 auto; display: grid; gap: 8px; min-inline-size: 0; }
.sc-bar-row { display: flex; align-items: center; gap: 10px; }
.sc-bar-pct { flex: 0 0 auto; inline-size: 40px; font-weight: 800; font-variant-numeric: tabular-nums; color: var(--brand-ink); font-size: .9rem; }
.sc-bar-track { flex: 1 1 auto; block-size: 12px; background: var(--surface-2); border: 1px solid var(--line); border-radius: 999px; overflow: hidden; }
.sc-bar-fill { display: block; block-size: 100%; background: linear-gradient(90deg, var(--brand), var(--brand-deep)); border-radius: 999px; }
.sc-bar-add { flex: 0 0 auto; inline-size: 42px; text-align: start; }
.sc-total { flex: 0 0 auto; display: grid; justify-items: center; gap: 2px; padding-inline-start: 14px; border-inline-start: 1px solid var(--line); }
.sc-total-n { font-size: 2rem; font-weight: 800; color: var(--brand-ink); line-height: 1; font-variant-numeric: tabular-nums; }

/* ================= v3 daily check-in — 4-column dot input (mockup p4) ================= */
.checkin-card .ck-cols { display: grid; grid-template-columns: repeat(4, 1fr); gap: 6px; margin: 14px 0 12px; }
.ck-col { display: grid; justify-items: center; gap: 7px; min-inline-size: 0; }
.ck-col-ic { display: grid; place-items: center; inline-size: 44px; block-size: 44px; border-radius: 50%; background: var(--surface-2); border: 1px solid var(--line); color: var(--brand-ink); }
.ck-col-lbl { font-size: .82rem; font-weight: 800; color: var(--ink); }
.ck-dots { display: flex; gap: 5px; }
.ck-dot { inline-size: 11px; block-size: 11px; border-radius: 50%; padding: 0; border: 0; background: var(--line-strong); cursor: pointer; transition: background .12s, transform .12s; }
.ck-dot:hover { transform: scale(1.15); }
.ck-dot.on { background: var(--brand); }
.ck-dot:focus-visible { outline: 2px solid var(--focus); outline-offset: 2px; }
.ck-col-scale { font-size: .62rem; text-align: center; line-height: 1.2; }
.ck-note-row { display: flex; align-items: center; gap: 8px; border: 1px solid var(--line); border-radius: var(--r); padding: 4px 6px 4px 12px; margin-top: 4px; }
.ck-note-row:focus-within { border-color: var(--brand); }
.ck-note-ic { display: grid; place-items: center; color: var(--ink-faint); flex: 0 0 auto; }
.ck-note { flex: 1 1 auto; border: 0; background: none; font: inherit; color: var(--ink); padding: 8px 0; min-inline-size: 0; outline: none; }
.ck-send { flex: 0 0 auto; display: grid; place-items: center; inline-size: 38px; block-size: 38px; border-radius: 50%; border: 0; background: var(--brand); color: #fff; cursor: pointer; }
.ck-send:hover { background: var(--brand-deep); }
.ck-status:empty { display: none; }
.ck-status { margin: 8px 0 0; color: var(--warn); font-weight: 700; }
@media (max-width: 380px) { .ck-col-ic { inline-size: 40px; block-size: 40px; } .ck-dot { inline-size: 9px; block-size: 9px; gap: 4px; } }

/* ================= v3 home fidelity — hero money card, pill status, 4 tiles ================= */
/* Benefit hero: money card (no donut) */
.benefit-hero .bh-head { display: flex; align-items: center; justify-content: space-between; }
.benefit-hero .bh-info { color: var(--ink-faint); display: grid; place-items: center; }
.bh-amount-block { display: grid; justify-items: center; gap: 3px; padding: 16px 0 14px; text-align: center; }
.bh-amount { font-size: 2.4rem; font-weight: 800; color: var(--brand-ink); line-height: 1; font-variant-numeric: tabular-nums; letter-spacing: -.02em; }
.bh-amount-sub { font-size: .9rem; color: var(--ink-soft); }
.bh-prov { font-size: .7rem; font-weight: 700; margin-top: 2px; }
.bh-prov.official { color: var(--brand-ink); }
.bh-prov.self { color: var(--ink-faint); }
/* Locked state */
.bh-locked-card { background: linear-gradient(180deg, var(--brand-wash), var(--surface)); }
.bh-locked-body { display: flex; align-items: center; gap: 16px; padding: 14px 0 6px; }
.bh-lock-circle { flex: 0 0 auto; display: grid; place-items: center; inline-size: 62px; block-size: 62px; border-radius: 50%; background: var(--brand-deep); color: #fff; }
.bh-lock-text { flex: 1 1 auto; display: grid; gap: 4px; min-inline-size: 0; }
.bh-lock-title { margin: 0; font-weight: 800; color: var(--ink); font-size: 1rem; }
.bh-unlock { align-self: start; margin-top: 4px; display: inline-flex; align-items: center; gap: 7px; }
.bh-unlock span { display: inline-grid; place-items: center; }
.bh-lock-note { margin: 6px 0 0; }
/* status pill row */
.cs-pills { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 4px; }
.cs-pillrow { display: inline-flex; align-items: center; gap: 5px; font-size: .82rem; font-weight: 700; padding: 6px 12px; border-radius: 999px; }
.cs-pillrow svg { display: inline-block; }
.cs-brand { background: var(--brand-wash); color: var(--brand-ink); }
/* 4-tile quick grid (bordered, icon over label) */
.dash .quick-grid-4 { grid-template-columns: repeat(4, 1fr); gap: 10px; }
.quick-card .quick-grid-4 .quick { flex-direction: column; align-items: center; text-align: center; gap: 8px; padding: 16px 6px; border: 1px solid var(--line); border-radius: var(--r); }
.quick-card .quick-grid-4 .quick .q-l { font-size: .78rem; font-weight: 700; line-height: 1.2; }
@media (max-width: 480px) { .dash .quick-grid-4 { grid-template-columns: repeat(2, 1fr); } }

/* v3 money input fields: leading icon on the label */
.money-fld .fld-lbl { display: inline-flex; align-items: center; gap: 7px; }
.money-fld .mf-ic { display: inline-grid; place-items: center; inline-size: 26px; block-size: 26px; border-radius: 7px; background: var(--brand-wash); color: var(--brand-ink); flex: 0 0 auto; }

/* AI-OCR: smart document drop-card + review window */
.ai-doc-card { border-inline-start: 3px solid var(--brand); }
.ai-doc-head { display: flex; align-items: center; gap: 10px; margin-bottom: 10px; }
.ai-doc-head h2 { font-size: 1.05rem; margin: 0; }
.ai-doc-badge { display: inline-grid; place-items: center; padding: 2px 8px; border-radius: 8px; background: var(--brand); color: #fff; font-size: .72rem; font-weight: 800; letter-spacing: .04em; }
.ai-dropzone { display: grid; justify-items: center; gap: 6px; inline-size: 100%; cursor: pointer; font: inherit; color: var(--ink); text-align: center; background: var(--surface-2); border: 2px dashed var(--line); border-radius: var(--r-lg); padding: 22px 16px; transition: border-color .15s, background .15s; }
.ai-dropzone:hover, .ai-dropzone.ai-dz-over { border-color: var(--brand); background: var(--brand-wash); }
.ai-dropzone b { font-size: .98rem; }
.ai-dropzone span:not(.ai-dz-ic) { font-size: .82rem; color: var(--ink-soft); line-height: 1.5; max-inline-size: 46ch; }
.ai-dz-ic { color: var(--brand-ink); }
.ai-doc-busy { display: flex; align-items: center; gap: 10px; padding: 18px 6px; color: var(--ink-soft); }
.ai-doc-busy .spinner { inline-size: 18px; block-size: 18px; border: 2.5px solid var(--line); border-block-start-color: var(--brand); border-radius: 50%; animation: ai-spin .8s linear infinite; flex: 0 0 auto; }
@keyframes ai-spin { to { transform: rotate(360deg); } }
.ai-doc-error { color: var(--crit); font-size: .88rem; }
.ai-doc-summary { font-weight: 600; margin: 0 0 8px; }
.ai-doc-warn { background: var(--warn-wash); border-inline-start: 3px solid var(--warn); border-radius: 8px; padding: 8px 12px; font-size: .84rem; margin: 0 0 10px; }
.ai-row { display: grid; gap: 3px; padding: 9px 0; border-block-end: 1px solid var(--line); }
.ai-row:last-of-type { border-block-end: 0; }
.ai-row-review { background: color-mix(in srgb, var(--crit) 5%, transparent); border-radius: 8px; padding-inline: 8px; }
.ai-row-label { font-size: .8rem; font-weight: 700; color: var(--ink-soft); }
.ai-row-main { display: flex; align-items: center; gap: 8px; }
.ai-row-value { flex: 1 1 auto; min-inline-size: 0; font: inherit; padding: 6px 10px; border: 1px solid var(--line); border-radius: 8px; background: var(--surface); color: var(--ink); }
.ai-row-value:focus { outline: 2px solid var(--brand); outline-offset: 1px; }
.ai-conf { flex: 0 0 auto; font-size: .74rem; font-weight: 800; padding: 2px 7px; border-radius: 999px; font-variant-numeric: tabular-nums; }
.ai-conf-ok { background: var(--ok-wash); color: var(--ok); }
.ai-conf-low { background: color-mix(in srgb, var(--crit) 12%, transparent); color: var(--crit); }
.ai-row-quote { font-size: .76rem; color: var(--ink-soft); }
.ai-reconcile { display: flex; align-items: flex-start; gap: 9px; margin: 12px 0 2px; padding: 10px 12px; background: var(--brand-wash); border-radius: var(--r-lg); font-size: .88rem; cursor: pointer; }
.ai-reconcile input { margin-block-start: 3px; }
.ai-doc-actions { display: flex; flex-wrap: wrap; gap: 8px; margin-block-start: 14px; }
.ai-doc-note { font-size: .76rem; margin-block-start: 12px; }
/* AI-OCR advisor review items (advisor loads portal.css) */
.dr-item { border-block-start: 1px solid var(--line); padding-block: 12px; }
.dr-item:first-of-type { border-block-start: 0; }
.dr-thumb { max-inline-size: 200px; max-block-size: 140px; object-fit: contain; border: 1px solid var(--line); border-radius: 8px; margin-block: 6px; }
/* AI-OCR: resolution banners + clinical rows */
.ai-res { font-size: .84rem; border-radius: 8px; padding: 7px 11px; margin: 0 0 8px; }
.ai-res-ok { background: var(--ok-wash); color: var(--ok); }
.ai-res-warn { background: var(--warn-wash); color: var(--warn); }
.ai-res-crit { background: var(--crit-wash); color: var(--crit); font-weight: 700; }
.ai-res-info { background: var(--brand-wash); color: var(--brand-ink); }
.ai-clinical { margin-block: 10px; }
.ai-clin-h { font-size: .82rem; font-weight: 700; color: var(--ink-soft); margin: 10px 0 6px; }
.ai-clin-row { display: flex; align-items: flex-start; gap: 8px; padding: 6px 2px; font-size: .88rem; cursor: pointer; }
.ai-clin-row input { margin-block-start: 3px; }
.ai-clin-txt { flex: 1 1 auto; min-inline-size: 0; }
.ai-clin-txt .ai-res-ok, .ai-clin-row .muted { display: block; font-size: .76rem; background: none; padding: 0; margin-block-start: 2px; }