:root {
  --bg: #f4f6f8;
  --surface: #ffffff;
  --surface-soft: #f8fafb;
  --text: #17202a;
  --muted: #69737f;
  --line: #e4e8ec;
  --brand: #236b52;
  --brand-dark: #174b3a;
  --brand-soft: #e8f3ef;
  --accent: #d7ff70;
  --danger: #b83a3a;
  --warning: #a66a12;
  --shadow: 0 18px 50px rgba(24, 36, 48, .08);
  --radius: 18px;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { margin: 0; font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif; color: var(--text); background: var(--bg); }
button, input, textarea, select { font: inherit; }
button, a { -webkit-tap-highlight-color: transparent; }
a { color: inherit; text-decoration: none; }
.hidden { display: none !important; }
.wrap { width: min(1180px, calc(100% - 40px)); margin: 0 auto; }

.loading-screen { min-height: 100vh; display: grid; place-content: center; gap: 18px; justify-items: center; background: #102c23; }
.loader-logo { width: 68px; height: 68px; display: grid; place-items: center; color: #f5fff9; }
.loader-logo .brand-mark { width: 68px; height: 68px; color: #f5fff9; }
.spinner { width: 34px; height: 34px; border: 3px solid rgba(255,255,255,.18); border-top-color: #fff; border-radius: 50%; animation: spin .8s linear infinite; }
@keyframes spin { to { transform: rotate(360deg); } }

.brand { display: inline-flex; align-items: center; gap: 11px; min-width: 0; }
.brand-mark { width: 44px; height: 44px; flex: 0 0 44px; display: grid; place-items: center; color: var(--brand); }
.brand-mark svg { width: 100%; height: 100%; overflow: visible; }
.logo-document, .logo-fold, .logo-line { fill: none; stroke: currentColor; stroke-width: 3; stroke-linecap: round; stroke-linejoin: round; }
.logo-plane { fill: var(--accent); stroke: currentColor; stroke-width: 1.5; stroke-linejoin: round; }
.logo-plane-cut { fill: none; stroke: #123f33; stroke-width: 1.5; stroke-linecap: round; }
.brand-wordmark { min-width: 0; }
.brand strong { display: block; font-size: 15px; line-height: 1.1; letter-spacing: -.025em; white-space: nowrap; }
.brand strong b { color: var(--brand); font-weight: 900; }

.button { border: 0; border-radius: 11px; padding: 12px 18px; font-weight: 750; cursor: pointer; display: inline-flex; align-items: center; justify-content: center; gap: 8px; transition: .18s ease; }
.button:hover { transform: translateY(-1px); }
.button:disabled { opacity: .48; cursor: not-allowed; transform: none; }
.button-primary { background: var(--brand); color: white; box-shadow: 0 8px 20px rgba(35,107,82,.18); }
.button-primary:hover { background: var(--brand-dark); }
.button-secondary { color: var(--text); background: #f1f4f5; border: 1px solid var(--line); }
.button-ghost { color: var(--text); background: transparent; border: 1px solid rgba(23,32,42,.16); }
.button-light { color: #173a2f; background: white; }
.button-danger { color: white; background: var(--danger); }
.button-large { padding: 15px 23px; border-radius: 13px; }
.button.compact { padding: 9px 13px; font-size: 13px; }
.button.full { width: 100%; margin-top: 10px; }
.text-button { border: 0; background: transparent; padding: 4px; cursor: pointer; color: var(--brand); font-weight: 750; }
.icon-button { width: 40px; height: 40px; border: 1px solid var(--line); border-radius: 10px; background: var(--surface); cursor: pointer; }

.landing { min-height: 100vh; background: #f3f6f3; }
.landing-nav { height: 88px; display: flex; align-items: center; justify-content: space-between; }
.hero { min-height: 660px; display: grid; grid-template-columns: 1.02fr .98fr; align-items: center; gap: 64px; padding: 45px 0 70px; }
.eyebrow, .page-kicker, .panel-kicker { color: var(--brand); font-weight: 850; letter-spacing: .15em; font-size: 10px; text-transform: uppercase; }
.hero h1 { font-size: clamp(48px, 6vw, 76px); line-height: .98; letter-spacing: -.065em; margin: 18px 0 24px; max-width: 700px; }
.hero h1 em { color: var(--brand); font-style: normal; }
.hero-copy > p { font-size: 18px; line-height: 1.7; color: #59645f; max-width: 650px; }
.hero-actions { display: flex; gap: 12px; margin-top: 32px; }
.trust-row { display: flex; flex-wrap: wrap; gap: 22px; margin-top: 34px; color: #64706b; font-size: 13px; font-weight: 650; }
.hero-panel { position: relative; }
.mock-window { background: white; border-radius: 24px; box-shadow: 0 35px 90px rgba(27, 50, 41, .16); overflow: hidden; transform: rotate(1.5deg); border: 1px solid rgba(0,0,0,.05); }
.mock-top { height: 50px; background: #f4f5f4; display: flex; align-items: center; gap: 7px; padding: 0 18px; color: #7b8480; font-size: 11px; }
.mock-top span { width: 9px; height: 9px; background: #d1d7d4; border-radius: 50%; }
.mock-top b { margin-left: 12px; }
.mock-grid { display: grid; grid-template-columns: 66px 1fr; min-height: 430px; }
.mock-sidebar { background: #153b2f; padding: 24px 18px; display: flex; flex-direction: column; gap: 16px; }
.mock-sidebar i { height: 9px; border-radius: 9px; background: rgba(255,255,255,.25); }
.mock-content { padding: 34px; }
.mock-content small { color: var(--brand); font-weight: 800; letter-spacing: .13em; }
.mock-content h3 { margin: 8px 0 24px; font-size: 20px; }
.mock-field { border: 1px solid #e4e8e5; border-radius: 10px; padding: 14px; margin-bottom: 12px; color: #7d8782; font-size: 12px; }
.mock-field.tall { height: 135px; line-height: 1.7; }
.mock-file { display: inline-block; background: #eef4f1; border-radius: 10px; padding: 11px 13px; font-size: 12px; color: #3d5a50; }
.mock-footer { display: flex; justify-content: space-between; align-items: center; margin-top: 28px; font-size: 11px; color: #728078; }
.mock-footer button { border: 0; border-radius: 9px; background: var(--brand); color: white; padding: 10px 14px; }
.floating-card { position: absolute; background: white; border-radius: 14px; box-shadow: var(--shadow); padding: 13px 17px; display: flex; flex-direction: column; border: 1px solid #eef0ef; }
.floating-card strong { font-size: 19px; }
.floating-card span { font-size: 10px; color: var(--muted); margin-top: 2px; }
.floating-one { left: -34px; bottom: 55px; }
.floating-two { right: -25px; top: 70px; }
.feature-section { display: grid; grid-template-columns: repeat(3,1fr); gap: 1px; background: #dfe5e1; margin-bottom: 70px; border: 1px solid #dfe5e1; border-radius: 18px; overflow: hidden; }
.feature-section > div { background: white; padding: 34px; }
.feature-number { color: var(--brand); font-weight: 850; font-size: 12px; }
.feature-section h3 { margin: 18px 0 8px; }
.feature-section p { color: var(--muted); line-height: 1.6; margin: 0; font-size: 14px; }

.app-shell { min-height: 100vh; display: grid; grid-template-columns: 258px 1fr; }
.sidebar { position: fixed; inset: 0 auto 0 0; width: 258px; background: #12372c; color: white; padding: 24px 18px; display: flex; flex-direction: column; z-index: 50; }
.sidebar-brand { padding: 0 10px 26px; border-bottom: 1px solid rgba(255,255,255,.1); }
.sidebar-brand .brand-mark { color: #f5fff9; }
.sidebar-brand strong b { color: var(--accent); }
.sidebar-nav { display: grid; gap: 5px; margin-top: 24px; }
.nav-item { width: 100%; border: 0; background: transparent; color: rgba(255,255,255,.66); border-radius: 11px; padding: 12px 14px; text-align: left; font-weight: 650; cursor: pointer; display: flex; gap: 12px; align-items: center; }
.nav-item span { width: 20px; text-align: center; font-size: 17px; }
.nav-item:hover, .nav-item.active { background: rgba(255,255,255,.1); color: white; }
.sidebar-foot { margin-top: auto; }
.mini-credit { background: rgba(255,255,255,.08); border: 1px solid rgba(255,255,255,.08); border-radius: 13px; padding: 14px; margin-bottom: 12px; display: flex; justify-content: space-between; align-items: center; }
.mini-credit span { font-size: 11px; color: rgba(255,255,255,.56); }
.mini-credit strong { color: var(--accent); font-size: 18px; }
.profile-chip { display: flex; align-items: center; gap: 10px; padding: 10px; }
.profile-chip img { width: 38px; height: 38px; border-radius: 12px; object-fit: cover; background: rgba(255,255,255,.12); }
.profile-chip span { min-width: 0; }
.profile-chip strong, .profile-chip small { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; max-width: 160px; }
.profile-chip strong { font-size: 12px; }
.profile-chip small { color: rgba(255,255,255,.48); font-size: 10px; margin-top: 3px; }

.workspace { grid-column: 2; min-width: 0; }
.topbar { min-height: 88px; border-bottom: 1px solid var(--line); background: rgba(255,255,255,.93); backdrop-filter: blur(12px); display: flex; align-items: center; justify-content: space-between; padding: 17px 32px; position: sticky; top: 0; z-index: 30; }
.topbar h1 { margin: 3px 0 0; font-size: 24px; letter-spacing: -.035em; }
.top-actions { display: flex; align-items: center; gap: 12px; }
.connection-pill { border: 1px solid var(--line); background: white; border-radius: 999px; padding: 8px 12px; display: flex; align-items: center; gap: 8px; font-size: 11px; font-weight: 750; color: var(--muted); }
.connection-pill i { width: 8px; height: 8px; border-radius: 50%; background: #b3bbc0; }
.connection-pill.connected i { background: #31a56e; box-shadow: 0 0 0 4px rgba(49,165,110,.12); }
.content { padding: 28px 32px 60px; max-width: 1500px; margin: 0 auto; }
.view { display: none; }
.view.active { display: block; animation: fade .2s ease; }
@keyframes fade { from { opacity: .55; transform: translateY(4px); } }

.welcome-banner { background: linear-gradient(115deg, #174c3a, #236b52); color: white; border-radius: var(--radius); padding: 26px 28px; display: flex; align-items: center; justify-content: space-between; margin-bottom: 20px; box-shadow: var(--shadow); }
.welcome-banner .eyebrow { color: var(--accent); }
.welcome-banner h2 { margin: 7px 0; font-size: 24px; }
.welcome-banner p { color: rgba(255,255,255,.68); margin: 0; font-size: 13px; }
.stat-grid { display: grid; grid-template-columns: repeat(4, minmax(0,1fr)); gap: 16px; }
.stat-card, .panel { background: var(--surface); border: 1px solid var(--line); border-radius: var(--radius); box-shadow: 0 6px 25px rgba(32,45,56,.035); }
.stat-card { padding: 22px; }
.stat-card > span { color: var(--muted); font-size: 12px; font-weight: 650; }
.stat-card strong { display: block; font-size: 34px; letter-spacing: -.04em; margin: 12px 0 5px; }
.stat-card small { color: #8a939b; font-size: 11px; }
.dashboard-grid { display: grid; grid-template-columns: 2fr 1fr; gap: 16px; margin-top: 16px; }
.panel { padding: 22px; }
.panel.span-two { min-height: 390px; }
.panel-head { display: flex; align-items: center; justify-content: space-between; gap: 16px; margin-bottom: 20px; }
.panel-head h2 { margin: 5px 0 0; font-size: 19px; letter-spacing: -.025em; }
.campaign-list { display: grid; }
.campaign-row { display: grid; grid-template-columns: 1.4fr .7fr .85fr .75fr; gap: 12px; align-items: center; padding: 16px 4px; border-top: 1px solid var(--line); cursor: pointer; }
.campaign-row:first-child { border-top: 0; }
.campaign-row:hover { background: #fbfcfc; }
.campaign-row strong, .campaign-row small { display: block; }
.campaign-row small { color: var(--muted); font-size: 10px; margin-top: 4px; }
.progress-mini { height: 6px; background: #e9edeb; border-radius: 10px; overflow: hidden; margin-top: 6px; }
.progress-mini i { display: block; height: 100%; background: var(--brand); }
.badge { display: inline-flex; align-items: center; border-radius: 999px; padding: 5px 9px; font-size: 10px; font-weight: 850; text-transform: uppercase; letter-spacing: .04em; background: #edf0f2; color: #59636c; }
.badge.sent, .badge.completed { background: #e5f5ed; color: #267a55; }
.badge.running, .badge.queued { background: #e8f0fb; color: #34659c; }
.badge.scheduled { background: #f4edff; color: #7651a8; }
.badge.failed, .badge.suspended { background: #faeaea; color: #a13d3d; }
.badge.partial { background: #fff1d9; color: #986417; }
.badge.cancelled { background: #efefef; color: #777; }
.steps { list-style: none; padding: 0; margin: 0; display: grid; gap: 18px; }
.steps li { display: flex; gap: 12px; align-items: center; }
.steps i { width: 31px; height: 31px; border-radius: 50%; border: 1px solid var(--line); display: grid; place-items: center; font-style: normal; color: var(--muted); font-size: 11px; font-weight: 800; }
.steps li.done i { background: var(--brand); border-color: var(--brand); color: white; }
.steps strong, .steps small { display: block; }
.steps strong { font-size: 12px; }
.steps small { font-size: 10px; color: var(--muted); margin-top: 3px; }
.empty-state { color: var(--muted); display: grid; place-items: center; min-height: 180px; font-size: 13px; }

.composer-layout { display: grid; grid-template-columns: minmax(0, 1fr) 340px; gap: 18px; align-items: start; }
.composer-main { display: grid; gap: 18px; }
.form-panel { padding: 25px; }
.section-heading { display: flex; align-items: flex-start; gap: 14px; margin-bottom: 22px; }
.section-heading > span { width: 33px; height: 33px; border-radius: 10px; background: var(--brand-soft); color: var(--brand); display: grid; place-items: center; font-size: 10px; font-weight: 850; flex: 0 0 auto; }
.section-heading h2 { margin: 1px 0 5px; font-size: 18px; }
.section-heading p { margin: 0; color: var(--muted); font-size: 12px; line-height: 1.5; }
.field-grid { display: grid; gap: 14px; }
.field-grid.two { grid-template-columns: 1fr 1fr; }
.field { display: grid; gap: 7px; margin-bottom: 15px; }
.field > span { font-size: 11px; font-weight: 760; color: #4f5a63; }
.field input, .field textarea, .field select, select { width: 100%; border: 1px solid #dfe4e7; border-radius: 11px; background: white; padding: 12px 13px; color: var(--text); outline: 0; transition: .15s; }
.field textarea { resize: vertical; line-height: 1.58; }
.field input:focus, .field textarea:focus, .field select:focus, select:focus { border-color: #76a994; box-shadow: 0 0 0 3px rgba(35,107,82,.09); }
.variable-row { display: flex; align-items: center; flex-wrap: wrap; gap: 7px; }
.variable-row > span { color: var(--muted); font-size: 10px; margin-right: 3px; }
.variable-row button { border: 1px solid var(--line); background: var(--surface-soft); color: var(--brand); border-radius: 7px; padding: 6px 8px; font-family: ui-monospace, SFMono-Regular, Menlo, monospace; font-size: 10px; cursor: pointer; }
.recipient-tools { display: flex; align-items: center; gap: 8px; margin-bottom: 12px; }
.file-button input { display: none; }
.import-summary { background: #f5f7f7; border-radius: 11px; display: flex; gap: 20px; padding: 11px 13px; }
.import-summary span { color: var(--muted); font-size: 11px; }
.import-summary strong { color: var(--text); }
.upload-zone { min-height: 150px; border: 1.5px dashed #ced7d2; border-radius: 14px; background: #fafcfb; display: grid; place-items: center; align-content: center; gap: 5px; text-align: center; cursor: pointer; }
.upload-zone:hover { border-color: var(--brand); background: #f5faf7; }
.upload-zone input { display: none; }
.upload-icon { font-size: 25px; color: var(--brand); }
.upload-zone strong { font-size: 13px; }
.upload-zone small { color: var(--muted); font-size: 10px; }
.upload-zone.is-uploading { border-color: var(--brand); background: var(--brand-soft); cursor: wait; }
.upload-status { margin-top: 10px; min-height: 58px; padding: 10px 12px; border: 1px solid #d9e2de; border-radius: 12px; background: #f8faf9; display: flex; align-items: center; gap: 10px; }
.upload-status.success { border-color: #c6dfd4; background: #f3faf6; color: var(--brand); }
.upload-status.error { border-color: #efcfca; background: #fff7f5; color: #a63e32; }
.upload-state-icon { width: 34px; height: 34px; flex: 0 0 auto; border-radius: 50%; background: white; display: grid; place-items: center; }
.upload-state-icon svg { width: 20px; height: 20px; fill: none; stroke: currentColor; stroke-width: 1.9; stroke-linecap: round; stroke-linejoin: round; }
.upload-status-copy { min-width: 0; flex: 1; display: grid; gap: 3px; }
.upload-status-copy strong, .upload-status-copy small { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.upload-status-copy strong { color: var(--ink); font-size: 11px; }
.upload-status-copy small { color: currentColor; font-size: 9px; }
.upload-status progress { width: 100%; height: 5px; border: 0; border-radius: 999px; overflow: hidden; background: #dfe8e3; }
.upload-status progress::-webkit-progress-bar { background: #dfe8e3; }
.upload-status progress::-webkit-progress-value { background: var(--brand); border-radius: 999px; }
.upload-status progress::-moz-progress-bar { background: var(--brand); border-radius: 999px; }
.upload-spinner { width: 18px; height: 18px; border: 2px solid #d5e3dc; border-top-color: var(--brand); border-radius: 50%; animation: uploadSpin .75s linear infinite; }
@keyframes uploadSpin { to { transform: rotate(360deg); } }
.file-list { display: grid; gap: 8px; margin-top: 12px; }
.file-entry { display: flex; justify-content: space-between; align-items: center; border: 1px solid var(--line); border-radius: 10px; padding: 10px 12px; }
.file-entry span { min-width: 0; }
.file-entry strong, .file-entry small { display: block; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }
.file-entry strong { font-size: 11px; }
.file-entry small { color: var(--muted); font-size: 9px; margin-top: 2px; }
.file-entry button { border: 0; background: transparent; color: var(--danger); cursor: pointer; }
.sticky-panel { position: sticky; top: 112px; }
.segmented { display: grid; grid-template-columns: 1fr 1fr; background: #f0f3f2; padding: 4px; border-radius: 11px; margin-bottom: 18px; }
.segmented input { display: none; }
.segmented span { display: block; padding: 9px; text-align: center; font-size: 11px; font-weight: 750; border-radius: 8px; cursor: pointer; color: var(--muted); }
.segmented input:checked + span { background: white; color: var(--text); box-shadow: 0 3px 9px rgba(0,0,0,.06); }
.schedule-fields { border-top: 1px solid var(--line); padding-top: 17px; }
.schedule-context { display:grid; grid-template-columns:auto minmax(0,1fr) auto; align-items:center; gap:11px; margin-bottom:15px; padding:12px; border:1px solid #dbe6e0; border-radius:11px; background:#f4f8f6; }
.schedule-clock-icon { width:34px; height:34px; display:grid; place-items:center; border-radius:9px; background:#e4f0ea; color:var(--brand); }
.schedule-clock-icon svg { width:19px; height:19px; fill:none; stroke:currentColor; stroke-width:1.8; stroke-linecap:round; stroke-linejoin:round; }
.schedule-context div { min-width:0; }
.schedule-context div > span, .schedule-context strong, .schedule-context small { display:block; }
.schedule-context div > span { color:var(--muted); font-size:9px; font-weight:750; letter-spacing:.02em; }
.schedule-context strong { margin-top:1px; font-size:17px; line-height:1.2; }
.schedule-context small { margin-top:2px; overflow:hidden; color:#66736d; font-size:9px; text-overflow:ellipsis; white-space:nowrap; }
.schedule-context .text-button { padding:5px 0; border:0; background:transparent; color:var(--brand); font:inherit; font-size:9px; font-weight:800; cursor:pointer; }
.schedule-timezone-note { margin:-4px 0 13px; color:var(--muted); font-size:9px; line-height:1.45; }
.cost-box { border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); padding: 18px 0; margin: 7px 0 17px; }
.cost-box > span, .cost-box > strong, .cost-box > small { display: block; }
.cost-box > span { color: var(--muted); font-size: 10px; }
.cost-box > strong { font-size: 20px; margin: 4px 0; }
.cost-box > small { color: var(--muted); line-height: 1.45; font-size: 9px; }
.consent-check { display: flex; align-items: flex-start; gap: 9px; color: var(--muted); font-size: 10px; line-height: 1.45; margin-bottom: 8px; }
.consent-check input { margin-top: 2px; accent-color: var(--brand); }
.form-note { color: var(--danger); font-size: 10px; line-height: 1.45; min-height: 14px; }

.table-wrap { overflow-x: auto; }
table { width: 100%; border-collapse: collapse; min-width: 720px; }
th { text-align: left; color: #899198; font-size: 9px; letter-spacing: .1em; text-transform: uppercase; padding: 10px 12px; border-bottom: 1px solid var(--line); }
td { padding: 14px 12px; border-bottom: 1px solid #edf0f2; font-size: 11px; vertical-align: middle; }
td strong, td small { display: block; }
td small { color: var(--muted); margin-top: 3px; }
.table-action { border: 0; background: transparent; color: var(--brand); font-weight: 750; cursor: pointer; }
.credit-hero { color: white; background: linear-gradient(120deg, #173f33, #236b52); border-radius: var(--radius); padding: 30px; margin-bottom: 17px; display: flex; align-items: center; justify-content: space-between; box-shadow: var(--shadow); }
.credit-hero .page-kicker { color: var(--accent); }
.credit-hero h2 { font-size: 30px; margin: 7px 0; }
.credit-hero p { color: rgba(255,255,255,.63); font-size: 12px; margin: 0; }
.credit-split { display: flex; gap: 12px; }
.credit-split span { min-width: 110px; border: 1px solid rgba(255,255,255,.15); border-radius: 12px; padding: 13px; color: rgba(255,255,255,.62); font-size: 9px; }
.credit-split strong { display: block; color: white; font-size: 20px; margin-top: 5px; }
.delta.positive { color: #26835a; font-weight: 800; }
.delta.negative { color: #ae3f3f; font-weight: 800; }
.settings-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 17px; }
.settings-grid .danger-panel { grid-column: 1 / -1; }
.connection-card { border: 1px solid var(--line); border-radius: 14px; padding: 16px; display: flex; align-items: center; justify-content: space-between; gap: 18px; }
.connection-card > div { display: flex; align-items: center; gap: 12px; min-width: 0; }
.connection-logo { width: 42px; height: 42px; border-radius: 12px; background: #f3f5f5; display: grid; place-items: center; font-weight: 900; color: #d24a42; }
.connection-card strong, .connection-card small { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.connection-card small { color: var(--muted); margin-top: 3px; }
.muted { color: var(--muted); font-size: 12px; line-height: 1.55; }

.modal { position: fixed; inset: 0; z-index: 100; display: grid; place-items: center; padding: 20px; }
.modal-backdrop { position: absolute; inset: 0; background: rgba(13,24,20,.58); backdrop-filter: blur(4px); }
.modal-card { position: relative; z-index: 1; width: min(760px, 100%); max-height: calc(100vh - 40px); overflow: auto; background: white; border-radius: 20px; box-shadow: 0 30px 90px rgba(0,0,0,.28); padding: 28px; }
.modal-close { position: absolute; top: 14px; right: 14px; width: 36px; height: 36px; border: 0; border-radius: 50%; background: #f2f4f5; cursor: pointer; font-size: 20px; }
.email-preview { border: 1px solid var(--line); border-radius: 14px; overflow: hidden; margin-top: 18px; }
.email-preview-head { background: #f7f8f8; padding: 15px; border-bottom: 1px solid var(--line); font-size: 11px; line-height: 1.75; }
.email-preview-body { padding: 22px; white-space: pre-wrap; font-size: 12px; line-height: 1.65; min-height: 180px; }
.detail-grid { display: grid; grid-template-columns: repeat(4,1fr); gap: 10px; margin: 20px 0; }
.detail-grid div { background: #f6f8f8; border-radius: 11px; padding: 13px; }
.detail-grid span, .detail-grid strong { display: block; }
.detail-grid span { color: var(--muted); font-size: 9px; }
.detail-grid strong { margin-top: 4px; font-size: 15px; }
.recipient-log { max-height: 330px; overflow: auto; border: 1px solid var(--line); border-radius: 12px; }
.recipient-log-row { display: grid; grid-template-columns: 1fr auto; gap: 12px; padding: 11px 13px; border-bottom: 1px solid var(--line); font-size: 10px; }
.recipient-log-row:last-child { border-bottom: 0; }
.recipient-log-row small { color: var(--danger); display: block; margin-top: 4px; }
.toast-stack { position: fixed; right: 20px; bottom: 20px; z-index: 200; display: grid; gap: 10px; width: min(360px, calc(100vw - 40px)); }
.toast { background: #172620; color: white; border-radius: 12px; padding: 13px 15px; box-shadow: var(--shadow); font-size: 11px; line-height: 1.5; animation: toastIn .2s ease; }
.toast.error { background: #8d3030; }
.toast.success { background: #1f6a4e; }
@keyframes toastIn { from { transform: translateY(10px); opacity: 0; } }

.mobile-only { display: none; }
@media (max-width: 1100px) {
  .hero { grid-template-columns: 1fr; }
  .hero-panel { max-width: 700px; margin: 0 auto; }
  .stat-grid { grid-template-columns: 1fr 1fr; }
  .composer-layout { grid-template-columns: 1fr; }
  .sticky-panel { position: static; }
}
@media (max-width: 850px) {
  .app-shell { display: block; }
  .sidebar { transform: translateX(-100%); transition: .22s ease; box-shadow: 20px 0 50px rgba(0,0,0,.2); }
  .sidebar.open { transform: translateX(0); }
  .workspace { grid-column: auto; }
  .mobile-only { display: inline-grid; place-items: center; }
  .topbar { padding: 14px 18px; }
  .topbar > div:first-of-type { margin-right: auto; margin-left: 10px; }
  .connection-pill { display: none; }
  .content { padding: 20px 16px 45px; }
  .dashboard-grid, .settings-grid { grid-template-columns: 1fr; }
  .settings-grid .danger-panel { grid-column: auto; }
  .feature-section { grid-template-columns: 1fr; }
  .hero { padding-top: 25px; }
  .floating-card { display: none; }
}
@media (max-width: 590px) {
  .wrap { width: min(100% - 24px, 1180px); }
  .landing-nav .button { padding: 10px 12px; font-size: 11px; }
  .hero h1 { font-size: 46px; }
  .hero-actions { flex-direction: column; align-items: stretch; }
  .mock-grid { grid-template-columns: 44px 1fr; }
  .mock-content { padding: 22px 16px; }
  .stat-grid, .field-grid.two { grid-template-columns: 1fr; }
  .welcome-banner, .credit-hero { align-items: flex-start; flex-direction: column; gap: 18px; }
  .top-actions .button { display: none; }
  .campaign-row { grid-template-columns: 1fr auto; }
  .campaign-row > :nth-child(3), .campaign-row > :nth-child(4) { display: none; }
  .recipient-tools { flex-wrap: wrap; }
  .detail-grid { grid-template-columns: 1fr 1fr; }
  .credit-split { width: 100%; }
  .credit-split span { flex: 1; min-width: 0; }
}
.legal-page { padding: 38px 0 80px; }
.legal-page > .brand { margin-bottom: 28px; }
.legal-page article { max-width: 850px; margin: 0 auto; padding: 38px; }
.legal-page h1 { font-size: 40px; letter-spacing: -.04em; }
.legal-page h2 { margin-top: 30px; font-size: 19px; }
.legal-page p { color: var(--muted); line-height: 1.75; }
.landing-footer { border-top: 1px solid #dfe5e1; min-height: 80px; display: flex; align-items: center; justify-content: space-between; color: var(--muted); font-size: 11px; }
.landing-footer nav { display: flex; gap: 18px; }
.landing-footer a:hover { color: var(--brand); }
@media (max-width:590px){.landing-footer{align-items:flex-start;flex-direction:column;justify-content:center;gap:10px}.landing-footer nav{flex-wrap:wrap}}

.autosave-status { display:block; margin-top:7px; color:var(--muted); font-size:10px; }
.autosave-status.saving { color:#986417; }
.autosave-status.saved { color:#267a55; }
.file-entry.selectable { cursor:pointer; }
.file-entry.selectable input { accent-color:var(--brand); margin-right:10px; }
.file-library-note { margin:10px 0 0; font-size:10px; }
.action-group { display:flex; flex-wrap:wrap; gap:7px; }
.badge.paused { background:#fff1d9; color:#986417; }
@media (prefers-reduced-motion: reduce) { *, *::before, *::after { animation-duration:.01ms !important; animation-iteration-count:1 !important; transition-duration:.01ms !important; scroll-behavior:auto !important; } }

body.modal-open { overflow:hidden; }
.progress-mini i.p-0 { width:0%; }
.progress-mini i.p-5 { width:5%; }
.progress-mini i.p-10 { width:10%; }
.progress-mini i.p-15 { width:15%; }
.progress-mini i.p-20 { width:20%; }
.progress-mini i.p-25 { width:25%; }
.progress-mini i.p-30 { width:30%; }
.progress-mini i.p-35 { width:35%; }
.progress-mini i.p-40 { width:40%; }
.progress-mini i.p-45 { width:45%; }
.progress-mini i.p-50 { width:50%; }
.progress-mini i.p-55 { width:55%; }
.progress-mini i.p-60 { width:60%; }
.progress-mini i.p-65 { width:65%; }
.progress-mini i.p-70 { width:70%; }
.progress-mini i.p-75 { width:75%; }
.progress-mini i.p-80 { width:80%; }
.progress-mini i.p-85 { width:85%; }
.progress-mini i.p-90 { width:90%; }
.progress-mini i.p-95 { width:95%; }
.progress-mini i.p-100 { width:100%; }


.nav-item svg {
  width: 19px;
  height: 19px;
  flex: 0 0 19px;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.8;
  stroke-linecap: round;
  stroke-linejoin: round;
}




/* Production workspace refinements */
.app-shell, .sidebar, .workspace { transition: width .2s ease, grid-template-columns .2s ease, margin .2s ease; }
.sidebar-head { position: relative; display: flex; align-items: center; min-height: 66px; border-bottom: 1px solid rgba(255,255,255,.1); }
.sidebar-head .sidebar-brand { flex: 1; padding: 0 10px 20px; border: 0; overflow: hidden; }
.sidebar-collapse { position: absolute; right: -24px; top: 15px; width: 24px; height: 34px; padding: 0; border: 0; border-radius: 0 7px 7px 0; background: transparent; color: #6f8f83; display: grid; place-items: center; cursor: pointer; box-shadow: none; opacity: .72; transition: color .16s ease, background-color .16s ease, opacity .16s ease; }
.sidebar-collapse:hover, .sidebar-collapse:focus-visible { background: #edf3ef; color: var(--brand); opacity: 1; outline: none; }
.sidebar-collapse svg { width: 16px; height: 16px; }
.sidebar-collapse svg, .profile-chevron, .profile-menu svg { width: 18px; height: 18px; fill: none; stroke: currentColor; stroke-width: 1.9; stroke-linecap: round; stroke-linejoin: round; }
.nav-item { position: relative; white-space: nowrap; }
.nav-item .nav-label { width: auto; min-width: 0; text-align: left; font-size: 13px; overflow: hidden; text-overflow: ellipsis; }
.sidebar-foot { position: relative; }
.profile-chip { width: 100%; border: 0; border-radius: 12px; background: transparent; color: white; text-align: left; cursor: pointer; }
.profile-chip:hover, .profile-chip[aria-expanded="true"] { background: rgba(255,255,255,.08); }
.profile-copy { flex: 1; min-width: 0; }
.profile-chevron { flex: 0 0 auto; color: rgba(255,255,255,.55); }
.profile-menu { position: absolute; left: 0; right: 0; bottom: 66px; padding: 7px; border: 1px solid #dfe5e1; border-radius: 13px; background: white; color: var(--text); box-shadow: 0 16px 42px rgba(8,28,20,.2); }
.profile-menu button, .profile-menu a { width: 100%; border: 0; border-radius: 9px; background: transparent; padding: 10px; display: flex; gap: 10px; align-items: center; color: #47544f; font-size: 11px; font-weight: 700; cursor: pointer; }
.profile-menu button:hover, .profile-menu a:hover { background: #f2f6f4; color: var(--brand); }
.sidebar-collapsed { grid-template-columns: 76px 1fr; }
.sidebar-collapsed .sidebar { width: 76px; padding-inline: 10px; }
.sidebar-collapsed .sidebar-brand { padding-inline: 6px; }
.sidebar-collapsed .sidebar-brand .brand-mark { width: 40px; height: 40px; flex-basis: 40px; }
.sidebar-collapsed .brand-wordmark, .sidebar-collapsed .nav-label, .sidebar-collapsed .mini-credit span, .sidebar-collapsed .profile-copy, .sidebar-collapsed .profile-chevron { display: none; }
.sidebar-collapsed .nav-item { justify-content: center; padding-inline: 0; }
.sidebar-collapsed .mini-credit { justify-content: center; padding-inline: 6px; }
.sidebar-collapsed .mini-credit strong { font-size: 15px; }
.sidebar-collapsed .profile-chip { justify-content: center; padding-inline: 4px; }
.sidebar-collapsed .sidebar-collapse svg { transform: rotate(180deg); }
.sidebar-collapsed .nav-item::after { content: attr(aria-label); position: absolute; left: 58px; top: 50%; transform: translateY(-50%); padding: 7px 9px; border-radius: 8px; background: #172620; color: white; font-size: 10px; opacity: 0; pointer-events: none; transition: opacity .12s ease; }
.sidebar-collapsed .nav-item:hover::after { opacity: 1; }
.sidebar-collapsed .profile-menu { left: 56px; right: auto; bottom: 0; width: 190px; }

.onboarding-panel { min-height: 390px; }
.onboarding-head { align-items: flex-start; margin-bottom: 13px; }
.onboarding-head .muted { margin: 5px 0 0; font-size: 10px; }
.onboarding-track { height: 5px; border-radius: 999px; overflow: hidden; background: #e9efec; margin-bottom: 16px; }
.onboarding-track i { display: block; width: 0; height: 100%; border-radius: inherit; background: var(--brand); transition: width .3s ease; }
.onboarding-steps { display: grid; gap: 7px; }
.onboarding-step { display: grid; grid-template-columns: 30px 1fr; align-items: start; gap: 10px; padding: 9px; border-radius: 11px; color: #78817d; }
.onboarding-step.active { padding: 12px 10px; border: 1px solid #dce8e2; background: #f5f9f7; color: var(--text); }
.onboarding-index { width: 27px; height: 27px; display: grid; place-items: center; border: 1px solid #dce3df; border-radius: 50%; font-size: 10px; font-weight: 850; }
.onboarding-index svg { width: 15px; height: 15px; fill: none; stroke: currentColor; stroke-width: 2.2; stroke-linecap: round; stroke-linejoin: round; }
.onboarding-step.done { color: #4b655b; }
.onboarding-step.done .onboarding-index { color: white; border-color: var(--brand); background: var(--brand); }
.onboarding-step strong { display: block; margin-top: 5px; font-size: 11px; }
.onboarding-step.active strong { margin-top: 2px; font-size: 12px; }
.onboarding-step p { margin: 5px 0 9px; color: var(--muted); font-size: 10px; line-height: 1.5; }
.onboarding-collapsed { align-self: start; border: 1px solid var(--line); border-radius: 14px; background: white; padding: 14px 16px; display: flex; align-items: center; justify-content: space-between; color: var(--brand); font-weight: 800; cursor: pointer; }
.onboarding-collapsed strong { width: 38px; height: 28px; display: grid; place-items: center; border-radius: 999px; background: var(--brand-soft); font-size: 10px; }

.recipient-source-tabs { display: flex; gap: 6px; padding: 4px; margin-bottom: 16px; border-radius: 11px; background: #f0f3f2; }
.recipient-tab { position: relative; flex: 1; border: 0; border-radius: 8px; background: transparent; color: var(--muted); padding: 9px 12px; text-align: center; font-size: 11px; font-weight: 750; cursor: pointer; }
.recipient-tab.active { background: white; color: var(--text); box-shadow: 0 2px 8px rgba(20,40,32,.06); }
.recipient-tab input { position: absolute; width: 1px; height: 1px; opacity: 0; }
.field-grid.three { grid-template-columns: repeat(3, 1fr); }
.manual-recipient-panel { padding: 15px; margin-bottom: 14px; border: 1px solid var(--line); border-radius: 12px; background: #fafcfb; }
.recipient-tools { justify-content: flex-end; }
.import-summary { margin-top: 13px; }
.recipient-preview { margin-top: 10px; border: 1px solid var(--line); border-radius: 12px; overflow: hidden; }
.recipient-preview-row { min-height: 52px; display: flex; align-items: center; justify-content: space-between; gap: 15px; padding: 10px 12px; border-bottom: 1px solid #edf1ef; }
.recipient-preview-row:last-child { border-bottom: 0; }
.recipient-preview-row strong, .recipient-preview-row small { display: block; }
.recipient-preview-row strong { font-size: 11px; }
.recipient-preview-row small { margin-top: 3px; color: var(--muted); font-size: 9px; }
.recipient-preview-row.duplicate strong { color: #87908c; text-decoration: line-through; }
.recipient-preview-row.invalid strong { color: var(--danger); }
.recipient-status { padding: 5px 8px; border-radius: 999px; background: #e8f3ee; color: #24734f; font-size: 9px; font-weight: 850; }
.recipient-preview-row.duplicate .recipient-status { background: #f1f2f2; color: #707975; }
.recipient-preview-row.invalid .recipient-status { background: #faeaea; color: #9d3939; }
.recipient-preview-more { margin: 0; padding: 10px 12px; color: var(--muted); font-size: 9px; }
.recipient-history-toolbar { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 10px 12px; background: #fff8e9; color: #755b1f; border-bottom: 1px solid #eadfbe; font-size: 10px; }
.recipient-history-toolbar .table-action { white-space: nowrap; color: #68500f; }
.recipient-preview-row.history { background: #fffdf7; }
.recipient-preview-row.history .recipient-status { background: #fff0c7; color: #755b1f; }
.recipient-preview-row.history-skipped { background: #f7f8f8; }
.recipient-preview-row.history-skipped strong { color: #87908c; text-decoration: line-through; }
.recipient-preview-row.history-skipped .recipient-status { background: #ecefef; color: #68736e; }
.recipient-row-end { display: flex; align-items: center; gap: 9px; }
.recipient-history-actions { display: flex; gap: 5px; }
.recipient-history-actions button { border: 1px solid var(--line); border-radius: 8px; background: white; color: var(--brand); padding: 5px 7px; font: inherit; font-size: 9px; font-weight: 800; cursor: pointer; }
.recipient-history-actions button:hover { border-color: #8ab8a6; background: var(--brand-soft); }
.import-summary .history-summary { color: #755b1f; }

.upload-icon svg { width: 28px; height: 28px; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.file-list { grid-template-columns: repeat(2, minmax(0,1fr)); }
.file-entry { min-width: 0; display: grid; grid-template-columns: auto auto minmax(0,1fr) auto auto; justify-content: initial; gap: 10px; padding: 12px; cursor: pointer; }
.file-entry > input { accent-color: var(--brand); }
.file-entry.selected { border-color: #8ab8a6; background: #f5faf7; }
.file-type-icon { width: 34px; height: 38px; display: grid; place-items: center; border-radius: 8px; background: var(--brand-soft); color: var(--brand); }
.file-type-icon svg { width: 20px; height: 20px; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.file-copy { min-width: 0; align-self: center; }
.file-selected { align-self: center; color: var(--brand); font-size: 9px; font-weight: 800; }
.file-entry button { align-self: center; padding: 5px; font-size: 9px; }
.file-empty { grid-column: 1 / -1; padding: 18px; border: 1px dashed #d6ddda; border-radius: 12px; text-align: center; }
.file-empty strong, .file-empty span { display: block; }
.file-empty strong { font-size: 11px; }
.file-empty span { margin-top: 4px; color: var(--muted); font-size: 9px; }

.reward-modal { padding: 8px 4px 2px; text-align: center; }
.reward-modal h2 { margin: 10px 0 7px; font-size: 27px; letter-spacing: -.04em; }
.reward-modal .muted { max-width: 480px; margin: 0 auto; }
.reward-visual { position: relative; width: 112px; height: 102px; margin: 0 auto 15px; display: grid; place-items: center; }
.reward-gift { width: 82px; height: 82px; fill: var(--brand-soft); stroke: var(--brand); stroke-width: 2.5; stroke-linecap: round; stroke-linejoin: round; animation: rewardPop .55s cubic-bezier(.2,.8,.2,1); }
.reward-confetti { position: absolute; inset: 0; pointer-events: none; }
.reward-confetti i { position: absolute; left: 50%; top: 50%; width: 5px; height: 10px; border-radius: 2px; background: var(--accent); animation: confetti .85s ease-out both; }
.reward-confetti i:nth-child(2n) { background: var(--brand); }
.reward-confetti i:nth-child(3n) { background: #e6a754; }
.reward-confetti i:nth-child(1) { --x:-48px; --y:-38px; --r:40deg; } .reward-confetti i:nth-child(2) { --x:-28px; --y:-52px; --r:-30deg; } .reward-confetti i:nth-child(3) { --x:3px; --y:-58px; --r:70deg; } .reward-confetti i:nth-child(4) { --x:35px; --y:-45px; --r:20deg; } .reward-confetti i:nth-child(5) { --x:52px; --y:-18px; --r:-55deg; } .reward-confetti i:nth-child(6) { --x:48px; --y:20px; --r:60deg; } .reward-confetti i:nth-child(7) { --x:22px; --y:42px; --r:-20deg; } .reward-confetti i:nth-child(8) { --x:-12px; --y:45px; --r:45deg; } .reward-confetti i:nth-child(9) { --x:-43px; --y:30px; --r:-60deg; } .reward-confetti i:nth-child(10) { --x:-56px; --y:0; --r:30deg; } .reward-confetti i:nth-child(11) { --x:18px; --y:-48px; --r:80deg; } .reward-confetti i:nth-child(12) { --x:43px; --y:4px; --r:-35deg; } .reward-confetti i:nth-child(13) { --x:-30px; --y:39px; --r:55deg; } .reward-confetti i:nth-child(14) { --x:-45px; --y:-22px; --r:-70deg; }
.reward-actions { display: flex; justify-content: center; gap: 9px; margin-top: 22px; }
@keyframes rewardPop { 0% { opacity: 0; transform: scale(.72) translateY(10px); } 70% { transform: scale(1.05); } 100% { opacity: 1; transform: scale(1); } }
@keyframes confetti { 0% { opacity: 0; transform: translate(-50%,-50%) scale(.3); } 25% { opacity: 1; } 100% { opacity: 0; transform: translate(calc(-50% + var(--x)), calc(-50% + var(--y))) rotate(var(--r)); } }

@media (max-width: 850px) {
  .sidebar-collapse { display: none; }
  .sidebar-collapsed { display: block; }
  .sidebar-collapsed .sidebar { width: 258px; padding: 24px 18px; }
  .sidebar-collapsed .brand-wordmark, .sidebar-collapsed .nav-label, .sidebar-collapsed .mini-credit span, .sidebar-collapsed .profile-copy, .sidebar-collapsed .profile-chevron { display: initial; }
  .sidebar-collapsed .nav-item { justify-content: flex-start; padding: 12px 14px; }
  .sidebar-collapsed .nav-item::after { display: none; }
  .sidebar-collapsed .profile-menu { left: 0; right: 0; bottom: 66px; width: auto; }
  .sidebar-collapsed .profile-chip, .sidebar-collapsed .mini-credit { justify-content: space-between; }
}
@media (max-width: 590px) {
  .field-grid.three, .file-list { grid-template-columns: 1fr; }
  .recipient-source-tabs { overflow-x: auto; }
  .recipient-tab { min-width: 105px; }
  .import-summary { gap: 12px; justify-content: space-between; }
  .recipient-preview-row { align-items: flex-start; }
  .recipient-row-end { align-items: flex-end; flex-direction: column; }
  .recipient-history-toolbar { align-items: flex-start; flex-direction: column; }
  .file-entry { grid-template-columns: auto auto minmax(0,1fr) auto; }
  .file-selected { display: none; }
  .reward-actions { flex-direction: column; }
}
@media (prefers-reduced-motion: reduce) { .reward-confetti { display: none; } .upload-spinner { animation: none; } }

.icon-button svg, .mock-file svg { width:18px; height:18px; fill:none; stroke:currentColor; stroke-width:1.8; stroke-linecap:round; stroke-linejoin:round; }
.mock-file { align-items:center; gap:6px; }


.mobile-bottom-nav { display: none; }
@media (max-width: 850px) {
  .mobile-bottom-nav { position: fixed; left: 0; right: 0; bottom: 0; z-index: 45; min-height: calc(68px + env(safe-area-inset-bottom)); padding: 6px 10px calc(6px + env(safe-area-inset-bottom)); border-top: 1px solid rgba(18,55,44,.1); background: rgba(255,255,255,.97); backdrop-filter: blur(12px); display: grid; grid-template-columns: 1fr minmax(118px,1.25fr) 1fr; align-items: center; gap: 6px; }
  .mobile-nav-item { min-width: 0; height: 54px; padding: 6px 8px; border: 0; border-radius: 10px; background: transparent; color: #7b8580; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 4px; font-size: 9px; font-weight: 780; cursor: pointer; }
  .mobile-nav-item svg { width: 20px; height: 20px; fill: none; stroke: currentColor; stroke-width: 1.9; stroke-linecap: round; stroke-linejoin: round; }
  .mobile-nav-item.active:not(.mobile-compose) { color: var(--brand); background: var(--brand-soft); }
  .mobile-compose { height: 52px; border-radius: 11px; background: var(--brand); color: white; flex-direction: row; gap: 7px; font-size: 10px; }
  .mobile-compose:active { transform: scale(.98); }
  .mobile-compose.active { background: var(--brand-dark); }
  .content { padding-bottom: calc(104px + env(safe-area-inset-bottom)); }
  .toast-stack { bottom: calc(82px + env(safe-area-inset-bottom)); }
}
@media (max-width: 370px) {
  .mobile-bottom-nav { grid-template-columns: 1fr minmax(104px,1.15fr) 1fr; padding-inline: 6px; }
  .mobile-nav-item { padding-inline: 5px; }
  .mobile-compose { font-size: 9px; }
}


/* Layout containment: sidebar and workspace always share the viewport exactly. */
.app-shell { width: 100%; max-width: 100vw; overflow-x: clip; }
.workspace { width: 100%; max-width: calc(100vw - 258px); overflow-x: clip; }
.sidebar-collapsed .workspace { max-width: calc(100vw - 76px); }
.content, .stat-grid, .dashboard-grid, .dashboard-grid > *, .stat-card, .panel, .campaign-row, .campaign-row > * { min-width: 0; }
.content { width: 100%; }
.campaign-row strong, .campaign-row small { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }

/* Keep the collapse control inside the dark rail; it must never create a visual gap. */
.sidebar-collapse { right: 4px; top: 16px; width: 22px; height: 30px; border-radius: 6px; color: rgba(255,255,255,.52); }
.sidebar-collapse:hover, .sidebar-collapse:focus-visible { background: rgba(255,255,255,.08); color: white; }
.sidebar-collapsed .sidebar-head { min-height: 84px; }
.sidebar-collapsed .sidebar-head .sidebar-brand { align-self: flex-start; }
.sidebar-collapsed .sidebar-collapse { right: 17px; top: 56px; width: 22px; height: 20px; border-radius: 5px; }
.sidebar-collapsed .sidebar-nav { margin-top: 16px; }

@media (max-width: 1100px) and (min-width: 851px) {
  .dashboard-grid { grid-template-columns: 1fr; }
  .onboarding-panel { min-height: 0; }
}
@media (max-width: 850px) {
  .workspace, .sidebar-collapsed .workspace { width: 100%; max-width: 100%; overflow-x: clip; }
}


/* Guided recipient entry */
.tab-paste { order: 1; }
.tab-csv { order: 2; }
.tab-manual { order: 3; }
.manual-optional-fields { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
.field > span small { margin-left: 4px; color: #929b96; font-size: 8px; font-weight: 650; text-transform: uppercase; letter-spacing: .05em; }
.manual-bulk-tip { position: relative; margin-top: 13px; padding: 13px 34px 13px 13px; border: 1px solid #dce8e2; border-radius: 11px; background: #f5f9f7; display: grid; grid-template-columns: 28px 1fr; gap: 10px; align-items: start; }
.bulk-tip-icon { width: 28px; height: 28px; border-radius: 8px; background: #e5f1eb; color: var(--brand); display: grid; place-items: center; }
.bulk-tip-icon svg, .example-trigger svg { width: 17px; height: 17px; fill: none; stroke: currentColor; stroke-width: 1.9; stroke-linecap: round; stroke-linejoin: round; }
.manual-bulk-tip strong { display: block; margin-top: 1px; font-size: 11px; }
.manual-bulk-tip p { margin: 3px 0 8px; color: var(--muted); font-size: 9px; line-height: 1.45; }
.bulk-tip-actions { display: flex; flex-wrap: wrap; gap: 6px; }
.bulk-tip-actions button { border: 0; border-bottom: 1px solid currentColor; background: transparent; padding: 2px 0; color: var(--brand); font-size: 9px; font-weight: 800; cursor: pointer; }
.bulk-tip-close { position: absolute; top: 7px; right: 8px; width: 24px; height: 24px; border: 0; background: transparent; color: #84908b; font-size: 17px; cursor: pointer; }
.example-trigger { display: inline-flex; align-items: center; gap: 5px; }
.recipient-example-modal h2 { margin: 7px 0; }
.format-example { margin: 18px 0 12px; padding: 16px; border: 1px solid var(--line); border-radius: 10px; background: #f7f9f8; color: #294a3e; font-family: ui-monospace, SFMono-Regular, Menlo, monospace; font-size: 11px; line-height: 1.75; white-space: pre-wrap; overflow-wrap: anywhere; }
.format-notes { display: grid; grid-template-columns: repeat(3,1fr); gap: 8px; }
.format-notes span { padding: 9px 10px; border: 1px solid var(--line); border-radius: 8px; color: var(--muted); font-size: 9px; }
.format-notes strong { display: block; margin-bottom: 2px; color: var(--text); font-size: 10px; }
.example-actions { display: flex; justify-content: flex-end; gap: 8px; margin-top: 18px; }

@media (max-width: 850px) {
  .tab-manual { order: 1; }
  .tab-paste { order: 2; }
  .tab-csv { order: 3; }
  .manual-recipient-panel { padding: 14px; }
  .manual-email-field { margin-bottom: 10px; }
  .manual-optional-fields { grid-template-columns: 1fr 1fr; gap: 9px; }
  #add-manual-recipient { width: 100%; min-height: 43px; }
}
@media (max-width: 420px) {
  .recipient-source-tabs { gap: 3px; }
  .recipient-tab { min-width: 0; padding-inline: 7px; font-size: 9px; }
  .manual-optional-fields { grid-template-columns: 1fr; gap: 0; }
  .format-notes { grid-template-columns: 1fr; }
  .example-actions { flex-direction: column; }
  .example-actions .button { width: 100%; }
}

#add-manual-recipient { box-shadow: none; }


/* Support and production operations */
.credit-actions { display:flex; align-items:center; gap:12px; margin-top:18px; }
.credit-actions .button-light { background:white; color:var(--brand-dark); }
.credit-link { border:0; background:transparent; color:white; font:inherit; font-size:11px; font-weight:750; text-decoration:underline; text-underline-offset:3px; cursor:pointer; }
.support-card { min-height:190px; }
.support-form { display:grid; gap:13px; margin-top:20px; }
.support-history { margin-top:24px; padding-top:18px; border-top:1px solid var(--line); }
.support-history-head { display:flex; justify-content:space-between; gap:12px; margin-bottom:10px; font-size:11px; }
.support-history-head span { color:var(--muted); }
.support-history-row { display:flex; align-items:flex-start; justify-content:space-between; gap:14px; padding:12px 0; border-bottom:1px solid #edf0f2; }
.support-history-row strong,.support-history-row small { display:block; }
.support-history-row small { margin-top:3px; color:var(--muted); font-size:9px; }
.support-history-row p { margin:8px 0 0; color:#3f5049; font-size:10px; }
.admin-toolbar { display:flex; align-items:center; justify-content:space-between; gap:20px; margin-bottom:14px; }
.admin-toolbar p { margin:5px 0 0; font-size:11px; }
.admin-tabs { display:flex; gap:5px; overflow-x:auto; margin-bottom:16px; padding:5px; border:1px solid var(--line); border-radius:13px; background:white; }
.admin-tab { flex:0 0 auto; border:0; border-radius:9px; padding:10px 14px; background:transparent; color:var(--muted); font-size:10px; font-weight:780; cursor:pointer; }
.admin-tab.active { background:var(--brand-soft); color:var(--brand); }
.admin-tab span { min-width:18px; margin-left:4px; padding:2px 5px; border-radius:999px; background:#eef2f0; font-size:8px; }
.admin-panel { display:none; }
.admin-panel.active { display:block; }
.admin-stat-grid { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:14px; margin-bottom:14px; }
.admin-overview-grid { display:grid; grid-template-columns:minmax(0,1.5fr) minmax(300px,.8fr); gap:14px; }
.usage-chart { height:230px; display:flex; align-items:stretch; gap:8px; padding-top:15px; overflow-x:auto; }
.usage-day { min-width:30px; flex:1; display:grid; grid-template-rows:1fr auto auto; gap:5px; text-align:center; }
.usage-bar { min-height:150px; display:flex; align-items:flex-end; justify-content:center; border-bottom:1px solid var(--line); }
.usage-bar i { width:min(22px,70%); min-height:4px; border-radius:6px 6px 2px 2px; background:var(--brand); opacity:.86; }
.usage-day strong { font-size:9px; }.usage-day small { color:var(--muted); font-size:8px; white-space:nowrap; }
.admin-alerts { display:grid; gap:9px; }
.admin-alert { display:flex; gap:11px; padding:12px; border:1px solid var(--line); border-radius:11px; background:#fafbfb; }
.admin-alert > span { height:21px; padding:5px 7px; border-radius:6px; background:#edf1ef; color:#56635e; font-size:7px; font-weight:850; }
.admin-alert.high > span { background:#fee9e7; color:#a73d35; }.admin-alert.medium > span { background:#fff2d9; color:#916017; }.admin-alert.info > span { background:#e7f3ee; color:var(--brand); }
.admin-alert strong,.admin-alert small { display:block; }.admin-alert strong { font-size:10px; }.admin-alert small { margin-top:3px; color:var(--muted); font-size:9px; }
.admin-empty-good { min-height:150px; display:grid; place-content:center; text-align:center; color:var(--brand); }.admin-empty-good span { margin-top:5px; color:var(--muted); font-size:10px; }
.metadata-cell { max-width:280px; color:#54615c; font-size:9px; overflow-wrap:anywhere; }
.privacy-note { margin:-7px 0 17px; padding:10px 12px; border-radius:9px; background:#f4f7f6; color:var(--muted); font-size:9px; }
.admin-request-modal .request-customer { display:flex; flex-wrap:wrap; justify-content:space-between; gap:6px; margin:14px 0; padding:12px; border-radius:10px; background:#f5f7f6; font-size:10px; }
.admin-request-modal .request-customer span { color:var(--muted); }.request-message { padding:15px; border:1px solid var(--line); border-radius:11px; white-space:pre-wrap; font-size:11px; line-height:1.65; }
.grant-box { margin-top:18px; padding:16px; border:1px solid #cfe3da; border-radius:12px; background:#f4faf7; }.grant-box > strong { display:block; margin-bottom:12px; }
td code { font-size:9px; color:#355248; overflow-wrap:anywhere; }
.usage-bar i.h-0{height:0%}
.usage-bar i.h-5{height:5%}
.usage-bar i.h-10{height:10%}
.usage-bar i.h-15{height:15%}
.usage-bar i.h-20{height:20%}
.usage-bar i.h-25{height:25%}
.usage-bar i.h-30{height:30%}
.usage-bar i.h-35{height:35%}
.usage-bar i.h-40{height:40%}
.usage-bar i.h-45{height:45%}
.usage-bar i.h-50{height:50%}
.usage-bar i.h-55{height:55%}
.usage-bar i.h-60{height:60%}
.usage-bar i.h-65{height:65%}
.usage-bar i.h-70{height:70%}
.usage-bar i.h-75{height:75%}
.usage-bar i.h-80{height:80%}
.usage-bar i.h-85{height:85%}
.usage-bar i.h-90{height:90%}
.usage-bar i.h-95{height:95%}
.usage-bar i.h-100{height:100%}
@media (max-width:1100px){.admin-stat-grid{grid-template-columns:1fr 1fr}.admin-overview-grid{grid-template-columns:1fr}}
@media (max-width:590px){.credit-actions{align-items:stretch;flex-direction:column}.credit-actions .button,.credit-link{width:100%;text-align:center}.admin-toolbar{align-items:flex-start}.admin-stat-grid{grid-template-columns:1fr 1fr;gap:9px}.admin-stat-grid .stat-card{padding:16px}.admin-stat-grid .stat-card strong{font-size:27px}.admin-tabs{margin-inline:-2px}.admin-tab{padding-inline:11px}.usage-chart{gap:5px}.modal-card{padding:22px 17px}.support-history-row{align-items:flex-start}.admin-request-modal .field-grid.two,.grant-box .field-grid.two{grid-template-columns:1fr}}


/* Interface language and Arabic RTL */
.language-switch { min-height:38px; display:inline-flex; align-items:center; gap:7px; padding:5px 7px 5px 10px; border:1px solid var(--line); border-radius:10px; background:white; color:var(--muted); font-size:9px; font-weight:750; white-space:nowrap; }
.language-switch select { min-width:56px; border:0; outline:0; background:transparent; color:var(--text); font-size:10px; font-weight:800; cursor:pointer; }
.language-globe { display:none; width:16px; height:16px; flex:0 0 16px; fill:none; stroke:currentColor; stroke-width:1.7; stroke-linecap:round; stroke-linejoin:round; }
.landing-nav .language-switch { margin-inline-start:auto; margin-inline-end:12px; }
.language-card .language-switch { width:100%; margin-top:13px; justify-content:space-between; }
.language-card .language-switch select { min-width:120px; text-align:end; }
html[dir="rtl"] body { font-family:"Segoe UI",Tahoma,Arial,sans-serif; }
html[dir="rtl"] .app-shell { grid-template-columns:1fr 258px; }
html[dir="rtl"] .sidebar { inset:0 0 0 auto; }
html[dir="rtl"] .workspace { grid-column:1; }
html[dir="rtl"] .nav-item, html[dir="rtl"] .nav-item .nav-label, html[dir="rtl"] .profile-chip { text-align:right; }
html[dir="rtl"] .sidebar-collapse { right:auto; left:4px; }
html[dir="rtl"] .sidebar-collapse svg { transform:scaleX(-1); }
html[dir="rtl"] .sidebar-collapsed { grid-template-columns:1fr 76px; }
html[dir="rtl"] .sidebar-collapsed .sidebar-collapse { right:auto; left:17px; }
html[dir="rtl"] .sidebar-collapsed .sidebar-collapse svg { transform:none; }
html[dir="rtl"] .sidebar-collapsed .nav-item::after { left:auto; right:58px; }
html[dir="rtl"] .sidebar-collapsed .profile-menu { left:auto; right:56px; }
html[dir="rtl"] .profile-menu svg, html[dir="rtl"] .brand-mark svg, html[dir="rtl"] .connection-logo { direction:ltr; }
html[dir="rtl"] .text-button { direction:rtl; }
html[dir="rtl"] input[type="email"], html[dir="rtl"] input[name="subject"], html[dir="rtl"] #recipients-input, html[dir="rtl"] code, html[dir="rtl"] .format-example { direction:ltr; text-align:left; }
html[dir="rtl"] textarea[name="bodyText"], html[dir="rtl"] input[name="name"] { text-align:start; }
html[dir="rtl"] .email-preview-body, html[dir="rtl"] .request-message { text-align:start; }
html[dir="rtl"] .progress-mini, html[dir="rtl"] .onboarding-track { direction:ltr; }
@media (max-width:850px){
  .top-actions .language-switch span { display:none; }
  .top-actions .language-switch { min-height:36px; padding-inline:6px; }
  html[dir="rtl"] .sidebar, html[dir="rtl"] .sidebar-collapsed .sidebar { transform:translateX(100%); }
  html[dir="rtl"] .sidebar.open { transform:translateX(0); }
  html[dir="rtl"] .app-shell, html[dir="rtl"] .sidebar-collapsed { display:block; }
  html[dir="rtl"] .workspace { grid-column:auto; }
  html[dir="rtl"] .sidebar-collapsed .profile-menu { left:0; right:0; }
}
@media (max-width:590px){
  .landing-nav .language-switch span { display:none; }
  .landing-nav .language-switch { min-height:40px; margin-inline-start:auto; margin-inline-end:4px; gap:4px; padding:5px 7px; border-radius:9px; }
  .landing-nav .language-globe { display:block; }
  .landing-nav .language-switch select { min-width:38px; }
}

/* Keep physical grid columns stable while text remains RTL. */
html[dir="rtl"] .app-shell { direction:ltr; }
html[dir="rtl"] .sidebar, html[dir="rtl"] .workspace { direction:rtl; }

.field > span > b, .credit-split > span > b, .admin-tab > b { font:inherit; color:inherit; }
.recipient-tab > span { pointer-events:none; }

/* Branded confirmations and schedule editing */
.confirm-dialog { display:grid; grid-template-columns:52px minmax(0,1fr); gap:16px; align-items:start; }
.confirm-dialog h2, .reschedule-modal h2 { margin:5px 0 8px; font-size:24px; letter-spacing:-.035em; }
.confirm-dialog p { margin:0; color:var(--muted); font-size:11px; line-height:1.65; }
.confirm-icon { width:48px; height:48px; display:grid; place-items:center; border-radius:14px; background:#edf6f2; color:var(--brand); }
.confirm-icon svg { width:25px; height:25px; fill:none; stroke:currentColor; stroke-width:1.8; stroke-linecap:round; stroke-linejoin:round; }
.confirm-dialog.danger .confirm-icon { background:#fbeeee; color:var(--danger); }
.confirm-actions { grid-column:1 / -1; display:flex; justify-content:flex-end; gap:9px; margin-top:8px; }
.current-schedule { display:flex; align-items:center; justify-content:space-between; gap:16px; margin:18px 0; padding:13px 14px; border:1px solid #cfe2da; border-radius:11px; background:#f4f9f7; }
.current-schedule span { color:var(--muted); font-size:10px; }
.current-schedule strong { font-size:11px; }
.reschedule-form { display:grid; grid-template-columns:1fr 1fr; gap:13px; }
.reschedule-note { grid-column:1 / -1; margin:0; padding:10px 12px; border-radius:9px; background:#f5f7f6; color:var(--muted); font-size:9px; line-height:1.55; }
.table-action.emphasized { padding:6px 9px; border-radius:7px; background:#eaf5f0; color:var(--brand-dark); }
html[dir="rtl"] .modal-close { right:auto; left:14px; }
@media (max-width:590px) {
  .schedule-context { grid-template-columns:auto minmax(0,1fr); }
  .schedule-context .text-button { grid-column:2; justify-self:start; padding-top:0; }
  .confirm-dialog { grid-template-columns:42px minmax(0,1fr); gap:12px; }
  .confirm-icon { width:40px; height:40px; border-radius:12px; }
  .confirm-dialog h2, .reschedule-modal h2 { font-size:21px; }
  .confirm-actions { flex-direction:column-reverse; }
  .confirm-actions .button { width:100%; }
  .reschedule-form { grid-template-columns:1fr; }
  .reschedule-note, .reschedule-form .confirm-actions { grid-column:1; }
  .current-schedule { align-items:flex-start; flex-direction:column; gap:4px; }
}body.modal-open .toast-stack { top:12px; bottom:auto; }
@media (max-width:590px) {
  .schedule-context { grid-template-columns:auto minmax(0,1fr); }
  .schedule-context .text-button { grid-column:2; justify-self:start; padding-top:0; } body.modal-open .toast-stack { right:20px; width:calc(100vw - 40px); } }
/* Compact topbar language control */
.top-actions .language-switch-compact { min-height:38px; padding:0 9px; gap:6px; border-radius:10px; direction:ltr; cursor:pointer; transition:border-color .18s ease, background-color .18s ease; }
.top-actions .language-switch-compact:hover { border-color:#cfd8d4; background:#fbfcfb; }
.top-actions .language-switch-compact:focus-within { border-color:#7da697; box-shadow:0 0 0 3px rgba(31,105,78,.08); }
.language-switch-compact .language-globe { width:16px; height:16px; color:#527067; fill:none; stroke:currentColor; stroke-width:1.7; stroke-linecap:round; stroke-linejoin:round; }
.language-switch-compact .language-chevron { width:12px; height:12px; color:#66736e; fill:none; stroke:currentColor; stroke-width:2.1; stroke-linecap:round; stroke-linejoin:round; pointer-events:none; }
.top-actions .language-switch-compact select { min-width:23px; width:23px; padding:0; appearance:none; -webkit-appearance:none; direction:ltr; text-align:center; text-align-last:center; line-height:1; }
@media (max-width:850px) {
  .top-actions .language-switch-compact { min-height:36px; padding-inline:8px; gap:5px; }
  .language-switch-compact .language-globe { width:15px; height:15px; }
}
/* Full-hit language selector and RTL toast placement */
.top-actions .language-switch-compact { position:relative; }
.language-switch-compact .language-code { min-width:23px; color:var(--text); font-size:10px; font-weight:800; line-height:1; text-align:center; pointer-events:none; }
.top-actions .language-switch-compact select { position:absolute; inset:0; z-index:2; width:100%; height:100%; min-width:100%; opacity:0; cursor:pointer; }
html[dir="rtl"] .toast-stack { right:auto; left:20px; }
html[dir="rtl"] .toast { direction:rtl; text-align:right; }
@media (max-width:590px) {
  .schedule-context { grid-template-columns:auto minmax(0,1fr); }
  .schedule-context .text-button { grid-column:2; justify-self:start; padding-top:0; } html[dir="rtl"] body.modal-open .toast-stack { right:auto; left:20px; } }
/* Interactive support inbox */
.profile-avatar-wrap { position:relative; flex:0 0 auto; display:grid; place-items:center; }
.profile-support-badge { min-width:18px; height:18px; padding:0 5px; display:inline-grid; place-items:center; margin-inline-start:auto; border:2px solid white; border-radius:999px; background:#c53b3b; color:white; font-size:8px; font-weight:850; line-height:1; }
.profile-avatar-wrap .profile-support-badge { position:absolute; top:-6px; right:-7px; margin:0; }
html[dir="rtl"] .profile-avatar-wrap .profile-support-badge { right:auto; left:-7px; }
.profile-chip.has-support-unread { background:rgba(255,255,255,.08); }
.modal-card:has(.support-inbox), .modal-card:has(.support-thread), .modal-card:has(.admin-request-modal) { width:min(720px,100%); }
.support-inbox-head { display:flex; align-items:flex-start; justify-content:space-between; gap:18px; margin-bottom:22px; padding-inline-end:48px; }
.support-inbox-head h2, .support-thread h2 { margin:5px 0 5px; font-size:25px; letter-spacing:-.035em; }
.support-inbox-list { display:grid; border-top:1px solid var(--line); }
.support-thread-row { width:100%; display:grid; grid-template-columns:42px minmax(0,1fr) auto; gap:12px; align-items:center; padding:14px 3px; border:0; border-bottom:1px solid var(--line); background:white; color:var(--text); text-align:start; cursor:pointer; }
.support-thread-row:hover { background:#fbfcfb; }
.support-thread-row.unread { background:#f5faf7; }
.support-thread-icon, .support-empty-icon { width:38px; height:38px; display:grid; place-items:center; border-radius:10px; background:#edf4f1; color:var(--brand); }
.support-thread-icon svg, .support-empty-icon svg, .support-back svg { width:19px; height:19px; fill:none; stroke:currentColor; stroke-width:1.8; stroke-linecap:round; stroke-linejoin:round; }
.support-thread-copy { min-width:0; display:block; }
.support-thread-copy > span { display:flex; align-items:center; gap:7px; }
.support-thread-copy strong { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; font-size:11px; }
.support-thread-copy b { padding:2px 5px; border-radius:999px; background:#dcefe6; color:var(--brand); font-size:8px; text-transform:uppercase; letter-spacing:.05em; }
.support-thread-copy small { display:block; margin-top:4px; overflow:hidden; color:var(--muted); font-size:9px; text-overflow:ellipsis; white-space:nowrap; }
.support-thread-copy time { display:block; margin-top:4px; color:#9aa39f; font-size:8px; }
.support-empty { padding:38px 20px; display:grid; justify-items:center; text-align:center; }
.support-empty strong { margin-top:13px; font-size:14px; }
.support-empty p { max-width:340px; margin:6px 0 16px; color:var(--muted); font-size:10px; line-height:1.6; }
.support-back { display:inline-flex; align-items:center; gap:5px; margin:0 0 13px; padding:0; border:0; background:transparent; color:var(--brand); font-size:10px; font-weight:800; cursor:pointer; }
html[dir="rtl"] .support-back svg { transform:scaleX(-1); }
.support-thread-head { display:flex; align-items:flex-start; justify-content:space-between; gap:12px; margin-bottom:15px; }
.support-conversation { max-height:340px; overflow:auto; display:grid; gap:10px; padding:15px; border:1px solid var(--line); border-radius:12px; background:#fafbfa; scroll-behavior:smooth; }
.support-message { display:flex; }
.support-message > div { max-width:78%; padding:10px 12px; border:1px solid #e4e9e7; border-radius:11px; background:white; }
.support-message.own { justify-content:flex-end; }
.support-message.own > div { border-color:#cfe3da; background:#eaf5f0; }
.support-message strong { display:block; margin-bottom:4px; color:var(--brand-dark); font-size:8px; letter-spacing:.04em; text-transform:uppercase; }
.support-message p { margin:0; color:#27332f; font-size:10px; line-height:1.6; white-space:pre-wrap; overflow-wrap:anywhere; }
.support-message time { display:block; margin-top:5px; color:#84908b; font-size:7px; }
.support-reply-form { display:grid; grid-template-columns:minmax(0,1fr) auto; gap:10px; align-items:end; margin-top:13px; }
.support-reply-form .field { margin:0; }
.support-reply-form textarea { min-height:78px; resize:vertical; }
.support-reply-form .button { min-height:42px; }
.support-closed { margin:13px 0 0; padding:11px 12px; border-radius:9px; background:#f3f5f4; color:var(--muted); font-size:9px; }
.admin-conversation { margin:14px 0 18px; }
.admin-unread-dot { display:inline-grid; min-width:18px; height:18px; place-items:center; margin-inline-start:5px; border-radius:999px; background:#c53b3b; color:white; font-size:8px; }
.support-row-unread td { background:#f7fbf9; }
@media (max-width:850px) {
}
@media (max-width:590px) {
  .schedule-context { grid-template-columns:auto minmax(0,1fr); }
  .schedule-context .text-button { grid-column:2; justify-self:start; padding-top:0; }
  .support-inbox-head { align-items:stretch; flex-direction:column; }
  .support-inbox-head .button { width:100%; }
  .support-thread-row { grid-template-columns:38px minmax(0,1fr); }
  .support-thread-row > .badge { grid-column:2; justify-self:start; }
  .support-reply-form { grid-template-columns:1fr; }
  .support-reply-form .button { width:100%; }
  .support-message > div { max-width:88%; }
  .support-conversation { max-height:300px; padding:11px; }
}

/* Production landing page */
body { font-family:"SF Pro Display","Helvetica Neue","Segoe UI",ui-sans-serif,system-ui,sans-serif; }
.landing { overflow:hidden; background:#f3f6f3; }
.landing-nav { border-bottom:0; }
.landing-nav .landing-sign-in { min-width:86px; box-shadow:none; }
.hero { min-height:680px; padding:72px 0 96px; }
.hero-copy { max-width:660px; }
.hero h1 { max-width:660px; }
.hero-copy > p { max-width:620px; }
.hero .button-primary { box-shadow:none; }
.trust-row span { display:inline-flex; align-items:center; gap:7px; }
.trust-row svg { width:17px; height:17px; padding:2px; border:1px solid #cddbd5; border-radius:50%; color:var(--brand); fill:none; stroke:currentColor; stroke-width:2; stroke-linecap:round; stroke-linejoin:round; }
.trust-row b { font:inherit; }
.mock-window { border:1px solid #e4e9e6; border-radius:16px; box-shadow:0 20px 60px rgba(27,50,41,.09); transform:rotate(.6deg); }
.floating-card { border-radius:10px; box-shadow:0 8px 26px rgba(27,50,41,.07); }
.workflow-section, .benefit-section { padding:96px 0 0; }
.landing-section-heading { max-width:720px; margin-bottom:30px; }
.landing-section-heading h2 { max-width:680px; margin:12px 0 12px; font-size:clamp(32px,4vw,52px); line-height:1.04; letter-spacing:-.048em; }
.landing-section-heading p { max-width:590px; margin:0; color:var(--muted); font-size:16px; line-height:1.7; }
.compact-heading { max-width:760px; }
.feature-section { margin-bottom:0; border-color:#e2e7e4; border-radius:12px; background:#e2e7e4; }
.feature-section > div { min-height:220px; padding:36px; }
.feature-section h3 { font-size:19px; letter-spacing:-.02em; }
.benefit-section { padding-bottom:96px; }
.benefit-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:14px; }
.benefit-grid article { min-height:265px; padding:30px; border:1px solid #e2e7e4; border-radius:12px; background:#fff; transition:transform .2s ease,box-shadow .2s ease; }
.benefit-grid article:hover { transform:translateY(-2px); box-shadow:0 2px 8px rgba(0,0,0,.04); }
.benefit-icon { width:42px; height:42px; display:grid; place-items:center; border-radius:10px; background:#edf3f0; color:var(--brand); }
.benefit-icon svg { width:22px; height:22px; fill:none; stroke:currentColor; stroke-width:1.8; stroke-linecap:round; stroke-linejoin:round; }
.benefit-grid h3 { margin:52px 0 10px; font-size:20px; letter-spacing:-.025em; }
.benefit-grid p { margin:0; color:var(--muted); font-size:14px; line-height:1.7; }
.landing-cta { min-height:250px; margin-bottom:76px; padding:48px; display:flex; align-items:center; justify-content:space-between; gap:40px; border:1px solid #dce5e0; border-radius:12px; background:#eef3f0; }
.landing-cta > div { max-width:720px; }
.landing-cta h2 { margin:10px 0; font-size:clamp(30px,4vw,48px); line-height:1.05; letter-spacing:-.045em; }
.landing-cta p { max-width:600px; margin:0; color:#64706b; font-size:15px; line-height:1.7; }
.landing-cta .button { flex:0 0 auto; box-shadow:none; }
.landing-footer { min-height:96px; }
[data-reveal] { opacity:0; transform:translateY(12px); transition:opacity .6s cubic-bezier(.16,1,.3,1),transform .6s cubic-bezier(.16,1,.3,1); }
[data-reveal].is-visible { opacity:1; transform:none; }
html[dir="rtl"] .landing-section-heading, html[dir="rtl"] .landing-cta { text-align:right; }
@media (max-width:850px) {
  .hero { min-height:auto; padding:54px 0 70px; gap:54px; }
  .workflow-section, .benefit-section { padding-top:72px; }
  .benefit-grid { grid-template-columns:1fr; }
  .benefit-grid article { min-height:0; }
  .benefit-grid h3 { margin-top:28px; }
  .landing-cta { align-items:flex-start; flex-direction:column; }
}
@media (max-width:590px) {
  .schedule-context { grid-template-columns:auto minmax(0,1fr); }
  .schedule-context .text-button { grid-column:2; justify-self:start; padding-top:0; }
  .landing-nav { height:72px; gap:8px; }
  .landing-nav .brand-wordmark { display:none; }
  .landing-nav .brand-mark { width:40px; height:40px; flex-basis:40px; }
  .landing-nav .landing-sign-in { min-width:72px; padding:10px 13px; white-space:nowrap; }
  .hero { padding:44px 0 58px; }
  .hero h1 { margin-top:15px; font-size:43px; line-height:1.01; letter-spacing:-.055em; }
  .hero-copy > p { font-size:16px; line-height:1.7; }
  .trust-row { gap:12px 18px; margin-top:27px; font-size:11px; }
  .mock-window { transform:none; border-radius:14px; }
  .workflow-section, .benefit-section { padding-top:64px; }
  .landing-section-heading { margin-bottom:24px; }
  .landing-section-heading h2 { font-size:34px; }
  .feature-section > div { min-height:0; padding:30px 28px; }
  .benefit-section { padding-bottom:64px; }
  .benefit-grid article { padding:26px; }
  .landing-cta { min-height:0; margin-bottom:52px; padding:30px 26px; gap:26px; }
  .landing-cta h2 { font-size:33px; }
  .landing-cta .button { width:100%; }
  .landing-footer { padding:26px 0; }
}
@media (prefers-reduced-motion:reduce) {
  [data-reveal] { opacity:1; transform:none; transition:none; }
}
/* Production legal documents */
.legal-document { min-height:100vh; background:#f3f6f3; color:var(--text); }
.legal-document a { color:inherit; }
.legal-header { min-height:92px; display:flex; align-items:center; justify-content:space-between; gap:24px; }
.legal-home-link { padding:10px 13px; border:1px solid #dce4df; border-radius:7px; background:#fff; color:#51615a; font-size:11px; font-weight:750; }
.legal-home-link:hover { border-color:#b9ccc2; color:var(--brand); }
.legal-page { padding:56px 0 84px; }
.legal-title-block { max-width:920px; margin:0 auto 54px; }
.legal-title-block h1 { max-width:780px; margin:14px 0 18px; font-size:clamp(44px,7vw,78px); line-height:.98; letter-spacing:-.06em; }
.legal-title-block > p { max-width:720px; margin:0; color:#68736e; font-size:17px; line-height:1.72; }
.legal-meta { display:flex; flex-wrap:wrap; gap:10px 22px; margin-top:28px; padding-top:20px; border-top:1px solid #dfe6e2; color:#6d7873; font-size:11px; }
.legal-meta span { display:flex; gap:6px; }
.legal-meta b { color:#28342f; }
.legal-meta a { color:var(--brand); text-decoration:underline; text-underline-offset:3px; }
.legal-layout { max-width:1120px; margin:0 auto; display:grid; grid-template-columns:220px minmax(0,1fr); align-items:start; gap:64px; }
.legal-rail { position:sticky; top:28px; display:grid; gap:3px; padding:9px; border:1px solid #e0e6e3; border-radius:10px; background:#eef3f0; }
.legal-rail a { padding:9px 10px; border-radius:6px; color:#66736d; font-size:10px; font-weight:700; }
.legal-rail a:hover { background:#fff; color:var(--brand); }
.legal-page .legal-content { max-width:none; margin:0; padding:0 42px; border:1px solid #e3e8e5; border-radius:12px; background:#fff; box-shadow:none; }
.legal-content section { padding:38px 0; border-bottom:1px solid #e9edeb; scroll-margin-top:24px; }
.legal-content section:last-child { border-bottom:0; }
.legal-page .legal-content h2 { margin:0 0 15px; font-size:24px; line-height:1.2; letter-spacing:-.035em; }
.legal-page .legal-content h3 { margin:25px 0 7px; font-size:14px; letter-spacing:-.01em; }
.legal-page .legal-content p { margin:0 0 15px; color:#5f6b65; font-size:13px; line-height:1.78; }
.legal-page .legal-content p:last-child { margin-bottom:0; }
.legal-content ul { margin:13px 0 18px; padding-left:20px; color:#5f6b65; font-size:13px; line-height:1.72; }
.legal-content li + li { margin-top:8px; }
.legal-content a { color:var(--brand); text-decoration:underline; text-decoration-color:#a8c1b5; text-underline-offset:3px; }
.legal-content code { padding:2px 5px; border:1px solid #e1e7e4; border-radius:4px; background:#f4f6f5; color:#24483c; font-family:"SF Mono","JetBrains Mono",monospace; font-size:.9em; }
.legal-content address { color:#5f6b65; font-size:13px; font-style:normal; line-height:1.85; }
.legal-content address strong { color:var(--text); }
.legal-callout { margin:18px 0 22px; padding:21px 22px; border:1px solid #d7e4dd; border-radius:9px; background:#edf3f0; }
.legal-callout > strong { display:block; margin-bottom:7px; color:#194f3f; font-size:12px; }
.legal-callout p { margin:0; }
.retention-table { margin:20px 0; border-top:1px solid #e3e8e5; }
.retention-table > div { display:grid; grid-template-columns:minmax(150px,.8fr) minmax(0,1.6fr); gap:24px; padding:15px 0; border-bottom:1px solid #e3e8e5; }
.retention-table b { color:#28342f; font-size:11px; }
.retention-table span { color:#66736d; font-size:11px; line-height:1.55; }
.subprocessor-list { display:grid; gap:12px; margin-top:22px; }
.legal-page .subprocessor-list article { max-width:none; margin:0; padding:23px; border:1px solid #e3e8e5; border-radius:9px; background:#fafbf9; }
.subprocessor-list article > div { display:flex; align-items:flex-start; justify-content:space-between; gap:20px; margin-bottom:13px; }
.subprocessor-list strong, .subprocessor-list span { display:block; }
.subprocessor-list strong { font-size:13px; }
.subprocessor-list span { color:var(--brand); font-size:10px; font-weight:750; text-align:right; }
.subprocessor-list small { color:#7a8580; font-size:9px; line-height:1.5; }
.legal-footer { min-height:96px; display:flex; align-items:center; justify-content:space-between; gap:24px; border-top:1px solid #dfe6e2; color:#6d7873; font-size:10px; }
.legal-footer nav { display:flex; flex-wrap:wrap; gap:18px; }
.legal-footer a:hover, .legal-footer a[aria-current="page"] { color:var(--brand); }
.oauth-disclosure { margin:15px 0 0; padding:13px 14px; border:1px solid #dce7e1; border-radius:9px; background:#f3f7f5; color:#617069; font-size:9px; line-height:1.55; }
.oauth-disclosure a { color:var(--brand); font-weight:800; text-decoration:underline; text-underline-offset:2px; }
.account-legal-links { display:flex; flex-wrap:wrap; gap:8px; margin-top:14px; }
.account-legal-links a { padding:8px 10px; border:1px solid var(--line); border-radius:7px; color:#53625b; font-size:9px; font-weight:750; }
.account-legal-links a:hover { border-color:#b8ccc2; color:var(--brand); }
@media (max-width:850px) {
  .legal-page { padding-top:38px; }
  .legal-title-block { margin-bottom:34px; }
  .legal-layout { grid-template-columns:1fr; gap:18px; }
  .legal-rail { position:static; display:flex; overflow-x:auto; padding:7px; }
  .legal-rail a { flex:0 0 auto; }
  .legal-page .legal-content { padding:0 28px; }
}
@media (max-width:590px) {
  .legal-header { min-height:76px; }
  .legal-header .brand-wordmark { display:none; }
  .legal-header .brand-mark { width:39px; height:39px; flex-basis:39px; }
  .legal-title-block h1 { font-size:46px; }
  .legal-title-block > p { font-size:15px; }
  .legal-meta { display:grid; gap:8px; }
  .legal-page .legal-content { padding:0 21px; }
  .legal-content section { padding:30px 0; }
  .legal-page .legal-content h2 { font-size:21px; }
  .retention-table > div { grid-template-columns:1fr; gap:6px; }
  .subprocessor-list article > div { display:block; }
  .subprocessor-list span { margin-top:5px; text-align:left; }
  .legal-footer { align-items:flex-start; flex-direction:column; justify-content:center; padding:26px 0; }
}
.system-health-panel { box-shadow:none; }
.health-checked { color:var(--muted); font-size:10px; font-weight:700; }
.system-health-alerts { display:grid; gap:9px; margin:18px 0; }
.system-alert { display:grid; grid-template-columns:auto 1fr; gap:12px; align-items:start; padding:13px 15px; border:1px solid var(--line); border-radius:9px; background:#fbfbfa; }
.system-alert > span { padding:3px 7px; border-radius:999px; font-size:8px; font-weight:850; letter-spacing:.06em; }
.system-alert strong, .system-alert p, .system-alert small { display:block; }
.system-alert p { margin:3px 0; color:var(--text); font-size:10px; }
.system-alert small { color:var(--muted); line-height:1.45; }
.system-alert.warning > span { background:#fbf3db; color:#956400; }
.system-alert.critical > span { background:#fdebec; color:#9f2f2d; }
.system-health-grid { display:grid; grid-template-columns:repeat(auto-fit, minmax(210px, 1fr)); gap:12px; margin-top:16px; }
.health-metric-card { min-height:126px; padding:17px 18px; border:1px solid var(--line); border-radius:10px; background:#fff; box-shadow:none; }
.health-metric-card .health-label { display:flex; align-items:center; justify-content:space-between; gap:8px; font-size:9px; font-weight:800; color:#5c6b64; margin-bottom:10px; text-transform:uppercase; letter-spacing:.05em; }
.health-metric-card .health-val { font-size:18px; font-weight:800; color:var(--text); letter-spacing:-.02em; }
.health-metric-card small { display:block; margin-top:6px; color:var(--muted); font-size:9px; line-height:1.45; }
.health-bar-track { height:6px; border-radius:4px; background:#e8eee9; overflow:hidden; margin-top:12px; }
.health-bar-fill { height:100%; border-radius:4px; background:var(--brand); transition:width .4s ease; }
.health-bar-fill.p-0 { width:0%; }.health-bar-fill.p-5 { width:5%; }.health-bar-fill.p-10 { width:10%; }.health-bar-fill.p-15 { width:15%; }.health-bar-fill.p-20 { width:20%; }.health-bar-fill.p-25 { width:25%; }.health-bar-fill.p-30 { width:30%; }.health-bar-fill.p-35 { width:35%; }.health-bar-fill.p-40 { width:40%; }.health-bar-fill.p-45 { width:45%; }.health-bar-fill.p-50 { width:50%; }.health-bar-fill.p-55 { width:55%; }.health-bar-fill.p-60 { width:60%; }.health-bar-fill.p-65 { width:65%; }.health-bar-fill.p-70 { width:70%; }.health-bar-fill.p-75 { width:75%; }.health-bar-fill.p-80 { width:80%; }.health-bar-fill.p-85 { width:85%; }.health-bar-fill.p-90 { width:90%; }.health-bar-fill.p-95 { width:95%; }.health-bar-fill.p-100 { width:100%; }
.health-bar-fill.warning { background:#c58b23; }
.health-bar-fill.danger { background:#b74743; }
.health-badge { display:inline-flex; align-items:center; gap:5px; padding:3px 7px; border-radius:999px; font-size:8px; font-weight:800; background:#edf3ec; color:#346538; }
.health-badge i { width:6px; height:6px; border-radius:50%; background:currentColor; }
.health-badge.error, .health-badge.stale { background:#fdebec; color:#9f2f2d; }
.health-badge.never_reported { background:#fbf3db; color:#956400; }
@media (max-width:590px) { .system-health-grid { grid-template-columns:1fr; } .system-alert { grid-template-columns:1fr; } }

/* Privacy-safe admin traffic analytics */
.traffic-toolbar { display:flex; align-items:flex-end; justify-content:space-between; gap:18px; margin-bottom:16px; }
.traffic-toolbar h2 { margin:3px 0 4px; }
.traffic-period { display:grid; gap:5px; min-width:130px; color:var(--muted); font-size:10px; font-weight:750; }
.traffic-period select { min-height:42px; border:1px solid var(--line); border-radius:11px; padding:0 12px; background:white; color:var(--ink); font:inherit; }
.traffic-metrics { margin-bottom:16px; }
.traffic-layout { display:grid; grid-template-columns:minmax(0,1.65fr) minmax(280px,.8fr); gap:16px; }
.traffic-chart { height:230px; display:flex; align-items:flex-end; gap:5px; padding-top:18px; overflow-x:auto; }
.traffic-day { min-width:12px; flex:1 0 12px; height:100%; display:grid; grid-template-rows:1fr 20px; gap:6px; text-align:center; }
.traffic-day > span { min-height:150px; display:flex; align-items:flex-end; justify-content:center; border-bottom:1px solid var(--line); }
.traffic-day i { display:block; width:min(16px,75%); min-height:3px; border-radius:5px 5px 1px 1px; background:var(--brand); }
.traffic-day small { color:var(--muted); font-size:8px; white-space:nowrap; overflow:hidden; }
.traffic-funnel { display:grid; gap:18px; margin-top:24px; }
.traffic-funnel-row > div:first-child,.traffic-list-row > div:first-child { display:flex; justify-content:space-between; gap:12px; margin-bottom:7px; }
.traffic-funnel-row span,.traffic-list-row span { color:var(--muted); font-size:11px; }
.traffic-funnel-track,.traffic-mini-track { height:7px; border-radius:999px; background:#e8eeeb; overflow:hidden; }
.traffic-funnel-track i,.traffic-mini-track i { display:block; height:100%; border-radius:inherit; background:var(--brand); }
.traffic-breakdowns { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:16px; margin-top:16px; }
.traffic-breakdowns .panel { padding:20px; }
.traffic-breakdowns h3 { margin:0 0 17px; font-size:15px; }
.traffic-list { display:grid; gap:14px; }
.traffic-mini-track { height:5px; }
.traffic-empty { color:var(--muted); font-size:12px; padding:12px 0; }
.traffic-privacy { margin-top:14px; }
.traffic-funnel-track i.p-0,.traffic-mini-track i.p-0{width:0%}.traffic-funnel-track i.p-5,.traffic-mini-track i.p-5{width:5%}.traffic-funnel-track i.p-10,.traffic-mini-track i.p-10{width:10%}.traffic-funnel-track i.p-15,.traffic-mini-track i.p-15{width:15%}.traffic-funnel-track i.p-20,.traffic-mini-track i.p-20{width:20%}.traffic-funnel-track i.p-25,.traffic-mini-track i.p-25{width:25%}.traffic-funnel-track i.p-30,.traffic-mini-track i.p-30{width:30%}.traffic-funnel-track i.p-35,.traffic-mini-track i.p-35{width:35%}.traffic-funnel-track i.p-40,.traffic-mini-track i.p-40{width:40%}.traffic-funnel-track i.p-45,.traffic-mini-track i.p-45{width:45%}.traffic-funnel-track i.p-50,.traffic-mini-track i.p-50{width:50%}.traffic-funnel-track i.p-55,.traffic-mini-track i.p-55{width:55%}.traffic-funnel-track i.p-60,.traffic-mini-track i.p-60{width:60%}.traffic-funnel-track i.p-65,.traffic-mini-track i.p-65{width:65%}.traffic-funnel-track i.p-70,.traffic-mini-track i.p-70{width:70%}.traffic-funnel-track i.p-75,.traffic-mini-track i.p-75{width:75%}.traffic-funnel-track i.p-80,.traffic-mini-track i.p-80{width:80%}.traffic-funnel-track i.p-85,.traffic-mini-track i.p-85{width:85%}.traffic-funnel-track i.p-90,.traffic-mini-track i.p-90{width:90%}.traffic-funnel-track i.p-95,.traffic-mini-track i.p-95{width:95%}.traffic-funnel-track i.p-100,.traffic-mini-track i.p-100{width:100%}
.traffic-day i.h-5{height:5%}.traffic-day i.h-10{height:10%}.traffic-day i.h-15{height:15%}.traffic-day i.h-20{height:20%}.traffic-day i.h-25{height:25%}.traffic-day i.h-30{height:30%}.traffic-day i.h-35{height:35%}.traffic-day i.h-40{height:40%}.traffic-day i.h-45{height:45%}.traffic-day i.h-50{height:50%}.traffic-day i.h-55{height:55%}.traffic-day i.h-60{height:60%}.traffic-day i.h-65{height:65%}.traffic-day i.h-70{height:70%}.traffic-day i.h-75{height:75%}.traffic-day i.h-80{height:80%}.traffic-day i.h-85{height:85%}.traffic-day i.h-90{height:90%}.traffic-day i.h-95{height:95%}.traffic-day i.h-100{height:100%}
@media (max-width:1000px){.traffic-layout{grid-template-columns:1fr}.traffic-breakdowns{grid-template-columns:1fr 1fr}}
@media (max-width:590px){.traffic-toolbar{align-items:stretch;flex-direction:column}.traffic-period{width:100%}.traffic-breakdowns{grid-template-columns:1fr}.traffic-chart{height:205px}.traffic-day small{display:none}}
/* Clear scheduling guidance and compact campaign actions */
.schedule-earliest-note { display:block; margin-top:7px; color:var(--brand); font-size:9px; font-weight:680; line-height:1.45; }
.campaign-row-actions { display:flex; align-items:center; justify-content:flex-end; }
.campaign-row-actions > .action-group { flex-wrap:nowrap; gap:2px; }
.campaign-row-actions .table-action { white-space:nowrap; padding:6px 8px; border-radius:7px; }
.campaign-row-actions .table-action:hover { background:#f1f5f3; }
.campaign-row-actions .table-action.danger { color:var(--danger); }
.campaign-actions-menu { display:none; position:relative; }
.campaign-actions-menu summary { width:34px; height:34px; display:grid; place-items:center; border:1px solid var(--line); border-radius:8px; background:white; color:var(--brand); cursor:pointer; list-style:none; }
.campaign-actions-menu summary::-webkit-details-marker { display:none; }
.campaign-actions-menu summary svg { width:19px; height:19px; fill:currentColor; }
.campaign-actions-menu[open] summary { background:var(--brand-soft); border-color:#cfe2da; }
.campaign-actions-menu > div { position:absolute; z-index:20; inset-inline-end:0; top:39px; width:174px; padding:6px; border:1px solid var(--line); border-radius:10px; background:white; box-shadow:0 8px 24px rgba(22,47,39,.04); }
.campaign-actions-menu .table-action { display:block; width:100%; padding:10px; text-align:start; }
@media (max-width:850px) {
  #view-campaigns table { min-width:0; table-layout:fixed; }
  #view-campaigns th:nth-child(4),#view-campaigns td:nth-child(4),#view-campaigns th:nth-child(5),#view-campaigns td:nth-child(5) { display:none; }
  #view-campaigns th,#view-campaigns td { padding-inline:7px; }
  #view-campaigns th:nth-child(1) { width:34%; }
  #view-campaigns th:nth-child(2) { width:25%; }
  #view-campaigns th:nth-child(3) { width:25%; }
  #view-campaigns th:nth-child(6) { width:50px; }
  .campaign-row-actions > .action-group { display:none; }
  .campaign-actions-menu { display:block; }
}
/* Verified public directory */
.directory-search-panel{display:grid;gap:22px}.directory-filter-grid{display:grid;grid-template-columns:.55fr 1fr 1fr auto;gap:12px;align-items:end}.directory-filter-grid .field{margin:0}.directory-ai-row,.directory-credit-banner{display:flex;align-items:center;justify-content:space-between;gap:18px}.directory-ai-row{padding-top:18px;border-top:1px solid var(--line)}.directory-ai-row p,.directory-credit-banner p{margin:4px 0 0}.directory-quota{padding:8px 12px;border-radius:999px;background:#edf6f1;color:var(--green);font-size:.78rem;font-weight:800}.directory-results{display:grid;gap:8px}.directory-result{display:grid;grid-template-columns:auto 1.15fr 1fr auto;align-items:center;gap:16px;padding:14px 16px;border:1px solid var(--line);border-radius:14px;background:#fff;cursor:pointer}.directory-result:has(input:checked){border-color:#78aa97;background:#f2f8f5}.directory-result input{width:18px;height:18px;accent-color:var(--green)}.directory-result span,.directory-job span,.directory-admin-row span{display:grid;gap:3px;min-width:0}.directory-result small,.directory-job small,.directory-admin-row small{color:var(--muted);overflow:hidden;text-overflow:ellipsis}.directory-result a{color:var(--green);font-weight:800;text-decoration:none}.directory-jobs,.directory-admin-list{display:grid;gap:8px}.directory-job,.directory-admin-row{display:grid;grid-template-columns:1fr auto auto;align-items:center;gap:14px;padding:13px 4px;border-bottom:1px solid var(--line)}.directory-job:last-child,.directory-admin-row:last-child{border-bottom:0}.directory-credit-banner{margin-bottom:16px;padding:16px 18px;border-radius:18px;background:var(--green);color:#fff}.directory-credit-banner .icon-button{color:#fff}.directory-admin-grid{display:grid;grid-template-columns:1.2fr .8fr;gap:18px;margin-bottom:18px}.directory-settings{display:grid;gap:15px}.directory-settings>label{display:flex;align-items:center;gap:10px;font-weight:750}.directory-settings input[type=checkbox]{width:19px;height:19px;accent-color:var(--green)}.directory-setting-numbers{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.table-action.danger{color:#a53b2a}.directory-teaser{max-width:720px;margin-inline:auto;text-align:center;padding:48px 28px}.directory-teaser .button{margin-top:12px}
@media(max-width:900px){.directory-filter-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.directory-admin-grid{grid-template-columns:1fr}.directory-result{grid-template-columns:auto 1fr}.directory-result>a{grid-column:2}.directory-ai-row,.directory-credit-banner{align-items:flex-start;flex-wrap:wrap}}
@media(max-width:560px){.directory-filter-grid,.directory-setting-numbers{grid-template-columns:1fr}.directory-filter-grid .button{width:100%}.directory-result{padding:13px 12px}.directory-job,.directory-admin-row{grid-template-columns:1fr auto}.directory-job>b,.directory-admin-row>b{grid-column:2}.directory-credit-banner{margin:0 0 12px;border-radius:14px}.directory-credit-banner .button{width:100%;order:3}.directory-search-panel{gap:16px}}.landing-directory-feature{display:grid;grid-template-columns:1.15fr .85fr;gap:38px;align-items:center;margin-block:30px 80px;padding:38px;border:1px solid var(--line);border-radius:26px;background:#f2f7f4}.landing-directory-feature h2{margin:8px 0 12px;font-size:clamp(2rem,4vw,3.5rem)}.landing-directory-feature p{margin:0;color:var(--muted);font-size:1.08rem}.landing-directory-proof{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}.landing-directory-proof span{display:grid;gap:18px;min-height:120px;padding:16px;border-radius:16px;background:#fff;color:var(--green);font-weight:900}.landing-directory-proof strong{align-self:end;color:var(--ink)}@media(max-width:750px){.landing-directory-feature{grid-template-columns:1fr;margin-block:16px 52px;padding:24px}.landing-directory-proof span{min-height:90px}}