:root {
  --paper: #ffffff;
  --sidebar: #f7f8fa;
  --surface: #ffffff;
  --surface-solid: #ffffff;
  --surface-muted: #f1f3f4;
  --ink: #1f1f1f;
  --muted: #5f6368;
  --muted-soft: #5f6368;
  --line: rgba(31, 31, 31, 0.12);
  --line-strong: rgba(31, 31, 31, 0.2);
  --olive: #0a66e8;
  --blue-gray: #0a66e8;
  --rust: #34a853;
  --danger: #d93025;
  --focus-ring: rgba(10, 102, 232, 0.28);
  --shadow-xs: none;
  --shadow-sm: none;
  --shadow-md: none;
  --shadow-lg: none;

  --apple-paper: #ffffff;
  --apple-sidebar: #f7f8fa;
  --apple-surface: #ffffff;
  --apple-surface-solid: #ffffff;
  --apple-surface-muted: #f1f3f4;
  --apple-ink: #1f1f1f;
  --apple-muted: #5f6368;
  --apple-muted-soft: #5f6368;
  --apple-line: rgba(31, 31, 31, 0.12);
  --apple-line-strong: rgba(31, 31, 31, 0.2);
  --apple-olive: #0a66e8;
  --apple-blue: #0a66e8;
  --apple-rust: #34a853;
  --apple-danger: #d93025;
  --apple-focus: rgba(10, 102, 232, 0.28);
  --apple-shadow-xs: none;
  --apple-shadow-sm: none;
  --apple-shadow-md: none;
  --apple-shadow-lg: none;

  --bg: #ffffff;
  --surface-strong: #e8eaed;
  --frame: rgba(31, 31, 31, 0.14);
  --hero-bg: #ffffff;
  --hero-bg-2: #ffffff;
  --accent: #0a66e8;
  --accent-strong: #0a66e8;
  --accent-soft: rgba(10, 102, 232, 0.1);
  --signal-speed: #0a66e8;
  --signal-vibration: #34a853;
  --shadow: none;

  /* Shared workbench typography: primary, secondary, tertiary. */
  --page-font: -apple-system, BlinkMacSystemFont, "SF Pro Text", "Helvetica Neue", "PingFang SC", "Microsoft YaHei", sans-serif;
  --page-font-display: -apple-system, BlinkMacSystemFont, "SF Pro Display", "Helvetica Neue", "PingFang SC", "Microsoft YaHei", sans-serif;
  --page-text-primary: var(--ink);
  --page-text-secondary: var(--muted);
  --page-text-tertiary: var(--muted-soft);
  --page-title-size: clamp(1.75rem, 3vw, 2.35rem);
  --page-title-weight: 600;
  --page-section-size: 1rem;
  --page-section-weight: 600;
  --page-body-size: 0.92rem;
  --page-body-weight: 400;
  --page-meta-size: 0.76rem;
  --page-meta-weight: 500;
}

::selection {
  color: var(--ink);
  background: rgba(10, 102, 232, 0.16);
}

body,
body.tofu-demo-body,
.api-docs-body,
.demo-page-body {
  color: var(--ink) !important;
  background: #ffffff !important;
}

.home-sidebar,
.app-sidebar,
.api-docs-sidebar {
  border-color: var(--line) !important;
  background: #f7f8fa !important;
  box-shadow: none !important;
}

.home-main,
.app-topbar,
.api-docs-topbar {
  background: #ffffff !important;
  box-shadow: none !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
}

.tinker-brand:hover,
.sample-nav-item:hover,
.nav-item:hover,
.api-docs-sidebar a:hover {
  background: #f1f3f4 !important;
}

.sample-nav-item.active,
.nav-item.active {
  border-color: transparent !important;
  color: var(--ink) !important;
  background: #e8f0fe !important;
  box-shadow: none !important;
}

.nav-item-icon,
.mark-face,
.model-mode-toggle,
.panel-kicker,
.section-kicker,
.intro-kicker {
  color: var(--olive) !important;
}

.tinker-brand-mark,
.brand-mark,
.hero-brand-mark {
  border-color: var(--line) !important;
  background: #ffffff !important;
  box-shadow: none !important;
}

.hero-brand-mark::after,
body.tofu-demo-body .hero::after {
  border-color: transparent !important;
  box-shadow: none !important;
}

.mark-face {
  text-shadow: none !important;
}

.mark-dot {
  background: #34a853 !important;
  box-shadow: none !important;
}

.sample-card:hover,
.sample-card:focus-visible {
  background: #f1f3f4 !important;
  box-shadow: none !important;
}

.sample-card:active {
  background: #e8eaed !important;
}

.home-chat-message-user,
.home-chat-message-file,
.home-chat-attachment {
  border-color: var(--line) !important;
  color: var(--muted) !important;
  background: #f1f3f4 !important;
  box-shadow: none !important;
}

.home-model-trigger {
  color: var(--muted) !important;
}

.home-composer {
  border-color: #dadce0 !important;
  background: #ffffff !important;
  box-shadow: 0 2px 8px rgba(31, 31, 31, 0.06) !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
}

.home-composer:focus-within {
  border-color: #dadce0 !important;
  background: #ffffff !important;
  box-shadow: 0 2px 8px rgba(31, 31, 31, 0.06) !important;
}

.home-composer-add,
.home-model-trigger,
.home-voice {
  color: var(--muted) !important;
}

.home-composer textarea::placeholder {
  color: rgba(95, 99, 104, 0.62) !important;
  opacity: 1;
}

.home-composer-add:hover,
.home-model-trigger:hover,
.home-model-picker.is-open .home-model-trigger,
.home-model-option:hover,
.home-model-option:focus-visible,
.home-voice:hover,
.home-chat-attachment button:hover {
  background: #f1f3f4 !important;
}

.home-model-menu,
.industrial-example-list {
  border-color: var(--line) !important;
  background: #ffffff !important;
  box-shadow: none !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
}

.home-model-option svg {
  stroke: var(--olive) !important;
}

.home-voice.is-listening {
  color: #ffffff !important;
  background: #34a853 !important;
  box-shadow: none !important;
}

.home-send:not(:disabled),
.industrial-analyze-button:not(:disabled),
.intro-confirm {
  border-color: #0a66e8 !important;
  color: #ffffff !important;
  background: #0a66e8 !important;
  box-shadow: none !important;
}

.home-send:not(:disabled):hover,
.industrial-analyze-button:hover:not(:disabled),
.intro-confirm:hover {
  background: #0959ca !important;
  box-shadow: none !important;
}

.home-send:disabled,
.industrial-analyze-button:disabled {
  border-color: #e8eaed !important;
  color: var(--muted) !important;
  background: #e8eaed !important;
  box-shadow: none !important;
}

.industrial-panel,
.industrial-selector,
.industrial-result-image,
.manual-selector,
.manual-panel,
.api-docs-title,
.api-doc-section,
body.tofu-demo-body .hero,
body.tofu-demo-body .panel,
.demo-page-body .demo-page-panel {
  border-color: var(--line) !important;
  background: #ffffff !important;
  box-shadow: none !important;
}

.industrial-dropzone,
.industrial-result-empty,
.manual-video-placeholder,
.dropzone {
  border-color: var(--line) !important;
  color: var(--muted) !important;
  background: #f7f8fa !important;
  box-shadow: none !important;
}

/* The source-image preview is a neutral canvas, not a muted control surface. */
.industrial-input-preview {
  border-color: var(--line) !important;
  color: var(--muted) !important;
  background: #ffffff !important;
  box-shadow: none !important;
}

.industrial-dropzone:hover,
.industrial-dropzone.dragover,
.dropzone:hover,
.dropzone.dragover {
  border-color: var(--olive) !important;
  color: var(--ink) !important;
  background: #eef4ff !important;
  box-shadow: none !important;
}

.industrial-demo-badge,
.manual-source,
.sidebar-version,
.topbar-badge,
.topbar-link,
.status-chip,
.workbench-state {
  border-color: rgba(10, 102, 232, 0.2) !important;
  color: var(--olive) !important;
  background: #eef4ff !important;
  box-shadow: none !important;
}

.industrial-model-switch,
.signal-wave-zoom,
.signal-channel-tabs {
  border-color: var(--line) !important;
  background: #f1f3f4 !important;
  box-shadow: none !important;
}

.industrial-model-switch button.active,
.signal-wave-zoom button.active,
.signal-channel-tabs button.active {
  color: var(--ink) !important;
  background: #ffffff !important;
  box-shadow: none !important;
}

.industrial-result-state.done {
  border-color: rgba(52, 168, 83, 0.25) !important;
  color: #34a853 !important;
  background: rgba(52, 168, 83, 0.08) !important;
  box-shadow: none !important;
}

.industrial-input-error,
.industrial-result-state.error,
.home-chat-message.is-error,
.signal-error {
  color: var(--danger) !important;
}

.industrial-result-state.error {
  border-color: rgba(217, 48, 37, 0.22) !important;
  background: rgba(217, 48, 37, 0.07) !important;
}

.manual-safety {
  border-color: rgba(10, 102, 232, 0.18) !important;
  color: var(--muted) !important;
  background: #eef4ff !important;
  box-shadow: none !important;
}

.manual-selector select {
  border-color: var(--line) !important;
  color: var(--ink) !important;
  background: #f7f8fa !important;
  box-shadow: none !important;
}

.manual-selector select:hover {
  border-color: var(--line-strong) !important;
  background: #f1f3f4 !important;
}

.manual-panel-heading,
.manual-steps-panel li::before {
  border-color: var(--line) !important;
}

.manual-steps-panel li::before {
  color: var(--olive) !important;
  background: #eef4ff !important;
  box-shadow: none !important;
}

.manual-selector label,
.manual-selector-summary,
.manual-panel-heading span,
.manual-panel details summary,
.manual-panel details p,
#manual-fault-meaning,
.manual-steps-panel li,
.manual-video-placeholder,
.manual-video-placeholder span {
  color: var(--muted) !important;
}

.manual-panel-heading h2,
#manual-fault-name {
  color: var(--ink) !important;
}

.industrial-lightbox-backdrop,
.intro-backdrop {
  background: rgba(31, 31, 31, 0.5) !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
}

.industrial-lightbox-dialog,
.intro-panel {
  border-color: var(--line) !important;
  background: #ffffff !important;
  box-shadow: none !important;
}

.api-docs-body,
.demo-page-body {
  --bg: #ffffff;
  --surface: #ffffff;
  --surface-muted: #f1f3f4;
  --surface-strong: #e8eaed;
  --ink: #1f1f1f;
  --muted: #5f6368;
  --line: rgba(31, 31, 31, 0.12);
  --frame: rgba(31, 31, 31, 0.14);
  --accent: #0a66e8;
  --accent-strong: #0a66e8;
  --accent-soft: rgba(10, 102, 232, 0.1);
  --signal-speed: #0a66e8;
  --signal-vibration: #34a853;
  --shadow: none;
}

.api-docs-topbar,
.demo-page-body .demo-page-panel,
.demo-page-body .fault-part-card {
  background: #ffffff !important;
  box-shadow: none !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
}

.demo-page-body .fault-part-card:hover,
.demo-page-body .fault-part-card:focus-visible,
.demo-page-body .gearbox-shell.drag-over,
.demo-page-body.demo-drag-focus .gearbox-shell {
  box-shadow: none !important;
}

.demo-page-body .legend-focus,
.demo-page-body .gearbox-bearing-focus::before,
.demo-page-body .gearbox-bearing-focus::after {
  background: var(--accent) !important;
}

.demo-page-body .gearbox-bearing-focus {
  border-color: var(--accent) !important;
  background: rgba(10, 102, 232, 0.06) !important;
  box-shadow: none !important;
}

.brand-copy small,
.sidebar-foot,
.topbar-kicker,
.nav-label,
.eyebrow,
.hero-copy-label,
.lead,
.workbench-desc,
.panel-note,
.result-description,
.api-docs-subtitle,
.demo-page-body p {
  color: var(--muted) !important;
}

.brand-copy strong,
.topbar-title-group strong,
.hero-brand h1,
.panel-head h2,
.section-head h3,
.result-head h3,
.result-summary h2,
.api-docs-title h1,
.api-doc-section h2,
.api-doc-section h3,
.demo-page-body h1,
.demo-page-body h2,
.demo-page-body h3,
.demo-page-body h4 {
  color: var(--ink) !important;
}