/* Palm Sphere design tokens, shared by the mini app (app.css) and Palm Sphere Desk (desk/tokens.css is a copy:
   run `npm run sync-desk-tokens` after changing this file). Colours, fonts, radius; light, dark and time of day. */
/* Palm Sphere design system (from the Lovable prototype): coastal cream and indigo by day, deep indigo
   with solar yellow at night; Playfair Display for display (Brand Guideline v1.1), Inter for text, IBM Plex Sans Thai for Thai.
   Status colours stay semantic so the site team reads them at a glance. */
:root {
  --paper: oklch(0.97 0.022 95); --surface: oklch(0.99 0.012 95); --sunk: oklch(0.94 0.022 230);
  --ink: oklch(0.24 0.06 250); --muted: oklch(0.48 0.05 250); --line: oklch(0.88 0.03 230);
  --palm: oklch(0.42 0.12 250); --on-palm: oklch(0.98 0.02 95);
  --sun: oklch(0.86 0.16 95); --on-sun: oklch(0.24 0.06 250);
  --brass: oklch(0.52 0.11 75); --brass-soft: oklch(0.93 0.06 95);
  --ok: #2C6A48; --ok-bg: #DCEBE0; --fix: #A3402A; --fix-bg: #F6DED6; --info: #2D5B7C; --info-bg: #DCE7EF;
  --warn: #8A5A12; --warn-bg: #F4E6C8;
  --shade: oklch(0.2 0.05 255 / .45);
  --glow: oklch(0.86 0.16 95 / .45);
  --shadow-soft: 0 1px 2px oklch(0.2 0.04 60 / 0.06), 0 8px 24px oklch(0.2 0.04 60 / 0.08);
  --shadow-deep: 0 20px 60px -20px oklch(0.15 0.04 60 / 0.4);
  --f-display: "Playfair Display", "IBM Plex Sans Thai", Georgia, serif;
  --f-body: "Inter", "IBM Plex Sans Thai", "Noto Sans Thai", "Leelawadee UI", system-ui, sans-serif;
  --r: 20px;
  /* older names some screens used; same colours */
  --pass: var(--ok); --bad: var(--fix);
  --nav-h: 84px;
  color-scheme: light;
}
/* night look: system dark mode, or dusk and night in the time-of-day atmosphere */
@media (prefers-color-scheme: dark) { :root:not([data-theme="light"]) { --night: 1; } }
:root[data-theme="dark"], :root[data-tod="night"]:not([data-theme="light"]), :root[data-tod="dusk"]:not([data-theme="light"]) { --night: 1; }
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    --paper: oklch(0.16 0.06 260); --surface: oklch(0.22 0.07 260); --sunk: oklch(0.26 0.06 260);
    --ink: oklch(0.95 0.03 95); --muted: oklch(0.74 0.05 95); --line: oklch(0.32 0.07 260);
    --palm: oklch(0.86 0.16 95); --on-palm: oklch(0.16 0.06 260); --brass: oklch(0.86 0.16 95); --brass-soft: oklch(0.3 0.08 260);
    --ok: #90CFA9; --ok-bg: #1E3428; --fix: #EC9B83; --fix-bg: #3E231A; --info: #97C1DE; --info-bg: #1C2D39;
    --warn: #E6C27A; --warn-bg: #3A2E17; --shade: rgba(0, 0, 0, .6); color-scheme: dark;
  }
}
:root[data-theme="dark"], :root[data-tod="night"]:not([data-theme="light"]), :root[data-tod="dusk"]:not([data-theme="light"]) {
  --paper: oklch(0.16 0.06 260); --surface: oklch(0.22 0.07 260); --sunk: oklch(0.26 0.06 260);
  --ink: oklch(0.95 0.03 95); --muted: oklch(0.74 0.05 95); --line: oklch(0.32 0.07 260);
  --palm: oklch(0.86 0.16 95); --on-palm: oklch(0.16 0.06 260); --brass: oklch(0.86 0.16 95); --brass-soft: oklch(0.3 0.08 260);
  --ok: #90CFA9; --ok-bg: #1E3428; --fix: #EC9B83; --fix-bg: #3E231A; --info: #97C1DE; --info-bg: #1C2D39;
  --warn: #E6C27A; --warn-bg: #3A2E17; --shade: rgba(0, 0, 0, .6); color-scheme: dark;
}
:root[data-tod="dusk"]:not([data-theme="light"]) { --paper: oklch(0.3 0.09 262); --surface: oklch(0.34 0.09 260); --sunk: oklch(0.38 0.08 260); --line: oklch(0.46 0.08 260); }
:root[data-tod="morning"]:not([data-theme="dark"]) { --paper: oklch(0.965 0.03 230); }
:root[data-tod="golden"]:not([data-theme="dark"]) { --paper: oklch(0.95 0.06 95); }