/*
 * Authoritative PWA theme layer.
 * Values mirror BeanTheme.swift, BeanGlassBackground, HomeView,
 * SharedComponents, StopCard, and FloatingTabBar.
 */

:root {
  --rb-ios-main-blue: #285aa7;
  --rb-ios-main-blue-2: #2a499a;
  --rb-ios-sub-blue-1: #1e90ff;
  --rb-ios-sub-blue-2: #789ed3;
  --rb-ios-tan: #f4efe1;
  --rb-ios-black: #000;
  --rb-ios-selection: linear-gradient(180deg, #1e90ff 0%, #285aa7 100%);

  --rb-ios-glass-foundation: rgba(40, 90, 167, .274);
  --rb-ios-glass-material: rgba(94, 101, 114, .16);
  --rb-ios-glass-card-tint: rgba(42, 73, 154, .216);
  --rb-ios-glass-hero-tint: rgba(0, 0, 0, .072);
  --rb-ios-glass-accent: rgba(40, 90, 167, .259);
  --rb-ios-glass-sheen-high: rgba(255, 255, 255, .144);
  --rb-ios-glass-sheen-low: rgba(0, 0, 0, .047);
  --rb-ios-glass-border: rgba(255, 255, 255, .22);
  --rb-ios-glass-text: #fff;
  --rb-ios-glass-muted: rgba(255, 255, 255, .86);
  --rb-ios-section-label: #789ed3;

  --rb-ios-dock-tint: rgba(40, 90, 167, .288);
  --rb-ios-dock-material: rgba(94, 101, 114, .16);
  --rb-ios-dock-border: rgba(120, 158, 211, .331);
  --rb-ios-dock-unselected: rgba(255, 255, 255, .78);
}

html[data-rb-resolved-appearance="light"] {
  --rb-ios-glass-foundation: rgba(255, 255, 255, .26);
  --rb-ios-glass-material: rgba(255, 255, 255, .30);
  --rb-ios-glass-card-tint: rgba(42, 73, 154, .216);
  --rb-ios-glass-hero-tint: rgba(0, 0, 0, .072);
  --rb-ios-glass-accent: rgba(255, 255, 255, .11);
  --rb-ios-glass-sheen-high: rgba(255, 255, 255, .202);
  --rb-ios-glass-sheen-low: rgba(0, 0, 0, .013);
  --rb-ios-glass-border: rgba(0, 0, 0, .16);
  --rb-ios-glass-text: #101114;
  --rb-ios-glass-muted: rgba(16, 17, 20, .86);
  --rb-ios-section-label: #285aa7;

  --rb-ios-dock-tint: rgba(42, 73, 154, .288);
  --rb-ios-dock-material: rgba(79, 91, 117, .18);
  --rb-ios-dock-border: rgba(120, 158, 211, .331);
  --rb-ios-dock-unselected: rgba(255, 255, 255, .88);
}

html[data-rb-resolved-appearance="dark"] {
  --rb-ios-glass-foundation: rgba(0, 0, 0, .48);
  --rb-ios-glass-material: rgba(0, 0, 0, .26);
  --rb-ios-glass-card-tint: rgba(42, 73, 154, .216);
  --rb-ios-glass-hero-tint: rgba(0, 0, 0, .072);
  --rb-ios-glass-accent: rgba(30, 144, 255, .035);
  --rb-ios-glass-sheen-high: rgba(255, 255, 255, .144);
  --rb-ios-glass-sheen-low: rgba(0, 0, 0, .047);
  --rb-ios-glass-border: rgba(255, 255, 255, .22);
  --rb-ios-glass-text: #fff;
  --rb-ios-glass-muted: rgba(255, 255, 255, .84);
  --rb-ios-section-label: #789ed3;

  --rb-ios-dock-tint: rgba(0, 0, 0, .20);
  --rb-ios-dock-material: rgba(0, 0, 0, .18);
  --rb-ios-dock-border: rgba(120, 158, 211, .331);
  --rb-ios-dock-unselected: rgba(255, 255, 255, .82);
}

/* One compositor for every blue/material card. */
html body.rb-app :is(
  #appScreenHome .hero-card,
  #appScreenHome .summary-card,
  .rb-ios-stops-parity .rb-ios-stops-summary,
  .rb-ios-tabs-parity .rb-ios-tab-glass,
  #appScreenNearby.rb-ios-tabs-parity > .rb-app-screen-scroll > .rb-screen-header.rb-ios-tab-glass,
  #appScreenSaved.rb-ios-tabs-parity > .rb-app-screen-scroll > .rb-screen-header.rb-ios-tab-glass,
  #appScreenMore.rb-ios-tabs-parity > .rb-app-screen-scroll > .rb-screen-header.rb-ios-tab-glass,
  #appScreenMore.rb-ios-tabs-parity .rb-more-settings-section #heroInfoLocationTools.rb-ios-tab-glass
) {
  --rb-ios-component-tint: var(--rb-ios-glass-card-tint);
  background:
    linear-gradient(135deg, var(--rb-ios-glass-sheen-high) 0%, rgba(255, 255, 255, .025) 37%, transparent 63%, var(--rb-ios-glass-sheen-low) 100%),
    radial-gradient(circle at top left, var(--rb-ios-glass-accent) 0%, transparent 72%),
    linear-gradient(135deg, var(--rb-ios-component-tint) 0%, transparent 82%),
    linear-gradient(var(--rb-ios-glass-material), var(--rb-ios-glass-material)),
    var(--rb-ios-glass-foundation) !important;
  border-color: var(--rb-ios-glass-border) !important;
  color: var(--rb-ios-glass-text) !important;
  -webkit-backdrop-filter: blur(2px) saturate(1.04) !important;
  backdrop-filter: blur(2px) saturate(1.04) !important;
  box-shadow: 0 9px 22px rgba(0, 0, 0, .16) !important;
}

html body.rb-app #appScreenHome .hero-card {
  --rb-ios-component-tint: var(--rb-ios-glass-hero-tint);
  border: 1px solid rgba(244, 239, 225, .62) !important;
  box-shadow: 0 7px 32px rgba(0, 0, 0, .40) !important;
}

html body.rb-app :is(
  #appScreenHome .hero-card,
  #appScreenHome .summary-card,
  .rb-ios-stops-parity .rb-ios-stops-summary,
  .rb-ios-tabs-parity .rb-ios-tab-glass,
  #appScreenNearby.rb-ios-tabs-parity > .rb-app-screen-scroll > .rb-screen-header.rb-ios-tab-glass,
  #appScreenSaved.rb-ios-tabs-parity > .rb-app-screen-scroll > .rb-screen-header.rb-ios-tab-glass,
  #appScreenMore.rb-ios-tabs-parity > .rb-app-screen-scroll > .rb-screen-header.rb-ios-tab-glass,
  #appScreenMore.rb-ios-tabs-parity .rb-more-settings-section #heroInfoLocationTools.rb-ios-tab-glass
)::before,
html body.rb-app :is(
  #appScreenHome .hero-card,
  #appScreenHome .summary-card,
  .rb-ios-stops-parity .rb-ios-stops-summary,
  .rb-ios-tabs-parity .rb-ios-tab-glass,
  #appScreenNearby.rb-ios-tabs-parity > .rb-app-screen-scroll > .rb-screen-header.rb-ios-tab-glass,
  #appScreenSaved.rb-ios-tabs-parity > .rb-app-screen-scroll > .rb-screen-header.rb-ios-tab-glass,
  #appScreenMore.rb-ios-tabs-parity > .rb-app-screen-scroll > .rb-screen-header.rb-ios-tab-glass,
  #appScreenMore.rb-ios-tabs-parity .rb-more-settings-section #heroInfoLocationTools.rb-ios-tab-glass
)::after,
html body.rb-app #appScreenHome .inline-brand-logo::after {
  display: none !important;
  content: none !important;
}

/* Home hero actions match HomeView exactly. */
html body.rb-app #appScreenHome #heroMenuButton {
  background: rgba(255, 255, 255, .001) !important;
  border: 1px solid rgba(244, 239, 225, .72) !important;
  color: var(--rb-ios-glass-text) !important;
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
  box-shadow: none !important;
}

html body.rb-app #appScreenHome :is(#locateBtn, #allMapBtn) {
  background: #1e90ff !important;
  border: 0 !important;
  color: #000 !important;
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
  box-shadow: none !important;
}

html body.rb-app #appScreenHome .summary-card {
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  justify-content: center !important;
  min-height: 122px !important;
  padding: 11px 10px 43px !important;
  border: 1px solid rgba(255, 255, 255, .22) !important;
  border-radius: 18px !important;
  box-sizing: border-box !important;
  text-align: center !important;
}

html[data-rb-resolved-appearance="light"] body.rb-app #appScreenHome .summary-card {
  border-color: rgba(0, 0, 0, .16) !important;
}

html body.rb-app #appScreenHome .summary-card .mini-label {
  color: #789ed3 !important;
  font-size: 10px !important;
  line-height: 12px !important;
  font-weight: 600 !important;
  letter-spacing: normal !important;
}

html body.rb-app #appScreenHome .summary-card > :is(.mini-label, #dayTitle, #stopCount, .summary-date) {
  position: relative !important;
  right: auto !important;
  left: auto !important;
  width: 100% !important;
  max-width: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
  flex: 0 0 auto !important;
  align-self: center !important;
  text-align: center !important;
}

html body.rb-app #appScreenHome .summary-card > .mini-label {
  margin-bottom: 1px !important;
}

html body.rb-app #appScreenHome .summary-schedule > :is(.mini-label, #dayTitle, .summary-date) {
  transform: translateY(-3px) !important;
}

html body.rb-app #appScreenHome .summary-schedule > #dayTitle {
  margin-bottom: 1px !important;
}

html body.rb-app #appScreenHome .summary-stops > :is(.mini-label, #stopCount) {
  transform: none !important;
}

html body.rb-app #appScreenHome #dayTitle {
  color: var(--rb-ios-glass-text) !important;
  font-size: 29px !important;
  line-height: 31px !important;
  font-weight: 700 !important;
}

html body.rb-app #appScreenHome #stopCount {
  color: var(--rb-ios-glass-text) !important;
  font-size: 36px !important;
  line-height: 38px !important;
  font-weight: 700 !important;
}

html body.rb-app #appScreenHome .summary-date {
  color: rgba(255, 255, 255, .92) !important;
  font-size: 12px !important;
  line-height: 15px !important;
  font-weight: 600 !important;
}

html body.rb-app #appScreenHome .summary-card :is(.schedule-picker-hint, .rb-summary-action) {
  position: absolute !important;
  right: 10px !important;
  bottom: 8px !important;
  left: 10px !important;
  width: auto !important;
  max-width: none !important;
  min-width: 0 !important;
  min-height: 27px !important;
  height: 27px !important;
  margin: 0 !important;
  padding: 0 10px !important;
  align-self: stretch !important;
  justify-content: center !important;
  border: 0 !important;
  border-radius: 999px !important;
  background: var(--rb-ios-selection) !important;
  color: #000 !important;
  font-size: 11px !important;
  line-height: 13px !important;
  font-weight: 700 !important;
  box-shadow: none !important;
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
}

html body.rb-app #appScreenHome .summary-card :is(.schedule-picker-hint, .rb-summary-action) > span {
  color: #000 !important;
  font-size: 11px !important;
  font-weight: 700 !important;
}

html body.rb-app #appScreenHome .summary-card :is(.schedule-picker-hint, .rb-summary-action) .chevron {
  width: 15px !important;
  min-width: 15px !important;
  height: 15px !important;
  min-height: 15px !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 50% !important;
  background: #285aa7 !important;
  color: #fff !important;
  font-size: 7px !important;
  line-height: 15px !important;
  box-shadow: none !important;
}

/* FloatingTabBar and BeanNavigationGlass. */
html body.rb-app #appBottomNav.rb-bottom-nav {
  background:
    linear-gradient(135deg, rgba(255, 255, 255, .11) 0%, rgba(255, 255, 255, .02) 43%, transparent 70%),
    radial-gradient(circle at top left, var(--rb-ios-glass-accent) 0%, transparent 76%),
    linear-gradient(var(--rb-ios-dock-material), var(--rb-ios-dock-material)),
    var(--rb-ios-dock-tint) !important;
  border: 1px solid var(--rb-ios-dock-border) !important;
  color: var(--rb-ios-dock-unselected) !important;
  -webkit-backdrop-filter: blur(2px) saturate(1.04) !important;
  backdrop-filter: blur(2px) saturate(1.04) !important;
  box-shadow: 0 7px 36px rgba(0, 0, 0, .22) !important;
}

html body.rb-app #appBottomNav.rb-bottom-nav::before,
html body.rb-app #appBottomNav.rb-bottom-nav::after {
  display: none !important;
  content: none !important;
}

html body.rb-app #appBottomNav .rb-bottom-nav-selector {
  background: var(--rb-ios-selection) !important;
  border: 1px solid rgba(255, 255, 255, .84) !important;
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
  box-shadow: 0 3px 12px rgba(0, 0, 0, .28) !important;
}

html body.rb-app #appBottomNav .rb-bottom-nav-item {
  color: var(--rb-ios-dock-unselected) !important;
  text-shadow: none !important;
}

html body.rb-app #appBottomNav .rb-bottom-nav-item:is(.active, .selected, .is-active, .is-selected, [aria-current="page"], [aria-selected="true"]) {
  color: #000 !important;
}

/* Stops title, selector, and day summary. */
html body.rb-app .rb-ios-stops-parity .rb-ios-stops-header {
  overflow: hidden !important;
  border: 1px solid rgba(255, 235, 223, .74) !important;
  border-radius: 22px !important;
  color: #fff !important;
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
}

html body.rb-app .rb-ios-stops-parity .rb-ios-stops-helper {
  color: var(--rb-ios-glass-muted) !important;
  font-size: 12px !important;
  line-height: 15px !important;
  font-weight: 500 !important;
  text-align: left !important;
}

html body.rb-app .rb-ios-stops-parity .rb-ios-stops-refresh {
  min-height: 44px !important;
  padding: 5px 10px !important;
  border: 1px solid rgba(255, 235, 223, .46) !important;
  border-radius: 12px !important;
  background: rgba(255, 255, 255, .10) !important;
  color: #fff !important;
  font-size: 9px !important;
  font-weight: 900 !important;
  text-decoration: none !important;
}

html body.rb-app .rb-ios-stops-parity #rbScheduleDayStrip {
  gap: 8px !important;
  padding-block: 5px !important;
  scroll-padding-inline: 12px !important;
}

html body.rb-app .rb-ios-stops-parity #rbScheduleDayStrip .rb-day-chip {
  min-height: 48px !important;
  padding: 0 13px !important;
  border: 1px solid rgba(255, 255, 255, .16) !important;
  border-radius: 15px !important;
  background:
    linear-gradient(135deg, var(--rb-ios-glass-sheen-high), transparent 64%),
    linear-gradient(var(--rb-ios-glass-material), var(--rb-ios-glass-material)),
    rgba(42, 73, 154, .24) !important;
  color: var(--rb-ios-glass-text) !important;
  -webkit-backdrop-filter: blur(2px) saturate(1.04) !important;
  backdrop-filter: blur(2px) saturate(1.04) !important;
  box-shadow: none !important;
}

html body.rb-app .rb-ios-stops-parity #rbScheduleDayStrip .rb-day-chip:is(.active, .selected, .is-active, .is-selected, [aria-current="date"], [aria-selected="true"], [aria-pressed="true"]) {
  background: var(--rb-ios-selection) !important;
  border-color: rgba(255, 255, 255, .62) !important;
  color: #000 !important;
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
}

html body.rb-app .rb-ios-stops-parity .rb-ios-stops-summary {
  min-height: 68px !important;
  padding: 13px !important;
  border: 1px solid rgba(255, 255, 255, .22) !important;
  border-radius: 16px !important;
}

html body.rb-app .rb-ios-stops-parity .rb-ios-stops-summary-title {
  color: var(--rb-ios-glass-text) !important;
  font-size: 17px !important;
  line-height: 21px !important;
  font-weight: 900 !important;
}

html body.rb-app .rb-ios-stops-parity .rb-ios-stops-active-count {
  color: var(--rb-ios-glass-muted) !important;
  font-size: 12px !important;
}

html body.rb-app .rb-ios-stops-parity .rb-ios-stops-count-pill {
  padding: 6px 11px !important;
  border: 0 !important;
  border-radius: 999px !important;
  background: var(--rb-ios-selection) !important;
  color: #000 !important;
  font-size: 12px !important;
  font-weight: 900 !important;
  box-shadow: none !important;
}

/* StopCard is shared by Stops and Saved. */
html body.rb-app .rb-ios-stops-parity .stop-card:not(.empty-card) {
  padding: 16px !important;
  border: 1px solid rgba(30, 144, 255, .45) !important;
  border-radius: 19px !important;
  box-shadow: 0 4px 18px rgba(0, 0, 0, .28) !important;
}

html body.rb-app .rb-ios-stops-parity .stop-card .open-chip {
  padding: 5px 10px !important;
  border: 0 !important;
  border-radius: 999px !important;
  font-size: 11px !important;
  line-height: 14px !important;
  font-weight: 900 !important;
  box-shadow: none !important;
}

html body.rb-app .rb-ios-stops-parity #results .stop-card.scheduled-card:not(.cancelled-card) .open-chip.scheduled-chip,
html body.rb-app .rb-ios-stops-parity .results .stop-card.scheduled-card:not(.cancelled-card) .open-chip.scheduled-chip,
html body.rb-app .rb-ios-stops-parity .stop-card .open-chip.scheduled-chip {
  background: var(--rb-ios-selection) !important;
  color: #000 !important;
  border: 0 !important;
  box-shadow: none !important;
  text-shadow: none !important;
}

html body.rb-app .rb-ios-stops-parity .stop-card .open-chip:is(.upcoming-chip, .open-now-chip) {
  background: #a7f3b9 !important;
  color: #19713b !important;
}

html body.rb-app .rb-ios-stops-parity .stop-card .open-chip.cancelled-chip {
  background: #ffd6d6 !important;
  color: #b53a3a !important;
}

html body.rb-app .rb-ios-stops-parity .stop-card .distance-chip {
  min-height: 31px !important;
  padding: 0 10px !important;
  border: 1px solid rgba(255, 255, 255, .42) !important;
  border-radius: 999px !important;
  background: linear-gradient(135deg, #0c2339 0%, #485f72 100%) !important;
  color: #fff !important;
  font-size: 13px !important;
  font-weight: 900 !important;
  box-shadow: 0 2px 7px rgba(0, 0, 0, .16) !important;
}

html body.rb-app .rb-ios-stops-parity .stop-card .distance-chip:is(.rb-ios-distance-hidden, [hidden]) {
  display: none !important;
}

html body.rb-app .rb-ios-stops-parity .stop-card .stop-name {
  color: #000 !important;
  font-size: 22px !important;
  line-height: 25px !important;
  font-weight: 700 !important;
  letter-spacing: -.25px !important;
}

html body.rb-app .rb-ios-stops-parity .stop-card .stop-time {
  display: inline-flex !important;
  width: fit-content !important;
  max-width: 100% !important;
  min-height: 28px !important;
  margin-top: 8px !important;
  padding: 5px 11px !important;
  border: 1px solid rgba(140, 79, 18, .28) !important;
  border-radius: 999px !important;
  background: linear-gradient(135deg, #fff8e8 0%, #f6d396 100%) !important;
  color: #8c4f12 !important;
  font-size: 14px !important;
  font-weight: 600 !important;
  box-shadow: 0 2px 6px rgba(0, 0, 0, .10) !important;
}

html body.rb-app .rb-ios-stops-parity .stop-card .stop-time::before {
  width: 7px !important;
  height: 7px !important;
  margin-right: 7px !important;
  border-radius: 50% !important;
  background: #bd7a25 !important;
}

html body.rb-app .rb-ios-stops-parity .stop-card .stop-address {
  margin-top: 5px !important;
  color: #4c6074 !important;
  font-size: 13px !important;
  line-height: 16px !important;
  font-weight: 600 !important;
}

html body.rb-app .rb-ios-stops-parity .stop-card .stop-source {
  margin-top: 3px !important;
  color: rgba(76, 96, 116, .82) !important;
  font-size: 11px !important;
  font-weight: 600 !important;
}

html body.rb-app .rb-ios-stops-parity .stop-card .stop-actions {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) 48px minmax(0, 1fr) !important;
  gap: 8px !important;
  align-items: stretch !important;
  margin-top: 7px !important;
  padding-top: 7px !important;
  border-top: 1px solid rgba(0, 0, 0, .12) !important;
}

html body.rb-app .rb-ios-stops-parity .stop-card :is(.save-stop-btn, .route-main) {
  width: 100% !important;
  min-width: 0 !important;
  min-height: 48px !important;
  height: 48px !important;
  border-radius: 16px !important;
  color: #000 !important;
  font-size: 15px !important;
  font-weight: 900 !important;
  box-shadow: none !important;
}

html body.rb-app .rb-ios-stops-parity #results .stop-card .stop-actions :is(.save-stop-icon, .calendar-stop-icon),
html body.rb-app .rb-ios-stops-parity .results .stop-card .stop-actions :is(.save-stop-icon, .calendar-stop-icon) {
  width: 34px !important;
  min-width: 34px !important;
  height: 34px !important;
  display: inline-grid !important;
  place-items: center !important;
  color: #fff !important;
  background: #285aa7 !important;
  border: 1.5px solid #fff !important;
  border-radius: 50% !important;
  box-shadow: 0 0 0 2px #1e90ff !important;
}

html body.rb-app .rb-ios-stops-parity #results .stop-card .stop-actions :is(.save-stop-icon, .calendar-stop-icon) svg,
html body.rb-app .rb-ios-stops-parity .results .stop-card .stop-actions :is(.save-stop-icon, .calendar-stop-icon) svg {
  width: 20px !important;
  height: 20px !important;
  color: #fff !important;
  fill: none !important;
  stroke: currentColor !important;
  stroke-width: 2.2 !important;
  stroke-linecap: round !important;
  stroke-linejoin: round !important;
}

/* Keep action glyphs identical to the native white-on-blue medallions. */
html body.rb-app .stop-card .stop-actions .save-stop-btn .save-stop-icon,
html body.rb-app .stop-card .stop-actions .calendar-stop-btn .calendar-stop-icon {
  color: #fff !important;
  background: #285aa7 !important;
  border-color: #fff !important;
}

html body.rb-app .stop-card .stop-actions .save-stop-btn .save-stop-icon svg,
html body.rb-app .stop-card .stop-actions .calendar-stop-btn .calendar-stop-icon svg,
html body.rb-app .stop-card .stop-actions .save-stop-btn .save-stop-icon svg path,
html body.rb-app .stop-card .stop-actions .calendar-stop-btn .calendar-stop-icon svg path {
  color: #fff !important;
  fill: none !important;
  stroke: #fff !important;
  stroke-width: 2.2 !important;
  stroke-linecap: round !important;
  stroke-linejoin: round !important;
}

html body.rb-app .rb-ios-stops-parity #results .stop-card .stop-actions :is(.save-stop-copy strong, .route-text),
html body.rb-app .rb-ios-stops-parity .results .stop-card .stop-actions :is(.save-stop-copy strong, .route-text) {
  font-family: var(--rb-font-ui) !important;
  font-size: 15px !important;
  line-height: 18px !important;
  font-weight: 900 !important;
  letter-spacing: -.01em !important;
  white-space: nowrap !important;
  overflow: visible !important;
  overflow-wrap: normal !important;
  text-shadow: none !important;
}

html body.rb-app .rb-ios-stops-parity .stop-card .save-stop-btn,
html body.rb-app .rb-ios-stops-parity .stop-card .calendar-stop-btn {
  background: #d9eff8 !important;
}

html body.rb-app .rb-ios-stops-parity .stop-card .calendar-stop-btn {
  width: 48px !important;
  min-width: 48px !important;
  height: 48px !important;
  min-height: 48px !important;
  padding: 0 !important;
  border: 1px solid rgba(30, 144, 255, .45) !important;
  border-radius: 50% !important;
  box-shadow: none !important;
}

html body.rb-app .rb-ios-stops-parity .stop-card .route-main {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 6px !important;
  border: 0 !important;
  background: #1e90ff !important;
}

html body.rb-app .rb-ios-stops-parity .stop-card .route-main .route-icon,
html body.rb-app .rb-ios-stops-parity .stop-card .route-main::before {
  display: none !important;
  content: none !important;
}

html body.rb-app .rb-ios-stops-parity .stop-card .route-main::after {
  display: block !important;
  content: "" !important;
  width: 22px !important;
  height: 22px !important;
  flex: 0 0 22px !important;
  background: center / contain no-repeat url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M5 20v-4a8 8 0 0 1 8-8h6M15 4l4 4-4 4' fill='none' stroke='%23000000' stroke-width='2.8' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") !important;
}

/* Keep condensed-card cup artwork below the status and distance controls. */
html body.rb-app .stop-card.coffee-art-card:not(.cancelled-card):not(.rb-featured-stop-card) .card-topline {
  position: relative !important;
  z-index: 6 !important;
  isolation: isolate !important;
}

html body.rb-app .stop-card.coffee-art-card:not(.cancelled-card):not(.rb-featured-stop-card) .card-topline :is(.open-chip, .distance-chip) {
  position: relative !important;
  z-index: 7 !important;
}

html body.rb-app .stop-card.coffee-art-card:not(.cancelled-card):not(.rb-featured-stop-card) > .rb-stop-card-body {
  position: relative !important;
  z-index: 2 !important;
  min-height: calc(var(--rb-stop-route-cup-height) + clamp(28px, 7vw, 36px)) !important;
}

html body.rb-app .stop-card.coffee-art-card:not(.cancelled-card):not(.rb-featured-stop-card) .stop-actions {
  position: relative !important;
  z-index: 1 !important;
}

html body.rb-app .stop-card.coffee-art-card:not(.cancelled-card):not(.rb-featured-stop-card) .route-main > .rb-stop-route-cup {
  bottom: calc(100% + 10px) !important;
  z-index: 1 !important;
  pointer-events: none !important;
}

html body.rb-app .stop-card.coffee-art-card:not(.cancelled-card):not(.rb-featured-stop-card) .route-main > .rb-stop-route-cup img {
  top: 0 !important;
  bottom: auto !important;
  width: auto !important;
  max-width: none !important;
  height: calc(100% + var(--rb-stop-cup-bottom-crop)) !important;
  max-height: none !important;
  object-fit: contain !important;
  object-position: center top !important;
}

/* Nearby, Saved, and More title/content structure. */
html body.rb-app .rb-ios-tabs-parity {
  --rb-ios-tab-content-gap: 11px;
}

html body.rb-app .rb-ios-tabs-parity-more {
  --rb-ios-tab-content-gap: 13px;
}

html body.rb-app .rb-ios-tabs-parity .rb-app-screen-scroll {
  scroll-padding-top: 0 !important;
}

html body.rb-app .rb-ios-tabs-parity .rb-ios-tab-header {
  position: relative !important;
  inset: auto !important;
  z-index: 1 !important;
  margin: 0 !important;
  border: 1px solid rgba(30, 144, 255, .42) !important;
  border-radius: 22px !important;
  transform: none !important;
}

html body.rb-app .rb-ios-tabs-parity .rb-ios-tab-first-content {
  position: relative !important;
  z-index: 0 !important;
  margin-top: var(--rb-ios-tab-content-gap) !important;
  transform: none !important;
}

html body.rb-app .rb-ios-tabs-parity .rb-ios-tab-header :is(h1, h2, h3, p, small, strong, .title, .subtitle),
html body.rb-app .rb-ios-tabs-parity .rb-ios-tab-settings :is(h1, h2, h3, p, small, strong, label, button, [class*="title"], [class*="subtitle"]),
html body.rb-app .rb-ios-tabs-parity .rb-ios-saved-info :is(h1, h2, h3, p, small, strong, label, button, [class*="title"], [class*="subtitle"]) {
  color: inherit !important;
  text-shadow: none !important;
}

html body.rb-app .rb-ios-tabs-parity :is(.eyebrow, [class*="eyebrow"], [class*="kicker"], .section-label, [class*="section-label"], [class*="section-title"]) {
  color: var(--rb-ios-section-label) !important;
}

html body.rb-app .rb-ios-tabs-parity :is(.rb-ios-tab-settings, .rb-ios-saved-info) {
  border-radius: 18px !important;
}

html body.rb-app .rb-ios-tabs-parity .rb-ios-tab-settings :is(
  .settings-row,
  .setting-row,
  [class*="settings-row"],
  [class*="setting-row"]
) {
  background: transparent !important;
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
}

/* Wavy cards stay exclusively controlled by the app's card-shading setting. */
html body.rb-app :is(
  .rb-ios-tabs-parity .rb-ios-wavy-preserve,
  #appScreenNearby .rb-state-card,
  #appScreenNearby .rb-nearby-stop-row,
  #appScreenSaved .saved-stop-notification-controls,
  #appScreenSaved .saved-stop-notification-enrollment,
  #appScreenSaved .saved-stop-notification-settings,
  #appScreenSaved .rb-saved-summary,
  #appScreenSaved .saved-stops-empty,
  #appScreenSaved .saved-stops-list > *,
  #appScreenMore .rb-more-links-section .hero-info-link,
  #appScreenMore .rb-more-links-section .instagram-quick-tag-button,
  #appScreenMore .install-app-btn,
  #appScreenMore .rb-map-picker-slot
) {
  background-color: var(--rb-ios-tan) !important;
  background-image: var(--rb-app-wavy-surface) !important;
  background-position: center !important;
  background-size: cover !important;
  background-repeat: no-repeat !important;
  background-blend-mode: normal, normal !important;
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
}

/* Beat legacy ID-scoped More typography while retaining theme-aware contrast. */
html body.rb-app #appScreenMore.rb-ios-tabs-parity #heroInfoLocationTools.rb-ios-tab-settings :is(
  .rb-settings-link-row,
  .hero-animation-toggle,
  .hero-animation-toggle-copy,
  .rb-haptic-intensity-setting,
  h1,
  h2,
  h3,
  strong,
  label,
  button,
  [class*="title"]
) {
  color: var(--rb-ios-glass-text) !important;
}

html body.rb-app #appScreenMore.rb-ios-tabs-parity #heroInfoLocationTools.rb-ios-tab-settings :is(
  p,
  small,
  .rb-haptic-intensity-example,
  .rb-command-chevron,
  [class*="subtitle"]
) {
  color: var(--rb-ios-glass-muted) !important;
}

/* Nearby uses the real screen markup, not the optional rb-ios parity classes.
   Keep the title in normal flow and contain map-library z-indexes so the
   full-screen hit target always remains above Leaflet and Google Maps. */
html body.rb-app #appScreenNearby > .rb-app-screen-scroll > .rb-screen-header {
  position: relative !important;
  inset: auto !important;
  z-index: 2 !important;
  margin: max(12px, var(--rb-app-safe-top)) 0 0 !important;
  transform: none !important;
}

html body.rb-app #appScreenNearby > .rb-app-screen-scroll > .rb-nearby-map-card:not(.is-fullscreen) {
  position: relative !important;
  isolation: isolate;
  z-index: 1 !important;
  margin: 0 0 12px !important;
}

html body.rb-app #appScreenNearby > .rb-app-screen-scroll {
  grid-template-areas:
    "header header header header header header"
    "titlegap titlegap titlegap titlegap titlegap titlegap"
    "map map map map map map"
    "route route refresh refresh mode mode"
    "status status status status status status"
    "list list list list list list" !important;
}

html body.rb-app #appScreenNearby > .rb-app-screen-scroll:has(.rb-nearby-actions.is-location-missing) {
  grid-template-areas:
    "header header header header header header"
    "titlegap titlegap titlegap titlegap titlegap titlegap"
    "map map map map map map"
    "refresh refresh refresh mode mode mode"
    "status status status status status status"
    "list list list list list list" !important;
}

html body.rb-app #appScreenNearby > .rb-app-screen-scroll::before {
  display: block !important;
  grid-area: titlegap !important;
  width: 100% !important;
  height: 2px !important;
  content: "" !important;
  pointer-events: none !important;
}

html body.rb-app #appScreenNearby .rb-nearby-map-card .all-map-preview {
  position: relative !important;
  isolation: isolate;
  z-index: 1 !important;
}

html body.rb-app #appScreenNearby .rb-nearby-map-card .rb-nearby-map-expand-button {
  z-index: 560 !important;
  pointer-events: auto !important;
}

html body.rb-app .rb-ios-tabs-parity-nearby :is(.rb-ios-nearby-map, .leaflet-container) {
  border: 1px solid rgba(30, 144, 255, .45) !important;
  border-radius: 18px !important;
  box-shadow: 0 8px 18px rgba(0, 0, 0, .18) !important;
}

html body.rb-app .rb-ios-tabs-parity-nearby :is(.rb-ios-nearby-primary, .rb-ios-nearby-secondary) {
  min-height: 48px !important;
  border-radius: 13px !important;
  font-size: 11px !important;
  line-height: 14px !important;
  font-weight: 900 !important;
  box-shadow: none !important;
}

html body.rb-app .rb-ios-tabs-parity-nearby .rb-ios-nearby-primary {
  border: 0 !important;
  background: #1e90ff !important;
  color: #000 !important;
}

html body.rb-app .rb-ios-tabs-parity-nearby .rb-ios-nearby-secondary {
  border: 1px solid rgba(30, 144, 255, .55) !important;
  background:
    linear-gradient(135deg, var(--rb-ios-glass-sheen-high), transparent 64%),
    linear-gradient(var(--rb-ios-glass-material), var(--rb-ios-glass-material)),
    rgba(42, 73, 154, .72) !important;
  color: var(--rb-ios-glass-text) !important;
  -webkit-backdrop-filter: blur(2px) saturate(1.04) !important;
  backdrop-filter: blur(2px) saturate(1.04) !important;
}

html body.rb-app .rb-ios-tabs-parity-nearby .rb-nearby-stop-row {
  border: 1px solid rgba(30, 144, 255, .45) !important;
  border-radius: 17px !important;
  box-shadow: 0 4px 15px rgba(0, 0, 0, .18) !important;
}

html body.rb-app .rb-ios-tabs-parity-nearby .rb-nearby-stop-row :is(.save-stop-btn, [class*="save"]) {
  background: #d9eff8 !important;
  color: #000 !important;
}

html body.rb-app .rb-ios-tabs-parity-nearby .rb-nearby-stop-row :is(.route-main, [class*="route"]) {
  background: #1e90ff !important;
  color: #000 !important;
}

@media (max-width: 540px) {
  html body.rb-app #appScreenHome .summary-card {
    min-height: 122px !important;
    padding-bottom: 43px !important;
  }

  html body.rb-app .rb-ios-tabs-parity .rb-ios-tab-first-content {
    margin-top: var(--rb-ios-tab-content-gap) !important;
  }

  html body.rb-app .rb-ios-tabs-parity .rb-ios-tab-header {
    position: relative !important;
    top: auto !important;
  }
}

@media (prefers-reduced-transparency: reduce) {
  html body.rb-app :is(
    #appScreenHome .hero-card,
    #appScreenHome .summary-card,
    .rb-ios-stops-parity .rb-ios-stops-summary,
    .rb-ios-tabs-parity .rb-ios-tab-glass,
    #appScreenNearby.rb-ios-tabs-parity > .rb-app-screen-scroll > .rb-screen-header.rb-ios-tab-glass,
    #appScreenSaved.rb-ios-tabs-parity > .rb-app-screen-scroll > .rb-screen-header.rb-ios-tab-glass,
    #appScreenMore.rb-ios-tabs-parity > .rb-app-screen-scroll > .rb-screen-header.rb-ios-tab-glass,
    #appScreenMore.rb-ios-tabs-parity .rb-more-settings-section #heroInfoLocationTools.rb-ios-tab-glass
  ) {
    background: var(--rb-ios-main-blue-2) !important;
    -webkit-backdrop-filter: none !important;
    backdrop-filter: none !important;
  }

  html[data-rb-resolved-appearance="light"] body.rb-app :is(
    #appScreenHome .hero-card,
    #appScreenHome .summary-card,
    .rb-ios-stops-parity .rb-ios-stops-summary,
    .rb-ios-tabs-parity .rb-ios-tab-glass,
    #appScreenNearby.rb-ios-tabs-parity > .rb-app-screen-scroll > .rb-screen-header.rb-ios-tab-glass,
    #appScreenSaved.rb-ios-tabs-parity > .rb-app-screen-scroll > .rb-screen-header.rb-ios-tab-glass,
    #appScreenMore.rb-ios-tabs-parity > .rb-app-screen-scroll > .rb-screen-header.rb-ios-tab-glass,
    #appScreenMore.rb-ios-tabs-parity .rb-more-settings-section #heroInfoLocationTools.rb-ios-tab-glass
  ) {
    background: var(--rb-ios-tan) !important;
  }

  html[data-rb-resolved-appearance="dark"] body.rb-app :is(
    #appScreenHome .hero-card,
    #appScreenHome .summary-card,
    .rb-ios-stops-parity .rb-ios-stops-summary,
    .rb-ios-tabs-parity .rb-ios-tab-glass,
    #appScreenNearby.rb-ios-tabs-parity > .rb-app-screen-scroll > .rb-screen-header.rb-ios-tab-glass,
    #appScreenSaved.rb-ios-tabs-parity > .rb-app-screen-scroll > .rb-screen-header.rb-ios-tab-glass,
    #appScreenMore.rb-ios-tabs-parity > .rb-app-screen-scroll > .rb-screen-header.rb-ios-tab-glass,
    #appScreenMore.rb-ios-tabs-parity .rb-more-settings-section #heroInfoLocationTools.rb-ios-tab-glass
  ) {
    background: #000 !important;
  }
}

/* Keep Saved and More title cards on the same safe-zone landing line as Nearby. */
body.rb-app #appScreenSaved > .rb-app-screen-scroll > .rb-screen-header,
body.rb-app #appScreenMore > .rb-app-screen-scroll > .rb-screen-header {
  margin-top: 12px !important;
}