:root{
  --bg:#0e1410;
  --panel:rgba(18,24,20,.86);
  --panel-b:rgba(200,160,74,.28);
  --gold:#c8a04a;
  --gold-l:#e2c074;
  --txt:#f4f0e6;
  --mut:rgba(244,240,230,.65);
  --shadow:0 30px 80px rgba(0,0,0,.55);
  --r:14px;
}
*{box-sizing:border-box}
html,body{margin:0;padding:0;height:100%;background:var(--bg);color:var(--txt);font-family:Inter,system-ui,-apple-system,Segoe UI,Roboto,sans-serif;-webkit-font-smoothing:antialiased}
button{font:inherit;color:inherit;border:0;background:transparent;cursor:pointer}

#map{position:fixed;inset:0;background:#0a0d0a}

/* Top bar */
.top{
  position:fixed;top:14px;left:14px;right:14px;z-index:10;
  display:flex;justify-content:space-between;gap:14px;flex-wrap:wrap;
  pointer-events:none;
}
.top > *{pointer-events:auto}
.top-l{
  background:var(--panel);backdrop-filter:blur(10px);
  border:1px solid var(--panel-b);border-radius:var(--r);
  padding:10px 16px;box-shadow:var(--shadow);
}
.brand{font-family:'Fraunces',Georgia,serif;font-weight:700;font-size:1.05rem;color:var(--gold-l);letter-spacing:.02em}
.lead{font-size:.78rem;color:var(--mut);margin-top:2px}
.top-r{display:flex;gap:8px;flex-wrap:wrap}
.btn{
  background:var(--panel);backdrop-filter:blur(10px);
  border:1px solid var(--panel-b);border-radius:var(--r);
  padding:9px 14px;font-size:.86rem;color:var(--txt);
  box-shadow:var(--shadow);transition:.18s;
  text-decoration:none;display:inline-flex;align-items:center;gap:6px
}
.btn:hover{border-color:var(--gold);color:#fff}
.btn[data-on="true"]{background:rgba(200,160,74,.18);border-color:var(--gold);color:#fff}
.btn-call{background:linear-gradient(135deg,#c8a04a,#a5832d);border-color:transparent;color:#1a1308;font-weight:600}
.btn-call:hover{filter:brightness(1.06)}

/* Legend */
.legend{
  position:fixed;left:14px;bottom:14px;z-index:10;
  background:var(--panel);backdrop-filter:blur(10px);
  border:1px solid var(--panel-b);border-radius:var(--r);
  padding:12px 14px;box-shadow:var(--shadow);
  display:flex;flex-direction:column;gap:6px;min-width:220px;max-width:240px;
}
.legend-title{font-size:.72rem;color:var(--mut);text-transform:uppercase;letter-spacing:.12em;margin-bottom:4px}
.lg{display:flex;align-items:center;gap:10px;padding:6px 8px;border-radius:8px;font-size:.85rem;color:var(--txt);text-align:left;transition:.15s}
.lg:hover{background:rgba(255,255,255,.05)}
.lg.is-on{background:rgba(200,160,74,.16);outline:1px solid rgba(200,160,74,.4)}
.lg .sw{width:14px;height:14px;border-radius:4px;flex-shrink:0}
.lg b{margin-left:auto;font-size:.78rem;color:var(--mut);font-weight:500;font-variant-numeric:tabular-nums}
.lg.is-off{opacity:.35}

/* Card */
.card{
  position:fixed;right:14px;top:78px;z-index:20;width:300px;
  background:var(--panel);backdrop-filter:blur(10px);
  border:1px solid var(--panel-b);border-radius:var(--r);
  padding:18px;box-shadow:var(--shadow);
}
.card-close{position:absolute;top:8px;right:10px;font-size:1.4rem;color:var(--mut);width:28px;height:28px;border-radius:8px}
.card-close:hover{background:rgba(255,255,255,.06);color:#fff}
.card-cat{
  display:inline-block;font-size:.7rem;letter-spacing:.1em;text-transform:uppercase;
  padding:4px 10px;border-radius:99px;background:rgba(200,160,74,.18);color:var(--gold-l);margin-bottom:10px
}
.card-num{font-family:'Fraunces',Georgia,serif;font-size:1.6rem;line-height:1.1;color:#fff;margin-bottom:14px}
.card-row{display:flex;justify-content:space-between;padding:7px 0;border-top:1px solid rgba(255,255,255,.06);font-size:.85rem;color:var(--mut)}
.card-row b{color:var(--txt);font-weight:500;font-variant-numeric:tabular-nums}
.card-row--big{padding:14px 0;border-top:1px solid rgba(200,160,74,.25);margin-top:6px}
.card-row--big span{font-size:.78rem;color:var(--mut);text-transform:uppercase;letter-spacing:.1em}
.card-row--big b{font-family:'Fraunces',Georgia,serif;font-size:1.4rem;color:var(--gold-l)}
.card-cta{
  display:block;text-align:center;margin-top:14px;
  background:linear-gradient(135deg,#c8a04a,#a5832d);color:#1a1308;font-weight:600;
  padding:11px;border-radius:10px;text-decoration:none;transition:.15s
}
.card-cta:hover{filter:brightness(1.07)}

/* Tooltips inside MapLibre popup */
.maplibregl-popup-content{
  background:var(--panel)!important;color:var(--txt)!important;
  border:1px solid var(--panel-b);border-radius:10px!important;
  padding:8px 11px!important;font-size:.82rem!important;
  box-shadow:0 12px 32px rgba(0,0,0,.5);
  backdrop-filter:blur(8px);
}
.maplibregl-popup-tip{display:none}
.tt-row{display:flex;justify-content:space-between;gap:14px;line-height:1.35}
.tt-row b{color:var(--gold-l);font-variant-numeric:tabular-nums}

/* Mobile */
@media (max-width:760px){
  .top{top:8px;left:8px;right:8px}
  .top-l{padding:8px 12px}
  .brand{font-size:.95rem}
  .legend{left:8px;right:8px;bottom:8px;max-width:none;min-width:0;flex-direction:row;flex-wrap:wrap;gap:4px;padding:8px}
  .legend-title{width:100%}
  .lg{padding:4px 7px;font-size:.74rem;gap:6px}
  .lg b{display:none}
  .card{top:auto;bottom:74px;right:8px;left:8px;width:auto}
}

/* MapLibre cleanup */
.maplibregl-ctrl-attrib,
.maplibregl-ctrl-logo{display:none!important}
.maplibregl-ctrl-top-right{top:78px}
