.demo-map-panel{margin:24px 0;padding:24px;border:1px solid #ffffff14;border-radius:30px;background:linear-gradient(145deg,#142338,#101627);color:#f4f7ff;box-shadow:0 20px 50px #0002}
.demo-map-heading{display:flex;justify-content:space-between;gap:15px;align-items:center}.demo-map-heading h2{font:700 24px 'Space Grotesk',sans-serif;margin:8px 0;letter-spacing:-.7px}
.demo-map-kicker{font-size:9px;letter-spacing:1.8px;color:#47eaff;font-weight:800}.demo-map-chip{padding:8px 12px;border-radius:99px;color:#47eaff;border:1px solid #47eaff44;background:#47eaff0a;font-size:11px;font-weight:800}
.demo-map-description{font-size:12px;line-height:1.7;color:#a1b0c7;margin:12px 0}.demo-map-frame{overflow:hidden;border-radius:22px;border:1px solid #ffffff20;background:#e7ebee;height:330px}.demo-map-frame iframe{display:block;width:100%;height:100%;border:0}.demo-map-caption{font-size:10px;margin:9px 3px 22px}
.demo-gps-card{display:flex;align-items:center;justify-content:space-between;gap:18px;margin:14px 0;padding:14px 16px;border:1px solid #47eaff30;border-radius:18px;background:#0b1728}.demo-gps-card>div:first-child{display:grid;gap:5px;min-width:0}.demo-gps-card strong{font:600 12px 'Space Grotesk',sans-serif;color:#e5f8ff}.demo-gps-card small{color:#91a5bd;font-size:10px}.demo-gps-card [data-state=success]{color:#7affa4}.demo-gps-card [data-state=error]{color:#ff9caf}.demo-gps-card [data-state=loading]{color:#ffe265}.demo-gps-card .button{display:inline-flex;align-items:center;justify-content:center;text-decoration:none}.demo-gps-card button:disabled{cursor:wait;opacity:.6}
.demo-map-toolbar{display:flex;align-items:flex-end;justify-content:space-between;gap:18px}.demo-map-toolbar label{display:flex;flex-direction:column;gap:8px;font-size:11px;color:#bbc8dc}.demo-map-toolbar select{border:1px solid #34415b;color:#f4f7ff;background:#0c1425;padding:11px 14px;border-radius:14px;max-width:100%;font:inherit}.demo-map-actions{display:flex;gap:8px;flex-wrap:wrap}.demo-map-actions button{font-size:12px}
.demo-map-illustration{position:relative;margin:22px 0 10px;background:radial-gradient(ellipse at 50% 55%,#47eaff0d,transparent 65%),#0c1425;border-radius:22px;border:1px solid #ffffff09;overflow:hidden}.demo-map-illustration svg{width:100%;display:block;margin-top:16px}.demo-map-illustration-label{display:block;padding:16px 16px 0;font-size:8px;letter-spacing:1.2px;color:#8499b4}
.demo-map-summary{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;padding:12px 3px}.demo-map-summary small{display:block;color:#9badc5;font-size:10px;margin-bottom:7px}.demo-map-summary strong{font:600 13px 'Space Grotesk',sans-serif;color:#d5fbea}
.demo-map-panel progress{display:block;width:100%;height:6px;border:0;border-radius:99px;overflow:hidden;accent-color:#23f778;background:#243149}.demo-map-panel progress::-webkit-progress-bar{background:#243149}.demo-map-panel progress::-webkit-progress-value{background:linear-gradient(90deg,#47eaff,#23f778)}
@media(max-width:640px){.demo-map-panel{padding:18px;border-radius:24px}.demo-map-frame{height:270px}.demo-gps-card,.demo-map-toolbar{flex-direction:column;align-items:stretch}.demo-gps-card .demo-map-actions{display:grid;grid-template-columns:1fr 1fr}.demo-gps-card .button{width:100%}.demo-map-toolbar select{width:100%}.demo-map-summary{grid-template-columns:1fr 1fr}.demo-map-heading h2{font-size:21px}.demo-map-summary strong{font-size:12px}}