/* ============================================================================
   tokyo.axiom.yoga — inner pages
   Same design system as the landing page: the seven ink/bone/vermilion tokens,
   the same three easing curves, the same pad and nav height, the same type
   scale. What is deliberately NOT here is the WebGL layer: inner pages are
   documents, so they get typography and rules instead of a 3D scene.
   ========================================================================== */
:root{
  --ink:#05070a; --ink-2:#0a0e12;
  --bone:#dfe7e0; --bone-dim:#aab4ad; --muted:#78837c;
  --line:rgba(223,231,224,.13); --line-soft:rgba(223,231,224,.07);
  --vermilion:#e0231c; --ember:#ff5a3c; --gold:#c9a24a;
  --pad:clamp(20px, 3.4vw, 56px); --nav-h:84px; --maxw:1180px;
  --ease:cubic-bezier(.22,.61,.36,1);
  --ease-out:cubic-bezier(.16,1,.3,1);
  --ease-io:cubic-bezier(.65,0,.35,1);
}
*,*::before,*::after{ box-sizing:border-box; }
html{ -webkit-text-size-adjust:100%; scroll-behavior:smooth; }
body{
  margin:0; background:var(--ink); color:var(--bone-dim);
  font-family:'NotoJP','Onest',system-ui,sans-serif;
  font-size:15px; line-height:1.75; letter-spacing:.01em;
  -webkit-font-smoothing:antialiased; overflow-x:hidden;
}
/* the paper grain the landing page uses, at a quarter of its strength */
body::before{
  content:''; position:fixed; inset:0; z-index:0; pointer-events:none; opacity:.05;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='140' height='140'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.82' numOctaves='3'/%3E%3C/filter%3E%3Crect width='140' height='140' filter='url(%23n)' opacity='.55'/%3E%3C/svg%3E");
}
main,header,footer{ position:relative; z-index:1; }
a{ color:inherit; text-decoration:none; }
img{ display:block; max-width:100%; }
button{ font:inherit; color:inherit; background:none; border:0; cursor:pointer; }
:where(a,button):focus-visible{ outline:2px solid var(--bone); outline-offset:3px; border-radius:2px; }
.sr{ position:absolute; width:1px; height:1px; overflow:hidden; clip-path:inset(50%); white-space:nowrap; }
/* v3.3：跳过链接只在聚焦时显形——原来没有这条，键盘用户 Tab 到它看不见（WCAG 2.4.7） */
.sr:focus, .sr:focus-visible{
  position:fixed; left:14px; top:12px; z-index:999;
  width:auto; height:auto; overflow:visible; clip-path:none; white-space:normal;
  padding:10px 16px; border-radius:2px;
  background:var(--bone); color:var(--ink);
  font-size:12px; letter-spacing:.04em; text-decoration:none;
}

/* ----------------------------------------------------------------- nav */
.nav{
  position:fixed; inset:0 0 auto; z-index:60; height:var(--nav-h);
  display:flex; align-items:center; gap:clamp(12px,2vw,34px);
  padding:0 var(--pad);
  border-bottom:1px solid var(--line-soft);
  background:rgba(5,7,10,.82);
  -webkit-backdrop-filter:blur(14px) saturate(1.1); backdrop-filter:blur(14px) saturate(1.1);
}
.brand{ display:flex; align-items:center; gap:11px; flex:0 0 auto; }
.brand svg{ width:26px; height:34px; }
.brand-tx{ display:flex; flex-direction:column; line-height:1.15; }
.brand-tx b{ font-family:'Wordmark','Onest',sans-serif; font-size:15px; font-weight:400; letter-spacing:.16em; color:var(--bone); }
.brand-tx i{ font-style:normal; font-size:9px; letter-spacing:.22em; color:var(--muted); }
.nav-links{ display:flex; align-items:center; gap:clamp(14px,2.2vw,30px); margin-left:auto; }
.nav-links a, .nav-links span{ font-size:11px; letter-spacing:.16em; text-transform:uppercase; color:var(--bone-dim); transition:color .3s; white-space:nowrap; }
.nav-links a:hover, .nav-links a[aria-current]{ color:var(--bone); }
.nav-links span.soon{ color:var(--muted); opacity:.45; cursor:default; }
.nav-tools{ display:flex; align-items:center; gap:10px; margin-left:clamp(12px,2vw,30px); }
.lang-sw{ display:flex; align-items:center; border:1px solid var(--line); border-radius:2px; }
.lang-sw a{ padding:5px 9px; font-size:9.5px; letter-spacing:.1em; color:var(--muted); transition:color .3s, background .3s; }
.lang-sw a:hover{ color:var(--bone); }
.lang-sw a[aria-current]{ color:var(--ink); background:var(--bone); }

/* ----------------------------------------------------------- page head */
.phead{
  max-width:var(--maxw); margin:0 auto; padding:calc(var(--nav-h) + clamp(56px,9vh,120px)) var(--pad) clamp(38px,6vh,70px);
}
.eyebrow{ display:flex; align-items:center; gap:10px; font-size:10px; letter-spacing:.26em; text-transform:uppercase; color:var(--muted); margin:0 0 22px; }
.eyebrow::before{ content:''; width:6px; height:6px; border-radius:50%; background:var(--vermilion); flex:0 0 auto; }
.phead h1{
  margin:0; font-size:clamp(34px,5.2vw,68px); line-height:1.08; font-weight:400;
  letter-spacing:.01em; color:var(--bone);
}
.phead .lead{ margin:22px 0 0; max-width:62ch; font-size:clamp(13px,1.1vw,15px); line-height:1.95; color:var(--bone-dim); }
.phead .meta{ margin:26px 0 0; padding-top:18px; border-top:1px solid var(--line-soft);
  display:flex; flex-wrap:wrap; gap:10px 26px; font-size:10.5px; letter-spacing:.16em; text-transform:uppercase; color:var(--muted); }
.phead .meta b{ color:var(--bone-dim); font-weight:400; }

/* ------------------------------------------------------------- section */
.psec{ max-width:var(--maxw); margin:0 auto; padding:clamp(30px,5vh,58px) var(--pad); }
.psec + .psec{ border-top:1px solid var(--line-soft); }
.psec-h{ display:flex; align-items:baseline; gap:16px; margin:0 0 clamp(20px,3vh,32px); }
.psec-h .n{ font-size:10px; letter-spacing:.2em; color:var(--vermilion); font-variant-numeric:tabular-nums; }
.psec-h h2{ margin:0; font-size:clamp(17px,1.5vw,21px); font-weight:400; letter-spacing:.06em; color:var(--bone); }
.psec-h .note{ margin-left:auto; font-size:10px; letter-spacing:.14em; text-transform:uppercase; color:var(--muted); }

/* -------------------------------------------------------- download card */
.dlc{
  display:grid; grid-template-columns:minmax(0,1fr) auto; gap:clamp(20px,3vw,44px);
  align-items:end; padding:clamp(22px,3vw,34px);
  border:1px solid var(--line); border-radius:3px;
  background:linear-gradient(180deg, rgba(223,231,224,.035), rgba(223,231,224,.008));
}
.dlc .file{ font-family:'Onest',system-ui,sans-serif; font-size:clamp(15px,1.6vw,20px);
  letter-spacing:.02em; color:var(--bone); word-break:break-all; }
.dlc .sub{ margin:10px 0 0; font-size:12px; color:var(--muted); letter-spacing:.06em; }
.dlc .specs{ margin:22px 0 0; display:flex; flex-wrap:wrap; gap:12px 34px; }
.dlc .specs div{ display:flex; flex-direction:column; gap:3px; }
.dlc .specs dt{ margin:0; font-size:9px; letter-spacing:.18em; text-transform:uppercase; color:var(--muted); }
.dlc .specs dd{ margin:0; font-size:12.5px; color:var(--bone-dim); font-variant-numeric:tabular-nums; }
.btn{
  display:inline-flex; align-items:center; justify-content:center; gap:9px;
  min-height:54px; padding:0 26px; border-radius:100px;
  border:1px solid rgba(223,231,224,.34); background:rgba(5,7,10,.55);
  color:var(--bone); font-size:11px; letter-spacing:.2em; text-transform:uppercase;
  transition:background .35s, border-color .35s, color .35s;
}
.btn:hover{ background:var(--bone); border-color:var(--bone); color:var(--ink); }
.btn--solid{ background:var(--bone); border-color:var(--bone); color:var(--ink); }
.btn--solid:hover{ background:var(--vermilion); border-color:var(--vermilion); color:#fff; }

/* ------------------------------------------------------------ md5 block */
.md5{ margin:clamp(20px,3vh,30px) 0 0; border:1px solid var(--line-soft); border-radius:3px; overflow:hidden; }
.md5 .row{ display:flex; align-items:center; gap:14px; padding:14px 18px; background:rgba(223,231,224,.02); }
.md5 code{ flex:1 1 auto; font-family:ui-monospace,SFMono-Regular,Menlo,monospace;
  font-size:12.5px; letter-spacing:.04em; color:var(--bone); word-break:break-all; }
.md5 .cp{ flex:0 0 auto; padding:5px 12px; border:1px solid var(--line); border-radius:2px;
  font-size:9.5px; letter-spacing:.16em; text-transform:uppercase; color:var(--muted); transition:.3s; }
.md5 .cp:hover{ color:var(--bone); border-color:rgba(223,231,224,.4); }
.md5 .cp.ok{ color:var(--ink); background:var(--bone); border-color:var(--bone); }
.md5 .hint{ padding:0 18px 15px; font-size:11.5px; line-height:1.85; color:var(--muted); }
.md5 .hint code{ font-size:11px; color:var(--bone-dim); }

/* --------------------------------------------------------------- specs */
.specs2{ display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:clamp(16px,2vw,28px); }
.specs2 > div{ border:1px solid var(--line-soft); border-radius:3px; padding:20px 22px; }
.specs2 h3{ margin:0 0 16px; font-size:10px; letter-spacing:.22em; text-transform:uppercase; color:var(--muted); }
.specs2 dl{ margin:0; display:grid; grid-template-columns:auto 1fr; gap:9px 18px; font-size:12.5px; }
.specs2 dt{ color:var(--muted); }
.specs2 dd{ margin:0; color:var(--bone-dim); }
.specs2 > div:last-child{ border-color:rgba(201,162,74,.28); }
.specs2 > div:last-child h3{ color:var(--gold); }

/* --------------------------------------------------------------- steps */
.steps{ list-style:none; margin:0; padding:0; display:grid; gap:1px; background:var(--line-soft); border:1px solid var(--line-soft); border-radius:3px; overflow:hidden; }
.steps li{ background:var(--ink); padding:clamp(18px,2.4vw,26px); display:grid; grid-template-columns:auto 1fr; gap:clamp(14px,2vw,26px); align-items:start; }
.steps .n{ font-family:'Onest',sans-serif; font-size:clamp(20px,2vw,26px); line-height:1; color:var(--vermilion); font-variant-numeric:tabular-nums; }
.steps h3{ margin:0 0 7px; font-size:13.5px; font-weight:500; letter-spacing:.04em; color:var(--bone); }
.steps p{ margin:0; font-size:12.5px; line-height:1.9; color:var(--muted); }
.steps code{ font-family:ui-monospace,Menlo,monospace; font-size:11.5px; color:var(--bone-dim);
  background:rgba(223,231,224,.06); padding:1px 6px; border-radius:2px; }

/* -------------------------------------------------------------- footer */
.foot{ position:relative; max-width:var(--maxw); margin:clamp(40px,7vh,90px) auto 0; padding:clamp(30px,4vh,50px) var(--pad) clamp(30px,5vh,56px); }
/* v12.9 —— 页脚顶线改为**整屏 100% 宽**（用户指定）：原本跟着 .foot 的 1180px 容器走，只在中间一段。
   现在用 ::before 铺满视口宽度：left:50% + margin-left:-50vw 以页脚中心为基准向两侧各撑 50vw。
   body 已有 overflow-x:hidden（inner.css:24），所以 100vw 不会带出横向滚动条。
   原 border-top 同时撤掉，否则会叠成两条线。 */
.foot::before{
  content:''; position:absolute; top:0; left:50%; width:100vw; margin-left:-50vw;
  height:1px; background:var(--line-soft); pointer-events:none;
}
.foot-top{ display:flex; flex-wrap:wrap; gap:clamp(20px,4vw,60px); justify-content:space-between; }
.foot-brand{ max-width:34ch; }
.foot-brand b{ display:block; font-family:'Wordmark','Onest',sans-serif; font-size:14px; letter-spacing:.18em; color:var(--bone); margin-bottom:10px; }
.foot-brand p{ margin:0; font-size:11.5px; line-height:1.9; color:var(--muted); }
/* v11.7 —— 页脚左侧补简介 / 地址 / 两个入口（用户 8 图·图一）；版权行的 AXIOM.YOGA 走主题红（图四） */
.foot-brand .foot-intro{ margin-top:14px; max-width:38ch; }
.foot-brand .foot-addr{ margin-top:8px; font-size:10.5px; letter-spacing:.06em; color:var(--muted); opacity:.72; }
.foot-brand .foot-links{ margin-top:12px; display:flex; gap:18px; }
.foot-brand .foot-links a{ font-size:11.5px; letter-spacing:.04em; color:var(--bone-dim); border-bottom:1px solid var(--line-soft); padding-bottom:2px; transition:color .3s, border-color .3s; }
.foot-brand .foot-links a:hover{ color:var(--bone); border-color:var(--bone-dim); }
/* v12.5 —— 底栏只保留左段金色；右段（夜は、まだ終わらない · 版本号）用户要求**取消红色**，回落到默认 muted。 */
.foot-bot .fb-copy{ color:var(--gold); }
/* v12.7 —— 只有版本号这段标红（内页），口号仍是 muted；首页不动 */
.foot-bot .fb-num{ color:var(--vermilion); font-weight:400; }
.foot-cols{ display:flex; gap:clamp(24px,4vw,56px); }
.foot-cols h4{ margin:0 0 12px; font-size:9px; letter-spacing:.22em; text-transform:uppercase; color:var(--muted); }
.foot-cols ul{ list-style:none; margin:0; padding:0; display:grid; gap:9px; }
.foot-cols a, .foot-cols span{ font-size:11.5px; letter-spacing:.04em; color:var(--bone-dim); transition:color .3s; }
.foot-cols a:hover{ color:var(--bone); }
.foot-bot{ margin-top:clamp(26px,4vh,46px); padding-top:18px; border-top:1px solid var(--line-soft);
  display:flex; flex-wrap:wrap; gap:10px 24px; justify-content:space-between;
  font-size:9.5px; letter-spacing:.14em; text-transform:uppercase; color:var(--muted); }

/* ------------------------------------------------------------ responsive */
@media (max-width:900px){
  .dlc{ grid-template-columns:1fr; align-items:start; }
  .dlc .btn{ width:100%; }
  .specs2{ grid-template-columns:1fr; }
  .nav-links{ display:none; }
}
@media (max-width:620px){
  .phead{ padding-top:calc(var(--nav-h) + 40px); }
  /* on a phone the copy button steals enough width to break the hash in two:
     give the value its own line and drop the button under it */
  .md5 .row{ flex-wrap:wrap; gap:10px; }
  .md5 code{ width:100%; font-size:11px; letter-spacing:.02em; }
  .md5 .cp{ margin-left:auto; }
  .steps li{ grid-template-columns:1fr; gap:10px; }
  /* v13.1 —— ⚠️ 这里的 `.foot-cols` 规则**实际不起作用**：`shell.css` 里有同权重的 `.foot-cols`
     且后加载，层叠上压过本文件（本轮踩过一次：改这里页面没变化）。
     三列不换行的真正落点在 `shell.css` 的 `@media` 段；这里保留仅作记录，勿在此处改列数。 */
  .foot-cols h4{ margin-bottom:10px; }
  .foot-cols a{ font-size:11px; }
}
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{ animation-duration:.01ms !important; transition-duration:.01ms !important; scroll-behavior:auto !important; }
}

/* ============================ auth forms (login / register / …) ======== */
.auth{ max-width:436px; margin:0 auto; padding:calc(var(--nav-h) + clamp(46px,8vh,96px)) var(--pad) clamp(50px,8vh,90px); }
.auth h1{ margin:0 0 8px; font-size:clamp(24px,2.6vw,32px); font-weight:400; letter-spacing:.06em; color:var(--bone); }
.auth .sub{ margin:0 0 34px; font-size:12.5px; letter-spacing:.04em; color:var(--muted); }
.field{ margin:0 0 20px; }
.field label{ display:block; margin:0 0 8px; font-size:10px; letter-spacing:.2em; text-transform:uppercase; color:var(--muted); }
.field input{
  width:100%; height:50px; padding:0 16px; border-radius:3px;
  border:1px solid var(--line); background:rgba(223,231,224,.03);
  color:var(--bone); font:inherit; font-size:14px; letter-spacing:.02em;
  transition:border-color .3s, background .3s;
}
.field input:hover{ border-color:rgba(223,231,224,.26); }
.field input:focus{ outline:none; border-color:rgba(223,231,224,.55); background:rgba(223,231,224,.06); }
.field input::placeholder{ color:var(--muted); opacity:.6; }
.field.has-error input{ border-color:var(--vermilion); background:rgba(224,35,28,.06); }
.field .err{ margin:7px 0 0; font-size:11.5px; color:var(--ember); }
.alert{ margin:0 0 22px; padding:13px 16px; border-radius:3px; font-size:12.5px; line-height:1.7;
  border:1px solid rgba(224,35,28,.45); background:rgba(224,35,28,.10); color:#ffd9d3; }
.alert--ok{ border-color:rgba(201,162,74,.45); background:rgba(201,162,74,.10); color:#f0e0be; }
.auth .btn{ width:100%; margin-top:6px; }
.auth .alt{ margin:26px 0 0; padding-top:20px; border-top:1px solid var(--line-soft);
  display:flex; flex-wrap:wrap; gap:8px 18px; justify-content:space-between; font-size:11.5px; color:var(--muted); }
.auth .alt a{ color:var(--bone-dim); border-bottom:1px solid var(--line); padding-bottom:1px; transition:color .3s, border-color .3s; }
.auth .alt a:hover{ color:var(--bone); border-color:var(--bone); }
.cap{ display:flex; gap:12px; align-items:center; }
.cap img{ height:50px; width:auto; border-radius:3px; border:1px solid var(--line); }
.cap input{ flex:1 1 auto; }

/* ============================ ranking boards ============================ */
.race{ display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:clamp(14px,2vw,26px); }
.race > div{ border:1px solid var(--line-soft); border-radius:3px; padding:20px 22px; }
.race .k{ font-size:9px; letter-spacing:.22em; text-transform:uppercase; color:var(--muted); margin:0 0 10px; }
.race .v{ font-family:'Onest',sans-serif; font-size:clamp(24px,2.6vw,34px); line-height:1; color:var(--bone); font-variant-numeric:tabular-nums; }
.race .p{ margin:10px 0 0; font-size:11.5px; color:var(--muted); }
.race .bar{ margin:14px 0 0; height:3px; border-radius:2px; background:rgba(223,231,224,.10); overflow:hidden; }
.race .bar i{ display:block; height:100%; background:var(--bone); }
.race > div:last-child .bar i{ background:var(--vermilion); }
/* v2.10：`.rt` 表格规则已删净 —— 全站列表统一走 inc/tokyo-grid.php 的 .rk-grid。
   （.race-tag 迁到下面与网格同一处，仍被个人中心/排行榜的势力列使用） */
.race-tag{ font-size:9.5px; letter-spacing:.14em; text-transform:uppercase; color:var(--muted); }
@media (max-width:620px){
  .race{ grid-template-columns:1fr; }
}

/* ============================ hall of fame ============================= */
.hof{ display:grid; grid-template-columns:repeat(auto-fill,minmax(268px,1fr)); gap:clamp(12px,1.6vw,18px); }
.hof .c{ border:1px solid var(--line-soft); border-radius:3px; padding:18px 20px;
  background:linear-gradient(180deg, rgba(223,231,224,.028), rgba(223,231,224,.006)); }
.hof .cat{ display:inline-block; margin:0 0 12px; padding:3px 9px; border-radius:2px;
  font-size:9px; letter-spacing:.16em; text-transform:uppercase;
  border:1px solid rgba(223,231,224,.16); color:var(--muted); }
.hof .c[data-r="3"] .cat{ border-color:rgba(201,162,74,.5); color:var(--gold); }
.hof .c[data-r="1"] .cat{ border-color:rgba(224,35,28,.42); color:var(--ember); }
.hof .txt{ margin:0; font-size:13px; line-height:1.7; color:var(--bone); }
.hof .when{ margin:12px 0 0; font-size:10px; letter-spacing:.14em; text-transform:uppercase; color:var(--muted); }

/* ============================================================================
   共用润色层（v2.5 · T261020-07）
   「令牌对齐 + 每页一处招牌」批次：先把**所有内页都缺的那几样**补齐，各页的招牌
   再由自己的 css 收尾。这里只放跨页共用的东西，不放任何单页规则。
   ========================================================================== */

/* 1 · 聚焦光环：原来只换描边颜色，反差不够；补一圈极淡的外环（不是发光，是"纸面压痕"） */
.field input:focus,
.sp-search input:focus,
.hi-bar input[type=search]:focus,
.sp-new select:focus,
.sp-new textarea:focus,
.rc-method:has(input:focus-visible),
.rc-plan:has(input:focus-visible){ box-shadow:0 0 0 3px rgba(223,231,224,.09); }

/* 2 · 按钮三态补全：悬停（已有反相）→ 按下微缩 → 禁用不可点 */
.btn{ transition:background .3s, border-color .3s, color .3s, transform .18s var(--ease); }
/* 注意：布局层的磁吸脚本会给 .btn 写内联 transform，CSS 的 scale 在鼠标悬停时会被内联值压住，
   所以按下态再叠一个亮度变化，两种环境下都能看到反馈 */
.btn:active{ transform:scale(.994); filter:brightness(.95); }
.btn[disabled], .btn.is-off{ opacity:.4; pointer-events:none; }

/* 3 · 表格行悬停：左侧朱红细线 —— 与排行榜 .rk-grid-r 同一种回应，列表页统一 */
/* 行悬停的朱红细线：v2.10 起由 .rk-grid-r 承担（.rt 已退役） */
.rk-grid-r:hover{ box-shadow:inset 2px 0 0 var(--vermilion); }

/* 4 · 卡片光泽：**复用** shell.css 里追加 43 的那套 ::after 扫光，不再另起一套
   （v2.5 只修正它的选择器：原来扫在 .hof 容器与 .rc-plan-gold 数字上，不是卡片本身） */

/* 5 · 列表逐行错开进场：行上写 style="--i:N"，最多错 12 档（540ms），再长就同批进 */
@keyframes sig-row-in{ from{ opacity:0; transform:translate3d(0,6px,0); } to{ opacity:1; transform:none; } }
.sig-stagger tbody tr{
  animation:sig-row-in .6s var(--ease-out) both;
  animation-delay:calc(min(var(--i,0), 12) * 45ms);
}

/* 6 · 兑换码/单号一类"票号感"输入：等宽 + 字距 + 大写，和 rc-mono 同一族 */
.sig-code{
  font-family:ui-monospace,SFMono-Regular,Menlo,monospace !important;
  letter-spacing:.14em !important; text-transform:uppercase;
  font-size:15px !important;
}

/* ============================================================================
   v2.7 · 表单"即时反馈"（纯 CSS，靠 :user-invalid / :focus，不改任何结构）
   :user-invalid 只在用户**碰过**字段之后才命中，所以不会一进页面就满屏报错。
   ========================================================================== */
.field input:user-invalid,
.field select:user-invalid,
.field textarea:user-invalid{ border-color:rgba(224,35,28,.55); background:rgba(224,35,28,.05); }
.field:has(input:user-invalid) label,
.field:has(select:user-invalid) label{ color:#ff8a80; }
.field:has(input:focus) label,
.field:has(select:focus) label{ color:var(--bone-dim); }
/* 聚焦时把当前字段整块提亮一点，长表单里更不容易走丢 */
.field:has(input:focus), .field:has(select:focus), .field:has(textarea:focus){ position:relative; }
.field:has(input:focus) label::after,
.field:has(select:focus) label::after{ content:'·'; margin-left:6px; color:var(--vermilion); }

/* ---- v2.8 密码可见切换按钮（字段内右侧，不改变字段高度） ---- */
.field{ position:relative; }
.pw-eye{
  position:absolute; right:10px; top:35px; z-index:2;
  display:inline-grid; place-items:center; width:28px; height:28px;
  border:1px solid transparent; border-radius:2px; color:var(--muted);
  transition:color .25s, border-color .25s, background .25s;
}
.pw-eye:hover{ color:var(--bone); border-color:var(--line); background:rgba(223,231,224,.05); }
.pw-eye[aria-pressed="true"]{ color:var(--vermilion); border-color:rgba(224,35,28,.4); }
.field input[type="password"], .field input[type="text"]{ padding-right:46px; }

/* ============================================================================
   v2.9 · 共享列表排版（.rk-grid）：排行榜 / 充值记录 / 兑换 共用
   原先这套规则只在 ranking.css 里，账页仍是 <table class="rt">，于是同一个"列表"
   有两套手机规则，.rt 那套还不断被各页用 display:table-cell 救列。
   现在渲染器统一为 inc/tokyo-grid.php::tk_grid()，样式也收到这里。
   ========================================================================== */
.rt-scroll{ overflow-x:auto; -webkit-overflow-scrolling:touch; }
/* 名字沿用 .rt-scroll（tk_grid 的包裹层），内部已不再有 <table> */

/* 榜单用 grid 排版：表头与数据行共用 --cols 模板，列宽天然对齐 */
.rk-grid{ min-width:640px; }
.rk-grid-h, .rk-grid-r{
  display:grid; grid-template-columns:var(--cols); align-items:center;
  column-gap:clamp(10px,1.6vw,22px);
}
.rk-grid-h{
  padding:0 0 12px; border-bottom:1px solid var(--line);
  font-size:9px; letter-spacing:.2em; text-transform:uppercase; color:var(--muted);
}
.rk-grid-r{
  padding:11px 0; border-bottom:1px solid var(--line-soft);
  font-size:12.5px; color:var(--bone-dim);
  transition:background .25s;
}
.rk-grid-r:hover{ background:rgba(223,231,224,.035); }
/* v2.9：网格行与 .rt 的 sig-stagger 用同一套进场曲线（45ms/行、最多 12 档） */
.rk-grid-r{ animation:sig-row-in .6s var(--ease-out) both;
  animation-delay:calc(min(var(--i,0), 12) * 45ms); }
.rk-grid-r > span, .rk-grid-h > span{ overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.rk-grid .num{ font-variant-numeric:tabular-nums; color:var(--muted); }
.rk-grid .nm{ color:var(--bone); }
.rk-grid .lv{ font-variant-numeric:tabular-nums; color:var(--bone); }
.rk-grid-r.is-top1 .num, .rk-grid-r.is-top1 .lv{ color:var(--gold); }
.rk-grid-r.is-top .num{ color:var(--bone-dim); }
.rk-grid .race-tag{ font-size:9.5px; letter-spacing:.14em; text-transform:uppercase; color:var(--muted); }
/* ⚠️ v2.5 修：这里原来是「手机端只留前 3 列」的旧规则（nth-child(n+4) 隐藏），
   而下面那段卡式布局宣称"不砍列"。两段叠在一起时，旧规则的特异性更高
   （.rk-grid-r > span:nth-child(n+4) = 0,2,1 胜 .rk-grid-r > .col = 0,2,0），
   实测手机上金币榜只剩「金币」一列，等级/公会/势力全被吞掉。
   既然手机端已经是**卡片式**（不是表格），列宽由卡片自己排，就不该再隐藏任何列。 */
.rk-charts--one{ grid-template-columns:1fr; margin:0 0 clamp(16px,2.4vh,26px); }
/* v12.10 —— 「势力分布」页：种族分布那张图会紧贴上面的「大唐 / 罗马」两张卡。
   实测 1440 宽有 18px、**2300 宽为 0**（那点空隙并非显式声明，只是碰巧被别的边距撑出来的）。
   给 `.race` 之后的图表容器补一个明确的、随宽度稳定的上间距。 */
.race + .rk-charts{ margin-top:clamp(16px,2.4vh,26px); }

/* 手机端：不再砍列，改成卡片式（每行一张卡，带列名） */
@media (max-width:620px){
  .rk-grid{ min-width:0; }
  .rk-grid-h{ display:none; }
  .rk-grid-r{
    grid-template-columns:34px minmax(0,1fr);
    row-gap:6px; padding:14px 0;
  }
  /* ⚠️ v2.9 修：原来写 `.rk-grid-r > .num`，而**金额列也带 num 类** ⇒ 手机卡式里
     金额被当成"序号"拉到第一列单独占一行（实测账页首行只剩 ¥21.00 悬空）。
     序号永远是行的第一个子元素，因此收紧成 :first-child。 */
  .rk-grid-r > .num:first-child{ grid-column:1; grid-row:1 / span 8; align-self:start; padding-top:2px; }
  .rk-grid-r > .col{
    grid-column:2; display:flex; gap:10px; align-items:baseline;
    white-space:normal; overflow:visible; text-overflow:clip;
  }
  .rk-grid-r > .col::before{
    content:attr(data-label); flex:0 0 52px;
    font-size:9px; letter-spacing:.16em; text-transform:uppercase; color:var(--muted);
  }
  .rk-grid-r > .col.nm{ font-size:14px; }
  .rk-grid-r > .col.nm::before{ content:''; flex:0 0 0; }
}

/* 操作列（账页的 凭证/详情/继续）：网格里是一串链接，横排、可换行 */
.rk-grid .rk-acts{ display:flex; flex-wrap:wrap; gap:4px 14px; }
.rk-grid .rk-acts a{
  color:var(--bone-dim); border-bottom:1px solid var(--line); padding-bottom:1px;
  transition:color .25s, border-color .25s;
}
.rk-grid .rk-acts a:hover{ color:var(--bone); border-color:var(--bone); }

/* ============================================================================
   v3.10（T261022-08 P1）· 账户下拉菜单
   信息架构照抄主站（10 项），视觉用本站语言：无图标、无阴影堆叠、3px 圆角、
   悬停一条朱红细线。灰态（未上线条目）用 aria-disabled，不给 <a>。
   ============================================================================ */
.nav-user{ position:relative; }
.nav-user-btn{
  width:34px; height:34px; border-radius:50%; cursor:pointer;
  border:1px solid var(--line); background:rgba(223,231,224,.06); color:var(--bone);
  font:inherit; font-size:12px; letter-spacing:.04em;
  display:grid; place-items:center;
  transition:border-color .3s var(--ease), background .3s var(--ease), color .3s var(--ease);
}
.nav-user-btn:hover, .nav-user-btn[aria-expanded="true"]{
  border-color:rgba(223,231,224,.42); background:rgba(223,231,224,.11); color:var(--bone);
}
.nav-user-menu{
  position:absolute; right:0; top:calc(100% + 14px); z-index:60;
  min-width:228px; padding:8px;
  border:1px solid var(--line); border-radius:3px;
  background:rgba(8,11,15,.97);
  -webkit-backdrop-filter:blur(16px) saturate(1.1); backdrop-filter:blur(16px) saturate(1.1);
  box-shadow:0 24px 60px rgba(0,0,0,.55);
}
.nav-user-menu[hidden]{ display:none; }
.nav-user-hd{
  margin:2px 4px 8px; padding:6px 8px 10px; border-bottom:1px solid var(--line-soft);
  display:flex; flex-direction:column; gap:3px;
}
.nav-user-hd span{ font-size:9px; letter-spacing:.22em; text-transform:uppercase; color:var(--muted); }
.nav-user-hd b{ font-size:12.5px; font-weight:400; letter-spacing:.06em; color:var(--bone); }
.nav-user-menu a, .nav-user-menu .mi{
  display:block; padding:8px 10px; border-radius:2px;
  font-size:11px; letter-spacing:.12em; text-transform:uppercase; color:var(--bone-dim);
  text-decoration:none; transition:background .25s var(--ease), color .25s var(--ease), box-shadow .25s var(--ease);
}
.nav-user-menu a:hover, .nav-user-menu a:focus-visible{
  color:var(--bone); background:rgba(223,231,224,.06); box-shadow:inset 2px 0 0 var(--vermilion);
}
.nav-user-menu .is-soon{ color:var(--muted); opacity:.42; cursor:default; }
/* v11.11 —— 当前页条目不可点（渲染成 span），样式对齐可点的条目但去掉 hover 反馈 */
.nav-user-menu .is-cur{ color:var(--muted); cursor:default; box-shadow:inset 2px 0 0 var(--line); }
.nav-user-menu .is-temp::after{ content:'↗'; margin-left:8px; font-size:9px; opacity:.6; }
.nav-user-menu .is-sep{ height:1px; margin:7px 6px; background:var(--line-soft); padding:0; }
@media (max-width:520px){
  .nav-user-menu{ min-width:206px; right:-6px; }
}

/* T261023-09 v10.2 —— 金铢数值统一用金色（用户：「显示金铢数值的这个数字用金色」）。
   全站唯一工具类：只负责颜色与等宽数字，不改字号/字重（由所在位置的既有样式决定）。
   银铢/钻石/其它数值一律不用它，保持 bone。 */
.num-gold{
  /* 工具类必须压过局部规则：`account` 的 `.race .v` 是 3 个类选择器（0,3,0），
     单类 `.num-gold`（0,1,0）赢不了 ⇒ 这里用 !important。全站仅此工具类允许 !important。 */
  color:var(--gold) !important;
  font-variant-numeric:tabular-nums;
}

/* ============================================================================
   T261028-20 v19.6（≤900px）—— 语言切换在抽屉里「白块压字」
   根因：`.lang-sw a[aria-current]` 用 `background:var(--bone)`（近白）+ `color:var(--ink)`，
   桌面是个小胶囊没问题；进了手机抽屉后，容器窄、三格不等宽，白底块与文字错位，看起来像白块压住「中」。
   手机端改成**描边高亮**（不填白底），并强制不换行、等宽点击区。
   ============================================================================ */
@media (max-width: 900px){
  .lang-sw{ flex-wrap: nowrap; }
  .lang-sw a{
    white-space: nowrap;
    min-width: 34px;
    text-align: center;
  }
  .lang-sw a[aria-current]{
    background: transparent;
    color: var(--bone);
    box-shadow: inset 0 0 0 1px rgba(223, 231, 224, .5);
  }
}