/* App polish overrides: keep the compiled logic intact, but reshape the UI. */
:root {
  --app-bg: #f7f9fb;
  --app-bg-2: #edf3f4;
  --ink: #14212b;
  --muted: #6b7480;
  --line: #dfe7ea;
  --surface: rgba(255, 255, 255, .9);
  --surface-solid: #fff;
  --lake: #0b6e8f;
  --lake-dark: #143f4f;
  --forest: #2f6b4f;
  --rose: #be3b52;
  --shadow: 0 1px 2px rgba(20, 33, 43, .08), 0 10px 30px rgba(20, 33, 43, .08);
}

html {
  background: var(--app-bg);
  color-scheme: light;
}

body {
  background: linear-gradient(180deg, #f9fbfc 0%, var(--app-bg) 44%, var(--app-bg-2) 100%);
  color: var(--ink);
  font-family: -apple-system, BlinkMacSystemFont, "SF Pro Text", "Hiragino Sans", "Hiragino Kaku Gothic ProN", "Yu Gothic", sans-serif;
}

body * {
  letter-spacing: 0 !important;
}

button,
a,
input {
  -webkit-tap-highlight-color: transparent;
}

button:focus-visible,
a:focus-visible,
input:focus-visible {
  outline: 2px solid rgba(11, 110, 143, .42) !important;
  outline-offset: 2px;
}

[class~="min-h-screen"][class~="bg-amber-50/60"] {
  background: transparent !important;
  color: var(--ink) !important;
}

[class~="max-w-7xl"] {
  max-width: 1180px !important;
}

header[class~="sticky"] {
  top: 0;
  padding-top: env(safe-area-inset-top);
  background: rgba(247, 249, 251, .86) !important;
  color: var(--ink) !important;
  border-bottom: 1px solid rgba(20, 33, 43, .08);
  box-shadow: none !important;
  backdrop-filter: blur(22px) saturate(1.35);
  -webkit-backdrop-filter: blur(22px) saturate(1.35);
}

header > div {
  padding-top: .7rem !important;
  padding-bottom: .6rem !important;
}

header h1 {
  color: var(--ink) !important;
  font-size: 1.05rem !important;
  font-weight: 760 !important;
  line-height: 1.2 !important;
}

header p {
  display: none;
}

header button {
  min-height: 34px;
  border: 1px solid rgba(20, 33, 43, .08) !important;
  border-radius: 8px !important;
  background: rgba(255, 255, 255, .78) !important;
  color: var(--lake-dark) !important;
  box-shadow: 0 1px 1px rgba(20, 33, 43, .04);
}

header button[class*="text-amber-800"] {
  background: var(--lake-dark) !important;
  color: #fff !important;
}

header [class~="bg-white/20"] {
  border: 1px solid rgba(47, 107, 79, .16);
  background: rgba(47, 107, 79, .12) !important;
  color: var(--forest) !important;
}

.travel-time-button {
  min-width: 58px;
  font-weight: 760;
}

.travel-time-button.is-loading {
  opacity: .72;
}

.travel-time-status {
  min-height: 28px;
  padding: .35rem .55rem;
  border: 1px solid rgba(47, 107, 79, .16);
  border-radius: 8px;
  background: rgba(47, 107, 79, .1);
  color: var(--forest);
  font-size: 11px;
  font-weight: 760;
  white-space: nowrap;
}

.plan-switcher {
  max-width: 1180px;
  margin: 12px auto 0;
  padding: 0 12px;
}

.plan-switcher__inner {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 4px;
  padding: 4px;
  border: 1px solid rgba(20, 33, 43, .08);
  border-radius: 8px;
  background: rgba(237, 243, 244, .92);
  box-shadow: 0 1px 1px rgba(20, 33, 43, .04);
}

.plan-switcher__button {
  display: grid;
  min-height: 48px;
  place-items: center;
  gap: 1px;
  border: 0;
  border-radius: 8px;
  background: transparent;
  color: #53616c;
  font: inherit;
  font-size: .78rem;
  font-weight: 760;
}

.plan-switcher__button strong {
  color: #7a8792;
  font-size: .72rem;
  font-weight: 650;
}

.plan-switcher__button.is-active {
  background: #fff;
  color: var(--ink);
  box-shadow: 0 1px 1px rgba(20, 33, 43, .05), 0 6px 16px rgba(20, 33, 43, .08);
}

.plan-switcher__button.is-active strong {
  color: var(--lake);
}

[class~="p-3"][class~="md:p-4"][class~="grid"] {
  gap: 12px !important;
}

[class~="bg-white"] {
  background: var(--surface) !important;
}

[class~="rounded-lg"],
[class~="rounded"] {
  border-radius: 8px !important;
}

[class~="shadow-sm"],
[class~="shadow-md"] {
  box-shadow: var(--shadow) !important;
}

[class~="border-amber-50"],
[class~="border-amber-100"],
[class~="border-amber-200"],
[class~="border-slate-100"],
[class~="border-slate-200"],
[class~="border-slate-300"] {
  border-color: var(--line) !important;
}

[class~="bg-amber-50"],
[class~="bg-amber-50/40"],
[class~="bg-amber-50/50"],
[class~="bg-amber-50/60"],
[class~="bg-amber-50/70"] {
  background: rgba(235, 244, 246, .76) !important;
}

[class~="bg-amber-100"] {
  background: #e8f2f4 !important;
}

[class~="bg-amber-600"],
[class~="bg-amber-700"] {
  background: var(--lake-dark) !important;
}

[class~="text-amber-700"],
[class~="text-amber-800"],
[class~="text-amber-900"] {
  color: var(--lake-dark) !important;
}

[class~="hover:bg-amber-50"]:hover,
[class~="hover:bg-amber-100"]:hover,
[class~="hover:bg-amber-200"]:hover {
  background: #deedf0 !important;
}

[class~="hover:border-amber-200"]:hover,
[class~="hover:border-amber-300"]:hover,
[class~="hover:border-amber-400"]:hover {
  border-color: rgba(11, 110, 143, .32) !important;
}

[class~="bg-gradient-to-b"][class~="from-amber-700"] {
  background: linear-gradient(180deg, var(--lake-dark), var(--forest)) !important;
}

[class~="from-slate-700"][class~="via-slate-600"][class~="to-amber-700"] {
  background: rgba(247, 249, 251, .86) !important;
}

section [class~="rounded-lg"][class~="p-3"][class~="mb-3"] {
  border-color: rgba(20, 33, 43, .08) !important;
  background: rgba(255, 255, 255, .72) !important;
  box-shadow: 0 1px 1px rgba(20, 33, 43, .04) !important;
}

section [class~="text-slate-500"][class~="font-medium"][class~="mr-1"] {
  min-width: 2.5rem;
  color: var(--muted) !important;
}

section button[class~="rounded-full"],
[class~="inline-flex"] button,
[class~="flex"][class~="border-b"] button {
  border-radius: 8px !important;
}

section button[class~="rounded-full"] {
  min-height: 32px;
  padding-inline: .72rem !important;
  border-color: transparent !important;
  background: #edf3f4 !important;
  color: #42505b !important;
}

section button[class~="rounded-full"][class*="bg-amber-700"] {
  background: var(--lake-dark) !important;
  color: #fff !important;
}

section [class~="rounded-lg"][class~="p-3"][class~="mb-3"] > div:first-child {
  display: grid !important;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 4px !important;
  padding: 4px;
  border-radius: 8px;
  background: #edf3f4;
}

section [class~="rounded-lg"][class~="p-3"][class~="mb-3"] > div:first-child > span,
section [class~="rounded-lg"][class~="p-3"][class~="mb-3"] > div:first-child > button:first-of-type {
  display: none !important;
}

section [class~="rounded-lg"][class~="p-3"][class~="mb-3"] > div:first-child > button {
  justify-content: center;
  width: 100%;
  min-height: 38px;
  font-weight: 760;
}

section [class~="rounded-lg"][class~="p-3"][class~="mb-3"] > div:nth-child(2) {
  flex-wrap: nowrap !important;
  gap: 6px !important;
  margin-top: 8px;
  overflow-x: auto;
  padding-bottom: 2px;
  scrollbar-width: none;
}

section [class~="rounded-lg"][class~="p-3"][class~="mb-3"] > div:nth-child(2)::-webkit-scrollbar {
  display: none;
}

section [class~="rounded-lg"][class~="p-3"][class~="mb-3"] > div:nth-child(2) > span {
  display: none;
}

section [class~="rounded-lg"][class~="p-3"][class~="mb-3"] > div:nth-child(2) > button {
  flex: 0 0 auto;
}

section [class~="grid"][class~="gap-2"] {
  gap: 10px !important;
}

section [class~="grid"][class~="gap-2"] > div {
  border-color: rgba(20, 33, 43, .08) !important;
  border-radius: 8px !important;
  background: var(--surface-solid) !important;
  box-shadow: 0 1px 2px rgba(20, 33, 43, .06) !important;
}

section [class~="grid"][class~="gap-2"] > div:hover {
  transform: translateY(-1px);
  border-color: rgba(11, 110, 143, .28) !important;
  box-shadow: var(--shadow) !important;
}

section [class~="grid"][class~="gap-2"] h3 {
  color: var(--ink) !important;
  font-size: .94rem !important;
  line-height: 1.35 !important;
}

section [class~="grid"][class~="gap-2"] p {
  display: -webkit-box;
  overflow: hidden;
  color: #5d6874 !important;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
}

section [class~="grid"][class~="gap-2"] > div > div:last-child button {
  min-height: 36px;
  border-radius: 8px !important;
  background: #eef5f6 !important;
  color: var(--lake-dark) !important;
  font-weight: 760 !important;
}

section [class~="grid"][class~="gap-2"] > div > div:last-child button:hover {
  background: #dcecef !important;
}

section [class~="grid"][class~="gap-2"] > div > div:last-child button[class~="is-selected-day"] {
  border-color: transparent !important;
  background: linear-gradient(180deg, var(--lake-dark), var(--forest)) !important;
  color: #fff !important;
  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .18), 0 6px 14px rgba(20, 63, 79, .18) !important;
}

aside > div:first-child {
  border-color: rgba(20, 33, 43, .09) !important;
  background: rgba(255, 255, 255, .86) !important;
}

aside > div:first-child > [class~="flex"][class~="border-b"] {
  gap: 4px;
  padding: 6px;
  border-bottom-color: rgba(20, 33, 43, .06) !important;
  background: #edf3f4;
}

aside > div:first-child > [class~="flex"][class~="border-b"] > button {
  min-height: 60px;
  border: 0 !important;
  border-radius: 8px !important;
  background: transparent !important;
  color: #53616c !important;
}

aside > div:first-child > [class~="flex"][class~="border-b"] > button[class*="bg-gradient-to-b"] {
  background: #fff !important;
  color: var(--ink) !important;
  box-shadow: 0 1px 1px rgba(20, 33, 43, .05), 0 6px 16px rgba(20, 33, 43, .08) !important;
}

aside [class~="p-3"] {
  padding: .85rem !important;
}

aside label {
  padding: .35rem .5rem;
  border: 1px solid rgba(20, 33, 43, .08);
  border-radius: 8px;
  background: #fff;
}

.schedule-item-card {
  position: relative;
  overflow: visible;
  border-left-width: 4px !important;
  background: rgba(255, 255, 255, .96) !important;
}

.schedule-item-card + .schedule-item-card {
  margin-top: 6px !important;
}

.schedule-transport-row {
  position: relative;
  justify-content: space-between;
  min-height: 34px;
  margin: .45rem 0 .45rem 4.15rem;
  padding: .38rem .42rem .38rem .55rem !important;
  border: 1px solid rgba(41, 117, 92, .18);
  border-radius: 999px;
  background: linear-gradient(90deg, #edf8f1 0%, #f7fbfc 100%);
  box-shadow: 0 4px 12px rgba(20, 63, 79, .08);
}

.schedule-transport-row::before {
  content: "";
  position: absolute;
  left: -15px;
  top: 50%;
  width: 10px;
  height: 2px;
  border-radius: 999px;
  background: rgba(41, 117, 92, .35);
}

.schedule-transport-label {
  color: #1c5b49 !important;
  font-size: 12px;
  font-weight: 820;
  line-height: 1;
  white-space: nowrap;
}

.schedule-transport-label svg {
  width: 14px;
  height: 14px;
  color: var(--forest);
  stroke-width: 2.5;
}

.schedule-transport-actions {
  display: inline-flex !important;
  flex: 0 0 auto;
  align-items: center;
  gap: 2px !important;
  margin-left: auto !important;
  padding: 2px;
  border: 1px solid rgba(20, 33, 43, .08);
  border-radius: 999px;
  background: rgba(255, 255, 255, .92);
  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .5);
}

.schedule-transport-actions button {
  min-height: 24px;
  padding: 0 .5rem !important;
  border-radius: 999px !important;
  font-size: 10px !important;
  font-weight: 820 !important;
}

.schedule-time-stack {
  display: inline-flex;
  flex: 0 0 64px;
  flex-direction: column;
  align-items: center;
  gap: 4px;
  cursor: grab;
}

.schedule-time-badge {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 52px;
  height: 30px;
  padding: 0 .35rem;
  border: 1px solid rgba(11, 110, 143, .14);
  border-radius: 8px;
  background:
    radial-gradient(circle at 8px 9px, rgba(11, 110, 143, .28) 1.2px, transparent 1.4px),
    radial-gradient(circle at 8px 15px, rgba(11, 110, 143, .28) 1.2px, transparent 1.4px),
    #eef7fa;
  color: var(--lake-dark) !important;
  cursor: grab;
  box-shadow: 0 1px 2px rgba(20, 33, 43, .08);
}

.schedule-end-badge {
  display: inline-flex;
  position: absolute;
  left: .55rem;
  bottom: .55rem;
  z-index: 1;
  align-items: center;
  justify-content: center;
  gap: 3px;
  min-width: 52px;
  min-height: 22px;
  padding: 0 .3rem;
  border-radius: 8px;
  background: rgba(20, 33, 43, .045);
  color: var(--muted);
  font-size: 9px;
  font-weight: 760;
  white-space: nowrap;
}

.schedule-end-badge strong {
  color: var(--lake-dark);
  font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace;
  font-size: 11px;
}

.schedule-card-actions {
  display: none !important;
}

.reservation-chip {
  padding: .125rem .45rem;
  border-radius: 8px;
  background: rgba(20, 63, 79, .92);
  color: #fff;
  font-weight: 760;
}

.reservation-warning-chip {
  padding: .125rem .45rem;
  border-radius: 8px;
  background: #fff1f3;
  color: var(--rose);
  font-weight: 760;
}

.schedule-card-controls {
  flex-wrap: wrap;
  gap: .35rem !important;
}

.schedule-duration-control {
  display: inline-flex;
  align-items: center;
  gap: .35rem;
  margin-left: clamp(20px, 5vw, 36px);
  white-space: nowrap;
}

.schedule-time-control {
  display: inline-flex;
  align-items: center;
  gap: .35rem;
  min-height: 30px;
  padding: .2rem .3rem .2rem .45rem !important;
  border: 1px solid rgba(11, 110, 143, .14) !important;
  border-radius: 8px;
  background: #f7fbfc !important;
}

.schedule-time-control span {
  color: var(--lake-dark);
  font-size: 10px;
  font-weight: 760;
}

.schedule-time-control input[type="time"] {
  width: 78px;
  min-height: 24px;
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
  font-size: 12px;
  font-weight: 700;
}

.schedule-auto-button {
  min-height: 28px;
  padding: 0 .5rem;
  border-radius: 8px;
  background: #eef5f6;
  color: var(--lake-dark);
  font-size: 10px;
  font-weight: 760;
}

.schedule-card-actions button {
  min-height: 24px;
}

input[type="time"],
input[type="number"] {
  min-height: 30px;
  border-color: rgba(20, 33, 43, .12) !important;
  border-radius: 8px !important;
  background: #fff !important;
  color: var(--ink) !important;
}

[class~="border-dashed"] {
  border-style: solid !important;
  background: #f4fafb !important;
  color: transparent !important;
}

[class~="border-dashed"]::before {
  content: "+";
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 34px;
  height: 34px;
  border-radius: 8px;
  background: #fff;
  color: var(--lake-dark);
  font-size: 24px;
  font-weight: 700;
  box-shadow: 0 1px 2px rgba(20, 33, 43, .08);
}

[class~="bg-sky-50"] {
  background: #eef7fa !important;
}

[class~="border-sky-200"] {
  border-color: #cfe5eb !important;
}

[class~="text-sky-600"],
[class~="text-sky-700"],
[class~="text-sky-800"] {
  color: var(--lake) !important;
}

[class~="bg-emerald-50"] {
  background: #edf7f0 !important;
}

[class~="bg-emerald-100"] {
  background: #e5f4ea !important;
}

[class~="bg-emerald-600"] {
  background: var(--forest) !important;
  color: #fff !important;
}

[class~="text-emerald-700"],
[class~="text-emerald-800"] {
  color: var(--forest) !important;
}

[class~="bg-rose-50"],
[class~="bg-red-50"] {
  background: #fff1f3 !important;
}

[class~="text-rose-500"],
[class~="text-rose-600"],
[class~="text-rose-700"],
[class~="text-red-700"] {
  color: var(--rose) !important;
}

[class~="mt-3"][class~="bg-sky-50"][class~="border-sky-200"],
footer {
  display: none !important;
}

[class~="bg-white"][class~="rounded-lg"][class~="border"][class~="overflow-hidden"][class~="mb-2"] > div:first-child > div:last-child,
[class~="flex"][class~="flex-wrap"][class~="items-center"][class~="gap-3"][class~="px-4"][class~="py-2"][class~="text-xs"][class~="border-b"],
[class~="p-3"][class~="overflow-x-auto"],
[class~="gap-x-4"][class~="border-t"][class~="border-amber-50"] {
  display: none !important;
}

[class~="bg-sky-50/40"] [class~="text-[10px]"][class~="text-slate-400"][class~="mt-1.5"] {
  display: none !important;
}

@media (max-width: 767px) {
  [class~="max-w-7xl"] {
    max-width: 440px !important;
  }

  .plan-switcher {
    max-width: 440px;
    margin-top: 8px;
    padding-inline: .75rem;
  }

  .plan-switcher__button {
    min-height: 44px;
    font-size: 12px;
  }

  header > div {
    display: grid !important;
    grid-template-columns: 1fr;
    gap: .55rem !important;
    padding-inline: .85rem !important;
  }

  header > div > div:last-child {
    display: grid !important;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    width: 100%;
    gap: 6px !important;
  }

  header h1 {
    font-size: 1rem !important;
  }

  header button {
    min-width: 38px;
    justify-content: center;
    padding-inline: .35rem !important;
    font-size: 11px !important;
    white-space: nowrap;
  }

  [class~="p-3"][class~="md:p-4"][class~="grid"] {
    padding: .75rem !important;
  }

  section [class~="grid"][class~="gap-2"] > div {
    padding: .85rem !important;
  }

  aside {
    margin-bottom: .75rem;
  }

  aside [class~="border-dashed"] {
    padding: .45rem !important;
  }

  aside [class~="border-dashed"]::before {
    width: 30px;
    height: 30px;
    font-size: 21px;
  }

  aside [class~="border"][class~="border-dashed"][class~="p-2"][class~="mt-1"] {
    display: none !important;
  }

  aside [class~="mt-2"][class~="text-xs"][class~="text-slate-500"][class~="border-t"] {
    display: none !important;
  }

  aside [class~="bg-white"][class~="border"][class~="rounded-lg"][class~="p-2"][class~="mb-1"] {
    padding: .6rem !important;
  }

  aside [class~="flex"][class~="items-center"][class~="gap-1.5"][class~="mt-1.5"] {
    margin-top: .35rem !important;
  }

  .schedule-item-card {
    padding: .65rem !important;
  }

  .schedule-transport-row {
    margin-left: 4.05rem;
    padding-right: .35rem !important;
  }

  .schedule-transport-label {
    font-size: 11.5px;
  }

  .schedule-transport-actions button {
    padding-inline: .42rem !important;
  }

  .schedule-time-badge {
    min-width: 48px;
    height: 28px;
    font-size: 11px !important;
  }

  .schedule-time-stack {
    flex-basis: 62px;
  }

  .schedule-end-badge {
    min-width: 48px;
    font-size: 8.5px;
  }

  .schedule-time-control {
    flex: 1 1 128px;
  }

  .schedule-duration-control {
    margin-left: 32px;
  }

  .schedule-card-actions {
    padding-top: .15rem;
  }
}
