:root {
      color-scheme: light;
      --bg: #f4f7ff;
      --bg-strong: #e7eefc;
      --ink: #101828;
      --muted: #667085;
      --soft: #e2e8f0;
      --surface: #ffffff;
      --surface-glass: rgba(248,250,252,.92);
      --line: #cbd5e1;
      --primary: #2457d6;
      --primary-strong: #173ea5;
      --primary-soft: #e8efff;
      --green: #168651;
      --green-soft: #e8f8ef;
      --purple: #7c3aed;
      --purple-soft: #f0eaff;
      --orange: #e26d21;
      --orange-soft: #fff1e6;
      --red: #c9362b;
      --red-soft: #fff0ee;
      --radius-sm: 12px;
      --radius-md: 16px;
      --radius-lg: 22px;
      --radius-xl: 28px;
      --shadow-card: 0 12px 26px rgba(15,23,42,.10);
      --shadow-float: 0 24px 70px rgba(16,24,40,.20);
      --font: "Inter", system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
      --sidebar: 292px;
      --topbar: 68px;
      --bottom: 78px;
      --safe-bottom: env(safe-area-inset-bottom);
    }

    * { box-sizing: border-box; }
    html { min-height: 100%; background: var(--bg); overflow-x: hidden; }
    body {
      margin: 0;
      min-height: 100vh;
      font-family: var(--font);
      background: radial-gradient(circle at top right, rgba(36,87,214,.18), transparent 32%), var(--bg);
      color: var(--ink);
      font-size: 14px;
      line-height: 1.45;
      overflow-x: hidden;
    }

    button, input { font: inherit; }
    button { border: 0; cursor: pointer; }
    a { color: inherit; }
    .material-symbols-outlined { font-size: 22px; line-height: 1; font-variation-settings: "FILL" 0, "wght" 350, "GRAD" 0, "opsz" 24; }
    .is-hidden { display: none !important; }
    [hidden], .user-menu[hidden] { display: none !important; }

    html, body, .app-shell, .app-main, .content, .view, .panel { max-width: 100%; }
    .app-main, .content, .view, .panel, .page-head, .hero-strip, .grid-2, .kpi-grid, .data-list, .data-row { min-width: 0; }
    h1, h2, h3, p, strong, span { overflow-wrap: anywhere; }

    :focus-visible { outline: 3px solid rgba(36,87,214,.45); outline-offset: 3px; }
    #mainContent:focus-visible { outline: none; }

    .skip-link { position: fixed; left: 16px; top: 16px; z-index: 1000; transform: translateY(-150%); padding: 10px 14px; border-radius: 14px; background: #fff; box-shadow: var(--shadow-card); text-decoration: none; font-weight: 600; }
    .skip-link:focus { transform: translateY(0); }

    .auth-screen { min-height: 100vh; display: grid; place-items: center; padding: 18px; background: linear-gradient(145deg, #d9e6ff, #edf4ff 48%, #f9fbff); }
    .auth-shell { width: min(100%, 980px); min-height: min(720px, calc(100vh - 36px)); display: grid; grid-template-columns: minmax(0, 1fr) 420px; overflow: hidden; border-radius: 32px; background: var(--surface); box-shadow: var(--shadow-float); }
    .auth-hero { position: relative; padding: 56px; display: flex; flex-direction: column; justify-content: space-between; color: #fff; background: radial-gradient(circle at 82% 12%, rgba(92,158,255,.40), transparent 24%), radial-gradient(circle at 16% 84%, rgba(76,205,177,.18), transparent 28%), linear-gradient(135deg, #09142e, #112b6b 56%, #153d98); }
    .auth-hero::after { content: ""; position: absolute; inset: 0; opacity: .20; background-image: linear-gradient(rgba(255,255,255,.45) 1px, transparent 1px), linear-gradient(90deg, rgba(255,255,255,.45) 1px, transparent 1px); background-size: 44px 44px; mask-image: linear-gradient(120deg, #000, transparent 70%); }
    .brand, .hero-copy, .hero-proof { position: relative; z-index: 1; }
    .brand { display: flex; align-items: center; gap: 12px; }
    .brand-mark { width: 42px; height: 42px; border-radius: 16px; display: grid; place-items: center; color: #fff; background: linear-gradient(135deg, #2f6fff, #50d6b4); font-weight: 800; letter-spacing: -.05em; box-shadow: 0 16px 32px rgba(0,0,0,.22); flex: 0 0 auto; }
    .brand strong { display: block; font-size: 16px; letter-spacing: -.03em; }
    .brand span { display: block; margin-top: 2px; color: rgba(255,255,255,.70); font-size: 12px; }
    .hero-copy h1 { max-width: 520px; margin: 0; font-size: clamp(38px, 6vw, 62px); line-height: .98; letter-spacing: -.06em; font-weight: 700; }
    .hero-copy p { max-width: 430px; margin: 18px 0 0; color: rgba(255,255,255,.78); font-size: 15px; }
    .hero-proof { display: grid; grid-template-columns: repeat(3, minmax(0,1fr)); gap: 12px; }
    .proof-card { padding: 14px; border: 1px solid rgba(255,255,255,.16); border-radius: 18px; background: rgba(255,255,255,.09); backdrop-filter: blur(18px); }
    .proof-card strong { display: block; font-size: 20px; letter-spacing: -.04em; }
    .proof-card span { color: rgba(255,255,255,.70); font-size: 11px; }
    .auth-card { padding: 42px 34px; display: flex; flex-direction: column; justify-content: center; }
    .auth-card h2 { margin: 0 0 8px; font-size: 28px; line-height: 1.05; letter-spacing: -.05em; }
    .auth-card p { margin: 0 0 24px; color: var(--muted); }
    .tabs { display: grid; grid-template-columns: 1fr 1fr; gap: 3px; padding: 4px; margin-bottom: 22px; border-radius: 15px; background: #f1f4f9; border: 1px solid var(--line); }
    .tab-button { min-height: 40px; border-radius: 12px; color: var(--muted); background: transparent; font-weight: 600; }
    .tab-button.is-active { color: var(--ink); background: #fff; box-shadow: 0 4px 12px rgba(16,24,40,.08); }
    .auth-panel { display: none; }
    .auth-panel.is-active { display: block; }
    .field-grid { display: grid; gap: 10px; }
    .field label { display: block; margin-bottom: 7px; color: #475467; font-size: 12px; font-weight: 600; }
    .field input { width: 100%; min-height: 48px; padding: 0 14px; border-radius: 14px; border: 1px solid var(--line); background: #fff; color: var(--ink); outline: 0; box-shadow: 0 1px 2px rgba(16,24,40,.04); }
    .field input:focus { border-color: rgba(36,87,214,.65); box-shadow: 0 0 0 4px rgba(36,87,214,.10); }
    .field-help { display: block; margin-top: 6px; color: var(--muted); font-size: 12px; }
    .auth-row { display: flex; justify-content: space-between; align-items: center; gap: 10px; margin: 14px 0 20px; color: var(--muted); font-size: 12px; }
    .auth-row label { display: inline-flex; align-items: center; gap: 7px; }
    .link-button { padding: 0; color: var(--primary); background: transparent; font-weight: 700; }
    .button-stack { display: grid; gap: 12px; margin-top: 18px; }
    .button { min-height: 50px; padding: 0 16px; border-radius: 15px; display: inline-flex; align-items: center; justify-content: center; gap: 9px; background: var(--primary); color: #fff; font-weight: 700; box-shadow: 0 10px 24px rgba(36,87,214,.22); }
    .button.secondary { color: var(--ink); background: #fff; border: 1px solid var(--line); box-shadow: 0 8px 18px rgba(16,24,40,.06); }
    .button.ghost { color: var(--primary); background: var(--primary-soft); box-shadow: none; }
    .google-mark { width: 18px; height: 18px; border-radius: 50%; display: inline-grid; place-items: center; background: conic-gradient(from -45deg,#4285f4 0 25%,#34a853 0 50%,#fbbc05 0 75%,#ea4335 0 100%); color:#fff; font-size: 11px; font-weight: 800; }
    .separator { display: flex; align-items: center; gap: 10px; margin: 20px 0; color: var(--muted); font-size: 12px; }
    .separator::before, .separator::after { content: ""; height: 1px; background: var(--line); flex: 1; }
    .consent-box { display: none; margin-top: 10px; padding: 12px; border-radius: 14px; background: var(--soft); border: 1px solid var(--line); }
    .consent-box.is-visible { display: block; }
    .consent-box label { display: flex; gap: 8px; align-items: flex-start; margin: 0; color: #344054; font-size: 12px; font-weight: 500; }
    .consent-box input { min-height: auto; width: 16px; height: 16px; margin-top: 1px; accent-color: var(--primary); }
    .toast-stack { position: fixed; left: 50%; bottom: calc(18px + var(--safe-bottom)); z-index: 2000; width: min(390px, calc(100vw - 28px)); display: grid; gap: 8px; transform: translateX(-50%); pointer-events: none; }
    .sf-dialog { border: none; padding: 0; background: transparent; }
    .sf-dialog::backdrop { background: rgba(15,23,42,.45); backdrop-filter: blur(2px); }
    .sf-dialog__card { width: min(740px, calc(100vw - 24px)); max-height: min(90vh, 760px); border-radius: 28px; border: 1px solid #d9e2f4; background: #fffbff; box-shadow: var(--shadow-float); padding: 16px; display: grid; grid-template-rows: auto auto 1fr auto; gap: 10px; }
    .sf-dialog__header { display: flex; align-items: center; justify-content: space-between; gap: 8px; }
    .sf-dialog__header h2 { margin: 0; font-size: 22px; letter-spacing: -.03em; }
    .sf-dialog__subtitle { margin: 0; font-size: 12px; color: var(--muted); line-height: 1.35; }
    .sf-dialog__grid { display: grid; grid-template-columns: repeat(2, minmax(0,1fr)); gap: 12px; }
    .sf-dialog__grid .field { margin: 0; }
    .sf-dialog .field span { display: block; margin-bottom: 7px; color: #344054; font-size: 12px; font-weight: 700; letter-spacing: .01em; }
    .sf-dialog input, .sf-dialog select, .sf-dialog textarea { width: 100%; min-height: 52px; border-radius: 12px; border: 1px solid #c5c7d0; background: #fffbff; padding: 0 14px; color: var(--ink); }
    .sf-dialog textarea { min-height: 92px; padding: 12px 14px; resize: vertical; }
    .sf-dialog input:focus, .sf-dialog select:focus, .sf-dialog textarea:focus { border-color: #2457d6; box-shadow: 0 0 0 4px rgba(36,87,214,.12); outline: none; }
    .field--full { grid-column: 1 / -1; }
    .sf-dialog__actions { display: flex; justify-content: flex-end; gap: 10px; }
    .sf-dialog__list { border-top: 1px solid #dbe4f2; padding-top: 10px; display: grid; gap: 8px; }
    .sf-dialog__list-item { border: 1px solid #d7dfef; border-radius: 14px; padding: 10px; display: grid; gap: 6px; background: #fff; }
    .sf-dialog__list-head { display: flex; justify-content: space-between; gap: 10px; align-items: center; }
    .sf-dialog__list-actions { display: flex; gap: 6px; }
    .plan-tabs { display: flex; flex-wrap: nowrap; overflow-x: auto; align-items: center; gap: 8px 10px; border-bottom: 1px solid #e5e7eb; padding-bottom: 8px; }
    .plan-tab { min-height: auto; padding: 2px 0; border-radius: 0; background: transparent; color: #64748b; font-weight: 500; font-size: 13px; border: 0; text-decoration: none; white-space: nowrap; }
    .plan-tab:hover { color: #0f172a; text-decoration: underline; text-underline-offset: 3px; }
    .plan-tab.is-active { color: #0b3ea9; font-weight: 700; text-decoration: underline; text-underline-offset: 4px; }
    .plan-step { display: none; }
    .plan-step.is-active { display: block; }
    .plan-journey-body { min-height: 0; overflow-y: auto; padding-right: 2px; display: grid; align-content: start; gap: 8px; }
    .plan-actions { justify-content: space-between; flex-wrap: wrap; padding-top: 8px; border-top: 1px solid #e5e7eb; position: sticky; bottom: 0; background: #fffbff; }
    .is-hidden { display: none !important; }

    .button.mini { min-height: 34px; padding: 0 10px; border-radius: 10px; font-size: 12px; box-shadow: none; }
    .sf-product-table { width: 100%; border-collapse: collapse; }
    .sf-product-table th, .sf-product-table td { border-bottom: 1px solid #e2e8f0; padding: 10px; text-align: left; font-size: 12px; }
    @media (max-width: 760px) {
      .sf-product-table { display: none; }
      .sf-dialog__list { gap: 10px; }
      .sf-dialog__card { width: calc(100vw - 8px); border-radius: 16px; padding: 12px; max-height: 92vh; }
      .sf-dialog__grid { grid-template-columns: 1fr; }
    }
    .toast { min-height: 46px; padding: 12px 14px; border-radius: 16px; display: flex; align-items: center; justify-content: center; text-align: center; background: #fff; border: 1px solid var(--line); box-shadow: var(--shadow-card); color: var(--ink); font-weight: 600; pointer-events: auto; }
    .toast[data-type="success"] { color: var(--green); }
    .toast[data-type="error"] { color: var(--red); }
    .toast[data-type="info"] { color: var(--primary); }
    .toast--action { justify-content: space-between; gap: 10px; text-align: left; }

    .app-shell { min-height: 100vh; display: grid; grid-template-columns: var(--sidebar) minmax(0, 1fr); }
    .sidebar { position: sticky; top: 0; height: 100vh; padding: 22px; display: flex; flex-direction: column; gap: 22px; border-right: 1px solid var(--line); background: rgba(241,245,249,.92); backdrop-filter: blur(22px); }
    .sidebar .brand span { color: var(--muted); }
    .sidebar .brand-mark { box-shadow: none; }
    .nav-list { display: grid; gap: 8px; }
    .nav-link { min-height: 48px; padding: 0 14px; border-radius: 16px; display: flex; align-items: center; gap: 12px; text-align: left; color: #475467; background: transparent; font-weight: 600; text-decoration: none; }
    .nav-link.is-active { color: var(--primary-strong); background: var(--primary-soft); }
    .nav-link .badge { margin-left: auto; min-width: 24px; height: 24px; padding: 0 8px; border-radius: 999px; display: inline-flex; align-items: center; justify-content: center; background: rgba(36,87,214,.11); font-size: 11px; font-weight: 700; }
    .sidebar-card { margin-top: auto; padding: 16px; border-radius: 20px; background: linear-gradient(145deg, var(--primary-soft), #fff); border: 1px solid rgba(36,87,214,.14); }
    .sidebar-card strong { display: block; margin-bottom: 4px; }
    .sidebar-card p { margin: 0 0 12px; color: var(--muted); font-size: 12px; }
    .app-main { min-width: 0; display: grid; grid-template-rows: auto 1fr; }
    .topbar { position: sticky; top: 0; z-index: 50; min-height: calc(var(--topbar) + env(safe-area-inset-top)); padding: calc(env(safe-area-inset-top) + 14px) 24px 0; display: flex; align-items: center; gap: 10px; border-bottom: none; background: transparent; }
    .topbar-context { min-width: 0; flex: 1; display: grid; gap: 2px; padding-top: 0; }
    .topbar-context__eyebrow { margin: 0; font-size: 11px; letter-spacing: .11em; text-transform: uppercase; font-weight: 800; color: #64748b; }
    .topbar-context__title { margin: 0; font-size: 28px; line-height: 1.02; letter-spacing: -.03em; font-weight: 800; color: var(--ink); }
    .topbar-context__subtitle { margin: 0; color: var(--muted); font-size: 13px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
    .app-shell--with-sidebar .topbar { justify-content: space-between; }
    .icon-button { width: 44px; height: 44px; border-radius: 16px; display: grid; place-items: center; color: var(--ink); background: var(--surface-glass); border: 1px solid var(--line); }
    .user-avatar-button { padding: 0; overflow: hidden; background: linear-gradient(145deg, #eef3ff, #f9fbff); }
    .user-avatar-button__text { width: 100%; height: 100%; display: grid; place-items: center; font-size: 13px; font-weight: 800; letter-spacing: .02em; color: var(--primary-strong); }
    .user-avatar-button__image { width: 100%; height: 100%; object-fit: cover; display: block; }
    .user-menu-wrap { position: relative; }
    .user-menu { position: absolute; right: 0; top: calc(100% + 10px); width: min(246px, calc(100vw - 28px)); padding: 10px; display: grid; gap: 6px; border-radius: 20px; background: rgba(255,255,255,.98); border: 1px solid var(--line); box-shadow: var(--shadow-float); }
    .user-menu-header { padding: 10px; border-bottom: 1px solid var(--line); margin-bottom: 4px; }
    .user-menu-header strong { display: block; font-size: 14px; }
    .user-menu-header span { display: block; margin-top: 2px; color: var(--muted); font-size: 12px; overflow: hidden; text-overflow: ellipsis; }
    .menu-item { min-height: 42px; padding: 0 10px; border-radius: 14px; display: flex; align-items: center; gap: 10px; background: transparent; text-align: left; color: var(--ink); font-weight: 600; }
    .menu-item:hover { background: var(--soft); }
    .menu-item.danger { color: var(--red); }
    .settings-badge { display: inline-flex; margin-top: 8px; min-height: 24px; align-items: center; border-radius: 999px; padding: 0 10px; font-size: 11px; font-weight: 700; border: 1px solid var(--line); }
    .settings-badge--ok { color: var(--green); background: var(--green-soft); border-color: #c8edd9; }
    .settings-badge--pending { color: var(--orange); background: var(--orange-soft); border-color: #ffd8bd; }

    .content { width: 100%; max-width: 1220px; margin: 0 auto; padding: 28px clamp(14px, 4vw, 30px) 112px; overflow-x: hidden; }
    .view { display: none; }
    .view.is-active { display: block; }
    .page-head { display: flex; justify-content: space-between; align-items: flex-start; gap: 18px; margin-bottom: 22px; }
    .page-head--integrated { justify-content: flex-end; margin-bottom: 16px; }
    .eyebrow { margin: 0 0 6px; color: var(--muted); font-size: 12px; text-transform: uppercase; letter-spacing: .09em; font-weight: 800; }
    h1 { margin: 0; font-size: clamp(30px, 5vw, 48px); line-height: 1; letter-spacing: -.065em; }
    .lead { max-width: 660px; margin: 10px 0 0; color: var(--muted); font-size: 15px; }
    .hero-strip { display: grid; grid-template-columns: minmax(0, 1.2fr) minmax(280px, .8fr); gap: 18px; margin-bottom: 18px; }
    .panel { border-radius: var(--radius-xl); background: var(--surface-glass); border: 1px solid var(--line); box-shadow: var(--shadow-card); backdrop-filter: blur(20px); }
    .panel:hover { border-color: #94a3b8; }
    .welcome-panel { padding: 24px; display: grid; align-content: space-between; min-height: 218px; background: linear-gradient(135deg, #ffffff, #e2e8f0); }
    .welcome-panel h2 { margin: 0; max-width: 600px; font-size: clamp(24px, 4vw, 38px); line-height: 1.04; letter-spacing: -.055em; }
    .welcome-panel p { margin: 12px 0 0; max-width: 620px; color: var(--muted); }
    .quick-actions { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 22px; }
    .action-pill { min-height: 42px; padding: 0 14px; border-radius: 999px; display: inline-flex; align-items: center; gap: 8px; background: #fff; color: var(--ink); border: 1px solid var(--line); font-weight: 700; box-shadow: 0 6px 14px rgba(16,24,40,.05); }
    .license-panel { padding: 16px; background: linear-gradient(160deg, #2f4f94, #3f71ca); color: #fff; }
    .license-panel span { color: rgba(255,255,255,.70); font-size: 12px; text-transform: uppercase; letter-spacing: .08em; font-weight: 800; }
    .license-panel strong { display: block; margin-top: 8px; font-size: 30px; letter-spacing: -.05em; }
    .license-panel p { color: rgba(255,255,255,.75); margin: 10px 0 12px; }
    .license-panel__cta { min-height: 42px; margin-bottom: 14px; background: #fff; color: #1e3a8a; border: 1px solid rgba(255,255,255,.5); }
    .license-panel__cta:hover { background: #f8fbff; }
    .meter { height: 10px; border-radius: 999px; overflow: hidden; background: rgba(255,255,255,.28); }
    .meter > i { display: block; width: 68%; height: 100%; border-radius: inherit; background: #56e0b9; }

    .kpi-grid { display: grid; grid-template-columns: repeat(4, minmax(0,1fr)); gap: 10px; margin-bottom: 18px; }
    .kpi-card { min-height: 92px; padding: 12px; border-radius: 18px; border: 1px solid var(--line); background: #fff; box-shadow: 0 8px 20px rgba(16,24,40,.05); display: grid; align-content: space-between; text-align: left; }
    .kpi-card:hover { transform: translateY(-1px); box-shadow: 0 10px 24px rgba(16,24,40,.09); }
    .kpi-top { display: flex; justify-content: flex-start; align-items: center; gap: 8px; }
    .kpi-icon { width: 32px; height: 32px; border-radius: 12px; display: grid; place-items: center; flex: 0 0 auto; }
    .kpi-title-inline { min-width: 0; margin: 0; color: #344054; font-size: 11px; line-height: 1.15; font-weight: 650; letter-spacing: -.02em; }
    .kpi-delta { display: none; }
    .kpi-card > p:not(.kpi-title-inline) { display: none; }
    .kpi-card strong { display: block; margin-top: 8px; font-size: 25px; line-height: 1; letter-spacing: -.055em; }
    .tone-blue { background: #edf4ff; border-color: #d5e3ff; } .tone-blue .kpi-icon { background: #dbe8ff; color: var(--primary); }
    .tone-green { background: var(--green-soft); border-color: #c8edd9; } .tone-green .kpi-icon { background: #d5f5e4; color: var(--green); }
    .tone-purple { background: var(--purple-soft); border-color: #e1d3ff; } .tone-purple .kpi-icon { background: #e6dcff; color: var(--purple); }
    .tone-orange { background: var(--orange-soft); border-color: #ffd8bd; } .tone-orange .kpi-icon { background: #ffe2ce; color: var(--orange); }

    .grid-2 { display: grid; grid-template-columns: minmax(0, 1fr) 360px; gap: 18px; }
    .section-card { padding: 18px; }
    .grid-2, .section-card, .list, .item, .item-main { min-width: 0; max-width: 100%; }
    .section-title { display: flex; justify-content: space-between; align-items: center; gap: 12px; margin-bottom: 14px; }
    .section-title h2 { margin: 0; font-size: 18px; letter-spacing: -.04em; }
    .section-title span, .muted { color: var(--muted); font-size: 12px; }
    .list { display: grid; gap: 10px; }
    .item { width: 100%; padding: 12px; border-radius: 17px; display: flex; align-items: center; gap: 10px; background: #fff; border: 1px solid var(--line); overflow: hidden; }
    .avatar { width: 38px; height: 38px; border-radius: 14px; display: grid; place-items: center; flex: 0 0 38px; color: var(--primary); background: var(--primary-soft); font-weight: 800; }
    .item-main { min-width: 0; flex: 1; }
    .item-main strong { display: block; max-width: 100%; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
    .item-main span { display: block; margin-top: 2px; color: var(--muted); font-size: 12px; max-width: 100%; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
    .chip { min-height: 28px; padding: 0 10px; border-radius: 999px; display: inline-flex; align-items: center; justify-content: center; background: var(--soft); color: #475467; border: 1px solid var(--line); font-size: 11px; font-weight: 700; white-space: nowrap; }
    .item .chip { max-width: 108px; min-width: 0; flex: 0 1 auto; overflow: hidden; text-overflow: ellipsis; }
    .chip.green { color: var(--green); background: var(--green-soft); border-color: #c8edd9; }
    .chip.orange { color: var(--orange); background: var(--orange-soft); border-color: #ffd8bd; }
    .chip.blue { color: var(--primary); background: var(--primary-soft); border-color: #d5e3ff; }
    .chip.red { color: var(--red); background: var(--red-soft); border-color: #ffd1cc; }
    .chip.purple { color: var(--purple); background: var(--purple-soft); border-color: #e1d3ff; }
    .timeline { position: relative; display: grid; gap: 10px; }
    .timeline-item { display: grid; grid-template-columns: 32px minmax(0,1fr); gap: 10px; }
    .dot { width: 32px; height: 32px; border-radius: 50%; display: grid; place-items: center; color: var(--primary); background: var(--primary-soft); }
    .timeline-item strong { display: block; font-size: 13px; }
    .timeline-item span { color: var(--muted); font-size: 12px; }
    .table-card { overflow: hidden; }
    .table-toolbar { padding: 18px; display: flex; justify-content: space-between; align-items: center; gap: 12px; border-bottom: 1px solid var(--line); }
    .table-toolbar__actions { display: inline-flex; align-items: center; gap: 10px; }
    .button--toolbar { min-height: 40px; padding: 0 14px; border-radius: 14px; box-shadow: none; }
    .table-toolbar h2 { margin: 0; font-size: 18px; letter-spacing: -.04em; }
    .search-box { min-width: 240px; min-height: 40px; padding: 0 12px; border-radius: 14px; border: 1px solid var(--line); background: #fff; }
    .data-list { display: grid; }
    .data-row { padding: 14px 18px; display: grid; grid-template-columns: minmax(180px,1.2fr) minmax(130px,.8fr) minmax(110px,.55fr) auto; gap: 10px; align-items: center; border-bottom: 1px solid var(--line); background: rgba(255,255,255,.62); }
    .data-row:last-child { border-bottom: 0; }
    .data-row--empty { grid-template-columns: 1fr; }
    .data-row--empty small, .data-row--empty .chip, .data-row--empty button { display: none; }
    .data-row small { display: block; color: var(--muted); margin-top: 2px; }
    .more-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
    .settings-card { padding: 18px; min-height: 146px; display: flex; flex-direction: column; justify-content: space-between; }
    .settings-card .material-symbols-outlined { width: 42px; height: 42px; border-radius: 16px; display: grid; place-items: center; background: var(--primary-soft); color: var(--primary); }
    .settings-card h3 { margin: 14px 0 4px; font-size: 16px; letter-spacing: -.03em; }
    .settings-card p { margin: 0; color: #475569; font-size: 12px; }
    .bottom-nav { display: none; }


    .home-layout { display: grid; gap: 18px; }
    .home-main { min-width: 0; }
    .home-side { display: none; }
    .side-stack { display: grid; gap: 12px; }
    .side-card { padding: 16px; }
    .side-card h3 { margin: 0 0 10px; font-size: 16px; letter-spacing: -.03em; }
    .side-chip-list { display: flex; flex-wrap: wrap; gap: 8px; }
    .filter-chip { min-height: 32px; padding: 0 10px; border-radius: 999px; border: 1px solid var(--line); background: #fff; color: #344054; font-size: 12px; font-weight: 700; }
    .quick-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }
    .quick-btn { min-height: 38px; border-radius: 12px; border: 1px solid var(--line); background: var(--soft); color: var(--ink); font-weight: 700; }
    .summary-list { margin: 0; padding-left: 18px; color: var(--muted); font-size: 12px; display: grid; gap: 6px; }

    @media (min-width: 1600px) {
      .content { max-width: 1520px; }
      .home-layout { grid-template-columns: minmax(0, 1fr) 300px; align-items: start; }
      .home-side { display: block; position: sticky; top: calc(var(--topbar) + 18px); }
    }

    @media (max-width: 980px) {
      .auth-screen { padding: 0; }
      .auth-shell { width: 100%; min-height: 100vh; grid-template-columns: 1fr; border-radius: 0; }
      .auth-hero { min-height: 300px; padding: max(38px, env(safe-area-inset-top)) 24px 34px; justify-content: flex-end; gap: 38px; }
      .hero-proof { display: none; }
      .hero-copy h1 { font-size: 38px; }
      .auth-card { padding: 26px 20px calc(32px + env(safe-area-inset-bottom)); border-radius: 28px 28px 0 0; margin-top: -28px; background: #fff; z-index: 2; }
      .app-shell { display: block; }
      .sidebar { display: none; }
      .topbar { display: none; }
      .content { width: 100%; padding: 16px 14px calc(var(--bottom) + var(--safe-bottom) + 22px); overflow-x: hidden; }
      .page-head, .welcome-panel, .license-panel, .section-card, .table-card, .settings-card { max-width: 100%; }
      .welcome-panel h2, .page-head h1 { max-width: 100%; }
      .hero-strip, .grid-2 { grid-template-columns: 1fr; }
      .kpi-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
      .data-row { grid-template-columns: 1fr auto; gap: 8px; }
      .data-row > :nth-child(2), .data-row > :nth-child(3) { display: none; }
      .more-grid { grid-template-columns: 1fr; }
      .bottom-nav { position: fixed; left: 0; right: 0; bottom: 0; z-index: 80; height: calc(var(--bottom) + var(--safe-bottom)); padding: 8px 10px calc(8px + var(--safe-bottom)); display: grid; grid-template-columns: repeat(5, minmax(0,1fr)); gap: 4px; border-top: 1px solid var(--line); background: rgba(255,255,255,.96); box-shadow: 0 -10px 28px rgba(16,24,40,.08); backdrop-filter: blur(22px); }
      .bottom-nav .nav-link { min-height: 58px; padding: 0; border-radius: 18px; flex-direction: column; justify-content: center; gap: 4px; font-size: 11px; color: #667085; font-weight: 600; letter-spacing: -.02em; }
      .bottom-nav .nav-link .material-symbols-outlined { font-size: 24px; font-variation-settings: "FILL" 0, "wght" 350, "GRAD" 0, "opsz" 24; }
      .bottom-nav .nav-link span:not(.material-symbols-outlined):not(.badge) { font-size: 10.5px; font-weight: 600; }
      .bottom-nav .badge { display: none; }
      .bottom-nav .nav-link[data-view-target="home"] { color: #2457d6; }
      .bottom-nav .nav-link[data-view-target="quotes"] { color: #168651; }
      .bottom-nav .nav-link[data-view-target="policies"] { color: #7c3aed; }
      .bottom-nav .nav-link[data-view-target="clients"] { color: #e26d21; }
      .bottom-nav .nav-link[data-view-target="more"] { color: #475467; }
      .bottom-nav .nav-link.is-active[data-view-target="home"] { background: #e8efff; }
      .bottom-nav .nav-link.is-active[data-view-target="quotes"] { background: #e8f8ef; }
      .bottom-nav .nav-link.is-active[data-view-target="policies"] { background: #f0eaff; }
      .bottom-nav .nav-link.is-active[data-view-target="clients"] { background: #fff1e6; }
      .bottom-nav .nav-link.is-active[data-view-target="more"] { background: #eef2f6; }
    }

    @media (min-width: 720px) {
      .kpi-card { min-height: 108px; padding: 15px; }
      .kpi-card strong { font-size: 30px; }
      .kpi-title-inline { font-size: 12px; }
    }

    @media (max-width: 420px) {
      .kpi-grid { gap: 10px; }
      .grid-2 { gap: 12px; }
      .kpi-card { min-height: 92px; padding: 12px; border-radius: 18px; }
      .kpi-card strong { font-size: 25px; }
      .welcome-panel, .section-card { padding: 14px; border-radius: 22px; }
      .section-title { margin-bottom: 10px; }
      .item { padding: 12px; display: grid; grid-template-columns: 38px minmax(0, 1fr); align-items: center; flex-wrap: wrap; }
      .item .chip { margin-left: 48px; max-width: calc(100% - 48px); }
      .page-head { display: block; }
      .page-head .button { margin-top: 14px; width: 100%; }
      .search-box { min-width: 0; width: 100%; }
      .table-toolbar { align-items: stretch; flex-direction: column; }
      .table-toolbar__actions { width: 100%; display: grid; grid-template-columns: 1fr; }
      .button--toolbar { width: 100%; justify-content: center; }
    }

    @media (max-width: 360px) {
      .content { padding-left: 10px; padding-right: 10px; }
      .kpi-grid { gap: 8px; }
      .kpi-card { padding: 10px; min-height: 88px; }
      .kpi-icon { width: 28px; height: 28px; border-radius: 10px; }
      .kpi-title-inline { font-size: 10px; }
      .kpi-card strong { font-size: 23px; }
    }

    @media (prefers-reduced-motion: reduce) { *, *::before, *::after { transition: none !important; animation: none !important; scroll-behavior: auto !important; } }

#planJourneyForm { gap: 8px; }
#planJourneyForm .sf-dialog__header { padding-bottom: 2px; }
#planJourneyForm .plan-tabs { padding-bottom: 6px; margin-bottom: 0; }
#planJourneyForm .plan-journey-body { min-height: 0; overflow-y: auto; padding-right: 2px; display: grid; align-content: start; gap: 8px; }
#planJourneyForm .plan-actions { display: flex; align-items: center; justify-content: space-between; gap: 12px; flex-wrap: wrap; padding-top: 8px; border-top: 1px solid #e5e7eb; position: sticky; bottom: 0; background: #fffbff; }
#planJourneyForm .plan-actions__left,
#planJourneyForm .plan-actions__right { display: inline-flex; align-items: center; gap: 10px; }
#planJourneyForm .plan-actions__right { margin-left: auto; }
#planJourneyForm .field--button-align { display: flex; flex-direction: column; justify-content: flex-end; }
#planJourneyForm .field--button-align .button { min-height: 52px; }
@media (max-width: 560px) {
  #planJourneyForm .plan-actions { align-items: stretch; }
  #planJourneyForm .plan-actions__left,
  #planJourneyForm .plan-actions__right { width: 100%; }
  #planJourneyForm .plan-actions__right { justify-content: flex-end; flex-wrap: wrap; }
  #planJourneyForm .plan-actions .button { min-height: 46px; }
}

#planJourneyForm { width: min(960px, calc(100vw - 24px)); max-height: min(92vh, 780px); display: grid; grid-template-rows: auto auto minmax(0, 1fr) auto; }
#planJourneyForm .plan-journey-body { min-height: 0; overflow-y: auto; align-content: start; }
#planJourneyForm .plan-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; }
#planJourneyForm .span-1 { grid-column: span 1; }
#planJourneyForm .span-2 { grid-column: span 2; }
#planJourneyForm .span-3, #planJourneyForm .span-full { grid-column: 1 / -1; }
#planJourneyForm .payload-preview { margin: 0; max-height: 180px; overflow: auto; background: #0f172a; color: #e2e8f0; padding: 10px; border-radius: 10px; font-size: 12px; }
#planJourneyForm .payload-tabs { display: flex; flex-wrap: wrap; gap: 8px; }
@media (max-width: 1024px) { #planJourneyForm .plan-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
@media (max-width: 900px) { #planJourneyForm { width: 90vw; } #planJourneyForm .plan-grid { grid-template-columns: repeat(2, minmax(0,1fr)); } #planJourneyForm .span-2, #planJourneyForm .span-3, #planJourneyForm .span-full { grid-column: 1 / -1; } }
@media (max-width: 560px) { #planJourneyForm { width: calc(100vw - 8px); } #planJourneyForm .plan-grid { grid-template-columns: 1fr; } #planJourneyForm .span-1, #planJourneyForm .span-2, #planJourneyForm .span-3, #planJourneyForm .span-full { grid-column: 1 / -1; } }

.plan-review-flat { display:grid; gap:0; border:1px solid #e5e7eb; border-radius:18px; background:rgba(255,255,255,.55); overflow:hidden; }
.plan-review-section { padding:12px 14px; border-bottom:1px solid #edf0f5; }
.plan-review-section:last-child { border-bottom:0; }
.plan-review-section__header { display:flex; align-items:center; gap:8px; margin-bottom:8px; }
.plan-review-section__header .material-symbols-outlined { font-size:18px; color: var(--primary); }
.plan-review-section__header h3 { margin:0; font-size:13px; font-weight:800; letter-spacing:-.02em; }
.plan-review-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:8px 14px; margin:0; }
.plan-review-grid div { min-width:0; }
.plan-review-grid dt { margin:0 0 2px; color:var(--muted); font-size:10.5px; font-weight:700; text-transform:uppercase; letter-spacing:.04em; }
.plan-review-grid dd { margin:0; color:var(--ink); font-size:12.5px; font-weight:600; line-height:1.25; overflow-wrap:anywhere; }
.plan-review-value-highlight dd { font-size:16px; color: var(--primary-strong); font-weight:800; }
.payload-panel { margin-top:10px; border-top:1px solid #e5e7eb; padding-top:10px; }
.payload-panel__header { display:flex; justify-content:space-between; gap:12px; align-items:baseline; margin-bottom:8px; }
.payload-panel__header strong { font-size:12px; }
.payload-panel__header span { color:var(--muted); font-size:11px; }
@media (max-width:760px){ .plan-review-grid { grid-template-columns:repeat(2,minmax(0,1fr)); } }
@media (max-width:520px){ .plan-review-grid { grid-template-columns:1fr; } }

.field-with-action { min-width: 0; }
.field-control-row { display:grid; grid-template-columns:minmax(0,1fr) auto; gap:8px; align-items:center; }
.field-control-row select { min-width:0; }
.field-control-row .button.mini { min-height:42px; white-space:nowrap; }
@media (max-width:520px){ .field-control-row { grid-template-columns:1fr; } .field-control-row .button.mini { width:100%; } }
.lookup-field{position:relative;min-width:0}.lookup-trigger{width:100%;min-height:52px;display:flex;align-items:center;justify-content:space-between;gap:10px;border-radius:12px;border:1px solid #c5c7d0;background:#fffbff;color:var(--ink);padding:0 12px 0 14px;text-align:left;font-weight:500}.lookup-trigger__label{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.lookup-popover{position:absolute;z-index:2200;top:calc(100% + 6px);left:0;right:0;border-radius:18px;border:1px solid #d7dfef;background:#fffbff;box-shadow:0 18px 45px rgba(16,24,40,.18);overflow:hidden}.lookup-search{display:grid;grid-template-columns:auto minmax(0,1fr);align-items:center;gap:8px;padding:10px;border-bottom:1px solid #edf0f5}.lookup-search input{min-height:40px;border:0;box-shadow:none;padding:0;background:transparent}.lookup-list{max-height:220px;overflow-y:auto;display:grid;padding:6px;gap:4px}.lookup-option{width:100%;min-height:44px;padding:8px 10px;border-radius:12px;display:grid;gap:2px;background:transparent;text-align:left;color:var(--ink);border:0}.lookup-option:hover,.lookup-option.is-active{background:var(--primary-soft)}.lookup-option small{color:var(--muted);font-size:11px}.lookup-empty{padding:16px 10px;color:var(--muted);text-align:center;font-size:12px}.lookup-footer{min-height:46px;padding:8px 10px;border-top:1px solid #edf0f5;display:flex;align-items:center;justify-content:space-between;gap:10px}.lookup-footer span{color:var(--muted);font-size:11px;font-weight:700}
@media (max-width:560px){.lookup-popover{position:fixed;left:12px;right:12px;top:auto;bottom:calc(12px + env(safe-area-inset-bottom));max-height:70vh}.lookup-list{max-height:46vh}}
.dependency-notice{position:fixed;z-index:3000;left:50%;top:calc(24px + env(safe-area-inset-top));width:min(560px,calc(100vw - 24px));transform:translateX(-50%);border-radius:20px;border:1px solid #d7dfef;background:rgba(255,255,255,.96);box-shadow:0 22px 70px rgba(16,24,40,.24);padding:14px;display:grid;gap:12px}.dependency-notice strong{display:block;font-size:14px;letter-spacing:-.02em}.dependency-notice p{margin:4px 0 0;color:var(--muted);font-size:12px}.dependency-notice__actions{display:flex;justify-content:flex-end;flex-wrap:wrap;gap:8px}
@media (max-width:560px){.dependency-notice{top:auto;bottom:calc(16px + env(safe-area-inset-bottom));}.dependency-notice__actions{display:grid}}
.sf-dialog--wizard .sf-dialog__card{width:min(920px,calc(100vw - 24px));max-height:min(92vh,780px)}
.lead-progress{height:6px;background:#e7ecf6;border-radius:999px;overflow:hidden}.lead-progress__bar{height:100%;width:0;background:#2457d6;transition:width .25s}
.lead-wizard__steps{display:grid;gap:10px;overflow:auto;min-height:360px}
.lead-step{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.lead-step h3{grid-column:1/-1;margin:0}
.lead-step.is-hidden{display:none}
.lead-wizard__actions{position:sticky;bottom:0;background:#fffbff}
@media (max-width:700px){.lead-step{grid-template-columns:1fr}.lead-wizard__actions{display:grid;grid-template-columns:1fr 1fr;gap:8px}.lead-wizard__actions .button{width:100%}}