:root {
  --pt-bg: #f5f0e6;
  --pt-paper: #fffdf8;
  --pt-navy: #172b4d;
  --pt-navy-soft: #314566;
  --pt-gold: #b8912f;
  --pt-gold-soft: #d8bf7b;
  --pt-gold-text: #765812;
  --pt-line: rgba(23, 43, 77, 0.17);
  --pt-muted: #6f706c;
}

body.public-transit-page {
  margin: 0;
  color: var(--pt-navy);
  background:
    radial-gradient(circle at 12% 2%, rgba(184, 145, 47, 0.12), transparent 28rem),
    var(--pt-bg);
  font-family: -apple-system, BlinkMacSystemFont, "Hiragino Kaku Gothic ProN", "Yu Gothic", sans-serif;
}

.public-transit-header {
  width: min(1180px, calc(100% - 48px));
  min-height: 74px;
  margin: 0 auto;
  display: flex;
  align-items: center;
  justify-content: space-between;
  border-bottom: 1px solid var(--pt-line);
}

.public-transit-brand {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  color: var(--pt-navy);
  font-family: Georgia, "Yu Mincho", serif;
  font-size: 1.05rem;
  font-weight: 700;
  letter-spacing: 0.12em;
  text-decoration: none;
}

.public-transit-header-link {
  min-height: 44px;
  padding: 0 18px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  color: var(--pt-navy);
  border: 1px solid var(--pt-navy);
  border-radius: 999px;
  font-size: 0.82rem;
  font-weight: 700;
  text-decoration: none;
}

.public-transit-main {
  width: min(1120px, calc(100% - 48px));
  margin: 0 auto;
  padding: 78px 0 90px;
}

.public-transit-intro {
  max-width: 720px;
  margin: 0 auto 42px;
  text-align: center;
}

.public-transit-eyebrow,
.public-transit-panel-heading > p,
.public-transit-cta > div > p,
.public-transit-share > p:first-child {
  margin: 0 0 12px;
  color: var(--pt-gold);
  font-family: Georgia, serif;
  font-size: 0.72rem;
  font-weight: 700;
  letter-spacing: 0.2em;
}

.public-transit-intro h1 {
  margin: 0;
  font-family: Georgia, "Yu Mincho", "Hiragino Mincho ProN", serif;
  font-size: clamp(2.8rem, 7vw, 5.2rem);
  font-weight: 500;
  letter-spacing: 0.08em;
  line-height: 1.08;
}

.public-transit-subtitle {
  margin: 12px 0 24px;
  color: var(--pt-gold);
  font-family: Georgia, "Yu Mincho", serif;
  font-size: 1rem;
  font-weight: 700;
  letter-spacing: 0.18em;
}

.public-transit-lead,
.public-transit-boundary {
  margin: 0 auto;
  color: var(--pt-navy-soft);
  font-size: 0.96rem;
  line-height: 1.9;
}

.public-transit-boundary {
  margin-top: 4px;
  color: var(--pt-muted);
  font-size: 0.82rem;
}

.public-transit-time {
  margin-top: 20px;
  display: inline-block;
  color: var(--pt-navy);
  font-family: Georgia, serif;
  font-size: 0.82rem;
  letter-spacing: 0.08em;
}

.public-transit-summary {
  display: flex;
  gap: 14px;
  margin-bottom: 28px;
}

.public-transit-summary-card {
  min-width: 0;
  flex: 1 1 0;
  padding: 24px 26px;
  background: rgba(255, 253, 248, 0.78);
  border: 1px solid var(--pt-line);
  border-radius: 18px;
}

.public-transit-summary-card-primary {
  border-color: rgba(184, 145, 47, 0.62);
  box-shadow: inset 0 3px 0 var(--pt-gold);
}

.public-transit-summary-card p {
  margin: 0 0 9px;
  color: var(--pt-muted);
  font-size: 0.78rem;
  font-weight: 700;
  letter-spacing: 0.1em;
}

.public-transit-summary-card strong {
  display: block;
  color: var(--pt-navy);
  font-family: Georgia, "Yu Mincho", serif;
  font-size: clamp(1.8rem, 4vw, 2.5rem);
  font-weight: 500;
  font-variant-numeric: tabular-nums;
}

.public-transit-summary-card small {
  margin-top: 7px;
  display: block;
  color: var(--pt-muted);
  font-size: 0.72rem;
}

.public-transit-switch-card strong {
  font-size: clamp(1.15rem, 2.7vw, 1.65rem);
  line-height: 1.45;
}

.public-transit-status {
  min-height: 104px;
  padding: 40px 20px;
  color: var(--pt-muted);
  text-align: center;
}

.public-transit-status::after {
  content: "";
  width: 1.1em;
  height: 1.1em;
  margin-left: 10px;
  display: inline-block;
  vertical-align: -0.18em;
  border: 2px solid rgba(184, 145, 47, 0.28);
  border-top-color: var(--pt-gold);
  border-radius: 50%;
  animation: pt-spin 0.9s linear infinite;
}

@keyframes pt-spin { to { transform: rotate(360deg); } }

.public-transit-error {
  margin: 26px 0;
  padding: 42px 24px;
  background: var(--pt-paper);
  border: 1px solid rgba(138, 62, 49, 0.28);
  border-radius: 18px;
  text-align: center;
}

.public-transit-error h2 { margin: 0 0 10px; font-family: Georgia, "Yu Mincho", serif; }
.public-transit-error p { margin: 0 0 20px; color: var(--pt-muted); }
.public-transit-error button {
  min-width: 128px;
  min-height: 44px;
  color: #fff;
  background: var(--pt-navy);
  border: 0;
  border-radius: 999px;
  font-weight: 700;
  cursor: pointer;
}

.public-transit-chart {
  display: flex;
  gap: 22px;
  align-items: stretch;
}

.public-transit-panel {
  min-width: 0;
  padding: 32px;
  background: var(--pt-paper);
  border: 1px solid var(--pt-line);
  border-radius: 22px;
  box-shadow: 0 16px 50px rgba(23, 43, 77, 0.06);
}

.public-transit-graph-panel { flex: 1.2 1 0; }
.public-transit-activation-panel { flex: 1.1 1 0; }

.public-transit-panel-heading {
  position: relative;
  padding-bottom: 18px;
  border-bottom: 1px solid var(--pt-line);
}

.public-transit-panel-heading > p { margin-bottom: 7px; }
.public-transit-panel-heading h2 {
  margin: 0;
  font-family: Georgia, "Yu Mincho", serif;
  font-size: 1.35rem;
  font-weight: 500;
}
.public-transit-panel-heading > span {
  position: absolute;
  right: 0;
  bottom: 20px;
  color: var(--pt-muted);
  font-size: 0.72rem;
}

.public-transit-bodygraph {
  min-height: 540px;
  display: flex;
  align-items: center;
  justify-content: center;
}

.public-transit-bodygraph svg {
  width: 100%;
  height: auto;
  max-height: 620px;
  display: block;
}

#public-transit-bodygraph .center-defined > path {
  fill: #c4a265 !important;
}

.public-transit-legend {
  margin: 5px 0 0;
  color: var(--pt-muted);
  font-size: 0.76rem;
  text-align: center;
}

.public-transit-legend i {
  width: 10px;
  height: 10px;
  margin-right: 7px;
  display: inline-block;
  background: var(--pt-gold);
  border-radius: 50%;
}

.public-transit-activations {
  margin: 0;
  padding: 0;
  list-style: none;
}

.public-transit-activation-headings {
  min-height: 34px;
  display: grid;
  grid-template-columns: 36px minmax(68px, 1fr) 62px minmax(146px, auto);
  align-items: end;
  color: var(--pt-muted);
  border-bottom: 1px solid rgba(23, 43, 77, 0.11);
  font-size: 0.67rem;
  letter-spacing: 0.05em;
}

.public-transit-activation-headings span:first-child { grid-column: 1 / 3; padding-left: 8px; }
.public-transit-activation-headings span:nth-child(2) { text-align: right; }
.public-transit-activation-headings span:nth-child(3) { padding-left: 14px; }

.public-transit-activation-row {
  min-height: 46px;
  display: grid;
  grid-template-columns: 36px minmax(68px, 1fr) 62px minmax(146px, auto);
  align-items: center;
  border-bottom: 1px solid rgba(23, 43, 77, 0.09);
}

.public-transit-activation-row:last-child { border-bottom: 0; }
.public-transit-activation-symbol {
  color: var(--pt-gold);
  font-family: Georgia, serif;
  font-size: 1.05rem;
  text-align: center;
}
.public-transit-activation-name { color: var(--pt-navy-soft); font-size: 0.82rem; }
.public-transit-activation-value {
  color: var(--pt-navy);
  font-family: Georgia, serif;
  font-size: 1rem;
  font-variant-numeric: tabular-nums;
  text-align: right;
}
.public-transit-activation-next {
  min-width: 0;
  padding-left: 14px;
  color: var(--pt-gold-text);
  font-size: 0.7rem;
  font-variant-numeric: tabular-nums;
  line-height: 1.35;
  white-space: nowrap;
}
.public-transit-activation-next-label { color: var(--pt-muted); }
.public-transit-activation-next strong {
  color: var(--pt-navy-soft);
  font-family: Georgia, serif;
  font-size: 0.78rem;
}
.public-transit-activation-row[data-switch-state="error"] .public-transit-activation-next {
  color: var(--pt-muted);
}
.public-transit-activation-note {
  margin: 14px 0 0;
  color: var(--pt-muted);
  font-size: 0.67rem;
  line-height: 1.65;
}

.public-transit-cta {
  margin-top: 26px;
  padding: 40px 42px;
  display: flex;
  gap: 28px;
  align-items: center;
  justify-content: space-between;
  color: #fff;
  background: var(--pt-navy);
  border-radius: 22px;
}

.public-transit-cta > div:first-child { max-width: 620px; }
.public-transit-cta > div > p { margin-bottom: 8px; }
.public-transit-cta h2 {
  margin: 0 0 9px;
  font-family: Georgia, "Yu Mincho", serif;
  font-size: clamp(1.45rem, 3vw, 2rem);
  font-weight: 500;
}
.public-transit-cta span { color: rgba(255, 255, 255, 0.72); font-size: 0.84rem; line-height: 1.7; }
.public-transit-actions { min-width: 248px; display: flex; flex-direction: column; gap: 10px; }
.public-transit-button {
  min-height: 48px;
  padding: 0 20px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border: 1px solid transparent;
  border-radius: 999px;
  font-size: 0.82rem;
  font-weight: 700;
  text-align: center;
  text-decoration: none;
}
.public-transit-button-primary { color: var(--pt-navy); background: var(--pt-gold-soft); }
.public-transit-button-secondary { color: #fff; border-color: rgba(255, 255, 255, 0.48); }

.public-transit-share {
  padding: 34px 0 8px;
  text-align: center;
}

.public-transit-share-buttons {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  justify-content: center;
}

.public-transit-share-buttons button {
  min-height: 44px;
  padding: 0 16px;
  color: var(--pt-navy-soft);
  background: transparent;
  border: 1px solid var(--pt-line);
  border-radius: 999px;
  font-size: 0.78rem;
  font-weight: 700;
  cursor: pointer;
}

.public-transit-share-status { min-height: 1.5em; margin: 12px 0 0; color: var(--pt-muted); font-size: 0.75rem; }
.public-transit-page [hidden] { display: none !important; }

.public-transit-page a:focus-visible,
.public-transit-page button:focus-visible {
  outline: 3px solid rgba(184, 145, 47, 0.58);
  outline-offset: 3px;
}

@media (hover: hover) {
  .public-transit-header-link:hover,
  .public-transit-button:hover,
  .public-transit-share-buttons button:hover { transform: translateY(-1px); }
}

@media (max-width: 780px) {
  .public-transit-header,
  .public-transit-main { width: min(100% - 30px, 680px); }
  .public-transit-main { padding-top: 52px; }
  .public-transit-summary { flex-wrap: wrap; }
  .public-transit-summary-card { flex-basis: calc(50% - 56px); }
  .public-transit-switch-card { flex-basis: 100%; }
  .public-transit-chart { display: block; }
  .public-transit-panel + .public-transit-panel { margin-top: 18px; }
  .public-transit-cta { display: block; }
  .public-transit-actions { margin-top: 24px; }
}

@media (max-width: 520px) {
  .public-transit-header { min-height: 64px; }
  .public-transit-brand span { display: none; }
  .public-transit-header-link { padding: 0 14px; font-size: 0.75rem; }
  .public-transit-main { padding-top: 42px; padding-bottom: 70px; }
  .public-transit-intro { margin-bottom: 30px; }
  .public-transit-lead { font-size: 0.88rem; }
  .public-transit-boundary { margin-top: 8px; line-height: 1.7; }
  .public-transit-summary { display: block; }
  .public-transit-summary-card { padding: 20px 22px; }
  .public-transit-summary-card + .public-transit-summary-card { margin-top: 10px; }
  .public-transit-panel { padding: 24px 18px; border-radius: 18px; }
  .public-transit-bodygraph { min-height: 430px; }
  .public-transit-panel-heading > span { position: static; margin-top: 6px; display: block; }
  .public-transit-activation-headings { display: none; }
  .public-transit-activations { margin-top: 10px; }
  .public-transit-activation-row {
    min-height: 58px;
    padding: 7px 0;
    grid-template-columns: 36px 1fr auto;
  }
  .public-transit-activation-value { padding-right: 3px; }
  .public-transit-activation-next {
    padding: 3px 3px 0 0;
    grid-column: 2 / 4;
    white-space: normal;
  }
  .public-transit-cta { padding: 32px 24px; border-radius: 18px; }
  .public-transit-share-buttons button { flex: 1 1 calc(50% - 8px); }
}

@media (prefers-reduced-motion: reduce) {
  .public-transit-status::after { animation: none; }
  .public-transit-page * { scroll-behavior: auto !important; transition: none !important; }
}