/* 发条巨城 · 视觉主题
 * 参考风格：深蓝网格底 / 米白纸张 / 砖红强调 / 大字报排版 / 票号·键帽·网点·舷窗
 * 纯 CSS，零字体外链、零图片外链。
 */
:root{
  --cc-navy:#162b20; --cc-navy-d:#0b1a13; --cc-navy-l:#234130;
  --cc-paper:#f2ebd9; --cc-paper-d:#e4d9c0; --cc-paper-l:#faf5e8;
  --cc-ink:#1d1c1a; --cc-ink-2:#4b463c;
  --cc-acc:#16a34a; --cc-acc-d:#0e7134; --cc-acc-l:#4ade80; --cc-danger:#b8492e;
  --cc-gold:#c6a15c; --cc-line:#c8ba9d; --cc-blue-ink:#1b2b42;
}
html,body{margin:0;padding:0;height:100%;overflow:hidden;background:var(--cc-navy-d)}
body{font-family:"PingFang SC","Microsoft YaHei","Hiragino Sans GB",system-ui,sans-serif;
  color:var(--cc-ink);-webkit-font-smoothing:antialiased}

/* ===== 全屏舞台 ===== */
#stage{position:fixed;inset:0;z-index:1;background:var(--cc-navy-d)}
#c{display:block;width:100%;height:100%;cursor:crosshair;touch-action:none}
#cc-grain{position:fixed;inset:0;z-index:2;pointer-events:none;opacity:.32;
  background-image:radial-gradient(rgba(255,255,255,.13) .6px,transparent .6px);
  background-size:4px 4px;mix-blend-mode:overlay}
#cc-shell{position:fixed;inset:0;z-index:3;pointer-events:none;
  --cc-sens:1}
#cc-shell *{pointer-events:auto}
#cc-shell .cc-nocap,#cc-shell .cc-nocap *{pointer-events:none}

/* 顶栏（沿用站点 .topbar-app，改为本作风格） */
.topbar-app{position:fixed;top:0;left:0;right:0;z-index:30;height:0;overflow:visible;
  background:none;border:0;backdrop-filter:none}
.topbar-app a{position:absolute;top:10px;color:#e8dfc9;font-size:11px;letter-spacing:.5px;
  text-decoration:none;padding:3px 8px;background:rgba(13,26,45,.55);border:1px solid rgba(230,215,180,.28)}
.topbar-app a:hover{background:var(--cc-acc);border-color:var(--cc-acc)}
.topbar-app .home{left:14px}
.topbar-app a[href="../"]{left:150px}
.topbar-app a[href*="doc.php"]{right:14px}
[data-theme="light"] .topbar-app a{color:#f2ebd9;background:rgba(13,26,45,.7)}
.site-footer{position:fixed;bottom:0;left:0;right:0;z-index:4;font-size:10px;
  border:0;padding:2px 8px;opacity:.35;text-align:center;color:#e8dfc9;pointer-events:none;background:none}
#back-top{display:none !important}

/* ===== 通用纸张 / 按钮 / 键帽 ===== */
.cc-paper{background:var(--cc-paper);color:var(--cc-ink);position:relative;
  box-shadow:0 14px 42px rgba(0,0,0,.45),inset 0 0 0 1px rgba(60,50,30,.16);
  background-image:radial-gradient(rgba(90,75,45,.055) .7px,transparent .7px);
  background-size:5px 5px}
.cc-paper:after{content:"";position:absolute;inset:5px;border:1px solid rgba(80,65,40,.13);pointer-events:none}
.cc-title{font-weight:900;letter-spacing:-1px;line-height:1.05}
.cc-eyebrow{font-family:ui-monospace,Consolas,monospace;font-size:10px;letter-spacing:2px;
  text-transform:uppercase;opacity:.65}
.cc-red{color:var(--cc-acc)}
.cc-btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;
  background:var(--cc-acc);color:#fff5e6;border:0;cursor:pointer;
  font:900 18px/1 "PingFang SC","Microsoft YaHei",system-ui,sans-serif;letter-spacing:2px;
  padding:14px 24px;min-width:190px;box-shadow:0 6px 0 var(--cc-acc-d),0 12px 26px rgba(0,0,0,.35)}
.cc-btn:hover{background:var(--cc-acc-l)}
.cc-btn:active{transform:translateY(4px);box-shadow:0 2px 0 var(--cc-acc-d)}
.cc-btn small{font-family:ui-monospace,Consolas,monospace;font-size:10px;font-weight:600;
  letter-spacing:1px;border:1px solid rgba(255,255,255,.6);padding:3px 5px;opacity:.9}
.cc-key{display:inline-block;min-width:24px;text-align:center;padding:4px 7px;margin:0 2px;
  font:700 11px/1 ui-monospace,Consolas,monospace;color:#f2ebd9;
  background:linear-gradient(#3a3d44,#24262c);border:1px solid #55565c;border-radius:3px;
  box-shadow:0 3px 0 #14161a,inset 0 1px 0 rgba(255,255,255,.14)}
.cc-strip{position:absolute;bottom:0;left:0;right:0;height:34px;display:flex;align-items:center;
  gap:12px;padding:0 18px;background:rgba(9,17,30,.82);border-top:1px solid rgba(230,215,180,.18);
  color:#ded2b8;font-size:11px;letter-spacing:1px;z-index:12}
.cc-strip .sp{flex:1}
.cc-strip b{color:var(--cc-gold)}
.cc-topline{position:absolute;top:0;left:0;right:0;height:66px;display:flex;align-items:center;
  gap:16px;padding:0 26px;z-index:12;color:#f2ebd9}
.cc-brand{font:900 30px/1 "PingFang SC","Microsoft YaHei",system-ui,sans-serif;letter-spacing:2px;
  text-shadow:2px 2px 0 rgba(0,0,0,.35)}
.cc-brand small{display:block;font:600 9px/1.4 ui-monospace,Consolas,monospace;letter-spacing:4px;opacity:.7;margin-top:4px}
.cc-salt{margin-left:auto;font:900 16px/1 ui-monospace,Consolas,monospace;letter-spacing:1px;color:#f2ebd9}
.cc-salt span{color:var(--cc-gold);margin-right:6px}
.cc-helpdot{width:22px;height:22px;border-radius:50%;border:1px solid rgba(242,235,217,.6);
  background:transparent;color:#f2ebd9;font:700 12px/1 sans-serif;cursor:pointer}
.cc-tabs{display:flex;gap:3px;align-items:center}
.cc-tab{font:700 12px/1 "PingFang SC",system-ui,sans-serif;padding:7px 13px;cursor:pointer;
  color:#e8dfc9;background:rgba(13,26,45,.65);border:1px solid rgba(230,215,180,.22)}
.cc-tab.on{background:var(--cc-paper);color:var(--cc-ink);border-color:var(--cc-paper)}
.cc-tab:hover:not(.on){background:rgba(242,235,217,.18)}
.cc-arrow{font:700 12px/1 monospace;color:#e8dfc9;background:none;border:1px solid rgba(230,215,180,.25);
  padding:7px 8px;cursor:pointer}

/* ===== 深蓝网格底 ===== */
.cc-screen{position:absolute;inset:0;display:none;overflow:hidden;
  background-color:var(--cc-navy);
  background-image:linear-gradient(rgba(230,215,180,.055) 1px,transparent 1px),
                   linear-gradient(90deg,rgba(230,215,180,.055) 1px,transparent 1px);
  background-size:68px 68px}
.cc-screen:before{content:"";position:absolute;inset:0;pointer-events:none;
  background:radial-gradient(ellipse at 50% 40%,transparent 30%,rgba(6,14,26,.55) 100%)}
#cc-shell[data-screen="menu"] #cc-menu,
#cc-shell[data-screen="armory"] #cc-armory,
#cc-shell[data-screen="shop"] #cc-shop,
#cc-shell[data-screen="settings"] #cc-settings,
#cc-shell[data-screen="career"] #cc-career,
#cc-shell[data-screen="pause"] #cc-pause,
#cc-shell[data-screen="result"] #cc-result{display:block}

/* 菜单态把 3D 场景当作插画背景 */
#cc-shell[data-screen="menu"] #c,
#cc-shell[data-screen="armory"] #c,
#cc-shell[data-screen="shop"] #c,
#cc-shell[data-screen="settings"] #c,
#cc-shell[data-screen="career"] #c{filter:sepia(.32) saturate(.72) contrast(1.06) brightness(.9)}
#cc-screen-tint{position:absolute;inset:0;display:none;pointer-events:none;
  background:linear-gradient(90deg,rgba(13,26,45,.62),rgba(13,26,45,.08) 45%,rgba(13,26,45,.5))}
#cc-shell[data-screen="menu"] #cc-screen-tint{display:block}

/* ===== 主菜单 ===== */
.cc-menu-list{position:absolute;left:5%;top:19%;width:238px;padding:12px 12px 14px;z-index:6}
.cc-menu-item{display:flex;align-items:baseline;gap:8px;padding:9px 12px;cursor:pointer;
  border-bottom:1px solid rgba(70,58,38,.22);font-weight:800;font-size:19px;letter-spacing:1px}
.cc-menu-item small{margin-left:auto;font:500 10px/1 system-ui,sans-serif;opacity:.52;letter-spacing:0}
.cc-menu-item:hover{background:rgba(22,163,74,.14)}
.cc-menu-item.on{background:var(--cc-acc);color:#fff4e4;box-shadow:inset 4px 0 0 #0b4a22}
.cc-menu-item.on small{opacity:.85}
.cc-menu-caption{position:absolute;left:5%;top:14%;z-index:6;color:#f2ebd9;
  font:900 34px/1 system-ui,sans-serif;letter-spacing:3px;text-shadow:2px 3px 0 rgba(0,0,0,.4)}
.cc-menu-caption small{display:block;font:600 10px/1.4 ui-monospace,monospace;letter-spacing:5px;opacity:.7;margin-top:6px}
.cc-door{position:absolute;left:41%;top:14%;width:34%;height:70%;z-index:5;pointer-events:none;
  border:16px solid #7d4326;box-shadow:inset 0 0 0 4px #3a2418,0 18px 40px rgba(0,0,0,.5)}
.cc-door:before{content:"";position:absolute;left:50%;top:0;bottom:0;width:5px;background:#3a2418;opacity:.5}
.cc-mode-card{position:absolute;right:5%;top:41%;width:238px;z-index:6;padding:16px 18px;
  background:rgba(15,16,18,.92);color:#f2ebd9;border:1px solid rgba(242,235,217,.16)}
.cc-mode-card h3{margin:0 0 4px;font-size:19px;font-weight:900;letter-spacing:1px}
.cc-mode-card .cc-eyebrow{color:var(--cc-gold)}
.cc-mode-card .row{display:flex;justify-content:space-between;font-size:11px;padding:7px 0;
  border-bottom:1px dashed rgba(242,235,217,.2);opacity:.9}
.cc-mode-card .dots{text-align:center;letter-spacing:6px;color:var(--cc-gold);font-size:10px;margin:10px 0}
.cc-start{position:absolute;right:5%;bottom:12%;z-index:8}
.cc-season{position:absolute;left:5%;bottom:12%;z-index:6;color:#e8dfc9;font-size:11px;line-height:1.9;opacity:.85}
.cc-season b{display:block;font-size:17px;letter-spacing:2px}

/* ===== 卡片墙 / 军械库 / 商店 ===== */
.cc-grid{position:absolute;left:5%;top:14%;width:60%;height:68%;z-index:6;
  display:grid;gap:8px;overflow:auto;padding-right:6px}
.cc-grid::-webkit-scrollbar{width:6px}
.cc-grid::-webkit-scrollbar-thumb{background:rgba(242,235,217,.3)}
.cc-grid.g4{grid-template-columns:repeat(4,1fr)}
.cc-grid.g3{grid-template-columns:repeat(3,1fr)}
.cc-grid.g6{grid-template-columns:repeat(6,1fr)}
.cc-card{position:relative;background:rgba(242,235,217,.94);color:var(--cc-ink);
  border:1px solid rgba(30,25,15,.25);cursor:pointer;padding:8px;min-height:118px;
  box-shadow:0 6px 16px rgba(0,0,0,.3);transition:transform .12s}
.cc-card:hover{transform:translateY(-3px)}
.cc-card.on{outline:3px solid var(--cc-acc);outline-offset:-3px}
.cc-card.locked{filter:grayscale(.7) brightness(.82)}
.cc-card .no{font:600 9px/1 ui-monospace,monospace;letter-spacing:1px;opacity:.6;
  display:flex;justify-content:space-between}
.cc-card .art{height:58px;display:flex;align-items:center;justify-content:center;margin:2px 0}
.cc-card .art svg{width:96%;height:100%}
.cc-card .nm{font-weight:900;font-size:13px;letter-spacing:.5px;text-align:center}
.cc-card .pr{position:absolute;left:8px;bottom:6px;font:900 12px/1 ui-monospace,monospace;color:var(--cc-acc)}
.cc-card .badge{position:absolute;right:6px;bottom:5px;font:700 9px/1 system-ui,sans-serif;
  background:var(--cc-acc);color:#fff;padding:3px 5px}
.cc-card .badge.own{background:#3f5a45}
.cc-card .pricebar{position:absolute;left:0;right:0;top:34px;background:rgba(28,26,20,.82);
  color:#f2ebd9;text-align:center;font-size:10px;padding:2px 0;letter-spacing:1px}
/* 军械库：枪剪影大卡 */
.cc-weapon{position:relative;background:rgba(13,26,45,.35);border:1px dashed rgba(242,235,217,.3);
  cursor:pointer;padding:10px;min-height:100px;display:flex;flex-direction:column;align-items:center;
  justify-content:center;color:#f2ebd9}
.cc-weapon:hover{background:rgba(184,73,46,.22)}
.cc-weapon.on{border-style:solid;border-color:var(--cc-gold);background:rgba(198,161,92,.16)}
.cc-weapon svg{width:100%;height:70px}
.cc-weapon .nm{font-size:12px;font-weight:800;letter-spacing:1px;margin-top:4px}
.cc-weapon .sub{font:500 9px/1 ui-monospace,monospace;opacity:.6}

.cc-detail{position:absolute;right:5%;top:14%;width:27%;height:68%;z-index:6;padding:18px 20px;overflow:auto}
.cc-detail .no{font:600 10px/1 ui-monospace,monospace;letter-spacing:2px;opacity:.6;
  display:flex;justify-content:space-between;border-bottom:1px solid rgba(70,58,38,.35);padding-bottom:8px}
.cc-detail .hero{height:150px;display:flex;align-items:center;justify-content:center;margin:12px 0}
.cc-detail .hero svg{width:72%;height:100%}
.cc-detail h2{margin:0 0 8px;font:900 30px/1.1 system-ui,sans-serif;letter-spacing:1px}
.cc-detail .tags{display:flex;gap:6px;margin:8px 0}
.cc-detail .tags i{font-style:normal;font-size:10px;padding:3px 7px;background:#d8c9a5;
  border:1px solid rgba(70,58,38,.35);font-weight:700}
.cc-detail p{font-size:12px;line-height:1.9;color:var(--cc-ink-2)}
.cc-detail .price{font:900 26px/1 ui-monospace,monospace;margin:14px 0 0}
.cc-detail .price span{color:var(--cc-acc)}
.cc-detail .stat{display:flex;justify-content:space-between;font-size:11px;padding:5px 0;
  border-bottom:1px dashed rgba(70,58,38,.3)}
.cc-detail .stat i{font-style:normal;font-weight:800}
.cc-buy{position:absolute;right:5%;bottom:11%;z-index:8}

/* ===== 设置 ===== */
.cc-set-left{position:absolute;left:5%;top:15%;width:56%;height:70%;z-index:6;
  padding:24px 28px;overflow:auto}
.cc-set-right{position:absolute;right:5%;top:15%;width:27%;height:70%;z-index:6;
  padding:20px;overflow:auto}
.cc-set-row{margin-bottom:22px}
.cc-set-row h4{margin:0 0 10px;font:900 20px/1 system-ui,sans-serif;letter-spacing:1px}
.cc-scale{display:flex;gap:4px;flex-wrap:wrap}
.cc-scale i{font-style:normal;width:34px;height:26px;display:flex;align-items:center;justify-content:center;
  font:700 10px/1 ui-monospace,monospace;cursor:pointer;border:1px solid rgba(70,58,38,.35);
  background:linear-gradient(rgba(255,255,255,.5),rgba(190,175,145,.5))}
.cc-scale i.on{background:var(--cc-acc);color:#fff;border-color:var(--cc-acc-d)}
.cc-swatches{display:flex;gap:10px;flex-wrap:wrap}
.cc-swatches i{font-style:normal;width:58px;height:48px;cursor:pointer;border:2px solid transparent;
  background-size:9px 9px;box-shadow:inset 0 0 0 1px rgba(70,58,38,.3)}
.cc-swatches i.on{border-color:var(--cc-acc)}
.cc-opt{display:inline-flex;align-items:center;gap:6px;margin:0 10px 8px 0;cursor:pointer;font-size:12px;font-weight:700}
.cc-opt input{accent-color:var(--cc-acc)}
.cc-range{width:100%;accent-color:var(--cc-acc)}
.cc-keypad{display:grid;grid-template-columns:repeat(4,1fr);gap:7px;background:#7d4326;padding:12px;
  border:5px solid #5d3019;box-shadow:inset 0 0 0 2px #3a2418}
.cc-keypad .cc-key{display:flex;align-items:center;justify-content:center;height:38px;font-size:13px;margin:0}
.cc-keypad .wide{grid-column:span 2}
.cc-bindlist{position:absolute;left:46%;top:16%;width:38%;z-index:8;padding:18px 20px;
  transform:rotate(-3deg);box-shadow:0 20px 40px rgba(0,0,0,.5)}
.cc-bindlist .row{display:flex;align-items:center;justify-content:space-between;gap:8px;
  padding:5px 0;border-bottom:1px solid rgba(22,163,74,.32);font-size:13px;font-weight:800}
.cc-bindlist .row .cc-key{cursor:pointer;min-width:66px}
.cc-bindlist .row .cc-key.listening{background:var(--cc-acc);color:#fff}
.cc-portholes{display:flex;gap:18px;justify-content:center;margin:10px 0 20px}
.cc-port{width:44%;aspect-ratio:1;border-radius:50%;border:13px solid var(--cc-gold);
  box-shadow:inset 0 0 0 6px #1a1a1a,0 8px 24px rgba(0,0,0,.4);overflow:hidden;position:relative;
  background:linear-gradient(#e9dcc0 0 52%,#c9a98d 52% 62%,#e6dcc6 62%)}
.cc-port:before{content:"";position:absolute;left:8%;right:8%;top:44%;height:5px;background:#8a4a2c;
  box-shadow:0 12px 0 #6d3a22}
.cc-port:after{content:"";position:absolute;right:16%;top:22%;width:16%;height:22%;background:#8a4a2c}
.cc-port span{position:absolute;top:6%;left:8%;background:var(--cc-paper);padding:3px 8px;
  font:900 18px/1 system-ui,sans-serif;transform:rotate(-8deg)}
.cc-ratio{display:flex;gap:18px;justify-content:center;font:900 18px/1.6 ui-monospace,monospace}
.cc-ratio b{cursor:pointer;color:var(--cc-acc)}
.cc-preview{height:190px;border:1px solid rgba(70,58,38,.35);position:relative;overflow:hidden;
  background:linear-gradient(#e9dcc0 0 52%,#bb8f7d 52% 60%,#e6dcc6 60%)}
.cc-preview:before{content:"";position:absolute;left:0;right:0;top:40%;height:4px;background:#8a4a2c}
.cc-preview:after{content:"";position:absolute;right:12%;top:20%;width:18%;height:32%;background:#8a4a2c}
.cc-preview .cross{position:absolute;color:var(--cc-ink);font:700 13px/1 monospace}
.cc-crossbox{display:flex;gap:8px;flex-wrap:wrap;margin-top:14px}
.cc-crossbox i{font-style:normal;width:52px;height:46px;border:1px solid rgba(70,58,38,.4);
  cursor:pointer;display:flex;align-items:center;justify-content:center;background:rgba(255,255,255,.35)}
.cc-crossbox i.on{border:3px solid var(--cc-acc)}

/* ===== 暂停 ===== */
.cc-pause-mask{position:absolute;inset:0;background:rgba(9,17,30,.55);z-index:4}
.cc-pause-list{position:absolute;left:4%;top:9%;width:230px;z-index:6;padding:14px 12px}
.cc-pause-list h2{margin:0 0 6px;font:900 38px/1 system-ui,sans-serif;letter-spacing:2px}
.cc-pause-list .cc-menu-item{font-size:17px;padding:8px 10px}
.cc-pause-panel{position:absolute;left:26%;top:9%;width:48%;height:76%;z-index:6;padding:22px 26px;overflow:auto}
.cc-pause-panel h3{margin:0 0 12px;font:900 22px/1 system-ui,sans-serif}
.cc-pause-panel p{font-size:13px;line-height:1.9}

/* ===== 生涯 / 结算 ===== */
.cc-result-card{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);
  width:min(560px,90vw);z-index:8;padding:30px 34px}
.cc-result-card h2{margin:0 0 6px;font:900 40px/1 system-ui,sans-serif;letter-spacing:2px}
.cc-result-card .cc-eyebrow{margin-bottom:18px}
.cc-scores{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin:18px 0}
.cc-scores div{border:1px solid rgba(70,58,38,.3);padding:10px;text-align:center}
.cc-scores b{display:block;font:900 26px/1 ui-monospace,monospace;color:var(--cc-acc)}
.cc-scores span{font-size:10px;letter-spacing:1px;opacity:.7}
.cc-result-card .cc-btn{width:100%;margin-top:8px}

/* ===== 战斗 HUD ===== */
#cc-hud{position:absolute;inset:0;display:none;z-index:7;pointer-events:none !important}
#cc-shell[data-screen="play"] #cc-hud{display:block}
/* HUD 是全屏层，必须让鼠标事件穿透到画布，否则点不到画布就没法开枪 */
#cc-hud *{pointer-events:none !important}
#cc-phase .cc-btn,#cc-phase .cc-tab{pointer-events:auto !important}
#cc-hud .cc-nocap,#cc-hud .cc-nocap *{pointer-events:none}
.cc-hud-block{position:absolute;background:rgba(13,26,45,.72);border:1px solid rgba(230,215,180,.28);
  color:#f2ebd9;padding:8px 12px;font-size:11px;letter-spacing:.5px}
.cc-hud-tl{top:56px;left:16px;min-width:210px}
.cc-hud-tl b{display:block;font:900 16px/1.4 system-ui,sans-serif;letter-spacing:1px;color:var(--cc-gold)}
.cc-hud-tr{top:56px;right:16px;text-align:right}
.cc-hud-tr b{font:900 16px/1 ui-monospace,monospace;color:var(--cc-gold)}
.cc-hud-bl{bottom:52px;left:16px;width:230px}
.cc-hpbar{height:9px;background:rgba(242,235,217,.2);margin:6px 0 4px}
.cc-hpbar i{display:block;height:100%;background:var(--cc-acc);transition:width .15s}
.cc-hud-br{bottom:46px;right:20px;text-align:right}
.cc-ammo{font:900 46px/1 ui-monospace,Consolas,monospace;color:var(--cc-paper);
  text-shadow:3px 3px 0 rgba(0,0,0,.5);letter-spacing:-2px}
.cc-ammo small{font-size:22px;opacity:.65}
.cc-wname{font:800 12px/1.6 system-ui,sans-serif;letter-spacing:2px;color:var(--cc-gold);text-align:right}
.cc-reload{height:4px;background:rgba(242,235,217,.25);margin-top:5px;width:150px;margin-left:auto}
.cc-reload i{display:block;height:100%;background:var(--cc-gold)}
#cc-crosshair{position:absolute;left:50%;top:50%;width:40px;height:40px;transform:translate(-50%,-50%);
  z-index:9;pointer-events:none;display:none}
#cc-shell[data-screen="play"] #cc-crosshair{display:block}
#cc-crosshair svg{width:100%;height:100%;overflow:visible}
#cc-hitmark{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%) scale(1.4);
  font:900 20px/1 monospace;color:#fff;opacity:0;z-index:10;pointer-events:none;
  text-shadow:0 0 8px var(--cc-acc);transition:opacity .1s}
#cc-hitmark.show{opacity:1;transform:translate(-50%,-50%) scale(1)}
#cc-damage{position:absolute;inset:0;z-index:8;pointer-events:none;opacity:0;
  background:radial-gradient(ellipse at center,transparent 40%,rgba(190,55,40,.62) 100%);
  transition:opacity .18s}
#cc-damage.show{opacity:1}
#cc-killfeed{position:absolute;top:120px;right:16px;z-index:8;text-align:right;
  color:#f2ebd9;font:700 12px/1.7 system-ui,sans-serif;text-shadow:1px 1px 2px #000}
#cc-killfeed div{background:rgba(13,26,45,.6);padding:2px 8px;margin-bottom:3px;display:inline-block}
#cc-toast{position:absolute;left:50%;bottom:120px;transform:translateX(-50%);z-index:11;
  background:rgba(13,26,45,.9);color:#f2ebd9;padding:9px 18px;font-size:13px;
  border-left:4px solid var(--cc-acc);opacity:0;transition:opacity .25s;pointer-events:none}
#cc-toast.show{opacity:1}
.cc-hud-hint{position:absolute;bottom:12px;left:50%;transform:translateX(-50%);
  font-size:10px;color:rgba(242,235,217,.55);letter-spacing:1px;white-space:nowrap}
.cc-phase{position:absolute;left:50%;top:16%;transform:translateX(-50%);z-index:9;text-align:center;
  color:#f2ebd9;pointer-events:none}
.cc-phase b{display:block;font:900 32px/1.2 system-ui,sans-serif;letter-spacing:4px;
  text-shadow:2px 3px 0 rgba(0,0,0,.5)}
.cc-phase span{font-size:12px;letter-spacing:2px;opacity:.85}
.cc-phase .cc-btn{margin-top:14px;pointer-events:auto;font-size:14px;padding:10px 18px;min-width:150px}

/* ===== 对话 ===== */
#cc-dialog{position:absolute;left:50%;bottom:9%;transform:translateX(-50%);z-index:14;
  width:min(680px,92vw);padding:20px 26px;display:none}
#cc-shell[data-dialog="1"] #cc-dialog{display:block}
#cc-dialog .who{font:900 13px/1 system-ui,sans-serif;letter-spacing:3px;color:var(--cc-acc);margin-bottom:10px}
#cc-dialog .txt{font-size:16px;line-height:1.9;min-height:62px;font-weight:600}
#cc-dialog .next{text-align:right;font:600 10px/1 ui-monospace,monospace;opacity:.6;margin-top:10px}

/* ===== 帮助 / 移动端 ===== */
#cc-help{position:absolute;inset:0;z-index:20;display:none;background:rgba(9,17,30,.9);
  overflow:auto;padding:5vh 6vw}
#cc-help.on{display:block}
.cc-help-card{max-width:860px;margin:0 auto;padding:28px 34px}
.cc-help-card h2{margin:0 0 14px;font:900 30px/1 system-ui,sans-serif}
.cc-help-card h3{margin:20px 0 8px;font:900 17px/1 system-ui,sans-serif;color:var(--cc-acc)}
.cc-help-card table{width:100%;border-collapse:collapse;font-size:13px}
.cc-help-card td{border-bottom:1px solid rgba(70,58,38,.25);padding:7px 8px;line-height:1.7}
.cc-help-card .close{float:right;background:none;border:0;font-size:22px;cursor:pointer;color:var(--cc-ink)}
#cc-mobile{position:absolute;inset:0;z-index:30;display:none;align-items:center;justify-content:center;
  background:rgba(9,17,30,.95);color:#f2ebd9;text-align:center;padding:30px;font-size:15px;line-height:2}
#cc-mobile .box{max-width:420px}
#cc-mobile .cc-btn{margin-top:18px;font-size:14px}

/* ===== 响应式 ===== */
@media (max-width:1000px){
  .cc-grid{width:60%}.cc-detail{width:31%}
  .cc-menu-list{width:210px;left:3%}.cc-door{left:36%;width:38%}
  .cc-mode-card{right:3%;width:200px}
}
@media (max-width:760px){
  .cc-grid,.cc-detail,.cc-set-left,.cc-set-right,.cc-pause-panel,.cc-bindlist{position:static;width:auto;height:auto}
  .cc-screen{overflow:auto;padding:70px 14px 46px}
  .cc-detail,.cc-set-right{margin-top:12px}
  .cc-buy,.cc-start,.cc-btn{position:static;margin-top:12px}
  .cc-strip{position:fixed}
  .cc-door,.cc-menu-caption,.cc-season,.cc-mode-card{display:none}
  .cc-menu-list{position:static;width:auto;margin:0 auto}
  .cc-hud-tl,.cc-hud-tr{top:48px;font-size:10px;min-width:0}
  .cc-ammo{font-size:32px}
}

/* ============================================================
   v4.0 追加：绿色主题精修 / 雷达 / 报纸结算 / 设置页画风
   （放在文件末尾，同名规则覆盖前面的基础定义）
   ============================================================ */
:root{
  --cc-acc:#16a34a; --cc-acc-d:#0e7134; --cc-acc-l:#4ade80; --cc-danger:#b8492e;
  --cc-navy:#162b20; --cc-navy-d:#0b1a13; --cc-navy-l:#234130;
  --cc-paper:#f2ebd9; --cc-ink:#1d241f;
}
.cc-screen{background-color:var(--cc-navy);
  background-image:linear-gradient(rgba(198,225,205,.055) 1px,transparent 1px),
                   linear-gradient(90deg,rgba(198,225,205,.055) 1px,transparent 1px)}
.cc-paper{background-color:var(--cc-paper);
  background-image:radial-gradient(rgba(60,90,65,.07) .7px,transparent .7px),
                   repeating-linear-gradient(0deg,rgba(80,95,70,.03) 0 1px,transparent 1px 5px);
  background-size:5px 5px,100% 5px}
.cc-btn{background:var(--cc-acc);box-shadow:0 6px 0 var(--cc-acc-d),0 12px 26px rgba(0,0,0,.35)}
.cc-btn:hover{background:var(--cc-acc-l);color:#0b2415}
.cc-tab.on{background:var(--cc-paper);color:var(--cc-ink)}
.cc-menu-item.on{background:var(--cc-acc);box-shadow:inset 4px 0 0 var(--cc-acc-d)}
.cc-menu-item:hover{background:rgba(22,163,74,.14)}
.cc-card.on{outline:3px solid var(--cc-acc)}
.cc-card .pr,.cc-detail .price span,.cc-scores b,.cc-weapon.on{color:var(--cc-acc-d);border-color:var(--cc-acc)}
.cc-card .badge{background:var(--cc-acc)}
.cc-scale i.on,.cc-opt input,.cc-range{accent-color:var(--cc-acc)}
.cc-scale i.on{background:var(--cc-acc);border-color:var(--cc-acc-d)}

/* ---- HUD 顶栏：波次 / 计时 / 点位 / 连杀（仿参考图比分条） ---- */
#cc-scorebar{position:absolute;top:42px;left:50%;transform:translateX(-50%);z-index:9;
  display:flex;align-items:center;gap:13px;padding:7px 16px;white-space:nowrap;
  background:rgba(11,26,19,.88);border:1px solid rgba(230,215,180,.24);
  color:#f2ebd9;font:900 14px/1 ui-monospace,Consolas,monospace;letter-spacing:1px}
#cc-scorebar .sb-side{font:700 11px/1 system-ui,sans-serif;letter-spacing:2px;opacity:.82}
#cc-scorebar .sb-mid{display:flex;gap:12px;align-items:baseline}
#cc-scorebar .sb-mid b{font-size:16px}
#cc-scorebar .sb-mid i{font-style:normal;font-size:15px;color:var(--cc-acc-l)}
#cc-scorebar .sb-dots{display:flex;gap:4px}
#cc-scorebar .sb-dots i{width:9px;height:9px;border-radius:50%;border:1px solid rgba(242,235,217,.5)}
#cc-scorebar .sb-dots i.on{background:var(--cc-acc);border-color:var(--cc-acc-l)}
#cc-scorebar .sb-streak{font:900 11px/1 system-ui,sans-serif;color:var(--cc-acc-l)}
.cc-hud-tl{top:206px;left:16px}

/* ---- 六边形雷达 ---- */
#cc-radar-box{position:absolute;top:50px;left:16px;z-index:9;width:132px;
  filter:drop-shadow(0 7px 16px rgba(0,0,0,.55))}
#cc-radar{display:block;width:132px;height:132px;background:rgba(11,26,19,.9);
  clip-path:polygon(50% 0,93% 25%,93% 75%,50% 100%,7% 75%,7% 25%)}
.radar-cap{text-align:center;font:900 10px/1.7 system-ui,sans-serif;letter-spacing:3px;
  color:#f2ebd9;background:rgba(11,26,19,.82);width:100px;margin:0 auto}
#cc-shell[data-screen="play"] #cc-radar-box{display:block}
#cc-shell:not([data-screen="play"]) #cc-radar-box{display:none}
#cc-shell[data-radar="off"] #cc-radar-box{display:none}

/* ---- 准星：扩散 / 机瞄 ---- */
#cc-crosshair{transition:transform .09s ease-out;transform:translate(-50%,-50%)}
#cc-crosshair.spread{transform:translate(-50%,-50%) scale(1.45)}
#cc-crosshair.ads{transform:translate(-50%,-50%) scale(.55)}
#cc-hitmark.head{font-size:28px;color:#ffd66a}

/* ---- 报纸式结算（《盐场日报》） ---- */
.cc-paper-sheet{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);
  width:min(900px,94vw);max-height:88vh;overflow:auto;padding:24px 30px 28px;
  background:#f2ebd9;color:#1d241f;border:1px solid #b7aa8c;
  box-shadow:0 22px 66px rgba(0,0,0,.65);
  background-image:repeating-linear-gradient(0deg,rgba(70,90,65,.045) 0 1px,transparent 1px 5px),
                   radial-gradient(circle at 20% 10%,rgba(120,110,80,.10),transparent 45%)}
.cc-paper-sheet:before{content:"";position:absolute;inset:9px;border:2px solid rgba(40,55,40,.6);pointer-events:none}
.cc-paper-sheet:after{content:"";position:absolute;inset:13px;border:1px solid rgba(40,55,40,.25);pointer-events:none}
.news-head{display:flex;justify-content:space-between;align-items:center;
  border-bottom:3px double #1d241f;padding-bottom:8px;position:relative;z-index:1}
.news-head b{font:900 34px/1 "Songti SC","SimSun",serif;letter-spacing:8px}
.news-head .stamp{border:3px solid var(--cc-danger);color:var(--cc-danger);
  font:900 17px/1 "Songti SC",serif;padding:6px 10px;transform:rotate(-7deg);letter-spacing:3px}
.news-kicker{font-size:11px;letter-spacing:3px;margin:9px 0 16px;color:#4b5a4c;position:relative;z-index:1}
.news-body{display:grid;grid-template-columns:1.05fr .95fr;gap:20px;position:relative;z-index:1}
.news-title{font:900 52px/1.08 "Songti SC","SimSun",serif;letter-spacing:2px;margin:0 0 14px}
.news-title.win{color:var(--cc-acc-d)}
.news-lead{font-size:13px;line-height:2;border-bottom:1px solid rgba(40,55,40,.3);padding-bottom:10px;margin-bottom:12px}
.news-score{display:flex;border-top:2px solid #1d241f;border-bottom:2px solid #1d241f}
.news-score div{flex:1;text-align:center;padding:9px 0;border-right:1px solid rgba(40,55,40,.28)}
.news-score div:last-child{border-right:0}
.news-score b{display:block;font:900 38px/1 ui-monospace,Consolas,monospace}
.news-score span{font-size:10px;letter-spacing:2px}
.news-table{width:100%;border-collapse:collapse;font-size:12px;margin-top:12px}
.news-table td{border-bottom:1px solid rgba(40,55,40,.22);padding:5px 6px}
.news-table td:last-child{text-align:right;font-weight:800}
.news-photo{min-height:230px;border:2px solid #1d241f;position:relative;overflow:hidden;
  background:repeating-linear-gradient(135deg,rgba(60,80,55,.10) 0 6px,transparent 6px 12px),#e6dcc4}
.news-photo .halftone{position:absolute;inset:0;
  background-image:radial-gradient(rgba(40,55,40,.35) 1px,transparent 1px);background-size:6px 6px;opacity:.6}
.news-photo .figure{position:absolute;left:50%;bottom:0;transform:translateX(-50%);
  width:96px;height:190px;background:#20261f;
  clip-path:polygon(38% 0,62% 0,66% 8%,84% 8%,88% 16%,72% 20%,70% 34%,82% 42%,78% 58%,88% 100%,12% 100%,22% 58%,18% 42%,30% 34%,28% 20%,12% 16%,16% 8%,34% 8%)}
.news-photo .hat{position:absolute;left:50%;bottom:172px;transform:translateX(-50%);
  width:120px;height:14px;background:#20261f;border-radius:50%}
.news-photo .mvp{position:absolute;left:10px;bottom:10px;background:#20261f;color:#f2ebd9;
  padding:6px 10px;font:900 12px/1 system-ui,sans-serif;letter-spacing:2px}
.news-photo .seal{position:absolute;right:14px;bottom:16px;border:3px solid var(--cc-danger);
  color:var(--cc-danger);font:900 20px/1 "Songti SC",serif;padding:9px 11px;transform:rotate(-12deg);letter-spacing:2px}
.news-photo .caption{position:absolute;left:10px;top:10px;font-size:10px;letter-spacing:2px;color:#3c4a3e}
.news-actions{display:flex;gap:8px;margin-top:18px;flex-wrap:wrap;position:relative;z-index:1}
.news-actions .cc-btn{min-width:170px;font-size:15px;padding:11px 18px}
@media(max-width:760px){.news-body{grid-template-columns:1fr}.news-title{font-size:36px}.news-head b{font-size:24px}}

/* ---- 设置页：皮革缝线 / 舷窗 / 灰阶 / 网点 / 声音雷达 ---- */
.cc-leather{background:#11261c;position:relative;border-radius:12px;
  background-image:repeating-linear-gradient(90deg,rgba(255,255,255,.022) 0 1px,transparent 1px 30px),
                   radial-gradient(ellipse at 50% 45%,transparent 55%,rgba(0,0,0,.45));
  border:2px solid rgba(198,161,92,.28)}
.cc-leather:before{content:"";position:absolute;inset:7px;border:1px dashed rgba(198,161,92,.4);
  border-radius:8px;pointer-events:none}
.cc-port{border:14px solid #c6a15c;box-shadow:inset 0 0 0 6px #18211a,0 10px 28px rgba(0,0,0,.5)}
.cc-port:before{box-shadow:0 12px 0 #6a4a28}
.cc-port:after{background:#7a4a2c}
.cc-port .screw{position:absolute;width:8px;height:8px;border-radius:50%;background:#e4c98a;
  box-shadow:inset -1px -1px 0 #6a5228}
.cc-port .s1{top:2%;left:48%}.cc-port .s2{bottom:2%;left:48%}
.cc-port .s3{top:48%;left:2%}.cc-port .s4{top:48%;right:2%}
.cc-grad{display:flex;gap:2px;margin:8px 0}
.cc-grad i{font-style:normal;flex:1;height:34px;border:1px solid rgba(40,55,40,.25);
  display:flex;align-items:flex-end;justify-content:center;font:700 9px/1.4 monospace;color:#4b5a4c}
.cc-grad i.on{outline:3px solid var(--cc-acc);outline-offset:1px}
.cc-dotgrid{display:flex;gap:8px;flex-wrap:wrap;margin:8px 0}
.cc-dotgrid i{font-style:normal;width:52px;height:52px;border:2px solid transparent;cursor:pointer;
  background-color:#e8e0cb;background-image:radial-gradient(rgba(25,40,25,.85) 1.4px,transparent 1.4px)}
.cc-dotgrid i.on{border-color:var(--cc-acc)}
.cc-lineweight{display:flex;gap:3px;align-items:flex-end;margin:8px 0}
.cc-lineweight i{font-style:normal;flex:1;height:30px;cursor:pointer;display:flex;align-items:center;
  justify-content:center;border-bottom:2px solid rgba(40,55,40,.25);font:700 9px/1 monospace;color:#4b5a4c}
.cc-lineweight i b{display:block;width:100%;background:#1d241f}
.cc-lineweight i.on{border-bottom-color:var(--cc-acc)}
.cc-cb-swatches{display:flex;gap:8px;flex-wrap:wrap;margin:8px 0}
.cc-cb-swatches i{font-style:normal;width:62px;height:52px;cursor:pointer;border:2px solid transparent;
  position:relative;box-shadow:inset 0 0 0 1px rgba(40,55,40,.25)}
.cc-cb-swatches i.on{border-color:var(--cc-acc)}
.cc-cb-swatches i span{position:absolute;bottom:2px;left:0;right:0;text-align:center;
  font:700 9px/1.3 system-ui,sans-serif;color:#1d241f;background:rgba(242,235,217,.85)}
.cc-sound-radar{position:relative;height:230px;border:1px solid rgba(40,55,40,.25);overflow:hidden;
  background:radial-gradient(circle at 50% 50%,rgba(22,163,74,.08) 0 20%,transparent 21%),
             repeating-radial-gradient(circle at 50% 50%,transparent 0 27px,rgba(40,55,40,.16) 27px 28px),
             #eee7d3}
.cc-sound-radar .core{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);
  width:38px;height:58px;background:#20261f;border-radius:40% 40% 20% 20%}
.cc-sound-radar .flag{position:absolute;right:12%;top:16%;font-size:22px;color:var(--cc-acc-d)}
.cc-sound-radar .tag{position:absolute;background:#f7f1e0;border:1px solid rgba(40,55,40,.35);
  padding:3px 7px;font:700 11px/1.3 system-ui,sans-serif}
.cc-sound-radar .t1{left:8%;top:16%}.cc-sound-radar .t2{right:9%;bottom:16%}
.cc-sound-radar .t3{left:8%;bottom:16%}.cc-sound-radar .t4{left:48%;top:8%}
.cc-tape{position:absolute;width:76px;height:22px;background:rgba(226,208,158,.75);
  box-shadow:0 2px 5px rgba(0,0,0,.2);transform:rotate(-8deg)}
.cc-stamp-mini{display:inline-block;border:2px solid var(--cc-danger);color:var(--cc-danger);
  font:900 11px/1.3 "Songti SC",serif;padding:4px 7px;transform:rotate(-7deg);letter-spacing:2px}

/* ---- 地图选择卡 ---- */
.cc-map-card{position:relative}
.cc-map-thumb{height:86px;border:2px solid rgba(242,235,217,.35);background:#0f2018;
  position:relative;overflow:hidden;margin:8px 0}
.cc-map-thumb svg{width:100%;height:100%}
.cc-map-nav{display:flex;align-items:center;justify-content:space-between;gap:6px;margin:6px 0}
.cc-map-nav button{background:rgba(242,235,217,.1);border:1px solid rgba(242,235,217,.3);
  color:#f2ebd9;font:900 14px/1 monospace;padding:5px 9px;cursor:pointer}
.cc-map-nav button:hover{background:var(--cc-acc)}
.cc-map-nav .idx{font:900 12px/1 monospace;color:var(--cc-acc-l);letter-spacing:2px}
.cc-diff-row{display:flex;gap:4px;margin-top:8px}
.cc-diff-row button{flex:1;font:700 11px/1 system-ui,sans-serif;padding:6px 2px;cursor:pointer;
  background:rgba(242,235,217,.08);border:1px solid rgba(242,235,217,.25);color:#ded2b8}
.cc-diff-row button.on{background:var(--cc-acc);border-color:var(--cc-acc);color:#fff}
.cc-map-tip{font-size:10px;line-height:1.7;opacity:.72;margin-top:8px}

/* ---- 暂停「外观」选项网格（仿参考图）. ---- */
.cc-cos-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin-top:10px}
.cc-cos-card{border:2px solid rgba(40,55,40,.25);background:rgba(255,255,255,.35);
  padding:6px;cursor:pointer;position:relative}
.cc-cos-card.on{border-color:var(--cc-acc);background:rgba(22,163,74,.13)}
.cc-cos-card .art{height:52px;background:#20261f;display:flex;align-items:center;justify-content:center;
  color:#f2ebd9;font-size:20px;overflow:hidden}
.cc-cos-card .nm{font:800 11px/1.5 system-ui,sans-serif;text-align:center;margin-top:4px}
.cc-cos-card .st{font:700 9px/1.4 monospace;text-align:center;color:var(--cc-acc-d)}
.cc-cos-card.locked{opacity:.45}
.cc-cos-group{margin-bottom:14px}
.cc-cos-group h4{margin:0 0 5px;font:900 15px/1 system-ui,sans-serif}
.cc-cos-group .hint{font:500 9px/1.5 monospace;opacity:.6;letter-spacing:1px}

/* ---- 设置页整体纸张感增强 ---- */
.cc-set-left,.cc-set-right{border:1px solid #b7aa8c}
.cc-set-left:after,.cc-set-right:after,.cc-pause-panel:after,.cc-bindlist:after{
  content:"";position:absolute;inset:5px;border:1px solid rgba(40,55,40,.14);pointer-events:none}
.cc-bindlist{border-left:5px solid var(--cc-acc)}
.cc-set-row h4{border-left:5px solid var(--cc-acc);padding-left:9px}