/* Existing :root colors in styles.css are the primitive palette. */
:root {
  --color-background: var(--page);
  --color-surface: var(--panel);
  --color-surface-raised: var(--panel-soft);
  --color-text: var(--ink);
  --color-text-muted: var(--muted);
  --color-border: var(--line);
  --color-accent: var(--teal);
  --color-positive: var(--teal);
  --color-on-accent: #07131a;
  --color-attention: var(--gold);
  --color-negative: var(--rose);
  --space-1: .25rem;
  --space-2: .5rem;
  --space-3: .75rem;
  --space-4: 1rem;
  --space-6: 1.5rem;
  --space-8: 2rem;
  --type-small: .8125rem;
  --type-body: .875rem;
  --type-title: 1.75rem;
  --type-metric: 1.75rem;
  --color-accent-soft: color-mix(in srgb, var(--color-accent) 10%, var(--panel));
  --font-ui: ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", "PingFang SC", "Microsoft YaHei", sans-serif;
  --radius-control: .5rem;
  --radius-card: .75rem;
  --touch-target: 2.75rem;
  --app-content-width: 32rem;
  --app-safe-top: env(safe-area-inset-top, 0px);
  --app-safe-bottom: env(safe-area-inset-bottom, 0px);
  --app-safe-left: env(safe-area-inset-left, 0px);
  --app-safe-right: env(safe-area-inset-right, 0px);
  --app-nav-offset: var(--app-safe-top);
  --nav-background: var(--color-background);
  --nav-active-background: var(--color-surface-raised);
  --nav-active-text: var(--color-accent);
  --card-background: var(--color-surface);
  --card-border: var(--color-border);
}
/* Theme selection stays here; component files consume these tokens. */
html[data-app-theme="paper"] {
  color-scheme: light;
  -webkit-text-size-adjust: 100%;
  text-size-adjust: 100%;
  -webkit-tap-highlight-color: transparent;
  scroll-padding-block: calc(var(--app-nav-offset) + var(--space-3)) calc(6rem + var(--app-safe-bottom));
  --page: var(--paper-canvas);
  --panel: var(--paper-surface);
  --panel-soft: var(--paper-raised);
  --panel-softer: var(--paper-raised);
  --ink: var(--paper-text);
  --muted: var(--paper-muted);
  --line: var(--paper-line);
  --blue: var(--paper-blue);
  --teal: var(--paper-green);
  --green: var(--paper-green);
  --gold: var(--paper-amber);
  --rose: var(--paper-red);
  --color-accent: var(--blue);
  --color-on-accent: var(--paper-surface);
  --score-excellent-color: var(--teal);
  --score-good-color: var(--blue);
  --score-qualified-color: var(--muted);
  --score-review-color: var(--gold);
  --score-weak-color: var(--rose);
  --score-unavailable-color: var(--muted);
  --shadow: 0 12px 32px rgb(36 45 56 / .08);
  --mobile-shadow: 0 6px 20px rgb(36 45 56 / .06);
  --font-ui: -apple-system, BlinkMacSystemFont, "Segoe UI", "PingFang SC", "Microsoft YaHei", sans-serif;
  --radius-card: 1.125rem;
  --radius-control: .75rem;
  --nav-background: rgb(255 255 255 / .94);
  --nav-active-background: var(--color-accent-soft);
  --nav-active-text: var(--color-accent);
  --nav-filter: blur(20px) saturate(140%);
  --nav-width: calc(100% - 1rem);
  --nav-bottom: .5rem;
  --nav-radius: 1.5rem;
  --nav-border: 1px solid var(--color-border);
  --nav-shadow: 0 6px 24px rgb(36 45 56 / .10);
  --nav-active-shadow: none;
  --heading-tracking: -.025em;
  --heading-min-width: 6rem;
  --topbar-wrap: wrap;
  --control-border: transparent;
}
@media (prefers-reduced-transparency: reduce), (prefers-contrast: more) {
  html[data-app-theme="paper"] { --nav-background: var(--color-surface); --nav-filter: none; }
}
@media (prefers-contrast: more) {
  html[data-app-theme="paper"] { --line: #737982; --muted: #454b55; --control-border: var(--color-border); }
}
body.futu-watchlist-page {
  /* Compatibility aliases, not another palette. */
  --futu-bg: var(--color-background);
  --futu-surface: var(--color-surface);
  --futu-ink: var(--color-text);
  --futu-muted: var(--color-text-muted);
  --futu-accent: var(--color-accent);
  --futu-attention: var(--color-attention);
  --futu-line: var(--color-border);
}
@media (min-width: 800px) and (min-height: 600px) {
  :root { --app-content-width: 70rem; --app-nav-offset: 4.5rem; }
}
