:root {
    /* ── LienStreet palette (brand handoff, Phase A) ──────────────────────────
       Vault green is the ink on paper and the ground on dark surfaces. Gold is
       the SEAL ONLY (never buttons, links, or fills) and switches with the
       ground: #D4A93F on green, #A67F1E on paper. The old status color --green
       (#2f7d4a) is renamed --status-ok so it cannot collide with brand green. */
    /* Token sweep group 1 (9/17, sweep HANDOFF row 1): canonical design-system
       names below; the old names are ALIASES of them for one release and die after
       the sweep is green. New styling writes the canonical names only. */
    --vault: #10352B;
    --vault-mid: #164437;
    --paper: #F7F5F0;
    --paper-2: #efece4;
    --ink-faint: #6b7a72;   /* tertiary text, 13px+ at 500 (row 3: #9aa89f fails AA) */
    --line-strong: #C8BFA9; /* stone rules, input borders, the Street rail */
    --wash: rgba(16,53,43,0.06);
    --green: var(--vault);
    --green-mid: var(--vault-mid);
    --green-fade: rgba(16,53,43,0.06);
    --green-wash: rgba(16,53,43,0.08);
    --green-line: rgba(16,53,43,0.22);
    --gold-on-green: #D4A93F; /* seal on dark grounds only */
    --gold-on-paper: #A67F1E; /* seal on light grounds only */
    --stone: #C8BFA9;         /* secondary text on green only */
    --ink-soft: #4B5B54;      /* secondary text on paper */
    --cream: var(--paper);
    --cream-2: var(--paper-2);
    --white: #ffffff;
    --gray: var(--ink-soft);
    --gray-light: var(--line); /* ruled 9/17: hairline; inputs and rails carry line-strong explicitly */
    --ink: var(--vault);
    --ink-2: var(--ink-soft);
    --ink-3: var(--ink-faint);
    --ink-4: var(--ink-faint); /* row 3 rule: text never #9aa89f; no disabled-control uses exist */
    --line: rgba(16,53,43,0.10);
    --line-soft: rgba(16,53,43,0.06);
    --status-ok: #2f7d4a;
    --status-ok-soft: rgba(47,125,74,0.10);
    --red: #b73f3f;
    --red-soft: rgba(183,63,63,0.10);
    --amber: #b86e1f;
    --amber-soft: rgba(184,110,31,0.12);
  }
  * { margin: 0; padding: 0; box-sizing: border-box; }
  button, a, [onclick], label, .btn, .nav-link, .role-card, .step-row, .case-row, .action-card, .btn-gold, .btn-outline, .nav-links a, .adm-quicklink, .adm-action-item, .tracker-step, .status-step, .dash-tab, select { cursor: pointer; }
  input, textarea { cursor: text; }
  body { font-family: 'DM Sans', sans-serif; background: var(--cream); color: var(--green); overflow-x: hidden; }

  nav {
    position: fixed; top: 0; left: 0; right: 0; z-index: 100;
    background: var(--green); padding: 0 40px; height: 72px; border-bottom: 1px solid rgba(247,245,240,0.14);
    display: flex; align-items: center; justify-content: space-between;
    
  }
  .logo { text-decoration: none; display: inline-flex; align-items: center; }
  .logo:hover, .logo:active, .logo:visited { text-decoration: none; }
  .logo img { height: 40px; width: auto; display: block; }
  .nav-links { display: flex; gap: 32px; align-items: center; }
  .nav-links a { color: rgba(247,245,240,0.75); text-decoration: none; font-size: 0.9rem; font-weight: 500; transition: color 0.2s; cursor: pointer; }
  .nav-links a:hover { color: var(--paper); }
  .nav-links a:hover { color: var(--paper); }
  /* Site handoff: Get started is the one filled nav button — paper on green, green text. */
  .nav-cta { background: var(--paper); color: var(--green) !important; padding: 8px 20px; border-radius:0; font-weight: 600 !important; }
  .nav-cta:hover { background: var(--stone) !important; }
  /* Site handoff: below 760 the bar keeps Sign in + Get started inline; the three
     marketing links hide (.nav-mkt rule in the ls block). No hamburger. */
  #nav-burger { display: none !important; }
  /* Task 8 (Cowork): signed-in nav wrapped to two lines at 760-1000px (marketing
     links + My Dashboard + email + Sign Out). Drop the marketing links and cap the
     email for authed sessions in that range. */
  @media (max-width: 1040px) {
    body.ll-authed .nav-mkt { display: none !important; }
    body.ll-authed #nav-user-email { max-width: 140px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; display: inline-block; }
  }
  @media (max-width: 760px) {
    .nav-links { gap: 14px; }
    .nav-links a { font-size: 0.85rem; }
    .nav-links a.nav-cta { padding: 7px 14px; }
    .nav-links #nav-user-email { max-width: 110px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
  }

  .page { display: none; min-height: 100vh; padding-top: 70px; }
  .page.active { display: block; }

  /* HERO */
  .btn-gold, .btn-primary { background: var(--vault); color: var(--paper); padding: 13px 26px; border: none; border-radius: 0; font-size: 0.95rem; font-weight: 600; cursor: pointer; transition: background-color .18s ease-out, color .18s ease-out; font-family: 'DM Sans', sans-serif; }
  .btn-gold:hover, .btn-primary:hover { background: var(--stone); color: var(--vault); }
  .btn-outline { background: transparent; color: var(--white); padding: 13px 26px; border: 1px solid rgba(247,245,240,0.6); border-radius: 0; font-size: 0.95rem; font-weight: 500; cursor: pointer; transition: background-color .18s ease-out, color .18s ease-out; font-family: 'DM Sans', sans-serif; }
  .btn-outline:hover { background: var(--paper); color: var(--vault); }

  .status-steps { display: flex; flex-direction: column; gap: 10px; }
  /* Row 99 ruling 9/17: NOT swapped to _llStopStrip — the hero mockup is an illustration;
     the real Street diagram sits two sections below. Restyled on tokens only. */
  .status-step { display: flex; align-items: center; gap: 10px; padding: 9px 12px; border-radius:0; font-size: 0.82rem; position: relative; cursor: default; transition: background 0.22s ease, border-color 0.22s ease; }
  .status-step.done { background: var(--status-ok-soft); }
  .status-step.active-step { background: rgba(16,53,43,0.12); border: 1px solid rgba(16,53,43,0.3); }
  .status-step.pending { background: rgba(255,255,255,0.03); }
  .status-step:hover { background: rgba(16,53,43,0.13) !important; }
  /* dot-pulse deleted (sweep row 104): nothing pulses. */
  @keyframes spin { from { transform: rotate(0deg); } to { transform: rotate(360deg); } }
  /* Test case chip (9/23): square, vault outline on paper. No gold. */
  .ll-test-chip { display:inline-block; font:700 10px/1 'DM Sans',sans-serif; letter-spacing:.12em; text-transform:uppercase; color:#10352B; background:#F7F5F0; border:1px solid #10352B; padding:3px 6px; border-radius:0; vertical-align:middle; margin-left:6px; white-space:nowrap; }
  /* LienStreet loaders (9/23 design, design/loaders-2026-09-23). Loader 1 = the Street
     (content areas); loader 3 = the L (chrome and full-page waits). Never both on one
     screen. Gold only as the current stop and the seal. 300ms mount delay: the loader
     stays invisible for its first 300ms, so a faster response never shows it.
     .ls-on-vault marks a loader mounted on a vault ground. */
  .ls-loader { display:flex; justify-content:center; padding:32px 0; opacity:0; animation:ls-appear 0s linear 300ms forwards; }
  @keyframes ls-appear { to { opacity:1 } }
  /* Boot ground (Cowork 9/23): paper for the first 300ms, then vault together with the L,
     so a load under 300ms shows no green at all. */
  .ls-boot-ground { background:var(--paper); animation:ls-ground 0s linear 300ms forwards; }
  /* 9/28: a signed-in boot (ll_had_session) hides the home page from the first frame and shows the
     boot page as soon as it parses; showPage clears the class. Set by the script at the top of body. */
  html.ll-booting #home { display:none !important; }
  html.ll-booting #boot-loading { display:block; }
  /* 9/28: a known signed-in boot (ll-boot-instant, never cleared) shows the vault ground, the L and
     the line from the first frame; the 300 ms paper delay is for loads that may finish faster. */
  html.ll-boot-instant .ls-boot-ground { background:var(--vault) !important; animation:none !important; }
  /* 9/29 (Kelly): a signed-in boot shows the signed-in header from the first frame (Sign out, no
     Sign in / Get started / Pricing). ll-authed-boot is dropped when no session restores or on sign-out. */
  html.ll-authed-boot #nav-signin, html.ll-authed-boot #nav-signup, html.ll-authed-boot #nav-pricing { display:none !important; }
  html.ll-authed-boot #nav-signout { display:inline !important; }
  html.ll-boot-instant #boot-loading .ls-loader, html.ll-boot-instant #boot-loading-msg { opacity:1 !important; animation:none !important; }
  @keyframes ls-ground { to { background:var(--vault) } }
  /* Fixed-slot swap (Cowork 9/23): in flight, the slot's own content hides after 300ms
     (visibility, so it keeps its space) and the L sits over the same box. Nothing moves. */
  .ls-slot-busy { position:relative; }
  .ls-slot-busy .ls-slot-hide { animation:ls-hide 0s linear 300ms forwards; }
  @keyframes ls-hide { to { visibility:hidden } }
  .ls-slot-loader { position:absolute; left:0; right:0; top:0; display:flex; justify-content:center; pointer-events:none; }
  .ls-slot-loader .ls-loader { padding:0; }
  .ls-loader svg { display:block; max-width:100%; height:auto; }
  .ls-loader--street line { stroke:var(--stone); stroke-width:1; }
  .ls-loader--street .stop { fill:var(--paper); stroke:var(--stone); stroke-width:1; }
  .ls-loader--street .cur { fill:var(--gold-on-paper); animation:ls-walk 2.8s steps(7,end) infinite; }
  .ls-on-vault.ls-loader--street .stop { fill:var(--vault); }
  .ls-on-vault.ls-loader--street .cur { fill:var(--gold-on-green); }
  @keyframes ls-walk { from { transform:translateX(0) } to { transform:translateX(168px) } }
  .ls-loader--mark .stroke { stroke:var(--vault); stroke-dasharray:80; stroke-dashoffset:80; animation:ls-draw 2.4s cubic-bezier(.2,.6,.2,1) infinite; }
  .ls-loader--mark .seal { fill:var(--gold-on-paper); opacity:0; animation:ls-land 2.4s linear infinite; }
  .ls-on-vault.ls-loader--mark .stroke { stroke:var(--paper); }
  .ls-on-vault.ls-loader--mark .seal { fill:var(--gold-on-green); }
  @keyframes ls-draw { 0% { stroke-dashoffset:80 } 45%,85% { stroke-dashoffset:0 } 100% { stroke-dashoffset:0 } }
  @keyframes ls-land { 0%,45% { opacity:0 } 50%,85% { opacity:1 } 100% { opacity:0 } }
  @media (prefers-reduced-motion:reduce) { .ls-loader * { animation:none !important; } .ls-loader--mark .stroke { stroke-dashoffset:0; } .ls-loader--mark .seal { opacity:1; } }
  /* Homepage "Built for everyone involved" (9/23 redesign): two sides of the exchange with
     a stone rail between, attorneys on a full-width bridging row. No gold, no radius, no shadow. */
  .ls-everyone-lede { margin:14px 0 48px; font:400 16px/1.68 'DM Sans',sans-serif; color:var(--ink-soft); }
  .ls-everyone-grid { display:grid; grid-template-columns:1fr 1px 1fr; column-gap:48px; align-items:start; }
  .ls-everyone-rail { background:var(--stone); align-self:stretch; }
  .ls-everyone-eyebrow { margin:0 0 14px; font:500 11px/1.4 'DM Sans',sans-serif; letter-spacing:.14em; text-transform:uppercase; color:var(--ink); }
  .ls-everyone-sq { display:inline-block; width:8px; height:8px; background:var(--vault); margin-right:8px; vertical-align:1px; }
  .ls-everyone-item { border-top:1px solid var(--line); padding:18px 0; }
  .ls-everyone-item h3 { margin:0 0 6px; font:700 16px/1.3 'DM Sans',sans-serif; color:var(--ink); }
  .ls-everyone-item p { margin:0; font:400 15px/1.6 'DM Sans',sans-serif; color:var(--ink-soft); }
  .ls-everyone-bridge { margin-top:40px; border-top:1px solid var(--stone); border-bottom:1px solid var(--stone); padding:20px 0; }
  .ls-everyone-bridge h3 { margin:0 0 10px; font:700 20px/1.3 'DM Sans',sans-serif; color:var(--ink); }
  .ls-everyone-bridge p.ls-everyone-copy { margin:0; font:400 15px/1.6 'DM Sans',sans-serif; color:var(--ink-soft); }
  @media (max-width: 760px) {
    .ls-everyone-grid { grid-template-columns:1fr; row-gap:32px; }
    .ls-everyone-rail { display:none; }
  }
  .step-dot { width: 9px; height: 9px; border-radius: 0; flex-shrink: 0; transition: background 0.22s ease; }
  .done .step-dot { background: var(--status-ok); }
  .active-step .step-dot { background: var(--green); }
  .pending .step-dot { background: rgba(255,255,255,0.18); }
  .status-step:hover .step-dot { background: var(--green) !important; }
  .step-label { color: rgba(255,255,255,0.8); font-weight: 500; transition: color 0.18s ease; }
  .done .step-label { color: rgba(255,255,255,0.65); text-decoration: line-through; }
  .active-step .step-label { color: var(--green); }
  .status-step:hover .step-label { color: rgba(255,255,255,0.98) !important; text-decoration: none !important; }
  .step-badge { margin-left: auto; font-size: 0.7rem; padding: 2px 8px; border-radius:0; font-weight: 600; }
  .done .step-badge { background: var(--status-ok-soft); color: var(--status-ok); }
  .active-step .step-badge { background: rgba(16,53,43,0.2); color: var(--green); }
  .pending .step-badge { background: rgba(255,255,255,0.06); color: rgba(255,255,255,0.55); }
  .step-tip { display: block; font-size: 0.7rem; color: rgba(255,255,255,0); max-height: 0; overflow: hidden; transition: color 0.22s ease, max-height 0.25s ease, margin-top 0.22s ease; line-height: 1.4; margin-top: 0; font-weight: 400; letter-spacing: 0.01em; }
  .status-step:hover .step-tip { color: rgba(255,255,255,0.55); max-height: 40px; margin-top: 2px; }

  /* Admin overview dashboard */
  .adm-overview { max-width:1400px; margin:0 auto; padding:32px 48px; margin-bottom:28px; }
  .adm-collapsible-header:hover { background: rgba(16,53,43,0.02); border-radius: 0; }
  .adm-chevron { user-select: none; }
  .adm-two-col { display:grid; grid-template-columns:55fr 45fr; gap:16px; }
  .adm-section-title { font-family:'DM Sans',sans-serif; font-size:0.95rem; font-weight:600; color:var(--green); margin:0 0 14px; display:flex; align-items:center; gap:8px; }
  .adm-action-list { display:flex; flex-direction:column; gap:0; }
  .adm-action-item { display:flex; align-items:flex-start; gap:12px; padding:11px 0; border-bottom:1px solid var(--gray-light); }
  .adm-action-item:last-child { border-bottom:none; }
  .adm-action-dot { width:8px; height:8px; border-radius:0; flex-shrink:0; margin-top:5px; }
  .adm-action-text { font-size:0.83rem; color:var(--green); font-weight:500; line-height:1.45; }
  .adm-action-meta { font-size:0.75rem; color:var(--gray); margin-top:2px; }
  .adm-action-empty { font-size:0.83rem; color:var(--gray); padding:18px 0; text-align:center; }
  .adm-activity-list { display:flex; flex-direction:column; gap:0; }
  .adm-activity-item { display:flex; align-items:flex-start; gap:11px; padding:10px 0; border-bottom:1px solid var(--gray-light); }
  .adm-activity-item:last-child { border-bottom:none; }
  .adm-activity-dot { width:7px; height:7px; border-radius:0; flex-shrink:0; margin-top:5px; }
  .adm-activity-text { font-size:0.82rem; color:var(--green); line-height:1.4; }
  .adm-activity-time { font-size:0.73rem; color:var(--gray); margin-top:2px; }
  .adm-quicklinks { display:flex; flex-direction:column; gap:8px; margin-top:14px; }
  .adm-quicklink { display:flex; align-items:center; gap:10px; padding:10px 14px; background:rgba(16,53,43,0.03); border:1px solid var(--line); border-radius:0; cursor:pointer; transition:background-color .18s ease-out, border-color .18s ease-out; font-size:0.83rem; font-weight:600; color:var(--green); text-decoration:none; }
  .adm-quicklink:hover { background:rgba(16,53,43,0.08); border-color:rgba(16,53,43,0.4); }
  .adm-quicklink svg { flex-shrink:0; opacity:0.6; }
  @media(max-width:900px) { .adm-two-col { grid-template-columns:1fr; } }

  /* Party dashboard checklist */
  .pd-check-step { display:flex; align-items:flex-start; gap:16px; padding:16px 0; border-top:1px solid var(--line); transition:border-left-color 0.3s; }
  .pd-check-step.needs-action { border-left:3px solid #10352B; padding-left:14px; margin-left:-17px; }
  .pd-check-circle { width:32px; height:32px; border-radius:0; border:1px solid var(--stone); display:flex; align-items:center; justify-content:center; flex-shrink:0; transition:background 0.35s ease, border-color 0.35s ease, box-shadow 0.35s ease; background:white; }
  .pd-check-circle.complete { background:var(--vault); border-color:var(--vault); }
  .pd-check-circle.incomplete { background:#10352B; border-color:#10352B; }
  .pd-check-circle.incomplete span { color:#10352B !important; }
  .pd-check-circle.pending { background:#10352B; border-color:#10352B; }
  .pd-check-circle.pending span { color:#10352B !important; }
  .pd-check-label { font-size:0.88rem; font-weight:600; color:var(--green); transition:color 0.3s, text-decoration 0.3s; }
  .pd-check-step.is-complete .pd-check-label { color:var(--gray); text-decoration:line-through; text-decoration-color:rgba(107,114,128,0.4); }
  .pd-check-desc { font-size:0.8rem; color:var(--ink-3); margin-top:3px; line-height:1.5; }
  .pd-check-badge { flex-shrink:0; font-size:0.72rem; padding:3px 9px; border-radius:0; font-weight:700; transition:background 0.3s, color 0.3s; align-self:flex-start; margin-top:2px; }
  .pd-check-badge.pending { background:var(--amber-soft); color:var(--amber); }
  .pd-check-badge.complete { background:var(--status-ok-soft); color:var(--status-ok); }
  .pd-check-badge.incomplete { background:rgba(16,53,43,0.12); color:#b45309; }

  .stats-bar { background: var(--green-mid); border-bottom: 1px solid rgba(16,53,43,0.15); padding: 26px 40px; }
  .stats-inner { max-width: 1100px; margin: 0 auto; display: grid; grid-template-columns: repeat(4,1fr); gap: 20px; }
  .stat { text-align: center; }
  .stat-num { font-family: 'DM Sans', sans-serif; font-weight: 700; font-size: 2rem; color: var(--green); display: block; }
  .stat-label { font-size: 0.75rem; color: rgba(255,255,255,0.65); margin-top: 4px; white-space: nowrap; }
  .stat { text-align: center; display: flex; flex-direction: column; align-items: center; }

  section { padding: 76px 40px; }
  .section-inner { max-width: 1100px; margin: 0 auto; }
  .section-tag { font-size: 11px; font-weight: 500; letter-spacing: 0.14em; text-transform: uppercase; color: var(--ink-soft); margin-bottom: 10px; }
  .section-title { font-family: 'DM Sans', sans-serif; font-size: 2.1rem; color: var(--green); margin-bottom: 14px; line-height: 1.2; letter-spacing: -0.02em; }
  .section-sub { font-size: 1rem; color: var(--gray); max-width: 580px; line-height: 1.7; }

  .role-card { padding:14px 16px;border:1px solid var(--line);border-radius:0;cursor:pointer;transition:background-color .18s ease-out, border-color .18s ease-out; }
  .role-card:hover { border-color:var(--green);background:rgba(16,53,43,0.04); }
  .role-card.selected { border-color:var(--green);background:rgba(16,53,43,0.08); }
  .signup-step-dot { width:10px;height:10px;border-radius:0;background:var(--gray-light);transition:background 0.2s; }
  .signup-step-dot.active { background:var(--green); }
  .signup-step-dot.done { background:var(--green); }
  .timeline { display: flex; flex-direction: row; align-items: flex-start; position: relative; }
  .timeline::before { content: ''; position: absolute; top: 18px; left: 0; right: 0; height: 1px; background: var(--stone); opacity: 1; z-index: 0; }

  .parties-head { display: grid; grid-template-columns: 1fr 1fr; gap: 60px; align-items: end; margin-bottom: 56px; }
  .parties-head .lhs .section-tag { margin-bottom: 12px; }
  .parties-head .lhs .section-title { margin-bottom: 0; }
  .parties-head .rhs { color: rgba(255,255,255,0.7); font-size: 0.95rem; line-height: 1.75; padding-bottom: 4px; max-width: 460px; }
  .parties-grid { display: grid; grid-template-columns: repeat(3,1fr); gap: 0; margin-top: 0; border-top: 1px solid rgba(16,53,43,0.2); }
  .party-card { padding: 38px 36px 36px; border-bottom: 1px solid rgba(16,53,43,0.18); border-right: 1px solid rgba(16,53,43,0.18); position: relative; transition: background 0.22s, box-shadow 0.22s, transform 0.22s; cursor: default; }
  .party-card:nth-child(3n) { border-right: none; }
  .party-card:nth-last-child(-n+3) { border-bottom: none; }
  .party-card-head { display: flex; align-items: center; gap: 16px; margin-bottom: 16px; }
  .party-num { font-family: 'DM Sans', sans-serif; font-size: 0.72rem; font-weight: 600; color: rgba(255,255,255,0.35); letter-spacing: 0.16em; line-height: 1; display: inline-block; transition: color 0.22s, transform 0.22s; }
  .party-icon { display: none; }
  .party-label { font-size: 0.65rem; font-weight: 700; letter-spacing: 0.18em; text-transform: uppercase; color: var(--green); margin-bottom: 0; }
  .party-card h4 { color: var(--white); font-family: 'DM Sans', sans-serif; font-size: 1.1rem; font-weight: 700; margin-bottom: 14px; letter-spacing: -0.015em; line-height: 1.3; max-width: 280px; position: relative; }
  .party-card h4::after { content: ''; position: absolute; bottom: -2px; left: 0; width: 0; height: 1.5px; background: #10352B; transition: width 0.28s ease; }
  .party-card p { color: rgba(255,255,255,0.7); font-size: 0.85rem; line-height: 1.72; max-width: 320px; }
  /* Mouse devices — full motion hover */
  @media (hover: hover) and (prefers-reduced-motion: no-preference) {
    .party-card:hover { background: rgba(16,53,43,0.06); }
    .party-card:hover .party-num { color: #10352B; }
    .party-card:hover h4::after { width: 36%; }
  }
  /* Mouse devices — reduced motion: color/border only, no movement */
  @media (hover: hover) and (prefers-reduced-motion: reduce) {
    .party-card:hover { background: rgba(16,53,43,0.06); box-shadow:none; }
    .party-card:hover .party-num { color: #10352B; }
  }

  .contact-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 56px; align-items: start; margin-top: 0; }
  .contact-form { background: var(--white); border: 1px solid var(--gray-light); border-radius:0; padding: 34px; }
  .form-row { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }
  .form-group { margin-bottom: 18px; }
  .form-group label { display: block; font-size: 0.82rem; font-weight: 600; color: var(--green); margin-bottom: 6px; }
  .form-group input, .form-group select, .form-group textarea { width: 100%; padding: 10px 13px; border: 1px solid var(--line-strong); border-radius: 0; font-size: 0.88rem; font-family: 'DM Sans', sans-serif; color: var(--green); background: var(--cream); transition: border-color 0.2s; outline: none; }
  .form-group input:focus, .form-group select:focus, .form-group textarea:focus { border-color: var(--ink); }
  .form-group textarea { height: 96px; resize: none; }
  .contact-info h3 { font-family: 'DM Sans', sans-serif; font-size: 1.35rem; color: var(--green); margin-bottom: 20px; font-weight: 700; letter-spacing: -0.01em; }

  /* DASHBOARD */
  .dashboard-page { background: var(--cream-2); }
  .dash-header { background: var(--green); padding: 24px 40px; display: flex; align-items: center; justify-content: space-between; }
  .dash-header h2 { font-family: 'DM Sans', sans-serif; font-weight: 700; letter-spacing: -0.01em; color: var(--white); font-size: 1.35rem; }
  .dash-header p { color: rgba(255,255,255,0.70); font-size: 0.83rem; margin-top: 2px; }
  .dash-header-right { display: flex; gap: 12px; align-items: center; }
  .dash-body { padding: 28px 40px; max-width: 1600px; margin: 0 auto; }

  .progress-tracker { background: var(--white); border-radius:0; padding: 26px 30px; margin-bottom: 24px; border: 1px solid var(--gray-light); }
  .progress-tracker h3 { font-size: 0.8rem; font-weight: 600; color: var(--gray); text-transform: uppercase; letter-spacing: 1px; margin-bottom: 22px; }
  .tracker-steps { display: flex; align-items: center; }
  .tracker-step { display: flex; flex-direction: column; align-items: center; flex: 1; position: relative; }
  .tracker-step:not(:last-child)::after { content: ''; position: absolute; top: 18px; left: 50%; right: -50%; height: 2px; background: var(--gray-light); z-index: 0; }
  /* Row 100 ruling 9/17: NOT swapped to _llStopStrip — this is the admin's click-to-change-stage
     CONTROL on the case-stage model, not the party-facing Street. Restyled on tokens only. */
  .tracker-step.completed:not(:last-child)::after { background: var(--vault); }
  .tracker-step.current:not(:last-child)::after { background: var(--gray-light); }
  .tracker-circle { width: 36px; height: 36px; border-radius: 0; display: flex; align-items: center; justify-content: center; font-size: 0.82rem; font-weight: 600; z-index: 1; position: relative; margin-bottom: 7px; }
  .tracker-step.completed .tracker-circle { background: var(--vault); color: var(--paper); }
  .tracker-step.current .tracker-circle { background: var(--green); color: var(--paper); }
  .tracker-step.pending .tracker-circle { background: transparent; border: 1px solid var(--stone); color: var(--ink-faint); box-sizing: border-box; }
  .tracker-label { font-size: 0.8rem; color: var(--gray); text-align: center; font-weight: 500; }
  .tracker-step.current .tracker-label { color: var(--green); font-weight: 600; }
  .tracker-step.completed .tracker-label { color: var(--ink-soft); }

  .dash-grid { display: grid; grid-template-columns: 2fr 1fr; gap: 22px; margin-bottom: 22px; }
  .dash-card { background: var(--paper); border-radius: 0; border: 1px solid var(--line); overflow: hidden; }
  .dash-card-header { padding: 16px 22px; border-bottom: 1px solid var(--line-soft); display: flex; align-items: center; justify-content: space-between; }
  .dash-card-header h3 { font-size: 0.92rem; font-weight: 600; color: var(--ink); }
  .dash-card-body { padding: 18px 22px; }
  /* 10/01 (Kelly, polish 2): the party-dashboard cards share ONE inner padding (--pd-pad). Header, tabs and rows
     start at the same left edge, desktop and phone; the cards themselves carry no padding. */
  :root { --pd-pad: 24px; }
  #pd-cases-card, #pd-action-card, #pd-library-card, #pd-activity-card { padding:0 !important; }
  #pd-cases-card > .dash-card-header, #pd-action-card > .dash-card-header, #pd-library-card > .dash-card-header, #pd-activity-card > .dash-card-header { padding:16px var(--pd-pad) 12px !important; margin:0 !important; border-bottom:1px solid var(--line-soft); display:flex; align-items:center; justify-content:space-between; gap:12px; flex-wrap:wrap; }
  #pd-cases-list, #pd-action-items, #pd-library-body, #pd-activity-log { padding:6px var(--pd-pad) 14px !important; }
  #pd-cases-list .pd-case-row { padding-left:0; padding-right:0; }
  .pd-lib-row { display:flex; align-items:center; gap:10px; padding:9px 0; border-bottom:1px solid #f1f5f9; }
  .pd-lib-main { flex:1; min-width:0; }
  .pd-lib-acts { display:flex; align-items:center; gap:10px; flex:none; }
  @media (max-width: 480px) {
    :root { --pd-pad: 16px; }
    /* 10/01 (Kelly, polish 3): "Your Cases" on its own line with the Active / Closed tabs under it; a document row
       stacks its title and date, then its pill and Download on one line, so titles never wrap mid-phrase. */
    #pd-cases-card > .dash-card-header { flex-direction:column; align-items:flex-start; gap:10px; }
    #pd-cases-toggle { width:100%; }
    #pd-cases-search-wrap { width:100%; align-self:stretch; } /* 10/02 (Kelly, polish 2): the search box spans the card */
    .pd-lib-row { flex-wrap:wrap; row-gap:6px; }
    .pd-lib-main { flex:1 1 100%; }
    .pd-lib-acts { flex:1 1 100%; }
    /* 10/03 (Kelly, counsel item 9): the New Case party row wraps on a phone: the name on its own line, the role,
       participation and Represents selects below it, none running past the card. */
    .nc-party-row { flex-wrap:wrap; row-gap:8px; }
    .nc-party-row .nc-party-name { flex:1 1 100% !important; } /* the row sets flex:1 inline; !important wins (hover-layer gotcha) */
    .nc-party-row select { flex:1 1 40%; max-width:none !important; min-width:0; }
  }

  .parties-table { width: 100%; border-collapse: collapse; }
  .parties-table th { font-size: 0.8rem; text-transform: uppercase; letter-spacing: 1px; color: var(--gray); font-weight: 600; padding: 8px 12px; text-align: left; border-bottom: 1px solid var(--gray-light); }
  .parties-table td { padding: 11px 12px; font-size: 0.83rem; color: var(--green); border-bottom: 1px solid var(--gray-light); }
  .parties-table tr:last-child td { border-bottom: none; }
  .status-pill { display: inline-block; padding: 2px 8px; border-radius: 0; font-size: 11px; font-weight: 600; letter-spacing: 0.01em; }
  .pill-green, .chip-ok { background: var(--status-ok-soft); color: var(--status-ok); }
  .pill-gold, .chip-neutral { background: var(--wash); color: var(--ink-soft); }
  .pill-gray { background: var(--wash); color: var(--ink-soft); }
  .pill-blue { background: var(--vault); color: var(--paper); } /* ruled 9/17: pill-blue marks the CURRENT state -> vault chip */
  .pill-red, .chip-blocked { background: var(--red-soft); color: var(--red); }

  /* Party-dashboard eyebrow label */
  .pd-eyebrow { font-size:11px; font-weight:500; letter-spacing:0.14em; text-transform:uppercase; color:var(--ink-soft); }

  .activity-item { display: flex; gap: 11px; padding: 11px 0; border-bottom: 1px solid var(--line); align-items: flex-start; }
  .activity-item:last-child { border-bottom: none; }
  .activity-dot { width: 8px; height: 8px; border-radius: 0; margin-top: 4px; flex-shrink: 0; }
  .activity-text { font-size: 0.8rem; color: var(--green); line-height: 1.4; }
  .activity-time { font-size: 0.8rem; color: var(--ink-3); margin-top: 2px; }
  /* Stage 7 — Party activity feed: avatar + timeline */
  .pd-act-list { padding:2px 0; }
  .pd-act-item { display:grid;grid-template-columns:32px 1fr;gap:12px;padding:12px 0;position:relative; }
  .pd-act-item::before { content:'';position:absolute;left:15px;top:44px;bottom:-12px;width:1px;background:var(--line); }
  .pd-act-item:last-child::before { display:none; }
  .pd-act-avatar { width:32px;height:32px;border-radius:0;display:flex;align-items:center;justify-content:center;font-size:10px;font-weight:700;flex-shrink:0;position:relative;z-index:1;border:2px solid var(--paper); }
  .pd-act-avatar.av-you { background:var(--green);color:var(--paper); }
  .pd-act-avatar.av-admin { background:var(--green);color:white; }
  .pd-act-avatar.av-system { background:var(--cream-2,#f0efeb);color:var(--ink-3); }
  .pd-act-body { padding-top:4px; }
  .pd-act-text { font-size:0.78rem;color:var(--ink);line-height:1.5; }
  .pd-act-who { font-weight:700; }
  .pd-act-chip { font-family:ui-monospace,Menlo,monospace;font-size:0.68rem;color:var(--ink-3);padding:1px 5px;background:var(--cream,#f7f6f3);border:1px solid var(--line);border-radius:0;margin-left:4px; }
  .pd-act-time { font-size:0.7rem;color:var(--ink-3);margin-top:2px; }
  .pd-act-ctx { margin-top:7px;padding:7px 10px;background:var(--cream,#f7f6f3);border-radius:0;font-size:0.74rem;color:var(--ink-2);border:1px solid var(--line);font-style:normal; }

  .amount-row { display: flex; justify-content: space-between; align-items: center; padding: 9px 0; border-bottom: 1px solid var(--gray-light); font-size: 0.83rem; }
  .amount-row:last-child { border-bottom: none; }
  .amount-row .label { color: var(--gray); }
  .amount-row .value { font-weight: 600; color: var(--green); }
  .amount-row.total .label { font-weight: 700; color: var(--green); }
  .amount-row.total .value { color: var(--green); font-size: 1rem; font-family: 'DM Sans', sans-serif; font-weight: 700; }


  .action-cards { display: grid; grid-template-columns: repeat(3,1fr); gap: 18px; margin-bottom: 24px; }
  .action-card { background: var(--white); border: 1px solid var(--gray-light); border-radius: 0; padding: 22px; cursor: pointer; transition: background-color .18s ease-out, border-color .18s ease-out; }
  .action-card:hover { background: var(--wash); }
  .action-card-icon { font-size: 1.5rem; margin-bottom: 10px; display:flex; align-items:center; justify-content:center; height:28px; }
  .action-card h4 { font-size: 0.92rem; font-weight: 600; color: var(--green); margin-bottom: 5px; }
  .action-card p { font-size: 0.78rem; color: var(--gray); line-height: 1.5; }

  .upload-zone { border: 1px dashed var(--stone); border-radius:0; padding: 38px; text-align: center; cursor: pointer; transition: background-color .18s ease-out, border-color .18s ease-out; background: var(--cream); margin-bottom: 18px; }
  .upload-zone:hover { border-color: var(--green); background: var(--green-wash); }
  .upload-zone .upload-icon { font-size: 2rem; margin-bottom: 9px; }
  .upload-zone h4 { font-size: 0.92rem; font-weight: 600; color: var(--green); margin-bottom: 4px; }
  .upload-zone p { font-size: 0.78rem; color: var(--gray); }

  .doc-list { background: var(--white); border: 1px solid var(--gray-light); border-radius: 0; overflow: hidden; }
  .doc-item { display: flex; align-items: center; gap: 13px; padding: 13px 18px; border-bottom: 1px solid var(--gray-light); }
  .doc-item:last-child { border-bottom: none; }
  .doc-icon { font-size: 1.15rem; }
  .doc-info { flex: 1; }
  .doc-info h5 { font-size: 0.83rem; font-weight: 600; color: var(--green); }
  .doc-info p { font-size: 0.8rem; color: var(--gray); }

  footer { background: var(--green); padding: 36px 40px; border-top: 1px solid rgba(16,53,43,0.2); }
  .footer-inner { max-width: 1100px; margin: 0 auto; display: flex; justify-content: space-between; align-items: center; }
  .footer-logo { font-family: 'DM Sans', sans-serif; font-weight: 700; font-size: 1.25rem; color: var(--white); }
  .footer-logo span { color: var(--green); }
  .footer-copy { font-size: 0.78rem; color: rgba(255,255,255,0.55); margin-top: 3px; }
  .footer-links { display: flex; gap: 22px; }
  .footer-links a { color: rgba(255,255,255,0.65); font-size: 0.78rem; text-decoration: none; }
  .footer-links a:hover { color: var(--paper); }

  /* z-7000 (Bug Class I, 2026-07-15): toasts must top EVERYTHING — the V2 console overlay
     is z-5000 and its modals are z-6000/6100, so the old z-999 made every toast fired
     inside the admin console invisible (the Remind/Resend "silent no-op" bug). */
  .toast { position: fixed; bottom: 22px; right: 22px; background: var(--vault); color: var(--white); padding: 13px 18px; border-radius: 0; border: 1px solid rgba(247,245,240,0.25); font-size: 0.83rem; display: none; z-index: 7000; }
  .toast.show { display: block; }
  .tracker-step.completed:hover .tracker-circle { background: var(--vault-mid); }
  .tracker-circle { transition: background 0.15s, border-color 0.15s; }
  .doc-upload-btn { display:flex; flex-direction:column; align-items:center; gap:6px; background:var(--cream); border:1px solid var(--line); border-radius:0; padding:14px 10px; cursor:pointer; font-size:0.8rem; font-weight:600; color:var(--green); font-family:'DM Sans',sans-serif; transition:all 0.2s; text-align:center; }
  .doc-upload-btn:hover { border-color:var(--green); background:rgba(16,53,43,0.06); color:var(--green); }
  .doc-upload-btn.uploaded { border-color:var(--status-ok); background:rgba(16,185,129,0.06); color:var(--status-ok); }
  .doc-item-row { display:flex; align-items:center; justify-content:space-between; padding:10px 14px; background:var(--white); border:1px solid var(--gray-light); border-radius:0; margin-bottom:8px; }
  .doc-item-row .doc-name { font-size:0.85rem; font-weight:600; color:var(--green); }
  .doc-item-row .doc-meta { font-size:0.82rem; color:var(--gray); margin-top:2px; }
  
  /* Focus styles for keyboard navigation */
  :focus-visible { outline: 3px solid var(--vault); outline-offset: 2px; border-radius: 0; }
  nav :focus-visible, #pd-hero2 :focus-visible, .adminv2-nav :focus-visible { outline-color: var(--paper); }
  #pd-cases-list.pd-seat-payor .pd-case-row:not(.pd-case-row-payor), #pd-cases-list.pd-seat-payor .pd-sec-liens, #pd-cases-list.pd-seat-payor .pd-lien-part { display: none; }
  #pd-cases-list.pd-seat-lien .pd-case-row-payor:not(.pd-has-lien), #pd-cases-list.pd-seat-lien .pd-sec-paying, #pd-cases-list.pd-seat-lien .pd-payor-part { display: none; }
  #pd-cases-list.pd-seat-lien .pd-lien-part { margin-left: 0 !important; padding-left: 0 !important; border-left: none !important; }
  #pd-cases-list .pd-lien-part:not(:has(> .pd-lien-card:not(:empty))) { display: none; }
  button:focus-visible, a:focus-visible, input:focus-visible, select:focus-visible, textarea:focus-visible { outline: 3px solid var(--vault); outline-offset: 2px; }
  :focus:not(:focus-visible) { outline: none; }
  /* A1 (a11y pass 9/01): keyboard focus is VISIBLE - gold ring on :focus-visible only;
     mouse :focus stays quiet. !important beats scattered outline:none inline styles. */
  :focus-visible { outline: 3px solid var(--vault) !important; outline-offset: 2px; }
  nav :focus-visible, #pd-hero2 :focus-visible { outline-color: var(--paper) !important; }
  button { cursor: pointer; }
  button:disabled { cursor: not-allowed; }

  /* ── MOBILE RESPONSIVE ─────────────────────────────── */
  @media (max-width: 768px) {
    .lh-activity-row { flex-direction: column; }
    .lh-main-col, .lh-activity-col { flex: none !important; width: 100%; max-height: none !important; }

    /* NAV */
    nav { padding: 0 18px; height: 60px; }
    .logo img { height: 32px; }
    .nav-links { gap: 14px; }
    .nav-links a { font-size: 0.82rem; }
    .nav-cta { padding: 6px 14px; font-size: 0.82rem; }
    .page { padding-top: 60px; }

    /* HERO */
    .btn-gold, .btn-outline { width: 100%; text-align: center; padding: 13px 20px; }

    /* STATS BAR */
    .stats-bar { padding: 20px 18px; }
    .stats-inner { grid-template-columns: repeat(2,1fr); gap: 16px; }
    .stat-num { font-size: 1.5rem; }

    /* SECTIONS */
    section { padding: 48px 20px; }
    .section-title { font-size: 1.6rem; }
    .section-sub { font-size: 0.9rem; }

    /* HOW IT WORKS */
    .timeline { flex-direction: column; gap: 0; align-items: center; }
    .timeline::before { display: block; left: 50%; right: auto; top: 0; height: 100%; width: 1px; background: rgba(16,53,43,0.35); opacity: 1; transform: translateX(-50%); }

    /* PARTY CARDS */
    .parties-head { grid-template-columns: 1fr; gap: 18px; margin-bottom: 32px; }
    .parties-head .rhs { font-size: 0.9rem; }
    .parties-grid { grid-template-columns: 1fr; gap: 0; margin-top: 0; }
    .party-card { padding: 28px 20px 26px; border-right: none !important; border-bottom: 1px solid rgba(16,53,43,0.18) !important; }
    .party-card:last-child { border-bottom: none !important; }

    /* CONTACT SECTION */
    .contact-grid { grid-template-columns: 1fr; gap: 32px; }
    .contact-form { padding: 22px 18px; }
    .form-row { grid-template-columns: 1fr; gap: 0; }

    /* FOOTER */
    footer { padding: 28px 20px; }
    .footer-inner { flex-direction: column; gap: 16px; text-align: center; }
    .footer-links { justify-content: center; flex-wrap: wrap; gap: 14px; }

    /* DASHBOARD */
    .dash-header { padding: 16px 18px; flex-direction: column; align-items: flex-start; gap: 12px; }
    .dash-header-right { width: 100%; justify-content: flex-start; }
    .dash-body { padding: 16px 18px; }
    .dash-grid { grid-template-columns: 1fr; }
    #dashboard-cases-list { padding: 16px 18px !important; }

    /* PROGRESS TRACKER - stack on mobile */
    .progress-tracker { padding: 18px; overflow-x: auto; }
    .tracker-steps { min-width: 500px; }

    /* TABLES - make scrollable */
    .parties-table { font-size: 0.78rem; }
    .parties-table th, .parties-table td { padding: 8px 8px; }
    .dash-card-body { overflow-x: auto; padding: 12px; }

    /* PORTAL */
    .portal-content { padding: 18px; }
    .action-cards { grid-template-columns: 1fr; gap: 12px; }

    /* UPLOAD ZONE */
    .upload-zone { padding: 24px 18px; }

    /* AUTH MODAL */
    #auth-screen > div { padding: 28px 22px; margin: 16px; }

    /* NEW CASE MODAL */
    #new-case-modal > div { padding: 20px 18px; margin: 10px; max-height: 95vh; overflow-y: auto; }
    /* 9/18 fix 4: three tier cards cut off in one row at 375 — stack them.
       !important because the grid is inline-styled (marketing-hover-layer gotcha). */
    #nc-tier-grid { grid-template-columns: 1fr !important; }
  }

  @media (max-width: 480px) {
    .stats-inner { grid-template-columns: repeat(2,1fr); }
    .section-title { font-size: 1.4rem; }
    /* 9/29 (Kelly, phone pass): signed in, the bar is the logo plus one menu button; the links drop
       down from it. The lienholder hero uses smaller type; the Street shows the current stop's
       label only. */
    body.ll-authed #nav-burger { display:inline-flex !important; align-items:center; background:none; border:none; color:var(--paper); cursor:pointer; padding:6px; }
    body.ll-authed .nav-links { display:none; }
    body.ll-authed .nav-links.open { display:flex; flex-direction:column; align-items:flex-start; position:absolute; top:60px; left:0; right:0; background:var(--green); padding:14px 18px 18px; gap:14px; border-bottom:1px solid rgba(247,245,240,0.14); }
    body.ll-authed .nav-links #nav-user-email { max-width:none; white-space:normal; }
    /* 10/01 (Kelly, polish 5): in the phone menu the contact name is a small label above the links, not a menu item. */
    body.ll-authed .nav-links.open #nav-user-email { order:-1; width:100%; font-size:0.68rem !important; font-weight:700; letter-spacing:0.1em; text-transform:uppercase; color:rgba(247,245,240,0.55) !important; padding-bottom:8px; border-bottom:1px solid rgba(247,245,240,0.14); }
    #pd-hero h2 { font-size:22px !important; line-height:1.3 !important; }
    .llstrip .llstrip-lbl:not(.cur), .llstrip .llstrip-lbl-s:not(.cur) { visibility:hidden; }
  }
  /* LL_PRIVATE_MODE (Poston 9/02): homepage -> holding card; everything else untouched */
  body.ll-private #main-content > * { display: none !important; }
  body.ll-private #main-content > #ll-private-holding { display: flex !important; }
  body.ll-private #home footer { display: none !important; }
  body.ll-private #nav-security, body.ll-private #nav-pricing { display: none !important; }
  /* CRITICAL: auth modal must NEVER show on page load */
  #auth-screen { display: none !important; }
  #auth-modal-card { display: none !important; }
  /* Admin preview: disable all action buttons inside pd-content-wrapper */
  .pd-preview-mode button { pointer-events:none !important; opacity:0.5 !important; }
  /* S2 (9/01 ruling): READ-ONLY expanders stay live in admin preview — Open case, view
     tabs/toggles, doc downloads. Mutations remain locked (no pd-preview-ok on writers). */
  .pd-preview-mode button.pd-preview-ok { pointer-events:auto !important; opacity:1 !important; }
  /* Non-interactive text: default cursor to prevent unwanted I-beam on non-editable content */
  h1, h2, h3, h4, h5, h6, p, span, td, th, label,
  .status-pill, .adm-action-text, .adm-action-meta,
  .adm-activity-text, .adm-activity-time,
  .pd-check-label, .pd-check-desc,
  .dash-card-header h3, .adm-section-title,
  .dash-card, .dash-card-body, .stat-card,
  .card, .page-section, .adm-section, .case-detail-card { cursor: default; }
  /* ── Your Actions section (case detail, party view) ────── */
  #your-actions-section .ya-card, .ya-scope .ya-card { background:var(--white); border:1px solid var(--stone); border-radius:0; overflow:hidden; margin-bottom:18px; }
  #your-actions-section .ya-card:last-child, .ya-scope .ya-card:last-child { margin-bottom:0; }
  #your-actions-section .ya-card-header, .ya-scope .ya-card-header { background:var(--green); padding:14px 22px; display:flex; align-items:center; justify-content:space-between; }
  #your-actions-section .ya-card-header h3, .ya-scope .ya-card-header h3 { font-size:0.92rem; font-weight:700; color:var(--white); margin:0; }
  #your-actions-section .ya-card-body, .ya-scope .ya-card-body { padding:18px 22px; }
  #your-actions-section .ya-step, .ya-scope .ya-step { display:flex; align-items:flex-start; gap:14px; padding:12px 0; border-bottom:1px solid var(--gray-light); }
  #your-actions-section .ya-step:last-child, .ya-scope .ya-step:last-child { border-bottom:none; padding-bottom:0; }
  #your-actions-section .ya-step:first-child, .ya-scope .ya-step:first-child { padding-top:0; }
  #your-actions-section .ya-step-num, .ya-scope .ya-step-num { width:30px; height:30px; border-radius:0; display:flex; align-items:center; justify-content:center; flex-shrink:0; font-size:0.82rem; font-weight:700; }
  #your-actions-section .ya-step-num.pending, .ya-scope .ya-step-num.pending { background:transparent; color:var(--gold-on-paper); border:1px solid var(--stone); }
  #your-actions-section .ya-step-num.done, .ya-scope .ya-step-num.done { background:var(--vault); color:var(--paper); }
  #your-actions-section .ya-step-num.waiting, .ya-scope .ya-step-num.waiting { background:transparent; color:var(--gold-on-paper); border:1px solid var(--stone); }
  #your-actions-section .ya-step-title, .ya-scope .ya-step-title { font-size:0.88rem; font-weight:600; color:var(--green); margin-bottom:4px; }
  #your-actions-section .ya-step-desc, .ya-scope .ya-step-desc { font-size:0.8rem; color:var(--gray); line-height:1.5; margin-bottom:6px; }
  #your-actions-section .ya-amount-row, .ya-scope .ya-amount-row { display:flex; justify-content:space-between; align-items:center; padding:6px 0; font-size:0.85rem; border-bottom:1px solid var(--gray-light); }
  #your-actions-section .ya-amount-row:last-child, .ya-scope .ya-amount-row:last-child { border-bottom:none; }
  #your-actions-section .ya-amount-label, .ya-scope .ya-amount-label { color:var(--gray); }
  #your-actions-section .ya-amount-value, .ya-scope .ya-amount-value { font-weight:600; color:var(--green); }
  #your-actions-section .ya-owner-grid, .ya-scope .ya-owner-grid { display:grid; grid-template-columns:1fr 1fr; gap:18px; }
  @media (max-width:700px) { #your-actions-section .ya-owner-grid { grid-template-columns:1fr; } #your-actions-section { padding:16px 18px 0; } }
  /* ── Action Items unified list ───────────────────────────── */
  .action-items-list { list-style:none; margin:0; padding:0; }
  .action-item { display:flex; align-items:flex-start; gap:10px; padding:10px 0; border-bottom:1px solid var(--gray-light); }
  .action-item:last-child { border-bottom:none; padding-bottom:0; }
  .action-item:first-child { padding-top:0; }
  .priority-dot { flex-shrink:0; width:9px; height:9px; border-radius:0; margin-top:5px; }
  .priority-0 { background:var(--red); }
  .priority-1 { background:#d97706; }
  .priority-2 { background:#6b7280; }
  .action-item-content { flex:1; min-width:0; }
  .action-item-label { font-size:0.85rem; font-weight:600; color:var(--green); line-height:1.4; }
  .action-item-description { font-size:0.8rem; color:var(--ink-3); line-height:1.5; margin-top:2px; }
  .action-item-tag-group { display:flex; flex-wrap:wrap; gap:5px; margin-top:5px; }
  .tag { display:inline-block; font-size:0.7rem; font-weight:600; padding:2px 7px; border-radius:0; letter-spacing:0.02em; }
  .tag-onboarding { background:var(--wash); color:var(--ink-soft); }
  .tag-case { background:var(--wash); color:var(--ink); cursor:pointer; text-decoration:underline; text-underline-offset:3px; }
  .tag-payor { background:var(--wash); color:var(--ink-soft); }
  .tag-payee { background:var(--wash); color:var(--ink-soft); } /* M2 (9/01): navy/gold palette only — purple retired */
  .action-items-empty { font-size:0.85rem; color:var(--ink-soft); font-weight:400; padding:4px 0; }
  /* ── Checklist sections + stepper (payee mini-refresh S2) ── */
  .pd-ck-section-h { font-size:11px; font-weight:500; letter-spacing:0.14em; text-transform:uppercase; color:var(--ink-soft); margin:18px 0 8px; display:flex; align-items:baseline; gap:8px; flex-wrap:wrap; }
  .pd-ck-section-h:first-child { margin-top:0; }
  .pd-ck-section-sub { font-size:0.68rem; font-weight:500; letter-spacing:0.01em; text-transform:none; color:#b6c0cd; }
  .pd-ck-stepper { margin-top:8px; }
  .pd-ck-step { display:flex; gap:10px; }
  .pd-ck-step-rail { display:flex; flex-direction:column; align-items:center; flex-shrink:0; }
  .pd-ck-step-dot { width:22px; height:22px; border-radius:0; display:flex; align-items:center; justify-content:center; font-size:0.72rem; font-weight:700; box-sizing:border-box; }
  .pd-ck-step-dot.done { background:var(--vault); color:white; }
  .pd-ck-step-dot.current { background:var(--green); color:var(--paper); }
  .pd-ck-step-dot.locked { background:var(--paper-2); color:var(--ink-faint); border:1px solid var(--line); }
  .pd-ck-step-line { flex:1; width:2px; min-height:14px; background:var(--line); margin:3px 0; }
  .pd-ck-step-body { flex:1; min-width:0; padding-bottom:12px; }
  .pd-ck-step:last-child .pd-ck-step-body { padding-bottom:0; }
  .pd-ck-step-label { font-size:0.83rem; font-weight:600; color:var(--green); line-height:22px; }
  .pd-ck-step-label.locked { color:var(--ink-faint); }
  .pd-ck-step-hint { font-size:0.76rem; color:var(--ink-3); line-height:1.45; margin-top:1px; }
  .pd-ck-done-toggle { background:none; border:none; padding:8px 0 0; margin-top:14px; border-top:1px solid var(--gray-light); width:100%; text-align:left; font-family:'DM Sans',sans-serif; font-size:0.78rem; font-weight:600; color:var(--ink); text-decoration:underline; cursor:pointer; display:flex; align-items:center; gap:6px; }
  .pd-ck-done-row { font-size:0.8rem; color:var(--ink-soft); padding:6px 0 0 2px; display:flex; align-items:center; gap:8px; }
  /* ── Info tooltip ─────────────────────────────────────────── */
  .ll-tooltip { position:relative; display:inline-flex; align-items:center; cursor:pointer; }
  .ll-tooltip::after {
    content: attr(data-tip);
    position: absolute;
    bottom: calc(100% + 7px);
    left: 50%;
    transform: translateX(-50%);
    background: #10352B;
    color: #fff;
    font-size: 0.72rem;
    font-weight: 500;
    line-height: 1.45;
    text-align: center;
    padding: 6px 10px;
    border-radius: 0;
    white-space: normal;
    max-width: 220px;
    width: max-content;
    pointer-events: none;
    opacity: 0;
    transition: opacity 0.15s ease;
    z-index: 1200;
  }
  .ll-tooltip:hover::after,
  .ll-tooltip.tip-active::after { opacity: 1; }

  /* ── Hero redesign v2026-04-06 (Direction A — Conservative fintech) ──── */
  /* Dark outline button for light backgrounds */
  .btn-outline-dark { background: white; color: var(--green); border: 1px solid var(--stone); padding: 13px 22px; border-radius: 0; font-size: 15px; font-weight: 600; cursor: pointer; transition: background-color .18s ease-out, color .18s ease-out, border-color .18s ease-out; font-family: 'DM Sans', sans-serif; text-decoration: none; display: inline-flex; align-items: center; }
  .btn-outline-dark:hover { background: var(--green); color: white; border-color: var(--green); }
  /* Eyebrow pill */
  /* Hero grid */
  /* Browser mockup */
  /* Hero hover effects — mouse + motion-ok only */
  @media (hover: hover) and (prefers-reduced-motion: no-preference) {
  }
  /* Reduced motion — color/fill only, no lifts */
  @media (hover: hover) and (prefers-reduced-motion: reduce) {
  }
  /* Floating settlement badge */
  /* Trust strip */
  /* #ll-top scoped overrides */
  /* Responsive */
  @media (max-width: 960px) {
  }
  @media (max-width: 540px) {
  }
  /* PA2 (sweep-b): pricing cards stack on small screens — the inline 3-col grid
     squeezed all three tiers side-by-side on phones (!important beats the inline style). */
  @media (max-width: 960px) {
    .pricing-3col { grid-template-columns: 1fr !important; max-width: 540px !important; margin: 0 auto; }
  }
  /* Party dashboard two-column layout */
  #pd-two-col-layout { display:flex; gap:24px; align-items:flex-start; }
  #pd-left-col { flex: 0 0 65%; min-width: 0; display:flex; flex-direction:column; gap:20px; }
  #pd-right-col { flex: 1; min-width: 0; display:flex; flex-direction:column; gap:20px; }
  @media (max-width: 1023px) {
    /* 9/29 (Kelly): stacked, each column runs the full width (flex-start had shrunk the account box
       and Recent activity to their content, leaving space beside them). */
    #pd-two-col-layout { flex-direction: column; align-items: stretch; }
    #pd-left-col, #pd-right-col { flex: 1 1 100%; width: 100%; }
  }
  /* Inline case detail panels — collapse animation */
  .pd-panel-body { display:grid; grid-template-rows:1fr; transition:grid-template-rows 0.2s ease; }
  .pd-panel-collapsed .pd-panel-body { grid-template-rows:0fr; }
  .pd-panel-body-inner { overflow:hidden; }
  .pd-panel-collapsed .pd-panel-header { border-radius:0 !important; border-bottom-color:var(--line) !important; }

  /* Party portal hero band — Stage 2 */
  #pd-hero { background: var(--green); padding: 28px 40px 88px; position: relative; overflow: hidden; }
  /* #pd-hero::before removed (sweep row 21): no gradients. */
  .pd-hero-inner { position: relative; z-index: 1; }
  .pd-hero-eyebrow { font-size: 0.68rem; font-weight: 500; letter-spacing: 0.14em; text-transform: uppercase; color: var(--stone); margin-bottom: 10px; }
  .pd-hero-title { font-family: 'DM Sans', sans-serif; font-size: 1.55rem; font-weight: 700; color: var(--paper); letter-spacing: -0.02em; margin: 0 0 12px; line-height: 1.2; }
  .pd-hero-meta-row { display: flex; align-items: center; gap: 6px; flex-wrap: wrap; }
  .pd-hero-meta-item { font-size: 0.74rem; font-weight: 600; color: var(--stone); letter-spacing: 0.01em; }
  .pd-hero-meta-sep { display: inline-block; width: 1px; height: 11px; background: rgba(255,255,255,0.18); margin: 0 6px; vertical-align: middle; }
  #pd-content-wrapper { margin-top: -72px; position: relative; z-index: 1; }
  @media (max-width: 1280px) { #pd-hero { padding-bottom: 68px; } #pd-content-wrapper { margin-top: -52px; } }
  @media (max-width: 768px) { #pd-hero { padding: 24px 24px 60px; } #pd-content-wrapper { margin-top: -44px; padding: 24px 24px 32px !important; } }
  /* Heroless payee geometry (top-clip fix, 2026-08-21): declarative class on the PAGE
     so the -72px hero-overlap can NEVER survive a heroless render — !important beats
     every media-query margin and any code path that restores the inline style to ''.
     The JS branch writes stay as belt-and-suspenders; this class is the truth. */
  #party-dashboard.pd-heroless #pd-hero { display: none; }
  #party-dashboard.pd-heroless #pd-content-wrapper { margin-top: 0 !important; }
  /* Stage 5 — Case milestone tracker */
  @keyframes ms-pulse { 0%,100%{box-shadow:none;}60%{box-shadow:none;} }
  /* Payor redesign (Stage B) — 2c Hybrid dashboard grids; single-column under 900px */
  .pyr2-grid { display:grid; grid-template-columns:1fr 372px; gap:24px; }
  .pyr2-grid.stretch { align-items:stretch; } .pyr2-grid.start { align-items:start; }
  .pyr2-kpis { display:flex; gap:56px; flex-wrap:wrap; }
  .pyr2-kpi-ls { display:none; } /* 10/02: the short stat label shows at phone width only */
  @media (max-width:900px) { .pyr2-grid { grid-template-columns:1fr; } .pyr2-kpis { gap:24px; } }
  /* 10/02 (Kelly, phone polish): at 375px the payor hero keeps its three stats on one compact row so the first case
     card shows without scrolling; the case-number chip never wraps; the share subline sits under the amount; a money
     row's amount takes its own line; lienholder cards run full width with the name on its own line; lien numbers never
     break mid-word. */
  @media (max-width:480px) {
    .pyr2-hero { padding:22px 20px 22px !important; }
    #pyr-hero-headline { font-size:24px !important; margin-bottom:6px !important; }
    .pyr2-hero-sub { font-size:13px !important; margin-bottom:14px !important; }
    .pyr2-kpis { gap:10px !important; flex-wrap:nowrap !important; }
    .pyr2-kpi { flex:1 1 0; min-width:0; }
    .pyr2-kpi-l { font-size:9.5px !important; letter-spacing:.06em !important; margin-bottom:3px !important; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
    .pyr2-kpi-v { font-size:19px !important; white-space:nowrap; }
    .pyr-case-head { flex-wrap:wrap; }
    .pyr-case-chip { white-space:nowrap; }
    .pyr-hero-amtrow { flex-direction:column !important; align-items:flex-start !important; gap:4px !important; }
    .pyr-money-head { flex-wrap:wrap; }
    .pyr-money-amt { flex:1 1 100%; white-space:nowrap; }
    .pyr-money-row { flex-wrap:wrap; }
    .pyr-money-pill { flex:1 1 100%; padding-left:52px; }
    .pyr2-kpi-ll { display:none; }
    .pyr2-kpi-ls { display:inline; }
    .pyr-lh-grid { grid-template-columns:1fr !important; }
    .pyr-lh-head { flex-direction:column; align-items:flex-start !important; gap:6px; }
    .pyr-lien-no { white-space:nowrap; }
  }
  .pd-case-row { border-top:1px solid var(--line); padding:18px 16px; } /* note 5: no longer flush to the card edge */
  .pd-case-row:first-child { border-top:none; padding-top:4px; }
  /* Mobile pass M (9/01) + tablet follow-up: the GLOBAL 768px rule makes .btn-gold
     full-width, so the case-row must stack at the SAME breakpoint — at 481–768px a
     full-width button beside an un-stacked row crushed the case number to 41px
     (Cowork iPad finding). ONE breakpoint: ≤768 → stack. */
  @media (max-width: 768px) {
    .pd-case-head { flex-direction: column !important; align-items: stretch !important; }
    .pd-case-head .btn-gold { width: 100%; }
  }
  @media (max-width: 480px) {
    .pyr-docrow { flex-direction: column !important; align-items: flex-start !important; }
    .pyr-docrow button { width: 100%; }
    #nav-user-email { max-width: 110px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; display: inline-block; vertical-align: middle; }
    /* M8: tracker labels collide at 375px — show only the ACTIVE step's label */
    .pd-ms-lbl { display: none; }
    .pd-ms-lbl-cur { display: block; flex: none !important; width: 100%; }
  }
  .pd-ms-node { width:20px;height:20px;border-radius:0;flex-shrink:0;display:flex;align-items:center;justify-content:center; }
  .pd-ms-node.ms-done { background:var(--status-ok); }
  .pd-ms-node.ms-current { background:var(--green);animation:ms-pulse 1.8s ease-in-out infinite; }
  .pd-ms-node.ms-pending { background:transparent;border:2px solid var(--ink-4); }
  .pd-ms-node.ms-skip { background:#F7F5F0;border:1px solid #C8BFA9;position:relative;overflow:hidden; }
  .pd-ms-node.ms-skip::after { content:'';position:absolute;left:-30%;top:50%;width:160%;height:1.2px;background:#C8BFA9;transform:rotate(-45deg); }
  .pd-ms-line { flex:1;height:2px;min-width:8px; }
  .pd-ms-line.ms-done { background:var(--status-ok); }
  .pd-ms-line.ms-partial { background:var(--vault); }
  .pd-ms-line.ms-pending { background:var(--line); }

  /* Stage 6 — Empty state (payee, no cases yet) — matches design-refs "Payee · Empty" scene */
  .pd-empty-card { display:grid;grid-template-columns:1.2fr 1fr;gap:56px;align-items:center;padding:64px 56px;max-width:1100px;margin:0 auto;background:var(--paper);border:1px solid var(--line);border-radius:0; }
  .pd-empty-lhs h2 { font-family:'DM Sans',sans-serif;font-size:1.75rem;font-weight:700;letter-spacing:-0.025em;line-height:1.2;color:var(--ink);margin-bottom:16px; }
  .pd-empty-lhs p { font-size:0.94rem;line-height:1.65;color:var(--ink-2);margin-bottom:28px; }
  .pd-empty-steps { display:flex;flex-direction:column;gap:0;border-top:1px solid var(--line); }
  .pd-empty-step { display:grid;grid-template-columns:32px 1fr auto;gap:14px;padding:16px 0;border-bottom:1px solid var(--line);align-items:center; }
  .pd-empty-step:last-child { border-bottom:none; }
  .pd-empty-step-num { font-family:'DM Sans',sans-serif;font-size:1.125rem;color:var(--green);font-weight:700;letter-spacing:0.02em; }
  .pd-empty-step-body .t { font-size:0.875rem;font-weight:600;color:var(--ink); }
  .pd-empty-step-body .s { font-size:0.75rem;color:var(--ink-3);margin-top:1px; }
  .pd-empty-illus { background:var(--cream-2,#f0efeb);border:1px solid var(--line);border-radius:0;padding:32px;position:relative;min-height:320px; }
  .pd-empty-illus-label { font-size:10.5px;letter-spacing:0.16em;text-transform:uppercase;color:var(--ink-3);font-weight:600;margin-bottom:24px; }
  .pd-empty-preview-track { display:grid;grid-template-columns:repeat(6,1fr);gap:0;padding-top:16px;position:relative; }
  .pd-empty-preview-track::before { content:'';position:absolute;left:8%;right:8%;top:18px;height:2px;background:var(--line); }
  .pd-empty-stg { display:flex;flex-direction:column;align-items:center;gap:8px;position:relative;z-index:1; }
  .pd-empty-stg .n { width:16px;height:16px;border-radius:0;background:var(--paper);border:2px solid var(--line); }
  .pd-empty-stg .l { font-size:9.5px;letter-spacing:0.04em;color:var(--ink-3);font-weight:600;text-align:center;line-height:1.2; }
  .pd-empty-placeholder-rows { margin-top:32px;display:flex;flex-direction:column;gap:12px; }
  .pd-empty-placeholder-row { background:var(--paper);border:1px solid var(--line);border-radius:0;padding:14px 16px;opacity:0.55; }
  .pd-empty-placeholder-row .l1 { width:40%;height:8px;background:var(--cream-2,#f0efeb);border-radius:0;margin-bottom:6px; }
  .pd-empty-placeholder-row .l2 { width:65%;height:6px;background:var(--cream-2,#f0efeb);border-radius:0; }
  .pd-empty-stamp { position:absolute;bottom:24px;right:24px;font-size:10px;color:var(--ink-4);letter-spacing:0.12em;text-transform:uppercase;font-weight:600; }
  @media (max-width:768px) { .pd-empty-card { grid-template-columns:1fr;padding:32px 24px;gap:32px; } .pd-empty-illus { display:none; } }
  /* Stage 6 — full-bleed: empty state replaces the cases panel (de-nests from the Your Cases card) */
  /* 9/29 (Kelly, counsel pass): the counsel dashboard is one column; Recent activity runs full width. */
  #pd-two-col-layout.pd-rep-full #pd-right-col { display:none; }
  #pd-two-col-layout.pd-rep-full #pd-left-col { flex:1 1 100%; }
  #pd-two-col-layout.pd-empty-active #pd-right-col { display:none; }
  #pd-two-col-layout.pd-empty-active #pd-left-col { flex:1 1 100%; }
  #pd-two-col-layout.pd-empty-active #pd-cases-card { padding:0 !important; border:none !important; box-shadow:none !important; background:transparent !important; }
  #pd-two-col-layout.pd-empty-active #pd-cases-card .dash-card-header { display:none; }
  /* Stage 6 — empty state: suppress redundant verification prompts. For an UNVERIFIED no-case
     payee the Action Items card is the one functional prompt; the promoted banner and the amber
     "Action needed" banner just repeat it. Scoped to the empty branch — auto-reverts when the
     class is removed on has-cases / loading renders. */
  #pd-two-col-layout.pd-empty-active #pd-action-banner,
  /* VERIFIED + no cases: nothing to act on — hide the Action Items card too. */
  #pd-two-col-layout.pd-empty-active.pd-empty-verified #pd-action-card { display:none !important; }

  /* Stage 3 — navy Account Status card: pill overrides for dark background */
  #pd-acct-card .status-pill { background:rgba(255,255,255,0.10); color:rgba(255,255,255,0.65); }
  #pd-acct-card .status-pill.pill-gold { background:rgba(247,245,240,0.12); color:#C8BFA9; }
  #pd-acct-card .status-pill.pill-green { background:rgba(247,245,240,0.12); color:var(--stone); }
  #pd-acct-card .status-pill.pill-blue { background:rgba(247,245,240,0.12); color:var(--stone); }
  #pd-acct-card .status-pill.pill-red { background:rgba(247,245,240,0.12); color:var(--stone); }

  /* ═══ LienStreet marketing pages (site handoff) — homepage + pricing ═══
     Tokens only: --green ground/ink, --paper, --stone, --ink-soft; Rule #E1DED6 on
     paper; rgba(247,245,240,.18/.3/.6) rules on green; #A67F1E is the Street's seal
     ONLY. DM Sans only. One breakpoint at 760px. No animation except the Street's
     scroll motion (reduced-motion: everything filled, no transitions). */
  .ls-wrap { max-width: 1200px; margin: 0 auto; padding: 0 24px; }
  .ls-section { padding: clamp(64px, 7vw, 104px) 0; }
  .ls-eyebrow { font-size: 11px; font-weight: 500; letter-spacing: 0.14em; text-transform: uppercase; }
  .ls-h2 { font-family: 'DM Sans', sans-serif; font-size: clamp(28px, 3.2vw, 38px); line-height: 1.15; font-weight: 700; letter-spacing: -0.02em; margin: 0; }
  .ls-btn-primary-on-green { display: inline-block; background: var(--paper); color: var(--green); padding: 15px 26px; border: none; border-radius:0; font-family: 'DM Sans', sans-serif; font-size: 15px; font-weight: 600; cursor: pointer; text-decoration: none; }
  .ls-btn-secondary-on-green { display: inline-block; background: transparent; color: var(--paper); padding: 14px 26px; border: 1px solid rgba(247,245,240,0.6); border-radius:0; font-family: 'DM Sans', sans-serif; font-size: 15px; font-weight: 500; cursor: pointer; text-decoration: none; }
  .ls-btn-primary-on-paper { display: inline-block; background: var(--green); color: var(--paper); padding: 15px 26px; border: none; border-radius:0; font-family: 'DM Sans', sans-serif; font-size: 15px; font-weight: 600; cursor: pointer; text-decoration: none; }
  .ls-link { text-decoration: underline; text-underline-offset: 3px; cursor: pointer; }
  .ls-card { background: #FFFFFF; border: 1px solid var(--line); border-radius:0; padding: 28px; }
  .ls-aud-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); gap: 16px; }
  .ls-proof-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); gap: 16px; }
  .ls-sec-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(300px, 1fr)); gap: 0 48px; }
  .ls-plan-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(300px, 1fr)); gap: 16px; }
  .ls-fee-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(300px, 1fr)); gap: 32px; }
  .ls-ans-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); gap: 32px; }
  .ls-stall-grid { display: grid; grid-template-columns: 1fr 1.4fr; gap: 64px; }
  @media (max-width: 760px) { .ls-stall-grid { grid-template-columns: 1fr; gap: 24px; } .nav-mkt { display: none !important; } }
  .ls-hero-grid { grid-template-columns: minmax(0,1fr) minmax(540px,620px); }
  @media (max-width: 1080px) { .ls-hero-grid { grid-template-columns: 1fr; } .ls-hero-grid h1 { white-space: normal !important; } }
  /* Hero mockup card (rebuild 9/10): fixed columns, shared strip, equal 44px rows. */
  .ls-mock-row { display:grid; grid-template-columns:150px 90px minmax(300px,1fr); gap:12px; align-items:center; height:44px; }
  .ls-mock-row.ls-mock-head { height:auto; align-items:end; border-bottom:1px solid #C8BFA9; padding-bottom:8px; }
  .ls-mock-name { font:600 13px/1.3 'DM Sans',sans-serif; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
  .ls-mock-claim { font:400 13px/1 'DM Sans',sans-serif; white-space:nowrap; }
  /* 10/02 (public visual pass): the strip columns are 43px wide at 1440 and "Received", "Approved" and
     "Delivered" ran together at 9px / 0.06em (46 to 51px each); 8px with no tracking fits every label (max 41px). */
  .ls-mock-heads { display:grid; grid-template-columns:repeat(7,1fr); font:500 8px/1.2 'DM Sans',sans-serif; letter-spacing:0; text-transform:uppercase; color:#4B5B54; text-align:center; }
  .ls-mock-heads span { white-space:nowrap; }
  .ls-mock-stats { display:flex; align-items:center; gap:6px; border-top:1px solid #C8BFA9; padding-top:14px; font:400 12px/1.4 'DM Sans',sans-serif; color:#4B5B54; white-space:nowrap; }
  .ls-mock-stats > span { white-space:nowrap; } /* 10/02: "· item" stays together, a separator never ends a line */
  @media (max-width: 640px) {
    /* 10/02 (Kelly): names wrap to a second line instead of truncating ("Ozark Steel Ere..."). */
    .ls-mock-row { grid-template-columns:104px 66px minmax(0,1fr); gap:8px; height:auto; min-height:40px; padding:4px 0; }
    .ls-mock-name { white-space:normal; overflow:visible; text-overflow:clip; line-height:1.2; }
    .ls-mock-heads { font-size:8px; letter-spacing:0; }
  }
  /* 9/26: on a phone the seven stop labels over the strips ran together and pushed the page
     57px wider than the screen (375px check); the strips stay, the unreadable labels go. */
  @media (max-width: 480px) { .ls-mock-stats { flex-wrap:wrap; } .ls-mock-heads { visibility:hidden; overflow:hidden; } }
  /* ═══ Where your lien is (F29, design/where-your-lien-is) — README metrics verbatim.
     Tokens: #10352B #17493B #F7F5F0 #C8BFA9 #EFEADE #4B5B54 #A67F1E. No radius, no
     shadow, no icons, no red (gold carries the correction state). ═══ */
  /* 9/28 (Kelly): the account card keeps the company, the role and the bank status only. */
  #pd-verif-ring-container, #pd-w9-row { display:none !important; }
  .wyli-card { box-sizing:border-box; width:100%; max-width:720px; background:#F7F5F0; border:1px solid #C8BFA9; padding:32px 40px 28px; display:flex; flex-direction:column; gap:26px; border-radius:0; }
  .wyli-card.wyli-action { border:1px solid var(--stone); }
  .wyli-eyebrow { font:500 11px/1.3 'DM Sans',sans-serif; letter-spacing:0.14em; text-transform:uppercase; color:#4B5B54; }
  .wyli-headgrp { display:flex; flex-direction:column; gap:12px; }
  .wyli-headline { font:700 22px/1.25 'DM Sans',sans-serif; letter-spacing:-0.01em; color:#10352B; margin:0; }
  .wyli-instr { font:400 15px/1.55 'DM Sans',sans-serif; color:#4B5B54; max-width:560px; text-wrap:pretty; margin:0; }
  .wyli-action .wyli-instr { font-weight:500; color:#10352B; }
  .wyli-instr-row { display:flex; gap:12px; align-items:flex-start; }
  .wyli-instr-sq { width:9px; height:9px; background:var(--vault); flex:none; margin-top:7px; }
  .wyli-reason { background:#EFEADE; border:1px solid #C8BFA9; padding:14px 16px; font:400 14.5px/1.5 'DM Sans',sans-serif; color:#4B5B54; }
  .wyli-btn { font:500 15px/1 'DM Sans',sans-serif; padding:15px 30px; white-space:nowrap; width:max-content; align-self:flex-start; cursor:pointer; border:1px solid #10352B; background:#10352B; color:#F7F5F0; border-radius:0; transition:background 180ms ease; }
  .wyli-btn:hover { background:#17493B; }
  .wyli-btn.wyli-secondary { background:transparent; color:#10352B; }
  .wyli-btn.wyli-secondary:hover { background:#EFEADE; }
  .wyli-check { border-top:1px solid #C8BFA9; padding-top:18px; display:flex; flex-direction:column; gap:9px; }
  .wyli-check-row { display:grid; grid-template-columns:72px 1fr; font:400 13.5px/1.3 'DM Sans',sans-serif; color:#4B5B54; }
  .wyli-check-row b { font-weight:500; }
  /* ═══ ONE stop-strip renderer (F11/F29): six squares joined by a 1px stone rule.
     Completed vault, current gold, upcoming paper with stone outline. ═══ */
  .llstrip { display:grid; grid-template-columns:repeat(7,1fr); position:relative; }
  .llstrip .llstrip-rule { position:absolute; top:6px; left:7.14%; right:7.14%; height:1px; background:#C8BFA9; }
  .llstrip .llstrip-cell { display:flex; flex-direction:column; align-items:center; gap:12px; position:relative; }
  .llstrip .llstrip-sq { width:13px; height:13px; box-sizing:border-box; border:1px solid #C8BFA9; background:#F7F5F0; border-radius:0; }
  .llstrip .llstrip-sq.done { background:#10352B; border-color:#10352B; }
  .llstrip .llstrip-sq.cur { background:#A67F1E; border-color:#A67F1E; }
  /* Struck stops (9/18, Street.html): stone outline on paper with ONE stone
     diagonal, bottom-left to top-right, 1.2px. A rotated rule, not a gradient. */
  .llstrip .llstrip-sq.skip { background:#F7F5F0; border:1px solid #C8BFA9; position:relative; overflow:hidden; }
  .llstrip .llstrip-sq.skip::after { content:''; position:absolute; left:-30%; top:50%; width:160%; height:1.2px; background:#C8BFA9; transform:rotate(-45deg); }
  .llstrip .llstrip-lbl { font:400 11px/1.15 'DM Sans',sans-serif; color:#4B5B54; white-space:normal; max-width:84px; margin:0 auto; text-align:center; } /* 9/28: labels wrap instead of running together */
  .llstrip .llstrip-lbl.cur { font-weight:600; color:#10352B; }
  .llstrip .llstrip-lbl.skip, .llstrip .llstrip-lbl-s.skip { color:#6b7a72; font-weight:400; }
  .llstrip-legend { font:400 12px/1.4 'DM Sans',sans-serif; color:#6b7a72; margin-top:10px; }
  .llstrip .llstrip-lbl-s { display:none; }
  /* 9/11 seven stops: the payee card always speaks the SHORT map — seven full
     labels collide at every width the payee column allows (F29 never-collide). */
  .wyli-card .llstrip .llstrip-lbl { display:none; }
  .wyli-card .llstrip .llstrip-lbl-s { display:block; font:400 10px/1.1 'DM Sans',sans-serif; color:#4B5B54; white-space:nowrap; text-align:center; }
  .wyli-card .llstrip .llstrip-lbl-s.cur { font-weight:600; color:#10352B; }
  /* Counsel dashboard (Cowork live pass 9/17): seven full labels collide below ~900px
     in the Clients-card column — switch to the short map there, not only at 375. */
  @media (max-width:900px) {
    .rep-strip .llstrip .llstrip-lbl { display:none; }
    /* 10/02 (Kelly): the counsel strip reads the full stop name ("Lien filed"); the columns may shrink below the
       label (minmax 0) and the one visible label wraps and overflows its cell, as the payee card's does. */
    .rep-strip .llstrip { grid-template-columns:repeat(7,minmax(0,1fr)); }
    .rep-strip .llstrip .llstrip-lbl-s { display:block; font:400 10px/1.15 'DM Sans',sans-serif; color:#4B5B54; white-space:normal; max-width:84px; margin:0 auto; text-align:center; }
    .rep-strip .llstrip .llstrip-lbl-s.cur { font-weight:600; color:#10352B; }
  }
  .llstrip.llstrip-sm .llstrip-sq { width:11px; height:11px; }
  .llstrip.llstrip-sm .llstrip-rule { top:5px; }
  .llstrip.llstrip-xs .llstrip-sq { width:9px; height:9px; }
  .llstrip.llstrip-xs .llstrip-rule { top:4px; }
  .llstrip.llstrip-compact .llstrip-lbl, .llstrip.llstrip-compact .llstrip-lbl-s { display:none; }
  .llstrip.llstrip-compact .llstrip-cell { gap:0; }
  @media (max-width: 800px) {
    .wyli-card .llstrip .llstrip-lbl { display:none; }
    .wyli-card .llstrip .llstrip-lbl-s { display:block; font:400 10px/1.1 'DM Sans',sans-serif; color:#4B5B54; white-space:nowrap; text-align:center; }
    .wyli-card .llstrip .llstrip-lbl-s.cur { font-weight:600; color:#10352B; }
  }
  @media (max-width: 640px) {
    .wyli-card { padding:24px 20px 22px; gap:22px; }
    .wyli-eyebrow { font-size:10px; letter-spacing:0.12em; }
    .wyli-headgrp { gap:10px; }
    .wyli-headline { font-size:20px; }
    .wyli-instr { font-size:14px; max-width:none; }
    .wyli-instr-row { gap:10px; }
    .wyli-instr-sq { width:8px; height:8px; margin-top:6px; }
    .wyli-reason { padding:12px 14px; font-size:13.5px; }
    .wyli-btn { width:100%; padding:14px 20px; font-size:14px; }
    .wyli-check { padding-top:16px; gap:8px; }
    .wyli-check-row { grid-template-columns:60px 1fr; font-size:13px; }
    .wyli-card .llstrip .llstrip-sq { width:11px; height:11px; }
    .wyli-card .llstrip .llstrip-rule { top:5px; }
    .wyli-card .llstrip .llstrip-cell { gap:10px; }
    .wyli-card .llstrip .llstrip-lbl { display:none; }
    .wyli-card .llstrip .llstrip-lbl-s { display:block; font:400 9.5px/1.1 'DM Sans',sans-serif; color:#4B5B54; white-space:nowrap; text-align:center; }
    .wyli-card .llstrip .llstrip-lbl-s.cur { font-weight:600; color:#10352B; }
  }
  /* ═══ v2 (design_handoff_lienstreet_site_v2): reveal motion + Street swap + case-card tracker ═══ */
  @keyframes ls-rise { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: none; } }
  .ls-rise { animation: ls-rise 320ms cubic-bezier(.2,.6,.2,1) both; }
  @media (prefers-reduced-motion: reduce) { .ls-rise { animation: none; } }
  .trk-txt { display: none; }
  @media (max-width: 760px) {
    .trk, .trk-head { display: none !important; }
    .trk-txt { display: block; }
  }
  /* ═══ Marketing hover states (light pass, 9/11) — reveal or clarify only, 180ms
     ease-out. :hover states are gated to hover-capable pointers so touch never
     sticks; ALL transitions live in one motion-and-hover query, so touch and
     prefers-reduced-motion get instant state, no animation. Shared _llStopStrip
     output is untouched — class hooks only. ═══ */
  .ls-fig { position: relative; }
  .ls-fig-tip { position: absolute; display: none; z-index: 6; max-width: 240px; background: #F7F5F0; border: 1px solid #C8BFA9; color: #10352B; font: 400 12px/1.5 'DM Sans', sans-serif; padding: 9px 12px; box-shadow:none; pointer-events: none; }
  /* Street diagram (Design handoff, "How it works"). SVG shows at wide widths; below
     ~720px container it swaps to a stacked step list (the SVG is also the visually
     hidden ordered list's visual twin). Dots are omitted under reduced motion. The
     gold-block tooltip reuses .ls-fig-tip; .ls-street-note mirrors its text inline. */
  .ls-street { display: block; width: 100%; height: auto; overflow: visible; }
  .ls-street-list { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0 0 0 0); clip-path: inset(50%); white-space: nowrap; border: 0; }
  .ls-street-note { display: block; margin-top: 10px; background: #F7F5F0; border: 1px solid #C8BFA9; padding: 9px 12px; font: 400 13px/1.5 'DM Sans', sans-serif; color: #10352B; }
  @media (prefers-reduced-motion: reduce) { .ls-street-dots { display: none; } }
  @media (max-width: 760px) {
    .ls-street { display: none; }
    /* 10/02 (Kelly): the phone figure mirrors the diagram: a Releases track and a Funding track,
       each a line with square stops, the funding line bending into the releases line, then the
       shared street (Paid and lien released in gold, Filed, Report delivered). No step numbers. */
    .ls-street-list { position: static; width: auto; height: auto; margin: 0; padding: 0; overflow: visible; clip: auto; clip-path: none; white-space: normal; }
    .ls-street-lanes { display: grid; grid-template-columns: 1fr 1fr; column-gap: 14px; }
    .ls-street-track { display: flex; flex-direction: column; min-width: 0; }
    .ls-street-lanehd { margin: 0 0 8px; padding-left: 20px; font: 600 11px/1.4 'DM Sans', sans-serif; letter-spacing: .14em; text-transform: uppercase; color: #B5A483; }
    .ls-street-lane { list-style: none; margin: 0; padding: 4px 0 4px 18px; border-left: 2px solid #10352B; display: flex; flex-direction: column; gap: 10px; flex: 1; min-width: 0; }
    .ls-street-lane > li { position: relative; padding: 10px 12px; background: var(--paper); border: 1px solid var(--line); border-radius: 0; font: 500 14px/1.3 'DM Sans', sans-serif; color: #10352B; }
    .ls-street-lane > li::before { content: ""; position: absolute; left: -26px; top: 14px; width: 12px; height: 12px; background: #10352B; }
    .ls-street-lane > li.ls-street-gold { font-weight: 700; }
    .ls-street-lane > li.ls-street-gold::before { background: #A67F1E; }
    .ls-street-merge { display: block; width: 100%; height: 28px; margin: 0; }
    .ls-street-lane--shared { padding-top: 0; }
  }
  @media (hover: hover) {
    /* 1 — hero mockup rows (header row excluded: scoped to .ls-mock-rows) */
    .ls-mock-rows:has(.ls-mock-row:hover) .ls-mock-row:not(:hover) { opacity: 0.55; }
    .ls-mock-rows .ls-mock-row:hover { background: #EFEADE; }
    .ls-mock-rows .ls-mock-row:hover .llstrip-sq { transform: scale(1.15); }
    /* 3 — (two-lane figure removed 9/14; replaced by the street diagram, which is
       decorative apart from the preserved gold-block tooltip) */
    /* 4 — plan + safeguard cards and audience tiles: top rule gold, title shifts.
       !important because each card sets its border and (plan) title color via an
       INLINE shorthand, which otherwise wins over a stylesheet :hover rule. The
       dark safeguard card's title goes gold, not vault, since vault on #10352B is
       invisible (flagged to Kelly). */
    .ls-plan-grid > div:hover { border-top-color: var(--stone) !important; }
    .ls-plan-grid > div:hover > div:first-child > span:first-child { color: #10352B !important; }
    /* Full Service is the vault-green default card: keep its eyebrow stone on hover (dark-on-green would vanish) */
    .ls-plan-grid > div:first-child:hover > div:first-child > span:first-child { color: #C8BFA9 !important; }
    .ls-safe-grid > div:hover { border-top-color: var(--stone) !important; }
    .ls-safe-grid > div:hover > span:first-child { color: #10352B !important; }
  }
  @media (hover: hover) and (prefers-reduced-motion: no-preference) {
    .ls-mock-rows .ls-mock-row { transition: opacity .18s ease-out, background-color .18s ease-out; }
    .ls-mock-rows .ls-mock-row .llstrip-sq { transition: transform .18s ease-out; }
    .ls-plan-grid > div, .ls-plan-grid > div > div:first-child > span:first-child,
    .ls-safe-grid > div, .ls-safe-grid > div > span:first-child { transition: border-top-color .18s ease-out, color .18s ease-out; }
  }
/* ---------- closing package section (Design handoff 1a, 9/11) ---------- */
.ls-pkg {
  background: #F7F5F0;
  font-family: "DM Sans", sans-serif;
  padding: clamp(48px,6vw,88px) 0 clamp(48px,6vw,80px);
}
.ls-pkg__inner {
  max-width: 1200px;
  margin: 0 auto;
  padding: 0 24px;
  display: grid;
  grid-template-columns: 520px 1fr;
  gap: 80px;
  align-items: start;
}
.ls-pkg__eyebrow {
  font-size: 12px;
  font-weight: 500;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  color: #4B5B54;
}
.ls-pkg__h2 {
  margin: 20px 0 0;
  font-size: 40px;
  font-weight: 700;
  line-height: 1.14;
  letter-spacing: -0.02em;
  color: #10352B;
  text-wrap: pretty;
}
.ls-pkg__body {
  margin: 22px 0 0;
  max-width: 480px;
  font-size: 16px;
  font-weight: 400;
  line-height: 1.68;
  color: #4B5B54;
  text-wrap: pretty;
}
.ls-pkg__rows { margin-top: 44px; }
.ls-pkg__row {
  border-top: 1px solid #C8BFA9;
  padding: 20px 0 18px;
  display: grid;
  grid-template-columns: 64px 1fr;
  gap: 16px;
}
.ls-pkg__row:last-child { border-bottom: 1px solid #C8BFA9; }
.ls-pkg__num {
  font-size: 12px;
  font-weight: 500;
  letter-spacing: 0.12em;
  color: #A67F1E;
}
.ls-pkg__rowTitle {
  font-size: 15px;
  font-weight: 500;
  line-height: 1.4;
  color: #10352B;
}
.ls-pkg__rowBody {
  margin-top: 6px;
  font-size: 14px;
  font-weight: 400;
  line-height: 1.6;
  color: #4B5B54;
  text-wrap: pretty;
}
/* the document stack: each sheet is a fixed overflow:hidden window onto the top
   of the full-page render, stopping above the page footer. Do not change the
   heights without recomputing (crop math per Design):
     report-p1 height = width * 0.9641 (top 1180/1584)
     record-p1 height = width * 0.8578 (top 1050/1584)
     report-p6-closing height = width * 0.4902 (top 600/1584) */
.ls-stack { position: relative; height: 700px; }
.ls-sheet {
  position: absolute;
  overflow: hidden;
  background: #F7F5F0;
}
.ls-sheet picture { display: block; }
.ls-sheet img { display: block; width: 100%; height: auto; }
.ls-sheet--record {
  left: 240px; top: 0;
  width: 320px; height: 275px;
  transform: rotate(4deg);
  transform-origin: 50% 100%;
  box-shadow:none;
}
.ls-sheet--closing {
  left: 170px; top: 412px;
  width: 380px; height: 186px;
  transform: rotate(2.5deg);
  transform-origin: 0% 0%;
  box-shadow:none;
}
.ls-sheet--cover {
  left: 0; top: 56px;
  width: 440px; height: 425px;
  transform: rotate(-1.5deg);
  transform-origin: 50% 50%;
  box-shadow:none;
}
.ls-callout__stem {
  position: absolute;
  left: 451px; top: 582px;
  width: 1px; height: 44px;
  background: #C8BFA9;
}
.ls-callout__rule {
  position: absolute;
  left: 232px; top: 626px;
  width: 220px; height: 1px;
  background: #C8BFA9;
}
.ls-callout__label {
  position: absolute;
  left: 232px; top: 636px;
  font-size: 12px;
  font-weight: 500;
  letter-spacing: 0.02em;
  color: #4B5B54;
  white-space: nowrap;
}
@media (max-width: 900px) {
  .ls-pkg__inner {
    display: block;
    padding: 0 24px;
  }
  .ls-pkg__eyebrow { font-size: 11px; }
  .ls-pkg__h2 { margin-top: 14px; font-size: 28px; line-height: 1.18; }
  .ls-pkg__body { margin-top: 16px; font-size: 15px; line-height: 1.65; max-width: none; }
  .ls-pkg__stackWrap { order: 0; }
  .ls-stack { height: 452px; margin: 36px 0 0; }
  .ls-sheet--record  { left: 137px; top: 0;     width: 190px; height: 163px; box-shadow: none; }
  .ls-sheet--closing { left: 57px;  top: 252px; width: 270px; height: 132px; box-shadow: none; }
  .ls-sheet--cover   { left: 0;     top: 38px;  width: 258px; height: 249px; box-shadow: none; }
  .ls-callout__stem  { left: 257px; top: 372px; height: 32px; }
  .ls-callout__rule  { left: 118px; top: 404px; width: 140px; }
  .ls-callout__label { left: 118px; top: 414px; font-size: 11px; }
  .ls-pkg__rows { margin-top: 8px; }
  .ls-pkg__row {
    display: block;
    padding: 18px 0 16px;
  }
  .ls-pkg__num { font-size: 11px; }
  .ls-pkg__rowTitle { margin-top: 10px; }
}