/* Try the map page (review copy) */
.mp-hero{padding:96px 0 6px;text-align:center;background:linear-gradient(180deg,#f3f8ff,#fff)}
.mp-hero h1{margin:0 0 6px;font-size:clamp(1.5rem,2.6vw,2.2rem);font-weight:500;letter-spacing:-.045em;color:var(--navy,#0f2a5c);line-height:1.02}
.mp-hero p{margin:0 auto;max-width:760px;font-size:clamp(.95rem,1.2vw,1.05rem);color:#52677e;line-height:1.4}
.mp-bar{display:flex;gap:14px 24px;justify-content:center;align-items:center;flex-wrap:wrap;margin:12px auto 8px}
.mp-seg{display:inline-flex;background:#eaf1fc;border-radius:999px;padding:4px;gap:2px}
.mp-seg button{border:0;background:transparent;font:inherit;font-size:15px;font-weight:600;color:#36587c;padding:8px 18px;border-radius:999px;cursor:pointer;transition:.2s}
.mp-seg button.on{background:#2467e8;color:#fff;box-shadow:0 4px 12px rgba(36,103,232,.35)}
.mp-chips{display:flex;gap:8px;flex-wrap:wrap;justify-content:center}
.mp-chips button{border:1.5px solid #cfdcf0;background:#fff;font:inherit;font-size:14px;font-weight:600;color:#36587c;padding:6px 13px;border-radius:999px;cursor:pointer;display:inline-flex;align-items:center;gap:8px}
.mp-chips button i{width:10px;height:10px;border-radius:50%;display:inline-block}
.mp-chips button.on{border-color:#2467e8;background:#eaf1ff;color:#0f2a5c}
.mp-main{padding:12px 0 50px}
.mp-grid{display:grid;grid-template-columns:minmax(0,1.7fr) minmax(320px,1fr);gap:22px;align-items:start}
.mp-mapbox{position:relative;background:#f3f8ff;border:1px solid #dbe7f7;border-radius:24px;overflow:hidden;box-shadow:0 18px 50px rgba(25,76,144,.1)}
.mp-svg{display:block;width:100%;height:calc(100vh - 345px);min-height:360px;max-height:640px;cursor:grab;touch-action:none}
.mp-svg:active{cursor:grabbing}
.mp-svg path{stroke:#fff;stroke-width:.25;vector-effect:non-scaling-stroke;transition:fill .25s}
.mp-svg path:hover{stroke:#0f2a5c;stroke-width:1.2}
.mp-svg path.sel{stroke:#0f2a5c;stroke-width:2.2}
.mp-tools{position:absolute;top:12px;left:12px;display:flex;gap:8px;align-items:center;flex-wrap:wrap}
.mp-tools select,.mp-tools button{font:inherit;font-size:14px;font-weight:600;border:1px solid #cfdcf0;background:#fff;color:#0f2a5c;border-radius:12px;padding:9px 12px;cursor:pointer}
.mp-zoom{position:absolute;right:12px;top:12px;display:flex;flex-direction:column;gap:6px}
.mp-zoom button{width:38px;height:38px;border-radius:12px;border:1px solid #cfdcf0;background:#fff;font-size:22px;font-weight:600;color:#0f2a5c;cursor:pointer}
.mp-tip{position:absolute;pointer-events:none;background:#0f2a5c;color:#fff;font-size:14px;padding:8px 12px;border-radius:10px;white-space:nowrap;transform:translate(-50%,-130%);z-index:3}
.mp-tip[hidden]{display:none}
.mp-leg{display:flex;align-items:center;gap:6px 14px;flex-wrap:wrap;padding:10px 16px;font-size:13px;color:#52677e;border-top:1px solid #dbe7f7;background:#fff}
.mp-lg{display:inline-flex;align-items:center;gap:6px;font-weight:600;color:#36587c}.mp-lg i{width:11px;height:11px;border-radius:50%;display:inline-block;height:11px;width:11px;}
.mp-panel{position:sticky;top:96px;background:#fff;border:1px solid #dbe7f7;border-radius:24px;padding:26px;box-shadow:0 18px 50px rgba(25,76,144,.1)}
.mp-hint{text-align:center;color:#52677e;font-size:18px;line-height:1.5;padding:34px 8px}
.mp-hint b{display:block;color:#0f2a5c;font-size:24px;font-weight:500;margin-bottom:8px;letter-spacing:-.02em}
.mp-hint img{width:84px;height:84px;margin-bottom:10px}
.mp-panel h2{margin:0;font-size:28px;font-weight:500;letter-spacing:-.03em;color:#0f2a5c}
.mp-when{margin:2px 0 14px;font-size:15px;color:#6b7f95}
.mp-types{display:grid;gap:8px;margin:0 0 16px}
.mp-type{display:flex;align-items:center;gap:12px;padding:12px 14px;border:1.5px solid #dbe7f7;border-radius:14px;background:#fff;cursor:pointer;font:inherit;text-align:left}
.mp-type.on{border-color:#2467e8;background:#eef4ff}
.mp-type i{width:12px;height:12px;border-radius:50%;flex:none}
.mp-type b{font-size:17px;font-weight:600;color:#0f2a5c;flex:1}
.mp-type span{font-size:17px;color:#36587c;font-variant-numeric:tabular-nums}
.mp-qty{margin:6px 0 4px;display:flex;justify-content:space-between;align-items:baseline;font-size:16px;color:#36587c}
.mp-qty b{font-size:30px;color:#0f2a5c;font-weight:600;letter-spacing:-.02em}
.mp-panel input[type=range]{width:100%;accent-color:#2467e8;margin:6px 0 12px}
.mp-quick{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:14px}
.mp-quick button{border:1.5px solid #cfdcf0;background:#fff;border-radius:999px;padding:7px 14px;font:inherit;font-size:14px;font-weight:600;color:#36587c;cursor:pointer}
.mp-price{display:flex;justify-content:space-between;align-items:center;padding:14px 16px;background:#f3f8ff;border-radius:14px;margin-bottom:14px;font-size:16px;color:#36587c}
.mp-price b{font-size:28px;color:#0f2a5c;font-weight:600}
.mp-email{width:100%;padding:15px 18px;border:1.5px solid #cfdcf0;border-radius:14px;font:inherit;font-size:17px;margin-bottom:12px;box-sizing:border-box}
.mp-buy{width:100%;border:0;border-radius:999px;background:#2467e8;color:#fff;font:inherit;font-size:19px;font-weight:600;padding:17px;cursor:pointer;box-shadow:0 10px 26px rgba(36,103,232,.35)}
.mp-buy:disabled{opacity:.5;cursor:not-allowed;box-shadow:none}
.mp-msg{margin:10px 0 0;font-size:14px;color:#b42318;min-height:1px}
.mp-fine{margin:12px 0 0;font-size:13px;color:#6b7f95;line-height:1.45;text-align:center}
.mp-none{padding:20px 6px;color:#52677e;font-size:17px;line-height:1.5}
.mp-loading{font-size:14px;color:#6b7f95;margin:0 0 8px}
@media(max-width:900px){.mp-svg{height:auto;aspect-ratio:975/610;max-height:none}.mp-grid{grid-template-columns:1fr}.mp-panel{position:static}.mp-hero{padding-top:100px}.mp-seg button{padding:10px 12px;font-size:14px}}

.mp-svg .mp-states{fill:none;stroke:#0f2a5c;stroke-width:1.3;vector-effect:non-scaling-stroke;pointer-events:none;stroke-linejoin:round;opacity:.85}

/* panel matches the map height and is compact */
.mp-grid{align-items:start}
.mp-svg{flex:none;height:calc(100vh - 340px);min-height:390px;max-height:none}
.mp-panel{position:static;height:calc(100vh - 300px);min-height:430px;box-sizing:border-box;overflow-y:auto;scrollbar-width:none;padding:14px 18px;display:flex;flex-direction:column;justify-content:flex-start}
.mp-panel::-webkit-scrollbar{display:none}
.mp-panel h2{font-size:22px}
.mp-when{margin:0 0 8px;font-size:14px}
.mp-types{gap:5px;margin:0 0 8px}
.mp-type{padding:6px 12px;border-radius:11px}
.mp-type b,.mp-type span{font-size:15px}
.mp-qty{margin:2px 0 0;font-size:14px}.mp-qty b{font-size:24px}
.mp-panel input[type=range]{margin:2px 0 8px}
.mp-quick{margin-bottom:6px;gap:6px}.mp-quick button{padding:4px 12px;font-size:13px}
.mp-price{padding:7px 14px;margin-bottom:6px;font-size:14px}.mp-price b{font-size:22px}
.mp-email{padding:9px 14px;font-size:15px;margin-bottom:6px;border-radius:12px}
.mp-buy{padding:11px;font-size:17px}
.mp-fine{margin:6px 0 0;font-size:11.5px;line-height:1.35}
.mp-hint{padding:10px 8px;font-size:16px}.mp-hint b{font-size:21px}.mp-hint img{width:60px;height:60px}
.mp-msg{margin:6px 0 0;min-height:0}
@media(max-width:900px){.mp-svg{height:auto;min-height:0;aspect-ratio:975/610}.mp-panel{height:auto;min-height:0}}

.mp-panel>.mp-hint{margin:auto 0}
@media(max-height:780px){.mp-fine,.mp-when{display:none}.mp-panel{min-height:410px;padding:10px 16px}.mp-svg{min-height:370px}.mp-panel h2{font-size:20px;margin-bottom:6px}.mp-type{padding:4px 12px}.mp-qty b{font-size:22px}.mp-price{padding:5px 14px}.mp-email{padding:7px 14px}.mp-buy{padding:9px}}

/* the panel always takes exactly the height of the map box */
.mp-grid{align-items:stretch}
.mp-side{position:relative;min-width:0}
.mp-side .mp-panel{position:absolute;inset:0;height:auto;min-height:0}
@media(max-width:900px){.mp-side .mp-panel{position:static}}

.mp-leg{flex-wrap:nowrap;white-space:nowrap;overflow:hidden}.mp-leg #mpNote{overflow:hidden;text-overflow:ellipsis}
@media(max-width:900px){.mp-leg{flex-wrap:wrap;white-space:normal}}

.mp-svg path.dim{opacity:.32}
.mp-svg.mp-us path{cursor:pointer}
.mp-stripe{background:repeating-linear-gradient(45deg,#1d4fc4 0 3px,#f5a524 3px 6px,#17b8a0 6px 9px)!important}

.mp-svg path{transition:fill .25s,opacity .35s}
.mp-svg path.dim{opacity:.18}
.mp-svg:not(.mp-us) path.dim{stroke:none}

.mp-type{position:relative}
.mp-ck{width:18px;height:18px;border-radius:5px;border:2px solid #b6c6e2;flex:none;background:#fff;position:relative}
.mp-type.on .mp-ck{background:#2467e8;border-color:#2467e8}
.mp-type.on .mp-ck:after{content:"";position:absolute;left:4px;top:0;width:5px;height:10px;border:solid #fff;border-width:0 2.5px 2.5px 0;transform:rotate(45deg)}
.mp-qty small{font-size:12px;color:#6b7f95;font-weight:500}

.mp-hs{margin:0 0 8px}
.mp-hs>span{display:block;font-size:12px;font-weight:700;letter-spacing:.04em;text-transform:uppercase;color:#6b7f95;margin-bottom:5px}
.mp-hsb{display:grid;grid-template-columns:repeat(4,1fr);gap:5px}
.mp-hsb button{border:1.5px solid #cfdcf0;background:#fff;border-radius:10px;padding:5px 2px;font:inherit;font-size:13px;font-weight:700;color:#36587c;cursor:pointer;display:flex;flex-direction:column;align-items:center;line-height:1.15}
.mp-hsb button small{font-size:11px;font-weight:500;color:#6b7f95}
.mp-hsb button.on{border-color:#2467e8;background:#eef4ff;color:#0f2a5c}
.mp-hsb button:disabled{opacity:.4;cursor:not-allowed}

.mp-api{margin:8px 0 0;text-align:center;font-size:13px;color:#52677e}.mp-api a{color:#2467e8;font-weight:700;text-decoration:underline}
@media(max-height:780px){.mp-api{margin-top:6px;font-size:12px}}

@media(max-height:780px){.mp-quick{display:none}.mp-hs{margin-bottom:6px}.mp-hs>span{display:none}.mp-hsb button{flex-direction:row;gap:5px;justify-content:center;padding:4px 2px}.mp-hsb button small{font-size:11px}}

/* hail size is information only, not a filter */
.mp-hsb{grid-template-columns:repeat(3,1fr)}
.mp-hsp{border:1.5px dashed #cfdcf0;background:#f7faff;border-radius:10px;padding:5px 2px;text-align:center;line-height:1.15}
.mp-hsp b{display:block;font-size:13px;font-weight:700;color:#36587c}
.mp-hsp small{font-size:11px;color:#6b7f95}
.mp-hsp.none{opacity:.45}
@media(max-height:780px){.mp-hsp{display:flex;gap:5px;justify-content:center;padding:4px 2px}.mp-hsp b{display:inline;font-size:12px}}

.mp-rad{font-style:normal;font-weight:600;font-size:11px;letter-spacing:.02em;color:#5b6b86;background:#eef3fb;border:1px solid #d8e3f5;border-radius:999px;padding:1px 8px;margin-left:6px;white-space:nowrap}

/* ---- checkout window ---- */
.mc{position:fixed;inset:0;z-index:300;background:rgba(10,25,60,.55);display:flex;align-items:flex-start;justify-content:center;overflow:auto;padding:90px 16px 40px}
.mc[hidden]{display:none}
.mc__card{position:relative;width:100%;max-width:480px;background:#fff;border-radius:22px;padding:28px 26px 24px;box-shadow:0 30px 80px rgba(10,25,60,.4);color:#0f2a5c}
.mc__x{position:absolute;right:12px;top:8px;border:0;background:none;font-size:30px;line-height:1;color:#5b6b86;cursor:pointer;padding:6px 10px}
.mc__card h3{margin:0 0 12px;font-size:24px;letter-spacing:-.02em}
.mc__sum{display:grid;grid-template-columns:1fr auto;gap:2px 12px;background:#f3f8ff;border:1px solid #d8e3f5;border-radius:14px;padding:12px 14px;margin-bottom:14px;font-size:14px}
.mc__sum b{grid-column:1/2;font-size:15px}.mc__sum span{color:#5b6b86;font-size:13px;grid-column:1/2}.mc__sum .mc__p{grid-column:2/3;grid-row:1/3;align-self:center;font-size:22px;font-weight:700;color:#0f2a5c}
.mc__p2{margin:0 0 14px;color:#41537a;font-size:14.5px;line-height:1.5}
.mc__note{margin:0 0 10px;color:#9a6a0a;font-size:13.5px}
.mc__f{display:grid;gap:10px}
.mc__f input{width:100%;padding:13px 16px;border:1.5px solid #9fb6e6;border-radius:999px;font:inherit;font-size:15px;color:#0f2a5c;background:#fff}
.mc__f input:focus{outline:2px solid #bcd0f7;border-color:#1d4fc4}
.mc__go{display:block;width:100%;text-align:center;border:0;border-radius:999px;background:#2467e8;color:#fff;font:inherit;font-weight:700;font-size:16px;padding:14px;cursor:pointer;text-decoration:none;margin-top:6px}
.mc__go:disabled{opacity:.55;cursor:wait}
.mc__err{color:#b42318;font-size:13.5px;margin:10px 0 0;line-height:1.45}.mc__err[hidden]{display:none}
.mc__fine{margin:12px 0 0;color:#6b7b99;font-size:12.5px;line-height:1.45}
.mc__pay{min-height:120px;margin-bottom:6px}
.mc__key{display:flex;gap:8px;align-items:center;background:#0f2a5c;border-radius:12px;padding:10px 12px;margin-bottom:12px}
.mc__key code{flex:1;color:#dbe7ff;font:12.5px/1.4 ui-monospace,Menlo,monospace;word-break:break-all}
.mc__key button{border:1px solid #6f8fd6;background:transparent;color:#fff;border-radius:999px;padding:6px 14px;font:inherit;font-size:13px;cursor:pointer}
.mc__lnk{background:none;border:0;color:#1d4fc4;text-decoration:underline;cursor:pointer;font:inherit;padding:0}
.mc__bar{height:10px;background:#e6eefc;border-radius:99px;overflow:hidden;margin:6px 0 12px}.mc__bar i{display:block;height:100%;width:6%;background:#2467e8;border-radius:99px;transition:width .3s}
