/* Shared by the Next website and the standalone simulator. */
:root,
html[data-theme="dark"] {
  color-scheme: dark;
  --bg-0: #101316;
  --bg-1: #171b20;
  --bg-2: #1c2127;
  --bg-3: #242b32;
  --bg-4: #303943;
  --gold: #dabb7c;
  --gold-light: #ecd5a7;
  --gold-glow: rgb(218 187 124 / 12%);
  --blue: #8ab7dc;
  --blue-dim: #608fb5;
  --green: #81c6a6;
  --purple: #b29bd3;
  --purple-light: #c7b7df;
  --red: #e59292;
  --text-0: #f1f2f3;
  --text-1: #d0d5db;
  --text-2: #a1aab5;
  --text-disabled: #7f8995;
  --border: #30373f;
  --border-bright: #47515d;
  --radius-sm: 8px;
  --radius-md: 12px;
  --radius-lg: 18px;
  --font-ui: 'Noto Sans TC', 'Noto Sans', system-ui, sans-serif;
  --font-data: Arial, 'Noto Sans TC', sans-serif;
  --font-geist-mono: Arial, 'Noto Sans TC', sans-serif;
}
html[data-theme="light"] {
  color-scheme: light;
  --bg-0: #f2f5f8;
  --bg-1: #ffffff;
  --bg-2: #f8fafc;
  --bg-3: #e9eef4;
  --bg-4: #dbe3ec;
  --gold: #8b6728;
  --gold-light: #79581d;
  --gold-glow: rgb(139 103 40 / 10%);
  --text-0: #17202b;
  --text-1: #354456;
  --text-2: #536478;
  --text-disabled: #68798c;
  --border: #d4dee8;
  --border-bright: #b6c4d4;
}
body {
  background: var(--bg-0);
  color: var(--text-1);
  font-family: var(--font-ui);
  font-weight: 400;
  line-height: 1.65;
}
button, input, select, textarea { font-family: inherit; }
/* Plain, open zeros and aligned figures throughout the tools. */
body { font-variant-numeric: lining-nums tabular-nums; font-feature-settings: 'zero' 0; }
input[type='number'], [style*='monospace'] { font-family: var(--font-data) !important; }
button, a, input, select, textarea { -webkit-tap-highlight-color: transparent; }
:where(a, button, input, select, textarea, summary):focus-visible {
  outline: 2px solid var(--gold);
  outline-offset: 4px;
}
::selection { background: #dabb7c; color: #101316; }
* { scrollbar-color: var(--border-bright) transparent; scrollbar-width: thin; }
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    scroll-behavior: auto !important;
    animation-duration: .01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: .01ms !important;
  }
}

/* Keep navigation typography identical on React pages and the simulator. */
.alphasim-header .alphasim-header-link,
.header .header-nav-link {
  font-family: var(--font-ui);
  font-size: 16px;
  font-weight: 600;
  line-height: 1.5;
  letter-spacing: normal;
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}