.locations-workspace {
 --loc-panel:#172531;
 --loc-line:#364b5a;
 --loc-muted:#b6cbd9;
 --loc-ice:#a8dff3;
 --loc-warm:#ffb485;
 width:min(100%,1322px);
 max-width:none;
 padding:26px 36px 44px;
 color:#f1f6fc;
}
.locations-workspace [hidden] { display:none !important; }
.locations-workspace :is(a,button,input):focus-visible { outline:2px solid var(--loc-ice); outline-offset:2px; }
.locations-intro { display:flex; align-items:center; justify-content:space-between; gap:18px; padding:6px 0 22px; border-bottom:1px solid var(--loc-line); margin-bottom:18px; }
.locations-intro h1 { margin:0 0 10px; font-size:clamp(32px,4vw,46px); line-height:1.15; }
.locations-intro p { margin:0; font-size:15px; color:#c2d3e1; }
.locations-coverage { display:flex; flex-wrap:wrap; gap:8px; }
.locations-coverage span { padding:5px 9px; border:1px solid #455c6c; border-radius:6px; background:#152634; color:#d0e0eb; white-space:nowrap; font-size:13px; }
.locations-coverage strong { color:var(--loc-ice); font-size:16px; }
.locations-map-workspace { border:1px solid var(--loc-line); border-radius:10px; background:var(--loc-panel); padding:13px; }
.locations-controls { display:flex; justify-content:space-between; align-items:center; gap:12px; margin-bottom:12px; }
.locations-regions { display:flex; flex-wrap:wrap; gap:7px; }
.locations-regions button { padding:6px 10px; border:1px solid #40596a; background:#182734; border-radius:6px; color:#d6e5ee; font-size:12px; white-space:nowrap; }
.locations-regions button small { margin-left:3px; font-size:10px; }
.locations-regions button:hover { border-color:var(--loc-ice); }
.locations-regions button[aria-pressed=true] { border-color:var(--loc-ice); background:var(--loc-ice); color:#102636; font-weight:750; }
.locations-search { width:285px; flex:0 1 285px; min-width:200px; display:flex; align-items:center; gap:7px; padding:0 10px; border:1px solid #40596a; border-radius:7px; background:#14232f; color:var(--loc-muted); }
.locations-search svg { flex:none; }
.locations-workspace .locations-search input { min-height:36px; padding:6px 0; border:0; background:transparent; color:#f1f6fc; font-size:13px; }
.locations-search input::placeholder { color:var(--loc-muted); }
.locations-map-layout { display:grid; grid-template-columns:minmax(0,1fr) 275px; gap:12px; }
.locations-map { position:relative; isolation:isolate; min-width:0; min-height:383px; overflow:hidden; border:1px solid #3b5c70; border-radius:8px; background:radial-gradient(ellipse at 51% 30%,#183548,#10222f 74%); }
.locations-map-art { position:absolute; inset:0; width:100%; height:100%; object-fit:fill; opacity:.57; pointer-events:none; }
.locations-map-caption { position:absolute; z-index:1; left:10px; top:8px; color:#bfd8e7; font-size:11px; pointer-events:none; }
.locations-pin {
 position:absolute;
 top:var(--pin-y);
 left:var(--pin-x);
 transform:translate(-15px,-50%);
 display:flex;
 align-items:center;
 gap:5px;
 min-height:44px;
 min-width:44px;
 padding:0 10px;
 border:0;
 border-radius:6px;
 background:transparent;
 color:#e0f5ff;
 font-size:12px;
 font-weight:650;
 line-height:1.1;
 white-space:nowrap;
}
.locations-pin-marker { width:8px; height:8px; flex:none; border-radius:50%; background:#9de4ff; box-shadow:0 0 10px #86dfff; }
.locations-pin-label,.locations-pin-code { text-shadow:0 1px 5px #071924,0 0 6px #071924; }
.locations-pin-code { display:none; }
.locations-pin:hover,.locations-pin[aria-pressed=true] { background:#244658; box-shadow:inset 0 0 0 1px var(--loc-ice); }
.locations-pin[aria-pressed=true] { z-index:2; }
.locations-pin[aria-pressed=true] .locations-pin-marker { background:var(--loc-warm); box-shadow:0 0 9px var(--loc-warm); }
.locations-detail { min-width:0; display:flex; flex-direction:column; padding:17px; border:1px solid #446375; border-radius:8px; background:#182a37; }
#locations-detail-content { flex:1; display:flex; flex-direction:column; }
.locations-city { display:flex; align-items:center; gap:9px; min-width:0; }
.locations-city div { min-width:0; }
.locations-city :is(h2,h3) { margin:0; line-height:1.25; overflow-wrap:anywhere; }
.locations-city p { color:var(--loc-muted); font-size:12px; line-height:1.35; margin:3px 0 0; overflow-wrap:anywhere; }
.locations-detail-city { padding-bottom:14px; border-bottom:1px solid var(--loc-line); }
.locations-detail-city h2 { font-size:21px; }
.locations-flag { width:33px; height:22px; object-fit:cover; border-radius:3px; flex:none; box-shadow:0 0 0 1px #ffffff26; }
.locations-code { padding:2px 5px; border:1px solid #476273; border-radius:4px; color:var(--loc-ice); font:600 10px "IBM Plex Mono",monospace; white-space:nowrap; }
.locations-detail-city .locations-code { margin-left:auto; }
.locations-price { margin:17px 0 13px; color:var(--loc-muted); font-size:13px; }
.locations-price strong,.locations-entry-price strong { color:var(--loc-warm); font-variant-numeric:tabular-nums; }
.locations-price strong { font-size:32px; line-height:1.25; }
.locations-price p { margin:6px 0 0; }
.locations-specs { display:grid; gap:6px; margin:0 0 15px; padding:10px 0; border-block:1px solid var(--loc-line); font-size:13px; }
.locations-specs div { display:flex; justify-content:space-between; gap:10px; }
.locations-specs dt { color:#c7d9e6; }
.locations-specs dd { margin:0; color:var(--loc-ice); font-weight:700; }
.locations-action { display:inline-flex; align-items:center; justify-content:center; gap:7px; min-height:36px; padding:6px 12px; border:1px solid transparent; border-radius:6px; background:#efaa7b; color:#15232d; font-size:13px; font-weight:750; }
.locations-action svg,.locations-entry > svg { width:14px; flex:none; }
.locations-action:hover { background:#ffc097; color:#15232d; }
.locations-detail-actions { display:flex; gap:8px; margin-top:auto; }
.locations-detail-actions .locations-action { flex:1; min-width:0; padding-inline:5px; text-align:center; line-height:1.3; }
.locations-action-secondary { border-color:#597b90; background:#203948; color:#e8f6fd; }
.locations-action-secondary:hover { border-color:var(--loc-ice); background:#294858; color:#e8f6fd; }
.locations-note { margin:10px 0 0; color:var(--loc-muted); font-size:12px; }
.locations-directory { margin-top:18px; }
.locations-directory-heading { margin-bottom:12px; }
.locations-directory-heading h2 { margin:0; font-size:24px; }
.locations-directory-heading p { margin:3px 0 0; color:var(--loc-muted); font-size:12px; }
.locations-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:12px; padding:0; margin:0; list-style:none; }
.locations-entry { display:flex; align-items:center; gap:8px; min-height:61px; height:100%; padding:9px 11px; border:1px solid var(--loc-line); border-radius:8px; background:var(--loc-panel); color:#f1f6fc; }
.locations-entry:hover,.locations-entry[aria-current] { border-color:#7fbad2; background:#1d3747; color:#f1f6fc; }
.locations-entry h3 { font-size:14px; }
.locations-entry .locations-flag { width:25px; height:17px; }
.locations-entry-price { margin-left:auto; color:#cbdae5; font-size:11px; text-align:right; }
.locations-entry-price strong { font-size:16px; white-space:nowrap; }
.locations-entry-price small { white-space:nowrap; }
.locations-entry > svg { color:var(--loc-ice); }
.locations-empty { padding:17px; border:1px solid var(--loc-line); border-radius:8px; background:var(--loc-panel); }
.locations-empty h3 { margin:0; }
.locations-empty p { color:var(--loc-muted); font-size:13px; }
.locations-sr-only { position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip-path:inset(50%); white-space:nowrap; }

body:has(.location-choice[open]) { overflow:hidden; }
.location-choice {
 position:fixed;
 inset:0;
 margin:auto;
 width:536px;
 max-width:calc(100% - 30px);
 max-height:calc(100% - 26px);
 padding:0;
 overflow:auto;
 overscroll-behavior:contain;
 border:1px solid #557487;
 border-radius:15px;
 background:#15232e;
 color:#f3f7fa;
 box-shadow:0 18px 65px #030a1390;
}
.location-choice::backdrop { background:#080f18b0; backdrop-filter:none; }
.location-choice-wrap { position:relative; padding:25px; }
.location-choice-close {
 position:absolute;
 top:17px;
 right:17px;
 display:grid;
 place-items:center;
 width:36px;
 height:36px;
 border:1px solid #465e70;
 border-radius:7px;
 background:#182b38;
 color:#e3eef6;
}
.location-choice-close:hover { background:#284252; }
.location-choice-header { display:flex; align-items:center; gap:13px; padding-right:42px; }
.location-choice-header img { width:42px; height:28px; object-fit:cover; flex:none; border-radius:4px; box-shadow:0 0 0 1px #ffffff32; }
.location-choice-city { display:flex; align-items:center; gap:7px 9px; flex-wrap:wrap; }
.location-choice-city h2 { margin:0; font-size:26px; line-height:1.15; overflow-wrap:anywhere; }
.location-choice-header p { margin:4px 0 0; color:#aec6d7; font-size:13px; }
.location-choice-facts { display:flex; justify-content:space-between; align-items:center; gap:8px 12px; flex-wrap:wrap; margin-top:17px; padding:10px 12px; border:1px solid #354e60; border-radius:7px; background:#192c3a; color:#c3d5e1; font-size:13px; }
.location-choice-facts strong { color:var(--loc-warm); font-size:17px; margin-left:4px; }
.location-choice-facts small { font-size:11px; }
#location-choice-question { margin:18px 0 10px; font-size:17px; font-weight:700; }
.location-choice-options { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:11px; }
.location-choice-options:has(.location-choice-configure[hidden]) { grid-template-columns:minmax(0,1fr); }
.location-choice-route { display:block; border:1px solid #597b90; padding:12px 13px; border-radius:8px; background:#203948; color:#e8f6fd; }
.location-choice-browse:hover { border-color:var(--loc-ice); background:#294858; color:#e8f6fd; }
.location-choice-route-head { display:flex; align-items:center; justify-content:space-between; color:var(--loc-ice); margin-bottom:8px; }
.location-choice-route-head > svg { width:18px; height:18px; }
.location-choice-icon { display:grid; place-items:center; width:32px; height:32px; border-radius:6px; background:#294858; }
.location-choice-icon svg { width:21px; height:21px; }
.location-choice-route strong { display:block; font-size:16px; }
.location-choice-hint { display:block; margin-top:3px; font-size:12px; color:#c4dce9; }
.location-choice-configure { background:#efaa7b; border-color:#ffc699; color:#182632; }
.location-choice-configure:hover { background:#ffc097; color:#182632; }
.location-choice-configure :is(.location-choice-route-head,.location-choice-hint) { color:#25313c; }
.location-choice-configure .location-choice-icon { background:#dc9465; }

@media (max-width:1100px) {
 .locations-workspace { padding-inline:24px; }
 .locations-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
 .locations-map-layout { grid-template-columns:minmax(0,1fr) 250px; }
}
@media (max-width:850px) {
 .locations-map-layout { grid-template-columns:minmax(0,1fr); }
 .locations-map { min-height:0; height:clamp(208px,48vw,340px); }
}
@media (max-width:650px) {
 .locations-workspace { padding:18px 14px 32px; }
 .locations-intro,.locations-controls { flex-direction:column; align-items:stretch; gap:11px; }
 .locations-intro { padding-bottom:14px; }
 .locations-intro p { font-size:13px; }
 .locations-search { width:100%; min-width:0; flex:auto; }
 .locations-map-workspace { padding:10px; }
 .locations-pin { font-size:10px; padding-inline:7px; min-height:44px; transform:translate(-11px,-50%); }
 .locations-pin-label { display:none; }
 .locations-pin-code { display:inline; }
 .locations-pin-east { transform:translate(calc(-100% + 11px),-50%); flex-direction:row-reverse; }
 .locations-detail { padding:12px; }
 .locations-price { margin:10px 0 9px; }
 .locations-price strong { font-size:26px; }
 .locations-specs { grid-template-columns:1fr 1fr; gap:10px; margin-bottom:12px; }
 .locations-grid { grid-template-columns:minmax(0,1fr); gap:7px; }
}
@media (max-width:600px) {
 .location-choice { inset:auto 0 0; margin:0; width:100%; max-width:none; border-radius:17px 17px 0 0; }
 .location-choice-wrap { padding:18px 17px calc(16px + env(safe-area-inset-bottom)); }
 .location-choice-close { width:40px; height:40px; }
 .location-choice-options { grid-template-columns:minmax(0,1fr); gap:8px; }
 .location-choice-route { position:relative; padding:10px 35px 10px 53px; }
 .location-choice-route-head { position:absolute; inset:0 11px; margin:0; pointer-events:none; }
 .location-choice-city h2 { font-size:23px; }
}
