/* =========================================================
警务人生 — 现代微彩水墨风
宣纸底 · 水墨晕染 · 朱砂/警蓝微彩 · 纸质文书
========================================================= */
:root{
--paper:#f3eee2; --paper2:#e9e1d1; --paper3:#dcd2be;
--ink:#1a1e24; --ink2:#3d434b; --ink3:#6b7078;
--cinnabar:#a8392c; /* 朱砂：印章/警示 */
--police:#26456f; /* 警蓝：指令/职级 */
--bamboo:#4d6b57; /* 竹青：好评（加深，小字号下更清晰） */
--ochre:#8f6a30; /* 赭石：金钱/贪腐（加深） */
--line:rgba(32,36,42,.16);
--shadow:0 2px 14px rgba(40,34,24,.10);
--serif:"Source Han Serif SC","Noto Serif SC","思源宋体 CN","Songti SC","SimSun",serif;
--kai:"STKaiti","KaiTi","Kaiti SC","Songti SC",serif;
--ui:"PingFang SC","Microsoft YaHei","微软雅黑","Hiragino Sans GB","Noto Sans SC",sans-serif;
--mono:"Menlo","Consolas",monospace;
}
*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}
html,body{margin:0;height:100%}
body{
font-family:var(--serif); color:var(--ink); background:#dcd3c0;
font-size:14px; line-height:1.6;
-webkit-font-smoothing:antialiased;
-moz-osx-font-smoothing:grayscale;
text-rendering:optimizeLegibility;
font-feature-settings:"kern" 1, "liga" 1;
background-image:
radial-gradient(1100px 620px at 12% -10%, rgba(38,69,111,.16), transparent 62%),
radial-gradient(900px 560px at 108% 22%, rgba(168,57,44,.10), transparent 60%),
radial-gradient(700px 700px at 50% 120%, rgba(32,36,42,.14), transparent 60%),
linear-gradient(180deg,#e6ddca,#d3c9b2);
overflow:hidden;
}
body::after{ /* 宣纸纤维：只在背景上做质感，不遮文字 */
content:""; position:fixed; inset:0; pointer-events:none; opacity:.18; mix-blend-mode:multiply;
background-image:
repeating-linear-gradient(92deg, rgba(120,105,80,.045) 0 1px, transparent 1px 4px),
repeating-linear-gradient(2deg, rgba(120,105,80,.035) 0 1px, transparent 1px 5px);
}
#screenGame,#screenStart{position:fixed;inset:0}
[hidden]{display:none !important} /* ID 选择器会盖过 .screen[hidden]，统一用 important 兜底 */
button{font-family:var(--serif)}
/* ============ 开局 ============ */
.startWrap{height:100%;overflow:auto;padding:26px 18px 40px;max-width:760px;margin:0 auto}
.inkTitle{display:flex;align-items:flex-end;gap:16px;margin-bottom:6px}
.sealBig{
width:56px;height:56px;flex:0 0 56px;border-radius:6px;background:var(--cinnabar);color:#f7f2e6;
font-family:var(--kai);font-size:20px;line-height:1.1;display:flex;align-items:center;justify-content:center;
text-align:center;box-shadow:0 6px 16px rgba(168,57,44,.35);letter-spacing:1px;
-webkit-mask-image:radial-gradient(circle at 30% 30%,#000 96%,transparent);
}
.inkTitle h1{
font-family:var(--kai);font-size:44px;margin:0;letter-spacing:8px;
background:linear-gradient(180deg,#161a20 42%,#5b626b);-webkit-background-clip:text;background-clip:text;color:transparent;
text-shadow:0 1px 0 rgba(255,255,255,.4);
}
.sub{margin:2px 0 0;color:var(--ink3);letter-spacing:3px;font-size:12px}
.lineIntro{margin:22px 0 14px;color:var(--ink2);font-size:14px;line-height:1.9;border-left:3px solid var(--cinnabar);padding-left:12px}
.lineCards{display:grid;gap:12px}
.lineCard{
background:linear-gradient(180deg,rgba(255,255,255,.72),rgba(255,255,255,.45));
border:1px solid var(--line);border-radius:3px;padding:16px 16px 14px;cursor:pointer;position:relative;
box-shadow:var(--shadow);transition:.18s;
}
.lineCard:hover{transform:translateY(-2px);box-shadow:0 8px 22px rgba(40,34,24,.16)}
.lineCard.on{border-color:var(--cinnabar);box-shadow:0 0 0 2px rgba(168,57,44,.18),var(--shadow)}
.lineCard h3{margin:0;font-family:var(--kai);font-size:22px;letter-spacing:3px}
.lineCard .tag{display:inline-block;margin-left:8px;font-size:11.5px;color:var(--police);border:1px solid rgba(38,69,111,.35);padding:1px 6px;border-radius:2px;vertical-align:3px}
.lineCard p{margin:8px 0 0;font-size:13px;line-height:1.85;color:var(--ink2)}
.lineCard .kv{margin-top:10px;display:flex;flex-wrap:wrap;gap:6px}
.lineCard .kv span{font-size:11.5px;background:var(--paper2);padding:3px 8px;border-radius:2px;color:var(--ink2)}
.lineCard .wall{margin-top:10px;font-size:12px;color:var(--cinnabar)}
.startFoot{margin-top:22px;display:flex;align-items:center;gap:12px;flex-wrap:wrap}
.nameBox{font-size:13px;color:var(--ink2)}
.nameBox input{font-family:var(--serif);font-size:16px;padding:6px 10px;border:1px solid var(--line);border-radius:2px;background:rgba(255,255,255,.6);width:110px}
/* ============ 按钮 ============ */
.btn{cursor:pointer;border:1px solid var(--line);border-radius:2px;padding:9px 20px;font-size:15px;letter-spacing:2px;background:#fff;transition:.15s}
.btn:hover{border-color:var(--ink2)}
.btn-ink{background:var(--ink);color:#f4efe2;box-shadow:var(--shadow)}
.btn-ink:hover{background:#000}
.btn-cinnabar{background:var(--cinnabar);color:#fff9ee;box-shadow:0 2px 10px rgba(168,57,44,.35);letter-spacing:1px}
.btn-cinnabar:hover{background:#8b2f24}
.btn[disabled]{opacity:.55;cursor:default}
.btn-ghost{background:transparent;color:var(--ink2)}
.btn-pol{background:var(--police);color:#f1f5fa;border-color:transparent}
.btn-warn{background:transparent;color:var(--cinnabar);border-color:rgba(168,57,44,.5)}
.btn:disabled{opacity:.45;cursor:not-allowed}
.btn-sm{padding:5px 12px;font-size:12px;letter-spacing:1px}
/* ============ HUD ============ */
#screenGame{max-width:760px;margin:0 auto;display:flex;flex-direction:column;background:rgba(247,243,233,.82);box-shadow:0 0 60px rgba(40,34,24,.22)}
.hud{display:flex;align-items:center;gap:8px;padding:9px 12px;border-bottom:1px solid var(--line);background:linear-gradient(180deg,rgba(255,255,255,.8),rgba(243,238,226,.5))}
.hudL{display:flex;align-items:center;gap:8px;flex:1.15;min-width:0;overflow:hidden}
.seal{width:28px;height:28px;border-radius:3px;background:var(--police);color:#f2f6fb;font-family:var(--kai);display:flex;align-items:center;justify-content:center;font-size:14px;flex:0 0 28px}
.hudName{font-size:13px;display:flex;align-items:center;gap:5px;white-space:nowrap;overflow:hidden}
.chip{font-size:11.5px;color:var(--ink3);border:1px solid var(--line);padding:0 5px;border-radius:8px;white-space:nowrap}
.hudRank{font-size:11.5px;color:var(--police);letter-spacing:.5px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.hudC{text-align:center;flex:1.1}
.clock{font-family:var(--kai);font-size:16px;letter-spacing:2px}
.speed{display:flex;gap:4px;justify-content:center;margin-top:3px}
.spBtn{width:30px;height:20px;font-size:11.5px;border:1px solid var(--line);background:rgba(255,255,255,.6);border-radius:2px;color:var(--ink3);cursor:pointer}
.spBtn.on{background:var(--ink);color:#f2ecdd;border-color:var(--ink)}
.hudR{display:flex;gap:7px;flex:0 0 auto;justify-content:flex-end}
.meter{display:flex;align-items:center;gap:4px;font-size:11.5px;color:var(--ink2)}
.meter span{font-family:var(--kai)}
.meter i{width:44px;height:5px;background:var(--paper3);border-radius:3px;overflow:hidden;display:block}
.meter i b{display:block;height:100%;background:var(--police);width:50%;transition:.3s}
.meter.ya i b{background:var(--ochre)} .meter.yu i b{background:var(--cinnabar)}
/* ============ 折叠分类卡（6 类：政务/案卷/岗位/人脉/成长/生活/档案）============ */
.cats{
display:grid;grid-template-columns:repeat(2,1fr);gap:8px;
padding:10px 12px;
background:linear-gradient(180deg,rgba(243,238,226,.7),rgba(220,210,190,.45));
border-bottom:1px solid var(--line);
}
@media (min-width:640px) and (orientation:landscape){
.cats{grid-template-columns:repeat(3,1fr);gap:9px;padding:11px 14px}
}
@media (min-width:980px){
.cats{grid-template-columns:repeat(3,1fr)}
}
.catBtn{
position:relative;
display:grid;grid-template-columns:38px 1fr;gap:10px;align-items:center;
padding:9px 11px 9px 10px;
background:linear-gradient(180deg,#fffdf6,#f7f1e3);
border:1.5px solid rgba(168,57,44,.45);
border-radius:3px;
cursor:pointer;text-align:left;
font-family:var(--serif);
box-shadow:0 2px 8px rgba(40,34,24,.08);
transition:.14s;
min-height:54px;
}
.catBtn:hover{background:#fff;border-color:var(--cinnabar);transform:translateY(-1px);box-shadow:0 5px 14px rgba(40,34,24,.14)}
.catBtn.on{
background:#fff;border-color:var(--cinnabar);
box-shadow:0 0 0 2px rgba(168,57,44,.20),0 4px 12px rgba(40,34,24,.14);
}
.catIcon{
width:38px;height:38px;border-radius:50%;
background:radial-gradient(circle at 30% 28%,rgba(255,255,255,.6),rgba(176,129,63,.28) 70%,rgba(168,57,44,.18));
border:1.5px solid rgba(168,57,44,.55);
display:flex;align-items:center;justify-content:center;
font-family:var(--kai);font-size:18px;letter-spacing:0;color:var(--cinnabar);
flex:0 0 38px;
box-shadow:inset 0 -2px 4px rgba(168,57,44,.15);
}
.catText{min-width:0;display:flex;flex-direction:column;justify-content:center;gap:1px}
.catName{font-family:var(--kai);font-size:15px;letter-spacing:3px;color:var(--ink);line-height:1.1}
.catSub{font-size:11.5px;color:var(--ink3);letter-spacing:.5px;line-height:1.25;margin-top:1px}
.catBadge{
position:absolute;top:-6px;right:-6px;z-index:2;
min-width:30px;height:24px;padding:0 6px;
border-radius:12px;background:var(--cinnabar);color:#fff;
font-family:var(--mono);font-size:11.5px;font-weight:bold;line-height:24px;text-align:center;
box-shadow:0 2px 5px rgba(168,57,44,.45);
border:1.5px solid #fff;
display:inline-flex;align-items:baseline;gap:2px;justify-content:center;
}
.catBadge i{font-style:normal;font-size:11.5px;font-weight:normal;opacity:.85;letter-spacing:0}
.badge{display:inline-block;min-width:16px;padding:0 4px;height:16px;line-height:16px;border-radius:8px;background:var(--cinnabar);color:#fff;font-size:11.5px;font-family:var(--serif)}
/* ============ Stage ============ */
.stage{flex:1;overflow:auto;padding:14px 14px 90px;position:relative}
.panel[hidden]{display:none}
.sceneBox{position:relative;height:132px;border-radius:3px;overflow:hidden;border:1px solid var(--line);margin-bottom:12px;
background:#242830 center/cover no-repeat;filter:saturate(.72) contrast(1.02)}
.sceneBox.s-night{background-image:url(../assets/night.webp)}
.sceneBox.s-duty{background-image:url(../assets/duty.webp)}
.sceneBox::after{content:"";position:absolute;inset:0;background:
linear-gradient(180deg,rgba(243,238,226,.10) 0%,rgba(32,36,42,.15) 45%,rgba(24,26,30,.72) 100%)}
.sceneInk{position:absolute;inset:0;pointer-events:none;background:
radial-gradient(120% 60% at 50% 120%,rgba(32,36,42,.55),transparent 70%)}
.sceneCap{position:absolute;left:12px;bottom:9px;font-family:var(--kai);font-size:16px;letter-spacing:4px;color:#f6f2e8;
text-shadow:0 1px 4px rgba(0,0,0,.75);z-index:2}
/* 场景插画条（审讯室等） */
.art{height:88px;border-radius:2px;margin:6px 0 10px;background:center/cover no-repeat;border:1px solid var(--line);position:relative;overflow:hidden}
.art::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(243,238,226,.05),rgba(32,36,42,.5))}
.art.room{background-image:url(../assets/room.webp)}
.art.night{background-image:url(../assets/night.webp)}
.art.duty{background-image:url(../assets/duty.webp)}
.dutyBody{display:flex;flex-direction:column;gap:12px}
.hintInk{font-size:13px;color:var(--ink3);line-height:1.9}
/* ============ 卡片 / 文书 ============ */
.doc{background:linear-gradient(180deg,#fffdf7,#f8f3e8);border:1px solid var(--line);border-radius:2px;padding:14px 15px;box-shadow:var(--shadow);position:relative}
.doc::before{content:"";position:absolute;left:0;top:0;bottom:0;width:3px;background:var(--police);opacity:.75}
.docHead{display:flex;justify-content:space-between;align-items:baseline;gap:8px}
.docTitle{font-family:var(--kai);font-size:19px;letter-spacing:2px}
.docNo{font-family:var(--mono);font-size:11.5px;color:var(--ink3)}
.docMeta{font-size:11.5px;color:var(--ink3);margin-top:3px;letter-spacing:1px}
.docBody{font-size:14px;line-height:1.95;color:var(--ink2);margin-top:9px;text-align:justify}
.docBody .em{color:var(--ink);border-bottom:1px dashed var(--ochre)}
.stamp{position:absolute;right:12px;top:10px;width:52px;height:52px;border:2px solid rgba(168,57,44,.6);border-radius:50%;color:rgba(168,57,44,.75);
display:flex;align-items:center;justify-content:center;font-family:var(--kai);font-size:12px;text-align:center;line-height:1.15;transform:rotate(-14deg);pointer-events:none}
.acts{display:flex;flex-direction:column;gap:7px;margin-top:13px}
.act{text-align:left;padding:10px 12px;border:1px solid var(--line);border-radius:2px;background:rgba(255,255,255,.66);cursor:pointer;font-size:14px;line-height:1.5;transition:.14s;position:relative}
.act:hover{background:#fff;border-color:var(--ink2);transform:translateX(2px)}
.act .need{display:block;font-size:11.5px;color:var(--ink3);margin-top:3px;letter-spacing:1px}
.act .need b{color:var(--police);font-weight:normal}
.act[disabled]{opacity:.5;cursor:not-allowed;transform:none}
.act.retry{border-style:dashed;border-color:var(--ochre)}
.rowStamp{font-family:var(--kai);letter-spacing:3px;color:var(--cinnabar);font-size:15px;margin-top:10px}
.tierLine{margin-top:11px;padding-top:9px;border-top:1px dashed var(--line);font-size:13px;color:var(--ink2)}
.tierLine .t{font-family:var(--kai);letter-spacing:2px;font-size:15px}
.t0{color:var(--cinnabar)} .t1{color:var(--ochre)} .t2{color:var(--ink)} .t3{color:var(--bamboo)} .t4{color:var(--police)}
.mods{font-size:11.5px;color:var(--ink3);margin-top:4px}
/* ============ 弹层 ============ */
.modal{position:fixed;inset:0;background:rgba(28,26,22,.52);display:flex;align-items:center;justify-content:center;padding:16px;z-index:50;backdrop-filter:blur(2px)}
.modal[hidden]{display:none}
.modalBox{width:100%;max-width:560px;max-height:86vh;overflow:auto;background:linear-gradient(180deg,#fffdf7,#f6f1e5);border:1px solid var(--line);border-radius:3px;padding:18px 18px 16px;box-shadow:0 20px 60px rgba(0,0,0,.35);position:relative;animation:pop .18s ease-out}
@keyframes pop{from{transform:translateY(10px) scale(.98);opacity:.4}to{transform:none;opacity:1}}
.modalBox::after{content:"";position:absolute;inset:6px;border:1px solid rgba(32,36,42,.07);pointer-events:none}
.mClose{position:absolute;right:10px;top:10px;border:0;background:transparent;font-size:20px;color:var(--ink3);cursor:pointer;line-height:1}
.mTitle{font-family:var(--kai);font-size:22px;letter-spacing:3px;margin-bottom:2px}
/* ============ 警情队列 ============ */
.queue{position:fixed;right:calc(50% - 380px + 12px);bottom:12px;width:270px;display:flex;flex-direction:column;gap:8px;z-index:30}
@media (max-width:800px){.queue{right:10px;left:10px;width:auto;bottom:10px}}
.qCard{background:linear-gradient(180deg,#fffdf6,#f4eee1);border:1px solid var(--line);border-left:4px solid var(--police);border-radius:2px;padding:9px 11px;box-shadow:0 6px 18px rgba(30,26,18,.22);animation:slide .28s ease-out}
.qCard.red{border-left-color:var(--cinnabar)} .qCard.gold{border-left-color:var(--ochre)}
.qCard.due{border-left-color:var(--ink3);opacity:.82}
.qCard.ringing{border-left-color:var(--cinnabar);animation:ringPulse 1.6s ease-in-out infinite}
@keyframes ringPulse{0%,100%{box-shadow:0 6px 18px rgba(30,26,18,.22)}50%{box-shadow:0 6px 24px rgba(168,57,44,.55);border-left-width:6px}}
.qStage{margin-left:6px;padding:1px 6px;border-radius:9px;font-size:11.5px;letter-spacing:1px;font-family:var(--mono)}
.qStage.ring{background:var(--cinnabar);color:#fff9ee}
.qStage.route{background:var(--police);color:#fff9ee}
.qScene{margin-left:6px;padding:1px 6px;border-radius:9px;font-size:11.5px;background:var(--bamboo);color:#fff9ee;letter-spacing:1px}
@keyframes slide{from{transform:translateX(26px);opacity:0}to{transform:none;opacity:1}}
.qFrom{font-size:11.5px;color:var(--police);letter-spacing:2px}
.qCard.red .qFrom{color:var(--cinnabar)}
.qTitle{font-family:var(--kai);font-size:15px;letter-spacing:1px;margin:2px 0 4px}
.qFoot{display:flex;justify-content:space-between;align-items:center;gap:6px}
.qTimer{font-size:11.5px;color:var(--ink3);font-family:var(--mono)}
.qBtns{display:flex;gap:6px}
/* ============ 档案 ============ */
.grid2{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.grid4{display:grid;grid-template-columns:repeat(4,1fr);gap:8px}
@media (max-width:520px){.grid4{grid-template-columns:1fr 1fr}}
.stat{background:rgba(255,255,255,.6);border:1px solid var(--line);border-radius:2px;padding:8px 10px}
.stat .k{font-size:11.5px;color:var(--ink3);letter-spacing:1px}
.stat .v{font-family:var(--kai);font-size:17px;margin-top:1px}
.abRow{display:flex;align-items:center;gap:8px;margin-bottom:7px;font-size:13px}
.abRow .nm{width:72px;color:var(--ink2);letter-spacing:1px}
.abRow .bar{flex:1;height:7px;background:var(--paper3);border-radius:4px;overflow:hidden}
.abRow .bar b{display:block;height:100%;background:linear-gradient(90deg,var(--police),#4d7bb2);transition:.4s}
.abRow .num{width:30px;text-align:right;font-family:var(--mono);font-size:12px;color:var(--ink2)}
.sectTitle{font-family:var(--kai);font-size:16px;letter-spacing:3px;margin:16px 0 8px;color:var(--ink);display:flex;align-items:center;gap:8px}
.sectTitle::before{content:"";width:5px;height:15px;background:var(--cinnabar)}
.lawBox{font-size:12px;line-height:1.85;color:var(--ink2);background:rgba(38,69,111,.06);border:1px dashed rgba(38,69,111,.28);border-radius:2px;padding:9px 11px;margin-top:10px}
.lawBox b{color:var(--police);font-weight:normal}
/* ============ 案卷 ============ */
.caseCard{cursor:pointer}
.evList{display:flex;flex-wrap:wrap;gap:6px;margin-top:9px}
.ev{font-size:12px;padding:4px 9px;border:1px solid rgba(95,127,107,.5);color:var(--bamboo);border-radius:2px;background:rgba(95,127,107,.08)}
.ev.weak{border-color:rgba(176,129,63,.5);color:var(--ochre);background:rgba(176,129,63,.08)}
.ev.none{border-color:var(--line);color:var(--ink3);background:transparent}
.caseSteps{display:flex;gap:4px;margin:10px 0 0;font-size:11.5px;color:var(--ink3);flex-wrap:wrap}
.caseSteps i{padding:2px 7px;border:1px solid var(--line);border-radius:10px;font-style:normal}
.caseSteps i.on{background:var(--ink);color:#f2ecdd;border-color:var(--ink)}
/* ============ 审讯 ============ */
.npcHead{display:flex;align-items:center;gap:10px;margin-bottom:8px}
.npcBar{height:6px;background:var(--paper3);border-radius:3px;overflow:hidden;margin-top:4px}
.npcBar b{display:block;height:100%;background:linear-gradient(90deg,var(--ochre),var(--cinnabar));transition:.35s}
.talkLog{max-height:34vh;overflow:auto;border:1px solid var(--line);border-radius:2px;background:rgba(255,255,255,.5);padding:10px 12px;font-size:14px;line-height:1.9;margin:10px 0}
.talkLog .you{color:var(--police)} .talkLog .npc{color:var(--ink)} .talkLog .sys{color:var(--ink3);font-size:12px}
.talkLog p{margin:0 0 8px}
.askRow{display:flex;gap:6px;margin-top:8px}
.askRow input{flex:1;font-family:var(--serif);font-size:14px;padding:8px 10px;border:1px solid var(--line);border-radius:2px;background:rgba(255,255,255,.75)}
.askRow input:focus{border-color:var(--police)}
.chips{display:flex;flex-wrap:wrap;gap:6px;margin-top:8px}
.chip2{font-size:12px;padding:5px 10px;border:1px solid var(--line);border-radius:12px;background:rgba(255,255,255,.6);cursor:pointer;color:var(--ink2)}
.chip2:hover{border-color:var(--ink2);background:#fff}
/* ============ 回顾 / toast ============ */
.logLine{font-size:13px;line-height:1.9;color:var(--ink2);border-bottom:1px dotted var(--line);padding:6px 0;display:flex;gap:8px}
.logLine .d{font-family:var(--mono);font-size:11.5px;color:var(--ink3);flex:0 0 84px}
.logLine.imp{color:var(--ink)} .logLine.bad{color:var(--cinnabar)} .logLine.good{color:var(--bamboo)}
.toasts{position:fixed;left:50%;top:14px;transform:translateX(-50%);display:flex;flex-direction:column;gap:6px;z-index:80;align-items:center;pointer-events:none}
.toast{font-family:var(--kai);letter-spacing:2px;font-size:14px;padding:7px 16px;border-radius:2px;background:rgba(32,36,42,.92);color:#f4efe2;box-shadow:var(--shadow);animation:tin .25s ease-out}
.toast.good{background:rgba(95,127,107,.94)} .toast.bad{background:rgba(168,57,44,.94)} .toast.up{background:rgba(38,69,111,.94)}
@keyframes tin{from{transform:translateY(-12px);opacity:0}to{transform:none;opacity:1}}
.endWrap{text-align:center;padding:10px 0}
.endWrap .big{font-family:var(--kai);font-size:30px;letter-spacing:6px;margin:10px 0}
.kvTable{width:100%;border-collapse:collapse;font-size:13px;margin-top:8px}
.kvTable td{border-bottom:1px dotted var(--line);padding:5px 2px;color:var(--ink2)}
.kvTable td:last-child{text-align:right;color:var(--ink);font-family:var(--mono);font-size:12px}
.finePrint{font-size:11.5px;color:var(--ink3);line-height:1.7;margin-top:14px;border-top:1px dashed var(--line);padding-top:8px}
/* =========================================================
横屏 / 宽屏适配（追加）
核心思路：不缩放、不拉伸，改用响应式双栏布局，
文字始终以原生尺寸渲染，保证不失帧。
========================================================= */
@media (min-width: 640px) and (orientation: landscape) {
/* 游戏主容器：由窄竖屏改为横屏双栏 */
#screenGame{
max-width:1280px;
display:grid;
grid-template-columns:minmax(0,1fr) 300px;
grid-template-rows:auto auto minmax(0,1fr);
grid-template-areas:
"hud hud"
"tabs queue"
"stage queue";
}
.hud{grid-area:hud}
.tabs{grid-area:tabs}
/* 主内容区：左栏，独立滚动 */
.stage{
grid-area:stage;
overflow:auto;
padding:16px 20px 40px;
}
/* 右侧栏：立绘卡 + 生活卡 + 警情队列（纵向排布，独立滚动） */
.side{
grid-area:queue;
display:flex;
flex-direction:column;
gap:10px;
min-height:0;
overflow-y:auto;
padding:12px 12px 12px 2px;
border-left:1px solid var(--line);
background:rgba(243,238,226,.5);
}
/* 侧栏卡片仅在横屏侧栏显示 */
.side .pCard,.side .lifeCard{display:block}
/* 警情队列：侧栏内自然排布 */
.queue{
position:static;
width:auto;
right:auto;left:auto;bottom:auto;
padding:0;
}
/* 队列为空时的占位提示，避免右侧空白 */
.queue:empty::before{
content:"暂无待处理警情\A对讲机还安静着";
display:flex;
align-items:center;
justify-content:center;
min-height:120px;
font-family:var(--kai);
font-size:13px;
letter-spacing:2px;
color:var(--ink3);
border:1px dashed var(--line);
border-radius:2px;
text-align:center;
white-space:pre-line;
line-height:1.9;
}
/* 弹层在宽屏下适当加宽，正文仍居中 */
.modalBox{max-width:680px}
/* 场景图在横屏下略增高，保持画面感 */
.sceneBox{height:150px}
/* 长正文限宽，避免满行文字影响阅读 */
.docBody{max-width:48em}
/* 开局页：出身卡片由单列改为两列 */
.startWrap{max-width:960px}
.lineCards{grid-template-columns:1fr 1fr}
.lineCard:last-child{grid-column:1 / -1}
}
/* 窄横屏（横屏手机）微调：队列更窄、统计卡两列，避免挤压 */
@media (min-width: 640px) and (orientation: landscape) and (max-width: 900px) {
#screenGame{grid-template-columns:minmax(0,1fr) 260px}
.grid4{grid-template-columns:1fr 1fr}
.sceneBox{height:120px}
}
/* ============ 立绘：开局页出身卡 ============ */
.lineCard{display:grid;grid-template-columns:120px 1fr;gap:14px;align-items:start}
.lineArt{
width:120px;height:160px;border-radius:2px;
background-size:cover;background-position:center top;
background-color:var(--paper2);
border:1px solid var(--line);
box-shadow:inset 0 0 0 1px rgba(255,255,255,.4);
position:relative;overflow:hidden;
}
.lineArt::after{
content:"";position:absolute;inset:0;
background:linear-gradient(180deg,rgba(255,255,255,0) 60%,rgba(38,69,57,12) 100%);
}
.lineText{min-width:0}
@media (max-width:640px){
.lineCard{grid-template-columns:88px 1fr;gap:10px}
.lineArt{width:88px;height:118px}
}
/* ============ HUD 立绘 + 存款 ============ */
.hudPortrait{
width:40px;height:40px;border-radius:2px;object-fit:cover;
border:1px solid var(--line);flex:0 0 40px;background:var(--paper2);
box-shadow:0 1px 4px rgba(40,34,24,.10);
}
.hudMoney{
font-size:11.5px;color:var(--ochre);margin-top:2px;
font-family:var(--mono);letter-spacing:.5px;white-space:nowrap;
overflow:hidden;text-overflow:ellipsis;
}
/* ============ 晋升进度面板 ============ */
.promotePanel{margin-top:12px}
.promotePanel .docHead{display:flex;justify-content:space-between;align-items:baseline}
.promotePanel .docTitle{font-family:var(--kai);letter-spacing:2px;color:var(--police)}
.promotePanel .docNo{font-size:12px;color:var(--ochre);font-family:var(--mono)}
.prRows{margin-top:10px;display:grid;gap:6px}
.prRow{
display:grid;grid-template-columns:90px 1fr 140px;
gap:10px;align-items:center;font-size:12px;
padding:4px 0;border-bottom:1px dashed var(--line);
}
.prRow:last-child{border-bottom:none}
.prKey{color:var(--ink2)}
.prBar{
position:relative;height:6px;background:var(--paper2);
border:1px solid var(--line);border-radius:1px;overflow:hidden;
}
.prBar i{
position:absolute;left:0;top:0;bottom:0;background:var(--bamboo);
transition:width .25s;
}
.prRow.ok .prBar i{background:var(--police)}
.prNum{font-family:var(--mono);color:var(--ink3);text-align:right;font-size:11.5px}
.prRow.ok .prNum{color:var(--police)}
.prGate{
margin-top:8px;font-size:12px;color:var(--cinnabar);
padding:5px 10px;background:rgba(168,57,44,.06);
border-left:2px solid var(--cinnabar);
}
/* ============ 生活区 ============ */
.lifeBlock{margin-top:12px}
.lifeBlock .docTitle{font-family:var(--kai);letter-spacing:2px;color:var(--ochre)}
.lifeBlock .docNo{font-family:var(--mono);font-size:11.5px;color:var(--ink3)}
.act.life{border-left:3px solid var(--ochre)}
.act.life b{color:var(--ochre)}
.act.life:hover{border-color:var(--ochre)}
.act.life[disabled] b{color:var(--ink3)}
/* ============ 身份档案卡 / 开局年龄学历 ============ */
.idCard{margin-top:10px;border:1px solid rgba(38,69,111,.35);background:rgba(38,69,111,.05);border-radius:2px;padding:10px 12px}
.idCard .idHead{font-family:var(--kai);font-size:15px;letter-spacing:2px;color:var(--police);display:flex;justify-content:space-between;align-items:baseline;gap:8px}
.idCard .idHead span{font-size:11.5px;color:var(--ink3);letter-spacing:1px;font-family:var(--serif)}
.idCard .idFoot{font-size:12px;line-height:1.8;color:var(--ink2);margin-top:8px;border-top:1px dashed var(--line);padding-top:7px}
.eduHint{margin:10px 0 0;font-size:12px;color:var(--ink3);line-height:1.8;letter-spacing:.5px}
.startFoot select{font-family:var(--serif);font-size:14px;padding:5px 8px;border:1px solid var(--line);border-radius:2px;background:rgba(255,255,255,.65);color:var(--ink)}
.noteRow{display:flex;gap:6px;margin-top:8px}
.noteRow input{flex:1;font-family:var(--serif);font-size:13px;padding:7px 10px;border:1px solid var(--line);border-radius:2px;background:rgba(255,255,255,.75)}
.noteRow input:focus{border-color:var(--police)}
.noteLine{margin-top:8px;font-size:12px;line-height:1.8;color:var(--ink2);background:rgba(176,129,63,.08);border-left:2px solid var(--ochre);padding:6px 10px;border-radius:2px}
/* ============ 右侧栏卡片：立绘卡 / 生活卡（参考红棕描边文书风） ============ */
/* 默认（竖屏）隐藏侧栏卡，横屏 .side 内显示（body 前缀保证覆盖优先级） */
body .pCard,body .lifeCard{display:none}
.pCard,.lifeCard{
position:relative;flex:0 0 auto;
border:1.5px solid rgba(168,57,44,.55);border-radius:3px;
background:linear-gradient(180deg,#fffdf6,#f8f2e4);
box-shadow:var(--shadow);
padding:10px 12px 12px;
text-align:center;
}
.pCard::after,.lifeCard::after{content:"";position:absolute;inset:4px;border:1px solid rgba(168,57,44,.14);pointer-events:none;border-radius:2px}
.pSeal{
position:absolute;right:8px;top:8px;z-index:2;
width:22px;padding:4px 0;font-family:var(--kai);font-size:11.5px;line-height:1.15;letter-spacing:0;
color:rgba(168,57,44,.8);border:1.5px solid rgba(168,57,44,.5);border-radius:2px;
writing-mode:vertical-rl;background:rgba(168,57,44,.05);
}
.pImg{position:relative;z-index:1;width:100%;max-width:150px;margin:0 auto;aspect-ratio:3/4;border:1px solid var(--line);border-radius:2px;overflow:hidden;background:var(--paper2)}
.pImg img{width:100%;height:100%;object-fit:cover;object-position:center top;display:block}
.pName{font-family:var(--kai);font-size:20px;letter-spacing:4px;color:var(--cinnabar);margin:9px 0 2px}
.pDiv{height:1px;background:linear-gradient(90deg,transparent,rgba(168,57,44,.5),transparent);margin:6px 8px}
.pSub{font-size:12px;color:var(--ink);letter-spacing:1px}
.pSub2{font-size:11.5px;color:var(--ink3);margin-top:3px;letter-spacing:1px}
.lifeCard{text-align:left}
.lifeHead{display:flex;align-items:center;gap:6px;font-family:var(--kai);font-size:14px;letter-spacing:2px;color:var(--ink)}
.lifeDot{width:8px;height:8px;border-radius:50%;background:var(--cinnabar);flex:0 0 8px}
.lifeTag{margin-left:auto;font-size:11.5px;color:var(--cinnabar);border:1px solid rgba(168,57,44,.45);padding:1px 6px;border-radius:2px;letter-spacing:1px}
.lifeHome{height:64px;margin:8px 0 7px;border:1px solid var(--line);border-radius:2px;background:center/cover no-repeat;position:relative;overflow:hidden}
.lifeHome::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(243,238,226,.05),rgba(32,36,42,.28))}
.lifeHome.dorm{background-image:repeating-linear-gradient(90deg,rgba(38,69,111,.16) 0 14px,transparent 14px 26px),linear-gradient(180deg,#d8cdb4,#c4b894)}
.lifeHome.house{background-image:repeating-linear-gradient(0deg,rgba(95,127,107,.16) 0 12px,transparent 12px 24px),linear-gradient(180deg,#d3dcc8,#b9c9ac)}
.lifeStats{font-size:11.5px;color:var(--ink2);letter-spacing:.5px;line-height:1.7}
.lifeMoney{font-size:13px;color:var(--ochre);margin:7px 0 8px;letter-spacing:1px}
.lifeMoney b{font-family:var(--mono);font-size:14px}
.lifeBtns{display:flex;flex-wrap:wrap;gap:5px}
.lifeBtns .btn{padding:3px 8px;font-size:11.5px;letter-spacing:0}
/* ============ 家人 / 关系 ============ */
.relations{margin-top:12px;padding-top:10px;border-top:1px dashed var(--line)}
.relTitle{font-family:var(--kai);letter-spacing:2px;color:var(--police);font-size:13px;margin-bottom:6px}
.relBars{display:grid;gap:5px;margin-bottom:8px}
.relRow{
display:grid;grid-template-columns:60px 1fr 40px;
gap:10px;align-items:center;font-size:12px;color:var(--ink2)
}
.relRow .prBar{height:5px}
.relRow .prBar i{background:var(--ochre)}
.relRow .prNum{font-family:var(--mono);color:var(--ink3);text-align:right;font-size:11.5px}
.relRow.relSpouse .prBar i{background:var(--cinnabar)}
.relRow.relSpouse .relKey{color:var(--cinnabar);font-family:var(--kai);letter-spacing:1px}
.relKids{margin-top:4px;font-size:11.5px;color:var(--ink3);font-family:var(--kai);letter-spacing:1px}
/* =========================================================
主页面（开局）重做：全屏雨夜 · 仪式感
========================================================= */
.startScreen{
background:#1a1d23;
overflow:hidden;
}
.startScreen::before{
content:"";position:absolute;inset:0;
background:url(../assets/night.webp) center/cover no-repeat;
filter:saturate(.55) brightness(.55) contrast(1.05);
}
.startScreen::after{
content:"";position:absolute;inset:0;
background:
radial-gradient(120% 70% at 50% 110%,rgba(20,22,28,.88),rgba(20,22,28,.35) 55%,rgba(20,22,28,.55)),
linear-gradient(180deg,rgba(20,22,28,.55) 0%,rgba(20,22,28,.15) 30%,rgba(20,22,28,.75) 100%);
}
.bgRain{
position:absolute;inset:-50%;z-index:1;pointer-events:none;opacity:.18;
background-image:repeating-linear-gradient(115deg,
rgba(255,255,255,.5) 0 1px, transparent 1px 14px);
animation:rainMove 1.4s linear infinite;
}
@keyframes rainMove{
from{transform:translateY(-20%)}
to{transform:translateY(20%)}
}
.bgBeacon{
position:absolute;inset:0;z-index:1;pointer-events:none;mix-blend-mode:screen;
background:
radial-gradient(60% 40% at 12% 0%,rgba(38,69,111,.55),transparent 70%),
radial-gradient(60% 40% at 88% 0%,rgba(168,57,44,.45),transparent 70%);
animation:beacon 4.5s ease-in-out infinite alternate;
}
@keyframes beacon{
0%{opacity:.35}
50%{opacity:.85}
100%{opacity:.45}
}
.startScreen .startWrap{
position:relative;z-index:2;max-width:980px;
padding:34px 22px 46px;
color:#e8e2d2;
}
.startScreen .inkTitle{
display:flex;align-items:flex-end;gap:18px;margin-bottom:8px;
}
.startScreen .sealBig{
width:64px;height:64px;flex:0 0 64px;font-size:22px;
background:linear-gradient(160deg,#b84a3c,#8a2a1f);
box-shadow:0 8px 24px rgba(168,57,44,.45), inset 0 0 0 2px rgba(247,242,230,.25);
}
.startScreen .titleWrap{flex:1}
.startScreen .inkTitle h1{
font-size:56px;letter-spacing:14px;margin:0;
background:linear-gradient(180deg,#f6f1e2 30%,#b8b0a0);
-webkit-background-clip:text;background-clip:text;color:transparent;
text-shadow:0 4px 24px rgba(0,0,0,.5);
}
.startScreen .sub{
color:rgba(232,226,210,.55);letter-spacing:5px;font-size:12px;margin-top:4px;
}
.startScreen .titleRight{
text-align:right;display:flex;flex-direction:column;gap:4px;
padding-bottom:6px;
}
.startScreen .vText{
font-family:var(--kai);font-size:14px;letter-spacing:4px;color:rgba(232,226,210,.75);
}
.startScreen .dateText{
font-size:11.5px;color:rgba(232,226,210,.4);letter-spacing:2px;font-family:var(--mono);
}
.startScreen .heroArt{
position:relative;height:140px;border-radius:3px;overflow:hidden;
border:1px solid rgba(232,226,210,.18);
margin:18px 0 10px;
background:
linear-gradient(180deg,rgba(20,22,28,.2),rgba(20,22,28,.75)),
url(../assets/duty.webp) center/cover no-repeat;
filter:saturate(.7);
display:flex;align-items:center;
}
.startScreen .heroVerse{padding:0 24px}
.startScreen .heroVerse p{
margin:0;font-family:var(--kai);font-size:18px;letter-spacing:4px;
color:rgba(246,241,226,.92);line-height:1.9;
text-shadow:0 2px 8px rgba(0,0,0,.7);
}
.startScreen .heroCap{
position:absolute;right:14px;bottom:10px;
font-family:var(--kai);font-size:12px;letter-spacing:3px;
color:rgba(246,241,232,.55);
}
.startScreen .lineIntro{
color:rgba(232,226,210,.7);border-left-color:var(--cinnabar);
font-size:14px;
}
.startScreen .lineCards{
display:grid;grid-template-columns:repeat(3,1fr);gap:14px;margin-top:14px;
}
@media (max-width:860px){
}
.startScreen .lineCard{
background:linear-gradient(180deg,rgba(247,242,230,.96),rgba(236,228,210,.92));
border-color:rgba(232,226,210,.25);
grid-template-columns:90px 1fr;
padding:14px;
}
.startScreen .lineArt{width:90px;height:130px}
@media (max-width:640px){
.startScreen .lineCard{grid-template-columns:78px 1fr;gap:10px}
.startScreen .lineArt{width:78px;height:110px}
}
.startScreen .lineCard h3{font-size:20px}
.startScreen .lineCard .tag{color:var(--police);border-color:rgba(38,69,111,.4)}
.startScreen .lineCard.on{
border-color:#d4584a;
box-shadow:0 0 0 2px rgba(168,57,44,.5), 0 10px 30px rgba(0,0,0,.4);
}
.startScreen .lineCard:hover{transform:translateY(-3px)}
.startScreen .startFoot{
margin-top:26px;padding:18px 20px;
background:linear-gradient(180deg,rgba(247,242,230,.10),rgba(247,242,230,.04));
border:1px solid rgba(232,226,210,.18);border-radius:3px;
backdrop-filter:blur(4px);
}
.startScreen .nameBox{color:rgba(232,226,210,.85)}
.startScreen .nameBox input,
.startScreen .startFoot select{
background:rgba(247,242,230,.9);border-color:rgba(232,226,210,.3);color:var(--ink);
}
.startScreen .btnEnlist{
margin-left:auto;
padding:11px 36px;font-size:17px;letter-spacing:6px;
background:linear-gradient(180deg,#b84a3c,#8a2a1f);
border-color:transparent;
box-shadow:0 6px 20px rgba(168,57,44,.45);
}
.startScreen .btnEnlist:hover{
background:linear-gradient(180deg,#c95546,#9a3225);
transform:translateY(-1px);
}
.startScreen .btn-ghost{color:rgba(232,226,210,.7);border-color:rgba(232,226,210,.25)}
.startScreen .eduHint{color:rgba(232,226,210,.45);margin-top:12px}
@media (max-width:640px){
.startScreen .inkTitle h1{font-size:38px;letter-spacing:8px}
.startScreen .sealBig{width:52px;height:52px;flex-basis:52px;font-size:18px}
.startScreen .titleRight{display:none}
.startScreen .heroArt{height:110px}
.startScreen .heroVerse p{font-size:15px}
.startScreen .startFoot{flex-direction:column;align-items:stretch}
.startScreen .btnEnlist{margin-left:0;width:100%}
}
/* =========================================================
HUD 加宽 + 明显暂停/播放按钮
========================================================= */
@media (min-width: 640px) and (orientation: landscape){
#screenGame{max-width:100% !important}
.stage{padding:16px 28px 40px}
.queue{padding:12px 20px 12px 12px}
}
.hud{
padding:10px 22px;
gap:14px;
background:linear-gradient(180deg,rgba(255,255,255,.92),rgba(243,238,226,.7));
border-bottom:2px solid rgba(38,69,111,.25);
}
/* 主暂停/播放大按钮 */
.speed{
display:flex;align-items:center;gap:10px;
margin-top:6px;
}
.spMain{
width:44px !important;height:44px !important;
font-size:0 !important;
border-radius:50% !important;
background:linear-gradient(180deg,#3a6ea8,#26456f) !important;
color:#f2f6fb !important;
border:2px solid rgba(242,246,251,.4) !important;
box-shadow:0 4px 14px rgba(38,69,111,.45), inset 0 1px 0 rgba(255,255,255,.3);
cursor:pointer;
transition:.18s;
position:relative;
}
.spMain::before{
content:"‖";
position:absolute;inset:0;
display:flex;align-items:center;justify-content:center;
font-size:18px;font-family:var(--serif);
letter-spacing:-2px;
}
.spMain:hover{transform:scale(1.06)}
.spMain:active{transform:scale(.96)}
/* 暂停状态（speed=0 被选中）：变红，显示播放三角 */
.spMain.on{
background:linear-gradient(180deg,#c95546,#8a2a1f) !important;
box-shadow:0 4px 14px rgba(168,57,44,.5);
}
.spMain.on::before{
content:"▶";
font-size:14px;
padding-left:3px;
letter-spacing:0;
}
/* 速度档按钮组 */
.spGroup{
display:flex;gap:5px;
background:rgba(255,255,255,.55);
border:1px solid var(--line);
border-radius:20px;
padding:3px;
}
.spGroup .spBtn{
width:38px !important;height:28px !important;
font-size:12px !important;
border-radius:14px !important;
border:0 !important;
background:transparent !important;
color:var(--ink2) !important;
}
.spGroup .spBtn.on{
background:var(--ink) !important;
color:#f2ecdd !important;
}
.spGroup .spBtn:hover{background:rgba(38,69,111,.12) !important;color:var(--police) !important}
.spGroup .spBtn.on:hover{background:var(--ink) !important;color:#f2ecdd !important}
/* 时钟字稍大 */
.hudC .clock{font-size:18px}
/* =========================================================
修正：HUD 竖向加高（不是横向撑满）
========================================================= */
@media (min-width: 640px) and (orientation: landscape){
#screenGame{max-width:1280px !important}
}
.hud{
padding:16px 24px !important;
gap:20px !important;
align-items:center;
}
.hudL{gap:14px !important}
.seal{
width:44px !important;height:44px !important;flex-basis:44px !important;
font-size:20px !important;
}
.hudPortrait{
width:56px !important;height:56px !important;flex-basis:56px !important;
}
.hudName{font-size:18px !important;gap:8px !important}
.hudName b{font-size:18px !important}
.hudRank{font-size:13px !important;margin-top:3px}
.hudMoney{font-size:13px !important;margin-top:3px}
.chip{font-size:11.5px !important;padding:2px 8px !important}
.hudC .clock{font-size:22px !important;letter-spacing:3px !important}
.speed{margin-top:8px !important;gap:12px !important}
.spMain{
width:56px !important;height:56px !important;
}
.spMain::before{font-size:22px !important}
.spMain.on::before{font-size:17px !important;padding-left:4px !important}
.spGroup{padding:4px !important;gap:6px !important}
.spGroup .spBtn{
width:46px !important;height:34px !important;
font-size:13px !important;border-radius:17px !important;
}
.hudR{gap:6px !important;flex-direction:column !important;align-items:flex-end}
.meter{font-size:12px !important;gap:5px !important}
.meter i{width:44px !important;height:6px !important}
/* 出身卡：三卡并排，网格员不再跨整行 */
.startScreen .lineCards{grid-template-columns:repeat(3,1fr) !important}
@media (max-width:860px){
.startScreen .lineCard:last-child{grid-column:auto !important}
}
/* 时钟：上班 / 下班状态 */
.clock{transition:color .3s}
.clock-work{color:var(--police)}
.clock-off{color:var(--ink3);font-style:italic}
/* =========================================================
v47 · HUD 双行 meter + 勤务徽章 + 统一进度条 + 卡片精修
========================================================= */
.clockRow{display:flex;align-items:center;justify-content:center;gap:8px}
.dutyChip{
display:inline-block;padding:2px 8px;border-radius:2px;font-family:var(--kai);
font-size:11.5px;letter-spacing:2px;color:#fff9ee;background:var(--ochre);
box-shadow:0 1px 4px rgba(176,129,63,.4)
}
.dutyChip.lv3{background:var(--cinnabar);box-shadow:0 1px 4px rgba(168,57,44,.45);animation:dutyBlink 2.4s ease-in-out infinite}
@keyframes dutyBlink{0%,100%{filter:brightness(1)}50%{filter:brightness(1.2)}}
.hudR{flex-direction:column;gap:5px;align-items:flex-end}
.meter.dd i b{background:var(--bamboo)}
.meter.xr i b{background:linear-gradient(90deg,var(--bamboo),var(--police))}
.meter.ld i b{background:var(--police)}
/* 统一进度条 */
.meter i,.abRow .bar,.prBar{
position:relative;height:8px;background:rgba(220,210,190,.55);border-radius:5px;
overflow:hidden;box-shadow:inset 0 1px 2px rgba(40,34,24,.12);
}
.meter i{width:52px;height:6px}
.meter i b,.abRow .bar b,.prBar i{
display:block;height:100%;width:50%;transition:width .4s ease;
background-image:linear-gradient(180deg,rgba(255,255,255,.28),rgba(0,0,0,.06));
background-blend-mode:overlay;
}
.abRow .bar{flex:1;height:8px}
.prBar{flex:1;height:8px}
/* doc 卡片左色带：三段圆头 */
.doc::before{border-radius:2px 0 0 2px;background:var(--police);opacity:.85;width:4px}
.doc.red::before{background:var(--cinnabar)}
.doc.gold::before{background:var(--ochre)}
.doc.green::before{background:var(--bamboo)}
/* catBtn 抽屉标签：hover 抬起 + 内阴影 */
.catBtn{box-shadow:0 2px 8px rgba(40,34,24,.08), inset 0 1px 0 rgba(255,255,255,.7)}
.catBtn::after{
content:"";position:absolute;right:6px;top:6px;width:14px;height:14px;
border-top:1.5px solid rgba(168,57,44,.28);border-right:1.5px solid rgba(168,57,44,.28);
opacity:.35;pointer-events:none;
}
.catBtn:hover{box-shadow:0 6px 18px rgba(40,34,24,.18), inset 0 1px 0 rgba(255,255,255,.9)}
.catBtn.on::after{opacity:.85;border-color:var(--cinnabar)}
/* qCard 铃响脉冲：加 scale */
@keyframes ringPulse{
0%,100%{box-shadow:0 6px 18px rgba(30,26,18,.22);transform:scale(1)}
50%{box-shadow:0 6px 24px rgba(168,57,44,.55);border-left-width:6px;transform:scale(1.012)}
}
/* modalBox：卷轴展开感 */
@keyframes pop{
from{transform:translateY(10px) scale(.98);opacity:.4;max-height:60%}
to{transform:none;opacity:1;max-height:100%}
}
.modalBox{animation:pop .22s cubic-bezier(.2,.7,.2,1)}
/* 师徒 hero 卡 */
.relHero{display:flex;align-items:center;gap:12px;padding:4px 0}
.relHeroTag{
width:38px;height:38px;border-radius:50%;background:radial-gradient(circle at 30% 28%,rgba(255,255,255,.7),rgba(38,69,111,.35));
border:1.5px solid rgba(38,69,111,.5);color:var(--police);font-family:var(--kai);font-size:16px;
display:flex;align-items:center;justify-content:center;flex:0 0 38px
}
.relHeroBody{flex:1;display:flex;flex-direction:column;gap:2px}
.relHeroBody b{font-family:var(--kai);letter-spacing:2px;font-size:16px}
/* 人脉行 */
.relRow{display:flex;align-items:center;gap:8px;margin-bottom:6px;font-size:13px}
.relKey{width:78px;color:var(--ink2);letter-spacing:1px}
.relRow .prBar{flex:1}
/* 36px 是给人脉那几根小条的数字留的；晋升条件表的 .prNum 要占满 110px 的第三列，
被这条一起压成 36px 就会五个字一列地竖着排。 */
.relRow .prNum{width:36px;text-align:right;font-family:var(--mono);font-size:12px;color:var(--ink2)}
.relSpouse .relKey{color:var(--cinnabar)}
.relKids{margin-top:6px;font-size:12px;color:var(--ink3)}
.relTitle{font-family:var(--kai);letter-spacing:2px;font-size:14px;color:var(--ink);margin:6px 0 6px}
.relations{margin-top:8px}
/* =========================================================
v48 · 字体清晰度补丁
1) 10/11px 全部抬到 12/13px；小标签改用无衬线 --ui
2) 中文宋体在小字号下笔画过细 → 关键 UI 用 PingFang/雅黑
3) 收紧 letter-spacing，避免宋体笔画被拉开
========================================================= */
.chip,.catSub,.docNo,.docMeta,.act .need,.mods,.qStage,.qScene,.qFrom,.qTimer,
.stat .k,.caseSteps,.logLine .d,.finePrint,.prNum,.idCard .idHead span,
.pSub2,.lifeTag,.lifeStats,.relRow .prNum,.relKids,.hudRank,.lineCard .tag,
.lineCard .kv span,.badge,.catBadge i,.sub,.hintInk,.lawBox b,.tierLine{
font-family:var(--ui);
}
.catSub{font-size:12px !important;letter-spacing:.2px}
.docNo{font-size:12px !important;font-family:var(--mono)}
.docMeta{font-size:12px !important;letter-spacing:.3px}
.act .need{font-size:12px !important;letter-spacing:.2px}
.mods{font-size:12px !important}
.qStage,.qScene{font-size:11.5px !important;letter-spacing:.3px}
.qFrom{font-size:12px !important;letter-spacing:.5px}
.qTimer{font-size:12px !important}
.stat .k{font-size:12px !important;letter-spacing:.2px}
.caseSteps{font-size:12px !important}
.finePrint{font-size:12px !important}
.prNum,.relRow .prNum{font-size:12px !important}
.hudRank{font-size:12px !important;letter-spacing:.2px}
.badge{font-size:12px !important}
.catBadge{font-size:12px !important}
.catBadge i{font-size:11.5px !important}
.sub{font-size:13px !important;letter-spacing:1px}
.hintInk{font-size:14px !important}
.meter{font-size:12px !important}
.meter span{font-family:var(--ui);font-weight:500}
.spBtn{font-size:12px !important}
/* 正文段落：宋体保留，但字号抬到 14/15，行高 1.9，笔画更实 */
.docBody{font-size:15px !important;line-height:1.95}
.lineIntro,.docBody p{font-size:14px !important}
.act,.talkLog,.logLine,.lineCard p,.lawBox{font-size:14px !important}
.tierLine{font-size:14px !important}
/* 标题类：楷体保留，但去掉过宽的字距 */
.docTitle{letter-spacing:1px}
.mTitle{letter-spacing:2px}
.sectTitle{letter-spacing:2px}
.catName{letter-spacing:2px}
.sceneCap{letter-spacing:2px}
.qTitle{letter-spacing:.5px}
/* 数字/编号：等宽字体加粗一档，避免宋体数字发虚 */
.meter i b,.prBar i,.abRow .bar b{shape-rendering:crispEdges}
.prNum,.abRow .num,.qTimer,.docNo,.logLine .d{font-variant-numeric:tabular-nums}
/* 深色底上的字（toast、印章、警单 chip）：加轻微 text-shadow 提升对比 */
.stamp,.qStage.ring,.qStage.route,.qScene,.catBadge,.dutyChip,.seal,.sealBig{
text-shadow:0 1px 0 rgba(0,0,0,.12)
}
/* =========================================================
v49 · 左侧 dock（医院 / 银行 / 商城）+ 健康条
========================================================= */
.meter.jk i b{background:linear-gradient(90deg,#c94b3c,#e08a5a)}
.meter.jk span{color:var(--cinnabar)}
.leftDock{
position:fixed;left:calc(50% - 380px - 76px);top:120px;z-index:25;
display:flex;flex-direction:column;gap:10px;
}
@media (max-width:1000px){
.leftDock{left:8px;top:auto;bottom:120px;flex-direction:column}
}
.dockBtn{
width:60px;padding:8px 4px 6px;border-radius:6px;cursor:pointer;
background:linear-gradient(180deg,#fffdf6,#f4eee1);
border:1.5px solid rgba(32,36,42,.22);
box-shadow:0 3px 10px rgba(40,34,24,.14), inset 0 1px 0 rgba(255,255,255,.7);
display:flex;flex-direction:column;align-items:center;gap:2px;
font-family:var(--ui);transition:.15s;
}
.dockBtn:hover{transform:translateY(-2px);box-shadow:0 8px 18px rgba(40,34,24,.22)}
.dockBtn:active{transform:translateY(0)}
.dockIcon{
width:34px;height:34px;border-radius:50%;
display:flex;align-items:center;justify-content:center;
font-family:var(--kai);font-size:16px;color:#fff9ee;letter-spacing:0;
box-shadow:inset 0 -2px 4px rgba(0,0,0,.15);
}
.dockLbl{font-size:11.5px;letter-spacing:1px;color:var(--ink2)}
.dockBtn.hosp .dockIcon{background:linear-gradient(180deg,#c94b3c,#8b2f24)}
.dockBtn.bank .dockIcon{background:linear-gradient(180deg,#4d7bb2,#26456f)}
.dockBtn.shop .dockIcon{background:linear-gradient(180deg,#c9a05a,#8f6a30)}
.dockBtn.hosp{border-color:rgba(168,57,44,.4)}
.dockBtn.bank{border-color:rgba(38,69,111,.4)}
.dockBtn.shop{border-color:rgba(143,106,48,.4)}
/* 自动跳过开关 */
.spSkip{
width:36px;height:36px;border-radius:50%;
border:1px solid var(--line);
background:rgba(255,255,255,.55);
color:var(--ink3);
font-family:var(--kai);font-size:14px;letter-spacing:0;
cursor:pointer;transition:.15s;
}
.spSkip:hover{background:#fff;color:var(--ink)}
.spSkip.on{
background:linear-gradient(180deg,#5f7f6b,#3f5f4b);
color:#f0f5ee;border-color:transparent;
box-shadow:0 3px 10px rgba(95,127,107,.45);
}
/* 决策数值预览 */
.effRow{
display:flex;flex-wrap:wrap;gap:4px;align-items:center;
margin-top:6px;
}
.effTag{
font-size:11.5px;color:var(--ink3);
border:1px solid var(--line);border-radius:2px;
padding:0 5px;margin-right:2px;
}
.eff{
font-size:11.5px;font-family:var(--mono);
padding:1px 6px;border-radius:2px;
background:rgba(95,127,107,.12);color:var(--bamboo);
}
.eff.down{background:rgba(168,57,44,.12);color:var(--cinnabar)}
.eff.ab{background:rgba(38,69,111,.12);color:var(--police)}
.eff.flag{background:rgba(176,129,63,.15);color:var(--ochre)}
.effLose{opacity:.55}
.effLose:hover{opacity:.9}
/* =========================================================
左 dock 改造：作为整体框，停靠在内容区左外侧
========================================================= */
.leftDock{
position:fixed !important;
left:calc(50% - 640px - 92px) !important;
top:140px !important;
bottom:auto !important;
display:flex;flex-direction:column;gap:12px !important;
padding:12px 10px !important;
background:linear-gradient(180deg,rgba(255,253,246,.96),rgba(244,238,225,.96));
border:1px solid rgba(32,36,42,.22);
border-left:3px solid var(--police);
border-radius:10px;
box-shadow:0 8px 24px rgba(40,34,24,.22), inset 0 1px 0 rgba(255,255,255,.7);
z-index:25;
}
/* 容器宽度自适应时（窗口小于 1280 留白），dock 退到屏幕左缘 */
@media (max-width:1400px){
.leftDock{ left:12px !important; }
}
/* 窄屏：回到之前的底部停靠 */
@media (max-width:1000px){
.leftDock{
left:12px !important;top:auto !important;bottom:110px !important;
flex-direction:row !important;
padding:8px !important;
}
}
/* =========================================================
三层 UI 第一刀：duty 常驻桌面，其他 panel 底部抽屉
========================================================= */
/* cats 导航条：底部固定紧凑条 */
.cats{
position:fixed;left:0;right:0;bottom:0;z-index:40;
display:flex !important;flex-direction:row;
gap:6px;padding:8px 12px;
background:linear-gradient(180deg,rgba(247,242,230,.97),rgba(220,210,190,.97));
border-top:2px solid rgba(38,69,111,.35);
backdrop-filter:blur(8px);
max-width:none !important;
}
.cats .catBtn{
flex:1;min-height:0 !important;padding:6px 8px !important;
display:flex !important;flex-direction:row;align-items:center;gap:6px !important;
border-radius:6px !important;min-width:0;
}
.cats .catIcon{
width:28px !important;height:28px !important;flex:0 0 28px !important;
font-size:14px !important;
}
.cats .catText{gap:0 !important}
.cats .catName{font-size:13px !important;letter-spacing:2px !important}
.cats .catSub{display:none !important}
.cats .catBadge{min-width:20px !important;height:18px !important;font-size:11.5px !important;top:-4px !important;right:-4px !important}
.cats .catBtn::after{display:none !important}
/* stage 给底部条留位 */
#screenGame .stage{padding-bottom:86px !important}
/* panel 抽屉化：非 duty 默认收到底部 */
#tab-case, #tab-job, #tab-rel, #tab-grow, #tab-life, #tab-file, #tab-log{
position:fixed !important;left:0;right:0;bottom:0;
z-index:35;
height:62vh;
background:linear-gradient(180deg,#fffdf6,#f4eee1);
border-top:2px solid var(--cinnabar);
box-shadow:0 -10px 40px rgba(0,0,0,.3);
border-radius:12px 12px 0 0;
padding:14px 18px 90px;
overflow-y:auto;
transform:translateY(105%);
transition:transform .28s cubic-bezier(.2,.8,.2,1);
visibility:hidden;
}
#tab-case.open, #tab-job.open, #tab-rel.open, #tab-grow.open,
#tab-life.open, #tab-file.open, #tab-log.open{
transform:translateY(0);
visibility:visible;
}
/* duty 保持正常 */
#tab-duty{position:static !important}
/* 抽屉顶部加个抓手提示 */
#tab-case::before, #tab-job::before, #tab-rel::before,
#tab-grow::before, #tab-life::before, #tab-file::before, #tab-log::before{
content:"";display:block;width:40px;height:4px;border-radius:2px;
background:rgba(32,36,42,.2);margin:0 auto 12px;
}
/* 右侧日志常驻窄栏 */
.logStream{
flex:0 0 auto;
background:rgba(255,253,246,.88);
border:1px solid rgba(38,69,111,.35);
border-left:3px solid var(--police);
border-radius:3px;
padding:8px 10px;
font-size:11.5px;line-height:1.7;
max-height:180px;overflow:hidden;
cursor:pointer;
transition:.15s;
font-family:var(--serif);
}
.logStream:hover{background:#fff;box-shadow:0 4px 12px rgba(40,34,24,.12)}
.logStream .lsHead{
font-family:var(--kai);font-size:12px;letter-spacing:2px;
color:var(--police);margin-bottom:4px;
display:flex;justify-content:space-between;align-items:center;
}
.logStream .lsHead::after{content:"点开 ›";font-size:11.5px;color:var(--ink3);font-family:var(--serif)}
.logStream .lsItem{
color:var(--ink2);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;
padding:1px 0;
}
.logStream .lsItem.imp{color:var(--ink);font-weight:600}
.logStream .lsItem.bad{color:var(--cinnabar)}
.logStream .lsItem.good{color:var(--bamboo)}
.logStream .lsItem .d{color:var(--ink3);font-family:var(--mono);font-size:11.5px;margin-right:4px}
/* 时段状态横幅 */
.dutyBanner{
margin-bottom:10px;padding:9px 14px;border-radius:3px;
font-family:var(--kai);font-size:14px;letter-spacing:3px;
display:flex;align-items:center;gap:8px;
border:1px solid transparent;
}
.dutyBanner::before{
content:"";width:8px;height:8px;border-radius:50%;
background:currentColor;flex:0 0 8px;
}
.banner-work{
background:rgba(38,69,111,.10);color:var(--police);
border-color:rgba(38,69,111,.3);
}
.banner-off{
background:rgba(139,143,150,.10);color:var(--ink3);
border-color:rgba(139,143,150,.3);
}
.banner-weekend{
background:rgba(95,127,107,.12);color:var(--bamboo);
border-color:rgba(95,127,107,.4);
}
/* NPC 人物卡 */
.npcGrid{
display:grid;grid-template-columns:1fr 1fr;gap:10px;
}
@media (max-width:640px){ .npcGrid{grid-template-columns:1fr} }
.npcCard{
display:grid;grid-template-columns:44px 1fr;gap:10px;
padding:10px;border:1px solid var(--line);border-radius:4px;
background:rgba(255,255,255,.6);
transition:.15s;
}
.npcCard:hover{background:#fff;transform:translateY(-1px);box-shadow:0 4px 12px rgba(40,34,24,.12)}
.npcAvatar{
width:44px;height:44px;border-radius:50%;
color:#fff;font-family:var(--kai);font-size:20px;
display:flex;align-items:center;justify-content:center;
box-shadow:inset 0 -2px 4px rgba(0,0,0,.2);
}
.npcBody{min-width:0}
.npcBody b{font-family:var(--kai);font-size:15px;letter-spacing:2px}
.npcRole{display:block;font-size:11.5px;color:var(--ink3);margin:1px 0 5px;letter-spacing:1px}
.npcBar{
height:4px;background:var(--paper3);border-radius:2px;overflow:hidden;
margin-bottom:6px;
}
.npcBar i{display:block;height:100%}
.npc-hidden{opacity:.55}
.npc-hidden .npcAvatar{background:var(--paper3)!important;color:var(--ink3)}
/* NPC 人物卡 v2：完整人设 */
.npcGrid{grid-template-columns:1fr 1fr}
@media (max-width:700px){ .npcGrid{grid-template-columns:1fr} }
.npcCard{
grid-template-columns:48px 1fr;
padding:12px;
border-left:3px solid var(--line);
}
.npcCard:hover{border-left-color:var(--cinnabar)}
.npcAvatar{
width:48px;height:48px;font-size:22px;
position:relative;
}
.npcBody b{font-size:16px;letter-spacing:2px}
.npcHead{display:flex;align-items:baseline;gap:8px;flex-wrap:wrap}
.npcRole{font-size:11.5px;color:var(--police);letter-spacing:1px}
.npcTags{margin:4px 0 6px;display:flex;flex-wrap:wrap;gap:4px}
.npcTag{
font-size:11.5px;padding:1px 7px;border-radius:8px;
background:rgba(38,69,111,.08);color:var(--police);
letter-spacing:1px;
}
.npcLine{
font-size:12px;line-height:1.75;color:var(--ink2);
margin:0 0 8px;font-style:italic;
border-left:2px solid var(--line);padding-left:8px;
}
.npcBar{margin-bottom:6px}
.npcHook{
font-size:11.5px;color:var(--ochre);margin:0;
letter-spacing:.5px;
}
/* 左侧 dock 扩展：分隔线 + 7 个 tab 按钮 */
.dockBtn.tab .dockIcon{
background:linear-gradient(135deg,#5a7a9a,#3a5a7a);
box-shadow:0 2px 6px rgba(38,69,111,.25);
}
.dockBtn.tab:hover .dockIcon{
transform:translateY(-2px);
box-shadow:0 4px 10px rgba(38,69,111,.4);
}
/* 底部 cats 条已经没用了（所有入口都挪到左侧 dock），隐藏 */
.cats{ display:none !important; }
/* modal 浮层里的 doc/panel 内容适配 */
.modalBox .doc{
margin:0 0 12px;
}
.modalBox .sectTitle{
margin:14px 0 6px;
}
/* 修复 modal 关闭按钮被盖住 + 排版完善 */
.mClose{
z-index:10;
width:32px;height:32px;border-radius:50%;
background:rgba(255,255,255,.9);
border:1px solid var(--line);
display:flex;align-items:center;justify-content:center;
font-size:18px;color:var(--ink2);
transition:.15s;
}
.mClose:hover{
background:var(--cinnabar);color:#fff;border-color:var(--cinnabar);
transform:rotate(90deg);
}
.modalBox{
padding-top:44px !important; /* 给 mClose 留出空间 */
}
.modalBox .doc:first-child{
margin-top:0;
}
.modalBox .sectTitle:first-of-type{
margin-top:4px;
}
/* ============ v56 · AI 生成机制：场景色调 / 说明高亮 / 物证轨 ============ */
/* 规范 2：sceneInk 随审讯策略与场景切换色调 */
.sceneInk.tone-cold{background:
radial-gradient(130% 70% at 50% 120%,rgba(30,48,72,.66),rgba(18,26,40,.30) 62%,transparent 78%),
linear-gradient(180deg,rgba(40,66,102,.20),rgba(14,20,32,.42));}
.sceneInk.tone-warm{background:
radial-gradient(130% 70% at 50% 120%,rgba(96,60,26,.58),rgba(60,38,16,.26) 62%,transparent 78%),
linear-gradient(180deg,rgba(150,96,44,.20),rgba(40,26,14,.36));}
.sceneInk.tone-ink{background:
radial-gradient(120% 60% at 50% 120%,rgba(24,26,30,.66),transparent 72%),
linear-gradient(180deg,rgba(40,44,52,.14),rgba(18,20,24,.5));}
.sceneBox{transition:filter .5s ease}
.sceneBox:has(.sceneInk.tone-cold){filter:saturate(.62) contrast(1.06) hue-rotate(-8deg)}
.sceneBox:has(.sceneInk.tone-warm){filter:saturate(.86) contrast(1.02) hue-rotate(6deg)}
/* 规范 2：sceneCap 高亮线索与嫌疑人名 */
.sceneCap .cap-key{font-family:var(--ui);font-weight:700;color:#ffe9b8;letter-spacing:1px;
text-shadow:0 1px 3px rgba(0,0,0,.85);margin-right:6px;font-size:12px}
.sceneCap .capSep{color:rgba(246,242,232,.5);margin:0 2px}
/* 规范 2：侧栏物证轨 */
.evRail{position:relative;margin-top:10px;background:linear-gradient(180deg,#fffdf7,#f4eee1);
border:1px solid var(--line);border-radius:3px;padding:8px 10px 10px;box-shadow:var(--shadow)}
.evRail[hidden]{display:none}
.evRailHead{font-family:var(--kai);font-size:12px;letter-spacing:1px;color:var(--ink2);
display:flex;justify-content:space-between;align-items:center;margin-bottom:7px}
.evRailHead .evStage{font-family:var(--mono);font-size:11.5px;color:var(--police);
border:1px solid rgba(38,69,111,.3);border-radius:2px;padding:1px 5px}
.evRailBody{display:grid;grid-template-columns:repeat(2,1fr);gap:6px}
.evThumb{display:flex;align-items:center;gap:6px;padding:6px 7px;border:1px solid var(--line);
border-radius:2px;background:rgba(255,255,255,.7);font-size:11.5px;line-height:1.25;min-height:34px}
.evThumb .evMark{flex:none;width:16px;height:16px;border-radius:50%;display:flex;align-items:center;
justify-content:center;font-size:11.5px;font-family:var(--mono);color:#fff;background:var(--ink3)}
.evThumb .evName{color:var(--ink2);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.evThumb.strong{border-color:rgba(168,57,44,.4);background:rgba(168,57,44,.06)}
.evThumb.strong .evMark{background:var(--cinnabar)}
.evThumb.strong .evName{color:var(--ink);font-weight:600}
.evThumb:not(.strong):not(.blur):not(.dead) .evMark{background:var(--bamboo)}
/* 未取证：模糊待确认 */
.evThumb.blur{background:repeating-linear-gradient(45deg,#efe9db,#efe9db 6px,#e7e0cf 6px,#e7e0cf 12px)}
.evThumb.blur .evName{color:var(--ink3);filter:blur(1.4px);user-select:none}
.evThumb.blur .evMark{background:transparent;color:var(--ink3);border:1px dashed var(--ink3)}
.evThumb.dead{opacity:.62}
.evThumb.dead .evMark{background:var(--ink3)}
.evThumb.dead .evName{color:var(--ink3);text-decoration:line-through}
/* 规范 5：失败出口标签 */
.failTag{display:inline-block;font-family:var(--mono);font-size:11.5px;color:#fff;background:var(--cinnabar);
border-radius:2px;padding:1px 6px;letter-spacing:1px;margin-left:6px;vertical-align:middle}
.failTag.itr_illegal,.failTag.case_dead{background:#7a5230}
/* 插图：值班页背景 */
#tab-duty{
position:relative;
}
#tab-duty::before{
content:"";
position:fixed;inset:0;
background:url('../assets/duty.webp') center/cover no-repeat;
opacity:.12;
z-index:-1;
pointer-events:none;
}
/* NPC 头像：emoji 不用字体 */
.npcAvatar{
font-size:22px;
font-family:inherit;
box-shadow:inset 0 -2px 4px rgba(0,0,0,.15);
}
/* dock 按钮：emoji 不用汉字 */
.dockIcon{
font-family:inherit !important;
font-size:20px;
}
/* 事件等级图标（在 queue 里） */
/* 事件微彩水墨插图 */
.evInk{
width:100%;height:160px;
background-size:cover;background-position:center;
border-radius:3px;
margin:8px 0 10px;
box-shadow:0 4px 14px rgba(40,34,24,.18);
position:relative;
}
.evInk::after{
content:"";position:absolute;inset:0;
background:linear-gradient(180deg,transparent 60%,rgba(255,253,247,.35));
border-radius:3px;
}
.modalBox .evInk{ height:140px; }
/* 存档提示 */
#savedTip{
position:fixed;right:18px;bottom:18px;
background:rgba(38,69,111,.92);color:#fff;
padding:6px 14px;border-radius:14px;
font-size:12px;letter-spacing:2px;
opacity:0;transition:opacity .4s;
pointer-events:none;z-index:200;
box-shadow:0 4px 12px rgba(0,0,0,.2);
}
/* ============ v62 · 调解室「群众的桥头堡」 ============ */
.dockBtn.med .dockIcon{background:linear-gradient(180deg,#6a8f6f,#4d6b57)}
.dockBtn.med{border-color:rgba(77,107,87,.4)}
.medGrid{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin:10px 0}
.medParty{background:linear-gradient(180deg,#fffdf7,#f5efe2);border:1px solid var(--line);border-left:4px solid var(--bamboo);
border-radius:2px;padding:10px 12px;box-shadow:var(--shadow)}
.medParties .medParty{border-left-color:var(--ochre)}
.medParty .docTitle{font-size:16px}
.medTopics{display:flex;flex-direction:column;gap:6px;margin-top:8px}
.medTopic{font-size:13px}
.medStmt{font-size:12px;line-height:1.7;color:var(--ink2);margin-top:6px;background:rgba(77,107,87,.08);
border:1px dashed rgba(77,107,87,.4);border-radius:2px;padding:6px 8px}
.medStmt.got{border-style:solid;border-left:3px solid var(--bamboo);background:rgba(255,255,255,.7)}
.medStmt .t{font-family:var(--mono);font-size:11.5px;color:var(--bamboo);margin-right:5px;letter-spacing:1px}
.medMeters{display:flex;flex-wrap:wrap;gap:8px 16px;margin:8px 0}
.medMeters .abRow{flex:1 1 40%;min-width:150px;margin:0}
.medMeter .bar b{background:linear-gradient(90deg,var(--bamboo),#7ba084)}
.medMeters .abRow:nth-child(2) .bar b,.medMeters .abRow:nth-child(3) .bar b{background:linear-gradient(90deg,var(--ochre),#c2924a)}
.medCard{cursor:pointer}
.medCard:hover{border-color:var(--bamboo)}
.medPend{display:flex;align-items:center;gap:8px;cursor:default}
.medPend .btn{margin-left:auto}
.logLine .btn-sm{font-size:11.5px;padding:1px 7px;min-height:26px}
@media (max-width:520px){.medGrid{grid-template-columns:1fr}}
/* ============ v63 · 执法权限 + 出警搭档 ============ */
.permPanel,.ptPanel{margin-top:4px}
.pmList,.ptList{display:flex;flex-direction:column;gap:7px;margin-top:8px}
.pmRow{background:rgba(255,255,255,.66);border:1px solid var(--line);border-left:3px solid var(--police);
border-radius:2px;padding:8px 10px}
.pmTop{display:flex;justify-content:space-between;align-items:center;font-size:14px;font-family:var(--serif)}
.pmTop b{letter-spacing:.5px}
.pmOn{color:var(--bamboo);font-size:11.5px;font-weight:600}
.pmTemp{color:var(--ochre);font-size:11.5px;font-weight:600}
.pmOff{color:var(--ink3);font-size:11.5px}
.pmLine{font-size:12px;color:var(--ink2);margin-top:3px;line-height:1.6}
.pmLine .k{display:inline-block;min-width:52px;color:var(--ink3);font-family:var(--ui)}
.pmLine .warn{color:var(--cinnabar)}
.act.dis{opacity:.55;cursor:not-allowed}
.ptRow{background:linear-gradient(180deg,#fffdf7,#f5efe2);border:1px solid var(--line);border-radius:2px;padding:8px 11px}
.ptRow.cop{border-left:4px solid var(--police)} .ptRow.aux{border-left:4px solid var(--bamboo)}
.ptHead{display:flex;align-items:center;gap:8px}
.ptHead b{font-family:var(--serif);font-size:15px}
.ptRole{font-size:11.5px;color:var(--police)} .ptRow.aux .ptRole{color:var(--ink3)}
.ptAvail{margin-left:auto;font-size:11.5px;padding:1px 7px;border-radius:9px;background:var(--bamboo);color:#fff}
.ptAvail.busy{background:var(--ink3)}
.ptQi{display:inline-flex;align-items:center;gap:6px;font-family:var(--mono);font-size:11.5px}
.ptQi i{display:inline-block;height:6px;width:60px;background:#e4dcc9;border-radius:3px;position:relative;overflow:hidden}
.ptQi i::after{content:"";position:absolute;left:0;top:0;bottom:0;width:100%;transform:scaleX(var(--q,0));transform-origin:left;background:linear-gradient(90deg,var(--ochre),var(--cinnabar))}
.ptCard .need{line-height:1.5}
.qCard .qScene{font-size:11.5px}
/* ============ v64 · 反诈预警劝阻 96110 ============ */
.dockBtn.fraud .dockIcon{background:linear-gradient(180deg,#b5542f,#8b3b1f)}
.dockBtn.fraud{border-color:rgba(168,57,44,.35)}
.dockBtn{position:relative}
.dockBadge{position:absolute;top:-4px;right:-4px;min-width:16px;height:16px;padding:0 4px;line-height:16px;
border-radius:8px;background:var(--police);color:#fff;font-family:var(--mono);font-size:11.5px;text-align:center;
box-shadow:0 1px 3px rgba(0,0,0,.3);z-index:2}
.dockBadge[hidden]{display:none}
.dockBadge.hot{background:var(--cinnabar);animation:ringPulse 1.4s ease-in-out infinite}
.warnCard{cursor:pointer;border-left:4px solid var(--ochre)}
.warnCard.lvl-high,.warnCard.lvl-urgent{border-left-color:var(--cinnabar)}
.warnCard.lvl-low{border-left-color:var(--bamboo)}
.warnCard:hover{filter:brightness(1.02);transform:translateY(-1px)}
.warnCard .docNo{color:var(--cinnabar);font-weight:600}
.warnType{font-size:12px;color:var(--ink3);margin-top:6px;line-height:1.6}
.warnMeter{display:flex;align-items:center;gap:6px;font-size:11.5px;color:var(--ink3);margin-top:7px;flex-wrap:wrap}
.warnMeter .bar{display:inline-block;width:64px;height:7px;background:#e4dcc9;border-radius:4px;overflow:hidden}
.warnMeter .bar b{display:block;height:100%;background:linear-gradient(90deg,var(--police),#4d7bb2);transition:.3s}
.warnMeter .bar.hard b{background:linear-gradient(90deg,var(--ochre),var(--cinnabar))}
.warnMeter.big .bar{width:120px;height:9px}
.warnMeter .amt{margin-left:auto;font-family:var(--mono);color:var(--cinnabar)}
.logLine .d.ok{color:var(--bamboo)} .logLine .d.bad{color:var(--cinnabar)}
/* ============ v65 · 执法权益 · 三个规定 / 维权 ============ */
.rightsPanel{border-left:4px solid var(--ochre)}
.rgList{display:flex;flex-direction:column;gap:7px}
.rgRow{display:flex;align-items:flex-start;gap:9px;background:rgba(255,255,255,.66);border:1px solid var(--line);
border-radius:2px;padding:8px 10px}
.rgRow .d{flex:none;width:64px;font-family:var(--ui);font-size:11.5px;padding-top:2px}
.rgRow .d.ok{color:var(--bamboo)} .rgRow .d.bad{color:var(--cinnabar)} .rgRow .d.warn{color:var(--ochre)}
.rgBody{flex:1;font-size:13px;color:var(--ink2);line-height:1.5}
.rgBody .ask{font-size:11.5px;color:var(--ink3)}
.rgBtns{display:flex;flex-direction:column;gap:5px;flex:none}
.rgBtns .btn{white-space:nowrap;font-size:11.5px;padding:2px 8px}
.logLine .d.warn{color:var(--ochre)}
/* ============ v66 · 氛围层：天气角标 / 氛围线 / 街坊传闻 ============ */
.wxChip{display:inline-block;margin-left:8px;font-family:var(--ui);font-size:11.5px;letter-spacing:.5px;
color:var(--ink2);background:rgba(38,69,111,.08);border:1px solid var(--line);border-radius:9px;padding:1px 8px;vertical-align:middle}
.wxChip.clear{color:var(--bamboo);background:rgba(77,107,87,.1);border-color:rgba(77,107,87,.3)}
.wxChip.bad{color:#3a5a7a;background:rgba(58,90,122,.12);border-color:rgba(58,90,122,.4)}
.wxChip.warn{color:var(--ochre);background:rgba(143,106,48,.12);border-color:rgba(143,106,48,.4)}
.atmosBar{display:flex;justify-content:space-between;align-items:baseline;gap:12px;flex-wrap:wrap;
margin:-4px 0 12px;padding:7px 11px;border-radius:2px;background:linear-gradient(180deg,#fbf7ec,#f3ecdd);
border:1px solid var(--line);border-left:3px solid var(--ink3)}
.atmosLine{font-family:var(--serif);font-size:13px;color:var(--ink2);letter-spacing:.3px}
.rumorLine{font-family:var(--kai);font-size:12px;color:var(--ink3);font-style:normal;opacity:.92;text-align:right}
@media (max-width:640px){.atmosBar{flex-direction:column;align-items:flex-start;gap:4px}.rumorLine{text-align:left}}
/* ============ v67 · 所长指挥台 / 队伍 / 辖区指标 ============ */
.dockBtn.mgr .dockIcon{background:linear-gradient(180deg,#3f5c86,#26456f)}
.dockBtn.mgr{border-color:rgba(38,69,111,.4)}
.dockBtn.mgr[hidden]{display:none}
.mgKpi{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;margin-bottom:6px}
.mgKpi .kpi{background:rgba(255,255,255,.66);border:1px solid var(--line);border-radius:2px;padding:8px 6px;text-align:center}
.mgKpi .kpi .k{font-family:var(--ui);font-size:11.5px;color:var(--ink3)}
.mgKpi .kpi .v{font-family:var(--serif);font-size:20px;color:var(--ink);margin-top:2px}
.mgRow{display:flex;align-items:center}
.mgOff{background:linear-gradient(180deg,#fffdf7,#f5efe2);border:1px solid var(--line);border-left:4px solid var(--police);
border-radius:2px;padding:9px 11px;margin-top:8px}
.mgOff.busy{opacity:.6;border-left-color:var(--ink3)}
.mgOffHead{display:flex;align-items:center;gap:8px}
.mgOffHead b{font-family:var(--serif);font-size:15px}
.mgRole{font-size:11.5px;color:var(--ink3)}
.mgAvail{margin-left:auto;font-size:11.5px;padding:1px 7px;border-radius:9px;background:var(--bamboo);color:#fff}
.mgOff.busy .mgAvail{background:var(--ink3)}
.mgMeter{display:flex;align-items:center;gap:6px;font-family:var(--ui);font-size:11.5px;color:var(--ink3);margin-top:6px}
.mgMeter i{display:inline-block;width:52px;height:6px;background:#e4dcc9;border-radius:3px;overflow:hidden}
.mgMeter i b{display:block;height:100%;background:linear-gradient(90deg,var(--ochre),#c2924a)}
.mgMeter i.loy b{background:linear-gradient(90deg,var(--police),#4d7bb2)}
.mgMeter .n{min-width:20px;text-align:right;font-family:var(--mono);color:var(--ink2)}
.mgActs{display:flex;gap:6px;flex-wrap:wrap;margin-top:7px}
.mgActs .btn{font-size:11.5px;padding:2px 8px}
.mgDispatch .need{line-height:1.5}
.mgDispatch:hover{border-color:var(--police)}
/* ============ v69 · 所长玩法扩展：勤务岗 / 专项行动 / 装备建设 / 考评进退 / 招录 ============ */
.mgOffHead .mgRole{margin-left:2px}
.act.on{border-color:var(--police);box-shadow:inset 0 0 0 1px rgba(38,69,111,.28);background:linear-gradient(180deg,#f3f7fc,#e6eef8)}
.mgCamp{display:flex;align-items:center;gap:8px;font-family:var(--ui);font-size:12px;color:var(--ink2);padding:5px 0;border-bottom:1px dashed var(--line)}
.mgCamp:last-child{border-bottom:0}
.mgCamp b{font-family:var(--serif);font-size:14px;color:var(--ink);min-width:96px}
.mgCampWho{color:var(--ink3);font-size:11.5px;min-width:120px}
.mgCamp .bar.camp{flex:1;height:8px;background:#e4dcc9;border-radius:4px;overflow:hidden;min-width:60px}
.mgCamp .bar.camp b{display:block;height:100%;background:linear-gradient(90deg,var(--police),#4d7bb2)}
.mgCamp .n{font-family:var(--mono);font-size:11.5px;color:var(--ink3);min-width:66px;text-align:right}
.mgCampCard{opacity:1}
.mgCampCard[disabled]{opacity:.45;pointer-events:none}
.mgCampCard.on{border-color:var(--bamboo);background:linear-gradient(180deg,#f2f7f0,#e7efe3)}
.mgGearGrid{display:grid;grid-template-columns:repeat(2,1fr);gap:8px}
.mgGear{background:linear-gradient(180deg,#fffdf7,#f4eee1);border:1px solid var(--line);border-left:4px solid var(--ochre);border-radius:2px;padding:9px 11px}
.mgGear.owned{border-left-color:var(--bamboo);opacity:.9}
.mgGearHead{display:flex;align-items:baseline;gap:8px}
.mgGearHead b{font-family:var(--serif);font-size:14px;color:var(--ink)}
.mgGearCost{margin-left:auto;font-family:var(--mono);font-size:11.5px;color:var(--ochre)}
.mgGear.owned .mgGearCost{color:var(--bamboo)}
.mgGearDesc{font-family:var(--ui);font-size:11.5px;color:var(--ink3);line-height:1.55;margin:5px 0 7px}
.mgCand{display:block}
.mgCand .need{line-height:1.6;font-size:11.5px}
@media (max-width:520px){.mgGearGrid{grid-template-columns:1fr}.mgCampWho{display:none}}
/* ============ v70 · 功能专属插图（现代微彩水墨） ============ */
/* v242 · art_cmd 换图：原来是 1280×732 的暗调位图，现在走 dev/imggen.mjs（商汤）出 1536×1024
再 cover 成 1200×360 横带，与这一轮其余几张同一副画风。这一张被十扇门共用，
`.art` 的 106px 配 10:3 源图，566 宽时露出源 y 68–292，所以出图时就把大屏与两个背影摆在那一条里。 */
.art.cmd{background-image:url(../assets/art_cmd.webp)}
.art.campaign{background-image:url(../assets/art_campaign.webp)}
.art.gear{background-image:url(../assets/art_gear.webp)}
.art.review{background-image:url(../assets/art_review.webp)}
.art.recruit{background-image:url(../assets/art_recruit.webp)}
.art.roster{background-image:url(../assets/art_roster.webp)}
.art.mediation{background-image:url(../assets/art_mediation.webp)}
/* v242 · art_interrogation 换图：原来是 1280×732 的一张夜景（整张均值 65，在这排米白面板里就是一块黑板，
而且 `.art::after` 还要再压暗下半条）。现在走 dev/imggen.mjs（商汤）出 1536×1024 → cover 1200×360，
均值 170，与 art_call / art_cmd 同一副画风。这一格只有讯问面板一处用，读屏标签就写在那一处的 div 上。 */
.art.interrogation{background-image:url(../assets/art_interrogation.webp)}
.art.tall{height:120px}
/* ============ v72 · 职业保障 dock + 面板 ============ */
.dockBtn.risk .dockIcon{background:linear-gradient(180deg,#8a4a4a,#5f2f2f)}
.dockBtn.risk{border-color:rgba(95,47,47,.4)}
.dockBtn.anly .dockIcon{background:linear-gradient(180deg,#3f6b57,#274a3a)}
.dockBtn.anly{border-color:rgba(39,74,58,.4)}
.dockBtn.rep .dockIcon{background:linear-gradient(180deg,#6b4a7a,#432e52)}
.dockBtn.rep{border-color:rgba(67,46,82,.4)}
.dockBtn.plan .dockIcon{background:linear-gradient(180deg,#4a6b7a,#2e4a52)}
.dockBtn.plan{border-color:rgba(46,74,82,.4)}
.dockBtn.quest .dockIcon{background:linear-gradient(180deg,#7a6a3a,#52462a)}
.dockBtn.quest{border-color:rgba(82,70,42,.4)}
.qRow{padding:7px 0;border-bottom:1px dashed var(--line)}
.qRow:last-child{border-bottom:0}
.qRow.done{opacity:.62}
.qTop{display:flex;align-items:center;gap:8px}
.qTop b{font-family:var(--serif);font-size:13px;color:var(--ink)}
.qNum{margin-left:auto;font-family:var(--mono);font-size:11.5px;color:var(--ink3)}
.bar.qbar{display:block;height:7px;background:#e4dcc9;border-radius:4px;overflow:hidden;margin:5px 0 3px}
.bar.qbar b{display:block;height:100%;background:linear-gradient(90deg,var(--bamboo),#5f7f6b)}
.bar.qbar.career b{background:linear-gradient(90deg,var(--ochre),#c2924a)}
.qReward{font-family:var(--ui);font-size:11.5px;color:var(--ink3)}
.planRow{display:flex;align-items:center;gap:8px;padding:4px 0;border-bottom:1px dashed var(--line)}
.planRow:last-child{border-bottom:0}
.planSlot{font-family:var(--ui);font-size:12px;color:var(--ink2);min-width:56px}
.planSel{flex:1;font-family:var(--ui);font-size:12px;padding:3px 6px;border:1px solid var(--line);border-radius:2px;background:#fffdf7;color:var(--ink)}
.planTone{font-size:11.5px;color:var(--ink3);min-width:52px;text-align:right}
.repNet{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-top:4px}
.repNpc{background:linear-gradient(180deg,#fffdf7,#f4eee1);border:1px solid var(--line);border-left:4px solid #6b4a7a;border-radius:2px;padding:8px 10px}
.repNpcHead{display:flex;align-items:center;gap:6px;flex-wrap:wrap}
.repNpcHead b{font-family:var(--serif);font-size:14px;color:var(--ink)}
.repFac{font-family:var(--mono);font-size:11.5px;color:#fff;background:#6b4a7a;border-radius:8px;padding:1px 6px}
.repRole{font-size:11.5px;color:var(--ink3);margin-left:auto}
.repPerk{font-family:var(--ui);font-size:11.5px;color:var(--ink2);line-height:1.5;margin:4px 0 6px}
@media (max-width:520px){.repNet{grid-template-columns:1fr}}
/* 交办督办 · 派 → 指导 → 结案报告 → 评价 */
.mgBan{display:flex;flex-wrap:wrap;align-items:center;gap:8px;font-family:var(--ui);font-size:12px;color:var(--ink2);padding:7px 0;border-bottom:1px dashed var(--line)}
.mgBan:last-child{border-bottom:0}
.mgBan b{font-family:var(--serif);font-size:14px;color:var(--ink)}
.mgBan .who{font-family:var(--mono);font-size:11.5px;color:var(--ink3)}
.mgBan .tagx{font-family:var(--mono);font-size:11.5px;color:#fff;background:#8a7a5c;border-radius:8px;padding:1px 7px}
.mgBan.wait .tagx{background:var(--cinnabar)}
.mgBan.done .tagx{background:var(--bamboo)}
.mgBan .btn{margin-left:auto}
.mgBanSum{font-family:var(--ui);font-size:12px;color:var(--ink3);padding:2px 0 7px}
.mgGuide .banQuote{display:block;font-family:var(--serif);font-size:12px;color:var(--ink3);margin-top:4px;line-height:1.5}
.mgEval.mismatch{border-color:rgba(178,58,45,.45)}
.mgEval.mismatch .need{color:var(--cinnabar)}
/* 携装 · 领购与磨损 */
.dockBtn.kit .dockIcon{background:linear-gradient(180deg,#8a6a3d,#5f4526)}
.dockBtn.kit{border-color:rgba(95,69,38,.4)}
.dockBtn.tal .dockIcon{background:linear-gradient(180deg,#3f6b58,#274638)}
.dockBtn.tal{border-color:rgba(39,70,56,.4)}
.kitRow{display:grid;grid-template-columns:1fr 92px auto;align-items:center;gap:8px;padding:7px 0;
border-bottom:1px dashed var(--line);font-family:var(--ui);font-size:12px;color:var(--ink2)}
.kitRow:last-child{border-bottom:0}
.kitName{display:flex;align-items:center;gap:6px}
.kitName b{font-family:var(--serif);font-size:14px;color:var(--ink)}
.kitSt{font-family:var(--mono);font-size:11.5px;color:#fff;border-radius:8px;padding:1px 6px}
.kitSt.good{background:var(--bamboo)} .kitSt.mid{background:#8a7a5c}
.kitSt.bad{background:var(--cinnabar)} .kitSt.miss{background:#a8a095}
.kitRole{font-size:11.5px;color:var(--ink3);margin-left:auto}
.kitBar b{background:linear-gradient(90deg,var(--bamboo),#7fae86)}
.kitFine{grid-column:1 / -1;font-size:11.5px;color:var(--ink3);line-height:1.5}
.kitActs{grid-column:1 / -1;display:flex;gap:6px;margin-top:2px}
.kitWarn{display:block;font-size:11.5px;color:var(--cinnabar);margin-top:3px}
.kitBrief{font-family:var(--ui);font-size:12px;color:var(--ink2);line-height:1.6}
/* 本领 · 学时树 */
.talGrid{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin-top:4px}
.talNode{border:1px solid var(--line);border-radius:3px;padding:8px 9px;background:rgba(255,255,255,.45);
font-family:var(--ui);font-size:11.5px;color:var(--ink2);display:flex;flex-direction:column;gap:4px}
.talNode.on{border-color:var(--bamboo);background:rgba(107,142,107,.12)}
.talNode.lock{opacity:.74}
.talTop{display:flex;align-items:center;gap:6px}
.talTop b{font-family:var(--serif);font-size:14px;color:var(--ink)}
.talCost,.talOn{font-family:var(--mono);font-size:11.5px;color:#fff;background:#8a7a5c;border-radius:8px;padding:1px 6px}
.talOn{background:var(--bamboo)}
.talDesc{color:var(--ink2);line-height:1.5}
.talEff{color:var(--police);line-height:1.4}
.talNeed{color:var(--ink3)}
.talNode .btn{align-self:flex-start}
.talCol .sectTitle{margin-top:0}
@media (max-width:640px){.talGrid{grid-template-columns:1fr}}
/* =========================================================
v76 · 折叠 dock + 抽屉解剖 + 排版阶梯
这一层是"整理"：统一字号、统一按钮内部结构、统一弹层骨架。
写在文件末尾，靠级联覆盖前面几十处历史补丁。
========================================================= */
:root{
--fs-t1:19px; --fs-t2:15px; --fs-body:14.5px; --fs-sub:12px; --fs-num:11.5px;
--dock-w:158px; --dock-w-rail:64px;
}
/* ---------- ① 左侧 dock：三组折叠 ---------- */
.leftDock{
width:var(--dock-w) !important;
left:calc(50% - 640px - 178px) !important;
top:132px !important;
max-height:calc(100vh - 210px);
overflow-y:auto; overscroll-behavior:contain;
padding:9px 9px 10px !important;
gap:9px !important;
background:linear-gradient(180deg,rgba(255,253,246,.94),rgba(244,238,225,.95)),
url(../assets/art_paper_tile.webp) left top / 512px repeat !important;
scrollbar-width:thin; scrollbar-color:rgba(32,36,42,.22) transparent;
}
.leftDock::-webkit-scrollbar{width:6px}
.leftDock::-webkit-scrollbar-thumb{background:rgba(32,36,42,.2);border-radius:3px}
@media (max-width:1400px){ .leftDock{left:10px !important} }
@media (max-width:1000px){ .leftDock{max-height:none;bottom:104px !important} }
.dockGrp{display:flex;flex-direction:column;gap:6px}
.dockGrpHead{
position:relative;display:flex;align-items:center;gap:6px;width:100%;
padding:3px 4px 4px;border:0;border-bottom:1px solid var(--line);
background:transparent;cursor:pointer;font-family:var(--kai);color:var(--ink2);
}
.dockGrpHead:hover{color:var(--ink);border-bottom-color:var(--ink3)}
.grpGlyph{
width:19px;height:19px;flex:0 0 19px;border-radius:2px;
display:flex;align-items:center;justify-content:center;
font-size:12px;color:#f7f2e6;background:linear-gradient(180deg,#4a5f7a,#2f3f52);
}
.dockGrp[data-grp="place"] .grpGlyph{background:linear-gradient(180deg,#8a6a3d,#5f4526)}
.dockGrp[data-grp="file"] .grpGlyph{background:linear-gradient(180deg,#3f6b58,#274638)}
.grpName{font-size:13px;letter-spacing:2px}
.grpArrow{margin-left:auto;font-size:11.5px;color:var(--ink3)}
.grpBadge{
min-width:17px;height:17px;padding:0 4px;line-height:17px;border-radius:9px;
background:var(--cinnabar);color:#fff;font-family:var(--mono);font-size:11.5px;text-align:center;
}
.grpBadge[hidden]{display:none}
.dockItems{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:7px}
.dockGrp.fold .dockItems{display:none}
.dockGrp.fold .dockGrpHead{border-bottom-color:transparent}
.dockBtn{width:auto;padding:7px 3px 6px;border-radius:5px;gap:1px}
.dockIcon{width:30px;height:30px;font-size:14px}
.dockLbl{font-size:11.5px;letter-spacing:.5px;white-space:nowrap}
.dockBadge{top:-3px;right:-3px;min-width:15px;height:15px;line-height:15px;font-size:11.5px}
/* 窄栏：只留图标 */
.leftDock.rail{width:var(--dock-w-rail) !important;left:calc(50% - 640px - 84px) !important}
@media (max-width:1400px){ .leftDock.rail{left:10px !important} }
.leftDock.rail .dockItems{grid-template-columns:1fr}
.leftDock.rail .dockLbl,.leftDock.rail .grpName,.leftDock.rail .grpArrow{display:none}
.leftDock.rail .dockBtn{padding:6px 2px}
.leftDock.rail .dockGrpHead{justify-content:center}
.leftDock.rail .grpBadge{position:absolute;top:-4px;right:8px}
/* ---------- ② 抽屉骨架：顶栏 / 内容 / 尾栏 ---------- */
.modalBox{
padding:0 !important;display:flex;flex-direction:column;overflow:hidden;
max-width:600px;max-height:82vh;
}
.modalBox.tall{max-height:95vh}
.mBar{
position:relative;flex:0 0 auto;display:flex;align-items:center;
padding:11px 84px 10px 17px;border-bottom:1px solid var(--line);
/* 三层：纸底遮罩 → 淡冷调 → 水墨横条（上部 38% 是干净留白，正好压标题） */
background:linear-gradient(180deg,rgba(255,253,247,.82),rgba(246,240,226,.88)),
linear-gradient(180deg,rgba(74,107,122,.05),rgba(74,107,122,.10)),
url(../assets/art_drawer_head.webp) right bottom / auto 100% no-repeat;
}
.mBar::before{content:"";position:absolute;left:0;top:0;bottom:0;width:3px;background:var(--police)}
.mBarT{
font-family:var(--kai);font-size:var(--fs-t1);letter-spacing:3px;color:var(--ink);
min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;
}
.mBarAct{position:absolute;right:7px;top:7px;display:flex;gap:5px}
.mBarAct .mClose{position:static;width:28px;height:28px;font-size:16px}
.mGrip{
width:28px;height:28px;border-radius:50%;border:1px solid var(--line);
background:rgba(255,255,255,.9);color:var(--ink2);cursor:pointer;font-size:13px;line-height:1;
}
.mGrip:hover{background:#fff;border-color:var(--ink2);color:var(--ink)}
.mBody{
flex:1 1 auto;overflow-y:auto;padding:14px 17px 16px;overscroll-behavior:contain;
/* 纸纹按原尺寸 512 平铺（缩放会重新引入接缝），上面压一层半透纸色保证可读性 */
background:linear-gradient(180deg,rgba(255,253,247,.80),rgba(246,241,229,.82)),
url(../assets/art_paper_tile.webp) left top / 512px repeat;
}
.mFoot{
position:sticky;bottom:-16px;margin:16px -17px -16px;padding:11px 17px 14px;
background:linear-gradient(180deg,rgba(246,241,229,.86),#f6f1e5);
border-top:1px solid var(--line);
box-shadow:0 -6px 16px rgba(40,34,24,.08);
}
.mFoot .act{background:#fff}
/* ---------- ③ 排版阶梯：字号 / 行高 / 对齐一次定死 ---------- */
/* 早期"字体清晰度补丁"用了 !important，这里同权重后置覆盖，把阶梯收口 */
.docBody{font-size:var(--fs-body) !important;line-height:1.9}
.docMeta{font-size:var(--fs-sub) !important;line-height:1.6;letter-spacing:.2px;color:var(--ink3)}
.finePrint{font-size:var(--fs-sub) !important;line-height:1.75;color:var(--ink3)}
.hintInk{
display:block;padding:9px 11px;border:1px dashed var(--line);border-radius:3px;
background:rgba(255,255,255,.42);font-size:var(--fs-sub) !important;line-height:1.75;color:var(--ink3);
}
.sectTitle{font-size:var(--fs-t2) !important;letter-spacing:2.5px;margin:15px 0 7px}
.sectN{margin-left:auto;font-family:var(--mono);font-size:var(--fs-num);letter-spacing:0;color:var(--ink3)}
.lawBox{font-size:var(--fs-sub) !important;line-height:1.8}
/* 统一按钮内部结构：标题左 / 数值右 / 说明跨行 */
.act{
display:grid;grid-template-columns:minmax(0,1fr) auto;column-gap:10px;row-gap:2px;
align-items:baseline;padding:10px 12px;font-size:var(--fs-body) !important;line-height:1.55;
}
.act > b{grid-column:1;grid-row:1;color:var(--ink);font-weight:600}
.act .actN{
grid-column:2;grid-row:1;font-family:var(--mono);font-size:var(--fs-num);
color:var(--police);text-align:right;white-space:nowrap;letter-spacing:0;
}
.act .actN.bad{color:var(--cinnabar)} .act .actN.dim{color:var(--ink3)}
.act .need{grid-column:1 / -1;grid-row:2;font-size:var(--fs-sub) !important;line-height:1.65;letter-spacing:.2px}
.act .banQuote,.act .kitWarn,.act .effRow{grid-column:1 / -1}
.act[disabled] .actN{color:var(--ink3)}
.acts{gap:8px;margin-top:13px}
.acts[style*="flex-direction:row"] .act{flex:1 1 46%}
/* 数值行统一：左标签 / 中说明 / 右数字 */
.mgRow,.kitRow,.mgBan,.planRow,.qRow,.repNpc{font-size:var(--fs-sub)}
.mgRow .num,.kitRow .num,.abRow .num{font-family:var(--mono);font-size:var(--fs-num);letter-spacing:0}
.kitRow{
grid-template-columns:minmax(0,1fr) 84px auto;row-gap:3px;column-gap:9px;
padding:8px 0;align-items:baseline;
}
.kitRow .kitName{grid-column:1;grid-row:1}
.kitRow .kitBar{grid-column:2;grid-row:1;align-self:center}
.kitRow .num{grid-column:3;grid-row:1;text-align:right}
.kitRow .kitFine{grid-column:1 / -1;grid-row:2}
.kitRow .kitActs{grid-column:1 / -1;grid-row:3;justify-content:flex-end}
.kitRow .kitRole{margin-left:2px}
.talNode{font-size:var(--fs-sub);gap:3px;padding:9px 10px}
.talNode b{font-size:var(--fs-body)}
.mgBan{gap:7px;padding:8px 0}
.mgBan .btn{min-width:96px;text-align:center}
.mgOff,.mgCamp{font-size:var(--fs-sub)}
.mgMeter{font-size:var(--fs-num)}
.docHead{display:flex;align-items:baseline;gap:10px;flex-wrap:wrap}
.docNo{font-family:var(--mono);font-size:var(--fs-num);color:var(--ink3);letter-spacing:0;margin-left:auto}
.npcBody b{font-size:var(--fs-body)}
.npcRole{font-size:var(--fs-sub);line-height:1.7}
.logStream{font-size:var(--fs-sub)}
.logStream .lsItem{white-space:normal;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical}
/* 台账抽屉（由 UI.cat 走同一套模态骨架，这里只补内边距节奏） */
.mBody .doc{margin-bottom:11px}
.mBody .sectTitle:first-child{margin-top:0}
/* ---------- ④ 窄屏：dock 横过来，别压在内容上 ---------- */
@media (max-width:1000px){
.leftDock{
left:8px !important;right:8px;width:auto !important;
top:auto !important;bottom:92px !important;
/* 36vh 是常规窗口的账；屏幕矮到 36vh 会顶进 HUD 时，按实测 HUD 高收口（--hudH 由 renderHud 写回） */
max-height:min(36vh, calc(100vh - var(--hudH,155px) - 120px));flex-direction:row !important;flex-wrap:wrap;
gap:8px 10px !important;padding:8px 10px !important;
}
.dockGrp{flex:1 1 150px;min-width:0}
.dockItems{grid-template-columns:repeat(auto-fill,minmax(58px,1fr))}
.leftDock.rail{width:auto !important;left:8px !important}
#screenGame .stage{padding-bottom:34vh !important}
}
@media (max-width:640px){
.dockGrp{flex:1 1 100%}
.modalBox{max-width:100%}
.mBar{padding-right:76px}
}
/* ============ v78 · 分区标题与计数槽的排版收口 ============ */
/* 计数槽：等宽右对齐，长文案允许收缩省略，不把标题顶下去 */
.sectTitle{flex-wrap:wrap;row-gap:3px}
.sectN{white-space:nowrap;flex:0 1 auto;min-width:0;overflow:hidden;text-overflow:ellipsis}
/* 抽屉标题：字距已给到 3px，不再靠手工空格撑 */
.mTitle{letter-spacing:normal;margin-bottom:0}
/* 连续两个分区之间留一口气，避免"标题贴标题" */
.sectTitle + .sectTitle{margin-top:14px}
/* 空台账提示与卡片同宽，不再单独飘在左栏 */
.doc > .hintInk:first-child:last-child{margin:0}
/* ============ v82 · 板块美化：水墨素材升级 + 卡片质感 + 空状态插画 ============ */
/* ---- ① 场景素材：用整幅水墨插画替换早期小图，压暗层重做，让文字仍读得清 ---- */
.sceneBox{height:152px;background:#242830 center/cover no-repeat;filter:saturate(.86) contrast(1.02)}
.sceneBox.s-duty{background-image:url(../assets/scene_duty.webp)}
.sceneBox.s-night{background-image:url(../assets/scene_street.webp)}
.sceneBox.s-community{background-image:url(../assets/scene_community.webp)}
.sceneBox.s-room{background-image:url(../assets/scene_room.webp)}
.sceneBox::after{background:
linear-gradient(180deg,rgba(243,238,226,.04) 0%,rgba(32,36,42,.22) 52%,rgba(18,21,27,.80) 100%)}
.sceneCap{
left:11px;bottom:10px;font-size:15px;letter-spacing:4px;padding:3px 11px 3px 9px;
border-left:2px solid var(--cinnabar);background:rgba(18,21,27,.34);border-radius:2px;
}
.art{height:106px}
/* v242 · 这三格原来直接借页面顶部那三张 1600×800 的大场景：同一张图要同时喂 152px 高的 .sceneBox
和 106px 高的面板横带，两边都在裁——`.art` 这一头只露出源图中部 37%。现在各给一条 1200×360 的横带，
`.sceneBox.s-*` 仍用 scene_*（那条的裁切问题是另一笔账，见 AGENTS.md）。
v243 · 第四格 `community` 同一笔账：`scene_community.webp` 还被 `js/aid.js` 的现场屏和
`js/ui.js` 的场景池在用、跑测台也断言它，所以只能新建 `art_community.webp`，不许覆写那张场景图。 */
.art.room{background-image:url(../assets/art_room.webp)}
.art.night{background-image:url(../assets/art_night.webp)}
.art.duty{background-image:url(../assets/art_duty.webp)}
.art.community{background-image:url(../assets/art_community.webp)}
.art::after{background:linear-gradient(180deg,rgba(243,238,226,.02),rgba(32,36,42,.40))}
.startScreen::before{background-image:url(../assets/scene_street.webp)}
#tab-duty::before{background-image:url('../assets/scene_duty.webp');opacity:.07}
.startScreen .heroArt{background:linear-gradient(180deg,rgba(20,22,28,.18),rgba(20,22,28,.74)),url(../assets/scene_duty.webp) center/cover no-repeat}
/* ---- ② 文书卡：纸感、内高光、色条渐变、可点卡微抬 ---- */
.doc{
border-radius:3px;background:linear-gradient(180deg,#fffdf7,#f7f2e6);
box-shadow:inset 0 1px 0 rgba(255,255,255,.8),0 3px 14px rgba(40,34,24,.09);
}
.doc::before{background:linear-gradient(180deg,var(--police),rgba(38,69,111,.18));border-radius:3px 0 0 3px}
.doc.red::before{background:linear-gradient(180deg,var(--cinnabar),rgba(168,57,44,.18))}
.doc.gold::before{background:linear-gradient(180deg,var(--ochre),rgba(143,106,48,.18))}
.doc.green::before{background:linear-gradient(180deg,var(--bamboo),rgba(77,107,87,.18))}
.doc[class*="Card"],.caseCard,.medCard,.warnCard{transition:.16s}
.doc[class*="Card"]:hover,.caseCard:hover,.medCard:hover,.warnCard:hover{transform:translateY(-1px);box-shadow:inset 0 1px 0 rgba(255,255,255,.8),0 8px 20px rgba(40,34,24,.14)}
/* 首卡角花：值班工作台第一张卡、结局卡 */
.dutyBanner+.doc::after,.endWrap .doc::after{
content:"";position:absolute;right:2px;bottom:2px;width:112px;height:112px;pointer-events:none;
background:url(../assets/ink_corner.webp) right bottom / contain no-repeat;opacity:.40;mix-blend-mode:multiply;
}
.dutyBanner+.doc,.endWrap .doc{overflow:hidden}
/* ---- ③ 分区标题：压一道虚线，板块边界更清楚 ---- */
.sectTitle{margin:17px 0 9px;padding-bottom:5px;border-bottom:1px dashed rgba(32,36,42,.15)}
.sectTitle::before{width:6px;height:14px;background:linear-gradient(180deg,var(--cinnabar),rgba(168,57,44,.55))}
/* ---- ④ 数字块：等宽大字 + 顶部色条 + 右下淡朱印 ---- */
.stat,.mgKpi .kpi{
position:relative;overflow:hidden;padding:9px 10px 8px;border-radius:3px;
background:linear-gradient(180deg,rgba(255,255,255,.8),rgba(255,255,255,.46));
}
.stat::before,.mgKpi .kpi::before{content:"";position:absolute;left:0;right:0;top:0;height:2px;background:linear-gradient(90deg,var(--police),rgba(38,69,111,0))}
.stat::after,.mgKpi .kpi::after{
content:"";position:absolute;right:-9px;bottom:-11px;width:36px;height:36px;pointer-events:none;
background:url(../assets/seal_imprint.webp) center / contain no-repeat;opacity:.15;mix-blend-mode:multiply;
}
.stat .k,.mgKpi .kpi .k{font-family:var(--ui);font-size:11.5px;letter-spacing:.5px;color:var(--ink3)}
.stat .v,.mgKpi .kpi .v{font-family:var(--mono);font-size:19px;color:var(--ink);font-variant-numeric:tabular-nums;letter-spacing:0}
/* ---- ⑤ 空状态：带插画的虚线卡（只在挂了 empty-* 的地方成卡） ---- */
.hintInk[class*="empty-"]{
position:relative;min-height:56px;padding:11px 118px 11px 12px;margin:2px 0;
border:1px dashed rgba(32,36,42,.20);border-radius:3px;background:rgba(255,253,247,.6);
}
.hintInk[class*="empty-"]::after{
content:"";position:absolute;right:8px;top:50%;transform:translateY(-50%);width:104px;height:72px;
background-position:right center;background-size:contain;background-repeat:no-repeat;
opacity:.62;mix-blend-mode:multiply;pointer-events:none;
}
.hintInk.empty-desk::after{background-image:url(../assets/empty_desk.webp)}
.hintInk.empty-file::after{background-image:url(../assets/empty_file.webp)}
.hintInk.empty-ledger::after{background-image:url(../assets/empty_ledger.webp)}
/* ---- ⑥ 动作按钮：左侧等级色条 + 更明确的按压反馈 ---- */
.act{border-left:3px solid rgba(38,69,111,.26);transition:.14s}
.act:hover{border-left-color:var(--police);background:#fff}
.act:active{transform:translateX(2px) scale(.996)}
.act.g-S{border-left-color:var(--cinnabar)}
.act.g-B{border-left-color:var(--ochre)}
.act.g-C{border-left-color:var(--police)}
.act.g-D{border-left-color:rgba(107,112,120,.6)}
.act.g-x{border-left-color:rgba(32,36,42,.18)}
.act[disabled]{border-left-color:rgba(32,36,42,.12)}
/* 值班台常规动作：两列成板 */
.acts.duo{display:grid;grid-template-columns:1fr 1fr;gap:8px}
@media (max-width:640px){.acts.duo{grid-template-columns:1fr}}
/* ---- ⑦ HUD：印章、指标分组、时钟片 ---- */
.seal{position:relative;background:linear-gradient(180deg,#33557f,#26456f);border-radius:4px;box-shadow:0 2px 6px rgba(38,69,111,.32)}
.seal::after{content:"";position:absolute;inset:-2px;background:url(../assets/seal_imprint.webp) center/contain no-repeat;opacity:.28;mix-blend-mode:screen;pointer-events:none}
.clock{padding:1px 9px;border-radius:2px;background:rgba(38,69,111,.07);border-left:2px solid var(--police)}
.spSkip{border-radius:2px}
.dutyBanner{position:relative;overflow:hidden}
.dutyBanner::before{animation:dotPulse 2.2s ease-in-out infinite}
@keyframes dotPulse{0%,100%{opacity:1;transform:scale(1)}50%{opacity:.35;transform:scale(.72)}}
/* ---- ⑧ 氛围条 / 日志流 / 队列卡 ---- */
.atmosBar{border-left-color:var(--bamboo);background:linear-gradient(90deg,rgba(251,247,236,.96),rgba(243,236,221,.62))}
.atmosLine::before{content:"";display:inline-block;width:6px;height:6px;border-radius:50%;background:var(--police);margin-right:7px;vertical-align:2px;opacity:.7}
.logStream .lsItem{border-bottom:1px dotted rgba(32,36,42,.12);padding:3px 0 3px 6px;border-left:2px solid transparent}
.logStream .lsItem:first-child{color:var(--ink);border-left-color:var(--cinnabar);background:rgba(168,57,44,.05)}
.qCard{border-left-width:5px;box-shadow:0 6px 18px rgba(30,26,18,.20),inset 0 1px 0 rgba(255,255,255,.7)}
.qCard .qTimer{color:var(--ink2);background:rgba(32,36,42,.05);border-radius:2px;padding:0 5px}
/* ============ v86 · 字体系统：方正宋体大字 + 黑体标签 + 色字分类 ============ */
/* 标题脸：优先方正小标宋，机器没装就落到思源宋体（本机可用），不再退回楷体那种手写感 */
:root{
--fz:"Noto Serif SC","Source Han Serif SC","SimSun",serif;
--hei:"SimHei","Noto Sans SC","Microsoft YaHei","PingFang SC",sans-serif;
--kai:var(--fz);
--brush:"STKaiti","KaiTi","Kaiti SC",serif;
--fs-t1:22px; --fs-t2:17px; --fs-body:15.5px; --fs-sub:13px; --fs-num:12.5px;
}
/* ---- ① 标题与正文：加大、加粗、字距拉开 ---- */
.mBarT{font-family:var(--fz);font-size:var(--fs-t1);font-weight:700;letter-spacing:3.5px}
.docTitle{font-family:var(--fz);font-size:21px;font-weight:700;letter-spacing:2.5px}
.sectTitle{font-family:var(--fz);font-weight:700}
.qTitle,.lifeHead,.npcHead b,.caseCard .docTitle{font-family:var(--fz);font-weight:700}
.qTitle{font-size:17px;letter-spacing:1.5px}
.docBody{font-size:var(--fs-body) !important;line-height:2.05}
.docBody em,.docBody .em{font-weight:700;color:var(--ink)}
.act > b{font-family:var(--hei);font-weight:700;font-size:16px;letter-spacing:.4px}
.act .need{font-size:var(--fs-sub) !important;letter-spacing:.3px}
.btn{font-family:var(--hei);font-weight:700;letter-spacing:3px;font-size:16px}
.btn-sm{font-family:var(--hei);font-size:12px;letter-spacing:1px}
.docMeta,.docNo,.stat .k,.mgKpi .kpi .k,.chip,.lineCard .tag,.hudMoney,.mods{font-family:var(--hei)}
.docMeta{font-size:var(--fs-sub) !important;letter-spacing:.6px}
.docNo{font-family:var(--mono);font-size:12px}
.stat .v,.mgKpi .kpi .v{font-size:22px;font-weight:700}
.hintInk{font-size:var(--fs-body) !important;line-height:1.95}
.lawBox,.finePrint{font-size:var(--fs-sub) !important;line-height:1.95}
.mgOffHead b,.mgRole{font-family:var(--hei)}
.mgOffHead b{font-size:16px;font-weight:700}
.mgBan b,.kitRow b,.talNode b{font-family:var(--hei);font-weight:700}
/* ---- ② 色字分类：蓝=指令/职级/权限，朱砂=警示/超期，竹青=达成/好评，赭石=钱/隐患 ---- */
.c-pol{color:var(--police) !important}
.c-in{color:var(--cinnabar) !important}
.c-ok{color:var(--bamboo) !important}
.c-mon{color:var(--ochre) !important}
.c-dim{color:var(--ink3) !important}
.docMeta b,.mods b,.lawBox b,.sectN b,.pmLine b{color:var(--police)}
.mods b{color:var(--ochre)}
.rowStamp{color:var(--cinnabar);font-family:var(--fz);font-weight:700;letter-spacing:3px}
.t0{color:var(--cinnabar) !important;font-weight:700}
.t1{color:var(--ochre) !important;font-weight:700}
.t3{color:var(--bamboo) !important;font-weight:700}
.t4{color:var(--police) !important;font-weight:700}
.warn{color:var(--cinnabar);font-weight:700}
.qFrom{font-family:var(--hei);font-weight:700;letter-spacing:1.5px}
.qTimer{font-weight:700}
.pmOn{color:var(--bamboo)} .pmOff{color:var(--cinnabar)} .pmTemp{color:var(--ochre)}
/* ---- ③ HUD：字更大更黑，存款走赭石、职级走警蓝 ---- */
.clock{font-family:var(--fz);font-size:19px;font-weight:700;letter-spacing:3px}
.hudName b{font-family:var(--fz);font-size:16px;font-weight:700;letter-spacing:1px}
.hudRank{font-family:var(--hei);font-size:13px;font-weight:700;color:var(--police)}
.hudMoney{font-size:12px;font-weight:700;color:var(--ochre)}
.meter span{font-family:var(--hei);font-size:12px;font-weight:700}
.dutyChip,.wxChip{font-family:var(--hei);font-weight:700;letter-spacing:1px}
.spBtn{font-family:var(--mono);font-weight:700}
/* ============ v86b · 起始页：门楼主视觉 + 大字标题 + 四条出身卡 ============ */
.startScreen::before{background-image:url(../assets/scene_gate.webp);filter:saturate(.62) brightness(.42) contrast(1.06)}
.startScreen .startWrap{max-width:1180px;padding:32px 30px 48px}
.startScreen .inkTitle{align-items:center;gap:22px;margin-bottom:4px}
.startScreen .sealBig{
width:74px;height:74px;flex:0 0 74px;font-size:26px;letter-spacing:2px;border-radius:8px;position:relative;
background:linear-gradient(160deg,#b84a3c,#8a2a1f);box-shadow:0 10px 26px rgba(168,57,44,.45);
}
.startScreen .sealBig::after{content:"";position:absolute;inset:-4px;background:url(../assets/seal_imprint.webp) center/contain no-repeat;opacity:.45;mix-blend-mode:screen;pointer-events:none}
.startScreen .inkTitle h1{
font-family:var(--fz);font-size:62px;letter-spacing:16px;font-weight:700;margin:0;
background:linear-gradient(180deg,#fbf6e9 26%,#d9dee5 68%,#a9bacd);
-webkit-background-clip:text;background-clip:text;color:transparent;text-shadow:none;
}
.startScreen .sub{font-family:var(--hei);font-size:13px;font-weight:600;letter-spacing:6px;color:rgba(196,208,224,.72);margin-top:8px}
.startScreen .titleRight{gap:6px;padding-bottom:2px}
.startScreen .vText{font-family:var(--hei);font-size:15px;font-weight:700;letter-spacing:5px;color:#e8dcbd}
.startScreen .dateText{font-size:12px;letter-spacing:2px;color:rgba(220,178,122,.8)}
.startScreen .heroArt{
height:198px;border-color:rgba(232,226,210,.22);margin:20px 0 12px;filter:none;
background:linear-gradient(180deg,rgba(18,21,28,.10),rgba(18,21,28,.62)),url(../assets/scene_gate_band.webp) center/cover no-repeat;
}
.startScreen .heroVerse{padding:0 28px}
.startScreen .heroVerse p{
font-family:var(--fz);font-size:24px;font-weight:700;letter-spacing:8px;line-height:2;
color:#f8f3e6;text-shadow:0 2px 12px rgba(0,0,0,.8);
}
.startScreen .heroCap{font-family:var(--hei);font-size:12px;font-weight:700;letter-spacing:4px;color:rgba(232,220,189,.86)}
.startScreen .lineIntro{
font-family:var(--hei);font-size:15px;font-weight:600;letter-spacing:.6px;line-height:2;
color:rgba(240,235,222,.9);border-left:4px solid var(--cinnabar);padding-left:14px;margin:20px 0 16px;
}
/* 起始页色字：暗底上用亮一档的四色 */
.startScreen .c-pol{color:#93b8e6 !important}
.startScreen .c-in{color:#e8917f !important}
.startScreen .c-ok{color:#9ecbaf !important}
.startScreen .c-mon{color:#e0b981 !important}
.startScreen .c-dim{color:rgba(226,220,205,.6) !important}
/* 出身卡：宽屏四张并排（立绘在上），中屏两张（立绘在左），窄屏单列 */
.startScreen .lineCards{display:grid;grid-template-columns:repeat(2,1fr);gap:16px;margin-top:16px}
@media (min-width:1180px){.startScreen .lineCards{grid-template-columns:repeat(4,1fr)}}
@media (max-width:860px){.startScreen .lineCards{grid-template-columns:1fr}}
.startScreen .lineCard{
grid-template-columns:1fr;gap:12px;padding:0 0 14px;overflow:hidden;
border-top:3px solid rgba(38,69,111,.55);border-radius:4px;
background:linear-gradient(180deg,rgba(250,246,236,.97),rgba(236,228,209,.94));
}
.startScreen .lineCard[data-k="fujing"]{border-top-color:var(--bamboo)}
.startScreen .lineCard[data-k="keban"]{border-top-color:var(--police)}
.startScreen .lineCard[data-k="minjian"]{border-top-color:var(--ochre)}
.startScreen .lineCard[data-k="suozhang"]{border-top-color:var(--cinnabar)}
.startScreen .lineArt{width:100%;height:172px;border:0;border-radius:0;box-shadow:none;background-position:center 22%}
.startScreen .lineText{padding:0 15px}
.startScreen .lineCard h3{font-family:var(--fz);font-size:25px;font-weight:700;letter-spacing:2px;margin-top:11px}
.startScreen .lineCard .tag{
display:block;margin:6px 0 0;font-family:var(--hei);font-size:12px;font-weight:700;letter-spacing:1.5px;
color:var(--police);border:0;background:rgba(38,69,111,.09);padding:2px 8px;border-radius:2px;width:max-content;
}
.startScreen .lineCard p{font-size:13px;line-height:1.95;margin:9px 0 0;color:var(--ink2)}
.startScreen .lineCard .kv{margin-top:10px;gap:6px}
.startScreen .lineCard .kv span{font-family:var(--hei);font-size:11.5px;font-weight:700;background:rgba(32,36,42,.06);border-radius:2px;color:var(--ink2)}
.startScreen .lineCard .wall{font-family:var(--hei);font-size:12px;font-weight:700;line-height:1.8;margin-top:10px}
.startScreen .lineCard.on{border-color:transparent;border-top-width:3px;box-shadow:0 0 0 2px rgba(168,57,44,.55),0 16px 34px rgba(0,0,0,.42)}
.startScreen .lineCard.on::before{
content:"已选 · 这条线";position:absolute;left:0;top:0;z-index:2;
font-family:var(--hei);font-size:11.5px;font-weight:700;letter-spacing:1px;
background:var(--cinnabar);color:#fff6ea;padding:3px 9px;border-radius:0 0 4px 0;
}
.startScreen .startFoot{margin-top:24px;padding:18px 20px;gap:16px;align-items:flex-end}
.startScreen .nameBox{font-family:var(--hei);font-size:13px;font-weight:700;letter-spacing:2px;color:rgba(238,232,216,.92);display:flex;flex-direction:column;gap:5px}
.startScreen .nameBox input,.startScreen .startFoot select{
font-family:var(--hei);font-size:17px;font-weight:700;letter-spacing:1px;
padding:8px 12px;border-radius:3px;background:rgba(250,246,236,.95);min-width:104px;
}
.startScreen .btnEnlist{padding:12px 42px;font-size:20px;letter-spacing:8px;font-weight:700}
.startScreen .btn-ghost{font-family:var(--hei);font-size:15px;font-weight:700;letter-spacing:3px;color:rgba(238,232,216,.86);border-color:rgba(158,203,175,.5)}
.startScreen .eduHint{font-family:var(--hei);font-size:13px;font-weight:600;line-height:1.95;letter-spacing:.4px;color:rgba(226,220,205,.72);margin-top:14px}
@media (max-width:640px){
.startScreen .startWrap{padding:22px 16px 34px}
.startScreen .inkTitle h1{font-size:40px;letter-spacing:9px}
.startScreen .sealBig{width:56px;height:56px;flex-basis:56px;font-size:20px}
.startScreen .heroArt{height:132px}
.startScreen .heroVerse p{font-size:18px;letter-spacing:4px}
.startScreen .lineArt{height:150px}
}
/* ---- ⑤ 游戏内色字与字重补强 ---- */
.logLine{font-size:14px}
.logLine .d{font-size:11.5px;color:var(--police);font-weight:700}
.abRow .nm{font-family:var(--hei);font-weight:700;font-size:13px;color:var(--ink2)}
.abRow .num{font-size:13px;font-weight:700;color:var(--police)}
.prNum,.relRow .prNum{font-family:var(--mono);font-weight:700;font-size:13px}
.pmTop b{font-family:var(--hei);font-weight:700;font-size:15px}
.ev,.caseSteps i,.qStage,.qScene,.tagx{font-family:var(--hei);font-weight:700}
.ev{font-size:12px}
.caseSteps i.on{background:var(--police);border-color:var(--police);color:#f4f8ff}
.tierLine{font-size:var(--fs-body)}
.mgMeter span{font-family:var(--hei);font-weight:700}
.toast{font-family:var(--hei);font-weight:700;font-size:15px;letter-spacing:2px}
.mgRow .nm,.mgRow .num{font-family:var(--hei)}
.mgRow .num{font-weight:700;color:var(--police)}
.pmLine .k{font-family:var(--hei);font-weight:700;color:var(--ink3)}
/* 出身卡：perk 走竹青、天花板走朱砂，一眼分得清 */
.startScreen .lineCard .kv:last-child span{color:var(--bamboo);background:rgba(77,107,87,.1)}
.startScreen .lineCard .kv:first-of-type span:nth-child(2){color:var(--cinnabar);background:rgba(168,57,44,.09)}
/* ---- ⑥ v48 那批 !important 字号压住了 v86，这里按类型把该大的抬回来 ---- */
.lineIntro{font-size:15px !important}
.docBody p{font-size:var(--fs-body) !important;line-height:2.05}
.prNum,.relRow .prNum{font-size:13px !important}
.pSub2,.lifeTag,.lifeStats{font-size:12px !important}
/* ---- ⑦ 数值分色：钱=赭石，指令/期限=警蓝，超期/风险=朱砂（买不起时仍归灰） ---- */
.act:not([disabled]) .actN.mon,.sectN.mon{color:var(--ochre) !important;font-weight:700}
/* ===== v197 字体颜色语义体系：事件区/分数/难度/能力/时间 各归各色 ===== */
/* —— 事件区：按 S/B/C/D 分级着色，队列卡左侧已有 g-S~g-D，弹层 docNo/docTitle 跟上 —— */
.docNo.gS,.docTitle.gS{color:var(--cinnabar)}
.docNo.gB,.docTitle.gB{color:var(--ochre)}
.docNo.gC{color:var(--police)}
.docNo.gD{color:var(--ink3)}
.docNo.gX{color:var(--ink3)} /* 等级"—"的所内安排等：中性灰 */
.doc.gS .docNo,.doc.gS .docTitle{color:var(--cinnabar)}
.doc.gB .docNo,.doc.gB .docTitle{color:var(--ochre)}
/* —— 分数值：结算屏"得分 X"按高低着色（≥80 蓝 · 60~79 黑 · 40~59 赭 · <40 朱）—— */
.scoreVal{font-family:var(--mono);font-weight:700;font-variant-numeric:tabular-nums}
.scoreHi{color:var(--police)} .scoreMid{color:var(--ink)} .scoreLow{color:var(--ochre)} .scoreBad{color:var(--cinnabar)}
/* 判定档位后跟的分数：.rowStamp 里的 .scoreVal 由 JS 按值挂档类 */
/* —— 难度数字：按档位着色（≤20 绿 · 21~40 黑 · 41~60 赭 · 61~80 朱 · >80 深朱加粗）—— */
.diffN{font-family:var(--mono);font-weight:600;font-variant-numeric:tabular-nums}
.diffEasy{color:var(--bamboo)} .diffMid{color:var(--ink)} .diffHard{color:var(--ochre)} .diffBoss{color:var(--cinnabar)} .diffMax{color:#8b2f24;font-weight:700}
/* —— 能力名：判定用的那项能力在 need 行里单独着色（警蓝加粗，与普通说明字区分）—— */
.need .abName{color:var(--police);font-weight:600}
/* —— 耗时/分钟：次要信息，灰但不淡—— */
.costN{font-family:var(--mono);color:var(--ink3);font-variant-numeric:tabular-nums}
/* —— 期限剩：按紧迫度着色（>120′ 灰 · 60~120 赭 · <60 朱 · 超期深朱+加粗）—— */
.dueN{font-family:var(--mono);font-variant-numeric:tabular-nums}
.dueOk{color:var(--ink3)} .dueWarn{color:var(--ochre)} .dueUrg{color:var(--cinnabar)} .dueOver{color:#8b2f24;font-weight:700}
/* —— eff 增减芯片：金钱类永远赭石，其余保持 绿涨/红跌 —— */
.eff.mon{background:rgba(176,129,63,.15);color:var(--ochre)}
.eff.mon.up{background:rgba(176,129,63,.18);color:var(--ochre)}
.eff.mon.down{background:rgba(168,57,44,.10);color:#8b2f24}
/* —— 日志流 lsItem：按类别加左竖线（好=绿 · 坏=红 · 重要=蓝 · 默认透明）—— */
.logStream .lsItem{border-left:2px solid transparent;padding-left:5px}
.logStream .lsItem.good{border-left-color:var(--bamboo)}
.logStream .lsItem.bad{border-left-color:var(--cinnabar)}
.logStream .lsItem.imp{border-left-color:var(--police)}
.logStream .lsItem:first-child{border-left-color:inherit} /* 首条已有 cinnabar 底，继承原色 */
/* —— 卷宗 logLine：日期戳按类别着色 —— */
.logLine.good .d{color:var(--bamboo)} .logLine.bad .d{color:var(--cinnabar)} .logLine.imp .d{color:var(--police)}
/* —— 数值预览芯片里的 能力名 前缀：能力类 .eff.ab 已蓝底，这里不重复 —— */
/* —— 结算屏修正行 mods：正数竹青、负数朱砂、零灰（由 JS 包 span）—— */
.mods .modP{color:var(--bamboo)} .mods .modN{color:var(--cinnabar)} .mods .modZ{color:var(--ink3)}
/* ============ v90 · HUD 属性板：名字写全 + 数值写出 + 危险分档 ============ */
.hudR{display:block;flex:0 0 auto;min-width:0}
.hudStats{display:flex;flex-direction:column;gap:4px}
.stGrp{display:flex;align-items:center;gap:11px;min-width:0}
.stCap{
flex:0 0 auto;padding-right:9px;border-right:1px solid var(--line);
font-family:var(--hei);font-size:11.5px;font-weight:700;letter-spacing:2px;color:var(--ink3);
}
.mtr{display:grid;grid-template-columns:auto minmax(26px,44px) 26px;align-items:center;gap:6px;cursor:help;min-width:0}
.hLbl{font-family:var(--hei);font-size:12px;font-weight:700;letter-spacing:.5px;color:var(--ink2);white-space:nowrap}
.hMeter{display:block;height:6px;border-radius:3px;background:rgba(32,36,42,.13);overflow:hidden}
.hMeter b{display:block;height:100%;width:50%;border-radius:3px;transition:width .35s ease}
.hNum{font-family:var(--mono);font-size:13px;font-weight:700;text-align:right;font-variant-numeric:tabular-nums;color:var(--ink)}
/* 三档：竹青=没事，赭石=该在意，朱砂=已经出事 */
.mtr.m-ok .hMeter b{background:linear-gradient(90deg,#4d6b57,#7aa087)}
.mtr.m-ok .hNum{color:var(--bamboo)}
.mtr.m-warn .hMeter b{background:linear-gradient(90deg,#8f6a30,#c0934f)}
.mtr.m-warn .hNum,.mtr.m-warn .hLbl{color:var(--ochre)}
.mtr.m-bad .hMeter b{background:linear-gradient(90deg,#a8392c,#d05a45)}
.mtr.m-bad .hNum,.mtr.m-bad .hLbl{color:var(--cinnabar)}
.mtr.m-bad .hLbl::after{content:" !";font-weight:700}
.mtr:hover .hLbl{color:var(--police)}
@media (max-width:1180px){.stCap{display:none}.mtr{grid-template-columns:auto minmax(24px,34px) 24px;gap:5px}}
/* 窄屏：属性板整行放到姓名/时钟下面，条子随宽度拉伸，不挤成一团 */
@media (max-width:900px){
.hud{flex-wrap:wrap;row-gap:7px}
.hudL{flex:1 1 250px}
.hudC{flex:1 1 210px;text-align:left}
.hudR{flex:1 1 100%;order:3;min-width:0}
.hudStats{flex-direction:row;gap:8px 18px;flex-wrap:wrap}
.stGrp{flex:1 1 260px;gap:10px}
.stCap{display:inline}
.mtr{flex:1 1 0;min-width:0;grid-template-columns:auto minmax(20px,1fr) 24px}
}
@media (max-width:700px){
.hudStats{flex-direction:column;gap:4px}
.stGrp{flex:1 1 auto}
.hLbl{font-size:11.5px}
.hNum{font-size:12px}
}
/* ---- v93 · HUD 时钟不许折行；窄屏收一档字号 ---- */
@media (max-width:900px){.clockRow{flex-wrap:wrap;row-gap:3px;gap:6px}}
@media (max-width:700px){.clock{font-size:18px;letter-spacing:2px}.wxChip{font-size:11.5px;letter-spacing:0}}
/* ---- v94 · ≤700px：时钟与倍速同排，HUD 收回三行以内 ---- */
@media (max-width:700px){
.hudC{display:flex;align-items:center;justify-content:space-between;gap:8px;flex-wrap:wrap}
.clockRow{flex:1 1 auto;min-width:0}
.speed{margin-top:0;flex:0 0 auto}
.clock{font-size:16px;letter-spacing:1px;padding:0 6px}
.wxChip{display:none}
.spMain{width:34px !important;height:34px !important}
}
/* ---- v95 · 窄屏 HUD 收进行数：时钟压过 v49 的 22px !important，身份与时钟同排 ---- */
@media (max-width:700px){
.hudC .clock{font-size:16px !important;letter-spacing:1px !important;padding:0 6px}
.clockRow{flex:0 1 auto;justify-content:flex-start;min-width:0}
.hudL{flex:1 1 200px}
.hudPortrait,#hudPortrait{display:none}
.hudName{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
}
/* ============ v96 · 出身选项卡：立绘溶进纸面 + 属性表 + 身份墙 + 特长 + 已选印章 ============ */
.startScreen .lineCard{
position:relative;display:flex;flex-direction:column;align-items:stretch;gap:0;padding:0 0 15px;overflow:hidden;
border:1px solid rgba(32,36,42,.14);border-top-width:3px;border-radius:4px;
background:linear-gradient(180deg,rgba(250,246,236,.97),rgba(233,225,206,.95));
box-shadow:0 8px 22px rgba(0,0,0,.26);transition:transform .18s,box-shadow .18s;
}
.startScreen .lineCard:hover{transform:translateY(-4px);box-shadow:0 16px 36px rgba(0,0,0,.4)}
.startScreen .lineCard.on{box-shadow:0 0 0 2px rgba(168,57,44,.62),0 18px 40px rgba(0,0,0,.45)}
/* 没选中的线：立绘压灰，选中的才"上色" */
.startScreen .lineCard:not(.on) .lineArt{filter:grayscale(.5) contrast(.96);opacity:.8}
.startScreen .lineCard:hover .lineArt,.startScreen .lineCard.on .lineArt{filter:none;opacity:1}
/* 立绘区：下缘溶进纸面，不留硬边 */
.lcArt{position:relative;height:198px;background:var(--paper2)}
.startScreen .lineArt{width:100%;height:198px;border:0;border-radius:0;box-shadow:none;background-position:center 16%;transition:filter .2s,opacity .2s}
.lcArt::after{content:"";position:absolute;inset:0;pointer-events:none;
background:linear-gradient(180deg,rgba(250,246,236,0) 46%,rgba(250,246,236,.94) 100%)}
.lcTag{
position:absolute;left:0;bottom:10px;z-index:2;
font-family:var(--hei);font-size:11.5px;font-weight:700;letter-spacing:1.5px;color:#f8f3e7;
background:rgba(26,30,36,.74);padding:4px 11px 4px 9px;border-radius:0 3px 3px 0;
}
/* 已选印章：朱砂双环，选中时才盖下去 */
.lcSeal{
position:absolute;right:12px;top:12px;z-index:2;width:56px;height:56px;border-radius:50%;
display:flex;align-items:center;justify-content:center;
font-family:var(--fz);font-size:15px;font-weight:700;letter-spacing:1px;color:#fdf3e6;
background:radial-gradient(circle at 34% 26%,#c2513f,#8d2b1f 74%);
box-shadow:inset 0 0 0 2px rgba(253,243,230,.86),inset 0 0 0 5px rgba(141,43,31,.55),0 6px 14px rgba(0,0,0,.34);
transform:rotate(-13deg) scale(.5);opacity:0;transition:.22s cubic-bezier(.2,.8,.2,1);pointer-events:none;
}
.startScreen .lineCard.on .lcSeal{transform:rotate(-13deg) scale(1);opacity:1}
/* v86b 那条左上角"已选"飘带和印章重复，只留印章 */
.startScreen .lineCard.on::before{content:none}
.startScreen .lineText{padding:0 15px;min-width:0}
.startScreen .lineCard h3{margin-top:13px}
.startScreen .lineCard .lcBlurb{font-family:var(--serif);font-size:13px !important;line-height:1.95;color:var(--ink2);margin:9px 0 0;text-align:justify}
/* 属性表：起点 / 天花板 / 剧本 一行一项，天花板用本线主色 */
.lcRows{margin-top:12px;border-top:1px solid rgba(32,36,42,.14)}
.lcRow{display:grid;grid-template-columns:58px minmax(0,1fr);gap:10px;align-items:baseline;padding:6px 1px;border-bottom:1px dashed rgba(32,36,42,.13)}
.lcK{font-family:var(--hei);font-size:11.5px;font-weight:700;letter-spacing:2px;color:var(--ink3);white-space:nowrap}
.lcV{font-family:var(--hei);font-size:14px;font-weight:700;color:var(--ink);line-height:1.6}
.lcRow:nth-child(2) .lcV{color:var(--police)}
.lineCard[data-k="fujing"] .lcRow:nth-child(2) .lcV{color:var(--bamboo)}
.lineCard[data-k="minjian"] .lcRow:nth-child(2) .lcV{color:var(--ochre)}
.lineCard[data-k="suozhang"] .lcRow:nth-child(2) .lcV{color:var(--cinnabar)}
/* 身份墙与线专属特长：一个朱砂一个竹青，扫一眼就知道是坑还是好处 */
.startScreen .lineCard .wall{
margin-top:11px;padding:8px 10px;border-left:3px solid var(--cinnabar);border-radius:0 2px 2px 0;
background:rgba(168,57,44,.09);color:#7c2a1f;line-height:1.8;
}
.lcPerk{
margin-top:8px;padding:8px 10px;border-left:3px solid var(--bamboo);border-radius:0 2px 2px 0;
background:rgba(77,107,87,.1);font-family:var(--hei);font-size:12px;font-weight:600;line-height:1.8;color:var(--ink2);
}
.lcPerk b{display:inline-block;margin-right:7px;padding:0 6px;border-radius:2px;background:rgba(77,107,87,.16);
font-family:var(--fz);font-size:13px;font-weight:700;color:var(--bamboo)}
@media (max-width:640px){
.lcArt,.startScreen .lineArt{height:168px}
.lcSeal{width:48px;height:48px;font-size:13px}
}
/* ============ v99 · 出身卡栅格纠偏：v46 的 repeat(3,1fr)!important 压住了 4 列断点 ============ */
.startScreen .lineCards{grid-template-columns:repeat(2,1fr) !important;gap:16px}
.startScreen .lineCard:last-child{grid-column:auto !important}
@media (max-width:860px){
.startScreen .lineCards{grid-template-columns:1fr !important}
}
@media (min-width:1400px){
.startScreen .startWrap{max-width:1420px}
.startScreen .lineCards{grid-template-columns:repeat(4,1fr) !important}
}
/* 卡片等高时把「身份墙 + 特长」压到卡底，别让下面留一大块空白 */
.startScreen .lineText{display:flex;flex-direction:column;flex:1 1 auto}
.startScreen .lineCard .wall{margin-top:auto;padding-top:11px}
/* ============ v101 · 出身卡：本线色渗 + 立绘呼吸 ============ */
.lcArt{overflow:hidden}
.lcArt::before{content:"";position:absolute;inset:0;z-index:1;pointer-events:none;
background:linear-gradient(180deg,rgba(32,36,42,.24) 0,rgba(32,36,42,0) 52%)}
.lineCard[data-k="fujing"] .lcArt::before{background:linear-gradient(180deg,rgba(77,107,87,.3),rgba(77,107,87,0) 58%)}
.lineCard[data-k="keban"] .lcArt::before{background:linear-gradient(180deg,rgba(38,69,111,.3),rgba(38,69,111,0) 58%)}
.lineCard[data-k="minjian"] .lcArt::before{background:linear-gradient(180deg,rgba(143,106,48,.3),rgba(143,106,48,0) 58%)}
.lineCard[data-k="suozhang"] .lcArt::before{background:linear-gradient(180deg,rgba(168,57,44,.3),rgba(168,57,44,0) 58%)}
.startScreen .lineArt{transition:filter .2s,opacity .2s,transform .32s ease}
.startScreen .lineCard:hover .lineArt{transform:scale(1.05)}
/* 621–1399 固定两列：绕开 v46 在 ≤860 强制单列的 !important，免得立绘被拉成一条超宽横幅 */
@media (min-width:621px) and (max-width:1399px){
.startScreen .lineCards{grid-template-columns:repeat(2,1fr) !important}
}
/* ============ v105 · 现场僵持（NEG）：激动度计 + 时限进度 + 场景警戒色调 ============ */
.dockBtn.neg .dockIcon{background:linear-gradient(180deg,#a8432c,#6f2a1c)}
.dockBtn.neg{border-color:rgba(168,67,44,.42)}
/* 时限条：越往后越红，压在激动度条下面当"还剩多少" */
.negTime{position:relative;height:5px;border-radius:3px;background:rgba(32,36,42,.12);margin-top:8px;overflow:hidden}
.negTime i{display:block;height:100%;width:0;
background:linear-gradient(90deg,var(--bamboo),var(--ochre) 62%,var(--cinnabar));transition:width .3s}
.sceneInk.tone-alert{background:
radial-gradient(120% 90% at 78% 8%,rgba(168,67,44,.30),rgba(168,67,44,0) 58%),
radial-gradient(90% 70% at 12% 92%,rgba(38,69,111,.22),rgba(38,69,111,0) 62%),
linear-gradient(160deg,rgba(28,30,36,.5),rgba(74,34,28,.44))}
.sceneBox:has(.sceneInk.tone-alert){filter:saturate(.72) contrast(1.08) hue-rotate(-12deg)}
/* 激动度冲到临界（≥80）时那条 bar 发抖，提醒玩家这一步就是激化边缘 */
.warnMeter .bar.hard.crit b{animation:negCrit .9s infinite}
@keyframes negCrit{0%,100%{transform:translateX(0)}50%{transform:translateX(1.5px)}}
/* ============ v108 · 舆情（MEDIA）：值班页温度计 + 素材条 ============ */
.dockBtn.yq .dockIcon{background:linear-gradient(180deg,#6b4a7a,#3d2a4d)}
.dockBtn.yq{border-color:rgba(107,74,122,.42)}
.mediaStrip{display:flex;align-items:center;gap:9px;flex-wrap:wrap;margin-top:9px;padding:8px 11px;cursor:pointer;
border:1px solid rgba(32,36,42,.16);border-left-width:3px;border-radius:3px;
background:linear-gradient(180deg,rgba(250,246,236,.96),rgba(236,228,209,.9));transition:.16s}
.mediaStrip:hover{transform:translateY(-1px);box-shadow:0 6px 16px rgba(40,34,24,.14)}
.mediaStrip.m-hot{border-left-color:var(--cinnabar);background:linear-gradient(180deg,rgba(252,238,232,.96),rgba(240,214,204,.9))}
.mediaStrip.m-warn{border-left-color:var(--ochre)}
.mediaStrip.m-ok{border-left-color:var(--bamboo)}
.mqIco{flex:0 0 auto;width:20px;height:20px;border-radius:50%;display:flex;align-items:center;justify-content:center;
font-family:var(--hei);font-size:11.5px;font-weight:700;color:#fdf6ea;background:#3d434b}
.mediaStrip.m-hot .mqIco{background:var(--cinnabar)}
.mqName{font-family:var(--hei);font-size:13px;font-weight:700;letter-spacing:1px;color:var(--ink)}
.mqStage{font-family:var(--hei);font-size:11.5px;font-weight:700;color:var(--police);
background:rgba(38,69,111,.1);padding:1px 7px;border-radius:2px}
.mqBar{flex:1 1 90px;min-width:70px;height:7px;border-radius:4px;background:rgba(32,36,42,.14);overflow:hidden}
.mqBar i{display:block;height:100%;background:linear-gradient(90deg,var(--ochre),var(--cinnabar))}
.mqNum{font-family:var(--mono);font-size:13px;font-weight:700;color:var(--cinnabar);min-width:22px;text-align:right}
.mqLeft,.mqMat{font-family:var(--hei);font-size:11.5px;color:var(--ink3)}
.mqMat{flex:1 1 100%;color:var(--ink3);border-top:1px dashed rgba(32,36,42,.14);padding-top:4px}
.matRow{display:flex;flex-wrap:wrap;gap:8px 14px;font-family:var(--hei);font-size:12px;color:var(--ink2);
padding:7px 10px;background:rgba(32,36,42,.05);border-radius:2px}
.matRow .matScore{margin-left:auto;font-weight:700;color:var(--police)}
.doc.red .negTime{background:rgba(255,255,255,.16)}
/* ============ v110 · 年度考评季（PERF）：评查逐卷表 + 三项评定行 ============ */
.dockBtn.pf .dockIcon{background:linear-gradient(180deg,#2f5470,#1c3346)}
.dockBtn.pf{border-color:rgba(47,84,112,.42)}
.pfRow{display:grid;grid-template-columns:96px 54px minmax(0,1fr) auto;align-items:center;gap:4px 12px;
padding:9px 11px;border-bottom:1px dashed var(--line);font-family:var(--hei)}
.pfRow:last-child{border-bottom:0}
.pfRow .pfK{font-size:13px;font-weight:700;color:var(--ink);letter-spacing:1px}
.pfRow .pfV{font-family:var(--mono);font-size:15px;font-weight:700;color:var(--police);text-align:right}
.pfRow .pfTip{font-size:11.5px;color:var(--ink3);line-height:1.7}
.pfTotal{display:flex;align-items:baseline;gap:10px;margin:10px 0 2px;padding:8px 11px;
border:1px solid rgba(32,36,42,.18);border-left:3px solid var(--ochre);background:rgba(250,246,236,.7)}
.pfTotal span{font-family:var(--hei);font-size:11.5px;color:var(--ink3)}
.pfTotal b{margin-left:2px;font-family:var(--mono);font-size:24px;font-weight:700;line-height:1}
.pfTotal span+span{margin-left:auto}
.pfCase{display:flex;flex-wrap:wrap;align-items:center;gap:6px 10px;padding:8px 10px;
border:1px solid rgba(32,36,42,.13);border-radius:2px;background:rgba(255,255,255,.42);margin-bottom:7px}
.pfCase .pfName{font-family:var(--serif);font-size:13px;font-weight:700;color:var(--ink);min-width:96px}
.pfDim{font-family:var(--mono);font-size:11.5px;color:var(--ink2);padding:1px 7px;border-radius:2px;
background:rgba(32,36,42,.07);border-bottom:2px solid rgba(32,36,42,.2)}
.pfDim.ok{color:#2b5a3d;background:rgba(77,107,87,.14);border-bottom-color:var(--bamboo)}
.pfDim.bad{color:#7d2f20;background:rgba(168,57,44,.13);border-bottom-color:var(--cinnabar)}
.pfSum{margin-left:auto;font-family:var(--mono);font-size:16px;font-weight:700;color:var(--ink)}
.pfCase .btn-sm{margin-left:6px}
@media (max-width:640px){
.pfRow{grid-template-columns:88px 44px auto;row-gap:2px}
.pfRow .pfTip{flex-basis:100%;grid-column:1 / -1;order:5}
.pfCase .pfName{min-width:0;flex:1 1 100%}
}
/* ============ v111 · 管控台账（CONTROL）：在册一行一条，风险与到期日同屏 ============ */
.dockBtn.ctl .dockIcon{background:linear-gradient(180deg,#7a5c40,#3f2e20)}
.dockBtn.ctl{border-color:rgba(122,92,64,.42)}
.ctlSum{display:flex;flex-wrap:wrap;gap:6px 18px;margin:10px 0 2px;padding:8px 11px;font-family:var(--hei);
font-size:12px;color:var(--ink3);border:1px solid rgba(32,36,42,.15);border-radius:2px;background:rgba(255,255,255,.4)}
.ctlSum b{font-family:var(--mono);font-size:15px;color:var(--ink);margin-left:3px}
.ctlTotal{font-family:var(--hei);font-size:12px;color:var(--ink2);margin:9px 0 2px;padding:7px 10px;
background:rgba(32,36,42,.05);border-left:3px solid #7a5c40;border-radius:2px}
.ctlTotal b{font-family:var(--mono);font-size:19px;margin:0 2px}
.ctlRow{display:grid;grid-template-columns:26px minmax(0,1fr) 92px 30px 66px;align-items:center;gap:4px 10px;
padding:8px 10px;cursor:pointer;border-bottom:1px dashed var(--line);font-family:var(--hei);transition:background .15s}
.ctlRow:hover{background:rgba(122,92,64,.08)}
.ctlRow:last-child{border-bottom:0}
.ctlKind{width:26px;height:26px;display:flex;align-items:center;justify-content:center;border-radius:50%;
font-size:12px;font-weight:700;color:#f6efe1;background:rgba(32,36,42,.68)}
.ctlRow.lv-3 .ctlKind{background:var(--cinnabar)}
.ctlRow.lv-2 .ctlKind{background:var(--ochre)}
.ctlRow.lv-1 .ctlKind{background:var(--bamboo)}
.ctlName{font-size:13px;color:var(--ink);line-height:1.55;min-width:0;overflow-wrap:anywhere}
.ctlTag{font-size:11.5px;color:var(--ink3);background:rgba(32,36,42,.08);padding:0 5px;border-radius:2px;white-space:nowrap}
.ctlTag.dim{opacity:.62}
.ctlBar{height:7px;border-radius:4px;background:rgba(32,36,42,.13);overflow:hidden}
.ctlBar i{display:block;height:100%;background:linear-gradient(90deg,var(--bamboo),var(--ochre))}
.ctlBar.hard i{background:linear-gradient(90deg,var(--ochre),var(--cinnabar))}
.ctlBar.hard.crit i{animation:ctlPulse 1.6s infinite}
@keyframes ctlPulse{0%,100%{opacity:1}50%{opacity:.62}}
.ctlNum{font-family:var(--mono);font-size:15px;font-weight:700;color:var(--ink);text-align:right}
.ctlRow.lv-3 .ctlNum{color:var(--cinnabar)}
.ctlDue{font-size:11.5px;color:var(--ink2);text-align:right;white-space:nowrap}
.ctlDue.dim{color:var(--ink3)}
.ctlDue.bad{font-weight:700;color:#fff;background:var(--cinnabar);padding:1px 6px;border-radius:2px}
@media (max-width:760px){
.ctlRow{grid-template-columns:24px minmax(0,1fr) 56px 26px 54px;gap:2px 7px;padding:8px 8px}
.ctlKind{width:24px;height:24px;font-size:11.5px}
.ctlDue{font-size:11.5px}
.ctlName{font-size:12px}
}
/* ============ v113 · 顶端 HUD：抬头线 + 身份卡 + 纸签天气 + 竖排组标属性板 ============ */
/* A · 整体：抬头朱砂线 + 纸纹 + 三区之间的手绘分栏 */
.hud{position:relative;display:flex;align-items:stretch;gap:0;padding:12px 0 11px !important;
background:linear-gradient(180deg,rgba(255,255,255,.95),rgba(243,238,226,.72)),url(../assets/art_paper_tile.webp) left top/240px repeat;
border-bottom:2px solid rgba(38,69,111,.22)}
.hud::before{content:"";position:absolute;left:0;right:0;top:0;height:3px;pointer-events:none;
background:linear-gradient(90deg,var(--cinnabar) 0 96px,rgba(38,69,111,.5) 96px,rgba(38,69,111,.16) 340px,rgba(38,69,111,.06) 100%)}
.hudL{flex:0 1 auto;gap:12px !important;padding:0 18px 0 24px;min-width:0;max-width:330px}
.hudC{flex:0 0 auto;padding:0 12px;border-left:1px solid var(--line);text-align:left;min-width:0}
.hudR{flex:1 1 auto;padding:0 24px 0 12px;border-left:1px solid var(--line);display:flex;align-items:center;min-width:0}
/* B · 身份卡：印章压角 + 立绘描框 + 三行名片收紧 */
.hudL .seal{position:relative;z-index:2;margin-right:-19px !important;
width:30px !important;height:30px !important;flex-basis:30px !important;font-size:13px !important;
background:linear-gradient(180deg,#b8452f,#7d2a1d);border:1px solid rgba(250,246,236,.55);border-radius:3px;
box-shadow:0 2px 5px rgba(125,42,29,.4)}
.hudL .seal::after{opacity:.34}
.hudPortrait{width:52px !important;height:52px !important;flex-basis:52px !important;object-fit:cover;
border:1px solid rgba(32,36,42,.3);border-radius:2px;background:var(--paper2);
box-shadow:inset 0 0 0 2px rgba(255,255,255,.45),0 1px 5px rgba(40,34,24,.2)}
.hudName{font-size:17px !important;gap:7px !important;align-items:baseline}
.hudName b{font-size:17px !important;letter-spacing:2px}
.hudRank{margin-top:2px !important;font-size:12px !important;letter-spacing:.5px}
.hudMoney{margin-top:2px !important;font-size:12px !important;font-family:var(--mono);color:var(--ochre)}
.hudL .chip{font-size:11.5px !important;padding:1px 7px !important;border-radius:2px;
color:var(--police);background:rgba(38,69,111,.08);border-color:rgba(38,69,111,.24)}
/* C · 抬头与时速拨盘：天气做成一条不许折行的纸签 */
.clockRow{gap:9px;flex-wrap:nowrap;justify-content:flex-start;row-gap:3px}
.hudC .clock{font-size:18px !important;letter-spacing:1px !important;padding:0 0 0 8px !important;
border-left:3px solid var(--cinnabar);background:none}
.clock{white-space:nowrap}
.wxChip{display:inline-flex;align-items:center;gap:4px;white-space:nowrap;vertical-align:middle;
margin-left:0 !important;padding:2px 8px;border-radius:2px;font-size:11.5px !important;letter-spacing:.5px;line-height:1.5;
color:var(--ink2);background:linear-gradient(180deg,rgba(251,246,234,.95),rgba(239,230,211,.9));
border:1px solid var(--line);border-left:2px solid var(--ink3)}
.wxChip::before{content:"◦";font-size:13px;line-height:1;opacity:.8}
.wxChip.clear{border-left-color:var(--bamboo);color:var(--bamboo)}
.wxChip.clear::before{content:"◦"}
.wxChip.warn{border-left-color:var(--ochre);color:var(--ochre)}
.wxChip.warn::before{content:"☀"}
.wxChip.bad{border-left-color:#3a5a7a;color:#345272}
.wxChip.bad::before{content:"❄"}
.dutyChip{margin-left:0 !important;padding:2px 7px !important;border-radius:2px;font-size:11.5px !important;letter-spacing:1.5px !important}
.speed{margin-top:5px !important;gap:7px !important;justify-content:flex-start}
.spMain{width:30px !important;height:26px !important;border-radius:2px !important;box-shadow:0 1px 3px rgba(38,69,111,.3) !important}
.spMain::before{font-size:12px !important;letter-spacing:-1.5px !important}
.spMain.on::before{font-size:11.5px !important;padding-left:1px !important;letter-spacing:0 !important}
.spGroup{padding:2px !important;gap:2px !important;border-radius:2px;background:rgba(255,255,255,.72)}
.spGroup .spBtn{width:31px !important;height:22px !important;border-radius:2px !important;font-size:11.5px !important}
.spSkip{height:26px !important;padding:0 9px !important;border-radius:2px !important;font-size:11.5px !important}
/* D · 属性板：竖排组标 + 单行读数，条子吃满剩余宽度、数值右栏对齐 */
.hudStats{display:flex;flex-direction:column;gap:6px;min-width:0;width:100%}
.stGrp{display:flex !important;align-items:center;gap:7px;min-width:0;
padding:4px 8px 4px 4px;border:1px solid rgba(32,36,42,.11);border-radius:2px;
background:linear-gradient(180deg,rgba(255,255,255,.7),rgba(243,238,226,.42))}
.stCap{display:flex !important;flex:0 0 auto;align-items:center;justify-content:center;
writing-mode:vertical-rl;text-orientation:upright;letter-spacing:2px;padding:1px 2px 1px 4px !important;
border-right:0 !important;border-left:2px solid var(--police);
font-size:11.5px;line-height:1.1;color:var(--ink3)}
.stGrp:nth-child(2) .stCap{border-left-color:var(--ochre)}
.mtr{flex:1 1 0;min-width:0;display:grid !important;grid-template-columns:24px minmax(0,1fr) 24px !important;
align-items:center;gap:4px !important;padding:1px 2px;border-radius:2px}
.mtr:hover{background:rgba(38,69,111,.07)}
.hLbl{font-size:11.5px !important;letter-spacing:.5px}
.hNum{font-size:12px !important}
.hMeter{height:7px;min-width:26px}
/* E · 断点：窄屏收分栏；读数始终一行到底，≤700 才折成两列 */
@media (max-width:1180px){
.stGrp{gap:6px}
.mtr{gap:4px !important;padding:1px 2px}
.hudR{padding-right:16px}
.hudL{max-width:262px}
}
@media (max-width:1000px){
.hud{flex-wrap:wrap;row-gap:8px}
.clockRow{flex-wrap:wrap}
.hudL{flex:1 1 240px;padding-right:14px;max-width:none}
.hudC{flex:1 1 240px;border-left:0;padding-left:0}
.hudR{flex:1 1 100%;order:3;border-left:0;padding:8px 0 0}
.hudStats{flex-direction:row;gap:8px;flex-wrap:wrap}
.stGrp{flex:1 1 320px}
}
@media (max-width:700px){
.hudL,.hudC,.hudR{padding-left:0;padding-right:0}
.hudC{border-top:1px solid var(--line);padding-top:7px;margin-top:2px}
.hudR{border-top:1px solid var(--line);margin-top:7px}
.stGrp{display:grid !important;grid-template-columns:auto repeat(2,minmax(0,1fr));gap:2px 8px}
.stCap{grid-row:1 / span 2}
.mtr{grid-template-columns:25px minmax(0,1fr) 24px !important;gap:5px !important}
.hudName,.hudName b{font-size:15px !important}
}
/* ============ v114 · 司法协作链（PROS）：移送 / 退查 / 公诉 / 判决 ============ */
.dockBtn.pros .dockIcon{background:linear-gradient(180deg,#31363f,#15181e)}
.dockBtn.pros{border-color:rgba(26,30,36,.46)}
.psRow{display:grid;grid-template-columns:26px minmax(0,1fr) 34px 132px 40px;align-items:center;gap:4px 9px;
padding:8px 10px;cursor:pointer;border-bottom:1px dashed var(--line);font-family:var(--hei);transition:background .15s}
.psRow:last-child{border-bottom:0}
.psRow:hover{background:rgba(32,36,42,.07)}
.psIco{width:26px;height:26px;display:flex;align-items:center;justify-content:center;border-radius:2px;
font-size:13px;font-weight:700;color:#f6efe1;background:rgba(32,36,42,.62);font-family:var(--fz)}
.psIco.daiSong{background:linear-gradient(180deg,#6b7078,#3d434b)}
.psIco.yiSong{background:linear-gradient(180deg,#4a5568,#2c3442)}
.psIco.daiShen{background:linear-gradient(180deg,#31363f,#15181e)}
.psIco.tuiZha{background:linear-gradient(180deg,var(--ochre),#5d441c)}
.psIco.qiSu{background:linear-gradient(180deg,var(--police),#16293f)}
.psIco.panJue{background:linear-gradient(180deg,var(--bamboo),#2f4636)}
.psIco.buQiSu{background:linear-gradient(180deg,#7a5c40,#3f2e20)}
.psIco.wuZui{background:linear-gradient(180deg,var(--cinnabar),#6d2118)}
.psName{font-size:13px;color:var(--ink);line-height:1.55;min-width:0;overflow-wrap:anywhere}
.psSub{font-size:11.5px;color:var(--ink3);margin-left:6px}
.psTag{font-size:11.5px;color:var(--ink2);background:rgba(143,106,48,.16);border:1px solid rgba(143,106,48,.34);
padding:0 5px;margin-left:6px;border-radius:2px;white-space:nowrap}
.psTag.bail{color:var(--cinnabar);border-color:rgba(168,57,44,.4);background:rgba(168,57,44,.1)}
.psNum{font-family:var(--mono);font-size:16px;font-weight:700;color:var(--ink);text-align:right}
.psDue{font-size:11.5px;color:var(--ink2);text-align:right;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.psDue.dim{color:var(--ink3)}
.psDue.bad{font-weight:700;color:#fff;background:var(--cinnabar);padding:1px 6px;border-radius:2px}
.psGo{font-size:11.5px;color:var(--ink3);text-align:center}
.psGo.need{color:#fff;background:var(--police);border-radius:2px;padding:1px 6px;font-weight:700}
/* 进程条 */
.psSteps{display:flex;gap:3px;margin:11px 0 2px}
.psSteps i{flex:1 1 0;min-width:0;text-align:center;font-style:normal;font-size:11.5px;letter-spacing:1px;
padding:5px 2px;border:1px solid var(--line);border-radius:2px;color:var(--ink3);background:rgba(255,255,255,.5)}
.psSteps i.done{color:var(--ink2);border-color:rgba(32,36,42,.3);background:rgba(32,36,42,.08)}
.psSteps i.cur{color:#fff;background:linear-gradient(180deg,#31363f,#15181e);border-color:#15181e;font-weight:700}
/* 分数拆解 + 风险读数 */
.psParts{display:flex;flex-wrap:wrap;gap:5px;margin:6px 0 2px}
.psPart{font-size:11.5px;font-family:var(--hei);color:var(--ink2);border:1px solid var(--line);
border-radius:2px;padding:2px 7px;background:rgba(255,255,255,.55)}
.psPart.up{color:var(--bamboo);border-color:rgba(77,107,87,.34);background:rgba(77,107,87,.09)}
.psPart.down{color:var(--cinnabar);border-color:rgba(168,57,44,.32);background:rgba(168,57,44,.07)}
.psOdds{display:flex;flex-wrap:wrap;gap:6px 20px;margin:10px 0 2px;padding:8px 11px;font-size:12px;color:var(--ink3);
font-family:var(--hei);border:1px solid rgba(32,36,42,.14);border-radius:2px;background:rgba(243,238,226,.6)}
.psOdds b{font-family:var(--mono);font-size:15px;color:var(--ink);margin-left:3px}
.lawBox.bad{background:rgba(168,57,44,.07);border-color:rgba(168,57,44,.3)}
.lawBox.bad b{color:var(--cinnabar)}
@media (max-width:760px){
.psRow{grid-template-columns:24px minmax(0,1fr) 34px 84px;gap:2px 7px;padding:8px 8px}
.psGo{display:none}
.psIco{width:24px;height:24px;font-size:12px}
.psDue{font-size:11.5px}
.psName{font-size:12px}
.psSteps i{font-size:11.5px;letter-spacing:0;padding:4px 1px}
}
/* ============ v115 · 定性处理：案情要素条 + 选项与依据对齐 ============ */
.caseFacts{display:flex;flex-wrap:wrap;gap:5px;margin:9px 0 2px}
.caseFacts .cf{font-family:var(--hei);font-size:11.5px;line-height:1.5;color:var(--ink2);
padding:3px 8px;border:1px solid var(--line);border-radius:2px;background:rgba(255,255,255,.6)}
.caseFacts .cf.warn{color:var(--cinnabar);border-color:rgba(168,57,44,.34);background:rgba(168,57,44,.07)}
.caseCard .docMeta b{font-weight:700}
@media (max-width:760px){
.caseFacts .cf{font-size:11.5px;padding:2px 7px}
}
/* ============ v117 · 现场处置：警情要素签（动作按类型生成） ============ */
.scnTags{display:flex;flex-wrap:wrap;align-items:center;gap:5px;margin:10px 0 2px}
.scnLbl{font-family:var(--hei);font-size:11.5px;color:var(--ink3);letter-spacing:1px;margin-right:2px}
.scnT{font-family:var(--hei);font-style:normal;font-size:11.5px;line-height:1.5;color:var(--ink2);
padding:2px 9px;border:1px solid rgba(38,69,111,.3);border-radius:12px;background:rgba(38,69,111,.07)}
.scnT.hard{color:#fff;background:linear-gradient(180deg,#8c3524,var(--cinnabar));border-color:var(--cinnabar);font-weight:700}
@media (max-width:760px){
.scnT{font-size:11.5px;padding:2px 8px}
}
/* =========================================================
v121 行政移送台账（XFER）—— 与 .ps* 同行式，类名不撞车
========================================================= */
.xfRow{display:grid;grid-template-columns:26px minmax(0,1fr) 34px 132px 40px;align-items:center;gap:4px 9px;
padding:9px 11px;border-bottom:1px dashed rgba(32,36,42,.14);cursor:pointer}
.xfRow:last-child{border-bottom:0}
.xfRow:hover{background:rgba(32,36,42,.07)}
.xfIco{width:26px;height:26px;display:flex;align-items:center;justify-content:center;border-radius:2px;
color:#fff;font-size:12px;font-weight:700;letter-spacing:0}
.xfIco.dai{background:linear-gradient(180deg,#6b7078,#3d434b)}
.xfIco.chaobi{background:linear-gradient(180deg,var(--ochre),#5d441c)}
.xfIco.huifu{background:linear-gradient(180deg,var(--bamboo),#2f4636)}
.xfIco.back{background:linear-gradient(180deg,var(--cinnabar),#6d2118)}
.xfIco.done{background:linear-gradient(180deg,#8c8f96,#5a5e66)}
.xfName{font-size:13px;color:var(--ink);line-height:1.55;min-width:0;overflow-wrap:anywhere}
.xfSub{font-size:11.5px;color:var(--ink3);margin-left:6px}
.xfTag{font-size:11.5px;color:var(--ink2);background:rgba(143,106,48,.16);border:1px solid rgba(143,106,48,.34);
border-radius:2px;padding:0 5px;margin-left:6px}
.xfTag.bad{color:var(--cinnabar);border-color:rgba(168,57,44,.4);background:rgba(168,57,44,.1)}
.xfNum{font-family:var(--mono);font-size:16px;font-weight:700;color:var(--ink);text-align:right}
.xfDue{font-size:11.5px;color:var(--ink2);text-align:right;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.xfDue.dim{color:var(--ink3)}
.xfDue.bad{font-weight:700;color:#fff;background:var(--cinnabar);padding:1px 6px;border-radius:2px}
.xfGo{font-size:11.5px;color:var(--ink3);text-align:center}
.xfGo.need{color:#fff;background:var(--police);border-radius:2px;padding:1px 6px;font-weight:700}
.xfStat{display:flex;flex-wrap:wrap;gap:6px 18px;margin:10px 0 2px;padding:8px 11px;font-size:12px;color:var(--ink3);
background:rgba(32,36,42,.05);border:1px solid rgba(32,36,42,.14);border-radius:3px}
.xfStat b{font-family:var(--mono);font-size:15px;color:var(--ink);margin-left:2px}
@media (max-width:760px){
.xfRow{grid-template-columns:24px minmax(0,1fr) 34px 84px;gap:2px 7px;padding:8px 8px}
.xfGo{display:none}
.xfIco{width:24px;height:24px;font-size:12px}
.xfDue{font-size:11.5px}
.xfName{font-size:12px}
.xfStat{font-size:11.5px;gap:5px 12px}
}
/* ============ v127 · 任免条件表：分组小标 + 差值提示 + 否决行 + 职级并行 ============ */
.prGrp{margin:10px 0 2px;font-size:11.5px;letter-spacing:2px;color:var(--ink3);
border-bottom:1px solid var(--line);padding-bottom:2px}
.prRows .prGrp:first-child{margin-top:2px}
.prRow .prHint{grid-column:2/4;font-size:11.5px;line-height:1.5;color:var(--ink3);opacity:.85}
.prRow.veto .prBar i{background:var(--cinnabar)}
.prRow.veto .prNum{color:var(--cinnabar);font-weight:700}
.prRow.veto .prKey{color:var(--cinnabar)}
.ladNote{display:block;font-size:11.5px;color:var(--ink3);font-family:var(--mono);letter-spacing:.3px}
/* ============ v127b · 编年册（CHRON）：人会老，案会回来 ============ */
.dockBtn.chron .dockIcon{background:linear-gradient(180deg,#5a5f57,#33373a)}
.dockBtn.chron{border-color:rgba(90,95,87,.42)}
.chronPanel{border-left:4px solid #5a5f57}
.chronMini{border-left:4px solid rgba(90,95,87,.55)}
/* 离队的人：压灰、加一道斜线，不再是"可出警"的人 */
.ptRow.gone{opacity:.62;background:linear-gradient(180deg,#f2efe7,#e8e3d8);
border-left-color:var(--ink3) !important;position:relative;overflow:hidden}
.ptRow.gone::after{content:'';position:absolute;inset:0;pointer-events:none;
background:repeating-linear-gradient(135deg,transparent 0 9px,rgba(32,36,42,.05) 9px 10px)}
.ptRow.gone .ptHead b{text-decoration:line-through;text-decoration-color:rgba(32,36,42,.35)}
.chronHow{font-size:11.5px;color:var(--ink3);font-family:var(--mono)}
.chronTie{font-size:11.5px;color:var(--ink3);line-height:1.55}
/* 编年簿里按年份排的行 */
.doc .logLine .d{font-family:var(--mono);font-size:11.5px}
/* ============ v128 · 对照台 / 继承 / 硬核档 ============ */
.dockBtn.contrast .dockIcon{background:linear-gradient(180deg,#6b4f7a,#3b2a45)}
.dockBtn.contrast{border-color:rgba(107,79,122,.45)}
/* 开局页：生涯设置条 */
.startOpts{display:flex;flex-wrap:wrap;gap:10px;align-items:stretch;justify-content:center;
margin:14px auto 0;max-width:940px;padding:11px 12px;
border:1px solid var(--line);border-left:3px solid #6b4f7a;border-radius:2px;
background:linear-gradient(180deg,rgba(255,253,247,.9),rgba(244,238,225,.75))}
.optBtn{display:flex;flex-direction:column;gap:3px;flex:1 1 220px;min-width:200px;
padding:8px 12px;border:1px solid rgba(107,79,122,.4);border-radius:2px;
background:linear-gradient(180deg,#f7f2fa,#eee7f3);cursor:pointer;text-align:left;
font-family:var(--serif);transition:background .15s}
.optBtn:hover{background:linear-gradient(180deg,#fbf7fd,#f0e9f5)}
.optBtn b{font-size:14px;color:#3b2a45;letter-spacing:1px}
.optBtn span{font-size:11.5px;color:var(--ink3);font-family:var(--hei);line-height:1.5}
.optChk{display:flex;flex-direction:column;gap:3px;flex:1 1 200px;min-width:180px;padding:8px 12px;
border:1px solid var(--line);border-radius:2px;background:rgba(255,255,255,.55);cursor:pointer}
.optChk b{font-size:13px;color:var(--ink2);letter-spacing:.5px}
.optChk input{position:absolute;opacity:0;width:0;height:0}
.optChk input:checked + b{color:var(--cinnabar)}
.optChk:has(input:checked){border-color:rgba(200,60,60,.45);background:rgba(200,60,60,.05)}
.optChk:has(input:disabled){opacity:.5;cursor:not-allowed}
.optHint{font-size:11.5px;color:var(--ink3);font-family:var(--hei);line-height:1.5}
.hardHint{border-left:3px solid var(--cinnabar)}
/* 对照台：案子 × 四线格子 */
.ctPanel{border-left:4px solid #6b4f7a}
.ctList{display:flex;flex-direction:column;gap:9px;margin:9px 0 4px}
.ctCase{background:rgba(255,255,255,.62);border:1px solid var(--line);border-radius:2px;padding:9px 11px}
.ctCaseHead{display:flex;align-items:baseline;gap:9px}
.ctCaseHead b{font-family:var(--serif);font-size:14px}
.ctGrade{font-size:11.5px;padding:1px 7px;border-radius:8px;background:var(--police);color:#fff;font-family:var(--mono)}
.ctN{margin-left:auto;font-size:11.5px;color:var(--ink3);font-family:var(--mono)}
.ctWhy{font-size:12px;color:var(--ink2);line-height:1.6;margin:5px 0 8px;font-family:var(--hei)}
.ctCells{display:grid;grid-template-columns:repeat(4,1fr);gap:6px}
.ctCell{font-family:var(--mono);font-size:13px;padding:7px 0;border-radius:2px;cursor:pointer;
border:1px solid var(--line);background:rgba(255,255,255,.7);color:var(--ink3)}
.ctCell:hover{border-color:#6b4f7a;color:#6b4f7a}
.ctCell.on{background:linear-gradient(180deg,#f0e9f5,#e4d9ec);border-color:rgba(107,79,122,.5);color:#3b2a45;font-weight:700}
/* 四线对比表 */
.ctTable{margin:6px 0 4px;border:1px solid var(--line);border-radius:2px;overflow:hidden;background:rgba(255,255,255,.6)}
.ctHead,.ctRow{display:grid;grid-template-columns:76px repeat(4,1fr);gap:0;align-items:stretch}
.ctHead{background:linear-gradient(180deg,#f2ecf6,#e8dfe9);border-bottom:1px solid var(--line)}
.ctHead .ctK{font-family:var(--serif);font-size:12px;color:#3b2a45;padding:8px 9px}
.ctHead .ctC{font-size:12px;text-align:center;padding:8px 4px;color:#3b2a45;font-family:var(--hei);border-left:1px solid var(--line)}
.ctRow{border-bottom:1px solid rgba(32,36,42,.07)}
.ctRow:last-child{border-bottom:0}
.ctRow:nth-child(odd){background:rgba(32,36,42,.022)}
.ctRow .ctK{font-size:11.5px;color:var(--ink3);padding:7px 9px;font-family:var(--hei)}
.ctRow .ctC{font-size:12px;text-align:center;padding:7px 4px;border-left:1px solid rgba(32,36,42,.07);
font-family:var(--mono);color:var(--ink2);line-height:1.45}
.ctOk{color:var(--bamboo);font-weight:600}
.ctBad{color:var(--cinnabar);font-weight:600}
.ctNa{color:var(--ink3);opacity:.55}
/* ============ v128 · 今日要办 + 分年解锁（空组收起）+ 声音开关 ============ */
.todayBox{margin:0 0 10px;padding:9px 12px;font-size:12px;
border:1px solid var(--line);border-left:3px solid var(--ochre);background:rgba(143,106,48,.055)}
.todayBox.idle{border-left-color:var(--bamboo)}
.todayHead{display:flex;justify-content:space-between;align-items:baseline;gap:10px;
font-family:var(--kai);letter-spacing:2px;font-size:13px;color:var(--ochre)}
.todayN{font-family:var(--mono);font-size:11.5px;letter-spacing:0;color:var(--ink3)}
.todayLine{display:flex;gap:8px;align-items:baseline;margin-top:7px;color:var(--ink2);cursor:pointer}
.todayLine b{color:var(--ink)}
.todayLine:hover .tk{background:var(--police);color:#fff;border-color:var(--police)}
.tk{flex:0 0 auto;font-size:11.5px;line-height:1.6;padding:0 5px;color:var(--ink3);
border:1px solid var(--line);border-radius:2px}
.todayLine.hot .tk{color:#fff;background:var(--cinnabar);border-color:var(--cinnabar)}
.todayFoot{margin-top:9px;padding-top:6px;font-size:11.5px;color:var(--ink3);border-top:1px dashed var(--line)}
.dockGrp.emptyGrp{display:none}
.spSfx.off{opacity:.42}
/* ===== v130 机关序列 / 考察期 / 起始页天花板 ===== */
.ageCeil{margin-top:7px;font-size:11.5px;line-height:1.62;color:var(--ink3)}
.ageCeil b{color:var(--police);font-weight:600}
.orgSum{margin:6px 0 10px;font-size:12px;color:var(--ink2);padding:7px 9px;
background:var(--paper2);border-left:2px solid var(--police)}
.orgKpis{display:grid;grid-template-columns:1fr;gap:8px;margin:8px 0 2px}
.orgKpi{padding:6px 8px 7px;border:1px solid var(--line);background:rgba(255,255,255,.34)}
.orgKpiHead{display:flex;justify-content:space-between;align-items:baseline;font-size:12px;color:var(--ink)}
.orgKpiHead b{font-weight:600}
.orgKpi .orgSub{margin-top:3px}
.orgSub{font-size:11.5px;color:var(--ink3);line-height:1.6}
.orgRow{display:grid;grid-template-columns:1fr auto;gap:10px;align-items:center;
padding:9px 0;border-top:1px dashed var(--line)}
.orgRow:first-child{border-top:none}
.orgMain{font-size:13px;color:var(--ink2);line-height:1.66}
.orgMain b{color:var(--police);font-weight:600}
.orgBtns{display:flex;gap:6px;flex-wrap:wrap;justify-content:flex-end}
.orgBtns .act{min-width:118px;margin:0}
.orgLog{margin-top:10px;padding-top:8px;border-top:1px dashed var(--line);max-height:190px;overflow:auto}
.kcDoc{border-left:3px solid var(--ochre)}
.kcBox .docTitle{color:var(--ochre)}
.kcRow{display:grid;grid-template-columns:22px 1fr auto;gap:8px;align-items:center;
padding:5px 0;font-size:12px;color:var(--ink2);border-bottom:1px dotted var(--line)}
.kcRow:last-of-type{border-bottom:none}
.kcN{display:inline-flex;align-items:center;justify-content:center;width:19px;height:19px;
font-size:11.5px;color:#fff;background:var(--ink3)}
.kcName{line-height:1.55}
.zjGain{margin:8px 0 2px;font-size:12px;color:var(--ink2);line-height:1.9}
.zjGain .tk{margin-right:5px}
/* ===== v134 dock 未开门的影子行 ===== */
.dockGhost{grid-column:1/-1;margin-top:1px;padding:5px 7px;
font-size:11.5px;line-height:1.5;color:var(--ink3);cursor:pointer;
border:1px dashed rgba(63,58,48,.28);background:rgba(255,252,244,.42)}
.dockGhost:hover{color:var(--ink2);border-color:rgba(63,58,48,.5);background:rgba(255,252,244,.8)}
.leftDock.rail .dockGhost{font-size:0;padding:4px 0;letter-spacing:0}
.leftDock.rail .dockGhost::after{content:'…';font-size:12px}
/* ===== v137 系统插图 + 面板内容区分 ===== */
.art.org{background-image:url(../assets/art_org.webp)}
.art.kaocha{background-image:url(../assets/art_kaocha.webp)}
.art.rep{background-image:url(../assets/art_rep.webp)}
.art.plan{background-image:url(../assets/art_plan.webp)}
.art.quest{background-image:url(../assets/art_quest.webp)}
.art.chron{background-image:url(../assets/art_chron.webp)}
.art.contrast{background-image:url(../assets/art_contrast.webp)}
.art.audit{background-image:url(../assets/art_audit.webp)}
.art.rights{background-image:url(../assets/art_rights.webp)}
.art.hospital{background-image:url(../assets/art_hospital.webp)}
.art.bank{background-image:url(../assets/art_bank.webp)}
.art.shop{background-image:url(../assets/art_shop.webp)}
.art.case{filter:saturate(.82) contrast(1.02)}
/* 案卷列表里的横条插图：既是缩略图，也标出案件等级 */
.caseStrip{height:52px;margin:7px 0 2px;background:center/cover no-repeat;position:relative;
border:1px solid var(--line);border-left:3px solid var(--cinnabar);border-radius:2px;overflow:hidden}
.caseStrip::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(243,238,226,.72),rgba(243,238,226,0) 62%)}
.caseStripTag{position:absolute;left:7px;bottom:5px;z-index:1;font-family:var(--hei);font-size:11.5px;
letter-spacing:1px;color:var(--ink2);background:rgba(243,238,226,.82);padding:1px 5px;border:1px solid var(--line)}
/* ---------- 内容区分：同一张纸里，五类内容各归各的视觉通道 ---------- */
/* 文书正文：左侧一条细线，读作"这是材料里的话" */
.docBody{padding-left:10px;border-left:2px solid rgba(32,36,42,.13)}
/* 法条与口径：蓝底虚线之外，再压一枚"法"字角标 */
.lawBox{position:relative;padding-left:30px;border-left:3px solid rgba(38,69,111,.42)}
.lawBox::before{content:"法";position:absolute;left:9px;top:9px;width:15px;height:15px;line-height:15px;text-align:center;
font-family:var(--kai);font-size:11.5px;color:var(--police);border:1px solid rgba(38,69,111,.42);border-radius:50%}
.lawBox.bad::before{color:var(--cinnabar);border-color:rgba(168,57,44,.45)}
/* 日志流：等宽日期之外，整块压深一档底色，与叙述分开 */
.logLine{padding-left:8px;border-left:1px solid transparent}
.logLine:hover{background:rgba(32,36,42,.035)}
/* 数据区：统计格与指标条走冷灰底，一眼看出"这是数" */
.grid4,.stat,.orgKpis,.kcBox .kcRow{background:rgba(38,69,111,.035)}
.stat{border:1px solid rgba(38,69,111,.14)}
/* 操作区：按钮组与上方内容之间加一条实线，避免"看着像正文" */
.acts{margin-top:12px;padding-top:10px;border-top:1px solid rgba(32,36,42,.14)}
/* 分区标题带类别：sectTitle[data-kind] 由 UI.modal 按词面自动打标，色条跟着内容性质走 */
.sectTitle[data-kind="data"]::before{background:var(--police)}
.sectTitle[data-kind="law"]::before{background:var(--ochre)}
.sectTitle[data-kind="log"]::before{background:var(--bamboo)}
.sectTitle[data-kind="risk"]::before{background:var(--cinnabar)}
.sectTitle[data-kind="people"]::before{background:#6b4a7a}
.sectTitle[data-kind="paper"]::before{background:var(--ink3)}
/* ============ v139 · 辖区俯瞰图（map.js 程序化 SVG） ============ */
.dockBtn.map .dockIcon{background:linear-gradient(180deg,#6b7c94,#3d4f6b)}
.dockBtn.map{border-color:rgba(61,79,107,.4)}
.mapBox{margin:10px 0 12px;border:1px solid var(--line);background:
linear-gradient(180deg,var(--paper),var(--paper2));box-shadow:var(--shadow);padding:0}
.mapHead{display:flex;flex-wrap:wrap;align-items:baseline;gap:8px 10px;
padding:7px 11px;border-bottom:1px solid var(--line);background:rgba(38,69,111,.05)}
.mapHead>b{font-family:var(--kai);font-size:14px;letter-spacing:2px;color:var(--police)}
.mapN{font-family:var(--mono);font-size:11.5px;color:var(--ink2)}
.mapTip{font-size:11.5px;color:var(--ink3);margin-left:auto}
.mapSvg{display:block;width:100%;height:auto;aspect-ratio:1000/560;touch-action:manipulation}
/* 底与地形 */
.mPaper{fill:#efe8da}
.mapSvg.dark .mPaper{fill:#dcd7cc}
.mWater{fill:rgba(38,69,111,.16);stroke:rgba(38,69,111,.34);stroke-width:1.2}
.mWaterEdge{fill:none;stroke:rgba(38,69,111,.42);stroke-width:1.4;stroke-dasharray:2 5}
.mRoad path{fill:none;stroke:rgba(32,36,42,.20);stroke-width:7;stroke-linecap:round}
.mRoad path{stroke-dasharray:none}
.mPark circle{fill:rgba(77,107,87,.14);stroke:rgba(77,107,87,.3);stroke-width:.8}
.mRoadName text{fill:var(--ink3);font-size:11.5px;font-family:var(--serif);letter-spacing:1px;opacity:.75}
.mMeta{fill:var(--ink3);font-size:12px;font-family:var(--mono);opacity:.85}
/* 昼夜与天气 */
.mNight{fill:#1d2a3f;opacity:.30;pointer-events:none}
.mDusk{fill:#8f6a30;opacity:.10;pointer-events:none}
.mapSvg.wet .mRoad path{stroke:rgba(32,36,42,.30)}
.mRain line{stroke:rgba(38,69,111,.5);stroke-width:1.1;animation:mFall 1.1s linear infinite}
.mSnow circle{fill:rgba(255,255,255,.86);stroke:rgba(38,69,111,.2);animation:mDrift 4.4s ease-in-out infinite}
.mFog rect{fill:rgba(240,240,236,.34);animation:mFog 9s ease-in-out infinite alternate}
@keyframes mFall{from{transform:translateY(-40px)}to{transform:translateY(600px)}}
@keyframes mDrift{0%{transform:translate(0,0)}50%{transform:translate(-14px,90px)}100%{transform:translate(6px,190px);opacity:.2}}
@keyframes mFog{from{opacity:.24}to{opacity:.5}}
/* 地点：一块水墨瓦片贴在坐标上，名字压在瓦片下 */
.mNode{cursor:pointer}
.mTileG{isolation:isolate;transition:transform .16s ease,filter .35s ease,opacity .35s ease}
.mMat{fill:#f4efe3}
.mTile{mix-blend-mode:multiply}
.mFrame{fill:none;stroke:rgba(32,36,42,.40);stroke-width:1;transition:transform .16s ease,stroke .25s ease}
.mNode .mShape{transition:transform .16s ease}
.mNode:hover .mTileG,.mNode:hover .mFrame,.mNode:hover .mShape{transform:translateY(-3px)}
.mNode:hover .mFrame{stroke:var(--police)}
.mNode:hover .mLbl{fill:var(--police)}
.mLbl{fill:var(--ink2);font-size:12px;font-family:var(--serif);text-anchor:middle;pointer-events:none}
.mSub{fill:var(--ink3);font-size:11.5px;font-family:var(--serif);text-anchor:middle;pointer-events:none}
.mNode.mYou .mLbl{fill:var(--cinnabar);font-weight:700}
.mNode.mYou .mFrame{stroke:var(--cinnabar);stroke-width:1.5}
/* 夜里：整块瓦片压暗，只留警灯与霓虹亮着 */
.mNode.lit .mTileG{filter:brightness(.82) saturate(.68)}
.mNode.lit .mFrame{stroke:rgba(232,181,106,.5)}
.mHalo{fill:none;stroke:var(--cinnabar);stroke-width:1.4;stroke-dasharray:5 6;
animation:mMarch 3.6s linear infinite}
@keyframes mMarch{to{stroke-dashoffset:-22}}
/* 会闪的那几点：警灯与霓虹（底图交给素材） */
.mNeon{fill:rgba(168,57,44,.55);stroke:var(--cinnabar);stroke-width:.9;animation:mNeon 2.6s ease-in-out infinite}
.mNeon.v{fill:rgba(38,69,111,.4);stroke:var(--police);animation-delay:.9s}
.mNode.lit .mNeon{fill:rgba(168,57,44,.85)}
@keyframes mNeon{0%,100%{opacity:.45}50%{opacity:1}}
/* 警灯 / 警车 / 路线 */
.mBeacon{stroke:rgba(255,255,255,.5);stroke-width:.6}
.mBeacon.r{fill:var(--cinnabar);animation:mBlink 1.4s steps(1,end) infinite}
.mBeacon.b{fill:var(--police);animation:mBlink 1.4s steps(1,end) .7s infinite}
@keyframes mBlink{0%,49%{opacity:1}50%,100%{opacity:.15}}
.mCar{transition:transform 1.1s ease-in-out}
.mCarBody{fill:rgba(38,69,111,.85);stroke:var(--ink);stroke-width:.9}
.mCarTop{fill:rgba(240,236,224,.8);stroke:var(--ink3);stroke-width:.7}
.mRoute{fill:none;stroke:var(--cinnabar);stroke-width:1.6;stroke-dasharray:8 7;
stroke-linecap:round;opacity:.8;animation:mDash 1.1s linear infinite}
@keyframes mDash{to{stroke-dashoffset:-30}}
/* 警情闪点与角标 */
.mCall{cursor:pointer}
.mPulse{fill:none;stroke:var(--cinnabar);stroke-width:1.6;
transform-box:fill-box;transform-origin:center;animation:mPulse 1.5s ease-out infinite}
.mDot{fill:var(--cinnabar)}
.mCall.g-s .mPulse{stroke:var(--cinnabar);animation-duration:1s}
.mCall.g-s .mDot{fill:#c0392b}
.mCall.g-b .mPulse{stroke:var(--ochre)}
.mCall.g-b .mDot{fill:var(--ochre)}
.mCall.g-c .mPulse,.mCall.g-d .mPulse{stroke:var(--ink3)}
.mCall.g-c .mDot,.mCall.g-d .mDot{fill:var(--ink3)}
@keyframes mPulse{0%{transform:scale(.55);opacity:.95}75%{transform:scale(2);opacity:0}100%{transform:scale(2);opacity:0}}
.mCall:hover .mDot{fill:var(--police)}
.mBadgeG circle{fill:var(--cinnabar);stroke:#fff;stroke-width:1}
.mBadgeG text{fill:#fff;font-size:11.5px;font-family:var(--mono);text-anchor:middle}
@media (prefers-reduced-motion: reduce){
.mRain line,.mSnow circle,.mFog rect,.mBeacon,.mPulse,.mRoute,.mHalo,.mNeon,.mCar{animation:none;transition:none}
.mTileG,.mFrame,.mShape{transition:none}
}
/* ============ v140 · 辖区图配素材：瓦片 / 全景条 / 地点头图 ============ */
.mapPano{position:relative;height:118px;margin:0 0 10px;border:1px solid var(--line);border-radius:2px;
background:center/cover no-repeat;filter:saturate(.92)}
.mapPano span{position:absolute;left:10px;bottom:8px;padding:2px 8px;border-radius:2px;
background:rgba(244,239,227,.82);border:1px solid rgba(32,36,42,.22);
font-family:var(--kai);font-size:12px;letter-spacing:2px;color:var(--ink2)}
/* 全景条跟着时辰走：夜里压一层青，班次写在角标上 */
.mapPano.dark{filter:saturate(.72) brightness(.82)}
.mapPano.dark::before{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(29,42,63,.34),rgba(29,42,63,.12))}
.art.spot{height:150px;background-position:center 42%}
/* ============ v141 · 辖区脉搏：热度条 / 图例 / 指北针 / 会动的死物 ============ */
/* 瓦片下沿那根条：这块地躁不躁，一眼要看得到 */
.mHeatTrack{fill:rgba(32,36,42,.13)}
.mHeat{transition:width .5s ease}
.mHeat.h1{fill:var(--bamboo)}
.mHeat.h2{fill:var(--ochre)}
.mHeat.h3{fill:var(--cinnabar)}
.mPatted{fill:var(--police);stroke:rgba(255,255,255,.6);stroke-width:.8}
/* 指北针与比例尺：墙图该有的死东西 */
.mRose{fill:rgba(244,239,227,.5);stroke:rgba(32,36,42,.35);stroke-width:1}
.mNeedle{fill:var(--cinnabar);opacity:.85}
.mRoseN{fill:var(--ink2);font-size:11.5px;font-family:var(--kai);text-anchor:middle}
.mScaleBar{fill:none;stroke:var(--ink3);stroke-width:1.2;opacity:.8}
.mScaleTxt{fill:var(--ink3);font-size:11.5px;font-family:var(--serif);letter-spacing:1px;opacity:.85}
/* 会动的死物 */
.mWalk{fill:rgba(32,36,42,.42)}
.mWalk.w1{animation:mWalkX 34s linear infinite}
.mWalk.w2{animation:mWalkX 47s linear infinite 6s}
.mWalk.w3{animation:mWalkY 41s linear infinite 3s}
@keyframes mWalkX{from{transform:translateX(24px)}to{transform:translateX(972px)}}
@keyframes mWalkY{from{transform:translateY(30px)}to{transform:translateY(458px)}}
.mBoat{animation:mBoat 30s ease-in-out infinite alternate}
.mBoat path{fill:rgba(32,36,42,.5)}
.mMast{stroke:rgba(32,36,42,.5);stroke-width:.8;fill:none}
@keyframes mBoat{from{transform:translateX(0)}to{transform:translateX(420px)}}
.mSmoke circle{fill:rgba(120,116,104,.5);animation:mSmoke 4.2s ease-out infinite}
.mSmoke circle:nth-child(2){animation-delay:1.4s}
.mSmoke circle:nth-child(3){animation-delay:2.8s}
@keyframes mSmoke{0%{transform:translateY(0) scale(.5);opacity:.5}100%{transform:translateY(-26px) scale(1.6);opacity:0}}
/* 图例与页头脉搏 */
.mapLegend{display:flex;flex-wrap:wrap;gap:4px 14px;margin:8px 0 10px;padding:6px 10px;
border:1px solid var(--line);background:rgba(38,69,111,.04);font-size:11.5px;color:var(--ink3)}
.mapLegend>span{display:inline-flex;align-items:center;gap:5px}
.mapLegend i{display:inline-block;width:14px;height:4px;border-radius:2px;background:var(--ink3)}
.mapLegend .lgDot{width:8px;height:8px;border-radius:50%;background:var(--cinnabar)}
.mapLegend .lgBar.h1{background:var(--bamboo)}
.mapLegend .lgBar.h2{background:var(--ochre)}
.mapLegend .lgBar.h3{background:var(--cinnabar)}
.mapLegend .lgCar{width:14px;height:7px;border-radius:2px;background:rgba(38,69,111,.85)}
.mapLegend .lgSpot{width:7px;height:7px;border-radius:50%;background:var(--police)}
.mapH{font-family:var(--mono);font-size:11.5px;color:var(--ink2)}
.mapH b{color:var(--ochre)}
/* 面板里的热度行 */
.heatRow{display:flex;align-items:center;gap:8px;margin:8px 0 2px;font-size:12px;flex-wrap:wrap}
.heatLbl{color:var(--ink3);font-family:var(--kai);letter-spacing:1px}
.heatBar{flex:0 0 120px;height:7px;border-radius:4px;background:rgba(32,36,42,.12);overflow:hidden}
.heatBar>i{display:block;height:100%;border-radius:4px}
.heatBar>i.h1{background:var(--bamboo)}
.heatBar>i.h2{background:var(--ochre)}
.heatBar>i.h3{background:var(--cinnabar)}
.heatN{font-family:var(--mono);font-size:13px}
.heatNote{color:var(--ink3);font-size:11.5px;flex:1 1 100%}
.hotRows .logLine{display:flex;align-items:center;gap:8px}
.hotGo{margin-left:auto;padding:2px 9px;min-height:26px;font-size:11.5px;font-family:var(--kai);letter-spacing:1px;
border:1px solid var(--line);background:var(--paper);border-radius:2px;cursor:pointer;color:var(--ink2)}
.hotGo:hover{border-color:var(--police);color:var(--police)}
.act:disabled{opacity:.45;cursor:not-allowed}
@media (prefers-reduced-motion: reduce){
.mWalk,.mBoat,.mSmoke circle{animation:none}
.mHeat{transition:none}
}
/* ============ v148 · 赶赴屏：路上这一段裁成一条带 ============ */
/* 水墨底在上，被裁出来的那两块瓦片和车在中间，时限进度在下——三行读完一段路 */
.enBand{position:relative;margin:6px 0 10px;border:1px solid var(--line);overflow:hidden;
background:linear-gradient(180deg,var(--paper),var(--paper2));box-shadow:var(--shadow)}
.enInk{height:92px;background:center/cover no-repeat;filter:saturate(.9)}
.enInk::after{content:"";position:absolute;left:0;right:0;top:0;height:92px;
background:linear-gradient(180deg,rgba(26,30,36,.16),transparent 46%,rgba(243,238,226,.5))}
.enBand.dark .enInk{filter:saturate(.66) brightness(.82)}
.enBand.dark::before{content:"";position:absolute;inset:0;z-index:2;pointer-events:none;
background:linear-gradient(180deg,rgba(29,42,63,.34),rgba(29,42,63,.06))}
.enBand.wet .enInk{filter:saturate(.78) brightness(.95)}
.enBand.wet::after{content:"";position:absolute;inset:0;z-index:3;pointer-events:none;opacity:.5;
background:repeating-linear-gradient(104deg,rgba(38,69,111,.20) 0 1px,transparent 1px 8px)}
.enSvg{display:block;width:100%;height:138px}
.enNode{pointer-events:none}
.enMat{fill:#f4efe3}
.enTile{mix-blend-mode:multiply}
.enFrame{fill:none;stroke:rgba(32,36,42,.40);stroke-width:1}
.enLbl{fill:var(--ink2);font-size:12px;font-family:var(--serif);text-anchor:middle}
.enTo .enFrame{stroke:var(--cinnabar);stroke-width:1.6}
.enTo .enLbl{fill:var(--cinnabar);font-weight:700}
.enRoute{fill:none;stroke:var(--cinnabar);stroke-width:1.6;stroke-dasharray:8 7;
stroke-linecap:round;opacity:.75;animation:mDash 1.1s linear infinite}
.enRouteDone{fill:none;stroke:var(--police);stroke-width:2.6;stroke-linecap:round;opacity:.85}
.enCarBody{fill:rgba(38,69,111,.9);stroke:var(--ink);stroke-width:.9}
.enEta{display:flex;align-items:center;gap:8px;flex-wrap:wrap;padding:7px 11px;
border-top:1px solid var(--line);background:rgba(38,69,111,.05);font-size:12px}
.enEta>b{font-family:var(--kai);letter-spacing:1px;color:var(--ink)}
.enBar{flex:0 0 132px;height:7px;border-radius:4px;background:rgba(32,36,42,.13);overflow:hidden}
.enBar>i{display:block;height:100%;background:var(--cinnabar);border-radius:4px}
.enWay{margin-left:auto;color:var(--ink3);font-family:var(--mono);font-size:11.5px}
.enFoot{padding:5px 11px 8px;font-size:11.5px;color:var(--ink3);border-top:1px dashed var(--line)}
/* 控制段抬头那句"绕一圈看到了什么"：像一句还带着路上气味的批注 */
.enLead{margin:2px 0 10px;padding:6px 10px;border-left:3px double var(--ochre);
background:rgba(143,106,48,.07);font-size:12px;color:var(--ink2)}
@media (prefers-reduced-motion: reduce){
.enRoute{animation:none}
}
/* ============ v150 · 节律层：案头条目与欠着的时辰 ============ */
/* 案头条目不是警情：chip 用宣纸墨色，别占竹青那格（竹青=已到场在办） */
.qScene.desk{background:var(--paper3);color:var(--ink2);border:1px solid rgba(32,36,42,.26)}
.qCard.deskCard{border-left:2px solid rgba(143,106,48,.55)}
/* ============ v151 · 联动单位：叫来的那几家有钟点 ============ */
/* 队列卡上的联动标记：警青底压成灰蓝，落空/排不开才转朱砂 */
.lkChip{display:inline-block;margin-left:6px;padding:1px 6px;border-radius:9px;font-size:11.5px;line-height:1.5;
color:var(--ink2);background:rgba(63,107,87,.16);border:1px solid rgba(63,107,87,.4);vertical-align:1px}
.lkChip.bad{color:var(--cinnabar);background:rgba(168,67,44,.12);border-color:rgba(168,67,44,.45)}
/* 现场面板里独立一行的联动按钮：排在动作池之后，不动首位那颗对路动作 */
.lkRow{display:flex;flex-wrap:wrap;gap:7px;align-items:stretch;margin:10px 0 4px;
padding:8px 9px;border:1px dashed rgba(63,107,87,.42);border-radius:3px;background:rgba(63,107,87,.05)}
.lkLbl{flex:0 0 100%;font-size:11.5px;letter-spacing:1.6px;color:var(--ink3)}
.lkBtn{flex:1 1 148px;text-align:left;padding:6px 8px;font-size:12px;color:var(--ink);cursor:pointer;
background:var(--paper2);border:1px solid rgba(63,107,87,.5);border-radius:3px;transition:border-color .16s,background .16s}
.lkBtn:hover{border-color:var(--bamboo);background:var(--paper3)}
.lkUnit{flex:1 1 148px;padding:6px 8px;font-size:12px;border-radius:3px;
background:rgba(63,107,87,.12);border:1px solid rgba(63,107,87,.42);color:var(--ink2)}
.lkUnit.on{background:rgba(63,107,87,.2);border-style:solid;border-color:var(--bamboo)}
.lkUnit.bad{background:rgba(168,67,44,.1);border-color:rgba(168,67,44,.42)}
.lkUnit .need,.lkBtn .need{display:block;margin-top:2px;font-size:11.5px;color:var(--ink3)}
.lkMini{margin-left:6px;padding:1px 7px;font-size:11.5px;cursor:pointer;color:var(--cinnabar);
background:transparent;border:1px solid rgba(168,67,44,.5);border-radius:10px}
.lkMini:hover{background:rgba(168,67,44,.12)}
/* 那一句"你叫的是人，不是结论"：口径行，像附页边上的一行小字 */
.lkOwn{margin:2px 0 8px;font-size:11.5px;line-height:1.62;color:var(--ink3);
border-left:2px solid rgba(143,106,48,.4);padding-left:8px}
.dockBtn.lk{border-color:rgba(63,107,87,.42)}
.dockBtn.lk .dockIcon{background:linear-gradient(180deg,#4d7a63,#2f5544)}
/* ============ v152 · 检察监督：立案监督 + 对不起诉的复议复核 ============ */
/* 台账行沿用 .xf* 的排印，只换那一枚印章的色：监督这一栏该是什么脸色，看状态 */
.xfIco.sp_open{background:linear-gradient(180deg,#6b7078,#3d434b)}
.xfIco.sp_ask{background:linear-gradient(180deg,var(--ochre),#5d441c)}
.xfIco.sp_ntz{background:linear-gradient(180deg,var(--cinnabar),#6d2118)}
.xfIco.sp_ok{background:linear-gradient(180deg,var(--bamboo),#2f4636)}
.xfIco.sp_end,.xfIco.sp_gone{background:linear-gradient(180deg,#8c8f96,#5a5e66)}
.xfIco.sp_kai{background:linear-gradient(180deg,var(--police),#1c3346)}
.xfIco.sp_fuyi,.xfIco.sp_fuhe{background:linear-gradient(180deg,#4a6280,#26456f)}
/* 卷宗现状那一行：数字是主角，口径是脚注 */
.spNote{margin:8px 0;padding:7px 9px;font-size:12px;line-height:1.7;color:var(--ink2);
border:1px dashed rgba(38,69,111,.34);border-radius:3px;background:rgba(38,69,111,.05)}
.spNote b{color:var(--ink)}
/* PROS 详情里的那一格：窗口开着的时候得有一行能点的东西 */
.spBar{display:flex;flex-wrap:wrap;gap:8px;align-items:center;margin:2px 0 10px;padding:7px 9px;
font-size:12px;color:var(--ink2);background:rgba(143,106,48,.08);border:1px solid rgba(143,106,48,.3);border-radius:3px}
.spBar span{margin-right:4px}
.spBar b{color:var(--ink);font-family:var(--mono)}
.dockBtn.sup{border-color:rgba(143,106,48,.45)}
.dockBtn.sup .dockIcon{background:linear-gradient(180deg,#8f6a30,#5d441c)}
/* ============ v153 · 指挥台按职务交接：花名册跟着那一格走 ============ */
/* 交接之后留在机关案头上的一行小字：你交出去的那本名册 */
.cmdAlumni{margin:8px 0;padding:7px 9px;font-size:12px;line-height:1.7;color:var(--ink2);
border-left:2px solid rgba(143,106,48,.42);background:rgba(143,106,48,.06)}
/* 中队长/副所长那一格的边界：能定排班与派活，不能定钱与编制 */
.mgBound{margin:8px 0;padding:7px 9px;font-size:12px;line-height:1.7;color:var(--ink2);
border:1px dashed rgba(168,57,44,.34);border-radius:3px;background:rgba(168,57,44,.04)}
.mgBound b{color:var(--ink)}
/* ============ v154 · 执法资格等级：一张会被暂停、会被收回的纸 ============ */
.dockBtn.zf{border-color:rgba(63,107,87,.4)}
.dockBtn.zf .dockIcon{background:linear-gradient(180deg,#4d7c60,#2f4f3d)}
/* 台账首行：当前资格 + 剩余天数，一句读完 */
.zfBar{display:flex;flex-wrap:wrap;align-items:baseline;gap:7px;margin:6px 0 2px;padding:8px 10px;
border:1px solid rgba(43,43,41,.14);border-radius:3px;background:rgba(246,243,236,.6);font-size:12px;color:var(--ink2)}
.zfBar>b{font-size:15px;letter-spacing:1px;color:var(--ink)}
.zfBar>b.ok{color:var(--bamboo)}.zfBar>b.warn{color:#8f6a30}.zfBar>b.bad{color:var(--cinnabar)}
/* 哪几栏还能签：一栏一行，绿的可签、朱的落锁 */
.zfRow{display:flex;align-items:center;gap:8px;padding:5px 2px;border-bottom:1px dashed rgba(43,43,41,.1);font-size:12px}
.zfRow:last-child{border-bottom:0}
.zfK{flex:1 1 auto;color:var(--ink)}
.zfV{flex:0 0 auto;padding:1px 8px;border-radius:2px;font-size:11.5px}
.zfV.ok{background:rgba(63,107,87,.14);color:var(--bamboo)}
.zfV.no{background:rgba(168,57,44,.13);color:var(--cinnabar)}
/* 考证记录：过与未过各一枚小印章 */
.zfHist{margin-top:4px}
.zfH{display:flex;align-items:center;gap:8px;padding:4px 2px;font-size:12px;color:var(--ink2);border-bottom:1px dashed rgba(43,43,41,.08)}
.zfH>b{margin-left:auto;font-weight:400;color:var(--ink3)}
.zfH>i{font-style:normal;flex:0 0 auto;width:34px;text-align:center;border-radius:2px;font-size:11.5px}
.zfH>i.ok{background:rgba(63,107,87,.14);color:var(--bamboo)}
.zfH>i.no{background:rgba(168,57,44,.13);color:var(--cinnabar)}
/* ============ v155 · 接警单要素层（BRIEF） + 正文分角色上色（INK） ============ */
/* 接警单：贴在案情正文之前，先让人认出"这是哪一起、已知什么、还缺什么" */
.brief{margin:10px 0 8px;padding:9px 11px 10px;border:1px solid rgba(43,43,41,.15);
border-left:3px solid var(--police);border-radius:3px;
background:linear-gradient(180deg,rgba(247,244,237,.9),rgba(235,229,214,.5))}
.brief.case{border-left-color:var(--cinnabar)}
.bfHead{display:flex;flex-wrap:wrap;align-items:baseline;gap:8px;
font-family:var(--kai);font-size:12px;letter-spacing:2px;color:var(--police)}
.brief.case .bfHead{color:var(--cinnabar)}
.bfHead .bfSrc{margin-left:auto;font-family:var(--serif);font-size:11.5px;letter-spacing:.4px;color:var(--ink3)}
.bfGrid{display:grid;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));gap:0 16px;margin-top:5px}
.bfCell{display:flex;flex-wrap:wrap;align-items:baseline;gap:6px;padding:3px 0;
border-bottom:1px dashed rgba(43,43,41,.1)}
.bfCell>i{flex:0 0 auto;font-style:normal;font-size:11.5px;letter-spacing:1px;color:var(--ink3);
background:rgba(32,36,42,.05);padding:1px 6px;border-radius:2px}
.bfCell>b{flex:1 1 62%;min-width:0;font-weight:400;font-size:12px;line-height:1.72;color:var(--ink2);
word-break:break-word;text-align:justify}
.bf_ok>b{color:var(--ink)}
.bf_dim>b{color:var(--ink2)}
.bf_miss>b{color:var(--cinnabar)}
.bf_miss>i{background:rgba(168,57,44,.1);color:var(--cinnabar)}
.bfMiss{display:flex;flex-wrap:wrap;gap:7px;margin-top:8px;padding:5px 8px;
border:1px dashed rgba(43,43,41,.22);border-radius:2px;font-size:11.5px;line-height:1.7;color:var(--ink3)}
.bfMiss>i{font-style:normal;font-weight:600;color:var(--ink2);flex:0 0 auto}
.bfMiss.on{border-color:rgba(168,57,44,.42);background:rgba(168,57,44,.05);color:var(--cinnabar)}
/* 正文里的角色：一处一色。都压在水墨底子上，只加粗不放大，避免抢叙事的声音 */
[data-ik]{font-weight:600}
[data-ik="doc"]{color:var(--police)}
[data-ik="law"]{color:var(--police);border-bottom:1px dotted rgba(38,69,111,.45)}
[data-ik="time"]{font-family:var(--mono);font-size:.93em;font-weight:400;color:var(--ink2)}
[data-ik="money"]{color:var(--ochre)}
[data-ik="num"]{color:var(--ink)}
[data-ik="place"]{color:var(--bamboo)}
[data-ik="who"]{color:var(--ink);border-bottom:1px solid rgba(168,57,44,.3)}
[data-ik="quote"]{font-family:var(--kai);font-weight:400;color:var(--ink2)}
@media (max-width:760px){
.bfGrid{grid-template-columns:1fr}
.bfCell>b{flex:1 1 100%}
.bfHead .bfSrc{margin-left:0}
}
/* ============ v156 · 字面重排：界面归界面、纸面归纸面 ============
病根（本机实测，注册表里根本没有 SimSun/KaiTi/SimHei/FangSong，只有雅黑/思源/等线/MiSans）：
v86 把 --kai 定义成 var(--fz)，标题=思源宋体大字距，正文=--serif 也是宋体，
再叠上两端对齐 + 2.05 行高 + 通体灰色——那就是红头文件的排印规范，不是游戏。
这一层拆成四条通道：
① 界面（正文、按钮、台账、元信息）→ 思源黑体/MiSans/雅黑，左对齐，行高 1.85，墨色加深；
② 标题 → 思源宋体 700，字号拉大、字距收紧（大字距宋体才是公文标题）；
③ 纸上的公文（接警单、法条、卷首、meta）→ 衬线常规字重，保留"打印在纸上"的质感；
④ 数字与耗时 → 等宽 + tabular-nums，芯片化后各走一条色通道。
机器上真装了楷体/仿宋时，②③ 会自动换成楷体/仿宋——那才是文书该有的脸。
========================================================= */
:root{
--ui:"Noto Sans SC","MiSans","Microsoft YaHei","微软雅黑","PingFang SC","Hiragino Sans GB",sans-serif;
--hei:"Noto Sans SC","MiSans","Microsoft YaHei","PingFang SC",sans-serif;
--kai:"KaiTi","楷体","Noto Serif SC","Source Han Serif SC",var(--serif);
--fang:"FangSong","仿宋","Noto Serif SC","Source Han Serif SC",var(--serif);
--ink3:#5f656e;
}
body,button,input,textarea,select{font-family:var(--ui)}
/* ---- ① 界面正文：先把文件纸撤掉 ---- */
.docBody{font-family:var(--ui);font-size:15px !important;line-height:1.85;text-align:left;
color:var(--ink);letter-spacing:0.3px}
.docBody p{font-size:15px !important;line-height:1.85;text-align:left}
.docBody .em,.docBody em{font-weight:700;color:var(--cinnabar);border-bottom:0;padding:0 1px;
background:linear-gradient(transparent 64%,rgba(168,57,44,.17) 64%)}
.logLine{font-family:var(--ui);font-size:13px !important;line-height:1.78;color:var(--ink2)}
.finePrint{font-family:var(--ui);color:var(--ink3);line-height:1.8}
.mods{font-family:var(--ui);color:var(--ink3);margin-top:6px;line-height:1.95}
.need{font-family:var(--ui)}
.hintInk{font-size:14px !important;line-height:1.9;color:var(--ink2)}
.lineIntro{font-size:15px !important;line-height:1.95}
/* ---- ② 标题：大一号、字距收回来 ---- */
.mBarT,.mTitle,.docTitle,.sectTitle,.qTitle,.lifeHead,.npcHead b,.caseCard .docTitle,
.clock,.hudName b,.catName,.pName,.relTitle,.dockGrpHead,.endWrap .big,.todayHead,
.promotePanel .docTitle,.lifeBlock .docTitle{font-family:var(--kai)}
.docTitle{font-size:22px;font-weight:700;letter-spacing:1px;color:var(--ink)}
.mTitle{font-size:24px;font-weight:700;letter-spacing:1.5px}
.mBarT{font-size:20px;font-weight:700;letter-spacing:1.5px}
.sectTitle{font-size:16px !important;font-weight:700;letter-spacing:1.5px}
.qTitle{font-size:18px;font-weight:700;letter-spacing:1px;color:var(--ink);margin:1px 0 3px}
.clock{font-size:20px;font-weight:700;letter-spacing:1.5px}
.tierLine .t{font-family:var(--kai);font-size:16px}
.rowStamp{font-family:var(--kai);letter-spacing:2px}
/* ---- ③ 纸面：接警单、法条、卷首、meta 是打印在纸上的东西 ---- */
.brief,.lawBox,.caseFacts,.docMeta,.qBrief{font-family:var(--fang)}
.bfCell>b{text-align:left;font-size:13px;line-height:1.8}
.bfCell>i,.bfCell>b>b{font-family:var(--ui)}
.bfHead .bfSrc{font-family:var(--fang)}
.lawBox{font-size:13px !important;line-height:1.9}
.docMeta{font-size:12px !important;letter-spacing:.3px;color:var(--ink3)}
/* ---- ④ 元信息芯片：一行灰字拆成一排有分工的小标签 ---- */
.sg{font-style:normal;display:inline-block;padding:1px 7px;margin:2px 5px 2px 0;border-radius:2px;
background:rgba(32,36,42,.05);border:1px solid rgba(32,36,42,.09);color:var(--ink2);
font-family:var(--ui);font-size:12px;font-weight:400;letter-spacing:.2px;line-height:1.72}
.sgx{display:none}
.sg-d{color:var(--police);background:rgba(38,69,111,.08);border-color:rgba(38,69,111,.2)}
.sg-t{color:var(--ochre);background:rgba(143,106,48,.09);border-color:rgba(143,106,48,.22)}
.sg-w{color:var(--cinnabar);background:rgba(168,57,44,.08);border-color:rgba(168,57,44,.24);font-weight:600}
.sg-p{color:var(--bamboo);background:rgba(77,107,87,.1);border-color:rgba(77,107,87,.24)}
.sg-m{color:var(--cinnabar);background:rgba(168,57,44,.08);border-color:rgba(168,57,44,.22)}
.sg [data-ik]{font-family:var(--mono);font-weight:700;font-size:12px;color:inherit}
.sg b{color:inherit;font-weight:600}
/* ---- 动作按钮：一行标题、一排芯片，不再是一整段公文 ---- */
.act{font-family:var(--ui);font-size:15px !important;font-weight:600;color:var(--ink);
letter-spacing:0.2px;border-left:3px solid rgba(38,69,111,.42);padding:10px 12px}
.act > b{font-family:var(--ui);font-size:15px;font-weight:700;letter-spacing:0.2px}
.act .need,.act .effRow,.act .banQuote,.act .kitWarn,.act .sg{font-weight:400}
.act .need{font-size:12px !important;line-height:1.75;margin-top:4px}
.act:hover{transform:translateX(3px);box-shadow:0 4px 14px rgba(40,34,24,.13)}
.act.life,.act.dis{border-left-color:rgba(143,106,48,.5)}
/* ---- 队列卡：接警之前先看清在哪、谁报的、出了什么事 ---- */
.qFrom{font-family:var(--ui);font-size:11.5px !important;letter-spacing:1px;font-weight:600}
.qTimer{font-family:var(--mono);font-size:12px !important;font-weight:400}
.qBrief{display:flex;flex-wrap:wrap;gap:2px 12px;margin:1px 0 6px;
font-size:12px;line-height:1.7;color:var(--ink2)}
.qk{font-family:var(--ui);font-size:11.5px;letter-spacing:1px;color:var(--ink3);
margin-right:5px;padding-right:5px;border-right:1px solid rgba(32,36,42,.16)}
.qb_ok{color:var(--ink)}
.qb_dim{color:var(--ink3)}
.qb_miss .qk{border-right-color:rgba(168,57,44,.3)}
/* ---- 今天该做什么：任务行，不是段落 ---- */
.todayBox{font-family:var(--ui);font-size:13px;padding:10px 13px}
.todayLine{color:var(--ink3);line-height:1.75;padding:3px 5px;margin:3px -5px;border-radius:2px}
.todayLine b{font-family:var(--ui);font-size:14px;font-weight:700;color:var(--ink)}
.todayLine.hot b{color:var(--cinnabar)}
.todayLine:hover{background:rgba(38,69,111,.06)}
.todayHead{font-size:14px;letter-spacing:1.5px}
.todayFoot{font-family:var(--kai);letter-spacing:.5px}
/* 窄屏：芯片排不下就换行，正文别拉太开 */
@media (max-width:760px){
.qBrief{gap:2px 8px}
.docBody{font-size:15px !important;letter-spacing:0}
}
/* ============ v157 · 图标与 HUD 登顶：五张 4×4 水墨 sprite ============
五张图都是 1024×1024 的 4×4 网格（每格 256px），CSS 只按 --c/--r 取格：
ic_dock_a/b/c 三十六扇门的门牌纹样（含警情等级 S/B/C/D、案头、结案、判决、退查）
ic_stats 七维属性 + 时钟/存款/职级/装备/日程/目标/家/晋升
ic_weather 十二种天候 + 四季
取格公式：background-size:400% 400% 把整张图放大到四倍容器，position 每格走 100%/3。
mix-blend-mode:multiply 让宣纸底融进界面纸底，圆形 mask 把方格边吃掉——
所以图标本身不画底、不加圈，dockBtn 那张纸卡就是它的底。
========================================================= */
:root{
--ic-a:url(../assets/ic_dock_a.webp); --ic-b:url(../assets/ic_dock_b.webp);
--ic-c:url(../assets/ic_dock_c.webp); --ic-s:url(../assets/ic_stats.webp);
--ic-w:url(../assets/ic_weather.webp); --hud-band:url(../assets/hud_band.webp);
}
.dockIcon,.qIco,.hLbl::before,.wxChip::before,.hudMoney::before,.hudRank::before,.clock::before,.atmosLine::before{
background-repeat:no-repeat;background-size:400% 400%;
background-position:calc(var(--c,0) * 100% / 3) calc(var(--r,0) * 100% / 3);
mix-blend-mode:multiply;
-webkit-mask-image:radial-gradient(circle at 50% 50%,#000 58%,rgba(0,0,0,0) 79%);
mask-image:radial-gradient(circle at 50% 50%,#000 58%,rgba(0,0,0,0) 79%);
}
/* 那批 .dockBtn.xxx .dockIcon{background:linear-gradient(...)} 的老规则是简写，会把 size/position 打回 auto
—— 取格机制必须用同等特异性写在它们后面，否则 sprite 按 1024px 原尺寸铺进 30px 圆里 */
.leftDock .dockBtn .dockIcon{
background-repeat:no-repeat;background-size:400% 400%;
background-position:calc(var(--c,0) * 100% / 3) calc(var(--r,0) * 100% / 3);
}
/* ---------- ① dock 三十六扇门：字让位给纹样，标签与 title 还在 ---------- */
.dockIcon{
background-color:transparent;background-image:var(--ic-a);color:transparent;
box-shadow:none;font-size:14px;position:relative;
}
.dockBtn:hover .dockIcon{transform:scale(1.06)}
.dockIcon{transition:.15s}
.dockBtn[hidden] .dockIcon{filter:grayscale(1);opacity:.5}
/* B 张：声望/日程/目标/携装/本领/辖区/反诈/调解/医院/银行/商城/编年/对照/卷宗/任务/人脉 */
#dockRep .dockIcon,#dockPlan .dockIcon,#dockQuest .dockIcon,#dockKit .dockIcon,
#dockTal .dockIcon,#dockMap .dockIcon,#dockFraud .dockIcon,#dockMed .dockIcon,
#dockHosp .dockIcon,#dockBank .dockIcon,#dockShop .dockIcon,#dockChron .dockIcon,
#dockContrast .dockIcon,#dockTabCase .dockIcon,#dockTabJob .dockIcon,#dockTabRel .dockIcon,
#dockTabGrow .dockIcon,#dockTabLife .dockIcon,#dockTabFile .dockIcon,#dockTabLog .dockIcon{background-image:var(--ic-b)}
/* C 张：后四扇门 */
#dockTabGrow .dockIcon,#dockTabLife .dockIcon,#dockTabFile .dockIcon,#dockTabLog .dockIcon{background-image:var(--ic-c)}
/* 第一张（默认）：指挥台/保障/研判/联动/僵持/舆情/考评/管控/亲友/检法/监督/资格/机关/考察/人事/发声
—— 必须逐扇点名：那些 .dockBtn.xxx .dockIcon{background:linear-gradient(...)} 的老规则特异性比
.dockIcon 高，光靠基类会把 sprite 顶掉（[1] 抓到过 12 扇空门） */
#dockMgr .dockIcon,#dockRisk .dockIcon,#dockAnly .dockIcon,#dockLink .dockIcon,
#dockNeg .dockIcon,#dockYq .dockIcon,#dockPf .dockIcon,#dockCtl .dockIcon,
#dockKin .dockIcon,#dockPros .dockIcon,#dockSup .dockIcon,#dockZf .dockIcon,
#dockOrg .dockIcon,#dockKaocha .dockIcon,#dockStaff .dockIcon,#dockPress .dockIcon{background-image:var(--ic-a)}
#dockMgr .dockIcon{--c:0;--r:0} #dockRisk .dockIcon{--c:1;--r:0} #dockAnly .dockIcon{--c:2;--r:0} #dockLink .dockIcon{--c:3;--r:0}
#dockNeg .dockIcon{--c:0;--r:1} #dockYq .dockIcon{--c:1;--r:1} #dockPf .dockIcon{--c:2;--r:1} #dockCtl .dockIcon{--c:3;--r:1}
#dockKin .dockIcon{--c:0;--r:2} #dockPros .dockIcon{--c:1;--r:2} #dockSup .dockIcon{--c:2;--r:2} #dockZf .dockIcon{--c:3;--r:2}
#dockOrg .dockIcon{--c:0;--r:3} #dockKaocha .dockIcon{--c:1;--r:3} #dockStaff .dockIcon{--c:2;--r:3} #dockPress .dockIcon{--c:3;--r:3}
#dockRep .dockIcon{--c:0;--r:0} #dockPlan .dockIcon{--c:1;--r:0} #dockQuest .dockIcon{--c:2;--r:0} #dockKit .dockIcon{--c:3;--r:0}
#dockTal .dockIcon{--c:0;--r:1} #dockMap .dockIcon{--c:1;--r:1} #dockFraud .dockIcon{--c:2;--r:1} #dockMed .dockIcon{--c:3;--r:1}
#dockHosp .dockIcon{--c:0;--r:2} #dockBank .dockIcon{--c:1;--r:2} #dockShop .dockIcon{--c:2;--r:2} #dockChron .dockIcon{--c:3;--r:2}
#dockContrast .dockIcon{--c:0;--r:3} #dockTabCase .dockIcon{--c:1;--r:3} #dockTabJob .dockIcon{--c:2;--r:3} #dockTabRel .dockIcon{--c:3;--r:3}
#dockTabGrow .dockIcon{--c:0;--r:0} #dockTabLife .dockIcon{--c:1;--r:0} #dockTabFile .dockIcon{--c:2;--r:0} #dockTabLog .dockIcon{--c:3;--r:0}
/* ---------- ② HUD 登顶：顶部一条所里院子里的天际线 ---------- */
.hud{
background:linear-gradient(180deg,rgba(255,253,246,.93) 0%,rgba(248,243,232,.82) 58%,rgba(243,238,226,.92) 100%),
var(--hud-band) center bottom / cover no-repeat;
border-bottom:1px solid rgba(32,36,42,.2);
}
.hudRank::before,.hudMoney::before,.clock::before{
content:"";display:inline-block;width:16px;height:16px;margin-right:5px;vertical-align:-3px;flex:0 0 16px;
}
.hudRank{display:flex;align-items:center}
.hudMoney{display:flex;align-items:center}
.hudRank::before{background-image:var(--ic-s);--c:1;--r:2} /* 盾徽：这一格是什么身份 */
.hudMoney::before{background-image:var(--ic-s);--c:0;--r:2} /* 一串钱：存款 */
.clock::before{background-image:var(--ic-s);--c:3;--r:1} /* 沙漏：时辰在走 */
/* 七维属性条前面一枚小纹样 */
.hLbl{display:flex;align-items:center;gap:4px}
.hLbl::before{content:"";width:15px;height:15px;flex:0 0 15px;background-image:var(--ic-s)}
.mtr.k-jing .hLbl::before{--c:0;--r:0} .mtr.k-jk .hLbl::before{--c:1;--r:0}
.mtr.k-ya .hLbl::before{--c:2;--r:0} .mtr.k-yu .hLbl::before{--c:3;--r:0}
.mtr.k-dd .hLbl::before{--c:0;--r:1} .mtr.k-xr .hLbl::before{--c:1;--r:1}
.mtr.k-ld .hLbl::before{--c:2;--r:1}
/* 天气角标：一格天候一枚；氛围条前面换成当季那一枚 */
.wxChip{display:inline-flex;align-items:center;gap:4px}
.wxChip::before{content:"";width:15px;height:15px;flex:0 0 15px;background-image:var(--ic-w)}
.wx-qing::before{--c:0;--r:0} .wx-duo::before{--c:1;--r:0} .wx-yin::before{--c:2;--r:0} .wx-yu::before{--c:3;--r:0}
.wx-lei::before{--c:0;--r:1} .wx-bao::before{--c:1;--r:1} .wx-qiu::before{--c:2;--r:1} .wx-xiaoxue::before{--c:3;--r:1}
.wx-zhongxue::before{--c:0;--r:2} .wx-wu::before{--c:1;--r:2} .wx-gaowen::before{--c:2;--r:2} .wx-hanchao::before{--c:3;--r:2}
.atmosLine::before{width:17px;height:17px;margin-right:6px;vertical-align:-3px;background-image:var(--ic-w)}
/* 季节那枚挂在 #atmosBar 上，由 ATMOS.render() 打 .wxs-<季> */
#atmosBar.wxs-spring .atmosLine::before{--c:0;--r:3} #atmosBar.wxs-summer .atmosLine::before{--c:1;--r:3}
#atmosBar.wxs-autumn .atmosLine::before{--c:2;--r:3} #atmosBar.wxs-winter .atmosLine::before{--c:3;--r:3}
/* ---------- ③ 队列卡：等级一枚纹样，坐在左边那道色界里 ---------- */
.qCard{position:relative;padding-left:47px}
.qIco{position:absolute;left:11px;top:50%;transform:translateY(-50%);width:28px;height:28px;
background-image:var(--ic-c)}
.qg-S .qIco{--c:0;--r:1} .qg-C .qIco{--c:1;--r:1} .qg-B .qIco{--c:2;--r:1} .qg-D .qIco{--c:3;--r:1}
.qCard.deskCard .qIco{--c:3;--r:2}
/* 案头卡左边那道墨线不该顶掉等级色，交给纹样自己说话 */
.qCard .qTitle{padding-right:2px}
/* 窄屏（≤900px）：HUD 那几枚装饰纹样先让路——七维条与天气角标本来就挤，
加上 15–16px 图标会把 .hud 顶出 88px 横向溢出（实测 619 > 531）。文字标签带着意思，图标只是脸。 */
@media (max-width:900px){
.hLbl::before,.clock::before,.hudRank::before,.hudMoney::before,.wxChip::before{display:none}
.hLbl{gap:0}
/* v113 那块用无条件的 .clockRow{flex-wrap:nowrap} 把 2182 行的窄屏换行吃掉了
—— 时钟行 343px 挤进 256px 的 .hudC，整条 .hud 就溢出。写在最后才压得回来。 */
.clockRow{flex-wrap:wrap}
/* v156 把 .clock 抬到 20px；而 v113 的 .hudC .clock{font-size:18px !important} + .clock{white-space:nowrap}
又把 v95 的 16px 窄屏档压死了——时钟一行 322px 不许折，比 .hudC 的 231px 宽出 91px。
窄屏干脆让时钟独占一行（.hud 已经 wrap），字号用 !important 才压得回来。 */
.hudC{flex:1 1 100%;min-width:0;text-align:left}
.hudC .clock{font-size:18px !important;letter-spacing:.5px !important}
}
@media (max-width:700px){
.clock{font-size:14px}
}
/* ============ v158 · 小字衬线下线：看不清就是没美化 ============
用户截图（现场处置弹窗）+ 页内实测（#legProbe 走查 41 个文字节点）：
同一屏里 .docBody 15px 黑体 = 对比 14.45、笔画清楚；接警单 13px "仿宋" = 糊成一团。
病根不在颜色（--ink2 在纸上有 8.6:1），在**通道**：v156 把"纸面"整条挂到 --fang/--kai，
而本机注册表里根本没有 FangSong/KaiTi，两个 token 全部退化成思源宋体——
宋体的横画在 13px 上不足一个物理像素，抗锯齿之后就是用户说的"重影、看不清"。
实测还揪出九枚 10.6px 的栏名标签（对比 4.63）与四枚 11px 的要素芯片。
这一层不再逐条微调，直接把规则写死：
① 衬线只许出现在 ≥18px 的大字上。--serif/--fang/--kai/--fz/--brush 全部改指黑体，
另开 --disp（思源宋体）只挂给标题、印章、时钟、大数字那一小批；
② 接警单字号从 13 抬到 14.5，栏名从 10.6 抬到 12，长栏改独占整行（两栏窄列换行最伤可读性）；
③ 全弹窗文字节点定一条硬底线：字号 ≥12px、对比 ≥5.5:1，跑测台 FULL.legible() 逐节点核。
机器上真装了楷体/仿宋时，只有 --disp 那批大字会换脸——小字永远走黑体，不再赌装机字体。
========================================================= */
:root{
--disp:"KaiTi","楷体","FangSong","仿宋","Noto Serif SC","Source Han Serif SC","Songti SC",serif;
--serif:var(--ui); --fang:var(--ui); --kai:var(--ui); --fz:var(--ui); --brush:var(--ui);
/* 40 处行内 style="color:var(--ink3)" 压不住，只能把 token 本身提暗：
#6b7078 在接警单底上只有 4.46，#565c64 到 6.04；赭石同理 4.40 → 5.43 */
--ink3:#565c64; --ochre:#7f5c26;
}
/* ---- ① 大字通道：≥18px 才配衬线，其余一律黑体（.stamp 是旋转 14° 的印章图形，不算正文） ---- */
.inkTitle h1,.sealBig,.stamp,.mTitle,.mBarT,.docTitle,.clock,.pName,.endWrap .big,
.qTitle,.stat .v,.mgKpi .kpi .v,.startScreen .lineCard h3{font-family:var(--disp)}
/* 起始页那两枚是 .startScreen 前缀的更高权重规则在管，得原样压回去（实测 h1 会掉成 MiSans） */
.startScreen .inkTitle h1,.startScreen .sealBig{font-family:var(--disp)}
/* ---- ② 接警单：这是全游戏字最密的一块，按正文待遇排 ---- */
.brief{background:linear-gradient(180deg,#fffdf7,#f7f2e6);border-color:rgba(43,43,41,.2)}
.bfHead{font-size:13px;letter-spacing:.6px;font-weight:700}
.bfHead .bfSrc{font-size:12px;letter-spacing:.2px;color:var(--ink2)}
.bfCell>i{font-size:12px;letter-spacing:.3px;font-weight:600;color:var(--ink2);
background:rgba(32,36,42,.07);padding:2px 7px}
.bfCell>b{font-size:14px;line-height:1.72}
/* 长栏（在场/损害/已固定/依据）拉满整行：两栏窄列会把一句话切成四五截，最费眼 */
.bfGrid:not(.head){grid-template-columns:1fr;gap:0}
.bfMiss{font-size:13px;line-height:1.7;padding:6px 9px}
.bfMiss>i{font-size:13px}
/* ---- ③ 弹窗里其余的小字：要素芯片、法条、动作副标题、元信息 ---- */
.scnLbl{font-size:12px;color:var(--ink2);letter-spacing:.3px}
.scnT{font-size:13px;padding:3px 9px;color:var(--ink2)}
.lawBox{font-size:14px !important;line-height:1.85}
.docNo{font-size:12px !important;color:var(--ink2)}
.docMeta{font-size:13px !important;letter-spacing:.2px;color:var(--ink2)}
.act .need{font-size:13px !important;color:var(--ink2);line-height:1.7}
.sg{font-size:12px}
.sg [data-ik]{font-size:13px}
[data-ik="time"]{font-size:.96em}
/* ---- ④ 弹窗之外：队列卡、案头条、氛围行、地图标注，同一把尺子 ---- */
.qBrief{font-size:13px;line-height:1.65}
.qk{font-size:12px;color:var(--ink2);letter-spacing:.2px}
.atmosLine{font-size:13px}
.rumorLine{font-size:13px;color:var(--ink2)}
.todayLine{font-size:13px}
.badge{font-size:11.5px}
.idCard .idHead span{font-size:11.5px}
.askRow input,.noteRow input,.nameBox input,.startFoot select{font-family:var(--ui)}
.logStream .lsHead{font-size:13px;letter-spacing:.4px}
.logStream .lsHead::after{font-size:11.5px}
.startScreen .lineCard .lcBlurb{font-size:14px !important;text-align:left;line-height:1.9}
.ctHead .ctK{font-size:13px}
.mLbl,.enLbl{font-size:13px}
.mSub{font-size:11.5px}
.mScaleTxt{font-size:11.5px;opacity:1}
.mRoadName text{font-size:11.5px;letter-spacing:0;opacity:1}
.mRoseN{font-size:11.5px}
.heatLbl,.hotGo{font-size:12px;letter-spacing:.3px}
.catName{font-size:15px;letter-spacing:1.5px}
.sectTitle{letter-spacing:1.5px}
/* ---- ⑤ 全局字号地板：HUD/dock/芯片这一圈 9.5–11.5px 的边角字，一次抬到 ≥11.5 ----
跑测台量到的最小值是 dockBadge 9.5px；这一批不是正文，但它们是玩家每秒要看的东西，
小一号就得眯眼。凡是老规则带 !important 的，这里同样带 !important 才压得住。 */
.dockLbl{font-size:11.5px !important;letter-spacing:.3px}
.dockBadge{font-size:11.5px !important}
.grpArrow,.grpBadge{font-size:11.5px}
.hLbl{font-size:12px !important}
.stCap{font-size:11.5px !important}
.chip{font-size:12px !important}
.wxChip{font-size:12px !important;letter-spacing:.3px}
.todayN{font-size:12px}
.tk{font-size:11.5px}
.qFrom{font-size:12px !important;letter-spacing:.3px}
.qStage,.qScene{font-size:12px !important;letter-spacing:.2px}
.mqStage{font-size:12px}
.spGroup .spBtn,.spSkip{font-size:12px !important}
.mapN,.mapH{font-size:12px}
.logLine .d{font-size:12px !important}
.rgRow .d{font-size:12px}
.doc .logLine .d{font-size:12px}
/* ---- ⑥ 实测不过 4.5:1 的两处底：周末横幅 4.44、"场所"那一组门牌徽 4.47 ---- */
.dutyBanner{letter-spacing:1px}
.banner-weekend{color:#41604c}
.dockGrp[data-grp="place"] .grpGlyph{background:linear-gradient(180deg,#755730,#5f4526)}
/* ============ v159 · 修 HUD：七条属性的标签把进度条压住了 ============
用户截图（宽窗口）："精力/健康/压力/舆情/担当/民望/领导" 七个标签各有一截墨迹压在
自己的条子上。实测（同源 iframe 拉到 1440px，克隆 .hud 量 Range 的墨迹右边界）：
.hLbl 的盒子 24px、scrollWidth 45px、**每一行外溢 17px 盖进 .hMeter**。
根因是第二十七轮给 .hLbl 塞了 15px 的 sprite 纹样（::before + 4px gap），
而 .mtr 第一列被 v113 的 grid-template-columns:24px !important 钉死——
纹样上屏后那一格需要 45px，多出来的 21px 直接溢出到条子上。
当时没发现是因为 in-app 浏览器锁在 531px，v157 自己写的 ≤900px 档把纹样藏了，
**窄屏永远量不到宽屏的账**。这一层把格子还给内容，并给条子留最小宽度。
========================================================= */
.mtr{grid-template-columns:auto minmax(28px,1fr) 28px !important;gap:5px !important}
.hLbl{gap:3px}
.hLbl::before{width:14px;height:14px;flex:0 0 14px}
.hNum{text-align:right;font-variant-numeric:tabular-nums;font-feature-settings:"tnum" 1}
/* 宽窗口下属性板该拿到它应得的宽度：中间那条时钟行本来就松，把余量分给条子 */
@media (min-width:1200px){
.hudR{flex:0 1 auto;padding-left:18px}
.hudC{flex:0 1 auto}
.stGrp{gap:12px;padding-right:12px}
}
/* ---- v159b · 属性板还是挤：1280 的 HUD 装不下"三块都要横向铺" ----
实测 1440 视口下 .hud 被 #screenGame 的 max-width:1280 钉住，.hudL 溢出 54px（被
overflow:hidden 吃成省略号）、.hudC 溢出 79px、.hudStats 溢出 7px；第二组四条 meter
每条只有 97px，而"纹样+标签+条+数值"要 107px，于是 meter 之间互相压 6–22px。
两手一起治：① 把标签的横向开销收回来（纹样 13px、gap 2、字距归零、数值列 26）；
② 给 .stGrp 开 flex-wrap——装不下就换行，不许溢出到邻居身上。 */
.hLbl{letter-spacing:0}
.hLbl::before{width:13px;height:13px;flex:0 0 13px}
.mtr{grid-template-columns:auto minmax(24px,1fr) 26px !important;gap:4px !important;padding:1px 1px !important}
.stGrp{flex-wrap:wrap;row-gap:3px}
@media (min-width:1200px){
.stGrp{gap:8px}
}
/* ---- v159c · HUD 改成两行：一行身份+时钟，七条属性独占一行 ----
把整块 #screenGame 逐宽度扫了一遍（531/900/1100/1280/1440/1920 的同源 iframe），
发现不只有 meter 的问题：1280 的 HUD 带里三块内容实际需要 351+528+458=1337px，
**从 1001px 起就一直互相压着**——1100 下 .hudL 与 .hudC 的墨迹重叠 81px、
meter 之间重叠 20–47px；1280 以上 .hudC 压进 .hudR 12px、.hudL 被 overflow:hidden
吃成省略号 43px。之前只量到 531px（窄屏本来就换行），所以整条 ≥1000 的区间从没被测过。
与其继续抠像素，不如把不成立的假设改掉：属性板不再挤在第一行右边，独占第二行。
七条 meter 从此每条有 150–190px，条子也终于长得开。 */
.hud{flex-wrap:wrap;row-gap:7px}
.hudL{flex:1 1 260px;min-width:0}
.hudC{flex:1 1 360px;min-width:0}
.hudR{flex:1 1 100%;order:3;min-width:0;padding-top:1px}
.hudStats{flex-direction:row !important;flex-wrap:wrap;gap:8px 10px;width:100%}
.stGrp{flex:1 1 380px;gap:9px}
.mtr{flex:1 1 auto}
/* .hudL 被 v110 的 max-width:330 卡住，而身份块实际需要 351（印章30+立绘52+三行字222+两道 14 的缝）
—— 第一行现在只有它和时钟两块，没有理由再给它封顶 */
.hudL{max-width:none}
.hudL .seal{flex:0 0 32px}
/* 760 档实测 .hudL 还差 6px 才不裁（印章—立绘—三行字之间 14px 的缝太阔气） */
.hudL{gap:10px !important}
/* 760 档还差 2px：把身份块的基础宽度从 260 抬到 300，让它先分到该分的那一份 */
.hudL{flex:1 1 300px}
/* dock 的 top 跟着 HUD 真实高度走（--hudH 由 UI.renderHud 每次量完写进 :root）。
写死 132px 是上一版留下的假设：那时 HUD 只有 108px 高，现在它两行 155px，
第一扇门会被压在属性板上。窄屏（≤1000）本来就切到 bottom 定位，不受影响。 */
@media (min-width:1001px){
.leftDock{top:calc(var(--hudH,155px) + 14px) !important; max-height:calc(100vh - var(--hudH,155px) - 130px)}
}
/* ============ v163 · 队列卡排版收干净 + 立绘旁那枚"警"不再突兀 ============
用户两张截图，两句：①"文字排版太乱"；②"立绘旁白的那个警是干嘛的太突兀了"。
量过之后每张卡 270px 宽、去掉纹样和内边距只剩约 210px 放东西，而卡上塞了
一行四枚 chip + 标题 + 三行"标签｜值" + 一行"倒计时 + 两颗按钮"，于是：
chip 在词中间断开（"S" 孤零零掉到右上角、"级 · 须民警主办"另起一行）、
按钮被挤到竖排（"处 / 置"两个字各占一行）、"2 小时"也折行、
三行要素的值的第二行顶到最左边（没有悬挂缩进，看起来像另一条）。
收法是一刀一刀减，而不是继续缩字号：
① chip 一律不许在内部折行，只允许整枚换到下一行（flex-wrap + nowrap 子项）；
② 派单那两枚不再重复等级（等级已经写在同一行），字面从 "S 级 · 须民警主办" 收成 "须民警主办"；
③ 等级纹样从"绝对定位浮在卡片左缘正中"改回随元信息行排（它以前就是一张看不出是什么的小方块）；
④ 三行要素改成两栏网格：标签一列右对齐、值一列带悬挂缩进，值砍到 18/12/20 字；
⑤ 底部那行允许换行，两颗按钮永远整颗显示，宁可倒计时独占一行。
========================================================= */
.qFrom{display:flex;flex-wrap:wrap;align-items:center;gap:4px 6px;
font-size:12px;letter-spacing:.3px;line-height:1.5}
.qFrom>*{white-space:nowrap}
.qStage,.qScene{margin-left:0;padding:2px 7px;font-size:11.5px;letter-spacing:.3px}
.qIco{position:static;transform:none;width:18px;height:18px;flex:0 0 18px}
.qCard{padding-left:11px}
.qTitle{font-size:15px;letter-spacing:.5px;line-height:1.45;margin:3px 0 5px;
font-family:var(--ui);font-weight:700}
/* 卡标题收到 15.5px 之后就不许再走衬线通道：v158 那条硬规矩是"衬线只给 ≥18px 的大字"，
15.5px 的楷体（KaiTi）在 270px 的卡上糊成一片，legible [3] 抓到过。
队列卡是界面 chrome，不是纸上的公文 → 无衬线加粗，衬线留给 ≥18px 的 .docTitle/.mTitle。 */
/* 要素三行：标签列右对齐、值列悬挂缩进（值换行不会再顶到最左） */
.qBrief{display:grid;grid-template-columns:auto minmax(0,1fr);gap:1px 7px;
margin:0 0 6px;font-size:12px;line-height:1.6}
.qb{display:contents}
.qk{border-right:0;margin-right:0;padding-right:0;text-align:right;color:var(--ink3);
font-size:11.5px;letter-spacing:.3px}
.qb_miss,.qb_miss .qk{color:var(--cinnabar)}
.qv{min-width:0;word-break:break-word}
/* 底部：按钮不许被挤成竖排 */
.qFoot{flex-wrap:wrap;gap:5px 6px}
.qTimer{white-space:nowrap;flex:1 1 auto}
.qBtns{flex-wrap:wrap;justify-content:flex-end}
.qBtns .btn{white-space:nowrap;flex:0 0 auto}
/* 那枚红方块：它是"警/刑/政"的岗位印（index.html 的 #hudSeal，ui.js:88 按 state.post 换字），
但实心红块挨着脸确实抢戏。改成纸上盖的朱印：描边、旋一点、加 title 说明。
⚠ 尺寸/字号必须带 !important：v113 那块"身份卡"里 .hudL .seal{width:30px !important;
font-size:13px !important}（本文件 2416 行）把值钉死了，不写 !important 的 24px 是句假话
——v163 第一版就是这么骗过自己的（量出来 30px 还以为改到了，见 [[css-layer-traps]]）。
24 + 1.5×2 描边 = 27px。那道压角的 margin-right 必须跟着尺寸一起改：
v113 写的是 -19px（配 30px 的实心块），印子缩到 27px 还压 -19 就把"警"字推进立绘里 4px
（spill [1] 的墨迹重叠实测抓到，七档全中）。-16px 留 1px 缝，压角的意思还在。 */
.hudL .seal{width:24px !important;height:24px !important;flex:0 0 24px !important;
margin-right:-16px !important;
border-radius:2px;background:transparent;color:var(--cinnabar);
border:1.5px solid rgba(168,57,44,.62);font-size:12px !important;
letter-spacing:0;transform:rotate(-7deg);text-shadow:none;
box-shadow:inset 0 0 0 1px rgba(168,57,44,.14)}
/* =========================================================
v168 第三十一轮②：金钱系统 —— 账本（收入分层 / 支出分层 / 十二个月流水 / 欠账）
排版口径：行是「名称｜金额｜注」三列，金额右对齐走等宽数字（对不齐就看不出层），
注这一列允许换行但必须窄于金额，所以第三列用 minmax(0,1fr)。
字号地板 11.5px；数字用 --mono，正文走 --ui，不给衬线。
========================================================= */
.myRow{display:grid;grid-template-columns:8.5em minmax(0,5.5em) minmax(0,1fr);
gap:4px 9px;align-items:baseline;padding:5px 0;border-bottom:1px dotted var(--line);
font-size:var(--fs-body);line-height:1.65}
.myRow:last-child{border-bottom:0}
.myName{color:var(--ink);font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.myAmt{font-family:var(--mono);font-size:var(--fs-body);text-align:right;font-variant-numeric:tabular-nums;
letter-spacing:.2px;white-space:nowrap}
.myRow.in .myAmt{color:var(--bamboo)}
.myRow.out .myAmt{color:var(--ochre)}
.myWhy{grid-column:1 / -1;color:var(--ink3);font-size:var(--fs-sub);line-height:1.65;
word-break:break-word}
.mySum{margin-top:7px;padding-top:7px;border-top:1px solid var(--line);text-align:right;
font-family:var(--mono);font-size:var(--fs-body);color:var(--ink2);font-variant-numeric:tabular-nums}
/* 十二个月流水：一柱两档（入/出），柱宽随容器分，不许横向溢出 */
.myCurve{display:flex;align-items:flex-end;gap:4px;height:74px;padding:6px 2px 0}
.myBar{position:relative;flex:1 1 0;min-width:0;height:100%;display:flex;align-items:flex-end;
justify-content:center;gap:2px;border-bottom:1px solid var(--line)}
.myBar i{display:block;width:44%;max-width:11px;min-height:2px;border-radius:1px 1px 0 0}
.myBar i.in{background:linear-gradient(180deg,rgba(77,107,87,.85),rgba(77,107,87,.45))}
.myBar i.out{background:linear-gradient(180deg,rgba(127,92,38,.8),rgba(127,92,38,.4))}
.myBar em{position:absolute;left:0;right:0;bottom:-16px;text-align:center;font-style:normal;
font-family:var(--mono);font-size:var(--fs-num);color:var(--ink3)}
.myCurve{margin-bottom:18px}
/* 欠账：哪一行出现都要一眼看到，但不许只靠颜色表意（前面都带「欠 ¥」字样） */
.odChip{color:var(--cinnabar);font-weight:700}
.hudMoney{cursor:pointer;text-underline-offset:3px}
.hudMoney:hover{text-decoration:underline dotted}
.hudMoney.od{color:var(--cinnabar)}
.logLine .od{color:var(--cinnabar);font-family:var(--mono);margin-left:auto}
.logLine .ok{color:var(--bamboo);font-family:var(--mono);margin-left:auto}
.myTop{margin-bottom:12px}
/* 深底芯片里的任何文字都不许被 [data-ik] 染回纸上黑字：兜底一层 inherit，
即使染色层哪天漏了禁区，也不会出现黑压黑（队列卡「须民警主办」实测 cr 2.62） */
.qStage [data-ik],.qScene [data-ik],.tagx [data-ik],
.catBadge [data-ik],.dutyChip [data-ik],.seal [data-ik]{color:inherit;border-bottom:0}
/* —— 第三十一轮③：所里这栋楼 ——
每一行设施后面都要写明"现在为什么用不了"：位置、时辰、楼况、周期用量四样各有话。
这一行用 --ink2（不是 --ink3）：它是解释，不是次要信息，按钮 disabled 时整块才一起压暗。 */
.unWhy{display:block;font-size:11.5px;color:var(--ink2);margin-top:2px;letter-spacing:.2px}
.act .unWhy::before{content:"· ";color:var(--ink3)}
/* 地板兜底两条（第三十一轮③实测出来的）：
① .unWhy 从 11.5px 提到 12px——它是"为什么现在用不了"的解释，不该是最小的一行；
② [data-ik=time] 按 .96em 缩，父级 11.5px 时缩成 11px 破地板。max() 让它最多缩到地板。 */
.unWhy{font-size:12px}
[data-ik="time"]{font-size:max(11.5px,.96em)}
/* —— 第三十二轮：伞（保护伞那条线）——
面板里的三条仪：牵扯 / 证据 / 风声。底色用纸，只在越过阈值时换成朱砂或竹青，
避免把"数值条"做成一条彩虹；文字 12px，最低不低于全站地板。 */
.umbRow{display:flex;align-items:center;gap:9px;margin:6px 0;font-size:12px;color:var(--ink2)}
.umbRow b{flex:0 0 auto;width:34px;font-family:var(--kai);font-weight:600;color:var(--ink)}
.umbBar{flex:1;height:6px;background:var(--paper3);border-radius:3px;overflow:hidden}
/* dock「伞」：柏木色，和「回避」的深褐分开一档——它们是同一条线上的两面 */
.dockBtn.umb .dockIcon{background:linear-gradient(180deg,#5d4a63,#2b2030)}
.dockBtn.umb{border-color:rgba(93,74,99,.46)}
/* =========================================================
v177 · 伞面板：排版重排 + 职级权限
用户截图里的四个问题：
① 390px 宽时右侧数值贴边被裁 → 数值列改成固定槽 + 右对齐 + 留 1px；
② 四块地前两行有"热度"、后两行没有，整行缩进不一致 → 统一成两列网格，
热度永远在右上角同一格，副标题跨整行；
③ 标题/正文/时间线层级弱 → 元信息改成可换行的一行 chips，时间线单独两列；
④ 空态"0 条"和空提示重复 → 没有记录时不渲染计数；法条框改可折叠，避免把面板撑断。
字号地板：全部 ≥11.5px，数字走等宽 + tabular-nums。
========================================================= */
.umbMeta{
display:flex;flex-wrap:wrap;align-items:baseline;gap:4px 10px;
margin:3px 0 9px;font-family:var(--ui);font-size:12px;line-height:1.6;color:var(--ink3);
}
.umbMeta > span{display:inline-flex;align-items:baseline;gap:3px;white-space:nowrap;min-width:0}
.umbMeta > span + span::before{content:"·";color:var(--ink3);opacity:.7;margin-right:6px}
.umbMeta b{font-family:var(--mono);font-size:12px;font-weight:600;color:var(--ink);letter-spacing:0;font-variant-numeric:tabular-nums}
.umbMeta .mon b{color:var(--ochre)}
.umbMeta .bad{color:var(--cinnabar)}
.umbMeta .bad b{color:var(--cinnabar)}
/* 数值行：标签 / 条 / 数值三列，数值有固定槽，不再贴右缘 */
.umbRow{
display:grid;grid-template-columns:3.4em minmax(0,1fr) 2.8em;
align-items:center;gap:8px;margin:7px 0;padding:0 1px 0 0;
font-size:12px;line-height:1.4;color:var(--ink2);
}
.umbRow > b{
width:auto;font-family:var(--ui);font-weight:600;color:var(--ink);
letter-spacing:.5px;white-space:nowrap;
}
.umbRow .umbNum{
text-align:right;font-family:var(--mono);font-size:12px;font-weight:600;
color:var(--ink2);letter-spacing:0;font-variant-numeric:tabular-nums;white-space:nowrap;
}
.umbBar{min-width:0;height:6px;background:var(--paper3);border-radius:3px;overflow:hidden}
.umbBar i{display:block;height:100%;background:var(--police);transition:width .3s}
.umbBar.hot i{background:var(--cinnabar)}
.umbBar.ok i{background:var(--bamboo)}
/* 阈值提示：三行短句，不再是一整段 */
.umbNote{
display:grid;gap:3px;margin-top:9px;padding-top:8px;border-top:1px dashed var(--line);
font-size:12px;line-height:1.65;color:var(--ink2);
}
.umbNote span{display:flex;gap:7px;align-items:baseline}
.umbNote b{flex:0 0 2.6em;color:var(--ink);font-weight:600;letter-spacing:1px}
/* 四块地：名字 / 热度 / 副标题固定成同一副骨架 */
.umbTurf{
display:grid;grid-template-columns:minmax(0,1fr) auto;gap:1px 10px;align-items:baseline;
padding:7px 0;border-bottom:1px dotted var(--line);
}
.umbTurf:last-child{border-bottom:0}
.umbTurfName{
min-width:0;font-family:var(--ui);font-size:13px;font-weight:600;color:var(--ink);line-height:1.5;
overflow:hidden;text-overflow:ellipsis;white-space:nowrap;
}
.umbHeat{
font-family:var(--mono);font-size:11.5px;letter-spacing:0;white-space:nowrap;
color:var(--ink3);font-variant-numeric:tabular-nums;
}
.umbHeat.hot{color:var(--cinnabar)} .umbHeat.warm{color:var(--ochre)} .umbHeat.calm{color:var(--bamboo)}
.umbTurfSub{grid-column:1 / -1;min-width:0;font-size:12px;line-height:1.6;color:var(--ink3);overflow-wrap:anywhere}
.umbTurfSub span{opacity:.78}
/* 时间线：日期固定槽，正文悬挂缩进 */
.umbLog{
display:grid;grid-template-columns:4.4em minmax(0,1fr);gap:3px 9px;align-items:baseline;
padding:6px 0;border-bottom:1px dotted var(--line);
font-size:13px;line-height:1.65;color:var(--ink2);
}
.umbLog:last-child{border-bottom:0}
.umbLogDay{font-family:var(--mono);font-size:11.5px;color:var(--ink3);white-space:nowrap;font-variant-numeric:tabular-nums}
.umbLogTxt{min-width:0;overflow-wrap:anywhere}
/* 职级卡：四档梯子 + 当前档位说明 */
.umbRankCard{margin-bottom:2px}
.umbRankTop{display:flex;align-items:baseline;justify-content:space-between;gap:6px 10px;flex-wrap:wrap}
.umbRankTop > div{min-width:0}
.umbRankTop b{font-family:var(--ui);font-size:14px;font-weight:700;color:var(--ink);letter-spacing:.5px}
.umbRankTop span{font-size:12px;color:var(--ink3);margin-left:7px}
.umbRankTop em{
font-style:normal;font-family:var(--mono);font-size:11.5px;letter-spacing:0;
color:var(--police);white-space:nowrap;
}
.umbLadder{display:flex;margin:10px 0 9px;font-size:11.5px;line-height:1}
.umbLadder span{
flex:1 1 0;min-width:0;padding:6px 1px;text-align:center;white-space:nowrap;
border:1px solid var(--line);border-left:0;color:var(--ink3);background:rgba(255,255,255,.4);
}
.umbLadder span:first-child{border-left:1px solid var(--line);border-radius:2px 0 0 2px}
.umbLadder span:last-child{border-radius:0 2px 2px 0}
.umbLadder span.past{background:rgba(38,69,111,.09);color:var(--police)}
.umbLadder span.on{
background:var(--police);border-color:var(--police);color:#fff;font-weight:600;
box-shadow:0 1px 4px rgba(38,69,111,.25);
}
.umbRankCan,.umbRankNext{font-size:12px;line-height:1.75;color:var(--ink2);margin-top:5px;overflow-wrap:anywhere}
.umbRankCan b,.umbRankNext b{
display:inline-block;min-width:5.4em;margin-right:6px;color:var(--ink);
font-weight:600;letter-spacing:.5px;
}
.umbRankNext{color:var(--ink3)}
.umbRankWarn{
margin-top:8px;padding:7px 9px;border:1px dashed rgba(168,57,44,.35);border-radius:2px;
background:rgba(168,57,44,.05);color:var(--cinnabar);font-size:12px;line-height:1.7;
}
/* 法条框：默认折叠，展开也不许横向溢出 */
.umbLaw{
margin-top:12px;border:1px dashed rgba(38,69,111,.28);border-radius:2px;
background:rgba(38,69,111,.05);font-size:12px;line-height:1.75;color:var(--ink2);overflow:hidden;
}
.umbLaw summary{
display:flex;align-items:baseline;gap:7px;padding:8px 11px;cursor:pointer;list-style:none;
font-family:var(--ui);font-size:12px;font-weight:600;color:var(--police);
}
.umbLaw summary::-webkit-details-marker{display:none}
.umbLaw summary::before{content:"+";flex:0 0 auto;font-family:var(--mono);font-weight:700}
.umbLaw[open] summary::before{content:"−"}
.umbLaw summary span{
margin-left:auto;font-family:var(--ui);font-size:11.5px;font-weight:400;
color:var(--ink3);letter-spacing:.5px;white-space:nowrap;
}
.umbLawBody{padding:0 11px 10px;overflow-wrap:anywhere}
.umbLawBody p{margin:5px 0}
.umbLawBody b{color:var(--police);font-weight:600}
.umbLawFic{color:var(--ink3);font-size:12px}
/* 职级锁：看得见这一笔，但灰得能读出原因（普通 disabled 的 .45 太淡） */
.act.rkLock[disabled]{
opacity:.88;cursor:not-allowed;transform:none;
background:rgba(168,57,44,.035);border-style:dashed;
}
.act.rkLock[disabled]:hover{background:rgba(168,57,44,.035);border-color:var(--line);transform:none}
.act.rkLock[disabled] .need{color:var(--ink2)}
/* 第二行说明：为什么现在做不了。比主行淡一档，但必须是灰底上能读清的字号——
这一行才是玩家真正要看的那句"不是我做不到，是我还没这个身份" */
.act.rkLock[disabled] .need.needWhy{display:block;margin-top:3px;color:var(--ink3);font-size:12px;line-height:1.55}
/* 报请那条路：长得像"这条路难走但能走"，不像"这条路封了"。
左侧一道虚线边，与置灰的 rkLock 区分开——它是可点的，别让人以为是死的。 */
.act.actAsk{border-left:3px dashed rgba(31,86,132,.42)}
.act.actAsk .need.needWhy{display:block;margin-top:3px;color:var(--ink3);font-size:12px;line-height:1.55}
.act .dqAsk{color:var(--police);border-bottom:1px dashed currentColor;cursor:pointer}
.act .dqAsk:hover{color:var(--cinnabar);border-bottom-color:currentColor}
@media (max-width:420px){
.umbRow{grid-template-columns:3em minmax(0,1fr) 2.6em;gap:7px}
.umbRankCan b,.umbRankNext b{display:block;min-width:0;margin:0 0 1px}
.umbLadder span{padding:6px 0}
.umbMeta{gap:3px 8px}
.umbMeta > span + span::before{margin-right:4px}
}
/* =========================================================
v178 · 灰色地带 GREY：场所牌、四指标、帮派条、回话行
全部 11.5px 起步；密集信息用黑体/等宽，正文才用宋
========================================================= */
.art.grey{background-image:url(../assets/art_grey.webp)}
.dockBtn.grey .dockIcon{background:linear-gradient(180deg,#57685e,#26332d)}
.dockBtn.grey{border-color:rgba(87,104,94,.46)}
.greyKpi{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:6px;margin:8px 0 6px}
.greyKpiCell{
min-width:0;padding:7px 8px 8px;border:1px solid var(--line);border-radius:2px;
background:linear-gradient(180deg,rgba(255,255,255,.55),rgba(233,225,209,.28));
}
.greyKpiCell.hot{background:linear-gradient(180deg,rgba(168,57,44,.08),rgba(233,225,209,.3));border-color:rgba(168,57,44,.3)}
.greyKpiCell.warm{background:linear-gradient(180deg,rgba(143,106,48,.09),rgba(233,225,209,.3));border-color:rgba(143,106,48,.3)}
.gkLbl{display:block;font-family:var(--hei);font-size:11.5px;line-height:1.4;color:var(--ink3);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.gkNum{display:block;margin:2px 0 5px;font-family:var(--mono);font-size:19px;line-height:1.1;font-weight:600;color:var(--ink);font-variant-numeric:tabular-nums}
.gkBar{height:4px;border-radius:2px;background:var(--paper3);overflow:hidden}
.gkBar i{display:block;height:100%;border-radius:2px;background:var(--police)}
.gkBar i.intel{background:var(--bamboo)}
.gkBar i.risk{background:var(--ochre)}
.gkBar i.sat{background:var(--police)}
.greyKpiCell.hot .gkNum,.greyKpiCell.hot .gkBar i{color:var(--cinnabar);background:var(--cinnabar)}
.greyKpiCell.warm .gkNum{color:var(--ochre)}
.greyRisk{
margin:0 0 8px;padding:6px 8px;border-left:3px solid var(--bamboo);
background:rgba(77,107,87,.06);font-family:var(--ui);font-size:12px;line-height:1.6;color:var(--ink2);
}
.greyRisk.warm{border-left-color:var(--ochre);background:rgba(143,106,48,.07)}
.greyRisk.hot{border-left-color:var(--cinnabar);background:rgba(168,57,44,.07);color:var(--cinnabar)}
.greyCalm{
margin:7px 0 10px;padding:8px 10px;border:1px dashed var(--line);
font-family:var(--ui);font-size:12px;line-height:1.65;color:var(--ink3);
}
.greyAlerts{display:grid;gap:5px;margin:7px 0 10px}
.greyAlert{
display:grid;grid-template-columns:minmax(0,1fr) auto auto;gap:8px;align-items:center;
width:100%;padding:8px 9px;text-align:left;cursor:pointer;color:var(--ink);
border:1px solid rgba(168,57,44,.28);border-left:3px solid var(--cinnabar);border-radius:2px;
background:rgba(168,57,44,.05);font-family:inherit;
}
.greyAlert:hover{background:rgba(168,57,44,.1)}
.gaT{min-width:0;font-family:var(--hei);font-size:13px;line-height:1.5;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.gaD{font-family:var(--mono);font-size:11.5px;color:var(--cinnabar);white-space:nowrap;font-variant-numeric:tabular-nums}
.gaGo{font-family:var(--hei);font-size:11.5px;color:var(--cinnabar);white-space:nowrap}
.greyPlaces{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:7px;margin:7px 0 10px}
.greyPlace{
display:block;width:100%;min-width:0;text-align:left;cursor:pointer;color:var(--ink);
padding:9px 10px 8px;border:1px solid var(--line);border-radius:2px;
background:linear-gradient(180deg,rgba(255,255,255,.58),rgba(233,225,209,.22));
font-family:inherit;transition:.15s;
}
.greyPlace:hover{border-color:rgba(38,69,111,.42);box-shadow:0 2px 10px rgba(40,34,24,.07);transform:translateY(-1px)}
.gpTop{display:flex;justify-content:space-between;align-items:baseline;gap:6px;margin-bottom:5px;min-width:0}
.gpTop > b{min-width:0;font-family:var(--hei);font-size:14px;line-height:1.45;color:var(--ink);font-weight:700;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.gpKind{flex:0 0 auto;font-family:var(--ui);font-size:11.5px;line-height:1.4;color:var(--ink3);white-space:nowrap}
.gpBar{display:grid;grid-template-columns:2.6em minmax(0,1fr) 2.4em;gap:6px;align-items:center;margin:4px 0;min-width:0;font-family:var(--ui);font-size:11.5px;line-height:1.4;color:var(--ink3)}
.gpLbl{white-space:nowrap}
.gpTrack{display:block;min-width:0;height:5px;border-radius:3px;background:var(--paper3);overflow:hidden}
.gpFill{display:block;height:100%;border-radius:3px;background:var(--police);transition:width .25s}
.gpFill.hot{background:var(--cinnabar)}
.gpFill.ok{background:var(--bamboo)}
.gpFill.gold{background:var(--ochre)}
.gpVal{text-align:right;font-family:var(--mono);font-size:11.5px;line-height:1.4;color:var(--ink2);font-variant-numeric:tabular-nums;white-space:nowrap}
.gpNote{display:block;margin-top:5px;font-family:var(--ui);font-size:11.5px;line-height:1.65;color:var(--ink2);overflow-wrap:anywhere}
.gpFoot{display:block;margin-top:4px;font-family:var(--ui);font-size:11.5px;line-height:1.5;color:var(--ink3);overflow-wrap:anywhere}
.greyGang{padding:9px 10px;margin:7px 0 10px;background:rgba(255,255,255,.36)}
.ggTop{display:flex;flex-wrap:wrap;align-items:baseline;gap:4px 9px;margin-bottom:5px;min-width:0}
.ggTop > b{font-family:var(--hei);font-size:15px;line-height:1.4;color:var(--ink);letter-spacing:.5px}
.ggState{font-family:var(--ui);font-size:11.5px;line-height:1.4;color:var(--cinnabar);border:1px solid rgba(168,57,44,.32);padding:1px 5px;border-radius:2px;white-space:nowrap}
.ggBoss{margin-left:auto;font-family:var(--ui);font-size:11.5px;line-height:1.4;color:var(--ink3);white-space:nowrap}
.ggNote{margin-top:6px;font-family:var(--ui);font-size:11.5px;line-height:1.65;color:var(--ink3);overflow-wrap:anywhere}
.greyRows{display:grid;gap:0;margin:4px 0 9px;border-top:1px solid var(--line)}
.greyRow{
display:grid;grid-template-columns:auto minmax(0,1fr) auto;gap:5px 10px;align-items:baseline;
width:100%;padding:7px 2px;text-align:left;cursor:pointer;color:var(--ink);
border:0;border-bottom:1px dotted var(--line);background:transparent;font-family:inherit;
}
.greyRow:hover{background:rgba(38,69,111,.045)}
.grName{font-family:var(--hei);font-size:13px;line-height:1.5;color:var(--ink);white-space:nowrap;font-weight:700}
.grName em{font-style:normal;margin-left:5px;font-family:var(--mono);font-size:11.5px;font-weight:400;color:var(--police)}
.grMeta{min-width:0;font-family:var(--ui);font-size:11.5px;line-height:1.6;color:var(--ink3);overflow-wrap:anywhere}
.grGo{font-family:var(--hei);font-size:11.5px;line-height:1.5;color:var(--police);white-space:nowrap}
.greyHero{margin:7px 0 9px;padding:8px 9px;border:1px solid var(--line);border-radius:2px;background:rgba(255,255,255,.38)}
.greyHeroNums{display:flex;flex-wrap:wrap;gap:3px 12px;margin-bottom:5px;font-family:var(--ui);font-size:11.5px;line-height:1.5;color:var(--ink3)}
.greyHeroNums b{font-family:var(--mono);font-size:12px;color:var(--ink);font-variant-numeric:tabular-nums;margin-left:2px}
.greyHeroBars{display:grid;gap:1px}
.greyFacts{display:flex;flex-wrap:wrap;gap:4px 10px;margin:7px 0 9px;font-family:var(--ui);font-size:11.5px;line-height:1.6;color:var(--ink3)}
.greyFacts b{font-family:var(--mono);font-size:12px;color:var(--ink);margin-left:2px;font-variant-numeric:tabular-nums}
.greyPicks{display:grid;gap:7px;margin:7px 0 9px}
.greyPick{padding:8px 9px;border:1px solid var(--line);border-radius:2px;background:rgba(255,255,255,.34)}
.greyPick .act{margin-top:6px}
.greyLog{display:grid;grid-template-columns:4.6em minmax(0,1fr);gap:4px 9px;align-items:baseline;padding:5px 0;border-bottom:1px dotted var(--line);font-family:var(--ui);font-size:12px;line-height:1.65;color:var(--ink2)}
.greyLog:last-child{border-bottom:0}
.greyLog .d{font-family:var(--mono);font-size:11.5px;line-height:1.6;color:var(--ink3);white-space:nowrap;font-variant-numeric:tabular-nums}
.greyAuditBars{display:grid;gap:5px;margin:8px 0 10px}
.gaB{display:grid;grid-template-columns:5.2em minmax(0,1fr) 2.4em;gap:7px;align-items:center;font-family:var(--ui);font-size:11.5px;line-height:1.5;color:var(--ink3)}
.gaB > b{text-align:right;font-family:var(--mono);font-size:11.5px;color:var(--ink2);font-variant-numeric:tabular-nums}
@media(max-width:760px){
.greyKpi{grid-template-columns:repeat(2,minmax(0,1fr))}
.greyPlaces{grid-template-columns:1fr}
.greyRow{grid-template-columns:minmax(0,1fr) auto;gap:2px 8px}
.grMeta{grid-column:1 / -1}
.greyAlert{grid-template-columns:minmax(0,1fr) auto}
.gaD{grid-column:2}
.gaGo{display:none}
.gpTop > b{font-size:13px}
}
@media(prefers-reduced-motion:reduce){
.greyPlace,.gpFill{transition:none}
}
/* ===== 第三十四轮 · 职级分层与人情讨好（v179） ===== */
.favorBand{margin:8px 0 10px;padding:9px 10px;border:1px solid var(--line);border-radius:2px;background:rgba(255,255,255,.4)}
.favorBand .fbTop{display:flex;align-items:center;gap:8px;min-width:0;margin-bottom:8px}
.fbLv{flex:0 0 auto;display:inline-flex;align-items:center;justify-content:center;min-width:30px;height:24px;padding:0 6px;border-radius:2px;background:var(--police);color:#fff9ee;font-family:var(--mono);font-size:12px;font-weight:700;letter-spacing:.5px}
.fbWho{display:flex;flex-direction:column;min-width:0;line-height:1.4}
.fbWho b{font-family:var(--hei);font-size:14px;color:var(--ink);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.fbWho em{font-style:normal;font-family:var(--ui);font-size:11.5px;color:var(--ink3)}
.fbRank{flex:0 0 auto;margin-left:auto;font-family:var(--mono);font-size:11.5px;color:var(--police);white-space:nowrap}
.fbRows{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:4px 12px}
.fbRow{display:grid;grid-template-columns:5.4em minmax(0,1fr);gap:7px;align-items:baseline;padding:4px 0;border-bottom:1px dotted var(--line);min-width:0}
.fbRow:last-child,.fbRow:nth-last-child(2){border-bottom:0}
.fbRow span{font-family:var(--ui);font-size:11.5px;line-height:1.5;color:var(--ink3);white-space:nowrap}
.fbRow b{font-family:var(--ui);font-size:11.5px;line-height:1.6;color:var(--ink2);font-weight:400;overflow-wrap:anywhere}
.favorMetrics{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:2px 14px;margin:7px 0 4px;padding:8px 9px;border:1px solid var(--line);border-radius:2px;background:rgba(255,255,255,.3)}
.favorMetric{display:grid;grid-template-columns:3.6em minmax(0,1fr);gap:6px;align-items:center;min-width:0}
.fmLbl{font-family:var(--ui);font-size:11.5px;line-height:1.5;color:var(--ink3);white-space:nowrap}
.favorMetric .gpBar{grid-template-columns:minmax(0,1fr) 2.4em;margin:3px 0}
.favorRisk{margin:3px 0 8px;font-family:var(--ui);font-size:11.5px;line-height:1.65;color:var(--ink3);overflow-wrap:anywhere}
.favorPromo{margin:6px 0 9px;padding:8px 9px;border:1px solid var(--line);border-radius:2px;background:rgba(255,255,255,.3)}
.fpTop{display:flex;justify-content:space-between;align-items:baseline;gap:8px;margin-bottom:4px}
.fpTop b{font-family:var(--hei);font-size:13px;color:var(--ink)}
.fpTop span{font-family:var(--mono);font-size:11.5px;color:var(--police);white-space:nowrap}
.favorPromo .gaB{grid-template-columns:5.2em minmax(0,1fr) 2.2em}
.favorPromo .hintInk{margin-top:6px}
.favorOffers{display:grid;gap:6px;margin:6px 0 9px}
.favorOffer{display:grid;gap:2px;width:100%;padding:8px 9px;border:1px solid var(--line);border-radius:2px;background:rgba(255,255,255,.36);text-align:left;font-family:inherit;cursor:pointer;transition:.16s}
.favorOffer:hover{border-color:rgba(38,69,111,.42);background:#fff;transform:translateY(-1px)}
.foTop{display:flex;align-items:baseline;flex-wrap:wrap;gap:4px 8px;min-width:0}
.foTop > b{font-family:var(--hei);font-size:13px;color:var(--ink);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.foForm{font-family:var(--ui);font-size:11.5px;color:var(--ochre);white-space:nowrap}
.foMeta{font-family:var(--ui);font-size:11.5px;line-height:1.6;color:var(--ink3);overflow-wrap:anywhere}
.foGo{font-family:var(--hei);font-size:11.5px;color:var(--police);white-space:nowrap;margin-top:2px}
.favorAlerts{display:grid;gap:5px;margin:6px 0 9px}
.favorRows{display:grid;gap:4px;margin:6px 0 9px}
.favorRow{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,2.4fr) auto;gap:3px 10px;align-items:baseline;width:100%;padding:6px 2px;border:0;border-bottom:1px dotted var(--line);background:transparent;text-align:left;font-family:inherit;cursor:pointer}
.favorRow:hover{background:rgba(38,69,111,.045)}
.frWho{display:flex;align-items:baseline;gap:5px;min-width:0}
.frWho b{font-family:var(--hei);font-size:13px;line-height:1.5;color:var(--ink);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.frMeta{min-width:0;font-family:var(--ui);font-size:11.5px;line-height:1.6;color:var(--ink3);overflow-wrap:anywhere}
.frGo{font-family:var(--hei);font-size:11.5px;line-height:1.5;color:var(--police);white-space:nowrap}
.favorStage{display:inline-block;flex:0 0 auto;padding:0 4px;border:1px solid var(--line);border-radius:2px;font-family:var(--ui);font-size:11.5px;line-height:1.5;font-weight:400;color:var(--ink3);background:rgba(255,255,255,.45);white-space:nowrap}
.fs-probe{color:var(--ink3);border-color:var(--line)}
.fs-favor{color:var(--police);border-color:rgba(38,69,111,.35)}
.fs-maintain{color:var(--bamboo);border-color:rgba(74,111,82,.35)}
.fs-escalate{color:var(--ochre);border-color:rgba(160,112,44,.4)}
.fs-bind{color:var(--cinnabar);border-color:rgba(168,57,44,.4)}
.fs-demand{color:#fff9ee;background:var(--cinnabar);border-color:var(--cinnabar)}
.fs-break{color:var(--ink3);border-style:dashed}
.favorPat{flex:0 0 auto;margin-left:auto;font-family:var(--mono);font-size:11.5px;color:var(--ink3);white-space:nowrap}
.favorWho{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin:6px 0 4px}
.favorQuote{margin:7px 0;padding:7px 10px;border-left:2px solid var(--ochre);background:rgba(255,255,255,.32);font-family:var(--ui);font-size:13px;line-height:1.8;color:var(--ink2);overflow-wrap:anywhere}
.favorReal{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:4px 8px;margin:7px 0 9px;padding:7px 9px;border:1px solid var(--line);border-radius:2px;background:rgba(255,255,255,.28)}
.favorReal span{font-family:var(--ui);font-size:11.5px;line-height:1.55;color:var(--ink3);overflow-wrap:anywhere}
.favorReal b{font-family:var(--mono);font-size:11.5px;color:var(--ink2);margin-left:3px;font-variant-numeric:tabular-nums}
.favorFacts{display:flex;flex-wrap:wrap;gap:3px 10px;margin:6px 0 8px;font-family:var(--ui);font-size:11.5px;line-height:1.6;color:var(--ink3)}
.favorFacts b{font-family:var(--mono);font-size:11.5px;color:var(--ink2);margin-left:2px;font-variant-numeric:tabular-nums}
.favorTrace{display:flex;flex-wrap:wrap;gap:4px 7px;margin:5px 0 7px}
.favorTraceItem{display:inline-block;padding:1px 6px;border:1px solid var(--line);border-radius:2px;font-family:var(--ui);font-size:11.5px;line-height:1.6;color:var(--ink3);background:rgba(255,255,255,.3)}
.favorTraceItem b{font-family:var(--mono);font-size:11.5px;color:var(--ink2);margin-left:2px;font-variant-numeric:tabular-nums}
.favorBinds{display:grid;gap:5px;margin:5px 0 8px}
.favorBind{padding:7px 8px;border:1px solid var(--line);border-radius:2px;background:rgba(255,255,255,.3)}
.favorBind .fbTop{margin-bottom:2px}
.favorBind .fbTop > b{font-family:var(--hei);font-size:13px;color:var(--ink);white-space:nowrap}
.favorBind .fbTop .favorStage{margin-left:auto}
.favorMini{margin:5px 0 9px;padding:8px 9px;border:1px solid var(--line);border-radius:2px;background:rgba(255,255,255,.34)}
.fmTop{display:flex;align-items:center;gap:6px;flex-wrap:wrap;margin-bottom:4px}
.fmTop > b{font-family:var(--hei);font-size:13px;color:var(--ink)}
.fmRank{margin-left:auto;font-family:var(--mono);font-size:11.5px;color:var(--police);white-space:nowrap}
@media(max-width:760px){
.fbRows{grid-template-columns:1fr}
.fbRow:nth-last-child(2){border-bottom:1px dotted var(--line)}
.fbRow:last-child{border-bottom:0}
.favorMetrics{grid-template-columns:1fr}
.favorReal{grid-template-columns:repeat(2,minmax(0,1fr))}
.favorRow{grid-template-columns:minmax(0,1fr) auto;gap:1px 8px}
.frMeta{grid-column:1 / -1}
.frGo{grid-column:2;grid-row:1}
.frWho{grid-column:1;grid-row:1}
.favorOffer .foTop > b{font-size:13px}
.favorBand .fbTop{flex-wrap:wrap}
.fbRank{margin-left:0}
}
@media(prefers-reduced-motion:reduce){
.favorOffer{transition:none}
}
/* ===== 第三十五轮 · 功能区门牌与名词对照（v180）=====
门牌挂在抽屉正文最上面，视觉上要比正文"轻一档"：靠左侧一道墨规 + 纸色底，
不做成第二张卡片，否则玩家会以为要点它。 */
.helpBar{
margin:0 0 12px;padding:9px 11px 8px;
background:linear-gradient(180deg,rgba(244,238,225,.82),rgba(244,238,225,.44));
border-left:3px solid rgba(74,95,122,.5);border-radius:0 5px 5px 0;
}
.hbRow{display:flex;gap:9px;align-items:flex-start;padding:2px 0}
.hbK{flex:0 0 auto;font-size:11.5px;letter-spacing:.5px;color:var(--ink3);
padding-top:2px;white-space:nowrap}
.hbV{flex:1 1 auto;font-size:13px;line-height:1.62;color:var(--ink1)}
.hbFoot{display:flex;flex-wrap:wrap;gap:8px;margin-top:7px}
.hbGo{font:inherit;font-size:11.5px;color:var(--ink2);cursor:pointer;
background:transparent;border:1px dashed rgba(74,95,122,.45);border-radius:4px;padding:3px 8px}
.hbGo:hover{color:var(--ink1);border-color:rgba(74,95,122,.8);background:rgba(255,255,255,.5)}
/* 行话：只画虚线，不加底色——满屏高亮等于没有高亮 */
.gls{cursor:help;text-decoration:underline dotted rgba(168,57,44,.62);text-underline-offset:3px}
.gls:hover{color:#8b2f24}
.glsDir{display:inline-block;margin-top:8px;font-size:11.5px;color:var(--ink2)}
/* 名词表 */
.termRows{display:flex;flex-direction:column;gap:0}
/* 第一列按最长词条给宽：用固定 em 的话「个人有关事项报告」会被挤成两行，索引看着就是断的 */
.termRow{display:grid;grid-template-columns:max-content 5.2em 1fr;gap:4px 10px;align-items:baseline;
padding:7px 4px;border-bottom:1px dashed rgba(32,36,42,.16);cursor:pointer}
.termRow:hover{background:rgba(255,255,255,.55)}
.termW{font-size:13px;font-weight:600;color:var(--ink1);white-space:nowrap}
.termD{font-size:11.5px;color:var(--ink3)}
.termD .up{font-style:normal;color:#3f6b4a}
.termD .dn{font-style:normal;color:#8b2f24}
.termG{font-size:12px;line-height:1.6;color:var(--ink2);grid-column:1 / -1}
.termAt{font-size:11.5px;color:var(--ink3);grid-column:1 / -1}
/* 门表 */
.helpIdx{display:flex;flex-direction:column;gap:0}
.idxRow{display:grid;grid-template-columns:5.4em 1fr auto;gap:4px 10px;align-items:baseline;
padding:7px 4px;border-bottom:1px dashed rgba(32,36,42,.16);cursor:pointer}
.idxRow:hover{background:rgba(255,255,255,.55)}
.idxRow>b{font-size:13px;color:var(--ink1)}
.idxRow span{font-size:12px;line-height:1.6;color:var(--ink2)}
.idxN{font-size:11.5px;color:#8b2f24;font-style:normal;white-space:nowrap}
.idxLock{cursor:default;opacity:.62}
.idxLock:hover{background:transparent}
.idxLock .idxN{color:var(--ink3)}
.dockBtn.help .dockIcon{background:linear-gradient(180deg,#6b6f5f,#43473b)}
@media (max-width:760px){
.termRow,.idxRow{grid-template-columns:1fr}
.idxN{white-space:normal}
}
/* 伞 / 灰区 / 说明 这三扇还没配到 sprite 格：基类 .dockIcon 为了让位给纹样把 color 压成
transparent，它们又用 gradient 顶掉了 background-image，结果门上是一个空心圆。
这里把单字请回来——字要站在深色渐变上，所以给纸白，不是给 gold。 */
.dockBtn.umb .dockIcon,.dockBtn.grey .dockIcon,.dockBtn.help .dockIcon{
color:#fdf6e8;font-size:15px;font-weight:600;letter-spacing:0}
/* ===== 第三十六轮 · 权力感演出层（v182）=====
见证 / 仪式 / 一句话定生死 / 命运回放。
这一层全是"演出"，所以不做满屏高亮：态度用一条细轨，反应用一道左侧墨规，
定帧那一屏故意留白——权力需要安静的地方才显得重。 */
.pwHush{margin:10px 0 4px;padding:10px 12px;border-left:3px solid rgba(168,57,44,.55);
background:linear-gradient(180deg,rgba(255,252,244,.9),rgba(244,238,225,.5));border-radius:0 5px 5px 0}
.pwHush b{display:block;font-size:15px;color:var(--ink1);letter-spacing:1px;margin-bottom:3px}
.pwHush span{display:block;font-size:12px;line-height:1.66;color:var(--ink2)}
/* 在场的人：名字 / 态度轨 / 一句台词 */
.pwCrowd{margin:10px 0 6px;padding:9px 11px;background:rgba(244,238,225,.5);border:1px solid rgba(32,36,42,.1);border-radius:5px}
.pwHead{font-size:12px;color:var(--ink2);letter-spacing:1px;padding-bottom:5px;border-bottom:1px dashed rgba(32,36,42,.14)}
.pwSub{margin-left:8px;color:var(--ink3);letter-spacing:0}
.pwRow{display:grid;grid-template-columns:4.8em 72px 1fr;gap:8px;align-items:center;padding:4px 0}
.pwWho{font-size:12px;color:var(--ink2);white-space:nowrap}
.pwTrack{height:5px;border-radius:3px;background:rgba(32,36,42,.12);overflow:hidden}
.pwFill{display:block;height:100%;border-radius:3px;transition:width .28s ease}
.pwFill.b0{background:#a8392c}
.pwFill.b1{background:#b08a3e}
.pwFill.b2{background:#6f7f8c}
.pwFill.b3{background:#4d6b57}
.pwWord{font-size:12px;line-height:1.55;color:var(--ink1)}
/* 上一个动作的回声：这是玩家以前完全看不见的那一段 */
.pwEcho{margin:9px 0 2px;padding:8px 11px;border-left:2px solid rgba(74,95,122,.45);background:rgba(74,95,122,.05)}
.pwLine{font-size:13px;line-height:1.68;color:var(--ink1);padding:2px 0}
.pwLine.rit{color:#3d4f6b}
.pwLine.rit::before{content:'▸ ';color:rgba(74,95,122,.7)}
/* 处置段：一句话卡片 */
.pwDoc .docBody .em{color:var(--ink2)}
.pwVerdicts .act b{font-size:15px;letter-spacing:1px}
.pwVerdicts .act .need{color:var(--ink3)}
/* 自己拼：一排可以按下去的动作 */
.pwTray{display:flex;flex-wrap:wrap;gap:7px;margin:6px 0 10px}
.pwChip{font:inherit;font-size:12px;line-height:1.4;padding:6px 10px;cursor:pointer;border-radius:5px;
background:linear-gradient(180deg,#fffdf6,#f2ecdd);border:1.5px solid rgba(32,36,42,.2);color:var(--ink2)}
.pwChip:hover{border-color:rgba(74,95,122,.6);color:var(--ink1)}
.pwChip.on{background:linear-gradient(180deg,#eef1f5,#dde4ec);border-color:rgba(74,95,122,.75);color:var(--ink1);font-weight:600}
.pwChip:disabled{cursor:not-allowed;opacity:.55}
.pwLock{display:block;font-style:normal;font-size:11.5px;color:#8b2f24;margin-top:2px}
.pwNow{font-size:12px;line-height:1.7;color:var(--ink2);padding:7px 10px;margin-bottom:8px;
background:rgba(255,255,255,.55);border:1px dashed rgba(32,36,42,.18);border-radius:5px}
.pwWarn{display:block;color:#8b2f24;margin-top:3px}
/* 定帧：一句话说出去的那一屏 */
.pwHold .docTitle{font-size:24px;letter-spacing:2px}
.pwHold .docBody{padding:14px 0 6px}
.pwRit{margin:8px 0;padding:9px 12px;border-left:2px solid rgba(168,57,44,.4);background:rgba(244,238,225,.55);
font-size:12px;line-height:1.7;color:var(--ink2)}
.pvRows{margin:10px 0 6px}
.pvRow{display:grid;grid-template-columns:5.2em 1fr;gap:9px;padding:5px 0;border-bottom:1px dashed rgba(32,36,42,.12)}
.pvWho{font-size:12px;color:var(--ink3)}
.pvRow span:last-child{font-size:12px;line-height:1.6;color:var(--ink1)}
.pwQuiet{margin:10px 0 4px;font-size:12px;color:var(--ink3);letter-spacing:.5px}
/* 名单 */
.pwPend{margin:4px 0 8px}
.ppRow{display:flex;gap:9px;font-size:12px;line-height:1.6;color:var(--ink2);padding:3px 0}
.ppRow span{color:var(--ink3);white-space:nowrap}
.pwPerson{padding:9px 0;border-bottom:1px dashed rgba(32,36,42,.14)}
.pwName{font-size:14px;color:var(--ink1);font-weight:600}
.pwSince{margin-left:8px;font-size:11.5px;color:var(--ink3);font-weight:400}
.pwMark{margin:5px 0}
.pvmRow{display:flex;gap:8px;font-size:12px;line-height:1.6;color:var(--ink2);padding:2px 0}
.pvmRow b{color:var(--ink1);font-weight:600}
.pvmRow span{color:var(--ink3);white-space:nowrap}
.pwFate{margin-top:6px;padding-left:9px;border-left:2px solid rgba(74,95,122,.3)}
.pvfRow{font-size:12px;line-height:1.7;color:var(--ink2);padding:2px 0}
.pvfDay{display:inline-block;min-width:5.2em;color:var(--ink3);font-size:11.5px}
.pwFateNone{font-size:12px;color:var(--ink3);padding:3px 0}
.pwCalm{font-size:12px;line-height:1.7;color:var(--ink3);padding:10px 0}
@media (max-width:760px){
.pwRow{grid-template-columns:4.4em 1fr}
.pwWord{grid-column:1 / -1;padding-left:2px}
.pvRow{grid-template-columns:1fr}
}
@media(prefers-reduced-motion:reduce){ .pwFill{transition:none} }
/* 舆情条的热标：原来的朱砂对纸白字只有 4.38:1（legible 的 [2] 抓到了）。
热标是"这条正在烧"，要更沉一点才压得住，顺手抬到 5.5 以上。 */
.mediaStrip.m-hot .mqIco{background:#8b2f24}
/* ===== v183 权力感补完：信息差底牌 + 被收走的那一样 ===== */
.pwTrumps{margin:10px 0 4px;padding:9px 11px;border:1px dashed rgba(74,95,122,.32);
background:rgba(74,95,122,.045);border-radius:5px}
.pwTrHead{display:flex;justify-content:space-between;align-items:baseline;gap:10px;font-size:12px;color:var(--ink3)}
.pwTrHead b{font-size:12px;color:#3d4f6b;letter-spacing:.5px}
.pwTrRow{display:flex;flex-wrap:wrap;gap:7px;margin-top:7px}
.pwTrump{font:inherit;text-align:left;cursor:pointer;padding:7px 10px;border-radius:5px;max-width:100%;
background:linear-gradient(180deg,#fffdf6,#f1ebdc);border:1.5px solid rgba(74,95,122,.32);color:var(--ink1)}
.pwTrump b{display:block;font-size:12px;color:#3d4f6b}
.pwTrump span{display:block;font-size:11.5px;color:var(--ink3);margin-top:2px}
.pwTrump:hover{border-color:rgba(74,95,122,.7);background:linear-gradient(180deg,#f6f8fb,#e7edf5)}
.pwTrump:active{transform:scale(.985)}
.pwTrumpUsed{display:inline-flex;align-items:center;padding:6px 9px;border-radius:5px;font-size:11.5px;
color:var(--ink3);border:1px dashed rgba(32,36,42,.2);background:rgba(255,255,255,.35)}
.pwTrumpsNone{display:flex;gap:10px;align-items:baseline}
.pwTrumpsNone b{font-size:12px;color:var(--ink2);white-space:nowrap}
.pwTrumpsNone span{font-size:12px;line-height:1.6;color:var(--ink3)}
.pwDeprived{margin:9px 0 2px;padding:9px 12px;border-left:3px solid #8b2f24;background:rgba(168,57,44,.07);
display:flex;flex-direction:column;gap:3px}
.pwDeprived b{font-size:12px;color:#8b2f24;letter-spacing:.5px}
.pwDeprived span{font-size:12px;line-height:1.6;color:var(--ink2)}
@media (max-width:760px){ .pwTrumpsNone{flex-direction:column;gap:3px} }
@media(prefers-reduced-motion:reduce){ .pwTrump:active{transform:none} }
/* ===== v184 越界诱惑：只写他说了什么，不写风险 ===== */
.pwTempt{margin:10px 0 4px;padding:9px 11px;border:1px dashed rgba(94,78,54,.34);
background:rgba(128,104,70,.05);border-radius:5px}
.pwTemptHead{display:flex;justify-content:space-between;align-items:baseline;gap:10px;font-size:12px;color:var(--ink3)}
.pwTemptHead b{font-size:12px;color:#5a4a34;letter-spacing:.5px}
.pwTemptRow{display:flex;flex-wrap:wrap;align-items:center;gap:8px;margin-top:7px}
.pwTemptBy{flex:1 1 12em;font-size:11.5px;line-height:1.55;color:var(--ink3)}
.pwTemptBtn{font:inherit;text-align:left;cursor:pointer;padding:6px 10px;border-radius:5px;max-width:100%;
background:linear-gradient(180deg,#fffdf7,#efe7d6);border:1.5px solid rgba(94,78,54,.32);color:var(--ink1)}
.pwTemptBtn b{display:block;font-size:12px;color:#5a4a34}
.pwTemptBtn span{display:block;font-size:11.5px;color:var(--ink2);margin-top:2px}
.pwTemptBtn:hover{border-color:rgba(94,78,54,.72);background:linear-gradient(180deg,#fbf7ec,#e9dfc9)}
.pwTemptBtn:active{transform:scale(.985)}
.pwTemptLog{display:flex;flex-direction:column;gap:1px}
/* 越界记录的那几行也用了 .ptRow 这个名字：不圈在 .pwTemptLog 里，
会把人物卡的 .ptHead / .pmLine 一起拉成一行，角色列被挤到 11px 逐字换行。 */
.pwTemptLog .ptRow{display:flex;gap:9px;align-items:baseline;font-size:12px;line-height:1.6;color:var(--ink2);padding:3px 0}
.pwTemptLog .ptRow .ptDay{font-size:11.5px;color:var(--ink3);white-space:nowrap}
.pwTemptLog .ptRow>b{flex:1 1 auto;color:var(--ink1);font-weight:600}
.pwTemptLog .ptRow>i{font-style:normal;font-size:11.5px;color:var(--ink3);white-space:nowrap}
@media (max-width:760px){ .pwTemptRow{flex-direction:column;align-items:stretch} .pwTemptBy{flex:none} }
@media(prefers-reduced-motion:reduce){ .pwTemptBtn:active{transform:none} }
/* 落笔之后：选了什么、账上实际动了多少、按下去有没有手感 */
.doc.settle{animation:settleIn .22s ease-out both}
@keyframes settleIn{from{opacity:.35;transform:translateY(5px)}to{opacity:1;transform:none}}
.pickLine{display:flex;gap:8px;align-items:baseline;margin:2px 0 8px;font-size:12px;line-height:1.6;color:var(--ink2)}
.pickLine b{font-size:11.5px;color:var(--ink3);letter-spacing:.5px;white-space:nowrap}
.pickLine span{color:var(--ink1);font-weight:600}
.settleBox{display:flex;flex-wrap:wrap;gap:5px 6px;align-items:center;margin:8px 0 6px;padding:8px 10px;border-radius:4px;
border:1px solid rgba(74,95,122,.18);background:rgba(255,255,255,.42)}
.sbTag{font-size:11.5px;color:var(--ink3);letter-spacing:.5px;margin-right:2px}
.sbNone{font-size:11.5px;color:var(--ink3)}
.settleBox.quiet{background:rgba(128,104,70,.05);border-style:dashed}
.act:active:not([disabled]){transform:translateX(2px) scale(.99);background:#fff}
.btn:active{transform:scale(.98)}
@media(prefers-reduced-motion:reduce){ .doc.settle{animation:none} }
/* ===== v189 动作回执 · v235 重画（用户"这种反馈提升显示也太丑了而且显示明显 框也不好看"） =====
两处病：① 浮版 720px 通栏、z-index 90（比 .modal 的 50 还高），上一张挂在 body 上不肯走，
这期间新开的框会被它压在头上——作者截图那条正是"半张便签骑在面板标题上"；
② 本体是一整条色块 + 四枚描边按钮，读起来像报错横幅，不像这张纸上的一枚便签。
改法：宽度 720→460；外观换成纸白小条（细边 + 左沿一道状态色 + 内上沿一道高光），
三个后续入口去掉边框、用竖线分隔；停留 12s→9s，到点先淡出再摘；UI.modal() 开门时先收掉上一张浮版。
⚠ 下面这条 top 只是**量不出来时的兜底**：真正的落点是 UI.recPlace() 上屏后逐条横带量出来的
（钉着的队列/门坞是硬墙，会滚走的 HUD 是软墙），因为底部那条横带在窄屏正好被 .queue 通栏躺占，
而 HUD 在竖屏又随页滚走——写死 top 或 bottom 必有一档压在别人身上，别把它改回唯一真相。
z-index 45 是硬约束：高于 chrome 的 30、低于 .modal 的 50，浮条物理上不可能再盖到面板头上。 */
.actReceipt{display:flex;flex-wrap:wrap;align-items:center;gap:3px 10px;margin:0 0 12px;padding:6px 11px;
position:sticky;top:-14px;z-index:6;
background:linear-gradient(180deg,#fbf7ec,#f1e9d9);border:1px solid rgba(120,102,72,.30);
border-left:3px solid var(--police);border-radius:2px;
box-shadow:inset 0 1px 0 rgba(255,255,255,.72),0 3px 10px rgba(40,34,24,.13);
animation:recIn .16s ease-out;transition:opacity .26s ease-out}
.actReceipt.good .arTag{color:var(--bamboo)}
.actReceipt.bad{border-left-color:#8b2f24} .actReceipt.bad .arTag{color:#8b2f24}
.actReceipt.out{opacity:0}
.actReceipt .arTag{font-family:var(--kai);font-size:11.5px;letter-spacing:1px;color:var(--police);white-space:nowrap}
.actReceipt .arText{flex:1 1 10em;min-width:0;font-size:12px;line-height:1.6;color:var(--ink1)}
.actReceipt .arGo{display:flex;align-items:center;gap:0;margin-left:auto;flex-wrap:wrap}
.actReceipt .arGo button{font-family:var(--ui);font-size:11.5px;letter-spacing:.5px;padding:3px 8px;
border:0;border-radius:2px;cursor:pointer;background:none;color:var(--ink3)}
.actReceipt .arGo button+button{border-left:1px solid rgba(120,102,72,.26);border-radius:0}
.actReceipt .arGo button:hover{background:rgba(38,69,111,.08);color:var(--police)}
.actReceipt .arX{padding:3px 7px !important;border-left:0 !important;font-size:14px !important;line-height:1;
color:var(--ink3) !important;background:none !important}
.actReceipt .arX:hover{color:#8b2f24 !important;background:none !important}
.actReceipt.float{position:fixed;left:50%;transform:translateX(-50%);top:calc(var(--hudH,155px) + 10px);
width:min(460px,calc(100vw - 24px));margin:0;z-index:45;animation:recInF .16s ease-out;
box-shadow:inset 0 1px 0 rgba(255,255,255,.72),0 6px 18px rgba(20,24,30,.26)}
@keyframes recIn{from{opacity:0;transform:translateY(5px)}to{opacity:1;transform:none}}
@keyframes recInF{from{opacity:0;transform:translate(-50%,-6px)}to{opacity:1;transform:translate(-50%,0)}}
@media (max-width:760px){ .actReceipt{top:-10px} .actReceipt.float{width:calc(100vw - 20px)} }
@media (prefers-reduced-motion:reduce){ .actReceipt,.actReceipt.float{animation:none} }
/* ===== v190 主线与人生年表：两条线，各写各的一页 ===== */
.stList{display:flex;flex-direction:column;gap:0;padding:4px 2px}
.stRow{display:flex;gap:9px;align-items:flex-start;padding:7px 4px;border-bottom:1px dashed rgba(32,36,42,.12)}
.stRow:last-child{border-bottom:0}
.stNo{flex:0 0 22px;width:22px;height:22px;border-radius:50%;display:flex;align-items:center;justify-content:center;
font-size:11.5px;line-height:1;color:var(--ink3);border:1px solid rgba(32,36,42,.22);background:rgba(255,255,255,.5)}
.stRow.done .stNo{color:#fff;background:var(--bamboo);border-color:var(--bamboo)}
.stRow.now .stNo{color:#fff;background:var(--police);border-color:var(--police)}
.stRow.miss .stNo{color:#8b2f24;border-color:rgba(139,47,36,.45);background:rgba(168,57,44,.06)}
.stBody{flex:1 1 auto;min-width:0;display:flex;flex-direction:column;gap:1px}
.stBody b{font-size:12px;line-height:1.5;color:var(--ink1);font-weight:600}
.stSub{font-size:11.5px;line-height:1.55;color:var(--ink3)}
.stTag{flex:0 0 auto;font-size:11.5px;line-height:1.5;padding:1px 6px;border-radius:3px;white-space:nowrap;
color:var(--ink3);border:1px solid rgba(32,36,42,.16);background:rgba(255,255,255,.45)}
.stTag.done{color:#4d6b58;border-color:rgba(95,127,107,.4);background:rgba(95,127,107,.1)}
.stTag.now{color:#3d4f6b;border-color:rgba(74,95,122,.45);background:rgba(74,95,122,.1)}
.stTag.miss{color:#8b2f24;border-color:rgba(139,47,36,.35);background:rgba(168,57,44,.07)}
.stRow.lock .stBody b{color:var(--ink2)}
.stNow{margin:10px 0 6px;padding:10px 12px;border:1px solid rgba(74,95,122,.24);border-radius:5px;
background:linear-gradient(180deg,rgba(255,255,255,.55),rgba(74,95,122,.04))}
.stNow .docBody{margin:0 0 8px}
.stAct{position:relative}
.stLock{display:block;font-size:11.5px;line-height:1.5;color:#8b2f24;margin-top:3px}
.storyMini .grid4{gap:8px}
@media (max-width:760px){
.stRow{flex-wrap:wrap}
.stTag{margin-left:31px}
.stNow{padding:9px 10px}
}
.stNowHead{display:flex;flex-wrap:wrap;gap:4px 10px;align-items:baseline;margin-bottom:5px}
.stNowHead b{font-size:12px;color:var(--ink1);letter-spacing:.3px}
.stNowHead span{font-size:11.5px;color:var(--ink3)}
/* ===== v193 主线旧事加成：前面选过的，后面那一页认账 ===== */
.stMem{font-size:11.5px;color:#4d6b58;font-weight:700;letter-spacing:.3px}
.act .need b.stMem{color:#4d6b58}
.stMemLine{margin:7px 0;padding:7px 10px;border-left:3px solid #4d6b58;background:rgba(95,127,107,.08);
font-size:12px;line-height:1.65;color:var(--ink2)}
.stMemLine b{font-size:11.5px;color:#4d6b58;letter-spacing:.3px}
.act .need b.stMem.bad{color:#8b2f24}
.stMemLine.bad{border-left-color:#8b2f24;background:rgba(168,57,44,.06)}
.stMemLine.bad b{color:#8b2f24}
/* ===== v198 关系网 · 活人：位置随任免改变 ===== */
.npcCard.rival{border-color:rgba(139,47,36,.32)}
.npcTag.netRel{color:#3d4f6b;border-color:rgba(74,95,122,.3);background:rgba(74,95,122,.06)}
.netMove{margin:5px 0 0;font-size:11.5px;line-height:1.55;color:#4d6b58}
.netPromo{margin:10px 0 4px;padding:10px 12px;border:1px solid rgba(74,95,122,.22);border-radius:5px;
background:linear-gradient(180deg,rgba(255,255,255,.55),rgba(74,95,122,.035))}
.netCols{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin:8px 0}
.netColT{font-size:11.5px;color:var(--ink3);letter-spacing:.5px;margin-bottom:4px}
.netRow{display:flex;flex-wrap:wrap;gap:4px 8px;align-items:baseline;padding:4px 0;border-bottom:1px dashed rgba(32,36,42,.1);font-size:11.5px;color:var(--ink3)}
.netRow:last-child{border-bottom:0}
.netRow b{font-size:12px;color:var(--ink1);white-space:nowrap}
.netRow span{flex:1 1 9em;min-width:0}
.netRow i{font-style:normal;white-space:nowrap;color:#3d4f6b}
.netRec{margin:7px 0;padding:6px 9px;border-left:3px solid #4d6b58;background:rgba(95,127,107,.07);
font-size:11.5px;line-height:1.6;color:var(--ink2)}
.netLog .logLine{font-size:12px}
@media (max-width:760px){ .netCols{grid-template-columns:1fr} }
.netActs{display:flex;flex-wrap:wrap;align-items:center;gap:5px 8px;margin-top:6px}
.netAskTxt{font-size:11.5px;line-height:1.5;color:var(--ink3);flex:1 1 10em}
/* ===== v203–v204 · 折叠 dock：组头小牌 + 顶部头图 =====
三枚组头图标是矢量小牌（纸纹 + 矿物色 + 墨线），在 24px 下也不会糊；
图标本身带底色，所以不再叠旧的单色渐变方块。v204 去掉宽窄栏把手，
顶部换成一张横幅头图：桌面显示完整“警务人生”，窄屏裁成左侧徽记。 */
.leftDock .dockGrp .dockGrpHead{
padding:4px 6px;border:1px solid rgba(32,36,42,.10);border-left:2px solid transparent;
border-radius:6px;background:linear-gradient(180deg,rgba(255,255,255,.42),rgba(246,241,229,.16));
box-shadow:inset 0 1px 0 rgba(255,255,255,.55);font-family:var(--ui);
transition:background .16s,border-color .16s,transform .16s;
}
.leftDock .dockGrp .dockGrpHead:hover{
background:linear-gradient(180deg,rgba(255,255,255,.72),rgba(250,245,234,.38));
transform:translateY(-1px);
}
.leftDock .dockGrp.fold .dockGrpHead{background:linear-gradient(180deg,rgba(255,255,255,.56),rgba(246,241,229,.24))}
.leftDock .dockGrp[data-grp="duty"] .dockGrpHead{border-left-color:rgba(74,95,122,.62)}
.leftDock .dockGrp[data-grp="place"] .dockGrpHead{border-left-color:rgba(138,106,61,.66)}
.leftDock .dockGrp[data-grp="file"] .dockGrpHead{border-left-color:rgba(63,107,88,.66)}
.leftDock .dockGrp .grpGlyph{
width:22px;height:22px;flex:0 0 22px;border-radius:5px;
background-color:#3d4f66;background-size:cover;background-position:center;background-repeat:no-repeat;
color:transparent;font-size:0;line-height:0;
box-shadow:0 2px 5px rgba(30,25,18,.24),inset 0 0 0 1px rgba(255,248,235,.18);
}
.leftDock .dockGrp[data-grp="duty"] .grpGlyph{background-image:url(../assets/ic_grp_duty.svg)}
.leftDock .dockGrp[data-grp="place"] .grpGlyph{background-image:url(../assets/ic_grp_place.svg);background-color:#755835}
.leftDock .dockGrp[data-grp="file"] .grpGlyph{background-image:url(../assets/ic_grp_file.svg);background-color:#2d4f3f}
.leftDock .dockGrp .grpName{font-size:13px;letter-spacing:1.5px;color:var(--ink2)}
.leftDock .dockGrp .dockGrpHead:hover .grpName{color:var(--ink)}
.leftDock .dockGrp .grpArrow{
width:7px;height:7px;flex:0 0 7px;font-size:0;line-height:0;color:transparent;
border-right:1.5px solid var(--ink3);border-bottom:1.5px solid var(--ink3);
transform:rotate(45deg);margin:0 3px 0 auto;
}
.leftDock .dockGrp.fold .grpArrow{transform:rotate(-45deg)}
.leftDock .dockGrp .grpBadge{box-shadow:0 1px 0 rgba(255,255,255,.35),0 2px 5px rgba(139,47,36,.26)}
.leftDock .dockHead{
width:100%;height:50px;flex:0 0 50px;border-radius:7px;overflow:hidden;
background:#1d2c3b url(../assets/dock_head.svg) center/cover no-repeat;
box-shadow:0 2px 6px rgba(30,25,18,.20),inset 0 0 0 1px rgba(255,248,235,.14);
}
@media (max-width:1000px){
.leftDock .dockHead{
width:46px;height:46px;flex:0 0 46px;border-radius:7px;
background-image:url(../assets/ic_grp_duty.svg);background-size:cover;background-position:center;
}
}
/* ===== v205 · HUD 水墨头图 + 右侧日期牌 =====
顶栏改成四段：身份 / 速度 / 属性 / 日期季节。
日期与季节从中间挪到最右侧，做成一张带朱砂书脊的纸牌；
底图是透明的水墨街景，叠在纸纹与浅色渐变下面，不抢正文。 */
.hud{
align-items:center;
background:
linear-gradient(180deg,rgba(255,253,246,.87) 0%,rgba(249,244,233,.76) 54%,rgba(243,238,226,.66) 100%),
url(../assets/hud_head.svg) center bottom/cover no-repeat,
url(../assets/art_paper_tile.webp) left top/240px repeat;
}
.hudC{display:flex;align-items:center;justify-content:center;padding:0 14px;border-left:1px solid var(--line)}
.hudC .speed{margin-top:0 !important}
.hudDate{
position:relative;flex:0 0 auto;min-width:246px;max-width:320px;margin:0 24px 0 14px;
padding:8px 12px 8px 15px;border:1px solid rgba(32,36,42,.14);border-left:3px solid var(--cinnabar);
border-radius:5px;display:flex;flex-direction:column;gap:3px;
background:linear-gradient(180deg,rgba(255,253,246,.94),rgba(244,238,225,.84));
box-shadow:0 2px 8px rgba(40,34,24,.10),inset 0 1px 0 rgba(255,255,255,.72);
}
.hudDate::before{
content:"";position:absolute;inset:4px;border:1px dashed rgba(32,36,42,.10);border-radius:3px;pointer-events:none;
}
.hudDateTop{position:relative;z-index:1;display:flex;align-items:center;gap:6px;min-height:17px}
.hudKick{font-family:var(--ui);font-size:11.5px;letter-spacing:1.5px;color:var(--ink3)}
.hudKick::after{content:"·";margin-left:2px;color:var(--line)}
.hudYear{margin-left:auto;font-family:var(--mono);font-size:11.5px;letter-spacing:.5px;color:var(--police);white-space:nowrap}
.hudDate .clockRow{position:relative;z-index:1;justify-content:flex-start;gap:8px;margin:0;flex-wrap:nowrap}
.hudDate .clock{
font-family:var(--fz);font-size:19px !important;font-weight:700;letter-spacing:1px !important;
padding:0 !important;border-left:0 !important;background:none !important;color:var(--ink);
}
.hudDate .dutyChip{font-size:11.5px !important;padding:1px 6px !important;letter-spacing:1px !important}
.hudDate .wxChip{margin-left:0 !important;font-size:11.5px !important;padding:2px 8px;white-space:nowrap}
@media (max-width:1000px){
.hudDate{order:2;flex:1 1 calc(100% - 24px);max-width:calc(100% - 24px);margin:6px 12px 0;
flex-direction:row;flex-wrap:wrap;align-items:center;gap:4px 12px}
.hudDateTop{flex:0 0 auto;min-height:0}
.hudDate .clockRow{flex:1 1 auto;min-width:0;flex-wrap:wrap}
.hudR{order:3}
}
@media (max-width:700px){
.hudDate{padding:7px 9px 7px 12px}
.hudDate .clock{font-size:17px !important}
.hudDate .wxChip{display:inline-flex}
.hudC{order:1;padding-left:0;border-left:0}
}
/* ===== v208 · HUD 头图条 / 纸牌纹理 / 速度钮资源 ===== */
.hudMast{
flex:1 1 100%;order:-1;width:100%;height:54px;margin:-12px 0 4px;
background:url(../assets/hud_mast.svg) center/100% 100% no-repeat;
border-bottom:1px solid rgba(32,36,42,.18);
box-shadow:0 2px 7px rgba(30,25,18,.16);
}
@media (max-width:1000px){ .hudMast{display:none} }
@media (max-width:700px){ .hud{padding-top:8px !important;padding-bottom:8px !important} }
/* 顶部纸底：值班表细格 + 水墨街景 + 右下淡印章 */
.hud{
background:
linear-gradient(180deg,rgba(255,253,246,.87) 0%,rgba(249,244,233,.76) 54%,rgba(243,238,226,.66) 100%),
repeating-linear-gradient(90deg,rgba(38,69,111,.026) 0 1px,transparent 1px 52px),
url(../assets/hud_head.svg) center bottom/cover no-repeat,
url(../assets/art_paper_tile.webp) left top/240px repeat;
}
.hud::after{
content:"";position:absolute;right:340px;bottom:-28px;width:104px;height:104px;
background:url(../assets/ic_date_seal.svg) center/contain no-repeat;
opacity:.055;transform:rotate(-9deg);pointer-events:none;
}
@media (max-width:1000px){ .hud::after{display:none} }
/* 当值牌：日历格纸纹 + 折角 + 朱砂小印 */
.hudDate{
background:
linear-gradient(180deg,rgba(255,253,246,.95),rgba(244,238,225,.86)),
repeating-linear-gradient(90deg,rgba(38,69,111,.038) 0 1px,transparent 1px 26px);
}
.hudDate::after{
content:"";position:absolute;right:0;top:0;width:14px;height:14px;pointer-events:none;
background:linear-gradient(225deg,rgba(255,253,246,.98) 0 49%,rgba(32,36,42,.11) 50% 100%);
border-bottom-left-radius:3px;
}
.hudKick{display:inline-flex;align-items:center;gap:4px}
.hudKick::before{
content:"";width:14px;height:14px;flex:0 0 14px;
background:url(../assets/ic_date_seal.svg) center/contain no-repeat;
}
.hudKick::after{
content:"";width:16px;height:1px;margin-left:2px;
background:linear-gradient(90deg,rgba(32,36,42,.28),transparent);
}
.hudYear{
padding:1px 6px;border:1px solid rgba(38,69,111,.18);border-radius:2px;
background:rgba(38,69,111,.05);
}
/* 暂停 / 播放：墨线图标 + 金边印章钮 */
.hudC .spMain{
width:34px !important;height:34px !important;border-radius:50% !important;
background:linear-gradient(180deg,#3f5d7e,#22384f) !important;
border:1px solid rgba(224,189,120,.55) !important;
box-shadow:0 0 0 2px rgba(224,189,120,.12),0 3px 8px rgba(38,69,111,.35),inset 0 1px 0 rgba(255,255,255,.25) !important;
}
.hudC .spMain::before{
content:"" !important;position:absolute;inset:0;margin:auto;width:15px;height:15px;
background-color:#f7edd8;font-size:0 !important;
-webkit-mask:url(../assets/sp_pause.svg) center/contain no-repeat;
mask:url(../assets/sp_pause.svg) center/contain no-repeat;
}
.hudC .spMain.on{background:linear-gradient(180deg,#b84a3a,#7d2a1d) !important}
.hudC .spMain.on::before{
width:14px;height:14px;
-webkit-mask-image:url(../assets/sp_play.svg);mask-image:url(../assets/sp_play.svg);
}
/* 1× / 3×：纸面速度盘，选中时墨底金边，右下角一枚速度纹样 */
.hudC .spGroup{
padding:3px !important;gap:3px !important;border-radius:20px !important;
background:linear-gradient(180deg,rgba(255,255,255,.86),rgba(243,238,226,.72)) !important;
border:1px solid rgba(32,36,42,.16);
box-shadow:inset 0 1px 0 rgba(255,255,255,.72);
}
.hudC .spGroup .spBtn{
position:relative;width:38px !important;height:28px !important;border-radius:14px !important;
background:transparent !important;color:var(--ink2) !important;font-family:var(--mono);font-weight:700;
}
.hudC .spGroup .spBtn::after{
content:"";position:absolute;right:5px;top:5px;width:12px;height:12px;background:currentColor;
opacity:.18;pointer-events:none;
-webkit-mask:url(../assets/sp_speed.svg) center/contain no-repeat;
mask:url(../assets/sp_speed.svg) center/contain no-repeat;
}
.hudC .spGroup .spBtn.on{
background:linear-gradient(180deg,#3f5d7e,#22384f) !important;color:#f7edd8 !important;
box-shadow:0 1px 4px rgba(38,69,111,.35),inset 0 0 0 1px rgba(224,189,120,.42);
}
.hudC .spGroup .spBtn.on::after{opacity:.35}
.hudC .spGroup .spBtn.on:hover{background:linear-gradient(180deg,#3f5d7e,#22384f) !important;color:#f7edd8 !important}
/* 跳 / 声：纸签 + 墨线小图标 */
.hudC .spSkip{
height:28px !important;padding:0 9px 0 7px !important;border-radius:14px !important;
display:inline-flex;align-items:center;gap:4px;
background:linear-gradient(180deg,rgba(255,253,246,.86),rgba(243,238,226,.68));
border:1px solid rgba(32,36,42,.16);color:var(--ink2);
box-shadow:inset 0 1px 0 rgba(255,255,255,.7);
}
.hudC .spSkip::before{
content:"";width:13px;height:13px;flex:0 0 13px;background:currentColor;opacity:.8;pointer-events:none;
-webkit-mask:url(../assets/sp_skip.svg) center/contain no-repeat;
mask:url(../assets/sp_skip.svg) center/contain no-repeat;
}
.hudC .spSkip.spSfx::before{-webkit-mask-image:url(../assets/sp_sound.svg);mask-image:url(../assets/sp_sound.svg)}
.hudC .spSkip.on{
background:linear-gradient(180deg,#5f7f6b,#3f5f4b);color:#f0f5ee;border-color:transparent;
box-shadow:0 2px 6px rgba(63,95,75,.32);
}
/* ===== v209 · 缺口插图 + 四条线立绘框 ===== */
.art.det{background-image:url(../assets/art_det.webp)}
.art.law{background-image:url(../assets/art_law.webp)}
.art.sup{background-image:url(../assets/art_sup.webp)}
.art.net{background-image:url(../assets/art_net.webp)}
.art.story{background-image:url(../assets/art_story.webp)}
.art.pros{background-image:url(../assets/art_pros.webp)}
.art.det,.art.law,.art.sup,.art.net,.art.story,.art.pros{background-position:center 45%;background-size:cover}
/* 立绘：保留原画，只加一层纸本边框与线色小印 */
.lineArt::after{
background-image:linear-gradient(180deg,rgba(255,255,255,0),rgba(38,57,44,.12));
background-size:100% 100%;background-repeat:no-repeat;
}
/* v278：v209 那四张 portrait_frame_*.svg 的引用整段撤掉。
v216 的 .lineArt::after,.pImg::after{background-image:none !important} 早把这几条压成死链，
留着只会让静态 [13] 一直去找那四张已经进 _superseded/ 的图；装裱现在由 ::before 的四角短线负责。 */
/* ===== v211 · HUD 报头收拢：一条竖线 / 两极排布 / 速度成一枚控制条 =====
1460 视口实测（容器 1280 居中，x 90→1370）三处"乱"各有数：
① 报头铺满容器（90→1370），内容列却被 .hudL 的 padding-left:24 推到 113 —— 左右各差 23px，
看上去像两张纸没对齐；报头底边 y54 到第一行 y78 又空 26px，加上一圈投影描边，横幅是悬空的。
② .hudC 宽 478，里面的速度簇只有 214，被 justify-content:center 摆在正中，左右各空 133px
—— 身份 / 速度 / 日期牌成了三座孤岛。
③ .hudYear 的 margin-left:auto 把"当值"与"第1年"拉开 165px，日期牌第一行是一个空洞。
④ .spSkip 写死 width:36，装不下"图标13+缝4+字13+padding16"，scrollWidth 溢出 3px。
⑤ 五枚速度钮三种形状：34 圆印 / 87 胶囊 / 36×28 纸签 ×2，谁也不挨着谁。
收法：报头让出 24px 与内容同一条竖线并贴住第一行（114→1346 一条内容列）；第一行改两极
—— 身份在左，速度轨 + 日期牌成一组推到右，中间那道空是留白不是散架；五枚钮装进同一条
36px 纸轨、等高 28、同一圆角；日期牌第一行收拢成"当值 · 第1年"。 */
/* v213：带子从 46 抬到 66（用户"上面的头图还可以设计宽一点嘛？太窄了"），
资源同步按 1400×75 重画——渲染框 1232×66 正好是 18.7:1，标题从 27 放到 38。 */
.hudMast{
height:66px;margin:-12px 24px 0 !important;border-bottom:0;box-shadow:none;
background:url(../assets/hud_mast.svg) center/100% 100% no-repeat;
}
/* v49 那片 .hud{gap:20px !important} 把行距钉死在 20，报头与第一行之间就是那 26px 的悬空 */
.hud{row-gap:8px !important}
/* 速度轨：一条纸面上摆五枚等高的钮，选中那枚才抬起来 */
.hudC .speed{
margin-top:0 !important;gap:5px !important;height:36px;padding:0 4px;
border:1px solid rgba(32,36,42,.15);border-radius:18px;
background:linear-gradient(180deg,rgba(255,255,255,.9),rgba(243,238,226,.72));
box-shadow:inset 0 1px 0 rgba(255,255,255,.72);
}
.hudC .spMain{width:28px !important;height:28px !important;flex:0 0 28px;border-radius:50% !important}
.hudC .spMain::before{width:13px;height:13px}
.hudC .spGroup{
padding:0 !important;gap:2px !important;border:0;border-radius:0 !important;
background:none !important;box-shadow:none;
}
.hudC .spGroup .spBtn{width:34px !important;height:28px !important;border-radius:14px !important}
.hudC .spGroup .spBtn::after{display:none}
.hudC .spSkip{
width:auto !important;min-width:40px;height:28px !important;padding:0 8px !important;
border-radius:14px !important;background:none;border:0;box-shadow:none;
}
.hudC .spSkip.on{
background:linear-gradient(180deg,#5f7f6b,#3f5f4b) !important;color:#f0f5ee !important;
border-radius:14px;box-shadow:0 1px 4px rgba(63,95,75,.3);
}
/* 日期牌：第一行不再被拉成一条横线；宽度上限要容得下"时刻 + 天候"那一行（320 是实测值） */
.hudYear{margin-left:6px}
.hudDate{min-width:204px;max-width:320px}
.hudDateTop{gap:6px}
@media (min-width:1001px){
.hudL{flex:0 1 auto;max-width:none}
.hudC{flex:0 0 auto;margin-left:auto;padding:0 0 0 14px;border-left:0;position:relative}
.hudDate{flex:0 0 auto}
/* 两极之间那道空要读成"值班表上的引线"，不是散架：一道由纸色淡进墨色的细线 */
.hudC::before{
content:"";position:absolute;top:50%;right:calc(100% + 16px);width:min(300px,22vw);height:1px;
background:linear-gradient(90deg,rgba(32,36,42,0),rgba(32,36,42,.16));pointer-events:none;
}
/* 属性板与身份块、报头共用同一条左竖线（114） */
.hudR{padding:1px 24px 0 24px;border-left:0}
}
@media (max-width:1000px){
.hudC{padding:0 14px}
.hudR{padding:0 24px 0 18px}
}
/* ===== v214 · 撤掉抬头朱砂线与 HUD 上那枚岗位印（用户："去掉那个印章和最上面的红线"） =====
`.hud::before` 是 v49 那批"抬头朱砂线"：前 96px 朱砂、往后转墨再淡出。报头当年铺满容器时它被整条盖住；
v211 报头让出 24px 之后，那截朱砂从报头左边露出来，读起来像屏幕顶上一条没对齐的红杠。
整条撤掉，不再靠报头去盖它。岗位印 #hudSeal 连同 index.html 里的节点与 UI.renderHud 那行写入一起删；
老层里的 .hudL .seal（2465/3529/3587）因此是有意留下的孤儿规则——本文件按版本追加、老规则从不删除。 */
.hud::before{display:none}
/* ===== v215 · 结局页卷首图 + 落款朱印（"继续做美术工作"） =====
十四种收场以前只有一段字和一张表。现在按"这一收落在哪儿"发五张横卷：
gaoguang 报告厅顶光 / luodie 夜里的街与那扇亮着的窗 / likai 走廊尽头推开的门 /
tiechuang 高窗与窗栏 / shangwang 摘下的帽与那一盆绿萝。
`.endWrap .art` 是出血卷首：左边让出 .doc::before 那 4px 朱砂/赭金竖线，其余三边贴到纸边；
纸上的 .art::after 压暗渐变是面板插图用的，横卷在这里要淡一档，否则画面读不出。
**源图 1200×300 不是随手定的**：`cover`+`center` 下盒子 538×132（≈4.08:1），老尺寸 1200×160（7.5:1）
横向被切掉 46%——警徽与红旗永远落在画外。4:1 让 1280 看到全宽，375 看到 x 110..1090。 */
.endWrap .art.end{
height:132px;margin:-14px -15px 12px -11px;border:0;border-radius:0;
background-position:center;background-size:cover;background-repeat:no-repeat;
}
.endWrap .art.end::after{background:linear-gradient(180deg,rgba(243,238,226,.03),rgba(18,26,36,.30))}
.art.end.gaoguang{background-image:url(../assets/art_end_gaoguang.svg)}
.art.end.luodie{background-image:url(../assets/art_end_luodie.svg)}
.art.end.likai{background-image:url(../assets/art_end_likai.svg)}
.art.end.tiechuang{background-image:url(../assets/art_end_tiechuang.svg)}
.art.end.shangwang{background-image:url(../assets/art_end_shangwang.svg)}
/* 落款：签名单元右侧一枚压纸的朱印。padding-right 是给它留的位，窄屏也压不到姓名与职务 */
.rowStamp{position:relative;padding-right:54px}
.endSeal{
position:absolute;right:0;top:-15px;width:44px;height:44px;
background:url(../assets/ic_end_seal.svg) center/contain no-repeat;
transform:rotate(-7deg);opacity:.88;pointer-events:none;
}
@media (max-width:700px){
.endWrap .art.end{height:104px}
.endSeal{width:38px;height:38px;top:-11px}
}
/* ===== v216 · 立绘框改 3:4、撤掉侧栏那串"在职立绘"（用户："看这个立绘上的乱框和乱字 不行就取消了"） =====
两处病各有成因，都不是"再调调参数"能盖住的：
① 乱框：v209 那四张 portrait_frame_*.svg 画在 768×768 的方框上，宿主 .lineArt 是 120×160、
.pImg 是 aspect-ratio:3/4，而 CSS 写的是 background-size:100% 100% —— 整张图被纵向拉 1.33 倍。
62px 的角括变成 62×83 的钩子，右下角那枚 64×64 的线色小印变成一块压在胸口的长方形，
加上外框/内金线/左上那道 M64 64v72 的多余笔、底边一条金线，四五种线各自错位 = "乱框"。
重画成 600×800（与两个宿主同比），只留外框 + 一道内金线 + 四角括 + 底心一个装订点，
描边按 120px 渲染宽算：5/600≈1px、7/600≈1.4px，看得见也不糊。
② 乱字：.pSeal 同时写了 writing-mode:vertical-rl 和字与字之间的
。竖排里
是"换一列"，
于是"在/职/立/绘"从上下变成右→左四列，看着就是一串反写的乱码；盒子只有 22px 宽，
四列撑到约 46px，从立绘右上角溢出压在人脸上。节点已从 UI.renderSide 删掉，这里把规则钉死，
免得以后谁再往侧栏塞同名 class。老 .pSeal（495）因此是有意留下的孤儿规则。 */
.pSeal{display:none}
/* ===== v216b · 装裱框改 CSS 画：四角短线 + 线色描边，任何宿主宽高比都不会变形 =====
接着上面那条量出来的账：出身卡的宿主根本不是 3:4。v96 的
`.startScreen .lineArt{width:100%;height:198px}`（2267，特异性 0,2,1）压掉了 402 行的 120×160，
1280 档实测 550×198 = 2.778:1、560 档 526×168 = 3.131:1。把 3:4 的框图按 100% 100% 贴上去，
横向被拉 3.7 倍：竖边 4.6px、横边 1.2px，角括变成两道浅钩——比侧栏那张 1.33 倍的还难看。
宿主比例每档都在变，所以换几张同比的 svg 也只是把问题挪个地方。改成 CSS 画：
四角各一道定长短线（linear-gradient 当尺子用，px 写死），侧栏再补一道线色描边。
::after 让给老规矩（v209 那四条 .lineCard[data-k] .lineArt::after 特异性到 0,3,1，
#pCard[data-k] .pImg::after 还带 ID），新框画在空着的 ::before 上，并把 ::after 的图钉成 none。 */
.lineArt::after,.pImg::after{background-image:none !important}
.lineArt::before,.pImg::before{
content:"";position:absolute;inset:0;pointer-events:none;z-index:2;
background:
linear-gradient(var(--lc),var(--lc)) 0 0/16px 2px no-repeat,
linear-gradient(var(--lc),var(--lc)) 0 0/2px 16px no-repeat,
linear-gradient(var(--lc),var(--lc)) 100% 0/16px 2px no-repeat,
linear-gradient(var(--lc),var(--lc)) 100% 0/2px 16px no-repeat,
linear-gradient(var(--lc),var(--lc)) 0 100%/16px 2px no-repeat,
linear-gradient(var(--lc),var(--lc)) 0 100%/2px 16px no-repeat,
linear-gradient(var(--lc),var(--lc)) 100% 100%/16px 2px no-repeat,
linear-gradient(var(--lc),var(--lc)) 100% 100%/2px 16px no-repeat,
linear-gradient(180deg,rgba(255,255,255,0) 62%,rgba(32,36,42,.14));
}
/* 出身卡：v96 定的"下缘溶进纸面、不留硬边"没破——只挂四角短线，不加整圈框 */
.lineCard[data-k="fujing"]{--lc:rgba(63,107,88,.85)}
.lineCard[data-k="keban"]{--lc:rgba(38,69,111,.85)}
.lineCard[data-k="minjian"]{--lc:rgba(138,106,61,.85)}
.lineCard[data-k="suozhang"]{--lc:rgba(168,57,44,.85)}
/* 侧栏立绘：描边跟着线色走（v209 那枚压在胸口的小印一并撤了，线色本身就是身份） */
#pCard[data-k="fujing"]{--lc:rgba(63,107,88,.9)}
#pCard[data-k="keban"]{--lc:rgba(38,69,111,.9)}
#pCard[data-k="minjian"]{--lc:rgba(138,106,61,.9)}
#pCard[data-k="suozhang"]{--lc:rgba(168,57,44,.9)}
.pImg{border:1px solid var(--lc,rgba(32,36,42,.35))}
/* ===== v217 · 字号阶梯归一：全站不许出现分数像素 =====
一轮遍历 7 个分区 + 39 扇门的全部文字节点，实测在用的字号有 17 档：
10 / 11.5 / 12 / 12.2 / 12.5 / 12.96 / 13 / 13.5 / 14 / 14.5 / 15 / 15.5 / 16 / 19 / 20 / 22。
病根不是"某处写小了"，是十几轮各改半号：v76 那套 --fs-* 是 14.5/12/11.5，v166 那套是 15.5/13/12.5，
同一屏里相邻两行差 0.5px，读起来就是"哪儿都差一点、又说不上来哪儿"。
尺子只有一条：除地板 11.5 之外全部整数。所以 19px（.stat .v / .gkNum 那一族大数字）本来就在梯子上，
别顺手"归到 20"——那会把一组同级的数字拆成两档。
改动：game.css 里 94 处半步一律向下取整（11.6→11.5 / 11.8·12.2·12.4·12.5→12 / 13.5→13 /
14.5→14 / 15.5→15；向下是为了不把已经收到位的 HUD 与表格再撑开），四封 em 字距换成 px
（.14em→1.6px、.02em→0.3px、.01em→0.2px；em 一乘字号就出 0.155px 这种分数值）。
下面这一层只留真在起作用的三条：token 由这一层说了算（1969 那套已被逐字对齐，改字号只改这里）、
.act > b 比正文 15px 抬一档到 16 撑"动作标题"、[data-ik=time] 原来靠 .93em/.96em 缩小，
em 一乘就出小数，改成 1em + 等宽数字——时辰这种信息该靠"等宽 + 淡色"分级，不该靠字号。 */
:root{
--fs-t1:22px; --fs-t2:17px; --fs-body:15px; --fs-sub:13px; --fs-num:12px;
}
.act > b{font-size:16px}
[data-ik="time"]{font-size:1em;font-variant-numeric:tabular-nums}
/* 心理与家计那六格下面的一行小注：原来写死 font-size:10px（破 11.5 地板），改成类走阶梯 */
.statTip{font-size:var(--fs-num);color:var(--ink3);line-height:1.5;margin-top:2px}
/* ===== v217b · 标题不许掉一个字在第二行（text-wrap） =====
这一层管的不是字号，是"换行落在哪儿"：
.docTitle/.mTitle/.big 这类标题两行时，默认贪心断行会把"警务人生 · 第 12 年 · 第 3 工作日"这种
串切成第二行只剩两个字，右边空一大截；balance 让两行宽度靠拢。
.docBody/.hintInk 是长文，pretty 管的是另一种难看：正文最后一行只挂一个字（孤行）。
断行权交给浏览器，数值与判定一步没动。样式表里这两条简写是生效的（computed text-wrap-style 读回 balance）；
但要临时关掉得写长写 text-wrap-style——这台引擎的 inline 赋 el.style.textWrap 会被静默吞掉。
typography() 的"换行"那条就是拿 300px 的框量短尾标题：balance 23px vs 贪心 auto 253px。 */
.docTitle,.mTitle,.sectTitle,.endWrap .big{text-wrap:balance}
.docBody,.hintInk,.act .need,.lawBox{text-wrap:pretty}
/* ===== v220 · 键盘焦点：走到哪都要看得见 =====
全站只有 :hover，没有一条 :focus 环——两处还把 UA 默认的环删掉了（.askRow/.noteRow 的
input:focus{outline:none}，这次一并撤了）。鼠标用户无所谓，键盘与开关用户是另一回事：
Tab 走到哪一枚按钮、39 扇门开到第几扇，屏幕上完全读不出来。
环画在元素内侧（outline-offset:-2px）而不是外侧：外环会被 .hud 那排 overflow 裁掉一半，
而且会压到相邻控件；内环不改布局、不会被裁，跟着 border-radius 走。
墨底 / 警蓝底 / 朱砂底上警蓝环等于没画，这三类按钮改走纸白 #f6efe1。 */
:where(button, [href], input, select, textarea, summary, [role="button"],
[tabindex]:not([tabindex="-1"])):focus-visible{outline:2px solid var(--police);outline-offset:-2px}
.btn-ink:where(:focus-visible),.btn-pol:where(:focus-visible),.btn-cinnabar:where(:focus-visible),
.spBtn.on:where(:focus-visible){outline-color:#f6efe1}
/* 辖区图那 12 个场所与警情闪点是 SVG ：outline 只能画出外接方框，别指望它贴着瓦片形状 */
.mNode:focus-visible,.mCall:focus-visible{outline:2px solid var(--police);outline-offset:2px}
/* ===== v219 · 110 接警台：电话先进屋，再决定谁出门 =====
这一层只给「110 接警台 · 接警与分流」那一个抽屉做纸面：
一通电话一张卡，引语、报案人、三条能听见的要素与五个分流方向都在一张纸上。
没有新颜色体系：警蓝是“要到场”，朱砂只留给“必须处理”的那一行。
按钮排成可换行的一行——窄屏上宁可换行，也不把五个方向挤成两条字。 */
.dockBtn.call .dockIcon{background:linear-gradient(180deg,#3d5f86,#223a56)}
.dockBtn.call{border-color:rgba(34,58,86,.42)}
.callList{display:flex;flex-direction:column;gap:10px}
.callCard{border:1px solid var(--line);border-left:3px solid var(--police);background:rgba(255,252,246,.72);border-radius:3px;padding:12px 14px;min-width:0}
.callTop{display:flex;align-items:baseline;gap:10px;min-width:0}
.callTop>b{font-size:var(--fs-body);color:var(--ink);line-height:1.5;letter-spacing:.2px;flex:1;min-width:0}
.callAt{font-size:var(--fs-num);color:var(--ink3);font-variant-numeric:tabular-nums;white-space:nowrap;flex:0 0 auto}
.callQuote{margin-top:7px;font-size:var(--fs-body);line-height:1.7;color:var(--ink2);text-wrap:pretty}
.callQuote::before{content:'电话里：';color:var(--ink3);font-size:var(--fs-sub);margin-right:4px}
.callWho{margin-top:5px;font-size:var(--fs-sub);color:var(--ink3);line-height:1.6;overflow-wrap:anywhere}
.callFacts{display:flex;flex-wrap:wrap;gap:5px 6px;margin-top:8px}
.callFacts span{font-size:var(--fs-sub);color:var(--ink2);background:var(--paper2);border:1px solid var(--line);border-radius:2px;padding:2px 7px;line-height:1.5}
.callActs{display:flex;flex-wrap:wrap;gap:6px;margin-top:10px}
.callBtn{font-size:var(--fs-sub);padding:5px 10px;min-height:30px;line-height:1.3;letter-spacing:0}
.callDue{margin-top:7px;font-size:var(--fs-num);color:var(--ink3);line-height:1.5}
.callCard .callDue{color:var(--cinnabar)}
.callBack{border:1px solid rgba(168,57,44,.32);border-left:3px solid var(--cinnabar);background:rgba(255,248,240,.7);border-radius:3px;padding:12px 14px;min-width:0}
.callBack>div:first-child{display:flex;align-items:baseline;gap:10px;min-width:0}
.callBack>div:first-child>b{font-size:var(--fs-body);color:var(--ink);flex:1;min-width:0;line-height:1.5}
.callBackNote{margin-top:6px;font-size:var(--fs-sub);color:var(--ink2);line-height:1.7;text-wrap:pretty}
.callHist .logLine{min-width:0}
@media (max-width:700px){
.callCard,.callBack{padding:10px 11px}
.callActs{gap:5px}
.callBtn{flex:1 1 auto;min-width:88px}
}
/* ===== v220 · 接警台那扇门的门上要看得见"接"字 =====
v219 给 .dockBtn.call .dockIcon 写的是 background: 简写 —— 这一句同时把基类的
background-image:var(--ic-a) 顶掉、又把 background-size 复位成 auto（3289 行早就记过这笔账：
sprite 是 36 格 atlas，靠 400% 400% 取格，简写一覆盖就取不到格）。而基类为了让位给纹样
把 color 压成 transparent，于是那格变成一块空蓝。伞/灰区/说明三扇走的是同一条路，
解法也一样（4072 行）：把单字请回来，字要站在深色渐变上所以给纸白。
不动 v219 那条渐变，只补字色与字号——特异性同为 (0,3,0)，源码顺序在后面就赢。 */
.dockBtn.call .dockIcon{color:#fdf6e8;font-size:15px;font-weight:600;letter-spacing:0}
/* ===== v221 · 开局页：报到登记 / 存档卡 / 开局摘要 / 覆盖确认 =====
首屏原来把姓名、年龄、学历、入警、继续、对照台、继承、硬核全摊在一行里：
输入框和两个按钮抢宽，天花板提示被挤成一条悬空的注脚。这一层把它们分成
四个明确的面：上次生涯（有档才有）、新档登记、开局摘要、更多设置。
所有栏名与值都按同一条基线排，窄屏只换列不换层级。 */
.startScreen .startFoot.startPanel{
display:block;margin-top:24px;padding:18px 20px 20px;
}
.startScreen .startPanel .saveCard{
position:relative;display:grid;grid-template-columns:minmax(0,1fr) auto;
grid-template-areas:"top go" "who go" "meta go";gap:2px 16px;
width:100%;margin:0 0 16px;padding:11px 14px 11px 16px;
border:1px solid rgba(158,203,175,.36);border-left:3px solid rgba(158,203,175,.78);
border-radius:3px;background:linear-gradient(180deg,rgba(158,203,175,.10),rgba(158,203,175,.035));
color:inherit;font-family:var(--hei);text-align:left;cursor:pointer;
transition:background .15s,border-color .15s,transform .15s;
}
.startScreen .startPanel .saveCard[hidden]{display:none}
.startScreen .startPanel .saveCard:hover{
background:linear-gradient(180deg,rgba(158,203,175,.16),rgba(158,203,175,.06));
border-color:rgba(158,203,175,.55);transform:translateY(-1px)
}
.startScreen .startPanel .saveCard:focus-visible{outline-color:#9ecbaf}
.startPanel .scTop{grid-area:top;display:flex;align-items:baseline;gap:10px;min-width:0}
.startPanel .scK{font-size:11.5px;font-weight:700;letter-spacing:2px;color:#9ecbaf;white-space:nowrap}
.startPanel .scDate{font-size:11.5px;line-height:1.6;color:rgba(226,220,205,.56);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.startPanel .scWho{grid-area:who;display:flex;align-items:baseline;gap:9px;min-width:0;flex-wrap:wrap}
.startPanel .scWho b{font-family:var(--fz);font-size:20px;font-weight:700;line-height:1.4;letter-spacing:2px;color:#f7f2e6}
.startPanel .scWho span{font-size:12px;font-weight:600;line-height:1.6;color:rgba(240,235,222,.72)}
.startPanel .scMeta{grid-area:meta;font-size:11.5px;line-height:1.65;color:rgba(226,220,205,.52)}
.startPanel .scGo{grid-area:go;align-self:center;padding-left:8px;font-size:12px;font-weight:700;letter-spacing:1px;color:#cfe3d6;white-space:nowrap}
.startPanel .sfHead{display:flex;align-items:baseline;justify-content:space-between;gap:12px;padding:0 0 9px;border-bottom:1px solid rgba(232,226,210,.14)}
.startPanel .sfKicker{font-family:var(--hei);font-size:12px;font-weight:700;letter-spacing:2px;color:#e8dcbd}
.startPanel .sfClock{font-family:var(--mono);font-size:11.5px;line-height:1.6;color:rgba(226,220,205,.46);white-space:nowrap}
.startPanel .sfBody{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(300px,.85fr);gap:18px 22px;align-items:start;margin-top:14px}
.startPanel .sfForm{min-width:0}
.startPanel .sfFields{display:grid;grid-template-columns:minmax(0,1.2fr) minmax(0,.8fr) minmax(0,1.2fr);gap:10px 12px}
.startPanel .nameBox{display:flex;flex-direction:column;gap:5px;min-width:0;font-family:var(--hei);font-size:12px;font-weight:700;letter-spacing:1.5px;color:rgba(238,232,216,.82)}
.startPanel .nameBox input,.startPanel .nameBox select{
width:100%;min-width:0;height:38px;box-sizing:border-box;padding:0 10px;
border:1px solid rgba(232,226,210,.3);border-radius:3px;
background:rgba(250,246,236,.95);color:var(--ink);font-family:var(--hei);font-size:16px;font-weight:700;letter-spacing:1px;
}
.startPanel .ageCeil,.startPanel .eduHint{
position:relative;margin:10px 0 0;padding:0 0 0 11px;
border-left:2px solid rgba(232,226,210,.16);
font-family:var(--hei);font-size:11.5px;font-weight:600;line-height:1.75;letter-spacing:.2px;
color:rgba(226,220,205,.62);text-wrap:pretty;
}
.startPanel .eduHint{margin-top:7px;color:rgba(226,220,205,.66)}
.startPanel .ageCeil b{color:#a9c6ec;font-weight:700}
.startPanel .eduHint b{color:#a9c6ec;font-weight:700}
.startPanel .startPreview{
min-width:0;padding:12px 14px 8px;border:1px solid rgba(232,226,210,.17);
border-left:3px solid rgba(224,185,129,.7);border-radius:3px;
background:linear-gradient(180deg,rgba(247,242,230,.08),rgba(247,242,230,.028));
}
.startPanel .spHead{display:flex;align-items:baseline;justify-content:space-between;gap:10px;padding-bottom:8px;border-bottom:1px solid rgba(232,226,210,.14)}
.startPanel .spHead b{font-family:var(--hei);font-size:13px;font-weight:700;letter-spacing:2px;color:#f0e7d2}
.startPanel .spHead span{font-size:11.5px;line-height:1.6;color:rgba(226,220,205,.42);white-space:nowrap}
.startPanel .spRows{margin-top:2px}
.startPanel .spRow{display:grid;grid-template-columns:64px minmax(0,1fr);gap:10px;align-items:baseline;padding:8px 0;border-bottom:1px dashed rgba(232,226,210,.1)}
.startPanel .spRow:last-child{border-bottom:0;padding-bottom:4px}
.startPanel .spK{font-family:var(--hei);font-size:11.5px;font-weight:700;line-height:1.7;letter-spacing:1px;color:rgba(226,220,205,.45);white-space:nowrap}
.startPanel .spV{min-width:0;font-family:var(--hei);font-size:13px;font-weight:600;line-height:1.65;color:rgba(240,235,222,.9);overflow-wrap:anywhere}
.startPanel .spV>b{font-size:14px;font-weight:700;color:#f6f1e2}
.startPanel .spSub{display:block;margin-top:1px;font-style:normal;font-size:11.5px;font-weight:400;line-height:1.55;color:rgba(226,220,205,.45)}
.startPanel .spNoPay{color:rgba(226,220,205,.62)}
.startPanel .spLine{display:flex;align-items:baseline;gap:6px;font-style:normal;font-size:12px;font-weight:500;line-height:1.7;color:rgba(238,232,216,.78)}
.startPanel .spDot{flex:0 0 auto;width:5px;height:5px;border-radius:50%;align-self:center}
.startPanel .spDot.on{background:#9ecbaf}
.startPanel .spDot.off{background:rgba(226,220,205,.36)}
.startPanel .spCases{display:flex;flex-direction:column;gap:5px}
.startPanel .spCase{display:grid;grid-template-columns:20px minmax(0,1fr);gap:7px;align-items:start;font-style:normal;font-size:12px;font-weight:400;line-height:1.6;color:rgba(240,235,222,.86)}
.startPanel .spCase em{display:inline-flex;align-items:center;justify-content:center;width:19px;height:18px;margin-top:1px;border-radius:2px;background:rgba(226,220,205,.12);font-style:normal;font-size:11.5px;font-weight:700;color:rgba(240,235,222,.8)}
.startPanel .spCase[data-g="S"] em{background:rgba(232,145,127,.2);color:#f2b0a2}
.startPanel .spCase[data-g="B"] em{background:rgba(224,185,129,.2);color:#e8c692}
.startPanel .spCase[data-g="C"] em{background:rgba(147,184,230,.16);color:#a9c6ec}
.startPanel .spCase[data-g="D"] em{background:rgba(226,220,205,.1);color:rgba(240,235,222,.7)}
.startPanel .sfActions{display:flex;align-items:center;gap:12px;flex-wrap:wrap;margin-top:15px;padding-top:14px;border-top:1px solid rgba(232,226,210,.12)}
.startPanel .btnEnlist{margin-left:0;flex:0 0 auto;min-width:220px;padding:11px 38px;font-size:18px;letter-spacing:6px}
.startPanel .btnEnlist.armed{background:linear-gradient(180deg,#c95546,#9a3225);box-shadow:0 6px 20px rgba(168,57,44,.5)}
.startPanel .sfNote{font-size:12px;line-height:1.65;color:rgba(226,220,205,.46);text-wrap:pretty}
.startPanel .overwriteWarn{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:12px;align-items:center;margin-top:12px;padding:10px 12px;border:1px solid rgba(232,145,127,.35);border-left:3px solid #d4584a;border-radius:3px;background:rgba(168,57,44,.1)}
.startPanel .overwriteWarn[hidden]{display:none}
.startPanel .owBody{min-width:0}
.startPanel .owBody b{display:block;font-family:var(--hei);font-size:12px;font-weight:700;line-height:1.6;color:#f2b0a2}
.startPanel .owBody span{display:block;margin-top:2px;font-size:11.5px;line-height:1.65;color:rgba(240,235,222,.74);text-wrap:pretty}
.startPanel .owCancel{font-family:var(--hei);font-size:11.5px;line-height:1.4;padding:5px 9px;border:1px solid rgba(232,226,210,.28);border-radius:2px;background:transparent;color:rgba(240,235,222,.78);cursor:pointer;white-space:nowrap}
.startPanel .owCancel:hover{background:rgba(247,242,230,.08);color:#f6f1e2}
.startScreen .moreOpts{margin:16px 0 0;border-top:1px solid rgba(232,226,210,.12)}
.startScreen .moreOpts summary{display:flex;align-items:baseline;gap:10px;padding:10px 4px;list-style:none;cursor:pointer;color:rgba(240,235,222,.8)}
.startScreen .moreOpts summary::-webkit-details-marker{display:none}
.startScreen .moreOpts summary::after{content:'＋';margin-left:auto;font-family:var(--mono);font-size:14px;line-height:1;color:rgba(226,220,205,.5)}
.startScreen .moreOpts[open] summary::after{content:'－'}
.startScreen .moreOpts summary b{font-family:var(--hei);font-size:13px;font-weight:700;letter-spacing:1.5px;color:#e8dcbd}
.startScreen .moreOpts summary span{font-size:11.5px;line-height:1.6;color:rgba(226,220,205,.5)}
.startScreen .moreOpts .startOpts{max-width:none;margin:0 0 4px;padding:12px 12px 11px;border:1px solid rgba(232,226,210,.16);border-left:3px solid #6b4f7a;border-radius:3px;background:linear-gradient(180deg,rgba(247,242,230,.96),rgba(236,228,210,.9))}
@media (max-width:980px){
.startPanel .sfBody{grid-template-columns:1fr}
.startPanel .startPreview{padding-bottom:10px}
}
@media (max-width:640px){
.startScreen .startFoot.startPanel{padding:14px 13px 16px}
.startPanel .saveCard{grid-template-areas:"top go" "who go" "meta meta";gap:2px 12px}
.startPanel .sfHead{flex-direction:column;align-items:flex-start;gap:2px}
.startPanel .sfClock{white-space:normal}
.startPanel .sfFields{grid-template-columns:1fr 1fr}
.startPanel .sfFields .nameBox:first-child{grid-column:1/-1}
.startPanel .sfActions{flex-direction:column;align-items:stretch}
.startPanel .btnEnlist{width:100%;min-width:0}
.startPanel .sfNote{text-align:center}
.startPanel .overwriteWarn{grid-template-columns:1fr}
.startPanel .owCancel{justify-self:start}
}
/* ===== v222 · 游戏内文字工整度 =====
这一层修的是"字被挤成一根竖条"和"最后一行只剩一个字"，不动任何数值与判定：
① 日志的 .d 原来是死宽 84px，职级阶梯那几行只放一个"待"字，白占半行还把后面挤成四行；
改成"至少 84px、按内容长"，阶梯里再把这一格收到 2.4em。
② 人物卡与越界记录曾经共用 .ptRow，横排规则把角色列压到 11px；那一组已经圈进 .pwTemptLog。
③ 人脉小条的数字仍要 36px，晋升条件表的数字要占满自己的列——两条尺子各管各的。
④ 一小段提示（接警台、辖区图上的"放大"）用 balance，宁可两行等长，也不要第二行只剩"放大"。
⑤ 细字、元信息、帮助条统一 pretty：只挪断行，不缩字号。
⑥ 窄屏上：控制行、装备行、热度行、晋升条件行、并排按钮各让一步——把横向挤不下的东西
改成两行，而不是把中文压成逐字竖排。 */
.logLine .d{flex:0 0 auto;min-width:84px;white-space:nowrap}
.ladderPanel .logLine .d{flex:0 0 2.4em;min-width:2.4em;text-align:center}
.todayLine>span:last-child{text-wrap:balance}
.mapTip{text-wrap:balance}
.finePrint,.docNo,.docMeta,.hbV,.kitFine,.talEff,.ctWhy,.mods,.npcHook,.chronTie,
.greyRisk,.greyCalm,.gpNote,.ladNote,.prHint,.ptRole{text-wrap:pretty}
/* 短语式的行优先 balance：两行等长，比"第二行只剩两个字"更像排过 */
.callWho,.docNo,.docMeta,.talEff,.ptRole,.ctCaseHead b,.ctlName,.callTop>b,.pmLine{text-wrap:balance}
/* "再上一格"那一句是半行短注：贪心断行会甩出"径。"两个字，balance 收成 12/10 两行 */
.umbRankNext{text-wrap:balance}
/* 长句与帮助行走 pretty：只把最后一行的孤字提上来，不把整段拉成方块 */
.umbLawBody p,.idxRow span,.rgList .logLine>span,.logLine>span,.warn{text-wrap:pretty}
@media (max-width:760px){
.ctlRow{grid-template-columns:24px minmax(0,1fr) 26px 54px;grid-template-areas:"kind name num due" "kind bar bar bar";gap:2px 7px;padding:8px}
.ctlKind{grid-area:kind}
.ctlName{grid-area:name;font-size:12px}
.ctlBar{grid-area:bar;margin-top:4px}
.ctlNum{grid-area:num}
.ctlDue{grid-area:due}
.kitRow{grid-template-columns:minmax(0,1fr) auto}
.kitRow .kitName{grid-column:1/-1;grid-row:1;flex-wrap:wrap}
.kitRow .kitBar{grid-column:1;grid-row:2}
.kitRow .num{grid-column:2;grid-row:2}
.kitRow .kitFine{grid-column:1/-1;grid-row:3}
.kitRow .kitActs{grid-column:1/-1;grid-row:4}
.hotRows .logLine{flex-wrap:wrap;row-gap:5px}
.hotRows .logLine .heatBar{flex:1 0 100%;order:0}
.hotRows .logLine>span:not(.heatBar){flex:1 1 auto;min-width:0;order:1}
.hotRows .logLine .hotGo{order:2;margin-left:auto}
.acts[style*="flex-direction:row"] .act{flex:1 1 100%}
.prRow{grid-template-columns:minmax(0,1fr) auto;gap:4px 10px}
.prRow .prKey{grid-column:1;grid-row:1}
.prRow .prNum{grid-column:2;grid-row:1;width:auto;white-space:nowrap}
.prRow .prBar{grid-column:1/-1;grid-row:2}
.prRow .prHint{grid-column:1/-1;grid-row:3}
}
/* 门禁顶栏的标题在 375 档会顶到右边界：20px 楷体加 1.5px 字距，"接警台 · 分流"
连同右侧两个按钮的字数一行放不下，省略号正好切在"分流"的"流"上。
窄屏收一档到 18px（楷体可读的地板），字距跟着收到 1px——仍比正文大两级。 */
@media (max-width:640px){.mBarT{font-size:18px;letter-spacing:1px}}
/* ===== v226 · 三张主面板插图 =====
110 接警台以前借通用值班图，伞线与亲友台账干脆没有图。
伞线、亲友仍是 900×600 的位图，靠 cover 裁成横条；色调跟着现有的
夜班台灯 / 雨街 / 家中饭桌走，不另起一套画风。 */
/* v242 · art_call 换成 1200×360 的生成横带（dev/imggen.mjs · 商汤），不再是 900×600 借来的值班图。
画的时候主体就按这条带子摆，所以不再需要 background-position 往下找电话：
150px 高的盒子配 10:3 的源图，纵向正好整条露出来（宽 566 时源 y 31–319，425 时 0–360）。 */
.art.call{background-image:url(../assets/art_call.webp)}
.art.umb{background-image:url(../assets/art_umb.webp);background-position:center 72%}
.art.kin{background-image:url(../assets/art_kin.webp);background-position:center 85%}
/* 106px 的横条会把主体裁掉：电话在画面中下部，伞在下三分之一，空椅子在桌边。
这三张是主面板的门面，给到 150px，等于让画自己说完一句。 */
.art.call,.art.umb,.art.kin{height:150px}
/* ===== v229 · 柜台里那一片 + 婚姻介绍所 =====
两件新东西共用一层：商城往后长出来的六类货品（补品 / 化妆品 / 白银 / 黄金 / 珠宝 / 奢侈品），
和「城西红娘」那扇门（四条相识渠道 + 一份逐栏档案 + 求婚订婚领证婚礼孩子）。
配色不另起一套：赭石管钱与首饰，朱砂只留给"这一栏要出事"，竹青给对上分的那几行。
字号一律走 var(--fs-*)，字距一律 px——这两条是 typography() 量得动的。 */
/* ---------- ① 三张货品插图：88px 的横条放不下"一柜台"，给到 106px，主体压在下沿 ---------- */
.art.goods{height:106px}
.art.goods.goodsLife{background-image:url(../assets/art_goods_life.webp);background-position:center 74%}
.art.goods.goodsGold{background-image:url(../assets/art_goods_gold.webp);background-position:center 62%}
.art.goods.goodsLux{background-image:url(../assets/art_goods_lux.webp);background-position:center 72%}
/* 六类货品分三张柜台，中间那道线要比分隔标题轻：一组之内还是同一张柜台 */
.gDiv{height:1px;background:var(--line);margin:18px 0 2px}
/* ---------- ② 货品小图标：手绘 inline SVG，描边走 currentColor ----------
三十六格 sprite 已经用满，这一批不占格：图标直接画在按钮里，跟着字色走，
也就不会像 background 简写那样把取格机制顶掉。 */
.gIco{display:inline-block;width:17px;height:17px;vertical-align:-4px;margin-right:6px;color:var(--ochre)}
.act > b > .gIco{margin-right:5px}
/* 名称那一格要能容纳图标 + 长名字：图标不参与换行，名字自己折 */
.gBtn > b{display:flex;align-items:baseline;gap:0;min-width:0}
.gBtn > b > .gIco{flex:0 0 17px;align-self:center}
/* 已经买过几件：数挂在价格后面，不另起一行 */
.gOwn{margin-left:5px;font-family:var(--mono);font-size:var(--fs-num);color:var(--ink3);letter-spacing:0}
/* ---------- ③ 手上的那本账（GOODS.render） ---------- */
.gRow{display:grid;grid-template-columns:minmax(0,1fr) 46px 88px minmax(0,auto);
column-gap:9px;align-items:baseline;padding:6px 1px;border-bottom:1px dotted var(--line)}
.gRow:last-child{border-bottom:0}
.gNm{font-size:var(--fs-sub);color:var(--ink);min-width:0;overflow-wrap:anywhere}
.gN{font-family:var(--mono);font-size:var(--fs-num);color:var(--ink3);text-align:right;letter-spacing:0}
.gP{font-family:var(--mono);font-size:var(--fs-num);color:var(--ochre);text-align:right;letter-spacing:0}
.gG{font-size:var(--fs-num);color:var(--ink3);letter-spacing:.2px}
.gTag{display:inline-block;margin-right:6px;padding:0 5px;border:1px solid rgba(168,57,44,.42);
border-radius:2px;color:var(--cinnabar);font-size:var(--fs-num);font-weight:400;letter-spacing:1px}
/* 送人：一样东西一排，四个方向挤得下就不换行 */
.gGift{padding:7px 0;border-bottom:1px dotted var(--line)}
.gGift:last-child{border-bottom:0}
.gGift .acts,.gGift>.act{display:inline-grid}
.gGift .act.mini{margin:5px 6px 0 0}
/* 四档奢华：左边那道竖线跟着档位上色，0 档不涂色——"手上没什么亮处"不该有颜色 */
.luxBar{border-left:3px solid var(--line);padding-left:11px}
.luxBar1{border-left-color:var(--ochre)}
.luxBar2{border-left-color:var(--cinnabar)}
.luxBar3{border-left-color:#6b1f16}
.luxRow{display:flex;justify-content:space-between;align-items:baseline;gap:12px;
padding:4px 0;border-bottom:1px dotted var(--line)}
.luxRow:last-child{border-bottom:0}
.luxK{font-size:var(--fs-sub);color:var(--ink3);letter-spacing:.2px}
.luxV{font-family:var(--mono);font-size:var(--fs-num);color:var(--ink2);text-align:right;letter-spacing:0}
/* 动作按钮的小一档：报备、送人这种"顺手一下"不能和主行动同宽同高 */
.act.mini{padding:6px 9px;grid-template-columns:minmax(0,1fr) auto}
.act.mini > b{font-size:var(--fs-sub)}
.act.mini.on{background:rgba(77,107,87,.12);border-color:rgba(77,107,87,.42)}
/* ---------- ④ 婚介所那扇门（MATCH.render） ---------- */
.art.match{height:150px;background-image:url(../assets/art_match.webp);background-position:center 82%}
/* 你这一份条件：两列一张表，左边那一列对齐到字，右边那一列吃掉剩下的宽度 */
.mfGrid{display:grid;grid-template-columns:88px minmax(0,1fr);column-gap:12px;row-gap:3px;
padding:2px 0;font-size:var(--fs-sub)}
.mfK{color:var(--ink3);letter-spacing:.2px}
.mfV{color:var(--ink2);min-width:0;overflow-wrap:anywhere}
.mfMe{margin-top:12px}
/* 逐行对上：四列（项目 / 你的 / 她要的 / 差多少）。差多少那一列永远靠右、等宽 */
.mfTable{padding:2px 10px 6px}
.mfRow{display:grid;grid-template-columns:82px minmax(0,1fr) minmax(0,1.15fr) 44px;
column-gap:9px;align-items:baseline;padding:5px 0;border-bottom:1px dotted var(--line);
font-size:var(--fs-sub);line-height:1.6}
.mfRow:last-child{border-bottom:0}
.mfH{color:var(--ink3)}
.mfD{font-family:var(--mono);font-size:var(--fs-num);text-align:right;letter-spacing:0;color:var(--ink3)}
.mfRow.ok .mfD{color:var(--bamboo)}
.mfRow.no .mfD{color:var(--cinnabar)}
/* 相处 → 订婚 → 成家：走到的那一格涂警蓝，没走到的只留字 */
.mSteps{display:flex;flex-wrap:wrap;align-items:center;gap:7px;padding:9px 11px}
.mStep{font-size:var(--fs-sub);color:var(--ink3);border:1px solid var(--line);
border-radius:2px;padding:2px 9px;letter-spacing:2px}
.mStep.on{color:#f6f2e8;background:var(--police);border-color:var(--police)}
.mSep{color:var(--ink3);font-size:var(--fs-num)}
/* 她的档案：一栏一行。"红娘没说的"没翻开时压成灰底，别用省略号装神弄鬼 */
.prForm{display:block}
.prRow{display:grid;grid-template-columns:92px minmax(0,1fr);column-gap:11px;
padding:4px 0;border-bottom:1px dotted var(--line);font-size:var(--fs-sub);line-height:1.7}
.prRow:last-child{border-bottom:0}
.prK{color:var(--ink3);letter-spacing:.2px}
.prV{color:var(--ink);min-width:0;overflow-wrap:anywhere}
.prRow.lock{background:rgba(32,36,42,.05)}
.prRow.lock .prV{color:var(--ink3)}
/* 名录：一行一个人。button 默认居中加边框，这里全部抹平，让它读起来像一张表 */
.mfRoster{padding:0 10px}
.mRosterRow{display:grid;grid-template-columns:66px minmax(0,1fr) 104px 84px;column-gap:9px;
align-items:baseline;width:100%;text-align:left;padding:7px 1px;cursor:pointer;
background:none;border:0;border-bottom:1px dotted var(--line);border-radius:0;
font-family:var(--serif);font-size:var(--fs-sub);color:var(--ink2);line-height:1.6}
.mRosterRow:last-child{border-bottom:0}
.mRosterRow:hover{background:rgba(255,255,255,.42)}
.mRn{font-size:var(--fs-body);color:var(--ink)}
.mRj{color:var(--ink3);min-width:0;overflow-wrap:anywhere}
.mRm{font-size:var(--fs-num);color:var(--ink3);letter-spacing:.2px}
.mRc{font-family:var(--mono);font-size:var(--fs-num);text-align:right;letter-spacing:0;color:var(--ink2)}
.mRc.ok{color:var(--bamboo)}
.mRc.no{color:var(--ink3)}
/* 婚礼那一档上面挂的报备条：说明文字和按钮同高，别把三档婚礼挤到第二屏 */
.wedNote{display:grid;grid-template-columns:minmax(0,1fr) auto;column-gap:10px;
align-items:center;padding:2px 0 4px}
.wedNote .need{color:var(--ink3);line-height:1.65}
/* 家那一格里的一枚牌：只有一个动作，不需要 .acts 的十一像素间距 */
.relations .loveRow{margin-top:9px}
/* ---------- ⑤ 第五扇留单字的门：三十六格已经用满 ----------
和接警台同一办法：background 简写把 sprite 顶掉，再把字从 transparent 里救回来。
名字留在 dev/full_dyn.js 的 GLYPH_OK 里，这条窟窿是记了账的。 */
.dockBtn.match .dockIcon{background:linear-gradient(180deg,#8f6a30,#5c431d)}
.dockBtn.match{border-color:rgba(143,106,48,.42)}
.dockBtn.match .dockIcon{color:#fdf6e8;font-size:15px;font-weight:600;letter-spacing:0}
/* ===== v233 · 生活那一格换成真画面：宿舍与家各走一张水墨场景 =====
v222 那两张是手绘 SVG（纸纹 + 矿物色 + 墨线），贴在"生活 · 所里宿舍"底下
读起来仍是一张示意图，不是"这个人住在哪儿"。作者点了这一处，所以换成
ImageGen 出的水墨淡彩场景，走 v203 那条管道（裁水印 90px → 900×600 cover → webp q86）。
两张都是 3:2，侧栏这一格实测约 210×92（2.3:1）：cover 只留画面中部约 48% 高，
所以取 position 时把上下都往里收——宿舍要留住壁灯那团暖光与下铺，家要留住台灯与晾衣绳。
老的 SVG 挪进 assets/_superseded/（[13] 只统计 webp，留着不报孤儿，但别再引用）。 */
.lifeHome{height:108px;background-position:center 52%}
.lifeHome.dorm{background-image:url(../assets/art_dorm.webp)}
.lifeHome.house{background-image:url(../assets/art_home.webp);background-position:center 44%}
/* ===== v230 · 私事台账：那一层关系要有自己的纸面 =====
这一格不能长得像婚介那张表——MATCH 那张是"逐行对上"的条件单，冷、公开、可以摆给家里看；
这一格是私事，所以整张纸压暗一档：条目之间用一道左侧墨线分开，关系分与热度并排但不同色，
风险那一行用朱砂（只有"必须处理"的才配红）。字号全部走 v217 的阶梯 token，不许出现半步。
门牌那枚"私"字：v219/v229 两次踩过同一个坑——background 简写会顶掉 sprite 取格并把
background-size 复位成 auto，而基类 .dockIcon 的 color 是 transparent，于是门上一块空色。
所以渐变与字色分两条写，字色给纸白。 */
.art.aff{height:150px;background-image:url(../assets/art_aff.webp);background-position:center 58%}
.dockBtn.aff .dockIcon{background:linear-gradient(180deg,#4a5462,#2b3542)}
.dockBtn.aff{border-color:rgba(43,53,66,.42)}
.dockBtn.aff .dockIcon{color:#fdf6e8;font-size:15px;font-weight:600;letter-spacing:0}
.affRow{border-left:2px solid var(--line);padding:9px 0 9px 12px;margin:0 0 12px;min-width:0}
.affRow .act{margin-top:7px}
.affHead{display:flex;align-items:baseline;gap:10px;flex-wrap:wrap;min-width:0}
.affHead b{font-family:var(--hei);font-size:var(--fs-t2);font-weight:700;letter-spacing:1px;color:var(--ink)}
.affMeta{font-size:var(--fs-sub);color:var(--ink3);letter-spacing:.2px}
.affRel{margin-left:auto;font-size:var(--fs-num);color:var(--ink3);border:1px solid var(--line);
border-radius:2px;padding:2px 8px;white-space:nowrap;font-variant-numeric:tabular-nums}
.affRel.ok{color:var(--police);border-color:rgba(38,69,111,.4);background:rgba(38,69,111,.06)}
.affLine{margin-top:4px;font-size:var(--fs-body);line-height:1.7;color:var(--ink2);text-wrap:pretty}
.affState{margin-top:6px;font-size:var(--fs-sub);line-height:1.6;color:var(--ink3);
font-variant-numeric:tabular-nums;text-wrap:pretty}
.affState.bad{color:var(--cinnabar)}
.affRow .need.bad{color:var(--cinnabar)}
.affKeeps{display:flex;flex-wrap:wrap;gap:6px;margin-top:8px}
.affKeep{font-size:var(--fs-sub);color:var(--ink3);line-height:1.5}
.affWhere .affRow{border-left-color:transparent}
.affHist .logLine{min-width:0}
@media (max-width:700px){
.affRel{margin-left:0}
.art.aff{height:118px}
}
/* ===== v231 · 私事台账：这一格里每个人一张小像，谈话那一屏换它自己的画 =====
小像一律不画五官：这一格的口径是"话说到一半"，脸也留白——逆光里一块侧影比一张具体的脸更真，
也不会把虚构的人画成某个能被认为是真人的人。3:4 竖幅，58×77 的框与源图同比例，不许拉。
还没说过话的那几位暗一档（.affFace.dim）：那是"知道有这个人，还没对上"。
.affRow 改成两列网格：小像在左，正文在右；右列 min-width:0 才压得住长句不溢出。 */
.affRow{display:grid;grid-template-columns:58px 1fr;gap:12px;align-items:start}
.affFace{width:58px;height:77px;border-radius:3px;background-size:cover;background-position:center 24%;
box-shadow:inset 0 0 0 1px rgba(47,43,40,.5),0 1px 3px rgba(47,43,40,.2)}
.affFace.dim{filter:saturate(.42) brightness(1.05);opacity:.7}
.affMain{min-width:0}
.art.talk{height:150px;background-image:url(../assets/art_aff_talk.webp);background-position:center 56%}
@media (max-width:700px){
.affRow{grid-template-columns:46px 1fr;gap:9px}
.affFace{width:46px;height:61px}
.art.talk{height:116px}
}
/* ===== v233 · 三张抽屉挂三副框，立绘上装裱 =====
作者点的是"外框"这件事：抽屉一直是 1px 灰线加一条 6px 内细线，指令、卷宗、接警台
三张长得一模一样，翻开哪张全看标题字。现在一格一副框，四角纹样各不相同——
指令是雷纹双钩、卷宗是档案包角、110 是三道电波、立绘是单钩加一方小印。
为什么用 border-image 而不是 background 贴图：v209 那批 portrait_frame_*.svg
就是按 background-size:100% 100% 贴的，出身卡的宿主每档比例都在变
（1280 档 2.778:1、560 档 3.131:1），一张方角纹被拉成两道浅钩，就是用户截图里那个"乱框"。
九宫切片把这条物理规律拆掉了：四角按源图比例落位、绝不缩放，上下左右四条边只做平移，
所以同一副框在 600×520 的抽屉和 88×118 的窄屏立绘上是同一副框。
素材是 40×40 的 SVG、带宽 10、slice 10：边中段只画"沿该方向均匀"的东西（两条直线 + 一条实色带），
图案一律关在 10×10 的角格里，拉伸时没有任何一处会被拉。
线色那件事没丢：.pImg 的 border-color 仍写 var(--lc)（border-image 只盖住描边，
computed 值不变，FULL.frameFit 量的还是它），另在 ::before 上补一道 inset 线色内圈——
框是中性墨，谁是哪条线出身仍由那一圈与八道短线说。
::before 的九层 linear-gradient 与 ::after 的 none 一条没动（frameFit 与静态 [13b] 钉着）。 */
.modalBox[data-frame]{border-width:10px;border-style:solid;border-image-slice:10;border-image-repeat:stretch;border-radius:0}
.modalBox[data-frame="cmd"]{border-image-source:url(../assets/frame_cmd.svg)}
.modalBox[data-frame="case"]{border-image-source:url(../assets/frame_case.svg)}
.modalBox[data-frame="call"]{border-image-source:url(../assets/frame_call.svg)}
/* 那条 6px 内细线是给无框抽屉留的；挂上框之后由框自己那道内线接手 */
.modalBox[data-frame]::after{border-color:transparent}
/* 立绘与出身卡共用一副装裱：带宽 10 的源图按 8px 落位，角纹缩到 0.8 倍仍是矢量，不发虚 */
.lineArt,.pImg{border-width:8px;border-style:solid}
.lineArt{border-image:url(../assets/frame_portrait.svg) 10}
.pImg{border-image:url(../assets/frame_portrait.svg) 10}
/* 线色内圈走 box-shadow：::before 的 background 层数一条不多一条不少，仍是八道短线 + 一道下缘淡入 */
.lineArt::before,.pImg::before{box-shadow:inset 0 0 0 1px var(--lc,rgba(32,36,42,.3))}
@media (max-width:640px){
.lineArt,.pImg{border-width:6px}
.modalBox[data-frame]{border-width:8px}
}
/* ===== v232 · 一屏只有一条主读序（PD.organize 重排之后给它形状）=====
取证（42 扇门逐扇开门抄数）：每一扇的第一屏都是 3–4 行门牌说明文，.hbV 在二十多扇上是整页最长的那段字；
13 扇门一张画都没有，25 扇门正文没有分区。这一层只给形状，不改任何模块出的 html：
头图（眼睛从这儿起）→ 先看这条（唯一的重点行）→ 编号分区（一块一件事）→ 动作（一屏一颗主钮）。
字号一律整像素；门牌里"管什么/什么时候来"降一档：那是用得着才读，不是必须先读。 */
.helpBar{padding:8px 11px 9px}
.hbMust{margin:0 -11px 7px;padding:1px 11px 8px;border-bottom:1px dashed rgba(168,57,44,.3)}
.hbMust .hbK{color:var(--cinnabar);font-weight:600;letter-spacing:1px}
.hbMust .hbV{font-size:15px;font-weight:600;line-height:1.5;color:var(--ink);text-wrap:pretty}
.hbNow .hbV{font-size:13px;font-weight:600;color:var(--police)}
.hbWhy .hbV{font-size:12px;color:var(--ink2);line-height:1.6}
/* 分区：左侧一条本类色道 + 一个汉字序号，块与块之间一条横线，区域一眼分得开 */
.mBody{counter-reset:psect}
.pSect{position:relative;margin:0 0 15px;padding:10px 0 2px 26px;border-top:1px solid rgba(32,36,42,.13)}
.helpBar + .pSect{border-top:0;padding-top:2px}
.pSect::before{counter-increment:psect;content:counter(psect,cjk-decimal);
position:absolute;left:0;top:12px;font-family:var(--ui);font-size:12px;line-height:1.2;color:var(--ink3);
padding:1px 4px 2px 6px;border-left:2px solid var(--pc,var(--police))}
.pSect .sectTitle{margin-top:0}
.pSect[data-kind="risk"]{--pc:var(--cinnabar)}
.pSect[data-kind="law"]{--pc:var(--ochre)}
.pSect[data-kind="log"]{--pc:var(--bamboo)}
.pSect[data-kind="people"]{--pc:#6b4a7a}
.pSect[data-kind="data"]{--pc:var(--police)}
.pSect[data-kind="paper"]{--pc:var(--ink3)}
/* 一屏只有一颗主按钮：白底压深一道边，眼睛落得下去；禁用的一律轮不到 */
.act.pFirst{background:linear-gradient(180deg,#fffdf8,#f7f1e4);border-color:rgba(38,69,111,.62);
border-left:3px solid var(--police);box-shadow:0 1px 0 rgba(38,69,111,.16),0 3px 10px rgba(30,36,46,.08)}
.act.pFirst b{color:var(--police)}
/* 本轮那八张已换成真生成图（商汤 SenseNova 1536×1024 → cover 到 1200×360）：
主体压在源图 y=281–741 那一条，抽屉 566 宽时 cover 再只看得见 360 高的 y=53–303，
所以读屏标签写的是这一条里真有的东西（PD.ART 那份表）。 */
.art.pd-risk,.art.pd-link,.art.pd-press,.art.pd-cases,.art.pd-job,.art.pd-grow,.art.pd-log,.art.pd-guide{
height:120px;background-size:cover;background-position:center 50%}
.art.pd-risk{background-image:url(../assets/pd_risk.webp)}
.art.pd-link{background-image:url(../assets/pd_link.webp)}
.art.pd-press{background-image:url(../assets/pd_press.webp)}
.art.pd-cases{background-image:url(../assets/pd_cases.webp)}
.art.pd-job{background-image:url(../assets/pd_job.webp)}
.art.pd-grow{background-image:url(../assets/pd_grow.webp)}
.art.pd-log{background-image:url(../assets/pd_log.webp)}
.art.pd-guide{background-image:url(../assets/pd_guide.webp)}
@media (max-width:700px){
.pSect{padding-left:18px}
.art.pd-risk,.art.pd-link,.art.pd-press,.art.pd-cases,.art.pd-job,.art.pd-grow,.art.pd-log,.art.pd-guide{height:92px}
}
/* =========================================================
v234 · 突发层（BREAK）——值班页正文顶上那一张朱砂卡
这一层全部是新 class（.brk*），不与前面 4900 行里任何一条撞名；
三条硬账按 css-layer-traps 走：① 卡片底色用不透明渐变（对比度尺子要能读到真值）；
② 字号只取 12/13/15（地板 11.5 之外必须整像素）；③ 窄屏换行时倒计时与按钮不许被挤没。
========================================================= */
.brkBox{margin:0 0 12px;border:1px solid rgba(120,38,28,.55);border-left:4px solid var(--cinnabar);
background:linear-gradient(135deg,#7d2b22,#5a1f18);color:#f7efdf;
box-shadow:0 2px 0 rgba(30,36,46,.14),0 8px 22px rgba(90,31,24,.22);border-radius:4px;padding:10px 12px 8px}
.brkHead{display:flex;align-items:baseline;gap:10px;font-size:15px;font-weight:600;letter-spacing:1px;
border-bottom:1px dashed rgba(247,239,223,.34);padding-bottom:6px;margin-bottom:2px}
.brkN{font-size:12px;font-weight:400;letter-spacing:0;opacity:.82}
.brkRow{display:grid;grid-template-columns:auto 1fr auto auto;align-items:center;gap:10px;
padding:8px 0;border-bottom:1px solid rgba(247,239,223,.12)}
.brkRow:last-of-type{border-bottom:0}
.brkKind{font-size:12px;line-height:1;padding:5px 7px;border:1px solid rgba(247,239,223,.5);border-radius:3px;white-space:nowrap}
.brkRow.big .brkKind{background:rgba(247,239,223,.16)}
.brkRow.home .brkKind{border-color:rgba(240,206,140,.7);color:#f6e3b4}
.brkRow.stn .brkKind{border-color:rgba(196,214,236,.66);color:#e4eefb}
.brkMain{min-width:0}
.brkT{display:block;font-size:15px;font-weight:600;line-height:1.5;text-wrap:balance}
.brkSub{display:block;font-size:12px;line-height:1.6;opacity:.86;text-wrap:pretty}
.brkDue{font-size:13px;font-variant-numeric:tabular-nums;white-space:nowrap;padding:3px 6px;border-radius:3px;
background:rgba(247,239,223,.14)}
.brkDue.warn{background:rgba(240,206,140,.22);color:#fbeecd}
.brkDue.hot{background:rgba(255,214,150,.3);color:#fff3d6;font-weight:600}
.brkDue.over{background:#f7efdf;color:#7d2b22;font-weight:600}
.brkBtn{min-height:32px;padding:5px 12px;font-size:13px;font-family:var(--ui);cursor:pointer;white-space:nowrap;
background:#f7efdf;color:#6a2318;border:1px solid #f7efdf;border-radius:3px}
.brkBtn:hover{background:#fff8ea}
.brkBtn:focus-visible{outline:2px solid #f7efdf;outline-offset:-2px}
.brkFoot{font-size:12px;opacity:.8;padding-top:7px;line-height:1.7}
.brkGo{font:inherit;color:#f7efdf;background:none;border:0;border-bottom:1px dashed rgba(247,239,223,.6);
padding:0;cursor:pointer}
.brkGo:focus-visible{outline:2px solid #f7efdf;outline-offset:2px}
/* 台账那一格上的三行统计：走纸面，不进朱砂卡 */
.brkStat{display:inline-block;font-size:12px;margin:0 10px 4px 0;padding:3px 8px;border:1px solid rgba(38,69,111,.28);
border-radius:3px;background:rgba(38,69,111,.06);color:var(--ink2)}
/* 处置屏那三类的抬头左边一条：重大走朱砂、家里走暖木、所内走警蓝 */
.brkDoc{border-left:3px solid var(--cinnabar)}
.brkDoc.home{border-left-color:#8a6a34}
.brkDoc.stn{border-left-color:var(--police)}
/* 要坐到那一格才说得出口的那一颗：虚线左边一眼分得出来 */
.act.rk{border-left:2px dashed rgba(168,57,44,.6)}
/* 门牌那枚"突"：36 格 sprite 在 v229 就用满了，第 37 扇门只能走单字门牌（同 v220 接警台、
v23x 私事那两条路）。没点名的门不是"没图"——基类 .dockIcon{background-image:var(--ic-a)} 会
让它直接借用 A 张第 (0,0) 格，也就是带兵那扇门的图，所以 icons() [1] 报的是 dockMgr+dockBrk 撞格。
渐变与字色分两条写：基类为了让位给纹样把 color 压成 transparent，只给渐变会剩一块空朱砂。 */
.dockBtn.brk .dockIcon{background:linear-gradient(180deg,#7d2b22,#5a1f18)}
.dockBtn.brk{border-color:rgba(122,43,34,.42)}
.dockBtn.brk .dockIcon{color:#fdf6e8;font-size:15px;font-weight:600;letter-spacing:0}
/* 三张池子各一条横带：真生成图（商汤 SenseNova，1536×1024 出图 → cover 到 1200×360）。
主体压在源图 y=281–741 那一条，所以 cover 裁完仍在中间；抽屉 566 宽时窗口 120 高、
background-position:center 46% 又只看得见源 360 高的 y=48–303——读屏标签按这一条写。 */
.art.brk-big,.art.brk-home,.art.brk-station{height:120px;background-size:cover;background-position:center 46%}
.art.brk-big{background-image:url(../assets/art_brk_big.webp)}
.art.brk-home{background-image:url(../assets/art_brk_home.webp)}
.art.brk-station{background-image:url(../assets/art_brk_station.webp)}
@media (max-width:700px){
.brkRow{grid-template-columns:auto 1fr;row-gap:6px}
.brkDue{justify-self:start}
.brkBtn{grid-column:2;justify-self:start}
.art.brk-big,.art.brk-home,.art.brk-station{height:92px}
}
/* ============ v235 · 辖区图第三轮：街区底块 / 江滨路与桥 / 环城高架 / 树簇 / 夜灯 / 图签 ============
上一轮的病是"线在纸上飘"：三横三纵只有 stroke，块与块之间是空的，图读起来像一张网格表。
这一轮先把地皮铺出来（BLOCKS 16 块，住/院/商/公/绿五张脸），再把江滨路、两座桥、环城高架与树簇
放上去；夜里那排路灯与瓦片上的亮窗只在 .dark 时出现（mood 由 MAP.mark 每次 paint 刷，
静态签名里不含时辰，不补这一刀就会半张图入夜）。字全部走 var(--ui)/mono，衬线只留给图签那五个大字。 */
.mBlock{fill:none;stroke:rgba(92,84,68,.15);stroke-width:.9}
.mBlock.res{fill:url(#mHatchRes)}
.mBlock.com{fill:url(#mHatchCom)}
.mBlock.gov{fill:rgba(38,69,111,.045)}
.mBlock.yard{fill:rgba(154,105,46,.06)}
.mBlock.green{fill:rgba(77,107,87,.09);stroke:rgba(48,74,58,.2)}
.mRoad .mBank{stroke:rgba(32,36,42,.15);stroke-width:5}
.mElevDeck{fill:none;stroke:rgba(59,54,44,.34);stroke-width:2.4}
.mPier{stroke:rgba(59,54,44,.3);stroke-width:1.6;fill:none}
.mBridgeDeck{fill:none;stroke:rgba(240,236,224,.86);stroke-width:3.4}
.mBridgeRail{fill:none;stroke:rgba(59,54,44,.52);stroke-width:1}
.mWater{fill:rgba(38,69,111,.19);stroke:rgba(38,69,111,.36)}
.mRipple{fill:none;stroke:rgba(38,69,111,.4);stroke-width:1;stroke-dasharray:3 4;
animation:mTide 7s ease-in-out infinite alternate}
.mRipple.r2{animation-delay:2.2s}
.mRipple.r3{animation-delay:4.1s}
@keyframes mTide{from{opacity:.32}to{opacity:.85}}
.mTree circle{fill:rgba(77,107,87,.3);stroke:rgba(48,74,58,.52);stroke-width:.7}
.mTree path{fill:none;stroke:rgba(59,54,44,.5);stroke-width:1.1}
/* 夜里的两样活：一排路灯 + 瓦片上的亮窗。白天一律收成 0，不是删掉——图层顺序不能动 */
.mLampRow{opacity:0;transition:opacity .6s ease}
.mapSvg.dark .mLampRow{opacity:1}
.mLamp{fill:#f2dca9;stroke:rgba(59,54,44,.4);stroke-width:.5}
.mLampGlow{fill:rgba(240,217,164,.2)}
.mPole{fill:none;stroke:rgba(59,54,44,.42);stroke-width:.8}
.mWin{fill:#e8b56a;opacity:0;transition:opacity .5s ease}
.mNode.lit .mWin{opacity:.85}
.mWin.w2{fill:#f2dca9}
.mWin.w3{fill:#cfe0e6}
/* 热度晕：烧到 58 以上才铺，只当"这块地在躁"的第一眼，数字仍是第二眼 */
.mGlow{pointer-events:none}
.mGlow.h2{fill:url(#mGlow2)}
.mGlow.h3{fill:url(#mGlow3)}
/* 名字下面那张纸衬：底块一铺，12 单位的字飘在斜纹上就读不清了 */
.mPlate{fill:rgba(244,239,227,.74);stroke:rgba(92,84,68,.12);stroke-width:.6;pointer-events:none}
.mapSvg.dark .mPlate{fill:rgba(220,215,204,.7)}
/* 图签：一块压纸 + 双钩 + 五个衬线大字 + 一枚白文印 */
.mCartPad{fill:rgba(244,239,227,.92);stroke:rgba(59,54,44,.44);stroke-width:1.4}
.mCartIn{fill:none;stroke:rgba(59,54,44,.24);stroke-width:.8}
.mCartN{fill:var(--police);font-family:var(--serif);font-size:20px;letter-spacing:3px}
.mCartDiv{fill:none;stroke:rgba(59,54,44,.3);stroke-width:.9}
.mMeta2{opacity:.74}
.mSeal{opacity:.92}
@media (max-width:700px){
.mCartN{font-size:20px;letter-spacing:1px}
.mRoadName text{opacity:.9}
}
@media (prefers-reduced-motion: reduce){
.mRipple{animation:none}
.mLampRow,.mWin{transition:none}
}
/* ============ v241 · 两笔从混序跑测里捞出来的账 ============
① a11y() 命中区 [INPUT.,13]：js/aid.js 那张接口设置里的"演练模式"是一颗原生 13×13 的
checkbox，而 `.noteRow input{flex:1;padding:7px 10px}` 是给文本框写的，套在复选框上
既没把它撑大、又让它跟文字抢宽度。这里单独给复选框一条：定尺寸、不参与伸缩。
② icons() 那两扇门各自借了别人的底色：`#dockAiSet` 用的是 .dockBtn.call（与"接警"同一副
警蓝）、`#dockFriend` 用的是 .dockBtn.aff（与"私事"同一副灰蓝），门上又都只有一个字，
于是"策/接""朋/私"只能靠那一个字分。这两扇各给一副自己的底色：
AI 接口走墨绿（在值班室里把线接上那种冷色），朋友走赭石（人情那一路的暖色）。 */
.noteRow input[type="checkbox"]{flex:0 0 24px;width:24px;height:24px;padding:0;margin:0 2px 0 0;
accent-color:var(--police);vertical-align:middle}
.dockBtn.aiSet .dockIcon{background:linear-gradient(180deg,#2f4a46,#1d2f2c)}
.dockBtn.aiSet .dockIcon{color:#fdf6e8}
.dockBtn.friend .dockIcon{background:linear-gradient(180deg,#6b543c,#423322)}
.dockBtn.friend .dockIcon{color:#fdf6e8}
/* ============ 两扇新门补上的那张画 ============
朋友圈与 AI 接口设置是这一轮才挂上 dock 的两扇，正文里没有横带，于是 hierarchy() 的
「画面锚」把它们两扇都点了名。两张都是 1200×360 的手绘水彩（源 SVG 留在 assets/_superseded/），
主体压在 y 75~250 那一条里 —— cover 进 106px 高的横带正好落在腰上，所以跟 det/law 同用 center 45%。 */
.art.friends,.art.aiset{background-position:center 45%;background-size:cover}
.art.friends{background-image:url(../assets/art_friends.webp)}
.art.aiset{background-image:url(../assets/art_aiset.webp)}
/* =========================================================
v242 · 反馈层：点击之后递出来的那几张纸
这一层一天要弹几百次——每一次点击都有回话。它不该是一排药丸，
而该像值班室里递出来的一叠便条：纸色、骑缝、落款章，
长句能折行，进来时落定，出去时不留痕。
规矩：字号整像素（11.5 地板往上），小字不用衬线（--ui），
颜色只给"色签与落款"，纸面保持中性，字才读得清。
========================================================= */
#toasts{ top:auto; bottom:16px; gap:8px; flex-direction:column-reverse; }
#toasts .toast{
position:relative;
display:flex; align-items:center; gap:11px;
min-width:236px; max-width:min(72vw,42em);
padding:12px 18px 12px 13px;
font-family:var(--ui); font-size:16px; font-weight:600; letter-spacing:.3px; line-height:1.5;
color:var(--ink); text-align:left;
background:linear-gradient(180deg,#fffdf7,#f4eddd);
border:1px solid rgba(32,36,42,.18);
border-left:4px solid var(--ink3);
border-radius:3px;
box-shadow:0 1px 0 rgba(255,255,255,.72) inset, 0 10px 26px rgba(40,34,24,.22);
animation:toastRise .26s cubic-bezier(.22,.9,.24,1) both;
}
#toasts .toast .toastSeal{ /* 章：与动作回执同一套勾/叉/台账图形（UI.SEAL） */
width:32px; height:32px; flex:0 0 32px; color:var(--ink3); opacity:.9; align-self:flex-start; margin-top:1px;
}
#toasts .toast .toastTxt{ min-width:0 }
#toasts .toast::after{ /* 骑缝虚线 */
content:""; position:absolute; right:9px; top:11px; bottom:11px; width:1px; opacity:.45;
background:repeating-linear-gradient(180deg,rgba(32,36,42,.3) 0 3px,transparent 3px 7px);
}
#toasts .toast.good{ border-left-color:var(--bamboo); }
#toasts .toast.good .toastSeal{ color:var(--bamboo); }
#toasts .toast.bad{ border-left-color:var(--cinnabar); }
#toasts .toast.bad .toastSeal{ color:var(--cinnabar); }
#toasts .toast.up{ border-left-color:var(--police); }
#toasts .toast.up .toastSeal{ color:var(--police); }
@keyframes toastRise{
from{ opacity:0; transform:translateY(12px) scale(.985); }
62%{ opacity:1; }
to{ opacity:1; transform:none; }
}
@media (prefers-reduced-motion:reduce){ #toasts .toast{ animation:none; } }
/* 动作回执（面板里那张纸便签）：补一枚落款与纸纹，别的别动 */
.actReceipt{
background:
linear-gradient(180deg,rgba(255,253,247,.97),rgba(245,239,225,.97));
border:1px solid rgba(32,36,42,.16);
border-left:3px solid var(--police);
box-shadow:0 6px 18px rgba(40,34,24,.13);
}
.actReceipt.good{ border-left-color:var(--bamboo); }
.actReceipt.bad{ border-left-color:var(--cinnabar); }
.actReceipt .arTag{ font-family:var(--ui); font-size:11.5px; font-weight:700; letter-spacing:1px; }
/* ============ v242 · 字体分配：界面走雅黑、抬头走思源宋、数字走等宽 ============
为什么改（2026-10-21 在这台机器上量的字体文件）：simkai / simfang / simsun / simhei /
msyh(三档真字重) / Deng 三档 / MiSans-Regular 一档 / NotoSansSC-VF / NotoSerifSC-VF
都在。所以"换字体"不是缺东西，是现有的 token 把字放错了位置：
· `--ui` 第一位是 Noto Sans SC —— 全站 12–15px 的正文都在思源黑上；它清晰，但
这一档 hinting 最稳的是微软雅黑，而且雅黑有 Light/Regular/Bold 三档**真字重**
（MiSans 只有 Regular，一加粗就是浏览器合成的假粗体，糊）。
· `--disp` 第一位是 KaiTi —— 抬头与 HUD 的大数字都在楷体上。楷体没有粗档，
做大标题笔画偏细撑不住；**数字更不该是衬线**，表里两个数对不齐。
两条硬约束照旧：<18px 不用任何衬线；字号除 11.5 地板外整像素。
⚠ `--serif/--kai/--fang/--fz/--brush` 继续指 `var(--ui)`（v158 定的），
别顺手把它们指回楷体/仿宋——那 60 多处引用里大量在 11.5–15px，一改就整片违规。 */
:root{
--ui:"Microsoft YaHei","微软雅黑","Police Sans","Noto Sans SC","MiSans","PingFang SC","Hiragino Sans GB",sans-serif;
--hei:var(--ui);
--num:var(--ui);
--disp:"Police Serif","Noto Serif SC","Source Han Serif SC","思源宋体 CN","Songti SC","SimSun",serif;
}
/* 抬头：思源宋 600。楷体的位置留给"手写的字"——落款、印章、引文，那些在 SVG 里 */
.mTitle,.docTitle,.endWrap .big{font-family:var(--disp);font-weight:600}
.qTitle,.startScreen .lineCard h3,.startScreen .inkTitle h1,.startScreen .sealBig{font-family:var(--disp);font-weight:600}
/* ⚠ 下面三条是从 v158 那颗 `--disp` 组里**摘出来**的：它们都在 18px 以下，
照"<18px 不用衬线"的规矩本来就不该进那条通道（改之前 .qTitle 是 15px 楷体、
.stamp 是 12px 楷体，只是 legible() 没抽到那几屏才一直没报）。 */
.qTitle{font-family:var(--ui)} /* 队列卡标题 15px */
.stamp{font-family:var(--ui)} /* 旋转印章图形 12px */
/* 时钟是数字：从衬线里取回来，并用等宽数字——否则 3:04 进 3:05 时整行会左右抖 */
.clock{font-family:var(--num);font-variant-numeric:tabular-nums}
/* HUD 与面板 KPI 的大数字同理 */
.stat .v,.mgKpi .kpi .v{font-family:var(--num);font-variant-numeric:tabular-nums}
/* 账目与表格里的数字统一等宽，两行对比时个位对个位 */
.kvTable td,.ctlTotal b,.gkNum,.logLine .d,.prRow{font-variant-numeric:tabular-nums}
/* =========================================================
v243 · 反馈层续：提示条可点即收 · 窄屏改落底部 · 回执配一枚小印
一、点一下就收：提示条是"回话"，读完就该走；等它自己淡出是浪费。
键盘同样收（Enter / 空格），所以它进得了 Tab 序列，也得有 focus 环。
二、窄屏（≤800，警情队列是通栏钉底那档）把提示条挪到队列上沿：
队列高度当场量一次，写进 --toastBottom，宽屏不动。
三、回执便签加一枚小印：办成了打勾、没成打叉、记下了是一页台账。
纯路径，不用 SVG ——手拼小字过不了静态尺子。
========================================================= */
#toasts .toast{ pointer-events:auto; cursor:pointer; }
#toasts .toast:hover{ background:linear-gradient(180deg,#fffefa,#f1e9d7); }
#toasts .toast:active{ transform:translateY(1px); }
#toasts .toast:focus-visible{ outline:2px solid var(--police); outline-offset:2px; border-radius:2px; }
@media (max-width:800px){
/* v248 起底部本来就是默认落位，这一档只管两件事：
① 把这一摞抬到钉死的警情队列上沿（--toastBottom 量出来的）；
② 队列上方先给回执浮条，提示条再往上让一格（--floatH）。
浮条的 inline top 是 recPlace 扫出来的，窄屏中段被通栏坞占满、扫不出干净带，
所以这里用 !important 把它钉回底部带上——上一版它就是这么骑在队列上 14px 的。 */
#toasts{ bottom:calc(var(--toastBottom,16px) + var(--floatH,0px) + 8px); }
.actReceipt.float{ top:auto !important; bottom:var(--toastBottom,16px) !important; }
}
.actReceipt .arSeal{ width:30px; height:30px; flex:0 0 30px; color:var(--ink3); opacity:.9; align-self:center; }
.actReceipt.good .arSeal{ color:var(--bamboo); }
.actReceipt.bad .arSeal{ color:var(--cinnabar); }
/* v244 · 回执再配一枚"从哪一格来"的小标：抽屉标题认门，认不出就算值班室 */
.actReceipt .arSrc{ display:inline-flex; align-items:center; gap:4px; font-size:11.5px; color:var(--ink3); letter-spacing:.6px; white-space:nowrap; }
.actReceipt .arSrcIco{ width:17px; height:17px; flex:0 0 17px; opacity:.85; }
/* v244b · 回执正文整行另起：抬头一行（印·判定·来源·去向），正文一行，不再挤成三行 */
.actReceipt .arText{ flex:1 1 100%; }
/* v244c · 整行正文只给面板里的便签；浮条窄，正文仍与抬头同行，条子才不压成三行 */
.actReceipt.float .arText{ flex:1 1 12em; }
/* =========================================================
v245 · 美术三件：警情类别小图 · 落笔动效统一 · 朱批
① 队列：左边那道等级纹样之外，标题前补一枚类别线稿——先看"这是什么事"，再看"几级"。
② 落笔：结算屏、定帧回声、任免表用同一套"笔尖落纸→墨迹晕开"，节奏才是一套的。
③ 朱批：没凑齐的数、卡住的数、倒查出来的数，红笔在下面划一道。
========================================================= */
.qKind{ display:inline-flex; width:17px; height:17px; margin-right:5px; vertical-align:-3px; color:var(--ink3); opacity:.9; }
.qKind svg{ width:17px; height:17px; }
.qCard .qTitle{ display:flex; align-items:flex-start; gap:0; }
.qCard .qTitle .qKind{ flex:0 0 17px; margin-top:1px; }
@keyframes inkLand{
from{ opacity:0; transform:translateY(6px) scale(.99); filter:blur(2px); }
55%{ opacity:1; }
to{ opacity:1; transform:none; filter:blur(0); }
}
.doc.settle{ animation:inkLand .26s ease-out both; }
.pwEcho{ animation:inkLand .24s ease-out both; }
.pwEcho .pwLine{ animation:inkLand .22s ease-out both; }
.zhu{ position:relative; }
.zhu::after{
content:""; position:absolute; left:-1px; right:-1px; bottom:-2px; height:2px; border-radius:2px;
background:linear-gradient(90deg,rgba(168,57,44,0),rgba(168,57,44,.85) 22%,rgba(168,57,44,.85) 78%,rgba(168,57,44,0));
}
.prNum.zhu{ color:var(--cinnabar); }
/* v245b · 朋友圈里的人也该有脸：沿用私事台账那套"背光剪影 + 环境物"，小一档 */
.frHead{ display:flex; align-items:flex-start; gap:10px; }
.frWho{ min-width:0; flex:1 1 auto; }
.frWho .docTitle{ line-height:1.2; }
.frFace{
width:46px; height:61px; flex:0 0 46px; border-radius:3px;
background-size:cover; background-position:center 22%;
border:1px solid rgba(32,36,42,.2);
box-shadow:0 1px 3px rgba(40,34,24,.18);
}
.frCard .mfGrid{ margin-top:6px; }
/* v245c · 窄屏坞拉手：门收成图标条，竖地方还给警情队列；拉手随坞走 */
.dockFold{ display:none; }
@media (max-width:1000px){
.dockFold{
display:inline-flex; align-items:center; justify-content:center;
width:30px; height:30px; flex:0 0 30px; margin:0 0 4px auto;
font-family:var(--ui); font-size:16px; line-height:1; color:var(--ink2);
background:linear-gradient(180deg,rgba(255,253,247,.9),rgba(240,233,218,.9));
border:1px solid rgba(32,36,42,.2); border-radius:3px; cursor:pointer;
}
.dockFold:hover{ color:var(--ink); border-color:rgba(32,36,42,.4); }
.dockFold:focus-visible{ outline:2px solid var(--police); outline-offset:2px; }
.leftDock{ flex-wrap:wrap; }
/* 收成图标条也不许长过屏：45 扇门摊开会顶到屏幕外面去（top 变负），按 HUD 实测高收口让它自己滚 */
.leftDock.rail{ max-height:min(36vh, calc(100vh - var(--hudH,155px) - 120px)); }
.leftDock.rail .dockHead{ display:none; }
.leftDock.rail .dockGrp{ flex:0 1 auto; }
.leftDock.rail .dockItems{ grid-template-columns:repeat(auto-fill,minmax(44px,1fr)); }
.leftDock.rail .dockBtn{ padding:5px 4px; }
.leftDock.rail .dockIcon{ width:26px; height:26px; font-size:13px; }
}
/* v245d · 命中区：生活那几枚小按钮短边 23px，按 26px 补齐（与既有 .hotGo / .btn-sm 同一处规矩） */
.lifeBtns .btn{ min-height:26px; }
/* =========================================================
v246 · 界面三处返工（用户："1.卷宗框和现实需要美化重做 2.这个时间框改为重新设计样式一点要美观
简洁的放在第三张截图的我画出来的区域 4.把暂停加速的按钮往右边挪放到原来那个当值框里"）
① 卷宗·最新：老的四层补丁（1130 蓝框 + 3px 警蓝脊 / 1830 字号 / 1974 每行虚线 + 2px 透明左脊 /
2187 状态色左脊 / 3452 头部字号）叠出来的读感是"每一行左边一根不同色的棍、行末一条虚线"，
而时间戳与正文挤在同一行里 —— `bad` 那条整行连时间都被刷成朱砂，`imp` 那条又是藏蓝。
新规矩只留三条：卡身一根藏蓝脊；头部一条发丝实线；条目 = 等宽时间戳独占一列（状态只落在
时间戳左边那 2px 与正文墨色上），正文自己两行截断。
另外查到一个死规则：1975 的 `.lsItem:first-child` 朱砂底与 2191 的脊色继承从来没命中过——
卡里第一个子元素是 .lsHead，不是 .lsItem。所以那两处红是"写了没生效"，这次不接管、也不补。
② 当值牌：≥1656px 时不再占 HUD 第一行右端，fixed 到左列 dock 正上方那块空白里——
left 与宽坞同一根公式（含 1401–1655 的出屏钳制），bottom 跟着 --hudH 走，所以它永远
贴在 dock 头顶 8px；牌面改成竖排三段（题名 / 时辰 / 天候+勤务），纸面与脊线跟 dock 同族。
门槛定 1656 而不是 1636：那段区间宽坞与图标条的右边界不同线，牌会多探出 10px（见下面②）。
低于 1656px 一律不动，维持 HUD 里的横牌。
③ 速度轨：当值牌出流后 .hudC 的 margin-left:auto（4629）自己落到第一行右端，就是原当值那格；
这里只把 24px 右缝补回来，让它与下面属性板同一条右边界。
========================================================= */
/* ---------- ① 卷宗卡 ---------- */
.logStream{
position:relative;padding:0;
border:1px solid rgba(32,36,42,.19);border-left:3px solid var(--police);border-radius:4px;
max-height:none;overflow:hidden;
background:linear-gradient(180deg,rgba(255,253,246,.96),rgba(242,236,222,.93));
box-shadow:0 2px 9px rgba(40,34,24,.10),inset 0 1px 0 rgba(255,255,255,.7);
font-size:var(--fs-sub);line-height:1.5;
transition:box-shadow .15s,transform .15s;
}
.logStream:hover{
background:linear-gradient(180deg,#fffdf7,rgba(246,241,229,.95));
box-shadow:0 5px 16px rgba(40,34,24,.16),inset 0 1px 0 rgba(255,255,255,.7);
transform:translateY(-1px);
}
.logStream:focus-visible{outline:2px solid var(--police);outline-offset:2px}
.logStream .lsHead{
margin:0;padding:6px 9px 5px;gap:7px;
display:flex;align-items:baseline;justify-content:flex-start;
font-family:var(--kai);letter-spacing:1.6px;color:var(--police);
background:linear-gradient(180deg,rgba(250,245,235,.95),rgba(238,231,215,.8));
border-bottom:1px solid rgba(38,69,111,.22);
}
.logStream .lsHead .lsTab{font-weight:700;letter-spacing:2.4px;color:var(--police)}
.logStream .lsHead .lsSub{
min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;
font-family:var(--ui);font-size:11.5px;letter-spacing:.4px;color:var(--ink3);
}
.logStream .lsHead::after{
content:"翻阅 ›";flex:0 0 auto;margin-left:auto;
font-family:var(--ui);font-size:11px;letter-spacing:.5px;color:var(--ink3);
}
.logStream .lsItem{
display:flex;align-items:flex-start;gap:7px;
margin:0;padding:5px 9px 5px 8px;
border:0;border-bottom:1px solid rgba(32,36,42,.08);
color:var(--ink2);white-space:normal;line-height:1.5;
}
.logStream .lsItem:last-child{border-bottom:0}
.logStream .lsItem .d{
flex:0 0 auto;margin:0;padding:1px 4px 1px 3px;
font-family:var(--mono);font-size:var(--fs-num);letter-spacing:0;font-variant-numeric:tabular-nums;
color:var(--ink3);background:rgba(38,69,111,.055);
border:0;border-left:2px solid rgba(32,36,42,.24);border-radius:0 2px 2px 0;
}
.logStream .lsItem .x{
flex:1 1 auto;min-width:0;
display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;
}
.logStream .lsItem.bad .d{color:var(--cinnabar);border-left-color:var(--cinnabar);background:rgba(168,57,44,.07)}
.logStream .lsItem.good .d{color:var(--bamboo);border-left-color:var(--bamboo);background:rgba(77,107,87,.08)}
.logStream .lsItem.imp .d{color:var(--police);border-left-color:var(--police);background:rgba(38,69,111,.09)}
/* ---------- ② 当值牌 → 左列 ---------- */
/* dock 那根 left 公式在 1401–1635 之间算出来是负数（158 宽的坞有半张掉到屏外，
1401 时 -18、1440 时 -98），钳到 max(10px,…)：≥1656 公式本来就大于 10，一视同仁；
1401–1655 落回 ≤1400 那层已经在用的"贴左边"读法。
牌搬出去的门槛定在 1656 而不是 1636，因为坞的两根 left 在 1448–1655 这段会一个被钳住、
一个还跟着公式走（宽坞 -18→10、图标条 70→104），右边界不再是同一条线——量过：1636 时
牌右 168、图标条右 158，牌比那条窄栏多探出 10px。1656 起两根公式都 ≥10，
宽坞/图标条/当值牌三者同一条右边界（1660 实测都是 170），才允许牌进场。 */
@media (min-width:1401px){
.leftDock{left:max(10px,calc(50% - 640px - 178px)) !important}
.leftDock.rail{left:max(10px,calc(50% - 640px - 84px)) !important}
}
@media (min-width:1656px){
.hudDate{
position:fixed;z-index:25;top:auto;
left:max(10px,calc(50% - 640px - 178px));
bottom:calc(100vh - var(--hudH,155px) - 6px);
width:var(--dock-w);min-width:0;max-width:none;margin:0;
padding:7px 8px 7px 10px;gap:3px;
border:1px solid rgba(32,36,42,.19);border-left:3px solid var(--cinnabar);border-radius:4px;
background:linear-gradient(180deg,rgba(255,253,246,.97),rgba(242,236,222,.95));
box-shadow:0 2px 9px rgba(40,34,24,.12),inset 0 1px 0 rgba(255,255,255,.72);
}
.hudDate::before{content:none} /* 4397 那圈虚线内框：竖牌里只剩噪点 */
.hudDate::after{width:11px;height:11px} /* 折角跟着牌一起收 */
.hudDateTop{min-height:0;gap:5px;padding:0 0 4px;border-bottom:1px solid rgba(38,69,111,.16)}
.hudYear{margin-left:auto;padding:1px 5px}
.hudDate .clockRow{flex-wrap:wrap;gap:4px 6px;margin-top:1px}
.hudDate .clock{
font-size:var(--fs-body) !important;letter-spacing:0 !important;line-height:1.35;
white-space:normal;
}
.hudDate .wxChip{padding:1px 6px}
.hudDate .dutyChip{padding:1px 5px !important;letter-spacing:.5px !important}
/* ③ 原当值那格换速度轨：把 24px 右缝补回来，与下面属性板同一条右边界 */
.hudC{flex:0 0 auto;margin-left:auto;padding:0 24px 0 14px}
}
/* ============ v247 · 当值盘：两张生成图 + 一根指针 ============
用户："这时钟显示太丑了能不能调用些技能来生成更好看的资源啊"。丑的不是字，是这张牌里
**没有一样东西是"画"出来的**：一行日期、一枚 15px 沙漏格、一枚 15px 天候格，剩下全是
repeating-linear-gradient 的假格线。所以这一轮补的是图，不是字号。
两张盘由 dev/imggen.mjs（商汤 sensenova-u1.5-lite）出：1024×1024 的八分空盘（对应
DATA.slots 那八条小时带，一条 45°）+ 24 格外圈刻线，**盘心留空、不画数字不画指针**——
指针得跟着 state.min 走，只能由 CSS 转，画进图里就是一根焊死的针。
出图之后按盘心 bbox 抠方居中（原图白边留了 8%～12%，不抠掉的话 66px 的位子里盘面只有 58px）。
⚠ --dialRot 不是估的：模型不知道"上方"是零点，暖弧/暗弧落在随机角度上。量法是把 0.74R
那一圈每 3° 采一次色，先扫 φ 让八道分界线落在 45k（两张实测 φ=1°，等于不用对齐），
再在 45° 的整数倍里挑一个把重心搬到该在的位置：白班盘暖弧重心实测 109°，+90° 落到 199°
（正午在 180°，四格昼带 90°～270° 之内）；夜班盘 v2 最暗重心实测 270°，+90° 落到 360°
（零点在顶，最亮那格 66~72°→+90=156~162° 落在午后，正是"天要亮了"那一头）。
换图必须重量，别沿用这两个数。
⚠ 夜班盘出过一张废图：外圈圆、内圈空白心偏了 6.8%R，指针轴心压在空白圈的边上，66px 里读成
"针焊歪了"；重出时提示词写死 concentric / no hub / spokes meet at the exact centre。
只在 ≥1656 的竖牌里出现：inline 那档 HUD 是一行横排，塞 66px 的圆进去等于把 HUD 顶高。 */
:root{
--dial-day:url(../assets/clock_dial_day.webp);
--dial-night:url(../assets/clock_dial_night.webp);
}
.hudDial{display:none}
@media (min-width:1656px){
.hudDial{display:flex;flex-direction:column;align-items:center;gap:2px;margin:2px 0 1px}
.dialRing{position:relative;width:66px;height:66px}
/* 出图自带一层纸底，`multiply` 会把这层方底压成盘外一圈可见的方角 → 裁成圆。
border-radius 先裁自己的背景盒，再被 transform 转：圆转圆，盘缘只吃到 10/1024。 */
.dialFace{
position:absolute;inset:0;background:var(--dial-day) center/contain no-repeat;
transform:rotate(90deg);mix-blend-mode:multiply;border-radius:50%;
}
.hudDial.is-night .dialFace{background-image:var(--dial-night);transform:rotate(90deg)}
/* 指针：整层与盘同尺寸、绕自身中心转（inset:0 让"自身中心"必然等于盘心），针与轴心
都从 50% 量出去。前一版把针写成"底边钉在 50%/50% + margin 半宽"，实测轴心偏右 2px。 */
.dialHand{position:absolute;inset:0;transform:rotate(var(--dialAng,0deg))}
.dialHand::before{
content:"";position:absolute;left:calc(50% - 1.25px);top:6px;width:2.5px;height:27px;
background:linear-gradient(180deg,var(--cinnabar) 0 74%,rgba(168,57,44,.3) 74% 100%);
border-radius:2px;
}
.dialHand::after{
content:"";position:absolute;left:calc(50% - 2.5px);top:calc(50% - 2.5px);width:5px;height:5px;
border-radius:50%;background:var(--ink);box-shadow:0 0 0 1px rgba(255,253,246,.7);
}
.dialCap{font-family:var(--ui);font-size:var(--fs-sub);letter-spacing:1px;color:var(--ink3);line-height:1.25}
/* 牌头一行：整牌不折行会把"当值 + 三级勤务 + 第4年"撑到 177px，而牌内宽只有 136（溢出 41，
年份直接画到牌外）。折行也不能整折——v246 之前就是逐字折，实测折成 81px 高三行。
所以换行单位改成"一枚章"：章在就两行、章不在就一行，章自己绝不拆字。 */
.hudDateTop{flex-wrap:wrap;row-gap:2px}
.hudDateTop>*{white-space:nowrap}
.hudDate .clockRow{flex-direction:column;align-items:center;flex-wrap:nowrap;gap:3px}
.hudDate .clock{text-align:center;white-space:nowrap}
.hudDate .clock::before{display:none} /* 沙漏格：有了盘就不需要一枚小沙漏报时 */
.hudDate .wxChip{margin-left:0 !important}
.hudDate .wxChip::before{width:20px;height:20px;flex:0 0 20px} /* 天候格 15→20：牌里它是唯一的情绪指示灯 */
}
/* ≤1655 一切照旧：牌回 HUD 那一行，盘不出现（.hudDial 基线就是 display:none） */
/* =========================================================
v248 · 外框与分区（用户："整个游戏的外框和分区都没有质感"）
1280 档那张值班页抄下来的四条病，每一条都对得上源码：
① 窗口与台面同色。#screenGame（94）从头到尾只有一层 `0 0 60px rgba(40,34,24,.22)` 的散影，
本体 rgba(247,243,233,.82) 压在 body 的 #dcd3c0 上，左右两条边根本读不出来；
而"屏幕外"那两条竖带没有任何明暗，它不是"桌子"，只是"没画"。
② 中间那一列没有纸。`.panel` 在整份 5766 行里**一条规则都没有**（只有 170 那条
`.panel[hidden]{display:none}`），所以场景条 / 氛围条 / 今天该做什么 / 值班文书
全部直接坐在窗口的米色上——"分区"三个字无从谈起。
③ 区头只是一行字。`.sectTitle` 的全部装备是 261 那个 5×15 的朱砂点（1919 改成 6×14）
加 1918 一道虚线；计数槽 `.sectN` 靠 `margin-left:auto` 悬在右边，没有任何容器。
它标的是"这一段"，画出来的却是一个列表项。
④ 卡片是"贴"上去的，不是"放"上去的。`.doc` 的阴影是 1900 那条 `0 3px 14px …9%`，
`.act` 是 207 的 `rgba(255,255,255,.66)` 加一条 1px 线——纸没有厚度，也就没有"一摞"。
这一层只做四件事：台面的暗角、窗口的卡纸与内衬线、区头的压印、卡片底下那两道纸边。
⚠ 铁律：**一条 padding / margin / width / height / font-size / border-width 都没写**，
全部走 box-shadow / background / outline / 绝对定位的伪元素。理由：
spill() 在 ≥1656 量的是当值牌、左坞、报头三条竖线是否同线（差 ≤1px）与牌头顶缝 6–10px，
hudSkin() 量牌高 150–215 与时钟不被裁，--hudH 是实测写回去的——这三把尺子量的都是盒子，
阴影、描边、背景不参与布局，所以这一层在物理上不可能把它们弄红。
反过来，只要谁在这层里补了一句 padding，#screenGame 那 5px 卡纸就会把左坞与牌一起顶偏。
⚠ 台面的暗角只往**窗口之外**压（body::before 在树序上排在 #screenGame 前面，被窗口盖住，
露出来的只有左右两条带）。这一层没有把窗口内的底色压暗：finePrint / hintInk 那批
ink3 小字直接坐在窗口底色上，压暗台面 = 直接违反 legible() 的 4.5:1。
所以做"深"的办法是把**纸面提亮**（.doc/.act/.stGrp 三处），不是把桌面压暗。
⚠ #screenGame 在横屏是 display:grid，::after 会变成一个网格项、凭空多一行。
所以它必须 position:absolute（#screenGame 自己就是 fixed，是现成的包含块）。
.leftDock 同理（fixed + flex 列）。
========================================================= */
/* ---------- ① 台面：暗角 + 一道斜纹（窗口之外，没有一行字） ----------
⚠ 暗角从 52% 才起、最外只压到 .20：1920 档第一版压到 .34 且 38% 就起，左右两条台面
读成"屏幕脏了一圈棕印子"。台面的作用是让窗口有边，不是做背景。 */
body::before{
content:"";position:fixed;inset:0;pointer-events:none;
background:
radial-gradient(150% 120% at 50% 50%, transparent 52%, rgba(46,36,22,.20) 100%),
repeating-linear-gradient(52deg, rgba(112,96,68,.030) 0 2px, transparent 2px 10px);
}
/* ---------- ② 窗口：硬边 → 卡纸 → 外沿 → 台面投影；内侧一道高光 ---------- */
#screenGame{
box-shadow:
inset 0 1px 0 rgba(255,255,255,.62),
0 0 0 1px rgba(32,36,42,.34),
0 0 0 4px rgba(252,247,236,.60),
0 0 0 5px rgba(32,36,42,.20),
0 16px 34px -10px rgba(30,24,16,.40),
0 44px 84px -32px rgba(30,24,16,.42);
}
/* 内衬线（四边各一道 1px）+ 下面两角一枚朱砂硬角：定长 px，宿主比例再怎么变都不拉伸
（与 v216 立绘四角同一招）。
⚠ 上面两角这一版撤了：1920 实测报头那条藏蓝带几乎铺到窗口右上角，朱砂 L 压在蓝底上
读成两块没擦干净的红渍；而报头自带一道金线，顶边本来就已经"收"过了。
底边两角留着——stage 下面那 90px 是空的纸，落点干净，天头地脚不对称是装订本来的样子。 */
#screenGame::after{
content:"";position:absolute;inset:0;pointer-events:none;
background:
linear-gradient(rgba(32,36,42,.13),rgba(32,36,42,.13)) 0 0/100% 1px no-repeat,
linear-gradient(rgba(32,36,42,.13),rgba(32,36,42,.13)) 0 100%/100% 1px no-repeat,
linear-gradient(rgba(32,36,42,.13),rgba(32,36,42,.13)) 0 0/1px 100% no-repeat,
linear-gradient(rgba(32,36,42,.13),rgba(32,36,42,.13)) 100% 0/1px 100% no-repeat,
linear-gradient(rgba(168,57,44,.58),rgba(168,57,44,.58)) 9px calc(100% - 11px)/22px 2px no-repeat,
linear-gradient(rgba(168,57,44,.58),rgba(168,57,44,.58)) 9px calc(100% - 31px)/2px 22px no-repeat,
linear-gradient(rgba(168,57,44,.58),rgba(168,57,44,.58)) calc(100% - 31px) calc(100% - 11px)/22px 2px no-repeat,
linear-gradient(rgba(168,57,44,.58),rgba(168,57,44,.58)) calc(100% - 11px) calc(100% - 31px)/2px 22px no-repeat;
}
/* ---------- ③ 文书卡：纸面提亮 + 底下两道"纸边" + 两层落影 ----------
⚠ 这上面不再叠自己的纤维：body::after（35）已经给全站铺了一层 0.18 multiply 的宣纸纹，
1920 实测再给每张卡加两道 repeating-linear-gradient 就成方格纸了——6px 与 7px 两条
不同周期的纹一交叉，读出来是"这卡片印着格子"，不是"这是纸"。 */
.doc{
border:1px solid rgba(32,36,42,.20);
border-radius:3px;
background:linear-gradient(180deg,#fffef9 0%,#fcf8ee 52%,#f6f0e2 100%);
box-shadow:
inset 0 1px 0 rgba(255,255,255,.98),
inset 0 0 0 1px rgba(255,255,255,.50),
0 1px 0 rgba(214,202,177,.62),
0 2px 0 rgba(198,185,158,.44),
0 3px 1px -1px rgba(30,24,16,.14),
0 12px 24px -10px rgba(30,24,16,.30);
}
/* 左脊：从"一根色条"改成"一根压进纸里的脊"——外圈一道白，右边一道影，读起来是凹的 */
.doc::before{box-shadow:1px 0 0 rgba(255,255,255,.55)}
/* ---------- ④ 区头：一条压印（实线 + 下面那道白 = 凸版）+ 朱砂扫过 + 计数槽成框 ---------- */
.sectTitle{
border-bottom:1px solid rgba(32,36,42,.24);
box-shadow:0 1px 0 rgba(255,255,255,.92), 0 2px 0 rgba(32,36,42,.055);
background:linear-gradient(90deg,rgba(168,57,44,.11),rgba(168,57,44,.035) 26%,rgba(168,57,44,0) 54%);
border-radius:2px 2px 0 0;
}
.sectTitle::before{
background:linear-gradient(180deg,var(--cinnabar) 0 58%,rgba(168,57,44,.5));
box-shadow:0 0 0 1px rgba(255,255,255,.6), 3px 0 0 -1px rgba(168,57,44,.20);
}
/* 计数槽：box-shadow 描边而不是 border——border 会吃掉那 12px 的文字宽度 */
.sectN{
color:var(--ink2);
background:rgba(255,255,255,.66);
border-radius:2px;
box-shadow:0 0 0 1px rgba(32,36,42,.14), inset 0 1px 0 rgba(255,255,255,.9);
}
/* ---------- ⑤ 动作卡：同一张纸，但压得更浅、抬得更近手 ---------- */
.act{
border:1px solid rgba(32,36,42,.19);
border-left:3px solid rgba(38,69,111,.42); /* 1949/3247 那根等级脊的宽度：简写会把它打回 1px */
border-radius:3px;
background:linear-gradient(180deg,#fffef9 0%,#faf6ec 100%);
box-shadow:
inset 0 1px 0 rgba(255,255,255,.98),
0 1px 0 rgba(214,202,177,.55),
0 2px 1px -1px rgba(30,24,16,.12),
0 7px 14px -8px rgba(30,24,16,.26);
}
.act:hover{
box-shadow:
inset 0 1px 0 rgba(255,255,255,.98),
0 1px 0 rgba(214,202,177,.55),
0 3px 2px -1px rgba(30,24,16,.15),
0 12px 20px -8px rgba(30,24,16,.32);
}
/* 左脊右边补一道白，让那 3px 色条从"贴在边上"变成"嵌进纸里" */
.act::before{
content:"";position:absolute;left:3px;top:4px;bottom:4px;width:1px;
background:linear-gradient(180deg,rgba(255,255,255,.85),rgba(255,255,255,.35));
}
.acts{border-top:1px solid rgba(32,36,42,.20);box-shadow:inset 0 1px 0 rgba(255,255,255,.8)}
/* ---------- ⑥ 属性板：那两组 meter 从"飘着的一排条"变成两块板 ---------- */
.stGrp{
border:1px solid rgba(32,36,42,.21);
border-radius:3px;
background:linear-gradient(180deg,rgba(255,255,255,.9),rgba(247,241,228,.66));
box-shadow:
inset 0 1px 0 rgba(255,255,255,.96),
0 1px 0 rgba(214,202,177,.5),
0 5px 12px -7px rgba(30,24,16,.30);
}
/* ---------- ⑦ 左坞：托板（外一圈硬边 + 内一道发丝 + 深投影） ---------- */
.leftDock{
background:linear-gradient(180deg,rgba(255,253,246,.98),rgba(242,235,220,.97));
border:1px solid rgba(32,36,42,.30);
border-left:3px solid var(--police); /* 1049 那根藏蓝脊：简写会把它打回 1px */
border-radius:8px;
box-shadow:
inset 0 1px 0 rgba(255,255,255,.96),
inset 0 0 0 1px rgba(255,255,255,.40),
0 0 0 1px rgba(32,36,42,.10),
0 2px 0 rgba(214,202,177,.5),
0 16px 30px -12px rgba(30,24,16,.42);
}
.leftDock::after{
content:"";position:absolute;inset:4px;pointer-events:none;border-radius:5px;
box-shadow:inset 0 0 0 1px rgba(32,36,42,.075);
}
/* ---------- ⑧ 右栏：与中间那一列之间要有"一道坎"，不是一条 1px 线 ---------- */
@media (min-width:640px) and (orientation:landscape){
.side{
border-left:1px solid rgba(32,36,42,.24);
background:linear-gradient(180deg,rgba(244,239,228,.66),rgba(236,229,212,.58));
box-shadow:
inset 1px 0 0 rgba(255,255,255,.72),
inset 2px 0 0 rgba(32,36,42,.05),
-18px 0 26px -18px rgba(30,24,16,.40);
}
}
/* ---------- ⑨ 其余纸片：与 .doc 同一套厚度，免得只有文书卡有影 ----------
⚠ 每个选择器在这层里只准出现一次：game.css 是按版本追加层，静态 [9] 数"同名类跨处定义"，
把 border-radius 单独立一条合并规则 = 给那十几个类各再加一笔账。 */
.todayBox{
border:1px solid rgba(32,36,42,.20);border-left:3px solid var(--ochre);border-radius:3px;
background:linear-gradient(180deg,#fffdf5,#f7efdd);
box-shadow:
inset 0 1px 0 rgba(255,255,255,.96),
0 1px 0 rgba(214,202,177,.55),
0 2px 0 rgba(198,185,158,.36),
0 9px 18px -9px rgba(30,24,16,.26);
}
.atmosBar{
border:1px solid rgba(32,36,42,.18);
border-left:3px solid var(--bamboo); /* 1501+1972 那根竹青脊：简写会把它打回 1px */
border-radius:3px;
background:linear-gradient(180deg,#fffdf6,#f4ecdb);
box-shadow:
inset 0 1px 0 rgba(255,255,255,.96),
0 1px 0 rgba(214,202,177,.5),
0 6px 14px -8px rgba(30,24,16,.24);
}
.dutyBanner{
border-radius:3px;
box-shadow:inset 0 1px 0 rgba(255,255,255,.5), 0 1px 0 rgba(214,202,177,.45), 0 4px 10px -6px rgba(30,24,16,.26);
}
.sceneBox{
border:1px solid rgba(32,36,42,.34);border-radius:3px;
box-shadow:
inset 0 0 0 1px rgba(255,253,246,.30),
0 1px 0 rgba(214,202,177,.6),
0 2px 0 rgba(198,185,158,.38),
0 12px 22px -10px rgba(30,24,16,.38);
}
.qCard{
border-radius:3px;
box-shadow:
inset 0 1px 0 rgba(255,255,255,.9),
0 1px 0 rgba(214,202,177,.55),
0 2px 0 rgba(198,185,158,.4),
0 10px 22px -8px rgba(30,24,16,.42);
}
.logStream{
border-radius:3px;
box-shadow:
inset 0 1px 0 rgba(255,255,255,.9),
0 1px 0 rgba(214,202,177,.55),
0 2px 0 rgba(198,185,158,.38),
0 9px 18px -9px rgba(30,24,16,.30);
}
.logStream:hover{
box-shadow:
inset 0 1px 0 rgba(255,255,255,.9),
0 1px 0 rgba(214,202,177,.55),
0 2px 0 rgba(198,185,158,.38),
0 14px 24px -10px rgba(30,24,16,.36);
}
.pCard,.lifeCard{
border-radius:3px;
box-shadow:
inset 0 1px 0 rgba(255,255,255,.92),
0 1px 0 rgba(214,202,177,.55),
0 2px 0 rgba(198,185,158,.38),
0 10px 20px -9px rgba(30,24,16,.34);
}
/* 抽屉里那几张（.evRail / .lawBox / .talkLog / .brief）这一层不动：它们都不在值班页上，
而 ⑩ 已经把整张抽屉抬起来了；再各加一笔只会喂给静态 [9] 那条"同名类跨处定义"。 */
/* ---------- ⑩ 抽屉：浮起来的那一张也要有卡纸，否则它和面板里的卡是同一个层级 ---------- */
.modalBox{
border:1px solid rgba(32,36,42,.40);
border-radius:4px;
background:linear-gradient(180deg,#fffef9,#f7f2e6);
box-shadow:
inset 0 1px 0 rgba(255,255,255,.98),
0 0 0 4px rgba(252,247,236,.34),
0 0 0 5px rgba(32,36,42,.16),
0 26px 56px -18px rgba(18,14,8,.66),
0 60px 90px -40px rgba(18,14,8,.55);
}
/* v253 · 反馈条加"画面"：当事人小像，没有就取面板横带的一角；抬头与来源并成一行 */
.actReceipt .arThumb{ width:32px; height:42px; flex:0 0 32px; border-radius:2px; background-size:cover; background-position:center 26%; border:1px solid rgba(32,36,42,.2); box-shadow:0 1px 3px rgba(40,34,24,.18); }
.actReceipt .arThumb.art{ width:52px; height:32px; flex:0 0 52px; background-position:center 45%; }
.actReceipt .arHead{ display:inline-flex; align-items:center; gap:7px; flex-wrap:wrap; }
/* v254b · 私事：她记住的事（攒出来的关系）与"把话说清楚"那一格 */
.affMem{ margin-top:6px; padding:6px 9px; border-left:2px solid rgba(143,106,48,.5); background:rgba(143,106,48,.05);
font-size:12px; line-height:1.7; color:var(--ink2); }
/* v255 · 私事：旧事那一行（记忆攒够了她才提起从前那件） */
.affOld{ margin-top:5px; padding:5px 9px; border-left:2px solid rgba(38,69,111,.4); background:rgba(38,69,111,.045);
font-size:12px; line-height:1.7; color:var(--ink2); font-style:italic; }
/* v258 · 私事与案子：她留意到的一件事 / 她被卷进你办的那件事 */
.affTip{ margin-top:6px; padding:7px 10px; border-left:2px solid rgba(77,107,87,.55); background:rgba(77,107,87,.05);
font-size:12px; line-height:1.75; color:var(--ink2); }
.affTip b{ color:var(--bamboo); }
.affHit{ margin-top:6px; padding:7px 10px; border-left:2px solid rgba(168,57,44,.55); background:rgba(168,57,44,.05);
font-size:12px; line-height:1.75; color:var(--ink2); }
.affHit b{ color:var(--cinnabar); }
/* v260 · 案卷备注上屏 · 灰色那边"你身后有人" · 她怕了 */
.caseNote{ margin-top:6px; padding:6px 9px; border-left:2px solid rgba(38,69,111,.5); background:rgba(38,69,111,.045);
font-size:12px; line-height:1.7; color:var(--ink2); }
.caseNote b{ color:var(--police); }
.affBacker{ margin:0 0 10px; padding:7px 10px; border-left:2px solid rgba(143,106,48,.55); background:rgba(143,106,48,.05);
font-size:12px; line-height:1.75; color:var(--ink2); }
.affBacker b{ color:var(--ochre); }
/* =========================================================
v263 · 技术鉴定台账：一物一行，左边一枚门类章
这一行不是表格，是"送来送去的那几件东西"——所以只留一道虚线分隔，
门类章用四块暗色（痕/医/理/数），结论只染右端那几个字。
========================================================= */
.labDoc{ padding:2px 12px 6px; }
.labRow{ display:grid; grid-template-columns:26px minmax(0,1fr) auto; gap:10px; align-items:center;
padding:8px 0; border-bottom:1px dashed rgba(32,36,42,.16); }
.labRow:last-child{ border-bottom:0; }
.labIco{ width:26px; height:26px; border-radius:3px; display:flex; align-items:center; justify-content:center;
font-family:var(--ui); font-size:12px; font-weight:700; color:#fffdf7; background:var(--ink3);
box-shadow:inset 0 0 0 1px rgba(255,255,255,.32); }
.labIco.hen{ background:#6f5a3e; }
.labIco.fa{ background:#8c4a3f; }
.labIco.li{ background:#41604e; }
.labIco.dian{ background:#3d4a63; }
.labName{ min-width:0; display:flex; flex-direction:column; gap:2px; font-family:var(--ui); font-size:13px; color:var(--ink); }
.labName b{ font-weight:600; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.labSub{ font-size:11.5px; color:var(--ink3); }
.labDue{ font-family:var(--ui); font-size:12px; font-weight:600; color:var(--ink2); white-space:nowrap; }
.labDue.good{ color:var(--bamboo); }
.labDue.warn{ color:var(--ochre); }
.labDue.bad{ color:var(--cinnabar); }
.labDue.dim{ color:var(--ink3); font-weight:400; }
.labRec{ margin-left:6px; padding:0 5px; border-radius:2px; font-family:var(--ui); font-size:11.5px;
font-weight:700; color:#fffdf7; background:var(--bamboo); }
.labBest{ border-color:rgba(77,107,87,.55); }
.labOff{ opacity:.5; }
/* v263 · 抓捕行动：情报 → 方案 → 收网 */
.raidDoc{ padding:2px 12px 8px; }
.raidChips{ display:flex; flex-wrap:wrap; gap:6px; }
.raidChip{ padding:2px 8px; border-radius:2px; font-family:var(--ui); font-size:12px;
border:1px solid rgba(32,36,42,.18); color:var(--ink3); background:rgba(32,36,42,.03); }
.raidChip.ok{ color:var(--bamboo); border-color:rgba(77,107,87,.45); background:rgba(77,107,87,.07); }
.raidChip.no{ color:var(--ochre); border-color:rgba(143,106,48,.4); background:rgba(143,106,48,.06); }
.raidMissBox{ margin-top:8px; display:flex; flex-direction:column; gap:4px; }
.raidMiss{ font-size:12px; line-height:1.7; color:var(--ink2); padding-left:9px;
border-left:2px solid rgba(143,106,48,.4); }
.raidAll{ margin-top:8px; font-size:12px; color:var(--bamboo); }
.raidWarn{ margin-top:8px; padding:6px 10px; border-left:2px solid var(--cinnabar);
background:rgba(154,58,48,.05); font-size:12px; line-height:1.7; color:var(--ink2); }
.raidOff{ opacity:.5; }
.raidOut{ padding:2px 12px 8px; display:flex; flex-direction:column; gap:8px; }
.raidBody{ font-size:13px; line-height:1.85; color:var(--ink); }
.raidLead{ padding:8px 10px; border-left:2px solid rgba(38,69,111,.5); background:rgba(38,69,111,.05);
font-size:12px; line-height:1.8; color:var(--ink2); }
.raidHurt{ padding:7px 10px; border-left:2px solid var(--cinnabar); background:rgba(154,58,48,.06);
font-size:12px; line-height:1.7; color:var(--ink2); }
.raidBook{ font-size:12px; color:var(--ink3); border-top:1px dashed rgba(32,36,42,.16); padding-top:7px; }
/* v263 · 街面巡逻：选线 → 走 → 盘查 */
.ptlDoc{ padding:2px 12px 8px; }
.ptlLead{ font-size:13px; line-height:1.85; color:var(--ink); padding:2px 0 4px; }
.ptlHeat{ display:flex; flex-wrap:wrap; gap:6px; margin:4px 0 2px; }
.ptlHot{ padding:2px 8px; border-radius:2px; font-family:var(--ui); font-size:12px;
border:1px solid rgba(154,58,48,.28); color:var(--ink2); background:rgba(154,58,48,.05); }
.ptlHot b{ margin-right:5px; font-weight:700; color:var(--cinnabar); }
.ptlOut{ padding:2px 12px 8px; display:flex; flex-direction:column; gap:8px; }
.ptlBody{ font-size:13px; line-height:1.9; color:var(--ink); }
.ptlEv{ padding:7px 10px; border-left:2px solid var(--bamboo); background:rgba(77,107,87,.06);
font-size:12px; line-height:1.7; color:var(--ink2); }
.ptlBook{ font-size:12px; color:var(--ink3); border-top:1px dashed rgba(32,36,42,.16); padding-top:7px; }
/* v264 · 群众来访：接待窗 → 接谈 → 答复 */
.vstDoc{ padding:2px 12px 8px; }
.vstLead{ font-size:13px; line-height:1.85; color:var(--ink); padding:2px 0 4px; }
.vstBody{ font-size:13px; line-height:1.85; color:var(--ink); }
.vstAsk{ padding:8px 10px; border-left:2px solid rgba(143,106,48,.45); background:rgba(143,106,48,.05);
font-size:12px; line-height:1.8; color:var(--ink2); }
.vstTag{ font-family:var(--ui); font-size:12px; color:var(--police); }
.vstOff{ opacity:.45; }
.vstSign{ border-left:3px solid var(--cinnabar) !important; }
.vstOut{ padding:2px 12px 8px; display:flex; flex-direction:column; gap:8px; }
.vstEv{ padding:7px 10px; border-left:2px solid var(--bamboo); background:rgba(77,107,87,.06);
font-size:12px; line-height:1.7; color:var(--ink2); }
.vstBook{ font-size:12px; color:var(--ink3); border-top:1px dashed rgba(32,36,42,.16); padding-top:7px; }
.vstNote{ margin-top:6px; padding:6px 10px; border-left:2px solid rgba(38,69,111,.45);
background:rgba(38,69,111,.05); font-size:12px; line-height:1.7; color:var(--ink2); }
/* ============ v265 · 案卷线索屏：一条线索一屏、卷宗面板一条主读序 ============
病根（作者："乱糟糟的字都记一起，特别是面板"）：
卷宗一打开是 图 → 十栏接警单 → 阶段 → 案情 → 人员档案 → 材料 chips → 锁定条件 → 技术鉴定
→ 四条取证按钮 → 抓捕 → 定性，**八块字先铺满一屏，动作在最后**。取证又是一点就回到那一屏，
只多了一行日志——玩家看不见"我刚查到了什么、它意味着什么"。
这一层做两件事：① 卷宗只留一条读序（案情 → 三枚数 → 逐条线索 → 已固定 → 下一步），
十栏单与人员档案折进 ；② 每条取证单独一屏：故事一段、结果一块、指向一句，一颗按钮。 */
.ledBar{display:flex;flex-wrap:wrap;gap:6px;margin:2px 0 10px}
.ledPill{font-size:12px;line-height:1.6;padding:2px 9px;border-radius:999px;color:var(--ink2);
background:rgba(32,36,42,.055);box-shadow:inset 0 0 0 1px rgba(32,36,42,.11)}
.ledPill b{font-weight:600;color:var(--ink)}
.ledPill.ok{color:var(--bamboo);background:rgba(77,107,87,.10);box-shadow:inset 0 0 0 1px rgba(77,107,87,.26)}
.ledPill.warn{color:var(--cinnabar);background:rgba(139,47,36,.075);box-shadow:inset 0 0 0 1px rgba(139,47,36,.22)}
.ledHead{display:flex;flex-wrap:wrap;gap:6px;margin:0 0 12px}
/* 线索卡：编号 | 标题 + 一行代价 | 右侧状态。一眼扫过去是一叠卡片，不是一段散文 */
.ledList{display:flex;flex-direction:column;gap:8px;margin:2px 0 12px}
.ledCard{display:grid;grid-template-columns:22px 1fr auto;gap:10px;align-items:center;
text-align:left;width:100%;margin:0;padding:10px 12px}
.ledCard .ledNo{font-size:12px;line-height:22px;text-align:center;color:var(--ink2);
background:rgba(32,36,42,.07);border-radius:2px}
.ledMain{min-width:0;display:flex;flex-direction:column;gap:3px}
.ledMain b{font-size:14px;font-weight:600;line-height:1.5}
.ledSub{font-size:12px;line-height:1.55;color:var(--ink2)}
.ledGo{font-size:12px;white-space:nowrap;color:var(--police);
padding:2px 8px;border-radius:2px;box-shadow:inset 0 0 0 1px rgba(38,69,111,.26)}
.ledCard.ok{opacity:.92}
.ledCard.ok .ledNo{color:var(--bamboo);background:rgba(77,107,87,.12)}
.ledCard.ok .ledGo{color:var(--bamboo);box-shadow:inset 0 0 0 1px rgba(77,107,87,.30)}
.ledCard.dead{opacity:.66}
.ledCard.dead .ledMain b{color:var(--ink2);text-decoration:line-through;text-decoration-thickness:1px}
.ledCard.dead .ledGo{color:var(--ink2);box-shadow:inset 0 0 0 1px rgba(32,36,42,.16)}
.ledCard.retry .ledGo{color:var(--cinnabar);box-shadow:inset 0 0 0 1px rgba(139,47,36,.28)}
.ledCard.retry .ledNo{color:var(--cinnabar);background:rgba(139,47,36,.10)}
/* 线索结果屏：故事一段（左脊是"这一笔在纸上"）、结果一块、指向一句 */
.ledStory{font-size:15px;line-height:1.85;color:var(--ink);text-wrap:pretty;
padding:12px 14px;border-left:3px solid rgba(38,69,111,.35);border-radius:2px;
background:linear-gradient(180deg,rgba(255,254,249,.92),rgba(250,246,236,.74));
box-shadow:inset 0 1px 0 rgba(255,255,255,.9)}
.ledOut{margin:12px 0;padding:10px 12px;border-radius:3px;font-size:14px;line-height:1.75}
.ledOut b{display:block;font-size:12px;margin-bottom:3px}
.ledOut.good{background:rgba(77,107,87,.085);box-shadow:inset 0 0 0 1px rgba(77,107,87,.22)}
.ledOut.good b{color:var(--bamboo)}
.ledOut.bad{background:rgba(139,47,36,.07);box-shadow:inset 0 0 0 1px rgba(139,47,36,.20)}
.ledOut.bad b{color:var(--cinnabar)}
.ledWhat{font-size:13px;line-height:1.7;color:var(--ink2);text-wrap:pretty}
/* 折叠块：十栏接警单与人员档案还在 DOM 里（跑测台读得到），只是不再一上来铺满整屏 */
.fold{margin:10px 0;border-radius:3px;background:rgba(32,36,42,.035);
box-shadow:inset 0 0 0 1px rgba(32,36,42,.10)}
.fold>summary{cursor:pointer;list-style:none;padding:9px 12px;font-size:13px;color:var(--ink2);
display:flex;align-items:center;gap:8px}
.fold>summary::-webkit-details-marker{display:none}
.fold>summary::before{content:"▸";font-size:12px;color:var(--ink3)}
.fold[open]>summary::before{content:"▾"}
.fold[open]>summary{border-bottom:1px solid rgba(32,36,42,.10)}
.fold>*:not(summary){margin-left:12px;margin-right:12px}
.fold>*:not(summary):first-of-type{margin-top:10px}
.fold>*:not(summary):last-child{margin-bottom:10px}
.fold>summary:hover{color:var(--ink)}
.fold>summary:focus-visible{outline:2px solid var(--police);outline-offset:-2px;border-radius:3px}
/* ============ v266 · 审讯屏：四个入口、逐条供词、一回合一块 ============
病根：11 颗按钮各带一行说明铺满首屏，玩家还没看清他是什么人先读掉二十行；
对话只留最后两句，矛盾点只给一个数字（3/3），"一条条堵住"这件事在画面上不存在。
这一层把策略收成四组入口、把供词逐条摊开、把一回合的账单独成块。 */
.npcBarWrap{margin:2px 0 12px}
.itrGroup .ledNo{color:var(--police);background:rgba(38,69,111,.10)}
/* 供词清单：一句一行，没堵住的朱砂点、堵住的竹青点并划掉 */
.itrContra{display:flex;flex-wrap:wrap;align-items:baseline;gap:6px 8px;padding:8px 2px;
border-bottom:1px dashed rgba(32,36,42,.12);font-size:13px;line-height:1.7}
.itrContra:last-child{border-bottom:0}
.itrDot{flex:0 0 auto;width:7px;height:7px;border-radius:50%;background:var(--cinnabar);margin-top:7px}
.itrContra b{font-weight:600;min-width:0}
.itrContra.done .itrDot{background:var(--bamboo)}
.itrContra.done b{color:var(--ink2);text-decoration:line-through;text-decoration-thickness:1px}
.itrHave{margin-left:auto;font-size:12px;color:var(--ink2);white-space:nowrap}
.itrContra.done .itrHave{color:var(--bamboo)}
/* ============ v267 · 主线的章 ============
只有 DATA.caseChapters 里登记过的那一卷会分章；其余案子一次铺开。
章头一行：第 N 章 · 标题 · 进度 —— 下面一句"现在该干什么"，再下面是这一章的线索卡。 */
.chHead{display:flex;flex-wrap:wrap;align-items:baseline;gap:6px 9px;margin:14px 0 8px;
padding:7px 11px;border-radius:3px;background:rgba(38,69,111,.055);
box-shadow:inset 0 0 0 1px rgba(38,69,111,.15)}
.chHead b{font-size:14px;font-weight:600}
.chNo{font-size:12px;color:var(--police);padding:1px 7px;border-radius:2px;background:rgba(38,69,111,.12)}
.chN{margin-left:auto;font-size:12px;color:var(--ink2)}
.chLead{flex:1 0 100%;font-size:13px;line-height:1.65;color:var(--ink2);text-wrap:pretty}
.chHead.off{background:rgba(32,36,42,.04);box-shadow:inset 0 0 0 1px rgba(32,36,42,.10)}
.chHead.off .chNo{color:var(--ink2);background:rgba(32,36,42,.07)}
.chHead.off b{color:var(--ink2)}
.ledCard.locked{opacity:.55}
/* ============ v270 · 线索屏与后期横带 ============
线索屏（v265）那一屏原来只有字：三枚 pill、一段故事、一块结果。
这一层给它一张取证工作台；后期三件（家里被骗 / 老屋 / 交班）各有一条自己的画面，
不再借通用的街面/屋内场景图。 */
.art.lead{background-image:url(../assets/art_lead.webp)}
.art.lead{height:124px;background-position:center 48%}
/* ============ v272 · 「送检」门牌 ============
这扇门在门牌表 HELP.DOORS.lab 里有、码头上一直没有——compreh 的两条红
（"dock 45 ≠ 门牌 46""表里有一扇打不开的门 lab"）就是它。
底色用赭褐：与接警的蓝、私事的灰、AI 的藏青、朋友的灰蓝都分得开。
⚠ 渐变与字色**两条一起写**：基类为了让位给 sprite 纹样把 color 压成了 transparent。 */
.dockBtn.lab .dockIcon{background:linear-gradient(180deg,#7a6242,#463526)}
.dockBtn.lab .dockIcon{color:#fdf6e8;font-size:15px;font-weight:600;letter-spacing:0}
/* ============ v301 · 第二轮美术：让纸真的像纸 ============
v295 只铺了一层 0.82 透明度的浅纸，铺在 #screenGame 的米色底上读不出边界；
这一轮把主面板做成一张有边、有厚度、有装订线的纸，并修掉 1401–1655 档
左坞压正文的硬伤（实测 1366/1440 各遮 137/100px）。 */
.panel{
border:1px solid rgba(32,36,42,.17);
border-radius:3px;
background:
linear-gradient(180deg,#fffef9 0%,#fcf8ee 55%,#f5efe1 100%),
repeating-linear-gradient(0deg,rgba(120,102,72,.02) 0 1px,transparent 1px 7px);
box-shadow:
inset 0 1px 0 rgba(255,255,255,.95),
inset 3px 0 0 rgba(168,57,44,.28),
inset 4px 0 0 rgba(255,255,255,.65),
0 1px 0 rgba(214,202,177,.6),
0 3px 12px -4px rgba(30,24,16,.22);
}
/* 案头、联动、锦旗三枚小印记在纸面上要压得住：墨色加深一档 */
.inkMark{opacity:.9}
/* 抽屉面板继承同一张纸；ID 规则自带底色的，用 ::before 补一道装订线 */
#tab-case,#tab-job,#tab-rel,#tab-grow,#tab-life,#tab-file,#tab-log{
box-shadow:inset 3px 0 0 rgba(168,57,44,.3),inset 4px 0 0 rgba(255,255,255,.6),0 -6px 22px -8px rgba(30,24,16,.35);
}
button,select,input{font-size:inherit}
/* ---------- 左坞不再压正文 ---------- */
/* 根因：.stage 的正文从窗口左缘起排，而左坞 fixed 在 left:10px、宽 158（右缘 168）。
#screenGame 居中，窗口左缘 x = max(0, (vw-1280)/2)，所以只要 x < 168 就会叠上，
即 vw < 1616。实测 1660 无重叠、1500 遮 70、1440 遮 100、1280/1100 遮 158。
修法：按窗口左移量分档补内衬，让正文永远起在坞右缘之外。不把坞收成图标条——
46 扇门靠门名认路，藏字等于把入口藏了。 */
@media (min-width:1001px) and (max-width:1360px){ .stage{padding-left:178px !important} }
@media (min-width:1361px) and (max-width:1480px){ .stage{padding-left:140px !important} }
@media (min-width:1481px) and (max-width:1615px){ .stage{padding-left:90px !important} }
@media (min-width:1616px){ .stage{padding-left:28px !important} }
/* 十扇后加入口不再各用一块现代渐变色；统一成与水墨 sprite 相同的宣纸墨印。 */
#dockCall .dockIcon,#dockAiSet .dockIcon,#dockBrk .dockIcon,#dockUmb .dockIcon,#dockGrey .dockIcon,
#dockMatch .dockIcon,#dockAff .dockIcon,#dockFriend .dockIcon,#dockLab .dockIcon,#dockHelp .dockIcon{
color:var(--ink2);font-family:var(--kai);font-size:15px;font-weight:700;letter-spacing:0;
background:
radial-gradient(circle at 48% 42%,rgba(32,36,42,.20),rgba(32,36,42,.08) 50%,transparent 74%),
rgba(246,240,226,.34);
border:1px solid rgba(32,36,42,.24);
box-shadow:inset 0 0 0 1px rgba(255,255,255,.44);
mix-blend-mode:multiply;
-webkit-mask-image:radial-gradient(circle at 50% 50%,#000 64%,rgba(0,0,0,0) 84%);
mask-image:radial-gradient(circle at 50% 50%,#000 64%,rgba(0,0,0,0) 84%);
}
/* 业务符号改用同一套小印记，不再调用系统彩色 emoji。 */
.inkMark{display:inline-grid;place-items:center;width:14px;height:14px;margin-right:4px;vertical-align:-2px;
font:700 10px/1 var(--kai);font-style:normal;color:currentColor;border:1px solid currentColor;border-radius:2px;opacity:.78}
.honorFlags{display:flex;flex-wrap:wrap;gap:5px;margin-bottom:4px}
.honorFlag{display:inline-grid;place-items:center;width:22px;height:28px;font:700 12px/1 var(--kai);font-style:normal;
color:#f8edda;background:linear-gradient(180deg,#aa4637,#7f2d24);border:1px solid rgba(91,30,24,.65);
clip-path:polygon(0 0,100% 0,100% 78%,50% 100%,0 78%);box-shadow:0 2px 4px rgba(30,24,16,.16)}
/* 案件图保留稀缺感，只让已有素材真正露出来。 */
.caseStrip{height:76px}
/* 队列里的四枚 emoji 等级符（🚨🚔📞💬）换回文字记号：水墨卷宗里不该蹦系统彩符 */
/* ============ v275 · 孩子那一格 ============
孩子从"家里 N 个"那一行变成一张卡：名字 / 性别 / 岁数 + 亲密度条 + 两条动作。
进度条与数字沿用既有的 .relRow/.prBar/.prNum，只把姓名那一列让宽——
.relKey 的 78px 是给"父母 / 朋友"那种两个字写的，装不下"陈小满 · 儿子 · 6 岁"。 */
.kidCard{margin-top:8px;padding-top:8px;border-top:1px dashed rgba(120,102,72,.26)}
.kidRow .relKey{width:auto;flex:1 1 auto;min-width:0;font-size:13px;letter-spacing:0}
.kidRow .prBar{flex:0 0 84px}
.kidRow .prNum{font-size:12px}
.kidActs{margin-top:6px}
.kidActs .act{min-height:44px}
/* ============ v277 · 补五张横带 ============
27 年旧案卷移交 / 28 年孩子的婚事 / 29 年最后一次夜查 走事件自带的 ev.art（内联背景）；
结案屏的「若干年后」与生活面板的家人一格走 .art 类。
⚠ 只写 background-image 的那一条才吃得到静态 [13c] 的挂载扫描，尺寸另起一条。 */
.art.aftermath{background-image:url(../assets/art_aftermath.webp)}
.art.aftermath{height:120px;background-position:center 48%}
.art.family{background-image:url(../assets/art_family.webp)}
.art.family{height:124px;background-position:center 46%}
/* ============ v278 · 码头补字与旧框图清场 ============
角标原来 right:-3 / top:-3，把 63px 的按钮撑出 3px 可滚动溢出——平时角标藏着不显，
一旦挂上警情数（接警那个"2"）dockSkin 的横向溢出就红。角标收进按钮内沿 0 位：
视觉上仍压在图标右上角，码头不再多出一条 3px 的横向滚动。 */
.leftDock .dockBadge{top:0;right:0}
/* 根因是类名撞车：`details.fold` 的展开内容用了一条 `.fold>*:not(summary){margin:0 12px}`，
而门坞的分组折叠也用了 `.fold`，组头因此被左右各推 12px，码头多出 3px 可滚动溢出。
这里只把门坞里的那 12px 收回去，不动 details 的展开内容。 */
.leftDock .dockGrp.fold>*{margin-left:0;margin-right:0}
/* ============ v280 · 跨班接续 ============
雨夜楼道（事件自带 ev.art）→ 交班桌（值班页那一格）→ 次日回执（同一户人家）。
只动这一条链的纸面与字色；不碰任何既有面板的几何。 */
.art.shiftdesk{background-image:url(../assets/art_shift_desk.webp)}
.art.shiftdesk{height:112px;background-position:center 46%}
.art.shiftreturn{background-image:url(../assets/art_shift_return.webp)}
.art.shiftreturn{height:112px;background-position:center 48%}
.shiftCard{border:1px solid rgba(120,102,72,.26);border-radius:10px;overflow:hidden;margin-bottom:12px;
background:linear-gradient(180deg,#fbf7ec,#f2e9d8);box-shadow:0 1px 0 rgba(255,255,255,.7) inset}
.shiftCard .art{margin:0;border:0;border-radius:0}
.shiftCardBody{padding:12px 14px 13px}
.shiftKicker{display:flex;align-items:center;justify-content:space-between;gap:8px;font-size:12px;color:var(--ink3);letter-spacing:0}
.shiftState{color:var(--cinnabar);font-size:12px;font-weight:700;letter-spacing:0;white-space:nowrap}
.shiftTitle{margin-top:4px;font-family:var(--hei);font-size:15px;font-weight:700;color:var(--ink)}
.shiftMeta{margin-top:4px;font-size:12px;color:var(--ink3);line-height:1.55}
.shiftQuote{margin-top:8px;padding-left:10px;border-left:3px solid var(--cinnabar);font-size:13px;line-height:1.65;color:var(--ink2)}
.shiftActions{display:flex;gap:8px;flex-wrap:wrap;margin-top:10px}
.shiftActions .btn-sm{min-height:26px}
.shiftList{display:grid;gap:10px;margin-top:10px}
.shiftRow{padding:10px 12px;border:1px solid rgba(120,102,72,.22);border-radius:8px;background:rgba(255,252,244,.58)}
.shiftRowTop{display:flex;align-items:baseline;justify-content:space-between;gap:8px}
.shiftRowTop b{font-size:13px;color:var(--ink)}
.shiftRowMeta{margin-top:4px;font-size:12px;line-height:1.55;color:var(--ink3)}
.shiftNote{margin:10px 0 12px;padding:10px 12px;border-left:3px solid var(--cinnabar);background:rgba(168,57,44,.055);
font-size:13px;line-height:1.7;color:var(--ink2)}
.shiftNote .shiftTag{display:block;margin-bottom:3px;font-size:11.5px;line-height:1.4;color:var(--cinnabar);letter-spacing:0}
@media (max-width:640px){
.art.shiftdesk,.art.shiftreturn{height:96px}
.shiftCardBody{padding:10px 12px 11px}
.shiftTitle{font-size:14px}
}
/* ============ v281 · 今日值班盘 ============
班前会决定谁在岗、留不留守；派组出门就占人占车，到点才回来。
这张盘只显示异常与在外的组，不把每个人的每一分钟摊成表。 */
.art.boardbrief{background-image:url(../assets/art_board_brief.webp)}
.art.boardbrief{height:120px;background-position:center 46%}
.art.boardhand{background-image:url(../assets/art_board_hand.webp)}
.art.boardhand{height:120px;background-position:center 46%}
.boardBar{border:1px solid rgba(120,102,72,.26);border-left:3px solid var(--police);border-radius:8px;
padding:9px 12px 10px;margin-bottom:12px;background:linear-gradient(180deg,#fbf7ec,#f3ead9);
box-shadow:0 1px 0 rgba(255,255,255,.7) inset}
.boardTop{display:flex;align-items:center;justify-content:space-between;gap:8px;flex-wrap:wrap}
.boardKick{font-family:var(--hei);font-size:13px;font-weight:700;color:var(--ink);letter-spacing:0}
.boardMeta{font-size:12px;color:var(--ink3);letter-spacing:0}
.boardUnits{display:flex;flex-wrap:wrap;gap:6px;margin-top:7px}
.boardChip{display:flex;flex-direction:column;gap:1px;min-width:104px;padding:5px 8px 6px;
border:1px solid rgba(120,102,72,.22);border-radius:6px;background:rgba(255,252,244,.56);
font-size:11.5px;color:var(--ink2);line-height:1.4}
.boardChip b{font-size:12px;color:var(--ink);font-weight:700}
.boardChip .bcWho{color:var(--ink3);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:150px}
.boardChip .bcState{color:var(--ink2)}
.boardChip.busy{border-color:rgba(168,57,44,.3);background:rgba(168,57,44,.055)}
.boardChip.busy .bcState{color:var(--cinnabar)}
.boardChip.reserve{border-color:rgba(77,107,87,.38);background:rgba(77,107,87,.06)}
.boardChip.empty{opacity:.62}
.boardActs{display:flex;gap:8px;flex-wrap:wrap;margin-top:8px}
.boardActs .btn-sm{min-height:26px}
.boardUnitList{display:grid;gap:8px;margin-top:10px}
.boardUnitRow{display:flex;align-items:flex-start;justify-content:space-between;gap:10px;
padding:8px 10px;border:1px solid rgba(120,102,72,.2);border-radius:7px;background:rgba(255,252,244,.5)}
.boardUnitRow .buName{font-size:13px;font-weight:700;color:var(--ink)}
.boardUnitRow .buWho{margin-top:2px;font-size:12px;color:var(--ink3);line-height:1.5}
.boardUnitRow .buSide{text-align:right;flex:0 0 auto}
.boardUnitRow .buState{font-size:12px;color:var(--ink2)}
.boardUnitRow .buCar{margin-top:2px;font-size:11.5px;color:var(--ink3)}
.boardUnitRow.busy .buState{color:var(--cinnabar)}
.boardUnitRow.reserve{border-color:rgba(77,107,87,.34)}
.boardCall{padding:9px 11px;border:1px solid rgba(120,102,72,.2);border-radius:7px;
background:rgba(255,252,244,.5);margin-top:8px}
.boardCall .bcTitle{font-size:13px;font-weight:700;color:var(--ink)}
.boardCall .bcMeta{margin-top:3px;font-size:12px;color:var(--ink3);line-height:1.5}
.boardCall .bcBtns{display:flex;gap:6px;flex-wrap:wrap;margin-top:7px}
.boardCall .bcBtns .btn-sm{min-height:26px}
@media (max-width:640px){
.art.boardbrief,.art.boardhand{height:96px}
.boardChip{min-width:calc(50% - 3px)}
.boardChip:nth-child(3){min-width:100%}
.boardUnitRow{flex-direction:column}
.boardUnitRow .buSide{text-align:left}
}
/* ============ v283 · 现场屏与值班盘的“时钟在走” ============ */
.liveBar{position:sticky;top:0;z-index:7;display:flex;align-items:center;flex-wrap:wrap;gap:8px;
margin:0 0 10px;padding:6px 9px;border:1px solid rgba(120,102,72,.28);
border-left:3px solid var(--cinnabar);border-radius:6px;
background:rgba(251,247,236,.97);box-shadow:0 2px 8px rgba(40,34,24,.12);
font-size:12px;color:var(--ink2)}
.liveBar[hidden]{display:none}
.liveBar b{font-size:12px;color:var(--ink);white-space:nowrap}
.liveBar .lbDot{width:7px;height:7px;flex:0 0 7px;border-radius:50%;background:var(--cinnabar);
box-shadow:0 0 0 3px rgba(168,57,44,.12)}
.liveBar .lbClock{font-family:var(--mono);font-size:11.5px;color:var(--ink3);white-space:nowrap}
.liveBar>span:not(.lbDot){white-space:nowrap}
.liveBar button{min-height:24px;padding:2px 9px;border:1px solid rgba(32,36,42,.25);
border-radius:999px;background:rgba(255,255,255,.7);color:var(--ink);
font-size:11.5px;cursor:pointer;white-space:nowrap}
.liveBar button:hover{border-color:var(--ink2)}
@media (max-width:640px){
.liveBar{border-radius:8px;padding:6px 8px}
}
/* =========================================================
v286 · 今日要目 / 压着的事
右侧五条只放今天的 T0/T1；T2/T3 与旧日志仍在点开的完整卷宗里。
这里只给窄栏补自己的节奏，不动日志数据结构，也不动全量台账。
========================================================= */
.logStream .lsSub{
font-family:var(--mono);font-size:11.5px;color:var(--ink2);letter-spacing:0;
flex:1 1 auto;min-width:0;margin:0 8px;text-align:right;
white-space:nowrap;overflow:hidden;text-overflow:ellipsis;
}
.logStream .lsEmpty{
margin-top:2px;padding:5px 0 3px 6px;border-left:2px solid rgba(120,102,72,.28);
color:var(--ink2);font-size:12px;line-height:1.65;white-space:normal;
}
.logStream .lsCarry{
margin-top:5px;padding:4px 0 3px 7px;border-left:2px solid var(--cinnabar);
color:var(--ink2);font-size:12px;line-height:1.65;white-space:normal;
display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;
}
/* 面板内容重画时浏览器会把滚动位置"锚"到新增内容上，keep 回填的 scrollTop 会被再顶走。
这里只关掉 .mBody 的滚动锚定；页面/侧栏的滚动不受影响。 */
.mBody{overflow-anchor:none}
/* =========================================================
v287 · 美术规范：150px 那一档横带全部收进 106px
`.art` 默认早已是 106（1849 行）；这一层只清掉后来为
call/umb/kin/spot/match/aff/talk 单独加的 150px。
其余 92–124px 的面板专用/窄屏变体是各自盒子量出来的，不在这刀里；
`.actReceipt .arThumb.art` 是 32px 缩略图，也不碰。
========================================================= */
.art.call,.art.umb,.art.kin,.art.spot,.art.match,.art.aff,.art.talk{height:106px}
/* ===== v287 · 字体子集自托管 · Noto Serif/Sans SC（SIL OFL，Google Fonts text= 子集）===== */
/* =========================================================
v290 · 调度可见：系统推给你的 T0/T1 在标题栏右侧挂一枚
「为什么是现在」。只挂系统自弹的弹层，玩家自己点开的面板不挂。
标题让位给理由，窄屏收起（标题优先）。
========================================================= */
.mBarT{flex:1 1 auto}
.mBarWhy{
flex:0 1 auto;min-width:0;max-width:46%;margin-left:auto;margin-right:6px;
padding:2px 8px;border:1px solid rgba(120,102,72,.28);border-radius:999px;
background:rgba(255,253,247,.72);color:var(--ink2);
font-family:var(--ui);font-size:12px;font-weight:600;letter-spacing:0;
line-height:1.5;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;
}
@media (max-width:640px){.mBarWhy{display:none}}
/* =========================================================
v296 · 身份块居中（"把这一块居中放"）
只在桌面双栏那档动：让 .hudL 吃掉左侧剩余宽度，再把
"立绘 + 姓名/职级/存款"作为一个整体居中。速度轨与日期牌
仍由 .hudC 的 margin-left:auto 留在右边，位置不动。
≤1000 的换行布局保持左对齐，避免把三块挤成一座孤岛。
========================================================= */
@media (min-width:1001px){
.hudL{flex:1 1 0%;justify-content:center}
}
/* =========================================================
v297 · HUD 身份卡的外框（"再给他做个精美的外框"）
只在 ≥1001px 出现：纸面 + 双层细线 + 四角黄铜括角。
框用 padding 向外撑、负 margin 收回去，所以卡片看起来
比内容大一圈，但第一行的高度与宽度一个像素都不动。
≤1000 只保留 .hudIdCard 的横向排列，不戴框——窄屏没有
多余的两侧留白，戴框会显得挤。
========================================================= */
.hudL{gap:0 !important}
.hudIdCard{display:flex;align-items:center;gap:10px;min-width:0}
@media (min-width:1001px){
/* 卡框的上下边靠负 margin 探出 .hudL 的盒子；这一档要让它画出来，不能裁在内部。
名字/职级/存款各自的 ellipsis 仍在子节点上，不靠这层 overflow 兜。 */
.hudL{overflow:visible}
.hudIdCard{
position:relative;padding:7px 12px;margin:-7px -12px;border-radius:4px;
background:
linear-gradient(180deg,rgba(255,255,255,.52),rgba(255,255,255,0) 34%),
linear-gradient(180deg,rgba(255,253,247,.94),rgba(246,239,225,.86)),
url(../assets/art_paper_tile.webp) left top/220px repeat;
box-shadow:
0 0 0 1px rgba(38,69,111,.36),
inset 0 0 0 1px rgba(255,255,255,.6),
inset 3px 0 0 rgba(168,57,44,.14),
0 3px 12px rgba(40,34,24,.14);
}
.hudIdCard::before{
content:"";position:absolute;inset:4px;border:1px solid rgba(120,102,72,.32);
border-radius:2px;pointer-events:none;
}
.hudIdCard::after{
content:"";position:absolute;inset:4px;pointer-events:none;opacity:.72;
background:
linear-gradient(var(--ochre),var(--ochre)) left top/12px 2px no-repeat,
linear-gradient(var(--ochre),var(--ochre)) left top/2px 12px no-repeat,
linear-gradient(var(--ochre),var(--ochre)) right top/12px 2px no-repeat,
linear-gradient(var(--ochre),var(--ochre)) right top/2px 12px no-repeat,
linear-gradient(var(--ochre),var(--ochre)) left bottom/12px 2px no-repeat,
linear-gradient(var(--ochre),var(--ochre)) left bottom/2px 12px no-repeat,
linear-gradient(var(--ochre),var(--ochre)) right bottom/12px 2px no-repeat,
linear-gradient(var(--ochre),var(--ochre)) right bottom/2px 12px no-repeat;
}
}
/* =========================================================
v300 · 网格员线锁定（"给网格员锁上 不允许选"）
卡片仍摆出来，让人知道有这条线；但立绘压灰、整张降一档，
右上角挂"未开放"，点它/回车只回一句原因，不改选择。
========================================================= */
.startScreen .lineCard.locked{
cursor:not-allowed;
background:linear-gradient(180deg,rgba(240,235,224,.92),rgba(228,221,207,.9));
border-color:rgba(232,226,210,.16);
}
.startScreen .lineCard.locked:hover{
transform:none;
box-shadow:none;
border-color:rgba(232,226,210,.16);
}
.startScreen .lineCard.locked .lineArt,
.startScreen .lineCard.locked:hover .lineArt{
filter:grayscale(.78) contrast(.9);
opacity:.5;
}
.startScreen .lineCard.locked .lcTag{background:rgba(26,30,36,.55)}
.startScreen .lineCard.locked .lineText{opacity:.72}
.startScreen .lineCard.locked .lcSeal{display:none}
.lcLock{
position:absolute;right:10px;top:10px;z-index:3;
display:flex;align-items:center;gap:4px;padding:3px 7px;
border:1px solid rgba(168,57,44,.5);border-radius:2px;
background:rgba(247,242,230,.93);color:#8a2a1f;
font-family:var(--hei);font-size:11.5px;font-weight:700;letter-spacing:1px;line-height:1.5;
}
.lcLock svg{width:12px;height:12px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round}
/* =========================================================
v301 · 开局页左下角的专属印章（"画个印章风的专属图标放角落"）
朱砂圆印 + 一枚五角星 + "城西"两字，只挂在开局页；
#screenStart 一隐藏它就跟着消失，游戏内不占画面。
固定左下，避开右下 Qoder 角标；窄屏/矮屏收起。
========================================================= */
.siteSeal{
position:fixed;left:16px;bottom:16px;z-index:4;
width:56px;height:56px;border-radius:50%;
display:flex;flex-direction:column;align-items:center;justify-content:center;gap:1px;
transform:rotate(-7deg);pointer-events:none;opacity:.88;
color:#f8ecd7;
background:
radial-gradient(circle at 32% 26%,rgba(255,255,255,.2),transparent 38%),
radial-gradient(circle at 68% 76%,rgba(90,15,8,.22),transparent 46%),
linear-gradient(145deg,#b8452f,#8b2a1f 62%,#72231b);
box-shadow:
inset 0 0 0 2px rgba(250,240,222,.55),
inset 0 0 0 5px rgba(120,30,22,.5),
0 4px 12px rgba(0,0,0,.3);
}
.siteSeal::before{
content:"";position:absolute;inset:6px;border:1px solid rgba(250,240,222,.34);
border-radius:50%;pointer-events:none;
}
.siteSeal::after{
content:"";position:absolute;inset:0;border-radius:50%;pointer-events:none;
background:
radial-gradient(circle at 18% 72%,rgba(255,255,255,.18) 0 1px,transparent 2px),
radial-gradient(circle at 76% 24%,rgba(60,10,6,.2) 0 1px,transparent 2px),
radial-gradient(circle at 64% 82%,rgba(255,255,255,.12) 0 1px,transparent 2px);
mix-blend-mode:multiply;opacity:.6;
}
.siteSeal svg{width:10px;height:10px;fill:currentColor;opacity:.95}
.siteSeal b{
font-family:"Police Serif",var(--fz),serif;font-size:18px;font-weight:700;
letter-spacing:1px;line-height:1;
}
@media (max-width:1000px),(max-height:720px){
.siteSeal{display:none}
}
/* =========================================================
v304 · 值班页「主线任务」卡
把职业主线、手上这件案子、下一格/人生三件事固定摆出来；
不再只在章节到点那天从 TODAY 里冒一条。
========================================================= */
.storyStrip{padding:9px 12px 8px;border-left:3px solid var(--police)}
.ssHead{display:flex;align-items:center;gap:8px;margin-bottom:2px}
.ssHead b{font-family:var(--disp);font-size:18px;font-weight:700;letter-spacing:1px;color:var(--ink)}
.ssHead span{font-family:var(--mono);font-size:11.5px;color:var(--ink3);white-space:nowrap}
.ssAll{margin-left:auto;min-height:24px;padding:2px 8px;border:1px solid var(--line);border-radius:2px;
background:rgba(255,255,255,.55);color:var(--ink2);font-family:var(--ui);font-size:11.5px;cursor:pointer;white-space:nowrap}
.ssAll:hover{border-color:var(--ink2);color:var(--ink)}
.ssRow{display:grid;grid-template-columns:44px minmax(0,1fr) 14px;align-items:center;gap:8px;
width:100%;text-align:left;border:0;border-top:1px dashed rgba(120,102,72,.24);
background:transparent;padding:7px 0;font-family:var(--ui);cursor:pointer}
.ssRow:hover .ssMain b{color:var(--police)}
.ssRow.hot .ssK{color:#fff9ee;background:var(--cinnabar);border-color:transparent}
.ssK{justify-self:start;padding:1px 5px;border:1px solid rgba(38,69,111,.26);border-radius:2px;
color:var(--police);font-size:11.5px;line-height:1.5;white-space:nowrap}
.ssMain{min-width:0}
.ssMain b{display:block;font-size:13px;font-weight:700;color:var(--ink);
white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.ssMain span{display:block;font-size:12px;color:var(--ink2);
white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.ssGo{text-align:right;color:var(--ink3);font-size:13px}
@media (max-width:640px){
.ssHead b{font-size:18px}
.ssRow{grid-template-columns:38px minmax(0,1fr) 12px;gap:6px}
}