/* RESET I MAPA */
:root{
    --lufi-font:system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Arial,sans-serif;
    --lufi-marker-value-size:11.5px;
    --lufi-marker-unit-size:7px;
    --lufi-marker-code-size:10.5px;
    --lufi-marker-label-size:11px;
    --lufi-marker-glyph-size:14px;
    --lufi-ui-accent:#2FBF71;
    --lufi-ui-accent-hi:#35D982;
    --lufi-ui-active-bg:rgba(47,191,113,.16);
    --lufi-ui-link:#72E2A4;
    --lufi-ui-muted:#b9c4cc;
    --lufi-panel-bg:rgba(20,20,20,.60);
    --lufi-panel-bg-strong:rgba(20,20,20,.85);
    --lufi-panel-border:rgba(255,255,255,.18);
    --lufi-ui-blur:blur(5px);
}
body, html { 
    margin: 0; 
    padding: 0; 
    height: 100%; 
    overflow: hidden; 
    font-family:var(--lufi-font);
    background: #111;
}
button,input,select,textarea{font-family:var(--lufi-font)}
#clock,.vehicle-line,.vehicle-facts,.fuel-price-marker,.transport-departures,.now-refresh-row>b{font-variant-numeric:tabular-nums}


#map { 
    width: 100%; 
    height: 100%; 
    z-index: 1; 
}
.leaflet-control-attribution { display:none !important; }

/* PASEK ŁADOWANIA / AKTYWNOŚCI
   Bez osobnego toru i bez ciemnego tła. Po zniknięciu pod paskiem jest zwykła strona. */
#heartbeat-bar {
    position: fixed;
    top: 0;
    left: 0;
    height: 3px;
    background: #dc3545;
    z-index: 10000;
    width: 3%;
    opacity: 1;
    pointer-events: none;
    transition: width .32s ease-out, opacity .22s ease-in-out;
    box-shadow: 0 0 8px rgba(220,53,69,.72);
}

/* GŁÓWNY GÓRNY INTERFEJS (RÓWNA WYSOKOŚĆ I WYŚRODKOWANIE) */
#floating-ui {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    display: flex;
    align-items: flex-start;
    padding: max(12px, env(safe-area-inset-top)) 0 0 0;
    z-index: 9999;
    pointer-events: none; 
}

#left-ui { position: absolute; left: max(12px, env(safe-area-inset-left)); }
#center-ui { position: absolute; left: 50%; transform: translateX(-50%); }
#right-ui { position: absolute; right: max(12px, env(safe-area-inset-right)); }

.ui-box {
    pointer-events: auto;
    background: var(--lufi-panel-bg);
    backdrop-filter:var(--lufi-ui-blur);
    -webkit-backdrop-filter:var(--lufi-ui-blur);
    color: white;
    border: 1px solid rgba(255, 255, 255, 0.2);
    height: 44px; /* SZTYWNA WYSOKOŚĆ DLA ZEGARA, LOGO I MENU */
    padding: 0 16px; 
    border-radius: 8px;
    box-shadow: 0 4px 6px rgba(0,0,0,0.3);
    display: flex;
    align-items: center;
    justify-content: center;
    box-sizing: border-box;
}

#clock { font-size: 19px; font-weight: bold; letter-spacing: 1px; }

#logo { padding: 0 12px; }
#logo img { height: 28px !important; display: block; object-fit: contain; }

#hamburger { cursor: pointer; font-size: 24px; transition: background 0.2s; }
#hamburger:active { background: rgba(80, 80, 80, 0.9); }

/* MAŁE KONTROLKI DOLNE (Lokalizacja, Zoom) */
#custom-controls {
    position: fixed;
    bottom: max(20px, env(safe-area-inset-bottom));
    right: max(15px, env(safe-area-inset-right));
    z-index: 9999; 
    display: flex;
    flex-direction: column;
    gap: 8px;
    pointer-events: none;
}

#custom-controls button {
    pointer-events: auto;
    width: 36px;  /* ZMIEJSZONE PRZYCISKI */
    height: 36px; /* ZMIEJSZONE PRZYCISKI */
    font-size: 18px;
    background: var(--lufi-panel-bg-strong); /* klasyczne półprzezroczyste szkło */
    color: white;
    border: 1px solid rgba(255, 255, 255, 0.2);
    border-radius: 6px;
    box-shadow: 0 4px 6px rgba(0,0,0,0.3);
    display: flex;
    justify-content: center;
    align-items: center;
    cursor: pointer;
    backdrop-filter:var(--lufi-ui-blur);
    -webkit-backdrop-filter:var(--lufi-ui-blur);
    transition: transform 0.1s, background 0.2s;
}

#custom-controls button:active { transform: scale(0.85); background: rgba(80, 80, 80, 0.9); }

/* SIDEBAR Z MENU WARSTW */
#sidebar {
    position: fixed;
    top: 0;
    right: -320px;
    width: 280px;
    height: 100vh;
    height: 100dvh;
    background: var(--lufi-panel-bg);
    backdrop-filter:var(--lufi-ui-blur);
    -webkit-backdrop-filter:var(--lufi-ui-blur);
    color: white;
    transition: right 0.3s ease;
    z-index: 10001; 
    padding: max(20px, env(safe-area-inset-top)) max(20px, env(safe-area-inset-right)) max(20px, env(safe-area-inset-bottom)) 20px;
    box-shadow: -4px 0 15px rgba(0,0,0,0.5);
    overflow-y: auto;
}

#sidebar.open { right: 0; }

.sidebar-title { margin-top: 0; border-bottom: 0; padding-bottom: 0; }

/* TŁO MENU WARSTW LEAFLET (Przezroczyste zamiast białego) */
.leaflet-control-layers { background: transparent !important; border: none !important; color: white !important; box-shadow: none !important; }
.leaflet-control-layers-expanded { padding: 0 !important; background: transparent !important; color: white !important; }
.leaflet-control-layers-separator { border-top: 1px solid rgba(255, 255, 255, 0.2) !important; margin: 10px 0 !important; }
.leaflet-control-layers label { color: white !important; font-size: 15px; margin-bottom: 6px; }
.leaflet-control-layers input[type="radio"], .leaflet-control-layers input[type="checkbox"] { accent-color: var(--lufi-ui-accent); }
/* Układ hamburgera: przycisk instalacji jest NAD nagłówkiem „Konfiguracja mapy”. */
#sidebar > .sidebar-install-button { display:block; width:100%; margin:0 0 12px !important; }
#layers-container.layers-menu-stack { display:flex; flex-direction:column; }
#layers-container.layers-menu-stack > .layers-main-control { order:20 !important; }
#layers-container.layers-menu-stack > .marker-settings { order:30 !important; }
#layers-container.layers-menu-stack > .source-details { order:40 !important; }
.leaflet-marker-icon,.leaflet-marker-shadow { opacity:var(--lufi-marker-opacity,1) !important; }
.lufi-scaled-icon-content { position:absolute;left:0;top:0; }
.marker-settings { margin:0 0 14px;padding:0 0 12px;border-bottom:0; }
.marker-settings h4 { margin:0 0 10px;font-size:14px; }
.marker-setting { margin-top:9px; }
.marker-setting-head { display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:4px; }
.marker-setting label { display:block;font-size:13px;margin:0; }
.marker-settings output { color:var(--lufi-ui-accent);font-weight:bold;font-size:13px; }
.marker-settings input[type="range"] { display:block;width:100%;margin:0;accent-color:var(--lufi-ui-accent);cursor:pointer; }
.source-details { margin-top:14px;padding-top:12px;border-top:0;font-size:12px;color:#d7e6f5; }
.source-details summary { cursor:pointer;font-size:13px;font-weight:bold;color:#fff; }
.source-details div { margin-top:8px;line-height:1.55;opacity:.82; }

/* POPUPY (DYMKI) - CIEMNY MOTYW (Tak jak reszta strony) */
.leaflet-popup-content-wrapper { 
    cursor:pointer;
    background: var(--lufi-panel-bg) !important; 
    backdrop-filter:var(--lufi-ui-blur)!important;
    -webkit-backdrop-filter:var(--lufi-ui-blur)!important;
    color: white !important;
    border: 1px solid rgba(255, 255, 255, 0.2);
    border-radius: 8px; 
    font-family:var(--lufi-font); 
    box-shadow: 0 4px 10px rgba(0,0,0,0.5) !important;
}
.leaflet-popup-tip { 
    background: var(--lufi-panel-bg) !important; 
    border: 1px solid var(--lufi-panel-border) !important;
}
.leaflet-popup-close-button { color: white !important; }
.leaflet-popup-content a { color: var(--lufi-ui-link) !important; text-decoration: none; font-weight: bold; }

/* MONIT INSTALACJI PWA */
#pwa-install-banner {
    display: none; 
    position: fixed;
    bottom: max(40px, env(safe-area-inset-bottom));
    left: 50%;
    transform: translateX(-50%);
    background: var(--lufi-ui-accent);
    color: #f4fcfd;
    padding: 14px 28px;
    border-radius: 30px;
    font-size: 16px;
    font-weight: bold;
    box-shadow: 0 4px 15px rgba(0,0,0,0.5);
    z-index: 10005; 
    cursor: pointer;
    border: 1px solid rgba(53,217,130,.72);
    text-align: center;
    white-space: nowrap;
    animation: bounce 2s infinite;
}

@keyframes bounce {
    0%, 20%, 50%, 80%, 100% {transform: translateY(0) translateX(-50%);}
    40% {transform: translateY(-10px) translateX(-50%);}
    60% {transform: translateY(-5px) translateX(-50%);}
}

.smog-icon, .ev-icon, .river-icon { border-radius: 5px; }
.transport-popup { min-width:220px; max-width:350px; line-height:1.5; }
.transport-popup hr { margin:7px 0; opacity:.3; }
.transport-popup ul { padding-left:17px; margin:5px 0; }
.transport-popup li { margin:5px 0; }
.transport-popup small { opacity:.8; }
.transport-warning { padding:8px; color:#ffba73; font-size:12px; }
.rail-disruption-dot { width:16px;height:16px;display:grid;place-items:center;background:#ff9800;color:#fff;border:0;font-family:var(--lufi-font);font-weight:900;font-size:var(--lufi-marker-code-size);box-shadow:0 2px 5px #0009;transform:rotate(45deg);box-sizing:border-box; }
.rail-disruption-dot.serious { background:#b00020; }
.rail-disruption-dot span { transform:rotate(-45deg); }
.poi-data-icon span { width:22px;height:22px;display:grid;place-items:center;border-radius:50%;background:#fff;color:#222;border:1px solid #555;box-shadow:0 1px 4px #0008;font-family:var(--lufi-font);font-size:13px; }
.camera-map-icon { background:transparent;border:0;box-sizing:border-box; }
.camera-map-icon .lufi-scaled-icon-content { display:grid;place-items:center; }
.camera-icon-circle { width:24px;height:24px;border:0;border-radius:50%;background:#167ca8;display:grid;place-items:center;box-sizing:border-box;box-shadow:0 2px 6px #0009; }
.camera-icon-circle svg { width:18px;height:15px;display:block;overflow:visible; }
.camera-icon-circle path { fill:#fff;stroke:#fff;stroke-width:.6;stroke-linejoin:round; }
.camera-icon-circle circle { fill:#38bdf8;stroke:#fff;stroke-width:1.3; }
.standard-round-icon { width:28px;height:28px;border:0;border-radius:50%;display:grid;place-items:center;box-sizing:border-box;box-shadow:0 2px 6px #0009;color:#fff;font-family:var(--lufi-font);font-size:var(--lufi-marker-glyph-size); }
.tomtom-incident-marker .lufi-scaled-icon-content>div { width:24px;height:24px;border:0;border-radius:50%;display:grid;place-items:center;color:#fff;font:700 12px/1 sans-serif;box-shadow:0 2px 6px #0009;box-sizing:border-box; }
.bus-touch-box { width:44px;height:44px;display:grid;place-items:center;touch-action:manipulation;cursor:pointer; }
.bus-stop-marker { background:transparent!important;border:0!important;overflow:visible!important;pointer-events:none!important;cursor:pointer;touch-action:manipulation; }
.bus-stop-marker .lufi-scaled-icon-content { display:grid;place-items:center;overflow:visible!important; }
.bus-stop-marker span { display:block;width:10px;height:10px;border:0;border-radius:50%;background:var(--bus-stop-color,#59636e);box-shadow:0 1px 4px #000b;box-sizing:border-box;transform-origin:50% 50%;will-change:transform; }
.bus-detail-scale { position:relative;width:28px;height:28px;transform:scale(var(--lufi-auto-detail-scale,1));display:grid;place-items:center;filter:drop-shadow(0 2px 3px #000a); }
.live-plane-icon,.live-ship-icon,.live-train-icon,.live-aprs-icon { filter:drop-shadow(0 2px 3px #000a); }
.plane-rotator,.ship-rotator,.bus-rotator { transform-origin:50% 50%;will-change:transform; }
/* v376: zewnętrzny element markera musi pozostać pod pełną kontrolą Leafleta.
   will-change:transform na desktopie tworzył osobne warstwy GPU i przy ułamkowym
   zoomie potrafił pozostawić translate3d markera w innej klatce niż mapa. */
.live-plane-icon,.live-ship-icon,.live-bus-icon { will-change:auto; }
.lufi-selected-marker{filter:drop-shadow(0 0 3px #fff) drop-shadow(0 0 7px #ffd54a) !important;z-index:9999 !important}
.leaflet-marker-icon.lufi-selected-marker{transform-origin:center center}

/* === opt23: dymki bez animacji i pewne klikanie znaczników === */
.leaflet-popup,
.leaflet-fade-anim .leaflet-popup {
    transition: none !important;
    animation: none !important;
}
.leaflet-fade-anim .leaflet-popup { opacity: 1 !important; }
.leaflet-marker-icon.leaflet-interactive { pointer-events: auto !important; cursor: pointer; }


/* === opt24: stacje kolejowe klikalne bez pełnoekranowego Canvas === */
.rail-station-dom-icon {
    background: #fff !important;
    border: 2px solid #1f2933 !important;
    border-radius: 50% !important;
    box-sizing: border-box !important;
    box-shadow: 0 1px 3px rgba(0,0,0,.45);
    pointer-events: auto !important;
    cursor: pointer !important;
}
.rail-station-dom-icon.lufi-selected-marker {
    border-color: #ffd54a !important;
    box-shadow: 0 0 0 2px rgba(255,213,74,.3), 0 0 8px rgba(255,213,74,.9);
}

/* opt28: menu warstw jako legenda bez emoji. */
.leaflet-control-layers-overlays .layer-legend-entry {
    display:inline-flex;
    align-items:center;
    gap:8px;
    vertical-align:middle;
}
.layer-legend-symbol {
    width:24px;
    height:22px;
    flex:0 0 24px;
    display:inline-grid;
    place-items:center;
    overflow:visible;
}
.layer-legend-text { line-height:1.2; }
.layer-legend-symbol svg { width:20px;height:20px;display:block;overflow:visible;filter:drop-shadow(0 1px 2px #0009); }
.layer-legend-symbol .standard-round-icon.legend-train-round {
    width:21px;height:21px;border-width:0;font-size:10px;box-shadow:none;
}
.layer-legend-symbol .camera-icon-circle.legend-camera-circle {
    width:21px;height:21px;border-width:0;box-shadow:none;
}
.layer-legend-symbol .camera-icon-circle.legend-camera-circle svg { width:14px;height:11px;filter:none; }
.legend-poi-svg { width:20px!important;height:22px!important;display:block;filter:drop-shadow(0 1px 2px #0009); }
.legend-traffic { width:22px;height:15px;display:flex;flex-direction:column;justify-content:space-between;transform:skewX(-12deg); }
.legend-traffic i { display:block;height:3px;border-radius:3px;box-shadow:0 1px 2px #0008; }
.legend-traffic i:nth-child(1){background:#31c451}.legend-traffic i:nth-child(2){background:#ffc107}.legend-traffic i:nth-child(3){background:#e53935}
.legend-incident-svg { width:20px!important;height:20px!important;display:block;filter:drop-shadow(0 1px 2px #0008); }
.legend-aqi { min-width:24px;height:18px;padding:0 4px;display:grid;place-items:center;border-radius:4px;background:#28a745;border:0;color:#fff;font:bold 9px/1 sans-serif;box-shadow:0 1px 2px #0008;box-sizing:border-box; }
.legend-lightning-svg { width:18px!important;height:22px!important;display:block;filter:drop-shadow(0 1px 2px #0009); }
.legend-cloud { font-size:20px;line-height:1;color:#d9e4ef;text-shadow:0 1px 2px #000; }
.legend-temperature { min-width:28px;height:18px;padding:0 4px;display:grid;place-items:center;border-radius:4px;background:#8756c7;border:0;color:#fff;font:bold 8.5px/1 sans-serif;box-shadow:0 1px 2px #0008;box-sizing:border-box; }
.legend-river { min-width:24px;height:18px;padding:0 4px;display:grid;place-items:center;border-radius:4px;background:#1683d8;border:0;color:#fff;font:bold 9px/1 sans-serif;box-shadow:0 1px 2px #0008;box-sizing:border-box; }
.legend-ev { width:21px;height:21px;border-radius:50%;display:grid;place-items:center;background:#16883f;border:0;color:#fff;font-size:12px;box-shadow:0 1px 3px #0008; }
.legend-fire { width:14px;height:14px;border-radius:1px;background:#e32626;border:0;box-shadow:0 1px 3px #0008;font-size:0;box-sizing:border-box; }
.legend-border-svg { width:22px!important;height:22px!important;display:block;filter:drop-shadow(0 1px 2px #0008); }

.legend-ev svg{width:14px;height:14px;display:block}
.legend-cloud-svg{width:24px;height:18px;display:block;filter:drop-shadow(0 1px 2px #0009)}
.legend-base-svg{width:21px;height:21px;display:block;filter:drop-shadow(0 1px 2px #0008)}
.leaflet-control-layers-base .layer-legend-entry,.leaflet-control-layers-overlays .layer-legend-entry{display:inline-flex;align-items:center;gap:8px;vertical-align:middle}


/* opt31: nazwy warstw są gotowym HTML-em przekazanym bezpośrednio do Leafleta. */
.layer-menu-label{display:inline-flex;align-items:center;gap:8px;min-height:24px;vertical-align:middle;white-space:nowrap;width:100%;min-width:0;flex:1}
.layer-menu-label .layer-legend-symbol{width:26px;min-width:26px;height:22px;display:inline-grid;place-items:center;vertical-align:middle}
.layer-menu-label .layer-legend-text{display:inline-block;line-height:1.2;vertical-align:middle;flex:1;min-width:0}
.layer-menu-label .legend-plane-svg,.layer-menu-label .legend-ship-svg,.layer-menu-label .legend-bus-svg,.layer-menu-label .legend-balloon-svg{width:20px;height:20px;display:block;filter:drop-shadow(0 1px 2px #0009)}
.leaflet-control-layers label>span{display:inline-flex;align-items:center;width:100%;min-width:0}
.leaflet-control-layers label>span>input{margin-right:7px}

/* opt33: legenda Utrudnienia używa dokładnie stylu znacznika TomTom kategorii roboty drogowe. */
.legend-tomtom-incident {
    width:24px;
    height:24px;
    border:0;
    border-radius:50%;
    display:grid;
    place-items:center;
    background:#ff9800;
    color:#fff;
    font:700 12px/1 sans-serif;
    box-shadow:0 2px 6px #0009;
    box-sizing:border-box;
}


/* opt35: GDDKiA = znak TomTom robót drogowych, ale z czerwoną obwódką. */
.gddkia-incident-marker .lufi-scaled-icon-content>div {
    width:24px;height:24px;border:0;border-radius:50%;display:grid;place-items:center;
    color:#fff;font:700 12px/1 sans-serif;box-sizing:border-box;background:#ff9800;padding:0;
    /* Ten sam rdzeń 24x24 co TomTom. Czerwona ramka jest na zewnątrz,
       więc nie pomniejsza zapory ani pomarańczowego koła. */
    box-shadow:0 0 0 2px #d7191c,0 2px 6px #0009;
}
/* GDDKiA używa dokładnie tej samej zapory co TomTom roadworks.
   Starszy SVG miał dodatkowe czerwone kreski i przez to wyglądał inaczej. */
.gddkia-incident-marker .lufi-scaled-icon-content>div svg path:nth-of-type(3){stroke:#ff9800!important;}
.gddkia-incident-marker .lufi-scaled-icon-content>div svg path:nth-of-type(4){display:none!important;}

/* Zatrzymany ruch: prawdziwy kwadrat geometryczny zamiast glifu fontu.
   Dzięki temu pozostaje dokładnie pośrodku także po skalowaniu markerów. */
.tomtom-stopped-square {
    width:7px;
    height:7px;
    display:block;
    background:#fff;
    border-radius:0;
    margin:0;
    padding:0;
    align-self:center;
    justify-self:center;
    box-sizing:border-box;
}


/* opt36: TomTom i GDDKiA jako pełne SVG bez emoji. */
.tomtom-incident-marker .lufi-scaled-icon-content>div svg,
.gddkia-incident-marker .lufi-scaled-icon-content>div svg,
.legend-incident-svg { display:block; overflow:visible; }
.tomtom-incident-marker .lufi-scaled-icon-content>div,
.gddkia-incident-marker .lufi-scaled-icon-content>div { line-height:0; }

/* opt41: stałe, nasycone kolory sieci komunikacji. */
:root{--lufi-ztm:#F04A3A;--lufi-pks:#1687e8;}

/* opt46: popupy ruchu MZD + rozstawienie ikon stacji obok siebie. */
.legend-mzd-svg{width:22px;height:22px;display:block;overflow:visible;filter:drop-shadow(0 1px 2px #0009)}
.mzd-svg-marker{width:100%;height:100%;display:grid;place-items:center;line-height:0;filter:drop-shadow(0 2px 4px #0008)}
.mzd-svg-marker svg{width:100%;height:100%;display:block;overflow:visible}
.mzd-aqi-value{color:#fff;font-weight:700;font-size:11px;text-align:center;border-radius:4px;padding:2px 4px;border:0;box-shadow:0 2px 4px rgba(0,0,0,.45);min-width:28px;box-sizing:border-box;line-height:14px}
.mzd-aqi-icon{background:transparent!important;border:0!important}
.mzd-incident-circle{width:26px;height:26px;border:2px solid #1976d2;border-radius:50%;display:grid;place-items:center;background:#f57c00;box-sizing:border-box;box-shadow:0 2px 6px #0009;line-height:0}
.mzd-incident-circle svg{width:19px;height:19px;display:block}

/* opt46: ikony pomiarów na wspólnych słupach nie zasłaniają się wzajemnie.
   Punkt pomiarowy pozostaje zaznaczony cienkim łącznikiem do faktycznej pozycji. */
.mzd-road-marker,.mzd-noise-marker,.mzd-aqi-icon,.mzd-traffic-marker{background:transparent!important;border:0!important}
.mzd-traffic-marker{filter:drop-shadow(0 2px 4px #0008)}

/* opt47: PANSA AUP/UUP oraz bieżące alerty/opóźnienia komunikacji. */
.legend-airspace-svg{width:24px!important;height:22px!important;display:block;overflow:visible;filter:drop-shadow(0 1px 2px #0009)}
.bus-rt-badge{position:absolute;right:-9px!important;top:-7px!important;width:auto!important;min-width:17px!important;height:17px!important;padding:0 2px!important;border:0;border-radius:9px!important;display:inline-grid!important;place-items:center;box-sizing:border-box;color:#fff;font-family:system-ui,-apple-system,'Segoe UI',sans-serif;font-weight:900;font-size:10.5px!important;line-height:17px!important;font-variant-numeric:tabular-nums;box-shadow:0 1px 4px #000b;z-index:3;pointer-events:none}
.bus-rt-badge.delay{background:#b00020}.bus-rt-badge.early{background:#16a34a}.bus-rt-badge.alert{background:#ff6d00}.bus-rt-badge.cancel{background:#b00020;font-size:10.5px}
.bus-rt-alert{margin:5px 0;padding:6px 8px;border-left:3px solid #ff8f00;background:rgba(255,143,0,.12);border-radius:3px;line-height:1.35}
.bus-rt-alert span{opacity:.8;font-size:11px}.bus-rt-alert small{display:block;margin-top:2px;opacity:.86}

/* opt48: markerowe białe obwódki usunięte; kolor wypełnia cały symbol. GDDKiA zachowuje czerwoną obwódkę identyfikującą źródło. */

/* opt49: Warunki drogowe i Hałas pozostają rozsunięte obok wspólnego punktu, ale bez poziomych łączników. */
.mzd-station-slot-left::after,.mzd-station-slot-right::after{display:none!important;content:none!important}

/* opt50: wspólny język wizualny dla autobusów, pociągów i tablic przystankowych. */
.transport-popup-unified{min-width:240px;max-width:380px;line-height:1.45}
.transport-freshness{display:inline-block;opacity:.82;font-size:11px;line-height:1.35}
.transport-departures{margin:5px 0!important;padding-left:18px!important}
.transport-departures li{margin:6px 0!important}
.transport-delay-chip{display:inline-flex;align-items:center;gap:4px;white-space:nowrap;padding:2px 6px;border-radius:999px;font:800 10px/1.3 Arial,sans-serif;color:#fff;vertical-align:middle}
.transport-delay-chip i{width:6px;height:6px;border-radius:50%;background:currentColor;display:block;box-shadow:0 0 0 1px rgba(255,255,255,.35)}
.transport-delay-chip.delay{background:#c62828}.transport-delay-chip.early{background:#15803d}.transport-delay-chip.ontime{background:#4b5563}.transport-delay-chip.unknown{background:#6b7280}
.train-detail-scale{position:relative}

.bus-rt-badge.ontime{background:#4b5563}.bus-rt-badge.unknown{background:#6b7280}

/* v289: spójna, czytelna typografia popupów transportu na desktopie i mobile. */
.bus-stop-marker span.service-alert{outline:0!important;box-shadow:none!important}
.bus-stop-marker span.selected{outline:0!important;box-shadow:none!important}
.transport-popup-unified{font-size:13px;line-height:1.42}
.vehicle-popup{text-align:left;min-width:270px;max-width:380px}
.vehicle-line{text-align:center;font:800 22px/1.15 Arial,sans-serif;margin:0 0 5px;color:inherit}
.train-popup-simple .vehicle-line{font-size:18px}
.vehicle-destination{text-align:center;font-size:13px;line-height:1.35;margin-bottom:3px}
.vehicle-operator{text-align:center;font-size:11px;line-height:1.35;opacity:.76;margin-bottom:8px}
.vehicle-status{margin:8px 0;padding:7px 9px;border-radius:6px;text-align:center;font-weight:800;font-size:12px}
.vehicle-status.delay{background:rgba(198,40,40,.17);color:#ff8a80}
.vehicle-status.early{background:rgba(21,128,61,.17);color:#7ee787}
.vehicle-status.cancelled{background:rgba(176,0,32,.18);color:#ff8a80}
.vehicle-next{margin:10px 0 8px;text-align:left}
.vehicle-next small,.vehicle-later>small{display:block;text-transform:uppercase;letter-spacing:.045em;font-size:10px;line-height:1.3;opacity:.68;margin-bottom:4px;font-weight:700}
.vehicle-next>b{display:block;font-size:15px;line-height:1.3;margin-bottom:3px}
.vehicle-next>span{font-size:13px;line-height:1.35;opacity:.94;font-variant-numeric:tabular-nums}
.vehicle-later{margin-top:9px}
.vehicle-later ul{list-style:none;margin:0!important;padding:0!important}
.vehicle-later li{display:grid;grid-template-columns:minmax(92px,auto) 1fr;gap:9px;align-items:start;margin:0!important;padding:6px 3px!important;font-size:12.5px;line-height:1.32;border-bottom:1px solid rgba(255,255,255,.08)}
.vehicle-later li:last-child{border-bottom:0}
.vehicle-later li span{opacity:.82;font-size:12px;line-height:1.35;font-variant-numeric:tabular-nums;white-space:nowrap}
.vehicle-later li b{font-size:12.5px;line-height:1.35;font-weight:650;overflow-wrap:anywhere}
.vehicle-stop-list{margin:0!important;padding-left:22px!important}
.vehicle-stop-list li{display:list-item!important;padding:6px 3px!important;font-size:12.5px!important;line-height:1.35;border-bottom:1px solid rgba(255,255,255,.08)}
.vehicle-stop-list li:last-child{border-bottom:0}
.vehicle-stop-list li.next{font-weight:750}
.stop-popup-heading{text-align:center}
.stop-popup-heading>b{display:block;font-size:15px;line-height:1.3}
.stop-popup-heading small{display:block;margin-top:3px;font-size:11px;line-height:1.3;opacity:.72}
.stop-departures{list-style:none!important;padding-left:0!important;margin:0!important}
.stop-departure-row{display:grid;grid-template-columns:7px 1fr;gap:9px;align-items:start;margin:0!important;padding:7px 3px!important;border-bottom:1px solid rgba(255,255,255,.08)}
.stop-departure-row:last-child{border-bottom:0}
.stop-provider-dot{display:block;width:6px;height:100%;min-height:32px;border-radius:4px;margin-top:1px}
.stop-departure-row.ztm .stop-provider-dot{background:#F04A3A}
.stop-departure-row.mks .stop-provider-dot{background:#1687e8}
.stop-departure-row.train .stop-provider-dot{background:#c62828}
.stop-departure-row>div>b{font-size:13px;line-height:1.32}
.stop-departure-row>div>span{font-size:12px;line-height:1.35;opacity:.9;font-variant-numeric:tabular-nums}
.stop-departure-row>div>small{display:block;font-size:10.5px;line-height:1.3;opacity:.66;margin-top:2px}

.transport-scroll{overflow-y:auto;overscroll-behavior:contain;touch-action:pan-y;-webkit-overflow-scrolling:touch;scrollbar-gutter:stable;padding-right:4px}
.transport-scroll{scrollbar-width:thin;scrollbar-color:rgba(255,255,255,.28) transparent}
.transport-scroll::-webkit-scrollbar{width:6px}
.transport-scroll::-webkit-scrollbar-thumb{background:rgba(255,255,255,.28);border-radius:999px}
.stop-departures-scroll{max-height:min(350px,48vh)}
.vehicle-stops-scroll{max-height:min(290px,40vh);margin-top:2px}
.transport-popup s{text-decoration-thickness:1.5px;opacity:.6}
.vehicle-later .vehicle-stops-scroll ul{margin-top:0!important}

@media(max-width:600px){
  .transport-popup-unified{font-size:13px;line-height:1.4}
  .vehicle-popup{min-width:250px;max-width:min(340px,calc(100vw - 56px))}
  .vehicle-line{font-size:21px;margin-bottom:4px}
  .vehicle-destination{font-size:13px}
  .vehicle-operator{font-size:11px;margin-bottom:7px}
  .vehicle-next{margin:9px 0 7px}
  .vehicle-next small,.vehicle-later>small{font-size:10px;margin-bottom:4px}
  .vehicle-next>b{font-size:15px}
  .vehicle-next>span{font-size:13px}
  .vehicle-later li{grid-template-columns:minmax(86px,auto) 1fr;gap:8px;padding:7px 2px!important;font-size:13px}
  .vehicle-later li span{font-size:12.5px}
  .vehicle-later li b,.vehicle-stop-list li{font-size:13px!important}
  .stop-popup-heading>b{font-size:15px}
  .stop-popup-heading small{font-size:11px}
  .stop-departure-row{gap:8px;padding:8px 2px!important}
  .stop-departure-row>div>b{font-size:13px}
  .stop-departure-row>div>span{font-size:12.5px}
  .stop-departure-row>div>small{font-size:10.5px}
  .stop-departures-scroll{max-height:min(330px,45vh)}
  .vehicle-stops-scroll{max-height:min(270px,38vh)}
}

@media(max-width:360px){
  .vehicle-popup{min-width:238px;max-width:calc(100vw - 44px)}
  .vehicle-later li{grid-template-columns:82px 1fr;gap:7px}
  .stop-departures-scroll{max-height:42vh}
  .vehicle-stops-scroll{max-height:35vh}
}



/* v290: wspólny język wizualny popupów pojazdów i tablic odjazdów. */
.vehicle-time-row{display:flex!important;align-items:baseline;gap:8px;flex-wrap:wrap;font-variant-numeric:tabular-nums}
.vehicle-countdown,.stop-countdown{display:inline-block;font-style:normal;font-weight:700;white-space:nowrap;color:inherit;opacity:.72}
.vehicle-countdown{font-size:11px}
.stop-countdown{font-size:10.5px;margin-left:4px}
.vehicle-facts{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:7px;margin:10px 0 8px}
.vehicle-facts>div{padding:7px 8px;border-radius:7px;background:rgba(255,255,255,.055);min-width:0}
.vehicle-facts small{display:block;text-transform:uppercase;letter-spacing:.045em;font-size:9.5px;line-height:1.25;opacity:.62;margin-bottom:2px;font-weight:700}
.vehicle-facts b{display:block;font-size:13px;line-height:1.28;font-weight:750;overflow-wrap:anywhere;font-variant-numeric:tabular-nums}
.vehicle-note{font-size:10.5px;line-height:1.35;opacity:.66;margin:2px 0 6px;text-align:center}
.aircraft-popup .vehicle-line,.ship-popup .vehicle-line{font-size:18px;overflow-wrap:anywhere}
.aircraft-popup .vehicle-destination,.ship-popup .vehicle-destination{margin-bottom:2px}
.train-popup-simple .vehicle-destination{margin-bottom:2px}
.train-popup-simple .vehicle-operator{margin-bottom:8px}
.stop-departure-row>div>span{display:block}
.stop-departure-row>div>span s{opacity:.58}
@media(max-width:600px){
  .vehicle-countdown{font-size:11.5px}
  .stop-countdown{font-size:11px}
  .vehicle-facts{gap:6px;margin:9px 0 7px}
  .vehicle-facts>div{padding:7px}
  .vehicle-facts b{font-size:13px}
  .aircraft-popup .vehicle-line,.ship-popup .vehicle-line{font-size:18px}
}

/* opt69: aktywne odjazdy z pojazdem live można wskazać bezpośrednio na mapie. */
.transport-live-link{cursor:pointer;border-radius:6px;transition:background-color .12s ease}
.transport-live-link:hover{background:rgba(255,255,255,.08)}
.transport-live-hint{font-size:9px;opacity:.62;font-weight:400}


/* opt102: przywrócony wcześniejszy wygląd wskaźnika promieniowania PAA. */
.radiation-custom-icon{background:transparent!important;border:0!important;overflow:visible!important}
.radiation-marker{background:#1a1a1a;color:#00ff00;font-weight:800;font-size:11px;line-height:16px;text-align:center;border-radius:4px;padding:2px 4px;border:2px solid #00ff00;box-shadow:2px 2px 4px rgba(0,0,0,.5);min-width:36px;box-sizing:border-box;white-space:nowrap;font-variant-numeric:tabular-nums}
.radiation-popup-old{text-align:center;width:180px;font-size:12px;line-height:1.45}
.radiation-popup-old hr{margin:6px 0;border:0;border-top:1px solid rgba(255,255,255,.25)}
.radiation-popup-title{font-size:13px}
.radiation-value{color:#00ff00;font-size:14px;font-weight:800}
.radiation-station-name{font-size:10px;color:#ccc}
.radiation-stale-note{margin:7px 0 2px;padding:6px 7px;border-left:3px solid #b0b5ba;background:rgba(176,181,186,.13);font-size:10px;line-height:1.35;text-align:left}
.legend-radiation-value{display:inline-grid;place-items:center;min-width:31px;height:18px;padding:0 3px;background:#1a1a1a;color:#00ff00;border:1.5px solid #00ff00;border-radius:3px;box-sizing:border-box;box-shadow:1px 1px 3px #0008;font:800 8.5px/1 Arial,sans-serif;font-variant-numeric:tabular-nums}


/* opt105: podpowiedzi warstw - pytajnik stylistycznie dopasowany do ciemnego menu LuFiLive. */
.layer-help-btn{
    margin-left:auto;width:19px;height:19px;flex:0 0 19px;padding:0;
    border:1px solid rgba(142,197,255,.44);background:rgba(8,14,22,.48);
    color:#b9dcff;display:grid;place-items:center;cursor:pointer;opacity:.92;
    border-radius:50%;position:relative;z-index:3;
    box-shadow:inset 0 0 0 1px rgba(255,255,255,.035),0 1px 3px rgba(0,0,0,.28);
    transition:color .14s ease,opacity .14s ease,background .14s ease,border-color .14s ease,box-shadow .14s ease
}
.layer-help-glyph{display:block;pointer-events:none;font:800 12px/17px Arial,sans-serif;transform:translateY(-.2px);text-shadow:0 1px 1px rgba(0,0,0,.45)}
.layer-help-btn:hover,.layer-help-btn:focus-visible{color:#fff;opacity:1;background:rgba(30,144,255,.28);border-color:rgba(173,216,255,.9);box-shadow:0 0 0 2px rgba(30,144,255,.14),0 2px 5px rgba(0,0,0,.32);outline:none}
.layer-help-btn::after{content:'Opis warstwy';position:absolute;right:24px;top:50%;transform:translateY(-50%);padding:4px 7px;border-radius:6px;background:rgba(8,10,14,.96);border:1px solid rgba(255,255,255,.18);color:#fff;font:600 10px/1.2 Arial,sans-serif;white-space:nowrap;box-shadow:0 4px 14px rgba(0,0,0,.35);opacity:0;visibility:hidden;pointer-events:none;transition:opacity .12s ease,visibility .12s ease}
.layer-help-btn:hover::after,.layer-help-btn:focus-visible::after{opacity:1;visibility:visible}
body.layer-help-open{overflow:hidden}
.layer-help-modal{position:fixed;inset:0;z-index:30000;display:grid;place-items:center;padding:18px}
.layer-help-modal[hidden]{display:none!important}
.layer-help-backdrop{position:absolute;inset:0;background:rgba(0,0,0,.72);backdrop-filter:var(--lufi-ui-blur);-webkit-backdrop-filter:var(--lufi-ui-blur)}
.layer-help-dialog{position:relative;z-index:1;width:min(540px,calc(100vw - 32px));max-height:min(78vh,720px);overflow:auto;box-sizing:border-box;padding:18px;border:1px solid rgba(255,255,255,.24);border-radius:14px;background:rgba(20,22,27,.97);color:#f3f4f6;box-shadow:0 18px 60px rgba(0,0,0,.62);font:13px/1.5 Arial,sans-serif;overscroll-behavior:contain}
.layer-help-dialog-head{display:flex;align-items:flex-start;gap:14px;padding-bottom:12px;border-bottom:1px solid rgba(255,255,255,.14)}
.layer-help-dialog-head>div{min-width:0;flex:1}
.layer-help-kicker{display:block;margin-bottom:2px;color:#9ca3af;font-size:10px;font-weight:800;letter-spacing:.08em;text-transform:uppercase}
.layer-help-dialog h3{margin:0;color:#fff;font-size:19px;line-height:1.25}
.layer-help-close{width:34px;height:34px;flex:0 0 34px;border:1px solid rgba(255,255,255,.2);border-radius:9px;background:rgba(255,255,255,.06);color:#fff;font:400 26px/30px Arial,sans-serif;cursor:pointer}
.layer-help-close:hover,.layer-help-close:focus-visible{background:rgba(255,255,255,.14);outline:2px solid rgba(30,144,255,.7)}
.layer-help-summary{margin:14px 0 15px;font-size:14px;line-height:1.55;color:#f5f5f5}
.layer-help-facts{display:grid;gap:8px;margin:0}
.layer-help-facts>div{display:grid;grid-template-columns:112px minmax(0,1fr);gap:10px;padding:9px 10px;border-radius:8px;background:rgba(255,255,255,.055)}
.layer-help-facts dt{margin:0;color:#aeb7c4;font-weight:800}
.layer-help-facts dd{margin:0;color:#f1f3f5;overflow-wrap:anywhere}
.layer-help-important{margin-top:14px;padding:11px 12px;border-left:3px solid rgba(30,144,255,.85);border-radius:0 8px 8px 0;background:rgba(30,144,255,.08)}
.layer-help-important[hidden]{display:none!important}
.layer-help-important b{display:block;margin-bottom:4px;color:#fff}
.layer-help-important p{margin:0;color:#dfe5eb}
@media (max-width:600px){
  .layer-help-modal{place-items:end center;padding:0}
  .layer-help-dialog{width:100%;max-height:82vh;border-radius:16px 16px 0 0;border-left:0;border-right:0;border-bottom:0;padding:17px 16px calc(18px + env(safe-area-inset-bottom))}
  .layer-help-facts>div{grid-template-columns:1fr;gap:2px}
}

/* opt106: jedyny separator w hamburgerze ma być między mapami bazowymi a warstwami. */
#sidebar .sidebar-title,#sidebar .marker-settings,#sidebar .source-details{border-top:0!important;border-bottom:0!important}
#sidebar .leaflet-control-layers-separator{display:block!important;border:0!important;border-top:1px solid rgba(255,255,255,.22)!important;margin:10px 0!important}

/* opt109: bąbelki opóźnień pociągów bliżej symbolu, jak przy autobusach. */
.live-train-icon .train-detail-scale>.bus-rt-badge{
  right:0!important;
  top:1px!important;
}


/* opt116: logo jako skrót mapy i panel "Tu i teraz" pod zegarem. */
#logo,#clock{cursor:pointer;user-select:none;-webkit-user-select:none;touch-action:manipulation}
#logo:active,#clock:active{background:rgba(80,80,80,.76)}
#now-panel{position:fixed;z-index:10020;top:calc(max(12px, env(safe-area-inset-top)) + 52px);left:max(12px, env(safe-area-inset-left));width:min(520px,calc(100vw - 24px));box-sizing:border-box;padding:12px 13px 13px;border:1px solid rgba(255,255,255,.2);border-radius:8px;background:var(--lufi-panel-bg);backdrop-filter:var(--lufi-ui-blur);-webkit-backdrop-filter:var(--lufi-ui-blur);color:#fff;box-shadow:0 4px 10px rgba(0,0,0,.5);font:12px/1.4 var(--lufi-font)}
#now-panel[hidden]{display:none!important}
.now-panel-close{position:absolute;top:5px;right:7px;width:24px;height:24px;padding:0;border:0;background:transparent;color:#fff;font:400 22px/22px var(--lufi-font);cursor:pointer;opacity:.8}
.now-panel-close:hover,.now-panel-close:focus-visible{opacity:1;outline:none}
.now-panel-date{padding-right:26px;color:#fff;font-size:13px;font-weight:700}
.now-panel-sun{display:flex;gap:8px;margin-top:9px}
.now-panel-sun>span{flex:1;padding:5px 7px;border-radius:5px;background:rgba(255,255,255,.055);white-space:nowrap}
.now-panel-sun b{float:right;font-variant-numeric:tabular-nums}
.now-panel-refresh-title{margin-top:10px;padding-top:8px;border-top:1px solid rgba(255,255,255,.13);color:#d8e0e7;font-size:10px;font-weight:800;text-transform:uppercase;letter-spacing:.05em}
.now-panel-refresh{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:4px 12px;margin-top:6px;overflow:visible;max-height:none;padding:0}
.now-refresh-row{display:grid;grid-template-columns:8px minmax(70px,1fr) auto;align-items:center;gap:6px;min-height:18px;min-width:0}
.now-refresh-row>span:nth-child(2){overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.now-refresh-row>b{font-size:10px;color:#dce5ed;font-weight:600;font-variant-numeric:tabular-nums;white-space:nowrap}
.now-status-dot{width:7px;height:7px;border-radius:50%;background:#6b7280;box-shadow:0 0 0 1px rgba(255,255,255,.15)}
.now-status-dot.ok{background:#34c759}.now-status-dot.stale{background:#ff9800}.now-status-dot.error{background:#d32f2f}.now-status-dot.off{background:#6b7280}
.now-panel-empty{grid-column:1/-1;padding:3px 0;color:#cbd5df;font-size:11px}
@media(max-width:430px){#now-panel{width:calc(100vw - 24px)}.now-panel-refresh{grid-template-columns:1fr}.now-panel-sun{gap:6px}.now-panel-sun>span{padding:5px 6px}}
#lufi-ui-toast{position:fixed;left:50%;bottom:max(74px,calc(env(safe-area-inset-bottom) + 54px));z-index:30020;transform:translate(-50%,12px);padding:9px 13px;border:1px solid rgba(255,255,255,.2);border-radius:8px;background:var(--lufi-panel-bg-strong);backdrop-filter:var(--lufi-ui-blur);-webkit-backdrop-filter:var(--lufi-ui-blur);color:#fff;font:700 12px/1.2 var(--lufi-font);box-shadow:0 6px 20px rgba(0,0,0,.45);opacity:0;pointer-events:none;transition:opacity .16s ease,transform .16s ease;white-space:nowrap}
#lufi-ui-toast.show{opacity:1;transform:translate(-50%,0)}
@media(max-width:420px){.now-panel-sun>span{padding:7px 6px}}


/* LuFiLive UI accent v1: neutral surfaces, turquoise = active/action. */
:root{--lufi-ui-accent:#2FBF71;--lufi-ui-accent-hi:#35D982;--lufi-ui-active-bg:rgba(47,191,113,.16);--lufi-ui-muted:#b9c4cc}
#pwa-install-banner{background:var(--lufi-ui-accent)!important;color:#f4fcfd!important;border-color:rgba(53,217,130,.72)!important;box-shadow:0 4px 15px rgba(0,0,0,.42),0 0 0 2px rgba(53,217,130,.10)!important}
#pwa-install-banner:hover{background:var(--lufi-ui-accent-hi)!important}
.sidebar-install-button:hover,.sidebar-install-button:focus-visible{background:var(--lufi-ui-accent-hi)!important;border-color:rgba(216,251,255,.58)!important;outline:none;box-shadow:0 0 0 2px rgba(53,217,130,.14),0 3px 9px rgba(0,0,0,.28)!important}
#custom-controls button:focus-visible{outline:none;border-color:rgba(53,217,130,.72)!important;box-shadow:0 0 0 2px rgba(53,217,130,.13),0 4px 6px rgba(0,0,0,.3)!important}
#custom-controls button:not(.lufi-gps-active):hover{border-color:rgba(185,196,204,.42);background:rgba(35,44,52,.88)}


/* v37: tańszy DOM i bardziej przewidywalne popupy. */
#sidebar{contain:layout paint style}
#sidebar:not(.open) .leaflet-control-layers{content-visibility:hidden}
#sidebar.open .leaflet-control-layers-base label,
#sidebar.open .leaflet-control-layers-overlays label{
  content-visibility:auto;
  contain-intrinsic-size:auto 30px;
  contain:layout paint style;
}
.leaflet-popup-content-wrapper{contain:layout paint style}
.transport-popup,.transport-popup-unified{box-sizing:border-box;width:100%}
.camera-media-box,.camera-popup-shell iframe,.camera-popup-shell video,.camera-popup-shell img{aspect-ratio:16/9}
.camera-popup-shell img{object-fit:contain}
/* Punkty przystankowe nie dostają obwódek także ze starszego cache CSS. */
.bus-stop-marker,.bus-stop-marker .lufi-scaled-icon-content,.bus-stop-marker span,
.bus-stop-marker span.service-alert,.bus-stop-marker span.selected{
  border:0!important;outline:0!important;box-shadow:none!important;filter:none!important;
}


/* v345: jeden język wizualny UI, semantic zoom i wspólny system popupów. */
/* v376: skala zależna od zoomu nie może zmieniać położenia zawartości względem iconAnchor.
   Rozmiar ustawiony przez użytkownika pozostaje, semantic zoom nie przesuwa już symboli. */
.lufi-scaled-icon-content{
    transform:scale(var(--lufi-user-marker-scale,1))!important;
    transform-origin:0 0!important;
}
.leaflet-marker-icon.lufi-selected-marker .lufi-scaled-icon-content{
    transform:scale(var(--lufi-user-marker-scale,1))!important;
}
/* Na dalekim zoomie zachowujemy główną wartość, ale usuwamy mikro-ozdobniki. */
html[data-lufi-detail="compact"] .camera-youtube-badge{display:none!important}
html[data-lufi-detail="compact"] .lufi-measure-noise .noise-unit,
html[data-lufi-detail="compact"] .lufi-measure-air small,
html[data-lufi-detail="compact"] .lufi-measure-river .river-unit{display:none!important}

/* Jeden rytm wizualny dla dymków wszystkich warstw. */
.leaflet-popup-content-wrapper{
    background:var(--lufi-panel-bg)!important;
    border:1px solid var(--lufi-panel-border)!important;
    border-radius:10px!important;
    box-shadow:0 6px 18px rgba(0,0,0,.34)!important;
    backdrop-filter:var(--lufi-ui-blur)!important;-webkit-backdrop-filter:var(--lufi-ui-blur)!important;
    font-family:var(--lufi-font)!important;
}
.leaflet-popup-tip{background:var(--lufi-panel-bg)!important;border-color:var(--lufi-panel-border)!important}
.leaflet-popup-content{font-family:var(--lufi-font)!important;color:#f4f7f9;line-height:1.42}
.leaflet-popup-content a{color:var(--lufi-ui-link)!important;text-decoration:none;font-weight:750}
.leaflet-popup-content a:hover{text-decoration:underline}
.leaflet-popup-content hr{height:1px;border:0;background:rgba(255,255,255,.13);margin:8px 0}
.leaflet-popup-content small{color:#bdc7d0;opacity:1}
.transport-popup,.transport-popup-unified,.fuel-popup,.lufi-event-popup{font-family:var(--lufi-font)!important;line-height:1.42}
.transport-popup> b:first-child,.fuel-popup> b:first-child,.lufi-event-popup h3,.stop-popup-heading>b{
    font-size:15px;font-weight:850;letter-spacing:-.01em;color:#fff;
}
.transport-popup table,.fuel-popup table{width:100%;border-collapse:collapse}
.transport-popup td,.fuel-popup td{border-bottom:1px solid rgba(255,255,255,.07)}
.transport-popup tr:last-child td,.fuel-popup tr:last-child td{border-bottom:0}
.vehicle-operator,.vehicle-note,.lufi-event-mini,.lufi-event-approx{color:#bdc7d0!important}

/* Zielony oznacza akcję aplikacji. Kolory samych danych/warstw pozostają semantyczne. */
#sidebar input[type="radio"],#sidebar input[type="checkbox"],#sidebar input[type="range"]{accent-color:var(--lufi-ui-accent)!important}
#sidebar #marker-size-value,#sidebar #marker-opacity-value{color:var(--lufi-ui-accent)!important}
#pwa-install-banner,.sidebar-install-button{background:var(--lufi-ui-accent)!important;border-color:var(--lufi-ui-accent-hi)!important}
#pwa-install-banner:hover,.sidebar-install-button:hover{background:var(--lufi-ui-accent-hi)!important}

/* v348 desktop: klasyczne szkło 5 px i półprzezroczyste powierzchnie. */
.ui-box,#sidebar,#custom-controls button,#now-panel,#lufi-ui-toast,#lufi-drive-hud,
.leaflet-popup-content-wrapper,.leaflet-popup-tip{
    backdrop-filter:var(--lufi-ui-blur)!important;-webkit-backdrop-filter:var(--lufi-ui-blur)!important;
}

/* v348 desktop glass: blur obejmuje także elementy tworzone przez moduły opcjonalne; mobile nadpisuje go na none. */
.ui-box,#sidebar,#custom-controls button,#now-panel,#lufi-ui-toast,#lufi-drive-hud,
.leaflet-popup-content-wrapper,.leaflet-popup-tip,.layer-help-backdrop,.layer-help-dialog,.lufi-event-pin{
    backdrop-filter:var(--lufi-ui-blur)!important;
    -webkit-backdrop-filter:var(--lufi-ui-blur)!important;
}


/* v348: szkło tylko na PC; mobile/tablet bez blur dla płynniejszego pan/zoom. */
@media (max-width:700px), (hover:none) and (pointer:coarse){
  .ui-box,#sidebar,#custom-controls button,#now-panel,#lufi-ui-toast,#lufi-drive-hud,
  .leaflet-popup-content-wrapper,.leaflet-popup-tip,.layer-help-backdrop,.layer-help-dialog,.lufi-event-pin{
    backdrop-filter:none!important;
    -webkit-backdrop-filter:none!important;
  }
  .ui-box,#sidebar,#now-panel,#lufi-ui-toast,.leaflet-popup-content-wrapper,.leaflet-popup-tip{background:rgba(20,20,20,.93)!important}
  #custom-controls button{background:rgba(20,20,20,.93)!important}
  #lufi-drive-hud{background:rgba(20,20,20,.93)!important}
  body.lufi-night .ui-box,body.lufi-night #custom-controls button,body.lufi-night #now-panel,body.lufi-night #lufi-ui-toast{background:rgba(12,16,21,.93)!important}
  body.lufi-night #sidebar{background:rgba(9,12,16,.93)!important}
  body.lufi-night #lufi-drive-hud{background:rgba(10,13,17,.93)!important}
  body.lufi-night .leaflet-popup-content-wrapper,body.lufi-night .leaflet-popup-tip{background:rgba(12,16,21,.93)!important}
}

/* v427: ikony SVG stacji kolejowych bez białej obwódki (zamiast białych kropek).
   CSS nie skaluje kontenera Leafleta, więc pozycja nie pływa przy zoomie. */
.rail-station-dom-icon.rail-station-svg-marker{
    background:transparent!important;border:0!important;border-radius:0!important;
    box-shadow:none!important;overflow:visible!important;
    cursor:pointer!important;pointer-events:auto!important;
}
.rail-station-svg-marker .rail-station-svg{
    display:block;position:absolute;top:0;left:0;
    filter:drop-shadow(0 1px 3px rgba(0,0,0,.42));
}
.rail-station-svg-marker .rail-station-svg-label{
    position:absolute;left:calc(100% + 3px);top:4px;display:block;
    white-space:nowrap;pointer-events:none;user-select:none;
    font:800 var(--lufi-marker-label-size)/17px var(--lufi-font);
    color:#fff;background:rgba(14,38,66,.86);
    border:0;border-radius:5px;
    padding:0 5px;text-shadow:0 1px 2px #000a;
    box-shadow:0 1px 3px rgba(0,0,0,.3);
}
.rail-station-svg-marker.rail-station-svg-local .rail-station-svg-label{
    font-size:var(--lufi-marker-code-size);line-height:15px;opacity:.93;
}
.rail-station-dom-icon.rail-station-svg-marker.lufi-selected-marker{
    border:0!important;box-shadow:none!important;
}
.rail-station-svg-marker.lufi-selected-marker .rail-station-svg{
    filter:drop-shadow(0 0 4px #ffd54a) drop-shadow(0 0 2px #ffd54a);
}
@media(max-width:700px){
    .rail-station-svg-marker .rail-station-svg-label{max-width:170px;overflow:hidden;text-overflow:ellipsis;}
}