/* V1.1.0: compact side panels and 3D presentation controls based on 寻宝鼠.
   Existing ER IDs/events, map geometry, coordinate transforms and update loop retained. */
:root{--accent:#ff9f43;--glass:#161616b8;--glass-hi:#ffffff0d;--hair:#ffffff1a;--blur:blur(10px);--roster-w:292px;--r-lg:8px;--r-md:6px;--r-sm:4px;--shadow:0 4px 16px #0003}
body{font-family:Arial,'Microsoft YaHei',sans-serif}
#roster{right:16px;top:76px;bottom:16px;width:var(--roster-w);border:1px solid #ffffff1a;border-radius:8px;background:#161616dc;backdrop-filter:blur(10px);box-shadow:0 8px 32px #0003}
#roster .pan-head{padding:14px 16px 10px;margin:0;border-bottom:1px solid #ffffff1a;align-items:flex-start}
#pan-name{font-size:14px;font-weight:700;color:#ffffffd3}#pan-sub{font-size:10px;color:#ffffff70}
#roster .pan-title{flex-wrap:wrap;gap:6px}#roster .pan-title .sub{flex-basis:100%}
.pan-sec.ops{flex:1.7 1 0}.pan-sec.loot{flex:1 1 0}.sec-head{padding:10px 14px}.sec-t{font-size:11px;color:#ffffffa6}
.sec-t i,.grp-cnt{border-radius:30px;background:#63626270;font:10px Consolas,monospace;padding:3px 8px}
.pan-body{scrollbar-width:thin;scrollbar-color:#ffffff30 transparent}
.grp{padding:9px 14px 5px}.grp-name{font-size:11px;color:#ffffffa8}.grp-bar{height:11px;border-radius:0;box-shadow:none}
.op{padding:8px 7px;margin:0 8px 6px;gap:8px;border-radius:0;background:#0000002b;border:1px solid transparent;box-shadow:none;min-height:58px}
.op:hover{background:#00000080}.op.sel{background:#ff9f431a;border-color:#ff9f4355;box-shadow:none}
.op-av{width:32px;height:32px;min-width:32px;flex-basis:32px;border-radius:50%;padding:1px;border:1px solid #ffffff25;box-shadow:none;background:var(--c)}
.op-av img{border-radius:50%}.op-n{font-size:12px;gap:4px;line-height:1.4;flex-wrap:wrap}.op-n .hero{font-size:10px;color:#ffffff80}
.op-m{font-size:9px;line-height:1.5;color:#ffffff80}.op-d{font:600 14px Consolas,monospace}.op-d .du{font-size:9px}.op-z{font:10px Consolas,monospace}
.op-hp{height:3px;border-radius:0;background:#ffffff20}.op-hp>i{border-radius:0}.badge{border-radius:3px;font-size:9px;padding:1px 4px}.badge.bot-uncertain{color:#e9bb69;border:1px solid #e9bb6966;background:#e9bb6910}
#island{left:50%;right:auto;top:16px;transform:translateX(-50%);width:340px;min-width:0;background:#2b2828b8;border:1px solid rgba(255,159,67,.42);border-radius:999px;box-shadow:0 0 0 1px rgba(255,159,67,.20),0 0 10px 2px rgba(255,159,67,.20),0 4px 6px #0002;backdrop-filter:blur(8px)}
#island:active{transform:translateX(-50%) scale(.98)}#island.open{min-width:0;border-radius:12px}#isl-main{gap:10px;padding:9px 12px;height:24px;box-sizing:border-box;min-height:38px}
.isl-stat{gap:5px;padding-right:8px;border-right:1px solid #ffffff30}.isl-stat b{font:700 16px Consolas,monospace;color:#f6f7f9}.isl-stat i{font-size:10px;letter-spacing:1px;color:#ffffffa8}#isl-dot{width:5px;height:5px;animation:none}#isl-sep{display:none}#isl-near{font-size:10px}
/* right/top 交给 PAGE 内联那份（钉死屏幕右上角、随 --sat/--sar 走）：这里原来写死
   right:calc(var(--roster-w) + 32px)，把内联的 right:calc(var(--sar) + 12px) 覆盖掉了
   —— 2026-10-15 改工具条定位时踩的就是这个"两处样式源"的坑。 */
#viewswitch{border-radius:8px;background:#161616ad}.vs-seg{border-radius:4px}.vs,.mini-tab{border-radius:4px}.vs.on,.mini-tab.on{background:#ff9f4324;color:#ffd9a8;box-shadow:inset 0 0 0 1px #ff9f4344}
#roster-handle{right:calc(var(--roster-w) + 16px);border-radius:4px 0 0 4px;height:48px}body.roster-hidden #roster-handle{right:0}
#dock{border-radius:8px;background:#161616ba;border:1px solid #ffffff1a}.dock-head{border-bottom:1px solid #ffffff1a}.setting-row,.setting-group{border-radius:4px}
#sheet-map,.glass,#playbar{backdrop-filter:blur(10px)}#playbar{border-radius:8px;background:#161616c9}#camseg{border-radius:6px;background:#161616c9}
.gear-inline{display:inline-flex;gap:4px;vertical-align:middle}.gear-chip{display:inline-flex;align-items:center;gap:2px;color:var(--gear,#c9d1de);white-space:nowrap}.gear-chip b{font:700 9px Consolas,monospace;color:#f4f7fa}.gear-icon{display:inline-block;width:13px;height:13px;background:var(--gear,#c9d1de);-webkit-mask-position:center;-webkit-mask-repeat:no-repeat;-webkit-mask-size:contain;mask-position:center;mask-repeat:no-repeat;mask-size:contain}.gear-icon.helmet{-webkit-mask-image:url('/ui/icons/helmet.png?v=1.1.0');mask-image:url('/ui/icons/helmet.png?v=1.1.0')}.gear-icon.armor{-webkit-mask-image:url('/ui/icons/armor.png?v=1.1.0');mask-image:url('/ui/icons/armor.png?v=1.1.0')}.gear-icon.bag{-webkit-mask-image:url('/ui/icons/bag.png?v=1.1.0');mask-image:url('/ui/icons/bag.png?v=1.1.0')}.gear-icon.rig{-webkit-mask-image:url('/ui/icons/rig.png?v=1.1.0');mask-image:url('/ui/icons/rig.png?v=1.1.0')}.grb{height:18px!important;gap:5px!important;padding:0 7px!important;border-radius:999px!important;background:#080b0ee8!important;border:1px solid #ffffff16;box-shadow:0 2px 6px #0009!important}.grb .gear-chip{padding:0;background:transparent}.grb .gear-icon{width:13px;height:13px}.grb .gear-chip b{font-size:9px}
#gateway-diagnostics{background:#161616c9;border:1px solid #ffffff1a;border-radius:8px}
@media(max-width:720px){#roster{right:8px;left:auto;top:92px;bottom:70px;width:min(304px,calc(100vw - 32px));max-height:70vh}#island{left:50%;right:auto;top:10px;width:min(340px,calc(100vw - 16px))}#viewswitch{right:8px;top:54px}#roster-handle{right:calc(min(304px,100vw - 32px) + 8px)}#dock{max-width:calc(100vw - 28px)}}

/* V1.1.0: fixed category rail, independently scrolling content, compact toggles. */
:root{--tools-w:360px}
#dock{left:12px;top:12px;bottom:12px;border-radius:12px;background:#141414ed;box-shadow:0 12px 40px #0005}
#dock>.pan-head{padding:16px 16px 14px;margin:0;border-bottom:1px solid #ffffff12}
#dock>.pan-head .pan-title{font-size:15px;letter-spacing:.5px}
#dock-handle{left:calc(var(--tools-w) + 12px);height:46px;border-radius:0 6px 6px 0}
.dock-layout{display:flex;flex:1;min-height:0;overflow:hidden}
.dock-tabs{width:76px;flex:none;display:flex;flex-direction:column;gap:6px;padding:14px 7px;border-right:1px solid #ffffff0e;background:#00000029}
.dock-tabs button{border:1px solid transparent;border-radius:7px;background:transparent;color:#889eae;font:600 12px 'Microsoft YaHei',sans-serif;padding:13px 0;cursor:pointer;transition:background .15s,color .15s}
.dock-tabs button:hover{background:#ffffff09;color:#e8f2fb}
.dock-tabs button[aria-selected=true]{color:#ffc07a;background:#ff9f4316;border-color:#ff9f4332;box-shadow:inset 2px 0 #ff9f43}
.dock-tabs button:focus-visible,#dock input:focus-visible,#dock button:focus-visible,#dock select:focus-visible{outline:2px solid #ff9f43;outline-offset:2px}
.dock-content{flex:1;min-width:0;overflow:auto;overscroll-behavior:contain;scrollbar-width:thin;scrollbar-color:#ffffff25 transparent}
.dock-page{padding:17px 14px 20px}.dock-page[hidden]{display:none!important}
.dock-page-head{margin-bottom:18px}.dock-page h2{font-size:15px;font-weight:650;color:#e7f1f8;margin:0 0 6px}.dock-page-head p{font-size:11px;color:#8298a8;line-height:1.6;margin:0}
.dock-group{margin-bottom:18px}.dock-group h3{font-size:10px;letter-spacing:1px;color:#738b9d;font-weight:600;margin:0 0 9px}
.dock-controls{background:#ffffff03;border:1px solid #ffffff0c;border-radius:8px;padding:3px 10px}
#dock .dock-controls .row{margin:0;padding:11px 0;border-bottom:1px solid #ffffff08}
#dock .dock-controls .row:last-child{border-bottom:0}
#dock .row-t{font-size:12px;font-weight:500;color:#c9d9e6}#dock .row-s{font-size:10px;color:#7b92a4;line-height:1.5;margin-top:4px}
#dock .dock-controls .row-btn{width:100%;margin:0}.dock-controls .row-col{min-width:0}
.dock-switches{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:7px}
#dock .dock-switches .row{margin:0;padding:10px 8px;min-width:0;gap:5px;border-radius:7px;background:#ffffff04;border:1px solid #ffffff09;align-items:center}
#dock .dock-switches .row-col{min-width:0;flex:1}#dock .dock-switches .row-t{font-size:11px;line-height:1.5}
#dock .dock-switches .row-s{display:none}#dock .dock-switches .sw{transform:scale(.76);transform-origin:right center;flex:none;margin-left:-9px}
#dock .dock-controls .sld{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:10px 7px;padding:12px 0;margin:0;border-bottom:1px solid #ffffff08}
#dock .dock-controls .sld:last-child{border-bottom:0}
#dock .sld>span:first-child{font-size:11px!important;color:#b4c7d5!important;white-space:normal!important;grid-column:1;grid-row:1;line-height:1.5}
#dock .sld>.v{grid-column:2;grid-row:1;font:11px Consolas,monospace;color:#ffc07a;min-width:36px;text-align:right}
#dock .sld>input[type=range]{grid-column:1 / -1;grid-row:2;width:100%;min-width:0;margin:2px 0 4px;cursor:pointer;height:5px}
#dock .sld>.vs-seg{grid-column:1 / -1;display:flex;width:100%;gap:2px;background:#0000003d;padding:3px;box-sizing:border-box}
#dock .sld>.vs-seg .vs{min-width:0;flex:1;padding:7px 2px;font-size:10px}
#dock .k{font-size:11px;color:#b4c7d5}.color-setting{gap:10px}.color-swatch{display:flex;align-items:center;gap:7px;color:#ffc07a;font:10px Consolas,monospace}.color-swatch input{width:30px;height:24px;padding:0;border:1px solid #ffffff24;border-radius:5px;background:transparent;cursor:pointer}.color-swatch input::-webkit-color-swatch-wrapper{padding:2px}.color-swatch input::-webkit-color-swatch{border:0;border-radius:3px}
#dock .pick{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:6px;margin:8px 0;padding:0}#dock .pick button{padding:8px 3px;font-size:11px}
.dock-note{font-size:10px;color:#7d94a6;line-height:1.8;margin:4px 2px 0}
#dock #gateway-diagnostics{position:static!important;flex:none;max-width:none!important;max-height:145px;overflow:auto;margin:0 12px 10px;padding:9px 10px!important;font-size:10px!important;border:1px solid #ffffff10!important;background:#121212!important;border-radius:6px!important}
#dock #gateway-diagnostics summary{color:#8ba3b5;cursor:pointer}
@media(max-width:1100px) and (min-width:901px){:root{--tools-w:330px;--roster-w:270px}#island{width:320px}.dock-tabs{width:67px}.dock-page{padding:15px 10px}}
@media(max-width:900px){#dock{left:8px;right:auto;top:76px;bottom:72px;height:auto;width:min(360px,calc(100vw - 16px));max-width:calc(100vw - 16px);border-radius:12px;max-height:none}#dock-handle{left:calc(min(360px,100vw - 16px) + 8px)}.dock-tabs{width:68px}.dock-page{padding:14px 10px}.dock-tabs button{padding:13px 0}
#dock:not(.up),#roster:not(.up){transform:translateY(110vh);visibility:hidden;pointer-events:none}
#dock.up,#roster.up{transform:none;visibility:visible;pointer-events:auto}
#roster{height:auto;max-height:none;top:76px;bottom:72px}}

/* Only the left/right work panels switch theme; map and centered battle status keep their contrast. */
body.panels-light #dock,body.panels-light #roster{background:#edf3f5f2;border-color:#a8bac6;box-shadow:0 12px 34px #00131e38;color:#172732}
body.panels-light #dock>.pan-head,body.panels-light #roster .pan-head{border-color:#9badb73d}
body.panels-light #dock .pan-title,body.panels-light #roster .pan-title,body.panels-light #pan-name,body.panels-light #dock .dock-page h2{color:#172732}
body.panels-light #dock .dock-tabs{background:#dce7eb;border-color:#9fb0ba55}
body.panels-light #dock .dock-tabs button{color:#506775}body.panels-light #dock .dock-tabs button:hover{background:#fff8;color:#172732}body.panels-light #dock .dock-tabs button[aria-selected=true]{color:#b35f00;background:#ff9f431a;border-color:#ff9f4344}
body.panels-light #dock .dock-controls,body.panels-light #dock .dock-switches .row{background:#fff9;border-color:#91a8b52e}
body.panels-light #dock .row-t,body.panels-light #dock .sld>span:first-child,body.panels-light #dock .k{color:#324b5a!important}body.panels-light #dock .row-s,body.panels-light #dock .dock-page-head p,body.panels-light #dock .dock-group h3,body.panels-light #pan-sub{color:#607a89}
body.panels-light #roster .op{background:#ffffffa8;border-color:#7e929e20}body.panels-light #roster .op:hover{background:#fff}body.panels-light #roster .op-n,body.panels-light #roster .op-d{color:#182b36}body.panels-light #roster .op-m,body.panels-light #roster .grp-name,body.panels-light #roster .sec-t{color:#5b707c}
body.panels-light #dock #gateway-diagnostics{background:#e1ebef!important;border-color:#8da3af55!important;color:#304854!important}

/* V1.1.0: fixed three-column roster rows. Every normal row keeps one title,
   one metadata line and one health line, so optional fields cannot shift distance. */
:root{--roster-w:268px}
#roster .pan-head{padding:10px 12px 8px}
#roster .sec-head{padding:7px 10px 4px}
#roster .grp{padding:6px 10px 3px;gap:6px}
#roster .grp-bar{height:10px}
#roster .grp-name{font-size:10px}
#roster .grp-cnt,#roster .grp-near{font-size:9px}
#roster .op{display:grid;grid-template-columns:28px minmax(0,1fr) 40px;align-items:center;column-gap:7px;min-height:46px;box-sizing:border-box;padding:5px 6px;margin:0 6px 3px;overflow:hidden}
#roster .op.expanded{align-items:start;min-height:46px;overflow:visible}
#roster .op-av{width:28px;height:28px;min-width:28px;flex-basis:28px;font-size:10px;grid-column:1;align-self:center}
#roster .op-av.box{width:22px;height:22px;min-width:22px;margin:3px}
#roster .op-ring{inset:-2px;border-width:1px;border-radius:50%}
#roster .op-col{grid-column:2;display:grid;grid-template-rows:auto auto auto;gap:1px;min-width:0;overflow:hidden}
#roster .op.expanded .op-col{overflow:visible}
#roster .op-n{display:block;min-width:0;font-size:10.5px;line-height:13px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
#roster .op-title{display:block;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
#roster .op-n .hero{font-size:8.5px;margin-left:4px}
#roster .op-m{display:flex;align-items:center;gap:3px;height:13px;min-width:0;margin:0;font-size:8px;line-height:11px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
#roster .op-m>*{flex:none}
#roster .op-m .bags,#roster .op-m .wp{min-width:0;overflow:hidden;text-overflow:ellipsis}
#roster .op-sep{font-style:normal;color:var(--txt-3);opacity:.45}
#roster .badge{font-size:7.5px;line-height:10px;padding:0 3px;border-radius:2px}
#roster .badge.bot-confirmed{color:#ffd681;border:1px solid #e5a73180;background:#e5a73118}
#roster .gear-inline{gap:2px}.gear-chip{gap:1px}.gear-icon{width:10px;height:10px}.gear-chip b{font-size:7.5px}
#roster .op-r{grid-column:3;min-width:40px;width:40px;align-self:center;overflow:hidden}
#roster .op-d{font-size:11px;line-height:13px;white-space:nowrap}
#roster .op-d .du{font-size:7px}
#roster .op-z{font-size:8px;line-height:10px;margin:0;white-space:nowrap}
#roster .op-hp{height:2px;margin:1px 0 0}
#roster .tip-r{font-size:8px;line-height:1.35;gap:5px}

/* Make both 3D character color states visible as first-class controls. */
#dock .color-setting{min-height:43px;margin:3px 0!important;padding:7px 8px!important;border:1px solid #ffffff12!important;border-radius:6px;background:#ffffff04}
#dock .color-setting.visible{box-shadow:inset 2px 0 #49d5ff}
#dock .color-setting.occluded{box-shadow:inset 2px 0 #ff4058}
#dock .color-setting .row-t{font-size:11px;font-weight:650}
#dock .color-setting .row-s{font-size:9px;margin-top:1px}
#dock .color-swatch{gap:5px;font-size:9px}
#dock .color-swatch input{width:38px;height:28px}
body.panels-light #dock .color-setting{background:#fff9;border-color:#7f98a832!important}

@media(max-width:1100px) and (min-width:901px){:root{--roster-w:258px}}
@media(max-width:720px){:root{--roster-w:min(268px,calc(100vw - 32px))}#roster{width:var(--roster-w)}#roster-handle{right:calc(var(--roster-w) + 8px)}}

/* 容器页·类型过滤（0910）：图标+名字三列，黑=关（半透明黑罩）/橙框=开 */
.cont-typegrid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;padding:2px}
.ct-item{position:relative;display:flex;flex-direction:column;align-items:center;gap:5px;
  padding:8px 4px 6px;border:2px solid transparent;border-radius:10px;
  background:#ffffff05;cursor:pointer;user-select:none;min-width:0;
  transition:border-color .15s,background .15s,box-shadow .15s,transform .1s}
.ct-item:hover{background:#ffffff0c}
.ct-item:active{transform:scale(.95)}
.ct-item .ct-img{position:relative;width:42px;height:42px;display:block}
.ct-item .ct-img img{width:100%;height:100%;object-fit:contain;pointer-events:none;
  filter:drop-shadow(0 1px 4px #000c)}
.ct-item .ct-mask{position:absolute;inset:-2px;border-radius:9px;background:rgba(0,0,0,.55);
  pointer-events:none;transition:opacity .15s}
.ct-item .ct-name{font-size:10px;line-height:1.2;color:#7b92a4;max-width:100%;
  overflow:hidden;text-overflow:ellipsis;white-space:nowrap;text-align:center}
.ct-item.on{border-color:#ff9f43;background:#ff9f431f;box-shadow:0 0 10px #ff9f4333}
.ct-item.on .ct-mask{opacity:0}
.ct-item.on .ct-name{color:#ffd0a6}
body.panels-light .ct-item{background:#ffffffcc;border-color:#91a8b51f}
body.panels-light .ct-item.on{border-color:#ff9f43;background:#ff9f4326}
body.panels-light .ct-item .ct-name{color:#607a89}
body.panels-light .ct-item.on .ct-name{color:#b4651a}

/* 对局回放（0910）：历史对局列表 + 播放条 ±15/X 按钮 */
.replay-list{display:flex;flex-direction:column;gap:6px;padding:2px;max-height:360px;overflow:auto}
.replay-list .empty{padding:18px 10px;text-align:center;color:#7b92a4;font-size:12px}
.rl-item{display:flex;flex-direction:column;gap:2px;width:100%;text-align:left;box-sizing:border-box;
  padding:7px 10px;border:1px solid #ffffff14;border-radius:10px;background:#ffffff08;
  color:#eef1f6;font-size:11.5px;line-height:1.35;cursor:pointer;
  transition:border-color .15s,background .15s,box-shadow .15s}
.rl-item:hover{border-color:rgba(255,159,67,.5);background:#ff9f4314}
.rl-item.on{border-color:#ff9f43;background:#ff9f431f;box-shadow:0 0 10px #ff9f4333}
.rl-top{display:flex;align-items:baseline;gap:8px;min-width:0}
.rl-bot{display:flex;align-items:baseline;gap:8px;min-width:0}
.rl-id{flex:none;font-family:ui-monospace,Consolas,monospace;color:#ff9f43;letter-spacing:.3px}
.rl-map{flex:1 1 auto;font-size:14px;font-weight:600;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.rl-room{color:#8a93a2;font-size:10.5px;font-weight:500;letter-spacing:.2px;margin-left:3px}
.rl-time{flex:1 1 auto;text-align:right;color:#fff;font-size:10.5px;white-space:nowrap}
.rl-dur{flex:none;color:#fff;font-size:10.5px;white-space:nowrap}
#playbar #seektip{position:absolute;bottom:calc(100% + 7px);transform:translateX(-50%);
  background:rgba(18,22,28,.94);border:1px solid #ffffff1f;color:#9aa7b4;font-size:11px;
  padding:3px 8px;border-radius:8px;pointer-events:none;white-space:nowrap}
#playbar #seektip.hide{display:none}
#playbar #seekmark{position:absolute;top:50%;width:0;height:24px;margin-top:-12px;
  border-left:2px dashed rgba(255,159,67,.85);transform:translateX(-50%);pointer-events:none}
#playbar #seekmark.hide{display:none}
#playbar .pb{border:0;background:rgba(255,255,255,.1);color:var(--txt-2);font-size:11px;font-weight:600;
  padding:7px 8px;border-radius:9px;cursor:pointer;flex:none;transition:background .16s,color .16s}
#playbar .pb:hover{background:rgba(255,255,255,.18);color:var(--txt)}
#playbar #btn-exit{width:32px;height:32px;padding:0;border-radius:50%;flex:none;border:1px solid rgba(255,159,67,.42);
  background:rgba(255,159,67,.12);color:#ffd0a6;cursor:pointer;display:flex;align-items:center;justify-content:center;
  transition:background .16s,transform .12s}
#playbar #btn-exit:hover{background:rgba(255,159,67,.26)}
#playbar #btn-exit:active{transform:scale(.9)}
#playbar #btn-exit svg{width:13px;height:13px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round}
body.panels-light .rl-item{background:#ffffffcc;border-color:#91a8b51f;color:#22323d}
body.panels-light .rl-item:hover{border-color:rgba(255,159,67,.6);background:#ff9f431f}
body.panels-light .rl-item.on{border-color:#ff9f43;background:#ff9f4326}
body.panels-light .rl-time{color:#607a89}
body.panels-light .rl-dur{color:#607a89}
body.panels-light .rl-room{color:#7d8b99}
.rl-legacy{flex:none;color:#8a94a0;border:1px solid #ffffff1f;border-radius:6px;
  padding:0 4px;font-size:9.5px;line-height:1.5}
body.panels-light .rl-legacy{color:#7b8b98;border-color:#91a8b533}

/* ---- 物资图鉴（全屏浮层 · 2026-10-13）----
   左设置栏（分类/子类/批量勾选）+ 右卡片网格。卡片品质色走行内 --gcol。 */
#lootcat{position:fixed;left:calc(var(--tools-w) + 20px);right:16px;top:12px;bottom:12px;z-index:960;display:flex;flex-direction:column;border-radius:12px;background:#141414f5;border:1px solid #ffffff14;box-shadow:0 18px 50px #0007;overflow:hidden}
#lootcat[hidden]{display:none!important}
.lc-head{display:flex;align-items:center;gap:12px;padding:14px 16px;border-bottom:1px solid #ffffff12;flex:none}
.lc-title{font-size:15px;font-weight:600;color:#e8f2fb;letter-spacing:.5px}
.lc-sub{font-size:11px;font-weight:400;color:#7b92a4;margin-left:6px}
.lc-head-r{margin-left:auto;display:flex;align-items:center;gap:8px}
.lc-picked{font-size:11.5px;color:#ffc07a;font-variant-numeric:tabular-nums}
.lc-btn{border:1px solid #ffffff1a;background:#ffffff08;color:#c9d9e6;font:600 11.5px 'Microsoft YaHei',sans-serif;padding:6px 10px;border-radius:7px;cursor:pointer;transition:background .12s,color .12s}
.lc-btn:hover{background:#ffffff14;color:#fff}
.lc-body{flex:1;min-height:0;display:flex}
.lc-side{width:198px;flex:none;padding:14px;overflow-y:auto;overscroll-behavior:contain;border-right:1px solid #ffffff10;background:#0d0d0d80;scrollbar-width:thin;scrollbar-color:#ffffff25 transparent}
.lc-sec{margin-bottom:16px}
.lc-sec h4{margin:0 0 8px;font-size:10px;letter-spacing:1px;color:#738b9d;font-weight:600}
.lc-tabs{display:flex;flex-direction:column;gap:4px}
.lc-tab{text-align:left;border:1px solid transparent;border-radius:7px;background:#ffffff06;color:#a9bccb;font:600 12px 'Microsoft YaHei',sans-serif;padding:8px 10px;cursor:pointer;transition:background .12s,color .12s}
.lc-tab:hover{background:#ffffff10;color:#e8f2fb}
.lc-tab.on{border-color:#ff9f4355;background:#ff9f4318;color:#ffc07a}
.lc-chips{display:flex;flex-wrap:wrap;gap:5px}
.lc-chip{border:1px solid #ffffff14;border-radius:999px;background:#ffffff06;color:#93a8b8;font:500 10.5px 'Microsoft YaHei',sans-serif;padding:4px 9px;cursor:pointer;transition:color .12s,background .12s}
.lc-chip:hover{color:#e8f2fb}
.lc-chip.on{border-color:#ff9f4355;background:#ff9f4318;color:#ffc07a}
.lc-bulk{display:flex;flex-wrap:wrap;gap:6px}
.lc-note{margin:0;font-size:10.5px;line-height:1.65;color:#7b92a4}
.lc-note b{color:#ffc07a}
.lc-main{flex:1;min-width:0;overflow-y:auto;overscroll-behavior:contain;padding:14px 16px 24px;scrollbar-width:thin;scrollbar-color:#ffffff25 transparent}
.lc-toolbar{display:flex;align-items:center;gap:10px;margin-bottom:12px}
#lc-search,#rl-search{flex:1;min-width:0;background:#ffffff0a;border:1px solid #ffffff1a;border-radius:8px;color:#e8f2fb;font:13px 'Microsoft YaHei',sans-serif;padding:9px 12px;outline:none}
#lc-search:focus,#rl-search:focus{border-color:#ff9f4366}
#lc-search::placeholder,#rl-search::placeholder{color:#5d7183}
#rl-search::-webkit-search-cancel-button{-webkit-appearance:none}
.lc-hint{font-size:11px;color:#7b92a4;white-space:nowrap;font-variant-numeric:tabular-nums}
.lc-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(94px,1fr));gap:8px}
.lc-card{position:relative;display:flex;flex-direction:column;align-items:center;gap:4px;padding:8px 6px 7px;border:1px solid #ffffff12;border-radius:9px;background:#ffffff05;cursor:pointer;transition:border-color .12s,background .12s,transform .1s}
.lc-card:hover{background:#ffffff0d}
.lc-card:active{transform:scale(.97)}
.lc-card.on{border-color:#ff9f43;background:#ff9f431c;box-shadow:0 0 10px #ff9f4330}
.lc-img{position:relative;width:54px;height:54px;display:flex;align-items:center;justify-content:center}
.lc-img img{width:100%;height:100%;object-fit:contain;pointer-events:none}
.lc-img.noimg::after{content:"无图";font-size:10px;color:#5d7183}
.lc-lv{position:absolute;left:-3px;top:-3px;font:700 9px Consolas,monospace;padding:1px 4px;border-radius:5px;background:#000000c4;color:var(--gcol,#c9d1de);border:1px solid #ffffff14}
.lc-name{font-size:10.5px;line-height:1.25;color:#c9d9e6;text-align:center;max-width:100%;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;word-break:break-all}
.lc-card.on .lc-name{color:#ffd0a6}
.lc-price{font:600 10px Consolas,monospace;color:#8fa3b3;font-variant-numeric:tabular-nums}
.lc-card.on .lc-price{color:#ffc07a}
body.panels-light #lootcat{background:#f6f8fbf7;border-color:#0b1b2b1f}
body.panels-light .lc-title{color:#233746}body.panels-light .lc-sub,body.panels-light .lc-hint,body.panels-light .lc-note{color:#607a89}
body.panels-light .lc-side{background:#eef2f680;border-right-color:#0b1b2b14}
body.panels-light .lc-tab,body.panels-light .lc-chip,body.panels-light .lc-btn{background:#ffffffcc;border-color:#0b1b2b1a;color:#41596b}
body.panels-light .lc-card{background:#ffffffcc;border-color:#0b1b2b14}
body.panels-light .lc-name{color:#2f4557}
body.panels-light #lc-search,body.panels-light #rl-search{background:#ffffff;border-color:#0b1b2b26;color:#233746}
@media(max-width:720px){#lootcat{left:8px;right:8px;top:8px;bottom:8px}.lc-side{width:142px;padding:10px}.lc-grid{grid-template-columns:repeat(auto-fill,minmax(80px,1fr))}}

/* ---- 对局回放库（全屏浮层 · 2026-10-15）----
   与物资图鉴同一套版式：外壳/左栏/搜索框直接复用 .lc-* 类，只加卡片自己的样式。 */
#replaylib{position:fixed;left:calc(var(--tools-w) + 20px);right:16px;top:12px;bottom:12px;z-index:960;display:flex;flex-direction:column;border-radius:12px;background:#141414f5;border:1px solid #ffffff14;box-shadow:0 18px 50px #0007;overflow:hidden}
#replaylib[hidden]{display:none!important}
.rl-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(214px,1fr));gap:10px}
.rl-card{position:relative;display:flex;flex-direction:column;padding:0;border:1px solid #ffffff12;border-radius:10px;background:#ffffff05;overflow:hidden;cursor:pointer;text-align:left;transition:border-color .12s,background .12s,transform .1s}
.rl-card:hover{background:#ffffff0d;border-color:#ffffff26}
.rl-card:active{transform:scale(.985)}
.rl-card.on{border-color:#ff9f43;background:#ff9f431c;box-shadow:0 0 10px #ff9f4330}
.rl-thumb{display:block;height:80px;background:#0a0d14 center/cover no-repeat;opacity:.72;transition:opacity .2s}
.rl-card:hover .rl-thumb,.rl-card.on .rl-thumb{opacity:.95}
.rl-thumb.noimg{background:#0d1017}
.rl-now{position:absolute;top:6px;right:6px;padding:2px 7px;border-radius:6px;background:#ff9f43;color:#1b1200;font:700 10px 'Microsoft YaHei',sans-serif}
.rl-info{display:flex;flex-direction:column;gap:3px;padding:8px 9px 9px;min-width:0}
.rl-l1{display:flex;align-items:baseline;gap:6px;min-width:0}
.rl-map{font:600 12.5px 'Microsoft YaHei',sans-serif;color:#e8eef4;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.rl-id{flex:none;font:600 10.5px 'Microsoft YaHei',sans-serif;color:#ff9f43}
.rl-l2{font:500 11px 'Microsoft YaHei',sans-serif;color:#93a3b3;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.rl-l3{font:500 10.5px Consolas,'Microsoft YaHei',sans-serif;color:#6f7d8b;font-variant-numeric:tabular-nums}
/* 计数做成独立小角标：只写 "10.15 1"/"武器 128" 会被读成标签的一部分（用户点名）。
   图鉴的分类/子类与回放库的日期/地图切面共用这一个类。 */
.cnt-n{display:inline-block;margin-left:6px;padding:0 5px;border-radius:999px;background:#ffffff14;
  font:600 9.5px Consolas,monospace;color:#93a8b8;font-variant-numeric:tabular-nums;line-height:15px}
.lc-chip.on .cnt-n,.lc-tab.on .cnt-n{color:#ffc07a;background:#ffffff1f}
.rl-sum{display:flex;flex-direction:column;gap:5px;font-size:10.5px;line-height:1.5;color:#7b92a4}
.rl-sum span{display:flex;align-items:baseline;justify-content:space-between;gap:8px}
.rl-sum b{color:#ffc07a;font-variant-numeric:tabular-nums;font-weight:600}
body.panels-light #replaylib{background:#f6f8fbf7;border-color:#0b1b2b1f}
body.panels-light .rl-card{background:#ffffffcc;border-color:#0b1b2b14}
body.panels-light .rl-map{color:#1d2b38}
body.panels-light .rl-l2{color:#4a5f72}
body.panels-light .rl-l3{color:#6b8095}
@media(max-width:720px){#replaylib{left:8px;right:8px;top:8px;bottom:8px}.rl-grid{grid-template-columns:repeat(auto-fill,minmax(148px,1fr))}.rl-thumb{height:62px}}