/* Design tokens — จาก DCA Manager Design System v0.1 */
:root {
  --bg: #F5F6F9; --surface: #FFFFFF; --sunk: #EEF0F5; --line: #DFE2EB; --line-strong: #C6CBD8;
  --fg: #151A2C; --muted: #596079; --faint: #8A90A6;
  --ink: #2C3A8C; --ink-soft: #E7EAF8; --on-ink: #FFFFFF;
  --gain: #0A7A46; --gain-soft: #E2F4EA; --loss: #BF3329; --loss-soft: #FBE7E5; --warn: #8F5B00; --warn-soft: #FBF0D9;
  --c-principal: #9AA1B8; --c-target: #C98A12;
  /* สีแอปตามลำดับคงที่ (3 สีแรกตามดีไซน์ ที่เหลือสำหรับแอปที่ผู้ใช้เพิ่มเอง) */
  --c-app1: var(--ink); --c-app2: var(--c-target); --c-app3: var(--gain);
  --c-app4: #7A4FB5; --c-app5: #1F8A99; --c-app6: #B5487A; --c-app7: #5B6B2E; --c-app8: #8A90A6;
  /* สีประเภทสินทรัพย์ (pie chart) — ผ่าน validate_palette.js ทั้งโหมดสว่าง/มืด รวมคู่ที่วนชนกันใน pie
     ไม่ใช้เขียว/แดง (สงวนไว้สำหรับกำไร/ขาดทุน) · ประเภทที่ 7 ขึ้นไปรวมเป็น "อื่นๆ" สีเทา */
  --cat-1: #2a78d6; --cat-2: #eb6834; --cat-3: #1baf7a; --cat-4: #eda100; --cat-5: #4a3aa7; --cat-6: #e87ba4; --cat-other: #8A90A6;

  --f-display: "Anuphan", "IBM Plex Sans Thai", system-ui, sans-serif;
  --f-body: "IBM Plex Sans Thai", system-ui, -apple-system, "Segoe UI", sans-serif;
  --f-num: "IBM Plex Mono", ui-monospace, "SF Mono", Menlo, monospace;

  --s1: 4px; --s2: 8px; --s3: 12px; --s4: 16px; --s5: 24px; --s6: 32px; --s7: 48px; --s8: 64px;
  --r-sm: 6px; --r-md: 10px; --r-lg: 14px;
  --shadow: 0 1px 2px rgba(21,26,44,.06), 0 4px 16px rgba(21,26,44,.05);
}

@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    --bg: #0D0F17; --surface: #151826; --sunk: #10131E; --line: #252A3D; --line-strong: #363C55;
    --fg: #E8EAF3; --muted: #A0A6BD; --faint: #6E748C;
    --ink: #9EA9FF; --ink-soft: #232A52; --on-ink: #0D0F17;
    --gain: #45D18E; --gain-soft: #11301F; --loss: #FF8076; --loss-soft: #3A1715; --warn: #F2B957; --warn-soft: #33260C;
    --c-principal: #5F6680; --c-target: #F2B957;
    --c-app4: #B794F0; --c-app5: #5CC8D6; --c-app6: #EE8DB8; --c-app7: #A9C46A; --c-app8: #6E748C;
    --cat-1: #3987e5; --cat-2: #d95926; --cat-3: #199e70; --cat-4: #c98500; --cat-5: #9085e9; --cat-6: #d55181; --cat-other: #6E748C;
    --shadow: 0 1px 2px rgba(0,0,0,.4), 0 4px 16px rgba(0,0,0,.25);
    color-scheme: dark;
  }
}

:root[data-theme="dark"] {
  --bg: #0D0F17; --surface: #151826; --sunk: #10131E; --line: #252A3D; --line-strong: #363C55;
  --fg: #E8EAF3; --muted: #A0A6BD; --faint: #6E748C;
  --ink: #9EA9FF; --ink-soft: #232A52; --on-ink: #0D0F17;
  --gain: #45D18E; --gain-soft: #11301F; --loss: #FF8076; --loss-soft: #3A1715; --warn: #F2B957; --warn-soft: #33260C;
  --c-principal: #5F6680; --c-target: #F2B957;
  --c-app4: #B794F0; --c-app5: #5CC8D6; --c-app6: #EE8DB8; --c-app7: #A9C46A; --c-app8: #6E748C;
  --cat-1: #3987e5; --cat-2: #d95926; --cat-3: #199e70; --cat-4: #c98500; --cat-5: #9085e9; --cat-6: #d55181; --cat-other: #6E748C;
  --shadow: 0 1px 2px rgba(0,0,0,.4), 0 4px 16px rgba(0,0,0,.25);
  color-scheme: dark;
}