
@layer tokens, base, layout, components, pages;
@layer tokens {
  :root {
    color-scheme: light dark;
    --bg: light-dark(#ffffff, #0d1117);
    --bg-subtle: light-dark(#f6f7f9, #11161e);
    --bg-sunken: light-dark(#eef0f3, #0a0d12);
    --surface: light-dark(#ffffff, #151b24);
    --surface-hover: light-dark(#f4f6f8, #1b222d);
    --border: light-dark(#e2e5e9, #252e3b);
    --border-strong: light-dark(#cbd1d8, #364154);
    --text: light-dark(#0e1116, #e8edf3);
    --text-2: light-dark(#454d5a, #b3bdca);
    --text-3: light-dark(#636c7a, #8794a6);
    --accent: light-dark(#0a62c4, #5ba4ff);
    --accent-hover: light-dark(#0850a3, #85bbff);
    --accent-soft: light-dark(#e9f2fd, #142539);
    --on-accent: light-dark(#ffffff, #06111f);
    --good: light-dark(#13773a, #4ade80);
    --good-soft: light-dark(#e6f5eb, #0f2a1b);
    --warn: light-dark(#9a5700, #fbbf24);
    --warn-soft: light-dark(#fff4dc, #2e230b);
    --bad: light-dark(#c42b1c, #ff8a7a);
    --bad-soft: light-dark(#fdecea, #34150f);
    --live: light-dark(#16a34a, #4ade80);
    --heat-0: light-dark(#1e9a4c, #3ecf7a);
    --heat-1: light-dark(#b07c00, #f2c230);
    --heat-2: light-dark(#e2650d, #ff8c3a);
    --heat-3: light-dark(#d0261f, #ff5a52);
    --heat-none: light-dark(#abb1b5, #3b3c37);
    --map-land: light-dark(#eef1ee, #0f1620);
    --map-water: light-dark(#cfe0ee, #0b2236);
    --map-ink: light-dark(#d7dce2, #222b38);
    --shadow-1: 0 1px 2px light-dark(rgb(15 23 42 / 0.06), rgb(0 0 0 / 0.4));
    --shadow-2: 0 12px 32px light-dark(rgb(15 23 42 / 0.14), rgb(0 0 0 / 0.5)),
      0 2px 8px light-dark(rgb(15 23 42 / 0.08), rgb(0 0 0 / 0.3));
    --ring: 0 0 0 3px color-mix(in srgb, var(--accent) 40%, transparent);
    --font: ui-sans-serif, system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
    --fs-xs: 0.75rem;
    --fs-s: 0.875rem;
    --fs-m: 1rem;
    --fs-l: 1.125rem;
    --fs-xl: 1.375rem;
    --fs-2xl: clamp(1.5rem, 1.2rem + 1.2vw, 1.875rem);
    --fs-3xl: clamp(1.875rem, 1.4rem + 2.2vw, 2.75rem);
    --r-s: 6px;
    --r-m: 10px;
    --r-l: 16px;
    --r-full: 999px;
    --gutter: 16px;
    --page: 1200px;
    --header-h: 60px;
    --ease: cubic-bezier(0.2, 0.8, 0.2, 1);
  }
  :root[data-theme="light"] { color-scheme: light; }
  :root[data-theme="dark"] { color-scheme: dark; }
  @media (min-width: 768px) {
    :root { --gutter: 24px; --header-h: 64px; }
  }
}
@layer base {
  *, *::before, *::after { box-sizing: border-box; }
  html {
    background: var(--bg);
    color: var(--text);
    font-family: var(--font);
    font-size: 100%;
    line-height: 1.5;
    -webkit-text-size-adjust: 100%;
    text-size-adjust: 100%;
    scroll-padding-top: calc(var(--header-h) + 64px);
  }
  body {
    margin: 0;
    min-height: 100dvh;
    background: var(--bg);
    -webkit-font-smoothing: antialiased;
    -webkit-tap-highlight-color: transparent;
  }
  h1, h2, h3, p, ul, ol, dl, dd, figure { margin: 0; }
  h1, h2, h3 { line-height: 1.15; letter-spacing: -0.015em; text-wrap: balance; font-weight: 700; }
  ul[role="list"], ol[role="list"] { list-style: none; padding: 0; }
  img, svg { display: block; max-width: 100%; }
  button, input, select { font: inherit; color: inherit; }
  button { cursor: pointer; }
  a { color: var(--accent); text-underline-offset: 0.18em; }
  a:hover { color: var(--accent-hover); }
  :focus-visible { outline: none; box-shadow: var(--ring); }
  [hidden] { display: none !important; }
  .num, time { font-variant-numeric: tabular-nums; }
  .sr-only {
    position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px;
    overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0;
  }
  @media (prefers-reduced-motion: reduce) {
    *, *::before, *::after { animation: none !important; transition: none !important; scroll-behavior: auto !important; }
  }
}
@layer layout {
  .wrap { width: min(100% - 2 * var(--gutter), var(--page)); margin-inline: auto; }
  .stack { display: grid; gap: var(--gap, 16px); }
  .cluster { display: flex; flex-wrap: wrap; align-items: center; gap: var(--gap, 8px); }
  .section { padding-block: 40px; }
  .section + .section { border-top: 1px solid var(--border); }
  @media (min-width: 768px) { .section { padding-block: 56px; } }
  .skip-link {
    position: absolute; left: 12px; top: -48px; z-index: 100;
    padding: 8px 12px; border-radius: var(--r-s);
    background: var(--accent); color: var(--on-accent); font-weight: 600;
  }
  .skip-link:focus { top: 12px; }
}
@layer components {
  .icon { width: 20px; height: 20px; flex: none; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
  .icon--s { width: 16px; height: 16px; }
  .icon--xs { width: 13px; height: 13px; stroke-width: 2.5; }
  .brand { display: inline-flex; align-items: center; gap: 10px; color: var(--text); text-decoration: none; font-weight: 700; letter-spacing: -0.01em; }
  .brand:hover { color: var(--text); }
  .brand__mark { width: 30px; height: 30px; }
  .brand__name { font-size: 1.0625rem; white-space: nowrap; }
  .site-header {
    position: sticky; top: 0; z-index: 40;
    background: color-mix(in srgb, var(--bg) 88%, transparent);
    backdrop-filter: saturate(1.6) blur(14px);
    -webkit-backdrop-filter: saturate(1.6) blur(14px);
    border-bottom: 1px solid var(--border);
  }
  .site-header__inner { display: flex; align-items: center; gap: 24px; height: var(--header-h); }
  .site-nav { display: none; gap: 4px; }
  .site-nav a {
    padding: 8px 12px; border-radius: var(--r-full);
    color: var(--text-2); font-size: var(--fs-s); font-weight: 600; text-decoration: none;
  }
  .site-nav a:hover { color: var(--text); background: var(--surface-hover); }
  .site-nav a[aria-current="page"] { color: var(--text); background: var(--bg-sunken); }
  .site-header__actions { margin-left: auto; display: flex; align-items: center; gap: 8px; }
  @media (min-width: 840px) { .site-nav { display: flex; } .menu { display: none; } }
  @media (max-width: 420px) { .site-header__inner { gap: 12px; } .site-header__actions { gap: 4px; } }
  @media (max-width: 374px) { .site-header .brand__name { display: none; } }
  .btn {
    display: inline-flex; align-items: center; justify-content: center; gap: 8px;
    min-height: 40px; padding: 0 16px; border-radius: var(--r-full);
    border: 1px solid var(--border-strong); background: var(--surface); color: var(--text);
    font-size: var(--fs-s); font-weight: 600; text-decoration: none; white-space: nowrap;
    transition: background-color 0.15s var(--ease), border-color 0.15s var(--ease), color 0.15s var(--ease);
  }
  .btn:hover { background: var(--surface-hover); color: var(--text); }
  .btn--primary { background: var(--accent); border-color: var(--accent); color: var(--on-accent); }
  .btn--primary:hover { background: var(--accent-hover); border-color: var(--accent-hover); color: var(--on-accent); }
  .btn--ghost { border-color: transparent; background: transparent; }
  .btn--icon { width: 40px; padding: 0; }
  .btn--l { min-height: 48px; padding: 0 22px; font-size: var(--fs-m); }
  .btn--l.btn--icon { width: 48px; padding: 0; }
  .btn--block { width: 100%; }
  .btn[aria-pressed="true"] { color: var(--accent); border-color: color-mix(in srgb, var(--accent) 45%, var(--border)); background: var(--accent-soft); }
  .btn[aria-pressed="true"] .icon { fill: currentColor; }
  @media (pointer: coarse) { .btn { min-height: 44px; } .btn--icon { width: 44px; } }
  @media (max-width: 479px) {
    .btn:not(.btn--icon) { white-space: normal; text-align: center; line-height: 1.25; padding-block: 8px; }
  }
  .search-trigger {
    display: inline-flex; align-items: center; gap: 10px;
    min-height: 40px; padding: 0 12px; border-radius: var(--r-full);
    border: 1px solid var(--border); background: var(--bg-subtle); color: var(--text-3);
    font-size: var(--fs-s); text-align: left;
  }
  .search-trigger:hover { border-color: var(--border-strong); color: var(--text-2); }
  .search-trigger__label { display: none; }
  .search-trigger--wide { width: 100%; }
  .search-trigger--wide .search-trigger__label { display: inline; }
  .search-trigger--hero {
    width: 100%; min-height: 58px; padding: 0 10px 0 18px; border-radius: var(--r-l);
    background: var(--surface); border: 1px solid var(--border-strong);
    box-shadow: var(--shadow-1); font-size: var(--fs-m); color: var(--text-3);
  }
  .search-trigger--hero .search-trigger__label { display: inline; flex: 1; }
  .search-trigger--hero:hover { border-color: var(--accent); }
  kbd {
    display: inline-grid; place-items: center; min-width: 22px; height: 22px; padding: 0 6px;
    border: 1px solid var(--border); border-radius: 5px; background: var(--surface);
    color: var(--text-3); font: 600 0.6875rem/1 var(--font);
  }
  .search-trigger kbd { margin-left: auto; }
  @media (min-width: 640px) { .search-trigger { min-width: 220px; } .search-trigger__label { display: inline; } }
  @media (pointer: coarse) { .search-trigger kbd { display: none; } }
  .badge {
    --c: var(--text-2); --t: #fff;
    display: inline-flex; align-items: center; justify-content: center;
    min-width: 28px; height: 22px; padding: 0 6px; border-radius: var(--r-s);
    background: var(--c); color: var(--t);
    font-size: 0.75rem; font-weight: 750; letter-spacing: 0.01em; line-height: 1;
    white-space: nowrap; flex: none;
  }
  .badge--m { min-width: 40px; height: 28px; padding: 0 8px; font-size: 0.875rem; border-radius: 7px; }
  .badge--l { min-width: 56px; height: 44px; padding: 0 12px; font-size: 1.25rem; border-radius: var(--r-m); }
  .badge--dot { min-width: 10px; width: 10px; height: 10px; padding: 0; border-radius: 50%; }
  .status {
    --status-icon: url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'><circle cx='8' cy='8' r='4'/></svg>");
    display: inline-flex; align-items: center; gap: 6px;
    font-size: var(--fs-s); font-weight: 600; color: var(--text-2); white-space: nowrap;
  }
  .status::before {
    content: ""; width: 1em; height: 1em; flex: none; background: currentColor;
    -webkit-mask: var(--status-icon) center / contain no-repeat; mask: var(--status-icon) center / contain no-repeat;
  }
  .status--good {
    --status-icon: url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'><mask id='m'><rect width='16' height='16' fill='white'/><path d='M4.7 8.2l2.2 2.2 4.4-4.6' fill='none' stroke='black' stroke-width='1.9' stroke-linecap='round' stroke-linejoin='round'/></mask><circle cx='8' cy='8' r='7.5' mask='url(%23m)'/></svg>");
    color: var(--good);
  }
  .status--warn {
    --status-icon: url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'><mask id='m'><rect width='16' height='16' fill='white'/><path d='M8 5.7v3.4' stroke='black' stroke-width='1.9' stroke-linecap='round'/><circle cx='8' cy='11.7' r='1.05' fill='black'/></mask><path d='M6.6 1.9a1.6 1.6 0 0 1 2.8 0l6.1 10.8a1.6 1.6 0 0 1-1.4 2.4H1.9a1.6 1.6 0 0 1-1.4-2.4z' mask='url(%23m)'/></svg>");
    color: var(--warn);
  }
  .status--bad {
    --status-icon: url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'><mask id='m'><rect width='16' height='16' fill='white'/><path d='M5.7 5.7l4.6 4.6M10.3 5.7l-4.6 4.6' stroke='black' stroke-width='1.9' stroke-linecap='round'/></mask><path d='M5.1.6h5.8l4.5 4.5v5.8l-4.5 4.5H5.1L.6 10.9V5.1z' mask='url(%23m)'/></svg>");
    color: var(--bad);
  }
  .status--idle {
    --status-icon: url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'><circle cx='8' cy='8' r='6.6' fill='none' stroke='black' stroke-width='1.8'/><path d='M5.3 8h5.4' stroke='black' stroke-width='1.8' stroke-linecap='round'/></svg>");
    color: var(--text-3);
  }
  .live { display: inline-flex; align-items: center; gap: 6px; font-size: var(--fs-xs); font-weight: 600; color: var(--text-2); white-space: nowrap; }
  .live__dot { position: relative; width: 8px; height: 8px; border-radius: 50%; background: var(--live); }
  .live__dot::after {
    content: ""; position: absolute; inset: -4px; border-radius: 50%;
    border: 2px solid var(--live); opacity: 0; animation: live-ping 2s var(--ease) infinite;
  }
  @keyframes live-ping { 0% { transform: scale(0.4); opacity: 0.7; } 100% { transform: scale(1.4); opacity: 0; } }
  .chips { display: flex; gap: 8px; overflow-x: auto; scrollbar-width: none; padding-block: 2px; }
  .chips::-webkit-scrollbar { display: none; }
  .chip {
    display: inline-flex; align-items: center; gap: 8px; flex: none;
    min-height: 36px; padding: 0 12px 0 6px; border-radius: var(--r-full);
    border: 1px solid var(--border); background: var(--surface);
    color: var(--text); font-size: var(--fs-s); font-weight: 600; text-decoration: none;
  }
  .chip:hover { border-color: var(--border-strong); background: var(--surface-hover); color: var(--text); }
  .chip--plain { padding-inline: 14px; }
  .chip[aria-pressed="true"] { background: var(--text); border-color: var(--text); color: var(--bg); }
  .chip .badge { height: 24px; border-radius: var(--r-full); }
  @media (pointer: coarse) { .chip { min-height: 40px; } }
  .facts { display: flex; flex-wrap: wrap; gap: 8px; }
  .fact {
    display: inline-flex; align-items: center; gap: 6px;
    min-height: 32px; padding: 0 12px; border-radius: var(--r-full);
    background: var(--bg-sunken); color: var(--text-2); font-size: var(--fs-s); font-weight: 600;
  }
  .fact .icon { color: var(--text-3); }
  .fact.status { padding-left: 12px; background: var(--good-soft); }
  .fact.status--warn { background: var(--warn-soft); }
  .fact.status--bad { background: var(--bad-soft); }
  .fact.status--idle { background: var(--bg-sunken); }
  .segmented {
    display: inline-grid; grid-auto-flow: column; grid-auto-columns: 1fr;
    padding: 3px; border-radius: var(--r-full); background: var(--bg-sunken);
    width: 100%; max-width: 560px;
  }
  .segmented button {
    min-height: 36px; padding: 0 12px; border: 0; border-radius: var(--r-full);
    background: transparent; color: var(--text-2); font-size: var(--fs-s); font-weight: 600;
    overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
  }
  .segmented button[aria-selected="true"], .segmented button[aria-pressed="true"] {
    background: var(--surface); color: var(--text); box-shadow: var(--shadow-1);
  }
  .segmented--radio { margin: 0; border: 0; min-width: 0; }
  .segmented--radio label {
    display: block; text-align: center; line-height: 36px; min-height: 36px; padding: 0 12px; border-radius: var(--r-full);
    color: var(--text-2); font-size: var(--fs-s); font-weight: 600; cursor: pointer;
    overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
  }
  .segmented--radio input:checked + label { background: var(--surface); color: var(--text); box-shadow: var(--shadow-1); }
  .segmented--radio input:focus-visible + label { box-shadow: var(--ring); }
  @media (pointer: coarse) { .segmented button, .segmented--radio label { min-height: 40px; } }
  .card { border: 1px solid var(--border); border-radius: var(--r-l); background: var(--surface); }
  .card__head { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 16px 20px 0; }
  .card__title { font-size: var(--fs-m); font-weight: 700; }
  .card__body { padding: 12px 20px 20px; }
  .card__foot { padding: 12px 20px; border-top: 1px solid var(--border); }
  .section-head { display: flex; align-items: end; justify-content: space-between; gap: 16px; margin-bottom: 20px; }
  .section-head h2 { font-size: var(--fs-2xl); }
  .section-head p { margin-top: 6px; color: var(--text-2); max-width: 60ch; }
  .link-arrow { display: inline-flex; align-items: center; gap: 4px; font-size: var(--fs-s); font-weight: 600; text-decoration: none; white-space: nowrap; }
  @media (max-width: 479px) { .link-arrow { white-space: normal; } .section-head { flex-wrap: wrap; align-items: start; } }
  .link-arrow:hover { text-decoration: underline; }
  .rows { list-style: none; margin: 0; padding: 0; }
  .row {
    display: flex; align-items: center; gap: 12px;
    min-height: 56px; padding: 8px 20px;
    color: var(--text); text-decoration: none;
  }
  .rows > li + li > .row, .rows > li + li > .row-static { border-top: 1px solid var(--border); }
  a.row:hover, button.row:hover { background: var(--surface-hover); color: var(--text); }
  button.row { width: 100%; border: 0; background: transparent; text-align: left; }
  .row__main { flex: 1; min-width: 0; }
  .row__title { display: block; font-weight: 600; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
  .row__meta { display: block; color: var(--text-3); font-size: var(--fs-s); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
  .row__title .row__meta { display: inline; font-weight: 500; }
  .row__end { display: flex; align-items: center; gap: 12px; flex: none; color: var(--text-3); font-size: var(--fs-s); }
  .row__end .icon { color: var(--text-3); }
  .row-static { display: flex; gap: 12px; padding: 14px 20px; }
  .row > .badge--m { min-width: 52px; }
  .alert-kind {
    display: grid; place-items: center; width: 32px; height: 32px; border-radius: var(--r-m); flex: none;
    background: var(--warn-soft); color: var(--warn);
  }
  .alert-kind--closure { background: var(--bad-soft); color: var(--bad); }
  .alert-kind--notice, .alert-kind--stop { background: var(--accent-soft); color: var(--accent); }
  .alert-text { min-width: 0; flex: 1; }
  .alert-text strong { display: block; font-weight: 600; }
  .alert-text p { color: var(--text-2); font-size: var(--fs-s); display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
  .alert-text .cluster { margin-top: 8px; --gap: 6px; }
  .callout { display: flex; gap: 12px; align-items: flex-start; padding: 14px 16px; border-radius: var(--r-m); background: var(--good-soft); color: var(--good); font-weight: 600; font-size: var(--fs-s); }
  .callout p { color: var(--text-2); font-weight: 400; margin-top: 2px; }
  .callout--info { background: var(--accent-soft); color: var(--accent); }
  .callout--info span { color: var(--text-2); font-weight: 500; }
  .card__lede { padding-bottom: 4px; color: var(--text-2); font-size: var(--fs-s); }
  .board-foot { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 12px; margin-top: 16px; color: var(--text-2); font-size: var(--fs-s); }
  .board-foot .icon { color: var(--text-3); }
  .board-foot .link-arrow { margin-left: auto; }
  .kv { display: grid; gap: 0; }
  .kv div { display: flex; justify-content: space-between; gap: 12px; padding: 10px 0; border-top: 1px solid var(--border); font-size: var(--fs-s); }
  .kv div:first-child { border-top: 0; padding-top: 0; }
  .kv dt { color: var(--text-2); }
  .kv dd { font-weight: 600; text-align: right; }
  .faq { border-top: 1px solid var(--border); }
  .faq details { border-bottom: 1px solid var(--border); }
  .faq summary {
    display: flex; justify-content: space-between; align-items: center; gap: 16px;
    padding: 16px 0; font-weight: 600; cursor: pointer; list-style: none;
  }
  .faq summary::-webkit-details-marker { display: none; }
  .faq summary .icon { color: var(--text-3); transition: transform 0.2s var(--ease); }
  .faq details[open] summary .icon { transform: rotate(180deg); }
  .faq p { padding: 0 0 16px; color: var(--text-2); max-width: 70ch; }
  .menu { position: relative; }
  .menu > summary { list-style: none; }
  .menu > summary::-webkit-details-marker { display: none; }
  .menu__panel {
    position: absolute; right: 0; top: calc(100% + 8px); z-index: 50;
    display: grid; min-width: 220px; padding: 8px;
    border: 1px solid var(--border); border-radius: var(--r-l); background: var(--surface); box-shadow: var(--shadow-2);
  }
  .menu__panel a { padding: 10px 12px; border-radius: var(--r-m); color: var(--text); text-decoration: none; font-weight: 600; }
  .menu__panel a:hover { background: var(--surface-hover); }
  .search {
    width: min(100% - 24px, 640px); max-height: min(78dvh, 640px);
    margin: 10dvh auto auto; padding: 0;
    border: 1px solid var(--border); border-radius: var(--r-l);
    background: var(--surface); color: var(--text); box-shadow: var(--shadow-2);
    overflow: hidden;
  }
  .search[open] { display: flex; flex-direction: column; }
  .search::backdrop { background: rgb(8 12 18 / 0.45); backdrop-filter: blur(2px); }
  .search__bar { display: flex; align-items: center; gap: 10px; padding: 8px 8px 8px 16px; border-bottom: 1px solid var(--border); }
  .search__bar .icon { color: var(--text-3); }
  .search__bar input { flex: 1; min-width: 0; height: 44px; border: 0; background: transparent; font-size: var(--fs-l); outline: none; }
  .search__bar input::-webkit-search-cancel-button { display: none; }
  .search__body { overflow-y: auto; padding: 8px; }
  .search__group { padding: 10px 12px 6px; color: var(--text-3); font-size: var(--fs-xs); font-weight: 700; letter-spacing: 0.04em; text-transform: uppercase; }
  .search__item { display: flex; align-items: center; gap: 12px; min-height: 48px; padding: 6px 12px; border-radius: var(--r-m); color: var(--text); text-decoration: none; }
  .search__item[aria-selected="true"], .search__item:hover { background: var(--surface-hover); color: var(--text); }
  .search__item small { color: var(--text-3); margin-left: auto; font-size: var(--fs-xs); white-space: nowrap; }
  .search__empty { padding: 24px 12px; color: var(--text-3); text-align: center; }
  @media (max-width: 639px) { .search { margin-top: 12px; max-height: calc(100dvh - 24px); } }
  [data-theme-toggle] .icon { display: none; }
  :root:not([data-theme]) [data-theme-toggle] .i-system,
  :root[data-theme="light"] [data-theme-toggle] .i-light,
  :root[data-theme="dark"] [data-theme-toggle] .i-dark { display: block; }
  .site-footer { border-top: 1px solid var(--border); background: var(--bg-subtle); padding-block: 40px 32px; color: var(--text-2); font-size: var(--fs-s); }
  .site-footer__grid { display: grid; gap: 28px; grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .site-footer__about { grid-column: 1 / -1; max-width: 42ch; }
  .site-footer__about p { margin-top: 10px; }
  .site-footer h2 { font-size: var(--fs-xs); text-transform: uppercase; letter-spacing: 0.06em; color: var(--text-3); margin-bottom: 10px; }
  .site-footer ul { list-style: none; padding: 0; display: grid; gap: 8px; }
  .site-footer a { color: var(--text-2); text-decoration: none; }
  .site-footer a:hover { color: var(--text); text-decoration: underline; }
  .site-footer__prefs { grid-column: 1 / -1; }
  @media (min-width: 768px) {
    .site-footer__grid { grid-template-columns: repeat(3, minmax(0, 1fr)) minmax(0, 1.4fr); }
    .site-footer__prefs { grid-column: auto; }
  }
  @media (min-width: 1100px) {
    .site-footer__grid { grid-template-columns: 2fr repeat(3, 1fr) 1.4fr; }
    .site-footer__about { grid-column: auto; }
  }
  .pref-toggle {
    position: relative; display: flex; align-items: center; gap: 8px; width: 100%; min-height: 32px;
    padding: 0 46px 0 0; border: 0; border-radius: var(--r-s); background: none;
    color: var(--text-2); font-size: var(--fs-s); text-align: left;
  }
  .pref-toggle .icon { color: var(--text-3); }
  .pref-toggle:hover { color: var(--text); }
  .pref-toggle::before, .pref-toggle::after { content: ""; position: absolute; top: 50%; transition: transform 0.15s var(--ease), background-color 0.15s var(--ease); }
  .pref-toggle::before { right: 0; width: 34px; height: 20px; margin-top: -10px; border-radius: var(--r-full); background: var(--text-3); }
  .pref-toggle::after { right: 17px; width: 14px; height: 14px; margin-top: -7px; border-radius: 50%; background: var(--surface); }
  .pref-toggle[aria-pressed="true"] { color: var(--text); }
  .pref-toggle[aria-pressed="true"]::before { background: var(--accent); }
  .pref-toggle[aria-pressed="true"]::after { transform: translateX(14px); background: var(--on-accent); }
  .site-nav .nav-railfan { display: none; }
  @media (min-width: 1100px) { :root[data-railfan] .site-nav .nav-railfan { display: block; } }
  .proto-note { display: inline-flex; align-items: center; gap: 6px; padding: 2px 10px; border-radius: var(--r-full); background: var(--warn-soft); color: var(--warn); font-size: var(--fs-xs); font-weight: 700; }
  .net-svg { width: 100%; height: 100%; }
  .net-svg .net-bg { fill: var(--map-land); }
  .net-svg .net-grid { stroke: var(--map-ink); stroke-width: 1; }
  .net-svg .net-line { fill: none; stroke-linecap: round; stroke-linejoin: round; }
  .net-svg .net-station { fill: var(--surface); stroke: var(--text-2); }
  .net-svg .net-bus { fill: var(--text-3); opacity: 0.5; }
  .net-svg .net-veh { stroke: var(--surface); stroke-width: 2.5; }
  .net-svg .net-place {
    fill: var(--text-2); font: 600 19px/1 var(--font); letter-spacing: 0.02em;
    paint-order: stroke; stroke: var(--map-land); stroke-width: 5px; stroke-linejoin: round;
  }
  .net-svg .net-label rect { fill: var(--c); stroke: var(--map-land); stroke-width: 3px; }
  .net-svg .net-label text { fill: var(--t); font: 750 19px/1 var(--font); letter-spacing: 0.01em; }
  .net-svg .net-label--wide { display: none; }
  @media (min-width: 960px) {
    .net-svg .net-label--wide { display: inline; }
    .net-svg .net-label--narrow { display: none; }
  }
}
@layer pages {
  .hero { padding-block: 28px 40px; }
  .hero__grid { display: grid; gap: 28px; align-items: start; }
  .hero__lede { display: grid; gap: 16px; }
  .hero__lede { min-width: 0; }
  .hero__lede > .live { flex-wrap: wrap; row-gap: 2px; white-space: normal; }
  .hero h1 { font-size: var(--fs-3xl); letter-spacing: -0.025em; }
  .hero h1 span { color: var(--text-3); }
  .hero__sub { color: var(--text-2); font-size: var(--fs-l); max-width: 46ch; }
  .hero__actions { display: flex; flex-wrap: wrap; gap: 10px; }
  @media (min-width: 960px) {
    .hero { padding-block: 48px 56px; }
    .hero__grid { grid-template-columns: minmax(0, 1.1fr) minmax(0, 1fr); gap: 56px; align-items: center; }
    .hero .chips { flex-wrap: wrap; overflow: visible; }
    .hero .preview { aspect-ratio: 1 / 1; max-height: 560px; }
  }
  .preview { position: relative; display: block; overflow: hidden; border-radius: var(--r-l); border: 1px solid var(--border); aspect-ratio: 4 / 3; background: var(--map-land); color: var(--text); text-decoration: none; }
  .preview:hover { color: var(--text); border-color: var(--border-strong); }
  .preview__overlay { position: absolute; inset: auto 12px 12px 12px; display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 10px 10px 10px 14px; border-radius: var(--r-m); background: color-mix(in srgb, var(--surface) 96%, transparent); box-shadow: var(--shadow-1); }
  .preview__overlay strong { display: block; font-size: var(--fs-m); }
  .preview__overlay .live { margin-top: 2px; }
  .preview__badge { position: absolute; top: 12px; left: 12px; }
  .board { display: grid; gap: 1px; background: var(--border); border: 1px solid var(--border); border-radius: var(--r-l); overflow: hidden; }
  .board__item { display: flex; align-items: center; gap: 12px; min-height: 64px; padding: 12px 16px; background: var(--surface); color: var(--text); text-decoration: none; }
  .board__item:hover { background: var(--surface-hover); color: var(--text); }
  .board__item .row__main { display: grid; gap: 2px; }
  .board__item .row__title { white-space: normal; line-height: 1.25; }
  .board__count { color: var(--text-3); font-size: var(--fs-s); white-space: nowrap; }
  @media (min-width: 640px) { .board { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
  @media (min-width: 1024px) { .board { grid-template-columns: repeat(4, minmax(0, 1fr)); } }
  .split { display: grid; gap: 24px; }
  @media (min-width: 960px) { .split { grid-template-columns: minmax(0, 1.7fr) minmax(0, 1fr); align-items: start; } }
  .tiles { display: grid; gap: 12px; grid-template-columns: repeat(auto-fill, minmax(min(100%, 150px), 1fr)); }
  @media (min-width: 960px) { .tiles { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
  @media (min-width: 1180px) { .tiles { grid-template-columns: repeat(6, minmax(0, 1fr)); } }
  .tile { display: grid; gap: 12px; align-content: start; padding: 18px; border: 1px solid var(--border); border-radius: var(--r-l); background: var(--surface); color: var(--text); text-decoration: none; }
  .tile:hover { border-color: var(--border-strong); background: var(--surface-hover); color: var(--text); }
  .tile__badges { display: flex; gap: 6px; flex-wrap: wrap; }
  .tile strong { font-size: var(--fs-l); }
  .tile p { color: var(--text-2); font-size: var(--fs-s); }
  .prose { display: grid; gap: 14px; color: var(--text-2); max-width: 68ch; }
  .prose h2 { color: var(--text); font-size: var(--fs-xl); }
  .empty { display: grid; justify-items: start; gap: 10px; padding: 20px; color: var(--text-2); font-size: var(--fs-s); }
  .empty .icon { color: var(--text-3); }
  .crumbs { display: flex; flex-wrap: wrap; gap: 6px; align-items: center; color: var(--text-3); font-size: var(--fs-s); }
  .crumbs a { color: var(--text-2); text-decoration: none; }
  .crumbs a:hover { color: var(--text); text-decoration: underline; }
  .route-head { padding-block: 20px 20px; display: grid; gap: 16px; }
  .route-head__top { display: flex; gap: 16px; align-items: center; }
  .route-head h1 { font-size: var(--fs-3xl); letter-spacing: -0.025em; }
  .route-head__sub { color: var(--text-2); }
  .route-head__terminals { color: var(--text); font-weight: 600; }
  .route-head__actions { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; }
  @media (min-width: 960px) {
    .route-head { grid-template-columns: minmax(0, 1fr) auto; align-items: end; padding-block: 32px 24px; }
    .route-head__actions { justify-content: flex-end; }
  }
  .route-bar {
    position: sticky; top: var(--header-h); z-index: 30;
    background: color-mix(in srgb, var(--bg) 92%, transparent);
    backdrop-filter: blur(12px); -webkit-backdrop-filter: blur(12px);
    border-block: 1px solid var(--border);
  }
  .route-bar__inner { display: flex; align-items: center; gap: 16px; min-height: 60px; }
  .route-bar .live { margin-left: auto; }
  @media (max-width: 639px) { .route-bar .live { display: none; } }
  .route-layout { display: grid; gap: 24px; padding-block: 24px 48px; }
  @media (min-width: 1024px) {
    .route-layout { grid-template-columns: minmax(0, 1fr) 360px; gap: 40px; align-items: start; }
    .route-aside { position: sticky; top: calc(var(--header-h) + 76px); }
  }
  .route-aside { display: grid; gap: 16px; }
  .route-main, .route-aside, .route-aside > * { min-width: 0; }
  @media (max-width: 420px) {
    :lang(es) .route-head__actions [data-favorite] { width: 48px; padding: 0; }
    :lang(es) .route-head__actions [data-favorite] span { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
  }
  .diagram { --row: 64px; --x: 28px; list-style: none; margin: 0; padding: 0; position: relative; }
  .diagram__row { position: relative; height: var(--row); }
  .diagram__row::before, .diagram__row::after {
    content: ""; position: absolute; left: calc(var(--x) - 3px); width: 6px;
    background: var(--line); transition: background-color 0.2s var(--ease);
  }
  .diagram__row::before { top: 0; height: 50%; }
  .diagram__row::after { top: 50%; bottom: 0; }
  .diagram__row:first-child::before, .diagram__row:last-child::after { display: none; }
  .diagram__row.in-gap::before, .diagram__row.out-gap::after {
    background: repeating-linear-gradient(to bottom, var(--warn) 0 7px, transparent 7px 12px);
  }
  .diagram__row.in-bunch::before, .diagram__row.out-bunch::after { left: calc(var(--x) - 5px); width: 10px; border-radius: 2px; background: var(--warn); }
  :is(.route-page:has(#heat-toggle:checked), .show-heat) .diagram__row:is(.in-heat-0)::before,
  :is(.route-page:has(#heat-toggle:checked), .show-heat) .diagram__row:is(.out-heat-0)::after { background: var(--heat-0); }
  :is(.route-page:has(#heat-toggle:checked), .show-heat) .diagram__row:is(.in-heat-1)::before,
  :is(.route-page:has(#heat-toggle:checked), .show-heat) .diagram__row:is(.out-heat-1)::after { background: var(--heat-1); }
  :is(.route-page:has(#heat-toggle:checked), .show-heat) .diagram__row:is(.in-heat-2)::before,
  :is(.route-page:has(#heat-toggle:checked), .show-heat) .diagram__row:is(.out-heat-2)::after { background: var(--heat-2); }
  :is(.route-page:has(#heat-toggle:checked), .show-heat) .diagram__row:is(.in-heat-3)::before,
  :is(.route-page:has(#heat-toggle:checked), .show-heat) .diagram__row:is(.out-heat-3)::after { background: var(--heat-3); }
  :is(.route-page:has(#heat-toggle:checked), .show-heat) .diagram__row:is(.in-heat-none)::before,
  :is(.route-page:has(#heat-toggle:checked), .show-heat) .diagram__row:is(.out-heat-none)::after { background: var(--heat-none); }
  :is(.route-page:has(#heat-toggle:checked), .show-heat) .diagram__node { border-color: var(--text-2); }
  .diagram__link {
    display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: center; gap: 0 12px;
    height: 100%; margin-left: 52px; padding: 0 12px; border-radius: var(--r-m);
    color: var(--text); text-decoration: none;
  }
  .diagram__link:hover { background: var(--surface-hover); color: var(--text); }
  .route-page .diagram[data-index="1"],
  .route-page:has(#dir-1:checked) .diagram[data-index="0"] { display: none; }
  .route-page:has(#dir-1:checked) .diagram[data-index="1"] { display: block; }
  .diagram__node {
    position: absolute; left: var(--x); top: 50%; z-index: 1;
    width: 14px; height: 14px; border-radius: 50%;
    background: var(--bg); border: 3px solid var(--line); transform: translate(-50%, -50%);
  }
  .diagram__row--transfer .diagram__node { width: 16px; height: 16px; border: 2.5px solid var(--text); box-shadow: 0 0 0 2px var(--bg); }
  .diagram__row--end .diagram__node { width: 20px; height: 20px; background: var(--line); border-color: var(--bg); box-shadow: 0 0 0 2px var(--line); }
  .diagram__name { display: grid; gap: 3px; min-width: 0; }
  .diagram__name strong { font-weight: 600; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
  .diagram__meta { display: flex; align-items: center; gap: 4px; color: var(--text-3); font-size: var(--fs-xs); white-space: nowrap; overflow: hidden; }
  .diagram__meta .badge { height: 18px; min-width: 22px; padding: 0 5px; font-size: 0.6875rem; border-radius: 5px; }
  .diagram__meta span + span { margin-left: 4px; }
  .diagram__train {
    position: absolute; z-index: 2; left: var(--x);
    top: calc(50% - (1 - var(--p)) * var(--row));
    display: grid; place-items: center; width: 28px; height: 28px; border-radius: 50%;
    background: var(--line); color: var(--line-ink, #fff); border: 2.5px solid var(--bg);
    box-shadow: 0 2px 8px rgb(0 0 0 / 0.25);
    transform: translate(-50%, -50%);
  }
  .diagram__train .icon { width: 14px; height: 14px; stroke-width: 2.4; }
  .diagram__train:hover, .diagram__train:focus-visible { outline: none; box-shadow: 0 0 0 3px color-mix(in srgb, var(--line) 35%, transparent); }
  .diagram__tip {
    position: absolute; left: calc(100% + 8px); top: 50%; transform: translateY(-50%);
    padding: 4px 8px; border-radius: var(--r-s); background: var(--text); color: var(--bg);
    font-size: var(--fs-xs); font-weight: 600; white-space: nowrap; opacity: 0; pointer-events: none;
    transition: opacity 0.15s var(--ease);
  }
  .diagram__train:hover .diagram__tip, .diagram__train:focus .diagram__tip { opacity: 1; }
  a.diagram__train { text-decoration: none; transition: top 1s linear, box-shadow 0.15s var(--ease); }
  a.diagram__train:hover { color: var(--line-ink, #fff); }
  .diagram__ghost {
    position: absolute; z-index: 1; left: var(--x);
    top: calc(50% - (1 - var(--p)) * var(--row));
    display: grid; place-items: center; width: 26px; height: 26px; border-radius: 50%;
    border: 2px dashed var(--text-3); background: var(--bg); color: var(--text-3);
    transform: translate(-50%, -50%); cursor: help;
  }
  .diagram__ghost .icon { width: 13px; height: 13px; }
  .diagram__flag, .diagram__alert {
    display: inline-flex; align-items: center; gap: 4px; height: 18px; padding: 0 6px; border-radius: 5px;
    font-size: 0.6875rem; font-weight: 700; white-space: nowrap;
  }
  .diagram__flag { background: var(--warn-soft); color: var(--warn); cursor: help; }
  .diagram__alert { background: var(--bad-soft); color: var(--bad); }
  .diagram__meta .diagram__flag + span, .diagram__meta span + .diagram__flag { margin-left: 2px; }
  .stale-banner, .preview-banner {
    display: flex; gap: 10px; align-items: flex-start; margin-bottom: 12px; padding: 10px 14px;
    border-radius: var(--r-m); font-size: var(--fs-s);
  }
  .stale-banner { display: none; background: var(--warn-soft); color: var(--warn); }
  html.is-stale .stale-banner { display: flex; }
  html.is-stale .eta__first.is-live { color: var(--text-3); }
  .preview-banner { background: var(--accent-soft); color: var(--accent); }
  .stale-banner span, .preview-banner span { color: var(--text-2); }
  .stale-banner strong, .preview-banner strong { color: inherit; }
  .anomalies { display: flex; flex-wrap: wrap; gap: 8px; list-style: none; margin: 0 0 12px; padding: 0; }
  .anomalies:empty { display: none; }
  .anomaly { display: inline-flex; align-items: center; gap: 6px; padding: 4px 10px; border-radius: var(--r-full); background: var(--warn-soft); color: var(--warn); font-size: var(--fs-s); font-weight: 600; }
  .anomaly span { color: var(--text-2); font-weight: 500; }
  .anomaly--ghost { background: var(--bg-sunken); color: var(--text-2); }
  .heat-legend { display: none; flex-wrap: wrap; align-items: center; gap: 8px 16px; margin-top: 10px; color: var(--text-3); font-size: var(--fs-xs); }
  :is(.route-page:has(#heat-toggle:checked), .show-heat) .heat-legend { display: flex; }
  .heat-scale { display: inline-flex; align-items: center; gap: 6px; }
  .heat-scale i { display: inline-block; width: 18px; height: 6px; border-radius: 3px; margin-left: 4px; }
  .heat-0 { background: var(--heat-0); } .heat-1 { background: var(--heat-1); } .heat-2 { background: var(--heat-2); }
  .heat-3 { background: var(--heat-3); } .heat-none { background: var(--heat-none); }
  .chip--toggle { cursor: pointer; gap: 6px; }
  .chip--toggle:has(input:checked) { background: var(--text); border-color: var(--text); color: var(--bg); }
  .chip--toggle:has(input:focus-visible) { box-shadow: var(--ring); }
  .legend .is-ghost { color: var(--text-2); }
  @media (max-width: 639px) {
    .route-bar .chip__label { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
    .route-bar .chip--toggle { padding: 0 11px; }
    .route-bar .dir-to { display: none; }
    .route-bar__inner { gap: 10px; }
  }
  .eta { display: grid; justify-items: end; gap: 1px; text-align: right; font-variant-numeric: tabular-nums; white-space: nowrap; }
  .eta__first { display: inline-flex; align-items: center; gap: 4px; font-weight: 700; font-size: var(--fs-m); color: var(--text); }
  .eta__first.is-live { color: var(--good); }
  .eta__first.is-sched { color: var(--text-3); font-weight: 600; }
  .eta__first.is-ghost { color: var(--text-3); font-weight: 600; cursor: help; }
  .eta__note { color: var(--warn); font-size: var(--fs-xs); font-weight: 700; }
  .eta__next { color: var(--text-3); font-size: var(--fs-xs); }
  .eta__none { color: var(--text-3); font-size: var(--fs-s); }
  .legend { display: flex; flex-wrap: wrap; gap: 6px 16px; margin-top: 12px; color: var(--text-3); font-size: var(--fs-xs); }
  .legend span { display: inline-flex; align-items: center; gap: 6px; }
  .legend .is-live { color: var(--good); font-weight: 700; }
  .legend i { display: inline-block; width: 12px; height: 12px; border-radius: 50%; border: 2.5px solid var(--text); background: var(--bg); }
  .trains .row { padding-inline: 20px; }
  .train-dot { display: grid; place-items: center; width: 28px; height: 28px; border-radius: 50%; background: var(--line, var(--text-2)); color: var(--line-ink, #fff); flex: none; }
  .train-dot .icon { width: 14px; height: 14px; }
  .mini-map { display: block; aspect-ratio: 16 / 11; border-radius: var(--r-m); overflow: hidden; background: var(--map-land); }
  .mini-map:hover { outline: 2px solid var(--border-strong); outline-offset: 2px; }
  .periods { display: grid; gap: 0; }
  .periods div { display: grid; grid-template-columns: 1fr auto; gap: 12px; padding: 10px 0; border-top: 1px solid var(--border); font-size: var(--fs-s); }
  .periods div:first-child { border-top: 0; padding-top: 0; }
  .periods dt { color: var(--text-2); }
  .periods dd { font-weight: 600; }
  .tt-controls { display: flex; flex-wrap: wrap; gap: 12px; align-items: end; margin-bottom: 16px; }
  .field { display: grid; gap: 6px; font-size: var(--fs-s); font-weight: 600; color: var(--text-2); }
  .field select {
    min-height: 44px; min-width: 240px; padding: 0 40px 0 14px; border-radius: var(--r-m);
    border: 1px solid var(--border-strong); background: var(--surface); color: var(--text);
    appearance: none;
    background-image: linear-gradient(45deg, transparent 50%, var(--text-3) 50%), linear-gradient(135deg, var(--text-3) 50%, transparent 50%);
    background-position: calc(100% - 20px) 50%, calc(100% - 15px) 50%;
    background-size: 5px 5px; background-repeat: no-repeat;
  }
  .hours { border: 1px solid var(--border); border-radius: var(--r-l); overflow: hidden; }
  @media (min-width: 900px) {
    .hours { columns: 2; column-gap: 0; column-rule: 1px solid var(--border); }
    .hours__row { break-inside: avoid; }
  }
  .hours__row { display: grid; grid-template-columns: 76px 1fr; border-top: 1px solid var(--border); }
  .hours__row:first-child { border-top: 0; }
  .hours__h { padding: 10px 14px; background: var(--bg-subtle); color: var(--text-2); font-size: var(--fs-s); font-weight: 700; font-variant-numeric: tabular-nums; }
  .hours__m { display: flex; flex-wrap: wrap; gap: 4px 14px; padding: 10px 14px; font-variant-numeric: tabular-nums; }
  .hours__row.is-past { color: var(--text-3); }
  .hours__row.is-now .hours__h { background: var(--accent-soft); color: var(--accent); }
  .hours__m .is-next { color: var(--accent); font-weight: 700; }
  .skeleton { border-radius: var(--r-l); background: linear-gradient(90deg, var(--bg-sunken), var(--bg-subtle), var(--bg-sunken)); background-size: 200% 100%; animation: shimmer 1.4s linear infinite; min-height: 240px; }
  @keyframes shimmer { to { background-position: -200% 0; } }
  .connections { display: grid; gap: 12px; grid-template-columns: repeat(auto-fill, minmax(min(100%, 250px), 1fr)); }
  .app-body { overflow: hidden; height: 100dvh; }
  .app { position: relative; height: 100dvh; display: grid; grid-template-columns: 1fr; }
  .app-map { position: relative; overflow: hidden; background: var(--map-land); }
  .app-map__sketch, .app-map__canvas { position: absolute; inset: 0; }
  .app-map__sketch { transition: opacity 0.4s var(--ease); }
  .app-map.is-ready .app-map__sketch { opacity: 0; pointer-events: none; }
  .app-map__canvas { opacity: 0; transition: opacity 0.4s var(--ease); }
  #map-canvas { width: 100%; height: 100%; }
  .app-map.is-ready .app-map__canvas { opacity: 1; }
  .map-controls { position: absolute; z-index: 5; right: 12px; top: calc(76px + env(safe-area-inset-top)); display: grid; gap: 8px; }
  .map-controls__group { display: grid; border-radius: var(--r-m); background: var(--surface); box-shadow: var(--shadow-2); overflow: hidden; }
  .map-controls__group .btn { border: 0; border-radius: 0; background: var(--surface); }
  .map-controls__group .btn + .btn { border-top: 1px solid var(--border); }
  .map-controls__group .btn:hover { background: var(--surface-hover); }
  .layers {
    position: absolute; z-index: 6; right: 64px; top: calc(76px + env(safe-area-inset-top)); width: 248px; padding: 12px;
    max-height: calc(100dvh - 76px - env(safe-area-inset-top) - var(--peek, 0px) - 24px); overflow-y: auto; overscroll-behavior: contain;
    border-radius: var(--r-l); background: var(--surface); box-shadow: var(--shadow-2); border: 1px solid var(--border);
  }
  .layers h2 { font-size: var(--fs-s); margin: 4px 4px 6px; }
  .layers label { display: flex; align-items: center; gap: 10px; min-height: 36px; padding: 0 6px; border-radius: var(--r-s); font-size: var(--fs-s); font-weight: 600; cursor: pointer; }
  .layers label:hover { background: var(--surface-hover); }
  .layers input { width: 18px; height: 18px; accent-color: var(--accent); margin: 0; }
  .layers label span:last-child { margin-left: auto; color: var(--text-3); font-weight: 500; }
  .map-status {
    position: absolute; z-index: 5; left: 50%; transform: translateX(-50%);
    bottom: calc(var(--peek, 0px) + 12px);
    display: inline-flex; align-items: center; gap: 10px; padding: 6px 12px; white-space: nowrap;
    border-radius: var(--r-full); background: var(--surface); box-shadow: var(--shadow-2); font-size: var(--fs-xs);
    max-width: calc(100% - 24px);
  }
  .map-status > .num { min-width: 0; overflow: hidden; text-overflow: ellipsis; }
  .app-top {
    position: absolute; z-index: 10; left: 12px; right: 12px; top: calc(12px + env(safe-area-inset-top));
    display: flex; gap: 8px; align-items: center;
  }
  .app-top .search-trigger { flex: 1; min-height: 48px; background: var(--surface); border-color: transparent; box-shadow: var(--shadow-2); }
  .app-top .search-trigger__label { display: inline; }
  .app-top .brand-chip { display: grid; place-items: center; width: 48px; height: 48px; border-radius: var(--r-full); background: var(--surface); box-shadow: var(--shadow-2); flex: none; }
  .sheet {
    --peek: 214px;
    position: absolute; z-index: 20; left: 0; right: 0; bottom: 0;
    height: calc(100dvh - 84px - env(safe-area-inset-top));
    display: flex; flex-direction: column;
    background: var(--surface); border-radius: 20px 20px 0 0; box-shadow: 0 -8px 32px light-dark(rgb(15 23 42 / 0.16), rgb(0 0 0 / 0.5));
    transform: translateY(calc(100% - var(--peek)));
    transition: transform 0.32s var(--ease);
    touch-action: none;
  }
  .sheet[data-detent="half"] { transform: translateY(45%); }
  .sheet[data-detent="full"] { transform: translateY(0); }
  .sheet.is-dragging { transition: none; }
  .sheet__view { display: flex; flex-direction: column; flex: 1; min-height: 0; }
  .sheet__grab { position: relative; display: grid; place-items: center; height: 22px; flex: none; cursor: grab; border: 0; background: transparent; width: 100%; padding: 0; }
  .sheet__grab::after { content: ""; position: absolute; inset: -6px 0 -16px; }
  .sheet__grab::before { content: ""; width: 40px; height: 5px; border-radius: 3px; background: var(--border-strong); }
  .sheet__head { display: none; }
  .sheet__tabs { padding: 0 16px 12px; flex: none; }
  .sheet__tabs .segmented { max-width: none; }
  .sheet__body { flex: 1; overflow-y: auto; overscroll-behavior: contain; touch-action: pan-y; padding-bottom: calc(24px + env(safe-area-inset-bottom)); }
  .sheet__foot { display: none; }
  .sheet .rows .row { padding-inline: 16px; }
  .sheet__group { padding: 14px 16px 6px; color: var(--text-3); font-size: var(--fs-xs); font-weight: 700; letter-spacing: 0.04em; text-transform: uppercase; display: flex; justify-content: space-between; }
  .sheet__filters { padding: 0 16px 4px; }
  .sheet__panel-pad { padding: 0 16px; }
  .rv-head { display: flex; align-items: flex-start; gap: 12px; padding: 4px 16px 12px; }
  .rv-head h2 { font-size: var(--fs-xl); }
  .rv-head p { color: var(--text-2); font-size: var(--fs-s); }
  .rv-facts { padding: 0 16px 12px; }
  .rv-dir { padding: 0 16px 8px; }
  .rv-actions { display: flex; gap: 8px; padding: 4px 16px 12px; }
  .rv-actions .btn { flex: 1; }
  .sheet .diagram { --row: 56px; padding: 4px 4px 0; }
  .toast {
    position: absolute; z-index: 30; left: 50%; top: calc(76px + env(safe-area-inset-top)); transform: translateX(-50%);
    max-width: calc(100% - 32px); padding: 10px 14px; border-radius: var(--r-m);
    background: var(--text); color: var(--bg); font-size: var(--fs-s); font-weight: 600; box-shadow: var(--shadow-2);
  }
  .veh-pop { display: flex; gap: 10px; align-items: flex-start; font: 500 var(--fs-s)/1.35 var(--font); color: var(--text); }
  .veh-pop strong { display: block; }
  .veh-pop span:not(.badge) { display: block; color: var(--text-2); font-size: var(--fs-xs); }
  .veh-pop__follow { display: inline-block; margin-top: 6px; font-weight: 700; font-size: var(--fs-s); text-decoration: none; }
  .maplibregl-popup-content { background: var(--surface) !important; border-radius: var(--r-m) !important; box-shadow: var(--shadow-2) !important; padding: 10px 12px !important; }
  .maplibregl-popup-tip { border-top-color: var(--surface) !important; border-bottom-color: var(--surface) !important; }
  .maplibregl-ctrl-attrib { font-size: 10px; }
  @media (max-width: 899px) {
    .app-map { --peek: 214px; }
    .maplibregl-ctrl-bottom-right, .maplibregl-ctrl-bottom-left { bottom: 214px; }
  }
  @media (min-width: 900px) {
    .app { grid-template-columns: 400px 1fr; }
    .toast { top: 16px; }
    .app-top { display: none; }
    .sheet {
      position: relative; grid-column: 1; grid-row: 1; height: 100dvh;
      transform: none !important; border-radius: 0; box-shadow: none;
      border-right: 1px solid var(--border); touch-action: auto;
    }
    .sheet__grab { display: none; }
    .sheet__head { display: flex; align-items: center; gap: 12px; padding: 16px 16px 12px; flex: none; }
    .sheet__head .search-trigger { flex: 1; min-width: 0; }
    .sheet__foot { display: flex; align-items: center; justify-content: space-between; gap: 12px; flex: none; padding: 10px 16px; border-top: 1px solid var(--border); }
    .app-map { grid-column: 2; grid-row: 1; }
    .map-controls, .layers { top: 16px; }
    .layers { max-height: calc(100dvh - 32px); }
    .map-controls { right: 16px; }
    .layers { right: 68px; }
    .map-status { bottom: 16px; }
  }
  .lang-switch { gap: 6px; padding: 0 10px; }
  .lang-switch--icon span, .lang-switch--icon { padding: 0; }
  .lang-switch--icon span { display: none; }
  .sheet__foot .live { flex: 1; min-width: 0; white-space: normal; flex-wrap: wrap; }
  .sheet__foot .cluster { flex: none; flex-wrap: nowrap; }
  @media (max-width: 639px) { .site-header .lang-switch span { display: none; } .site-header .lang-switch { width: 40px; padding: 0; } }
  .layers__note { margin: 6px 6px 2px; color: var(--text-3); font-size: var(--fs-xs); }
  .layers label .icon { color: var(--text-2); }
  .layers__head { margin-top: 14px !important; padding-top: 12px; border-top: 1px solid var(--border); }
  .layers label.layers__opt span:last-child { margin-left: 0; color: inherit; font-weight: 600; display: inline-flex; align-items: center; gap: 8px; }
  .layers label span:first-of-type:not(:last-child) { display: inline-flex; align-items: center; gap: 8px; }
  .heat-key { display: none; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 4px; list-style: none; margin: 8px 6px 2px; padding: 0; color: var(--text-2); font-size: 0.6875rem; font-weight: 600; line-height: 1.2; }
  .layers:has([data-layer="heat"]:checked) .heat-key { display: grid; }
  .layers .heat-note { display: none; }
  .layers:has([data-layer="heat"]:checked) .heat-note { display: block; }
  .heat-key li { display: grid; gap: 4px; align-content: start; }
  .heat-key i { display: block; height: 6px; border-radius: 3px; }
  .rv-heat-legend { margin: 0 16px 8px; }
  .replay {
    position: absolute; z-index: 7; left: 12px; right: 12px; bottom: calc(var(--peek, 0px) + 12px);
    display: flex; align-items: center; gap: 12px; padding: 10px 12px;
    border-radius: var(--r-l); background: var(--surface); box-shadow: var(--shadow-2); border: 1px solid var(--border);
  }
  .replay__track { flex: 1; min-width: 0; display: grid; gap: 4px; }
  .replay__labels { display: flex; align-items: baseline; justify-content: space-between; gap: 8px; color: var(--text-3); font-size: var(--fs-xs); white-space: nowrap; }
  .replay__labels strong { color: var(--text); font-size: var(--fs-l); font-variant-numeric: tabular-nums; }
  .replay input[type="range"] { width: 100%; margin: 0; accent-color: var(--accent); }
  .replay__speed { display: flex; gap: 4px; }
  .replay__speed button { min-height: 32px; padding: 0 8px; border-radius: var(--r-full); border: 1px solid var(--border); background: var(--surface); font-size: var(--fs-xs); font-weight: 700; color: var(--text-2); }
  .replay__speed button[aria-pressed="true"] { background: var(--text); border-color: var(--text); color: var(--bg); }
  [data-replay-play] .i-pause, .replay.is-playing [data-replay-play] .i-play { display: none; }
  .replay.is-playing [data-replay-play] .i-pause { display: block; }
  .app.is-replay .map-status { display: none; }
  .app.is-replay [data-replay-toggle] { color: var(--accent); background: var(--accent-soft); }
  @media (max-width: 639px) { .replay__speed button:not([aria-pressed="true"]) { display: none; } .replay { gap: 8px; } }
  @media (min-width: 900px) { .replay { left: 24px; right: 84px; bottom: 16px; } }
}
@layer pages {
  .site-header .simple-toggle { display: none; }
  @media (min-width: 640px) { .site-header .simple-toggle { display: inline-flex; } }
  [data-simple-toggle][aria-pressed="true"] { color: var(--accent); background: var(--accent-soft); }
  .menu__toggle {
    display: flex; align-items: center; gap: 10px; padding: 10px 12px; border: 0; border-radius: var(--r-m);
    background: transparent; color: var(--text); font-weight: 600; text-align: left;
  }
  .menu__toggle:hover { background: var(--surface-hover); }
  .menu__toggle[aria-pressed="true"]::after { content: "✓"; margin-left: auto; }
  .menu__prefs { display: grid; margin-top: 4px; padding-top: 4px; border-top: 1px solid var(--border); }
  :root[data-simple] { font-size: 118.75%; }
  :root[data-simple] :is(
    .hero__sub, .preview, .board-foot, .legend, .heat-legend, .chip--toggle,
    .diagram__meta, .eta__next, .anomaly span,
    .st-head__lines, .st-row__meta, .st-aside .card:not(:first-child),
    .follow-head__speed, .site-footer__grid nav
  ) { display: none !important; }
  :root[data-simple] .section:not([aria-labelledby="now-title"], .ad-band) { display: none; }
  :root[data-simple] .route-aside > .card:not([aria-labelledby="alerts-title"]) { display: none; }
  :root[data-simple] :is(.board, .route-layout, .st-layout, .st-deps) { grid-template-columns: 1fr; }
  :root[data-simple] .route-aside { position: static; }
  :root[data-simple] .diagram { --row: 76px; }
  :root[data-simple] .eta__first { font-size: var(--fs-xl); }
  :root[data-simple] .st-deps .dep:not(:first-child) { display: none; }
  :root[data-simple] .brand__name { white-space: nowrap; }
  @media (max-width: 460px) { :root[data-simple] .site-header .brand__name { display: none; } }
  .report {
    width: min(100% - 24px, 560px); max-height: min(92dvh, 780px); margin: auto; padding: 0; overflow: auto;
    border: 1px solid var(--border); border-radius: var(--r-l);
    background: var(--surface); color: var(--text); box-shadow: var(--shadow-2);
  }
  .report::backdrop { background: rgb(8 12 18 / 0.45); }
  .report__form { display: grid; gap: 14px; padding: 16px 20px 20px; }
  .report__head { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
  .report__head h2 { font-size: var(--fs-xl); }
  .report__context { color: var(--text-2); font-size: var(--fs-s); font-weight: 600; }
  .report__cats { display: flex; flex-wrap: wrap; gap: 8px; margin: 0; padding: 0; border: 0; min-width: 0; }
  .report__cats legend { margin-bottom: 8px; padding: 0; font-weight: 700; }
  .report__cats .chip { cursor: pointer; }
  .report__cats .chip:has(input:checked) { background: var(--text); border-color: var(--text); color: var(--bg); }
  .report__cats .chip:has(input:focus-visible) { box-shadow: var(--ring); }
  .report__safety { display: grid; gap: 10px; padding: 12px 14px; border-radius: var(--r-m); background: var(--bad-soft); }
  .report__safety p { display: flex; align-items: center; gap: 8px; color: var(--bad); }
  .report__notes textarea {
    min-height: 72px; padding: 10px 12px; border: 1px solid var(--border-strong); border-radius: var(--r-m);
    background: var(--surface); color: var(--text); font: inherit; font-weight: 400; resize: vertical;
  }
  .report__preview { display: grid; gap: 6px; color: var(--text-2); font-size: var(--fs-s); font-weight: 600; }
  .report__preview pre {
    margin: 0; padding: 12px 14px; border-radius: var(--r-m); background: var(--bg-sunken); color: var(--text);
    font: 0.8125rem/1.5 ui-monospace, SFMono-Regular, Menlo, monospace; white-space: pre-wrap;
  }
  .report__actions { display: flex; flex-wrap: wrap; gap: 8px; }
  .report__actions .btn { flex: 1 1 220px; }
  .report__hours, .report__note { color: var(--text-3); font-size: var(--fs-xs); }
  @media (max-width: 639px) {
    .report { width: 100%; max-width: 100%; margin: auto 0 0; border-radius: 20px 20px 0 0; }
  }
}
@media (pointer: coarse) {
  :is(input:not([type="checkbox"], [type="radio"], [type="range"]), select, textarea) { font-size: max(16px, 1em); }
  :is(.crumbs a, .link-arrow) { padding-block: 11px; margin-block: -11px; }
  .site-header .brand { padding: 7px; margin: -7px; }
}
@layer tokens {
  :root { --beta-h: 0px; }
  :root[data-beta-bar] { --beta-h: 2.25rem; }
}
@layer pages {
  .beta-bar {
    display: flex; align-items: center; gap: 12px;
    height: var(--beta-h); padding: 0 max(var(--gutter), (100% - var(--page)) / 2);
    background: var(--bg-subtle); border-bottom: 1px solid var(--border);
    color: var(--text-2); font-size: var(--fs-xs); line-height: 1; white-space: nowrap;
  }
  .beta-bar__text { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; }
  .beta-bar__short { display: none; }
  .beta-bar__tag {
    display: inline-block; padding: 3px 6px; border-radius: var(--r-full);
    background: var(--accent-soft); color: var(--accent);
    font-weight: 700; letter-spacing: 0.04em; text-transform: uppercase; font-size: 0.6875rem;
  }
  .beta-bar__link { flex: none; color: inherit; }
  .beta-bar__link:hover { color: var(--text); }
  .beta-bar__optout {
    flex: none; display: inline-flex; align-items: center; min-height: 1.75rem; padding: 0 10px;
    border: 1px solid var(--border-strong); border-radius: var(--r-s); background: var(--surface);
    color: var(--text); font-weight: 600; text-decoration: none;
  }
  .beta-bar__optout:hover { background: var(--surface-hover); color: var(--text); }
  @media (max-width: 559px) {
    .beta-bar { gap: 8px; }
    .beta-bar__long, .beta-bar__link { display: none; }
    .beta-bar__short { display: inline; }
  }
  html.is-tv .beta-bar { display: none; }
  html.is-tv { --beta-h: 0px; }
  @media print { .beta-bar { display: none; } }
  :root[data-beta-bar] .app-body .beta-bar { height: calc(var(--beta-h) + env(safe-area-inset-top)); padding-top: env(safe-area-inset-top); }
  :root[data-beta-bar] .app { height: calc(100dvh - var(--beta-h) - env(safe-area-inset-top)); }
  :root[data-beta-bar] .app-top { top: 12px; }
  :root[data-beta-bar] :is(.map-controls, .layers, .toast) { top: 76px; }
  :root[data-beta-bar] .layers { max-height: calc(100% - 76px - var(--peek, 0px) - 24px); }
  :root[data-beta-bar] .sheet { height: calc(100% - 84px); }
  @media (min-width: 900px) {
    :root[data-beta-bar] .app { grid-template-rows: minmax(0, 1fr); }
    :root[data-beta-bar] .sheet { height: auto; min-height: 0; }
    :root[data-beta-bar] :is(.map-controls, .layers, .toast) { top: 16px; }
    :root[data-beta-bar] .layers { max-height: calc(100% - 32px); }
  }
}
@layer pages {
  .bb { display: grid; grid-template-columns: minmax(0, 1fr); gap: 32px; padding-block: 20px 56px; }
  .bb__head { display: grid; gap: 10px; }
  .bb__head h1 { font-size: var(--fs-3xl); letter-spacing: -0.025em; }
  .bb__lede { max-width: 62ch; color: var(--text-2); font-size: var(--fs-l); }
  .bb__layout { display: grid; grid-template-columns: minmax(0, 1fr); gap: 20px; }
  @media (min-width: 1000px) {
    .bb__layout { grid-template-columns: 360px minmax(0, 1fr); align-items: start; gap: 28px; }
    .bb__form { position: sticky; top: calc(var(--header-h) + 16px); }
  }
  .bb__step { display: grid; gap: 8px; min-width: 0; }
  .bb__label { color: var(--text-2); font-size: var(--fs-s); font-weight: 700; }
  .bb__hint, .bb__note { color: var(--text-3); font-size: var(--fs-xs); }
  .bb__field {
    display: flex; align-items: center; gap: 8px; min-height: 44px; padding: 0 12px;
    border: 1px solid var(--border-strong); border-radius: var(--r-m); background: var(--surface); color: var(--text-3);
  }
  .bb__field:focus-within { border-color: var(--accent); box-shadow: var(--ring); }
  .bb__field input { flex: 1; min-width: 0; min-height: 42px; border: 0; background: transparent; color: var(--text); outline: none; }
  .bb__field input:focus-visible { box-shadow: none; }
  .bb__field input::-webkit-search-cancel-button { display: none; }
  .bb__input {
    width: 100%; min-height: 44px; padding: 0 12px;
    border: 1px solid var(--border-strong); border-radius: var(--r-m); background: var(--surface); color: var(--text);
  }
  .bb__input::placeholder { color: var(--text-3); }
  .bb__input:focus-visible { border-color: var(--accent); }
  .bb__results:empty { display: none; }
  .bb__results { margin-top: -2px; }
  .bb__results .row-static { padding: 10px 8px; color: var(--text-3); font-size: var(--fs-s); }
  .bb__result { min-height: 48px; padding: 6px 8px; border-radius: var(--r-m); }
  .bb__result > .icon { color: var(--text-3); }
  .bb__result :is(.row__title, .row__meta) { white-space: normal; overflow-wrap: anywhere; }
  .bb__locate { justify-self: start; }
  .bb__locate[aria-busy="true"] { color: var(--text-3); }
  .bb__msg { color: var(--text-2); font-size: var(--fs-s); }
  .bb__msg--warn { padding: 10px 12px; border-radius: var(--r-m); background: var(--warn-soft); color: var(--warn); }
  .bb__picked { display: flex; align-items: center; gap: 10px; padding: 10px 12px; border-radius: var(--r-m); background: var(--bg-sunken); }
  .bb__picked-icon { display: grid; place-items: center; width: 32px; height: 32px; flex: none; border-radius: var(--r-s); background: var(--surface); color: var(--text-2); }
  .bb__picked-text { display: grid; min-width: 0; line-height: 1.3; }
  .bb__picked-label { color: var(--text-3); font-size: var(--fs-xs); font-weight: 700; }
  .bb__picked-text strong { overflow-wrap: anywhere; }
  .bb__picked-meta { color: var(--text-3); font-size: var(--fs-s); }
  .bb__seg { max-width: none; }
  .bb__output { display: grid; grid-template-columns: minmax(0, 1fr); gap: 12px; min-width: 0; }
  .bb__previewhead { display: flex; flex-wrap: wrap; align-items: baseline; justify-content: space-between; gap: 4px 12px; }
  .bb__preview {
    overflow: hidden; border: 1px solid var(--border-strong); border-radius: var(--r-l);
    background: var(--bg); color: var(--text); color-scheme: dark;
  }
  .bb__preview[data-scheme="light"] { color-scheme: light; }
  .bb__preview .lb { aspect-ratio: 16 / 9; }
  @media (max-width: 599px) { .bb__preview .lb { aspect-ratio: 4 / 5; } }
  .bb__preview:fullscreen { width: 100%; height: 100%; border: 0; border-radius: 0; }
  .bb__preview:fullscreen .lb { aspect-ratio: auto; height: 100%; }
  .bb__preview::backdrop { background: #000; }
  .bb__summary { min-height: 1.5em; color: var(--text-2); font-size: var(--fs-s); }
  .bb__actions { display: flex; flex-wrap: wrap; gap: 8px; }
  .bb__linklabel { margin-top: 4px; }
  .bb__url { font: 0.8125rem/1.5 ui-monospace, SFMono-Regular, Menlo, monospace; color: var(--text-2); background: var(--bg-subtle); }
  .bb__notes { color: var(--text-2); max-width: 70ch; }
  .bb__notes h2, .bb__faq h2 { margin-bottom: 10px; color: var(--text); font-size: var(--fs-xl); }
  .bb__notes ol { display: grid; gap: 6px; margin: 0; padding-left: 22px; }
  .bb__faq { max-width: 70ch; }
  .lb { container: lb / inline-size; position: relative; background: var(--bg); color: var(--text); }
  .lb--fit { container-type: size; overflow: hidden; }
  .lb__inner { display: flex; flex-direction: column; gap: 12px; min-height: 100%; padding: 16px; font-size: 15px; }
  .lb--fit .lb__inner {
    height: 100%; gap: 0.6em;
    font-size: clamp(11px, 2.35vmin, 64px); font-size: clamp(11px, 2.35cqmin, 64px);
    padding: 0.9em 1.25em;
  }
  .lb__head { display: flex; align-items: center; gap: 0.75em; padding-bottom: 0.6em; border-bottom: 1px solid var(--border-strong); }
  .lb__pin { display: grid; place-items: center; width: 2.4em; height: 2.4em; flex: none; border-radius: var(--r-m); background: var(--bg-sunken); color: var(--text); }
  .lb__pin .icon { width: 55%; height: 55%; }
  .lb__titles { flex: 1; min-width: 0; }
  .lb__title { margin: 0; font-size: 1.55em; font-weight: 750; line-height: 1.15; letter-spacing: -0.02em; overflow-wrap: anywhere; }
  .lb__sub { color: var(--text-2); font-size: 0.85em; }
  .lb__clock { flex: none; margin-left: auto; font-size: 1.6em; font-weight: 700; letter-spacing: -0.02em; line-height: 1; white-space: nowrap; }
  .lb--fit .lb__title { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
  .lb--fit .lb__clock { font-size: 2.1em; }
  .lb__body { display: flex; flex-direction: column; gap: 0.5em; min-height: 0; }
  .lb--fit .lb__body { flex: 1 1 0; }
  .lb .stale-banner { margin: 0; font-size: 0.8em; }
  .lb__rows { list-style: none; margin: 0; padding: 0; }
  .lb--fit .lb__rows {
    flex: 1 1 0; min-height: 0; overflow: hidden; font-size: calc(var(--scale, 1) * 1em);
    display: grid; grid-template-columns: repeat(var(--cols, 1), minmax(0, 1fr));
    grid-template-rows: repeat(var(--per-col, 1), max-content); grid-auto-flow: column; column-gap: 2.2em; align-content: start;
  }
  .lb__rows:empty { display: none; }
  .lb-row {
    display: grid; grid-template-columns: 3.4em minmax(0, 1fr) auto; align-items: center; column-gap: 0.7em;
    padding: 0.5em 0; border-bottom: 1px solid var(--border);
  }
  .lb-row .badge { justify-self: start; max-width: 100%; height: 1.7em; min-width: 2.6em; padding: 0 0.4em; border-radius: 0.3em; font-size: 0.95em; overflow: hidden; }
  .lb-row__main { display: grid; min-width: 0; }
  .lb-row__to { font-size: 1.25em; font-weight: 700; line-height: 1.2; overflow-wrap: anywhere; }
  .lb-row__where { color: var(--text-3); font-size: 0.78em; line-height: 1.35; overflow-wrap: anywhere; }
  .lb--fit :is(.lb-row__to, .lb-row__where) { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
  .lb-row__times { display: flex; align-items: baseline; justify-content: flex-end; gap: 0.9em; list-style: none; margin: 0; padding: 0; }
  .lb-time {
    display: inline-flex; align-items: center; justify-content: flex-end; gap: 0.25em;
    color: var(--text-2); font-size: 1.05em; font-weight: 650; white-space: nowrap; font-variant-numeric: tabular-nums;
  }
  .lb-time:first-child { color: var(--text); font-size: 1.5em; font-weight: 750; letter-spacing: -0.01em; }
  .lb-time:nth-child(1) { min-width: var(--w1, 0px); }
  .lb-time:nth-child(2) { min-width: var(--w2, 0px); }
  .lb-time:nth-child(3) { min-width: var(--w3, 0px); }
  .lb-time .icon { width: 0.62em; height: 0.62em; }
  .lb-time--live, .lb-time--live:first-child { color: var(--good); }
  .lb-time--sched:first-child, .lb-time--est:first-child { color: var(--text-2); }
  .lb-time--ghost, .lb-time--ghost:first-child { color: var(--text-3); }
  html.is-stale .lb-time--live { color: var(--text-2); }
  @container lb (max-width: 540px) {
    .lb-row { grid-template-columns: 3.4em minmax(0, 1fr); row-gap: 0.2em; }
    .lb-row__times { grid-column: 2; justify-content: flex-start; }
    .lb-time { justify-content: flex-start; }
    .lb-time:first-child { font-size: 1.3em; }
  }
  .lb__msg { color: var(--text-2); font-size: 1.1em; }
  .lb__quiet { display: flex; flex-wrap: wrap; align-items: center; gap: 0.35em 0.45em; color: var(--text-3); font-size: 0.8em; }
  .lb--fit .lb__quiet { flex-wrap: nowrap; overflow: hidden; white-space: nowrap; }
  .lb__quiet .badge { height: 1.5em; min-width: 2.2em; padding: 0 0.35em; border-radius: 0.3em; font-size: 0.9em; }
  .lb__foot {
    display: flex; flex-wrap: wrap; align-items: center; gap: 0.3em 1.3em; padding-top: 0.55em;
    border-top: 1px solid var(--border); color: var(--text-3); font-size: 0.72em;
  }
  .lb--fit .lb__foot { flex-wrap: nowrap; overflow: hidden; white-space: nowrap; }
  .lb__foot .live { font-size: inherit; }
  .lb__more { color: var(--text-2); font-weight: 700; }
  .lb__legend { display: inline-flex; flex-wrap: wrap; gap: 0.3em 1em; }
  .lb__key { display: inline-flex; align-items: center; gap: 0.35em; }
  .lb__key--live { color: var(--good); font-weight: 700; }
  .lb__key .icon { width: 1em; height: 1em; }
  .lb__brand { margin-left: auto; font-weight: 700; }
  html:not(.is-board) .lb-page { display: none; }
  html.is-board, html.is-board body { background: var(--bg); }
  html.is-board :is(.bb, .site-header, .site-footer, .skip-link) { display: none !important; }
  .lb-page .lb--fit { height: 100vh; height: 100dvh; }
  .lb-boot { padding: 24px; color: var(--text-3); }
  .lb-bad { display: grid; justify-items: start; gap: 14px; padding: 40px var(--gutter); }
  .lb-controls { position: fixed; right: 16px; bottom: 16px; z-index: 5; display: flex; gap: 8px; opacity: 0; transition: opacity 0.25s var(--ease); }
  .lb-page.is-awake .lb-controls, .lb-controls:focus-within { opacity: 1; }
  .lb-page--scroll .lb-controls { position: static; justify-content: center; padding: 0 16px 24px; opacity: 1; }
}
@layer pages {
  .cn {
    position: fixed; z-index: 60; left: var(--gutter); right: var(--gutter);
    bottom: max(12px, env(safe-area-inset-bottom));
    display: grid; gap: 8px; max-width: 26rem; margin-inline: auto; padding: 12px 16px 6px;
    border: 1px solid var(--border-strong); border-radius: var(--r-l);
    background: var(--surface); color: var(--text); box-shadow: var(--shadow-2);
  }
  @media (min-width: 640px) { .cn { right: auto; width: 26rem; margin: 0; } }
  .cn__title { font-size: var(--fs-m); }
  .cn__body { color: var(--text-2); font-size: var(--fs-s); line-height: 1.45; }
  .cn__body a { color: var(--text); font-weight: 600; }
  .cn__actions { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }
  .cn__more { display: flex; flex-wrap: wrap; justify-content: center; gap: 0 16px; }
  .cn__link {
    min-height: 36px; padding: 0 4px; border: 0; background: none;
    color: var(--text-2); font-size: var(--fs-s); font-weight: 600;
    text-decoration: underline; text-underline-offset: 0.18em;
  }
  .cn__link:hover { color: var(--text); }
  .cn-dialog {
    width: min(100% - 24px, 620px); max-height: min(88dvh, 760px); margin: auto; padding: 0;
    border: 1px solid var(--border); border-radius: var(--r-l);
    background: var(--surface); color: var(--text); box-shadow: var(--shadow-2);
  }
  .cn-dialog[open] { display: flex; flex-direction: column; }
  .cn-dialog::backdrop { background: rgb(8 12 18 / 0.45); }
  @media (max-width: 639px) {
    .cn-dialog { width: 100%; max-width: none; max-height: 88dvh; margin: auto 0 0; border-radius: 20px 20px 0 0; border-bottom: 0; }
  }
  .cn-dialog__head { display: grid; gap: 4px; padding: 16px 20px 12px; border-bottom: 1px solid var(--border); }
  .cn-dialog__head h2 { font-size: var(--fs-l); }
  .cn-dialog__head p { color: var(--text-2); font-size: var(--fs-s); }
  .cn-dialog__body { flex: 1; min-height: 0; overflow-y: auto; overscroll-behavior: contain; padding: 12px 20px; }
  .cn-dialog__foot { display: grid; gap: 10px; padding: 12px 20px max(16px, env(safe-area-inset-bottom)); border-top: 1px solid var(--border); }
  .cn-dialog__actions { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }
  .cn-dialog__scope { color: var(--text-3); font-size: var(--fs-xs); text-align: center; }
  .cn-cats { display: grid; gap: 8px; margin: 0; }
  .cn-cat {
    display: grid; grid-template-columns: auto minmax(0, 1fr); gap: 0 10px; align-items: start;
    padding: 12px 14px; border: 1px solid var(--border); border-radius: var(--r-m);
  }
  .cn-cat > input { width: 18px; height: 18px; margin: 3px 0 0; accent-color: var(--accent); }
  .cn-cat__head { display: flex; flex-wrap: wrap; align-items: center; gap: 4px 10px; }
  .cn-cat__head label { margin-right: auto; font-weight: 700; cursor: pointer; }
  .cn-cat > input:disabled + .cn-cat__main label { cursor: default; }
  .cn-cat__headline, .cn-cat__more { margin-top: 4px; color: var(--text-2); font-size: var(--fs-s); }
  .cn-cat__more summary { width: fit-content; color: var(--accent); font-weight: 600; cursor: pointer; }
  .cn-cat__more > :not(summary) { margin-top: 8px; }
  .cn-cat__more h3 { color: var(--text); font-size: var(--fs-xs); letter-spacing: 0.02em; }
  .cn-cat__more h3 + * { margin-top: 2px; }
  .cn-cat__more ul { padding-left: 18px; list-style: disc; }
  .cn-risk { font-size: var(--fs-xs); }
  .cn-tag {
    display: inline-flex; align-items: center; min-height: 22px; padding: 0 8px; border-radius: var(--r-full);
    background: var(--bg-sunken); color: var(--text-2); font-size: var(--fs-xs); font-weight: 600;
  }
  .ad-band.section { padding-block: 24px; }
  .ad-band:not(.section) { padding-block: 24px; border-top: 1px solid var(--border); }
  .ad-slot { display: grid; gap: 8px; min-width: 0; }
  .ad-slot__label { color: var(--text-3); font-size: var(--fs-xs); line-height: 1.4; }
  .ad-slot__kind { color: var(--text-2); font-weight: 700; }
  .ad-slot__unit { width: 100%; height: 280px; overflow: hidden; }
  @media (min-width: 800px) {
    .ad-slot__unit { max-width: 970px; height: 90px; }
  }
  .ad-slot.dir-section { gap: 8px; }
  .map-ad {
    position: absolute; z-index: 8; left: 12px; right: 12px; bottom: calc(var(--peek, 0px) + 56px);
    display: grid; gap: 6px; padding: 8px 8px 10px 14px;
    border: 1px solid var(--border); border-radius: var(--r-l);
    background: var(--surface); box-shadow: var(--shadow-2);
  }
  .map-ad__head { display: flex; align-items: center; gap: 8px; }
  .map-ad__title { flex: 1; min-width: 0; font-size: var(--fs-s); font-weight: 700; line-height: 1.3; }
  .map-ad__kicker { display: block; color: var(--text-3); font-size: var(--fs-xs); font-weight: 600; }
  .map-ad .ad-slot { gap: 6px; padding-right: 6px; }
  @media (min-width: 900px) { .map-ad { left: 16px; right: auto; width: min(468px, 100% - 104px); bottom: 56px; } }
  .app.is-replay .map-ad { display: none; }
  html.is-tv :is(.ad-band, .ad-slot) { display: none !important; }
}
@layer pages {
  .ct-page { padding-bottom: 56px; }
  .ct-head { display: grid; gap: 12px; max-width: 72ch; padding-block: 20px 32px; }
  .ct-head h1 { font-size: var(--fs-3xl); letter-spacing: -0.025em; }
  .ct-lede { color: var(--text-2); font-size: var(--fs-l); max-width: 62ch; }
  .ct-lang {
    display: flex; align-items: flex-start; gap: 8px; width: fit-content; max-width: 100%;
    padding: 8px 12px; border-radius: var(--r-m); background: var(--bg-sunken);
    color: var(--text-2); font-size: var(--fs-s);
  }
  .ct-lang .icon { margin-top: 2px; color: var(--text-3); }
  .ct-lang a { font-weight: 600; }
  .ct-body { display: grid; gap: 40px; min-width: 0; }
  .ct-eyebrow { color: var(--text-3); font-size: var(--fs-xs); font-weight: 700; letter-spacing: 0.06em; text-transform: uppercase; }
  .ct-note { color: var(--text-3); font-size: var(--fs-s); max-width: 72ch; }
  .ct-block { display: grid; gap: 16px; min-width: 0; padding-top: 32px; border-top: 1px solid var(--border); }
  .ct-body > :first-child { padding-top: 0; border-top: 0; }
  .ct-block__head { display: grid; gap: 8px; max-width: 68ch; }
  .ct-block__head h2, .ct-intro h2 { font-size: var(--fs-2xl); }
  .ct-block__head p { color: var(--text-2); }
  .ct-card {
    display: grid; gap: 8px; align-content: start; min-width: 0;
    padding: 18px 20px; border: 1px solid var(--border); border-radius: var(--r-l); background: var(--surface);
  }
  .ct-card h3 { font-size: var(--fs-l); }
  .ct-card p { color: var(--text-2); font-size: var(--fs-s); }
  .ct-card .ct-card__strong { color: var(--text); font-size: var(--fs-m); }
  .ct-block.ct-panel { gap: 12px; padding: 20px 20px 22px; border: 1px solid var(--border); }
  .ct-panel h2 { font-size: var(--fs-xl); }
  .ct-panel > p:not(.ct-eyebrow) { color: var(--text-2); max-width: 72ch; }
  .ct-grid { display: grid; gap: 12px; }
  @media (min-width: 720px) { .ct-grid--2 { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
  @media (min-width: 900px) { .ct-grid--3 { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
  .ct-actions { --gap: 8px; }
  .ct-intro { display: grid; gap: 24px; min-width: 0; }
  .ct-intro__text { display: grid; gap: 12px; align-content: start; min-width: 0; }
  .ct-intro__text .ct-actions { margin-top: 4px; }
  .ct-highlights { display: grid; gap: 12px; }
  @media (min-width: 960px) {
    .ct-intro { grid-template-columns: minmax(0, 1.1fr) minmax(16rem, 0.9fr); gap: 40px; align-items: start; }
  }
  .ct-checks { display: grid; gap: 8px; margin-top: 4px; }
  .ct-checks li { display: flex; align-items: flex-start; gap: 8px; color: var(--text); font-size: var(--fs-s); }
  .ct-checks .icon { margin-top: 2px; color: var(--text-3); }
  .ct-steps { display: grid; gap: 12px; }
  .ct-steps > li { display: flex; align-items: flex-start; gap: 14px; }
  .ct-steps__n {
    display: grid; place-items: center; width: 32px; height: 32px; flex: none;
    border-radius: 50%; background: var(--bg-sunken); color: var(--text); font-weight: 700;
  }
  .ct-steps h3 { font-size: var(--fs-m); }
  .ct-steps p { margin-top: 4px; }
  @media (min-width: 900px) {
    .ct-steps { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .ct-steps > li:last-child:nth-child(odd) { grid-column: 1 / -1; }
  }
  .ct-matrix { display: grid; min-width: 0; border: 1px solid var(--border); border-radius: var(--r-l); background: var(--surface); overflow: clip; }
  .ct-matrix__intro { display: grid; gap: 4px; padding: 18px 20px; }
  .ct-matrix__intro h3 { font-size: var(--fs-l); }
  .ct-matrix__intro p { color: var(--text-2); font-size: var(--fs-s); }
  .ct-matrix__cols { display: none; }
  .ct-matrix__cat { display: grid; gap: 2px; padding: 14px 20px; border-top: 1px solid var(--border); background: var(--bg-subtle); }
  .ct-matrix__cat h4 { margin: 0; font-size: var(--fs-m); line-height: 1.3; }
  .ct-matrix__cat p { color: var(--text-2); font-size: var(--fs-s); }
  .ct-matrix__row { display: grid; gap: 10px; padding: 14px 20px; border-top: 1px solid var(--border); }
  .ct-matrix__feature { display: grid; gap: 2px; min-width: 0; }
  .ct-matrix__feature strong { font-weight: 650; }
  .ct-matrix__feature span { color: var(--text-2); font-size: var(--fs-s); }
  .ct-matrix__vals { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 6px 16px; margin: 0; }
  .ct-matrix__vals div { display: flex; align-items: center; justify-content: space-between; gap: 8px; min-width: 0; font-size: var(--fs-s); }
  .ct-matrix__vals dt { min-width: 0; color: var(--text-2); }
  .ct-matrix__vals .is-us dt { color: var(--text); font-weight: 700; }
  .ct-val { display: inline-flex; align-items: center; gap: 5px; font-weight: 600; white-space: nowrap; }
  .ct-val--yes { color: var(--text); }
  .ct-val--no { color: var(--text-3); font-weight: 500; }
  .ct-val--part { color: var(--text-2); }
  .ct-val .icon { color: var(--text-3); }
  @media (max-width: 380px) { .ct-matrix__vals { grid-template-columns: 1fr; } }
  @media (min-width: 900px) {
    .ct-matrix__cols, .ct-matrix__row { grid-template-columns: minmax(0, 2.2fr) repeat(4, minmax(0, 1fr)); gap: 16px; align-items: center; }
    .ct-matrix__cols {
      display: grid; position: sticky; top: var(--header-h); z-index: 1;
      padding: 12px 20px; border-top: 1px solid var(--border); background: var(--surface);
      color: var(--text-3); font-size: var(--fs-xs); font-weight: 700;
    }
    .ct-matrix__cols span { display: grid; gap: 2px; text-align: center; }
    .ct-matrix__cols span:first-child { text-align: left; }
    .ct-matrix__cols strong { color: var(--text-2); font-size: var(--fs-s); }
    .ct-matrix__cols .is-us strong { color: var(--text); }
    .ct-matrix__cols small { font-size: var(--fs-xs); font-weight: 500; }
    .ct-matrix__vals { display: contents; }
    .ct-matrix__vals div { justify-content: center; }
    .ct-matrix__vals dt {
      position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px;
      overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0;
    }
  }
  .ct-faq, .ct-page--faq .ct-panel { max-width: 80ch; }
  .ct-sources { display: grid; gap: 10px; min-width: 0; }
  .ct-sources + .ct-sources { margin-top: 12px; }
  .ct-source { height: 100%; color: var(--text); text-decoration: none; }
  .ct-source:hover { border-color: var(--border-strong); background: var(--surface-hover); color: var(--text); }
  .ct-source strong { display: flex; align-items: flex-start; justify-content: space-between; gap: 12px; font-size: var(--fs-l); line-height: 1.3; }
  .ct-source strong .icon { margin-top: 3px; color: var(--text-3); }
  .ct-source > span:not(.sr-only) { color: var(--text-2); font-size: var(--fs-s); }
  .ct-source code { color: var(--text-3); font: 0.8125rem/1.45 ui-monospace, SFMono-Regular, Menlo, monospace; overflow-wrap: anywhere; }
  .ct-legal { display: grid; gap: 24px; min-width: 0; }
  .ct-toc { display: grid; gap: 8px; padding: 16px; border: 1px solid var(--border); border-radius: var(--r-l); background: var(--surface); }
  .ct-toc__title { color: var(--text-3); font-size: var(--fs-xs); font-weight: 700; letter-spacing: 0.06em; text-transform: uppercase; }
  .ct-toc ol { display: grid; gap: 2px; margin: 0; }
  .ct-toc a { display: block; padding: 6px 8px; border-radius: var(--r-s); color: var(--text-2); font-size: var(--fs-s); text-decoration: none; }
  .ct-toc a:hover { background: var(--surface-hover); color: var(--text); }
  @media (min-width: 960px) {
    .ct-legal { grid-template-columns: 15rem minmax(0, 1fr); gap: 48px; align-items: start; }
    .ct-toc { position: sticky; top: calc(var(--header-h) + 24px); }
  }
  .ct-doc { display: grid; gap: 28px; min-width: 0; max-width: 72ch; }
  .ct-doc__head { display: grid; gap: 12px; }
  .ct-doc__head h2 { font-size: var(--fs-2xl); }
  .ct-doc__head > p:not(.ct-meta) { color: var(--text-2); }
  .ct-meta { color: var(--text-3); font-size: var(--fs-s); }
  .ct-sec { display: grid; gap: 10px; padding-top: 24px; border-top: 1px solid var(--border); }
  .ct-sec h3 { display: flex; align-items: baseline; gap: 12px; font-size: var(--fs-xl); }
  .ct-sec__n { color: var(--text-3); font-size: var(--fs-s); font-weight: 600; font-variant-numeric: tabular-nums; }
  .ct-sec > p { color: var(--text-2); }
  .ct-bullets { display: grid; gap: 8px; margin: 0; padding-left: 1.25em; color: var(--text-2); }
  .ct-bullets li::marker { color: var(--text-3); }
  .ct-sec--links .ct-actions { margin-top: 4px; }
  .ct-mail { display: inline-flex; align-items: center; gap: 6px; font-weight: 600; }
  .ct-more { display: grid; gap: 14px; margin-top: 48px; padding-top: 32px; border-top: 1px solid var(--border); }
  .ct-more h2 { font-size: var(--fs-xl); }
  .ct-more__list { display: grid; gap: 10px; }
  @media (min-width: 640px) { .ct-more__list { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
  @media (min-width: 1024px) { .ct-more__list { grid-template-columns: repeat(4, minmax(0, 1fr)); } }
  .ct-more__link {
    display: flex; align-items: center; gap: 12px; height: 100%; min-height: 64px; padding: 12px 14px;
    border: 1px solid var(--border); border-radius: var(--r-l); background: var(--surface);
    color: var(--text); text-decoration: none;
  }
  .ct-more__link:hover { border-color: var(--border-strong); background: var(--surface-hover); color: var(--text); }
  .ct-more__link > .icon { color: var(--text-3); }
  .ct-more__text { display: grid; gap: 2px; flex: 1; min-width: 0; }
  .ct-more__text strong { font-weight: 650; }
  .ct-more__text span { color: var(--text-2); font-size: var(--fs-s); }
  .ct-404 { display: grid; gap: 36px; padding-block: 48px 64px; }
  .ct-404__main { display: grid; gap: 14px; justify-items: start; max-width: 40rem; min-width: 0; }
  .ct-404 h1 { font-size: var(--fs-3xl); letter-spacing: -0.025em; }
  .ct-404__path { color: var(--text-2); overflow-wrap: anywhere; }
  .ct-404__path code {
    padding: 1px 6px; border-radius: var(--r-s); background: var(--bg-sunken); color: var(--text);
    font: 0.875em/1.5 ui-monospace, SFMono-Regular, Menlo, monospace;
  }
  .ct-guess { font-size: var(--fs-l); font-weight: 600; overflow-wrap: anywhere; }
  .ct-guess a { display: inline-flex; align-items: center; gap: 8px; vertical-align: bottom; }
  .ct-404 .search-trigger--hero { max-width: 36rem; margin-top: 6px; }
  .ct-404__pages { display: grid; gap: 12px; }
  .ct-404__live { color: var(--text-3); font-size: var(--fs-s); }
  :root[data-simple] :is(.ct-intro, .ct-grid--2, .ct-grid--3, .ct-steps, .ct-legal) { grid-template-columns: minmax(0, 1fr); }
  :root[data-simple] .ct-steps > li:last-child:nth-child(odd) { grid-column: auto; }
  :root[data-simple] .ct-toc { position: static; max-width: 72ch; }
  @media print {
    .ct-printable :is(.skip-link, .site-header, .site-footer, .crumbs, .ct-lang, .ct-toc, .ct-doc__actions, .ct-sec--links .ct-actions, .ct-more) { display: none !important; }
    .ct-printable .ct-legal { display: block; }
    .ct-printable .ct-doc { max-width: none; }
    .ct-printable .ct-sec { break-inside: avoid; }
  }
}
@layer tokens {
  :root[data-cvd] {
    --heat-0: light-dark(#989800, #736c2d);
    --heat-1: light-dark(#129270, #5d9874);
    --heat-2: light-dark(#2d5a87, #21b9fd);
    --heat-3: light-dark(#440154, #edd6ed);
  }
  :root {
    --cvd-red: light-dark(#bc0325, #fe6a56);
    --cvd-red-ink: light-dark(#ffffff, #0e1116);
    --cvd-blue: light-dark(#2463ce, #3c8dfd);
    --cvd-blue-ink: light-dark(#ffffff, #0e1116);
    --cvd-green: light-dark(#379c67, #50deaa);
    --cvd-green-ink: #0e1116;
    --cvd-frontrunner: light-dark(#881a6e, #fbb4ed);
    --cvd-frontrunner-ink: light-dark(#ffffff, #0e1116);
    --cvd-sline: light-dark(#6e7477, #91979a);
    --cvd-sline-ink: light-dark(#ffffff, #0e1116);
  }
}
@layer pages {
  :root[data-cvd] :is([style*="--c:#BE2036" i], [style*="--c: #BE2036" i]) { --c: var(--cvd-red) !important; --t: var(--cvd-red-ink) !important; }
  :root[data-cvd] :is([style*="--line:#BE2036" i], [style*="--line: #BE2036" i]) { --line: var(--cvd-red) !important; --line-ink: var(--cvd-red-ink) !important; }
  :root[data-cvd] [style*="background: rgb(190, 32, 54)"] { background: var(--cvd-red) !important; }
  :root[data-cvd] [stroke="#BE2036" i] { stroke: var(--cvd-red); }
  :root[data-cvd] [fill="#BE2036" i] { fill: var(--cvd-red); }
  :root[data-cvd] :is([style*="--c:#004A97" i], [style*="--c: #004A97" i]) { --c: var(--cvd-blue) !important; --t: var(--cvd-blue-ink) !important; }
  :root[data-cvd] :is([style*="--line:#004A97" i], [style*="--line: #004A97" i]) { --line: var(--cvd-blue) !important; --line-ink: var(--cvd-blue-ink) !important; }
  :root[data-cvd] [style*="background: rgb(0, 74, 151)"] { background: var(--cvd-blue) !important; }
  :root[data-cvd] [stroke="#004A97" i] { stroke: var(--cvd-blue); }
  :root[data-cvd] [fill="#004A97" i] { fill: var(--cvd-blue); }
  :root[data-cvd] :is([style*="--c:#2EB566" i], [style*="--c: #2EB566" i]) { --c: var(--cvd-green) !important; --t: var(--cvd-green-ink) !important; }
  :root[data-cvd] :is([style*="--line:#2EB566" i], [style*="--line: #2EB566" i]) { --line: var(--cvd-green) !important; --line-ink: var(--cvd-green-ink) !important; }
  :root[data-cvd] [style*="background: rgb(46, 181, 102)"] { background: var(--cvd-green) !important; }
  :root[data-cvd] [stroke="#2EB566" i] { stroke: var(--cvd-green); }
  :root[data-cvd] [fill="#2EB566" i] { fill: var(--cvd-green); }
  :root[data-cvd] :is([style*="--c:#C227B9" i], [style*="--c: #C227B9" i]) { --c: var(--cvd-frontrunner) !important; --t: var(--cvd-frontrunner-ink) !important; }
  :root[data-cvd] :is([style*="--line:#C227B9" i], [style*="--line: #C227B9" i]) { --line: var(--cvd-frontrunner) !important; --line-ink: var(--cvd-frontrunner-ink) !important; }
  :root[data-cvd] [style*="background: rgb(194, 39, 185)"] { background: var(--cvd-frontrunner) !important; }
  :root[data-cvd] [stroke="#C227B9" i] { stroke: var(--cvd-frontrunner); }
  :root[data-cvd] [fill="#C227B9" i] { fill: var(--cvd-frontrunner); }
  :root[data-cvd] :is([style*="--c:#77777A" i], [style*="--c: #77777A" i]) { --c: var(--cvd-sline) !important; --t: var(--cvd-sline-ink) !important; }
  :root[data-cvd] :is([style*="--line:#77777A" i], [style*="--line: #77777A" i]) { --line: var(--cvd-sline) !important; --line-ink: var(--cvd-sline-ink) !important; }
  :root[data-cvd] [style*="background: rgb(119, 119, 122)"] { background: var(--cvd-sline) !important; }
  :root[data-cvd] [stroke="#77777A" i] { stroke: var(--cvd-sline); }
  :root[data-cvd] [fill="#77777A" i] { fill: var(--cvd-sline); }
  :root[data-cvd] .ftl__train { color: var(--line-ink, #fff); }
  :root[data-cvd] .net-line[data-line="blue"] { stroke-dasharray: 18 17; }
  :root[data-cvd] .net-line[data-line="green"] { stroke-dasharray: 0 15; }
  :root[data-cvd] .net-line[data-line="frontrunner"] { stroke-dasharray: 20 13 0 13; }
  :root[data-cvd] .net-line[data-line="s-line"] { stroke-dasharray: 6 12; }
  .line-key { display: none; }
  :root[data-cvd] .line-key { display: grid; }
  .line-key ul { list-style: none; margin: 0; padding: 0 6px; display: grid; gap: 2px; }
  .line-key li { display: flex; align-items: center; gap: 10px; min-height: 28px; font-size: var(--fs-s); font-weight: 600; }
  .line-key svg { width: 44px; height: 10px; flex: none; overflow: visible; }
  .line-key path { fill: none; stroke-width: 4; stroke-linecap: round; }
  .line-key [data-line="blue"] { stroke-dasharray: 9 8; }
  .line-key [data-line="green"] { stroke-dasharray: 0 8; }
  .line-key [data-line="frontrunner"] { stroke-dasharray: 10 7 0 7; }
  .line-key [data-line="s-line"] { stroke-dasharray: 3 7; }
}
@layer pages {
  .dir-page { padding-block: 20px 56px; }
  @media (min-width: 960px) { .dir-page { padding-top: 32px; } }
  .dir-head { display: grid; gap: 12px; padding-bottom: 20px; }
  .dir-head h1 { font-size: var(--fs-3xl); letter-spacing: -0.025em; }
  .dir-head__lede { color: var(--text-2); font-size: var(--fs-l); max-width: 62ch; }
  .dir-head__top { display: flex; align-items: center; gap: 16px; }
  .dir-head__top > div { min-width: 0; }
  .dir-head__top h1 { overflow-wrap: anywhere; }
  .dir-head__sub { margin-top: 4px; color: var(--text-2); }
  .dir-live .live { flex-wrap: wrap; white-space: normal; }
  .dir-actions { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 4px; }
  @media (max-width: 479px) { .dir-actions .btn { flex: 1 1 auto; } }
  .dir-stats { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; margin: 0 0 28px; }
  .dir-stats--4 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  @media (min-width: 720px) { .dir-stats { gap: 12px; } .dir-stats--4 { grid-template-columns: repeat(4, minmax(0, 1fr)); } }
  .dir-stat { display: grid; align-content: start; gap: 2px; min-width: 0; padding: 12px 14px; border: 1px solid var(--border); border-radius: var(--r-l); background: var(--surface); }
  .dir-stat dt { order: 2; color: var(--text-2); font-size: var(--fs-s); font-weight: 600; }
  .dir-stat dd { margin: 0; font-size: var(--fs-2xl); font-weight: 750; letter-spacing: -0.02em; line-height: 1.1; overflow-wrap: anywhere; }
  .dir-stat small { order: 3; color: var(--text-3); font-size: var(--fs-xs); }
  .dir-tools { display: grid; gap: 12px; margin-bottom: 24px; min-width: 0; }
  .dir-filter {
    display: flex; align-items: center; gap: 8px; width: 100%; max-width: 520px; min-height: 48px; padding: 0 6px 0 16px;
    border: 1px solid var(--border-strong); border-radius: var(--r-full); background: var(--surface); color: var(--text-3);
  }
  .dir-filter:focus-within { border-color: var(--accent); box-shadow: var(--ring); }
  .dir-filter input { flex: 1; min-width: 0; height: 46px; border: 0; background: transparent; color: var(--text); font-size: var(--fs-m); outline: none; }
  .dir-filter input:focus-visible { box-shadow: none; }
  .dir-filter input::-webkit-search-cancel-button { display: none; }
  .dir-filter__clear { display: grid; place-items: center; width: 36px; height: 36px; border: 0; border-radius: 50%; background: transparent; color: var(--text-3); }
  .dir-filter__clear:hover { background: var(--surface-hover); color: var(--text); }
  @media (min-width: 840px) { .dir-chips { flex-wrap: wrap; overflow: visible; } }
  .dir-count { color: var(--text-2); font-size: var(--fs-s); }
  .dir-count:empty { display: none; }
  .dir-empty { padding: 24px 0; color: var(--text-2); }
  .dir-groups { display: grid; gap: 32px; }
  .dir-group { min-width: 0; scroll-margin-top: calc(var(--header-h) + 16px); }
  .dir-group__head, .dir-section__head { display: flex; flex-wrap: wrap; align-items: baseline; gap: 4px 12px; margin-bottom: 12px; }
  .dir-group__head h2, .dir-section h2 { font-size: var(--fs-xl); }
  .dir-group__count { color: var(--text-3); font-size: var(--fs-s); font-weight: 600; }
  .dir-group__head .link-arrow, .dir-section__head .link-arrow { margin-left: auto; }
  .dir-list { overflow: hidden; }
  .dir-list.rows > li + li > .row { border-top: 0; }
  .dir-list.rows > li:not([hidden]) ~ li > .row { border-top: 1px solid var(--border); }
  .dir-row { padding-inline: 16px; }
  .dir-row .status { font-size: var(--fs-xs); }
  .dir-row .row__end { gap: 8px; }
  .dir-row .row__end .num { white-space: nowrap; }
  @media (min-width: 900px) {
    .dir-list--cols { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .dir-list--cols.rows > li > .row, .dir-list--cols.rows > li:not([hidden]) ~ li > .row { border-top: 0; border-bottom: 1px solid var(--border); }
    .dir-list--cols > li { margin-bottom: -1px; }
    .dir-list--cols > li:nth-child(odd) > .row { border-right: 1px solid var(--border); }
  }
  .dir-section { margin-top: 40px; padding-top: 32px; border-top: 1px solid var(--border); min-width: 0; }
  .dir-section > h2 { margin-bottom: 12px; }
  .dir-section__note { margin: -4px 0 14px; color: var(--text-2); font-size: var(--fs-s); }
  .dir-stats + .dir-section { margin-top: 0; padding-top: 0; border-top: 0; }
  .dir-lines { display: grid; gap: 12px; grid-template-columns: repeat(auto-fill, minmax(min(100%, 320px), 1fr)); margin: 0; padding: 0; list-style: none; }
  .dir-line { display: grid; align-content: start; overflow: hidden; }
  .dir-line__head { display: flex; align-items: center; gap: 14px; padding: 16px; color: var(--text); text-decoration: none; }
  .dir-line__head:hover { background: var(--surface-hover); color: var(--text); }
  .dir-line__head > .icon { margin-left: auto; color: var(--text-3); }
  .dir-line__name { display: grid; gap: 2px; min-width: 0; }
  .dir-line__name strong { font-size: var(--fs-l); }
  .dir-line__name span { color: var(--text-2); font-size: var(--fs-s); }
  .dir-line__facts { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 14px; padding: 12px 16px 14px; border-top: 1px solid var(--border); color: var(--text-2); font-size: var(--fs-s); }
  .dir-places { display: grid; gap: 8px; grid-template-columns: repeat(auto-fill, minmax(min(100%, 250px), 1fr)); margin: 0; padding: 0; list-style: none; }
  .dir-place {
    display: flex; align-items: center; gap: 10px; height: 100%; min-height: 52px; padding: 8px 12px 8px 14px;
    border: 1px solid var(--border); border-radius: var(--r-m); background: var(--surface); color: var(--text); text-decoration: none;
  }
  .dir-place:hover { border-color: var(--border-strong); background: var(--surface-hover); color: var(--text); }
  .dir-place__name { flex: 1; min-width: 0; font-weight: 600; line-height: 1.3; }
  .dir-place__meta { display: flex; flex: none; gap: 4px; color: var(--text-3); font-size: var(--fs-s); white-space: nowrap; }
  .dir-place__meta .badge { height: 20px; min-width: 24px; padding: 0 5px; font-size: 0.6875rem; }
  .dir-place > .icon { color: var(--text-3); }
  .dir-tt__list { display: flex; flex-wrap: wrap; gap: 8px; margin: 0; padding: 0; list-style: none; }
  .dir-tt__badge { padding: 0 6px; }
  .dir-chip__name { max-width: 22ch; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
  .dir-faq .faq { max-width: 820px; }
  .dir-note { display: grid; gap: 8px; margin-top: 40px; padding: 16px 20px; border-radius: var(--r-l); background: var(--bg-subtle); color: var(--text-2); font-size: var(--fs-s); }
  .dir-note h2 { color: var(--text); font-size: var(--fs-m); }
  .dir-note .cluster { --gap: 8px 16px; font-weight: 600; }
  .dir-layout { display: grid; gap: 24px; }
  .dir-layout > *, .dir-aside > * { min-width: 0; }
  .dir-aside { display: grid; gap: 16px; align-content: start; }
  @media (min-width: 1024px) { .dir-layout { grid-template-columns: minmax(0, 1fr) 360px; gap: 40px; align-items: start; } }
  .dir-answer { color: var(--text); font-size: var(--fs-l); font-weight: 600; }
  .dir-live-card .rows:not(:empty) { border-top: 1px solid var(--border); }
  .dir-live-card .card__head .live { flex-wrap: wrap; white-space: normal; }
  .dir-muted { color: var(--text-2); font-size: var(--fs-s); }
  .dir-veh { display: grid; flex: none; place-items: center; width: 32px; height: 32px; border-radius: 50%; background: var(--bg-sunken); color: var(--text-2); }
  .dir-aside .alert-text p { display: block; overflow: visible; }
  .sp-overall { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 14px; }
  .sp-overall .status { font-size: var(--fs-l); }
  .sp-summary { max-width: 70ch; color: var(--text); font-size: var(--fs-l); }
  .sp-jump { margin-top: 4px; }
  .sp-modes { display: flex; flex-wrap: wrap; gap: 4px 14px; margin: -16px 0 28px; color: var(--text-2); font-size: var(--fs-s); }
  .sp-modes strong { color: var(--text); }
  .sp-section { margin-top: 36px; scroll-margin-top: calc(var(--header-h) + 16px); min-width: 0; }
  .sp-section > h2, .sp-section__head h2 { font-size: var(--fs-2xl); }
  .sp-section > h2 { margin-bottom: 12px; }
  .sp-section__head { display: flex; flex-wrap: wrap; align-items: baseline; gap: 4px 12px; margin-bottom: 12px; }
  .sp-ok { display: flex; gap: 10px; align-items: flex-start; padding: 14px 16px; border: 1px solid var(--border); border-radius: var(--r-l); background: var(--surface); color: var(--text-2); }
  .sp-ok .status { flex: none; }
  .sp-note { margin-top: 10px; color: var(--text-3); font-size: var(--fs-xs); }
  .sp-untracked { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; margin-top: 12px; color: var(--text-2); font-size: var(--fs-s); }
  .sp-groups { display: grid; gap: 28px; }
  .sp-group { min-width: 0; }
  .sp-group > h3 { display: flex; align-items: baseline; gap: 10px; margin-bottom: 10px; font-size: var(--fs-l); }
  .sp-group > h3 span, .sp-kind > h4 span { color: var(--text-3); font-size: var(--fs-s); font-weight: 600; }
  .sp-kind + .sp-kind { margin-top: 16px; }
  .sp-kind > h4 { display: flex; align-items: baseline; gap: 8px; margin: 0 0 8px; color: var(--text-2); font-size: var(--fs-m); }
  .sp-list { overflow: hidden; }
  .sp-list.rows > li + li > .row-static { border-top: 0; }
  .sp-list.rows > li:not([hidden]) ~ li > .row-static { border-top: 1px solid var(--border); }
  .sp-list .row-static { padding: 14px 16px; }
  .sp-list .alert-text p { display: block; overflow: visible; margin-top: 2px; }
  .sp-badge { display: inline-flex; border-radius: var(--r-s); text-decoration: none; }
  @media (pointer: coarse) { .sp-badge { padding-block: 5px; margin-block: -5px; } }
  .sp-badge:hover .badge { box-shadow: 0 0 0 2px var(--border-strong); }
  .sp-feeds { display: grid; gap: 6px; color: var(--text-2); font-size: var(--fs-s); }
  :root[data-simple] :is(.dir-stats, .dir-faq, .dir-guides, .dir-note, .dir-head__lede, .sp-modes, .sp-feeds-section) { display: none !important; }
  :root[data-simple] .dir-list--cols { grid-template-columns: 1fr; }
  :root[data-simple] .dir-list--cols > li:nth-child(odd) > .row { border-right: 0; }
  :root[data-simple] .dir-stats + .dir-section { margin-top: 0; }
}
@layer pages {
  .follow { display: grid; grid-template-columns: minmax(0, 1fr); gap: 16px; padding-block: 16px 56px; }
  .follow-view, .follow-picker, .follow-picker__grid, .follow-grid, .follow-side { grid-template-columns: minmax(0, 1fr); }
  .follow-view, .follow-missing, .follow-stale { display: none; }
  .follow[data-mode="train"] .follow-view { display: grid; gap: 16px; }
  .follow[data-mode="train"] .follow-picker,
  .follow[data-mode="missing"] .follow-picker { display: none; }
  .follow[data-mode="missing"] .follow-missing { display: block; }
  html.is-stale .follow[data-mode="train"] .follow-stale { display: flex; }
  .follow-stale {
    align-items: center; gap: 10px; padding: 12px 16px; border-radius: var(--r-m);
    background: var(--warn-soft); color: var(--warn); font-size: var(--fs-s);
  }
  .follow-stale span { color: var(--text-2); }
  .follow-stale strong { color: var(--warn); }
  .follow-picker { display: grid; gap: 20px; }
  .follow-picker__head { display: grid; gap: 8px; padding-top: 8px; }
  .follow-picker__head h1 { font-size: var(--fs-3xl); letter-spacing: -0.025em; }
  .follow-picker__head p { color: var(--text-2); font-size: var(--fs-l); max-width: 52ch; }
  .follow-picker__grid { display: grid; gap: 16px; }
  .follow-line .card__head { padding-bottom: 8px; }
  .follow-line .card__title { font-size: var(--fs-l); }
  .follow-line .rows { padding-bottom: 6px; }
  .follow-line .row, .follow-line .row-static { padding-inline: 20px; }
  @media (min-width: 900px) {
    .follow-picker__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); align-items: start; }
  }
  .follow-head { display: grid; gap: 10px; padding: 18px 20px 20px; }
  .follow-head__top { display: flex; align-items: center; gap: 10px; min-width: 0; }
  .follow-head__mode { color: var(--text-2); font-size: var(--fs-s); font-weight: 600; }
  .follow-head__age { margin-left: auto; }
  .follow-head__title { font-size: var(--fs-2xl); letter-spacing: -0.02em; }
  .follow-head__next { font-size: var(--fs-xl); font-weight: 700; letter-spacing: -0.01em; line-height: 1.25; }
  .follow-head__status { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 14px; }
  .follow-head__speed { color: var(--text-3); font-size: var(--fs-s); }
  .follow-progress { display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: center; gap: 12px; margin-top: 2px; }
  .follow-progress__bar { height: 8px; border-radius: var(--r-full); background: var(--bg-sunken); overflow: hidden; }
  .follow-progress__bar span { display: block; height: 100%; width: 0; border-radius: inherit; background: var(--accent); transition: width 1s linear; }
  .follow-progress__label { color: var(--text-2); font-size: var(--fs-s); font-weight: 600; }
  .follow-skeleton { display: inline-block; width: 60%; height: 0.9em; border-radius: var(--r-s); background: var(--bg-sunken); vertical-align: middle; }
  .follow-skeleton--title { width: 85%; }
  .follow-grid { display: grid; gap: 16px; }
  .follow-side { display: grid; gap: 16px; order: -1; align-content: start; }
  @media (min-width: 960px) {
    .follow-grid { grid-template-columns: minmax(0, 1fr) 380px; align-items: start; }
    .follow-side { order: 0; position: sticky; top: calc(var(--header-h) + 16px); }
  }
  .follow-trip .card__head { padding-bottom: 4px; }
  .follow-earlier { min-height: 32px; padding: 0 10px; color: var(--accent); font-size: var(--fs-s); }
  .ftl { --row: 56px; --x: 30px; position: relative; list-style: none; margin: 0; padding: 4px 0 14px; }
  .ftl__row {
    position: relative; display: grid; grid-template-columns: 60px minmax(0, 1fr) auto; align-items: center;
    height: var(--row); padding-right: 16px;
  }
  .ftl__rail {
    position: absolute; z-index: 0; left: calc(var(--x) - 3px); width: 6px; border-radius: 3px;
    top: calc(4px + var(--row) / 2); bottom: calc(14px + var(--row) / 2);
    background: color-mix(in srgb, var(--line) 28%, var(--surface));
  }
  .ftl__done {
    position: absolute; left: 0; right: 0; top: 0; border-radius: 3px;
    height: calc(var(--row) * var(--pos)); background: var(--line); transition: height 1s linear;
  }
  .ftl__node {
    position: absolute; z-index: 1; left: var(--x); top: 50%; width: 14px; height: 14px; border-radius: 50%;
    background: var(--surface); border: 3px solid var(--line); transform: translate(-50%, -50%);
  }
  .ftl__row.is-passed .ftl__node { width: 10px; height: 10px; background: var(--line); border-color: var(--line); }
  .ftl__row.is-transfer .ftl__node { width: 16px; height: 16px; border: 2.5px solid var(--text); }
  .ftl__row.is-passed.is-transfer .ftl__node { background: var(--text-3); border-color: var(--text-3); }
  .ftl__row.is-end .ftl__node { width: 18px; height: 18px; background: var(--line); border-color: var(--surface); box-shadow: 0 0 0 2px var(--line); }
  .ftl__row.is-picked .ftl__node {
    width: 22px; height: 22px; background: var(--accent); border: 3px solid var(--surface);
    box-shadow: 0 0 0 3px color-mix(in srgb, var(--accent) 40%, transparent);
  }
  .ftl__train {
    position: absolute; z-index: 2; left: var(--x);
    top: calc(4px + var(--row) / 2 + var(--row) * var(--pos));
    display: grid; place-items: center; width: 34px; height: 34px; border-radius: 50%;
    background: var(--line); color: #fff; border: 3px solid var(--surface);
    box-shadow: 0 3px 12px rgb(0 0 0 / 0.28);
    transform: translate(-50%, -50%); transition: top 1s linear;
  }
  .ftl__train .icon { width: 16px; height: 16px; stroke-width: 2.4; }
  .ftl__train::after {
    content: ""; position: absolute; inset: -6px; border-radius: 50%;
    border: 2px solid var(--line); opacity: 0; animation: live-ping 2.2s var(--ease) infinite;
  }
  html.is-stale .ftl__train { filter: grayscale(1); opacity: 0.6; }
  html.is-stale .ftl__train::after { animation: none; }
  .ftl__stop {
    grid-column: 2; display: grid; gap: 3px; min-width: 0; padding: 6px 10px; border: 0; border-radius: var(--r-m);
    background: transparent; color: var(--text); text-align: left; font: inherit; cursor: pointer;
  }
  .ftl__stop:hover:not(:disabled) { background: var(--surface-hover); }
  .ftl__stop:disabled { cursor: default; }
  .ftl__name { display: block; min-width: 0; font-weight: 600; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
  .ftl__name .icon { display: inline-block; margin-right: 6px; vertical-align: -2px; color: var(--accent); }
  .ftl__row.is-passed .ftl__name { color: var(--text-3); font-weight: 500; }
  .ftl__row.is-next .ftl__name { font-weight: 750; }
  .ftl__row.is-picked .ftl__name { color: var(--accent); }
  .ftl__meta { display: flex; gap: 4px; }
  .ftl__meta .badge { height: 18px; min-width: 22px; padding: 0 5px; font-size: 0.6875rem; border-radius: 5px; }
  .ftl__time { grid-column: 3; display: grid; justify-items: end; text-align: right; font-variant-numeric: tabular-nums; white-space: nowrap; }
  .ftl__time strong { font-weight: 700; }
  .ftl__time small { color: var(--text-3); font-size: var(--fs-xs); }
  .ftl__row.is-passed .ftl__time strong { color: var(--text-3); font-weight: 500; }
  .ftl__row.is-next .ftl__time small { color: var(--good); font-weight: 650; }
  .follow-mystop .card__title, .follow-transfer .card__title { display: inline-flex; align-items: center; gap: 8px; }
  .follow-mystop__name { display: flex; align-items: center; gap: 6px; font-size: var(--fs-l); font-weight: 700; }
  .follow-mystop__name .icon { color: var(--accent); }
  .follow-mystop__time { margin-top: 4px; font-size: var(--fs-2xl); font-weight: 750; letter-spacing: -0.02em; }
  .follow-mystop__sub { margin-top: 2px; color: var(--text-2); }
  .follow-mystop .card__body > .btn { margin-top: 12px; }
  .follow-mystop__clear { padding-inline: 10px; }
  .follow-transfer .rows .row { padding-inline: 20px; align-items: flex-start; padding-block: 12px; }
  .follow-transfer__row > .badge { margin-top: 1px; }
  .follow-transfer__row .row__main { display: grid; gap: 4px; }
  .follow-transfer__row .row__title { white-space: normal; }
  .follow-transfer__when { margin-left: 6px; color: var(--text-2); font-weight: 500; white-space: nowrap; }
  .follow-transfer__when .icon { display: inline-block; margin-right: 3px; vertical-align: -1px; color: var(--good); }
  .follow-transfer__verdict { white-space: normal; align-items: flex-start; }
  .follow-transfer__verdict::before { margin-top: 0.42em; }
  .follow-transfer__elevator { display: inline-flex; align-items: center; gap: 4px; color: var(--bad); font-weight: 600; }
  .follow-transfer .card__foot { padding: 12px 20px; }
  .follow-actions { display: flex; flex-wrap: wrap; gap: 8px; }
  .follow-actions .btn { flex: 1 1 auto; }
  .follow-actions .btn span { overflow: hidden; text-overflow: ellipsis; }
  .follow-actions .btn { min-width: 0; max-width: 100%; }
  .follow-head__actions { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 6px; }
  .follow-head__actions .btn { flex: 1 1 auto; min-width: 0; }
  @media (min-width: 640px) { .follow-head__actions .btn { flex: 0 0 auto; } }
  .follow-map .card__title { display: inline-flex; align-items: center; gap: 8px; flex: none; }
  .follow-map .card__head .row__meta { min-width: 0; }
  .follow-map .card__body { padding-top: 12px; }
  .follow-map__link { aspect-ratio: 25 / 16; }
  .follow-map__link svg { display: block; }
  html.is-stale .follow-map__vehicle { filter: grayscale(1); opacity: 0.6; }
  .follow-map__context { opacity: 0.35; }
  .follow-picker__more { margin-top: -4px; }
  @media (min-width: 960px) { .follow-side.is-tall { position: static; } }
  :root[data-simple] :is(.follow-map, .follow-facts, .follow-progress, [data-f-embed]) { display: none; }
  .follow-missing { max-width: 760px; }
  .follow-missing__icon { display: grid; place-items: center; width: 44px; height: 44px; border-radius: var(--r-m); background: var(--bg-sunken); color: var(--text-3); }
  .follow-missing__title { font-size: var(--fs-2xl); letter-spacing: -0.02em; }
  .follow-missing__body { color: var(--text-2); }
  .follow-missing .rows { margin-inline: -20px; }
  .follow-missing .row, .follow-missing .row-static { padding-inline: 20px; }
  @media (min-width: 768px) {
    .follow { padding-block: 28px 64px; }
    .ftl { --row: 60px; --x: 34px; }
    .ftl__row { grid-template-columns: 68px minmax(0, 1fr) auto; padding-right: 20px; }
  }
  .follow-facts .card__title { display: inline-flex; align-items: center; gap: 8px; }
  .follow-facts .card__title .icon { color: var(--text-3); }
  .follow-facts__blurb { margin-top: 10px; white-space: normal; }
  .follow-facts__note { color: var(--text-3); font-size: var(--fs-xs); }
  .follow-side .card__body > .row__meta { white-space: normal; }
}
@layer pages {
  .gd-head { display: grid; gap: 12px; justify-items: start; padding-block: 20px 24px; }
  .gd-head__text { display: grid; gap: 10px; max-width: 72ch; }
  .gd-head h1 { font-size: var(--fs-3xl); letter-spacing: -0.025em; }
  .gd-lede { color: var(--text-2); font-size: var(--fs-l); }
  .gd-meta { display: inline-flex; align-items: center; gap: 6px; color: var(--text-3); font-size: var(--fs-s); }
  .gd-meta .icon { color: var(--text-3); }
  .gd-kicker { color: var(--text-3); font-size: var(--fs-xs); font-weight: 700; letter-spacing: 0.04em; text-transform: uppercase; }
  .gd-lang-note {
    display: flex; align-items: flex-start; gap: 10px; max-width: 72ch; padding: 10px 14px;
    border: 1px solid var(--border); border-radius: var(--r-m); background: var(--bg-subtle);
    color: var(--text-2); font-size: var(--fs-s);
  }
  .gd-lang-note .icon { margin-top: 2px; color: var(--text-3); }
  .gd-lang-note a { font-weight: 600; }
  @media (min-width: 960px) { .gd-head { padding-block: 32px 28px; } }
  .gd-layout { display: grid; gap: 32px; padding-bottom: 40px; }
  .gd-main, .gd-aside, .gd-aside > * { min-width: 0; }
  .gd-main { display: grid; gap: 40px; align-content: start; }
  .gd-aside { display: grid; gap: 16px; align-content: start; }
  @media (min-width: 1024px) {
    .gd-layout { grid-template-columns: minmax(0, 1fr) 340px; gap: 48px; align-items: start; }
  }
  .gd-answer { display: grid; gap: 10px; padding: 20px; }
  .gd-answer h2 { font-size: var(--fs-xl); }
  .gd-answer__body { display: grid; gap: 14px; color: var(--text-2); }
  .gd-answer__body > p { color: var(--text); font-size: var(--fs-l); }
  .gd-checks { display: grid; gap: 8px; }
  .gd-checks li { display: flex; gap: 10px; align-items: flex-start; }
  .gd-checks .icon { margin-top: 3px; color: var(--text-3); }
  .gd-actions { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 6px; }
  .gd-actions .btn { white-space: normal; text-align: center; }
  .gd-article { display: grid; gap: 14px; }
  .gd-prose--article { gap: 28px; }
  .gd-prose section { display: grid; gap: 12px; }
  .gd-prose ul { display: grid; gap: 6px; margin: 0; padding-left: 1.25em; }
  .gd-prose li::marker { color: var(--text-3); }
  .gd-prose strong { color: var(--text); }
  .gd-prose a { font-weight: 600; }
  .gd-block { display: grid; gap: 12px; align-content: start; }
  .gd-block h2 { font-size: var(--fs-xl); }
  .gd-block__text { display: grid; gap: 10px; }
  .gd-block__text p { color: var(--text-2); max-width: 68ch; }
  .gd-notes__list { display: grid; gap: 12px; grid-template-columns: repeat(auto-fit, minmax(min(100%, 220px), 1fr)); margin-top: 4px; }
  .gd-notes__list li {
    display: grid; gap: 6px; align-content: start; padding: 14px 16px;
    border: 1px solid var(--border); border-radius: var(--r-m); background: var(--bg-subtle);
    color: var(--text-2); font-size: var(--fs-s);
  }
  .gd-faq { margin-top: 4px; }
  .gd-now { display: grid; gap: 4px; padding-top: 14px; border-top: 1px solid var(--border); }
  .gd-now .gd-label { margin-bottom: 2px; }
  .gd-route {
    display: grid; grid-template-columns: auto minmax(0, 1fr) auto; align-items: center; gap: 4px 12px;
    min-height: 52px; padding: 6px 0; color: var(--text); text-decoration: none;
  }
  .gd-route:hover { color: var(--text); }
  .gd-route:hover .gd-route__name { text-decoration: underline; }
  .gd-route > .badge { min-width: 60px; }
  .gd-route__text { display: grid; min-width: 0; }
  .gd-route__name { font-weight: 600; line-height: 1.3; }
  .gd-route__meta { color: var(--text-3); font-size: var(--fs-s); }
  .gd-now__routes > li + li { border-top: 1px solid var(--border); }
  .gd-route-grid { display: grid; gap: 10px; grid-template-columns: repeat(auto-fill, minmax(min(100%, 240px), 1fr)); }
  .gd-route-grid > li { display: grid; min-width: 0; }
  .gd-route-grid .gd-route {
    grid-template-columns: auto minmax(0, 1fr); align-content: center; padding: 12px 14px;
    border: 1px solid var(--border); border-radius: var(--r-m); background: var(--surface);
  }
  .gd-route-grid .gd-route > .badge { grid-row: span 2; }
  .gd-route-grid .gd-route > .status { grid-column: 2; }
  .gd-route-grid .gd-route:hover { border-color: var(--border-strong); background: var(--surface-hover); }
  .gd-fact { display: grid; gap: 8px; }
  .gd-fact > p { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 10px; }
  .gd-fact strong { font-weight: 650; }
  .gd-fact .live__dot { flex: none; }
  .gd-asof { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 10px; color: var(--text-3); font-size: var(--fs-s); }
  .gd-asof .icon { color: var(--text-3); }
  .gd-hubs + .gd-asof { margin-top: 14px; }
  .gd-hubs + .gd-asof .link-arrow { margin-left: auto; }
  .gd-tools__lede { padding-bottom: 8px; color: var(--text-2); font-size: var(--fs-s); }
  .gd-links { padding-bottom: 6px; }
  .gd-links .row { min-height: 52px; }
  .gd-links .row > .icon { color: var(--text-3); }
  .gd-links .row__title, .gd-links .row__meta { white-space: normal; }
  .gd-review { color: var(--text-3); font-size: var(--fs-s); }
  .gd-review strong { color: var(--text-2); font-weight: 600; }
  .gd-label { margin-bottom: 8px; color: var(--text-3); font-size: var(--fs-xs); font-weight: 700; letter-spacing: 0.04em; text-transform: uppercase; }
  .gd-link-list { display: grid; gap: 8px; font-size: var(--fs-s); font-weight: 600; }
  .gd-related .chip { white-space: normal; text-align: left; }
  .gd-band { padding-block: 32px; border-top: 1px solid var(--border); }
  .gd-band--first { border-top: 0; padding-top: 8px; }
  @media (min-width: 768px) { .gd-band { padding-block: 44px; } .gd-band--first { padding-top: 8px; } }
  .gd-section-head { flex-wrap: wrap; }
  .gd-section-head .gd-kicker { margin: 0 0 6px; }
  .gd-band__lede { max-width: 68ch; margin: -8px 0 20px; color: var(--text-2); }
  .gd-chips { display: flex; flex-wrap: wrap; gap: 8px; }
  .gd-chips .chip { white-space: normal; }
  .gd-grid { display: grid; gap: 12px; grid-template-columns: repeat(auto-fill, minmax(min(100%, 260px), 1fr)); }
  .gd-grid--two { grid-template-columns: repeat(auto-fill, minmax(min(100%, 240px), 1fr)); }
  .gd-grid > li { display: grid; min-width: 0; }
  .gd-card {
    display: flex; flex-direction: column; align-items: flex-start; gap: 6px; padding: 16px 18px;
    border: 1px solid var(--border); border-radius: var(--r-l); background: var(--surface);
    color: var(--text); text-decoration: none;
  }
  .gd-card:hover { border-color: var(--border-strong); background: var(--surface-hover); color: var(--text); }
  .gd-card__badges { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; }
  .gd-card > .gd-card__badges { margin-bottom: 4px; }
  .gd-card__title { font-size: var(--fs-l); font-weight: 700; line-height: 1.25; letter-spacing: -0.01em; }
  .gd-card__desc { color: var(--text-2); font-size: var(--fs-s); }
  .gd-card__more { display: inline-flex; flex-wrap: wrap; align-items: center; gap: 6px 8px; margin-top: auto; padding-top: 6px; color: var(--accent); font-size: var(--fs-s); font-weight: 600; }
  .gd-card--topic .gd-card__title { font-size: var(--fs-m); }
  .gd-card--topic .gd-tag { margin-top: auto; }
  .gd-card--link { flex-direction: row; align-items: center; gap: 12px; }
  .gd-card--link .gd-card__title { flex: 1; font-size: var(--fs-m); }
  .gd-card--link .icon { color: var(--text-3); }
  .gd-tag { display: inline-flex; padding: 1px 8px; border-radius: var(--r-full); background: var(--bg-sunken); color: var(--text-2); font-size: var(--fs-xs); font-weight: 600; }
  .gd-hubs { display: grid; gap: 12px; grid-template-columns: repeat(auto-fill, minmax(min(100%, 300px), 1fr)); }
  .gd-hub { display: grid; gap: 10px; align-content: start; padding: 18px; border: 1px solid var(--border); border-radius: var(--r-l); background: var(--surface); }
  .gd-hub__top { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 8px; }
  .gd-hub__live { display: inline-flex; align-items: center; gap: 8px; color: var(--text-2); font-size: var(--fs-s); font-weight: 600; }
  .gd-hub h3 { font-size: var(--fs-l); }
  .gd-hub p { color: var(--text-2); font-size: var(--fs-s); }
  .gd-hub .cluster { --gap: 10px 20px; margin-top: 4px; }
  .gd-overview { display: grid; gap: 20px 32px; grid-template-columns: repeat(auto-fit, minmax(min(100%, 240px), 1fr)); }
  .gd-overview h3 { font-size: var(--fs-m); }
  .gd-overview p { margin-top: 6px; color: var(--text-2); font-size: var(--fs-s); }
  :root[data-simple] :is(.gd-notes, .gd-tools, .gd-hubs-band, .gd-overview-band, .gd-sources-band, .gd-card__desc, .gd-meta, .gd-head .facts) { display: none; }
  :root[data-simple] .gd-layout { grid-template-columns: minmax(0, 1fr); }
}
@layer pages {
  .sel-head { display: flex; align-items: flex-start; gap: 12px; padding: 2px 8px 12px 16px; flex: none; }
  .sel-head__badge { flex: none; }
  .sel-head__icon {
    display: grid; place-items: center; width: 44px; height: 44px; flex: none;
    border-radius: var(--r-m); background: var(--bg-sunken); color: var(--text-2);
  }
  .sel-head__main { flex: 1; min-width: 0; display: grid; grid-template-columns: minmax(0, 1fr); gap: 3px; }
  .sel-head__title { font-size: var(--fs-l); line-height: 1.25; overflow-wrap: anywhere; }
  .sel-head__sub { display: flex; flex-wrap: wrap; align-items: center; gap: 2px 10px; color: var(--text-2); font-size: var(--fs-s); font-weight: 600; }
  .sel-head__age { color: var(--text-3); font-weight: 500; }
  .sel-head__next { display: flex; flex-wrap: wrap; align-items: center; gap: 4px 6px; color: var(--text); font-size: var(--fs-s); }
  .sel-head__next:empty { display: none; }
  .sel-head__next .badge { height: 20px; }
  .sel-head__to { color: var(--text-2); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; min-width: 0; max-width: 100%; }
  .sel-head__main > * { max-width: 100%; }
  .sel-head__close { flex: none; margin-top: -4px; }
  @media (min-width: 900px) { .sel-head { padding-top: 4px; } }
  .sel-actions { display: grid; grid-template-columns: repeat(auto-fit, minmax(58px, 1fr)); gap: 6px; padding: 0 16px 12px; }
  .sel-actions .btn {
    flex-direction: column; gap: 4px; min-height: 56px; padding: 6px 4px; border-radius: var(--r-m);
    font-size: var(--fs-xs); line-height: 1.15; white-space: normal; text-align: center;
  }
  .sel-actions .btn[data-copied] { color: var(--good); }
  .sel-section { padding-bottom: 4px; }
  .sel-note { color: var(--text-2); font-size: var(--fs-s); padding-block: 4px 12px; }
  .sel-earlier { margin: 0 16px 4px; min-height: 32px; padding: 0 10px; color: var(--accent); font-size: var(--fs-s); }
  .sel-facts { padding: 4px 16px 12px; }
  .sel-routes__chips { flex-wrap: wrap; padding: 0 16px 6px; overflow: visible; }
  .sel-chip { max-width: 100%; }
  .sel-chip span:last-child { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; min-width: 0; }
  .in-trip { list-style: none; margin: 0; padding: 0 0 8px; --line: var(--text-3); }
  .in-trip__stop {
    display: grid; grid-template-columns: 22px minmax(0, 1fr) auto; align-items: center; gap: 12px;
    width: 100%; min-height: 46px; padding: 0 16px; border: 0; background: transparent;
    color: var(--text); text-align: left; font: inherit;
  }
  .in-trip__stop:hover { background: var(--surface-hover); }
  .in-trip__node { position: relative; align-self: stretch; }
  .in-trip__node::before { content: ""; position: absolute; left: 50%; top: 0; bottom: 0; width: 4px; margin-left: -2px; background: var(--line); }
  .in-trip__row:first-child .in-trip__node::before { top: 50%; }
  .in-trip__row.is-last .in-trip__node::before { bottom: 50%; }
  .in-trip__node::after {
    content: ""; position: absolute; left: 50%; top: 50%; width: 12px; height: 12px; margin: -6px 0 0 -6px;
    border-radius: 50%; background: var(--surface); border: 3px solid var(--line);
  }
  .in-trip__row.is-passed .in-trip__node::before, .in-trip__row.is-passed .in-trip__node::after { opacity: 0.35; }
  .in-trip__row.is-next .in-trip__node::after { width: 16px; height: 16px; margin: -8px 0 0 -8px; background: var(--line); border-color: var(--surface); box-shadow: 0 0 0 2px var(--line); }
  .in-trip__name { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: var(--fs-s); font-weight: 500; }
  .in-trip__row.is-next .in-trip__name { font-weight: 700; }
  .in-trip__row.is-passed .in-trip__name { color: var(--text-3); }
  .in-trip__time { display: grid; justify-items: end; gap: 1px; font-size: var(--fs-s); font-weight: 600; line-height: 1.2; }
  .in-trip__time small { color: var(--text-3); font-size: var(--fs-xs); font-weight: 500; }
  .in-trip__row.is-passed .in-trip__time { color: var(--text-3); font-weight: 500; }
  .in-deps { list-style: none; margin: 0; padding: 0; }
  .in-dep {
    display: flex; align-items: center; gap: 12px; width: 100%; min-height: 60px; padding: 8px 16px;
    border: 0; background: transparent; color: var(--text); text-align: left; font: inherit;
  }
  .in-deps > li + li > .in-dep { border-top: 1px solid var(--border); }
  button.in-dep { cursor: pointer; }
  button.in-dep:hover { background: var(--surface-hover); }
  .in-dep > .badge--m { min-width: 52px; }
  .in-dep__main { flex: 1; min-width: 0; display: grid; gap: 2px; }
  .in-dep__to { font-weight: 600; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
  .in-dep__meta { display: flex; flex-wrap: wrap; align-items: center; gap: 0 8px; color: var(--text-3); font-size: var(--fs-xs); font-weight: 600; }
  .in-dep__kind { display: inline-flex; align-items: center; gap: 4px; }
  .in-dep__kind--live { color: var(--good); }
  .in-dep__kind--ghost { color: var(--warn); }
  html.is-stale .in-dep__kind--live { color: var(--text-3); }
  .in-dep__delay--warn { color: var(--warn); }
  .in-dep__delay--bad { color: var(--bad); }
  .in-dep__when { display: grid; justify-items: end; gap: 1px; flex: none; line-height: 1.2; }
  .in-dep__when strong { font-size: var(--fs-l); font-weight: 750; }
  .in-dep__when small { color: var(--text-3); font-size: var(--fs-xs); }
  .in-dep--ghost .in-dep__when strong { color: var(--text-3); text-decoration: line-through dotted; text-decoration-thickness: 1px; }
  .in-dep--sched .in-dep__when strong { font-weight: 650; }
  .sel-empty { display: grid; gap: 6px; padding-block: 8px 16px; color: var(--text-2); font-size: var(--fs-s); }
  .sel-empty__title { color: var(--text); font-size: var(--fs-m); font-weight: 700; }
  .sel-empty__when { color: var(--text); font-weight: 600; }
  .sel-empty__first { margin-top: 4px; padding-inline: 0; border-top: 1px solid var(--border); }
  .place-row .row__title { white-space: normal; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; }
  .mini-deps { display: grid; justify-items: end; gap: 4px; color: var(--text-2); font-weight: 600; }
  .mini-dep { display: inline-flex; align-items: center; gap: 6px; white-space: nowrap; }
  .mini-dep .badge { height: 20px; min-width: 26px; font-size: 0.6875rem; }
  .mini-dep.is-live .num { color: var(--good); }
  .mini-none { color: var(--text-3); font-weight: 500; white-space: nowrap; }
  .row--muted { align-items: center; color: var(--text-3); }
  .row--muted .badge { opacity: 0.55; }
  .nearby-status { color: var(--text-2); font-size: var(--fs-s); padding-block: 12px 4px; }
  .nearby-again { min-height: 28px; width: 28px; padding: 0; margin: -6px -6px -6px 0; color: var(--text-3); }
  :root[data-simple] :is(.sel-facts, [data-v-facts-wrap], [data-v-embed], [data-s-embed], .sel-earlier, .sel-head__age) { display: none !important; }
  :root[data-simple] .in-deps > li:nth-child(n + 5) { display: none; }
  :root[data-simple] .in-dep__when strong { font-size: var(--fs-xl); }
  :root[data-simple] .sel-actions { grid-template-columns: repeat(auto-fit, minmax(72px, 1fr)); }
  .agency-stops { list-style: none; margin: 12px 0 0; padding: 0; }
  .agency-stops li { position: relative; padding: 9px 0 9px 26px; font-size: var(--fs-s); border-bottom: 1px solid var(--border); }
  .agency-stops li:last-child { border-bottom: 0; }
  .agency-stops li::before {
    content: ""; position: absolute; z-index: 1; left: 7px; top: 50%; width: 9px; height: 9px; margin-top: -5px;
    border-radius: 50%; border: 2px solid var(--text-3); background: var(--surface);
  }
  .agency-stops li::after { content: ""; position: absolute; left: 11px; top: 0; bottom: 0; border-left: 2px solid var(--border); }
  .agency-stops li:first-child::after { top: 50%; }
  .agency-stops li:last-child::after { bottom: 50%; }
  .in-dep__kind--est { color: var(--text-2); }
  .in-agency-note { padding: 12px 16px 4px; color: var(--text-3); font-size: var(--fs-s); display: grid; gap: 4px; }
  .in-agency-note a { font-weight: 600; }
}
@layer pages {
  :root[data-railfan] .diagram { --x: 62px; }
  :root[data-railfan] .diagram__link { margin-left: calc(var(--x) + 24px); }
  :root[data-railfan] .diagram__train::after {
    content: attr(data-train);
    position: absolute; right: calc(100% + 4px); top: 50%; transform: translateY(-50%);
    padding: 0 4px; border: 1px solid var(--border-strong); border-radius: 4px;
    background: var(--surface); color: var(--text);
    font: 700 0.65625rem/15px var(--font); font-variant-numeric: tabular-nums; letter-spacing: 0.01em; white-space: nowrap;
    pointer-events: none;
  }
  .veh-pop__facts { display: grid; gap: 1px; margin: 6px 0 0; font-size: var(--fs-xs); }
  .veh-pop__facts div { display: flex; gap: 6px; }
  .veh-pop__facts dt { color: var(--text-3); }
  .veh-pop__facts dd { margin: 0; color: var(--text); font-weight: 600; }
  .veh-pop__note { margin-top: 6px; color: var(--text-3); font-size: var(--fs-xs); }
  .fleet { padding-block: 20px 48px; }
  .fleet-head { display: grid; gap: 10px; padding-bottom: 20px; }
  .fleet-head h1 { font-size: var(--fs-3xl); letter-spacing: -0.025em; }
  .fleet-head__lede { color: var(--text-2); font-size: var(--fs-l); max-width: 60ch; }
  .fleet-head .live { flex-wrap: wrap; white-space: normal; }
  .fleet-error { margin-bottom: 16px; }
  @media (min-width: 960px) { .fleet { padding-top: 32px; } }
  .fleet-stats { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; }
  @media (min-width: 720px) { .fleet-stats { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 12px; } }
  .fleet-stat { display: grid; align-content: start; gap: 2px; padding: 14px 16px; border: 1px solid var(--border); border-radius: var(--r-l); background: var(--surface); }
  .fleet-stat__n { font-size: var(--fs-2xl); font-weight: 750; letter-spacing: -0.02em; line-height: 1.1; }
  .fleet-stat__label { color: var(--text-2); font-size: var(--fs-s); font-weight: 600; }
  .fleet-stat__of { color: var(--text-3); font-size: var(--fs-xs); }
  .fleet-stat__of:empty { display: none; }
  .fleet-power { margin-top: 24px; }
  .fleet-power h2, .fleet-roster__head h2 { font-size: var(--fs-l); }
  .fleet-power__list { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 10px; }
  .fleet-power__item { white-space: normal; text-align: left; }
  .fleet-layout { display: grid; gap: 24px; margin-top: 32px; }
  .fleet-roster, .fleet-aside, .fleet-aside > * { min-width: 0; }
  .fleet-aside { display: grid; gap: 16px; align-content: start; }
  @media (min-width: 1024px) {
    .fleet-layout { grid-template-columns: minmax(0, 1fr) 340px; gap: 40px; align-items: start; }
    .fleet-aside { position: sticky; top: calc(var(--header-h) + 16px); }
  }
  .fleet-roster__head { display: flex; align-items: baseline; justify-content: space-between; gap: 12px; }
  .fleet-filters { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; margin: 12px 0 4px; }
  .fleet-search {
    display: flex; align-items: center; gap: 8px; flex: 1 1 220px; min-width: 0; min-height: 40px; padding: 0 12px;
    border: 1px solid var(--border-strong); border-radius: var(--r-full); background: var(--surface); color: var(--text-3);
  }
  .fleet-search:focus-within { box-shadow: var(--ring); border-color: var(--accent); }
  .fleet-search input { flex: 1; min-width: 0; height: 38px; border: 0; background: transparent; color: var(--text); outline: none; font-size: var(--fs-m); }
  .fleet-out { flex: none; }
  .fleet-select { flex: 1 1 150px; min-width: 0; }
  .fleet-select select {
    width: 100%; min-height: 40px; padding: 0 34px 0 14px; border: 1px solid var(--border-strong); border-radius: var(--r-full);
    background: var(--surface); color: var(--text); font-size: var(--fs-s); font-weight: 600; appearance: none;
    background-image: linear-gradient(45deg, transparent 50%, var(--text-3) 50%), linear-gradient(135deg, var(--text-3) 50%, transparent 50%);
    background-position: calc(100% - 18px) 50%, calc(100% - 13px) 50%; background-size: 5px 5px; background-repeat: no-repeat;
  }
  .fleet-select select:focus-visible { box-shadow: var(--ring); }
  .fleet-modes { flex: 1 1 100%; }
  .fleet-out .icon { color: inherit; }
  @media (pointer: coarse) { .fleet-search, .fleet-select select { min-height: 44px; } }
  .fleet-group { margin-top: 24px; }
  .fleet-group__title { display: flex; flex-wrap: wrap; align-items: baseline; gap: 4px 10px; padding-bottom: 8px; border-bottom: 1px solid var(--border); font-size: var(--fs-l); }
  .fleet-group__count, .fleet-line__count { color: var(--text-3); font-size: var(--fs-s); font-weight: 500; }
  .fleet-line { margin-top: 14px; }
  .fleet-line__title { display: flex; flex-wrap: wrap; align-items: center; gap: 4px 8px; margin-bottom: 8px; font-size: var(--fs-m); font-weight: 650; }
  .fleet-line__count { margin-left: auto; }
  .fleet-tiles { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 172px), 1fr)); gap: 8px; list-style: none; margin: 0; padding: 0; }
  @media (max-width: 420px) { .fleet-tiles { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
  .fleet-tile {
    display: grid; gap: 3px; height: 100%; padding: 10px 12px;
    border: 1px solid var(--border); border-radius: var(--r-m); background: var(--surface); color: var(--text); text-decoration: none;
  }
  .fleet-tile.is-link:hover { border-color: var(--border-strong); background: var(--surface-hover); color: var(--text); }
  .fleet-tile__top { display: flex; align-items: center; justify-content: space-between; gap: 6px; min-width: 0; }
  .fleet-tile__id { font-size: var(--fs-l); font-weight: 750; letter-spacing: -0.01em; }
  .fleet-tile__runs { display: inline-flex; flex-wrap: wrap; justify-content: flex-end; gap: 3px; }
  .fleet-tile__runs .badge, .fleet-badges .badge { height: 18px; min-width: 22px; padding: 0 5px; font-size: 0.6875rem; border-radius: 5px; }
  .fleet-tile__model { font-size: var(--fs-s); font-weight: 600; line-height: 1.3; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
  .fleet-tile__model.is-unknown { color: var(--text-3); font-weight: 500; }
  .fleet-tile__meta { color: var(--text-3); font-size: var(--fs-xs); }
  .fleet-tile__status { display: flex; flex-wrap: wrap; align-items: center; gap: 0 4px; margin-top: 2px; color: var(--text-2); font-size: var(--fs-xs); font-weight: 600; }
  .fleet-tile__status > span { white-space: nowrap; }
  .fleet-tile__status .icon { width: 13px; height: 13px; }
  .fleet-tile__status.is-out { color: var(--good); }
  .fleet-tile__since { color: var(--text-3); font-weight: 500; }
  .fleet-empty { display: grid; justify-items: start; gap: 10px; padding: 20px 0; color: var(--text-2); font-size: var(--fs-s); }
  .fleet-rare { display: grid; gap: 12px; list-style: none; margin: 0; padding: 0; font-size: var(--fs-s); }
  .fleet-rare li { display: flex; gap: 10px; align-items: flex-start; }
  .fleet-rare li > .icon { margin-top: 2px; color: var(--text-3); }
  .fleet-rare a { font-weight: 600; }
  .fleet-rare__note { padding-top: 12px; border-top: 1px solid var(--border); color: var(--text-2); }
  .fleet-badges { display: inline-flex; flex-wrap: wrap; gap: 3px; vertical-align: 1px; }
  .fleet-rare .badge { height: 18px; min-width: 22px; padding: 0 5px; font-size: 0.6875rem; border-radius: 5px; vertical-align: 1px; }
  .fleet-models { padding: 0 0 8px; overflow-x: auto; }
  .fleet-models__table { width: 100%; border-collapse: collapse; font-size: var(--fs-s); }
  .fleet-models__table th, .fleet-models__table td { padding: 8px 20px; text-align: left; vertical-align: top; border-top: 1px solid var(--border); }
  .fleet-models__table thead th { border-top: 0; color: var(--text-3); font-size: var(--fs-xs); font-weight: 700; }
  .fleet-models__table td, .fleet-models__table thead th + th { text-align: right; padding-left: 8px; white-space: nowrap; }
  .fleet-models__table tbody th { font-weight: 600; }
  .fleet-models__table tr.is-unknown th { color: var(--text-3); font-weight: 500; }
  .fleet-models__name { display: block; }
  .fleet-models__meta { display: block; color: var(--text-3); font-size: var(--fs-xs); font-weight: 500; }
  .fleet-note { color: var(--text-3); font-size: var(--fs-xs); }
}
@layer pages {
  :root {
    --chart-ontime: light-dark(#2a78d6, #3987e5);
    --chart-late: light-dark(#eb6834, #d95926);
    --chart-early: light-dark(#1baf7a, #199e70);
    --chart-thin: light-dark(#dfe3e8, #2b3442);
    --chart-prev: var(--text);
  }
  .diagram { --fold: 44px; }
  .diagram__row--fold { height: auto; min-height: var(--fold); }
  .diagram__fold {
    display: flex; align-items: center; gap: 10px; height: var(--fold); margin-left: 52px; padding: 0 12px;
    border-radius: var(--r-m); color: var(--text-2); font-size: var(--fs-s); font-weight: 600;
    list-style: none; cursor: pointer; user-select: none;
  }
  .diagram__fold::-webkit-details-marker { display: none; }
  .diagram__fold::after {
    content: ""; width: 7px; height: 7px; margin-top: -4px;
    border-right: 2px solid currentColor; border-bottom: 2px solid currentColor; transform: rotate(45deg);
  }
  details[open] > .diagram__fold::after { margin-top: 3px; transform: rotate(225deg); }
  .diagram__fold:hover { background: var(--surface-hover); color: var(--text); }
  .diagram__stops { margin: 0 0 8px 52px; padding: 0; list-style: none; }
  .diagram__stops a { display: block; padding: 9px 12px; border-radius: var(--r-m); color: var(--text); text-decoration: none; }
  .diagram__stops a:hover { background: var(--surface-hover); }
  .diagram__row.after-fold { --span: calc(var(--row) / 2 + var(--fold) / 2); }
  .diagram__train, .diagram__ghost { top: calc(50% - (1 - var(--p)) * var(--span, var(--row))); }
  .route-bar .chip--stops .icon { color: currentColor; }
  @media (max-width: 639px) { .route-bar:not(:has(.segmented, .chip)) { display: none; } }
  @media (max-width: 639px) { .route-page .eta__none { display: block; max-width: 6.5em; white-space: normal; line-height: 1.25; } }
  .legend .icon { flex: none; }
  @media (max-width: 420px) {
    .route-head__actions [data-favorite] { width: 48px; padding: 0; }
    .route-head__actions [data-favorite] span { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
  }
  .tt-next { margin: 4px 0 8px; }
  .tt-status { column-gap: 12px; }
  @media (min-width: 1024px) { .route-aside.is-tall { position: static; } }
  .tt-days { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; margin-bottom: 14px; }
  .tt-day[aria-pressed="true"] { background: var(--text); border-color: var(--text); color: var(--bg); }
  .tt-date input {
    min-height: 36px; padding: 0 12px; border: 1px solid var(--border); border-radius: var(--r-full);
    background: var(--surface); color: var(--text); font-size: var(--fs-s); font-weight: 600;
  }
  .tt-date input:hover { border-color: var(--border-strong); }
  @media (pointer: coarse) { .tt-date input { min-height: 40px; } }
  .tt-status { display: flex; flex-wrap: wrap; align-items: baseline; gap: 2px 8px; margin: 4px 0 14px; font-size: var(--fs-l); }
  .tt-status strong { font-weight: 700; }
  .tt-status span { color: var(--text-2); font-size: var(--fs-m); }
  .tt-still {
    display: flex; gap: 10px; align-items: flex-start; margin: 0 0 14px; padding: 10px 14px;
    border-radius: var(--r-m); background: var(--accent-soft); color: var(--text); font-size: var(--fs-s);
  }
  .tt-still .icon { color: var(--accent); margin-top: 1px; }
  .tt-still[hidden] { display: none; }
  .hours__sep {
    padding: 8px 14px; border-top: 1px solid var(--border); background: var(--bg-subtle);
    color: var(--text-2); font-size: var(--fs-xs); font-weight: 700; break-inside: avoid; break-after: avoid;
  }
  .hours__sep:first-child { border-top: 0; }
  .ot { display: grid; gap: 16px; max-width: 960px; }
  .ot-headline { display: grid; gap: 4px; }
  .ot-big { display: flex; flex-wrap: wrap; align-items: baseline; gap: 4px 10px; }
  .ot-big strong { font-size: var(--fs-2xl); font-weight: 750; letter-spacing: -0.02em; }
  .ot-big span { color: var(--text-2); font-size: var(--fs-l); font-weight: 600; }
  .ot-big--quiet strong { font-size: var(--fs-xl); }
  .ot-sub { color: var(--text-2); font-size: var(--fs-s); }
  .ot-legend { display: flex; flex-wrap: wrap; gap: 6px 18px; margin: 0; padding: 0; list-style: none; color: var(--text-2); font-size: var(--fs-s); }
  .ot-legend li { display: inline-flex; align-items: center; gap: 8px; }
  .ot-key { display: inline-block; width: 12px; height: 12px; border-radius: 3px; flex: none; }
  .ot-key--on { background: var(--chart-ontime); }
  .ot-key--late { background: var(--chart-late); }
  .ot-key--early { background: var(--chart-early); }
  .ot-key--thin { background: var(--chart-thin); }
  .ot-key--prev { width: 18px; height: 3px; border-radius: 2px; background: var(--chart-prev); }
  .ot-figure { margin: 0; display: grid; gap: 10px; }
  .ot-plot { display: grid; grid-template-columns: 40px minmax(0, 1fr); border-radius: var(--r-m); }
  .ot-plot:focus-visible { box-shadow: var(--ring); }
  .ot-y { position: relative; }
  .ot-y span {
    position: absolute; right: 8px; transform: translateY(-50%);
    color: var(--text-3); font-size: var(--fs-xs); font-variant-numeric: tabular-nums;
  }
  .ot-area { position: relative; min-width: 0; }
  .ot-svg { display: block; overflow: visible; touch-action: pan-y; }
  .ot-x { position: relative; height: 22px; }
  .ot-x span { position: absolute; top: 4px; transform: translateX(-50%); color: var(--text-3); font-size: var(--fs-xs); white-space: nowrap; }
  .ot-on { fill: var(--chart-ontime); }
  .ot-late { fill: var(--chart-late); }
  .ot-early { fill: var(--chart-early); }
  .ot-thin { fill: var(--chart-thin); }
  .ot-grid { stroke: var(--border); stroke-width: 1; }
  .ot-axis { stroke: var(--border-strong); stroke-width: 1; }
  .ot-ring { stroke: var(--bg); stroke-width: 7; stroke-linecap: round; }
  .ot-prev { stroke: var(--chart-prev); stroke-width: 2.5; stroke-linecap: round; }
  .ot-band { fill: var(--bg-sunken); opacity: 0; }
  .ot-band.is-on { opacity: 1; }
  .ot-tip {
    position: absolute; top: -6px; z-index: 3; transform: translate(-50%, -100%);
    display: grid; gap: 2px; padding: 8px 12px; border: 1px solid var(--border); border-radius: var(--r-m);
    background: var(--surface); box-shadow: var(--shadow-2); color: var(--text);
    font-size: var(--fs-s); white-space: nowrap; pointer-events: none;
  }
  .ot-tip__h { font-size: var(--fs-xs); color: var(--text-2); }
  .ot-tip__n { color: var(--text-2); }
  .ot-figure figcaption { color: var(--text-2); font-size: var(--fs-s); }
  .ot-table { border-top: 1px solid var(--border); border-bottom: 1px solid var(--border); }
  .ot-table summary {
    display: flex; justify-content: space-between; align-items: center; gap: 16px;
    padding: 14px 0; font-weight: 600; cursor: pointer; list-style: none;
  }
  .ot-table summary::-webkit-details-marker { display: none; }
  .ot-table summary .icon { color: var(--text-3); transition: transform 0.2s var(--ease); }
  .ot-table[open] summary .icon { transform: rotate(180deg); }
  .ot-scroll { overflow-x: auto; padding-bottom: 12px; }
  .ot-table table { width: 100%; border-collapse: collapse; font-size: var(--fs-s); font-variant-numeric: tabular-nums; }
  .ot-table th, .ot-table td { padding: 8px 12px 8px 0; border-bottom: 1px solid var(--border); text-align: right; white-space: nowrap; }
  .ot-table th:first-child { text-align: left; }
  .ot-table thead th { color: var(--text-2); font-weight: 600; }
  .ot-table tbody th { font-weight: 600; }
  .ot-table .is-thin td, .ot-table .is-thin th { color: var(--text-3); }
  .ot-empty {
    display: flex; gap: 14px; align-items: flex-start; max-width: 70ch; padding: 18px 20px;
    border-radius: var(--r-l); background: var(--bg-subtle); color: var(--text-2);
  }
  .ot-empty .icon { color: var(--text-3); margin-top: 2px; }
  .ot-empty strong { color: var(--text); }
  .ot-empty p { margin-top: 4px; font-size: var(--fs-s); }
  .conn-head { margin: 24px 0 12px; color: var(--text-2); font-size: var(--fs-s); font-weight: 700; letter-spacing: 0; }
  .section-head + .conn-head { margin-top: 0; }
  .xfers { display: grid; gap: 8px; margin: 0; padding: 0; list-style: none; grid-template-columns: repeat(auto-fill, minmax(min(100%, 280px), 1fr)); }
  .xfer {
    display: flex; align-items: center; gap: 12px; min-height: 56px; padding: 8px 14px;
    border: 1px solid var(--border); border-radius: var(--r-m); background: var(--surface); color: var(--text); text-decoration: none;
  }
  .xfer:hover { border-color: var(--border-strong); background: var(--surface-hover); color: var(--text); }
  .xfer .badge { min-width: 48px; }
  .xfer__main { display: grid; min-width: 0; }
  .xfer__main strong { font-weight: 600; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
  .xfer__main span { color: var(--text-2); font-size: var(--fs-s); display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
  .xfers-more { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; margin-top: 14px; color: var(--text-2); font-size: var(--fs-s); }
  .xfers-more span:first-child { margin-right: 4px; }
  .xfers-more__link { display: inline-flex; border-radius: var(--r-s); text-decoration: none; }
  .xfers-more__link .badge { height: 26px; min-width: 36px; }
  .xfers-more__link:hover .badge { box-shadow: 0 0 0 2px var(--border-strong); }
  :root[data-simple] .diagram { --fold: 52px; }
  :root[data-simple] .diagram__fold { font-size: var(--fs-m); }
  :root[data-simple] .diagram__name strong { white-space: normal; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; line-height: 1.2; }
}
@layer pages {
  .ski-hero { padding-block: 32px 28px; border-bottom: 1px solid var(--border); }
  .ski-hero__inner { display: grid; gap: 14px; }
  .ski-eyebrow { display: none; }
  .ski-hero h1 { font-size: var(--fs-3xl); letter-spacing: -0.025em; }
  .ski-hero__lede { max-width: 62ch; color: var(--text-2); font-size: var(--fs-l); }
  .ski-hero__lede [data-ski-lede] { color: var(--text); font-weight: 600; }
  .ski-hero__actions { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 14px; }
  .ski-hero__actions .icon--xs { margin-left: -2px; opacity: 0.8; }
  .ski-hero__source { color: var(--text-3); font-size: var(--fs-s); }
  .ski-hero__live { margin-top: 2px; }
  .ski-roads { display: grid; gap: 10px; max-width: 640px; padding: 14px 16px; border: 1px solid var(--border); border-radius: var(--r-l); background: var(--surface); }
  .ski-roads__head { display: flex; flex-wrap: wrap; align-items: baseline; justify-content: space-between; gap: 4px 12px; }
  .ski-roads__head h2 { font-size: var(--fs-m); }
  .ski-roads__head a { font-size: var(--fs-s); font-weight: 600; }
  .ski-roads__list { display: grid; gap: 8px; margin: 0; padding: 0; list-style: none; }
  .ski-road { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 2px 12px; }
  .ski-road__name { font-weight: 600; }
  .ski-road__sr { color: var(--text-3); font-size: var(--fs-xs); font-weight: 500; }
  .ski-road .status { white-space: normal; }
  .ski-roads__posts { display: grid; gap: 6px; padding-top: 10px; border-top: 1px solid var(--border); font-size: var(--fs-s); }
  .ski-roads__when { font-weight: 600; }
  .ski-roads__source { color: var(--text-3); font-size: var(--fs-xs); }
  .ski-jump { margin-top: 4px; flex-wrap: wrap; overflow: visible; }
  .ski-page a:not(.btn):not(.chip) > .icon { display: inline-block; vertical-align: -2px; margin-left: 4px; }
  .ski-jump .chip { gap: 8px; }
  .ski-jump__count {
    display: inline-grid; place-items: center; min-width: 22px; height: 22px; padding: 0 6px;
    border-radius: var(--r-full); background: var(--bg-sunken); color: var(--text-2); font-size: var(--fs-xs);
  }
  @media (min-width: 960px) {
    .ski-hero { padding-block: 48px 40px; }
  }
  .ski-main { display: grid; gap: 8px; padding-block: 24px 56px; }
  .ski-canyon { display: grid; gap: 16px; padding-block: 24px; scroll-margin-top: calc(var(--header-h) + 16px); }
  .ski-canyon + .ski-canyon { border-top: 1px solid var(--border); }
  .ski-canyon__head { display: flex; flex-wrap: wrap; align-items: end; justify-content: space-between; gap: 12px; }
  .ski-canyon__head h2 { font-size: var(--fs-2xl); }
  .ski-canyon__head p { margin-top: 4px; color: var(--text-2); }
  .ski-canyon__links { display: flex; flex-wrap: wrap; gap: 8px; }
  .ski-canyon__links .chip { min-height: 32px; font-size: var(--fs-xs); max-width: 100%; flex: 0 1 auto; padding-block: 6px; line-height: 1.3; }
  .ski-canyon__links .icon--xs, .ski-links a .icon--xs { margin-left: 2px; color: var(--text-3); }
  .ski-cards { display: grid; gap: 16px; }
  .ski-card { overflow: hidden; }
  .ski-card__head { display: flex; align-items: center; gap: 12px; padding: 16px 20px; }
  .ski-card__title { flex: 1; min-width: 0; }
  .ski-card__title h3 { font-size: var(--fs-l); }
  .ski-card__title p { color: var(--text-2); font-size: var(--fs-s); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
  .ski-live {
    display: inline-flex; align-items: center; gap: 6px; flex: none;
    padding: 4px 10px; border-radius: var(--r-full); background: var(--bg-sunken);
    color: var(--text-3); font-size: var(--fs-xs); font-weight: 700; white-space: nowrap;
  }
  .ski-live .live__dot { background: var(--text-3); }
  .ski-live .live__dot::after { display: none; }
  .ski-live.is-on { background: var(--good-soft); color: var(--good); }
  .ski-live.is-on .live__dot { background: var(--live); }
  .ski-live.is-on .live__dot::after { display: block; }
  @media (max-width: 559px) {
    .ski-card__head { flex-wrap: wrap; align-items: flex-start; }
    .ski-card__title { flex: 1 1 calc(100% - 64px); }
    .ski-card__title p { white-space: normal; }
    .ski-live { margin-left: 52px; }
  }
  .ski-card__map { border-block: 1px solid var(--border); background: var(--map-land); }
  .ski-map { display: block; width: 100%; height: min(var(--map-h, 220px), 62vw); }
  .ski-map__casing { fill: none; stroke: light-dark(#ffffff, #8a96a8); stroke-linecap: round; stroke-linejoin: round; }
  .ski-map__line { fill: none; stroke-linecap: round; stroke-linejoin: round; }
  .ski-map__stop { fill: var(--surface); stroke: var(--text-2); }
  .ski-map__stop.is-key { stroke: var(--text); }
  .ski-map__labels {
    fill: var(--text-2); font-family: var(--font); font-weight: 600;
    paint-order: stroke; stroke: var(--map-land); stroke-linejoin: round;
  }
  .ski-alert {
    display: flex; gap: 10px; align-items: flex-start; margin: 16px 20px 0; padding: 12px 14px;
    border-radius: var(--r-m); background: var(--warn-soft); color: var(--warn); font-size: var(--fs-s);
  }
  .ski-alert strong { display: block; color: var(--text); font-weight: 600; }
  .ski-alert p { color: var(--text-2); display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
  .ski-card__body { display: grid; gap: 20px; padding: 16px 20px 20px; }
  @media (min-width: 900px) {
    .ski-card__body { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); }
    .ski-block--wide { grid-column: 1 / -1; }
  }
  .ski-block { display: grid; gap: 8px; align-content: start; }
  .ski-block h4 { color: var(--text-3); font-size: var(--fs-xs); font-weight: 700; letter-spacing: 0.06em; text-transform: uppercase; }
  .ski-muted { color: var(--text-3); font-size: var(--fs-s); }
  .ski-service { display: grid; gap: 0; list-style: none; margin: 0; padding: 0; }
  .ski-service li { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 2px 12px; padding: 8px 0; border-top: 1px solid var(--border); font-size: var(--fs-s); }
  .ski-service li:first-child { border-top: 0; padding-top: 0; }
  .ski-service span { color: var(--text-2); }
  .ski-service strong { font-weight: 600; }
  .ski-buses { display: grid; gap: 8px; list-style: none; margin: 0; padding: 0; }
  .ski-bus { display: flex; gap: 10px; align-items: flex-start; font-size: var(--fs-s); }
  .ski-bus__dot { display: grid; place-items: center; width: 26px; height: 26px; flex: none; border-radius: 50%; background: var(--c, var(--text-2)); color: #fff; }
  .ski-bus__main span { color: var(--text-2); }
  .ski-bus__meta { display: block; color: var(--text-3) !important; font-size: var(--fs-xs); }
  .ski-deps { display: grid; list-style: none; margin: 0; padding: 0; border: 1px solid var(--border); border-radius: var(--r-m); overflow: hidden; }
  .ski-dep { display: flex; align-items: center; justify-content: space-between; gap: 12px; min-height: 56px; padding: 8px 14px; background: var(--surface); }
  .ski-dep + .ski-dep { border-top: 1px solid var(--border); }
  .ski-dep__stop { display: grid; gap: 1px; min-width: 0; }
  .ski-dep__stop strong { font-weight: 600; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
  .ski-dep__stop span { color: var(--text-3); font-size: var(--fs-xs); }
  .ski-dep__times { display: grid; justify-items: end; gap: 1px; flex: none; text-align: right; font-variant-numeric: tabular-nums; }
  .ski-dep__eta { display: inline-flex; align-items: center; gap: 4px; font-weight: 700; }
  .ski-dep__eta.is-live { color: var(--good); }
  .ski-dep__eta.is-sched { color: var(--text-2); font-weight: 600; }
  .ski-dep__eta.is-ghost { color: var(--text-3); font-weight: 600; }
  .ski-dep__clock, .ski-dep__then, .ski-dep__note, .ski-dep__none { color: var(--text-3); font-size: var(--fs-xs); }
  .ski-dep__note { font-style: italic; }
  html.is-stale .ski-dep__eta.is-live { color: var(--text-3); }
  .ski-empty {
    display: flex; gap: 12px; align-items: center; padding: 20px;
    border: 1px dashed var(--border-strong); border-radius: var(--r-l);
    background: color-mix(in srgb, var(--accent) 5%, var(--surface)); color: var(--text-2);
  }
  .ski-empty .icon { width: 28px; height: 28px; color: var(--accent); }
  .ski-before { display: grid; gap: 12px; margin-top: 16px; padding: 20px; border: 1px solid var(--border); border-radius: var(--r-l); background: var(--bg-subtle); }
  .ski-before h2 { font-size: var(--fs-xl); }
  .ski-links { border: 1px solid var(--border); border-radius: var(--r-m); background: var(--surface); overflow: hidden; }
  .ski-links .row { align-items: flex-start; padding-block: 12px; }
  .ski-links .row > .icon { margin-top: 2px; color: var(--text-3); }
  .ski-links .row__title { white-space: normal; }
  .ski-links .row__title a { color: var(--text); text-decoration: none; }
  .ski-links .row__title a:hover { color: var(--accent); text-decoration: underline; }
  .ski-links__pair { display: flex; flex-wrap: wrap; gap: 4px 16px; white-space: normal; }
  .ski-links__pair a { font-weight: 600; text-decoration: none; }
  .ski-links__pair a:hover { text-decoration: underline; }
  .ski-before__note { margin-top: -2px; }
}
@layer pages {
  .st-head { display: grid; gap: 14px; padding-block: 20px 20px; }
  .st-head__top { display: flex; align-items: center; gap: 14px; }
  .st-pin {
    display: grid; place-items: center; width: 52px; height: 52px; flex: none;
    border-radius: var(--r-m); background: var(--bg-sunken); color: var(--text);
  }
  .st-pin .icon { width: 26px; height: 26px; }
  .st-head__title { min-width: 0; flex: 1; }
  .st-head h1 { font-size: var(--fs-3xl); letter-spacing: -0.025em; }
  .st-sub { color: var(--text-2); }
  .st-head__lines { display: flex; flex-wrap: wrap; gap: 8px; }
  .st-head__bar { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 12px; }
  .st-head__actions { display: flex; flex-wrap: wrap; gap: 8px; }
  .st-tv-clock { display: none; }
  .st-tv-exit { display: none; }
  @media (min-width: 960px) { .st-head { padding-block: 32px 24px; } }
  .st-layout { display: grid; gap: 24px; padding-block: 8px 48px; }
  .st-aside { display: grid; gap: 16px; align-content: start; }
  @media (min-width: 1024px) {
    .st-layout { grid-template-columns: minmax(0, 1fr) 340px; gap: 40px; align-items: start; }
  }
  .st-board { display: grid; gap: 16px; }
  .st-line { border: 1px solid var(--border); border-radius: var(--r-l); background: var(--surface); overflow: hidden; }
  .st-line__head { display: flex; align-items: center; gap: 12px; padding: 14px 18px; border-bottom: 1px solid var(--border); }
  .st-line__head h2 { flex: 1; min-width: 0; font-size: var(--fs-l); }
  .st-rows { list-style: none; margin: 0; padding: 0; }
  .st-row { display: grid; gap: 10px; padding: 14px 18px; }
  .st-row + .st-row { border-top: 1px solid var(--border); }
  .st-row__dest { display: flex; flex-wrap: wrap; align-items: baseline; gap: 4px 10px; min-width: 0; }
  .st-row__to { font-weight: 700; font-size: var(--fs-l); }
  .st-row__meta { color: var(--text-3); font-size: var(--fs-s); }
  .st-row__empty { color: var(--text-3); font-size: var(--fs-s); }
  @media (min-width: 640px) {
    .st-row { grid-template-columns: minmax(150px, 1fr) minmax(0, 1.6fr); align-items: center; gap: 16px; }
    .st-row__dest { display: grid; gap: 2px; }
    .st-row__empty { grid-column: 2; }
  }
  .st-deps { display: grid; grid-template-columns: 1.35fr 1fr 1fr; gap: 8px; list-style: none; margin: 0; padding: 0; }
  .st-deps:has(> .dep:first-child[hidden]) { display: none; }
  .dep { display: grid; align-content: start; gap: 2px; min-width: 0; font-variant-numeric: tabular-nums; }
  .dep__eta { display: inline-flex; align-items: center; gap: 4px; font-weight: 700; font-size: var(--fs-l); color: var(--text-2); white-space: nowrap; }
  .dep:first-child .dep__eta { font-size: 1.75rem; line-height: 1.1; letter-spacing: -0.02em; }
  .dep__clock { color: var(--text-3); font-size: var(--fs-xs); line-height: 1.35; }
  .dep__note { display: none; color: var(--warn); font-size: var(--fs-xs); font-weight: 700; }
  .dep__live, .dep__ghost { display: none; }
  .dep--live .dep__eta { color: var(--good); }
  .dep--live .dep__live { display: block; }
  .dep--sched .dep__eta { color: var(--text-3); font-weight: 600; }
  .dep--ghost .dep__eta { color: var(--text-3); font-weight: 600; cursor: help; }
  .dep--ghost .dep__ghost { display: block; }
  .dep--ghost .dep__note { display: block; }
  .dep:first-child .dep__live, .dep:first-child .dep__ghost { width: 16px; height: 16px; }
  html.is-stale .dep--live .dep__eta { color: var(--text-2); }
  .st-aside .card__title { display: inline-flex; align-items: center; gap: 8px; }
  .st-aside .card__title .icon { color: var(--text-3); }
  .st-ok { display: flex; align-items: center; gap: 8px; color: var(--text-2); font-size: var(--fs-s); }
  .st-ok .icon { color: var(--good); }
  .st-outages { list-style: none; margin: 0; padding: 0; display: grid; gap: 8px; }
  .st-outage {
    display: flex; gap: 10px; align-items: flex-start; padding: 12px 14px; border-radius: var(--r-m);
    background: var(--bad-soft); color: var(--bad); font-size: var(--fs-s);
  }
  .st-outage strong { color: var(--bad); }
  .st-outage p { margin-top: 2px; color: var(--text-2); }
  .st-outage .proto-note { margin-left: 4px; vertical-align: 1px; }
  .st-note { color: var(--text-3); font-size: var(--fs-xs); }
  .st-label { margin-bottom: 8px; color: var(--text-3); font-size: var(--fs-xs); font-weight: 700; letter-spacing: 0.04em; text-transform: uppercase; }
  .st-conn { display: inline-flex; align-items: center; gap: 8px; padding: 4px 10px 4px 4px; border: 1px solid var(--border); border-radius: var(--r-full); color: var(--text); text-decoration: none; font-size: var(--fs-s); font-weight: 600; }
  .st-conn:hover { background: var(--surface-hover); color: var(--text); }
  .st-buses { --gap: 6px; }
  .st-buses a { text-decoration: none; }
  .st-mini-map { position: relative; display: block; aspect-ratio: 16 / 10; overflow: hidden; border-radius: var(--r-m); background: var(--map-land); }
  .st-mini-map:hover { outline: 2px solid var(--border-strong); outline-offset: 2px; }
  .st-mini-map__pin { position: absolute; left: 50%; top: 50%; transform: translate(-50%, -88%); color: var(--text); filter: drop-shadow(0 1px 2px rgb(0 0 0 / 0.35)); }
  .st-mini-map__pin .icon { width: 28px; height: 28px; fill: var(--surface); }
  .st-code {
    width: 100%; resize: vertical; padding: 10px 12px; border: 1px solid var(--border-strong); border-radius: var(--r-m);
    background: var(--bg-subtle); color: var(--text-2); font: 0.75rem/1.5 ui-monospace, SFMono-Regular, Menlo, monospace;
  }
  html.is-tv, html.is-tv body { background: var(--bg); }
  html.is-tv :is(.site-header, .site-footer, .skip-link, .st-aside, .crumbs, .st-head__lines, .st-head__actions, .legend, .preview-banner) { display: none !important; }
  html.is-tv .station-page .wrap { width: min(100% - 6vw, 2400px); }
  html.is-tv .st-head { padding-block: 3vh 1.5vh; gap: 1vh; }
  html.is-tv .st-head__top { gap: 2vw; }
  html.is-tv .st-pin { width: clamp(52px, 5vw, 96px); height: clamp(52px, 5vw, 96px); }
  html.is-tv .st-pin .icon { width: 55%; height: 55%; }
  html.is-tv .st-head h1 { font-size: clamp(2rem, 4.4vw, 5.5rem); }
  html.is-tv .st-sub { font-size: clamp(1rem, 1.6vw, 1.75rem); }
  html.is-tv .st-tv-clock { display: block; margin-left: auto; font-size: clamp(2rem, 5vw, 6rem); font-weight: 700; letter-spacing: -0.02em; }
  html.is-tv .st-head__bar .live { font-size: clamp(0.875rem, 1.2vw, 1.25rem); }
  html.is-tv .st-layout { grid-template-columns: 1fr; padding-block: 1vh 3vh; }
  html.is-tv .st-board { grid-template-columns: repeat(auto-fit, minmax(min(100%, 780px), 1fr)); gap: 2vh 2vw; }
  html.is-tv .st-line { border-color: var(--border-strong); }
  html.is-tv .st-line__head { padding: 1.4vh 1.6vw; }
  html.is-tv .st-line__head h2 { font-size: clamp(1.25rem, 2vw, 2.4rem); }
  html.is-tv .st-line__head .link-arrow { display: none; }
  html.is-tv .st-line .badge--m { height: clamp(28px, 2.8vw, 54px); min-width: clamp(40px, 4vw, 84px); font-size: clamp(0.875rem, 1.4vw, 1.6rem); border-radius: 10px; }
  html.is-tv .st-row { grid-template-columns: minmax(0, 1fr) max-content; padding: 1.3vh 1.6vw; gap: 2vw; }
  html.is-tv .st-row__to { font-size: clamp(1.125rem, 1.8vw, 2.4rem); line-height: 1.15; color: var(--text); }
  html.is-tv .st-row__meta, html.is-tv .st-row__empty { font-size: clamp(0.875rem, 1vw, 1.25rem); }
  html.is-tv .st-deps { display: flex; align-items: flex-start; gap: 1.8vw; }
  html.is-tv .st-deps:has(> .dep:first-child[hidden]) { display: none; }
  html.is-tv .dep { flex: none; }
  html.is-tv .dep__eta { font-size: clamp(1.125rem, 1.8vw, 2.4rem); color: var(--text); }
  html.is-tv .dep:first-child .dep__eta { font-size: clamp(1.625rem, 3vw, 4rem); }
  html.is-tv .dep__clock { white-space: nowrap; }
  html.is-tv .dep--live .dep__eta { color: var(--good); }
  html.is-tv .dep--sched .dep__eta, html.is-tv .dep--ghost .dep__eta { color: var(--text-2); }
  html.is-tv .dep__clock, html.is-tv .dep__note { font-size: clamp(0.75rem, 1vw, 1.125rem); }
  html.is-tv .dep__live, html.is-tv .dep__ghost { width: 0.6em; height: 0.6em; }
  html.is-tv .stale-banner { font-size: clamp(1rem, 1.4vw, 1.5rem); }
  html.is-tv .st-tv-exit { display: inline-flex; position: fixed; right: 16px; bottom: 16px; opacity: 0; transition: opacity 0.2s var(--ease); }
  html.is-tv .st-tv-exit:hover, html.is-tv .st-tv-exit:focus-visible { opacity: 1; }
  html.is-tv body { cursor: none; }
  html.is-tv body:hover { cursor: default; }
  .st-embed-body { background: var(--bg); }
  .st-embed { display: grid; gap: 8px; padding: 12px; }
  .st-embed__head { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 2px 4px; }
  .st-embed__head strong { font-size: var(--fs-l); }
  .st-rows--embed { border: 1px solid var(--border); border-radius: var(--r-l); background: var(--surface); overflow: hidden; }
  .st-rows--embed .st-row { padding: 10px 12px; gap: 6px; }
  .st-rows--embed .st-row__dest { display: flex; align-items: center; gap: 8px; }
  .st-rows--embed .st-row__to { font-size: var(--fs-m); }
  .st-rows--embed .st-row__meta { display: none; }
  .st-rows--embed .st-deps { grid-template-columns: 1.2fr 1fr; }
  .st-rows--embed .dep:first-child .dep__eta { font-size: 1.375rem; }
  .st-embed__foot { padding: 2px 4px; font-size: var(--fs-xs); }
  .st-embed__foot a { display: inline-flex; align-items: center; gap: 4px; color: var(--text-3); text-decoration: none; }
  .st-embed__foot a:hover { color: var(--text); }
  @media (min-width: 560px) {
    .st-rows--embed .st-row { grid-template-columns: minmax(0, 1fr) minmax(0, 1.1fr); align-items: center; }
  }
  .st-announce { gap: 8px; }
  html.is-tv .st-announce { min-height: clamp(40px, 3.6vw, 64px); padding: 0 clamp(14px, 1.4vw, 24px); font-size: clamp(0.9rem, 1.2vw, 1.3rem); }
}
@layer pages {
  .sb-head { display: grid; gap: 14px; padding-block: 20px 16px; }
  .sb-head__top { display: flex; align-items: center; gap: 14px; }
  .sb-pin {
    display: grid; place-items: center; width: 44px; height: 44px; flex: none;
    border-radius: var(--r-m); background: var(--bg-sunken); color: var(--text);
  }
  .sb-pin .icon { width: 22px; height: 22px; }
  .sb-head__title { display: grid; gap: 6px; min-width: 0; flex: 1; }
  .sb-head h1 { font-size: clamp(1.625rem, 1.25rem + 1.9vw, 2.5rem); letter-spacing: -0.025em; overflow-wrap: anywhere; }
  .sb-skel { color: var(--text-3); }
  .sb-sub { display: flex; flex-wrap: wrap; align-items: center; gap: 4px 18px; color: var(--text-2); font-size: var(--fs-s); }
  .sb-sub:empty { display: none; }
  .sb-id { white-space: nowrap; }
  .sb-code { color: var(--text); font-weight: 700; font-variant-numeric: tabular-nums; }
  .sb-access { display: inline-flex; align-items: center; gap: 5px; }
  .sb-access .icon { color: var(--text-2); }
  .sb-access--no { color: var(--warn); font-weight: 600; }
  .sb-access--no .icon { color: currentColor; }
  .sb-station-link { display: inline-flex; align-items: center; gap: 2px; font-weight: 600; text-decoration: none; }
  .sb-station-link:hover { text-decoration: underline; }
  @media (max-width: 639px) { .sb-head .sb-pin { display: none; } }
  @media (min-width: 960px) {
    .sb-head { padding-block: 32px 20px; }
    .sb-pin { width: 52px; height: 52px; }
    .sb-pin .icon { width: 26px; height: 26px; }
  }
  .sb-routes {
    display: flex; gap: 8px; overflow-x: auto; scrollbar-width: none;
    margin-inline: calc(-1 * var(--gutter)); padding: 2px var(--gutter);
  }
  .sb-routes::-webkit-scrollbar { display: none; }
  .sb-routes:empty { display: none; }
  .sb-route { max-width: 20rem; }
  .sb-route > span:last-child { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
  @media (min-width: 768px) {
    .sb-routes { flex-wrap: wrap; overflow: visible; margin-inline: 0; padding-inline: 0; }
  }
  .sb-actions { display: flex; flex-wrap: wrap; gap: 8px; }
  .sb-tv-link { display: none; }
  @media (min-width: 640px) { .sb-tv-link { display: inline-flex; } }
  @media (max-width: 639px) {
    .sb-announce { width: 44px; padding: 0; }
    .sb-announce .sb-btn-label { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
  }
  .sb-tv-clock, .sb-tv-exit { display: none; }
  @media (max-width: 639px) { .sb-tv-card, .sb-ha-card { display: none; } }
  .sb-ha { min-width: 0; }
  .sb-ha > summary { cursor: pointer; font-size: var(--fs-s); font-weight: 600; }
  .sb-ha[open] > summary { margin-bottom: 10px; }
  .sb-ha__code {
    max-width: 100%; max-height: 280px; overflow: auto; margin: 0 0 12px; padding: 12px 14px; border-radius: var(--r-m);
    background: var(--bg-sunken); color: var(--text); font: 0.75rem/1.5 ui-monospace, SFMono-Regular, Menlo, monospace; white-space: pre;
  }
  .sb-layout { display: grid; gap: 24px; padding-block: 4px 48px; }
  .sb-main { display: grid; gap: 16px; align-content: start; min-width: 0; }
  .sb-main > .stale-banner { margin-bottom: 0; }
  .sb-aside { display: grid; gap: 16px; align-content: start; min-width: 0; }
  .sb-aside > .card { min-width: 0; }
  @media (min-width: 1024px) {
    .sb-layout { grid-template-columns: minmax(0, 1fr) 340px; gap: 40px; align-items: start; }
  }
  .sb-answer {
    display: grid; gap: 10px; padding: 18px 20px 20px;
    border: 1px solid var(--border); border-radius: var(--r-l); background: var(--surface);
  }
  .sb-answer__top { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
  .sb-eyebrow { color: var(--text-2); font-size: var(--fs-s); font-weight: 700; letter-spacing: 0; }
  .sb-answer__loading { color: var(--text-3); }
  .sb-answer__first { color: var(--text); font-size: var(--fs-l); font-weight: 700; }
  .sb-answer__route { display: flex; align-items: center; gap: 12px; min-width: 0; color: var(--text); text-decoration: none; }
  .sb-answer__route:hover { color: var(--text); }
  .sb-answer__route:hover .sb-answer__to { text-decoration: underline; text-underline-offset: 0.18em; }
  .sb-answer__to { min-width: 0; font-size: var(--fs-xl); font-weight: 700; line-height: 1.2; overflow-wrap: anywhere; }
  .sb-answer__when { display: grid; gap: 4px; margin-top: 2px; }
  .sb-answer__eta { color: var(--text-2); font-size: clamp(2.5rem, 2.1rem + 2vw, 3.5rem); font-weight: 750; line-height: 1; letter-spacing: -0.03em; }
  .sb-answer__when.sb-dep--live .sb-answer__eta { color: var(--good); }
  .sb-answer__note { color: var(--text-2); font-size: var(--fs-s); }
  html.is-stale .sb-answer__when.sb-dep--live .sb-answer__eta { color: var(--text-2); }
  .sb-kind {
    display: inline-flex; align-items: center; gap: 6px; flex: none; padding: 3px 10px;
    border-radius: var(--r-full); background: var(--bg-sunken); color: var(--text-2);
    font-size: var(--fs-xs); font-weight: 700; white-space: nowrap;
  }
  .sb-kind--live { background: var(--good-soft); color: var(--good); }
  .sb-kind--ghost { background: var(--warn-soft); color: var(--warn); cursor: help; }
  html.is-stale .sb-kind--live { background: var(--bg-sunken); color: var(--text-2); }
  :is(.sb-answer__meta, .sb-dep__meta) { display: flex; flex-wrap: wrap; align-items: baseline; color: var(--text-3); }
  .sb-answer__meta { color: var(--text-2); font-size: var(--fs-s); }
  .sb-dep__meta { font-size: var(--fs-xs); }
  :is(.sb-answer__meta, .sb-dep__meta) > * + *::before { content: "·"; display: inline-block; margin-inline: 6px; color: var(--text-3); }
  :is(.sb-answer__meta, .sb-dep__meta) a { color: inherit; font-weight: 600; text-decoration: none; }
  :is(.sb-answer__meta, .sb-dep__meta) a:hover { color: var(--text); text-decoration: underline; }
  .sb-ghost-note { color: var(--warn); font-weight: 700; }
  .sb-board { display: grid; gap: 10px; }
  .sb-board__head { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 8px 16px; min-height: 40px; }
  .sb-board__head h2 { font-size: var(--fs-l); }
  .sb-view { width: auto; max-width: none; }
  .sb-view button { padding: 0 14px; }
  .sb-deps, .sb-groups {
    list-style: none; margin: 0; padding: 0; overflow: hidden;
    border: 1px solid var(--border); border-radius: var(--r-l); background: var(--surface);
  }
  .sb-deps { display: grid; grid-template-columns: auto minmax(0, 1fr) auto; column-gap: 12px; }
  .sb-dep {
    display: grid; grid-column: 1 / -1; align-items: center; column-gap: 12px; padding: 12px 16px;
    grid-template-columns: auto minmax(0, 1fr) auto; grid-template-columns: subgrid;
  }
  .sb-dep + .sb-dep { border-top: 1px solid var(--border); }
  .sb-dep__badge { text-decoration: none; }
  .sb-dep__badge .badge--m, .sb-group__route .badge--m { min-width: 48px; }
  .sb-dep__main { display: grid; gap: 2px; min-width: 0; }
  .sb-dep__to { font-weight: 650; line-height: 1.25; overflow-wrap: anywhere; }
  .sb-dep__when { display: grid; justify-items: end; gap: 1px; text-align: right; }
  .sb-dep__eta { display: inline-flex; align-items: center; gap: 5px; color: var(--text-2); font-size: var(--fs-l); font-weight: 700; white-space: nowrap; }
  .sb-dep__note { color: var(--text-3); font-size: var(--fs-xs); white-space: nowrap; }
  .sb-dep__note.sb-ghost-note { color: var(--warn); }
  .sb-i-live, .sb-i-ghost { display: none; }
  .sb-dep--live .sb-i-live, .sb-dep--ghost .sb-i-ghost { display: block; }
  :is(.sb-dep--live .sb-dep__eta, .sb-time.sb-dep--live) { color: var(--good); }
  :is(.sb-dep--sched .sb-dep__eta, .sb-time.sb-dep--sched, .sb-dep--ghost .sb-dep__eta, .sb-time.sb-dep--ghost) { color: var(--text-3); font-weight: 600; }
  :is(.sb-dep--ghost .sb-dep__eta, .sb-time.sb-dep--ghost) { cursor: help; }
  html.is-stale :is(.sb-dep--live .sb-dep__eta, .sb-time.sb-dep--live) { color: var(--text-2); }
  .sb-group { display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: center; gap: 8px 16px; padding: 12px 16px; }
  .sb-group + .sb-group { border-top: 1px solid var(--border); }
  .sb-group__route { display: flex; align-items: center; gap: 12px; min-width: 0; color: var(--text); text-decoration: none; }
  .sb-group__route:hover { color: var(--text); }
  .sb-group__route:hover .sb-group__to { text-decoration: underline; text-underline-offset: 0.18em; }
  .sb-group__to { font-weight: 650; line-height: 1.25; overflow-wrap: anywhere; }
  .sb-times { display: flex; align-items: baseline; justify-content: flex-end; gap: 14px; list-style: none; margin: 0; padding: 0; }
  .sb-time { display: inline-flex; align-items: center; gap: 4px; font-weight: 700; white-space: nowrap; font-variant-numeric: tabular-nums; }
  .sb-time:first-child { font-size: var(--fs-l); }
  .sb-plan { display: grid; justify-items: end; gap: 1px; text-align: right; }
  .sb-plan__time { color: var(--text-2); font-size: var(--fs-l); font-weight: 700; }
  .sb-plan__label { color: var(--text-3); font-size: var(--fs-xs); }
  .sb-plan--wait { color: var(--text-3); font-size: var(--fs-s); }
  @media (max-width: 519px) {
    .sb-group { grid-template-columns: minmax(0, 1fr); gap: 6px; }
    .sb-times { justify-content: flex-start; padding-left: 60px; }
    .sb-plan { justify-items: start; text-align: left; padding-left: 60px; }
  }
  .sb-empty-line { padding: 14px 16px; border: 1px solid var(--border); border-radius: var(--r-l); background: var(--surface); color: var(--text-3); font-size: var(--fs-s); }
  .sb-foot { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 8px 16px; }
  .sb-foot .legend { margin-top: 0; }
  .sb-note { color: var(--text-3); font-size: var(--fs-xs); }
  .sb-board__note { padding-inline: 4px; }
  .sb-aside .card__title { display: inline-flex; align-items: center; gap: 8px; }
  .sb-aside .card__title .icon { color: var(--text-3); }
  .sb-card-note { padding: 4px 20px 6px; }
  .sb-route-list { padding-bottom: 6px; }
  .sb-route-list .row { padding-inline: 20px; }
  .sb-route-list .row > .icon { color: var(--text-3); }
  .sb-route-to { display: block; color: var(--text-3); font-size: var(--fs-s); line-height: 1.35; }
  .sb-missing { min-height: min(62dvh, 560px); padding-block: 40px 72px; }
  .sb-missing__card { display: grid; justify-items: start; gap: 14px; max-width: 600px; }
  .sb-missing__card h1 { font-size: var(--fs-2xl); overflow-wrap: anywhere; }
  .sb-missing__card > p:not(.sb-note) { color: var(--text-2); font-size: var(--fs-l); }
  :root[data-simple] .stop-page :is(.sb-routes, .sb-aside, .sb-legend, .sb-view, .sb-tv-link, .sb-board__note, .sb-veh, [data-share], [data-sb-report]) { display: none !important; }
  :root[data-simple] .sb-layout { grid-template-columns: 1fr; }
  :root[data-simple] .sb-deps > .sb-dep:nth-child(n + 4) { display: none; }
  :root[data-simple] .sb-groups > .sb-group:nth-child(n + 5) { display: none; }
  :root[data-simple] .sb-answer__eta { font-size: clamp(3rem, 2.4rem + 3vw, 4.25rem); }
  :root[data-simple] .sb-dep__meta { font-size: var(--fs-s); }
  :root[data-simple] .sb-announce { width: auto; padding: 0 16px; }
  :root[data-simple] .sb-announce .sb-btn-label { position: static; width: auto; height: auto; overflow: visible; clip: auto; }
  html.is-tv, html.is-tv body { background: var(--bg); }
  html.is-tv :is(.site-header, .site-footer, .skip-link) { display: none !important; }
  html.is-tv .stop-page :is(.crumbs, .sb-routes, .sb-aside, .sb-legend, .sb-board__note, .sb-sub a) { display: none !important; }
  html.is-tv .sb-actions > :not(.sb-announce) { display: none; }
  html.is-tv .stop-page .wrap { width: min(100% - 6vw, 2400px); }
  html.is-tv .sb-head { padding-block: 3vh 1.5vh; gap: 1.5vh; }
  html.is-tv .sb-head__top { gap: 2vw; }
  html.is-tv .sb-pin { width: clamp(52px, 5vw, 96px); height: clamp(52px, 5vw, 96px); }
  html.is-tv .sb-pin .icon { width: 55%; height: 55%; }
  html.is-tv .sb-head h1 { font-size: clamp(2rem, 4vw, 5rem); }
  html.is-tv .sb-sub { font-size: clamp(1rem, 1.5vw, 1.75rem); }
  html.is-tv .sb-access .icon { width: 1em; height: 1em; }
  html.is-tv .sb-tv-clock { display: block; margin-left: auto; font-size: clamp(2rem, 5vw, 6rem); font-weight: 700; letter-spacing: -0.02em; }
  html.is-tv .sb-announce { min-height: clamp(40px, 3.6vw, 64px); padding: 0 clamp(14px, 1.4vw, 24px); font-size: clamp(0.9rem, 1.2vw, 1.3rem); width: auto; }
  html.is-tv .sb-announce .sb-btn-label { position: static; width: auto; height: auto; overflow: visible; clip: auto; }
  html.is-tv .sb-layout { grid-template-columns: 1fr; padding-block: 1vh 3vh; }
  html.is-tv .sb-main { gap: 2vh 2.4vw; }
  @media (min-width: 900px) {
    html.is-tv .sb-main { grid-template-columns: minmax(0, 1fr) minmax(0, 1.35fr); align-items: start; }
    html.is-tv .sb-main > :is(.stale-banner, .sb-foot, noscript) { grid-column: 1 / -1; }
  }
  html.is-tv :is(.sb-answer, .sb-deps, .sb-groups, .sb-empty-line) { border-color: var(--border-strong); }
  html.is-tv .sb-answer { gap: 1.6vh; padding: 3vh 2vw; }
  html.is-tv :is(.sb-eyebrow, .sb-answer__meta, .sb-answer__note, .sb-answer__first) { font-size: clamp(1rem, 1.4vw, 1.75rem); }
  html.is-tv .sb-kind { font-size: clamp(0.875rem, 1.1vw, 1.375rem); padding: 0.3em 0.9em; }
  html.is-tv .sb-answer .badge--l { height: clamp(44px, 4.4vw, 84px); min-width: clamp(56px, 6vw, 120px); font-size: clamp(1.25rem, 2vw, 2.4rem); }
  html.is-tv .sb-answer__to { font-size: clamp(1.375rem, 2.6vw, 3.25rem); }
  html.is-tv .sb-answer__eta { font-size: clamp(3.5rem, 9vw, 11rem); }
  html.is-tv .sb-board__head h2 { font-size: clamp(1.125rem, 1.6vw, 2rem); }
  html.is-tv .sb-deps { column-gap: 1.4vw; }
  html.is-tv .sb-dep { padding: 1.5vh 1.6vw; column-gap: 1.4vw; }
  html.is-tv .sb-dep__badge .badge--m, html.is-tv .sb-group__route .badge--m { height: clamp(28px, 2.8vw, 54px); min-width: clamp(48px, 4.4vw, 96px); font-size: clamp(0.875rem, 1.4vw, 1.6rem); border-radius: 10px; }
  html.is-tv :is(.sb-dep__to, .sb-group__to) { font-size: clamp(1.125rem, 1.8vw, 2.4rem); }
  html.is-tv .sb-dep__meta { font-size: clamp(0.875rem, 1.05vw, 1.375rem); }
  html.is-tv :is(.sb-dep__eta, .sb-plan__time, .sb-time:first-child) { font-size: clamp(1.25rem, 2.4vw, 3rem); }
  html.is-tv :is(.sb-plan__label, .sb-dep__note) { font-size: clamp(0.875rem, 1.05vw, 1.375rem); }
  html.is-tv .sb-group { padding: 1.5vh 1.6vw; }
  html.is-tv .stale-banner { font-size: clamp(1rem, 1.4vw, 1.5rem); }
  html.is-tv .sb-foot .live { font-size: clamp(0.875rem, 1.1vw, 1.25rem); }
  html.is-tv .sb-tv-exit { display: inline-flex; position: fixed; right: 16px; bottom: 16px; opacity: 0; transition: opacity 0.2s var(--ease); }
  html.is-tv .sb-tv-exit:hover, html.is-tv .sb-tv-exit:focus-visible { opacity: 1; }
  .saved-stops { border-top: 1px solid var(--border); }
  .saved-stops--only { border-top: 0; }
  .saved-stops .row > .icon { color: var(--text-3); }
  .saved-stops :is(.row__title, .row__meta) { white-space: normal; overflow-wrap: anywhere; }
  .saved-stop__next { display: inline-flex; align-items: center; gap: 6px; font-weight: 700; white-space: nowrap; font-variant-numeric: tabular-nums; }
  .saved-stop__next.is-live { color: var(--good); }
  .saved-stop__next .badge { height: 20px; min-width: 24px; font-size: 0.6875rem; }
  .search__item[data-kind="stop"] > span { flex: 1; min-width: 0; line-height: 1.3; }
  .search__item[data-kind="stop"] > .icon { color: var(--text-3); }
  .search__item[data-kind="stop"] > small { max-width: 38%; overflow: hidden; text-overflow: ellipsis; }
  @media (pointer: coarse) { .sb-veh { padding-block: 8px; margin-block: -8px; } }
}
@layer pages {
  .track-finder, .track-choose, .track-basic { display: none; }
  .track-finder, .track-basic, .track-finder__more, .go, .eb, .eb__output, .em-veh { grid-template-columns: minmax(0, 1fr); }
  .follow[data-mode="finder"] .track-finder { display: grid; gap: 20px; max-width: 760px; }
  .follow[data-mode="choose"] .track-choose { display: block; max-width: 760px; }
  .follow[data-mode="basic"] .track-basic { display: grid; gap: 16px; max-width: 760px; }
  html.is-stale .follow[data-mode="basic"] .follow-stale { display: flex; }
  .track-choose .card__body { padding-bottom: 8px; }
  .track-choose .row { padding-inline: 20px; padding-block: 12px; }
  .track-choose :is(.row__title, .row__meta) { white-space: normal; }
  .track-form { display: grid; gap: 8px; }
  .track-form__label { font-weight: 700; }
  .track-form__row { display: flex; gap: 8px; }
  .track-form__input {
    flex: 1; min-width: 0; min-height: 48px; padding: 0 16px;
    border: 1px solid var(--border-strong); border-radius: var(--r-m); background: var(--surface); color: var(--text);
    font-size: var(--fs-l); font-weight: 650; letter-spacing: 0.02em; text-transform: uppercase;
  }
  .track-form__input::placeholder { color: var(--text-3); font-weight: 400; letter-spacing: 0; text-transform: none; }
  .track-form__input:focus-visible { border-color: var(--accent); }
  .track-form__input::-webkit-calendar-picker-indicator { display: none !important; }
  .track-form__hint { color: var(--text-3); font-size: var(--fs-s); }
  @media (max-width: 420px) { .track-form__row { flex-direction: column; } }
  .track-label { color: var(--text-2); font-size: var(--fs-s); font-weight: 700; }
  .track-finder__more { display: grid; gap: 10px; }
  .track-finder__more .row > .icon:first-child { color: var(--text-3); }
  .track-missing__find { padding-top: 16px; border-top: 1px solid var(--border); }
  .track-ran { padding-block: 10px 2px; }
  .go { display: grid; justify-items: center; padding-block: 32px 64px; }
  .go__card { width: 100%; max-width: 640px; }
  .go__icon { display: grid; place-items: center; width: 44px; height: 44px; border-radius: var(--r-m); background: var(--bg-sunken); color: var(--text-2); }
  .go__title { font-size: var(--fs-2xl); letter-spacing: -0.02em; overflow-wrap: anywhere; }
  .go__body { color: var(--text-2); }
  .em-body { background: var(--bg); }
  .em { display: flex; flex-direction: column; min-height: 100dvh; min-width: 0; }
  .em > .em__body { flex: 1; }
  .em__head {
    position: sticky; top: 0; z-index: 5; display: flex; flex-wrap: wrap; align-items: center; gap: 8px 12px;
    padding: 10px 12px; background: var(--bg); border-bottom: 1px solid var(--border);
  }
  .em__title { display: inline-flex; flex: 1; align-items: center; gap: 8px; min-width: 0; color: var(--text); text-decoration: none; }
  .em__title strong { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: var(--fs-m); }
  .em__title:hover { color: var(--text); }
  .em__title:hover strong { text-decoration: underline; text-underline-offset: 0.18em; }
  .em__pin { display: grid; color: var(--text-3); }
  .em__sub { flex-basis: 100%; margin-top: -6px; color: var(--text-3); font-size: var(--fs-xs); }
  .em__sub:empty { display: none; }
  .em-dirs { flex-basis: 100%; max-width: none; }
  .em__stale { margin: 8px 12px 0; }
  .em__body { min-width: 0; padding: 6px 12px 10px; }
  .em__foot { padding: 8px 12px 10px; border-top: 1px solid var(--border); font-size: var(--fs-xs); }
  .em__foot a { display: inline-flex; align-items: center; gap: 4px; color: var(--text-3); font-weight: 600; text-decoration: none; }
  .em__foot a:hover { color: var(--text); }
  .em__note { color: var(--text-3); font-size: var(--fs-s); }
  .em__label { color: var(--text-2); font-size: var(--fs-xs); font-weight: 700; }
  .em-route .diagram { --row: 56px; }
  .em-route .diagram[data-index="1"],
  .em-route:has(#em-dir-1:checked) .diagram[data-index="0"] { display: none; }
  .em-route:has(#em-dir-1:checked) .diagram[data-index="1"] { display: block; }
  .em-route .diagram__link { margin-left: 44px; padding: 0 8px; }
  .em-route .diagram__fold, .em-route .diagram__stops { margin-left: 44px; }
  .em-deps { margin: 0; padding: 0; list-style: none; }
  .em-dep { display: grid; grid-template-columns: auto minmax(0, 1fr) auto; align-items: center; gap: 10px; padding: 8px 0; }
  .em-dep + .em-dep { border-top: 1px solid var(--border); }
  .em-dep__route { display: flex; text-decoration: none; }
  .em-dep__main { display: grid; min-width: 0; }
  .em-dep__to { overflow: hidden; font-weight: 600; text-overflow: ellipsis; white-space: nowrap; }
  .em-dep__meta { color: var(--text-3); font-size: var(--fs-xs); }
  .em-dep__eta { display: inline-flex; align-items: center; gap: 4px; font-size: var(--fs-l); font-weight: 750; white-space: nowrap; }
  .em-dep--live .em-dep__eta { color: var(--good); }
  .em-dep--sched .em-dep__eta, .em-dep--ghost .em-dep__eta { color: var(--text-3); font-weight: 650; }
  html.is-stale .em-dep--live .em-dep__eta { color: var(--text-3); }
  .em-veh { display: grid; align-content: start; gap: 8px; padding-top: 10px; }
  .em-veh__title { font-size: var(--fs-l); font-weight: 700; line-height: 1.25; }
  .em-veh__next { font-size: var(--fs-xl); font-weight: 750; letter-spacing: -0.01em; line-height: 1.25; }
  .em-veh__next:empty { display: none; }
  .em-veh__status { display: flex; flex-wrap: wrap; align-items: center; gap: 4px 12px; }
  .em-veh .em__label { margin-top: 6px; }
  .em-stops { margin: 0; padding: 0; list-style: none; }
  .em-stops li { display: flex; justify-content: space-between; gap: 12px; padding: 8px 0; border-top: 1px solid var(--border); font-size: var(--fs-s); }
  .em-stops__name { min-width: 0; overflow: hidden; font-weight: 600; text-overflow: ellipsis; white-space: nowrap; }
  .em-stops__time { text-align: right; white-space: nowrap; }
  .em-stops__time small { color: var(--text-3); }
  :root[data-simple] :is(.em-dep__meta, .em-stops, .em-veh .em__label) { display: none; }
  .eb { display: grid; gap: 32px; padding-block: 24px 56px; }
  .eb__head h1 { font-size: var(--fs-3xl); letter-spacing: -0.025em; }
  .eb__head p { max-width: 60ch; margin-top: 8px; color: var(--text-2); font-size: var(--fs-l); }
  .eb__layout { display: grid; grid-template-columns: minmax(0, 1fr); gap: 20px; }
  @media (min-width: 960px) {
    .eb__layout { grid-template-columns: 380px minmax(0, 1fr); align-items: start; }
    .eb__controls { position: sticky; top: calc(var(--header-h) + 16px); }
  }
  .eb__label { display: block; margin-bottom: 8px; color: var(--text-2); font-size: var(--fs-s); font-weight: 700; }
  .eb-seg { max-width: none; }
  .eb__field {
    display: flex; align-items: center; gap: 8px; min-height: 44px; padding: 0 12px;
    border: 1px solid var(--border-strong); border-radius: var(--r-m); background: var(--surface); color: var(--text-3);
  }
  .eb__field:focus-within { border-color: var(--accent); box-shadow: var(--ring); }
  .eb__field input { flex: 1; min-width: 0; min-height: 42px; border: 0; background: transparent; color: var(--text); outline: none; }
  .eb__field input:focus-visible { box-shadow: none; }
  .eb__results { margin-top: 6px; }
  .eb__results:empty { display: none; }
  .eb__results .row-static { padding: 10px 8px; }
  .eb__result { min-height: 48px; padding: 6px 8px; border-radius: var(--r-m); }
  .eb__result[aria-pressed="true"] { background: var(--accent-soft); }
  .eb__result > .icon:first-child { color: var(--text-3); }
  .eb__result > .icon:last-child:not(:first-child) { color: var(--accent); }
  .eb__picked { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; }
  .eb__picked .eb__label { margin: 0; }
  .eb__choice { display: inline-flex; align-items: center; gap: 8px; min-width: 0; font-weight: 700; }
  .eb__choice .icon { color: var(--text-3); }
  .eb__output { display: grid; gap: 12px; min-width: 0; }
  .eb__previewhead { display: flex; flex-wrap: wrap; align-items: baseline; justify-content: space-between; gap: 4px 12px; }
  .eb__previewhead .eb__label { margin: 0; }
  .eb__previewhead .row__meta { white-space: normal; }
  .eb__frame { display: grid; justify-items: center; padding: 16px; border-radius: var(--r-l); background: var(--bg-sunken); overflow: hidden; }
  .eb__frame iframe { display: block; max-width: 100%; border: 0; border-radius: 12px; background: var(--bg); }
  .eb__code {
    width: 100%; min-height: 104px; padding: 12px 14px; border: 1px solid var(--border-strong); border-radius: var(--r-m);
    background: var(--bg-subtle); color: var(--text); font: 0.8125rem/1.5 ui-monospace, SFMono-Regular, Menlo, monospace; resize: vertical;
  }
  .eb__chips { display: flex; flex-wrap: wrap; gap: 8px; margin: 0; padding: 0; list-style: none; }
  .eb__notes { color: var(--text-2); }
  .eb__notes h2 { margin-bottom: 8px; color: var(--text); font-size: var(--fs-xl); }
  .eb__notes ul { display: grid; gap: 6px; margin: 0; padding-left: 20px; }
  @media (max-width: 639px) { .eb__frame { padding: 8px; } }
}
