/* Header language control and native modal, shared by all six locales. */
#nav.nav { gap:24px; }
#nav.nav .nav-links { gap:clamp(10px,1.55vw,22px); }
#nav.nav .nav-links a { white-space:nowrap; }
#nav.nav .nav-actions { flex-shrink:0; }
.language-trigger { display:inline-flex;align-items:center;justify-content:center;gap:8px;flex-shrink:0;min-width:64px;min-height:44px;padding:0 8px;border:0;background:transparent;color:var(--spectral,var(--text,#f0f0fa));font:400 11px var(--mono,var(--ff,system-ui));letter-spacing:.14em;cursor:pointer;white-space:nowrap; }
.language-trigger svg { width:17px;height:17px;flex:none; }
.language-dialog { position:fixed;inset:0;margin:auto;width:544px;max-width:calc(100vw - 40px);max-height:calc(100dvh - 40px);padding:28px;border:1px solid var(--ghost-bd,var(--border-strong,#ffffff2e));border-radius:12px;background:var(--ink,var(--panel,#000714));color:var(--spectral,var(--text,#f0f0fa));font-family:var(--sans,var(--ff,system-ui));overflow:auto;box-sizing:border-box; }
.language-dialog:not([open]) { display:none; }
.language-dialog::backdrop { background:rgba(0,0,0,.5); }
.language-dialog-heading { display:flex;align-items:center;justify-content:space-between;gap:20px;margin-bottom:24px; }
.language-dialog-heading h2 { margin:0;font:400 23px/1.3 var(--sans,var(--ff,system-ui));letter-spacing:-.035em; }
.language-close { display:flex;align-items:center;justify-content:center;width:44px;height:44px;margin:-10px -10px -10px 0;padding:0;border:0;background:transparent;color:inherit;cursor:pointer;flex:none; }
.language-close svg { width:18px;height:18px; }
.language-options { display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px; }
.language-options a { display:flex;align-items:center;justify-content:space-between;gap:12px;min-height:76px;padding:14px 16px;border:1px solid transparent;border-radius:8px;color:inherit;background:transparent;text-align:left;text-decoration:none;text-transform:none;letter-spacing:normal;font:400 16px/1.4 var(--sans,var(--ff,system-ui));box-sizing:border-box; }
.language-options a[aria-current="page"] { background:var(--ghost-bg,var(--accent-soft,#ffffff1a));border-color:var(--ghost-bd,var(--border-strong,#ffffff2e)); }
.language-options a:hover { background:var(--ghost-bg,var(--accent-soft,#ffffff1a)); }
.language-name { display:block; }
.language-english { display:block;margin-top:3px;color:var(--mute-2,var(--text-dim,#93a0b4));font:400 12px/1.5 var(--sans,var(--ff,system-ui));letter-spacing:normal; }
.language-check { width:18px;height:18px;flex:none; }
.language-trigger:focus-visible,.language-dialog :focus-visible { outline:2px solid var(--spectral,var(--accent-strong,#d8c18a));outline-offset:4px; }
.site-head .head-meta { flex-wrap:wrap;justify-content:flex-end; }
@media(max-width:900px) {
 #nav.nav { gap:12px; }
 #nav.nav .nav-actions { margin-left:auto;margin-right:8px;gap:0; }
 #nav.nav .brand { min-width:0; }
 #nav.nav .brand img { max-width:calc(100vw - 150px);height:auto;max-height:28px; }
 .language-dialog { padding:24px; }
 .language-dialog-heading { margin-bottom:20px; }
 .language-options { grid-template-columns:1fr;gap:6px; }
 .language-options a { min-height:58px;padding:10px 14px; }
 .language-english { margin-top:1px; }
 .site-head { gap:14px;flex-wrap:wrap; }
 .site-head .head-meta { margin-left:auto;gap:8px; }
 .site-head .head-meta>span { flex-basis:100%;text-align:right; }
}
@media(min-width:1201px) and (max-width:1400px) {
 #nav.nav { padding-left:32px;padding-right:32px;gap:16px; }
 #nav.nav .nav-links { gap:12px; }
 #nav.nav .nav-links a { letter-spacing:.17em; }
}
/* The extra header control needs the existing drawer earlier on tablet widths. */
@media(min-width:901px) and (max-width:1200px) {
 #nav.nav .nav-links { display:none; }
 #nav.nav .nav-actions { margin-left:auto; }
 #nav.nav .nav-toggle { display:flex;flex-direction:column;gap:5px;width:44px;height:44px;align-items:center;justify-content:center;background:transparent;border:0;cursor:pointer;padding:10px;margin:-10px;position:relative;z-index:51;flex-shrink:0; }
 #nav.nav .nav-toggle span { display:block;width:22px;height:1.5px;background:var(--spectral); }
 #nav.nav .nav-toggle[aria-expanded="true"] span:nth-child(1){transform:translateY(6.5px) rotate(45deg)}
 #nav.nav .nav-toggle[aria-expanded="true"] span:nth-child(2){opacity:0}
 #nav.nav .nav-toggle[aria-expanded="true"] span:nth-child(3){transform:translateY(-6.5px) rotate(-45deg)}
 #navDrawer.nav-drawer { display:flex;position:fixed;top:0;right:0;width:min(360px,88vw);height:100dvh;background:rgba(0,0,0,.96);z-index:49;transform:translateX(100%);transition:transform .35s var(--ease);padding:96px 32px 32px;flex-direction:column;border-left:1px solid var(--hair);overflow-y:auto; }
 #navDrawer.nav-drawer[aria-hidden="false"] { transform:translateX(0); }
 #navDrawer .nav-drawer-links { display:flex;flex-direction:column;gap:0; }
 #navDrawer .nav-drawer-links a { font:400 12px var(--mono);letter-spacing:.22em;text-transform:uppercase;color:var(--mute-1);padding:18px 0;border-bottom:1px solid var(--hair);min-height:44px;display:flex;align-items:center;text-decoration:none; }
 #navDrawer .nav-drawer-login,#navDrawer .nav-drawer-register { margin-top:24px;border:1px solid var(--ghost-bd);border-radius:32px;padding:14px 18px;justify-content:center;color:var(--spectral); }
 #navDrawer .nav-drawer-register { background:var(--spectral);color:var(--black); }
 #navDrawer .nav-drawer-register+.nav-drawer-login { margin-top:12px; }
}
.language-preference{position:fixed;bottom:18px;left:18px;z-index:9999;max-width:calc(100vw - 190px);display:flex;flex-wrap:wrap;gap:10px;background:#0b1a2b;border:1px solid #93a0b4;border-radius:8px;padding:12px;font:14px/1.5 system-ui,sans-serif;color:#f4f1ea}
.language-preference a{color:#fff;text-decoration:underline}
.language-preference button{border:0;background:none;color:#c9b079;cursor:pointer;font:inherit}
html:not([lang=en]) h1,html:not([lang=en]) h2,html:not([lang=en]) h3{overflow-wrap:break-word;hyphens:auto}
html:not([lang=en]) .nav-links{gap:clamp(8px,1.6vw,24px)}
html:not([lang=en]) .nav-links a{font-size:clamp(10px,.85vw,13px)}
html:not([lang=en]) .btn,html:not([lang=en]) button{white-space:normal}
html[lang=th] body,html[lang=th] input,html[lang=th] select,html[lang=th] textarea,html[lang=th] button,html[lang=th] h1,html[lang=th] h2,html[lang=th] h3,html[lang=th] p,html[lang=th] a{font-family:'Noto Sans Thai',system-ui,sans-serif!important;letter-spacing:normal!important}
html[lang=th] h1,html[lang=th] h2,html[lang=th] h3{line-height:1.35!important}
html[lang=th] p,html[lang=th] .micro{line-height:1.8}
@media(max-width:800px){.language-preference{left:12px;bottom:65px;max-width:calc(100vw - 24px)}}