/* 角色卡 · 三张共用。只放版式，内容在各页 */
:root{
  --bg:#070708; --ink:#EDE3CF; --dim:#8A8577; --sub:#9A9CA1; --sub2:#A2A4A9;
  --line:#24262A; --line2:#3A3D42; --gold:#C9A227;
  --mono:"Cascadia Mono","Consolas","Sarasa Mono SC",ui-monospace,monospace;
  --sans:"Noto Sans SC","Microsoft YaHei",system-ui,sans-serif;
}
*{box-sizing:border-box;margin:0;padding:0}
html,body{background:var(--bg);color:var(--ink);font-family:var(--sans);overflow-x:hidden}
body{min-height:100vh;min-height:100dvh;display:flex;flex-direction:column;
  background-image:radial-gradient(820px 460px at 50% 0%, #16151A 0%, rgba(7,7,8,0) 74%)}

header.site{display:flex;justify-content:space-between;align-items:center;gap:12px;flex-wrap:wrap;
  padding:22px 32px;border-bottom:1px solid var(--line2);
  font-family:var(--mono);font-size:13.5px;letter-spacing:.2em;color:var(--dim);text-transform:uppercase}
header.site a{color:var(--dim);text-decoration:none}
header.site a:hover{color:var(--gold)}
header.site .id{color:var(--gold)}
header.site .dom-mobile{display:none}

main{flex:1;width:100%;max-width:860px;margin:0 auto;padding:0 32px;
  display:flex;flex-direction:column;justify-content:center}

.card{border:1px solid var(--line2);background:#0A0B0C;padding:46px 44px 40px;position:relative}
.card .no{font-family:var(--mono);font-size:12.5px;letter-spacing:.24em;color:var(--sub);
  display:flex;justify-content:space-between;gap:14px;flex-wrap:wrap;text-transform:uppercase}
.card .no b{color:var(--gold);font-weight:400}

.name{margin:26px 0 6px;font-size:clamp(26px,4.4vw,42px);font-weight:600;letter-spacing:.24em}
.name-en{font-family:var(--mono);font-size:12.5px;letter-spacing:.3em;color:var(--sub2);text-transform:uppercase}

.rows{margin-top:30px;border-top:1px solid var(--line2)}
.row{display:grid;grid-template-columns:150px 1fr;gap:18px;padding:14px 0;border-bottom:1px solid var(--line)}
.row dt{font-family:var(--mono);font-size:12.5px;letter-spacing:.16em;color:var(--sub);text-transform:uppercase}
.row dd{font-size:14px;letter-spacing:.04em;line-height:1.9}
.row dd .u{font-family:var(--mono);font-size:12px;color:#8E9095;margin-left:10px;letter-spacing:.1em}

.emblem{margin-top:26px;display:flex;align-items:center;gap:22px;flex-wrap:wrap}
.emblem .box{width:104px;height:104px;background:#fff;display:flex;align-items:center;justify-content:center}
.emblem .box svg{width:88px;height:88px}
.emblem .spec{font-family:var(--mono);font-size:12px;color:var(--sub);line-height:2;letter-spacing:.06em}
.emblem .spec b{color:var(--ink);font-weight:400}

.nav{margin-top:28px;display:flex;justify-content:space-between;gap:14px;flex-wrap:wrap;
  font-family:var(--mono);font-size:12.5px;letter-spacing:.16em;color:var(--sub)}
.nav a{color:var(--sub2);text-decoration:none;border-bottom:1px solid var(--line2);padding-bottom:2px}
.nav a:hover{color:var(--gold);border-bottom-color:var(--gold)}

footer.foot{padding:20px 32px 26px;font-family:var(--mono);font-size:12.5px;letter-spacing:.14em;
  color:var(--sub);display:flex;justify-content:space-between;gap:12px;flex-wrap:wrap}
footer.foot a{color:var(--sub2);text-decoration:none}
footer.foot a:hover{color:var(--gold)}

@media(max-width:620px){
  header.site{padding:18px 20px}
  header.site .dom{display:none}
  header.site .dom-mobile{display:inline}
  main{padding:0 20px}
  .card{padding:32px 22px}
  .row{grid-template-columns:1fr;gap:4px}
  footer.foot{padding:18px 20px 22px;flex-direction:column;align-items:flex-start;gap:6px}
}
