#desktopHome{background:#0b1219;color:#edf4f7}
.chargingFeedback[hidden]{display:none}
.chargingMapViewport{position:absolute;inset:0;overflow:hidden;touch-action:none}.chargingMapViewport .chargingMap{will-change:transform}
.chargingMapCredit{position:absolute;right:5px;bottom:3px;z-index:2;padding:2px 5px;border-radius:4px;background:#13232ed9;color:#d4e5eb;font-size:11px;text-decoration:none}
/* Let Kakao consume one-finger pan/two-finger zoom instead of browser scrolling. */
.chargingMap{touch-action:none;overscroll-behavior:contain;-webkit-user-select:none;user-select:none;cursor:grab}.chargingMap:active{cursor:grabbing}.chargingList,.chargingDetail{touch-action:pan-y;overscroll-behavior:contain}
.chargingAreaSearch{position:absolute;top:12px;left:50%;transform:translateX(-50%);z-index:3;min-height:44px;max-width:90%;background:#173c32;color:white;border:1px solid #8ce8c2;box-shadow:0 2px 8px #0004;font-size:14px;white-space:nowrap}.chargingAreaSearch[hidden]{display:none}
.chargingShell{height:100%;display:flex;flex-direction:column;padding:18px 22px 10px;gap:8px;overflow:hidden}
.chargingHeader{display:flex;align-items:center;gap:10px;flex-wrap:wrap}.chargingHeader h2{margin:0 12px 0 0;font-size:25px}.chargingHeader button,.chargingHeader input{min-height:44px;font-size:15px;padding:10px 14px}.chargingSearch{min-width:160px;flex:1;max-width:340px;background:#16222e}.chargingFilters{display:flex;gap:5px}.chargingFilters button[aria-pressed=true]{background:#326756;border-color:#8ce8c2}.chargingFeedback{font-size:13px;color:#b0becb;min-height:18px}
.chargingMain{flex:1;min-height:0;display:grid;grid-template-columns:minmax(0,1fr) 330px;gap:14px}.chargingMapArea{position:relative;min-height:180px;background:#172530;border:1px solid #30414d;border-radius:18px;overflow:hidden}.chargingMap{height:100%;width:100%;position:absolute;inset:0}.chargingMapMessage{position:absolute;top:40%;left:8%;right:8%;text-align:center;font-size:16px;pointer-events:none}.chargingSide{min-height:0;position:relative;overflow:hidden}.chargingList{height:100%;overflow:auto;display:flex;flex-direction:column;gap:9px}.chargingStation{display:flex;flex-direction:column;align-items:flex-start;gap:7px;text-align:left;min-height:110px;padding:15px;background:#16212c;border:1px solid #2d3e4e;border-radius:15px;flex-shrink:0}.chargingStation strong{font-size:16px;overflow-wrap:anywhere}.chargingKind{font-size:12px;color:#a7b7c6}.chargingCount{font-size:16px;color:#addecf}.chargingDetail{position:absolute;inset:0;background:#14222e;z-index:2;padding:20px;border:1px solid #4b6873;border-radius:16px;overflow:auto;font-size:15px}.chargingDetail[hidden]{display:none}.chargingDetail h3{overflow-wrap:anywhere}.chargingDetail p{font-size:14px;margin:12px 0}.chargingDetail a{color:#9ddfd0;line-height:1.8}.chargingAvailability{font-size:20px}.chargingPin{min-width:44px;height:44px;padding:0 8px;border-radius:24px;background:#35515a;border:2px solid #fff;color:#fff;font-weight:750;font-size:18px;box-shadow:0 2px 6px #0005;white-space:nowrap}.chargingPin.supercharger{background:#a43b43}.chargingPin.nacs{background:#22664b}.chargingPin.group{background:#365f96}.chargingPin.unknown{background:#53616b}.chargingEmpty{padding:20px}
@media(max-width:800px){.chargingShell{padding:12px;gap:6px}.chargingHeader{gap:6px}.chargingHeader h2{font-size:20px}.chargingHeader button,.chargingHeader input{font-size:13px;padding:9px}.chargingSearch{max-width:none}.chargingMain{grid-template-columns:minmax(0,1fr) 260px;gap:8px}}
@media(max-width:550px){.chargingHeader h2{width:100%}.chargingFilters{flex:1}.chargingMain{grid-template-columns:1fr;grid-template-rows:minmax(180px,1.1fr) minmax(120px,1fr)}.chargingStation{min-height:90px}}

/* Compact station cards: independent buttons, no nested interactive elements. */
.chargingStation{gap:6px;padding:12px;min-height:0;border-radius:12px;background:#171e29}
.chargingStationHeading{display:flex;align-items:baseline;gap:7px;background:transparent;border:0;padding:0;min-height:32px;width:100%;text-align:left;white-space:normal;color:inherit}
.chargingStationHeading .chargingKind{font-size:11px;color:#e68d98;flex-shrink:0}.chargingStationHeading strong{font-size:15px;line-height:1.4}
.chargingAddress{font-size:12px;color:#a6aebc;line-height:1.45;overflow-wrap:anywhere}.chargingMetrics{background:#0f151e;border-radius:8px;padding:8px 10px;font-size:13px;color:#dce3eb;width:100%;box-sizing:border-box}
.chargingNav{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:6px;width:100%}.chargingNavButton{flex:1;min-width:0;min-height:36px;padding:6px 8px;border:1px solid #3b4555;border-radius:8px;background:#242c39;font-size:12px;color:#edf4f7}.chargingNavButton::before{content:'↗';margin-right:5px;font-weight:800}.chargingNavButton.kakao::before{color:#ffe337}.chargingNavButton.tmap::before{color:#7ed3ff}.chargingNavButton.naver::before{color:#4ce28a}
.chargingConfirm{position:absolute;inset:0;z-index:100;background:#0009;display:flex;align-items:center;justify-content:center;padding:20px}.chargingConfirmBox{max-width:420px;background:#17232e;padding:22px;border:1px solid #4d6775;border-radius:16px;box-shadow:0 12px 50px #0008}.chargingConfirmBox h3{margin:0 0 14px;font-size:19px}.chargingConfirmBox small{display:block;color:#a7b7c6;line-height:1.5}.chargingConfirmActions{display:flex;justify-content:flex-end;gap:10px;margin-top:18px}.chargingConfirmActions button{min-height:44px;min-width:80px}.chargingConfirmActions button:last-child{background:#326756}

/* Kakao standard raster tiles: dark presentation; keep pins/attribution readable. */
.chargingMap{filter:invert(1) hue-rotate(180deg);background:#edf1f3}
.chargingMap .chargingPin,.chargingMap a,.chargingMap button{filter:hue-rotate(-180deg) invert(1)}

.chargingPin.teslaIconPin{position:relative;display:flex;align-items:center;justify-content:center;background:#fff;border:2px solid #fff;border-radius:12px;min-width:42px;width:42px;height:42px;padding:5px;box-shadow:0 2px 8px #0008}
.chargingPin.teslaIconPin img{display:block;width:28px;height:28px;object-fit:contain;pointer-events:none}
.chargingClusterCount{position:absolute;right:-8px;top:-8px;border-radius:12px;background:#a50917;color:white;border:2px solid white;padding:1px 5px;min-width:14px;font-size:11px;line-height:16px;pointer-events:none}
/* Keep station glyphs small and independent of fractional map scaling. */
.chargingPin,.chargingPin.teslaIconPin{width:var(--charging-pin-size,28px);min-width:var(--charging-pin-size,28px);height:var(--charging-pin-size,28px);padding:0;border-width:1.5px;border-radius:50%;font-size:12px;transform:scale(var(--charging-pin-inverse,1));transform-origin:50% 100%;touch-action:none}
.chargingPin.teslaIconPin{border-radius:7px}.chargingPin.teslaIconPin img{width:65%;height:65%}.chargingClusterCount{right:-6px;top:-7px;min-width:12px;padding:0 3px;font-size:9px;line-height:13px;border-width:1px}
.chargingCurrentLocation{transform:scale(var(--charging-pin-inverse,1));transform-origin:center}

.chargingParking{font-size:12px;color:#b9c8d4;line-height:1.5;overflow-wrap:anywhere}.chargingParkingDetail{border-top:1px solid #3d5261;margin-top:14px;padding-top:8px}.chargingParkingDetail h4{margin:8px 0}.chargingParkingDetail small{color:#a7b7c6}

/* Shared card content in the first-screen list and map popup. */
.chargingConnectorRow{line-height:1.6;overflow-wrap:anywhere}.chargingConnectorRow+.chargingConnectorRow{border-top:1px solid #ffffff12;margin-top:5px;padding-top:5px}.chargingConnectorRow.nacs{color:#9ee2c1}.chargingConnectorRow.combo{color:#a9ccfa}
.chargingDataNote{font-size:11px;color:#a6b8c6;line-height:1.4}.chargingParkingSources{font-size:11px;color:#a6b8c6;line-height:1.5}.chargingParkingSources summary{cursor:pointer}.chargingParkingSources p{margin:6px 0}.chargingParkingSources a{color:#9ddfd0}
.chargingMapPopup{position:absolute;top:12px;left:12px;width:min(360px,calc(100% - 24px));max-height:calc(100% - 24px);overflow:auto;z-index:8;box-shadow:0 8px 32px #0009;border-radius:14px;background:#171e29;touch-action:pan-y}.chargingMapPopup .chargingStation{border:1px solid #7894a4;padding:16px}.chargingMapPopup .chargingStationHeading{padding-right:28px}.chargingMapPopupClose{position:absolute;right:8px;top:8px;min-width:32px;min-height:32px;padding:2px;z-index:1;background:#263947;color:#fff;border:1px solid #607988;border-radius:9px;font-size:24px;line-height:26px}

.chargingSelectable{cursor:pointer}.chargingSelectable:hover,.chargingSelectable:focus-within{border-color:#8ce8c2}.chargingStationHeading:focus-visible{outline:2px solid #8ce8c2;outline-offset:3px;border-radius:4px}

/* Current position stays blue under the map's dark-mode filter. No station glyph. */
.chargingMap .chargingCurrentLocation{filter:hue-rotate(-180deg) invert(1)}
.chargingCurrentLocation{display:block;width:20px;height:20px;box-sizing:border-box;border:3px solid white;border-radius:50%;background:#168bff;box-shadow:0 0 0 8px #168bff33,0 2px 7px #0009;pointer-events:none}

/* User-provided daily opening hours, evaluated in Korea time. */
.chargingOperating{font-size:13px;line-height:1.45;font-weight:700}.chargingOperating.closed{color:#ff626b}.chargingOperating.open{color:#9ee2c1}

.chargingSnapshotNote{color:#e8c982}

/* Connector colors and parking details are shared by list cards and map popups. */
.chargingConnectorRow.supercharger{color:#ff727b}
.chargingParkingDetails{width:100%;font-size:12px;color:#cad7e1;line-height:1.55}
.chargingParkingDetails summary{cursor:pointer;min-height:28px;padding:4px 0;color:#c5e5d8;font-weight:600}
.chargingParkingDetails summary:focus-visible{outline:2px solid #8ce8c2;outline-offset:2px;border-radius:4px}
.chargingParkingBreakdown{margin:4px 0 0;padding:9px 10px;background:#101922;border-radius:9px;overflow-wrap:anywhere}
.chargingParkingBreakdown dt{font-weight:700;color:#e0eaf0;margin-top:8px}
.chargingParkingBreakdown dt:first-child{margin-top:0}
.chargingParkingBreakdown dd{margin:2px 0 0;color:#b9cbd8;white-space:pre-line}

.chargingReports{margin:8px 0;font-size:13px;color:#bfd4e3}.chargingReports>summary{cursor:pointer;color:#69d9bd;font-weight:700;padding:7px 0}
.chargingReportBody{padding:10px;background:#101922;border-radius:10px}.chargingReportBody h3{margin:0 0 6px;font-size:16px}.chargingReportBody p{margin:6px 0;line-height:1.5}
.chargingReportForm{display:grid;gap:9px;margin:12px 0}.chargingReportField{display:flex;align-items:center;gap:5px;flex-wrap:wrap}.chargingReportField input{width:65px;min-width:0;padding:8px 5px;font-size:14px;border:1px solid #45616c;border-radius:6px;background:#18252e;color:#fff}.chargingReportField input[type=text]{width:160px}
.chargingReportBest{padding:9px;border:1px solid #356552;border-radius:8px}.chargingReportRow{display:flex;gap:7px;align-items:center;justify-content:space-between;padding:9px 0;border-bottom:1px solid #30434c;overflow-wrap:anywhere}.chargingReportRow button{flex-shrink:0;padding:7px;color:#ff839c;background:#25303a;border:1px solid #566672;border-radius:7px}.chargingReportRow button:disabled{opacity:.8}.chargingReportPreview,.chargingReportStatus{color:#ffe096}.chargingReports [hidden]{display:none!important}

.chargingReportPublicTop{font-size:13px;color:#d3e8de;line-height:1.5;margin:5px 0 9px;padding:8px;background:#14231f;border-left:2px solid #60cba6;border-radius:5px;overflow-wrap:anywhere}.chargingReportPublicTop[hidden]{display:none}

.chargingReportRow{flex-wrap:wrap}.chargingReportOwnActions{display:flex;gap:6px;width:100%;justify-content:flex-end}.chargingReportOwnActions button{font-size:12px;padding:5px 10px;color:#c9e2ee}

/* D92: compact shared list/popup information; native navigation follows the address. */
.chargingStation{gap:4px}
.chargingNavButton{white-space:nowrap}
.chargingParking,.chargingReports,.chargingParkingDetails{font-size:12px;line-height:1.45}
.chargingReports{margin:0;width:100%}
.chargingReports>summary,.chargingParkingDetails>summary{font-size:12px;line-height:1.45;padding:2px 0;min-height:0}
.chargingReportPublicTop{margin:0;padding:5px 7px;font-size:12px;line-height:1.45}
/* Keep landscape controls unchanged. In narrow portrait, only the heading gets its own row. */
@media(max-width:550px) and (orientation:portrait){
 .chargingHeader{display:grid;grid-template-columns:minmax(44px,1fr) auto auto auto;gap:4px}
 .chargingHeader h2{grid-column:1/-1;width:auto;margin:0}
 .chargingHeader button,.chargingHeader input{font-size:11px;min-height:36px;padding:7px 5px;white-space:nowrap}
 .chargingSearch{width:100%;min-width:0;max-width:none;box-sizing:border-box}
 .chargingFilters{min-width:0;gap:2px;flex:initial}
}

/* Native app orientation is supplied by Android, independent of WebView aspect ratio. */
.nativeChargingPortrait .chargingHeader{display:grid;grid-template-columns:minmax(44px,1fr) auto auto auto;gap:4px}
.nativeChargingPortrait .chargingHeader h2{grid-column:1/-1;width:auto;margin:0}
.nativeChargingPortrait .chargingHeader button,.nativeChargingPortrait .chargingHeader input{font-size:11px;min-height:36px;padding:7px 5px;white-space:nowrap}
.nativeChargingPortrait .chargingSearch{width:100%;min-width:0;max-width:none;box-sizing:border-box}
.nativeChargingPortrait .chargingFilters{min-width:0;gap:2px;flex:initial}

.chargingNavButton.tesla::before{color:#ee4545}
.chargingStationSelected{border-color:#9a80ff;box-shadow:inset 0 0 0 1px #9a80ff}
