/* =====================================================================
   受着瓦 · 战术指挥台 — VALORANT TACTICAL DESIGN SYSTEM
   Display: Oswald (condensed) · Tech/HUD: Chakra Petch · CJK: system
   ===================================================================== */
:root{
  --void:#0b121a;        /* deepest background */
  --void-2:#0f1923;      /* VALORANT base */
  --panel:#13202b;       /* armor panel */
  --panel-2:#18293646;
  --steel:#1b2b39;
  --line:#26404f;        /* hairline */
  --line-2:#33576a;
  --red:#ff4655;         /* VALORANT signature */
  --red-deep:#bd3944;
  --red-glow:rgba(255,70,85,.45);
  --mint:#22e0a6;        /* alive / positive */
  --mint-deep:#0f9b73;
  --gold:#f0c463;        /* titles / awards */
  --blue:#5cc8ff;        /* electric-blue / info */
  --ice:#7fd3ff;
  /* motion + elevation tokens */
  --t-fast:.16s;--t-mid:.3s;--t-slow:.6s;
  --ease:cubic-bezier(.16,1,.3,1);
  --glow-red:0 0 24px -2px var(--red-glow);
  --glow-mint:0 0 24px -2px rgba(34,224,166,.45);
  --text:#ece8e1;        /* warm off-white */
  --dim:#7b94a3;
  --faint:#465c6b;
  --cut:16px;            /* corner clip size */
  --font-d:"Oswald","PingFang SC","Microsoft YaHei",sans-serif;
  --font-t:"Chakra Petch","PingFang SC","Microsoft YaHei",sans-serif;
}
*{box-sizing:border-box}
html,body{margin:0;min-height:100vh}
body{
  background:var(--void-2);
  color:var(--text);
  font-family:var(--font-t);
  font-size:15px;line-height:1.5;
  -webkit-font-smoothing:antialiased;
  letter-spacing:.2px;
  overflow-x:hidden;
}
::selection{background:var(--red);color:#fff}
a{color:var(--mint);text-decoration:none}
button{font-family:inherit}

/* ------------ atmosphere ------------ */
.bg{position:fixed;inset:0;z-index:-1;overflow:hidden;background:
  radial-gradient(120% 80% at 50% 120%,#0c151d 0%,var(--void-2) 40%,var(--void) 100%)}
.bg-grid{position:absolute;inset:-2px;opacity:.5;
  background-image:linear-gradient(rgba(50,87,106,.10) 1px,transparent 1px),
    linear-gradient(90deg,rgba(50,87,106,.10) 1px,transparent 1px);
  background-size:46px 46px;
  mask-image:radial-gradient(120% 90% at 50% 0%,#000 30%,transparent 80%)}
.bg-glow{position:absolute;top:-260px;right:-160px;width:760px;height:760px;
  background:radial-gradient(circle,var(--red-glow),transparent 62%);filter:blur(20px);opacity:.55}
.bg-glow::after{content:"";position:absolute;left:-560px;top:420px;width:560px;height:560px;
  background:radial-gradient(circle,rgba(34,224,166,.18),transparent 65%);filter:blur(20px)}
.bg-scan{position:absolute;inset:0;pointer-events:none;opacity:.35;
  background:repeating-linear-gradient(0deg,rgba(0,0,0,0) 0 3px,rgba(0,0,0,.18) 3px 4px)}
.bg-vignette{position:absolute;inset:0;box-shadow:inset 0 0 240px 60px rgba(0,0,0,.7)}

/* full-screen tactical HUD frame (in-game overlay feel) */
.hud-frame{position:fixed;inset:7px;z-index:6;pointer-events:none}
.hud-frame .c{position:absolute;width:24px;height:24px;border:2px solid var(--red);opacity:.5}
.hud-frame .c.tl{top:0;left:0;border-right:0;border-bottom:0}
.hud-frame .c.tr{top:0;right:0;border-left:0;border-bottom:0}
.hud-frame .c.bl{bottom:0;left:0;border-right:0;border-top:0}
.hud-frame .c.br{bottom:0;right:0;border-left:0;border-top:0}

/* ------------ command bar ------------ */
.cmd{position:sticky;top:0;z-index:40;display:flex;align-items:center;gap:14px;
  padding:12px 18px;background:rgba(10,16,22,.82);backdrop-filter:blur(10px);
  border-bottom:1px solid var(--line)}
.cmd::after{content:"";position:absolute;left:0;bottom:-1px;height:1px;width:160px;background:var(--red)}
.cmd-brand{display:flex;align-items:center;gap:12px}
.cmd-mark{width:40px;height:40px;display:grid;place-items:center;font-family:var(--font-d);
  font-weight:700;font-size:22px;color:#fff;background:linear-gradient(135deg,var(--red),var(--red-deep));
  clip-path:polygon(8px 0,100% 0,100% calc(100% - 8px),calc(100% - 8px) 100%,0 100%,0 8px);
  box-shadow:0 0 22px var(--red-glow)}
.cmd-title{font-family:var(--font-d);font-weight:700;font-size:22px;line-height:1;letter-spacing:1px}
.cmd-sub{font-size:10px;letter-spacing:3px;color:var(--dim);margin-top:3px}
.cmd-right{margin-left:auto;display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.field-wrap{display:flex;align-items:center;background:var(--panel);border:1px solid var(--line);
  clip-path:polygon(8px 0,100% 0,100% calc(100% - 8px),calc(100% - 8px) 100%,0 100%,0 8px)}
.field-tag{font-size:10px;letter-spacing:2px;color:var(--red);padding:0 8px;font-weight:700}
.cmd select,.field{background:transparent;border:none;color:var(--text);font-family:var(--font-t);
  font-size:13px;font-weight:600;padding:9px 10px 9px 4px;outline:none;cursor:pointer;max-width:160px}
.cmd select option{background:var(--panel);color:var(--text)}
.lab-link{font-family:var(--font-d);font-size:11px;letter-spacing:2px;color:var(--dim);
  border:1px solid var(--line);padding:7px 10px;transition:.18s var(--ease)}
.lab-link:hover{color:#fff;border-color:var(--red);background:var(--red-deep);box-shadow:var(--glow-red)}
.status-dot{display:flex;align-items:center;gap:7px;font-size:11px;letter-spacing:2px;color:var(--mint);
  border:1px solid rgba(34,224,166,.35);padding:7px 12px;font-weight:700;
  clip-path:polygon(8px 0,100% 0,100% calc(100% - 8px),calc(100% - 8px) 100%,0 100%,0 8px)}
.status-dot i{width:7px;height:7px;border-radius:50%;background:var(--mint);box-shadow:0 0 8px var(--mint);
  animation:blink 1.6s infinite}
@keyframes blink{0%,100%{opacity:1}50%{opacity:.3}}

/* ------------ nav (tactical tabs) ------------ */
.nav{position:sticky;top:65px;z-index:30;display:flex;gap:4px;padding:10px 14px;flex-wrap:wrap;
  background:linear-gradient(180deg,rgba(11,18,26,.9),rgba(11,18,26,.55));backdrop-filter:blur(6px);
  border-bottom:1px solid var(--line)}
.tab{position:relative;display:flex;align-items:center;gap:8px;padding:9px 16px;cursor:pointer;
  font-family:var(--font-d);font-weight:600;font-size:15px;letter-spacing:1px;color:var(--dim);
  background:var(--panel);border:1px solid var(--line);
  clip-path:polygon(10px 0,100% 0,100% calc(100% - 10px),calc(100% - 10px) 100%,0 100%,0 10px);
  transition:.18s}
.tab .ix{font-family:var(--font-t);font-size:10px;color:var(--faint);font-weight:700}
.tab:hover{color:var(--text);border-color:var(--line-2)}
.tab.on{color:#fff;background:linear-gradient(135deg,var(--red),var(--red-deep));border-color:var(--red);
  box-shadow:0 6px 22px -8px var(--red-glow)}
.tab.on .ix{color:rgba(255,255,255,.8)}

/* ------------ layout ------------ */
.view{max-width:720px;margin:0 auto;padding:22px 16px 96px}
.stack>*{animation:rise .5s cubic-bezier(.16,1,.3,1) both}
.stack>*:nth-child(2){animation-delay:.05s}
.stack>*:nth-child(3){animation-delay:.10s}
.stack>*:nth-child(4){animation-delay:.15s}
.stack>*:nth-child(5){animation-delay:.20s}
.stack>*:nth-child(6){animation-delay:.25s}
.stack>*:nth-child(n+7){animation-delay:.3s}
@keyframes rise{from{opacity:0;transform:translateY(16px)}to{opacity:1;transform:none}}

/* ------------ panel (clipped armor with hairline border) ------------ */
.panel{position:relative;background:var(--line);margin-bottom:14px;
  clip-path:polygon(var(--cut) 0,100% 0,100% calc(100% - var(--cut)),calc(100% - var(--cut)) 100%,0 100%,0 var(--cut))}
.panel::before{content:"";position:absolute;inset:1px;z-index:0;
  background:linear-gradient(155deg,#16242f 0%,#0e1922 100%);
  clip-path:polygon(var(--cut) 0,100% 0,100% calc(100% - var(--cut)),calc(100% - var(--cut)) 100%,0 100%,0 var(--cut))}
.panel>*{position:relative;z-index:1}
.panel .pad{padding:18px}
/* red accent rail variant */
.panel.rail::after{content:"";position:absolute;left:1px;top:14px;bottom:14px;width:3px;z-index:2;
  background:linear-gradient(180deg,var(--red),transparent)}
/* corner ticks (top-right + bottom-left) */
.ticks::before,.ticks::after{content:"";position:absolute;width:14px;height:14px;z-index:3;pointer-events:none}
.ticks::before{top:6px;right:6px;border-top:2px solid var(--red);border-right:2px solid var(--red)}
.ticks::after{bottom:6px;left:6px;border-bottom:2px solid var(--red);border-left:2px solid var(--red)}

/* ------------ HUD section header ------------ */
.hud{display:flex;align-items:center;gap:12px;margin:30px 2px 14px}
.hud .ix{font-family:var(--font-t);font-weight:700;font-size:12px;color:var(--red);letter-spacing:1px}
.hud .ix::before{content:"[ "}.hud .ix::after{content:" ]"}
.hud h2{font-family:var(--font-d);font-weight:600;font-size:21px;letter-spacing:1px;margin:0}
.hud .rule{flex:1;height:1px;background:repeating-linear-gradient(90deg,var(--line) 0 8px,transparent 8px 12px)}

/* ------------ type helpers ------------ */
.eyebrow{font-size:11px;letter-spacing:3px;color:var(--red);font-weight:700;font-family:var(--font-t)}
.title-d{font-family:var(--font-d);font-weight:700;font-size:26px;letter-spacing:.5px;line-height:1.1}
.muted{color:var(--dim)}.faint{color:var(--faint)}
.mono{font-family:var(--font-t);font-variant-numeric:tabular-nums}
.pos{color:var(--mint)}.neg{color:var(--red)}.gold{color:var(--gold)}
.row{display:flex;align-items:center;gap:10px}.between{justify-content:space-between}.wrapf{flex-wrap:wrap}.grow{flex:1}

/* ------------ buttons ------------ */
.btn{position:relative;display:inline-flex;align-items:center;justify-content:center;gap:8px;
  font-family:var(--font-d);font-weight:600;font-size:15px;letter-spacing:1px;color:#fff;cursor:pointer;
  padding:13px 22px;border:none;background:linear-gradient(135deg,var(--red),var(--red-deep));overflow:hidden;
  clip-path:polygon(10px 0,100% 0,100% calc(100% - 10px),calc(100% - 10px) 100%,0 100%,0 10px);transition:.16s}
.btn::after{content:"";position:absolute;inset:0;background:linear-gradient(120deg,transparent 30%,rgba(255,255,255,.25) 50%,transparent 70%);
  transform:translateX(-120%);transition:.5s}
.btn:hover::after{transform:translateX(120%)}
.btn:hover{box-shadow:0 8px 26px -8px var(--red-glow)}
.btn:active{transform:translateY(1px)}
.btn.ghost{background:var(--panel);border:1px solid var(--line);color:var(--text)}
.btn.ghost:hover{border-color:var(--red);color:#fff}
.btn.mint{background:linear-gradient(135deg,var(--mint),var(--mint-deep));color:#04241a}
.btn.mint:hover{box-shadow:0 8px 26px -8px rgba(34,224,166,.5)}
.btn.sm{padding:7px 14px;font-size:13px;clip-path:polygon(7px 0,100% 0,100% calc(100% - 7px),calc(100% - 7px) 100%,0 100%,0 7px)}
.btn:disabled{opacity:.4;cursor:not-allowed}
.btn-block{display:flex;width:100%}

/* ------------ readouts (stat cells) ------------ */
.readouts{display:grid;grid-template-columns:repeat(auto-fit,minmax(110px,1fr));gap:1px;background:var(--line);
  clip-path:polygon(12px 0,100% 0,100% calc(100% - 12px),calc(100% - 12px) 100%,0 100%,0 12px)}
.readout{background:linear-gradient(160deg,#142230,#0e1a23);padding:16px 12px;text-align:center}
.readout .n{font-family:var(--font-d);font-weight:700;font-size:44px;line-height:1;letter-spacing:.5px;font-variant-numeric:tabular-nums}
.readout .l{font-size:11px;letter-spacing:1.5px;color:var(--dim);margin-top:8px;font-weight:600;text-transform:uppercase}

/* ------------ chips / tags ------------ */
.chip{display:inline-flex;align-items:center;gap:5px;font-size:12px;font-weight:600;letter-spacing:.5px;
  padding:5px 12px;margin:0 6px 6px 0;cursor:pointer;color:var(--dim);background:var(--panel);
  border:1px solid var(--line);transition:.14s;
  clip-path:polygon(6px 0,100% 0,100% calc(100% - 6px),calc(100% - 6px) 100%,0 100%,0 6px)}
.chip:hover{border-color:var(--line-2);color:var(--text)}
.chip.pos{color:var(--mint);border-color:rgba(34,224,166,.4)}
.chip.neg{color:var(--red);border-color:rgba(255,70,85,.4)}
.chip.special{color:var(--gold);border-color:rgba(240,196,99,.4)}
.chip.on{transform:translateY(-1px)}
.chip.pos.on{background:rgba(34,224,166,.16);box-shadow:0 0 0 1px var(--mint) inset}
.chip.neg.on{background:rgba(255,70,85,.16);box-shadow:0 0 0 1px var(--red) inset}
.chip.special.on{background:rgba(240,196,99,.16);box-shadow:0 0 0 1px var(--gold) inset}
.chip.pop{animation:pop .25s ease}
@keyframes pop{0%{transform:scale(.8)}60%{transform:scale(1.12)}100%{transform:scale(1)}}

/* ------------ badges ------------ */
.badge{font-size:11px;font-weight:700;letter-spacing:.5px;padding:3px 10px;
  clip-path:polygon(5px 0,100% 0,100% calc(100% - 5px),calc(100% - 5px) 100%,0 100%,0 5px)}
.badge.green{color:#04241a;background:var(--mint)}
.badge.orange{color:#2a1500;background:var(--gold)}
.badge.redb{color:#fff;background:var(--red)}
.badge.gray{color:var(--dim);background:var(--steel)}

/* ------------ member card ------------ */
.mcard{position:relative;background:var(--line);margin-bottom:10px;
  clip-path:polygon(12px 0,100% 0,100% calc(100% - 12px),calc(100% - 12px) 100%,0 100%,0 12px)}
.mcard::before{content:"";position:absolute;inset:1px;z-index:0;background:linear-gradient(155deg,#15232e,#0e1a22);
  clip-path:polygon(12px 0,100% 0,100% calc(100% - 12px),calc(100% - 12px) 100%,0 100%,0 12px)}
.mcard>*{position:relative;z-index:1}
.mcard .body{padding:14px}
.mcard .rail{position:absolute;left:1px;top:10px;bottom:10px;width:4px;z-index:2;background:var(--faint)}
.mcard.checked .rail{background:var(--mint);box-shadow:0 0 12px var(--mint)}
.mcard.disputed .rail{background:var(--gold);box-shadow:0 0 12px var(--gold)}
.mcard.missing .rail{background:var(--red);box-shadow:0 0 12px var(--red)}
.av{width:44px;height:44px;flex-shrink:0;display:grid;place-items:center;font-family:var(--font-d);font-weight:700;
  font-size:22px;color:#fff;background:linear-gradient(135deg,var(--red),var(--red-deep));
  clip-path:polygon(8px 0,100% 0,100% calc(100% - 8px),calc(100% - 8px) 100%,0 100%,0 8px)}
.kv{display:flex;justify-content:space-between;font-size:13px;padding:3px 0}.kv .k{color:var(--dim)}
.name{font-family:var(--font-d);font-weight:600;font-size:18px;letter-spacing:.5px}

/* ------------ list / leaderboard rows ------------ */
.lrow{display:flex;align-items:center;gap:12px;padding:11px 14px;margin-bottom:7px;background:var(--panel);
  border:1px solid var(--line);
  clip-path:polygon(8px 0,100% 0,100% calc(100% - 8px),calc(100% - 8px) 100%,0 100%,0 8px)}
.rank{width:30px;height:30px;flex-shrink:0;display:grid;place-items:center;font-family:var(--font-d);
  font-weight:700;font-size:15px;color:var(--dim);background:var(--steel);
  clip-path:polygon(7px 0,100% 0,100% calc(100% - 7px),calc(100% - 7px) 100%,0 100%,0 7px)}
.rank.r1{background:linear-gradient(135deg,var(--gold),#c79a3a);color:#2a1d00}
.rank.r2{background:linear-gradient(135deg,#cdd6dc,#94a4b0);color:#15222b}
.rank.r3{background:linear-gradient(135deg,#d98c52,#a85f31);color:#22100a}
.lval{font-family:var(--font-d);font-weight:700;font-size:20px;color:var(--mint);font-variant-numeric:tabular-nums}

/* ------------ task ------------ */
.task{display:flex;align-items:center;gap:11px;padding:11px 14px;margin-bottom:7px;font-size:14px;
  background:var(--panel);border:1px solid var(--line);
  clip-path:polygon(7px 0,100% 0,100% calc(100% - 7px),calc(100% - 7px) 100%,0 100%,0 7px)}
.task .box{width:20px;height:20px;flex-shrink:0;display:grid;place-items:center;border:1.5px solid var(--faint);font-size:13px}
.task.done{border-color:rgba(34,224,166,.4)}
.task.done .box{border-color:var(--mint);color:var(--mint);background:rgba(34,224,166,.1)}

/* ------------ deploy (check-in hero — LOCK-ON RETICLE) ------------ */
.deploy-wrap{display:flex;flex-direction:column;align-items:center;padding:8px 0 6px}
:root{--oct:polygon(22px 0,calc(100% - 22px) 0,100% 22px,100% calc(100% - 22px),calc(100% - 22px) 100%,22px 100%,0 calc(100% - 22px),0 22px)}
.deploy{position:relative;width:300px;height:300px;cursor:pointer;display:grid;place-items:center;margin:6px 0}
/* rotating SVG reticle */
.deploy .reticle{position:absolute;inset:0;width:100%;height:100%;overflow:visible}
.deploy .reticle circle,.deploy .reticle line{fill:none;stroke:var(--red);transform-origin:150px 150px}
.deploy .reticle .r-out{stroke-width:1.5;stroke-dasharray:2 12;opacity:.65;animation:spin 22s linear infinite}
.deploy .reticle .r-mid{stroke-width:2.5;stroke-dasharray:40 26;opacity:.45;animation:spin 30s linear infinite reverse}
.deploy .reticle .r-tickg{transform-origin:150px 150px;animation:spin 60s linear infinite}
.deploy .reticle .r-tick{stroke-width:2;opacity:.8}
@keyframes spin{to{transform:rotate(360deg)}}
/* pulse halo */
.deploy::before{content:"";position:absolute;z-index:1;width:66%;height:66%;clip-path:var(--oct);
  border:1px solid var(--red);opacity:.5;animation:halo 2.8s ease-out infinite}
@keyframes halo{0%{transform:scale(.95);opacity:.55}70%{opacity:0}100%{transform:scale(1.16);opacity:0}}
/* octagon armor core */
.deploy .core{position:relative;z-index:2;width:64%;height:64%;display:flex;flex-direction:column;
  align-items:center;justify-content:center;clip-path:var(--oct);transition:.3s;
  background:radial-gradient(120% 120% at 35% 25%,#ff6b78,var(--red) 55%,#9c2a36 100%);
  box-shadow:0 0 64px var(--red-glow),inset 0 -8px 26px rgba(0,0,0,.4)}
.deploy .big{font-family:var(--font-d);font-weight:700;font-size:42px;letter-spacing:2px;line-height:1;
  color:#fff;text-shadow:0 2px 14px rgba(0,0,0,.4)}
.deploy .small{font-family:var(--font-t);font-weight:600;font-size:10px;letter-spacing:2.5px;margin-top:9px;color:rgba(255,255,255,.92)}
/* framing corner brackets */
.deploy .br{position:absolute;z-index:3;width:30px;height:30px;border:2px solid var(--red);opacity:.85;animation:bpulse 2.8s ease-in-out infinite}
.deploy .br.tl{top:2px;left:2px;border-right:0;border-bottom:0}
.deploy .br.tr{top:2px;right:2px;border-left:0;border-bottom:0;--bx:5px;--by:-5px}
.deploy .br.bl{bottom:2px;left:2px;border-right:0;border-top:0;--bx:-5px;--by:5px}
.deploy .br.br2{bottom:2px;right:2px;border-left:0;border-top:0;--bx:5px;--by:5px}
@keyframes bpulse{0%,100%{transform:translate(0,0);opacity:.7}50%{transform:translate(var(--bx,-5px),var(--by,-5px));opacity:1}}
/* sweep */
.deploy .sweep{position:absolute;z-index:2;width:64%;height:64%;clip-path:var(--oct);overflow:hidden;opacity:0}
.deploy.scanning .sweep{opacity:1}
.deploy .sweep::before{content:"";position:absolute;left:0;right:0;height:45%;
  background:linear-gradient(180deg,transparent,rgba(255,255,255,.6),transparent);animation:sweep .9s linear infinite}
@keyframes sweep{0%{top:-45%}100%{top:100%}}
.deploy.scanning .reticle .r-out{animation-duration:3s}.deploy.scanning .reticle .r-mid{animation-duration:4s}
/* hover & done states */
.deploy:hover .core{transform:scale(1.03)}
.deploy.done .core{background:radial-gradient(120% 120% at 35% 25%,#45f7b6,var(--mint) 55%,#0a7a59 100%);
  box-shadow:0 0 64px rgba(34,224,166,.5),inset 0 -8px 26px rgba(0,0,0,.32)}
.deploy.done .big{color:#04241a}.deploy.done .small{color:rgba(4,36,26,.85)}
.deploy.done .reticle circle,.deploy.done .reticle line{stroke:var(--mint)}
.deploy.done .br{border-color:var(--mint)}
.deploy.done::before{border-color:var(--mint)}

/* ------------ mode picker ------------ */
.modes{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;width:100%;margin-top:14px}
.mode{position:relative;padding:16px 8px;text-align:center;cursor:pointer;background:var(--panel);
  border:1px solid var(--line);transition:.16s;
  clip-path:polygon(10px 0,100% 0,100% calc(100% - 10px),calc(100% - 10px) 100%,0 100%,0 10px)}
.mode:hover{border-color:var(--red);transform:translateY(-2px);box-shadow:0 8px 22px -10px var(--red-glow)}
.mode .e{font-size:28px}
.mode .t{font-family:var(--font-d);font-weight:600;font-size:16px;margin-top:4px;letter-spacing:.5px}
.mode .d{font-size:11px;color:var(--dim);margin-top:2px;font-variant-numeric:tabular-nums}

/* ------------ checkboxes / inputs ------------ */
input[type=text],input:not([type]),select.field,textarea,.field{background:var(--void);border:1px solid var(--line);
  color:var(--text);font-family:var(--font-t);font-size:14px;padding:11px 12px;width:100%;outline:none;
  clip-path:polygon(8px 0,100% 0,100% calc(100% - 8px),calc(100% - 8px) 100%,0 100%,0 8px)}
input:focus,textarea:focus,select.field:focus{border-color:var(--red)}
select.field{cursor:pointer}
label.ck{display:inline-flex;align-items:center;gap:7px;margin:0 10px 9px 0;font-size:14px;cursor:pointer}
label.ck input{width:16px;height:16px;accent-color:var(--red)}

/* ------------ award grid (weekly bests) ------------ */
.awards{display:grid;grid-template-columns:repeat(2,1fr);gap:10px}
.award{position:relative;padding:16px;background:var(--line);
  clip-path:polygon(12px 0,100% 0,100% calc(100% - 12px),calc(100% - 12px) 100%,0 100%,0 12px)}
.award::before{content:"";position:absolute;inset:1px;z-index:0;background:linear-gradient(155deg,#15232e,#0e1a22);
  clip-path:polygon(12px 0,100% 0,100% calc(100% - 12px),calc(100% - 12px) 100%,0 100%,0 12px)}
.award>*{position:relative;z-index:1}
.award .ae{font-size:24px}
.award .al{font-size:11px;letter-spacing:1px;color:var(--dim);margin-top:4px}
.award .an{font-family:var(--font-d);font-weight:600;font-size:19px;letter-spacing:.5px}

/* ------------ poster ------------ */
.poster{position:relative;overflow:hidden;background:linear-gradient(180deg,#162635,#0c1620);border:1px solid var(--line);
  padding:26px 22px;margin-bottom:12px;
  clip-path:polygon(20px 0,100% 0,100% calc(100% - 20px),calc(100% - 20px) 100%,0 100%,0 20px)}
.poster .pglow{position:absolute;top:-70px;right:-50px;width:240px;height:240px;
  background:radial-gradient(circle,var(--red-glow),transparent 70%)}
.poster .ph{text-align:center;position:relative}
.poster h3{font-family:var(--font-d);font-weight:700;font-size:32px;letter-spacing:1px;margin:4px 0 2px;color:#fff}
.prow{display:flex;justify-content:space-between;align-items:center;padding:11px 14px;margin-bottom:7px;
  background:rgba(255,255,255,.03);border:1px solid var(--line);
  clip-path:polygon(8px 0,100% 0,100% calc(100% - 8px),calc(100% - 8px) 100%,0 100%,0 8px)}
.prow.hot{background:linear-gradient(90deg,rgba(255,70,85,.2),rgba(255,70,85,.02));border-color:rgba(255,70,85,.5)}
.prow .pk{font-size:13px;color:var(--dim)}
.prow .pv{font-family:var(--font-d);font-weight:600;font-size:18px}
.prow.hot .pv{color:var(--gold)}

/* ------------ misc ------------ */
.empty{text-align:center;color:var(--faint);padding:36px 16px;font-size:14px;letter-spacing:1px}
.note{font-size:12px;color:var(--faint);line-height:1.6;letter-spacing:.3px;margin:4px 2px}
.minirow{display:flex;gap:10px;margin-top:10px}
.minicard{flex:1;background:var(--panel);border:1px solid var(--line);padding:11px 13px;
  clip-path:polygon(8px 0,100% 0,100% calc(100% - 8px),calc(100% - 8px) 100%,0 100%,0 8px)}
.minicard .l{font-size:10px;letter-spacing:1.5px;color:var(--dim)}
.minicard .v{font-family:var(--font-d);font-weight:600;font-size:17px;margin-top:2px}

/* ------------ toast ------------ */
#toast{position:fixed;left:50%;bottom:30px;transform:translateX(-50%) translateY(20px);z-index:99;
  max-width:84%;padding:13px 20px 13px 16px;background:rgba(10,16,22,.96);border:1px solid var(--line);
  color:var(--text);font-size:14px;font-weight:600;opacity:0;pointer-events:none;transition:.25s cubic-bezier(.16,1,.3,1);
  clip-path:polygon(10px 0,100% 0,100% calc(100% - 10px),calc(100% - 10px) 100%,0 100%,0 10px)}
#toast::before{content:"";position:absolute;left:0;top:8px;bottom:8px;width:3px;background:var(--red)}
#toast.show{opacity:1;transform:translateX(-50%) translateY(0)}
#toast.ok::before{background:var(--mint)}

/* skeleton */
.skel{background:linear-gradient(90deg,#13202b 25%,#1b2c39 50%,#13202b 75%);background-size:200% 100%;
  animation:shimmer 1.2s infinite;height:80px;margin-bottom:12px;
  clip-path:polygon(12px 0,100% 0,100% calc(100% - 12px),calc(100% - 12px) 100%,0 100%,0 12px)}
@keyframes shimmer{to{background-position:-200% 0}}

@media(max-width:540px){
  .cmd{flex-wrap:wrap}.cmd-right{width:100%;justify-content:flex-start}
  .nav{top:auto;position:static}
  .modes{grid-template-columns:repeat(2,1fr)}
  .deploy{width:278px;height:278px}.deploy .big{font-size:42px}
  .readout .n{font-size:38px}
  #killfeed{top:auto;bottom:18px;right:10px}
}

/* =====================================================================
   FRONT.MD OVERHAUL — components, fx, animations
   ===================================================================== */

/* ---- radar background sweep ---- */
.bg-radar{position:absolute;top:-40%;left:50%;width:1100px;height:1100px;transform:translateX(-50%);border-radius:50%;
  background:conic-gradient(from 0deg,transparent 0deg,rgba(34,224,166,.09) 18deg,rgba(34,224,166,.02) 34deg,transparent 46deg);
  mask-image:radial-gradient(circle,#000 0,#000 42%,transparent 72%);
  -webkit-mask-image:radial-gradient(circle,#000 0,#000 42%,transparent 72%);
  opacity:.55;animation:radar 9s linear infinite}
@keyframes radar{to{transform:translateX(-50%) rotate(360deg)}}

/* ---- nav transition + HUD boot ---- */
.view.nv{animation:navwipe .3s var(--ease)}
@keyframes navwipe{from{opacity:.35;transform:translateY(8px)}to{opacity:1;transform:none}}
body.boot .cmd{animation:bootline .5s var(--ease) both}
body.boot .nav{animation:navwipe .5s .12s var(--ease) both}
@keyframes bootline{from{opacity:0;transform:translateY(-12px)}to{opacity:1;transform:none}}

/* ---- KillfeedToast ---- */
#killfeed{position:fixed;top:74px;right:14px;z-index:95;display:flex;flex-direction:column;gap:7px;align-items:flex-end;pointer-events:none;max-width:90vw}
.kf{display:flex;align-items:center;gap:9px;padding:9px 14px;background:rgba(9,14,20,.95);border:1px solid var(--line);
  font-size:13px;font-weight:600;color:var(--text);box-shadow:-3px 0 0 var(--dim);
  clip-path:polygon(9px 0,100% 0,100% calc(100% - 9px),calc(100% - 9px) 100%,0 100%,0 9px);
  animation:kfin .3s var(--ease) both}
.kf.ok{box-shadow:-3px 0 0 var(--mint)}.kf.warn{box-shadow:-3px 0 0 var(--gold)}.kf.bad{box-shadow:-3px 0 0 var(--red)}
.kf .kf-ic{font-size:16px;line-height:1}
.kf .kf-d{font-family:var(--font-d);font-weight:700;font-size:17px;margin-left:2px}
.kf.out{animation:kfout .3s ease forwards}
@keyframes kfin{from{opacity:0;transform:translateX(46px)}to{opacity:1;transform:none}}
@keyframes kfout{to{opacity:0;transform:translateX(46px)}}

/* ---- fx layer: floating score, flash, screen shake ---- */
#fx{position:fixed;inset:0;z-index:90;pointer-events:none;overflow:hidden}
.float-score{position:absolute;font-family:var(--font-d);font-weight:700;font-size:44px;margin-left:-32px;
  text-shadow:0 2px 12px rgba(0,0,0,.55);animation:floatup 1.2s ease-out forwards}
.float-score.pos{color:var(--mint)}.float-score.neg{color:var(--red)}
@keyframes floatup{0%{opacity:0;transform:translateY(8px) scale(.6)}18%{opacity:1}100%{opacity:0;transform:translateY(-96px) scale(1.12)}}
.flash{position:fixed;inset:0;z-index:88;pointer-events:none;opacity:0;background:radial-gradient(circle at 50% 40%,var(--red-glow),transparent 60%)}
.flash.mint{background:radial-gradient(circle at 50% 40%,rgba(34,224,166,.5),transparent 60%)}
.flash.go{animation:flashfx .55s ease-out}
@keyframes flashfx{0%{opacity:0}14%{opacity:1}100%{opacity:0}}
.view.shake{animation:shake .42s cubic-bezier(.36,.07,.19,.97)}
@keyframes shake{10%,90%{transform:translateX(-2px)}20%,80%{transform:translateX(3px)}30%,50%,70%{transform:translateX(-5px)}40%,60%{transform:translateX(5px)}}

/* ---- ReputationBar ---- */
.repbar{display:inline-flex;gap:3px;align-items:center;vertical-align:middle}
.repseg{width:13px;height:9px;background:var(--steel);clip-path:polygon(3px 0,100% 0,100% 100%,0 100%)}
.repbar .repseg.on{background:var(--mint);box-shadow:0 0 5px rgba(34,224,166,.5)}
.repbar.mid .repseg.on{background:var(--gold);box-shadow:0 0 5px rgba(240,196,99,.5)}
.repbar.low .repseg.on{background:var(--red);box-shadow:0 0 5px var(--red-glow)}
.rep-warn{font-size:9px;color:var(--red);font-weight:700;letter-spacing:1px;margin-left:5px;font-family:var(--font-t)}

/* ---- ReportCaseCard ---- */
.case{position:relative;background:var(--line);margin-bottom:12px;
  clip-path:polygon(14px 0,100% 0,100% calc(100% - 14px),calc(100% - 14px) 100%,0 100%,0 14px)}
.case::before{content:"";position:absolute;inset:1px;z-index:0;background:linear-gradient(155deg,#16242f,#0d1722);clip-path:inherit;
  background-image:linear-gradient(155deg,#16242f,#0d1722),repeating-linear-gradient(45deg,rgba(255,70,85,.04) 0 6px,transparent 6px 12px)}
.case>*{position:relative;z-index:1}.case .cbody{padding:16px}
.case.closed{animation:caseflash .7s ease}
@keyframes caseflash{0%,100%{box-shadow:none}30%{box-shadow:0 0 34px -4px var(--red-glow)}}
.cfile{font-family:var(--font-t);font-size:10px;letter-spacing:2px;color:var(--faint)}
.charge{display:flex;gap:5px;margin:12px 0 6px}
.charge .seg{flex:1;height:9px;background:var(--steel);position:relative;overflow:hidden;
  clip-path:polygon(4px 0,100% 0,100% 100%,0 100%);transition:background var(--t-mid)}
.charge .seg.on{background:var(--gold)}
.charge .seg.full{background:var(--red);box-shadow:0 0 8px var(--red-glow)}
.charge-label{font-family:var(--font-d);font-weight:700;font-size:13px;color:var(--dim)}
.stamp{font-family:var(--font-d);font-weight:700;color:var(--red);border:2px solid var(--red);padding:1px 9px;letter-spacing:2px;
  transform:rotate(-5deg);display:inline-block;clip-path:polygon(6px 0,100% 0,100% calc(100% - 6px),calc(100% - 6px) 100%,0 100%,0 6px)}

/* ---- AgentMemberCard states ---- */
.mcard[data-uid]{position:relative}
.mcard.missing .body{opacity:.62}
.mcard.missing .name{animation:glitch 5s steps(1) infinite}
@keyframes glitch{0%,96%,100%{text-shadow:none;transform:translateX(0)}96.5%{text-shadow:-2px 0 var(--red),2px 0 var(--blue)}98%{text-shadow:2px 0 var(--red),-2px 0 var(--blue);transform:translateX(1px)}99%{text-shadow:none}}
.mcard.disputed{animation:warnpulse 2.2s ease-in-out infinite}
@keyframes warnpulse{0%,100%{box-shadow:none}50%{box-shadow:0 0 0 1px rgba(240,196,99,.45),0 0 20px -4px rgba(240,196,99,.4)}}
.mcard.revoked .body{opacity:.7}
.mcard.revoked .rail{background:var(--red)!important;box-shadow:0 0 12px var(--red)!important}
/* champion glow (leaderboard #1) */
.lrow.champion{border-color:rgba(240,196,99,.55);box-shadow:0 0 0 1px rgba(240,196,99,.25),0 0 26px -8px rgba(240,196,99,.5)}
.lrow.champion .rank{box-shadow:0 0 16px rgba(240,196,99,.5)}
.lrow.champion .lval{color:var(--gold)}
/* radar ping (summon) */
.ping-fx{position:absolute;inset:0;z-index:5;pointer-events:none}
.ping-fx::before,.ping-fx::after{content:"";position:absolute;top:32px;left:34px;width:18px;height:18px;border:2px solid var(--mint);border-radius:50%;
  transform:translate(-50%,-50%);animation:ping 1.1s ease-out 2}
.ping-fx::after{animation-delay:.4s}
@keyframes ping{0%{transform:translate(-50%,-50%) scale(.3);opacity:1}100%{transform:translate(-50%,-50%) scale(4.5);opacity:0}}

/* ---- ValorTag tooltip ---- */
.chip[data-tip]:hover::after{content:attr(data-tip);position:absolute;bottom:128%;left:50%;transform:translateX(-50%);white-space:nowrap;z-index:30;
  background:var(--void);border:1px solid var(--line);color:var(--text);font-size:11px;font-weight:600;padding:5px 9px;pointer-events:none;
  clip-path:polygon(5px 0,100% 0,100% calc(100% - 5px),calc(100% - 5px) 100%,0 100%,0 5px)}

/* ---- CyberButton states ---- */
.btn.loading{pointer-events:none;color:transparent!important}
.btn.loading::before{content:"";position:absolute;top:50%;left:50%;width:16px;height:16px;margin:-8px 0 0 -8px;
  border:2px solid rgba(255,255,255,.35);border-top-color:#fff;border-radius:50%;animation:spin .7s linear infinite}

/* ---- sticker badge wall (titles) ---- */
.sticker{display:inline-flex;align-items:center;gap:6px;padding:8px 14px;margin:0 8px 8px 0;font-family:var(--font-d);font-weight:600;letter-spacing:.5px;
  background:linear-gradient(135deg,rgba(240,196,99,.18),rgba(240,196,99,.04));border:1px solid rgba(240,196,99,.45);color:var(--gold);
  clip-path:polygon(8px 0,100% 0,100% calc(100% - 8px),calc(100% - 8px) 100%,0 100%,0 8px)}

/* ---- empty state ---- */
.empty .ico{display:block;font-size:34px;margin-bottom:8px;opacity:.45}

/* ---- poster scanline reveal ---- */
.poster.reveal::after{content:"";position:absolute;left:0;right:0;top:0;height:3px;z-index:4;background:var(--mint);box-shadow:0 0 16px var(--mint);
  animation:posterscan .9s ease-out forwards}
@keyframes posterscan{0%{top:0;opacity:1}100%{top:100%;opacity:0}}

/* =====================================================================
   HERO (home focal point) + tracers + spotlight + tag-fire
   ===================================================================== */
.hero{position:relative;text-align:center;padding:10px 0 4px;cursor:crosshair}
.hero .mode,.hero .btn,.hero .deploy{cursor:crosshair}
.hero-amb{position:absolute;inset:-10px 0 30px;z-index:0;overflow:hidden;pointer-events:none}
.hero>*{position:relative;z-index:1}
.hero-greet{margin-bottom:2px}
.hero-line{font-family:var(--font-d);font-weight:700;font-size:40px;line-height:1.04;margin:7px 0 3px;letter-spacing:1px}
.hero-line em{font-style:normal}
.hero.not-deployed .hero-line em{color:var(--red);animation:breathe 2.4s ease-in-out infinite}
.hero.deployed .hero-line em{color:var(--mint)}
.hero-sub{color:var(--dim);font-size:13px;letter-spacing:2px}
@keyframes breathe{0%,100%{opacity:1;text-shadow:none}50%{opacity:.72;text-shadow:0 0 20px var(--red-glow)}}
.hero-score{margin-top:5px;font-family:var(--font-d);font-weight:700;font-size:20px;color:var(--mint)}
.hero-hint{margin-top:12px;color:var(--red);font-family:var(--font-t);font-weight:700;font-size:12px;letter-spacing:4px;animation:bob 1.7s ease-in-out infinite}
@keyframes bob{0%,100%{transform:translateY(0);opacity:.65}50%{transform:translateY(6px);opacity:1}}
.streak-flame{display:inline-flex;align-items:center;gap:6px;margin-top:9px;padding:5px 14px;font-family:var(--font-d);font-weight:700;
  color:var(--gold);border:1px solid rgba(240,196,99,.45);background:rgba(240,196,99,.08);
  clip-path:polygon(8px 0,100% 0,100% calc(100% - 8px),calc(100% - 8px) 100%,0 100%,0 8px)}
.streak-flame .fl{display:inline-block;animation:flicker .9s ease-in-out infinite}
@keyframes flicker{0%,100%{transform:scale(1) rotate(-3deg)}50%{transform:scale(1.18) rotate(4deg)}}
/* the core breathes to invite a tap when not deployed */
.hero.not-deployed .deploy .core{animation:invite 2.6s ease-in-out infinite}
@keyframes invite{0%,100%{transform:scale(1)}50%{transform:scale(1.045)}}

/* ambient bullet tracers */
.tracer{position:absolute;height:2px;width:90px;border-radius:2px;pointer-events:none;opacity:0;
  background:linear-gradient(90deg,transparent,var(--red) 65%,#fff);filter:drop-shadow(0 0 4px var(--red-glow))}
.tracer.go{animation:tracerfly var(--td,1s) linear forwards}
@keyframes tracerfly{0%{opacity:0;transform:translateX(0)}12%{opacity:.85}100%{opacity:0;transform:translate(var(--tdx,300px),var(--tdy,0))}}
/* radial muzzle spark burst (check-in) */
.spark{position:absolute;width:54px;height:2px;border-radius:2px;transform-origin:left center;pointer-events:none;
  background:linear-gradient(90deg,#fff,var(--red),transparent);animation:spark .6s ease-out forwards}
@keyframes spark{0%{opacity:1;transform:rotate(var(--a)) translateX(8px)}100%{opacity:0;transform:rotate(var(--a)) translateX(var(--d,180px))}}

/* tag chip "fire" on submit */
.chip.fired{animation:fired .34s ease-in forwards}
@keyframes fired{to{transform:translateY(-34px) scale(.55);opacity:0}}

/* ---- Spotlight (page focal feature, e.g. weekly king) ---- */
.spotlight{position:relative;overflow:hidden;display:flex;align-items:center;gap:18px;margin-bottom:16px;padding:18px 20px;
  background:linear-gradient(120deg,color-mix(in srgb,var(--ac,#f0c463) 16%,#11202b),#0d1822 65%);
  border:1px solid color-mix(in srgb,var(--ac,#f0c463) 40%,var(--line));border-left:4px solid var(--ac,#f0c463);
  box-shadow:inset 0 0 50px -16px var(--ac,#f0c463);
  clip-path:polygon(18px 0,100% 0,100% calc(100% - 18px),calc(100% - 18px) 100%,0 100%,0 18px)}
.spotlight .sp-glow{position:absolute;top:-60px;right:-30px;width:220px;height:220px;background:radial-gradient(circle,color-mix(in srgb,var(--ac,#f0c463) 42%,transparent),transparent 70%)}
.spotlight .sp-hex{position:absolute;right:-6px;bottom:-12px;width:160px;height:110px;opacity:.16;color:var(--ac,#f0c463)}
.spotlight .sp-port{position:relative;flex:none;filter:drop-shadow(0 6px 16px rgba(0,0,0,.5))}
.spotlight .sp-info{position:relative;z-index:1}
.spotlight .sp-badge{margin-bottom:5px}
.spotlight .sp-name{font-family:var(--font-d);font-weight:700;font-size:34px;line-height:1;color:#fff}
.spotlight .sp-score{font-family:var(--font-d);font-weight:700;font-size:18px;color:var(--ac,#f0c463);margin-top:5px}
.spotlight .sp-score span{font-size:12px;color:var(--dim);margin-left:4px}
.spotlight .sp-call{font-size:12px;margin-top:4px}

/* ---- shared component classes (replace inline styles) ---- */
.lname{font-family:var(--font-d);font-weight:600;font-size:16px;letter-spacing:.3px}
.tiny{font-size:12px}.t-mono{font-family:var(--font-t);font-size:12px;color:var(--dim)}

/* ---- review rules list + per-target picked counter ---- */
.rules{margin:10px 0 0;padding:0;list-style:none}
.rules li{position:relative;padding:5px 0 5px 18px;font-size:13px;color:var(--dim);line-height:1.5}
.rules li::before{content:"›";position:absolute;left:2px;color:var(--red);font-weight:700}
.rules li b{color:var(--text)}.rules li b.pos{color:var(--mint)}
.picked{font-size:12px;font-weight:700;color:var(--dim);background:var(--steel);padding:3px 9px;
  clip-path:polygon(5px 0,100% 0,100% calc(100% - 5px),calc(100% - 5px) 100%,0 100%,0 5px)}

/* =====================================================================
   VISUAL ASSET SYSTEM — icons / portraits / badges / motifs / tiles
   ===================================================================== */
.ic{width:1.05em;height:1.05em;vertical-align:-.16em;flex:none}
.portrait{display:block}

/* agent mini-avatar (member cards / chips) */
.agent-av{width:46px;height:52px;flex:none;display:block}
.agent-call{font-family:var(--font-t);font-size:10px;letter-spacing:1.5px;font-weight:700;opacity:.85}

/* badge stickers */
.bsticker{display:inline-flex;align-items:center;gap:5px;font-family:var(--font-d);font-weight:600;font-size:11px;letter-spacing:1px;
  padding:4px 10px;color:#0b121a;
  clip-path:polygon(6px 0,100% 0,100% calc(100% - 6px),calc(100% - 6px) 100%,0 100%,0 6px)}
.bsticker .ic{width:13px;height:13px}
.b-mint{background:var(--mint)}.b-gold{background:var(--gold)}.b-red{background:var(--red);color:#fff}
.b-orange{background:var(--orange)}.b-blue{background:var(--blue)}.b-gray{background:var(--dim);color:#0b121a}

/* seal stamp */
.seal{position:relative;display:inline-grid;place-items:center;width:64px;height:64px;color:var(--red);transform:rotate(-8deg)}
.seal svg{position:absolute;inset:0;width:100%;height:100%}
.seal b{font-family:var(--font-d);font-weight:700;font-size:13px;letter-spacing:1px;text-align:center;line-height:1;padding:0 6px}
.seal.mint{color:var(--mint)}.seal.gold{color:var(--gold)}

/* motifs */
.m-sonar{position:absolute;width:100%;height:100%;fill:none;stroke:var(--red);stroke-width:1;opacity:.25}
.m-sonar circle{transform-origin:center;animation:sonar 3s ease-out infinite}
.m-sonar circle:nth-child(2){animation-delay:1s}.m-sonar circle:nth-child(3){animation-delay:2s}
@keyframes sonar{0%{opacity:.5;transform:scale(.6)}100%{opacity:0;transform:scale(1.05)}}
.m-scan{stroke:var(--red);stroke-width:2.5;fill:none;opacity:.5}
.m-hex{stroke:var(--line-2);stroke-width:1;fill:none;opacity:.4}
.m-warn{width:1.1em;height:1.1em;vertical-align:-.18em;color:var(--gold)}
.microtext{font-family:var(--font-t);font-size:9px;letter-spacing:2px;color:var(--faint);white-space:nowrap;overflow:hidden;text-overflow:clip;opacity:.6}
/* energy shards around the deploy core */
.shard{position:absolute;width:14px;height:14px;background:var(--red);opacity:.55;pointer-events:none;
  clip-path:polygon(50% 0,100% 50%,50% 100%,0 50%);animation:shardfloat 4s ease-in-out infinite}
.hero.deployed .shard{background:var(--mint)}
.shard.a{top:8%;left:14%;animation-delay:0s}.shard.b{top:18%;right:12%;width:9px;height:9px;animation-delay:.8s}
.shard.c{bottom:30%;left:8%;width:10px;height:10px;animation-delay:1.6s}.shard.d{bottom:14%;right:16%;width:8px;height:8px;animation-delay:2.4s}
@keyframes shardfloat{0%,100%{transform:translateY(0) rotate(0);opacity:.3}50%{transform:translateY(-10px) rotate(45deg);opacity:.7}}

/* hero operator silhouette background */
.hero-operator{position:absolute;left:50%;top:-6px;transform:translateX(-50%);width:300px;opacity:.07;z-index:0;pointer-events:none}
.hero-operator .portrait{width:300px;height:auto}

/* AwardTile */
.awards-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:10px}
.atile{position:relative;display:flex;flex-direction:column;gap:3px;padding:14px;background:linear-gradient(150deg,#16242f,#0e1922);
  border:1px solid var(--line);border-left:3px solid var(--ac);
  clip-path:polygon(11px 0,100% 0,100% calc(100% - 11px),calc(100% - 11px) 100%,0 100%,0 11px)}
.atile .at-ic{color:var(--ac)}.atile .at-ic .ic{width:22px;height:22px}
.atile .at-l{font-size:11px;letter-spacing:1px;color:var(--dim)}
.atile .at-n{font-family:var(--font-d);font-weight:700;font-size:20px;letter-spacing:.5px}

/* SquadChip */
.sqchip{display:inline-flex;align-items:center;gap:8px;padding:6px 14px 6px 6px;margin:0 8px 8px 0;cursor:pointer;
  background:var(--panel);border:1px solid var(--line);font-weight:600;font-size:14px;transition:.15s;
  clip-path:polygon(8px 0,100% 0,100% calc(100% - 8px),calc(100% - 8px) 100%,0 100%,0 8px)}
.sqchip .sq-av{width:26px;height:30px;display:grid;place-items:center;overflow:hidden}
.sqchip .sq-av .portrait{width:26px;height:30px}
.sqchip.on{border-color:var(--ac);box-shadow:0 0 0 1px var(--ac) inset,0 6px 18px -10px var(--ac)}
.sqchip:hover{border-color:var(--ac)}

/* IdentityPlate */
.idplate{position:relative;overflow:hidden;display:flex;align-items:center;gap:16px;padding:20px;margin-bottom:14px;
  background:linear-gradient(120deg,color-mix(in srgb,var(--ac) 14%,#11202b),#0d1822 70%);border:1px solid var(--line);border-left:4px solid var(--ac);
  clip-path:polygon(16px 0,100% 0,100% calc(100% - 16px),calc(100% - 16px) 100%,0 100%,0 16px)}
.idplate .idhex{position:absolute;right:-10px;top:-10px;width:170px;height:120px;opacity:.18}
.idplate .idscan{position:absolute;right:10px;bottom:10px;width:40px;height:40px;opacity:.4}
.idplate .id-port{flex:none;filter:drop-shadow(0 6px 16px rgba(0,0,0,.5))}
.idplate .id-info{position:relative;z-index:1}
.id-call{font-family:var(--font-t);font-weight:700;font-size:12px;letter-spacing:2px;color:var(--ac)}
.id-cn{color:var(--dim)}
.id-name{font-family:var(--font-d);font-weight:700;font-size:30px;line-height:1.05;margin:2px 0}
.id-vibe{font-size:12px;color:var(--dim)}
.id-tag{position:absolute;right:16px;top:16px;font-family:var(--font-t);font-size:10px;letter-spacing:2px;color:var(--faint)}

/* Empty-state illustration */
.empty-il{text-align:center;padding:34px 16px;color:var(--faint)}
.empty-il .eil-art{width:120px;height:96px;color:var(--line-2);margin:0 auto 12px;display:block;opacity:.9}
.empty-il .eil-t{font-family:var(--font-d);font-weight:600;font-size:18px;color:var(--dim);letter-spacing:.5px}
.empty-il .eil-s{font-size:13px;margin-top:4px}

/* member card: archetype header row + status sticker */
.mcard .mc-arch{font-family:var(--font-t);font-size:10px;letter-spacing:1.5px;font-weight:700}

/* squad lineup strip (dashboard) */
.lineup{display:flex;gap:8px;overflow-x:auto;padding:4px 2px 8px;scrollbar-width:none}
.lineup::-webkit-scrollbar{display:none}
.lu{flex:none;width:64px;text-align:center;opacity:.9}
.lu .portrait{width:46px;height:52px;margin:0 auto}
.lu.off{filter:grayscale(1);opacity:.4}
.lu .lu-n{font-size:11px;margin-top:2px;color:var(--dim)}

/* contract board (tasks) */
.contract{position:relative;display:flex;align-items:center;gap:11px;padding:12px 14px;margin-bottom:8px;font-size:14px;
  background:linear-gradient(90deg,#16242f,#0f1a23);border:1px solid var(--line);
  clip-path:polygon(0 0,calc(100% - 12px) 0,100% 12px,100% 100%,12px 100%,0 calc(100% - 12px))}
.contract .ct-seal{width:22px;height:22px;flex:none;display:grid;place-items:center;border:1.5px solid var(--faint);color:var(--faint);border-radius:50%}
.contract.done{border-color:rgba(34,224,166,.4)}
.contract.done .ct-seal{border-color:var(--mint);color:var(--mint);background:rgba(34,224,166,.12)}
.contract .ct-x{margin-left:auto;font-family:var(--font-t);font-size:11px;letter-spacing:1px;color:var(--dim)}

/* case board terminal header */
.caseboard{position:relative;overflow:hidden;display:flex;align-items:flex-start;gap:12px;padding:14px 16px 22px;margin-bottom:8px;
  background:linear-gradient(120deg,#1c1414,#11202b 70%);border:1px solid var(--line);border-left:4px solid var(--red);
  clip-path:polygon(14px 0,100% 0,100% calc(100% - 14px),calc(100% - 14px) 100%,0 100%,0 14px)}
.caseboard .cb-ic{color:var(--red)}.caseboard .cb-ic .ic{width:26px;height:26px}
.caseboard .cb-t{font-family:var(--font-d);font-weight:700;font-size:18px;letter-spacing:.5px}
.caseboard .cb-s{font-size:11px;color:var(--dim);line-height:1.5;margin-top:2px;max-width:74%}
.caseboard .cb-op{position:absolute;right:14px;top:12px;font-size:10px;color:var(--faint);letter-spacing:1px}
.caseboard .microtext{position:absolute;left:0;right:0;bottom:4px;padding:0 14px}
.mugshot{width:40px;height:46px;flex:none;display:grid;place-items:center;overflow:hidden;border:1px solid color-mix(in srgb,var(--ac) 50%,var(--line));
  clip-path:polygon(5px 0,100% 0,100% calc(100% - 5px),calc(100% - 5px) 100%,0 100%,0 5px)}
.mugshot .portrait{width:40px;height:46px}
/* badge wall */
.badgewall{display:flex;flex-wrap:wrap;gap:9px;align-items:center}
.bw-empty{font-size:13px;color:var(--faint)}
/* ledger event icon */
.ev-ic{width:30px;height:30px;flex:none;display:grid;place-items:center;background:var(--steel);color:var(--dim);
  clip-path:polygon(7px 0,100% 0,100% calc(100% - 7px),calc(100% - 7px) 100%,0 100%,0 7px)}
.ev-ic.pos{color:var(--mint)}.ev-ic.neg{color:var(--red)}.ev-ic .ic{width:16px;height:16px}
/* debrief banner (review) */
.debrief{position:relative;overflow:hidden;display:flex;align-items:center;gap:13px;padding:16px;margin-bottom:14px;
  background:linear-gradient(120deg,#14233a,#0e1922 70%);border:1px solid var(--line);border-left:4px solid var(--blue);
  clip-path:polygon(14px 0,100% 0,100% calc(100% - 14px),calc(100% - 14px) 100%,0 100%,0 14px)}
.debrief .db-ic{color:var(--blue)}.debrief .db-ic .ic{width:30px;height:30px}
.debrief .db-t{font-family:var(--font-d);font-weight:700;font-size:20px}
.debrief .db-s{font-size:12px;color:var(--dim);margin-top:2px}
/* squad-chip via :has (member select) */
.sqchip:has(input:checked){border-color:var(--ac);box-shadow:0 0 0 1px var(--ac) inset,0 6px 18px -10px var(--ac)}
/* match result mark */
.res-mark{font-family:var(--font-d);font-weight:700;font-size:12px;padding:2px 8px;clip-path:polygon(5px 0,100% 0,100% calc(100% - 5px),calc(100% - 5px) 100%,0 100%,0 5px)}
.res-mark.win{color:#04241a;background:var(--mint)}.res-mark.loss{color:#fff;background:var(--red)}.res-mark.other{color:var(--dim);background:var(--steel)}
/* poster hero (war report) */
.poster .p-hero{display:flex;align-items:center;gap:14px;justify-content:center;margin:10px 0 6px}
.poster .p-port{filter:drop-shadow(0 4px 14px rgba(0,0,0,.55))}
.poster .p-scan{position:absolute;top:12px;left:12px;width:28px;height:28px;opacity:.4}
.poster .award-strip{display:grid;grid-template-columns:repeat(2,1fr);gap:8px;margin:12px 0}

/* ---- approved-asset overlays (only render when an asset is approved in the
   Review Board; otherwise the original SVG above is used) ---- */
.hero-asset{position:absolute;right:-6%;bottom:-4%;height:122%;max-width:62%;object-fit:contain;
  z-index:0;opacity:.82;pointer-events:none;filter:saturate(1.08) drop-shadow(0 10px 30px rgba(0,0,0,.5));
  -webkit-mask-image:linear-gradient(90deg,transparent,#000 45%);mask-image:linear-gradient(90deg,transparent,#000 45%)}
.spotlight .sp-port .sp-asset{width:92px;height:92px;object-fit:contain;display:block}
.poster .p-hero{position:relative}
.poster .p-hero .p-portasset{width:74px;height:74px;object-fit:contain;display:block}
.poster .p-hero .p-bgasset{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;
  z-index:0;opacity:.12;pointer-events:none;-webkit-mask-image:radial-gradient(70% 100% at 50% 50%,#000,transparent);
  mask-image:radial-gradient(70% 100% at 50% 50%,#000,transparent)}

/* ---- accessibility: respect reduced motion ---- */
@media (prefers-reduced-motion: reduce){
  *,*::before,*::after{animation-duration:.001ms!important;animation-iteration-count:1!important;transition-duration:.001ms!important}
  .bg-radar,.deploy .reticle .r-out,.deploy .reticle .r-mid,.deploy .reticle .r-tickg,.deploy::before,.deploy .br,.status-dot i,
  .hero.not-deployed .deploy .core,.hero-line em,.hero-hint,.streak-flame .fl,.spotlight .sp-crown,.bg-glow,
  .m-sonar circle,.shard{animation:none!important}
  .view.shake{animation:none!important}
  .hero{cursor:default}
}

/* ===================== frontv5 · 正式页面分层视觉（原创，零外部素材） ===================== */
/* TacticalCollage 通用层 */
.tcollage{position:absolute;inset:0;pointer-events:none}
.tcollage svg{width:100%;height:100%;display:block}

/* 首页 hero 中景拼贴层（在操作员剪影与背景之间，制造前/中/背景层次） */
.hero-collage{position:absolute;left:50%;top:-12px;transform:translateX(-50%);width:340px;height:340px;z-index:0;
  opacity:.55;pointer-events:none;
  -webkit-mask-image:radial-gradient(62% 60% at 50% 44%,#000,transparent 76%);
  mask-image:radial-gradient(62% 60% at 50% 44%,#000,transparent 76%)}
/* 把签到核心托在战术底座上，不再孤零零漂浮 */
.deploy-wrap{position:relative}
.deploy-wrap::before{content:"";position:absolute;left:50%;top:50%;transform:translate(-50%,-46%);
  width:300px;height:118px;z-index:-1;pointer-events:none;
  background:radial-gradient(60% 100% at 50% 50%,rgba(255,70,85,.12),transparent 72%);
  border-bottom:1px solid rgba(120,150,170,.18)}

/* PosterHero 电竞海报头 */
.poster-hero{position:relative;overflow:hidden;border:1px solid var(--line);margin:0 0 14px;min-height:148px;
  display:flex;align-items:center;background:linear-gradient(115deg,#15060a,#0b141d);
  clip-path:polygon(0 0,100% 0,100% calc(100% - 14px),calc(100% - 14px) 100%,0 100%)}
.poster-hero::before{content:"";position:absolute;inset:0;z-index:1;
  background:linear-gradient(90deg,#0a131b 28%,transparent 80%)}
.poster-hero .ph2-collage{opacity:.6;z-index:0;
  -webkit-mask-image:linear-gradient(90deg,transparent,#000);mask-image:linear-gradient(90deg,transparent,#000)}
.ph2-port{position:absolute;right:-2%;bottom:-8%;width:150px;z-index:1;opacity:.92;pointer-events:none;
  filter:drop-shadow(0 8px 22px rgba(0,0,0,.55))}
.ph2-img{width:150px;height:auto;object-fit:contain}
.ph2-info{position:relative;z-index:2;padding:15px 18px}
.ph2-kicker{font-family:var(--font-t);font-size:10px;letter-spacing:4px;color:var(--ac,#ff4655)}
.ph2-title{font-family:var(--font-d);font-size:30px;line-height:1;margin:6px 0;color:#fff}
.ph2-sub{font-family:var(--font-t);font-size:12px;letter-spacing:1px;color:var(--dim)}
.ph2-stat{margin-top:9px;display:flex;align-items:baseline;gap:8px}
.ph2-stat b{font-family:var(--font-d);font-size:34px;line-height:1;color:var(--gold)}
.ph2-stat span{font-size:11px;letter-spacing:1px;color:var(--dim)}

/* 群榜 Top Agent spotlight 中景拼贴 */
.spotlight .sp-collage{position:absolute;inset:0;z-index:0;opacity:.5;pointer-events:none;
  -webkit-mask-image:radial-gradient(85% 85% at 28% 50%,#000,transparent 82%);
  mask-image:radial-gradient(85% 85% at 28% 50%,#000,transparent 82%)}

@media (max-width:600px){.hero-collage{width:280px;height:280px}.ph2-port{width:118px}.ph2-img{width:118px}.ph2-title{font-size:24px}.ph2-stat b{font-size:27px}}

/* ===================== frontv6 · 真实图片组件（审美优先，图片绝不裸贴） ===================== */
.pa{position:relative;overflow:hidden;display:block;width:100%;height:100%;margin:0}
.pa-img{width:100%;height:100%;display:block;opacity:0;transition:opacity .5s ease}
.pa.ld .pa-img{opacity:1}
.pa-skel{position:absolute;inset:0;background:linear-gradient(100deg,#0e1a24 28%,#16242f 50%,#0e1a24 72%);
  background-size:200% 100%;animation:pa-shim 1.25s linear infinite}
.pa.ld .pa-skel{opacity:0;animation:none;transition:opacity .4s}
.pa.err{background:repeating-conic-gradient(#0d161e 0 25%,#0f1923 0 50%) 0/16px 16px}
.pa.err .pa-skel{display:none}
@keyframes pa-shim{to{background-position:-200% 0}}
/* 遮罩层（可叠加多层） */
.pa-ov{position:absolute;inset:0;pointer-events:none}
.ov-dark{background:rgba(8,13,18,.42)}
.ov-heavy{background:rgba(8,13,18,.66)}
.ov-left-fade{background:linear-gradient(90deg,#0a131b 6%,rgba(10,19,27,.55) 44%,transparent 82%)}
.ov-bottom-fade{background:linear-gradient(0deg,#0a131b 3%,rgba(10,19,27,.5) 34%,transparent 66%)}
.ov-radial{background:radial-gradient(72% 84% at 50% 38%,transparent,rgba(8,13,18,.66))}
.ov-red-tint{background:linear-gradient(180deg,rgba(150,32,42,.3),rgba(8,13,18,.5))}
.ov-noise{opacity:.16;mix-blend-mode:overlay;background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='70' height='70'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='2'/><feColorMatrix type='saturate' values='0'/></filter><rect width='70' height='70' filter='url(%23n)'/></svg>")}
/* 圆形头像裁切 */
.pa-avatar{border-radius:50%;border:1px solid var(--line)}

/* —— 首页：真实背景层 + 右侧角色立绘 —— */
.hero-backdrop{position:absolute;inset:-10px 0 20px;z-index:0;pointer-events:none;opacity:.5;
  -webkit-mask-image:linear-gradient(180deg,#000 55%,transparent);mask-image:linear-gradient(180deg,#000 55%,transparent)}
.hero-portrait{position:absolute;right:-4%;top:-10px;bottom:8px;width:60%;max-width:340px;z-index:0;pointer-events:none;
  -webkit-mask-image:linear-gradient(90deg,transparent,#000 38%);mask-image:linear-gradient(90deg,transparent,#000 38%)}
.hero-portrait .pa-img{filter:drop-shadow(0 12px 30px rgba(0,0,0,.55))}

/* —— 战报 PosterHero：真实海报背景 + 立绘 —— */
.poster-hero .ph2-bg{position:absolute;inset:0;z-index:0;opacity:.7}
.poster-hero.has-bg::before{background:linear-gradient(90deg,#0a131b 24%,rgba(10,19,27,.55) 60%,transparent 92%)}
.ph2-port .pa{position:absolute;right:0;bottom:0;width:100%;height:172px}
.ph2-port .pa-img{filter:drop-shadow(0 8px 22px rgba(0,0,0,.55))}

/* —— 群榜 spotlight：真实立绘 —— */
.spotlight .sp-port .pa{width:92px;height:116px;border:1px solid var(--line)}
.spotlight .sp-port .pa-img{filter:drop-shadow(0 6px 16px rgba(0,0,0,.5))}
.mcard .agent-av .pa-avatar{width:46px;height:46px}
.lineup .lu .pa-avatar{width:46px;height:46px}

/* —— 我的：身份卡真实立绘 —— */
.idplate{position:relative;overflow:hidden}
.idplate .id-bg{position:absolute;inset:0;z-index:0;opacity:.42}
.idplate.has-img .id-port,.idplate .id-info,.idplate .id-tag{position:relative;z-index:1}
.idplate .id-portimg{width:84px;height:84px}

/* —— 互评 / 检举：横幅真实背景层 —— */
.v6-backdrop{position:absolute;inset:0;z-index:0;pointer-events:none}
.debrief,.caseboard{position:relative;overflow:hidden}
.debrief>*,.caseboard>*{position:relative;z-index:1}

/* ===================== frontv6.1 · Shoelace 现成组件主题化（战术暗色） ===================== */
.sl-theme-dark{
  --sl-color-primary-400:#ff6b76;--sl-color-primary-500:var(--red,#ff4655);--sl-color-primary-600:var(--red,#ff4655);
  --sl-color-primary-700:var(--red-deep,#c52f3c);--sl-color-primary-800:#9e2531;
  --sl-color-neutral-0:#0c1620;--sl-color-neutral-1000:#fff;
  --sl-font-sans:var(--font-t),"Segoe UI",system-ui,sans-serif;
  --sl-border-radius-small:2px;--sl-border-radius-medium:2px;--sl-border-radius-large:3px;--sl-border-radius-pill:2px;
  --sl-focus-ring-color:var(--red,#ff4655);
}
/* 头像（成员阵容 / 名册）：cover 上裁、战术描边 */
sl-avatar{--size:46px}
sl-avatar::part(base){border:1px solid var(--line);background:#16242f;box-shadow:0 2px 8px rgba(0,0,0,.4)}
sl-avatar::part(image){object-fit:cover;object-position:50% 20%}
.lu sl-avatar{--size:46px}
.mcard .agent-av sl-avatar{--size:46px}
/* 标签（标签墙）：等宽风 */
sl-tag::part(base){font-family:var(--font-t);letter-spacing:.3px;text-transform:none}
/* 骨架屏：暗色 + 微光 */
sl-skeleton{--color:#0e1a24;--sheen-color:#1b2c39}
sl-skeleton::part(indicator){border-radius:2px}
.skel-stack sl-skeleton{display:block;margin:10px 0;border-radius:3px}
/* 按钮（关键 CTA）：切角战术风 */
sl-button.btn-block{display:block;width:100%}
sl-button.btn-block::part(base){font-family:var(--font-d);letter-spacing:1px;
  clip-path:polygon(0 0,100% 0,100% calc(100% - 9px),calc(100% - 9px) 100%,0 100%)}
sl-button::part(base){border-radius:2px}

/* =====================================================================
   frontv7 · 图像构图 & 组件美学
   ===================================================================== */

/* —— SmartImage：blur 占位（骨架带轻微模糊感）+ 安全区/调光由 JS 注入 —— */
.pa-skel{filter:blur(.5px)}
.pa-poster .pa-img,.pa-hero .pa-img{will-change:transform}

/* —— 3. 首页 Hero 重构：左内容 / 右立绘 / 模糊背景 / HUD —— */
.hero{position:relative;overflow:hidden;text-align:left;padding:20px 18px 14px;margin-bottom:10px;cursor:crosshair;
  border:1px solid var(--line);background:linear-gradient(120deg,#0c1722,#0a1119 70%);
  clip-path:polygon(0 0,100% 0,100% calc(100% - 18px),calc(100% - 18px) 100%,0 100%)}
.hero>*{position:relative;z-index:1}
.hero-backdrop{position:absolute;inset:0;z-index:0;pointer-events:none;opacity:.6;filter:blur(3px) saturate(.92);
  -webkit-mask-image:linear-gradient(180deg,#000 50%,transparent);mask-image:linear-gradient(180deg,#000 50%,transparent)}
.hero-backdrop .pa{height:100%}
/* 右侧角色主视觉：成为构图的一部分（左缘渐隐融入暗场，不挡左侧按钮） */
.hero-figure{position:absolute;right:-1%;top:0;bottom:0;width:50%;max-width:340px;z-index:0;pointer-events:none;
  -webkit-mask-image:linear-gradient(90deg,transparent,#000 44%);mask-image:linear-gradient(90deg,transparent,#000 44%)}
.hero-figure .pa{height:100%}
.hero-figure::after{content:"";position:absolute;left:0;top:0;bottom:0;width:46%;
  background:linear-gradient(90deg,#0a1119,transparent)}
/* HUD 角标 */
.hero-hud{position:absolute;inset:0;z-index:1;pointer-events:none}
.hero-hud .hh{position:absolute;width:16px;height:16px;border:2px solid var(--red);opacity:.42}
.hero-hud .hh.tl{top:9px;left:9px;border-right:0;border-bottom:0}
.hero-hud .hh.tr{top:9px;right:9px;border-left:0;border-bottom:0}
.hero-hud .hh.bl{bottom:9px;left:9px;border-right:0;border-top:0}
.hero-hud .hh.br{bottom:9px;right:9px;border-left:0;border-top:0}
.hero-collage{left:auto;right:-30px;top:-20px;transform:none;width:300px;height:300px;opacity:.4}
/* 左内容栈 */
.hero-stage{display:flex}
.hero-left{width:64%;min-width:0}
.hero .hero-line{font-size:38px;margin:8px 0 4px;text-align:left}
.hero .hero-sub,.hero .hero-score{text-align:left}
.hero .deploy-wrap{align-items:center;margin-top:14px}
.hero .deploy{margin:4px 0}
.hero-hint{text-align:center}
/* 模式卡：去 emoji，原创战术图标 */
.mode .mode-ic{display:inline-grid;place-items:center;width:40px;height:40px;margin:0 auto 2px;color:var(--red);
  border:1px solid var(--line);background:rgba(255,70,85,.06);
  clip-path:polygon(8px 0,100% 0,100% calc(100% - 8px),calc(100% - 8px) 100%,0 100%,0 8px);transition:.16s}
.mode .mode-ic .ic{width:22px;height:22px}
.mode:hover .mode-ic{color:#fff;background:var(--red-deep);border-color:var(--red)}

@media(max-width:640px){
  .hero{padding:16px 14px 12px}
  .hero-stage{flex-direction:column}
  .hero-left{width:100%;text-align:center}
  .hero .hero-line{text-align:center;font-size:31px}
  .hero .hero-sub,.hero .hero-score{text-align:center}
  .hero .deploy-wrap{align-items:center}
  .hero-figure{width:78%;opacity:.34;right:-12%;
    -webkit-mask-image:linear-gradient(90deg,transparent,#000 60%);mask-image:linear-gradient(90deg,transparent,#000 60%)}
  .hero-figure::after{display:none}
}

/* —— 4.1 群榜阵容：统一尺寸 + 状态环 + 状态点 —— */
.lineup{align-items:flex-start}
.lu{width:68px}
.lu-av{display:block;margin:0 auto}
.stav{position:relative;display:inline-grid;place-items:center;width:var(--sz,52px);height:var(--sz,52px)}
.stav sl-avatar{--size:calc(var(--sz,52px) - 10px)}
.stav-ring{position:absolute;inset:0;border-radius:50%;border:2px solid var(--line-2);pointer-events:none}
.stav-dot{position:absolute;right:1px;bottom:1px;width:12px;height:12px;border-radius:50%;border:2px solid var(--void-2);background:var(--faint);z-index:2}
.stav--checked .stav-ring{border-color:var(--mint);box-shadow:0 0 11px -1px rgba(34,224,166,.6)}
.stav--checked .stav-dot{background:var(--mint);box-shadow:0 0 6px var(--mint)}
.stav--missing .stav-ring{border-color:var(--red)}
.stav--missing .stav-dot{background:var(--red)}
.stav--missing sl-avatar{filter:grayscale(.6) brightness(.82)}
.stav--disputed .stav-ring{border-color:var(--gold);animation:warnpulse 2.2s ease-in-out infinite}
.stav--disputed .stav-dot{background:var(--gold)}
.stav--revoked .stav-ring{border-color:var(--red)}
.stav--revoked .stav-dot{background:var(--red)}
.stav--revoked sl-avatar{filter:grayscale(1) brightness(.6)}
.stav--idle sl-avatar{filter:grayscale(.4) brightness(.86)}

/* —— 4.2 Top Agent → MVP 卡 —— */
.mvp{position:relative;overflow:hidden;display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:16px;
  padding:18px 20px;margin-bottom:14px;min-height:132px;
  background:linear-gradient(115deg,color-mix(in srgb,var(--ac) 20%,#10202b),#0b1620 72%);
  border:1px solid color-mix(in srgb,var(--ac) 38%,var(--line));border-left:4px solid var(--ac);
  clip-path:polygon(16px 0,100% 0,100% calc(100% - 16px),calc(100% - 16px) 100%,0 100%,0 16px)}
.mvp-glow{position:absolute;top:-60px;right:-30px;width:260px;height:260px;z-index:0;
  background:radial-gradient(circle,color-mix(in srgb,var(--ac) 45%,transparent),transparent 70%)}
.mvp-collage{opacity:.4;z-index:0;-webkit-mask-image:radial-gradient(80% 90% at 26% 50%,#000,transparent 82%);mask-image:radial-gradient(80% 90% at 26% 50%,#000,transparent 82%)}
.mvp-port,.mvp-body,.mvp-rank{position:relative;z-index:1}
.mvp-port{width:94px;height:116px;flex:none;position:relative;overflow:hidden;
  border:1px solid color-mix(in srgb,var(--ac) 45%,var(--line));
  clip-path:polygon(10px 0,100% 0,100% calc(100% - 10px),calc(100% - 10px) 100%,0 100%,0 10px)}
.mvp-port .pa{width:100%;height:100%}
.mvp-port .portrait{width:100%;height:100%}
.mvp-body{min-width:0}
.mvp-badge{margin-bottom:7px}
.mvp-name{font-family:var(--font-d);font-weight:700;font-size:30px;line-height:1;color:#fff}
.mvp-call{font-family:var(--font-t);font-size:11px;letter-spacing:1.5px;margin-top:5px}
.mvp-tags{margin-top:8px}
.mvp-rank{text-align:center;flex:none;padding-left:6px;border-left:1px solid color-mix(in srgb,var(--ac) 30%,var(--line))}
.mvp-rk{font-family:var(--font-d);font-weight:700;font-size:30px;color:var(--ac);line-height:1}
.mvp-score{margin-top:6px}
.mvp-score b{font-family:var(--font-d);font-weight:700;font-size:24px;color:#fff;display:block;line-height:1}
.mvp-score span{font-size:10px;letter-spacing:1px;color:var(--dim)}

/* —— 本周之最 → 奖牌卡 —— */
.medal-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:10px}
.medal{position:relative;display:flex;align-items:center;gap:12px;padding:12px 14px;
  background:linear-gradient(150deg,#16242f,#0e1922);border:1px solid var(--line);
  clip-path:polygon(0 0,calc(100% - 12px) 0,100% 12px,100% 100%,12px 100%,0 calc(100% - 12px))}
.medal-disc{position:relative;width:46px;height:46px;flex:none;display:grid;place-items:center;border-radius:50%;
  background:radial-gradient(circle at 38% 30%,color-mix(in srgb,var(--ac) 60%,#1a2a35),#0b1620);
  border:1px solid color-mix(in srgb,var(--ac) 55%,var(--line));box-shadow:inset 0 -3px 8px rgba(0,0,0,.4),0 0 12px -3px var(--ac)}
.medal-ring{position:absolute;inset:4px;border-radius:50%;border:1px dashed color-mix(in srgb,var(--ac) 60%,transparent);opacity:.7}
.medal-ic{color:#fff;display:grid;place-items:center}.medal-ic .ic{width:20px;height:20px}
.medal-meta{min-width:0}
.medal-l{font-size:10px;letter-spacing:1px;color:var(--dim)}
.medal-n{font-family:var(--font-d);font-weight:700;font-size:18px;letter-spacing:.5px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.medal--empty{opacity:.5}.medal--empty .medal-disc{filter:grayscale(.85)}

/* —— 4.3 排行榜：前三 podium + 列表行 —— */
.podium{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;align-items:end;margin:6px 0 14px}
.pod{position:relative;display:flex;flex-direction:column;align-items:center;gap:5px;padding:14px 6px 0;text-align:center;
  background:linear-gradient(180deg,#17262f,#0e1922);border:1px solid var(--line);
  clip-path:polygon(8px 0,100% 0,100% 100%,0 100%,0 8px)}
.pod--1{order:2;border-color:rgba(240,196,99,.55);box-shadow:0 0 24px -8px rgba(240,196,99,.5),inset 0 0 34px -18px var(--gold)}
.pod--2{order:1}.pod--3{order:3}
.pod-av{position:relative;margin-top:4px}
.pod-av sl-avatar::part(base){border-width:2px}
.pod--1 .pod-av sl-avatar::part(base){border-color:var(--gold);box-shadow:0 0 14px -2px rgba(240,196,99,.6)}
.pod-medal{position:absolute;right:-5px;bottom:-3px;width:21px;height:21px;display:grid;place-items:center;border-radius:50%;z-index:2;
  font-family:var(--font-d);font-weight:700;font-size:12px;color:#0b121a;background:var(--steel);border:2px solid var(--void-2)}
.pod--1 .pod-medal{background:linear-gradient(135deg,var(--gold),#c79a3a)}
.pod--2 .pod-medal{background:linear-gradient(135deg,#cdd6dc,#94a4b0)}
.pod--3 .pod-medal{background:linear-gradient(135deg,#d98c52,#a85f31);color:#22100a}
.pod-crown{position:absolute;top:-17px;left:50%;transform:translateX(-50%);color:var(--gold);width:22px;height:22px}
.pod-crown .ic{width:22px;height:22px;animation:flicker 1.6s ease-in-out infinite}
.pod-name{font-family:var(--font-d);font-weight:600;font-size:15px;max-width:100%;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.pod-val{font-family:var(--font-d);font-weight:700;font-size:20px;color:var(--gold)}
.pod-val span{font-size:10px;color:var(--dim);margin-left:2px}
.pod-stand{width:100%;margin-top:7px;font-family:var(--font-d);font-weight:700;font-size:14px;color:var(--dim);
  background:rgba(255,255,255,.04);border-top:1px solid var(--line-2);padding:7px 0 9px}
.pod--1 .pod-stand{padding-bottom:20px;color:var(--gold);background:rgba(240,196,99,.1)}.pod--2 .pod-stand{padding-bottom:12px}
.lb-list{display:flex;flex-direction:column;gap:7px}
.lbrow{display:flex;align-items:center;gap:11px;padding:9px 13px;background:var(--panel);border:1px solid var(--line);
  clip-path:polygon(8px 0,100% 0,100% calc(100% - 8px),calc(100% - 8px) 100%,0 100%,0 8px)}
.lb-av{flex:none;display:grid;place-items:center}.lb-av sl-avatar{--size:34px}
.lb-mid{flex:1;min-width:0}
.lb-name{font-family:var(--font-d);font-weight:600;font-size:15px;letter-spacing:.3px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.lb-bar{height:5px;margin-top:5px;background:var(--steel);overflow:hidden;border-radius:3px}
.lb-bar i{display:block;height:100%;background:linear-gradient(90deg,var(--mint-deep),var(--mint));border-radius:3px}
.lb-val{font-family:var(--font-d);font-weight:700;font-size:19px;color:var(--mint);font-variant-numeric:tabular-nums}
.lb-val span{font-size:11px;color:var(--dim);margin-left:2px}
.lbrow.champion{border-color:rgba(240,196,99,.55);box-shadow:0 0 0 1px rgba(240,196,99,.25),0 0 22px -8px rgba(240,196,99,.45)}
.lbrow.champion .lb-val{color:var(--gold)}.lbrow.champion .lb-bar i{background:linear-gradient(90deg,#c79a3a,var(--gold))}
@media(max-width:540px){.medal-grid{grid-template-columns:1fr}.mvp-name{font-size:25px}.mvp-port{width:78px;height:100px}}

/* —— 5. 互评页：debrief hero / 选择器 / 标签 sticker —— */
.debrief-hero{position:relative;overflow:hidden;min-height:114px;margin-bottom:14px;display:flex;align-items:flex-end;
  border:1px solid var(--line);border-left:4px solid var(--blue);
  clip-path:polygon(14px 0,100% 0,100% calc(100% - 14px),calc(100% - 14px) 100%,0 100%,0 14px)}
.dh-bg{position:absolute;inset:0;z-index:0}.dh-bg .pa{width:100%;height:100%}
.debrief-hero::after{content:"";position:absolute;inset:0;z-index:1;background:linear-gradient(90deg,#0a1622 16%,rgba(10,22,34,.35) 72%,transparent)}
.dh-watermark{position:absolute;right:12px;top:9px;z-index:2;font-family:var(--font-d);font-weight:700;font-size:13px;letter-spacing:3px;color:rgba(255,255,255,.16)}
.dh-content{position:relative;z-index:2;display:flex;align-items:center;gap:13px;padding:16px}
.dh-content .db-ic{color:var(--blue)}.dh-content .db-ic .ic{width:30px;height:30px}
.dh-content .db-t{font-family:var(--font-d);font-weight:700;font-size:21px}
.dh-content .db-s{font-size:12px;color:var(--dim);margin-top:2px}
/* 结果 3 大 chip */
.result-pick{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin-top:6px}
.rchip{display:flex;flex-direction:column;align-items:center;gap:6px;padding:16px 8px;cursor:pointer;
  background:var(--panel);border:1px solid var(--line);color:var(--dim);font-family:var(--font-d);font-weight:600;transition:.16s;
  clip-path:polygon(10px 0,100% 0,100% calc(100% - 10px),calc(100% - 10px) 100%,0 100%,0 10px)}
.rchip .rchip-ic .ic{width:26px;height:26px}
.rchip .rchip-l{font-size:17px;letter-spacing:1px}
.rchip:hover{border-color:var(--line-2);color:var(--text)}
.rchip--win.on{color:#04241a;background:linear-gradient(135deg,var(--mint),var(--mint-deep));border-color:var(--mint);box-shadow:0 8px 22px -10px rgba(34,224,166,.6)}
.rchip--loss.on{color:#fff;background:linear-gradient(135deg,var(--red),var(--red-deep));border-color:var(--red);box-shadow:0 8px 22px -10px var(--red-glow)}
.rchip--other.on{color:var(--text);background:var(--steel);border-color:var(--line-2)}
/* 模式卡片 */
.mode-pick{display:grid;grid-template-columns:repeat(5,1fr);gap:8px;margin-top:6px}
.modecard{display:flex;flex-direction:column;align-items:center;gap:5px;padding:12px 4px;cursor:pointer;
  background:var(--panel);border:1px solid var(--line);color:var(--dim);transition:.16s;
  clip-path:polygon(8px 0,100% 0,100% calc(100% - 8px),calc(100% - 8px) 100%,0 100%,0 8px)}
.modecard .mc2-ic .ic{width:20px;height:20px}
.modecard .mc2-l{font-family:var(--font-d);font-weight:600;font-size:13px}
.modecard:hover{border-color:var(--line-2);color:var(--text)}
.modecard.on{color:#fff;border-color:var(--red);background:linear-gradient(160deg,rgba(255,70,85,.18),rgba(255,70,85,.04));box-shadow:inset 0 0 0 1px var(--red)}
.modecard.on .mc2-ic{color:var(--red)}
/* 标签分区 + sticker */
.tag-groups{display:flex;flex-direction:column;gap:12px}
.tag-group{padding:10px 12px;border:1px solid var(--line);clip-path:polygon(8px 0,100% 0,100% calc(100% - 8px),calc(100% - 8px) 100%,0 100%,0 8px)}
.tg-h{font-family:var(--font-t);font-size:11px;letter-spacing:1.5px;font-weight:700;margin-bottom:9px;display:flex;align-items:center;gap:6px}
.tg-h .ic{width:15px;height:15px}
.tg-pos{background:linear-gradient(150deg,rgba(34,224,166,.08),transparent);border-color:rgba(34,224,166,.28)}.tg-pos .tg-h{color:var(--mint)}
.tg-neg{background:linear-gradient(150deg,rgba(255,70,85,.08),transparent);border-color:rgba(255,70,85,.28)}.tg-neg .tg-h{color:var(--red)}
.tg-special{background:linear-gradient(150deg,rgba(240,196,99,.08),transparent);border-color:rgba(240,196,99,.28)}.tg-special .tg-h{color:var(--gold)}
.tg-items{display:flex;flex-wrap:wrap;gap:8px}
.tagsticker{display:inline-flex;align-items:center;gap:8px;padding:7px 6px 7px 12px;cursor:pointer;font-family:var(--font-t);font-weight:600;font-size:13px;
  background:var(--void);border:1px solid var(--line);color:var(--text);transition:.14s;
  clip-path:polygon(7px 0,100% 0,100% calc(100% - 7px),calc(100% - 7px) 100%,0 100%,0 7px)}
.tagsticker .ts-d{font-family:var(--font-d);font-weight:700;font-size:12px;padding:1px 7px;color:#0b121a;clip-path:polygon(4px 0,100% 0,100% 100%,0 100%)}
.tagsticker.pos .ts-d{background:var(--mint)}.tagsticker.neg .ts-d{background:var(--red);color:#fff}.tagsticker.special .ts-d{background:var(--gold)}
.tagsticker:hover{border-color:var(--line-2);transform:translateY(-1px)}
.tagsticker.pos.on{border-color:var(--mint);background:rgba(34,224,166,.14);box-shadow:0 0 0 1px var(--mint) inset}
.tagsticker.neg.on{border-color:var(--red);background:rgba(255,70,85,.14);box-shadow:0 0 0 1px var(--red) inset}
.tagsticker.special.on{border-color:var(--gold);background:rgba(240,196,99,.14);box-shadow:0 0 0 1px var(--gold) inset}
.tagsticker.pop{animation:pop .25s ease}
.tagsticker.fired{animation:fired .34s ease-in forwards}
.review-target .rt-av sl-avatar{--size:40px}
@media(max-width:540px){.mode-pick{grid-template-columns:repeat(3,1fr)}}

/* —— 6. 检举页：tribunal hero / suspect rows / dossier case file —— */
.tribunal-hero{position:relative;overflow:hidden;min-height:152px;margin-bottom:14px;display:flex;align-items:center;
  border:1px solid var(--line);border-left:4px solid var(--red);
  clip-path:polygon(14px 0,100% 0,100% calc(100% - 14px),calc(100% - 14px) 100%,0 100%,0 14px)}
.th-bg{position:absolute;inset:0;z-index:0}.th-bg .pa{width:100%;height:100%}
.tribunal-hero::after{content:"";position:absolute;inset:0;z-index:1;background:linear-gradient(100deg,#15090c 30%,rgba(28,12,14,.5) 66%,rgba(20,10,12,.15))}
.th-suspect{position:absolute;right:0;top:0;bottom:0;width:42%;max-width:210px;z-index:1;opacity:.55;pointer-events:none;
  -webkit-mask-image:linear-gradient(90deg,transparent,#000 60%);mask-image:linear-gradient(90deg,transparent,#000 60%)}
.th-suspect .pa{height:100%;width:100%}
.th-suspect .portrait{height:100%;width:auto;margin-left:auto;display:block;filter:drop-shadow(0 6px 18px rgba(0,0,0,.6));opacity:.6}
.th-scan{position:absolute;left:0;right:0;top:0;height:2px;z-index:2;background:var(--red);box-shadow:0 0 12px var(--red);opacity:.55;animation:thscan 3.6s linear infinite}
@keyframes thscan{0%{top:-2px}100%{top:100%}}
.th-info{position:relative;z-index:2;padding:16px 18px;max-width:82%}
.th-title{font-family:var(--font-d);font-weight:700;font-size:21px;letter-spacing:.5px;display:flex;align-items:center;gap:8px;color:#fff}
.th-title .ic{width:22px;height:22px;color:var(--red)}
.th-rules{display:flex;flex-wrap:wrap;gap:6px;margin-top:10px}
.th-rules span{font-size:10px;letter-spacing:.5px;color:var(--dim);padding:3px 8px;background:rgba(255,255,255,.04);border:1px solid var(--line);
  clip-path:polygon(5px 0,100% 0,100% calc(100% - 5px),calc(100% - 5px) 100%,0 100%,0 5px)}
.th-rules .hot{color:#ffb4ba;border-color:rgba(255,70,85,.5);background:rgba(255,70,85,.1)}
.th-note{font-size:11px;color:var(--gold);margin-top:8px}
.th-op{font-size:10px;letter-spacing:1px;color:var(--faint);margin-top:6px}
/* suspect rows */
.suspects{display:flex;flex-direction:column;gap:8px}
.suspect{display:flex;align-items:center;gap:12px;padding:11px 14px;background:var(--panel);border:1px solid var(--line);
  clip-path:polygon(0 0,calc(100% - 10px) 0,100% 10px,100% 100%,10px 100%,0 calc(100% - 10px))}
.suspect.revoked{opacity:.6}
.su-av{flex:none}.su-av sl-avatar{--size:44px}
.su-main{flex:1;min-width:0}
.su-top{display:flex;align-items:center;gap:9px}
.su-name{font-family:var(--font-d);font-weight:600;font-size:16px}
.su-meta{font-size:11px;color:var(--dim);margin-top:2px}
.su-reason{margin-top:8px;font-size:12px;padding:7px 9px;max-width:300px}
.su-act{flex:none}
.su-done{font-size:11px;color:var(--faint);letter-spacing:1px;flex:none}
/* dossier case file */
.case.dossier{padding-top:5px}
.dossier-tab{display:inline-block;margin-left:14px;font-family:var(--font-t);font-size:9px;letter-spacing:2px;color:var(--faint);
  background:var(--steel);padding:3px 10px 4px;border:1px solid var(--line);border-top:0}
.evidence{position:relative;margin-top:10px;padding:10px 12px;border:1px dashed var(--line-2);
  background:repeating-linear-gradient(0deg,rgba(255,255,255,.02) 0 21px,transparent 21px 22px),#0c1620}
.ev-tag{display:inline-flex;align-items:center;gap:5px;font-family:var(--font-t);font-size:9px;letter-spacing:1.5px;color:var(--red)}
.ev-tag .ic{width:13px;height:13px}
.ev-text{font-size:14px;color:var(--text);margin-top:5px}
.witness-row{display:flex;align-items:center;gap:7px;margin-top:11px}
.witness-l{font-family:var(--font-t);font-size:10px;letter-spacing:1px;color:var(--dim)}
.witness{width:24px;height:24px;display:grid;place-items:center;color:var(--faint);background:var(--steel);border:1px solid var(--line);border-radius:50%}
.witness .ic{width:12px;height:12px}
.witness.on{color:var(--gold);border-color:var(--gold)}
.witness.full{color:#fff;background:var(--red);border-color:var(--red)}
.witness-n{margin-left:auto;font-size:11px;color:var(--dim)}
.case-tl{display:flex;align-items:flex-start;margin-top:13px}
.cstep{flex:1;display:flex;flex-direction:column;align-items:center;gap:5px;position:relative;color:var(--faint);font-size:10px;letter-spacing:.5px;text-align:center}
.cstep .ic{width:16px;height:16px;padding:6px;border-radius:50%;background:#14222c;border:1px solid var(--line);box-sizing:content-box;color:var(--faint)}
.cstep::before{content:"";position:absolute;top:14px;left:-50%;width:100%;height:2px;background:var(--line);z-index:0}
.cstep>*{position:relative;z-index:1}
.cstep:first-child::before{display:none}
.cstep.done{color:var(--dim)}.cstep.done .ic{color:var(--mint);border-color:var(--mint);background:#11241d}
.cstep.done::before{background:var(--mint)}
.cstep.now{color:#fff}.cstep.now .ic{color:var(--gold);border-color:var(--gold);background:#241f10;box-shadow:0 0 10px -2px var(--gold)}
.cstep.now::before{background:var(--gold)}
.cstep.now.bad .ic{color:#fff;border-color:var(--red);background:var(--red);box-shadow:0 0 12px -2px var(--red-glow)}
.cstep.now.good .ic{color:#04241a;border-color:var(--mint);background:var(--mint)}
.mugshot .pa{width:100%;height:100%}.mug-img{width:100%;height:100%}
.case.dossier .stamp{font-size:13px}

/* —— 7. 我的页：身份 Hero / 称号收藏 / 流水时间线 —— */
.idplate{position:relative;overflow:hidden;display:block;padding:0;margin-bottom:14px;min-height:148px;
  background:linear-gradient(120deg,color-mix(in srgb,var(--ac) 16%,#11202b),#0c1722 72%);
  border:1px solid var(--line);border-left:4px solid var(--ac);
  clip-path:polygon(16px 0,100% 0,100% calc(100% - 16px),calc(100% - 16px) 100%,0 100%,0 16px)}
.id-hero-port{position:absolute;right:0;top:0;bottom:0;width:46%;max-width:240px;z-index:0;opacity:.92;pointer-events:none;
  -webkit-mask-image:linear-gradient(90deg,transparent,#000 56%);mask-image:linear-gradient(90deg,transparent,#000 56%)}
.id-hero-port .pa{width:100%;height:100%}
.idplate .idhex{position:absolute;right:-8px;top:-8px;width:160px;height:114px;opacity:.13;z-index:1;color:var(--ac)}
.id-main{position:relative;z-index:2;display:flex;align-items:center;gap:16px;padding:18px 20px}
.idplate.has-img .id-main{padding-right:44%}
.id-id{flex:none;text-align:center}
.id-av-wrap{width:72px;height:72px;margin:0 auto}
.id-av-wrap .pa{width:72px;height:72px}
.id-av-wrap .pa-avatar{border:2px solid var(--ac)}
.id-av-svg .portrait{width:62px;height:auto}
.id-code{font-family:var(--font-t);font-size:10px;letter-spacing:1.5px;color:var(--faint);margin-top:6px}
.id-info{min-width:0;flex:1}
.id-credit{display:flex;align-items:center;gap:8px;margin-top:8px}
.id-rep{display:inline-flex;gap:3px}
.id-rep i{width:11px;height:8px;background:var(--steel);clip-path:polygon(3px 0,100% 0,100% 100%,0 100%)}
.id-rep i.on{background:var(--mint);box-shadow:0 0 5px rgba(34,224,166,.5)}
.id-rep.mid i.on{background:var(--gold)}.id-rep.low i.on{background:var(--red)}
.id-credit-n{font-size:11px;color:var(--dim)}
.id-ribbon{position:relative;z-index:2;display:grid;grid-template-columns:repeat(4,1fr);gap:1px;background:var(--line);border-top:1px solid var(--line)}
.id-stat{background:linear-gradient(160deg,rgba(11,21,29,.82),rgba(9,16,22,.82));padding:11px 8px;text-align:center}
.id-stat b{font-family:var(--font-d);font-weight:700;font-size:22px;color:#fff;display:block;line-height:1}
.id-stat span{font-size:10px;letter-spacing:1px;color:var(--dim)}
/* 称号收藏 */
.badge-collection{display:flex;flex-wrap:wrap;gap:9px;align-items:center}
.sticker>span{display:inline}
.sticker.locked{background:linear-gradient(135deg,rgba(70,92,107,.14),rgba(70,92,107,.03));border:1px dashed var(--line-2);color:var(--faint);box-shadow:none}
.sticker.locked .ic{opacity:.65}
/* 瓦力流水时间线 */
.timeline{display:flex;flex-direction:column;margin-left:14px}
.tl-item{position:relative;display:flex;align-items:center;gap:12px;padding:9px 2px 9px 28px;border-left:2px solid var(--line)}
.tl-item:last-child{border-left-color:transparent}
.tl-node{position:absolute;left:-15px;top:50%;transform:translateY(-50%);width:28px;height:28px;display:grid;place-items:center;border-radius:50%;
  background:var(--steel);border:1px solid var(--line);color:var(--dim);z-index:1}
.tl-node .ic{width:15px;height:15px}
.tl-node.pos{color:var(--mint);border-color:rgba(34,224,166,.5);background:rgba(34,224,166,.08)}
.tl-node.neg{color:var(--red);border-color:rgba(255,70,85,.5);background:rgba(255,70,85,.08)}
.tl-body{flex:1;min-width:0}
.tl-desc{font-size:13px;line-height:1.4}
.tl-meta{font-size:11px;color:var(--faint);margin-top:2px}
.tl-delta{font-family:var(--font-d);font-weight:700;font-size:18px;flex:none;font-variant-numeric:tabular-nums}
.tl-delta.pos{color:var(--mint)}.tl-delta.neg{color:var(--red)}
.tl-item.rev{opacity:.5}
.tl-item.rev .tl-desc{text-decoration:line-through}
.tl-item.major .tl-node{box-shadow:0 0 12px -2px currentColor}
.tl-item.major .tl-desc{font-weight:600}
@media(max-width:540px){.id-hero-port{opacity:.5}.id-main{gap:12px;padding:16px}.id-stat b{font-size:19px}}

/* —— 8. 战报页：固定比例可分享海报 —— */
.share-poster{position:relative;overflow:hidden;display:flex;flex-direction:column;margin-bottom:6px;
  background:linear-gradient(180deg,#162635,#0b1118);border:1px solid var(--line);
  clip-path:polygon(18px 0,100% 0,100% calc(100% - 18px),calc(100% - 18px) 100%,0 100%,0 18px)}
.share-poster::before{content:"";position:absolute;top:0;left:0;right:0;height:3px;z-index:5;background:var(--mint);box-shadow:0 0 16px var(--mint);animation:posterscan .9s ease-out forwards}
.sp7-hero{position:relative;flex:none;height:210px;overflow:hidden}
.sp7-bg{position:absolute;inset:0;z-index:0}.sp7-bg .pa{width:100%;height:100%}
.sp7-hero::after{content:"";position:absolute;inset:0;z-index:1;
  background:linear-gradient(0deg,#0b1118 5%,rgba(11,17,24,.3) 42%,transparent 72%),linear-gradient(90deg,rgba(11,17,24,.55),transparent 60%)}
.sp7-collage{z-index:1;opacity:.4}
.sp7-fig{position:absolute;right:-2%;top:-8%;bottom:-8%;width:46%;max-width:240px;z-index:1;opacity:.95;pointer-events:none;
  -webkit-mask-image:linear-gradient(90deg,transparent,#000 48%);mask-image:linear-gradient(90deg,transparent,#000 48%)}
.sp7-fig .pa{width:100%;height:100%}
.sp7-htext{position:absolute;left:18px;top:15px;z-index:2;max-width:72%}
.sp7-tag{font-family:var(--font-t);font-size:10px;letter-spacing:3px;color:var(--ac,var(--red))}
.sp7-title{font-family:var(--font-d);font-weight:700;font-size:30px;line-height:1.04;color:#fff;margin-top:4px;text-shadow:0 2px 12px rgba(0,0,0,.6)}
.sp7-sub{font-family:var(--font-t);font-size:11px;letter-spacing:1px;color:var(--dim);margin-top:4px}
.sp7-core{position:absolute;left:18px;bottom:12px;z-index:2;display:flex;align-items:baseline;gap:7px}
.sp7-core b{font-family:var(--font-d);font-weight:700;font-size:40px;line-height:1;color:var(--gold);text-shadow:0 2px 12px rgba(0,0,0,.6)}
.sp7-core span{font-size:11px;letter-spacing:1px;color:var(--dim)}
.sp7-body{flex:none;display:flex;flex-direction:column;gap:11px;padding:14px}
.sp7-medals{display:grid;grid-template-columns:repeat(2,1fr);gap:8px}
.sp7-medals .medal{padding:9px 11px}
.sp7-medals .medal-disc{width:38px;height:38px}.sp7-medals .medal-ic .ic{width:17px;height:17px}
.sp7-medals .medal-l{font-size:9px}.sp7-medals .medal-n{font-size:15px}
.sp7-rows{display:flex;flex-direction:column;gap:5px}
.sp7-row{display:flex;justify-content:space-between;align-items:center;padding:7px 12px;background:rgba(255,255,255,.03);border:1px solid var(--line);
  clip-path:polygon(6px 0,100% 0,100% calc(100% - 6px),calc(100% - 6px) 100%,0 100%,0 6px)}
.sp7-row span{font-size:12px;color:var(--dim)}
.sp7-row b{font-family:var(--font-d);font-weight:600;font-size:16px}
.sp7-row.hot{background:linear-gradient(90deg,rgba(255,70,85,.18),transparent);border-color:rgba(255,70,85,.45)}
.sp7-row.hot b{color:var(--gold)}
.sp7-strip{display:flex;gap:8px;overflow-x:auto;padding-top:10px;margin-top:2px;border-top:1px solid var(--line);scrollbar-width:none}
.sp7-strip::-webkit-scrollbar{display:none}
.sp7-mem{flex:none;width:46px;text-align:center}
.sp7-mem sl-avatar{--size:30px}
.sp7-mem span{display:block;font-size:9px;color:var(--dim);margin-top:3px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.sp7-mem.dim{opacity:.34;filter:grayscale(.8)}
.sp7-mem.lit sl-avatar::part(base){border-color:var(--mint);box-shadow:0 0 8px -1px rgba(34,224,166,.6)}
.sp7-foot{flex:none;text-align:center;font-size:10px;letter-spacing:1px;color:var(--faint);padding:8px 0 10px;border-top:1px solid var(--line)}
@media(max-width:600px){.sp7-hero{height:172px}.sp7-title{font-size:25px}.sp7-core b{font-size:34px}.sp7-medals .medal-n{font-size:13px}}

/* —— 9. 按钮类型分化：危险操作（红色 stamp 感）—— */
.btn.danger{background:linear-gradient(135deg,#7d1622,#3a0c11);border:1px solid var(--red);color:#ffd9dc}
.btn.danger .ic{width:15px;height:15px}
.btn.danger:hover{color:#fff;background:linear-gradient(135deg,var(--red),var(--red-deep));box-shadow:0 8px 26px -8px var(--red-glow)}
.btn.mint .ic{width:15px;height:15px}

/* ============================================================ frontv8 ============================================================ */
/* —— 12. 全局布局：主内容宽度按页面类型分（桌面不再大量留白） —— */
body[data-view="home"] .view{max-width:1240px;padding-left:26px;padding-right:26px}
body[data-view="dashboard"] .view{max-width:1080px}
body[data-view="review"] .view,
body[data-view="report"] .view,
body[data-view="profile"] .view{max-width:960px}
body[data-view="share"] .view{max-width:760px}

/* —— 5. 首页 Hero（精简版）：左状态/数字带 + 右侧签到核心（焦点）+ 底模式条；不插入立绘 —— */
body[data-view="home"] .hero{min-height:auto;padding:30px 32px 0;display:block;
  background:linear-gradient(115deg,#0d1825,#0a1018 72%)}
.hero-grid{position:relative;z-index:1;display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:18px 30px;max-width:none}
.hero-grid .hero-left{flex:1;min-width:268px}
.eb-role{color:var(--ac,var(--red));font-weight:700}
.hero-meta{display:flex;flex-wrap:wrap;gap:8px;margin:15px 0 2px}
.hero-meta .hm{padding:8px 14px;background:rgba(255,255,255,.04);border:1px solid var(--line);min-width:66px;
  clip-path:polygon(7px 0,100% 0,100% calc(100% - 7px),calc(100% - 7px) 100%,0 100%,0 7px)}
.hero-meta .hm b{display:block;font-family:var(--font-d);font-weight:700;font-size:23px;line-height:1;color:#fff}
.hero-meta .hm b i{font-size:12px;color:var(--dim);font-style:normal;font-weight:600}
.hero-meta .hm span{font-size:10px;letter-spacing:.5px;color:var(--dim)}
.hero-deploy{flex:none;margin:0}
.hero-deploy .deploy-wrap{align-items:center;padding:0}
.hero-deploy .deploy{width:208px;height:208px;margin:0}
.hero-deploy .deploy .big{font-size:32px}
.hero-deploy .deploy .small{font-size:9px;margin-top:6px}
.hero-modes{position:relative;z-index:2;margin:18px -32px 0;padding:14px 32px 6px;
  background:linear-gradient(0deg,rgba(8,13,19,.92),rgba(8,13,19,.32));border-top:1px solid var(--line)}
.hero-modes .hero-hint{text-align:left;color:var(--dim);letter-spacing:3px;font-size:11px;animation:none;margin:0 0 9px}
.hero-modes .modes{grid-template-columns:repeat(6,1fr);margin-top:0}
.modes .mode{appearance:none;font:inherit;color:inherit}
.modes .mode[disabled]{opacity:.4;cursor:default;pointer-events:none;filter:grayscale(.5)}

/* —— 7. 互评：成员多选改稳健 button + 选中 check/发光（修复不可点 bug 的视觉侧） —— */
.debrief-hero{min-height:138px}
.squad-pick{display:flex;flex-wrap:wrap;gap:9px;margin-top:4px}
.squad-pick .sqchip{appearance:none;font:inherit;color:var(--text);background:rgba(255,255,255,.03);
  display:inline-flex;align-items:center;gap:8px;padding:7px 14px 7px 8px;margin:0;cursor:pointer;position:relative;
  border:1px solid var(--line);clip-path:polygon(7px 0,100% 0,100% calc(100% - 7px),calc(100% - 7px) 100%,0 100%,0 7px);transition:.15s}
.squad-pick .sqchip .sq-av{width:34px;height:34px;flex:none;display:grid;place-items:center}
.squad-pick .sqchip .sq-av sl-avatar{--size:34px}
.squad-pick .sqchip .sq-n{font-size:13px}
.squad-pick .sqchip .sq-check{width:0;overflow:hidden;opacity:0;display:inline-grid;place-items:center;transition:.16s}
.squad-pick .sqchip .sq-check .ic{width:16px;height:16px;color:var(--ac)}
.squad-pick .sqchip:hover{border-color:var(--ac)}
.squad-pick .sqchip.on{border-color:var(--ac);color:#fff;background:color-mix(in srgb,var(--ac) 14%,rgba(255,255,255,.03));
  box-shadow:0 0 0 1px var(--ac) inset,0 6px 18px -10px var(--ac)}
.squad-pick .sqchip.on .sq-check{width:18px;opacity:1;margin-right:1px}
.squad-pick .sqchip.pop{animation:sqpop .24s ease}
@keyframes sqpop{0%{transform:scale(1)}45%{transform:scale(1.07)}100%{transform:scale(1)}}
.squad-count{font-size:12px;color:var(--dim);margin-top:11px;letter-spacing:.5px}

/* —— 9. 检举 hero：去叠加 portrait，Omen 背景作剪影；rules 不挤角 —— */
.tribunal-hero{min-height:176px}
.th-warn{position:absolute;top:11px;right:12px;z-index:3;font-size:9px;letter-spacing:2px;color:#ffd9dc;
  background:rgba(125,22,34,.55);border:1px solid var(--red);padding:4px 9px}
.th-desc{position:relative;z-index:2;font-size:13px;color:var(--soft,#b9c6d1);margin:7px 0 2px}
.th-info{max-width:64%}

/* —— 10. 我的页：身份卡新增编辑入口 + 身份标签 + 编辑器面板 —— */
.idplate{position:relative}
.id-edit{position:absolute;top:12px;right:12px;z-index:4;appearance:none;cursor:pointer;display:inline-flex;align-items:center;gap:5px;
  font-family:var(--font-t);font-size:11px;letter-spacing:.5px;color:var(--text);padding:6px 11px;
  background:rgba(10,16,22,.72);border:1px solid var(--line);backdrop-filter:blur(4px);
  clip-path:polygon(6px 0,100% 0,100% calc(100% - 6px),calc(100% - 6px) 100%,0 100%,0 6px);transition:.15s}
.id-edit:hover{border-color:var(--ac);color:#fff}
.id-edit .ic{width:14px;height:14px}
.id-tags{display:flex;flex-wrap:wrap;gap:6px;margin:7px 0 3px}
.id-pill{font-family:var(--font-t);font-size:10px;letter-spacing:.5px;color:var(--ac);padding:3px 9px;
  background:color-mix(in srgb,var(--ac) 14%,transparent);border:1px solid color-mix(in srgb,var(--ac) 38%,var(--line));border-radius:2px}

.ided{--ac:var(--mint)}
.ided-grid2{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.ided-f{display:block}
.ided-f>span{display:block;font-family:var(--font-t);font-size:10px;letter-spacing:1px;color:var(--dim);margin-bottom:5px}
.ided-f input{width:100%;background:#0c1620;border:1px solid var(--line);color:var(--text);font:inherit;font-size:14px;padding:10px 12px;outline:none;
  clip-path:polygon(7px 0,100% 0,100% calc(100% - 7px),calc(100% - 7px) 100%,0 100%,0 7px)}
.ided-f input:focus{border-color:var(--mint)}
.ided-sec{font-family:var(--font-t);font-size:11px;letter-spacing:1.5px;color:#cfe9df;margin:17px 0 9px;display:flex;align-items:center;gap:8px}
.ided-hint{color:var(--faint);letter-spacing:0;font-size:10px;font-weight:400}
.id-pickgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(54px,1fr));gap:9px}
.id-pickgrid.portraits{grid-template-columns:repeat(auto-fill,minmax(70px,1fr))}
.idtile{position:relative;appearance:none;padding:0;cursor:pointer;overflow:hidden;background:#0e1922;
  border:1px solid var(--line);aspect-ratio:1;display:grid;place-items:center;
  clip-path:polygon(7px 0,100% 0,100% calc(100% - 7px),calc(100% - 7px) 100%,0 100%,0 7px);transition:.15s}
.idtile--port{aspect-ratio:3/4}
.idtile-img{width:100%;height:100%}
.idtile-img.pa,.idtile-img .pa-img{width:100%;height:100%}
.idtile:hover{border-color:var(--mint)}
.idtile.on{border-color:var(--mint);box-shadow:0 0 0 2px var(--mint) inset,0 6px 16px -8px rgba(34,224,166,.6)}
.idtile.on::after{content:"✓";position:absolute;top:1px;right:5px;z-index:3;color:var(--mint);font-weight:700;font-size:13px;text-shadow:0 1px 3px #000}
.idtile--letter{background:linear-gradient(135deg,#16242f,#0e1922)}
.idtile-letter{font-family:var(--font-d);font-weight:700;font-size:22px;color:var(--dim)}
.idtile--upload{border-style:dashed;cursor:pointer;color:var(--dim)}
.idtile--upload:hover{border-color:var(--mint);color:var(--mint)}
.idtile-up{display:grid;place-items:center;gap:3px;text-align:center}
.idtile-up .ic{width:18px;height:18px}
.idtile-up i{font-style:normal;font-size:10px;letter-spacing:.5px}
.id-opts{display:flex;flex-wrap:wrap;gap:8px}
.id-opt{appearance:none;font:inherit;cursor:pointer;padding:8px 13px;font-size:13px;color:var(--text);
  background:rgba(255,255,255,.03);border:1px solid var(--line);transition:.15s;
  clip-path:polygon(6px 0,100% 0,100% calc(100% - 6px),calc(100% - 6px) 100%,0 100%,0 6px)}
.id-opt:hover{border-color:var(--mint)}
.id-opt.on{background:color-mix(in srgb,var(--mint) 20%,transparent);border-color:var(--mint);color:#eafff7}
.ided-actions{display:flex;gap:10px;margin-top:20px}

/* —— 8.5 最近车队 → match summary card —— */
.matchcard{display:block;width:100%;text-align:left;appearance:none;cursor:pointer;margin-bottom:10px;padding:13px 15px;
  background:var(--panel);border:1px solid var(--line);border-left:3px solid var(--line-2);transition:.15s;
  clip-path:polygon(0 0,calc(100% - 12px) 0,100% 12px,100% 100%,12px 100%,0 calc(100% - 12px))}
.matchcard:hover{transform:translateX(2px);box-shadow:0 8px 22px -14px #000}
.matchcard.res-win{border-left-color:var(--mint)}
.matchcard.res-loss{border-left-color:var(--red)}
.matchcard.res-other{border-left-color:var(--gold)}
.mc-top{display:flex;align-items:center;gap:12px}
.mc-res{flex:none;width:42px;height:42px;display:grid;place-items:center;font-family:var(--font-d);font-weight:700;font-size:16px;
  border:1px solid var(--line);clip-path:polygon(8px 0,100% 0,100% calc(100% - 8px),calc(100% - 8px) 100%,0 100%,0 8px)}
.mc-res.win{color:var(--mint);background:rgba(34,224,166,.1);border-color:rgba(34,224,166,.4)}
.mc-res.loss{color:var(--red);background:rgba(255,70,85,.1);border-color:rgba(255,70,85,.4)}
.mc-res.other{color:var(--gold);background:rgba(240,196,99,.1);border-color:rgba(240,196,99,.4)}
.mc-tt{flex:1;min-width:0}
.mc-title{font-family:var(--font-d);font-weight:600;font-size:16px;color:var(--text);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.mc-meta{font-size:11px;color:var(--dim);margin-top:2px}
.mc-cnt{flex:none;font-family:var(--font-d);font-weight:700;font-size:20px;color:var(--text)}
.mc-cnt i{font-size:10px;color:var(--dim);font-style:normal;margin-left:2px}
.mc-squad{display:flex;align-items:center;gap:5px;margin-top:11px;flex-wrap:wrap}
.mc-mem sl-avatar{--size:26px}
.mc-more{font-size:11px;color:var(--dim);margin-left:2px}

@media(max-width:900px){
  body[data-view="home"] .hero-grid{max-width:74%}
}
@media(max-width:640px){
  body[data-view="home"] .view{padding-left:14px;padding-right:14px}
  body[data-view="home"] .hero{min-height:auto;padding:18px 16px 0}
  body[data-view="home"] .hero-figure{width:82%;opacity:.26;right:-14%;
    -webkit-mask-image:linear-gradient(90deg,transparent,#000 62%);mask-image:linear-gradient(90deg,transparent,#000 62%);-webkit-mask-composite:source-over;mask-composite:add}
  .hero-grid{max-width:100%;align-items:center;text-align:center}
  .hero-grid .hero-left{text-align:center}
  .hero-meta{justify-content:center}
  .hero-deploy{align-self:center}
  .hero-deploy .deploy-wrap{align-items:center}
  .hero-modes{margin-left:-16px;margin-right:-16px;padding-left:16px;padding-right:16px}
  .hero-modes .modes{grid-template-columns:repeat(3,1fr)}
  .hero-modes .hero-hint{text-align:center}
  .ided-grid2{grid-template-columns:1fr}
  .th-info{max-width:88%}
}

/* ============================================================ frontv9 · 账号登录 ============================================================ */
/* 命令栏：登录用户 + 登出 */
.user-box{display:flex;align-items:center;gap:8px}
.ub-name{font-family:var(--font-d);font-weight:600;font-size:14px;color:var(--text);max-width:120px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.ub-out{appearance:none;cursor:pointer;font:inherit;font-size:12px;letter-spacing:.5px;color:var(--dim);padding:5px 11px;
  background:rgba(255,255,255,.03);border:1px solid var(--line);transition:.15s;
  clip-path:polygon(5px 0,100% 0,100% calc(100% - 5px),calc(100% - 5px) 100%,0 100%,0 5px)}
.ub-out:hover{border-color:var(--red);color:#fff}

/* 登录 / 注册门 */
.auth-gate{display:flex;justify-content:center;align-items:flex-start;padding:24px 0 60px}
.auth-card{width:100%;max-width:480px;position:relative;overflow:hidden;padding:26px 26px 20px;
  background:linear-gradient(150deg,#10202b,#0b1118 70%);border:1px solid var(--line);
  clip-path:polygon(16px 0,100% 0,100% calc(100% - 16px),calc(100% - 16px) 100%,0 100%,0 16px)}
.auth-brand{display:flex;align-items:center;gap:12px;margin-bottom:18px}
.auth-mark{width:46px;height:46px;flex:none;display:grid;place-items:center;font-family:var(--font-d);font-weight:700;font-size:24px;color:#fff;
  background:linear-gradient(135deg,var(--red),var(--red-deep));
  clip-path:polygon(9px 0,100% 0,100% calc(100% - 9px),calc(100% - 9px) 100%,0 100%,0 9px)}
.auth-title{font-family:var(--font-d);font-weight:700;font-size:24px;color:#fff;line-height:1}
.auth-sub{font-size:10px;letter-spacing:2px;color:var(--dim);margin-top:4px}
.auth-tabs{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-bottom:18px}
.auth-tab{appearance:none;cursor:pointer;font:inherit;font-family:var(--font-d);font-weight:600;font-size:15px;color:var(--dim);
  padding:11px 0;background:rgba(255,255,255,.03);border:1px solid var(--line);transition:.15s;
  clip-path:polygon(8px 0,100% 0,100% calc(100% - 8px),calc(100% - 8px) 100%,0 100%,0 8px)}
.auth-tab:hover{color:var(--text);border-color:var(--line-2)}
.auth-tab.on{color:#fff;border-color:var(--red);background:linear-gradient(160deg,rgba(255,70,85,.18),rgba(255,70,85,.04));box-shadow:inset 0 0 0 1px var(--red)}
.auth-body .ided-sec:first-child{margin-top:8px}
.auth-foot{text-align:center;font-size:11px;letter-spacing:.5px;color:var(--faint);margin-top:16px}
.boot-err{text-align:center;padding:18px 6px 8px}
.boot-err .be-ic{font-size:34px;line-height:1;color:var(--accent,#ff4655);filter:drop-shadow(0 0 12px rgba(255,70,85,.4))}
.boot-err .be-title{margin-top:12px;font-size:17px;font-weight:700;letter-spacing:.5px}
.boot-err .be-desc{margin-top:7px;font-size:12px;color:var(--faint);letter-spacing:.4px}
@media(max-width:520px){.auth-card{max-width:none}.auth-gate{padding:12px 0 50px}}

/* —— 首页模式：已达瓦后可改，高亮当前模式 —— */
.mode{position:relative}
.mode.on{border-color:var(--mint);background:linear-gradient(160deg,rgba(34,224,166,.16),rgba(34,224,166,.04));box-shadow:inset 0 0 0 1px var(--mint)}
.mode.on .mode-ic{color:#fff;background:var(--mint-deep);border-color:var(--mint)}
.mode.on .t{color:#eafff7}
.mode-cur{position:absolute;top:5px;right:6px;display:inline-flex;align-items:center;gap:2px;font-family:var(--font-t);font-size:9px;letter-spacing:.5px;color:var(--mint)}
.mode-cur .ic{width:11px;height:11px}

/* —— 群榜阵容头像 → 成员信息弹卡（缩小版「我的」） —— */
.lineup .lu{cursor:pointer;transition:transform .12s}
.lineup .lu:hover{transform:translateY(-2px)}
.mpop{position:fixed;z-index:120;width:248px;opacity:0;transform:translateY(-4px) scale(.97);pointer-events:none;transition:opacity .14s,transform .14s}
.mpop.show{opacity:1;transform:none;pointer-events:auto}
.mpop-card{position:relative;overflow:hidden;padding:13px 14px;
  background:linear-gradient(150deg,color-mix(in srgb,var(--ac) 16%,#0f1c26),#0b1118 72%);
  border:1px solid color-mix(in srgb,var(--ac) 40%,var(--line));border-left:3px solid var(--ac);
  box-shadow:0 14px 40px -12px #000,0 0 0 1px rgba(0,0,0,.3);
  clip-path:polygon(10px 0,100% 0,100% calc(100% - 10px),calc(100% - 10px) 100%,0 100%,0 10px)}
.mpop-head{display:flex;align-items:center;gap:10px}
.mpop-av{width:46px;height:46px;flex:none;display:grid;place-items:center;overflow:hidden;border-radius:3px;
  border:1px solid color-mix(in srgb,var(--ac) 45%,var(--line))}
.mpop-av .pa,.mpop-av .pa-img,.mpop-av .portrait{width:100%;height:100%}
.mpop-id{flex:1;min-width:0}
.mpop-name{font-family:var(--font-d);font-weight:700;font-size:17px;color:#fff;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.mpop-code{font-size:10px;letter-spacing:1px;color:var(--faint);margin-top:1px}
.mpop-call{font-family:var(--font-t);font-size:11px;letter-spacing:1px;margin-top:9px}
.mpop-motto{font-size:12px;color:var(--dim);margin-top:3px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.mpop-stats{display:grid;grid-template-columns:repeat(3,1fr);gap:6px;margin-top:11px}
.mpop-stats>div{text-align:center;padding:7px 2px;background:rgba(255,255,255,.04);border:1px solid var(--line);
  clip-path:polygon(5px 0,100% 0,100% calc(100% - 5px),calc(100% - 5px) 100%,0 100%,0 5px)}
.mpop-stats b{display:block;font-family:var(--font-d);font-weight:700;font-size:18px;color:#fff;line-height:1}
.mpop-stats b i{font-size:10px;color:var(--dim);font-style:normal}
.mpop-stats span{font-size:9px;letter-spacing:.5px;color:var(--dim)}
.mpop-rep{margin-top:10px}
.mpop-foot{margin-top:9px;font-size:11px;color:var(--soft,#9fb3bf);border-top:1px solid var(--line);padding-top:7px}

/* —— frontv9.3 微调：模式区留白 / 改模式用尽置灰 / 流水显示上限 —— */
.hero-modes{padding-bottom:20px}
body[data-view="home"] .hero{margin-bottom:18px}
.mode.spent{opacity:.42;filter:grayscale(.5)}
.mode.spent:hover{transform:none;border-color:var(--line);box-shadow:none}
.ledger-more{text-align:center;font-size:11px;color:var(--faint);letter-spacing:.5px;padding:11px 0 2px}

/* —— frontv9.4: 检举 casefile 顶部不被斜切，CASE FILE 标签完整显示 —— */
.case.dossier{clip-path:polygon(0 0,100% 0,100% calc(100% - 14px),calc(100% - 14px) 100%,0 100%);padding-top:7px}
.case.dossier::before{clip-path:polygon(0 0,100% 0,100% calc(100% - 14px),calc(100% - 14px) 100%,0 100%)}

/* —— frontv9.5: 已评价/已检举的灰化 —— */
.review-target.done{opacity:.6}
.suspect.reported{opacity:.6}
.suspect.reported .su-done{color:var(--mint)}
.su-done .ic{width:13px;height:13px;vertical-align:-2px;margin-right:2px}
.case.dossier.mine{opacity:.6}
.case.dossier.mine .case-tl,.case.dossier.mine .witness-row{filter:grayscale(.5)}
.case-mine{display:inline-flex;align-items:center;gap:4px;font-family:var(--font-t);font-size:11px;letter-spacing:.5px;color:var(--mint)}
.case-mine .ic{width:13px;height:13px}
