:root { --panel:#111713; --panel2:#18211b; --text:#f1f5f2; --muted:#aab5ad; --accent:#df3c32; }
* { box-sizing:border-box; }
html, body { width:100%; height:100%; margin:0; overflow:hidden; font-family:Arial,Helvetica,sans-serif; background:#0b0f0c; color:var(--text); }
.topbar { position:fixed; z-index:1000; top:0; left:0; right:0; height:64px; display:flex; justify-content:space-between; align-items:center; padding:0 18px; background:rgba(14,19,15,.94); border-bottom:1px solid rgba(255,255,255,.12); backdrop-filter:blur(8px); }
.brand { font-weight:900; letter-spacing:.12em; font-size:22px; }
.subtitle { font-size:10px; color:var(--muted); letter-spacing:.18em; margin-top:2px; }
.menu-button { display:none; border:1px solid rgba(255,255,255,.2); background:#202921; color:#fff; border-radius:6px; width:40px; height:38px; font-size:20px; cursor:pointer; }
.sidebar { position:fixed; z-index:900; top:64px; bottom:0; left:0; width:250px; padding:20px 16px; background:rgba(17,23,19,.96); border-right:1px solid rgba(255,255,255,.12); }
.sidebar h2 { margin:0 0 18px; font-size:17px; }
.sidebar hr { border:0; border-top:1px solid rgba(255,255,255,.12); margin:18px 0; }
.filter-row { display:flex; align-items:center; gap:10px; padding:10px 8px; border-radius:6px; cursor:pointer; }
.filter-row:hover { background:rgba(255,255,255,.06); }
.filter-row input { width:17px; height:17px; }
.dot { width:13px; height:13px; border-radius:50%; box-shadow:0 0 0 2px rgba(255,255,255,.15); }
.dot.military { background:#d94135; }
.dot.event { background:#f0a52b; }
.help { color:var(--muted); line-height:1.45; font-size:13px; }
#map { position:fixed; top:64px; left:250px; right:0; bottom:0; background:#090c0a; }
.coordinates { position:fixed; z-index:850; right:14px; bottom:14px; padding:9px 12px; background:rgba(12,16,13,.9); border:1px solid rgba(255,255,255,.16); border-radius:6px; font:600 13px monospace; }
.custom-marker { background:transparent; border:0; }
.marker-pin { width:34px; height:34px; border-radius:50% 50% 50% 0; transform:rotate(-45deg); border:2px solid #fff; box-shadow:0 3px 10px rgba(0,0,0,.65); display:grid; place-items:center; }
.marker-pin span { transform:rotate(45deg); font-size:16px; }
.marker-military { background:#d94135; }
.marker-event { background:#f0a52b; }
.popup-card { min-width:210px; }
.popup-card h3 { margin:0 0 8px; font-size:16px; }
.popup-card .type { display:inline-block; margin-bottom:9px; padding:3px 7px; border-radius:10px; background:#263128; font-size:11px; font-weight:bold; text-transform:uppercase; }
.popup-card p { margin:5px 0; line-height:1.35; }
.popup-card .coords { color:#69776d; font-family:monospace; font-weight:bold; }
.leaflet-control-attribution { display:none; }
.leaflet-popup-content-wrapper, .leaflet-popup-tip { background:#f3f5f3; color:#151a16; }
@media (max-width:760px) {
  .menu-button { display:block; }
  .sidebar { width:260px; transform:translateX(-100%); transition:transform .2s ease; box-shadow:8px 0 25px rgba(0,0,0,.35); }
  .sidebar.open { transform:translateX(0); }
  #map { left:0; }
  .coordinates { bottom:10px; right:10px; font-size:12px; }
}

.map-status {
  position: fixed;
  left: 236px;
  bottom: 12px;
  z-index: 1000;
  padding: 7px 10px;
  border: 1px solid #334038;
  border-radius: 6px;
  background: rgba(8, 13, 10, 0.9);
  color: #b9c4bd;
  font: 12px/1.2 Arial, sans-serif;
}
@media (max-width: 720px) { .map-status { left: 12px; bottom: 54px; } }
.filter-section { margin: 0 0 18px; }
.filter-section h3 { margin: 0 0 8px; font-size: 12px; letter-spacing: 1.5px; color: #d9e2ea; }
.filter-row small { margin-left: auto; opacity: .7; }
.filter-row.disabled { opacity: .42; cursor: default; }
.dot.bunker { background:#c89b55; }.dot.caves { background:#9a7bc3; }.dot.contaminated { background:#a7d34b; }.dot.vehicles { background:#5cb8d8; }
.labeled-marker { background: transparent; border: 0; overflow: visible; }
.marker-label { position:absolute; left:50%; bottom:31px; transform:translateX(-50%); white-space:nowrap; font-size:10px; font-weight:700; letter-spacing:.2px; color:#fff; background:rgba(10,14,18,.82); border:1px solid rgba(255,255,255,.18); padding:2px 5px; border-radius:4px; text-shadow:0 1px 2px #000; pointer-events:none; }

/* Compact event markers: labels appear only on hover. */
.compact-marker { background: transparent; border: 0; }
.marker-dot {
  width: 18px;
  height: 18px;
  border-radius: 50%;
  border: 2px solid #fff;
  box-shadow: 0 2px 7px rgba(0,0,0,.75);
  display: grid;
  place-items: center;
  transition: transform .12s ease, filter .12s ease;
}
.marker-dot span {
  color: #fff;
  font-size: 10px;
  line-height: 1;
}
.compact-marker:hover .marker-dot {
  transform: scale(1.25);
  filter: brightness(1.12);
}
.leaflet-tooltip {
  background: rgba(10,14,12,.94);
  color: #fff;
  border: 1px solid rgba(255,255,255,.18);
  border-radius: 4px;
  box-shadow: 0 3px 10px rgba(0,0,0,.5);
  font-size: 11px;
  font-weight: 700;
  padding: 4px 7px;
}
.leaflet-tooltip-top:before { border-top-color: rgba(10,14,12,.94); }
.label-symbol { width:22px; height:18px; display:inline-grid; place-items:center; border-radius:4px; background:#26342d; color:#eef5f0; font:700 10px/1 Arial,sans-serif; border:1px solid rgba(255,255,255,.13); }
.settlement-icon { background:transparent; border:0; overflow:visible; pointer-events:none; }
.settlement-label { position:absolute; left:50%; top:50%; transform:translate(-50%,-50%); white-space:nowrap; color:#f4f0db; text-shadow:-1px -1px 0 #172019,1px -1px 0 #172019,-1px 1px 0 #172019,1px 1px 0 #172019,0 2px 3px rgba(0,0,0,.85); font-family:Arial,sans-serif; letter-spacing:.25px; pointer-events:none; }
.settlement-capital .settlement-label { font-size:15px; font-weight:800; text-transform:uppercase; }
.settlement-city .settlement-label { font-size:12px; font-weight:800; }
.settlement-village .settlement-label { font-size:10px; font-weight:700; }
.settlement-local .settlement-label { font-size:9px; font-weight:600; color:#dedbc9; }
.dot.lost{background:#f0a52b}.dot.military-containers{background:#d94135}.dot.port-containers{background:#2b9bc7}.dot.an2{background:#d7c444}.dot.oil{background:#777}.marker-lost_scientist .marker-dot{background:#f0a52b}.marker-military_containers .marker-dot{background:#d94135}.marker-port_containers .marker-dot{background:#2b9bc7}.marker-an2_crash .marker-dot{background:#d7c444}.marker-oil_rig .marker-dot{background:#777}.marker-caves .marker-dot{background:#9a7bc3}


/* Vanilla military bases: red outlined circle with diagonal slash. */
.military-base-icon { background:transparent; border:0; }
.military-base-symbol {
  width:100%; height:100%; border:3px solid #e33b32; border-radius:50%;
  position:relative; background:rgba(227,59,50,.08);
  box-shadow:0 2px 9px rgba(0,0,0,.65), inset 0 0 8px rgba(227,59,50,.2);
}
.military-base-symbol span {
  position:absolute; left:10%; right:10%; top:50%; height:3px;
  background:#e33b32; transform:translateY(-50%) rotate(-45deg);
  border-radius:2px; box-shadow:0 1px 2px rgba(0,0,0,.5);
}
.military-base-small .military-base-symbol { border-width:2px; }
.military-base-large .military-base-symbol { border-width:4px; }
.military-filter-symbol {
  width:16px; height:16px; border:2px solid #e33b32; border-radius:50%; position:relative; flex:0 0 16px;
}
.military-filter-symbol:after {
  content:''; position:absolute; left:1px; right:1px; top:5px; height:2px; background:#e33b32; transform:rotate(-45deg);
}


/* Contaminated areas */
.contaminated-icon { background:transparent; border:0; }
.contaminated-symbol {
  width:100%; height:100%; border-radius:50%; display:grid; place-items:center;
  color:#dfff59; border:2px solid #b7e83f; background:rgba(100,140,25,.28);
  box-shadow:0 0 12px rgba(183,232,63,.65),0 3px 8px rgba(0,0,0,.65);
}
.contaminated-symbol span { font-size:58%; line-height:1; filter:drop-shadow(0 1px 1px #000); }
.contaminated-static .contaminated-symbol { border-width:3px; background:rgba(110,145,30,.34); }
.contaminated-dynamic .contaminated-symbol { border-style:dashed; background:rgba(110,145,30,.18); }
.contaminated-filter-symbol { width:18px; height:18px; display:grid; place-items:center; border-radius:50%; color:#dfff59; border:2px solid #b7e83f; font-size:11px; line-height:1; flex:0 0 18px; }
.contaminated-filter-symbol.dynamic { border-style:dashed; opacity:.9; }


/* v1.0 Alpha architecture */
.section-toggle { width:100%; display:flex; align-items:center; justify-content:space-between; padding:0 0 8px; border:0; background:transparent; color:#d9e2ea; font-size:12px; font-weight:800; letter-spacing:1.5px; cursor:pointer; }
.section-toggle span { font-size:16px; color:#93a198; }
.section-body { overflow:hidden; max-height:900px; opacity:1; transition:max-height .2s ease, opacity .2s ease; }
.section-body.collapsed { max-height:0; opacity:0; }
.marker-bunkers .marker-dot { background:#c89b55; }
.sidebar { overflow-y:auto; scrollbar-width:thin; }



/* Sidebar legend icons */
.filter-icon {
  width:24px;
  height:24px;
  object-fit:contain;
  flex:0 0 24px;
  display:block;
  pointer-events:none;
}
.filter-icon-military-base { opacity:.65; }

/* Master switch for all map filters */
.filter-all {
  margin-bottom:18px;
  padding:10px 8px;
  background:rgba(255,255,255,.05);
  border:1px solid rgba(255,255,255,.10);
}
.filter-all strong {
  font-size:12px;
  letter-spacing:.4px;
}
.filter-all:hover { background:rgba(255,255,255,.09); }


/* GUIDE - No Build Zone */
.no-build-filter-symbol{
  width:18px;
  height:18px;
  flex:0 0 18px;
  border-radius:50%;
  border:2px solid #ff3434;
  background:rgba(255,52,52,.14);
  box-shadow:0 0 0 1px rgba(0,0,0,.35);
}


/* GUIDE - Loot Chest group */
.loot-chest-group{
  margin:0 0 8px;
  padding:0;
}

.loot-chest-master-row{
  margin:0;
  background:rgba(255,255,255,.045);
  border:1px solid rgba(255,255,255,.08);
}

.loot-chest-master-row strong{
  font-size:13px;
  font-weight:700;
}

.loot-chest-filter-symbol{
  width:18px;
  height:18px;
  flex:0 0 18px;
  display:grid;
  place-items:center;
  border-radius:4px;
  color:#e8bf35;
  font-size:12px;
  line-height:1;
}

.loot-chest-collapse{
  margin-left:auto;
  width:24px;
  height:24px;
  border:0;
  background:transparent;
  color:#aab5ad;
  font-size:16px;
  font-weight:800;
  cursor:pointer;
}

.loot-chest-subfilters{
  margin:4px 0 0 12px;
  padding-left:8px;
  border-left:1px solid rgba(255,255,255,.10);
  overflow:hidden;
  max-height:1400px;
  opacity:1;
  transition:max-height .2s ease, opacity .2s ease;
}

.loot-chest-subfilters.collapsed{
  max-height:0;
  opacity:0;
}

.loot-chest-subfilters .filter-row{
  padding:7px 6px;
  font-size:12px;
}

.loot-chest-subfilters .filter-icon{
  width:20px;
  height:20px;
  flex-basis:20px;
}


/* HiDEAD Right Location Panel - base */
.location-panel{
  position:fixed;
  top:0;
  right:0;
  bottom:0;
  left:auto;
  width:330px;
  z-index:1200;
  background:rgba(10,14,12,.98);
  border-left:1px solid rgba(255,255,255,.13);
  border-right:0;
  box-shadow:-14px 0 34px rgba(0,0,0,.35);
  color:#e8eee9;
  transform:translateX(102%);
  transition:transform .2s ease;
  overflow-y:auto;
}
.location-panel.open{
  transform:translateX(0);
}

.lp-head{
  padding:16px;
  display:flex;
  justify-content:space-between;
  align-items:flex-start;
  gap:12px;
  border-bottom:1px solid rgba(255,255,255,.09);
}
.lp-head small{
  color:#91a096;
  font-size:10px;
  font-weight:800;
  letter-spacing:1.8px;
}
.lp-head h2{
  margin:4px 0 0;
  font-size:20px;
  line-height:1.1;
}
.lp-head button{
  width:31px;
  height:31px;
  flex:0 0 31px;
  background:rgba(255,255,255,.05);
  border:1px solid rgba(255,255,255,.13);
  border-radius:5px;
  color:#eee;
  font-size:22px;
  line-height:27px;
  cursor:pointer;
}
.lp-head button:hover{
  background:rgba(255,255,255,.10);
}

.lp-image{
  display:block;
  width:100%;
  aspect-ratio:16/9;
  object-fit:cover;
  background:#050706;
  border-bottom:1px solid rgba(255,255,255,.09);
}

.lp-body{
  padding:16px;
}
.lp-body p{
  margin:0 0 16px;
  color:#b9c4bc;
  font-size:13px;
  line-height:1.5;
}
.lp-row{
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:12px;
  padding:11px 0;
  border-top:1px solid rgba(255,255,255,.08);
  border-bottom:1px solid rgba(255,255,255,.08);
}
.lp-row span,
.lp-coords span{
  font-size:10px;
  font-weight:800;
  letter-spacing:1.2px;
  color:#7f9085;
}
.lp-row strong{
  font-size:12px;
}

.lp-loot{
  padding:14px 0;
  border-bottom:1px solid rgba(255,255,255,.08);
}
.lp-section-title{
  display:block;
  margin-bottom:10px;
  color:#7f9085;
  font-size:10px;
  font-weight:800;
  letter-spacing:1.2px;
}
.lp-loot-grid{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:7px;
}
.lp-loot-grid span{
  padding:8px 9px;
  border:1px solid rgba(255,255,255,.09);
  border-radius:5px;
  background:rgba(255,255,255,.035);
  color:#dbe3dd;
  font-size:11px;
  line-height:1.2;
}

.lp-coords{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:10px;
  margin:15px 0 12px;
}
.lp-coords div{
  padding:10px;
  border:1px solid rgba(255,255,255,.09);
  border-radius:5px;
  background:rgba(255,255,255,.035);
}
.lp-coords strong{
  display:block;
  margin-top:5px;
  font:700 14px monospace;
}

#lpCopy{
  width:100%;
  padding:11px;
  border:1px solid rgba(170,190,176,.30);
  border-radius:5px;
  background:rgba(135,158,142,.11);
  color:#e9f0eb;
  font-size:11px;
  font-weight:800;
  letter-spacing:1px;
  cursor:pointer;
}
#lpCopy:hover{
  background:rgba(135,158,142,.20);
}

@media(max-width:760px){
  .location-panel{
    width:min(330px,88vw);
  }
}


/* GUIDE - Loot Tiers */
.loot-tiers-group{
  margin:0 0 8px;
  padding:0;
}

.loot-tiers-master-row{
  margin:0;
  background:rgba(255,255,255,.045);
  border:1px solid rgba(255,255,255,.08);
}

.loot-tiers-master-row strong{
  font-size:13px;
  font-weight:700;
}

.loot-tiers-filter-symbol{
  width:18px;
  height:18px;
  flex:0 0 18px;
  border-radius:50%;
  background:conic-gradient(
    #2ecc71 0 20%,
    #3498db 20% 40%,
    #f1c40f 40% 60%,
    #e74c3c 60% 80%,
    #9b59b6 80% 100%
  );
  border:1px solid rgba(255,255,255,.18);
}

.loot-tiers-collapse{
  margin-left:auto;
  width:24px;
  height:24px;
  border:0;
  background:transparent;
  color:#aab5ad;
  font-size:16px;
  font-weight:800;
  cursor:pointer;
}

.loot-tiers-subfilters{
  margin:4px 0 0 12px;
  padding-left:8px;
  border-left:1px solid rgba(255,255,255,.10);
  overflow:hidden;
  max-height:500px;
  opacity:1;
  transition:max-height .2s ease, opacity .2s ease;
}

.loot-tiers-subfilters.collapsed{
  max-height:0;
  opacity:0;
}

.loot-tiers-subfilters .filter-row{
  padding:7px 6px;
  font-size:12px;
}

.tier-filter-dot{
  width:16px;
  height:16px;
  flex:0 0 16px;
  border-radius:50%;
  border:2px solid currentColor;
  background:currentColor;
  opacity:.88;
}

.tier-filter-dot.tier1{color:#2ecc71;}
.tier-filter-dot.tier2{color:#3498db;}
.tier-filter-dot.tier3{color:#f1c40f;}
.tier-filter-dot.tier4{color:#e74c3c;}
.tier-filter-dot.unique{color:#9b59b6;}

/* Prevent browser focus rectangle when clicking No Build Zone SVG polygons. */
.no-build-zone-shape:focus {
  outline: none !important;
}
