:root {
  --bg: #f4f6f8;
  --surface: #ffffff;
  --surface-subtle: #f8f9fb;
  --surface-hover: #f2f4f7;
  --ink: #17211b;
  --ink-soft: #4f5d55;
  --muted: #7d8a82;
  --line: #e3e8e5;
  --line-strong: #d7ddd9;
  --green: #1f7a4d;
  --green-2: #36a66b;
  --green-soft: #eaf6ef;
  --lime-soft: #eff8df;
  --orange: #c86b2b;
  --orange-soft: #fff1e5;
  --red: #bb4141;
  --red-soft: #fcebec;
  --purple: #6850a5;
  --purple-soft: #eeeafb;
  --blue: #326eb7;
  --blue-soft: #eaf1fb;
  --shadow-sm: 0 1px 2px rgba(19, 39, 27, 0.04), 0 1px 5px rgba(19, 39, 27, 0.025);
  --shadow-lg: 0 20px 60px rgba(28, 43, 34, 0.16), 0 4px 16px rgba(28, 43, 34, 0.08);
  --radius: 12px;
  --sidebar-width: 242px;
}

* { box-sizing: border-box; }

html, body { min-height: 100%; }

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

body.sidebar-collapsed { --sidebar-width: 76px; }

button, input, select { font: inherit; }
button { color: inherit; }

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

.sidebar {
  position: fixed;
  inset: 0 auto 0 0;
  z-index: 20;
  width: var(--sidebar-width);
  display: flex;
  flex-direction: column;
  padding: 22px 14px 14px;
  background: #fbfcfb;
  border-right: 1px solid var(--line);
  transition: width .22s ease, transform .2s ease;
}

.brand { display: flex; align-items: center; gap: 10px; padding: 0 9px 22px; }
.brand-mark { width: 32px; height: 32px; color: var(--green); }
.brand-mark svg { width: 100%; height: 100%; display: block; }
.brand-name { font-size: 20px; font-weight: 720; letter-spacing: -0.5px; line-height: 20px; }
.brand-by { margin-top: 3px; color: var(--muted); font-size: 8px; font-weight: 700; letter-spacing: 1.5px; }
.collapse-btn { width: 24px; height: 24px; display: grid; place-items: center; position: absolute; right: -12px; top: 26px; z-index: 2; border: 1px solid var(--line-strong); border-radius: 50%; background: white; color: var(--muted); cursor: pointer; box-shadow: 0 2px 8px rgba(25,43,31,.1); transition: .18s; }
.collapse-btn:hover { color: var(--green); border-color: #b9cec0; }
.collapse-btn .icon { width: 12px; height: 12px; transform: rotate(90deg); transition: transform .22s; }
.collapse-mobile-icon { display: none; }
.sidebar-scrim { display: none; }

.compose-btn {
  height: 42px;
  border: 0;
  border-radius: 10px;
  background: var(--ink);
  color: white;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  cursor: pointer;
  font-size: 13px;
  font-weight: 650;
  box-shadow: 0 3px 8px rgba(23, 33, 27, 0.15);
  transition: transform .18s, background .18s;
}
.compose-btn:hover { background: #253c2f; transform: translateY(-1px); }
.compose-btn .icon { width: 17px; height: 17px; }

.nav-groups { margin-top: 24px; flex: 1; overflow: auto; }
.nav-group { margin-bottom: 25px; }
.nav-label { color: #98a39c; font-size: 10px; font-weight: 700; letter-spacing: 1.05px; text-transform: uppercase; padding: 0 10px 8px; }
.nav-item {
  width: 100%; height: 38px; padding: 0 10px; margin: 1px 0;
  display: flex; align-items: center; justify-content: space-between;
  border: 0; border-radius: 8px; background: transparent; cursor: pointer;
  color: #5b675f; font-size: 13px; transition: .15s;
}
.nav-item:hover { background: var(--surface-hover); color: var(--ink); }
.nav-item.active { color: var(--ink); background: #eaf0ec; font-weight: 650; }
.nav-item-left { display: flex; gap: 10px; align-items: center; }
.nav-item .icon { width: 17px; height: 17px; color: #748078; }
.nav-item.active .icon { color: var(--green); }
.nav-count { min-width: 22px; height: 21px; padding: 0 7px; display: grid; place-items: center; border-radius: 20px; background: #eef1ef; color: #778179; font-size: 10px; font-weight: 700; }
.nav-item.active .nav-count { background: var(--surface); color: var(--green); }
.status-dot { width: 7px; height: 7px; border-radius: 50%; background: #ef9d4c; box-shadow: 0 0 0 3px #fff1e2; }
.connection-status { min-width: 24px; height: 20px; padding: 0 7px; display: flex; align-items: center; justify-content: center; gap: 4px; border-radius: 20px; background: var(--green-soft); color: var(--green); font-size: 9px; font-weight: 700; }
.connection-status span { width: 5px; height: 5px; border-radius: 50%; background: var(--green-2); }

.sidebar-footer { border-top: 1px solid var(--line); padding-top: 13px; }
.model-card { background: #f1f5f2; border: 1px solid #e2e9e4; border-radius: 10px; padding: 11px; }
.model-top { display: flex; align-items: center; gap: 8px; }
.model-icon { width: 27px; height: 27px; display: grid; place-items: center; border-radius: 7px; background: white; color: var(--green); box-shadow: var(--shadow-sm); }
.model-icon .icon { width: 15px; height: 15px; }
.model-top > span:nth-child(2) { flex: 1; display: flex; flex-direction: column; }
.model-top strong { font-size: 11px; }
.model-top small { margin-top: 1px; color: var(--muted); font-size: 9px; }
.live-pulse { width: 7px; height: 7px; border-radius: 50%; background: #2fa466; box-shadow: 0 0 0 3px rgba(47,164,102,.12); }
.model-meter { height: 3px; border-radius: 4px; background: #dce5df; margin: 10px 0 7px; overflow: hidden; }
.model-meter span { display: block; width: 92%; height: 100%; background: var(--green-2); }
.model-meta { display: flex; justify-content: space-between; color: var(--muted); font-size: 8px; }
.profile-button { width: 100%; display: flex; align-items: center; gap: 9px; border: 0; background: transparent; padding: 13px 5px 1px; cursor: pointer; text-align: left; }
.avatar { width: 30px; height: 30px; display: inline-grid; place-items: center; flex: 0 0 auto; border-radius: 8px; color: #fff; font-size: 10px; font-weight: 750; letter-spacing: .2px; }
.avatar-purple { background: linear-gradient(145deg, #6950a4, #967acb); }
.profile-copy { display: flex; flex-direction: column; min-width: 0; flex: 1; }
.profile-copy strong { font-size: 11px; white-space: nowrap; }
.profile-copy small { color: var(--muted); font-size: 9px; margin-top: 2px; }
.more-icon { width: 16px; color: var(--muted); }

.main-area { width: calc(100% - var(--sidebar-width)); min-height: 100vh; margin-left: var(--sidebar-width); transition: width .22s ease, margin-left .22s ease; }
.topbar { height: 65px; padding: 0 28px; display: flex; align-items: center; justify-content: space-between; position: sticky; top: 0; z-index: 12; background: rgba(244,246,248,.92); backdrop-filter: blur(12px); border-bottom: 1px solid rgba(219,225,221,.8); }
.topbar-left, .topbar-actions, .breadcrumb { display: flex; align-items: center; }
.breadcrumb { gap: 7px; font-size: 12px; }
.breadcrumb span:first-child { color: var(--muted); }
.breadcrumb strong { font-weight: 650; }
.breadcrumb-chevron { width: 12px; color: #a0aaa4; transform: rotate(-90deg); }
.topbar-actions { gap: 8px; }
.focus-btn { height: 35px; padding: 0 11px; display: flex; align-items: center; gap: 7px; border: 1px solid #d7e3db; border-radius: 9px; background: #f5faf7; color: var(--green); cursor: pointer; font-size: 10px; font-weight: 650; transition: .15s; }
.focus-btn .icon { width: 14px; height: 14px; }
.focus-btn:hover, .focus-btn.active { color: white; background: var(--green); border-color: var(--green); }
.top-search { width: 248px; height: 35px; padding: 0 10px; display: flex; align-items: center; gap: 8px; border: 1px solid var(--line); border-radius: 9px; background: var(--surface); box-shadow: var(--shadow-sm); }
.top-search .icon { width: 15px; color: var(--muted); }
.top-search input { flex: 1; width: 100%; min-width: 0; border: 0; outline: none; background: transparent; color: var(--ink); font-size: 11px; }
.top-search input::placeholder { color: #a0aaa4; }
kbd { border: 1px solid var(--line); border-bottom-color: #cbd2ce; border-radius: 4px; color: var(--muted); background: #fafbfa; padding: 2px 5px; font: 9px ui-monospace, SFMono-Regular, Menlo, monospace; }
.icon-btn { width: 35px; height: 35px; display: grid; place-items: center; position: relative; border: 1px solid var(--line); border-radius: 9px; background: var(--surface); cursor: pointer; color: #69766e; box-shadow: var(--shadow-sm); transition: .15s; }
.icon-btn:hover { border-color: #cfd7d2; color: var(--ink); background: #fbfcfb; }
.icon-btn .icon { width: 16px; height: 16px; }
.unread-dot { position: absolute; right: 7px; top: 6px; width: 5px; height: 5px; border-radius: 50%; background: #e68145; box-shadow: 0 0 0 2px white; }
.mobile-menu { display: none; margin-right: 10px; }

.workspace { padding: 25px 28px 40px; max-width: 1640px; margin: 0 auto; }
.page-head { display: flex; align-items: flex-end; justify-content: space-between; gap: 20px; margin-bottom: 20px; }
.eyebrow { color: var(--green); font-size: 10px; font-weight: 750; letter-spacing: 1.2px; text-transform: uppercase; margin-bottom: 6px; }
.page-head h1 { margin: 0; font-size: 25px; font-weight: 710; letter-spacing: -.7px; }
.page-head p { margin: 6px 0 0; color: var(--muted); font-size: 12px; }
.head-actions { display: flex; gap: 8px; }
.btn { min-height: 36px; display: inline-flex; align-items: center; justify-content: center; gap: 7px; border: 1px solid var(--line-strong); border-radius: 8px; padding: 0 13px; background: var(--surface); cursor: pointer; font-size: 11px; font-weight: 650; box-shadow: var(--shadow-sm); transition: .15s; }
.btn:hover { transform: translateY(-1px); border-color: #bdc8c1; }
.btn .icon { width: 14px; height: 14px; }
.btn-primary { background: var(--ink); color: #fff; border-color: var(--ink); }
.btn-primary:hover { background: #294034; border-color: #294034; }
.btn-green { background: var(--green); color: #fff; border-color: var(--green); }
.btn-green:hover { background: #17633d; border-color: #17633d; }
.btn-ghost { border-color: transparent; box-shadow: none; background: transparent; }
.btn-danger-soft { color: var(--red); background: var(--red-soft); border-color: #f3d2d4; }
.btn-sm { min-height: 30px; padding: 0 10px; font-size: 10px; }

.signal-banner { min-height: 72px; display: flex; align-items: center; gap: 16px; margin-bottom: 16px; padding: 14px 18px; color: #f4fff8; background: linear-gradient(110deg, #183b2a, #245d3d 58%, #2d6c48); border-radius: var(--radius); box-shadow: 0 9px 24px rgba(32, 85, 56, .13); position: relative; overflow: hidden; }
.signal-banner::before { content: ""; position: absolute; width: 260px; height: 260px; right: 8%; top: -190px; border: 1px solid rgba(255,255,255,.12); border-radius: 50%; box-shadow: 0 0 0 35px rgba(255,255,255,.025), 0 0 0 70px rgba(255,255,255,.02); }
.banner-icon { width: 38px; height: 38px; display: grid; place-items: center; flex: 0 0 auto; border-radius: 10px; background: rgba(255,255,255,.12); }
.banner-icon .icon { width: 20px; }
.banner-copy { flex: 1; position: relative; }
.banner-copy strong { display: block; font-size: 13px; margin-bottom: 3px; }
.banner-copy span { color: rgba(243,255,248,.72); font-size: 10px; }
.banner-stats { display: flex; gap: 28px; position: relative; }
.banner-stat { display: flex; flex-direction: column; }
.banner-stat strong { font-size: 16px; letter-spacing: -.4px; }
.banner-stat span { color: rgba(243,255,248,.65); font-size: 9px; margin-top: 2px; }

.metrics-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 10px; margin-bottom: 16px; }
.metric-card { min-height: 76px; padding: 14px 15px; display: flex; align-items: center; gap: 12px; border: 1px solid var(--line); border-radius: 10px; background: var(--surface); box-shadow: var(--shadow-sm); }
.metric-icon { width: 36px; height: 36px; display: grid; place-items: center; border-radius: 9px; flex: 0 0 auto; }
.metric-icon .icon { width: 17px; height: 17px; }
.tone-green { color: var(--green); background: var(--green-soft); }
.tone-orange { color: var(--orange); background: var(--orange-soft); }
.tone-blue { color: var(--blue); background: var(--blue-soft); }
.tone-purple { color: var(--purple); background: var(--purple-soft); }
.metric-info { min-width: 0; }
.metric-info small { color: var(--muted); display: block; font-size: 9px; margin-bottom: 4px; }
.metric-value { display: flex; align-items: baseline; gap: 6px; }
.metric-value strong { font-size: 18px; line-height: 1; letter-spacing: -.4px; }
.metric-value span { color: var(--green); font-size: 9px; font-weight: 650; white-space: nowrap; }
.metric-value strong .live-message-count, .metric-value strong .live-interruption-count { color: var(--ink); font-size: inherit; }
.live-inline { display: inline-flex; align-items: center; gap: 4px; }
.live-inline i, .live-chip i { width: 5px; height: 5px; display: inline-block; border-radius: 50%; background: var(--green-2); box-shadow: 0 0 0 3px rgba(54,166,107,.1); animation: livePulse 1.8s ease-in-out infinite; }
@keyframes livePulse { 50% { opacity: .45; transform: scale(.82); } }

.inbox-shell { display: grid; grid-template-columns: minmax(330px, .8fr) minmax(480px, 1.35fr); min-height: 540px; border: 1px solid var(--line); border-radius: var(--radius); background: var(--surface); overflow: hidden; box-shadow: var(--shadow-sm); }
.list-panel { min-width: 0; border-right: 1px solid var(--line); }
.panel-toolbar { min-height: 53px; padding: 10px 13px; display: flex; align-items: center; justify-content: space-between; border-bottom: 1px solid var(--line); background: #fdfefd; }
.toolbar-title { display: flex; align-items: center; gap: 7px; font-size: 11px; font-weight: 650; }
.toolbar-title span:last-child { color: var(--muted); font-weight: 500; }
.toolbar-actions { display: flex; gap: 5px; }
.mini-btn { width: 29px; height: 29px; display: grid; place-items: center; border: 1px solid var(--line); background: white; border-radius: 7px; color: var(--muted); cursor: pointer; }
.mini-btn:hover { color: var(--ink); background: var(--surface-subtle); }
.mini-btn .icon { width: 13px; height: 13px; }
.email-list { max-height: 610px; overflow-y: auto; }
.email-row { width: 100%; min-height: 91px; display: grid; grid-template-columns: 34px 1fr; gap: 10px; padding: 14px 13px; border: 0; border-bottom: 1px solid #edf0ee; background: #fff; cursor: pointer; text-align: left; position: relative; }
.email-row:hover { background: #fafcfb; }
.email-row.selected { background: #f1f6f3; }
.email-row.selected::before { content: ""; position: absolute; left: 0; inset-block: 0; width: 3px; background: var(--green); }
.email-row.unread .sender-name, .email-row.unread .subject { font-weight: 700; color: var(--ink); }
.sender-avatar { width: 34px; height: 34px; display: grid; place-items: center; border-radius: 9px; font-size: 10px; font-weight: 750; color: white; }
.email-row-main { min-width: 0; display: block; overflow: hidden; }
.email-topline { display: flex; align-items: center; gap: 7px; min-width: 0; }
.sender-name { flex: 1; min-width: 0; color: #37443c; font-size: 11px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.email-time { color: #929c96; font-size: 9px; white-space: nowrap; }
.subject { display: block; margin-top: 4px; color: #39463e; font-size: 11px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.email-snippet { display: block; margin-top: 4px; color: #89938d; font-size: 9px; line-height: 1.4; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.row-footer { display: flex; align-items: center; justify-content: space-between; margin-top: 7px; }
.classification-pill { display: inline-flex; align-items: center; gap: 4px; height: 18px; padding: 0 6px; border-radius: 4px; font-size: 8px; font-weight: 700; letter-spacing: .1px; }
.classification-pill .icon { width: 9px; height: 9px; }
.pill-priority { color: var(--green); background: var(--green-soft); }
.pill-review { color: var(--orange); background: var(--orange-soft); }
.pill-cold { color: var(--red); background: var(--red-soft); }
.pill-monitor { color: var(--blue); background: var(--blue-soft); }
.confidence { color: #9aa49e; font-size: 8px; }
.empty-list { padding: 52px 20px; text-align: center; color: var(--muted); }
.empty-list .icon-wrap { width: 44px; height: 44px; margin: 0 auto 12px; border-radius: 12px; display: grid; place-items: center; background: var(--green-soft); color: var(--green); }
.empty-list .icon { width: 21px; }
.empty-list strong { display: block; color: var(--ink); font-size: 12px; margin-bottom: 5px; }
.empty-list span { font-size: 10px; }

.detail-panel { min-width: 0; background: #fff; }
.detail-toolbar { min-height: 53px; padding: 10px 16px; display: flex; align-items: center; justify-content: space-between; border-bottom: 1px solid var(--line); }
.detail-actions { display: flex; gap: 5px; }
.detail-content { padding: 22px 25px 30px; max-height: 610px; overflow-y: auto; }
.detail-category { display: flex; align-items: center; justify-content: space-between; margin-bottom: 13px; }
.classified-at { color: var(--muted); font-size: 9px; }
.detail-content h2 { margin: 0 0 17px; font-size: 18px; line-height: 1.35; font-weight: 690; letter-spacing: -.25px; }
.sender-block { display: flex; align-items: center; gap: 10px; }
.sender-block .sender-avatar { width: 38px; height: 38px; }
.sender-identity { flex: 1; min-width: 0; }
.sender-identity strong { display: block; font-size: 11px; margin-bottom: 3px; }
.sender-identity span { color: var(--muted); font-size: 9px; }
.sender-identity .verified { color: var(--green); vertical-align: -2px; }
.sender-identity .verified .icon { width: 12px; height: 12px; }
.detail-date { color: var(--muted); font-size: 9px; }
.ai-verdict { margin: 20px 0; padding: 14px; border: 1px solid #d9e8df; border-radius: 10px; background: #f7fbf8; }
.verdict-header { display: flex; align-items: center; gap: 9px; }
.verdict-spark { width: 28px; height: 28px; display: grid; place-items: center; flex: 0 0 auto; border-radius: 8px; background: var(--green); color: white; }
.verdict-spark .icon { width: 14px; }
.verdict-title { flex: 1; }
.verdict-title strong { display: block; font-size: 10px; }
.verdict-title span { color: var(--muted); font-size: 8px; }
.score-ring { --score: 94; width: 35px; height: 35px; border-radius: 50%; display: grid; place-items: center; background: conic-gradient(var(--green) calc(var(--score) * 1%), #dce8e0 0); position: relative; }
.score-ring::before { content: ""; width: 27px; height: 27px; border-radius: 50%; background: white; position: absolute; }
.score-ring span { position: relative; z-index: 1; font-size: 8px; font-weight: 750; }
.signal-tags { display: flex; flex-wrap: wrap; gap: 5px; margin-top: 11px; }
.signal-tag { border: 1px solid #dfe8e2; border-radius: 5px; background: white; color: #66736b; padding: 4px 6px; font-size: 8px; }
.message-body { color: #435048; font-size: 11px; line-height: 1.7; }
.message-body p { margin: 0 0 12px; }
.message-body .signature { color: #69766e; }
.message-body .fake-link { color: var(--green); text-decoration: underline; text-underline-offset: 2px; }
.route-note { display: flex; align-items: center; gap: 8px; padding: 10px 11px; margin-top: 18px; border-radius: 8px; background: #f5f7f6; color: #66726b; font-size: 9px; }
.route-note .icon { width: 14px; color: var(--green); }
.ai-action-row { display: flex; align-items: center; gap: 7px; margin: -10px 0 18px; padding: 9px; border: 1px solid #e5e9e6; border-radius: 9px; background: #fafbfa; }
.ai-action-row > span { display: flex; align-items: center; gap: 5px; margin-right: auto; color: var(--green); font-size: 9px; font-weight: 700; }
.ai-action-row > span .icon { width: 13px; }
.ai-action-row .btn { background: white; }

.overview-grid { display: grid; grid-template-columns: minmax(0, 1.5fr) minmax(280px, .75fr); gap: 14px; }
.card { border: 1px solid var(--line); background: var(--surface); border-radius: var(--radius); box-shadow: var(--shadow-sm); }
.card-head { min-height: 52px; padding: 13px 16px; display: flex; justify-content: space-between; align-items: center; border-bottom: 1px solid var(--line); }
.card-head strong { font-size: 12px; }
.card-head span { color: var(--muted); font-size: 9px; }
.chart-card { padding-bottom: 17px; }
.range-picker { display: inline-flex; align-items: center; gap: 2px; padding: 3px; border: 1px solid var(--line); border-radius: 8px; background: #f6f8f7; }
.range-picker button { height: 25px; min-width: 34px; padding: 0 7px; border: 0; border-radius: 5px; background: transparent; color: var(--muted); cursor: pointer; font-size: 8px; font-weight: 650; }
.range-picker button:hover { color: var(--ink); }
.range-picker button.active { color: var(--green); background: white; box-shadow: 0 1px 4px rgba(30,55,38,.1); }
.range-picker-compact button { min-width: 28px; padding: 0 5px; }
.live-chip { display: inline-flex; align-items: center; gap: 5px; margin-left: 6px; padding: 3px 6px; border-radius: 5px; color: var(--green); background: var(--green-soft); font-size: 7px; font-weight: 700; vertical-align: 1px; }
.chart-summary { min-height: 42px; padding: 10px 20px 0; display: flex; align-items: center; gap: 22px; color: var(--muted); font-size: 8px; }
.chart-summary strong { color: var(--ink); font-size: 11px; margin-right: 3px; }
.chart-summary .positive-trend { display: flex; align-items: center; gap: 4px; margin-left: auto; color: var(--green); font-weight: 650; }
.chart-summary .positive-trend .icon { width: 12px; }
.chart-wrap { height: 210px; display: flex; align-items: flex-end; gap: 8px; padding: 25px 20px 0; position: relative; }
.chart-gridlines { position: absolute; inset: 24px 20px 20px; display: flex; flex-direction: column; justify-content: space-between; }
.chart-gridlines span { border-top: 1px dashed #e7ebe8; }
.bar-group { flex: 1; height: 100%; display: flex; gap: 3px; align-items: flex-end; z-index: 1; }
.bar { flex: 1; min-width: 5px; border-radius: 3px 3px 1px 1px; transition: height .4s ease; }
.bar-safe { background: #81c69e; }
.bar-cold { background: #e9a2a4; }
.chart-labels { display: grid; grid-template-columns: repeat(7, 1fr); padding: 8px 20px 0; text-align: center; color: var(--muted); font-size: 8px; }
.chart-legend { display: flex; gap: 14px; padding: 11px 20px 0; color: var(--muted); font-size: 8px; }
.legend-item { display: flex; align-items: center; gap: 5px; }
.legend-dot { width: 7px; height: 7px; border-radius: 2px; }
.health-card { padding: 19px; }
.health-card h3 { margin: 0; font-size: 13px; }
.health-card > p { color: var(--muted); font-size: 9px; line-height: 1.5; margin: 5px 0 17px; }
.health-heading { display: flex; align-items: flex-start; justify-content: space-between; gap: 8px; }
.health-heading p { color: var(--muted); font-size: 8px; line-height: 1.5; margin: 4px 0 0; }
.health-score { width: 112px; height: 112px; border-radius: 50%; margin: 15px auto 12px; display: grid; place-items: center; background: conic-gradient(var(--green) 0 calc(var(--health-score) * 1%), #e6ebe8 calc(var(--health-score) * 1%)); position: relative; }
.health-score::before { content: ""; position: absolute; width: 88px; height: 88px; border-radius: 50%; background: white; }
.health-score-inner { position: relative; text-align: center; }
.health-score-inner strong { display: block; font-size: 27px; letter-spacing: -1.3px; }
.health-score-inner span { color: var(--green); font-size: 9px; font-weight: 650; }
.health-trend { margin: 0 0 12px; padding: 10px 10px 4px; border: 1px solid var(--line); border-radius: 8px; background: #fbfcfb; }
.health-trend-head { display: flex; align-items: center; justify-content: space-between; color: var(--muted); font-size: 7px; }
.health-trend-head strong { color: var(--green); font-size: 8px; }
.health-trend svg { width: 100%; height: 40px; display: block; margin-top: 3px; }
.health-item { display: flex; align-items: center; gap: 9px; padding: 10px 0; border-top: 1px solid #edf0ee; }
.health-item .icon-wrap { width: 28px; height: 28px; display: grid; place-items: center; border-radius: 7px; }
.health-item .icon { width: 13px; }
.health-item-copy { flex: 1; }
.health-item-copy strong { display: block; font-size: 10px; }
.health-item-copy span { color: var(--muted); font-size: 8px; }
.health-value { color: var(--green); font-size: 10px; font-weight: 700; }
.recent-card { grid-column: 1 / -1; }
.briefing-strip { grid-column: 1 / -1; display: grid; grid-template-columns: 1.3fr repeat(3, .65fr); overflow: hidden; }
.briefing-lead { padding: 18px; display: flex; align-items: center; gap: 12px; background: linear-gradient(120deg, #f1f8f3, #fbfdfb); }
.briefing-lead .icon-wrap { width: 38px; height: 38px; display: grid; place-items: center; flex: 0 0 auto; border-radius: 10px; color: white; background: var(--green); }
.briefing-lead .icon { width: 18px; }
.briefing-lead strong { display: block; font-size: 11px; margin-bottom: 3px; }
.briefing-lead span { color: var(--muted); font-size: 8px; }
.briefing-stat { padding: 16px; display: flex; flex-direction: column; justify-content: center; border-left: 1px solid var(--line); }
.briefing-stat strong { font-size: 17px; letter-spacing: -.4px; }
.briefing-stat span { color: var(--muted); font-size: 8px; margin-top: 3px; }
.activity-list { padding: 2px 16px; }
.activity-row { display: grid; grid-template-columns: 30px 1.5fr 1fr .7fr 70px; align-items: center; gap: 10px; min-height: 50px; border-bottom: 1px solid #edf0ee; font-size: 9px; }
.activity-row:last-child { border-bottom: 0; }
.activity-row .sender-avatar { width: 27px; height: 27px; border-radius: 7px; font-size: 8px; }
.activity-primary strong { display: block; font-size: 10px; margin-bottom: 2px; }
.activity-primary span, .activity-secondary { color: var(--muted); }

.digest-layout { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }
.digest-feature { grid-column: 1 / -1; min-height: 165px; padding: 24px; display: flex; align-items: center; gap: 22px; background: linear-gradient(120deg, #fff, #f2f8f4); position: relative; overflow: hidden; }
.digest-feature::after { content: ""; width: 230px; height: 230px; position: absolute; right: -55px; bottom: -155px; border-radius: 50%; border: 28px solid rgba(37,117,74,.06); }
.digest-art { width: 78px; height: 78px; display: grid; place-items: center; flex: 0 0 auto; border-radius: 18px; color: white; background: linear-gradient(145deg, #31794f, #194f32); box-shadow: 0 12px 24px rgba(32,99,62,.18); }
.digest-art .icon { width: 34px; }
.digest-copy { flex: 1; position: relative; z-index: 1; }
.digest-copy .eyebrow { margin-bottom: 8px; }
.digest-copy h2 { margin: 0 0 7px; font-size: 20px; }
.digest-copy p { max-width: 560px; margin: 0; color: var(--muted); font-size: 10px; line-height: 1.6; }
.digest-actions { display: flex; gap: 7px; margin-top: 15px; }
.digest-card { padding: 17px; }
.digest-card-top { display: flex; align-items: center; gap: 11px; }
.digest-card-icon { width: 38px; height: 38px; display: grid; place-items: center; border-radius: 10px; }
.digest-card-icon .icon { width: 18px; }
.digest-card-title { flex: 1; }
.digest-card-title strong { display: block; font-size: 11px; }
.digest-card-title span { color: var(--muted); font-size: 8px; }
.digest-list { margin: 15px 0 13px; padding: 0; list-style: none; }
.digest-list li { display: flex; align-items: center; justify-content: space-between; min-height: 32px; border-bottom: 1px solid #edf0ee; font-size: 9px; }
.digest-list li span:last-child { color: var(--muted); }

.analytics-grid { display: grid; grid-template-columns: 1.4fr .75fr; gap: 14px; }
.analytics-grid .chart-card { min-height: 300px; }
.donut-card { padding: 18px; }
.donut-card h3 { margin: 0 0 3px; font-size: 12px; }
.donut-card > p { margin: 0; color: var(--muted); font-size: 9px; }
.donut-wrap { width: 145px; height: 145px; border-radius: 50%; margin: 24px auto; display: grid; place-items: center; background: conic-gradient(var(--red) 0 72%, var(--green) 72% 88%, var(--orange) 88% 96%, var(--blue) 96%); position: relative; }
.donut-wrap::before { content: ""; position: absolute; width: 97px; height: 97px; border-radius: 50%; background: white; }
.donut-inner { position: relative; text-align: center; }
.donut-inner strong { font-size: 24px; display: block; }
.donut-inner span { color: var(--muted); font-size: 8px; }
.breakdown-list { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }
.breakdown-item { display: flex; align-items: center; gap: 6px; color: var(--muted); font-size: 8px; }
.breakdown-item strong { margin-left: auto; color: var(--ink); }
.domain-table-card { grid-column: 1 / -1; }
.roi-card { grid-column: 1 / -1; min-height: 92px; padding: 15px 17px; display: grid; grid-template-columns: 1.5fr .65fr .65fr auto; align-items: center; gap: 17px; background: linear-gradient(110deg, #f4faf6, white); }
.roi-lead { display: flex; align-items: center; gap: 11px; }
.roi-lead .icon-wrap { width: 39px; height: 39px; display: grid; place-items: center; flex: 0 0 auto; border-radius: 10px; color: white; background: var(--green); }
.roi-lead .icon { width: 18px; }
.roi-lead small { display: block; color: var(--green); font-size: 7px; font-weight: 750; letter-spacing: .7px; }
.roi-lead strong { display: block; margin: 3px 0; font-size: 13px; }
.roi-lead span { color: var(--muted); font-size: 7px; }
.roi-stat { padding-left: 16px; border-left: 1px solid var(--line); }
.roi-stat strong { display: block; font-size: 14px; }
.roi-stat span { color: var(--muted); font-size: 7px; }
.simple-table { width: 100%; border-collapse: collapse; }
.simple-table th, .simple-table td { padding: 12px 16px; border-bottom: 1px solid #edf0ee; text-align: left; font-size: 9px; }
.simple-table th { color: var(--muted); font-weight: 600; background: #fafbfa; }
.simple-table tbody tr:last-child td { border-bottom: 0; }
.domain-cell { display: flex; align-items: center; gap: 8px; font-weight: 650; }
.domain-favicon { width: 23px; height: 23px; display: grid; place-items: center; border-radius: 6px; background: var(--surface-hover); font-size: 9px; }
.risk-bar { display: flex; align-items: center; gap: 8px; }
.risk-track { width: 74px; height: 4px; background: #edf0ee; border-radius: 4px; overflow: hidden; }
.risk-track span { display: block; height: 100%; border-radius: inherit; background: var(--red); }

.campaign-metrics { display: grid; grid-template-columns: repeat(4, minmax(0,1fr)); gap: 10px; margin-bottom: 14px; }
.campaign-metric { min-height: 72px; padding: 13px; display: flex; align-items: center; gap: 11px; }
.campaign-metric strong { display: block; font-size: 17px; }
.campaign-metric span:last-child { color: var(--muted); font-size: 8px; }
.campaign-layout { display: grid; grid-template-columns: minmax(0, 1.4fr) minmax(320px, .75fr); gap: 14px; }
.cluster-card { min-width: 0; }
.cluster-list { padding: 3px 14px; }
.cluster-row { width: 100%; min-height: 66px; display: grid; grid-template-columns: 28px 1.4fr .65fr 65px 15px; align-items: center; gap: 10px; border: 0; border-bottom: 1px solid #edf0ee; background: white; text-align: left; cursor: pointer; }
.cluster-row:last-child { border-bottom: 0; }
.cluster-row:hover, .cluster-row.selected { background: #fafcfb; }
.cluster-row.selected { margin-inline: -14px; width: calc(100% + 28px); padding-inline: 14px; box-shadow: inset 3px 0 var(--green); }
.cluster-rank { width: 25px; height: 25px; display: grid; place-items: center; border-radius: 7px; color: var(--cluster); background: color-mix(in srgb, var(--cluster) 10%, white); font-size: 9px; font-weight: 750; }
.cluster-copy strong, .cluster-meta strong { display: block; font-size: 9px; }
.cluster-copy span, .cluster-meta span { display: block; color: var(--muted); font-size: 7px; margin-top: 3px; }
.risk-score { padding: 5px 6px; border-radius: 5px; font-size: 7px; font-weight: 750; text-align: center; }
.cluster-row > .icon { width: 13px; color: var(--muted); transform: rotate(-90deg); }
.sender-inspector { padding: 17px; }
.inspector-head { display: flex; align-items: flex-start; gap: 10px; padding-bottom: 14px; border-bottom: 1px solid var(--line); }
.inspector-head > div:first-child { flex: 1; }
.inspector-head .eyebrow { margin-bottom: 4px; }
.inspector-head h3 { margin: 0 0 3px; font-size: 14px; }
.inspector-head p { margin: 0; color: var(--muted); font-size: 8px; }
.inspector-risk { width: 49px; height: 49px; display: grid; place-items: center; align-content: center; border-radius: 50%; color: var(--red); background: var(--red-soft); border: 3px solid rgba(187,65,65,.18); }
.inspector-risk strong { display: block; font-size: 15px; line-height: 1; }
.inspector-risk span { font-size: 7px; }
.fingerprint-card { display: flex; align-items: center; gap: 9px; margin-top: 13px; padding: 10px; border-radius: 8px; color: var(--purple); background: var(--purple-soft); }
.fingerprint-card .icon-wrap { width: 29px; height: 29px; display: grid; place-items: center; flex: 0 0 auto; border-radius: 7px; background: white; }
.fingerprint-card .icon { width: 15px; }
.fingerprint-card strong { display: block; font-size: 9px; }
.fingerprint-card span { display: block; margin-top: 2px; color: #766a93; font-size: 7px; }
.intel-row { min-height: 30px; display: flex; align-items: center; justify-content: space-between; border-bottom: 1px solid #edf0ee; color: var(--muted); font-size: 8px; }
.intel-row strong { color: var(--ink); font-size: 8px; }
.intel-row .risk-text { color: var(--red); }
.intel-row .good-text { color: var(--green); }
.quote-pattern { padding: 10px; border-left: 3px solid var(--orange); border-radius: 0 7px 7px 0; background: #fff8f2; color: #795a45; font-size: 8px; font-style: italic; line-height: 1.5; }
.inspector-actions { display: flex; justify-content: flex-end; gap: 6px; margin-top: 14px; }
.campaign-policy { padding: 14px; display: flex; align-items: center; gap: 12px; }
.campaign-policy-copy { display: flex; align-items: center; gap: 10px; flex: 1; }
.campaign-policy-copy .icon-wrap { width: 34px; height: 34px; display: grid; place-items: center; flex: 0 0 auto; border-radius: 8px; }
.campaign-policy-copy .icon { width: 15px; }
.campaign-policy-copy strong { display: block; font-size: 9px; }
.campaign-policy-copy span { display: block; margin-top: 2px; color: var(--muted); font-size: 7px; line-height: 1.45; }

.settings-layout { display: grid; grid-template-columns: minmax(0, 1.3fr) minmax(280px, .7fr); gap: 14px; }
.settings-section { padding: 18px; }
.settings-title { display: flex; align-items: flex-start; justify-content: space-between; margin-bottom: 16px; }
.settings-title h3 { margin: 0 0 4px; font-size: 12px; }
.settings-title p { margin: 0; color: var(--muted); font-size: 9px; line-height: 1.5; }
.proxy-address { padding: 14px; display: flex; align-items: center; gap: 11px; border: 1px solid #cfe4d7; border-radius: 9px; background: #f3faf6; }
.proxy-address .icon-wrap { width: 34px; height: 34px; display: grid; place-items: center; border-radius: 8px; background: white; color: var(--green); box-shadow: var(--shadow-sm); }
.proxy-address .icon { width: 16px; }
.proxy-value { flex: 1; }
.proxy-value small { display: block; color: var(--muted); font-size: 8px; margin-bottom: 3px; }
.proxy-value strong { font-size: 11px; }
.flow-diagram { padding: 20px 4px 5px; display: flex; align-items: center; justify-content: space-between; }
.flow-node { width: 82px; text-align: center; }
.flow-node-icon { width: 44px; height: 44px; margin: 0 auto 7px; display: grid; place-items: center; border: 1px solid var(--line); border-radius: 12px; background: white; color: var(--green); }
.flow-node-icon .icon { width: 20px; }
.flow-node strong { display: block; font-size: 9px; }
.flow-node span { color: var(--muted); font-size: 7px; }
.flow-arrow { flex: 1; display: flex; align-items: center; color: #a1aea6; }
.flow-arrow::before { content: ""; flex: 1; border-top: 1px dashed #cbd5cf; }
.flow-arrow .icon { width: 12px; transform: rotate(-90deg); }
.alias-list { margin-top: 10px; }
.alias-row { min-height: 52px; display: flex; align-items: center; gap: 10px; border-bottom: 1px solid #edf0ee; }
.alias-row:last-child { border-bottom: 0; }
.alias-row .sender-avatar { width: 29px; height: 29px; border-radius: 7px; }
.alias-copy { flex: 1; }
.alias-copy strong { display: block; font-size: 9px; }
.alias-copy span { color: var(--muted); font-size: 8px; }
.status-badge { display: inline-flex; align-items: center; gap: 4px; padding: 4px 6px; border-radius: 5px; background: var(--green-soft); color: var(--green); font-size: 8px; font-weight: 650; }
.status-badge::before { content: ""; width: 5px; height: 5px; border-radius: 50%; background: var(--green-2); }
.protection-card { padding: 19px; background: linear-gradient(145deg, #193c2b, #244f39); color: white; border: 0; }
.protection-card .icon-wrap { width: 42px; height: 42px; display: grid; place-items: center; border-radius: 11px; background: rgba(255,255,255,.11); }
.protection-card .icon { width: 21px; }
.protection-card h3 { margin: 18px 0 6px; font-size: 15px; }
.protection-card p { margin: 0; color: rgba(255,255,255,.65); font-size: 9px; line-height: 1.6; }
.protection-stats { display: grid; grid-template-columns: 1fr 1fr; gap: 7px; margin-top: 17px; }
.protection-stat { padding: 11px; background: rgba(255,255,255,.07); border-radius: 8px; }
.protection-stat strong { display: block; font-size: 15px; }
.protection-stat span { color: rgba(255,255,255,.58); font-size: 8px; }
.toggle { width: 34px; height: 19px; padding: 2px; border: 0; border-radius: 20px; background: #cfd6d2; cursor: pointer; transition: .18s; }
.toggle::after { content: ""; display: block; width: 15px; height: 15px; border-radius: 50%; background: white; box-shadow: 0 1px 3px rgba(0,0,0,.15); transition: .18s; }
.toggle.on { background: var(--green); }
.toggle.on::after { transform: translateX(15px); }
.rule-row { min-height: 65px; display: flex; align-items: center; gap: 11px; border-bottom: 1px solid #edf0ee; }
.rule-row:last-child { border-bottom: 0; }
.rule-icon { width: 33px; height: 33px; display: grid; place-items: center; flex: 0 0 auto; border-radius: 8px; }
.rule-icon .icon { width: 15px; }
.rule-copy { flex: 1; }
.rule-copy strong { display: block; font-size: 10px; }
.rule-copy span { display: block; color: var(--muted); font-size: 8px; margin-top: 3px; }
.rule-priority { align-self: center; color: var(--muted); font-size: 8px; margin-right: 8px; }

.connections-layout { display: grid; grid-template-columns: minmax(0, 1.25fr) minmax(300px, .75fr); gap: 14px; }
.connection-hero { grid-column: 1 / -1; padding: 18px 20px; display: flex; align-items: center; gap: 14px; background: linear-gradient(110deg, #193d2b, #245c3d); color: white; border: 0; position: relative; overflow: hidden; }
.connection-hero::after { content: ""; width: 180px; height: 180px; position: absolute; right: 7%; top: -125px; border-radius: 50%; border: 28px solid rgba(255,255,255,.05); }
.connection-hero-icon { width: 43px; height: 43px; display: grid; place-items: center; flex: 0 0 auto; border-radius: 11px; background: rgba(255,255,255,.12); }
.connection-hero-icon .icon { width: 21px; }
.connection-hero-copy { flex: 1; position: relative; z-index: 1; }
.connection-hero-copy strong { display: block; font-size: 13px; margin-bottom: 3px; }
.connection-hero-copy span { color: rgba(255,255,255,.66); font-size: 9px; }
.live-badge { display: inline-flex; align-items: center; gap: 6px; padding: 6px 9px; border-radius: 7px; background: rgba(255,255,255,.11); font-size: 9px; position: relative; z-index: 1; }
.live-badge::before { content: ""; width: 6px; height: 6px; border-radius: 50%; background: #6ee7a0; box-shadow: 0 0 0 3px rgba(110,231,160,.12); }
.account-list { display: grid; gap: 11px; }
.account-card { padding: 17px; }
.account-card-top { display: flex; align-items: center; gap: 11px; }
.account-provider { width: 40px; height: 40px; display: grid; place-items: center; flex: 0 0 auto; border-radius: 10px; color: white; font-size: 15px; font-weight: 800; }
.account-identity { flex: 1; min-width: 0; }
.account-identity strong { display: block; font-size: 11px; }
.account-identity span { display: block; color: var(--muted); font-size: 8px; margin-top: 3px; }
.account-metrics { display: grid; grid-template-columns: repeat(3, 1fr); margin-top: 15px; border: 1px solid var(--line); border-radius: 8px; overflow: hidden; }
.account-metric { padding: 10px; background: #fafbfa; border-right: 1px solid var(--line); }
.account-metric:last-child { border-right: 0; }
.account-metric strong { display: block; font-size: 11px; }
.account-metric span { color: var(--muted); font-size: 7px; }
.sync-line { display: flex; align-items: center; gap: 7px; margin-top: 12px; color: var(--muted); font-size: 8px; }
.sync-line .icon { width: 12px; color: var(--green); }
.sync-line .btn { margin-left: auto; }
.empty-account { min-height: 134px; padding: 17px; display: flex; align-items: center; gap: 13px; border: 1px dashed #ccd6d0; border-radius: var(--radius); background: rgba(255,255,255,.55); }
.empty-account .account-provider { opacity: .8; }
.sync-timeline { padding: 5px 18px 15px; }
.timeline-row { min-height: 62px; display: grid; grid-template-columns: 24px 1fr auto; gap: 9px; align-items: center; position: relative; }
.timeline-row:not(:last-child)::after { content: ""; position: absolute; left: 11px; top: 43px; bottom: -19px; border-left: 1px solid #dce5df; }
.timeline-node { width: 24px; height: 24px; display: grid; place-items: center; border-radius: 50%; background: var(--green-soft); color: var(--green); z-index: 1; }
.timeline-node .icon { width: 11px; }
.timeline-copy strong { display: block; font-size: 9px; }
.timeline-copy span { color: var(--muted); font-size: 8px; }
.timeline-time { color: var(--muted); font-size: 8px; }
.data-control { min-height: 55px; display: flex; align-items: center; gap: 9px; border-bottom: 1px solid #edf0ee; }
.data-control:last-child { border-bottom: 0; }
.data-control .rule-icon { width: 29px; height: 29px; }
.data-control .rule-copy { padding-right: 8px; }

.trusted-grid { display: grid; grid-template-columns: repeat(3, minmax(0,1fr)); gap: 12px; }
.trusted-summary { grid-column: 1 / -1; padding: 18px; display: flex; align-items: center; gap: 14px; }
.trusted-summary .icon-wrap { width: 44px; height: 44px; display: grid; place-items: center; border-radius: 11px; color: var(--green); background: var(--green-soft); }
.trusted-summary .icon { width: 21px; }
.trusted-summary-copy { flex: 1; }
.trusted-summary-copy strong { display: block; font-size: 12px; }
.trusted-summary-copy span { color: var(--muted); font-size: 9px; }
.trusted-card { padding: 16px; }
.trusted-person { display: flex; align-items: center; gap: 10px; }
.trusted-person .sender-avatar { width: 39px; height: 39px; }
.trusted-person-copy { flex: 1; min-width: 0; }
.trusted-person-copy strong { display: block; font-size: 10px; }
.trusted-person-copy span { display: block; overflow: hidden; text-overflow: ellipsis; color: var(--muted); font-size: 8px; margin-top: 2px; }
.relationship-meter { height: 4px; margin: 14px 0 7px; overflow: hidden; border-radius: 5px; background: #e9eeeb; }
.relationship-meter span { display: block; height: 100%; border-radius: inherit; background: var(--green); }
.relationship-meta { display: flex; justify-content: space-between; color: var(--muted); font-size: 8px; }
.trusted-tags { display: flex; gap: 5px; margin-top: 12px; }
.trusted-tag { padding: 4px 6px; border-radius: 5px; background: var(--surface-hover); color: var(--ink-soft); font-size: 7px; }

.drawer-backdrop { position: fixed; inset: 0; z-index: 90; background: rgba(16,28,20,.27); backdrop-filter: blur(2px); }
.drawer-backdrop[hidden] { display: none; }
.notification-drawer { width: min(390px, 94vw); height: 100%; margin-left: auto; display: flex; flex-direction: column; background: white; box-shadow: -16px 0 45px rgba(22,38,28,.16); animation: drawerIn .22s ease-out; }
@keyframes drawerIn { from { transform: translateX(35px); opacity: 0; } }
.drawer-head { min-height: 72px; padding: 16px 18px; display: flex; align-items: center; justify-content: space-between; border-bottom: 1px solid var(--line); }
.drawer-head h2 { margin: 0 0 3px; font-size: 16px; }
.drawer-head p { margin: 0; color: var(--muted); font-size: 8px; }
.drawer-tabs { padding: 10px 17px; display: flex; gap: 6px; border-bottom: 1px solid var(--line); }
.drawer-tab { height: 29px; padding: 0 9px; border: 1px solid var(--line); border-radius: 7px; background: white; color: var(--muted); cursor: pointer; font-size: 8px; }
.drawer-tab.active { color: var(--green); border-color: #cce1d4; background: var(--green-soft); font-weight: 700; }
.notification-list { flex: 1; overflow-y: auto; }
.notification-item { width: 100%; min-height: 80px; padding: 14px 17px; display: grid; grid-template-columns: 34px 1fr 7px; align-items: start; gap: 10px; border: 0; border-bottom: 1px solid #edf0ee; background: white; text-align: left; cursor: pointer; }
.notification-item:hover { background: #fafcfb; }
.notification-item.unread { background: #f7fbf8; }
.notification-item .icon-wrap { width: 34px; height: 34px; display: grid; place-items: center; border-radius: 9px; }
.notification-item .icon { width: 15px; }
.notification-copy strong { display: block; font-size: 10px; line-height: 1.4; }
.notification-copy span { display: block; color: var(--muted); font-size: 8px; line-height: 1.5; margin-top: 3px; }
.notification-copy time { display: block; color: #9da6a0; font-size: 7px; margin-top: 5px; }
.notification-unread { width: 6px; height: 6px; margin-top: 5px; border-radius: 50%; background: var(--green); }
.drawer-footer { padding: 12px 17px; border-top: 1px solid var(--line); background: #fafbfa; }
.drawer-footer .btn { width: 100%; }

.profile-hero { padding: 18px; display: flex; align-items: center; gap: 13px; border-radius: 10px; background: linear-gradient(120deg, #eef7f1, #f9fbfa); border: 1px solid #dce9e1; }
.profile-hero .avatar { width: 52px; height: 52px; border-radius: 13px; font-size: 15px; }
.profile-hero-copy { flex: 1; }
.profile-hero-copy h3 { margin: 0 0 4px; font-size: 14px; }
.profile-hero-copy p { margin: 0; color: var(--muted); font-size: 9px; }
.plan-pill { padding: 5px 8px; border-radius: 6px; color: var(--green); background: var(--green-soft); font-size: 8px; font-weight: 700; }
.profile-fields { display: grid; grid-template-columns: 1fr 1fr; gap: 9px; margin-top: 15px; }
.profile-field { padding: 10px 11px; border: 1px solid var(--line); border-radius: 8px; background: #fafbfa; }
.profile-field small { display: block; color: var(--muted); font-size: 7px; margin-bottom: 4px; }
.profile-field strong { font-size: 9px; font-weight: 600; }
.profile-section-title { margin: 17px 0 7px; color: var(--muted); font-size: 8px; font-weight: 750; letter-spacing: .8px; text-transform: uppercase; }

.wizard-steps { display: flex; align-items: center; padding: 13px 20px; border-bottom: 1px solid var(--line); background: #fafbfa; }
.wizard-step { display: flex; align-items: center; gap: 6px; color: var(--muted); font-size: 8px; }
.wizard-step span { width: 20px; height: 20px; display: grid; place-items: center; border-radius: 50%; background: #e9eeeb; font-size: 8px; font-weight: 700; }
.wizard-step.active { color: var(--green); font-weight: 700; }
.wizard-step.active span, .wizard-step.done span { color: white; background: var(--green); }
.wizard-line { flex: 1; margin: 0 8px; border-top: 1px solid #dce2de; }
.permission-list { margin-top: 13px; border: 1px solid var(--line); border-radius: 9px; overflow: hidden; }
.permission-row { min-height: 55px; padding: 10px 12px; display: flex; align-items: center; gap: 10px; border-bottom: 1px solid #edf0ee; }
.permission-row:last-child { border-bottom: 0; }
.permission-row .icon-wrap { width: 29px; height: 29px; display: grid; place-items: center; border-radius: 7px; color: var(--green); background: var(--green-soft); }
.permission-row .icon { width: 13px; }
.permission-copy strong { display: block; font-size: 9px; }
.permission-copy span { color: var(--muted); font-size: 8px; }
.success-check { width: 68px; height: 68px; margin: 7px auto 15px; display: grid; place-items: center; border-radius: 50%; color: white; background: var(--green); box-shadow: 0 0 0 11px var(--green-soft); }
.success-check .icon { width: 29px; }
.success-copy { text-align: center; }
.success-copy h3 { margin: 0 0 5px; font-size: 15px; }
.success-copy p { margin: 0 auto; max-width: 330px; color: var(--muted); font-size: 9px; line-height: 1.6; }
.sync-stages { margin: 18px 0 3px; display: grid; gap: 7px; }
.sync-stage { padding: 9px 10px; display: flex; align-items: center; gap: 8px; border-radius: 7px; background: #f5f7f6; color: var(--muted); font-size: 8px; }
.sync-stage .icon { width: 13px; color: var(--green); }
.sync-stage strong { margin-left: auto; color: var(--ink); font-size: 8px; }
.assistant-result { padding: 14px; border: 1px solid #d9e8df; border-radius: 10px; background: #f7fbf8; }
.assistant-result-head { display: flex; align-items: center; gap: 7px; margin-bottom: 10px; color: var(--green); font-size: 9px; font-weight: 700; }
.assistant-result-head .icon { width: 14px; }
.assistant-result p { margin: 0 0 8px; color: var(--ink-soft); font-size: 10px; line-height: 1.65; }
.assistant-result ul { margin: 8px 0 0; padding-left: 17px; color: var(--ink-soft); font-size: 9px; line-height: 1.7; }
.draft-box { min-height: 160px; width: 100%; padding: 13px; border: 1px solid var(--line); border-radius: 9px; background: #fbfcfb; color: var(--ink-soft); font: 10px/1.7 inherit; resize: vertical; outline: none; }

.modal-backdrop { position: fixed; inset: 0; z-index: 100; padding: 20px; display: grid; place-items: center; background: rgba(13,24,17,.42); backdrop-filter: blur(4px); }
.modal-backdrop[hidden] { display: none; }
.modal { width: min(540px, 100%); max-height: 90vh; overflow-y: auto; border-radius: 15px; background: white; box-shadow: var(--shadow-lg); animation: modalIn .18s ease-out; }
@keyframes modalIn { from { opacity: 0; transform: translateY(8px) scale(.985); } }
.modal-head { padding: 18px 20px; display: flex; align-items: flex-start; justify-content: space-between; border-bottom: 1px solid var(--line); }
.modal-head h2 { margin: 0 0 4px; font-size: 16px; }
.modal-head p { margin: 0; color: var(--muted); font-size: 9px; }
.modal-close { width: 29px; height: 29px; display: grid; place-items: center; border: 0; border-radius: 7px; background: var(--surface-hover); cursor: pointer; color: var(--muted); }
.modal-close .icon { width: 14px; }
.modal-body { padding: 20px; }
.modal-footer { padding: 13px 20px; display: flex; justify-content: flex-end; gap: 7px; border-top: 1px solid var(--line); background: #fafbfa; border-radius: 0 0 15px 15px; }
.provider-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 9px; }
.provider-button { min-height: 82px; padding: 13px; display: flex; align-items: center; gap: 12px; border: 1px solid var(--line); border-radius: 10px; background: white; cursor: pointer; text-align: left; }
.provider-button:hover { border-color: #9fc3ab; background: #f8fcf9; }
.provider-logo { width: 37px; height: 37px; display: grid; place-items: center; border-radius: 9px; color: white; font-weight: 800; font-size: 14px; }
.gmail { background: #d9594f; }
.outlook { background: #3478c5; }
.provider-button strong { display: block; font-size: 10px; }
.provider-button span:last-child { display: block; color: var(--muted); font-size: 8px; margin-top: 3px; }
.digest-preview { border: 1px solid var(--line); border-radius: 10px; overflow: hidden; }
.digest-preview-head { padding: 14px; background: #193d2b; color: white; }
.digest-preview-head small { color: rgba(255,255,255,.6); font-size: 8px; }
.digest-preview-head h3 { margin: 4px 0 0; font-size: 14px; }
.digest-preview-body { padding: 5px 14px; }
.digest-email { padding: 12px 0; display: flex; gap: 9px; border-bottom: 1px solid #edf0ee; }
.digest-email:last-child { border-bottom: 0; }
.digest-email .sender-avatar { width: 29px; height: 29px; }
.digest-email-copy strong { display: block; font-size: 9px; }
.digest-email-copy span { display: block; color: var(--muted); font-size: 8px; margin-top: 3px; }
.scan-animation { padding: 20px 0 10px; text-align: center; }
.scan-orbit { width: 90px; height: 90px; margin: 0 auto 18px; display: grid; place-items: center; border-radius: 50%; border: 1px solid #cfe2d6; position: relative; }
.scan-orbit::before { content: ""; position: absolute; inset: 8px; border-radius: 50%; border: 2px dashed #81b496; animation: spin 4s linear infinite; }
.scan-orbit .icon { width: 29px; color: var(--green); }
@keyframes spin { to { transform: rotate(360deg); } }
.scan-animation h3 { margin: 0 0 5px; font-size: 13px; }
.scan-animation p { margin: 0; color: var(--muted); font-size: 9px; }
.progress-bar { height: 5px; margin-top: 20px; border-radius: 4px; overflow: hidden; background: #e8ece9; }
.progress-bar span { height: 100%; display: block; background: var(--green); animation: progress 2.1s ease-out forwards; }
@keyframes progress { from { width: 4%; } to { width: 100%; } }

.toast-region { position: fixed; z-index: 120; right: 22px; bottom: 22px; display: flex; flex-direction: column; gap: 8px; }
.toast { width: 285px; min-height: 52px; padding: 10px 12px; display: flex; align-items: center; gap: 9px; border: 1px solid #dce5df; border-radius: 10px; background: white; box-shadow: 0 10px 30px rgba(26,43,32,.16); animation: toastIn .25s ease-out; }
@keyframes toastIn { from { opacity: 0; transform: translateY(8px); } }
.toast-icon { width: 28px; height: 28px; display: grid; place-items: center; border-radius: 7px; background: var(--green-soft); color: var(--green); }
.toast-icon .icon { width: 14px; }
.toast-copy strong { display: block; font-size: 10px; }
.toast-copy span { display: block; color: var(--muted); font-size: 8px; margin-top: 2px; }

.icon { display: inline-flex; align-items: center; justify-content: center; }
.icon svg { width: 100%; height: 100%; display: block; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }

body.sidebar-collapsed .sidebar { padding-inline: 10px; }
body.sidebar-collapsed .brand { justify-content: center; padding-inline: 0; }
body.sidebar-collapsed .brand-copy,
body.sidebar-collapsed .compose-label,
body.sidebar-collapsed .nav-label,
body.sidebar-collapsed .nav-text,
body.sidebar-collapsed .nav-count,
body.sidebar-collapsed .status-dot,
body.sidebar-collapsed .connection-status,
body.sidebar-collapsed .profile-copy,
body.sidebar-collapsed .profile-button > .more-icon,
body.sidebar-collapsed .model-top > span:nth-child(2),
body.sidebar-collapsed .model-top > .live-pulse,
body.sidebar-collapsed .model-meter,
body.sidebar-collapsed .model-meta { display: none; }
body.sidebar-collapsed .collapse-btn .icon { transform: rotate(-90deg); }
body.sidebar-collapsed .compose-btn { width: 44px; min-width: 44px; padding: 0; margin-inline: auto; }
body.sidebar-collapsed .nav-groups { margin-top: 20px; }
body.sidebar-collapsed .nav-group { padding-bottom: 13px; margin-bottom: 13px; border-bottom: 1px solid var(--line); }
body.sidebar-collapsed .nav-group:last-child { border-bottom: 0; }
body.sidebar-collapsed .nav-item { width: 44px; height: 42px; padding: 0; margin: 3px auto; justify-content: center; }
body.sidebar-collapsed .nav-item-left { gap: 0; }
body.sidebar-collapsed .nav-item .icon { width: 18px; height: 18px; }
body.sidebar-collapsed .model-card { width: 44px; height: 44px; padding: 8px; margin-inline: auto; display: grid; place-items: center; }
body.sidebar-collapsed .model-top { justify-content: center; }
body.sidebar-collapsed .profile-button { justify-content: center; padding-inline: 0; }
body.sidebar-collapsed .sidebar-footer { padding-top: 10px; }
.mobile-back { display: none; }
.mobile-back .icon { transform: rotate(180deg); }

@media (max-width: 1100px) {
  .metrics-grid { grid-template-columns: repeat(2, 1fr); }
  .inbox-shell { grid-template-columns: minmax(310px, .85fr) minmax(390px, 1.15fr); }
  .banner-stats { gap: 15px; }
}

@media (max-width: 820px) {
  :root { --sidebar-width: 226px; }
  body.sidebar-collapsed { --sidebar-width: 226px; }
  .sidebar { transform: translateX(-100%); transition: transform .2s ease; box-shadow: 15px 0 40px rgba(20,35,25,.12); }
  .sidebar.open { transform: translateX(0); }
  .main-area { width: 100%; margin-left: 0; }
  .mobile-menu { display: grid; }
  .topbar { padding: 0 16px; }
  .workspace { padding: 20px 16px 32px; }
  .top-search { width: 190px; }
  .inbox-shell { grid-template-columns: 1fr; }
  .list-panel { border-right: 0; }
  .detail-panel { display: none; }
  .detail-panel.mobile-visible { display: block; position: fixed; inset: 65px 0 0; z-index: 15; overflow: auto; }
  .detail-content { max-height: none; }
  .overview-grid, .analytics-grid, .settings-layout, .connections-layout { grid-template-columns: 1fr; }
  .recent-card, .domain-table-card { grid-column: auto; }
  .connection-hero { grid-column: auto; }
  .trusted-grid { grid-template-columns: 1fr 1fr; }
  .trusted-summary { grid-column: 1 / -1; }
  .campaign-layout { grid-template-columns: 1fr; }
  .roi-card { grid-template-columns: 1fr 1fr; }
  .roi-lead { grid-column: 1 / -1; }
  .collapse-btn { width: 30px; height: 30px; display: grid; position: static; margin-left: auto; border-radius: 8px; box-shadow: none; }
  .collapse-desktop-icon { display: none; }
  .collapse-mobile-icon { display: inline-flex; width: 15px !important; height: 15px !important; transform: none !important; }
  .sidebar.open + .sidebar-scrim { display: block; position: fixed; inset: 0; z-index: 19; border: 0; background: rgba(13,24,17,.38); backdrop-filter: blur(2px); cursor: pointer; }
  body.sidebar-collapsed .sidebar { padding: 22px 14px 14px; }
  body.sidebar-collapsed .brand { justify-content: flex-start; padding: 0 9px 22px; }
  body.sidebar-collapsed .brand-copy,
  body.sidebar-collapsed .nav-label,
  body.sidebar-collapsed .model-meter { display: block; }
  body.sidebar-collapsed .compose-label,
  body.sidebar-collapsed .nav-text { display: inline; }
  body.sidebar-collapsed .profile-copy,
  body.sidebar-collapsed .model-top > span:nth-child(2),
  body.sidebar-collapsed .model-meta { display: flex; }
  body.sidebar-collapsed .model-top > .live-pulse { display: block; }
  body.sidebar-collapsed .nav-count { display: grid; }
  body.sidebar-collapsed .status-dot { display: inline-block; }
  body.sidebar-collapsed .connection-status { display: flex; }
  body.sidebar-collapsed .profile-button > .more-icon { display: inline-flex; }
  body.sidebar-collapsed .compose-btn { width: 100%; margin: 0; }
  body.sidebar-collapsed .nav-groups { margin-top: 24px; }
  body.sidebar-collapsed .nav-group { padding-bottom: 0; margin-bottom: 25px; border-bottom: 0; }
  body.sidebar-collapsed .nav-item { width: 100%; height: 38px; padding: 0 10px; margin: 1px 0; justify-content: space-between; }
  body.sidebar-collapsed .nav-item-left { gap: 10px; }
  body.sidebar-collapsed .nav-item .icon { width: 17px; height: 17px; }
  body.sidebar-collapsed .model-card { width: auto; height: auto; padding: 11px; margin: 0; display: block; }
  body.sidebar-collapsed .model-top { justify-content: flex-start; }
  body.sidebar-collapsed .profile-button { justify-content: flex-start; padding: 13px 5px 1px; }
  .mobile-back { display: grid; }
  .domain-table-card { overflow-x: auto; }
  .simple-table { min-width: 640px; }
}

@media (max-width: 560px) {
  .breadcrumb span:first-child, .breadcrumb-chevron, .topbar .icon-btn:not(.mobile-menu):not(.notification-btn), .top-search kbd { display: none; }
  .top-search { width: 120px; }
  .workspace { padding: 17px 12px 28px; }
  .page-head { align-items: flex-start; flex-direction: column; }
  .head-actions { width: 100%; flex-wrap: wrap; }
  .head-actions .btn { flex: 1; }
  .page-head h1 { font-size: 22px; }
  .metrics-grid { grid-template-columns: 1fr 1fr; }
  .metric-card { padding: 11px; gap: 8px; }
  .metric-icon { width: 30px; height: 30px; }
  .metric-value strong { font-size: 15px; }
  .metric-value > span { display: none; }
  .signal-banner { align-items: flex-start; }
  .banner-stats { display: none; }
  .digest-layout { grid-template-columns: 1fr; }
  .digest-feature { grid-column: auto; align-items: flex-start; }
  .digest-art { width: 55px; height: 55px; border-radius: 14px; }
  .digest-art .icon { width: 24px; }
  .flow-diagram { gap: 1px; }
  .flow-node { width: 68px; }
  .activity-row { grid-template-columns: 28px 1fr 70px; }
  .activity-secondary, .activity-row > :nth-child(4) { display: none; }
  .provider-grid { grid-template-columns: 1fr; }
  .focus-btn > span:last-child { display: none; }
  .briefing-strip { grid-template-columns: 1fr 1fr 1fr; }
  .briefing-lead { grid-column: 1 / -1; }
  .briefing-stat:first-of-type { border-left: 0; }
  .trusted-grid { grid-template-columns: 1fr; }
  .trusted-summary { grid-column: auto; }
  .profile-fields { grid-template-columns: 1fr; }
  .campaign-metrics { grid-template-columns: 1fr 1fr; }
  .cluster-row { grid-template-columns: 25px 1fr 58px 13px; }
  .cluster-meta { display: none; }
  .roi-card { grid-template-columns: 1fr; }
  .roi-stat { padding: 8px 0 0; border-left: 0; border-top: 1px solid var(--line); }
  .modal-backdrop { padding: 10px; align-items: end; }
  .modal { max-height: 94vh; border-radius: 15px 15px 10px 10px; }
  .chart-summary { flex-wrap: wrap; gap: 7px 14px; }
  .chart-summary .positive-trend { width: 100%; margin-left: 0; }
  .detail-toolbar .detail-actions:last-child .btn { display: none; }
  .ai-action-row { flex-wrap: wrap; }
  .ai-action-row > span { width: 100%; }
  .ai-action-row .btn { flex: 1; padding-inline: 7px; }
}

/* Marketing home page */
.landing-page {
  --landing-ink: #14251c;
  --landing-green: #1e6948;
  --landing-green-dark: #123c2a;
  --landing-sage: #dce9df;
  --landing-cream: #f5f1e8;
  --landing-paper: #fbfaf6;
  --landing-clay: #ad5e49;
  --landing-gold: #b48548;
  --landing-line: rgba(24, 55, 38, .13);
  display: block;
  min-height: 100vh;
  color: var(--landing-ink);
  background: var(--landing-paper);
  overflow: hidden;
}
.landing-mode .app-shell,
.landing-mode .modal-backdrop,
.landing-mode .drawer-backdrop,
.landing-mode .toast-region { display: none !important; }
.dashboard-mode .landing-page { display: none; }
.landing-container { width: min(1180px, calc(100% - 48px)); margin: 0 auto; }
.landing-page a { color: inherit; text-decoration: none; }
.landing-nav {
  height: 76px;
  padding: 0 max(24px, calc((100vw - 1180px) / 2));
  display: flex;
  align-items: center;
  gap: 36px;
  position: absolute;
  inset: 0 0 auto;
  z-index: 10;
  border-bottom: 1px solid rgba(21, 53, 36, .08);
}
.landing-brand, .brand-home { display: inline-flex; align-items: center; gap: 9px; }
.landing-brand { flex: 0 0 auto; }
.landing-brand-mark { width: 31px; height: 31px; display: inline-grid; place-items: center; color: var(--landing-green); }
.landing-brand-mark svg, .landing-brand-mark .icon { width: 100%; height: 100%; }
.landing-brand > span:last-child { display: flex; flex-direction: column; }
.landing-brand strong { font-size: 19px; line-height: 19px; letter-spacing: -.5px; }
.landing-brand small { margin-top: 4px; color: #758078; font-size: 7px; font-weight: 750; letter-spacing: 1.5px; }
.landing-links { margin-left: auto; display: flex; align-items: center; gap: 28px; }
.landing-links button { padding: 0; border: 0; color: #526159; background: transparent; cursor: pointer; font-size: 12px; font-weight: 560; transition: color .18s; }
.landing-links button:hover { color: var(--landing-green); }
.landing-nav-cta {
  min-height: 38px;
  padding: 0 15px;
  display: inline-flex;
  align-items: center;
  gap: 7px;
  border: 1px solid rgba(20, 37, 28, .18);
  border-radius: 9px;
  background: rgba(255,255,255,.55);
  font-size: 11px;
  font-weight: 700;
  transition: background .18s, transform .18s;
}
.landing-nav-cta:hover { background: white; transform: translateY(-1px); }
.landing-nav-cta .icon { width: 13px; }
.landing-hero {
  min-height: 780px;
  padding: 160px 0 0;
  position: relative;
  background:
    radial-gradient(circle at 84% 25%, rgba(202, 217, 201, .56), transparent 30%),
    radial-gradient(circle at 8% 62%, rgba(225, 214, 190, .4), transparent 27%),
    linear-gradient(135deg, #f8f5ed 0%, #fbfaf6 52%, #eef3ec 100%);
}
.landing-hero::after { content: ""; position: absolute; inset: auto 0 0; height: 170px; pointer-events: none; background: linear-gradient(transparent, rgba(251,250,246,.92)); }
.hero-orb { position: absolute; border-radius: 50%; border: 1px solid rgba(37, 94, 63, .09); pointer-events: none; }
.hero-orb::after { content: ""; position: absolute; inset: 18px; border-radius: inherit; border: 1px solid rgba(37, 94, 63, .06); }
.hero-orb-one { width: 430px; height: 430px; right: -190px; top: 110px; animation: slowDrift 10s ease-in-out infinite; }
.hero-orb-two { width: 240px; height: 240px; left: -125px; top: 420px; animation: slowDrift 12s ease-in-out -3s infinite reverse; }
@keyframes slowDrift { 50% { transform: translate3d(0, -14px, 0) rotate(3deg); } }
.hero-layout { display: grid; grid-template-columns: .88fr 1.12fr; align-items: center; gap: 72px; position: relative; z-index: 2; }
.landing-eyebrow, .landing-kicker { color: var(--landing-green); font-size: 10px; font-weight: 780; letter-spacing: 1.55px; text-transform: uppercase; }
.landing-eyebrow { display: flex; align-items: center; gap: 9px; }
.landing-eyebrow > span { width: 24px; height: 1px; background: var(--landing-green); }
.hero-copy h1 { max-width: 560px; margin: 21px 0 22px; font-size: clamp(52px, 5.3vw, 76px); line-height: .98; letter-spacing: -4.2px; font-weight: 690; }
.landing-page h1 em, .landing-page h2 em { color: var(--landing-green); font-family: Georgia, "Times New Roman", serif; font-weight: 400; }
.hero-copy > p { max-width: 540px; margin: 0; color: #5d6c63; font-size: 15px; line-height: 1.75; }
.hero-actions { margin-top: 31px; display: flex; align-items: center; gap: 11px; }
.landing-btn { min-height: 48px; padding: 0 19px; display: inline-flex; align-items: center; justify-content: center; gap: 9px; border-radius: 10px; cursor: pointer; font-size: 12px; font-weight: 720; transition: transform .2s, box-shadow .2s, background .2s; }
.landing-btn:hover { transform: translateY(-2px); }
.landing-btn .icon { width: 15px; height: 15px; }
.landing-btn-primary { color: #fff !important; background: var(--landing-green-dark); box-shadow: 0 9px 24px rgba(20, 61, 43, .18); }
.landing-btn-primary:hover { background: #1d513a; box-shadow: 0 12px 28px rgba(20, 61, 43, .23); }
.landing-btn-secondary { border: 1px solid var(--landing-line); background: rgba(255,255,255,.7); }
.landing-btn-secondary:hover { background: #fff; }
.hero-trust { margin-top: 34px; display: flex; align-items: center; gap: 12px; }
.trust-avatars { display: flex; padding-left: 7px; }
.trust-avatars span { width: 29px; height: 29px; margin-left: -7px; display: grid; place-items: center; border: 2px solid #f8f7f1; border-radius: 50%; color: #fff; background: #557964; font-size: 8px; font-weight: 800; }
.trust-avatars span:nth-child(2) { background: #62738b; }
.trust-avatars span:nth-child(3) { background: #a16b52; }
.hero-trust p { margin: 0; display: flex; flex-direction: column; }
.hero-trust strong { font-size: 10px; }
.hero-trust p span { margin-top: 3px; color: #7b8780; font-size: 8px; }
.hero-product { min-width: 0; position: relative; perspective: 1000px; }
.product-window { position: relative; z-index: 2; border: 1px solid rgba(20, 61, 43, .14); border-radius: 19px; background: rgba(255,255,255,.93); box-shadow: 0 30px 80px rgba(37, 55, 44, .14), 0 4px 15px rgba(37, 55, 44, .07); overflow: hidden; animation: windowFloat 7s ease-in-out infinite; }
@keyframes windowFloat { 50% { transform: translateY(-8px) rotateX(.3deg); } }
.product-window-bar { height: 58px; padding: 0 18px; display: flex; align-items: center; justify-content: space-between; border-bottom: 1px solid #e6ebe7; }
.window-brand { display: flex; align-items: center; gap: 9px; font-size: 11px; font-weight: 750; }
.mini-shield { width: 28px; height: 28px; display: grid; place-items: center; border-radius: 8px; color: var(--landing-green); background: #e6f0e9; }
.mini-shield .icon { width: 15px; }
.window-live { display: inline-flex; align-items: center; gap: 6px; color: #708078; font-size: 8px; font-weight: 650; }
.window-live i { width: 6px; height: 6px; border-radius: 50%; background: #3f8d62; box-shadow: 0 0 0 4px rgba(63,141,98,.1); animation: livePulse 1.8s ease-in-out infinite; }
.classifier-stage { min-height: 334px; padding: 29px 22px; display: grid; grid-template-columns: minmax(145px, 1fr) 100px minmax(155px, 1fr); align-items: center; gap: 13px; position: relative; background: linear-gradient(145deg, #fbfcfa, #f4f7f3); }
.classifier-stage::before { content: ""; position: absolute; left: 29%; right: 28%; top: 50%; border-top: 1px dashed #bfcfc5; }
.classifier-source, .classifier-routes { position: relative; z-index: 1; }
.classifier-source > small, .classifier-routes > small { display: block; margin: 0 0 9px 4px; color: #98a49d; font-size: 7px; font-weight: 750; letter-spacing: 1px; }
.incoming-card, .route-card { min-height: 60px; margin-top: 8px; padding: 9px; display: flex; align-items: center; gap: 8px; border: 1px solid #e2e8e4; border-radius: 10px; background: #fff; box-shadow: 0 3px 10px rgba(25,47,33,.035); }
.incoming-card { animation: incomingShift 5.4s ease-in-out infinite; }
.incoming-two { animation-delay: -1.8s; }
.incoming-three { animation-delay: -3.6s; }
@keyframes incomingShift { 0%, 100% { transform: translateX(0); } 35% { transform: translateX(4px); } 46% { transform: translateX(0); } }
.incoming-avatar { width: 29px; height: 29px; display: grid; place-items: center; flex: 0 0 auto; border-radius: 8px; color: #fff; font-size: 8px; font-weight: 750; }
.blue-avatar { background: #557795; }
.clay-avatar { background: #a96554; }
.gold-avatar { background: #a58252; }
.incoming-card > span:last-child, .route-card > span:nth-child(2) { min-width: 0; display: flex; flex-direction: column; }
.incoming-card strong, .route-card strong { overflow: hidden; font-size: 8px; text-overflow: ellipsis; white-space: nowrap; }
.incoming-card small, .route-card small { margin-top: 4px; color: #8d9992; font-size: 6.5px; white-space: nowrap; }
.classifier-core { width: 96px; height: 96px; position: relative; z-index: 2; display: flex; flex-direction: column; align-items: center; justify-content: center; border-radius: 50%; color: white; background: var(--landing-green-dark); box-shadow: 0 10px 26px rgba(20,61,43,.19); }
.core-rings { position: absolute; inset: -11px; border: 1px solid rgba(35,103,70,.2); border-radius: 50%; animation: corePulse 2.8s ease-out infinite; }
.core-rings::after { content: ""; position: absolute; inset: -10px; border: 1px solid rgba(35,103,70,.1); border-radius: inherit; }
@keyframes corePulse { 50% { transform: scale(1.04); opacity: .55; } }
.core-icon { width: 23px; height: 23px; margin-bottom: 5px; }
.core-icon .icon { width: 100%; height: 100%; }
.classifier-core strong { font-size: 9px; }
.classifier-core small { margin-top: 3px; color: rgba(255,255,255,.58); font-size: 6px; }
.route-card { min-height: 60px; position: relative; }
.route-card > .icon { width: 25px; height: 25px; padding: 6px; flex: 0 0 auto; border-radius: 7px; }
.route-card b { margin-left: auto; font-size: 7px; }
.route-priority > .icon { color: #27724d; background: #e6f1e9; }
.route-priority b { color: #27724d; }
.route-review > .icon { color: #9b6a2d; background: #f6eddc; }
.route-review b { color: #9b6a2d; }
.route-cold > .icon { color: #a05148; background: #f5e7e5; }
.route-cold b { color: #a05148; }
.product-window-foot { min-height: 48px; padding: 0 18px; display: flex; align-items: center; justify-content: space-between; color: #78867e; font-size: 7px; }
.product-window-foot > span { display: flex; align-items: center; gap: 5px; }
.product-window-foot .icon { width: 10px; color: var(--landing-green); }
.product-window-foot strong { color: var(--landing-green); font-size: 7px; }
.floating-proof { position: absolute; z-index: 3; display: flex; align-items: center; border: 1px solid rgba(28,61,42,.12); background: rgba(255,255,255,.94); box-shadow: 0 16px 35px rgba(34,55,42,.13); backdrop-filter: blur(8px); animation: proofFloat 5s ease-in-out infinite; }
@keyframes proofFloat { 50% { transform: translateY(-7px); } }
.proof-one { left: -31px; bottom: 48px; min-width: 178px; padding: 11px 13px; gap: 9px; border-radius: 11px; }
.proof-one > .icon { width: 28px; height: 28px; padding: 7px; border-radius: 8px; color: var(--landing-green); background: #e7f0e9; }
.proof-one > span { display: flex; flex-direction: column; }
.proof-one strong { font-size: 8px; }
.proof-one small { margin-top: 3px; color: #89958e; font-size: 7px; }
.proof-two { right: -26px; top: 54px; padding: 13px 15px; gap: 9px; border-radius: 12px; animation-delay: -2.5s; }
.proof-two strong { color: var(--landing-green); font-size: 20px; letter-spacing: -1px; }
.proof-two span { color: #748078; font-size: 7px; line-height: 1.4; }
.hero-proofbar { min-height: 99px; margin-top: 88px; padding: 0 5px; display: flex; align-items: center; justify-content: space-between; gap: 22px; position: relative; z-index: 2; border-top: 1px solid rgba(24,55,38,.1); }
.hero-proofbar > span { max-width: 135px; color: #879189; font-size: 9px; line-height: 1.45; }
.hero-proofbar > div { display: flex; align-items: center; gap: 8px; color: #5d6b62; font-size: 9px; font-weight: 650; }
.hero-proofbar .icon { width: 18px; color: var(--landing-green); }
.proof-logo { width: 23px; height: 23px; display: inline-grid; place-items: center; border-radius: 6px; color: white; background: #4b7b5e; font-size: 8px; font-weight: 800; }
.proof-ms { background: #4c7196; }
.landing-stats { position: relative; z-index: 2; background: var(--landing-green-dark); }
.stats-row { min-height: 146px; display: grid; grid-template-columns: repeat(4, 1fr); color: white; }
.stats-row > div { padding: 0 34px; display: flex; flex-direction: column; justify-content: center; border-left: 1px solid rgba(255,255,255,.13); }
.stats-row > div:first-child { padding-left: 0; border-left: 0; }
.stats-row strong { font-size: 32px; letter-spacing: -1.7px; font-weight: 640; }
.stats-row sup { margin-left: 2px; color: #b8cebf; font-size: 13px; letter-spacing: 0; }
.stats-row span { margin-top: 7px; color: rgba(255,255,255,.58); font-size: 9px; }
.landing-section { padding: 116px 0; }
.section-intro { max-width: 760px; }
.section-intro h2, .capabilities-copy h2 { margin: 17px 0 20px; font-size: clamp(35px, 4.2vw, 54px); line-height: 1.08; letter-spacing: -2.6px; font-weight: 650; }
.section-intro > p, .capabilities-copy > p { max-width: 670px; margin: 0; color: #67746c; font-size: 13px; line-height: 1.75; }
.section-intro-centered { margin-inline: auto; text-align: center; }
.section-intro-centered > p { margin-inline: auto; }
.problem-section { background: var(--landing-paper); }
.problem-grid { margin-top: 58px; display: grid; grid-template-columns: repeat(4, 1fr); border-top: 1px solid var(--landing-line); border-bottom: 1px solid var(--landing-line); }
.problem-card { min-height: 280px; padding: 28px 24px 30px; position: relative; border-left: 1px solid var(--landing-line); }
.problem-card:first-child { border-left: 0; }
.problem-number { color: #9aa49d; font: italic 11px Georgia, serif; }
.problem-icon { width: 43px; height: 43px; margin-top: 43px; display: grid; place-items: center; border-radius: 12px; color: var(--landing-green); background: #e7eee8; }
.problem-icon .icon { width: 20px; }
.problem-card:nth-child(2) .problem-icon { color: #7f6040; background: #f0e8d9; }
.problem-card:nth-child(3) .problem-icon { color: #8f5549; background: #f1e4e0; }
.problem-card:nth-child(4) .problem-icon { color: #5b647b; background: #e9eaf0; }
.problem-card h3 { margin: 24px 0 10px; font-size: 15px; letter-spacing: -.3px; }
.problem-card p { margin: 0; color: #6f7b73; font-size: 10px; line-height: 1.7; }
.how-section { color: #fff; position: relative; background: #172b21; }
.how-section::before { content: ""; position: absolute; inset: 0; pointer-events: none; background: radial-gradient(circle at 83% 5%, rgba(107,145,119,.17), transparent 30%), linear-gradient(115deg, transparent 0 49.9%, rgba(255,255,255,.025) 50% 50.1%, transparent 50.2%); }
.how-section .landing-container { position: relative; }
.section-intro-light .landing-kicker { color: #9fc1aa; }
.section-intro-light h2 em { color: #b8d1be; }
.section-intro-light > p { color: rgba(255,255,255,.56); }
.process-grid { margin-top: 58px; display: grid; grid-template-columns: repeat(3, 1fr); gap: 14px; }
.process-card { min-height: 300px; padding: 25px; position: relative; border: 1px solid rgba(255,255,255,.11); border-radius: 14px; background: rgba(255,255,255,.035); transition: transform .25s, background .25s; }
.process-card:hover { transform: translateY(-4px); background: rgba(255,255,255,.055); }
.process-step { position: absolute; right: 22px; top: 22px; color: rgba(255,255,255,.28); font: italic 10px Georgia, serif; }
.process-icon { width: 47px; height: 47px; display: grid; place-items: center; border: 1px solid rgba(255,255,255,.09); border-radius: 13px; color: #b9d0bf; background: rgba(255,255,255,.07); }
.process-icon .icon { width: 21px; }
.process-card h3 { margin: 40px 0 13px; font-size: 19px; letter-spacing: -.5px; }
.process-card p { margin: 0; color: rgba(255,255,255,.57); font-size: 10px; line-height: 1.75; }
.process-meta { display: block; margin-top: 27px; color: #a6c1ad; font-size: 8px; font-weight: 650; }
.routing-demo { min-height: 136px; margin-top: 15px; padding: 21px 25px; display: grid; grid-template-columns: 1fr .7fr 1.45fr; align-items: center; gap: 25px; border: 1px solid rgba(255,255,255,.11); border-radius: 14px; background: rgba(255,255,255,.035); }
.routing-source { display: flex; align-items: center; gap: 12px; }
.routing-source > .icon { width: 38px; height: 38px; padding: 9px; border-radius: 10px; color: #b9d0bf; background: rgba(255,255,255,.07); }
.routing-source > span, .routing-outcomes > div > span:last-child { display: flex; flex-direction: column; }
.routing-source small { color: rgba(255,255,255,.35); font-size: 6px; letter-spacing: 1px; }
.routing-source strong { margin-top: 5px; font-size: 10px; }
.routing-line { position: relative; text-align: center; }
.routing-line::before, .routing-line::after { content: ""; position: absolute; top: 6px; width: 50%; border-top: 1px dashed rgba(187,211,194,.3); }
.routing-line::before { right: 75%; }
.routing-line::after { left: 75%; }
.routing-line i { width: 12px; height: 12px; margin: 0 auto 8px; display: block; border: 3px solid #9fbea8; border-radius: 50%; animation: livePulse 1.8s infinite; }
.routing-line span { color: rgba(255,255,255,.42); font-size: 7px; }
.routing-outcomes { display: grid; grid-template-columns: repeat(3, 1fr); gap: 8px; }
.routing-outcomes > div { min-height: 64px; padding: 10px; display: flex; align-items: center; gap: 8px; border-radius: 9px; background: rgba(255,255,255,.055); }
.route-dot { width: 7px; height: 7px; flex: 0 0 auto; border-radius: 50%; }
.priority-dot { background: #75a789; }
.review-dot { background: #c79a58; }
.cold-dot { background: #b36d61; }
.routing-outcomes strong { font-size: 8px; }
.routing-outcomes small { margin-top: 4px; color: rgba(255,255,255,.37); font-size: 6px; }
.alignment-section { background: var(--landing-cream); }
.alignment-table { margin-top: 55px; border: 1px solid rgba(39,64,48,.14); border-radius: 14px; background: #fbfaf6; overflow: hidden; }
.alignment-head, .alignment-row { display: grid; grid-template-columns: 1.2fr 1.25fr .55fr; gap: 24px; align-items: center; }
.alignment-head { min-height: 49px; padding: 0 22px; color: #8b958e; background: #f1ede4; font-size: 7px; font-weight: 750; letter-spacing: 1px; text-transform: uppercase; }
.alignment-row { min-height: 112px; padding: 18px 22px; border-top: 1px solid rgba(39,64,48,.11); }
.alignment-row > div:first-child { display: flex; align-items: center; gap: 13px; }
.align-icon { width: 39px; height: 39px; display: grid; place-items: center; flex: 0 0 auto; border-radius: 10px; color: var(--landing-green); background: #e5eee7; }
.align-icon .icon { width: 18px; }
.alignment-row > div:first-child > span:last-child { display: flex; flex-direction: column; }
.alignment-row strong { font-size: 10px; }
.alignment-row small { margin-top: 5px; color: #89948d; font-size: 7px; line-height: 1.4; }
.alignment-row p { margin: 0; color: #657269; font-size: 9px; line-height: 1.65; }
.alignment-row > a { display: flex; align-items: center; justify-content: flex-end; gap: 5px; color: var(--landing-green); font-size: 8px; font-weight: 750; }
.alignment-row > a:hover { text-decoration: underline; }
.alignment-row > a .icon { width: 11px; }
.solution-section { background: #faf9f5; }
.solution-grid { margin-top: 55px; display: grid; grid-template-columns: repeat(3, 1fr); gap: 14px; }
.solution-card { min-height: 430px; padding: 28px; display: flex; flex-direction: column; position: relative; border: 1px solid var(--landing-line); border-radius: 15px; background: #fff; transition: transform .24s, box-shadow .24s; }
.solution-card:hover { transform: translateY(-5px); box-shadow: 0 20px 42px rgba(31,50,38,.09); }
.solution-card.featured { color: white; border-color: #1a4934; background: var(--landing-green-dark); box-shadow: 0 18px 40px rgba(24,57,40,.13); }
.solution-label { color: #8a968f; font-size: 7px; font-weight: 780; letter-spacing: 1.1px; text-transform: uppercase; }
.featured .solution-label { color: #a8c3af; }
.solution-icon { width: 47px; height: 47px; margin-top: 41px; display: grid; place-items: center; border-radius: 13px; color: var(--landing-green); background: #e6eee8; }
.featured .solution-icon { color: #c5dbc9; background: rgba(255,255,255,.08); }
.solution-icon .icon { width: 21px; }
.solution-card h3 { margin: 22px 0 13px; font-size: 19px; letter-spacing: -.6px; }
.solution-card p { margin: 0; color: #6b786f; font-size: 10px; line-height: 1.7; }
.featured p { color: rgba(255,255,255,.56); }
.solution-card ul { margin: 21px 0 24px; padding: 18px 0 0; list-style: none; border-top: 1px solid var(--landing-line); }
.featured ul { border-color: rgba(255,255,255,.11); }
.solution-card li { margin: 9px 0; padding-left: 16px; position: relative; color: #526158; font-size: 9px; }
.featured li { color: rgba(255,255,255,.67); }
.solution-card li::before { content: ""; width: 5px; height: 5px; position: absolute; left: 0; top: 3px; border-radius: 50%; background: #6b987b; }
.solution-card > a { margin-top: auto; display: flex; align-items: center; gap: 6px; color: var(--landing-green); font-size: 9px; font-weight: 750; }
.featured > a { color: #c4dbc9; }
.solution-card > a .icon { width: 12px; transition: transform .18s; }
.solution-card > a:hover .icon { transform: translateX(3px); }
.capabilities-section { background: var(--landing-cream); }
.capabilities-layout { display: grid; grid-template-columns: .72fr 1.28fr; gap: 78px; align-items: center; }
.capabilities-copy h2 { font-size: clamp(35px, 3.8vw, 49px); }
.capabilities-copy .landing-btn { margin-top: 28px; }
.capability-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
.capability-card { min-height: 139px; padding: 21px; display: flex; align-items: flex-start; gap: 15px; border: 1px solid rgba(39,64,48,.12); border-radius: 13px; background: rgba(255,255,255,.62); transition: background .2s, transform .2s; }
.capability-card:hover { transform: translateY(-3px); background: white; }
.capability-card > .icon { width: 37px; height: 37px; padding: 9px; flex: 0 0 auto; border-radius: 10px; color: var(--landing-green); background: #e4ede6; }
.capability-card h3 { margin: 2px 0 8px; font-size: 12px; }
.capability-card p { margin: 0; color: #707c74; font-size: 8px; line-height: 1.6; }
.architecture-section { background: #fbfaf6; }
.architecture-flow { margin-top: 57px; display: grid; grid-template-columns: 1fr 55px 1.05fr 55px 1fr; align-items: center; }
.architecture-column { min-height: 310px; padding: 22px; border: 1px solid var(--landing-line); border-radius: 14px; background: white; }
.architecture-column > small { display: block; margin-bottom: 27px; color: #8e9992; font-size: 7px; font-weight: 750; letter-spacing: 1px; }
.architecture-column > div { min-height: 59px; padding: 10px; display: flex; align-items: center; gap: 11px; border-bottom: 1px solid #e8ebe8; }
.architecture-column > div:last-child { border-bottom: 0; }
.architecture-column > div > .icon { width: 31px; height: 31px; padding: 7px; flex: 0 0 auto; border-radius: 8px; color: var(--landing-green); background: #e6eee8; }
.architecture-column > div > span:last-child { display: flex; flex-direction: column; }
.architecture-column strong { font-size: 9px; }
.architecture-column div small { margin-top: 4px; color: #929c96; font-size: 7px; }
.architecture-arrow { width: 25px; height: 25px; margin: auto; display: grid; place-items: center; border-radius: 50%; color: #708078; background: #e9eee9; }
.architecture-arrow .icon { width: 11px; }
.architecture-column .architecture-core { border: 0; border-radius: 9px; color: white; background: var(--landing-green-dark); }
.architecture-column .architecture-core > .icon { color: white; background: rgba(255,255,255,.1); }
.architecture-column .architecture-core small { color: rgba(255,255,255,.53); }
.intelligence-column ul { margin: 16px 0 0; padding: 0; list-style: none; }
.intelligence-column li { padding: 7px 0 7px 17px; position: relative; color: #69766e; font-size: 8px; }
.intelligence-column li::before { content: ""; width: 5px; height: 5px; position: absolute; left: 1px; top: 10px; border-radius: 50%; background: #71937d; }
.foundation-row { margin-top: 15px; display: grid; grid-template-columns: repeat(3, 1fr); border: 1px solid var(--landing-line); border-radius: 13px; background: var(--landing-cream); overflow: hidden; }
.foundation-row > div { min-height: 116px; padding: 20px; display: flex; gap: 12px; border-left: 1px solid var(--landing-line); }
.foundation-row > div:first-child { border-left: 0; }
.foundation-row > div > span { color: var(--landing-green); font: italic 10px Georgia, serif; }
.foundation-row p { margin: 0; color: #707d74; font-size: 8px; line-height: 1.6; }
.foundation-row strong { display: block; margin-bottom: 6px; color: var(--landing-ink); font-size: 9px; }
.landing-cta { padding: 0 0 88px; background: #fbfaf6; }
.cta-panel { min-height: 370px; padding: 58px 65px; display: grid; grid-template-columns: 1fr .55fr; align-items: center; gap: 55px; position: relative; color: white; border-radius: 21px; background: var(--landing-green-dark); overflow: hidden; }
.cta-panel::before, .cta-panel::after { content: ""; position: absolute; border: 1px solid rgba(255,255,255,.08); border-radius: 50%; }
.cta-panel::before { width: 420px; height: 420px; right: -170px; top: -240px; box-shadow: 0 0 0 40px rgba(255,255,255,.015), 0 0 0 80px rgba(255,255,255,.012); }
.cta-panel::after { width: 200px; height: 200px; left: -110px; bottom: -130px; }
.cta-panel > div { position: relative; z-index: 1; }
.cta-panel .landing-kicker { color: #a7c1ae; }
.cta-panel h2 { margin: 17px 0 16px; font-size: clamp(39px, 4.5vw, 57px); line-height: 1.03; letter-spacing: -2.7px; }
.cta-panel p { max-width: 600px; margin: 0; color: rgba(255,255,255,.55); font-size: 11px; line-height: 1.7; }
.cta-actions { display: flex; flex-direction: column; align-items: flex-start; gap: 17px; }
.landing-btn-light { color: var(--landing-green-dark) !important; background: white; box-shadow: 0 12px 27px rgba(0,0,0,.13); }
.cta-actions > a:last-child { display: flex; align-items: center; gap: 5px; color: #b7cdbd; font-size: 9px; font-weight: 650; }
.landing-footer { background: #101c16; color: #fff; }
.landing-footer .landing-container { min-height: 116px; display: flex; align-items: center; gap: 30px; }
.landing-brand-footer .landing-brand-mark { width: 29px; height: 29px; padding: 5px; border-radius: 8px; color: #c3d7c8; background: rgba(255,255,255,.08); }
.landing-brand-footer small { color: rgba(255,255,255,.4); }
.landing-footer p { margin: 0 auto 0 0; color: rgba(255,255,255,.4); font-size: 8px; }
.landing-footer > div > a:last-child { display: flex; align-items: center; gap: 6px; color: #b9cdbd; font-size: 9px; font-weight: 650; }
.landing-footer > div > a:last-child .icon { width: 11px; }
.brand-home { min-width: 0; color: inherit; text-decoration: none; }
.reveal { opacity: 0; transform: translateY(22px); transition: opacity .72s ease, transform .72s cubic-bezier(.2,.7,.2,1); }
.reveal.is-visible { opacity: 1; transform: translateY(0); }
.problem-grid .reveal:nth-child(2), .process-grid .reveal:nth-child(2), .solution-grid .reveal:nth-child(2), .capability-grid .reveal:nth-child(2) { transition-delay: .08s; }
.problem-grid .reveal:nth-child(3), .process-grid .reveal:nth-child(3), .solution-grid .reveal:nth-child(3), .capability-grid .reveal:nth-child(3) { transition-delay: .16s; }
.problem-grid .reveal:nth-child(4), .capability-grid .reveal:nth-child(4) { transition-delay: .24s; }
.capability-grid .reveal:nth-child(5) { transition-delay: .12s; }
.capability-grid .reveal:nth-child(6) { transition-delay: .2s; }

@media (max-width: 1040px) {
  .landing-links { display: none; }
  .landing-nav-cta { margin-left: auto; }
  .hero-layout { grid-template-columns: 1fr; gap: 58px; }
  .landing-hero { padding-top: 140px; }
  .hero-copy { max-width: 690px; }
  .hero-product { width: min(690px, 100%); margin: 0 auto; }
  .hero-proofbar { margin-top: 78px; }
  .problem-grid { grid-template-columns: 1fr 1fr; }
  .problem-card:nth-child(3) { border-left: 0; }
  .problem-card:nth-child(-n+2) { border-bottom: 1px solid var(--landing-line); }
  .capabilities-layout { grid-template-columns: 1fr; gap: 45px; }
  .capabilities-copy { max-width: 680px; }
}

@media (max-width: 820px) {
  .landing-container { width: min(100% - 32px, 680px); }
  .landing-nav { height: 68px; padding-inline: 16px; }
  .landing-nav-cta { min-height: 36px; padding-inline: 12px; }
  .landing-hero { min-height: auto; padding-top: 125px; }
  .hero-copy h1 { letter-spacing: -3px; }
  .classifier-stage { padding-inline: 14px; grid-template-columns: minmax(125px, 1fr) 80px minmax(130px, 1fr); gap: 7px; }
  .classifier-core { width: 78px; height: 78px; }
  .incoming-card, .route-card { padding: 7px; }
  .hero-proofbar { min-height: 150px; display: grid; grid-template-columns: 1fr 1fr; justify-items: start; }
  .hero-proofbar > span { grid-column: 1 / -1; max-width: none; }
  .landing-stats { margin-top: 0; }
  .stats-row { grid-template-columns: 1fr 1fr; padding-block: 18px; }
  .stats-row > div { min-height: 100px; padding-left: 25px; }
  .stats-row > div:nth-child(3) { border-left: 0; }
  .landing-section { padding: 86px 0; }
  .process-grid, .solution-grid { grid-template-columns: 1fr; }
  .process-card, .solution-card { min-height: auto; }
  .routing-demo { grid-template-columns: 1fr; }
  .routing-line::before, .routing-line::after { display: none; }
  .alignment-head { display: none; }
  .alignment-row { grid-template-columns: 1fr; gap: 14px; padding: 22px; }
  .alignment-row > a { justify-content: flex-start; }
  .architecture-flow { grid-template-columns: 1fr; gap: 10px; }
  .architecture-arrow { transform: rotate(90deg); }
  .architecture-column { min-height: auto; width: 100%; }
  .foundation-row { grid-template-columns: 1fr; }
  .foundation-row > div { border-left: 0; border-top: 1px solid var(--landing-line); }
  .foundation-row > div:first-child { border-top: 0; }
  .cta-panel { padding: 48px 38px; grid-template-columns: 1fr; gap: 35px; }
}

@media (max-width: 560px) {
  .landing-container { width: calc(100% - 24px); }
  .landing-nav { padding-inline: 12px; }
  .landing-brand strong { font-size: 17px; }
  .landing-brand-mark { width: 28px; height: 28px; }
  .landing-nav-cta { font-size: 9px; }
  .landing-nav-cta .icon { display: none; }
  .landing-hero { padding-top: 112px; }
  .hero-copy h1 { margin-top: 16px; font-size: 45px; letter-spacing: -2.8px; }
  .hero-copy > p { font-size: 13px; line-height: 1.65; }
  .hero-actions { align-items: stretch; flex-direction: column; }
  .landing-btn { width: 100%; }
  .hero-trust { margin-top: 28px; }
  .hero-product { width: calc(100% + 4px); }
  .classifier-stage { min-height: 480px; padding: 22px 13px; grid-template-columns: 1fr 67px 1fr; align-items: center; }
  .classifier-stage::before { left: 31%; right: 31%; }
  .classifier-core { width: 65px; height: 65px; }
  .core-icon { width: 18px; height: 18px; }
  .classifier-core strong { font-size: 7px; }
  .classifier-core small { display: none; }
  .incoming-card, .route-card { min-height: 71px; align-items: flex-start; flex-direction: column; }
  .incoming-card > span:last-child, .route-card > span:nth-child(2) { width: 100%; }
  .incoming-card strong, .route-card strong { max-width: 100%; }
  .incoming-card small, .route-card small { overflow: hidden; max-width: 100%; text-overflow: ellipsis; }
  .route-card { position: relative; }
  .route-card b { position: absolute; top: 10px; right: 7px; }
  .proof-one { left: 8px; bottom: -35px; }
  .proof-two { right: 7px; top: -31px; }
  .product-window-foot { padding-inline: 12px; }
  .product-window-foot > span { display: none; }
  .product-window-foot strong { margin-left: auto; }
  .hero-proofbar { margin-top: 90px; }
  .stats-row strong { font-size: 25px; }
  .stats-row > div { min-height: 88px; padding: 10px 15px; }
  .landing-section { padding: 72px 0; }
  .section-intro h2, .capabilities-copy h2 { font-size: 36px; letter-spacing: -1.8px; }
  .problem-grid { grid-template-columns: 1fr; }
  .problem-card { min-height: 230px; border-left: 0; border-top: 1px solid var(--landing-line); }
  .problem-card:first-child { border-top: 0; }
  .problem-card:nth-child(-n+2) { border-bottom: 0; }
  .problem-icon { margin-top: 26px; }
  .routing-outcomes { grid-template-columns: 1fr; }
  .capability-grid { grid-template-columns: 1fr; }
  .capability-card { min-height: 120px; }
  .cta-panel { width: calc(100% - 24px); min-height: 460px; padding: 42px 25px; border-radius: 16px; }
  .cta-panel h2 { font-size: 39px; }
  .landing-footer .landing-container { min-height: 155px; align-items: flex-start; flex-direction: column; justify-content: center; gap: 15px; }
  .landing-footer p { margin: 0; }
}

@media (prefers-reduced-motion: reduce) {
  .landing-page *, .landing-page *::before, .landing-page *::after { scroll-behavior: auto !important; animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; }
  .reveal { opacity: 1; transform: none; }
}

/* Interactive product experience */
.experience-section { background: #fbfaf6; }
.home-demo-shell { margin-top: 58px; position: relative; border: 1px solid rgba(24,55,38,.15); border-radius: 18px; background: #fff; box-shadow: 0 24px 65px rgba(32,52,39,.11); overflow: hidden; }
.home-demo-shell::after { content: ""; width: 35%; height: 200%; position: absolute; z-index: 7; left: -50%; top: -50%; pointer-events: none; opacity: 0; transform: skewX(-18deg); background: linear-gradient(90deg, transparent, rgba(106,156,123,.13), transparent); }
.home-demo-shell.processing::after { animation: demoScan 1.25s ease-in-out; }
@keyframes demoScan { 0% { left: -50%; opacity: 0; } 20% { opacity: 1; } 100% { left: 120%; opacity: 0; } }
.home-demo-topbar { min-height: 72px; padding: 0 20px; display: grid; grid-template-columns: 1fr auto auto; align-items: center; gap: 25px; border-bottom: 1px solid #e4e9e5; background: #fdfefc; }
.home-demo-brand { display: flex; align-items: center; gap: 10px; }
.home-demo-brand > span:last-child { display: flex; flex-direction: column; }
.home-demo-brand strong { font-size: 11px; }
.home-demo-brand small { margin-top: 4px; color: #8c9790; font-size: 7px; }
.home-demo-status { display: grid; grid-template-columns: auto auto; align-items: center; column-gap: 9px; }
.home-demo-status > span { display: flex; align-items: center; gap: 6px; color: #577263; font-size: 8px; font-weight: 700; }
.home-demo-status i, .home-list-live i { width: 6px; height: 6px; display: inline-block; border-radius: 50%; background: #3f9565; box-shadow: 0 0 0 4px rgba(63,149,101,.1); animation: livePulse 1.8s infinite; }
.home-demo-status b { font-size: 11px; }
.home-demo-status > small { grid-column: 2; color: #9aa39d; font-size: 6px; }
.home-process-btn { min-height: 39px; padding: 0 14px; display: flex; align-items: center; gap: 7px; border: 0; border-radius: 9px; color: #fff; background: var(--landing-green-dark); cursor: pointer; font-size: 9px; font-weight: 720; transition: background .18s, transform .18s; }
.home-process-btn:hover { background: #1d513a; transform: translateY(-1px); }
.home-process-btn:disabled { cursor: wait; opacity: .7; transform: none; }
.home-process-btn .icon { width: 14px; }
.home-demo-tabs { min-height: 54px; padding: 8px 14px; display: flex; gap: 6px; border-bottom: 1px solid #e4e9e5; background: #f6f8f6; }
.home-demo-tabs button { min-height: 37px; padding: 0 13px; display: flex; align-items: center; gap: 7px; border: 1px solid transparent; border-radius: 8px; color: #6d7972; background: transparent; cursor: pointer; font-size: 9px; font-weight: 650; transition: background .18s, color .18s, border-color .18s; }
.home-demo-tabs button:hover { color: var(--landing-ink); background: rgba(255,255,255,.7); }
.home-demo-tabs button.active { color: var(--landing-green); border-color: #d9e5dc; background: #fff; box-shadow: 0 2px 6px rgba(28,48,35,.04); }
.home-demo-tabs .icon { width: 14px; }
.home-demo-tabs b { min-width: 20px; padding: 3px 5px; border-radius: 10px; color: #718078; background: #e8ece9; text-align: center; font-size: 7px; }
.home-demo-tabs button.active b { color: var(--landing-green); background: #e9f2ec; }
.home-demo-processing { max-height: 0; padding: 0 23px; display: flex; align-items: center; gap: 12px; color: #fff; background: linear-gradient(90deg, #173d2b, #245a3e); opacity: 0; overflow: hidden; transition: max-height .28s ease, padding .28s ease, opacity .2s; }
.processing .home-demo-processing { max-height: 76px; padding-block: 13px; opacity: 1; }
.processing-orbit { width: 36px; height: 36px; display: grid; place-items: center; flex: 0 0 auto; position: relative; border: 1px solid rgba(255,255,255,.18); border-radius: 50%; }
.processing-orbit::before { content: ""; position: absolute; inset: 4px; border: 1px dashed rgba(255,255,255,.45); border-radius: inherit; animation: spin 2.2s linear infinite; }
.processing-orbit .icon { width: 15px; }
.home-demo-processing > span:nth-child(2) { display: flex; flex: 1; flex-direction: column; }
.home-demo-processing strong { font-size: 9px; }
.home-demo-processing small { margin-top: 4px; color: rgba(255,255,255,.57); font-size: 7px; }
.home-demo-processing > b { font-size: 8px; color: #b9d0bf; }
.home-demo-workspace { min-height: 515px; display: grid; grid-template-columns: minmax(300px,.78fr) minmax(430px,1.22fr); }
.home-demo-list { min-width: 0; border-right: 1px solid #e4e9e5; background: #fbfcfb; }
.home-demo-listhead { min-height: 64px; padding: 13px 16px; display: flex; align-items: center; justify-content: space-between; border-bottom: 1px solid #e7ebe8; background: #fff; }
.home-demo-listhead > span:first-child { display: flex; flex-direction: column; }
.home-demo-listhead strong { font-size: 10px; }
.home-demo-listhead small { margin-top: 4px; color: #919b95; font-size: 7px; }
.home-list-live { display: flex; align-items: center; gap: 6px; color: var(--landing-green); font-size: 7px; font-weight: 700; }
.home-list-live i { width: 5px; height: 5px; }
.home-demo-email { width: 100%; min-height: 106px; padding: 15px 14px; display: grid; grid-template-columns: 35px 1fr; gap: 10px; position: relative; border: 0; border-bottom: 1px solid #e8ece9; background: transparent; cursor: pointer; text-align: left; transition: background .18s; }
.home-demo-email:hover { background: #f4f8f5; }
.home-demo-email.active { background: #edf4ef; }
.home-demo-email.active::before { content: ""; width: 3px; position: absolute; inset: 0 auto 0 0; background: var(--landing-green); }
.home-demo-email.entering { animation: emailArrive .42s cubic-bezier(.2,.8,.2,1); }
@keyframes emailArrive { from { opacity: 0; transform: translateX(-18px); } }
.home-demo-email .incoming-avatar { width: 35px; height: 35px; }
.home-email-copy { min-width: 0; }
.home-email-from { display: flex; gap: 8px; }
.home-email-from strong { flex: 1; overflow: hidden; font-size: 9px; text-overflow: ellipsis; white-space: nowrap; }
.home-email-from time { color: #969f99; font-size: 7px; }
.home-email-subject { margin-top: 5px; display: block; overflow: hidden; color: #3f4e45; font-size: 9px; font-weight: 650; text-overflow: ellipsis; white-space: nowrap; }
.home-email-snippet { margin-top: 5px; display: block; overflow: hidden; color: #8a958f; font-size: 7px; text-overflow: ellipsis; white-space: nowrap; }
.home-email-meta { margin-top: 10px; display: flex; align-items: center; justify-content: space-between; }
.home-email-pill { padding: 4px 6px; display: inline-flex; align-items: center; gap: 4px; border-radius: 5px; font-size: 6px; font-weight: 750; }
.home-email-pill .icon { width: 9px; }
.home-pill-priority { color: #24704a; background: #e2efe7; }
.home-pill-review { color: #94662f; background: #f3ead9; }
.home-pill-cold { color: #9d4f47; background: #f3e5e3; }
.home-email-meta > small { color: #96a19a; font-size: 6px; }
.home-demo-detail { min-width: 0; padding: 28px 31px; background: white; animation: detailFade .25s ease; }
@keyframes detailFade { from { opacity: .45; transform: translateY(3px); } }
.home-detail-head { padding-bottom: 20px; display: flex; align-items: center; gap: 12px; border-bottom: 1px solid #e8ece9; }
.home-detail-head .incoming-avatar { width: 42px; height: 42px; border-radius: 11px; }
.home-detail-person { min-width: 0; flex: 1; display: flex; flex-direction: column; }
.home-detail-person strong { font-size: 11px; }
.home-detail-person span { margin-top: 4px; color: #8c9790; font-size: 7px; }
.home-decision-badge { padding: 7px 9px; display: flex; align-items: center; gap: 6px; border-radius: 7px; font-size: 7px; font-weight: 750; }
.home-decision-badge .icon { width: 12px; }
.home-detail-subject { margin: 24px 0 14px; font-size: 20px; line-height: 1.25; letter-spacing: -.55px; }
.home-detail-message { margin: 0; color: #657269; font-size: 9px; line-height: 1.8; }
.home-intelligence-panel { margin-top: 23px; padding: 17px; border: 1px solid #dce7df; border-radius: 11px; background: #f5f9f6; }
.home-intelligence-panel.attention { animation: intelligenceAttention .8s ease; }
@keyframes intelligenceAttention { 35% { border-color: #6f9c7f; box-shadow: 0 0 0 5px rgba(74,126,92,.11); transform: translateY(-2px); } }
.correction-saved .home-demo-processing { background: linear-gradient(90deg, #294a38, #526a49); }
.home-intelligence-head { display: flex; align-items: center; gap: 12px; }
.home-confidence-ring { width: 50px; height: 50px; padding: 5px; display: grid; place-items: center; flex: 0 0 auto; border-radius: 50%; background: conic-gradient(var(--landing-green) var(--confidence), #dce6df 0); animation: confidenceIn .7s ease-out; }
@keyframes confidenceIn { from { transform: rotate(-25deg) scale(.85); opacity: .4; } }
.home-confidence-ring::before { content: ""; grid-area: 1/1; width: 39px; height: 39px; border-radius: 50%; background: #fff; }
.home-confidence-ring strong { grid-area: 1/1; z-index: 1; color: var(--landing-green); font-size: 10px; }
.home-intelligence-title { flex: 1; }
.home-intelligence-title strong { display: block; font-size: 9px; }
.home-intelligence-title span { display: block; margin-top: 4px; color: #7d8981; font-size: 7px; }
.home-route-outcome { padding: 7px 9px; display: flex; align-items: center; gap: 6px; border-radius: 7px; color: var(--landing-green); background: #e5efe8; font-size: 7px; font-weight: 700; }
.home-route-outcome .icon { width: 12px; }
.home-evidence-label { margin-top: 17px; color: #8d9891; font-size: 6px; font-weight: 750; letter-spacing: 1px; }
.home-evidence-chips { margin-top: 8px; display: flex; flex-wrap: wrap; gap: 6px; }
.home-evidence-chips span { padding: 6px 7px; display: inline-flex; align-items: center; gap: 5px; border: 1px solid #dfe6e1; border-radius: 6px; color: #5e6e64; background: #fff; font-size: 6px; animation: evidenceIn .38s both; }
.home-evidence-chips span:nth-child(2) { animation-delay: .07s; }
.home-evidence-chips span:nth-child(3) { animation-delay: .14s; }
.home-evidence-chips span:nth-child(4) { animation-delay: .21s; }
@keyframes evidenceIn { from { opacity: 0; transform: translateY(5px); } }
.home-evidence-chips .icon { width: 9px; color: var(--landing-green); }
.home-detail-actions { margin-top: 22px; display: flex; align-items: center; gap: 8px; }
.home-detail-actions a, .home-detail-actions button { min-height: 36px; padding: 0 12px; display: inline-flex; align-items: center; gap: 6px; border: 1px solid #d9e0db; border-radius: 8px; background: #fff; cursor: pointer; font-size: 8px; font-weight: 700; }
.home-detail-actions .primary { color: #fff; border-color: var(--landing-green-dark); background: var(--landing-green-dark); }
.home-detail-actions .icon { width: 12px; }
.home-demo-footer { min-height: 51px; padding: 0 20px; display: flex; align-items: center; justify-content: space-between; gap: 18px; border-top: 1px solid #e4e9e5; background: #f8faf8; }
.home-demo-footer > span { display: flex; align-items: center; gap: 6px; color: #7b8780; font-size: 7px; }
.home-demo-footer > span .icon { width: 11px; color: var(--landing-green); }
.home-demo-footer a { display: flex; align-items: center; gap: 5px; color: var(--landing-green); font-size: 8px; font-weight: 750; }
.home-demo-footer a .icon { width: 11px; }
.home-analytics-preview { margin-top: 21px; padding: 21px; display: grid; grid-template-columns: 1fr 1.1fr .52fr; gap: 14px; border: 1px solid rgba(24,55,38,.13); border-radius: 16px; background: var(--landing-cream); }
.home-analytics-copy { padding: 18px 14px; }
.home-analytics-copy h3 { margin: 13px 0 10px; font-size: 22px; line-height: 1.15; letter-spacing: -.7px; }
.home-analytics-copy > p { margin: 0; color: #707d74; font-size: 8px; line-height: 1.65; }
.home-analytics-metrics { margin-top: 23px; display: grid; grid-template-columns: repeat(3, 1fr); gap: 9px; }
.home-analytics-metrics > div { display: flex; flex-direction: column; }
.home-analytics-metrics strong { font-size: 16px; letter-spacing: -.6px; }
.home-analytics-metrics > div > span { margin-top: 5px; color: #8a958e; font-size: 6px; }
.home-chart-card, .home-health-card { padding: 16px; border: 1px solid #dfe5e0; border-radius: 11px; background: #fff; }
.home-chart-head { display: flex; align-items: center; justify-content: space-between; }
.home-chart-head > span:first-child { display: flex; flex-direction: column; }
.home-chart-head strong { font-size: 9px; }
.home-chart-head small { margin-top: 4px; color: #929c96; font-size: 6px; }
.home-range-pill { padding: 5px 6px; border-radius: 5px; color: var(--landing-green); background: #e8f1ea; font-size: 6px; font-weight: 750; }
.home-chart-bars { height: 130px; margin-top: 15px; padding: 10px 4px 0; display: flex; align-items: flex-end; justify-content: space-between; gap: 5px; border-bottom: 1px solid #dce3de; background: repeating-linear-gradient(to bottom, transparent 0 32px, #eef1ef 33px); }
.home-chart-bars > span { height: 100%; flex: 1; display: flex; align-items: flex-end; gap: 2px; }
.home-chart-bars > span::before, .home-chart-bars > span::after { content: ""; flex: 1; border-radius: 3px 3px 0 0; transform: scaleY(0); transform-origin: bottom; animation: homeBars .8s cubic-bezier(.2,.75,.2,1) forwards; }
.home-analytics-preview:not(.is-visible) .home-chart-bars > span::before, .home-analytics-preview:not(.is-visible) .home-chart-bars > span::after { animation-play-state: paused; }
.home-chart-bars > span::before { height: var(--signal); background: #79bd96; }
.home-chart-bars > span::after { height: var(--noise); background: #d89088; animation-delay: .09s; }
@keyframes homeBars { to { transform: scaleY(1); } }
.home-chart-legend { margin-top: 9px; display: flex; align-items: center; gap: 12px; color: #859088; font-size: 6px; }
.home-chart-legend span { display: flex; align-items: center; gap: 4px; }
.home-chart-legend i { width: 6px; height: 6px; border-radius: 2px; background: #79bd96; }
.home-chart-legend span:nth-child(2) i { background: #d89088; }
.home-chart-legend b { margin-left: auto; color: #87948c; font-size: 6px; font-weight: 600; }
.home-health-card { display: flex; align-items: center; flex-direction: column; justify-content: center; text-align: center; }
.home-health-ring { width: 96px; height: 96px; padding: 10px; display: grid; place-items: center; border-radius: 50%; background: conic-gradient(var(--landing-green) 0 89%, #dfe7e1 89%); animation: healthIn .9s ease-out; }
@keyframes healthIn { from { transform: rotate(-40deg) scale(.8); opacity: .3; } }
.home-health-ring > span { width: 76px; height: 76px; display: flex; align-items: center; flex-direction: column; justify-content: center; border-radius: 50%; background: #fff; }
.home-health-ring strong { font-size: 24px; letter-spacing: -1.2px; }
.home-health-ring small { margin-top: 2px; color: var(--landing-green); font-size: 6px; }
.home-health-card > strong { margin-top: 13px; font-size: 10px; }
.home-health-card > span { margin-top: 4px; color: var(--landing-green); font-size: 7px; }
.home-health-lines { width: 100%; height: 30px; margin-top: 12px; display: flex; align-items: flex-end; gap: 3px; border-bottom: 1px solid #dfe5e1; }
.home-health-lines i { flex: 1; height: 30%; border-radius: 2px 2px 0 0; background: #8fb9a0; animation: healthLine 2.5s ease-in-out infinite alternate; }
.home-health-lines i:nth-child(2) { height: 42%; animation-delay: -.5s; }.home-health-lines i:nth-child(3) { height: 35%; animation-delay: -1s; }.home-health-lines i:nth-child(4) { height: 54%; animation-delay: -1.5s; }.home-health-lines i:nth-child(5) { height: 62%; animation-delay: -2s; }.home-health-lines i:nth-child(6) { height: 72%; animation-delay: -.8s; }.home-health-lines i:nth-child(7) { height: 88%; animation-delay: -1.4s; }
@keyframes healthLine { to { transform: scaleY(.8); opacity: .7; } }

/* Pilot readiness */
.readiness-section { background: var(--landing-cream); }
.readiness-grid { margin-top: 53px; display: grid; grid-template-columns: 1fr 1fr; gap: 11px; }
.readiness-card { min-height: 165px; padding: 24px; display: flex; align-items: flex-start; gap: 16px; border: 1px solid rgba(39,64,48,.12); border-radius: 13px; background: rgba(255,255,255,.66); transition: transform .2s, background .2s; }
.readiness-card:hover { transform: translateY(-3px); background: #fff; }
.readiness-card > .icon { width: 43px; height: 43px; padding: 11px; flex: 0 0 auto; border-radius: 11px; color: var(--landing-green); background: #e4ede6; }
.readiness-card > span { display: flex; flex-direction: column; }
.readiness-card small { color: #829087; font-size: 6px; font-weight: 750; letter-spacing: 1px; }
.readiness-card h3 { margin: 10px 0 8px; font-size: 14px; }
.readiness-card p { margin: 0; color: #6d7a71; font-size: 8px; line-height: 1.65; }
.pilot-panel { min-height: 310px; margin-top: 12px; padding: 30px; display: grid; grid-template-columns: .68fr 1.32fr; gap: 40px; color: white; border-radius: 15px; background: var(--landing-green-dark); }
.pilot-intro { padding: 10px; }
.pilot-intro > span { color: #9ebba5; font-size: 7px; font-weight: 750; letter-spacing: 1px; text-transform: uppercase; }
.pilot-intro h3 { margin: 17px 0 13px; font-size: 25px; line-height: 1.12; letter-spacing: -.9px; }
.pilot-intro p { margin: 0; color: rgba(255,255,255,.5); font-size: 8px; line-height: 1.7; }
.pilot-timeline { border-left: 1px solid rgba(255,255,255,.12); }
.pilot-timeline > div { min-height: 82px; padding: 12px 0 12px 23px; display: grid; grid-template-columns: 25px 1fr auto; align-items: center; gap: 12px; position: relative; border-bottom: 1px solid rgba(255,255,255,.1); }
.pilot-timeline > div:last-child { border-bottom: 0; }
.pilot-timeline > div::before { content: ""; width: 7px; height: 7px; position: absolute; left: -4px; border: 2px solid var(--landing-green-dark); border-radius: 50%; background: #9fc1aa; box-shadow: 0 0 0 3px rgba(159,193,170,.12); }
.pilot-timeline > div > span { color: #a7c1ae; font: italic 9px Georgia, serif; }
.pilot-timeline p { margin: 0; display: flex; flex-direction: column; }
.pilot-timeline strong { font-size: 10px; }
.pilot-timeline small { margin-top: 5px; color: rgba(255,255,255,.48); font-size: 7px; line-height: 1.5; }
.pilot-timeline b { color: #a9c3b0; font-size: 7px; }

@media (max-width: 1040px) {
  .home-analytics-preview { grid-template-columns: 1fr 1fr; }
  .home-analytics-copy { grid-column: 1 / -1; }
  .home-demo-workspace { grid-template-columns: minmax(280px,.85fr) minmax(380px,1.15fr); }
}

@media (max-width: 820px) {
  .home-demo-topbar { grid-template-columns: 1fr auto; }
  .home-demo-status { display: none; }
  .home-demo-workspace { grid-template-columns: 1fr; }
  .home-demo-list { border-right: 0; border-bottom: 1px solid #e4e9e5; }
  #homeInboxList { display: grid; grid-template-columns: repeat(3, 1fr); }
  .home-demo-email { min-height: 143px; grid-template-columns: 1fr; border-right: 1px solid #e8ece9; }
  .home-demo-email:last-child { border-right: 0; }
  .home-demo-email .incoming-avatar { width: 30px; height: 30px; }
  .home-demo-detail { min-height: 480px; }
  .home-analytics-preview { grid-template-columns: 1fr; }
  .home-analytics-copy { grid-column: auto; }
  .home-health-card { min-height: 260px; }
  .readiness-grid { grid-template-columns: 1fr; }
  .pilot-panel { grid-template-columns: 1fr; gap: 20px; }
  .pilot-timeline { border-left: 0; border-top: 1px solid rgba(255,255,255,.12); }
  .pilot-timeline > div::before { left: 0; top: -5px; }
}

@media (max-width: 560px) {
  .home-demo-shell { width: calc(100% + 2px); margin-left: -1px; border-radius: 14px; }
  .home-demo-topbar { min-height: 64px; padding-inline: 13px; gap: 10px; }
  .home-process-btn { padding-inline: 11px; }
  .home-process-btn > span:last-child { display: none; }
  .home-demo-tabs { padding-inline: 7px; overflow-x: auto; }
  .home-demo-tabs button { flex: 1; min-width: max-content; padding-inline: 9px; font-size: 8px; }
  .home-demo-tabs b { display: none; }
  .home-demo-processing { padding-inline: 13px; }
  .home-demo-processing small, .home-demo-processing > b { display: none; }
  #homeInboxList { display: block; }
  .home-demo-email { min-height: 100px; grid-template-columns: 34px 1fr; border-right: 0; }
  .home-demo-email:nth-child(n+3) { display: none; }
  .home-email-snippet { max-width: 260px; }
  .home-demo-detail { min-height: auto; padding: 23px 17px; }
  .home-detail-head { align-items: flex-start; flex-wrap: wrap; }
  .home-decision-badge { margin-left: 54px; }
  .home-detail-subject { font-size: 18px; }
  .home-intelligence-head { align-items: flex-start; flex-wrap: wrap; }
  .home-route-outcome { margin-left: 62px; }
  .home-detail-actions { flex-wrap: wrap; }
  .home-detail-actions a, .home-detail-actions button { flex: 1; justify-content: center; }
  .home-demo-footer { min-height: 70px; align-items: flex-start; flex-direction: column; justify-content: center; gap: 8px; }
  .home-analytics-preview { padding: 11px; }
  .home-analytics-copy { padding: 17px 8px; }
  .home-analytics-metrics { gap: 5px; }
  .home-analytics-metrics strong { font-size: 14px; }
  .home-chart-card { padding: 13px; }
  .home-chart-bars { gap: 3px; }
  .readiness-card { padding: 20px; }
  .pilot-panel { padding: 24px 17px; }
  .pilot-timeline > div { padding-left: 14px; grid-template-columns: 20px 1fr; }
  .pilot-timeline b { grid-column: 2; }
}

@media (prefers-reduced-motion: reduce) {
  .home-demo-shell::after, .home-demo-email, .home-confidence-ring, .home-evidence-chips span, .home-chart-bars > span::before, .home-chart-bars > span::after, .home-health-ring, .home-health-lines i, .home-intelligence-panel { animation: none !important; transition: none !important; }
  .home-chart-bars > span::before, .home-chart-bars > span::after { transform: scaleY(1); }
}