*{margin:0;padding:0;box-sizing:border-box;-webkit-user-select:none;user-select:none}
/* Buttons: real <button> elements carry native OS/browser widget chrome
   that was never explicitly turned off here (-webkit-appearance/appearance
   was never set). That native rendering — including Chromium/Edge's own
   hover/pressed highlight on Windows, which some builds still draw as a
   plain rectangle tied to the system accent color — sits OUTSIDE normal
   CSS painting and ignores clip-path entirely, so on any chevron-cut
   button (DEPLOY, BACK, SWITCH, the hex menu buttons) it shows through
   as a square box poking out from behind the angled shape on hover.
   `.custom-tab`/`.modecard` are plain <div>s and never had this problem —
   only actual <button>s did, which is the tell. appearance:none strips
   that native widget entirely so ONLY our own clipped background/border
   ever paints. The focus/outline reset from before stays as a second,
   independent layer of insurance (outline also ignores clip-path, even
   once appearance is reset). */
button{
  -webkit-appearance:none; appearance:none;
  background:none; border:none;
  outline:none; -webkit-tap-highlight-color:transparent;
}
button:focus-visible{ box-shadow:0 0 0 2px var(--signal, #c4782c) inset; }
html,body{width:100%;height:100%;overflow:hidden;background:#07060a;color:#d5cfc4;
  font-family:ui-monospace,"SF Mono",Menlo,Consolas,"Courier New",monospace}
canvas{display:block;position:absolute;inset:0;width:100%;height:100%}
#dmgcv{pointer-events:none;z-index:6}
.hide{display:none!important}
#app{position:absolute;inset:0;overflow:hidden}
.screen{position:absolute;inset:0;z-index:20;display:flex;flex-direction:column;
  align-items:center;justify-content:center;gap:16px;
  background:radial-gradient(ellipse at 50% 42%,#191510 0%,#07060a 72%)}
/* Was `inset 0 0 180px 40px #000` — a fixed-pixel vignette that reads as a
   subtle edge-darkening on a large/maximized window, but on a smaller or
   non-maximized browser window that 180+40=220px dark band eats a huge
   share of the screen and swallows whatever UI sits near the edges (the
   account strip top-right, the stat/customization side panels) — exactly
   the "all corners are blacked out, can't see signed-in/profile" bug.
   Scaled down and pulled off pure black so it never fully hides content
   under it. */
.screen:after{content:"";position:absolute;inset:0;pointer-events:none;
  box-shadow:inset 0 0 70px 8px rgba(0,0,0,.55)}
.brand{font-size:min(8.6vw,70px);letter-spacing:.2em;font-weight:700;color:#e6ddcd;
  text-shadow:0 0 26px rgba(196,120,44,.3);position:relative}
.brand span{color:#c4782c}
.sub{letter-spacing:.4em;font-size:11px;color:#7a6f60;margin-top:-8px;position:relative}
.menu{display:flex;flex-direction:column;gap:8px;width:340px;position:relative;margin-top:16px}
.btn{background:rgba(26,22,18,.88);border:1px solid #3a332a;color:#c2b8a8;padding:13px 18px;
  font:inherit;font-size:14px;letter-spacing:.2em;cursor:pointer;text-align:left;
  transition:background .12s,border-color .12s,color .12s,transform .08s;position:relative}
.btn:hover{background:#241e17;border-color:#c4782c;color:#fff;transform:translateX(3px)}
.btn:active{transform:translateX(1px)}
.btn.sm{padding:9px 10px;font-size:11px;letter-spacing:.1em;text-align:center}
.btn.on{border-color:#c4782c;color:#e8b070;background:#2a1e12}
.panel{position:relative;width:480px;max-height:80vh;overflow-y:auto;
  background:rgba(18,15,12,.95);border:1px solid #3a332a;padding:22px}
.panel h2{font-size:13px;letter-spacing:.3em;color:#c4782c;margin-bottom:16px;font-weight:600}
.opt{margin-bottom:14px}
.opt label{display:block;font-size:11px;letter-spacing:.16em;color:#8a7f6e;margin-bottom:6px}
.opt .val{float:right;color:#e2dacd}
input[type=range]{width:100%;height:3px;-webkit-appearance:none;appearance:none;background:#3a332a;outline:none}
input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;width:13px;height:13px;background:#c4782c;cursor:pointer;border-radius:0}
input[type=range]::-moz-range-thumb{width:13px;height:13px;background:#c4782c;cursor:pointer;border:0;border-radius:0}
.seg{display:flex;gap:6px}
.seg .btn{flex:1}
.hint{font-size:10px;color:#6b6152;letter-spacing:.08em;line-height:1.7}
textarea{width:100%;height:58px;background:#0e0c0a;border:1px solid #3a332a;color:#9a8f7e;
  font:inherit;font-size:10px;padding:7px;resize:none}
.code{font-size:30px;letter-spacing:.3em;color:#c4782c;text-align:center;padding:8px 0}
.modecard{border:1px solid #3a332a;padding:11px;cursor:pointer;margin-bottom:8px;
  transition:border-color .12s,background .12s}
.modecard:hover{border-color:#8a6034;background:#1d1812}
.modecard.on{border-color:#c4782c;background:#2a1e12}
.modecard b{font-size:13px;letter-spacing:.18em;color:#e8dfd0;display:block;margin-bottom:5px}
.modecard i{font-style:normal;font-size:10px;color:#8a7f6e;line-height:1.7}
#loading{position:absolute;inset:0;z-index:60;display:flex;flex-direction:column;
  align-items:center;justify-content:center;background:#07060a;gap:14px}
.bar{width:260px;height:2px;background:#221d18;overflow:hidden}
.bar i{display:block;height:100%;width:0;background:#c4782c;transition:width .25s}
#lmsg{font-size:11px;letter-spacing:.26em;color:#7a6f60}
#hud{position:absolute;inset:0;z-index:5;pointer-events:none;font-size:12px;
  letter-spacing:.1em;text-shadow:0 1px 3px #000}
#xh{position:absolute;left:50%;top:50%;width:0;height:0}
#xh i{position:absolute;background:#e9e4d8;opacity:.9;box-shadow:0 0 3px #000}
#xh .h{width:2px;height:8px;left:-1px}#xh .v{height:2px;width:8px;top:-1px}
#xh .dot{width:2px;height:2px;left:-1px;top:-1px;opacity:0}
#botleft{position:absolute;left:26px;bottom:24px;width:230px}
#hpwrap,#stwrap{height:5px;background:rgba(0,0,0,.55);border:1px solid rgba(255,255,255,.12);margin-top:5px}
#hpbar{height:100%;width:100%;background:linear-gradient(90deg,#b8332a,#c4782c);transition:width .15s}
#stbar{height:100%;width:100%;background:#6f93a8;transition:width .1s}
#hpnum{font-size:23px;color:#fff;letter-spacing:.06em}
#hpnum b{font-size:11px;color:#8a7f6e;font-weight:400;margin-left:6px}
#botright{position:absolute;right:26px;bottom:24px;text-align:right}
#ammo{font-size:34px;color:#fff;line-height:1}
#ammo.low{color:#e0362a;animation:pulse .6s infinite}
#ammo.pop{animation:ammoPop .38s cubic-bezier(.2,1.6,.4,1)}
@keyframes ammoPop{0%{transform:scale(1.28);color:#ffd27a}100%{transform:scale(1);color:#fff}}
#ammo{transform-origin:100% 100%}
#ammo small{font-size:15px;color:#8a7f6e}
#wname{font-size:11px;color:#8a7f6e;margin-top:3px}
#reloadbar{width:120px;height:3px;background:rgba(255,255,255,.14);margin-top:7px;margin-left:auto}
#reloadbar i{display:block;height:100%;width:0;background:#c4782c}
/* inspect (V): the weapon and its finish, fading in beside the gun */
#inspectTag{position:absolute;right:30px;bottom:132px;text-align:right;opacity:0;transform:translateX(14px);
  transition:opacity .35s ease,transform .45s cubic-bezier(.2,.9,.25,1)}
#inspectTag.on{opacity:1;transform:none;transition-delay:.25s}
#inspectTag b{display:block;font-size:10px;font-weight:400;letter-spacing:.32em;color:#8a7f6e}
#inspectTag span{display:block;margin-top:4px;font-size:21px;letter-spacing:.06em;color:#fff}
#inspectTag span::after{content:'';display:block;height:2px;width:46px;margin:7px 0 0 auto;background:#c4782c}
#inspectTag.vip span{color:#f0c35a}
#inspectTag.vip span::after{background:#f0c35a}
@keyframes pulse{0%,100%{opacity:1}50%{opacity:.35}}
#topleft{position:absolute;left:26px;top:22px}
#timer{font-size:25px;color:#fff;letter-spacing:.08em}
#score{font-size:13px;margin-top:4px}
#score .a{color:#6f93a8}#score .b{color:#c4782c}
#score .sctag{font-size:9px;letter-spacing:.14em;padding:1px 4px;margin:0 5px;border-radius:2px;vertical-align:1px}
#score .sctag:empty{display:none}
#score .sctag.ct{color:#9cc6e4;background:rgba(80,130,170,.18);border:1px solid rgba(120,170,210,.35)}
#score .sctag.t{color:#e8b06c;background:rgba(190,120,50,.18);border:1px solid rgba(220,150,80,.35)}
#modeline{font-size:10px;color:#7a6f60;margin-top:3px;letter-spacing:.18em}
#cash{font-size:13px;color:#86bd7e;margin-top:5px}
#alive{font-size:11px;color:#8a7f6e;margin-top:3px;letter-spacing:.16em}
#topright{position:absolute;right:26px;top:22px;width:320px;text-align:right}
.kf{font-size:11px;margin-bottom:4px;opacity:1;transition:opacity .5s;
  background:rgba(0,0,0,.4);padding:3px 8px;display:inline-block}
.kf .a{color:#6f93a8}.kf .b{color:#c4782c}.kf .w{color:#98907f;margin:0 6px}
#callouts{position:absolute;left:50%;bottom:120px;transform:translateX(-50%);text-align:center}
.co{font-size:12px;color:#c6bdae;background:rgba(0,0,0,.4);padding:3px 10px;margin-top:3px;
  opacity:1;transition:opacity .4s}
#objective{position:absolute;left:50%;top:74px;transform:translateX(-50%);text-align:center;
  font-size:13px;color:#e8b070;letter-spacing:.18em}
#objbar{width:210px;height:4px;background:rgba(255,255,255,.15);margin:7px auto 0}
#objbar i{display:block;height:100%;width:0;background:#c4782c}
#banner{position:absolute;left:0;right:0;top:36%;text-align:center;font-size:34px;
  letter-spacing:.22em;color:#fff;opacity:0;transition:opacity .4s;text-shadow:0 0 30px #000}
#banner small{display:block;font-size:13px;letter-spacing:.28em;color:#98907f;margin-top:10px}
#zonetag{position:absolute;left:50%;bottom:62px;transform:translateX(-50%);
  font-size:10px;letter-spacing:.3em;color:#7a6f60}
#hosttag{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);margin-top:-70px;
  font-size:10px;letter-spacing:.24em;color:#7ddba0;text-align:center}
#sb{position:absolute;inset:0;z-index:9;display:flex;align-items:center;justify-content:center;
  background:rgba(7,6,10,.84)}
#sb .inner{width:640px;border:1px solid #3a332a;background:rgba(16,13,11,.97);padding:20px}
#sb h3{font-size:12px;letter-spacing:.3em;color:#c4782c;margin-bottom:12px}
#sb table{width:100%;border-collapse:collapse;font-size:12px}
#sb th{text-align:left;color:#7a6f60;font-weight:400;padding:5px 8px;font-size:10px;letter-spacing:.18em}
#sb td{padding:5px 8px;border-top:1px solid #221d18}
#sb tr.me td{background:rgba(196,120,44,.11);color:#fff}
#sb .ta td:first-child{border-left:2px solid #6f93a8}
#sb .tb td:first-child{border-left:2px solid #c4782c}
#sb .num{text-align:right}
#pause,#endscr{z-index:24;background:rgba(7,6,10,.9)}
#endscr .brand{font-size:44px}
#endtable{width:520px;border:1px solid #3a332a;background:rgba(16,13,11,.9);padding:16px;font-size:12px}
#endtable table{width:100%;border-collapse:collapse}
#endtable th{text-align:left;color:#7a6f60;font-weight:400;font-size:10px;letter-spacing:.18em;padding:4px 8px}
#endtable td{padding:4px 8px;border-top:1px solid #221d18}
#endtable .num{text-align:right}
/* buy menu (Armory): styled in progression.css with the rest of the menus */
#buy{z-index:22;background:rgba(7,6,10,.86)}
#nades{position:absolute;right:26px;bottom:78px;text-align:right;font-size:11px;
  color:#8a7f6e;letter-spacing:.12em}
#nades b{color:#e8dfd0;font-weight:400}
#nades .on{color:#c4782c}
#fusewrap{position:absolute;left:50%;top:50%;transform:translateX(-50%);margin-top:26px;
  width:70px;height:3px;background:rgba(255,255,255,.18)}
#fusewrap i{display:block;height:100%;width:0;background:#e0362a}
#buygrace{position:absolute;right:26px;bottom:100px;font-size:10px;color:#c4782c;letter-spacing:.18em}
#scopeov{position:absolute;inset:0;z-index:4;pointer-events:none;opacity:0;transition:opacity .08s}
#scopeov .lens{position:absolute;left:50%;top:50%;width:min(88vh,88vw);height:min(88vh,88vw);
  transform:translate(-50%,-50%);border-radius:50%;
  box-shadow:0 0 0 100vmax #05040a,inset 0 0 90px 30px rgba(0,0,0,.9)}
#scopeov .ch{position:absolute;left:50%;top:50%;background:#0c0c0c}
#scopeov .hz{width:min(88vh,88vw);height:1px;transform:translate(-50%,-50%)}
#scopeov .vt{height:min(88vh,88vw);width:1px;transform:translate(-50%,-50%)}
#scopeov .mil{position:absolute;left:50%;background:#0c0c0c;width:9px;height:1px;transform:translateX(-50%)}
#crumbs{position:absolute;left:50%;bottom:18px;transform:translateX(-50%);font-size:10px;
  color:#5a5245;letter-spacing:.14em;z-index:21;text-align:center;line-height:1.8}
#fps{position:absolute;right:8px;bottom:6px;font-size:10px;color:#5a5245;z-index:7}
#err{position:absolute;inset:0;z-index:99;display:flex;align-items:center;justify-content:center;
  background:#07060a;padding:40px;text-align:center;font-size:13px;color:#e0362a;line-height:1.9}
#specfrm{position:absolute;inset:0;pointer-events:none;z-index:7}
#specfrm i{position:absolute;inset:0;border:14px solid rgba(224,54,42,.16);
  box-shadow:inset 0 0 0 2px rgba(224,54,42,.55),inset 0 0 120px 30px rgba(120,16,12,.34)}
#specfrm i:before,#specfrm i:after{content:"";position:absolute;left:0;right:0;height:52px;
  background:linear-gradient(180deg,rgba(10,7,6,.92),rgba(10,7,6,0))}
#specfrm i:before{top:0}
#specfrm i:after{bottom:0;transform:rotate(180deg)}
#specfrm b{position:absolute;top:30px;left:0;right:0;text-align:center;font-size:19px;
  letter-spacing:.42em;color:#f0e6d8;text-shadow:0 0 18px rgba(224,54,42,.7);font-weight:600}
#specfrm u{position:absolute;top:60px;left:0;right:0;text-align:center;font-size:10px;
  letter-spacing:.3em;color:#a8968a;text-decoration:none}
#hm{position:absolute;left:50%;top:50%;width:34px;height:34px;margin:-17px 0 0 -17px;opacity:0;transition:opacity .1s,transform .1s}
#hm svg{width:100%;height:100%;display:block;filter:drop-shadow(0 0 2px rgba(0,0,0,.9))}
#hm svg polygon,#hm svg circle{fill:#fff}
#hm svg [data-fill-dark]{fill:#111}
#hm.k svg polygon,#hm.k svg circle{fill:#e0362a}
#hm.k svg [data-fill-dark]{fill:#111}
#hm.k #hmSkull{display:block !important}
