/* Seven shared counter layouts, shown at 1:1 in the inspector and the game. */
.inspect-hud-preview{position:absolute;left:24px;bottom:152px;z-index:3;display:grid;gap:7px;width:max-content;max-width:calc(100% - 48px);pointer-events:none}
.inspect-hud-preview[hidden]{display:none}
.inspect-hud-preview-label{display:flex;align-items:center;gap:6px;color:#aeb7c2;font:8px/1 Inter,"Microsoft YaHei",sans-serif;letter-spacing:1.4px;text-shadow:0 1px 3px #000}
.inspect-hud-preview-label:before{content:"";width:4px;height:4px;border:1px solid #b8c3cf;border-radius:50%}
.inspect-hud-preview-mount{position:relative;min-height:1px}
.inspect-hud-preview .weapon-counter{position:relative;left:auto;bottom:auto}
.inspect-hud-preview .weapon-counter-leading{opacity:.25}
.inspect-hud-preview .counter-candidate{position:relative}

.counter-candidate{--q:#FFD45A;--q-rgb:255,212,90;--ink:#f5f7fb;position:relative;flex:none;box-sizing:border-box;color:var(--ink);font-family:Inter,"Microsoft YaHei",sans-serif;user-select:none;pointer-events:none}
.counter-candidate *{box-sizing:border-box}
.counter-candidate .quality{color:var(--q);font-size:9px;font-weight:600;letter-spacing:.7px;white-space:nowrap}
.counter-candidate .quality:before{content:"";display:inline-block;width:4px;height:4px;margin-right:5px;background:currentColor;transform:rotate(45deg);vertical-align:2px}
.counter-candidate .label{color:#acb8c5;font-size:9px;font-weight:500;letter-spacing:1.2px;white-space:nowrap}
.counter-candidate .num{font-family:Bahnschrift,"DIN Alternate",sans-serif;font-size:36px;font-weight:500;line-height:1;font-variant-numeric:tabular-nums;letter-spacing:.6px;white-space:nowrap}
.counter-candidate .zero{opacity:.32}
.counter-candidate .finish{color:#c7d0dc;font-size:10px;white-space:nowrap}
.counter-candidate .family{margin-right:7px;color:#8c9bae;font-size:8px;letter-spacing:.6px}
.counter-candidate .run{font-size:9px;color:#91a2b5;white-space:nowrap}
.counter-candidate .run b{margin-left:5px;color:var(--q);font-family:Bahnschrift,sans-serif;font-size:13px;font-weight:500}

.counter-candidate[data-design="a"]{width:252px;padding:10px 0 10px 16px;background:linear-gradient(90deg,rgba(10,17,26,.93),rgba(10,17,26,.6) 75%,transparent);border-radius:0}
.counter-candidate[data-design="a"]:before{content:"";position:absolute;left:0;top:13px;bottom:13px;width:2px;background:var(--q)}
.a-top{display:flex;align-items:center;gap:12px}.a-number{display:flex;align-items:baseline;gap:17px;margin:8px 0}
.counter-candidate[data-design="a"] .num{font-size:37px;letter-spacing:1px}.counter-candidate[data-design="a"] .finish{font-size:9px}.counter-candidate[data-design="a"] .run b{font-size:12px}

.counter-candidate[data-design="b"]{width:306px;display:grid;grid-template-columns:auto 1fr 48px;gap:13px;align-items:center;padding:12px 12px 12px 16px;border:1px solid rgba(255,255,255,.15);border-left:3px solid var(--q);border-radius:4px;background:#121b26;box-shadow:0 6px 16px #0002}
.counter-candidate[data-design="b"] .num{font-size:29px;letter-spacing:.2px}.b-info{min-width:0;display:grid;gap:5px}.counter-candidate[data-design="b"] .label{font-size:8px;letter-spacing:.8px}.counter-candidate[data-design="b"] .quality{font-size:8px}
.b-bottom{display:flex;align-items:center;gap:7px}.counter-candidate[data-design="b"] .finish{font-size:8px;max-width:57px;overflow:hidden;text-overflow:ellipsis}
.counter-candidate[data-design="b"] .run{border-left:1px solid #ffffff1f;display:grid;justify-items:center;gap:4px;font-size:7px}.counter-candidate[data-design="b"] .run b{font-size:17px;margin:0}

.counter-candidate[data-design="archive"]{--ink:#263832;--counter-num-size:39px;--counter-num-width:200px;width:236px;padding:14px 17px 12px;border-radius:2px;box-shadow:0 7px 17px #0002;clip-path:polygon(0 0,calc(100% - 18px) 0,100% 18px,100% 100%,0 100%)}
.counter-candidate[data-design="archive"]:after{content:"";position:absolute;right:0;top:0;width:18px;height:18px;background:#00000012;border-bottom:1px solid #0001;border-left:1px solid #0001}
.counter-archive-top{display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid #83978445;padding-bottom:10px;padding-right:7px;font:7px Bahnschrift,sans-serif;letter-spacing:1px;color:#788a7e}
.counter-candidate[data-design="archive"] .quality{font-size:8px;color:color-mix(in srgb,var(--q) 48%,#18261e)}
.counter-candidate[data-design="archive"] .quality:before{display:none}
.counter-archive-main{padding:13px 0 12px}
.counter-candidate[data-design="archive"] .label{font-size:8px;letter-spacing:1.1px;color:#788a7e}
.counter-candidate[data-design="archive"] .num{margin-top:5px;font-family:Georgia,"Times New Roman",serif;font-weight:400;letter-spacing:1.3px;line-height:1}
.counter-archive-bottom{display:flex;align-items:center;justify-content:space-between;gap:8px}
.counter-candidate[data-design="archive"] .finish{font-size:9px;color:var(--ink)}
.counter-candidate[data-design="archive"] .family{font:8px Bahnschrift,sans-serif;letter-spacing:.5px;color:#788a7e}
.counter-candidate[data-design="archive"] .run{font-size:8px;color:#788a7e}
.counter-candidate[data-design="archive"] .run b{margin-left:3px;font-size:11px;color:color-mix(in srgb,var(--q) 48%,#18261e)}
.counter-archive-code{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-top:13px;border-top:1px solid #83978445;padding-top:8px;color:#788a7e;font:6px Bahnschrift,sans-serif;letter-spacing:.7px}
.counter-archive-code i{width:40px;height:10px;background:repeating-linear-gradient(90deg,var(--ink) 0 1px,transparent 1px 3px,var(--ink) 3px 5px,transparent 5px 6px);opacity:.6}
.counter-candidate[data-design="archive"] .zero{opacity:.27}
.counter-candidate[data-design="archive"][data-custom-bg]{--ink:var(--counter-ink)}

.counter-candidate[data-design="g"]{width:274px;border:1px solid #5a657333;border-top:2px solid var(--q);border-radius:7px;background:#111b28;box-shadow:0 7px 18px #0003;overflow:hidden}
.g-top{display:flex;align-items:center;justify-content:space-between;padding:11px 14px 0}.counter-candidate[data-design="g"] .label{font-size:8px;letter-spacing:1.3px}
.g-middle{display:grid;grid-template-columns:1fr 70px;align-items:center;padding:9px 14px 11px;gap:12px}.counter-candidate[data-design="g"] .num{font-size:36px;letter-spacing:1px}
.counter-candidate[data-design="g"] .run{border-left:1px solid #ffffff20;display:grid;gap:5px;text-align:center;font-size:8px}.counter-candidate[data-design="g"] .run b{font-size:22px;margin:0}
.g-foot{background:#ffffff04;border-top:1px solid #ffffff12;padding:8px 14px;display:flex;align-items:center;justify-content:space-between}.counter-candidate[data-design="g"] .finish{font-size:9px}.g-saved{font-size:7px;letter-spacing:1px;color:#6f8398}

.counter-candidate[data-design="h"]{width:278px;padding:13px 17px 12px;clip-path:polygon(0 0,calc(100% - 15px) 0,100% 15px,100% 100%,15px 100%,0 calc(100% - 15px));border-top:2px solid var(--q);border-bottom:1px solid rgba(var(--q-rgb),.45);background:linear-gradient(120deg,rgba(var(--q-rgb),.13),transparent 55%),#111a24;box-shadow:inset 1px 0 0 #ffffff29,inset -1px 0 0 #ffffff29}
.h-top{display:flex;align-items:center;justify-content:space-between}.counter-candidate[data-design="h"] .label{font-size:8px;letter-spacing:1.8px}.counter-candidate[data-design="h"] .quality{font-size:9px}
.h-count{display:flex;align-items:center;justify-content:space-between;margin:9px 0 11px}.counter-candidate[data-design="h"] .num{font-size:37px;font-weight:600;letter-spacing:1px}.h-arrow{font-size:18px;color:var(--q);line-height:1}
.h-foot{display:flex;align-items:center;justify-content:space-between;padding-top:8px;border-top:1px solid #ffffff16}.counter-candidate[data-design="h"] .run{font-size:8px}.counter-candidate[data-design="h"] .run b{font-size:12px}

.counter-candidate[data-design="j"]{width:300px;border:1px solid rgba(var(--q-rgb),.32);border-radius:7px;background:linear-gradient(145deg,#071018,#05090d);box-shadow:0 10px 26px #0007,0 0 20px rgba(var(--q-rgb),.09);overflow:hidden;font-family:Consolas,"Courier New",monospace}
.j-bar{display:flex;align-items:center;gap:5px;padding:7px 10px;border-bottom:1px solid #ffffff12;background:#ffffff06;color:#7d8d9b;font-size:8px;letter-spacing:.6px}.j-bar i{width:6px;height:6px;border-radius:50%;background:#3d4852}.j-bar i:first-child{background:var(--q)}.j-bar span{margin-left:6px}
.j-body{display:flex;align-items:baseline;gap:6px;padding:12px 13px 9px;color:#d9f5ff;text-shadow:0 0 9px rgba(var(--q-rgb),.22)}.j-prompt{color:var(--q);font-size:16px}.j-number{font-size:29px;letter-spacing:2px;font-variant-numeric:tabular-nums}.j-cursor{color:var(--q);font-size:18px;animation:counter-cursor 1.1s steps(1) infinite}
.j-foot{display:flex;justify-content:space-between;gap:10px;padding:7px 11px 8px;border-top:1px solid #ffffff0d;color:#708492;font-size:8px}.j-run{color:var(--q)}
.weapon-counter[data-custom-bg="true"],.counter-candidate[data-custom-bg="true"]{background:var(--counter-custom-bg)}
@keyframes counter-cursor{0%,45%{opacity:1}46%,100%{opacity:0}}

.inspect-counter-candidates{margin-top:20px;padding-top:16px;border-top:1px solid #ffffff0d}.inspect-counter-candidates[hidden]{display:none}
.inspect-counter-candidates-head{display:flex;align-items:center;justify-content:space-between;color:#8b929f;font-size:9px;letter-spacing:.6px}.inspect-counter-candidates-head small{font:8px Bahnschrift,sans-serif;color:#616a79;letter-spacing:1px}
.inspect-counter-candidate-grid{display:grid;grid-template-columns:1fr 1fr;gap:6px;margin-top:9px}
.inspect-counter-candidate{display:flex;align-items:center;gap:7px;min-width:0;padding:8px 8px;border:1px solid #ffffff14;border-radius:4px;background:#ffffff06;color:#9aa4b3;font-size:9px;text-align:left;white-space:nowrap}
.inspect-counter-candidate b{flex:none;color:#6f7a88;font:500 9px Bahnschrift,sans-serif;letter-spacing:.5px}
.inspect-counter-candidate span{overflow:hidden;text-overflow:ellipsis}
.inspect-counter-candidate em{display:none;flex:none;margin-left:auto;color:#d9b45f;font:normal 7px Inter,"Microsoft YaHei",sans-serif}
.inspect-counter-candidate[aria-pressed="true"] em{display:inline}
.inspect-counter-candidate:hover{border-color:#ffffff2e;color:#e6e9ee}
.inspect-counter-candidate[aria-pressed="true"]{border-color:var(--inspect-quality);background:#ffffff0f;color:#f1eee6}
.inspect-counter-candidate[aria-pressed="true"] b{color:var(--inspect-quality)}
.inspect-counter-preview-bg{margin-top:12px;padding-top:14px;border-top:1px solid #ffffff0d}.inspect-counter-preview-bg[hidden]{display:none}
.inspect-counter-preview-bg-head{display:flex;align-items:center;justify-content:space-between;color:#8b929f;font-size:9px;letter-spacing:.6px}.inspect-counter-preview-bg-head small{font:8px Bahnschrift,sans-serif;color:#616a79;letter-spacing:1px}
.inspect-counter-preview-bg-row{display:flex;align-items:center;gap:8px;margin-top:9px}
#counterPreviewBgColor{flex:none;width:36px;height:28px;padding:2px;border:1px solid #ffffff1f;border-radius:4px;background:#0d131a;cursor:pointer}
#counterPreviewBgAlpha{flex:1;min-width:0;accent-color:var(--inspect-quality);height:22px}
#counterPreviewBgAlphaValue{flex:none;width:34px;color:#d9e2ec;font:10px Bahnschrift,sans-serif;text-align:right;font-variant-numeric:tabular-nums}
#counterPreviewBgReset{flex:none;padding:5px 8px;border:1px solid #ffffff1f;border-radius:4px;background:#ffffff08;color:#aeb8c4;font-size:9px}
#counterPreviewBgReset:hover{border-color:#ffffff38;color:#f0f3f7}
#counterPreviewBgHex{display:block;margin-top:7px;color:#68798c;font:9px Consolas,monospace;letter-spacing:.4px}

@media(max-width:760px){.inspect-hud-preview{left:16px;bottom:142px}.inspect-hud-preview-label{font-size:7px}}
@media(max-width:360px){.inspect-hud-preview{transform:scale(.9);transform-origin:left bottom}}
@media(prefers-reduced-motion:reduce){.j-cursor{animation:none}}

/* Defaults and quality colors come from the same data as the color controls. */
.weapon-counter:not([data-custom-bg]),.counter-candidate:not([data-custom-bg]){background:var(--counter-default-bg)}
.weapon-counter[data-custom-bg],.counter-candidate[data-custom-bg]{--counter-ink:#f4f7fb;--counter-muted:#bac6d2;color:var(--counter-ink)}
.weapon-counter[data-counter-tone="light"],.counter-candidate[data-counter-tone="light"]{--counter-ink:#19222b;--counter-muted:#52616d}
.weapon-counter[data-custom-bg] .weapon-counter-heading,.weapon-counter[data-custom-bg] .weapon-counter-finish>span,.weapon-counter[data-custom-bg] .weapon-counter-session{color:var(--counter-muted)}
.weapon-counter[data-custom-bg] .weapon-counter-finish>strong,.weapon-counter[data-custom-bg] .weapon-counter-session b,.weapon-counter[data-custom-bg] .weapon-counter-tick{color:var(--counter-ink)}
.counter-candidate[data-custom-bg] .label,.counter-candidate[data-custom-bg] .finish,.counter-candidate[data-custom-bg] .family,.counter-candidate[data-custom-bg] .run,.counter-candidate[data-custom-bg] .j-bar,.counter-candidate[data-custom-bg] .j-foot,.counter-candidate[data-custom-bg] .g-saved{color:var(--counter-muted)}
.counter-candidate[data-custom-bg] .num,.counter-candidate[data-custom-bg] .j-body{color:var(--counter-ink);text-shadow:none}
.counter-candidate[data-custom-bg] .quality,.counter-candidate[data-custom-bg] .run b,.counter-candidate[data-custom-bg] .j-run,.counter-candidate[data-custom-bg] .j-prompt,.counter-candidate[data-custom-bg] .j-cursor,.counter-candidate[data-custom-bg] .h-arrow{color:var(--counter-quality-ink)}
.counter-candidate[data-counter-tone="light"]{text-shadow:none}
.counter-candidate[data-design] .num{font-size:min(var(--counter-num-size,36px),calc(var(--counter-num-width,194px) / var(--weapon-counter-digits,6) * 1.45))}
.counter-candidate[data-design="a"]{--counter-num-size:37px;--counter-num-width:170px}
.counter-candidate[data-design="b"]{--counter-num-size:29px;--counter-num-width:106px}
.counter-candidate[data-design="g"]{--counter-num-width:162px}
.counter-candidate[data-design="h"]{--counter-num-size:37px;--counter-num-width:207px}
.counter-candidate[data-design="j"] .j-number{font-size:min(29px,calc(222px / var(--weapon-counter-digits,6) * 1.45));letter-spacing:1px}
.j-run b{font:inherit}.counter-candidate .finish{min-width:0;overflow:hidden;text-overflow:ellipsis}
.counter-candidate[data-custom-bg] .counter-archive-top,.counter-candidate[data-custom-bg] .counter-archive-code{color:var(--counter-muted)}
.weapon-counter[data-counter-translucent="true"],.counter-candidate[data-counter-translucent="true"],.counter-candidate[data-counter-translucent="true"] .num,.counter-candidate[data-counter-translucent="true"] .j-body{text-shadow:0 1px 3px #000d}