/*
 * KG Channel Intelligence OS V10.5 — Binance-inspired Dual Theme
 *
 * Presentation-only compatibility layer. The palette, contrast, density and
 * surface hierarchy follow the supplied Binance light/dark references while
 * preserving KG Networks branding and every inherited application contract.
 */

:root {
  --kg4-radius-control: 6px;
  --kg4-radius-card: 8px;
  --kg4-radius-panel: 10px;
  --kg4-motion: 150ms ease;
}

html[data-kg-theme="dark"] {
  color-scheme: dark;

  /* Reference palette: Binance dark. */
  --kg5-canvas: #0b0e11;
  --kg5-sidebar: #181a20;
  --kg5-surface: #181a20;
  --kg5-surface-raised: #1e2329;
  --kg5-surface-soft: #2b3139;
  --kg5-surface-hover: #2b3139;
  --kg5-surface-selected: #302d1c;
  --kg5-border: #2b3139;
  --kg5-border-strong: #474d57;
  --kg5-text: #eaecef;
  --kg5-text-soft: #b7bdc6;
  --kg5-muted: #929aa5;
  --kg5-faint: #848e9c;
  --kg5-accent: #fcd535;
  --kg5-accent-hover: #f0b90b;
  --kg5-accent-text: #1e2329;
  --kg5-accent-label: #fcd535;
  --kg5-success: #0ecb81;
  --kg5-success-text: #35dca0;
  --kg5-danger: #f6465d;
  --kg5-danger-text: #ff6b7e;
  --kg5-warning: #f0b90b;
  --kg5-warning-text: #fcd535;
  --kg5-info: #fcd535;
  --kg5-shadow: 0 1px 0 rgba(255, 255, 255, 0.025);
  --kg5-shadow-raised: 0 12px 30px rgba(0, 0, 0, 0.2);
  --kg5-focus: 0 0 0 3px rgba(252, 213, 53, 0.22);

  --kg4-canvas: var(--kg5-canvas);
  --kg4-canvas-soft: var(--kg5-canvas);
  --kg4-sidebar: var(--kg5-sidebar);
  --kg4-surface: var(--kg5-surface);
  --kg4-surface-raised: var(--kg5-surface-raised);
  --kg4-surface-soft: var(--kg5-surface-soft);
  --kg4-surface-hover: var(--kg5-surface-hover);
  --kg4-surface-selected: var(--kg5-surface-selected);
  --kg4-border: var(--kg5-border);
  --kg4-border-strong: var(--kg5-border-strong);
  --kg4-text: var(--kg5-text);
  --kg4-text-soft: var(--kg5-text-soft);
  --kg4-muted: var(--kg5-muted);
  --kg4-faint: var(--kg5-faint);
  --kg4-accent: var(--kg5-accent);
  --kg4-accent-strong: var(--kg5-accent);
  --kg4-accent-soft: var(--kg5-accent-label);
  --kg4-success: var(--kg5-success);
  --kg4-success-soft: var(--kg5-success-text);
  --kg4-warning: var(--kg5-warning-text);
  --kg4-danger: var(--kg5-danger-text);
  --kg4-info: var(--kg5-info);
  --kg4-shadow: var(--kg5-shadow);
  --kg4-shadow-raised: var(--kg5-shadow-raised);
  --kg4-focus: var(--kg5-focus);

  --kgs-canvas: var(--kg5-canvas);
  --kgs-canvas-deep: var(--kg5-canvas);
  --kgs-sidebar: var(--kg5-sidebar);
  --kgs-surface: var(--kg5-surface);
  --kgs-surface-raised: var(--kg5-surface-raised);
  --kgs-surface-soft: var(--kg5-surface-soft);
  --kgs-surface-hover: var(--kg5-surface-hover);
  --kgs-surface-selected: var(--kg5-surface-selected);
  --kgs-border: var(--kg5-border);
  --kgs-border-strong: var(--kg5-border-strong);
  --kgs-text: var(--kg5-text);
  --kgs-text-soft: var(--kg5-text-soft);
  --kgs-muted: var(--kg5-muted);
  --kgs-faint: var(--kg5-faint);
  --kgs-accent: var(--kg5-accent);
  --kgs-accent-strong: var(--kg5-accent);
  --kgs-accent-soft: var(--kg5-accent-label);
  --kgs-violet: var(--kg5-accent);
  --kgs-cyan: var(--kg5-accent);
  --kgs-success: var(--kg5-success);
  --kgs-warning: var(--kg5-warning);
  --kgs-danger: var(--kg5-danger);
  --kgs-shadow: var(--kg5-shadow);
  --kgs-shadow-raised: var(--kg5-shadow-raised);
  --kgs-focus: var(--kg5-focus);

  --kgp-bg: var(--kg5-canvas);
  --kgp-bg-elevated: var(--kg5-sidebar);
  --kgp-surface: var(--kg5-surface);
  --kgp-surface-raised: var(--kg5-surface-raised);
  --kgp-surface-soft: var(--kg5-surface-soft);
  --kgp-line: var(--kg5-border);
  --kgp-line-strong: var(--kg5-border-strong);
  --kgp-text: var(--kg5-text);
  --kgp-text-soft: var(--kg5-text-soft);
  --kgp-muted: var(--kg5-muted);
  --kgp-faint: var(--kg5-faint);
  --kgp-accent: var(--kg5-accent);
  --kgp-accent-2: var(--kg5-accent-hover);

  --ink: var(--kg5-text);
  --muted: var(--kg5-muted);
  --green: var(--kg5-accent);
  --green2: var(--kg5-accent-hover);
  --nav: var(--kg5-sidebar);
  --line: var(--kg5-border);
  --soft: var(--kg5-surface-raised);
  --white: var(--kg5-surface);
  --amber: var(--kg5-warning);
  --red: var(--kg5-danger);
  --gold: var(--kg5-accent);
  --gold2: var(--kg5-accent-hover);
  --bg: var(--kg5-canvas);
  --surface: var(--kg5-surface);
  --shadow: var(--kg5-shadow);
  --shadow2: var(--kg5-shadow-raised);
}

html[data-kg-theme="light"] {
  color-scheme: light;

  /* Reference palette: Binance light. */
  --kg5-canvas: #fafafa;
  --kg5-sidebar: #ffffff;
  --kg5-surface: #ffffff;
  --kg5-surface-raised: #f5f5f5;
  --kg5-surface-soft: #f0f1f2;
  --kg5-surface-hover: #f5f5f5;
  --kg5-surface-selected: #fff8d6;
  --kg5-border: #eaecef;
  --kg5-border-strong: #d8dce1;
  --kg5-text: #1e2329;
  --kg5-text-soft: #474d57;
  --kg5-muted: #5e6673;
  --kg5-faint: #5e6673;
  --kg5-accent: #fcd535;
  --kg5-accent-hover: #f0b90b;
  --kg5-accent-text: #1e2329;
  --kg5-accent-label: #7a5800;
  --kg5-success: #0ecb81;
  --kg5-success-text: #08795a;
  --kg5-danger: #f6465d;
  --kg5-danger-text: #c72540;
  --kg5-warning: #f0b90b;
  --kg5-warning-text: #795600;
  --kg5-info: #f0b90b;
  --kg5-shadow: 0 1px 2px rgba(30, 35, 41, 0.04);
  --kg5-shadow-raised: 0 10px 28px rgba(30, 35, 41, 0.08);
  --kg5-focus: 0 0 0 3px rgba(240, 185, 11, 0.2);

  --kg4-canvas: var(--kg5-canvas);
  --kg4-canvas-soft: var(--kg5-surface-raised);
  --kg4-sidebar: var(--kg5-sidebar);
  --kg4-surface: var(--kg5-surface);
  --kg4-surface-raised: var(--kg5-surface-raised);
  --kg4-surface-soft: var(--kg5-surface-soft);
  --kg4-surface-hover: var(--kg5-surface-hover);
  --kg4-surface-selected: var(--kg5-surface-selected);
  --kg4-border: var(--kg5-border);
  --kg4-border-strong: var(--kg5-border-strong);
  --kg4-text: var(--kg5-text);
  --kg4-text-soft: var(--kg5-text-soft);
  --kg4-muted: var(--kg5-muted);
  --kg4-faint: var(--kg5-faint);
  --kg4-accent: var(--kg5-accent);
  --kg4-accent-strong: var(--kg5-accent);
  --kg4-accent-soft: var(--kg5-accent-label);
  --kg4-success: var(--kg5-success);
  --kg4-success-soft: var(--kg5-success-text);
  --kg4-warning: var(--kg5-warning-text);
  --kg4-danger: var(--kg5-danger-text);
  --kg4-info: var(--kg5-info);
  --kg4-shadow: var(--kg5-shadow);
  --kg4-shadow-raised: var(--kg5-shadow-raised);
  --kg4-focus: var(--kg5-focus);

  --kgs-canvas: var(--kg5-canvas);
  --kgs-canvas-deep: var(--kg5-surface-raised);
  --kgs-sidebar: var(--kg5-sidebar);
  --kgs-surface: var(--kg5-surface);
  --kgs-surface-raised: var(--kg5-surface-raised);
  --kgs-surface-soft: var(--kg5-surface-soft);
  --kgs-surface-hover: var(--kg5-surface-hover);
  --kgs-surface-selected: var(--kg5-surface-selected);
  --kgs-border: var(--kg5-border);
  --kgs-border-strong: var(--kg5-border-strong);
  --kgs-text: var(--kg5-text);
  --kgs-text-soft: var(--kg5-text-soft);
  --kgs-muted: var(--kg5-muted);
  --kgs-faint: var(--kg5-faint);
  --kgs-accent: var(--kg5-accent);
  --kgs-accent-strong: var(--kg5-accent);
  --kgs-accent-soft: var(--kg5-accent-label);
  --kgs-violet: var(--kg5-accent-hover);
  --kgs-cyan: var(--kg5-accent-hover);
  --kgs-success: var(--kg5-success);
  --kgs-warning: var(--kg5-warning);
  --kgs-danger: var(--kg5-danger);
  --kgs-shadow: var(--kg5-shadow);
  --kgs-shadow-raised: var(--kg5-shadow-raised);
  --kgs-focus: var(--kg5-focus);

  --kgp-bg: var(--kg5-canvas);
  --kgp-bg-elevated: var(--kg5-surface-raised);
  --kgp-surface: var(--kg5-surface);
  --kgp-surface-raised: var(--kg5-surface-raised);
  --kgp-surface-soft: var(--kg5-surface-soft);
  --kgp-line: var(--kg5-border);
  --kgp-line-strong: var(--kg5-border-strong);
  --kgp-text: var(--kg5-text);
  --kgp-text-soft: var(--kg5-text-soft);
  --kgp-muted: var(--kg5-muted);
  --kgp-faint: var(--kg5-faint);
  --kgp-accent: var(--kg5-accent);
  --kgp-accent-2: var(--kg5-accent-hover);

  --ink: var(--kg5-text);
  --muted: var(--kg5-muted);
  --green: var(--kg5-accent);
  --green2: var(--kg5-accent-hover);
  --nav: var(--kg5-sidebar);
  --line: var(--kg5-border);
  --soft: var(--kg5-surface-raised);
  --white: var(--kg5-surface);
  --amber: var(--kg5-warning);
  --red: var(--kg5-danger);
  --gold: var(--kg5-accent);
  --gold2: var(--kg5-accent-hover);
  --bg: var(--kg5-canvas);
  --surface: var(--kg5-surface);
  --shadow: var(--kg5-shadow);
  --shadow2: var(--kg5-shadow-raised);
}

/* Flat application frame matching the supplied high-density references. */
body,
html[data-kg-theme="dark"] body,
html[data-kg-theme="light"] body {
  color: var(--kg5-text);
  background: var(--kg5-canvas) !important;
}

::selection {
  color: var(--kg5-accent-text);
  background: var(--kg5-accent);
}

* {
  scrollbar-color: var(--kg5-border-strong) var(--kg5-canvas);
}

.shell {
  grid-template-columns: 248px minmax(0, 1fr);
  background: var(--kg5-canvas) !important;
}

.mainContent {
  color: var(--kg5-text);
  background: var(--kg5-canvas) !important;
}

.pageHeader h1 {
  color: var(--kg5-text) !important;
  font-weight: 720;
}

.mainContent :where(p, li, dd, .pageHeader p, .sectionTitle p) {
  color: var(--kg5-text-soft) !important;
}

.mainContent :where(small, dt, .muted) {
  color: var(--kg5-muted) !important;
}

.mainContent :where(.eyebrow, .sectionEyebrow) {
  color: var(--kg5-accent-label) !important;
  font-weight: 760;
}

a,
.mainContent a {
  color: var(--kg5-accent-label);
}

a:hover,
.mainContent a:hover {
  color: var(--kg5-accent-hover);
}

/* Sidebar and brand */
.sidebar,
html[data-kg-theme="dark"] .sidebar,
html[data-kg-theme="light"] .sidebar {
  color: var(--kg5-text);
  border-right: 1px solid var(--kg5-border) !important;
  background: var(--kg5-sidebar) !important;
  box-shadow: none !important;
}

.brand {
  border-bottom-color: var(--kg5-border) !important;
}

.brandMark,
html[data-kg-theme="dark"] .brandMark,
html[data-kg-theme="light"] .brandMark {
  color: var(--kg5-accent-text) !important;
  border: 0 !important;
  border-radius: 6px;
  background: var(--kg5-accent) !important;
  box-shadow: none !important;
}

.brand b,
.userMeta b {
  color: var(--kg5-text) !important;
}

.brand span,
.userMeta span,
.v10ThemeText small {
  color: var(--kg5-muted) !important;
}

.sidebar nav a,
.sidebarNavButton,
.channelNavToggle {
  color: var(--kg5-muted) !important;
  border: 0 !important;
  border-radius: 6px !important;
}

.sidebar nav a:hover,
.sidebarNavButton:hover,
.channelNavToggle:hover {
  color: var(--kg5-text) !important;
  background: var(--kg5-surface-raised) !important;
}

.sidebar nav a.active,
.sidebarNavButton.active {
  color: var(--kg5-text) !important;
  border: 0 !important;
  background: var(--kg5-surface-selected) !important;
  box-shadow: inset 3px 0 var(--kg5-accent) !important;
}

.navIcon,
.channelNavCaret,
.v10ThemeIcon {
  color: var(--kg5-accent-label) !important;
}

.channelNavTree,
.sidebarFooter {
  border-color: var(--kg5-border) !important;
}

.v10ThemeToggle,
html[data-kg-theme="dark"] .v10ThemeToggle,
html[data-kg-theme="light"] .v10ThemeToggle {
  color: var(--kg5-text) !important;
  border: 1px solid var(--kg5-border) !important;
  border-radius: 6px !important;
  background: var(--kg5-surface-raised) !important;
  box-shadow: none !important;
}

.v10ThemeToggle:hover {
  border-color: var(--kg5-accent-hover) !important;
  background: var(--kg5-surface-hover) !important;
}

.v10ThemeIcon {
  background: var(--kg5-surface-soft) !important;
}

.v10ThemeSwitch {
  border-color: var(--kg5-border-strong) !important;
  background: var(--kg5-border-strong) !important;
}

.v10ThemeSwitch.isDark,
.v10ThemeSwitch.isLight {
  background: var(--kg5-accent) !important;
}

.v10ThemeSwitch i {
  background: var(--kg5-accent-text) !important;
}

/* Flat cards, panels and tables */
.mainContent
  :where(
    .card,
    .dataTable,
    .videoCard,
    .repairCard,
    .taskCard,
    .candidateCard,
    .postScanControls,
    .researchSubnav,
    .adminTabs,
    .adminSectionTabs,
    .taskDetailPanel,
    .v912IdeaScheduler,
    .v912ProductionSchedule,
    .v983SeoPack,
    .v98DataSurface > .sectionTitle:first-child,
    .v9114LiveActivity,
    .v91DailyRefresh,
    .v982IntelligenceCycle,
    .v9OwnerGuard
  ) {
  color: var(--kg5-text);
  border: 1px solid var(--kg5-border) !important;
  border-radius: var(--kg4-radius-card) !important;
  background: var(--kg5-surface) !important;
  box-shadow: var(--kg5-shadow) !important;
}

.v985NextAction {
  color: var(--kg5-text);
  border: 1px solid var(--kg5-border) !important;
  border-radius: var(--kg4-radius-panel) !important;
  background: var(--kg5-surface) !important;
  box-shadow: var(--kg5-shadow) !important;
}

.v985NextAction::before {
  height: 2px !important;
  background: var(--kg5-accent) !important;
  opacity: 1;
}

/* Form controls */
:where(input, select, textarea),
html[data-kg-theme="dark"] :where(input, select, textarea),
html[data-kg-theme="light"] :where(input, select, textarea) {
  color: var(--kg5-text) !important;
  border: 1px solid var(--kg5-border-strong) !important;
  border-radius: var(--kg4-radius-control) !important;
  background: var(--kg5-surface) !important;
  box-shadow: none !important;
}

html[data-kg-theme="dark"] :where(input, select, textarea) {
  background: var(--kg5-surface-raised) !important;
}

:where(input, textarea)::placeholder {
  color: var(--kg5-faint) !important;
  opacity: 1;
}

:where(input, select, textarea):hover:not(:disabled),
:where(input, select, textarea):focus {
  border-color: var(--kg5-accent-hover) !important;
}

:where(input, select, textarea):focus,
:where(button, .button):focus-visible,
a:focus-visible,
summary:focus-visible,
label:has(input:focus-visible) {
  outline: none;
  box-shadow: var(--kg5-focus) !important;
}

input[type="checkbox"],
input[type="radio"] {
  accent-color: var(--kg5-accent-hover);
}

/* Primary, secondary and destructive actions */
.mainContent
  :where(button, .button):not(
    .secondary,
    .ghostDanger,
    .danger,
    .sidebarNavButton,
    .channelNavToggle,
    .v10ThemeToggle,
    .accountPasswordLink,
    .v9131LiveToggle
  ),
.accountLoginForm > button,
.passwordRecoveryBox > button {
  color: var(--kg5-accent-text) !important;
  border: 1px solid var(--kg5-accent) !important;
  border-radius: var(--kg4-radius-control) !important;
  background: var(--kg5-accent) !important;
  box-shadow: none !important;
}

.mainContent
  :where(button, .button):not(
    .secondary,
    .ghostDanger,
    .danger,
    .sidebarNavButton,
    .channelNavToggle,
    .v10ThemeToggle,
    .accountPasswordLink,
    .v9131LiveToggle
  ):hover:not(:disabled),
.accountLoginForm > button:hover:not(:disabled),
.passwordRecoveryBox > button:hover:not(:disabled) {
  color: var(--kg5-accent-text) !important;
  border-color: var(--kg5-accent-hover) !important;
  background: var(--kg5-accent-hover) !important;
  box-shadow: none !important;
  transform: none;
}

:where(button, .button).secondary,
.secondary,
.globalBackButton,
.youtubeDirectLink,
.secondaryLink,
.v9131LiveToggle,
.accountPasswordLink {
  color: var(--kg5-text-soft) !important;
  border: 1px solid var(--kg5-border-strong) !important;
  background: var(--kg5-surface-raised) !important;
  box-shadow: none !important;
}

:where(button, .button).secondary:hover:not(:disabled),
.globalBackButton:hover,
.youtubeDirectLink:hover,
.secondaryLink:hover,
.v9131LiveToggle:hover,
.accountPasswordLink:hover {
  color: var(--kg5-text) !important;
  border-color: var(--kg5-accent-hover) !important;
  background: var(--kg5-surface-hover) !important;
}

:where(button, .button).danger,
:where(button, .button).ghostDanger,
.danger,
.ghostDanger {
  color: #ffffff !important;
  border-color: var(--kg5-danger) !important;
  background: var(--kg5-danger) !important;
  box-shadow: none !important;
}

:where(button, .button):disabled {
  color: var(--kg5-faint) !important;
  border-color: var(--kg5-border) !important;
  background: var(--kg5-surface-soft) !important;
  opacity: 0.72;
}

/* Today, selection and operating flow */
.v911ChannelSelection,
.v911ChannelChoice,
.v985SimpleProgress > div,
.v985SimpleProgress > div > span,
.v9131LiveCollapsed,
.v982OperatingFlow > span,
.v982OperatingFlow > div,
.v91DailyStages > div,
.v984SeoBranchSummary {
  color: var(--kg5-text-soft) !important;
  border-color: var(--kg5-border) !important;
  background: var(--kg5-surface-raised) !important;
  box-shadow: none !important;
}

.v911ChannelChoice:hover:not(.isDisabled) {
  border-color: var(--kg5-border-strong) !important;
  background: var(--kg5-surface-hover) !important;
}

.v911ChannelChoice.isSelected {
  border-color: var(--kg5-accent-hover) !important;
  background: var(--kg5-surface-selected) !important;
  box-shadow: inset 3px 0 var(--kg5-accent) !important;
}

.v911ChannelChoice b,
.v985SimpleProgress b,
.v9114LiveActivity b {
  color: var(--kg5-text) !important;
}

.v911ChannelChoice small,
.v911ChannelSelectionHeader small,
.v985SimpleProgress small,
.v9114LiveHeader p,
.v9114LiveHeader > small,
.v9114LiveEmpty,
.v9114LiveDetail,
.v9114RunId,
.v9131LiveCollapsed {
  color: var(--kg5-muted) !important;
}

.v911ChannelSelectionSummary,
.v985PaidAiGuard {
  color: var(--kg5-accent-label) !important;
}

.v985PaidAiGuard {
  border-color: color-mix(
    in srgb,
    var(--kg5-accent) 45%,
    var(--kg5-border)
  ) !important;
  background: var(--kg5-surface-selected) !important;
}

.v985SimpleProgress > .isDone {
  border-color: color-mix(
    in srgb,
    var(--kg5-success) 55%,
    var(--kg5-border)
  ) !important;
  background: color-mix(
    in srgb,
    var(--kg5-success) 7%,
    var(--kg5-surface)
  ) !important;
}

.v985SimpleProgress > .isDone > span {
  color: #0b0e11 !important;
  background: var(--kg5-success) !important;
}

.v985SimpleProgress > .isActive {
  border-color: var(--kg5-accent-hover) !important;
  background: var(--kg5-surface-selected) !important;
}

.v985SimpleProgress > .isActive > span {
  color: var(--kg5-accent-text) !important;
  background: var(--kg5-accent) !important;
}

.v982OperatingFlow > div {
  border-color: color-mix(
    in srgb,
    var(--kg5-success) 48%,
    var(--kg5-border)
  ) !important;
  background: color-mix(
    in srgb,
    var(--kg5-success) 6%,
    var(--kg5-surface)
  ) !important;
}

/* Metric cards, tabs and tables */
.postScanContractStrip button,
.mainContent .postScanContractStrip button {
  color: var(--kg5-text) !important;
  border: 1px solid var(--kg5-border) !important;
  background: var(--kg5-surface) !important;
  box-shadow: none !important;
}

.postScanContractStrip button:hover {
  border-color: var(--kg5-border-strong) !important;
  background: var(--kg5-surface-hover) !important;
}

.postScanContractStrip button.active {
  border-color: var(--kg5-accent-hover) !important;
  background: var(--kg5-surface-selected) !important;
  box-shadow: inset 0 3px var(--kg5-accent) !important;
}

.postScanContractStrip strong {
  color: var(--kg5-accent-label) !important;
}

.postScanContractStrip span {
  color: var(--kg5-text-soft) !important;
}

.dataScanTabs,
.postScanTabs,
.v98DataTabs,
.v98ScopeTabs,
.v98PeriodBar,
.periodToggle,
.tabs {
  border-color: var(--kg5-border) !important;
  background: var(--kg5-surface) !important;
  box-shadow: none !important;
}

.dataScanTabs button,
.postScanTabs button,
.v98DataTabs button,
.v98ScopeTabs button,
.v98PeriodBar button,
.periodToggle button,
.tabs button,
.mainContent .dataScanTabs button,
.mainContent .postScanTabs button,
.mainContent .v98DataTabs button,
.mainContent .v98ScopeTabs button,
.mainContent .v98PeriodBar button {
  color: var(--kg5-muted) !important;
  border: 0 !important;
  border-radius: 4px !important;
  background: transparent !important;
  box-shadow: none !important;
}

.dataScanTabs button:hover,
.postScanTabs button:hover,
.v98DataTabs button:hover,
.v98ScopeTabs button:hover,
.v98PeriodBar button:hover,
.periodToggle button:hover,
.tabs button:hover {
  color: var(--kg5-text) !important;
  background: var(--kg5-surface-hover) !important;
}

.dataScanTabs button.active,
.postScanTabs button.active,
.v98DataTabs button.active,
.v98ScopeTabs button.active,
.v98PeriodBar button.active,
.periodToggle button.active,
.tabs button.active,
.mainContent .dataScanTabs button.active,
.mainContent .postScanTabs button.active,
.mainContent .v98DataTabs button.active,
.mainContent .v98ScopeTabs button.active,
.mainContent .v98PeriodBar button.active {
  color: var(--kg5-text) !important;
  border: 0 !important;
  background: var(--kg5-surface-selected) !important;
  box-shadow: inset 0 -2px var(--kg5-accent) !important;
}

.v98FactGrid .card,
.v98SectionCard,
.v98CoverageCard,
.v98DataSurface > .sectionTitle:first-child,
.postScanControls {
  color: var(--kg5-text);
  border-color: var(--kg5-border) !important;
  background: var(--kg5-surface) !important;
  box-shadow: none !important;
}

.v98DailyChart,
.v98BarChart,
.v98MixChart,
.v98RetentionGrid > div,
.v98StructuredFacts,
.v98SourceState,
.v98InlineLoading,
.postScanSelectionMeta {
  color: var(--kg5-text-soft) !important;
  border-color: var(--kg5-border) !important;
  background: var(--kg5-surface-raised) !important;
}

.dataTable,
.v912IdeaTableWrap,
table {
  color: var(--kg5-text-soft);
  border-color: var(--kg5-border) !important;
  background: var(--kg5-surface) !important;
  box-shadow: none !important;
}

th {
  color: var(--kg5-muted) !important;
  border-color: var(--kg5-border) !important;
  background: var(--kg5-surface-raised) !important;
}

td {
  color: var(--kg5-text-soft) !important;
  border-color: var(--kg5-border) !important;
  background: transparent !important;
}

tbody tr:nth-child(even) {
  background: color-mix(
    in srgb,
    var(--kg5-surface-raised) 58%,
    transparent
  );
}

tbody tr:hover {
  background: var(--kg5-surface-selected) !important;
}

/* Ideas, login, modals and semantic states */
.v912IdeaScheduler,
.v983SeoPack,
.v912ProductionSchedule,
.modal,
.aiCostConfirmation,
.loginBox.luxe,
.passwordRecoveryBox {
  color: var(--kg5-text);
  border-color: var(--kg5-border-strong) !important;
  background: var(--kg5-surface) !important;
  box-shadow: var(--kg5-shadow-raised) !important;
}

.v912BatchControls,
.v912IdeaFooter,
.v983SeoPreview > div,
.v983SeoDetails,
.accountLoginForm,
.passwordRecoveryBox,
.accountLoginNotice {
  color: var(--kg5-text-soft);
  border-color: var(--kg5-border) !important;
  background: var(--kg5-surface-raised) !important;
}

.loginShell,
html[data-kg-theme="dark"] .loginShell,
html[data-kg-theme="light"] .loginShell {
  color: var(--kg5-text);
  background: var(--kg5-canvas) !important;
}

.loginBox.luxe::before {
  background: var(--kg5-accent) !important;
}

.loginBox :where(h1, h2, h3, strong, label) {
  color: var(--kg5-text) !important;
}

.loginBox :where(p, small, .muted) {
  color: var(--kg5-muted) !important;
}

/*
 * High-specificity reset for legacy V10.1–V10.3 selectors that were written
 * with theme-qualified navy/blue gradients.
 */
html[data-kg-theme="dark"]
  .mainContent
  :is(
    .v912IdeaScheduler,
    .v912ProductionSchedule,
    .v912ScheduleGroup,
    .v983SeoPack,
    .v982KeywordList,
    .v983SeoScopeNote,
    .personRow,
    .candidateEvidenceDetails,
    .seoOutputBlock,
    .candidateTrendPanel,
    .taskDetailPanel
  ),
html[data-kg-theme="light"]
  .mainContent
  :is(
    .v912IdeaScheduler,
    .v912ProductionSchedule,
    .v912ScheduleGroup,
    .v983SeoPack,
    .v982KeywordList,
    .v983SeoScopeNote,
    .personRow,
    .candidateEvidenceDetails,
    .seoOutputBlock,
    .candidateTrendPanel,
    .taskDetailPanel
  ) {
  color: var(--kg5-text) !important;
  border-color: var(--kg5-border) !important;
  background: var(--kg5-surface) !important;
  box-shadow: var(--kg5-shadow) !important;
}

html[data-kg-theme="dark"] .v912IdeaScheduler::before,
html[data-kg-theme="light"] .v912IdeaScheduler::before {
  background: var(--kg5-accent) !important;
  opacity: 1;
}

html[data-kg-theme="dark"]
  :is(.loginBox.luxe, .passwordRecoveryBox, .modal, .aiCostConfirmation),
html[data-kg-theme="light"]
  :is(.loginBox.luxe, .passwordRecoveryBox, .modal, .aiCostConfirmation) {
  color: var(--kg5-text) !important;
  border-color: var(--kg5-border-strong) !important;
  background: var(--kg5-surface) !important;
  box-shadow: var(--kg5-shadow-raised) !important;
}

/* Channel proposal cards use the same palette as Today and production tasks. */
.v102SyncNotice,
html[data-kg-theme="dark"] .v102SyncNotice,
html[data-kg-theme="light"] .v102SyncNotice {
  color: var(--kg5-success-text) !important;
  border-color: color-mix(
    in srgb,
    var(--kg5-success) 45%,
    var(--kg5-border)
  ) !important;
  background: color-mix(
    in srgb,
    var(--kg5-success) 7%,
    var(--kg5-surface)
  ) !important;
}

.v102SyncNotice b,
html[data-kg-theme="dark"] .v102SyncNotice b,
html[data-kg-theme="light"] .v102SyncNotice b {
  color: var(--kg5-success-text) !important;
}

.v102SyncNotice span,
html[data-kg-theme="dark"] .v102SyncNotice span,
html[data-kg-theme="light"] .v102SyncNotice span {
  color: var(--kg5-text-soft) !important;
}

.v102ChannelProductionCard,
html[data-kg-theme="dark"] .v102ChannelProductionCard,
html[data-kg-theme="light"] .v102ChannelProductionCard {
  color: var(--kg5-text);
  border-color: var(--kg5-border) !important;
  border-radius: var(--kg4-radius-card) !important;
  background: var(--kg5-surface) !important;
  box-shadow: var(--kg5-shadow) !important;
}

.v102ChannelProductionCard.cancelled,
html[data-kg-theme="dark"] .v102ChannelProductionCard.cancelled,
html[data-kg-theme="light"] .v102ChannelProductionCard.cancelled {
  border-color: color-mix(
    in srgb,
    var(--kg5-danger) 45%,
    var(--kg5-border)
  ) !important;
  background: color-mix(
    in srgb,
    var(--kg5-danger) 5%,
    var(--kg5-surface)
  ) !important;
}

.v102ProductionTop {
  border-bottom-color: var(--kg5-border) !important;
}

.v102ProductionTop h2,
.v102ConfirmedTitle h3,
html[data-kg-theme="light"] .v102ProductionTop h2,
html[data-kg-theme="light"] .v102ConfirmedTitle h3 {
  color: var(--kg5-text) !important;
}

.v102ProductionTop p,
.v102ConfirmedTitle p,
.v102SeoGrid p,
.v102Variants li,
.v102ProductionDetails,
html[data-kg-theme="light"] .v102ProductionTop p,
html[data-kg-theme="light"] .v102ConfirmedTitle p,
html[data-kg-theme="light"] .v102SeoGrid p,
html[data-kg-theme="light"] .v102Variants li,
html[data-kg-theme="light"] .v102ProductionDetails {
  color: var(--kg5-text-soft) !important;
}

.v102ProductionMeta > div,
.v102SeoGrid section,
.v102ProductionDetails,
html[data-kg-theme="light"] .v102ProductionMeta > div,
html[data-kg-theme="light"] .v102SeoGrid section,
html[data-kg-theme="light"] .v102ProductionDetails {
  color: var(--kg5-text-soft) !important;
  border-color: var(--kg5-border) !important;
  background: var(--kg5-surface-raised) !important;
}

.v102ProductionMeta span,
.v102ConfirmedTitle > span,
.v102SeoGrid span,
.v102Variants > span,
html[data-kg-theme="light"] .v102ProductionMeta span,
html[data-kg-theme="light"] .v102SeoGrid span {
  color: var(--kg5-muted) !important;
}

.v102ProductionMeta b,
.v102SeoGrid b,
.v102ProductionDetails summary,
html[data-kg-theme="light"] .v102ProductionMeta b,
html[data-kg-theme="light"] .v102SeoGrid b,
html[data-kg-theme="light"] .v102ProductionDetails summary {
  color: var(--kg5-text) !important;
}

.v102ConfirmedTitle,
html[data-kg-theme="dark"] .v102ConfirmedTitle,
html[data-kg-theme="light"] .v102ConfirmedTitle {
  color: var(--kg5-text);
  border-color: color-mix(
    in srgb,
    var(--kg5-success) 48%,
    var(--kg5-border)
  ) !important;
  background: color-mix(
    in srgb,
    var(--kg5-success) 6%,
    var(--kg5-surface)
  ) !important;
}

.v102ConfirmedTitle > span,
html[data-kg-theme="light"] .v102ConfirmedTitle > span {
  color: var(--kg5-success-text) !important;
}

.v102Variants,
html[data-kg-theme="light"] .v102Variants {
  color: var(--kg5-text-soft) !important;
  border-color: var(--kg5-border) !important;
  background: var(--kg5-surface-raised) !important;
}

.v102CancelReason,
html[data-kg-theme="light"] .v102CancelReason {
  border-color: color-mix(
    in srgb,
    var(--kg5-danger) 45%,
    var(--kg5-border)
  ) !important;
  background: color-mix(
    in srgb,
    var(--kg5-danger) 7%,
    var(--kg5-surface)
  ) !important;
}

.v102CancelReason b,
html[data-kg-theme="light"] .v102CancelReason b {
  color: var(--kg5-danger-text) !important;
}

.v102CancelReason span,
html[data-kg-theme="light"] .v102CancelReason span {
  color: var(--kg5-text-soft) !important;
}

:where(.badge, .statusPill, [class*="Badge"], [class*="Status"]) {
  border-color: var(--kg5-border);
  border-radius: 4px !important;
}

:where(.badge.success, .toast, .truthBanner, .strategyBanner, .dataScanNotice) {
  color: var(--kg5-success-text) !important;
  border-color: color-mix(
    in srgb,
    var(--kg5-success) 45%,
    var(--kg5-border)
  ) !important;
  background: color-mix(
    in srgb,
    var(--kg5-success) 7%,
    var(--kg5-surface)
  ) !important;
}

:where(.badge.warning, .warningBox, .dataScanDetailNotice, .v6ApprovalPanel) {
  color: var(--kg5-warning-text) !important;
  border-color: color-mix(
    in srgb,
    var(--kg5-warning) 48%,
    var(--kg5-border)
  ) !important;
  background: var(--kg5-surface-selected) !important;
}

:where(
  .badge.danger,
  .dangerPanel,
  .revisionBanner,
  .candidateExclusionNotice,
  .v9114LiveError
) {
  color: var(--kg5-danger-text) !important;
  border-color: color-mix(
    in srgb,
    var(--kg5-danger) 45%,
    var(--kg5-border)
  ) !important;
  background: color-mix(
    in srgb,
    var(--kg5-danger) 7%,
    var(--kg5-surface)
  ) !important;
}

:where(.badge.info, .infoBox, .dataScanSafetyBanner) {
  color: var(--kg5-accent-label) !important;
  border-color: color-mix(
    in srgb,
    var(--kg5-accent) 45%,
    var(--kg5-border)
  ) !important;
  background: var(--kg5-surface-selected) !important;
}

/* Light-mode text uses darker semantic variants while retaining exact fills. */
html[data-kg-theme="light"] .postScanContractStrip strong,
html[data-kg-theme="light"] .mainContent :where(.eyebrow, .sectionEyebrow),
html[data-kg-theme="light"] .v911ChannelSelectionSummary,
html[data-kg-theme="light"] .v985PaidAiGuard {
  color: var(--kg5-accent-label) !important;
}

html[data-kg-theme="light"] .sidebar {
  box-shadow: none !important;
}

html[data-kg-theme="light"] .v911ChannelChoice.isSelected,
html[data-kg-theme="light"] .postScanContractStrip button.active {
  background: var(--kg5-surface-selected) !important;
}

/* Dark-mode guard against inherited white and blue surfaces. */
html[data-kg-theme="dark"]
  .mainContent
  :where(
    .postScanContractStrip button,
    .v982OperatingFlow > span,
    .v982OperatingFlow > div,
    .v91DailyStages > div,
    .v98DailyChart,
    .v98BarChart,
    .v98MixChart,
    .v98SourceState,
    .v98InlineLoading,
    .v98FactGrid .card,
    .v98DataSurface > .sectionTitle:first-child,
    .postScanControls,
    .postScanSelectionMeta
  ) {
  color: var(--kg5-text-soft);
  border-color: var(--kg5-border) !important;
  background: var(--kg5-surface-raised) !important;
}

@media (max-width: 1280px) {
  .shell {
    grid-template-columns: 230px minmax(0, 1fr);
  }
}

@media (max-width: 760px) {
  .shell {
    grid-template-columns: 1fr;
  }

  .sidebar {
    border-right: 0 !important;
    border-bottom: 1px solid var(--kg5-border) !important;
  }
}

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