:root{
  --pine:#23402f; --moss:#5c6b2e; --khaki:#c8b78a; --paper:#f1e8cf;
  --fox:#e36a1e; --ink:#1f2219; --blue:#2f6fd6; --red:#c8362b;
  --panel:oklch(14% 0.012 255 / .92); --panel-text:#f1e8cf;
  --strip:64px;
  --display:"Anton", Impact, "Arial Narrow", sans-serif;
  --body:"Barlow", Arial, sans-serif;
  --mono:"Space Mono", ui-monospace, Menlo, monospace;
  --bg:oklch(14% 0.012 255); --bg-2:oklch(19% 0.013 255); --line:oklch(97% 0.004 90 / 0.14);
  --light:oklch(97% 0.004 90); --soft:oklch(80% 0.008 90 / 0.72);
  --airsoft:oklch(60% 0.10 135); --gel:oklch(66% 0.19 36);
  box-sizing:border-box;
  padding-top:env(safe-area-inset-top,0px);
  padding-bottom:env(safe-area-inset-bottom,0px);
}
@media (prefers-color-scheme: dark){ :root:not([data-theme="light"]){ --panel:rgba(18,20,14,.88); } }
:root[data-theme="dark"]{ --panel:rgba(18,20,14,.88); }
*,*::before,*::after{box-sizing:inherit}
html{height:100%;scroll-padding-top:env(safe-area-inset-top,0px)}
body{height:100%;margin:0;background:#1a2a1f;color:var(--ink);font-family:var(--body);overflow:hidden;
  -webkit-user-select:none;user-select:none;touch-action:manipulation;-webkit-tap-highlight-color:transparent}
#app{position:relative;width:100%;height:100%;overflow:hidden}

/* ---------- Scene ---------- */
#stage{position:absolute;inset:0;cursor:crosshair}
.sky{position:absolute;inset:0;background:
  radial-gradient(120% 60% at 70% 0%, #fbf3d9 0%, rgba(251,243,217,0) 60%),
  linear-gradient(#cfe0d4 0%, #e6e8d2 55%, #d9d6b4 100%)}
.trees{position:absolute;left:0;right:0;width:100%}
.trees.far{bottom:50%;height:38%}
.trees.mid{bottom:46%;height:30%}
.ground{position:absolute;left:0;right:0;bottom:0;height:54%;background:
  radial-gradient(60% 18% at 50% 0%, rgba(0,0,0,.18), transparent 70%),
  repeating-radial-gradient(circle at 20% 30%, rgba(255,255,255,.035) 0 2px, transparent 2px 9px),
  linear-gradient(#7b8743 0%, #66733a 35%, #4c5730 100%)}
.path{position:absolute;left:30%;right:30%;bottom:0;height:54%;background:linear-gradient(#a08f62,#8c7b50);
  clip-path:polygon(44% 0,56% 0,100% 100%,0 100%);opacity:.55}
.sign{position:absolute;left:4%;bottom:52%;width:clamp(56px,9vw,110px)}
#field{position:absolute;left:0;right:0;top:0;bottom:calc(var(--strip) + env(safe-area-inset-bottom,0px))}

.spot{position:absolute;transform:translateX(-50%);width:calc(min(22vw,27vh) * var(--sc));aspect-ratio:4/5;
  overflow:hidden;pointer-events:none}
.spot .pop{position:absolute;left:10%;right:10%;top:0;height:78%}
.target{position:absolute;inset:0;transform:translateY(106%);transition:transform .16s ease-out;pointer-events:auto;cursor:crosshair}
.target svg{width:100%;height:100%;display:block}
.target.up{transform:translateY(0)}
.target.down{transition:transform .22s ease-in;transform:translateY(106%)}
.target.tag{left:30%;right:30%;top:22%}
.target .hitarm{display:none}
.target.hit .hitarm{display:inline}
.target.hit .grin{display:none}
.target.hit .oh{display:inline}
.target .oh{display:none}
.target.hit{animation:shake .25s}
.target.ouch{animation:shake .3s}
@keyframes shake{25%{translate:-4px 0}75%{translate:4px 0}}
.cover{position:absolute;left:0;right:0;bottom:0;height:46%;pointer-events:auto}
.cover svg{width:100%;height:100%;display:block}

.puff{position:absolute;width:22px;height:22px;margin:-11px 0 0 -11px;border-radius:50%;pointer-events:none;
  background:radial-gradient(circle,#fff8 0 30%,#d8c9a0aa 31% 60%,transparent 61%);animation:puff .35s ease-out forwards}
@keyframes puff{to{transform:scale(2.2);opacity:0}}
.float{position:absolute;pointer-events:none;font-family:var(--display);font-size:clamp(20px,3.4vw,34px);color:#fff;
  text-shadow:0 2px 0 var(--ink),0 0 6px rgba(0,0,0,.5);transform:translate(-50%,-50%);animation:rise .8s ease-out forwards;white-space:nowrap}
.float.bad{color:#ffb4a8}
.float.gold{color:#ffe08a}
.float.gel{color:#9fe3ff}
.splash{position:absolute;width:64px;height:64px;margin:-32px 0 0 -32px;pointer-events:none;z-index:6;border-radius:50%;
  background:radial-gradient(circle,rgba(180,235,255,.95) 0 18%,rgba(90,190,255,.55) 19% 34%,transparent 35%),
    radial-gradient(circle at 20% 30%,rgba(140,215,255,.9) 0 6%,transparent 7%),radial-gradient(circle at 80% 25%,rgba(140,215,255,.9) 0 5%,transparent 6%),
    radial-gradient(circle at 70% 80%,rgba(140,215,255,.9) 0 6%,transparent 7%),radial-gradient(circle at 25% 75%,rgba(140,215,255,.9) 0 4%,transparent 5%);
  animation:gelpop .5s ease-out forwards}
@keyframes gelpop{from{transform:scale(.3);opacity:1}to{transform:scale(1.5);opacity:0}}
.target .paw{position:absolute;right:-2%;top:-4%;width:26%;height:auto;transform-origin:50% 100%;animation:pawwave .6s ease-in-out infinite alternate}
@keyframes pawwave{from{transform:rotate(-10deg)}to{transform:rotate(12deg)}}
@keyframes rise{to{transform:translate(-50%,-160%);opacity:0}}

/* ---------- HUD ---------- */
.hud{position:absolute;left:0;right:0;top:0;display:flex;justify-content:space-between;align-items:flex-start;
  padding:10px 12px;gap:10px;pointer-events:none;z-index:5}
.coach{display:flex;align-items:flex-start;gap:8px;max-width:min(58vw,440px)}
.avatar{flex:none;width:60px;height:60px;border-radius:50%;background:var(--bg-2);border:3px solid var(--airsoft);overflow:hidden}
.avatar img{width:100%;height:100%;object-fit:cover;display:block}
.bubble{position:relative;margin-top:6px;background:var(--light);border-left:4px solid var(--airsoft);border-radius:0;box-shadow:0 3px 0 rgba(0,0,0,.35);
  padding:7px 11px;font-weight:600;font-size:clamp(14px,2.2vw,17px);line-height:1.25;color:var(--ink);
  opacity:0;transform:translateX(-6px);transition:opacity .18s,transform .18s}
.bubble.show{opacity:1;transform:none}
.bubble::before{content:"Hank";display:block;font-family:var(--mono);font-size:10px;letter-spacing:.08em;text-transform:uppercase;color:#4d5a2a;margin-bottom:1px}
.tags{display:flex;gap:8px}
.dt{position:relative;min-width:64px;padding:16px 10px 7px;border-radius:12px;text-align:center;
  background:linear-gradient(160deg,#eef0ee,#b9bdbb 55%,#dfe2e0);border:2px solid #6f7472;color:var(--ink);
  box-shadow:0 2px 0 rgba(0,0,0,.35)}
.dt::before{content:"";position:absolute;top:5px;left:50%;width:8px;height:8px;margin-left:-4px;border-radius:50%;
  background:#4a4f4d;box-shadow:inset 0 1px 2px #000}
.dt b{display:block;font-family:var(--display);font-weight:400;font-size:clamp(20px,3.2vw,28px);line-height:1}
.dt span{display:block;font-family:var(--mono);font-size:10px;letter-spacing:.04em;text-transform:uppercase;font-weight:700;margin-top:2px;color:#3c403e}
.dt.warn b{color:var(--red)}

.strip{position:absolute;left:0;right:0;bottom:0;height:calc(var(--strip) + env(safe-area-inset-bottom,0px));
  padding:8px 12px calc(8px + env(safe-area-inset-bottom,0px));background:var(--panel);color:var(--panel-text);
  display:flex;align-items:center;gap:12px;z-index:5;border-top:3px solid var(--airsoft);
  background-image:linear-gradient(var(--panel),var(--panel)),url(/spil/assets/img/3740ed7c431e.webp);background-size:auto,cover}
.mag{flex:1;display:flex;gap:3px;align-items:center;min-width:0}
.bb{flex:1;max-width:14px;height:26px;border-radius:7px 7px 3px 3px;background:linear-gradient(#f3d488,#c99a3a);transition:opacity .1s}
.bb.spent{opacity:.15}
.btn{font-family:var(--mono);font-weight:700;font-size:13px;letter-spacing:.05em;text-transform:uppercase;border:none;border-radius:0;cursor:pointer;
  padding:14px 22px;background:var(--airsoft);color:var(--bg);box-shadow:0 0 0 2px var(--bg);touch-action:manipulation;text-decoration:none;display:inline-block}
.btn:active{transform:translateY(2px)}
.btn.alt{background:transparent;color:var(--light);box-shadow:inset 0 0 0 2px var(--line)}
.btn:focus-visible,.icon:focus-visible{outline:3px solid #ffe08a;outline-offset:2px}
#reload{position:relative;overflow:hidden;min-width:112px}
#reload .fill{position:absolute;left:0;top:0;bottom:0;width:0;background:rgba(255,255,255,.35)}
#reload.loading .fill{width:100%;transition:width var(--rl) linear}
#reload.nudge{animation:nudge .5s 2}
@keyframes nudge{50%{transform:scale(1.1)}}
.icon{background:none;border:2px solid var(--line);color:var(--panel-text);border-radius:0;width:44px;height:44px;
  font-size:18px;cursor:pointer;flex:none}

/* ---------- Overlays ---------- */
.overlay{position:absolute;inset:0;z-index:10;display:flex;align-items:center;justify-content:center;padding:16px;
  background:rgba(20,30,22,.55);backdrop-filter:blur(3px);-webkit-backdrop-filter:blur(3px)}
.overlay[hidden]{display:none}
.card{position:relative;width:min(620px,100%);max-height:100%;overflow:auto;color:var(--light);border:1px solid var(--line);border-top:3px solid var(--airsoft);
  background-image:linear-gradient(oklch(19% 0.013 255 / .94),oklch(19% 0.013 255 / .94)),url(/spil/assets/img/3740ed7c431e.webp);background-size:auto,cover;
  box-shadow:0 20px 50px rgba(0,0,0,.5);padding:22px 20px 22px;text-align:center}
.kicker{font-family:var(--mono);font-size:11px;letter-spacing:.08em;text-transform:uppercase;color:var(--soft);margin:0 0 6px}
.logo{font-family:var(--display);font-weight:400;font-size:clamp(34px,8vw,56px);line-height:.95;text-transform:uppercase;color:var(--light);margin:0;letter-spacing:.01em}
.logo small{display:block;font-family:var(--mono);font-weight:700;font-size:12px;letter-spacing:.08em;color:var(--airsoft);margin-top:8px}
.briefgrid{display:grid;grid-template-columns:minmax(120px,38%) 1fr;gap:6px 16px;align-items:end;margin-top:14px;text-align:left}
.hankbig{align-self:end;margin:0}
.hankbig img{width:100%;height:auto;display:block;filter:drop-shadow(0 8px 14px rgba(0,0,0,.45))}
.hankbig img.aim{transform:scaleX(-1)}
.say{position:relative;background:var(--light);padding:14px 16px;margin:0 0 14px;border-left:4px solid var(--airsoft);
  font-size:clamp(17px,3.4vw,20px);font-weight:600;line-height:1.38;color:var(--bg);text-align:left;min-height:5.6em}
.say::after{content:"";position:absolute;left:-14px;bottom:18px;border:10px solid transparent;border-right-color:var(--airsoft);border-left:0}
.say strong{color:#b4501d}
.legend{display:flex;justify-content:center;gap:14px;margin:-4px 0 14px;flex-wrap:wrap}
.legend[hidden]{display:none}
.legend .hitarm,.legend .oh{display:none}
.legend div{display:flex;align-items:center;gap:6px;font-family:var(--mono);text-transform:uppercase;letter-spacing:.04em;font-weight:700;font-size:12px}
.legend svg{width:36px;height:42px}
.dots{display:flex;justify-content:center;gap:6px;margin-bottom:14px}
.dots i{width:18px;height:4px;background:var(--line)}
.dots i.on{background:var(--airsoft)}
.row{display:flex;gap:10px;justify-content:center;flex-wrap:wrap}
.rank{font-family:var(--display);font-weight:400;text-transform:uppercase;font-size:clamp(38px,9vw,62px);color:var(--airsoft);margin:0;line-height:1}
.stats{display:grid;grid-template-columns:repeat(2,1fr);gap:8px;margin:14px 0}
.stats div{background:var(--bg);border:1px solid var(--line);padding:10px 8px}
.stats b{display:block;font-family:var(--display);font-size:30px;font-weight:400;color:var(--light)}
.stats span{font-family:var(--mono);font-size:10px;letter-spacing:.06em;text-transform:uppercase;font-weight:700;color:var(--soft)}
.best{font-family:var(--mono);font-size:12px;letter-spacing:.05em;text-transform:uppercase;color:var(--airsoft);margin:0 0 16px}
.hint{font-size:14px;color:var(--soft);margin:14px 0 0}
.reportgrid{display:grid;grid-template-columns:minmax(110px,34%) 1fr;gap:16px;align-items:center;text-align:left;margin-top:10px}
.reportgrid .say{min-height:0;margin:8px 0 0}
#cameo{position:absolute;left:0;bottom:calc(var(--strip) + env(safe-area-inset-bottom,0px));width:min(46vw,320px);z-index:4;pointer-events:none;
  transform:translateX(-105%);transition:transform .35s cubic-bezier(.2,.9,.3,1.2)}
#cameo.in{transform:translateX(-8%)}
#cameo img{width:100%;display:block;transform:scaleX(-1);filter:drop-shadow(0 6px 10px rgba(0,0,0,.4))}

@media (max-width:560px){
  .dt{min-width:52px;padding:14px 6px 6px}
  .avatar{width:50px;height:50px}
  .briefgrid{grid-template-columns:1fr;justify-items:center}
  .hankbig{width:min(52vw,210px)}
  .say::after{left:50%;bottom:auto;top:-14px;margin-left:-10px;border:10px solid transparent;border-bottom-color:var(--airsoft);border-top:0}
  .reportgrid{grid-template-columns:30% 1fr;gap:10px}
  .hud{flex-direction:column;align-items:stretch}
  .tags{align-self:flex-end;order:-1}
  .coach{max-width:100%}
}
@media (prefers-reduced-motion: reduce){
  .target,.target.down{transition-duration:.01s}
  .target.hit,.target.ouch,#reload.nudge{animation:none}
  #cameo{display:none}
}

/* ---------- v2: baner ---------- */
.levels{display:grid;gap:10px;margin:16px 0 4px;text-align:left}
.level{display:grid;grid-template-columns:auto 1fr auto;gap:4px 14px;align-items:center;width:100%;padding:12px 14px;
  background:var(--bg);border:1px solid var(--line);border-left:4px solid var(--airsoft);color:var(--light);
  font-family:var(--body);text-align:left;cursor:pointer}
.level:hover:not(:disabled){background:oklch(22% 0.014 255)}
.level:focus-visible{outline:3px solid #ffe08a;outline-offset:2px}
.level:disabled{cursor:not-allowed;opacity:.5;border-left-color:var(--line)}
.level .num{grid-row:span 2;font-family:var(--display);font-size:40px;line-height:1;color:var(--airsoft);min-width:28px;text-align:center}
.level:disabled .num{color:var(--soft)}
.level .nm{font-family:var(--display);font-size:22px;text-transform:uppercase;letter-spacing:.01em;line-height:1.1}
.level .goal{font-family:var(--mono);font-size:11px;letter-spacing:.04em;text-transform:uppercase;color:var(--soft)}
.level .side{grid-row:span 2;text-align:right}
.level .best{display:block;margin:2px 0 0;font-size:11px}
.stars{display:inline-flex;gap:2px;font-size:20px;line-height:1;color:oklch(97% 0.004 90 / .2)}
.stars i{font-style:normal}
.stars i.on{color:#e0b23a}
.stars.big{font-size:40px;gap:6px;margin:4px 0 2px}
.total{font-family:var(--mono);font-size:12px;letter-spacing:.05em;text-transform:uppercase;color:var(--soft);margin:12px 0 0}
.total b{color:var(--airsoft)}
.linkbtn{background:none;border:none;color:var(--soft);font-family:var(--mono);font-size:11px;letter-spacing:.05em;text-transform:uppercase;
  text-decoration:underline;cursor:pointer;margin-top:12px;padding:6px}
.result{font-family:var(--display);font-weight:400;text-transform:uppercase;font-size:clamp(34px,8vw,54px);line-height:1;margin:0;color:var(--airsoft)}
.result.fail{color:#e0705a}
.reason{font-family:var(--mono);font-size:11px;letter-spacing:.05em;text-transform:uppercase;color:var(--soft);margin:6px 0 0}
.bonus{font-family:var(--mono);font-size:12px;letter-spacing:.05em;text-transform:uppercase;color:#e0b23a;margin:0 0 12px}
.final{border:1px solid var(--line);border-top:3px solid #e0b23a;background:var(--bg);padding:12px;margin:0 0 14px}
.final .rank{color:#e0b23a;font-size:clamp(30px,7vw,44px)}
.reserve{font-family:var(--mono);font-size:11px;letter-spacing:.04em;text-transform:uppercase;color:var(--soft);white-space:nowrap}
.dt.done b{color:#3f7a2a}

/* boss */
.target.boss .hitarm{display:none}
.target.boss.dead .hitarm{display:inline}
.target.flash svg{animation:flash .18s}
@keyframes flash{50%{filter:brightness(2.2) saturate(.3)}}
#bossbar{position:absolute;left:50%;top:92px;transform:translateX(-50%);width:min(70vw,380px);z-index:5;pointer-events:none}
#bossbar[hidden]{display:none}
#bossbar .lbl{display:flex;justify-content:space-between;font-family:var(--mono);font-size:11px;letter-spacing:.06em;text-transform:uppercase;
  color:var(--light);text-shadow:0 1px 2px rgba(0,0,0,.8);margin-bottom:3px}
#bossbar .bar{height:12px;background:oklch(14% 0.012 255 / .8);border:2px solid var(--bg)}
#bossbar .bar i{display:block;height:100%;width:100%;background:linear-gradient(#e0705a,#a8261d);transition:width .2s}

/* sniper */
#scope{position:absolute;left:50%;top:45%;width:3000px;height:3000px;margin:-1500px 0 0 -1500px;pointer-events:none;z-index:3;
  background:radial-gradient(circle, transparent 0 120px, rgba(0,0,0,.85) 121px 125px, rgba(8,12,9,.62) 126px)}
#scope::before,#scope::after{content:"";position:absolute;left:50%;top:50%;background:rgba(0,0,0,.75)}
#scope::before{width:240px;height:1.5px;margin:-.75px 0 0 -120px}
#scope::after{width:1.5px;height:240px;margin:-120px 0 0 -.75px}
#scope[hidden]{display:none}
#app.sniper .spot{--zoom:1.18}
#app.sniper #field .spot{width:calc(min(22vw,27vh) * var(--sc) * var(--zoom,1))}

@media (max-width:560px){
  #bossbar{top:140px}
  .level .nm{font-size:19px}
  .level{padding:10px 12px}
}

/* ---------- v3: temaer ---------- */
.loadout{font-size:15px;color:var(--soft);margin:0 0 14px;line-height:1.45}
.loadout b{color:var(--light)}
.loadout a{color:var(--airsoft);font-weight:700;white-space:nowrap}
.loadout a:focus-visible{outline:3px solid #ffe08a;outline-offset:2px}

/* Bakkerne: vi ligger på toppen og kigger ned */
#app.theme-hills .trees.far{bottom:80%;height:15%}
#app.theme-hills .trees.mid{bottom:77%;height:9%}
#app.theme-hills .ground{height:80%;background:
  repeating-radial-gradient(ellipse 160% 40% at 50% 0%, transparent 0 34px, rgba(0,0,0,.05) 34px 36px),
  linear-gradient(#a3ad69 0%, #87934f 30%, #6c7a3d 70%, #5a6733 100%)}
#app.theme-hills .path{display:none}
#app.theme-hills .sign{bottom:78%;width:clamp(48px,7vw,90px)}
.crest{position:absolute;left:0;right:0;bottom:0;height:24%;pointer-events:none;z-index:2}
.crest svg{width:100%;height:100%;display:block}

/* Løbere */
.target.runner{position:absolute;inset:auto;top:auto;width:calc(min(22vw,27vh) * .4);aspect-ratio:100/120;
  transform:translateX(-50%) !important;transition:opacity .2s;z-index:1}
.target.runner svg{animation:bob .32s ease-in-out infinite alternate}
.target.runner.flip svg{scale:-1 1}
.target.runner.hit svg{animation:none}
.target.runner.down{opacity:0}
@keyframes bob{to{translate:0 -6%}}

/* Byen: jeres huse */
#app{--hw:min(31vw,42vh)}
#app.theme-town .ground{height:46%;background:
  repeating-radial-gradient(circle at 30% 40%, rgba(0,0,0,.06) 0 2px, transparent 2px 7px),
  linear-gradient(#9a927c,#7c7563 60%,#6a6454)}
#app.theme-town .trees.far{bottom:46%}
#app.theme-town .trees.mid{bottom:42%}
#app.theme-town .path{display:none}
#app.theme-town .sign{bottom:44%}
.house{position:absolute;bottom:6%;width:var(--hw);aspect-ratio:1/1.2;transform:translateX(-50%);
  background:repeating-linear-gradient(90deg, rgba(0,0,0,.2) 0 2px, transparent 2px 9%), var(--wall,#8a6a45);
  border:3px solid #2e2116;border-bottom:0;box-shadow:0 10px 0 -4px rgba(0,0,0,.25)}
.house.h1{--wall:#7f7b68}
.house.h2{--wall:#946f4b}
.house .roof{position:absolute;left:-9%;right:-9%;bottom:100%;height:28%;background:linear-gradient(#4a4c45,#33352f);
  clip-path:polygon(50% 0,100% 100%,0 100%);pointer-events:none}
.house .floor{position:absolute;left:0;right:0;bottom:48%;height:6px;background:#2e2116;pointer-events:none}
.spot.win,.spot.door{aspect-ratio:3/4;background:#17130e;border:4px solid #2e2116}
.spot.door{aspect-ratio:3/5;border-bottom:0}
.spot.win .pop{left:4%;right:4%;top:6%;height:94%}
.spot.win .cover{height:30%}
.spot.door .pop{left:6%;right:6%;top:14%;height:86%}
.spot.door .cover{height:36%}
@media (max-width:560px){ #app{--hw:min(32.5vw,42vh)} }

/* rapport-layout */
.stats{grid-template-columns:repeat(4,1fr)}
@media (max-width:560px){
  .stats{grid-template-columns:repeat(2,1fr)}
  .reportgrid .hankbig{width:auto}
  .reportgrid .say::after{left:-14px;top:auto;bottom:18px;margin:0;border:10px solid transparent;border-right-color:var(--airsoft);border-left:0}
  .reportgrid .say{font-size:16px;padding:10px 12px}
  .stars.big{font-size:30px}
}

/* ---------- v4: våbenskab, nat, tracere, rekorder ---------- */
.float,.puff{z-index:6}
.target.tag{left:8%;right:8%;top:0}
.wlabel{position:absolute;left:12px;top:-24px;font-family:var(--mono);font-size:11px;letter-spacing:.05em;text-transform:uppercase;
  color:var(--light);text-shadow:0 1px 3px rgba(0,0,0,.9);pointer-events:none}
.mag.dense{gap:2px}
.mag.dense .bb{max-width:8px;height:22px}
#dark{position:absolute;left:50%;top:45%;width:3200px;height:3200px;margin:-1600px 0 0 -1600px;pointer-events:none;z-index:3;
  background:radial-gradient(circle, rgba(255,244,210,.07) 0 80px, rgba(4,7,14,.5) 140px, rgba(4,7,14,.93) 200px)}
#dark[hidden]{display:none}
#glows{position:absolute;inset:0;pointer-events:none;z-index:4;overflow:hidden}
.glow{position:absolute;left:0;top:0;width:10px;height:10px;margin:-5px 0 0 -5px;border-radius:50%;transition:opacity .12s}
.glow.eye{background:#ffe27a;box-shadow:0 0 6px 2px #ffd23a,0 0 16px 5px rgba(255,210,58,.45)}
.glow.blue{width:12px;height:20px;margin:-10px 0 0 -6px;border-radius:5px;background:#b8dcff;box-shadow:0 0 12px 6px rgba(80,150,255,.9),0 0 30px 10px rgba(80,150,255,.45)}
#tracers{position:absolute;inset:0;width:100%;height:100%;pointer-events:none;z-index:4}
#tracers line{stroke:#8dff74;stroke-width:3;stroke-linecap:round;filter:drop-shadow(0 0 4px #4f4);animation:trc .26s linear forwards}
@keyframes trc{from{opacity:1}to{opacity:0}}
#app.night .sky{background:radial-gradient(circle at 82% 14%, #eef0dc 0 16px, rgba(238,240,220,.18) 17px 34px, transparent 35px),
  radial-gradient(1px 1px at 20% 20%, #fff 50%, transparent 51%),radial-gradient(1px 1px at 40% 10%, #fff 50%, transparent 51%),
  radial-gradient(1px 1px at 60% 26%, #fff 50%, transparent 51%),radial-gradient(1px 1px at 12% 34%, #fff 50%, transparent 51%),
  linear-gradient(#0a111f,#16223a 60%,#1d283a)}
#app.night .trees,#app.night .ground,#app.night .path,#app.night .sign{filter:brightness(.5) saturate(.7)}

.wpnlist{display:grid;gap:8px;margin-top:14px;text-align:left}
.wpn{display:grid;gap:3px;padding:12px 14px;background:var(--bg);border:1px solid var(--line);border-left:4px solid var(--line);
  color:var(--light);text-align:left;cursor:pointer;font-family:var(--body)}
.wpn.on{border-left-color:var(--airsoft);background:oklch(23% 0.03 135)}
.wpn:focus-visible{outline:3px solid #ffe08a;outline-offset:2px}
.wpn .wn{font-family:var(--display);font-size:22px;text-transform:uppercase;line-height:1.1}
.wpn .wd{font-size:15px;color:var(--soft);line-height:1.35}
.wpn .wf{font-family:var(--mono);font-size:11px;letter-spacing:.04em;text-transform:uppercase;color:var(--airsoft)}
#upgList{list-style:none;margin:6px 0 16px;padding:0;display:grid;gap:6px;text-align:left}
#upgList li{display:grid;grid-template-columns:22px 1fr;gap:1px 8px;padding:8px 10px;border:1px dashed var(--line);color:var(--soft);font-size:14px}
#upgList li::before{content:"🔒";grid-row:span 2;font-size:13px}
#upgList li.on{border-style:solid;color:var(--light)}
#upgList li.on::before{content:"✓";color:var(--airsoft);font-weight:700}
#upgList b{font-family:var(--mono);font-size:12px;letter-spacing:.04em;text-transform:uppercase}
.unlock{border:1px solid #e0b23a;background:oklch(25% 0.05 85);color:var(--light);padding:10px 12px;margin:0 0 14px;font-size:15px;text-align:left}
.maplinks{display:flex;justify-content:center;gap:4px;flex-wrap:wrap}
.level.nightlvl{border-left-color:#7fb4ff}
.level.nightlvl .num{color:#7fb4ff}
.tabs{display:flex;flex-wrap:wrap;gap:6px;justify-content:center;margin:14px 0 10px}
.tabs button{font-family:var(--mono);font-size:11px;letter-spacing:.05em;text-transform:uppercase;padding:8px 10px;background:transparent;
  color:var(--soft);border:1px solid var(--line);cursor:pointer}
.tabs button.on{background:var(--airsoft);color:var(--bg);border-color:var(--airsoft)}
.reclist{list-style:none;margin:0 0 16px;padding:0;text-align:left}
.reclist li{display:grid;grid-template-columns:30px 1fr auto;gap:0 10px;align-items:baseline;padding:8px 4px;border-bottom:1px solid var(--line)}
.reclist .pos{font-family:var(--display);font-size:20px;color:var(--airsoft);grid-row:span 2}
.reclist .pts{font-family:var(--display);font-size:22px}
.reclist .st{color:#e0b23a;text-align:right}
.reclist .wp,.reclist .dt2{font-family:var(--mono);font-size:11px;text-transform:uppercase;color:var(--soft)}
.reclist .dt2{text-align:right}
.reclist .empty{display:block;color:var(--soft);padding:12px 0}

/* ---------- v5: pause, liggende mobil ---------- */
.pausecard{width:min(380px,100%)}
.pausecard .col{display:grid;gap:10px;margin-top:18px}
.pausecard .btn{width:100%}
@media (max-height:520px) and (orientation:landscape){
  :root{--strip:50px}
  .hud{padding:6px 10px}
  .avatar{width:42px;height:42px}
  .bubble{font-size:13px;padding:5px 9px}
  .dt{min-width:50px;padding:12px 6px 4px}
  .dt b{font-size:18px}
  .dt span{font-size:9px}
  #bossbar{top:62px;width:min(40vw,300px)}
  .strip{padding:6px 10px calc(6px + env(safe-area-inset-bottom,0px))}
  .bb{height:20px}
  .btn{padding:10px 16px}
  .card{padding:12px 14px 14px}
  .logo{font-size:30px}
  .briefgrid{grid-template-columns:minmax(90px,24%) 1fr;margin-top:8px}
  .hankbig img{max-height:42vh;width:auto;margin:0 auto}
  .say{min-height:0;font-size:16px;padding:10px 12px}
  .reportgrid{grid-template-columns:20% 1fr}
  .stats{grid-template-columns:repeat(4,1fr);margin:8px 0}
  .stats b{font-size:22px}
  .wlabel{top:-20px}
  #cameo{width:min(26vw,220px)}
  .levels{grid-template-columns:1fr 1fr}
}
[data-voice][hidden]{display:none !important}
.magbar{flex:1;height:14px;background:oklch(97% 0.004 90 / .12);border:1px solid var(--line);min-width:40px}
.magbar i{display:block;height:100%;background:linear-gradient(90deg,#c99a3a,#f3d488);transition:width .08s}
.magnum{font-family:var(--display);font-size:20px;color:var(--light);min-width:58px;text-align:right;font-weight:400}
.splashcard{width:min(520px,100%)}
.splashimg{margin:14px auto 18px;width:min(78%,360px)}
.splashimg img{width:100%;display:block;transform:scaleX(-1);filter:drop-shadow(0 10px 18px rgba(0,0,0,.5))}