/* Thai needs normal tracking and room above and below vowel marks. */
:root {
  --font-body: "Leelawadee UI", "Noto Sans Thai", Tahoma, system-ui, sans-serif;
  --font-display: "Leelawadee UI", "Noto Sans Thai", Tahoma, system-ui, sans-serif;
  --font-orn: "Leelawadee UI", "Noto Sans Thai", Tahoma, system-ui, sans-serif;
}
html[lang="th"] body { font-size: 14px; }
html[lang="th"] :is(h1,h2,h3,h4,button,label,legend,.orn,.lbl,.row-label,.sec,.scn-head,.title-main,.title-lead,.soul-name,.sk-name,.sk-rar,.nat-name,.name,.tab,.power,.era-stamp,.num,.desk-slot) { letter-spacing: normal; }
html[lang="th"] :is(p,li,small,.scn-desc,.sk-desc,.row-note,.step-note,.pick-foot,.soul-meta) { line-height: 1.7; }
html[lang="th"] .title-main { font-size: clamp(27px, 4vw, 43px); line-height: 1.5; }
html[lang="th"] .brand h1 { font-size: 17px; }
html[lang="th"] .title-lead { line-height: 1.9; }
html[lang="th"] .power b { font-size: 12px; }
html[lang="th"] .scn { min-width: 0; }
#th-toolbar { position: fixed; z-index: 10000; top: max(8px, env(safe-area-inset-top)); right: max(10px, env(safe-area-inset-right)); font: 13px/1.65 "Leelawadee UI", Tahoma, sans-serif; color: var(--ink); }
#th-toolbar summary { cursor: pointer; padding: 5px 12px; border: 1px solid var(--line-2); border-radius: 9px; background: var(--panel); box-shadow: 0 2px 10px #0002; color: var(--ink); list-style: none; }
#th-toolbar summary::-webkit-details-marker { display: none; }
#th-toolbar[open] { width: min(340px, calc(100vw - 20px)); padding: 12px; background: var(--panel); border: 1px solid var(--line-2); border-radius: 12px; box-shadow: var(--shadow); }
#th-toolbar[open] summary { box-shadow: none; border: 0; padding: 0; font-weight: 700; }
#th-toolbar p { margin: 9px 0; }
#th-toolbar button, #th-toolbar a { display: block; width: 100%; margin: 7px 0; padding: 7px 10px; border: 1px solid var(--line-2); border-radius: 7px; background: var(--bg); color: var(--ink); text-align: left; text-decoration: none; font: inherit; cursor: pointer; }
#th-toolbar .th-note { color: var(--muted); font-size: 12px; }
#th-toolbar output { display: block; color: var(--gold-ink); }
@media (max-width: 760px) {
  html[lang="th"] .hud-actions { flex-wrap: wrap; }
  html[lang="th"] .btn { white-space: normal; }
  html[lang="th"] .title-card { padding-top: 48px; }
  html[lang="th"] .room-foot { padding-bottom: max(10px, env(safe-area-inset-bottom)); }
  #th-toolbar summary { font-size: 11px; padding: 3px 8px; }
}