:root {
  color-scheme: light;
  --yika-color-canvas: #f6f7f8;
  --yika-color-surface: #ffffff;
  --yika-color-surface-subtle: #f1f3f5;
  --yika-color-border: #dfe4e8;
  --yika-color-border-strong: #cbd3da;
  --yika-color-text: #202932;
  --yika-color-text-muted: #66727f;
  --yika-color-primary: #47637a;
  --yika-color-primary-hover: #3d566b;
  --yika-color-primary-soft: #e8eef3;
  --yika-color-focus: #5f82a0;
  --yika-color-success: #2f7659;
  --yika-color-success-soft: #e8f3ed;
  --yika-color-warning: #95651c;
  --yika-color-warning-soft: #faf1df;
  --yika-color-danger: #b24c47;
  --yika-color-danger-soft: #f9e9e7;
  --yika-radius-sm: 8px;
  --yika-radius-md: 12px;
  --yika-shadow-overlay: 0 18px 48px rgb(32 41 50 / 14%);
}

html[data-yika-theme="unified"] {
  background: var(--yika-color-canvas);
  accent-color: var(--yika-color-primary);
}

html[data-yika-theme="unified"] body {
  background-color: var(--yika-color-canvas);
  color: var(--yika-color-text);
}

html[data-yika-theme="unified"] :where(button, a, input, select, textarea, summary):focus-visible {
  outline-color: var(--yika-color-focus);
}

html[data-yika-app="design-docs"] {
  --bg: var(--yika-color-canvas);
  --panel: var(--yika-color-surface);
  --text: var(--yika-color-text);
  --muted: var(--yika-color-text-muted);
  --line: var(--yika-color-border);
  --accent: var(--yika-color-primary);
  --danger: var(--yika-color-danger);
  --ok: var(--yika-color-success);
}

html[data-yika-app="mingli"] {
  --bg: var(--yika-color-canvas);
  --surface: var(--yika-color-surface);
  --line: var(--yika-color-border);
  --line-soft: #edf0f2;
  --soft: var(--yika-color-surface-subtle);
  --text: var(--yika-color-text);
  --muted: var(--yika-color-text-muted);
  --accent: var(--yika-color-primary);
  --accent-bg: var(--yika-color-primary-soft);
  --accent-soft: var(--yika-color-primary-soft);
  --success: var(--yika-color-success);
  --warning: var(--yika-color-warning);
  --danger: var(--yika-color-danger);
}

html[data-yika-app="model-trace"] {
  --bg: var(--yika-color-canvas);
  --surface: var(--yika-color-surface);
  --surface-muted: var(--yika-color-surface-subtle);
  --text: var(--yika-color-text);
  --heading: var(--yika-color-text);
  --muted: var(--yika-color-text-muted);
  --muted-strong: #46535f;
  --line: var(--yika-color-border);
  --line-soft: #edf0f2;
  --accent: var(--yika-color-primary);
  --accent-2: var(--yika-color-primary);
  --danger: var(--yika-color-danger);
  --warn: var(--yika-color-warning);
  --ok: var(--yika-color-success);
  --focus: 0 0 0 3px rgb(95 130 160 / 22%);
}

html[data-yika-app="asr"] {
  --bg: var(--yika-color-canvas);
  --panel: var(--yika-color-surface);
  --text: var(--yika-color-text);
  --muted: var(--yika-color-text-muted);
  --line: var(--yika-color-border);
  --border: var(--yika-color-border);
  --line-soft: #edf0f2;
  --soft: var(--yika-color-surface-subtle);
  --accent: var(--yika-color-primary);
  --accent-dark: var(--yika-color-primary-hover);
  --accent-soft: var(--yika-color-primary-soft);
  --issue: var(--yika-color-danger);
  --issue-soft: var(--yika-color-danger-soft);
  --wait: var(--yika-color-warning);
  --wait-soft: var(--yika-color-warning-soft);
  --ok: var(--yika-color-success);
  --ok-soft: var(--yika-color-success-soft);
  --info: var(--yika-color-primary);
  --ins: var(--yika-color-primary);
  --ins-soft: var(--yika-color-primary-soft);
}

html[data-yika-app="consultation"] {
  --ink: var(--yika-color-text);
  --muted: var(--yika-color-text-muted);
  --line: var(--yika-color-border);
  --soft: var(--yika-color-surface-subtle);
  --paper: var(--yika-color-canvas);
  --accent: var(--yika-color-primary);
  --accent-soft: var(--yika-color-primary-soft);
  --teal: var(--yika-color-primary);
  --teal-soft: var(--yika-color-primary-soft);
  --shadow: 0 14px 36px rgb(32 41 50 / 7%);
}

html[data-yika-app="course-corpus"] {
  --ink: var(--yika-color-text);
  --muted: var(--yika-color-text-muted);
  --paper: var(--yika-color-canvas);
  --surface: var(--yika-color-surface);
  --line: var(--yika-color-border);
  --green: var(--yika-color-primary);
  --green-soft: var(--yika-color-primary-soft);
  --amber: var(--yika-color-warning);
  --amber-soft: var(--yika-color-warning-soft);
  --red: var(--yika-color-danger);
  --shadow: 0 14px 36px rgb(32 41 50 / 8%);
}

html[data-yika-app="podcast"] {
  --ink: var(--yika-color-text);
  --muted: var(--yika-color-text-muted);
  --paper: var(--yika-color-canvas);
  --panel: var(--yika-color-surface);
  --line: var(--yika-color-border);
  --line-soft: #edf0f2;
  --rust: var(--yika-color-primary);
  --rust-soft: var(--yika-color-primary-soft);
  --green: var(--yika-color-success);
  --green-soft: var(--yika-color-success-soft);
  --red: var(--yika-color-danger);
  --red-soft: var(--yika-color-danger-soft);
  --amber: var(--yika-color-warning);
  --amber-soft: var(--yika-color-warning-soft);
}

html[data-yika-app="xiaoyi"] {
  --ink: var(--yika-color-text);
  --muted: var(--yika-color-text-muted);
  --paper: var(--yika-color-canvas);
  --panel: var(--yika-color-surface-subtle);
  --line: var(--yika-color-border);
  --accent: var(--yika-color-primary);
  --accent-2: var(--yika-color-success);
  --green: var(--yika-color-success);
}

html[data-yika-app="lifa"] body:is(.bg-slate-100, .bg-gray-50) {
  background-color: var(--yika-color-canvas) !important;
  color: var(--yika-color-text) !important;
}
html[data-yika-app="lifa"] :is(.bg-slate-900, .bg-blue-600, .bg-amber-700) {
  border-color: var(--yika-color-primary) !important;
  background-color: var(--yika-color-primary) !important;
}
html[data-yika-app="lifa"] :is(.hover\:bg-slate-800:hover, .hover\:bg-blue-700:hover, .hover\:bg-amber-800:hover) {
  background-color: var(--yika-color-primary-hover) !important;
}
html[data-yika-app="lifa"] :is(.text-blue-700, .text-amber-700, .text-amber-800) {
  color: var(--yika-color-primary) !important;
}
html[data-yika-app="lifa"] :is(.border-blue-600, .focus\:border-blue-500:focus, .focus\:border-amber-600:focus) {
  border-color: var(--yika-color-primary) !important;
}
html[data-yika-app="lifa"] :is(.bg-blue-50, .bg-amber-50) {
  background-color: var(--yika-color-primary-soft) !important;
}

/* Compatibility layer for legacy pages that still carry literal brand colors. */
html[data-yika-app="design-docs"] .login {
  background: var(--yika-color-canvas);
}

html[data-yika-app="mingli"] :is(.sync-button, .job-panel, .context-note, .user .bubble) {
  border-color: var(--yika-color-border);
  background: var(--yika-color-primary-soft);
}
html[data-yika-app="mingli"] :is(.source-name, .sync-button) {
  color: var(--yika-color-primary-hover);
}

html[data-yika-app="model-trace"] :is(
  .sourceDebugCount.hasRuns,
  .sourcePill.debug,
  .status.running,
  .debugRailCurrent,
  .debugChangedField
) {
  border-color: var(--yika-color-border-strong);
  background: var(--yika-color-primary-soft);
  color: var(--yika-color-primary-hover);
}
html[data-yika-app="model-trace"] :is(
  .debugRunChanges,
  .debugRailItem.active,
  .debugRailItem.pendingRun,
  .debugRailItem.focusedRun
) {
  border-color: var(--yika-color-primary);
  background: var(--yika-color-primary-soft);
}
html[data-yika-app="model-trace"] .debugRailItem.clickable:focus-visible {
  outline-color: var(--yika-color-focus);
}
html[data-yika-app="model-trace"] .debugResultActions .primaryAction {
  border-color: var(--yika-color-primary);
  background: var(--yika-color-primary);
  color: #fff;
}
html[data-yika-app="model-trace"] .debugResultActions .primaryAction:hover {
  border-color: var(--yika-color-primary-hover);
  background: var(--yika-color-primary-hover);
}

html[data-yika-app="consultation"] .chip {
  color: var(--yika-color-primary-hover);
}

html[data-yika-app="podcast"] :is(
  th,
  tbody tr:hover,
  .audioPanel,
  .audioItem,
  .audioPending,
  .wikiDocumentHead,
  .contentText,
  .markdownBody p,
  .markdownBody blockquote,
  .markdownBody code,
  .transcriptText,
  .transcriptSegments,
  .transcriptSegment p,
  .shownotesText,
  .inlineEmpty
) {
  border-color: var(--yika-color-border);
  background: var(--yika-color-surface-subtle);
}

html[data-yika-app="xiaoyi"] :is(
  .secondary,
  .message code,
  .message th,
  .source-tabs,
  .attach-file,
  .file-type,
  .file-empty > span,
  .preview,
  .search-result:hover,
  .search-result:focus-visible,
  .file-pill,
  .global-search-dialog
) {
  border-color: var(--yika-color-border);
  background: var(--yika-color-surface-subtle);
}
html[data-yika-app="xiaoyi"] :is(.item.active, .session-item.active, .message.user, .profile > span) {
  border-color: var(--yika-color-border-strong);
  background: var(--yika-color-primary-soft);
  color: var(--yika-color-primary-hover);
}
html[data-yika-app="xiaoyi"] .danger {
  border-color: var(--yika-color-danger);
  color: var(--yika-color-danger);
}

html[data-yika-theme="unified"] .yika-console-nav-rail {
  background: var(--yika-color-surface-subtle);
  border-color: var(--yika-color-border);
}
html[data-yika-theme="unified"] .yika-console-nav-panel {
  background: var(--yika-color-surface);
  color: var(--yika-color-text);
  border-color: var(--yika-color-border);
  box-shadow: var(--yika-shadow-overlay);
}
html[data-yika-theme="unified"] .yika-console-nav-link.is-active {
  background: var(--yika-color-primary-soft);
  color: var(--yika-color-primary-hover);
  box-shadow: none;
}
html[data-yika-theme="unified"] .yika-console-nav-shortcut.is-active {
  background: #344b61;
  color: #fff;
  box-shadow: none;
}
