:root{--bg:#0b1020;--panel:#121a2f;--panel2:#17213b;--text:#edf2ff;--muted:#a7b0c8;--accent:#74d3ae;--accent2:#6aa8ff;--danger:#ff7b7b;--border:rgba(255,255,255,.11)}*{box-sizing:border-box}body{margin:0;background:radial-gradient(circle at top left,#1e335f 0,#0b1020 42%,#080b14 100%);color:var(--text);font-family:Inter,system-ui,-apple-system,Segoe UI,sans-serif}.hero{display:flex;justify-content:space-between;gap:1rem;align-items:flex-end;padding:1.15rem clamp(1rem,4vw,3rem) .75rem}.eyebrow{color:var(--accent);text-transform:uppercase;letter-spacing:.14em;font-size:.72rem;font-weight:800;margin:0 0 .4rem}.hero h1{font-size:clamp(1.8rem,5vw,3.6rem);line-height:.92;margin:0}.sub{max-width:760px;color:var(--muted);font-size:1rem;margin:.55rem 0 0}.hero-actions{display:flex;gap:.6rem;flex-wrap:wrap}main{padding:0 clamp(1rem,4vw,3rem) 3rem}.stats{display:grid;grid-template-columns:repeat(4,1fr);gap:.8rem;margin:.9rem 0}.stat,.panel{background:linear-gradient(180deg,rgba(255,255,255,.07),rgba(255,255,255,.035));border:1px solid var(--border);border-radius:18px;box-shadow:0 16px 50px rgba(0,0,0,.22);backdrop-filter:blur(8px)}.stat{padding:1rem}.stat span{display:block;font-size:1.65rem;font-weight:800}.stat small{color:var(--muted);text-transform:uppercase;letter-spacing:.08em}.panel{padding:1rem}.filters{display:grid;grid-template-columns:repeat(4,1fr);gap:.8rem;margin:.9rem 0 1rem}.grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:1rem}.charts{grid-template-columns:minmax(0,1fr) minmax(0,1fr);margin-top:1rem}.map-panel{padding:0;overflow:hidden}.hero-map{margin-bottom:.9rem}#map{height:min(72vh,760px);min-height:430px;background:#e5e7eb}.panel h2{margin:.1rem 0 .75rem}.hint,.empty{color:var(--muted);font-size:.92rem}label{display:grid;gap:.3rem;color:var(--muted);font-size:.82rem;font-weight:700}input,select,textarea{width:100%;border:1px solid var(--border);background:#0d1428;color:var(--text);border-radius:11px;padding:.62rem .7rem;font:inherit}textarea{resize:vertical}.two{display:grid;grid-template-columns:1fr 1fr;gap:.6rem}form{display:grid;gap:.65rem}button{border:0;border-radius:999px;background:linear-gradient(135deg,var(--accent),#b8ffd9);color:#07130f;font-weight:850;padding:.72rem 1rem;cursor:pointer}.ghost{background:transparent;color:var(--text);border:1px solid var(--border)}.danger{color:var(--danger)}.table-wrap{overflow:auto}table{width:100%;border-collapse:collapse;min-width:850px}th,td{text-align:left;border-bottom:1px solid var(--border);padding:.75rem .55rem;vertical-align:top}th{color:var(--muted);font-size:.78rem;text-transform:uppercase;letter-spacing:.07em}td{font-size:.92rem}.mode-pill{display:inline-block;border-radius:999px;padding:.16rem .48rem;background:rgba(116,211,174,.14);border:1px solid rgba(116,211,174,.25);color:#b8ffd9}.leaflet-popup-content-wrapper,.leaflet-popup-tip{background:#10182e;color:var(--text)}.leaflet-container a{color:#8dbbff}@media(max-width:900px){.hero{display:block}.stats,.filters,.grid,.charts{grid-template-columns:minmax(0,1fr)}.hero-actions{margin-top:1rem}.two{grid-template-columns:1fr}#map{height:min(62vh,520px);min-height:380px}}@media(max-width:520px){.stats{grid-template-columns:1fr 1fr}.hero{padding-top:1.2rem}.panel{border-radius:14px}.stat span{font-size:1.25rem}}
.note-card{margin:.8rem 0;padding:.85rem;border:1px solid var(--border);border-radius:14px;background:rgba(255,255,255,.045)}.note-card p{margin:.35rem 0 0;color:var(--muted)}code{background:#0d1428;border:1px solid var(--border);padding:.08rem .32rem;border-radius:6px;color:#b8ffd9}
/* Mobile/layout hardening */
.grid > *, .charts > *, .panel, .map-panel, .table-wrap { min-width: 0; }
.leaflet-container { overflow: hidden; max-width: 100%; }
.charts canvas { display: block; max-width: 100% !important; width: 100% !important; }
@media(max-width:900px){
  body { overflow-x: hidden; }
  .charts .panel { width: 100%; overflow: hidden; }
  #map { width: 100%; height: min(62vh, 460px); }
}

@media(max-width:900px){.charts{width:100%;max-width:100%;}.charts .panel{max-width:100%;height:300px}.charts canvas{height:220px!important;max-height:220px!important;}}

.leaflet-container{background:#e5e7eb!important}.leaflet-tile{background:#e5e7eb!important}.leaflet-tile-error{display:none!important}
/* Critical Leaflet layout rules, kept local so map tiles don't depend on CDN CSS applying. */
.leaflet-container{position:relative;overflow:hidden;background:#e5e7eb!important;outline-offset:1px;-webkit-tap-highlight-color:transparent;}
.leaflet-pane,.leaflet-tile,.leaflet-marker-icon,.leaflet-marker-shadow,.leaflet-tile-container,.leaflet-pane>svg,.leaflet-pane>canvas,.leaflet-zoom-box,.leaflet-image-layer,.leaflet-layer{position:absolute;left:0;top:0;}
.leaflet-tile{width:256px;height:256px;user-select:none;-webkit-user-drag:none;background:#e5e7eb!important;}
.leaflet-tile-loaded{visibility:inherit;}
.leaflet-map-pane canvas{z-index:100;}.leaflet-tile-pane{z-index:200;}.leaflet-overlay-pane{z-index:400;}.leaflet-shadow-pane{z-index:500;}.leaflet-marker-pane{z-index:600;}.leaflet-tooltip-pane{z-index:650;}.leaflet-popup-pane{z-index:700;}
.leaflet-control{position:relative;z-index:800;pointer-events:auto;}.leaflet-top,.leaflet-bottom{position:absolute;z-index:1000;pointer-events:none;}.leaflet-top{top:0}.leaflet-right{right:0}.leaflet-bottom{bottom:0}.leaflet-left{left:0}.leaflet-control{float:left;clear:both}.leaflet-right .leaflet-control{float:right}.leaflet-top .leaflet-control{margin-top:10px}.leaflet-bottom .leaflet-control{margin-bottom:10px}.leaflet-left .leaflet-control{margin-left:10px}.leaflet-right .leaflet-control{margin-right:10px}

#map canvas,.leaflet-container canvas{max-width:none!important;width:auto!important;height:auto!important;max-height:none!important;}

.build{color:#74d3ae;font-size:.78rem;font-weight:800;letter-spacing:.08em;margin:.2rem 0 0;text-transform:uppercase}

.price-label-anchor{background:transparent!important;border:0!important;}
.price-label{transform:translateZ(0);min-width:86px;text-align:center;background:rgba(15,23,42,.9);color:#fff;border:2px solid var(--label-color,#74d3ae);border-radius:999px;padding:3px 8px;box-shadow:0 2px 8px rgba(0,0,0,.35);font-size:11px;line-height:1.1;white-space:nowrap;}
.price-label strong{display:block;font-size:12px}.price-label span{display:block;color:#dbeafe;font-size:10px;margin-top:1px}.price-label .speed-line{color:#b8ffd9;font-weight:800;font-size:10px}.price-label.compact{min-width:0;padding:4px 7px}.price-label.compact span{font-size:11px;margin-top:0;color:#fff}
.speed-detail{display:inline-block;margin-top:3px;color:#b8ffd9;font-size:12px;font-weight:750}
@media(max-width:520px){.price-label{min-width:74px;font-size:10px;padding:2px 6px}.price-label strong{font-size:11px}.price-label span{font-size:9px}}

.rank-list{list-style:none;margin:0;padding:0;display:grid;gap:.65rem}.rank-list li{display:grid;grid-template-columns:auto 1fr auto;gap:.65rem;align-items:center;padding:.72rem;border:1px solid var(--border);border-radius:14px;background:rgba(255,255,255,.045)}.rank-list .rank{color:var(--accent);font-weight:900}.rank-list strong{display:block}.rank-list small{display:block;color:var(--muted);margin-top:.12rem}.rank-list .price{text-align:right;font-weight:900;white-space:nowrap}.insights{margin-top:1rem}
@media(max-width:900px){
  .hero{padding:.75rem 1rem .45rem}
  .eyebrow{font-size:.62rem;margin-bottom:.25rem}
  .hero h1{font-size:clamp(1.65rem,9vw,2.4rem)}
  .sub{font-size:.86rem;margin:.35rem 0 0;line-height:1.25}
  .build{font-size:.62rem}
}
@media(max-width:520px){
  .sub{display:none}
  .hero-actions{margin-top:.55rem}
  #map{height:64vh;min-height:390px}
}

.stat-detail{display:block;margin-top:.25rem;color:var(--muted);font-size:.78rem;font-style:normal;line-height:1.2}.fx-note{margin:.1rem 0 1rem;color:var(--muted);font-size:.8rem}.panel-sub{margin:-.45rem 0 .75rem;color:var(--muted);font-size:.82rem}
/* Chart.js needs a firm container height on every viewport; otherwise responsive canvases can grow indefinitely. */
.charts .panel{height:320px;overflow:hidden;display:flex;flex-direction:column}
.charts canvas{height:220px!important;max-height:220px!important;min-height:0!important;flex:0 0 220px}
