:root {
  color-scheme: light;
  --ink: #1d3345;
  --muted: #647b89;
  --rail: #18364a;
  --rail-soft: #a9bfca;
  --surface: #ffffff;
  --canvas: #eaf1f4;
  --line: #d7e2e8;
  --accent: #147b76;
  --accent-dark: #0d615d;
  --accent-soft: #dcefeb;
  --danger: #b44a39;
  font-family: 'Avenir Next', Avenir, 'Segoe UI', sans-serif;
  font-synthesis: none;
}

* { box-sizing: border-box; }
[hidden] { display: none !important; }

body {
  min-width: 280px;
  min-height: 100vh;
  margin: 0;
  color: var(--ink);
  background: var(--canvas);
}

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

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

.sidebar {
  width: 252px;
  min-width: 252px;
  min-height: 100vh;
  display: flex;
  flex-direction: column;
  padding: 31px 19px 22px;
  color: #f3f8fa;
  background: var(--rail);
}

.brand { display: flex; gap: 13px; align-items: center; padding: 0 12px; }
.brand strong { display: block; font-size: 19px; letter-spacing: -.045em; line-height: 1; }
.brand small { display: block; margin-top: 5px; font-size: 10px; text-transform: uppercase; letter-spacing: .23em; color: #a9c1cb; }
.brand-mark { width: 30px; height: 29px; display: flex; align-items: flex-end; gap: 3px; transform: skewY(-8deg); }
.brand-mark i { display: block; width: 6px; border-radius: 3px 3px 1px 1px; background: #5fd0bd; }
.brand-mark i:nth-child(1) { height: 11px; opacity: .55; }
.brand-mark i:nth-child(2) { height: 19px; opacity: .8; }
.brand-mark i:nth-child(3) { height: 27px; }

.nav-list { display: flex; flex-direction: column; gap: 4px; margin-top: 77px; }
.nav-label { padding: 0 13px 12px; color: #8faebb; font-size: 10px; font-weight: 700; letter-spacing: .16em; }
.nav-label-space { margin-top: 35px; }
.nav-item { height: 43px; display: flex; align-items: center; gap: 14px; padding: 0 13px; border-radius: 8px; color: #c4d5dd; font-size: 13px; font-weight: 600; text-decoration: none; }
.nav-disabled { opacity: .65; cursor: default; }
.nav-icon { width: 18px; display: inline-flex; justify-content: center; font-size: 20px; font-weight: 400; line-height: 1; }
.nav-active { background: #285568; color: #fff; box-shadow: inset 3px 0 0 #5fd0bd; }
.nav-active .nav-icon { color: #79dfcf; }
.nav-active:hover { background: #316276; }
.sidebar-footer { display: flex; justify-content: space-between; gap: 12px; margin-top: auto; padding: 17px 12px 2px; border-top: 1px solid #3a5b6d; color: #a9bfca; font-size: 11px; }
.sidebar-footer span { font-family: 'SFMono-Regular', Consolas, monospace; }

.main-content { flex: 1; min-width: 0; }
.topbar { height: 70px; display: flex; justify-content: space-between; align-items: center; padding: 0 clamp(22px, 4vw, 62px); border-bottom: 1px solid var(--line); background: rgba(255,255,255,.55); }
.topbar-leading { display: flex; align-items: center; gap: 16px; min-width: 0; }
.sidebar-toggle { display: inline-flex; align-items: center; gap: 7px; min-height: 36px; padding: 7px 10px; border: 1px solid var(--line); border-radius: 8px; color: var(--accent-dark); background: white; font-size: 11px; font-weight: 800; box-shadow: none; white-space: nowrap; }
.sidebar-toggle:hover { background: var(--accent-soft); transform: none; }
.sidebar-toggle:focus-visible { outline: 3px solid #73cbbf; outline-offset: 2px; }
.sidebar-toggle > span:first-child { font-size: 15px; line-height: 1; }
.topbar-actions { display: flex; align-items: center; gap: 13px; min-width: 0; }
.user-email { max-width: 190px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; color: #587180; font-size: 11px; }
.sign-out-button { min-height: 31px; padding: 0 11px; color: #456272; background: #e2edf1; font-size: 11px; }
.sign-out-button:hover { background: #d1e4e9; }
.breadcrumb { color: #5e7482; font-size: 12px; font-weight: 600; }
.breadcrumb span { margin: 0 9px; color: #a6b8c1; }
.environment-pill { display: inline-flex; align-items: center; gap: 9px; padding: 7px 11px; border: 1px solid #cddde3; border-radius: 999px; color: #49606d; background: #f7fafb; font-size: 11px; font-weight: 700; }
.environment-pill > span:first-child { width: 7px; height: 7px; border-radius: 50%; background: #c58d4a; }
.content-wrap { max-width: 1260px; margin: 0 auto; padding: clamp(36px, 5vw, 70px) clamp(22px, 4vw, 62px) 70px; }
.sidebar-collapsed #campaigns-view { max-width: 1880px; }
#campaigns-view:has(#message-sequence-panel:not([hidden])) { max-width: 1680px; }
.sidebar-collapsed #campaigns-view:has(#message-sequence-panel:not([hidden])) { max-width: 1880px; }

.heading-row { display: flex; justify-content: space-between; gap: 30px; align-items: center; margin-bottom: 44px; }
.eyebrow { margin: 0 0 12px; color: var(--accent); font-size: 11px; font-weight: 800; letter-spacing: .18em; }
h1 { margin: 0; color: #173246; font-family: 'Avenir Next', Avenir, 'Segoe UI', sans-serif; font-size: clamp(31px, 4vw, 48px); font-weight: 700; letter-spacing: -.055em; line-height: 1.12; }
.intro { max-width: 560px; margin: 15px 0 0; color: #607988; font-size: 14px; line-height: 1.65; }
.workspace-picker { display: flex; align-items: center; gap: 11px; margin-top: 24px; }
.workspace-picker label { margin: 0; white-space: nowrap; font-size: 11px; color: var(--muted); }
.workspace-picker select { width: auto; min-width: 185px; max-width: 300px; height: 36px; }
.auth-wrap { max-width: 560px; margin: clamp(35px, 8vh, 100px) auto; padding: 0 20px; }
.auth-card { padding: clamp(27px, 5vw, 44px); border: 1px solid var(--line); border-radius: 13px; background: #fff; box-shadow: 0 12px 35px rgba(30, 71, 92, .055); }
.auth-card h1 { font-size: clamp(29px, 4vw, 39px); }
.auth-card > p:not(.eyebrow) { color: var(--muted); font-size: 13px; line-height: 1.6; }
.auth-card form { display: flex; flex-direction: column; gap: 3px; padding: 27px 0 0; }
.auth-card form .field { margin-bottom: 18px; }
.auth-card form button { align-self: flex-start; min-width: 120px; margin-top: 12px; }
.auth-card > small { display: block; margin-top: 24px; color: #78909d; line-height: 1.5; }
.connection-graphic { display: flex; align-items: center; margin-right: 6px; opacity: .85; }
.graphic-node { width: 53px; height: 53px; display: grid; place-items: center; border: 1px solid #9dbfc2; border-radius: 50%; background: #dcefee; }
.graphic-node-muted { color: #abc1ca; border-color: #cbdbe1; background: #e9f0f3; font-size: 25px; }
.graphic-line { width: 70px; height: 1px; background: repeating-linear-gradient(90deg, #8ab9b7 0 8px, transparent 8px 13px); }
.graphic-bars { display: flex; gap: 3px; align-items: flex-end; height: 20px; }
.graphic-bars i { width: 4px; border-radius: 2px; background: var(--accent); }
.graphic-bars i:nth-child(1) { height: 8px; }
.graphic-bars i:nth-child(2) { height: 14px; }
.graphic-bars i:nth-child(3) { height: 20px; }

.content-grid { display: grid; grid-template-columns: minmax(0, 1.48fr) minmax(285px, .72fr); align-items: start; gap: 24px; }
.connection-directory { margin-bottom: 22px; }
.connection-directory-head { display: flex; justify-content: space-between; align-items: center; gap: 16px; }
.connection-directory-head p { min-height: 0; }
.connection-directory-head .eyebrow { margin-bottom: 5px; }
.connection-directory-actions { display: flex; flex-wrap: wrap; gap: 8px; }
.connection-status-filters { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 25px; border-bottom: 1px solid var(--line); }
.connection-status-filters button { min-height: 40px; padding: 0 13px; border: 0; border-bottom: 3px solid transparent; border-radius: 0; color: var(--muted); background: transparent; box-shadow: none; }
.connection-status-filters button:hover { color: var(--accent-dark); background: #eff8f6; transform: none; }
.connection-status-filters button.is-active { color: var(--accent-dark); border-bottom-color: var(--accent); }
.connection-directory-toolbar { display: grid; grid-template-columns: minmax(0, 1fr) minmax(170px, 220px); gap: 12px; align-items: end; margin-top: 18px; }
.connection-directory-toolbar .field { min-width: 0; margin: 0; }
.connection-directory-toolbar input, .connection-directory-toolbar select { width: 100%; }
.connection-directory-count { margin: 13px 0 18px !important; min-height: 0 !important; }
.connection-directory-list { display: grid; grid-template-columns: repeat(auto-fill, minmax(270px, 1fr)); gap: 12px; }
.connection-directory-item { width: 100%; min-height: 94px; display: grid; grid-template-columns: 52px minmax(0, 1fr) 12px 16px; align-items: center; gap: 11px; padding: 15px; border: 1px solid var(--line); border-radius: 11px; color: var(--ink); background: #fbfdfe; text-align: left; box-shadow: none; }
.connection-directory-item:hover { color: var(--ink); background: #eff8f6; border-color: #9ac9bf; }
.connection-directory-item.is-selected { border-color: var(--accent); background: #edf8f5; box-shadow: inset 3px 0 0 var(--accent); }
.connection-directory-avatar { position: relative; width: 52px; height: 52px; display: grid; place-items: center; overflow: hidden; border-radius: 50%; color: #21576b; background: #dcecf0; font-size: 18px !important; font-weight: 800 !important; line-height: 1; }
.connection-directory-avatar img { position: absolute; inset: 0; display: block; width: 100%; height: 100%; border-radius: inherit; object-fit: cover; object-position: center; }
.connection-directory-details { min-width: 0; display: flex; flex-direction: column; gap: 4px; font-size: inherit !important; }
.connection-directory-item strong { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 13px; }
.connection-directory-item small { color: var(--muted); font-size: 10px; line-height: 1.35; }
.connection-directory-indicator { width: 12px; height: 12px; border-radius: 50%; background: #d5a52d; box-shadow: 0 0 0 4px #f8edce; }
.connection-directory-item[data-tone="connected"] .connection-directory-indicator { background: #269f5b; box-shadow: 0 0 0 4px #def5e8; }
.connection-directory-item[data-tone="disconnected"] .connection-directory-indicator { background: #cd5149; box-shadow: 0 0 0 4px #fae5e2; }
.connection-directory-arrow { color: #78939d; font-size: 17px !important; }
.connection-directory-empty { grid-column: 1 / -1; padding: 24px; border: 1px dashed var(--line); border-radius: 10px; text-align: center; }
.connection-qr-panel { margin-top: 17px; padding: 15px; border: 1px solid var(--line); border-radius: 9px; background: #f9fcfd; text-align: center; }
.blacklist-view { max-width: 1360px; }
.blacklist-view .heading-row { margin-bottom: 22px; }
.blacklist-explainer { margin: 0 0 22px; padding: 16px 19px; border: 1px solid #ecd8ac; border-radius: 11px; color: #775b27; background: #fff9e9; font-size: 13px; line-height: 1.6; }
.blacklist-card { margin-bottom: 20px; }
.blacklist-section-head { display: flex; justify-content: space-between; align-items: center; flex-wrap: wrap; gap: 12px; margin-bottom: 17px; }
.blacklist-section-head h2 { margin: 0 0 5px; }
.blacklist-section-head p { min-height: 0; margin: 0; }
.blacklist-form { display: grid; grid-template-columns: minmax(0, 1.4fr) minmax(0, 1fr) auto; gap: 13px; align-items: end; padding: 0; }
.blacklist-form .field { min-width: 0; margin: 0; }
.blacklist-form textarea, .blacklist-form input { width: 100%; }
.blacklist-form textarea { min-height: 92px; resize: vertical; }
.blacklist-form button { align-self: end; }
.blacklist-search-field { min-width: min(100%, 300px); margin: 0; }
.blacklist-list, .blacklist-history { display: grid; gap: 9px; }
.blacklist-row, .blacklist-event { display: flex; align-items: center; justify-content: space-between; gap: 16px; min-width: 0; padding: 15px 17px; border: 1px solid var(--line); border-radius: 10px; background: #f9fcfd; }
.blacklist-row strong, .blacklist-event strong { display: block; color: var(--ink); font-size: 14px; }
.blacklist-row small, .blacklist-event small { display: block; margin-top: 3px; color: var(--muted); font-size: 11px; line-height: 1.45; }
.blacklist-row button { flex: none; min-height: 34px; padding: 6px 11px; border: 1px solid #e8b9b3; color: var(--danger); background: white; box-shadow: none; font-size: 11px; }
.blacklist-row button:hover { background: #fff2f0; }
.blacklist-event-state { flex: none; padding: 5px 9px; border-radius: 999px; color: #8e6b20; background: #fff0c8; font-size: 11px; font-weight: 800; }
.blacklist-event-state[data-status="removed"] { color: #177443; background: #ddf4e5; }
.blacklist-event-state[data-status="failed"] { color: #ad4038; background: #fce8e5; }
.blacklist-empty { padding: 22px; border: 1px dashed var(--line); border-radius: 10px; color: var(--muted); text-align: center; }
.connection-qr-panel h3 { margin: 0 0 8px; font-size: 14px; }
.connection-qr-panel p { min-height: 0; margin-bottom: 12px; }
.connection-qr-panel img { display: block; width: min(100%, 260px); margin: 0 auto 12px; border: 7px solid white; border-radius: 7px; }
.form-card, .status-card { border: 1px solid var(--line); border-radius: 12px; background: var(--surface); box-shadow: 0 12px 35px rgba(30, 71, 92, .045); }
.form-card { overflow: hidden; }
.card-head { display: flex; gap: 17px; align-items: flex-start; padding: 29px 33px 27px; border-bottom: 1px solid #e5ecef; }
.step-number { width: 39px; height: 39px; min-width: 39px; display: grid; place-items: center; border-radius: 9px; color: var(--accent-dark); background: #e6f4f0; font: 700 14px 'SFMono-Regular', Consolas, monospace; }
.card-head h2, .status-card h2 { margin: 1px 0 6px; color: #213b4d; font-size: 17px; letter-spacing: -.025em; }
.card-head p, .status-card p { margin: 0; color: #6c8290; font-size: 12px; line-height: 1.55; }
form { padding: 29px 33px 0; }
.field { margin-bottom: 25px; }
.field-last { margin-bottom: 31px; }
label { display: block; margin-bottom: 4px; color: #243d4e; font-size: 13px; font-weight: 700; }
.required { color: #b45a4b; }
.field-help { margin: 0 0 11px; color: #718895; font-size: 11px; line-height: 1.45; }
input, select { width: 100%; height: 45px; padding: 0 13px; border: 1px solid #cbdce3; border-radius: 7px; outline: none; color: #193647; background: #fbfdfe; font-size: 13px; transition: border-color .15s, box-shadow .15s; }
textarea { width: 100%; min-height: 145px; padding: 12px 13px; border: 1px solid #cbdce3; border-radius: 7px; outline: none; color: #193647; background: #fbfdfe; font-size: 13px; line-height: 1.5; resize: vertical; }
input::placeholder { color: #9ab0bc; }
input:focus, select:focus, textarea:focus { border-color: #318d88; box-shadow: 0 0 0 3px #d6f1ec; }
select { cursor: pointer; }
.form-footer { min-height: 78px; display: flex; justify-content: space-between; align-items: center; gap: 15px; margin: 0 -33px; padding: 17px 33px; border-top: 1px solid #e5ecef; background: #f9fbfc; }
.form-message { margin: 0; color: #526e7e; font-size: 12px; line-height: 1.4; }
.form-message.success { color: var(--accent-dark); font-weight: 700; }
.form-message.error { color: var(--danger); font-weight: 700; }
button { min-height: 42px; display: inline-flex; align-items: center; justify-content: center; gap: 17px; flex-shrink: 0; padding: 0 18px; border: 0; border-radius: 7px; color: #fff; background: var(--accent); font-size: 12px; font-weight: 800; cursor: pointer; transition: background .15s, transform .15s; }
button:hover { background: var(--accent-dark); transform: translateY(-1px); }
button:focus-visible { outline: 3px solid #93dfd3; outline-offset: 2px; }
button:disabled { opacity: .65; cursor: wait; transform: none; }
button span { font-size: 18px; font-weight: 400; }

.status-column { display: flex; flex-direction: column; gap: 16px; }
.status-card { padding: 27px 26px 25px; }
.status-top { display: inline-flex; align-items: center; gap: 8px; margin-bottom: 29px; padding: 7px 10px; border: 1px solid #e8dabe; border-radius: 6px; color: #916d37; background: #fff9ec; font-size: 10px; font-weight: 800; letter-spacing: .02em; }
.status-dot { width: 6px; height: 6px; border-radius: 50%; background: #c29550; }
.is-saved .status-top { border-color: #cde9e2; color: var(--accent-dark); background: #eef9f6; }
.is-saved .status-dot { background: var(--accent); }
.status-top[data-tone="connected"] { border-color: #bee7cd; color: #197447; background: #edf9f0; }
.status-top[data-tone="connected"] .status-dot { background: #269f5b; }
.status-top[data-tone="disconnected"] { border-color: #f0c5c0; color: #a43e38; background: #fff1ef; }
.status-top[data-tone="disconnected"] .status-dot { background: #cd5149; }
.status-top[data-tone="unstable"] { border-color: #e8dabe; color: #916d37; background: #fff9ec; }
.status-top[data-tone="unstable"] .status-dot { background: #d5a52d; }
.status-card h2 { margin-bottom: 9px; font-size: 16px; }
.status-card > p { min-height: 55px; }
.connection-actions { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; margin-top: 18px; }
.connection-actions button:last-child { grid-column: 1 / -1; }
.connection-actions button { min-height: 38px; padding: 7px 9px; font-size: 10px; line-height: 1.25; }
.connection-actions button:first-child { color: var(--accent-dark); background: var(--accent-soft); }
.connection-actions button:first-child:hover { background: #c9e6df; }
.status-card #evolution-message { min-height: 0; margin-top: 10px; }
.groups-panel > p { min-height: 0; }
.groups-panel ul { display: flex; flex-direction: column; gap: 9px; max-height: 320px; overflow: auto; margin: 16px 0 0; padding: 0; list-style: none; }
.groups-panel li { padding: 9px 0; border-top: 1px solid #e4ebef; font-size: 12px; line-height: 1.3; }
.groups-panel li strong, .groups-panel li small { display: block; overflow-wrap: anywhere; }
.groups-panel li small { margin-top: 4px; color: var(--muted); font-size: 10px; }
.campaigns-heading { margin-bottom: 32px; }
.campaign-list-card { min-height: 210px; }
.campaign-list-card > p { min-height: 0; }
.campaign-list { display: flex; flex-direction: column; gap: 0; margin: 15px 0 0; padding: 0; list-style: none; }
.campaign-list li { min-width: 0; padding: 13px 0; border-top: 1px solid #e4ebef; }
.campaign-list strong, .campaign-list small { display: block; overflow-wrap: anywhere; }
.campaign-list strong { color: #213b4d; font-size: 13px; }
.campaign-list small { margin-top: 5px; color: var(--muted); font-size: 11px; }
.campaign-list-button { width: 100%; min-height: 0; display: block; padding: 10px; text-align: left; color: inherit; background: transparent; border-radius: 7px; }
.campaign-list-button:hover, .campaign-list-button.is-selected { background: var(--accent-soft); transform: none; }
.campaign-list-button.is-selected { box-shadow: inset 3px 0 0 var(--accent); }
.campaign-groups-panel { margin-top: 24px; }
.campaign-groups-head { display: flex; justify-content: space-between; align-items: flex-start; gap: 18px; }
.campaign-groups-head .eyebrow { margin-bottom: 8px; }
.campaign-groups-head h2 { margin: 0 0 6px; }
.campaign-groups-head p:not(.eyebrow) { min-height: 0; }
.campaign-groups-count { flex-shrink: 0; padding: 7px 10px; border-radius: 999px; color: var(--accent-dark); background: var(--accent-soft); font-size: 11px; }
.campaign-groups-panel > .form-message { min-height: 0; margin-top: 17px; }
.campaign-groups-list { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; margin: 17px 0 0; padding: 0; list-style: none; }
.campaign-groups-list li { min-width: 0; border: 1px solid var(--line); border-radius: 8px; background: #fbfdfe; }
.campaign-groups-list label { display: flex; align-items: flex-start; gap: 12px; min-width: 0; margin: 0; padding: 13px; cursor: pointer; }
.campaign-groups-list input[type="checkbox"] { width: 18px; height: 18px; flex-shrink: 0; margin: 1px 0 0; accent-color: var(--accent); }
.campaign-groups-list span { min-width: 0; }
.campaign-groups-list strong, .campaign-groups-list small { display: block; overflow-wrap: anywhere; }
.campaign-groups-list strong { font-size: 12px; }
.campaign-groups-list small { margin-top: 5px; color: var(--muted); font-size: 10px; font-weight: 400; }
.campaign-account-identity { display: flex; align-items: center; gap: 13px; min-width: 0; flex: 1 1 auto; }
.campaign-account-avatar { position: relative; display: grid; place-items: center; flex: 0 0 52px; width: 52px; height: 52px; overflow: hidden; border-radius: 50%; color: var(--accent-dark); background: var(--accent-soft); font-size: 19px; font-weight: 800; }
.campaign-account-avatar img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.campaign-account-details { display: flex; flex-direction: column; min-width: 0; gap: 3px; }
.campaign-account-details strong { font-size: 14px; line-height: 1.3; overflow-wrap: anywhere; }
.campaign-account-number { color: var(--ink); font-size: 12px; font-weight: 700; font-variant-numeric: tabular-nums; }
.campaign-account-details small { margin: 0; color: var(--muted); font-size: 11px; line-height: 1.4; overflow-wrap: anywhere; }
.campaign-rotation-dialog { width: min(880px, calc(100vw - 28px)); max-height: min(90dvh, calc(100vh - 28px)); padding: 0; overflow-y: auto; overscroll-behavior: contain; border: 1px solid var(--line); border-radius: 15px; box-shadow: 0 28px 70px #092d4260; background: var(--surface); color: var(--ink); }
.campaign-rotation-dialog::backdrop { background: #0c2835a8; }
.campaign-rotation-form { padding: clamp(18px, 3vw, 28px); }
.campaign-rotation-head { display: flex; justify-content: space-between; gap: 15px; align-items: flex-start; margin-bottom: 22px; }
.campaign-rotation-head h2 { margin: 4px 0 7px; font-size: 19px; }
.campaign-rotation-head .field-help { margin: 0; }
.campaign-rotation-head-actions { display: flex; align-items: center; gap: 10px; flex-shrink: 0; }
.campaign-rotation-fields { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px 18px; }
.campaign-rotation-wide { grid-column: 1 / -1; }
.campaign-rotation-fields textarea { min-height: 80px; }
.campaign-rotation-image { display: flex; align-items: center; flex-wrap: wrap; gap: 10px; margin: 14px 0 18px; }
.campaign-rotation-image > span { font-weight: 700; }
.campaign-rotation-image .field-help { flex-basis: 100%; margin: 0; }
.campaign-rotation-actions { display: flex; justify-content: flex-end; gap: 10px; margin-top: 15px; }
.campaign-rotation-image { padding: 14px; border: 1px solid var(--line); border-radius: 13px; background: var(--canvas); }
.campaign-rotation-image img { width: 90px; height: 90px; border-radius: 50%; object-fit: cover; flex: none; }
.campaign-rotation-image strong { display: block; margin-bottom: 5px; }
.campaign-rotation-tabs { display: flex; gap: 20px; border-bottom: 1px solid var(--line); margin: 6px 0 20px; }
.campaign-rotation-tabs button { border: 0; border-bottom: 3px solid transparent; background: none; color: var(--muted); padding: 12px 3px; cursor: pointer; font-weight: 750; }
.campaign-rotation-tabs button[aria-selected="true"] { color: var(--accent); border-bottom-color: var(--accent); }
.campaign-rotation-options { display: grid; gap: 12px; margin-top: 18px; }
.campaign-rotation-options .checkbox-field { padding: 10px 12px; margin: 0; border: 1px solid var(--line); border-radius: 10px; }
.campaign-rotation-options .checkbox-field span { display: grid; gap: 3px; }
.campaign-rotation-options .checkbox-field small { color: var(--muted); font-size: 11px; font-weight: 400; }
.campaign-rotation-unavailable { opacity: .65; cursor: not-allowed; }
.campaign-rotation-admin-list { display: grid; gap: 10px; margin: 15px 0; }
.campaign-rotation-admin-row { display: flex; gap: 10px; align-items: end; }
.campaign-rotation-admin-row label { display: grid; gap: 5px; flex: 1; font-size: 12px; font-weight: 700; }
.campaign-rotation-admin-row input { min-width: 0; width: 100%; padding: 12px; border: 1px solid var(--line); border-radius: 9px; background: var(--surface); color: var(--ink); }
.campaign-rotation-associated-admins { margin-top: 25px; border-top: 1px solid var(--line); padding-top: 18px; }
.campaign-rotation-associated-row { display: flex; align-items: center; justify-content: space-between; gap: 10px; padding: 8px 0; }
@media (max-width: 640px) { .campaign-rotation-fields { grid-template-columns: 1fr; } .campaign-rotation-head { flex-direction: column-reverse; } .campaign-rotation-head-actions { width: 100%; justify-content: space-between; } .campaign-rotation-actions { flex-wrap: wrap; } .campaign-rotation-associated-row { align-items: flex-start; flex-direction: column; } .campaign-rotation-admin-row { align-items: stretch; flex-direction: column; } }
.campaign-content-panel { display: flex; flex-direction: column; gap: 24px; margin-top: 24px; }
.campaign-action-grid { grid-template-columns: minmax(0, 1fr); margin-top: 0; }
.checkbox-field { display: flex; align-items: center; gap: 10px; margin: 0 0 10px; font-size: 12px; cursor: pointer; }
.checkbox-field input { width: 18px; height: 18px; flex-shrink: 0; accent-color: var(--accent); }
.draft-list { display: flex; flex-direction: column; gap: 0; margin: 15px 0 0; padding: 0; list-style: none; }
.draft-list li { padding: 12px 0; border-top: 1px solid var(--line); }
.draft-list strong, .draft-list small { display: block; overflow-wrap: anywhere; }
.draft-list strong { color: #213b4d; font-size: 12px; }
.draft-list small { margin-top: 5px; color: var(--muted); font-size: 10px; line-height: 1.4; }
.draft-list .action-list-button { padding: 11px; }
.action-list-button[data-status="processing"] { border-left: 4px solid var(--accent); background: #eff9f6; }
.action-list-button[data-status="failed"], .action-list-button[data-status="uncertain"] { border-left: 4px solid var(--danger); }
.action-progress-track { display: block; width: 100%; height: 7px; margin-top: 8px; overflow: hidden; border-radius: 999px; background: #dce8ea; }
.action-progress-track > span { display: block; height: 100%; border-radius: inherit; background: var(--accent); }
.action-history-commands { display: flex; flex-wrap: wrap; align-items: center; gap: 9px; margin: 12px 0; }
.action-history-commands .checkbox-field { flex-basis: 100%; margin: 0; }
.action-history-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 16px; }
.action-history-head .field-help { margin: 4px 0 0; }
.action-history-head button { flex: 0 0 auto; }
.action-history-controls { display: grid; grid-template-columns: minmax(0, 1fr) minmax(120px, .65fr); gap: 9px; max-width: 640px; margin-top: 16px; }
.action-history-controls .field { min-width: 0; margin: 0; }
.action-history-controls label { font-size: 11px; }
.action-history-controls input, .action-history-controls select { height: 38px; font-size: 11px; }
.status-card .action-history-count { min-height: 0; margin-top: 10px; color: var(--muted); font-size: 10px; }
.action-history-more { display: block; margin: 18px auto 0; }
.action-history-list { display: grid; gap: 16px; margin: 18px 0 0; padding: 0; list-style: none; }
.action-history-card { min-width: 0; overflow: hidden; border: 1px solid #cbdde2; border-radius: 13px; background: white; box-shadow: 0 8px 24px #1738490a; }
.action-history-card.is-selected { border-color: var(--accent); box-shadow: 0 0 0 2px #147b7626; }
.action-history-item-head { display: flex; align-items: center; justify-content: space-between; gap: 12px; min-height: 58px; padding: 11px 18px; color: white; background: #203847; }
.action-history-open { min-width: 0; padding: 4px 0; border: 0; background: transparent; color: inherit; text-align: left; box-shadow: none; }
.action-history-open:hover { background: transparent; color: #8ee1d3; transform: none; }
.action-history-open strong { display: block; font-size: 14px; line-height: 1.35; }
.action-history-open small { display: block; margin-top: 3px; color: #b6d0d3; font-size: 10px; font-weight: 600; }
.action-history-open:focus-visible { outline: 3px solid #83d6ca; outline-offset: 4px; }
.action-history-badge { flex: 0 0 auto; max-width: 42%; padding: 6px 9px; border-radius: 999px; color: #d6f5ed; background: #275e58; font-size: 10px; font-weight: 800; text-align: center; }
.action-history-badge[data-status="scheduled"], .action-history-badge[data-status="queued"] { color: #5a410d; background: #ffe9ac; }
.action-history-badge[data-status="failed"], .action-history-badge[data-status="uncertain"], .action-history-badge[data-status="partial"] { color: #fff1e7; background: #9c4938; }
.action-history-badge[data-status="cancelled"], .action-history-badge[data-status="draft"] { color: #e3edf0; background: #536875; }
.action-history-item-body { display: grid; grid-template-columns: minmax(0, 1.15fr) minmax(210px, .9fr) minmax(200px, .8fr); }
.action-history-item-body > * { min-width: 0; padding: 16px 18px; }
.action-history-item-body > * + * { border-left: 1px solid #e0e8eb; }
.action-history-kicker { display: block; margin-bottom: 11px; color: #66808b; font-size: 10px; font-weight: 800; letter-spacing: .12em; }
.action-history-preview { min-height: 190px; background: #102c32; }
.action-history-preview .action-history-kicker { color: #a4d1ca; }
.action-history-preview p { max-height: 170px; overflow: auto; margin: 0; padding: 14px; border-radius: 9px; color: white; background: #086657; font-size: 12px; font-weight: 600; line-height: 1.55; white-space: pre-wrap; overflow-wrap: anywhere; }
.action-history-preview small { display: block; margin-top: 9px; color: #bbe8de; font-size: 10px; }
.action-history-facts { display: grid; align-content: start; gap: 10px; margin: 0; }
.action-history-facts > div { display: grid; grid-template-columns: 90px minmax(0, 1fr); gap: 8px; font-size: 11px; line-height: 1.4; }
.action-history-facts dt { color: #728793; font-weight: 700; }
.action-history-facts dd { min-width: 0; margin: 0; color: #243e4c; font-weight: 700; overflow-wrap: anywhere; }
.action-history-senders { align-content: start; }
.action-history-sender { display: grid; gap: 4px; padding: 9px 0; border-top: 1px solid #e1e9ec; }
.action-history-sender strong { color: var(--ink); font-size: 11px; overflow-wrap: anywhere; }
.action-history-sender small, .action-history-senders p { margin: 0; color: var(--muted); font-size: 10px; line-height: 1.45; }
.action-history-item-footer { display: grid; gap: 7px; padding: 11px 18px 14px; border-top: 1px solid #e2eaed; color: #4f6875; font-size: 11px; font-weight: 700; }
.action-history-item-footer .action-progress-track { margin: 2px 0 0; }
.action-history-error { color: var(--danger); font-weight: 600; overflow-wrap: anywhere; }
.action-history-pagination { display: flex; align-items: center; justify-content: flex-end; gap: 13px; margin-top: 19px; }
.action-history-pagination span { min-width: 105px; color: var(--muted); font-size: 11px; font-weight: 700; text-align: center; }
.action-history-pagination button { min-height: 32px; }
@media (max-width: 960px) { .action-history-item-body { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); } .action-history-senders { grid-column: 1 / -1; border-top: 1px solid #e0e8eb; border-left: 0 !important; } }
@media (max-width: 620px) { .action-history-item-body { grid-template-columns: 1fr; } .action-history-item-body > * + * { border-top: 1px solid #e0e8eb; border-left: 0; } .action-history-preview { min-height: 0; } .action-history-preview p { max-height: 130px; } .action-history-senders { grid-column: auto; } .action-history-pagination { justify-content: space-between; gap: 6px; } .action-history-pagination span { min-width: 0; } }
.action-review-dialog { width: min(560px, calc(100% - 28px)); max-height: calc(100dvh - 28px); overflow-y: auto; padding: 0; border: 1px solid #b9d4d1; border-radius: 14px; color: var(--ink); background: white; box-shadow: 0 25px 90px rgba(11, 36, 47, .25); }
.action-review-dialog::backdrop { background: rgba(13, 40, 54, .58); }
.action-review-head { padding: 25px 28px 20px; border-bottom: 1px solid var(--line); background: #f2faf8; }
.action-review-head span { color: var(--accent-dark); font-size: 10px; font-weight: 800; letter-spacing: .1em; text-transform: uppercase; }
.action-review-head h2 { margin: 7px 0; font-size: 22px; letter-spacing: -.035em; }
.action-review-head p { margin: 0; color: var(--muted); font-size: 12px; line-height: 1.5; }
.action-review-list { display: grid; gap: 0; margin: 0; padding: 8px 28px; }
.action-review-list > div { padding: 14px 0; border-bottom: 1px solid var(--line); }
.action-review-list > div:last-child { border-bottom: 0; }
.action-review-list dt { margin-bottom: 5px; color: var(--muted); font-size: 10px; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; }
.action-review-list dd { margin: 0; color: var(--ink); font-size: 13px; font-weight: 600; line-height: 1.5; white-space: pre-line; overflow-wrap: anywhere; }
.action-review-footer { display: flex; justify-content: flex-end; gap: 10px; padding: 16px 28px 24px; }
.action-review-footer button { min-height: 40px; }
.action-detail-panel > .form-message { min-height: 0; margin-top: 14px; }
.action-detail-panel > p { min-height: 0; }
.action-plan-form { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 14px; align-items: end; margin-top: 18px; padding: 0; }
.action-plan-form .field { min-width: 0; margin: 0; }
.action-plan-form .form-footer { grid-column: 1 / -1; margin: 0; padding: 15px 0 0; border-top: 1px solid var(--line); }
.action-detail-panel > .field-help { margin-top: 16px; }
.action-execute-form { margin-top: 24px; padding: 20px; border: 1px solid #e8c8c1; border-radius: 10px; background: #fff8f6; }
.action-execute-form h3 { margin: 0 0 6px; color: #8b382b; font-size: 14px; }
.action-execute-form p { margin: 0 0 17px; color: #704f49; font-size: 12px; line-height: 1.5; }
.action-execute-form .field { max-width: 440px; }
.action-execute-form .form-footer { margin: 0; padding: 14px 0 0; background: transparent; }

/* Campaign workspace: the selected campaign is the operator's context. */
.campaign-top-grid { grid-template-columns: minmax(0, 1fr); align-items: start; }
.campaigns-heading { display: flex; align-items: flex-end; justify-content: space-between; gap: 24px; }
#campaign-new-button { flex: 0 0 auto; min-height: 44px; }
.campaign-create-view { max-width: 800px; }
.campaign-create-back { display: inline-block; margin-bottom: 23px; color: var(--accent-dark); font-size: 12px; font-weight: 800; text-decoration: none; }
.campaign-create-back:hover { text-decoration: underline; }
#campaign-create-panel { max-width: 760px; }
.campaign-list-card { min-height: 250px; }
.campaign-list { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 260px), 1fr)); gap: 13px; margin-top: 18px; }
.campaign-list li { padding: 0; border: 0; }
.campaign-list-button { position: relative; display: flex; flex-direction: column; align-items: flex-start; justify-content: center; min-height: 106px; padding: 19px 48px 19px 20px; border: 1px solid var(--line); border-radius: 12px; background: #f9fcfd; }
.campaign-list-button::after { position: absolute; right: 20px; top: 50%; content: '↗'; color: var(--accent); font-size: 20px; transform: translateY(-50%); }
.campaign-list-button:hover { border-color: #8cc4bd; background: var(--accent-soft); }
.campaign-list-button strong { font-size: 16px; letter-spacing: -.02em; }
.campaign-list-button small { margin-top: 9px; font-size: 12px; }
.campaign-dashboard-head { padding: clamp(24px, 4vw, 38px); border: 1px solid #23485a; border-radius: 16px; color: white; background: linear-gradient(125deg, #18364a, #214b58 72%, #17665e); }
#campaign-back-link { display: inline-block; margin-bottom: 29px; color: #b4e4dc; font-size: 12px; font-weight: 700; text-decoration: none; }
#campaign-back-link:hover { text-decoration: underline; }
.campaign-dashboard-title { display: flex; align-items: flex-start; justify-content: space-between; gap: 22px; }
.campaign-dashboard-title .eyebrow { color: #7ed9ca; }
.campaign-dashboard-title h1 { margin: 0 0 8px; color: #fff; }
.campaign-dashboard-title p:last-child { margin: 0; color: #c3d9dc; font-size: 12px; }
.campaign-status { flex: 0 0 auto; padding: 8px 12px; border: 1px solid #bdd6d7; border-radius: 999px; color: #d7f7e8; background: #ffffff17; font-size: 11px; font-weight: 800; }
.campaign-status[data-status="draft"] { color: #ffe3a4; border-color: #c49b58; }
.campaign-overview { margin-top: 23px; }
.campaign-overview-intro { padding: 27px 30px; border: 1px solid var(--line); border-radius: 14px; background: white; }
.campaign-overview-intro h2 { margin: 0 0 8px; font-size: 23px; letter-spacing: -.035em; }
.campaign-overview-intro p:last-child { max-width: 630px; margin: 0; color: var(--muted); font-size: 13px; line-height: 1.55; }
.campaign-overview-stats { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 13px; margin-top: 13px; }
.campaign-overview-stats > div { min-width: 0; display: flex; flex-direction: column; gap: 12px; min-height: 120px; padding: 21px 24px; border: 1px solid var(--line); border-radius: 13px; background: white; }
.campaign-overview-stats strong { overflow-wrap: anywhere; color: var(--rail); font-size: clamp(20px, 2.5vw, 30px); letter-spacing: -.04em; }
.campaign-overview-stats span { color: var(--muted); font-size: 11px; font-weight: 700; }
.campaign-overview-chart-toolbar { display: flex; align-items: end; justify-content: space-between; gap: 18px; margin: 31px 0 13px; }
.campaign-overview-chart-toolbar .eyebrow { margin-bottom: 5px; }
.campaign-overview-chart-toolbar h2 { margin: 0; font-size: 23px; letter-spacing: -.035em; }
.campaign-chart-period { display: flex; flex-wrap: wrap; gap: 3px; padding: 4px; border: 1px solid var(--line); border-radius: 9px; background: white; }
.campaign-chart-period button { min-height: 34px; padding: 7px 11px; border: 0; border-radius: 6px; color: var(--muted); background: transparent; font-size: 11px; font-weight: 800; }
.campaign-chart-period button.is-active { color: white; background: var(--rail); }
.campaign-overview-charts { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 13px; }
.campaign-overview-chart-card { min-width: 0; padding: 21px 23px 17px; border: 1px solid var(--line); border-radius: 13px; background: white; }
.campaign-overview-chart-card-wide { grid-column: 1 / -1; }
.campaign-overview-chart-title { display: flex; align-items: start; justify-content: space-between; gap: 12px; }
.campaign-overview-chart-title h3 { margin: 0 0 5px; font-size: 17px; }
.campaign-overview-chart-title p { margin: 0; color: var(--muted); font-size: 11px; }
.campaign-overview-chart-title strong { color: var(--rail); font-size: 25px; letter-spacing: -.04em; }
.campaign-overview-bars { min-height: 174px; margin-top: 17px; padding: 13px 6px 9px; border-color: #e6eef0; background: #f8fbfc; }
.campaign-overview-bars li { height: 142px; }
.campaign-overview-bars li span { background: #1b8d83; }
.campaign-overview-chart-card:first-child .campaign-overview-bars li span { background: #f4bf3e; }
.campaign-overview-chart-card:nth-child(3) .campaign-overview-bars li span { background: #6c80a4; }
.campaign-overview-chart-card:nth-child(4) .campaign-overview-bars li span { background: #cd785c; }
.campaign-overview-chart-card:nth-child(5) .campaign-overview-bars li span { background: #ba6c76; }
.campaign-overview-chart-card .field-help { min-height: 28px; margin: 12px 0 0; line-height: 1.45; }
@media (max-width: 840px) { .campaign-overview-charts { grid-template-columns: 1fr; } .campaign-overview-chart-card-wide { grid-column: auto; } }
@media (max-width: 560px) { .campaign-overview-chart-toolbar { align-items: start; flex-direction: column; } .campaign-overview-chart-card { padding: 16px; } }
.campaign-overview-links { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; margin-top: 18px; }
.campaign-overview-links button { display: flex; justify-content: space-between; align-items: center; min-height: 63px; padding: 16px 19px; border: 1px solid var(--line); border-radius: 10px; color: var(--ink); background: white; font-size: 13px; text-align: left; }
.campaign-overview-links button:hover { border-color: #8cc4bd; background: var(--accent-soft); }
.campaign-overview-links span { color: var(--accent); font-size: 18px; }
.campaign-invite-panel { margin-top: 23px; padding: clamp(21px, 3vw, 32px); }
.campaign-invite-panel .campaign-groups-head { margin-bottom: 22px; }
.campaign-invite-url { display: flex; gap: 9px; }
.campaign-invite-url input { min-width: 0; flex: 1; }
.campaign-invite-url button { flex: 0 0 auto; }
.campaign-slug-field { margin-bottom: 18px; }
.campaign-slug-editor { display: flex; align-items: center; gap: 9px; flex-wrap: wrap; }
.campaign-slug-domain { padding: 12px 0; color: var(--muted); font-size: 12px; font-weight: 700; white-space: nowrap; }
.campaign-slug-editor input { min-width: 160px; flex: 1; }
.campaign-slug-editor button { flex: 0 0 auto; }
.campaign-slug-field .field-help[data-tone="success"] { color: var(--accent-dark); }
.campaign-slug-field .field-help[data-tone="error"] { color: var(--danger); }
.campaign-invite-panel .campaign-deep-link { margin: 22px 0 4px; font-weight: 700; }
.campaign-deep-link-help { margin: 0 0 22px 28px; }
.campaign-invite-photo { display: flex; align-items: center; gap: 20px; margin: 22px 0; padding: 18px; border: 1px solid var(--border, #d5e2e8); border-radius: 14px; }
.campaign-invite-photo h3 { margin: 0 0 7px; }
.campaign-invite-photo-preview { display: grid; place-items: center; flex: 0 0 96px; width: 96px; height: 96px; overflow: hidden; border-radius: 50%; background: #e8eeee; color: #51716d; font-size: 35px; }
.campaign-invite-photo-preview img { width: 100%; height: 100%; object-fit: cover; }
.campaign-invite-photo-preview img[hidden] { display: none; }
.campaign-photo-upload { display: inline-flex; align-items: center; justify-content: center; margin-top: 10px; cursor: pointer; }
.campaign-photo-upload:focus-visible { outline: 3px solid #147e77; outline-offset: 2px; }
.campaign-invite-panel .checkbox-field { margin-top: 22px; }
.campaign-invite-metrics { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; margin-top: 25px; }
.campaign-invite-metrics > div { display: flex; flex-direction: column; gap: 5px; padding: 18px 20px; border: 1px solid var(--line); border-radius: 10px; background: #f8fbfc; }
.campaign-invite-metrics strong { color: var(--rail); font-size: 26px; }
.campaign-invite-metrics span { color: var(--muted); font-size: 11px; }
.campaign-click-chart-head { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-top: 27px; }
.campaign-click-chart-head h3 { margin: 0; font-size: 15px; }
.campaign-click-chart-head > div { display: flex; padding: 3px; border: 1px solid var(--line); border-radius: 8px; background: #f8fbfc; }
.campaign-click-chart-head button { min-width: 38px; padding: 7px 9px; border: 0; border-radius: 5px; color: var(--muted); background: transparent; font-size: 11px; }
.campaign-click-chart-head button.is-active { color: white; background: var(--rail); }
.campaign-click-chart { display: flex; align-items: flex-end; gap: 5px; min-height: 200px; margin: 12px 0 0; padding: 20px 12px 12px; overflow-x: auto; border: 1px solid var(--line); border-radius: 10px; list-style: none; }
.campaign-click-chart li { display: flex; flex: 1 0 25px; flex-direction: column; align-items: center; justify-content: flex-end; gap: 6px; height: 150px; min-width: 25px; }
.campaign-click-chart li strong { color: var(--rail); font-size: 10px; }
.campaign-click-chart li span { display: block; flex: 0 0 auto; width: min(100%, 32px); min-height: 3px; border-radius: 4px 4px 0 0; background: var(--accent); }
.campaign-click-chart li small { color: var(--muted); font-size: 9px; white-space: nowrap; }
@media (max-width: 560px) { .campaign-invite-url, .campaign-invite-photo { flex-direction: column; } .campaign-invite-metrics { grid-template-columns: 1fr; } }
@media (max-width: 560px) { .campaign-slug-editor { align-items: stretch; } .campaign-slug-domain, .campaign-slug-editor input { width: 100%; flex-basis: 100%; } .campaign-slug-domain { padding-bottom: 0; } .campaign-slug-editor button { flex: 1; } }
.campaign-tabs { display: flex; gap: 4px; margin: 29px 0 0; padding: 5px; border: 1px solid var(--line); border-radius: 12px; background: #f8fbfc; overflow-x: auto; }
.campaign-tabs button { flex: 1 0 max-content; min-height: 43px; padding: 10px 16px; border: 0; border-radius: 8px; background: transparent; color: var(--muted); font-size: 12px; font-weight: 700; box-shadow: none; }
.campaign-tabs button:hover { background: #e8f3f1; color: var(--accent-dark); transform: none; }
.campaign-tabs button.is-active { background: var(--rail); color: white; box-shadow: 0 3px 10px #17384922; }
.campaign-activity-panel { margin-top: 24px; }
.campaign-activity-filters { display: grid; grid-template-columns: minmax(135px, 1.4fr) minmax(145px, 1.4fr) minmax(115px, 1fr) repeat(2, minmax(130px, 1fr)) auto; align-items: end; gap: 10px; margin: 24px 0 15px; }
.campaign-activity-filters .field { min-width: 0; margin: 0; }
.campaign-activity-filters input, .campaign-activity-filters select { width: 100%; min-width: 0; }
.campaign-activity-filters button { min-height: 43px; }
.campaign-activity-table-wrap { overflow-x: auto; border: 1px solid var(--line); border-radius: 10px; }
.campaign-activity-table { width: 100%; border-collapse: collapse; text-align: left; }
.campaign-activity-table th, .campaign-activity-table td { padding: 15px 18px; border-bottom: 1px solid var(--line); font-size: 12px; }
.campaign-activity-table th { color: var(--rail); background: #f4f8f9; font-weight: 800; white-space: nowrap; }
.campaign-activity-table tbody tr:last-child td { border-bottom: 0; }
.campaign-activity-table td.is-muted { color: var(--muted); }
.campaign-activity-table td.is-entry { color: #21845a; font-weight: 800; }
.campaign-activity-table td.is-exit { color: #b94e45; font-weight: 800; }
.campaign-activity-pager { display: flex; align-items: center; justify-content: space-between; gap: 12px; min-height: 60px; color: var(--muted); font-size: 11px; }
.campaign-activity-chart-section { margin-top: 26px; padding-top: 18px; border-top: 1px solid var(--line); }
.campaign-activity-chart-section .campaign-overview-chart-toolbar { margin-top: 0; }
.campaign-activity-chart-section h3 { margin: 0 0 7px; font-size: 22px; }
.campaign-activity-totals { margin: 0; color: var(--muted); font-size: 12px; }
.campaign-activity-legend { display: flex; justify-content: center; gap: 20px; font-size: 11px; font-weight: 700; }
.campaign-activity-legend span { display: inline-flex; align-items: center; gap: 7px; }
.campaign-activity-legend i { width: 11px; height: 11px; border-radius: 50%; }
.campaign-activity-legend .is-entry, .campaign-activity-bars .is-entry { background: #2c9a68; }
.campaign-activity-legend .is-exit, .campaign-activity-bars .is-exit { background: #d5574c; }
.campaign-activity-chart { display: flex; align-items: flex-end; gap: 4px; min-height: 210px; margin: 12px 0 0; padding: 15px 9px 8px; overflow-x: auto; border: 1px solid var(--line); border-radius: 10px; background: #f8fbfc; list-style: none; }
.campaign-activity-chart li { display: flex; flex: 1 0 28px; flex-direction: column; align-items: center; justify-content: flex-end; gap: 8px; min-width: 28px; }
.campaign-activity-bars { display: flex; align-items: flex-end; justify-content: center; gap: 2px; height: 150px; width: 100%; }
.campaign-activity-bars span { display: block; width: min(42%, 18px); border-radius: 4px 4px 0 0; }
.campaign-activity-chart small { color: var(--muted); font-size: 9px; white-space: nowrap; }
.campaign-activity-chart-section > .field-help { margin-top: 12px; }
@media (max-width: 1150px) { .campaign-activity-filters { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
@media (max-width: 650px) { .campaign-activity-filters { grid-template-columns: repeat(2, minmax(0, 1fr)); } .campaign-activity-filters .field:first-child, .campaign-activity-filters .field:nth-child(2) { grid-column: span 2; } .campaign-activity-table th, .campaign-activity-table td { padding: 12px; } }
.campaign-diagnostics-panel { margin-top: 24px; }
.campaign-diagnostics-toolbar { display: flex; align-items: end; gap: 16px; margin-top: 24px; }
.campaign-diagnostics-toolbar .field { flex: 1; margin: 0; }
.campaign-diagnostics-toolbar input { width: 100%; }
.campaign-diagnostics-list { display: grid; gap: 12px; margin-top: 14px; }
.campaign-diagnostic-card { padding: 18px; border: 1px solid var(--line); border-radius: 11px; background: #fbfdfe; }
.campaign-diagnostic-heading { display: flex; align-items: center; gap: 18px; }
.campaign-diagnostic-heading > div { flex: 1; min-width: 0; }
.campaign-diagnostic-heading .campaign-account-identity { flex: 1 1 auto; }
.campaign-diagnostic-heading h3 { margin: 0 0 3px; font-size: 16px; overflow-wrap: anywhere; }
.campaign-diagnostic-heading .field-help { margin: 0; }
.campaign-diagnostic-total { color: var(--accent-dark); font-size: 13px; }
.campaign-diagnostic-summary { margin: 14px 0 0; font-weight: 700; color: var(--ink); }
.campaign-diagnostic-warning { margin: 11px 0 0; color: var(--danger); }
.campaign-diagnostic-details { margin-top: 15px; border-top: 1px solid var(--line); padding-top: 12px; }
.campaign-diagnostic-details summary { cursor: pointer; color: var(--accent-dark); font-weight: 700; }
.campaign-diagnostic-details ul { list-style: none; margin: 12px 0 0; padding: 0; }
.campaign-diagnostic-details li { display: flex; justify-content: space-between; gap: 16px; padding: 9px 0; border-top: 1px solid var(--line); }
.campaign-diagnostic-details li span { min-width: 0; overflow-wrap: anywhere; }
.campaign-diagnostic-details li strong { flex: 0 0 auto; color: var(--accent-dark); }
.campaign-diagnostic-details li strong[data-status="missing"] { color: var(--danger); }
.campaign-diagnostic-details li strong[data-status="unknown"], .campaign-diagnostic-details li strong[data-status="member_unverified"] { color: var(--muted); }
.campaign-diagnostic-checked { display: block; margin-top: 12px; color: var(--muted); }
@media (max-width: 640px) { .campaign-diagnostic-heading, .campaign-diagnostics-toolbar { align-items: stretch; flex-direction: column; } .campaign-diagnostic-heading .secondary-action { align-self: flex-start; } .campaign-diagnostic-details li { flex-direction: column; gap: 3px; } }
.campaign-head-actions { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; justify-content: flex-end; }
.secondary-action, .campaign-picker-list button { min-height: 38px; padding: 9px 14px; border: 1px solid var(--accent); border-radius: 7px; color: var(--accent-dark); background: white; font-size: 11px; font-weight: 700; }
.secondary-action:hover, .campaign-picker-list button:hover { background: var(--accent-soft); transform: none; }
.campaign-groups-list li { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 13px; }
.campaign-groups-list li > span { min-width: 0; }
.campaign-groups-list li > button { flex: 0 0 auto; padding: 6px 8px; border: 0; background: transparent; color: var(--danger); font-size: 11px; font-weight: 700; }
.campaign-groups-list li > button:hover { background: #fff0ed; transform: none; }
.campaign-invite-link { display: inline-block; margin-top: 9px; color: var(--accent-dark); font-size: 11px; font-weight: 700; text-decoration: underline; }
.campaign-groups-list li > .campaign-group-link-button { color: var(--accent-dark); white-space: nowrap; }
.campaign-groups-list li > .campaign-group-link-button:hover { background: var(--accent-soft); }
.campaign-group-directory { display: flex; flex-direction: column; gap: 9px; }
#campaign-groups-panel .campaign-head-actions > button { display: none; }
.campaign-group-tools { display: grid; gap: 12px; margin-top: 22px; }
.campaign-group-tool-row { display: flex; flex-wrap: wrap; gap: 8px; }
.campaign-group-tool-row button, .campaign-group-bulk button { min-height: 36px; padding: 8px 12px; border: 1px solid #b5d4d3; color: var(--accent-dark); background: #eef8f6; font-size: 11px; }
.campaign-group-tool-row button:hover, .campaign-group-tool-row button.is-active { color: #fff; background: var(--accent); }
.campaign-group-tool-row button:disabled { opacity: .46; cursor: not-allowed; }
.campaign-group-search { margin: 0; }
.campaign-group-search input { margin-top: 6px; }
.campaign-group-bulk { display: flex; align-items: center; justify-content: space-between; gap: 14px; padding-top: 10px; border-top: 1px solid var(--line); }
.campaign-group-bulk label { display: inline-flex; align-items: center; gap: 7px; margin: 0; white-space: nowrap; }
.campaign-group-bulk label input { width: 17px; height: 17px; accent-color: var(--accent); }
.campaign-group-bulk > div { display: flex; flex-wrap: wrap; gap: 7px; }
.campaign-group-bulk [data-group-tool="remove"] { color: var(--danger); border-color: #e7c9c2; background: #fff7f5; }
.campaign-group-results { margin-top: 14px; padding: 12px; border: 1px solid var(--line); border-radius: 8px; color: var(--muted); background: #f8fbfc; font-size: 12px; }
.campaign-group-directory .campaign-group-row { display: grid; grid-template-columns: 18px minmax(0, 1fr) minmax(220px, .75fr) auto; align-items: center; gap: 18px; padding: 16px 18px; }
.campaign-group-directory .campaign-group-row[hidden] { display: none; }
.campaign-group-directory .campaign-group-row > input[data-select-group] { width: 18px; height: 18px; margin: 0; accent-color: var(--accent); }
.campaign-group-directory .campaign-group-row.is-entry-closed { border-color: #e7c9c2; background: #fffaf8; }
.campaign-group-identity { min-width: 0; }
.campaign-group-directory .campaign-group-identity strong { font-size: 13px; }
.campaign-group-directory .campaign-group-identity small { line-height: 1.4; }
.campaign-group-metrics { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
.campaign-group-metrics > div { min-width: 0; padding-left: 14px; border-left: 1px solid var(--line); }
.campaign-group-directory .campaign-group-metrics strong { color: var(--ink); font-size: 19px; line-height: 1.1; }
.campaign-group-directory .campaign-group-metrics small { line-height: 1.35; }
.campaign-group-actions { display: flex; flex-direction: column; align-items: flex-end; gap: 4px; }
.campaign-group-actions button { padding: 6px 8px; border: 0; border-radius: 6px; background: transparent; font-size: 11px; font-weight: 700; white-space: nowrap; }
.campaign-group-actions .campaign-group-entry-button { padding: 8px 10px; border: 1px solid var(--danger); color: var(--danger); }
.campaign-group-actions .campaign-group-entry-button:hover { background: #fff0ed; }
.campaign-group-actions .campaign-group-entry-button.is-entry-closed { border-color: var(--accent); color: var(--accent-dark); }
.campaign-group-actions .campaign-group-entry-button.is-entry-closed:hover { background: var(--accent-soft); }
.campaign-group-actions .campaign-group-entry-button:disabled { opacity: .55; cursor: not-allowed; }
.campaign-group-actions .campaign-group-link-button { color: var(--accent-dark); }
.campaign-group-actions .campaign-group-link-button:hover { background: var(--accent-soft); }
.campaign-group-actions .campaign-group-remove-button { color: var(--danger); }
.campaign-group-actions .campaign-group-remove-button:hover { background: #fff0ed; }
@media (max-width: 760px) { .campaign-group-directory .campaign-group-row { grid-template-columns: 18px minmax(0, 1fr); gap: 13px; } .campaign-group-metrics, .campaign-group-actions { grid-column: 2; } .campaign-group-actions { flex-direction: row; align-items: center; } .campaign-group-bulk { align-items: flex-start; flex-direction: column; } }
.campaign-variable-form { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 2fr) auto; align-items: end; gap: 12px; margin: 24px 0 12px; }
.campaign-variable-form .field { min-width: 0; }
.campaign-variable-form button { min-height: 47px; }
.campaign-variables-panel { margin-top: 24px; }
.campaign-variables-panel code { color: var(--accent-dark); font-weight: 700; }
.campaign-webhooks-panel { margin-top: 24px; }
.campaign-webhook-form { margin: 24px 0; padding: 22px; border: 1px solid var(--border, #d6e2e7); border-radius: 16px; background: #f8fbfb; }
.campaign-webhook-fields { display: grid; grid-template-columns: minmax(180px, 1fr) minmax(260px, 2fr); gap: 16px; }
.campaign-webhook-form h3 { margin: 24px 0 14px; }
.campaign-webhook-events { display: grid; gap: 18px; grid-template-columns: repeat(3, minmax(0, 1fr)); }
.campaign-webhook-events fieldset { min-width: 0; padding: 14px; border: 1px solid #d6e2e7; border-radius: 12px; }
.campaign-webhook-events legend { padding: 0 6px; font-weight: 800; }
.campaign-webhook-event { display: flex; align-items: flex-start; gap: 10px; padding: 9px 0; cursor: pointer; }
.campaign-webhook-event input { margin-top: 4px; flex: none; }
.campaign-webhook-event strong, .campaign-webhook-event small { display: block; }
.campaign-webhook-event small { margin-top: 3px; color: #6b8491; line-height: 1.35; }
.campaign-webhook-actions, .campaign-webhook-card-actions { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 20px; }
.campaign-webhook-secret-box { margin: 18px 0; padding: 18px; border-radius: 12px; background: #e3f4ef; }
.campaign-webhook-list { display: grid; gap: 14px; margin: 20px 0 28px; }
.campaign-webhook-card { display: flex; justify-content: space-between; gap: 18px; padding: 18px; border: 1px solid #d6e2e7; border-radius: 14px; overflow-wrap: anywhere; }
.campaign-webhook-card h3 { margin: 0 0 7px; }
.campaign-webhook-card code { display: block; font-size: 12px; }
.campaign-webhook-card-actions { align-content: flex-start; margin: 0; }
.campaign-webhook-deliveries { display: grid; gap: 8px; }
.campaign-webhook-delivery { display: flex; align-items: center; gap: 12px; padding: 12px 14px; border: 1px solid #d6e2e7; border-radius: 10px; }
.campaign-webhook-delivery span { flex: 1; }
.campaign-webhook-delivery.is-succeeded strong { color: #197c54; }
.campaign-webhook-delivery.is-failed strong { color: #bd4a38; }
@media (max-width: 900px) { .campaign-webhook-events, .campaign-webhook-fields { grid-template-columns: 1fr; } .campaign-webhook-card { flex-direction: column; } }
@media (max-width: 700px) { .campaign-variable-form { grid-template-columns: 1fr; } }
.campaign-picker { width: min(580px, calc(100vw - 28px)); max-height: min(680px, calc(100vh - 28px)); padding: 24px; border: 1px solid var(--line); border-radius: 15px; box-shadow: 0 28px 70px #092d4260; color: var(--ink); }
.campaign-picker::backdrop { background: #0c2835a8; }
.campaign-picker-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 16px; }
.campaign-picker-head h2 { margin: 0 0 16px; font-size: 20px; }
.picker-close { width: 33px; height: 33px; padding: 0; border: 0; border-radius: 50%; background: var(--canvas); color: var(--ink); font-size: 25px; line-height: 1; }
.campaign-picker-list { display: flex; flex-direction: column; gap: 8px; max-height: 390px; overflow-y: auto; margin: 14px 0 0; padding: 0; list-style: none; }
.campaign-picker-list li { display: flex; align-items: center; justify-content: space-between; gap: 14px; padding: 12px; border: 1px solid var(--line); border-radius: 9px; }
.campaign-picker-list li span { min-width: 0; }
.campaign-picker-list strong, .campaign-picker-list small { display: block; overflow-wrap: anywhere; }
.campaign-picker-list strong { font-size: 12px; }
.campaign-picker-list small { margin-top: 4px; color: var(--muted); font-size: 10px; }
.campaign-templates-dialog { width: min(920px, calc(100% - 28px)); max-height: calc(100dvh - 28px); overflow-y: auto; padding: 0 20px 20px; border: 1px solid var(--line); border-radius: 14px; color: var(--ink); background: #f8fbfc; box-shadow: 0 25px 90px rgba(11, 36, 47, .25); }
.campaign-templates-dialog::backdrop { background: rgba(13, 40, 54, .58); }
.campaign-templates-dialog-head { position: sticky; z-index: 1; top: 0; display: flex; align-items: flex-start; justify-content: space-between; gap: 16px; margin: 0 -20px 18px; padding: 20px; border-bottom: 1px solid var(--line); background: #f8fbfc; }
.campaign-templates-dialog-head h2 { margin: 4px 0; font-size: 22px; }
.campaign-templates-dialog-head p:last-child { margin: 0; color: var(--muted); font-size: 12px; }
.campaign-templates-dialog > .content-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.campaign-action-grid { order: 1; }
.action-detail-panel { order: 3; }
.action-composer-label { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.action-wizard-native-select { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
.action-wizard-nav { margin: 0 0 26px; overflow-x: auto; }
.action-wizard-nav ol { display: grid; grid-template-columns: repeat(6, minmax(90px, 1fr)); min-width: 600px; gap: 0; margin: 0; padding: 0; list-style: none; }
.action-wizard-nav li { position: relative; display: grid; justify-items: center; gap: 8px; color: #8297a0; font-size: 11px; font-weight: 800; text-align: center; }
.action-wizard-nav li:not(:last-child)::after { position: absolute; top: 17px; left: calc(50% + 18px); width: calc(100% - 36px); height: 2px; content: ''; background: #d7e5e7; }
.action-wizard-nav li[data-state="done"]::after { background: var(--accent); }
.action-wizard-nav li > span:first-child { display: grid; place-items: center; width: 36px; height: 36px; border-radius: 50%; color: #69828c; background: #e8f0f1; font-size: 14px; }
.action-wizard-nav li[data-state="current"], .action-wizard-nav li[data-state="done"] { color: var(--ink); }
.action-wizard-nav li[data-state="current"] > span:first-child, .action-wizard-nav li[data-state="done"] > span:first-child { color: white; background: var(--accent); }
.action-wizard-panel { min-height: 250px; }
.action-wizard-panel > h3 { margin: 5px 0 7px; color: var(--ink); font-size: clamp(20px, 2.4vw, 27px); letter-spacing: -.035em; }
.action-wizard-panel > .field-help { margin: 0 0 19px; }
.action-wizard-message { min-height: 0; margin: 0 0 12px; }
.action-wizard-options { display: grid; gap: 10px; }
.action-wizard-option { display: flex; justify-content: space-between; align-items: center; gap: 18px; width: 100%; min-height: 74px; padding: 15px 18px; border: 1px solid var(--line); border-radius: 11px; color: var(--ink); background: #fbfdfd; text-align: left; box-shadow: none; }
.action-wizard-option:hover { border-color: var(--accent); background: #f1faf8; transform: none; }
.action-wizard-option[aria-pressed="true"] { border-color: var(--accent); background: var(--accent-soft); box-shadow: inset 4px 0 0 var(--accent); }
.action-wizard-option strong, .action-wizard-option small { display: block; }
.action-wizard-option strong { font-size: 14px; }
.action-wizard-option small { margin-top: 4px; color: var(--muted); font-size: 11px; font-weight: 500; line-height: 1.4; }
.action-wizard-option-mark { flex: 0 0 auto; color: var(--accent-dark); font-size: 21px; font-weight: 800; }
.action-wizard-context { padding: 20px; border: 1px solid var(--line); border-radius: 11px; color: var(--ink); background: #f5faf9; font-size: 18px; font-weight: 800; }
.action-wizard-controls { display: flex; justify-content: space-between; gap: 10px; margin-top: 22px; padding-top: 18px; border-top: 1px solid var(--line); }
.action-wizard-controls #action-wizard-next { margin-left: auto; }
.action-wizard-summary { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; margin: 0 0 20px; }
.action-wizard-summary > div { min-width: 0; padding: 13px; border: 1px solid var(--line); border-radius: 9px; background: #f8fbfa; }
.action-wizard-summary dt { color: var(--muted); font-size: 10px; font-weight: 800; text-transform: uppercase; letter-spacing: .08em; }
.action-wizard-summary dd { margin: 5px 0 0; color: var(--ink); font-size: 12px; font-weight: 700; overflow-wrap: anywhere; }
.action-composer-label strong { font-size: 12px; color: var(--ink); }
.action-composer-search-label { margin-top: 10px; font-size: 11px; }
.action-composer-search-label input { margin-top: 5px; height: 39px; }
#action-composer-selection-note { margin: 7px 0 0; }
.action-composer-group-list { display: grid; gap: 8px; min-width: 0; max-height: 280px; overflow-x: hidden; overflow-y: auto; margin-top: 10px; }
.action-composer-group-list label { display: flex; align-items: flex-start; gap: 11px; width: 100%; min-width: 0; min-height: 56px; margin: 0; padding: 11px 13px; border: 1px solid var(--line); border-radius: 9px; background: #fbfdfe; cursor: pointer; }
.action-composer-group-list label:hover { border-color: #83bdb5; }
.action-composer-group-list label:has(input:checked) { border-color: var(--accent); background: var(--accent-soft); box-shadow: inset 3px 0 0 var(--accent); }
.action-composer-group-list input[type="checkbox"] { width: 19px; height: 19px; min-width: 19px; flex: 0 0 19px; margin: 1px 0 0; padding: 0; accent-color: var(--accent); }
.action-composer-group-list span { flex: 1 1 auto; min-width: 0; overflow-wrap: anywhere; }
.action-composer-group-list strong, .action-composer-group-list small { display: block; }
.action-composer-group-list strong { color: var(--ink); font-size: 12px; line-height: 1.35; }
.action-composer-group-list small { margin-top: 4px; color: var(--muted); font-size: 11px; font-weight: 500; line-height: 1.35; }
.action-composer-group-list label:focus-within { outline: 3px solid #73cbbf; outline-offset: 2px; }
.action-sender-panel { margin: 18px 0; padding: 16px; border: 1px solid var(--line); border-radius: 10px; background: #f8fbfa; }
.action-sender-mode { display: grid; gap: 10px; min-width: 0; margin: 15px 0 0; padding: 0; border: 0; }
.action-sender-mode legend { margin-bottom: 9px; color: var(--ink); font-size: 12px; font-weight: 750; }
.action-sender-mode-option { display: flex; align-items: center; justify-content: space-between; gap: 12px; min-height: 63px; padding: 15px 18px; border: 1px solid var(--line); border-radius: 11px; background: white; color: var(--ink); font-size: 14px; font-weight: 750; cursor: pointer; }
.action-sender-mode-option:hover { border-color: var(--accent); }
.action-sender-mode-option:has(input:checked) { border-color: var(--accent); background: var(--accent-soft); }
.action-sender-mode-option:focus-within { outline: 3px solid #73cbbf; outline-offset: 2px; }
.action-sender-mode-option input { flex: 0 0 auto; width: 19px; height: 19px; margin: 0; accent-color: var(--accent); }
.action-sender-instances { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 270px), 1fr)); gap: 10px; margin-top: 14px; }
.action-sender-instances[hidden] { display: none; }
.action-sender-account { display: flex; align-items: center; gap: 12px; min-width: 0; margin: 0; padding: 13px; border: 1px solid var(--line); border-radius: 10px; background: white; cursor: pointer; }
.action-sender-account:has(input:checked) { border-color: var(--accent); background: var(--accent-soft); }
.action-sender-account.is-unavailable { opacity: .62; cursor: not-allowed; }
.action-sender-account:focus-within { outline: 3px solid #73cbbf; outline-offset: 2px; }
.action-sender-account input { flex: 0 0 auto; width: 18px; height: 18px; accent-color: var(--accent); }
.action-sender-avatar { position: relative; display: grid; flex: 0 0 48px; width: 48px; height: 48px; place-items: center; overflow: hidden; border-radius: 50%; background: #dcece8; color: var(--accent-dark); font-size: 20px; font-weight: 800; }
.action-sender-avatar img { position: absolute; width: 100%; height: 100%; object-fit: cover; }
.action-sender-details { display: grid; gap: 2px; min-width: 0; }
.action-sender-details strong, .action-sender-details small { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.action-sender-details strong { color: var(--ink); font-size: 13px; }
.action-sender-details small { color: var(--muted); font-size: 11px; }
.message-sequence-panel { margin-top: 18px; }
.message-sequence-layout { display: grid; grid-template-columns: minmax(290px, 1.2fr) minmax(340px, 1.4fr) minmax(245px, .9fr); gap: 16px; align-items: start; }
.message-sequence-layout > * { min-width: 0; min-height: 550px; padding: 20px; border: 1px solid var(--line); border-radius: 12px; background: #f8fbfa; }
.message-sequence-main { background: white; }
.message-sequence-heading { display: flex; justify-content: space-between; gap: 10px; align-items: center; margin-bottom: 13px; color: var(--ink); }
.message-sequence-heading strong, .message-sequence-settings > strong { font-size: 14px; font-weight: 800; }
.message-sequence-heading span { color: var(--muted); font-size: 11px; font-weight: 700; white-space: nowrap; }
.message-sequence-list { display: grid; align-content: start; gap: 13px; min-height: 360px; max-height: 600px; overflow-y: auto; margin: 0 0 13px; padding: 17px; border-radius: 10px; background: radial-gradient(circle at 15% 20%, #dcebe8 0 2px, transparent 3px), radial-gradient(circle at 80% 60%, #dcebe8 0 2px, transparent 3px), #edf5f3; background-size: 45px 45px, 60px 60px, auto; list-style: none; }
.message-sequence-empty { align-self: center; padding: 22px 14px; color: var(--muted); font-size: 12px; line-height: 1.6; text-align: center; }
.message-sequence-item { min-width: 0; padding: 10px; border: 1px solid #b6ddd4; border-radius: 13px 13px 4px 13px; background: #def3e9; box-shadow: 0 2px 5px rgba(20, 64, 60, .05); }
.message-sequence-item.is-active { border-color: var(--accent); background: var(--accent-soft); }
.message-sequence-item button { border: 0; box-shadow: none; background: transparent; color: var(--accent-dark); }
.message-sequence-item button:hover { background: #c9e8e1; transform: none; }
.message-sequence-item .message-sequence-select { display: block; width: 100%; min-width: 0; padding: 7px; text-align: left; color: var(--ink); }
.message-sequence-select strong, .message-sequence-select small { display: block; }
.message-sequence-select strong { margin-bottom: 9px; color: var(--accent-dark); font-size: 12px; }
.message-sequence-select small { margin-top: 9px; color: var(--accent-dark); font-size: 10px; font-weight: 700; }
.message-preview-content { display: block; white-space: pre-wrap; overflow-wrap: anywhere; font-size: 13px; line-height: 1.55; font-weight: 500; }
.message-preview-image { display: block; width: 100%; max-height: 250px; margin: 8px 0; border-radius: 8px; object-fit: contain; background: #f8fbfa; }
.message-preview-actions { display: flex; justify-content: flex-end; gap: 5px; margin-top: 6px; padding-top: 6px; border-top: 1px solid #b6ddd4; }
.message-preview-actions button { min-width: 32px; min-height: 30px; padding: 4px 7px; font-size: 15px; }
.message-sequence-types { display: flex; flex-wrap: wrap; gap: 6px; padding-top: 13px; border-top: 1px solid var(--line); }
.message-sequence-types button { min-height: 32px; padding: 6px 9px; border: 1px solid var(--accent); border-radius: 18px; box-shadow: none; background: white; color: var(--accent-dark); font-size: 11px; }
.message-sequence-types button:hover { background: var(--accent-soft); transform: none; }
.message-sequence-types button:disabled { opacity: .45; cursor: not-allowed; }
.message-sequence-main .field { margin-bottom: 13px; }
.sequence-poll-options-label { display: block; margin-bottom: 10px; color: var(--ink); font-size: 12px; font-weight: 800; }
.sequence-poll-options { display: grid; gap: 10px; }
.sequence-poll-option { position: relative; padding: 12px; border: 1px solid var(--line); border-radius: 10px; background: #f8fbfa; }
.sequence-poll-option label { display: block; margin-bottom: 7px; font-size: 11px; }
.sequence-poll-option input { width: 100%; min-height: 42px; padding-right: 38px; background: white; }
.sequence-poll-remove { position: absolute; right: 17px; bottom: 18px; width: 28px; min-height: 28px; padding: 0; border: 0; border-radius: 6px; color: var(--danger); background: transparent; box-shadow: none; font-size: 21px; }
.sequence-poll-remove:hover { background: #fbecea; transform: none; }
.sequence-poll-add { margin-top: 12px; min-height: 38px; }
.sequence-poll-add:disabled { opacity: .5; cursor: not-allowed; }
.sequence-format-toolbar { display: inline-flex; overflow: hidden; margin-bottom: 10px; border: 1px solid var(--line); border-radius: 8px; }
.sequence-format-toolbar button { min-height: 34px; min-width: 36px; padding: 6px 9px; border: 0; border-right: 1px solid var(--line); border-radius: 0; background: #f8fbfa; color: var(--ink); box-shadow: none; }
.sequence-format-toolbar button:last-child { border-right: 0; }
.sequence-format-toolbar button:hover { background: var(--accent-soft); transform: none; }
.message-sequence-main textarea { min-height: 285px; }
.message-sequence-editor-actions { display: flex; flex-wrap: wrap; gap: 9px; justify-content: flex-end; margin-top: 20px; padding-top: 15px; border-top: 1px solid var(--line); }
.message-sequence-editor-actions button { min-height: 39px; }
.message-sequence-main input[type="file"] { padding: 9px; }
.message-sequence-main .field-help { margin-top: 5px; }
.message-sequence-settings .checkbox-field { margin: 16px 0 18px; }
.message-sequence-settings .field { margin-bottom: 18px; }
.message-setting { min-width: 0; margin: 18px 0 0; padding: 0; border: 0; }
.message-setting legend { margin-bottom: 9px; padding: 0; color: var(--ink); font-size: 13px; font-weight: 800; }
.message-setting-choices { display: flex; flex-wrap: wrap; gap: 5px; }
.message-setting-choices label { position: relative; flex: 1 1 auto; cursor: pointer; }
.message-setting-choices input { position: absolute; width: 1px; height: 1px; opacity: 0; }
.message-setting-choices span { display: block; min-height: 33px; padding: 7px 8px; border: 1px solid var(--line); border-radius: 7px; background: white; color: var(--ink); font-size: 11px; font-weight: 700; text-align: center; white-space: nowrap; }
.message-setting-choices input:checked + span { border-color: var(--accent); background: var(--accent-soft); color: var(--accent-dark); }
.message-setting-choices input:focus-visible + span { outline: 3px solid var(--accent); outline-offset: 2px; }
.message-setting:disabled .message-setting-choices label { cursor: not-allowed; }
.message-setting:disabled .message-setting-choices span { opacity: .55; }
.message-setting .field-help { margin-top: 8px; }
.message-setting-custom { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; margin-top: 10px; }
.message-setting-custom .field { margin: 0; }
.message-setting-custom label { font-size: 11px; }
.message-setting-custom input { min-width: 0; }
#message-gap-field { margin: 10px 0 0; }
.message-sequence-panel > .form-message { margin-top: 10px; }
@media (max-width: 1250px) { .message-sequence-layout { grid-template-columns: minmax(250px, .9fr) minmax(320px, 1.1fr); } .message-sequence-settings { grid-column: 1 / -1; min-height: 0; } }
@media (max-width: 650px) { .message-sequence-layout { grid-template-columns: 1fr; } .message-sequence-layout > * { min-height: 0; } }
@media (max-width: 600px) { .action-wizard-summary { grid-template-columns: 1fr; } .action-wizard-nav ol { min-width: 540px; } }
.action-composer-plan { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
.action-composer-plan .field { min-width: 0; }
.action-composer-plan .field:first-child { grid-column: 1 / -1; }
.action-composer-footer { display: flex; flex-wrap: wrap; gap: 8px; }
.action-composer-footer .form-message { flex-basis: 100%; }
.action-composer-footer .secondary-action { background: white; }
#action-composer-confirmation { padding: 14px; border: 1px solid #e8c8c1; border-radius: 9px; background: #fff8f6; }
#action-composer-confirmation .field { margin-top: 0; }
#action-template-field textarea { min-height: 170px; }
.action-message-preview { margin: 18px 0 6px; padding: 17px 19px; border: 1px solid #beddd7; border-left: 4px solid var(--accent); border-radius: 9px; background: #f6fbf9; }
.action-message-preview strong { display: block; color: var(--accent-dark); font-size: 11px; text-transform: uppercase; letter-spacing: .09em; }
.action-message-preview p { margin: 10px 0; white-space: pre-wrap; overflow-wrap: anywhere; font-size: 13px; line-height: 1.55; }
.action-message-preview small { color: var(--muted); font-size: 11px; }
.action-delivery-panel { margin-top: 20px; padding: 19px; border: 1px solid #bdd8d6; border-radius: 10px; background: #f7fbfa; }
.action-delivery-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 16px; }
.action-delivery-head strong { display: block; color: var(--ink); font-size: 14px; }
.action-delivery-head p { margin: 5px 0 0; color: var(--muted); font-size: 11px; line-height: 1.5; }
.action-delivery-head button { flex: 0 0 auto; min-height: 34px; padding: 7px 11px; color: var(--accent-dark); border: 1px solid #a5d1ca; background: white; font-size: 11px; }
.action-delivery-head button:hover { background: var(--accent-soft); }
.action-delivery-counts { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 8px; margin-top: 18px; }
.delivery-count { display: flex; flex-direction: column; gap: 2px; min-width: 0; padding: 9px 10px; border-top: 3px solid #b8cbd0; background: white; }
.delivery-count strong { color: var(--ink); font: 700 20px 'SFMono-Regular', Consolas, monospace; line-height: 1.1; }
.delivery-count small { color: var(--muted); font-size: 10px; }
.delivery-count-succeeded { border-color: var(--accent); }
.delivery-count-failed, .delivery-count-uncertain { border-color: var(--danger); }
.action-target-row[data-status="succeeded"] { border-left: 3px solid var(--accent); }
.action-target-row[data-status="failed"], .action-target-row[data-status="uncertain"] { border-left: 3px solid var(--danger); }
.action-target-row[data-status="processing"] { border-left: 3px solid #c58d4a; }
.campaign-groups-list .action-target-outcome { color: var(--ink); font-weight: 700; }
.campaign-groups-list .action-target-row[data-status="failed"] .action-target-outcome,
.campaign-groups-list .action-target-row[data-status="uncertain"] .action-target-outcome { color: var(--danger); }
.campaign-groups-list .action-target-timing { font-family: 'SFMono-Regular', Consolas, monospace; font-size: 10px; line-height: 1.45; }
.action-schedule-panel { display: flex; align-items: center; justify-content: space-between; gap: 20px; margin-top: 18px; padding: 18px 20px; border: 1px solid #a9d7cd; border-radius: 10px; background: #eff9f5; }
.action-schedule-panel strong { color: var(--accent-dark); font-size: 13px; }
.action-schedule-panel p { margin: 6px 0 0; max-width: 620px; color: var(--muted); font-size: 11px; line-height: 1.5; }
.action-schedule-panel button { flex: 0 0 auto; min-height: 40px; }
.action-cancel-button { margin-top: 14px; padding: 8px 0; background: transparent; color: var(--danger); font-size: 12px; font-weight: 700; box-shadow: none; }
.action-cancel-button:hover { background: transparent; text-decoration: underline; transform: none; }
.campaign-tabs button:focus-visible, .secondary-action:focus-visible, .campaign-picker button:focus-visible, .campaign-rotation-dialog button:focus-visible, .campaign-list-button:focus-visible, #campaign-new-button:focus-visible, .campaign-overview-links button:focus-visible, #campaign-back-link:focus-visible, .campaign-create-back:focus-visible { outline: 3px solid #73cbbf; outline-offset: 2px; }
@media (max-width: 850px) {
  .campaign-top-grid, .campaign-templates-dialog > .content-grid { grid-template-columns: 1fr; }
  .campaign-overview-stats { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .campaign-groups-list { grid-template-columns: 1fr; }
  .campaign-groups-head { flex-direction: column; }
  .campaign-head-actions { justify-content: flex-start; }
  .campaign-tabs button { flex: 0 0 auto; }
  .action-schedule-panel { flex-direction: column; align-items: stretch; }
  .action-delivery-counts { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .action-delivery-head { flex-direction: column; }
}
@media (max-width: 600px) {
  .campaigns-heading, .campaign-dashboard-title { align-items: stretch; flex-direction: column; }
  #campaign-new-button { width: 100%; }
  .campaign-overview-stats, .campaign-overview-links { grid-template-columns: 1fr; }
  .campaign-overview-intro { padding: 22px; }
}
@media (max-width: 420px) {
  .action-history-head { flex-direction: column; }
  .action-composer-label { flex-wrap: wrap; }
  .action-composer-label button { width: 100%; }
  .action-composer-group-list { max-height: 300px; }
  .action-history-controls { grid-template-columns: 1fr; }
  .action-review-head { padding: 20px; }
  .action-review-list { padding: 6px 20px; }
  .action-review-footer { flex-direction: column-reverse; padding: 14px 20px 20px; }
  .action-review-footer button { width: 100%; }
  .action-delivery-counts { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .action-composer-plan { grid-template-columns: 1fr; }
  .action-composer-footer button { width: 100%; }
}
.action-execute-form button { background: #9a3e31; }
.action-execute-form button:hover { background: #7b3026; }
.status-rule { height: 1px; margin: 23px 0 24px; background: #e4ebef; }
.step-list { display: flex; flex-direction: column; gap: 22px; margin: 0; padding: 0; list-style: none; }
.step-list li { display: flex; align-items: flex-start; gap: 13px; color: #8095a1; }
.step-list li > span { width: 24px; height: 24px; min-width: 24px; display: grid; place-items: center; border: 1px solid #d4e0e6; border-radius: 50%; font: 700 10px 'SFMono-Regular', Consolas, monospace; }
.step-list strong { display: block; color: #6f8591; font-size: 12px; line-height: 1.3; }
.step-list small { display: block; margin-top: 4px; font-size: 10px; }
.step-list .step-current > span { border-color: var(--accent); color: white; background: var(--accent); }
.step-list .step-current strong { color: #274556; }
.local-note { max-width: 280px; margin: 0 7px; color: #758b98; font-size: 11px; line-height: 1.6; }

@media (max-width: 1020px) {
  .sidebar { width: 205px; min-width: 205px; }
  .content-grid { grid-template-columns: minmax(0, 1fr); }
  .status-column { display: grid; grid-template-columns: minmax(0, 1fr) minmax(180px, .5fr); align-items: start; }
  .local-note { padding-top: 8px; }
}

@media (max-width: 700px) {
  .app-shell { display: block; }
  .sidebar { width: 100%; min-width: 0; min-height: 0; padding: 14px 18px; }
  .brand { padding: 0; }
  .brand strong { font-size: 17px; }
  .nav-list { display: flex; flex-direction: row; gap: 6px; margin-top: 14px; overflow-x: auto; }
  .nav-list .nav-label, .nav-list .nav-disabled { display: none; }
  .nav-list .nav-item { flex-shrink: 0; height: 36px; padding: 0 10px; font-size: 12px; }
  .nav-list .nav-icon { font-size: 17px; }
  .sidebar-footer { display: none; }
  .topbar { height: 52px; padding: 0 19px; }
  .sidebar-toggle-label { display: none; }
  .topbar-leading { gap: 8px; }
  .topbar-actions { gap: 8px; }
  .user-email { display: none; }
  .environment-pill { font-size: 10px; }
  .content-wrap { padding: 33px 18px 50px; }
  .heading-row { margin-bottom: 27px; }
  .connection-graphic { display: none; }
  .intro { font-size: 13px; }
  .workspace-picker { align-items: flex-start; flex-direction: column; gap: 7px; }
  .workspace-picker select { max-width: 100%; }
  .connection-directory-head { flex-wrap: wrap; }
  .connection-directory-toolbar { grid-template-columns: 1fr; }
  .blacklist-form { grid-template-columns: 1fr; }
  .card-head { padding: 24px 22px; }
  form { padding: 25px 22px 0; }
  .form-footer { margin: 0 -22px; padding: 17px 22px; }
  .status-column { display: flex; }
  .local-note { max-width: none; }
  .campaign-groups-list { grid-template-columns: 1fr; }
  .action-plan-form { grid-template-columns: 1fr; }
}

@media (max-width: 480px) {
  .form-footer { flex-direction: column; align-items: stretch; }
  .form-message { min-height: 0; }
  button { width: 100%; }
  .campaign-tabs button { width: auto; }
  .topbar-actions button, .auth-card form button { width: auto; }
  .environment-pill { display: none; }
  .connection-actions { grid-template-columns: 1fr; }
}

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