* { box-sizing: border-box; }
body.nv { overflow: hidden; --nv-r: 6px; --nv-accent: #e9b83a; background: #fff; color: #202124; }
#map { height: calc(100dvh - var(--nv-bar-h)); width: 100%; }
.bike-search { position: fixed; top: calc(var(--nv-bar-h) + 12px); left: 12px; z-index: 1000; width: min(350px, calc(100vw - 80px)); }
.bike-search input { width: 100%; min-height: 44px; padding: 10px 12px; border: 1px solid #d8dadd; border-radius: var(--nv-r); background: #fff; font: inherit; }
#bike-onemap-search-results { background: #fff; max-height: 35dvh; overflow: auto; border-radius: var(--nv-r); }
.top-search-result { display: block; width: 100%; min-height: 44px; padding: 12px; border: 0; border-bottom: 1px solid #d8dadd; background: #fff; text-align: left; font: inherit; }
.top-search-result strong, .top-search-result span { display: block; }
.top-search-result span { font-size: 12px; color: #64686e; }
.bike-panel { position: fixed; z-index: 1000; left: 12px; top: calc(var(--nv-bar-h) + 68px); bottom: 12px; width: 350px; max-width: 100%; display: flex; flex-direction: column; background: #fff; border: 1px solid #d8dadd; border-radius: var(--nv-r); overflow: hidden; }
.bike-panel-head { flex-shrink: 0; padding: 12px; }
.bike-panel h1 { font-size: 20px; margin: 0 0 8px; }
.bike-chips { display: flex; flex-wrap: nowrap; gap: 6px; }
.nv .bike-chips button, .nv .rack-select, .nv .map-link, .nv .rack-save, .nv .rack-more, .nv #sheet-toggle { min-height: 44px; margin: 0; border: 1px solid #d8dadd; border-radius: var(--nv-r); background: #fff; padding: 8px 10px; color: #202124; font: inherit; cursor: pointer; }
.nv .bike-chips button { display: inline-flex; align-items: center; justify-content: center; gap: 6px; flex: 0 1 auto; white-space: nowrap; font-size: 13px; }
.bike-chips svg { width: 18px; height: 18px; flex-shrink: 0; }
.nv .bike-chips button[aria-pressed="true"] { background: var(--nv-accent); border-color: var(--nv-accent); font-weight: 600; }
#updated, #map-status { font-size: 12px; color: #64686e; margin: 8px 0 0; }
#updated[data-stale="true"], #map-status[data-state="error"] { color: #202124; font-weight: 700; }
#bike-sheet-scroll { flex: 1; min-height: 0; overflow: auto; overscroll-behavior: contain; }
#rack-list, #closures-list { overflow: visible; }
#rack-list[hidden], #closures-list[hidden], #map-status[hidden], .bike-segments[hidden] { display: none; }
.bike-segments { display: flex; gap: 4px; padding: 4px; margin-top: 8px; border: 1px solid #d8dadd; border-radius: var(--nv-r); }
.nv .bike-segments button { flex: 1; min-height: 44px; margin: 0; padding: 8px; border: 0; border-radius: var(--nv-r); background: #fff; color: #64686e; font: inherit; font-size: 13px; }
.nv .bike-segments button[aria-pressed="true"] { background: #f0f1f2; color: #202124; font-weight: 600; }
.closure-note { margin: 0; padding: 0 12px; border-top: 1px solid #e8e9eb; font-size: 12px; line-height: 1.5; color: #64686e; }
.closure-note summary { min-height: 44px; display: flex; align-items: center; cursor: pointer; text-decoration: underline; text-underline-offset: 3px; }
.closure-note p { margin: 0 0 12px; }
.closure-age { margin: 0; padding: 0 12px 8px; font-size: 11px; color: #64686e; }
.nv .closure-select { display: block; width: 100%; min-height: 44px; margin: 0; padding: 0; border: 0; border-radius: 0; background: #fff; color: #202124; text-align: left; font: inherit; }
.closure-row strong { display: block; font-size: 15px; line-height: 1.4; }
.closure-dates, .closure-dept { margin: 4px 0; font-size: 12px; line-height: 1.5; color: #64686e; }
.closure-location { display: inline-block; padding: 2px 6px; margin-top: 4px; border: 1px solid #d8dadd; border-radius: var(--nv-r); font-size: 11px; color: #64686e; }
.rack-row, .closure-row { padding: 12px; border-top: 1px solid #e8e9eb; overflow-wrap: anywhere; }
.rack-row { display: grid; grid-template-columns: minmax(0, 1fr); gap: 0; }
.nv .rack-select { border: 0; padding: 0; text-align: left; display: block; width: 100%; font-size: 15px; line-height: 1.35; font-weight: 600; }
.rack-meta { display: flex; align-items: center; gap: 6px; min-width: 0; margin: 0 0 10px; font-size: 11px; line-height: 1.5; color: #64686e; white-space: nowrap; }
.rack-meta > span { flex-shrink: 0; }
.rack-meta .rack-type { flex: 0 1 auto; min-width: 0; overflow: hidden; text-overflow: ellipsis; }
.rack-shelter { padding: 2px 4px; border: 1px solid #d8dadd; border-radius: var(--nv-r); font-size: 10px; color: #202124; }
.rack-actions { display: flex; justify-content: flex-end; align-items: center; gap: 6px; }
.nv .map-link { display: inline-flex; align-items: center; justify-content: center; gap: 6px; height: 44px; min-height: 44px; background: var(--nv-accent); border-color: var(--nv-accent); text-decoration: none; font-size: 13px; line-height: 1; color: #202124 !important; }
.map-link svg { width: 20px; height: 20px; flex-shrink: 0; }
.nv .rack-save { display: grid; place-items: center; flex: 0 0 44px; width: 44px; height: 44px; padding: 0; background: #fff; }
.nv .rack-save[aria-pressed="true"] { border-color: #202124; color: #202124; box-shadow: inset 0 0 0 1px #202124; }
.rack-save[aria-pressed="true"] svg { fill: var(--nv-accent); stroke: #202124; stroke-width: 8px; }
.nv .rack-more { display: block; width: calc(100% - 24px); margin: 12px; font-size: 13px; }
#racks-loading { position: fixed; top: calc(var(--nv-bar-h) + 64px); right: 12px; padding: 6px 10px; margin: 0; border: 1px solid #d8dadd; border-radius: var(--nv-r); background: #fff; color: #64686e; font-size: 12px; pointer-events: none; }
#racks-loading[hidden] { display: none; }
svg { vertical-align: middle; }
.bike-pin { display: grid; place-items: center; width: 36px; height: 36px; border: 2px solid #202124; border-radius: var(--nv-r); background: #fff; color: #202124; }
.bike-pin.sheltered { background: var(--nv-accent); }
.bike-cluster { display: grid; place-items: center; width: 44px; height: 44px; border: 2px solid #202124; border-radius: var(--nv-r); background: var(--nv-accent); color: #202124; font-size: 14px; font-weight: 700; }
.closure-pin { background: #fff; border: 2px solid #202124; border-radius: var(--nv-r); padding: 4px; }
.bike-info-popup { padding: 4px; overflow-wrap: anywhere; color: #202124; }
.bike-info-popup h2 { margin: 0; font-size: 16px; }
.bike-info-popup .rack-meta { margin-top: 8px; }
.leaflet-popup-content { max-width: min(280px, calc(100vw - 64px)); }
.nv .location-button { position: fixed; top: auto; right: 12px; bottom: min(calc(var(--bike-sheet-height, 8px) + 12px), calc(100dvh - var(--nv-bar-h) - 60px)); z-index: 1100; width: 48px; height: 48px; background: #fff; color: #202124; border: 1px solid #d8dadd; border-radius: var(--nv-r); }
.leaflet-control-zoom { display: none; }
.skeleton { height: 14px; background: #e8e9eb; border-radius: var(--nv-r); margin: 10px 0; width: 85%; }
.skeleton.short { width: 55%; }
#sheet-toggle { display: none; }
input:focus-visible, button:focus-visible, a:focus-visible { outline: 2px solid #202124; outline-offset: 2px; }
@media (max-width: 767px) {
 .bike-panel { left: 0; top: auto; bottom: 0; width: 100%; height: max(45dvh, 320px); max-height: calc(100dvh - var(--nv-bar-h) - 76px); border-radius: var(--nv-r) var(--nv-r) 0 0; }
 .bike-panel[data-expanded="true"] { height: max(72dvh, 360px); }
 .bike-panel[data-collapsed="true"] { height: 220px; }
 .bike-panel[data-collapsed="true"] #map-status { display: none; }
 .bike-panel-head { padding: 0 12px 8px; }
 .bike-panel h1 { font-size: 18px; margin: 0 0 4px; }
 .nv #sheet-toggle { display: flex; align-items: center; justify-content: center; width: 100%; height: 44px; border: 0; touch-action: none; padding: 0; }
 .sheet-grip { width: 32px; height: 4px; border-radius: var(--nv-r); background: #64686e; }
 .bike-search { width: min(350px, calc(100vw - 84px)); }
}
@media (prefers-reduced-motion: reduce) { *, *::before, *::after { animation: none !important; transition: none !important; } }
.nv-sr-only { position: absolute; width: 1px; height: 1px; margin: -1px; overflow: hidden; clip: rect(0,0,0,0); white-space: nowrap; border: 0; }
