/* Shared Engage foundation. See docs/BRAND_GUIDELINES.md. */
:root {
  --engage-font: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  --engage-text-min: .9375rem;
  --engage-text-base: 1rem;
  --engage-text-title: 1.875rem;
  --engage-text-section: 1.375rem;
  --engage-text-card: 1.125rem;
  --engage-text-metric: 2rem;
  --engage-primary: #6D28D9;
  --engage-primary-hover: #5B21B6;
  --engage-primary-pressed: #4C1D95;
  --engage-primary-soft: #F3E8FF;
  --engage-primary-soft-text: #5B21B6;
  --engage-bg: #F8FAFC;
  --engage-surface: #FFFFFF;
  --engage-surface-subtle: #F1F5F9;
  --engage-text: #0F172A;
  --engage-text-secondary: #475569;
  --engage-border: #E2E8F0;
  --engage-control-border: #64748B;
  --engage-focus: #7C3AED;
  --engage-success: #166534;
  --engage-success-bg: #DCFCE7;
  --engage-warning: #92400E;
  --engage-warning-bg: #FEF3C7;
  --engage-danger: #B91C1C;
  --engage-danger-bg: #FEE2E2;
  --engage-info: #1E40AF;
  --engage-info-bg: #DBEAFE;
  --engage-disabled-bg: #E2E8F0;
  --engage-disabled-text: #475569;
  --engage-radius-control: 8px;
  --engage-radius-card: 12px;
  --engage-shadow: 0 2px 8px rgb(15 23 42 / 5%);
  --bs-body-font-family: var(--engage-font);
  --bs-body-font-size: var(--engage-text-base);
  --bs-body-color: var(--engage-text);
  --bs-body-bg: var(--engage-bg);
  --bs-secondary-color: var(--engage-text-secondary);
  --bs-secondary-rgb: 71, 85, 105;
  --bs-border-color: var(--engage-border);
  --bs-link-color: var(--engage-primary);
  --bs-link-hover-color: var(--engage-primary-hover);
  --bs-danger-rgb: 185, 28, 28;
  --bs-success-rgb: 22, 101, 52;
}
* { box-sizing: border-box; }
html { font-size: 100%; }
body { font-family: var(--engage-font); font-size: var(--engage-text-base); line-height: 1.5; color: var(--engage-text); background: var(--engage-bg); }
button, input, select, textarea { font: inherit; }
a { color: var(--engage-primary); text-underline-offset: .2em; }
a:hover { color: var(--engage-primary-hover); }
a:active { color: var(--engage-primary-pressed); }
h1, h2, h3 { font-weight: 600; }
h1 { font-size: var(--engage-text-title); line-height: 1.25; }
h2 { font-size: var(--engage-text-section); line-height: 1.35; }
h3 { font-size: var(--engage-text-card); line-height: 1.4; }
small, .small, .form-text, .badge, .tooltip-inner, .popover-body,
.pagination, .dropdown-menu, .breadcrumb, .invalid-feedback, .valid-feedback,
.invalid-tooltip, .valid-tooltip, .popover-header, .btn-close, .input-group-text,
code, kbd, samp, sub, sup { font-size: var(--engage-text-min); }
.form-text, .text-muted { color: var(--engage-text-secondary) !important; }
.tooltip { --bs-tooltip-font-size: var(--engage-text-min); --bs-tooltip-bg: var(--engage-text); --bs-tooltip-color: var(--engage-surface); --bs-tooltip-opacity: 1; }
.popover { --bs-popover-font-size: var(--engage-text-min); --bs-popover-header-font-size: var(--engage-text-base); --bs-popover-body-color: var(--engage-text); }
.invalid-feedback, .invalid-tooltip { color: var(--engage-danger); }
.valid-feedback, .valid-tooltip { color: var(--engage-success); }
.invalid-tooltip { background: var(--engage-danger-bg); }
.valid-tooltip { background: var(--engage-success-bg); }
:focus-visible { outline: 3px solid var(--engage-focus) !important; outline-offset: 3px; }
input::placeholder, textarea::placeholder, .form-control::placeholder { color: var(--engage-text-secondary); opacity: 1; }
.sidebar { position: fixed; inset: 0 auto 0 0; width: 248px; overflow-y: auto; background: var(--engage-surface); border-right: 1px solid var(--engage-border); padding: 24px 16px; display: flex; flex-direction: column; z-index: 20; }
.wordmark { display: flex; align-items: center; min-height: 56px; padding: 0 8px; text-decoration: none; border-radius: var(--engage-radius-control); }
.brand-logo { display: block; width: 100%; height: auto; }
.store-label, .nav-label { font-size: var(--engage-text-min); color: var(--engage-text-secondary); margin: 16px 8px 24px; }
.nav-label { margin-bottom: 8px; }
.nav-item { display: flex; gap: 12px; align-items: center; padding: 12px; border-radius: var(--engage-radius-control); color: var(--engage-text-secondary); font-weight: 500; margin: 4px 0; text-decoration: none; border-left: 3px solid transparent; }
.nav-item span { width: 24px; text-align: center; line-height: 1; }
.nav-item.active { background: var(--engage-primary-soft); color: var(--engage-primary-soft-text); border-left-color: var(--engage-primary); font-weight: 600; }
.nav-item:hover { background: var(--engage-primary-soft); color: var(--engage-primary-soft-text); }
.sidebar-bottom { margin-top: auto; padding: 24px 8px 0; font-size: var(--engage-text-min); color: var(--engage-text-secondary); border-top: 1px solid var(--engage-border); }
.sidebar-bottom p { font-size: var(--engage-text-min); margin: 8px 0 0; }
.status-dot { display: inline-block; width: 8px; height: 8px; background: var(--engage-primary); border-radius: 50%; margin-right: 8px; }
.workspace { margin-left: 248px; }
.topbar { min-height: 88px; background: var(--engage-surface); border-bottom: 1px solid var(--engage-border); display: flex; align-items: center; justify-content: space-between; padding: 16px 32px; gap: 16px; }
.breadcrumb-label { font-size: var(--engage-text-min); color: var(--engage-text-secondary); }
.breadcrumb-label span { padding: 0 8px; }
.account { display: flex; gap: 8px; align-items: center; }
.avatar { background: var(--engage-primary-soft); color: var(--engage-primary-soft-text); display: grid; place-items: center; width: 40px; height: 40px; border-radius: 50%; font-weight: 600; }
.account-name { font-size: var(--engage-text-min); }
.account-name small { display: block; color: var(--engage-text-secondary); }
.menu-toggle { display: none; }
.main-content { max-width: 1480px; margin: auto; padding: 32px; }
.eyebrow { font-size: var(--engage-text-min); font-weight: 600; color: var(--engage-primary); margin-bottom: 12px; }
.page-heading { margin-bottom: 24px; }
.page-heading p { color: var(--engage-text-secondary); margin: 12px 0 0; }
.hero-card { background: var(--engage-primary-soft); border: 1px solid var(--engage-border); border-radius: var(--engage-radius-card); padding: 24px; }
.hero-card h2 { margin: 16px 0; }
.hero-card p { color: var(--engage-text-secondary); }
.hero-card .btn { margin-top: 8px; }
.btn { font-size: var(--engage-text-base); min-height: 44px; padding: 8px 16px; font-weight: 500; border-radius: var(--engage-radius-control); white-space: normal; }
.btn-primary { --bs-btn-color: var(--engage-surface); --bs-btn-bg: var(--engage-primary); --bs-btn-border-color: var(--engage-primary); --bs-btn-hover-color: var(--engage-surface); --bs-btn-hover-bg: var(--engage-primary-hover); --bs-btn-hover-border-color: var(--engage-primary-hover); --bs-btn-active-color: var(--engage-surface); --bs-btn-active-bg: var(--engage-primary-pressed); --bs-btn-active-border-color: var(--engage-primary-pressed); }
.btn-light, .btn-outline-secondary { --bs-btn-color: var(--engage-text); --bs-btn-bg: var(--engage-surface); --bs-btn-border-color: var(--engage-control-border); --bs-btn-hover-color: var(--engage-primary-soft-text); --bs-btn-hover-bg: var(--engage-primary-soft); --bs-btn-hover-border-color: var(--engage-primary); --bs-btn-active-color: var(--engage-primary-soft-text); --bs-btn-active-bg: var(--engage-primary-soft); --bs-btn-active-border-color: var(--engage-primary-pressed); }
.btn:disabled, .btn.disabled, fieldset:disabled .btn, .form-control:disabled, .form-select:disabled { color: var(--engage-disabled-text); background: var(--engage-disabled-bg); border-color: var(--engage-control-border); opacity: 1; }
.stats-grid { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: 16px; margin-top: 24px; }
.stats-grid.three { grid-template-columns: repeat(3,minmax(0,1fr)); }
.stat-card, .panel { min-width: 0; background: var(--engage-surface); border: 1px solid var(--engage-border); border-radius: var(--engage-radius-card); padding: 24px; box-shadow: var(--engage-shadow); }
.stat-card div, .stat-card small { color: var(--engage-text-secondary); font-size: var(--engage-text-min); }
.stat-card strong { display: block; font-size: var(--engage-text-metric); line-height: 1.2; font-weight: 600; margin: 12px 0 8px; }
.panel-heading { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center; gap: 12px; margin-bottom: 16px; }
.panel-heading h2 { margin: 0; }
.empty { text-align: center; padding: 32px 16px; }
.empty-icon { display: grid; place-items: center; margin: 0 auto 16px; width: 48px; height: 48px; border-radius: var(--engage-radius-card); color: var(--engage-primary-soft-text); background: var(--engage-primary-soft); font-size: 1.875rem; }
.empty p { color: var(--engage-text-secondary); max-width: 440px; margin: 12px auto 0; }
.setup-item { display: flex; gap: 12px; margin: 24px 0; }
.setup-item > span { background: var(--engage-primary-soft); width: 36px; height: 36px; display: grid; place-items: center; border-radius: 50%; font-size: var(--engage-text-min); color: var(--engage-primary-soft-text); flex-shrink: 0; }
.setup-item a { font-weight: 600; }
.setup-item p { font-size: var(--engage-text-min); color: var(--engage-text-secondary); margin: 4px 0 0; }
.page-footer { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 16px; margin-top: 32px; border-top: 1px solid var(--engage-border); padding-top: 24px; color: var(--engage-text-secondary); font-size: var(--engage-text-min); }
.toolbar, .pagination-bar { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center; gap: 16px; margin-bottom: 24px; }
.tabs { display: flex; flex-wrap: wrap; gap: 24px; }
.tabs a { padding: 12px 0; color: var(--engage-text-secondary); text-decoration: none; }
.tabs a.selected { color: var(--engage-primary); border-bottom: 3px solid var(--engage-primary); }
.search-form { display: flex; gap: 8px; max-width: 500px; margin-bottom: 24px; }
.search-form .form-control { min-width: 0; }
.form-control, .form-select { font-size: var(--engage-text-base); min-height: 44px; border-color: var(--engage-control-border); padding: 8px 12px; border-radius: var(--engage-radius-control); color: var(--engage-text); background-color: var(--engage-surface); }
.form-control:focus, .form-select:focus { color: var(--engage-text); border-color: var(--engage-primary); box-shadow: none; }
.form-label { font-size: var(--engage-text-min); color: var(--engage-text-secondary); font-weight: 500; }
.table { font-size: var(--engage-text-base); --bs-table-color: var(--engage-text); --bs-table-bg: var(--engage-surface); --bs-table-border-color: var(--engage-border); }
.table { min-width: 600px; overflow-wrap: normal; }
.table th { white-space: nowrap; font-size: var(--engage-text-min); font-weight: 600; color: var(--engage-text-secondary); padding: 16px 12px; background: var(--engage-surface-subtle); }
.table td { padding: 16px 12px; }
.table-responsive { max-width: 100%; }
.table-responsive:focus-visible { outline-offset: -3px; }
.badge-soft { display: inline-block; font-size: var(--engage-text-min); font-weight: 500; background: var(--engage-primary-soft); color: var(--engage-primary-soft-text); border-radius: var(--engage-radius-control); padding: 4px 8px; }
.pagination-bar { font-size: var(--engage-text-min); color: var(--engage-text-secondary); margin: 24px 0 0; }
.page-link { font-size: var(--engage-text-min); min-width: 44px; min-height: 44px; color: var(--engage-primary); }
.back-link { display: inline-block; margin-bottom: 24px; }
.consent-block { border-bottom: 1px solid var(--engage-border); margin: 24px 0; padding-bottom: 4px; }
.narrow-panel { max-width: 850px; }
.rule-row { display: grid; grid-template-columns: minmax(0,1fr) auto minmax(0,1fr); gap: 12px; align-items: center; margin: 16px 0; color: var(--engage-text-secondary); }
.matching-count { background: var(--engage-primary-soft); border-radius: var(--engage-radius-control); padding: 16px; margin: 24px 0; color: var(--engage-primary-soft-text); font-weight: 600; }
.preview-panel { position: sticky; top: 24px; }
.message-preview { border: 1px solid var(--engage-border); border-radius: var(--engage-radius-control); min-height: 280px; padding: 24px; margin-top: 24px; }
.message-from { font-size: var(--engage-text-min); color: var(--engage-text-secondary); border-bottom: 1px solid var(--engage-border); padding-bottom: 16px; margin-bottom: 24px; }
.message-body { white-space: pre-wrap; overflow-wrap: anywhere; line-height: 1.5; font-size: var(--engage-text-base); }
.message-preview h3 { margin-bottom: 24px; }
.sms-preview { max-width: 320px; margin-inline: auto; border-radius: 24px; background: var(--engage-primary-soft); }
.revision { border-bottom: 1px solid var(--engage-border); padding: 16px 0; }
summary { cursor: pointer; padding: 8px 0; min-height: 44px; }
pre { white-space: pre-wrap; overflow-wrap: anywhere; font-size: var(--engage-text-min); background: var(--engage-surface-subtle); padding: 16px; border-radius: var(--engage-radius-control); }
.integration-icon { background: var(--engage-primary-soft); color: var(--engage-primary-soft-text); font-weight: 600; width: 48px; height: 48px; border-radius: var(--engage-radius-card); display: grid; place-items: center; font-size: 1.625rem; margin-bottom: 24px; }
.integration-card { height: 100%; }
.integration-card .badge-soft { float: none !important; margin-bottom: 16px; }
.safeguards { display: grid; grid-template-columns: minmax(0,1fr) auto; gap: 16px; margin: 24px 0; }
.safeguards dt { font-weight: 500; color: var(--engage-text-secondary); }
.safeguards dd { margin: 0; color: var(--engage-primary); }
.login-wrap { min-height: 100dvh; display: grid; place-items: center; padding: 24px; }
.login-card { background: var(--engage-surface); border: 1px solid var(--engage-border); padding: 32px; border-radius: var(--engage-radius-card); width: 100%; max-width: 480px; box-shadow: var(--engage-shadow); }
.login-card .brand-logo { width: 280px; max-width: 100%; margin-bottom: 24px; }
.login-card form { margin-top: 24px; }
.alert { font-size: var(--engage-text-base); }
.alert-success { --bs-alert-color: var(--engage-success); --bs-alert-bg: var(--engage-success-bg); --bs-alert-border-color: var(--engage-success); }
.alert-warning { --bs-alert-color: var(--engage-warning); --bs-alert-bg: var(--engage-warning-bg); --bs-alert-border-color: var(--engage-warning); }
.alert-danger { --bs-alert-color: var(--engage-danger); --bs-alert-bg: var(--engage-danger-bg); --bs-alert-border-color: var(--engage-danger); }
.alert-info { --bs-alert-color: var(--engage-info); --bs-alert-bg: var(--engage-info-bg); --bs-alert-border-color: var(--engage-info); }
.alert-light { --bs-alert-color: var(--engage-text-secondary); --bs-alert-bg: var(--engage-surface-subtle); --bs-alert-border-color: var(--engage-border); }
.alert-link { color: inherit; }
/* Long user content wraps; tabular content scrolls inside its labeled region. */
h1, h2, h3, p, .stat-card, .panel, .alert, .account-name, .breadcrumb-label { overflow-wrap: anywhere; }
@media (max-width: 1199px) {
  .stats-grid { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .stats-grid.three { grid-template-columns: 1fr; }
  .main-content { padding: 24px; }
  .topbar { padding-inline: 24px; }
  .account-name { display: none; }
}
@media (max-width: 991px) {
  .sidebar { visibility: hidden; transform: translateX(-100%); }
  .workspace { margin-left: 0; }
  .menu-toggle { display: flex; align-items: center; gap: 8px; }
  .nav-open .sidebar { visibility: visible; transform: none; top: var(--engage-header-height, 88px); width: min(280px,100%); box-shadow: var(--engage-shadow); }
  .topbar { position: relative; z-index: 21; }
  .preview-panel { position: static; }
}
@media (max-width: 575px) {
  h1 { font-size: 1.625rem; }
  .topbar { padding: 12px 16px; gap: 8px; }
  .topbar > .d-flex { flex: 1 1 auto; min-width: 0; flex-wrap: wrap; gap: 8px !important; }
  .account { margin-left: auto; }
  .avatar { display: none; }
  .main-content { padding: 24px 16px; }
  .panel, .stat-card, .hero-card, .login-card { padding: 16px; }
  .stats-grid, .stats-grid.three { grid-template-columns: 1fr; }
  .rule-row { grid-template-columns: 1fr; gap: 8px; }
  .rule-row > span { display: none; }
  .tabs { gap: 16px; }
  .message-preview { padding: 16px; }
  .safeguards { grid-template-columns: 1fr; gap: 8px; }
  .safeguards dd { margin-bottom: 8px; }
  .d-flex.gap-2 { flex-wrap: wrap; }
}
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { scroll-behavior: auto !important; transition: none !important; animation: none !important; }
}

/* System health uses the shared brand tokens and type scale. */
.health-metrics { margin: 0; }
.health-metrics > div { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 8px 24px; padding: 12px 0; border-bottom: 1px solid var(--engage-border); }
.health-metrics dt { font-weight: 500; overflow-wrap: anywhere; }
.health-metrics dd { margin: 0; }

/* Email builder uses shared Engage tokens and keeps the email at actual size. */
.builder-meta{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,240px),1fr));gap:24px}
.builder-toolbar{display:flex;justify-content:space-between;align-items:center;gap:16px;flex-wrap:wrap;margin-bottom:16px}
.builder-grid{display:grid;grid-template-columns:minmax(200px,1fr) minmax(320px,2.4fr) minmax(240px,1.2fr);gap:16px;align-items:start}
.builder-grid>*{min-width:0;padding:16px}.builder-grid h2{font-size:1.125rem}.section-library{display:grid;gap:8px;grid-template-columns:1fr 1fr}.section-library .btn{white-space:normal;text-align:left}
.section-list{list-style:none;padding:0;display:grid;gap:8px}.section-list .btn{width:100%;text-align:left;overflow-wrap:anywhere;white-space:normal}
.builder-grid [aria-pressed=true]{background:var(--engage-primary-soft);color:var(--engage-primary-soft-text);border:2px solid var(--engage-primary)}
.section-actions{display:flex;flex-wrap:wrap;gap:8px}.preview-scroll{overflow:auto;max-width:100%;background:var(--engage-bg);padding:8px}
#email-preview,#email-preview-fullscreen{display:block;border:1px solid var(--engage-control-border);width:600px;max-width:none;height:900px;margin:auto;background:var(--engage-surface)}
#email-preview.mobile,#email-preview-fullscreen.mobile{width:375px}.review-email{width:100%;height:900px;border:1px solid var(--engage-control-border)}
@media(max-width:1150px){.builder-grid{grid-template-columns:minmax(200px,1fr) minmax(320px,2fr)}.builder-settings{grid-column:1/-1}}
@media(max-width:850px){.builder-grid{grid-template-columns:minmax(0,1fr)}.builder-settings{grid-column:auto}.section-library{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media(max-width:480px){.section-library{grid-template-columns:1fr 1fr}}
#email-builder{container-type:inline-size}
@container(max-width:1000px){.builder-grid{grid-template-columns:minmax(200px,1fr) minmax(300px,2fr)}.builder-settings{grid-column:1/-1}}
@container(max-width:650px){.builder-grid{grid-template-columns:minmax(0,1fr)}.builder-settings{grid-column:auto}}
.builder-panel-toggles,.builder-preview-controls{display:flex;flex-wrap:wrap;gap:8px}
.builder-grid.builder-library-hidden{grid-template-columns:minmax(320px,2.4fr) minmax(240px,1.2fr)}
.builder-grid.builder-settings-hidden{grid-template-columns:minmax(200px,1fr) minmax(320px,2.4fr)}
.builder-library-hidden .builder-settings{grid-column:auto}
.builder-grid.builder-library-hidden.builder-settings-hidden{grid-template-columns:minmax(0,1fr)}
@media(max-width:850px){.builder-grid.builder-library-hidden,.builder-grid.builder-settings-hidden{grid-template-columns:minmax(0,1fr)}}
@container(max-width:650px){.builder-grid.builder-library-hidden,.builder-grid.builder-settings-hidden{grid-template-columns:minmax(0,1fr)}}
.builder-preview-dialog{box-sizing:border-box;width:100%;max-width:100%;height:100%;max-height:100%;margin:0;padding:24px;border:0;background:var(--engage-surface);color:var(--engage-text)}
.builder-preview-dialog[open]{display:flex;flex-direction:column}
.builder-preview-dialog h2{font-size:1.125rem;margin:0}
.builder-preview-dialog .builder-toolbar{flex-shrink:0}
.builder-preview-dialog .preview-scroll{flex:1;min-height:0}
.builder-preview-dialog #email-preview-fullscreen{height:100%;min-height:300px}
.builder-preview-dialog [aria-pressed=true]{background:var(--engage-primary-soft);color:var(--engage-primary-soft-text);border:2px solid var(--engage-primary)}
body.builder-preview-open{overflow:hidden}
@media(max-width:480px){.builder-preview-dialog{padding:16px}}

/* Team & access: existing palette, readable type, and deliberate table overflow. */
.team-table{min-width:850px}.team-person{display:flex;gap:12px;align-items:center}.team-person>div{overflow-wrap:anywhere;max-width:320px}
.team-avatar{display:inline-flex;align-items:center;justify-content:center;flex:0 0 44px;width:44px;height:44px;border-radius:50%;font-weight:600;background:var(--engage-primary-soft);color:var(--engage-primary-soft-text)}
.team-tone-1{background:var(--engage-info-bg);color:var(--engage-info)}.team-tone-2{background:var(--engage-success-bg);color:var(--engage-success)}
.team-status{display:inline-block;border-radius:var(--engage-radius-control);padding:4px 8px;font-size:var(--engage-text-min)}
.team-status-active{background:var(--engage-success-bg);color:var(--engage-success)}.team-status-invited{background:var(--engage-warning-bg);color:var(--engage-warning)}.team-status-disabled{background:var(--engage-disabled-bg);color:var(--engage-disabled-text)}
.team-actions{display:flex;flex-wrap:wrap;gap:8px;min-width:170px}.team-actions form{margin:0}.role-guide{background:var(--engage-surface-subtle);padding:16px;border-radius:var(--engage-radius-control);margin-bottom:24px}.role-guide p{font-size:var(--engage-text-min)}.role-guide p:last-child{margin-bottom:0}
#invite-team{scroll-margin-top:24px}.campaign-summary-preview{white-space:pre-wrap;overflow-wrap:anywhere}

/* Audience import uses the shared Engage controls, type and color tokens. */
.import-steps { display:flex;flex-wrap:wrap;gap:1rem;list-style:none;padding:0;margin:0 0 1.5rem; }
.import-steps li { display:flex;align-items:center;gap:.5rem;color:var(--engage-text-secondary);font-size:1rem; }
.import-steps li span { display:inline-grid;place-items:center;width:2rem;height:2rem;border:1px solid var(--engage-control-border);border-radius:50%;flex-shrink:0; }
.import-steps [aria-current="step"] { color:var(--engage-primary);font-weight:600; }
.import-steps [aria-current="step"] span { background:var(--engage-primary);color:var(--engage-surface);border-color:var(--engage-primary); }
.import-drop { border:2px dashed var(--engage-control-border);border-radius:var(--engage-radius-card);padding:1.5rem; }
.import-filename,.import-sample { overflow-wrap:anywhere; }
.import-sample { max-width:24rem; }
.import-map { min-width:12rem; }
.import-counts { display:flex;flex-wrap:wrap;gap:1rem 2rem;padding-left:1.25rem; }
.import-table { position:relative; }
.import-options .form-check, .import-confirm { min-height:44px; }
.import-options .form-check-input, .import-confirm .form-check-input { border-color:var(--engage-control-border); }
.import-options .form-check-input:checked, .import-confirm .form-check-input:checked { color:var(--engage-surface);background-color:var(--engage-primary);border-color:var(--engage-primary); }
.import-options .form-check-input:focus, .import-confirm .form-check-input:focus { border-color:var(--engage-primary);box-shadow:none; }

.import-subscriptions { max-width: 52rem; }
.import-consent-evidence { padding:1rem; background:var(--engage-surface-subtle); border-radius:var(--engage-radius-control); }

/* Personal account controls use the shared Engage tokens. */
.account-dropdown { position: relative; min-width: 0; flex: 0 0 auto; }
.account-trigger { display: flex; align-items: center; gap: 12px; min-height: 48px; padding: 4px 8px; border: 1px solid transparent; border-radius: var(--engage-radius-control); background: var(--engage-surface); color: var(--engage-text); text-align: left; }
.account-trigger:hover, .account-trigger[aria-expanded="true"] { background: var(--engage-primary-soft); }
.account-trigger .account-name { max-width: 200px; }
.profile-avatar { display: inline-flex; align-items: center; justify-content: center; flex: 0 0 44px; width: 44px; height: 44px; overflow: hidden; border: 2px solid var(--engage-border); border-radius: 50%; background: var(--engage-primary-soft); color: var(--engage-primary-soft-text); font-weight: 600; }
.profile-avatar img { width: 100%; height: 100%; object-fit: cover; }
.account-chevron { color: var(--engage-text-secondary); transition: transform 160ms ease; }
.account-trigger[aria-expanded="true"] .account-chevron { transform: rotate(180deg); }
.account-popover { position: absolute; right: 0; top: calc(100% + 8px); z-index: 30; width: 320px; max-width: calc(100vw - 32px); background: var(--engage-surface); border: 1px solid var(--engage-border); border-radius: var(--engage-radius-card); box-shadow: var(--engage-shadow); padding: 8px; animation: account-open 160ms ease-out; }
.account-popover[hidden] { display: none; }
.account-popover a, .account-popover button { display: block; width: 100%; padding: 12px; min-height: 44px; text-align: left; border: 0; border-radius: var(--engage-radius-control); background: var(--engage-surface); color: var(--engage-text); text-decoration: none; }
.account-popover a:hover, .account-popover button:hover { background: var(--engage-primary-soft); }
.account-popover span { display: block; color: var(--engage-text-secondary); font-size: var(--engage-text-min); margin-top: 4px; }
.account-popover form { border-top: 1px solid var(--engage-border); margin-top: 4px; padding-top: 4px; }
.account-popover button { font-weight: 600; }
.profile-panel { max-width: 720px; }
.profile-photo-editor { display: flex; align-items: center; gap: 24px; margin: 24px 0; }
.profile-avatar-large { width: 128px; height: 128px; flex-basis: 128px; font-size: 2rem; border: 3px solid var(--engage-border); }
.profile-photo-label { display: inline-flex; position: relative; flex-shrink: 0; cursor: pointer; padding: 0; border: 0; background: transparent; border-radius: 50%; }
.profile-camera { display: grid; place-items: center; position: absolute; right: 0; bottom: 0; width: 44px; height: 44px; border: 2px solid var(--engage-surface); border-radius: 50%; background: var(--engage-primary); color: var(--engage-surface); transition: background 160ms; }
.profile-photo-label:hover .profile-camera { background: var(--engage-primary-hover); }
.password-control { display: flex; gap: 8px; }
.password-control input { min-width: 0; }
.password-toggle { flex: 0 0 48px; border: 1px solid var(--engage-control-border); }
@keyframes account-open { from { opacity: 0; transform: translateY(-4px); } to { opacity: 1; transform: translateY(0); } }
@media (max-width: 575px) { .profile-photo-editor { flex-direction: column; align-items: flex-start; gap: 16px; } .account-trigger { gap: 8px; padding-inline: 4px; } }
@media (prefers-reduced-motion: reduce) { .account-popover { animation: none; } .account-chevron, .profile-camera { transition: none; } }
.profile-panel input[readonly] { background: var(--engage-surface-subtle); }

.profile-photo-editor .btn { margin: 0 8px 8px 0; }

/* Public email preferences: requested white, ink and teal treatment for It's a 10.
   Shared tokens live here; workspace palette and typography remain unchanged. */
:root {
  --engage-ink: #171717;
  --engage-teal: #0F766E;
  --engage-teal-hover: #115E59;
  --engage-teal-soft: #F0FDFA;
}
.email-preferences { margin: 0; background: var(--engage-surface); color: var(--engage-ink); }
.preferences-shell { width: min(100%, 640px); margin: 0 auto; padding: 48px 24px 24px; }
.preferences-logo { display: block; width: 180px; max-width: 100%; height: auto; margin: 0 auto 48px; }
.preferences-intro { margin-bottom: 32px; text-align: center; }
.preferences-eyebrow { display: block; color: var(--engage-teal); font-size: var(--engage-text-min); margin-bottom: 16px; }
.email-preferences h1 { margin: 0 0 16px; font-size: var(--engage-text-title); font-weight: 600; letter-spacing: -.025em; }
.preferences-intro p { max-width: 480px; margin: 0 auto; color: var(--engage-text-secondary); }
.preferences-choices { display: grid; gap: 16px; }
.preferences-choice { display: flex; align-items: center; justify-content: space-between; gap: 16px; width: 100%; min-height: 100px; padding: 24px; text-align: left; color: var(--engage-ink); background: var(--engage-surface); border: 1px solid var(--engage-control-border); border-radius: var(--engage-radius-card); cursor: pointer; transition: background-color .18s, border-color .18s, box-shadow .18s; }
.preferences-choice strong { display: block; font-size: var(--engage-text-card); font-weight: 600; line-height: 1.4; }
.preferences-description { display: block; color: var(--engage-text-secondary); margin-top: 4px; }
.preferences-arrow { flex-shrink: 0; color: var(--engage-teal); font-size: var(--engage-text-section); }
.preferences-choice:hover, .preferences-choice:focus-visible { border-color: var(--engage-teal); background: var(--engage-teal-soft); box-shadow: 0 0 0 1px var(--engage-teal); }
.preferences-choice:active { background: var(--engage-teal-soft); box-shadow: inset 4px 0 var(--engage-teal); }
.email-preferences :focus-visible { outline-color: var(--engage-teal) !important; }
.preferences-unsubscribe { justify-self: center; min-height: 44px; margin-top: 8px; padding: 8px 4px; border: 0; background: transparent; color: var(--engage-teal); text-decoration: underline; text-underline-offset: .25em; cursor: pointer; }
.preferences-unsubscribe:hover { color: var(--engage-teal-hover); }
.preferences-choice:disabled, .preferences-unsubscribe:disabled { cursor: default; }
.preferences-help, .preferences-error { padding: 16px; margin: 0 0 24px; border-radius: var(--engage-radius-control); font-size: var(--engage-text-min); }
.preferences-help { color: var(--engage-text-secondary); background: var(--engage-surface-subtle); }
.preferences-error { color: var(--engage-danger); background: var(--engage-danger-bg); }
.preferences-footer { margin-top: 48px; padding-top: 24px; border-top: 1px solid var(--engage-border); text-align: center; color: var(--engage-text-secondary); font-size: var(--engage-text-min); }
.preferences-confirmation { padding: 32px 0; text-align: center; }
.preferences-check { display: grid; place-items: center; width: 64px; height: 64px; margin: 0 auto 24px; border: 1px solid var(--engage-teal); border-radius: 50%; color: var(--engage-teal); background: var(--engage-teal-soft); font-size: var(--engage-text-metric); }
.preferences-confirmation p { color: var(--engage-text-secondary); }
.preferences-confirmation .preferences-signoff { color: var(--engage-teal); margin-top: 32px; }
@media (max-width: 480px) {
  .preferences-shell { padding: 32px 16px 24px; }
  .preferences-logo { margin-bottom: 32px; }
  .preferences-choice { padding: 20px 16px; }
}
@media (prefers-reduced-motion: reduce) { .preferences-choice { transition: none; } }

/* Brand context uses the shared controls and typography at every viewport. */
.brand-switcher { display:flex; align-items:center; gap:8px; flex-wrap:wrap; margin:0; max-width:100%; }
.brand-switcher label { font-size:var(--engage-text-min); color:var(--engage-text-secondary); margin:0; }
.brand-switcher .form-select { width:auto; max-width:100%; min-height:44px; font-size:var(--engage-text-base); }
.topbar { flex-wrap:wrap; gap:16px; }
@media (max-width: 767px) { .brand-switcher { flex:1 1 100%; } .brand-switcher .form-select { flex:1; min-width:0; } }

/* Central brand management reuses Engage tokens and responsive table behavior. */
.brand-actions { display:flex; flex-wrap:wrap; gap:8px; min-width:140px; }
.brand-actions form { margin:0; }
.brand-setup-help { display:inline-flex; align-items:center; gap:8px; min-height:44px; margin-top:8px; }
.brand-help-icon { display:inline-flex; align-items:center; justify-content:center; width:24px; height:24px; flex:0 0 24px; border:2px solid currentColor; border-radius:50%; font-size:var(--engage-text-base); font-weight:600; line-height:1; }
#sms-verification { scroll-margin-top:24px; }
#sms-verification li + li { margin-top:12px; }
/* Campaign creation: one canvas and one focused settings panel. */
.campaign-sent-banner { display:flex; align-items:center; gap:24px; margin:0 0 24px; padding:24px; border-radius:var(--engage-radius-card); background:var(--engage-success-bg); color:var(--engage-success); }
.campaign-sent-art { flex:0 0 96px; line-height:0; }
.campaign-sent-art svg { max-width:100%; }
.campaign-sent-copy { flex:1; min-width:0; }
.campaign-sent-copy h2 { margin:0 0 8px; font-size:var(--engage-text-section); color:var(--engage-success); }
.campaign-sent-copy p { margin:0; font-size:var(--engage-text-base); }
.campaign-sent-banner > .btn { flex-shrink:0; }
.campaign-sent-burst { transform-box:fill-box; transform-origin:center; }
@media (prefers-reduced-motion:no-preference) {
 .campaign-sent-burst { animation:campaign-sent-sparkle 1.6s ease-out both; }
 .campaign-sent-burst-second { animation-delay:.25s; }
}
@keyframes campaign-sent-sparkle { 0% { opacity:0; transform:scale(.4) rotate(-12deg); } 45% { opacity:1; transform:scale(1.15) rotate(4deg); } 100% { opacity:1; transform:scale(1) rotate(0); } }
@media (max-width:767px) {
 .campaign-sent-banner { flex-wrap:wrap; gap:16px; padding:16px; }
 .campaign-sent-art { flex-basis:64px; }
 .campaign-sent-copy { flex-basis:calc(100% - 80px); }
 .campaign-sent-banner > .btn { width:100%; }
}
.campaign-stages{display:flex;gap:12px;flex-wrap:wrap;margin:16px 0 24px}
.campaign-stages [aria-current=step]{background:var(--engage-primary-soft);color:var(--engage-primary-soft-text);border:2px solid var(--engage-primary)}
.campaign-editor-grid{grid-template-columns:minmax(0,1fr) minmax(240px,300px)}
.campaign-editor-grid .builder-settings{grid-column:auto}
.text-toolbar{display:flex;flex-wrap:wrap;gap:8px;padding:16px;background:var(--engage-surface);border:1px solid var(--engage-control-border);border-radius:var(--engage-radius-control)}
.text-toolbar label{display:flex;align-items:center;gap:8px;font-size:1rem}
.text-toolbar select,.text-toolbar input{min-height:44px;max-width:200px;border:1px solid var(--engage-control-border);border-radius:8px;color:var(--engage-text);background:var(--engage-surface)}
#builder-library{position:relative}#builder-library[open] .section-library{position:absolute;z-index:5;width:280px;background:var(--engage-surface)}
#review-preview iframe{width:100%;height:900px;border:1px solid var(--engage-control-border)}
[hidden]{display:none!important}
@media(max-width:1000px){.campaign-editor-grid{grid-template-columns:minmax(0,1fr)}.campaign-editor-grid .builder-settings{grid-column:auto}}
@container(max-width:1000px){.campaign-editor-grid{grid-template-columns:minmax(0,1fr)}.campaign-editor-grid .builder-settings{grid-column:auto}}
.text-toolbar{position:sticky;top:8px;z-index:4}
#email-preview{height:600px}
#legacy-preview{margin-top:24px}
@media(min-width:1100px){.campaign-editor-grid{grid-template-columns:minmax(0,1fr) 280px}.campaign-editor-grid .builder-settings{grid-column:auto}}
@container(min-width:850px){.campaign-editor-grid{grid-template-columns:minmax(0,1fr) 280px}.campaign-editor-grid .builder-settings{grid-column:auto}}

/* Brand email setup uses the shared Engage typography, status colors and focus tokens. */
.email-setup-status dt { margin-top: 1rem; }
.email-setup-status dd { margin: .25rem 0 1rem; overflow-wrap: anywhere; }

.brand-footer-preview { overflow-wrap: anywhere; }

.brand-setting-safeguards dt { margin-top: 1rem; }
.brand-setting-safeguards dd { margin: .25rem 0 1rem; }
.brand-profile-form .form-check-input { border-color: var(--engage-control-border); }

/* Shared customer page and sandboxed live preview. Accent values are validated server-side. */
.preferences-custom { --preferences-accent: var(--engage-primary); --preferences-button-text: #fff; --preferences-ink: var(--engage-primary); }
.preferences-custom, .preferences-custom * { box-sizing: border-box; }
.preferences-custom [hidden] { display: none !important; }
.preferences-custom.preferences-gray { background: var(--engage-bg); }
.preferences-custom .preferences-shell { overflow-wrap: anywhere; }
.preferences-custom .preferences-intro p, .preferences-custom .preferences-confirmation p { white-space: pre-line; }
.preferences-custom .preferences-arrow, .preferences-custom .preferences-check { color: var(--preferences-ink); }
.preferences-custom .preferences-choice { border-color: var(--preferences-ink); }
.preferences-custom .preferences-choice:hover, .preferences-custom .preferences-choice:focus-visible { border-color: var(--preferences-ink); background: var(--engage-surface-subtle); box-shadow: 0 0 0 1px var(--preferences-ink); }
.preferences-custom .preferences-choice:active { background: var(--engage-surface-subtle); box-shadow: inset 4px 0 var(--preferences-ink); }
.preferences-custom .preferences-unsubscribe { justify-self: stretch; border: 1px solid var(--preferences-ink); border-radius: var(--engage-radius-control); padding: 12px 16px; background: var(--preferences-accent); color: var(--preferences-button-text); text-decoration: none; font-weight: 600; }
.preferences-custom .preferences-unsubscribe:hover { color: var(--preferences-button-text); text-decoration: underline; }
.preferences-custom .preferences-check { border-color: var(--preferences-ink); background: var(--engage-surface); }
.preferences-custom :focus-visible { outline-color: var(--preferences-ink) !important; }
.preferences-custom .preferences-footer a { color: var(--preferences-ink); text-decoration: underline; }
.preferences-footer-links { display: flex; flex-wrap: wrap; justify-content: center; gap: 8px 24px; margin-top: 12px; }
.preferences-example { text-align: center; color: var(--engage-text-secondary); font-size: var(--engage-text-min); margin-bottom: 24px; }
.unsubscribe-editor { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 360px), 1fr)); gap: 24px; align-items: start; }
.unsubscribe-editor > * { min-width: 0; }
.unsubscribe-controls h2:not(:first-child) { margin-top: 32px; }
.unsubscribe-appearance { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; }
.unsubscribe-controls input[type=color] { width: 100%; min-height: 48px; padding: 4px; cursor: pointer; }
.unsubscribe-details { margin: 24px 0; border-block: 1px solid var(--engage-border); padding: 16px 0; }
.unsubscribe-details summary { cursor: pointer; font-weight: 600; min-height: 44px; }
.unsubscribe-details[open] summary { margin-bottom: 16px; }
.unsubscribe-save, .unsubscribe-preview-switch { display: flex; flex-wrap: wrap; gap: 8px; }
.unsubscribe-preview-panel { position: sticky; top: 24px; }
.unsubscribe-preview-toolbar { display: flex; flex-wrap: wrap; gap: 16px; align-items: center; margin-bottom: 16px; }
.unsubscribe-preview-toolbar h2 { margin: 0; }
.unsubscribe-preview-switch .btn[aria-pressed=true] { color: var(--engage-primary-soft-text); background: var(--engage-primary-soft); border-color: var(--engage-primary); box-shadow: inset 0 -2px var(--engage-primary); }
.unsubscribe-preview-canvas { padding: 16px; background: var(--engage-surface-subtle); border: 1px solid var(--engage-border); border-radius: var(--engage-radius-card); }
#unsubscribe-preview { display: block; width: 100%; max-width: 100%; height: 960px; margin: auto; border: 1px solid var(--engage-control-border); border-radius: var(--engage-radius-card); background: var(--engage-surface); }
#unsubscribe-preview.is-mobile { width: 390px; }
@media (max-width: 1200px) { .unsubscribe-editor { grid-template-columns: 1fr; } .unsubscribe-preview-panel { position: static; } }
@media (max-width: 480px) { .unsubscribe-appearance { grid-template-columns: 1fr; gap: 0; } .unsubscribe-preview-canvas { padding: 4px; } }

/* Campaign workspace: each region owns its controls and layout space. */
.campaign-editor-grid{grid-template-columns:200px minmax(0,1fr) 280px}
.campaign-editor-grid .builder-sections,.campaign-editor-grid .builder-settings{grid-column:auto}
#builder-library[open] .section-library{position:static;width:auto;margin-top:12px;padding:8px;grid-template-columns:minmax(0,1fr)}
#builder-library summary{width:100%}
.section-description{display:block;font-size:var(--engage-text-min);font-weight:400;margin-top:4px}
.section-library .btn{display:block;width:100%;padding:12px}
.section-list{list-style:none;padding:0;margin:16px 0 0}
.section-list li>button:first-child{width:100%;text-align:left}
.section-list .section-insert,.section-insert{font-size:var(--engage-text-min);width:100%;margin:8px 0;border:1px dashed var(--engage-control-border);color:var(--engage-text-secondary);background:var(--engage-surface)}
.builder-preview .text-toolbar{position:static;margin:16px 0;gap:8px;padding:12px}
.text-toolbar [data-command=justifyLeft],.text-toolbar [data-command=insertUnorderedList],.text-toolbar [data-command=createLink]{margin-left:8px;border-left:3px solid var(--engage-control-border)}
.builder-settings h3{font-size:1.125rem;margin:8px 0 24px}
.builder-settings textarea{min-height:168px}
.builder-settings input[aria-invalid=true]{border:2px solid var(--engage-danger)}
.builder-settings input[aria-invalid=true]~.form-text{color:var(--engage-danger)}
.builder-settings details{margin-bottom:16px}
.builder-preview .builder-toolbar>div{display:flex;gap:8px;flex-wrap:wrap}
#review-email-preview,#email-preview-fullscreen,#email-preview{width:600px;max-width:none;flex-shrink:0}
#review-email-preview.mobile,#email-preview-fullscreen.mobile,#email-preview.mobile{width:375px}
#review-preview{overflow:auto}
#builder-preview-status:empty{display:none}
.builder-preview-controls{margin-bottom:16px}
.media-picker{width:min(1000px,calc(100% - 32px));max-height:calc(100% - 32px);padding:24px;border:1px solid var(--engage-control-border);border-radius:var(--engage-radius-card);background:var(--engage-surface);color:var(--engage-text)}
.media-picker::backdrop{background:rgb(15 23 42 / 45%)}
.media-picker h2{font-size:1.375rem}.media-picker h3{font-size:1.125rem}
.media-drop{margin-top:16px;padding:16px;border:2px dashed var(--engage-control-border);border-radius:var(--engage-radius-control)}
.media-drop.dragging{background:var(--engage-primary-soft);border-color:var(--engage-primary)}
.media-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,190px),1fr));gap:16px;margin:16px 0}
.media-asset{display:flex;flex-direction:column;text-align:left;gap:8px;min-width:0;padding:12px;border:1px solid var(--engage-control-border);white-space:normal}
.media-asset img{width:100%;height:140px;object-fit:contain;background:var(--engage-surface-subtle)}
.media-asset strong,.media-asset span{font-size:var(--engage-text-min);overflow-wrap:anywhere}
.media-asset[aria-pressed=true]{border:2px solid var(--engage-primary);background:var(--engage-primary-soft);color:var(--engage-primary-soft-text)}
#media-placement{border-top:1px solid var(--engage-border);padding-top:24px}
#media-status{white-space:pre-wrap;overflow-wrap:anywhere}
#navigation-collapse{display:flex;align-items:center;justify-content:center;gap:8px;margin-bottom:16px;flex-shrink:0}
.sidebar .nav-text{width:auto;line-height:1.5;text-align:left}
.navigation-tooltip{position:fixed;left:72px;z-index:100;padding:8px 12px;font-size:var(--engage-text-min);color:var(--engage-text);background:var(--engage-surface);border:1px solid var(--engage-control-border);border-radius:var(--engage-radius-control);box-shadow:var(--engage-shadow)}
@media(min-width:992px){
 .navigation-collapsed .sidebar{width:64px;padding:16px 8px}
 .navigation-collapsed .workspace{margin-left:64px}
 .navigation-collapsed .sidebar .wordmark,.navigation-collapsed .store-label,.navigation-collapsed .nav-label,.navigation-collapsed .sidebar-bottom,.navigation-collapsed .nav-text,.navigation-collapsed .collapse-label{display:none}
 .navigation-collapsed .sidebar .nav-item{padding:12px 8px;justify-content:center}
 .navigation-collapsed #navigation-collapse{min-width:44px;padding:8px}
}
@media(max-width:991px){#navigation-collapse{display:none}.campaign-editor-grid{grid-template-columns:minmax(0,1fr)}}
@container(max-width:1150px){.campaign-editor-grid{grid-template-columns:200px minmax(0,1fr)}.campaign-editor-grid .builder-settings{grid-column:1/-1}}
@container(max-width:800px){.campaign-editor-grid{grid-template-columns:minmax(0,1fr)}.campaign-editor-grid .builder-settings{grid-column:auto}.section-list{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,180px),1fr));gap:8px}}

/* Builder header and setup: scoped to the existing campaign/template editor. */
.builder-heading { margin-bottom: 12px; min-width: 0; }
.builder-heading .back-link { display: inline-flex; align-items: center; min-height: 44px; margin: 0; }
.builder-heading h1 { margin: 0; overflow-wrap: anywhere; }
#email-builder .campaign-stages { gap: 4px; margin: 0 0 12px; padding-bottom: 8px; border-bottom: 1px solid var(--engage-border); }
#email-builder .campaign-stages .btn { border: 2px solid transparent; background: transparent; color: var(--engage-text-secondary); }
#email-builder .campaign-stages .btn:hover { background: var(--engage-surface-subtle); color: var(--engage-text); }
#email-builder .campaign-stages [aria-current=step] { background: var(--engage-primary-soft); color: var(--engage-primary-soft-text); border-bottom-color: var(--engage-primary); }
#email-builder .builder-savebar { gap: 8px 16px; margin-bottom: 12px; }
#email-builder .builder-savebar p { margin: 0; min-width: 0; overflow-wrap: anywhere; color: var(--engage-text-secondary); font-size: var(--engage-text-min); }
#email-builder .builder-savebar > div { display: flex; flex-wrap: wrap; gap: 8px; margin-left: auto; }
#email-builder .builder-setup { padding: 16px; margin-bottom: 16px; }
#email-builder .builder-email-fields { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 16px; }
#email-builder .builder-email-fields .mb-3 { margin-bottom: 0 !important; }
#email-builder .builder-setup-options { display: grid; grid-template-columns: minmax(0,1fr) minmax(0,1fr); gap: 16px; margin-top: 12px; }
#email-builder .builder-setup-options > div { min-width: 0; }
#email-builder .builder-setup-label { display: block; font-size: var(--engage-text-min); font-weight: 600; margin-bottom: 8px; }
#email-builder .builder-sender-summary { display: flex; flex-wrap: wrap; align-items: baseline; gap: 4px 12px; overflow-wrap: anywhere; }
#email-builder .builder-sender-summary > span { min-width: 0; }
#email-builder .builder-sender-summary a { display: inline-flex; align-items: center; min-height: 44px; flex-shrink: 0; }
#email-builder .builder-template-actions { display: flex; align-items: flex-start; gap: 8px; }
#email-builder .builder-template-actions select { flex: 1; min-width: 0; width: 0; }
#email-builder .builder-template-actions button { flex-shrink: 0; }
@container(max-width:700px) {
 #email-builder .builder-email-fields, #email-builder .builder-setup-options { grid-template-columns: minmax(0,1fr); }
}
@media(max-width:575px) {
 #email-builder .builder-email-fields, #email-builder .builder-setup-options { grid-template-columns: minmax(0,1fr); }
 #email-builder .builder-savebar { align-items: flex-start; flex-direction: column; }
 #email-builder .builder-savebar > div { margin-left: 0; }
 #email-builder .campaign-stages .btn { padding-inline: 10px; }
 #email-builder .builder-template-actions { flex-wrap: wrap; }
 #email-builder .builder-template-actions select { flex-basis: 100%; width: 100%; }
}

/* Campaign redesign: scoped application chrome; email rendering remains isolated. */
.campaign-list-heading { display:flex; align-items:center; justify-content:space-between; gap:16px; margin-bottom:24px; }
.campaign-list-heading h1 { margin:0; }
.campaign-list-filters { display:flex; flex-wrap:wrap; align-items:end; gap:12px; padding-bottom:16px; border-bottom:1px solid var(--engage-border); }
.campaign-list-filters label { display:block; margin-bottom:8px; font-size:var(--engage-text-min); font-weight:600; }
.campaign-search { flex:1; min-width:min(100%,240px); }
.campaign-list-count { color:var(--engage-text-secondary); font-size:var(--engage-text-min); margin:16px 0; }
.campaign-table-wrap { background:var(--engage-surface); border-block:1px solid var(--engage-border); }
.campaign-table { margin:0; }
.campaign-table td { padding:20px 16px; vertical-align:middle; }
.campaign-table th { padding:12px 16px; }
.campaign-row-name { display:block; font-weight:600; overflow-wrap:anywhere; min-width:180px; }
.campaign-row-subject { display:block; color:var(--engage-text-secondary); font-size:var(--engage-text-min); margin-top:4px; max-width:440px; overflow-wrap:anywhere; }
.campaign-table td:last-child { text-align:right; }
#email-builder .builder-heading { display:flex; flex-wrap:wrap; align-items:center; gap:8px 16px; min-height:64px; margin:0; padding-bottom:8px; }
#email-builder .builder-heading .back-link { font-size:var(--engage-text-min); }
#email-builder .builder-title { display:flex; flex-wrap:wrap; align-items:center; gap:8px; flex:1; min-width:160px; }
#email-builder .builder-title h1 { font-size:1.125rem; line-height:1.4; }
#email-builder .builder-savebar { display:flex; flex-wrap:wrap; align-items:center; gap:8px 12px; margin:0 0 0 auto; }
#email-builder .builder-savebar > div { margin:0; gap:4px; }
#email-builder .builder-savebar p { max-width:320px; }
#email-builder .campaign-stages { margin:0 0 12px; padding:0 0 4px; gap:4px; }
#email-builder .campaign-stages .btn { padding:8px 12px; }
#email-builder .builder-workspace-bar { display:flex; justify-content:space-between; gap:8px; margin-bottom:8px; }
#email-builder .campaign-editor-grid { display:grid; grid-template-columns:300px minmax(0,1fr); align-items:start; gap:0; border:1px solid var(--engage-border); border-radius:var(--engage-radius-card); overflow:clip; background:var(--engage-surface); }
#email-builder .campaign-editor-grid.tools-hidden { grid-template-columns:minmax(0,1fr); }
#email-builder .builder-tools { min-width:0; max-height:calc(100vh - 200px); overflow:auto; border-right:1px solid var(--engage-border); padding:12px; }
#email-builder .builder-tool-modes { display:flex; gap:0; margin-bottom:16px; border-bottom:1px solid var(--engage-border); }
#email-builder .builder-tool-modes .btn { padding:8px; flex:1; background:transparent; border:0; border-radius:0; font-size:var(--engage-text-min); }
#email-builder .builder-tool-modes [aria-pressed=true] { color:var(--engage-primary-soft-text); background:var(--engage-primary-soft); box-shadow:inset 0 -2px var(--engage-primary); }
#email-builder .builder-sections, #email-builder .builder-settings, #email-builder .builder-preview { padding:0; margin:0; border:0; box-shadow:none; border-radius:0; min-width:0; grid-column:auto; }
#email-builder .builder-tools h2 { font-size:1.125rem; margin:0 0 12px; }
#email-builder #back-to-sections { margin-bottom:16px; }
#email-builder #builder-library[open] .section-library { border:0; box-shadow:none; padding:0; margin:8px 0; gap:4px; }
#email-builder .section-library .btn { padding:12px; text-align:left; background:transparent; border:1px solid var(--engage-border); }
#email-builder .section-description { display:none; }
#email-builder .section-library svg { width:20px; height:20px; }
#email-builder .section-list { display:block; margin:8px 0; }
#email-builder .section-list li { margin:0; }
#email-builder .section-list li > button:first-child { border:1px solid transparent; background:transparent; padding:8px 12px; white-space:normal; overflow-wrap:anywhere; }
#email-builder .section-list li > button[aria-pressed=true] { border-left:3px solid var(--engage-primary); background:var(--engage-primary-soft); color:var(--engage-primary-soft-text); }
#email-builder .section-list .section-insert { border:0; margin:0; height:12px; min-height:12px; padding:0; font-size:var(--engage-text-min); color:transparent; background:transparent; overflow:hidden; }
#email-builder .section-list li:hover .section-insert, #email-builder .section-list .section-insert:focus-visible { min-height:44px; height:auto; padding:8px; color:var(--engage-primary); background:var(--engage-primary-soft); }
@media(hover:none) { #email-builder .section-list .section-insert { min-height:44px; height:auto; color:var(--engage-text-secondary); } }
#email-builder #insert-first { border:1px solid var(--engage-control-border); margin:0; }
#email-builder .section-actions { border-top:1px solid var(--engage-border); padding-top:16px; }
#email-builder .section-actions .btn { flex:1 1 44%; font-size:var(--engage-text-min); }
#email-builder .builder-preview { background:var(--engage-surface-subtle); }
#email-builder .builder-preview > .builder-toolbar { display:flex; flex-wrap:wrap; padding:8px 12px; gap:8px; margin:0; background:var(--engage-surface); border-bottom:1px solid var(--engage-border); }
#email-builder .builder-preview h2 { font-size:1rem; margin:0; }
#email-builder .builder-preview .builder-toolbar > div { gap:4px; }
#email-builder .builder-preview .builder-toolbar .btn { font-size:var(--engage-text-min); padding:8px; }
#email-builder .builder-preview .preview-scroll { padding:16px; height:calc(400vh - 288px); min-height:420px; max-height:3000px; background:var(--engage-surface-subtle); }
#email-builder #email-preview { display:block; margin:auto; height:100%; min-height:600px; border:1px solid var(--engage-border); box-shadow:var(--engage-shadow); }
#email-builder #builder-preview-status:not(:empty) { padding:8px 12px; margin:0; background:var(--engage-surface); }
#email-builder .builder-preview .text-toolbar { display:flex; flex-wrap:nowrap; align-items:center; gap:4px; padding:8px; margin:0; border:0; border-radius:0; border-bottom:1px solid var(--engage-border); overflow:auto; }
#email-builder .text-toolbar > * { flex-shrink:0; }
#email-builder .text-toolbar label { font-size:var(--engage-text-min); gap:4px; }
#email-builder .text-toolbar select { max-width:112px; }
#email-builder .text-toolbar [data-command=bold] { font-weight:bold; }
#email-builder .text-toolbar [data-command=italic] { font-style:italic; }
#email-builder .text-toolbar [data-command=underline] { text-decoration:underline; }
#email-builder .text-toolbar [data-command] { margin:0; border-width:1px; font-size:var(--engage-text-min); }
#email-builder .format-more[open] { flex-basis:260px; }
#email-builder .format-more > div { display:flex; flex-wrap:wrap; gap:4px; padding-top:8px; }
#email-builder .campaign-setup-layout, #email-builder .campaign-review-layout, .campaign-confirm-layout { display:grid; grid-template-columns:minmax(0,3fr) minmax(0,2fr); gap:24px; align-items:start; }
#email-builder .campaign-checklist, #email-builder .review-checklist { min-width:0; }
#email-builder .setup-item-row { border-top:1px solid var(--engage-border); padding:0; }
#email-builder .setup-item-row > summary { display:flex; justify-content:space-between; align-items:center; gap:16px; padding:16px 0; list-style:none; min-height:64px; }
#email-builder .setup-item-row > summary::-webkit-details-marker { display:none; }
#email-builder .setup-item-row summary > span:first-child { min-width:0; }
#email-builder .setup-item-row summary strong, #email-builder .setup-item-row summary span span { display:block; overflow-wrap:anywhere; }
#email-builder .setup-item-row summary span span { font-size:var(--engage-text-min); color:var(--engage-text-secondary); margin-top:4px; }
#email-builder .setup-edit { color:var(--engage-primary); flex-shrink:0; text-decoration:underline; }
#email-builder .setup-item-row[open] { padding-bottom:16px; }
#email-builder .setup-item-row[open] .setup-edit { color:var(--engage-text-secondary); }
#email-builder .setup-item-row fieldset { min-width:0; }
#email-builder .builder-meta, #email-builder .builder-email-fields { grid-template-columns:minmax(0,1fr); }
#email-builder .setup-content-row, #email-builder .review-summary-row { display:flex; flex-wrap:wrap; justify-content:space-between; gap:8px; padding:16px 0; border-top:1px solid var(--engage-border); }
#email-builder .setup-content-row p { font-size:var(--engage-text-min); color:var(--engage-text-secondary); margin:4px 0 0; }
#email-builder .setup-preview { min-width:0; padding:16px; }
#email-builder .setup-preview > summary { font-weight:600; }
#email-builder .setup-preview .preview-scroll { margin-top:12px; }
#email-builder #details-email-preview { display:block; border:1px solid var(--engage-border); width:100%; height:640px; background:var(--engage-surface); }
#email-builder .review-summary-row { align-items:center; }
#email-builder .review-summary-row span { flex:1; min-width:120px; overflow-wrap:anywhere; color:var(--engage-text-secondary); }
#email-builder .review-preview-panel { padding:16px; min-width:0; }
#email-builder .review-preview-panel h2 { font-size:1.125rem; }
#email-builder #review-preview { background:var(--engage-surface-subtle); }
#email-builder #review-preview h3 { font-size:1rem; margin:12px; }
#email-builder #review-email-preview { display:block; height:720px; margin:auto; border:1px solid var(--engage-border); }
#email-builder .review-next { grid-column:1/-1; }
.campaign-confirm-layout .panel { min-width:0; }
.campaign-confirm-layout .review-email { height:740px; border:1px solid var(--engage-border); }
.campaign-confirm-layout details { border-top:1px solid var(--engage-border); padding:16px 0; }
.campaign-confirm-layout summary { font-weight:600; min-height:44px; }
@media(max-width:1100px) {
 #email-builder .campaign-editor-grid { grid-template-columns:minmax(0,1fr); }
 #email-builder .builder-tools { max-height:420px; border-right:0; border-bottom:1px solid var(--engage-border); }
 #email-builder .builder-tool-modes { justify-content:flex-start; }
 #email-builder .builder-tool-modes .btn { flex:0 1 auto; padding-inline:16px; }
 #email-builder .campaign-setup-layout, #email-builder .campaign-review-layout, .campaign-confirm-layout { grid-template-columns:minmax(0,1fr); }
 #email-builder .builder-preview .preview-scroll { height:640px; }
}
@media(max-width:600px) {
 .campaign-list-heading { align-items:flex-start; flex-wrap:wrap; }
 .campaign-list-filters > div { flex:1 1 100%; }
 #email-builder .builder-heading { align-items:flex-start; gap:4px 12px; }
 #email-builder .builder-title { flex-basis:60%; }
 #email-builder .builder-savebar { width:100%; margin:4px 0 8px; flex-direction:row; }
 #email-builder .builder-savebar > div { margin-left:auto; }
 #email-builder .builder-preview > .builder-toolbar { padding:8px; }
 #email-builder .builder-preview > .builder-toolbar h2 { flex-basis:100%; }
 #email-builder .builder-preview .preview-scroll { padding:8px; }
 #email-builder .builder-template-actions { flex-wrap:wrap; }
 #email-builder .builder-template-actions select { flex-basis:100%; width:100%; }
}
#email-builder .format-more[open] { display:flex; align-items:center; flex-basis:auto; gap:8px; }
#email-builder .format-more > div { flex-wrap:nowrap; padding:0; }
#email-builder .format-more > div > * { flex-shrink:0; }
#email-builder .campaign-stages { align-items:center; }
#email-builder .campaign-stages .builder-workspace-bar { margin:0 0 0 auto; gap:4px; }
#email-builder .campaign-stages .builder-workspace-bar .btn { border:1px solid var(--engage-control-border); }
.campaign-table-wrap .table-responsive { position:relative; max-width:100%; }

/* New-brand email setup follows the shared type, color and control tokens. */
.email-setup .dns-value { display: block; overflow-wrap: anywhere; margin-bottom: .5rem; }
.email-setup td { min-width: 10rem; vertical-align: top; }
.email-setup details > summary { cursor: pointer; padding: .75rem 0; font-size: var(--engage-text-base); }

/* Verification uses the shared type, color and focus tokens. */
.email-verification { min-width: 0; overflow-wrap: anywhere; }
.email-verification details > summary { cursor: pointer; padding: .75rem 0; font-size: var(--engage-text-base); }
.email-verification .btn { white-space: normal; }

.email-resubscribe { overflow-wrap: anywhere; }
.email-resubscribe .form-check-input { border-color: var(--engage-control-border); }
.email-resubscribe .form-check-input:checked { background-color: var(--engage-primary); border-color: var(--engage-primary); }

/* Channel activation and final campaign approval reuse the shared accessible controls. */
.channel-sending-controls .form-check, .campaign-confirm-page .form-check { min-height:44px; cursor:pointer; }
.channel-sending-controls .form-check-input, .campaign-confirm-page .form-check-input { border-color:var(--engage-control-border); }
.channel-sending-controls .form-check-input:checked, .campaign-confirm-page .form-check-input:checked { background-color:var(--engage-primary); border-color:var(--engage-primary); }
.channel-sending-controls .form-check-input:focus, .campaign-confirm-page .form-check-input:focus { border-color:var(--engage-primary); box-shadow:none; }

/* Campaign Send reuses the existing guarded messaging forms. */
.campaign-send { max-width:960px; }
.campaign-send-summary { display:grid; grid-template-columns:120px minmax(0,1fr); gap:8px 16px; margin-bottom:12px; }
.campaign-send-summary dd { margin:0; overflow-wrap:anywhere; }
.campaign-send > .btn { margin-top:16px; }
#email-builder .review-next { display:flex; flex-wrap:wrap; gap:8px; }
@media(max-width:480px) { .campaign-send-summary { grid-template-columns:minmax(0,1fr); gap:4px; } .campaign-send-summary dd { margin-bottom:8px; } }

.campaign-send .send-readiness > summary, .campaign-send .send-test > summary, .campaign-send .send-report > summary { font-weight:600; padding-block:8px; min-height:44px; }
.campaign-send .send-report { margin-top:16px; }
.campaign-send .send-readiness[open] > summary { margin-bottom:8px; }
.campaign-actions { display:inline-block; vertical-align:top; text-align:left; margin-left:8px; }
.campaign-actions > summary { min-height:44px; }
.campaign-actions > form, .campaign-actions > div { margin:8px 0 0; padding:8px; background:var(--engage-surface); border:1px solid var(--engage-border); border-radius:var(--engage-radius-control); }
.campaign-actions .btn { font-size:var(--engage-text-base); white-space:nowrap; }
.campaign-actions .form-text { margin:8px 0 0; }

/* Campaign editing keeps workspace navigation available on small screens. */
.topbar.campaign-navigation { display: none; }
@media (max-width: 991px) {
  .topbar.campaign-navigation { display: flex; min-height: 0; }
}

/* Campaign reports share Engage tokens and retain readable text at every width. */
.campaign-statistics { min-width: 0; }
.report-summary { display: grid; grid-template-columns: minmax(150px, 1fr) 3fr; gap: 12px 24px; }
.report-summary dd { margin: 0; overflow-wrap: anywhere; }
.report-metrics .stat-card { min-width: 0; }
.report-metrics .stat-card strong { overflow-wrap: anywhere; }
.metric-definition { margin-top: 12px; font-size: var(--engage-text-min); color: var(--engage-text-secondary); }
.metric-definition summary { cursor: pointer; padding: 8px 0; }
.metric-definition p { margin-top: 8px; }
.report-filters { display: flex; flex-wrap: wrap; gap: 16px; align-items: end; margin: 24px 0; }
.report-filters > div { flex: 1 1 180px; min-width: 0; }
.report-filters label { display: block; margin-bottom: 8px; }
.report-links td:first-child { overflow-wrap: anywhere; min-width: 180px; max-width: 650px; }
.engagement-chart { display: grid; gap: 16px; max-height: 420px; overflow: auto; margin-bottom: 24px; }
.engagement-day { display: grid; gap: 8px; }
.engagement-day > div { position: relative; padding: 8px; background: var(--engage-surface-subtle); }
.engagement-day > div > span:last-child { position: relative; display: block; background: var(--engage-surface); width: fit-content; padding: 0 8px; }
@media (max-width: 600px) { .report-summary { grid-template-columns: 1fr; gap: 8px; } .report-summary dd { margin-bottom: 12px; } }
.engagement-day meter { display: block; width: 100%; height: 20px; }
.engagement-day meter::-webkit-meter-bar { background: var(--engage-surface-subtle); border: 1px solid var(--engage-control-border); }
.engagement-day .report-open::-webkit-meter-optimum-value { background: var(--engage-primary); }
.engagement-day .report-click::-webkit-meter-optimum-value { background: var(--engage-info); }
.engagement-day .report-open::-moz-meter-bar { background: var(--engage-primary); }
.engagement-day .report-click::-moz-meter-bar { background: var(--engage-info); }

/* Campaign performance: story first, supporting detail on demand. */
.report-navigation, .report-heading { display: flex; align-items: center; justify-content: space-between; gap: 16px; flex-wrap: wrap; }
.report-navigation { margin-bottom: 24px; }
.report-eyebrow { color: var(--engage-primary-soft-text); font-size: var(--engage-text-min); font-weight: 600; }
.report-overview { border-top: 4px solid var(--engage-primary); box-shadow: none; }
.report-overview h1 { margin: 12px 0 8px; }
.report-subject { margin-bottom: 8px; }
.report-send-date, .report-note { color: var(--engage-text-secondary); font-size: var(--engage-text-min); }
.report-send-date { margin-bottom: 24px; }
.report-headline { display: flex; align-items: center; gap: 16px; border-top: 1px solid var(--engage-border); padding-top: 24px; }
.report-headline h2 { margin: 0 0 4px; }
.report-headline p { margin: 0; color: var(--engage-text-secondary); }
.report-headline-icon, .report-kpi-icon { display: inline-flex; align-items: center; justify-content: center; flex-shrink: 0; width: 40px; height: 40px; border-radius: 12px; color: var(--engage-primary-soft-text); background: var(--engage-primary-soft); font-size: 24px; }
.report-primary { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: 16px; margin-top: 24px; }
.report-kpi { min-width: 0; padding: 24px; border: 1px solid var(--engage-border); border-radius: var(--engage-radius-card); background: var(--engage-surface); transition: border-color .18s ease, box-shadow .18s ease; }
.report-kpi:hover { border-color: var(--engage-primary); box-shadow: var(--engage-shadow); }
.report-kpi-label { display: flex; flex-wrap: wrap; overflow-wrap: anywhere; gap: 8px; align-items: center; justify-content: space-between; font-weight: 500; }
.report-kpi strong, .report-stages strong { display: block; font-size: var(--engage-text-metric); font-weight: 600; line-height: 1.2; margin: 16px 0 8px; overflow-wrap: anywhere; }
.report-kpi strong.report-unavailable, .report-stages strong.report-unavailable { font-size: var(--engage-text-card); line-height: 1.5; color: var(--engage-text-secondary); }
.report-kpi p { margin: 0; font-size: var(--engage-text-min); color: var(--engage-text-secondary); }
.report-disclosure { padding: 16px 0; border-bottom: 1px solid var(--engage-border); }
.report-disclosure summary { cursor: pointer; font-weight: 500; width: fit-content; min-height: 44px; padding: 10px 0; }
.report-disclosure summary span { color: var(--engage-text-secondary); font-weight: 400; font-size: var(--engage-text-min); margin-left: 12px; }
.report-disclosure summary:hover { color: var(--engage-primary); }
.report-disclosure p, .report-definitions { max-width: 85ch; margin-top: 16px; }
.report-secondary { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 16px; margin: 16px 0; }
.report-secondary > div { padding: 16px; background: var(--engage-surface-subtle); border-radius: var(--engage-radius-control); }
.report-secondary dt { font-weight: 400; color: var(--engage-text-secondary); }
.report-secondary dd { font-weight: 600; font-size: var(--engage-text-card); margin: 4px 0 0; }
.report-journey, .report-detail-grid, .report-top-links { margin-top: 24px; }
.report-journey, .report-detail-grid .panel, .report-top-links, .campaign-statistics #recipient-activity { box-shadow: none; }
.report-stages { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); list-style: none; margin: 24px 0; padding: 0; gap: 24px; }
.report-stages li { position: relative; border-top: 3px solid var(--engage-control-border); padding-top: 16px; min-width: 0; }
.report-stages li.has-activity { border-color: var(--engage-primary); }
.report-stages li:not(:last-child)::after { content: ''; position: absolute; right: -17px; top: -6px; width: 9px; height: 9px; border-top: 2px solid var(--engage-control-border); border-right: 2px solid var(--engage-control-border); transform: rotate(45deg); }
.report-stage-label { font-weight: 600; }
.report-stages li > span:last-child { font-size: var(--engage-text-min); color: var(--engage-text-secondary); }
.report-journey > p { margin-bottom: 0; }
.report-detail-grid { display: grid; grid-template-columns: minmax(0,1.4fr) minmax(0,1fr); gap: 24px; align-items: start; }
.report-takeaway { background: var(--engage-primary-soft); border-color: var(--engage-primary-soft); }
.report-takeaway h2 { margin-top: 12px; }
.report-takeaway ul { margin: 16px 0 0; padding-left: 20px; }
.report-takeaway li + li { margin-top: 12px; }
.report-activity-list { list-style: none; padding: 0; margin: 24px 0; }
.report-activity-list li { position: relative; padding: 0 0 24px 24px; border-left: 2px solid var(--engage-border); margin-left: 5px; }
.report-activity-list li::before { content: ''; position: absolute; left: -6px; top: 7px; width: 10px; height: 10px; border-radius: 50%; background: var(--engage-primary); }
.report-activity-list li:last-child { padding-bottom: 0; border-color: transparent; }
.report-activity-list time { display: block; font-size: var(--engage-text-min); color: var(--engage-text-secondary); margin-top: 4px; }
.report-activity-totals { display: flex; flex-wrap: wrap; gap: 16px; margin: 24px 0; }
.report-activity-totals span { font-size: var(--engage-text-min); }
.report-empty { display: flex; gap: 16px; align-items: center; padding: 16px 0 0; }
.report-empty p { margin: 0; max-width: 75ch; color: var(--engage-text-secondary); }
.report-links meter { display: block; width: 100%; max-width: 320px; height: 12px; margin-top: 8px; accent-color: var(--engage-primary); }
.report-links meter::-webkit-meter-bar { background: var(--engage-surface-subtle); border: none; }
.report-links meter::-webkit-meter-optimum-value { background: var(--engage-primary); }
.report-links meter::-moz-meter-bar { background: var(--engage-primary); }
.report-recipient-status { display: inline-flex; padding: 4px 8px; border-radius: var(--engage-radius-control); background: var(--engage-surface-subtle); font-size: var(--engage-text-min); color: var(--engage-text-secondary); font-weight: 500; }
.report-recipient-status.is-delivered { background: var(--engage-success-bg); color: var(--engage-success); }
.report-recipient-status.is-failed { background: var(--engage-warning-bg); color: var(--engage-warning); }
.report-recipient-detail { display: block; font-size: var(--engage-text-min); color: var(--engage-text-secondary); margin-top: 4px; }
.campaign-statistics #recipient-activity td { vertical-align: top; }
.campaign-statistics #recipient-activity tbody tr:hover { background: var(--engage-bg); }
.report-definitions dd { color: var(--engage-text-secondary); margin: 4px 0 16px; }
@media (max-width: 1200px) { .report-primary { grid-template-columns: repeat(2,minmax(0,1fr)); } }
@media (max-width: 800px) { .report-detail-grid { grid-template-columns: minmax(0,1fr); } .report-secondary { grid-template-columns: repeat(2,minmax(0,1fr)); } }
@media (max-width: 600px) {
 .report-kpi { padding: 16px; }
 .report-kpi-label { flex-wrap: wrap; }
 .report-kpi-icon { width: 32px; height: 32px; font-size: 20px; }
 .report-stages { grid-template-columns: repeat(2,minmax(0,1fr)); gap: 24px; }
 .report-stages li:nth-child(2)::after { content: none; }
 .report-disclosure summary span { display: block; margin-left: 20px; }
 .report-headline { align-items: flex-start; }
}
@media (max-width: 359px) { .report-primary, .report-secondary { grid-template-columns: minmax(0,1fr); } }
@media (prefers-reduced-motion: reduce) { .report-kpi { transition: none; } }

.campaign-statistics #recipient-activity table { min-width: 960px; }
.report-scroll-hint { display: none; }
@media (max-width: 1200px) { .report-scroll-hint { display: block; } }

/* Engage Pulse: shared typography, palette and accessible controls. */
.pulse-template-grid {
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:24px;
  margin:24px 0
}
.pulse-template {
  display:flex;
  flex-direction:column;
  gap:12px;
  text-align:left;
  padding:24px;
  background:var(--engage-surface);
  border:1px solid var(--engage-control-border);
  border-radius:var(--engage-radius-card);
  color:var(--engage-text);
  min-height:190px
}
.pulse-template>span:first-child {
  font-size:2rem
}
.pulse-template>strong {
  font-size:1.125rem
}
.pulse-template:hover,.pulse-template:focus-visible {
  background:var(--engage-primary-soft);
  border-color:var(--engage-primary)
}
.pulse-template>span:last-child {
  color:var(--engage-text-secondary)
}
.pulse-steps {
  display:flex;
  gap:12px;
  flex-wrap:wrap;
  margin-bottom:32px
}
.pulse-steps [aria-current=step] {
  background:var(--engage-primary-soft);
  color:var(--engage-primary-soft-text);
  border:1px solid var(--engage-primary);
  font-weight:600
}
.pulse-empty {
  text-align:center;
  padding:48px 24px
}
.pulse-empty>p,.pulse-share>p {
  color:var(--engage-text-secondary)
}
.pulse-symbol {
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:64px;
  height:64px;
  background:var(--engage-primary-soft);
  color:var(--engage-primary-soft-text);
  border-radius:20px;
  font-size:2rem;
  margin:0 0 24px
}
.pulse-symbol svg {
  width:32px;
  height:32px
}
.pulse-example {
  max-width:580px;
  margin:32px auto;
  background:var(--engage-bg);
  border-radius:12px;
  padding:24px;
  text-align:left
}
.pulse-example h3 {
  font-size:1.25rem;
  margin:12px 0 24px
}
.pulse-example-choices {
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:12px
}
.pulse-example-choices>span {
  background:var(--engage-surface);
  border:1px solid var(--engage-border);
  border-radius:8px;
  padding:16px
}
.pulse-demo-link {
  display:block;
  margin-top:20px
}
.pulse-list-heading,.pulse-list-metrics,.pulse-preview-label {
  display:flex;
  gap:12px
}
.pulse-list-heading {
  justify-content:space-between;
  align-items:center
}
.pulse-list-heading h2 {
  font-size:1.375rem;
  margin:12px 0
}
.pulse-list-metrics {
  flex-direction:column;
  color:var(--engage-text-secondary)
}
.pulse-actions {
  display:flex;
  gap:8px;
  flex-wrap:wrap;
  align-items:center
}
.pulse-actions form {
  margin:0
}
.pulse-survey-list {
  display:grid;
  gap:16px
}
.pulse-editor-grid {
  display:grid;
  grid-template-columns:minmax(0,1fr) minmax(0,.95fr);
  gap:32px;
  align-items:start
}
.pulse-editor-grid .panel {
  margin-bottom:24px
}
.pulse-preview-column {
  position:sticky;
  top:24px;
  min-width:0
}
.pulse-preview-label {
  justify-content:space-between;
  flex-wrap:wrap;
  margin-bottom:16px;
  color:var(--engage-text-secondary);
  font-size:var(--engage-text-min)
}
.pulse-preview-card {
  padding:32px;
  border:1px solid var(--engage-border);
  border-radius:20px;
  background:var(--engage-surface);
  box-shadow:var(--engage-shadow);
  overflow-wrap:anywhere
}
.pulse-preview-logo {
  display:block;
  max-width:180px;
  max-height:60px;
  object-fit:contain;
  margin-bottom:24px
}
.pulse-preview-card h2 {
  font-size:1.5rem;
  margin:20px 0
}
.pulse-preview-card h3 {
  font-size:1.25rem;
  margin-bottom:24px
}
.pulse-preview-card.pulse-style-soft {
  background:var(--engage-primary-soft)
}
.pulse-preview-card.pulse-style-bold {
  border:3px solid var(--engage-primary)
}
.pulse-required {
  display:flex;
  gap:12px;
  align-items:center;
  margin:16px 0
}
.pulse-required input {
  width:22px;
  height:22px;
  accent-color:var(--engage-primary)
}
.pulse-choice-editor {
  padding:16px;
  background:var(--engage-bg);
  border-radius:12px;
  margin-bottom:16px
}
.pulse-save-bar {
  display:flex;
  gap:12px;
  align-items:center;
  flex-wrap:wrap;
  margin:32px 0
}
.pulse-save-bar>span {
  margin-right:auto;
  color:var(--engage-text-secondary);
  font-size:var(--engage-text-min)
}
.pulse-share {
  max-width:800px;
  margin:0 auto;
  text-align:center;
  padding:32px
}
.pulse-share .form-label {
  display:block;
  text-align:left
}
.pulse-share>h3 {
  margin-top:32px
}
.pulse-share>#pulse-publish {
  display:block;
  margin:24px auto
}
.pulse-copy-row {
  display:flex;
  gap:8px;
  margin-bottom:16px
}
.pulse-copy-row input {
  min-width:0
}
.pulse-result-filter {
  display:flex;
  flex-wrap:wrap;
  gap:12px;
  align-items:center;
  margin-bottom:24px
}
.pulse-result-filter select {
  width:auto;
  max-width:100%
}
.pulse-results-metrics {
  grid-template-columns:repeat(3,minmax(0,1fr))
}
.pulse-result-question,.pulse-takeaways {
  margin-top:24px
}
.pulse-result-question h2 {
  margin:12px 0 24px
}
.pulse-result-bar {
  margin:24px 0
}
.pulse-result-bar>div {
  display:flex;
  justify-content:space-between;
  gap:12px;
  flex-wrap:wrap;
  margin-bottom:8px
}
.pulse-result-bar progress,.pulse-progress progress {
  display:block;
  width:100%;
  height:12px;
  appearance:none;
  border:0;
  background:var(--engage-surface-subtle);
  border-radius:8px;
  overflow:hidden
}
.pulse-result-bar progress::-webkit-progress-bar,.pulse-progress progress::-webkit-progress-bar {
  background:var(--engage-surface-subtle)
}
.pulse-result-bar progress::-webkit-progress-value,.pulse-progress progress::-webkit-progress-value {
  background:var(--engage-primary);
  border-radius:8px
}
.pulse-result-bar progress::-moz-progress-bar,.pulse-progress progress::-moz-progress-bar {
  background:var(--engage-primary)
}
.pulse-result-bar details {
  margin-top:12px
}
.pulse-result-bar summary {
  color:var(--engage-primary);
  cursor:pointer;
  min-height:44px
}
.pulse-result-bar details form {
  padding:16px;
  border:1px solid var(--engage-border);
  border-radius:12px
}
.pulse-average strong {
  font-size:2rem
}
.pulse-written blockquote {
  padding:24px;
  background:var(--engage-bg);
  border-radius:12px;
  overflow-wrap:anywhere
}
.pulse-written blockquote footer {
  color:var(--engage-text-secondary);
  font-size:var(--engage-text-min)
}
.pulse-takeaways {
  background:var(--engage-primary-soft);
  color:var(--engage-primary-soft-text)
}
.pulse-public-wrap {
  max-width:720px;
  margin:0 auto;
  padding:32px 24px
}
.pulse-public-brand {
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:24px;
  margin-bottom:32px
}
.pulse-public-brand img {
  max-width:180px;
  max-height:64px;
  object-fit:contain
}
.pulse-public-brand span,.pulse-public-footer {
  color:var(--engage-text-secondary);
  font-size:var(--engage-text-min)
}
.pulse-public-card {
  background:var(--engage-surface);
  padding:40px;
  border:1px solid var(--engage-border);
  border-radius:24px;
  box-shadow:var(--engage-shadow);
  overflow-wrap:anywhere
}
.pulse-public-card h1 {
  font-size:1.875rem;
  font-weight:600;
  line-height:1.3;
  margin:16px 0 24px
}
.pulse-style-soft.pulse-public {
  background:var(--engage-primary-soft)
}
.pulse-style-bold .pulse-public-card {
  border-top:6px solid var(--engage-primary)
}
.pulse-eyebrow {
  font-size:var(--engage-text-min);
  font-weight:600;
  color:var(--engage-primary-soft-text)
}
.pulse-public-footer {
  text-align:center;
  margin:24px 0
}
.pulse-preview-notice {
  background:var(--engage-surface);
  padding:12px 16px;
  border:1px solid var(--engage-control-border);
  border-radius:8px;
  margin-bottom:16px;
  font-size:var(--engage-text-min)
}
.pulse-progress {
  margin:24px 0
}
.pulse-progress>span {
  display:block;
  color:var(--engage-text-secondary);
  font-size:var(--engage-text-min);
  margin-bottom:8px
}
.pulse-question {
  border:0;
  margin:0;
  padding:0;
  min-width:0
}
.pulse-question legend {
  float:none;
  font-size:1.375rem;
  line-height:1.4;
  font-weight:600;
  margin-bottom:24px
}
.pulse-answer-grid {
  display:grid;
  grid-template-columns:1fr;
  gap:12px
}
.pulse-answer,.pulse-preview-answer {
  display:flex;
  position:relative;
  align-items:center;
  gap:12px;
  min-height:60px;
  border:1px solid var(--engage-control-border);
  border-radius:12px;
  padding:16px;
  background:var(--engage-surface);
  color:var(--engage-text);
  cursor:pointer;
  overflow-wrap:anywhere;
  text-align:left
}
.pulse-answer input {
  appearance:none;
  width:22px;
  height:22px;
  flex-shrink:0;
  border:1px solid var(--engage-control-border);
  border-radius:50%;
  margin:0
}
.pulse-answer input:checked {
  border:6px solid var(--engage-primary)
}
.pulse-answer:has(input:checked),.pulse-preview-answer[aria-pressed=true] {
  border:2px solid var(--engage-primary);
  padding:15px;
  background:var(--engage-primary-soft);
  color:var(--engage-primary-soft-text)
}
.pulse-answer:focus-within {
  outline:3px solid var(--engage-focus);
  outline-offset:3px
}
.pulse-answer-check {
  margin-left:auto;
  visibility:hidden
}
.pulse-answer:has(input:checked) .pulse-answer-check {
  visibility:visible
}
.pulse-answer img,.pulse-preview-answer img {
  width:80px;
  height:80px;
  object-fit:cover;
  border-radius:8px
}
.pulse-rating-grid {
  grid-template-columns:repeat(4,minmax(0,1fr))
}
.pulse-rating-grid .pulse-answer {
  justify-content:center;
  padding:16px 8px;
  min-width:0
}
.pulse-rating-grid .pulse-answer input {
  position:absolute;
  opacity:0
}
.pulse-rating-grid .pulse-answer-check {
  display:none
}
.pulse-rating-key {
  display:flex;
  justify-content:space-between;
  gap:16px;
  font-size:var(--engage-text-min);
  color:var(--engage-text-secondary);
  margin-top:12px
}
.pulse-question-image {
  display:block;
  max-width:100%;
  max-height:240px;
  object-fit:contain;
  margin:0 auto 24px;
  border-radius:12px
}
.pulse-response-controls {
  display:flex;
  justify-content:space-between;
  gap:16px;
  flex-wrap:wrap;
  margin-top:32px
}
.pulse-start {
  margin:8px 0 24px
}
.pulse-thanks {
  text-align:center;
  padding:24px 0
}
.pulse-trap {
  position:absolute;
  left:-10000px;
  width:1px;
  height:1px;
  overflow:hidden
}
#pulse-tags-dialog {
  width:min(560px,calc(100% - 32px));
  border:1px solid var(--engage-control-border);
  border-radius:12px;
  padding:24px
}
#pulse-tags-dialog::backdrop {
  background:rgb(15 23 42 / 40%)
}
@media(prefers-reduced-motion:no-preference) {
  .pulse-answer,.pulse-preview-answer {
    transition:background-color .15s,border-color .15s
  }
  .pulse-question {
    animation:pulse-appear .18s ease-out
  }
  @keyframes pulse-appear {
    from {
      opacity:.5;
      translate:0 4px
    }
    to {
      opacity:1;
      translate:0 0
    }
  }
}
@media(max-width:1100px) {
  .pulse-editor-grid {
    grid-template-columns:1fr
  }
  .pulse-preview-column {
    position:static;
    max-width:640px;
    width:100%;
    margin:0 auto
  }
  .pulse-template-grid {
    grid-template-columns:repeat(2,minmax(0,1fr))
  }
}
@media(max-width:600px) {
  .pulse-template-grid {
    grid-template-columns:1fr;
    gap:16px
  }
  .pulse-template {
    min-height:160px;
    padding:20px
  }
  .pulse-example-choices {
    grid-template-columns:1fr
  }
  .pulse-empty {
    padding:32px 16px
  }
  .pulse-preview-card,.pulse-share {
    padding:24px 16px
  }
  .pulse-list-heading {
    align-items:flex-start;
    flex-direction:column;
    margin-bottom:16px
  }
  .pulse-results-metrics {
    grid-template-columns:1fr
  }
  .pulse-public-wrap {
    padding:24px 16px
  }
  .pulse-public-card {
    padding:24px 16px;
    border-radius:16px
  }
  .pulse-public-card h1 {
    font-size:1.625rem
  }
  .pulse-public-brand {
    flex-wrap:wrap;
    margin-bottom:24px
  }
  .pulse-copy-row {
    flex-direction:column
  }
  .pulse-save-bar>.btn {
    flex:1
  }
  .pulse-steps>.btn {
    width:100%;
    text-align:left
  }
}
.pulse-actions [aria-pressed=true] {
  background:var(--engage-primary-soft);
  color:var(--engage-primary-soft-text);
  border:1px solid var(--engage-primary)
}
.pulse-welcome-settings summary,.pulse-support-settings summary,.pulse-choice-tags summary {
  min-height:44px;
  cursor:pointer;
  color:var(--engage-primary-soft-text);
  padding:8px 0
}
.pulse-support-settings {
  margin:16px 0
}
.pulse-choice-main {
  display:flex;
  align-items:flex-end;
  gap:12px
}
.pulse-choice-main>.mb-3 {
  flex:1;
  min-width:0;
  margin-bottom:0!important
}
.pulse-choice-main>.btn {
  flex-shrink:0
}
.pulse-choice-tags {
  font-size:var(--engage-text-min);
  overflow-wrap:anywhere
}
.pulse-choice-tags .form-select {
  font-size:var(--engage-text-base)
}
