:root {
      --bg: #F7F9FC;
      --paper: #FFFFFF;
      --ink: #0D1B2A;
      --muted: #5C6E82;
      --line: #E2E8F0;
      --soft: #EEF4FF;
      --brand: #2563EB;
      --brand-dark: #1E3A8A;
      --secondary: #F59E0B;
      --tertiary: #EFF6FF;
      --tertiary-line: #BFDBFE;
      --alert: #92400E;
      --danger: #991B1B;
      --shadow: 0 1px 3px rgba(0,0,0,.04), 0 8px 28px rgba(13,27,42,.07);
      --radius: 5px;
      --flow-panel-start: 9vh;
    }

    * { box-sizing: border-box; }

    body {
      margin: 0;
      color: var(--ink);
      background: var(--bg);
      font: 15px/1.55 Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
      -webkit-font-smoothing: antialiased;
    }

    button, input { font: inherit; }

    .app {
      min-height: 100vh;
      display: block;
    }

    .app.home-view {
      display: block;
    }

    .app > aside,
    .mobile-tabs,
    .app.home-view > aside,
    .app.home-view .mobile-tabs {
      display: none !important;
    }

    .app.home-view .content {
      max-width: none;
      padding: 0;
    }

    .app > aside {
      position: sticky;
      top: 0;
      height: 100vh;
      border-right: 1px solid var(--line);
      background: rgba(255, 255, 255, .88);
      backdrop-filter: blur(18px);
      padding: 24px 18px;
    }

    .brand {
      display: flex;
      align-items: center;
      gap: 12px;
      margin-bottom: 28px;
      font-weight: 700;
      font-size: 16px;
      letter-spacing: -.01em;
    }

    .logo {
      width: 44px;
      height: 44px;
      border-radius: 50%;
      color: white;
      background:
        radial-gradient(circle at 34% 28%, rgba(255, 255, 255, .40), transparent 24%),
        conic-gradient(from 215deg, #FBBF24, #93C5FD, var(--brand), #1E3A8A, #FBBF24);
      display: grid;
      place-items: center;
      box-shadow: 0 8px 20px rgba(37, 99, 235, .22);
      flex: 0 0 auto;
    }

    .logo-core {
      width: 32px;
      height: 32px;
      border-radius: 50%;
      display: grid;
      place-items: center;
      background: linear-gradient(135deg, #006aff, #0a3d91);
      box-shadow: inset 0 1px 0 rgba(255, 255, 255, .25);
    }

    .logo svg {
      width: 22px;
      height: 22px;
      stroke: white;
      fill: none;
      stroke-width: 2;
      stroke-linecap: round;
      stroke-linejoin: round;
    }

    .tagline {
      color: var(--muted);
      font-size: 12px;
      font-weight: 600;
    }

    .step-nav {
      display: grid;
      gap: 8px;
    }

    .step-nav button {
      border: 1px solid transparent;
      background: transparent;
      color: #3f4d49;
      border-radius: var(--radius);
      padding: 12px;
      text-align: left;
      cursor: pointer;
      display: grid;
      grid-template-columns: 30px minmax(0, 1fr);
      gap: 10px;
      align-items: center;
    }

    .step-nav button.active {
      background: #eef5ff;
      border-color: #cfe0ff;
      color: var(--brand-dark);
      font-weight: 800;
    }

    .step-num {
      width: 30px;
      height: 30px;
      border-radius: 50%;
      display: grid;
      place-items: center;
      background: #eef3f1;
      color: var(--muted);
      font-weight: 900;
      font-size: 12px;
    }

    .active .step-num {
      color: white;
      background: var(--brand);
    }

    .trust-box {
      margin-top: 28px;
      padding: 14px;
      border: 1px solid var(--line);
      border-radius: var(--radius);
      background: #ffffff;
    }

    main { min-width: 0; }

    .content {
      padding: 34px 30px 52px;
      max-width: 1380px;
      margin: 0 auto;
    }

    .screen { display: none; }
    .screen.active { display: block; }

    .app:has(#plan.active),
    .app:has(#account.active),
    .app:has(#property.active) {
      background: var(--bg);
    }

    .app:has(#plan.active) .content,
    .app:has(#account.active) .content,
    .app:has(#property.active) .content {
      max-width: none;
      min-height: 100vh;
      background: var(--bg);
    }

    #plan.active,
    #account.active,
    #property.active {
      min-height: calc(100vh - 86px);
    }

    .app.scan-view {
      display: block;
      background: var(--bg);
    }

    .app.scan-view > aside,
    .app.scan-view .mobile-tabs {
      display: none;
    }

    .app.scan-view .content {
      max-width: none;
      padding: 0;
    }

    .scan-screen {
      min-height: 100vh;
      display: none;
      justify-items: center;
      align-items: start;
      padding: 0 28px 28px;
      background: #ffffff !important;
    }

    .scan-screen.active {
      display: grid;
    }

    .scan-card {
      width: min(760px, 100%);
      margin-top: var(--flow-panel-start);
      border: 1px solid var(--line);
      border-radius: 8px;
      background: #ffffff;
      box-shadow: 0 18px 50px rgba(83, 116, 125, .10);
      padding: 30px 30px 34px;
      text-align: center;
    }

    .scan-card h1 {
      color: var(--ink);
      font-weight: 400;
      letter-spacing: -.01em;
    }

    .scan-card .eyebrow {
      color: var(--brand-dark) !important;
      background: var(--soft) !important;
      border-color: #C7D7F8 !important;
      font-weight: 600;
    }

    .ai-spinner {
      width: 44px;
      height: 44px;
      margin: 0;
      border-radius: 50%;
      display: grid;
      place-items: center;
      color: white;
      background:
        conic-gradient(from 0deg, #93C5FD, #E0E7FF, #FDE68A, #93C5FD);
      animation: spin 1.8s linear infinite;
      box-shadow: 0 8px 20px rgba(37, 99, 235, .18);
      flex: 0 0 auto;
    }

    .ai-spinner-icon {
      width: 32px;
      height: 32px;
      border-radius: 50%;
      display: grid;
      place-items: center;
      background: var(--brand);
    }

    .ai-spinner-icon svg {
      width: 21px;
      height: 21px;
      stroke: white;
      fill: none;
      stroke-width: 2;
      stroke-linecap: round;
      stroke-linejoin: round;
    }

    .scan-work {
      display: grid;
      grid-template-columns: 44px minmax(0, 1fr);
      gap: 14px;
      align-items: center;
      margin-top: 20px;
      text-align: left;
    }

    .scan-work-main {
      min-width: 0;
    }

    .scan-status {
      min-height: 24px;
      color: var(--muted);
      font-weight: 400;
      margin: 0 0 8px;
    }

    .scan-progress {
      height: 12px;
      border-radius: 999px;
      background: #e9eef7;
      overflow: hidden;
      border: 1px solid #d5e0f2;
    }

    .scan-progress span {
      display: block;
      height: 100%;
      width: 0;
      border-radius: inherit;
      background: var(--brand);
    }

    .scan-progress span.running {
      animation: fillScan 7s linear forwards;
    }

    .scan-progress span.reset {
      animation: none;
    }

    .scan-category-live {
      min-height: 28px;
      margin: 10px 0 0 58px;
      color: var(--ink);
      font-size: 16px;
      font-weight: 500;
      letter-spacing: -.01em;
      transition: opacity .3s ease, transform .3s ease;
    }

    .scan-category-live.fading {
      opacity: 0;
      transform: translateY(6px);
    }

    @keyframes spin {
      to { transform: rotate(360deg); }
    }

    @keyframes fillScan {
      to { width: 100%; }
    }

    @keyframes keyPulse {
      0%   { transform: scale(1);    box-shadow: 0 0 0 0 rgba(37,99,235,.4); }
      50%  { transform: scale(.97);  box-shadow: 0 0 0 6px rgba(37,99,235,.0); }
      100% { transform: scale(1);    box-shadow: 0 0 0 0 rgba(37,99,235,0); }
    }
    .key-pulse { animation: keyPulse .28s ease forwards; }

    .hero {
      display: grid;
      grid-template-columns: minmax(0, 1.1fr) minmax(320px, .9fr);
      gap: 24px;
      align-items: stretch;
    }

    .app.home-view .hero {
      min-height: 700px;
      height: 700px;
      grid-template-columns: minmax(420px, .78fr) minmax(560px, 1.22fr);
      gap: 22px;
      padding: 44px 44px 36px;
      overflow: hidden;
      align-items: start;
      position: relative;
      background:
        radial-gradient(circle at 72% 20%, rgba(255, 255, 255, .18), transparent 34%),
        linear-gradient(105deg, rgba(10, 20, 46, .94), rgba(10, 20, 46, .74)),
        url("https://images.unsplash.com/photo-1560518883-ce09059eeffa?auto=format&fit=crop&w=1800&q=85") center/cover;
    }

    .hero-panel {
      min-height: 560px;
      border-radius: var(--radius);
      overflow: hidden;
      color: white;
      background:
        linear-gradient(105deg, rgba(10, 20, 46, .95), rgba(10, 20, 46, .78)),
        url("https://images.unsplash.com/photo-1560518883-ce09059eeffa?auto=format&fit=crop&w=1600&q=85") center/cover;
      box-shadow: var(--shadow);
      padding: 42px;
      display: flex;
      flex-direction: column;
      justify-content: space-between;
    }

    .app.home-view .hero-panel {
      min-height: auto;
      border-radius: 0;
      background: transparent;
      box-shadow: none;
      padding: 0;
      justify-content: start;
      gap: 14px;
    }

    .app.home-view .hero-panel h1 {
      max-width: 760px;
      font-size: clamp(42px, 4.2vw, 60px);
      margin-bottom: 12px;
    }

    .hero-side {
      display: grid;
      gap: 0;
      align-content: start;
      justify-items: end;
      min-width: 0;
      position: relative;
      padding-top: 0;
      padding-bottom: 96px;
    }

    .hero-product-shot {
      width: min(92%, 860px);
      height: 500px;
      max-width: none;
      object-fit: cover;
      object-position: top center;
      display: block;
      border-radius: 14px;
      border: 1px solid rgba(255, 255, 255, .46);
      box-shadow: 0 34px 90px rgba(0, 0, 0, .30);
      background: rgba(255, 255, 255, .86);
      mix-blend-mode: normal;
      opacity: .96;
    }

    .landing-proof-section {
      background: #ffffff;
      padding: 56px 44px 72px;
    }

    .landing-proof-inner {
      width: 100%;
      max-width: none;
      margin: 0 auto;
    }

    .landing-proof-heading {
      display: flex;
      justify-content: space-between;
      align-items: flex-end;
      gap: 24px;
      margin-bottom: 24px;
    }

    .landing-proof-heading h2 {
      max-width: 680px;
      color: var(--ink);
      font-size: 30px;
      font-weight: 700;
      margin-bottom: 0;
      letter-spacing: -.025em;
    }

    .landing-proof-heading p {
      max-width: 470px;
      color: var(--muted);
      margin-bottom: 0;
    }

    .review-grid {
      display: grid;
      grid-template-columns: repeat(3, minmax(0, 1fr));
      gap: 16px;
      align-items: stretch;
      width: 100%;
    }

    .review-card {
      border: 1px solid var(--line);
      border-radius: 8px;
      background: #ffffff;
      box-shadow: 0 16px 42px rgba(83, 116, 125, .08);
      padding: 20px;
      display: flex;
      flex-direction: column;
    }

    .stars {
      color: #D97706;
      letter-spacing: .04em;
      font-size: 13px;
      margin-bottom: 12px;
    }

    .review-card p {
      color: var(--ink);
      font-size: 14px;
      line-height: 1.62;
      margin-bottom: 16px;
      flex: 1;
    }

    .review-card strong {
      display: block;
      color: var(--ink);
      font-weight: 600;
    }

    .review-card span {
      color: #7a8b88;
      font-size: 13px;
    }

    .trust-strip {
      display: grid;
      grid-template-columns: repeat(4, minmax(0, 1fr));
      gap: 12px;
      margin-top: 18px;
      align-items: stretch;
      width: 100%;
    }

    .trust-pill {
      border: 1px solid var(--line);
      border-radius: var(--radius);
      background: var(--paper);
      padding: 16px;
      color: var(--ink);
      font-weight: 500;
      text-align: center;
      min-height: 74px;
    }

    .proof-stat {
      text-align: left;
    }

    .proof-stat strong {
      display: block;
      color: var(--ink);
      font-size: 20px;
      line-height: 1.15;
      margin-bottom: 4px;
    }

    .proof-stat span {
      display: block;
      color: var(--muted);
      font-size: 13px;
      font-weight: 600;
    }

    .proof-stat.proof-quote {
      color: #405451;
      font-weight: 600;
      line-height: 1.4;
    }

    .app.home-view .form-card {
      align-self: stretch;
      min-height: auto;
      box-shadow: var(--shadow);
      max-width: 500px;
      background: rgba(255, 255, 255, .94);
      backdrop-filter: blur(14px);
      padding: 18px;
      gap: 10px;
      color: var(--ink);
    }

    .app.home-view .form-card h2 {
      color: var(--ink);
      font-size: 23px;
      margin-bottom: 8px;
    }

    .app.home-view .form-card p {
      color: var(--muted);
      margin-bottom: 0;
    }

    .app.home-view .form-card p strong {
      color: var(--ink);
    }

    .hero-center-cta {
      position: absolute;
      left: 50%;
      bottom: 30px;
      transform: translateX(-50%);
      width: fit-content;
      z-index: 2;
    }

    .hero-center-cta .btn {
      min-height: 52px;
      min-width: 280px;
      border-radius: 4px;
      font-size: 15px;
      font-weight: 700;
      letter-spacing: .01em;
      box-shadow: 0 4px 20px rgba(37, 99, 235, .40);
    }

    .zip-context {
      display: inline-flex;
      align-items: center;
      gap: 8px;
      width: fit-content;
      border: 1px solid #cfe0ff;
      border-radius: 999px;
      background: #eef5ff;
      color: #32504a;
      padding: 7px 11px;
      font-size: 13px;
      font-weight: 700;
      margin-top: 8px;
    }

    .zip-context strong {
      color: var(--brand-dark);
    }

    .hero-panel p { color: rgba(255, 255, 255, .82); }

    .eyebrow {
      display: inline-flex;
      width: fit-content;
      border-radius: 4px;
      padding: 5px 10px;
      color: rgba(255,255,255,.85);
      background: rgba(255, 255, 255, .10);
      border: 1px solid rgba(255, 255, 255, .15);
      font-size: 11px;
      font-weight: 700;
      text-transform: uppercase;
      letter-spacing: .10em;
    }

    h1, h2, h3, p { margin-top: 0; }
    h1 {
      max-width: 760px;
      font-size: clamp(36px, 4.8vw, 62px);
      line-height: 1.03;
      margin: 14px 0 18px;
      letter-spacing: -.03em;
      font-weight: 700;
    }

    h2 { font-size: 28px; line-height: 1.12; margin-bottom: 12px; font-weight: 700; letter-spacing: -.02em; }
    h3 { font-size: 15px; margin-bottom: 6px; font-weight: 600; letter-spacing: -.01em; }
    p { color: var(--muted); }

    .lead {
      max-width: 640px;
      font-size: 18px;
    }

    .card {
      border: 1px solid var(--line);
      border-radius: var(--radius);
      background: var(--paper);
      box-shadow: 0 12px 34px rgba(23, 33, 31, .06);
      padding: 22px;
      min-width: 0;
    }

    .form-card {
      display: flex;
      flex-direction: column;
      justify-content: center;
      gap: 16px;
    }

    .flow-card {
      border-color: var(--line);
      background: var(--paper);
      box-shadow: var(--shadow);
      padding: 32px;
    }

    #plan .flow-card,
    #account .flow-card,
    #property .flow-card {
      background: var(--paper);
      border-color: var(--line);
      box-shadow: var(--shadow);
    }

    .flow-card h1 {
      font-size: 32px;
      line-height: 1.08;
      margin-bottom: 18px;
      color: var(--ink);
      font-weight: 700;
      letter-spacing: -.02em;
    }

    .flow-card label {
      color: var(--ink);
      letter-spacing: .01em;
    }

    .flow-card input {
      border-color: var(--line);
      border-radius: 6px;
      background: var(--paper);
      min-height: 50px;
      box-shadow: inset 0 1px 0 rgba(0,0,0,.02);
    }

    .flow-card input:focus {
      border-color: #8bbcff;
      box-shadow: 0 0 0 4px rgba(0, 106, 255, .10);
    }

    label {
      display: block;
      color: var(--ink);
      font-size: 12px;
      font-weight: 600;
      letter-spacing: .02em;
      text-transform: uppercase;
      margin-bottom: 7px;
    }

    input {
      width: 100%;
      border: 1px solid var(--line);
      border-radius: var(--radius);
      background: white;
      color: var(--ink);
      padding: 13px 14px;
      outline: 0;
    }

    input:focus {
      border-color: var(--brand);
      box-shadow: 0 0 0 4px rgba(0, 106, 255, .12);
    }

    .btn {
      border: 1px solid var(--line);
      border-radius: var(--radius);
      background: var(--paper);
      color: var(--ink);
      padding: 11px 16px;
      cursor: pointer;
      display: inline-flex;
      align-items: center;
      justify-content: center;
      gap: 8px;
      font-weight: 600;
      font-size: 14px;
      letter-spacing: -.01em;
      text-decoration: none;
      transition: background .12s ease, box-shadow .12s ease;
    }

    .btn:hover {
      background: #F1F5F9;
    }

    .btn.primary {
      border-color: var(--brand);
      background: var(--brand);
      color: white;
      box-shadow: 0 4px 14px rgba(37, 99, 235, .28);
    }

    .btn.primary:hover {
      background: #1D4ED8;
      box-shadow: 0 6px 18px rgba(37, 99, 235, .34);
    }

    .btn.block { width: 100%; }

    .actions {
      display: flex;
      align-items: center;
      gap: 10px;
      flex-wrap: wrap;
      justify-content: flex-end;
    }

    .tools-dropdown {
      position: relative;
      display: inline-block;
    }

    .tools-dropdown summary {
      list-style: none;
    }

    .tools-dropdown summary::-webkit-details-marker {
      display: none;
    }

    .tools-menu {
      position: absolute;
      top: calc(100% + 8px);
      right: 0;
      width: 250px;
      border: 1px solid var(--line);
      border-radius: 8px;
      background: #ffffff;
      box-shadow: 0 18px 46px rgba(23, 33, 31, .15);
      padding: 6px;
      z-index: 12;
    }

    .tools-menu .btn {
      width: 100%;
      justify-content: flex-start;
      border-color: transparent;
      box-shadow: none;
      padding: 10px 11px;
      border-radius: 7px;
      font-size: 13px;
    }

    .tools-menu .btn:hover {
      background: #f3f8f7;
    }

    .checks {
      display: grid;
      gap: 12px;
      margin: 22px 0 0;
      padding: 0;
      list-style: none;
    }

    .checks li {
      display: flex;
      align-items: center;
      gap: 10px;
      color: var(--ink);
      font-weight: 700;
    }

    .hero-panel .checks li {
      color: #ffffff;
      text-shadow: 0 1px 16px rgba(0, 0, 0, .28);
    }

    .app.home-view .hero-panel .checks {
      gap: 8px;
      margin-top: 12px;
    }

    .app.home-view .hero-panel .checks li {
      font-size: 14px;
      line-height: 1.2;
    }

    .app.home-view .hero-panel .check {
      width: 20px;
      height: 20px;
      font-size: 12px;
    }

    .check {
      width: 20px;
      height: 20px;
      border-radius: 50%;
      display: grid;
      place-items: center;
      color: white;
      background: var(--brand);
      font-size: 12px;
      font-weight: 800;
      flex: 0 0 auto;
    }

    .grid {
      display: grid;
      gap: 18px;
    }

    .cols-2 { grid-template-columns: minmax(0, 1fr) minmax(320px, .72fr); }
    .cols-plan { grid-template-columns: minmax(360px, .72fr) minmax(0, 1fr); }
    .cols-3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }

    .summary-row {
      display: grid;
      grid-template-columns: repeat(4, minmax(0, 1fr));
      gap: 14px;
      margin-bottom: 18px;
    }

    .metric {
      border: 1px solid var(--line);
      border-radius: var(--radius);
      background: var(--paper);
      padding: 18px;
    }

    .metric strong {
      display: block;
      font-size: 26px;
      line-height: 1;
      margin-top: 6px;
      font-weight: 700;
      letter-spacing: -.02em;
      color: var(--ink);
    }

    .category-list,
    .doc-list,
    .address-list {
      border: 1px solid var(--line);
      border-radius: var(--radius);
      overflow: hidden;
      background: white;
    }

    .row {
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 12px;
      padding: 14px 16px;
      border-bottom: 1px solid var(--line);
    }

    .row:last-child { border-bottom: 0; }

    .row strong { color: var(--ink); }

    .category-row {
      display: grid;
      grid-template-columns: 42px minmax(0, 1fr) 38px 18px;
      align-items: center;
      gap: 12px;
      padding: 11px 12px;
      border-bottom: 1px solid var(--line);
    }

    .category-row:last-child { border-bottom: 0; }

    .thumb {
      width: 34px;
      height: 34px;
      border-radius: 8px;
      display: grid;
      place-items: center;
      font-weight: 900;
      font-size: 12px;
    }

    .count {
      min-width: 34px;
      border-radius: 999px;
      background: #eef5ff;
      color: var(--brand-dark);
      padding: 4px 9px;
      text-align: center;
      font-weight: 900;
    }

    .address-option {
      cursor: pointer;
      background: #ffffff;
      transition: background .15s ease, outline-color .15s ease;
    }

    .flow-card .address-list {
      border-color: #d5e2df;
      border-radius: 9px;
      box-shadow: inset 0 1px 0 rgba(23, 33, 31, .03);
    }

    .flow-card .address-option {
      padding: 13px 15px;
    }

    .address-option.selected {
      background: #eef5ff;
      outline: 2px solid #cfe0ff;
      outline-offset: -2px;
    }

    .flow-card .address-option.selected {
      background: #edf5ff;
      outline-color: #b9d4ff;
    }

    .progress-wrap {
      margin: 18px 0;
    }

    .progress-label {
      display: flex;
      justify-content: space-between;
      color: var(--ink);
      font-weight: 800;
      margin-bottom: 8px;
    }

    .progress {
      height: 14px;
      border-radius: 999px;
      background: #e9eef7;
      overflow: hidden;
      border: 1px solid #d5e0f2;
    }

    .progress span {
      display: block;
      height: 100%;
      width: 0%;
      background: linear-gradient(90deg, var(--brand), #60A5FA);
      border-radius: inherit;
    }

    .section-title {
      margin: 24px 0 10px;
      color: var(--muted);
      font-size: 11px;
      font-weight: 700;
      letter-spacing: .10em;
      text-transform: uppercase;
    }

    .doc-item {
      display: flex;
      align-items: center;
      gap: 10px;
      padding: 11px 0;
      border-bottom: 1px solid var(--line);
    }

    .doc-item:last-child { border-bottom: 0; }

    .box {
      width: 20px;
      height: 20px;
      border: 2px solid #b9c6c1;
      border-radius: 5px;
      flex: 0 0 auto;
      background: white;
    }

    .risk {
      display: inline-flex;
      align-items: center;
      border-radius: 999px;
      padding: 5px 10px;
      color: #8a6700;
      background: #fff6cc;
      font-weight: 900;
      font-size: 12px;
    }

    .risk-panel {
      border-color: var(--secondary);
      background:
        linear-gradient(180deg, #fff9d8, #ffffff);
    }

    .doc-preview {
      display: grid;
      grid-template-columns: minmax(0, 1.1fr) minmax(260px, .9fr);
      gap: 16px;
      align-items: stretch;
    }

    .pdf {
      overflow: hidden;
      border: 1px solid #cfd8d4;
      border-radius: var(--radius);
      background: white;
      box-shadow: 0 14px 30px rgba(23, 33, 31, .08);
    }

    .pdfbar {
      height: 36px;
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 10px;
      padding: 0 14px;
      color: rgba(255,255,255,.92);
      background: #1A2640;
      font-size: 12px;
      font-weight: 500;
      letter-spacing: .01em;
    }

    .paper {
      min-height: 430px;
      padding: 28px 32px;
      background:
        repeating-linear-gradient(180deg, #fff 0, #fff 34px, #f8faf9 35px);
    }

    .paper h3 {
      margin: 0 0 6px;
      font-size: 15px;
      text-transform: uppercase;
    }

    .paper h4 {
      margin: 20px 0 8px;
      font-size: 12px;
      text-transform: uppercase;
    }

    .paper-line {
      height: 1px;
      background: #26332f;
      margin: 10px 0 12px;
      opacity: .76;
    }

    .doc-check {
      margin: 10px 0;
      font-size: 12px;
      color: #283531;
    }

    .why-panel {
      border: 1px solid var(--secondary);
      border-radius: var(--radius);
      background: #fff9d8;
      padding: 16px;
      height: 100%;
      display: flex;
      flex-direction: column;
    }

    .why-panel .section-title {
      margin: 18px 0 8px;
    }

    .tag-row {
      display: flex;
      flex-wrap: wrap;
      gap: 8px;
      margin-bottom: 14px;
    }

    .tag-row .chip {
      display: inline-flex;
      align-items: center;
      min-height: 30px;
      border-color: #d7e4df;
      background: #ffffff;
      color: #36504a;
      padding: 6px 10px;
      font-size: 11px;
      line-height: 1.15;
      font-weight: 800;
      box-shadow: 0 1px 0 rgba(23, 33, 31, .04);
    }

    .tag-row .chip::before {
      content: "";
      width: 6px;
      height: 6px;
      border-radius: 50%;
      margin-right: 7px;
      background: var(--brand);
      flex: 0 0 auto;
    }

    .why-panel .btn {
      margin-top: auto;
    }

    .reason {
      display: grid;
      grid-template-columns: 28px minmax(0, 1fr);
      gap: 10px;
      margin: 14px 0;
      font-size: 13px;
    }

    .reason-mark {
      width: 28px;
      height: 28px;
      border-radius: 50%;
      display: grid;
      place-items: center;
      color: #6c5200;
      background: var(--secondary);
      font-weight: 900;
    }

    .chat {
      margin-top: 18px;
      border: 1px solid var(--line);
      border-radius: var(--radius);
      overflow: hidden;
      background: white;
    }

    .chat-head {
      display: flex;
      justify-content: space-between;
      gap: 12px;
      padding: 16px 18px;
      border-bottom: 1px solid var(--line);
      background: var(--tertiary);
    }

    .chat-body {
      display: grid;
      grid-template-columns: minmax(0, 1fr) 290px;
      gap: 16px;
      padding: 18px;
    }

    .messages {
      border: 1px solid var(--line);
      border-radius: var(--radius);
      background: #ffffff;
      padding: 14px;
    }

    .msg {
      max-width: 78%;
      border-radius: 14px;
      padding: 12px 14px;
      margin-bottom: 12px;
      font-size: 14px;
    }

    .msg.ai {
      border-top-left-radius: 4px;
      background: var(--tertiary);
    }

    .msg.user {
      margin-left: auto;
      border-top-right-radius: 4px;
      color: white;
      background: var(--brand-dark);
    }

    .quick {
      display: flex;
      flex-wrap: wrap;
      gap: 8px;
      margin-top: 14px;
    }

    .chip {
      border: 1px solid var(--line);
      border-radius: 999px;
      background: white;
      padding: 8px 10px;
      color: #34433f;
      font-size: 12px;
      font-weight: 700;
      cursor: pointer;
    }

    .ask {
      display: grid;
      grid-template-columns: minmax(0, 1fr) 74px;
      gap: 8px;
      margin-top: 12px;
    }

    .ask input {
      min-width: 0;
    }

    .ask button {
      border: 0;
      border-radius: var(--radius);
      color: white;
      background: var(--brand-dark);
      font-weight: 800;
    }

    .context {
      border: 1px solid var(--line);
      border-radius: var(--radius);
      padding: 14px;
    }

    .context-item {
      padding: 11px 0;
      border-bottom: 1px solid var(--line);
      font-size: 13px;
    }

    .context-item:last-child { border-bottom: 0; }

    .context-item b { display: block; margin-bottom: 4px; }

    .workspace-shell {
      display: grid;
      grid-template-columns: 300px minmax(0, 1fr);
      gap: 18px;
      align-items: start;
    }

    .workspace-shell.has-category-top {
      grid-template-columns: 300px minmax(0, 1fr);
    }

    .workspace-shell.edl-three-column {
      grid-template-columns: 300px minmax(320px, 360px);
      gap: 14px;
      align-items: start;
      justify-content: start;
      padding-bottom: 560px;
    }

    .workspace-panel {
      border: 1px solid var(--line);
      border-radius: var(--radius);
      background: white;
      box-shadow: 0 12px 34px rgba(23, 33, 31, .06);
      min-width: 0;
    }

    .panel-head {
      padding: 16px;
      border-bottom: 1px solid var(--line);
      background: #ffffff;
    }

    .panel-body { padding: 12px; }

    .chat-panel-head {
      display: flex;
      align-items: flex-start;
      justify-content: space-between;
      gap: 10px;
    }

    .chat-title-row {
      display: flex;
      align-items: center;
      gap: 10px;
      min-width: 0;
    }

    .chat-launch-icon {
      width: 32px;
      height: 32px;
      display: grid;
      place-items: center;
      color: var(--brand);
      background: transparent;
      box-shadow: none;
      flex: 0 0 auto;
    }

    .chat-launch-icon span {
      width: 24px;
      height: 24px;
      display: grid;
      place-items: center;
      background: transparent;
    }

    .chat-launch-icon svg {
      width: 16px;
      height: 16px;
      stroke: var(--brand);
      fill: none;
      stroke-width: 2;
      stroke-linecap: round;
      stroke-linejoin: round;
    }

    .chat-panel-head h3,
    .chat-panel-head p {
      margin-bottom: 0;
    }

    .chat-toggle {
      border: 1px solid #cfe0ff;
      border-radius: 999px;
      background: #eef5ff;
      color: var(--brand-dark);
      padding: 5px 9px;
      font-size: 11px;
      font-weight: 800;
      cursor: pointer;
      white-space: nowrap;
    }

    .chat-icon-toggle {
      width: 32px;
      height: 32px;
      border: 1px solid #cfe0ff;
      border-radius: 8px;
      background: #ffffff;
      color: var(--brand);
      display: grid;
      place-items: center;
      cursor: pointer;
      flex: 0 0 auto;
    }

    .chat-icon-toggle svg {
      width: 17px;
      height: 17px;
      stroke: currentColor;
      fill: none;
      stroke-width: 2.2;
      stroke-linecap: round;
      stroke-linejoin: round;
    }

    .chat-icon-toggle .icon-expand {
      display: none;
    }

    .inline-chat.minimized .chat-icon-toggle .icon-minimize {
      display: none;
    }

    .inline-chat.minimized .chat-icon-toggle .icon-expand {
      display: block;
    }

    .category-top {
      display: grid;
      grid-template-columns: repeat(6, minmax(170px, 1fr));
      gap: 10px;
      margin-bottom: 18px;
      overflow-x: auto;
      padding-bottom: 4px;
    }

    .category-tile {
      min-height: 104px;
      border: 1px solid var(--line);
      border-radius: var(--radius);
      background: white;
      padding: 13px;
      display: flex;
      flex-direction: column;
      justify-content: space-between;
      gap: 8px;
      cursor: pointer;
    }

    .category-tile.active {
      border-color: #cfe0ff;
      background: #eef5ff;
    }

    .category-tile-top {
      display: flex;
      justify-content: space-between;
      gap: 10px;
      color: var(--ink);
      font-weight: 900;
    }

    .category-tile p {
      margin: 0;
      font-size: 12px;
    }

    /* Categories screen — pinned footer */
    #categories.active {
      flex-direction: column;
      height: 100%;
      overflow: hidden;
      padding: 0 70px;
    }
    .categories-scroll-area {
      flex: 1;
      min-height: 0;
      overflow-y: auto;
      padding-bottom: 12px;
    }
    .categories-footer {
      flex-shrink: 0;
      display: flex;
      justify-content: flex-end;
      padding: 14px 0 22px;
      border-top: 1px solid var(--line);
    }
    .categories-footer .btn {
      min-width: 132px;
      border-radius: 9px;
    }

    .dashboard-categories {
      display: grid;
      grid-template-columns: repeat(3, minmax(0, 1fr));
      gap: 10px;
      margin: 14px 0;
    }

    .dashboard-category {
      border: 1px solid var(--line);
      border-radius: var(--radius);
      background: var(--paper);
      padding: 11px 14px;
      min-width: 0;
      transition: box-shadow .12s ease;
    }

    .dashboard-category:hover {
      box-shadow: 0 2px 10px rgba(37,99,235,.08);
    }

    .dashboard-category strong {
      display: flex;
      justify-content: space-between;
      gap: 8px;
      color: var(--ink);
      font-size: 13px;
      font-weight: 700;
      letter-spacing: -.01em;
      margin-bottom: 4px;
    }

    .dashboard-category p {
      font-size: 12px;
      line-height: 1.5;
      color: var(--muted);
      margin: 0;
    }

    .dashboard-category span:last-child {
      color: var(--ink);
      font-weight: 800;
    }

    .dashboard-category p {
      margin: 0;
      font-size: 13px;
    }

    .screen-footer-actions {
      display: flex;
      justify-content: flex-end;
      margin-top: 18px;
    }

    /* ── Funnel card — consistent container for all steps ────────────────── */
    .funnel-card-wrap {
      display: flex;
      align-items: flex-start;
      justify-content: center;
      min-height: calc(100vh - 60px);
      padding: 24px 20px 48px;
    }

    .funnel-card {
      width: 100%;
      max-width: 740px;
      height: 540px;           /* fixed height — button always at the same spot */
      background: var(--paper);
      border: 1px solid var(--line);
      border-radius: 12px;
      box-shadow: 0 2px 8px rgba(0,0,0,.04), 0 12px 40px rgba(13,27,42,.08);
      display: flex;
      flex-direction: column;
      overflow: hidden;
    }

    .funnel-card-body {
      padding: 32px 32px 16px;
      flex: 1;
      overflow-y: auto;        /* scroll if content overflows */
    }

    .funnel-card-footer {
      padding: 14px 24px;
      border-top: 1px solid var(--line);
      background: #FAFBFC;
      display: flex;
      align-items: center;
      justify-content: flex-end;
      gap: 12px;
      flex-shrink: 0;
    }

    .funnel-card-footer .btn,
    .funnel-card-footer button.btn {
      min-width: 140px;
      border-radius: 8px;
      box-shadow: 0 4px 14px rgba(37,99,235,.22);
    }

    /* Legacy fixed button — kept for pages not yet migrated */
    .screen-footer-actions.centered-form-actions {
      position: fixed;
      bottom: 44px;
      right: 48px;
      display: flex;
      margin: 0;
      z-index: 50;
    }
    .screen-footer-actions.centered-form-actions .btn,
    .screen-footer-actions.centered-form-actions button {
      min-width: 160px;
      box-shadow: 0 8px 28px rgba(37,99,235,.28), 0 2px 6px rgba(0,0,0,.08);
    }
    .flow-page .page-body { padding-bottom: 120px; }

    .centered-form-card {
      max-width: 520px;
      margin: var(--flow-panel-start) auto 0;
    }

    .centered-wide-card {
      max-width: 680px;
      margin: var(--flow-panel-start) auto 0;
    }

    .centered-card-actions {
      max-width: 680px;
      margin-left: auto;
      margin-right: auto;
    }

    .centered-form-actions {
      max-width: 520px;
      margin-left: auto;
      margin-right: auto;
    }

    .flow-actions .btn {
      min-width: 132px;
      border-radius: 9px;
    }

    .left-file-nav {
      display: grid;
      gap: 10px;
    }

    .subcat-block {
      border: 1px solid var(--line);
      border-radius: 8px;
      background: #ffffff;
      overflow: hidden;
    }

    .subcat-head {
      display: grid;
      grid-template-columns: minmax(0, 1fr) auto 18px;
      align-items: center;
      gap: 10px;
      padding: 11px 12px;
      border-bottom: 1px solid var(--line);
      color: var(--ink);
      font-weight: 900;
      cursor: pointer;
      user-select: none;
    }

    .subcat-head::before {
      content: none;
    }

    .subcat-count {
      color: var(--muted);
      font-size: 12px;
      font-weight: 800;
    }

    .folder-caret {
      width: 18px;
      height: 18px;
      border: 1px solid #c9d7d4;
      border-radius: 50%;
      display: inline-grid;
      place-items: center;
      transition: transform .16s ease;
    }

    .folder-caret::before {
      content: "";
      width: 6px;
      height: 6px;
      border-right: 2px solid #72837f;
      border-bottom: 2px solid #72837f;
      transform: rotate(45deg) translate(-1px, -1px);
    }

    .subcat-block.collapsed .folder-caret {
      transform: rotate(-90deg);
    }

    .subcat-files {
      display: block;
    }

    .subcat-block.collapsed .subcat-files {
      display: none;
    }

    .subcat-file {
      display: grid;
      grid-template-columns: minmax(0, 1fr) 12px;
      gap: 8px;
      align-items: center;
      padding: 10px 12px 10px 38px;
      border-bottom: 1px solid var(--line);
      color: #34433f;
      font-size: 13px;
      cursor: pointer;
    }

    .subcat-file::before {
      content: none;
    }

    .subcat-file:last-child { border-bottom: 0; }

    .subcat-file.selected {
      background: #eef5ff;
      color: var(--brand-dark);
      font-weight: 800;
    }

    .upload-state {
      width: 9px;
      height: 9px;
      border-radius: 50%;
      justify-self: end;
      padding: 0;
      white-space: nowrap;
      color: transparent;
      font-size: 0;
      overflow: hidden;
    }

    .upload-state.state,
    .status-pill.state {
      background: var(--brand);
    }

    .upload-state.federal,
    .status-pill.federal {
      background: #fff5c2;
    }

    .upload-state.needed {
      background: #d6dfdc;
    }

    .upload-state.uploaded {
      background: #e1f6eb;
    }

    .upload-state.not-required {
      background: #d9dde2;
    }

    .subcat-file .upload-state.state,
    .subcat-file .upload-state.federal {
      background: #9fb2ae;
    }

    .subcat-file .upload-state.needed {
      background: #c8d3d0;
    }

    .subcat-file .upload-state.uploaded {
      background: #14a46c;
    }

    .subcat-file .upload-state.not-required {
      background: #7f8b91;
    }

    .folder {
      border: 1px solid transparent;
      border-radius: var(--radius);
      padding: 10px;
      margin-bottom: 6px;
      cursor: pointer;
    }

    .folder.active {
      border-color: #cfe0ff;
      background: #eef5ff;
    }

    .folder-top {
      display: flex;
      justify-content: space-between;
      gap: 8px;
      font-weight: 800;
    }

    .folder-meta {
      color: var(--muted);
      font-size: 12px;
      margin-top: 3px;
    }

    .subfolder {
      margin: 8px 0 0 16px;
      display: grid;
      gap: 5px;
    }

    .subfolder span {
      display: flex;
      justify-content: space-between;
      gap: 8px;
      color: #4c5a56;
      font-size: 12px;
    }

    .workspace-title {
      display: flex;
      justify-content: space-between;
      align-items: flex-start;
      gap: 16px;
      margin-bottom: 16px;
    }

    .workspace-title > div:first-child {
      min-width: 0;
      flex: 1 1 auto;
    }

    .workspace-title .no-wrap-title {
      max-width: none;
      white-space: nowrap;
    }

    .workspace-title .lead {
      max-width: 900px;
    }

    #edl .workspace-title .lead {
      max-width: none;
      white-space: nowrap;
    }

    .file-list {
      display: grid;
      gap: 10px;
    }

    .file-row {
      display: grid;
      grid-template-columns: 34px minmax(0, 1fr) auto;
      gap: 12px;
      align-items: center;
      border: 1px solid var(--line);
      border-radius: var(--radius);
      padding: 12px;
      background: white;
    }

    .file-row.selected {
      border-color: #cfe0ff;
      background: #eef5ff;
    }

    .file-icon {
      width: 34px;
      height: 34px;
      border-radius: 8px;
      display: grid;
      place-items: center;
      color: var(--brand);
      background: #eef5ff;
      font-weight: 900;
      font-size: 12px;
    }

    .status-pill {
      border-radius: 999px;
      padding: 5px 9px;
      color: var(--brand);
      background: #eef5ff;
      font-size: 11px;
      font-weight: 900;
      white-space: nowrap;
    }

    .status-pill.missing {
      color: #8a6700;
      background: #fff6cc;
    }

    .status-pill.uploaded {
      color: #0b6b46;
      background: #e1f6eb;
    }

    .status-pill.warning {
      color: #6d5600;
      background: #fff6cc;
    }

    .uploaded-render {
      height: 100%;
      min-height: 280px;
      display: grid;
      align-items: start;
      background: #ffffff;
      overflow: auto;
    }

    .preview-upload-empty {
      height: 100%;
      min-height: 280px;
      display: grid;
      align-items: center;
      justify-items: center;
      background: #ffffff;
      padding: 28px;
    }

    .preview-upload-empty .upload-experience {
      width: min(430px, 100%);
      grid-template-columns: 1fr;
      border-style: solid;
      border-color: #c9d9d6;
      background: #ffffff;
      box-shadow: 0 18px 50px rgba(32, 48, 45, .08);
      margin: 0;
    }

    .preview-upload-empty .upload-actions {
      display: grid;
      grid-template-columns: 1fr;
      justify-content: stretch;
    }

    .preview-upload-empty .upload-actions .btn,
    .preview-upload-empty .upload-actions label.btn {
      width: 100%;
      text-align: center;
    }

    .uploaded-render iframe,
    .uploaded-render img {
      width: 100%;
      height: 100%;
      min-height: 360px;
      border: 0;
      border-radius: 0 0 8px 8px;
      background: #ffffff;
    }

    .uploaded-render img {
      min-height: 0;
      max-height: 560px;
      object-fit: contain;
      padding: 16px;
    }

    .uploaded-file-card {
      align-self: center;
      justify-self: center;
      width: min(420px, calc(100% - 32px));
      border: 1px solid var(--line);
      border-radius: 8px;
      background: #ffffff;
      padding: 24px;
      text-align: center;
      box-shadow: 0 18px 50px rgba(32, 48, 45, .08);
    }

    .uploaded-file-card strong {
      display: block;
      color: var(--ink);
      font-size: 16px;
      margin-bottom: 8px;
    }

    .uploaded-file-card span {
      display: block;
      color: var(--muted);
      font-size: 13px;
      line-height: 1.45;
    }

    .source-list {
      display: grid;
      gap: 8px;
      margin-top: 12px;
    }

    .source-item {
      display: grid;
      grid-template-columns: 92px minmax(0, 1fr);
      gap: 10px;
      align-items: start;
      padding: 10px;
      border: 1px solid var(--line);
      border-radius: 8px;
      background: #fbfefd;
      font-size: 12px;
      line-height: 1.35;
    }

    .source-item strong {
      color: var(--brand-dark);
      font-size: 11px;
      text-transform: uppercase;
      letter-spacing: .06em;
    }

    .missing-doc-summary {
      border: 1px solid #f1d86c;
      border-radius: 8px;
      background: #fff9db;
      padding: 14px;
      margin-bottom: 14px;
    }

    .summary-header {
      display: flex;
      justify-content: space-between;
      align-items: flex-start;
      gap: 14px;
      margin-bottom: 12px;
    }

    .summary-header h3 {
      margin: 4px 0 0;
      font-size: 18px;
    }

    .summary-control {
      min-width: 260px;
      border: 1px solid #e7d16f;
      border-radius: 8px;
      background: #ffffff;
      color: var(--ink);
      padding: 10px;
      font: inherit;
      font-size: 13px;
    }

    .summary-meta {
      display: flex;
      gap: 8px;
      flex-wrap: wrap;
      margin-bottom: 10px;
    }

    .summary-chip {
      border: 1px solid rgba(0, 106, 255, .16);
      border-radius: 999px;
      background: #ffffff;
      color: #405451;
      padding: 5px 9px;
      font-size: 11px;
      font-weight: 800;
    }

    .summary-body {
      color: #405451;
      font-size: 14px;
      line-height: 1.48;
      margin-bottom: 10px;
    }

    .summary-bullets {
      margin: 0;
      padding-left: 18px;
      color: var(--ink);
      font-size: 13px;
      line-height: 1.45;
    }

    .summary-bullets li + li {
      margin-top: 5px;
    }

    .upload-experience {
      display: grid;
      grid-template-columns: minmax(0, 1fr) auto;
      gap: 12px;
      align-items: center;
      border: 1px dashed #bfd0cc;
      border-radius: 8px;
      background: #fbfefd;
      padding: 12px;
      margin-top: 14px;
    }

    .upload-copy {
      min-width: 0;
    }

    .upload-copy strong {
      display: block;
      color: #243733;
      font-size: 13px;
      margin-bottom: 3px;
    }

    .upload-copy span {
      color: var(--muted);
      display: block;
      font-size: 12px;
      line-height: 1.4;
    }

    .upload-actions {
      display: flex;
      gap: 8px;
      align-items: center;
      justify-content: flex-end;
      flex-wrap: wrap;
    }

    .upload-file-input {
      position: absolute;
      width: 1px;
      height: 1px;
      padding: 0;
      margin: -1px;
      overflow: hidden;
      clip: rect(0, 0, 0, 0);
      white-space: nowrap;
      border: 0;
    }

    .upload-status-line {
      grid-column: 1 / -1;
      color: #50615d;
      font-size: 12px;
      line-height: 1.4;
      margin: 0;
    }

    .upload-status-line strong {
      color: #0b6b46;
    }

    .upload-status-line.error {
      color: #9b1c1c;
    }

    .upload-status-line.error strong {
      color: #9b1c1c;
    }

    .upload-status-line.success {
      color: #0b6b46;
    }

    .ai-feature-grid {
      display: grid;
      grid-template-columns: repeat(3, minmax(0, 1fr));
      gap: 10px;
      margin-top: 14px;
    }

    .ai-feature {
      border: 1px solid var(--line);
      border-radius: 8px;
      padding: 12px;
      background: #fbfefd;
    }

    .ai-feature strong {
      display: block;
      font-size: 13px;
      margin-bottom: 5px;
    }

    .ai-feature span {
      color: var(--muted);
      font-size: 12px;
      line-height: 1.4;
    }

    .edl-preview-panel .panel-body {
      padding: 0;
    }

    #edl {
      --edl-fixed-top: 64px;
      --edl-fixed-bottom: 24px;
      --edl-chat-width: 380px;
      --edl-chat-right: 28px;
      --edl-panel-gap: 24px;
    }

    .edl-preview-panel {
      position: fixed;
      left: 324px;
      right: calc(var(--edl-chat-width) + var(--edl-chat-right) + var(--edl-panel-gap));
      top: var(--edl-fixed-top);
      bottom: var(--edl-fixed-bottom);
      height: auto;
      z-index: 32;
    }

    .edl-side-column {
      display: grid;
      gap: 12px;
      align-content: start;
      min-width: 0;
    }

    .edl-side-column .missing-doc-summary {
      margin-bottom: 0;
    }

    .edl-side-column .summary-header {
      display: grid;
      gap: 10px;
      margin-bottom: 10px;
    }

    .edl-side-column .summary-control {
      min-width: 0;
      width: 100%;
    }

    .doc-detail {
      margin-top: 16px;
      display: grid;
      grid-template-columns: minmax(0, 1fr) minmax(260px, .72fr);
      gap: 16px;
      align-items: stretch;
    }

    .edl-preview-panel .doc-detail {
      display: block;
      margin-top: 0;
    }

    .doc-detail > .pdf,
    .doc-detail > .why-panel {
      min-height: 100%;
    }

    .doc-detail > .inline-chat {
      min-height: 100%;
    }

    .inline-chat {
      position: fixed;
      right: var(--edl-chat-right);
      top: var(--edl-fixed-top);
      bottom: var(--edl-fixed-bottom);
      width: min(var(--edl-chat-width), calc(100vw - 32px));
      max-height: none;
      border: 1px solid var(--line);
      border-radius: var(--radius);
      background: #ffffff;
      overflow: hidden;
      box-shadow: 0 22px 60px rgba(23, 33, 31, .20);
      display: flex;
      flex-direction: column;
      z-index: 40;
    }

    .inline-chat .chat-panel-head {
      background: var(--bg);
    }

    .inline-chat .messages {
      flex: 1 1 auto;
      min-height: 0;
      max-height: none;
      overflow: auto;
    }

    .edl-side-column .inline-chat .messages {
      min-height: 0;
      max-height: none;
    }

    .inline-chat .panel-body {
      display: flex;
      flex-direction: column;
      min-height: 0;
      flex: 1 1 auto;
    }

    .inline-chat .ask {
      margin-top: 12px;
    }

    .inline-chat.minimized {
      top: auto;
      bottom: var(--edl-fixed-bottom);
      width: 68px;
      height: 68px;
      min-height: 68px;
      border-radius: 50%;
      overflow: visible;
      border-color: transparent;
      background: transparent;
      box-shadow: 0 14px 30px rgba(83, 116, 125, .18);
    }

    .inline-chat.minimized .panel-body,
    .inline-chat.minimized .chat-title-row h3,
    .inline-chat.minimized .chat-panel-head p {
      display: none;
    }

    .inline-chat.minimized .chat-panel-head {
      min-height: 68px;
      height: 68px;
      padding: 0;
      align-items: center;
      justify-content: center;
      flex-direction: row;
      border-bottom: 0;
      background: transparent;
    }

    .inline-chat.minimized .chat-title-row {
      display: grid;
      place-items: center;
      gap: 0;
    }

    .inline-chat.minimized .chat-launch-icon {
      width: 58px;
      height: 58px;
      animation: none;
      background: var(--soft);
      border-radius: 50%;
      box-shadow:
        inset 0 0 0 1px rgba(255, 255, 255, .72),
        0 8px 18px rgba(37, 99, 235, .16);
    }

    .inline-chat.minimized .chat-launch-icon span {
      width: 40px;
      height: 40px;
      border-radius: 50%;
      background: var(--brand);
      box-shadow: inset 0 1px 0 rgba(255, 255, 255, .22);
    }

    .inline-chat.minimized .chat-launch-icon svg {
      width: 24px;
      height: 24px;
      stroke: #ffffff;
    }

    .inline-chat.minimized .chat-icon-toggle {
      position: absolute;
      inset: 0;
      width: auto;
      height: auto;
      opacity: 0;
      padding: 0;
    }

    .sticky-chat {
      position: fixed;
      right: 30px;
      bottom: 30px;
      width: min(360px, calc(100vw - 32px));
      max-height: min(620px, calc(100vh - 48px));
      display: flex;
      flex-direction: column;
      z-index: 30;
      box-shadow: 0 22px 60px rgba(23, 33, 31, .20);
    }

    .sticky-chat .messages {
      min-height: 300px;
      max-height: 390px;
      overflow: auto;
    }

    .workspace-shell.chat-minimized {
      grid-template-columns: 300px minmax(0, 1fr);
    }

    .workspace-shell.has-category-top.chat-minimized {
      grid-template-columns: 300px minmax(0, 1fr);
    }

    .workspace-shell.edl-three-column,
    .workspace-shell.edl-three-column.chat-minimized,
    .workspace-shell.has-category-top.edl-three-column.chat-minimized {
      grid-template-columns: 300px minmax(320px, 360px);
    }

    .readiness-grid.chat-minimized {
      grid-template-columns: 1fr 1fr;
    }

    .sticky-chat.minimized {
      width: 66px;
      height: 66px;
      min-height: 66px;
      border-radius: 50%;
      cursor: pointer;
      overflow: visible;
      border-color: transparent;
      background: transparent;
      box-shadow: 0 14px 30px rgba(83, 116, 125, .18);
    }

    .sticky-chat.minimized .panel-body,
    .sticky-chat.minimized .chat-title-row h3,
    .sticky-chat.minimized .chat-panel-head p {
      display: none;
    }

    .sticky-chat.minimized .chat-panel-head {
      min-height: 66px;
      height: 66px;
      padding: 0;
      align-items: center;
      justify-content: center;
      flex-direction: row;
      border-bottom: 0;
      background: transparent;
    }

    .sticky-chat.minimized .chat-title-row {
      display: grid;
      place-items: center;
      gap: 0;
    }

    .sticky-chat.minimized .chat-launch-icon {
      width: 58px;
      height: 58px;
      animation: none;
      background: var(--soft);
      border-radius: 50%;
      box-shadow:
        inset 0 0 0 1px rgba(255, 255, 255, .72),
        0 8px 18px rgba(37, 99, 235, .16);
    }

    .sticky-chat.minimized .chat-launch-icon span {
      width: 40px;
      height: 40px;
      border-radius: 50%;
      background: var(--brand);
      box-shadow: inset 0 1px 0 rgba(255, 255, 255, .22);
    }

    .sticky-chat.minimized .chat-launch-icon svg {
      width: 24px;
      height: 24px;
      stroke: #ffffff;
    }

    .sticky-chat.minimized .chat-toggle {
      position: absolute;
      inset: 0;
      opacity: 0;
      padding: 0;
    }

    .finding-list {
      margin: 12px 0 0;
      padding-left: 20px;
      color: var(--ink);
    }

    .finding-list li { margin: 8px 0; }

    .question-grid {
      display: grid;
      grid-template-columns: repeat(2, minmax(0, 1fr));
      gap: 10px;
      margin-top: 14px;
    }

    .app:not(.home-view):not(.scan-view) .content {
      max-width: none;
      padding: 22px 28px 34px;
    }

    .app:not(.home-view):not(.scan-view) h1 {
      max-width: 620px;
      font-size: 32px;
      line-height: 1.06;
      margin: 10px 0 8px;
      color: var(--ink);
      font-weight: 700;
      letter-spacing: -.025em;
    }

    .app:not(.home-view):not(.scan-view) h1.one-line-title {
      max-width: none;
      font-size: 32px;
      white-space: nowrap;
    }

    .app:not(.home-view):not(.scan-view) h2 {
      font-size: 18px;
      line-height: 1.2;
      margin-bottom: 6px;
      color: var(--ink);
    }

    .app:not(.home-view):not(.scan-view) h3 {
      font-size: 14px;
    }

    .app:not(.home-view):not(.scan-view) .lead {
      max-width: 700px;
      font-size: 14px;
      line-height: 1.45;
    }

    .app:not(.home-view):not(.scan-view) .eyebrow {
      padding: 4px 9px;
      font-size: 11px;
      font-weight: 700;
    }

    .app:not(.home-view):not(.scan-view) .card,
    .app:not(.home-view):not(.scan-view) .workspace-panel,
    .app:not(.home-view):not(.scan-view) .metric,
    .app:not(.home-view):not(.scan-view) .dashboard-category {
      box-shadow: none;
    }

    .app:not(.home-view):not(.scan-view) .metric {
      padding: 12px;
    }

    .app:not(.home-view):not(.scan-view) .metric strong {
      font-size: 22px;
    }

    .app:not(.home-view):not(.scan-view) .summary-row {
      gap: 10px;
      margin-bottom: 12px;
    }

    .app:not(.home-view):not(.scan-view) .workspace-title {
      align-items: center;
      margin-bottom: 12px;
    }

    .app:not(.home-view):not(.scan-view) .workspace-title h1 {
      max-width: none;
    }

    .app:not(.home-view):not(.scan-view) .workspace-title p {
      margin-bottom: 0;
    }

    .app:not(.home-view):not(.scan-view) .progress-wrap {
      margin: 8px 0 12px;
    }

    .app:not(.home-view):not(.scan-view) .progress {
      height: 9px;
    }

    .app:not(.home-view):not(.scan-view) .progress-label {
      font-size: 13px;
      margin-bottom: 5px;
    }

    .app:not(.home-view):not(.scan-view) .category-top {
      display: flex;
      gap: 8px;
      margin-bottom: 12px;
      padding-bottom: 4px;
      overflow-x: auto;
    }

    .app:not(.home-view):not(.scan-view) .category-tile {
      min-width: 180px;
      min-height: auto;
      padding: 9px 11px;
      justify-content: center;
      gap: 4px;
    }

    .app:not(.home-view):not(.scan-view) .category-tile-top {
      font-size: 13px;
      color: #2d3d39;
    }

    .app:not(.home-view):not(.scan-view) .category-tile p {
      display: none;
    }

    .app:not(.home-view):not(.scan-view) .panel-head {
      padding: 12px 14px;
    }

    .app:not(.home-view):not(.scan-view) .panel-head p {
      margin-bottom: 0;
      font-size: 12px;
    }

    .app:not(.home-view):not(.scan-view) .panel-body {
      padding: 10px;
    }

    .app:not(.home-view):not(.scan-view) .workspace-shell {
      grid-template-columns: 280px minmax(0, 1fr);
      gap: 12px;
    }

    .app:not(.home-view):not(.scan-view) .workspace-shell.has-category-top {
      grid-template-columns: 280px minmax(0, 1fr);
    }

    .app:not(.home-view):not(.scan-view) .workspace-shell.chat-minimized,
    .app:not(.home-view):not(.scan-view) .workspace-shell.has-category-top.chat-minimized {
      grid-template-columns: 280px minmax(0, 1fr);
    }

    .app:not(.home-view):not(.scan-view) .workspace-shell.edl-three-column,
    .app:not(.home-view):not(.scan-view) .workspace-shell.has-category-top.edl-three-column,
    .app:not(.home-view):not(.scan-view) .workspace-shell.edl-three-column.chat-minimized,
    .app:not(.home-view):not(.scan-view) .workspace-shell.has-category-top.edl-three-column.chat-minimized {
      grid-template-columns: 280px minmax(320px, 350px);
      gap: 12px;
    }

    .app:not(.home-view):not(.scan-view) .doc-detail {
      margin-top: 10px;
      gap: 12px;
    }

    .app:not(.home-view):not(.scan-view) .edl-preview-panel .doc-detail {
      margin-top: 0;
    }

    .app:not(.home-view):not(.scan-view) .paper {
      min-height: 200px;
      padding: 20px 24px;
    }

    .app:not(.home-view):not(.scan-view) .sticky-chat .messages {
      min-height: 300px;
    }

    .readiness-grid {
      display: grid;
      grid-template-columns: 1fr 1fr 340px;
      gap: 12px;
      align-items: start;
    }

    .readiness-list {
      display: grid;
      gap: 8px;
    }

    .readiness-row {
      display: grid;
      grid-template-columns: minmax(0, 1fr) auto;
      gap: 12px;
      align-items: center;
      padding: 10px 0;
      border-bottom: 1px solid var(--line);
      font-size: 13px;
    }

    .readiness-row:last-child {
      border-bottom: 0;
    }

    .readiness-row strong {
      display: block;
      color: #2d3d39;
    }

    .readiness-row span {
      color: var(--muted);
      font-size: 12px;
    }

    .price-card {
      text-align: center;
      border: 2px solid var(--brand);
      background: var(--paper);
      max-width: 420px;
      margin: 0 auto;
      box-shadow: 0 4px 24px rgba(37, 99, 235, .12);
    }

    .price {
      font-size: 60px;
      line-height: 1;
      font-weight: 800;
      margin: 12px 0 4px;
      letter-spacing: -.04em;
      color: var(--ink);
    }

    .mobile-tabs {
      display: none;
      gap: 8px;
      overflow-x: auto;
      padding: 10px 14px;
      border-bottom: 1px solid var(--line);
      background: white;
      position: sticky;
      top: 68px;
      z-index: 4;
    }

    .mobile-tabs button {
      border: 1px solid var(--line);
      border-radius: 999px;
      background: white;
      padding: 8px 12px;
      white-space: nowrap;
    }

    .mobile-tabs button.active {
      color: white;
      border-color: var(--brand);
      background: var(--brand);
    }

    /* ── EDL full-height 3-column grid ────────────────────────────────────── */

    /* Make the content column a full-height flex container when EDL is active */
    .app:has(#edl.active) > main {
      display: flex;
      flex-direction: column;
      height: 100vh;
      overflow: hidden;
    }

    .app:has(#edl.active) .content {
      flex: 1;
      min-height: 0;
      display: flex;
      flex-direction: column;
      overflow: hidden;
      padding-bottom: 0;
    }

    #edl.active {
      flex: 1;
      min-height: 0;
      display: flex;
      flex-direction: column;
      overflow: hidden;
    }

    /* 3-column grid fills remaining height */
    #edl .workspace-shell.edl-three-column {
      flex: 1;
      min-height: 0;
      overflow: hidden;
      display: grid !important;
      grid-template-columns: 280px 1fr 368px !important;
      gap: 12px !important;
      padding-bottom: 0 !important;
      align-items: stretch !important;
    }

    /* Left column: scrollable */
    #edl .workspace-shell > aside:first-child {
      overflow-y: auto;
      height: 100%;
    }

    /* Center column: override fixed, become a normal grid item */
    #edl .edl-preview-panel {
      position: static !important;
      left: auto !important;
      right: auto !important;
      top: auto !important;
      bottom: auto !important;
      height: 100% !important;
      overflow: hidden;
      display: flex;
      flex-direction: column;
      z-index: auto !important;
    }

    #edl .edl-preview-panel .panel-body {
      flex: 1;
      min-height: 0;
      overflow: hidden;
      padding: 0;
    }

    #edl .edl-preview-panel .doc-detail {
      display: flex !important;
      flex-direction: column;
      height: 100%;
      margin: 0;
    }

    #edl .edl-preview-panel .pdf {
      flex: 1;
      min-height: 0;
      display: flex;
      flex-direction: column;
      overflow: hidden;
    }

    #edl .edl-preview-panel .paper,
    #edl .edl-preview-panel .uploaded-render,
    #edl .edl-preview-panel .preview-upload-empty {
      flex: 1;
      min-height: 0;
      overflow-y: auto;
    }

    /* Right column: flex column, scrollable */
    #edl .edl-side-column {
      height: 100%;
      display: flex !important;
      flex-direction: column;
      gap: 10px;
      overflow: hidden;
    }

    #edl .edl-side-column .missing-doc-summary {
      flex-shrink: 0;
      margin-bottom: 0;
      overflow-y: auto;
      max-height: 38%;
    }

    /* Chat: override fixed within EDL, fill remaining space */
    #edl .inline-chat {
      position: static !important;
      right: auto !important;
      top: auto !important;
      bottom: auto !important;
      width: 100% !important;
      flex: 1;
      min-height: 0;
      max-height: none !important;
    }

    #edl .inline-chat.minimized {
      flex: 0 0 68px !important;
      border-radius: var(--radius) !important;
    }

    /* ── end EDL layout ───────────────────────────────────────────────────── */

    /* ── Save docs animation screen ──────────────────────────────────────── */

    .save-ring-wrap {
      position: relative;
      width: 88px;
      height: 88px;
      margin: 8px auto 0;
      display: grid;
      place-items: center;
    }

    .save-ring {
      position: absolute;
      inset: 0;
      width: 100%;
      height: 100%;
    }

    .save-ring-track {
      stroke: var(--line);
    }

    .save-ring-fill {
      stroke: var(--brand);
      stroke-linecap: round;
      transform-origin: center;
      transform: rotate(-90deg);
      stroke-dasharray: 226.2;
      stroke-dashoffset: 226.2;
      transition: stroke-dashoffset 3s linear, stroke .3s ease;
    }

    .save-ring-fill.run {
      stroke-dashoffset: 0;
    }

    .save-ring-fill.done {
      stroke: #16A34A;
    }

    .save-icon-inner {
      position: relative;
      z-index: 1;
      width: 40px;
      height: 40px;
      display: grid;
      place-items: center;
    }

    .save-icon-doc,
    .save-icon-check {
      position: absolute;
      width: 26px;
      height: 26px;
      stroke-width: 2;
      stroke-linecap: round;
      stroke-linejoin: round;
      fill: none;
      transition: opacity .25s ease, transform .25s ease;
    }

    .save-icon-doc  { stroke: var(--brand); opacity: 1; transform: scale(1); }
    .save-icon-check { stroke: #16A34A; opacity: 0; transform: scale(.7); }

    .save-ring-wrap.done .save-icon-doc   { opacity: 0; transform: scale(.7); }
    .save-ring-wrap.done .save-icon-check { opacity: 1; transform: scale(1); }

    .save-status-label {
      font-size: 13px;
      font-weight: 600;
      letter-spacing: .06em;
      text-transform: uppercase;
      color: var(--brand);
      margin-top: 22px;
      transition: color .3s ease;
    }

    .save-status-label.done { color: #16A34A; }

    .scan-progress span.running-fast {
      animation: fillScan 3s linear forwards;
    }

    /* ── end save docs ────────────────────────────────────────────────────── */

    /* ── Finalize animation screen ────────────────────────────────────────── */

    .scan-progress span.running-5s {
      animation: fillScan 5s linear forwards;
    }

    /* ── Document analysis (upload validation) ───────────────────────────── */
    .scan-progress span.running-analysis { animation: fillScan 2.5s linear forwards; }

    .doc-analysis-loading {
      display: flex;
      flex-direction: column;
      align-items: center;
      justify-content: center;
      padding: 40px 24px;
      gap: 16px;
      min-height: 260px;
    }
    .analysis-anim {
      position: relative;
      width: 64px;
      height: 64px;
      display: grid;
      place-items: center;
    }
    .analysis-ring  { position: absolute; inset: 0; width: 100%; height: 100%; }
    .analysis-track { stroke: var(--line); }
    .analysis-fill  {
      stroke-linecap: round;
      transform-origin: center;
      transform: rotate(-90deg);
      stroke-dasharray: 163.4;
      stroke-dashoffset: 163.4;
    }
    .analysis-status-msg {
      font-size: 13px;
      color: var(--muted);
      font-weight: 500;
      text-align: center;
    }

    .doc-analysis-result { padding: 18px; }
    .analysis-header {
      display: flex;
      align-items: center;
      gap: 10px;
      margin-bottom: 14px;
      flex-wrap: wrap;
    }
    .analysis-complete-badge {
      font-size: 11px;
      font-weight: 700;
      letter-spacing: .05em;
      text-transform: uppercase;
      color: #0b6b46;
      background: #e1f6eb;
      border: 1px solid #a7f3d0;
      border-radius: 99px;
      padding: 3px 10px;
      flex-shrink: 0;
    }
    .analysis-doc-name {
      font-size: 12px;
      color: var(--muted);
      overflow: hidden;
      text-overflow: ellipsis;
      white-space: nowrap;
      min-width: 0;
    }
    .check-rows {
      border: 1px solid var(--line);
      border-radius: 8px;
      overflow: hidden;
    }
    .doc-check-row {
      display: grid;
      grid-template-columns: 26px 1fr;
      gap: 10px;
      align-items: flex-start;
      padding: 11px 13px;
      border-bottom: 1px solid var(--line);
    }
    .doc-check-row:last-child { border-bottom: 0; }
    .doc-check-row.pass { background: #fafffe; }
    .doc-check-row.fail { background: #fffbfa; }
    .check-badge {
      width: 22px;
      height: 22px;
      border-radius: 50%;
      display: flex;
      align-items: center;
      justify-content: center;
      font-size: 12px;
      font-weight: 700;
      flex-shrink: 0;
      margin-top: 1px;
    }
    .doc-check-row.pass .check-badge { background: #dcfce7; color: #166534; }
    .doc-check-row.fail .check-badge { background: #fee2e2; color: #991b1b; }
    .doc-check-row > div > strong {
      font-size: 13px;
      font-weight: 700;
      color: var(--ink);
      display: block;
      margin-bottom: 2px;
    }
    .doc-check-row > div > p {
      font-size: 12px;
      color: var(--muted);
      margin: 0;
      line-height: 1.45;
    }
    .analysis-ai-note {
      margin-top: 12px;
      background: var(--soft);
      border: 1px solid var(--tertiary-line);
      border-radius: 8px;
      padding: 11px 13px;
    }
    .ai-note-label {
      font-size: 10px;
      font-weight: 700;
      letter-spacing: .08em;
      text-transform: uppercase;
      color: var(--brand);
      display: block;
      margin-bottom: 4px;
    }
    .analysis-ai-note > p {
      font-size: 12px;
      color: var(--ink);
      margin: 0;
      line-height: 1.5;
    }

    /* ── California Findings section ─────────────────────────────────────── */
    .findings-section { margin-top: 12px; }
    .findings-section-title {
      font-size: 10px;
      font-weight: 800;
      letter-spacing: .07em;
      text-transform: uppercase;
      color: var(--muted);
      margin-bottom: 8px;
      display: block;
    }
    .findings-group { margin-bottom: 8px; }
    .findings-group:last-child { margin-bottom: 0; }
    .findings-severity-label {
      font-size: 10px;
      font-weight: 800;
      letter-spacing: .06em;
      text-transform: uppercase;
      display: inline-block;
      padding: 2px 8px;
      border-radius: 99px;
      margin-bottom: 5px;
    }
    .findings-severity-label.critical { background: #fee2e2; color: #991b1b; }
    .findings-severity-label.high     { background: #fff7ed; color: #92400e; }
    .findings-severity-label.medium   { background: #eff6ff; color: #1e40af; }
    .findings-list { display: flex; flex-direction: column; }
    .findings-item {
      display: grid;
      grid-template-columns: 14px 1fr;
      gap: 7px;
      align-items: baseline;
      padding: 4px 0;
      border-bottom: 1px solid var(--line);
      font-size: 12px;
      line-height: 1.45;
    }
    .findings-item:last-child { border-bottom: 0; }
    .findings-item.flagged .fi-icon { color: #991b1b; font-weight: 700; }
    .findings-item.clear   .fi-icon { color: #16a34a; font-weight: 700; }
    .findings-item.flagged .fi-text { color: var(--ink); font-weight: 500; }
    .findings-item.clear   .fi-text { color: var(--muted); }

    /* ── Analysis results in the right side column ───────────────────────── */
    #docAnalysisSide:empty { display: none; }
    #docAnalysisSide:not(:empty) {
      flex-shrink: 0;
      overflow-y: auto;
      max-height: 44%;
      border-top: 1px solid var(--line);
      padding: 10px 12px;
    }
    #docAnalysisSide .analysis-header { margin-bottom: 10px; }
    #docAnalysisSide .doc-check-row   { padding: 9px 10px; }
    #docAnalysisSide .analysis-ai-note { margin-top: 10px; }

    /* ── EDL chat panel: compact when closed, overlay when open ─────────── */
    #edlChatPanel:not(.overlay-open) .panel-body { display: none; }
    #edlChatPanel:not(.overlay-open) {
      flex-shrink: 0;
      border-radius: 8px;
      border: 1px solid var(--line);
      background: var(--paper);
    }
    #edlChatPanel:not(.overlay-open) .chat-panel-head {
      border-bottom: none;
      border-radius: 8px;
      cursor: pointer;
      user-select: none;
      padding: 10px 12px;
    }
    #edlChatPanel:not(.overlay-open) .icon-minimize { display: none; }
    #edlChatPanel:not(.overlay-open) .icon-expand   { display: block !important; }

    #edlChatPanel.overlay-open {
      position: fixed !important;
      right: 16px !important;
      bottom: 16px !important;
      top: auto !important;
      left: auto !important;
      width: 360px !important;
      height: 540px !important;
      z-index: 200;
      display: flex !important;
      flex-direction: column;
      box-shadow: 0 16px 64px rgba(0,0,0,.22), 0 0 0 1px var(--line);
      border-radius: 14px;
      overflow: hidden;
      background: var(--paper);
    }
    #edlChatPanel.overlay-open .icon-minimize { display: block; }
    #edlChatPanel.overlay-open .icon-expand   { display: none !important; }
    #edlChatPanel.overlay-open .panel-body    { flex: 1; min-height: 0; display: flex !important; flex-direction: column; }

    .finalize-live {
      min-height: 22px;
      font-size: 15px;
      color: var(--muted);
      margin: 0;
      transition: opacity .22s ease, transform .22s ease;
    }

    .finalize-live.fading {
      opacity: 0;
      transform: translateY(-5px);
    }

    /* ── end finalize ─────────────────────────────────────────────────────── */

    @media (max-width: 1040px) {
      .app { grid-template-columns: 1fr; }
      .app > aside { display: none; }
      .mobile-tabs { display: none !important; }
      .hero, .cols-2, .cols-plan, .doc-preview, .chat-body, .workspace-shell, .doc-detail, .readiness-grid { grid-template-columns: 1fr; }
      .workspace-shell.edl-three-column { padding-bottom: 0; }
      .edl-preview-panel { position: static; height: auto; }
      .summary-row, .cols-3 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
      .dashboard-categories { grid-template-columns: repeat(2, minmax(0, 1fr)); }
      .workspace-title { align-items: flex-start; flex-direction: column; }
      .workspace-title .no-wrap-title { white-space: normal; }
      #edl .workspace-title .lead { white-space: normal; }
    }

    @media (max-width: 680px) {
      .content { padding: 18px 14px 36px; }
      .hero-panel { min-height: 500px; padding: 26px; }
      .app.home-view .hero { grid-template-columns: 1fr; height: auto; min-height: 100vh; padding: 14px; overflow: visible; }
      .app.home-view .hero-panel { padding: 26px 12px; }
      .hero-side { justify-items: center; padding-bottom: 88px; }
      .hero-product-shot { width: 100%; height: auto; max-height: 420px; object-fit: contain; }
      .hero-center-cta { left: 50%; bottom: 24px; transform: translateX(-50%); }
      .app.home-view .form-card { min-height: auto; }
      .landing-proof-heading { display: block; }
      .review-grid, .trust-strip { grid-template-columns: 1fr; }
      .summary-row, .cols-3, .question-grid, .dashboard-categories { grid-template-columns: 1fr; }
      .app:not(.home-view):not(.scan-view) h1.one-line-title { white-space: normal; font-size: 30px; }
      h1 { font-size: 40px; }
      h2 { font-size: 25px; }
    }

    /* ── Compliance analyst review ─────────────────────────────────────── */
    .compliance-review {
      display: grid;
      gap: 18px;
    }

    .compliance-hero {
      border: 1px solid var(--line);
      background: #ffffff;
      border-radius: var(--radius);
      padding: 24px;
      box-shadow: var(--shadow);
    }

    .compliance-hero h1 {
      margin: 8px 0 10px;
      font-size: clamp(30px, 4vw, 48px);
      letter-spacing: -.04em;
      line-height: 1.02;
    }

    .review-grid {
      display: grid;
      grid-template-columns: repeat(3, minmax(0, 1fr));
      gap: 14px;
    }

    .review-card {
      border: 1px solid var(--line);
      background: #fff;
      border-radius: var(--radius);
      padding: 18px;
      box-shadow: var(--shadow);
    }

    .review-card h3 {
      margin: 10px 0 8px;
      font-size: 18px;
      letter-spacing: -.02em;
    }

    .review-card p,
    .review-card li {
      color: var(--muted);
      font-size: 14px;
      line-height: 1.45;
    }

    .review-card ul {
      margin: 10px 0 0;
      padding-left: 18px;
    }

    .risk-level {
      display: inline-flex;
      align-items: center;
      border-radius: 999px;
      padding: 4px 9px;
      font-size: 11px;
      font-weight: 900;
      letter-spacing: .08em;
      text-transform: uppercase;
      border: 1px solid transparent;
    }

    .risk-level.high {
      color: #8d1d12;
      background: #fff1ed;
      border-color: #fecaca;
    }

    .risk-level.medium {
      color: #7a4a00;
      background: #fffbeb;
      border-color: #fde68a;
    }

    .risk-level.low {
      color: #14532d;
      background: #ecfdf5;
      border-color: #bbf7d0;
    }

    .fix-list {
      display: grid;
      gap: 10px;
      margin-top: 12px;
    }

    .fix-item {
      border: 1px solid var(--line);
      border-radius: var(--radius);
      background: #fbfdfd;
      padding: 12px;
    }

    .fix-item strong {
      display: block;
      color: var(--ink);
      margin-bottom: 4px;
    }

    .compliance-sources {
      border: 1px solid var(--tertiary-line);
      background: var(--tertiary);
      border-radius: var(--radius);
      padding: 16px;
      color: var(--muted);
      font-size: 13px;
    }

    @media (max-width: 980px) {
      .review-grid { grid-template-columns: 1fr; }
    }

    /* ── EDL redesign: 3-column workspace ─────────────────────────────────── */

    /* Hide old category tiles row in EDL */
    #edl .category-top { display: none !important; }

    /* Hide old workspace shell */
    #edl .workspace-shell.edl-three-column { display: none !important; }

    /* New workspace */
    .edl-workspace {
      display: grid;
      grid-template-columns: 240px 1fr 268px;
      gap: 14px;
      flex: 1;
      min-height: 0;
      overflow: hidden;
    }

    /* Left nav */
    .edl-left-nav {
      background: white;
      border: 1px solid var(--line);
      border-radius: var(--radius);
      overflow-y: auto;
      display: flex;
      flex-direction: column;
    }

    .edl-left-header {
      padding: 14px 16px 10px;
      border-bottom: 1px solid var(--line);
      position: sticky;
      top: 0;
      background: white;
      z-index: 2;
    }

    .edl-left-header strong {
      display: block;
      font-size: 13px;
      font-weight: 700;
      margin-bottom: 2px;
    }

    .edl-left-header span {
      font-size: 11px;
      color: var(--muted);
    }

    .edl-api-bar {
      padding: 8px 14px;
      font-size: 11px;
      color: var(--muted);
      border-bottom: 1px solid var(--line);
      display: flex;
      align-items: center;
      gap: 8px;
    }

    .edl-api-dot {
      width: 7px; height: 7px;
      border-radius: 50%;
      background: #22c55e;
      flex-shrink: 0;
    }

    .edl-api-dot.loading { background: var(--secondary); animation: pulse 1s infinite; }
    .edl-api-dot.error   { background: #ef4444; }

    @keyframes pulse { 0%,100%{opacity:1} 50%{opacity:.4} }

    /* Category group */
    .edl-cat-group { border-bottom: 1px solid var(--line); }

    .edl-cat-head {
      display: flex;
      align-items: center;
      justify-content: space-between;
      padding: 9px 14px 9px 12px;
      cursor: pointer;
      user-select: none;
    }

    .edl-cat-head:hover { background: var(--soft); }

    .edl-cat-name {
      font-size: 12px;
      font-weight: 600;
      color: var(--ink);
      flex: 1;
    }

    .edl-cat-count {
      font-size: 11px;
      color: var(--muted);
      background: var(--bg);
      border-radius: 10px;
      padding: 1px 7px;
      margin-right: 6px;
      white-space: nowrap;
    }

    .edl-cat-caret {
      font-size: 10px;
      color: var(--muted);
      transition: transform .15s;
    }

    .edl-cat-group.collapsed .edl-cat-caret { transform: rotate(-90deg); }
    .edl-cat-group.collapsed .edl-cat-docs  { display: none; }

    /* Doc row */
    .edl-doc-row {
      display: flex;
      align-items: center;
      justify-content: space-between;
      padding: 7px 14px 7px 20px;
      cursor: pointer;
      font-size: 12px;
      color: var(--ink);
      gap: 8px;
    }

    .edl-doc-row:hover { background: var(--soft); }

    .edl-doc-row.selected {
      background: var(--tertiary);
      color: var(--brand);
      font-weight: 600;
    }

    .edl-doc-name { flex: 1; line-height: 1.35; }

    .edl-status-dot {
      width: 8px; height: 8px;
      border-radius: 50%;
      flex-shrink: 0;
    }
    .edl-status-dot.uploaded  { background: #22c55e; }
    .edl-status-dot.missing   { background: #d1d5db; }
    .edl-status-dot.state     { background: #3b82f6; }
    .edl-status-dot.federal   { background: #8b5cf6; }
    .edl-status-dot.not-required { background: #f59e0b; }

    /* Center panel */
    .edl-center-panel {
      display: flex;
      flex-direction: column;
      overflow: hidden;
      background: white;
      border: 1px solid var(--line);
      border-radius: var(--radius);
    }

    .edl-center-panel .pdfbar {
      display: flex;
      align-items: center;
      justify-content: space-between;
      padding: 9px 16px;
      background: #1a1a2e;
      color: white;
      font-size: 12px;
      font-weight: 500;
      border-radius: var(--radius) var(--radius) 0 0;
      flex-shrink: 0;
    }

    .edl-center-panel .pdfbar span:last-child {
      color: rgba(255,255,255,.55);
      font-size: 11px;
    }

    .edl-center-body {
      flex: 1;
      min-height: 0;
      overflow-y: auto;
      padding: 20px 24px 24px;
      display: flex;
      flex-direction: column;
    }

    /* Right panel */
    .edl-right-panel {
      display: flex;
      flex-direction: column;
      gap: 12px;
      overflow-y: auto;
    }

    .edl-issues-panel {
      background: #fffbeb;
      border: 1px solid #fcd34d;
      border-radius: var(--radius);
      overflow: hidden;
    }

    .edl-issues-header {
      padding: 11px 14px;
      font-size: 12px;
      font-weight: 700;
      color: #78350f;
      border-bottom: 1px solid #fcd34d;
    }

    .edl-issues-desc {
      padding: 8px 14px;
      font-size: 11px;
      color: #92400e;
      border-bottom: 1px solid #fef3c7;
    }

    .edl-issue-row {
      display: grid;
      grid-template-columns: 68px 1fr;
      gap: 10px;
      padding: 10px 14px;
      border-bottom: 1px solid #fef3c7;
      font-size: 12px;
    }

    .edl-issue-row:last-child { border-bottom: 0; }

    .severity-badge {
      display: inline-flex;
      align-items: center;
      justify-content: center;
      padding: 2px 8px;
      border-radius: 12px;
      font-size: 10px;
      font-weight: 700;
      letter-spacing: .03em;
      align-self: start;
      margin-top: 1px;
    }

    .severity-badge.critical { background: #fee2e2; color: #991b1b; }
    .severity-badge.high     { background: #fef3c7; color: #92400e; }
    .severity-badge.medium   { background: #e0f2fe; color: #075985; }

    .edl-issue-text { color: #44302a; line-height: 1.4; }

    /* Right: Worries */
    .edl-worries-panel {
      background: white;
      border: 1px solid var(--line);
      border-radius: var(--radius);
      overflow: hidden;
    }

    .edl-worries-header {
      padding: 11px 14px;
      border-bottom: 1px solid var(--line);
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 10px;
    }

    .edl-worries-header strong {
      font-size: 12px;
      font-weight: 700;
    }

    .edl-worries-tag {
      font-size: 10px;
      font-weight: 700;
      letter-spacing: .04em;
      background: #e0f2fe;
      color: #0369a1;
      padding: 2px 8px;
      border-radius: 10px;
      white-space: nowrap;
    }

    .edl-worries-subtitle {
      padding: 6px 14px 4px;
      font-size: 11px;
      color: var(--muted);
      border-bottom: 1px solid var(--line);
    }

    .edl-worry-row {
      display: flex;
      align-items: flex-start;
      gap: 10px;
      padding: 11px 14px;
      border-bottom: 1px solid var(--line);
    }

    .edl-worry-row:last-child { border-bottom: 0; }

    .edl-worry-row input[type=checkbox] {
      margin-top: 3px;
      flex-shrink: 0;
      width: 15px; height: 15px;
      accent-color: var(--brand);
    }

    .edl-worry-title {
      font-size: 12px;
      font-weight: 600;
      color: var(--ink);
      margin-bottom: 2px;
    }

    .edl-worry-body {
      font-size: 11px;
      color: var(--muted);
      line-height: 1.4;
    }

    .edl-worries-note {
      padding: 8px 14px;
      font-size: 10px;
      color: var(--muted);
      line-height: 1.45;
    }

    /* Stage cards */
    .edl-stage-cards {
      display: grid;
      grid-template-columns: 1fr 1fr 1fr;
      gap: 12px;
      flex-shrink: 0;
      margin-top: 14px;
    }

    .edl-stage-card {
      background: white;
      border: 1px solid var(--line);
      border-radius: var(--radius);
      padding: 16px;
    }

    .edl-stage-card strong {
      display: block;
      font-size: 13px;
      font-weight: 700;
      margin-bottom: 5px;
    }

    .edl-stage-card p {
      font-size: 12px;
      color: var(--muted);
      margin: 0;
      line-height: 1.5;
    }

    /* Full-height EDL layout overrides */
    .app:has(#edl.active) > main { display: flex; flex-direction: column; height: 100vh; overflow: hidden; }
    .app:has(#edl.active) .content { flex: 1; min-height: 0; display: flex; flex-direction: column; overflow: hidden; padding-bottom: 0; }
    #edl.active { flex: 1; min-height: 0; display: flex; flex-direction: column; overflow: hidden; }
    #edl.active .edl-workspace { flex: 1; min-height: 0; }
    #edl.active .edl-stage-cards { flex-shrink: 0; }


/* ── Multi-page top nav ──────────────────────────────────────────────────── */
.top-nav {
  display: flex;
  align-items: center;
  gap: 14px;
  padding: 0 24px;
  height: 56px;
  background: rgba(255,255,255,.92);
  backdrop-filter: blur(16px);
  border-bottom: 1px solid var(--line);
  position: sticky;
  top: 0;
  z-index: 50;
}

.top-nav .brand {
  display: flex;
  align-items: center;
  gap: 10px;
  font-weight: 700;
  font-size: 15px;
  letter-spacing: -.01em;
  color: var(--ink);
  text-decoration: none;
  margin-bottom: 0;
}

.top-nav .logo {
  width: 34px;
  height: 34px;
  border-radius: 50%;
  color: white;
  background:
    radial-gradient(circle at 34% 28%, rgba(255,255,255,.40), transparent 24%),
    conic-gradient(from 215deg, #FBBF24, #93C5FD, var(--brand), #1E3A8A, #FBBF24);
  display: grid;
  place-items: center;
  box-shadow: 0 6px 16px rgba(37,99,235,.22);
  flex: 0 0 auto;
}

.top-nav .logo-core {
  width: 24px;
  height: 24px;
  border-radius: 50%;
  display: grid;
  place-items: center;
  background: linear-gradient(135deg, #006aff, #0a3d91);
}

.top-nav .logo svg {
  width: 16px;
  height: 16px;
  stroke: white;
  fill: none;
  stroke-width: 2;
  stroke-linecap: round;
  stroke-linejoin: round;
}

/* Page body wrapper for multi-page */
.page-body {
  min-height: calc(100vh - 56px);
  background: var(--bg);
}

/* Screen active override for multi-page (each page shows its content directly) */
.page-content {
  padding: 22px 28px 52px;
  max-width: 1380px;
  margin: 0 auto;
}

/* Home page overrides */
body.home-page .page-content {
  max-width: none;
  padding: 0;
}

/* Scan/save/build animation pages */
body.scan-page .page-body,
body.saving-page .page-body,
body.building-page .page-body {
  background: #ffffff;
  display: grid;
  justify-items: center;
  align-items: start;
  padding: 0 28px 28px;
  min-height: calc(100vh - 56px);
}

/* Form pages (plan, account, property) */
body.form-page .page-body {
  background: var(--bg);
}

/* Categories page */
body.categories-page .page-body {
  display: flex;
  flex-direction: column;
  height: calc(100vh - 56px);
  overflow: hidden;
  padding: 0 70px;
}

/* EDL page */
body.edl-page {
  overflow: hidden;
}

body.edl-page .page-body {
  height: calc(100vh - 56px);
  overflow: hidden;
  display: flex;
  flex-direction: column;
}

body.edl-page .page-content {
  flex: 1;
  min-height: 0;
  display: flex;
  flex-direction: column;
  overflow: hidden;
  padding-bottom: 0;
}

/* Remove .app context-based overrides — replace with direct body class context */
body.flow-page h1 {
  max-width: 620px;
  font-size: 32px;
  line-height: 1.06;
  margin: 10px 0 8px;
  color: var(--ink);
  font-weight: 700;
  letter-spacing: -.025em;
}

/* ── Multi-page body-class equivalents for .app.home-view ──────────────── */
body.home-page .page-body { display: block; min-height: 0; }

/* Hero layout on the home page */
body.home-page .hero {
  min-height: 700px;
  height: 700px;
  grid-template-columns: minmax(420px, .78fr) minmax(560px, 1.22fr);
  gap: 22px;
  padding: 44px 44px 36px;
  overflow: hidden;
  align-items: start;
  position: relative;
  background:
    radial-gradient(circle at 72% 20%, rgba(255, 255, 255, .18), transparent 34%),
    linear-gradient(105deg, rgba(10, 20, 46, .94), rgba(10, 20, 46, .74)),
    url("https://images.unsplash.com/photo-1560518883-ce09059eeffa?auto=format&fit=crop&w=1800&q=85") center/cover;
}

body.home-page .hero-panel {
  min-height: auto;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
  padding: 0;
  justify-content: start;
  gap: 14px;
  color: white;
}

body.home-page .hero-panel h1 {
  max-width: 760px;
  font-size: clamp(42px, 4.2vw, 60px);
  margin-bottom: 12px;
  color: white;
}

body.home-page .hero-panel p { color: rgba(255, 255, 255, .82); }

body.home-page .hero-panel .checks li {
  color: #ffffff;
  text-shadow: 0 1px 16px rgba(0, 0, 0, .28);
}

body.home-page .hero-panel .checks {
  gap: 8px;
  margin-top: 12px;
}

body.home-page .hero-panel .checks li {
  font-size: 14px;
  line-height: 1.2;
}

body.home-page .hero-panel .check {
  width: 20px;
  height: 20px;
  font-size: 12px;
}

/* ── Multi-page body-class equivalents for .app:not(.home-view) ─────────── */
body.flow-page h1,
body.flow-page .page-content h1 {
  max-width: 620px;
  font-size: 32px;
  line-height: 1.06;
  margin: 10px 0 8px;
  color: var(--ink);
  font-weight: 700;
  letter-spacing: -.025em;
}

body.flow-page h2,
body.flow-page .page-content h2 {
  font-size: 18px;
  line-height: 1.2;
  margin-bottom: 6px;
  color: var(--ink);
}

body.flow-page h3,
body.flow-page .page-content h3 {
  font-size: 14px;
}

body.flow-page .lead,
body.flow-page .page-content .lead {
  max-width: 700px;
  font-size: 14px;
  line-height: 1.45;
}

body.flow-page .eyebrow,
body.flow-page .page-content .eyebrow {
  padding: 4px 9px;
  font-size: 11px;
  font-weight: 700;
}

body.flow-page .card,
body.flow-page .workspace-panel,
body.flow-page .metric,
body.flow-page .dashboard-category {
  box-shadow: none;
}

body.flow-page .workspace-title {
  align-items: center;
  margin-bottom: 12px;
}

body.flow-page .workspace-title h1 { max-width: none; }
body.flow-page .workspace-title p  { margin-bottom: 0; }

body.flow-page .panel-head { padding: 12px 14px; }
body.flow-page .panel-head p { margin-bottom: 0; font-size: 12px; }
body.flow-page .panel-body  { padding: 10px; }

body.flow-page .paper { min-height: 200px; padding: 20px 24px; }

/* ── Scan / saving / building page centering ─────────────────────────────── */
body.scan-page .page-body,
body.saving-page .page-body,
body.building-page .page-body {
  display: grid;
  justify-items: center;
  align-items: start;
  padding: 0 28px 28px;
  background: #ffffff;
}

/* ── EDL page full-height layout ────────────────────────────────────────── */
body.edl-page {
  overflow: hidden;
  height: 100vh;
  display: flex;
  flex-direction: column;
}

body.edl-page .page-body {
  flex: 1;
  min-height: 0;
  display: flex;
  flex-direction: column;
  overflow: hidden;
}

body.edl-page .page-content {
  flex: 1;
  min-height: 0;
  display: flex;
  flex-direction: column;
  overflow: hidden;
  padding: 16px 20px 0;
}

body.edl-page .edl-workspace {
  flex: 1;
  min-height: 0;
}

body.edl-page h1 {
  max-width: none;
  font-size: 22px;
  margin: 4px 0 4px;
  color: var(--ink);
}

body.edl-page .lead {
  font-size: 13px;
  margin-bottom: 0;
  white-space: nowrap;
}

body.edl-page .workspace-title {
  align-items: center;
  margin-bottom: 10px;
  flex-shrink: 0;
}

/* ── Categories page layout ─────────────────────────────────────────────── */
body.categories-page {
  overflow: hidden;
  height: 100vh;
  display: flex;
  flex-direction: column;
}

body.categories-page .page-body {
  flex: 1;
  min-height: 0;
  display: flex;
  flex-direction: column;
  overflow: hidden;
  padding: 0 70px;
}

body.categories-page .categories-scroll-area {
  flex: 1;
  min-height: 0;
  overflow-y: auto;
  padding-bottom: 12px;
}

body.categories-page h1 {
  font-size: 28px;
  margin: 8px 0 6px;
  max-width: none;
}

body.categories-page .lead { font-size: 14px; }

/* ── Responsive overrides for multi-page ────────────────────────────────── */
@media (max-width: 1040px) {
  body.home-page .hero {
    grid-template-columns: 1fr;
    height: auto;
    min-height: 100vh;
    padding: 14px;
    overflow: visible;
  }
  body.home-page .hero-side { justify-items: center; padding-bottom: 88px; }
}

@media (max-width: 680px) {
  body.home-page .hero { padding: 14px; }
  body.home-page .hero-panel { padding: 26px 12px; }
  body.home-page .hero-product-shot { width: 100%; height: auto; max-height: 420px; object-fit: contain; }
  body.categories-page .page-body { padding: 0 14px; }
}