/* Generated from docs/dashboard/tokens-applied.css. Re-copy when tokens change. */
:root {
  --color-bg: #0b0f17;
  --color-surface: #11172a;
  --color-surface-2: #1a2238;
  --color-border: #2a3454;
  --color-text: #e8ecf4;
  --color-text-muted: #9ca7c7;
  --color-accent: #5b8bff;
  --color-state-calm: #6b7a99;
  --color-state-attention: #facc15;
  --color-state-due: #fb923c;
  --color-state-overdue: #ef4444;
  --color-state-very_overdue: #dc2626;
  --color-state-watch_only: #525c7a;
  --font-sans: Inter, system-ui, sans-serif;
  --font-mono: 'JetBrains Mono', ui-monospace, monospace;
  --row-h: 44px;
  --radius-md: 8px;
}
html, body { background: var(--color-bg); color: var(--color-text); font-family: var(--font-sans); }

/* === Modal === */
/* HTMX-injected — Tailwind play CDN doesn't catch arbitrary values reliably on
   dynamically swapped content, so we use real CSS here for layout-critical rules. */
.modal-overlay {
  position: fixed;
  inset: 0;
  background: rgba(0, 0, 0, 0.6);
  display: flex;
  align-items: center;
  justify-content: center;
  z-index: 50;
  padding: 24px;
}
.modal-card {
  background: var(--color-surface);
  border-radius: var(--radius-md);
  max-width: 720px;
  width: 100%;
  padding: 24px;
  box-shadow: 0 24px 48px rgba(0, 0, 0, 0.5);
  max-height: calc(100vh - 48px);
  overflow-y: auto;
}
.modal-header {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  margin-bottom: 16px;
}
.modal-close {
  background: none;
  border: none;
  color: var(--color-text-muted);
  font-size: 24px;
  cursor: pointer;
  padding: 0 8px;
  text-decoration: none;
  line-height: 1;
}
.modal-close:hover { color: var(--color-text); }
.modal-card .sources-header .modal-close { display: none; }
.modal-tabs {
  display: flex;
  gap: 16px;
  border-bottom: 1px solid var(--color-border);
  margin-bottom: 12px;
}
.modal-tabs button {
  background: none;
  border: none;
  color: var(--color-text-muted);
  padding: 8px 0;
  cursor: pointer;
  font-size: 14px;
}
.modal-tabs button.active {
  color: var(--color-text);
  border-bottom: 2px solid var(--color-accent);
}
.modal-section { font-size: 14px; }
.modal-section > * + * { margin-top: 8px; }
.state-pill {
  display: inline-block;
  padding: 2px 8px;
  border-radius: 4px;
  font-size: 12px;
  color: #0b0f17;
}
.btn-primary {
  padding: 6px 14px;
  background: var(--color-accent);
  color: #0b0f17;
  border: none;
  border-radius: 6px;
  cursor: pointer;
  font-weight: 500;
}
.btn-primary:hover { filter: brightness(1.1); }
.btn-secondary {
  padding: 6px 14px;
  background: transparent;
  color: var(--color-text);
  border: 1px solid var(--color-border);
  border-radius: 6px;
  cursor: pointer;
}
.btn-secondary:hover { background: var(--color-surface-2); }
.btn-row { display: flex; gap: 8px; flex-wrap: wrap; margin-top: 8px; }
.btn-row form { margin: 0; }
.input-text {
  background: var(--color-bg);
  border: 1px solid var(--color-border);
  color: var(--color-text);
  padding: 6px 10px;
  border-radius: 6px;
  font-family: var(--font-mono);
  font-size: 12px;
  width: 100%;
}
details summary { cursor: pointer; padding: 6px 0; }
details > div, details > form { margin-top: 8px; }

/* === Header (legacy, kept for backward compat) === */
.app-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 16px 24px;
  border-bottom: 1px solid var(--color-border);
}
.app-header h1 { font-size: 18px; font-weight: 600; margin: 0; }
.app-header nav { display: flex; gap: 12px; }
.app-header a {
  color: var(--color-text-muted);
  text-decoration: none;
  font-size: 14px;
}
.app-header a:hover { color: var(--color-text); }
.app-header a.btn-primary { color: #0b0f17; }

/* === App shell: sidebar + main === */
.app-shell {
  display: grid;
  grid-template-columns: 240px 1fr;
  min-height: 100vh;
}
.app-sidebar {
  background: #0e1216;
  border-right: 1px solid var(--color-border);
  padding: 18px 14px;
  position: sticky;
  top: 0;
  height: 100vh;
  overflow: auto;
}
.app-logo {
  font-weight: 700;
  font-size: 15px;
  letter-spacing: .3px;
  margin-bottom: 18px;
  display: flex;
  align-items: center;
  gap: 8px;
  color: var(--color-text);
}
.app-logo-dot {
  width: 8px;
  height: 8px;
  background: #5eead4;
  border-radius: 50%;
  box-shadow: 0 0 8px #5eead4;
  display: inline-block;
}
.nav-section {
  font-size: 11px;
  text-transform: uppercase;
  color: var(--color-text-muted);
  letter-spacing: .8px;
  margin: 14px 8px 6px;
}
.app-nav {
  display: flex;
  flex-direction: column;
  gap: 2px;
}
.app-nav a {
  display: block;
  padding: 7px 10px;
  border-radius: 7px;
  color: #c7cdd5;
  text-decoration: none;
  font-size: 13px;
}
.app-nav a:hover {
  background: var(--color-surface);
  color: var(--color-text);
}
.app-nav a.active {
  background: rgba(94, 234, 212, .08);
  color: #5eead4;
}
.app-main {
  min-width: 0;
  overflow-x: hidden;
}
.app-topbar {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 14px 28px;
  border-bottom: 1px solid var(--color-border);
}
.topbar-crumb {
  color: var(--color-text-muted);
  font-size: 12px;
  font-family: var(--font-mono, ui-monospace, monospace);
}
.topbar-cta {
  padding: 6px 14px;
  border-radius: 6px;
  font-size: 13px;
  text-decoration: none;
}
.app-content {
  padding: 22px 28px;
}

/* === Flash banner === */
.flash { padding: 10px 16px; border-radius: 8px; font-size: 13px; margin-bottom: 14px; }
.flash-info  { background: rgba(96,165,250,.12); border: 1px solid rgba(96,165,250,.35); color: #bfdbfe; }
.flash-warn  { background: rgba(251,191,36,.10); border: 1px solid rgba(251,191,36,.35); color: #fcd47a; }
.flash-error { background: rgba(239,68,68,.10);  border: 1px solid rgba(239,68,68,.35);  color: #fca5a5; }

/* === KPI row === */
.kpi-row { display: grid; grid-template-columns: repeat(5, 1fr); gap: 12px; }
.kpi-card { background: var(--color-surface); border: 1px solid var(--color-border); border-radius: 10px; padding: 12px 14px; }
.kpi-label { color: var(--color-text-muted); font-size: 11px; text-transform: uppercase; letter-spacing: .6px; }
.kpi-value { font-size: 22px; font-weight: 600; margin-top: 4px; font-family: var(--font-mono); }
.kpi-value.accent  { color: #5eead4; }
.kpi-value.pending { color: #a78bfa; }
.kpi-value.warn    { color: #fbbf24; }
.kpi-delta { font-size: 11px; color: var(--color-text-muted); margin-top: 2px; }

/* === Attention banner === */
.attention-box { background: linear-gradient(180deg,#1a1226 0%,#13171c 100%); border: 1px solid rgba(167,139,250,.35); border-radius: 12px; padding: 14px 18px; }
.att-count { font-family: var(--font-mono); font-size: 12px; color: #a78bfa; background: rgba(167,139,250,.12); padding: 2px 8px; border-radius: 999px; }
.att-row { display: grid; grid-template-columns: 28px 1fr 2fr 120px; gap: 10px; align-items: center; padding: 7px 8px; border-radius: 8px; }
.att-row:hover { background: rgba(255,255,255,.03); }
.att-icon { font-size: 14px; }
.att-brand { font-weight: 600; font-size: 13px; }

/* === Section headers === */
.section-hdr { display: flex; align-items: center; gap: 10px; }
.section-hdr-title { font-size: 12px; text-transform: uppercase; letter-spacing: .6px; color: var(--color-text-muted); font-weight: 600; }
.legend-bar { display: flex; gap: 10px; flex-wrap: wrap; font-size: 11px; color: var(--color-text-muted); background: rgba(255,255,255,.02); border: 1px dashed var(--color-border); border-radius: 7px; padding: 8px 12px; }

/* === Brands table === */
.table-wrap { background: var(--color-surface); border: 1px solid var(--color-border); border-radius: 10px; overflow: hidden; }
.table-wrap table { width: 100%; border-collapse: collapse; }
.table-wrap th, .table-wrap td { padding: 10px 14px; text-align: left; font-size: 12.5px; border-bottom: 1px solid var(--color-border); }
.table-wrap th { color: var(--color-text-muted); font-size: 11px; text-transform: uppercase; letter-spacing: .5px; background: #0e1216; font-weight: 500; }
.table-wrap tr:last-child td { border-bottom: none; }
.table-wrap tr:hover td { background: rgba(255,255,255,.02); }
.section-group-row td { padding: 6px 14px; background: rgba(255,255,255,.02); }
.section-group-label { font-size: 11px; text-transform: uppercase; letter-spacing: .5px; color: var(--color-text-muted); font-weight: 600; }
.bumped-row td { background: rgba(167,139,250,.04); }
.bumped-row td:first-child { border-left: 3px solid #a78bfa; padding-left: 11px; }
.bumped-row:hover td { background: rgba(167,139,250,.09); }
.brand-name { font-weight: 600; font-size: 13px; }
.brand-slug { color: var(--color-text-muted); font-family: var(--font-mono); font-size: 11px; margin-top: 1px; }
.num-pill { font-family: var(--font-mono); font-size: 13px; color: #5eead4; background: rgba(94,234,212,.08); border: 1px solid rgba(94,234,212,.25); padding: 2px 8px; border-radius: 6px; display: inline-block; }

/* Status pills (st-pill) */
.st-pill { display: inline-flex; align-items: center; gap: 5px; font-size: 12px; }
.st-dot { width: 7px; height: 7px; border-radius: 50%; background: #4b5563; }
.st-200 .st-dot { background: #22c55e; box-shadow: 0 0 5px #22c55e; }
.st-200 { color: #86efac; font-weight: 600; }
.st-404 .st-dot { background: #4b5563; }
.st-404 { color: var(--color-text-muted); }
.st-5xx .st-dot { background: #fbbf24; }
.st-5xx { color: #fcd47a; }

/* Small buttons */
.btn-sm { display: inline-block; border: 1px solid var(--color-border); background: #222932; color: var(--color-text); padding: 4px 10px; border-radius: 7px; font-size: 11px; cursor: pointer; text-decoration: none; font-family: var(--font-sans); }
.btn-sm:hover { background: #2a3340; }
.btn-primary-sm { background: #0ea5a3; border-color: #0ea5a3; color: #04201f; font-weight: 600; }
.btn-primary-sm:hover { background: #14b8b6; }
.btn-warn-sm { background: #3b2a0f; border-color: #7a5a1a; color: #fcd47a; }

/* === Status pills (aggregator status_label) === */
.status-pill { display: inline-flex; align-items: center; gap: 6px; border-radius: 999px; padding: 3px 10px; font-size: 11px; border: 1px solid var(--color-border); background: #1d2530; color: var(--color-text-muted); }
.status-pill.still   { background: rgba(75,85,99,.15); border-color: #4b5563; color: var(--color-text-muted); }
.status-pill.changed { background: rgba(167,139,250,.08); border-color: rgba(167,139,250,.35); color: #c4b5fd; font-weight: 600; }
.status-pill.err     { background: rgba(239,68,68,.08);  border-color: rgba(239,68,68,.35);  color: #fca5a5; }
.status-pill.dash    { background: #1d2530; color: var(--color-text-muted); }
.status-pill.forecast-pill { background: rgba(167,139,250,.10); border: 1px solid rgba(167,139,250,.35); color: #c4b5fd; }

/* === Paused chips === */
.paused-chip { background: var(--color-surface); border: 1px solid var(--color-border); border-radius: 999px; padding: 4px 12px; font-size: 12px; color: var(--color-text-muted); text-decoration: none; transition: border-color 120ms, color 120ms; }
.paused-chip:hover { border-color: var(--color-accent); color: var(--color-text); }

/* === Aggregator disarmed state === */
.source-agg-disarmed { opacity: 0.55; filter: grayscale(40%); }
.source-agg-disarmed:hover { opacity: 0.8; }

/* === Forecast state pills (dashboard column) === */
.fc-pill { display: inline-block; border-radius: 999px; padding: 2px 8px; font-size: 11px; line-height: 1.6; border: 1px solid var(--color-border); background: #1d2530; color: var(--color-text-muted); font-family: var(--font-mono); }
.fc-pill.fc-calm         { background: rgba(34,197,94,.08);  border-color: rgba(34,197,94,.35);  color: #86efac; }
.fc-pill.fc-attention    { background: rgba(234,179,8,.08);  border-color: rgba(234,179,8,.35);  color: #fde68a; }
.fc-pill.fc-due          { background: rgba(249,115,22,.10); border-color: rgba(249,115,22,.40); color: #fdba74; }
.fc-pill.fc-overdue      { background: rgba(239,68,68,.10);  border-color: rgba(239,68,68,.45);  color: #fca5a5; font-weight: 600; }
.fc-pill.fc-very_overdue { background: rgba(239,68,68,.18);  border-color: rgba(239,68,68,.70);  color: #fecaca; font-weight: 700; }
.fc-pill.fc-watch_only   { background: rgba(148,163,184,.08); border-color: rgba(148,163,184,.30); color: var(--color-text-muted); }

/* === Source mix tag (dashboard column) === */
.src-mix { display: inline-block; border-radius: 6px; padding: 1px 6px; font-size: 11px; }
.src-mix-agg    { background: rgba(167,139,250,.10); color: #c4b5fd; }
.src-mix-donor  { background: rgba(34,197,94,.08);  color: #86efac; }
.src-mix-mixed  { color: var(--color-text-muted); }
.src-mix-none   { color: var(--color-text-muted); opacity: .5; }

/* === Landings grid === */
.landings-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 12px; }
.landing-card { background: var(--color-surface); border: 1px solid var(--color-border); border-radius: 10px; padding: 14px 16px; }
.landing-bumped { border-color: rgba(167,139,250,.45); background: linear-gradient(180deg,rgba(167,139,250,.05),var(--color-surface)); }
.landing-host { font-weight: 600; font-size: 13px; }
.landing-url { font-family: var(--font-mono); font-size: 11px; color: var(--color-text-muted); margin: 3px 0 8px; word-break: break-all; }
.landing-stat { display: flex; align-items: center; justify-content: space-between; font-size: 12px; color: var(--color-text-muted); }
.landing-actions { display: flex; gap: 6px; }
.delta-new { color: #c4b5fd; font-weight: 600; }

/* === Sources page === */
.sources-card { background: var(--color-surface); border: 1px solid var(--color-border); border-radius: 12px; overflow: hidden; max-width: 900px; }
.sources-header { display: flex; align-items: center; justify-content: space-between; padding: 18px 22px; border-bottom: 1px solid var(--color-border); background: var(--color-surface-2); }
.sources-title { font-size: 18px; font-weight: 600; }
.sources-meta-row { display: flex; gap: 14px; flex-wrap: wrap; padding: 16px 22px; border-bottom: 1px solid var(--color-border); background: var(--color-surface-2); }
.meta-card { flex: 1 1 160px; background: var(--color-surface); border: 1px solid var(--color-border); border-radius: 10px; padding: 10px 14px; }
.meta-k { color: var(--color-text-muted); font-size: 11px; text-transform: uppercase; letter-spacing: .6px; margin-bottom: 4px; }
.meta-v { font-family: var(--font-mono); font-size: 15px; }
.meta-v.accent { color: #5eead4; }
.sources-body { padding: 22px; }
.sources-section-title { display: flex; align-items: center; gap: 10px; margin: 0 0 10px; }
.sources-section-title h3 { margin: 0; font-size: 12px; text-transform: uppercase; color: var(--color-text-muted); letter-spacing: .8px; font-weight: 600; }
.sources-hr { flex: 1; height: 1px; background: var(--color-border); }
.source-card { border: 1px solid var(--color-border); border-radius: 10px; padding: 14px 16px; margin-bottom: 10px; background: var(--color-surface-2); }
.source-primary { border-left: 3px solid #5eead4; }
.source-agg { border-left: 3px solid #3b4754; }
.source-agg-changed { border-left-color: #a78bfa; }
.source-agg-err { border-left-color: #ef4444; }
.source-our { border-left: 3px solid #60a5fa; background: rgba(96,165,250,.04); }
.source-head { display: flex; align-items: center; justify-content: space-between; margin-bottom: 6px; gap: 10px; }
.source-name { display: flex; align-items: center; gap: 8px; font-weight: 600; font-size: 14px; min-width: 0; flex: 1 1 auto; overflow: hidden; }
.source-name > span { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.source-name > span.source-role { flex-shrink: 0; }
.source-name > span.src-dot { flex-shrink: 0; }
.copy-triplet-btn {
  min-width: 120px;       /* reserves room for "✓ скопировано" so click doesn't shift */
  height: 26px;
  text-align: center;
  white-space: nowrap;
  flex-shrink: 0;
  background: transparent;
  border: 1px solid var(--color-border);
  border-radius: 4px;
  padding: 0 8px;
  color: var(--color-text-muted);
  cursor: pointer;
  font-size: 12px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}
.copy-triplet-btn:hover {
  background: var(--color-surface-2);
  color: var(--color-text);
}
.copy-triplet-btn svg {
  display: block;
}
.copy-feedback {
  color: var(--color-good, #22c55e);
}
.source-role { color: var(--color-text-muted); font-size: 11px; font-weight: 400; text-transform: uppercase; letter-spacing: .5px; }
.src-dot { width: 8px; height: 8px; border-radius: 50%; background: var(--color-text-muted); }
.src-dot-good { background: #22c55e; box-shadow: 0 0 6px #22c55e; }
.src-dot-bad  { background: #ef4444; }
.src-dot-warn { background: #fbbf24; }
.src-dot-info { background: #60a5fa; }
.src-dot-muted { background: #4b5563; }
.src-url { font-family: var(--font-mono); font-size: 12px; color: #cfd6df; word-break: break-all; display: block; margin: 4px 0 8px; text-decoration: none; }
.src-url:hover { color: #5eead4; }
.src-meta { display: flex; gap: 14px; color: var(--color-text-muted); font-size: 12px; flex-wrap: wrap; }
.src-meta b { color: var(--color-text); font-weight: 500; }
.src-speculative { margin-top: 10px; padding: 8px 10px; border-left: 2px solid rgba(196,181,253,.45); background: rgba(167,139,250,.05); border-radius: 4px; font-size: 12px; color: var(--color-text-muted); }
.src-speculative-head { font-size: 11px; text-transform: uppercase; letter-spacing: .04em; color: #c4b5fd; margin-bottom: 6px; }
.src-speculative-row { display: flex; flex-wrap: wrap; align-items: baseline; gap: 6px; padding: 3px 0; }
.src-speculative-label { display: inline-block; min-width: 32px; font-weight: 600; color: var(--color-text); font-family: var(--font-mono); }
.src-speculative-row a { color: #cfd6df; word-break: break-all; text-decoration: none; }
.src-speculative-row a:hover { color: #5eead4; }
.src-speculative-meta { width: 100%; margin-left: 38px; font-size: 11px; }
.src-speculative-meta b { color: var(--color-text); font-weight: 500; }
.src-status-label { font-weight: 600; }
.src-status-200  { color: #86efac; }
.src-status-404  { color: #fca5a5; }
.src-status-5xx  { color: #fcd47a; }
.src-actions { display: flex; gap: 8px; flex-wrap: wrap; margin-top: 10px; }
.pending-banner { display: flex; align-items: flex-start; gap: 10px; background: rgba(167,139,250,.08); border: 1px solid rgba(167,139,250,.35); color: #d6cbff; padding: 10px 14px; border-radius: 8px; font-size: 12px; }
.history-card { background: var(--color-surface-2); border: 1px solid var(--color-border); border-radius: 10px; padding: 14px 16px; }
.history-card h4 { margin: 0 0 8px; font-size: 12px; color: var(--color-text-muted); text-transform: uppercase; letter-spacing: .6px; }
.h-row { display: flex; justify-content: space-between; font-family: var(--font-mono); font-size: 12px; padding: 5px 0; border-bottom: 1px dashed #1f2731; }
.h-row:last-child { border-bottom: none; }
.h-label.h-ok { color: #86efac; }
.h-label.h-rb { color: #fca5a5; }
.h-when { color: var(--color-text-muted); }

/* === Admin tables wrapper (desktop: transparent; mobile: horizontal scroll) === */
.adm-table-wrap { width: 100%; }

/* === Step 4 (import wizard) per-aggregator row === */
.step4-row { display: grid; grid-template-columns: 1fr 2fr auto; gap: 10px; align-items: end; }

/* ============================================================
 * Mobile responsive layer (≤ 640px)
 * — sidebar → top strip, content padding compressed,
 *   KPI 5→2, att-row stacks, table scrolls, modal fullscreen.
 * ============================================================ */
@media (max-width: 640px) {
  /* Shell: 1-column stack, sidebar превращается в верхний нав-strip */
  .app-shell {
    grid-template-columns: 1fr;
    min-height: auto;
  }
  .app-sidebar {
    position: static;
    height: auto;
    border-right: none;
    border-bottom: 1px solid var(--color-border);
    padding: 10px 12px;
    overflow-x: auto;
    overflow-y: hidden;
  }
  .app-logo { margin-bottom: 8px; font-size: 14px; }
  .nav-section { margin: 6px 4px 4px; }
  .app-nav { flex-direction: row; flex-wrap: wrap; gap: 4px; }
  .app-nav a { padding: 5px 9px; font-size: 12px; }

  /* Topbar / content: тонкие отступы */
  .app-topbar { padding: 10px 14px; }
  .app-content { padding: 14px; }
  .topbar-crumb { font-size: 11px; }
  .topbar-cta { padding: 5px 10px; font-size: 12px; }

  /* KPI: 5 → 2 колонки */
  .kpi-row { grid-template-columns: repeat(2, 1fr); gap: 8px; }
  .kpi-card { padding: 10px 12px; }
  .kpi-value { font-size: 18px; }

  /* Attention banner: каждая строка стакается icon+name / msg / cta */
  .attention-box { padding: 12px 14px; }
  .att-row {
    grid-template-columns: 24px 1fr;
    grid-template-areas:
      "icon brand"
      "msg  msg"
      "cta  cta";
    row-gap: 4px;
    column-gap: 8px;
    padding: 8px 6px;
  }
  .att-icon  { grid-area: icon; }
  .att-brand { grid-area: brand; }
  .att-msg   { grid-area: msg; }
  .att-cta   { grid-area: cta; display: flex; gap: 6px; flex-wrap: wrap; }

  /* Бренд-таблица: горизонтальный скролл вместо обрезки */
  .table-wrap { overflow-x: auto; -webkit-overflow-scrolling: touch; }
  .table-wrap table { min-width: 720px; }
  .table-wrap th, .table-wrap td { padding: 8px 10px; font-size: 11.5px; white-space: nowrap; }
  .table-wrap th { font-size: 10px; }

  .legend-bar { font-size: 10.5px; padding: 6px 9px; }

  /* Landings: 3 → 1 колонка */
  .landings-grid { grid-template-columns: 1fr; gap: 10px; }

  .paused-chip { font-size: 11px; padding: 3px 10px; }

  /* Модалка: overlay строго в visual-viewport (без щели под address-bar),
     card на 100% overlay. */
  .modal-overlay {
    padding: 0;
    align-items: stretch;
    bottom: auto;
    height: 100dvh;
  }
  .modal-card {
    max-width: 100%;
    width: 100%;
    height: 100%;
    max-height: 100%;
    border-radius: 0;
    padding: 0;                /* убираем padding с card — у каждой секции свой */
  }
  /* Sticky header: top:0 теперь = настоящий top card (а не padding-edge) */
  .modal-header {
    position: sticky;
    top: 0;
    z-index: 5;
    background: var(--color-surface);
    margin: 0;
    padding: 12px 16px;
    padding-top: max(12px, env(safe-area-inset-top));
    border-bottom: 1px solid var(--color-border);
    align-items: center;
  }
  .modal-close { font-size: 28px; padding: 4px 12px; }
  /* Tabs НЕ sticky — иначе подъезжают под header. Прокручиваются с контентом. */
  .modal-tabs {
    gap: 12px;
    overflow-x: auto;
    margin: 0 0 12px;
    padding: 8px 16px 0;
    background: var(--color-surface);
  }
  .modal-tabs button { font-size: 13px; white-space: nowrap; padding: 10px 0; }
  /* Дыхание между tabs и контентом sources (breadcrumb «Dashboard · Brand · Sources») */
  .modal-section { padding: 4px 16px 16px; }

  /* Sources page (brand_sources.html — для брат-страниц после home) */
  .sources-card { max-width: 100%; border-radius: 0; border-left: none; border-right: none; }
  .sources-header { padding: 14px; }
  .sources-meta-row { padding: 12px 14px; gap: 8px; }
  .meta-card { flex: 1 1 calc(50% - 6px); padding: 8px 10px; }
  .sources-body { padding: 14px; }
  .source-card { padding: 12px; }
  .source-head { flex-wrap: wrap; }
  .src-url { font-size: 11px; }

  .btn-row { gap: 6px; }

  /* Admin tables: horizontal scroll instead of cut-off */
  .adm-table-wrap {
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    border: 1px solid var(--color-border);
    border-radius: 6px;
  }
  .adm-table-wrap table { min-width: 640px; }
  .adm-table-wrap th, .adm-table-wrap td { white-space: nowrap; padding: 6px 10px; }

  /* Audit log filter form: wrap inputs full-width */
  .audit-filter { flex-wrap: wrap; }
  .audit-filter input,
  .audit-filter button { flex: 1 1 100%; }

  /* Import wizard step-4 aggregator row → stack */
  .step4-row { grid-template-columns: 1fr; gap: 8px; }

  /* Admin h1/h2 спокойнее */
  .app-content h1.text-xl { font-size: 17px; }
  .app-content h2.text-lg { font-size: 15px; }
}