*{box-sizing:border-box;font-family:system-ui,-apple-system,BlinkMacSystemFont,sans-serif}
body{margin:0;background:#f4f6f8;color:#222}
.container{max-width:1100px;margin:6vh auto;background:#fff;padding:22px;border-radius:12px;box-shadow:0 10px 25px rgba(0,0,0,.08)}
.container.narrow{max-width:520px}
h1{margin:0 0 10px}
p{margin:8px 0}
label{display:block;margin:10px 0 6px;font-weight:700}
input,select,button{width:100%;padding:12px;border:1px solid #ccc;border-radius:10px;font-size:15px}
button{background:#0078d4;color:#fff;border:none;cursor:pointer}
button:hover{background:#005fa3}
button.secondary{background:#e9eef6;color:#113; border:1px solid #cfd8ea}
button.secondary:hover{background:#dde6f5}
button:disabled{opacity:.55;cursor:not-allowed}
.error{margin-top:10px;color:#b00020;font-weight:700}
.small{font-size:13px;color:#666}
.row{display:flex;gap:12px;flex-wrap:wrap;align-items:flex-start}
.card{background:#fafafa;border:1px solid #e9e9e9;border-radius:12px;padding:14px;flex:1;min-width:280px}
.kpi{display:flex;gap:10px;flex-wrap:wrap;margin:8px 0 0}
.pill{background:#eef6ff;border:1px solid #d6e9ff;border-radius:999px;padding:8px 12px;font-weight:800}
hr{border:0;border-top:1px solid #e7e7e7;margin:18px 0}
.inline{display:flex;gap:10px;flex-wrap:wrap}
.inline>div{flex:1;min-width:170px}
.controls{display:flex;gap:10px;flex-wrap:wrap;margin-top:10px}
.controls button{flex:1;min-width:120px}
#map{height:72vh;min-height:420px;border-radius:12px;border:1px solid #e2e2e2}
.mapToolbar{
  position:absolute; left:12px; right:12px; bottom:12px;
  display:flex; gap:10px; flex-wrap:wrap;
  background:rgba(255,255,255,.92);
  border:1px solid rgba(0,0,0,.08);
  border-radius:14px;
  padding:10px;
  backdrop-filter: blur(6px);
}
.mapWrap{position:relative}
.mapToolbar button{width:auto; padding:10px 14px; border-radius:12px}
.planeIcon{width:22px;height:22px;transform-origin:11px 11px}
.planeIcon svg{width:22px;height:22px;display:block}


/* v34: Reliable two-column layout */
.row{ display:flex; gap:16px; align-items:flex-start; }
.col-left{ width:300px; flex-shrink:0; }
.col-right{ flex:1; min-width:0; }

@media (max-width: 900px){
  .row{ display:block; }
  .col-left,.col-right{ width:100%; }
}

/* Map sizing */
.map-wrap{ position:relative; }
#map{ height: 70vh; min-height: 520px; border-radius: 14px; }
@media (max-width: 900px){ #map{ height: 60vh; min-height: 420px; } }

/* Fullscreen overlay controls */
.map-overlay{
  position:absolute;
  top:12px; left:12px;
  z-index:9999;
  display:flex;
  gap:8px;
  padding:10px;
  border-radius:12px;
  background: rgba(255,255,255,0.92);
  box-shadow: 0 8px 18px rgba(0,0,0,0.12);
}

/* Bigger Start Over button */
#startOverBtn{ font-size:1.1rem; padding:14px 18px; margin-top:10px; width:100%; }




/* v35: More breathing room */
.card { padding: 18px; }
.card-subtle { padding: 16px; margin-top: 16px; }
label { margin-top: 10px; }
select, input[type="date"] { margin-top: 6px; }
.inline { gap: 14px; }
.pills { margin-bottom: 14px; }
.flyover-controls { margin-top: 10px; }


/* v36: Vertical spacing for Play / Pause / Reset buttons */
.flyover-controls {
  display: flex;
  gap: 10px;
  margin-top: 12px;
}

.flyover-controls button {
  margin-bottom: 6px;
}

/* Fullscreen overlay spacing */
.map-overlay button {
  margin-right: 6px;
}


/* v38: Centered, prominent title */
.topbar {
  display: flex;
  justify-content: center;
  align-items: center;
  padding: 14px 16px;
}

.topbar .brand {
  font-size: 1.4rem;
  font-weight: 600;
  text-align: center;
}


/* v40: Larger centered title */
.topbar .brand{
  font-size: 2.1rem;
}
@media (max-width: 600px){
  .topbar .brand{ font-size: 1.7rem; }
}