/* 默认主题用于首屏和配置加载失败；实际主题由 YAML 覆盖基础语义色。 */
:root {
  color-scheme: dark;
  --bg: #0c0b09;
  --surface: #17140f;
  --text: #f3e6c9;
  --muted: #b8aa8b;
  --accent: #d6b46c;
  --accent-hover: #f3d798;
  --on-accent: #17130b;
  --border: #75613d;
  --success: #94b9a2;
  --danger: #edaa99;
  --info: #9ebfd0;
  --warning: #f3d798;
  --shadow-color: #000000;
  --accent-dark: var(--accent-hover);
  --accent-fill: var(--accent);
  --accent-fill-hover: var(--accent-hover);
  --accent-soft: var(--accent);
  --line: var(--border);
  --soft-line: color-mix(in srgb, var(--border) 42%, var(--surface));
  --tonal: color-mix(in srgb, var(--surface) 92%, var(--accent));
  --soft-surface: color-mix(in srgb, var(--surface) 65%, var(--bg));
  --hover-surface: color-mix(in srgb, var(--surface) 90%, var(--accent));
  --selected-surface: color-mix(in srgb, var(--surface) 80%, var(--accent));
  --diagram-surface: var(--tonal);
  --track: color-mix(in srgb, var(--border) 40%, var(--surface));
  --on-accent-muted: color-mix(in srgb, var(--on-accent) 80%, var(--accent));
  --backdrop: color-mix(in srgb, var(--shadow-color) 65%, transparent);
  --shadow: color-mix(in srgb, var(--shadow-color) 22%, transparent);
  --toast: var(--surface);
  --glow: color-mix(in srgb, var(--accent) 24%, transparent);
  --glow-strong: color-mix(in srgb, var(--accent) 42%, transparent);
  --shine: color-mix(in srgb, var(--accent-hover) 72%, transparent);
  --metal-highlight: color-mix(in srgb, var(--accent-hover) 24%, white);
  --metal-low: color-mix(in srgb, var(--accent) 72%, var(--on-accent));
  --radius-control: 8px;
  --radius-panel: 12px;
  --radius-pill: 999px;
  --control-height: 44px;
  --duration-fast: 160ms;
  --font-ui: 'Inter', 'PingFang TC', 'Microsoft JhengHei', sans-serif;
  --font-display: Georgia, 'Noto Serif CJK TC', 'Songti TC', serif;
}
body { font-family: var(--font-ui); }
/* 任何组件的隐藏状态都必须优先于布局，避免未完成步骤和文件控件泄露。 */
[hidden] { display: none !important; }
:where(button, a, input, textarea, select, summary):focus-visible {
  outline: 2px solid var(--accent-hover); outline-offset: 3px;
}
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation-duration: 0s !important; transition-duration: 0s !important;
    scroll-behavior: auto !important;
  }
}

/* 浅色主题不在深色装饰底图上绘制深色正文；独立作品图保持原样。 */
html[data-scheme="light"] .art-page #app { background-image: none; }

/* 根画布与页面共用主题背景，覆盖大屏两侧、滚动回弹和内容不足一屏的区域。 */
html { background-color: var(--bg); }