/* Public palette v291. Colors sourced from admin_theme_clean_v1.css.
   Color-only layer: no layout, typography, media, brand or preference changes.
   Secondary text replaces low-contrast admin muted text; dark filled actions
   use dark ink for readable contrast on the admin lavender accent. */
:root, :root[data-theme="light"], body:not(.dark-mode) {
  --bg-primary: #f6f7f9;
  --bg-secondary: #f0f1f4;
  --surface-solid: #ffffff;
  --surface-raised: #ffffff;
  --surface-muted: #f3f4f6;
  --surface-hover: #f0f1f4;
  --text-primary: #17191d;
  --text-secondary: #5f6672;
  --text-muted: #5f6672;
  --border-color: #e3e5e9;
  --input-bg: #ffffff;
  --btn-bg-primary: #635bff;
  --btn-text-primary: #ffffff;
  --btn-bg-secondary: #f0f1f4;
  --btn-text-secondary: #17191d;
  --ch-accent: #635bff;
  --ch-accent-soft: rgba(99,91,255,.10);
  --ch-sidebar: #ffffff;
  --ch-elevated: #ffffff;
  --shadow-sm: 0 1px 2px rgba(16,24,40,.04), 0 6px 20px rgba(16,24,40,.05);
  --shadow-card: var(--shadow-sm);
  --shadow-floating: var(--shadow-sm);
}
:root.dark-mode-preload, :root[data-theme="dark"], :root[data-theme="dark"] body, body.dark-mode {
  --bg-primary: #0f1115;
  --bg-secondary: #20242c;
  --surface-solid: #171a20;
  --surface-raised: #171a20;
  --surface-muted: #12151a;
  --surface-hover: #20242c;
  --text-primary: #f1f3f5;
  --text-secondary: #a8afb9;
  --text-muted: #a8afb9;
  --border-color: #2a2f38;
  --input-bg: #15181e;
  --btn-bg-primary: #9b8cff;
  --btn-text-primary: #17191d;
  --btn-bg-secondary: #20242c;
  --btn-text-secondary: #f1f3f5;
  --ch-accent: #9b8cff;
  --ch-accent-soft: rgba(155,140,255,.13);
  --ch-sidebar: #14171c;
  --ch-elevated: #1b1f26;
  --shadow-sm: 0 1px 2px rgba(0,0,0,.25), 0 8px 24px rgba(0,0,0,.20);
  --shadow-card: var(--shadow-sm);
  --shadow-floating: var(--shadow-sm);
}
:root, :root[data-theme], body, body.dark-mode {
  --bg: var(--bg-primary);
  --panel: var(--surface-raised);
  --text: var(--text-primary);
  --muted: var(--text-secondary);
  --line: var(--border-color);
  --bg-card: var(--surface-raised);
  --dark: var(--text-primary);
  --premium-glass: var(--surface-raised);
  --premium-glow: var(--shadow-sm);
  --body-gradient-start: var(--bg-primary);
  --accent: var(--ch-accent);
}
html body, html body.theme-inline-sanitized { background: var(--bg-primary); color: var(--text-primary); }
html body :is(.sidebar) {
  background: var(--ch-sidebar) !important;
  border-color: var(--border-color) !important;
  box-shadow: none;
}
html body .bottom-nav.mobile-dock,
html body :is(.topbar, .chaabi-desktop-topbar, .bottom-nav, .mobile-bottom-nav) {
  background: var(--surface-solid) !important;
  border-color: var(--border-color) !important;
  color: var(--text-primary);
  box-shadow: none !important;
  backdrop-filter: none;
  -webkit-backdrop-filter: none;
}
html body :is(.panel, .post-card:not(.native-ad-card), .shared-post, .post-comments-panel,
 .home-stories-panel, .home-composer, .home-rail-card, .home-upload-card,
 .profile-hero, .profile-menu, .inbox-panel, .inbox-drawer-panel, .auth-card,
 .composer-hero, .composer-form, .composer-panel, .chat-shell, .chat-shell-head,
 .chat-compose, .settings-card, .settings-profile-card, .person-row, .rank-row) {
  background: var(--surface-raised);
  border-color: var(--border-color);
  color: var(--text-primary);
  box-shadow: var(--shadow-card);
}
html body :is(.modal, .modal-content, .modal-card, .account-menu-card,
 .gift-picker-card, .report-picker-card, .chaabi-preview-panel, .search-dropdown) {
  background: var(--ch-elevated);
  color: var(--text-primary);
  border-color: var(--border-color);
  box-shadow: var(--shadow-floating);
}
html body :is(input:not([type="checkbox"]):not([type="radio"]):not([type="range"]):not([type="color"]):not([type="submit"]):not([type="button"]), textarea, select) {
  background-color: var(--input-bg);
  color: var(--text-primary);
  border-color: var(--border-color);
}
html body :is(input, textarea)::placeholder { color: var(--text-secondary); opacity: 1; }
html body :is(input, textarea, select):focus-visible {
  outline-color: var(--ch-accent);
  border-color: var(--ch-accent);
  box-shadow: 0 0 0 3px var(--ch-accent-soft);
}
html body :is(.primary-btn, .login-pill) {
  background: var(--btn-bg-primary) !important;
  border-color: var(--btn-bg-primary);
  color: var(--btn-text-primary) !important;
  box-shadow: none !important;
}
html body :is(.secondary-btn, .btn-secondary, .mini-btn, button.secondary,
 .desktop-sidebar-toggle, .account-menu-close) {
  background: var(--btn-bg-secondary);
  color: var(--btn-text-secondary);
  border-color: var(--border-color);
  box-shadow: none;
}
html body .sidebar nav a { color: var(--text-secondary); }
html body .sidebar nav :is(a:hover, a:focus-visible) {
  background: var(--surface-hover);
  color: var(--text-primary);
}
html body .sidebar nav a.active {
  background: var(--ch-accent-soft) !important;
  color: var(--text-primary) !important;
  border-color: transparent;
  box-shadow: none !important;
}
html body .bottom-nav a:not(.create-fab) { color: var(--text-secondary); }
html body .bottom-nav a.active:not(.create-fab) {
  background: var(--ch-accent-soft) !important;
  color: var(--text-primary) !important;
}
html body .sidebar nav a.active .sidebar-nav-icon,
html body .bottom-nav a.active .mobile-nav-icon { color: var(--ch-accent); }
html body .bottom-nav .create-fab { color: var(--text-secondary); }
html body .bottom-nav .create-fab > span {
  background: var(--btn-bg-primary) !important;
  color: var(--btn-text-primary) !important;
  border-color: var(--btn-bg-primary);
  box-shadow: none !important;
}
html body .bottom-nav .create-fab > b { color: var(--text-secondary); }
html body .chaabi-topbar-search { background: var(--input-bg); border-color: var(--border-color); }
html body .chaabi-topbar-search button { color: var(--text-secondary); }
/* Brand marks, user avatars, media overlays and semantic status colors retain
   their original rules; no blanket gradient or image removal is applied. */