/* 莉莉人生 · 轻科幻（1in8b 式三栏布局） */
:root {
  --bg: #eef2f5; --bg2: #e4ebf0; --card: rgba(255,255,255,.88); --card2: #f6f9fb; --ink: #17222c; --ink2: #5b6b78; --line: #cbd7df; --line2: #b3c3ce;
  --accent: #0e9fb0; --accent2: #d6336c; --glow: rgba(14,159,176,.25);
  --g: #2e9b6a; --y: #c48b1f; --t: #0e9fb0; --r: #d6336c; --p: #7048e8; --o: #e8590c; --b: #3b6fd4; --e: #c9a227; --l: #3d5a80; --mo: #1fa88a; --fa: #e8590c;
  --bad: #d6336c; --warm: #c27a1a; --big: #0b7f8d; --skill: #7048e8; --battle: #2f5fa8; --social: #b23a79;
  --mono: "JetBrains Mono", ui-monospace, Consolas, monospace;
  --shadow: 0 1px 0 rgba(255,255,255,.6) inset, 0 6px 24px rgba(23,34,44,.06);
  color-scheme: light;
}
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    --bg: #0b1117; --bg2: #0f1820; --card: rgba(16,25,33,.86); --card2: #131e27; --ink: #dce8ef; --ink2: #8ba1b0; --line: #1e3240; --line2: #2a4556;
    --accent: #3fd2e0; --accent2: #ff5c8a; --glow: rgba(63,210,224,.28);
    --bad: #ff6b8e; --warm: #f0a85a; --big: #5fe3ee; --skill: #a98ff0; --battle: #7ea6ee; --social: #f08ac5; --l: #6f8fbf;
    --shadow: 0 0 0 1px rgba(63,210,224,.04) inset, 0 8px 30px rgba(0,0,0,.35); color-scheme: dark;
  }
}
:root[data-theme="dark"] {
  --bg: #0b1117; --bg2: #0f1820; --card: rgba(16,25,33,.86); --card2: #131e27; --ink: #dce8ef; --ink2: #8ba1b0; --line: #1e3240; --line2: #2a4556;
  --accent: #3fd2e0; --accent2: #ff5c8a; --glow: rgba(63,210,224,.28);
  --bad: #ff6b8e; --warm: #f0a85a; --big: #5fe3ee; --skill: #a98ff0; --battle: #7ea6ee; --social: #f08ac5; --l: #6f8fbf;
  --shadow: 0 0 0 1px rgba(63,210,224,.04) inset, 0 8px 30px rgba(0,0,0,.35); color-scheme: dark;
}

* { box-sizing: border-box; }
html, body { margin: 0; color: var(--ink); font: 14px/1.65 "Noto Sans SC", "Noto Sans JP", "Hiragino Sans", "Microsoft YaHei", system-ui, sans-serif; }
body {
  background:
    radial-gradient(1200px 600px at 85% -10%, color-mix(in srgb, var(--accent) 10%, transparent), transparent 70%),
    radial-gradient(900px 500px at -10% 110%, color-mix(in srgb, var(--accent2) 7%, transparent), transparent 70%),
    linear-gradient(var(--line) 1px, transparent 1px) 0 0 / 28px 28px,
    linear-gradient(90deg, var(--line) 1px, transparent 1px) 0 0 / 28px 28px,
    var(--bg);
  background-attachment: fixed;
}
body::before { content: ""; position: fixed; inset: 0; pointer-events: none; background: var(--bg); opacity: .72; z-index: -1; }
/* 全站按钮：轻科幻（斜切角 + 主色描边与文字 + 渐变底），和整行大按钮 .wbtn 同一套样式 */
button { font: inherit; font-weight: 600; letter-spacing: .04em; color: var(--accent); cursor: pointer; padding: 5px 12px; border-radius: 0;
  background: linear-gradient(90deg, color-mix(in srgb, var(--accent) 6%, var(--card2)), color-mix(in srgb, var(--accent) 15%, var(--card2)), color-mix(in srgb, var(--accent) 6%, var(--card2)));
  border: 1px solid color-mix(in srgb, var(--accent) 55%, transparent); clip-path: polygon(7px 0, 100% 0, 100% calc(100% - 7px), calc(100% - 7px) 100%, 0 100%, 0 7px);
  transition: border-color .15s, background .15s, color .15s; }
button:hover:not(:disabled) { border-color: var(--accent); background: color-mix(in srgb, var(--accent) 22%, var(--card2)); }
button.mini { clip-path: polygon(5px 0, 100% 0, 100% calc(100% - 5px), calc(100% - 5px) 100%, 0 100%, 0 5px); }
/* 结构性控件（页签、事件选项、行动列表、播放条、开关等）保留各自的样式 */
#tabs button, #top-tabs button, .subtabs button, .act-cats button, .choices button, .alist button.ai, .ai-subs button, .ctl button, .ctl-play button, .ctl-more-grp button, button#ctl-act, .lang-dd button, .sw-t, .jmap button {
  clip-path: none; color: inherit; font-weight: inherit; letter-spacing: normal; background: var(--card2); border: 1px solid var(--line2); border-radius: 4px; }
#tabs button:hover:not(:disabled), #top-tabs button:hover:not(:disabled), .subtabs button:hover:not(:disabled), .act-cats button:hover:not(:disabled), .choices button:hover:not(:disabled), .alist button.ai:hover:not(:disabled), .ai-subs button:hover:not(:disabled), .ctl button:hover:not(:disabled) { box-shadow: 0 0 0 3px var(--glow); }
button:disabled { opacity: .4; cursor: not-allowed; }
button.on { background: var(--accent); color: #fff; border-color: var(--accent); box-shadow: 0 0 12px var(--glow); }
:where(:root[data-theme="dark"], :root:not([data-theme="light"])) button.on { color: #061016; }   /* 用 :where 压低优先级：只盖过通用 button.on，不盖过 tab 等自定义选中色 */
select { font: inherit; padding: 4px 6px; border-radius: 4px; border: 1px solid var(--line2); background: var(--card2); color: var(--ink); max-width: 100%; }
small { color: var(--ink2); }
.dim { color: var(--ink2); opacity: .55; }
.bad { color: var(--bad); } .warm { color: var(--warm); }
.hint { color: var(--ink2); font-size: 12px; margin: 6px 0; }
img.pix { image-rendering: pixelated; image-rendering: crisp-edges; background: linear-gradient(180deg, color-mix(in srgb, var(--accent) 14%, transparent), color-mix(in srgb, var(--accent2) 8%, transparent)); border: 1px solid var(--line); border-radius: 3px; flex: none; }
.npc-link { cursor: pointer; border-bottom: 1px dashed var(--accent); }

/* ===== 顶栏 ===== */
#top { position: sticky; top: 0; z-index: 20; padding: 10px 18px 8px; border-bottom: 1px solid var(--line); backdrop-filter: blur(10px); background: color-mix(in srgb, var(--bg) 82%, transparent); }
.t1 { display: flex; align-items: baseline; gap: 16px; flex-wrap: wrap; }
.brand { display: flex; flex-direction: column; line-height: 1.1; font-weight: 700; color: var(--ink); letter-spacing: .06em; }
.brand small { font-family: var(--mono); font-size: 10px; color: var(--accent); letter-spacing: .3em; font-weight: 400; }
.age b { font-size: 36px; line-height: 1; font-family: var(--mono); font-weight: 600; color: var(--accent); text-shadow: 0 0 18px var(--glow); }
.age small { margin-left: 3px; }
.sub { color: var(--ink2); font-size: 13px; font-family: var(--mono); }
.tline { display: flex; align-items: center; margin: 8px 0; }
.progress { height: 2px; background: var(--line); position: relative; overflow: hidden; flex: 1; min-width: 0; }
.progress i { display: block; height: 100%; background: linear-gradient(90deg, var(--accent), var(--accent2)); box-shadow: 0 0 8px var(--accent); transition: width .2s linear; }
/* 时间条末尾的 loading 区（外县 NPC 半年结算等需要停下时间计算的时候）：平时宽度 0，加载时从右往左把时间条压缩出来；转圈只用 transform，主线程忙时也能继续转 */
.tload { display: flex; align-items: center; gap: 5px; width: 0; margin-left: 0; opacity: 0; overflow: hidden; white-space: nowrap; font-size: 11px; color: var(--accent); transition: width .3s ease, margin-left .3s ease, opacity .2s; }
.tline.loading .tload { width: 72px; margin-left: 8px; opacity: 1; }
.tl-spin { flex: none; width: 10px; height: 10px; border: 2px solid var(--line); border-top-color: var(--accent); border-radius: 50%; will-change: transform; animation: tl-spin .7s linear infinite; }
.tload b { font-weight: 600; }
@keyframes tl-spin { to { transform: rotate(360deg); } }
.ctl { display: flex; gap: 6px; flex-wrap: wrap; align-items: center; }
.ctl .grp { display: inline-flex; gap: 3px; }
.ctl .sp { flex: 1; }
.ctl button { padding: 3px 10px; font-size: 12.5px; font-family: var(--mono); }
.ghost { background: transparent; }

/* ===== 三栏 ===== */
.cols { display: grid; grid-template-columns: 300px minmax(0, 1fr) 290px; gap: 16px; padding: 16px 18px 60px; max-width: 1480px; margin: 0 auto; }
@media (max-width: 1150px) { .cols { grid-template-columns: 280px minmax(0, 1fr); } .right { grid-column: 1 / -1; display: grid; grid-template-columns: repeat(auto-fit, minmax(min(250px, 100%), 1fr)); gap: 16px; } }
@media (max-width: 760px) { .cols { grid-template-columns: minmax(0, 1fr); padding: 10px 12px 60px; } .ctl .sp { display: none; } }
.left, .right, .mid { display: flex; flex-direction: column; gap: 16px; min-width: 0; }
.card { position: relative; background: var(--card); border: 1px solid var(--line); border-radius: 6px; padding: 14px 16px; box-shadow: var(--shadow); }
/* 四角括号 */
.card::before, .card::after { content: ""; position: absolute; width: 10px; height: 10px; border-color: var(--accent); border-style: solid; opacity: .7; pointer-events: none; }
.card::before { top: -1px; left: -1px; border-width: 2px 0 0 2px; border-top-left-radius: 6px; }
.card::after { bottom: -1px; right: -1px; border-width: 0 2px 2px 0; border-bottom-right-radius: 6px; }
.card h3 { margin: 0 0 10px; font-size: 13px; display: flex; justify-content: space-between; align-items: baseline; gap: 8px; letter-spacing: .04em; }
.card h3::before { content: ""; width: 3px; height: 12px; background: var(--accent); margin-right: 8px; box-shadow: 0 0 6px var(--accent); align-self: center; flex: none; }
.card h3 { justify-content: flex-start; }
.card h3 small { margin-left: auto; font-weight: 400; font-size: 11px; font-family: var(--mono); }
.card h4 { margin: 12px 0 6px; font-size: 12px; color: var(--ink2); font-family: var(--mono); letter-spacing: .06em; }
.kv { display: flex; justify-content: space-between; gap: 8px; padding: 4px 0; border-bottom: 1px dashed color-mix(in srgb, var(--line) 80%, transparent); font-size: 13px; }
.kv span { color: var(--ink2); flex: none; } .kv b { font-weight: 500; text-align: right; }
.chip { display: inline-block; font-size: 11px; padding: 0 8px; border-radius: 2px; background: var(--accent2); color: #fff; margin-top: 4px; font-family: var(--mono); letter-spacing: .05em; }
.tags { display: inline-flex; flex-wrap: wrap; gap: 4px; justify-content: flex-end; }
.tags i.rare-b { border-color: color-mix(in srgb, var(--p) 70%, var(--line)); background: color-mix(in srgb, var(--p) 22%, transparent); color: var(--ink); font-weight: 600; }
.tags i { font-style: normal; font-size: 11.5px; padding: 0 7px; border: 1px solid color-mix(in srgb, var(--accent) 55%, var(--line)); border-radius: 2px; color: var(--ink); background: color-mix(in srgb, var(--accent) 8%, transparent); white-space: nowrap; }
.mbti { font-family: var(--mono); font-size: 10.5px; color: var(--ink2); margin-left: 6px; opacity: .8; }
.tagrow b { display: flex; flex-direction: column; align-items: flex-end; gap: 2px; }

/* 身份记录 */
.idcard { padding-top: 34px; }
.idcard::selection { background: var(--accent); }
.idcard > .idhead::before { content: "IDENTITY RECORD · JPN"; position: absolute; top: 0; left: 0; right: 0; padding: 6px 14px; font: 600 10.5px var(--mono); letter-spacing: .2em; color: #fff; background: linear-gradient(90deg, var(--accent), color-mix(in srgb, var(--accent) 40%, var(--accent2))); border-radius: 5px 5px 0 0; }
.idhead { display: flex; gap: 12px; align-items: center; margin-bottom: 8px; }
.idname { font-size: 18px; font-weight: 700; }
.idsub { font-size: 12px; color: var(--ink2); font-family: var(--mono); }
.mrz { font-family: var(--mono); font-size: 10.5px; letter-spacing: .06em; color: var(--ink2); margin-top: 10px; padding-top: 8px; border-top: 1px solid var(--line); word-break: break-all; }

/* 条 */
.stat { display: grid; grid-template-columns: 82px 1fr 46px; align-items: center; gap: 8px; margin: 6px 0; font-size: 13px; }
.stat b { text-align: right; font-variant-numeric: tabular-nums; font-family: var(--mono); font-weight: 500; }
.bar { display: block; height: 6px; background: color-mix(in srgb, var(--line) 85%, transparent); border-radius: 1px; overflow: hidden; position: relative; }
.bar i { display: block; height: 100%; background: var(--ink2); transition: width .35s; box-shadow: 0 0 6px currentColor; }
.bar.g i { background: var(--g); color: var(--g); } .bar.y i { background: var(--y); color: var(--y); } .bar.t i { background: var(--t); color: var(--t); } .bar.r i { background: var(--r); color: var(--r); }
.bar.p i { background: var(--p); color: var(--p); } .bar.o i { background: var(--o); color: var(--o); } .bar.x i { background: #8a96a0; color: transparent; } .bar.b i { background: var(--b); color: var(--b); }
.bar.e i { background: var(--e); color: var(--e); } .bar.l i { background: var(--l); color: transparent; }
.kv .bar { width: 120px; align-self: center; }
.grade { font-family: var(--mono); font-weight: 700; letter-spacing: .06em; }
.g-S, .g-SS, .g-SSS { color: var(--accent2); text-shadow: 0 0 10px color-mix(in srgb, var(--accent2) 40%, transparent); }
.skill { color: var(--skill); }

/* 场景画 */
.scene-card { padding: 0; overflow: hidden; }
#scene { display: block; width: 100%; aspect-ratio: 240 / 72; image-rendering: pixelated; }
.scene-card::after { z-index: 2; }
.scene-card > canvas + .scene-cap { border-top: 1px solid var(--line); }
.scene-cap { display: flex; justify-content: space-between; padding: 7px 14px; font-size: 12.5px; }
.scene-cap span { font-family: var(--mono); color: var(--ink2); font-size: 11.5px; }
.scene-card { background-image: repeating-linear-gradient(0deg, rgba(0,0,0,.03) 0 1px, transparent 1px 3px); }

/* tabs */
/* 标签栏：等宽平分，和下方板块连成一体 */
#tabs { display: grid; grid-template-columns: repeat(8, minmax(0, 1fr)); gap: 0; position: sticky; top: 108px; z-index: 10; margin-bottom: -17px; background: var(--card); border: 1px solid var(--line); border-bottom: none; border-radius: 6px 6px 0 0; overflow: hidden; }
#tabs button { padding: 8px 4px; font-size: 12.5px; border-radius: 0; border: none; border-bottom: 2px solid var(--line); border-right: 1px solid color-mix(in srgb, var(--line) 60%, transparent); background: transparent; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; box-shadow: none; }
#tabs button:last-child { border-right: none; }
#tabs button.on { border-bottom-color: var(--accent); background: color-mix(in srgb, var(--accent) 14%, transparent); color: var(--accent); }
#tab-body > .card:first-child { border-top-left-radius: 0; border-top-right-radius: 0; border-top: none; }
@media (max-width: 620px) { #tabs { grid-template-columns: repeat(4, minmax(0, 1fr)); } }
#tab-body, #act-area { display: flex; flex-direction: column; gap: 16px; }

/* 行动 */
.actgrid { display: grid; grid-template-columns: repeat(auto-fill, minmax(140px, 1fr)); gap: 8px; margin: 10px 0; }
.actgrid button, .chips button { text-align: left; display: flex; flex-direction: column; padding: 7px 10px; }
.actgrid small, .chips small { font-size: 11px; }
.chips { display: grid; grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)); gap: 8px; }
.chips button { border-radius: 16px; padding: 6px 14px; text-align: left; }
.chips button.on small { color: inherit; opacity: .85; }
.row { margin: 6px 0; display: flex; gap: 6px; align-items: center; flex-wrap: wrap; font-size: 13px; }
.plan { display: flex; flex-wrap: wrap; gap: 6px; }
.plan button { font-size: 12px; display: flex; flex-direction: column; align-items: center; padding: 5px 10px; }
.plan i { font-style: normal; letter-spacing: 1px; color: var(--accent); font-size: 10px; }
.plan .w0 { opacity: .5; }
.bad-card { border-color: var(--bad); }

/* 日志 */
.log { display: flex; flex-direction: column; max-height: 62vh; overflow: auto; }
.le { display: grid; grid-template-columns: 46px 1fr; gap: 8px; padding: 7px 0; border-bottom: 1px solid color-mix(in srgb, var(--line) 60%, transparent); font-size: 13.5px; }
.la { color: var(--accent); font-size: 11.5px; font-family: var(--mono); padding-top: 2px; }
.le.k-big > div { font-weight: 600; color: var(--big); }
.le.k-bad > div { color: var(--bad); } .le.k-warm > div { color: var(--warm); } .le.k-battle > div { color: var(--battle); }
.le.k-skill > div { color: var(--skill); } .le.k-social > div { color: var(--social); } .le.k-ms > div { color: var(--ink2); font-style: italic; }
.fact { font-size: 12px; color: var(--ink2); margin-top: 4px; padding-left: 8px; border-left: 2px solid var(--accent); font-weight: 400; }

/* 站位 */
.zfit { display: grid; grid-template-columns: repeat(3, 1fr); gap: 8px; margin-bottom: 10px; }
.zfit div { border: 1px solid var(--line); border-radius: 4px; padding: 6px 8px; display: flex; flex-direction: column; font-size: 12px; color: var(--accent2); }
.zfit b { color: var(--ink); font-size: 14px; font-family: var(--mono); } .zfit small { color: var(--ink2); }
.trees { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(230px, 100%), 1fr)); gap: 10px; }
.tree { border: 1px solid var(--line); border-radius: 4px; padding: 8px; }
.tree.mine { border-color: var(--accent); box-shadow: 0 0 0 1px var(--glow) inset; }
.tree h4 { margin: 0 0 6px; }
.role { border-top: 1px dashed var(--line); padding: 6px 0; font-size: 12.5px; }
.role.cur { background: color-mix(in srgb, var(--accent) 8%, transparent); border-radius: 3px; padding: 6px; }
.rh { display: flex; gap: 6px; align-items: center; } .rh span { color: var(--accent2); font-size: 11px; } .rh .lv { margin-left: auto; color: var(--ink); font-weight: 700; font-family: var(--mono); }
.rd { color: var(--ink2); font-size: 11.5px; margin: 2px 0 4px; }
.rp { display: flex; flex-wrap: wrap; gap: 4px; margin: 4px 0; }
.perk { font-size: 10.5px; border: 1px solid var(--line); border-radius: 2px; padding: 0 6px; color: var(--ink2); }
.perk.got { border-color: var(--skill); color: var(--skill); }
.rb { display: flex; gap: 6px; align-items: center; } .rb button { font-size: 11.5px; padding: 2px 8px; } .rb em { font-size: 11.5px; color: var(--accent); }

/* 技能 */
.skl { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(210px, 100%), 1fr)); gap: 8px; }
.sk { border: 1px solid var(--line); border-radius: 4px; padding: 8px 10px; font-size: 12.5px; position: relative; }
.sk p { margin: 4px 0 6px; color: var(--ink2); font-size: 11.5px; }
.sk.got { border-color: var(--skill); margin-bottom: 8px; } .sk .lv { position: absolute; right: 10px; top: 8px; font-weight: 700; color: var(--skill); font-family: var(--mono); }
.sk.t-cand { border-color: var(--accent2); background: color-mix(in srgb, var(--accent2) 5%, transparent); }
.sk.t-f5 { border-color: var(--accent2); background: color-mix(in srgb, var(--accent2) 6%, transparent); }
.sk.t-f4 { border-color: color-mix(in srgb, var(--g) 60%, var(--line)); }
.sk .zf-s { margin-left: 6px; font-size: 11.5px; color: var(--ink2); }
.sk-sec { margin: 6px 0; } .sk-sec h5 { margin: 0 0 3px; font-size: 11.5px; color: var(--ink); font-weight: 700; } .sk-sec h5 small { margin-left: 6px; font-weight: 400; color: var(--ink2); }
.sk-attr { margin: 0; padding-left: 16px; font-size: 11.5px; line-height: 1.7; } .sk-attr .dim { font-size: 10.5px; }
.sk-why { margin: 2px 0 4px; font-size: 11px; color: var(--ink2); } .sk-why div { margin-top: 2px; line-height: 1.6; }
.sk-why > summary { display: flex; align-items: baseline; justify-content: space-between; gap: 8px; cursor: pointer; list-style: none; }
.sk-why > summary::-webkit-details-marker { display: none; } .sk-why .rare-p { font-size: 12.5px; color: var(--ink); }
.sk-more { color: var(--accent); font-size: 12px; white-space: nowrap; } .sk-more::before { content: '▸ '; } .sk-why[open] .sk-more::before { content: '▾ '; }
.sk-h { display: flex; align-items: baseline; flex-wrap: wrap; gap: 2px 6px; } .sk-h .zf-s, .sk-h .tag { margin-left: 0; }
.tr-row { display: flex; align-items: center; gap: 10px; margin: 6px 0; } .tr-row > button { flex: none; } .tr-gain { flex: 1; min-width: 0; font-size: 12px; }
.tr-row .more-b, .tr-row .more-b.on, .tr-row .more-b:hover { flex: none; background: none !important; border: none !important; box-shadow: none !important; padding: 0; color: var(--accent) !important; font-size: 12px; cursor: pointer; } .more-b::before { content: '▸ '; } .more-b.on::before { content: '▾ '; }
.sk-gain { margin: 6px 0; padding: 4px 8px; border-left: 2px solid var(--line2); font-size: 11.5px; line-height: 1.8; } .sk-gain h5 { margin: 0 0 2px; font-size: 11.5px; color: var(--ink2); font-weight: 600; }
.desc-big { display: block; font-size: 16px; color: var(--ink); font-family: var(--mono); margin-bottom: 2px; }
.desc { margin: 6px 0; padding: 6px 8px; border-left: 2px solid color-mix(in srgb, var(--ink2) 35%, transparent); background: color-mix(in srgb, var(--ink2) 6%, transparent); font-size: 11.5px; line-height: 1.6; color: var(--ink2); }
.ent-k { cursor: pointer; border-bottom: 1px dotted color-mix(in srgb, var(--ink2) 50%, transparent); } .ent-k:hover { border-bottom-color: var(--accent); }
.ent-meta { font-size: 12px; color: var(--ink2); margin: 4px 0 6px; } .ent-sec h5 { margin: 6px 0 3px; font-size: 12px; } .ent-sec > div { margin: 2px 0; }
.ent-lv { display: flex; gap: 8px; align-items: baseline; margin: 3px 0; font-size: 12px; } .ent-lv > b { font-family: var(--mono); color: var(--skill); width: 14px; } .ent-lv.lvw > b { width: 2.6em; flex: none; } .ent-lv.cur { background: color-mix(in srgb, var(--skill) 10%, transparent); border-radius: 3px; } .ent-lv span { display: flex; flex-wrap: wrap; gap: 2px 10px; }
.ent-pop .hv-t { display: block; font-size: 16px; margin-bottom: 4px; } .ent-pop .hv-w { color: var(--ink2); line-height: 1.7; } .ent-note { font-size: 12px; margin-top: 6px; }
.md-k { cursor: pointer; border-bottom: 1px dotted color-mix(in srgb, var(--ink2) 50%, transparent); } .md-k:hover { border-bottom-color: var(--accent); }
.mi-what { color: var(--ink2); font-size: 12.5px; line-height: 1.7; } .mi-cur { margin-bottom: 8px; } .md-tot { border-top: 1px solid var(--line); font-weight: 600; } .mi-prov { font-size: 12px; margin: 3px 0; } .mi-back { float: right; }
.sk.locked { opacity: .45; }
.tag { font-size: 10.5px; border-radius: 2px; padding: 0 6px; margin-left: 6px; background: color-mix(in srgb, var(--ink2) 15%, transparent); }
.sk button { font-size: 11.5px; padding: 2px 8px; }

/* 军团 */
.lp { display: grid; grid-template-columns: repeat(4, 1fr); gap: 8px; margin-bottom: 8px; }
.lp div { border: 1px solid var(--line); border-radius: 4px; padding: 6px; text-align: center; display: flex; flex-direction: column; }
.lp span { font-size: 11px; color: var(--ink2); } .lp b { font-size: 18px; font-family: var(--mono); color: var(--accent); }
.pitch-wrap { display: flex; justify-content: center; margin: 10px 0; }
.pitch { position: relative; width: min(100%, 360px); aspect-ratio: 3 / 4; border-radius: 4px; border: 1px solid var(--line2); overflow: hidden;
  background: linear-gradient(180deg, color-mix(in srgb, var(--accent2) 14%, var(--card2)) 0 30%, color-mix(in srgb, var(--accent) 10%, var(--card2)) 30% 62%, color-mix(in srgb, var(--b) 12%, var(--card2)) 62%),
    var(--card2); }
.pitch::before { content: ""; position: absolute; inset: 0; background: linear-gradient(var(--line) 1px, transparent 1px) 0 0 / 100% 10%, linear-gradient(90deg, var(--line) 1px, transparent 1px) 0 0 / 10% 100%; opacity: .5; }
.zone-l { position: absolute; left: 6px; font-size: 10px; color: var(--ink2); font-weight: 700; font-family: var(--mono); }
.zone-l.az { top: 4px; } .zone-l.tz { top: 31%; } .zone-l.bz { top: 63%; }
.enemy { position: absolute; top: -2px; left: 50%; transform: translateX(-50%); font-size: 10px; color: var(--bad); font-family: var(--mono); }
.slot { position: absolute; transform: translate(-50%, -50%); display: flex; flex-direction: column; align-items: center; width: 72px; text-align: center; }
.slot small { font-size: 9.5px; line-height: 1.15; color: var(--ink); background: color-mix(in srgb, var(--card) 85%, transparent); border-radius: 2px; padding: 0 3px; margin-top: 1px; }
.slot em { font-style: normal; font-size: 9.5px; line-height: 1.1; }
.slot em.f1, .slot em.f2 { color: var(--bad); } .slot em.f4, .slot em.f5 { color: var(--g); }
.slot.empty .q { width: 30px; height: 30px; border: 1px dashed var(--accent); border-radius: 50%; display: grid; place-items: center; color: var(--accent); }
.slot.me img { outline: 2px solid var(--accent2); box-shadow: 0 0 10px var(--accent2); }
.tbl { width: 100%; border-collapse: collapse; font-size: 12.5px; margin-top: 8px; }
.tbl th { font-family: var(--mono); font-size: 11px; color: var(--ink2); font-weight: 400; letter-spacing: .05em; }
.tbl th, .tbl td { padding: 4px 6px; border-bottom: 1px solid var(--line); text-align: left; }
.tbl td img { vertical-align: middle; }
.manage { margin: 8px 0; }

/* 人际 */
.friends { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(270px, 100%), 1fr)); gap: 8px; }
.fr { display: flex; gap: 8px; align-items: flex-start; border: 1px solid var(--line); border-radius: 4px; padding: 8px; cursor: pointer; background: var(--card2); }
.fr:hover { border-color: var(--accent); }
.fi { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 2px; font-size: 12.5px; }
.fi .tags { justify-content: flex-start; }
.fi small { font-size: 11px; }
.fl { display: flex; gap: 6px; align-items: center; font-size: 11px; } .fl .bar { width: 70px; flex: none; }
.fr button { font-size: 11.5px; padding: 2px 8px; }
.hist { color: var(--accent2); margin-left: 4px; white-space: nowrap; }   /* 名字后的史实星标：用 ⁠ 粘在名字最后一个字上，不单独换行 */

/* 地图 */
.map-wrap { position: relative; overflow: hidden; }
.map { position: relative; transform-origin: 0 0; }
.mreg { position: absolute; border: 1px solid; border-radius: 4px; opacity: .55; pointer-events: none; }
.mreg span { position: absolute; bottom: -18px; left: 2px; font-size: 11px; color: var(--ink2); font-family: var(--mono); }
.mc { position: absolute; border: 1px solid rgba(255,255,255,.6); border-radius: 2px; cursor: pointer; display: flex; flex-direction: column; justify-content: center; align-items: center; color: #10181e; font-size: 10.5px; overflow: hidden; text-align: center; line-height: 1.1; }
.mc i { font-style: normal; font-size: 8px; color: #5b0f1f; letter-spacing: -1px; }
.mc.home { outline: 2px solid var(--accent2); z-index: 5 !important; box-shadow: 0 0 10px var(--accent2); }
.mc.sel { box-shadow: 0 0 0 2px var(--accent) inset; }
.mc:hover { filter: brightness(1.12); }
.legend { display: flex; flex-wrap: wrap; gap: 4px 10px; align-items: center; font-size: 11px; color: var(--ink2); margin-top: 8px; }
.legend span { width: 12px; height: 12px; border-radius: 2px; display: inline-block; margin-right: -6px; }
.legend b { color: var(--accent); margin-left: 4px; }
.gline { font-size: 12.5px; padding: 2px 0; } .gline.fallen { text-decoration: line-through; color: var(--ink2); }
.feat { border-top: 1px dashed var(--line); padding: 6px 0; font-size: 13px; } .feat p { margin: 2px 0; color: var(--ink2); font-size: 12px; }

/* 右栏 */
.twin { display: grid; grid-template-columns: 32px 1fr auto; gap: 8px; align-items: center; padding: 5px 0; border-bottom: 1px dashed var(--line); font-size: 12.5px; }
.twin div { display: flex; flex-direction: column; min-width: 0; } .twin small { font-size: 11px; }
.tw-st { font-size: 11.5px; color: var(--ink2); text-align: right; font-family: var(--mono); }
.lmap { display: grid; grid-template-columns: repeat(10, 1fr); gap: 3px; }
.lmap i { aspect-ratio: 1; border: 1px solid var(--line); border-radius: 2px; font-style: normal; font-size: 9px; display: grid; place-items: center; color: var(--accent2); font-weight: 700; }
.lmap i.fut { opacity: .35; }
.lmap i.now { outline: 2px solid var(--accent2); box-shadow: 0 0 8px var(--accent2); }
.spark { width: 100%; height: 60px; }
.spark polyline { fill: none; stroke: var(--accent2); stroke-width: 1.6; filter: drop-shadow(0 0 3px var(--accent2)); }
.spark circle { fill: var(--accent2); }

/* 弹窗：HUD 面板 */
/* 事件卡：全屏遮罩 + 居中弹窗；收起后变成底部悬浮条 */
#modal { display: none; position: fixed; inset: 0; z-index: 65; background: rgba(6,12,18,.55); backdrop-filter: blur(3px); align-items: center; justify-content: center; padding: 16px; }
#modal.open { display: flex; }
#modal.open > .sheet:not(.folded) { width: min(680px, 100%); max-height: 90vh; overflow: auto; }
#modal.open.fold { inset: auto 0 16px 0; background: none; backdrop-filter: none; pointer-events: none; padding: 0 16px; }
#modal.open.fold > .sheet { pointer-events: auto; width: min(520px, 100%); }
.sheet { position: relative; background: var(--card2); color: var(--ink); width: 100%; border-radius: 6px; padding: 18px 20px; box-shadow: 0 0 0 1px var(--line2), 0 18px 50px rgba(0,0,0,.35), 0 0 40px var(--glow); animation: up .22s ease-out; border-top: 3px solid var(--accent); }
@keyframes up { from { transform: translateY(24px); opacity: 0; } }
.sheet.k-social { border-top-color: var(--social); } .sheet.k-bad { border-top-color: var(--bad); } .sheet.k-battle { border-top-color: var(--battle); }
.sheet.k-awaken { border-top-color: var(--skill); background: linear-gradient(180deg, color-mix(in srgb, var(--skill) 12%, var(--card2)), var(--card2) 45%); }
.sh-top { display: flex; justify-content: space-between; font-size: 11.5px; color: var(--ink2); font-family: var(--mono); letter-spacing: .05em; }
.sh-kind { font-weight: 700; color: var(--accent); }
.sh-top .sh-r { display: flex; gap: 10px; align-items: center; }
.sh-fold { font: inherit; font-size: 11.5px; padding: 3px 10px; border-radius: 12px; }
.sheet.folded { padding: 10px 16px; cursor: pointer; }
.sheet.folded .sh-fold-msg { font-size: 14px; margin-top: 4px; }
.sheet h2 { margin: 8px 0 6px; font-size: 20px; }
.sh-text { font-size: 15px; line-height: 1.8; }
.choices { display: flex; flex-direction: column; gap: 8px; margin-top: 14px; }
.choices button { display: flex; gap: 10px; text-align: left; align-items: flex-start; padding: 10px 12px; background: var(--card); flex-shrink: 0; }   /* 不许被压缩：选项多时整列滚动（.sh-in > .choices 是滚动框），否则每张卡的下半截会被裁掉 */
.choices .no { flex: none; width: 22px; height: 22px; border-radius: 2px; background: var(--accent); color: #fff; display: grid; place-items: center; font-size: 12px; font-family: var(--mono); margin-top: 1px; }
.choices button > span:last-child { display: flex; flex-direction: column; }
.choices small { font-size: 12px; }
.ch-row { display: flex; gap: 6px; } .ch-row > button:first-child { flex: 1; min-width: 0; }
.ch-info { flex: none; width: 40px; padding: 0; font-size: 15px; background: var(--card); color: var(--accent); }
.choices .tags { justify-content: flex-start; margin: 3px 0 1px; }
/* 朋友面板 */
.fpanel { display: flex; gap: 12px; align-items: center; margin: 12px 0 4px; padding: 10px; border: 1px solid var(--line2); border-radius: 4px; background: color-mix(in srgb, var(--accent) 5%, var(--card)); cursor: pointer; }
.fp-main { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 3px; }
.fp-main .tags { justify-content: flex-start; }
.fp-name { font-size: 16px; font-weight: 700; }
.fp-sub { font-size: 12px; color: var(--ink2); }
.fp-rel { display: flex; gap: 8px; align-items: center; font-size: 12px; } .fp-rel .bar { width: 120px; flex: none; }
.fp-say { margin: 6px 0 2px; padding: 8px 12px; border-left: 3px solid var(--accent2); background: color-mix(in srgb, var(--accent2) 6%, transparent); font-size: 14px; }
/* 行动菜单 */
.act-launch { display: flex; align-items: center; gap: 10px; width: 100%; padding: 12px 16px; text-align: left; border-left: 3px solid var(--accent); background: var(--card); }
.act-launch b { font-size: 15px; } .act-launch small { flex: 1; color: var(--ink2); font-family: var(--mono); font-size: 12px; } .act-launch span { color: var(--accent); }
#act-menu { position: fixed; inset: 0; z-index: 45; display: flex; align-items: center; justify-content: center; background: rgba(6,12,18,.45); backdrop-filter: blur(2px); padding: 16px; }
#act-menu[hidden] { display: none; }
.amenu { position: relative; width: min(680px, 100%); max-height: 88vh; overflow: auto; background: var(--card2); border-radius: 6px; padding: 16px 18px; box-shadow: 0 0 0 1px var(--line2), 0 18px 50px rgba(0,0,0,.35); border-top: 3px solid var(--accent); }
.amenu h3 { margin: 0 0 10px; } .amenu h3 small { margin-left: 8px; font-size: 12px; color: var(--ink2); font-weight: 400; font-family: var(--mono); }
/* 人物卡 */
#npc-card { position: fixed; inset: 0; z-index: 55; display: flex; align-items: center; justify-content: center; background: rgba(6,12,18,.4); backdrop-filter: blur(2px); padding: 16px; }
#npc-card[hidden] { display: none; }
.ncard { position: relative; width: min(720px, 100%); max-height: 88vh; overflow: auto; background: var(--card2); border-radius: 6px; padding: 18px 20px; box-shadow: 0 0 0 1px var(--line2), 0 18px 50px rgba(0,0,0,.35); border-top: 3px solid var(--accent2); }
.nc-x { position: absolute; top: 10px; right: 10px; padding: 2px 9px; }
.nc-head { display: flex; gap: 14px; align-items: center; }
.nc-head > div { display: flex; flex-direction: column; gap: 3px; }
.nc-head > .nc-cta { margin-left: auto; align-self: center; padding: 26px 8px 0 12px; } .nc-head > div:nth-child(2) { flex: 1; min-width: 0; }
.nc-big { font-size: 17px; font-weight: 600; padding: 12px 26px; min-width: 120px; display: flex; flex-direction: column; align-items: center; gap: 2px; }
.nc-big small { font-size: 11.5px; font-weight: 400; }
.nc-head .tags { justify-content: flex-start; }
.nc-name { font-size: 20px; font-weight: 700; }
.nc-sub { font-size: 12.5px; color: var(--ink2); }
.nc-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 18px; margin-top: 8px; }
@media (max-width: 620px) { .nc-grid { grid-template-columns: 1fr; } }
.dim9 { display: grid; grid-template-columns: 56px 1fr 56px; gap: 6px; align-items: center; font-size: 11px; color: var(--ink2); margin: 4px 0; }
.dim9 span:last-child { text-align: right; }
.dim9.dv { grid-template-columns: 52px 1fr 52px 26px; }
.dim9.dv span:nth-child(3) { text-align: right; }
.dim9.dv b { text-align: right; color: var(--ink); font-variant-numeric: tabular-nums; }
.pers-hov { min-width: 240px; }
.tagrow .mbti-row { display: flex; align-items: baseline; justify-content: flex-end; }
.kv .sk-more.pers-more { font-size: 11px; color: var(--accent); margin-left: 8px; cursor: pointer; font-weight: normal; }
.fit-hov { cursor: pointer; }
.fit-rows .fit-r { display: grid; grid-template-columns: 1fr auto auto auto; gap: 8px; align-items: baseline; font-size: 12px; margin: 3px 0; }
.fit-rows .fit-d { color: var(--ink2); }
.nc-act { display: flex; gap: 8px; margin-top: 12px; }

/* 开场 / 出生卡 / 结局 */
#screen-start, #overlay { min-height: 100vh; }
#overlay { position: fixed; inset: 0; z-index: 40; background: var(--bg); overflow: auto; display: flex; align-items: center; justify-content: center; padding: 20px 16px; }
#overlay[hidden], #screen-start[hidden], #game[hidden] { display: none !important; }
.start { max-width: 640px; margin: 0 auto; padding: 64px 16px; }
.start h1 { font-size: 44px; margin: 0; letter-spacing: .1em; display: flex; flex-direction: column; color: var(--ink); }
.start h1 small { font-size: 12px; letter-spacing: .4em; color: var(--accent); font-weight: 400; font-family: var(--mono); }
.lead { font-size: 16px; line-height: 1.95; margin: 24px 0; }
.opt { margin: 18px 0; } .opt h3 { font-size: 12px; color: var(--ink2); margin: 0 0 8px; font-family: var(--mono); letter-spacing: .1em; }
.opt button { margin: 0 6px 6px 0; text-align: left; display: inline-flex; flex-direction: column; }
.opt button.on small { color: inherit; opacity: .85; }
.go { display: flex; gap: 10px; margin: 26px 0 14px; flex-wrap: wrap; }
.cta { background: linear-gradient(90deg, var(--accent), color-mix(in srgb, var(--accent) 50%, var(--accent2))); color: #fff; border: none; padding: 10px 34px; font-size: 16px; border-radius: 3px; letter-spacing: .1em; box-shadow: 0 0 20px var(--glow); }
.cta:hover { filter: brightness(1.08); }
.roll { text-align: center; font-family: var(--mono); } .roll-name { font-size: 46px; font-weight: 700; color: var(--accent); margin-top: 10px; letter-spacing: .12em; text-shadow: 0 0 20px var(--glow); font-family: "Noto Sans SC", "Noto Sans JP", sans-serif; }
.birth, .end { position: relative; width: min(540px, 100%); background: var(--card2); border: 1px solid var(--line2); border-radius: 6px; padding: 22px; box-shadow: var(--shadow), 0 0 40px var(--glow); }
.end { width: min(740px, 100%); }
.b-title { font: 600 11px var(--mono); letter-spacing: .3em; color: var(--accent); margin-bottom: 12px; }
.b-body { display: flex; gap: 16px; align-items: flex-start; } .b-body > div { flex: 1; }
.b-name { font-size: 22px; font-weight: 700; margin-bottom: 6px; }
.e-top { display: flex; gap: 16px; align-items: center; } .e-top h2 { margin: 0; }
.e-sum { margin-top: 6px; font-size: 16px; color: var(--accent2); }
.e-stats { display: grid; grid-template-columns: repeat(3, 1fr); gap: 8px; margin: 16px 0; }
.e-stats div { border: 1px solid var(--line); border-radius: 4px; padding: 8px; display: flex; flex-direction: column; }
.e-stats span { font-size: 11px; color: var(--ink2); font-family: var(--mono); } .e-stats b { font-size: 16px; }
@media (max-width: 560px) { .e-stats { grid-template-columns: repeat(2, 1fr); } .b-body { flex-direction: column; align-items: center; } .lp { grid-template-columns: repeat(2, 1fr); } }

#toast { position: fixed; left: 50%; bottom: 24px; transform: translateX(-50%) translateY(20px); background: var(--ink); color: var(--bg); padding: 8px 16px; border-radius: 3px; font-size: 13px; opacity: 0; transition: .25s; pointer-events: none; z-index: 60; font-family: var(--mono); }
#toast.on { opacity: 1; transform: translateX(-50%); }
/* 调试开局快进的进度条（main.js ffwdShow） */
#ffwd { position: fixed; inset: 0; z-index: 70; display: flex; align-items: center; justify-content: center; background: rgba(0, 0, 0, .35); }
#ffwd .ffwd-box { background: var(--ink); color: var(--bg); padding: 14px 18px; border-radius: 4px; width: min(320px, calc(100vw - 32px)); font-family: var(--mono); font-size: 13px; }
#ffwd .ffwd-bar { height: 6px; margin: 10px 0 6px; background: rgba(255, 255, 255, .18); border-radius: 3px; overflow: hidden; }
#ffwd .ffwd-bar i { display: block; height: 100%; width: 0; background: var(--bg); transition: width .2s; }
#ffwd small { opacity: .75; }

.tact { white-space: nowrap; } .tact button { font-size: 11px; padding: 1px 7px; margin-left: 3px; }
.stat input[type=range] { width: 100%; accent-color: var(--accent); }
.cr-name { font: inherit; padding: 3px 8px; border: 1px solid var(--line2); border-radius: 4px; background: var(--card2); color: var(--ink); }
.lav { display: inline-flex; gap: 2px; margin-right: 6px; vertical-align: middle; }
.lav .npc-link { line-height: 0; cursor: pointer; }
.lav canvas, .lav img, .lav .pix { border-radius: 4px; }
.flist { max-height: 420px; overflow-y: auto; margin: 0 -4px; padding: 0 4px; }
.frow { display: grid; grid-template-columns: 28px 1fr auto; gap: 8px; align-items: center; padding: 5px 2px; border-bottom: 1px solid color-mix(in srgb, var(--line) 60%, transparent); cursor: pointer; color: inherit; text-decoration: none; }
.frow:hover { background: color-mix(in srgb, var(--accent) 8%, transparent); }
.frow b { display: block; font-size: 13px; font-weight: 600; }
.frow small { color: var(--mute, #888); font-size: 11.5px; }
.frow .bar { margin-top: 3px; height: 4px; }
.fbtn { font-size: 11.5px; padding: 3px 9px; border: 1px solid var(--line2); border-radius: 12px; color: var(--accent); white-space: nowrap; }
.frow:hover .fbtn { background: var(--accent); color: #fff; border-color: var(--accent); }
.lmaps { display: flex; flex-direction: column; gap: 3px; }
.lmap-m { display: grid; grid-template-columns: 18px 1fr; align-items: center; gap: 4px; padding: 4px 0; border-top: 1px dashed var(--accent); border-bottom: 1px dashed var(--accent); margin: 3px 0; }
.lmap-m + .lmap-m { margin-top: -4px; border-top: 0; }
.lmap-m > span { font-size: 10px; color: var(--accent); font-family: var(--mono, monospace); text-align: right; }
.lmap-m > div { display: grid; grid-template-columns: repeat(12, 1fr); gap: 2px; }
.lmap-m i { aspect-ratio: 1; border: 1px solid var(--line); border-radius: 2px; font-style: normal; font-size: 8px; display: grid; place-items: center; color: var(--accent2); font-weight: 700; }
.lmap-m i.fut { opacity: .35; }
.lmap-m i.now { outline: 2px solid var(--accent2); box-shadow: 0 0 6px var(--accent2); }
.mc .seven { position: absolute; right: 2px; top: 1px; font-size: 13px; color: #fff; text-shadow: 0 0 4px #000, 0 0 2px #b8434f; }
/* 真实轮廓日本地图 */
.jmap-wrap { max-width: 640px; margin: 0 auto; }
.jmap { width: 100%; height: auto; display: block; }
.jmap .jp { stroke: var(--card); stroke-width: 1.2; cursor: pointer; transition: filter .15s; }
.jmap .jp:hover { filter: brightness(1.12); }
.jmap .jp.home { stroke: var(--accent2); stroke-width: 2.4; }
.jmap .jp-here { fill: none; stroke: var(--accent2); stroke-width: 3; pointer-events: none; }
.jmap .jhere { fill: none; stroke: var(--accent2); stroke-width: 3; stroke-dasharray: 5 3; pointer-events: none; animation: jhere 2.4s ease-in-out infinite; }
@keyframes jhere { 50% { stroke-opacity: .35; } }
.jmap .jp.sel { stroke: var(--ink); stroke-width: 2.6; }
.jmap .jinset { fill: none; stroke: var(--line2); stroke-dasharray: 4 3; }
.jmap .jm { font-size: 11px; fill: #fff; text-anchor: middle; pointer-events: none; paint-order: stroke; stroke: rgba(0,0,0,.55); stroke-width: 2.5px; }
.jhint { font-size: 12px; color: var(--accent); text-align: right; margin-top: 4px; }
.jcredit { font-size: 10.5px; color: var(--ink2); text-align: right; margin-top: 2px; }
.nest-cond span { white-space: nowrap; } .nest-cond .up { color: var(--g); } .nest-cond .dn { color: var(--bad); } .nest-st { display: flex; align-items: center; gap: 6px; justify-content: flex-end; }
/* ===== 首页 ===== */
.home { max-width: 1180px; margin: 0 auto; padding: 24px 16px 40px; display: flex; flex-direction: column; gap: 22px; }
.h-hero { display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); gap: 26px; align-items: start; }
.h-img img { width: 100%; height: auto; display: block; border-radius: 6px; box-shadow: 0 10px 40px rgba(0,0,0,.18); }
.h-txt h1 { font-size: 40px; margin: 4px 0 0; letter-spacing: .04em; }
.h-alt { font-family: var(--mono); font-size: 13px; color: var(--accent); margin-bottom: 14px; }
.h-txt p { line-height: 1.85; margin: 0 0 10px; font-size: 14.5px; }
.h-lead { font-weight: 500; }
.h-live { margin: 14px 0; padding: 12px 14px; border: 1px solid var(--line2); border-left: 3px solid var(--accent); border-radius: 4px; background: var(--card); }
.ls-row { display: flex; flex-wrap: wrap; align-items: baseline; gap: 6px; font-size: 14px; }
.ls-row b { font-family: var(--mono); font-size: 22px; color: var(--accent); margin-left: 8px; }
.ls-row.dead b { color: var(--bad); }
.ls-row > span { color: var(--ink2); margin-right: 4px; }
.h-opts { display: flex; flex-direction: column; gap: 10px; margin: 6px 0 12px; }
.h-map h2, .h-mech h2 { margin: 0 0 12px; font-size: 20px; }
.h-map h2 small { font-size: 12px; color: var(--ink2); font-weight: 400; margin-left: 10px; }
.h-map-grid { display: grid; grid-template-columns: minmax(0, 3fr) minmax(0, 2fr); gap: 18px; }
.h-cinfo h3 small { margin-left: 8px; font-size: 13px; }
.h-cards { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(240px, 100%), 1fr)); gap: 14px; margin-bottom: 18px; }
.h-cards .card p { font-size: 14px; line-height: 1.8; margin: 0; }
.h-foot { text-align: center; }
@media (max-width: 860px) { .h-hero, .h-map-grid { grid-template-columns: 1fr; } .h-img { max-width: 420px; margin: 0 auto; } }
/* 行动列表：撑满宽度，一行一个行动，有选项时在行内放子按钮 */
.alist { display: flex; flex-direction: column; gap: 8px; }
.alist .ai { display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: center; gap: 4px 12px; width: 100%; text-align: left; padding: 10px 14px; border: 1px solid var(--line2); border-radius: 6px; background: var(--card); color: var(--ink); font: inherit; }
.alist button.ai { cursor: pointer; }
.alist button.ai:hover:not([disabled]) { border-color: var(--accent); }
.alist .ai[disabled] { opacity: .5; cursor: default; }
.ai-main { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.ai-main b { font-size: 14.5px; }
.ai-main small { font-size: 12px; color: var(--ink2); }
.ai-main select { font: inherit; font-size: 12px; margin-left: 4px; }
.ai-r { font-family: var(--mono); font-size: 13px; color: var(--ink); white-space: nowrap; }
.ai-subs { grid-column: 1 / -1; display: flex; flex-wrap: wrap; gap: 6px; margin-top: 4px; }
.ai-subs button { border-radius: 16px; padding: 5px 12px; font-size: 13px; }
.ai-subs button i { font-style: normal; font-family: var(--mono); font-size: 11.5px; color: var(--ink2); margin-left: 4px; }
.ai-subs button.on { background: var(--accent); color: #fff; }
.pg h4 small { font-weight: 400; color: var(--ink2); margin-left: 8px; font-size: 11.5px; }

/* 收支 */
.kv.led { font-size: 11.5px; } .kv.led b { font-family: var(--mono); font-weight: 500; } .led .inc { color: var(--g); } .led .exp { color: var(--bad, #d55); }
.rar { display: inline-block; font-family: var(--mono); font-size: 10.5px; padding: 0 5px; border-radius: 2px; margin-right: 4px; color: #fff; background: #7a8794; }
.rar.r-R { background: #3f7fbf; } .rar.r-SR { background: #9a5bd0; } .rar.r-SSR { background: linear-gradient(90deg, #d79b2b, #e85a8a); }
.amenu h4 small { font-weight: 400; color: var(--ink2); font-size: 11.5px; }
button.mini { font-size: 11px; padding: 1px 7px; margin-left: 6px; }
.sub-g { display: block; font-size: 10.5px; color: var(--ink2); font-family: var(--mono); }
.inj small { margin-left: 4px; font-weight: 400; font-size: 11px; color: var(--ink2); }
.inj { text-align: right; }
.fbonus small { display: block; font-size: 11px; color: var(--ink2); font-weight: 400; } .fbv { font-style: normal; color: var(--accent); }
.led-d { font-size: 11px; color: var(--ink2); padding: 0 0 4px 10px; } .led-d div { display: flex; justify-content: space-between; } .led-d b { font-weight: 400; font-family: var(--mono); } .led-d .inc { color: var(--g); } .led-d .exp { color: var(--bad, #d55); }
.card .act-launch { margin-top: 12px; }
.zf-s { display: block; font-size: 11.5px; color: var(--ink2); white-space: nowrap; } .rh .zf-s { display: inline; } .stars { font-style: normal; letter-spacing: -1px; color: var(--r); white-space: nowrap; }
.sib-bar { margin: -2px 0 4px; } .sib-bar .bar { height: 4px; }
/* 亲密度条 */
.rbar { display: block; position: relative; height: 6px; background: color-mix(in srgb, var(--line) 85%, transparent); border-radius: 1px; overflow: hidden; }
.rbar i { display: block; height: 100%; transition: width .35s; }
.rbar s { position: absolute; top: 0; bottom: 0; width: 1px; background: var(--card); opacity: .9; }
.rb-gray i { background: #8a96a0; } .rb-green i { background: #4fae6e; } .rb-blue i { background: #3f86d0; }
.rb-bestie i { background: #e0823a; } .rv-bestie { color: #e0823a; }
.rel-b { font-size: 10.5px; padding: 0 6px; border-radius: 2px; white-space: nowrap; color: #fff; flex: none; } .rk-family { background: #d94848; } .rk-partner { background: #ec6fa8; } .rk-bestie { background: #e0823a; } .rk-comrade { background: #9a5bd0; } .rk-friend { background: #c9962e; }
.ch-rel { max-width: 340px; margin: 3px 0; }
.rel-l { display: flex; align-items: center; gap: 6px; margin-top: 3px; } .rel-l .rbar-w { flex: 1; min-width: 0; }
.fb-sec { margin-top: 4px; font-size: 11.5px; } .xp-d { display: inline-block; min-width: 150px; margin: 0 0 0 8px; vertical-align: middle; font-size: 12px; } .xp-d > summary > span:first-child { color: var(--ink2); } .fb-sec > summary { display: flex; align-items: center; gap: 8px; cursor: pointer; list-style: none; } .fb-sec > summary::-webkit-details-marker { display: none; } .fb-sec .fb-t { color: var(--ink2); } .fb-sec .sk-more { margin-left: auto; } .fb-sec[open] .sk-more::before { content: '▾ '; } .fb-sec .fx-blk { margin-top: 4px; }
.rb-family i { background: #d94848; } .rb-partner i { background: #ec6fa8; } .rb-comrade i { background: #9a5bd0; } .rb-friend i { background: #d9a43a; }
.frow .rbar { margin-top: 3px; height: 5px; } .sib-bar .rbar { height: 4px; } .fp-rel .rbar { width: 120px; flex: none; } .fl .rbar { width: 70px; flex: none; }
.badge-hist { display: inline-block; font-size: 10px; padding: 0 5px; border-radius: 2px; background: var(--accent2); color: #fff; vertical-align: 1px; margin-left: 2px; }
.np-head { display: flex; gap: 12px; align-items: center; margin-bottom: 12px; padding-right: 36px; } .np-head > div { flex: 1; min-width: 0; } .np-head h3 { margin: 0; } .np-head small { color: var(--ink2); font-size: 12px; } .np-head .rbar { margin-top: 4px; max-width: 220px; }
/* 选项结果横幅 */
#result-banner { position: fixed; top: 12px; left: 50%; transform: translateX(-50%); z-index: 70; width: min(640px, calc(100% - 32px)); background: var(--card2); border-radius: 6px; padding: 10px 40px 12px 14px; box-shadow: 0 0 0 1px var(--line2), 0 12px 30px rgba(0,0,0,.3); border-top: 3px solid var(--accent); overflow: hidden; animation: up .2s ease-out; }
#result-banner[hidden] { display: none; }
.pc-in { display: inline-flex; align-items: center; gap: 2px; vertical-align: -3px; margin: 0 1px; } .pc-in .pix, .pc-in canvas, .pc-in img { flex: none; }
.rb-txt { font-size: 13px; line-height: 1.7; margin: 0 26px 6px 0; } .rb-txt p { margin: 0 0 2px; }
.rb-list { display: flex; flex-wrap: wrap; gap: 6px 12px; font-size: 13px; }
.rb-i b { font-family: var(--mono); } .rb-i.up b { color: var(--g); } .rb-i.dn b { color: var(--bad, #d55); } .rb-i.neu { color: var(--accent); }
.rb-x { position: absolute; top: 6px; right: 6px; padding: 1px 8px; font-size: 12px; }
.rb-timer { position: absolute; left: 0; bottom: 0; height: 3px; width: 100%; background: var(--accent); transform-origin: left; animation: rbt 5s linear forwards; }
@keyframes rbt { from { transform: scaleX(1); } to { transform: scaleX(0); } }
/* 亲密度条 + 数值 */
.rbar-w { display: flex; align-items: center; gap: 6px; } .rbar-w .rbar { flex: 1; min-width: 40px; }
.rbar-w em { font-style: normal; font-family: var(--mono); font-size: 11px; flex: none; }
.rv-gray { color: #8a96a0; } .rv-green { color: #4fae6e; } .rv-blue { color: #3f86d0; } .rv-family { color: #d94848; } .rv-partner { color: #ec6fa8; } .rv-comrade { color: #9a5bd0; } .rv-friend { color: #d9a43a; }
.rv-up { color: var(--g); } .rv-dn { color: var(--bad, #d55); }
.fp-rel .rbar-w { width: 170px; flex: none; } .fl .rbar-w { width: 120px; flex: none; } .np-head .rbar-w { max-width: 260px; }
.ai-subs.eq { display: grid; grid-template-columns: repeat(auto-fill, minmax(180px, 1fr)); } .ai-subs.eq button { width: 100%; }
.am-en { margin: 0 0 10px; } .am-en b { min-width: 70px; text-align: right; }
/* 自定义悬浮提示 */
#tip { position: fixed; z-index: 80; max-width: 320px; pointer-events: none; background: var(--card2); color: var(--ink); border: 1px solid var(--line2); border-left: 3px solid var(--accent); border-radius: 4px; padding: 8px 12px; font-size: 12.5px; line-height: 1.6; box-shadow: 0 8px 24px rgba(0,0,0,.3); }
#hov { position: fixed; z-index: 81; width: max-content; max-width: 360px; pointer-events: none; background: var(--card2); color: var(--ink); border: 1px solid var(--line2); border-left: 3px solid var(--accent); border-radius: 4px; padding: 8px 12px; font-size: 12px; line-height: 1.6; box-shadow: 0 8px 24px rgba(0,0,0,.3); }
#hov[hidden] { display: none; } #hov .hv-t { display: block; color: var(--accent); margin-bottom: 2px; } #hov .hv-w { margin: 0 0 6px; color: var(--ink2); } #hov .md-r { gap: 16px; }
details.st-d > summary.stat { grid-template-columns: 82px 1fr 46px auto; cursor: pointer; list-style: none; } details.st-d > summary::-webkit-details-marker { display: none; }
details.st-d .sk-more { font-size: 11px; } details.st-d[open] .sk-more::before { content: '▾ '; }
.st-rows { margin: -2px 0 8px 8px; padding: 4px 8px; border-left: 2px solid var(--line2); font-size: 11.5px; }
#tip[hidden] { display: none; } #tip b { display: block; color: var(--accent); font-family: var(--mono); margin-bottom: 2px; } #tip div { color: var(--ink2); }
.help-btn { margin-left: auto; float: right; font-size: 11.5px; padding: 1px 8px; border-radius: 10px; color: var(--accent); background: transparent; border: 1px solid var(--line2); font-weight: 400; }
.help { display: flex; flex-direction: column; gap: 10px; } .hp-row b { color: var(--accent); font-size: 13.5px; } .hp-row p { margin: 3px 0 0; font-size: 13px; line-height: 1.7; color: var(--ink); }
.stat.am-en { grid-template-columns: 56px 1fr auto; }
.ch-pix { flex: none; display: grid; place-items: center; }
.ch-ico { flex: none; display: grid; place-items: center; width: 44px; height: 44px; } .ch-ico img { max-width: 44px; max-height: 44px; width: auto; height: auto; min-width: 28px; image-rendering: pixelated; border: 0; background: none; }   /* 选项的像素图标（购物网站等） */
.inf-row b small { margin-left: 6px; font-family: var(--mono); font-size: 11px; color: var(--g); font-weight: 400; }
.off-g { margin: 6px 0 8px; } .off-g > b { font-size: 13px; } .off-r { display: grid; grid-template-columns: 110px 1fr auto; gap: 8px; align-items: center; font-size: 12.5px; padding: 3px 0 3px 10px; border-bottom: 1px dashed var(--line); }
.ex-sum { display: grid; grid-template-columns: repeat(5, 1fr); gap: 6px; margin: 4px 0 8px; } .ex-sum div { border: 1px solid var(--line); border-radius: 4px; padding: 6px 8px; display: flex; flex-direction: column; } .ex-sum span { font-size: 11px; color: var(--ink2); } .ex-sum b { font-family: var(--mono); font-size: 16px; } .ex-sum b.up { color: var(--g); } .ex-sum b.dn { color: var(--bad, #d55); }
@media (max-width: 620px) { .ex-sum { grid-template-columns: repeat(3, 1fr); } }
.ex-list { display: flex; flex-direction: column; gap: 6px; max-height: 46vh; overflow: auto; margin-bottom: 10px; }
.ex-row { display: flex; gap: 10px; align-items: center; border: 1px solid var(--line); border-radius: 4px; padding: 8px 10px; cursor: pointer; } .ex-row.on { border-color: var(--accent); background: color-mix(in srgb, var(--accent) 8%, transparent); } .ex-row > span:nth-child(2) { flex: 1; } .ex-c { font-family: var(--mono); font-size: 12px; color: var(--ink2); }
.rdot { display: inline-block; width: 8px; height: 8px; border-radius: 50%; background: #e5484d; margin-left: 4px; vertical-align: super; box-shadow: 0 0 0 2px var(--card); }
.sb { display: inline-block; font-size: 10px; font-weight: 600; padding: 0 5px; border-radius: 2px; margin-left: 6px; vertical-align: 1px; color: #fff; background: #8a96a0; }
.sb-lily { background: var(--accent); } .sb-madic { background: #6b7f4a; } .sb-ars { background: #b07a2a; } .sb-dead { background: #555; } .sb-left { background: #777; }
.sb-s { font-size: 10.5px; font-weight: 400; color: var(--ink2); margin-left: 4px; }
.plan button { display: flex; flex-direction: column; align-items: center; gap: 2px; } .plan button small { font-size: 10px; color: var(--ink2); font-weight: 400; white-space: nowrap; }
.plan { display: grid !important; grid-template-columns: repeat(auto-fill, minmax(118px, 1fr)); gap: 6px; }
.forecast { margin-top: 8px; padding: 8px 10px; border: 1px dashed var(--line2); border-radius: 4px; font-size: 12px; } .forecast > div { display: flex; flex-wrap: wrap; gap: 4px 10px; margin-top: 4px; font-family: var(--mono); } .forecast .inc, .forecast .exp { color: var(--ink); } .forecast .inc b, .forecast .exp b { font-weight: 500; } .forecast .inc b { color: var(--g); } .forecast .exp b { color: var(--bad, #d55); }   /* 字段名白字，只有数字着色（全站统一） */
.sb-s { display: inline-block; max-width: 8.5em; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; vertical-align: -2px; }
.pt-pick { display: flex; flex-wrap: wrap; gap: 6px; margin: 6px 0 4px; } .pt-pick button { display: flex; align-items: center; gap: 6px; padding: 4px 10px; border-radius: 16px; font-size: 12px; } .pt-pick button span { display: flex; flex-direction: column; text-align: left; } .pt-pick button small { font-size: 10.5px; color: var(--ink2); } .pt-pick button.on { border-color: var(--accent); background: color-mix(in srgb, var(--accent) 14%, transparent); }
.scene-wrap { position: relative; }
#scene-tags { position: absolute; inset: 0; pointer-events: none; }
.stag { position: absolute; transform: translate(-50%, -4px); pointer-events: auto; cursor: pointer; display: flex; flex-direction: column; align-items: center; gap: 0; padding: 2px 6px; border-radius: 4px; background: rgba(12, 20, 28, .72); color: #fff; font-size: 10.5px; line-height: 1.3; white-space: nowrap; max-width: 21%; overflow: hidden; box-shadow: 0 2px 6px rgba(0,0,0,.25); }
.stag b { font-size: 11px; } .stag small { font-size: 9.5px; opacity: .85; max-width: 100%; overflow: hidden; text-overflow: ellipsis; }
.stag:hover { background: rgba(12, 20, 28, .92); outline: 1px solid var(--accent); }
@media (max-width: 620px) { .stag small { display: none; } }
.scene-card > .scene-wrap + .scene-cap { border-top: 1px solid var(--line); }
.stag { background: rgba(10, 16, 24, .85); padding: 3px 7px; } .stag small { font-size: 10px; opacity: 1; color: #d6e2ea; } .stag b { color: #fff; }
.legend span { white-space: nowrap; margin-right: 6px; }
.frow.dead, .fr.dead { opacity: .55; filter: grayscale(1); }
/* ---- 风纪委员会 ---- */
.ism { display: inline-block; font-size: 10.5px; line-height: 16px; padding: 0 6px; margin: 0 3px 2px 0; border-radius: 8px; color: #fff; background: #777; white-space: nowrap; vertical-align: 1px; }
.ism-exp { background: #c4541e; } .ism-home { background: #4f7a3a; } .ism-open { background: #2a8fb0; } .ism-closed { background: #8a5a2b; }
.ism-duel { background: #b0303c; } .ism-team { background: #3b5fb0; } .ism-lily { background: #a0449a; } .ism-gear { background: #5e6b78; }
.ism-proG { background: #444; } .ism-antiG { background: #222; }
.md { display: inline-block; font-size: 11.5px; margin-right: 8px; font-family: var(--mono); }
.md.up, .vs-parts .up, .md-r .up, .fz-calc .up { color: var(--g); } .md.dn, .vs-parts .dn, .md-r .dn, .fz-calc .dn, small.dn { color: var(--bad); }
.md small { color: var(--ink2); font-family: inherit; }
.fz-slots { display: flex; flex-wrap: wrap; justify-content: center; gap: 6px; margin: 4px 0; align-items: stretch; }
.fz-slots > .fz-slot { flex: 0 0 calc((100% - 12px) / 3); box-sizing: border-box; } .fz-slots .fz-slot .md { font-size: 11.5px; }
.fz-slots .fz-slot { display: flex; flex-direction: column; gap: 4px; font-size: 12px; min-width: 0; } .fz-slots .fz-slot > div { display: flex; flex-direction: column; align-items: flex-start; gap: 2px; }
.fz-slots .fz-slot > span, .fz-slots .fz-slot > b { align-self: flex-start; }
.fz-slots .fz-slot.locked, .fz-slots .fz-slot.empty { justify-content: center; align-items: center; text-align: center; min-height: 72px; }
@media (max-width: 620px) { .fz-slots > .fz-slot { flex-basis: calc((100% - 6px) / 2); } }
.fz-slot { border: 1px solid var(--line); border-radius: 4px; padding: 6px 8px; background: var(--card2); }
.fz-slot.locked { color: var(--ink2); border-style: dashed; background: transparent; }
.fz-slot.empty { border-style: dashed; }
.fz-slot b { margin-right: 4px; }
.fz-calc small { color: var(--ink2); }
.fz-mem td { vertical-align: middle; }
.fz-opt { border-bottom: 1px dashed var(--line); padding: 5px 0; }
.fz-opt.off { opacity: .55; }
.fz-opt button { float: right; }
.fz-line { margin-left: 4px; font-size: 11px; color: var(--ink2); }
.el-tops { display: flex; gap: 6px; flex-wrap: wrap; margin: 4px 0 8px; }
.el-top { display: flex; align-items: center; gap: 6px; border: 1px solid var(--line); border-radius: 4px; padding: 4px 8px; }
.el-top > b { font-family: var(--mono); color: var(--accent); } .el-top > span { font-family: var(--mono); color: var(--ink2); }
.vs-row { display: flex; align-items: center; gap: 8px; border: 1px solid var(--line); border-radius: 4px; padding: 4px 8px; margin: 4px 0; }
.vs-row .vs-n { min-width: 1.4em; font-family: var(--mono); color: var(--ink2); } .vs-row .vs-name { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.vs-row .vs-sc { font-family: var(--mono); cursor: help; border-bottom: 1px dashed var(--line2); } .vs-row .vs-more { flex: none; }
.vs-row.top { border-color: var(--accent); }
.vs-h { display: flex; justify-content: space-between; } .vs-h span { font-family: var(--mono); font-weight: 700; }
.vs-parts { display: flex; flex-wrap: wrap; gap: 2px 10px; font-size: 11.5px; }
.vs-parts small { color: var(--ink2); }
.md-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(220px, 100%), 1fr)); gap: 8px; }
.md-stat { border: 1px solid var(--line); border-radius: 4px; padding: 6px 8px; }
.md-h { display: flex; justify-content: space-between; border-bottom: 1px solid var(--line); margin-bottom: 3px; } .md-h span { font-family: var(--mono); font-weight: 700; }
.md-r { display: flex; justify-content: space-between; gap: 8px; font-size: 11.5px; } .md-r span:last-child { font-family: var(--mono); white-space: nowrap; }
.skl-h { margin: 8px 0 2px; }
.skl-t td { padding: 1px 4px; font-size: 12px; } .skl-lv { font-family: var(--mono); color: var(--skill); }
/* 顶栏：速度小格、语言下拉、出生卡按钮 */
.spd { display: inline-flex; gap: 2px; align-items: center; padding: 0 2px; }
.spd i { width: 9px; height: 18px; border: 1px solid var(--line2); border-radius: 2px; cursor: pointer; background: var(--card2); }
.spd i.on { background: var(--accent); border-color: var(--accent); box-shadow: 0 0 6px var(--glow); }
.spd-v { font-family: var(--mono); font-size: 12px; min-width: 30px; color: var(--accent); }
.task-grid { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; } .task-grid .tg-cells i { width: 22px; height: 20px; }
.task-grid .tg-cur { display: flex; flex-direction: column; gap: 1px; font-size: 12px; color: var(--ink2); }
#ctl-lang { position: relative; }
.lang-dd { position: absolute; top: 100%; right: 0; z-index: 40; display: flex; flex-direction: column; gap: 3px; padding: 6px; margin-top: 4px; background: var(--card); border: 1px solid var(--line2); border-radius: 4px; box-shadow: var(--shadow); }
.lang-dd button { white-space: nowrap; text-align: left; }
.cta-row { display: flex; justify-content: center; margin-top: 10px; }
/* 手机版：像素画紧接在角色卡下；页签栏离开画面时顶栏滑出一条页签 */
#top-tabs { display: none; }
@media (max-width: 760px) {
  .left, .mid, .right { display: contents; }
  .left > *, .right > * { order: 3; } .mid > * { order: 4; } .right > * { order: 5; }
  #id-card { order: 1; } .mid > .scene-card { order: 2; }
  #st-bag, #st-record { order: 3; }   /* 电脑端在右栏，手机端仍排在「人物」页的资质下面 */
  #tabs { position: static; }
  #top-tabs { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 2px; max-height: 0; overflow: hidden; opacity: 0; transition: max-height .25s ease, opacity .25s ease, margin .25s ease; }
  #top.show-tabs #top-tabs { max-height: 80px; opacity: 1; margin-top: 6px; }
  #top-tabs button { padding: 4px 2px; font-size: 11.5px; border-radius: 3px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
}
.dbg { display: inline-flex; flex-wrap: wrap; gap: 4px; align-items: center; opacity: .8; max-width: 100%; min-width: 0; } .dbg select { font-size: 12px; min-width: 0; max-width: 100%; flex: 1 1 140px; }
/* ---- 结算页 ---- */
#overlay:has(.end2) { align-items: flex-start; }
.end.end2 { width: min(980px, 100%); display: flex; flex-direction: column; gap: 16px; padding: 20px; }
.dcert { border: 1px solid var(--line2); border-radius: 6px; overflow: hidden; background: var(--card); }
.dcert .band { display: flex; justify-content: space-between; gap: 8px; padding: 6px 14px; font-family: var(--mono); font-size: 11px; letter-spacing: .15em; color: #fff; background: linear-gradient(90deg, var(--accent), color-mix(in srgb, var(--accent) 40%, var(--accent2))); }
.dc-body { display: flex; gap: 18px; padding: 16px; align-items: flex-start; }
.dc-main { flex: 1; min-width: 0; }
.dc-main .lbl { font-size: 11px; color: var(--accent); letter-spacing: .2em; }
.dc-main h1 { margin: 2px 0 4px; font-size: 30px; }
.dc-span { font-family: var(--mono); color: var(--ink2); font-size: 13px; }
.story { line-height: 1.8; margin: 10px 0 6px; }
.cause { font-size: 13px; color: var(--ink2); } .cause b { color: var(--bad); margin-left: 4px; }
.summary { display: grid; grid-template-columns: repeat(4, 1fr); border-top: 1px solid var(--line); }
.summary > div { padding: 8px 12px; border-right: 1px solid var(--line); border-bottom: 1px solid var(--line); display: flex; flex-direction: column; min-width: 0; }
.summary small { color: var(--ink2); font-size: 11px; } .summary b { font-size: 15px; overflow-wrap: anywhere; }
.end2 .panel { background: var(--card); border: 1px solid var(--line); border-radius: 6px; padding: 14px 16px; }
.end2 .panel h3 { margin: 0 0 10px; display: flex; justify-content: space-between; align-items: baseline; } .end2 .panel h3 small { color: var(--ink2); font-weight: 400; font-size: 12px; }
.alb-view { position: relative; border: 1px solid var(--line2); border-radius: 4px; overflow: hidden; background: #000; }
.alb-view img { display: block; width: 100%; image-rendering: pixelated; aspect-ratio: 240 / 72; }
#alb-cap { position: absolute; left: 0; right: 0; bottom: 0; padding: 4px 10px; font-size: 12px; color: #fff; background: linear-gradient(transparent, rgba(0,0,0,.65)); }
.alb-strip { display: flex; gap: 6px; overflow-x: auto; padding: 8px 0 2px; }
.alb-strip figure { margin: 0; flex: none; width: 120px; cursor: pointer; border: 2px solid transparent; border-radius: 3px; }
.alb-strip figure.on { border-color: var(--accent); }
.alb-strip img { width: 100%; display: block; image-rendering: pixelated; }
.alb-strip figcaption { font-size: 10.5px; text-align: center; color: var(--ink2); font-family: var(--mono); }
.ach { display: grid; grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)); gap: 6px; }
.ach-i { display: grid; grid-template-columns: 26px 1fr; column-gap: 6px; align-items: center; border: 1px solid var(--line); border-radius: 4px; padding: 6px 8px; opacity: .38; filter: grayscale(1); }
.ach-i.ok { opacity: 1; filter: none; border-color: color-mix(in srgb, var(--accent) 50%, var(--line)); background: color-mix(in srgb, var(--accent) 7%, transparent); }
.ach-i i { grid-row: span 2; font-style: normal; font-size: 18px; text-align: center; color: var(--accent2); }
.ach-i b { font-size: 12.5px; } .ach-i small { font-size: 10.5px; color: var(--ink2); }
.e-grid2 { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; }
.roster { display: grid; grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)); gap: 6px; }
.ro { display: grid; grid-template-columns: 40px 1fr; column-gap: 8px; align-items: center; border: 1px solid var(--line); border-radius: 4px; padding: 6px; }
.ro img { grid-row: span 2; } .ro b { font-size: 13px; } .ro small { font-size: 11px; color: var(--ink2); }
.ro.me { border-color: var(--accent); }
.fulllog summary { cursor: pointer; margin-top: 10px; color: var(--accent); }
.fulllog .log { max-height: 420px; overflow: auto; }
.end2 .go { display: flex; gap: 10px; justify-content: center; }
@media (max-width: 760px) { .summary { grid-template-columns: repeat(2, 1fr); } .e-grid2 { grid-template-columns: 1fr; } .dc-body { flex-direction: column; align-items: center; } .dc-main { text-align: left; width: 100%; } }
.kv span.ism, .kv b span.ism { color: #fff; flex: none; }
/* 择校：徽章与理念列表（P 社式：理念名晶蓝、数值正绿负红） */
.gb { display: inline-block; font-size: 10.5px; line-height: 17px; padding: 0 7px; margin-left: 5px; border-radius: 3px; color: #fff; vertical-align: 2px; font-weight: 500; white-space: nowrap; }
.gb-size-large { background: #7048e8; } .gb-size-small { background: #3b6fd4; } .gb-size-support { background: #2e9b6a; } .gb-size-arsenal { background: #b07a2a; }
.gb-sys-approval { background: #0e8f9e; } .gb-sys-chief { background: #c2410c; } .gb-sys-none { background: #64748b; }
.gb-line { background: transparent; color: var(--accent); border: 1px solid var(--accent); }
.il { margin-top: 6px; display: flex; flex-direction: column; gap: 3px; }
.il-h { font-size: 11px; color: var(--ink2); }
.il-r { display: flex; flex-wrap: wrap; align-items: center; gap: 2px 6px; font-size: 12px; }
.idn { color: #0284c7; font-weight: 600; }
:root[data-theme="dark"] .idn { color: #4fd1ff; }
@media (prefers-color-scheme: dark) { :root:not([data-theme="light"]) .idn { color: #4fd1ff; } }
.md b { font-weight: 600; font-family: var(--mono); } .md b.up { color: var(--g); } .md b.dn { color: var(--bad); }
.ch-t { display: flex; flex-wrap: wrap; align-items: center; gap: 4px 0; } .ch-t .gb:first-of-type { margin-left: 8px; }
.il-r > span { display: inline-flex; flex-wrap: wrap; gap: 0 4px; }
#modal .fact { white-space: pre-line; }
/* 选举概要：最上面写这次选举什么时候发表结果、各职位预计谁当选 */
.el-sum { margin: 4px 0 10px; padding: 10px 14px; border: 1px solid var(--line2); border-left: 3px solid var(--accent); background: color-mix(in srgb, var(--accent) 6%, var(--card)); }
.el-sum-h { display: flex; align-items: baseline; gap: 12px; flex-wrap: wrap; } .el-sum-h b { color: var(--accent); font-size: 15px; } .el-sum-h small { margin-left: 4px; color: var(--ink2); }
.el-sum-p { display: flex; align-items: center; gap: 8px 16px; flex-wrap: wrap; margin-top: 8px; } .el-sum-p > small { color: var(--ink2); }
.el-pd { display: inline-flex; align-items: center; gap: 6px; } .el-pd > small { color: var(--ink2); font-size: 11.5px; }
.el-in { margin-top: 10px; padding: 8px 12px; text-align: center; font-weight: 700; color: var(--accent); border: 1px solid color-mix(in srgb, var(--accent) 45%, var(--line)); background: color-mix(in srgb, var(--accent) 8%, transparent); }
.el-next { display: block; margin-top: 4px; text-align: center; font-size: 11px; color: var(--ink2); }
.el-in small { display: block; margin-top: 2px; font-weight: 400; font-size: 11px; color: var(--ink2); }
/* 事件小字面板里的「项目 · 内容」行（升级花费 / 当前效果 / 升级后效果）；原作典型例子的引用块 */
#modal .ev-rules .er-r { display: grid; grid-template-columns: 9em minmax(0, 1fr); gap: 8px; padding: 3px 0; border-bottom: 1px dashed var(--line); } #modal .ev-rules .er-r:last-child { border-bottom: 0; }
#modal .ev-rules .er-r > span { color: var(--ink2); }
#modal .ev-lore { margin-top: 8px; padding: 8px 12px; font-size: 12px; line-height: 1.65; color: var(--ink2); border-left: 2px solid var(--line2); font-style: italic; } #modal .ev-lore b { display: block; font-style: normal; font-size: 11px; color: var(--accent); margin-bottom: 2px; }
/* 事件的小字面板：制度 / 数值说明，放在叙述正文下面，字小、色淡 */
#modal .ev-rules { margin-top: 10px; padding: 8px 12px; font-size: 12px; line-height: 1.6; color: var(--ink2); background: color-mix(in srgb, var(--card) 55%, transparent); border: 1px solid var(--line); border-left: 2px solid color-mix(in srgb, var(--accent) 50%, var(--line)); }
/* 选拔说明：分板块 */
.defs { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; margin: 8px 0 12px; }
.defs-s { border: 1px solid var(--line); border-radius: 4px; padding: 8px 10px; background: color-mix(in srgb, var(--card2) 70%, transparent); }
.defs-s h4 { margin: 0 0 6px; font-size: 12.5px; color: var(--accent); letter-spacing: .1em; }
.defs-r { display: flex; flex-direction: column; gap: 2px; margin-bottom: 6px; font-size: 11.5px; color: var(--ink2); }
.defs-r > .gb, .defs-r > .ism { margin-left: 0; align-self: flex-start; }
.defs-r .idn { font-size: 12px; }
@media (max-width: 760px) { .defs { grid-template-columns: 1fr; } }
.defs { align-items: start; }
.defs-s summary { cursor: pointer; font-size: 12.5px; color: var(--accent); font-weight: 600; list-style: none; }
.defs-s summary::-webkit-details-marker { display: none; }
.defs-s summary::before { content: '▸ '; } .defs-s[open] summary::before { content: '▾ '; }
.defs-s[open] summary { margin-bottom: 6px; }
/* 决断弹窗：先出框体与标题（横向展开 + 扫描线），正文与选项再上下伸展 */
.sh-body { display: grid; grid-template-rows: 1fr; }
.sh-in { min-height: 0; overflow: hidden; }
#modal.arming .sheet:not(.folded) { animation: shFrame .22s cubic-bezier(.2,.8,.2,1) both; }
#modal.arming .sh-body { animation: shUnfold .62s cubic-bezier(.22,.9,.24,1) .2s both; }
#modal.arming .sheet:not(.folded)::after { content: ''; position: absolute; left: 0; right: 0; top: 50%; height: 2px; pointer-events: none; background: var(--accent); box-shadow: 0 0 14px var(--accent), 0 0 30px var(--glow); animation: shScan .85s ease-out both; }
#modal.arming .choices { pointer-events: none; }
/* 同一弹窗只是内容更新（包括入场动画还没播完时）：新生成的卡片不重播入场动画，以前看起来像弹出了好几次 */
#modal.keep .sheet, #modal.keep.open.arming > .sheet:not(.folded), #modal.keep.arming .sh-body, #modal.keep.arming .sh-in { animation: none; }
#modal.keep.arming .sheet:not(.folded)::after { content: none; }
@keyframes shFrame { from { transform: scaleX(.6); opacity: 0; filter: brightness(1.8); } to { transform: none; opacity: 1; filter: none; } }
@keyframes shUnfold { from { grid-template-rows: 0fr; opacity: .15; } to { grid-template-rows: 1fr; opacity: 1; } }
@keyframes shScan { 0% { opacity: 0; transform: scaleX(0); } 25% { opacity: 1; transform: scaleX(1); } 100% { opacity: 0; transform: scaleX(1); } }
@media (prefers-reduced-motion: reduce) { #modal.arming .sheet, #modal.arming .sh-body, #modal.arming .sheet::after { animation-duration: .01s !important; animation-delay: 0s !important; } }
/* 行动菜单 / 人物卡：打开时同款展开动画（ui.armBox 只在打开或换内容种类时加 .arming） */
#act-menu.arming > .amenu, #npc-card.arming > .ncard { animation: shFrame .22s cubic-bezier(.2,.8,.2,1) both; }
#act-menu.arming > .amenu > .sh-body > .sh-in, #npc-card.arming > .ncard > .sh-body > .sh-in { animation: shEdge .85s ease-out both; }   /* 同 #modal.arming .sh-in：随展开下移的下边缘光，不再有固定在中线的扫描线 */
#act-menu.arming > .amenu > .sh-body, #npc-card.arming > .ncard > .sh-body { animation: shUnfold .62s cubic-bezier(.22,.9,.24,1) .2s both; }   /* 同 #modal.arming .sh-body */
@media (prefers-reduced-motion: reduce) { #act-menu.arming *, #npc-card.arming *, #act-menu.arming > .amenu, #npc-card.arming > .ncard { animation-duration: .01s !important; animation-delay: 0s !important; } }
/* 顶栏：播放组 / 系统组；手机版播放组变成底栏 */
.ctl-play, .ctl-sys { display: flex; gap: 6px; flex-wrap: wrap; align-items: center; }
#tabs button .rdot, #top-tabs button .rdot { margin-left: 3px; vertical-align: 1px; }
@media (max-width: 760px) {
  .ctl-sys { margin-left: auto; }
  .ctl-play { position: fixed; left: 0; right: 0; bottom: 0; z-index: 30; flex-wrap: nowrap; justify-content: space-between; gap: 4px;
    padding: 8px 10px calc(8px + env(safe-area-inset-bottom)); border-top: 1px solid var(--line); backdrop-filter: blur(10px); background: color-mix(in srgb, var(--bg) 90%, transparent); }
  .ctl-play button { padding: 6px 8px; font-size: 12px; white-space: nowrap; }
  .ctl-play .spd i { width: 8px; height: 20px; }
  .cols { padding-bottom: 90px; }
  #toast { bottom: 76px; }
  #game[hidden] .ctl-play { display: none; }
}
/* 自动决断：高亮选中的选项 + 倒计时条 */
.choices button.auto-pick { border-color: var(--accent); box-shadow: 0 0 0 1px var(--accent), 0 0 18px var(--glow); background: color-mix(in srgb, var(--accent) 12%, var(--card2)); }
.auto-bar { display: flex; align-items: center; gap: 10px; margin-top: 12px; font-size: 12px; color: var(--ink2); }
.ab-track { flex: 1; height: 4px; border-radius: 2px; background: var(--line); overflow: hidden; }
.ab-track i { display: block; height: 100%; width: 100%; background: linear-gradient(90deg, var(--accent), var(--accent2)); box-shadow: 0 0 8px var(--accent); transform-origin: left; animation: abRun linear both; }
@keyframes abRun { from { transform: scaleX(0); } to { transform: scaleX(1); } }
/* 顶栏：品牌与年龄之间留出空间；角色名 + 身份 */
.brand { margin-right: 6px; padding-right: 4px; }
.who { display: flex; align-items: baseline; gap: 6px; flex-wrap: wrap; min-width: 0; }
.who b { font-size: 15px; }
.who .sb { font-size: 10.5px; padding: 0 6px; border-radius: 3px; color: #fff; }
.who small { color: var(--ink2); font-size: 12px; }
/* 选拔说明：竖向清单，一个板块一行；条目为「徽章 + 说明」同行 */
.defs { grid-template-columns: 1fr; gap: 6px; }
.defs-r { flex-direction: row; align-items: baseline; gap: 8px; margin-bottom: 4px; }
.defs-r > .gb, .defs-r > .ism, .defs-r > span:first-child { flex: none; }
.defs-r > .gb { min-width: 84px; text-align: center; }
.fam-p { display: flex; gap: 8px; align-items: center; padding: 4px 0; border-bottom: 1px dashed var(--line); }
.fam-p b { font-size: 13px; } .fam-p small { display: block; font-size: 11px; color: var(--ink2); }
/* 人际页「朋友加成」一行：说明可换行，右侧数值不溢出 */
.kv.fbonus { flex-wrap: wrap; gap: 2px 12px; align-items: flex-start; }
.kv.fbonus > span { flex: 1 1 200px; min-width: 0; }
.kv.fbonus > span small { display: block; }
.kv.fbonus > b { margin-left: auto; max-width: 100%; text-align: right; overflow-wrap: anywhere; }
/* 事件选项的数值词条 */
.ch-fx .md { margin-right: 6px; font-family: inherit; }
.ch-fx .md b { font-family: var(--mono); }
.md b.pc { color: var(--accent); } .md b.ps { color: #0284c7; font-family: inherit; }
:root[data-theme="dark"] .md b.ps { color: #4fd1ff; }
@media (prefers-color-scheme: dark) { :root:not([data-theme="light"]) .md b.ps { color: #4fd1ff; } }
/* 身份徽章统一（角色卡、顶栏、好友列表、人物卡、互动弹窗共用 .sb） */
.sb { font-family: var(--mono); font-size: 11px; font-weight: 600; padding: 0 8px; border-radius: 2px; letter-spacing: .05em; line-height: 17px; }
.sb-civil { background: var(--accent2); }
.idbadge { margin-top: 4px; } .idbadge .sb { margin-left: 0; }
.sb-s { font-size: 11px; color: var(--ink2); margin-left: 4px; }
/* 「⋯」菜单：桌面版不显示按钮，两个按钮直接排在顶栏 */
#ctl-more { display: none; }
.ctl-more-grp { display: inline-flex; gap: 6px; }
#mbar[hidden] { display: none !important; }
@media (max-width: 760px) {
  #mbar { position: fixed; left: 0; right: 0; bottom: 0; z-index: 30; border-top: 1px solid var(--line); backdrop-filter: blur(10px); background: color-mix(in srgb, var(--bg) 92%, transparent); padding: 6px 10px calc(8px + env(safe-area-inset-bottom)); }
  #mbar .mb-time .sub { font-size: 11.5px; }
  #mbar .mb-time .tline { margin: 4px 0 6px; }
  #mbar .ctl-play { position: relative; inset: auto; padding: 0; border: none; background: none; backdrop-filter: none; justify-content: flex-start; gap: 8px; }
  #ctl-more { display: inline-block; margin-left: auto; font-size: 16px; padding: 4px 14px; }
  .ctl-more-grp { display: none; position: absolute; right: 0; bottom: calc(100% + 8px); flex-direction: column; gap: 6px; padding: 8px; background: var(--card); border: 1px solid var(--line2); border-radius: 6px; box-shadow: var(--shadow); }
  .ctl-play.more-open .ctl-more-grp { display: flex; }
  .ctl-more-grp button { white-space: nowrap; text-align: left; }
  .cols { padding-bottom: 136px; }
  #toast { bottom: 120px; }
}
/* 速度：◀ 格子 ▶（按钮与格子等高） */
.spd-b { height: 20px; min-width: 22px; padding: 0 5px !important; font-size: 10px !important; line-height: 18px; display: inline-flex; align-items: center; justify-content: center; }
#ctl-speed { align-items: center; }
.pt-n { font-family: var(--mono); color: var(--accent); }
@media (max-width: 760px) { .spd-b { height: 22px; min-width: 26px; } }
/* 决断弹窗动画修正：展开结束后不再回落到通用的 up 动画；去掉固定在中线的扫描线，改为随展开移动的下边缘光 */
#modal.open > .sheet:not(.folded) { animation: none; }
#modal.open.arming > .sheet:not(.folded) { animation: shFrame .22s cubic-bezier(.2,.8,.2,1) both; }
#modal.arming .sheet:not(.folded)::after { content: none; display: none; }
#modal.arming .sh-in { animation: shEdge .85s ease-out both; }
@keyframes shEdge { 0%, 70% { box-shadow: inset 0 -2px 0 var(--accent), 0 6px 16px -6px var(--glow); } 100% { box-shadow: inset 0 -2px 0 transparent, 0 6px 16px -6px transparent; } }
/* 训练方针：搭档槽位 */
.pslots { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; margin-bottom: 8px; }
.ps-l { font-size: 12.5px; color: var(--ink2); }
.ps-cells { display: flex; gap: 6px; }
.pslot { width: 52px; height: 52px; padding: 0; display: flex; flex-direction: column; align-items: center; justify-content: center; border: 1px dashed var(--accent); border-radius: 4px; font-size: 20px; color: var(--accent); background: transparent; }
.pslot.on { border-style: solid; background: color-mix(in srgb, var(--accent) 10%, transparent); }
.pslot small { font-size: 10px; color: var(--ink); max-width: 50px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.ps-cap { font-size: 12px; color: var(--ink2); } .ps-cap .ps-k { color: var(--ink); } .ps-cap b { color: var(--accent); font-family: var(--mono); }
.ps-cap small { display: block; font-size: 11px; }
.pt-row .ai-main { display: grid; grid-template-columns: 34px 1fr; column-gap: 8px; align-items: center; }
.pt-row .ai-main img { grid-row: span 2; }
.pt-row.on { border-color: var(--accent); background: color-mix(in srgb, var(--accent) 8%, transparent); }
:root .pt-row.on, :root .pt-row.on b, :root .pt-row.on small { color: var(--ink); } :root .pt-row.on small { color: var(--ink2); }
/* 行动项：频率徽章、数值上色 */
.freq { display: inline-block; margin-left: 8px; font-size: 10.5px; font-weight: 500; line-height: 16px; padding: 0 6px; border-radius: 8px; border: 1px solid var(--line2); color: var(--ink2); vertical-align: 2px; font-family: var(--mono); }
b.vup { color: var(--g); font-weight: 600; } b.vdn { color: var(--bad); font-weight: 600; }
/* 统一的数值上色 */
b.vup { color: var(--g); font-weight: 600; } b.vdn { color: var(--bad); font-weight: 600; }
.forecast b.vup, .forecast b.vdn { font-weight: inherit; }
.fc-d > summary { display: flex; align-items: flex-start; justify-content: space-between; gap: 8px; cursor: pointer; list-style: none; } .fc-d > summary::-webkit-details-marker { display: none; } .fc-d[open] .sk-more::before { content: '▾ '; } .fc-d .fc-h { flex: 1; min-width: 0; } .fc-d .fc-h > div { display: flex; flex-wrap: wrap; gap: 4px 10px; margin-top: 4px; } .fc-blocks { display: grid; grid-template-columns: repeat(auto-fill, minmax(190px, 1fr)); gap: 8px; margin-top: 8px; } .fc-blocks .fx-blk + .fx-blk { margin-top: 0; }
/* 顶栏精力条 */
.top-en { display: flex; align-items: center; gap: 8px; margin: 6px 0 2px; font-size: 12px; }
.top-en[hidden] { display: none; }
.top-en span { color: var(--ink2); white-space: nowrap; } .top-en .bar { flex: 1; } .top-en b { font-family: var(--mono); font-size: 12px; white-space: nowrap; }
/* 稀有技能：觉醒概率、训练按钮、折叠 */
.rare-p { font-size: 12px; margin: 2px 0; }
.rare-act { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; } .rare-act span { font-size: 12px; color: var(--ink2); }
.cf-out { display: block; margin-top: 4px; }
.ot-row { align-items: flex-start; flex-wrap: wrap; } .ot-row .xp-d { flex: 1; min-width: 160px; }
.ai-main .fx-blk { margin: 4px 0; }
.fx-blk { min-width: 170px; max-width: 320px; padding: 2px 8px; border-left: 2px solid var(--line2); font-size: 11.5px; color: var(--ink2); } .fx-blk .md-r { gap: 14px; }
.fx-blk + .fx-blk { margin-top: 6px; } .fx-blk .md-r > span:first-child { display: flex; align-items: center; gap: 4px; flex-wrap: wrap; } .fx-blk .md-r { align-items: center; } .fx-tot { color: var(--ink); font-weight: 600; border-bottom: 1px dashed var(--line); margin-bottom: 1px; }

.rare-more > summary { cursor: pointer; margin: 10px 0 6px; color: var(--accent); font-size: 13px; }
/* 工厂科经验、CHARM 比较 */
.xp-row { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; } .xp-row span { font-size: 12px; color: var(--ink2); }
.cmp { font-size: 12px; }
/* 相性文字、经验条同行、加成两栏 */
.fit { font-style: normal; font-weight: 600; margin-left: 2px; }
.fit-1 { color: #c0392b; } .fit-2 { color: var(--bad); } .fit-3 { color: var(--y); } .fit-4 { color: var(--g); } .fit-5 { color: #1f9d55; text-shadow: 0 0 6px color-mix(in srgb, var(--g) 40%, transparent); }
.xpline { display: flex; align-items: center; gap: 8px; } .xpline .bar { flex: 1; } .xpline small { white-space: nowrap; font-family: var(--mono); color: var(--ink2); font-size: 11.5px; }
.bonus2 { display: flex; flex-direction: column; gap: 4px; margin: 6px 0; padding: 6px 0; border-top: 1px dashed var(--line); border-bottom: 1px dashed var(--line); }
.bonus2 > div { display: flex; flex-direction: column; gap: 1px; }
/* 职业树的职责卡：当前等级 · 下一等级 · 训练 排在一行（窄屏自动换行） */
.rl-row { display: flex; align-items: center; gap: 8px 18px; flex-wrap: wrap; margin: 6px 0; padding: 6px 0; border-top: 1px dashed var(--line); border-bottom: 1px dashed var(--line); }
.rl-row .bonus2 { flex-direction: row; flex-wrap: wrap; gap: 6px 18px; margin: 0; padding: 0; border: 0; flex: 1 1 auto; }
.rl-row .rb { margin: 0 0 0 auto; } .bonus2 span { font-size: 11.5px; color: var(--ink2); } .bonus2 b { font-weight: 500; font-size: 12.5px; }
.rb { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; }
.fz-mem b.up { color: var(--g); } .fz-mem b.dn { color: var(--bad); }
.seat-n { font-family: var(--mono); font-weight: 500; margin-left: 4px; } .seat-n b.dn { color: var(--bad); }
.meet-b b.up { color: var(--g); } .meet-b b.dn { color: var(--bad); }
/* 更换 CHARM：价格与维护费在右上，购买按钮在右侧垂直居中 */
.sk.shop-it { padding-right: 92px; min-height: 96px; }
.sk.shop-it p { margin-bottom: 0; }
.shop-pr { position: absolute; right: 10px; top: 8px; text-align: right; line-height: 1.3; }
.shop-pr b { display: block; font-family: var(--mono); font-size: 13px; color: var(--ink); }
.shop-pr b.dn { color: var(--bad); }
.shop-pr small { color: var(--ink2); font-size: 11px; }
.sk.shop-it > button { position: absolute; right: 10px; top: 50%; transform: translateY(-50%); margin-top: 12px; }
/* 弹窗里有 .pop-scroll 时：标题、关闭按钮和底部说明固定，只有框里的列表滚动 */
.amenu:has(.pop-scroll) { display: flex; flex-direction: column; overflow: hidden; }
.amenu > .sh-body { flex: 1 1 auto; min-height: 0; } .amenu > .sh-body > .sh-in { display: flex; flex-direction: column; min-height: 0; }   /* 内容区（和事件弹窗同一结构） */
.amenu:has(.pop-scroll) > h3 { flex: none; padding-right: 44px; }
.amenu .sh-in > .pop-scroll { flex: 1 1 auto; min-height: 0; overflow: auto; border: 1px solid var(--line2); border-radius: 4px; padding: 8px; background: color-mix(in srgb, var(--card) 60%, transparent); }
.amenu .sh-in > .pop-scroll > * { flex: none; }   /* 列表项保持原高，人多时滚动而不是被压扁 */
.amenu .sh-in > .hint { flex: none; margin: 10px 0 0; }
.amenu .sh-in > .pop-scroll > .skl { display: grid; grid-template-columns: 1fr; gap: 8px; }
/* 人际分组 + 特别关注 */
.soc-g { margin-top: 10px; }
.soc-g > summary { cursor: pointer; font-weight: 600; font-size: 13px; padding: 4px 0; color: var(--ink); }
.soc-g > summary .dim { font-weight: 400; font-family: var(--mono); margin-left: 4px; }
.soc-g > summary .soc-view { margin-left: 10px; font-size: 11.5px; padding: 1px 4px; font-weight: 400; background: var(--bg2, transparent); color: var(--ink); border: 1px solid var(--line); border-radius: 3px; }
.soc-st { display: flex; flex-wrap: wrap; gap: 2px 8px; font-size: 11.5px; color: var(--ink2); margin-top: 3px; }
.soc-st b { color: var(--ink); font-family: var(--mono); font-weight: 600; } .soc-st .soc-gr { flex-basis: 100%; }
.soc-g > .friends { margin-top: 6px; }
.fr { position: relative; align-items: center; }
.fr > .fr-act { align-self: center; margin-right: 18px; }
.fr > .fr-star { position: absolute; right: 4px; top: 3px; border: 0; background: none; padding: 0 3px; font-size: 15px; line-height: 1; color: var(--ink2); cursor: pointer; }
.fr > .fr-star:hover { color: var(--accent2); }
.fr > .fr-star.on { color: #f0c24b; }
.fr > .fr-act { margin-right: 0; }
.fr > .fr-star, .frow > .fr-star { background: transparent !important; box-shadow: none; }
.friends { grid-template-columns: repeat(auto-fill, minmax(min(340px, 100%), 1fr)); }
.fl { flex-wrap: wrap; }
.frow { position: relative; }
.frow > .fr-star { position: absolute; right: 2px; top: 1px; font-size: 13px; line-height: 1; color: var(--ink2); cursor: pointer; padding: 0 2px; }
.frow > .fr-star.on { color: #f0c24b; }
.frow > .fbtn { margin-top: 8px; }
.flist .soc-g { margin-top: 4px; } .flist .soc-g > summary { font-size: 12px; }
.fr > .fr-star.on, .frow > .fr-star.on { color: #f0c24b !important; } .fr > .fr-star:not(.on) { color: var(--ink2) !important; } .fr > .fr-star { border: 0 !important; }
button.mini, .tbl td > button { white-space: nowrap; }
.el .tbl td:last-child, .fz-mem td:last-child { white-space: nowrap; width: 1%; }
.el-pick { white-space: nowrap; }
.nc-act.top { margin: 8px 0 4px; }
/* 装配部件：固定区不参与滚动；框里的小标题、库存卡没有价格时按钮照样右侧居中 */
.amenu .sh-in > *:not(.pop-scroll) { flex: none; }
.amenu .sh-in > .pop-scroll > h4 { margin: 6px 2px 6px; }
.amenu .sh-in > .pop-scroll > h4:first-child { margin-top: 2px; }
.amenu .sh-in > .pop-scroll .skl { display: grid; grid-template-columns: 1fr; gap: 8px; }
.sk.shop-it.inv { min-height: 72px; }
.sk.shop-it.inv > button { margin-top: 0; }
.parts-slots { margin-bottom: 10px; }
/* 县详情：每所 Garden 一个块 */
.gsec { border: 1px solid var(--line); border-radius: 4px; padding: 8px 10px; margin: 6px 0; background: var(--card2); }
.gsec.fallen { opacity: .55; }
.gsec-h { margin-bottom: 4px; font-size: 13px; }
.gsec .kv { font-size: 12px; }
.gsec-o { margin-top: 4px; } .gsec-o > .dim { font-size: 11.5px; display: block; margin-bottom: 2px; }
/* 县详情 Nest：四列（名称 / 等级 / 耐久条 / 状态） */
.nest-g { font-family: var(--mono); } .nest-g.g3 { color: var(--bad); } .nest-g.g2 { color: #e08a5b; }
.exp-pan { margin: 4px 0 8px; padding: 8px 10px; border: 1px solid color-mix(in srgb, var(--bad) 50%, var(--line)); border-radius: 4px; background: color-mix(in srgb, var(--bad) 5%, var(--card2)); }
.exp-pan .kv { font-size: 12px; }
.exp-bar { display: flex; height: 10px; border-radius: 3px; overflow: hidden; margin: 8px 0 2px; background: var(--line); }
.exp-bar .ok { background: var(--g); } .exp-bar .ng { background: var(--bad); }
.exp-bar-l { display: flex; justify-content: space-between; font-size: 11px; font-family: var(--mono); margin-bottom: 4px; }
.exp-pan b.up, .exp-pan span.up { color: var(--g) !important; } .exp-pan b.dn, .exp-pan span.dn, .nest-st b.dn { color: var(--bad) !important; }
.sk .lv.lv-in { position: static; margin-left: 8px; font-size: 12px; padding: 0 5px; border: 1px solid var(--skill); border-radius: 3px; vertical-align: 1px; }
/* 外征弹窗的军团行：名称 / 学院·评级·战力 / 队长与引荐人头像各占一行 */
.ex-info { display: flex; flex-direction: column; gap: 3px; min-width: 0; }
.ex-ppl { display: flex; flex-wrap: wrap; align-items: center; gap: 4px; }
.ex-p { display: inline-flex; align-items: center; gap: 4px; color: var(--ink); font-weight: 600; }
.fbonus2 { margin-bottom: 6px; } .fbonus2 > b { font-size: 13px; } .fbonus2 > .hint { margin: 2px 0 6px; }

/* Garden 页子标签 */
/* 子标签栏（Garden）：和顶部标签栏同款，通栏平分，和下方板块连成一体 */
.subtabs { display: grid; gap: 0; margin-bottom: -16px; background: var(--card); border: 1px solid var(--line); border-bottom: none; border-radius: 6px 6px 0 0; overflow: hidden; }
.subtabs button { padding: 8px 4px; font-size: 12.5px; border-radius: 0; border: none; border-bottom: 2px solid var(--line); border-right: 1px solid color-mix(in srgb, var(--line) 60%, transparent); background: transparent; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; box-shadow: none; }
.subtabs button:last-child { border-right: none; }
.subtabs button.on { border-bottom-color: var(--accent); background: color-mix(in srgb, var(--accent) 14%, transparent); color: var(--accent); }
.subtabs + .card { border-top: none; border-top-left-radius: 0; border-top-right-radius: 0; }
/* 标签图标 */
.tico { width: 15px; height: 15px; flex: none; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
#tabs button, #top-tabs button, .subtabs button { display: inline-flex; align-items: center; justify-content: center; gap: 5px; }
#tabs button > span, #top-tabs button > span, .subtabs button > span { overflow: hidden; text-overflow: ellipsis; }
#top-tabs .tico { width: 12px; height: 12px; }
#tabs button { padding-left: 2px; padding-right: 2px; gap: 3px; } #tabs .tico { width: 13px; height: 13px; }
@media (max-width: 620px) { .subtabs button .tico { display: none; } }
/* 技能说明弹窗末尾的快捷训练 */
.ent-train { margin-top: 10px; padding-top: 8px; border-top: 1px dashed var(--line); }
.skl-t .ent-k { cursor: pointer; border-bottom: 1px dashed currentColor; }

/* 「明细」触发器：点击固定悬浮框，不展开面板 */
[data-hovpin] { cursor: pointer; user-select: none; }
.stat.st-d { grid-template-columns: 82px 1fr 46px auto; }
.stat.st-d .sk-more { font-size: 11px; }
div.sk-why { display: flex; align-items: baseline; justify-content: space-between; gap: 8px; }
div.fb-sec { display: flex; align-items: center; gap: 8px; } div.fb-sec .sk-more { margin-left: auto; }
span.ps-d { display: inline-flex; align-items: center; gap: 6px; }
span.xp-d { display: inline-flex; align-items: baseline; gap: 8px; min-width: 0; } span.xp-d > span:first-child { color: var(--ink2); }
.ot-row span.xp-d { flex: none; }
.tr-gain .sk-more { margin-left: 8px; }
.fz-slots .fz-sh { display: inline-flex; align-items: center; gap: 6px; flex-wrap: wrap; }
.skl-t .skl-q { text-align: right; white-space: nowrap; width: 1%; } .skl-tr { padding: 1px 6px; font-size: 11px; } .skl-tr small { color: var(--bad); font-family: var(--mono); }
.st-mods { display: flex; flex-wrap: wrap; gap: 2px 12px; margin: -2px 0 6px; padding-left: 2px; font-size: 11.5px; }
.cur-n { color: var(--ink2); font-weight: 400; }
.skl-t td:first-child, .skl-t td:nth-child(3) { white-space: nowrap; width: 1%; } .skl-t td:first-child { font-size: 11px; }
.skl-t td:nth-child(3) small { font-size: 10px; }
.skl-tr { padding: 1px 5px; } .skl-tr small { font-size: 10px; }
.fz-mem .fz-who { white-space: nowrap; } .fz-mem .fz-isms { white-space: nowrap; } .fz-mem .fz-isms > * { display: inline-block; margin-right: 3px; }
.fz-mem th { white-space: nowrap; }
/* 「行动」按钮：高亮；电脑端在「下一个决断」前，手机端在「继续」右边 */
button#ctl-act { color: var(--accent); border-color: var(--accent); font-weight: 700; padding: 3px 14px; position: relative; animation: actGlow 2.4s ease-in-out infinite; }
@keyframes actGlow { 0%, 100% { box-shadow: 0 0 0 0 transparent; } 50% { box-shadow: 0 0 10px 1px color-mix(in srgb, var(--accent) 55%, transparent); } }
@media (prefers-reduced-motion: reduce) { button#ctl-act { animation: none; box-shadow: 0 0 6px color-mix(in srgb, var(--accent) 40%, transparent); } }
button#ctl-act[hidden] { display: none; }
.ctl-act .rdot { margin-left: 4px; vertical-align: 1px; }
@media (max-width: 760px) {
  #mbar .ctl-play > #ctl-pause { order: 0; } #mbar .ctl-play > #ctl-act { order: 1; padding: 6px 14px; } #mbar .ctl-play > #ctl-speed { order: 2; } #mbar .ctl-play > #ctl-more { order: 3; } #mbar .ctl-play > .ctl-more-grp { order: 4; }
  #mbar .top-en { margin: 0 0 6px; }
}
/* 精力图标：花费写成「图标 + 红字数值」；精力条标签前也带图标 */
.en-ico { width: 1em; height: 1em; vertical-align: -0.14em; fill: currentColor; flex: none; }
/* 精力：图标与数值、标签一律黄色（--e，与精力条同色） */
.en-c, button .en-c, button:disabled .en-c { display: inline-flex; align-items: center; gap: 1px; color: var(--e); white-space: nowrap; font-family: var(--mono); } .en-c b { color: inherit; font-weight: 700; }
/* 金钱（玉绿硬币）/ 声望（橙色星）：花费写成「图标 −NN」，状态栏标签前也有图标 */
.mo-ico, .fa-ico { width: 1em; height: 1em; vertical-align: -0.14em; flex: none; } .mo-ico circle, .fa-ico path:first-child { fill: currentColor; }
.mo-c, .fa-c, button .mo-c, button .fa-c, button:disabled .mo-c, button:disabled .fa-c { display: inline-flex; align-items: center; gap: 2px; white-space: nowrap; font-family: var(--mono); } .mo-c b, .fa-c b { color: var(--r); font-weight: 700; }   /* 图标是金钱 / 声望的颜色，减少的数字用红色 */
.mo-c, .mo-l { color: var(--mo); } .fa-c, .fa-l { color: var(--fa); } .mo-l, .fa-l { display: inline-flex; align-items: center; gap: 3px; }
.c-lack .fa-c, .c-lack .mo-c { color: var(--r); } .fa-c.own b, .mo-c.own b { color: inherit; }   /* 持有量：数字和图标同色 */
.en-l { display: inline-flex; align-items: center; gap: 3px; color: var(--e); } .en-l .en-ico { color: var(--e); }
.cur-res { margin: 4px 0 8px; } .cur-res .stat { margin: 2px 0; } .cur-res .kv { margin: 0; padding: 2px 0; font-size: 12.5px; }
.hv-calc { font-size: 11px; color: var(--ink2); margin: 0 0 4px 8px; font-family: var(--mono); }
.fx-calc { display: block; font-size: 10.5px; color: var(--ink2); font-family: var(--mono); line-height: 1.4; } .fx-blk > .fx-calc { margin-top: 4px; border-top: 1px dashed var(--line); padding-top: 3px; } .fx-how { font-size: 11px; color: var(--ink2); margin: 6px 0 0; }
.pc-meet { display: inline-flex; align-items: center; gap: 6px; white-space: nowrap; }
.fx-blk .md-r .fx-calc { flex-basis: 100%; }
.el-who { display: inline-flex; align-items: center; gap: 4px; flex-wrap: wrap; } .el-who .ism { font-size: 10.5px; }
.el-sc { white-space: nowrap; font-size: 12px; cursor: help; } .el-trend { margin-bottom: 6px; } .el-trend b { display: inline-flex; gap: 3px; flex-wrap: wrap; justify-content: flex-end; }
/* 大横排按钮：占满整行，轻科幻（斜切角 + 细描边 + 扫光） */
button.wbtn { display: flex; align-items: center; justify-content: center; gap: 8px; width: 100%; margin: 8px 0 2px; padding: 7px 12px; font-size: 13px; font-weight: 600; letter-spacing: .08em;
  color: var(--accent); background: linear-gradient(90deg, color-mix(in srgb, var(--accent) 6%, transparent), color-mix(in srgb, var(--accent) 16%, transparent), color-mix(in srgb, var(--accent) 6%, transparent));
  border: 1px solid color-mix(in srgb, var(--accent) 55%, transparent); border-radius: 0; clip-path: polygon(10px 0, 100% 0, 100% calc(100% - 10px), calc(100% - 10px) 100%, 0 100%, 0 10px); position: relative; overflow: hidden; box-shadow: none; }
button.wbtn::after { content: ""; position: absolute; top: 0; bottom: 0; left: -40%; width: 30%; background: linear-gradient(90deg, transparent, color-mix(in srgb, var(--accent) 25%, transparent), transparent); transform: skewX(-20deg); transition: left .5s ease; pointer-events: none; }
button.wbtn:hover:not(:disabled)::after { left: 110%; }
button.wbtn:hover:not(:disabled) { background: color-mix(in srgb, var(--accent) 20%, transparent); }
button.wbtn small { font-weight: 400; color: var(--ink2); letter-spacing: 0; }
.fz-slots .fz-slot > .wbtn { margin-top: auto; align-self: stretch; }
/* 选理念：两栏 */
.fz-cols { display: grid; grid-template-columns: 1.4fr 1fr; gap: 10px; } .fz-cols > div { min-width: 0; } .fz-ch { margin: 2px 0 6px; }
.fz-oa { display: flex; align-items: center; gap: 10px; justify-content: flex-end; margin-top: 4px; font-size: 12px; flex-wrap: wrap; }
@media (max-width: 620px) { .fz-cols { grid-template-columns: 1fr; } }
.lg-r { font-family: var(--mono); font-size: 11.5px; margin-left: 4px; } .lg-SSS { color: #d4a017; font-weight: 700; } .lg-SS { color: var(--bad); font-weight: 700; } .lg-S { color: var(--accent); font-weight: 700; } .lg-AAA, .lg-AA, .lg-A { color: var(--ink2); }
.gl-d { margin: 4px 0; font-size: 12px; } .gl-d > summary { cursor: pointer; color: var(--accent); }
.gl-row { display: flex; flex-wrap: wrap; align-items: center; gap: 4px 8px; padding: 4px 0; border-bottom: 1px dashed var(--line); }
.gl-row > b { min-width: 6em; } .gl-ppl { display: inline-flex; flex-wrap: wrap; align-items: center; gap: 4px 6px; }
.gl-p { display: inline-flex; align-items: center; gap: 3px; } .gl-p .pix { border-radius: 3px; }
/* ===== 战术战斗 ===== */
.scene-card.bt-on .scene-wrap, .scene-card.bt-on .scene-cap { display: none; }
.bt-wrap { display: flex; flex-direction: column; gap: 4px; }
.bt-fscroll { overflow-x: auto; overflow-y: hidden; -webkit-overflow-scrolling: touch; scrollbar-width: none; }   /* 窄屏时左右滑动看战场（不显示滚动条） */
.bt-fscroll::-webkit-scrollbar { display: none; }
.bt-field { position: relative; width: 100%; min-width: 900px; border: 1px solid var(--line2); border-radius: 3px; overflow: hidden; background: #000; }
#bt-cv { display: block; width: 100%; height: auto; image-rendering: pixelated; image-rendering: crisp-edges; }
#bt-tags { position: absolute; inset: 0; pointer-events: none; }
.bt-tag { position: absolute; transform: translate(-50%, -150%); font-size: 10px; line-height: 1; padding: 2px 4px; border-radius: 3px; white-space: nowrap; pointer-events: none; }
.bt-tag.pt { pointer-events: auto; cursor: pointer; border: 1px solid #fff; font-family: var(--mono); font-weight: 700; color: #111; box-shadow: 0 0 6px rgba(255,255,255,.6); }
.bt-tag.pt.g, .bt-po.g { background: #6fe08a; } .bt-tag.pt.y, .bt-po.y { background: #ffd35c; } .bt-tag.pt.r, .bt-po.r { background: #ff8a8a; }
.bt-po { color: #111 !important; }
#bt-hud { display: flex; flex-direction: column; gap: 3px; font-size: 12px; }
.bt-top { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }
.bt-clock { font-size: 12px; font-weight: 700; } .bt-clock em { background: #5fb8ff; transition: width .3s linear; } .bt-clock.bad { color: #ff5d6c; } .bt-clock.bad em { background: #ff5d6c; }
.bt-ph { padding: 1px 8px; border-radius: 3px; font-weight: 700; font-size: 11px; background: var(--line); }
.bt-ph-battle { background: #e08a5b; color: #fff; } .bt-ph-decisive { background: #c64bd6; color: #fff; box-shadow: 0 0 8px rgba(198,75,214,.6); }
.bt-pr { display: inline-flex; align-items: center; gap: 4px; font-family: var(--mono); }
.bt-pr i, .bt-tug i, .bt-boss i, .bt-stat i { position: relative; display: inline-block; height: 6px; background: var(--line); border-radius: 3px; overflow: hidden; }
.bt-pr i { width: 90px; } .bt-pr em { position: absolute; left: 0; top: 0; bottom: 0; background: var(--accent); }
.bt-pr s { position: absolute; top: -2px; bottom: -2px; width: 2px; background: #c64bd6; text-decoration: none; }
.bt-tug { display: flex; align-items: center; gap: 6px; } .bt-tug i { flex: 1; height: 8px; background: #d64a4a; }
.bt-tug em { position: absolute; left: 0; top: 0; bottom: 0; background: #4f86d6; transition: width .3s; } .bt-tug b { font-family: var(--mono); font-size: 11px; }
.bt-forces { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.bt-us b { font-size: 10px; padding: 0 3px; border-radius: 2px; color: #222; } .z-AZ { background: #ff7b72; } .z-TZ { background: #ffd35c; } .z-BZ { background: #6cb6ff; }
.bt-vs { font-weight: 700; color: var(--ink2); } .bt-them { display: inline-flex; flex-wrap: wrap; gap: 2px 8px; align-items: center; }
.bt-en { display: inline-flex; align-items: center; gap: 1px; font-family: var(--mono); font-size: 11px; } .hg-ico { vertical-align: middle; }
.bt-boss { display: flex; align-items: center; gap: 6px; flex-wrap: wrap; } .bt-boss i { flex: 1; min-width: 80px; height: 8px; } .bt-boss em { position: absolute; left: 0; top: 0; bottom: 0; background: #d64ad0; }
.bt-boss span { font-family: var(--mono); font-size: 11px; }
.bt-panel { display: flex; flex-direction: column; gap: 6px; margin-top: 6px; font-size: 12px; }
.bt-row { display: flex; align-items: center; gap: 6px; flex-wrap: wrap; }
.bt-ctl .bt-ctl-r { display: inline-flex; align-items: center; gap: 6px; margin-left: auto; flex-wrap: wrap; }
.bt-en[data-hov] { cursor: pointer; }
.bt-spdw { display: inline-flex; align-items: center; gap: 3px; } .bt-spdw .spd-b.on { color: var(--accent); border-color: var(--accent); }
#bt-ra:empty { display: none; }
.bt-stat { display: inline-flex; align-items: center; gap: 4px; margin-right: 8px; font-family: var(--mono); font-size: 11px; } .bt-stat i { width: 60px; }
.bt-stat i.hp em { position: absolute; inset: 0 auto 0 0; background: #5fe37a; } .bt-stat i.mg em { position: absolute; inset: 0 auto 0 0; background: #b67cff; }
.bt-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 6px; }
@media (max-width: 760px) { .bt-grid { grid-template-columns: 1fr; } }
.bt-box { border: 1px solid var(--line); border-radius: 4px; padding: 6px 8px; background: color-mix(in srgb, var(--card) 70%, transparent); }
.bt-box h5 { margin: 0 0 4px; font-size: 12px; }
.bt-dr { display: flex; align-items: center; gap: 3px; flex-wrap: wrap; margin: 3px 0; } .bt-dr > span:first-child { min-width: 3em; color: var(--ink2); font-size: 11px; }
.bt-panel button.mini.on { background: var(--accent); color: #fff; border-color: var(--accent); }
.bt-inj { display: flex; align-items: center; gap: 6px; margin-top: 4px; } .bt-inj input { flex: 1; }
#bt-injb.lit { background: #c64bd6; color: #fff; border-color: #c64bd6; animation: actGlow 1s ease-in-out infinite; }
.bt-fml { font-size: 11px; line-height: 1.5; margin-top: 4px; }
.bt-cd { color: #c64bd6; font-weight: 700; margin: 2px 0; }
.bt-warn, .bt-end { display: flex; align-items: center; gap: 10px; padding: 8px 10px; border-radius: 4px; flex-wrap: wrap; }
.bt-warn { background: color-mix(in srgb, var(--bad) 15%, transparent); border: 1px solid var(--bad); } .bt-warn b { color: var(--bad); }
.bt-end { background: color-mix(in srgb, var(--accent) 12%, transparent); border: 1px solid var(--accent); } .bt-end-retreat { border-color: var(--bad); }
.bt-warn button, .bt-end button { margin-left: auto; }
#bt-injb { flex: none; white-space: nowrap; padding: 3px 12px; }
/* Nest 行（县详情）：第 1 行 名字 · 等级 · 主·性格 · 简短介绍；第 2 行 血条 · 成熟状态 · 地形 · 组织外征 */
.nest-r { display: flex; flex-direction: column; gap: 4px; padding: 6px 2px; border-bottom: 1px dashed var(--line); font-size: 12.5px; }
.nest-r .nr1, .nest-r .nr2 { display: flex; align-items: center; gap: 8px; min-width: 0; }
.nest-n { font-weight: 600; white-space: nowrap; }
.nest-ld { flex: 1 1 auto; min-width: 0; color: var(--ink2); font-size: 11.5px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.nr2 .nest-hp { flex: 1 1 auto; min-width: 110px; display: flex; align-items: center; gap: 6px; cursor: help; } .nr2 .nest-hp .bar { flex: 1 1 auto; min-width: 50px; }
.nest-hp small { font-family: var(--mono); font-size: 10.5px; color: var(--ink2); white-space: nowrap; }
.nest-st { display: flex; align-items: center; gap: 6px; justify-content: flex-end; white-space: nowrap; flex: none; }
.nest-tr, .nest-lord { display: inline-flex; align-items: center; gap: 3px; flex: none; font-size: 11px; padding: 0 5px; border-radius: 3px; border: 1px solid var(--line2); cursor: help; white-space: nowrap; }
.nest-lord { color: #c64bd6; border-color: #c64bd6; }
.ter-ico { flex: none; image-rendering: pixelated; vertical-align: -0.15em; }
/* 县详情：概况两列紧凑排布（固定不动），下面的 Nest / Garden / 战况在 .pop-scroll 里滚动 */
.cty-kv { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); column-gap: 18px; margin-bottom: 8px; }
.cty-kv .kv { padding: 3px 0; font-size: 12.5px; } .cty-kv .cty-7 { grid-column: 1 / -1; }
@media (max-width: 760px) { .nest-r .nr1, .nest-r .nr2 { flex-wrap: wrap; row-gap: 3px; } .nest-ld { flex-basis: 100%; } }
.bt-tag.ball { background: #ff7be6; color: #fff; font-family: var(--mono); font-weight: 700; transform: translate(-50%, 60%); box-shadow: 0 0 6px rgba(255,123,230,.8); }
.bt-inj { flex-wrap: wrap; } .bt-inj input { flex: 1 1 110px; min-width: 0; } .bt-bs { display: flex; gap: 8px; align-items: baseline; flex-wrap: wrap; }

/* ===== 战斗画面（tbattle_ui.js）：角色小人 / HUGE 头像 / 特效层 / 成员 / 战报 ===== */
#bt-fx { position: absolute; inset: 0; width: 100%; height: 100%; pointer-events: none; }
/* 角色小人与 HUGE：画在 #bt-uc 画布上（tbattle_ui.js drawUnits）；夜战整体压暗 */
#bt-uc { position: absolute; inset: 0; width: 100%; height: 100%; pointer-events: none; image-rendering: pixelated; }
#bt-uc.night { filter: brightness(.78) saturate(.85); }
/* 九世联合：Finish Shot 震屏 + 闪白 + 字样；魔法球失控小震 */
#bt-flash { position: absolute; inset: 0; pointer-events: none; opacity: 0; background: radial-gradient(circle at 50% 50%, rgba(255, 245, 255, .95), rgba(255, 140, 240, .45) 45%, transparent 78%); }
#bt-flash.on { animation: btFlash .5s ease-out; }
@keyframes btFlash { 0% { opacity: .9; } 100% { opacity: 0; } }
.bt-field.shake { animation: btShake .55s cubic-bezier(.36, .07, .19, .97); } .bt-field.shake-s { animation: btShake .3s ease-out; }
@keyframes btShake { 10%, 90% { transform: translate(-1px, 0); } 20%, 80% { transform: translate(3px, -1px); } 30%, 50%, 70% { transform: translate(-5px, 2px); } 40%, 60% { transform: translate(5px, -2px); } }
.bt-tag.fs { background: linear-gradient(90deg, #ff7be6, #b06cff); color: #fff; font-weight: 800; font-size: 12px; padding: 3px 8px; box-shadow: 0 0 12px rgba(255, 123, 230, .9); animation: fsUp 1.3s ease-out forwards; }
.bt-tag.fs b { font-family: var(--mono); }
@keyframes fsUp { 0% { opacity: 0; transform: translate(-50%, -120%) scale(.7); } 15% { opacity: 1; transform: translate(-50%, -220%) scale(1.15); } 100% { opacity: 0; transform: translate(-50%, -330%) scale(1); } }
.bt-tag.pt { transform: translate(-50%, 45%); }
/* 面板标题右端的「说明」：悬停显示、点击固定 */
.bt-box h5 { display: flex; align-items: center; gap: 6px; } .bt-help { margin-left: auto; font-weight: 400; font-size: 11px; }
.bt-hs { margin: 6px 0 2px; font-weight: 700; color: var(--accent); font-size: 11.5px; } .bt-hs:first-child { margin-top: 0; }
.md-r.bt-hr > span:first-child { flex: none; min-width: 5.5em; font-weight: 600; } .md-r.bt-hr > span:last-child { text-align: left; white-space: normal; font-family: inherit; min-width: 0; }   /* 说明文字：正常字体、可换行 */
/* 参战成员：头像 · 名字 · 职责 · 血量 · MAGI */
.bt-mems { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 6px; }   /* 一排 4 个、等宽 */
@media (max-width: 640px) { .bt-mems { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
.bt-mm { display: flex; align-items: center; gap: 6px; padding: 4px 6px; border: 1px solid var(--line); border-left: 3px solid var(--zc, var(--line)); border-radius: 4px; min-width: 0; }
.bt-mm.mz-AZ { --zc: #ff7b72; } .bt-mm.mz-TZ { --zc: #ffd35c; } .bt-mm.mz-BZ { --zc: #6cb6ff; }
.bt-mm .pix { width: 30px; height: 30px; image-rendering: pixelated; flex: none; }
.bt-mm .mm-i { display: flex; flex-direction: column; gap: 1px; min-width: 0; flex: 1; }
.bt-mm .mm-i > b { font-size: 12px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } .bt-mm .mm-i > b small { font-weight: 400; color: var(--ink2); }
.bt-mm .mm-i > small { font-size: 10.5px; color: var(--ink2); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.mm-b { display: flex; align-items: center; gap: 4px; font-family: var(--mono); font-size: 10.5px; }
.mm-b i { flex: 1; height: 5px; background: var(--line); border-radius: 2px; overflow: hidden; } .mm-b em { display: block; height: 100%; transition: width .25s; }
.mm-b.hp em { background: #5fe37a; } .mm-b.mg em { background: #b67cff; } .mm-b b { min-width: 2.2em; text-align: right; font-weight: 500; }
.bt-mm.me { box-shadow: inset 0 0 0 1px #ffe14d; } .bt-mm.down { opacity: .5; filter: grayscale(1); } .bt-mm.ball { box-shadow: 0 0 8px rgba(255, 123, 230, .85); }
.bt-mm .mm-s, .bt-mm .mm-k { font-size: 10.5px; color: var(--ink2); white-space: nowrap; overflow: hidden; } .bt-mm .mm-s b { font-weight: 600; } .bt-mm .mm-k:empty { display: none; } .bt-mm .mm-k .bt-en { margin-left: 2px; }
.bt-mm.ally-n { flex: 0 0 auto; border-left-color: #9aa4b2; color: var(--ink2); }
/* 战报：和人生记录同一种样式（.log / .le），左栏为回合数 */
.bt-log { max-height: 230px; } .bt-log .le { grid-template-columns: 34px 1fr; padding: 4px 0; font-size: 12.5px; } .bt-log .la { font-size: 11px; }
/* 站位页「战术属性」：两行 6 列的数值格 + 默认收起的计算明细（每项：公式块 + 用途） */
.ca-grid { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 6px; margin: 4px 0 8px; }
@media (max-width: 760px) { .ca-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
/* 战术属性放在左栏 / 手机「人物」页：每格最少 76px、最多 3 列，窄了自动掉到 2 列；数值可折行，不横向溢出 */
.st-combat .ca-sub { margin: -4px 0 6px; font-size: 11.5px; }
.st-combat .ca-rows .stat b { white-space: nowrap; }   /* 战术属性一项一行（同莉莉资质的 .stat 行） */
.ca-c { display: flex; flex-direction: column; gap: 1px; padding: 5px 7px; border: 1px solid var(--line); border-radius: 4px; background: color-mix(in srgb, var(--card) 70%, transparent); }
.ca-c span { font-size: 11px; color: var(--ink2); } .ca-c b { font-family: var(--mono); font-size: 13px; }
.ca-blk { display: flex; flex-direction: column; gap: 2px; } .ca-blk .fx-blk { max-width: none; } .ca-use { margin: 0 0 0 10px; font-size: 11px; color: var(--ink2); line-height: 1.45; }
/* 人物卡：零件一行（稀有度徽章沿用零件店的 .rar） */
.nc-part b { display: inline-flex; align-items: center; gap: 4px; flex-wrap: wrap; justify-content: flex-end; } .nc-part .rar { font-style: normal; }
.ncard .stat.st-d { cursor: help; }
/* 月末预计 / 战术属性的计算明细：等宽网格（.forecast > div 的 flex 规则优先级更高，这里用同级选择器覆盖），每块填满格子、数值列右对齐 */
.forecast > .fc-blocks { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(260px, 100%), 1fr)); gap: 10px 12px; align-items: start; font-family: inherit; }
.forecast > .fc-blocks > .fx-blk, .forecast > .fc-blocks > .ca-blk, .forecast > .fc-blocks .fx-blk { min-width: 0; max-width: none; width: auto; margin: 0; }
.ca-d > .fc-blocks { grid-template-columns: repeat(auto-fill, minmax(min(260px, 100%), 1fr)); }
.fc-blocks .md-r { display: flex; justify-content: space-between; align-items: flex-start; gap: 10px; }
.fc-blocks .md-r > span:last-child { flex: none; white-space: nowrap; text-align: right; font-family: var(--mono); }
.fc-blocks .md-r > span:first-child { min-width: 0; }
.fc-blocks .ca-use { margin: 2px 0 0 10px; }
.fx-calc .fx-n, .fx-how .fx-n { color: var(--g); }
.fx-calc .fx-n, .fx-calc .fx-n *, .fx-calc .vup, .fx-calc .vdn, .fx-calc .good, .fx-calc .bad, .fx-how .fx-n, .fx-how .fx-n * { color: var(--g) !important; }
/* 月末预计：一排 4 个属性明细（窄屏退到 2 列 / 1 列）；有公式的行悬停 / 点击看公式 */
.fc-d[data-k=fc] > .fc-blocks { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.fc-d[data-k=fc] { container-type: inline-size; }
@container (max-width: 860px) { .fc-d[data-k=fc] > .fc-blocks { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@container (max-width: 440px) { .fc-d[data-k=fc] > .fc-blocks { grid-template-columns: minmax(0, 1fr); } }
.fx-hrow { cursor: help; border-radius: 2px; } .fx-hrow:hover { background: var(--bg2, rgba(127, 127, 127, .12)); }
.fx-hv { white-space: pre-line; font-size: 11.5px; }
.fx-hv .fx-n, .fx-hv .fx-n * { color: var(--g) !important; }
/* 军团页：四项属性可悬停；成员表（关系徽章、耐久条、属性贡献、操作） */
.lp-c { cursor: help; } .lp-c:hover { outline: 1px solid var(--accent); }
.sub-b { display: inline-flex; align-items: center; gap: 8px; }
.mem2 td { vertical-align: middle; } .mem2 select { font-size: 12px; padding: 1px 4px; }
.mb-who { display: inline-flex; align-items: center; gap: 6px; flex-wrap: wrap; }
.mb-badge { font-size: 10.5px; padding: 0 6px; border-radius: 8px; border: 1px solid var(--line2); color: var(--ink2); white-space: nowrap; } .mb-badge.me { color: var(--accent); border-color: var(--accent); }
.fitw { padding: 0 4px; border-radius: 3px; } .fitw.f5 { color: var(--g); } .fitw.f4 { color: #6fbf73; } .fitw.f3 { color: var(--ink2); } .fitw.f2 { color: #d9a441; } .fitw.f1 { color: var(--r, #d9534f); }
.mb-con { font-size: 12px; } .mb-con b.inc { color: var(--g); font-weight: 600; }
.mb-op { white-space: nowrap; } .mb-op .mini + .mini { margin-left: 4px; }
.mb-off td { opacity: .55; }
.pitch .slot[data-act] { cursor: pointer; }
.sch-lg td { vertical-align: middle; } .lg-r.lg-none { opacity: .7; font-size: 10.5px; } .lg-rel.me { color: var(--accent); } .lg-rel.ally { color: var(--g); }
.mb-con { white-space: nowrap; } .mem2 .mb-who { flex-wrap: nowrap; } .mem2 td:first-child { white-space: nowrap; } .mem2 td { padding: 4px 6px; } .mem2 .fitw { display: inline; }
/* 成员表：长名字截断；属性贡献 2×2 小格子 */
.mb-con { display: inline-grid; grid-template-columns: repeat(2, auto); gap: 1px 10px; font-size: 10.5px; line-height: 1.35; white-space: nowrap; }
.mb-con > i { font-style: normal; display: flex; justify-content: space-between; gap: 6px; min-width: 52px; }
.mb-con > i > span { color: var(--ink2); } .mb-con b { font-weight: 600; font-family: var(--mono); font-style: normal; } .mb-con b.dim { color: var(--ink2); font-weight: 400; }
.rk-self { background: var(--accent); }
.mem2 .mb-fit { font-size: 10.5px; color: var(--ink2); margin-top: 2px; white-space: nowrap; }
.sch-lg th { white-space: nowrap; } .sch-lg td:first-child { white-space: nowrap; } .sch-lg .lg-r { display: inline-block; min-width: 2.2em; text-align: center; padding: 0 5px; border: 1px solid currentColor; border-radius: 3px; font-size: 10.5px; line-height: 1.5; margin-right: 4px; font-weight: 700; }
/* 副队长一行：头像卡 + 下拉框可换行，下拉框不超出容器 */
.sub-b { flex-wrap: wrap; justify-content: flex-end; max-width: 100%; min-width: 0; } .sub-b select { max-width: 100%; }
.lg-staff { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; padding: 1px 0; } .lg-staff > small { min-width: 3.2em; }
/* 成员表的操作按钮：上下排列 */
.mem2 td.mb-op { white-space: normal; } .mem2 .mb-op { display: flex; flex-direction: column; align-items: stretch; gap: 4px; } .mb-op .mini + .mini { margin-left: 0; }
/* 手机：校内军团表改成卡片式（军团名 / 要员 / 人数 · 战力 · 关系） */
@media (max-width: 700px) {
  .sch-lg, .sch-lg > tbody { display: block; width: 100%; }
  .sch-lg tr:first-child { display: none; }
  .sch-lg tr { display: grid; grid-template-columns: minmax(0, 1fr) auto; grid-template-areas: "name rel" "staff num" "staff pw"; gap: 2px 14px; align-items: center; padding: 8px 0; border-bottom: 1px solid var(--line); }
  .sch-lg td { display: block; padding: 0; border: 0; white-space: normal; min-width: 0; }
  .sch-lg td:nth-child(1) { grid-area: name; } .sch-lg td:nth-child(2) { grid-area: staff; } .sch-lg td:nth-child(3) { grid-area: num; text-align: right; } .sch-lg td:nth-child(4) { grid-area: pw; text-align: right; } .sch-lg td:nth-child(5) { grid-area: rel; text-align: right; }
  .sch-lg td:nth-child(3)::before { content: attr(data-l) ' '; color: var(--ink2); font-size: 11px; }
  .sch-lg td:nth-child(4)::before { content: attr(data-l) ' '; color: var(--ink2); font-size: 11px; }
}
/* 军团成员：电脑版表格，手机版列表（≤700px 切换）；列表每人一块，沿用明细块 .fx-blk 与 .kv 行的样式 */
.mem-list { display: none; }
.mb-durw { display: inline-flex; align-items: center; gap: 6px; } .mb-durw .bar { width: 64px; flex: none; }
.mb-durc { display: inline-flex; flex-direction: column; gap: 2px; } .mb-inj { font-size: 11.5px; white-space: nowrap; }   /* 伤病在耐久下面另起一行 */
@media (max-width: 700px) {
  .mem2 { display: none; }
  .mem-list { display: flex; flex-direction: column; gap: 10px; margin-top: 6px; }
  .mem-list .lgm { max-width: none; font-size: 12.5px; color: var(--ink); }
  .lgm-h { padding: 2px 0 4px; }
  .lgm .kv > b { display: inline-flex; align-items: center; justify-content: flex-end; flex-wrap: wrap; gap: 2px 6px; font-weight: inherit; text-align: right; }
  .lgm .lgm-role .mb-fit { margin: 0; }
  .lgm .mb-con { display: inline-grid; grid-template-columns: repeat(2, auto); }
  .lgm-op { justify-content: flex-end; margin-top: 6px; gap: 6px; }
}
/* 站位格：区域 + 职责两个下拉一行，下面一行 Lv · 相性 */
.mb-pos { display: flex; flex-direction: column; gap: 2px; } .mb-sel { display: inline-flex; align-items: center; gap: 4px; flex-wrap: nowrap; }
/* 成员表的职责下拉：固定宽度，放不下的截断；悬停时文字来回滚动显示全文 */
.mb-sel .cdd-b { width: 15em; max-width: 100%; }
.mb-sel .cdd-t { flex: 1; min-width: 0; overflow: hidden; white-space: nowrap; text-align: left; -webkit-mask-image: linear-gradient(90deg, #000 88%, transparent); mask-image: linear-gradient(90deg, #000 88%, transparent); }
.mb-sel .cdd-tx { display: inline-block; white-space: nowrap; }
.mb-sel .cdd-t:not(.ov) { -webkit-mask-image: none; mask-image: none; }
.mb-sel .cdd-t.ov .cdd-tx { animation: cddScroll 4.5s ease-in-out infinite alternate; }   /* 放不下的自动来回滚动；--sx 由 ui.js fitScroll 量出来 */
@keyframes cddScroll { 0%, 18% { transform: translateX(0); } 82%, 100% { transform: translateX(var(--sx, 0px)); } }
.lgm .mb-pos { align-items: flex-end; }
/* 校内军团的队长 / 副队长：长名字截断 */
.lg-staff .pc-meet { display: inline-flex; align-items: center; gap: 4px; min-width: 0; max-width: 100%; } .lg-staff .npc-link { display: inline-block; max-width: 7.5em; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; vertical-align: middle; }
/* 限宽人物卡：名字框宽 --w，放不下时由 runNameScroll 加来回滚动的动画 */
.nm-scroll { display: inline-block; max-width: var(--w); overflow: hidden; white-space: nowrap; vertical-align: middle; } .nm-scroll > .nm-in { display: inline-block; white-space: nowrap; will-change: transform; }
.fx-inl { display: inline; font-size: 10.5px; color: var(--ink2); font-weight: 400; }
.mem2 td.mb-op { display: table-cell; } .mem2 .mb-op .mini { display: block; width: 6.5em; margin: 0 0 4px 0; text-align: center; } .mem2 .mb-op .mini:last-child { margin-bottom: 0; }
/* 职责下拉：文字透明，上面叠一层标签显示当前选项（只有相性档位着色）；弹出的选项列表用正常颜色 */
.fsel-w { position: relative; display: inline-block; max-width: 100%; }
.fsel-w > .fitsel { color: transparent; } .fsel-w > .fitsel option { color: var(--ink); background: var(--card2); }
.fsel-lab { position: absolute; left: 8px; right: 22px; top: 50%; transform: translateY(-50%); pointer-events: none; white-space: nowrap; overflow: hidden; font-size: 12px; color: var(--ink); }
.fsel-lab .fitw { font-weight: 600; padding: 0 0 0 2px; }
/* 人物卡：头部固定、板块区单独滚动；板块一行两个（同一行按较高的那块统一高度），每块有边框；校名写全 */
.ncard { display: flex; flex-direction: column; overflow: hidden; }
.ncard > .sh-body { flex: 1 1 auto; min-height: 0; } .ncard > .sh-body > .sh-in { display: flex; flex-direction: column; min-height: 0; }
.ncard .sh-in > .nc-grid { flex: 1 1 auto; min-height: 0; overflow-y: auto; align-items: stretch; gap: 10px; margin-top: 10px; padding-right: 4px; }
.nc-sec { border: 1px solid var(--line); border-radius: 6px; padding: 8px 12px 10px; background: color-mix(in srgb, var(--card) 70%, transparent); min-width: 0; }
.nc-sec > h4:first-child { margin-top: 0; }
.ncard .nc-sub .sb-s { max-width: none; overflow: visible; white-space: normal; }
/* 阵型组面板 */
.fg-panel { margin-top: 10px; }
.fg-top { display: flex; flex-wrap: wrap; gap: 6px 18px; align-items: baseline; padding: 6px 0; border-bottom: 1px dashed var(--line); font-size: 13px; } .fg-pt { color: var(--accent); font-size: 15px; }
.fg-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(280px, 100%), 1fr)); gap: 10px; margin-top: 8px; align-items: stretch; }
.fg-card { border: 1px solid var(--line); border-radius: 6px; padding: 8px 10px; display: flex; flex-direction: column; gap: 4px; min-width: 0; }
.fg-card.act { border-color: var(--accent); box-shadow: 0 0 0 1px var(--accent) inset; } .fg-card.locked { opacity: .85; }
.fg-h { display: flex; align-items: baseline; gap: 6px; flex-wrap: wrap; } .fg-h > b { font-size: 13.5px; } .fg-h > .mini, .fg-h > .fg-on { margin-left: auto; }
.fg-on { font-size: 11px; color: var(--accent); border: 1px solid var(--accent); border-radius: 3px; padding: 0 6px; }
.fg-d { margin: 0; font-size: 11.5px; color: var(--ink2); }
.fg-base { display: flex; flex-wrap: wrap; gap: 4px 8px; align-items: center; font-size: 12px; padding: 3px 0; border-bottom: 1px dashed var(--line); }
.fg-sks { display: flex; flex-direction: column; gap: 2px; }
.fg-sk { display: grid; grid-template-columns: 1.4em auto 1fr auto; gap: 6px; align-items: center; font-size: 12px; padding: 2px 0; }
.fg-sk .fg-i { text-align: center; color: var(--ink2); font-family: var(--mono); font-size: 11px; } .fg-sk.fg-got .fg-i { color: var(--g); }
.fg-sk.fg-lock { opacity: .55; } .fg-sk.fg-next { background: color-mix(in srgb, var(--accent) 8%, transparent); border-radius: 3px; }
.fg-sk .fg-m { display: flex; flex-wrap: wrap; gap: 2px 6px; justify-content: flex-end; }
.fg-more { margin-top: 8px; } .fg-more > summary { cursor: pointer; color: var(--accent); font-size: 13px; }
.fg-p { text-align: right; }
/* 自定义下拉框 */
.cdd { position: relative; display: inline-block; max-width: 100%; }
.cdd-b { display: inline-flex; align-items: center; gap: 8px; font-size: 12px; padding: 2px 8px; max-width: 100%; text-align: left; }
.cdd-b > span { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } .cdd-b > i { font-style: normal; color: var(--ink2); font-size: 10px; }
.cdd-m { position: absolute; z-index: 30; left: 0; top: calc(100% + 2px); min-width: 100%; display: flex; flex-direction: column; background: var(--card2); border: 1px solid var(--line2); border-radius: 4px; box-shadow: 0 8px 24px rgba(0,0,0,.25); padding: 3px; }
.cdd-o { text-align: left; white-space: nowrap; font-size: 12px; padding: 4px 8px; border: 0; background: transparent; border-radius: 3px; color: var(--ink); }
.cdd-o:hover { background: color-mix(in srgb, var(--accent) 14%, transparent); } .cdd-o.on { background: color-mix(in srgb, var(--accent) 22%, transparent); }
.cdd .fitw { font-weight: 600; padding-left: 2px; }
/* 军团：倾向徽章、阵型槽网格、阵型卡（点 + 连线） */
.lg-tend { display: inline-block; margin-left: 6px; font-size: 11px; font-weight: 600; padding: 0 6px; border-radius: 3px; border: 1px solid var(--line2); color: var(--ink2); vertical-align: middle; }
.lg-tend.t-atk { color: var(--r); border-color: var(--r); } .lg-tend.t-def { color: var(--b); border-color: var(--b); } .lg-tend.t-theory { color: var(--p); border-color: var(--p); } .lg-tend.t-ind { color: var(--o); border-color: var(--o); }
.lg-rn { margin-left: 8px; vertical-align: middle; }
.fgs-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; margin-top: 8px; }
@media (max-width: 700px) { .fgs-grid { grid-template-columns: minmax(0, 1fr); } }
.fgs { border: 1px dashed var(--line2); border-radius: 6px; padding: 14px; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 8px; min-height: 150px; }
.fgs-lock { opacity: .6; }
.fgc { border: 1px solid var(--line); border-radius: 6px; padding: 8px 10px; display: flex; flex-direction: column; gap: 6px; min-width: 0; }
.fgc.act { border-color: var(--accent); box-shadow: 0 0 0 1px var(--accent) inset; }
.fgc-track { position: relative; display: grid; grid-template-columns: repeat(3, 1fr); grid-template-rows: auto auto; row-gap: 6px; padding: 4px 0; }
.fgc-lines { position: absolute; left: 0; top: 0; width: 100%; height: 106px; pointer-events: none; }
.fgc-lines line { stroke: var(--line2); stroke-width: 2; vector-effect: non-scaling-stroke; } .fgc-lines line.got { stroke: var(--accent); }
.fgd-w { display: flex; flex-direction: column; align-items: center; gap: 3px; z-index: 1; min-width: 0; height: 56px; }
.fgd-w > small { font-size: 10.5px; text-align: center; color: var(--ink2); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; max-width: 100%; }
.fgd { width: 28px; height: 28px; border-radius: 50%; padding: 0; font-size: 12px; font-family: var(--mono); display: inline-flex; align-items: center; justify-content: center; border: 2px solid var(--line2); background: var(--card2); color: var(--ink2); cursor: help; }
.fgd-got { border-color: var(--accent); background: var(--accent); color: #fff; }
.fgd-next { border-color: var(--accent); color: var(--accent); }
.fgd-lock { opacity: .55; }
.fgd.glow { cursor: pointer; animation: fgdGlow 1.1s ease-in-out infinite; }
@keyframes fgdGlow { 0%, 100% { box-shadow: 0 0 0 0 color-mix(in srgb, var(--accent) 60%, transparent); } 50% { box-shadow: 0 0 0 6px color-mix(in srgb, var(--accent) 0%, transparent), 0 0 12px var(--accent); } }
.lg-name-row { display: flex; align-items: stretch; gap: 8px; }
.lg-name-row input { flex: 1; min-width: 0; font: inherit; font-size: 14px; padding: 5px 10px; border: 1px solid var(--line2); border-radius: 4px; background: var(--card); color: var(--ink); outline: none; transition: border-color .15s, box-shadow .15s; }
.lg-name-row input:hover { border-color: color-mix(in srgb, var(--accent) 50%, var(--line2)); }
.lg-name-row input:focus { border-color: var(--accent); box-shadow: 0 0 0 3px var(--glow); }
.stat.st-d.st-kv { grid-template-columns: 82px 1fr auto; cursor: help; } .stat.st-kv > b { font-weight: 600; } .stat.fame-lv { grid-template-columns: 82px 1fr auto; margin-top: -2px; } .stat.fame-lv > b { font-size: 12px; color: var(--ink2); }.fame-lv > span { white-space: nowrap; font-size: 12px; } .fame-lv > span b { color: var(--accent); }
.lg-rec { display: flex; align-items: center; gap: 8px; margin-bottom: 4px; }
.mem2 tr.mb-empty td:not(.mb-op) { color: var(--ink2); } .mem2 tr.mb-empty .mb-sel { font-size: 12.5px; }
.mem2 tr.mb-recrow > td { padding: 2px 6px 8px 24px; background: var(--bg2, transparent); }
table.mem-rec { width: 100%; font-size: 12.5px; } table.mem-rec td, table.mem-rec th { padding: 3px 6px; vertical-align: middle; } table.mem-rec th { color: var(--ink2); font-weight: 400; text-align: left; }
table.mem-rec .mb-who { display: flex; align-items: center; gap: 6px; flex-wrap: nowrap; }
.lgm-rec { overflow-x: auto; margin-top: 6px; } .lgm-empty .lgm-h { color: var(--ink2); }
.cdd-m button.cdd-o.on.on { background: color-mix(in srgb, var(--accent) 22%, transparent); color: var(--ink); border: 0; box-shadow: none; }
.ca-c.st-d { position: relative; cursor: help; } .ca-c .sk-more { position: absolute; right: 7px; bottom: 5px; font-size: 11px; }
/* 列举类弹窗：弹窗本身不滚动，选项列表在内部滚动（标题 / 正文固定）；正文过长时正文区再滚动 */
#modal.open > .sheet:not(.folded) { display: flex; flex-direction: column; overflow: hidden; }
#modal.open > .sheet:not(.folded) > * { flex-shrink: 0; }
#modal.open > .sheet:not(.folded) > .sh-body { flex: 1 1 auto; min-height: 0; grid-template-rows: minmax(0, 1fr); }
#modal.open > .sheet:not(.folded) .sh-in { display: flex; flex-direction: column; min-height: 0; overflow-y: auto; }
#modal.open > .sheet:not(.folded) .sh-in > * { flex-shrink: 0; }
#modal.open > .sheet:not(.folded) .sh-in > .choices { flex: 0 1 auto; min-height: 140px; overflow-y: auto; overscroll-behavior: contain; padding-right: 4px; }
.choices .ch-t .lg-tend { margin-left: 4px; }
.fgp-sks { display: flex; flex-direction: column; margin-top: 3px; } .fgp-sk { line-height: 1.6; }
.amenu { display: flex; flex-direction: column; overflow: hidden; } .amenu > *:not(.pop-scroll):not(.sh-body) { flex: none; } .amenu .sh-in > *:not(.pop-scroll) { flex: none; }
.lg-pen { display: inline-grid; place-items: center; width: 22px; height: 22px; padding: 0; margin-right: 6px; vertical-align: middle; border-radius: 4px; color: var(--accent); background: transparent; border: 1px solid var(--line2); }
.lg-pen svg { width: 14px; height: 14px; }
.fgp-get { display: block; } .fgp-h { display: block; margin-top: 6px; font-size: 11px; font-weight: 600; color: var(--ink2); letter-spacing: .05em; } .fgp-desc { display: block; margin-top: 6px; color: var(--ink2); font-style: italic; }
.lg-tend { white-space: nowrap; } .lg-tends { display: inline-flex; flex-wrap: wrap; gap: 4px; align-self: center; } .lg-tends .lg-tend { margin-left: 0; } .lg-tends:empty { display: none; }
/* 手机：军团名旁的倾向 badge 换到标题下一行 */
@media (max-width: 760px) { .card h3:has(> .lg-tends) { flex-wrap: wrap; row-gap: 6px; } .card h3 > .lg-tends { order: 9; flex-basis: 100%; padding-left: 11px; } }
.card h3 .sk-cap { display: inline-flex; align-items: baseline; gap: 6px; margin-left: 10px; font-weight: 400; cursor: help; } .card h3 .sk-cap b { font-family: var(--mono); color: var(--accent); }
.card h4.sk-sub { margin: 14px 0 4px; font-size: 12px; color: var(--ink2); }
.sub-b { display: inline-flex; flex-wrap: wrap; justify-content: flex-end; gap: 6px; max-width: 100%; min-width: 0; } .sub-b select { max-width: 100%; min-width: 0; }
/* 兜底：页面本身不出现横向滚动（个别元素超宽时只裁掉，不把整页推歪）；clip 不产生滚动容器，不影响 sticky */
html, body { overflow-x: clip; }
.go > .dbg { flex: 1 1 220px; } .dbg > button { flex: none; }
#npc-card.over-modal { z-index: 68; }   /* 从事件弹窗里打开人物卡时临时盖在事件（65）之上 */
/* 全站统一：正数 / 收入绿，负数 / 支出红 */
.up { color: var(--g); } .dn { color: var(--bad); }
.lg-rep { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; margin-top: 8px; } .dur-row b { white-space: nowrap; }
/* 人物卡头部（分格）：桌面——头像在左、信息在中、互动在右；手机——姓名身份一行，下面三行左右对照 */
.nc-head2 { display: grid; grid-template-columns: 96px minmax(0, 1fr) auto; column-gap: 14px; row-gap: 3px; align-items: center;
  grid-template-areas: "pix name cta" "pix school cta" "pix legion cta" "pix role cta" "pix tags cta" "pix mbti cta"; padding-right: 34px; }
.nh-name { grid-area: name; display: flex; align-items: center; gap: 8px; flex-wrap: wrap; } .nh-pix { grid-area: pix; align-self: start; }
.nh-school { grid-area: school; display: flex; flex-wrap: wrap; gap: 0 8px; } .nh-cta { grid-area: cta; } .nh-tags { grid-area: tags; min-width: 0; }
.nh-legion { grid-area: legion; } .nh-mbti { grid-area: mbti; } .nh-role { grid-area: role; }
.nh-legion:empty, .nh-role:empty { display: none; } .nh-tags .tags { justify-content: flex-start; } .nh-pix img, .nh-pix canvas { display: block; }
@media (max-width: 760px) {
  .nc-head2 { grid-template-columns: auto minmax(0, 1fr) auto; grid-template-areas: "name name name" "pix school cta" "tags legion legion" "mbti role role"; column-gap: 10px; row-gap: 6px; }
  .nh-pix img, .nh-pix canvas, .nh-pix .pix { width: 64px; height: 64px; } .nh-legion:empty, .nh-role:empty { display: block; }
  .nh-tags .tags { flex-wrap: wrap; } .nh-cta .nc-cta { padding: 0; }
}
.gb-ars { background: #b07a2a; }
@media (max-width: 760px) { .nc-head2 { grid-template-columns: 64px minmax(0, 1fr) auto; padding-right: 30px; } .nh-pix .pix { width: 64px !important; height: 64px !important; } .nh-cta .nc-big { min-width: 0; padding: 8px 12px; font-size: 14px; } .nh-school { font-size: 12px; } }
@media (max-width: 760px) { .nc-head2 { grid-template-columns: minmax(64px, 44%) minmax(0, 1fr) auto; } .nh-mbti .mbti { white-space: nowrap; } }
@media (max-width: 760px) { .nc-head2 { grid-template-columns: 64px minmax(0, .9fr) minmax(0, 1fr) auto; grid-template-areas: "name name name name" "pix school school cta" "tags tags legion legion" "mbti mbti role role"; } }
/* ---- 手机版：每个页签是单独的页面（只在 ≤760px 生效；桌面端不变） ---- */
#cur-war { display: none; }
#top-tabs .mt-big { display: none; }
@media (max-width: 760px) {
  #top-tabs, #top.show-tabs #top-tabs { max-height: none; opacity: 1; margin-top: 6px; overflow: visible; }
  #top-tabs .mt-big { grid-column: 1 / -1; display: grid; grid-template-columns: 1fr 1fr; gap: 2px; }
  #top-tabs .mt-big button { padding: 7px 4px; font-size: 13.5px; font-weight: 600; }
  #tabs { display: none; }
  /* 人物：角色卡、状态、莉莉资质、战绩 */
  body:not([data-mp="person"]) :is(#id-card, #st-human, #st-lily, #st-combat, #st-bag, #st-record) { display: none; }   /* 战术属性、背包也只在手机的「人物」页 */
  /* 行动：像素画、方针与行动 */
  body:not([data-mp="act"]) :is(.mid > .scene-card, #act-area) { display: none; }
  /* 页签页：页签内容 + 各页附带的卡片 */
  body:not([data-mp="tab"]) #tab-body { display: none; }
  #twins, #home-war { display: none; }
  body:not([data-mp="tab"]) #life-map, body[data-mp="tab"]:not([data-mt="log"]) #life-map { display: none; }
  body[data-mp="tab"][data-mt="log"] #life-map { order: 6; }
  body:not([data-mp="tab"]) #fam, body[data-mp="tab"]:not([data-mt="social"]) #fam { display: none; }
  body[data-mp="tab"][data-mt="social"] #fam { order: 3; }
  body[data-mp="tab"][data-mt="map"] #cur-war { display: block; order: 1; }
  body:not([data-mp="tab"]) #war-chart, body[data-mp="tab"]:not([data-mt="map"]) #war-chart { display: none; }
  body[data-mp="tab"][data-mt="map"] #war-chart { order: 2; }
}
/* 日本地图缩放：取景框固定，里面的地图平移 + 缩放；没放大时单指照常上下滚动页面，双指交给地图 */
.jmap-zoom { position: relative; overflow: hidden; touch-action: pan-y; border-radius: 4px; }
.jmap-zoom.zoomed { touch-action: none; cursor: grab; }
.jmap-stage { transform-origin: 0 0; will-change: transform; }
.mz-bar { position: absolute; left: 8px; bottom: 8px; display: flex; align-items: center; gap: 6px; padding: 3px 8px; border-radius: 4px; background: color-mix(in srgb, var(--card) 85%, transparent); border: 1px solid var(--line2); }
.mz-range { width: 110px; accent-color: var(--accent); }
.mz-val { font-family: var(--mono); font-size: 11px; color: var(--ink2); min-width: 34px; text-align: right; }
.ex-agree { display: block; font-size: 11.5px; } .ex-row.ex-no { opacity: .72; } .ex-row.ex-no input:disabled { cursor: not-allowed; }
/* 手机人物卡头部（第二版）：姓名 + 身份 / 头像 · 清单（学校、年龄学年、军团、职责）/ 性格标签 2×2 · MBTI / 互动按钮整块居中 */
@media (max-width: 760px) {
  .nc-head2 { grid-template-columns: 64px minmax(0, 1fr); grid-template-areas: "name name" "pix school" "pix legion" "pix role" "tags mbti" "cta cta"; column-gap: 12px; row-gap: 4px; align-items: start; }
  .nh-school { flex-direction: column; gap: 2px; } .nh-school .sb-s, .nh-age { display: block; white-space: normal; }
  .nh-legion:empty, .nh-role:empty { display: none; }
  .nh-tags { margin-top: 6px; } .nh-tags .tags { display: grid; grid-template-columns: repeat(2, max-content); gap: 4px; }
  .nh-mbti { align-self: end; justify-self: end; }
  .nh-cta { justify-self: stretch; margin-top: 8px; } .nh-cta .nc-cta { display: flex; justify-content: center; padding: 0; } .nh-cta .nc-big { width: 100%; max-width: 320px; }
}
/* 职业树：区域页签 + 每个职责占满一行、边框清楚 */
.zfit .zf-tab { display: flex; flex-direction: column; align-items: flex-start; gap: 1px; text-align: left; padding: 6px 10px; font-size: 12px; color: var(--accent2); background: var(--card); }
.zfit .zf-tab b { color: var(--ink); font-size: 14px; font-family: var(--mono); } .zfit .zf-tab small { color: var(--ink2); }
.zfit .zf-tab.on { border-color: var(--accent); box-shadow: 0 0 0 1px var(--accent) inset, 0 0 12px var(--glow); background: color-mix(in srgb, var(--accent) 12%, var(--card)); color: var(--accent2); }
.tree-h { margin: 2px 0 8px; }
.tree-list { display: flex; flex-direction: column; gap: 10px; }
.role.role-card { border: 1px solid var(--line2); border-radius: 6px; padding: 10px 12px; background: color-mix(in srgb, var(--card) 85%, transparent); }
.role.role-card.cur { border-color: var(--accent); box-shadow: 0 0 0 1px color-mix(in srgb, var(--accent) 50%, transparent) inset; }
.role.role-card .rh .tag { margin-left: 4px; }
/* 高难度作战：行动区的作战面板与邀请简报 */
.op-card h3 small { color: var(--bad, #e5707a); }
.op-brief { display: flex; flex-direction: column; gap: 4px; margin: 6px 0; }
.op-en { display: flex; flex-wrap: wrap; gap: 4px; margin: 2px 0 4px; }
.op-en .op-boss { border-color: var(--bad, #e5707a); color: var(--bad, #e5707a); }
.op-parts { max-height: 220px; overflow-y: auto; display: flex; flex-direction: column; gap: 2px; border-top: 1px dashed var(--line); padding-top: 4px; }
.op-p { display: grid; grid-template-columns: minmax(0, 1.4fr) auto minmax(0, 1fr); gap: 8px; align-items: center; font-size: 12px; padding: 2px 0; }
.op-p.me { color: var(--accent); }
.op-p > span:last-child { text-align: right; }
.op-lock { margin: 4px 0 8px; }
@media (max-width: 760px) { .op-p { grid-template-columns: minmax(0, 1fr) auto; } .op-p > span:last-child { grid-column: 1 / -1; text-align: left; } }
.gb-hg-Small { background: #64748b; } .gb-hg-Middle { background: #3b6fd4; } .gb-hg-Large { background: #7048e8; } .gb-hg-Gigant { background: #c2410c; } .gb-hg-Ultra { background: #9f1239; }
.op-en .gb { margin-left: 0; } .op-en small { margin-right: 4px; }
.gb-boss { box-shadow: 0 0 0 1px #fff4 inset; }

/* 战技 */
.wsk-mods { font-size: 12px; line-height: 1.7; }
.wsk-row { border: 1px solid var(--line); border-radius: 3px; padding: 8px 10px; margin: 6px 0; }
.wsk-row.got { border-color: color-mix(in srgb, var(--accent) 60%, var(--line)); }
.wsk-h { display: flex; align-items: center; gap: 4px; margin-bottom: 4px; }
.wsk-lv { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 2px 12px; font-size: 11.5px; }
.wsk-ps { display: flex; flex-wrap: wrap; gap: 4px 10px; align-items: center; margin-top: 5px; font-size: 12px; }
.wsk-rp { display: inline-flex; align-items: center; gap: 4px; }
.wsk-note { display: flex; align-items: center; gap: 8px; font-size: 12px; margin: 4px 0; }
.wsk-note b { margin-left: auto; }
p.wsk-note { display: block; } p.wsk-done { color: var(--bad); } .kv-btn { margin-left: 6px; padding: 1px 6px; font-size: 11px; vertical-align: 1px; }
.qn { margin: 0 .25em; }  /* 去掉「」后的名词：左右留一点间距 */
@media (max-width: 760px) { .wsk-lv { grid-template-columns: minmax(0, 1fr); } }
.op-pn { display: flex; flex-wrap: wrap; align-items: baseline; gap: 2px 4px; min-width: 0; } .op-pn .op-cap { flex-basis: 100%; font-size: 11px; }

/* 军团卡：阵型区顶部的军团等级；终射候选的人物卡 */
.fg-lv { display: flex; align-items: center; gap: 10px; margin: 12px 0 2px; padding-top: 8px; border-top: 1px dashed var(--line); font-size: 13px; }
.fg-lv .bar { flex: 1; min-width: 80px; } .fg-lv small { white-space: nowrap; font-family: var(--mono); }
.fg-top { margin-top: 6px; }
.fin-row { align-items: center; } .fin-list { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 4px 14px; font-weight: 500; }
.fin-c { display: inline-flex; align-items: center; gap: 4px; white-space: nowrap; }
.plan .plan-reset i { font-style: normal; font-size: 15px; color: var(--accent); } .plan .plan-reset:disabled { opacity: .45; }

/* 行动菜单的分类页签 */
.act-cats { display: grid; grid-template-columns: repeat(auto-fit, minmax(0, 1fr)); gap: 4px; margin: 8px 0; }
.act-cats button { padding: 6px 4px; font-size: 13px; display: flex; justify-content: center; align-items: baseline; gap: 4px; }
.act-cats button.on { border-color: var(--accent); color: var(--accent); background: color-mix(in srgb, var(--accent) 12%, transparent); }
.act-cats small { color: var(--ink2); font-family: var(--mono); }
.lrn-need { font-size: 12px; flex: 1 1 auto; } .role-card.lrn { opacity: .92; }
.role-flex { display: flex; flex-direction: row; flex-wrap: wrap; gap: 8px; align-items: flex-start; } .role-flex > .role-card { flex: 1 1 320px; min-width: 0; margin: 0; }   /* 横排换行（以前和 .tree-list 的竖排叠在一起，320px 变成了高度） */
@media (max-width: 760px) { .role-flex > .role-card { flex-basis: 100%; } }
.op-pn .op-cap { flex-basis: 100%; display: flex; flex-wrap: wrap; align-items: center; gap: 2px 8px; font-size: 12px; margin-top: 2px; }
/* 行动菜单：页签的选中态（盖过全局 button.on 在暗色模式下的深色文字）；列表区固定高度，内容少时留白 */
:root .act-cats button.on, :root[data-theme="dark"] .act-cats button.on, :root:not([data-theme="light"]) .act-cats button.on { background: color-mix(in srgb, var(--accent) 16%, transparent); color: var(--accent); border-color: var(--accent); box-shadow: none; font-weight: 700; }
:root .act-cats button.on small, :root:not([data-theme="light"]) .act-cats button.on small { color: var(--accent); }
#act-menu .alist.pop-scroll { height: min(60vh, 600px); max-height: none; align-content: start; }
.gl-sum { background: none; border: 0; padding: 4px 0; color: var(--accent); font-size: 13px; cursor: pointer; box-shadow: none; }
:root .gl-sum.on, :root:not([data-theme="light"]) .gl-sum.on { background: none; color: var(--accent); box-shadow: none; }

/* 魔法球注入滑条：美化（亮 / 暗色都清楚）；注入强度一行；参战成员卡可点 */
#bt-inj { -webkit-appearance: none; appearance: none; height: 6px; border-radius: 3px; background: linear-gradient(90deg, var(--accent) 0 var(--v, 75%), color-mix(in srgb, var(--line) 80%, transparent) var(--v, 75%) 100%); outline: none; cursor: pointer; }
#bt-inj::-webkit-slider-thumb { -webkit-appearance: none; width: 16px; height: 16px; border-radius: 50%; background: var(--bg, #0d141c); border: 3px solid var(--accent); box-shadow: 0 0 8px var(--glow); }
#bt-inj::-moz-range-thumb { width: 12px; height: 12px; border-radius: 50%; background: var(--bg, #0d141c); border: 3px solid var(--accent); box-shadow: 0 0 8px var(--glow); }
#bt-inj::-moz-range-track { height: 6px; border-radius: 3px; background: transparent; }
.bt-injs { display: inline-flex; align-items: baseline; gap: 6px; font-size: 13px; cursor: help; } .bt-injs b { font-size: 16px; }
.bt-mm[data-act="npc"] { cursor: pointer; } .bt-mm[data-act="npc"]:hover { border-color: var(--accent); }
.lg-r.lg-none { color: var(--dim); font-family: inherit; }   /* 未评级的军团 */
.lrn-n { cursor: help; border-bottom: 1px dashed currentColor; }   /* 可悬停看明细的数字 */

/* 未习得职责：紧凑卡片 */
.role-card.lrn { padding: 8px 10px; display: flex; flex-direction: column; gap: 4px; }
.role-card.lrn .rd { font-size: 12px; color: var(--ink2); margin: 0; }
.lrn-b { display: flex; gap: 8px; align-items: baseline; font-size: 12px; cursor: help; } .lrn-b > span { color: var(--dim); white-space: nowrap; } .lrn-b b { font-weight: 500; }
.lrn-f { display: flex; flex-direction: column; align-items: stretch; gap: 6px; margin-top: 2px; padding-top: 8px; border-top: 1px dashed var(--line); }
.lrn-f .lrn-need { flex: 1 1 auto; font-size: 12px; color: var(--ink2); }
.lrn-btn { width: 100%; font-size: 13px; font-weight: 700; padding: 6px 18px; min-height: 32px; }

/* 其他职责（已习得）：紧凑卡片 */
.role-card.cmp { padding: 8px 10px; display: flex; flex-direction: column; gap: 4px; }
.role-card.cmp .rd { font-size: 12px; color: var(--ink2); margin: 0; }
.role-card.cmp .rl-row { flex-direction: column; align-items: stretch; gap: 4px; margin: 2px 0 0; padding: 6px 0 0; border-bottom: 0; }
.role-card.cmp .rl-row .bonus2 { flex-direction: column; gap: 2px; }
.role-card.cmp .rl-row .rb { margin: 0; justify-content: flex-end; } .role-card.cmp .rb button { font-size: 13px; font-weight: 700; padding: 6px 18px; min-height: 32px; }
.role-card.cmp .rb { flex-wrap: wrap; gap: 6px 10px; } .role-card.cmp .rb .rare-act button { font-size: 13px; font-weight: 700; padding: 6px 14px; min-height: 32px; }
.role-card.cmp .xpline { margin: 2px 0 0; }

/* 技能：和职责 / 战技同款的紧凑 flex 卡片 */
.skl { display: flex; flex-wrap: wrap; gap: 8px; align-items: flex-start; }
.skl > .sk { flex: 1 1 300px; min-width: 0; margin: 0; display: flex; flex-direction: column; gap: 4px; }
.skl > .sk .sk-sec { margin: 2px 0; } .skl > .sk .sk-attr { list-style: none; padding-left: 0; display: flex; flex-wrap: wrap; gap: 2px 14px; line-height: 1.6; }
.skl > .sk p.desc { margin: 2px 0 0; font-size: 11.5px; color: var(--ink2); padding: 4px 8px; }
.skl > .sk .ot-row, .skl > .sk .tr-row { margin: 2px 0; flex-wrap: wrap; gap: 6px 10px; }
.skl > .sk .rare-act button, .skl > .sk .tr-row > button { font-size: 13px; font-weight: 700; padding: 6px 14px; min-height: 32px; }
@media (max-width: 760px) { .skl > .sk { flex-basis: 100%; } }

/* 紧凑卡片列表：自动列宽的网格，落单的卡只占一列（不铺满整行） */
.role-flex, .skl { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(300px, 100%), 1fr)); gap: 8px; align-items: start; }
.skl { align-items: stretch; }   /* 同一行的技能卡等高 */
.skl > .sk .sk-act-f { font-size: 11px; color: var(--ink2); margin-top: 2px; line-height: 1.6; }
.skl > .sk .rare-req { font-size: 12px; margin-top: -2px; }
.role-flex > .role-card, .skl > .sk { flex: none; width: auto; }
.skl > .sk.sk-wide { grid-column: 1 / -1; width: auto; }   /* .skl 是网格：整行卡跨满所有列 */
.sk-2c { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 16px; align-items: start; }
.sk-2c > div + div { padding-left: 16px; border-left: 1px dashed var(--line); }
@media (max-width: 720px) { .sk-2c { grid-template-columns: minmax(0, 1fr); } .sk-2c > div + div { padding-left: 0; border-left: 0; } }

/* 战斗面板：稀有技能按钮 */
.bt-rab { font-weight: 700; border-color: var(--skill); color: var(--skill); } .bt-rab small { margin-left: 6px; font-weight: 400; color: var(--ink2); }
.bt-rab:disabled { opacity: .5; }
.bt-rab.bt-sab { border-color: var(--line2); color: var(--ink); font-weight: 600; }   /* 次级技能按钮：比稀有技能低调一点 */
#bt-ra { display: inline-flex; flex-wrap: wrap; gap: 4px; }
.role-card.cmp .rb .rsw { font-size: 13px; font-weight: 700; padding: 6px 14px; min-height: 32px; border-color: var(--accent); color: var(--accent); }   /* 设为当前职责 */

.lg-rec { display: grid; grid-template-columns: repeat(auto-fill, minmax(140px, 1fr)); gap: 0 18px; }   /* 军团战绩：各等级击杀 */

.bar .tal-mk { position: absolute; top: -2px; bottom: -2px; width: 0; border-left: 1.5px dashed var(--ink); opacity: .75; pointer-events: none; }   /* 天赋值 */

/* 可悬停 / 点击固定明细的行内数值、名称：统一点线下划线（data-hov 的 span / b / a；整行的 .md-r、属性条等块级元素不加） */
span[data-hov], b[data-hov], a[data-hov], i[data-hov] { cursor: pointer; border-bottom: 1px dotted color-mix(in srgb, var(--ink2) 50%, transparent); }   /* 和 .ent-k / .md-k 同一样式 */
span[data-hov]:hover, b[data-hov]:hover, a[data-hov]:hover, i[data-hov]:hover { border-bottom-color: var(--accent); }
.gl-idle { align-items: flex-start; } .gl-idle-v { display: flex; flex-direction: column; gap: 2px; font-size: 12.5px; } .gl-idle-v > div { display: flex; gap: 18px; }

.pslots-row { display: flex; align-items: center; flex-wrap: wrap; gap: 6px 28px; margin-bottom: 8px; } .pslots-row > .pslots { margin-bottom: 0; }

/* 暂停：屏幕上下边缘的蓝色呼吸光（手机端贴在顶栏下、底栏上，由 main.js 写 --pz-t / --pz-b） */
.pz-glow { position: fixed; left: 0; right: 0; height: 26px; pointer-events: none; z-index: 35; opacity: 0; transition: opacity .3s; }   /* 在顶栏 / 底栏之上，在弹窗、人物卡、行动菜单、overlay 之下 */
#pz-top { top: var(--pz-t, 0px); background: linear-gradient(to bottom, rgba(70, 160, 255, .55), rgba(70, 160, 255, 0)); }
#pz-bot { bottom: var(--pz-b, 0px); background: linear-gradient(to top, rgba(70, 160, 255, .55), rgba(70, 160, 255, 0)); }
body.pz-on .pz-glow { animation: pz-breathe 2.4s ease-in-out infinite; }
@keyframes pz-breathe { 0%, 100% { opacity: .25; } 50% { opacity: 1; } }

/* CHARM 改造零件：固定宽度的槽位卡，一行排开（放不下就换行） */
.part-cards { display: flex; flex-wrap: wrap; gap: 6px; margin: 4px 0 8px; }
.part-card { width: 150px; flex: 0 0 150px; display: flex; flex-direction: column; align-items: flex-start; gap: 2px; padding: 6px 8px; text-align: left; border: 1px solid var(--line); border-radius: 4px; background: var(--card2); }
.part-card small { color: var(--ink2); font-size: 11px; } .part-card b { font-size: 12.5px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; max-width: 100%; }
.part-card .pc-st { font-size: 11px; color: var(--ink2); } .part-card.empty { border-style: dashed; } .part-card:not([disabled]):hover { border-color: var(--accent); }
#pz-l, #pz-r { top: var(--pz-t, 0px); bottom: var(--pz-b, 0px); height: auto; width: 22px; left: auto; right: auto; }
#pz-l { left: 0; background: linear-gradient(to right, rgba(70, 160, 255, .5), rgba(70, 160, 255, 0)); }
#pz-r { right: 0; background: linear-gradient(to left, rgba(70, 160, 255, .5), rgba(70, 160, 255, 0)); }
/* 上方滚动的「暂停中」围栏：贴在上方光带下沿，细框 + 斜纹 + 等宽字，向左循环滚动 */
#pz-tape { position: fixed; left: 0; right: 0; top: var(--pz-t, 0px); height: 18px; z-index: 36; pointer-events: none; overflow: hidden; opacity: 0; transition: opacity .3s;
  border-top: 1px solid rgba(110, 180, 255, .55); border-bottom: 1px solid rgba(110, 180, 255, .55);
  background: repeating-linear-gradient(-45deg, rgba(60, 140, 255, .16) 0 6px, rgba(60, 140, 255, .04) 6px 12px), rgba(8, 18, 34, .55); }
body.pz-on #pz-tape { opacity: 1; }
#pz-tape .pz-run { display: flex; width: max-content; animation: pz-scroll 28s linear infinite; }
#pz-tape .pz-run > div { display: flex; flex: none; }
#pz-tape span, #pz-tape i { font: 600 10.5px/16px var(--mono, monospace); letter-spacing: .22em; color: rgba(150, 205, 255, .95); text-shadow: 0 0 6px rgba(80, 160, 255, .9); padding: 0 8px; white-space: nowrap; font-style: normal; }
#pz-tape i { color: rgba(90, 150, 230, .7); letter-spacing: 0; padding: 0 2px; }
@keyframes pz-scroll { from { transform: translateX(0); } to { transform: translateX(-50%); } }

/* 顶栏名字旁的头像 */
#top-who .who-pix { display: inline-flex; vertical-align: middle; margin-right: 6px; } #top-who .who-pix img, #top-who .who-pix canvas { width: 26px; height: 26px; image-rendering: pixelated; }
/* 手机底栏：两个同宽大按钮在最上面；日期和速度同一行 */
@media (max-width: 760px) {
  #mbar .ctl-play { display: flex; gap: 8px; margin: 0 0 6px; }
  #mbar .ctl-play > #ctl-pause, #mbar .ctl-play > #ctl-act { flex: 1 1 0; min-width: 0; padding: 9px 8px; font-size: 15px; font-weight: 700; text-align: center; justify-content: center; }
  #mbar .ctl-play > #ctl-more { margin-left: 0; flex: none; }
  #mbar .mb-line { display: flex; align-items: center; justify-content: space-between; gap: 8px; }
  #mbar .mb-line > .sub { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
  #mbar .mb-line > #ctl-speed { flex: none; }
}

/* 负好感：讨厌 / 怨恨 / 痛恨 */
.rbar.rb-hate i { background: #e0566a; } .rv.rv-hate { color: #ff6b7d; }
.rel-b.rk-hate1 { background: #8a5560; color: #fff; } .rel-b.rk-hate2 { background: #b8434f; color: #fff; } .rel-b.rk-hate3 { background: #6e1a28; color: #ffd0d6; } .rel-b.rk-staff { background: #5b6b8a; color: #fff; }

/* ---------- 班级页（ui_class.js） ---------- */
.cls-head h3 { display: flex; align-items: center; gap: 8px; } .cls-head .cls-help { margin-left: auto; min-width: 26px; }
.tc-cards { display: flex; flex-wrap: wrap; gap: 8px; margin: 4px 0 8px; }
.tc-card { width: 230px; flex: 0 0 230px; display: flex; flex-direction: column; gap: 2px; padding: 8px 10px; border: 1px solid var(--line); border-radius: 4px; background: var(--card2); }
.tc-card .tc-top { display: flex; align-items: center; gap: 8px; margin-bottom: 4px; } .tc-card .tc-top small { display: block; color: var(--ink2); font-size: 11px; }
.tc-card .kv { font-size: 12px; padding: 1px 0; } .tc-card > button { align-self: flex-start; margin-top: 4px; }
.tc-card .tc-task small { display: flex; align-items: center; gap: 4px; flex-wrap: wrap; font-size: 11px; color: var(--ink2); } .tc-card .tc-task .bar { width: 60px; flex: none; }
.cls-pol .cls-pm { display: flex; gap: 4px; margin-top: 4px; }
.cls-af { border: 1px solid var(--line); border-left: 3px solid #e0a83a; border-radius: 4px; padding: 6px 8px; margin: 6px 0; }
.cls-af.k-major { border-left-color: #e0566a; } .cls-af.k-pet { border-left-color: var(--accent); }
.cls-af .af-h { display: flex; align-items: center; gap: 6px; flex-wrap: wrap; font-size: 12px; } .cls-af .af-h small { margin-left: auto; }
.cls-af .af-k { font-size: 10.5px; padding: 0 6px; border-radius: 2px; background: var(--line2); color: var(--ink); }
.cls-af .af-d { font-size: 12.5px; margin: 4px 0; color: var(--ink); } .cls-af .row { gap: 6px; flex-wrap: wrap; align-items: center; }
.cls-tabs { margin: 6px 0; } .cls-list .gb { margin-left: 4px; font-size: 10px; } .gb-cq { background: #6c5ba8; color: #fff; }
.cls-grp { border: 1px solid var(--line); border-radius: 4px; padding: 6px 8px; margin: 6px 0; } .cls-grp.mine { border-color: var(--accent); }
.cls-grp h4 { margin: 0 0 4px; font-size: 12.5px; } .cls-gm { display: flex; align-items: center; gap: 6px; } .cls-gm .frow { flex: 1; min-width: 0; } .cls-mv { font-size: 11px; }
.cls-cq { border: 1px solid var(--line); border-radius: 4px; padding: 6px 8px; margin: 6px 0; } .cls-cq h4 { margin: 0 0 4px; font-size: 12.5px; } .cls-cq h4 small { color: var(--ink2); font-weight: 400; margin-left: 6px; }
.cq-mem { display: flex; flex-wrap: wrap; gap: 3px; margin-top: 4px; }
@media (max-width: 760px) { .tc-card { width: 100%; flex: 1 1 100%; } }

.sb.sb-staff { background: #5b6b8a; color: #fff; }
/* 全国战况：科技一行（名称 · 进度条 · LvN xx/100） */
.stat.tech-row { grid-template-columns: minmax(70px, auto) 1fr auto; cursor: help; }
.stat.tech-row > span { white-space: nowrap; }
.stat.tech-row > b { font-size: 12px; }

/* ---------- 班级页 v2（ui_class.js 重写）：教官卡一排 3 张居中、人物卡 / 小组卡 / 小团体卡、班干部行 ---------- */
.cls-head h3 small { margin-left: 4px; }
.tc-cards { justify-content: center; max-width: calc(3 * 250px + 2 * 10px); margin: 4px auto 8px; gap: 10px; }
.tc-card { width: 250px; flex: 0 0 250px; }
.tc-card .tc-top .tc-nm { flex: 1; min-width: 0; } .tc-card .tc-top .tc-nm a { display: block; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.tc-card .tc-top .tc-act { flex: none; align-self: center; }
.tc-card .tc-vote { display: inline-flex; align-items: center; gap: 2px; }
.cls-mini { display: inline-flex; align-items: center; gap: 3px; } .cls-mini .pix { border-radius: 3px; } .cls-mini b { font-weight: 500; }
.tc-card .tc-eff { font-size: 11.5px; line-height: 1.6; padding: 3px 0 1px; border-top: 1px dashed color-mix(in srgb, var(--line) 80%, transparent); margin-top: 2px; display: flex; flex-wrap: wrap; align-items: baseline; gap: 2px 8px; }
/* 人物卡：固定宽度 */
.cls-pcs, .gc-mem { display: flex; flex-wrap: wrap; gap: 6px; justify-content: center; }
.cls-pcs { margin: 6px 0; }
.cls-pc { width: 168px; flex: 0 0 168px; box-sizing: border-box; display: flex; gap: 6px; align-items: flex-start; padding: 5px 6px; border: 1px solid var(--line); border-radius: 4px; background: var(--card2); cursor: pointer; position: relative; flex-wrap: wrap; }
.cls-pc.me { cursor: default; border-color: var(--accent); }
.cls-pc:not(.me):hover { border-color: var(--accent); background: color-mix(in srgb, var(--accent) 8%, var(--card2)); }
.cls-pc .pc-i { flex: 1; min-width: 0; } .cls-pc .pc-i > b { display: block; font-size: 12.5px; font-weight: 600; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.cls-pc .pc-tags { display: flex; flex-wrap: wrap; gap: 2px; } .cls-pc .pc-tags .gb { margin-left: 0; font-size: 10px; line-height: 15px; padding: 0 5px; }
.cls-pc .rel-l { display: flex; flex-direction: column; gap: 2px; margin-top: 2px; font-size: 11px; } .cls-pc .rel-l .rbar { width: 100%; height: 4px; }
.cls-pc .soc-st { font-size: 10.5px; display: flex; flex-wrap: wrap; gap: 0 6px; }
.cls-pc .fbtn { display: inline-block; margin-top: 3px; font-size: 11px; }
.cls-pc .cls-mv { flex: 0 0 100%; margin-top: 3px; }
/* 训练小组卡：组内人物卡一行 3 张 */
.cls-gcs, .cls-cqs { display: flex; flex-wrap: wrap; gap: 10px; justify-content: center; margin: 6px 0; }
.cls-gc { box-sizing: border-box; width: calc(3 * 168px + 2 * 6px + 18px); max-width: 100%; border: 1px solid var(--line); border-radius: 4px; padding: 6px 8px 8px; background: color-mix(in srgb, var(--card2) 50%, transparent); }
.cls-gc.mine, .cls-cqc.mine { border-color: var(--accent); box-shadow: 0 0 0 1px color-mix(in srgb, var(--accent) 40%, transparent) inset; }
.cls-gc .gc-mem { justify-content: flex-start; }
.gc-h { display: flex; align-items: baseline; gap: 8px; margin-bottom: 4px; font-size: 13px; } .gc-h small { color: var(--ink2); font-size: 11px; } .gc-h .gc-me { color: var(--accent); margin-left: auto; }
.gc-f { display: flex; align-items: center; flex-wrap: wrap; gap: 4px 8px; font-size: 12px; margin-bottom: 6px; } .gc-f > span:first-child { color: var(--ink2); } .gc-f .gc-eff { margin-left: auto; }
/* 小团体卡 */
.cls-cqc { box-sizing: border-box; width: 260px; flex: 0 0 260px; border: 1px solid var(--line); border-radius: 4px; padding: 6px 8px; background: var(--card2); display: flex; flex-direction: column; gap: 1px; }
.cls-cqc .kv { font-size: 12px; padding: 2px 0; } .cls-cqc .stat { margin: 2px 0; }
.cls-cqc .cq-btn { gap: 6px; flex-wrap: wrap; align-items: center; margin-top: 4px; }
.cls-found { gap: 6px; flex-wrap: wrap; align-items: center; margin: 6px 0; font-size: 12px; }
/* 班干部：每个职位一行 */
.cls-posts { display: flex; flex-direction: column; margin: 4px 0 6px; }
.cls-post { display: grid; grid-template-columns: 96px minmax(110px, 1fr) minmax(140px, 1.3fr) auto; gap: 8px; align-items: center; padding: 5px 2px; border-bottom: 1px dashed color-mix(in srgb, var(--line) 80%, transparent); font-size: 12.5px; }
.cls-post .cp-n small { display: block; color: var(--ink2); font-size: 10.5px; }
.cls-post .cp-w { display: inline-flex; align-items: center; gap: 4px; min-width: 0; white-space: nowrap; overflow: hidden; }
.cls-post .cp-b { display: flex; align-items: center; gap: 6px; justify-content: flex-end; flex-wrap: wrap; }
.cls-post.mine { background: color-mix(in srgb, var(--accent) 8%, transparent); } .cls-post.empty .cp-w { opacity: .7; }
@media (max-width: 760px) {
  .tc-card { width: 100%; flex: 1 1 100%; }
  .cls-gc { width: 100%; } .cls-cqc { width: 100%; flex: 1 1 100%; }
  .cls-pc { width: calc(50% - 3px); flex: 0 0 calc(50% - 3px); }
  .cls-post { grid-template-columns: 1fr auto; } .cls-post .cp-e { grid-column: 1 / -1; } .cls-post .cp-b { grid-column: 1 / -1; justify-content: flex-start; }
}

/* 班级页布局 v2（2026-10-20）：人物卡一行 4 张撑满、标签在名字旁、第二行进度条 + 互动；小组一行 2 组；班干部一排 5 槽；政策居中；教官一行 3 张撑满 */
.cls-pcs { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 6px; }
.cls-pc { width: auto; flex: none; min-width: 0; align-items: center; padding: 5px 6px; cursor: pointer; }
.cls-pc .pc-n { display: flex; align-items: center; gap: 4px; min-width: 0; flex-wrap: nowrap; overflow: hidden; }
.cls-pc .pc-n > b { font-size: 12.5px; font-weight: 600; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; min-width: 0; flex: 0 1 auto; }
.cls-pc .pc-n .rel-b, .cls-pc .pc-n .gb { flex: none; margin-left: 0; font-size: 10px; line-height: 15px; padding: 0 4px; white-space: nowrap; }
.cls-pc .pc-r2 { display: flex; align-items: center; gap: 6px; margin-top: 4px; min-width: 0; }
.cls-pc .pc-r2 .pc-bar { flex: 1; min-width: 0; display: flex; align-items: center; font-size: 11px; } .cls-pc .pc-r2 .pc-bar > * { min-width: 0; }
.cls-pc .pc-r2 .mini { margin-left: auto; flex: none; padding: 1px 8px; }
.cls-pc .pc-r2 .soc-st { flex: 1; }
.cls-gcs { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; }
.cls-gc { width: auto; max-width: none; min-width: 0; padding: 6px; }
.cls-gc .gc-mem { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 4px; }
.cls-gc .cls-pc { padding: 4px; gap: 4px; } .cls-gc .cls-pc .pix { width: 26px !important; height: 26px !important; }
.cls-posts { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 6px; }
.cls-post { display: flex; flex-direction: column; align-items: stretch; gap: 4px; padding: 6px; border: 1px solid var(--line); border-radius: 4px; background: var(--card2); grid-template-columns: none; min-width: 0; }
.cls-post .cp-n b { font-size: 12.5px; } .cls-post .cp-e { font-size: 11px; line-height: 1.5; } .cls-post .cp-b { justify-content: flex-start; margin-top: auto; }
.cls-post.empty { border-style: dashed; }
.card .part-cards:has(.cls-pol) { justify-content: center; }
.tc-cards { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); max-width: none; gap: 8px; margin: 4px 0 8px; }
.tc-card { width: auto; flex: none; min-width: 0; }
@media (max-width: 900px) { .cls-pcs { grid-template-columns: repeat(3, minmax(0, 1fr)); } .cls-posts { grid-template-columns: repeat(3, minmax(0, 1fr)); } .cls-gc .gc-mem { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 760px) { .cls-pcs, .cls-gcs { grid-template-columns: repeat(2, minmax(0, 1fr)); } .cls-pc { width: auto; flex: none; } .cls-gc .gc-mem { grid-template-columns: minmax(0, 1fr); } .tc-cards { grid-template-columns: minmax(0, 1fr); } .tc-card { width: auto; } .cls-posts { grid-template-columns: repeat(2, minmax(0, 1fr)); } .cls-post { grid-column: auto; } }

.cls-found-h { margin: 8px 0 4px; font-size: 13px; }
.cls-found { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 6px; margin: 0 0 8px; }
.cls-found button { display: flex; flex-direction: column; align-items: center; gap: 2px; padding: 10px 6px; min-width: 0; }
.cls-found button b { font-size: 14px; } .cls-found button small { font-size: 11px; color: var(--ink2); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; max-width: 100%; }
@media (max-width: 760px) { .cls-found { grid-template-columns: repeat(2, minmax(0, 1fr)); } }

.cls-head .tc-h { margin: 10px 0 4px; font-size: 13px; display: flex; align-items: baseline; gap: 8px; flex-wrap: wrap; } .cls-head .tc-h small { font-size: 11px; font-weight: 400; }

/* 训练小组：你的组撑满一行（组员一行 4 人）；其他组收进「其他小组」，一排 2 组、组内一人一行，带「互换」 */
.cls-gcs.cls-gcs-me { grid-template-columns: minmax(0, 1fr); }
.cls-gcs-me .cls-gc .gc-mem { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 6px; }
.cls-gcs-me .cls-gc .cls-pc { padding: 5px 6px; } .cls-gcs-me .cls-gc .cls-pc .pix { width: 32px !important; height: 32px !important; }
.cls-ogrp { margin: 8px 0; } .cls-ogrp > summary { cursor: pointer; font-size: 13px; font-weight: 600; padding: 4px 0; } .cls-ogrp > summary small { margin-left: 6px; font-weight: 400; }
.cls-gcs-o { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.cls-gcs-o .cls-gc .gc-mem { grid-template-columns: minmax(0, 1fr); gap: 3px; }
.cls-gcs-o .cls-pc { display: flex; align-items: center; } .cls-gcs-o .cls-pc .pc-i { display: flex; align-items: center; gap: 8px; min-width: 0; }
.cls-gcs-o .cls-pc .pc-n { flex: 0 1 auto; } .cls-gcs-o .cls-pc .pc-r2 { flex: 1; margin-top: 0; }
.cls-pc .pc-swap { flex: none; margin-left: 4px; padding: 1px 8px; }
@media (max-width: 760px) { .cls-gcs-o { grid-template-columns: minmax(0, 1fr); } .cls-gcs-me .cls-gc .gc-mem { grid-template-columns: repeat(2, minmax(0, 1fr)); } }

/* 开发控制台（main.js devConsole，只在本地服务器显示） */
#dev-con { position: fixed; top: 10px; right: 16px; z-index: 60; display: flex; flex-direction: column; align-items: stretch; gap: 4px; padding: 4px 6px; border: 1px dashed #e0a83a; border-radius: 4px; background: color-mix(in srgb, var(--card) 92%, transparent); font-size: 11px; }
#dev-con b { color: #e0a83a; font-family: var(--mono); margin-right: 2px; } #dev-con .mini { margin-left: 0; }

/* 任命班干部弹窗：名字旁关系徽章 + 好感条 */
.ai-main .pp-n { display: inline-flex; align-items: center; gap: 4px; } .ai-main .pp-n .rel-b { font-size: 10px; line-height: 15px; padding: 0 4px; }
.ai-main .pp-bar { display: flex; max-width: 220px; margin: 2px 0; font-size: 11px; }

.cls-cqc .cq-sat { gap: 4px; align-items: center; flex-wrap: wrap; margin: 2px 0; } .cls-cqc .cq-sat .mini { margin-left: 0; padding: 0 6px; }

/* 班级政策卡：当前效果 / 分隔 / 下级效果（明细） / 升级 · 降级 */
.cls-pol { display: flex; flex-direction: column; gap: 2px; min-width: 190px; }
.cls-pol .pol-h { font-size: 13px; } .cls-pol .pol-h small { color: var(--ink2); font-weight: 400; margin-left: 4px; }
.cls-pol .pol-l { font-size: 10.5px; color: var(--ink2); margin-top: 2px; }
.cls-pol .pol-sep { border: none; border-top: 1px dashed var(--line); margin: 4px 0 2px; width: 100%; }
.cls-pol .pol-nx { display: flex; align-items: baseline; gap: 8px; font-size: 12px; }
.cls-pol .cls-pm { display: flex; gap: 4px; margin-top: 6px; flex-wrap: wrap; } .cls-pol .cls-pm .mini { margin-left: 0; }

.cls-post .cp-e { display: flex; flex-direction: column; gap: 1px; } .cls-post .cp-x { font-size: 11px; }

.tc-card .tc-task .tc-tk-r { display: block; margin-top: 1px; }

/* 班级方针：一行 4 张撑满 */
.part-cards.cls-pols { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 6px; } .cls-pols .cls-pol { min-width: 0; }
@media (max-width: 900px) { .part-cards.cls-pols { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
.cls-found button small b { font-weight: 600; }

.cls-found.cls-meet { grid-template-columns: minmax(0, 1fr); margin-top: 4px; }

.cls-pol .pol-nx { flex-direction: column; align-items: stretch; gap: 2px; }
.cls-pol .pol-nxv, .cls-pol .pc-st.st-d { display: flex; align-items: baseline; justify-content: space-between; gap: 6px; font-size: 11.5px; cursor: help; } .cls-pol .pol-nxv > span:first-child { min-width: 0; }

.cls-pol .cls-pm { align-items: center; } .cls-pol .pol-cost { font-size: 11px; margin-left: 4px; } .cls-pol .pol-why { font-size: 10.5px; }
/* 班级方针卡撑满网格格子（part-card 默认固定 150px 宽，放进网格会留空隙） */
.part-cards.cls-pols .cls-pol { width: auto; flex: none; min-width: 0; align-items: stretch; }
.part-cards.cls-pols .cls-pol b { white-space: normal; }
@media (max-width: 520px) { .part-cards.cls-pols { grid-template-columns: minmax(0, 1fr); } }
/* 大按钮里的说明：数字和文字同样小，放不下就换行（手机端不再被截断） */
.cls-found button small { white-space: normal; overflow: visible; text-overflow: clip; line-height: 1.35; text-align: center; }
.cls-found button small b, .cls-found button small .up, .cls-found button small .dn, .cls-found button small .fx-n { font-size: inherit !important; font-weight: 600; }

.cls-sec { margin: 10px 0 6px; font-size: 13px; display: flex; align-items: baseline; gap: 8px; flex-wrap: wrap; } .cls-sec small { font-weight: 400; font-size: 11.5px; color: var(--ink2); }

/* 手机端 Garden 子标签分两层（每层 3 个） */
@media (max-width: 620px) { .subtabs.g-subtabs { grid-template-columns: repeat(3, minmax(0, 1fr)) !important; } .subtabs.g-subtabs button { border-bottom: 1px solid color-mix(in srgb, var(--line) 60%, transparent); } .subtabs.g-subtabs button.on { border-bottom: 2px solid var(--accent); } .subtabs.g-subtabs button:nth-child(3n) { border-right: none; } }

/* 方针卡的效果块：词条两列 + 右端明细（当前 / 下级同一种写法） */
.cls-pol .pol-blk { display: flex; align-items: flex-start; gap: 6px; cursor: help; padding: 2px 0; }
.cls-pol .pol-effs { flex: 1; min-width: 0; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1px 10px; font-size: 11.5px; }
.cls-pol .pol-effs b { font-size: inherit; }
.cls-pol .pol-blk .sk-more { flex: none; font-size: 11px; }

.cls-pol .pol-blk.pol-nx1 { justify-content: space-between; align-items: center; }
/* 手机端 Garden 子标签分两层后空间够了：恢复图标 */
@media (max-width: 620px) { .subtabs.g-subtabs button .tico { display: inline-block; } }

.bt-mem-b h5 { color: #ff7d8a; }

/* 小组对抗战绩 */
.gb-row { border-bottom: 1px dashed color-mix(in srgb, var(--line) 80%, transparent); padding: 5px 0; font-size: 12px; }
.gb-row .gb-h { display: flex; align-items: baseline; gap: 8px; flex-wrap: wrap; } .gb-row .gb-my { margin-left: auto; font-size: 11.5px; }
.gb-row .gb-ppl { display: flex; align-items: center; gap: 6px; flex-wrap: wrap; margin-top: 3px; } .gb-row .gb-ppl > small { min-width: 2.5em; }

/* 教室像素画 */
.cls-room { display: block; width: 100%; max-width: 560px; margin: 2px auto 10px; image-rendering: pixelated; border: 1px solid var(--line); border-radius: 4px; }

/* 教室图上的名字层 */
.cls-room-w { position: relative; width: 100%; max-width: 560px; margin: 2px auto 10px; } .cls-room-w .cls-room { margin: 0; max-width: none; }
.cls-room-w .cr-n { position: absolute; transform: translate(-50%, -100%); max-width: 16%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 10px; line-height: 13px; padding: 0 3px; border-radius: 3px; background: rgba(12, 18, 26, .72); color: #e8eef4; text-decoration: none; cursor: pointer; }
.cls-room-w a.cr-n:hover { background: var(--accent); color: #061016; }
.cls-room-w .cr-n.me { background: #ffe14d; color: #222; font-weight: 700; cursor: default; }
.cls-room-w .cr-n.t { background: rgba(60, 40, 20, .8); }
@media (max-width: 520px) { .cls-room-w .cr-n { font-size: 8.5px; line-height: 11px; padding: 0 2px; } }

/* 教室：三层叠图 + 每人眨眼 / 点头（节奏每人随机，见 ui_class.roomHtml） */
.cls-room-w { position: relative; width: 100%; max-width: 820px; margin: 2px auto 10px; border: 1px solid var(--line); border-radius: 4px; overflow: hidden; }
.cls-room-w .cr-l { position: absolute; inset: 0; width: 100%; height: 100%; image-rendering: pixelated; pointer-events: none; }
.cls-room-w .cr-p { position: absolute; display: block; pointer-events: none; animation-name: crNod; animation-iteration-count: infinite; animation-timing-function: steps(1, end); }
.cls-room-w .cr-p img { display: block; width: 100%; image-rendering: pixelated; }
.cls-room-w .cr-p .cr-bk { position: absolute; inset: 0; opacity: 0; animation-name: crBlink; animation-iteration-count: infinite; animation-timing-function: steps(1, end); }
@keyframes crNod { 0%, 90% { transform: none; } 92% { transform: translateY(3.2%); } 95% { transform: none; } 97% { transform: translateY(3.2%); } }
@keyframes crBlink { 0%, 95% { opacity: 0; } 96% { opacity: 1; } 99% { opacity: 0; } }

.cls-room-w .cr-p img { border: none; background: none; border-radius: 0; box-shadow: none; }
.cls-room-w .cr-p.cr-pl { pointer-events: auto; cursor: pointer; } .cls-room-w .cr-p.cr-pl:hover { filter: brightness(1.15) drop-shadow(0 0 2px var(--accent)); }

.cls-room-slot { position: relative; width: 100%; max-width: 820px; margin: 2px auto 10px; } .cls-room-slot > .cls-room-w { margin: 0; max-width: none; }

/* 班级页子标签（概要下面） */
.cls-subs { margin-top: 4px; } .cls-subs + .card { border-top: none; border-top-left-radius: 0; border-top-right-radius: 0; }

/* 交战中（播放实战动画时）：呼吸光和围栏换成红色 */
body.pz-bt #pz-top { background: linear-gradient(to bottom, rgba(255, 70, 85, .55), rgba(255, 70, 85, 0)); }
body.pz-bt #pz-bot { background: linear-gradient(to top, rgba(255, 70, 85, .55), rgba(255, 70, 85, 0)); }
body.pz-bt #pz-l { background: linear-gradient(to right, rgba(255, 70, 85, .5), rgba(255, 70, 85, 0)); }
body.pz-bt #pz-r { background: linear-gradient(to left, rgba(255, 70, 85, .5), rgba(255, 70, 85, 0)); }
body.pz-bt #pz-tape { border-top-color: rgba(255, 110, 120, .6); border-bottom-color: rgba(255, 110, 120, .6); background: repeating-linear-gradient(-45deg, rgba(255, 60, 75, .18) 0 6px, rgba(255, 60, 75, .05) 6px 12px), rgba(34, 8, 12, .6); }
body.pz-bt #pz-tape span { color: rgba(255, 170, 175, .95); text-shadow: 0 0 6px rgba(255, 70, 85, .9); } body.pz-bt #pz-tape i { color: rgba(240, 110, 120, .75); }

.cls-found.cls-meet { grid-template-columns: repeat(2, minmax(0, 1fr)); }
@media (max-width: 520px) { .cls-found.cls-meet { grid-template-columns: minmax(0, 1fr); } }
/* 召开班会 / 校外集训：各占一行 */
.cls-found.cls-meet { grid-template-columns: minmax(0, 1fr); }

/* ---- 手机版顶栏：头像 + 两行身份挂在右上角；页签与系统按钮收进整行下拉菜单 ---- */
#top-who .who-txt, #top-who .who-l1, #top-who .who-l2 { display: contents; }
#top-who .who-lg { margin-left: 6px; font-size: 12px; color: var(--ink2); }
#top-mtog { display: none; }   /* 菜单开关条：只在手机端 */
.top-menu, .tm-in { display: contents; }   /* 菜单外壳：电脑端不参与布局 */
@media (max-width: 760px) {
  #top .t1 { flex-wrap: nowrap; align-items: center; gap: 10px; }
  #top-who { margin-left: auto; display: flex; align-items: center; gap: 6px; min-width: 0; }
  #top-who .who-pix { margin: 0; flex: none; } #top-who .who-pix img, #top-who .who-pix canvas { width: 34px; height: 34px; }
  #top-who .who-txt { display: flex; flex-direction: column; min-width: 0; line-height: 1.25; }
  #top-who .who-l1, #top-who .who-l2 { display: block; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
  #top-who .who-l1 b { font-size: 14px; } #top-who .who-l1 .sb { font-size: 10.5px; }
  #top-who .who-l2 { font-size: 11px; color: var(--ink2); } #top-who .who-l2 .sb-s { margin: 0; font-size: 11px; } #top-who .who-lg { margin-left: 6px; font-size: 11px; }
  #top-mtog { display: block; margin-top: 6px; } #top-mtog .mt-tog { width: 100%; display: flex; align-items: center; justify-content: center; gap: 4px; padding: 5px 4px; font-size: 13px; font-weight: 600; }
  #top-mtog .mt-tog small { font-weight: 400; color: var(--ink2); }
  /* 展开 / 收起：外壳的行高从 0fr 平滑过渡到 1fr（内容不被压扁），同时用 clip-path 蒙版从上往下擦出 / 收回 */
  .top-menu { display: grid; grid-template-rows: 1fr; transition: grid-template-rows .34s cubic-bezier(.4, 0, .2, 1); }
  .tm-in { display: block; min-height: 0; overflow: hidden; clip-path: inset(0 0 0 0); transition: clip-path .34s cubic-bezier(.4, 0, .2, 1), opacity .28s ease; }
  .tm-in.tm-done { overflow: visible; clip-path: none; }
  #top.menu-closed .top-menu { grid-template-rows: 0fr; } #top.menu-closed .tm-in { clip-path: inset(0 0 100% 0); opacity: 0; pointer-events: none; }
  #top-mtog .mt-arr { display: inline-block; font-style: normal; transition: transform .3s ease; } #top.menu-closed #top-mtog .mt-arr { transform: rotate(180deg); }
  #top-mtog .mt-tog .rdot { display: none; } #top.menu-closed #top-mtog .mt-tog .rdot { display: inline-block; }   /* 红点只在收起时挂在菜单条上 */
}
/* 等级格子条（班级方针 Lv 后面）：亮格 = 当前等级 */
.lv-cells { display: inline-flex; gap: 3px; margin-left: 8px; vertical-align: 1px; } .lv-cells i { width: 18px; height: 8px; border: 1px solid var(--line2); background: color-mix(in srgb, var(--ink2) 10%, transparent); transform: skewX(-20deg); }
.lv-cells i.on { background: var(--accent); border-color: var(--accent); box-shadow: 0 0 6px color-mix(in srgb, var(--accent) 50%, transparent); }
/* ---- 提示气泡（js/bubbles.js）：顶栏下方右侧的方形悬挂气泡，轻科幻（斜切角 + 细描边 + 悬挂线）；点开是下拉 ---- */
#bubbles { position: fixed; right: 14px; z-index: 18; display: flex; flex-direction: column; align-items: flex-end; pointer-events: none; max-width: calc(100vw - 28px); }
#bubbles[hidden] { display: none; }
#bubbles .bb-line { display: flex; gap: 8px; justify-content: flex-end; flex-wrap: wrap; pointer-events: auto; }
#bubbles .bub { position: relative; padding-top: 10px; }
#bubbles .bub::before { content: ''; position: absolute; top: 0; left: 50%; width: 1px; height: 10px; background: linear-gradient(var(--accent), color-mix(in srgb, var(--accent) 30%, transparent)); }   /* 悬挂线 */
#bubbles .bub-b { position: relative; width: 42px; height: 42px; padding: 0; display: grid; place-items: center; color: var(--accent); border: 1px solid color-mix(in srgb, var(--accent) 70%, transparent); border-radius: 0;
  background: linear-gradient(160deg, color-mix(in srgb, var(--card) 88%, var(--accent)), color-mix(in srgb, var(--bg) 92%, transparent)); clip-path: polygon(8px 0, 100% 0, 100% calc(100% - 8px), calc(100% - 8px) 100%, 0 100%, 0 8px);
  box-shadow: inset 0 0 10px color-mix(in srgb, var(--accent) 22%, transparent); backdrop-filter: blur(6px); transition: transform .15s ease, box-shadow .15s ease; }
#bubbles .bub { animation: bubIn .3s ease-out; }   /* 只有新出现的气泡播入场（元素按 k 复用） */
#bubbles .bub-b:hover { transform: translateY(1px); box-shadow: inset 0 0 14px color-mix(in srgb, var(--accent) 40%, transparent); }
/* 选中的气泡：实色描边 + 外发光 + 下方指向下拉的小三角 */
#bubbles .bub.on .bub-b { transform: translateY(2px); border-color: var(--accent); background: linear-gradient(160deg, color-mix(in srgb, var(--card) 70%, var(--accent)), color-mix(in srgb, var(--bg) 85%, var(--accent))); box-shadow: inset 0 0 16px color-mix(in srgb, var(--accent) 60%, transparent), 0 0 10px color-mix(in srgb, var(--accent) 45%, transparent); }
#bubbles .bub.on::after { content: ''; position: absolute; left: 50%; bottom: -7px; transform: translateX(-50%); border: 5px solid transparent; border-top-color: var(--accent); }
#bubbles .bub.sum.on .bub-b { border-color: var(--e); box-shadow: inset 0 0 16px color-mix(in srgb, var(--e) 55%, transparent), 0 0 10px color-mix(in srgb, var(--e) 45%, transparent); } #bubbles .bub.sum.on::after { border-top-color: var(--e); }
#bubbles .bub-b svg { width: 22px; height: 22px; }
#bubbles .bub-n { position: absolute; right: 2px; bottom: 1px; min-width: 14px; padding: 0 2px; font: 700 10.5px/14px var(--mono); color: var(--bg); background: var(--accent); text-align: center; }
#bubbles .bub-b .rdot { position: absolute; top: 3px; right: 3px; margin: 0; }
#bubbles .bub.sum .bub-b { color: var(--e); border-color: color-mix(in srgb, var(--e) 70%, transparent); } #bubbles .bub.sum .bub-n { background: var(--e); }
@keyframes bubIn { from { opacity: 0; transform: translateY(-8px); } to { opacity: 1; transform: none; } }
#bubbles .bub-dd { pointer-events: auto; margin-top: 8px; width: min(380px, calc(100vw - 28px)); max-height: min(60vh, 520px); overflow: auto; padding: 8px 10px; background: linear-gradient(var(--card), var(--card)), var(--bg); backdrop-filter: blur(8px); border: 1px solid var(--line2); border-top: 2px solid var(--accent); box-shadow: var(--shadow); animation: bubIn .2s ease-out; }   /* 底下垫一层 --bg：卡片色半透明时背后的页面不透出来 */
#bubbles .bb-h { display: flex; align-items: baseline; justify-content: space-between; gap: 8px; font-weight: 700; margin-bottom: 6px; } #bubbles .bb-h small { font-weight: 400; color: var(--ink2); font-size: 11px; }
/* 分类收纳栏：三角箭头（展开时转 90°）+ 高度动画展开（grid 0fr → 1fr） */
#bubbles .bb-cat { margin: 2px 0; }
#bubbles .bb-cat-h { width: 100%; display: flex; align-items: center; gap: 8px; padding: 6px 6px; margin: 0; border: 0; border-radius: 0; background: none; color: var(--accent); font: inherit; font-size: 12.5px; text-align: left; cursor: pointer; transition: background .15s, box-shadow .15s; }
#bubbles .bb-cat-h:hover { background: color-mix(in srgb, var(--accent) 10%, transparent); box-shadow: inset 2px 0 0 var(--accent); }
#bubbles .bb-cat.open > .bb-cat-h { background: color-mix(in srgb, var(--accent) 7%, transparent); }
#bubbles .bb-cat-h b { margin-left: auto; font-family: var(--mono); }
#bubbles .bb-tri { flex: none; width: 0; height: 0; border-left: 6px solid currentColor; border-top: 4px solid transparent; border-bottom: 4px solid transparent; transition: transform .22s ease; }
#bubbles .bb-cat.open .bb-tri { transform: rotate(90deg); }
#bubbles .bb-body { display: grid; grid-template-rows: 0fr; opacity: 0; transition: grid-template-rows .24s ease, opacity .2s ease; }
#bubbles .bb-body > div { min-height: 0; overflow: hidden; padding-left: 14px; }
#bubbles .bb-cat.open .bb-body { grid-template-rows: 1fr; opacity: 1; }
#bubbles .bb-row { display: flex; align-items: center; justify-content: space-between; gap: 8px; padding: 5px 4px; border-bottom: 1px dashed var(--line); font-size: 12.5px; }
#bubbles .bb-row { transition: background .15s, box-shadow .15s; }
#bubbles .bb-row.new { background: color-mix(in srgb, var(--accent) 8%, transparent); }
#bubbles .bb-row:hover { background: color-mix(in srgb, var(--accent) 13%, transparent); box-shadow: inset 2px 0 0 var(--accent); }
#bubbles .bb-n { min-width: 0; } #bubbles .bb-nm { display: flex; align-items: center; gap: 6px; white-space: nowrap; } #bubbles .bb-nm small { flex: none; margin-left: 0; }   /* 好友行：截断式名牌 + 亲密度不换行 */ #bubbles .bb-n small { margin-left: 6px; color: var(--ink2); font-size: 11px; }
#bubbles .bb-a { display: flex; flex-wrap: wrap; gap: 4px; justify-content: flex-end; flex: none; max-width: 62%; }
/* 训练按钮旁的「每回合自动」 */
.auto-tr { display: inline-flex; align-items: center; gap: 3px; margin: 0 6px; font-size: 11.5px; color: var(--ink2); white-space: nowrap; cursor: pointer; } .auto-tr input { margin: 0; }
.gb-row.gb-s { display: flex; align-items: center; gap: 10px; padding: 5px 2px; border-bottom: 1px dashed var(--line); } .gb-row.gb-s .sk-more { margin-left: auto; }   /* 小组对抗战绩：一行一场 */
#bubbles .bub-dd.out { animation: bubOut .18s ease-in forwards; pointer-events: none; }
@keyframes bubOut { to { opacity: 0; transform: translateY(-6px); } }
#cls-aff-card, #cls-posts-card, #cls-pol-card, .cls-pols { scroll-margin-top: 150px; }   /* 气泡跳转时不被顶栏挡住 */
/* 气泡和下拉一律靠左（手机、PC 都一样；用户多次强调）；有气泡时页首留出一行余白放气泡，不压住内容 */
#bubbles { left: 14px; right: auto; align-items: flex-start; } #bubbles .bb-line { justify-content: flex-start; }
body.has-bub main.cols { padding-top: 62px; }

/* ===================== 亲密关系（人际页：姐妹契约 / 室友·寝室 / 背包，ui_bonds.js） ===================== */
/* 子页按钮行与背包分类按钮行：选中态沿用 .mini.on */
.bd-tabs, .bd-cats { gap: 4px; margin: 0 0 10px; }
.bd-tabs .mini, .bd-cats .mini { margin-left: 0; }
.bd-cats { margin-bottom: 4px; }
.bd-tabs .mini .rdot { margin-left: 3px; vertical-align: 1px; }
.bd-card .hint.dn { color: var(--bad); }
.bd-card .hint.up { color: var(--g); }
.bd-card .hint.up .mini { margin-left: 6px; }
/* 本校制度 */
.bd-sys { border: 1px solid var(--line); border-radius: 4px; padding: 6px 10px; background: var(--card2); margin-bottom: 8px; }
.bd-sys .kv:last-of-type { border-bottom: 0; }
.bd-tk { display: inline-flex; align-items: center; gap: 6px; }
/* 成员卡：头像名字 + 角色小字 + 按钮 */
.bd-mem { display: flex; flex-wrap: wrap; gap: 6px; margin: 4px 0 6px; }
.bd-m { display: flex; align-items: center; gap: 8px; flex: 0 0 250px; width: 250px; min-width: 0; max-width: 100%; border: 1px solid var(--line); border-radius: 4px; padding: 5px 8px; background: var(--card2); font-size: 13px; }
.bd-m:hover { border-color: var(--accent); }
.bd-m > small { color: var(--accent); font-size: 11px; white-space: nowrap; }
.bd-m > .mini { margin-left: auto; flex: none; }
/* 姐妹式的义姐 → 义妹串 */
.bd-chain { display: flex; flex-wrap: wrap; align-items: center; gap: 4px; margin: 6px 0; padding: 6px 8px; border-left: 3px solid var(--accent2); background: color-mix(in srgb, var(--accent2) 6%, transparent); border-radius: 0 4px 4px 0; font-size: 13px; }
/* 校内其他契约 / 摆出来的东西（折叠） */
.bd-others, .bd-placed { margin: 8px 0; border: 1px solid var(--line); border-radius: 4px; padding: 4px 8px; background: var(--card2); }
.bd-others summary, .bd-placed summary { cursor: pointer; font-size: 12.5px; color: var(--accent); }
.bd-og { display: flex; flex-wrap: wrap; align-items: center; gap: 4px; padding: 4px 0; border-bottom: 1px dashed var(--line); font-size: 12.5px; }
.bd-og:last-child { border-bottom: 0; }
/* 一行：像素图 名字 效果 按钮 */
.bd-it-row { display: flex; align-items: center; gap: 8px; padding: 4px 0; border-bottom: 1px dashed var(--line); font-size: 12.5px; }
.bd-it-row:last-child { border-bottom: 0; }
.bd-it-row > span:not(.bd-itn) { flex: none; }
.bd-it-row > small { flex: 1 1 auto; min-width: 0; font-size: 11px; }
.bd-it-row > .mini { margin-left: auto; flex: none; }
/* 背包格子：像素图 + 文字 + 按钮；.on = 已摆出 */
.bd-bag { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(240px, 100%), 1fr)); gap: 6px; margin: 6px 0; }
.bd-b { display: flex; align-items: center; gap: 8px; border: 1px solid var(--line); border-radius: 4px; padding: 6px 8px; background: var(--card2); min-width: 0; }
.bd-b:hover { border-color: var(--line2); }
.bd-b.on { border-color: var(--accent); box-shadow: 0 0 0 1px var(--accent) inset, 0 0 8px var(--glow); }
.bd-bi { display: flex; flex-direction: column; min-width: 0; flex: 1 1 auto; line-height: 1.4; }
.bd-bi b { font-weight: 500; font-size: 13px; }
.bd-bi small { font-size: 11px; }
.bd-b > .mini { margin-left: auto; flex: none; }
/* 像素图 */
img.bd-spr { image-rendering: pixelated; flex: none; }
/* 人物卡上的契约 / 室友标签行 */
.bd-line { font-size: 11px; color: var(--accent2); margin-top: 2px; line-height: 1.5; }
.bd-line .pc-in { vertical-align: -4px; }
/* 寝室像素画：占位 + 常驻节点，最大 3 倍宽 */
.bd-room-slot { position: relative; width: 100%; max-width: 576px; margin: 6px auto 8px; }
.bd-room { position: relative; width: 100%; max-width: 576px; margin: 0 auto; overflow: hidden; border: 1px solid var(--line); border-radius: 4px; background: var(--bg2); touch-action: pan-y; isolation: isolate; }   /* isolation：物件的 z-index 只在寝室内部比较，不会盖到弹窗上 */
.bd-room img.bd-bg { position: absolute; inset: 0; width: 100%; height: 100%; display: block; image-rendering: pixelated; border: 0; border-radius: 0; background: none; pointer-events: none; z-index: 0; }
/* 摆在寝室里的物件（可拖动） */
.bd-room img.bd-it { position: absolute; height: auto; display: block; image-rendering: pixelated; border: 0; border-radius: 0; background: none; cursor: grab; touch-action: none; user-select: none; -webkit-user-select: none; -webkit-user-drag: none; transition: transform .12s, filter .12s; }
.bd-room img.bd-it:hover { filter: drop-shadow(0 0 2px var(--accent)); }
.bd-room img.bd-it.mate { filter: drop-shadow(0 0 1px color-mix(in srgb, var(--accent2) 70%, transparent)); }
.bd-room img.bd-it.mate:hover { filter: drop-shadow(0 0 2px var(--accent2)); }
.bd-room img.bd-it.drag { cursor: grabbing; transform: scale(1.06); filter: drop-shadow(0 4px 4px rgba(0, 0, 0, .35)); z-index: 999 !important; transition: none; }
/* 电脑的可点击透明热区：高于背景，低于物件 */
.bd-room .bd-pc { position: absolute; display: block; z-index: 5; cursor: pointer; border-radius: 2px; outline: 1px solid transparent; transition: outline-color .15s, box-shadow .15s; }
.bd-room .bd-pc:hover { outline-color: var(--accent); box-shadow: 0 0 8px var(--glow), 0 0 0 1px var(--accent) inset; }
@media (max-width: 760px) {
  .bd-mem { flex-direction: column; }
  .bd-m { flex: 1 1 auto; max-width: none; }
  .bd-bag { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .bd-b { flex-wrap: wrap; }
  .bd-b > .mini { margin-left: 0; width: 100%; }
  .bd-room-slot, .bd-room { max-width: 100%; }
}

/* ===== 亲密关系面板 v2（ui_bonds.js）===== */
.bd-subtabs { margin: 0 0 10px; border-bottom: none; border-radius: 6px; }   /* 和 Garden 页同一套子页签 */
.bd-subtabs .rdot { margin-left: 4px; }
.bd-share { margin: 6px 0 10px; }
/* 寝室：床上的两个人（眨眼 / 点头，和教室同一套动画） */
.bd-room .bd-p { position: absolute; display: block; z-index: 4; pointer-events: none; animation-name: crNod; animation-iteration-count: infinite; animation-timing-function: steps(1, end); }
.bd-room .bd-p img { display: block; width: 100%; image-rendering: pixelated; border: none; background: none; border-radius: 0; box-shadow: none; }
.bd-room .bd-p .cr-bk { position: absolute; inset: 0; opacity: 0; animation-name: crBlink; animation-iteration-count: infinite; animation-timing-function: steps(1, end); }
.bd-room a.bd-p { pointer-events: auto; cursor: pointer; } .bd-room a.bd-p:hover { filter: brightness(1.15) drop-shadow(0 0 2px var(--accent)); }
/* 默认模式：物件不能拖、不挡电脑；电脑上浮动的「购物网站」提示 */
.bd-room:not(.edit) img.bd-it { pointer-events: none; cursor: default; }
.bd-room .bd-shop-tip { position: absolute; z-index: 300; transform: translate(-50%, -100%); padding: 2px 7px; font-size: 11px; line-height: 16px; white-space: nowrap; color: #061016; background: var(--accent); border-radius: 3px; box-shadow: 0 2px 6px rgba(0, 0, 0, .3); cursor: pointer; text-decoration: none; animation: bdTip 1.6s ease-in-out infinite; }
.bd-room .bd-shop-tip::after { content: ''; position: absolute; left: 50%; top: 100%; transform: translateX(-50%); border: 4px solid transparent; border-top-color: var(--accent); }
.bd-room .bd-shop-tip .rdot { margin-left: 3px; }
.bd-room .bd-shop-tip:hover { filter: brightness(1.12); }
@keyframes bdTip { 0%, 100% { transform: translate(-50%, -100%); } 50% { transform: translate(-50%, calc(-100% - 4px)); } }
@media (prefers-reduced-motion: reduce) { .bd-room .bd-shop-tip { animation: none; } }
/* 右上角「物品编辑」开关 */
.bd-room .bd-edit-t { position: absolute; z-index: 400; top: 6px; right: 6px; display: inline-flex; align-items: center; gap: 6px; padding: 3px 8px; font-size: 11px; color: var(--ink); background: color-mix(in srgb, var(--card) 88%, transparent); border: 1px solid var(--line2); border-radius: 12px; backdrop-filter: blur(4px); }
.bd-room .bd-edit-t .sw { position: relative; width: 22px; height: 12px; border-radius: 6px; background: var(--line2); transition: background .15s; }
.bd-room .bd-edit-t .sw::after { content: ''; position: absolute; top: 2px; left: 2px; width: 8px; height: 8px; border-radius: 50%; background: var(--bg); transition: transform .15s; }
.bd-room .bd-edit-t.on { border-color: var(--accent); color: var(--accent); } .bd-room .bd-edit-t.on .sw { background: var(--accent); } .bd-room .bd-edit-t.on .sw::after { transform: translateX(10px); }
/* 编辑模式：物件下方的标签（名字 · 主人 · 效果） */
.bd-room.edit { outline: 1px dashed color-mix(in srgb, var(--accent) 60%, transparent); outline-offset: -3px; }
.bd-room .bd-tag { position: absolute; z-index: 200; transform: translate(-50%, 1px); max-width: 34%; padding: 0 4px; font-size: 9.5px; line-height: 13px; color: #fff; background: rgba(10, 16, 24, .78); border-radius: 3px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; pointer-events: none; }
.bd-room .bd-tag.mate { background: color-mix(in srgb, var(--accent2) 70%, rgba(10, 16, 24, .8)); }
.bd-room .bd-tag i { font-style: normal; color: #9ff0b0; }
@media (max-width: 520px) { .bd-room .bd-tag { font-size: 8px; line-height: 11px; } .bd-room .bd-edit-t { font-size: 10px; padding: 2px 6px; } }
/* 寝室等级 · 摆放数 · 升级按钮（贴着放，按钮里写词条） */
.bd-roombar { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 12px; margin: 2px 0 6px; font-size: 13px; }
.bd-roombar .bd-up { margin-left: 0; display: inline-flex; align-items: center; gap: 6px; }
.bd-mod { font-size: 12px; }   /* 升级按钮后面的词条：纯文字，不做成框（不然看着像第二个按钮） */
/* 家具管理：左右两栏 */
.bd-fgrid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; margin-top: 6px; }
.bd-fcol { min-width: 0; }
.bd-fh { font-size: 12px; color: var(--ink2); padding-bottom: 3px; border-bottom: 1px solid var(--line); }
.bd-it-row > .bd-itn { display: flex; flex-direction: column; min-width: 0; flex: 1 1 auto; line-height: 1.35; } .bd-itn b { font-weight: 500; font-size: 12.5px; } .bd-itn small { font-size: 10.5px; }
@media (max-width: 620px) { .bd-fgrid { grid-template-columns: 1fr; } }
/* 寝室床头的名牌 */
.bd-room .bd-plate { position: absolute; z-index: 6; transform: translate(-50%, 0); padding: 0 2px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; text-align: center; font-size: clamp(7px, 1.25vw, 11px); line-height: 1.35; color: #3a2614; background: #f3e4c4; border: 1px solid #7a4a2a; border-radius: 2px; box-shadow: 0 1px 0 rgba(0, 0, 0, .25); pointer-events: none; }
/* 战斗：固有技 / 异能的发动按钮 */
.bt-rab.bt-iab { border-color: #e0b84a; color: #e0b84a; } .bt-rab.bt-aab { border-color: #c36be0; color: #c36be0; }
/* 技能页：固有技一栏 */
.inh-b { margin-top: 6px; padding: 5px 8px; border-left: 3px solid #e0b84a; background: color-mix(in srgb, #e0b84a 8%, transparent); font-size: 12.5px; border-radius: 0 4px 4px 0; }
/* 固有技框统一黄色（已觉醒 / 未觉醒 / 预览同一样式） */
.inh-b .desc { margin: 3px 0 0; }
/* 测试控制台 · 技能菜单 */
.dev-r { padding: 6px 0; border-bottom: 1px dashed var(--line); } .dev-r > b { display: block; font-size: 12px; margin-bottom: 4px; } .dev-r > div { display: flex; flex-wrap: wrap; gap: 4px; } .dev-r .mini { margin: 0; }
/* 切磋 / 对决的进度条（spar.js）：左边她、右边你，记号所在的格子高亮 */
.spar-bar { display: flex; align-items: center; gap: 10px; margin: 8px 0 4px; }
.spar-bar .sp-side { display: flex; flex-direction: column; min-width: 4.5em; font-size: 12.5px; font-weight: 600; } .spar-bar .sp-side.me { align-items: flex-end; text-align: right; } .spar-bar .sp-side small { font-weight: 400; font-size: 10.5px; }
.spar-bar .sp-cells { flex: 1; display: flex; gap: 4px; }
.spar-bar .sp-cells i { flex: 1; height: 16px; border: 1px solid var(--line2); border-radius: 3px; background: var(--card2); transition: background .25s, box-shadow .25s; }
.spar-bar .sp-cells i.me { background: color-mix(in srgb, var(--accent) 35%, transparent); } .spar-bar .sp-cells i.her { background: color-mix(in srgb, var(--bad) 30%, transparent); }
.spar-bar .sp-cells i.on { border-color: var(--ink); box-shadow: 0 0 0 1px var(--ink) inset, 0 0 8px var(--glow); }
/* 「当前 → 下一级」两列一览（ui.lvCols）：左列当前竖向逐行，右列下一级 */
.lv2c { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 1px 14px; font-size: 11.5px; line-height: 1.7; align-items: baseline; }
.lv2c.one { grid-template-columns: minmax(0, 1fr); }
.lv2c .lv2h { font-size: 10.5px; color: var(--ink2); border-bottom: 1px solid var(--line); margin-bottom: 1px; }
.lv2c .lv2b { text-align: right; white-space: nowrap; } .lv2c .lv2h:nth-child(2) { text-align: right; }
.lv2c .lv2b .up, .lv2c .lv2b .dn { opacity: .85; }
/* 「每回合自动」：轻科幻开关（原生 checkbox 换外观，点击 / 数据不变）——斜切角轨道 + 方形滑块，打开时亮起强调色并发光 */
.auto-tr input[type=checkbox] { -webkit-appearance: none; appearance: none; position: relative; flex: none; width: 28px; height: 14px; margin: 0 2px 0 0; cursor: pointer; vertical-align: -2px;
  border: 1px solid color-mix(in srgb, var(--accent) 45%, var(--line2)); background: color-mix(in srgb, var(--bg) 70%, transparent); clip-path: polygon(4px 0, 100% 0, 100% calc(100% - 4px), calc(100% - 4px) 100%, 0 100%, 0 4px);
  transition: background .2s, border-color .2s, box-shadow .2s; }
.auto-tr input[type=checkbox]::before { content: ''; position: absolute; top: 2px; left: 2px; width: 8px; height: 8px; background: var(--ink2); clip-path: polygon(2px 0, 100% 0, 100% calc(100% - 2px), calc(100% - 2px) 100%, 0 100%, 0 2px); transition: transform .22s cubic-bezier(.4, 0, .2, 1), background .2s, box-shadow .2s; }
.auto-tr input[type=checkbox]::after { content: ''; position: absolute; top: 50%; right: 4px; width: 5px; height: 1px; background: color-mix(in srgb, var(--ink2) 60%, transparent); transition: opacity .2s; }   /* 关闭时右侧的一道刻线 */
.auto-tr input[type=checkbox]:checked { border-color: var(--accent); background: color-mix(in srgb, var(--accent) 22%, transparent); box-shadow: inset 0 0 6px color-mix(in srgb, var(--accent) 45%, transparent), 0 0 6px color-mix(in srgb, var(--accent) 35%, transparent); }
.auto-tr input[type=checkbox]:checked::before { transform: translateX(14px); background: var(--accent); box-shadow: 0 0 6px var(--accent); }
.auto-tr input[type=checkbox]:checked::after { opacity: 0; }
.auto-tr input[type=checkbox]:focus-visible { outline: 1px solid var(--accent); outline-offset: 2px; }
.auto-tr:has(input:checked) { color: var(--accent); }
@media (prefers-reduced-motion: reduce) { .auto-tr input[type=checkbox], .auto-tr input[type=checkbox]::before { transition: none; } }
.fr .fi .fr-sub { display: block; color: var(--ink2); }   /* 好友卡：学年 · 职责 · 稀有技能单独一行（不和身份徽章、学校挤在一起） */
/* 两列网格（ui.lvGrid）：每格「字段名 + 数值」，左右两列各自独立；「▸ 下一级」在最后一行（ui.nextBtn） */
.lv2g { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1px 12px; font-size: 11.5px; line-height: 1.7; }
.lv2g > div { min-width: 0; }
.lv2n { margin-top: 2px; font-size: 11.5px; } .lv2n .sk-more { cursor: pointer; font-size: 11.5px; }
.sk-info { margin: 0 0 3px; color: var(--ink2); }
/* 两列字段：每格「字段名 数值」紧挨着，左右两列各自独立；.wide 占整行（全站独立字段一览统一用这个，加总明细不用） */
.md-sep { margin: 6px 0 2px; padding-top: 5px; border-top: 1px dashed var(--line); font-size: 11.5px; color: var(--ink2); letter-spacing: .05em; }
.hv-rows.kv2 { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); column-gap: 18px; row-gap: 2px; }
.hv-rows.kv2 > .md-r { justify-content: flex-start; gap: 6px; }
.hv-rows.kv2 > .wide { grid-column: 1 / -1; } .hv-rows.kv2 > .md-r.wide > span:last-child { white-space: normal; font-family: inherit; }
#hov .hv-rows.kv2 .md-r { gap: 6px; }
.act-d { margin: 4px 0; line-height: 1.6; color: var(--ink); } .lv2g > div:has(> .act-d) { grid-column: 1 / -1; } .lv2g .act-d { margin: 0; }
.sk-bdg { margin-left: 6px; padding: 0 5px; border-radius: 3px; font-size: 10px; font-weight: 600; vertical-align: 1px; color: #f0a35e; border: 1px solid rgba(240,163,94,.55); background: rgba(240,163,94,.1); }
.sk-bdg.pas { color: #6fb6d9; border-color: rgba(111,182,217,.55); background: rgba(111,182,217,.1); } .sk-info .lv2g { font-size: 11px; }
.hv-t + .lv2g { margin-top: 4px; }

/* 首页加载进度条（index.html 内联脚本驱动） */
#boot-load { min-height: 70vh; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 12px; color: var(--ink); }
#boot-load b { font-size: 22px; letter-spacing: .2em; }
#boot-load .bl-bar { width: min(320px, 70vw); height: 4px; background: var(--line); border-radius: 2px; overflow: hidden; }
#boot-load .bl-bar i { display: block; height: 100%; width: 0; background: var(--accent); transition: width .2s; }
#boot-load small { font-family: var(--mono); color: var(--ink2); letter-spacing: .15em; }

/* CHARM 耐久行：数字不挤出右边；送修按钮跟在后面 */
.stat.dur-row { grid-template-columns: 82px 1fr auto; } .stat.dur-row.has-btn { grid-template-columns: 82px 1fr auto auto; } .dur-row .mini { white-space: nowrap; }
.bd-parts { margin-top: 8px; } .bd-parts > summary { cursor: pointer; font-weight: 600; font-size: 12.5px; padding: 4px 0; }
.ch-btns { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; max-width: 560px; margin: 10px auto 0; }
.ch-bb { display: flex; flex-direction: column; align-items: center; gap: 2px; padding: 10px 8px; min-height: 58px; } .ch-bb b { font-size: 14px; } .ch-bb small { font-size: 11px; color: var(--ink2); font-weight: 400; line-height: 1.35; text-align: center; }
/* 悬停窗里的长说明字段：字段名一行，说明在下方正常换行（Nest 之主等） */
.hv-defs { display: flex; flex-direction: column; gap: 6px; max-width: 360px; } .hv-def > b { display: block; font-size: 11.5px; margin-bottom: 1px; } .hv-def > div { font-size: 12px; line-height: 1.55; }
.lord-w { display: flex; flex-wrap: wrap; gap: 4px; margin: 2px 0; } .lord-w span { display: flex; flex-direction: column; align-items: center; min-width: 44px; padding: 2px 4px; border: 1px solid var(--line); border-radius: 3px; } .lord-w small { font-size: 10px; color: var(--ink2); } .lord-w b { font-family: var(--mono); font-size: 12px; }
.fgc-skt { text-align: center; font-size: 11.5px; font-weight: 700; color: var(--ink2); letter-spacing: .1em; margin: 4px 0 -2px; }   /* 阵型卡：技能轨道上方的「阵型技能」小标题 */
.bd-b > .tag { white-space: nowrap; flex: none; }
.ch-bb .dn { color: var(--bad); font-weight: 600; } .ch-bb .up { color: var(--g); }
.spar-res { margin: 6px 0 0; font-size: 13px; }   /* 切磋 / 对决结算的数值行 */
.bd-dur { display: grid; grid-template-columns: auto 1fr auto; align-items: center; gap: 6px; margin-top: 3px; } .bd-dur small { font-size: 10.5px; color: var(--ink2); font-family: var(--mono); }   /* 背包 CHARM：耐久进度条 */
/* 下划线名词（技能 / 固有技 / 异能 / 战技 / 职责 / 理念等条目名）统一晶蓝色；词条名（.md-k）与战斗名词（.term）保持白字 */
.ent-k:not(.term), a.npc-link[data-hov^="wsk:"] { color: var(--accent); }
.ent-k:not(.term) { border-bottom-color: color-mix(in srgb, var(--accent) 55%, transparent); }
.tags .ent-k:not(.term) { color: inherit; border-bottom-color: transparent; }   /* 性格标签是带框小标签，不算下划线名词 */
.ent-sec .hv-rows.kv2 + .ent-lv { margin-top: 6px; } .ent-lv .act-d { margin: 0; flex-basis: 100%; }
.md-gap { height: 0; border-top: 1px dashed var(--line); margin: 6px 0 5px; }   /* 明细里分隔天赋值与属性构成 */
/* 技能信息（MAGI 消耗 / 冷却 / 持续 / 对象）：凹槽底，和下面的效果词条区分开（技能卡、技能面板、固有技 / 异能面板共用） */
.sk-spec { background: color-mix(in srgb, var(--ink) 6%, transparent); box-shadow: inset 0 1px 3px rgba(0,0,0,.28), inset 0 0 0 1px color-mix(in srgb, var(--line) 70%, transparent); border-radius: 4px; padding: 5px 8px; margin: 3px 0 6px; }
/* 异能面板末尾的觉醒规则：字色透明（亮暗主题都和背景同色），拖选时才显示出来 */
.ab-secret { color: transparent; font-size: 12px; line-height: 1.7; min-height: 4.5em; } .ab-secret.sk-spec { margin: 2px 0 10px; padding: 8px 10px; }
.ab-secret::selection { color: var(--ink); background: var(--glow); }
.ab-secret ul { margin: 2px 0 6px; padding-left: 1.4em; } .ab-secret li { margin: 1px 0; } .ab-secret b { color: transparent; }
.ab-secret b::selection, .ab-secret li::selection { color: var(--ink); background: var(--glow); }
.bul { display: block; } .bul-i { display: block; position: relative; padding-left: 1em; margin: 1px 0; } .bul-i::before { content: '·'; position: absolute; left: .25em; color: var(--accent); font-weight: 700; }   /* 列举类长说明拆成的清单 */
.ab-hold { margin: 4px 0 0; font-size: 12px; } .ab-hold .dim { margin-right: 4px; }   /* 异能的原作持有者 */

/* 训练方针 · 每月训练（2026-10-22）：可自动训练的各项用 flex 卡片罗列；下方统一的自动训练开关（.auto-tr） */
.mt-sec { margin-top: 10px; } .mt-sec > h5 { margin: 0 0 6px; font-size: 12.5px; } .mt-sec > h5 small { margin-left: 8px; font-weight: 400; color: var(--ink2); font-size: 11px; }
.mt-list { display: flex; flex-wrap: wrap; gap: 6px; }   /* 卡片统一宽度 */
.mt-card { flex: 0 0 188px; width: 188px; min-width: 0; display: flex; flex-direction: column; gap: 4px; padding: 6px 8px; border: 1px solid var(--line2); border-radius: 4px; font-size: 12px; }
.mt-card.on { border-color: var(--accent); box-shadow: inset 0 0 6px color-mix(in srgb, var(--accent) 25%, transparent); }
.mt-card .mt-m { display: flex; align-items: center; justify-content: space-between; gap: 6px; } .mt-card .mt-n { font-weight: 500; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.mt-card .mt-r { display: flex; align-items: center; justify-content: space-between; gap: 6px; font-family: var(--mono); }
.mt-card .mt-a .auto-tr { margin: 0; }
@media (max-width: 760px) { .mt-card { flex-basis: calc(50% - 3px); width: calc(50% - 3px); } }
.auto-tr.dis { opacity: .45; cursor: not-allowed; } .auto-tr.dis input { cursor: not-allowed; }

/* 人际页好友卡改成 flex 等宽小卡（2026-10-22）：压缩体积，信息不变 */
.friends { display: flex !important; flex-wrap: wrap; gap: 6px; }
.friends > .fr { flex: 0 0 232px; width: 232px; min-width: 0; flex-direction: column; align-items: stretch; gap: 3px; padding: 6px 7px; font-size: 12px; }
.fr > .fr-h { display: flex; align-items: center; gap: 6px; min-width: 0; padding-right: 16px; }
.fr > .fr-h > b { font-size: 13px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; min-width: 0; }
.fr > .fi { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.fr > .fi > small { line-height: 1.35; }
.fr .tags { display: flex; flex-wrap: wrap; gap: 2px 4px; font-size: 11px; }
.fr .fl { font-size: 11px; gap: 4px; }
.fr .fb-sec { font-size: 11px; }
.fr .fr-ft { display: flex; align-items: center; justify-content: space-between; gap: 6px; margin-top: 2px; min-width: 0; }
.fr .fr-ft > small { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; min-width: 0; }
.fr .fr-ft > .fr-act { flex: none; font-size: 11px; padding: 1px 8px; }
@media (max-width: 760px) { .friends > .fr { flex-basis: calc(50% - 3px); width: calc(50% - 3px); } }
@media (max-width: 420px) { .friends > .fr { flex-basis: 100%; width: 100%; } }
/* 右栏好友列表：和人际页同一种 flex 等宽卡片；栏宽不够一张时缩到栏宽 */
.flist .friends { margin-top: 4px; } .friends > .fr { max-width: 100%; }
.fr .fr-ft > .fb-sec { min-width: 0; flex: 1 1 auto; }
.fr .fr-act { position: relative; } .fr .fr-act > .rdot { position: absolute; top: -3px; right: -3px; }
.fr .fb-sec, .fr .fb-sec *:not(.sk-more) { font-size: 10px; } .fr .fb-sec { white-space: nowrap; }   /* 好友卡：加成（属性名 + 数值）缩小、不换行，「明细」不变 */
.mt-more { margin-top: 6px; } .mt-more > summary { cursor: pointer; font-size: 12px; color: var(--accent); }   /* 「可用训练」晶蓝色 */ .mt-more > summary .dim { font-family: var(--mono); margin-left: 4px; } .mt-more > .mt-list { margin-top: 6px; }

/* 阶段说明（stageintro.js）：条目逐条滑入 */
.si-list{margin:6px 0 8px;padding-left:1.2em}.si-list li{margin:4px 0;line-height:1.65;animation:siIn .42s cubic-bezier(.2,.9,.25,1) both}
.si-list li::marker{color:var(--accent)}
@keyframes siIn{from{opacity:0;transform:translateX(-10px)}to{opacity:1;transform:none}}
@media (prefers-reduced-motion:reduce){.si-list li{animation:none}}

/* 结局：一生回顾（分章，lifestory.js）与一览图 / 分享按钮 */
.end-acts{margin-top:10px;gap:8px;flex-wrap:wrap}
.life-rev .lr-ch{display:grid;grid-template-columns:118px 1fr;gap:14px;padding:12px 0;border-bottom:1px dashed var(--line);animation:lrIn .6s cubic-bezier(.2,.9,.25,1) both}
.life-rev .lr-ch:last-of-type{border-bottom:0}
.life-rev .lr-age{font-family:var(--mono);font-size:26px;white-space:nowrap;line-height:1;color:var(--accent);text-shadow:-1.5px 0 rgba(255,40,120,.35),1.5px 0 rgba(40,200,255,.35)}
.life-rev .lr-age small{font-size:12px;margin-left:2px;color:var(--ink2)}
.life-rev h4{margin:0 0 4px;font-size:14px;letter-spacing:.08em}
.life-rev p{margin:0;line-height:1.95}
.life-rev .lr-epi{margin:12px 0 0;padding:10px 14px;border-left:3px solid var(--accent);font-style:italic;line-height:1.9;background:color-mix(in srgb,var(--accent) 6%,transparent)}
@keyframes lrIn{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}
@media (max-width:560px){.life-rev .lr-ch{grid-template-columns:56px 1fr}.life-rev .lr-age{font-size:22px}}
@media (prefers-reduced-motion:reduce){.life-rev .lr-ch{animation:none}}

/* ================= 全局动效（ui_fx.js；参考 mg-styles-15：霓虹辉光 / 扫描线 / 色偏 / 擦除入场，只动 transform 与 opacity）================= */
/* 切换页签：卡片错落入场（擦除 + 上浮），只在 .ui-swap 存在的 0.65 秒内 */
#tab-body.ui-swap > *, #tab-body.ui-swap .card { animation: fxIn .5s cubic-bezier(.2,.9,.25,1) both; }
#tab-body.ui-swap > *:nth-child(2) { animation-delay: .05s; } #tab-body.ui-swap > *:nth-child(3) { animation-delay: .1s; }
#tab-body.ui-swap > *:nth-child(4) { animation-delay: .15s; } #tab-body.ui-swap > *:nth-child(n+5) { animation-delay: .2s; }
@keyframes fxIn { from { opacity: 0; transform: translateY(10px); clip-path: inset(0 0 35% 0); } to { opacity: 1; transform: none; clip-path: inset(0 0 0 0); } }
/* 按钮：按下回弹；大按钮点击时从点击处扩散一圈光 */
button:active:not(:disabled) { transform: translateY(1px) scale(.985); }
.cta, .choices button, .wbtn, .ai, .go button { position: relative; overflow: hidden; }
.fx-ripple { position: absolute; border-radius: 50%; pointer-events: none; background: radial-gradient(circle, color-mix(in srgb, var(--accent) 45%, transparent) 0, transparent 60%); transform: scale(0); animation: fxRip .6s ease-out forwards; }
@keyframes fxRip { to { transform: scale(1); opacity: 0; } }
/* 主按钮：每隔几秒掠过一道光（合成波的镀铬感） */
.cta::after { content: ""; position: absolute; top: 0; bottom: 0; left: -40%; width: 30%; pointer-events: none; background: linear-gradient(105deg, transparent, rgba(255,255,255,.45), transparent); transform: skewX(-18deg) translateX(-120%); animation: fxSheen 5.5s ease-in-out infinite; }
@keyframes fxSheen { 0%, 70% { transform: skewX(-18deg) translateX(-120%); } 100% { transform: skewX(-18deg) translateX(520%); } }
/* 子页签：选中项下沿一条霓虹光条 */
.subtabs button { position: relative; }
.subtabs button::after { content: ""; position: absolute; left: 18%; right: 18%; bottom: -1px; height: 2px; background: var(--accent); box-shadow: 0 0 8px var(--accent); transform: scaleX(0); transition: transform .25s cubic-bezier(.2,.9,.25,1); }
.subtabs button.on::after { transform: scaleX(1); }
/* 卡片标题的光条：悬停时呼吸 */
.card:hover > h3::before { animation: fxPulse 1.6s ease-in-out infinite; }
@keyframes fxPulse { 50% { box-shadow: 0 0 14px var(--accent); transform: scaleY(1.25); } }
/* 首页：标题霓虹 + 色偏入场，选项卡错落出现 */
.home h1 { text-shadow: -2px 0 rgba(255,40,120,.25), 2px 0 rgba(40,200,255,.25), 0 0 24px var(--glow); animation: fxTitle 1s cubic-bezier(.2,1.2,.3,1) both; }
@keyframes fxTitle { from { opacity: 0; letter-spacing: .4em; filter: blur(4px); } to { opacity: 1; filter: none; } }
.home .h-opts > .opt { animation: fxIn .55s cubic-bezier(.2,.9,.25,1) both; }
.home .h-opts > .opt:nth-child(2) { animation-delay: .08s; } .home .h-opts > .opt:nth-child(3) { animation-delay: .16s; } .home .h-opts > .opt:nth-child(4) { animation-delay: .24s; }
.home .h-img img { animation: fxHero 1.2s ease-out both; }
@keyframes fxHero { from { opacity: 0; transform: scale(1.04); filter: saturate(.4) brightness(1.3); } to { opacity: 1; transform: none; filter: none; } }
/* 场景画面：极淡的扫描线 */
.scene-wrap::after { content: ""; position: absolute; z-index: 1; inset: 0; pointer-events: none; background: repeating-linear-gradient(0deg, rgba(0,0,0,.06) 0 1px, transparent 1px 3px); }
/* 弹窗选项：逐个滑入 */
#modal .choices button { animation: fxChoice .35s cubic-bezier(.2,.9,.25,1) both; }
#modal .choices button:nth-child(2) { animation-delay: .04s; } #modal .choices button:nth-child(3) { animation-delay: .08s; } #modal .choices button:nth-child(n+4) { animation-delay: .12s; }
#modal.keep .choices button { animation: none; }
#modal .choices button:disabled { animation: none; opacity: .4; }   /* 入场动画（fill both）停在 opacity 1，会盖掉 button:disabled 的置灰 */
@keyframes fxChoice { from { opacity: 0; transform: translateX(-8px); } to { opacity: 1; transform: none; } }
@media (prefers-reduced-motion: reduce) {
  #tab-body.ui-swap > *, #tab-body.ui-swap .card, .cta::after, .card:hover > h3::before, .home h1, .home .h-opts > .opt, .home .h-img img, #modal .choices button { animation: none !important; }
  button:active:not(:disabled) { transform: none; }
}

/* ============ 小标题：轻科幻（斜切色块 + 等宽字 + 渐隐刻度线）============ */
.card h4 { display: flex; align-items: center; gap: 8px; margin: 16px 0 8px; font-size: 11.5px; font-weight: 700; color: var(--accent); font-family: var(--mono); letter-spacing: .14em; text-transform: uppercase; }
.card h4::before { content: ""; flex: none; width: 14px; height: 8px; background: var(--accent); clip-path: polygon(0 0, 70% 0, 100% 100%, 30% 100%); box-shadow: 0 0 8px var(--glow); }
.card h4::after { content: ""; flex: 1; min-width: 20px; height: 1px; background: linear-gradient(90deg, color-mix(in srgb, var(--accent) 60%, transparent), transparent 85%); }
.card h4 > small { order: 3; margin-left: 0; font-weight: 400; color: var(--ink2); letter-spacing: .02em; text-transform: none; font-size: 11px; }
.card h5 { margin: 12px 0 5px; font-size: 11.5px; color: var(--ink); letter-spacing: .06em; display: flex; align-items: center; gap: 6px; }
.card h5::before { content: ""; width: 5px; height: 5px; border: 1px solid var(--accent); transform: rotate(45deg); flex: none; }
.card .sk-sec h5::before { display: none; }

/* ============ 派系标签：图标 + 名字 + 下划线 ============ */
.fac-t { display: inline-flex; align-items: center; gap: 3px; white-space: nowrap; cursor: help; vertical-align: middle; }
.fac-t u { text-decoration: none; border-bottom: 1px dotted currentColor; }
.fac-ico { flex: none; vertical-align: -2px; }
.fac-t.fac-b { color: #c9524a; } .fac-t.fac-o { color: #b07a12; } .fac-t.fac-s { color: #3f7fd1; }
@media (prefers-color-scheme: dark) { :root:not([data-theme="light"]) .fac-t.fac-b { color: #f08178; } :root:not([data-theme="light"]) .fac-t.fac-o { color: #f0c062; } :root:not([data-theme="light"]) .fac-t.fac-s { color: #7fb2f5; } }
:root[data-theme="dark"] .fac-t.fac-b { color: #f08178; } :root[data-theme="dark"] .fac-t.fac-o { color: #f0c062; } :root[data-theme="dark"] .fac-t.fac-s { color: #7fb2f5; }

/* ============ 学生会：概要 ============ */
.cc-card .subtabs.cc-tabs { margin: 10px 0 12px; border: 1px solid var(--line); border-radius: 4px; }
.cc-sup { display: flex; gap: 8px; flex-wrap: wrap; font-size: 12px; } .cc-low { color: var(--dn, #d24a4a); }
.cc-r { display: grid; grid-template-columns: minmax(6em, 1fr) minmax(8em, 2fr) auto; gap: 6px; align-items: center; padding: 4px 0; border-bottom: 1px solid color-mix(in srgb, var(--line) 60%, transparent); }
@media (max-width: 640px) { .cc-r { grid-template-columns: 1fr; } }
.cc-tag { font-size: 10.5px; padding: 0 5px; border-radius: 4px; background: color-mix(in srgb, var(--accent) 16%, transparent); color: var(--accent); margin-left: 4px; white-space: nowrap; font-weight: 400; }
.cc-pos, .cc-adv { display: flex; flex-wrap: wrap; gap: 6px 22px; padding: 8px 12px; border: 1px solid var(--line); background: linear-gradient(90deg, color-mix(in srgb, var(--accent) 7%, transparent), transparent 70%); border-left: 3px solid var(--accent); }
.cc-pos > div, .cc-adv > div { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.cc-pos small, .cc-adv small, .cf-i > small, .cc-jr small { font-size: 10.5px; color: var(--ink2); letter-spacing: .05em; }
.cc-facs { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; }
@media (max-width: 900px) { .cc-facs { grid-template-columns: 1fr; } }
.cc-f { display: flex; flex-direction: column; border: 1px solid var(--line); border-top: 3px solid var(--line2); background: var(--card2); padding: 8px 10px 4px; min-width: 0; }
.cc-f.fac-b { border-top-color: #c9524a; } .cc-f.fac-o { border-top-color: #d79a2b; } .cc-f.fac-s { border-top-color: #3f7fd1; }
.cc-f.mine { box-shadow: 0 0 0 1px var(--accent), 0 0 14px var(--glow); }
.cf-h { display: flex; align-items: center; gap: 6px; font-weight: 700; font-size: 13.5px; margin-bottom: 6px; }
.cf-g { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 6px 10px; flex: 1; align-content: start; }
.cf-i { display: flex; flex-direction: column; gap: 2px; min-width: 0; padding-bottom: 4px; border-bottom: 1px dashed color-mix(in srgb, var(--line) 70%, transparent); }
.cf-i.full { grid-column: 1 / -1; } .cf-i > b { font-weight: 600; font-size: 12.5px; display: flex; align-items: center; flex-wrap: wrap; gap: 4px; min-width: 0; }
.cc-f > .wbtn { margin-top: 8px; flex-direction: column; gap: 1px; }
.cc-jr { display: flex; flex-wrap: wrap; gap: 8px 18px; } .cc-jr > div { display: flex; flex-direction: column; gap: 2px; }
details.cc-more { margin-top: 10px; }
details.cc-more > summary { list-style: none; cursor: pointer; padding: 7px 12px; font-weight: 600; letter-spacing: .08em; color: var(--accent); border: 1px solid color-mix(in srgb, var(--accent) 45%, transparent); background: color-mix(in srgb, var(--accent) 7%, transparent); clip-path: polygon(8px 0, 100% 0, 100% calc(100% - 8px), calc(100% - 8px) 100%, 0 100%, 0 8px); }
details.cc-more > summary::-webkit-details-marker { display: none; } details.cc-more > summary::before { content: "▸ "; } details.cc-more[open] > summary::before { content: "▾ "; }
.cc-acts { display: grid; grid-template-columns: repeat(auto-fill, minmax(230px, 1fr)); gap: 8px; }
.cc-act { display: flex; flex-direction: column; gap: 3px; border: 1px solid var(--line); padding: 8px; background: var(--card2); }
.ln-btns { display: flex; gap: 8px; flex-wrap: wrap; } .ln-btns > .wbtn { flex: 1 1 140px; width: auto; margin: 6px 0 0; flex-direction: column; gap: 1px; }

/* ============ 学生会：当前方针（政策线卡片，一行两张）============ */
.ln-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
@media (max-width: 760px) { .ln-grid, .el-grid { grid-template-columns: 1fr; } }
.ln-c, .el-c { border: 1px solid var(--line); background: var(--card2); padding: 9px 11px; display: flex; flex-direction: column; gap: 5px; min-width: 0; }
.ln-h { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; } .ln-h > b { font-size: 13.5px; }
.ln-cur { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; font-size: 12.5px; } .ln-cur .sk-more { margin-left: auto; cursor: pointer; }
.ln-sc { display: grid; grid-template-columns: repeat(7, 16px); gap: 2px; }
.ln-sc i { height: 12px; border: 1px solid color-mix(in srgb, var(--line) 80%, transparent); background: color-mix(in srgb, var(--line) 25%, transparent); }
.ln-sc i.cn { border-color: color-mix(in srgb, #d24a4a calc(25% + var(--a) * 15%), transparent); } .ln-sc i.cp { border-color: color-mix(in srgb, #2e9e4f calc(25% + var(--a) * 15%), transparent); }
.ln-sc i.cn.f { background: color-mix(in srgb, #d24a4a calc(30% + var(--a) * 22%), transparent); } .ln-sc i.cp.f { background: color-mix(in srgb, #2e9e4f calc(30% + var(--a) * 22%), transparent); }
.ln-sc i.cz { background: color-mix(in srgb, var(--ink2) 35%, transparent); } .ln-sc i.on { outline: 2px solid var(--ink); }
.ln-ends { display: flex; justify-content: space-between; gap: 8px; font-size: 11.5px; color: var(--ink2); } .ln-end.on { color: var(--ink); font-weight: 700; }
.ln-fx { display: flex; flex-wrap: wrap; gap: 3px 10px; font-size: 12px; min-height: 18px; }
.sk-pop h4 { margin-top: 2px; } .sk-sec.sk-cur { outline: 1px solid var(--accent); outline-offset: 3px; background: color-mix(in srgb, var(--accent) 8%, transparent); }
.pol-opts { display: grid; gap: 8px; margin: 8px 0; } .pol-o { border: 1px solid var(--line); padding: 8px 10px; display: flex; flex-wrap: wrap; align-items: baseline; gap: 4px 8px; } .pol-o > div { flex-basis: 100%; display: flex; flex-wrap: wrap; gap: 3px 10px; font-size: 12px; } .pol-o.on { border-color: var(--accent); background: color-mix(in srgb, var(--accent) 8%, transparent); } .pol-o .hint { flex-basis: 100%; margin: 0; }

/* ============ 学生会：选举 / 议案 ============ */
.el-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
.cc-room { position: relative; isolation: isolate; width: 100%; aspect-ratio: 3 / 1; max-height: 230px; min-height: 150px; overflow: hidden; border: 2px solid #5d3820; margin-bottom: 8px; }
.rm-bg { position: absolute; inset: 0; width: 100%; height: 100%; z-index: 0; }
.rm-desk { position: absolute; left: 0; right: 0; bottom: 0; width: 100%; height: 30%; z-index: 2; }
.rm-seats { position: absolute; inset: 0 3%; display: flex; justify-content: space-evenly; }
.rm-seat { position: relative; flex: 0 1 calc(100% / var(--n)); max-width: 120px; height: 100%; cursor: pointer; }
.rm-seat.me { cursor: default; }
.rm-pix { position: absolute; z-index: 1; left: 50%; bottom: 22%; transform: translateX(-50%); transition: transform .15s; }
.rm-pix .pix { display: block; border: none; background: none; }
.rm-seat:not(.me):hover .rm-pix { transform: translateX(-50%) translateY(-4px); }
.rm-seat.head .rm-pix::after { content: "★"; position: absolute; top: -12px; left: 50%; transform: translateX(-50%); color: #ffd34d; font-size: 12px; text-shadow: 0 1px 0 #7a5a00; }
.rm-flag { position: absolute; z-index: 1; top: 7%; left: 50%; transform: translateX(-50%); width: 18px; height: 24px; display: grid; place-items: start center; padding-top: 3px; background: var(--c, #6c5a8a); color: #fff; clip-path: polygon(0 0, 100% 0, 100% 100%, 50% 80%, 0 100%); }
.rm-flag.adv { background: #6b4fa0; font-size: 11px; line-height: 1; }
.rm-flag .fac-ico { color: #fff; }
.rm-tag { position: absolute; z-index: 3; left: 50%; bottom: 5%; transform: translateX(-50%); display: flex; flex-direction: column; align-items: center; padding: 1px 6px 2px; background: #f4ead4; color: #3b2614; border: 1px solid #2c1a0c; box-shadow: 0 2px 0 #2c1a0c; font-family: var(--mono); line-height: 1.1; max-width: 100%; white-space: nowrap; }
.rm-tag b { font-size: 11px; overflow: hidden; text-overflow: ellipsis; max-width: 100%; } .rm-tag small { font-size: 8.5px; color: #7a5a3a; overflow: hidden; text-overflow: ellipsis; max-width: 100%; }
.rm-seat.me .rm-tag { background: #ffe9a8; }
@media (max-width: 620px) { .rm-tag small { display: none; } }
.cc-fund { display: flex; align-items: baseline; gap: 10px; padding: 8px 12px; border: 1px solid var(--line); background: var(--card2); cursor: help; flex-wrap: wrap; }
.cc-fund > span:first-child { color: var(--ink2); font-size: 12px; } .cc-fund > b { font-size: 20px; font-family: var(--mono); color: var(--accent); } .cc-fund .sk-more { margin-left: auto; }
.bq { display: flex; gap: 10px; overflow-x: auto; padding: 4px 2px 10px; scroll-snap-type: x proximity; min-height: 92px; }   /* 队列区域固定撑出一块空白 */
.bq.bq-empty { align-items: center; justify-content: center; color: var(--ink2); font-size: 13px; border: 1px dashed var(--line); background: color-mix(in srgb, var(--card) 50%, transparent); padding: 10px; }
.bq-c { flex: 0 0 214px; scroll-snap-align: start; display: flex; flex-direction: column; gap: 5px; padding: 9px 10px; border: 1px solid var(--line); background: var(--card2); cursor: pointer; position: relative; transition: transform .15s, box-shadow .15s; }
.bq-c:hover { transform: translateY(-2px); box-shadow: 0 4px 14px color-mix(in srgb, var(--ink) 12%, transparent); }
.bq-c.on { border-color: var(--accent); box-shadow: 0 0 0 1px var(--accent), 0 0 16px var(--glow); background: linear-gradient(180deg, color-mix(in srgb, var(--accent) 12%, var(--card2)), var(--card2) 60%); }
.bq-c.on::before { content: ""; position: absolute; left: 0; right: 0; top: 0; height: 2px; background: linear-gradient(90deg, transparent, var(--accent), transparent); background-size: 200% 100%; animation: bqScan 2.4s linear infinite; }
@keyframes bqScan { from { background-position: 100% 0; } to { background-position: -100% 0; } }
.bq-c.sel { outline: 2px dashed var(--accent2); outline-offset: 2px; } .bq-c.em { border-left: 3px solid var(--dn, #d24a4a); }
.bq-top { display: flex; flex-wrap: wrap; gap: 3px; min-height: 16px; }
.bq-by { display: flex; align-items: center; gap: 6px; } .bq-by > span { display: flex; flex-direction: column; min-width: 0; } .bq-by b { font-size: 12px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } .bq-by small { font-size: 10px; }
.bq-n { font-size: 13px; line-height: 1.35; min-height: 2.7em; }
.bq-v { display: flex; align-items: center; gap: 6px; font-size: 11.5px; } .bq-v > span { flex: none; width: 4.6em; } .bq-v > div { display: flex; gap: 2px; flex-wrap: wrap; align-items: center; }
.bq-f .pix { width: 20px !important; height: 20px !important; }
.bq-fk { font-size: 11.5px; }
.bq-due { margin-top: auto; padding-top: 5px; border-top: 1px dashed var(--line); font-size: 11px; font-family: var(--mono); color: var(--ink2); }
.bq-c.on .bq-due { color: var(--accent); font-weight: 700; }
.bq-det { border: 1px solid var(--line); border-left: 3px solid var(--accent2); padding: 8px 12px; background: var(--card2); }
.bq-done { display: flex; flex-wrap: wrap; gap: 6px 14px; font-size: 12px; }
.as-h { display: flex; gap: 8px; align-items: center; flex-wrap: wrap; } .as-h b { font-size: 14px; }
.as-vt { width: 100%; border-collapse: collapse; font-size: 12px; margin-top: 4px; } .as-vt td { padding: 3px 4px; border-top: 1px solid color-mix(in srgb, var(--line) 50%, transparent); }
.as-vote-y { color: var(--up, #2e9e4f); } .as-vote-n { color: var(--dn, #d24a4a); }
.as-spark { display: flex; align-items: flex-end; gap: 2px; height: 38px; } .as-spark i { flex: 1; background: var(--accent); opacity: .7; min-height: 2px; border-radius: 2px 2px 0 0; } .as-spark i.neg { background: var(--dn, #d24a4a); }
.as-badge { display: inline-block; font-size: 10.5px; padding: 0 5px; border-radius: 8px; border: 1px solid var(--line); } .as-badge.on { border-color: var(--accent); color: var(--accent); }

/* 人物卡：结识 / 互动下面的「批判」 */
.nc-cta { display: flex; flex-direction: column; gap: 6px; align-items: stretch; }
.nc-crit { display: flex; flex-direction: column; align-items: center; gap: 1px; padding: 5px 14px; font-weight: 600; color: var(--dn, #d24a4a); border-color: color-mix(in srgb, var(--dn, #d24a4a) 50%, transparent); }
.nc-crit small { font-size: 10.5px; font-weight: 400; }

/* 人物卡（头像 + 名字）：一个整体，不在中间换行 */
.pc-w { display: inline-flex; align-items: center; gap: 4px; white-space: nowrap; vertical-align: middle; max-width: 100%; min-width: 0; }
.pc-w > .nm-scroll, .pc-w > .npc-link { min-width: 0; }

/* 系统页标题栏的「？」：玩法介绍（呼吸光晕 + 扫描线 + 角标） */
.sys-q { position: relative; flex: none; width: 34px; height: 34px; margin-left: 10px; padding: 0; display: grid; place-items: center; font: 700 18px/1 var(--mono); color: var(--accent); background: color-mix(in srgb, var(--accent) 10%, transparent); border: 1px solid var(--accent); border-radius: 0; clip-path: polygon(8px 0, 100% 0, 100% calc(100% - 8px), calc(100% - 8px) 100%, 0 100%, 0 8px); overflow: hidden; animation: sysQGlow 2.4s ease-in-out infinite; }
.card h3 > .sys-q { margin-left: auto; } .card h3 > small + .sys-q { margin-left: 10px; }
.sys-q > span { position: relative; z-index: 1; text-shadow: 0 0 8px var(--accent); animation: sysQBlink 3.2s steps(1) infinite; }
.sys-q::before { content: ""; position: absolute; left: 0; right: 0; height: 40%; top: -40%; background: linear-gradient(180deg, transparent, color-mix(in srgb, var(--accent) 45%, transparent), transparent); animation: sysQScan 2.4s linear infinite; }
.sys-q:hover:not(:disabled) { background: color-mix(in srgb, var(--accent) 24%, transparent); box-shadow: none; }
@keyframes sysQGlow { 0%, 100% { box-shadow: 0 0 0 0 var(--glow); filter: none; } 50% { box-shadow: 0 0 12px 2px var(--glow); filter: brightness(1.2); } }
@keyframes sysQScan { from { top: -40%; } to { top: 110%; } }
@keyframes sysQBlink { 0%, 92%, 100% { opacity: 1; } 94% { opacity: .25; } 96% { opacity: 1; } 97% { opacity: .4; } }
@media (prefers-reduced-motion: reduce) { .sys-q, .sys-q > span, .sys-q::before { animation: none; } }

/* 三派卡片：直辖军团两行 */
.cf-i > b .dl-l { display: flex; align-items: center; gap: 6px; width: 100%; min-width: 0; flex-wrap: nowrap; }
.dl-l > small { flex: none; color: var(--ink2); font-weight: 400; font-size: 11px; }
.dl-l > .mini { margin-left: auto; flex: none; }
.dl-nm { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.dl-cnt { flex: none; margin-left: auto; font-family: var(--mono); font-size: 12px; font-weight: 400; color: var(--ink2); }   /* 纯文字，别像按钮 */
.dl-cnt small { margin-left: 2px; font-size: 10px; color: var(--ink2); font-family: inherit; }
.csk-c { display: inline-flex; align-items: center; gap: 3px; white-space: nowrap; margin-right: 8px; }
/* 可悬停看明细的文字一律晶蓝色（内部自带正负色的数字保持原色；派系标签用派系色） */
.fx-hrow, span[data-hov], b[data-hov], a[data-hov], i[data-hov] { color: var(--accent); border-bottom: 1px dotted color-mix(in srgb, var(--accent) 70%, transparent); }
.fac-t[data-hov], .ism[data-hov] { border-bottom: none; } .fac-t[data-hov] { color: inherit; } .fac-t.fac-b[data-hov] { color: #c9524a; } .fac-t.fac-o[data-hov] { color: #b07a12; } .fac-t.fac-s[data-hov] { color: #3f7fd1; }
.cc-2col { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0 18px; } .cc-2col > div:only-child { grid-column: 1 / -1; } @media (max-width: 760px) { .cc-2col { grid-template-columns: 1fr; } }
.cc-jr { display: grid; grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)); gap: 8px 14px; }

/* 学生会：本校制度（结构卡 + 选任方式卡） */
.st-row { display: grid; grid-template-columns: minmax(200px, 1fr) minmax(0, 2fr); gap: 10px; margin-bottom: 4px; }
@media (max-width: 760px) { .st-row { grid-template-columns: 1fr; } }
.st-c, .st-m { display: flex; flex-direction: column; gap: 3px; padding: 8px 12px; border: 1px solid var(--line); background: var(--card2); min-width: 0; }
.st-c { cursor: help; border-left: 3px solid var(--accent); background: linear-gradient(90deg, color-mix(in srgb, var(--accent) 8%, var(--card2)), var(--card2)); }
.st-c:hover { border-color: var(--accent); }
.st-h { display: flex; align-items: center; gap: 8px; } .st-h b { font-size: 16px; } .st-ico { color: var(--accent); flex: none; }
.st-c > small, .st-m > small, .st-ms > small { font-size: 11px; color: var(--ink2); line-height: 1.5; }
.st-ms { display: flex; flex-direction: column; gap: 3px; min-width: 0; }
.st-mg { display: grid; grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); gap: 8px; flex: 1; }
.st-m > b { font-size: 13.5px; align-self: flex-start; }

/* 学生会概要：职位证（左大头像，右 2×2 信息） */
.role-2c { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 18px; margin-top: 8px; align-items: start; }
.role-2c .r2-r { padding-left: 18px; border-left: 1px dashed var(--line); }
.role-2c .r2-r > :first-child { margin-top: 0; border-top: 0; padding-top: 0; }
@media (max-width: 720px) { .role-2c { grid-template-columns: minmax(0, 1fr); } .role-2c .r2-r { padding-left: 0; border-left: 0; } }
.role-id { display: flex; gap: 16px; align-items: stretch; border-left: 3px solid var(--accent); }
.role-id .ri-z { flex: none; width: 92px; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 2px; padding: 6px 4px; border-right: 1px solid color-mix(in srgb, var(--accent) 35%, var(--line)); }
.role-id .ri-z b { font-family: var(--mono, monospace); font-size: 34px; line-height: 1; letter-spacing: .04em; color: var(--accent); text-shadow: 0 0 10px var(--glow); }
.role-id .ri-z small { font-size: 11px; color: var(--ink2); white-space: nowrap; }
.role-id .ri-g { flex: 1; min-width: 0; }
.cc-id { display: flex; gap: 14px; align-items: center; padding: 10px 14px; border: 1px solid var(--line); border-left: 3px solid var(--accent); background: linear-gradient(100deg, color-mix(in srgb, var(--accent) 9%, var(--card2)), var(--card2) 60%), repeating-linear-gradient(135deg, transparent 0 10px, color-mix(in srgb, var(--accent) 4%, transparent) 10px 11px); clip-path: polygon(0 0, calc(100% - 14px) 0, 100% 14px, 100% 100%, 0 100%); }
.cc-id-pix { flex: none; padding: 3px; border: 1px solid color-mix(in srgb, var(--accent) 60%, transparent); background: color-mix(in srgb, var(--accent) 10%, transparent); }
.cc-id-pix .pix { display: block; }
.cc-id-g { flex: 1; min-width: 0; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px 18px; }
.cc-id-g > div { display: flex; flex-direction: column; gap: 2px; min-width: 0; padding-bottom: 4px; border-bottom: 1px dashed color-mix(in srgb, var(--line) 70%, transparent); }
.cc-id-g small { font-size: 10.5px; color: var(--ink2); letter-spacing: .08em; } .cc-id-g b { font-size: 14px; display: flex; align-items: center; gap: 4px; min-width: 0; }
.wbtn small .pc-w { vertical-align: middle; }

/* ============ 校园：像素地图（主建筑 + 旁边的建筑卡）============ */
.cm-map { position: relative; isolation: isolate; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 14px 12px; padding: 14px; margin: 8px 0; border: 2px solid #3f6b35; }
.cm-bg { position: absolute; inset: 0; width: 100%; height: 100%; z-index: -1; }
@media (max-width: 760px) { .cm-map { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 480px) { .cm-map { grid-template-columns: 1fr; } }
.cm-cell { display: flex; align-items: flex-end; gap: 6px; min-width: 0; }
.cm-b { flex: none; width: 46%; max-width: 128px; cursor: pointer; transition: transform .15s, filter .15s; }
.cm-b:hover { transform: translateY(-3px); filter: drop-shadow(0 4px 0 #00000040) brightness(1.06); }
.cm-cell.off .cm-b { cursor: default; opacity: .75; } .cm-cell.off .cm-b:hover { transform: none; filter: none; }
.cm-pix, .ci-bg { display: block; width: 100%; height: auto; image-rendering: pixelated; }
.cm-card { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 4px; padding: 6px 8px; background: color-mix(in srgb, var(--card) 92%, transparent); border: 1px solid var(--line); box-shadow: 0 2px 0 #00000030; }
.cm-card.off { opacity: .8; }
.cm-h { display: flex; align-items: baseline; gap: 6px; flex-wrap: wrap; min-width: 0; } .cm-h b { font-size: 13px; } .cm-h .lv { font-family: var(--mono); font-size: 11px; color: var(--ink2); }
.cm-btns { display: flex; flex-wrap: wrap; gap: 4px; align-items: center; } .cm-btns .mini { margin-left: 0; } .cm-btns .mini small { font-weight: 400; opacity: .8; }
.cm-card > .sk-more { align-self: flex-start; cursor: pointer; font-size: 11.5px; }
/* ============ 主建筑内部：房间（像素底图 + 人物 + 房间卡）============ */
.ci-head { margin: 8px 0; }
.ci-map { display: grid; grid-template-columns: repeat(auto-fill, minmax(230px, 1fr)); gap: 10px; padding: 10px; border: 2px solid var(--line2); background: repeating-linear-gradient(0deg, color-mix(in srgb, var(--ink2) 10%, transparent) 0 2px, transparent 2px 22px); }
.ci-t { display: flex; flex-direction: column; min-width: 0; border: 2px solid #3b2e22; background: #2a2119; }
.ci-t.empty { border-style: dashed; opacity: .75; }
.ci-room { position: relative; aspect-ratio: 48 / 20; overflow: hidden; }
.ci-room .ci-bg { position: absolute; inset: 0; width: 100%; height: 100%; }
.ci-ppl { position: absolute; left: 0; right: 0; bottom: 2px; display: flex; justify-content: space-evenly; align-items: flex-end; padding: 0 4px; }
.ci-p { display: flex; flex-direction: column; align-items: center; gap: 0; padding: 0; background: none; border: none; clip-path: none; color: #fff; min-width: 0; max-width: 20%; }
.ci-p .pix { border: none; background: none; transition: transform .15s; }
.ci-p:hover:not(:disabled) .pix { transform: translateY(-3px); } .ci-p:hover:not(:disabled) { background: none; }
.ci-p span { font-size: 9.5px; font-weight: 600; line-height: 1.1; padding: 0 3px; background: #000a; max-width: 100%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.ci-p.fx span { background: color-mix(in srgb, var(--accent) 80%, #000); }
.ci-work { font-size: 11px; color: #ffd34d; background: #000a; padding: 1px 6px; margin-bottom: 30%; }
.ci-t > .cm-card { border: none; border-top: 2px solid #3b2e22; box-shadow: none; flex: 1; }
.h-hero > .h-setup { grid-column: 1 / -1; min-width: 0; }   /* 首页：难度、系统、语言、出生按钮在图片下面撑满整行 */

/* 身份卡：性格 4 个徽章一行排满，名字放不下时在徽章内滚动 */
.tagrow > b { flex: 1; min-width: 0; margin-left: 12px; }
.tags.t4 { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 4px; width: 100%; }
.tags.t4 > i { min-width: 0; overflow: hidden; text-align: center; white-space: nowrap; }

/* 首页难度：◀ 低 中 高 ▶ + 晶蓝效果说明 */
.df-sel { display: flex; align-items: stretch; gap: 6px; max-width: 420px; }
.h-diff .df-sel button { margin: 0; display: flex; align-items: center; justify-content: center; text-align: center; }   /* 盖掉首页 .opt button 的左对齐与外边距 */
.h-diff .df-ar { flex: none; width: 42px; padding: 0; font-size: 15px; line-height: 1; }
.df-cells { flex: 1; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 6px; }
.h-diff .df-cells button { padding: 9px 0; font-size: 17px; color: var(--accent); }
.h-diff .df-cells button.on { background: var(--accent); border-color: var(--accent); color: #061016; text-shadow: none; box-shadow: none; filter: drop-shadow(0 0 8px var(--glow)); }
.df-desc { margin: 8px 0 0; color: var(--accent); font-size: 13px; text-shadow: 0 0 10px var(--glow); }

/* Garden 概要：校内要职两列 */
.gp-g { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 6px 18px; }
@media (max-width: 640px) { .gp-g { grid-template-columns: 1fr; } }
.gp-c { display: flex; flex-direction: column; gap: 3px; padding: 6px 0; border-bottom: 1px dashed color-mix(in srgb, var(--line) 70%, transparent); min-width: 0; }
.gp-c > small { font-size: 11px; color: var(--ink2); }
.gp-p { display: flex; align-items: center; gap: 8px; min-width: 0; } .gp-p > :last-child:not(.pc-w) { margin-left: auto; }

/* ============ Justify 理念树（群星式）============ */
.ji-tabs { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 4px; margin-bottom: 8px; }
@media (max-width: 640px) { .ji-tabs { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
.ji-tabs button { display: flex; align-items: center; gap: 5px; padding: 5px 6px; font-size: 12px; color: var(--ink); clip-path: none; border-radius: 0; background: var(--card2); border: 1px solid var(--line); border-bottom: 2px solid color-mix(in srgb, var(--tc) 40%, transparent); }
.ji-tabs button span { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; text-align: left; } .ji-tabs button small { font-family: var(--mono); font-size: 10.5px; }
.ji-tabs button.on { color: var(--ink); background: color-mix(in srgb, var(--tc) 18%, var(--card2)); border-color: var(--tc); box-shadow: inset 0 -2px 0 var(--tc); }
.ji-panel { border: 1px solid color-mix(in srgb, var(--tc) 50%, var(--line)); background: radial-gradient(ellipse at 50% 35%, color-mix(in srgb, var(--tc) 14%, transparent), transparent 70%), linear-gradient(180deg, #0c141c, #101a24); color: #dce8ef; padding: 10px 12px; }
.ji-panel .hint { color: #8ba1b0; }
.ji-head { display: flex; align-items: center; gap: 10px; padding-bottom: 8px; border-bottom: 1px solid color-mix(in srgb, var(--tc) 40%, transparent); }
.ji-head > div { display: flex; flex-direction: column; } .ji-head b { font-size: 15px; letter-spacing: .08em; } .ji-head small { color: #8ba1b0; font-size: 11.5px; }
.ji-pool { margin-left: auto; font-size: 12px; color: #8ba1b0; } .ji-pool b { color: var(--tc); font-family: var(--mono); font-size: 15px; }
.ji-tree { position: relative; width: 100%; max-width: 380px; aspect-ratio: 300 / 330; margin: 8px auto 0; }
.ji-lines { position: absolute; inset: 0; width: 100%; height: 100%; }
.ji-lines line { stroke: #3a4a58; stroke-width: 2; stroke-dasharray: 4 4; vector-effect: non-scaling-stroke; }
.ji-lines line.go { stroke: color-mix(in srgb, var(--tc) 70%, #fff); stroke-dasharray: none; animation: jiFlow 1.6s linear infinite; stroke-dasharray: 6 4; }
.ji-lines line.on { stroke: var(--tc); stroke-dasharray: none; stroke-width: 3; filter: drop-shadow(0 0 3px var(--tc)); }
@keyframes jiFlow { to { stroke-dashoffset: -20; } }
.ji-n { position: absolute; transform: translate(-50%, -50%); display: flex; flex-direction: column; align-items: center; width: 110px; cursor: help; }
.ji-n.can { cursor: pointer; }
.ji-ico { display: block; color: var(--tc); transition: transform .15s, filter .2s; }
.ji-hex { fill: #18232e; stroke: #3a4a58; stroke-width: .9; } .ji-hex2 { fill: none; stroke: currentColor; stroke-width: .6; opacity: .7; }
.ji-g { color: #6b7d8c; }
.ji-n.on .ji-hex { fill: color-mix(in srgb, var(--tc) 35%, #18232e); stroke: var(--tc); } .ji-n.on .ji-g { color: #fff; } .ji-n.on .ji-ico { filter: drop-shadow(0 0 6px var(--tc)); }
.ji-n.avail .ji-hex { stroke: var(--tc); stroke-width: 1.2; } .ji-n.avail .ji-g { color: var(--tc); } .ji-n.avail .ji-ico { animation: jiPulse 1.8s ease-in-out infinite; }
.ji-n.ready .ji-hex { stroke: color-mix(in srgb, var(--tc) 60%, #3a4a58); } .ji-n.ready .ji-g { color: color-mix(in srgb, var(--tc) 60%, #6b7d8c); }
.ji-n.lock { opacity: .55; }
.ji-n.can:hover .ji-ico { transform: scale(1.08); }
@keyframes jiPulse { 0%, 100% { filter: drop-shadow(0 0 0 var(--tc)); } 50% { filter: drop-shadow(0 0 8px var(--tc)); } }
.ji-l { margin-top: 2px; font-size: 11.5px; font-weight: 600; text-align: center; line-height: 1.25; text-shadow: 0 1px 2px #000; }
.ji-n.on .ji-l { color: #fff; } .ji-n:not(.on) .ji-l { color: #b8c6d0; }
.ji-c { font-family: var(--mono); font-size: 10.5px; color: var(--tc); }
.card h4 { white-space: nowrap; } .card h4 > small { white-space: normal; }   /* 小标题文字不折行 */
.h-setup > .h-sys { margin-top: 22px; }   /* 首页：系统开关在出生按钮下面 */

/* 首页：语言按钮、出生 / 继续按钮等分整行；调试开局单独一行 */
.h-setup .h-eq { display: grid; grid-auto-flow: column; grid-auto-columns: minmax(0, 1fr); gap: 8px; }
.h-setup .h-eq > button, .h-setup .go > button { margin: 0; display: flex; align-items: center; justify-content: center; text-align: center; }
.h-setup .go > button { flex: 1 1 0; min-width: 0; }
.h-setup .go > .dbg { flex: 1 1 100%; }
.h-diff .df-desc { max-width: 420px; text-align: center; }   /* 难度说明在选择器下方居中 */
/* 顶部菜单的选中高亮（被上面的结构性控件重置盖掉了，这里补回通用 button.on 的样式） */
#top-tabs button.on, button#ctl-act.on { background: var(--accent); color: #fff; border-color: var(--accent); box-shadow: 0 0 12px var(--glow); }
:where(:root[data-theme="dark"], :root:not([data-theme="light"])) #top-tabs button.on { color: #061016; }
#top-mtog .mt-hint { margin-left: 10px; padding-left: 10px; border-left: 1px solid color-mix(in srgb, var(--accent) 40%, transparent); font-size: 11px; color: var(--ink2); }   /* 菜单按钮：点击折叠 / 展开的说明 */
/* 选举榜：名字一侧收缩（放不下时在名字框里滚动），票数 / 人气不换行 */
.el-r { flex-wrap: nowrap; align-items: center; gap: 8px; }
.el-r > span { flex: 1; min-width: 0; display: flex; align-items: center; gap: 6px; overflow: hidden; }
.el-r > span > i { flex: none; font-style: normal; color: var(--ink2); font-family: var(--mono); }
.el-r > span > .pc-w { min-width: 0; flex: 1; } .el-r .nm-scroll { max-width: 100%; }
.el-r > b { flex: none; white-space: nowrap; display: flex; align-items: center; gap: 4px; }
/* 整行大按钮：不可用原因等小字放在按钮文字下面一行 */
button.wbtn { flex-wrap: wrap; row-gap: 1px; } button.wbtn > small { flex-basis: 100%; text-align: center; }
/* 大按钮 + 下方红字原因：作为一个整体参与布局（并排按钮时各占一份） */
.wb-w { display: flex; flex-direction: column; min-width: 0; }
.ln-btns > .wb-w { flex: 1 1 140px; } .ln-btns > .wb-w > .wbtn { margin: 6px 0 0; flex-direction: column; gap: 1px; }
.wb-w > .btn-why { margin-top: 3px; font-size: 11px; line-height: 1.4; color: var(--dn, #d24a4a); text-align: center; }
.cc-f > .wb-w { margin-top: 8px; } .cc-f > .wb-w > .wbtn { margin: 0; }
/* 议案区块：政策线议案（每条线一行，右边两个提案按钮） */
.lb-list { display: flex; flex-direction: column; gap: 6px; }
.lb-r { display: grid; grid-template-columns: minmax(150px, 1fr) minmax(0, 2fr); gap: 8px 12px; align-items: center; padding: 6px 10px; border: 1px solid var(--line); background: var(--card2); }
@media (max-width: 700px) { .lb-r { grid-template-columns: 1fr; } }
.lb-n { display: flex; flex-wrap: wrap; align-items: baseline; gap: 4px 8px; min-width: 0; } .lb-n > b { font-size: 13px; } .lb-n > small { font-size: 11px; }
.lb-r .ln-btns > .wb-w > .wbtn { margin: 0; padding: 5px 8px; font-size: 12px; }

/* 首页出生确认框 */
#sys-help .born-ask { width: min(460px, calc(100vw - 32px)); } #sys-help .born-f { justify-content: flex-end; } #sys-help .born-f .cta { padding: 8px 22px; font-size: 14px; }
/* 职位证：派系名后面的派内地位放不下时整体换行，不再被压成竖排 */
.cc-id-g b { flex-wrap: wrap; row-gap: 2px; } .cc-id-g b > small { flex: none; white-space: nowrap; }
/* 争取晋升按钮上的「?」：提示可以悬停看作用 */
.wbtn .wb-q { display: inline-grid; place-items: center; width: 16px; height: 16px; margin-left: 6px; border: 1px solid currentColor; border-radius: 50%; font-size: 10px; font-weight: 700; flex-basis: auto !important; }
.wb-w[data-hov] { cursor: help; }

/* 按钮的红色版（退出派系、拆除这类有损失的操作）：和普通按钮同一套斜切角样式，换成红色描边、文字与扫光 */
button.danger { --dg: var(--dn, #d24a4a); color: var(--dg); border-color: color-mix(in srgb, var(--dg) 60%, transparent);
  background: linear-gradient(90deg, color-mix(in srgb, var(--dg) 6%, var(--card2)), color-mix(in srgb, var(--dg) 16%, var(--card2)), color-mix(in srgb, var(--dg) 6%, var(--card2))); }
button.danger:hover:not(:disabled) { border-color: var(--dg); background: color-mix(in srgb, var(--dg) 24%, var(--card2)); }
button.wbtn.danger::after { background: linear-gradient(90deg, transparent, color-mix(in srgb, var(--dg) 30%, transparent), transparent); }
button.danger small { color: color-mix(in srgb, var(--dg) 70%, var(--ink2)); }

/* 当前方针：清单式，一条政策线一行，点击展开详细面板 */
.ln-list { display: flex; flex-direction: column; gap: 4px; }
.ln-row { padding: 0; gap: 0; }
.ln-sum { display: flex; align-items: center; gap: 8px; padding: 7px 10px; cursor: pointer; flex-wrap: wrap; }
.ln-sum:hover { background: color-mix(in srgb, var(--accent) 7%, transparent); }
.ln-sum .ln-nm { min-width: 5.5em; font-size: 13px; } .ln-sum .ln-end-c { font-size: 13px; }
.ln-sum .ln-tg { margin-left: auto; font-size: 12px; color: var(--accent); white-space: nowrap; }
.ln-row.open { border-color: color-mix(in srgb, var(--accent) 50%, var(--line)); } .ln-row.open > .ln-sum { border-bottom: 1px dashed var(--line); }
.ln-det { display: flex; flex-direction: column; gap: 5px; padding: 8px 12px 10px; }
.ln-det .ln-cur .sk-more { margin-left: 0; }

/* 外征重点县：地图选县弹窗（底部按钮固定） */
.fp-pop { display: flex; flex-direction: column; max-height: calc(100vh - 80px); min-height: 0; }
/* 弹窗内容区默认 flex:none，这里要让整个选县面板跟着弹窗高度收缩：地图 + 县信息在 .fp-body 里滚动，底部按钮固定 */
.amenu .sh-in > .fp-pop { flex: 1 1 auto; min-height: 0; max-height: none; overflow: hidden; }
.fp-body { flex: 1 1 auto; min-height: 0; overflow-y: auto; display: flex; flex-direction: column; gap: 8px; padding-right: 4px; scrollbar-gutter: stable; }
.fp-body > *, .fp-info > * { flex: none; }
.fp-pop > .fp-foot { flex: none; position: static; }
/* 按地图比例限制宽度，让整张图都在 56vh 高度内完整显示（不裁切） */
.fp-body .jmap-wrap { width: 100%; max-width: min(640px, calc(56vh * var(--ar))); }
.fp-info { padding: 8px 10px; border: 1px solid var(--line); background: var(--card2); }
.fp-h { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; } .fp-h b { font-size: 15px; }
.fp-st { font-size: 11.5px; padding: 0 6px; border-left: 3px solid var(--c); background: color-mix(in srgb, var(--c) 18%, transparent); }
.fp-g { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 6px 12px; margin-top: 6px; } .fp-g > div { display: flex; flex-direction: column; } .fp-g small { font-size: 10.5px; color: var(--ink2); } .fp-g b { font-family: var(--mono); }
@media (max-width: 560px) { .fp-g { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
.nc-list { display: grid; grid-template-columns: repeat(auto-fill, minmax(210px, 1fr)); gap: 6px; margin-top: 8px; max-height: 240px; overflow-y: auto; align-content: start; padding-right: 4px; scrollbar-gutter: stable; }
.nc-card { display: flex; flex-direction: column; align-items: flex-start; gap: 2px; margin: 0; padding: 7px 9px; text-align: left; border: 1px solid var(--line); background: var(--card); position: relative; }
.nc-card.on, .nc-card.on:hover { border-color: var(--accent); background: color-mix(in srgb, var(--accent) 14%, var(--card)); color: var(--ink); box-shadow: 0 0 0 1px var(--accent) inset, 0 0 10px var(--glow); }
.nc-card b { font-size: 13.5px; padding-right: 28px; } .nc-card small { font-size: 11px; color: var(--ink2); line-height: 1.35; }
.nc-g { position: absolute; top: 6px; right: 7px; font-family: var(--mono); font-weight: 700; font-size: 12px; padding: 0 5px; border: 1px solid currentColor; }
.nc-g.g0 { color: var(--ink2); } .nc-g.g1 { color: var(--t); } .nc-g.g2 { color: var(--p); } .nc-g.g3 { color: var(--accent2); }
.cx-card { border: 1px solid var(--line); background: var(--card2); padding: 9px 11px; display: flex; flex-direction: column; gap: 6px; }
.cx-h { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; } .cx-h b { font-size: 15px; }
.cx-ph { font-size: 11.5px; padding: 0 7px; border-left: 3px solid var(--c, var(--accent)); background: color-mix(in srgb, var(--c, var(--accent)) 16%, transparent); }
.cx-legs { display: flex; flex-wrap: wrap; gap: 4px; } .cx-legs span { font-size: 12px; padding: 1px 7px; border: 1px solid var(--line); background: var(--card); } .cx-legs span.me { border-color: var(--accent); }
.cx-bar { height: 6px; background: var(--line); position: relative; } .cx-bar i { position: absolute; inset: 0 auto 0 0; background: var(--accent2); }
.cx-list { display: flex; flex-direction: column; gap: 6px; max-height: 420px; overflow: auto; }
.cx-btns { display: grid; grid-template-columns: minmax(0, 1fr); gap: 6px; }   /* 一行一个整行按钮；条件清单紧跟在它的按钮下面 */
.cx-btns > .wbtn { width: 100%; }
.fp-foot { position: sticky; bottom: 0; display: grid; grid-template-columns: 1fr 2fr; gap: 8px; padding-top: 10px; margin-top: 8px; border-top: 1px solid var(--line); background: var(--card); }
.fp-foot > button { display: flex; flex-direction: column; align-items: center; justify-content: center; margin: 0; padding: 9px; } .fp-foot small { font-size: 11px; font-weight: 400; opacity: .85; }

/* 只在触屏缩放的地图：电脑端不显示缩放条，也不保留之前的缩放（始终是整张地图） */
@media (hover: hover) and (pointer: fine) { .jmap-zoom.mz-touch .mz-bar { display: none; } .jmap-zoom.mz-touch .jmap-stage { transform: none !important; } .jmap-zoom.mz-touch.zoomed { cursor: default; } }
.fp-foot > .fp-why { grid-column: 2; margin-top: -2px; font-size: 12px; color: var(--dn, #d24a4a); text-align: center; }

/* 事件里的概率明细（请代表提出议案等）：首行结果，下面逐项 */
.req-calc { margin: 8px 0; padding: 8px 12px; border: 1px solid var(--line); border-left: 3px solid var(--accent); background: var(--card2); font-size: 13px; }
.req-calc > b { display: block; margin-bottom: 4px; } .req-calc > b small { font-weight: 400; margin-left: 4px; }
.req-calc > div { display: flex; justify-content: space-between; gap: 12px; padding: 2px 0; border-top: 1px dashed color-mix(in srgb, var(--line) 70%, transparent); }

/* 学生会室：旗帜、人物、名牌更大；人物抬高，上半身露在长桌上方 */
.cc-room { max-height: 320px; min-height: 200px; aspect-ratio: 5 / 2; }
.rm-flag { width: 30px; height: 40px; padding-top: 5px; top: 5%; } .rm-flag.adv { font-size: 16px; }
.rm-pix { bottom: 24%; }
.rm-tag { padding: 3px 10px 4px; bottom: 4%; box-shadow: 0 3px 0 #2c1a0c; } .rm-tag b { font-size: 15px; } .rm-tag small { font-size: 11px; }
.rm-seat { max-width: 160px; }
.rm-seat.head .rm-pix::after { top: -16px; font-size: 16px; }
/* 近期结果：人生记录式日志，日期列宽一点 */
.bq-log { max-height: 280px; } .bq-log .le { grid-template-columns: 92px 1fr; font-size: 13px; } .bq-log .la { font-size: 11.5px; }

/* 政策线议案：进度条式，可推向的格子晶蓝闪烁 */
.lb-r { grid-template-columns: minmax(130px, 1fr) minmax(0, 1fr) auto minmax(0, 1fr) 5.5em; align-items: center; }
@media (max-width: 760px) { .lb-r { grid-template-columns: 1fr auto 1fr; } .lb-r .lb-n { grid-column: 1 / -1; } .lb-r .lb-cur { display: none; } }
.lb-e { font-size: 11.5px; color: var(--ink2); display: flex; align-items: center; gap: 4px; min-width: 0; } .lb-e.l { justify-content: flex-end; text-align: right; } .lb-e.on { color: var(--ink); font-weight: 700; }
.lb-sc { grid-template-columns: repeat(7, 22px); } .lb-sc i { height: 16px; }
.lb-sc i.push { cursor: pointer; border-color: var(--accent); background: color-mix(in srgb, var(--accent) 35%, transparent); animation: lbPush 1.1s ease-in-out infinite; }
.lb-sc i.push:hover { background: var(--accent); animation: none; box-shadow: 0 0 10px var(--glow); }
.lb-sc i.nopush { cursor: not-allowed; }
@keyframes lbPush { 0%, 100% { box-shadow: 0 0 0 0 var(--glow); opacity: .65; } 50% { box-shadow: 0 0 10px 2px var(--glow); opacity: 1; } }
.lb-cur { font-size: 12.5px; text-align: right; white-space: nowrap; }

/* 议案页：提案身份一行 */
.pr-line { display: grid; grid-template-columns: auto minmax(0, 1fr); gap: 4px 24px; margin-top: 10px; padding: 8px 12px; border: 1px solid var(--line); border-left: 3px solid var(--accent); background: var(--card2); }
@media (max-width: 640px) { .pr-line { grid-template-columns: 1fr; } }
/* 本月已提出议案：提议方式下面的提示卡 */
.as-mdone { display: flex; align-items: baseline; gap: 12px; flex-wrap: wrap; margin-top: 8px; padding: 8px 12px; border: 1px solid color-mix(in srgb, var(--accent) 40%, var(--line)); border-left: 3px solid var(--accent); background: color-mix(in srgb, var(--accent) 7%, var(--card)); }
.as-mdone b { color: var(--accent); } .as-mdone small { color: var(--ink2); }
.pr-line > span { display: flex; flex-direction: column; gap: 2px; min-width: 0; } .pr-line small { font-size: 10.5px; color: var(--ink2); } .pr-line b { display: flex; align-items: center; flex-wrap: wrap; gap: 4px; font-size: 13px; }

/* 议案页卡片标题旁的「?」 */
.ln-q { display: inline-grid; place-items: center; width: 18px; height: 18px; border: 1px solid var(--accent); border-radius: 50%; color: var(--accent); font: 700 11px/1 var(--mono); cursor: help; border-bottom-width: 1px !important; }
.ln-q:hover { background: color-mix(in srgb, var(--accent) 20%, transparent); }
/* 学生会长特权线：3 格晶蓝进度格 */
.pv-bar { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 6px; margin: 4px 0; }
.pv-c { display: flex; flex-direction: column; gap: 2px; padding: 6px 8px; border: 1px solid var(--line); background: var(--card2); position: relative; min-width: 0; }
.pv-c > i { height: 8px; background: color-mix(in srgb, var(--accent) 12%, transparent); border: 1px solid color-mix(in srgb, var(--accent) 35%, transparent); }
.pv-c.on > i { background: var(--accent); box-shadow: 0 0 8px var(--glow); }
.pv-c b { font-family: var(--mono); font-size: 12px; color: var(--ink2); } .pv-c.on b { color: var(--accent); }
.pv-c small { font-size: 11px; color: var(--ink2); line-height: 1.35; }
.pv-c.push { cursor: pointer; border-color: var(--accent); animation: lbPush 1.1s ease-in-out infinite; }
.pv-c.push:hover { animation: none; background: color-mix(in srgb, var(--accent) 18%, var(--card2)); box-shadow: 0 0 10px var(--glow); }
.pv-c.push:not(.on) > i { background: color-mix(in srgb, var(--accent) 45%, transparent); }
.bq-log .vt-r { display: flex; flex-wrap: wrap; align-items: center; gap: 4px 10px; margin-top: 3px; font-size: 12px; } .bq-log .vt-r > span:first-child { flex: none; width: 3em; font-weight: 700; }
.pv-c b { display: flex; flex-direction: column; align-items: flex-start; gap: 1px; }   /* Lv 一行、名称一行（以前同一行挤着会把名称折断） */
.pv-c small.pv-cd { margin-top: auto; padding-top: 4px; font-family: var(--mono); font-size: 10.5px; color: color-mix(in srgb, var(--ink2) 80%, transparent); } .pv-c b em { font-style: normal; font-family: inherit; font-size: 13.5px; color: var(--ink); font-weight: 700; } .pv-c.on b em { color: var(--accent); }

/* 风纪委员会：委员长名片 + 风纪等级 / 校风两列 */
.fz-chief { margin-bottom: 8px; }
.fz-2col { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0 20px; align-items: start; }
@media (max-width: 640px) { .fz-2col { grid-template-columns: 1fr; } }
.fz-2col .kv b { flex-wrap: wrap; justify-content: flex-end; }

/* 风纪委员之路：三阶段进度卡片 */
.rd-row { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; }
@media (max-width: 700px) { .rd-row { grid-template-columns: 1fr; } }
.rd-c { display: flex; flex-direction: column; gap: 6px; padding: 10px 12px; border: 1px solid var(--line); background: var(--card2); min-width: 0; }
.rd-c.cur { border-color: var(--accent); box-shadow: 0 0 0 1px var(--accent) inset, 0 0 14px var(--glow); }
.rd-c.ok { border-color: color-mix(in srgb, var(--up, #2e9e4f) 50%, var(--line)); } .rd-c.todo { opacity: .55; }
.rd-h { display: flex; align-items: center; gap: 8px; } .rd-h b { font-size: 13.5px; }
.rd-n { display: grid; place-items: center; width: 22px; height: 22px; flex: none; border-radius: 50%; border: 1px solid var(--line2); font: 700 12px/1 var(--mono); color: var(--ink2); }
.rd-c.cur .rd-n { border-color: var(--accent); background: var(--accent); color: #061016; } .rd-c.ok .rd-n { border-color: var(--up, #2e9e4f); background: var(--up, #2e9e4f); color: #fff; }
.rd-d { font-size: 11.5px; color: var(--ink2); line-height: 1.5; }
.rd-bar { display: block; height: 10px; }
.rd-c .wbtn { margin: 4px 0 0; flex-direction: column; gap: 1px; } .rd-c .btn-why { font-size: 11px; color: var(--dn, #d24a4a); text-align: center; }

/* 理念树：这棵树当前提供的加成（取代原来的规则说明） */
.ji-sum { margin-top: 10px; padding-top: 8px; border-top: 1px solid color-mix(in srgb, var(--tc) 40%, transparent); }
.ji-sum > b { display: block; margin-bottom: 6px; font-size: 12px; color: var(--tc); letter-spacing: .08em; }
.ji-sum-g { display: flex; flex-wrap: wrap; gap: 4px 14px; font-size: 12.5px; } .ji-sum .dim { color: #8ba1b0; }
.ji-panel .ji-sum-g .md { color: #dce8ef; }
.ji-q { display: inline-grid; place-items: center; width: 16px; height: 16px; margin-left: 4px; border: 1px solid var(--tc); border-radius: 50%; color: var(--tc); font: 700 10px/1 var(--mono); cursor: help; vertical-align: middle; }

/* 系统页标题栏：「玩法说明」字样 + ？按钮 */
.card h3 > .sys-q-w { margin-left: auto; display: inline-flex; align-items: center; gap: 8px; } .card h3 > small + .sys-q-w { margin-left: 12px; }
.card h3 > .sys-q-w > .sys-q { margin-left: 0; }
.sys-q-l { color: var(--accent); font-size: 12.5px; font-weight: 600; letter-spacing: .06em; cursor: pointer; text-shadow: 0 0 8px var(--glow); }
.sys-q-l:hover { text-decoration: underline; }
.card.fz > .cc-tabs { margin: 14px 0 12px; border: 1px solid var(--line); border-radius: 4px; }   /* 风纪委员会：共用区下面的页签 */

/* 「▸ 明细」「▸ 查看升级」：全站一律晶蓝（不被所在行的灰色文字样式盖掉） */
.sk-more, .kv .sk-more, .stat .sk-more { color: var(--accent) !important; }
.vt-me { margin-top: 8px; } .vt-me > small { font-size: 11px; color: var(--ink2); }
.ca-back { margin: 4px 0 10px; }
.ln-grid.ln-grid3 { grid-template-columns: repeat(3, minmax(0, 1fr)); } @media (max-width: 960px) { .ln-grid.ln-grid3 { grid-template-columns: 1fr; } }
.jr-live { border-color: color-mix(in srgb, var(--accent) 55%, var(--line)); } .jr-team { display: flex; flex-wrap: wrap; gap: 6px 14px; margin: 6px 0; }
.wb-w > .wb-note { margin-top: 3px; font-size: 11.5px; color: var(--ink2); text-align: center; }   /* 大按钮下方的说明（非原因） */

/* 默认收起的板块（往届活动、近期结果） */
.fold { margin-top: 12px; border: 1px solid var(--line); background: var(--card2); }
.fold-h { padding: 8px 12px; cursor: pointer; font-weight: 700; font-size: 12.5px; color: var(--accent); letter-spacing: .06em; display: flex; align-items: center; gap: 8px; }
.fold-h:hover { background: color-mix(in srgb, var(--accent) 8%, transparent); } .fold-h small { margin-left: auto; color: var(--ink2); font-family: var(--mono); }
.fold.open > .fold-h { border-bottom: 1px dashed var(--line); } .fold > .log, .fold > .hint { padding: 4px 12px 8px; }
/* 校内活动：没有活动时的状态 */
.fe-idle { display: flex; flex-direction: column; align-items: center; gap: 4px; padding: 16px 12px; border: 1px dashed color-mix(in srgb, var(--accent) 40%, var(--line)); text-align: center; }
.fe-idle b { font-size: 16px; letter-spacing: .1em; } .fe-idle small { font-size: 11.5px; color: var(--ink2); }
.fe-log .vt-r { display: flex; flex-wrap: wrap; align-items: center; gap: 4px 12px; margin-top: 3px; font-size: 12px; } .fe-log .vt-r > span:first-child { flex: none; min-width: 4em; color: var(--ink2); }
.fe-pd { display: inline-flex; align-items: center; gap: 2px; }
.fb-conds { display: flex; flex-direction: column; gap: 2px; font-size: 12.5px; } .fb-conds > small { font-size: 10.5px; margin-bottom: 2px; } .fb-cond.up { color: var(--up, #2e9e4f); } .fb-cond.dn { color: var(--dn, #d24a4a); }

/* 议案卡：一行汇总「可提出 / 不可提出议案」，悬停看条件 */
.cond-sum { display: flex; align-items: center; gap: 8px; margin: 6px 0 2px; padding: 5px 10px; font-size: 12.5px; font-weight: 700; cursor: help; border: 1px solid currentColor; border-bottom-width: 1px !important; }
.cond-sum.up { color: var(--up, #2e9e4f); background: color-mix(in srgb, var(--up, #2e9e4f) 10%, transparent); }
.cond-sum.dn { color: var(--dn, #d24a4a); background: color-mix(in srgb, var(--dn, #d24a4a) 10%, transparent); }
.cond-sum .sk-more { margin-left: auto; font-weight: 400; }
.ln-c > .wbtn { margin: 4px 0 0; }
.el-c .ln-h .fac-t { font-size: 13.5px; font-weight: 700; } .el-fs { font-size: 11.5px; color: var(--ink2); margin-left: -4px; }
.fold > .tbl { margin: 4px 12px 8px; width: calc(100% - 24px); } .fold > .wbtn { margin: 4px 12px 10px; width: calc(100% - 24px); }
/* 展开过程中内容区高度不足会临时出现滚动条，正文变窄重排，展开完滚动条消失又变回去（文字「跳一下」）：展开期间不出滚动条 */
#modal.open.arming > .sheet:not(.folded) .sh-in, #modal.open.arming > .sheet:not(.folded) .sh-in > .choices,
#act-menu.arming .sh-in, #act-menu.arming .sh-in > .pop-scroll, #npc-card.arming .sh-in, #npc-card.arming .sh-in > .nc-grid { overflow-y: hidden; }
/* 进行中的活动 / 外征气泡：黄色、最前、带呼吸光效；按钮里写「活动中 / 外征中」 */
#bubbles .bub.busy { --bz: var(--e); }
#bubbles .bub.busy::before { background: linear-gradient(var(--bz), color-mix(in srgb, var(--bz) 30%, transparent)); }
#bubbles .bub.busy .bub-b { width: auto; min-width: 42px; padding: 0 10px; grid-auto-flow: column; gap: 5px; color: var(--bz); border-color: var(--bz);
  background: linear-gradient(160deg, color-mix(in srgb, var(--card) 75%, var(--bz)), color-mix(in srgb, var(--bg) 88%, var(--bz))); animation: busyGlow 2.2s ease-in-out infinite; }
#bubbles .bub.busy .bub-b svg { width: 18px; height: 18px; }
#bubbles .bub.busy .bub-l { font-size: 12px; letter-spacing: .08em; white-space: nowrap; }
@keyframes busyGlow { 0%, 100% { box-shadow: inset 0 0 10px color-mix(in srgb, var(--bz) 30%, transparent), 0 0 4px color-mix(in srgb, var(--bz) 30%, transparent); } 50% { box-shadow: inset 0 0 16px color-mix(in srgb, var(--bz) 55%, transparent), 0 0 14px color-mix(in srgb, var(--bz) 60%, transparent); } }
#bubbles .bub-dd.busy { border-color: var(--e); box-shadow: 0 0 18px color-mix(in srgb, var(--e) 35%, transparent); } #bubbles .bub-dd.busy .bb-h { color: var(--e); }
#bubbles .bb-info .bb-n { color: var(--ink2); } #bubbles .bb-info .bb-a { text-align: right; }
#bubbles .bb-sub { margin: 8px 0 2px; font-size: 11px; color: var(--e); letter-spacing: .05em; }
@media (prefers-reduced-motion: reduce) { #bubbles .bub.busy .bub-b { animation: none; } }
/* 学生会长特权：竖向列表（左侧竖条表示是否已开放；Lv 与名称同一行） */
.pv-bar { grid-template-columns: minmax(0, 1fr); gap: 5px; }
.pv-c { padding: 6px 10px 6px 16px; }
.pv-c > i { position: absolute; left: 5px; top: 6px; bottom: 6px; width: 4px; height: auto; }
.pv-c b { flex-direction: row; align-items: baseline; gap: 8px; }
.pv-c small.pv-cd { margin-top: 2px; padding-top: 0; font-family: inherit; }
/* 人物卡：概要 / 历史 页签；历史页和人生记录同一样式，内部滚动 */
.ncard > .nc-tabs { flex: none; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); margin-top: 8px; }
.ncard .sh-in > .nc-hist { flex: 1 1 auto; min-height: 0; overflow-y: auto; margin-top: 10px; padding-right: 4px; }
#npc-card.arming .sh-in > .nc-hist { overflow-y: hidden; }
.nc-hist .nh-me { display: inline-block; padding: 0 5px; margin-right: 2px; border: 1px solid var(--line2); border-radius: 3px; font-size: 10.5px; color: var(--accent); }
/* 人物卡固定高度：概要 / 历史切换时弹窗不跳；没有历史时提示在板子里居中 */
.ncard { height: 88vh; }
.ncard > .sh-body { flex: 1 1 auto; min-height: 0; }
.ncard .sh-in > .nc-hist-empty { display: flex; align-items: center; justify-content: center; text-align: center; }
.nc-hist-empty .hint { margin: 0; }
.ncard > .sh-body { grid-template-rows: minmax(0, 1fr); }
/* 外校校园：有活动限定事件的建筑 / 房间标黄点 */
.ev-dot { display: inline-flex; align-items: center; gap: 4px; margin-left: 6px; font-size: 11px; color: var(--e); white-space: nowrap; }
.ev-dot::before { content: ''; width: 7px; height: 7px; border-radius: 50%; background: var(--e); box-shadow: 0 0 6px var(--e); animation: evDot 1.6s ease-in-out infinite; }
@keyframes evDot { 50% { opacity: .45; } }
/* 任务：日常巡逻强度——标题一行；平行四边形格子 + 两侧箭头 */
.tg-t { font-size: 12px; color: var(--ink2); margin-bottom: 4px; }
.task-grid .tg-cells { gap: 4px; } .task-grid .tg-cells i { width: 24px; height: 18px; transform: skewX(-22deg); border-radius: 0; cursor: pointer; }
.task-grid .spd-b { height: 20px; }
.tg-cur { display: flex; flex-direction: column; align-items: flex-start; gap: 3px; margin-top: 6px; font-size: 12px; color: var(--ink2); } .tg-cur .st-d { display: inline-block; width: auto; }   /* 一项一行 */ .tg-cur .st-d { cursor: help; border-bottom: 1px dashed var(--line2); }
/* 人物卡改成固定高度后，内容区的 0fr→1fr 伸展只会在已经撑满的框里挤成一条：改成整张卡从上往下展开（框体先横向出现，再纵向长到 88vh） */
#npc-card.arming > .ncard { animation: shFrame .22s cubic-bezier(.2,.8,.2,1) both, ncGrow .62s cubic-bezier(.22,.9,.24,1) .12s both; }
#npc-card.arming > .ncard > .sh-body { animation: ncFade .5s ease-out .2s both; }
@keyframes ncGrow { from { max-height: 120px; } to { max-height: 88vh; } }
@keyframes ncFade { from { opacity: .15; } to { opacity: 1; } }
.fe-leave { margin-top: 10px; } .fe-leave .wbtn { width: 100%; }
.bd-upbig { display: flex; flex-direction: column; align-items: center; gap: 3px; width: 100%; margin: 6px 0 10px; } .bd-upbig small { display: flex; gap: 12px; font-size: 12px; font-weight: 400; }
/* 滚动条：轻科幻风——细轨道 + 发光的强调色滑块，没有上下箭头 */
@supports not selector(::-webkit-scrollbar) { * { scrollbar-width: thin; scrollbar-color: color-mix(in srgb, var(--accent) 55%, transparent) transparent; } }   /* Firefox；Chromium 设了标准属性会忽略下面的 ::-webkit-scrollbar */
::-webkit-scrollbar { width: 8px; height: 8px; }
::-webkit-scrollbar-track { background: linear-gradient(90deg, transparent 3px, color-mix(in srgb, var(--accent) 14%, transparent) 3px, color-mix(in srgb, var(--accent) 14%, transparent) 5px, transparent 5px); }
::-webkit-scrollbar-thumb { border: 2px solid transparent; background-clip: padding-box; background-color: color-mix(in srgb, var(--accent) 55%, transparent); border-radius: 0; box-shadow: inset 0 0 4px color-mix(in srgb, var(--accent) 80%, transparent); }
::-webkit-scrollbar-thumb:hover { background-color: var(--accent); box-shadow: 0 0 6px var(--glow); }
::-webkit-scrollbar-button { display: none; width: 0; height: 0; }
::-webkit-scrollbar-corner { background: transparent; }
/* 弹窗 / 菜单 / 人物卡里的滚动区：始终预留滚动条的位置，打开时滚动条出现或消失不会让内容重排 */
.ncard .sh-in > .nc-grid, .ncard .sh-in > .nc-hist, .amenu .sh-in > .pop-scroll, #modal .sh-in, #modal .sh-in > .choices { scrollbar-gutter: stable; }
.cc-act .cc-story { display: block; margin: 2px 0 4px; font-size: 12px; line-height: 1.6; color: var(--ink2); font-style: italic; border-left: 2px solid var(--line2); padding-left: 8px; }
.fe-cp { display: inline-flex; align-items: center; gap: 10px; } .fe-cp small { cursor: help; font-family: var(--mono); }
/* 议案详情：风纪委员长（截断人物卡 + 表态）；表态颜色压过悬停下划线的默认色 */
.as-fk > b { display: inline-flex; align-items: center; gap: 10px; min-width: 0; } .as-fk .fk-v { white-space: nowrap; }
.fk-v.st-d.dn, .bq-fk b.dn { color: var(--r); } .fk-v.st-d.up, .bq-fk b.up { color: var(--g); }
/* 议案表决：投票人 / 风纪委员长的政治倾向徽章 */
.vt-who { display: inline-flex; align-items: center; gap: 8px; flex-wrap: wrap; } .vt-ism { display: inline-flex; gap: 3px; } .vt-ism .ism { font-size: 10.5px; }
.vt-ism .ism-hit.up .ism { box-shadow: 0 0 0 1px var(--g); } .vt-ism .ism-hit.dn .ism { box-shadow: 0 0 0 1px var(--r); }
.as-fk > b { gap: 14px; } .as-fk .vt-ism { margin-right: 4px; }
.fz-au { margin-left: auto; display: inline-flex; align-items: baseline; gap: 2px; font-family: var(--mono); } .fz-au small { font-size: 11.5px; }

/* 力量平衡条：虚线 = 回归目标；超出部分呼吸发光 + 回拉箭头，未达到部分内发光 + 前进箭头 */
.bb-bal { position: relative; flex: 1 1 auto; height: 10px; margin: 0 10px; background: color-mix(in srgb, var(--line2) 60%, transparent); overflow: visible; }
.bb-bal .bb-fill { position: absolute; left: 0; top: 0; bottom: 0; background: var(--p); } .bb-bal.over .bb-fill { background: var(--r); }
.bb-bal .bb-tg { position: absolute; top: -5px; bottom: -5px; width: 0; border-left: 2px dashed var(--ink); transform: translateX(-1px); z-index: 2; }
.bb-bal .bb-gap { position: absolute; top: 0; bottom: 0; overflow: hidden; z-index: 1; }
.bb-bal .bb-gap.hi { box-shadow: inset 0 0 6px 1px #fff; animation: balBreath 1.8s ease-in-out infinite; }
.bb-bal .bb-gap.lo { box-shadow: inset 0 0 0 1px var(--p), inset 0 0 8px color-mix(in srgb, var(--p) 70%, transparent); }
.bb-bal .bb-arr { position: absolute; top: 50%; font-size: 9px; line-height: 1; color: #fff; text-shadow: 0 0 4px var(--p); transform: translateY(-50%); }
.bb-bal .bb-gap.hi .bb-arr { animation: balBack 1.6s ease-in-out infinite; }
.bb-bal .bb-gap.lo .bb-arr { animation: balFwd 1.6s linear infinite; color: var(--p); }
@keyframes balBreath { 0%, 100% { box-shadow: inset 0 0 4px 0 rgba(255,255,255,.35); filter: brightness(1); } 50% { box-shadow: inset 0 0 9px 2px rgba(255,255,255,.85); filter: brightness(1.35); } }
@keyframes balBack { 0% { left: calc(100% - 10px); opacity: 0; } 20% { opacity: 1; } 100% { left: 0; opacity: 0; } }
@keyframes balFwd { 0% { left: 0; opacity: 0; } 20% { opacity: 1; } 100% { left: calc(100% - 10px); opacity: 0; } }
@media (prefers-reduced-motion: reduce) { .bb-bal .bb-gap, .bb-bal .bb-arr { animation: none !important; } }

/* 力量平衡：天平（倾斜角 = 偏向哪边）、现在的影响清单 */
.fz-scale { display: flex; flex-direction: column; align-items: center; margin: 4px 0 8px; } .fz-scale svg { width: 240px; max-width: 100%; height: auto; overflow: visible; }
.fz-scale line { stroke: var(--ink2); stroke-width: 1.6; } .fz-scale .sc-beam line { stroke: var(--ink); stroke-width: 3; stroke-linecap: round; }
.fz-scale .sc-beam { transform-origin: 0 -8px; transform-box: view-box; transition: transform .8s cubic-bezier(.3,1.4,.5,1); }
.fz-scale .sc-base { fill: var(--line2); } .fz-scale .sc-post { stroke: var(--ink2); stroke-width: 3; } .fz-scale .sc-pin { fill: var(--accent); }
.fz-scale .sc-pan { stroke: none; } .fz-scale .sc-pan.s { fill: color-mix(in srgb, var(--y) 70%, transparent); } .fz-scale .sc-pan.f { fill: color-mix(in srgb, var(--p) 75%, transparent); }
.fz-scale text { font-size: 11px; fill: var(--ink2); }
.fz-scale > b { font-size: 12px; } .fz-scale .sc-f { color: var(--p); } .fz-scale .sc-s { color: var(--y); }
.fz-eff { margin: 4px 0 0; padding-left: 18px; font-size: 12.5px; line-height: 1.7; color: var(--ink2); }
/* 条件清单（ui_cond.js，全站统一）：「条件」+ 逐行 ✓ / ✗ */
.cond-l { margin: 6px 0 2px; font-size: 12px; line-height: 1.5; text-align: left; } .cond-l > small { display: block; color: var(--ink2); font-size: 11px; margin-bottom: 1px; }
.cond-l ul { margin: 0; padding: 0; list-style: none; display: grid; gap: 1px; } .cond-l li { display: flex; align-items: baseline; gap: 6px; } .cond-l li > b { width: 1em; flex: none; text-align: center; } .cond-l li small { margin-left: 4px; }
.cond-l li.up { color: var(--up, #3fae7a); } .cond-l li.dn { color: var(--dn, #d24a4a); }
.wb-w > .cond-l { align-self: stretch; }
/* 天平两边：学生会 / 风纪委员会的力量 */
.fz-scw { display: flex; align-items: center; justify-content: center; gap: 12px; } .fz-scw .fz-scale { flex: 0 1 260px; }
.fz-side { display: flex; flex-direction: column; align-items: center; gap: 2px; min-width: 96px; padding: 8px 12px; border: 1px solid var(--line2); border-radius: 4px; background: var(--card2); }
.fz-side b { font-family: var(--mono); font-size: 20px; } .fz-side.s b { color: var(--y); } .fz-side.f b { color: var(--p); } .fz-side small { font-size: 11px; color: var(--ink2); }
@media (max-width: 760px) { .fz-side { min-width: 72px; padding: 6px 8px; } .fz-side b { font-size: 16px; } }
.fz-eta { margin: 2px 0 6px; text-align: center; font-size: 12px; color: var(--ink2); }
/* 议案：你选中的表态 */
.wbtn.vt-pick.on { border-color: var(--accent); background: color-mix(in srgb, var(--accent) 28%, var(--card2)); color: #fff; box-shadow: 0 0 0 1px var(--accent) inset, 0 0 12px color-mix(in srgb, var(--accent) 45%, transparent); }
.wbtn.vt-pick.on::before { content: '✓ '; }
.wbtn.vt-pick:disabled:not(.on) { opacity: .4; }
/* kv 行里的进度条：标题长（日语）时进度条先收窄，不把右边的「明细」挤出格子 */
.kv .bar { width: auto; flex: 0 1 120px; min-width: 36px; }
.kv > span:first-child { min-width: 0; }
/* kv 行：进度条 + 条末数值 */
.kv-bv { display: inline-flex; align-items: center; gap: 8px; min-width: 0; } .kv-bv .bar { flex: 0 1 120px; width: auto; min-width: 36px; } .kv-bv b { min-width: 2.2em; text-align: right; }
/* 三派卡「当前方针」：方针名下面一行写加成 */
.pol-fx { display: flex; flex-wrap: wrap; gap: 2px 10px; margin-top: 4px; font-size: 12.5px; font-weight: 400; }
/* 学校一览的要员：两列 */
.off-2c { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); column-gap: 18px; }
.off-2c .off-r { grid-template-columns: minmax(0, 7.5em) minmax(0, 1fr) auto; }
@media (max-width: 760px) { .off-2c { grid-template-columns: 1fr; } }
/* 战斗：技能按钮上的倒计时条（持续时间 / 冷却） */
.bt-rab { position: relative; }
.ra-bars { display: flex; flex-direction: column; gap: 2px; width: 100%; margin-top: 3px; }
.ra-bar { display: block; height: 3px; border-radius: 2px; background: color-mix(in srgb, var(--line) 70%, transparent); overflow: hidden; opacity: 0; transition: opacity .2s; }
.ra-bar.on { opacity: 1; } .ra-bar em { display: block; height: 100%; width: 0; }
.ra-bar.dur em { background: var(--accent); box-shadow: 0 0 6px var(--glow); } .ra-bar.cd em { background: color-mix(in srgb, var(--ink2) 80%, transparent); }
/* 活动提案：环节槽（凹槽 + 晶蓝加号）与环节卡（和凹槽一样大） */
.fg-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)); gap: 8px; margin: 6px 0; }
.fg-slot, .fg-card { position: relative; min-height: 210px; border-radius: 6px; }
.fg-slot { display: flex; align-items: center; justify-content: center; background: color-mix(in srgb, var(--bg) 70%, #000); box-shadow: inset 0 3px 8px rgba(0,0,0,.55), inset 0 -1px 0 color-mix(in srgb, var(--accent) 20%, transparent); border: 1px dashed color-mix(in srgb, var(--accent) 35%, transparent); }
.fg-slot.on { border-style: solid; border-color: var(--accent); box-shadow: inset 0 3px 8px rgba(0,0,0,.55), 0 0 12px color-mix(in srgb, var(--accent) 35%, transparent); }
.fg-slot.full { display: block; background: none; box-shadow: none; border: none; }
.fg-slot:not(.full) { width: 100%; padding: 0; cursor: pointer; clip-path: none; color: inherit; font: inherit; transition: border-color .15s, box-shadow .15s; }
.fg-slot:not(.full):hover { border-color: var(--accent); }
.fg-plus { font-size: 46px; font-weight: 300; line-height: 1; color: #39d0e0; text-shadow: 0 0 10px color-mix(in srgb, #39d0e0 60%, transparent); transition: transform .15s; }
.fg-slot:hover .fg-plus { transform: scale(1.12); }
.fg-no { position: absolute; left: 6px; top: 4px; font-family: var(--mono); font-size: 11px; color: var(--ink2); }
.fg-card { display: flex; flex-direction: column; gap: 4px; padding: 10px 10px 8px; height: 100%; box-sizing: border-box; background: var(--card2); border: 1px solid var(--line2); }
.fg-card.pick { cursor: pointer; transition: border-color .15s, transform .15s; } .fg-card.pick:hover { border-color: var(--accent); transform: translateY(-2px); }
.fg-pix { display: flex; justify-content: center; padding: 4px 0; background: color-mix(in srgb, var(--accent) 8%, transparent); border-radius: 4px; } .fg-art { width: 60px; height: 60px; }
.fg-n { font-size: 13.5px; text-align: center; } .fg-d { margin: 0; font-size: 11.5px; line-height: 1.5; color: var(--ink2); flex: 1; } .fg-pz { font-size: 11px; line-height: 1.45; }
.fg-x { align-self: stretch; margin-top: 2px; }
.fg-menu { margin: 4px 0 8px; padding: 8px; border: 1px solid color-mix(in srgb, var(--accent) 45%, transparent); border-radius: 6px; max-height: 300px; overflow-y: auto; } .fg-menu > small { color: var(--ink2); }
.fe-list { max-height: 260px; overflow-y: auto; padding-right: 6px; }   /* 活动提案：合作 / 来访学校清单 */
.fe-submit { display: flex; flex-direction: column; margin-top: 8px; } .fe-submit .wbtn { width: 100%; flex-direction: column; gap: 2px; }   /* 活动提案：整行大按钮 */
/* 顶部页签的快捷键键帽（电脑端；触屏 / 窄屏不显示） */
.tab-kb { margin-left: 5px; padding: 0 4px; min-width: 1.3em; font-family: var(--mono); font-size: 10px; line-height: 15px; text-align: center; color: var(--ink2); border: 1px solid var(--line2); border-bottom-width: 2px; border-radius: 3px; background: color-mix(in srgb, var(--card2) 70%, transparent); opacity: .75; }
#tabs button.on .tab-kb { color: var(--accent); border-color: color-mix(in srgb, var(--accent) 60%, transparent); }
@media (hover: none), (max-width: 760px) { .tab-kb { display: none; } }
.sb.sb-res { background: #6b5aa8; color: #fff; }   /* 身份：研究员（毕业生） */
/* 改造零件卡（零件店 / 库存 / 换装）：部位图标 → 稀有度 + 名字 → 属性 → 替换 → 按钮 */
.pt-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(170px, 1fr)); gap: 8px; margin: 6px 0 10px; }
.pt-card { display: flex; flex-direction: column; gap: 4px; padding: 10px; border: 1px solid var(--line2); border-radius: 6px; background: var(--card2); }
.pt-card.r-R { border-color: color-mix(in srgb, #3f7fbf 45%, var(--line2)); } .pt-card.r-SR { border-color: color-mix(in srgb, #9a5bd0 50%, var(--line2)); } .pt-card.r-SSR { border-color: color-mix(in srgb, #d79b2b 60%, var(--line2)); box-shadow: 0 0 10px color-mix(in srgb, #d79b2b 25%, transparent); }
.pt-h { display: flex; align-items: center; gap: 8px; } .pt-h small { color: var(--ink2); font-size: 11.5px; } .pt-h .tag { margin-left: auto; }
.pt-ico { width: 34px; height: 34px; flex: none; padding: 3px; border-radius: 6px; background: color-mix(in srgb, var(--accent) 8%, transparent); }
.pt-n { font-size: 13.5px; display: flex; align-items: center; gap: 2px; } .pt-st { font-size: 12px; } .pt-cmp { font-size: 11.5px; color: var(--ink2); flex: 1; }
.pt-card .wbtn { width: 100%; margin-top: 4px; flex-direction: column; gap: 1px; }
.pt-card .wbtn { display: flex; align-items: center; justify-content: center; } .pt-card .wbtn > small { position: static; margin: 0; }   /* 价格在按钮文字下面 */
.ev-dot.used { opacity: .45; filter: grayscale(.6); }   /* 本周逛的次数用完 */
/* 舞台演出（演唱会）：热度条 + 体力格 */
.cc-heat { margin: 6px 0 4px; padding: 8px 10px; border: 1px solid color-mix(in srgb, #ff6fae 35%, var(--line2)); border-radius: 6px; background: linear-gradient(180deg, color-mix(in srgb, #ff6fae 7%, transparent), transparent); }
.cc-hl { display: flex; justify-content: space-between; align-items: baseline; font-size: 12px; color: var(--ink2); margin-bottom: 4px; } .cc-hl b { font-family: var(--mono); font-size: 14px; color: var(--ink); } .cc-hl b.up { color: #ff6fae; } .cc-hl b.dn { color: var(--ink2); }
.cc-bar { position: relative; height: 14px; border-radius: 7px; background: color-mix(in srgb, var(--line) 80%, transparent); overflow: visible; }
.cc-fill { position: absolute; top: 0; bottom: 0; border-radius: 7px; transition: left .35s, width .35s; }
.cc-fill.me { background: linear-gradient(90deg, #ff9ac8, #ff4f9a); box-shadow: 0 0 10px color-mix(in srgb, #ff4f9a 60%, transparent); }
.cc-fill.opp { background: linear-gradient(90deg, #5a6474, #8a93a2); }
.cc-mid { position: absolute; left: 50%; top: -3px; bottom: -3px; width: 2px; margin-left: -1px; background: var(--ink2); opacity: .6; }
.cc-ptr { position: absolute; top: 50%; width: 16px; height: 16px; margin: -8px 0 0 -8px; border-radius: 50%; background: #fff; box-shadow: 0 0 0 2px #ff4f9a, 0 0 12px #ff4f9a; transition: left .35s; }
.cc-sta { display: flex; align-items: center; gap: 6px; margin-top: 6px; font-size: 11px; color: var(--ink2); }
.cc-pips { display: flex; gap: 3px; } .cc-pips i { width: 10px; height: 6px; border-radius: 2px; background: color-mix(in srgb, var(--line) 80%, transparent); } .cc-pips i.on { background: #f2c94c; box-shadow: 0 0 4px color-mix(in srgb, #f2c94c 60%, transparent); }
.lb-sc i.lvh { cursor: pointer; } .lb-sc i.lvh:hover { outline: 1px solid var(--accent); outline-offset: 1px; } .lb-cur.fx-hrow { cursor: pointer; }   /* 政策线议案：格子与当前档位可点开效果说明 */
/* 有事件没处理（含「先收起来」）：弹窗外会改变游戏状态的按钮置灰（main.js markPending） */
.pend-off { opacity: .4 !important; cursor: not-allowed !important; filter: grayscale(.5); }

/* 学生会外征：上一场的结果（空状态顶上） */
.cx-last { display: flex; flex-direction: column; gap: 2px; padding: 8px 12px; margin-bottom: 8px; border: 1px solid var(--line); border-left: 3px solid var(--ink2); background: var(--card); }
.cx-last.up { border-left-color: var(--up, #3fb27f); } .cx-last.dn { border-left-color: var(--dn, #d24a4a); }
.cx-last b { font-size: 13.5px; } .cx-last small { font-size: 11.5px; color: var(--ink2); }

/* 迎击作战：每轮战报（各部队分到 / 击破 / 漏掉 / 失去战斗力；限高滚动） */
.op-rep { display: flex; flex-direction: column; gap: 2px; }
.op-rrs { max-height: 240px; overflow-y: auto; display: flex; flex-direction: column; gap: 4px; border-top: 1px dashed var(--line); padding-top: 4px; }
.op-rr { display: grid; grid-template-columns: minmax(0, 1.3fr) repeat(3, auto) minmax(0, 1.6fr); gap: 4px 10px; align-items: center; font-size: 12px; padding: 3px 0; border-bottom: 1px solid color-mix(in srgb, var(--line) 50%, transparent); }
.op-rr.me { color: var(--accent); } .op-rr.out { opacity: .65; }
.op-rr > span:last-child:not(:nth-child(5)) { grid-column: 1 / -1; font-size: 11.5px; }
.op-rn { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-weight: 600; }
@media (max-width: 620px) { .op-rr { grid-template-columns: repeat(3, minmax(0, 1fr)); } .op-rr > .op-rn, .op-rr > span:nth-child(5) { grid-column: 1 / -1; } }

/* 调试开局的选项组（本地才有）：Garden 选「随机」时才显示军团制度 / 学生会制度 */
.dbg .dbg-o { display: inline-flex; flex-direction: column; gap: 1px; min-width: 0; flex: 1 1 110px; } .dbg .dbg-o small { font-size: 10px; opacity: .7; }
.dbg .dbg-r { display: none; gap: 4px; flex: 1 1 230px; min-width: 0; } .dbg.dbg-rnd .dbg-r { display: inline-flex; }
.dbg .dbg-pre { display: inline-flex; gap: 4px; flex: 1 1 100%; min-width: 0; align-items: center; }

/* 学生会外征卡片：属性两列（手机一列）；花声望邀请外校军团（展开列表） */
.cx-grid { display: grid; grid-template-columns: 1fr 1fr; column-gap: 22px; }
.cx-grid > span:empty { display: block; }
@media (max-width: 640px) { .cx-grid { grid-template-columns: 1fr; } .cx-grid > span:empty { display: none; } }
.cx-inv { margin: 8px 0; }
.cx-inv > summary { list-style: none; cursor: pointer; display: block; }
.cx-inv > summary::-webkit-details-marker { display: none; }
.cx-inv .alist { margin-top: 6px; }
.cx-inv .row { display: flex; align-items: center; gap: 10px; }
.cx-inv .row > span:first-child { flex: 1; min-width: 0; }
/* 外征的军团卡：等宽排列（[评级] 军团名 / 队长 / 战力） */
.cx-legs.cards { display: grid; grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)); gap: 6px; }
.cx-legs.cards .cx-lg { border: 1px solid var(--line); background: var(--card); padding: 6px 8px; display: flex; flex-direction: column; gap: 3px; min-width: 0; }
.cx-legs.cards .cx-lg.me { border-color: var(--accent); }
.cx-lg-h { display: flex; align-items: center; gap: 6px; min-width: 0; }
.cx-lg-h b { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.cx-lg-r { display: flex; align-items: center; justify-content: space-between; gap: 6px; font-size: 12px; min-width: 0; }
/* 事件选项右侧的大号数字（邀请军团的积分等）：绝对定位在按钮右边，按钮右侧留出空位 */
.choices button:has(.ch-score) { position: relative; padding-right: 96px; }
.choices .ch-score { position: absolute; right: 18px; top: 50%; transform: translateY(-50%); font-size: 26px; font-weight: 700; font-family: var(--mono, monospace); line-height: 1; }

/* 多选卡片窗（选军团等，ui.js pickHtml） */
.pick-w { margin-top: 10px; }
.pick-hd { display: flex; justify-content: space-between; align-items: baseline; margin-bottom: 6px; font-size: 13px; color: var(--ink2); } .pick-hd b { font-family: var(--mono); color: var(--accent); }
.pick-g { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(230px, 100%), 1fr)); gap: 8px; max-height: min(46vh, 420px); overflow-y: auto; padding: 2px; }
.pick-c { display: flex; gap: 10px; align-items: flex-start; text-align: left; padding: 10px 12px; border: 1px solid var(--line); background: var(--card2); border-radius: 6px; min-width: 0; clip-path: none; }
.pick-c:hover:not([disabled]) { border-color: color-mix(in srgb, var(--accent) 60%, var(--line)); }
.pick-c, .pick-c.on { color: var(--ink); }   /* 盖过通用 button.on（暗色主题下是深色字） */
.pick-c .pk-b b { color: var(--accent); }
.pick-c.on { border-color: var(--accent); background: color-mix(in srgb, var(--accent) 12%, var(--card2)); box-shadow: 0 0 0 1px var(--accent) inset; }
.pick-c[disabled] { opacity: .45; }
.pk-x { flex: none; width: 18px; height: 18px; margin-top: 1px; border: 1.5px solid var(--ink2); border-radius: 3px; display: grid; place-items: center; font-size: 12px; font-weight: 700; color: #fff; }
.pick-c.on .pk-x { background: var(--accent); border-color: var(--accent); }
.pk-b { display: flex; flex-direction: column; gap: 2px; min-width: 0; } .pk-b b { font-size: 14px; } .pk-b small { font-size: 12px; line-height: 1.5; }
.pick-f { display: flex; flex-direction: column; gap: 8px; margin-top: 10px; } .pick-f button { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 2px; width: 100%; min-height: 44px; }   /* 出发、返回各占一整行 */
.pick-f button small { font-size: 12.5px; font-weight: 600; color: inherit; opacity: .9; } .pick-f button.cta small { color: inherit; opacity: .95; }

/* 战斗：撤退大按钮（tbattle_ui.js #bt-retw） */
#bt-retw:empty { display: none; }
.bt-retreat { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 2px; width: 100%; min-height: 48px; margin: 8px 0; font-size: 16px; font-weight: 700; color: var(--bad, #e05a6a); border: 1px solid color-mix(in srgb, var(--bad, #e05a6a) 60%, var(--line)); background: color-mix(in srgb, var(--bad, #e05a6a) 10%, var(--card2)); }
.bt-retreat:hover:not([disabled]) { background: color-mix(in srgb, var(--bad, #e05a6a) 20%, var(--card2)); }
.bt-retreat small { font-size: 12px; font-weight: 400; color: var(--ink2); }
.bt-retreat[disabled] { opacity: .45; }

/* 战斗成员卡：倒地后的复活倒计时条（tbattle_ui.js drawMembers） */
.bt-mm .mm-b.rv em { background: #f0c050; } .bt-mm .mm-b.rv b { color: #f0c050; font-size: 11px; white-space: nowrap; }

/* 人生记录 / 战况记录：条目里的换行照样显示（作战总结等多行清单） */
.le > div { white-space: pre-line; }

/* 持续活动（busy.js）：状态标签——人物卡、成员名单、军团卡、各面板的军团名旁 */
.act-b { display: inline-block; margin-left: 4px; padding: 0 6px; border-radius: 3px; font-size: 11px; line-height: 17px; white-space: nowrap; vertical-align: middle;
  border: 1px solid var(--line); color: var(--ink2); }
.act-b.act-raid_home, .act-b.act-raid_adj { color: var(--bad); border-color: currentColor; }
.act-b.act-rest { color: var(--y); border-color: currentColor; }
.act-b.act-exp, .act-b.act-jsurv { color: var(--accent); border-color: currentColor; }
.act-b.act-fest { color: var(--p); border-color: currentColor; }
.act-b.act-down { color: var(--bad); border-style: dashed; }
.mb-act { display: block; margin-top: 2px; }
.mb-act .act-b { margin-left: 0; }
.gl-v { display: flex; flex-wrap: wrap; gap: 4px 8px; align-items: center; margin-top: 2px; }
.gl-v .act-b { margin-left: 0; }
.op-sus { display: inline-flex; align-items: center; gap: 4px; }
.op-sus .bar { width: 56px; height: 6px; display: inline-block; }
.op-bg { padding: 6px 0; border-top: 1px dashed var(--line); }
.op-bg:first-of-type { border-top: 0; }
.op-bg .bar { width: 80px; height: 6px; display: inline-block; vertical-align: middle; margin-left: 6px; }

/* 开发控制台：每行一组按钮（第二行是莉莉属性） */
#dev-con .dev-row { display: flex; align-items: center; gap: 4px; }

/* 接力赛：每队一条进度条（4 段，段与段之间是竖线），当前在跑的那一段高亮，掉棒的那段标红 */
.rl-race { display: flex; flex-direction: column; gap: 5px; margin: 6px 0; }
.rl-race .rl-hd, .rl-race .rl-row { display: grid; grid-template-columns: 1.6em minmax(5em, 8em) 1fr minmax(7em, 11em); gap: 8px; align-items: center; }
.rl-hd { font-size: 11px; color: var(--ink2); }
.rl-rk { font-family: var(--mono); text-align: center; }
.rl-nm { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.rl-race .rl-row.me .rl-nm { color: var(--accent); font-weight: 700; }
.rl-bar { display: grid; grid-template-columns: repeat(4, 1fr); height: 12px; border: 1px solid var(--line); border-radius: 3px; overflow: hidden; background: var(--card2); }
.rl-seg { display: block; height: 100%; border-left: 2px solid var(--line2); background: linear-gradient(90deg, var(--ink2) var(--f), transparent var(--f)); opacity: .55; }
.rl-seg:first-child { border-left: 0; }
.rl-race .rl-row.me .rl-seg { background: linear-gradient(90deg, var(--accent) var(--f), transparent var(--f)); opacity: .9; }
.rl-seg.cur { opacity: 1; }
.rl-seg.drop { box-shadow: inset 0 -3px 0 var(--bad); }
.rl-at { color: var(--ink2); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
@media (max-width: 640px) { .rl-race .rl-hd { display: none; } .rl-race .rl-row { grid-template-columns: 1.4em minmax(4em, 6em) 1fr; } .rl-at { grid-column: 2 / -1; } }

/* 从事件弹窗里（经人物卡）打开的互动菜单：盖在事件（65）和人物卡（68）之上 */
#act-menu.over-modal { z-index: 70; }

/* 弹窗选项两列卡片（view.grid = 2，购物网站等）：带 .ch-full 的选项（关闭）占整行；手机上回到一列 */
#modal .choices.ch-g2 { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
#modal .choices.ch-g2 > button, #modal .choices.ch-g2 > .ch-row { margin: 0; min-width: 0; }
#modal .choices.ch-g2 > .ch-full { grid-column: 1 / -1; }
@media (max-width: 640px) { #modal .choices.ch-g2 { grid-template-columns: 1fr; } }

/* 稀有技能未觉醒卡：和已觉醒的技能卡同一位置，虚线框 */
.sk.sk-none { border: 1px dashed var(--line2); background: var(--card2); margin-bottom: 10px; }
.sk.sk-none .sk-h { display: flex; gap: 10px; align-items: baseline; }
.sk.sk-none .desc { margin: 6px 0 0; }

/* 未觉醒技能卡的「效果」折叠标题：和卡内其他小标题同一行高，点开展开属性 / 实战 */
.sk-fx { margin-top: 8px; border-top: 1px dashed var(--line); padding-top: 6px; }
.sk-fx > summary { cursor: pointer; font-weight: 700; color: var(--ink2); list-style: none; user-select: none; }
.sk-fx > summary::-webkit-details-marker { display: none; }
.sk-fx > summary::before { content: '▸ '; color: var(--accent); }
.sk-fx[open] > summary::before { content: '▾ '; }
.sk-fx[open] > summary { margin-bottom: 6px; }

/* 折叠标题（效果 / 固有技）：整行、带边框，悬停整行高亮 */
.sk-fx { margin-top: 8px; border-top: 0; padding-top: 0; }
.sk-fx > summary { display: flex; align-items: center; gap: 6px; padding: 7px 10px; border: 1px solid var(--line); border-radius: 4px; background: var(--card2); color: var(--ink); transition: background .15s, border-color .15s; }
.sk-fx > summary::before { content: '▸'; color: var(--accent); }
.sk-fx[open] > summary::before { content: '▾'; }
.sk-fx > summary:hover { background: color-mix(in srgb, var(--accent) 14%, var(--card2)); border-color: var(--accent); }
.sk-fx[open] > summary { margin-bottom: 0; border-bottom-left-radius: 0; border-bottom-right-radius: 0; border-color: var(--accent); }
.sk-fx > .sk-fx-in { border: 1px solid var(--line); border-top: 0; border-radius: 0 0 4px 4px; padding: 8px 10px; }
.sk-fx > .sk-fx-in > .inh-b { margin: 0; border: 0; padding: 0; background: none; }

/* 折叠标题 · 轻科幻：左侧亮条、右上切角、淡渐变底、字距加宽，菱形标记展开时转 45°；固有技换成金黄基调（--fx-c） */
.sk-fx { --fx-c: var(--accent); }
.sk-fx.sk-fx-inh { --fx-c: var(--e); }
.sk-fx > summary { position: relative; padding: 6px 14px 6px 16px; border: 1px solid color-mix(in srgb, var(--fx-c) 35%, var(--line)); border-radius: 0;
  background: linear-gradient(90deg, color-mix(in srgb, var(--fx-c) 12%, transparent), transparent 65%); box-shadow: inset 3px 0 0 var(--fx-c);
  clip-path: polygon(0 0, calc(100% - 9px) 0, 100% 9px, 100% 100%, 0 100%); letter-spacing: .14em; font-size: 12.5px; color: var(--ink); }
.sk-fx > summary::before { content: ''; width: 6px; height: 6px; border: 1.5px solid var(--fx-c); transform: rotate(0deg); transition: transform .2s, background .2s; flex: none; }
.sk-fx[open] > summary::before { content: ''; transform: rotate(45deg); background: var(--fx-c); }
.sk-fx > summary:hover { background: linear-gradient(90deg, color-mix(in srgb, var(--fx-c) 24%, transparent), color-mix(in srgb, var(--fx-c) 6%, transparent)); border-color: var(--fx-c); }
.sk-fx[open] > summary { border-color: var(--fx-c); }
.sk-fx > .sk-fx-in { border: 1px solid color-mix(in srgb, var(--fx-c) 30%, var(--line)); border-top: 0; border-radius: 0; box-shadow: inset 3px 0 0 color-mix(in srgb, var(--fx-c) 35%, transparent); }
.sk-fx.sk-fx-inh > summary { color: color-mix(in srgb, var(--fx-c) 70%, var(--ink)); }

/* 技能页：子页签下面的内容，和子页签之间留点距离；次级技能开头的「已觉醒 / 上限」 */
.sk-subtabs { margin: 4px 0 12px; }
.sk-caprow { display: flex; align-items: baseline; gap: 8px; margin: 0 0 10px; color: var(--ink2); }

/* ===== 收纳栏（.fold）：全站统一的折叠标题 =====
   <details class="fold"><summary>标题</summary>…</details>；金黄基调 .fold-gold；内容和标题连成一框时包 .fold-in
   左侧亮条、右上切角、淡渐变底、字距加宽、菱形标记（展开转 45° 并填色）、悬停整行高亮 */
details.fold { --fx-c: var(--accent); margin-top: 8px; }
details.fold.fold-gold { --fx-c: var(--e); }
details.fold > summary { position: relative; display: flex; align-items: center; gap: 8px; cursor: pointer; list-style: none; user-select: none;
  padding: 6px 14px 6px 16px; border: 1px solid color-mix(in srgb, var(--fx-c) 35%, var(--line)); border-radius: 0;
  background: linear-gradient(90deg, color-mix(in srgb, var(--fx-c) 12%, transparent), transparent 65%); box-shadow: inset 3px 0 0 var(--fx-c);
  clip-path: polygon(0 0, calc(100% - 9px) 0, 100% 9px, 100% 100%, 0 100%); letter-spacing: .14em; font-size: 12.5px; font-weight: 700; color: var(--ink);
  transition: background .15s, border-color .15s; }
details.fold > summary::-webkit-details-marker { display: none; }
details.fold > summary::before { content: ''; width: 6px; height: 6px; border: 1.5px solid var(--fx-c); transform: rotate(0deg); transition: transform .2s, background .2s; flex: none; }
details.fold[open] > summary::before { transform: rotate(45deg); background: var(--fx-c); }
details.fold > summary:hover { background: linear-gradient(90deg, color-mix(in srgb, var(--fx-c) 24%, transparent), color-mix(in srgb, var(--fx-c) 6%, transparent)); border-color: var(--fx-c); }
details.fold[open] > summary { border-color: var(--fx-c); }
details.fold > summary .dim { letter-spacing: 0; font-weight: 400; font-family: var(--mono); }
details.fold > summary select { letter-spacing: 0; }
details.fold.fold-gold > summary { color: color-mix(in srgb, var(--fx-c) 70%, var(--ink)); }
details.fold > .fold-in { border: 1px solid color-mix(in srgb, var(--fx-c) 30%, var(--line)); border-top: 0; padding: 8px 10px; box-shadow: inset 3px 0 0 color-mix(in srgb, var(--fx-c) 35%, transparent); }
details.fold[open] > summary + :not(.fold-in) { margin-top: 8px; }

/* 军团成员名单：首发栏内的区域分组标题（AZ / TZ / BZ） */
.mem-h { margin: 14px 0 4px; }
tr.mem-zh td, div.mem-zh { padding: 6px 8px 4px; font-family: var(--mono); font-weight: 700; letter-spacing: .12em; color: var(--accent); border-bottom: 1px solid color-mix(in srgb, var(--accent) 35%, var(--line)); background: linear-gradient(90deg, color-mix(in srgb, var(--accent) 10%, transparent), transparent 60%); }
tr.mem-zh small, div.mem-zh small { color: var(--ink2); font-weight: 400; letter-spacing: 0; margin-left: 6px; }

/* 成员名单「替换」下拉：按钮做成和「移至次发」同宽的小按钮，菜单向左展开 */
.mb-swap .cdd-b { width: auto; min-width: 7em; padding: 3px 10px; font-size: 12.5px; }
.mb-swap .cdd-m { right: 0; left: auto; min-width: 16em; }

/* 成员名单的站位徽章（AZ / TZ / BZ / 次发 / 空） */
.zn-b { display: inline-flex; align-items: center; justify-content: center; min-width: 3.2em; padding: 2px 8px; font-family: var(--mono); font-weight: 700; font-size: 12px; letter-spacing: .08em; border: 1px solid var(--zc, var(--line)); color: var(--zc, var(--ink2)); background: color-mix(in srgb, var(--zc, var(--line)) 14%, transparent); flex: none; }
.zn-b.zn-AZ { --zc: #ff6b6b; } .zn-b.zn-TZ { --zc: #f5c04a; } .zn-b.zn-BZ { --zc: #4ab8ff; } .zn-b.zn-bench { --zc: var(--ink2); } .zn-b.zn-off { --zc: var(--line); }

/* 军团成员名单的整行大按钮（招募队员 / 送修全团 CHARM）：按钮占满一行，条件清单在下 */
.lg-bigb { margin: 10px 0; } .lg-bigb .wb-w { display: block; } .lg-bigb .wbtn { width: 100%; }

/* 人物卡「原作关系」：对方名字 + 称呼小标签（契约 / 伴侣 / 家人粉，敌对红） */
.cr-row { display: flex; flex-wrap: wrap; gap: 4px 10px; justify-content: flex-end; }
.cr-i { display: inline-flex; align-items: baseline; gap: 4px; }
.cr-l { font-size: 11px; padding: 0 5px; border: 1px solid var(--line); color: var(--ink2); }
.cr-l.cr-pact, .cr-l.cr-partner, .cr-l.cr-family { border-color: #ff8fc7; color: #ff8fc7; }
.cr-l.cr-hostile { border-color: var(--bad, #ff6b6b); color: var(--bad, #ff6b6b); }
.cr-l.cr-roommate, .cr-l.cr-childhood, .cr-l.cr-bestie { border-color: #ffb86b; color: #ffb86b; }

/* 学生会长特权线：已点亮的最高格可废除时闪红光（点击 = 提议废除这一级） */
@keyframes pvDown { 0%, 100% { box-shadow: 0 0 0 0 rgba(255, 90, 90, .5); } 50% { box-shadow: 0 0 12px 2px rgba(255, 90, 90, .75); } }
.pv-c.push.down { border-color: #ff5a5a; animation: pvDown 1.1s ease-in-out infinite; }
.pv-c.push.down > i { background: #ff5a5a; box-shadow: 0 0 8px rgba(255, 90, 90, .7); }
.pv-c.push.down b { color: #ff7a7a; }
.pv-c.push.down:hover { animation: none; background: color-mix(in srgb, #ff5a5a 16%, var(--card2)); box-shadow: 0 0 12px rgba(255, 90, 90, .8); }

/* 事件人物卡：性格标签和稀有技能徽章同一行 */
.fp-tags { display: flex; flex-wrap: wrap; align-items: center; gap: 4px 8px; }
.fp-tags .tags { margin: 0; }
.tags i.rare-none { color: var(--ink2); border-style: dashed; opacity: .75; }

/* 风纪委员会「委员的行动」：2×2 大按钮 */
.fz-g2 { display: grid; grid-template-columns: 1fr 1fr; gap: 8px 10px; }
.fz-g2 button.wbtn { margin: 0; }

/* 大按钮里的第二行说明（升级效果等） */
button.wbtn { flex-wrap: wrap; } button.wbtn small.wb-sub { flex-basis: 100%; font-size: 11px; font-weight: 400; letter-spacing: 0; color: var(--ink2); text-align: center; }

/* 战斗面板下方页签：参战成员按军团分组 */
.bt-tabs { margin: 10px 0 8px; }
.bt-lg + .bt-lg { margin-top: 10px; }
.bt-lg > h6 { margin: 4px 0 6px; font-size: 12.5px; color: var(--accent); letter-spacing: .08em; display: flex; gap: 8px; align-items: baseline; }

/* 战斗面板：军团收纳栏 */
details.bt-lg > summary small.bt-lgs { margin-left: auto; letter-spacing: 0; font-weight: 400; }
details.bt-lg > .bt-mems { margin-top: 8px; }

/* 信息栏：敌方剩余血量总和（红条，越打越短） */
.bt-tug i { background: var(--line); } .bt-tug em { background: #d64a4a; } .bt-tug .bt-tugn { font-family: var(--mono); font-size: 11.5px; }

/* 作战卡片：玩法说明按钮靠右 */
.op-card h3 .op-hb { margin-left: auto; display: inline-flex; }

/* 任务 / 刻苦程度：进度条左、当前效果词条右（同一行，窄屏换行） */
.tg-row { display: flex; align-items: center; flex-wrap: wrap; gap: 6px 18px; }
.tg-row > .tg-cur { display: flex; flex-wrap: wrap; gap: 4px 14px; margin: 0; }
.tg-row > .tg-cur { flex-direction: row; align-items: center; }

/* 幸福过低气泡：红色闪烁，不能消除 */
@keyframes lowhBlink { 0%, 100% { box-shadow: 0 0 0 0 rgba(255, 70, 90, .55); border-color: #ff4a5a; } 50% { box-shadow: 0 0 14px 3px rgba(255, 70, 90, .85); border-color: #ff8a96; } }
.bub.lowh .bub-b { color: #ff6b78; border-color: #ff4a5a; background: color-mix(in srgb, #ff4a5a 16%, var(--card)); animation: lowhBlink 1.2s ease-in-out infinite; }

/* 军团页：四项属性的甜甜圈图 */
.lg-donut { display: flex; justify-content: center; margin: 4px 0 6px; }
.lg-donut svg { width: 100%; max-width: 520px; height: auto; overflow: visible; }
.lg-donut path, .lg-donut .lgd-lab { cursor: pointer; }
.lg-donut path:hover { filter: brightness(1.25); }
.lgd-lab polyline { stroke-width: 1.2; opacity: .85; }
.lgd-n { font-size: 11.5px; fill: var(--ink2); letter-spacing: .08em; }
.lgd-v { font-size: 15px; font-weight: 700; font-family: var(--mono); }
.lgd-rk { font-size: 34px; font-weight: 800; font-family: var(--mono); fill: var(--accent); letter-spacing: .04em; }
.lgd-rk.lg-SSS, .lgd-rk.lg-SS, .lgd-rk.lg-S { fill: #ff6b8a; } .lgd-rk.lg-none { font-size: 18px; fill: var(--ink2); }
.lgd-c { font-size: 11px; fill: var(--ink2); }

/* 军团页：队长 / 副队长名片卡（电脑左右两栏，手机上下） */
.ldr-g { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; margin-top: 8px; }
@media (max-width: 640px) { .ldr-g { grid-template-columns: 1fr; } }
.ldr-c { display: flex; gap: 12px; align-items: center; padding: 10px 12px; border: 1px solid var(--line); background: linear-gradient(135deg, color-mix(in srgb, var(--accent) 8%, var(--card2)), var(--card2) 60%); clip-path: polygon(0 0, calc(100% - 10px) 0, 100% 10px, 100% 100%, 0 100%); cursor: pointer; min-width: 0; }
.ldr-c:hover { border-color: var(--accent); }
.ldr-c.ldr-none { cursor: default; flex-direction: column; align-items: flex-start; }
.ldr-pix { flex: none; }
.ldr-i { display: flex; flex-direction: column; gap: 2px; min-width: 0; flex: 1; }
.ldr-r { font-size: 11px; color: var(--accent); letter-spacing: .14em; }
.ldr-n { font-size: 15px; } .ldr-s { font-size: 12px; color: var(--ink2); display: flex; gap: 6px; align-items: center; flex-wrap: wrap; }
.ldr-sel { margin-top: 4px; max-width: 12em; }

/* 甜甜圈环心：科幻风 */
.lgd-ticks line { stroke: var(--accent); stroke-width: 1; opacity: .45; }
.lgd-inner { fill: color-mix(in srgb, var(--accent) 6%, transparent); stroke: color-mix(in srgb, var(--accent) 40%, transparent); stroke-width: .8; stroke-dasharray: 2 3; }
.lgd-rk { font-size: 38px; font-weight: 800; font-family: var(--mono); letter-spacing: .12em; fill: url(#lgdRk); }
.lgd-rk.lg-SSS, .lgd-rk.lg-SS, .lgd-rk.lg-S { --lgd-rk: #ff8fb0; --lgd-rk2: #ff4a7a; fill: url(#lgdRk); }
.lgd-rk.lg-none { font-size: 18px; letter-spacing: .2em; }
.lgd-sep { stroke: var(--accent); stroke-width: 1; opacity: .6; }
.lgd-c { font-size: 10.5px; font-family: var(--mono); }
.lgd-ck { fill: color-mix(in srgb, var(--accent) 70%, var(--ink2)); letter-spacing: .18em; font-size: 9px; }
.lgd-cv { fill: var(--ink); font-weight: 700; letter-spacing: .06em; }
.lgd-tend { fill: var(--ink2); font-family: inherit; letter-spacing: .1em; }

/* 甜甜圈开屏动画（切进军团页时播一次）：刻度环旋入 → 四段依次描出 → 折线标签滑入 → 评级闪亮 */
@keyframes lgdDraw { from { stroke-dasharray: 0 100; } to { stroke-dasharray: 100 0; } }
@keyframes lgdSpin { from { transform: rotate(-120deg) scale(.6); opacity: 0; } to { transform: none; opacity: 1; } }
@keyframes lgdFade { from { opacity: 0; transform: translateY(4px); } to { opacity: 1; transform: none; } }
@keyframes lgdRk { 0% { opacity: 0; transform: scale(1.8); } 60% { opacity: 1; transform: scale(.92); } 100% { transform: none; } }
.lgd-play path { animation: lgdDraw .55s cubic-bezier(.4, 0, .2, 1) both; animation-delay: calc(.15s + var(--i) * .16s); }
.lgd-play .lgd-ticks, .lgd-play .lgd-inner { transform-box: view-box; transform-origin: 50% 50%; animation: lgdSpin .7s ease-out both; }
.lgd-play .lgd-lab { animation: lgdFade .35s ease-out both; animation-delay: calc(.6s + var(--i) * .12s); }
.lgd-play .lgd-rk { transform-box: fill-box; transform-origin: 50% 50%; animation: lgdRk .6s ease-out .9s both; }
.lgd-play .lgd-c, .lgd-play .lgd-sep { animation: lgdFade .4s ease-out 1.2s both; }
@media (prefers-reduced-motion: reduce) { .lgd-play * { animation: none !important; } }

/* 成员名单顶部：横排三个板块（手机竖排） */
.lg-top3 { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; margin-bottom: 14px; }
@media (max-width: 900px) { .lg-top3 { grid-template-columns: 1fr; } }
.lg-top-c { padding: 12px 14px; border: 1px solid var(--line); background: var(--card); clip-path: polygon(0 0, calc(100% - 12px) 0, 100% 12px, 100% 100%, 0 100%); display: flex; flex-direction: column; gap: 4px; min-width: 0; }
.lg-top-c > h4 { margin: 0 0 6px; font-size: 13px; color: var(--accent); letter-spacing: .14em; border-left: 3px solid var(--accent); padding-left: 8px; }
.lg-top-c .lg-bigb { margin: 6px 0; }
.lg-top-c .lg-rep { margin: 0; }

/* 军团战绩页的表格 */
.lgr-t td, .lgr-t th { white-space: nowrap; font-size: 12.5px; } .lgr-t td:last-child { white-space: normal; }

/* 名片卡右侧的替换按钮；三板块并进成员名单卡片 */
.ldr-x { margin-left: auto; align-self: center; } .ldr-x .cdd-b { width: auto; min-width: 6.5em; }
.ldr-x .cdd-m { right: 0; left: auto; min-width: 16em; }
.lg-roster .lg-top3 { margin: 0 0 14px; padding-bottom: 14px; border-bottom: 1px dashed color-mix(in srgb, var(--line) 80%, transparent); }
.lg-roster .lg-top-c { background: var(--card2); }

/* 甜甜圈环心的倾向徽章 */
.lgd-tb path { fill: color-mix(in srgb, var(--tbc, var(--accent)) 18%, transparent); stroke: var(--tbc, var(--accent)); stroke-width: 1; }
.lgd-tb text { fill: var(--tbc, var(--accent)); font-size: 10px; font-weight: 700; letter-spacing: .08em; filter: url(#lgdGlow); }
.lgd-tb.t-atk { --tbc: var(--r); } .lgd-tb.t-def { --tbc: var(--b); } .lgd-tb.t-theory { --tbc: var(--p); } .lgd-tb.t-ind { --tbc: #f5c04a; }
.lgd-play .lgd-tb { animation: lgdFade .4s ease-out 1.2s both; }
.lgd-ck { letter-spacing: .12em; font-size: 9.5px; }

/* 名片卡：不用 clip-path（会把「替换」下拉菜单裁掉，只露出第一项），斜切角改成右上角的三角形装饰 */
.ldr-c { clip-path: none; position: relative; overflow: visible; }
.ldr-c::after { content: ''; position: absolute; top: -1px; right: -1px; width: 12px; height: 12px; background: linear-gradient(225deg, var(--bg) 50%, transparent 50%); border-top: 1px solid transparent; pointer-events: none; }
.ldr-x { position: relative; z-index: 5; }
.ldr-x .cdd-m { max-height: 260px; overflow-y: auto; z-index: 30; }
/* 下拉菜单会伸到下面的子页签栏上：名片所在的卡片抬到上层，菜单不被盖住 */
.card:has(.ldr-g) { z-index: 12; }

/* 副队长「替换」下拉：向上展开（下面紧挨着子页签栏，向下会被盖住）+ 科幻样式：亮青描边与外发光、斜切角、扫描线底纹、选项左侧亮条 */
.ldr-x .cdd-m { top: auto; bottom: calc(100% + 6px); max-height: 300px; overflow-y: auto; padding: 6px 4px;
  background: linear-gradient(180deg, color-mix(in srgb, #3ef0ff 10%, #0b1620), #0b1620 70%), repeating-linear-gradient(0deg, rgba(62, 240, 255, .05) 0 1px, transparent 1px 4px);
  background-blend-mode: screen; border: 1px solid #3ef0ff; border-radius: 0;
  box-shadow: 0 0 0 1px rgba(62, 240, 255, .25), 0 0 18px rgba(62, 240, 255, .45), inset 0 0 14px rgba(62, 240, 255, .12);
  clip-path: polygon(0 0, calc(100% - 12px) 0, 100% 12px, 100% 100%, 12px 100%, 0 calc(100% - 12px)); }
.ldr-x .cdd-m::before { content: '// ' attr(data-t); display: none; }
.ldr-x .cdd-o { position: relative; padding: 6px 12px 6px 16px; font-size: 12.5px; letter-spacing: .04em; color: #d8fbff; border-radius: 0; }
.ldr-x .cdd-o::before { content: ''; position: absolute; left: 4px; top: 50%; width: 5px; height: 5px; border: 1px solid #3ef0ff; transform: translateY(-50%) rotate(45deg); opacity: .6; transition: background .15s, opacity .15s; }
.ldr-x .cdd-o:hover { background: linear-gradient(90deg, rgba(62, 240, 255, .28), rgba(62, 240, 255, .04)); color: #fff; box-shadow: inset 2px 0 0 #3ef0ff; text-shadow: 0 0 6px rgba(62, 240, 255, .8); }
.ldr-x .cdd-o:hover::before { background: #3ef0ff; opacity: 1; }
.ldr-x .cdd-o + .cdd-o { border-top: 1px dashed rgba(62, 240, 255, .18); }
.ldr-x .cdd-b { border: 1px solid #3ef0ff; box-shadow: 0 0 8px rgba(62, 240, 255, .45); color: #7ff6ff; }
.ldr-x .cdd.open .cdd-b { background: rgba(62, 240, 255, .18); box-shadow: 0 0 14px rgba(62, 240, 255, .75); }

/* 环心文字统一：白 → 青的竖向渐变 + 发光；徽章只用边框区分倾向颜色，字统一亮色 */
.lgd-c, .lgd-ck, .lgd-cv, .lgd-tb text, .lgd-tend { fill: url(#lgdTx); filter: url(#lgdGlow); }
.lgd-ck { font-size: 10px; letter-spacing: .14em; } .lgd-cv { font-size: 11.5px; }
.lgd-tb text { font-size: 10.5px; letter-spacing: .06em; }
.lgd-tb path { fill: color-mix(in srgb, var(--tbc) 30%, #0b1620); stroke-width: 1.4; filter: drop-shadow(0 0 3px var(--tbc)); }
/* 环心小字：去掉发光（小字号一加光晕就糊），只保留白 → 青渐变；发光只留给大号评级 */
.lgd-c, .lgd-ck, .lgd-cv, .lgd-tb text, .lgd-tend { filter: none; }
.lgd-cv, .lgd-tb text { font-weight: 700; }

/* ===== 全站自定义下拉菜单（.cdd，ddHtml 生成）统一成科幻样式：亮青描边 + 外发光、斜切角、扫描线底纹、菱形标记、悬停左侧亮条 =====
   （副队长「替换」另外改成向上展开，见 .ldr-x） */
.cdd-m { max-height: 320px; overflow-y: auto; padding: 6px 4px; border-radius: 0;
  background: linear-gradient(180deg, color-mix(in srgb, #3ef0ff 10%, #0b1620), #0b1620 70%), repeating-linear-gradient(0deg, rgba(62, 240, 255, .05) 0 1px, transparent 1px 4px);
  background-blend-mode: screen; border: 1px solid #3ef0ff;
  box-shadow: 0 0 0 1px rgba(62, 240, 255, .25), 0 0 18px rgba(62, 240, 255, .45), inset 0 0 14px rgba(62, 240, 255, .12);
  clip-path: polygon(0 0, calc(100% - 12px) 0, 100% 12px, 100% 100%, 12px 100%, 0 calc(100% - 12px)); }
.cdd-m button.cdd-o, .cdd-o { position: relative; padding: 6px 12px 6px 16px; font-size: 12.5px; letter-spacing: .04em; color: #d8fbff; border-radius: 0; border: 0; background: transparent; box-shadow: none; }
.cdd-o::before { content: ''; position: absolute; left: 4px; top: 50%; width: 5px; height: 5px; border: 1px solid #3ef0ff; transform: translateY(-50%) rotate(45deg); opacity: .6; transition: background .15s, opacity .15s; }
.cdd-m button.cdd-o:hover, .cdd-o:hover { background: linear-gradient(90deg, rgba(62, 240, 255, .28), rgba(62, 240, 255, .04)); color: #fff; box-shadow: inset 2px 0 0 #3ef0ff; text-shadow: 0 0 6px rgba(62, 240, 255, .8); }
.cdd-o:hover::before, .cdd-o.on::before { background: #3ef0ff; opacity: 1; }
.cdd-m button.cdd-o.on.on, .cdd-o.on { background: rgba(62, 240, 255, .16); color: #fff; box-shadow: inset 2px 0 0 #3ef0ff; }
.cdd-o + .cdd-o { border-top: 1px dashed rgba(62, 240, 255, .18); }
.cdd.open > .cdd-b { border-color: #3ef0ff; box-shadow: 0 0 12px rgba(62, 240, 255, .6); }

/* ===== 契约小组：关系网络（你在中间） ===== */
.bd-net { position: relative; margin: 8px 0 14px; border: 1px solid color-mix(in srgb, #ff8fc7 25%, var(--line)); background:
  radial-gradient(circle at 50% 50%, color-mix(in srgb, #ff8fc7 14%, transparent), transparent 55%),
  radial-gradient(circle at 50% 50%, transparent 0 30%, color-mix(in srgb, #ff8fc7 6%, transparent) 30.5% 31%, transparent 31.5%),
  var(--card2); overflow: hidden; }
.bn-svg { position: absolute; inset: 0; width: 100%; height: 100%; pointer-events: none; }
.bn-l { stroke-width: .5; stroke-dasharray: 1.6 1; vector-effect: non-scaling-stroke; stroke-width: 2; animation: bnFlow 1.6s linear infinite; }
@keyframes bnFlow { to { stroke-dashoffset: -10; } }
.bn-l.c-gold { stroke: #f5c04a; } .bn-l.c-pink { stroke: #ff7eb6; } .bn-l.c-violet { stroke: #b48cff; } .bn-l.c-cyan { stroke: #3ef0ff; }
.bn-tag { position: absolute; transform: translate(-50%, -50%); font-size: 11px; font-weight: 700; padding: 1px 8px; border-radius: 999px; white-space: nowrap; background: var(--card); border: 1px solid; z-index: 2; letter-spacing: .04em; }
.bn-tag.c-gold { color: #f5c04a; border-color: #f5c04a; box-shadow: 0 0 8px rgba(245, 192, 74, .5); } .bn-tag.c-pink { color: #ff7eb6; border-color: #ff7eb6; box-shadow: 0 0 8px rgba(255, 126, 182, .5); }
.bn-tag.c-violet { color: #b48cff; border-color: #b48cff; box-shadow: 0 0 8px rgba(180, 140, 255, .5); } .bn-tag.c-cyan { color: #3ef0ff; border-color: #3ef0ff; box-shadow: 0 0 8px rgba(62, 240, 255, .5); }
.bn-c { position: absolute; transform: translate(-50%, -50%); display: flex; gap: 8px; align-items: center; padding: 6px 10px 6px 6px; min-width: 150px; max-width: 46%; z-index: 3;
  background: linear-gradient(135deg, color-mix(in srgb, var(--bc) 22%, var(--card)), var(--card) 70%); border: 1.5px solid var(--bc); border-radius: 14px; box-shadow: 0 0 12px color-mix(in srgb, var(--bc) 45%, transparent); cursor: pointer; transition: transform .15s; }
.bn-c:hover { transform: translate(-50%, -50%) scale(1.04); }
.bn-c.c-gold { --bc: #f5c04a; } .bn-c.c-pink { --bc: #ff7eb6; } .bn-c.c-violet { --bc: #b48cff; } .bn-c.c-cyan { --bc: #3ef0ff; }
.bn-c.bn-me { --bc: #ff8fc7; cursor: default; padding: 8px 14px 8px 8px; border-width: 2px; box-shadow: 0 0 0 4px color-mix(in srgb, #ff8fc7 15%, transparent), 0 0 22px rgba(255, 143, 199, .6); }
.bn-c.bn-me:hover { transform: translate(-50%, -50%); }
.bn-pix { flex: none; border-radius: 10px; overflow: hidden; }
.bn-i { display: flex; flex-direction: column; min-width: 0; gap: 1px; }
.bn-i b { font-size: 13px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.bn-r { font-size: 11px; color: var(--bc); font-weight: 700; letter-spacing: .04em; }
.bn-hearts { font-size: 10px; color: var(--bc); letter-spacing: 1px; }
.bn-x { position: absolute; top: -9px; right: -6px; font-size: 10px; padding: 0 6px; border-radius: 999px; background: var(--card); border: 1px solid var(--line2); color: var(--ink2); }
.bn-x:hover { color: var(--bad, #ff6b6b); border-color: var(--bad, #ff6b6b); }
@media (max-width: 640px) {
  .bd-net { height: auto !important; display: flex; flex-direction: column; gap: 10px; padding: 12px; }
  .bn-svg, .bn-tag { display: none; }
  .bn-c, .bn-c.bn-me { position: relative; left: auto !important; top: auto !important; transform: none; max-width: none; }
  .bn-c:hover { transform: none; } .bn-c.bn-me { order: -1; }
}
.rl-race .rl-row { border: 0; margin: 0; padding: 3px 0; }   /* 职责卡也叫 .rl-row：比赛行不要它的虚线上下边 */

/* 技能卡：边框更清楚——亮一点的描边 + 左侧技能色亮条 + 右上切角 + 卡片底色和背景拉开；悬停整卡描边发光 */
.skl > .sk { border: 1px solid color-mix(in srgb, var(--accent) 38%, var(--line2)); border-radius: 0; background: linear-gradient(160deg, color-mix(in srgb, var(--accent) 7%, var(--card2)), var(--card2) 55%);
  box-shadow: inset 3px 0 0 color-mix(in srgb, var(--accent) 70%, transparent), 0 2px 10px rgba(0, 0, 0, .25);
  clip-path: polygon(0 0, calc(100% - 12px) 0, 100% 12px, 100% 100%, 0 100%); padding: 10px 12px 10px 14px; transition: border-color .15s, box-shadow .15s; }
.skl > .sk:hover { border-color: var(--accent); box-shadow: inset 3px 0 0 var(--accent), 0 0 12px color-mix(in srgb, var(--accent) 35%, transparent); }
.rare-more > .skl, details.fold > .skl { margin-top: 10px; }

/* ===== 首页：此刻正在战斗的莉莉 + 纪念馆 ===== */
.h-memo h2 small { margin-left: 8px; font-size: 12px; color: var(--ink2); font-family: var(--mono); }
.mh-sec + .mh-sec { margin-top: 16px; padding-top: 14px; border-top: 1px dashed var(--line); }
.mh-lives { display: grid; grid-template-columns: repeat(auto-fill, minmax(190px, 1fr)); gap: 8px; }
.mh-live { display: flex; gap: 8px; align-items: center; padding: 6px 8px; border: 1px solid color-mix(in srgb, var(--accent) 35%, var(--line)); background: var(--card2); position: relative; }
.mh-live::before { content: ''; position: absolute; top: 6px; right: 6px; width: 6px; height: 6px; border-radius: 50%; background: #4fd18b; box-shadow: 0 0 6px #4fd18b; animation: mhPulse 1.6s ease-in-out infinite; }
@keyframes mhPulse { 50% { opacity: .3; } }
.mh-live img { width: 40px; height: 40px; image-rendering: pixelated; flex: none; }
.mh-live div { display: flex; flex-direction: column; min-width: 0; } .mh-live small { font-size: 11px; color: var(--ink2); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } .mh-lg { color: var(--accent) !important; }
.mh-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)); gap: 10px; margin: 8px 0; }
.mh-mem { display: flex; flex-direction: column; gap: 4px; padding: 0; border: 1px solid var(--line2); background: var(--card2); text-align: left; overflow: hidden; }
.mh-mem:hover { border-color: var(--accent); box-shadow: 0 0 10px color-mix(in srgb, var(--accent) 35%, transparent); }
.mh-mem img { width: 100%; aspect-ratio: 4 / 5; object-fit: cover; display: block; }
.mh-mem img.pix { image-rendering: pixelated; object-fit: contain; background: var(--card); }
.mh-n { display: flex; flex-direction: column; padding: 4px 8px 8px; min-width: 0; } .mh-n small { font-size: 11px; color: var(--ink2); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.memo-st { text-align: center; margin: 10px 0 0; } .memo-ok { color: var(--accent); letter-spacing: .08em; text-shadow: 0 0 8px var(--glow); }
.mm-ov { position: fixed; inset: 0; z-index: 90; background: rgba(4, 8, 14, .78); display: flex; align-items: center; justify-content: center; padding: 16px; }
.mm-box { position: relative; display: grid; grid-template-columns: minmax(0, 360px) minmax(0, 1fr); gap: 16px; width: min(1000px, 100%); max-height: 92vh; overflow: auto; background: var(--card); border: 1px solid var(--accent); box-shadow: 0 0 24px color-mix(in srgb, var(--accent) 40%, transparent); padding: 16px; }
@media (max-width: 760px) { .mm-box { grid-template-columns: 1fr; } }
.mm-l img { width: 100%; display: block; }
.mm-r h3 small { margin-left: 8px; font-size: 12px; color: var(--ink2); font-weight: 400; } .mm-r h4 small { margin-left: 6px; color: var(--ink2); font-weight: 400; }
.mm-ep { font-style: italic; color: var(--ink2); border-left: 3px solid var(--accent); padding-left: 10px; }
.mm-tags { display: flex; flex-wrap: wrap; gap: 4px 8px; } .mm-tags span { font-size: 12px; padding: 1px 8px; border: 1px solid var(--line2); }
.mm-t tr.me td { color: var(--accent); font-weight: 700; }
.mm-beats { margin: 0; padding-left: 0; list-style: none; font-size: 12.5px; } .mm-beats li b { display: inline-block; min-width: 2.4em; color: var(--accent); font-family: var(--mono); }
.mm-x { position: absolute; top: 6px; right: 8px; font-size: 20px; background: transparent; border: 0; color: var(--ink2); }
.sys-card .sc-on { color: var(--accent); font-weight: 700; letter-spacing: .06em; }

/* ===== 军团室（沿用寝室 .bd-room 的样式）===== */
.lr-slot { position: relative; width: 100%; max-width: 768px; margin: 6px auto 8px; }
.lr-room { max-width: 768px; }
.lr-room img.lr-table { position: absolute; inset: 0; width: 100%; height: 100%; display: block; image-rendering: pixelated; border: 0; border-radius: 0; background: none; pointer-events: none; z-index: 20; }
.lr-room .lr-p { pointer-events: auto; }
.lr-room .lr-p.cr-pl { cursor: pointer; }
.lr-room .lr-p:hover img { filter: drop-shadow(0 0 2px #fff) drop-shadow(0 0 3px var(--accent)); }
.lr-me { position: absolute; left: 50%; top: -9%; width: 12%; aspect-ratio: 1; background: #ff5c8a; transform: translateX(-50%) rotate(45deg); box-shadow: 0 0 4px #ff5c8a; animation: lrBob 1.4s ease-in-out infinite; }
@keyframes lrBob { 50% { top: -14%; } }
.lr-role { position: absolute; right: -6%; top: -2%; font-style: normal; font-size: clamp(7px, 1.2vw, 11px); line-height: 1; color: #ffd166; text-shadow: 0 0 2px #000, 0 0 2px #000; }
.lr-sign { position: absolute; top: 1.2%; left: 50%; transform: translateX(-50%); z-index: 2; padding: 1px 10px; font: 700 clamp(8px, 1.5vw, 12px)/1.4 var(--mono); letter-spacing: .12em; white-space: nowrap; border: 1px solid; pointer-events: none; }
.lr-sign.s-std { background: #fbfbf7; color: #3a4a62; border-color: #5d6878; }
.lr-sign.s-classic { background: #2a160c; color: #e8c86a; border-color: #c9a94a; }
.lr-sign.s-tech { background: #0a2238; color: #7ffcff; border-color: #3af0ff; box-shadow: 0 0 6px #3af0ff66; }
.lr-sign.s-sakura { background: #f8f4ea; color: #5a3a20; border-color: #8a6a4a; font-family: serif; }
.lr-sign.s-gym { background: #d83a4a; color: #fff; border-color: #7a1a24; }
.lr-sign.s-cafe { background: #2a3a32; color: #f4f4e8; border-color: #7a5a3a; }
.lr-bar { display: flex; flex-wrap: wrap; gap: 6px 16px; align-items: center; font-size: 12.5px; margin: 4px 0 6px; }
.lr-bar .lr-fx { display: inline-flex; flex-wrap: wrap; gap: 4px; align-items: center; }
.lr-styles { display: grid; grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)); gap: 8px; padding: 6px 0; }
.lr-st { position: relative; display: flex; flex-direction: column; gap: 2px; padding: 4px 4px 6px; text-align: left; border: 1px solid var(--line2); background: var(--card2); }
.lr-st img { width: 100%; aspect-ratio: 2 / 1; object-fit: cover; image-rendering: pixelated; border: 0; border-radius: 0; }
.lr-st b { font-size: 13px; } .lr-st small { font-family: var(--mono); color: var(--ink2); font-size: 11px; } .lr-st .mod-t { font-size: 11px; }
.lr-st.on { border-color: var(--accent); box-shadow: 0 0 0 1px var(--accent) inset; }
.lr-st em { position: absolute; top: 6px; right: 6px; font-style: normal; font-size: 10px; padding: 0 6px; background: var(--accent); color: #000; }
.lr-st:disabled:not(.on) { opacity: .55; }
.lr-bag { max-height: 320px; overflow: auto; }
.lr-bag img { image-rendering: pixelated; flex: none; border: 0; background: none; }

/* ===== 纪念页（科幻 HUD：深色玻璃面板 + 青色描边 + 角标 + 扫描线）===== */
.lp-ov { position: fixed; inset: 0; z-index: 95; background: radial-gradient(ellipse at 50% 30%, rgba(20, 60, 90, .55), rgba(2, 4, 10, .92) 70%); display: flex; align-items: center; justify-content: center; padding: 12px; animation: lpIn .4s ease-out; backdrop-filter: blur(3px); }
@keyframes lpIn { from { opacity: 0; transform: scale(1.02); } }
.lp-box { --h0: #050a14; --h1: rgba(10, 22, 38, .92); --h2: rgba(16, 34, 56, .75); --hc: #4fe3ff; --hc2: #8ff6ff; --hp: #ff6fa8; --hg: #ffd166; --hi: #e6f4ff; --hi2: #8aa6c0; --hl: rgba(79, 227, 255, .28);
  position: relative; display: grid; grid-template-columns: 290px minmax(0, 1fr); width: min(1240px, 100%); height: min(94vh, 1000px); background: linear-gradient(180deg, #071224, #040912); color: var(--hi);
  border: 1px solid var(--hl); box-shadow: 0 0 0 1px rgba(0, 0, 0, .6), 0 0 40px rgba(79, 227, 255, .18), inset 0 0 80px rgba(79, 227, 255, .05); overflow: hidden; font-size: 13.5px;
  background-image: linear-gradient(rgba(79, 227, 255, .045) 1px, transparent 1px), linear-gradient(90deg, rgba(79, 227, 255, .045) 1px, transparent 1px); background-size: 24px 24px; }
.lp-box::before, .lp-box::after { content: ''; position: absolute; width: 22px; height: 22px; border: 2px solid var(--hc); pointer-events: none; z-index: 6; }
.lp-box::before { top: -1px; left: -1px; border-right: 0; border-bottom: 0; } .lp-box::after { bottom: -1px; right: -1px; border-left: 0; border-top: 0; }
.lp-scan { position: absolute; inset: 0; pointer-events: none; z-index: 5; background: repeating-linear-gradient(0deg, rgba(255, 255, 255, .025) 0 1px, transparent 1px 3px); }
.lp-box .hint, .lp-box .dim, .lp-box small { color: var(--hi2); }
.lp-box button { font-family: inherit; text-shadow: none; }
.lp-x { position: absolute; top: 6px; right: 12px; z-index: 7; font-size: 24px; line-height: 1; background: transparent !important; border: 0 !important; box-shadow: none !important; color: var(--hc); cursor: pointer; }
.lp-x:hover { color: #fff; }
/* 左栏 */
.lp-side { background: linear-gradient(180deg, rgba(12, 30, 52, .9), rgba(6, 14, 26, .9)); border-right: 1px solid var(--hl); padding: 20px 16px; overflow: auto; text-align: center; }
.lp-por { position: relative; width: 132px; margin: 4px auto 10px; padding: 8px; background: radial-gradient(circle at 50% 40%, rgba(79, 227, 255, .25), rgba(5, 10, 20, .9) 70%); border: 1px solid var(--hc); clip-path: polygon(12% 0, 88% 0, 100% 12%, 100% 88%, 88% 100%, 12% 100%, 0 88%, 0 12%); }
.lp-por i { position: absolute; inset: 0; background: linear-gradient(transparent 45%, rgba(143, 246, 255, .35) 50%, transparent 55%); animation: lpScanY 3.2s linear infinite; pointer-events: none; }
@keyframes lpScanY { from { transform: translateY(-60%); } to { transform: translateY(60%); } }
.lp-por img { width: 100%; image-rendering: pixelated; display: block; border: 0; background: none; }
.lp-name { margin: 6px 0 2px; font-size: 21px; letter-spacing: .08em; color: #fff; text-shadow: 0 0 10px rgba(79, 227, 255, .6); }
.lp-dates { margin: 0 0 8px; font-family: var(--mono); font-size: 13px; color: var(--hc2); letter-spacing: .06em; }
.lp-tags { display: flex; flex-wrap: wrap; justify-content: center; gap: 4px; margin: 0 0 8px; } .lp-tags span { font-size: 11px; padding: 1px 7px; border: 1px solid var(--hl); color: var(--hi2); }
.lp-line { font-size: 12.5px; line-height: 1.7; margin: 8px 0; padding: 8px 10px; background: rgba(79, 227, 255, .07); border-left: 2px solid var(--hc); text-align: left; color: var(--hi); }
.lp-mini { display: grid; grid-template-columns: 1fr 1fr; gap: 6px; margin: 10px 0; }
.lp-mini div { padding: 6px 4px; border: 1px solid var(--hl); background: rgba(5, 12, 24, .7); } .lp-mini b { display: block; font: 700 18px/1.2 var(--mono); color: var(--hc2); text-shadow: 0 0 8px rgba(79, 227, 255, .55); } .lp-mini small { font-size: 10.5px; }
.lp-blk { text-align: left; margin-top: 12px; } .lp-blk h4 { margin: 0 0 6px; font-size: 11.5px; letter-spacing: .14em; color: var(--hc); border-bottom: 1px solid var(--hl); padding-bottom: 3px; }
.lp-wave { width: 100%; height: 54px; display: block; background: rgba(5, 12, 24, .7); border: 1px solid var(--hl); }
.lp-wave rect:hover { opacity: .6; }
.lp-wave-x { display: flex; justify-content: space-between; font-size: 10.5px; color: var(--hi2); font-family: var(--mono); }
.lp-cand { display: flex; align-items: center; justify-content: center; gap: 10px; margin: 14px 0 4px; }
.lp-candle { position: relative; padding: 7px 14px 7px 28px; border: 1px solid var(--hp); background: rgba(255, 111, 168, .08); color: var(--hp); cursor: pointer; font-size: 12.5px; letter-spacing: .06em; }
.lp-candle:hover { background: rgba(255, 111, 168, .18); }
.lp-candle .fl { position: absolute; left: 10px; top: 50%; width: 10px; height: 10px; margin-top: -5px; background: radial-gradient(circle, #fff 0 25%, var(--hp) 30% 60%, transparent 65%); opacity: .5; }
.lp-candle.lit { background: rgba(255, 111, 168, .22); color: #fff; box-shadow: 0 0 14px rgba(255, 111, 168, .5); }
.lp-candle.lit .fl { opacity: 1; animation: lpFlick 1.4s ease-in-out infinite alternate; box-shadow: 0 0 10px var(--hp); }
@keyframes lpFlick { 50% { transform: scale(1.25) rotate(30deg); } }
.lp-cn { font-family: var(--mono); color: var(--hp); }
.lp-msgs { display: flex; flex-direction: column; gap: 4px; }
.lp-msgs button { text-align: left; padding: 5px 8px; font-size: 12px; background: rgba(5, 12, 24, .7); color: var(--hi); border: 1px solid var(--hl); cursor: pointer; }
.lp-msgs button:hover:not(:disabled) { border-color: var(--hc); color: #fff; box-shadow: 0 0 8px rgba(79, 227, 255, .3); } .lp-msgs button:disabled { opacity: .45; }
.lp-ml { list-style: none; margin: 8px 0 0; padding: 0; font-size: 12px; } .lp-ml li { padding: 3px 0; border-bottom: 1px dotted var(--hl); display: flex; justify-content: space-between; gap: 8px; } .lp-ml li.new { color: var(--hp); }
.lp-no { font-family: var(--mono); font-size: 11px; color: var(--hi2); margin-top: 12px; letter-spacing: .1em; }
/* 右栏 */
.lp-main { display: flex; flex-direction: column; min-width: 0; min-height: 0; }
.lp-tabs { display: flex; flex-wrap: wrap; border-bottom: 1px solid var(--hl); padding: 0 44px 0 8px; background: rgba(6, 16, 30, .85); }
.lp-tabs button { position: relative; padding: 11px 15px; background: transparent !important; border: 0 !important; box-shadow: none !important; color: var(--hi2); font-size: 13.5px; letter-spacing: .08em; cursor: pointer; }
.lp-tabs button:hover { color: var(--hi); }
.lp-tabs button.on { color: var(--hc2); text-shadow: 0 0 8px rgba(79, 227, 255, .7); }
.lp-tabs button.on::after { content: ''; position: absolute; left: 10%; right: 10%; bottom: -1px; height: 2px; background: var(--hc); box-shadow: 0 0 8px var(--hc); }
.lp-body { flex: 1 1 auto; overflow: auto; padding: 16px 20px 28px; }
.lp-sec { position: relative; padding: 12px 14px; background: var(--h1); border: 1px solid var(--hl); }
.lp-sec + .lp-sec { margin-top: 14px; }
.lp-sec h3 { margin: 0 0 10px; font-size: 14px; letter-spacing: .12em; color: var(--hc2); border-bottom: 1px solid var(--hl); padding-bottom: 5px; } .lp-sec h3 small { margin-left: 8px; font-weight: 400; font-size: 12px; letter-spacing: 0; }
.lp-sec h4 { margin: 12px 0 6px; font-size: 12px; letter-spacing: .12em; color: var(--hc); }
.lp-box .mm-tags { display: flex; flex-wrap: wrap; gap: 4px 6px; } .lp-box .mm-tags span { font-size: 12px; padding: 1px 8px; border: 1px solid var(--hl); background: rgba(79, 227, 255, .06); color: var(--hi); } .lp-box .mm-tags span.me { border-color: var(--hp); color: var(--hp); }
.lp-box .tbl { width: 100%; border-collapse: collapse; margin-top: 8px; } .lp-box .tbl th, .lp-box .tbl td { border-bottom: 1px solid var(--hl); padding: 4px 6px; color: var(--hi); text-align: left; font-size: 12.5px; } .lp-box .tbl th { color: var(--hc); font-weight: 400; letter-spacing: .1em; } .lp-box .mm-t tr.me td { color: var(--hp); }
.lp-box .mm-kv { display: grid; grid-template-columns: repeat(auto-fill, minmax(180px, 1fr)); gap: 6px; } .lp-box .kv { display: flex; justify-content: space-between; padding: 4px 8px; border: 1px solid var(--hl); } .lp-box .kv span { color: var(--hi2); } .lp-box .kv b { color: var(--hc2); }
.lp-box .bd-room { border-color: var(--hc); box-shadow: 0 0 16px rgba(79, 227, 255, .2); margin: 4px auto 10px; }
.lp-box canvas.pix { image-rendering: pixelated; display: block; width: 100%; aspect-ratio: 240 / 72; background: #0a1220; }
.lp-cv { max-width: 760px; margin: 8px auto; border: 1px solid var(--hc); }
/* 故事 */
.ls-hero { position: relative; border: 1px solid var(--hc); box-shadow: 0 0 24px rgba(79, 227, 255, .25); overflow: hidden; }
.ls-hero canvas { filter: saturate(1.1); }
.ls-hero::after { content: ''; position: absolute; inset: 0; background: linear-gradient(180deg, transparent 45%, rgba(3, 8, 18, .92)); pointer-events: none; }
.ls-hero-t { position: absolute; left: 0; right: 0; bottom: 0; z-index: 2; padding: 10px 16px 12px; }
.ls-hero-t small { color: var(--hc) !important; letter-spacing: .14em; font-size: 11px; } .ls-hero-t p { margin: 4px 0 0; font-size: clamp(13px, 1.7vw, 16px); line-height: 1.6; color: #fff; text-shadow: 0 1px 4px #000; }
.ls-hero-none { padding: 40px; text-align: center; font-size: 24px; letter-spacing: .2em; color: var(--hc2); }
.ls-corner { position: absolute; top: 6px; right: 6px; width: 14px; height: 14px; border-top: 2px solid var(--hc); border-right: 2px solid var(--hc); z-index: 3; }
.ls-hud { display: grid; grid-template-columns: repeat(auto-fit, minmax(110px, 1fr)); gap: 1px; margin: 10px 0 16px; background: var(--hl); border: 1px solid var(--hl); }
.ls-hud div { padding: 8px 6px; text-align: center; background: rgba(5, 12, 24, .92); }
.ls-hud b, .rc-big b { display: block; font: 700 22px/1.2 var(--mono); color: var(--hc2); text-shadow: 0 0 10px rgba(79, 227, 255, .6); } .ls-hud small, .rc-big small { font-size: 11px; letter-spacing: .08em; }
.ls-ch { position: relative; margin-top: 14px; border: 1px solid var(--hl); background: var(--h1); }
.ls-ch header { display: flex; align-items: baseline; gap: 10px; padding: 8px 12px; border-bottom: 1px solid var(--hl); background: linear-gradient(90deg, rgba(79, 227, 255, .14), transparent 70%); }
.ls-no { font-family: var(--mono); font-size: 11.5px; color: #04121e; background: var(--hc); padding: 1px 8px; letter-spacing: .08em; } .ls-ch h4 { margin: 0; font-size: 16px; letter-spacing: .12em; color: #fff; } .ls-ch header small { margin-left: auto; font-family: var(--mono); }
.ls-ch-b { display: grid; grid-template-columns: minmax(0, 46%) minmax(0, 1fr); gap: 14px; padding: 12px; }
.ls-ch-b figure { margin: 0; } .ls-ch-b figure canvas { border: 1px solid var(--hl); } .ls-ch-b figcaption { margin-top: 4px; font-size: 11.5px; color: var(--hi2); line-height: 1.5; }
.ls-text { margin: 0 0 8px; line-height: 1.85; font-size: 13.5px; color: var(--hi); }
.ls-chips { display: flex; flex-wrap: wrap; gap: 6px; margin: 6px 0; } .ls-chips span { font-size: 11.5px; padding: 2px 8px; border: 1px solid var(--hl); color: var(--hi2); } .ls-chips b { color: var(--hc2); font-family: var(--mono); }
.ls-bat, .ls-keys { list-style: none; margin: 6px 0 0; padding: 0; }
.ls-bat li { display: flex; align-items: baseline; gap: 6px; padding: 4px 8px; margin-bottom: 3px; font-size: 12.5px; border-left: 2px solid #ff4d6d; background: rgba(255, 77, 109, .08); } .ls-bat li.w { border-left-color: var(--hg); background: rgba(255, 209, 102, .08); }
.ls-bat li i { font-style: normal; color: #ff8fa3; } .ls-bat li.w i { color: var(--hg); } .ls-bat li small { margin-left: auto; white-space: nowrap; font-family: var(--mono); }
.ls-keys li { display: grid; grid-template-columns: 16px minmax(0, 1fr) auto; gap: 6px; padding: 2px 0; font-size: 12.5px; line-height: 1.6; color: var(--hi); }
.ls-keys li i { font-style: normal; color: var(--hc); text-align: center; } .ls-keys li.t-S { color: #fff; font-weight: 700; } .ls-keys li.t-S i { color: var(--hp); } .ls-keys li small { font-family: var(--mono); }
/* 战绩 */
.rc-big { display: grid; grid-template-columns: repeat(auto-fit, minmax(120px, 1fr)); gap: 1px; background: var(--hl); border: 1px solid var(--hl); }
.rc-big div { padding: 10px 6px; text-align: center; background: rgba(5, 12, 24, .92); } .rc-big.sm b { font-size: 18px; }
.rc-bars { display: flex; flex-direction: column; gap: 4px; }
.rc-bars div { display: grid; grid-template-columns: 72px minmax(0, 1fr) 48px; align-items: center; gap: 8px; font-size: 12px; }
.rc-bars i { height: 10px; background: rgba(79, 227, 255, .1); position: relative; } .rc-bars i::after { content: ''; position: absolute; inset: 0; width: var(--w); background: linear-gradient(90deg, #2aa8d8, var(--hc2)); box-shadow: 0 0 8px rgba(79, 227, 255, .6); }
.rc-bars b { font-family: var(--mono); color: var(--hc2); text-align: right; }
.rc-kit { display: grid; grid-template-columns: repeat(auto-fit, minmax(160px, 1fr)); gap: 6px; margin-top: 12px; }
.rc-kit div { padding: 6px 10px; border: 1px solid var(--hl); background: rgba(79, 227, 255, .05); } .rc-kit small { display: block; font-size: 10.5px; letter-spacing: .1em; } .rc-kit b { color: #fff; } .rc-kit em { font-style: normal; color: var(--hg); font-family: var(--mono); margin-left: 4px; }
.rc-wsk { display: flex; flex-wrap: wrap; gap: 6px; } .rc-wsk span { padding: 3px 10px; border: 1px solid var(--hp); color: #ffd0e2; background: rgba(255, 111, 168, .08); font-size: 12.5px; } .rc-wsk em { font-style: normal; margin-left: 6px; color: var(--hg); font-family: var(--mono); }
.rc-bat { list-style: none; margin: 0; padding: 0 0 0 10px; border-left: 1px solid var(--hl); }
.rc-bat li { position: relative; display: grid; grid-template-columns: 74px minmax(0, 1fr); gap: 10px; padding: 6px 0 6px 8px; border-bottom: 1px dashed rgba(79, 227, 255, .12); }
.rc-bat li::before { content: ''; position: absolute; left: -15px; top: 12px; width: 9px; height: 9px; transform: rotate(45deg); background: #ff4d6d; box-shadow: 0 0 6px #ff4d6d; } .rc-bat li.w::before { background: var(--hg); box-shadow: 0 0 6px var(--hg); }
.rc-bat li.big { background: linear-gradient(90deg, rgba(255, 209, 102, .1), transparent 70%); }
.rc-bat time { font-family: var(--mono); font-size: 12px; color: var(--hc2); } .rc-bat time small { display: block; font-size: 10.5px; }
.rc-bat b { color: #fff; font-weight: 600; margin-right: 6px; } .rc-bat small { display: block; font-size: 11.5px; margin-top: 2px; }
.rc-res { font-size: 11px; padding: 0 6px; border: 1px solid #ff4d6d; color: #ff8fa3; } .rc-bat li.w .rc-res { border-color: var(--hg); color: var(--hg); }
.rc-lead { font-size: 11px; padding: 0 6px; margin-left: 4px; background: var(--hp); color: #fff; }
/* 相簿：全息照片框 */
.lp-album { display: grid; grid-template-columns: repeat(auto-fill, minmax(230px, 1fr)); gap: 12px; }
.lp-ph { position: relative; margin: 0; padding: 6px 6px 8px; background: rgba(5, 12, 24, .85); border: 1px solid var(--hl); transition: transform .2s, box-shadow .2s, border-color .2s; }
.lp-ph:hover { transform: translateY(-2px); border-color: var(--hc); box-shadow: 0 0 14px rgba(79, 227, 255, .35); }
.lp-ph.t-S { border-color: rgba(255, 111, 168, .6); } .lp-ph.bat { border-color: rgba(255, 209, 102, .6); }
.lp-ph figcaption { margin-top: 6px; font-size: 12px; line-height: 1.55; color: var(--hi); } .lp-ph figcaption small { display: block; font-family: var(--mono); font-size: 10.5px; color: var(--hc) !important; }
/* 年表 */
.lc-y { display: grid; grid-template-columns: 48px minmax(0, 1fr); gap: 10px; padding: 6px 0; border-bottom: 1px solid rgba(79, 227, 255, .1); }
.lc-a { text-align: right; font-family: var(--mono); color: var(--hc2); } .lc-a b { font-size: 18px; display: block; line-height: 1.1; text-shadow: 0 0 8px rgba(79, 227, 255, .5); } .lc-a small { font-size: 10px; }
.lc-y ol { list-style: none; margin: 0; padding: 0 0 0 12px; border-left: 1px solid var(--hl); }
.lc-y li { display: grid; grid-template-columns: 18px minmax(0, 1fr) auto; gap: 6px; padding: 3px 0; font-size: 13px; line-height: 1.6; color: var(--hi); }
.lc-y li i { font-style: normal; text-align: center; color: var(--hc); } .lc-y li small { font-family: var(--mono); font-size: 10.5px; padding-top: 2px; }
.lc-y li.t-S { color: #fff; font-weight: 700; } .lc-y li.t-S i { color: var(--hp); } .lc-y li.t-B { color: var(--hi2); font-size: 12.5px; }
.lc-y li.c-battle i, .lc-y li.c-war i { color: var(--hg); } .lc-y li.c-loss i, .lc-y li.c-death i { color: #9a8cff; }
/* 最后的时刻：全息墓碑 */
.lp-last { display: flex; flex-direction: column; align-items: center; gap: 16px; background: transparent; border: 0; }
.lp-dusk { width: 100%; max-width: 760px; position: relative; border: 1px solid var(--hl); } .lp-dusk canvas { filter: grayscale(.5) brightness(.65) hue-rotate(-10deg); }
.lp-dusk::after { content: ''; position: absolute; inset: 0; background: linear-gradient(transparent 30%, rgba(3, 8, 18, .8)); }
.lp-plaque { position: relative; display: flex; flex-direction: column; align-items: center; gap: 5px; padding: 22px 40px; min-width: min(460px, 100%); margin-top: -60px; z-index: 2;
  background: linear-gradient(180deg, rgba(79, 227, 255, .16), rgba(10, 30, 50, .9)); border: 1px solid var(--hc); box-shadow: 0 0 30px rgba(79, 227, 255, .35), inset 0 0 30px rgba(79, 227, 255, .15); text-align: center; clip-path: polygon(6% 0, 94% 0, 100% 14%, 100% 86%, 94% 100%, 6% 100%, 0 86%, 0 14%); animation: lpHolo 4s ease-in-out infinite; }
@keyframes lpHolo { 50% { box-shadow: 0 0 40px rgba(79, 227, 255, .5), inset 0 0 40px rgba(79, 227, 255, .22); } }
.lp-plaque small { color: var(--hc) !important; letter-spacing: .4em; font-size: 11px; } .lp-plaque b { font-size: 24px; letter-spacing: .14em; color: #fff; text-shadow: 0 0 12px rgba(79, 227, 255, .8); }
.lp-plaque span { font-family: var(--mono); font-size: 13px; color: var(--hc2); } .lp-plaque .lp-pq-k { color: var(--hg); }
.lp-plaque q { margin-top: 8px; max-width: 460px; line-height: 1.75; color: var(--hi); font-size: 13px; }
.lp-card { display: flex; flex-direction: column; align-items: center; gap: 8px; } .lp-card img { max-width: 320px; width: 100%; border: 1px solid var(--hl); box-shadow: 0 0 16px rgba(79, 227, 255, .25); }
.lp-box .mini, .lp-box .wbtn { background: rgba(79, 227, 255, .08); color: var(--hc2); border: 1px solid var(--hc); border-radius: 0; box-shadow: none; }
.lp-box .mini:hover, .lp-box .wbtn:hover { background: rgba(79, 227, 255, .2); color: #fff; box-shadow: 0 0 10px rgba(79, 227, 255, .4); }
/* 影片：HUD 放映框 */
.lf { max-width: 800px; margin: 0 auto; }
.lf-scr { position: relative; background: #03060c; border: 1px solid var(--hc); box-shadow: 0 0 24px rgba(79, 227, 255, .3); overflow: hidden; aspect-ratio: 240 / 100; }
.lf-scr::after { content: ''; position: absolute; inset: 0; pointer-events: none; background: repeating-linear-gradient(0deg, rgba(0, 0, 0, .18) 0 1px, transparent 1px 3px); z-index: 4; }
.lf-scr canvas { position: absolute; left: 0; top: 0; width: 100%; aspect-ratio: 240 / 72; image-rendering: pixelated; animation: lfKen 7s ease-out forwards; transform-origin: 50% 60%; }
.lf-scr.fade canvas { animation: lfFade .9s ease-out, lfKen 7s ease-out forwards; }
.lf-scr.bat canvas { animation: lfFade .5s ease-out, lfShake .5s steps(4) 2, lfKen 7s ease-out forwards; }
@keyframes lfFade { from { opacity: 0; filter: brightness(2.2) hue-rotate(40deg); } }
@keyframes lfKen { from { transform: scale(1); } to { transform: scale(1.07); } }
@keyframes lfShake { 25% { translate: 2px 0; } 50% { translate: -2px 1px; } 75% { translate: 1px -1px; } }
.lf-hud { position: absolute; left: 0; right: 0; top: 0; display: flex; justify-content: space-between; padding: 6px 10px; z-index: 3; font: 11px var(--mono); color: var(--hc2); text-shadow: 0 0 4px #000; pointer-events: none; }
.lf-rec { color: #ff4d6d; animation: lfCur 1.2s steps(1) infinite; } .lf-scr.dark .lf-hud { opacity: .4; }
.lf-cap { position: absolute; left: 0; right: 0; bottom: 0; height: 28%; padding: 8px 16px; background: linear-gradient(180deg, rgba(3, 8, 18, .85), #03060c); border-top: 1px solid var(--hl); color: var(--hi); font-size: clamp(11px, 1.7vw, 14px); line-height: 1.55; overflow: hidden; z-index: 3; }
.lf-cap:not(:empty)::after { content: '▌'; animation: lfCur .8s steps(1) infinite; color: var(--hc); } @keyframes lfCur { 50% { opacity: 0; } }
.lf-card { position: absolute; inset: 0; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 6px; color: var(--hi); opacity: 0; transition: opacity .8s; text-align: center; padding: 0 24px; pointer-events: none; z-index: 3; }
.lf-card.on { opacity: 1; } .lf-card small { color: var(--hc) !important; letter-spacing: .4em; font-size: 12px; } .lf-card b { font-size: clamp(20px, 3.6vw, 32px); letter-spacing: .2em; color: #fff; text-shadow: 0 0 14px rgba(79, 227, 255, .8); } .lf-card span { font-family: var(--mono); color: var(--hc2); } .lf-card em { font-style: normal; color: var(--hg); max-width: 580px; line-height: 1.7; font-size: 13px; }
.lf-roll { position: absolute; inset: 0; overflow: hidden; opacity: 0; transition: opacity .6s; pointer-events: none; background: #03060c; z-index: 3; }
.lf-roll.on { opacity: 1; }
.lf-rl { position: absolute; left: 0; right: 0; top: 100%; text-align: center; color: var(--hi); animation: lfRoll linear forwards; }
.lf-rl h5 { margin: 18px 0 6px; font-size: 12px; letter-spacing: .3em; color: var(--hc); } .lf-rl p { margin: 2px 0; font-size: 13px; } .lf-rl p small { margin-left: 8px; font-size: 11px; }
@keyframes lfRoll { to { transform: translateY(calc(-100% - 340px)); } }
.lf-bar { display: flex; align-items: center; gap: 8px; margin-top: 8px; } .lf-bar .mini { min-width: 34px; }
.lf-prog { flex: 1; height: 3px; background: rgba(79, 227, 255, .15); } .lf-prog i { display: block; height: 100%; width: 0; background: var(--hc); box-shadow: 0 0 8px var(--hc); transition: width .4s; }
.memo-self { margin-left: 8px; }
@media (max-width: 760px) {
  .lp-box { height: 96vh; overflow: auto; display: block; }
  .lp-side { border-right: 0; border-bottom: 1px solid var(--hl); }
  .lp-main { min-height: 70vh; } .lp-body { padding: 12px; overflow: visible; }
  .lp-tabs { position: sticky; top: 0; z-index: 4; overflow-x: auto; flex-wrap: nowrap; padding-right: 8px; } .lp-tabs button { flex: none; padding: 10px 11px; }
  .ls-ch-b { grid-template-columns: 1fr; }
  .lp-plaque { padding: 18px 20px; }
}

/* 军团室的人名牌：后排立在会议桌上，前排挂在胸前 */
.lr-plate { position: absolute; transform: translateX(-50%); display: flex; flex-direction: column; align-items: center; padding: 0 4px; min-width: 6%; font: 700 clamp(7px, 1.15vw, 11px)/1.15 var(--sans, inherit); color: #2a2230; background: #fbf7ee; border: 1px solid #6a5a48; box-shadow: 0 1px 0 rgba(0, 0, 0, .35); white-space: nowrap; pointer-events: none; }
.lr-plate small { font-size: .78em; font-weight: 400; color: #6a5a48; }
.lr-plate.me { background: #ffe3ee; border-color: #ff5c8a; } .lr-plate.lead { border-color: #c9a94a; box-shadow: 0 0 0 1px #c9a94a; }
.lr-ffx { margin-top: 0; }

/* 风纪：委员长行动 / 委员行动的大卡片（权威、冷却写在小字里）+ 委员卡片 */
.fz-g3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
@media (max-width: 760px) { .fz-g3 { grid-template-columns: 1fr; } }
.fz-ch-h small { margin-left: 8px; font-weight: 400; }
.wb-sub .wb-cost { display: block; margin-top: 3px; font-family: var(--mono); color: #ff8fa3; }
.wb-sub .wb-cost.dn { color: var(--dn, #ff5c6a); }
.fz-mcards { display: grid; grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); gap: 8px; margin: 8px 0; }
.fz-mc { display: grid; grid-template-columns: auto minmax(0, 1fr); gap: 4px 10px; padding: 8px 10px; border: 1px solid var(--line2); background: var(--card2); position: relative; }
.fz-mc[data-act] { cursor: pointer; } .fz-mc[data-act]:hover { border-color: var(--accent); box-shadow: 0 0 10px color-mix(in srgb, var(--accent) 30%, transparent); }
.fz-mc.chief { border-color: #c9a94a; box-shadow: inset 0 0 0 1px #c9a94a55; } .fz-mc.me { border-color: var(--accent); }
.fz-mc-pix { grid-row: span 2; } .fz-mc-pix img { width: 44px; height: 44px; image-rendering: pixelated; }
.fz-mc-i { display: flex; flex-direction: column; gap: 3px; min-width: 0; }
.fz-mc-n { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } .fz-mc-star { font-style: normal; font-size: 10.5px; padding: 0 6px; margin-right: 6px; background: #c9a94a; color: #1a1408; }
.fz-mc-s { display: flex; flex-wrap: wrap; gap: 4px 10px; font-size: 12px; color: var(--ink2); }
.fz-mc-a { grid-column: 2; display: flex; flex-wrap: wrap; gap: 4px; justify-content: flex-end; } .fz-mc-a:empty { display: none; }

/* 状态栏：政治倾向一行（徽章 + 调整按钮） */
.st-ism b { display: inline-flex; flex-wrap: wrap; gap: 3px; justify-content: flex-end; } .st-ism .mini { margin-left: 6px; padding: 1px 8px; }

/* 更改风纪理念：可选 / 不可选两组弹性卡片 */
.fz-ocs { display: flex; flex-wrap: wrap; gap: 8px; margin: 6px 0 12px; }
.fz-oc { flex: 1 1 250px; max-width: 100%; display: flex; flex-direction: column; gap: 4px; padding: 8px 10px; border: 1px solid var(--line2); background: var(--card2); }
.fz-oc:hover { border-color: var(--accent); }
.fz-oc-h { display: flex; align-items: center; gap: 6px; flex-wrap: wrap; } .fz-oc-m { font-size: 12px; } .fz-oc-f { flex: 1; }
.fz-oc .fz-oa { display: flex; align-items: center; justify-content: flex-end; gap: 8px; flex-wrap: wrap; margin-top: 2px; }
.fz-oc.poor { opacity: .7; } .fz-oc.off { opacity: .55; background: transparent; } .fz-oc.off:hover { border-color: var(--line2); }
/* 风纪理念卡片上的升级按钮 */
.fz-slot .fz-up { margin-top: 6px; }
/* 风纪委员卡片：一行三列 */
.fz-mcards { grid-template-columns: repeat(3, minmax(0, 1fr)); }
@media (max-width: 900px) { .fz-mcards { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 600px) { .fz-mcards { grid-template-columns: 1fr; } }
.fz-mc-lg { color: var(--accent); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; max-width: 100%; }
/* 风纪成员页：人数卡 */
.fz-seat { display: grid; grid-template-columns: minmax(140px, 220px) minmax(0, 1fr); gap: 12px; align-items: stretch; padding: 10px 12px; margin-bottom: 10px; border: 1px solid var(--line2); background: var(--card2); }
.fz-seat-n { display: flex; flex-wrap: wrap; align-items: baseline; justify-content: center; align-content: center; gap: 4px; text-align: center; }
.fz-seat-n b { font: 700 48px/1 var(--mono); color: var(--accent); text-shadow: 0 0 12px var(--glow); } .fz-seat-n b.dn { color: #ff8fa3; }
.fz-seat-n small { font: 18px var(--mono); color: var(--ink2); } .fz-seat-n span { flex-basis: 100%; font-size: 12px; color: var(--ink2); }
.fz-seat-b { display: flex; flex-direction: column; gap: 8px; } .fz-seat-b .wbtn { margin: 0; }
@media (max-width: 600px) { .fz-seat { grid-template-columns: 1fr; } }
/* 校园房间：人物头顶的年级 */
.ci-p { position: relative; }
.ci-g { position: absolute; top: -4px; left: 50%; transform: translateX(-50%); z-index: 2; padding: 0 4px; font: 700 10px/1.3 var(--mono, monospace); font-style: normal; white-space: nowrap; color: #04121e; background: var(--accent); pointer-events: none; }
/* 更改风纪理念：卡片固定宽度（网格，不随最后一行拉伸） */
.fz-ocs { display: grid; grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); }
.fz-oc { flex: none; max-width: none; }

/* 战斗：战技的发动按钮 */
.bt-rab.bt-wab { border-color: #8fd0ff; } .bt-rab.bt-wab:not(:disabled) { box-shadow: inset 0 0 0 1px rgba(143, 208, 255, .35); }
/* 校内的其他契约：卡片 */
.bd-ocs { display: grid; grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); gap: 8px; margin-top: 6px; }
.bd-oc { padding: 6px 10px 8px; border: 1px solid var(--line2); background: var(--card2); }
.bd-oc-h { display: block; color: var(--accent); letter-spacing: .08em; margin-bottom: 4px; }
.bd-oc-row { display: flex; align-items: center; flex-wrap: wrap; gap: 4px 6px; }
.bd-oc-m { display: flex; flex-direction: column; align-items: center; gap: 1px; min-width: 56px; cursor: pointer; } .bd-oc-m:hover b { color: var(--accent); }
.bd-oc-m img { width: 34px; height: 34px; image-rendering: pixelated; } .bd-oc-m b { font-size: 12px; max-width: 7em; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } .bd-oc-m small { font-size: 10.5px; color: var(--ink2); }
.bd-oc-ar { font-style: normal; color: #ff8fb4; font-weight: 700; }

/* Nest 列表：调查进度条 */
.nest-r .nr3 { margin-top: 2px; } .nest-sv { display: flex; align-items: center; gap: 8px; } .nest-sv small:first-child { flex: none; width: 4.5em; color: var(--ink2); } .nest-sv .bar { flex: 1; max-width: 520px; } .nest-sv small:last-child { flex: none; font-family: var(--mono); color: var(--accent); }

/* 风纪审问：每派一块卡片 */
.aud-g { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; margin-top: 8px; }
@media (max-width: 700px) { .aud-g { grid-template-columns: 1fr; } }
.aud-c { display: flex; flex-direction: column; gap: 8px; padding: 10px; border: 1px solid var(--line2); background: var(--card2); }
.aud-h { display: flex; align-items: center; gap: 6px; padding-bottom: 6px; border-bottom: 1px solid var(--line); } .aud-h small { margin-left: auto; color: var(--ink2); }
.aud-p { display: flex; flex-direction: column; align-items: center; gap: 4px; flex: 1; } .aud-p img { width: 64px; height: 64px; image-rendering: pixelated; }
.aud-c .wbtn { margin: 0; }

/* 背包：家具的位置标签 + 竖排按钮 */
.bd-bi .bd-loc { align-self: flex-start; margin-top: 3px; font-size: 10.5px; color: var(--ink2); } .bd-bi .bd-loc.on { color: var(--accent); border-color: var(--accent); }
.bd-bb { display: flex; flex-direction: column; gap: 4px; flex: none; }

/* 战报：伤亡人物卡 */
.cas-g { display: grid; grid-template-columns: repeat(auto-fill, minmax(96px, 1fr)); gap: 6px; margin: 8px 0; }
.cas-c { display: flex; flex-direction: column; align-items: center; gap: 2px; padding: 6px 4px; border: 1px solid var(--line2); background: var(--card2); cursor: pointer; text-align: center; }
.cas-c:hover { border-color: var(--accent); }
.cas-c img { width: 40px; height: 40px; image-rendering: pixelated; }
.cas-c b { font-size: 12px; max-width: 100%; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.cas-c small { font-size: 11px; padding: 0 6px; }
.cas-dead { border-color: #ff4d6d; background: rgba(255, 77, 109, .1); } .cas-dead img { filter: grayscale(.8); } .cas-dead small { background: #ff4d6d; color: #fff; }
.cas-permanent small { background: #9a5cff; color: #fff; } .cas-severe small { background: #ff8a3a; color: #1a0e00; } .cas-light small { background: var(--line2); color: var(--ink); }

/* 结局页：伴侣 / 最亲密的人的人物卡格子 */
.dc-pc { cursor: pointer; } .dc-pc:hover b { color: var(--accent); }
.dc-pc-r { display: flex; align-items: center; gap: 10px; margin-top: 4px; } .dc-pc-r img { width: 48px; height: 48px; image-rendering: pixelated; flex: none; } .dc-pc-r > span { display: flex; flex-direction: column; min-width: 0; }

/* 结局页：再活一次 / 回到主页 固定在底部 */
.end-fixbar { position: fixed; left: 0; right: 0; bottom: 0; z-index: 60; display: flex; justify-content: center; gap: 12px; margin: 0 !important; padding: 10px 16px calc(10px + env(safe-area-inset-bottom)); background: color-mix(in srgb, var(--bg, #0b1018) 88%, transparent); border-top: 1px solid var(--line2); backdrop-filter: blur(6px); }
.end2 { padding-bottom: 76px; }

/* ===== 人生编年 / 人物志 ===== */
.an-p { display: inline-flex; align-items: center; gap: 3px; margin: 0 2px; padding: 0 5px 0 1px; vertical-align: -5px; border: 1px solid var(--line2); background: var(--card2); border-radius: 3px; cursor: default; white-space: nowrap; }
.an-p[data-act] { cursor: pointer; } .an-p[data-act]:hover { border-color: var(--accent); }
.an-p img { width: 20px; height: 20px; image-rendering: pixelated; } .an-p b { font-weight: 600; font-size: .95em; }
.an-me { color: var(--accent); }
.an-vol > summary b { font-size: 16px; letter-spacing: .08em; } .an-vol > summary small { margin-left: 10px; color: var(--ink2); font-family: var(--mono); }
.an-intro { margin: 8px 0 10px; padding: 8px 12px; border-left: 3px solid var(--accent); background: var(--card2); line-height: 1.9; }
.an-m { display: grid; grid-template-columns: 76px minmax(0, 260px) minmax(0, 1fr); gap: 12px; align-items: start; padding: 10px 0; border-bottom: 1px dashed var(--line); }
.an-m time { font-family: var(--mono); color: var(--accent); font-size: 13px; padding-top: 2px; }
.an-m .an-ph { width: 100%; aspect-ratio: 240 / 72; image-rendering: pixelated; border: 1px solid var(--line2); background: #0a1220; }
.an-m p { margin: 0 0 6px; line-height: 1.95; } .an-m .an-more { color: var(--ink2); font-size: 13px; }
.an-m.quiet { grid-template-columns: 76px 120px minmax(0, 1fr); padding: 4px 0; opacity: .75; } .an-m.quiet p { font-size: 13px; color: var(--ink2); }
.an-m.key time { color: #ffd166; } .an-m.bat { background: linear-gradient(90deg, rgba(255, 77, 109, .06), transparent 60%); }
.an-foot { margin: 10px 0 4px; padding: 6px 12px; border: 1px solid var(--line2); color: var(--ink2); font-size: 13px; }
@media (max-width: 760px) { .an-m, .an-m.quiet { grid-template-columns: 1fr; } }
.an-who { display: grid; grid-template-columns: minmax(0, 200px) minmax(0, 260px) minmax(0, 1fr); gap: 12px; padding: 12px 0; border-bottom: 1px dashed var(--line); }
.an-who-h { display: flex; gap: 10px; align-items: center; } .an-who-h img { width: 56px; height: 56px; image-rendering: pixelated; } .an-who-h b { display: block; font-size: 15px; } .an-who-h small { color: var(--ink2); }
.an-who .an-ph { width: 100%; aspect-ratio: 240 / 72; image-rendering: pixelated; border: 1px solid var(--line2); }
.an-who-t p { margin: 0 0 6px; line-height: 1.85; } .an-pt time { font-family: var(--mono); color: var(--accent); margin-right: 6px; }
.an-who.gone .an-who-h img { filter: grayscale(.7); }
@media (max-width: 760px) { .an-who { grid-template-columns: 1fr; } }
#alb-cv { width: 100%; aspect-ratio: 240 / 72; image-rendering: pixelated; display: block; }
.alb-cap2 { padding: 8px 12px; line-height: 1.8; } .alb-cap2 time { font-family: var(--mono); color: var(--accent); margin-right: 8px; }
.alb-strip canvas { width: 100%; aspect-ratio: 240 / 72; image-rendering: pixelated; display: block; } .alb-strip figure.key figcaption { color: #ffd166; }

/* 纪念页里的人生编年 / 人物志：配色跟着科幻 HUD */
.lp-box .an-p { background: rgba(79, 227, 255, .07); border-color: var(--hl); color: var(--hi); } .lp-box .an-me { color: var(--hc2); }
.lp-box .an-vol > summary { color: var(--hc2); } .lp-box .an-intro { background: rgba(79, 227, 255, .06); border-left-color: var(--hc); color: var(--hi); }
.lp-box .an-m { border-bottom-color: rgba(79, 227, 255, .12); } .lp-box .an-m time, .lp-box .an-pt time { color: var(--hc2); } .lp-box .an-m.key time { color: var(--hg); }
.lp-box .an-m p, .lp-box .an-who-t p { color: var(--hi); } .lp-box .an-foot { border-color: var(--hl); }
.lp-box .an-who { border-bottom-color: rgba(79, 227, 255, .12); } .lp-box .an-who-h small { color: var(--hi2); }
/* 纪念页：编年的折叠栏（深色） */
.lp-box details.fold { background: rgba(10, 22, 38, .85); border: 1px solid var(--hl); color: var(--hi); margin: 8px 0; }
.lp-box details.fold > summary { background: linear-gradient(90deg, rgba(79, 227, 255, .14), transparent 70%); color: var(--hc2); border: 0; box-shadow: none; }
.lp-box details.fold > summary b { color: #fff; } .lp-box details.fold > summary small { color: var(--hi2); }
.lp-box .an-m.quiet p { color: var(--hi2); }

/* Garden「学生」页：搜索栏（名字 + 年级 / 稀有技能筛选 + 搜索）、结果卡片居中、分页 */
.stu-bar { display: flex; flex-wrap: wrap; align-items: stretch; gap: 8px; margin: 4px 0 8px; }
.stu-bar .stu-q, .stu-bar select { font: inherit; font-size: 13.5px; height: 34px; padding: 0 10px; border: 1px solid var(--line2); border-radius: 4px; background: var(--card); color: var(--ink); outline: none; transition: border-color .15s, box-shadow .15s; }
.stu-bar .stu-q { flex: 1 1 200px; min-width: 0; }
.stu-bar select { flex: 0 1 180px; min-width: 0; cursor: pointer; }
.stu-bar .stu-q:hover, .stu-bar select:hover { border-color: color-mix(in srgb, var(--accent) 50%, var(--line2)); }
.stu-bar .stu-q:focus, .stu-bar select:focus { border-color: var(--accent); box-shadow: 0 0 0 3px var(--glow); }
.stu-bar .stu-q::placeholder { color: var(--ink3, var(--ink2)); opacity: .7; }
.stu-bar .stu-go { flex: 0 0 auto; width: auto; height: 34px; margin: 0; padding: 0 22px; }
.stu-res .friends { justify-content: center; }
.stu-res > .hint { text-align: center; }
.stu-pg { display: flex; flex-wrap: wrap; justify-content: center; align-items: center; gap: 4px; margin-top: 10px; }
.stu-pg button.mini { margin: 0; min-width: 30px; height: 26px; font-size: 12.5px; }
.stu-pg button.mini.on { background: var(--accent); color: var(--bg, #000); border-color: var(--accent); opacity: 1; }
@media (max-width: 760px) { .stu-bar select { flex: 1 1 calc(50% - 4px); } .stu-bar .stu-go { flex: 1 1 100%; } }

/* kv 行带「明细」按钮时（标签 / 数值 / 明细三段）：数值靠右贴着明细，不要被 space-between 挤到中间 */
.kv.st-d > b { margin-left: auto; }

/* 结局页：两人的回忆（重要关系事件） */
.bmem { display: grid; gap: 12px; }
.bmem-h { display: flex; align-items: center; gap: 8px; margin-bottom: 6px; } .bmem-h b { font-size: 14px; } .bmem-h small { color: var(--ink2); font-size: 11.5px; }
.bmem ol { list-style: none; margin: 0; padding: 0 0 0 10px; border-left: 2px solid color-mix(in srgb, var(--accent) 45%, transparent); display: grid; gap: 8px; }
.bmem li time { display: block; font-size: 11px; color: var(--accent); font-family: var(--mono); } .bmem li b { font-size: 13px; }
.bmem li p { margin: 2px 0 0; font-size: 12.5px; line-height: 1.7; color: var(--ink2); }
/* 人生编年里回忆的那一幕 */
.an-memo { display: block; margin-top: 3px; padding-left: 8px; border-left: 2px solid color-mix(in srgb, var(--accent) 40%, transparent); font-size: .94em; opacity: .9; }

/* 纪念页的成就：点亮式卡片（同结局页 .ach），配色跟着科幻 HUD */
.lp-box .ach-i { border-color: rgba(79, 227, 255, .14); } .lp-box .ach-i b { color: var(--hi); } .lp-box .ach-i small { color: var(--hi2); }
.lp-box .ach-i.ok { border-color: var(--hl); background: rgba(79, 227, 255, .08); box-shadow: 0 0 10px rgba(79, 227, 255, .12) inset; } .lp-box .ach-i.ok i { color: var(--hc); text-shadow: 0 0 8px var(--hc); }

/* 军团室名牌写全名：最宽一个座位，长名字缩字号、换行 */
.lr-plate { max-width: 9.4%; text-align: center; word-break: break-all; } .lr-plate.long { font-size: clamp(6px, .95vw, 9.5px); } .lr-plate.xlong { font-size: clamp(5.5px, .8vw, 8px); }

/* 纪念页影片：左右的上一幕 / 下一幕 */
.lf-nav { position: absolute; top: 36%; transform: translateY(-50%); z-index: 6; width: 34px; height: 64px; padding: 0; display: flex; align-items: center; justify-content: center; font-size: 30px; line-height: 1; color: var(--hc2); background: rgba(3, 8, 16, .55); border: 1px solid rgba(79, 227, 255, .45); cursor: pointer; opacity: .55; transition: opacity .2s, background .2s; }
.lf-nav:hover { opacity: 1; background: rgba(79, 227, 255, .18); } .lf-prev { left: 8px; } .lf-next { right: 8px; }

/* 纪念页：结局模式的按钮（代替关闭），左栏的分享 */
.lp-endbar { position: absolute; right: 12px; top: 10px; z-index: 6; display: flex; gap: 8px; }
.lp-endbar button { padding: 6px 14px; font-weight: 700; border: 1px solid var(--hl); background: rgba(79, 227, 255, .08); color: var(--hi); cursor: pointer; }
.lp-endbar .cta { background: var(--hc); color: #04121c; border-color: var(--hc); }
.lp-share { display: block; width: 100%; margin-top: 10px; }

/* 纪念馆列表：结局卡画好之前的占位（卡片形状 + 小头像，不放大） */
.mh-ph { display: flex; align-items: center; justify-content: center; width: 100%; aspect-ratio: 4 / 5; background: linear-gradient(#0a1d33, #050a14); border-bottom: 1px solid rgba(79, 227, 255, .25); }
.mh-mem .mh-ph img.pix { width: 34%; aspect-ratio: 1; background: rgba(79, 227, 255, .08); border: 1px solid rgba(79, 227, 255, .35); }

/* 名字后的真人标记（纪念馆里的人生 / 正在游玩的玩家，作为同学出现） */
.real { color: #ff6fae; margin-left: 4px; white-space: nowrap; }

/* 加入主画面：首页统计框下面的提示卡 + 步骤说明 */
.a2hs { display: flex; gap: 14px; align-items: flex-start; margin-top: 14px; padding: 14px 16px; border: 1px solid color-mix(in srgb, var(--accent) 60%, transparent); background: color-mix(in srgb, var(--accent) 8%, transparent); border-radius: 10px; }
.a2hs[hidden] { display: none; }
.a2hs .a2-ico { width: 56px; height: 56px; border-radius: 12px; flex: none; image-rendering: auto; }
.a2hs p { margin: 0; line-height: 1.7; } .a2hs p b { margin-right: 4px; }
.a2hs .a2-act { display: flex; gap: 8px; margin-top: 10px; flex-wrap: wrap; }
#a2-sheet { position: fixed; inset: 0; z-index: 160; display: flex; align-items: center; justify-content: center; background: rgba(4, 8, 16, .7); backdrop-filter: blur(3px); }
#a2-sheet .a2s { position: relative; width: min(460px, calc(100vw - 24px)); padding: 18px 20px; background: var(--bg, #0b1220); border: 1px solid var(--accent); border-radius: 10px; }
#a2-sheet h3 { margin: 0 0 8px; } #a2-sheet p { margin: 0 0 10px; line-height: 1.7; color: var(--ink2); }
#a2-sheet ol { margin: 0 0 10px; padding-left: 1.3em; line-height: 1.9; } #a2-sheet .a2s-note { font-size: 12.5px; padding: 8px 10px; border-left: 3px solid var(--accent); background: color-mix(in srgb, var(--accent) 7%, transparent); color: var(--ink2); }
#a2-sheet .a2s-x { position: absolute; right: 10px; top: 6px; border: 0; background: transparent; font-size: 22px; color: var(--ink2); cursor: pointer; }