:root {
  color-scheme: light;
  --page: #f3f5f7;
  --surface: #ffffff;
  --inset: #f6f8fa;
  --text: #202b36;
  --muted: #526170;
  --line: #d5dce3;
  --link: #1559a4;
  --accent: #215bc0;
  --secondary: #e7edf3;
  --positive: #14633e;
  --positive-bg: #e7f4ec;
  --negative: #af293a;
  --negative-bg: #fcecef;
  --warning: #7b4d0d;
  --warning-bg: #fff5df;
  --warning-line: #dec085;
  --caution: #98431c;
  --caution-bg: #fff0e7;
  --tier: #12685b;
  --tier-bg: #eaf5f2;
  --selection: #d5e6ff;
  color: var(--text);
  background: var(--page);
}
:root[data-theme="dark"] {
  color-scheme: dark;
  --page: #08111f;
  --surface: #101e31;
  --inset: #0b1728;
  --text: #e7edf7;
  --muted: #a8b8ce;
  --line: #30445e;
  --link: #8bbaff;
  --accent: #215bc0;
  --secondary: #27364a;
  --positive: #7ff0b4;
  --positive-bg: #113b2c;
  --negative: #ffadb2;
  --negative-bg: #48212c;
  --warning: #ffe0a0;
  --warning-bg: #3f3520;
  --warning-line: #856b39;
  --caution: #ffcb9e;
  --caution-bg: #3e3024;
  --tier: #83d9c9;
  --tier-bg: #102b37;
  --selection: #334c6e;
}
body { color: var(--text); background: var(--page); }
::selection { background: var(--selection); color: var(--text); }
main { min-width: 0; }
main > header { gap: 20px; flex-wrap: wrap; }
main > header > div { min-width: 0; }
h1, h2, h3, .levels b { color: var(--text); overflow-wrap: anywhere; }
header p, label, .hint, .cards small, th, footer,
.chan-table td small, .levels, .method p, .method li,
.focus-card .meta, .focus-card .reason, .focus-card .price small,
.filter-bar label, .lights-combined td small, .light-details li { color: var(--muted); }
a, .action, .chan-table summary, .focus-card summary, .light-details summary { color: var(--link); }
.cards article, section, .method, .toolbar, .validation-panel {
  background: var(--surface);
  border-color: var(--line);
}
.notice { background: var(--warning-bg); color: var(--warning); border-color: var(--warning-line); }
#notice.error { background: var(--negative-bg); color: var(--negative); border-color: var(--negative); }
.cards article, .focus-card { min-width: 0; border-radius: 8px; }
.cards b { overflow-wrap: anywhere; }
th, td, .evidence, .evidence details, .focus-card .reason,
.light-details div, .validation-panel[open] summary { border-color: var(--line); }
thead { background: var(--inset); }
tbody tr:hover { background: var(--inset); }
.pill, .state, .state-preliminary { background: var(--secondary); color: var(--text); border-color: var(--line); }
.state-buy_confirmed { background: var(--positive-bg); color: var(--positive); }
.state-sell_confirmed { background: var(--negative-bg); color: var(--negative); }
.state-candidate, .state-fractal, .strategy-original { background: var(--warning-bg); color: var(--warning); }
.state-unknown, .state-stale { background: var(--caution-bg); color: var(--caution); }
.strategy-enhanced { background: var(--secondary); color: var(--link); }
.red, .fail, .light-red { color: var(--negative); }
.green, .grade-A, .light-green { color: var(--positive); }
.grade-B, .light-yellow, .validation-panel summary b { color: var(--warning); }
.pending, .light-orange { color: var(--caution); }
.light-gray { color: var(--muted); }
.light-green:before { background: var(--positive); box-shadow: none; }
.light-yellow:before { background: var(--warning); }
.light-red:before { background: var(--negative); }
.light-orange:before { background: var(--caution); }
.light-gray:before { background: var(--muted); }
.tier-strip span { color: var(--tier); background: var(--tier-bg); border-left-color: var(--tier); }
.timeline article, .score-grid div, .focus-card { background: var(--inset); border-color: var(--line); }
.timeline article { border-left-color: var(--link); }
.timeline .primary, .focus-card.conclusion-重点观察 { border-color: var(--positive); }
.focus-card.conclusion-风险否决, .focus-card.conclusion-市场红灯暂缓 { border-color: var(--negative); }
input, select, .filter-bar input, .filter-bar select {
  background: var(--surface);
  color: var(--text);
  border: 1px solid var(--line);
  border-radius: 7px;
  padding: 9px 10px;
  font-size: 16px;
  min-height: 44px;
}
input::placeholder { color: var(--muted); opacity: 1; }
button, .button-link { background: var(--accent); color: #ffffff; min-height: 44px; }
.secondary { background: var(--secondary); color: var(--text); }
button:disabled { opacity: .5; cursor: default; }
button:focus-visible, a:focus-visible, summary:focus-visible,
input:focus-visible, select:focus-visible { outline: 2px solid var(--link); outline-offset: 3px; }
.header-actions { flex-direction: row; align-items: center; flex-wrap: wrap; gap: 12px; }
.theme-control { display: flex; align-items: center; gap: 8px; font-size: 14px; white-space: nowrap; }
.theme-control select { width: 128px; flex: 0 0 128px; }
.pagination { flex-wrap: wrap; }
.table { max-width: 100%; overscroll-behavior-x: contain; }
@media (max-width: 750px) {
  main > header { align-items: flex-start; gap: 14px; }
  main > header > div { width: 100%; }
  .header-actions { justify-content: flex-start; }
  .cards { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .cards article { padding: 12px; }
  .cards b { font-size: 19px; }
  .filter-bar label { width: 100%; min-width: 0; }
  .filter-bar input, .filter-bar select { width: 100%; min-width: 0; }
  .theme-control { width: auto; }
  .theme-control select { width: 128px; }
  .tier-strip span { min-width: 0; flex-basis: 100%; }
  .notice, #sourceInfo, #statusDetail { overflow-wrap: anywhere; }
}
