:root{--color-bg:#f7f9fc;--color-surface:#fff;--color-text:#07152f;--color-subtle:#2d3a4f;--color-muted:#6b7280;--color-border:#d9dee8;--color-border-soft:#e8edf5;--color-focus:#0057d9;--app-max-inline-size:30rem;--control-size:clamp(2.75rem, 13vw, 3rem);--control-size-sm:clamp(2rem, 9vw, 2.125rem);--radius-card:.5rem;--radius-control:999px;--shadow-card:0 .5rem 1.5rem #07152f14;--shadow-soft:0 .25rem .875rem #07152f12;--space-page:clamp(.75rem, 4vw, 1.25rem);--space-card:clamp(.75rem, 3.6vw, 1rem);--space-1:.25rem;--space-2:.5rem;--space-3:.75rem;color:var(--color-text);background:var(--color-bg);font-synthesis:none;text-rendering:optimizelegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;font-family:system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif;font-weight:400;line-height:1.5}*,:before,:after{box-sizing:border-box}html{background:var(--color-bg);min-width:20rem;min-height:100%}body{background:var(--color-bg);min-width:20rem;min-height:100vh;margin:0}button{font:inherit;color:inherit}button:focus-visible{outline:.1875rem solid color-mix(in srgb, var(--color-focus), white 40%);outline-offset:.1875rem}#root{min-height:100vh}.srOnly{clip:rect(0, 0, 0, 0);white-space:nowrap;border:0;width:1px;height:1px;margin:-1px;padding:0;position:absolute;overflow:hidden}.appShell{background:linear-gradient(180deg, #ffffffe0, #f7f9fcf0 32%), var(--color-bg);min-height:100vh}.appFrame{width:100%;max-width:var(--app-max-inline-size);padding:.625rem var(--space-page) calc(1.375rem + env(safe-area-inset-bottom));margin:0 auto}.appHeader{z-index:20;justify-content:space-between;align-items:center;gap:var(--space-2);width:100%;max-width:var(--app-max-inline-size);padding:calc(var(--space-2) + env(safe-area-inset-top)) var(--space-page) var(--space-2);-webkit-backdrop-filter:blur(.75rem);backdrop-filter:blur(.75rem);background:#f7f9fceb;flex-wrap:wrap;margin:0 auto;display:flex;position:sticky;top:0}.appTitle{letter-spacing:0;text-overflow:ellipsis;white-space:nowrap;min-width:0;margin:0;font-size:1rem;font-weight:700;overflow:hidden}.appHeaderPrimary{flex:auto;align-items:center;min-width:0;display:inline-flex}.appHeaderControls{flex:none;align-items:center;gap:.375rem;display:inline-flex}.appNav{border:1px solid var(--color-border-soft);border-radius:var(--radius-control);background:#ffffffb8;flex:none;align-items:center;gap:.25rem;padding:.1875rem;display:inline-flex}.appNavLink{border-radius:calc(var(--radius-control) - .1875rem);min-height:1.875rem;color:var(--color-muted);letter-spacing:0;white-space:nowrap;place-items:center;padding:.3125rem .5rem;font-size:.78rem;font-weight:800;line-height:1;text-decoration:none;display:inline-grid}.appNavLink--active{background:var(--color-text);color:var(--color-surface)}.languageSwitch{border:1px solid var(--color-border-soft);border-radius:var(--radius-control);background:#ffffffb8;flex:none;align-items:center;gap:.125rem;padding:.1875rem;display:inline-flex}.languageSwitchButton{border-radius:calc(var(--radius-control) - .1875rem);min-width:2rem;min-height:1.875rem;color:var(--color-muted);letter-spacing:0;white-space:nowrap;background:0 0;place-items:center;padding:.3125rem .4375rem;font-size:.76rem;font-weight:900;line-height:1;display:inline-grid}.languageSwitchButton--active{background:var(--color-text);color:var(--color-surface)}.clockSection{padding:0 0 var(--space-2);justify-content:center;margin-bottom:1.25rem;display:flex}.clockFace{--clock-stage-width:min(100vw, 26.875rem);--clock-size:clamp(10rem, 50vw, 16.25rem);--arrival-card-width:clamp(5.25rem, 24vw, 5.875rem);--clock-content-shift-y:1rem;width:var(--clock-stage-width);height:clamp(26.875rem,68dvh,30rem);min-height:26.875rem;margin-inline:calc((100% - var(--clock-stage-width)) / 2);isolation:isolate;position:relative}.clockFace--slotPreview{--clock-size:clamp(10.5rem, 44vw, 13.375rem);height:31.25rem;min-height:31.25rem}.clockDial{top:calc(50% + var(--clock-content-shift-y));z-index:1;width:var(--clock-size);height:var(--clock-size);border:2px solid var(--color-border);background:radial-gradient(circle at 50% 50%, #fffffff5 0 58%, #f9fbffe6 59% 100%), var(--color-surface);box-shadow:var(--shadow-card);border-radius:50%;position:absolute;left:50%;transform:translate(-50%,-50%)}.clockDial:after{z-index:0;content:"";border:1px solid #d9dee8b8;border-radius:50%;position:absolute;inset:12%}.clockDial.clockDial--hourly:after{inset:18%}.clockTick{--tick-angle:0deg;--tick-color:#c7cfdb;--tick-width:.125rem;--tick-height:.5rem;top:calc(50% - (var(--tick-height) / 2));left:calc(50% - (var(--tick-width) / 2));z-index:1;width:var(--tick-width);height:var(--tick-height);border-radius:var(--radius-control);background:var(--tick-color);transform:rotate(var(--tick-angle)) translateY(calc((var(--clock-size) / -2) + .9375rem));transform-origin:50%;transition:width .16s,height .16s,box-shadow .16s;position:absolute}.clockTick--major{--tick-width:.1875rem;--tick-height:.75rem;background:#9ba7b7}.clockTick--arrival{--tick-width:.25rem;--tick-height:1.25rem;background:var(--tick-color);box-shadow:0 0 0 .125rem #ffffffe0}.clockTick--past{--tick-color:#aab4c3;opacity:.58;filter:saturate(.45)}.clockTick--selected{--tick-width:.4375rem;--tick-height:1.75rem;opacity:1;z-index:3;box-shadow:0 0 0 .1875rem #fffffff0, 0 0 0 .375rem color-mix(in srgb, var(--tick-color) 32%, transparent), 0 .375rem .875rem color-mix(in srgb, var(--tick-color) 38%, transparent)}.clockHand{--hand-angle:0deg;z-index:4;border-radius:var(--radius-control);background:var(--color-text);transform:translateX(-50%) rotate(var(--hand-angle));transform-origin:50% 100%;position:absolute;bottom:50%;left:50%}.clockHand--hour{width:.4375rem;height:26%}.clockHand--minute{background:#23314a;width:.25rem;height:34%}.clockCenter{z-index:7;border:3px solid var(--color-surface);background:var(--color-text);border-radius:50%;width:.875rem;height:.875rem;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);box-shadow:0 .125rem .5rem #07152f38}.clockModeLabel{z-index:6;min-width:4.5rem;min-height:2.625rem;padding:var(--space-2) var(--space-3);border-radius:var(--radius-card);color:var(--color-text);letter-spacing:0;place-items:center;font-size:1rem;font-weight:900;line-height:1;display:inline-grid;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}.clockLabel{pointer-events:auto;max-width:clamp(4.5rem,22vw,6.5rem);position:absolute}.clockLabel[data-vertical-anchor=bottom]{transform-origin:bottom}.clockLabel[data-vertical-anchor=top]{transform-origin:top}.clockLabel[data-side=right]{text-align:left}.clockLabel[data-side=left]{text-align:right}.arrivalAnchor{z-index:8;width:0;height:0;transform:translate(-50%, -50%) rotate(var(--marker-angle)) translateY(calc(var(--label-radius-near) * -1));transform-origin:50%;position:absolute;top:50%;left:50%}.arrivalAnchor--far{transform:translate(-50%, -50%) rotate(var(--marker-angle)) translateY(calc(var(--label-radius-far) * -1))}.arrivalUpright{width:0;height:0;transform:rotate(var(--marker-upright-angle));transform-origin:50%;display:block;position:absolute}.arrivalMarker{width:var(--arrival-card-width);border:1px solid color-mix(in srgb, var(--marker-color), white 66%);text-align:center;background:#ffffffe6;border-radius:.4375rem;place-items:center;gap:.125rem;height:2.625rem;padding:.25rem .375rem;line-height:1.15;display:grid;position:absolute;box-shadow:0 .1875rem .625rem #07152f12}.arrivalMarker--top{bottom:0;left:50%;transform:translate(-50%,-.375rem)}.arrivalMarker--right{top:50%;left:0;transform:translate(.375rem,-50%)}.arrivalMarker--bottom{top:0;left:50%;transform:translate(-50%,.375rem)}.arrivalMarker--left{top:50%;right:0;transform:translate(-.375rem,-50%)}.arrivalMarkerTime{justify-content:center;align-items:center;gap:var(--space-1);letter-spacing:0;white-space:nowrap;font-size:.72rem;font-weight:800;line-height:1;display:inline-flex}.arrivalMarkerStop{width:100%;color:var(--color-subtle);letter-spacing:0;font-size:.68rem;font-weight:800;line-height:1.05}.clusterCard{--cluster-item-count:1;z-index:10;width:var(--arrival-card-width);height:auto;min-height:3.5rem;padding:var(--space-2) .375rem .375rem;border:1px solid var(--color-border);border-radius:var(--radius-card);background:var(--color-surface);box-shadow:var(--shadow-soft);align-content:center;place-items:center;gap:.125rem;display:grid;position:absolute}.clusterCard--multi{min-height:calc(3.625rem + ((var(--cluster-item-count) - 1) * 1.125rem))}.clusterCard--preview{opacity:.62}.clusterCard--selected{box-shadow:0 0 0 .125rem #8b95a53d, var(--shadow-soft);background:#f4f6f9;border-color:#8b95a5}.clusterCard--past{border-color:var(--color-border-soft);background:#f7f8fb;box-shadow:0 .125rem .5rem #07152f0a}.clusterCard--past.clusterCard--selected{border-color:#a7b0bd;box-shadow:0 0 0 .125rem #8b95a52e,0 .125rem .5rem #07152f0a}.clusterArrivalRows{justify-items:center;gap:.1875rem;width:100%;margin-top:.0625rem;display:grid}.clusterArrivalRow{width:100%;color:var(--color-muted);font-variant-numeric:tabular-nums;letter-spacing:0;text-align:left;white-space:nowrap;background:0 0;border:0;grid-template-columns:1.125rem minmax(0,1fr);align-items:center;gap:.25rem;padding:0;font-size:.72rem;font-weight:900;line-height:1;display:grid}.clusterArrivalRow:hover,.clusterArrivalRow--focused{color:var(--color-text)}.clusterArrivalRow--past,.clusterArrivalRow--past.clusterArrivalRow--focused,.clusterCard--past .clusterStopName{color:var(--color-muted)}.bucketPreviewDot{background:radial-gradient(circle,#9ba7b7 0 .25rem,#0000 .28125rem),0 0;border:2px solid #0000;border-radius:50%;width:1.125rem;height:1.125rem;display:inline-block}.clusterStopName{width:100%;color:var(--color-text);letter-spacing:0;text-align:left;font-size:.68rem;font-weight:800;line-height:1.05}.clusterBucketDebug{color:var(--color-muted);letter-spacing:0;font-size:.48rem;font-weight:800;line-height:1;position:absolute;bottom:.125rem;right:.1875rem}.marqueeText{white-space:nowrap;display:block;overflow:hidden}.marqueeTextInner{will-change:transform;max-width:none;display:inline-block}.marqueeText--overflowing .marqueeTextInner{animation:5.2s linear .4s infinite marqueeSlide}@keyframes marqueeSlide{0%,18%{transform:translate(0)}68%,84%{transform:translateX(calc(var(--marquee-distance) * -1))}84.01%,to{transform:translate(0)}}@media (prefers-reduced-motion:reduce){.marqueeText--overflowing .marqueeTextInner{animation:none}}.routeSymbol{--route-color:#0057d9;--symbol-size:.8125rem;--symbol-frame-size:var(--symbol-size);width:var(--symbol-frame-size);height:var(--symbol-frame-size);vertical-align:middle;flex:none;justify-content:center;align-items:center;display:inline-flex;position:relative}.routeSymbol:before{width:var(--symbol-size);height:var(--symbol-size);border:2px solid var(--route-color);background:var(--route-color);content:"";display:block}.routeSymbol:after{content:"";pointer-events:none;border:2px solid #0000;border-radius:.3125rem;position:absolute;inset:0}.clusterCard .routeSymbol{--symbol-frame-size:calc(var(--symbol-size) + .5rem)}.clusterCard .routeSymbol:after{inset:0}.routeSymbol--sm{--symbol-size:.625rem}.routeSymbol--lg{--symbol-size:1rem}.routeSymbol--circle:before{border-radius:50%}.routeSymbol--square:before{border-radius:.125rem}.routeSymbol--triangle:before{border-top:0;border-right:calc(var(--symbol-size) / 2) solid transparent;border-bottom:var(--symbol-size) solid var(--route-color);border-left:calc(var(--symbol-size) / 2) solid transparent;background:0 0;width:0;height:0}.routeSymbol--muted{opacity:.72;filter:saturate(.68)}.routeSymbol--active:after{border:2px solid var(--route-color)}.routeSymbol--circle:after,.routeSymbol--triangle:after{border-radius:50%}.legendCard,.arrivalListCard,.timeSelectorCard,.noticePanel,.lastUpdatedPanel,.notFoundPanel{border:1px solid var(--color-border-soft);border-radius:var(--radius-card);background:var(--color-surface);box-shadow:var(--shadow-card)}.legendCard{padding:.375rem var(--space-card)}.legendContent{flex-wrap:wrap;justify-content:space-between;align-items:center;gap:.375rem;display:flex}.sectionTitle{color:var(--color-text);letter-spacing:0;margin:0;font-size:.9rem;font-weight:800}.legendItems{flex-wrap:nowrap;flex:auto;gap:.3125rem;min-width:max-content;display:flex}.legendItem{border-radius:var(--radius-control);min-height:2rem;color:var(--color-subtle);letter-spacing:0;white-space:nowrap;background:0 0;border:1px solid #0000;align-items:center;gap:.25rem;padding:.3125rem .375rem;font-size:.82rem;font-weight:700;display:inline-flex}.legendItem--hidden{border-color:var(--color-border-soft);color:var(--color-muted);opacity:.68;background:#f3f6fa}.condensedStopSwitch{border:1px solid var(--color-border-soft);border-radius:var(--radius-control);min-height:2rem;color:var(--color-subtle);letter-spacing:0;white-space:nowrap;background:#f8fafc;flex:none;align-items:center;gap:.375rem;margin-left:auto;padding:.3125rem .4375rem;font-size:.8rem;font-weight:800;display:inline-flex}.condensedStopSwitch:disabled{color:var(--color-muted);opacity:.52}.condensedStopSwitch--on{border-color:color-mix(in srgb, var(--color-focus), white 58%);background:color-mix(in srgb, var(--color-focus), white 92%);color:var(--color-text)}.condensedStopSwitchTrack{border-radius:var(--radius-control);background:#cbd5e1;width:2.125rem;height:1.125rem;transition:background .16s;position:relative}.condensedStopSwitchThumb{background:var(--color-surface);border-radius:50%;width:.75rem;height:.75rem;transition:transform .16s;position:absolute;top:.1875rem;left:.1875rem;box-shadow:0 .0625rem .25rem #07152f3d}.condensedStopSwitch--on .condensedStopSwitchTrack{background:var(--color-focus)}.condensedStopSwitch--on .condensedStopSwitchThumb{transform:translate(1rem)}.arrivalListCard{margin-top:var(--space-3);padding:var(--space-3) var(--space-card) .625rem}.listHeader{justify-content:space-between;align-items:center;gap:.625rem;display:flex}.listHeader .sectionTitle{min-width:0;line-height:1.28}.arrivalList{gap:var(--space-2);max-height:min(11.75rem,34dvh);padding:0 var(--space-1) 0 0;overscroll-behavior:contain;scrollbar-gutter:stable;margin:.6875rem 0 0;list-style:none;display:grid;overflow-y:auto}.arrivalList:focus-visible{outline:.1875rem solid color-mix(in srgb, var(--color-focus), white 40%);outline-offset:.1875rem}.arrivalEmpty{color:var(--color-muted);letter-spacing:0;margin:.625rem 0 0;font-size:.8rem;font-weight:700}.arrivalRow{width:100%;min-height:3.25rem;padding:var(--space-2) var(--space-2) var(--space-2) 0;border:1px solid var(--color-border-soft);border-radius:var(--radius-card);text-align:left;background:#fbfcff;grid-template-columns:.25rem 1rem 4.25rem minmax(0,1fr) auto .75rem;align-items:center;gap:.4375rem;display:grid;position:relative}.arrivalRow--selected{background:#f4f6f9;border-color:#8b95a5;box-shadow:0 0 0 .125rem #8b95a533}.arrivalRow--past{border-color:var(--color-border-soft);background:#f7f8fb}.arrivalRow--past.arrivalRow--selected{border-color:#a7b0bd;box-shadow:0 0 0 .125rem #8b95a529}.arrivalAccentBar{border-radius:var(--radius-card) 0 0 var(--radius-card);background:var(--arrival-color);align-self:stretch;width:.25rem}.arrivalRowTime{letter-spacing:0;white-space:nowrap;font-size:.91rem;font-weight:800}.arrivalRowMain{min-width:0;line-height:1.22;display:grid}.arrivalRowStop{color:var(--color-text);letter-spacing:0;text-overflow:ellipsis;white-space:nowrap;font-size:.85rem;font-weight:800;overflow:hidden}.arrivalRowRoute{color:var(--color-muted);letter-spacing:0;font-size:.74rem;font-weight:700}.arrivalRow--past .arrivalRowTime,.arrivalRow--past .arrivalRowStop,.arrivalRow--past .arrivalMinutes{color:var(--color-muted)}.arrivalMinutes{color:var(--color-subtle);letter-spacing:0;white-space:nowrap;font-size:.76rem;font-weight:800}.rowChevron{color:var(--color-muted);font-size:1rem;font-weight:800}.noticePanel{padding:.625rem var(--space-card);color:var(--color-muted);letter-spacing:0;margin-top:.625rem;font-size:.78rem;font-weight:700}.notFoundPanel{padding:var(--space-card);margin-top:.625rem}.notFoundText{color:var(--color-muted);letter-spacing:0;margin:.5rem 0 0;font-size:.84rem;font-weight:700;line-height:1.6}.lastUpdatedPanel{padding:.75rem var(--space-card);margin-top:.625rem}.lastUpdatedList{gap:.375rem;margin:.625rem 0 0;display:grid}.lastUpdatedItem{justify-content:space-between;align-items:baseline;gap:var(--space-3);color:var(--color-muted);letter-spacing:0;font-size:.76rem;font-weight:800;display:flex}.lastUpdatedItem dt,.lastUpdatedItem dd{margin:0}.lastUpdatedItem dd{font-variant-numeric:tabular-nums;text-align:right;flex:none}.timeSelectorCard{align-items:center;gap:var(--space-3);margin-top:var(--space-3);padding:var(--space-3) var(--space-card) .875rem;grid-template-columns:auto minmax(0,1fr);display:grid}.hourScrollerWrap{min-width:0;position:relative}.hourScrollerWrap:before,.hourScrollerWrap:after{z-index:2;content:"";pointer-events:none;width:1.5rem;position:absolute;top:0;bottom:0}.hourScrollerWrap:before{background:linear-gradient(90deg, var(--color-surface), #fff0);left:0}.hourScrollerWrap:after{background:linear-gradient(270deg, var(--color-surface), #fff0);right:0}.returnNowButton{width:var(--control-size);height:var(--control-size);border:1px solid var(--color-border-soft);border-radius:var(--radius-control);color:var(--color-muted);letter-spacing:0;cursor:pointer;background:#eef3f9;flex:none;justify-self:start;place-items:center;padding:0;font-size:.84rem;font-weight:800;display:inline-grid}.returnNowButton--active{border-color:var(--color-text);background:var(--color-text);color:var(--color-surface);box-shadow:0 .375rem .875rem #07152f2e}.clockIcon{border:2px solid;border-radius:50%;width:1.125rem;height:1.125rem;position:relative}.clockIcon:before,.clockIcon:after{border-radius:var(--radius-control);content:"";transform-origin:50% 100%;background:currentColor;width:.125rem;position:absolute;bottom:50%;left:50%}.clockIcon:before{height:.3125rem;transform:translate(-50%)rotate(0)}.clockIcon:after{height:.375rem;transform:translate(-50%)rotate(92deg)}.hourScroller{align-items:center;gap:var(--space-2);scrollbar-width:none;min-width:0;padding:0 1.25rem .125rem;display:flex;overflow-x:auto}.hourScroller::-webkit-scrollbar{display:none}.hourPill{border:1px solid var(--color-border-soft);color:var(--color-muted);letter-spacing:0;background:#eef3f9;flex:none;place-items:center;font-size:.78rem;font-weight:800;display:inline-grid}.hourPill:not(.hourPill--selected){cursor:pointer}.hourPill{width:var(--control-size);height:var(--control-size);border-radius:var(--radius-control)}.hourPill--selected{border-color:var(--color-text);background:var(--color-text);color:var(--color-surface);box-shadow:0 .375rem .875rem #07152f2e}@media (width<=21.875rem){.clockFace{--arrival-card-width:5.125rem}.appTitle{font-size:.92rem}.arrivalMarker{height:2.5rem;padding-inline:var(--space-1)}.arrivalMarkerTime{font-size:.72rem}.arrivalMarkerStop{font-size:.6rem}.clusterArrivalRow,.clusterStopName{font-size:.62rem}.clusterCard{min-height:3.375rem}.listHeader{align-items:flex-start}.arrivalRow{grid-template-columns:.25rem .875rem 3.875rem minmax(0,1fr) auto .625rem;gap:.3125rem;padding-right:.375rem}.arrivalMinutes{font-size:.7rem}.returnNowButton,.hourPill{--control-size:2.75rem}}
