/* tokens.css — copied from starter/ui/tokens.css; values edited, names kept.
   Pop tokens (--pop, --pop-2, --pop-ink) and page slots added at the bottom.
   ?theme=dark|light pins the scheme via html[data-theme]; else the OS wins. */
:root{
  --paper:#F6F7FB; --card:#FFFFFF; --ink:#15202B; --muted:#4E5D6E; --faint:#5B6B7E;
  --line:#E1E7F0; --line-2:#EDF1F7; --line-strong:#AAB7C7;

  --accent:#0C6CCB; --accent-soft:#E2EEFA; --accent-ink:#0B5CAD;

  --rise:#1B7F3A; --rise-soft:#E4F3E9;
  --fall:#C8352F; --fall-soft:#FBECEB;
  --warn:#D19A2B;

  --shadow:0 2px 4px rgba(21,32,43,.05), 0 10px 28px -14px rgba(21,32,43,.22);
  --scrim:rgba(21,32,43,.42);

  --display:"Anuphan","Noto Sans Thai","Thonburi","Sukhumvit Set",system-ui,sans-serif;
  --ui:"IBM Plex Sans Thai Looped","Noto Sans Thai","Thonburi","Sukhumvit Set",system-ui,sans-serif;
  --mono:"IBM Plex Mono",ui-monospace,SFMono-Regular,Menlo,monospace;

  --pad:20px; --radius:28px; --radius-lg:40px; --max:1100px;

  /* pop colours, used sparingly */
  --pop:#D7FF3A; --pop-2:#FF6FB5; --cyan:#22D3EE; --pop-ink:#0B1A2B;

  /* page slots */
  --hero-1:#0C6CCB; --hero-2:#3E4BFF;
  --chat-card:#FFFFFF;
  --me:#0C6CCB; --me-ink:#FFFFFF;      /* user bubble, white text both schemes */
  --band:#0B1A2B;                       /* contact band ground, both schemes */
  --on-band:#F6F7FB; --on-band-muted:#C2CFDE;
  --on-hero:#FFFFFF; --on-hero-muted:rgba(255,255,255,.94);
  --shadow-deep:0 4px 8px rgba(21,32,43,.06), 0 32px 70px -24px rgba(21,32,43,.45);
}
@media (prefers-color-scheme:dark){
  :root{
    --paper:#0B1420; --card:#121E30; --ink:#EDF1F7; --muted:#A3B1C4;
    --faint:#7E8DA0; --line:#242F44; --line-2:#1A2434; --line-strong:#3A4A63;
    --hero-1:#0A4FA0; --hero-2:#2F3AD6;
    --accent:#6CB6FF; --accent-soft:#152A44; --accent-ink:#6CB6FF;
    --rise:#3DD79B; --rise-soft:#10281F;
    --fall:#FF7A72; --fall-soft:#2A1614;
    --shadow:0 2px 4px rgba(0,0,0,.4), 0 10px 28px -14px rgba(0,0,0,.7);
    --scrim:rgba(0,0,0,.6);
    --chat-card:#101B2E;
    --shadow-deep:0 4px 8px rgba(0,0,0,.4), 0 32px 70px -24px rgba(0,0,0,.8);
  }
}
/* pinned scheme (see app.js ?theme=): same tokens, no media query */
html[data-theme="dark"]{
  --paper:#0B1420; --card:#121E30; --ink:#EDF1F7; --muted:#A3B1C4;
  --faint:#7E8DA0; --line:#242F44; --line-2:#1A2434; --line-strong:#3A4A63;
    --hero-1:#0A4FA0; --hero-2:#2F3AD6;
  --accent:#6CB6FF; --accent-soft:#152A44; --accent-ink:#6CB6FF;
  --rise:#3DD79B; --rise-soft:#10281F;
  --fall:#FF7A72; --fall-soft:#2A1614;
  --shadow:0 2px 4px rgba(0,0,0,.4), 0 10px 28px -14px rgba(0,0,0,.7);
  --scrim:rgba(0,0,0,.6);
  --chat-card:#101B2E;
  --shadow-deep:0 4px 8px rgba(0,0,0,.4), 0 32px 70px -24px rgba(0,0,0,.8);
}
html[data-theme="light"]{
  --paper:#F6F7FB; --card:#FFFFFF; --ink:#15202B; --muted:#4E5D6E; --faint:#5B6B7E;
  --line:#E1E7F0; --line-2:#EDF1F7; --line-strong:#AAB7C7;
  --hero-1:#0C6CCB; --hero-2:#3E4BFF;
  --accent:#0C6CCB; --accent-soft:#E2EEFA; --accent-ink:#0B5CAD;
  --rise:#1B7F3A; --rise-soft:#E4F3E9;
  --fall:#C8352F; --fall-soft:#FBECEB;
  --shadow:0 2px 4px rgba(21,32,43,.05), 0 10px 28px -14px rgba(21,32,43,.22);
  --scrim:rgba(21,32,43,.42);
  --chat-card:#FFFFFF;
  --shadow-deep:0 4px 8px rgba(21,32,43,.06), 0 32px 70px -24px rgba(21,32,43,.45);
}
