/* MARPS unified product design system. Loaded after legacy page styles while
   screens are migrated phase-by-phase; this file is the only foundation layer. */
:root {
  color-scheme: light;
  --ds-font: var(--font-analytics, "Inter", "Onest", -apple-system, BlinkMacSystemFont, "Segoe UI", system-ui, sans-serif);

  --ds-canvas: #f5f5f7;
  --ds-surface: #ffffff;
  --ds-surface-subtle: #f2f2f7;
  --ds-surface-raised: #ffffff;
  --ds-ink: #18181b;
  --ds-ink-secondary: #5f6068;
  --ds-ink-tertiary: #797b85;
  --ds-line: rgba(24, 24, 27, .09);
  --ds-line-strong: rgba(24, 24, 27, .16);

  /* MARPS blue: quiet tinted surfaces, readable action and selected text. */
  --ds-accent: #3d6dda;
  --ds-accent-strong: #2855b5;
  --ds-accent-soft: #edf3fc;
  --ds-accent-rgb: 61, 109, 218;
  --ds-accent-light: #91b7f5;
  --ds-accent-light-rgb: 145, 183, 245;
  --ds-accent-deep: #234579;
  --ds-accent-on-deep: #dce9fc;
  --ds-accent-selection: #d6e5fb;
  --ds-blue: #147bd1;
  --ds-blue-soft: #eaf4fc;
  --ds-cyan: #087f9c;
  --ds-cyan-soft: #e6f6f8;
  --ds-green: #087a55;
  --ds-green-soft: #e9f7f1;
  --ds-orange: #bd4b14;
  --ds-orange-soft: #fff0e8;
  --ds-rose: #b52d67;
  --ds-rose-soft: #fbeaf1;
  --ds-red: #c52b36;
  --ds-red-soft: #fcecee;
  --ds-amber: #94620c;
  --ds-amber-soft: #fdf4df;

  --ds-gradient-accent: linear-gradient(135deg, #f5f8fe 0%, #f7f9fd 52%, #fafdff 100%);
  --ds-gradient-violet: var(--ds-gradient-accent); /* legacy component alias */
  --ds-gradient-blue: linear-gradient(135deg, #f6faff 0%, #f7f8fd 100%);
  --ds-gradient-cyan: linear-gradient(135deg, #f4fbfc 0%, #f7faff 100%);
  --ds-gradient-green: linear-gradient(135deg, #f5fbf8 0%, #f8fbf5 100%);
  --ds-gradient-orange: linear-gradient(135deg, #fff9f6 0%, #fdf8fa 100%);
  --ds-gradient-rose: linear-gradient(135deg, #fdf8fa 0%, #faf8fd 100%);

  --ds-space-1: 4px;
  --ds-space-2: 8px;
  --ds-space-3: 12px;
  --ds-space-4: 16px;
  --ds-space-5: 20px;
  --ds-space-6: 24px;
  --ds-space-8: 32px;
  --ds-space-10: 40px;
  --ds-space-12: 48px;
  --ds-space-16: 64px;

  --ds-text-caption: 12px;
  --ds-text-ui: 13px;
  --ds-text-body: 14px;
  --ds-text-card: 17px;
  --ds-text-section: 22px;
  --ds-text-page: 32px;
  --ds-leading-tight: 1.2;
  --ds-leading-body: 1.5;

  --ds-radius-sm: 10px;
  --ds-radius-control: 13px;
  --ds-radius-card: 22px;
  --ds-radius-feature: 28px;
  --ds-radius-pill: 999px;
  --ds-shadow-card: 0 1px 2px rgba(35, 25, 54, .025), 0 14px 38px rgba(35, 25, 54, .055);
  --ds-shadow-popover: 0 10px 28px rgba(24, 24, 27, .14);
  --ds-glass-bg: rgba(255, 255, 255, .58);
  --ds-glass-bg-strong: rgba(255, 255, 255, .72);
  --ds-glass-edge: rgba(255, 255, 255, .78);
  --ds-glass-shadow: 0 1px 0 rgba(255, 255, 255, .72) inset, 0 18px 48px rgba(48, 34, 72, .10);
  --ds-glass-blur: 30px;

  --ds-control-sm: 32px;
  --ds-control: 40px;
  --ds-control-lg: 44px;
  --ds-icon-sm: 16px;
  --ds-icon: 20px;
  --ds-icon-lg: 24px;

  --ds-duration-fast: 150ms;
  --ds-duration: 200ms;
  --ds-duration-slow: 240ms;
  --ds-ease-out: cubic-bezier(.22, 1, .36, 1);
  --ds-focus-border: #85868e;
  --ds-focus-ring: none;
  --ds-z-dropdown: 30;
  --ds-z-sticky: 40;
  --ds-z-backdrop: 50;
  --ds-z-modal: 60;
  --ds-z-toast: 10001;
  --ds-z-tooltip: 80;

  /* Analytics keeps a readable measure on ordinary laptops, but must also use
     the working area of 15–16 inch / high-resolution displays. */
  --ds-content-analytics: 1280px;
  --ds-content-analytics-wide: 1600px;

  /* Compatibility aliases. New code uses --ds-* names. */
  --bg: var(--ds-canvas);
  --bg2: var(--ds-surface);
  --bg3: var(--ds-surface-subtle);
  --t: var(--ds-ink);
  --t2: var(--ds-ink-secondary);
  --t3: var(--ds-ink-tertiary);
  --border: var(--ds-line);
  --border2: rgba(24, 24, 27, .055);
  --border-hover: var(--ds-line-strong);
  --a: var(--ds-accent);
  --a2: var(--ds-accent-strong);
  --a3: var(--ds-accent-light);
  --accent-soft: var(--ds-accent-soft);
  --accent-hover: rgba(var(--ds-accent-rgb), .04);
  --mk-violet2: var(--ds-accent-deep);
  --green: var(--ds-green);
  --green-soft: var(--ds-green-soft);
  --red: var(--ds-red);
  --red-soft: var(--ds-red-soft);
  --amber: var(--ds-amber);
  --amber-soft: var(--ds-amber-soft);
  --radius: var(--ds-radius-card);
  --r-sm: var(--ds-radius-sm);
  --r-md: var(--ds-radius-control);
  --r-lg: var(--ds-radius-card);
  --r-panel: var(--ds-radius-card);
  --mk-r-card: var(--ds-radius-card);
  --mk-r-feature: var(--ds-radius-card);
  --shadow-panel: var(--ds-shadow-card);
  --shadow-pop: var(--ds-shadow-popover);
  --mk-shadow-card: var(--ds-shadow-card);
  --mk-shadow-lift: 0 4px 8px rgba(24, 24, 27, .08);
  --dur-fast: var(--ds-duration-fast);
  --dur: var(--ds-duration);
  --dur-slow: var(--ds-duration-slow);
  --ease: var(--ds-ease-out);
}

html { font-family: var(--ds-font); text-rendering: optimizeLegibility; }
body { color: var(--ds-ink); background: var(--ds-canvas); }
button, input, select, textarea { font: inherit; }
button, [role="button"], a, input, select, textarea, summary { -webkit-tap-highlight-color: transparent; }

:where(a, button, input, select, textarea, summary, [role="button"], [role="tab"], [tabindex]):focus-visible {
  outline: 2px solid var(--ds-accent);
  outline-offset: 2px;
  box-shadow: none;
}

:where(input, select, textarea):focus-visible {
  border-color: var(--ds-focus-border);
  outline: 0;
  box-shadow: var(--ds-focus-ring);
}

:where(button, input, select, textarea):disabled,
:where(button, [role="button"])[aria-disabled="true"] {
  cursor: not-allowed;
  opacity: .5;
}

::selection { color: var(--ds-ink); background: var(--ds-accent-selection); }
input, textarea { caret-color: var(--ds-accent); }

/* Shared select: the native control remains the data source while the visible
   list is rendered as one design-system popover instead of an OS menu. */
.ds-select {
  position: relative;
  display: inline-flex;
  min-width: 0;
  max-width: 100%;
  vertical-align: middle;
}
.ds-select--block { width: 100%; }
.ds-select-source {
  position: absolute !important;
  width: 1px !important;
  height: 1px !important;
  margin: 0 !important;
  padding: 0 !important;
  overflow: hidden !important;
  clip: rect(0 0 0 0) !important;
  clip-path: inset(50%) !important;
  border: 0 !important;
  opacity: 0 !important;
  pointer-events: none !important;
}
.ds-select-trigger {
  display: flex !important;
  min-width: 0;
  align-items: center;
  justify-content: space-between;
  gap: var(--ds-space-3);
  background-image: none !important;
  text-align: left;
}
.ds-select-trigger-label {
  min-width: 0;
  flex: 1;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.ds-select-trigger-chevron {
  width: 16px;
  height: 16px;
  flex: 0 0 16px;
  color: var(--ds-ink-tertiary);
  transition: transform var(--ds-duration-fast) var(--ds-ease-out), color var(--ds-duration-fast);
}
.ds-select-trigger.is-open .ds-select-trigger-chevron { color: var(--ds-accent-strong); transform: rotate(180deg); }
.ds-select-trigger:focus-visible { outline: 2px solid var(--ds-accent); outline-offset: 2px; }
.ds-select-menu {
  position: fixed;
  z-index: 2147482000;
  display: flex;
  max-height: min(360px, calc(100vh - 24px));
  flex-direction: column;
  gap: 2px;
  padding: var(--ds-space-2);
  overflow: auto;
  border: 1px solid var(--ds-line);
  border-radius: var(--ds-radius-control);
  color: var(--ds-ink);
  background: var(--ds-surface);
  box-shadow: var(--ds-shadow-popover);
  font-family: var(--ds-font);
  animation: dsSelectIn var(--ds-duration-fast) var(--ds-ease-out);
}
@keyframes dsSelectIn { from { opacity: 0; transform: translateY(-4px); } to { opacity: 1; transform: none; } }
.ds-select-group {
  padding: var(--ds-space-3) var(--ds-space-3) var(--ds-space-1);
  color: var(--ds-ink-tertiary);
  font-size: 11px;
  font-weight: 700;
  letter-spacing: .06em;
  text-transform: uppercase;
}
.ds-select-option {
  display: flex;
  width: 100%;
  min-height: var(--ds-control-lg);
  align-items: center;
  gap: var(--ds-space-3);
  padding: var(--ds-space-2) var(--ds-space-3);
  border: 0;
  border-radius: var(--ds-radius-sm);
  color: var(--ds-ink);
  background: transparent;
  font: 500 var(--ds-text-ui)/1.3 var(--ds-font);
  text-align: left;
  cursor: pointer;
}
.ds-select-option:hover,
.ds-select-option:focus-visible { outline: 0; background: var(--ds-accent-soft); }
.ds-select-option[aria-selected="true"] { color: var(--ds-accent-strong); background: var(--ds-accent-soft); font-weight: 700; }
.ds-select-option:disabled { color: var(--ds-ink-tertiary); background: transparent; cursor: not-allowed; }
.ds-select-option-label { min-width: 0; flex: 1; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.ds-select-option-check { width: 16px; height: 16px; flex: 0 0 16px; opacity: 0; }
.ds-select-option[aria-selected="true"] .ds-select-option-check { opacity: 1; }
@media (prefers-reduced-motion: reduce) {
  .ds-select-menu { animation: none; }
  .ds-select-trigger-chevron { transition: none; }
}

/* App shell migration: one type family, quieter surfaces and one navigation
   affordance. Kept here so all legacy screens inherit the same foundation. */
.app, .app * { font-family: var(--ds-font); }
.app {
  gap: 0;
  padding: 0 0 0 var(--ds-space-3);
  background: var(--ds-canvas);
}
.aside { border-radius: var(--ds-radius-card); }
.aside {
  top: var(--ds-space-3);
  height: calc(100vh - (var(--ds-space-3) * 2));
  margin-right: 0;
  border: 1px solid rgba(255, 255, 255, .88);
  background: rgba(255, 255, 255, .64);
  box-shadow: 0 1px 0 rgba(255, 255, 255, .86) inset;
  backdrop-filter: none;
  -webkit-backdrop-filter: none;
}
.main {
  height: 100vh;
  border: 0;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
  transition: background-color var(--ds-duration-slow) var(--ds-ease-out);
}
.app:has(#page-reviews-mp.on) {
  background:
    radial-gradient(ellipse 72% 52% at 12% -9%, rgba(var(--ds-accent-light-rgb), .20) 0%, rgba(var(--ds-accent-light-rgb), .09) 40%, transparent 70%),
    radial-gradient(ellipse 66% 54% at 88% -11%, rgba(var(--ds-accent-light-rgb), .19) 0%, rgba(var(--ds-accent-light-rgb), .09) 44%, transparent 71%),
    radial-gradient(ellipse 48% 35% at 51% 2%, rgba(var(--ds-accent-light-rgb), .11) 0%, transparent 73%),
    linear-gradient(180deg, #f4f7fc 0, #f4f7fc 250px, var(--ds-canvas) 470px);
}
.app:has(#page-questions.on) {
  background:
    radial-gradient(ellipse 72% 52% at 12% -9%, rgba(var(--ds-accent-light-rgb), .16) 0%, rgba(var(--ds-accent-light-rgb), .07) 40%, transparent 70%),
    radial-gradient(ellipse 66% 54% at 88% -11%, rgba(var(--ds-accent-light-rgb), .18) 0%, rgba(var(--ds-accent-light-rgb), .08) 44%, transparent 71%),
    linear-gradient(180deg, #f4f7fc 0, #f4f7fc 250px, var(--ds-canvas) 470px);
}
.app:has(#page-products.on) {
  background:
    radial-gradient(ellipse 70% 52% at 10% -9%, rgba(var(--ds-accent-light-rgb), .17) 0%, rgba(var(--ds-accent-light-rgb), .08) 42%, transparent 70%),
    radial-gradient(ellipse 68% 55% at 89% -10%, rgba(var(--ds-accent-light-rgb), .18) 0%, rgba(var(--ds-accent-light-rgb), .08) 44%, transparent 72%),
    radial-gradient(ellipse 48% 35% at 52% 2%, rgba(var(--ds-accent-light-rgb), .09) 0%, transparent 73%),
    linear-gradient(180deg, #f4f7fc 0, #f4f7fc 250px, var(--ds-canvas) 470px);
}
.aside-top { padding: var(--ds-space-5) var(--ds-space-4) var(--ds-space-4); }
.aside-nav { padding: var(--ds-space-3); }
.nav-item {
  min-height: var(--ds-control);
  border-radius: var(--ds-radius-control);
  transition: color var(--ds-duration-fast), background-color var(--ds-duration-fast);
}
.nav-item.on::before { display: none; }
.nav-item.on { color: var(--ds-accent-strong); background: var(--ds-accent-soft); }
.nav-item:hover { background: rgba(var(--ds-accent-rgb), .055); }
.nav-pill { letter-spacing: 0; text-transform: none; }
.app .banner { border-color: var(--ds-line); background: #faf9fc; }
.main-head {
  min-height: 88px;
  padding: var(--ds-space-6) var(--ds-space-10) var(--ds-space-4);
  border-bottom: 0;
  background: transparent;
}
.crumb-title, .crumb-sub { font-size: var(--ds-text-page); }
.crumb-title { font-weight: 720; letter-spacing: -.035em; }
.crumb-sub { color: var(--ds-ink-tertiary); font-weight: 500; }
.content { padding-top: var(--ds-space-4); background: transparent; }
.user-menu {
  border: 1px solid var(--ds-line);
  background: var(--ds-surface);
  box-shadow: var(--ds-shadow-popover);
  backdrop-filter: none;
  -webkit-backdrop-filter: none;
}
.brand-mark, .user-ava { background: var(--ds-accent); }

/* Shared controls: normalize the existing component vocabulary while markup is
   migrated. These are component mappings, not page-specific overrides. */
.app :is(.btn, .drawer-btn, .ins-btn, .src-add-btn, .src-token-submit, .bp-save-btn, .tpl-save-btn, .cmp-btn-primary) {
  min-height: var(--ds-control);
  border-radius: var(--ds-radius-control);
  box-shadow: none;
}
.app :is(.btn.icon, .filter-filters-btn, .drawer-close, .prod-icon-btn, .ed-hbtn, .cmp-ico-btn, .prf-close) {
  width: var(--ds-control);
  min-width: var(--ds-control);
  height: var(--ds-control);
  padding: 0;
  border-radius: var(--ds-radius-control);
  box-shadow: none;
}
.app :is(.filter-select, input:not([type="checkbox"]):not([type="radio"]):not([type="range"]), select, textarea) {
  border-radius: var(--ds-radius-control);
  box-shadow: none;
}
.app :is(.filter-select, input:not([type="checkbox"]):not([type="radio"]):not([type="range"]), select):focus,
.app textarea:focus {
  border-color: var(--ds-focus-border);
  outline: 0;
  box-shadow: var(--ds-focus-ring);
}
.app :is(.rv-tabs-segment, .set-tabs, .cat-tabs) {
  padding: var(--ds-space-1);
  border: 1px solid var(--ds-line);
  border-radius: var(--ds-radius-card);
  background: var(--ds-surface-subtle);
  box-shadow: none;
}
.app :is(.rv-tab, .set-tab, .cat-tab) { min-height: 36px; border-radius: var(--ds-radius-control); box-shadow: none; }
.app :is(.rv-tab, .set-tab, .cat-tab).on { color: var(--ds-accent-strong); background: var(--ds-surface); box-shadow: var(--ds-shadow-card); }
.app :is(.card, .mk-card, .rule-card, .prod-card, .src-card, .team-card, .api-modal-inner) {
  border-radius: var(--ds-radius-card);
  box-shadow: none;
}
.app :is(.drawer-overlay, .src-add-overlay, .prod-reco-overlay, .fpick-overlay, .api-modal) {
  background: rgba(24, 24, 27, .42);
  backdrop-filter: none;
  -webkit-backdrop-filter: none;
}
.app :is(.drawer, .src-add, .prod-reco-modal, .fpick-modal, .api-modal-inner) {
  border-radius: var(--ds-radius-card);
  box-shadow: var(--ds-shadow-popover);
}
.app :is(.skeleton, .ask-skel-pill, .ask-skel-card) { border-radius: var(--ds-radius-sm); }
.app :is(.chart-tooltip, .cat-scatter-tooltip, .card-info::after) {
  border: 1px solid rgba(255, 255, 255, .1);
  border-radius: var(--ds-radius-control);
  background: var(--ds-ink);
  box-shadow: var(--ds-shadow-popover);
}
.app :is(.set-toast) {
  border: 1px solid var(--ds-line);
  border-radius: var(--ds-radius-control);
  color: var(--ds-ink);
  background: var(--ds-surface);
  box-shadow: var(--ds-shadow-popover);
}
.app :is(.dg-chip, .cat-chip, .ask-chip, .af-chip, .fchip, .prod-chip, .ins-sel-chip, .rule-cond-chip, .rt-gcard-chip) {
  border-radius: var(--ds-radius-sm);
  box-shadow: none;
}
.app :is(.dg-empty, .sig-empty2, .actions-empty, .cat-empty, .wc-empty, .op-empty, .ins-empty, .prod-tbl-empty, .prod-reco-empty, .api-keys-empty, .team-empty) {
  border-radius: var(--ds-radius-card);
  color: var(--ds-ink-secondary);
}

/* Core workspaces: Reviews and Assortment. */
.work-page-head {
  position: relative;
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: var(--ds-space-6);
  margin-bottom: var(--ds-space-6);
  padding: var(--ds-space-8) var(--ds-space-2) var(--ds-space-6);
  overflow: hidden;
  border: 0;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
}
.work-page-head::before { display: none; }
.work-page-kicker {
  margin-bottom: var(--ds-space-2);
  color: var(--ds-accent-strong);
  font-size: var(--ds-text-caption);
  font-weight: 700;
  letter-spacing: .08em;
  text-transform: uppercase;
}
.work-page-title {
  margin: 0;
  color: var(--ds-ink);
  font-size: clamp(28px, 2.4vw, 38px);
  font-weight: 740;
  letter-spacing: -.04em;
  line-height: 1.14;
}
.work-page-subtitle {
  max-width: 68ch;
  margin: var(--ds-space-1) 0 0;
  color: var(--ds-ink-secondary);
  font-size: var(--ds-text-ui);
  line-height: var(--ds-leading-body);
}
.work-page-hint {
  width: min(620px, 100%);
  margin-top: var(--ds-space-4);
  overflow: hidden;
  border: 1px solid var(--ds-glass-edge);
  border-radius: var(--ds-radius-card);
  background: var(--ds-glass-bg);
  box-shadow: var(--ds-glass-shadow);
  backdrop-filter: blur(var(--ds-glass-blur)) saturate(140%);
  -webkit-backdrop-filter: blur(var(--ds-glass-blur)) saturate(140%);
  transition: width var(--ds-duration-slow) var(--ds-ease-out), background-color var(--ds-duration-fast), box-shadow var(--ds-duration-fast);
}
.work-page-hint:not([open]) { width: max-content; background: rgba(255, 255, 255, .48); box-shadow: 0 8px 28px rgba(48, 34, 72, .075); }
.work-page-hint summary {
  min-height: var(--ds-control-lg);
  display: flex;
  align-items: center;
  gap: var(--ds-space-2);
  padding: 0 var(--ds-space-4);
  color: var(--ds-accent-strong);
  font-size: var(--ds-text-caption);
  font-weight: 700;
  letter-spacing: .01em;
  cursor: pointer;
  list-style: none;
}
.work-page-hint summary::-webkit-details-marker { display: none; }
.work-page-hint summary::after { content: "Скрыть"; margin-left: auto; color: var(--ds-ink-tertiary); font-weight: 600; }
.work-page-hint:not([open]) summary::after { content: "Показать"; margin-left: var(--ds-space-2); }
.work-page-hint p {
  max-width: 62ch;
  margin: 0;
  padding: 0 var(--ds-space-4) var(--ds-space-4);
  color: var(--ds-ink-secondary);
  font-size: var(--ds-text-ui);
  line-height: var(--ds-leading-body);
}
.section-about { margin-top: var(--ds-space-4); }
.section-about-copy :is(.an-hero-sub, .ins-hero-sub, .set-section-sub) {
  max-width: 62ch;
  margin: 0;
  padding: 0 var(--ds-space-4) var(--ds-space-4);
  color: var(--ds-ink-secondary);
  font: 450 var(--ds-text-ui)/var(--ds-leading-body) var(--ds-font);
  letter-spacing: 0;
}
.an-hero .section-about,
.ins-hero .section-about { margin-top: var(--ds-space-5); }
#page-settings .section-about { margin: 0 0 var(--ds-space-6); }
#page-settings .set-ai-head .section-about { margin-bottom: var(--ds-space-5); }
.work-page-metric { display: flex; align-items: baseline; gap: var(--ds-space-2); flex-shrink: 0; }
.work-page-metric strong { color: var(--ds-ink); font-size: 32px; line-height: 1; font-variant-numeric: tabular-nums; }
.work-page-metric span { color: var(--ds-ink-secondary); font-size: var(--ds-text-ui); font-weight: 600; }

#page-reviews-mp .rv-tabs {
  position: relative;
  gap: var(--ds-space-3);
  padding: 10px;
  border: 0;
  border-radius: var(--ds-radius-feature);
  border: 1px solid var(--ds-line);
  background: var(--ds-surface);
  box-shadow: 0 1px 2px rgba(24, 24, 27, .025), 0 8px 22px rgba(24, 24, 27, .035);
  backdrop-filter: none;
  -webkit-backdrop-filter: none;
}
#page-reviews-mp .rv-tabs:has(.dr-pop.on) { z-index: 120; }
#page-reviews-mp .dr-wrap { z-index: 1; }
#page-reviews-mp .dr-pop { z-index: 121; }
#page-reviews-mp .rv-tabs-segment { border: 0; background: transparent; }
#page-reviews-mp .rv-tabs-right { padding-right: var(--ds-space-1); }
#page-reviews-mp .rv-empty-state {
  display: flex;
  width: 100%;
  max-width: none;
  min-height: clamp(180px, 28vh, 260px);
  grid-column: 1 / -1;
  align-items: center;
  justify-content: center;
  flex-direction: column;
  margin: var(--ds-space-6) 0 0;
  padding: var(--ds-space-8);
  border: 0;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
  text-align: center;
}
#page-reviews-mp .rv-empty-state h3 { margin: 0; color: var(--ds-ink); font-size: var(--ds-text-section); line-height: 1.3; }
#page-reviews-mp .rv-empty-state p { max-width: 48ch; margin: 0 auto; color: var(--ds-ink-secondary); font-size: var(--ds-text-ui); line-height: var(--ds-leading-body); }
#page-reviews-mp .rv-empty-state h3 + p { margin-top: var(--ds-space-2); }
#page-reviews-mp .active-filters {
  padding: var(--ds-space-4);
  border: 0;
  border-radius: var(--ds-radius-card);
  background: var(--ds-surface);
  box-shadow: var(--ds-shadow-card);
}
#page-reviews-mp .af-label { color: var(--ds-ink-tertiary); }
#page-reviews-mp .af-chip { border: 0; border-radius: var(--ds-radius-control); background: var(--ds-surface-subtle); font: inherit; cursor: pointer; }
#page-reviews-mp .af-reset { border: 0; color: var(--ds-accent-strong); background: transparent; font: inherit; cursor: pointer; }

#page-products .prod-filters {
  gap: var(--ds-space-3);
  margin-bottom: var(--ds-space-5);
  padding: 18px;
  border: 0;
  border-radius: var(--ds-radius-feature);
  border: 1px solid var(--ds-glass-edge);
  background: var(--ds-glass-bg-strong);
  box-shadow: var(--ds-glass-shadow);
  backdrop-filter: blur(var(--ds-glass-blur)) saturate(145%);
  -webkit-backdrop-filter: blur(var(--ds-glass-blur)) saturate(145%);
}
#page-products .prod-count-inline { color: var(--ds-accent-strong); background: var(--ds-accent-soft); }
#page-products .prod-search { margin-left: auto; }
#page-products .prod-card {
  border-color: transparent;
  border-radius: var(--ds-radius-feature);
  background: var(--ds-surface);
  box-shadow: 0 1px 2px rgba(35, 25, 54, .025), 0 18px 44px rgba(35, 25, 54, .06);
  transition: box-shadow var(--ds-duration-fast), transform var(--ds-duration-fast) var(--ds-ease-out);
}
#page-products .prod-card:hover { border-color: transparent; box-shadow: 0 14px 34px rgba(24, 24, 27, .075); transform: translateY(-2px); }
#page-products .prod-card-open {
  display: flex;
  width: 100%;
  min-width: 0;
  flex: 1;
  flex-direction: column;
  padding: 0;
  border: 0;
  color: inherit;
  background: transparent;
  text-align: left;
  cursor: pointer;
}
#page-products .prod-card-thumb { width: 100%; aspect-ratio: 1 / 1; background: var(--ds-surface-subtle); }
#page-products .prod-card-thumb img { object-fit: cover; }
#page-products .prod-card-pills { gap: var(--ds-space-1); }
#page-products .prod-card-pill {
  border: 1px solid rgba(255, 255, 255, .72);
  border-radius: var(--ds-radius-sm);
  box-shadow: none;
  backdrop-filter: none;
  letter-spacing: .055em;
}
#page-products .prod-card-pill.brand { color: var(--ds-accent-strong); background: rgba(246, 241, 255, .94); }
#page-products .prod-card-body { gap: var(--ds-space-2); padding: var(--ds-space-5); }
#page-products .prod-card-name { min-height: 38px; font-size: var(--ds-text-ui); font-weight: 700; line-height: 1.35; }
#page-products .prod-card-rating { margin-top: var(--ds-space-2); padding-top: var(--ds-space-3); }
#page-products .prod-card-actions {
  margin: 0 var(--ds-space-5);
  padding: var(--ds-space-3) 0 var(--ds-space-5);
  border-top: 1px solid var(--ds-line);
}
#page-products .prod-card-act { min-height: var(--ds-control); border-radius: var(--ds-radius-control); }

/* Analytics scenes. Each workspace gets a restrained category atmosphere that
   fades into the shared canvas; glass stays on controls and navigation only. */
.app:has(#page-an-digest.on),
.app:has(#page-an-reviews.on),
.app:has(#page-an-compare.on) {
  background:
    radial-gradient(ellipse 70% 52% at 9% -10%, rgba(var(--ds-accent-light-rgb), .15), transparent 70%),
    radial-gradient(ellipse 68% 55% at 90% -11%, rgba(var(--ds-accent-light-rgb), .17), transparent 72%),
    radial-gradient(ellipse 46% 34% at 52% 0%, rgba(var(--ds-accent-light-rgb), .07), transparent 73%),
    linear-gradient(180deg, #f4f7fc 0, #f4f7fc 270px, var(--ds-canvas) 490px);
}
.app:has(#page-an-signals.on),
.app:has(#page-an-impact.on) {
  background:
    radial-gradient(ellipse 72% 52% at 9% -10%, rgba(var(--ds-accent-light-rgb), .17), transparent 70%),
    radial-gradient(ellipse 66% 54% at 90% -11%, rgba(var(--ds-accent-light-rgb), .15), transparent 72%),
    radial-gradient(ellipse 42% 32% at 54% 0%, rgba(var(--ds-accent-light-rgb), .08), transparent 73%),
    linear-gradient(180deg, #f4f7fc 0, #f4f7fc 270px, var(--ds-canvas) 490px);
}
.app:has(#page-an-processing.on),
.app:has(#page-an-catalog.on) {
  background:
    radial-gradient(ellipse 72% 52% at 8% -10%, rgba(var(--ds-accent-light-rgb), .14), transparent 70%),
    radial-gradient(ellipse 66% 54% at 91% -11%, rgba(var(--ds-accent-light-rgb), .14), transparent 72%),
    radial-gradient(ellipse 42% 32% at 54% 0%, rgba(var(--ds-accent-light-rgb), .08), transparent 73%),
    linear-gradient(180deg, #f4f7fc 0, #f4f7fc 270px, var(--ds-canvas) 490px);
}
.app:has(#page-an-insights.on),
.app:has(#page-an-ask.on) {
  background:
    radial-gradient(ellipse 72% 52% at 8% -10%, rgba(var(--ds-accent-light-rgb), .16), transparent 70%),
    radial-gradient(ellipse 66% 54% at 91% -11%, rgba(var(--ds-accent-light-rgb), .13), transparent 72%),
    radial-gradient(ellipse 42% 32% at 54% 0%, rgba(var(--ds-accent-light-rgb), .08), transparent 73%),
    linear-gradient(180deg, #f4f7fc 0, #f4f7fc 270px, var(--ds-canvas) 490px);
}

.content:has(#page-an-reviews.on) > .filter-bar,
.content:has(#page-an-signals.on) > .filter-bar,
.content:has(#page-an-processing.on) > .filter-bar,
.content:has(#page-an-compare.on) > .filter-bar,
.content:has(#page-an-catalog.on) > .filter-bar,
.content:has(#page-an-impact.on) > .filter-bar {
  gap: var(--ds-space-3);
  margin-bottom: var(--ds-space-6);
  padding: 18px;
  border: 1px solid var(--ds-glass-edge);
  border-radius: var(--ds-radius-feature);
  background: var(--ds-glass-bg-strong);
  box-shadow: var(--ds-glass-shadow);
  backdrop-filter: blur(var(--ds-glass-blur)) saturate(145%);
  -webkit-backdrop-filter: blur(var(--ds-glass-blur)) saturate(145%);
}

.page[id^="page-an-"] .an-hero {
  margin-bottom: var(--ds-space-6);
  padding: var(--ds-space-8) var(--ds-space-2) var(--ds-space-6);
  border: 0;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
  overflow: visible;
}
.page[id^="page-an-"] .an-hero-inner { gap: var(--ds-space-8); align-items: center; }
.page[id^="page-an-"] .an-hero-title {
  margin-bottom: var(--ds-space-2);
  font-family: var(--ds-font);
  font-size: clamp(32px, 3vw, 42px);
  font-weight: 740;
  letter-spacing: -.045em;
  line-height: 1.1;
}
.page[id^="page-an-"] .an-hero-sub { max-width: 62ch; color: var(--ds-ink-secondary); font: 500 var(--ds-text-body)/1.55 var(--ds-font); }
.page[id^="page-an-"] .an-hero-pill {
  min-height: 30px;
  padding-inline: var(--ds-space-3);
  border: 1px solid var(--ds-glass-edge);
  color: var(--ds-accent-strong);
  background: var(--ds-glass-bg);
  box-shadow: 0 8px 24px rgba(48, 34, 72, .06);
  backdrop-filter: blur(18px) saturate(135%);
  -webkit-backdrop-filter: blur(18px) saturate(135%);
}
.page[id^="page-an-"] .an-hero-pills > .an-hero-pill + .an-hero-pill { color: #075985; background: rgba(255, 255, 255, .52); }
.page[id^="page-an-"] .an-hero-stats {
  min-width: 360px;
  gap: var(--ds-space-6);
  padding: var(--ds-space-5) var(--ds-space-6);
  border: 1px solid var(--ds-glass-edge);
  border-left: 1px solid var(--ds-glass-edge);
  border-radius: var(--ds-radius-feature);
  background: var(--ds-glass-bg);
  box-shadow: var(--ds-glass-shadow);
  backdrop-filter: blur(var(--ds-glass-blur)) saturate(140%);
  -webkit-backdrop-filter: blur(var(--ds-glass-blur)) saturate(140%);
}
.page[id^="page-an-"] .an-hero-stat-val { font-family: var(--ds-font); font-size: 36px; font-weight: 740; letter-spacing: -.035em; }

.page[id^="page-an-"] :is(.card, .sig-card2, .gp-action, .gp-funnel, .gp-pareto, .gp-bench, .ins-pick-card) {
  border: 0;
  border-radius: var(--ds-radius-feature);
  background: var(--ds-surface);
  box-shadow: var(--ds-shadow-card);
}
.page[id^="page-an-"] :is(.sig-card2, .gp-action, .ins-pick-card) { padding: var(--ds-space-6); }
.page[id^="page-an-"] :is(.sig-card2, .gp-action, .ins-pick-card):hover { border-color: transparent; box-shadow: 0 24px 54px rgba(35, 25, 54, .095); transform: translateY(-2px); }
.page[id^="page-an-"] :is(.an-pro-strip, .an-heatmap-card, .an-rings-card, .cathealth, .cat-table-wrap, .impact-table-wrap, .op-table-wrap) {
  border: 0;
  border-radius: var(--ds-radius-feature);
  background: var(--ds-surface);
  box-shadow: var(--ds-shadow-card);
}
#page-an-catalog .cat-controls {
  padding: var(--ds-space-3) var(--ds-space-4);
  border: 1px solid var(--ds-glass-edge);
  border-radius: var(--ds-radius-feature);
  background: var(--ds-glass-bg-strong);
  box-shadow: var(--ds-glass-shadow);
  backdrop-filter: blur(var(--ds-glass-blur)) saturate(145%);
  -webkit-backdrop-filter: blur(var(--ds-glass-blur)) saturate(145%);
}
#page-an-compare .cmp-hero {
  padding: var(--ds-space-5);
  border: 1px solid var(--ds-glass-edge);
  border-radius: var(--ds-radius-feature);
  background: var(--ds-glass-bg-strong);
  box-shadow: var(--ds-glass-shadow);
  backdrop-filter: blur(var(--ds-glass-blur)) saturate(145%);
  -webkit-backdrop-filter: blur(var(--ds-glass-blur)) saturate(145%);
}
#page-an-insights .ins-step-pick { padding-top: var(--ds-space-10); }
#page-an-insights .ins-hero-title { font-size: clamp(32px, 3vw, 44px); letter-spacing: -.045em; }
#page-an-insights .ins-title-accent { color: var(--ds-ink); }

@media (max-width: 980px) {
  .page[id^="page-an-"] .an-hero { padding-inline: 0; }
  .page[id^="page-an-"] .an-hero-stats { min-width: 0; width: 100%; }
}

/* Apple Health-inspired workspace surfaces: the category colour belongs to the
   whole scene, while work items remain calm, white and independently legible. */
#page-reviews-mp :is(#bulkCatBar, #bulkRespondBar, #bulkSendBar) {
  border: 1px solid var(--ds-line) !important;
  border-radius: var(--ds-radius-feature) !important;
  background: var(--ds-surface) !important;
  box-shadow: 0 1px 2px rgba(24, 24, 27, .025), 0 8px 22px rgba(24, 24, 27, .035) !important;
  backdrop-filter: none;
  -webkit-backdrop-filter: none;
}
#page-reviews-mp .rv-list { gap: var(--ds-space-6); }
#page-reviews-mp .rv-thread {
  min-height: 0;
  border: 1px solid var(--ds-line);
  border-radius: var(--ds-radius-card);
  background: var(--ds-surface);
  box-shadow: 0 1px 2px rgba(24, 24, 27, .025), 0 8px 22px rgba(24, 24, 27, .035);
  backdrop-filter: none;
  -webkit-backdrop-filter: none;
}
#page-reviews-mp .rv-thread:hover {
  border-color: var(--ds-line-strong);
  box-shadow: 0 1px 2px rgba(24, 24, 27, .03), 0 12px 28px rgba(24, 24, 27, .05);
  transform: none;
}
#page-reviews-mp .rv-thread.sel { border-color: rgba(var(--ds-accent-rgb), .34); box-shadow: 0 0 0 2px rgba(var(--ds-accent-rgb), .10); }
#page-reviews-mp .rv-th-prod {
  min-height: 82px;
  padding: var(--ds-space-5) var(--ds-space-6) var(--ds-space-4) 60px;
  border-bottom: 1px solid var(--ds-line);
  background: #fcfcfd;
}
#page-reviews-mp .rv-th-prod-thumb { border-color: var(--ds-line); background: var(--ds-surface-subtle); }
#page-reviews-mp .rv-card-review {
  padding: var(--ds-space-6) var(--ds-space-8) var(--ds-space-8);
  gap: var(--ds-space-5);
}
#page-reviews-mp .rv-card-reply {
  min-height: 0;
  margin: 0 var(--ds-space-4) var(--ds-space-4);
  padding: var(--ds-space-6);
  border: 0;
  border-radius: var(--ds-radius-card);
  background: #f7f7f9;
}
#page-reviews-mp .rv-avatar { background: var(--ds-accent); }
#page-reviews-mp .rv-card-text { max-width: 62ch; font-size: 15px; line-height: 1.7; }
#page-reviews-mp .rv-resp-text { max-width: 62ch; line-height: 1.7; }

@media (max-width: 1180px) {
  #page-reviews-mp .rv-card-reply { min-height: 0; }
}

/* Product questions intentionally inherit the reviews visual grammar 1:1.
   Only semantics and controls differ: there are no stars, tone or review tags. */
#page-questions .rv-tabs {
  position: relative; gap: var(--ds-space-3); padding: 10px;
  border: 1px solid var(--ds-line); border-radius: var(--ds-radius-feature);
  background: var(--ds-surface); box-shadow: 0 1px 2px rgba(24,24,27,.025), 0 8px 22px rgba(24,24,27,.035);
}
#page-questions .rv-tabs-segment { border: 0; background: transparent; }
#page-questions .rv-list { gap: var(--ds-space-6); }
#page-questions .rv-thread {
  min-height: 0; border: 1px solid var(--ds-line); border-radius: var(--ds-radius-card);
  background: var(--ds-surface); box-shadow: 0 1px 2px rgba(24,24,27,.025), 0 8px 22px rgba(24,24,27,.035);
}
#page-questions .rv-thread:hover { border-color: var(--ds-line-strong); box-shadow: 0 1px 2px rgba(24,24,27,.03), 0 12px 28px rgba(24,24,27,.05); transform:none; }
#page-questions .rv-th-prod { min-height:82px; padding:var(--ds-space-5) var(--ds-space-6) var(--ds-space-4) 60px; border-bottom:1px solid var(--ds-line); background:#fcfcfd; }
#page-questions .rv-th-prod-thumb { position:static; flex:0 0 auto; border-color:var(--ds-line); background:var(--ds-surface-subtle); }
#page-questions .rv-card-review { padding:var(--ds-space-6) var(--ds-space-8) var(--ds-space-8); gap:var(--ds-space-5); }
#page-questions .rv-card-reply { min-height:0; margin:0 var(--ds-space-4) var(--ds-space-4); padding:var(--ds-space-6); border:0; border-radius:var(--ds-radius-card); background:#f7f7f9; }
#page-questions .rv-avatar { background:var(--ds-accent); }
#page-questions .rv-card-text { max-width:62ch; font-size:15px; line-height:1.7; }
#page-questions .rv-empty-state {
  display:flex; grid-column:1 / -1; width:100%; min-height:0; align-items:center; justify-content:flex-start;
  margin:0; padding:26px 30px; border:1px solid var(--ds-line); border-radius:var(--ds-radius-card);
  background:var(--ds-surface); box-shadow:0 1px 2px rgba(24,24,27,.025),0 8px 22px rgba(24,24,27,.025); text-align:left;
}
#page-questions .rv-empty-state h3 { margin:0; color:var(--ds-ink); font-size:var(--ds-text-card); line-height:1.3; }
#page-questions .rv-empty-state p { max-width:64ch; margin:5px 0 0; color:var(--ds-ink-secondary); font-size:var(--ds-text-ui); line-height:var(--ds-leading-body); }
.q-toolbar { display:flex; align-items:center; gap:var(--ds-space-2); }
.q-context { display:flex; align-items:center; justify-content:space-between; gap:20px; margin:var(--ds-space-5) 0; padding:0 var(--ds-space-2); }
.q-context div { display:flex; align-items:baseline; gap:12px; }
.q-context b { font-size:var(--ds-text-card); }
.q-context span { color:var(--ds-ink-secondary); font-size:var(--ds-text-ui); }
.q-kind { grid-column:3; grid-row:1/3; align-self:center; padding:6px 10px; border-radius:999px; background:var(--ds-accent-soft); color:var(--ds-accent-strong); font:700 11px/1 var(--ds-font); white-space:nowrap; }
.q-answer { display:flex; flex:1; min-height:0; flex-direction:column; }
.q-answer-type { display:inline-flex; align-items:center; gap:7px; min-height:32px; color:var(--t); font:600 var(--fz-md) 'Onest',sans-serif; letter-spacing:-.008em; }
.q-answer-type svg { width:15px; height:15px; fill:none; stroke:var(--t2); stroke-width:1.7; stroke-linecap:round; stroke-linejoin:round; }
.q-answer-input { width:100%; min-height:96px; resize:vertical; margin-top:10px; padding:12px 14px; border:1px solid var(--border); border-radius:var(--r-sm); background:var(--bg2); color:var(--t); font:400 13px/1.65 'Onest',sans-serif; }
.q-answer-input:focus { outline:0; border-color:var(--ds-focus-border); box-shadow:var(--ds-focus-ring); }
.q-btn { min-height:var(--ds-control); padding:0 16px; border:1px solid var(--ds-line); border-radius:var(--ds-radius-control); background:#fff; color:var(--ds-ink); font:650 var(--ds-text-ui)/1 var(--ds-font); cursor:pointer; }
.q-btn:hover { border-color:var(--ds-line-strong); background:#fafafd; }
.q-btn-ai { color:var(--ds-accent-strong); background:var(--ds-accent-soft); border-color:transparent; }
.q-btn-send { color:#fff; background:var(--a); border-color:var(--a); }
.q-btn:disabled { opacity:.55; cursor:wait; }
.q-status { margin-top:var(--ds-space-3); font-size:var(--ds-text-caption); font-weight:700; }
.q-status-sent { color:var(--ds-green); }
.q-error { display:flex; flex-direction:column; gap:3px; margin-bottom:12px; padding:12px 14px; border-radius:var(--ds-radius-control); background:var(--ds-red-soft); color:var(--ds-red); font-size:var(--ds-text-ui); }
.q-list-state { min-height:260px; display:flex; align-items:center; justify-content:center; flex-direction:column; gap:10px; color:var(--ds-ink-secondary); }
#page-questions .rv-pagination { justify-content:center; }
#page-questions .rv-pagination button { min-height:36px; padding:0 14px; border:1px solid var(--ds-line); border-radius:var(--ds-radius-control); background:#fff; cursor:pointer; }
#page-questions .rv-pagination button:disabled { opacity:.4; cursor:default; }
#page-questions .rv-pagination span { color:var(--ds-ink-secondary); font-size:var(--ds-text-ui); }
.q-bulk-actions { display:flex; align-items:center; gap:var(--ds-space-2); }
#qBulkBar .bulk-clear { display:flex; align-items:center; justify-content:center; color:inherit; font-size:18px; }
@media(max-width:1180px){#page-questions .rv-tabs{align-items:stretch}.q-toolbar{width:100%;flex-wrap:wrap}}
@media(max-width:760px){
  #page-questions .rv-card-review{padding:20px}
  #page-questions .rv-empty-state{padding:22px}
  .q-context div{align-items:flex-start;flex-direction:column;gap:4px}
  .q-context span{display:none}
  .q-kind{grid-column:3;grid-row:1}
  .q-answer-input{min-height:120px}
  #qBulkBar{
    left:12px;right:12px;bottom:12px;width:auto;
    transform:translateY(140px) scale(.96);
    align-items:stretch;flex-direction:column;gap:8px;padding:10px 12px;
  }
  #qBulkBar.on{transform:translateY(0) scale(1)}
  #qBulkBar .bulk-count{
    width:100%;min-height:44px;padding:0 0 7px;border-right:0;border-bottom:1px solid rgba(255,255,255,.12);
  }
  #qBulkBar .bulk-count b{margin-right:auto}
  #qBulkBar .bulk-clear{width:44px;height:44px;margin:-2px -4px -2px 0;border-radius:10px}
  #qBulkBar .q-bulk-actions{display:grid;width:100%;grid-template-columns:.92fr 1fr 1.1fr;gap:6px}
  #qBulkBar .q-btn{min-width:0;min-height:48px;padding:0 6px;font-size:12px;line-height:1.15;white-space:normal;text-align:center}
}

/* Legacy page selectors occasionally reset focus styles with greater
   specificity. Interactive actions keep one crisp keyboard outline; form
   controls use their accent border plus one quiet halo, never both layers. */
.app :is(a, button, input, select, textarea, summary, [role="button"], [role="tab"], [tabindex]):focus-visible {
  outline: 2px solid var(--ds-accent) !important;
  outline-offset: 2px !important;
  box-shadow: none !important;
}
.app :is(.filter-select, input:not([type="checkbox"]):not([type="radio"]):not([type="range"]), select, textarea):not(.ds-field-shell input,.ds-field-shell textarea):focus-visible {
  border-color: var(--ds-focus-border) !important;
  outline: 0 !important;
  box-shadow: var(--ds-focus-ring) !important;
}

@media (max-width: 980px) {
  .main-head { padding: var(--ds-space-4) var(--ds-space-5); }
}

@media (max-width: 768px) {
  .app { padding: 0; gap: 0; }
  .aside {
    top: 0;
    height: 100vh;
    border-radius: 0 var(--ds-radius-card) var(--ds-radius-card) 0;
  }
  .main {
    height: 100vh;
    border: 0;
    border-radius: 0;
    box-shadow: none;
  }
}

.ds-page-header {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: var(--ds-space-5);
  min-width: 0;
  margin-bottom: var(--ds-space-6);
}
.ds-page-header__copy { min-width: 0; }
.ds-page-title {
  color: var(--ds-ink);
  font-size: var(--ds-text-page);
  font-weight: 700;
  letter-spacing: -.025em;
  line-height: var(--ds-leading-tight);
  text-wrap: balance;
}
.ds-page-subtitle {
  max-width: 70ch;
  margin-top: var(--ds-space-2);
  color: var(--ds-ink-secondary);
  font-size: var(--ds-text-body);
  line-height: var(--ds-leading-body);
  text-wrap: pretty;
}
.ds-section-title {
  color: var(--ds-ink);
  font-size: var(--ds-text-section);
  font-weight: 700;
  letter-spacing: -.018em;
  line-height: 1.3;
  text-wrap: balance;
}
.ds-section-subtitle {
  margin-top: var(--ds-space-1);
  color: var(--ds-ink-secondary);
  font-size: var(--ds-text-ui);
  line-height: var(--ds-leading-body);
}

.ds-card {
  min-width: 0;
  padding: var(--ds-space-5);
  border: 1px solid var(--ds-line);
  border-radius: var(--ds-radius-card);
  background: var(--ds-surface);
}
.ds-card--raised { border-color: transparent; box-shadow: var(--ds-shadow-card); }
.ds-card--interactive {
  transition: border-color var(--ds-duration) var(--ds-ease-out),
              background-color var(--ds-duration) var(--ds-ease-out),
              transform var(--ds-duration) var(--ds-ease-out);
}
.ds-card--interactive:hover { border-color: var(--ds-line-strong); transform: translateY(-1px); }
.ds-card__header { display: flex; align-items: flex-start; justify-content: space-between; gap: var(--ds-space-4); }
.ds-card__title { color: var(--ds-ink); font-size: var(--ds-text-card); font-weight: 650; line-height: 1.35; }
.ds-card__description { margin-top: var(--ds-space-1); color: var(--ds-ink-secondary); font-size: var(--ds-text-ui); line-height: var(--ds-leading-body); }
.ds-card__body { margin-top: var(--ds-space-5); }
.ds-card__footer { display: flex; align-items: center; justify-content: flex-end; gap: var(--ds-space-2); margin-top: var(--ds-space-5); }

.ds-metric { min-width: 0; }
.ds-metric__label { color: var(--ds-ink-secondary); font-size: var(--ds-text-caption); font-weight: 600; line-height: 1.35; }
.ds-metric__value { color: var(--ds-ink); font-size: 28px; font-weight: 700; letter-spacing: -.025em; line-height: 1.1; font-variant-numeric: tabular-nums; }
.ds-metric__unit { margin-left: 4px; color: var(--ds-ink-secondary); font-size: var(--ds-text-ui); font-weight: 600; letter-spacing: 0; }
.ds-metric__detail { margin-top: var(--ds-space-1); color: var(--ds-ink-secondary); font-size: var(--ds-text-caption); line-height: 1.4; }

.ds-accent { position: relative; overflow: hidden; }
.ds-accent::before { content: ""; position: absolute; inset: 0 0 auto; height: 4px; background: var(--ds-gradient-violet); pointer-events: none; }
.ds-accent--blue::before { background: var(--ds-gradient-blue); }
.ds-accent--cyan::before { background: var(--ds-gradient-cyan); }
.ds-accent--green::before { background: var(--ds-gradient-green); }
.ds-accent--orange::before { background: var(--ds-gradient-orange); }
.ds-accent--rose::before { background: var(--ds-gradient-rose); }

.ds-icon-button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: var(--ds-control);
  height: var(--ds-control);
  padding: 0;
  border: 0;
  border-radius: var(--ds-radius-control);
  color: var(--ds-ink-secondary);
  background: transparent;
  cursor: pointer;
  transition: color var(--ds-duration-fast), background-color var(--ds-duration-fast);
}
.ds-icon-button:hover { color: var(--ds-ink); background: var(--ds-surface-subtle); }
.ds-icon-button svg { width: var(--ds-icon); height: var(--ds-icon); }

.ds-skeleton {
  min-height: 14px;
  border-radius: var(--ds-radius-sm);
  background: #e8e9ed;
}

@media (max-width: 768px) {
  .app.collapsed .aside.mobile-open,
  .app .aside.mobile-open { z-index: 1000; }
}

@media (max-width: 768px) {
  .ds-page-header { align-items: flex-start; flex-direction: column; margin-bottom: var(--ds-space-5); }
  .ds-page-title { font-size: 24px; }
  .ds-card { padding: var(--ds-space-4); }
  .ds-icon-button { width: var(--ds-control-lg); height: var(--ds-control-lg); }
  .work-page-head { align-items: flex-start; flex-direction: column; gap: var(--ds-space-4); padding: var(--ds-space-5); }
  .work-page-title { font-size: 20px; }
  .work-page-subtitle { font-size: var(--ds-text-caption); }
  .work-page-metric strong { font-size: 28px; }
  #page-reviews-mp .rv-tabs { padding: var(--ds-space-1); background: transparent; }
  #page-reviews-mp .rv-tabs-right { padding: 0 var(--ds-space-1) var(--ds-space-1); }
  #page-reviews-mp .rv-empty-state { margin-top: var(--ds-space-8); padding: var(--ds-space-8) var(--ds-space-5); }
  #page-products .prod-filters { align-items: center; flex-wrap: nowrap; padding: var(--ds-space-3); }
  #page-products .prod-count-inline { align-self: center; justify-content: center; margin-right: auto; }
  #page-products .prod-flt { display: none; }
  #page-products .prod-filters-spacer { display: none; }
  #page-products .prod-card-thumb { aspect-ratio: 4 / 3; }
  #page-products .prod-card-act { min-height: var(--ds-control-lg); }
  #page-products :is(.prod-icon-btn, .drawer-close, .pf-sort) {
    width: var(--ds-control-lg);
    min-width: var(--ds-control-lg);
    height: var(--ds-control-lg);
  }
  .app :is(.rv-tabs-segment, .set-head, .cat-tabs) {
    max-width: 100%;
    overflow-x: auto;
    overflow-y: hidden;
    scrollbar-width: none;
    -webkit-overflow-scrolling: touch;
  }
  .app :is(.rv-tabs-segment, .set-head, .cat-tabs)::-webkit-scrollbar { display: none; }
  .app .set-tabs { width: max-content; min-width: max-content; }
  .app :is(.rv-tab, .set-tab, .cat-tab, .filter-select, .filter-filters-btn) { min-height: var(--ds-control-lg); }
  .app :is(.filter-filters-btn) { width: var(--ds-control-lg) !important; min-width: var(--ds-control-lg); height: var(--ds-control-lg); }
  .app :is(.rule-card-drag, .rule-card-kebab, .rule-kebab, .src-add-close) {
    width: var(--ds-control-lg);
    min-width: var(--ds-control-lg);
    height: var(--ds-control-lg);
  }
  .app .rcc { min-height: var(--ds-control-lg); }
  .app .set-switch {
    --h: 22px;
    width: var(--ds-control-lg);
    min-width: var(--ds-control-lg);
    height: var(--ds-control-lg);
    border-radius: var(--ds-radius-control);
    background: transparent;
  }
  .app .set-switch::before {
    content: "";
    position: absolute;
    top: 11px;
    left: 2px;
    width: 40px;
    height: 22px;
    border-radius: var(--ds-radius-pill);
    background: var(--ds-line-strong);
  }
  .app .set-switch.on { background: transparent; }
  .app .set-switch.on::before { background: var(--ds-accent); }
  .app .set-switch::after { top: 13px; left: 4px; }
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    scroll-behavior: auto !important;
    animation-duration: .01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: .01ms !important;
  }
}

/* The collapse control crosses the sidebar boundary, so its parent stacking
   context must sit above the main canvas in both expanded and collapsed modes. */
.app .aside { z-index: 70; }
.app .aside-toggle { z-index: 71; }

/* Digest — restored board with the current MARPS shell language. */
.filter-controls { display: contents; }
.digest-about-toolbar { display: none; }
.content:has(#page-an-digest.on) > .filter-bar {
  width: 100%;
  flex-wrap: nowrap;
  align-items: flex-start;
  gap: var(--ds-space-4);
  margin: 0 auto var(--ds-space-5);
  padding: 0;
  border: 0;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
}
.content:has(#page-an-digest.on) > .filter-bar .digest-about-toolbar {
  display: block;
  flex: 0 1 620px;
  margin: 0 auto 0 0;
}
.content:has(#page-an-digest.on) > .filter-bar .filter-controls {
  display: flex;
  flex: 0 0 auto;
  align-items: flex-end;
  gap: var(--ds-space-2);
  padding: 10px;
  border: 1px solid var(--ds-line);
  border-radius: var(--ds-radius-card);
  background: var(--ds-surface);
  box-shadow: 0 2px 8px rgba(24, 24, 27, .045);
}
.content:has(#page-an-digest.on) > .filter-bar .filter-item {
  flex: 0 1 190px;
  min-width: 156px;
}
.content:has(#page-an-digest.on) > .filter-bar .filter-item:has(#fSource) { flex: 0 0 230px; }
.content:has(#page-an-digest.on) > .filter-bar .filter-label {
  position: absolute;
  width: 1px;
  height: 1px;
  margin: -1px;
  overflow: hidden;
  clip: rect(0 0 0 0);
  clip-path: inset(50%);
  white-space: nowrap;
}
.content:has(#page-an-digest.on) > .filter-bar :is(.filter-select, .filter-filters-btn) {
  border-color: var(--ds-line);
  border-radius: var(--ds-radius-control);
  background-color: var(--ds-surface);
  box-shadow: none;
}

/* Compact analytics filters: these routes expose only period and source, so a
   full-width filter slab adds hierarchy without adding capability. */
.content:has(#page-an-reviews.on) > .filter-bar,
.content:has(#page-an-signals.on) > .filter-bar,
.content:has(#page-an-processing.on) > .filter-bar {
  width: 100%;
  max-width: none;
  justify-content: flex-end;
  gap: 0;
  margin: 0 0 var(--ds-space-3);
  padding: 0;
  border: 0;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
  backdrop-filter: none;
  -webkit-backdrop-filter: none;
}
.content:has(#page-an-reviews.on) > .filter-bar .filter-controls,
.content:has(#page-an-signals.on) > .filter-bar .filter-controls,
.content:has(#page-an-processing.on) > .filter-bar .filter-controls {
  display: flex;
  flex: 0 0 auto;
  margin-left: auto;
  align-items: flex-end;
  gap: var(--ds-space-2);
  padding: var(--ds-space-3);
  border: 1px solid var(--ds-line);
  border-radius: var(--ds-radius-card);
  background: var(--ds-surface);
  box-shadow: 0 2px 8px rgba(24, 24, 27, .045);
}
.content:has(#page-an-reviews.on) #page-an-reviews .an-hero,
.content:has(#page-an-signals.on) #page-an-signals .an-hero,
.content:has(#page-an-processing.on) #page-an-processing .an-hero {
  padding-top: 0;
}
.content:has(#page-an-reviews.on) > .filter-bar .filter-item,
.content:has(#page-an-signals.on) > .filter-bar .filter-item,
.content:has(#page-an-processing.on) > .filter-bar .filter-item {
  flex: 0 1 190px;
  min-width: 156px;
}
.content:has(#page-an-reviews.on) > .filter-bar .filter-item:has(#fSource),
.content:has(#page-an-signals.on) > .filter-bar .filter-item:has(#fSource),
.content:has(#page-an-processing.on) > .filter-bar .filter-item:has(#fSource) { flex: 0 0 230px; }
.content:has(#page-an-reviews.on) > .filter-bar .filter-label,
.content:has(#page-an-signals.on) > .filter-bar .filter-label,
.content:has(#page-an-processing.on) > .filter-bar .filter-label {
  position: absolute;
  width: 1px;
  height: 1px;
  margin: -1px;
  overflow: hidden;
  clip: rect(0 0 0 0);
  clip-path: inset(50%);
  white-space: nowrap;
}
.content:has(#page-an-reviews.on) > .filter-bar :is(.filter-select, .filter-filters-btn),
.content:has(#page-an-signals.on) > .filter-bar :is(.filter-select, .filter-filters-btn),
.content:has(#page-an-processing.on) > .filter-bar :is(.filter-select, .filter-filters-btn) {
  border-color: var(--ds-line);
  border-radius: var(--ds-radius-control);
  background-color: var(--ds-surface);
  box-shadow: none;
}

#page-an-digest {
  width: 100%;
}
#page-an-digest .dg-wrap { gap: var(--ds-space-5); }
.digest-about-toolbar .dg-about-copy { padding: 0 var(--ds-space-4) var(--ds-space-4); }
.digest-about-toolbar .dg-about-copy p {
  margin: 0 0 var(--ds-space-3);
  padding: 0;
}
.digest-about-toolbar .dg-about-copy ul {
  display: grid;
  gap: var(--ds-space-2);
  max-width: 74ch;
  margin: 0;
  padding-left: 20px;
  color: var(--ds-ink-secondary);
  font-size: var(--ds-text-caption);
  line-height: var(--ds-leading-body);
}
.digest-about-toolbar .dg-about-copy strong { color: var(--ds-ink); }

#page-an-digest .dg-pulse-system {
  min-height: 190px;
  padding: 28px 30px;
  border: 1px solid var(--ds-line);
  border-radius: var(--ds-radius-card);
  color: var(--ds-ink);
  background: rgba(255, 255, 255, .94);
  box-shadow: 0 2px 8px rgba(24, 24, 27, .045);
}
#page-an-digest .dg-pulse-system .dg-pulse-num { margin-top: var(--ds-space-4); }
#page-an-digest .dg-pulse-system .dg-pulse-num .mk-num {
  color: var(--ds-ink);
  font-family: var(--ds-font);
  font-size: clamp(48px, 5vw, 68px);
  font-weight: 760;
  letter-spacing: -.04em;
}
#page-an-digest .dg-pulse-system .dg-pulse-unit,
#page-an-digest .dg-pulse-system .dg-pulse-delta { color: var(--ds-ink-secondary); opacity: 1; }
#page-an-digest .dg-pulse-system .dg-pulse-right {
  display: grid;
  grid-template-columns: repeat(3, minmax(120px, 1fr));
  flex: 1 1 520px;
  gap: 0;
  max-width: 590px;
}
#page-an-digest .dg-pulse-system .dg-mini {
  min-width: 0;
  padding: var(--ds-space-3) var(--ds-space-5);
  border-left: 1px solid var(--ds-line);
}
#page-an-digest .dg-pulse-system .dg-mini-lbl { color: var(--ds-ink-secondary); opacity: 1; }
#page-an-digest .dg-pulse-system .dg-mini-val {
  color: var(--ds-ink);
  font-family: var(--ds-font);
  font-size: 38px;
  font-weight: 740;
}
#page-an-digest .dg-pulse-system .star-svg:not(.on) { fill: var(--ds-line-strong); }
#page-an-digest .dg-question { margin-top: var(--ds-space-4); }

@media (max-width: 900px) {
  .content:has(#page-an-digest.on) > .filter-bar { width: 100%; flex-wrap: wrap; }
  .content:has(#page-an-digest.on) > .filter-bar .digest-about-toolbar { flex-basis: 100%; }
  .content:has(#page-an-digest.on) > .filter-bar .filter-controls { width: 100%; }
  .content:has(#page-an-digest.on) > .filter-bar .filter-item { flex: 1 1 0; }
  .content:has(#page-an-reviews.on) > .filter-bar .filter-controls,
  .content:has(#page-an-signals.on) > .filter-bar .filter-controls,
  .content:has(#page-an-processing.on) > .filter-bar .filter-controls { width: 100%; }
  .content:has(#page-an-reviews.on) > .filter-bar,
  .content:has(#page-an-signals.on) > .filter-bar,
  .content:has(#page-an-processing.on) > .filter-bar { margin-bottom: var(--ds-space-4); }
  .content:has(#page-an-reviews.on) #page-an-reviews .an-hero,
  .content:has(#page-an-signals.on) #page-an-signals .an-hero,
  .content:has(#page-an-processing.on) #page-an-processing .an-hero { padding-top: var(--ds-space-4); }
  .content:has(#page-an-reviews.on) > .filter-bar .filter-item,
  .content:has(#page-an-signals.on) > .filter-bar .filter-item,
  .content:has(#page-an-processing.on) > .filter-bar .filter-item { flex: 1 1 0; }
  #page-an-digest .dg-pulse-system .dg-pulse-right { max-width: none; }
}
@media (max-width: 640px) {
  .content:has(#page-an-digest.on) > .filter-bar .filter-controls { overflow-x: auto; }
  .content:has(#page-an-digest.on) > .filter-bar .filter-item { min-width: 150px; }
  .content:has(#page-an-reviews.on) > .filter-bar .filter-controls,
  .content:has(#page-an-signals.on) > .filter-bar .filter-controls,
  .content:has(#page-an-processing.on) > .filter-bar .filter-controls { overflow-x: auto; }
  .content:has(#page-an-reviews.on) > .filter-bar,
  .content:has(#page-an-signals.on) > .filter-bar,
  .content:has(#page-an-processing.on) > .filter-bar { margin-bottom: var(--ds-space-3); }
  .content:has(#page-an-reviews.on) #page-an-reviews .an-hero,
  .content:has(#page-an-signals.on) #page-an-signals .an-hero,
  .content:has(#page-an-processing.on) #page-an-processing .an-hero { padding-top: var(--ds-space-3); }
  .content:has(#page-an-reviews.on) > .filter-bar .filter-item,
  .content:has(#page-an-signals.on) > .filter-bar .filter-item,
  .content:has(#page-an-processing.on) > .filter-bar .filter-item { min-width: 150px; }
  #page-an-digest .dg-pulse-system { padding: var(--ds-space-5); }
  #page-an-digest .dg-pulse-system .dg-pulse-right { grid-template-columns: minmax(0, 1fr); }
  #page-an-digest .dg-pulse-system .dg-mini {
    padding: var(--ds-space-4) 0;
    border-top: 1px solid var(--ds-line);
    border-left: 0;
  }
}

/* Phase 5 — card content system.
   Surfaces were unified in Phase 4; this layer standardises the information
   inside them: label -> primary value -> context -> action. */
.app:has(#page-settings.on) {
  background:
    radial-gradient(ellipse 72% 52% at 8% -10%, rgba(var(--ds-accent-light-rgb), .16), transparent 70%),
    radial-gradient(ellipse 66% 54% at 91% -11%, rgba(var(--ds-accent-light-rgb), .13), transparent 72%),
    radial-gradient(ellipse 42% 32% at 54% 0%, rgba(var(--ds-accent-light-rgb), .08), transparent 73%),
    linear-gradient(180deg, #f4f7fc 0, #f4f7fc 270px, var(--ds-canvas) 490px);
}

#page-settings { width: 100%; }
#page-settings .set-head,
#page-settings .set-sub {
  width: 100%;
  max-width: none;
  margin-inline: 0;
}
#page-settings .set-head {
  gap: 0;
  margin-bottom: var(--ds-space-8);
  padding-top: var(--ds-space-2);
}
.app:has(#page-settings.on) .main-head {
  width: 100%;
  box-sizing: border-box;
  margin-inline: 0;
}
#page-settings .set-tabs {
  display: flex;
  width: max-content;
  max-width: 100%;
  align-self: flex-start;
  gap: var(--ds-space-1);
  padding: var(--ds-space-1);
  border: 1px solid var(--ds-glass-edge);
  border-radius: calc(var(--ds-radius-control) + var(--ds-space-1));
  background: var(--ds-glass-bg-strong);
  box-shadow: var(--ds-glass-shadow);
  backdrop-filter: blur(var(--ds-glass-blur)) saturate(145%);
  -webkit-backdrop-filter: blur(var(--ds-glass-blur)) saturate(145%);
}
#page-settings .set-tab {
  min-width: 0;
  min-height: 40px;
  flex: 0 0 auto;
  padding-inline: 18px;
  border: 1px solid transparent;
  font-size: var(--ds-text-ui);
  white-space: nowrap;
}
#page-settings .set-tab:hover { color: var(--ds-ink); background: rgba(255,255,255,.48); }
#page-settings .set-tab.on {
  color: var(--ds-accent-strong);
  border-color: rgba(var(--ds-accent-rgb),.12);
  background: rgba(255,255,255,.94);
  box-shadow: 0 5px 18px rgba(44,31,69,.08), inset 0 -2px 0 rgba(var(--ds-accent-rgb),.58);
}
#page-settings .set-section-h {
  align-items: baseline;
  gap: var(--ds-space-3);
  margin-bottom: var(--ds-space-2);
  color: var(--ds-ink);
  font: 720 26px/1.2 var(--ds-font);
  letter-spacing: -.035em;
}
#page-settings .set-section-sub {
  max-width: 72ch;
  margin-bottom: var(--ds-space-8);
  color: var(--ds-ink-secondary);
  font: 450 var(--ds-text-ui)/1.55 var(--ds-font);
}
#page-settings .set-section-h2 {
  margin-bottom: var(--ds-space-3);
  color: var(--ds-ink);
  font: 680 var(--ds-text-body)/1.35 var(--ds-font);
  letter-spacing: -.018em;
}
#page-settings .h-pill { color: var(--ds-ink-secondary); font-size: var(--ds-text-caption); letter-spacing: .065em; }

/* Rules: conditions are a readable definition list, not four mini-cards. */
#page-settings .rules-list { gap: var(--ds-space-4); }
#page-settings .rule-card {
  gap: var(--ds-space-5);
  padding: var(--ds-space-6);
  border: 0;
  border-radius: var(--ds-radius-feature);
  background: var(--ds-surface);
  box-shadow: var(--ds-shadow-card);
}
#page-settings .rule-card:hover:not(.open) { border-color: transparent; box-shadow: 0 24px 54px rgba(35,25,54,.095); }
#page-settings .rule-card.open { border-color: transparent; border-radius: var(--ds-radius-feature) var(--ds-radius-feature) 0 0; box-shadow: var(--ds-shadow-card); }
#page-settings .rule-card-title-row { gap: var(--ds-space-4); }
#page-settings .rule-card-folder { width: 40px; height: 40px; border-radius: var(--ds-radius-control); }
#page-settings .rule-card-title { font: 720 22px/1.2 var(--ds-font); letter-spacing: -.03em; }
#page-settings .rule-card-pill { height: 26px; border-radius: var(--ds-radius-sm); font-size: 10px; letter-spacing: .08em; }
#page-settings .rule-card-conds { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: var(--ds-space-6); }
#page-settings .rcc,
#page-settings .rcc:first-child {
  min-width: 0;
  min-height: 0;
  gap: var(--ds-space-1);
  padding: 0;
  border: 0;
}
#page-settings .rcc-lbl { color: var(--ds-ink-tertiary); font: 650 10px/1.2 var(--ds-font); letter-spacing: .075em; }
#page-settings .rcc-val { color: var(--ds-ink); font: 650 var(--ds-text-ui)/1.35 var(--ds-font); }
#page-settings .rule-card-foot { padding-top: 0; }
#page-settings .rule-card-status { color: var(--ds-ink-secondary); font-size: var(--ds-text-caption); }
#page-settings .rule-card-cta { min-height: 36px; border-radius: var(--ds-radius-control); color: var(--ds-accent-strong); background: var(--ds-accent-soft); }

/* AI behaviour cards: one strong name, one concise explanation, quiet traits. */
#page-settings .ai-list { gap: var(--ds-space-4); }
#page-settings .ai-card {
  min-height: 0;
  padding: var(--ds-space-6);
  border: 0;
  border-radius: var(--ds-radius-feature);
  background: var(--ds-surface);
  box-shadow: var(--ds-shadow-card);
}
#page-settings .ai-card:hover { border-color: transparent; box-shadow: 0 24px 54px rgba(35,25,54,.095); transform: translateY(-2px); }
#page-settings .ai-card-name { margin-top: var(--ds-space-5); color: var(--ds-ink); font: 720 22px/1.2 var(--ds-font); letter-spacing: -.03em; }
#page-settings .ai-card-desc { max-width: 60ch; margin-top: var(--ds-space-2); color: var(--ds-ink-secondary); font: 450 var(--ds-text-ui)/1.5 var(--ds-font); }
#page-settings .ai-card-traits { gap: var(--ds-space-2); margin-top: var(--ds-space-4); }
#page-settings .ai-card-trait {
  min-height: 28px;
  padding: 5px 10px;
  border: 1px solid var(--ds-line);
  border-radius: var(--ds-radius-sm);
  color: var(--ds-ink-secondary);
  background: var(--ds-surface-subtle);
  font: 600 var(--ds-text-caption)/1.2 var(--ds-font);
}
#page-settings .ai-card-foot { margin-top: var(--ds-space-5); padding-top: var(--ds-space-4); border-color: var(--ds-line); }
#page-settings .ai-card-cta { min-height: var(--ds-control-lg); color: var(--ds-accent-strong); font-size: var(--ds-text-caption); }
#page-settings .ai-card-rm { width: var(--ds-control-lg); min-width: var(--ds-control-lg); min-height: var(--ds-control-lg); }
#page-settings .bp-card {
  border: 0;
  border-radius: var(--ds-radius-feature);
  background: var(--ds-surface);
  box-shadow: var(--ds-shadow-card);
}
#page-settings .bp-toggle-head { padding: var(--ds-space-6); }
#page-settings .bp-head-title,
#page-settings .bp-card-row-h { color: var(--ds-ink); font: 700 var(--ds-text-body)/1.35 var(--ds-font); letter-spacing: -.02em; }
#page-settings .bp-head-sub,
#page-settings .bp-card-row-sub { max-width: 76ch; color: var(--ds-ink-secondary); font: 450 var(--ds-text-ui)/1.55 var(--ds-font); }
#page-settings .bp-section { border-color: var(--ds-line); }

/* Templates: preview text reads as a compact hierarchy instead of a pile of pills. */
#page-settings .rt-cardgrid { gap: var(--ds-space-4); }
#page-settings .rt-gcard {
  border: 0;
  border-radius: var(--ds-radius-feature);
  background: var(--ds-surface);
  box-shadow: var(--ds-shadow-card);
}
#page-settings .rt-gcard:hover { border-color: transparent; box-shadow: 0 24px 54px rgba(35,25,54,.095); }
#page-settings .rt-gcard-head { padding: var(--ds-space-5) var(--ds-space-5) var(--ds-space-3); }
#page-settings .rt-gcard-name { font: 700 var(--ds-text-body)/1.3 var(--ds-font); letter-spacing: -.02em; }
#page-settings .rt-gcard-cnt { height: 24px; border-radius: var(--ds-radius-sm); font-size: var(--ds-text-caption); }
#page-settings .rt-gcard-sum { gap: var(--ds-space-2); padding: 0 var(--ds-space-5) var(--ds-space-5); }
#page-settings .rt-gcard-chip {
  display: block;
  width: 100%;
  padding: 0;
  border: 0;
  border-radius: 0;
  color: var(--ds-ink-secondary) !important;
  background: transparent !important;
  font: 500 var(--ds-text-caption)/1.45 var(--ds-font);
  text-overflow: ellipsis;
}
#page-settings .rt-gcard-chip::before { display: none; }
#page-settings .rt-gcard-foot { padding: var(--ds-space-3) var(--ds-space-5) var(--ds-space-4); border-color: var(--ds-line); }
#page-settings .rt-gcard-cta { color: var(--ds-accent-strong); font-size: var(--ds-text-caption); }

/* Sources: KPI, platform identity and sync status use one metric language. */
#page-settings .src-hero { gap: var(--ds-space-4); }
#page-settings .src-stat {
  min-height: 142px;
  padding: var(--ds-space-5);
  border: 0;
  border-radius: var(--ds-radius-feature);
  background: var(--ds-surface);
  box-shadow: var(--ds-shadow-card);
}
#page-settings .src-stat-label { margin-bottom: var(--ds-space-4); color: var(--ds-ink-secondary); font: 650 var(--ds-text-caption)/1.2 var(--ds-font); letter-spacing: .065em; }
#page-settings .src-stat-label .ic { width: 28px; height: 28px; border-radius: var(--ds-radius-sm); }
#page-settings .src-stat-val { color: var(--ds-ink); font: 720 34px/1 var(--ds-font); letter-spacing: -.035em; }
#page-settings .src-stat-sub { margin-top: var(--ds-space-2); color: var(--ds-ink-secondary); font-size: var(--ds-text-caption); }
#page-settings .src-list { gap: var(--ds-space-4); }
#page-settings .src-source {
  border: 0;
  border-radius: var(--ds-radius-feature);
  background: var(--ds-surface);
  box-shadow: var(--ds-shadow-card);
}
#page-settings .src-source:hover { border-color: transparent; box-shadow: 0 24px 54px rgba(35,25,54,.095); transform: translateY(-2px); }
#page-settings .src-source-head { padding: var(--ds-space-5); }
#page-settings .src-source-name { color: var(--ds-ink); font: 720 20px/1.25 var(--ds-font); letter-spacing: -.025em; }
#page-settings .src-source-meta { color: var(--ds-ink-secondary); font-size: var(--ds-text-caption); }
#page-settings .src-source-status { padding: 6px 10px; border-radius: var(--ds-radius-sm); font-size: var(--ds-text-caption); letter-spacing: 0; }
#page-settings .src-source-status .dot { box-shadow: none; }
#page-settings .src-source-body { border-color: var(--ds-line); }
#page-settings .src-cab { padding-block: var(--ds-space-4); border-color: var(--ds-line); }
#page-settings .src-cab-name { font-size: var(--ds-text-ui); }
#page-settings .src-sync-strip { gap: var(--ds-space-2); padding: var(--ds-space-4) var(--ds-space-5); border-color: var(--ds-line); background: var(--ds-surface-subtle); }
#page-settings .src-sync-title { font-size: var(--ds-text-caption); }
#page-settings .src-sync-cnt { color: var(--ds-ink); font-size: var(--ds-text-caption); }

/* Team and API: people, credentials and endpoints become list content. */
#page-settings .team-grid { gap: var(--ds-space-4); }
#page-settings .team-card {
  min-height: 190px;
  gap: var(--ds-space-2);
  padding: var(--ds-space-5);
  border: 0;
  border-radius: var(--ds-radius-feature);
  background: var(--ds-surface);
  box-shadow: var(--ds-shadow-card);
}
#page-settings .team-card:hover { border-color: transparent; box-shadow: 0 24px 54px rgba(35,25,54,.095); transform: translateY(-2px); }
#page-settings .team-card-head { margin-bottom: var(--ds-space-2); }
#page-settings .team-card-pill { height: 24px; border-radius: var(--ds-radius-sm); font-size: 10px; letter-spacing: .07em; }
#page-settings .team-card-ava { width: 44px; height: 44px; border-radius: var(--ds-radius-control); margin-top: var(--ds-space-1); }
#page-settings .team-card-name { margin-top: var(--ds-space-3); color: var(--ds-ink); font: 700 var(--ds-text-ui)/1.35 var(--ds-font); }
#page-settings .team-card-email,
#page-settings .team-card-me { color: var(--ds-ink-secondary); font-size: var(--ds-text-caption); }
#page-settings .api-upgrade,
#page-settings .api-docs-block,
#page-settings .api-key-row {
  border: 0;
  border-radius: var(--ds-radius-feature);
  background: var(--ds-surface);
  box-shadow: var(--ds-shadow-card);
}
#page-settings .api-upgrade { padding: var(--ds-space-5); }
#page-settings .api-upgrade-h { color: var(--ds-ink); font-size: var(--ds-text-ui); }
#page-settings .api-upgrade-sub { color: var(--ds-ink-secondary); }
#page-settings .api-key-row { padding: var(--ds-space-4) var(--ds-space-5); }
#page-settings .api-key-label { color: var(--ds-ink); font-size: var(--ds-text-ui); }
#page-settings .api-key-meta { color: var(--ds-ink-secondary); font-size: var(--ds-text-caption); }
#page-settings .api-docs-block { padding: var(--ds-space-5); color: var(--ds-ink-secondary); font: 450 var(--ds-text-ui)/1.65 var(--ds-font); }
#page-settings .api-docs-block code,
#page-settings .api-key-prefix,
#page-settings .api-modal-key { border-radius: var(--ds-radius-sm); background: var(--ds-surface-subtle); }
#page-settings .api-endpoints { gap: var(--ds-space-3); }

/* Billing: same settings canvas, surfaces and metric language as Sources. */
#page-settings #set-billing { width: 100%; max-width: 1280px; margin-inline: 0; }
#page-settings .billing-content { width: 100%; max-width: none; }
#page-settings .billing-plan-card {
  display: grid;
  grid-template-columns: minmax(260px, .78fr) minmax(390px, 1.22fr);
  gap: 0 var(--ds-space-8);
  padding: var(--ds-space-8);
  border: 0;
  border-radius: var(--ds-radius-feature);
  background: var(--ds-surface);
  box-shadow: var(--ds-shadow-card);
}
#page-settings .billing-plan-card.is-trial { background: var(--ds-surface); }
#page-settings .billing-plan-main { display: flex; min-width: 0; flex-direction: column; align-items: flex-start; justify-content: center; padding-right: var(--ds-space-6); }
#page-settings .billing-plan-badge {
  display: inline-flex;
  min-height: 32px;
  align-items: center;
  gap: 8px;
  padding: 6px 12px;
  border: 1px solid transparent;
  border-radius: 999px;
  color: #35313b;
  background: #f1eff3;
  font: 720 12px/1 var(--ds-font);
  letter-spacing: .055em;
  text-transform: uppercase;
  white-space: nowrap;
}
#page-settings .billing-plan-badge > span { width: 8px; height: 8px; border-radius: 50%; background: currentColor; }
#page-settings .tier-free .billing-plan-badge { color: #5f6672; background: #eef0f3; }
#page-settings .tier-trial .billing-plan-badge { color: #9a5b08; background: #fff5df; border-color: #f3dfb8; }
#page-settings .tier-start .billing-plan-badge { color: #1769aa; background: #eaf5ff; border-color: #cfe8fb; }
#page-settings .tier-team .billing-plan-badge { color: #3153a4; background: #eef2ff; border-color: #dce4ff; }
#page-settings .tier-pro .billing-plan-badge { color: #6d36b5; background: #f4edff; border-color: #e5d7fb; }
#page-settings .tier-business .billing-plan-badge { color: #34313a; background: #eeecef; border-color: #ddd9e0; }
#page-settings .tier-ultra .billing-plan-badge {
  color: #f5d88a;
  background: #1d1a20;
  border-color: #36313b;
  box-shadow: 0 8px 20px rgba(29,26,32,.18);
}
#page-settings .tier-ultra .billing-plan-badge > span { background: linear-gradient(135deg, #fff2b5, #d7a83f); box-shadow: 0 0 0 3px rgba(245,216,138,.13); }
#page-settings .billing-kicker {
  margin: var(--ds-space-5) 0 0;
  color: var(--ds-ink-tertiary);
  font: 600 var(--ds-text-caption)/1.2 var(--ds-font);
  letter-spacing: 0;
}
#page-settings .billing-plan-card.is-trial .billing-kicker { color: var(--ds-ink-tertiary); }
#page-settings .billing-plan-title-row { display: flex; align-items: center; gap: var(--ds-space-3); flex-wrap: wrap; }
#page-settings .billing-plan-title-row h3 { color: var(--ds-ink); font: 740 34px/1.05 var(--ds-font); letter-spacing: -.045em; }
#page-settings .billing-plan-status,
#page-settings .billing-tag,
#page-settings .billing-limit-state {
  display: inline-flex;
  min-height: 26px;
  align-items: center;
  padding: 4px 9px;
  border-radius: var(--ds-radius-sm);
  color: var(--ds-ink-secondary);
  background: var(--ds-surface-subtle);
  font: 650 var(--ds-text-caption)/1.2 var(--ds-font);
}
#page-settings .billing-plan-value { margin-top: var(--ds-space-2); color: var(--ds-ink); font: 740 30px/1.1 var(--ds-font); letter-spacing: -.035em; font-variant-numeric: tabular-nums; white-space: nowrap; }
#page-settings .billing-plan-main > p { margin-top: var(--ds-space-2); color: var(--ds-ink-secondary); font: 450 var(--ds-text-ui)/1.5 var(--ds-font); }
#page-settings .billing-plan-link { margin-top: var(--ds-space-4); padding: 0; border: 0; color: var(--ds-accent-strong); background: transparent; font: 650 var(--ds-text-caption)/1.3 var(--ds-font); cursor: pointer; }
#page-settings .billing-answer-balance { min-width: 0; padding-left: var(--ds-space-8); border-left: 1px solid var(--ds-line); }
#page-settings .billing-answer-label { display: flex; min-height: 32px; align-items: center; justify-content: space-between; gap: var(--ds-space-3); color: var(--ds-ink-secondary); font: 650 var(--ds-text-ui)/1.3 var(--ds-font); }
#page-settings .billing-answer-label > span { padding: 5px 9px; border-radius: 999px; color: var(--ds-ink-secondary); background: var(--ds-surface-subtle); font-size: 11px; white-space: nowrap; }
#page-settings .billing-answer-value { display: flex; min-width: 0; align-items: baseline; gap: var(--ds-space-3); margin-top: var(--ds-space-3); }
#page-settings .billing-answer-value strong { color: var(--ds-ink); font: 760 clamp(42px, 5vw, 64px)/.96 var(--ds-font); letter-spacing: -.055em; font-variant-numeric: tabular-nums; white-space: nowrap; }
#page-settings .billing-answer-value span { max-width: 160px; color: var(--ds-ink-secondary); font: 580 var(--ds-text-ui)/1.35 var(--ds-font); }
#page-settings .billing-answer-balance.healthy .billing-answer-value strong { color: #16805a; }
#page-settings .billing-answer-balance.warning .billing-answer-value strong { color: #b06a08; }
#page-settings .billing-answer-balance.danger .billing-answer-value strong { color: #c33a3a; }
#page-settings .billing-answer-copy { display: flex; justify-content: space-between; gap: var(--ds-space-4); margin-top: var(--ds-space-4); color: var(--ds-ink-secondary); font: 500 var(--ds-text-caption)/1.4 var(--ds-font); }
#page-settings .billing-period-row { display: grid; grid-template-columns: minmax(0, 1.35fr) minmax(0, 1fr); gap: var(--ds-space-5); margin-top: var(--ds-space-5); padding-top: var(--ds-space-4); border-top: 1px solid var(--ds-line); }
#page-settings .billing-period-row > div { min-width: 0; }
#page-settings .billing-period-row span { display: block; color: var(--ds-ink-tertiary); font: 560 11px/1.3 var(--ds-font); }
#page-settings .billing-period-row strong { display: block; margin-top: 4px; color: var(--ds-ink); font: 640 var(--ds-text-caption)/1.4 var(--ds-font); font-variant-numeric: tabular-nums; white-space: nowrap; }
#page-settings .billing-plan-included { grid-column: 1 / -1; margin-top: var(--ds-space-8); padding-top: var(--ds-space-6); border-top: 1px solid var(--ds-line); }
#page-settings .billing-plan-included h3 { color: var(--ds-ink); font: 690 var(--ds-text-ui)/1.3 var(--ds-font); }
#page-settings .billing-plan-included ul { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--ds-space-3) var(--ds-space-6); margin: var(--ds-space-4) 0 0; padding: 0; list-style: none; }
#page-settings .billing-plan-included li { display: flex; min-width: 0; align-items: flex-start; gap: 9px; color: var(--ds-ink-secondary); font: 520 var(--ds-text-ui)/1.4 var(--ds-font); }
#page-settings .billing-plan-included li > span { display: grid; width: 18px; height: 18px; flex: 0 0 18px; place-items: center; border-radius: 50%; color: #16805a; background: rgba(22,128,90,.09); font-size: 11px; font-weight: 800; }
#page-settings .billing-plan-facts { display: grid; grid-template-columns: .8fr .8fr 1.4fr; gap: var(--ds-space-5); margin-top: var(--ds-space-6); padding: var(--ds-space-4) var(--ds-space-5); border-radius: var(--ds-radius-control); background: var(--ds-surface-subtle); }
#page-settings .billing-plan-facts > div { min-width: 0; }
#page-settings .billing-plan-facts span { display: block; color: var(--ds-ink-tertiary); font: 560 11px/1.3 var(--ds-font); }
#page-settings .billing-plan-facts strong { display: block; margin-top: 4px; overflow: hidden; color: var(--ds-ink); font: 630 var(--ds-text-caption)/1.35 var(--ds-font); text-overflow: ellipsis; white-space: nowrap; }
#page-settings .billing-plan-side { display: flex; flex-direction: column; justify-content: center; gap: var(--ds-space-4); padding-left: var(--ds-space-6); border-left: 1px solid var(--ds-line); }
#page-settings .billing-plan-side > div { display: grid; grid-template-columns: 100px minmax(0, 1fr); gap: var(--ds-space-3); }
#page-settings .billing-plan-side span { color: var(--ds-ink-tertiary); font: 550 var(--ds-text-caption)/1.4 var(--ds-font); }
#page-settings .billing-plan-side strong { color: var(--ds-ink); font: 600 var(--ds-text-caption)/1.45 var(--ds-font); }
#page-settings .billing-primary-action,
#page-settings .billing-error button {
  min-height: var(--ds-control-lg);
  margin-top: var(--ds-space-2);
  padding: 0 var(--ds-space-5);
  border: 0;
  border-radius: var(--ds-radius-control);
  color: #fff;
  background: var(--ds-accent);
  font: 650 var(--ds-text-ui)/1 var(--ds-font);
  cursor: pointer;
}
#page-settings .billing-primary-action:hover,
#page-settings .billing-error button:hover { background: var(--ds-accent-strong); }
#page-settings .billing-alert { margin-bottom: var(--ds-space-4); }
#page-settings .billing-alert .ds-callout__icon { color: var(--ds-warning, #a16207); font-weight: 750; }
#page-settings .billing-section { margin-top: var(--ds-space-8); }
#page-settings .billing-section-head { display: flex; align-items: flex-end; justify-content: space-between; gap: var(--ds-space-4); margin-bottom: var(--ds-space-4); }
#page-settings .billing-section-head h3 { color: var(--ds-ink); font: 710 20px/1.25 var(--ds-font); letter-spacing: -.025em; }
#page-settings .billing-section-head p { max-width: 72ch; margin-top: var(--ds-space-1); color: var(--ds-ink-secondary); font: 450 var(--ds-text-caption)/1.5 var(--ds-font); }
#page-settings .billing-limit-state.warning { color: #92400e; background: rgba(245,158,11,.11); }
#page-settings .billing-limit-state.danger { color: #b91c1c; background: rgba(220,38,38,.09); }
#page-settings .billing-usage-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--ds-space-4); }
#page-settings .billing-usage-card {
  min-height: 190px;
  padding: var(--ds-space-5);
  border: 0;
  border-radius: var(--ds-radius-feature);
  background: var(--ds-surface);
  box-shadow: var(--ds-shadow-card);
}
#page-settings .billing-usage-card.primary { background: var(--ds-surface); }
#page-settings .billing-usage-label { display: flex; min-height: 26px; align-items: center; justify-content: space-between; gap: var(--ds-space-2); color: var(--ds-ink-secondary); font: 650 var(--ds-text-caption)/1.3 var(--ds-font); }
#page-settings .billing-tag { color: var(--ds-ink-secondary); background: var(--ds-surface-subtle); white-space: nowrap; }
#page-settings .billing-usage-value { margin-top: var(--ds-space-5); color: var(--ds-ink); font: 730 30px/1 var(--ds-font); letter-spacing: -.04em; font-variant-numeric: tabular-nums; }
#page-settings .billing-usage-copy { margin-top: var(--ds-space-2); color: var(--ds-ink-secondary); font: 450 var(--ds-text-caption)/1.45 var(--ds-font); }
#page-settings .billing-progress { height: 7px; margin-top: var(--ds-space-5); overflow: hidden; border-radius: 999px; background: var(--ds-surface-subtle); }
#page-settings .billing-progress > span { display: block; height: 100%; border-radius: inherit; background: var(--ds-accent); transition: width 220ms ease; }
#page-settings .billing-progress.healthy > span { background: #1f9a6a; }
#page-settings .billing-progress.warning > span { background: #d97706; }
#page-settings .billing-progress.danger > span { background: #dc2626; }
#page-settings .billing-progress.neutral > span { background: var(--ds-ink-tertiary); }
#page-settings .billing-usage-foot { margin-top: var(--ds-space-4); color: var(--ds-ink-tertiary); font: 500 var(--ds-text-caption)/1.4 var(--ds-font); }
#page-settings .billing-secondary-usage { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); overflow: hidden; border-radius: var(--ds-radius-feature); background: var(--ds-surface); box-shadow: var(--ds-shadow-card); }
#page-settings .billing-secondary-metric { min-width: 0; padding: var(--ds-space-6); }
#page-settings .billing-secondary-metric + .billing-secondary-metric { border-left: 1px solid var(--ds-line); }
#page-settings .billing-secondary-head { display: flex; align-items: center; justify-content: space-between; gap: var(--ds-space-3); color: var(--ds-ink-secondary); font: 650 var(--ds-text-ui)/1.3 var(--ds-font); }
#page-settings .billing-secondary-head em { flex: 0 0 auto; color: var(--ds-ink-tertiary); font: 560 11px/1.2 var(--ds-font); font-style: normal; }
#page-settings .billing-secondary-value { display: flex; min-width: 0; align-items: baseline; gap: var(--ds-space-3); margin-top: var(--ds-space-5); }
#page-settings .billing-secondary-value strong { color: var(--ds-ink); font: 740 34px/1 var(--ds-font); letter-spacing: -.04em; font-variant-numeric: tabular-nums; }
#page-settings .billing-secondary-value span { color: var(--ds-ink-secondary); font: 520 var(--ds-text-caption)/1.35 var(--ds-font); }
#page-settings .billing-secondary-metric.healthy .billing-secondary-value strong { color: #16805a; }
#page-settings .billing-secondary-metric.warning .billing-secondary-value strong { color: #b06a08; }
#page-settings .billing-secondary-metric.danger .billing-secondary-value strong { color: #c33a3a; }
#page-settings .billing-technical,
#page-settings .billing-history {
  overflow: hidden;
  padding: var(--ds-space-6);
  border-radius: var(--ds-radius-feature);
  background: var(--ds-surface);
  box-shadow: var(--ds-shadow-card);
}
#page-settings details.billing-technical { padding: 0; }
#page-settings details.billing-technical > summary { display: flex; min-height: 74px; align-items: center; justify-content: space-between; gap: var(--ds-space-4); padding: var(--ds-space-5) var(--ds-space-6); color: var(--ds-ink); cursor: pointer; list-style: none; }
#page-settings details.billing-technical > summary::-webkit-details-marker { display: none; }
#page-settings details.billing-technical > summary::after { content: '+'; display: grid; width: 32px; height: 32px; flex: 0 0 32px; place-items: center; border-radius: 50%; color: var(--ds-ink-secondary); background: var(--ds-surface-subtle); font-size: 20px; font-weight: 500; }
#page-settings details.billing-technical[open] > summary::after { content: '−'; }
#page-settings details.billing-technical > summary span { font: 690 var(--ds-text-ui)/1.3 var(--ds-font); }
#page-settings details.billing-technical > summary small { margin-left: auto; color: var(--ds-ink-tertiary); font: 500 var(--ds-text-caption)/1.4 var(--ds-font); }
#page-settings .billing-technical-body { padding: 0 var(--ds-space-6) var(--ds-space-6); border-top: 1px solid var(--ds-line); }
#page-settings .billing-technical-body > p { margin-top: var(--ds-space-5); color: var(--ds-ink-secondary); font: 450 var(--ds-text-caption)/1.5 var(--ds-font); }
#page-settings .billing-token-summary { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); margin-top: var(--ds-space-5); padding-block: var(--ds-space-2) var(--ds-space-5); }
#page-settings .billing-token-summary > div { min-width: 0; padding-inline: var(--ds-space-5); }
#page-settings .billing-token-summary > div:first-child { padding-left: 0; }
#page-settings .billing-token-summary > div + div { border-left: 1px solid var(--ds-line); }
#page-settings .billing-token-summary span { display: block; color: var(--ds-ink-secondary); font: 550 var(--ds-text-caption)/1.4 var(--ds-font); }
#page-settings .billing-token-summary strong { display: inline-block; margin-top: var(--ds-space-2); color: var(--ds-ink); font: 720 28px/1 var(--ds-font); letter-spacing: -.035em; font-variant-numeric: tabular-nums; }
#page-settings .billing-token-summary small { margin-left: var(--ds-space-1); color: var(--ds-ink-tertiary); font-size: var(--ds-text-caption); }
#page-settings .billing-details { border-top: 1px solid var(--ds-line); }
#page-settings .billing-details summary { min-height: var(--ds-control-lg); padding-block: var(--ds-space-4); color: var(--ds-accent-strong); font: 650 var(--ds-text-ui)/1.3 var(--ds-font); cursor: pointer; }
#page-settings .billing-table-wrap { overflow-x: auto; }
#page-settings .billing-table-wrap table { width: 100%; border-collapse: collapse; font-variant-numeric: tabular-nums; }
#page-settings .billing-table-wrap th,
#page-settings .billing-table-wrap td { padding: var(--ds-space-3) var(--ds-space-4); border-top: 1px solid var(--ds-line); color: var(--ds-ink-secondary); font: 500 var(--ds-text-caption)/1.4 var(--ds-font); text-align: right; white-space: nowrap; }
#page-settings .billing-table-wrap th { color: var(--ds-ink-tertiary); font-weight: 650; }
#page-settings .billing-table-wrap :is(th, td):first-child { padding-left: 0; color: var(--ds-ink); text-align: left; }
#page-settings .billing-operations { margin-inline: calc(var(--ds-space-6) * -1); }
#page-settings .billing-operation { display: grid; grid-template-columns: minmax(0, 1fr) 180px; align-items: center; gap: var(--ds-space-4); padding: var(--ds-space-4) var(--ds-space-6); border-top: 1px solid var(--ds-line); }
#page-settings .billing-operation-main { min-width: 0; }
#page-settings .billing-operation-main strong { display: block; overflow: hidden; color: var(--ds-ink); font: 620 var(--ds-text-ui)/1.4 var(--ds-font); text-overflow: ellipsis; white-space: nowrap; }
#page-settings .billing-operation-main span { color: var(--ds-ink-secondary); font: 500 var(--ds-text-caption)/1.4 var(--ds-font); }
#page-settings .billing-operation-tokens { display: none; }
#page-settings .billing-operation-delta { justify-self: end; color: var(--ds-ink); font: 650 var(--ds-text-caption)/1.4 var(--ds-font); }
#page-settings .billing-operation-delta.reserved { color: #92400e; }
#page-settings .billing-operation-delta.ambiguous { color: #b91c1c; }
#page-settings .billing-empty { padding: var(--ds-space-8) 0; color: var(--ds-ink-secondary); font: 450 var(--ds-text-ui)/1.5 var(--ds-font); text-align: center; }
#page-settings .billing-updated { display: flex; justify-content: flex-end; gap: var(--ds-space-1); margin-top: var(--ds-space-4); color: var(--ds-ink-tertiary); font: 500 var(--ds-text-caption)/1.4 var(--ds-font); }
#page-settings .billing-updated button { border: 0; color: var(--ds-accent-strong); background: transparent; font: inherit; cursor: pointer; }
#page-settings .billing-stale { color: #b91c1c; }
#page-settings .billing-loading { display: grid; gap: var(--ds-space-4); }
#page-settings .billing-skeleton { border-radius: var(--ds-radius-feature); background: linear-gradient(100deg, var(--ds-surface-subtle) 20%, var(--ds-surface) 42%, var(--ds-surface-subtle) 64%); background-size: 220% 100%; animation: billing-shimmer 1.25s linear infinite; }
#page-settings .billing-skeleton-hero { height: 260px; }
#page-settings .billing-skeleton-row { height: 190px; }
#page-settings .billing-skeleton-table { height: 280px; }
#page-settings .billing-error { display: flex; min-height: 280px; flex-direction: column; align-items: flex-start; justify-content: center; gap: var(--ds-space-2); padding: var(--ds-space-8); border-radius: var(--ds-radius-feature); background: var(--ds-surface); box-shadow: var(--ds-shadow-card); }
#page-settings .billing-error strong { color: var(--ds-ink); font: 700 var(--ds-text-card)/1.3 var(--ds-font); }
#page-settings .billing-error span { color: var(--ds-ink-secondary); font: 450 var(--ds-text-ui)/1.5 var(--ds-font); }
@keyframes billing-shimmer { to { background-position: -220% 0; } }

@media (max-width: 1100px) {
  #page-settings .set-tabs { width: max-content; min-width: max-content; }
  #page-settings .set-tab { flex: 0 0 auto; }
  #page-settings .billing-plan-card { grid-template-columns: minmax(0, 1fr); gap: var(--ds-space-6); padding: var(--ds-space-6); }
  #page-settings .billing-plan-main { padding-right: 0; }
  #page-settings .billing-answer-balance { padding: var(--ds-space-6) 0 0; border-top: 1px solid var(--ds-line); border-left: 0; }
  #page-settings .billing-plan-included { margin-top: 0; }
  #page-settings .billing-plan-facts { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  #page-settings .billing-plan-facts > div:last-child { grid-column: 1 / -1; }
  #page-settings .billing-usage-grid { grid-template-columns: minmax(0, 1fr); }
}
@media (max-width: 600px) {
  #page-settings .set-tab { min-height: 44px; }
  .app:has(#page-settings.on) .main-head { width: 100%; padding-inline: 16px; }
  #page-settings .billing-plan-card,
  #page-settings .billing-technical,
  #page-settings .billing-history { padding: var(--ds-space-5); }
  #page-settings .billing-plan-title-row h3 { font-size: 30px; }
  #page-settings .billing-plan-value { font-size: 26px; white-space: normal; }
  #page-settings .billing-answer-value { align-items: flex-start; flex-direction: column; gap: var(--ds-space-2); }
  #page-settings .billing-answer-value strong { font-size: 48px; }
  #page-settings .billing-answer-value span { max-width: none; }
  #page-settings .billing-answer-copy { align-items: flex-start; flex-direction: column; gap: var(--ds-space-1); }
  #page-settings .billing-period-row { grid-template-columns: minmax(0, 1fr); gap: var(--ds-space-3); }
  #page-settings .billing-period-row strong { white-space: normal; }
  #page-settings .billing-plan-included ul,
  #page-settings .billing-plan-facts,
  #page-settings .billing-secondary-usage { grid-template-columns: minmax(0, 1fr); }
  #page-settings .billing-plan-facts > div:last-child { grid-column: auto; }
  #page-settings .billing-plan-facts strong { white-space: normal; }
  #page-settings .billing-secondary-metric + .billing-secondary-metric { border-top: 1px solid var(--ds-line); border-left: 0; }
  #page-settings details.billing-technical > summary { align-items: flex-start; }
  #page-settings details.billing-technical > summary small { display: none; }
  #page-settings .billing-token-summary { grid-template-columns: minmax(0, 1fr); gap: var(--ds-space-4); }
  #page-settings .billing-token-summary > div { padding: 0; }
  #page-settings .billing-token-summary > div + div { padding-top: var(--ds-space-4); border-top: 1px solid var(--ds-line); border-left: 0; }
  #page-settings .billing-operation { grid-template-columns: minmax(0, 1fr); gap: var(--ds-space-1); padding-inline: var(--ds-space-5); }
  #page-settings .billing-operation-delta { justify-self: start; }
  #page-settings .billing-operation-tokens { order: 3; }
  #page-settings .billing-section-head { align-items: flex-start; flex-direction: column; }
}

/* Свёрнутый сайдбар освобождает рабочую область: настройки должны занимать её
   сразу, без старого десктопного потолка и визуального «обрезания» посередине. */
.app.collapsed #page-settings,
.app.collapsed #page-settings .set-head,
.app.collapsed #page-settings .set-sub { width: 100%; max-width: none; }

@media (prefers-reduced-motion: reduce) {
  #page-settings .billing-progress > span { transition: none; }
  #page-settings .billing-skeleton { animation: none; }
}

/* Analytics internals: the primary number owns the card; units and legends
   remain supporting information. */
.page[id^="page-an-"] :is(.card-title, .dg-panel-h, .an-heatmap-side-title) {
  color: var(--ds-ink);
  font-family: var(--ds-font);
  font-size: var(--ds-text-body);
  font-weight: 700;
  letter-spacing: -.02em;
}
.page[id^="page-an-"] :is(.card-sub, .stat-lbl, .chart-legend, .donut-legend, .an-heatmap-side-sub) {
  color: var(--ds-ink-secondary);
  font-family: var(--ds-font);
  font-size: var(--ds-text-caption);
  line-height: 1.45;
}
.page[id^="page-an-"] :is(.stat-val, .dg-row-val, .an-heatmap-finding b) {
  color: var(--ds-ink);
  font-family: var(--ds-font);
  font-variant-numeric: tabular-nums;
  letter-spacing: -.025em;
}
.page[id^="page-an-"] .an-pro-strip { overflow: visible; font-family: var(--ds-font); }
.page[id^="page-an-"] .an-pro-strip::before { display: none; }
.page[id^="page-an-"] .an-pro-intro { padding: var(--ds-space-5) var(--ds-space-6); border-color: var(--ds-line); border-radius: var(--ds-radius-feature) var(--ds-radius-feature) 0 0; }
.page[id^="page-an-"] .an-pro-heading { color: var(--ds-ink); font: 700 var(--ds-text-body)/1.3 var(--ds-font); letter-spacing: -.02em; }
.page[id^="page-an-"] .an-pro-title { margin-top: var(--ds-space-1); color: var(--ds-ink-secondary); font: 450 var(--ds-text-caption)/1.45 var(--ds-font); }
.page[id^="page-an-"] .an-pro-method summary { border-color: var(--ds-line); border-radius: var(--ds-radius-control); color: var(--ds-accent-strong); background: var(--ds-surface); font-family: var(--ds-font); }
.page[id^="page-an-"] .an-pro-metrics { gap: var(--ds-space-6); padding: var(--ds-space-5) var(--ds-space-6) var(--ds-space-6); }
.page[id^="page-an-"] .an-pro-metric,
.page[id^="page-an-"] .an-pro-metric + .an-pro-metric { padding: 0; border: 0; }
.page[id^="page-an-"] .an-pro-kicker { color: var(--ds-ink-secondary); font: 650 var(--ds-text-caption)/1.3 var(--ds-font); }
.page[id^="page-an-"] .an-pro-value { margin-top: var(--ds-space-2); color: var(--ds-ink); font: 740 32px/1 var(--ds-font); letter-spacing: -.035em; }
.page[id^="page-an-"] .an-pro-label {
  margin-top: var(--ds-space-1);
  color: var(--ds-ink-secondary);
  font: 450 var(--ds-text-caption)/1.4 var(--ds-font);
  white-space: normal;
  overflow: visible;
  overflow-wrap: anywhere;
  text-overflow: clip;
}
.page[id^="page-an-"] .an-pro-track { height: 4px; margin-top: var(--ds-space-3); background: var(--ds-surface-subtle); }
#page-an-signals .sig-card2 { display: flex; flex-direction: column; min-height: 250px; }
#page-an-signals .sig-card2-kw { color: var(--ds-ink); font: 720 20px/1.25 var(--ds-font); letter-spacing: -.025em; }
#page-an-signals .sig-card2-metric { gap: var(--ds-space-2); margin-top: var(--ds-space-2); }
#page-an-signals .sig-card2-count { color: var(--ds-ink); font: 740 36px/1 var(--ds-font); letter-spacing: -.04em; }
#page-an-signals .sig-card2-count-lbl { color: var(--ds-ink-secondary); font-size: var(--ds-text-caption); }
#page-an-signals .sig-card2-meta { gap: var(--ds-space-2); color: var(--ds-ink-secondary); font-size: var(--ds-text-caption); }
#page-an-signals .sig-card2-meta-chip { padding: 4px 8px; border: 1px solid var(--ds-line); border-radius: var(--ds-radius-sm); background: var(--ds-surface-subtle); }
#page-an-signals .sig-card2-ex { margin-top: auto; padding-top: var(--ds-space-4); border-color: var(--ds-line); }
#page-an-signals .sig-card2-ex-q { color: var(--ds-ink-secondary); font-size: var(--ds-text-caption); }

/* Catalog: health score is the primary answer; distribution and products are
   supporting evidence rather than equally loud mini-panels. */
#page-an-catalog .cathealth { gap: var(--ds-space-8); padding: var(--ds-space-6); }
#page-an-catalog .cathealth-left { gap: var(--ds-space-4); padding-right: var(--ds-space-8); border-color: var(--ds-line); }
#page-an-catalog .cathealth-h { color: var(--ds-ink-secondary); font: 650 var(--ds-text-caption)/1.3 var(--ds-font); letter-spacing: .065em; }
#page-an-catalog .cathealth-score { gap: var(--ds-space-2); }
#page-an-catalog .cathealth-num { color: var(--ds-ink); font: 740 42px/1 var(--ds-font); letter-spacing: -.045em; }
#page-an-catalog .cathealth-of { color: var(--ds-ink-tertiary); font: 600 var(--ds-text-ui)/1 var(--ds-font); }
#page-an-catalog .cathealth-delta { font-size: var(--ds-text-caption); }
#page-an-catalog .cathealth-dist { gap: var(--ds-space-6); }
#page-an-catalog .cathealth-zone,
#page-an-catalog .cathealth-zone:first-child { padding: 0; border: 0; }
#page-an-catalog .cathealth-zone-h { margin-bottom: var(--ds-space-2); color: var(--ds-ink-secondary); font-size: var(--ds-text-caption); }
#page-an-catalog .cathealth-zone-cnt { color: var(--ds-ink); font: 720 28px/1 var(--ds-font); letter-spacing: -.03em; }
#page-an-catalog .cathealth-zone-sub { margin-top: var(--ds-space-1); color: var(--ds-ink-secondary); font-size: var(--ds-text-caption); }
#page-an-catalog .cathealth-insights { gap: var(--ds-space-4); }
#page-an-catalog .cathealth-ins { padding: var(--ds-space-5); border: 0; border-radius: var(--ds-radius-feature); background: var(--ds-surface); box-shadow: var(--ds-shadow-card); }
#page-an-catalog .cathealth-ins-h { margin-bottom: var(--ds-space-3); color: var(--ds-ink); font: 700 var(--ds-text-ui)/1.35 var(--ds-font); }
#page-an-catalog .cathealth-ins-row { gap: var(--ds-space-3); padding: var(--ds-space-3) 0; border-color: var(--ds-line); }
#page-an-catalog .cathealth-ins-row:hover { background: transparent; }
#page-an-catalog .cathealth-ins-name { color: var(--ds-ink); font-size: var(--ds-text-caption); }
#page-an-catalog .cathealth-ins-reason { color: var(--ds-ink-secondary); font-size: 11px; }

/* Tables: headers are quiet labels, rows carry the data and stay scannable. */
.page[id^="page-an-"] :is(.cat-table, .impact-table, .op-table) { color: var(--ds-ink); font-family: var(--ds-font); font-size: var(--ds-text-ui); }
.page[id^="page-an-"] :is(.cat-table, .impact-table, .op-table) thead th {
  padding: 14px var(--ds-space-4);
  border-color: var(--ds-line);
  color: var(--ds-ink-secondary);
  background: var(--ds-surface-subtle);
  font: 650 10px/1.2 var(--ds-font);
  letter-spacing: .065em;
}
.page[id^="page-an-"] :is(.cat-table, .impact-table, .op-table) tbody td { padding: 15px var(--ds-space-4); border-color: var(--ds-line); }
.page[id^="page-an-"] :is(.cat-table, .impact-table, .op-table) tbody tr:hover { background: rgba(246,241,255,.52); }

/* Impact: recommendation cards lead with the decision and keep estimates as
   compact supporting metrics. */
#page-an-impact .gp-actions { gap: var(--ds-space-4); }
#page-an-impact .gp-action { gap: var(--ds-space-5); padding: var(--ds-space-6); }
#page-an-impact .gp-action-status { color: var(--ds-ink-secondary); font-size: 10px; letter-spacing: .075em; }
#page-an-impact .gp-action-kpi { color: var(--ds-ink); font: 740 28px/1 var(--ds-font); letter-spacing: -.035em; }
#page-an-impact .gp-action-kpi-unit { color: var(--ds-ink-secondary); font-size: var(--ds-text-caption); }
#page-an-impact .gp-action-prod { color: var(--ds-ink); font: 700 var(--ds-text-ui)/1.4 var(--ds-font); }
#page-an-impact .gp-action-sku { color: var(--ds-ink-tertiary); font-size: 11px; }
#page-an-impact .gp-action-problem { margin-top: var(--ds-space-1); color: var(--ds-ink-secondary); font: 450 var(--ds-text-caption)/1.5 var(--ds-font); }
#page-an-impact .gp-action-solution { color: var(--ds-ink); font: 500 var(--ds-text-ui)/1.5 var(--ds-font); }
#page-an-impact .gp-action-footer { padding-top: var(--ds-space-4); border-color: var(--ds-line); }
#page-an-impact :is(.gp-funnel, .gp-pareto, .gp-bench, .impact-scope, .impact-insight) {
  border: 0;
  border-radius: var(--ds-radius-feature);
  background: var(--ds-surface);
  box-shadow: var(--ds-shadow-card);
}
#page-an-impact :is(.gp-funnel, .gp-pareto) { padding: var(--ds-space-6); }
#page-an-impact :is(.gp-funnel-title, .gp-pareto-title, .gp-bench-title, .impact-insight-h) { color: var(--ds-ink); font-family: var(--ds-font); font-size: var(--ds-text-ui); }
#page-an-impact :is(.gp-funnel-sub, .gp-pareto-sub, .gp-funnel-stage-meta, .gp-pareto-row-meta, .impact-insight-body) { color: var(--ds-ink-secondary); font-size: var(--ds-text-caption); }
#page-an-impact .gp-funnel-stage { padding-block: var(--ds-space-4); border-color: var(--ds-line); }
#page-an-impact .gp-funnel-stage-lbl { color: var(--ds-ink); font-size: var(--ds-text-ui); }
#page-an-impact .gp-funnel-stage-val { color: var(--ds-ink); font: 700 var(--ds-text-ui)/1 var(--ds-font); }
#page-an-impact .gp-pareto-row { padding-block: var(--ds-space-3); border-color: var(--ds-line); }
#page-an-impact .impact-insight { gap: var(--ds-space-3); padding: var(--ds-space-5); }
#page-an-impact .impact-insight-item { padding: var(--ds-space-3); border-radius: var(--ds-radius-control); background: var(--ds-surface-subtle); }
#page-an-impact .impact-insight-item-name { color: var(--ds-ink); font-size: var(--ds-text-caption); }
#page-an-impact .impact-insight-item-val { color: var(--ds-ink); font-size: var(--ds-text-caption); }

/* Comparison empty state: no decorative AI orbs; selection controls are the
   only visual focus. */
#page-an-compare .cmp-empty { min-height: 360px; gap: var(--ds-space-2); padding: var(--ds-space-10) var(--ds-space-6); }
#page-an-compare .cmp-empty-orbs { display: none; }
#page-an-compare .cmp-empty-text-h { color: var(--ds-ink); font: 720 24px/1.25 var(--ds-font); letter-spacing: -.03em; }
#page-an-compare .cmp-empty-text-sub { color: var(--ds-ink-secondary); font: 450 var(--ds-text-ui)/1.55 var(--ds-font); }

@media (max-width: 980px) {
  #page-settings .rule-card-conds { grid-template-columns: repeat(2, minmax(0, 1fr)); row-gap: var(--ds-space-5); }
  .page[id^="page-an-"] .an-pro-metrics { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 760px) {
  #page-settings .set-head { padding-top: var(--ds-space-5); }
  #page-settings .set-section-h { font-size: 22px; }
  #page-settings .rule-card,
  #page-settings .ai-card { padding: var(--ds-space-5); }
  #page-settings .rule-card-title { white-space: normal; overflow-wrap: anywhere; }
  #page-settings .rule-card-conds { grid-template-columns: minmax(0, 1fr); }
  #page-settings .src-source-head { align-items: flex-start; }
  #page-settings .api-create { align-items: stretch; flex-direction: column; }
  .page[id^="page-an-"] .an-pro-intro { align-items: flex-start; padding: var(--ds-space-5); }
  .page[id^="page-an-"] .an-pro-metrics { grid-template-columns: minmax(0, 1fr); padding: var(--ds-space-5); }
}

/* Phase 6 — overlays and states. Modal content stays opaque; only the
   navigation/backdrop layer uses material blur. */
:is(.drawer-overlay.on, .src-add-overlay.on, .prod-reco-overlay, .fpick-overlay.on, .api-modal) {
  background: rgba(35, 28, 46, .30);
  backdrop-filter: blur(14px) saturate(118%);
  -webkit-backdrop-filter: blur(14px) saturate(118%);
}
:is(.drawer, .src-add, .prod-reco-modal, .fpick-modal, .api-modal-inner) {
  border: 0;
  border-radius: var(--ds-radius-feature);
  color: var(--ds-ink);
  background: var(--ds-surface);
  box-shadow: 0 34px 90px rgba(35, 25, 54, .18);
}
.app .drawer { width: min(440px, 100vw); border-radius: var(--ds-radius-feature) 0 0 var(--ds-radius-feature); }
:is(.drawer-head, .src-add-head, .fpick-head, .prod-reco-head) {
  padding: var(--ds-space-6);
  border-color: var(--ds-line);
}
:is(.drawer-title, .src-add-h, .fpick-h, .prod-reco-title, .api-modal-h) {
  color: var(--ds-ink);
  font-family: var(--ds-font);
  font-size: 22px;
  font-weight: 720;
  letter-spacing: -.03em;
  line-height: 1.2;
}
:is(.fpick-sub, .prod-reco-sub, .api-modal-sub, .src-add-lede) {
  color: var(--ds-ink-secondary);
  font-family: var(--ds-font);
  font-size: var(--ds-text-caption);
  line-height: 1.5;
}
:is(.drawer-close, .src-add-close, .fpick-close) {
  width: var(--ds-control-lg);
  min-width: var(--ds-control-lg);
  height: var(--ds-control-lg);
  border: 0;
  border-radius: var(--ds-radius-control);
  color: var(--ds-ink-secondary);
  background: var(--ds-surface-subtle);
}
:is(.drawer-close, .src-add-close, .fpick-close):hover { color: var(--ds-ink); background: var(--ds-line); }
.app .drawer-body { padding: var(--ds-space-2) var(--ds-space-6) var(--ds-space-6); }
:is(.drawer-foot, .fpick-foot, .src-add-foot) {
  gap: var(--ds-space-3);
  padding: var(--ds-space-4) var(--ds-space-6) var(--ds-space-5);
  border-color: var(--ds-line);
  background: var(--ds-surface);
}
:is(.drawer-btn, .fpick-cancel, .fpick-save, .src-add-cancel, .src-add-submit) {
  min-height: var(--ds-control-lg);
  border-radius: var(--ds-radius-control);
  font-family: var(--ds-font);
  font-size: var(--ds-text-ui);
  font-weight: 650;
}
:is(.fpick-search, .prod-reco-add) { gap: var(--ds-space-2); padding-inline: var(--ds-space-6); }
.fpick-search input { min-height: var(--ds-control-lg); border-color: var(--ds-line); border-radius: var(--ds-radius-control); background: var(--ds-surface-subtle); }
.fpick-list { padding: var(--ds-space-2) var(--ds-space-3) var(--ds-space-3); }
.fpick-item { min-height: 44px; padding: var(--ds-space-2) var(--ds-space-3); border-radius: var(--ds-radius-control); }
.fpick-item:hover,
.fpick-item.on { background: var(--ds-accent-soft); }
.fpick-name { color: var(--ds-ink); font-size: var(--ds-text-ui); }
.fpick-count,
.fpick-stat { color: var(--ds-ink-secondary); font-size: var(--ds-text-caption); }

/* Add-source flow: marketplace choices are one list/grid language and the
   second step reads as a form, not another dashboard. */
.src-add { width: min(920px, 100%); }
.src-add-body { padding: var(--ds-space-6); }
.src-add-section + .src-add-section { margin-top: var(--ds-space-6); padding-top: var(--ds-space-6); border-top: 1px solid var(--ds-line); }
.src-add-section-h { margin-bottom: var(--ds-space-3); color: var(--ds-ink-secondary); font: 650 var(--ds-text-caption)/1.2 var(--ds-font); letter-spacing: .065em; }
.src-add-grid { gap: var(--ds-space-3); }
.src-plat {
  gap: var(--ds-space-4);
  padding: var(--ds-space-4);
  border: 1px solid var(--ds-line);
  border-radius: var(--ds-radius-card);
  background: var(--ds-surface);
  backdrop-filter: none;
  -webkit-backdrop-filter: none;
  box-shadow: none;
}
.src-plat:hover { border-color: var(--ds-line-strong); box-shadow: var(--ds-shadow-card); transform: translateY(-1px); }
.src-plat-name { color: var(--ds-ink); font: 700 var(--ds-text-caption)/1.35 var(--ds-font); }
.src-plat-sub { color: var(--ds-ink-secondary); font-size: 11px; }
.src-step-tag { border: 0; border-radius: var(--ds-radius-sm); color: var(--ds-accent-strong); background: var(--ds-accent-soft); letter-spacing: .065em; }
.src-safety-pop { border: 0; border-radius: var(--ds-radius-control); color: #246653; background: #eef8f3; }
.src-add-pick { border: 0; border-radius: var(--ds-radius-card); background: var(--ds-accent-soft); }
.src-step-h { color: var(--ds-ink); font: 720 22px/1.2 var(--ds-font); letter-spacing: -.03em; }
.src-step-sub,
.src-guide-step-sub { color: var(--ds-ink-secondary); font-size: var(--ds-text-caption); }
.src-guide { border-color: var(--ds-line); border-radius: var(--ds-radius-card); background: var(--ds-surface-subtle); }
.src-guide-head { color: var(--ds-ink); font-size: var(--ds-text-ui); }
.src-guide-step + .src-guide-step { border-top: 1px solid var(--ds-line); }
#teamInvResult { border: 0 !important; border-radius: var(--ds-radius-card) !important; background: #eef8f3 !important; }
#teamInvUrl,
#teamInvResult button { min-height: var(--ds-control-lg) !important; }

/* Recommendation and API modals follow the same title/list/action rhythm. */
.prod-reco-head { padding-bottom: var(--ds-space-4); }
.prod-reco-head > div:first-child { min-width: 0; }
.prod-reco-sub { overflow-wrap: anywhere; }
.prod-reco-add { height: var(--ds-control-lg); margin: 0 var(--ds-space-6) var(--ds-space-3); border-radius: var(--ds-radius-control); background: var(--ds-surface-subtle); flex: 0 0 auto; }
.prod-reco-count { flex: 0 0 auto; }
.prod-reco-search-field { display: flex; min-width: 0; flex: 1 1 auto; align-items: center; gap: var(--ds-space-2); }
.prod-reco-search-field input { width: 100%; min-width: 0; }
.prod-reco-add-btn,
.prod-reco-pick {
  min-width: 104px;
  min-height: 40px;
  padding-inline: var(--ds-space-4);
  flex: 0 0 auto;
  white-space: nowrap;
}
.prod-reco-list { gap: var(--ds-space-2); padding: var(--ds-space-2) var(--ds-space-6) var(--ds-space-6); }
.prod-reco-item { padding: var(--ds-space-3); border-radius: var(--ds-radius-control); background: var(--ds-surface-subtle); }
.prod-reco-item:hover { background: var(--ds-accent-soft); }
.prod-reco-item-name { color: var(--ds-ink); font-size: var(--ds-text-ui); }
.prod-reco-item-meta { color: var(--ds-ink-secondary); font-size: var(--ds-text-caption); }
.prod-reco-rm { width: 40px; min-width: 40px; height: 40px; }
.prod-reco-foot .drawer-btn { min-width: 128px; }
.api-modal-inner { padding: var(--ds-space-6); }
.api-modal-key { min-height: var(--ds-control-lg); padding: var(--ds-space-3); border-radius: var(--ds-radius-control); }

/* Empty, loading and error states are calm content states. Dashed boxes and
   decorative indicators are removed; text supplies the recovery path. */
.app :is(.dg-empty, .sig-empty2, .actions-empty, .cat-empty, .cat-scatter-empty, .cathealth-ins-empty, .gp-pareto-empty, .wc-empty, .op-empty, .ins-empty, .prod-tbl-empty, .prod-reco-empty, .api-keys-empty, .team-empty, .fpick-empty, .src-empty, .bp-brand-empty, .ai-greet-empty, .ask-overview-empty) {
  min-height: 96px;
  padding: var(--ds-space-6);
  border: 0;
  border-radius: var(--ds-radius-card);
  color: var(--ds-ink-secondary);
  background: var(--ds-surface-subtle);
  font-family: var(--ds-font);
  font-size: var(--ds-text-ui);
  font-weight: 450;
  line-height: 1.55;
  text-align: center;
}
.app :is(.cat-empty, .op-empty) { display: table-cell; height: 132px; vertical-align: middle; }
.set-toast {
  min-height: 48px;
  padding: var(--ds-space-3) var(--ds-space-5);
  border: 1px solid var(--ds-glass-edge);
  border-radius: var(--ds-radius-control);
  color: var(--ds-ink);
  background: var(--ds-glass-bg-strong);
  box-shadow: var(--ds-shadow-popover);
  backdrop-filter: blur(var(--ds-glass-blur)) saturate(140%);
  -webkit-backdrop-filter: blur(var(--ds-glass-blur)) saturate(140%);
}

/* Reply editor: one calm work surface with a supporting review rail. */
.app .ed-overlay.on {
  background: rgba(35, 28, 46, .30);
  backdrop-filter: blur(14px) saturate(118%);
  -webkit-backdrop-filter: blur(14px) saturate(118%);
}
.app .ed {
  width: min(1240px, 94vw);
  border: 0;
  border-radius: var(--ds-radius-feature);
  background: var(--ds-surface);
  box-shadow: 0 34px 90px rgba(35, 25, 54, .18);
}
.app .ed-head { padding: var(--ds-space-5) var(--ds-space-6); border-color: var(--ds-line); }
.app .ed-title { color: var(--ds-ink); font: 720 22px/1.2 var(--ds-font); letter-spacing: -.03em; }
.app .ed-hbtn { width: 40px; height: 40px; border: 0; border-radius: var(--ds-radius-control); color: var(--ds-ink-secondary); background: var(--ds-surface-subtle); }
.app .ed-hbtn:hover { color: var(--ds-ink); background: var(--ds-line); }
.app .ed-body { grid-template-columns: minmax(330px, 410px) minmax(0, 1fr); }
.app .ed-left { padding: var(--ds-space-6); border-color: var(--ds-line); background: var(--ds-surface-subtle); }
.app .ed-right { gap: var(--ds-space-4); padding: var(--ds-space-6); }
.app .ed-rv-text-wrap,
.app .ed-rv-product,
.app .ed-rv-rec { border: 0; border-radius: var(--ds-radius-card); background: var(--ds-surface); box-shadow: none; }
.app .ed-rv-theme,
.app .ed-rv-author,
.app .ed-rv-product-name,
.app .ed-rv-section-title { color: var(--ds-ink); font-family: var(--ds-font); }
.app .ed-rv-date,
.app .ed-rv-product-field-lbl,
.app .ed-rv-rec-sku { color: var(--ds-ink-secondary); }
.app .ed-label { color: var(--ds-ink-secondary); font-size: var(--ds-text-caption); }
.app .ed-textarea { min-height: 330px; padding: var(--ds-space-5) 64px var(--ds-space-8) var(--ds-space-5); border: 1px solid transparent; border-radius: var(--ds-radius-card); color: var(--ds-ink); background: var(--ds-surface-subtle); font: 450 var(--ds-text-ui)/1.65 var(--ds-font); }
.app .ed-textarea:focus { border-color: var(--ds-accent); background: var(--ds-surface); box-shadow: var(--ds-focus-ring); }
.app .ed-tool { width: 36px; height: 36px; border: 0; border-radius: var(--ds-radius-control); color: var(--ds-ink-secondary); background: var(--ds-surface); box-shadow: var(--ds-shadow-card); }
.app .ed-tool:hover { color: var(--ds-accent-strong); background: var(--ds-accent-soft); transform: none; }
.app .ed-tags input { min-height: var(--ds-control-lg); border-color: var(--ds-line); border-radius: var(--ds-radius-control); background: var(--ds-surface-subtle); }
.app .ed-btn { min-height: var(--ds-control-lg); border-radius: var(--ds-radius-control); font-family: var(--ds-font); font-size: var(--ds-text-ui); }

/* The editor and filter drawer live outside `.app` in the legacy DOM, so the
   production selectors must target their actual root. */
:is(.drawer-overlay.on, .ed-overlay.on) {
  background: rgba(35, 28, 46, .30);
  backdrop-filter: blur(14px) saturate(118%);
  -webkit-backdrop-filter: blur(14px) saturate(118%);
}
.drawer { width: min(440px, 100vw); border: 0; border-radius: var(--ds-radius-feature) 0 0 var(--ds-radius-feature); color: var(--ds-ink); background: var(--ds-surface); box-shadow: 0 34px 90px rgba(35, 25, 54, .18); }
.drawer-head { padding: var(--ds-space-6); border-color: var(--ds-line); }
.drawer-title { color: var(--ds-ink); font: 720 22px/1.2 var(--ds-font); letter-spacing: -.03em; }
.drawer-close { width: var(--ds-control-lg); min-width: var(--ds-control-lg); height: var(--ds-control-lg); border: 0; border-radius: var(--ds-radius-control); color: var(--ds-ink-secondary); background: var(--ds-surface-subtle); }
.drawer-body { padding: var(--ds-space-2) var(--ds-space-6) var(--ds-space-6); }
.drawer-foot { gap: var(--ds-space-3); padding: var(--ds-space-4) var(--ds-space-6) var(--ds-space-5); border-color: var(--ds-line); background: var(--ds-surface); }
.drawer-btn { min-height: var(--ds-control-lg); border-radius: var(--ds-radius-control); font: 650 var(--ds-text-ui)/1 var(--ds-font); }
.drawer-btn.primary { border-color: var(--ds-accent); color: #fff; background: var(--ds-accent); }
.drawer-btn.primary:hover { border-color: var(--ds-accent-strong); background: var(--ds-accent-strong); }
.drawer-btn.secondary { border-color: var(--ds-line); color: var(--ds-ink); background: var(--ds-surface); }
.ed { width: min(1240px, 94vw); border: 0; border-radius: var(--ds-radius-feature); background: var(--ds-surface); box-shadow: 0 34px 90px rgba(35, 25, 54, .18); }
.ed-head { padding: var(--ds-space-5) var(--ds-space-6); border-color: var(--ds-line); }
.ed-title { color: var(--ds-ink); font: 720 22px/1.2 var(--ds-font); letter-spacing: -.03em; }
.ed-hbtn { width: var(--ds-control-lg); min-width: var(--ds-control-lg); height: var(--ds-control-lg); border: 0; border-radius: var(--ds-radius-control); color: var(--ds-ink-secondary); background: var(--ds-surface-subtle); }
.ed-hbtn:hover { color: var(--ds-ink); background: var(--ds-line); }
.ed-body { grid-template-columns: minmax(330px, 410px) minmax(0, 1fr); }
.ed-left { padding: var(--ds-space-6); border-color: var(--ds-line); background: var(--ds-surface-subtle); }
.ed-right { gap: var(--ds-space-4); padding: var(--ds-space-6); }
:is(.ed-rv-text-wrap, .ed-rv-product, .ed-rv-rec) { border: 0; border-radius: var(--ds-radius-card); background: var(--ds-surface); box-shadow: none; }
:is(.ed-rv-theme, .ed-rv-author, .ed-rv-product-name, .ed-rv-section-title) { color: var(--ds-ink); font-family: var(--ds-font); }
:is(.ed-rv-date, .ed-rv-product-field-lbl, .ed-rv-rec-sku, .ed-label) { color: var(--ds-ink-secondary); }
.ed-textarea { min-height: 330px; padding: var(--ds-space-5) 64px var(--ds-space-8) var(--ds-space-5); border: 1px solid transparent; border-radius: var(--ds-radius-card); color: var(--ds-ink); background: var(--ds-surface-subtle); font: 450 var(--ds-text-ui)/1.65 var(--ds-font); }
.ed-textarea:focus { border-color: var(--ds-accent); background: var(--ds-surface); box-shadow: var(--ds-focus-ring); }
.ed-tool { display: grid; width: var(--ds-control-lg); min-width: var(--ds-control-lg); height: var(--ds-control-lg); padding: 0; place-items: center; border: 0; border-radius: var(--ds-radius-control); color: var(--ds-ink-secondary); background: var(--ds-surface); box-shadow: var(--ds-shadow-card); cursor: pointer; }
.ed-tool:hover { color: var(--ds-accent-strong); background: var(--ds-accent-soft); transform: none; }
.ed-clear { display: flex; min-height: var(--ds-control-lg); align-items: center; padding: 0 var(--ds-space-2); border: 0; color: var(--ds-ink-secondary); background: transparent; font: 500 var(--ds-text-caption)/1 var(--ds-font); cursor: pointer; }
.ed-tags input { min-height: var(--ds-control-lg); border-color: var(--ds-line); border-radius: var(--ds-radius-control); background: var(--ds-surface-subtle); }
.ed-btn { min-height: var(--ds-control-lg); border-radius: var(--ds-radius-control); font-family: var(--ds-font); font-size: var(--ds-text-ui); }

/* Profile: Apple Settings-like identity, segmented navigation and list rows.
   Decorative drawn previews/flags are intentionally removed. */
#page-profile.on {
  padding: var(--ds-space-10) var(--ds-space-6);
  background: rgba(35, 28, 46, .30);
  backdrop-filter: blur(14px) saturate(118%);
  -webkit-backdrop-filter: blur(14px) saturate(118%);
}
#page-profile .prf-panel { width: 100%; max-width: 680px; padding: var(--ds-space-6); border: 0; border-radius: var(--ds-radius-feature); background: var(--ds-surface); box-shadow: 0 28px 70px rgba(35,25,54,.15); }
#page-profile .prf-panel-id { border: 1px solid var(--ds-glass-edge); background: var(--ds-glass-bg-strong); box-shadow: var(--ds-glass-shadow); backdrop-filter: blur(var(--ds-glass-blur)) saturate(140%); -webkit-backdrop-filter: blur(var(--ds-glass-blur)) saturate(140%); }
#page-profile .prf-close { width: 44px; height: 44px; border: 1px solid var(--ds-glass-edge); border-radius: var(--ds-radius-control); color: var(--ds-ink-secondary); background: var(--ds-glass-bg-strong); box-shadow: var(--ds-glass-shadow); }
#page-profile .prf-close:hover { color: var(--ds-ink); border-color: var(--ds-glass-edge); transform: none; }
#page-profile .prf-ava { width: 64px; height: 64px; border: 0; border-radius: var(--ds-radius-card); color: var(--ds-ink-secondary); background: var(--ds-surface-subtle); }
#page-profile .prf-name { color: var(--ds-ink); font: 720 22px/1.2 var(--ds-font); letter-spacing: -.03em; }
#page-profile .prf-id-sub { color: var(--ds-ink-secondary); font-size: var(--ds-text-caption); }
#page-profile .prf-ava-edit { min-height: 40px; border-color: var(--ds-line); border-radius: var(--ds-radius-control); color: var(--ds-ink); background: var(--ds-surface); }
#page-profile .prf-tabs { gap: var(--ds-space-1); padding: var(--ds-space-1); border: 0; border-radius: var(--ds-radius-card); background: var(--ds-surface-subtle); }
#page-profile .prf-tab { flex: 1; min-height: 40px; padding: 0 var(--ds-space-3); border-radius: var(--ds-radius-control); color: var(--ds-ink-secondary); }
#page-profile .prf-tab.on { color: var(--ds-ink); background: var(--ds-surface); box-shadow: var(--ds-shadow-card); }
#page-profile .prf-tab.on::after { display: none; }
#page-profile .prf-form { gap: var(--ds-space-4); }
#page-profile .prf-label { color: var(--ds-ink-secondary); font-size: var(--ds-text-caption); }
#page-profile :is(.prf-input, .prf-select) { min-height: var(--ds-control-lg); border-color: var(--ds-line); border-radius: var(--ds-radius-control); color: var(--ds-ink); background: var(--ds-surface-subtle); }
#page-profile :is(.prf-input, .prf-select):focus { border-color: var(--ds-accent); background: var(--ds-surface); box-shadow: var(--ds-focus-ring); }
#page-profile .prf-input-phone .prf-flag { display: none; }
#page-profile .prf-input-phone input { padding-left: var(--ds-space-4); }
#page-profile .prf-form-foot { padding-top: var(--ds-space-5); border-color: var(--ds-line); }
#page-profile :is(.prf-apply, .prf-cancel) { min-height: var(--ds-control-lg); border-radius: var(--ds-radius-control); font-family: var(--ds-font); font-size: var(--ds-text-ui); }
#page-profile .prf-theme-grid,
#page-profile .prf-an-grid { display: flex; max-width: none; flex-direction: column; gap: var(--ds-space-2); }
#page-profile :is(.prf-theme, .prf-an) { min-height: 52px; padding: var(--ds-space-3) var(--ds-space-4); border-color: var(--ds-line); border-radius: var(--ds-radius-control); background: var(--ds-surface-subtle); transform: none; }
#page-profile :is(.prf-theme, .prf-an).on { border-color: var(--ds-accent); background: var(--ds-accent-soft); box-shadow: none; }
#page-profile :is(.prf-theme-preview, .prf-an-preview) { display: none; }
#page-profile :is(.prf-theme-foot, .prf-an-foot) { margin-top: auto; margin-bottom: auto; padding: 0; }
#page-profile .prf-card { border: 0; border-radius: var(--ds-radius-card); background: var(--ds-surface-subtle); }
#page-profile .prf-card-head { padding: var(--ds-space-4); }
#page-profile .prf-card-title { color: var(--ds-ink); font-size: var(--ds-text-ui); }
#page-profile .prf-card-body { border-color: var(--ds-line); }

/* Security audit: compact filter, summary metrics and readable event rows. */
#page-settings .audit-toolbar {
  display: flex;
  align-items: end;
  gap: var(--ds-space-3);
  margin: var(--ds-space-6) 0 var(--ds-space-4);
  flex-wrap: wrap;
}
#page-settings .audit-filter-label {
  width: 100%;
  color: var(--ds-ink-secondary);
  font: 650 var(--ds-text-caption)/1.2 var(--ds-font);
}
#page-settings .audit-filter {
  min-width: min(340px, 100%);
  min-height: var(--ds-control-lg);
  padding: 0 var(--ds-space-4);
  border: 1px solid var(--ds-line);
  border-radius: var(--ds-radius-control);
  color: var(--ds-ink);
  background: var(--ds-surface-subtle);
  font: 500 var(--ds-text-ui)/1 var(--ds-font);
}
#page-settings .audit-filter:focus { border-color: var(--ds-accent); outline: 0; box-shadow: var(--ds-focus-ring); }
#page-settings .audit-refresh { margin-left: auto; }
#page-settings .audit-summary { display: flex; gap: var(--ds-space-2); margin-bottom: var(--ds-space-5); flex-wrap: wrap; }
#page-settings .audit-summary-item {
  display: inline-flex;
  align-items: center;
  gap: var(--ds-space-3);
  min-height: 40px;
  padding: 0 var(--ds-space-4);
  border-radius: var(--ds-radius-control);
  color: var(--ds-ink-secondary);
  background: var(--ds-surface-subtle);
}
#page-settings .audit-summary-item span { color: var(--ds-ink-secondary); font: 550 var(--ds-text-caption)/1.4 var(--ds-font); }
#page-settings .audit-event code { color: var(--ds-ink); font: 600 12px/1.4 var(--ds-mono, 'SFMono-Regular', Consolas, monospace); }
#page-settings .audit-summary-item strong { color: var(--ds-ink); font: 720 var(--ds-text-ui)/1 var(--ds-font); }
#page-settings #auditList { display: block; overflow: hidden; border: 0; border-radius: var(--ds-radius-card); background: var(--ds-surface); box-shadow: var(--ds-shadow-card); }
#page-settings .audit-event { display: grid; grid-template-columns: 148px minmax(0, 1fr) 128px; align-items: center; gap: var(--ds-space-4); padding: var(--ds-space-4) var(--ds-space-5); }
#page-settings .audit-event + .audit-event { border-top: 1px solid var(--ds-line); }
#page-settings .audit-event-time,
#page-settings .audit-event-ip { color: var(--ds-ink-secondary); font: 500 var(--ds-text-caption)/1.4 var(--ds-font); }
#page-settings .audit-event-ip { overflow-wrap: anywhere; text-align: right; }
#page-settings .audit-event-main { min-width: 0; }
#page-settings .audit-event-title { display: flex; align-items: baseline; gap: var(--ds-space-2); min-width: 0; }
#page-settings .audit-event-title > strong { color: var(--ds-ink); font: 650 var(--ds-text-ui)/1.4 var(--ds-font); }
#page-settings .audit-event-target { min-width: 0; overflow: hidden; color: var(--ds-ink-secondary); text-overflow: ellipsis; white-space: nowrap; }
#page-settings .audit-event-target::before { content: '→ '; }
#page-settings .audit-event-details { margin-top: var(--ds-space-2); color: var(--ds-ink-secondary); font-family: var(--ds-font); font-size: var(--ds-text-caption); }
#page-settings .audit-event-details summary { display: flex; width: max-content; min-height: 32px; align-items: center; color: var(--ds-accent-strong); cursor: pointer; }
#page-settings .audit-event-details pre { max-height: 180px; margin: var(--ds-space-2) 0 0; overflow: auto; padding: var(--ds-space-3); border-radius: var(--ds-radius-control); color: var(--ds-ink-secondary); background: var(--ds-surface-subtle); font: 450 11px/1.5 var(--ds-mono, 'SFMono-Regular', Consolas, monospace); white-space: pre-wrap; overflow-wrap: anywhere; }
#page-settings .audit-state { padding: var(--ds-space-8) var(--ds-space-6); color: var(--ds-ink-secondary); font: 450 var(--ds-text-ui)/1.55 var(--ds-font); text-align: center; }
#page-settings .audit-state-error { display: flex; flex-direction: column; gap: var(--ds-space-1); }
#page-settings .audit-state-error strong { color: var(--ds-ink); font-weight: 680; }

/* Ozon extension setup reuses the shared modal language and keeps security
   guidance as normal product content, without drawn browser mockups. */
.ext-setup-overlay {
  position: fixed;
  inset: 0;
  z-index: 2147483000;
  display: flex;
  align-items: center;
  justify-content: center;
  overflow: hidden;
  padding: var(--ds-space-6);
  background: rgba(28, 25, 34, .34);
  backdrop-filter: blur(10px) saturate(110%);
  -webkit-backdrop-filter: blur(10px) saturate(110%);
}
.ext-setup-modal {
  position: relative;
  width: min(760px, 100%);
  max-height: min(820px, calc(100dvh - 48px));
  overflow: auto;
  overscroll-behavior: contain;
  padding: var(--ds-space-8);
  border-radius: var(--ds-radius-feature);
  outline: 0;
  color: var(--ds-ink);
  background: var(--ds-surface);
  box-shadow: 0 34px 90px rgba(28, 22, 42, .22);
  scrollbar-width: thin;
}
.ext-setup-head {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: start;
  gap: var(--ds-space-6);
}
.ext-setup-close {
  min-width: 88px;
  min-height: var(--ds-control-lg);
  padding: 0 var(--ds-space-4);
  border: 0;
  border-radius: var(--ds-radius-control);
  color: var(--ds-ink-secondary);
  background: var(--ds-surface-subtle);
  font: 650 var(--ds-text-caption)/1 var(--ds-font);
  cursor: pointer;
}
.ext-setup-close:hover { color: var(--ds-ink); background: var(--ds-line); }
.ext-setup-kicker { margin-bottom: var(--ds-space-2); color: var(--ds-accent-strong); font: 700 var(--ds-text-caption)/1.2 var(--ds-font); letter-spacing: .065em; text-transform: uppercase; }
.ext-setup-title { max-width: 560px; color: var(--ds-ink); font: 740 30px/1.12 var(--ds-font); letter-spacing: -.04em; }
.ext-setup-sub { max-width: 620px; margin: var(--ds-space-3) 0 0; color: var(--ds-ink-secondary); font: 450 var(--ds-text-ui)/1.55 var(--ds-font); }
.ext-setup-install { display: flex; align-items: center; justify-content: space-between; gap: var(--ds-space-5); margin-top: var(--ds-space-6); padding: var(--ds-space-4); border-radius: var(--ds-radius-card); background: var(--ds-accent-soft); }
.ext-setup-install-copy { display: flex; min-width: 0; flex-direction: column; gap: var(--ds-space-1); font-family: var(--ds-font); }
.ext-setup-install-copy strong { color: var(--ds-ink); font-size: var(--ds-text-ui); line-height: 1.35; }
.ext-setup-install-copy span { color: var(--ds-ink-secondary); font-size: var(--ds-text-caption); line-height: 1.45; }
.ext-setup-primary { display: inline-flex; flex: 0 0 auto; align-items: center; justify-content: center; min-height: var(--ds-control-lg); padding: 0 var(--ds-space-5); border-radius: var(--ds-radius-control); color: #fff; background: var(--ds-accent); font: 680 var(--ds-text-caption)/1 var(--ds-font); text-decoration: none; }
.ext-setup-primary:hover { background: var(--ds-accent-strong); }
.ext-setup-guide { margin-top: var(--ds-space-6); }
.ext-setup-guide-title { color: var(--ds-ink); font: 680 var(--ds-text-ui)/1.35 var(--ds-font); }
.ext-setup-steps { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--ds-space-3); margin: var(--ds-space-3) 0 0; padding: 0; counter-reset: ext-step; list-style: none; }
.ext-setup-step { position: relative; display: grid; grid-template-columns: 28px minmax(0, 1fr); align-content: start; gap: var(--ds-space-3); min-width: 0; padding: var(--ds-space-4); border-radius: var(--ds-radius-card); background: var(--ds-surface-subtle); counter-increment: ext-step; }
.ext-setup-step::before { content: counter(ext-step); display: grid; width: 28px; height: 28px; place-items: center; border-radius: var(--ds-radius-sm); color: var(--ds-accent-strong); background: var(--ds-accent-soft); font: 720 var(--ds-text-caption)/1 var(--ds-font); }
.ext-setup-step strong,
.ext-setup-step span { display: block; }
.ext-setup-step strong { margin-bottom: var(--ds-space-1); color: var(--ds-ink); font: 680 var(--ds-text-ui)/1.35 var(--ds-font); }
.ext-setup-step span { color: var(--ds-ink-secondary); font: 450 var(--ds-text-caption)/1.55 var(--ds-font); }
.ext-setup-security { display: grid; grid-template-columns: 190px minmax(0, 1fr); align-items: start; gap: var(--ds-space-4); margin-top: var(--ds-space-4); padding: var(--ds-space-4); border-radius: var(--ds-radius-card); color: #246653; background: #eef8f3; font-family: var(--ds-font); }
.ext-setup-security strong { font-size: var(--ds-text-ui); }
.ext-setup-security span { font-size: var(--ds-text-caption); line-height: 1.5; }

/* Legacy drawn marketplace walkthroughs are intentionally not shown. The
   real, accessible instruction list is the source of truth. */
.src-mock { display: none !important; }

/* Every interactive settings control has at least a 44 px hit area. */
#page-settings .set-switch {
  --h: 22px;
  width: var(--ds-control-lg);
  min-width: var(--ds-control-lg);
  height: var(--ds-control-lg);
  border-radius: var(--ds-radius-control);
  background: transparent !important;
}
#page-settings .set-switch::before {
  content: '';
  position: absolute;
  top: 11px;
  left: 2px;
  width: 40px;
  height: 22px;
  border-radius: var(--ds-radius-pill);
  background: var(--ds-line-strong);
}
#page-settings .set-switch.on::before { background: var(--src-grad-from, var(--ds-accent)); }
#page-settings .set-switch::after { top: 13px; left: 4px; }
#page-settings .src-source-actions button { width: var(--ds-control-lg); min-width: var(--ds-control-lg); height: var(--ds-control-lg); }
#page-settings #apiNewLabel { min-height: var(--ds-control-lg); }

/* Cross-screen accessibility pass: primary and icon controls keep a 44 px
   target on desktop too. Dense word-cloud marks remain proportional data
   labels; their surrounding chart supports keyboard focus separately. */
:is(.rv-tab, .cat-tab, .cat-chip, .cat-refresh, .cat-search, .cat-filter-sel, .gp-action-cta, .ask-input, .ask-chip, .rcc, .chart-mini) {
  min-height: var(--ds-control-lg);
}
:is(.pf-sort, .th-dl-btn, .ask-send, .rule-card-drag, .rule-card-kebab, .rule-kebab) {
  width: var(--ds-control-lg);
  min-width: var(--ds-control-lg);
  height: var(--ds-control-lg);
}
#page-an-processing button { min-height: var(--ds-control-lg); }
.th-list-pager .pg-btn { min-width: 40px; min-height: 40px; }
.th-toggle {
  width: var(--ds-control-lg);
  min-width: var(--ds-control-lg);
  height: var(--ds-control-lg);
  background: transparent !important;
}
.th-toggle::before {
  content: '';
  position: absolute;
  top: 12px;
  left: 4px;
  width: 36px;
  height: 20px;
  border-radius: var(--ds-radius-pill);
  background: var(--ds-line-strong);
}
.th-toggle.on::before { background: var(--ds-accent); }
.th-toggle::after { top: 14px; left: 6px; }
.th-toggle.on::after { left: 22px; }

/* Legacy bundles load after this stylesheet and still declare fixed 22–36 px
   heights. These narrow overrides enforce the audited hit area without
   changing chart geometry or proportional word-cloud marks. */
#page-reviews-mp .rv-tab,
#page-an-processing button,
#page-an-catalog :is(.cat-tab, .cat-chip, .cat-refresh, .cat-search, .cat-filter-sel, .cat-filter-reset),
#page-an-reviews :is(.th-select, .chart-mini, .th-dl-btn, .tp-search, .tp-mp-btn),
#page-settings :is(.rcc, .rule-card-drag, .rule-card-kebab, .rule-kebab) {
  min-height: var(--ds-control-lg) !important;
}
#page-an-reviews .card-head > :last-child { flex: 0 0 auto; }
#page-an-reviews .chart-mini {
  width: auto;
  min-width: 112px;
  max-width: 100%;
  flex: 0 0 auto;
  white-space: nowrap;
}
#page-settings :is(.rule-card-drag, .rule-card-kebab, .rule-kebab),
#page-an-processing button {
  min-width: var(--ds-control-lg) !important;
}

@media (max-width: 760px) {
  :is(.src-add-overlay, .prod-reco-overlay, .fpick-overlay, .api-modal) { padding: 0; align-items: flex-end; }
  :is(.src-add, .prod-reco-modal, .fpick-modal, .api-modal-inner) { max-height: 92dvh; border-radius: var(--ds-radius-feature) var(--ds-radius-feature) 0 0; }
  .drawer { border-radius: 0; }
  :is(.drawer-head, .src-add-head, .fpick-head, .prod-reco-head) { padding: var(--ds-space-5); }
  :is(.drawer-body, .src-add-body) { padding-inline: var(--ds-space-5); }
  :is(.drawer-foot, .fpick-foot, .src-add-foot) { padding-inline: var(--ds-space-5); }
  .src-add-grid { grid-template-columns: minmax(0, 1fr); }
  .ed { width: 100vw; max-height: 100dvh; border-radius: 0; }
  .ed-body { grid-template-columns: minmax(0, 1fr); }
  .ed-left { max-height: 38dvh; border-right: 0; border-bottom: 1px solid var(--ds-line); }
  #page-profile.on { padding: var(--ds-space-8) var(--ds-space-4); }
  #page-profile .prf-id { align-items: flex-start; flex-wrap: wrap; }
  #page-profile .prf-ava-edit { width: 100%; }
  #page-settings .audit-filter { width: 100%; min-width: 0; }
  #page-settings .audit-refresh { width: 100%; margin-left: 0; justify-content: center; }
  #page-settings .audit-event { grid-template-columns: minmax(0, 1fr); gap: var(--ds-space-2); }
  #page-settings .audit-event-ip { text-align: left; }
  .ext-setup-overlay { align-items: flex-end; padding: 0; }
  .ext-setup-modal { width: 100%; max-height: 94dvh; padding: var(--ds-space-6) var(--ds-space-5); border-radius: var(--ds-radius-feature) var(--ds-radius-feature) 0 0; }
  .ext-setup-head { grid-template-columns: minmax(0, 1fr) auto; gap: var(--ds-space-3); }
  .ext-setup-title { font-size: 24px; }
  .ext-setup-install { align-items: stretch; flex-direction: column; }
  .ext-setup-primary { width: 100%; }
  .ext-setup-steps { grid-template-columns: minmax(0, 1fr); }
}

@media (max-width: 480px) {
  .prod-reco-add {
    height: auto !important;
    min-height: var(--ds-control-lg);
    padding: var(--ds-space-2);
    align-items: stretch;
    flex-direction: column;
  }
  .prod-reco-search-field { min-height: 32px; padding-inline: var(--ds-space-2); }
  .prod-reco-add-btn { width: 100%; min-height: 44px; }
  .prod-reco-item { gap: var(--ds-space-2); }
  .prod-reco-item-name { white-space: normal; overflow-wrap: anywhere; }
  .prod-reco-pick { min-width: 96px; min-height: 44px; padding-inline: var(--ds-space-3); }
  .prod-reco-foot { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .prod-reco-error { grid-column: 1 / -1; margin: 0; }
  .prod-reco-foot .drawer-btn { width: 100%; min-width: 0; min-height: 44px; }
}

/* Standalone product surfaces. These routes keep their existing business
   behaviour and now inherit the same canvas, hierarchy and control language
   as the authenticated application. */
.ds-standalone {
  min-height: 100vh;
  color: var(--ds-ink);
  background:
    radial-gradient(ellipse 62% 360px at 14% -8%, rgba(var(--ds-accent-light-rgb), .10), transparent 70%),
    radial-gradient(ellipse 58% 380px at 88% -10%, rgba(var(--ds-accent-light-rgb), .10), transparent 72%),
    linear-gradient(180deg, #f4f7fc 0, var(--ds-canvas) 440px);
  font-family: var(--ds-font);
  -webkit-font-smoothing: antialiased;
}
.ds-standalone :is(button, input, select, textarea) { min-height: var(--ds-control-lg); }
.ds-standalone :is(.brand-mark, .mark) {
  border-radius: var(--ds-radius-sm);
  background: var(--ds-accent);
  box-shadow: none;
}

/* Partner dashboard: important numbers read as one summary instead of a
   stack of nested cards. Liquid Glass is reserved for the sticky toolbar. */
.ds-dashboard header {
  min-height: 68px;
  padding: var(--ds-space-3) var(--ds-space-8);
  border-bottom: 1px solid var(--ds-glass-edge);
  background: var(--ds-glass-bg-strong);
  box-shadow: 0 8px 28px rgba(45, 33, 68, .045);
  backdrop-filter: blur(var(--ds-glass-blur)) saturate(140%);
  -webkit-backdrop-filter: blur(var(--ds-glass-blur)) saturate(140%);
}
.ds-dashboard .org-pill { min-height: 36px; border-radius: var(--ds-radius-control); background: rgba(255,255,255,.72); }
.ds-dashboard .user-pill { min-height: var(--ds-control-lg); padding: 0 var(--ds-space-2); }
.ds-dashboard .btn-out { min-height: var(--ds-control-lg); border-color: var(--ds-line); border-radius: var(--ds-radius-control); background: var(--ds-surface); }
.ds-dashboard .trial-bar {
  min-height: 52px;
  padding: var(--ds-space-2) var(--ds-space-8);
  color: var(--ds-ink);
  background: #eee8f8 !important;
  background-size: auto;
}
.ds-dashboard .trial-bar .trial-cta { min-height: var(--ds-control-lg); color: #fff; border-radius: var(--ds-radius-control); background: var(--ds-accent); }
.ds-dashboard .trial-bar .trial-close { width: var(--ds-control-lg); min-width: var(--ds-control-lg); height: var(--ds-control-lg); color: var(--ds-ink-secondary); }
.ds-dashboard main { width: min(1280px, 100%); max-width: none; padding: var(--ds-space-10) var(--ds-space-8) var(--ds-space-16); grid-template-columns: minmax(0, 1fr) 320px; gap: var(--ds-space-6); }
.ds-dashboard .welcome,
.ds-dashboard aside {
  border: 0;
  border-radius: var(--ds-radius-feature);
  background: var(--ds-surface);
  box-shadow: var(--ds-shadow-card);
}
.ds-dashboard .welcome { padding: var(--ds-space-10); }
.ds-dashboard .welcome h1 { margin-bottom: var(--ds-space-2); color: var(--ds-ink); font: 740 var(--ds-text-page)/1.15 var(--ds-font); letter-spacing: -.04em; }
.ds-dashboard .welcome .lead { margin-bottom: var(--ds-space-8); color: var(--ds-ink-secondary); font: 450 var(--ds-text-body)/1.55 var(--ds-font); }
.ds-dashboard .kpis { gap: 0; margin: 0; border-top: 1px solid var(--ds-line); border-bottom: 1px solid var(--ds-line); }
.ds-dashboard .kpi { min-width: 0; padding: var(--ds-space-5) var(--ds-space-5); border: 0; border-radius: 0; background: transparent; }
.ds-dashboard .kpi + .kpi { border-left: 1px solid var(--ds-line); }
.ds-dashboard .kpi-l { color: var(--ds-ink-secondary); font: 620 var(--ds-text-caption)/1.3 var(--ds-font); letter-spacing: 0; text-transform: none; }
.ds-dashboard .kpi-v { color: var(--ds-ink); font: 740 30px/1.05 var(--ds-font); letter-spacing: -.035em; }
.ds-dashboard .kpi-d { color: var(--ds-ink-tertiary); font: 450 var(--ds-text-caption)/1.4 var(--ds-font); }
.ds-dashboard .kpi-bar { height: 4px; background: var(--ds-surface-subtle); }
.ds-dashboard .section-h { margin: var(--ds-space-10) 0 var(--ds-space-4); color: var(--ds-ink); font: 720 var(--ds-text-section)/1.2 var(--ds-font); letter-spacing: -.03em; text-transform: none; }
.ds-dashboard .fgrid { gap: var(--ds-space-3); }
.ds-dashboard .feat { min-height: 150px; padding: var(--ds-space-5); border: 0; border-radius: var(--ds-radius-card); background: var(--ds-surface-subtle); box-shadow: none; transform: none; }
.ds-dashboard .feat:hover { border: 0; background: #ececf1; box-shadow: none; transform: none; }
.ds-dashboard .feat-ico { width: 40px; height: 40px; border-radius: var(--ds-radius-control); background: var(--ds-accent-soft); }
.ds-dashboard .feat-t { color: var(--ds-ink); font: 680 var(--ds-text-card)/1.3 var(--ds-font); }
.ds-dashboard .feat-d { color: var(--ds-ink-secondary); font: 450 var(--ds-text-body)/1.5 var(--ds-font); }
.ds-dashboard aside { top: 92px; padding: var(--ds-space-6); }
.ds-dashboard .aside-h { font: 700 var(--ds-text-card)/1.3 var(--ds-font); }
.ds-dashboard .aside-sub,
.ds-dashboard .step-l,
.ds-dashboard .aside-foot { color: var(--ds-ink-secondary); }
.ds-dashboard .step { min-height: var(--ds-control-lg); align-items: center; padding: var(--ds-space-2); border-radius: var(--ds-radius-control); }
.ds-dashboard .step-mark { margin-top: 0; }
.ds-dashboard .upgrade-card { border-radius: var(--ds-radius-card); background: #28242f; }
.ds-dashboard .upgrade-card::before { display: none; }
.ds-dashboard .upgrade-btn { min-height: 40px; border-radius: var(--ds-radius-control); }
.ds-dashboard .modal { border-radius: var(--ds-radius-feature); box-shadow: 0 34px 90px rgba(35,25,54,.18); }
.ds-dashboard :is(.tier-card, .modal-close) { border-radius: var(--ds-radius-control); }

/* System callout. Alerts, limits and upgrade prompts share one quiet white
   surface; semantic colour belongs to the icon or the actual action only. */
.ds-callout,
.app .banner {
  display: flex;
  width: 100%;
  min-width: 0;
  align-items: center;
  gap: var(--ds-space-4);
  padding: var(--ds-space-4) var(--ds-space-5);
  overflow: visible;
  border: 1px solid var(--ds-line);
  border-radius: var(--ds-radius-card);
  color: var(--ds-ink);
  background: var(--ds-surface);
  box-shadow: 0 1px 2px rgba(24,24,27,.025), 0 8px 22px rgba(24,24,27,.035);
  font-family: var(--ds-font);
}
.ds-callout::before,
.app .banner::before { display: none; }
.ds-callout__main {
  display: flex;
  min-width: 0;
  flex: 1 1 auto;
  align-items: center;
  gap: var(--ds-space-3);
}
.ds-callout__icon,
.app .banner-icon {
  display: grid;
  width: var(--ds-control-lg);
  height: var(--ds-control-lg);
  flex: 0 0 var(--ds-control-lg);
  place-items: center;
  border: 1px solid var(--ds-line);
  border-radius: var(--ds-radius-control);
  color: var(--ds-ink-secondary);
  background: var(--ds-surface-subtle);
}
.ds-callout__icon svg,
.app .banner-icon svg {
  width: var(--ds-icon);
  height: var(--ds-icon);
  fill: none;
  stroke: currentColor;
  stroke-width: 1.8;
  stroke-linecap: round;
  stroke-linejoin: round;
}
.ds-callout__body { min-width: 0; flex: 1 1 auto; }
.ds-callout__title,
.app .banner-title {
  display: block;
  margin: 0;
  color: var(--ds-ink);
  font: 680 var(--ds-text-ui)/1.35 var(--ds-font);
  letter-spacing: -.012em;
}
.ds-callout__description,
.app .banner-desc {
  display: block;
  margin: var(--ds-space-1) 0 0;
  color: var(--ds-ink-secondary);
  font: 450 var(--ds-text-caption)/1.45 var(--ds-font);
}
.ds-callout__actions {
  display: flex;
  flex: 0 0 auto;
  align-items: center;
  justify-content: flex-end;
  gap: var(--ds-space-2);
}
.ds-callout__meta { color: var(--ds-ink-secondary); font: 550 var(--ds-text-caption)/1.35 var(--ds-font); }
.ds-callout__action,
.app .banner-cta {
  display: inline-flex;
  min-height: var(--ds-control);
  align-items: center;
  justify-content: center;
  gap: var(--ds-space-2);
  padding: 0 var(--ds-space-4);
  border: 1px solid var(--ds-line);
  border-radius: var(--ds-radius-control);
  color: var(--ds-ink);
  background: var(--ds-surface);
  font: 650 var(--ds-text-ui)/1 var(--ds-font);
  text-decoration: none;
  white-space: nowrap;
  cursor: pointer;
  transition: border-color var(--ds-duration-fast), background-color var(--ds-duration-fast), transform var(--ds-duration-fast);
}
.ds-callout__action:hover,
.app .banner-cta:hover { border-color: var(--ds-line-strong); background: var(--ds-surface-subtle); transform: none; }
.ds-callout__action--primary { border-color: transparent; color: #fff; background: var(--ds-accent); }
.ds-callout__action--primary:hover { border-color: transparent; color: #fff; background: var(--ds-accent-strong); }
.ds-callout__action--success { border-color: transparent; color: #fff; background: var(--ds-green); }
.ds-callout__action--success:hover { border-color: transparent; color: #fff; background: #066747; }
.ds-callout--success .ds-callout__icon { border-color: transparent; color: var(--ds-green); background: var(--ds-green-soft); }
.ds-callout--warning .ds-callout__icon { border-color: transparent; color: var(--ds-amber); background: var(--ds-amber-soft); }
.ds-callout--danger .ds-callout__icon,
.src-form-banner.ds-callout.err .ds-callout__icon { border-color: transparent; color: var(--ds-red); background: var(--ds-red-soft); }
.src-form-banner.ds-callout.warn .ds-callout__icon { border-color: transparent; color: var(--ds-amber); background: var(--ds-amber-soft); }
.ds-callout--compact { padding: var(--ds-space-3); border-radius: var(--ds-radius-control); }
.ds-callout--compact .ds-callout__icon { width: 34px; height: 34px; flex-basis: 34px; }
.ds-callout--compact .ds-callout__icon svg { width: var(--ds-icon-sm); height: var(--ds-icon-sm); margin: 0; }

/* Legacy selectors keep their behavioural hooks while inheriting the shared
   callout contract above. */
.ask-plan-banner.ds-callout { margin-bottom: var(--ds-space-4); }
.ask-plan-banner.ds-callout .ask-plan-banner-l { gap: var(--ds-space-3); }
.ask-plan-banner.ds-callout .ask-plan-banner-r { gap: var(--ds-space-3); }
.ask-plan-banner.ds-callout .ask-plan-banner-cta { height: auto; box-shadow: none; }
#page-an-ask > .ask-plan-banner.ds-callout {
  width: calc(100% - (var(--ds-space-5) * 2));
  margin: var(--ds-space-4) var(--ds-space-5) 0;
  flex: 0 0 auto;
}
#page-settings .api-upgrade.ds-callout {
  padding: var(--ds-space-4) var(--ds-space-5);
  border: 1px solid var(--ds-line);
  border-radius: var(--ds-radius-card);
  background: var(--ds-surface);
  box-shadow: 0 1px 2px rgba(24,24,27,.025), 0 8px 22px rgba(24,24,27,.035);
}
.src-form-banner.ds-callout { border: 1px solid var(--ds-line); color: var(--ds-ink-secondary); background: var(--ds-surface); }
.src-form-banner.ds-callout button.retry { min-height: var(--ds-control-sm); color: #fff; background: var(--ds-ink); }
.src-form-banner.ds-callout button.retry span { color: inherit; }
.ext-setup-security.ds-callout {
  display: flex;
  grid-template-columns: none;
  align-items: center;
  gap: var(--ds-space-3);
  color: var(--ds-ink);
  background: var(--ds-surface);
}
.ext-setup-security.ds-callout strong,
.ext-setup-security.ds-callout span { display: block; }
.ds-dashboard .upgrade-card.ds-callout {
  margin-top: var(--ds-space-5);
  padding: var(--ds-space-4);
  border: 1px solid var(--ds-line);
  border-radius: var(--ds-radius-card);
  color: var(--ds-ink);
  background: var(--ds-surface);
  box-shadow: 0 1px 2px rgba(24,24,27,.025), 0 8px 22px rgba(24,24,27,.035);
}
.ds-dashboard .upgrade-card.ds-callout .upgrade-h,
.ds-dashboard .upgrade-card.ds-callout .upgrade-d { margin: 0; color: inherit; }
.ds-dashboard .upgrade-card.ds-callout .upgrade-d { color: var(--ds-ink-secondary); }
.ds-dashboard .upgrade-card.ds-callout .ds-callout__actions { width: 100%; justify-content: flex-start; }
.ds-dashboard .upgrade-card.ds-callout .upgrade-btn { min-height: var(--ds-control); color: #fff; background: var(--ds-accent); }

@media (max-width: 760px) {
  .ds-callout { align-items: flex-start; flex-wrap: wrap; padding: var(--ds-space-4); }
  .ds-callout__main { width: 100%; }
  .ds-callout__actions { width: 100%; justify-content: flex-start; flex-wrap: wrap; }
  .ds-callout__actions .ds-callout__action { flex: 1 1 auto; }
  .ext-setup-security.ds-callout { flex-wrap: nowrap; }
  #page-an-ask > .ask-plan-banner.ds-callout {
    width: calc(100% - (var(--ds-space-3) * 2));
    margin: var(--ds-space-3) var(--ds-space-3) 0;
  }
  #page-an-ask.on {
    height: calc(100vh - 64px);
    margin: calc(var(--ds-space-4) * -1);
  }
}

/* Route transitions keep the destination structure as quiet context instead
   of replacing the whole workspace with a white sheet. */
.route-state {
  top: 64px;
  align-items: flex-start;
  justify-content: center;
  padding: clamp(var(--ds-space-5), 5vh, var(--ds-space-12)) var(--ds-space-6);
  pointer-events: none;
  background: transparent;
  backdrop-filter: none;
  -webkit-backdrop-filter: none;
}
.main.is-route-loading .content {
  opacity: .18;
  filter: blur(6px);
  pointer-events: none;
  transition: opacity var(--ds-duration-fast) var(--ds-ease-out), filter var(--ds-duration-fast) var(--ds-ease-out);
}
.route-state-card {
  display: grid;
  width: min(100%, 520px);
  max-width: none;
  grid-template-columns: var(--ds-control-lg) minmax(0, 1fr);
  grid-template-areas:
    "indicator kicker"
    "indicator title"
    "indicator copy"
    ". retry";
  column-gap: var(--ds-space-4);
  padding: var(--ds-space-5);
  pointer-events: auto;
  border: 0;
  border-radius: calc(var(--ds-radius-control) + var(--ds-space-1));
  color: var(--ds-ink);
  background: var(--ds-surface);
  box-shadow: var(--ds-shadow-card);
  text-align: left;
}
.route-state.is-loading .route-state-card::before {
  content: "";
  grid-area: indicator;
  width: var(--ds-control-lg);
  height: var(--ds-control-lg);
  align-self: center;
  border: 3px solid var(--ds-accent-soft);
  border-top-color: var(--ds-accent);
  border-radius: var(--ds-radius-pill);
  animation: routeStateSpin .8s linear infinite;
}
.route-state:not(.is-loading) .route-state-card { grid-template-columns: minmax(0, 1fr); grid-template-areas: "kicker" "title" "copy" "retry"; }
.route-state-kicker {
  grid-area: kicker;
  margin: 0 0 var(--ds-space-1);
  color: var(--ds-accent-strong);
  font: 650 var(--ds-text-caption)/1.3 var(--ds-font);
  letter-spacing: 0;
  text-transform: none;
}
.route-state-title { grid-area: title; margin: 0; color: var(--ds-ink); font: 700 var(--ds-text-card)/1.3 var(--ds-font); letter-spacing: -.02em; }
.route-state-copy { grid-area: copy; margin-top: var(--ds-space-1); color: var(--ds-ink-secondary); font: 450 var(--ds-text-body)/1.45 var(--ds-font); }
.route-state-retry {
  grid-area: retry;
  width: max-content;
  min-height: var(--ds-control);
  margin-top: var(--ds-space-4);
  padding: 0 var(--ds-space-4);
  border-radius: var(--ds-radius-control);
  background: var(--ds-accent);
  font: 650 var(--ds-text-ui)/1 var(--ds-font);
}
.route-state-retry:hover { background: var(--ds-accent-strong); }
@keyframes routeStateSpin { to { transform: rotate(1turn); } }

@media (max-width: 640px) {
  .route-state { padding: var(--ds-space-4); }
  .route-state-card { grid-template-columns: var(--ds-control) minmax(0, 1fr); padding: var(--ds-space-4); column-gap: var(--ds-space-3); }
  .route-state.is-loading .route-state-card::before { width: var(--ds-control); height: var(--ds-control); }
}

@media (prefers-reduced-motion: reduce) {
  .main.is-route-loading .content { transition: none; }
  .route-state.is-loading .route-state-card::before { animation: none; border-color: var(--ds-accent-soft); border-top-color: var(--ds-accent); }
}

/* Administration: dense operational content, quiet opaque work surfaces. */
.ds-admin header {
  min-height: 68px;
  padding: var(--ds-space-3) var(--ds-space-8);
  border-bottom-color: var(--ds-glass-edge);
  background: var(--ds-glass-bg-strong);
  box-shadow: 0 8px 28px rgba(45,33,68,.045);
}
.ds-admin .btn-out { min-height: var(--ds-control-lg); border-color: var(--ds-line); border-radius: var(--ds-radius-control); background: var(--ds-surface); }
.ds-admin main { width: min(1440px, 100%); max-width: none; padding: var(--ds-space-8); gap: var(--ds-space-5); }
.ds-admin .panel { border: 0; border-radius: var(--ds-radius-feature); background: var(--ds-surface); box-shadow: var(--ds-shadow-card); backdrop-filter: none; -webkit-backdrop-filter: none; }
.ds-admin :is(.search, .chip, .tab, .btn, .btn-sec, .plan-select, .date-input) { min-height: var(--ds-control-lg); border-radius: var(--ds-radius-control); }
.ds-admin :is(.org-row, .kpi, .plan-card, .set-section, .resp-row, .job-row, .resp-pane) { border-radius: var(--ds-radius-card); }
.ds-admin .toast { border-radius: var(--ds-radius-control); }

/* Documentation and legal pages use the same reading rhythm and tokens. */
.ds-api-docs { padding: var(--ds-space-10) var(--ds-space-6) var(--ds-space-16); }
.ds-api-docs .wrap { max-width: 920px; }
.ds-api-docs .nav { min-height: var(--ds-control-lg); align-items: center; margin-bottom: var(--ds-space-10); }
.ds-api-docs h1,
.ds-privacy h1 { color: var(--ds-ink); font: 740 36px/1.1 var(--ds-font); letter-spacing: -.045em; }
.ds-api-docs .lead,
.ds-privacy .lead { color: var(--ds-ink-secondary); }
.ds-api-docs h2,
.ds-privacy h2 { color: var(--ds-ink); font-family: var(--ds-font); letter-spacing: -.025em; }
.ds-api-docs .endpoint { padding: var(--ds-space-6); border: 0; border-radius: var(--ds-radius-card); background: var(--ds-surface); box-shadow: var(--ds-shadow-card); }
.ds-api-docs pre { border-radius: var(--ds-radius-control); }
.ds-api-docs .params { display: table; overflow: hidden; border-radius: var(--ds-radius-control); background: rgba(255,255,255,.6); }
.ds-api-docs .method { border-radius: var(--ds-radius-sm); }
.ds-privacy { max-width: 840px; padding: var(--ds-space-12) var(--ds-space-6) var(--ds-space-16); }
.ds-privacy .upd { color: var(--ds-ink-tertiary); }
.ds-privacy :is(p, li) { color: var(--ds-ink-secondary); }
.ds-privacy h2 { margin-top: var(--ds-space-10); }

/* Invitation and service status: calm, static, accessible system states. */
.ds-invite { padding: var(--ds-space-6); }
.ds-invite .shell,
.ds-error-page .card { border: 0; border-radius: var(--ds-radius-feature); background: var(--ds-surface); box-shadow: var(--ds-shadow-card); }
.ds-invite .shell { max-width: 500px; padding: var(--ds-space-8); }
.ds-invite .invite-loading { min-height: 150px; padding: var(--ds-space-8) 0; flex-direction: column; gap: var(--ds-space-2); text-align: left; }
.ds-invite .loading-title { color: var(--ds-ink); font: 700 var(--ds-text-card)/1.3 var(--ds-font); }
.ds-invite .loading-sub { color: var(--ds-ink-secondary); font: 450 var(--ds-text-body)/1.5 var(--ds-font); }
.ds-invite .invite-box { border: 0; border-radius: var(--ds-radius-card); background: var(--ds-accent-soft); }
.ds-invite :is(input, .btn, .err, .ok) { border-radius: var(--ds-radius-control); }
.ds-invite .btn:hover:not(:disabled) { transform: none; }
.ds-error-page { background:
  radial-gradient(ellipse 58% 380px at 18% -8%, rgba(var(--ds-accent-light-rgb),.09), transparent 72%),
  radial-gradient(ellipse 54% 360px at 86% -8%, rgba(var(--ds-accent-light-rgb),.09), transparent 72%),
  var(--ds-canvas); }
.ds-error-page .brand-bar { padding: var(--ds-space-6) var(--ds-space-10); }
.ds-error-page .card { max-width: 560px; padding: var(--ds-space-10); text-align: left; backdrop-filter: none; -webkit-backdrop-filter: none; }
.ds-error-page .icon,
.ds-error-page .status { display: none; animation: none; }
.ds-error-page .eyebrow { margin-bottom: var(--ds-space-3); color: var(--ds-accent-strong); font: 700 var(--ds-text-caption)/1.2 var(--ds-font); letter-spacing: .06em; text-transform: uppercase; }
.ds-error-page h1 { margin-bottom: var(--ds-space-3); color: var(--ds-ink); font: 740 30px/1.15 var(--ds-font); letter-spacing: -.04em; }
.ds-error-page .sub { color: var(--ds-ink-secondary); }
.ds-error-page .btn-primary { min-height: var(--ds-control-lg); border-radius: var(--ds-radius-control); background: var(--ds-accent); box-shadow: none; transform: none; }
.ds-error-page .btn-primary:hover { background: var(--ds-accent-strong); box-shadow: none; transform: none; }
.ds-error-page .meta { color: var(--ds-ink-tertiary); }

@media (prefers-reduced-motion: reduce) {
  .ds-standalone *, .ds-standalone *::before, .ds-standalone *::after {
    scroll-behavior: auto !important;
    animation-duration: .01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: .01ms !important;
  }
}

@media (max-width: 1024px) {
  .ds-dashboard main,
  .ds-admin main { grid-template-columns: minmax(0, 1fr); padding: var(--ds-space-6); }
  .ds-dashboard aside { position: static; }
}

@media (max-width: 680px) {
  .ds-dashboard header,
  .ds-admin header { padding: var(--ds-space-3) var(--ds-space-4); gap: var(--ds-space-2); flex-wrap: wrap; }
  .ds-dashboard .user-meta,
  .ds-admin .user-pill { display: none !important; }
  .ds-dashboard .trial-bar { padding: var(--ds-space-3) var(--ds-space-4); flex-wrap: wrap; }
  .ds-dashboard main,
  .ds-admin main { padding: var(--ds-space-4); }
  .ds-dashboard .welcome { padding: var(--ds-space-6); }
  .ds-dashboard .welcome h1 { font-size: 27px; }
  .ds-dashboard .kpis { grid-template-columns: minmax(0, 1fr); }
  .ds-dashboard .kpi + .kpi { border-top: 1px solid var(--ds-line); border-left: 0; }
  .ds-dashboard .fgrid { grid-template-columns: minmax(0, 1fr); }
  .ds-api-docs { padding: var(--ds-space-8) var(--ds-space-4) var(--ds-space-12); }
  .ds-api-docs h1,
  .ds-privacy h1 { font-size: 30px; }
  .ds-api-docs .endpoint { padding: var(--ds-space-5); }
  .ds-api-docs .params { display: block; overflow-x: auto; }
  .ds-privacy { padding: var(--ds-space-8) var(--ds-space-4) var(--ds-space-12); }
  .ds-invite .shell,
  .ds-error-page .card { padding: var(--ds-space-6); }
  .ds-error-page .brand-bar { padding: var(--ds-space-5); }
  .ds-error-page main { padding: var(--ds-space-4); }
}

/* Design review 2026-09-02: shared analytics layout and motion contract.
   Viewport breakpoints keep column counts stable while the navigation rail
   animates. Closing the rail now gives cards more room on every analytics page
   instead of unexpectedly adding a column and shrinking the cards. */
.app {
  transition: grid-template-columns var(--ds-duration-slow) var(--ds-ease-out),
              background-color var(--ds-duration-slow) var(--ds-ease-out);
}

.page[id^="page-an-"] {
  width: 100%;
  max-width: var(--ds-content-analytics);
  margin-inline: auto;
  font-family: var(--ds-font);
}

.content:has(.page.on[id^="page-an-"]) > .filter-bar {
  width: 100%;
  max-width: var(--ds-content-analytics);
  margin-inline: auto;
  align-items: flex-end;
  gap: var(--ds-space-3);
  margin-bottom: var(--ds-space-5);
  padding: var(--ds-space-4);
  border: 1px solid var(--ds-glass-edge);
  border-radius: var(--ds-radius-feature);
  background: var(--ds-glass-bg-strong);
  box-shadow: var(--ds-glass-shadow);
}
/* Route-specific analytics rules use an id inside :has(), so they outrank the
   generic contract above. Keep the same readable width at that specificity. */
.content:has(:is(
  #page-an-digest.on,
  #page-an-reviews.on,
  #page-an-signals.on,
  #page-an-processing.on,
  #page-an-insights.on,
  #page-an-compare.on,
  #page-an-catalog.on,
  #page-an-impact.on,
  #page-an-ask.on
)) > .filter-bar {
  max-width: var(--ds-content-analytics);
  margin-inline: auto;
}
.content:has(.page.on[id^="page-an-"]) > .filter-bar .filter-controls {
  display: flex;
  min-width: 0;
  flex: 1 1 auto;
  align-items: flex-end;
  gap: var(--ds-space-3);
}
.content:has(.page.on[id^="page-an-"]) > .filter-bar .filter-item {
  min-width: 160px;
  flex: 1 1 220px;
}
.content:has(.page.on[id^="page-an-"]) > .filter-bar :is(.filter-select, .filter-filters-btn) {
  min-height: var(--ds-control-lg);
  border-radius: var(--ds-radius-control);
}

.page[id^="page-an-"] .an-hero {
  margin-bottom: var(--ds-space-5);
  padding: var(--ds-space-6) var(--ds-space-2) var(--ds-space-5);
}
.page[id^="page-an-"] .an-hero-inner {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(320px, auto);
  align-items: center;
  gap: var(--ds-space-8);
}
.page[id^="page-an-"] :is(.an-hero-left, .an-hero-stats) { min-width: 0; }

.page[id^="page-an-"] .section-h {
  min-height: 32px;
  align-items: baseline;
  gap: var(--ds-space-2);
  margin: var(--ds-space-8) 0 var(--ds-space-4);
  color: var(--ds-ink-secondary);
  font: 500 var(--ds-text-caption)/1.45 var(--ds-font);
  letter-spacing: 0;
  text-transform: none;
}
.page[id^="page-an-"] .section-h .h-pill {
  padding: 0;
  border: 0;
  color: var(--ds-ink);
  background: transparent;
  font: 700 var(--ds-text-body)/1.3 var(--ds-font);
  letter-spacing: -.02em;
  text-transform: none;
}

#page-an-signals .sig-grid,
#page-an-impact .gp-actions,
#page-an-processing .cards-3,
#page-an-reviews .cards-3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
#page-an-reviews .cards-3.an-core-metrics {
  grid-template-columns: minmax(280px, .8fr) minmax(420px, 1.2fr);
}
#page-an-catalog .cathealth-insights { grid-template-columns: repeat(2, minmax(0, 1fr)); }
#page-an-impact .gp-funnel-wrap { grid-template-columns: minmax(0, 1.25fr) minmax(320px, .75fr); }

/* “Выводы” is part of the analytics workflow, not a separate landing page. */
#page-an-insights .ins-step-pick {
  max-width: none;
  align-items: stretch;
  padding: var(--ds-space-6) var(--ds-space-2) var(--ds-space-10);
  text-align: left;
}
#page-an-insights .ins-stepper { align-self: flex-start; }
#page-an-insights .ins-hero {
  width: 100%;
  max-width: none;
  align-items: flex-start;
  margin: var(--ds-space-4) 0 var(--ds-space-8);
  text-align: left;
}
#page-an-insights .ins-hero-title { max-width: 18ch; font-size: clamp(32px, 3vw, 42px); line-height: 1.08; }
#page-an-insights .ins-hero-title br { display: none; }
#page-an-insights .ins-hero-sub { max-width: 62ch; }
#page-an-insights .ins-pick-section { width: 100%; max-width: none; }
#page-an-insights .ins-pick-section-head {
  margin-bottom: var(--ds-space-4);
  color: var(--ds-ink-secondary);
  font: 650 var(--ds-text-caption)/1.3 var(--ds-font);
  letter-spacing: .04em;
}
#page-an-insights .ins-pick-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
#page-an-insights .ins-pick-card { min-height: 230px; }

@media (max-width: 1180px) {
  #page-an-signals .sig-grid,
  #page-an-impact .gp-actions,
  #page-an-processing .cards-3,
  #page-an-reviews .cards-3 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  #page-an-impact .gp-funnel-wrap { grid-template-columns: minmax(0, 1fr); }
}

@media (max-width: 980px) {
  .page[id^="page-an-"] .an-hero-inner { grid-template-columns: minmax(0, 1fr); gap: var(--ds-space-5); }
  #page-an-insights .ins-pick-grid { grid-template-columns: minmax(0, 1fr); }
  #page-an-insights .ins-pick-card { min-height: 0; }
}

@media (max-width: 760px) {
  .content:has(.page.on[id^="page-an-"]) > .filter-bar { padding: var(--ds-space-3); }
  .content:has(.page.on[id^="page-an-"]) > .filter-bar .filter-controls {
    display: grid;
    width: 100%;
    grid-template-columns: minmax(0, 1fr);
    overflow: visible;
  }
  .content:has(.page.on[id^="page-an-"]) > .filter-bar .filter-item {
    width: 100%;
    min-width: 0;
  }
  #page-an-signals .sig-grid,
  #page-an-impact .gp-actions,
  #page-an-processing .cards-3,
  #page-an-reviews .cards-3,
  #page-an-catalog .cathealth-insights { grid-template-columns: minmax(0, 1fr); }
  #page-an-reviews .cards-3.an-core-metrics { grid-template-columns: minmax(0, 1fr); }
  .page[id^="page-an-"] .section-h { align-items: flex-start; flex-direction: column; }
  .page[id^="page-an-"] .an-hero { max-width: 100%; padding-inline: 0; }
  .page[id^="page-an-"] .an-hero-inner { width: 100%; max-width: 100%; }
  .page[id^="page-an-"] .an-hero-stats {
    display: grid;
    width: 100%;
    max-width: 100%;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: var(--ds-space-4);
    padding: var(--ds-space-4);
  }
  .page[id^="page-an-"] .an-hero-stats > div { min-width: 0; }
  .page[id^="page-an-"] :is(.cards-3, .sig-grid, .gp-actions) > * { width: 100%; min-width: 0; max-width: 100%; }
  .page[id^="page-an-"] :is(.card-head, .card-headcol, .card-title) { min-width: 0; max-width: 100%; }
  .page[id^="page-an-"] .card-title { white-space: normal; overflow-wrap: anywhere; }
  #page-an-reviews :is(#cardDynReviews, #cardDynRating) .card-head {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(112px, auto);
  }
  #page-an-reviews :is(#cardDynReviews, #cardDynRating) .card-head > :last-child {
    min-width: 112px;
    justify-self: end;
  }
  #page-an-compare .cmp-hero { max-width: 100%; overflow: hidden; }
  #page-an-compare .cmp-hero-row {
    min-width: 0;
    grid-template-columns: minmax(0, 1fr) 48px minmax(0, 1fr);
    align-items: end;
    gap: var(--ds-space-2);
  }
  #page-an-compare .cmp-multi { width: 100%; min-width: 0; max-width: 100%; }
  #page-an-compare .cmp-vs-medal { width: 44px; height: 44px; margin-top: 0; }
  #page-an-compare .cmp-btn-primary { width: 100%; grid-column: 1 / -1; margin-top: var(--ds-space-2); }
  #page-an-catalog :is(.cat-controls, .cat-tabs, .cat-table-wrap),
  #page-an-impact .impact-table-wrap { max-width: 100%; }
  #page-an-catalog .cat-tabs,
  #page-an-catalog .cat-table-wrap,
  #page-an-impact .impact-table-wrap { overflow-x: auto; }
}

/* Wide notebook / desktop density. The previous hard 1280px rail left almost
   a quarter of a 15-inch high-resolution workspace empty and made otherwise
   correct typography feel zoomed out. This breakpoint deliberately leaves the
   <=1599px composition unchanged and enlarges both the rail and information
   scale together, instead of simply stretching small cards. */
@media (min-width: 1600px) {
  .page[id^="page-an-"],
  .content:has(.page.on[id^="page-an-"]) > .filter-bar,
  .content:has(:is(
    #page-an-digest.on,
    #page-an-reviews.on,
    #page-an-signals.on,
    #page-an-processing.on,
    #page-an-insights.on,
    #page-an-compare.on,
    #page-an-catalog.on,
    #page-an-impact.on,
    #page-an-ask.on
  )) > .filter-bar {
    max-width: var(--ds-content-analytics-wide);
  }

  .page[id^="page-an-"] .an-hero {
    padding-block: var(--ds-space-8);
  }
  .page[id^="page-an-"] .an-hero-inner {
    grid-template-columns: minmax(520px, 1fr) minmax(520px, auto);
    gap: var(--ds-space-12);
  }
  .page[id^="page-an-"] .an-hero-title { font-size: 46px; }
  .page[id^="page-an-"] .an-hero-sub { max-width: 68ch; font-size: 16px; }
  .page[id^="page-an-"] .an-hero-stats {
    min-width: 520px;
    gap: var(--ds-space-8);
    padding: var(--ds-space-6) 28px;
  }
  .page[id^="page-an-"] .an-hero-stat-lbl { font-size: 11px; }
  .page[id^="page-an-"] .an-hero-stat-val { font-size: 40px; }

  .page[id^="page-an-"] .an-pro-intro { padding: 22px 28px 18px; }
  .page[id^="page-an-"] .an-pro-heading { font-size: 18px; }
  .page[id^="page-an-"] .an-pro-title { font-size: 13px; }
  .page[id^="page-an-"] .an-pro-metrics { padding: 22px 28px 26px; gap: var(--ds-space-8); }
  .page[id^="page-an-"] .an-pro-metric,
  .page[id^="page-an-"] .an-pro-metric + .an-pro-metric { padding: 0; }
  .page[id^="page-an-"] .an-pro-kicker,
  .page[id^="page-an-"] .an-pro-label { font-size: 13px; }
  .page[id^="page-an-"] .an-pro-value { font-size: 34px; }

  .page[id^="page-an-"] .section-h {
    min-height: 36px;
    margin-block: 36px var(--ds-space-5);
    font-size: 14px;
  }
  .page[id^="page-an-"] .section-h .h-pill { font-size: 17px; }
  .page[id^="page-an-"] :is(.cards-2, .cards-3) { gap: var(--ds-space-6); }
  .page[id^="page-an-"] .card { padding: 28px; }
  .page[id^="page-an-"] .card-title { font-size: 16px; }
  .page[id^="page-an-"] .big-num { font-size: 52px; }
  .page[id^="page-an-"] .num-lbl { font-size: 14px; }
  #page-an-reviews .an-core-metrics {
    grid-template-columns: minmax(460px, .82fr) minmax(680px, 1.18fr);
  }
  #page-an-reviews .chart-wrap { height: 280px; }
}

@media (prefers-reduced-motion: reduce) {
  .app { transition: none; }
}

/* Text-entry focus includes dialogs portaled outside the app container. */
:is(.app,.ui-language) :is(input:not([type="checkbox"]):not([type="radio"]):not([type="range"]):not([type="button"]):not([type="submit"]):not([type="color"]), textarea):not(.ds-field-shell input,.ds-field-shell textarea):focus {
  border-color:var(--ds-focus-border)!important;
  outline:1px solid var(--ds-focus-border)!important;
  outline-offset:-1px!important;
  box-shadow:none!important;
}
.app .ask-composer:focus-within {
  border-color:var(--ds-focus-border);
  box-shadow:0 8px 24px -12px rgba(15,23,42,.08);
}
.app .ask-composer #askInput:focus,
.app .ask-composer #askInput:focus-visible {
  border:0!important;
  outline:0!important;
  box-shadow:none!important;
}
@media(forced-colors:active){
  :is(.app,.ui-language) :is(input,textarea):focus-visible{outline:1px solid Highlight!important;outline-offset:-1px!important}
  .app .ask-composer:focus-within{border-color:Highlight}
}

/* Composite text controls own a single focus boundary around icon + input. */
:is(.app,.ui-language) .ds-field-shell:has(input:focus,textarea:focus){
  border-color:var(--ds-focus-border)!important;
  outline:1px solid var(--ds-focus-border)!important;
  outline-offset:-1px!important;
  box-shadow:none!important;
}
:is(.app,.ui-language) .ds-field-shell :is(input,textarea):is(:focus,:focus-visible){
  border:0!important;
  outline:0!important;
  box-shadow:none!important;
}
@media(forced-colors:active){
  :is(.app,.ui-language) .ds-field-shell:has(input:focus,textarea:focus){outline-color:Highlight!important;border-color:Highlight!important}
}

/* Hidden switch inputs keep keyboard focus on their visible track. */
:is(.app,.ui-language) :is(.bp-toggle,.chat-switch) input:focus-visible{outline:0!important;box-shadow:none!important}
:is(.app,.ui-language) :is(.bp-toggle input:focus-visible + .bp-toggle-slider,.chat-switch input:focus-visible + span){outline:2px solid var(--ds-accent);outline-offset:3px}
@media(forced-colors:active){
  :is(.app,.ui-language) :is(.bp-toggle input:focus-visible + .bp-toggle-slider,.chat-switch input:focus-visible + span){outline-color:Highlight}
}

/* Manual review templates: native top layer also works over the full editor. */
.review-template-picker{margin:auto;padding:24px;width:min(880px,calc(100vw - 32px));max-height:calc(100dvh - 32px);border:1px solid var(--ds-line);border-radius:var(--ds-radius-feature);background:var(--ds-surface);color:var(--ds-ink);font-family:var(--ds-font);box-shadow:var(--ds-shadow-card);overflow:auto}
.review-template-picker::backdrop{background:rgba(15,23,42,.36);backdrop-filter:blur(4px)}
.rtp-head,.rtp-foot{display:flex;align-items:center;justify-content:space-between;gap:12px}
.rtp-head h2{margin:0;font-size:22px;line-height:1.3}
.rtp-search{width:100%;min-height:44px;margin:16px 0 8px;padding:10px 12px;border:1px solid var(--ds-line);border-radius:var(--ds-radius-control);background:var(--ds-surface-subtle);color:var(--ds-ink);font:inherit}
.rtp-status{min-height:24px;color:var(--ds-ink-secondary);font-size:13px;line-height:1.5;margin-bottom:8px}
.rtp-body{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:16px;min-height:240px}
.rtp-list{max-height:44dvh;overflow-y:auto;display:flex;flex-direction:column;gap:8px;padding:3px}
.rtp-option{display:flex;flex-direction:column;gap:5px;text-align:left;flex-shrink:0;padding:12px;border:1px solid var(--ds-line);border-radius:var(--ds-radius-control);background:var(--ds-surface);color:var(--ds-ink);font:inherit;cursor:pointer;overflow-wrap:anywhere}
.rtp-option strong{font-size:14px}.rtp-option span{font-size:12px;color:var(--ds-ink-secondary)}
.rtp-option small{font-size:13px;line-height:1.45;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.rtp-option[aria-pressed="true"]{border-color:var(--ds-accent);background:var(--ds-accent-soft)}
.rtp-preview{min-width:0;max-height:44dvh;overflow-y:auto;border-radius:var(--ds-radius-control);background:var(--ds-surface-subtle);padding:16px}
.rtp-preview label{display:block;margin:0 0 12px;font-size:14px;font-weight:600}
.rtp-preview textarea{display:block;width:100%;min-height:220px;resize:vertical;padding:12px;border:1px solid var(--ds-line);border-radius:var(--ds-radius-control);background:var(--ds-surface);color:var(--ds-ink);font:14px/1.6 var(--ds-font);overflow-wrap:anywhere}
.rtp-edit-meta{display:flex;justify-content:space-between;gap:8px;flex-wrap:wrap;margin-top:8px;font-size:12px;line-height:1.4;color:var(--ds-ink-secondary)}
.rtp-counter{font-variant-numeric:tabular-nums;white-space:nowrap}
.rtp-foot{justify-content:flex-end;margin-top:16px;flex-wrap:wrap}
.rtp-error,.ed-feedback{padding:12px;border:1px solid var(--ds-line);border-radius:var(--ds-radius-control);background:var(--ds-surface-subtle);color:var(--ds-ink);font-size:14px;line-height:1.5;overflow-wrap:anywhere;flex-shrink:0}
.rtp-error{margin-top:12px;color:var(--ds-red);background:var(--ds-red-soft)}
.ed-template-button{min-height:36px;padding:6px 12px;border:1px solid var(--ds-line);border-radius:var(--ds-radius-control);background:var(--ds-surface);color:var(--ds-ink);font:600 13px var(--ds-font);cursor:pointer}
.review-template-picker :is(button,input,textarea):focus-visible,.ed-template-button:focus-visible{outline:2px solid var(--ds-accent);outline-offset:2px}
.review-template-picker button:disabled{opacity:.5;cursor:wait}
#bulkToast,#setToast{z-index:var(--ds-z-toast)!important;max-width:calc(100vw - 32px);overflow-wrap:anywhere}
@media(max-width:600px){
 .review-template-picker{padding:16px}.rtp-body{grid-template-columns:1fr;min-height:0;gap:12px}.rtp-list{max-height:28dvh}.rtp-preview{max-height:32dvh}.rtp-preview textarea{min-height:130px}.rtp-head h2{font-size:20px}
 .ed-template-button{min-height:44px}.rv-resp-btn.dice{min-height:44px;width:auto!important;padding:0 12px!important}.rtp-foot .ed-btn{padding:0 14px}
}

/* Keep Edit readable; compact icon actions wrap without hiding Send. */
.rv-resp-actions[aria-label="Действия с ответом"]{display:flex;flex-wrap:wrap;gap:8px}
.rv-resp-actions[aria-label="Действия с ответом"] .rv-btn-label{display:none}
.rv-resp-actions[aria-label="Действия с ответом"] .edit .rv-btn-label{display:inline}
.rv-resp-actions[aria-label="Действия с ответом"] .rv-resp-btn:not(.edit){width:34px!important;min-width:34px;padding:0!important;flex-shrink:0}
@media(max-width:600px){
 .rv-resp-actions[aria-label="Действия с ответом"] .rv-resp-btn{min-height:44px;height:44px}
 .rv-resp-actions[aria-label="Действия с ответом"] .rv-resp-btn:not(.edit){width:44px!important;min-width:44px}
}

.q-error.q-pending { background:var(--ds-accent-soft); color:var(--ds-ink-secondary); }