/* ============================================================================
   WANDERLOG MODE — Airbnb + Apple + Wanderlog editorial travel app
   Clean, airy, magazine-quality. Parents could use it.
   ============================================================================ */
body.mode-wanderlog {
  background: #FAFAF7 !important;
  background-image: none !important;
  font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif !important;
  color: #1a1a1a !important;
  padding: 24px !important;
  line-height: 1.7 !important;
  font-size: 16px !important;
  --sec: #6b7280 !important;
  --bdr: #e5e7eb !important;
  --primary: #1B3A6B;
  --primary-light: #E8EEF6;
}

/* Links */
body.mode-wanderlog a { color: #1B3A6B !important; text-decoration: underline !important; }
body.mode-wanderlog a:hover { color: #142D52 !important; }
body.mode-wanderlog a:visited { color: #5b3fa0 !important; }

/* Placeholder text */
body.mode-wanderlog input::placeholder,
body.mode-wanderlog textarea::placeholder {
  color: #9ca3af !important;
  opacity: 1 !important;
}

/* Selection */
body.mode-wanderlog ::selection {
  background: rgba(27,58,107,0.2) !important;
  color: #1a1a1a !important;
}

/* Scrollbar (Wanderlog) */
body.mode-wanderlog ::-webkit-scrollbar { width: 8px !important; height: 8px !important; }
body.mode-wanderlog ::-webkit-scrollbar-track { background: #f3f4f6 !important; }
body.mode-wanderlog ::-webkit-scrollbar-thumb { background: #d1d5db !important; border-radius: 4px !important; }
body.mode-wanderlog ::-webkit-scrollbar-thumb:hover { background: #9ca3af !important; }

/* HR */
body.mode-wanderlog hr { border: none !important; border-top: 1px solid #e5e7eb !important; margin: 16px 0 !important; }

/* Textarea focus-visible */
body.mode-wanderlog textarea:focus-visible {
  outline: 2px solid #D4A843 !important;
  outline-offset: 2px !important;
}

/* Typography */
body.mode-wanderlog h1 {
  font-family: 'DM Sans', 'Inter', sans-serif !important;
  font-size: 34px !important;
  font-weight: 700 !important;
  letter-spacing: -1px !important;
  color: #1a1a1a !important;
  margin-bottom: 4px !important;
}
body.mode-wanderlog h2 {
  font-family: 'DM Sans', 'Inter', sans-serif !important;
  font-size: 24px !important;
  font-weight: 700 !important;
  letter-spacing: -0.5px !important;
  color: #1B3A6B !important;
  margin-bottom: 16px !important;
}
body.mode-wanderlog h3 {
  font-family: 'DM Sans', 'Inter', sans-serif !important;
  font-size: 18px !important;
  font-weight: 600 !important;
  letter-spacing: -0.3px !important;
  color: #1a1a1a !important;
  margin-bottom: 10px !important;
}
body.mode-wanderlog .subtitle {
  font-size: 14px !important;
  color: #6b7280 !important;
  font-weight: 500 !important;
  margin-bottom: 24px !important;
}

/* Cards */
body.mode-wanderlog .card {
  background: #FFFFFF !important;
  border-radius: 24px !important;
  padding: 32px !important;
  margin-bottom: 24px !important;
  box-shadow: 0 2px 12px rgba(0,0,0,0.04) !important;
  border: 1px solid rgba(0,0,0,0.04) !important;
  transition: box-shadow 0.4s var(--ease-out), transform 0.4s var(--ease-out) !important;
}
body.mode-wanderlog .card:hover {
  box-shadow: 0 4px 24px rgba(0,0,0,0.08) !important;
  transform: translateY(-2px) !important;
}
/* Remove the left-bar decoration in wanderlog */
body.mode-wanderlog .card > h2:first-child,
body.mode-wanderlog .card > div:first-child > h2 {
  padding-left: 0 !important;
}
body.mode-wanderlog .card > h2:first-child::before,
body.mode-wanderlog .card > div:first-child > h2::before {
  display: none !important;
}

/* Header */
body.mode-wanderlog .header-row {
  background: #FFFFFF !important;
  border-radius: 28px !important;
  padding: 24px 32px !important;
  box-shadow: 0 2px 16px rgba(0,0,0,0.04) !important;
  border: 1px solid rgba(0,0,0,0.04) !important;
  margin-bottom: 24px !important;
}

/* Castle icon */
body.mode-wanderlog .castle-icon {
  width: 52px !important;
  height: 52px !important;
  filter: drop-shadow(0 2px 4px rgba(27,58,107,0.15)) !important;
  transition: transform 0.3s var(--ease-out) !important;
}
body.mode-wanderlog .castle-icon:hover {
  transform: scale(1.08) rotate(-2deg) !important;
}
body.mode-wanderlog .sparkle {
  color: #D4A843 !important;
  font-size: 14px !important;
  animation: sparkle-pulse 2.5s ease-in-out infinite !important;
  filter: drop-shadow(0 0 2px rgba(212,168,67,0.5)) !important;
}
body.mode-wanderlog .sparkle:nth-child(1) { top: -6px !important; right: -10px !important; animation-delay: 0s !important; }
body.mode-wanderlog .sparkle:nth-child(2) { top: 10px !important; right: -20px !important; animation-delay: 0.8s !important; font-size: 11px !important; }
body.mode-wanderlog .sparkle:nth-child(3) { top: -4px !important; right: -30px !important; animation-delay: 1.5s !important; font-size: 9px !important; }

/* Buttons */
body.mode-wanderlog .btn {
  padding: 12px 24px !important;
  border-radius: 14px !important;
  font-family: 'Inter', sans-serif !important;
  font-weight: 600 !important;
  font-size: 14px !important;
  min-height: 44px !important;
  letter-spacing: 0 !important;
  transition: all 0.3s var(--ease-out) !important;
  border: none !important;
}
body.mode-wanderlog .btn-primary {
  background: #1B3A6B !important;
  color: white !important;
  box-shadow: 0 2px 12px rgba(27,58,107,0.2) !important;
}
body.mode-wanderlog .btn-primary:hover {
  background: #142D52 !important;
  box-shadow: 0 6px 24px rgba(27,58,107,0.3) !important;
  transform: translateY(-2px) !important;
}
body.mode-wanderlog .btn-secondary {
  background: #f3f4f6 !important;
  color: #374151 !important;
  border: 1px solid #e5e7eb !important;
  box-shadow: none !important;
}
body.mode-wanderlog .btn-secondary:hover {
  background: #e5e7eb !important;
  transform: translateY(-1px) !important;
}
body.mode-wanderlog .btn-danger {
  background: #ef4444 !important;
  color: white !important;
  box-shadow: 0 2px 8px rgba(239,68,68,0.25) !important;
}
body.mode-wanderlog .btn-danger:hover {
  background: #dc2626 !important;
  transform: translateY(-1px) !important;
}
body.mode-wanderlog .btn-success {
  background: #22c55e !important;
  color: white !important;
  box-shadow: 0 2px 8px rgba(34,197,94,0.25) !important;
}
body.mode-wanderlog .btn-warning {
  background: #f59e0b !important;
  color: white !important;
  box-shadow: 0 2px 8px rgba(245,158,11,0.25) !important;
}
body.mode-wanderlog .btn-small {
  padding: 8px 16px !important;
  font-size: 13px !important;
  min-height: 36px !important;
}
body.mode-wanderlog .btn-icon {
  padding: 10px !important;
  min-width: 44px !important;
  min-height: 44px !important;
}

/* Tab Bar — horizontal pills */
body.mode-wanderlog .tabs-wrap {
  background: rgba(250,250,247,0.88) !important;
  -webkit-backdrop-filter: blur(20px) saturate(200%) !important;
  backdrop-filter: blur(20px) saturate(200%) !important;
  margin-bottom: 28px !important;
  margin-left: -24px !important;
  margin-right: -24px !important;
  padding: 10px 24px !important;
  border-bottom: 1px solid rgba(0,0,0,0.05) !important;
}
body.mode-wanderlog .tabs-wrap::after {
  background: linear-gradient(90deg, transparent, rgba(250,250,247,0.95)) !important;
  width: 48px !important;
}
body.mode-wanderlog .tabs {
  padding-right: 32px !important;
  gap: 4px !important;
}
body.mode-wanderlog .tab {
  border-radius: 12px !important;
  padding: 10px 20px !important;
  border-bottom: none !important;
  font-family: 'Inter', sans-serif !important;
  font-weight: 500 !important;
  font-size: 14px !important;
  color: #6b7280 !important;
  background: transparent !important;
  transition: all 0.25s var(--ease-out) !important;
  margin: 0 2px !important;
}
body.mode-wanderlog .tab-icon {
  margin-right: 4px !important;
}
body.mode-wanderlog .tab:hover {
  background: rgba(27,58,107,0.06) !important;
  color: #1B3A6B !important;
}
body.mode-wanderlog .tab.active {
  background: #1B3A6B !important;
  color: white !important;
  border-bottom-color: transparent !important;
  box-shadow: 0 2px 12px rgba(27,58,107,0.25) !important;
  font-weight: 600 !important;
}

/* Setup Pills — rounded pill buttons */
body.mode-wanderlog .overview-pills,
body.mode-wanderlog .plan-pills,
body.mode-wanderlog .reservations-pills,
body.mode-wanderlog .attractions-pills,
body.mode-wanderlog .setup-pills {
  border-bottom: 1px solid rgba(0,0,0,0.06) !important;
}
body.mode-wanderlog .overview-pill,
body.mode-wanderlog .plan-pill,
body.mode-wanderlog .reservations-pill,
body.mode-wanderlog .attractions-pill,
body.mode-wanderlog .setup-pill {
  padding: 10px 24px !important;
  border-radius: 28px !important;
  border: 1.5px solid #e5e7eb !important;
  background: #FFFFFF !important;
  font-size: 14px !important;
  font-weight: 500 !important;
  color: #6b7280 !important;
  font-family: 'Inter', sans-serif !important;
  box-shadow: none !important;
  transition: all 0.25s var(--ease-out) !important;
}
body.mode-wanderlog .overview-pill:hover,
body.mode-wanderlog .plan-pill:hover,
body.mode-wanderlog .reservations-pill:hover,
body.mode-wanderlog .attractions-pill:hover,
body.mode-wanderlog .setup-pill:hover {
  border-color: #1B3A6B !important;
  color: #1B3A6B !important;
  transform: translateY(-1px) !important;
  box-shadow: 0 2px 8px rgba(27,58,107,0.08) !important;
}
body.mode-wanderlog .overview-pill.active,
body.mode-wanderlog .plan-pill.active,
body.mode-wanderlog .reservations-pill.active,
body.mode-wanderlog .attractions-pill.active,
body.mode-wanderlog .setup-pill.active {
  border-color: #1B3A6B !important;
  background: #1B3A6B !important;
  color: white !important;
  box-shadow: 0 2px 12px rgba(27,58,107,0.2) !important;
}

/* Tools pills — same style as setup pills */
body.mode-wanderlog .tools-pills {
  padding-bottom: 14px !important;
  margin-bottom: 24px !important;
  gap: 8px !important;
}
body.mode-wanderlog .tools-pill {
  padding: 10px 20px !important;
  border-radius: 100px !important;
  border: 1.5px solid #e5e7eb !important;
  background: white !important;
  color: #4b5563 !important;
  font-family: 'Inter', sans-serif !important;
  font-size: 13px !important;
  font-weight: 600 !important;
  transition: all 0.2s !important;
}
body.mode-wanderlog .tools-pill:hover {
  border-color: #1B3A6B !important;
  color: #1B3A6B !important;
  background: #f0f4f8 !important;
}
body.mode-wanderlog .tools-pill.active {
  border-color: #1B3A6B !important;
  background: #1B3A6B !important;
  color: white !important;
  box-shadow: 0 2px 12px rgba(27,58,107,0.2) !important;
}

/* More dropdown */
body.mode-wanderlog .tab-more-dropdown {
  border-radius: 20px !important;
  border: 1px solid rgba(0,0,0,0.06) !important;
  background: rgba(255,255,255,0.98) !important;
  -webkit-backdrop-filter: blur(20px) !important;
  backdrop-filter: blur(20px) !important;
  box-shadow: 0 12px 48px rgba(0,0,0,0.12) !important;
  padding: 8px !important;
}
body.mode-wanderlog .tab-more-item {
  border-radius: 12px !important;
  padding: 12px 16px !important;
  font-family: 'Inter', sans-serif !important;
  font-size: 14px !important;
  font-weight: 500 !important;
  color: #1a1a1a !important;
  border: none !important;
  background: none !important;
}
body.mode-wanderlog .tab-more-item:hover {
  background: #f3f4f6 !important;
}
body.mode-wanderlog .tab-more-item.active {
  color: #1B3A6B !important;
  background: #E8EEF6 !important;
}
body.mode-wanderlog .tab-more-item .tab-icon { font-size: 16px !important; }

/* Sidebar — Wanderlog: warm cream, editorial, gold accents */
body.mode-wanderlog #sidebar {
  background: #FFF8F0 !important;
  border-right: 1px solid #E8DFD4 !important;
  width: 260px;
}
body.mode-wanderlog .sidebar-header {
  padding: 24px 20px 20px !important;
}
body.mode-wanderlog .sidebar-title {
  font-family: 'DM Sans', 'Inter', sans-serif !important;
  font-size: 15px !important;
  color: #1B3A6B !important;
}
body.mode-wanderlog .sidebar-subtitle {
  color: #8C7B6B !important;
}
body.mode-wanderlog .sidebar-collapse-btn {
  color: #8C7B6B !important;
}
body.mode-wanderlog .sidebar-collapse-btn:hover {
  background: rgba(212,168,67,0.12) !important;
}
body.mode-wanderlog .nav-divider {
  background: #E8DFD4 !important;
}
body.mode-wanderlog .nav-item {
  font-family: 'DM Sans', 'Inter', sans-serif !important;
  font-size: 14px !important;
  font-weight: 500 !important;
  color: #5C5248 !important;
  padding: 12px 20px !important;
  border-radius: 12px !important;
}
body.mode-wanderlog .nav-item:hover {
  background: rgba(212,168,67,0.08) !important;
  color: #1B3A6B !important;
}
body.mode-wanderlog .nav-item.active {
  background: var(--gold-light) !important;
  border-left: 3px solid var(--gold) !important;
  color: #1B3A6B !important;
  font-weight: 600 !important;
}
body.mode-wanderlog .sidebar-footer {
  border-top-color: #E8DFD4 !important;
  background: #FFF5E8 !important;
}
body.mode-wanderlog #contentHeader h1 {
  font-family: 'DM Sans', 'Inter', sans-serif !important;
  font-size: 28px !important;
  font-weight: 700 !important;
  color: #1B3A6B !important;
}
body.mode-wanderlog #mainContent {
  padding: 0 24px 24px !important;
}

/* Bottom bar — Wanderlog */
body.mode-wanderlog #bottomBar {
  background: #FFFDF9 !important;
  border-top: 1px solid #E8DFD4 !important;
}
body.mode-wanderlog .bottom-tab {
  color: #8C7B6B !important;
}
body.mode-wanderlog .bottom-tab.active {
  color: #1B3A6B !important;
}
body.mode-wanderlog .bottom-tab.active::after {
  content: '' !important;
  position: absolute !important;
  bottom: 4px !important;
  left: 50% !important;
  transform: translateX(-50%) !important;
  width: 6px !important;
  height: 6px !important;
  border-radius: 50% !important;
  background: var(--gold) !important;
}
body.mode-wanderlog .more-panel {
  background: #FFFDF9 !important;
  border-top: 1px solid #E8DFD4 !important;
  border-radius: 20px 20px 0 0 !important;
  box-shadow: 0 -4px 24px rgba(0,0,0,0.08) !important;
}
body.mode-wanderlog .more-panel-item {
  color: #5C5248 !important;
  background: none !important;
}
body.mode-wanderlog .more-panel-item:hover {
  background: rgba(212,168,67,0.08) !important;
}
body.mode-wanderlog .more-panel-close {
  color: #8C7B6B !important;
}

/* Inputs — large, rounded, clean */
body.mode-wanderlog input[type="date"],
body.mode-wanderlog input[type="text"],
body.mode-wanderlog input[type="number"],
body.mode-wanderlog input[type="time"],
body.mode-wanderlog input[type="password"],
body.mode-wanderlog select,
body.mode-wanderlog textarea {
  padding: 14px 18px !important;
  border: 1.5px solid #e5e7eb !important;
  border-radius: 14px !important;
  font-size: 15px !important;
  font-family: 'Inter', sans-serif !important;
  background: #FFFFFF !important;
  color: #1a1a1a !important;
  transition: border-color 0.2s, box-shadow 0.2s !important;
}
body.mode-wanderlog input:focus,
body.mode-wanderlog select:focus,
body.mode-wanderlog textarea:focus {
  border-color: #1B3A6B !important;
  box-shadow: 0 0 0 4px rgba(27,58,107,0.08) !important;
  outline: none !important;
}
body.mode-wanderlog .crowd-input,
body.mode-wanderlog .compact-input {
  padding: 4px 8px !important;
  border-radius: 8px !important;
  font-size: 13px !important;
  font-weight: 600 !important;
  min-height: auto !important;
}
body.mode-wanderlog input[type="time"].compact-input {
  width: 105px !important;
  padding: 4px 6px !important;
  font-size: 13px !important;
  border-radius: 8px !important;
}
body.mode-wanderlog input.pack-qty-input {
  padding: 2px 4px !important;
  border: 1px solid #e5e7eb !important;
  border-radius: 6px !important;
  font-size: 12px !important;
  font-weight: 600 !important;
  width: 44px !important;
  min-height: auto !important;
  text-align: center !important;
  margin-left: auto !important;
  background: #fff !important;
  color: #1a1a1a !important;
}
body.mode-wanderlog .compact-select {
  padding: 4px 10px !important;
  border-radius: 8px !important;
  font-size: 13px !important;
  min-width: auto !important;
  min-height: auto !important;
}

/* Form labels */
body.mode-wanderlog .form-group label {
  font-family: 'Inter', sans-serif !important;
  font-size: 12px !important;
  font-weight: 600 !important;
  color: #6b7280 !important;
  text-transform: uppercase !important;
  letter-spacing: 0.8px !important;
}

/* Calendar day cards */
body.mode-wanderlog .calendar-grid {
  gap: 24px !important;
}
body.mode-wanderlog .day-card {
  border: 1px solid rgba(0,0,0,0.05) !important;
  border-radius: 20px !important;
  background: #FFFFFF !important;
  box-shadow: 0 2px 12px rgba(0,0,0,0.04) !important;
  transition: all 0.3s var(--ease-out) !important;
}
body.mode-wanderlog .day-card:hover {
  box-shadow: 0 8px 32px rgba(0,0,0,0.08) !important;
  transform: translateY(-3px) !important;
}
body.mode-wanderlog .day-card.has-conflict {
  border-color: #ef4444 !important;
  box-shadow: 0 2px 16px rgba(239,68,68,0.12) !important;
}
body.mode-wanderlog .day-header {
  padding: 16px 22px !important;
  font-weight: 700 !important;
  font-size: 16px !important;
  font-family: 'DM Sans', sans-serif !important;
  letter-spacing: -0.2px !important;
}
body.mode-wanderlog .day-body {
  padding: 16px 22px !important;
}
body.mode-wanderlog .day-hotel {
  font-size: 13px !important;
  color: #6b7280 !important;
  margin-bottom: 12px !important;
  font-weight: 500 !important;
}
body.mode-wanderlog .park-assigned {
  padding: 10px 16px !important;
  border-radius: 12px !important;
  font-weight: 700 !important;
  font-size: 14px !important;
  letter-spacing: 0.3px !important;
  box-shadow: 0 2px 8px rgba(0,0,0,0.12) !important;
}

/* Crowd items */
body.mode-wanderlog .crowd-item {
  font-size: 13px !important;
  padding: 6px 10px !important;
  border-radius: 10px !important;
  background: #f9fafb !important;
}
body.mode-wanderlog .crowd-item .park-label {
  font-weight: 500 !important;
}
body.mode-wanderlog .crowd-badge {
  border-radius: 8px !important;
  font-weight: 700 !important;
  font-size: 12px !important;
}

/* Score bar */
body.mode-wanderlog .score-bar {
  margin-top: 10px !important;
  padding: 10px 14px !important;
  border-radius: 12px !important;
  font-size: 13px !important;
  font-weight: 600 !important;
  text-align: center !important;
  letter-spacing: 0.2px !important;
}
body.mode-wanderlog .score-great { background: #ecfdf5 !important; color: #065f46 !important; }
body.mode-wanderlog .score-good { background: #fffbeb !important; color: #92400e !important; }
body.mode-wanderlog .score-bad { background: #fef2f2 !important; color: #991b1b !important; }

/* Dining items */
body.mode-wanderlog .dining-item {
  font-size: 13px !important;
  padding: 10px 14px !important;
  background: rgba(253,246,227,0.4) !important;
  border-radius: 12px !important;
  border: 1px solid rgba(212,168,67,0.08) !important;
  font-weight: 500 !important;
}

/* Event tags */
body.mode-wanderlog .event-tag {
  font-size: 11px !important;
  padding: 3px 10px !important;
  border-radius: 12px !important;
  background: #f0ecf9 !important;
  color: #6b3fa0 !important;
  font-weight: 500 !important;
}
body.mode-wanderlog .event-tag.ext-evening { background: #e8eef6 !important; color: #1a3a6b !important; }
body.mode-wanderlog .event-tag.after-hours { background: #fce7ef !important; color: #cc3366 !important; }
body.mode-wanderlog .event-tag.festival { background: #ecfdf5 !important; color: #2d6b3f !important; }

/* Guest/Group badges */
body.mode-wanderlog .guest-badge {
  display: inline-block !important;
  font-size: 12px !important;
  padding: 3px 10px !important;
  border-radius: 12px !important;
  background: #E8EEF6 !important;
  color: #1B3A6B !important;
  font-weight: 500 !important;
  margin-top: 4px !important;
}
body.mode-wanderlog .transfer-badge {
  font-size: 11px !important;
  padding: 3px 10px !important;
  border-radius: 12px !important;
  background: #fff7ed !important;
  color: #c2410c !important;
  font-weight: 500 !important;
}
body.mode-wanderlog .group-badge {
  display: inline-block !important;
  font-size: 11px !important;
  padding: 2px 8px !important;
  border-radius: 10px !important;
  background: #f0ecf9 !important;
  color: #6b3fa0 !important;
  font-weight: 500 !important;
}

/* Dashboard */
body.mode-wanderlog .dash-grid {
  gap: 24px !important;
}
body.mode-wanderlog .dash-card {
  background: #FFFFFF !important;
  border-radius: 24px !important;
  padding: 28px !important;
  border: 1px solid rgba(0,0,0,0.04) !important;
  box-shadow: 0 2px 16px rgba(0,0,0,0.04) !important;
  transition: all 0.3s var(--ease-out) !important;
}
body.mode-wanderlog .dash-card::before {
  content: '' !important;
  position: absolute !important;
  top: 0 !important;
  left: 0 !important;
  right: 0 !important;
  height: 4px !important;
  background: linear-gradient(90deg, #1B3A6B, #D4A843) !important;
  border-radius: 24px 24px 0 0 !important;
  opacity: 1 !important;
}
body.mode-wanderlog .dash-card:hover {
  transform: translateY(-3px) !important;
  box-shadow: 0 8px 32px rgba(0,0,0,0.08) !important;
}
body.mode-wanderlog .dash-card h4 {
  font-size: 12px !important;
  text-transform: uppercase !important;
  color: #6b7280 !important;
  margin-bottom: 12px !important;
  letter-spacing: 1.5px !important;
  font-weight: 700 !important;
  font-family: 'Inter', sans-serif !important;
}
body.mode-wanderlog .dash-pct {
  font-size: 44px !important;
  font-weight: 700 !important;
  margin-bottom: 4px !important;
  font-family: 'DM Sans', sans-serif !important;
  color: #1B3A6B !important;
}
body.mode-wanderlog .dash-bar {
  height: 6px !important;
  border-radius: 3px !important;
  background: #f3f4f6 !important;
  margin-top: 12px !important;
}
body.mode-wanderlog .dash-bar-fill {
  border-radius: 3px !important;
}
body.mode-wanderlog .dash-detail {
  font-size: 13px !important;
  color: #6b7280 !important;
  margin-top: 8px !important;
  font-weight: 500 !important;
}

/* Stat boxes */
body.mode-wanderlog .stat-box {
  background: #FFFFFF !important;
  border-radius: 18px !important;
  border: 1px solid rgba(0,0,0,0.04) !important;
  padding: 20px 28px !important;
  box-shadow: 0 2px 8px rgba(0,0,0,0.03) !important;
  transition: transform 0.2s var(--ease-out) !important;
}
body.mode-wanderlog .stat-box:hover {
  transform: translateY(-1px) !important;
}
body.mode-wanderlog .stat-box .stat-value {
  font-size: 32px !important;
  font-weight: 700 !important;
  font-family: 'DM Sans', sans-serif !important;
  color: #1B3A6B !important;
}
body.mode-wanderlog .stat-box .stat-label {
  font-size: 12px !important;
  color: #6b7280 !important;
  text-transform: uppercase !important;
  letter-spacing: 0.8px !important;
  font-weight: 600 !important;
}

/* Modals — frosted glass */
body.mode-wanderlog .modal-backdrop {
  background: rgba(0, 0, 0, 0.25) !important;
  -webkit-backdrop-filter: blur(16px) saturate(180%) !important;
  backdrop-filter: blur(16px) saturate(180%) !important;
}
body.mode-wanderlog .modal {
  background: #FFFFFF !important;
  border-radius: 28px !important;
  padding: 36px !important;
  box-shadow: 0 24px 80px rgba(0,0,0,0.15) !important;
  border: 1px solid rgba(255,255,255,0.8) !important;
}
body.mode-wanderlog .modal h3 { margin-bottom: 18px !important; }
body.mode-wanderlog .confirm-modal-backdrop {
  background: rgba(0, 0, 0, 0.25) !important;
  -webkit-backdrop-filter: blur(16px) !important;
  backdrop-filter: blur(16px) !important;
}
body.mode-wanderlog .confirm-modal {
  background: #FFFFFF !important;
  border-radius: 28px !important;
  padding: 32px !important;
  box-shadow: 0 24px 80px rgba(0,0,0,0.15) !important;
  animation: slideUp 0.3s var(--ease-out) !important;
}
body.mode-wanderlog .confirm-modal-msg {
  font-size: 16px !important;
  color: #1a1a1a !important;
  margin-bottom: 24px !important;
  line-height: 1.6 !important;
}
body.mode-wanderlog .confirm-modal-input {
  padding: 14px 18px !important;
  border: 1.5px solid #e5e7eb !important;
  border-radius: 14px !important;
  font-size: 15px !important;
  background: #FFFFFF !important;
  color: #1a1a1a !important;
  margin-bottom: 20px !important;
}

/* Itinerary pills */
body.mode-wanderlog .itin-pill {
  padding: 8px 20px !important;
  border-radius: 24px !important;
  border: 1.5px solid #e5e7eb !important;
  background: #FFFFFF !important;
  font-size: 14px !important;
  font-weight: 500 !important;
  color: #6b7280 !important;
  font-family: 'Inter', sans-serif !important;
  box-shadow: none !important;
  transition: all 0.25s var(--ease-out) !important;
}
body.mode-wanderlog .itin-pill:hover {
  border-color: #1B3A6B !important;
  transform: translateY(-1px) !important;
}
body.mode-wanderlog .itin-pill.active {
  border-color: #1B3A6B !important;
  background: #1B3A6B !important;
  color: white !important;
  box-shadow: 0 2px 8px rgba(27,58,107,0.2) !important;
}

/* Timeline items */
body.mode-wanderlog .tl-item {
  padding: 12px 0 !important;
  border-bottom: 1px solid #f3f4f6 !important;
}
body.mode-wanderlog .tl-time {
  font-size: 13px !important;
  font-weight: 600 !important;
  color: #6b7280 !important;
  padding-top: 2px !important;
}
body.mode-wanderlog .tl-marker {
  border-radius: 3px !important;
}
body.mode-wanderlog .tl-name { font-weight: 600 !important; font-size: 15px !important; color: #1a1a1a !important; }
body.mode-wanderlog .tl-meta { font-size: 13px !important; color: #6b7280 !important; }
body.mode-wanderlog .tl-type {
  display: inline-block !important;
  font-size: 10px !important;
  padding: 2px 10px !important;
  border-radius: 12px !important;
  color: white !important;
  font-weight: 600 !important;
  margin-right: 6px !important;
}
body.mode-wanderlog .tl-park-hrs {
  padding: 10px 14px !important;
  border-radius: 12px !important;
  font-size: 13px !important;
  font-weight: 500 !important;
  margin-bottom: 4px !important;
}
body.mode-wanderlog .tl-gap {
  padding: 8px 14px !important;
  font-size: 13px !important;
  color: #6b7280 !important;
  font-style: italic !important;
  border-left: 2px dashed #e5e7eb !important;
  margin-left: 85px !important;
}

/* AI Chat */
body.mode-wanderlog .ai-chat {
  padding: 24px !important;
  background: #FAFAF7 !important;
  border-radius: 20px !important;
  margin-bottom: 16px !important;
  border: 1px solid rgba(0,0,0,0.06) !important;
}
body.mode-wanderlog .ai-msg {
  font-size: 15px !important;
  line-height: 1.7 !important;
}
body.mode-wanderlog .ai-msg.user {
  background: #1B3A6B !important;
  color: white !important;
  padding: 14px 20px !important;
  border-radius: 20px 20px 6px 20px !important;
  box-shadow: 0 2px 12px rgba(27,58,107,0.2) !important;
}
body.mode-wanderlog .ai-msg.asst {
  background: #FFFFFF !important;
  border: 1px solid rgba(0,0,0,0.06) !important;
  padding: 14px 20px !important;
  border-radius: 20px 20px 20px 6px !important;
  box-shadow: 0 1px 4px rgba(0,0,0,0.04) !important;
  color: #1a1a1a !important;
}
body.mode-wanderlog .ai-pbtn {
  padding: 6px 14px !important;
  border-radius: 20px !important;
  border: 1px solid #e5e7eb !important;
  background: #FFFFFF !important;
  font-size: 13px !important;
  cursor: pointer !important;
  color: #374151 !important;
}
body.mode-wanderlog .ai-pbtn:hover {
  background: #f3f4f6 !important;
  border-color: #1B3A6B !important;
}

/* Ride cards */
body.mode-wanderlog .ride-card {
  padding: 18px !important;
  border-radius: 18px !important;
  background: #FFFFFF !important;
  border-left-width: 5px !important;
  box-shadow: 0 2px 8px rgba(0,0,0,0.04) !important;
  transition: all 0.2s var(--ease-out) !important;
}
body.mode-wanderlog .ride-card:hover {
  box-shadow: 0 4px 16px rgba(0,0,0,0.08) !important;
  transform: translateY(-2px) !important;
}
body.mode-wanderlog .ride-ll {
  display: inline-block !important;
  font-size: 11px !important;
  padding: 2px 8px !important;
  border-radius: 6px !important;
  font-weight: 600 !important;
}
body.mode-wanderlog .ride-ll-none { background: #f3f4f6 !important; color: #6b7280 !important; }
body.mode-wanderlog .height-warn { color: #ef4444 !important; font-weight: 600 !important; font-size: 12px !important; }
body.mode-wanderlog .height-ok { color: #22c55e !important; font-size: 12px !important; }

/* Budget table */
body.mode-wanderlog .budget-table {
  font-size: 14px !important;
}
body.mode-wanderlog .budget-table th, body.mode-wanderlog .budget-table td {
  padding: 12px 14px !important;
  text-align: center !important;
  border-bottom: 1px solid #f3f4f6 !important;
}
body.mode-wanderlog .budget-table th {
  text-align: left !important;
  font-weight: 700 !important;
  font-size: 11px !important;
  text-transform: uppercase !important;
  color: #6b7280 !important;
  letter-spacing: 0.8px !important;
  font-family: 'Inter', sans-serif !important;
}
body.mode-wanderlog .budget-table tr:hover td {
  background: rgba(253,246,227,0.3) !important;
}
body.mode-wanderlog .budget-total {
  font-weight: 700 !important;
  background: #FFFBEB !important;
  font-family: 'DM Sans', sans-serif !important;
  font-size: 15px !important;
}

/* Packing */
body.mode-wanderlog .pack-cat h3 {
  margin-bottom: 10px !important;
  padding-bottom: 6px !important;
  border-bottom: 1px solid #e5e7eb !important;
}
body.mode-wanderlog .pack-item {
  font-size: 15px !important;
}

/* Park hours */
body.mode-wanderlog .park-hrs {
  font-size: 12px !important;
  padding: 6px 10px !important;
  background: #E8EEF6 !important;
  border-radius: 8px !important;
  margin-bottom: 8px !important;
}
body.mode-wanderlog .park-hrs .eeh-badge {
  background: #1B3A6B !important;
  color: white !important;
  font-size: 9px !important;
  padding: 1px 6px !important;
  border-radius: 8px !important;
  font-weight: 600 !important;
}

/* Perks */
body.mode-wanderlog .perk-item {
  font-size: 14px !important;
  padding: 6px 0 !important;
  color: #1a1a1a !important;
}
body.mode-wanderlog .perk-bullet {
  color: #1B3A6B !important;
  font-weight: 700 !important;
}

/* Session strip */
body.mode-wanderlog .session-strip {
  border-radius: 12px !important;
  height: 32px !important;
  background: rgba(243,244,246,0.6) !important;
  box-shadow: inset 0 1px 2px rgba(0,0,0,0.04) !important;
}
body.mode-wanderlog .session-block {
  font-size: 10px !important;
  font-weight: 700 !important;
  padding: 0 6px !important;
  letter-spacing: 0.3px !important;
  transition: opacity 0.2s !important;
}
body.mode-wanderlog .session-block:hover { opacity: 0.85 !important; }
body.mode-wanderlog .session-add-btn {
  border-radius: 8px !important;
  border: 1px dashed #d1d5db !important;
  background: white !important;
  font-size: 14px !important;
  color: #6b7280 !important;
}
body.mode-wanderlog .session-add-btn:hover {
  border-color: #1B3A6B !important;
  color: #1B3A6B !important;
}

/* Gantt (horizontal layout) */
body.mode-wanderlog .gantt-h-wrap {
  border-color: #e5e7eb !important;
}
body.mode-wanderlog .gantt-h-header {
  background: #FAFAF7 !important;
}
body.mode-wanderlog .gantt-h-corner {
  background: #FAFAF7 !important;
}
body.mode-wanderlog .gantt-h-cell {
  font-family: 'Inter', sans-serif !important;
  color: #6b7280 !important;
}
body.mode-wanderlog .gantt-h-day-label {
  background: #FAFAF7 !important;
  font-family: 'Inter', sans-serif !important;
  border-right-color: #e5e7eb !important;
}
body.mode-wanderlog .gantt-h-row {
  border-color: #e5e7eb !important;
}
body.mode-wanderlog .gantt-h-gridline { border-color: #e5e7eb !important; }
body.mode-wanderlog .gantt-block {
  border-radius: 6px !important;
  color: white !important;
  font-size: 10px !important;
  font-weight: 700 !important;
  padding: 4px 6px !important;
  box-shadow: 0 1px 3px rgba(0,0,0,0.12) !important;
  font-family: 'Inter', sans-serif !important;
}

/* Timeline countdown */
body.mode-wanderlog .tl-countdown {
  text-align: center !important;
  padding: 36px !important;
  margin-bottom: 24px !important;
  background: linear-gradient(135deg, #1a3a6b, #2a5298, #6b3fa0) !important;
  border-radius: 28px !important;
  color: white !important;
  box-shadow: 0 8px 32px rgba(27,58,107,0.25) !important;
}
body.mode-wanderlog .tl-countdown .tl-cd-number {
  font-family: 'DM Sans', sans-serif !important;
  font-size: 64px !important;
  font-weight: 700 !important;
  line-height: 1 !important;
}
body.mode-wanderlog .tl-countdown .tl-cd-label {
  font-size: 16px !important;
  opacity: 0.85 !important;
  margin-top: 8px !important;
}

/* Timeline milestones */
body.mode-wanderlog .tl-milestone {
  border-radius: 18px !important;
  border: 1px solid rgba(0,0,0,0.06) !important;
  box-shadow: 0 2px 8px rgba(0,0,0,0.04) !important;
  transition: all 0.25s var(--ease-out) !important;
}
body.mode-wanderlog .tl-milestone:hover {
  box-shadow: 0 4px 16px rgba(0,0,0,0.08) !important;
}
body.mode-wanderlog .tl-milestone.current {
  border-color: #1B3A6B !important;
  box-shadow: 0 4px 20px rgba(27,58,107,0.12) !important;
}
body.mode-wanderlog .tl-milestone.past { opacity: 0.7 !important; }
body.mode-wanderlog .tl-milestone-header {
  padding: 18px 22px !important;
}
body.mode-wanderlog .tl-milestone.current .tl-milestone-header { background: #E8EEF6 !important; }
body.mode-wanderlog .tl-milestone.past .tl-milestone-header { background: #f0faf0 !important; }
body.mode-wanderlog .tl-milestone.future .tl-milestone-header { background: #fafafa !important; }
body.mode-wanderlog .tl-milestone-title {
  font-weight: 700 !important;
  font-size: 16px !important;
  color: #1a1a1a !important;
}
body.mode-wanderlog .tl-milestone-date {
  font-size: 14px !important;
  color: #6b7280 !important;
}
body.mode-wanderlog .tl-milestone-badge {
  font-size: 12px !important;
  padding: 3px 12px !important;
  border-radius: 12px !important;
  font-weight: 600 !important;
}
body.mode-wanderlog .tl-milestone-badge.now { background: #1B3A6B !important; color: white !important; }
body.mode-wanderlog .tl-milestone-badge.done { background: #22c55e !important; color: white !important; }
body.mode-wanderlog .tl-milestone-badge.upcoming { background: #f3f4f6 !important; color: #6b7280 !important; }
body.mode-wanderlog .tl-milestone-body {
  padding: 0 22px 18px !important;
}
body.mode-wanderlog .tl-check-item {
  padding: 10px 0 !important;
  border-bottom: 1px solid #f3f4f6 !important;
  font-size: 15px !important;
  color: #1a1a1a !important;
}
body.mode-wanderlog .tl-check-item:last-child { border-bottom: none !important; }
body.mode-wanderlog .tl-check-item.auto-done { color: #22c55e !important; }
body.mode-wanderlog .tl-check-item .tl-check-auto { font-size: 12px !important; color: #22c55e !important; }
body.mode-wanderlog .tl-check-item .tl-check-hint { font-size: 13px !important; color: #6b7280 !important; }

body.mode-wanderlog .tl-summary-stat {
  padding: 14px !important;
  background: #FFFBEB !important;
  border-radius: 14px !important;
}
body.mode-wanderlog .tl-summary-stat .val { font-size: 22px !important; font-weight: 700 !important; color: #1B3A6B !important; }
body.mode-wanderlog .tl-summary-stat .lbl { font-size: 12px !important; color: #6b7280 !important; text-transform: uppercase !important; }

body.mode-wanderlog .tl-progress-line { background: #e5e7eb !important; }
body.mode-wanderlog .tl-progress-line.done { background: #22c55e !important; }
body.mode-wanderlog .tl-progress-line.active { background: linear-gradient(90deg, #22c55e, #1B3A6B) !important; }
body.mode-wanderlog .tl-progress-node {
  font-size: 12px !important;
  font-weight: 700 !important;
  border: 3px solid #e5e7eb !important;
  background: white !important;
  color: #6b7280 !important;
  transition: all 0.2s !important;
}
body.mode-wanderlog .tl-progress-node.done { border-color: #22c55e !important; background: #22c55e !important; color: white !important; }
body.mode-wanderlog .tl-progress-node.active { border-color: #1B3A6B !important; background: #1B3A6B !important; color: white !important; box-shadow: 0 0 0 4px rgba(27,58,107,0.2) !important; }

/* Version cards */
body.mode-wanderlog .version-card {
  padding: 16px 22px !important;
  background: #FFFFFF !important;
  border-radius: 16px !important;
  border: 1px solid rgba(0,0,0,0.06) !important;
  box-shadow: 0 1px 4px rgba(0,0,0,0.03) !important;
  transition: all 0.2s var(--ease-out) !important;
}
body.mode-wanderlog .version-card:hover {
  box-shadow: 0 4px 12px rgba(0,0,0,0.06) !important;
}
body.mode-wanderlog .version-card.active {
  border-color: #1B3A6B !important;
  background: #E8EEF6 !important;
  box-shadow: 0 2px 12px rgba(27,58,107,0.1) !important;
}

/* Optimizer panel */
body.mode-wanderlog .opt-panel {
  background: linear-gradient(135deg, #1B3A6B, #D4A843) !important;
  color: white !important;
  border-radius: 28px !important;
  padding: 32px !important;
  margin-bottom: 24px !important;
  box-shadow: 0 8px 32px rgba(27,58,107,0.2) !important;
}
body.mode-wanderlog .opt-panel h2 { color: white !important; }
body.mode-wanderlog .opt-result-card {
  background: rgba(255,255,255,0.15) !important;
  border-radius: 14px !important;
  padding: 14px !important;
}

/* Review section headers */
body.mode-wanderlog .review-section-header {
  font-family: 'DM Sans', sans-serif !important;
  font-size: 22px !important;
  font-weight: 700 !important;
  color: #1B3A6B !important;
  margin-bottom: 18px !important;
  padding-bottom: 10px !important;
  border-bottom: 2px solid #E8EEF6 !important;
  letter-spacing: -0.3px !important;
}

/* Conflict banner */
body.mode-wanderlog .conflict-banner {
  background: #fef2f2 !important;
  border: 1px solid #fecaca !important;
  border-radius: 16px !important;
  padding: 14px 18px !important;
  margin-bottom: 14px !important;
}
body.mode-wanderlog .conflict-item {
  padding: 8px 0 !important;
  font-size: 14px !important;
  border-bottom: 1px solid #fef2f2 !important;
}
body.mode-wanderlog .conflict-item:last-child { border-bottom: none !important; }
body.mode-wanderlog .conflict-icon { font-size: 16px !important; flex-shrink: 0 !important; }

/* FTUE */
body.mode-wanderlog .ftue-backdrop {
  background: rgba(0,0,0,0.3) !important;
  -webkit-backdrop-filter: blur(16px) !important;
  backdrop-filter: blur(16px) !important;
}
body.mode-wanderlog .ftue-card {
  background: #FFFFFF !important;
  border-radius: 32px !important;
  padding: 44px !important;
  max-width: 520px !important;
  box-shadow: 0 24px 80px rgba(0,0,0,0.2), 0 0 0 1px rgba(0,0,0,0.03) !important;
  animation: slideUp 0.3s var(--ease-out) !important;
  position: relative !important;
  overflow: hidden !important;
}
body.mode-wanderlog .ftue-card::before {
  content: '' !important;
  position: absolute !important;
  top: 0 !important; left: 0 !important; right: 0 !important;
  height: 4px !important;
  background: linear-gradient(90deg, #1a3a6b, #6b3fa0, #b8860b, #2d6b3f) !important;
}
body.mode-wanderlog .ftue-dot { width: 8px !important; height: 8px !important; border-radius: 50% !important; background: #d1d5db !important; }
body.mode-wanderlog .ftue-dot.active { background: #1B3A6B !important; width: 24px !important; border-radius: 4px !important; }
body.mode-wanderlog .ftue-dot.done { background: #22c55e !important; }
body.mode-wanderlog .ftue-icon { font-size: 52px !important; text-align: center !important; margin-bottom: 16px !important; }
body.mode-wanderlog .ftue-title {
  font-family: 'DM Sans', sans-serif !important;
  font-size: 28px !important;
  font-weight: 700 !important;
  text-align: center !important;
  margin-bottom: 10px !important;
  color: #1a1a1a !important;
}
body.mode-wanderlog .ftue-desc {
  font-size: 15px !important;
  color: #6b7280 !important;
  text-align: center !important;
  line-height: 1.7 !important;
  margin-bottom: 24px !important;
}
body.mode-wanderlog .ftue-desc strong { color: #1a1a1a !important; }
body.mode-wanderlog .ftue-tip {
  background: #E8EEF6 !important;
  border-radius: 14px !important;
  padding: 14px 18px !important;
  font-size: 14px !important;
  color: #1B3A6B !important;
  margin-bottom: 24px !important;
  border-left: 4px solid #1B3A6B !important;
}

/* Loading overlay */
body.mode-wanderlog .loading-overlay { background: #FAFAF7 !important; }
body.mode-wanderlog .loading-overlay p { font-size: 16px !important; color: #6b7280 !important; font-weight: 600 !important; margin-top: 16px !important; }
body.mode-wanderlog .loading-spinner { border: 4px solid #e5e7eb !important; border-top-color: #1B3A6B !important; }

/* Empty state */
body.mode-wanderlog .empty-state { padding: 56px 32px !important; color: #6b7280 !important; }
body.mode-wanderlog .empty-state-icon { font-size: 56px !important; margin-bottom: 16px !important; opacity: 0.5 !important; }
body.mode-wanderlog .empty-state-heading { font-family: 'DM Sans', sans-serif !important; font-size: 22px !important; font-weight: 700 !important; color: #1a1a1a !important; margin-bottom: 8px !important; }
body.mode-wanderlog .empty-state-desc { font-size: 15px !important; line-height: 1.7 !important; max-width: 340px !important; }

/* Auth */
body.mode-wanderlog .auth-name { font-size: 14px !important; font-weight: 600 !important; color: #1a1a1a !important; max-width: 120px !important; overflow: hidden !important; text-overflow: ellipsis !important; white-space: nowrap !important; }
body.mode-wanderlog .auth-avatar { border: 2px solid #D4A843 !important; }
body.mode-wanderlog .sync-badge { font-size: 11px !important; font-weight: 700 !important; padding: 3px 10px !important; border-radius: 12px !important; text-transform: uppercase !important; letter-spacing: 0.5px !important; }
body.mode-wanderlog .sync-badge.synced { background: #dcfce7 !important; color: #166534 !important; }
body.mode-wanderlog .sync-badge.syncing { background: #fef3c7 !important; color: #92400e !important; }
body.mode-wanderlog .sync-badge.offline { background: #fee2e2 !important; color: #991b1b !important; }
body.mode-wanderlog .sync-badge.guest { background: #f3f4f6 !important; color: #374151 !important; }
body.mode-wanderlog .sync-badge.shared { background: #dbeafe !important; color: #1e40af !important; }
body.mode-wanderlog .btn-signin {
  background: white !important;
  border: 1.5px solid #e5e7eb !important;
  border-radius: 14px !important;
  padding: 8px 18px !important;
  font-size: 14px !important;
  font-weight: 600 !important;
  color: #1a1a1a !important;
  cursor: pointer !important;
  display: flex !important;
  align-items: center !important;
  gap: 8px !important;
}
body.mode-wanderlog .btn-signin:hover { background: #f9fafb !important; border-color: #1B3A6B !important; }
body.mode-wanderlog .btn-signin svg { width: 18px !important; height: 18px !important; }
body.mode-wanderlog .btn-signout {
  background: none !important;
  border: none !important;
  font-size: 13px !important;
  color: #6b7280 !important;
  cursor: pointer !important;
  padding: 4px 8px !important;
  border-radius: 8px !important;
}
body.mode-wanderlog .btn-signout:hover { background: #f3f4f6 !important; color: #1a1a1a !important; }
body.mode-wanderlog .btn-share {
  background: #D4A843 !important;
  color: white !important;
  border: none !important;
  border-radius: 12px !important;
  padding: 6px 14px !important;
  font-size: 13px !important;
  font-weight: 600 !important;
}
body.mode-wanderlog .btn-share:hover { background: #B8912E !important; }
body.mode-wanderlog .share-code-display { font-size: 32px !important; font-weight: 700 !important; letter-spacing: 6px !important; color: #1B3A6B !important; font-family: monospace !important; }
body.mode-wanderlog .member-row { padding: 10px !important; border-radius: 12px !important; background: #f9fafb !important; }
body.mode-wanderlog .member-row img { border: 2px solid #D4A843 !important; }
body.mode-wanderlog .member-row .member-name { font-size: 14px !important; font-weight: 600 !important; color: #1a1a1a !important; }
body.mode-wanderlog .member-row .member-email { font-size: 12px !important; color: #6b7280 !important; }
body.mode-wanderlog .member-role { font-size: 11px !important; font-weight: 700 !important; text-transform: uppercase !important; color: #6b7280 !important; }
body.mode-wanderlog .member-role.owner { color: #D4A843 !important; }

/* Export FAB */
body.mode-wanderlog .export-fab {
  position: fixed !important;
  bottom: 28px !important;
  right: 28px !important;
  width: 56px !important;
  height: 56px !important;
  border-radius: 18px !important;
  background: linear-gradient(135deg, #1B3A6B, #D4A843) !important;
  color: white !important;
  border: none !important;
  font-size: 22px !important;
  cursor: pointer !important;
  box-shadow: 0 6px 24px rgba(27,58,107,0.3) !important;
  z-index: 100 !important;
}
body.mode-wanderlog .export-fab:hover { transform: scale(1.1) translateY(-2px) !important; box-shadow: 0 8px 32px rgba(27,58,107,0.35) !important; }

/* Calendar filter banner */
body.mode-wanderlog #calFilterBanner {
  background: #FFFBEB !important;
  border: 1px solid #fcd34d !important;
  border-radius: 14px !important;
  padding: 10px 18px !important;
  font-size: 14px !important;
  color: #92400e !important;
  margin-bottom: 14px !important;
}
body.mode-wanderlog #calFilterBanner .btn {
  padding: 6px 14px !important;
  font-size: 12px !important;
  background: #92400e !important;
  color: white !important;
  border-radius: 8px !important;
}
body.mode-wanderlog .cal-filter-active {
  border: 2px solid #D4A843 !important;
  background: #FFFBEB !important;
}
body.mode-wanderlog .filter-hidden-badge {
  font-size: 11px !important;
  color: #92400e !important;
  background: #FFFBEB !important;
  padding: 3px 10px !important;
  border-radius: 8px !important;
  margin-bottom: 6px !important;
}

/* Weather */
body.mode-wanderlog .day-weather {
  font-size: 12px !important;
  color: #6b7280 !important;
  padding: 8px 12px !important;
  margin-bottom: 8px !important;
  background: rgba(232,238,246,0.4) !important;
  border-radius: 10px !important;
  font-weight: 500 !important;
}
body.mode-wanderlog .day-weather.live { color: #1a1a1a !important; }
body.mode-wanderlog .weather-live-badge { font-size: 9px !important; font-weight: 700 !important; color: white !important; background: #22c55e !important; padding: 1px 6px !important; border-radius: 4px !important; }
body.mode-wanderlog .weather-hist-badge { font-size: 9px !important; color: #6b7280 !important; font-style: italic !important; }

/* Star ratings */
body.mode-wanderlog .star-rate span { font-size: 22px !important; color: #d1d5db !important; }
body.mode-wanderlog .star-rate span.lit { color: #f59e0b !important; }
body.mode-wanderlog .star-rate-sm span { font-size: 16px !important; }

/* Rain mode */
body.mode-wanderlog .rain-active { background: #E8EEF6 !important; border-color: #1B3A6B !important; }
body.mode-wanderlog .rain-badge { display: inline-block !important; font-size: 11px !important; padding: 3px 10px !important; border-radius: 12px !important; background: #1B3A6B !important; color: white !important; font-weight: 600 !important; }
body.mode-wanderlog .rain-indoor { background: #ecfdf5 !important; border-left: 3px solid #22c55e !important; padding: 6px 10px !important; border-radius: 0 8px 8px 0 !important; font-size: 12px !important; color: #065f46 !important; margin: 3px 0 !important; }

/* Walk time */
body.mode-wanderlog .walk-time { padding: 6px 0 6px 87px !important; font-size: 12px !important; color: #6b7280 !important; font-style: italic !important; }

/* Zone flow */
body.mode-wanderlog .zone-strip { border-radius: 6px !important; }
body.mode-wanderlog .zone-block { font-size: 9px !important; font-weight: 600 !important; padding: 0 4px !important; }
body.mode-wanderlog .zone-backtrack { background: #fef2f2 !important; border: 1px solid #fecaca !important; border-radius: 8px !important; padding: 6px 10px !important; font-size: 12px !important; color: #ef4444 !important; margin: 3px 0 3px 87px !important; }

/* LL Strategy */
body.mode-wanderlog .ll-strat-card { padding: 24px !important; border-radius: 20px !important; border: 1px solid rgba(0,0,0,0.06) !important; margin-bottom: 16px !important; background: #FFFFFF !important; box-shadow: 0 2px 8px rgba(0,0,0,0.04) !important; }
body.mode-wanderlog .ll-strat-card h4 { margin-bottom: 10px !important; }
body.mode-wanderlog .ll-strat-list { list-style: none !important; counter-reset: ll !important; }
body.mode-wanderlog .ll-strat-list li { counter-increment: ll !important; padding: 8px 0 !important; border-bottom: 1px solid #f3f4f6 !important; font-size: 14px !important; display: flex !important; align-items: center !important; gap: 10px !important; color: #1a1a1a !important; }
body.mode-wanderlog .ll-strat-list li::before { content: counter(ll) !important; display: flex !important; align-items: center !important; justify-content: center !important; width: 24px !important; height: 24px !important; border-radius: 50% !important; background: #1B3A6B !important; color: white !important; font-size: 12px !important; font-weight: 700 !important; flex-shrink: 0 !important; }

/* QS Guide */
body.mode-wanderlog .qs-card { padding: 14px !important; border-radius: 14px !important; background: #f9fafb !important; border-left: 4px solid !important; margin-bottom: 10px !important; }
body.mode-wanderlog .qs-pick { font-size: 11px !important; padding: 2px 10px !important; border-radius: 12px !important; background: #22c55e !important; color: white !important; font-weight: 600 !important; }

/* Character cards */
body.mode-wanderlog .char-card { padding: 14px !important; border-radius: 14px !important; background: #f9fafb !important; margin-bottom: 10px !important; }
body.mode-wanderlog .char-wish-btn { padding: 4px 12px !important; border-radius: 14px !important; border: 1px solid #e5e7eb !important; background: white !important; font-size: 12px !important; transition: all 0.2s !important; color: #374151 !important; }
body.mode-wanderlog .char-wish-btn.active { border-color: #f43f5e !important; background: #fff1f2 !important; color: #f43f5e !important; }

/* Festival overlay */
body.mode-wanderlog .fest-overlay { background: #ecfdf5 !important; border: 1px solid #86efac !important; border-radius: 14px !important; padding: 10px 14px !important; margin-bottom: 10px !important; font-size: 13px !important; color: #065f46 !important; }
body.mode-wanderlog .fest-booth { display: inline-block !important; padding: 3px 10px !important; border-radius: 12px !important; background: #FFFFFF !important; border: 1px solid #86efac !important; font-size: 12px !important; margin: 2px !important; color: #065f46 !important; }

/* Budget categories */
body.mode-wanderlog .budget-cat { padding: 12px 0 !important; border-bottom: 1px solid #e5e7eb !important; color: #1a1a1a !important; }
body.mode-wanderlog .budget-cat-bar { background: #f3f4f6 !important; border-radius: 4px !important; }

/* Wishlist */
body.mode-wanderlog .wish-item { padding: 10px 0 !important; border-bottom: 1px solid #f3f4f6 !important; font-size: 14px !important; color: #1a1a1a !important; }
body.mode-wanderlog .wish-vote-btn { border: 1px solid #e5e7eb !important; background: white !important; color: #6b7280 !important; transition: all 0.2s !important; }
body.mode-wanderlog .wish-vote-btn.voted { border-color: #22c55e !important; background: #ecfdf5 !important; color: #22c55e !important; }

/* Tasks */
body.mode-wanderlog .task-row { padding: 8px 0 !important; border-bottom: 1px solid #f3f4f6 !important; font-size: 14px !important; color: #1a1a1a !important; }
body.mode-wanderlog .task-due { font-size: 12px !important; padding: 3px 10px !important; border-radius: 12px !important; font-weight: 600 !important; }
body.mode-wanderlog .task-due.overdue { background: #fef2f2 !important; color: #ef4444 !important; }
body.mode-wanderlog .task-due.soon { background: #FFFBEB !important; color: #92400e !important; }
body.mode-wanderlog .task-due.ok { background: #ecfdf5 !important; color: #065f46 !important; }

body.mode-wanderlog .pending-invite-row { padding: 8px 10px !important; font-size: 14px !important; border-bottom: 1px solid #e5e7eb !important; }

/* Focus visible */
body.mode-wanderlog button:focus-visible,
body.mode-wanderlog .btn:focus-visible,
body.mode-wanderlog .tab:focus-visible,
body.mode-wanderlog a:focus-visible,
body.mode-wanderlog input:focus-visible,
body.mode-wanderlog select:focus-visible {
  outline: 2px solid #D4A843 !important;
  outline-offset: 2px !important;
}
body.mode-wanderlog .btn:active, body.mode-wanderlog .tab:active { transform: scale(0.97) !important; }
body.mode-wanderlog .btn:disabled { opacity: 0.5 !important; cursor: not-allowed !important; pointer-events: none !important; }

/* Section header decoration - accent bar left */
body.mode-wanderlog .review-section { color: #1a1a1a !important; }

/* Mode toggle */
body.mode-wanderlog .mode-toggle {
  background: none !important;
  border: 2px solid #e5e7eb !important;
  border-radius: 28px !important;
  padding: 6px 18px 6px 6px !important;
  transition: all 0.3s var(--ease-out) !important;
  font-family: inherit !important;
}
body.mode-wanderlog .mode-toggle:hover { border-color: #1B3A6B !important; box-shadow: 0 2px 8px rgba(27,58,107,0.1) !important; }
body.mode-wanderlog .mode-toggle-track { background: #e5e7eb !important; }
body.mode-wanderlog .mode-toggle-thumb { background: white !important; box-shadow: 0 1px 3px rgba(0,0,0,0.2) !important; }
body.mode-wanderlog .mode-toggle-label { font-size: 14px !important; font-weight: 600 !important; color: #1a1a1a !important; }

/* Autocomplete */
body.mode-wanderlog .autocomplete-list { background: white !important; border: 1px solid #e5e7eb !important; border-radius: 14px !important; box-shadow: 0 8px 32px rgba(0,0,0,0.12) !important; }
body.mode-wanderlog .ac-item { padding: 10px 14px !important; border-bottom: 1px solid #f3f4f6 !important; font-size: 14px !important; }
body.mode-wanderlog .ac-item:hover, body.mode-wanderlog .ac-item.highlighted { background: #f3f4f6 !important; }
body.mode-wanderlog .ac-item .ac-name { font-weight: 600 !important; color: #1a1a1a !important; }
body.mode-wanderlog .ac-item .ac-meta { font-size: 12px !important; color: #6b7280 !important; }

/* Skip to content */
body.mode-wanderlog .sr-only-focusable:focus { background: #1B3A6B !important; color: white !important; border-radius: 8px !important; font-size: 14px !important; font-weight: 600 !important; z-index: 10000 !important; box-shadow: 0 4px 12px rgba(0,0,0,0.3) !important; padding: 12px 20px !important; position: fixed !important; top: 8px !important; left: 8px !important; }

/* Export container (off-screen) */
body.mode-wanderlog #exportContainer { background: white !important; color: #1a1a1a !important; font-family: 'Inter', sans-serif !important; }

/* Wanderlog Mobile */
@media (max-width: 900px) {
  body.mode-wanderlog .tab-label { display: none !important; }
  body.mode-wanderlog .tab { padding: 10px 14px !important; }
  body.mode-wanderlog .tab-icon { margin-right: 0 !important; }
}
@media (max-width: 768px) {
  body.mode-wanderlog { padding: 14px !important; }
  body.mode-wanderlog .calendar-grid { grid-template-columns: 1fr !important; }
  body.mode-wanderlog .form-row { flex-direction: column !important; }
  body.mode-wanderlog h1 { font-size: 26px !important; }
  body.mode-wanderlog .tabs { gap: 0 !important; }
  body.mode-wanderlog .ride-grid { grid-template-columns: 1fr !important; }
  body.mode-wanderlog .card { padding: 24px !important; border-radius: 18px !important; }
  body.mode-wanderlog .header-row { padding: 18px 22px !important; border-radius: 20px !important; }
  body.mode-wanderlog .tabs-wrap { margin-left: -14px !important; margin-right: -14px !important; padding-left: 14px !important; padding-right: 14px !important; }
  body.mode-wanderlog .dash-pct { font-size: 36px !important; }
  body.mode-wanderlog .modal { width: 100% !important; max-width: 100% !important; min-height: 50vh !important; border-radius: 20px 20px 0 0 !important; padding: 28px !important; align-self: flex-end !important; }
  body.mode-wanderlog .tab-more-dropdown { position: fixed !important; bottom: 0 !important; left: 0 !important; right: 0 !important; top: auto !important; border-radius: 24px 24px 0 0 !important; padding: 14px !important; z-index: 150 !important; box-shadow: 0 -8px 32px rgba(0,0,0,0.12) !important; }
}
@media (max-width: 767px) {
  /* Segment control container */
  body.mode-wanderlog .overview-pills,
  body.mode-wanderlog .plan-pills,
  body.mode-wanderlog .reservations-pills,
  body.mode-wanderlog .attractions-pills,
  body.mode-wanderlog .setup-pills,
  body.mode-wanderlog .tools-pills {
    background: #F3F0EB !important;
    border: none !important;
    border-bottom: none !important;
  }

  /* Inactive segments */
  body.mode-wanderlog .overview-pill,
  body.mode-wanderlog .plan-pill,
  body.mode-wanderlog .reservations-pill,
  body.mode-wanderlog .attractions-pill,
  body.mode-wanderlog .setup-pill,
  body.mode-wanderlog .tools-pill {
    background: transparent !important;
    color: #6b7280 !important;
    border: none !important;
    box-shadow: none !important;
  }

  /* Active segments */
  body.mode-wanderlog .overview-pill.active,
  body.mode-wanderlog .plan-pill.active,
  body.mode-wanderlog .reservations-pill.active,
  body.mode-wanderlog .attractions-pill.active,
  body.mode-wanderlog .setup-pill.active,
  body.mode-wanderlog .tools-pill.active {
    background: #1B3A6B !important;
    color: #fff !important;
    border: none !important;
    box-shadow: 0 1px 3px rgba(27,58,107,0.3) !important;
  }

  /* Remove setup vertical layout — grid handles it now */
  body.mode-wanderlog .setup-pills {
    flex-direction: unset !important;
  }
  body.mode-wanderlog .setup-pill {
    text-align: center !important;
  }

  /* Touch-safe small buttons */
  body.mode-wanderlog .btn-small {
    min-height: 44px !important;
    padding: 10px 16px !important;
  }
}

@media (max-width: 480px) {
  body.mode-wanderlog { padding: 10px !important; }
  body.mode-wanderlog h1 { font-size: 22px !important; }
  body.mode-wanderlog h2 { font-size: 20px !important; }
  body.mode-wanderlog .card { padding: 20px !important; border-radius: 16px !important; }
  body.mode-wanderlog input[type="date"], body.mode-wanderlog input[type="text"], body.mode-wanderlog input[type="number"],
  body.mode-wanderlog input[type="time"], body.mode-wanderlog select, body.mode-wanderlog textarea { font-size: 16px !important; }
  body.mode-wanderlog .header-row { flex-direction: column !important; align-items: stretch !important; gap: 10px !important; padding: 16px 18px !important; }
  body.mode-wanderlog .castle-icon { width: 40px !important; height: 40px !important; }
  body.mode-wanderlog .dash-pct { font-size: 28px !important; }
  body.mode-wanderlog .tabs-wrap { margin-left: -10px !important; margin-right: -10px !important; padding-left: 10px !important; padding-right: 10px !important; }
}