/* Self-hosted IBM Plex Sans Thai (SIL Open Font License — redistribution
   permitted), 400/500/600/700, split into the thai + latin subsets this
   app actually renders. Was a Google Fonts @import: worked online, but an
   installed PWA that lost the network mid-session would fall back to a
   system font, and the CDN request added a round trip to every first
   paint. Files under /fonts/ came from fonts.gstatic.com unmodified,
   dropped the cyrillic-ext/latin-ext subsets Google's CSS also serves —
   nothing in this app's UI (Thai + English only) renders either. */
@font-face {
  font-family: "IBM Plex Sans Thai";
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url("/fonts/ibm-plex-sans-thai-thai-400.woff2") format("woff2");
  unicode-range: U+02D7, U+0303, U+0331, U+0E01-0E5B, U+200C-200D, U+25CC;
}
@font-face {
  font-family: "IBM Plex Sans Thai";
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url("/fonts/ibm-plex-sans-thai-latin-400.woff2") format("woff2");
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: "IBM Plex Sans Thai";
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url("/fonts/ibm-plex-sans-thai-thai-500.woff2") format("woff2");
  unicode-range: U+02D7, U+0303, U+0331, U+0E01-0E5B, U+200C-200D, U+25CC;
}
@font-face {
  font-family: "IBM Plex Sans Thai";
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url("/fonts/ibm-plex-sans-thai-latin-500.woff2") format("woff2");
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: "IBM Plex Sans Thai";
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url("/fonts/ibm-plex-sans-thai-thai-600.woff2") format("woff2");
  unicode-range: U+02D7, U+0303, U+0331, U+0E01-0E5B, U+200C-200D, U+25CC;
}
@font-face {
  font-family: "IBM Plex Sans Thai";
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url("/fonts/ibm-plex-sans-thai-latin-600.woff2") format("woff2");
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: "IBM Plex Sans Thai";
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url("/fonts/ibm-plex-sans-thai-thai-700.woff2") format("woff2");
  unicode-range: U+02D7, U+0303, U+0331, U+0E01-0E5B, U+200C-200D, U+25CC;
}
@font-face {
  font-family: "IBM Plex Sans Thai";
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url("/fonts/ibm-plex-sans-thai-latin-700.woff2") format("woff2");
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

* { box-sizing: border-box; }

html {
  background: var(--color-canvas);
}

/* ค่าเริ่มต้นที่ทุกหน้า — รวมถึง markup ที่นำมา integrate — จะสืบทอดไป
   ถ้าหน้าไหนไม่ตั้งขนาดเอง มันจะได้ --text-md / --leading-normal ซึ่งเป็นค่า
   ที่ปลอดภัยกับภาษาไทยอยู่แล้ว */
body {
  margin: 0;
  min-height: 100vh;
  background: var(--color-canvas);
  color: var(--color-text);
  font-family: "IBM Plex Sans Thai", "Segoe UI", Tahoma, sans-serif;
  font-size: var(--text-md);
  line-height: var(--leading-normal);
}

h1, h2, h3, p { margin: 0; }

button, input, select, textarea { font: inherit; color: inherit; }
button { cursor: pointer; }
button, [data-id], [data-go], [data-open] { -webkit-tap-highlight-color: transparent; }

button:focus-visible,
input:focus-visible,
select:focus-visible,
textarea:focus-visible,
a:focus-visible,
[tabindex]:focus-visible {
  outline: none;
  box-shadow: var(--focus-ring);
  border-radius: var(--radius-sm);
}

.muted-note { color: var(--color-text-subtle); font-size: var(--text-xs); line-height: var(--leading-loose); }

.section-kicker {
  color: var(--color-text-subtle);
  font-size: var(--text-xs);
  font-weight: 700;
  line-height: var(--leading-normal);
  letter-spacing: var(--tracking-wide);
  text-transform: uppercase;
}

table { font-variant-numeric: tabular-nums; }

html[lang="th"] .section-kicker, html[lang="th"] th { letter-spacing: 0; }
button { transition: background-color var(--duration-fast) var(--ease-standard), color var(--duration-fast) var(--ease-standard); }
.metric-card strong { font-variant-numeric: tabular-nums; }

/* คู่กับบล็อกใน tokens.css ที่ลด --duration-* ลง — ไม่ใช่ของซ้ำ อย่าลบทิ้งอันใดอันหนึ่ง
   tokens.css คุม transition ที่เรียกผ่าน token ส่วนกฎ `*` ตัวนี้คุมทุกอย่าง */
@media (prefers-reduced-motion: reduce) {
  * { animation-duration: 0.01ms !important; transition-duration: 0.01ms !important; }
}
