body {
  font-family: 'Plus Jakarta Sans', sans-serif;
  -webkit-tap-highlight-color: transparent;
  user-select: none;
}

.hide-scrollbar::-webkit-scrollbar {
  display: none;
}
.hide-scrollbar {
  -ms-overflow-style: none;
  scrollbar-width: none;
}

/* Touch-friendly cards without disruptive jump transformations */
.coaster-card {
  transition: border-color 0.15s ease, background-color 0.15s ease;
  touch-action: manipulation;
}

.badge-pill {
  font-size: 0.68rem;
  font-weight: 700;
  padding: 2px 7px;
  border-radius: 9999px;
}

/* Leaflet Custom Marker & Popups */
.custom-marker {
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 9999px;
  color: white;
  font-weight: 800;
  box-shadow: 0 4px 10px rgba(0, 0, 0, 0.35);
  border: 2px solid #ffffff;
  transition: transform 0.2s ease;
}

.leaflet-popup-content-wrapper {
  background: #0f172a !important;
  color: #f8fafc !important;
  border-radius: 1rem !important;
  border: 1px solid #334155 !important;
  box-shadow: 0 10px 25px -5px rgba(0, 0, 0, 0.5) !important;
  padding: 4px;
}
.leaflet-popup-tip {
  background: #0f172a !important;
}
.leaflet-popup-content {
  margin: 8px 10px !important;
  line-height: 1.4 !important;
}
/* Mobile first: stable navigation, generous tap areas, focused plan. */
body { height:100dvh; font-family: system-ui, sans-serif; }
button, input, select, a { touch-action:manipulation; }
button, .nav-tab, .plan-actions a { min-height:44px; }
button:focus-visible, a:focus-visible, input:focus-visible { outline:3px solid #0284c7; outline-offset:2px; }
.next-card { background:#102a43; color:#fff; border-radius:18px; padding:18px; margin:12px 0; }
.next-card h2 { font-size:22px; line-height:1.2; font-weight:800; margin:8px 0; }
.next-card p { font-size:13px; color:#d9e2ec; margin-bottom:12px; }
.eyebrow { color:#fbbf24; font-size:12px; font-weight:700; }
.plan-actions { display:flex; flex-wrap:wrap; gap:8px; }
.plan-actions button, #findRidesBtn { flex:1; padding:10px 12px; border-radius:12px; background:#fbbf24; color:#102a43; font-size:13px; font-weight:750; }
#planFeedback:empty { display:none; }
#printPlan { display:none; }
@media(max-width:767px) {
  #sidebarContainer { padding-bottom:72px; }
  #sidebarContainer nav { position:fixed; bottom:0; left:0; right:0; padding-bottom:env(safe-area-inset-bottom); }
  body.map-active #sidebarContainer { display:none !important; }
  body.map-active #sidebarContainer > :not(nav) { display:none !important; }
  #mapViewContainer { padding-bottom:72px; }
  #sidebarContainer > div:nth-of-type(1) { padding:8px 10px; }
  body:not(.rides-active) #searchInput, body:not(.rides-active) #statusFilterSelect,
  body:not(.rides-active) .filter-pill { display:none; }
  input, select, textarea { font-size:16px !important; min-height:40px; }
  .coaster-card button { min-width:40px; }
}
@media print {
  @page { size:A4; margin:16mm; }
  html, body { display:block !important; height:auto !important; overflow:visible !important; background:white !important; color:#111 !important; }
  body > :not(#printPlan) { display:none !important; }
  #printPlan { display:block !important; font:12pt/1.5 system-ui,sans-serif; }
  #printPlan h1 { font-size:25pt; font-weight:800; margin-bottom:6mm; }
  #printPlan h2 { font-size:15pt; font-weight:700; margin-top:10mm; }
  #printPlan li { margin:4mm 0; break-inside:avoid; }
  #printPlan ol { list-style:decimal; padding-left:8mm; }
  #printPlan li p { font-size:10pt; color:#444; }
  .note-lines { height:35mm; background:repeating-linear-gradient(white,white 8mm,#bbb 8.2mm,white 8.4mm); }
  #printPlan footer { margin-top:8mm; font-size:9pt; color:#555; }
}
.group-panel { padding:14px; border:1px solid #cbd5e1; border-radius:14px; font-size:13px; background:#fff; color:#334155; }
.group-panel summary { font-weight:750; cursor:pointer; min-height:32px; }
.group-panel p { margin:8px 0; line-height:1.5; }
.group-panel label { display:block; font-size:12px; margin:8px 0; }
.group-panel input { display:block; width:100%; border:1px solid #cbd5e1; border-radius:8px; padding:8px; background:white; color:#102a43; }
.group-panel button { border-radius:8px; background:#e2e8f0; padding:8px 12px; font-weight:700; }
.person-fields { display:flex; gap:12px; }.person-fields label { width:50%; }
.person-row { display:flex; align-items:center; justify-content:space-between; border-top:1px solid #e2e8f0; margin-top:8px; gap:8px; }
.transfer-button { min-width:36px; color:#0369a1; font-size:18px; }
#plannerListContainer > div { flex-wrap:wrap; }
#plannerListContainer > div > div:last-child { margin-left:auto; }
body:not(.rides-active) #searchInput { display:none; }
@media(max-width:767px) { body:not(.rides-active) #searchInput + * { display:none; } body:not(.rides-active) #searchInput { display:none; } body:not(.rides-active) .relative:has(#searchInput) { display:none; } }
body:not(.rides-active) .relative:has(#searchInput), body:not(.rides-active) #statusFilterSelect, body:not(.rides-active) .filter-pill { display:none; }
.transfer-button { font-size:11px; padding:4px 6px; background:#eff6ff; border-radius:8px; }

/* Navigation is independent of hidden sidebar; map has explicit mobile bounds. */
#appNav { position:fixed; left:0; bottom:0; width:100%; z-index:1200; padding-bottom:env(safe-area-inset-bottom); }
#sidebarContainer { padding-bottom:76px; }
#mapViewContainer { min-width:0; z-index:1; }
#mapSummary { position:absolute; left:12px; top:12px; z-index:1000; max-width:calc(100% - 180px); padding:9px 11px; background:#fff; color:#102a43; font:600 12px/1.5 system-ui,sans-serif; border-radius:12px; box-shadow:0 2px 10px #0003; pointer-events:none; }
#mapUnavailable { position:absolute; inset:25% 20px auto; z-index:1100; padding:20px; background:white; color:#102a43; border-radius:16px; }
.attraction-map-label { font:600 11px system-ui,sans-serif; border-radius:6px; }
@media(min-width:768px) { #appNav { width:460px; } #mapViewContainer { display:block !important; padding-bottom:0; } }
@media(min-width:1024px) { #appNav { width:480px; } }
@media(max-width:767px) {
 body.map-active #mapViewContainer { display:block !important; position:fixed; top:0; left:0; right:0; bottom:calc(64px + env(safe-area-inset-bottom)); height:auto; padding:0; }
 body:not(.map-active) #mapViewContainer { display:none !important; }
 #map { height:100%; width:100%; }
 #mapSummary { top:auto; bottom:12px; max-width:calc(100% - 64px); }
}
@media print { #appNav { display:none !important; } }
.map-options summary { cursor:pointer; padding:12px 6px; font:700 12px system-ui,sans-serif; color:#fff; }
.map-options[open] { display:flex; flex-direction:column; gap:6px; }
.map-options button { display:block; width:100%; }