/* Warm enamel, ink and brass. Preserve the original responsive HUD geometry. */
:root{--jz-ivory:#fff5df;--jz-ink:#243d45;--jz-teal:#347d7d;--jz-gold:#efb751;--jz-coral:#d96851;--jz-edge:rgba(255,250,231,.84);--jz-shadow:0 3px 0 rgba(42,47,43,.16),0 6px 16px rgba(13,36,44,.18)}
.hud .pill,.hud .zoomwrap,.hud .fxpill{color:var(--jz-ink);background:linear-gradient(165deg,#fff9ec,#f6e9d0);border:1px solid var(--jz-edge);box-shadow:var(--jz-shadow);backdrop-filter:none;font-variant-numeric:tabular-nums}
.hud .pill{border-radius:16px}.hud .zoomwrap{border-radius:16px}
.zoomfill{background:linear-gradient(90deg,#4eafac,#9ad5be,#edbf59);background-size:100% 100%}
.mult-badge{background:var(--jz-teal);animation:none}
.btn{border:1px solid rgba(255,249,228,.45);box-shadow:0 4px 0 rgba(42,31,20,.22),0 8px 20px rgba(22,27,30,.15);transition:filter .15s ease,transform .12s ease}
.btn:active{transform:translateY(2px)}
.btn.play{background:linear-gradient(165deg,#ffe0a1,#efb751);color:#352e22}
.btn.ghost{border-color:rgba(255,249,228,.28)}
button:focus-visible{outline:3px solid #55c9d0;outline-offset:3px}
#mapView .kartehint{font-size:11px;padding:5px 9px;max-width:calc(100% - 16px)}
#mapView .mapdetail{background:rgba(21,53,60,.65);border:1px solid rgba(255,249,228,.2);border-radius:16px}
#mapView .mapmeta{font-size:11px}.mapregionlive{color:#fff5df}
#mapView .mapregions button.active{background:var(--jz-ivory);color:var(--jz-ink);box-shadow:inset 0 -3px 0 var(--jz-gold)}
#mapLevelPins button:focus-visible{background:rgba(255,240,177,.25);outline:3px solid #44bbc2}
@media(prefers-reduced-motion:reduce){.btn,.zoomfill{transition:none}.mult-badge,.zoomwrap.full .zoomfill,.zoomwrap.full .zoomico,.zoomwrap.zooming{animation:none!important}}