:root {
  color-scheme: dark;
  --ink: #070908;
  --surface: #0d110f;
  --surface-2: #131816;
  --line: #27302b;
  --line-soft: #1c231f;
  --text: #f3f5ef;
  --muted: #95a098;
  --acid: #b8ff39;
  --mint: #47e59b;
  --yellow: #ffd52d;
  --red: #ff6257;
  --sidebar: 230px;
}

* { box-sizing: border-box; }
html { min-width: 320px; background: var(--ink); }
body { margin: 0; min-height: 100vh; color: var(--text); background: radial-gradient(circle at 84% 3%, #152419 0, transparent 28%), var(--ink); font-family: Aptos, "Segoe UI Variable Text", "Trebuchet MS", sans-serif; }
button, input, select { font: inherit; }
button { color: inherit; }
h1, h2, h3, p { margin-top: 0; }
h1, h2 { font-family: Bahnschrift, "Segoe UI Variable Display", sans-serif; letter-spacing: -.035em; }
h1 { margin-bottom: 4px; font-size: clamp(27px, 3vw, 42px); line-height: 1; }
h2 { margin-bottom: 8px; font-size: 22px; }
.muted { color: var(--muted); }
.small { font-size: 12px; }
.eyebrow { margin-bottom: 8px; color: var(--acid); font-size: 11px; font-weight: 800; letter-spacing: .17em; }
.hidden { display: none !important; }

.app-shell { display: grid; grid-template-columns: var(--sidebar) 1fr; min-height: 100vh; }
.sidebar { position: fixed; inset: 0 auto 0 0; width: var(--sidebar); display: flex; flex-direction: column; padding: 26px 18px; border-right: 1px solid var(--line-soft); background: rgba(8, 11, 9, .93); backdrop-filter: blur(18px); z-index: 5; }
.brand { display: flex; align-items: center; gap: 10px; font: 700 19px Bahnschrift, sans-serif; }
.brand-mark { display: grid; width: 36px; height: 36px; place-items: center; color: #081008; border-radius: 11px 4px 11px 4px; background: var(--acid); font-size: 12px; font-weight: 900; box-shadow: 0 0 28px #b8ff3930; }
.sidebar nav { display: grid; gap: 7px; margin-top: 54px; }
.nav-item { display: flex; align-items: center; gap: 12px; width: 100%; padding: 12px 13px; border: 1px solid transparent; border-radius: 10px; background: transparent; color: var(--muted); text-align: left; cursor: pointer; }
.nav-item span { color: #69756d; font-size: 19px; }
.nav-item:hover, .nav-item.active { color: var(--text); border-color: var(--line); background: #151b17; }
.nav-item.active span { color: var(--acid); }
.sidebar-foot { display: flex; align-items: center; justify-content: space-between; gap: 10px; margin-top: auto; padding: 16px 8px 0; border-top: 1px solid var(--line-soft); }
.text-button { padding: 0; border: 0; background: none; color: var(--acid); font-weight: 700; cursor: pointer; }

.workspace { grid-column: 2; width: min(100%, 1580px); padding: 26px clamp(24px, 4vw, 68px) 80px; }
.topbar, .hero-row, .section-head, .panel-heading, .button-row, .top-actions { display: flex; align-items: center; justify-content: space-between; gap: 18px; }
.topbar { min-height: 62px; margin-bottom: 20px; }
.top-actions { justify-content: flex-end; flex-wrap: wrap; }
.topbar #edit-campaign, .topbar #new-campaign, .topbar #connection-pill, .topbar #connect-button { display: none; }
.topbar[data-view="campaigns"] .campaign-picker, .topbar[data-view="connection"] .campaign-picker, .topbar[data-view="members"] .campaign-picker,
.topbar[data-view="campaigns"] #campaign-label, .topbar[data-view="connection"] #campaign-label, .topbar[data-view="members"] #campaign-label,
.topbar[data-view="campaigns"] #sync-button, .topbar[data-view="connection"] #sync-button, .topbar[data-view="members"] #sync-button,
.topbar[data-view="history"] #sync-button, .topbar[data-view="sales"] #sync-button, .topbar[data-view="links"] #sync-button { display: none; }
.status-pill { display: inline-flex; align-items: center; gap: 8px; padding: 9px 12px; border: 1px solid var(--line); border-radius: 999px; color: var(--muted); font-size: 13px; }
.status-pill i { width: 8px; height: 8px; border-radius: 99px; background: var(--red); box-shadow: 0 0 12px #ff625780; }
.status-pill.online i { background: var(--mint); box-shadow: 0 0 12px #47e59b80; }
.status-pill.online { color: var(--text); }
.button { min-height: 42px; padding: 0 17px; border: 1px solid var(--line); border-radius: 10px; background: var(--surface-2); font-weight: 800; cursor: pointer; transition: transform .16s ease, border-color .16s ease, opacity .16s ease; }
.button:hover { transform: translateY(-1px); border-color: #4b5a51; }
.button:disabled { opacity: .45; cursor: wait; transform: none; }
.button.primary { color: #0c120a; border-color: var(--acid); background: var(--acid); }
.button.secondary { background: #141a16; }
.button.ghost { background: transparent; }
.button.danger { color: white; border-color: #71352f; background: #351b18; }
.button.wide { width: 100%; }
.view { display: none; }
.view.active { display: block; animation: enter .25s ease; }
@keyframes enter { from { opacity: 0; transform: translateY(5px); } }
.hero-row { margin-bottom: 18px; }
.hero-row .muted { margin: 0; }
.inline-link { padding: 0; border: 0; background: none; color: var(--acid); font: inherit; font-weight: 700; cursor: pointer; text-decoration: underline; text-underline-offset: 3px; }
.inline-link:hover, .inline-link:focus-visible { color: var(--yellow); }
.segmented { display: flex; gap: 4px; padding: 4px; border: 1px solid var(--line); border-radius: 12px; background: #0b0e0c; }
.segmented button { min-width: 54px; padding: 8px 10px; border: 0; border-radius: 8px; background: transparent; color: var(--muted); cursor: pointer; }
.segmented button.active { color: #0b100a; background: var(--yellow); font-weight: 900; }
.metric-grid { display: grid; grid-template-columns: repeat(4, minmax(150px, 1fr)); gap: 12px; margin-bottom: 16px; }
.metric-card { position: relative; min-height: 116px; padding: 19px; overflow: hidden; border: 1px solid var(--line); border-radius: 14px; background: linear-gradient(145deg, #121714, #0d100e); }
.metric-card:after { content: ''; position: absolute; width: 72px; height: 72px; right: -26px; bottom: -34px; border-radius: 50%; background: var(--metric-color, var(--acid)); filter: blur(32px); opacity: .16; }
.metric-label { color: var(--muted); font-size: 12px; text-transform: uppercase; letter-spacing: .08em; }
.metric-value { margin-top: 13px; font: 700 clamp(23px, 2.2vw, 30px)/1.1 Bahnschrift, sans-serif; overflow-wrap: anywhere; }
.metric-note { margin-top: 8px; color: var(--muted); font-size: 12px; line-height: 1.4; }
.dashboard-grid { display: grid; grid-template-columns: 1.25fr .75fr; gap: 16px; }
.analytics-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; }
.data-quality-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; }
.coverage-item { min-height: 88px; padding: 13px 14px; border: 1px solid #29342d; border-radius: 12px; background: #0c100e; }
.coverage-item strong, .coverage-item span, .coverage-item small { display: block; }
.coverage-item strong { color: var(--acid); font-size: 12px; letter-spacing: .06em; text-transform: uppercase; }
.coverage-item span { margin-top: 6px; color: var(--text); font-size: 12px; line-height: 1.35; }
.coverage-item small { margin-top: 7px; color: var(--muted); font-size: 10px; }
.metric-chart-panel { min-height: 332px; padding: 22px; }
.chart-total { color: var(--acid); font: 800 29px/1 Bahnschrift, sans-serif; text-shadow: 0 0 22px #b8ff3930; }
.chart-summary { display: block; margin-top: 5px; color: var(--muted); font-size: 11px; font-weight: 700; letter-spacing: .01em; }
.analytics-controls { display: grid; justify-items: end; gap: 8px; min-width: 0; }.analytics-controls .segmented { display: flex; flex-wrap: wrap; justify-content: flex-end; max-width: 100%; overflow-x: visible; }.analytics-controls .segmented button { min-width: auto; white-space: nowrap; }
.analytics-details { margin-top: 16px; padding: 18px 22px; }.analytics-details > summary { width: fit-content; color: var(--text); font-weight: 700; cursor: pointer; }.analytics-details > summary:hover { color: var(--acid); }.analytics-details[open] > summary { margin-bottom: 18px; }.analytics-explanation { margin: 16px 0 0; font-size: 12px; line-height: 1.5; }.analytics-details .metric-chart-panel { background: #0d120f; box-shadow: none; }
.chart-value-chip rect { filter: drop-shadow(0 3px 4px rgba(0,0,0,.3)); }
.mini-chart { min-height: 218px; margin-top: 14px; }.mini-chart svg { display: block; width: 100%; height: 194px; overflow: visible; }.mini-chart .empty-state { min-height: 160px; display: grid; place-items: center; padding: 12px; }
.panel { border: 1px solid var(--line); border-radius: 16px; background: linear-gradient(150deg, rgba(20,25,22,.96), rgba(11,14,12,.98)); box-shadow: 0 18px 50px #0003; }
.dashboard-grid .panel, .settings-grid .panel { padding: 22px; }
.span-2 { grid-column: span 2; }
.chart-panel { min-height: 390px; }
.chart { min-height: 290px; margin-top: 12px; }
.chart svg { display: block; width: 100%; height: 290px; overflow: visible; }
.chart-empty { display: grid; min-height: 280px; place-items: center; color: var(--muted); }
.legend { display: flex; flex-wrap: wrap; gap: 9px; color: var(--muted); font-size: 12px; }
.legend b { display: inline-flex; align-items: center; gap: 4px; padding: 6px 9px; border: 1px solid var(--line); border-radius: 999px; background: #0b0f0c; }.legend b span { color: var(--text); font-family: ui-monospace, Consolas, monospace; }
.legend b:before { content: ''; display: inline-block; width: 9px; height: 9px; margin-right: 7px; border-radius: 99px; background: currentColor; }
.legend .in { color: var(--mint); }.legend .out { color: var(--red); }
.chart-daily-details { margin-top: 10px; color: var(--muted); font-size: 12px; }
.chart-daily-details summary { width: fit-content; cursor: pointer; color: var(--text); }
.chart-daily-details summary:hover { color: var(--acid); }
.chart-daily-details table { margin-top: 10px; width: 100%; border-collapse: collapse; color: var(--text); font-variant-numeric: tabular-nums; }
.chart-daily-details th, .chart-daily-details td { padding: 7px 10px; border-bottom: 1px solid var(--line); text-align: left; }
.chart-daily-details th { color: var(--muted); font-weight: 600; }
.entry-rate-panel .panel-heading { align-items: flex-start; flex-wrap: wrap; }
.entry-rate-panel .chart-total { max-width: 100%; overflow-wrap: anywhere; }
.entry-rate-table-scroll { overflow-x: auto; max-width: 100%; }
.entry-rate-details table { min-width: 420px; }
.chart-baseline-note { margin: 11px 0 0; color: #8d978f; font-size: 11px; line-height: 1.4; }.chart-baseline-note:before { content: '—'; margin-right: 6px; color: #657167; font-weight: 900; }.chart-baseline-note.mini { margin-top: 1px; font-size: 10px; }
.delta { color: var(--acid); font-weight: 800; }
.link-preview { position: relative; overflow: hidden; }
.link-preview:before { content: '↗'; position: absolute; right: 14px; top: -26px; color: #b8ff390d; font: 160px Bahnschrift; transform: rotate(8deg); }
.link-value { position: relative; margin: 22px 0; overflow-wrap: anywhere; color: var(--acid); font-family: ui-monospace, Consolas, monospace; }
.group-health { min-height: 200px; }
.overview-group-stats { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; margin-top: 23px; }
.overview-group-stat { min-width: 0; padding-top: 10px; border-top: 1px solid var(--line-soft); }
.overview-group-stat strong, .overview-group-stat span { display: block; }
.overview-group-stat strong { color: var(--acid); font: 800 clamp(22px, 2vw, 28px)/1.15 Bahnschrift, sans-serif; }
.overview-group-stat span { margin-top: 6px; color: var(--muted); font-size: 12px; line-height: 1.35; }
.overview-group-hint { margin: 14px 0 0; color: var(--yellow); font-size: 12px; line-height: 1.45; }
.progress { height: 7px; overflow: hidden; border-radius: 99px; background: #232a26; }
.progress span { display: block; height: 100%; border-radius: inherit; background: var(--mint); }
.progress.warn span { background: var(--yellow); }.progress.full span { background: var(--red); }

.table-wrap { width: 100%; overflow-x: auto; }
table { width: 100%; border-collapse: collapse; font-size: 13px; }
th { color: var(--muted); font-size: 11px; letter-spacing: .09em; text-align: left; text-transform: uppercase; }
th, td { padding: 13px 10px; border-bottom: 1px solid var(--line-soft); }
tr:last-child td { border-bottom: 0; }
.event-tag { display: inline-flex; padding: 5px 8px; border-radius: 999px; font-size: 11px; font-weight: 800; }
.event-tag.join { color: var(--mint); background: #153529; }.event-tag.leave { color: #ff8177; background: #381c1a; }
.empty-state { padding: 30px 12px; color: var(--muted); text-align: center; }
.section-head { align-items: flex-end; margin: 4px 0 20px; }
.group-directory { padding: 18px; }
.group-heading-actions { display: flex; align-items: center; flex-wrap: wrap; justify-content: flex-end; gap: 10px; }
.group-leads-export { margin-top: 18px; overflow: hidden; }
.group-leads-export > summary { display: flex; align-items: center; justify-content: space-between; gap: 16px; padding: 18px 22px; list-style: none; cursor: pointer; }
.group-leads-export > summary::-webkit-details-marker { display: none; }
.group-leads-export > summary:hover, .group-leads-export > summary:focus-visible { background: #182019; }
.group-leads-export > summary .eyebrow { display: block; margin-bottom: 5px; }
.group-leads-export > summary strong { display: block; font: 700 19px Bahnschrift, "Segoe UI Variable Display", sans-serif; }
.group-leads-export > summary small { display: block; margin-top: 4px; color: var(--muted); font-size: 12px; }
.group-export-caret { color: var(--acid); font-size: 26px; transition: transform .16s ease; }
.group-leads-export[open] .group-export-caret { transform: rotate(180deg); }
.group-leads-content { padding: 18px 22px 20px; border-top: 1px solid var(--line-soft); }
.group-leads-content > p:first-child { margin-bottom: 13px; }
.group-leads-actions { display: flex; flex-wrap: wrap; gap: 9px; }
.group-leads-actions .button { min-width: 105px; }
.group-leads-note { max-width: 900px; margin: 14px 0 0; color: var(--muted); font-size: 12px; line-height: 1.5; }
.group-directory-heading { display: flex; align-items: flex-start; justify-content: space-between; gap: 18px; }
.group-directory-heading h2 { margin-bottom: 0; }
.selection-count { flex: 0 0 auto; padding: 8px 11px; border: 1px solid #405436; border-radius: 999px; color: var(--acid); background: #182015; font-size: 12px; font-weight: 800; }
.group-toolbar { display: grid; grid-template-columns: minmax(210px, 1fr) minmax(185px, .45fr) auto; align-items: end; gap: 12px; padding: 12px 0; margin: 12px 0 14px; border-block: 1px solid var(--line-soft); }
.group-toolbar .checkbox-control { min-height: 44px; align-self: end; }
.group-toolbar label { gap: 5px; }.group-toolbar label > span { color: var(--muted); font-size: 11px; letter-spacing: .08em; text-transform: uppercase; }
.group-batch-controls { display: flex; flex-wrap: wrap; align-items: end; justify-content: flex-end; gap: 9px; }
.group-batch-controls label { min-width: 145px; }.group-batch-controls select, .group-batch-controls input { margin-top: 0; }
.group-grid { display: grid; grid-template-columns: repeat(2, minmax(280px, 1fr)); gap: 12px; }
.group-card { display: grid; gap: 13px; min-height: 220px; padding: 18px; border: 1px solid var(--line-soft); border-radius: 13px; background: #0b0f0c; transition: border-color .16s ease, background .16s ease; }
.group-card:hover { border-color: #3e4c43; }.group-card.attention { border-color: #513f26; background: linear-gradient(145deg, #16140e, #0b0f0c); }
.group-card-head { display: grid; grid-template-columns: auto 62px minmax(0, 1fr) auto; align-items: start; gap: 12px; }
.group-card.readonly .group-card-head { grid-template-columns: 62px minmax(0,1fr) auto; }
.group-select, .checkbox-control input { width: 18px; height: 18px; margin: 4px 0 0; accent-color: var(--acid); cursor: pointer; }
.group-bulk-bar { display: flex; align-items: center; justify-content: space-between; gap: 14px; margin: 0 0 14px; padding: 10px 12px; border: 1px solid #496736; border-radius: 10px; background: #142015; }
.group-bulk-bar strong { color: var(--acid); font-size: 12px; white-space: nowrap; }
.checkbox-control { display: inline-flex; grid-template-columns: auto 1fr; align-items: center; gap: 9px; color: #d8dfd9; font-size: 12px; white-space: nowrap; }
.group-bulk-actions { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 8px; }
.group-bulk-actions .button { min-height: 34px; padding-inline: 11px; font-size: 12px; }
.group-bulk-actions .button:disabled { cursor: not-allowed; opacity: .42; }
.group-card-head strong { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.group-avatar { position: relative; display: grid; width: 62px; height: 62px; overflow: hidden; place-items: center; border: 1px solid #40523d; border-radius: 18px 8px 18px 8px; background: linear-gradient(145deg, #263525, #101711); color: var(--acid); font: 800 16px Bahnschrift, sans-serif; box-shadow: inset 0 0 0 4px #081008, 0 8px 20px #0004; }
.group-avatar img { position: absolute; inset: 0; z-index: 1; width: 100%; height: 100%; object-fit: cover; background: #182119; }
.group-avatar img[hidden] { display: none; }
.group-identifier { display: block; margin-top: 4px; color: var(--muted); font: 11px ui-monospace, Consolas, monospace; }
.group-status { max-width: 180px; padding: 5px 8px; border: 1px solid #21513a; border-radius: 999px; color: var(--mint); background: #10291d; font-size: 10px; font-weight: 800; text-align: center; }
.group-status.attention { border-color: #584326; color: var(--yellow); background: #282012; }
.group-occupancy { display: grid; gap: 8px; }.group-counts { color: #d4dbd5; font-size: 13px; font-weight: 750; }
.group-card-detail { min-height: 36px; margin: 0; color: var(--muted); font-size: 12px; line-height: 1.45; }
.group-block { display: grid; gap: 4px; padding: 10px 11px; border: 1px solid #694127; border-left: 3px solid var(--yellow); border-radius: 9px; background: #241b12; color: #e8d8b1; font-size: 12px; line-height: 1.45; }
.group-block strong { color: var(--yellow); font-size: 12px; }.group-block code { color: #ffe89a; font-size: 11px; }
.group-card-actions { display: flex; align-items: center; justify-content: space-between; gap: 10px; margin-top: auto; padding-top: 12px; border-top: 1px solid var(--line-soft); }
.card-primary-actions { display: flex; align-items: center; flex-wrap: wrap; gap: 10px; }
.group-card .button { min-height: 36px; padding-inline: 12px; font-size: 12px; }.group-card .button:disabled { cursor: not-allowed; }
.settings-grid { display: grid; grid-template-columns: 1.2fr .8fr; gap: 16px; }
.deep-link-explainer { display: flex; align-items: center; justify-content: space-between; gap: 24px; margin-bottom: 16px; padding: 20px 22px; border-color: #355540; background: linear-gradient(120deg, #121c14, #0c100d); }.deep-link-explainer h3 { margin: 4px 0 7px; font-size: 19px; }.deep-link-explainer p { max-width: 830px; margin: 0; line-height: 1.5; }.deep-link-explainer-state { display: grid; flex: 0 0 auto; min-width: 116px; place-items: center; padding: 12px 18px; border: 1px solid #405c39; border-radius: 13px; background: #101a12; }.deep-link-explainer-state strong { color: var(--acid); font-size: 26px; line-height: 1; }.deep-link-explainer-state span { margin-top: 5px; color: var(--muted); font-size: 11px; font-weight: 700; text-transform: uppercase; }
.deep-link-directory { margin-bottom: 16px; padding: 22px; }.deep-link-directory .panel-heading { align-items: flex-start; }.deep-link-directory .panel-heading p:last-child { max-width: 730px; margin-bottom: 0; }.deep-link-list { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; margin-top: 18px; }.deep-link-card { display: grid; gap: 13px; min-height: 224px; padding: 16px; border: 1px solid var(--line-soft); border-left: 3px solid #5c744a; border-radius: 13px; background: #0b0f0c; }.deep-link-card.default { border-left-color: var(--acid); background: linear-gradient(145deg, #151f13, #0b0f0c); }.deep-link-card.disabled { border-left-color: #74622f; opacity: .82; }.deep-link-card-heading { display: flex; align-items: flex-start; justify-content: space-between; gap: 12px; }.deep-link-card h3 { margin: 0 0 4px; font-size: 16px; }.deep-link-card p { margin: 0; }.deep-link-url { display: block; min-height: 38px; padding: 10px; border: 1px solid var(--line-soft); border-radius: 9px; background: #080b09; color: #c8f982; font-size: 11px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }.deep-link-metrics { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 8px; }.deep-link-metrics div { min-width: 0; padding: 9px; border: 1px solid var(--line-soft); border-radius: 9px; background: #101511; }.deep-link-metrics span, .deep-link-metrics strong { display: block; }.deep-link-metrics span { min-height: 29px; color: var(--muted); font-size: 10px; font-weight: 750; line-height: 1.35; text-transform: uppercase; }.deep-link-metrics strong { color: var(--text); font-size: 19px; }.deep-link-card-footer { display: flex; align-items: center; justify-content: space-between; gap: 10px; padding-top: 2px; }.deep-link-card-footer .button-row { justify-content: flex-end; flex-wrap: wrap; }.deep-link-card-footer .button { min-height: 34px; padding-inline: 10px; font-size: 11px; }.deep-link-settings { align-items: start; }
.form-grid { display: grid; gap: 17px; margin-top: 24px; }
textarea { width: 100%; min-height: 104px; padding: 12px 13px; border: 1px solid var(--line); border-radius: 9px; outline: 0; resize: vertical; background: #090c0a; color: var(--text); font: inherit; }
textarea:focus { border-color: var(--acid); box-shadow: 0 0 0 3px #b8ff3912; }
output { display: block; min-height: 44px; padding: 12px 13px; border: 1px solid var(--line); border-radius: 9px; background: #090c0a; color: var(--acid); font-family: ui-monospace, Consolas, monospace; }
label { display: grid; gap: 7px; color: #cbd1cc; font-size: 13px; font-weight: 700; }
input, select { width: 100%; min-height: 44px; padding: 0 13px; border: 1px solid var(--line); border-radius: 9px; outline: 0; background: #090c0a; color: var(--text); }
input:focus, select:focus { border-color: var(--acid); box-shadow: 0 0 0 3px #b8ff3912; }
.campaign-picker { display: grid; grid-template-columns: auto minmax(180px, 250px); align-items: center; gap: 9px; padding: 5px 7px 5px 12px; border: 1px solid #334239; border-radius: 999px; background: #101611; color: var(--muted); font-size: 10px; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; }
.campaign-combobox { position: relative; min-width: 0; }
.campaign-select-button { display: flex; width: 100%; min-height: 34px; align-items: center; justify-content: space-between; gap: 10px; padding: 0 11px; border: 1px solid #3c4c42; border-radius: 999px; background: #171e19; color: var(--text); cursor: pointer; font: inherit; font-size: 13px; font-weight: 750; letter-spacing: normal; text-align: left; text-transform: none; transition: border-color .16s ease, background .16s ease, box-shadow .16s ease; }
.campaign-select-button:hover, .campaign-select-button[aria-expanded="true"] { border-color: #87b94c; background: #1b251d; }
.campaign-select-button:focus-visible { outline: 0; border-color: var(--acid); box-shadow: 0 0 0 3px #b8ff3920; }
.campaign-select-button > span:first-child { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.campaign-caret { flex: 0 0 auto; color: var(--acid); font-size: 16px; line-height: 1; transition: transform .16s ease; }
.campaign-select-button[aria-expanded="true"] .campaign-caret { transform: rotate(180deg); }
.campaign-options { position: absolute; z-index: 30; top: calc(100% + 8px); right: 0; width: max(100%, 300px); max-width: min(360px, calc(100vw - 32px)); padding: 6px; border: 1px solid #526a46; border-radius: 14px; background: #111812; box-shadow: 0 20px 44px #000b; }
.campaign-option { display: grid; width: 100%; grid-template-columns: 22px minmax(0, 1fr); align-items: center; gap: 9px; padding: 10px; border: 1px solid transparent; border-radius: 9px; background: transparent; color: #dbe4da; cursor: pointer; font: inherit; font-size: 13px; text-align: left; transition: background .14s ease, border-color .14s ease; }
.campaign-option:hover, .campaign-option:focus-visible { outline: 0; border-color: #3b5740; background: #1a271c; }.campaign-option[aria-selected="true"] { border-color: #668e43; background: #202f1c; color: #efffe8; }.campaign-option-mark { display: grid; width: 20px; height: 20px; place-items: center; border: 1px solid #425b38; border-radius: 7px 4px 7px 4px; background: #192417; color: var(--acid); font-size: 11px; }.campaign-option-name { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.campaigns-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 490px), 1fr)); gap: 16px; }
.campaign-card { display: grid; gap: 18px; max-width: 760px; min-height: 210px; padding: 22px; border: 1px solid var(--line); border-radius: 17px; background: linear-gradient(145deg, #111814, #0a0e0b); box-shadow: 0 18px 40px #0002; transition: transform .16s ease, border-color .16s ease, background .16s ease; }.campaign-card:hover { transform: translateY(-2px); border-color: #526a46; }.campaign-card.active { border-color: #84ba49; background: linear-gradient(145deg, #192418, #0b100c); }
.campaign-card-lead { display: grid; grid-template-columns: 52px minmax(0, 1fr); gap: 13px; align-items: start; }.campaign-card-emoji { display: grid; width: 52px; height: 52px; place-items: center; border: 1px solid #4c673b; border-radius: 16px 7px 16px 7px; background: #202d1b; font-size: 25px; }.campaign-card h3 { margin: 2px 0 7px; font-size: 19px; }.campaign-card p { margin: 0; color: var(--muted); font-size: 13px; line-height: 1.45; }
.campaign-card-meta { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; color: var(--muted); font-size: 12px; }.campaign-card-status { display: inline-flex; padding: 5px 8px; border: 1px solid #29563d; border-radius: 999px; background: #10271a; color: var(--mint); font-size: 10px; font-weight: 800; }.campaign-card-status.archived { border-color: #5a4430; background: #271d15; color: var(--yellow); }
.campaign-card .button-row { justify-content: flex-start; flex-wrap: wrap; gap: 8px; }.campaign-card-status.current { color: var(--acid); border-color: #4d7436; }
.input-prefix { display: grid; grid-template-columns: auto 1fr; align-items: center; border: 1px solid var(--line); border-radius: 9px; overflow: hidden; background: #090c0a; }
.input-prefix span { padding-left: 13px; color: var(--muted); font-family: ui-monospace, Consolas, monospace; }
.input-prefix input { border: 0; }
.switch-row { grid-template-columns: 1fr auto; align-items: center; padding: 15px 0; border-top: 1px solid var(--line-soft); }
.switch-row small { display: block; margin-top: 4px; color: var(--muted); font-weight: 400; }
.switch-row input { appearance: none; width: 44px; min-height: 24px; border-radius: 99px; background: #303833; cursor: pointer; }
.switch-row input:checked { background: var(--acid); box-shadow: inset 20px 0 0 2px #0b1109; }
.danger-panel { align-self: start; border-color: #482d29; }
.connection-panel { align-self: start; }
.connection-summary { margin: 0 0 16px; padding: 13px 16px; border: 1px solid #405436; border-left: 3px solid var(--acid); border-radius: 10px; background: #131b12; color: var(--text); font-size: 13px; line-height: 1.5; }
.button[hidden] { display: none; }
.connection-summary.attention { border-color: #634429; border-left-color: var(--yellow); background: #211a12; }
.connection-summary strong { color: var(--acid); }
.instances-list { display: grid; gap: 10px; margin-top: 20px; }
.instance-card { display: grid; gap: 10px; padding: 14px; border: 1px solid var(--line-soft); border-left: 3px solid var(--yellow); border-radius: 11px; background: #0b0f0c; }
.instance-card.ready { border-left-color: var(--mint); }
.instance-card.deleting { border-left-color: var(--red); }
.instance-heading { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.instance-heading strong { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.instance-badges { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 6px; }
.instance-badge { display: inline-flex; padding: 4px 7px; border: 1px solid #493d20; border-radius: 999px; color: var(--yellow); background: #252014; font-size: 10px; font-weight: 800; }
.instance-badge.primary { border-color: #405436; color: var(--acid); background: #182015; }.instance-badge.online { border-color: #21513a; color: var(--mint); background: #10291d; }
.instance-badge.offline { border-color: #643933; color: #ff9c92; background: #251512; }
.instance-badge.pending { border-color: #6a4724; color: #ffd37e; background: #2a1d12; }
.instance-guidance { margin: 0; padding: 10px 12px; border: 1px solid #67462a; border-radius: 8px; background: #21180f; color: #f4dcb8; font-size: 12px; line-height: 1.5; }
.instance-card.ready .instance-guidance { border-color: #315641; background: #102019; color: #bce7cf; }
.instance-technical { color: var(--muted); font-size: 11px; }
.instance-technical summary { cursor: pointer; width: max-content; }
.instance-technical code { display: block; margin-top: 7px; overflow-wrap: anywhere; }
.advanced-fields { padding: 11px 13px; border: 1px solid var(--line-soft); border-radius: 9px; }
.advanced-fields summary { cursor: pointer; color: var(--muted); font-size: 13px; }
.advanced-fields label { display: block; margin-top: 14px; }
.instance-details { color: var(--muted); font-size: 12px; line-height: 1.45; overflow-wrap: anywhere; }
.instance-phone { margin: 0; color: var(--text); font: 700 20px/1.1 Bahnschrift, "Segoe UI Variable Display", sans-serif; font-variant-numeric: tabular-nums; }
.instance-phone small { display: block; margin-bottom: 5px; color: var(--muted); font: 600 10px Aptos, "Segoe UI Variable Text", sans-serif; letter-spacing: .08em; text-transform: uppercase; }
.instance-actions { justify-content: flex-start; flex-wrap: wrap; }
.detail-list { display: grid; gap: 0; margin: 22px 0; }
.detail-list div { display: flex; justify-content: space-between; gap: 18px; padding: 12px 0; border-top: 1px solid var(--line-soft); }
.detail-list dt { color: var(--muted); font-size: 12px; }.detail-list dd { margin: 0; font-family: ui-monospace, Consolas, monospace; font-size: 12px; text-align: right; overflow-wrap: anywhere; }
.notification-list { display: grid; gap: 9px; margin-top: 20px; }
.notification { display: grid; gap: 4px; padding: 13px; border: 1px solid var(--line-soft); border-left: 3px solid var(--yellow); border-radius: 10px; background: #0b0f0c; }
.notification.info { border-left-color: var(--mint); }.notification.critical { border-left-color: var(--red); }
.job-list { display: grid; gap: 8px; margin-top: 20px; }
.job-row { display: grid; grid-template-columns: 1fr auto; gap: 10px; align-items: center; padding: 10px 12px; border: 1px solid var(--line-soft); border-radius: 9px; background: #0b0f0c; font-size: 12px; }
.job-row strong { display: block; }.job-row span { color: var(--muted); }.job-status { color: var(--acid); font-family: ui-monospace, Consolas, monospace; text-transform: uppercase; font-size: 11px; }.job-status.failed { color: var(--red); }.job-status.partial { color: var(--yellow); }.job-status.completed { color: var(--mint); }
.sales-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; margin-bottom: 16px; }
.daily-finance-panel { padding: 22px; margin: 16px 0; }
.daily-finance-panel .panel-heading { align-items: flex-start; gap: 16px; }
.daily-finance-panel .panel-heading .muted { max-width: 850px; margin: 7px 0 0; font-size: 12px; line-height: 1.5; }
.daily-finance-table { max-height: 390px; margin-top: 16px; overflow: auto; border-top: 1px solid var(--line-soft); }
.daily-finance-table table { min-width: 570px; font-variant-numeric: tabular-nums; }
.daily-finance-table th { position: sticky; top: 0; z-index: 1; background: #151a16; }
.daily-finance-table td:first-child { font-weight: 800; color: var(--text); white-space: nowrap; }
.daily-money { font-family: ui-monospace, Consolas, monospace; white-space: nowrap; }
.daily-total { color: var(--acid); font-weight: 800; }
.sales-commission-explainer { margin: -4px 0 18px; font-size: 12px; line-height: 1.5; }
.sales-finance-panel { margin-bottom: 16px; }
.status-breakdown { display: grid; gap: 8px; margin-top: 18px; }.status-row { display: flex; justify-content: space-between; gap: 12px; padding: 10px 0; border-top: 1px solid var(--line-soft); font-size: 13px; }.status-row span { color: var(--muted); font-family: ui-monospace, Consolas, monospace; }
.connection-layout { display: grid; grid-template-columns: minmax(0, 1.25fr) minmax(320px, .8fr); align-items: start; gap: 16px; }
.connection-main { display: grid; min-width: 0; gap: 16px; }.connection-layout .panel { min-width: 0; padding: 22px; }.connection-panel > .muted, .connection-alerts > .muted { margin-bottom: 16px; line-height: 1.45; }.connection-alerts { position: sticky; top: 20px; }
.shopee-connection-panel > summary { display: flex; align-items: center; justify-content: space-between; gap: 14px; list-style: none; cursor: pointer; }.shopee-connection-panel > summary::-webkit-details-marker { display: none; }.shopee-connection-panel > summary strong, .shopee-connection-panel > summary small { display: block; }.shopee-connection-panel > summary strong { font: 700 20px Bahnschrift, "Segoe UI Variable Display", sans-serif; }.shopee-connection-panel > summary small { margin-top: 6px; color: var(--muted); font-size: 12px; }.shopee-connection-panel[open] .group-export-caret { transform: rotate(180deg); }.shopee-connection-content { margin-top: 18px; padding-top: 18px; border-top: 1px solid var(--line-soft); }.shopee-connection-content > p { line-height: 1.5; }.shopee-settings-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); align-items: start; gap: 20px; }.shopee-integration-status { min-width: 0; }.shopee-connection-panel h3 { margin: 2px 0 0; font-size: 18px; line-height: 1.25; overflow-wrap: anywhere; }.compact-form { margin-top: 0; align-content: start; }.shopee-settings-grid .detail-list { margin: 14px 0; }.shopee-settings-grid .detail-list div { display: grid; gap: 4px; padding: 9px 0; }.shopee-settings-grid .detail-list dd { text-align: left; }.integration-note { margin: 0 0 14px; padding: 10px 12px; border: 1px solid #355442; border-left: 3px solid var(--mint); border-radius: 9px; background: #102018; color: #b8d5bd; font-size: 12px; line-height: 1.45; }.integration-note.attention { border-color: #694127; border-left-color: var(--yellow); background: #241b12; color: #f2d9a8; }
.older-notifications { display: grid; gap: 9px; padding-top: 10px; border-top: 1px solid var(--line-soft); }.older-notifications > summary { color: var(--acid); font-size: 12px; font-weight: 700; cursor: pointer; }.older-notifications[open] > summary { margin-bottom: 9px; }.older-notifications .notification { margin-top: 9px; }
.group-maintenance { margin-top: 16px; padding: 17px 20px; }.group-maintenance > summary { width: fit-content; color: var(--text); font-weight: 700; cursor: pointer; }.group-maintenance[open] > summary { margin-bottom: 14px; }.group-maintenance .button-row { justify-content: flex-start; flex-wrap: wrap; }.group-maintenance .muted { font-size: 13px; line-height: 1.5; }
.history-panel { padding: 18px 20px; }.history-filters { display: grid; grid-template-columns: minmax(200px, 1.4fr) repeat(2,minmax(130px,1fr)) auto; align-items: end; gap: 10px; margin-bottom: 12px; }.history-filters label { min-width: 0; }.history-filters .button { white-space: nowrap; }.history-table { min-width: 690px; }.history-table td:last-child { white-space: nowrap; }.history-table code { overflow-wrap: anywhere; font-size: 11px; color: #c6d2c9; }.event-tag.administrative { color: var(--acid); background: #1d2d17; }.history-pagination { display: flex; align-items: center; justify-content: flex-end; gap: 12px; margin-top: 14px; color: var(--muted); font-size: 12px; }.history-pagination .button { min-height: 36px; }.history-pagination .button:disabled { cursor: not-allowed; }
.financial-summary-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 14px; margin-bottom: 16px; }.financial-summary { min-height: 142px; padding: 20px; background: linear-gradient(145deg, #101713, #0a0e0b); }.financial-summary.primary { background: linear-gradient(145deg, #18170e, #0a0e0b); }.financial-summary h2 { margin: 10px 0 7px; color: var(--acid); font-size: clamp(22px, 2vw, 30px); letter-spacing: -.04em; }.financial-summary.primary h2 { color: var(--yellow); }
.sales-report-filter { display: grid; grid-template-columns: minmax(240px, 1fr) auto; gap: 16px; align-items: end; margin-bottom: 16px; padding: 18px 20px; }.sales-report-filter h3 { margin: 3px 0 5px; font-size: 19px; }.sales-report-filter .muted { margin: 0; }.sales-filter-actions { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 8px; }.sales-report-controls { display: grid; grid-column: 1 / -1; grid-template-columns: repeat(3, minmax(150px, 1fr)) auto; gap: 10px; align-items: end; padding-top: 14px; border-top: 1px solid var(--line-soft); }.sales-report-controls label { gap: 6px; }.sales-report-controls label > span { color: var(--muted); font-size: 10px; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; }.sales-report-controls .button { min-height: 42px; white-space: nowrap; }
.conversion-list-panel { margin: 16px 0; padding: 22px; }.conversion-list-panel .panel-heading { align-items: flex-start; }.conversion-list-panel .panel-heading p:last-child { max-width: 760px; margin-bottom: 0; }.conversion-toolbar { display: grid; grid-template-columns: repeat(4, minmax(145px, 1fr)) auto; align-items: end; gap: 10px; margin: 20px 0 12px; padding: 16px 0; border-block: 1px solid var(--line-soft); }.conversion-toolbar label { gap: 6px; }.conversion-toolbar label > span { color: var(--muted); font-size: 10px; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; }.conversion-toolbar .button { white-space: nowrap; }.conversion-product { display: flex; min-width: 230px; align-items: center; gap: 10px; }.conversion-product-image { width: 38px; height: 38px; flex: 0 0 auto; border: 1px solid var(--line); border-radius: 9px; object-fit: cover; background: #131914; }.conversion-product strong, .conversion-product small { display: block; }.conversion-product strong { max-width: 290px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }.conversion-product small { margin-top: 4px; color: var(--muted); font-size: 11px; }.conversion-status { display: inline-flex; width: max-content; padding: 5px 8px; border: 1px solid #61502b; border-radius: 999px; background: #272114; color: var(--yellow); font-size: 10px; font-weight: 800; text-transform: uppercase; }.conversion-status.completed { border-color: #28573e; background: #102b1c; color: var(--mint); }.conversion-status.unpaid, .conversion-status.cancelled { border-color: #653a33; background: #2a1715; color: #ff8a80; }.conversion-date { color: var(--muted); font-size: 12px; white-space: nowrap; }.conversion-money { color: var(--text); font-family: ui-monospace, Consolas, monospace; font-size: 12px; white-space: nowrap; }.conversion-money small { display: block; margin-top: 3px; color: var(--muted); font-family: inherit; font-size: 10px; }.conversion-source { display: block; max-width: 150px; overflow: hidden; color: var(--muted); font: 11px ui-monospace, Consolas, monospace; text-overflow: ellipsis; white-space: nowrap; }.conversion-pagination { display: flex; align-items: center; justify-content: flex-end; gap: 12px; margin-top: 14px; }.conversion-pagination .button { min-height: 36px; padding-inline: 12px; }
.notification span { color: var(--muted); font-size: 12px; line-height: 1.45; }
.members-section-head { max-width: 1120px; margin-bottom: 14px; }
.members-panel { max-width: 1120px; padding: 22px; }
.members-panel-heading { align-items: center; }
.member-panel-actions { display: flex; flex-wrap: wrap; align-items: center; justify-content: flex-end; gap: 10px; }
.members-list { display: grid; gap: 10px; margin-top: 20px; }.member-card { display: grid; grid-template-columns: minmax(250px, 1fr) auto minmax(280px, auto); align-items: center; gap: 16px; padding: 14px; border: 1px solid var(--line-soft); border-radius: 12px; background: #0b0f0c; }.member-card.inactive { border-color: #4e3730; background: #15100e; opacity: .8; }.member-identity { display: flex; align-items: center; min-width: 0; gap: 11px; }.member-avatar { display: grid; flex: 0 0 auto; width: 39px; height: 39px; place-items: center; border: 1px solid #405436; border-radius: 12px 6px 12px 6px; background: #1a2618; color: var(--acid); font-weight: 900; }.member-identity strong, .member-identity small { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }.member-identity small { margin-top: 4px; color: var(--muted); font-size: 11px; }.member-badges { display: flex; flex-wrap: wrap; justify-content: center; gap: 6px; }.member-badge { display: inline-flex; padding: 5px 7px; border-radius: 999px; font-size: 10px; font-weight: 800; }.member-badge.active { border: 1px solid #28573e; background: #102b1c; color: var(--mint); }.member-badge.inactive { border: 1px solid #653a33; background: #2a1715; color: #ff8a80; }.member-badge.pending { border: 1px solid #61502b; background: #272114; color: var(--yellow); }.member-actions { display: flex; flex-wrap: wrap; align-items: center; justify-content: flex-end; gap: 8px; }.member-actions select { width: 150px; min-height: 36px; padding-inline: 9px; font-size: 12px; }
code { color: var(--acid); font-family: ui-monospace, Consolas, monospace; overflow-wrap: anywhere; }
.alert { position: sticky; top: 12px; z-index: 8; margin-bottom: 16px; padding: 13px 16px; border: 1px solid #526c40; border-radius: 11px; background: #172116; box-shadow: 0 12px 35px #0009; }
.alert.error { border-color: #6c3933; background: #2b1715; }

.offer-review-panel, .offer-queue-panel, .offer-catalog-panel, .offer-categories-panel, .offer-sources-panel, .offer-messages-panel { margin-top: 16px; padding: 22px; min-width: 0; }
#offers-view .empty-state { min-height: 80px; padding: 20px; }
.offer-affiliate-note { margin: 12px 0 0; padding: 10px 12px; border: 1px solid var(--line); border-radius: 9px; overflow-wrap: anywhere; font-size: 12px; line-height: 1.5; }
.offer-affiliate-note.ready { border-color: #28573e; color: var(--mint); }
.offer-affiliate-note.failed { border-color: #694127; color: var(--yellow); }
.nav-item[hidden] { display: none; }
.offer-review-filters { display: flex; flex-wrap: wrap; gap: 8px; margin: 18px 0 12px; }
.offer-review-filters button { display: inline-flex; align-items: center; gap: 9px; min-height: 38px; padding: 8px 12px; border: 1px solid var(--line); border-radius: 9px; background: #0b100d; color: var(--text); cursor: pointer; }
.offer-review-filters button.active { border-color: var(--acid); color: var(--acid); }
.offer-review-filters span { color: var(--muted); font-size: 12px; }
.offer-candidates-list { display: grid; gap: 12px; margin-top: 14px; }
.offer-candidate-card { min-width: 0; padding: 18px; border: 1px solid var(--line-soft); border-radius: 12px; background: #0b100d; }
.offer-candidate-heading { display: flex; justify-content: space-between; align-items: flex-start; gap: 16px; }
.offer-candidate-heading > strong:first-child { overflow-wrap: anywhere; }
.offer-candidate-price { flex: 0 0 auto; color: var(--acid); }
.offer-candidate-source { max-height: 5em; padding: 10px 12px; overflow: auto; border-left: 2px solid var(--line); color: var(--muted); white-space: pre-wrap; overflow-wrap: anywhere; font-size: 13px; }
.offer-candidate-actions, .offer-review-pages { display: flex; align-items: center; flex-wrap: wrap; gap: 8px; margin-top: 14px; }
.offer-review-pages { justify-content: flex-end; }
.offer-products-list, .offer-categories-list { display: grid; gap: 10px; margin-top: 14px; }
.offer-product-card, .offer-category-row { min-width: 0; padding: 16px; border: 1px solid var(--line-soft); border-radius: 12px; background: #0b100d; }
.offer-product-card { display: grid; gap: 9px; }
.offer-product-top, .offer-category-row { display: flex; align-items: flex-start; justify-content: space-between; gap: 12px; }
.offer-product-top strong, .offer-category-row strong { overflow-wrap: anywhere; }
.offer-product-top .button, .offer-category-row .button { flex: 0 0 auto; }
.offer-product-card p { margin: 0; }
.offer-product-warning { color: var(--yellow); }
.offer-categories-panel summary { cursor: pointer; font-size: 16px; font-weight: 800; }
.offer-categories-panel > p { margin-top: 14px; }
.offer-category-form { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) minmax(0, 1.5fr) auto; align-items: end; gap: 12px; margin: 18px 0; }
.offer-category-form label { display: grid; gap: 6px; min-width: 0; color: var(--muted); font-size: 12px; }
.offer-category-form input, .offer-category-form select { width: 100%; }
.offer-category-row small { display: block; margin-top: 5px; color: var(--muted); }
.offer-source-form { display: grid; grid-template-columns: minmax(0,2fr) minmax(110px, .4fr) auto; align-items: end; gap: 12px; margin: 18px 0; }
.offer-source-form label { display: grid; gap: 6px; min-width: 0; font-size: 12px; color: var(--muted); }
.offer-source-form select, .offer-source-form input { width: 100%; }
.offer-source-form small { font-size: 10px; }
.offer-sources-list, .offer-messages-list { display: grid; gap: 10px; }
.offer-source-card, .offer-message-card { min-width: 0; padding: 16px; border: 1px solid var(--line-soft); border-radius: 12px; background: #0b100d; }
.offer-source-heading, .offer-message-heading { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.offer-source-heading strong, .offer-message-heading strong { overflow-wrap: anywhere; }
.offer-source-actions { display: flex; align-items: center; flex-wrap: wrap; gap: 8px; margin-top: 14px; }
.offer-source-actions input { width: 76px; min-width: 76px; }
.offer-message-card p { white-space: pre-wrap; overflow-wrap: anywhere; max-height: 9em; overflow: auto; margin: 12px 0; line-height: 1.5; }
.offer-message-card small, .offer-message-card time { color: var(--muted); font-size: 12px; }
#older-offer-messages { margin-top: 16px; }
@media (max-width: 760px) { #offers-view .panel { padding: 16px; }#offers-view .panel-heading { align-items: flex-start; flex-wrap: wrap; }.offer-source-form { grid-template-columns: 1fr 100px; }.offer-source-form .button { grid-column: 1 / -1; }.offer-category-form { grid-template-columns: 1fr; }.offer-message-heading, .offer-candidate-heading { align-items: flex-start; flex-direction: column; } }

dialog { width: min(92vw, 460px); max-height: 92vh; overflow-y: auto; padding: 28px; border: 1px solid var(--line); border-radius: 18px; background: #101512; color: var(--text); box-shadow: 0 30px 100px #000; }
.disconnect-warning { padding: 12px; border: 1px solid #743d32; border-left: 3px solid var(--red); border-radius: 9px; background: #2a1915; color: #ffc1b5; line-height: 1.5; font-size: 13px; }
.disconnect-warning[hidden], .dialog-close[hidden] { display: none; }
#disconnect-dialog, #qr-dialog { width: min(460px, calc(100vw - 32px)); max-height: calc(100dvh - 32px); overflow-x: hidden; overflow-wrap: anywhere; }
#disconnect-dialog p, #qr-dialog p { line-height: 1.5; margin-bottom: 16px; }
#qr-title { padding-right: 24px; line-height: 1.2; }
#disconnect-action, #refresh-qr { width: 100%; white-space: normal; padding: 10px 16px; }
#disconnect-dialog .small { margin: 12px 0 0; }
@media (max-width: 480px) { #disconnect-dialog, #qr-dialog { padding: 22px; } }
dialog#group-template-dialog, dialog#group-provision-dialog, dialog#group-editor-dialog, dialog#campaign-settings-dialog, dialog#group-batch-dialog, dialog#group-history-dialog, dialog#offer-editor-dialog, dialog#offer-product-dialog, dialog#offer-category-dialog { width: min(92vw, 600px); }
.history-list { display: grid; gap: 9px; max-height: min(48vh, 460px); overflow: auto; margin: 18px 0; padding-right: 4px; }
.history-item { display: flex; align-items: start; justify-content: space-between; gap: 14px; padding: 12px; border: 1px solid var(--line-soft); border-radius: 10px; background: #0b0f0c; }
.history-item strong, .history-item span { display: block; }.history-item span, .history-item small { color: var(--muted); font-size: 12px; line-height: 1.45; }.history-item small { flex: 0 0 auto; text-align: right; }
.editor-danger-zone { display: flex; align-items: center; justify-content: space-between; gap: 16px; margin-top: 18px; padding-top: 18px; border-top: 1px solid var(--line-soft); }
.editor-danger-zone p { max-width: 360px; margin: 0; color: var(--muted); font-size: 12px; line-height: 1.5; }
.editor-danger-zone .button.danger { border-color: #7c3935; background: #3a1918; color: #ff928a; }
dialog::backdrop { background: #000b; backdrop-filter: blur(5px); }
.dialog-close { position: absolute; right: 15px; top: 12px; border: 0; background: none; color: var(--muted); font-size: 28px; cursor: pointer; }
.dialog-actions { display: flex; justify-content: flex-end; gap: 10px; margin-top: 6px; }
.group-editor-actions { align-items: center; flex-wrap: wrap; }.dialog-action-spacer { flex: 1 1 10px; }.editor-rename { display: block; width: max-content; margin: -5px 0 0; color: #ffc766; }
.campaign-group-fieldset { display: grid; gap: 10px; margin: 0; padding: 14px; border: 1px solid var(--line); border-radius: 11px; }
.campaign-group-fieldset legend { padding: 0 6px; color: var(--acid); font-size: 12px; font-weight: 800; }
.campaign-group-catalog { display: grid; gap: 8px; max-height: 290px; overflow: auto; padding-right: 3px; }
.campaign-group-option { display: grid; grid-template-columns: auto minmax(0, 1fr) auto; align-items: center; gap: 10px; padding: 11px; border: 1px solid var(--line-soft); border-radius: 10px; background: #0a0e0b; cursor: pointer; }
.campaign-group-option:has(input:checked) { border-color: #4d6b39; background: #142015; }
.campaign-group-option input { width: 17px; min-height: 17px; margin: 0; accent-color: var(--acid); }
.campaign-group-option strong { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }.campaign-group-option small { color: var(--muted); font-weight: 500; }
.campaign-group-option .mini-state { color: var(--muted); font-size: 11px; text-align: right; }
.qr-content { display: grid; padding: 12px; margin: 16px 0; place-items: center; border-radius: 14px; background: white; overflow: hidden; }
.qr-content[hidden] { display: none; }
.qr-content img { display: block; width: min(100%, 290px); height: auto; }
.loader { width: 42px; height: 42px; border: 4px solid #d8ddd8; border-top-color: #111; border-radius: 50%; animation: spin .8s linear infinite; }
@keyframes spin { to { transform: rotate(360deg); } }
.form-error { min-height: 21px; color: #ff8177; font-size: 13px; }

.login-page { display: grid; min-height: 100vh; place-items: center; padding: 30px; background: radial-gradient(circle at 18% 28%, #1d3120 0, transparent 30%), linear-gradient(120deg, #070908 52%, #0d120f 52%); }
.login-shell { display: grid; grid-template-columns: 1.1fr .9fr; width: min(1060px, 100%); align-items: center; gap: clamp(30px, 8vw, 100px); }
.login-intro h1 { max-width: 620px; margin: 28px 0 18px; font-size: clamp(54px, 7vw, 94px); line-height: .87; }
.lede { max-width: 550px; color: #b0b9b2; font-size: 18px; line-height: 1.6; }
.signal-strip { display: flex; gap: 8px; align-items: end; height: 64px; margin-top: 38px; }
.signal-strip span { display: block; width: 7px; background: var(--acid); }
.signal-strip span:nth-child(1) { height: 18px; }.signal-strip span:nth-child(2) { height: 35px; }.signal-strip span:nth-child(3) { height: 27px; }.signal-strip span:nth-child(4) { height: 54px; }.signal-strip span:nth-child(5) { height: 43px; }
.offers-intro { margin: 0 0 18px; }
.offer-section-nav { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 18px; }
.offer-section-nav button { padding: 10px 16px; border: 1px solid var(--line); border-radius: 10px; color: var(--muted); background: transparent; cursor: pointer; }
.offer-section-nav button.active { color: var(--text); border-color: var(--acid); background: #b3ff1710; }
[data-offers-panel][hidden], #offer-publication-validity-field[hidden] { display: none; }
.offer-queue-panel { padding: 22px; margin-bottom: 16px; min-width: 0; }
.offer-publication-preview { white-space: pre-wrap; overflow-wrap: anywhere; padding: 14px; margin: 14px 0; border: 1px solid var(--line); border-radius: 10px; background: #080d0a; color: var(--text); font: inherit; line-height: 1.5; }
.offer-publication-history { display: grid; gap: 12px; margin-top: 18px; }
.offer-publication-history p { margin: 0; padding-bottom: 12px; border-bottom: 1px solid var(--line); }
.offer-candidate-actions input[type=number] { width: 80px; }
@media (max-width: 760px) { .offer-queue-panel { padding: 16px; }.offer-section-nav button { flex: 1 1 120px; } }
.login-card { padding: clamp(26px, 5vw, 48px); }
.login-card form { display: grid; gap: 16px; margin-top: 28px; }

@media (max-width: 1050px) {
  :root { --sidebar: 76px; }
  .financial-summary-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .sidebar { padding-inline: 12px; }
  .sidebar .brand > span:last-child, .nav-item:not(.active)::after, .nav-item { font-size: 0; }
  .nav-item { justify-content: center; }.nav-item span { font-size: 20px; }
  .sidebar-foot { display: grid; justify-content: center; }.sidebar-foot .small { display: none; }
  .metric-grid { grid-template-columns: repeat(2, 1fr); }
  .connection-layout, .shopee-settings-grid { grid-template-columns: 1fr; }
  .connection-alerts { position: static; }
}
@media (max-width: 760px) {
  :root { --sidebar: 0px; }
  .app-shell { display: block; }.sidebar { position: fixed; inset: auto 10px 10px; width: auto; height: 62px; flex-direction: row; align-items: center; padding: 7px; border: 1px solid var(--line); border-radius: 15px; }
  .sidebar .brand, .sidebar-foot { display: none; }.sidebar nav { display: flex; width: 100%; margin: 0; }.nav-item { padding: 10px; }
  .workspace { padding: 22px 16px 96px; }.topbar, .hero-row, .section-head { align-items: flex-start; flex-direction: column; }.top-actions { justify-content: flex-start; }.campaign-picker { grid-template-columns: 1fr; width: 100%; }.campaign-combobox { width: 100%; }.campaign-options { left: 0; right: auto; width: 100%; }
  .metric-grid, .financial-summary-grid, .deep-link-metrics { grid-template-columns: 1fr 1fr; }.dashboard-grid, .settings-grid, .sales-grid, .group-grid, .analytics-grid, .data-quality-grid, .campaigns-grid, .deep-link-list, .connection-layout, .shopee-settings-grid { grid-template-columns: 1fr; }.connection-alerts { position: static; }.span-2 { grid-column: span 1; }
  .group-directory-heading, .members-panel-heading { align-items: flex-start; flex-direction: column; }.group-heading-actions { justify-content: flex-start; }.member-panel-actions { justify-content: flex-start; }.group-toolbar { grid-template-columns: 1fr; }.group-batch-controls { justify-content: flex-start; }.group-batch-controls > * { flex: 1 1 170px; }.member-card { grid-template-columns: 1fr; align-items: flex-start; }.member-badges, .member-actions { justify-content: flex-start; }.history-filters { grid-template-columns: repeat(2,minmax(0,1fr)); }.history-filters .button { grid-column: span 2; }
  .conversion-toolbar, .sales-report-controls { grid-template-columns: 1fr 1fr; }.conversion-toolbar .button, .sales-report-controls .button { grid-column: span 2; }.sales-report-filter { grid-template-columns: 1fr; }.sales-filter-actions { justify-content: flex-start; }
  .deep-link-explainer, .deep-link-card-footer { align-items: flex-start; flex-direction: column; }.deep-link-card-footer .button-row { justify-content: flex-start; }.deep-link-explainer-state { place-items: start; }
  .login-page { background: var(--ink); }.login-shell { grid-template-columns: 1fr; }.login-intro { display: none; }
}
@media (max-width: 460px) { .instance-heading, .group-card-head { align-items: flex-start; flex-direction: column; }.instance-badges { justify-content: flex-start; }.group-status { text-align: left; } }
@media (max-width: 600px) { .group-leads-export > summary, .group-leads-content { padding-inline: 16px; }.group-leads-actions .button { flex: 1 1 calc(50% - 9px); } }
@media (max-width: 460px) { .metric-grid, .financial-summary-grid { grid-template-columns: 1fr; }.segmented { width: 100%; overflow-x: auto; }.top-actions .button { flex: 1; } }

@media (max-width: 760px) {
  .group-bulk-bar { align-items: flex-start; flex-direction: column; }
  .group-bulk-actions { justify-content: flex-start; }
  .editor-danger-zone { align-items: flex-start; flex-direction: column; }
  .sidebar nav { min-width: 0; overflow-x: auto; overflow-y: hidden; scrollbar-width: thin; }
  .sidebar .nav-item { flex: 0 0 72px; width: 72px; min-height: 47px; flex-direction: column; justify-content: center; gap: 2px; padding: 4px 2px; font-size: 10px; text-align: center; white-space: nowrap; }
  .sidebar .nav-item span { font-size: 18px; line-height: 1; }
}
@media (max-width: 460px) {
  .group-card-head, .group-card.readonly .group-card-head { display: grid; grid-template-columns: 18px 52px minmax(0,1fr); align-items: start; gap: 9px; }
  .group-card.readonly .group-card-head { grid-template-columns: 52px minmax(0,1fr); }
  .group-card-head .group-avatar { width: 52px; height: 52px; }
  .group-card-head strong { overflow: visible; text-overflow: clip; white-space: normal; overflow-wrap: anywhere; line-height: 1.25; }
  .group-card-head .group-status { grid-column: 2 / -1; justify-self: start; max-width: 100%; }
  .group-card.readonly .group-card-head .group-status { grid-column: 1 / -1; }
}
.send-center-panel { min-width:0; padding:22px; }
.marketplace-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:16px; }
.marketplace-grid { align-items:start; }
.marketplace-card { border:1px solid var(--line); border-radius:14px; padding:20px; min-width:0; background:var(--ink); }
.marketplace-card h3 { margin:0 0 8px; }
.candidate-niche-control { display:grid; grid-template-columns:minmax(0,1fr) auto; align-items:end; gap:10px; margin:14px 0; }
.candidate-niche-control p { grid-column:1/-1; margin:0; }
.marketplace-card .form-grid { margin:18px 0 12px; }
.marketplace-card input,.marketplace-card select { min-width:0; width:100%; }
.marketplace-card .integration-note { overflow-wrap:anywhere; }
.marketplace-card .integration-note[data-state="not_configured"] { border-color:var(--line); border-left-color:var(--muted); color:var(--muted); background:var(--surface-2); }
.marketplace-card .integration-note[data-state="unverified"],.marketplace-card .integration-note[data-state="validating"] { border-color:#61502b; border-left-color:var(--yellow); color:#f2d9a8; background:#241b12; }
.marketplace-card .integration-note[data-state="error"] { border-color:#653a33; border-left-color:var(--red); color:#ffaaa1; background:#2a1715; }
#send-shopee-integration { margin-bottom:18px; }
#send-shopee-integration .panel { margin:0; padding:20px; }
#send-batch-preview-list { display:grid; gap:12px; }
.send-test-form { display:flex; align-items:end; flex-wrap:wrap; gap:12px; margin:18px 0; }
.send-test-form label { display:grid; gap:6px; min-width:0; flex:1 1 260px; color:var(--muted); font-size:12px; }
.send-test-form select { width:100%; min-width:0; }
.send-sequence-form { border-block:1px solid var(--line); padding:18px 0; margin:18px 0; }
.send-sequence-steps { display:grid; gap:12px; margin:14px 0; }
.send-sequence-row { display:grid; grid-template-columns:minmax(150px,1fr) 85px auto; gap:12px; align-items:end; }
.send-sequence-row label { display:grid; gap:6px; min-width:0; color:var(--muted); font-size:12px; }
.send-sequence-row input,.send-sequence-row select { width:100%; min-width:0; }
.send-sequence-actions { display:flex; flex-wrap:wrap; gap:6px; }
.send-sequence-actions .button { padding:10px; }
.send-automatic-option { display:flex; align-items:center; gap:10px; margin:18px 0 8px; }
.send-automatic-option input { width:18px; height:18px; flex:0 0 18px; }
@media(max-width:760px){.send-sequence-row { grid-template-columns:minmax(0,1fr) 85px; }.send-sequence-actions { grid-column:1/-1; }}
.send-test-counts { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px; margin:16px 0 24px; }
.send-test-counts .empty-state { grid-column:1/-1; }
.send-test-counts p { margin:0; }
#send-test-status { overflow-wrap:anywhere; }
#send-test-status[data-state="error"] { border-left-color:var(--red); color:#ffaaa1; background:#2a1715; }
#send-test-status[data-state="connected"] { border-left-color:var(--mint); }
@media(max-width:600px){.send-test-counts { grid-template-columns:1fr; }.send-test-form .button { flex:1 1 100%; }}