:root {
  --tzbd-navy: #12233f;
  --tzbd-blue: #1769aa;
  --tzbd-gold: #f2b632;
  --tzbd-ink: #172033;
  --tzbd-muted: #687386;
  --tzbd-line: #dce3ed;
  --tzbd-bg: #f4f7fb;
  --tzbd-white: #fff;
  --tzbd-green: #1a9b62;
}

.tzbd-wrap,
.tzbd-wrap * { box-sizing: border-box; }

.tzbd-wrap [hidden] { display: none !important; }

.tzbd-wrap {
  width: 100%;
  color: var(--tzbd-ink);
  font-family: inherit;
  line-height: 1.55;
}

.tzbd-hero {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(260px, 360px);
  gap: 28px;
  align-items: center;
  padding: 34px;
  margin: 0 0 26px;
  border-radius: 18px;
  color: #fff;
  background:
    radial-gradient(circle at 83% 18%, rgba(242,182,50,.28), transparent 24%),
    linear-gradient(135deg, #10213b 0%, #173d69 58%, #1769aa 100%);
  box-shadow: 0 14px 34px rgba(18,35,63,.16);
}

.tzbd-eyebrow {
  display: inline-block;
  margin-bottom: 8px;
  color: var(--tzbd-gold);
  font-size: 12px;
  font-weight: 800;
  letter-spacing: .09em;
}

.tzbd-hero h2,
.tzbd-section-head h2,
.tzbd-placeholder h2 {
  margin: 0 0 10px;
  color: inherit;
  font-size: clamp(28px, 4vw, 44px);
  line-height: 1.12;
}

.tzbd-hero p,
.tzbd-section-head p,
.tzbd-placeholder p { margin: 0; }

.tzbd-hero__status {
  display: grid;
  grid-template-columns: auto 1fr;
  gap: 3px 10px;
  align-items: center;
  padding: 18px;
  border: 1px solid rgba(255,255,255,.18);
  border-radius: 14px;
  background: rgba(255,255,255,.1);
  backdrop-filter: blur(5px);
}

.tzbd-hero__status small { grid-column: 2; opacity: .8; }
.tzbd-status-dot { width: 11px; height: 11px; border-radius: 50%; background: #48d68b; box-shadow: 0 0 0 5px rgba(72,214,139,.14); }

.tzbd-grid {
  display: grid;
  grid-template-columns: repeat(6, minmax(0, 1fr));
  gap: 18px;
}
.tzbd-grid > .tzbd-card { grid-column: span 2; }
.tzbd-grid > .tzbd-card--wide-half { grid-column: span 3; }

.tzbd-card {
  position: relative;
  min-height: 218px;
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  overflow: hidden;
  padding: 22px;
  border-radius: 16px;
  color: #fff !important;
  text-decoration: none !important;
  box-shadow: 0 10px 24px rgba(18,35,63,.12);
  transition: transform .18s ease, box-shadow .18s ease;
  isolation: isolate;
}

.tzbd-card[href]:hover { transform: translateY(-4px); box-shadow: 0 16px 34px rgba(18,35,63,.2); }
.tzbd-card::after { content:""; position:absolute; inset:0; z-index:-1; background:linear-gradient(180deg, rgba(5,18,37,.08), rgba(5,18,37,.88)); }
.tzbd-card__pattern { position:absolute; inset:0; z-index:-2; opacity:.94; background-size:cover; }
.tzbd-card__icon { position:absolute; top:21px; left:22px; display:grid; place-items:center; width:48px; height:48px; border:1px solid rgba(255,255,255,.32); border-radius:14px; background:rgba(255,255,255,.14); backdrop-filter:blur(5px); }
.tzbd-card__icon svg { width:27px; height:27px; }
.tzbd-card__body { display:flex; flex-direction:column; gap:4px; }
.tzbd-card__body strong { font-size:22px; line-height:1.2; }
.tzbd-card__body small { font-size:14px; opacity:.86; }
.tzbd-card__badge { position:absolute; top:22px; right:20px; padding:5px 9px; border-radius:999px; background:rgba(5,18,37,.48); font-size:11px; font-weight:800; text-transform:uppercase; letter-spacing:.05em; }
.tzbd-card--locked { cursor:default; filter:saturate(.72); }
.tzbd-card--locked .tzbd-card__badge { background:rgba(255,255,255,.18); }

.tzbd-card--planner .tzbd-card__pattern { background: radial-gradient(circle at 80% 20%, #70d4ff 0 8%, transparent 9%), linear-gradient(135deg,#0a547e,#1599c7); }
.tzbd-card--map .tzbd-card__pattern { background: repeating-linear-gradient(45deg,rgba(255,255,255,.08) 0 2px,transparent 2px 22px), linear-gradient(135deg,#174c71,#4f7c89); }
.tzbd-card--tickets .tzbd-card__pattern { background: radial-gradient(circle at 75% 25%,#ffd365 0 12%,transparent 13%), linear-gradient(135deg,#7c4a08,#d78614); }
.tzbd-card--bts .tzbd-card__pattern { background: linear-gradient(120deg, transparent 42%,rgba(255,255,255,.18) 43% 47%,transparent 48%), linear-gradient(135deg,#247841,#65a82f); }
.tzbd-card--mrt .tzbd-card__pattern { background: radial-gradient(circle at 80% 20%,rgba(255,255,255,.16) 0 18%,transparent 19%),linear-gradient(135deg,#103c85,#2e68c5); }
.tzbd-card--airports .tzbd-card__pattern { background: linear-gradient(25deg,transparent 44%,rgba(255,255,255,.16) 45% 48%,transparent 49%),linear-gradient(135deg,#225b69,#2f9c9a); }
.tzbd-card--times .tzbd-card__pattern { background: radial-gradient(circle at 76% 27%,rgba(255,255,255,.2) 0 17%,transparent 18%),linear-gradient(135deg,#443071,#7657b4); }
.tzbd-card--places .tzbd-card__pattern { background: radial-gradient(circle at 75% 23%,#ed6d5e 0 8%,transparent 9%),linear-gradient(135deg,#943b3b,#d8684f); }
.tzbd-card--howto .tzbd-card__pattern { background: repeating-linear-gradient(-45deg,rgba(255,255,255,.07) 0 2px,transparent 2px 18px),linear-gradient(135deg,#36465a,#63758c); }
.tzbd-card--boats .tzbd-card__pattern { background: radial-gradient(circle at 80% 18%,rgba(255,255,255,.2) 0 12%,transparent 13%),linear-gradient(135deg,#075a76,#0e8c9a 55%,#27a7a0); }
.tzbd-card--buses .tzbd-card__pattern { background: repeating-linear-gradient(90deg,rgba(255,255,255,.08) 0 2px,transparent 2px 24px),linear-gradient(135deg,#9a3f0e,#d07320); }

.tzbd-note,
.tzbd-alert,
.tzbd-last-trains {
  margin-top: 22px;
  padding: 18px 20px;
  border-radius: 13px;
  border: 1px solid #ead8a9;
  background: #fff8e8;
}
.tzbd-note { display:flex; gap:8px 18px; flex-wrap:wrap; }
.tzbd-note strong { color:#6b4a00; }

.tzbd-section-head {
  display:flex;
  justify-content:space-between;
  gap:22px;
  align-items:flex-end;
  margin-bottom:22px;
  padding:28px;
  border-radius:17px;
  color:#fff;
  background:linear-gradient(135deg,#173c66,#1769aa);
}

.tzbd-back {
  display:inline-flex;
  align-items:center;
  justify-content:center;
  flex:0 0 auto;
  padding:10px 14px;
  border-radius:10px;
  color:#12233f !important;
  background:#f2b632;
  font-weight:800;
  text-decoration:none !important;
}

.tzbd-facts {
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:14px;
  margin-bottom:18px;
}
.tzbd-facts article { padding:19px; border:1px solid var(--tzbd-line); border-radius:14px; background:#fff; box-shadow:0 7px 18px rgba(18,35,63,.07); }
.tzbd-facts strong { display:block; min-height:29px; margin-bottom:5px; color:var(--tzbd-blue); font-size:26px; line-height:1.1; }
.tzbd-facts article.tzbd-fact--fare > strong {
  display:block !important;
  max-width:100%;
  min-height:29px;
  white-space:nowrap !important;
  word-break:normal !important;
  overflow-wrap:normal !important;
  hyphens:none !important;
  font-size:21px !important;
  line-height:1.1 !important;
  letter-spacing:-.03em;
  font-variant-numeric:tabular-nums;
}
.tzbd-facts article.tzbd-fact--time > strong {
  display:block !important;
  max-width:100%;
  white-space:nowrap !important;
  word-break:normal !important;
  overflow-wrap:normal !important;
  hyphens:none !important;
  font-size:21px !important;
  line-height:1.1 !important;
  position:relative;
  top:3px;
  letter-spacing:-.045em;
  font-variant-numeric:tabular-nums;
}
.tzbd-facts span { display:block; color:var(--tzbd-muted); font-size:13px; }

.tzbd-alert { margin:0 0 20px; border-color:#b9d5ed; background:#eef7ff; }

.tzbd-fare-calculator {
  margin: 22px 0;
  overflow: hidden;
  border: 1px solid #bdd5e9;
  border-radius: 17px;
  background: #fff;
  box-shadow: 0 10px 28px rgba(18,35,63,.09);
}
.tzbd-fare-calculator__head {
  display: grid;
  grid-template-columns: minmax(0,1fr) auto;
  gap: 22px;
  align-items: center;
  padding: 24px 26px;
  color: #fff;
  background: linear-gradient(135deg,#123e71,#1769aa);
}
.tzbd-fare-calculator__head h3 { margin:0 0 7px; color:inherit; font-size:clamp(23px,3vw,31px); line-height:1.18; }
.tzbd-fare-calculator__head p { margin:0; max-width:720px; opacity:.92; }
.tzbd-fare-calculator__badge { display:inline-flex; align-items:center; justify-content:center; min-height:38px; padding:8px 13px; border:1px solid rgba(255,255,255,.25); border-radius:999px; background:rgba(255,255,255,.12); font-size:12px; font-weight:900; white-space:nowrap; }
.tzbd-fare-calculator__form {
  display:grid;
  grid-template-columns:minmax(0,1fr) 48px minmax(0,1fr) auto;
  gap:12px;
  align-items:end;
  padding:22px 24px;
  background:#f5f8fc;
  border-bottom:1px solid var(--tzbd-line);
}
.tzbd-fare-calculator__form label { display:grid; gap:7px; margin:0; }
.tzbd-fare-calculator__form label > span { font-size:13px; font-weight:900; color:var(--tzbd-ink); }
.tzbd-fare-calculator__form select {
  width:100%;
  min-height:48px;
  margin:0;
  padding:9px 36px 9px 12px;
  border:1px solid #bdc9d7;
  border-radius:10px;
  background:#fff;
  color:var(--tzbd-ink);
  font:inherit;
  font-size:14px;
}
.tzbd-fare-calculator__swap,
.tzbd-fare-calculator__submit {
  appearance:none;
  min-height:48px;
  margin:0;
  border:0;
  border-radius:10px;
  cursor:pointer;
  font:inherit;
  font-weight:900;
}
.tzbd-fare-calculator__swap { width:48px; padding:0; color:var(--tzbd-blue); background:#e4eff9; font-size:22px; }
.tzbd-fare-calculator__swap:hover { background:#d5e7f7; }
.tzbd-fare-calculator__submit { padding:10px 18px; color:#10213b; background:var(--tzbd-gold); white-space:nowrap; }
.tzbd-fare-calculator__submit:hover { filter:brightness(.97); }
.tzbd-fare-result { padding:22px 24px; }
.tzbd-fare-result__empty { padding:17px 18px; border:1px dashed #bfd0df; border-radius:12px; color:var(--tzbd-muted); background:#fafcfe; text-align:center; }
.tzbd-fare-result__error { padding:15px 17px; border:1px solid #efc4c4; border-radius:11px; color:#8e2f2f; background:#fff1f1; font-weight:800; }
.tzbd-fare-result__content { display:grid; grid-template-columns:minmax(155px,.32fr) minmax(0,1fr); gap:22px; align-items:stretch; }
.tzbd-fare-result__price { display:flex; flex-direction:column; justify-content:center; min-height:155px; padding:20px; border-radius:14px; color:#fff; background:linear-gradient(145deg,#137f54,#1ba56a); text-align:center; }
.tzbd-fare-result__price strong { display:block; font-size:48px; line-height:1; font-variant-numeric:tabular-nums; }
.tzbd-fare-result__price span { display:block; margin-top:4px; font-size:18px; font-weight:900; }
.tzbd-fare-result__price small { display:block; margin-top:9px; opacity:.86; font-size:11px; line-height:1.35; }
.tzbd-fare-result__details { padding:18px 20px; border:1px solid var(--tzbd-line); border-radius:14px; background:#fff; }
.tzbd-fare-result__details h4 { margin:0 0 5px; color:var(--tzbd-ink); font-size:20px; }
.tzbd-fare-result__summary { margin:0 0 13px; color:var(--tzbd-muted); font-size:13px; }
.tzbd-fare-result__steps { margin:0; padding-left:20px; }
.tzbd-fare-result__steps li { margin:7px 0; }
.tzbd-fare-calculator__note { margin:0; padding:15px 24px 18px; border-top:1px solid #edf1f5; color:var(--tzbd-muted); background:#fff; font-size:12px; }


.tzbd-section-head--mrt {
  background:linear-gradient(135deg,#123f78 0%,#175d9d 52%,#65429a 100%);
}
.tzbd-fare-calculator--mrt { border-color:#c9d2ea; }
.tzbd-fare-calculator--mrt .tzbd-fare-calculator__head {
  background:linear-gradient(135deg,#123f78 0%,#175d9d 52%,#65429a 100%);
}
.tzbd-fare-result__price--mrt {
  background:linear-gradient(145deg,#155b9c,#65429a);
}
.tzbd-fare-result__breakdown {
  margin:0 0 13px;
  padding:9px 11px;
  border:1px solid #d6dff0;
  border-radius:9px;
  color:#354f75;
  background:#f4f7fc;
  font-size:12px;
  font-weight:800;
}

.tzbd-payment {
  margin:24px 0;
  overflow:hidden;
  border:1px solid #d3d9e8;
  border-radius:17px;
  background:#fff;
  box-shadow:0 10px 26px rgba(18,35,63,.08);
}
.tzbd-payment__head {
  padding:24px 26px;
  color:#fff;
  background:linear-gradient(135deg,#173d69,#4f3e87);
}
.tzbd-payment__head h3 { margin:0 0 7px; color:inherit; font-size:clamp(23px,3vw,31px); }
.tzbd-payment__head p { margin:0; max-width:820px; opacity:.92; }
.tzbd-payment__grid {
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:1px;
  background:#dfe4ee;
}
.tzbd-payment__grid article {
  display:grid;
  grid-template-columns:42px minmax(0,1fr);
  gap:13px;
  padding:21px;
  background:#fff;
}
.tzbd-payment__grid article > span {
  display:grid;
  place-items:center;
  width:38px;
  height:38px;
  border-radius:50%;
  color:#fff;
  background:linear-gradient(145deg,#1767ad,#65429a);
  font-size:17px;
  font-weight:900;
}
.tzbd-payment__grid h4 { margin:0 0 6px; color:var(--tzbd-ink); font-size:17px; }
.tzbd-payment__grid p { margin:0; color:var(--tzbd-muted); font-size:13px; }
.tzbd-payment__warning {
  padding:16px 20px;
  border-top:1px solid #ead8a9;
  color:#684b08;
  background:#fff8e8;
  font-size:13px;
}

.tzbd-ticket-grid { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:14px; margin:20px 0; }
.tzbd-ticket-grid article { padding:20px; border:1px solid var(--tzbd-line); border-radius:14px; background:#fff; }
.tzbd-ticket-grid h3 { margin:0 0 10px; font-size:17px; }
.tzbd-ticket-grid p { margin:8px 0 0; color:var(--tzbd-muted); font-size:13px; }
.tzbd-price { color:var(--tzbd-green); font-size:24px; font-weight:900; }


.tzbd-rabbit {
  margin:24px 0;
  overflow:hidden;
  border:1px solid var(--tzbd-line);
  border-radius:17px;
  background:#fff;
  box-shadow:0 10px 26px rgba(18,35,63,.08);
}
.tzbd-rabbit__head {
  display:grid;
  grid-template-columns:minmax(0,1.5fr) minmax(260px,.8fr);
  gap:22px;
  align-items:center;
  padding:26px;
  color:#fff;
  background:linear-gradient(135deg,#123e71,#1676aa);
}
.tzbd-rabbit__head h3 { margin:0 0 8px; font-size:clamp(24px,3vw,34px); }
.tzbd-rabbit__head p { margin:0; }
.tzbd-rabbit__recommendation { padding:16px 18px; border:1px solid rgba(255,255,255,.2); border-radius:13px; background:rgba(255,255,255,.11); }
.tzbd-rabbit__recommendation strong,
.tzbd-rabbit__recommendation span { display:block; }
.tzbd-rabbit__recommendation strong { margin-bottom:4px; color:#f7cf65; }
.tzbd-rabbit__recommendation span { font-size:13px; opacity:.9; }
.tzbd-rabbit__steps { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:1px; background:var(--tzbd-line); }
.tzbd-rabbit__steps article { display:grid; grid-template-columns:42px 1fr; gap:12px; padding:21px; background:#fff; }
.tzbd-rabbit__steps article > span { display:grid; place-items:center; width:38px; height:38px; border-radius:50%; color:#fff; background:var(--tzbd-blue); font-size:17px; font-weight:900; }
.tzbd-rabbit h4 { margin:0 0 6px; color:var(--tzbd-ink); font-size:17px; }
.tzbd-rabbit__steps p,
.tzbd-rabbit__grid p { margin:0; color:var(--tzbd-muted); font-size:13px; }
.tzbd-rabbit__grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:14px; padding:20px; background:#f7f9fc; }
.tzbd-rabbit__grid > article { padding:20px; border:1px solid var(--tzbd-line); border-radius:13px; background:#fff; }
.tzbd-check-list { margin:10px 0 0; padding:0; list-style:none; }
.tzbd-check-list li { position:relative; margin:7px 0; padding-left:21px; font-size:13px; }
.tzbd-check-list li::before { content:'✓'; position:absolute; left:0; top:0; color:var(--tzbd-green); font-weight:900; }
.tzbd-rabbit__note { margin-top:12px !important; padding:11px 12px; border-radius:9px; background:#eef6fd; }
.tzbd-definition-list { margin:10px 0 12px; }
.tzbd-definition-list > div { padding:10px 0; border-bottom:1px solid #edf1f5; }
.tzbd-definition-list dt { font-weight:900; }
.tzbd-definition-list dd { margin:2px 0 0; color:var(--tzbd-muted); font-size:13px; }
.tzbd-rabbit__buying-note { display:flex; gap:8px 16px; flex-wrap:wrap; padding:17px 20px; border-top:1px solid #ead8a9; background:#fff8e8; }
.tzbd-rabbit__buying-note strong { color:#6b4a00; }
.tzbd-rabbit__buying-note span { flex:1 1 560px; font-size:13px; }

.tzbd-tools { margin:24px 0 16px; padding:18px; border-radius:14px; background:var(--tzbd-bg); }
.tzbd-tools label { display:block; margin-bottom:7px; font-weight:800; }
.tzbd-tools input { width:100%; min-height:46px; padding:10px 13px; border:1px solid #c8d2df; border-radius:10px; background:#fff; font:inherit; }
.tzbd-tabs { display:flex; gap:8px; flex-wrap:wrap; margin-top:12px; }
.tzbd-tabs button { appearance:none; padding:8px 12px; border:1px solid #c8d2df; border-radius:999px; background:#fff; color:var(--tzbd-ink); cursor:pointer; font:inherit; font-size:13px; font-weight:800; }
.tzbd-tabs button.is-active { border-color:var(--tzbd-blue); color:#fff; background:var(--tzbd-blue); }

.tzbd-lines { display:grid; gap:18px; }
.tzbd-line { overflow:hidden; border:1px solid var(--tzbd-line); border-radius:15px; background:#fff; }
.tzbd-line[hidden] { display:none !important; }
.tzbd-line > header { display:grid; grid-template-columns:auto 1fr auto; gap:13px; align-items:center; padding:18px 20px; background:#f8fafc; border-bottom:1px solid var(--tzbd-line); }
.tzbd-line h3 { margin:0; font-size:21px; }
.tzbd-line header p { margin:2px 0 0; color:var(--tzbd-muted); font-size:13px; }
.tzbd-line header > strong { color:var(--tzbd-muted); font-size:13px; }
.tzbd-line__mark { width:15px; height:44px; border-radius:999px; background:#5ca630; }
.tzbd-line--silom .tzbd-line__mark { background:#157a57; }
.tzbd-line--gold .tzbd-line__mark { background:#d9a81d; }
.tzbd-line--blue .tzbd-line__mark { background:#1767ad; }
.tzbd-line--purple .tzbd-line__mark { background:#71459d; }

.tzbd-stations { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); }
.tzbd-station { display:grid; grid-template-columns:58px minmax(120px,.7fr) 1fr; gap:10px; align-items:center; min-height:57px; padding:10px 16px; border-bottom:1px solid #edf1f5; }
.tzbd-station:nth-child(odd) { border-right:1px solid #edf1f5; }
.tzbd-station[hidden] { display:none !important; }
.tzbd-station__code { display:inline-flex; justify-content:center; padding:5px 7px; border-radius:999px; color:#fff; background:#5ca630; font-size:12px; font-weight:900; }
.tzbd-line--silom .tzbd-station__code { background:#157a57; }
.tzbd-line--gold .tzbd-station__code { color:#4b3900; background:#f0c546; }
.tzbd-line--blue .tzbd-station__code { background:#1767ad; }
.tzbd-line--purple .tzbd-station__code { background:#71459d; }
.tzbd-station__name { font-weight:800; }
.tzbd-station__transfer {
  display:inline-flex;
  align-items:center;
  align-self:center;
  gap:8px;
  min-height:34px;
  padding:6px 10px;
  border:1px solid #cfe0ef;
  border-radius:11px;
  background:#eef6fd;
  color:#174d79;
  font-size:12px;
  font-weight:800;
  line-height:1.35;
}
.tzbd-station__transfer-text { display:block; }
.tzbd-station__transfer-badge {
  display:inline-flex;
  align-items:center;
  justify-content:center;
  flex:0 0 auto;
  min-width:38px;
  padding:4px 8px;
  border-radius:999px;
  color:#fff;
  font-size:10px;
  font-weight:900;
  line-height:1;
  letter-spacing:.03em;
  text-transform:uppercase;
}
.tzbd-station__transfer--mrt { background:#eef4ff; border-color:#ccd8f8; color:#184775; }
.tzbd-station__transfer-badge--mrt { background:#2563eb; }
.tzbd-station__transfer--airport { background:#ebfaf8; border-color:#bee7de; color:#145d66; }
.tzbd-station__transfer-badge--airport { background:#0f8c95; }
.tzbd-station__transfer--brt { background:#f3efff; border-color:#ddd2fb; color:#5b3d9a; }
.tzbd-station__transfer-badge--brt { background:#7a57d1; }
.tzbd-station__transfer--pier { background:#fff5ea; border-color:#f6dbb9; color:#8a5622; }
.tzbd-station__transfer-badge--pier { background:#d98a26; }
.tzbd-station__transfer--bus { background:#fff7ea; border-color:#f0debc; color:#80551a; }
.tzbd-station__transfer-badge--bus { background:#c88c1f; }
.tzbd-station__transfer--srt { background:#eef2f6; border-color:#d5dde7; color:#485a6d; }
.tzbd-station__transfer-badge--srt { background:#6a7f95; }
.tzbd-station__transfer--bts { background:#edf8ef; border-color:#cde6d2; color:#1c6032; }
.tzbd-station__transfer-badge--bts { background:#3e8d4d; }
.tzbd-station__transfer--place { background:#fef7e7; border-color:#eedca6; color:#7b5e10; }
.tzbd-station__transfer-badge--place { background:#cba12a; }
.tzbd-station__transfer--empty {
  background:#f5f7fa;
  border-color:#e4e9ef;
  color:#98a2b0;
  font-weight:700;
}

.tzbd-last-trains { border-color:#c9d8e7; background:#f4f8fc; }
.tzbd-last-trains h3 { margin:0 0 6px; }
.tzbd-last-trains p { margin:0; }

.tzbd-sources { margin-top:20px; padding:15px 18px; border:1px solid var(--tzbd-line); border-radius:12px; background:#fff; }
.tzbd-sources summary { cursor:pointer; font-weight:800; }
.tzbd-sources ul { margin:12px 0 0 18px; }
.tzbd-sources a { color:var(--tzbd-blue); }

/* The bus sources box is intentionally more prominent: it contains useful
   external links and must look clearly expandable, not like a plain footer. */
.tzbd-sources--bus { padding:0; overflow:hidden; border:2px solid #d96a13; background:#fff8ef; box-shadow:0 8px 22px rgba(180,74,10,.12); }
.tzbd-sources--bus summary { position:relative; padding:16px 58px 16px 20px; color:#fff; background:linear-gradient(135deg,#b94b0b 0%,#e17a19 100%); list-style:none; }
.tzbd-sources--bus summary::-webkit-details-marker { display:none; }
.tzbd-sources--bus summary::after { content:'+'; position:absolute; top:50%; right:18px; width:28px; height:28px; transform:translateY(-50%); display:grid; place-items:center; border:1px solid rgba(255,255,255,.65); border-radius:50%; font-size:22px; line-height:1; font-weight:700; }
.tzbd-sources--bus[open] summary::after { content:'−'; }
.tzbd-sources--bus ul { margin:16px 20px 18px 38px; }
.tzbd-sources--bus a { color:#b94b0b; font-weight:700; }
.tzbd-sources--bus a:hover { color:#7f2f05; text-decoration:underline; }

.tzbd-placeholder { padding:36px; border-radius:17px; color:#fff; background:linear-gradient(135deg,#173c66,#1769aa); }
.tzbd-placeholder .tzbd-back { margin-top:20px; }

@media (max-width: 980px) {
  .tzbd-frequency__grid { grid-template-columns:1fr; }
  .tzbd-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .tzbd-grid > .tzbd-card,
  .tzbd-grid > .tzbd-card--wide-half { grid-column:span 1; }
  .tzbd-facts,
  .tzbd-ticket-grid,
  .tzbd-rabbit__grid,
  .tzbd-rabbit__steps,
  .tzbd-payment__grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .tzbd-stations { grid-template-columns:1fr; }
  .tzbd-station:nth-child(odd) { border-right:0; }
}

@media (max-width: 680px) {
  .tzbd-frequency__head { grid-template-columns:1fr; padding:22px; }
  .tzbd-frequency__summary { justify-self:start; }
  .tzbd-hero { grid-template-columns:1fr; padding:24px; }
  .tzbd-grid,
  .tzbd-facts,
  .tzbd-ticket-grid,
  .tzbd-rabbit__grid,
  .tzbd-rabbit__steps,
  .tzbd-payment__grid { grid-template-columns:1fr; }
  .tzbd-rabbit__head { grid-template-columns:1fr; padding:22px; }
  .tzbd-fare-calculator__head { grid-template-columns:1fr; padding:22px; }
  .tzbd-fare-calculator__badge { justify-self:start; }
  .tzbd-fare-calculator__form { grid-template-columns:1fr; padding:18px; }
  .tzbd-fare-calculator__swap { width:100%; }
  .tzbd-fare-result__content { grid-template-columns:1fr; }
  .tzbd-fare-result__price { min-height:130px; }
  .tzbd-card { min-height:190px; }
  .tzbd-section-head { align-items:flex-start; flex-direction:column; padding:22px; }
  .tzbd-station { grid-template-columns:52px 1fr; }
  .tzbd-station__transfer { grid-column:2; }
  .tzbd-line > header { grid-template-columns:auto 1fr; }
  .tzbd-line header > strong { grid-column:2; }
}

/* v0.3.1 – service intervals for Yellow, Pink and Muang Thong Thani */
.tzbd-frequency {
  margin:22px 0 26px;
  overflow:hidden;
  border:1px solid #e4d69a;
  border-radius:17px;
  background:#fff;
  box-shadow:0 10px 26px rgba(18,35,63,.08);
}
.tzbd-frequency__head {
  display:grid;
  grid-template-columns:minmax(0,1fr) auto;
  gap:20px;
  align-items:center;
  padding:24px 26px;
  color:#fff;
  background:linear-gradient(135deg,#8f7200 0%,#cca000 42%,#c84782 100%);
}
.tzbd-frequency__head h3 { margin:0 0 7px; color:inherit; font-size:clamp(23px,3vw,31px); line-height:1.18; }
.tzbd-frequency__head p { margin:0; max-width:760px; opacity:.94; }
.tzbd-frequency__summary {
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-width:112px;
  min-height:44px;
  padding:9px 14px;
  border:1px solid rgba(255,255,255,.28);
  border-radius:999px;
  background:rgba(255,255,255,.13);
  font-size:15px;
  font-weight:900;
  white-space:nowrap;
}
.tzbd-frequency__grid {
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:14px;
  padding:18px;
  background:#f8fafc;
}
.tzbd-frequency__card {
  overflow:hidden;
  border:1px solid var(--tzbd-line);
  border-radius:14px;
  background:#fff;
}
.tzbd-frequency__card > header {
  display:grid;
  grid-template-columns:11px 1fr;
  gap:12px;
  align-items:start;
  height:112px;
  padding:16px 17px;
  border-bottom:1px solid #edf1f5;
  background:#fbfcfe;
}
.tzbd-frequency__card > header > div { min-width:0; }
.tzbd-frequency__card > header .tzbd-frequency__line-mark { margin-top:3px; }
.tzbd-frequency__line-mark { width:11px; height:42px; border-radius:999px; background:#d2aa00; }
.tzbd-frequency__card--pink .tzbd-frequency__line-mark { background:#d84f8d; }
.tzbd-frequency__card--branch .tzbd-frequency__line-mark { background:linear-gradient(#d84f8d 0 50%,#7b5bc7 50%); }
.tzbd-frequency__card h4 { margin:0; color:var(--tzbd-ink); font-size:18px; line-height:1.28; }
.tzbd-frequency__card header p { margin:4px 0 0; color:var(--tzbd-muted); font-size:12px; line-height:1.45; }
.tzbd-frequency__day { padding:15px 17px; }
.tzbd-frequency__day + .tzbd-frequency__day { border-top:1px solid #edf1f5; }
.tzbd-frequency__day > strong { display:block; margin-bottom:9px; font-size:13px; }
.tzbd-frequency__rows { display:grid; gap:6px; }
.tzbd-frequency__row {
  display:grid;
  grid-template-columns:minmax(0,1fr) auto auto;
  gap:7px;
  align-items:center;
  min-height:32px;
  padding:6px 8px;
  border-radius:8px;
  background:#f5f7fa;
  color:#465266;
  font-size:12px;
}
.tzbd-frequency__row b { color:var(--tzbd-ink); font-size:13px; white-space:nowrap; }
.tzbd-frequency__row em {
  padding:3px 6px;
  border-radius:999px;
  color:#fff;
  background:#c3487e;
  font-size:9px;
  font-style:normal;
  font-weight:900;
  text-transform:uppercase;
  letter-spacing:.04em;
}
.tzbd-frequency__row.is-peak { background:#fff2f7; color:#773454; }
.tzbd-frequency__card--yellow .tzbd-frequency__row.is-peak { background:#fff8d9; color:#695400; }
.tzbd-frequency__card--yellow .tzbd-frequency__row em { color:#4b3c00; background:#e5be19; }
.tzbd-frequency__note {
  padding:16px 20px;
  border-top:1px solid #ead8a9;
  background:#fff8e8;
  color:#5f4b18;
  font-size:13px;
}

/* v0.3.0 – Yellow, Pink and Muang Thong Thani branch */
.tzbd-monorail {
  margin-top: 34px;
  padding-top: 34px;
  border-top: 3px solid #edf1f6;
}
.tzbd-section-head--monorail {
  align-items:center;
  background:linear-gradient(135deg,#9c7a00 0%,#d2a600 42%,#d44e8b 100%);
}
.tzbd-alert--monorail { border-color:#e9d88d; background:#fffbea; }
.tzbd-fare-calculator--yellow { border-color:#e6d681; }
.tzbd-fare-calculator--yellow .tzbd-fare-calculator__head {
  background:linear-gradient(135deg,#7f6500,#d0a400);
}
.tzbd-fare-calculator--pink { border-color:#edc1d5; }
.tzbd-fare-calculator--pink .tzbd-fare-calculator__head {
  background:linear-gradient(135deg,#96365f,#d64f8d);
}
.tzbd-fare-result__price--yellow { color:#3f3200; background:linear-gradient(145deg,#f4cf32,#d7a900); }
.tzbd-fare-result__price--pink { background:linear-gradient(145deg,#b93670,#e45c9a); }
.tzbd-payment--monorail .tzbd-payment__head {
  background:linear-gradient(135deg,#8b7000,#c89d00 43%,#bd477c 100%);
}
.tzbd-payment--monorail .tzbd-payment__grid article > span {
  background:linear-gradient(145deg,#c99e00,#cf4d87);
}
.tzbd-tools--monorail { background:#fbf8f1; }
.tzbd-tools--monorail .tzbd-tabs button.is-active { border-color:#b98c00; background:#b98c00; }
.tzbd-line--yellow .tzbd-line__mark { background:#d1aa00; }
.tzbd-line--pink .tzbd-line__mark { background:#d84f8d; }
.tzbd-line--yellow .tzbd-station__code { color:#493a00; background:#f0c928; }
.tzbd-line--pink .tzbd-station__code { background:#d84f8d; }
.tzbd-station__transfer--branch { background:#fff0f7; border-color:#efc4d8; color:#8d315d; }
.tzbd-station__transfer-badge--branch { background:#c83f7d; }

@media (max-width: 680px) {
  .tzbd-monorail { margin-top:26px; padding-top:26px; }
}

/* v0.3.3 – align card titles and the first day section across all frequency cards */
@media (max-width: 680px) {
  .tzbd-frequency__card > header { height:auto; min-height:0; }
}


/* v0.4.0 – Airport Rail Link and SRT Red Line */
.tzbd-section-head--airports { align-items:center; background:linear-gradient(135deg,#006c7b 0%,#168c91 45%,#a82c3a 100%); }
.tzbd-airport-guides { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:16px; align-items:stretch; margin:22px 0 12px; }
.tzbd-airport-guide { display:flex; flex-direction:column; overflow:hidden; border:1px solid var(--tzbd-line); border-radius:16px; background:#fff; box-shadow:0 9px 24px rgba(18,35,63,.08); }
.tzbd-airport-guide__head { display:grid; grid-template-columns:58px 1fr; gap:14px; align-items:start; min-height:96px; padding:20px 22px; color:#fff; }
.tzbd-airport-guide--bkk .tzbd-airport-guide__head { background:linear-gradient(135deg,#087b88,#1da4a1); }
.tzbd-airport-guide--dmk .tzbd-airport-guide__head { background:linear-gradient(135deg,#7e1f2c,#bd3d49); }
.tzbd-airport-guide__head > span { display:grid; place-items:center; width:54px; height:54px; border:1px solid rgba(255,255,255,.3); border-radius:14px; background:rgba(255,255,255,.14); font-weight:900; }
.tzbd-airport-guide h3 { margin:0; color:inherit; font-size:22px; line-height:1.12; }
.tzbd-airport-guide__head p { margin:4px 0 0; opacity:.9; font-size:13px; }
.tzbd-airport-guide ol { flex:1 1 auto; margin:0; padding:20px 25px 12px 44px; }
.tzbd-airport-guide li { margin:8px 0; padding-left:3px; }
.tzbd-airport-guide__tip { margin-top:auto; padding:14px 20px; border-top:1px solid #e8edf3; background:#f7fafc; font-size:13px; }
.tzbd-airport-guides__note { margin:0 0 22px; padding:14px 18px; border:1px solid #d7e4ef; border-radius:12px; background:#f8fbfe; color:#405468; font-size:13px; }
.tzbd-airport-guides__note strong { color:#1e3550; }
.tzbd-frequency--airports { border-color:#c9d9df; }
.tzbd-frequency--airports .tzbd-frequency__head { background:linear-gradient(135deg,#006c7b,#168c91 48%,#a82c3a); }
.tzbd-frequency__card--arl .tzbd-frequency__line-mark { background:#15979a; }
.tzbd-frequency__card--red-dark .tzbd-frequency__line-mark { background:#a82735; }
.tzbd-frequency__card--red-light .tzbd-frequency__line-mark { background:#df6170; }
.tzbd-frequency__card--arl .tzbd-frequency__row.is-peak { background:#eaf8f8; color:#145b61; }
.tzbd-frequency__card--arl .tzbd-frequency__row em { background:#158d91; }
.tzbd-frequency__card--red-dark .tzbd-frequency__row.is-peak { background:#fff0f1; color:#7c2630; }
.tzbd-frequency__card--red-dark .tzbd-frequency__row em { background:#ac3541; }
.tzbd-fare-calculator--arl { border-color:#add8d9; }
.tzbd-fare-calculator--arl .tzbd-fare-calculator__head { background:linear-gradient(135deg,#006b78,#19a1a0); }
.tzbd-fare-result__price--arl { background:linear-gradient(145deg,#087b88,#19aaa6); }
.tzbd-fare-calculator--red { border-color:#e2bcc1; }
.tzbd-fare-calculator--red .tzbd-fare-calculator__head { background:linear-gradient(135deg,#751c29,#ba3b49); }
.tzbd-fare-result__price--red { background:linear-gradient(145deg,#7e1f2c,#c84551); }
.tzbd-payment--airports .tzbd-payment__head { background:linear-gradient(135deg,#006b78,#168f92 45%,#9e2937); }
.tzbd-payment--airports .tzbd-payment__grid article > span { background:linear-gradient(145deg,#148d92,#ae3340); }
.tzbd-tools--airports { background:#f2f8f8; }
.tzbd-tools--airports .tzbd-tabs button.is-active { border-color:#147f84; background:#147f84; }
.tzbd-line--arl .tzbd-line__mark { background:#15979a; }
.tzbd-line--arl .tzbd-station__code { background:#15979a; }
.tzbd-line--red-dark .tzbd-line__mark { background:#a82735; }
.tzbd-line--red-dark .tzbd-station__code { background:#a82735; }
.tzbd-line--red-light .tzbd-line__mark { background:#df6170; }
.tzbd-line--red-light .tzbd-station__code { background:#df6170; }
@media (max-width:980px){ .tzbd-airport-guides{grid-template-columns:1fr;} }
@media (max-width:680px){ .tzbd-airport-guide__head{grid-template-columns:48px 1fr;min-height:auto;padding:18px;} .tzbd-airport-guide__head>span{width:46px;height:46px;} .tzbd-airport-guides__note{margin-bottom:18px;} }

/* Tickets and fares overview */
.tzbd-section-head--tickets {
  background:linear-gradient(135deg,#6e4005 0%,#bb6f10 50%,#1769aa 100%);
}
.tzbd-alert--tickets { border-color:#ebd5a7; background:#fff8e8; }
.tzbd-content-head { margin-bottom:18px; }
.tzbd-content-head h3,
.tzbd-ticket-choice__head h3,
.tzbd-tourist-summary h3 { margin:0 0 7px; color:var(--tzbd-ink); font-size:clamp(23px,3vw,31px); line-height:1.18; }
.tzbd-content-head p,
.tzbd-ticket-choice__head p { margin:0; color:var(--tzbd-muted); }
.tzbd-ticket-choice,
.tzbd-compatibility,
.tzbd-ticket-detail,
.tzbd-tourist-summary {
  margin:24px 0;
  padding:24px;
  border:1px solid var(--tzbd-line);
  border-radius:17px;
  background:#fff;
  box-shadow:0 9px 25px rgba(18,35,63,.07);
}
.tzbd-ticket-choice { background:linear-gradient(180deg,#fffaf0,#fff); border-color:#ead9b9; }
.tzbd-ticket-choice__head { margin-bottom:18px; }
.tzbd-ticket-choice__grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:14px; }
.tzbd-ticket-choice__grid article {
  display:grid;
  grid-template-columns:42px minmax(0,1fr);
  gap:13px;
  padding:19px;
  border:1px solid #e3e8ef;
  border-radius:13px;
  background:#fff;
}
.tzbd-ticket-choice__grid article > span {
  display:grid;
  place-items:center;
  width:38px;
  height:38px;
  border-radius:50%;
  color:#fff;
  background:linear-gradient(145deg,#c47a17,#1769aa);
  font-size:16px;
  font-weight:900;
}
.tzbd-ticket-choice__grid h4,
.tzbd-system-cards h4,
.tzbd-rabbit-compare h4,
.tzbd-pass-grid h4,
.tzbd-discount-grid h4 { margin:0 0 6px; color:var(--tzbd-ink); font-size:17px; }
.tzbd-ticket-choice__grid p,
.tzbd-system-cards p,
.tzbd-rabbit-compare p,
.tzbd-pass-grid p,
.tzbd-discount-grid p { margin:0; color:var(--tzbd-muted); font-size:13px; }
.tzbd-table-scroll { overflow-x:auto; border:1px solid #dce3ed; border-radius:13px; }
.tzbd-ticket-table { width:100%; min-width:970px; border-collapse:separate; border-spacing:0; background:#fff; font-size:12px; }
.tzbd-ticket-table th,
.tzbd-ticket-table td { padding:12px 10px; border-right:1px solid #e6ebf1; border-bottom:1px solid #e6ebf1; text-align:center; vertical-align:middle; }
.tzbd-ticket-table thead th { color:#fff; background:#1b3558; font-size:11px; }
.tzbd-ticket-table tbody th { width:190px; color:#22324a; background:#f5f7fa; text-align:left; font-size:12px; }
.tzbd-ticket-table tr:last-child th,
.tzbd-ticket-table tr:last-child td { border-bottom:0; }
.tzbd-ticket-table th:last-child,
.tzbd-ticket-table td:last-child { border-right:0; }
.tzbd-ticket-table span { display:inline-flex; align-items:center; justify-content:center; min-height:26px; padding:4px 8px; border-radius:999px; font-weight:900; line-height:1.15; }
.tzbd-ticket-table .is-yes { color:#12613d; background:#e7f7ee; }
.tzbd-ticket-table .is-no { color:#8e3c3c; background:#fff0f0; }
.tzbd-ticket-table .is-own { color:#285780; background:#edf5fc; }
.tzbd-ticket-table .is-limited { color:#7a5b0c; background:#fff7dc; }
.tzbd-system-cards,
.tzbd-rabbit-compare,
.tzbd-pass-grid,
.tzbd-discount-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:14px; }
.tzbd-system-cards article,
.tzbd-rabbit-compare article,
.tzbd-pass-grid article,
.tzbd-discount-grid article { padding:20px; border:1px solid #dfe5ed; border-radius:13px; background:#fff; }
.tzbd-system-cards article > strong { display:inline-flex; margin-bottom:10px; padding:5px 9px; border-radius:999px; color:#fff; background:#1769aa; font-size:11px; letter-spacing:.04em; }
.tzbd-ticket-detail--single { background:#f7fafc; }
.tzbd-ticket-detail--rabbit { border-color:#cfe3d4; background:#f5fbf7; }
.tzbd-ticket-detail--emv { border-color:#cbdcf0; background:#f5f9fe; }
.tzbd-ticket-detail--passes { border-color:#ead9b0; background:#fffaf0; }
.tzbd-ticket-detail--discounts { background:#faf8fc; }
.tzbd-rabbit-compare__price { display:block; margin-bottom:9px; color:#198a58; font-size:22px; font-weight:900; line-height:1.15; }
.tzbd-ticket-note { margin-top:14px; padding:14px 16px; border:1px solid #d5e6d9; border-radius:11px; color:#355844; background:#fff; font-size:13px; }
.tzbd-pass-grid__tag { display:inline-flex; margin-bottom:9px; padding:5px 8px; border-radius:999px; color:#6b4d07; background:#ffedb6; font-size:10px; font-weight:900; letter-spacing:.04em; }
.tzbd-tourist-summary { color:#fff; background:linear-gradient(135deg,#153d69,#1769aa 55%,#b56b0c); border:0; }
.tzbd-tourist-summary h3 { color:#fff; }
.tzbd-tourist-summary ol { margin:15px 0 0; padding-left:23px; }
.tzbd-tourist-summary li { margin:10px 0; }
.tzbd-tourist-summary .tzbd-eyebrow { color:#ffd06a; }

@media (max-width:980px) {
  .tzbd-system-cards,
  .tzbd-rabbit-compare,
  .tzbd-pass-grid,
  .tzbd-discount-grid { grid-template-columns:1fr; }
}
@media (max-width:680px) {
  .tzbd-ticket-choice,
  .tzbd-compatibility,
  .tzbd-ticket-detail,
  .tzbd-tourist-summary { padding:19px; }
  .tzbd-ticket-choice__grid { grid-template-columns:1fr; }
}

/* First and last trains */
.tzbd-section-head--times {
  background:linear-gradient(135deg,#162d52 0%,#245a92 52%,#514487 100%);
}
.tzbd-alert--times { border-color:#c7d7e8; background:#f1f7fd; }
.tzbd-times-lookup {
  margin:24px 0;
  overflow:hidden;
  border:1px solid #cbd7e6;
  border-radius:17px;
  background:#fff;
  box-shadow:0 10px 28px rgba(18,35,63,.09);
}
.tzbd-times-lookup__head {
  display:grid;
  grid-template-columns:minmax(0,1fr) auto;
  gap:22px;
  align-items:center;
  padding:25px 27px;
  color:#fff;
  background:linear-gradient(135deg,#173d69,#1769aa 55%,#5b468f);
}
.tzbd-times-lookup__head h3 { margin:0 0 7px; color:inherit; font-size:clamp(24px,3vw,32px); line-height:1.16; }
.tzbd-times-lookup__head p { margin:0; max-width:780px; opacity:.92; }
.tzbd-times-lookup__badge { display:inline-flex; align-items:center; justify-content:center; min-height:38px; padding:8px 13px; border:1px solid rgba(255,255,255,.25); border-radius:999px; background:rgba(255,255,255,.12); font-size:12px; font-weight:900; white-space:nowrap; }
.tzbd-times-lookup__form { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:14px; padding:22px 24px; background:#f5f8fc; border-bottom:1px solid #e1e7ef; }
.tzbd-times-lookup__form label { display:grid; gap:7px; margin:0; }
.tzbd-times-lookup__form label > span { color:var(--tzbd-ink); font-size:13px; font-weight:900; }
.tzbd-times-lookup__form select { width:100%; min-height:48px; margin:0; padding:9px 36px 9px 12px; border:1px solid #bdc9d7; border-radius:10px; background:#fff; color:var(--tzbd-ink); font:inherit; font-size:14px; }
.tzbd-times-lookup__form select:disabled { color:#9aa4b1; background:#f1f3f6; cursor:not-allowed; }
.tzbd-times-result { padding:22px 24px 24px; }
.tzbd-times-result__empty,
.tzbd-times-result__error { padding:18px; border:1px dashed #bfd0df; border-radius:12px; color:var(--tzbd-muted); background:#fafcfe; text-align:center; }
.tzbd-times-result__error { border-style:solid; border-color:#efc4c4; color:#8e2f2f; background:#fff1f1; font-weight:800; }
.tzbd-times-result__title { display:flex; gap:13px; align-items:center; margin-bottom:15px; }
.tzbd-times-result__title > span { display:inline-flex; align-items:center; justify-content:center; min-width:58px; min-height:36px; padding:6px 10px; border-radius:999px; color:#fff; background:#1769aa; font-size:12px; font-weight:900; }
.tzbd-times-result__title h4 { margin:0; color:var(--tzbd-ink); font-size:21px; }
.tzbd-times-result__title p { margin:1px 0 0; color:var(--tzbd-muted); font-size:13px; }
.tzbd-times-result__grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:14px; }
.tzbd-times-direction { padding:19px; border:1px solid #dce4ed; border-radius:14px; background:#fff; }
.tzbd-times-direction h4 { margin:0 0 13px; color:#243b5a; font-size:16px; }
.tzbd-times-direction__times { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:10px; }
.tzbd-times-direction__times > div { padding:13px; border-radius:11px; background:#f3f7fb; }
.tzbd-times-direction__times span { display:block; color:var(--tzbd-muted); font-size:11px; font-weight:800; text-transform:uppercase; letter-spacing:.04em; }
.tzbd-times-direction__times strong { display:block; margin-top:3px; color:#15639c; font-size:27px; line-height:1; font-variant-numeric:tabular-nums; }
.tzbd-times-direction__times strong.is-after-midnight { color:#8b3b83; }
.tzbd-times-direction > small { display:block; margin-top:10px; color:#79506f; font-size:11px; }
.tzbd-times-direction.is-terminal { display:flex; flex-direction:column; justify-content:center; min-height:120px; color:#7d8794; background:#f6f8fa; }
.tzbd-times-direction.is-terminal p { margin:0; font-size:13px; }
.tzbd-times-result__note { margin:14px 0 0; padding:12px 14px; border-radius:10px; color:#4b6075; background:#eef5fb; font-size:12px; }
.tzbd-connection-watch,
.tzbd-times-other,
.tzbd-last-train-rules { margin:24px 0; padding:22px; border:1px solid #dce3ed; border-radius:17px; background:#fff; }
.tzbd-connection-watch { border-color:#d8cfe8; background:#faf8fd; }
.tzbd-connection-watch__grid { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:12px; margin-top:16px; }
.tzbd-connection-watch__grid article { padding:16px; border:1px solid #ddd5eb; border-radius:12px; background:#fff; }
.tzbd-connection-watch__grid strong { display:block; color:#62448e; font-size:24px; line-height:1; font-variant-numeric:tabular-nums; }
.tzbd-connection-watch__grid span { display:block; margin-top:7px; color:#5d6673; font-size:12px; }
.tzbd-connection-watch__note { margin:14px 0 0; padding:12px 14px; border-radius:10px; color:#654d7d; background:#f0ebf7; font-size:12px; }
.tzbd-times-other { background:#f7fafc; }
.tzbd-times-other__grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:14px; margin-top:17px; }
.tzbd-times-other__card { position:relative; overflow:hidden; padding:20px; border:1px solid #dce3ed; border-radius:14px; background:#fff; }
.tzbd-times-other__card::before { content:""; position:absolute; left:0; top:0; bottom:0; width:6px; background:#1769aa; }
.tzbd-times-other__card--bts::before { background:#50a536; }
.tzbd-times-other__card--yellow::before { background:#d5ac00; }
.tzbd-times-other__card--arl::before { background:#15979a; }
.tzbd-times-other__card--red::before { background:#aa303d; }
.tzbd-times-other__hours { display:inline-flex; margin-bottom:9px; padding:5px 9px; border-radius:999px; color:#1d4a70; background:#eaf3fb; font-size:11px; font-weight:900; }
.tzbd-times-other__card h4 { margin:0 0 7px; color:var(--tzbd-ink); font-size:18px; }
.tzbd-times-other__card p { margin:0 0 13px; color:var(--tzbd-muted); font-size:13px; }
.tzbd-times-other__card a { color:#1769aa; font-size:12px; font-weight:900; text-decoration:none; }
.tzbd-times-other__card a:hover { text-decoration:underline; }
.tzbd-last-train-rules { background:#fffaf0; border-color:#ead9b0; }

@media (max-width:980px) {
  .tzbd-connection-watch__grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
}
@media (max-width:680px) {
  .tzbd-times-lookup__head { grid-template-columns:1fr; padding:22px; }
  .tzbd-times-lookup__badge { justify-self:start; }
  .tzbd-times-lookup__form,
  .tzbd-times-result__grid,
  .tzbd-times-other__grid,
  .tzbd-connection-watch__grid { grid-template-columns:1fr; }
  .tzbd-times-lookup__form,
  .tzbd-times-result,
  .tzbd-connection-watch,
  .tzbd-times-other,
  .tzbd-last-train-rules { padding:18px; }
}

/* Tourist places */
.tzbd-section-head--places {
  background:linear-gradient(135deg,#0f4b66 0%,#176b83 45%,#8b4d7d 100%);
}
.tzbd-alert--places { border-color:#c8dce7; background:#f0f8fc; }
.tzbd-place-tools {
  margin:22px 0 18px;
  overflow:hidden;
  border:1px solid #d5e0ea;
  border-radius:17px;
  background:#fff;
  box-shadow:0 9px 24px rgba(18,35,63,.08);
}
.tzbd-place-tools__head {
  display:grid;
  grid-template-columns:minmax(0,1fr) auto;
  gap:20px;
  align-items:center;
  padding:22px 24px;
  color:#fff;
  background:linear-gradient(135deg,#104967,#176f86 52%,#714f86);
}
.tzbd-place-tools__head h3 { margin:0 0 6px; color:inherit; font-size:clamp(23px,3vw,31px); }
.tzbd-place-tools__head p { margin:0; opacity:.9; }
.tzbd-place-tools__count {
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-width:82px;
  min-height:42px;
  padding:8px 14px;
  border:1px solid rgba(255,255,255,.25);
  border-radius:999px;
  background:rgba(255,255,255,.12);
  font-size:13px;
  font-weight:900;
  white-space:nowrap;
}
.tzbd-place-tools__controls { padding:20px 22px; background:#f7f9fc; }
.tzbd-place-tools__controls label { display:grid; gap:7px; }
.tzbd-place-tools__controls label > span { font-size:13px; font-weight:900; }
.tzbd-place-tools__controls input {
  width:100%;
  min-height:48px;
  padding:10px 14px;
  border:1px solid #c3cfdd;
  border-radius:10px;
  background:#fff;
  color:var(--tzbd-ink);
  font:inherit;
}
.tzbd-place-tabs { display:flex; gap:8px; flex-wrap:wrap; margin-top:13px; }
.tzbd-place-tabs button {
  appearance:none;
  padding:8px 12px;
  border:1px solid #c8d2df;
  border-radius:999px;
  background:#fff;
  color:var(--tzbd-ink);
  cursor:pointer;
  font:inherit;
  font-size:13px;
  font-weight:800;
}
.tzbd-place-tabs button.is-active { border-color:#176b83; color:#fff; background:#176b83; }
.tzbd-place-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:16px; align-items:stretch; }
.tzbd-place-card {
  display:flex;
  flex-direction:column;
  min-width:0;
  height:100%;
  overflow:hidden;
  border:1px solid #dbe3ec;
  border-radius:16px;
  background:#fff;
  box-shadow:0 8px 22px rgba(18,35,63,.07);
}
.tzbd-place-card[hidden] { display:none !important; }
.tzbd-place-card__head {
  position:relative;
  display:grid;
  grid-template-columns:46px minmax(0,1fr);
  gap:12px;
  min-height:142px;
  align-items:start;
  align-content:start;
  padding:20px 20px 18px;
  color:#fff;
  background:linear-gradient(135deg,#174e6c,#267d8e);
}
.tzbd-place-card__head > div:first-of-type { min-height:72px; }
.tzbd-place-card--shopping .tzbd-place-card__head { background:linear-gradient(135deg,#7d4c0d,#c47b1e); }
.tzbd-place-card--culture .tzbd-place-card__head { background:linear-gradient(135deg,#4a3976,#7b5aa2); }
.tzbd-place-card--transport .tzbd-place-card__head { background:linear-gradient(135deg,#3d4e62,#6a7d8e); }
.tzbd-place-card__icon {
  display:grid;
  place-items:center;
  width:44px;
  height:44px;
  border:1px solid rgba(255,255,255,.28);
  border-radius:13px;
  background:rgba(255,255,255,.13);
}
.tzbd-place-card__icon svg { width:25px; height:25px; }
.tzbd-place-card__category { display:block; margin-bottom:4px; color:#f5d06d; font-size:10px; font-weight:900; letter-spacing:.07em; text-transform:uppercase; }
.tzbd-place-card h3 { margin:0; color:inherit; font-size:21px; line-height:1.18; }
.tzbd-place-card__mode {
  grid-column:1 / -1;
  justify-self:start;
  display:inline-flex;
  max-width:100%;
  padding:5px 9px;
  border:1px solid rgba(255,255,255,.23);
  border-radius:999px;
  background:rgba(5,18,37,.22);
  color:#fff;
  font-size:11px;
  font-weight:900;
  line-height:1.25;
}
.tzbd-place-card__journey {
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  border-bottom:1px solid #e7edf3;
  background:#f8fafc;
}
.tzbd-place-card__journey > div { min-width:0; padding:14px 15px; border-right:1px solid #e7edf3; }
.tzbd-place-card__journey > div:last-child { border-right:0; }
.tzbd-place-card__journey span { display:block; margin-bottom:3px; color:var(--tzbd-muted); font-size:10px; font-weight:800; text-transform:uppercase; letter-spacing:.03em; }
.tzbd-place-card__journey strong { display:block; color:var(--tzbd-ink); font-size:13px; line-height:1.35; }
.tzbd-place-card__route { flex:1 1 auto; min-height:118px; padding:18px 20px; }
.tzbd-place-card__route h4 { margin:0 0 6px; color:var(--tzbd-ink); font-size:15px; }
.tzbd-place-card__route p { margin:0; color:var(--tzbd-muted); font-size:13px; }
.tzbd-place-card__warning { padding:12px 18px; border-top:1px solid #f0d6a2; color:#72500b; background:#fff8e9; font-size:12px; }
.tzbd-place-card__footer {
  display:flex;
  justify-content:space-between;
  gap:10px 16px;
  align-items:center;
  padding:12px 18px;
  border-top:1px solid #e7edf3;
  background:#fbfcfe;
}
.tzbd-place-card__footer a { color:#1769aa; font-size:12px; font-weight:900; text-decoration:none; }
.tzbd-place-card__footer span { color:#8a94a3; font-size:10px; text-align:right; }
.tzbd-place-empty { margin:18px 0; padding:24px; border:1px dashed #bdcad8; border-radius:14px; color:var(--tzbd-muted); background:#fafcfe; text-align:center; }
.tzbd-search-empty { margin:18px 0; padding:18px 20px; border:1px dashed #bdcad8; border-radius:14px; color:var(--tzbd-muted); background:#fafcfe; text-align:center; }
.tzbd-search-empty[hidden] { display:none !important; }

/* The Jannah breadcrumb is global theme chrome; keep plugin pages focused on the transport guide. */
body.tzbd-page #breadcrumb,
body.tzbd-page .breadcrumb,
body.tzbd-page .breadcrumbs { display:none !important; }

/* Remove unrelated Jannah widgets from transport pages; the relevant weather widget remains. */
body.tzbd-page .sidebar .social-statistics-widget,
body.tzbd-page .sidebar .widget.tabs-widget,
body.tzbd-page .sidebar .tabs-widget,
body.tzbd-page .widget.tabs-widget,
body.tzbd-page .tabs-widget,
body.tzbd-page .sidebar .tabs-container-wrapper,
body.tzbd-page .sidebar .stream-item-widget,
body.tzbd-page .sidebar .posts-list,
body.tzbd-page #footer-widgets-container,
body.tzbd-page #slide-sidebar-widgets,
body.tzbd-page .breaking,
body.tzbd-page .site-footer,
/* These theme controls are unrelated to the transport guide and were
 * otherwise left in English on the live Jannah header. */
body.tzbd-page #top-nav .popup-login-icon,
body.tzbd-page #top-nav .random-post-icon,
body.tzbd-page #top-nav .side-aside-nav-icon,
body.tzbd-page #menu-components-wrap .random-post-icon,
body.tzbd-page #menu-components-wrap .search-compact-icon,
body.tzbd-page #menu-components-wrap .tie-search-trigger,
body.tzbd-page .mobile-header-components .mobile-component_search { display:none !important; }
.tzbd-place-rules { margin-top:24px; }

@media (max-width:980px) {
  .tzbd-place-grid { grid-template-columns:1fr; }
}
@media (max-width:680px) {
  .tzbd-place-tools__head { grid-template-columns:1fr; padding:22px; }
  .tzbd-place-tools__count { justify-self:start; }
  .tzbd-place-card__journey { grid-template-columns:1fr; }
  .tzbd-place-card__journey > div { border-right:0; border-bottom:1px solid #e7edf3; }
  .tzbd-place-card__journey > div:last-child { border-bottom:0; }
  .tzbd-place-card__footer { align-items:flex-start; flex-direction:column; }
  .tzbd-place-card__footer span { text-align:left; }
}

/* v0.8.0 – How to travel and transfer */
.tzbd-section-head--howto {
  align-items:center;
  background:linear-gradient(135deg,#22364f 0%,#3e5874 48%,#176b83 100%);
}
.tzbd-alert--howto { border-color:#bfd8e3; background:#f0f8fb; }
.tzbd-howto-steps { border-color:#cbdbe5; background:linear-gradient(180deg,#f3f9fc,#fff); }
.tzbd-howto-steps__grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
.tzbd-howto-steps__grid article { height:100%; }
.tzbd-howto-steps__grid article > span { background:linear-gradient(145deg,#176b83,#3e5874); }

.tzbd-howto-direction,
.tzbd-howto-transfers,
.tzbd-howto-access {
  margin:24px 0;
  padding:24px;
  border:1px solid var(--tzbd-line);
  border-radius:17px;
  background:#fff;
  box-shadow:0 9px 25px rgba(18,35,63,.07);
}
.tzbd-howto-direction { background:#f8fafc; }
.tzbd-howto-direction__grid,
.tzbd-howto-access-grid {
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:14px;
}
.tzbd-howto-direction__grid article,
.tzbd-howto-access-grid article {
  height:100%;
  padding:19px;
  border:1px solid #dfe6ed;
  border-radius:13px;
  background:#fff;
}
.tzbd-howto-direction__grid strong { display:block; color:#176b83; font-size:17px; }
.tzbd-howto-direction__grid span { display:block; margin:3px 0 8px; color:#3f5268; font-size:12px; font-weight:900; }
.tzbd-howto-direction__grid p,
.tzbd-howto-access-grid p { margin:0; color:var(--tzbd-muted); font-size:13px; }
.tzbd-howto-access-grid h4 { margin:0 0 7px; color:var(--tzbd-ink); font-size:17px; }

.tzbd-payment--howto .tzbd-payment__head { background:linear-gradient(135deg,#213950,#176b83); }
.tzbd-howto-media-grid {
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:1px;
  background:#dfe5eb;
}
.tzbd-howto-media-grid article { min-height:180px; padding:21px; background:#fff; }
.tzbd-howto-media-grid article > span {
  display:inline-flex;
  margin-bottom:10px;
  padding:5px 9px;
  border-radius:999px;
  color:#fff;
  background:#176b83;
  font-size:10px;
  font-weight:900;
  letter-spacing:.05em;
}
.tzbd-howto-media-grid h4 { margin:0 0 7px; color:var(--tzbd-ink); font-size:17px; }
.tzbd-howto-media-grid p { margin:0; color:var(--tzbd-muted); font-size:13px; }

.tzbd-howto-transfer-grid {
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:14px;
}
.tzbd-howto-transfer {
  height:100%;
  padding:19px;
  border:1px solid #dfe5ec;
  border-left-width:5px;
  border-radius:13px;
  background:#fff;
}
.tzbd-howto-transfer > span {
  display:inline-flex;
  margin-bottom:9px;
  padding:5px 8px;
  border-radius:999px;
  font-size:9px;
  font-weight:900;
  letter-spacing:.05em;
}
.tzbd-howto-transfer h4 { margin:0 0 7px; color:var(--tzbd-ink); font-size:17px; }
.tzbd-howto-transfer p { margin:0; color:var(--tzbd-muted); font-size:13px; }
.tzbd-howto-transfer--inside { border-left-color:#1a9b62; background:#f7fcf9; }
.tzbd-howto-transfer--inside > span { color:#12613d; background:#dff5e9; }
.tzbd-howto-transfer--rabbit { border-left-color:#5ca630; background:#f8fcf5; }
.tzbd-howto-transfer--rabbit > span { color:#35651c; background:#e5f4db; }
.tzbd-howto-transfer--outside { border-left-color:#718096; background:#fafbfc; }
.tzbd-howto-transfer--outside > span { color:#46566a; background:#e9eef3; }
.tzbd-howto-transfer--discount { border-left-color:#1769aa; background:#f5f9fe; }
.tzbd-howto-transfer--discount > span { color:#174d79; background:#dcecf9; }
.tzbd-howto-transfer-note {
  margin-top:14px;
  padding:14px 16px;
  border:1px solid #d4e0e8;
  border-radius:11px;
  color:#43576b;
  background:#f8fbfd;
  font-size:13px;
}

.tzbd-howto-access { background:#faf8fc; }
.tzbd-howto-access-grid article { border-color:#e2dcea; }
.tzbd-howto-mistakes { background:#fffaf0; }
.tzbd-howto-mistakes__grid {
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:12px;
}
.tzbd-howto-mistakes__grid article {
  display:grid;
  grid-template-columns:34px minmax(0,1fr);
  gap:11px;
  align-items:start;
  min-height:92px;
  padding:16px;
  border:1px solid #eadfca;
  border-radius:12px;
  background:#fff;
}
.tzbd-howto-mistakes__grid span {
  display:grid;
  place-items:center;
  width:30px;
  height:30px;
  border-radius:50%;
  color:#fff;
  background:#b7791f;
  font-size:12px;
  font-weight:900;
}
.tzbd-howto-mistakes__grid p { margin:0; color:#5b4a32; font-size:13px; }

@media (max-width:980px) {
  .tzbd-howto-direction__grid,
  .tzbd-howto-access-grid,
  .tzbd-howto-transfer-grid { grid-template-columns:1fr; }
}
@media (max-width:680px) {
  .tzbd-howto-direction,
  .tzbd-howto-transfers,
  .tzbd-howto-access { padding:19px; }
  .tzbd-howto-steps__grid,
  .tzbd-howto-media-grid,
  .tzbd-howto-mistakes__grid { grid-template-columns:1fr; }
  .tzbd-howto-media-grid article { min-height:0; }
  .tzbd-howto-mistakes__grid article { min-height:0; }
}

/* Cross-system route planner */
.tzbd-section-head--planner {
  background:linear-gradient(135deg,#0d5878 0%,#1769aa 48%,#5b3f91 100%);
}
.tzbd-facts--planner article { min-width:0; }
.tzbd-alert--planner { border-color:#b8d6e7; background:#eef8fd; }
.tzbd-route-planner {
  margin:24px 0;
  overflow:hidden;
  border:1px solid #c8d8e6;
  border-radius:18px;
  background:#fff;
  box-shadow:0 12px 30px rgba(18,35,63,.1);
}
.tzbd-route-planner__head {
  display:grid;
  grid-template-columns:minmax(0,1fr) auto;
  gap:22px;
  align-items:center;
  padding:26px;
  color:#fff;
  background:linear-gradient(135deg,#103b66,#1769aa 58%,#68459c);
}
.tzbd-route-planner__head h3 { margin:0 0 7px; color:inherit; font-size:clamp(24px,3vw,33px); }
.tzbd-route-planner__head p { margin:0; max-width:760px; opacity:.92; }
.tzbd-route-planner__status {
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:40px;
  padding:9px 14px;
  border:1px solid rgba(255,255,255,.25);
  border-radius:999px;
  background:rgba(255,255,255,.12);
  font-size:12px;
  font-weight:900;
  white-space:nowrap;
}
.tzbd-route-planner__form {
  display:grid;
  grid-template-columns:minmax(0,1fr) 50px minmax(0,1fr) auto;
  gap:12px;
  align-items:end;
  padding:22px 24px;
  border-bottom:1px solid #dce4ed;
  background:#f5f8fc;
}
.tzbd-route-planner__form label { display:grid; gap:7px; margin:0; }
.tzbd-route-planner__form label > span { color:var(--tzbd-ink); font-size:13px; font-weight:900; }
.tzbd-route-planner__form select {
  width:100%;
  min-height:50px;
  margin:0;
  padding:9px 38px 9px 12px;
  border:1px solid #bfcbd8;
  border-radius:10px;
  color:var(--tzbd-ink);
  background:#fff;
  font:inherit;
  font-size:14px;
}
.tzbd-route-planner__swap,
.tzbd-route-planner__submit {
  appearance:none;
  min-height:50px;
  margin:0;
  border:0;
  border-radius:10px;
  cursor:pointer;
  font:inherit;
  font-weight:900;
}
.tzbd-route-planner__swap { width:50px; padding:0; color:#1769aa; background:#e2edf7; font-size:23px; }
.tzbd-route-planner__swap:hover { background:#d5e5f3; }
.tzbd-route-planner__submit { padding:10px 19px; color:#10213b; background:var(--tzbd-gold); white-space:nowrap; }
.tzbd-route-planner__result { padding:24px; }
.tzbd-route-planner__empty,
.tzbd-route-planner__error {
  padding:20px;
  border-radius:13px;
  text-align:center;
}
.tzbd-route-planner__empty { border:1px dashed #bdccd9; color:var(--tzbd-muted); background:#fbfcfe; }
.tzbd-route-planner__error { border:1px solid #efc4c4; color:#8e2f2f; background:#fff1f1; font-weight:800; }
.tzbd-planner-result__title { margin-bottom:17px; }
.tzbd-planner-result__title > span { display:block; margin-bottom:4px; color:#1769aa; font-size:10px; font-weight:900; letter-spacing:.08em; }
.tzbd-planner-result__title h3 { margin:0; color:var(--tzbd-ink); font-size:clamp(22px,3vw,30px); line-height:1.2; }
.tzbd-planner-result__summary {
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:12px;
  margin-bottom:22px;
}
.tzbd-planner-result__summary article {
  display:flex;
  flex-direction:column;
  justify-content:center;
  min-height:116px;
  padding:17px;
  border:1px solid #dbe3ec;
  border-radius:14px;
  background:#fff;
  text-align:center;
}
.tzbd-planner-result__summary strong { display:block; color:#1769aa; font-size:28px; line-height:1.05; }
.tzbd-planner-result__summary span { display:block; margin-top:6px; color:var(--tzbd-muted); font-size:12px; }
.tzbd-planner-result__summary small { display:block; margin-top:5px; color:#6c7787; font-size:10px; }
.tzbd-planner-result__summary .tzbd-planner-result__price { color:#fff; border-color:transparent; background:linear-gradient(145deg,#137f54,#1ba56a); }
.tzbd-planner-result__summary .tzbd-planner-result__price strong,
.tzbd-planner-result__summary .tzbd-planner-result__price span,
.tzbd-planner-result__summary .tzbd-planner-result__price small { color:inherit; }
.tzbd-planner-result__body { display:grid; grid-template-columns:minmax(0,1.35fr) minmax(280px,.8fr); gap:20px; align-items:start; }
.tzbd-planner-result__body > section > h3 { margin:0 0 12px; color:var(--tzbd-ink); font-size:20px; }
.tzbd-planner-timeline { display:grid; gap:10px; }
.tzbd-planner-step {
  display:grid;
  grid-template-columns:38px minmax(0,1fr);
  gap:12px;
  padding:16px;
  border:1px solid #dce4ed;
  border-radius:13px;
  background:#fff;
}
.tzbd-planner-step__number {
  display:grid;
  place-items:center;
  width:34px;
  height:34px;
  border-radius:50%;
  color:#fff;
  background:var(--tzbd-step-color,#1769aa);
  font-size:13px;
  font-weight:900;
}
.tzbd-planner-step--transfer { border-color:#ead9ae; background:#fffaf0; }
.tzbd-planner-step--transfer .tzbd-planner-step__number { color:#5b4204; background:#f2c45e; }
.tzbd-planner-step--access { border-color:#bfdce7; background:#f3fbfd; }
.tzbd-planner-step--access .tzbd-planner-step__number { background:#168b94; }
.tzbd-planner-step--access .tzbd-planner-step__meta span { color:#146c75; }
.tzbd-planner-step__external {
  display:inline-flex;
  margin-top:9px;
  padding:5px 8px;
  border-radius:999px;
  color:#75440b;
  background:#fff0d6;
  font-size:10px;
  font-weight:900;
}
.tzbd-planner-step__meta { display:flex; justify-content:space-between; gap:8px 14px; align-items:center; margin-bottom:4px; }
.tzbd-planner-step__meta span { color:#1769aa; font-size:11px; font-weight:900; text-transform:uppercase; letter-spacing:.035em; }
.tzbd-planner-step__meta em { color:#7b8795; font-size:10px; font-style:normal; }
.tzbd-planner-step h4 { margin:0 0 5px; color:var(--tzbd-ink); font-size:16px; }
.tzbd-planner-step p { margin:0; color:var(--tzbd-muted); font-size:12px; }
.tzbd-planner-step__discount { display:inline-flex; margin-top:9px; padding:5px 8px; border-radius:999px; color:#145f44; background:#def5e9; font-size:10px; font-weight:900; }
.tzbd-planner-fares { display:grid; gap:10px; }
.tzbd-planner-fares article {
  display:grid;
  grid-template-columns:minmax(0,1fr) auto;
  gap:12px;
  align-items:center;
  padding:15px;
  border:1px solid #dce4ed;
  border-radius:12px;
  background:#f9fbfd;
}
.tzbd-planner-fares article > div:first-child strong,
.tzbd-planner-fares article > div:first-child span,
.tzbd-planner-fares article > div:last-child b,
.tzbd-planner-fares article > div:last-child small { display:block; }
.tzbd-planner-fares article > div:first-child strong { color:var(--tzbd-ink); font-size:13px; }
.tzbd-planner-fares article > div:first-child span { margin-top:3px; color:var(--tzbd-muted); font-size:10px; }
.tzbd-planner-fares article > div:last-child { max-width:145px; text-align:right; }
.tzbd-planner-fares article > div:last-child b { color:#168759; font-size:20px; white-space:nowrap; }
.tzbd-planner-fares article > div:last-child small { margin-top:3px; color:#7d8794; font-size:9px; line-height:1.3; }
.tzbd-planner-result__notes { margin-top:20px; padding:16px 18px; border:1px solid #ead8a9; border-radius:13px; background:#fff8e8; }
.tzbd-planner-result__notes strong { color:#6b4a00; }
.tzbd-planner-result__notes ul { margin:9px 0 0 18px; }
.tzbd-planner-result__notes li { margin:6px 0; color:#665a3d; font-size:12px; }
.tzbd-planner-help { margin-top:24px; }
.tzbd-planner-help__grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:14px; }
.tzbd-planner-help__grid article { padding:19px; border:1px solid #dbe3ec; border-radius:14px; background:#fff; }
.tzbd-planner-help__grid strong { display:block; margin-bottom:6px; color:#1769aa; }
.tzbd-planner-help__grid p { margin:0; color:var(--tzbd-muted); font-size:13px; }

@media (max-width:980px) {
  .tzbd-route-planner__form { grid-template-columns:minmax(0,1fr) 50px minmax(0,1fr); }
  .tzbd-route-planner__submit { grid-column:1 / -1; }
  .tzbd-planner-result__summary { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .tzbd-planner-result__body { grid-template-columns:1fr; }
  .tzbd-planner-help__grid { grid-template-columns:1fr; }
}
@media (max-width:680px) {
  .tzbd-route-planner__head { grid-template-columns:1fr; padding:22px; }
  .tzbd-route-planner__status { justify-self:start; }
  .tzbd-route-planner__form { grid-template-columns:1fr; padding:18px; }
  .tzbd-route-planner__swap { width:100%; }
  .tzbd-route-planner__submit { grid-column:auto; }
  .tzbd-route-planner__result { padding:18px; }
  .tzbd-planner-result__summary { grid-template-columns:1fr; }
  .tzbd-planner-step__meta { align-items:flex-start; flex-direction:column; }
  .tzbd-planner-fares article { grid-template-columns:1fr; }
  .tzbd-planner-fares article > div:last-child { max-width:none; text-align:left; }
}


/* Searchable station autocomplete */
.tzbd-autocomplete { position:relative; min-width:0; width:100%; }
.tzbd-autocomplete__select {
  position:absolute !important;
  width:1px !important;
  height:1px !important;
  margin:-1px !important;
  padding:0 !important;
  overflow:hidden !important;
  clip:rect(0 0 0 0) !important;
  clip-path:inset(50%) !important;
  white-space:nowrap !important;
  border:0 !important;
  opacity:0 !important;
  pointer-events:none !important;
}
.tzbd-autocomplete__input {
  width:100%;
  min-height:48px;
  margin:0;
  padding:9px 13px;
  border:1px solid #bdc9d7;
  border-radius:10px;
  background:#fff;
  color:var(--tzbd-ink);
  font:inherit;
  font-size:14px;
  line-height:1.3;
}
.tzbd-route-planner__form .tzbd-autocomplete__input { min-height:50px; border-color:#bfcbd8; }
.tzbd-autocomplete__input:focus { outline:0; border-color:#3d86bd; box-shadow:0 0 0 3px rgba(23,105,170,.14); }
.tzbd-autocomplete__input:disabled { color:#9aa4b1; background:#f1f3f6; cursor:not-allowed; }
.tzbd-autocomplete__menu {
  position:fixed;
  z-index:2147483000;
  overflow-x:hidden;
  overflow-y:auto;
  padding:6px;
  border:1px solid #c8d5e2;
  border-radius:12px;
  background:#fff;
  box-shadow:0 14px 34px rgba(18,35,63,.2);
  font-family:inherit;
}
.tzbd-autocomplete__menu[hidden] { display:none !important; }
.tzbd-autocomplete__option {
  display:grid;
  gap:2px;
  width:100%;
  margin:0;
  padding:10px 11px;
  border:0;
  border-radius:8px;
  background:transparent;
  color:#172033;
  cursor:pointer;
  font:inherit;
  text-align:left;
}
.tzbd-autocomplete__option strong { display:block; font-size:13px; line-height:1.3; }
.tzbd-autocomplete__option small { display:block; color:#728096; font-size:11px; line-height:1.25; }
.tzbd-autocomplete__option:hover,
.tzbd-autocomplete__option.is-active { background:#eaf3fb; color:#154d78; }
.tzbd-autocomplete__empty { padding:13px 12px; color:#7a8594; font-size:13px; text-align:center; }

/* All-lines schematic map */
.tzbd-section-head--map {
  background:linear-gradient(135deg,#15334f 0%,#176b83 52%,#5b4389 100%);
}
.tzbd-facts--map article { min-width:0; }
.tzbd-alert--map { border-color:#c7dce7; background:#f0f8fc; }
.tzbd-map-controls {
  margin:22px 0 16px;
  overflow:hidden;
  border:1px solid #cfdae5;
  border-radius:17px;
  background:#fff;
  box-shadow:0 9px 25px rgba(18,35,63,.08);
}
.tzbd-map-controls__head {
  display:grid;
  grid-template-columns:minmax(0,1fr) auto;
  gap:18px;
  align-items:center;
  padding:22px 24px;
  color:#fff;
  background:linear-gradient(135deg,#173d69,#176b83);
}
.tzbd-map-controls__head h3 { margin:0; color:inherit; font-size:clamp(22px,3vw,30px); }
.tzbd-map-controls__head .tzbd-eyebrow { margin-bottom:5px; }
.tzbd-map-zoom { display:flex; gap:7px; flex-wrap:wrap; justify-content:flex-end; }
.tzbd-map-zoom button,
.tzbd-map-filters button {
  appearance:none;
  border:1px solid #cbd6e1;
  border-radius:999px;
  background:#fff;
  color:#26384d;
  cursor:pointer;
  font:inherit;
  font-size:12px;
  font-weight:900;
}
.tzbd-map-zoom button { padding:8px 11px; border-color:rgba(255,255,255,.3); color:#fff; background:rgba(255,255,255,.1); }
.tzbd-map-zoom button.is-active { color:#13263d; background:#f2b632; border-color:#f2b632; }
.tzbd-map-controls__body { padding:19px 22px 21px; background:#f7f9fc; }
.tzbd-map-controls__body > label { display:grid; gap:7px; }
.tzbd-map-controls__body > label > span { font-size:13px; font-weight:900; }
.tzbd-map-controls__body select { width:100%; min-height:48px; }
.tzbd-map-filters { display:flex; gap:8px; flex-wrap:wrap; margin-top:13px; }
.tzbd-map-filters button { display:inline-flex; align-items:center; gap:7px; padding:7px 11px; }
.tzbd-map-filters button > span { width:10px; height:10px; border-radius:50%; background:var(--tzbd-map-color,#718096); }
.tzbd-map-filters button.is-active { color:#fff; border-color:#176b83; background:#176b83; }

.tzbd-map-detail {
  min-height:88px;
  margin:0 0 18px;
  padding:17px 20px;
  border:1px solid #d8e1ea;
  border-left:6px solid #176b83;
  border-radius:14px;
  background:#fff;
  box-shadow:0 7px 18px rgba(18,35,63,.06);
}
.tzbd-map-detail__empty { color:var(--tzbd-muted); font-size:13px; }
.tzbd-map-detail__content { display:grid; grid-template-columns:minmax(0,1fr) auto; gap:7px 20px; align-items:center; }
.tzbd-map-detail__content[hidden] { display:none !important; }
.tzbd-map-detail__line { display:inline-flex; justify-self:start; padding:4px 9px; border-radius:999px; color:#fff; background:#176b83; font-size:10px; font-weight:900; text-transform:uppercase; letter-spacing:.04em; }
.tzbd-map-detail h3 { grid-column:1; margin:0; color:var(--tzbd-ink); font-size:22px; }
.tzbd-map-detail p { grid-column:1; margin:0; color:var(--tzbd-muted); font-size:13px; }
.tzbd-map-detail__actions { grid-column:2; grid-row:1 / span 3; display:flex; gap:8px; flex-wrap:wrap; justify-content:flex-end; }
.tzbd-map-detail__actions a { display:inline-flex; align-items:center; min-height:40px; padding:8px 12px; border-radius:9px; text-decoration:none !important; font-size:12px; font-weight:900; }
.tzbd-map-detail__actions a:first-child { color:#fff !important; background:#1769aa; }
.tzbd-map-detail__actions a:last-child { color:#17324c !important; background:#f2b632; }

.tzbd-map-lines { --tzbd-map-station-width:108px; display:grid; gap:17px; }
.tzbd-map-lines[data-zoom="compact"] { --tzbd-map-station-width:82px; }
.tzbd-map-lines[data-zoom="large"] { --tzbd-map-station-width:142px; }
.tzbd-map-line { overflow:hidden; border:1px solid #d9e2eb; border-radius:16px; background:#fff; box-shadow:0 7px 20px rgba(18,35,63,.06); }
.tzbd-map-line[hidden] { display:none !important; }
.tzbd-map-line__head { display:grid; grid-template-columns:16px minmax(0,1fr) auto; gap:13px; align-items:center; padding:17px 20px; border-bottom:1px solid #e2e8ef; background:#f8fafc; }
.tzbd-map-line__swatch { width:14px; height:48px; border-radius:999px; background:var(--tzbd-map-color); }
.tzbd-map-line__head h3 { margin:0; color:var(--tzbd-ink); font-size:20px; }
.tzbd-map-line__head p { margin:2px 0 0; color:var(--tzbd-muted); font-size:12px; }
.tzbd-map-line__head > strong { color:var(--tzbd-muted); font-size:12px; white-space:nowrap; }
.tzbd-map-track-wrap { width:100%; overflow-x:auto; overscroll-behavior-inline:contain; scrollbar-color:#b7c5d4 #edf2f6; }
.tzbd-map-track-wrap:focus { outline:2px solid #80a9ca; outline-offset:-2px; }
.tzbd-map-track {
  position:relative;
  display:grid;
  grid-template-columns:repeat(var(--tzbd-map-count),var(--tzbd-map-station-width));
  width:max-content;
  min-width:100%;
  padding:18px 22px 20px;
}
.tzbd-map-track::before {
  content:"";
  position:absolute;
  top:44px;
  left:calc(22px + var(--tzbd-map-station-width)/2);
  right:calc(22px + var(--tzbd-map-station-width)/2);
  height:7px;
  border-radius:999px;
  background:var(--tzbd-map-color);
  opacity:.92;
}
.tzbd-map-track--branch::before { height:5px; background:repeating-linear-gradient(90deg,var(--tzbd-map-color) 0 12px,transparent 12px 18px); }
.tzbd-map-station {
  position:relative;
  z-index:1;
  appearance:none;
  display:flex;
  flex-direction:column;
  align-items:center;
  min-width:0;
  min-height:118px;
  padding:46px 6px 8px;
  border:0;
  border-radius:10px;
  color:var(--tzbd-ink);
  background:transparent;
  cursor:pointer;
  font:inherit;
  text-align:center;
}
.tzbd-map-station:hover,
.tzbd-map-station.is-active { background:#f1f6fa; }
.tzbd-map-station:focus-visible { outline:2px solid var(--tzbd-map-color); outline-offset:-2px; }
.tzbd-map-station__dot {
  position:absolute;
  top:19px;
  left:50%;
  width:18px;
  height:18px;
  border:4px solid var(--tzbd-map-color);
  border-radius:50%;
  background:#fff;
  transform:translateX(-50%);
  box-shadow:0 0 0 2px #fff;
}
.tzbd-map-station.is-transfer .tzbd-map-station__dot { width:24px; height:24px; top:16px; border-width:5px; box-shadow:0 0 0 3px #fff,0 0 0 5px var(--tzbd-map-color); }
.tzbd-map-station strong { display:block; margin-bottom:4px; color:var(--tzbd-map-color); font-size:11px; line-height:1.1; }
.tzbd-map-station small { display:block; max-width:100%; color:#455466; font-size:11px; font-weight:800; line-height:1.23; overflow-wrap:anywhere; }
.tzbd-map-branch { border-top:1px dashed #d9e2eb; background:#fcfdff; }
.tzbd-map-branch__head { display:flex; gap:8px 18px; flex-wrap:wrap; align-items:baseline; padding:13px 20px 0; }
.tzbd-map-branch__head strong { color:var(--tzbd-map-color); }
.tzbd-map-branch__head span { color:var(--tzbd-muted); font-size:12px; }
.tzbd-map-help { margin-top:18px; padding:16px 18px; border:1px solid #d9e3ec; border-radius:12px; color:#536174; background:#f8fafc; font-size:13px; }
.tzbd-map-help strong { color:#253b51; }

@media (max-width:760px) {
  .tzbd-map-controls__head { grid-template-columns:1fr; padding:20px; }
  .tzbd-map-zoom { justify-content:flex-start; }
  .tzbd-map-detail__content { grid-template-columns:1fr; }
  .tzbd-map-detail h3,
  .tzbd-map-detail p,
  .tzbd-map-detail__actions { grid-column:1; grid-row:auto; }
  .tzbd-map-detail__actions { justify-content:flex-start; margin-top:7px; }
  .tzbd-map-line__head { grid-template-columns:14px 1fr; }
  .tzbd-map-line__head > strong { grid-column:2; }
  .tzbd-map-lines { --tzbd-map-station-width:98px; }
  .tzbd-map-lines[data-zoom="compact"] { --tzbd-map-station-width:76px; }
  .tzbd-map-lines[data-zoom="large"] { --tzbd-map-station-width:126px; }
}


/* Boats */
.tzbd-section-head--boats {
  background:linear-gradient(135deg,#064d68 0%,#087f8d 55%,#22a499 100%);
}
.tzbd-facts--boats strong { white-space:nowrap; font-size:22px; }
.tzbd-alert--boats { border-color:#b9dfe0; background:#effafa; }
.tzbd-boat-chooser,
.tzbd-boat-section,
.tzbd-tourist-boat,
.tzbd-ferry-card,
.tzbd-boat-piers { margin:24px 0; }
.tzbd-boat-chooser__grid {
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:14px;
}
.tzbd-boat-type {
  display:grid;
  grid-template-columns:42px minmax(0,1fr);
  gap:13px;
  padding:19px;
  border:1px solid #d9e5ec;
  border-radius:14px;
  background:#fff;
  box-shadow:0 7px 18px rgba(18,35,63,.06);
}
.tzbd-boat-type > span {
  display:grid;
  place-items:center;
  width:38px;
  height:38px;
  border-radius:50%;
  color:#fff;
  background:#107f8b;
  font-weight:900;
}
.tzbd-boat-type--tourist > span { background:#2680c4; }
.tzbd-boat-type--canal > span { background:#b98716; }
.tzbd-boat-type--ferry > span { background:#72549a; }
.tzbd-boat-type h4 { margin:0 0 5px; font-size:17px; }
.tzbd-boat-type p { margin:0; color:var(--tzbd-muted); font-size:13px; }
.tzbd-boat-planner-link {
  display:grid;
  grid-template-columns:minmax(0,1fr) auto;
  gap:18px;
  align-items:center;
  margin:22px 0 24px;
  padding:17px 20px;
  border:1px solid #b9d8e1;
  border-radius:14px;
  background:#eef8fb;
}
.tzbd-boat-planner-link strong,
.tzbd-boat-planner-link span { display:block; }
.tzbd-boat-planner-link strong { margin-bottom:3px; color:#123d57; font-size:16px; }
.tzbd-boat-planner-link span { color:#536778; font-size:12px; }
.tzbd-boat-planner-link a {
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:42px;
  padding:9px 14px;
  border-radius:10px;
  color:#fff !important;
  background:#117e8a;
  font-size:12px;
  font-weight:900;
  text-decoration:none !important;
  white-space:nowrap;
}

.tzbd-boat-section {
  overflow:hidden;
  border:1px solid #d4e1e8;
  border-radius:17px;
  background:#fff;
  box-shadow:0 9px 25px rgba(18,35,63,.07);
}
.tzbd-boat-section__head { padding:24px 26px; color:#fff; }
.tzbd-boat-section__head--river { background:linear-gradient(135deg,#075473,#0e8996); }
.tzbd-boat-section__head--canal { background:linear-gradient(135deg,#8c6508,#c49412); }
.tzbd-boat-section__head h3 { margin:0 0 7px; color:inherit; font-size:clamp(23px,3vw,31px); }
.tzbd-boat-section__head p { margin:0; opacity:.92; }
.tzbd-boat-fares {
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:1px;
  background:#dfe7ed;
}
.tzbd-boat-fare { min-width:0; padding:20px; background:#fff; }
.tzbd-boat-fare header { display:grid; grid-template-columns:14px 1fr; gap:12px; align-items:start; }
.tzbd-boat-flag { width:12px; height:48px; border-radius:999px; background:#ec7a23; }
.tzbd-boat-fare--yellow .tzbd-boat-flag { background:#e1b900; }
.tzbd-boat-fare--green .tzbd-boat-flag { background:linear-gradient(180deg,#38985d 0 50%,#dfbd1b 50%); }
.tzbd-boat-fare--red .tzbd-boat-flag { background:#b62835; }
.tzbd-boat-fare h4 { margin:0; font-size:18px; }
.tzbd-boat-fare header p { margin:3px 0 0; color:var(--tzbd-muted); font-size:12px; }
.tzbd-boat-fare__price { margin:14px 0 8px; }
.tzbd-boat-fare__price strong { display:block; color:#117b86; font-size:26px; line-height:1.1; }
.tzbd-boat-fare__price span { color:var(--tzbd-muted); font-size:12px; }
.tzbd-boat-fare > p { margin:0; color:var(--tzbd-muted); font-size:13px; }
.tzbd-boat-tip,
.tzbd-boat-warning { padding:16px 20px; border-top:1px solid #dfe8ed; background:#f3f9fb; font-size:13px; }
.tzbd-boat-warning { border-color:#ead39d; color:#694d0c; background:#fff8e8; }
.tzbd-tourist-boat {
  display:grid;
  grid-template-columns:minmax(0,1.2fr) minmax(260px,.8fr);
  gap:22px;
  padding:25px;
  border-radius:17px;
  color:#fff;
  background:linear-gradient(135deg,#125695,#2c83c5 55%,#36a5c5);
  box-shadow:0 10px 26px rgba(18,35,63,.1);
}
.tzbd-tourist-boat h3 { margin:0 0 7px; color:inherit; font-size:clamp(24px,3vw,32px); }
.tzbd-tourist-boat p { margin:0; }
.tzbd-tourist-boat__prices { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:10px; }
.tzbd-tourist-boat__prices article { padding:15px; border:1px solid rgba(255,255,255,.25); border-radius:12px; background:rgba(255,255,255,.12); }
.tzbd-tourist-boat__prices strong { display:block; color:#fff; font-size:24px; }
.tzbd-tourist-boat__prices span { display:block; margin-top:4px; font-size:12px; opacity:.9; }
.tzbd-tourist-boat__route { grid-column:1 / -1; padding-top:16px; border-top:1px solid rgba(255,255,255,.2); font-size:13px; }
.tzbd-saen-grid {
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:1px;
  background:#e4e8ec;
}
.tzbd-saen-grid article { padding:19px; background:#fff; }
.tzbd-saen-grid h4 { margin:0 0 7px; font-size:15px; }
.tzbd-saen-grid strong { display:block; color:#a4770b; font-size:21px; line-height:1.15; }
.tzbd-saen-grid__time strong {
  white-space:nowrap;
  word-break:normal;
  overflow-wrap:normal;
  font-size:19px;
  letter-spacing:-.025em;
  font-variant-numeric:tabular-nums;
}
.tzbd-saen-grid__approx { display:block; margin-top:3px; color:#8c6c24; font-size:10px; font-weight:900; text-transform:uppercase; letter-spacing:.04em; }
.tzbd-saen-grid p { margin:8px 0 0; color:var(--tzbd-muted); font-size:12px; }
.tzbd-ferry-card {
  display:grid;
  grid-template-columns:minmax(0,1fr) auto;
  gap:22px;
  align-items:center;
  padding:24px 26px;
  border:1px solid #dfd3ef;
  border-radius:17px;
  background:linear-gradient(135deg,#f8f5fc,#fff);
}
.tzbd-ferry-card h3 { margin:0 0 7px; font-size:clamp(23px,3vw,30px); }
.tzbd-ferry-card p { margin:0; color:var(--tzbd-muted); }
.tzbd-ferry-card__price { min-width:180px; padding:18px; border-radius:13px; color:#fff; background:linear-gradient(145deg,#63428f,#8562ad); text-align:center; }
.tzbd-ferry-card__price strong { display:block; font-size:32px; line-height:1; }
.tzbd-ferry-card__price span { display:block; margin-top:6px; font-size:12px; }

.tzbd-ferries {
  margin:22px 0;
  overflow:hidden;
  border:1px solid #dfd3ef;
  border-radius:17px;
  background:#fff;
  box-shadow:0 10px 26px rgba(18,35,63,.08);
}
.tzbd-ferries__head {
  display:grid;
  grid-template-columns:minmax(0,1fr) auto;
  gap:18px;
  align-items:center;
  padding:24px 26px;
  color:#fff;
  background:linear-gradient(135deg,#51357c,#7552a1 55%,#9b6fc2);
}
.tzbd-ferries__head h3 { margin:0 0 6px; color:inherit; font-size:clamp(23px,3vw,31px); }
.tzbd-ferries__head p { margin:0; max-width:780px; opacity:.92; }
.tzbd-ferries__head > span { padding:8px 12px; border:1px solid rgba(255,255,255,.25); border-radius:999px; background:rgba(255,255,255,.12); font-size:12px; font-weight:900; white-space:nowrap; }
.tzbd-ferries__grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:1px; background:#e8e0f0; }
.tzbd-ferry-item { display:flex; flex-direction:column; min-width:0; padding:20px; background:#fff; }
.tzbd-ferry-item header { min-height:78px; }
.tzbd-ferry-item header > span { display:inline-block; margin-bottom:7px; color:#7552a1; font-size:10px; font-weight:900; letter-spacing:.06em; text-transform:uppercase; }
.tzbd-ferry-item h4 { margin:0; color:var(--tzbd-ink); font-size:18px; line-height:1.25; }
.tzbd-ferry-item h4 b { color:#7552a1; }
.tzbd-ferry-item__facts { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:9px; margin:12px 0; }
.tzbd-ferry-item__facts > div { padding:11px 12px; border:1px solid #e6deee; border-radius:10px; background:#faf8fc; }
.tzbd-ferry-item__facts small { display:block; margin-bottom:2px; color:var(--tzbd-muted); font-size:10px; font-weight:900; text-transform:uppercase; }
.tzbd-ferry-item__facts strong { display:block; color:#6b4997; font-size:17px; line-height:1.2; }
.tzbd-ferry-item p { margin:6px 0 0; color:var(--tzbd-muted); font-size:12px; }
.tzbd-ferry-item p strong { color:var(--tzbd-ink); }
.tzbd-ferries__note { padding:15px 20px; border-top:1px solid #ead39d; color:#694d0c; background:#fff8e8; font-size:13px; }
.tzbd-boat-piers { overflow:hidden; border:1px solid #d6e1e9; border-radius:17px; background:#fff; }
.tzbd-boat-piers__head { display:grid; grid-template-columns:minmax(0,1fr) auto; gap:18px; align-items:center; padding:23px 25px; color:#fff; background:linear-gradient(135deg,#07536d,#0d7d89); }
.tzbd-boat-piers__head h3 { margin:0 0 5px; color:inherit; font-size:clamp(23px,3vw,30px); }
.tzbd-boat-piers__head p { margin:0; opacity:.9; }
.tzbd-boat-piers__head > span { padding:8px 12px; border:1px solid rgba(255,255,255,.25); border-radius:999px; background:rgba(255,255,255,.12); font-size:12px; font-weight:900; }
.tzbd-boat-piers__tools { padding:18px 20px; border-bottom:1px solid #e4eaf0; background:#f5f8fb; }
.tzbd-boat-piers__tools input { width:100%; min-height:46px; padding:10px 13px; border:1px solid #c4d0dd; border-radius:10px; background:#fff; font:inherit; }
.tzbd-boat-piers__grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); }
.tzbd-boat-pier { min-width:0; padding:16px 18px; border-bottom:1px solid #e9eef3; }
.tzbd-boat-pier:nth-child(odd) { border-right:1px solid #e9eef3; }
.tzbd-boat-pier[hidden] { display:none !important; }
.tzbd-boat-pier header { display:grid; grid-template-columns:52px 1fr; gap:11px; align-items:start; }
.tzbd-boat-pier header > span { display:inline-flex; justify-content:center; padding:5px 7px; border-radius:999px; color:#fff; background:#117e8a; font-size:11px; font-weight:900; }
.tzbd-boat-pier--canal header > span { color:#4e3900; background:#e5bc32; }
.tzbd-boat-pier h4 { margin:0; font-size:16px; }
.tzbd-boat-pier header p { margin:2px 0 0; color:var(--tzbd-muted); font-size:12px; }
.tzbd-boat-pier dl { display:grid; gap:8px; margin:13px 0 0; }
.tzbd-boat-pier dl > div { display:grid; grid-template-columns:82px 1fr; gap:8px; }
.tzbd-boat-pier dt { color:var(--tzbd-muted); font-size:10px; font-weight:900; text-transform:uppercase; }
.tzbd-boat-pier dd { margin:0; font-size:12px; font-weight:700; }

@media (max-width:980px) {
  .tzbd-boat-chooser__grid,
  .tzbd-boat-fares,
  .tzbd-tourist-boat,
  .tzbd-boat-piers__grid,
  .tzbd-ferries__grid { grid-template-columns:1fr; }
  .tzbd-boat-pier:nth-child(odd) { border-right:0; }
  .tzbd-saen-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
}
@media (max-width:680px) {
  .tzbd-facts--boats strong { font-size:21px; }
  .tzbd-tourist-boat__prices,
  .tzbd-saen-grid { grid-template-columns:1fr; }
  .tzbd-ferry-card,
  .tzbd-boat-piers__head { grid-template-columns:1fr; }
  .tzbd-ferry-card__price { min-width:0; }
  .tzbd-boat-pier dl > div { grid-template-columns:1fr; gap:2px; }
}

.tzbd-planner-fares .tzbd-planner-fare-note { display:block; margin-top:5px; color:#8a6511; font-size:10px; font-weight:800; line-height:1.35; }

@media (max-width:680px){ .tzbd-boat-planner-link{grid-template-columns:1fr;} .tzbd-boat-planner-link a{width:100%;white-space:normal;text-align:center;} }

@media (max-width:680px) {
  .tzbd-ferries__head { grid-template-columns:1fr; padding:22px; }
  .tzbd-ferries__head > span { justify-self:start; }
  .tzbd-ferry-item header { min-height:auto; }
}

/* Airport shuttle and Bangkok city buses */
.tzbd-airport-shuttle {
  margin:22px 0;
  overflow:hidden;
  border:1px solid #f0c99f;
  border-radius:17px;
  background:#fff;
  box-shadow:0 10px 26px rgba(18,35,63,.08);
}
.tzbd-airport-shuttle__head {
  display:grid;
  grid-template-columns:58px minmax(0,1fr);
  gap:16px;
  align-items:start;
  padding:23px 25px;
  color:#fff;
  background:linear-gradient(135deg,#a84a12,#d97922 58%,#ef9a3f);
}
.tzbd-airport-shuttle__icon {
  display:grid;
  place-items:center;
  width:54px;
  height:54px;
  border:1px solid rgba(255,255,255,.3);
  border-radius:14px;
  background:rgba(255,255,255,.14);
}
.tzbd-airport-shuttle__icon svg { width:28px; height:28px; }
.tzbd-airport-shuttle__head h3 { margin:0 0 6px; color:inherit; font-size:clamp(23px,3vw,31px); }
.tzbd-airport-shuttle__head p { margin:0; opacity:.93; }
.tzbd-airport-shuttle__grid { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:1px; background:#eadfd4; }
.tzbd-airport-shuttle__grid article { min-width:0; padding:18px; background:#fff; }
.tzbd-airport-shuttle__grid small { display:block; margin-bottom:4px; color:#9a5a24; font-size:10px; font-weight:900; letter-spacing:.04em; text-transform:uppercase; }
.tzbd-airport-shuttle__grid strong { display:block; color:#61300d; font-size:18px; line-height:1.2; }
.tzbd-airport-shuttle__grid span { display:block; margin-top:6px; color:var(--tzbd-muted); font-size:12px; }
.tzbd-airport-shuttle__warning { padding:15px 20px; border-top:1px solid #ead19f; color:#704d0a; background:#fff8e8; font-size:13px; }
.tzbd-ticket-shuttle-note {
  display:grid;
  grid-template-columns:48px minmax(0,1fr);
  gap:14px;
  align-items:start;
  margin:18px 0;
  padding:17px 19px;
  border:1px solid #f0c99f;
  border-radius:13px;
  background:#fff8ee;
}
.tzbd-ticket-shuttle-note > span { display:grid; place-items:center; width:44px; height:44px; border-radius:12px; color:#fff; background:#d97922; }
.tzbd-ticket-shuttle-note svg { width:24px; height:24px; }
.tzbd-ticket-shuttle-note strong { color:#70360e; }
.tzbd-ticket-shuttle-note p { margin:3px 0 0; color:#6c5b4c; font-size:13px; }
.tzbd-planner-step--shuttle { border-color:#efc99f !important; background:#fff9f2 !important; }

.tzbd-section-head--buses { background:linear-gradient(135deg,#7c2f0c,#ba5718 52%,#df852e); }
.tzbd-alert--buses { border-color:#efc89c; background:#fff7ec; }
.tzbd-bus-steps,
.tzbd-bus-fares,
.tzbd-bus-finder,
.tzbd-bus-routes,
.tzbd-bus-practical { margin:24px 0; }
.tzbd-content-head { margin-bottom:15px; }
.tzbd-content-head h3 { margin:0 0 5px; color:var(--tzbd-ink); font-size:clamp(23px,3vw,31px); }
.tzbd-content-head p { margin:0; color:var(--tzbd-muted); }
.tzbd-bus-steps__grid {
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:1px;
  overflow:hidden;
  border:1px solid #e1e6ec;
  border-radius:16px;
  background:#e1e6ec;
}
.tzbd-bus-steps__grid article {
  display:grid;
  grid-template-columns:42px minmax(0,1fr);
  gap:13px;
  min-width:0;
  padding:20px;
  background:#fff;
}
.tzbd-bus-steps__grid article > span,
.tzbd-bus-practical .tzbd-ticket-choice__grid article > span {
  display:grid;
  place-items:center;
  width:38px;
  height:38px;
  border-radius:50%;
  color:#fff;
  background:linear-gradient(145deg,#a34512,#d87822);
  font-weight:900;
}
.tzbd-bus-steps h4,
.tzbd-bus-practical .tzbd-ticket-choice__grid h4 { margin:0 0 5px; color:var(--tzbd-ink); font-size:16px; }
.tzbd-bus-steps p,
.tzbd-bus-practical .tzbd-ticket-choice__grid p { margin:0; color:var(--tzbd-muted); font-size:13px; }
.tzbd-bus-fares__grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:14px; }
.tzbd-bus-fare {
  display:flex;
  flex-direction:column;
  min-width:0;
  overflow:hidden;
  border:1px solid #dfe4eb;
  border-radius:15px;
  background:#fff;
  box-shadow:0 7px 20px rgba(18,35,63,.06);
}
.tzbd-bus-fare header { display:grid; grid-template-columns:17px minmax(0,1fr); gap:12px; align-items:start; min-height:85px; padding:18px 19px 13px; background:#f8fafc; }
.tzbd-bus-fare__swatch { width:14px; height:48px; border-radius:999px; background:#b64b2e; }
.tzbd-bus-fare--blue .tzbd-bus-fare__swatch { background:#3e79b7; }
.tzbd-bus-fare--orange .tzbd-bus-fare__swatch { background:#e18725; }
.tzbd-bus-fare--ngv .tzbd-bus-fare__swatch { background:#55a9cf; }
.tzbd-bus-fare--airport .tzbd-bus-fare__swatch { background:#6d4a9c; }
.tzbd-bus-fare h4 { margin:0; font-size:17px; }
.tzbd-bus-fare header p { margin:2px 0 0; color:var(--tzbd-muted); font-size:12px; }
.tzbd-bus-fare__price { display:grid; grid-template-columns:auto minmax(0,1fr); gap:10px; align-items:center; padding:14px 19px; border-top:1px solid #e9edf2; border-bottom:1px solid #e9edf2; background:#fffaf4; }
.tzbd-bus-fare__price strong { white-space:nowrap; color:#a84a12; font-size:22px; }
.tzbd-bus-fare__price span { color:#775e49; font-size:12px; font-weight:800; }
.tzbd-bus-fare > p { flex:1 1 auto; margin:0; padding:16px 19px 19px; color:var(--tzbd-muted); font-size:13px; }
.tzbd-payment--buses .tzbd-payment__head { background:linear-gradient(135deg,#78300e,#ba5819); }
.tzbd-payment--buses .tzbd-payment__grid article > span { background:linear-gradient(145deg,#a34512,#d87822); }
.tzbd-bus-finder {
  overflow:hidden;
  border:1px solid #d9e1e9;
  border-radius:17px;
  background:#fff;
}
.tzbd-bus-finder__head {
  display:grid;
  grid-template-columns:minmax(0,1fr) auto;
  gap:20px;
  align-items:center;
  padding:24px 25px;
  color:#fff;
  background:linear-gradient(135deg,#283d52,#566e82);
}
.tzbd-bus-finder__head h3 { margin:0 0 6px; color:inherit; font-size:clamp(23px,3vw,30px); }
.tzbd-bus-finder__head p { margin:0; max-width:780px; opacity:.92; }
.tzbd-bus-finder__head a { display:inline-flex; justify-content:center; padding:11px 14px; border-radius:10px; color:#172033 !important; background:#f2b632; font-weight:900; text-decoration:none !important; white-space:nowrap; }
.tzbd-bus-finder__tips { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:1px; background:#e3e8ed; }
.tzbd-bus-finder__tips article { padding:18px; background:#fff; }
.tzbd-bus-finder__tips strong { color:#344d63; }
.tzbd-bus-finder__tips p { margin:5px 0 0; color:var(--tzbd-muted); font-size:12px; }
.tzbd-bus-routes {
  overflow:hidden;
  border:1px solid #ead7c3;
  border-radius:17px;
  background:#fff;
}
.tzbd-bus-routes__head {
  display:grid;
  grid-template-columns:minmax(0,1fr) auto;
  gap:18px;
  align-items:center;
  padding:23px 25px;
  color:#fff;
  background:linear-gradient(135deg,#7d2f0b,#c35e1b 55%,#de862f);
}
.tzbd-bus-routes__head h3 { margin:0 0 5px; color:inherit; font-size:clamp(23px,3vw,30px); }
.tzbd-bus-routes__head p { margin:0; opacity:.91; }
.tzbd-bus-routes__head > span { padding:8px 12px; border:1px solid rgba(255,255,255,.25); border-radius:999px; background:rgba(255,255,255,.12); font-size:12px; font-weight:900; white-space:nowrap; }
.tzbd-bus-routes__tools { padding:17px 19px; border-bottom:1px solid #e5eaf0; background:#f6f8fb; }
.tzbd-bus-routes__tools input { width:100%; min-height:46px; padding:10px 13px; border:1px solid #c5d0dc; border-radius:10px; background:#fff; font:inherit; }
.tzbd-bus-routes__grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:1px; background:#e7e1db; }
.tzbd-bus-route { display:flex; flex-direction:column; min-width:0; padding:19px; background:#fff; }
.tzbd-bus-route[hidden] { display:none !important; }
.tzbd-bus-route header { display:grid; grid-template-columns:50px minmax(0,1fr); gap:12px; align-items:start; min-height:103px; }
.tzbd-bus-route header > strong { display:grid; place-items:center; min-height:42px; padding:7px; border-radius:11px; color:#fff; background:#bd5617; font-size:16px; }
.tzbd-bus-route h4 { margin:0; font-size:16px; line-height:1.28; }
.tzbd-bus-route header p { margin:5px 0 0; color:var(--tzbd-muted); font-size:12px; }
.tzbd-bus-route__facts { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:8px; margin:12px 0; }
.tzbd-bus-route__facts span { padding:10px 11px; border:1px solid #eadfce; border-radius:9px; background:#fffaf3; }
.tzbd-bus-route__facts small { display:block; color:#96704e; font-size:9px; font-weight:900; text-transform:uppercase; }
.tzbd-bus-route__facts b { display:block; margin-top:2px; color:#75370f; font-size:15px; }
.tzbd-bus-route > p { margin:auto 0 0; color:var(--tzbd-muted); font-size:12px; }
.tzbd-bus-practical .tzbd-ticket-choice__grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:1px; overflow:hidden; border:1px solid #e1e6ec; border-radius:15px; background:#e1e6ec; }
.tzbd-bus-practical .tzbd-ticket-choice__grid article { display:grid; grid-template-columns:42px minmax(0,1fr); gap:13px; padding:19px; background:#fff; }

@media (max-width:980px) {
  .tzbd-airport-shuttle__grid,
  .tzbd-bus-finder__tips { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .tzbd-bus-fares__grid,
  .tzbd-bus-routes__grid { grid-template-columns:1fr; }
}
@media (max-width:680px) {
  .tzbd-airport-shuttle__head,
  .tzbd-ticket-shuttle-note,
  .tzbd-bus-finder__head,
  .tzbd-bus-routes__head { grid-template-columns:1fr; }
  .tzbd-airport-shuttle__grid,
  .tzbd-bus-steps__grid,
  .tzbd-bus-finder__tips,
  .tzbd-bus-practical .tzbd-ticket-choice__grid { grid-template-columns:1fr; }
  .tzbd-bus-finder__head a { width:100%; white-space:normal; text-align:center; }
  .tzbd-bus-routes__head > span { justify-self:start; }
  .tzbd-bus-fare__price { grid-template-columns:1fr; }
  .tzbd-bus-route header { min-height:auto; }
}

/* v0.15.0 – local English/Thai BMTA bus finder */
.tzbd-bus-finder__status {
  display:grid;
  gap:2px;
  min-width:150px;
  padding:11px 14px;
  border:1px solid rgba(255,255,255,.24);
  border-radius:11px;
  background:rgba(255,255,255,.1);
  text-align:right;
}
.tzbd-bus-finder__status strong { font-size:16px; }
.tzbd-bus-finder__status span { max-width:220px; font-size:11px; opacity:.88; }
.tzbd-bus-finder__status.is-ready strong { color:#f2b632; }
.tzbd-bus-data-waiting { padding:20px; background:#fff; }
.tzbd-bus-data-waiting strong { color:var(--tzbd-ink); font-size:17px; }
.tzbd-bus-data-waiting p { margin:5px 0 12px; color:var(--tzbd-muted); }
.tzbd-bus-data-waiting a { display:inline-flex; padding:9px 12px; border-radius:9px; background:var(--tzbd-navy); color:#fff !important; font-weight:800; text-decoration:none !important; }
.tzbd-bus-tool { background:#fff; }
.tzbd-bus-tool__tabs { display:flex; gap:7px; padding:13px 16px; border-bottom:1px solid #e4e9ef; background:#f6f8fb; }
.tzbd-bus-tool__tabs button { min-height:38px; padding:8px 13px; border:1px solid #cbd5df; border-radius:9px; background:#fff; color:#34465a; font:inherit; font-size:13px; font-weight:900; cursor:pointer; }
.tzbd-bus-tool__tabs button.is-active { border-color:var(--tzbd-navy); background:var(--tzbd-navy); color:#fff; }
.tzbd-bus-tool__panel { padding:18px; }
.tzbd-bus-tool__panel[hidden] { display:none !important; }
.tzbd-bus-plan { display:grid; grid-template-columns:minmax(0,1fr) 40px minmax(0,1fr) auto; gap:10px; align-items:end; }
.tzbd-bus-plan__field { position:relative; min-width:0; }
.tzbd-bus-plan__field label { display:block; margin:0 0 5px; color:#526274; font-size:11px; font-weight:900; text-transform:uppercase; }
.tzbd-bus-plan__field input,
.tzbd-bus-browser__search input { width:100%; min-height:45px; padding:10px 12px; border:1px solid #bcc9d6; border-radius:9px; background:#fff; color:var(--tzbd-ink); font:inherit; }
.tzbd-bus-plan__field input:focus,
.tzbd-bus-browser__search input:focus { border-color:var(--tzbd-blue); outline:2px solid rgba(23,105,170,.13); }
.tzbd-bus-plan__swap { width:40px; min-height:45px; border:1px solid #cbd5df; border-radius:9px; background:#f5f7fa; color:#34465a; font-size:21px; font-weight:900; cursor:pointer; }
.tzbd-bus-plan__submit { min-height:45px; padding:10px 17px; border:0; border-radius:9px; background:#bd5617; color:#fff; font:inherit; font-weight:900; white-space:nowrap; cursor:pointer; }
.tzbd-bus-suggestions { position:absolute; z-index:40; top:calc(100% + 4px); left:0; right:0; max-height:340px; overflow:auto; border:1px solid #c8d2dc; border-radius:10px; background:#fff; box-shadow:0 15px 35px rgba(25,42,63,.18); }
.tzbd-bus-suggestions[hidden] { display:none !important; }
.tzbd-bus-suggestions button { display:grid; width:100%; gap:1px; padding:10px 12px; border:0; border-bottom:1px solid #e8edf1; background:#fff; color:var(--tzbd-ink); font:inherit; text-align:left; cursor:pointer; }
.tzbd-bus-suggestions button:hover,
.tzbd-bus-suggestions button:focus { background:#f3f7fb; }
.tzbd-bus-suggestions button strong { font-size:13px; }
.tzbd-bus-suggestions small,
.tzbd-bus-browser__item small,
.tzbd-bus-stop-item small,
.tzbd-bus-result small,
.tzbd-bus-detail small { display:block; margin-top:1px; color:#7a6481; font-size:11px; font-weight:600; }
.tzbd-bus-stop-routes { display:block; margin-top:3px; color:#8a5a2b; font-size:10px; font-weight:900; }
.tzbd-bus-service-note { display:inline-flex; align-items:center; width:max-content; margin:3px 0 1px; padding:2px 6px; border-radius:999px; background:#fff1dc; color:#8b4b12; font-size:9px; font-weight:900; line-height:1.35; }
.tzbd-bus-suggestions__empty,
.tzbd-bus-loading,
.tzbd-bus-error,
.tzbd-bus-browser__empty { margin:0; padding:13px; color:var(--tzbd-muted); }
.tzbd-bus-error { color:#a63535; background:#fff2f1; border-radius:8px; }
.tzbd-bus-results { margin-top:16px; }
.tzbd-bus-results__intro { margin:0; padding:13px 15px; border-radius:9px; background:#f6f8fb; color:var(--tzbd-muted); font-size:13px; }
.tzbd-bus-plan-summary { display:flex; justify-content:space-between; gap:12px; align-items:center; margin-bottom:10px; padding:11px 13px; border-radius:9px; background:#edf4fa; color:#284760; }
.tzbd-bus-plan-summary span { font-size:11px; font-weight:900; }
.tzbd-bus-result { margin-top:12px; overflow:hidden; border:1px solid #d8e0e8; border-radius:12px; background:#fff; }
.tzbd-bus-result__top { display:flex; justify-content:space-between; gap:10px; padding:9px 13px; background:#f5f7fa; color:#4e5e6f; font-size:11px; }
.tzbd-bus-result__top strong { color:var(--tzbd-ink); font-size:13px; }
.tzbd-bus-result__leg { padding:14px; }
.tzbd-bus-result__leg + .tzbd-bus-result__leg { border-top:1px dashed #ccd5de; }
.tzbd-bus-result__leg header { display:grid; grid-template-columns:62px minmax(0,1fr); gap:11px; align-items:start; }
.tzbd-bus-result__leg header > div > small:first-child { color:#86715c; text-transform:uppercase; font-size:9px; font-weight:900; }
.tzbd-bus-result__leg header > div > strong { display:block; color:var(--tzbd-ink); font-size:15px; }
.tzbd-bus-result__route { display:grid; place-items:center; min-height:42px; padding:5px 4px; border-radius:9px; background:#bd5617; color:#fff; font-size:12px; line-height:1.1; text-align:center; font-weight:900; overflow-wrap:anywhere; }
.tzbd-bus-result__endpoints { display:grid; grid-template-columns:minmax(0,1fr) auto minmax(0,1fr); gap:10px; align-items:center; margin:13px 0; padding:11px; border:1px solid #e2e7ec; border-radius:9px; background:#fafbfd; }
.tzbd-bus-result__endpoints > span { color:#bd5617; font-weight:900; }
.tzbd-bus-result__endpoints small { color:#778595; font-size:9px; font-weight:900; text-transform:uppercase; }
.tzbd-bus-result__endpoints strong { display:block; font-size:12px; }
.tzbd-bus-result details,
.tzbd-bus-detail details { border-top:1px solid #e8edf1; }
.tzbd-bus-result summary,
.tzbd-bus-detail summary { display:flex; justify-content:space-between; gap:10px; padding:10px 0; color:#36516a; font-size:12px; font-weight:900; cursor:pointer; }
.tzbd-bus-result ol,
.tzbd-bus-detail ol { margin:0; padding:0; list-style:none; }
.tzbd-bus-result li,
.tzbd-bus-detail li { display:grid; grid-template-columns:32px minmax(0,1fr); gap:9px; padding:7px 3px; border-top:1px solid #edf0f3; }
.tzbd-bus-result li > span,
.tzbd-bus-detail li > span { color:#9a6b44; font-size:10px; font-weight:900; }
.tzbd-bus-result li strong,
.tzbd-bus-detail li strong { display:block; font-size:12px; }
.tzbd-bus-result li.is-key { background:#fff9f2; }
.tzbd-bus-transfer { margin:0 14px; padding:9px 12px; border:1px dashed #d39a5e; border-radius:9px; background:#fff9f1; }
.tzbd-bus-transfer strong { display:block; color:#754517; font-size:12px; }
.tzbd-bus-result__fare { margin:0 14px 14px; padding:10px 12px; border-radius:8px; background:#fff7e8; color:#765630; font-size:12px; }
.tzbd-bus-fare-note { margin:13px 0 0; padding:11px 13px; border-radius:9px; background:#fff7e8; color:#765630; font-size:12px; }
.tzbd-bus-no-route { padding:14px; border-radius:9px; background:#fff5f0; }
.tzbd-bus-no-route p { margin:4px 0 0; color:var(--tzbd-muted); font-size:12px; }
.tzbd-bus-browser__search { margin-bottom:11px; }
.tzbd-bus-browser__list { display:grid; gap:1px; overflow:hidden; border:1px solid #dce3e9; border-radius:10px; background:#dce3e9; }
.tzbd-bus-browser__item { display:grid; grid-template-columns:55px minmax(0,1fr) 18px; gap:11px; align-items:center; width:100%; padding:11px 13px; border:0; background:#fff; color:var(--tzbd-ink); font:inherit; text-align:left; cursor:pointer; }
.tzbd-bus-browser__item:hover { background:#f7f9fb; }
.tzbd-bus-browser__number { display:grid; place-items:center; min-height:36px; padding:4px; border-radius:8px; background:#bd5617; color:#fff; font-size:13px; font-weight:900; }
.tzbd-bus-browser__item strong { display:block; font-size:13px; }
.tzbd-bus-load-more { display:block; margin:12px auto 0; padding:8px 14px; border:1px solid #bfcbd6; border-radius:9px; background:#fff; color:#34465a; font:inherit; font-weight:900; cursor:pointer; }
.tzbd-bus-load-more[hidden] { display:none !important; }
.tzbd-bus-stop-item { display:flex; justify-content:space-between; gap:12px; align-items:center; padding:11px 13px; background:#fff; }
.tzbd-bus-stop-item strong { display:block; font-size:13px; }
.tzbd-bus-stop-item > a { flex:0 0 auto; color:var(--tzbd-blue) !important; font-size:11px; font-weight:900; text-decoration:none !important; }
.tzbd-bus-detail { position:relative; margin-top:16px; padding:16px; border:1px solid #d3dce5; border-radius:12px; background:#fff; }
.tzbd-bus-detail[hidden] { display:none !important; }
.tzbd-bus-detail__close { float:right; margin:0 0 8px 12px; padding:6px 9px; border:1px solid #ccd5dd; border-radius:7px; background:#fff; font:inherit; font-size:11px; font-weight:900; cursor:pointer; }
.tzbd-bus-detail > header { display:grid; grid-template-columns:54px minmax(0,1fr); gap:12px; align-items:start; margin-bottom:11px; }
.tzbd-bus-detail > header > span { display:grid; place-items:center; min-height:42px; border-radius:9px; background:#bd5617; color:#fff; font-weight:900; }
.tzbd-bus-detail h4 { margin:0; font-size:17px; }

@media (max-width:900px) {
  .tzbd-bus-plan { grid-template-columns:minmax(0,1fr) 40px minmax(0,1fr); }
  .tzbd-bus-plan__submit { grid-column:1 / -1; }
}
@media (max-width:620px) {
  .tzbd-bus-finder__status { min-width:0; text-align:left; }
  .tzbd-bus-tool__tabs { display:grid; grid-template-columns:1fr; }
  .tzbd-bus-tool__panel { padding:14px; }
  .tzbd-bus-plan { grid-template-columns:1fr; }
  .tzbd-bus-plan__swap { width:100%; min-height:36px; }
  .tzbd-bus-plan__submit { grid-column:auto; width:100%; }
  .tzbd-bus-result__endpoints { grid-template-columns:1fr; }
  .tzbd-bus-result__endpoints > span { transform:rotate(90deg); justify-self:start; }
  .tzbd-bus-plan-summary,
  .tzbd-bus-result__top { align-items:flex-start; flex-direction:column; }
}

/* Bus planner: explicit short walking links between nearby GTFS stop IDs. */
.tzbd-bus-walk { margin:10px 14px; padding:10px 12px; border:1px dashed #8da9c2; border-radius:9px; background:#f3f8fc; }
.tzbd-bus-walk strong { display:block; color:#294f70; font-size:12px; }
.tzbd-bus-walk span { display:block; margin-top:3px; color:#60778b; font-size:11px; }

/* Airport bus cards: an odd final card fills both desktop columns, so the grid
   background never appears as an empty brown cell beside S1. */
.tzbd-bus-routes__grid > .tzbd-bus-route:last-child:nth-child(odd) { grid-column:1 / -1; }
@media (max-width:980px) {
  .tzbd-bus-routes__grid > .tzbd-bus-route:last-child:nth-child(odd) { grid-column:auto; }
}

/* 0.15.16: compact accordion for bus route alternatives. */
.tzbd-bus-result > .tzbd-bus-result__summary {
  display:grid;
  grid-template-columns:minmax(0,1fr) auto;
  gap:12px;
  align-items:center;
  padding:12px 14px;
  list-style:none;
  cursor:pointer;
  background:#f5f7fa;
  color:#4e5e6f;
  user-select:none;
}
.tzbd-bus-result > .tzbd-bus-result__summary::-webkit-details-marker { display:none; }
.tzbd-bus-result > .tzbd-bus-result__summary::marker { content:""; }
.tzbd-bus-result > .tzbd-bus-result__summary:hover { background:#eef3f7; }
.tzbd-bus-result[open] > .tzbd-bus-result__summary {
  border-bottom:1px solid #d8e0e8;
  background:#edf4fa;
}
.tzbd-bus-result__summary-main {
  display:flex;
  flex-wrap:wrap;
  gap:7px 10px;
  align-items:center;
  min-width:0;
}
.tzbd-bus-result__summary-main > strong { color:var(--tzbd-ink); font-size:13px; }
.tzbd-bus-result__summary-main > b {
  display:inline-flex;
  min-width:0;
  padding:4px 8px;
  border-radius:7px;
  background:#fff3e8;
  color:#a54813;
  font-size:12px;
  line-height:1.25;
  overflow-wrap:anywhere;
}
.tzbd-bus-result__summary-meta {
  display:flex;
  flex-wrap:wrap;
  justify-content:flex-end;
  gap:5px 10px;
  align-items:center;
  color:#617184;
  font-size:10px;
  font-weight:800;
  text-align:right;
}
.tzbd-bus-result__summary-meta > span + span::before {
  content:"•";
  margin-right:10px;
  color:#aab4be;
}
.tzbd-bus-result__summary-meta > em {
  padding:4px 7px;
  border-radius:7px;
  background:#fff7e8;
  color:#765630;
  font-style:normal;
  font-weight:900;
  white-space:nowrap;
}
.tzbd-bus-result__summary-meta > i {
  width:9px;
  height:9px;
  margin:0 3px 4px 1px;
  border-right:2px solid #52677a;
  border-bottom:2px solid #52677a;
  transform:rotate(45deg);
  transition:transform .18s ease, margin .18s ease;
}
.tzbd-bus-result[open] .tzbd-bus-result__summary-meta > i {
  margin:5px 3px 0 1px;
  transform:rotate(225deg);
}
.tzbd-bus-result__body { padding-top:1px; }

@media (max-width:760px) {
  .tzbd-bus-result > .tzbd-bus-result__summary { grid-template-columns:1fr; gap:8px; }
  .tzbd-bus-result__summary-meta { justify-content:flex-start; text-align:left; }
  .tzbd-bus-result__summary-meta > i { margin-left:auto; }
}

/* v0.15.19 – ordered transport hub: wide planner, paired modes and wide places */
.tzbd-hub--ordered .tzbd-hub__hero {
  margin-bottom:22px;
}

.tzbd-hub--ordered .tzbd-hub__grid {
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:20px;
}

.tzbd-hub--ordered .tzbd-hub__grid > .tzbd-hub-card {
  grid-column:span 1;
  min-height:225px;
  padding:25px;
}

.tzbd-hub--ordered .tzbd-hub__grid > .tzbd-hub-card--wide {
  grid-column:1 / -1;
  min-height:310px;
  padding:34px;
}

.tzbd-hub--ordered .tzbd-hub__grid > .tzbd-hub-card--primary {
  min-height:330px;
}

.tzbd-hub--ordered .tzbd-hub__grid > .tzbd-hub-card--places {
  min-height:295px;
}

.tzbd-hub--ordered .tzbd-hub-card .tzbd-card__body {
  max-width:88%;
  gap:7px;
}

.tzbd-hub--ordered .tzbd-hub-card .tzbd-card__body strong {
  font-size:clamp(23px,2.25vw,31px);
}

.tzbd-hub--ordered .tzbd-hub-card--wide .tzbd-card__body {
  max-width:72%;
}

.tzbd-hub--ordered .tzbd-hub-card--wide .tzbd-card__body strong {
  font-size:clamp(30px,3.7vw,44px);
}

.tzbd-hub--ordered .tzbd-hub-card .tzbd-card__body small {
  font-size:15px;
  line-height:1.48;
}

.tzbd-hub--ordered .tzbd-card__mode-mark {
  display:grid;
  place-items:center;
  width:100%;
  height:100%;
  color:#fff;
  font-size:13px;
  line-height:1;
  font-weight:950;
  letter-spacing:.03em;
}

.tzbd-hub-howto {
  margin-top:22px;
  display:grid;
  grid-template-columns:54px minmax(0,1fr) auto;
  gap:16px;
  align-items:center;
  padding:20px 22px;
  border:1px solid #cad4df;
  border-radius:16px;
  color:#fff !important;
  text-decoration:none !important;
  background:linear-gradient(135deg,#36465a,#63758c);
  box-shadow:0 8px 24px rgba(18,35,63,.11);
  transition:transform .18s ease,box-shadow .18s ease;
}

.tzbd-hub-howto:hover {
  transform:translateY(-3px);
  box-shadow:0 14px 30px rgba(18,35,63,.18);
}

.tzbd-hub-howto__icon {
  display:grid;
  place-items:center;
  width:54px;
  height:54px;
  border:1px solid rgba(255,255,255,.32);
  border-radius:14px;
  background:rgba(255,255,255,.14);
}

.tzbd-hub-howto__icon svg {
  width:28px;
  height:28px;
}

.tzbd-hub-howto strong,
.tzbd-hub-howto small {
  display:block;
}

.tzbd-hub-howto strong {
  font-size:21px;
  line-height:1.2;
}

.tzbd-hub-howto small {
  margin-top:4px;
  color:rgba(255,255,255,.84);
  font-size:14px;
  line-height:1.45;
}

.tzbd-hub-howto > b {
  font-size:28px;
}

.tzbd-hub--ordered .tzbd-hub__note {
  margin-top:22px;
}

@media (max-width:680px) {
  .tzbd-hub--ordered .tzbd-hub__grid {
    grid-template-columns:1fr;
  }
  .tzbd-hub--ordered .tzbd-hub__grid > .tzbd-hub-card,
  .tzbd-hub--ordered .tzbd-hub__grid > .tzbd-hub-card--wide {
    grid-column:1;
    min-height:205px;
    padding:22px;
  }
  .tzbd-hub--ordered .tzbd-hub__grid > .tzbd-hub-card--primary,
  .tzbd-hub--ordered .tzbd-hub__grid > .tzbd-hub-card--places {
    min-height:235px;
  }
  .tzbd-hub--ordered .tzbd-hub-card .tzbd-card__body,
  .tzbd-hub--ordered .tzbd-hub-card--wide .tzbd-card__body {
    max-width:100%;
  }
  .tzbd-hub--ordered .tzbd-hub-card--wide .tzbd-card__body strong {
    font-size:clamp(25px,8vw,34px);
  }
  .tzbd-hub-howto {
    grid-template-columns:48px minmax(0,1fr) auto;
    padding:18px;
  }
  .tzbd-hub-howto__icon {
    width:48px;
    height:48px;
  }
}



/* v0.15.21 – visual correction only: hub title, hero, airport cards and boat times */
.tzbd-page--hub h1.post-title,
.tzbd-page--hub h1.entry-title,
.tzbd-page--hub .entry-header h1,
.tzbd-page--hub .page-title h1,
.tzbd-page--hub h1.page-title {
  display:block;
  width:100%;
  margin:0 0 26px !important;
  padding:22px 28px !important;
  border:0 !important;
  border-radius:17px;
  color:#fff !important;
  background:
    radial-gradient(circle at 88% 18%,rgba(242,182,50,.26),transparent 24%),
    linear-gradient(135deg,#10213b 0%,#173d69 62%,#1769aa 100%);
  box-shadow:0 12px 30px rgba(18,35,63,.15);
  font-size:clamp(30px,4.2vw,46px) !important;
  line-height:1.14 !important;
  letter-spacing:-.025em;
}

.tzbd-hub--ordered .tzbd-hub__hero {
  grid-template-columns:1fr;
  gap:20px;
  align-items:start;
  padding:30px 34px;
}

.tzbd-hub--ordered .tzbd-hub__hero > div:first-child {
  max-width:100%;
}

.tzbd-hub--ordered .tzbd-hub__hero h2 {
  max-width:none;
  font-size:clamp(34px,4.4vw,48px);
  line-height:1.08;
}

.tzbd-hub--ordered .tzbd-hub__hero p {
  max-width:760px;
  font-size:16px;
  line-height:1.55;
}

.tzbd-hub--ordered .tzbd-hero__status {
  width:100%;
  max-width:560px;
  justify-self:start;
  padding:16px 18px;
}

.tzbd-airport-guides {
  grid-auto-rows:1fr;
}

.tzbd-airport-guide {
  height:100%;
}

.tzbd-airport-guide__head {
  height:100%;
  min-height:116px;
}

.tzbd-airport-guide ol {
  min-height:300px;
}

.tzbd-airport-guide__tip {
  min-height:92px;
  display:flex;
  align-items:flex-start;
}

.tzbd-saen-grid__time strong {
  display:block !important;
  white-space:nowrap !important;
  word-break:keep-all !important;
  overflow-wrap:normal !important;
  hyphens:none !important;
}

.tzbd-saen-grid__approx {
  display:block !important;
  margin-top:4px;
}

@media (max-width:980px) {
  .tzbd-airport-guide__head,
  .tzbd-airport-guide ol,
  .tzbd-airport-guide__tip {
    min-height:0;
  }
}

@media (max-width:680px) {
  .tzbd-page--hub h1.post-title,
  .tzbd-page--hub h1.entry-title,
  .tzbd-page--hub .entry-header h1,
  .tzbd-page--hub .page-title h1,
  .tzbd-page--hub h1.page-title {
    padding:18px 20px !important;
    margin-bottom:20px !important;
    font-size:clamp(27px,8vw,36px) !important;
  }

  .tzbd-hub--ordered .tzbd-hub__hero {
    gap:16px;
    padding:24px 22px;
  }

  .tzbd-hub--ordered .tzbd-hub__hero h2 {
    font-size:clamp(30px,9vw,40px);
  }
}

/* v0.15.22 – only the hub: compact title/planner and exact section colours */
.tzbd-page--hub h1.post-title,
.tzbd-page--hub h1.entry-title,
.tzbd-page--hub .entry-header h1,
.tzbd-page--hub .page-title h1,
.tzbd-page--hub h1.page-title {
  margin:0 0 22px !important;
  padding:17px 22px !important;
  border:1px solid #d8e2ec !important;
  border-left:6px solid #f2b632 !important;
  border-radius:13px;
  color:#172033 !important;
  background:linear-gradient(135deg,#f7f9fc 0%,#e8f0f7 100%);
  box-shadow:0 7px 18px rgba(18,35,63,.08);
  font-size:clamp(27px,3.1vw,36px) !important;
  line-height:1.14 !important;
  letter-spacing:-.018em;
}

.tzbd-hub--ordered .tzbd-hub__grid > .tzbd-hub-card--primary {
  min-height:220px;
  padding:25px 28px;
}

.tzbd-hub--ordered .tzbd-hub-card--primary .tzbd-card__body strong {
  font-size:clamp(28px,3.3vw,38px);
}

/* Keep the card colours identical to the introductory panel of each section. */
.tzbd-hub--ordered .tzbd-card--planner .tzbd-card__pattern {
  background:linear-gradient(135deg,#0d5878 0%,#1769aa 48%,#5b3f91 100%);
}
.tzbd-hub--ordered .tzbd-card--bts .tzbd-card__pattern {
  background:linear-gradient(135deg,#173c66,#1769aa);
}
.tzbd-hub--ordered .tzbd-card--mrt .tzbd-card__pattern {
  background:linear-gradient(135deg,#123f78 0%,#175d9d 52%,#65429a 100%);
}
.tzbd-hub--ordered .tzbd-card--boats .tzbd-card__pattern {
  background:linear-gradient(135deg,#064d68 0%,#087f8d 55%,#22a499 100%);
}
.tzbd-hub--ordered .tzbd-card--buses .tzbd-card__pattern {
  background:linear-gradient(135deg,#7c2f0c,#ba5718 52%,#df852e);
}
.tzbd-hub--ordered .tzbd-card--airports .tzbd-card__pattern {
  background:linear-gradient(135deg,#006c7b 0%,#168c91 45%,#a82c3a 100%);
}
.tzbd-hub--ordered .tzbd-card--times .tzbd-card__pattern {
  background:linear-gradient(135deg,#162d52 0%,#245a92 52%,#514487 100%);
}
.tzbd-hub--ordered .tzbd-card--places .tzbd-card__pattern {
  background:linear-gradient(135deg,#0f4b66 0%,#176b83 45%,#8b4d7d 100%);
}
.tzbd-hub--ordered .tzbd-card--map .tzbd-card__pattern {
  background:linear-gradient(135deg,#15334f 0%,#176b83 52%,#5b4389 100%);
}
.tzbd-hub--ordered .tzbd-card--tickets .tzbd-card__pattern {
  background:linear-gradient(135deg,#6e4005 0%,#bb6f10 50%,#1769aa 100%);
}

/* The former very dark overlay changed orange to brown; keep only enough contrast for text. */
.tzbd-hub--ordered .tzbd-hub-card::after {
  background:linear-gradient(180deg,rgba(5,18,37,.02),rgba(5,18,37,.46));
}

@media (max-width:680px) {
  .tzbd-page--hub h1.post-title,
  .tzbd-page--hub h1.entry-title,
  .tzbd-page--hub .entry-header h1,
  .tzbd-page--hub .page-title h1,
  .tzbd-page--hub h1.page-title {
    padding:15px 17px !important;
    margin-bottom:18px !important;
    font-size:clamp(25px,7.5vw,32px) !important;
  }

  .tzbd-hub--ordered .tzbd-hub__grid > .tzbd-hub-card--primary {
    min-height:195px;
    padding:21px;
  }

  .tzbd-hub--ordered .tzbd-hub-card--primary .tzbd-card__body strong {
    font-size:clamp(26px,8vw,33px);
  }
}