@import url('https://fonts.googleapis.com/css2?family=Barlow+Condensed:wght@500;600;700;800;900&family=Inter:wght@400;500;600;700;800&display=swap');
:root{--base:#080d16;--panel:#101926;--card:#172432;--line:#2a3a4b;--cream:#f3eddd;--amber:#f5b94f;--sea:#3fdcc5;--red:#ff626a;--blue:#4ea3fa}
*{box-sizing:border-box} html,body{padding:0;margin:0;width:100%;height:100%;height:100dvh;overscroll-behavior:none;background:#050911;color:var(--cream);font-family:Inter,system-ui,sans-serif;-webkit-user-select:none;user-select:none}button{font:inherit;color:inherit;cursor:pointer;touch-action:manipulation}button:disabled{opacity:.45;cursor:not-allowed}#app{height:100%;height:100dvh;overflow:hidden;position:relative;background:radial-gradient(circle at 50% 40%,#16273a,#06090d 73%)}#game{display:block;width:100%;height:100%;touch-action:none}.vignette{pointer-events:none;position:absolute;inset:0;box-shadow:inset 0 0 145px rgba(0,0,0,.64)}
.hud{position:absolute;z-index:4;top:0;left:0;right:0;padding:calc(12px + env(safe-area-inset-top)) 19px 8px;display:flex;align-items:center;justify-content:space-between;gap:10px;background:linear-gradient(180deg,rgba(4,8,15,.94),rgba(4,8,15,.75) 74%,transparent)}.brand{display:flex;gap:10px;align-items:center;min-width:0}.brandmark{background:#efb54c;color:#080c12;display:grid;place-items:center;width:44px;height:43px;font:900 27px 'Barlow Condensed',sans-serif;letter-spacing:-1px;transform:skew(-4deg)}.brandmark span{color:#ffffff}.brandtitle{font:800 24px/1 'Barlow Condensed',sans-serif;letter-spacing:1.6px;white-space:nowrap}.brandtitle b{color:var(--amber)}.brandtitle small{display:block;font:600 9px/1.7 Inter;letter-spacing:2px;color:#95a9b8}.hudright{display:flex;align-items:center;gap:8px}.money{text-align:right;white-space:nowrap}.money small,.stat small{display:block;color:#9fb0bb;font:700 9px Inter;letter-spacing:1.25px}.money b{color:var(--sea);font:800 22px 'Barlow Condensed',sans-serif}.smallbtn{border:1px solid #816531;background:#2a2419;color:#ffcf80;border-radius:7px;padding:10px 11px;font:800 13px 'Barlow Condensed',Impact,'Arial Narrow',sans-serif;letter-spacing:1px}.smallbtn span{color:white}.smallbtn.soft{background:#111c2a;color:#dde7f0;border-color:#26394b;font-size:17px}.scorebar{position:absolute;z-index:3;top:calc(80px + env(safe-area-inset-top));left:18px;right:18px;display:flex;justify-content:space-between;align-items:flex-start;gap:8px}.stats{display:flex;gap:16px}.stat{min-width:47px}.stat strong{font:700 20px 'Barlow Condensed',sans-serif;letter-spacing:.4px}.meter{display:block;height:4px;width:75px;background:#28303c;border-radius:5px;overflow:hidden;margin-top:2px}.meter i{display:block;background:var(--sea);width:100%;height:100%;transition:width .1s}.zonepill{font:700 11px 'Barlow Condensed',Impact,'Arial Narrow',sans-serif;letter-spacing:1.3px;background:#10252d;border:1px solid #2b645a;padding:8px;border-radius:3px;color:var(--sea)}.tipline{position:absolute;top:calc(145px + env(safe-area-inset-top));left:50%;transform:translateX(-50%);z-index:3;text-align:center;white-space:nowrap;font:700 12px 'Barlow Condensed',Impact,'Arial Narrow',sans-serif;letter-spacing:1.1px;color:#ffe8b0;background:#111c29dc;border:1px solid #3c4550;padding:8px 13px;border-radius:3px;max-width:94%;text-overflow:ellipsis;overflow:hidden}.minimap{position:absolute;right:16px;top:calc(172px + env(safe-area-inset-top));z-index:3;width:130px;padding:6px;background:#0d1620da;border:1px solid #4a5a63;border-radius:5px;box-shadow:0 6px 14px #0008}.minimap canvas{width:100%;height:auto;display:block}.minimap span{display:block;text-align:center;font:700 8px Inter;letter-spacing:1.4px;color:#9caab0;margin:4px 0 1px}.bottomControls{pointer-events:none;position:absolute;bottom:calc(18px + env(safe-area-inset-bottom));left:0;right:0;z-index:4;display:flex;justify-content:space-between;align-items:flex-end;padding:0 20px 4px}.joypad{pointer-events:auto;width:132px;height:132px;position:relative;border-radius:50%;background:#17212d77;touch-action:none}.joyring{position:absolute;inset:7px;border-radius:50%;border:2px solid #c5ccd34f;box-shadow:0 0 24px #0008,inset 0 0 24px #0007}.joyknob{position:absolute;top:50%;left:50%;margin:-29px 0 0 -29px;width:58px;height:58px;border-radius:50%;background:linear-gradient(130deg,#65778d,#1a2b3f);box-shadow:0 0 0 2px #adbac355,0 5px 15px #0009}.rightactions{pointer-events:auto;display:grid;grid-template-columns:repeat(3,53px);grid-template-rows:repeat(2,53px);gap:9px;align-items:center;justify-content:end}.roundAction{height:53px;width:53px;border-radius:50%;background:#132435e8;border:1.5px solid #7d939a;color:#fff;font-size:22px;font-weight:700;box-shadow:0 4px 18px #0009;display:flex;flex-direction:column;align-items:center;justify-content:center}.roundAction small{display:block;font:800 10px 'Barlow Condensed',Impact,'Arial Narrow',sans-serif;letter-spacing:1px}.roundAction.hire{grid-column:1;grid-row:1;color:var(--sea);border-color:#3b8c7f}.roundAction.heal{grid-column:2;grid-row:1;color:var(--sea)}.roundAction.ammo{grid-column:1;grid-row:2;color:#ffd48b}.roundAction.fire{grid-column:3;grid-row:1/span 2;height:88px;width:88px;margin-left:-28px;font-size:35px;background:#ad422e;border:2px solid #ff9f5b;color:#fff}.roundAction.fire small{font-size:12px}.roundAction:active,.smallbtn:active{transform:scale(.96)}
.overlay{position:absolute;z-index:10;inset:0;background:rgba(3,8,14,.77);backdrop-filter:blur(7px);display:none;align-items:center;justify-content:center;padding:calc(12px + env(safe-area-inset-top)) 12px calc(12px + env(safe-area-inset-bottom));overflow-y:auto}.overlay.show{display:flex}.panel{width:min(600px,100%);max-height:100%;overflow-y:auto;background:linear-gradient(144deg,#1a2837,#0b1420 78%);border:1px solid #4b5b60;box-shadow:0 20px 95px #000b;border-radius:13px;padding:25px 24px;overscroll-behavior:contain}.hidden{display:none!important}.eyebrow{font:800 11px Inter;letter-spacing:3px;color:var(--amber);margin-bottom:7px}.welcome h1{font:900 clamp(57px,13vw,91px)/.9 'Barlow Condensed',sans-serif;letter-spacing:1px;margin:0 0 9px}.welcome h1 span{color:var(--amber)}.welcome h1 em{font:900 24px 'Barlow Condensed',Impact,'Arial Narrow',sans-serif;vertical-align:top;margin-left:6px;font-style:normal;color:var(--sea)}.subhead{font:600 12px Inter;letter-spacing:1.4px;color:#acbcc9}.divider{height:1px;background:#3a4c5c;margin:22px 0 17px}.sectionlabel{font:800 12px Inter;letter-spacing:1.7px;margin-bottom:12px}.hoodgrid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}.hoodchoice{min-height:38px;text-align:center;padding:9px 4px;background:#152232;border:1px solid #344456;border-radius:4px;color:#cad3dc;font:800 14px 'Barlow Condensed',Impact,'Arial Narrow',sans-serif;letter-spacing:.6px}.hoodchoice.active{color:#08131c;background:var(--amber);border-color:var(--amber);box-shadow:0 0 20px #f5b94f2b}.rules{display:flex;flex-wrap:wrap;gap:13px;justify-content:center;color:#b5c4c6;font:700 10px Inter;margin:21px 0}.bigbtn{width:100%;padding:14px;border:0;border-radius:5px;background:linear-gradient(90deg,#ffc963,#e69a38);color:#17130b;font:900 22px 'Barlow Condensed',sans-serif;letter-spacing:1.1px;box-shadow:0 6px 0 #775523;display:flex;justify-content:space-between;align-items:center;text-align:left}.bigbtn b{font-size:25px}.bigbtn:active{transform:translateY(3px);box-shadow:0 3px 0 #775523}.micro{color:#8d9fad;font:500 10px/1.5 Inter;text-align:center;margin:16px 4px 0}.shop{width:min(570px,100%)}.shopTop{display:flex;align-items:flex-start;justify-content:space-between}.shopTop h2,.pause h2{font:900 45px 'Barlow Condensed',Impact,'Arial Narrow',sans-serif;margin:0 0 16px}.close{border:1px solid #4b6170;background:#152331;border-radius:5px;width:36px;height:36px}.pilltabs{display:flex;gap:6px;padding:5px;background:#08101b;border-radius:7px;margin-bottom:13px}.pilltabs button{border:0;background:none;flex:1;border-radius:5px;padding:9px 2px;font:800 12px 'Barlow Condensed',Impact,'Arial Narrow',sans-serif;letter-spacing:.7px;color:#a6b1b9}.pilltabs button.active{background:#294152;color:#f6eacb}.item{display:flex;align-items:center;gap:10px;border:1px solid #344856;background:#162334;margin:8px 0;padding:12px;border-radius:7px}.item .glyph{width:42px;height:42px;flex:none;display:grid;place-items:center;background:#263c4a;color:var(--amber);border-radius:5px;font-size:22px}.item .desc{flex:1;min-width:0}.item .desc b{display:block;font:800 19px 'Barlow Condensed'}.item .desc small{display:block;color:#a4b6c4;font:500 11px/1.4 Inter}.pricebtn{border:1px solid #8d6c3a;background:#f2b957;color:#181b20;border-radius:5px;padding:11px 10px;white-space:nowrap;font:900 15px 'Barlow Condensed',Impact,'Arial Narrow',sans-serif;min-width:73px}.pricebtn.secondary{border-color:#287e76;background:#183e3d;color:#67e6cd}.tag{display:inline-block;color:var(--sea);font:800 11px Inter}.shopFooter{display:flex;align-items:center;justify-content:space-between;gap:8px;border-top:1px solid #324656;margin-top:18px;padding-top:12px}.shopFooter span{font:700 10px Inter;letter-spacing:.4px;color:#b6c5c8}.shopFooter button,.ghostbtn{border:1px solid #445969;background:#162533;padding:9px;border-radius:4px;font:800 12px 'Barlow Condensed',Impact,'Arial Narrow',sans-serif;letter-spacing:.7px}.pause{text-align:center}.pause .eyebrow,.pause h2{margin-bottom:14px}.pause .ghostbtn{margin-top:18px;width:100%;padding:13px}.toast{position:absolute;z-index:30;bottom:calc(180px + env(safe-area-inset-bottom));left:50%;transform:translateX(-50%) translateY(15px);opacity:0;max-width:90%;width:max-content;background:#172a33;border:1px solid #7c977e;box-shadow:0 8px 34px #0009;border-radius:6px;padding:13px 16px;font:700 13px/1.4 Inter;text-align:center;transition:opacity .15s,transform .15s;pointer-events:none}.toast.show{opacity:1;transform:translateX(-50%) translateY(0)}
@media(max-width:580px){.brandmark{width:35px;height:35px;font-size:23px}.brandtitle{font-size:19px}.brandtitle small{font-size:7px}.money b{font-size:17px}.hud{padding-left:10px;padding-right:10px}.scorebar{left:11px;right:11px;top:calc(71px + env(safe-area-inset-top))}.stats{gap:10px}.stat strong{font-size:18px}.stat small{font-size:8px;letter-spacing:.5px}.zonepill{font-size:9px}.tipline{top:calc(131px + env(safe-area-inset-top));font-size:10px}.minimap{width:100px;top:calc(166px + env(safe-area-inset-top));right:9px}.panel{padding:19px 14px}.bottomControls{padding-left:13px;padding-right:13px}.joypad{width:117px;height:117px}.rightactions{grid-template-columns:repeat(3,46px);grid-template-rows:repeat(2,46px);gap:8px}.roundAction{width:46px;height:46px}.roundAction.fire{width:72px;height:72px;margin-left:-24px;font-size:29px}.hoodchoice{font-size:12px}.item .desc b{font-size:17px}}
@media(max-height:690px){.welcome h1{font-size:52px}.rules{margin:11px}.divider{margin:14px 0}.hoodgrid{gap:5px}.hoodchoice{min-height:33px;padding:7px 2px}.panel{padding-top:13px;padding-bottom:13px}.minimap{display:none}}
@media(pointer:fine){.joypad{opacity:.5}.roundAction.fire{cursor:crosshair}}
/* Narrow-screen typography must not clip BLOCKLINE 5L when web fonts are unavailable. */
@media(max-width:580px){.welcome h1{font-size:clamp(44px,12vw,57px);letter-spacing:-1.4px;white-space:nowrap}.welcome h1 em{font-size:18px;margin-left:1px}.shopTop h2{font-size:38px}}

/* Official BLOCKLINE app install action: browser controls the final permission prompt. */
.installbtn{display:block;width:100%;margin:18px auto 0;padding:11px 9px;border:1px solid #af7d3b;border-radius:5px;background:#172636;color:#ffd180;font:800 12px Inter,system-ui,sans-serif;letter-spacing:.7px;text-align:center;cursor:pointer}
.installbtn:hover,.installbtn:focus-visible{background:#273a49;outline-color:#ffd180}
.installbtn[hidden]{display:none!important}

/* V7.8: entry unlock panel uses existing BLOCKLINE visual language. */
.accessPanel{margin:18px 0 8px;padding:22px 17px 15px;border:1px solid #b58446;border-radius:10px;background:linear-gradient(135deg,#28303a,#111b27);text-align:center;box-shadow:inset 0 1px 16px #ffc56c14}
.accessTag{font:900 12px Inter,sans-serif;letter-spacing:2px;color:#f6c46f}
.accessPrice{font:900 clamp(58px,13vw,80px)/1.15 'Barlow Condensed',Impact,sans-serif;color:#ffd17d;padding:8px 0}
.accessPrice span{font-size:.65em}
.accessPanel p{color:#d4dce0;font:650 13px/1.5 Inter,sans-serif;margin:8px 0 22px}
.accessPanel .micro{font-size:10px;color:#a5b5c0;margin:16px 0 0}
.accessPanel .bigbtn{cursor:pointer}
.accessPanel .bigbtn:disabled{opacity:.6;cursor:wait}
.accessStatus{margin:14px 0 0;min-height:30px;font:700 12px/1.4 Inter,sans-serif;color:#f9c76d}

/* Show immediately after a verified $2 purchase, without covering the map.
   Native iOS installation still requires the user's Share → Add confirmation. */
.installAfterPurchase{margin:16px 0 17px;padding:16px;border:1px solid #e7ba68;border-radius:9px;background:linear-gradient(140deg,#1e3939,#152333);box-shadow:0 0 22px #e7ba6815}
.installHeadline{display:block;color:#76e7bb;font:900 14px/1.45 Inter,system-ui,sans-serif;letter-spacing:.4px}
.installAfterPurchase p{font:600 12px/1.55 Inter,system-ui,sans-serif;color:#e1ebef;margin:9px 0 15px}
.installAfterPurchase small{display:block;color:#bbcad0;font:500 10px/1.6 Inter,system-ui,sans-serif;margin-top:13px}
.installAfterPurchase .bigbtn{font-size:17px;padding:13px}
.installSteps{margin-top:15px;border:1px solid #698c8f;border-radius:6px;background:#101e2a;color:#f9e1ae;padding:14px;font:700 13px/1.6 Inter,system-ui,sans-serif}


/* Decorative joystick children cannot steal pointer capture from the pad. */
.joyring,.joyknob{pointer-events:none}
#fireButton{touch-action:none}

/* Leave clearance for browser and hosting overlays on small screens. */
.bottomControls{bottom:calc(66px + env(safe-area-inset-bottom))}