/* AffiliConnex Phase 27.1 — merchant + affiliate visual rebuild.
   Logged-in product UI is intentionally isolated from the public marketing CSS. */

:root {
  --app-bg: #f7f8fc;
  --app-surface: #ffffff;
  --app-surface-soft: #fafbfe;
  --app-text: #182033;
  --app-text-strong: #101728;
  --app-muted: #6f7b91;
  --app-faint: #98a2b5;
  --app-line: #e7eaf0;
  --app-line-strong: #d8dde7;
  --app-primary: #4f46e5;
  --app-primary-hover: #4338ca;
  --app-primary-soft: #eef2ff;
  --app-primary-faint: #f7f7ff;
  --app-accent: #0f9f8f;
  --app-accent-soft: #e9fbf7;
  --app-success: #12835d;
  --app-success-soft: #ecf9f3;
  --app-warning: #9a6507;
  --app-warning-soft: #fff8e7;
  --app-danger: #b23a48;
  --app-danger-soft: #fff1f2;
  --app-info: #2563a8;
  --app-info-soft: #eff7ff;
  --app-radius-xs: 7px;
  --app-radius-sm: 9px;
  --app-radius: 13px;
  --app-radius-lg: 17px;
  --app-radius-xl: 22px;
  --app-shadow-xs: 0 1px 2px rgba(16, 24, 40, .03);
  --app-shadow-sm: 0 8px 24px rgba(31, 40, 67, .055);
  --app-shadow-lg: 0 24px 65px rgba(31, 40, 67, .10);
  --app-sidebar-width: 258px;
  --app-topbar-height: 70px;
  --affiliate: #0f9f8f;
  --affiliate-soft: #e9fbf7;
}

* { box-sizing: border-box; }
html { min-width: 320px; background: var(--app-bg); }
body.app-body {
  margin: 0;
  min-width: 320px;
  min-height: 100vh;
  color: var(--app-text);
  background: var(--app-bg);
  font-family: Inter, ui-sans-serif, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
  font-size: 14px;
  line-height: 1.52;
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}
.app-body a { color: var(--app-primary); text-decoration: none; }
.app-body a:hover { color: var(--app-primary-hover); }
.app-body img { max-width: 100%; }
.app-body svg { display: block; }
.app-body .ui-icon { width: 18px; height: 18px; }
.app-body code {
  display: inline-block;
  max-width: 100%;
  padding: 2px 6px;
  overflow-wrap: anywhere;
  border: 1px solid #e5e8ef;
  border-radius: 6px;
  color: #35445f;
  background: #f7f8fb;
  font-family: "SFMono-Regular", Consolas, "Liberation Mono", monospace;
  font-size: .9em;
}
.app-body ::selection { background: #dfe3ff; color: #141b2d; }

/* ===== Application frame ===== */
.app-frame {
  min-height: 100vh;
  display: grid;
  grid-template-columns: var(--app-sidebar-width) minmax(0, 1fr);
}

.sidebar {
  position: fixed;
  inset: 0 auto 0 0;
  z-index: 90;
  width: var(--app-sidebar-width);
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  overflow: hidden;
  background: #fff;
  border-right: 1px solid var(--app-line);
}
.sidebar-main {
  min-height: 0;
  display: flex;
  flex-direction: column;
  flex: 1;
  overflow: hidden;
}
.sidebar-brand {
  flex: 0 0 78px;
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 0 21px;
  border-bottom: 1px solid #f0f1f5;
  color: var(--app-text-strong);
}
.sidebar-brand:hover { color: var(--app-text-strong); }
.sidebar-brand img:first-child { width: 34px; height: 34px; flex: 0 0 auto; }
.sidebar-brand img:last-child { width: 148px; height: auto; }

.workspace-card {
  min-width: 0;
  display: grid;
  grid-template-columns: 34px minmax(0,1fr) 16px;
  align-items: center;
  gap: 10px;
  margin: 14px 14px 8px;
  padding: 10px 11px;
  border: 1px solid var(--app-line);
  border-radius: 11px;
  background: linear-gradient(180deg, #fff 0%, #fbfbfd 100%);
  box-shadow: var(--app-shadow-xs);
}
.workspace-card > .ui-icon { color: #a1a9b8; width: 15px; height: 15px; }
.workspace-avatar,
.account-avatar,
.topbar-avatar {
  display: grid;
  place-items: center;
  flex: 0 0 auto;
  border-radius: 9px;
  color: #fff;
  background: linear-gradient(135deg, #5550e8, #7168f4);
  font-size: 10px;
  font-weight: 800;
  letter-spacing: .02em;
}
.workspace-avatar { width: 34px; height: 34px; }
.workspace-copy,
.account-copy { min-width: 0; }
.workspace-copy strong,
.workspace-copy small,
.account-copy strong,
.account-copy small { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.workspace-copy strong { color: #20283a; font-size: 12.5px; line-height: 1.25; }
.workspace-copy small { margin-top: 2px; color: var(--app-faint); font-size: 10.5px; }

.sidebar-nav {
  min-height: 0;
  overflow-y: auto;
  padding: 7px 12px 20px;
  scrollbar-width: thin;
}
.sidebar-nav .nav-label {
  margin: 14px 10px 7px;
  color: #a1a9b7;
  font-size: 9.5px;
  line-height: 1.2;
  font-weight: 800;
  letter-spacing: .105em;
  text-transform: uppercase;
}
.sidebar-nav .nav-label.nav-spacer { margin-top: 22px; }
.sidebar-nav > a {
  display: flex;
  align-items: center;
  gap: 10px;
  min-height: 40px;
  margin: 2px 0;
  padding: 8px 10px;
  border: 1px solid transparent;
  border-radius: 9px;
  color: #5a6477;
  font-size: 12.5px;
  font-weight: 650;
  transition: background .14s ease, color .14s ease, border-color .14s ease;
}
.nav-icon-wrap {
  width: 28px;
  height: 28px;
  display: grid;
  place-items: center;
  flex: 0 0 28px;
  border-radius: 8px;
  color: #8791a3;
  background: transparent;
}
.nav-icon-wrap .ui-icon { width: 16px; height: 16px; }
.sidebar-nav > a:hover {
  color: #252e40;
  background: #f7f8fb;
}
.sidebar-nav > a:hover .nav-icon-wrap { color: #576176; background: #eff1f6; }
.sidebar-nav > a.active {
  color: #3f3aaf;
  background: var(--app-primary-soft);
  border-color: #e0e4ff;
  font-weight: 750;
}
.sidebar-nav > a.active .nav-icon-wrap {
  color: var(--app-primary);
  background: #fff;
  box-shadow: 0 1px 3px rgba(79,70,229,.12);
}
.sidebar-nav > a.disabled { opacity: .42; pointer-events: none; }

.sidebar-account {
  display: grid;
  grid-template-columns: 34px minmax(0,1fr) 32px;
  align-items: center;
  gap: 9px;
  padding: 12px 14px;
  border-top: 1px solid var(--app-line);
  background: #fbfbfd;
}
.account-avatar { width: 34px; height: 34px; border-radius: 50%; }
.account-copy strong { color: #273044; font-size: 11.5px; line-height: 1.25; }
.account-copy small { margin-top: 2px; color: var(--app-faint); font-size: 9.5px; }
.icon-button {
  width: 32px;
  height: 32px;
  display: grid;
  place-items: center;
  border: 1px solid transparent;
  border-radius: 8px;
  color: #8b94a5 !important;
}
.icon-button:hover { color: #4a5568 !important; border-color: var(--app-line); background: #fff; }
.icon-button .ui-icon { width: 16px; height: 16px; }

.affiliate-workspace-avatar,
.affiliate-account-avatar,
.affiliate-topbar-avatar { background: linear-gradient(135deg, #0f9f8f, #26b8a8); }
.affiliate-workspace-card { background: linear-gradient(180deg, #fff 0%, #f8fffd 100%); }
.affiliate-body .sidebar-nav > a.active { color: #08776a; background: var(--affiliate-soft); border-color: #d3f3eb; }
.affiliate-body .sidebar-nav > a.active .nav-icon-wrap { color: var(--affiliate); }

.app-main {
  grid-column: 2;
  min-width: 0;
  min-height: 100vh;
  display: flex;
  flex-direction: column;
}
.topbar {
  position: sticky;
  top: 0;
  z-index: 70;
  height: var(--app-topbar-height);
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 20px;
  padding: 0 30px;
  border-bottom: 1px solid rgba(231,234,240,.95);
  background: rgba(255,255,255,.91);
  backdrop-filter: blur(18px);
}
.topbar-copy { min-width: 0; display: grid; gap: 1px; }
.topbar-copy span {
  color: #9aa2b1;
  font-size: 9.5px;
  font-weight: 800;
  letter-spacing: .08em;
  text-transform: uppercase;
}
.topbar-copy strong {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  color: #21293a;
  font-size: 14px;
  line-height: 1.25;
  font-weight: 720;
}
.topbar-actions { display: flex; align-items: center; gap: 10px; }
.topbar-link {
  min-height: 34px;
  display: inline-flex;
  align-items: center;
  gap: 7px;
  padding: 6px 10px;
  border: 1px solid var(--app-line);
  border-radius: 8px;
  color: #5e687b !important;
  background: #fff;
  font-size: 11.5px;
  font-weight: 700;
}
.topbar-link:hover { border-color: #cfd4df; background: #fafbfc; color: #30384a !important; }
.topbar-link .ui-icon { width: 14px; height: 14px; }
.topbar-avatar { width: 34px; height: 34px; border-radius: 50%; }
.affiliate-pill {
  display: inline-flex;
  align-items: center;
  min-height: 31px;
  padding: 5px 10px;
  border: 1px solid #d9eee8;
  border-radius: 999px;
  color: #16786d;
  background: #f3fcfa;
  font-size: 10.5px;
  font-weight: 750;
}
.sidebar-toggle {
  display: none;
  width: 36px;
  height: 36px;
  padding: 0;
  border: 1px solid var(--app-line);
  border-radius: 8px;
  background: #fff;
  color: #596477;
  cursor: pointer;
}
.sidebar-toggle .ui-icon { margin: auto; width: 18px; height: 18px; }
.sidebar-backdrop { display: none; }

.content {
  width: 100%;
  max-width: 1500px;
  margin: 0 auto;
  padding: 34px 34px 20px;
  flex: 1;
}
.content-footer {
  display: flex;
  align-items: center;
  gap: 9px;
  margin-top: 30px;
  padding: 20px 2px 8px;
  color: #a0a7b4;
  font-size: 9.5px;
}
.content-footer span + span::before { content: "·"; margin-right: 9px; color: #c0c5ce; }

/* ===== Page headings ===== */
.page-head {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 24px;
  margin: 0 0 22px;
}
.page-head > div:first-child { min-width: 0; }
.page-head h1 {
  margin: 3px 0 3px;
  color: var(--app-text-strong);
  font-size: clamp(25px, 2.4vw, 34px);
  line-height: 1.12;
  letter-spacing: -.037em;
  font-weight: 780;
}
.eyebrow {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  color: var(--app-primary);
  font-size: 9.5px;
  line-height: 1.2;
  font-weight: 820;
  letter-spacing: .105em;
  text-transform: uppercase;
}
.eyebrow::before {
  content: "";
  width: 5px;
  height: 5px;
  border-radius: 50%;
  background: var(--app-primary);
}
.affiliate-body .eyebrow { color: var(--affiliate); }
.affiliate-body .eyebrow::before { background: var(--affiliate); }
.muted { color: var(--app-muted) !important; }
p.muted { margin: 4px 0 0; }
.small-note { color: var(--app-muted); font-size: 11.5px; line-height: 1.55; }
.section-gap { margin-top: 20px; }

/* ===== Dashboard visual system ===== */
.dashboard-hero {
  position: relative;
  overflow: hidden;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 26px;
  margin-bottom: 18px;
  padding: 24px 26px;
  border: 1px solid #e1e3f2;
  border-radius: var(--app-radius-xl);
  background:
    radial-gradient(circle at 88% 18%, rgba(99,102,241,.14), transparent 31%),
    radial-gradient(circle at 65% 100%, rgba(15,159,143,.08), transparent 32%),
    linear-gradient(135deg, #ffffff 0%, #fafaff 62%, #f6f8ff 100%);
  box-shadow: var(--app-shadow-sm);
}
.dashboard-hero::after {
  content: "";
  position: absolute;
  right: -70px;
  top: -95px;
  width: 250px;
  height: 250px;
  border: 1px solid rgba(79,70,229,.11);
  border-radius: 50%;
  box-shadow: 0 0 0 34px rgba(79,70,229,.025), 0 0 0 68px rgba(79,70,229,.018);
  pointer-events: none;
}
.affiliate-body .dashboard-hero {
  border-color: #dfeeea;
  background:
    radial-gradient(circle at 88% 18%, rgba(15,159,143,.14), transparent 31%),
    radial-gradient(circle at 65% 100%, rgba(79,70,229,.055), transparent 32%),
    linear-gradient(135deg, #ffffff 0%, #fbfffe 62%, #f4fcfa 100%);
}
.affiliate-body .dashboard-hero::after { border-color: rgba(15,159,143,.12); box-shadow: 0 0 0 34px rgba(15,159,143,.025), 0 0 0 68px rgba(15,159,143,.018); }
.dashboard-hero-copy { position: relative; z-index: 1; min-width: 0; }
.dashboard-hero-copy .eyebrow { margin-bottom: 7px; }
.dashboard-hero h1 {
  margin: 0;
  color: #121a2c;
  font-size: clamp(27px, 2.9vw, 39px);
  line-height: 1.06;
  letter-spacing: -.045em;
  font-weight: 790;
}
.dashboard-hero p { max-width: 680px; margin: 7px 0 0; color: #6f7a8e; font-size: 13px; }
.dashboard-hero-meta { display: flex; gap: 7px; align-items: center; flex-wrap: wrap; margin-top: 13px; }
.dashboard-hero-actions { position: relative; z-index: 1; display: flex; gap: 8px; flex-wrap: wrap; justify-content: flex-end; }
.hero-pill {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  min-height: 27px;
  padding: 4px 9px;
  border: 1px solid #e2e5ed;
  border-radius: 999px;
  color: #687387;
  background: rgba(255,255,255,.75);
  font-size: 10px;
  font-weight: 720;
}
.hero-pill strong { color: #323b4d; font-weight: 780; }
.hero-pill.success { color: #147454; border-color: #d5ecdf; background: #f5fcf8; }

.stats,
.metric-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0,1fr));
  gap: 13px;
  margin: 0 0 18px;
}
.stat,
.metric {
  position: relative;
  min-width: 0;
  min-height: 104px;
  display: grid;
  align-content: space-between;
  padding: 16px 17px;
  overflow: hidden;
  border: 1px solid var(--app-line);
  border-radius: var(--app-radius);
  background: #fff;
  box-shadow: var(--app-shadow-xs);
}
.stat::after,
.metric::after {
  content: "";
  position: absolute;
  width: 64px;
  height: 64px;
  right: -25px;
  bottom: -28px;
  border-radius: 50%;
  background: rgba(79,70,229,.045);
}
.stat-top,
.metric-top { display: flex; align-items: center; justify-content: space-between; gap: 10px; }
.stat-icon,
.metric-icon {
  width: 32px;
  height: 32px;
  display: grid;
  place-items: center;
  border-radius: 9px;
  color: var(--app-primary);
  background: var(--app-primary-soft);
}
.stat-icon .ui-icon,
.metric-icon .ui-icon { width: 16px; height: 16px; }
.stat span,
.metric span,
.metric small {
  display: block;
  color: var(--app-muted);
  font-size: 10.5px;
  font-weight: 680;
}
.stat > span { align-self: start; }
.stat strong,
.metric strong {
  position: relative;
  z-index: 1;
  display: block;
  margin-top: 8px;
  color: #171f32;
  font-size: clamp(23px, 2vw, 30px);
  line-height: 1.05;
  letter-spacing: -.04em;
  font-weight: 770;
}
.stat-label { display: flex !important; align-items: center; gap: 7px; }
.stat-label .ui-icon { width: 14px; height: 14px; color: #9ba4b5; }
.stat.tone-teal::after { background: rgba(15,159,143,.05); }
.stat.tone-teal .stat-icon { color: var(--app-accent); background: var(--app-accent-soft); }
.stat.tone-green::after { background: rgba(18,131,93,.05); }
.stat.tone-green .stat-icon { color: var(--app-success); background: var(--app-success-soft); }
.stat.tone-amber::after { background: rgba(154,101,7,.05); }
.stat.tone-amber .stat-icon { color: var(--app-warning); background: var(--app-warning-soft); }
.affiliate-body .stat-icon { color: var(--affiliate); background: var(--affiliate-soft); }
.compact-stats .stat { min-height: 92px; }

/* ===== Panels, grids, quick actions ===== */
.panel,
.auth-card {
  min-width: 0;
  border: 1px solid var(--app-line);
  border-radius: var(--app-radius-lg);
  background: var(--app-surface);
  box-shadow: var(--app-shadow-xs);
}
.panel { padding: 20px; }
.panel:hover { border-color: #dfe3eb; }
.panel h2 { margin: 0 0 12px; color: #1a2235; font-size: 16px; line-height: 1.25; letter-spacing: -.018em; font-weight: 760; }
.panel h3 { margin: 0 0 8px; color: #253047; font-size: 13px; }
.panel-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 18px; margin-bottom: 14px; }
.panel-head h2 { margin: 0 0 2px; }
.panel-head p { margin: 0; }
.two-col,
.dashboard-grid,
.program-layout,
.detail-layout,
.affiliate-link-layout,
.tracking-columns,
.tracking-test-grid,
.small-grid {
  display: grid;
  grid-template-columns: repeat(2,minmax(0,1fr));
  gap: 16px;
}
.dashboard-grid { grid-template-columns: minmax(0,1.18fr) minmax(320px,.82fr); align-items: start; }
.affiliate-layout { grid-template-columns: minmax(300px,.62fr) minmax(560px,1.7fr); align-items: start; }
.program-layout { grid-template-columns: minmax(340px,.75fr) minmax(560px,1.35fr); align-items: start; }
.detail-layout { grid-template-columns: minmax(320px,.72fr) minmax(0,1.4fr); align-items: start; }
.affiliate-link-layout { grid-template-columns: minmax(320px,.78fr) minmax(0,1.22fr); align-items: start; }

.dashboard-card { box-shadow: var(--app-shadow-sm); }
.launch-summary-panel { border-top: 0; }
.panel-kicker { margin-bottom: 6px; color: #9aa3b2; font-size: 9.5px; font-weight: 820; letter-spacing: .08em; text-transform: uppercase; }
.progress-shell { margin-top: 14px; }
.progress-labels { display: flex; justify-content: space-between; gap: 10px; margin-bottom: 7px; color: #7d8799; font-size: 10.5px; }
.progress-track { height: 8px; overflow: hidden; border-radius: 999px; background: #eef0f5; }
.progress-bar { height: 100%; min-width: 3%; border-radius: inherit; background: linear-gradient(90deg, #4f46e5, #6d64f0); }
.affiliate-body .progress-bar { background: linear-gradient(90deg, #0f9f8f, #24b6a5); }
.launch-meter { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 8px; margin-top: 15px; }
.launch-meter div { padding: 10px 11px; border: 1px solid #edf0f5; border-radius: 9px; background: #fafbfc; }
.launch-meter strong,.launch-meter span { display: block; }
.launch-meter strong { color: #222a3b; font-size: 18px; line-height: 1.1; }
.launch-meter span { margin-top: 2px; color: #8a93a3; font-size: 9.5px; }

.quick-actions { display: grid; gap: 8px; }
.quick-action {
  display: grid;
  grid-template-columns: 34px minmax(0,1fr) 18px;
  align-items: center;
  gap: 10px;
  padding: 10px 11px;
  border: 1px solid #ebedf2;
  border-radius: 10px;
  color: #394357 !important;
  background: #fbfbfd;
  transition: border-color .13s ease, background .13s ease, transform .13s ease;
}
.quick-action:hover { border-color: #d9ddea; background: #fff; transform: translateY(-1px); color: #252e42 !important; }
.quick-action-icon { width: 34px; height: 34px; display: grid; place-items: center; border-radius: 9px; color: var(--app-primary); background: var(--app-primary-soft); }
.quick-action-icon .ui-icon { width: 16px; height: 16px; }
.quick-action-copy strong,.quick-action-copy small { display: block; }
.quick-action-copy strong { font-size: 11.5px; }
.quick-action-copy small { margin-top: 2px; color: #9098a7; font-size: 9.5px; }
.quick-action > .ui-icon { width: 14px; height: 14px; color: #a9b0bd; }
.affiliate-body .quick-action-icon { color: var(--affiliate); background: var(--affiliate-soft); }

/* ===== Buttons ===== */
button,
.button,
.mini-button {
  appearance: none;
  min-height: 38px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 7px;
  padding: 8px 13px;
  border: 1px solid var(--app-primary);
  border-radius: 8px;
  color: #fff !important;
  background: var(--app-primary);
  box-shadow: 0 1px 2px rgba(79,70,229,.12);
  font: inherit;
  font-size: 11.5px;
  line-height: 1.15;
  font-weight: 740;
  cursor: pointer;
  transition: background .12s ease, border-color .12s ease, transform .12s ease, box-shadow .12s ease;
}
button:hover,.button:hover,.mini-button:hover { border-color: var(--app-primary-hover); background: var(--app-primary-hover); color: #fff !important; transform: translateY(-1px); box-shadow: 0 4px 12px rgba(79,70,229,.14); }
button:disabled,.button.disabled { opacity: .48; cursor: not-allowed; transform: none; box-shadow: none; }
.button.secondary,.mini-button.secondary,button.secondary {
  border-color: var(--app-line-strong);
  color: #4b566b !important;
  background: #fff;
  box-shadow: var(--app-shadow-xs);
}
.button.secondary:hover,.mini-button.secondary:hover,button.secondary:hover { border-color: #c7ccd7; color: #30394b !important; background: #fafbfc; }
.button.mini,.mini-button { min-height: 30px; padding: 5px 9px; border-radius: 7px; font-size: 10.5px; }
.button-row { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.inline-form { display: inline-flex; align-items: center; gap: 7px; margin: 0; }
.affiliate-body button:not(.secondary),
.affiliate-body .button:not(.secondary),
.affiliate-body .mini-button:not(.secondary) { border-color: var(--affiliate); background: var(--affiliate); box-shadow: 0 1px 2px rgba(15,159,143,.12); }
.affiliate-body button:not(.secondary):hover,
.affiliate-body .button:not(.secondary):hover,
.affiliate-body .mini-button:not(.secondary):hover { border-color: #0b8779; background: #0b8779; }
button:focus-visible,.button:focus-visible,.mini-button:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible,summary:focus-visible,a:focus-visible { outline: 3px solid rgba(79,70,229,.17); outline-offset: 2px; }
button.sidebar-toggle { min-height: 36px; padding: 0; border-color: var(--app-line) !important; color: #596477 !important; background: #fff !important; box-shadow: none !important; transform: none !important; }
button.sidebar-toggle:hover { border-color: #cfd4df !important; color: #343e51 !important; background: #fafbfc !important; }

/* ===== Forms ===== */
form.stack { display: grid; gap: 13px; }
.form-grid,.filter-bar { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 12px; }
.filter-bar { grid-template-columns: minmax(230px,1.6fr) repeat(3,minmax(145px,.8fr)) auto auto; align-items: end; }
label,.field-label { display: grid; gap: 5px; color: #4b566a; font-size: 10.5px; font-weight: 720; }
label small { color: var(--app-muted); font-weight: 500; line-height: 1.4; }
input,select,textarea {
  width: 100%;
  min-width: 0;
  border: 1px solid var(--app-line-strong);
  border-radius: 8px;
  color: #202a3d;
  background: #fff;
  padding: 9px 10px;
  font: inherit;
  font-size: 12px;
  line-height: 1.35;
  box-shadow: inset 0 1px 1px rgba(16,24,40,.018);
  transition: border-color .12s ease, box-shadow .12s ease;
}
input,select { min-height: 39px; }
textarea { min-height: 92px; resize: vertical; }
input:hover,select:hover,textarea:hover { border-color: #cbd1dd; }
input:focus,select:focus,textarea:focus { border-color: #9ea5f6; box-shadow: 0 0 0 3px rgba(79,70,229,.07); outline: none; }
input[readonly],textarea[readonly] { color: #566175; background: #f7f8fa; }
input::placeholder,textarea::placeholder { color: #a9b0bd; }
.copy-input,.code-area { font-family: "SFMono-Regular", Consolas, monospace; font-size: 11px; }
.checkline { display: flex; align-items: center; gap: 8px; min-height: 34px; font-weight: 620; }
.checkline input { width: 15px; min-height: 15px; height: 15px; flex: 0 0 15px; }
.checkgrid { display: grid; gap: 8px; }

/* ===== Tables ===== */
.wide-table { overflow-x: auto; }
.wide-table.panel { padding: 0; overflow-x: auto; overflow-y: hidden; }
.wide-table.panel > .panel-head { padding: 18px 20px 0; }
.wide-table.panel table { border-top: 1px solid #eef0f4; }
table { width: 100%; min-width: 650px; border-collapse: collapse; border-spacing: 0; }
th,td { padding: 11px 14px; border-bottom: 1px solid #eef0f4; text-align: left; vertical-align: middle; }
thead th {
  color: #8a93a4;
  background: #fafbfc;
  font-size: 9px;
  line-height: 1.25;
  font-weight: 820;
  letter-spacing: .07em;
  text-transform: uppercase;
  white-space: nowrap;
}
tbody tr:last-child td { border-bottom: 0; }
tbody tr { transition: background .11s ease; }
tbody tr:hover td { background: #fcfcfe; }
td { color: #485469; font-size: 11.5px; }
td strong { color: #252e42; font-weight: 710; }
td small { color: #8a93a4; font-size: 9.5px; line-height: 1.45; }
.actions-cell { white-space: nowrap; }
.pagination-row { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 14px 16px; border-top: 1px solid #eef0f4; background: #fafbfc; }

/* ===== Badges, alerts ===== */
.badge {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  min-height: 21px;
  padding: 3px 7px;
  border: 1px solid #e2e5eb;
  border-radius: 999px;
  color: #697487;
  background: #f5f6f8;
  font-size: 8.5px;
  line-height: 1;
  font-weight: 820;
  letter-spacing: .04em;
  text-transform: uppercase;
  white-space: nowrap;
}
.status-active,.status-approved,.status-paid,.status-complete,.status-completed { color: var(--app-success); background: var(--app-success-soft); border-color: #d2ecdf; }
.status-draft,.status-pending,.status-open { color: var(--app-warning); background: var(--app-warning-soft); border-color: #eee1b8; }
.status-paused,.status-suspended,.status-declined,.status-error,.status-failed,.status-cancelled { color: var(--app-danger); background: var(--app-danger-soft); border-color: #f0d0d5; }
.tracking-test { color: #4a46b8; background: var(--app-primary-soft); border-color: #dfe2ff; }
.muted-badge { color: #7b8494; background: #f4f5f7; }
.tracking-off { color: #737d8e; background: #f3f4f6; border-color: #e4e6ea; }
.tracking-live { color: var(--app-success); background: var(--app-success-soft); border-color: #d2ecdf; }

.alert {
  margin: 0 0 15px;
  padding: 10px 12px;
  border: 1px solid var(--app-line);
  border-left-width: 3px;
  border-radius: 9px;
  font-size: 11.5px;
  line-height: 1.5;
}
.alert.success { color: #27664e; background: var(--app-success-soft); border-color: #d3ecdf; border-left-color: var(--app-success); }
.alert.error { color: #8e3b47; background: var(--app-danger-soft); border-color: #efd1d6; border-left-color: var(--app-danger); }
.alert.info { color: #355f86; background: var(--app-info-soft); border-color: #d6e8f8; border-left-color: #4f87bf; }
.compact-alert { margin-top: 13px; margin-bottom: 0; }

/* ===== Details, setup, checklist ===== */
.details { margin: 0; display: grid; }
.details > div { display: grid; grid-template-columns: minmax(115px,.65fr) minmax(0,1.35fr); gap: 12px; padding: 9px 0; border-bottom: 1px solid #eef0f4; }
.details > div:last-child { border-bottom: 0; }
.details > dt,.details > dd { padding: 8px 0; border-bottom: 1px solid #eef0f4; }
.details > dt,.details dt { color: var(--app-muted); font-size: 10px; font-weight: 690; }
.details > dd,.details dd { margin: 0; color: #344055; overflow-wrap: anywhere; }
.details-wide > div { grid-template-columns: minmax(145px,.5fr) minmax(0,1.5fr); }
.compact-details > div { padding: 7px 0; }

.setup-list { display: grid; gap: 1px; }
.setup-row { display: grid; grid-template-columns: 32px minmax(0,1fr); gap: 11px; align-items: start; padding: 10px 0; border-bottom: 1px solid #eef0f4; }
.setup-row:last-child { border-bottom: 0; }
.setup-row strong,.setup-row small { display: block; }
.setup-row strong { color: #30394d; font-size: 11px; }
.setup-row small { margin-top: 2px; color: #8c95a5; font-size: 9.5px; }
.setup-icon { width: 28px; height: 28px; display: grid; place-items: center; border-radius: 8px; color: #778296; background: #f0f2f5; font-size: 10px; font-weight: 820; }
.setup-icon.done { color: #147454; background: #eaf8f1; }
.checklist-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 10px; }
.checklist-item { padding: 13px; border: 1px solid #e7e9ef; border-radius: 10px; background: #fbfbfd; }
.checklist-item strong { display: block; margin: 7px 0 2px; color: #313a4e; }
.checklist-item p { margin: 0; color: var(--app-muted); font-size: 10.5px; }
.checklist-pass { border-color: #d6ebdf; background: #f8fcfa; }
.checklist-blocked { border-color: #edd4d8; background: #fffafb; }
.checklist-needs_work,.checklist-final_step { border-color: #ebdfbf; background: #fffdf8; }
.checklist-badge-pass { color: var(--app-success); background: var(--app-success-soft); border-color: #d2ecdf; }
.checklist-badge-needs_work,.checklist-badge-final_step { color: var(--app-warning); background: var(--app-warning-soft); border-color: #eee1b8; }
.checklist-badge-blocked { color: var(--app-danger); background: var(--app-danger-soft); border-color: #f0d0d5; }
.launch-steps { margin: 0; padding-left: 20px; color: #546075; }
.launch-steps li { padding: 4px 0 4px 4px; }

/* ===== Tracking, affiliate applications, links ===== */
.tracking-list { display: grid; gap: 14px; }
.tracking-card { padding: 15px; border: 1px solid #e5e8ef; border-radius: 11px; background: #fbfcfe; }
.tracking-card-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 14px; margin-bottom: 12px; }
.tracking-card-head strong,.tracking-card-head small { display: block; }
.tracking-card-head strong { color: #30394e; }
.tracking-card-head small { margin-top: 2px; color: var(--app-muted); font-size: 9.5px; }
.tracking-actions { display: flex; align-items: center; gap: 7px; flex-wrap: wrap; }
.tracking-columns { align-items: start; }
.tracking-test-grid { margin-top: 12px; }
.internal-test-form { padding: 13px; border: 1px solid #e5e8ef; border-radius: 9px; background: #fff; }
.tracking-card-wide { width: 100%; }
.application-share-panel { background: linear-gradient(180deg,#fff 0%,#fcfdff 100%); }
.link-list { display: grid; gap: 9px; }
.link-card { padding: 12px; border: 1px solid #e7e9ef; border-radius: 10px; background: #fbfcfe; }
.link-card strong,.link-card small { display: block; }
.link-card strong { color: #30394e; }
.link-card small { margin: 2px 0 9px; color: var(--app-muted); font-size: 9.5px; }
.link-card input { font-family: "SFMono-Regular",Consolas,monospace; font-size: 10.5px; }
.application-actions { display: flex; align-items: flex-start; gap: 7px; }
.decline-box { position: relative; }
.decline-box summary { list-style: none; cursor: pointer; min-height: 30px; display: inline-flex; align-items: center; padding: 5px 9px; border: 1px solid var(--app-line-strong); border-radius: 7px; background: #fff; color: #616b7d; font-size: 10.5px; font-weight: 700; }
.decline-box summary::-webkit-details-marker { display: none; }
.decline-box form { min-width: 250px; margin-top: 7px; padding: 10px; border: 1px solid #e2e5ec; border-radius: 9px; background: #fff; box-shadow: var(--app-shadow-sm); }
.compact-stack { gap: 8px !important; }
.compact-list,.plain-list,.check-list { margin: 0; padding-left: 19px; color: #546075; }
.check-list li { margin: 6px 0; }
.form-panel { max-width: 760px; }
.code-stat { font-family: "SFMono-Regular",Consolas,monospace; font-size: 18px !important; }
hr { border: 0; border-top: 1px solid var(--app-line); margin: 18px 0; }

/* ===== Authentication ===== */
.app-body-auth {
  background:
    radial-gradient(circle at 18% 20%, rgba(79,70,229,.09), transparent 28%),
    radial-gradient(circle at 84% 76%, rgba(15,159,143,.07), transparent 26%),
    #f8f9fc;
}
.auth-stage { min-height: 100vh; display: grid; grid-template-rows: 72px 1fr; }
.auth-topbar { display: flex; align-items: center; justify-content: space-between; padding: 0 28px; }
.brand-auth { display: flex; align-items: center; gap: 10px; color: var(--app-text-strong); }
.brand-auth img:first-child { width: 34px; height: 34px; }
.brand-auth img:last-child { width: 152px; height: auto; }
.auth-site-link { color: #6d778a !important; font-size: 11px; font-weight: 700; }
.auth-content { width: 100%; max-width: 465px; margin: 0 auto; display: flex; flex-direction: column; justify-content: center; padding: 36px 18px 55px; }
.auth-card { position: relative; overflow: hidden; width: 100%; padding: 30px; box-shadow: var(--app-shadow-lg); }
.auth-card::before { content: ""; position: absolute; inset: 0 0 auto; height: 3px; background: linear-gradient(90deg,#4f46e5,#776ef2,#0f9f8f); }
.auth-card h1 { margin: 7px 0 8px; color: #141c2e; font-size: 27px; line-height: 1.12; letter-spacing: -.038em; font-weight: 780; }
.auth-card > p { margin-top: 0; }
.auth-card form { margin-top: 19px; }
.auth-card button { width: 100%; min-height: 41px; }
.affiliate-auth-card::before { background: linear-gradient(90deg,#0f9f8f,#2bb9a9,#4f46e5); }
.auth-product-note { margin-top: 16px; text-align: center; color: #9aa2b1; font-size: 9.5px; }

/* ===== Copy interaction ===== */
.copy-button.copied { color: var(--app-success) !important; border-color: #cee8dc !important; background: #f4fbf7 !important; }

/* ===== Responsive ===== */
@media (max-width: 1180px) {
  .stats,.metric-grid { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .affiliate-layout,.program-layout,.detail-layout { grid-template-columns: 1fr; }
  .filter-bar { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .dashboard-grid { grid-template-columns: 1fr; }
}

@media (max-width: 920px) {
  .app-frame { grid-template-columns: 1fr; }
  .sidebar { transform: translateX(-103%); transition: transform .18s ease; box-shadow: 18px 0 50px rgba(19,28,47,.12); }
  .sidebar-open .sidebar { transform: translateX(0); }
  .sidebar-backdrop { position: fixed; z-index: 80; inset: 0; background: rgba(18,25,39,.32); backdrop-filter: blur(2px); }
  .sidebar-open .sidebar-backdrop { display: block; }
  .app-main { grid-column: 1; }
  .sidebar-toggle { display: inline-grid; flex: 0 0 auto; }
  .topbar { padding: 0 20px; justify-content: flex-start; }
  .topbar-copy { flex: 1; }
  .topbar-actions { margin-left: auto; }
  .topbar-link span,.affiliate-pill { display: none; }
  .content { padding: 28px 20px 18px; }
  .two-col,.affiliate-link-layout,.tracking-columns,.tracking-test-grid { grid-template-columns: 1fr; }
  .checklist-grid { grid-template-columns: 1fr; }
}

@media (max-width: 680px) {
  .auth-topbar { padding: 0 16px; }
  .brand-auth img:last-child { width: 136px; }
  .auth-site-link { font-size: 10px; }
  .content { padding: 22px 13px 16px; }
  .topbar { padding: 0 13px; }
  .page-head { align-items: flex-start; flex-direction: column; gap: 10px; }
  .page-head .button-row { width: 100%; }
  .dashboard-hero { align-items: flex-start; flex-direction: column; padding: 20px; border-radius: 17px; }
  .dashboard-hero-actions { width: 100%; justify-content: flex-start; }
  .stats,.metric-grid,.form-grid,.filter-bar,.small-grid { grid-template-columns: 1fr; }
  .panel { padding: 16px; border-radius: 13px; }
  .wide-table.panel { padding: 0; }
  .wide-table.panel > .panel-head { padding: 16px 16px 0; }
  .panel-head { flex-direction: column; align-items: stretch; }
  .panel-head .button { align-self: flex-start; }
  .auth-card { padding: 24px 20px; }
  .pagination-row { align-items: flex-start; flex-wrap: wrap; }
  .launch-meter { grid-template-columns: 1fr; }
  .application-actions { flex-direction: column; }
  .details > div,.details-wide > div { grid-template-columns: 1fr; gap: 1px; }
  .content-footer { flex-wrap: wrap; }
}

/* ===== Phase 27.2 — reporting and merchant performance ===== */
.report-page-head { align-items: flex-start; }
.report-filter-stack { display: grid; gap: 8px; justify-items: end; }
.segmented-control {
  display: inline-flex;
  align-items: center;
  gap: 3px;
  padding: 3px;
  border: 1px solid var(--app-line);
  border-radius: 10px;
  background: #f5f6f9;
}
.segmented-control a {
  min-height: 30px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 5px 11px;
  border-radius: 7px;
  color: #6f798b;
  font-size: 10.5px;
  font-weight: 750;
}
.segmented-control a:hover { color: #343e51; background: #fff; }
.segmented-control a.active { color: #313a9d; background: #fff; box-shadow: 0 1px 3px rgba(31,40,67,.08); }
.segmented-control.compact a { min-height: 27px; padding: 4px 9px; font-size: 9.5px; }
.report-context-bar {
  min-height: 38px;
  display: flex;
  align-items: center;
  gap: 12px;
  flex-wrap: wrap;
  margin: -2px 0 16px;
  padding: 8px 11px;
  border: 1px solid #e5e8ef;
  border-radius: 10px;
  background: #fafbfc;
  color: #6f798b;
  font-size: 10.5px;
}
.report-context-bar > span { display: inline-flex; align-items: center; gap: 6px; }
.report-context-bar .ui-icon { width: 14px; height: 14px; color: #667085; }
.report-context-bar strong { color: #31394c; }
.report-test-note { color: #4a46b8; background: var(--app-primary-soft); border-radius: 999px; padding: 3px 7px; font-weight: 750; }
.reporting-stats .stat small { display: block; margin-top: 2px; color: #8a93a4; font-size: 9.5px; }
.report-money-grid { display: grid; grid-template-columns: repeat(auto-fit,minmax(240px,1fr)); gap: 12px; }
.report-money-card {
  overflow: hidden;
  border: 1px solid var(--app-line);
  border-radius: 13px;
  background: #fff;
  box-shadow: var(--app-shadow-xs);
}
.report-money-card-head { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 11px 14px; border-bottom: 1px solid #eef0f4; background: #fafbfc; }
.report-money-card-head span { color: #596477; font-size: 10px; font-weight: 850; letter-spacing: .08em; }
.report-money-card-head strong { color: #8b93a2; font-size: 9.5px; font-weight: 700; }
.report-money-primary { padding: 16px 16px 12px; }
.report-money-primary small,.report-money-secondary small { display: block; color: #8a93a4; font-size: 9px; font-weight: 650; }
.report-money-primary strong { display: block; margin-top: 2px; color: #1d2639; font-size: 25px; letter-spacing: -.035em; }
.report-money-secondary { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 1px; border-top: 1px solid #eef0f4; background: #eef0f4; }
.report-money-secondary > div { padding: 11px 14px; background: #fff; }
.report-money-secondary strong { display: block; margin-top: 2px; color: #3c4659; font-size: 12px; }
.report-chart-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 14px; }
.report-chart-panel { min-width: 0; }
.report-chart-total { color: #263045; font-size: 22px; letter-spacing: -.03em; }
.report-chart-total small { display: block; margin-top: 2px; color: #939bab; font-size: 8.5px; font-weight: 650; letter-spacing: 0; text-align: right; }
.report-chart {
  position: relative;
  min-height: 230px;
  display: flex;
  align-items: stretch;
  gap: 3px;
  padding: 18px 4px 0;
  border-top: 1px solid #f0f1f4;
}
.report-chart::before,.report-chart::after { content: ""; position: absolute; left: 4px; right: 4px; border-top: 1px dashed #edf0f4; pointer-events: none; }
.report-chart::before { top: 34%; }
.report-chart::after { top: 66%; }
.report-chart-column { position: relative; z-index: 1; min-width: 5px; flex: 1 1 0; display: grid; grid-template-rows: 16px 1fr 17px; gap: 3px; align-items: end; text-align: center; }
.report-chart-value { min-height: 14px; color: #8a93a4; font-size: 8px; line-height: 1; }
.report-chart-bar-shell { height: 168px; display: flex; align-items: flex-end; justify-content: center; }
.report-chart-bar { width: min(11px,75%); min-width: 3px; display: block; border-radius: 4px 4px 2px 2px; background: linear-gradient(180deg,#6660e8,#4f46e5); opacity: .86; }
.report-chart-column:hover .report-chart-bar { opacity: 1; }
.report-chart-column small { min-width: 0; color: #9aa2b0; font-size: 7.5px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.report-chart-empty { position: absolute; z-index: 2; inset: 42% 18px auto; padding: 8px; border: 1px solid #edf0f4; border-radius: 8px; background: rgba(255,255,255,.92); color: #929aa9; font-size: 10px; text-align: center; }
.report-chart.is-empty .report-chart-bar { background: #eef0f4; }
.report-leader-grid { display: grid; grid-template-columns: minmax(0,.95fr) minmax(0,1.05fr); gap: 14px; align-items: start; }
.report-leader-panel { min-width: 0; }
.leader-list { display: grid; }
.leader-row,.seller-row {
  display: grid;
  align-items: center;
  gap: 10px;
  padding: 10px 0;
  border-bottom: 1px solid #eef0f4;
  color: inherit !important;
}
.leader-row { grid-template-columns: 26px minmax(0,1fr) auto; }
.leader-row:last-child,.seller-row:last-child { border-bottom: 0; }
.leader-row:hover,.seller-row:hover { color: inherit !important; }
.leader-rank,.seller-rank { width: 24px; height: 24px; display: grid; place-items: center; border-radius: 7px; color: #6b7587; background: #f1f2f6; font-size: 9px; font-weight: 800; }
.leader-person,.leader-person strong,.leader-person small,.seller-copy,.seller-copy strong,.seller-copy small { min-width: 0; display: block; }
.leader-person strong,.seller-copy strong { overflow: hidden; color: #30394d; font-size: 11px; line-height: 1.3; text-overflow: ellipsis; white-space: nowrap; }
.leader-person small,.seller-copy small { margin-top: 2px; color: #9098a7; font-size: 9px; }
.leader-progress { height: 3px; display: block; overflow: hidden; margin-top: 6px; border-radius: 999px; background: #eef0f4; }
.leader-progress i { height: 100%; display: block; border-radius: inherit; background: #5a52e6; }
.leader-metric { min-width: 54px; text-align: right; }
.leader-metric strong,.leader-metric small { display: block; }
.leader-metric strong { color: #293247; font-size: 15px; }
.leader-metric small { color: #989fac; font-size: 8px; }
.seller-currency-groups { display: grid; gap: 10px; }
.seller-currency-group + .seller-currency-group { padding-top: 8px; border-top: 1px solid #e9ebf0; }
.seller-currency-title { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 2px 0 5px; }
.seller-currency-title strong { color: #4b46b7; font-size: 10px; letter-spacing: .08em; }
.seller-currency-title span { color: #9aa2b0; font-size: 8.5px; }
.seller-row { grid-template-columns: 24px minmax(0,1fr) auto; padding: 8px 0; }
.seller-progress i { background: #0f9f8f; }
.seller-amount { color: #273146; font-size: 11px; font-weight: 780; white-space: nowrap; }
.empty-state.compact { min-height: 120px; display: grid; place-items: center; align-content: center; gap: 3px; padding: 18px; border: 1px dashed #e1e4ea; border-radius: 10px; background: #fbfcfd; text-align: center; }
.empty-state.compact strong { color: #4a5365; font-size: 11px; }
.empty-state.compact span { color: #959dab; font-size: 9.5px; }
.report-program-panel table td { vertical-align: middle; }
.report-footnote { display: flex; align-items: flex-start; gap: 9px; padding: 10px 12px; border: 1px solid #e8eaf0; border-radius: 9px; background: #fafbfc; color: #7c8595; font-size: 9.5px; }
.report-footnote strong { flex: 0 0 auto; color: #4e586a; }
.dashboard-performance-section { margin-top: 2px; }
.dashboard-section-head { display: flex; align-items: flex-end; justify-content: space-between; gap: 18px; margin-bottom: 12px; }
.dashboard-section-head h2 { margin: 2px 0 2px; color: #1d2638; font-size: 18px; letter-spacing: -.025em; }
.dashboard-section-head p { margin: 0; }
.dashboard-context-bar { margin-bottom: 10px; }
.dashboard-performance-grid { display: grid; grid-template-columns: minmax(0,1.1fr) minmax(340px,.9fr); gap: 14px; align-items: stretch; }
.dashboard-report-card { min-width: 0; }
.dashboard-mini-chart { height: 170px; display: flex; align-items: stretch; gap: 4px; padding: 10px 2px 0; border-top: 1px solid #f0f1f4; }
.dashboard-mini-column { min-width: 0; flex: 1 1 0; display: grid; grid-template-rows: 14px 1fr 15px; gap: 3px; text-align: center; }
.dashboard-mini-value { color: #9098a7; font-size: 7.5px; }
.dashboard-mini-column > div { display: flex; align-items: flex-end; justify-content: center; }
.dashboard-mini-column i { width: min(16px,70%); min-width: 5px; display: block; border-radius: 5px 5px 2px 2px; background: linear-gradient(180deg,#6862eb,#4f46e5); }
.dashboard-mini-column small { overflow: hidden; color: #9ca3b0; font-size: 7px; white-space: nowrap; }
.dashboard-sales-strip { display: grid; grid-template-columns: repeat(auto-fit,minmax(130px,1fr)); gap: 8px; margin-top: 12px; }
.dashboard-sales-strip > div { padding: 9px 10px; border: 1px solid #e9ebf0; border-radius: 9px; background: #fafbfc; }
.dashboard-sales-strip span,.dashboard-sales-strip strong,.dashboard-sales-strip small { display: block; }
.dashboard-sales-strip span { color: #8d95a4; font-size: 8.5px; }
.dashboard-sales-strip strong { margin-top: 2px; color: #30394c; font-size: 13px; }
.dashboard-sales-strip small { margin-top: 1px; color: #9aa1ae; font-size: 8px; }
.dashboard-leader-list .leader-row { padding: 9px 0; }

@media (max-width: 1180px) {
  .report-chart-grid,.report-leader-grid,.dashboard-performance-grid { grid-template-columns: 1fr; }
}
@media (max-width: 680px) {
  .report-filter-stack { width: 100%; justify-items: stretch; }
  .segmented-control { width: 100%; }
  .segmented-control a { flex: 1; }
  .report-money-secondary { grid-template-columns: 1fr; }
  .report-chart { min-width: 620px; }
  .report-chart-panel { overflow-x: auto; }
  .report-context-bar { align-items: flex-start; flex-direction: column; gap: 5px; }
  .dashboard-section-head { align-items: flex-start; flex-direction: column; }
  .dashboard-mini-chart { min-width: 520px; }
  .dashboard-report-card { overflow-x: auto; }
  .report-footnote { flex-direction: column; }
}

/* ============================================================
   Phase 27.3 - readability + affiliate analytics + order lifecycle
   ============================================================ */
.app-body { font-size: 15px; }
.workspace-copy strong { font-size: 13.5px; }
.workspace-copy small { font-size: 11.5px; }
.nav-label { font-size: 10.5px; }
.sidebar-nav a { font-size: 13.5px; }
.account-copy strong { font-size: 12.5px; }
.account-copy small { font-size: 10.5px; }
.topbar-copy span { font-size: 10.5px; }
.topbar-copy strong { font-size: 14px; }
.page-head .muted,.dashboard-hero p { font-size: 13.5px; }
.muted { line-height: 1.58; }
.small-note { font-size: 12.5px; }
.panel h2 { font-size: 17px; }
.panel h3 { font-size: 14px; }
.panel-kicker { font-size: 10.5px; }
.quick-action-copy strong { font-size: 12.5px; }
.quick-action-copy small { font-size: 10.5px; }
.button.mini,.mini-button { font-size: 11.5px; }
label,.field-label { font-size: 11.5px; }
input,select,textarea { font-size: 13px; }
.copy-input,.code-area { font-size: 12px; }
th { font-size: 10.5px; }
td { font-size: 12.5px; }
td small { font-size: 10.5px; }
.badge { font-size: 9.5px; }
.details > dt,.details dt { font-size: 11px; }
.setup-row strong { font-size: 12px; }
.setup-row small,.tracking-card-head small,.link-card small { font-size: 10.5px; }
.report-context-bar { font-size: 11.5px; }
.reporting-stats .stat small { font-size: 10.5px; }
.report-money-card-head span { font-size: 11px; }
.report-money-card-head strong { font-size: 10.5px; }
.report-money-primary small,.report-money-secondary small { font-size: 10px; }
.report-money-secondary strong { font-size: 13px; }
.leader-person strong,.seller-copy strong { font-size: 12px; }
.leader-person small,.seller-copy small { font-size: 10px; }
.seller-amount { font-size: 12px; }
.report-footnote { font-size: 10.5px; }

.status-cancelled,.status-rejected,.status-refunded { color: #a83a3a; background: #fff0f0; border-color: #f2cccc; }
.status-partially_refunded { color: #9a6518; background: #fff8e8; border-color: #f3dfb1; }
.status-completed,.status-approved { color: #217a4b; background: #edf9f2; border-color: #ccebd9; }
.status-pending { color: #6d5b1f; background: #fff9e9; border-color: #eee0aa; }
.status-in_payment_batch { color: #4a46b8; background: #f1efff; border-color: #ddd9ff; }

.affiliate-money-secondary { grid-template-columns: repeat(2,minmax(0,1fr)); }
.balance-grid { display: grid; grid-template-columns: repeat(auto-fit,minmax(230px,1fr)); gap: 12px; }
.balance-card { border: 1px solid var(--app-line); border-radius: 11px; background: #fff; overflow: hidden; }
.balance-card > strong { display: block; padding: 11px 14px; border-bottom: 1px solid var(--app-line); background: #fafbfc; color: #444b5e; font-size: 11px; letter-spacing: .07em; }
.balance-card > div { display: flex; justify-content: space-between; gap: 16px; padding: 9px 14px; border-top: 1px solid #f1f2f5; }
.balance-card > div:first-of-type { border-top: 0; }
.balance-card span { color: var(--app-muted); font-size: 11px; }
.balance-card b { color: #30384b; font-size: 12px; }

.order-detail-grid { align-items: start; }
.order-detail-stats .status-stat { display: flex; align-items: center; min-height: 34px; }
.order-detail-stats .status-stat .badge { font-size: 11px; padding: 6px 9px; }
.order-actions-panel { min-width: 0; }
.order-action-buttons { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 14px; }
.lifecycle-action-box { border: 1px solid var(--app-line); border-radius: 10px; background: #fbfcfd; margin-top: 10px; overflow: hidden; }
.lifecycle-action-box summary { cursor: pointer; padding: 11px 13px; color: #374155; font-size: 12px; font-weight: 760; background: #f8f9fb; }
.lifecycle-action-box[open] summary { border-bottom: 1px solid var(--app-line); }
.lifecycle-action-box > form,.lifecycle-action-box > div { padding: 13px; }
.lifecycle-two-form { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 12px; }
.compact-form { gap: 9px; }
.section-gap-small { margin-top: 0; }
.danger-outline { color: #9f3535 !important; border-color: #e5bcbc !important; background: #fff !important; box-shadow: none !important; }
.danger-outline:hover { background: #fff5f5 !important; border-color: #dca7a7 !important; }
.api-doc-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 16px; }
.api-doc-grid h3 { margin-top: 12px; }
.api-doc-grid h3:first-child { margin-top: 0; }
.api-doc-panel .code-area { min-height: auto; }

@media (max-width: 860px) {
  .lifecycle-two-form,.api-doc-grid,.affiliate-money-secondary { grid-template-columns: 1fr; }
}

/* ============================================================
   Phase 28 - global affiliate account, profile + API center
   ============================================================ */
/* Small readability lift after the reporting rebuild. */
.small-note { font-size: 13px; }
td { font-size: 13px; }
td small { font-size: 11px; }
.badge { font-size: 10px; }
.report-chart-value { font-size: 8.75px; }
.report-chart-column small { font-size: 8.25px; }
.dashboard-mini-value { font-size: 8.25px; }
.dashboard-mini-column small { font-size: 7.75px; }

.workspace-card-link { color: inherit; text-decoration: none; }
.workspace-card-link:hover { color: inherit; border-color: #d8dbea; background: #fbfbfe; }
.affiliate-pill-link { color: inherit; text-decoration: none; }
.affiliate-pill-link:hover { color: var(--app-primary); }

.merchant-picker-card { width: min(960px, calc(100vw - 32px)); }
.merchant-picker-grid {
  display: grid;
  grid-template-columns: repeat(2,minmax(0,1fr));
  gap: 12px;
  margin-top: 16px;
}
.merchant-choice-card {
  display: grid;
  grid-template-columns: 42px minmax(0,1fr) auto;
  align-items: center;
  gap: 12px;
  width: 100%;
  padding: 14px;
  border: 1px solid var(--app-line);
  border-radius: 12px;
  background: #fff;
  color: inherit;
  text-align: left;
  box-shadow: var(--app-shadow-xs);
}
.merchant-choice-card:hover { border-color: #cfd2e8; background: #fafaff; }
.merchant-choice-avatar {
  width: 42px; height: 42px; display: grid; place-items: center;
  border-radius: 11px; background: var(--app-primary-soft); color: var(--app-primary);
  font-size: 15px; font-weight: 850;
}
.merchant-choice-copy { min-width: 0; }
.merchant-choice-copy strong,.merchant-choice-copy span,.merchant-choice-copy small { display: block; }
.merchant-choice-copy strong { color: #273044; font-size: 13px; }
.merchant-choice-copy span { margin-top: 2px; color: #687386; font-size: 11px; }
.merchant-choice-copy small { margin-top: 4px; color: #9299a7; font-size: 10px; }
.merchant-choice-arrow { color: #9299a7; font-size: 18px; }

.profile-grid { display: grid; grid-template-columns: minmax(0,1.35fr) minmax(300px,.65fr); gap: 14px; align-items: start; }
.profile-auth-card { width: min(860px, calc(100vw - 32px)); }
.payout-profile-card { display: flex; align-items: center; justify-content: space-between; gap: 18px; flex-wrap: wrap; }
.payout-email-value { margin-top: 3px; color: #273044; font-size: 17px; font-weight: 780; word-break: break-word; }

.commission-decision { display: inline-flex; align-items: center; min-height: 24px; padding: 4px 8px; border: 1px solid transparent; border-radius: 999px; font-size: 10.5px; font-weight: 820; }
.commission-decision.approved { color: #217a4b; background: #edf9f2; border-color: #ccebd9; }
.commission-decision.pending { color: #775f16; background: #fff9e9; border-color: #eee0aa; }
.commission-decision.rejected { color: #a33b3b; background: #fff0f0; border-color: #f2cccc; }
.commission-decision + small { display: block; margin-top: 5px; color: #697386; line-height: 1.4; }
.decision-note { display: block; margin-top: 3px; color: #8b4650 !important; }

.api-summary-stats .stat strong { font-size: 22px; }
.api-guide-grid { align-items: start; }
.api-reference-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 18px; }
.reason-code-list { display: grid; gap: 0; border: 1px solid var(--app-line); border-radius: 10px; overflow: hidden; }
.reason-code-list > div { display: grid; grid-template-columns: minmax(155px,.8fr) minmax(0,1.2fr); gap: 12px; padding: 9px 11px; border-top: 1px solid #eef0f4; background: #fff; }
.reason-code-list > div:first-child { border-top: 0; }
.reason-code-list code { color: #4f46e5; font-size: 11px; }
.reason-code-list span { color: #626d80; font-size: 11px; }
.api-scope-badge { margin: 2px 2px 2px 0; color: #4b46b7; background: #f1efff; border-color: #ddd9ff; }
.api-doc-panel textarea { resize: vertical; }

@media (max-width: 920px) {
  .profile-grid,.api-reference-grid,.merchant-picker-grid { grid-template-columns: 1fr; }
}
@media (max-width: 620px) {
  .merchant-choice-card { grid-template-columns: 38px minmax(0,1fr); }
  .merchant-choice-avatar { width: 38px; height: 38px; }
  .merchant-choice-arrow { display: none; }
  .reason-code-list > div { grid-template-columns: 1fr; gap: 3px; }
  .payout-profile-card { align-items: flex-start; flex-direction: column; }
}

/* ============================================================
   Phase 28.1 - API onboarding + key management
   ============================================================ */
.api-decision-panel { border-color: #dfe3f2; }
.api-decision-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px; }
.api-decision-card { display:grid; grid-template-columns:36px minmax(0,1fr); gap:12px; padding:15px; border:1px solid var(--app-line); border-radius:12px; background:#fff; }
.api-decision-card.yes { border-color:#cae8d7; background:#fbfffc; }
.api-decision-card.no { border-color:#dde1ea; background:#fcfcfd; }
.api-decision-icon { width:34px; height:34px; display:grid; place-items:center; border-radius:9px; font-size:17px; font-weight:900; background:#edf8f2; color:#267b4d; }
.api-decision-card.no .api-decision-icon { background:#f1f3f6; color:#697386; }
.api-decision-card strong { display:block; color:#273044; font-size:14px; }
.api-decision-card p { margin:5px 0 0; color:#626d80; font-size:13px; line-height:1.55; }
.api-security-note { margin-top:12px; }
.api-secret-reveal { border-color:#bfe3cf; box-shadow:0 0 0 3px rgba(41,131,83,.05); }
.api-secret-box { display:flex; gap:10px; align-items:center; padding:13px; border:1px solid #d9e5df; border-radius:10px; background:#f8fcfa; margin-bottom:10px; }
.api-secret-box code { flex:1; min-width:0; overflow-wrap:anywhere; font-size:13px; color:#26372e; }
.api-key-create-row { display:grid; grid-template-columns:minmax(220px,1fr) auto; gap:10px 12px; align-items:end; padding:13px; border:1px solid var(--app-line); border-radius:11px; background:#fafbfc; }
.api-key-create-row label { margin:0; }
.api-key-create-row small { grid-column:1 / -1; color:var(--app-muted); }
.table-action-cell { width:1%; white-space:nowrap; }
.api-steps { list-style:none; padding:0; margin:0; display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:10px; }
.api-steps li { display:grid; grid-template-columns:30px minmax(0,1fr); gap:9px; padding:13px; border:1px solid var(--app-line); border-radius:11px; background:#fff; }
.api-steps li > span { width:28px; height:28px; display:grid; place-items:center; border-radius:8px; background:var(--app-primary-soft); color:var(--app-primary); font-weight:850; }
.api-steps strong { display:block; color:#2f3749; font-size:12.5px; }
.api-steps p { margin:4px 0 0; color:#6b7485; font-size:12px; line-height:1.5; }
.api-code-example-panel textarea { min-height:340px; }
.alert.warning { color:#6e5711; background:#fff9e8; border-color:#eadca9; }

@media (max-width: 1050px) {
  .api-steps { grid-template-columns:repeat(2,minmax(0,1fr)); }
}
@media (max-width: 720px) {
  .api-decision-grid,.api-steps { grid-template-columns:1fr; }
  .api-key-create-row { grid-template-columns:1fr; }
  .api-secret-box { align-items:stretch; flex-direction:column; }
}

.copy-code { display:block; margin:8px 0; padding:10px 12px; border:1px solid var(--app-line); border-radius:9px; background:#f8fafc; white-space:normal; overflow-wrap:anywhere; word-break:break-word; }


/* ===== Phase 31 billing & usage ===== */
.billing-plan-hero{display:flex;align-items:center;justify-content:space-between;gap:24px;padding:24px 26px;border:1px solid var(--app-line);border-radius:var(--app-radius-xl);background:linear-gradient(135deg,#fff,#f7f8ff);box-shadow:var(--app-shadow-xs)}
.billing-plan-hero h2{margin:4px 0;font-size:30px;letter-spacing:-.04em}.billing-plan-hero p{margin:0;color:var(--app-muted)}
.billing-price-block{text-align:right}.billing-price-block strong{display:block;font-size:30px;letter-spacing:-.04em}.billing-price-block small{color:var(--app-muted)}
.usage-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:13px}.usage-card{border:1px solid var(--app-line);border-radius:var(--app-radius);padding:16px;background:#fff}.usage-card-head{display:flex;align-items:center;justify-content:space-between;gap:12px}.usage-card-head span{color:var(--app-muted);font-size:11px;font-weight:700}.usage-card-head strong{font-size:25px}.usage-limit{margin-top:12px;font-size:11px;color:var(--app-muted)}.usage-bar{height:7px;margin:8px 0;border-radius:999px;background:#edf0f5;overflow:hidden}.usage-bar i{display:block;height:100%;border-radius:inherit;background:var(--app-primary)}.usage-bar.unlimited i{background:var(--app-accent)}.usage-card small{color:var(--app-muted)}
.plan-compare-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}.plan-compare-card{border:1px solid var(--app-line);border-radius:var(--app-radius);padding:18px;background:#fff}.plan-compare-card.current{border-color:#b9b5fa;background:#fbfaff}.plan-compare-head{display:flex;align-items:center;justify-content:space-between;gap:10px}.plan-compare-head>strong{font-size:20px}.plan-price-row{display:grid;gap:4px;margin:14px 0;color:var(--app-muted);font-size:11px}.plan-price-row b{color:var(--app-text-strong);font-size:18px}.plan-compare-card ul{margin:12px 0 0;padding-left:18px;color:var(--app-muted);font-size:12px;line-height:1.7}.compact-form{min-width:250px}.compact-form input{min-width:220px}
@media(max-width:1050px){.usage-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.plan-compare-grid{grid-template-columns:1fr}}
@media(max-width:650px){.billing-plan-hero{align-items:flex-start;flex-direction:column}.billing-price-block{text-align:left}.usage-grid{grid-template-columns:1fr}}

/* Phase 32 - Stripe TEST billing */
.checkbox-row{display:flex!important;align-items:center;gap:9px;font-weight:700}.checkbox-row input{width:auto!important;margin:0}.setting-summary{display:grid;gap:4px;padding:12px 14px;border:1px solid var(--app-line);border-radius:10px;background:#fafbfe}.setting-summary span{font-size:11px;color:var(--app-muted);font-weight:700}.setting-summary code,.setting-summary strong{overflow-wrap:anywhere}.stat-compact-value{font-size:15px!important;letter-spacing:-.01em!important;overflow-wrap:anywhere}.billing-subscription-summary{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.billing-subscription-summary>div{display:grid;gap:6px;padding:14px;border:1px solid var(--app-line);border-radius:11px;background:#fafbfe}.billing-subscription-summary span{font-size:10.5px;color:var(--app-muted);font-weight:700}.billing-subscription-summary code{overflow-wrap:anywhere}.billing-test-actions{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-top:14px}.billing-test-actions form,.billing-test-actions button{width:100%}.button-row form{margin:0}.button[disabled],button[disabled]{opacity:.5;cursor:not-allowed;transform:none!important}
@media(max-width:760px){.billing-subscription-summary,.billing-test-actions{grid-template-columns:1fr}}


/* ===== Phase 34: integration toolkit ===== */
.integration-health-list{display:grid;gap:16px}.integration-health-card{overflow:hidden}.integration-score{min-width:118px;text-align:right}.integration-score strong{display:block;font-size:26px;line-height:1;color:#8a5a16}.integration-score span{display:block;margin-top:4px;color:var(--app-muted);font-size:11px;font-weight:750}.integration-score.ready strong{color:#19704c}.integration-check-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}.integration-check{display:grid;grid-template-columns:32px minmax(0,1fr);gap:9px;align-items:center;padding:11px;border:1px solid var(--app-line);border-radius:10px;background:#fff}.integration-check-icon{width:30px;height:30px;display:grid;place-items:center;border-radius:8px;background:#f5f6f9;color:#7a8494;font-weight:900}.integration-check strong{display:block;color:#30394b;font-size:12px}.integration-check small{display:block;margin-top:2px;color:var(--app-muted);font-size:10.5px}.integration-check.pass{border-color:#d6eadf;background:#fbfefc}.integration-check.pass .integration-check-icon{background:#eaf8f0;color:#19704c}.integration-check.fail{border-color:#efd7d4;background:#fffafa}.integration-check.fail .integration-check-icon{background:#fdeceb;color:#a43d37}.integration-check.optional{border-style:dashed}.integration-evidence-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px;margin-top:13px}.integration-evidence-grid>div{padding:11px 12px;border:1px solid #e7e9ef;border-radius:10px;background:#fafbfc}.integration-evidence-grid span,.integration-evidence-grid small{display:block;color:var(--app-muted);font-size:10.5px}.integration-evidence-grid strong{display:block;margin:5px 0 3px;font-size:20px;color:#262f41}.integration-guide-picker .filter-bar{margin:0}.integration-guide-steps{grid-template-columns:repeat(4,minmax(0,1fr))}.integration-guide-code-grid{align-items:start}.integration-code-large{min-height:330px}.download-card-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}.download-card{display:block;padding:15px;border:1px solid var(--app-line);border-radius:11px;background:#fff;color:inherit;text-decoration:none}.download-card:hover{border-color:#c8d3ff;background:#fbfbff}.download-card strong{display:block;color:#2a3345;font-size:13px}.download-card span{display:block;margin-top:5px;color:var(--app-muted);font-size:11.5px;line-height:1.45}
@media(max-width:1100px){.integration-check-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.integration-evidence-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.download-card-grid{grid-template-columns:1fr}.integration-guide-steps{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:720px){.integration-check-grid,.integration-evidence-grid,.integration-guide-steps{grid-template-columns:1fr}.integration-score{text-align:left}}


/* Phase 35 merchant email templates */
.email-template-layout{align-items:start}.email-preview-subject{display:grid;gap:6px;padding:13px 15px;border:1px solid var(--app-line);border-radius:11px;background:#fafbfe;margin-bottom:12px}.email-preview-subject span{font-size:10.5px;color:var(--app-muted);font-weight:750;text-transform:uppercase;letter-spacing:.06em}.email-preview-subject strong{font-size:14px;color:var(--app-text-strong)}.email-preview-frame{display:block;width:100%;height:390px;border:1px solid var(--app-line);border-radius:12px;background:#fff}.template-variable-list{display:grid;gap:8px}.template-variable-list>div{display:grid;grid-template-columns:minmax(170px,.7fr) 1.6fr;gap:12px;align-items:start;padding:10px 12px;border:1px solid var(--app-line);border-radius:10px;background:#fafbfe}.template-variable-list code{font-size:11px;color:var(--app-primary);font-weight:800;overflow-wrap:anywhere}.template-variable-list span{font-size:11.5px;color:var(--app-muted);line-height:1.45}@media(max-width:760px){.template-variable-list>div{grid-template-columns:1fr}.email-preview-frame{height:440px}}

/* Phase 36: simple email editor + production launch controls */
.template-variable-toolbar{display:flex;align-items:center;gap:7px;flex-wrap:wrap;padding:10px 0 2px}.template-variable-toolbar>span{font-size:11px;font-weight:800;color:var(--app-muted);text-transform:uppercase;letter-spacing:.06em}.template-variable-toolbar .button{font-size:11px}
.launch-control-checks{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.launch-control-check{padding:13px 14px;border:1px solid var(--app-line);border-radius:12px;background:#fff}.launch-control-check strong,.launch-control-check span{display:block}.launch-control-check strong{font-size:12px}.launch-control-check span{margin-top:4px;color:var(--app-muted);font-size:11.5px;line-height:1.45}.launch-control-check.pass{border-color:#cfe9dd;background:#f7fcf9}.launch-control-check.fail{border-color:#f1d1d4;background:#fff8f8}.secret-once-card{padding:16px;border:1px solid #f0d8a7;border-radius:14px;background:#fffaf0;margin-bottom:14px}.secret-once-card input{width:100%;margin:10px 0;font-family:ui-monospace,SFMono-Regular,Consolas,monospace}.production-launch-danger{border-color:#f0c8cd}.checkbox-row{display:flex!important;align-items:flex-start;gap:10px;font-weight:600}.checkbox-row input{width:auto;margin-top:3px}.button.danger{background:#b4232e;color:#fff;border-color:#b4232e}.button.danger:hover{background:#971b25;border-color:#971b25}
@media(max-width:820px){.launch-control-checks{grid-template-columns:1fr}}

/* Phase 38 legal readiness */
.legal-consent-app,.legal-admin-check{display:flex!important;gap:10px;align-items:flex-start!important;padding:12px 13px;border:1px solid var(--app-line);border-radius:12px;background:#fafbff;font-size:12px!important;line-height:1.5}.legal-consent-app input,.legal-admin-check input{width:auto!important;margin-top:3px;flex:0 0 auto}.legal-consent-app a{color:var(--app-primary);font-weight:750}.legal-admin-check small{color:var(--app-muted);font-weight:600}.legal-version-stat{font-size:16px!important;overflow-wrap:anywhere}.legal-readiness-grid{grid-template-columns:1fr!important}

/* Phase 40: shared platform email delivery */
.delivery-choice-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}.delivery-choice{display:flex;gap:12px;align-items:flex-start;border:1px solid #d9e3f0;border-radius:16px;padding:16px;background:#fff;cursor:pointer;transition:border-color .15s ease,box-shadow .15s ease,background .15s ease}.delivery-choice:hover{border-color:#b9cdf0}.delivery-choice.selected{border-color:#2f66ea;background:#f5f8ff;box-shadow:0 0 0 3px rgba(47,102,234,.08)}.delivery-choice input{margin-top:4px}.delivery-choice span{display:grid;gap:5px}.delivery-choice strong{font-size:15px}.delivery-choice small{color:#697a91;line-height:1.45}.smtp-custom-panel{display:grid;gap:14px;border-top:1px solid #e4ebf4;padding-top:18px}.smtp-custom-panel[hidden]{display:none!important}@media(max-width:760px){.delivery-choice-grid{grid-template-columns:1fr}}

.text-danger{color:#b42318!important}.template-tabs{margin-bottom:18px}