/* ══════════════════════════════════════════════════════════════════════
   BUILD 120:多语言的字体与排版 + 语言选择器
   原来四套字体全是「纯拉丁」子集 —— 连越南文的声调符号都没有(ế ữ ậ),
   泰 / 缅 / 高棉 / 孟加拉 更是一个字形都没有。这里按文字补齐。
   每个 @font-face 都带 unicode-range:**浏览器只在页面真的出现那种文字时才下载**,
   所以只玩英文 / 中文的人一个字节都不多花。
   ══════════════════════════════════════════════════════════════════════ */

/* ── 越南文:Chakra Petch 官方越南文子集(3.7 KB)── */
@font-face{font-family:"Chakra Petch";font-style:normal;font-weight:600;font-display:swap;
  src:url(fonts/chakra-petch-vietnamese-600-normal.woff2?v=a6bc279a) format("woff2");
  unicode-range:U+0102-0103,U+0110-0111,U+0128-0129,U+0168-0169,U+01A0-01A1,U+01AF-01B0,U+0300-0301,U+0303-0304,U+0308-0309,U+0323,U+0329,U+1EA0-1EF9,U+20AB}
@font-face{font-family:"Chakra Petch";font-style:normal;font-weight:700;font-display:swap;
  src:url(fonts/chakra-petch-vietnamese-700-normal.woff2?v=fca8b4a7) format("woff2");
  unicode-range:U+0102-0103,U+0110-0111,U+0128-0129,U+0168-0169,U+01A0-01A1,U+01AF-01B0,U+0300-0301,U+0303-0304,U+0308-0309,U+0323,U+0329,U+1EA0-1EF9,U+20AB}
/* ── 拉丁扩展:印尼 / 马来 / 菲律宾 / 土耳其式重音,以及越南文用到的一部分 ── */
@font-face{font-family:"Chakra Petch";font-style:normal;font-weight:600;font-display:swap;
  src:url(fonts/chakra-petch-latin-ext-600-normal.woff2?v=8eb6de0d) format("woff2");
  unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:"Chakra Petch";font-style:normal;font-weight:700;font-display:swap;
  src:url(fonts/chakra-petch-latin-ext-700-normal.woff2?v=9cc6078d) format("woff2");
  unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}
/* ── 泰文:Chakra Petch 本来就是泰国字体厂做的,有官方泰文子集,和拉丁部分同一套骨架 ── */
@font-face{font-family:"Chakra Petch";font-style:normal;font-weight:600;font-display:swap;
  src:url(fonts/chakra-petch-thai-600-normal.woff2?v=5846bdb2) format("woff2");
  unicode-range:U+02D7,U+0303,U+0331,U+0E01-0E5B,U+200C-200D,U+25CC}
@font-face{font-family:"Chakra Petch";font-style:normal;font-weight:700;font-display:swap;
  src:url(fonts/chakra-petch-thai-700-normal.woff2?v=5f5b544a) format("woff2");
  unicode-range:U+02D7,U+0303,U+0331,U+0E01-0E5B,U+200C-200D,U+25CC}
/* ── Cinzel(牌桌 / 番摊那些大数字)补拉丁扩展 ── */
@font-face{font-family:"Cinzel";font-style:normal;font-weight:700;font-display:swap;
  src:url(fonts/cinzel-latin-ext-700-normal.woff2?v=36bda3c0) format("woff2");
  unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:"Cinzel";font-style:normal;font-weight:900;font-display:swap;
  src:url(fonts/cinzel-latin-ext-900-normal.woff2?v=82d1d12d) format("woff2");
  unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}

/* ── 缅文 / 高棉文 / 孟加拉文:Chakra Petch 没有这些文字,用 Noto。
      同样带 unicode-range,只有页面上真的出现那种文字才会下载(各 22 – 48 KB)。 ── */
@font-face{font-family:"ACE Myanmar";font-style:normal;font-weight:400;font-display:swap;
  src:url(fonts/noto-sans-myanmar-myanmar-400-normal.woff2?v=945e8174) format("woff2");
  unicode-range:U+1000-109F,U+200C-200D,U+25CC,U+A92E,U+A9E0-A9FE,U+AA60-AA7F,U+116D0-116E3}
@font-face{font-family:"ACE Myanmar";font-style:normal;font-weight:700;font-display:swap;
  src:url(fonts/noto-sans-myanmar-myanmar-700-normal.woff2?v=dbeeaee6) format("woff2");
  unicode-range:U+1000-109F,U+200C-200D,U+25CC,U+A92E,U+A9E0-A9FE,U+AA60-AA7F,U+116D0-116E3}
@font-face{font-family:"ACE Khmer";font-style:normal;font-weight:400;font-display:swap;
  src:url(fonts/noto-sans-khmer-khmer-400-normal.woff2?v=9b5e0cfa) format("woff2");
  unicode-range:U+1780-17FF,U+19E0-19FF,U+200C-200D,U+25CC}
@font-face{font-family:"ACE Khmer";font-style:normal;font-weight:700;font-display:swap;
  src:url(fonts/noto-sans-khmer-khmer-700-normal.woff2?v=8098b2e7) format("woff2");
  unicode-range:U+1780-17FF,U+19E0-19FF,U+200C-200D,U+25CC}
@font-face{font-family:"ACE Bengali";font-style:normal;font-weight:400;font-display:swap;
  src:url(fonts/noto-sans-bengali-bengali-400-normal.woff2?v=c79bd74e) format("woff2");
  unicode-range:U+0951-0952,U+0964-0965,U+0980-09FE,U+1CD0,U+1CD2,U+1CD5-1CD6,U+1CD8,U+1CE1,U+1CEA,U+1CED,U+1CF2,U+1CF5-1CF7,U+200C-200D,U+20B9,U+25CC,U+A8F1}
@font-face{font-family:"ACE Bengali";font-style:normal;font-weight:700;font-display:swap;
  src:url(fonts/noto-sans-bengali-bengali-700-normal.woff2?v=cfe55262) format("woff2");
  unicode-range:U+0951-0952,U+0964-0965,U+0980-09FE,U+1CD0,U+1CD2,U+1CD5-1CD6,U+1CD8,U+1CE1,U+1CEA,U+1CED,U+1CF2,U+1CF5-1CF7,U+200C-200D,U+20B9,U+25CC,U+A8F1}

/* ── 按文字调排版 ────────────────────────────────────────────────────
   缅 / 高棉 / 孟加拉 / 泰 这四种文字的字母上下都挂符号,原来那套「字间距 + 紧行高 + 全大写」
   会把字拆开、把符号切掉。这几种语言全站关掉字间距、放宽行高、不转大写。 */
html[data-script="mymr"]{--i18nfont:"ACE Myanmar"}
html[data-script="khmr"]{--i18nfont:"ACE Khmer"}
html[data-script="beng"]{--i18nfont:"ACE Bengali"}
html[data-script="mymr"] body,html[data-script="khmr"] body,html[data-script="beng"] body{font-family:var(--i18nfont),"Chakra Petch",sans-serif}
html[data-script="mymr"] #app,html[data-script="khmr"] #app,html[data-script="beng"] #app{
  --display:var(--i18nfont),"Chakra Petch",sans-serif;
  --toon:var(--i18nfont),"Chakra Petch",sans-serif}
/* 数字照旧用 Chakra Petch(等宽、对得齐),这几种文字的数字也是阿拉伯数字 */
html[data-script="mymr"] #app,html[data-script="khmr"] #app,html[data-script="beng"] #app{--num:"Chakra Petch",ui-monospace,sans-serif}
html[data-script="mymr"] #app *,html[data-script="khmr"] #app *,html[data-script="beng"] #app *,
html[data-script="thai"] #app *{letter-spacing:normal!important;text-transform:none!important}
html[data-script="mymr"] #app,html[data-script="khmr"] #app,html[data-script="beng"] #app{line-height:1.7}
html[data-script="thai"] #app{line-height:1.6}
/* 这四种文字比拉丁高,标题行别压太扁,免得上下的符号被切掉 */
html[data-script="mymr"] #app h1,html[data-script="khmr"] #app h1,html[data-script="beng"] #app h1,html[data-script="thai"] #app h1,
html[data-script="mymr"] #app .actitle,html[data-script="khmr"] #app .actitle,html[data-script="beng"] #app .actitle,html[data-script="thai"] #app .actitle,
html[data-script="mymr"] #app .rn,html[data-script="khmr"] #app .rn,html[data-script="beng"] #app .rn,html[data-script="thai"] #app .rn{line-height:1.5;overflow:visible}
/* 越南文:声调堆两层,按钮和标题也要多留一点高度 */
html[data-lang="vi"] #app .btn,html[data-lang="vi"] #app .sctab,html[data-lang="vi"] #app .cat b{line-height:1.45}
/* 这几种语言的词比中文长很多,按钮里的字宁可换行也不要溢出 */
html:not([data-lang="zh"]):not([data-lang="zh-TW"]):not([data-lang="en"]) #app .btn,
html:not([data-lang="zh"]):not([data-lang="zh-TW"]):not([data-lang="en"]) #app .sctab{white-space:normal;word-break:break-word}

/* BUILD 190:切语言不再整页变暗、锁住(以前语言包下载时整页 55% + 点不动,老板:「很卡」)——
   只在顶栏语言键上转个小圈;打开菜单那一刻已经在预取,多数时候根本看不到这个圈 */

/* ── 语言按钮 / 语言选择弹窗 ─────────────────────────────────────── */
#app .langbtn{font-family:var(--num);font-weight:700;font-size:12px;letter-spacing:.02em;color:var(--gold2);
  display:inline-flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;position:relative}
#app .langbtn span{display:block;line-height:1;font-size:10.5px}
#app .langbtn .lgl{width:13px;height:13px;flex:0 0 auto;opacity:.72}
html[data-lang-loading] #app .langbtn::after{content:"";position:absolute;inset:3px;border-radius:50%;border:2px solid rgba(243,221,142,.25);
  border-top-color:var(--gold2);animation:langspin .8s linear infinite;pointer-events:none}
@media(prefers-reduced-motion:reduce){html[data-lang-loading] #app .langbtn::after{animation:none}}
/* 语言菜单在最上层:以前和抽屉同一层(抽屉在后面盖住它)、比规则页低一层 —— 从「设置 → 语言」「规则页右上角」点开都看不见 */
#app #langModal{z-index:92}
/* BUILD 190:就近弹出的小菜单(贴着点开它的那个键,不再是整屏弹窗):背景透明,点菜单外面收起 */
#app #langModal.pop{background:transparent;backdrop-filter:none;-webkit-backdrop-filter:none;padding:0}
#app #langModal.pop.on{display:block}
#app #langModal.pop .langcard{position:absolute;max-width:none;max-height:none;overflow:visible;padding:6px;border-radius:16px;
  background:linear-gradient(160deg,rgba(255,255,255,.07),rgba(255,255,255,.02) 60%),rgba(10,13,26,.97);
  backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);
  box-shadow:0 18px 48px rgba(0,0,0,.6),0 0 0 1px rgba(243,221,142,.22);animation:langpop .14s ease-out;transform-origin:top right}
#app #langModal.pop .topuphead,#app #langModal.pop .tuchint{display:none}
#app #langModal.pop .langlist{margin:0;gap:4px;max-height:none;overflow:visible}
#app #langModal.pop .langrow{padding:8px 10px;border-radius:11px;min-height:48px}
#app #langModal.pop .langrow .lcode{flex-basis:34px;height:28px}
@keyframes langpop{from{opacity:0;transform:translateY(-4px) scale(.97)}to{opacity:1;transform:none}}
@media(prefers-reduced-motion:reduce){#app #langModal.pop .langcard{animation:none}}
#app .langpick{display:inline-flex;align-items:center;gap:6px}
#app .langpick i{font-style:normal;max-width:130px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
#app .langpick .chev{opacity:.6}
#app .langcard{max-width:380px}
#app .langlist{display:flex;flex-direction:column;gap:6px;max-height:60vh;overflow-y:auto;-webkit-overflow-scrolling:touch;margin:4px 0 2px}
#app .langrow{display:flex;align-items:center;gap:10px;width:100%;padding:10px 12px;border-radius:13px;border:1px solid var(--stroke);
  background:rgba(255,255,255,.03);color:var(--ink);cursor:pointer;text-align:left;-webkit-tap-highlight-color:transparent;transition:border-color .15s,background .15s}
#app .langrow:active{transform:scale(.99)}
#app .langrow .lcode{flex:0 0 38px;height:30px;display:grid;place-items:center;border-radius:9px;background:rgba(255,255,255,.06);
  font-family:var(--num);font-weight:700;font-size:12px;color:var(--muted)}
#app .langrow .lname{flex:1;min-width:0;display:flex;flex-direction:column;gap:1px}
#app .langrow .lname b{font-size:14.5px;font-weight:700;line-height:1.35;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
#app .langrow .lname i{font-style:normal;font-family:var(--display);font-size:10px;letter-spacing:.04em;color:var(--dim)}
#app .langrow .ltick{flex:0 0 auto;opacity:0;color:var(--money2);font-weight:700}
#app .langrow.on{border-color:rgba(243,221,142,.6);background:rgba(243,221,142,.1)}
#app .langrow.on .lcode{background:var(--accgrad);color:#06121a}
#app .langrow.on .ltick{opacity:1}
#app .langrow.loading{opacity:.6}
#app .langrow.loading .ltick{opacity:1;animation:langspin .8s linear infinite}
@keyframes langspin{to{transform:rotate(360deg)}}
/* 列表里每一行都用自己的文字显示,所以这几行也要按文字换字体 */
#app .langrow[data-script="mymr"] .lname b{font-family:"ACE Myanmar",sans-serif}
#app .langrow[data-script="khmr"] .lname b{font-family:"ACE Khmer",sans-serif}
#app .langrow[data-script="beng"] .lname b{font-family:"ACE Bengali",sans-serif}
#app .langrow[data-script="thai"] .lname b,#app .langrow[data-script="han"] .lname b{letter-spacing:normal}
@media(max-width:360px){#app .langrow{padding:9px 10px}#app .langrow .lname b{font-size:13.5px}}
@media(prefers-reduced-motion:reduce){#app .langrow.loading .ltick{animation:none}}

/* ── 顶栏在长词语言下别挤爆 ───────────────────────────────────────────
   「充值」两个字,到越南文是 Nạp chip、到印尼文是 Isi ulang、到孟加拉文更长,
   钱包那一块会顶到语言键上。让钱包可以缩、里面的字省略号,语言键和图标键不缩。 */
#app .top .wallet{min-width:0;flex:0 1 auto;overflow:hidden}
#app .top .wallet .wv{flex:0 0 auto;white-space:nowrap}   /* 余额是最重要的数字,永远不许被压缩 */
#app .top .icb,#app .top .langbtn{flex:0 0 auto}
/* 长词语言(充值 → Nạp chip / Isi ulang / …)在窄屏上会把余额挤没。
   先收起「21ACE」这个字标(logo 图还在,认得出来),再不够才收起「充值」两个字 —— 功能永远排在装饰前面。 */
@media(max-width:430px){
  html:not([data-lang="zh"]):not([data-lang="zh-TW"]) #app .top .bn{display:none}
  /* 「充值」在中文是两个字,到别的语言是一整个词组 —— 窄屏上只留金色的「+」,
     圆牌本身已经够认;点开的弹窗里写全。宁可没有字,也不要切一半的字。 */
  html:not([data-lang="zh"]):not([data-lang="zh-TW"]) #app .top .topupbtn i{display:none}
  html:not([data-lang="zh"]):not([data-lang="zh-TW"]) #app .top .topupbtn{padding:0 9px}
}
#app .langbtn{width:38px;padding:0}
@media(max-width:360px){#app .langbtn{width:34px;font-size:11px}}
/* BUILD 190:官网首页每段上面的小标题改成按语言写;中文字间距收一点(英文大写那套 .3em 放到汉字上太散) */
html[data-script="han"] #app .lk{letter-spacing:.16em}