/* ============================================================
   Mineval Harita — map.mineval.net
   Kimi kimliği (mineval.net / wiki.mineval.net ile aynı tokenlar)
   ============================================================ */

:root{
  --bg:#160f1d;
  --bg-2:#1c1325;
  --card:#211829;
  --card-2:#281d33;
  --line:rgba(244,169,196,.13);
  --line-2:rgba(244,169,196,.26);
  --ink:#f7eef3;
  --muted:#c0abc4;
  --muted-2:#93799b;
  --sakura:#f4a9c4;
  --sakura-soft:#ffc4d6;
  --sakura-deep:#e75480;
  --sakura-dark:#b23a5e;
  --gold:#e9b94e;
  --gold-soft:#f6d788;
  --gold-deep:#c08f2b;
  --jade:#5fc99b;
  --red:#e06161;
  --red-soft:#f09393;
  --r-lg:18px;
  --r-md:13px;
  --r-sm:9px;
  --shadow:0 14px 40px rgba(8,4,14,.45);
  --font-ui:"Manrope",system-ui,-apple-system,"Segoe UI",sans-serif;
  --font-display:"Noto Serif",Georgia,serif;
  /* squaremap'in render ettiği derin su rengiyle birebir aynı (tile kenarları
     görünmez birleşsin diye ölçülerek seçildi); karartma .sea-dim ile yapılır */
  --ocean:#2e4eaf;
}

*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html,body{height:100%}
body{
  font-family:var(--font-ui);
  background:var(--bg);
  color:var(--ink);
  font-size:15px;
  overflow:hidden;
}
a{color:var(--sakura);text-decoration:none}
a:hover{color:var(--sakura-soft)}
button{font-family:inherit;cursor:pointer;border:none;background:none;color:inherit}
::selection{background:rgba(231,84,128,.4)}

/* ============ Harita tuvali ============ */
#map{position:fixed;inset:0}
.leaflet-container{
  background:var(--ocean);
  font-family:var(--font-ui);
}
.leaflet-container:focus{outline:none}

/* büyütmede (zoom > 3) keskin piksel görünümü */
.overzoom .leaflet-tile{image-rendering:pixelated}
/* hub 5x ölçekli tek görüntü — her zoom'da büyütülmüş, hep pixelated */
.hub-overlay{image-rendering:pixelated}

/* ekran-uzayı vinyet (dünya koordinatına bağlı değil) */
.vignette{
  position:fixed;inset:0;pointer-events:none;z-index:900;
  background:radial-gradient(120% 120% at 50% 50%, transparent 62%, rgba(8,4,14,.38));
}

/* ============ Yüzer başlık (sol üst) ============ */
.map-header{
  position:fixed;top:16px;left:16px;z-index:1100;
  display:flex;align-items:center;gap:16px;
  padding:10px 16px 10px 12px;
  background:rgba(22,15,29,.82);
  backdrop-filter:blur(12px);
  -webkit-backdrop-filter:blur(12px);
  border:1px solid var(--line);
  border-radius:var(--r-md);
  box-shadow:var(--shadow);
}
.brand{display:flex;align-items:center;gap:11px;flex:none}
.brand img{width:40px;height:40px;display:block;filter:drop-shadow(0 3px 8px rgba(231,84,128,.35))}
.brand-name{font-family:var(--font-display);font-size:19px;font-weight:900;letter-spacing:.3px;line-height:1.1;color:var(--ink)}
.brand-name em{font-style:normal;color:var(--sakura)}
.brand-tag{font-size:10px;letter-spacing:.24em;text-transform:uppercase;color:var(--muted-2);font-weight:800}
.head-links{display:flex;gap:12px;border-left:1px solid var(--line);padding-left:16px}
.head-links a{font-size:12.5px;font-weight:700;color:var(--muted)}
.head-links a:hover{color:var(--sakura)}

/* ============ Panel düğmesi (sağ üst) ============ */
.panel-btn{
  position:fixed;top:16px;right:16px;z-index:1101;
  display:flex;align-items:center;gap:9px;
  padding:10px 14px;
  background:rgba(22,15,29,.82);
  backdrop-filter:blur(12px);
  -webkit-backdrop-filter:blur(12px);
  border:1px solid var(--line);
  border-radius:var(--r-md);
  box-shadow:var(--shadow);
  font-size:13px;font-weight:700;color:var(--ink);
}
.panel-btn:hover{border-color:var(--line-2)}
.panel-btn .chev{width:15px;height:15px;transition:transform .2s;color:var(--muted)}
.panel-btn[aria-expanded="false"] .chev{transform:rotate(180deg)}
.dot-mini{width:8px;height:8px;border-radius:50%;background:var(--muted-2);flex:none}
.dot-mini.ok{background:var(--jade);box-shadow:0 0 8px rgba(95,201,155,.6)}
.dot-mini.warn{background:var(--gold)}
.dot-mini.bad{background:var(--red)}

/* ============ Panel (sağ üst, düğmenin altı) ============ */
.panel{
  position:fixed;top:66px;right:16px;z-index:1100;
  width:300px;
  padding:14px;
  background:rgba(22,15,29,.88);
  backdrop-filter:blur(14px);
  -webkit-backdrop-filter:blur(14px);
  border:1px solid var(--line);
  border-radius:var(--r-md);
  box-shadow:var(--shadow);
}
.panel.closed{display:none}

.stat-grid{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.stat{
  background:var(--card);
  border:1px solid var(--line);
  border-radius:var(--r-sm);
  padding:9px 11px;
  display:flex;flex-direction:column;gap:2px;
}
.stat-label{
  font-size:10px;font-weight:800;letter-spacing:.08em;text-transform:uppercase;
  color:var(--muted-2);
}
.stat-val{font-family:var(--font-display);font-size:20px;font-weight:700;color:var(--ink);line-height:1.2}
.stat-val.gold{color:var(--gold)}
.stat-val.ok{color:var(--jade)}
.stat-val.warn{color:var(--gold)}
.stat-val.bad{color:var(--red)}
.dots{display:flex;gap:5px;margin-top:3px}
.dot{width:8px;height:8px;border-radius:50%;background:var(--red);transition:background .3s}
.dot.live{background:var(--jade)}

.toggles{display:flex;flex-direction:column;gap:2px;margin-top:11px;border-top:1px solid var(--line);padding-top:11px}
.tog{
  display:flex;align-items:center;gap:10px;
  padding:6px 4px;border-radius:7px;
  font-size:13.5px;font-weight:600;color:var(--muted);
  cursor:pointer;user-select:none;
}
.tog:hover{background:rgba(244,169,196,.05);color:var(--ink)}
.tog input{position:absolute;opacity:0;width:0;height:0}
.switch{
  width:36px;height:20px;border-radius:10px;flex:none;
  background:var(--card-2);
  border:1px solid var(--line-2);
  position:relative;transition:background .2s,border-color .2s;
}
.switch::after{
  content:"";position:absolute;top:2px;left:2px;
  width:14px;height:14px;border-radius:50%;
  background:var(--muted-2);
  transition:transform .2s,background .2s;
}
.tog input:checked + .switch{background:var(--sakura-deep);border-color:var(--sakura-deep)}
.tog input:checked + .switch::after{transform:translateX(16px);background:var(--ink)}
.tog input:focus-visible + .switch{outline:2px solid var(--sakura);outline-offset:2px}

.panel-note{margin-top:10px;font-size:11px;color:var(--muted-2)}

/* ============ Ada etiketleri ============ */
.island-label{width:0;height:0;overflow:visible;pointer-events:none}
.island-label span{
  position:absolute;transform:translate(-50%,-50%);
  font-family:var(--font-display);font-weight:900;
  font-size:22px;letter-spacing:.12em;white-space:nowrap;
  color:rgba(247,238,243,.92);
  text-shadow:0 2px 14px rgba(8,4,14,.85),0 0 4px rgba(8,4,14,.6);
  transition:opacity .25s;
}
.island-label.minor span{font-size:13px;letter-spacing:.2em;opacity:.8;text-transform:uppercase}
.z-near .island-label span{opacity:0}
.z-far .island-label span{font-size:12px;letter-spacing:.14em}
.z-far .island-label.minor span{font-size:9px}

/* ============ Oyuncu noktası + balonu ============ */
.p-dot{
  background:var(--sakura);
  border:2px solid rgba(22,15,29,.85);
  border-radius:50%;
  box-shadow:0 0 10px rgba(244,169,196,.65);
}
.leaflet-tooltip.p-tip,
.leaflet-tooltip.claim-tip{
  background:var(--card);
  border:1px solid var(--line-2);
  color:var(--ink);
  border-radius:var(--r-sm);
  box-shadow:var(--shadow);
  padding:7px 10px;
  font-family:var(--font-ui);
}
.leaflet-tooltip.p-tip::before,
.leaflet-tooltip.claim-tip::before{display:none}
.p-name{display:block;font-weight:800;font-size:13px;letter-spacing:.02em}
.p-row{display:flex;align-items:center;gap:6px;margin-top:5px}
.p-ico{width:12px;height:12px;flex:none}
.p-ico.hp{fill:var(--red)}
.p-ico.ar{fill:var(--gold)}
.p-bar{
  display:inline-block;width:72px;height:6px;border-radius:3px;overflow:hidden;
  background:rgba(255,255,255,.12);
}
.p-bar span{display:block;height:100%;border-radius:3px}
.p-bar.hp span{background:linear-gradient(90deg,var(--red),var(--red-soft))}
.p-bar.ar span{background:linear-gradient(90deg,var(--gold-deep),var(--gold-soft))}
.claim-tip{font-size:12.5px;font-weight:700}

/* ============ Leaflet kontrolleri (koyu tema) ============ */
.leaflet-bar{border:1px solid var(--line-2) !important;box-shadow:var(--shadow) !important;border-radius:var(--r-sm) !important;overflow:hidden}
.leaflet-bar a{
  background:rgba(22,15,29,.88) !important;
  color:var(--ink) !important;
  border-bottom:1px solid var(--line) !important;
  width:32px !important;height:32px !important;line-height:32px !important;
}
.leaflet-bar a:hover{background:var(--card-2) !important}
.leaflet-bar a:last-child{border-bottom:none !important}
.leaflet-bar a.leaflet-disabled{color:var(--muted-2) !important}
.leaflet-control-attribution{
  background:rgba(22,15,29,.6) !important;
  color:var(--muted-2) !important;
  font-size:10px !important;
  padding:2px 6px;
}
.leaflet-control-attribution a{color:var(--muted) !important}

/* ============ noscript ============ */
.noscript-msg{
  position:fixed;top:50%;left:50%;transform:translate(-50%,-50%);z-index:1200;
  background:var(--card);border:1px solid var(--line-2);border-radius:var(--r-md);
  padding:18px 26px;box-shadow:var(--shadow);font-weight:700;
}

/* ============ Mobil (≤640px) ============ */
@media (max-width:640px){
  .map-header{top:10px;left:10px;padding:8px 12px 8px 10px}
  .brand img{width:34px;height:34px}
  .brand-name{font-size:16.5px}
  .head-links{display:none}

  .panel-btn{
    top:auto;right:8px;bottom:8px;left:8px;
    justify-content:space-between;
    padding:12px 14px;
  }
  .panel-btn .chev{transform:rotate(180deg)}
  .panel-btn[aria-expanded="true"] .chev{transform:rotate(0)}
  .panel{
    top:auto;right:8px;bottom:56px;left:8px;width:auto;
    max-height:60vh;overflow:auto;
  }
  .leaflet-bottom.leaflet-left{bottom:52px}
}

/* ============ Hareket azaltma ============ */
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{transition:none !important;animation:none !important}
}