/*
 * KG Channel Intelligence OS V10.3 — Signature UI
 * Presentation-only visual system loaded after every inherited stylesheet.
 * It changes no business logic, network request, data contract or permission.
 */

:root {
  --kgs-radius-xs: 8px;
  --kgs-radius-sm: 11px;
  --kgs-radius-md: 15px;
  --kgs-radius-lg: 20px;
  --kgs-radius-xl: 24px;
  --kgs-motion: 180ms cubic-bezier(0.2, 0.8, 0.2, 1);
}

html[data-kg-theme="dark"] {
  color-scheme: dark;
  --kgs-canvas: #0b1525;
  --kgs-canvas-deep: #07111f;
  --kgs-sidebar: #081423;
  --kgs-surface: #122139;
  --kgs-surface-raised: #172a45;
  --kgs-surface-soft: #1b304e;
  --kgs-surface-hover: #203958;
  --kgs-surface-selected: #1b3a63;
  --kgs-border: #294463;
  --kgs-border-strong: #3b5d83;
  --kgs-text: #f7faff;
  --kgs-text-soft: #d6e0ed;
  --kgs-muted: #a9b9cc;
  --kgs-faint: #8195ad;
  --kgs-accent: #6592ff;
  --kgs-accent-strong: #3f6fe2;
  --kgs-accent-soft: #a9c2ff;
  --kgs-violet: #7059df;
  --kgs-cyan: #39c9d8;
  --kgs-success: #47d6a4;
  --kgs-warning: #f3c969;
  --kgs-danger: #ff8da0;
  --kgs-shadow:
    0 1px 0 rgba(255, 255, 255, 0.035),
    0 16px 44px rgba(1, 7, 17, 0.24);
  --kgs-shadow-raised:
    0 1px 0 rgba(255, 255, 255, 0.05),
    0 24px 70px rgba(1, 7, 17, 0.32);
  --kgs-focus: 0 0 0 3px rgba(101, 146, 255, 0.28);

  /* Keep inherited components on the same palette. */
  --ink: var(--kgs-text);
  --muted: var(--kgs-muted);
  --green: var(--kgs-accent-strong);
  --green2: var(--kgs-accent);
  --nav: var(--kgs-sidebar);
  --line: var(--kgs-border);
  --soft: var(--kgs-surface-raised);
  --white: var(--kgs-surface);
  --amber: var(--kgs-warning);
  --red: var(--kgs-danger);
  --gold: var(--kgs-violet);
  --gold2: #ad9fff;
  --bg: var(--kgs-canvas);
  --surface: var(--kgs-surface);
  --shadow: var(--kgs-shadow);
  --shadow2: var(--kgs-shadow-raised);

  --kgp-bg: var(--kgs-canvas);
  --kgp-bg-elevated: var(--kgs-canvas-deep);
  --kgp-surface: var(--kgs-surface);
  --kgp-surface-raised: var(--kgs-surface-raised);
  --kgp-surface-soft: var(--kgs-surface-soft);
  --kgp-line: var(--kgs-border);
  --kgp-line-strong: var(--kgs-border-strong);
  --kgp-text: var(--kgs-text);
  --kgp-text-soft: var(--kgs-text-soft);
  --kgp-muted: var(--kgs-muted);
  --kgp-faint: var(--kgs-faint);
  --kgp-accent: var(--kgs-accent);
  --kgp-accent-2: var(--kgs-violet);
}

html[data-kg-theme="light"] {
  color-scheme: light;
  --kgs-canvas: #f3f6fb;
  --kgs-canvas-deep: #eaf0f8;
  --kgs-sidebar: #ffffff;
  --kgs-surface: #ffffff;
  --kgs-surface-raised: #f7f9fd;
  --kgs-surface-soft: #edf3fb;
  --kgs-surface-hover: #e8f0fc;
  --kgs-surface-selected: #e7f0ff;
  --kgs-border: #d6e0ec;
  --kgs-border-strong: #bdcbdd;
  --kgs-text: #15223a;
  --kgs-text-soft: #34455d;
  --kgs-muted: #61738b;
  --kgs-faint: #7d8da2;
  --kgs-accent: #356de8;
  --kgs-accent-strong: #285bd1;
  --kgs-accent-soft: #234fae;
  --kgs-violet: #6953dc;
  --kgs-cyan: #087f91;
  --kgs-success: #0c7d5d;
  --kgs-warning: #9b6208;
  --kgs-danger: #b9364d;
  --kgs-shadow:
    0 1px 2px rgba(25, 47, 77, 0.04),
    0 14px 36px rgba(31, 53, 83, 0.08);
  --kgs-shadow-raised:
    0 2px 5px rgba(25, 47, 77, 0.05),
    0 24px 64px rgba(31, 53, 83, 0.12);
  --kgs-focus: 0 0 0 3px rgba(53, 109, 232, 0.2);

  --ink: var(--kgs-text);
  --muted: var(--kgs-muted);
  --green: var(--kgs-accent-strong);
  --green2: var(--kgs-accent);
  --nav: #173152;
  --line: var(--kgs-border);
  --soft: var(--kgs-surface-raised);
  --white: var(--kgs-surface);
  --amber: var(--kgs-warning);
  --red: var(--kgs-danger);
  --gold: var(--kgs-violet);
  --gold2: #7f69e6;
  --bg: var(--kgs-canvas);
  --surface: var(--kgs-surface);
  --shadow: var(--kgs-shadow);
  --shadow2: var(--kgs-shadow-raised);

  --kgp-bg: var(--kgs-canvas);
  --kgp-bg-elevated: var(--kgs-canvas-deep);
  --kgp-surface: var(--kgs-surface);
  --kgp-surface-raised: var(--kgs-surface-raised);
  --kgp-surface-soft: var(--kgs-surface-soft);
  --kgp-line: var(--kgs-border);
  --kgp-line-strong: var(--kgs-border-strong);
  --kgp-text: var(--kgs-text);
  --kgp-text-soft: var(--kgs-text-soft);
  --kgp-muted: var(--kgs-muted);
  --kgp-faint: var(--kgs-faint);
  --kgp-accent: var(--kgs-accent);
  --kgp-accent-2: var(--kgs-violet);
}

/* Application frame */
html,
body,
#root {
  min-height: 100%;
}

body {
  color: var(--kgs-text);
  background: var(--kgs-canvas);
  font-family:
    Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI",
    sans-serif;
  font-feature-settings:
    "cv02" 1,
    "cv03" 1,
    "cv04" 1,
    "cv11" 1;
  text-rendering: optimizeLegibility;
}

html[data-kg-theme="dark"] body {
  background:
    radial-gradient(
      circle at 70% -16%,
      rgba(101, 146, 255, 0.18),
      transparent 34%
    ),
    radial-gradient(
      circle at 42% -20%,
      rgba(140, 121, 246, 0.11),
      transparent 31%
    ),
    linear-gradient(145deg, #091423 0%, #0c182a 58%, #091423 100%);
}

html[data-kg-theme="light"] body {
  background:
    radial-gradient(
      circle at 78% -14%,
      rgba(53, 109, 232, 0.1),
      transparent 32%
    ),
    linear-gradient(145deg, #f6f8fc 0%, #eef3fa 100%);
}

.shell {
  width: 100%;
  grid-template-columns: 254px minmax(0, 1fr);
}

.mainContent {
  width: 100%;
  max-width: none;
  box-sizing: border-box;
  padding: 30px 38px 76px;
  color: var(--kgs-text);
  font-size: 14px;
  line-height: 1.58;
}

.pageHeader {
  margin-bottom: 22px;
}

.pageHeader h1 {
  margin-bottom: 5px;
  color: var(--kgs-text);
  font-size: clamp(30px, 2vw, 38px);
  font-weight: 780;
  letter-spacing: -0.035em;
  line-height: 1.12;
}

.pageHeader p {
  max-width: 980px;
  color: var(--kgs-muted) !important;
  font-size: 14px;
  line-height: 1.6;
}

.mainContent :where(h2, h3, h4, h5, h6, strong, b, label, legend, summary) {
  color: var(--kgs-text);
}

.mainContent :where(p, li, dd) {
  color: var(--kgs-text-soft);
}

.mainContent :where(small, .muted) {
  color: var(--kgs-muted);
}

.mainContent :where(.eyebrow, .sectionEyebrow) {
  color: var(--kgs-accent-soft) !important;
  font-weight: 850;
  letter-spacing: 0.11em;
}

.mainContent a:not(.button) {
  color: var(--kgs-accent-soft);
  text-underline-offset: 3px;
}

.mainContent a:not(.button):hover {
  color: var(--kgs-text);
}

/* Left navigation */
.sidebar {
  padding: 20px 14px 16px;
  border-right: 1px solid var(--kgs-border);
}

html[data-kg-theme="dark"] .sidebar {
  background:
    radial-gradient(
      circle at 16% 0%,
      rgba(101, 146, 255, 0.18),
      transparent 28%
    ),
    linear-gradient(180deg, #091728 0%, #081524 58%, #07111f 100%);
  border-right-color: rgba(86, 119, 162, 0.34);
  box-shadow: 18px 0 48px rgba(1, 7, 17, 0.2);
}

html[data-kg-theme="light"] .sidebar {
  background: rgba(255, 255, 255, 0.92);
  border-right-color: var(--kgs-border);
  box-shadow: 12px 0 34px rgba(31, 53, 83, 0.06);
  backdrop-filter: blur(18px);
}

.brand {
  padding: 1px 4px 17px;
  border-bottom-color: var(--kgs-border) !important;
}

.brandMark {
  width: 40px;
  height: 40px;
  border-radius: 13px;
  color: #fff !important;
  background: linear-gradient(145deg, #3f6fe2 0%, #7059df 100%) !important;
  box-shadow:
    inset 0 1px rgba(255, 255, 255, 0.42),
    0 12px 26px rgba(71, 120, 245, 0.28);
}

.brand b {
  color: var(--kgs-text);
  font-size: 13px;
  letter-spacing: 0.045em;
}

.brand span {
  color: var(--kgs-muted) !important;
  font-size: 10px;
  line-height: 1.38;
}

.sidebar nav {
  gap: 5px;
  margin-top: 17px;
}

.sidebar nav a,
.sidebarNavButton,
.channelNavToggle {
  min-height: 42px;
  color: var(--kgs-muted) !important;
  border: 1px solid transparent;
  border-radius: 11px;
  font-size: 13px;
  font-weight: 720;
  transition:
    color var(--kgs-motion),
    background-color var(--kgs-motion),
    border-color var(--kgs-motion),
    transform var(--kgs-motion);
}

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

.sidebar nav a.active,
.sidebarNavButton.active {
  color: #fff !important;
  border-color: rgba(117, 159, 255, 0.42) !important;
  background: linear-gradient(
    100deg,
    rgba(71, 120, 245, 0.38),
    rgba(140, 121, 246, 0.18)
  ) !important;
  box-shadow:
    inset 3px 0 #76a0ff,
    0 9px 22px rgba(1, 7, 17, 0.15) !important;
}

.navIcon {
  color: var(--kgs-accent) !important;
}

.channelNavTree {
  border-left-color: var(--kgs-border) !important;
}

.channelToolLinks a,
.allChannelsLink {
  color: var(--kgs-muted) !important;
}

.sidebarFooter {
  border-top-color: var(--kgs-border) !important;
}

.userMeta b {
  color: var(--kgs-text);
}

.userMeta span {
  color: var(--kgs-muted) !important;
}

.v10ThemeToggle {
  color: var(--kgs-text) !important;
  border-color: var(--kgs-border-strong) !important;
  background: var(--kgs-surface-raised) !important;
  box-shadow: none !important;
}

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

.v10ThemeText small {
  color: var(--kgs-muted) !important;
}

.v10ThemeIcon {
  color: #eaf1ff;
  background: linear-gradient(
    135deg,
    rgba(101, 146, 255, 0.32),
    rgba(140, 121, 246, 0.3)
  );
}

html[data-kg-theme="light"] .v10ThemeIcon {
  color: #2c5dca;
  background: linear-gradient(135deg, #e4edff, #ede9ff);
}

/* Core surface system */
.mainContent
  :where(
    .card,
    .dataTable,
    .videoCard,
    .repairCard,
    .taskCard,
    .candidateCard,
    .personRow,
    .researchSubnav,
    .candidateEvidenceDetails,
    .seoOutputBlock,
    .candidateTrendPanel,
    .postScanControls,
    .adminTabs,
    .adminSectionTabs,
    .taskDetailPanel,
    .customDateRange,
    .periodToggle,
    .v61History,
    .v983SeoDetails,
    .channelSeoHistoryList details,
    .v98PeriodBar,
    .v911ChannelChoice,
    .v912IdeaScheduler,
    .v912ProductionSchedule,
    .v983SeoPack,
    .v102ChannelProductionCard
  ) {
  color: var(--kgs-text);
  border-color: var(--kgs-border) !important;
  border-radius: var(--kgs-radius-md);
  background: var(--kgs-surface) !important;
  box-shadow: var(--kgs-shadow);
}

.mainContent
  :where(
    .softPanel,
    .copyBox,
    .transcript,
    .assetText,
    .selectedAsset,
    .taskAssignmentPanel,
    .instructionGrid section,
    .taskWorkflowGrid > section,
    .checkGrid label,
    .targetChecks label,
    .interactiveChecklist label,
    .linkedTargets > div,
    .v61ExperimentGrid > div,
    .v61SeoPack,
    .v64SeoTraceGrid > div,
    .v64SeoOutput,
    .measurementPlanCards section,
    .v64BlueprintDetails section,
    .v65RemovedList > div,
    .v82RunDetails dl > div,
    .v82JobDetails dl > div,
    .v91DailyStages > div,
    .v982CycleChannel,
    .v983SeoColumns section,
    .channelSeoSummaryGrid section,
    .v98AiGrid > div,
    .v985NextAction,
    .aiCostFacts > div
  ) {
  color: var(--kgs-text-soft);
  border-color: var(--kgs-border) !important;
  background: var(--kgs-surface-raised) !important;
  box-shadow: none;
}

.card {
  border-radius: var(--kgs-radius-lg);
}

.sectionTitle {
  margin: 28px 0 14px;
}

/* Main Today action — exact repair for the supplied screenshot */
.v985NextAction {
  position: relative;
  isolation: isolate;
  overflow: hidden;
  gap: 19px;
  margin-bottom: 16px;
  padding: 22px;
  border: 1px solid var(--kgs-border-strong) !important;
  border-radius: var(--kgs-radius-lg) !important;
  background:
    radial-gradient(
      circle at 94% -18%,
      rgba(101, 146, 255, 0.22),
      transparent 34%
    ),
    linear-gradient(
      145deg,
      var(--kgs-surface-raised),
      var(--kgs-surface)
    ) !important;
  box-shadow: var(--kgs-shadow-raised) !important;
}

.v985NextAction::before {
  position: absolute;
  z-index: -1;
  top: 0;
  right: 28px;
  left: 28px;
  height: 1px;
  background: linear-gradient(
    90deg,
    transparent,
    rgba(126, 165, 255, 0.78),
    rgba(140, 121, 246, 0.48),
    transparent
  );
  content: "";
}

.v985NextAction-info {
  border-color: rgba(101, 146, 255, 0.46) !important;
}

.v985NextAction-warning {
  border-color: rgba(243, 201, 105, 0.46) !important;
}

.v985NextAction-success {
  border-color: rgba(71, 214, 164, 0.42) !important;
}

.v985NextActionMain {
  gap: 30px;
}

.v985NextAction h2 {
  margin: 5px 0 6px;
  color: var(--kgs-text) !important;
  font-size: clamp(23px, 2vw, 30px);
  font-weight: 780;
  letter-spacing: -0.028em;
}

.v985NextAction p {
  color: var(--kgs-text-soft) !important;
}

.v985NextActionMain > button {
  min-width: 220px;
  min-height: 46px;
}

/* Daily channel selection: never allow light-mode surfaces to leak into dark. */
.v911ChannelSelection {
  display: grid;
  gap: 15px;
  padding: 16px;
  color: var(--kgs-text);
  border: 1px solid var(--kgs-border-strong) !important;
  border-radius: var(--kgs-radius-md);
  background: rgba(9, 23, 40, 0.48) !important;
  box-shadow: inset 0 1px rgba(255, 255, 255, 0.025);
}

html[data-kg-theme="light"] .v911ChannelSelection {
  background: #f7faff !important;
  box-shadow: inset 0 1px rgba(255, 255, 255, 0.8);
}

.v911ChannelSelectionHeader {
  gap: 18px;
}

.v911ChannelSelectionHeader b {
  color: var(--kgs-text) !important;
  font-size: 14px;
  font-weight: 800;
}

.v911ChannelSelectionHeader small {
  color: var(--kgs-muted) !important;
  font-size: 12px;
  line-height: 1.5;
}

.v911ChannelSelectionHeader .buttonRow {
  gap: 8px;
}

.v911ChannelSelectionGrid {
  gap: 11px;
}

.v911ChannelChoice {
  min-height: 76px;
  padding: 14px;
  color: var(--kgs-text);
  border: 1px solid var(--kgs-border) !important;
  border-radius: 13px;
  background: var(--kgs-surface-raised) !important;
  box-shadow: none !important;
  transition:
    transform var(--kgs-motion),
    background-color var(--kgs-motion),
    border-color var(--kgs-motion),
    box-shadow var(--kgs-motion);
}

.v911ChannelChoice:hover:not(.isDisabled) {
  border-color: var(--kgs-border-strong) !important;
  background: var(--kgs-surface-hover) !important;
  transform: translateY(-1px);
}

.v911ChannelChoice b {
  color: var(--kgs-text) !important;
  font-size: 13px;
}

.v911ChannelChoice small {
  color: var(--kgs-muted) !important;
  font-size: 11px;
  font-weight: 650;
}

.v911ChannelChoice.isSelected {
  border-color: rgba(101, 146, 255, 0.76) !important;
  background:
    linear-gradient(
      135deg,
      rgba(71, 120, 245, 0.2),
      rgba(57, 201, 216, 0.08)
    ),
    var(--kgs-surface-raised) !important;
  box-shadow:
    inset 3px 0 var(--kgs-accent),
    0 0 0 2px rgba(101, 146, 255, 0.1) !important;
}

.v911ChannelChoice.isPaused {
  border-color: var(--kgs-border) !important;
}

.v911ChannelChoice.isDisabled {
  opacity: 0.72;
}

.v911ChannelChoice input {
  width: 19px;
  height: 19px;
  accent-color: var(--kgs-accent-strong);
}

.v911ChannelSelectionSummary {
  color: var(--kgs-accent-soft) !important;
  font-size: 12px;
  font-weight: 800;
}

/* Four-step progress */
.v985PaidAiGuard {
  color: var(--kgs-accent-soft) !important;
  background: rgba(57, 201, 216, 0.1) !important;
  border: 1px solid rgba(57, 201, 216, 0.2);
}

.v985SimpleProgress {
  gap: 9px;
}

.v985SimpleProgress > div {
  min-height: 68px;
  color: var(--kgs-text-soft);
  border: 1px solid var(--kgs-border) !important;
  background: var(--kgs-surface-raised) !important;
}

.v985SimpleProgress > div > span {
  color: var(--kgs-text-soft);
  background: var(--kgs-surface-soft);
}

.v985SimpleProgress small {
  color: var(--kgs-muted) !important;
}

.v985SimpleProgress b {
  color: var(--kgs-text) !important;
}

.v985SimpleProgress > .isDone {
  border-color: rgba(71, 214, 164, 0.42) !important;
  background: rgba(71, 214, 164, 0.08) !important;
}

.v985SimpleProgress > .isDone > span {
  color: #071a13;
  background: var(--kgs-success) !important;
}

.v985SimpleProgress > .isActive {
  border-color: rgba(101, 146, 255, 0.55) !important;
  background: rgba(101, 146, 255, 0.1) !important;
}

.v985SimpleProgress > .isActive > span {
  color: #fff;
  background: var(--kgs-accent-strong) !important;
}

.v985SimpleProgress > .isWarning {
  border-color: rgba(243, 201, 105, 0.48) !important;
  background: rgba(243, 201, 105, 0.08) !important;
}

.v985SimpleProgress > .isWarning > span {
  color: #261a04;
  background: var(--kgs-warning) !important;
}

/* Live processing card */
.v9114LiveActivity {
  border: 1px solid var(--kgs-border-strong) !important;
  border-radius: var(--kgs-radius-lg) !important;
  background:
    radial-gradient(
      circle at 100% 0%,
      rgba(57, 201, 216, 0.13),
      transparent 34%
    ),
    linear-gradient(
      145deg,
      var(--kgs-surface-raised),
      var(--kgs-surface)
    ) !important;
  box-shadow: var(--kgs-shadow) !important;
}

.v9114LiveHeader h2 {
  color: var(--kgs-text) !important;
  font-weight: 780;
}

.v9114LiveHeader p,
.v9114LiveHeader > small,
.v9114LiveEmpty,
.v9114LiveDetail,
.v9114RunId {
  color: var(--kgs-muted) !important;
}

.v9114LiveTask {
  color: var(--kgs-text-soft);
  border-color: var(--kgs-border) !important;
  background: var(--kgs-surface-raised) !important;
}

.v9114LiveMeta > span {
  background: var(--kgs-surface-soft) !important;
}

.v9114LiveMeta small {
  color: var(--kgs-muted) !important;
}

.v9114LiveMeta b,
.v9114LiveTaskHead b {
  color: var(--kgs-text) !important;
}

.v9114LiveProgress {
  background: var(--kgs-surface-soft) !important;
}

.v9114LiveProgress > span {
  background: linear-gradient(
    90deg,
    var(--kgs-accent-strong),
    var(--kgs-cyan)
  ) !important;
}

.v9131LiveToggle {
  color: var(--kgs-text-soft) !important;
  border-color: var(--kgs-border-strong) !important;
  background: var(--kgs-surface-raised) !important;
  box-shadow: none !important;
}

.v9131LiveCollapsed {
  color: var(--kgs-muted) !important;
  border-color: var(--kgs-border) !important;
  background: rgba(101, 146, 255, 0.06) !important;
}

/* Inputs */
:where(input, select, textarea) {
  min-height: 40px;
  color: var(--kgs-text) !important;
  border: 1px solid var(--kgs-border-strong) !important;
  border-radius: var(--kgs-radius-sm);
  background: var(--kgs-surface-raised) !important;
  box-shadow: none;
}

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

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

:where(input, select, textarea):focus {
  border-color: var(--kgs-accent) !important;
  outline: none;
  box-shadow: var(--kgs-focus) !important;
}

:where(input, select, textarea):disabled {
  color: var(--kgs-faint) !important;
  background: var(--kgs-surface) !important;
  opacity: 0.74;
}

option,
optgroup {
  color: var(--kgs-text);
  background: var(--kgs-surface-raised);
}

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

/* Buttons */
:where(button, .button) {
  min-height: 40px;
  border-radius: var(--kgs-radius-sm);
  font-weight: 760;
  letter-spacing: 0;
  transition:
    transform var(--kgs-motion),
    box-shadow var(--kgs-motion),
    border-color var(--kgs-motion),
    background-color var(--kgs-motion);
}

.mainContent
  :where(button, .button):not(
    .secondary,
    .ghostDanger,
    .danger,
    .sidebarNavButton,
    .channelNavToggle,
    .v10ThemeToggle,
    .accountPasswordLink,
    [class*="Tab"],
    [class*="tab"]
  ) {
  color: #fff !important;
  border: 1px solid rgba(167, 190, 255, 0.34) !important;
  background: linear-gradient(
    135deg,
    var(--kgs-accent-strong),
    var(--kgs-violet)
  ) !important;
  box-shadow: 0 9px 22px rgba(45, 88, 202, 0.22) !important;
}

.mainContent
  :where(button, .button):not(
    .secondary,
    .ghostDanger,
    .danger,
    .sidebarNavButton,
    .channelNavToggle,
    .v10ThemeToggle,
    .accountPasswordLink,
    [class*="Tab"],
    [class*="tab"]
  ):hover:not(:disabled) {
  box-shadow: 0 13px 28px rgba(45, 88, 202, 0.3) !important;
  transform: translateY(-1px);
}

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

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

:where(button, .button).ghostDanger,
:where(button, .button).danger {
  color: var(--kgs-danger) !important;
  border-color: rgba(255, 141, 160, 0.42) !important;
  background: rgba(255, 141, 160, 0.08) !important;
  box-shadow: none !important;
}

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

:where(button, .button):disabled {
  filter: saturate(0.55);
  opacity: 0.54;
  transform: none !important;
}

/* Tabs */
:where(
    .tabs,
    .dataScanTabs,
    .adminTabs,
    .adminSectionTabs,
    .segmented,
    .periodToggle,
    .v62WorkflowNav,
    .v98PeriodBar,
    .v98DataTabs,
    .v98ScopeTabs
  ) {
  border-color: var(--kgs-border) !important;
  background: var(--kgs-surface) !important;
}

:where(
    .tabs button,
    .dataScanTabs button,
    .adminTabs button,
    .segmented button,
    .periodToggle button,
    .v98PeriodBar button,
    .v98DataTabs button,
    .v98ScopeTabs button
  ) {
  color: var(--kgs-muted) !important;
  border-color: transparent !important;
  background: transparent !important;
  box-shadow: none !important;
}

:where(
    .tabs button.active,
    .dataScanTabs button.active,
    .adminTabs button.active,
    .segmented button.active,
    .periodToggle button.active,
    .v98PeriodBar button.active,
    .v98DataTabs button.active,
    .v98ScopeTabs button.active
  ) {
  color: var(--kgs-text) !important;
  border-color: rgba(101, 146, 255, 0.36) !important;
  background: rgba(101, 146, 255, 0.16) !important;
}

.adminSectionTabs a {
  color: var(--kgs-muted) !important;
}

.adminSectionTabs a.active {
  color: var(--kgs-text) !important;
  background: rgba(101, 146, 255, 0.16) !important;
}

/* Tables */
.dataTable,
.v912IdeaTableWrap {
  overflow: auto;
  color: var(--kgs-text-soft);
  border: 1px solid var(--kgs-border) !important;
  background: var(--kgs-surface) !important;
  box-shadow: var(--kgs-shadow);
}

table {
  color: var(--kgs-text-soft);
}

th {
  color: var(--kgs-muted) !important;
  border-color: var(--kgs-border) !important;
  background: var(--kgs-surface-raised) !important;
  font-weight: 820;
}

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

tbody tr:nth-child(even) {
  background: rgba(127, 153, 186, 0.035);
}

tbody tr:hover {
  background: rgba(101, 146, 255, 0.075) !important;
}

/* Idea repository and SEO */
.v912IdeaScheduler,
.v983SeoPack {
  border-color: var(--kgs-border) !important;
  background:
    radial-gradient(
      circle at 100% 0%,
      rgba(101, 146, 255, 0.11),
      transparent 28%
    ),
    var(--kgs-surface) !important;
}

.v912BatchControls,
.v912IdeaFooter {
  border-color: var(--kgs-border) !important;
  background: var(--kgs-surface-raised) !important;
}

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

.v912IdeaTable td {
  color: var(--kgs-text-soft) !important;
  border-color: var(--kgs-border) !important;
  background: var(--kgs-surface) !important;
}

.v912IdeaTable tbody tr:nth-child(even) td {
  background: var(--kgs-surface-raised) !important;
}

.v912IdeaTable tbody tr:hover td {
  background: var(--kgs-surface-hover) !important;
}

.v912IdeaTable tbody tr.isSelected td {
  background: var(--kgs-surface-selected) !important;
}

.v912IdeaTable td b,
.v912IdeaSchedulerHead b,
.v983SeoPackHead b {
  color: var(--kgs-text) !important;
}

.v912IdeaTable td small,
.v912IdeaSchedulerHead p,
.v983SeoScopeNote {
  color: var(--kgs-muted) !important;
}

.v983SeoPreview > div,
.v983SeoDetails {
  color: var(--kgs-text-soft);
  border-color: var(--kgs-border) !important;
  background: var(--kgs-surface-raised) !important;
}

/*
 * Hardening for inherited components that contain literal light backgrounds.
 * This list is intentionally explicit so no white rectangle can reappear in
 * dark mode when these existing screens are opened.
 */
html[data-kg-theme="dark"]
  .mainContent
  :where(
    .seoPackGenerator,
    .radarTitleRecommendations,
    .candidateTrendEmpty,
    .dataScanInsufficient,
    .dataScanReferenceReviewLinks,
    .channelHero .heroMetrics > div,
    .whyNow,
    .titleChoice,
    .comparisonHead,
    .diagnosisHeadline,
    .experimentPanel,
    .checkResult,
    .sparklineWaiting,
    .metricTruthNote,
    .channelFitList > div,
    .candidateEvidenceVideos a,
    .keywordOps > summary,
    .keywordScheduleList > div,
    .v6BenchmarkRow,
    .v6DiscoveryCallout,
    .v6BriefHero,
    .v61ResearchHypothesis,
    .v62StalledNotice,
    .v65LearningExplainer,
    .v65LearningRule,
    .v65OutcomeLinkForm,
    .v62Archive,
    .v62PolicyCard,
    .portfolioFreshness,
    .v64ScriptSeo,
    .benchmarkWorkflowSteps span,
    .benchmarkReasonBox,
    .benchmarkApprovalOptions,
    .v8MarketEntryCard,
    .referenceGrowthEmpty,
    .referenceKpiGrid .publicViewKpi,
    .referenceEvidenceContract,
    .v65RemovedItems,
    .aiCostConfirmation,
    .v9OwnerGuard,
    .v91DailyRefresh,
    .v984SeoBranchSummary,
    .v982IntelligenceCycle,
    .v9Priority,
    .v9AutomationSummary,
    .v98SourceState,
    .v911ChannelSelection
  ) {
  color: var(--kgs-text-soft);
  border-color: var(--kgs-border) !important;
  background: var(--kgs-surface) !important;
  box-shadow: var(--kgs-shadow);
}

html[data-kg-theme="dark"]
  .mainContent
  :where(
    .dataScanActions button,
    .postScanContractStrip button,
    .titleChoice,
    .benchmarkApprovalOptions
  ) {
  color: var(--kgs-text-soft) !important;
}

html[data-kg-theme="dark"] .mainContent .comparisonRow:hover {
  background: var(--kgs-surface-hover) !important;
}

html[data-kg-theme="dark"] .mainContent .keywordChips.avoid span {
  color: #ffb3bf;
  border-color: rgba(255, 141, 160, 0.34) !important;
  background: rgba(255, 141, 160, 0.08) !important;
}

html[data-kg-theme="dark"]
  .mainContent
  :where(
    .checkResult.blocked,
    .titleChoice.blocked,
    .portfolioStatus.blocked,
    .v61AssignmentCard.revoked,
    .v82KeywordJobList > article.failed,
    .v61RunCard.stalled,
    .v98SourceState.error
  ) {
  color: #ffb3bf !important;
  border-color: rgba(255, 141, 160, 0.38) !important;
  background: rgba(255, 141, 160, 0.09) !important;
}

html[data-kg-theme="dark"]
  .mainContent
  :where(
    .checkResult.review,
    .portfolioStatus.review,
    .v9Priority.p10,
    .v9Priority.p20
  ) {
  color: #f7d98e !important;
  border-color: rgba(243, 201, 105, 0.38) !important;
  background: rgba(243, 201, 105, 0.09) !important;
}

/* Semantic notices */
:where(.badge, .statusPill, [class*="Badge"], [class*="Status"]) {
  border-color: var(--kgs-border);
}

:where(.badge.success, .toast, .truthBanner, .strategyBanner, .dataScanNotice) {
  color: var(--kgs-success) !important;
  border-color: rgba(71, 214, 164, 0.32) !important;
  background: rgba(71, 214, 164, 0.09) !important;
}

:where(.badge.warning, .warningBox, .dataScanDetailNotice, .v6ApprovalPanel) {
  color: var(--kgs-warning) !important;
  border-color: rgba(243, 201, 105, 0.34) !important;
  background: rgba(243, 201, 105, 0.09) !important;
}

:where(
    .badge.danger,
    .dangerPanel,
    .memberDeleteZone,
    .revisionBanner,
    .taskReversalPanel,
    .candidateExclusionNotice,
    .v65ReversalBar,
    .v9114LiveError
  ) {
  color: var(--kgs-danger) !important;
  border-color: rgba(255, 141, 160, 0.34) !important;
  background: rgba(255, 141, 160, 0.09) !important;
}

:where(.badge.info, .infoBox, .dataScanSafetyBanner) {
  color: var(--kgs-accent-soft) !important;
  border-color: rgba(101, 146, 255, 0.34) !important;
  background: rgba(101, 146, 255, 0.09) !important;
}

/* Modal and login */
.modalBackdrop,
.aiCostModalBackdrop {
  background: rgba(3, 9, 19, 0.72) !important;
  backdrop-filter: blur(8px);
}

.modal,
.aiCostConfirmation,
.loginBox.luxe,
.passwordRecoveryBox {
  color: var(--kgs-text);
  border-color: var(--kgs-border-strong) !important;
  background: var(--kgs-surface) !important;
  box-shadow: var(--kgs-shadow-raised) !important;
}

.loginBox.luxe {
  border-radius: var(--kgs-radius-xl);
}

.accountLoginForm,
.passwordRecoveryBox,
.accountLoginNotice {
  border-color: var(--kgs-border) !important;
  background: var(--kgs-surface-raised) !important;
}

/* Scrollbars */
* {
  scrollbar-color: var(--kgs-border-strong) transparent;
  scrollbar-width: thin;
}

*::-webkit-scrollbar {
  width: 10px;
  height: 10px;
}

*::-webkit-scrollbar-thumb {
  border: 2px solid transparent;
  border-radius: 999px;
  background: var(--kgs-border-strong);
  background-clip: padding-box;
}

*::-webkit-scrollbar-track {
  background: transparent;
}

/* Responsive density */
@media (max-width: 1280px) {
  .shell {
    grid-template-columns: 238px minmax(0, 1fr);
  }

  .mainContent {
    padding: 26px 26px 68px;
  }

  .v985NextActionMain {
    gap: 22px;
  }
}

@media (max-width: 920px) {
  .v985NextActionMain {
    align-items: stretch;
    flex-direction: column;
  }

  .v985NextActionMain > button {
    width: 100%;
  }

  .v985SimpleProgress {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

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

  .mainContent {
    padding: 20px 14px 56px;
  }

  .v985NextAction {
    padding: 16px;
    border-radius: 16px !important;
  }

  .v911ChannelSelection {
    padding: 13px;
  }

  .v911ChannelSelectionHeader {
    align-items: stretch;
    flex-direction: column;
  }

  .v911ChannelSelectionHeader .buttonRow {
    display: grid;
    grid-template-columns: 1fr;
  }

  .v911ChannelSelectionGrid,
  .v985SimpleProgress {
    grid-template-columns: 1fr;
  }

  .v9114LiveMeta {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

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