.traffic-demo{--map-band-0:#1b7a3a;--map-band-1:#7cc05a;--map-band-2:#e9cf2f;--map-band-3:#f4ab52;--map-band-4:#e2711d;--map-band-5:#8a5226;--map-band-6:#d0262f;--map-missing:color-mix(in srgb,var(--muted) 45%,transparent);margin-top:1.75rem}.traffic-controls{display:grid;gap:1rem;margin-bottom:1.25rem}.traffic-controls-row{display:flex;flex-wrap:wrap;gap:.85rem 1.25rem;align-items:end}.traffic-field{display:grid;gap:.35rem;color:var(--muted);font-size:.8125rem;font-weight:600}.traffic-field input[type=date],.traffic-field select{min-width:13rem;min-height:2.75rem;padding:.45rem 2.25rem .45rem .85rem;border:1px solid var(--border);border-radius:.625rem;background:var(--surface);color:var(--ink);font:inherit;font-size:.9375rem;font-weight:650;cursor:pointer}.traffic-chip:focus-visible,.traffic-field input[type=date]:focus-visible,.traffic-field select:focus-visible,.traffic-reveal:focus-visible,.traffic-segmented button:focus-visible,.traffic-slider input:focus-visible{outline:2px solid var(--accent);outline-offset:2px}.traffic-segmented{display:inline-flex;padding:.2rem;border:1px solid var(--border);border-radius:.625rem;background:var(--surface-sunken)}.traffic-segmented button{min-width:4.5rem;min-height:2.25rem;padding:.3rem .75rem;border:0;border-radius:.45rem;background:none;color:var(--muted);font:inherit;font-size:.875rem;font-weight:650;cursor:pointer}.traffic-segmented button[aria-pressed=true]{background:var(--surface);box-shadow:var(--shadow-1);color:var(--ink)}.traffic-slider input{width:100%;min-height:2rem;accent-color:var(--accent);cursor:pointer}.traffic-slider-value{margin-left:.35rem;color:var(--ink);font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:.9375rem;font-weight:700}.traffic-slider-block{display:grid;gap:.35rem}.traffic-slider-note{margin:0;color:var(--muted);font-size:.8125rem;font-weight:500;line-height:1.5}.traffic-preset-note{flex-basis:100%;margin:0;color:var(--ink);font-weight:500}.traffic-demo-benchmark{margin:0 0 1rem;padding:.6rem .85rem;border-left:3px solid var(--accent);border-radius:.375rem;background:var(--surface-sunken);color:var(--ink);font-size:.875rem;line-height:1.5}.traffic-presets{display:flex;flex-wrap:wrap;gap:.5rem .75rem;align-items:center;color:var(--muted);font-size:.8125rem;font-weight:600}.traffic-presets ul{display:flex;flex-wrap:wrap;gap:.5rem;margin:0;padding:0;list-style:none}.traffic-chip{min-height:2.25rem;padding:.3rem .85rem;border:1px solid var(--border);border-radius:9999px;background:var(--surface);color:var(--ink);font:inherit;font-size:.8125rem;font-weight:600;cursor:pointer}.traffic-chip[aria-pressed=true]{border-color:var(--selected-edge);background:var(--selected-bg)}.traffic-demo-grid{display:grid;gap:1.25rem}@media (min-width:960px){.traffic-demo-grid{grid-template-columns:minmax(0,1.05fr) minmax(0,1fr);align-items:start}}.traffic-map{--map-selected:var(--ink);--map-selected-casing:var(--ink);--map-hover:color-mix(in srgb,var(--accent) 70%,transparent);--map-casing:color-mix(in srgb,var(--muted) 18%,transparent);--map-label:var(--muted);--map-label-bg:color-mix(in srgb,var(--surface) 88%,transparent);--map-label-border:color-mix(in srgb,var(--muted) 30%,transparent);--map-bg:color-mix(in srgb,var(--surface) 90%,#5b7083 10%);--map-grid:color-mix(in srgb,var(--muted) 20%,transparent);--map-grid-label:color-mix(in srgb,var(--ink) 72%,var(--muted));--map-grid-paper:color-mix(in srgb,var(--map-bg) 82%,transparent);--map-crosshair:color-mix(in srgb,var(--ink) 55%,transparent);position:relative;aspect-ratio:4/3;overflow:hidden;border:1px solid var(--hairline);border-radius:.85rem;background:var(--map-bg)}.traffic-map-canvas{display:block;width:100%;height:100%;cursor:crosshair;touch-action:pan-y}.traffic-map-canvas.is-zoomed{touch-action:none}.traffic-map-canvas:active{cursor:grabbing}.traffic-map-canvas:focus-visible{outline:2px solid var(--accent);outline-offset:-2px}.traffic-map.is-stale .traffic-map-canvas{opacity:.65}.traffic-map-tooltip{position:absolute;z-index:1;width:max-content;max-width:16rem;margin:0;padding:.3rem .55rem;border:1px solid var(--hairline);border-radius:.45rem;background:var(--surface);box-shadow:var(--shadow-1);color:var(--ink);font-size:.75rem;font-weight:600;line-height:1.35;pointer-events:none;transform:translate(-50%,calc(-100% - 10px))}.traffic-map-footer,.traffic-map-toolbar{display:flex;flex-wrap:wrap;gap:.4rem .75rem;align-items:center;justify-content:space-between}.traffic-map-toolbar{margin-bottom:.5rem}.traffic-map-footer{margin-top:.65rem}.traffic-map-region{margin:0;color:var(--muted);font-size:.8125rem;font-weight:600;letter-spacing:.02em}.traffic-map-tools{display:flex;flex-wrap:wrap;gap:.4rem .6rem;align-items:center;justify-content:flex-end;margin-left:auto}.traffic-map-readout{margin:0;padding:.15rem .45rem;border:1px solid var(--hairline);border-radius:.35rem;background:var(--surface);color:var(--ink);font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:.6875rem;font-variant-numeric:tabular-nums;white-space:pre}.traffic-map-readout.is-empty{visibility:hidden}.traffic-map-zoom{display:inline-flex;gap:.25rem}.traffic-map-zoom button{width:2.25rem;height:2.25rem;border:1px solid var(--border);border-radius:.5rem;background:var(--surface);color:var(--ink);font:inherit;font-size:1.05rem;font-weight:700;line-height:1;cursor:pointer}.traffic-map-zoom button:disabled{color:var(--muted);cursor:default;opacity:.6}.traffic-map-zoom button:focus-visible{outline:2px solid var(--accent);outline-offset:2px}.traffic-map-furniture{display:inline-flex;gap:.75rem;align-items:flex-end;margin-left:auto;color:var(--ink)}.traffic-map-north{display:block;overflow:visible}.traffic-map-north text{fill:currentColor;font-size:10px;font-weight:700}.traffic-map-north path{fill:var(--surface);stroke:currentColor;stroke-width:1;stroke-linejoin:round}.traffic-map-north path.is-dark{fill:currentColor}.traffic-map-scale{display:inline-grid;justify-items:center;gap:.15rem;font-size:.6875rem;font-weight:600;font-variant-numeric:tabular-nums}.traffic-map-scale-bar{box-sizing:border-box;height:5px;border:1px solid;background:linear-gradient(90deg,currentColor 50%,transparent 0)}.traffic-map-hint{margin:.5rem 0 0;color:var(--muted);font-size:.75rem;line-height:1.5}.traffic-combobox{position:relative;display:grid;gap:.35rem;margin-bottom:.75rem;color:var(--muted);font-size:.8125rem;font-weight:600}.traffic-combobox input{min-height:2.75rem;padding:.45rem .85rem;border:1px solid var(--border);border-radius:.625rem;background:var(--surface);color:var(--ink);font:inherit;font-size:.9375rem;font-weight:600}.traffic-combobox input:focus-visible{outline:2px solid var(--accent);outline-offset:2px}.traffic-combobox ul{position:absolute;top:100%;right:0;left:0;z-index:3;max-height:16rem;margin:.25rem 0 0;padding:.25rem;overflow-y:auto;border:1px solid var(--border);border-radius:.625rem;background:var(--surface);box-shadow:var(--shadow-1);list-style:none}.traffic-combobox li{padding:.4rem .6rem;border-radius:.4rem;color:var(--ink);font-size:.875rem;font-weight:500;cursor:pointer}.traffic-combobox li[aria-selected=true]{background:var(--selected-bg)}.traffic-combobox li.is-current{font-weight:700}.traffic-sr-only{position:absolute;width:1px;height:1px;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}@media (prefers-reduced-motion:no-preference){.traffic-panel-body{animation:traffic-panel-in .25s ease-out}.traffic-panel-body.is-stale{animation:none}.traffic-map-canvas,.traffic-panel-body{transition:opacity .2s ease}.traffic-panel-spinner{animation:traffic-spin .9s linear infinite}}@keyframes traffic-panel-in{0%{opacity:0;transform:translateY(4px)}to{opacity:1;transform:none}}@keyframes traffic-spin{to{transform:rotate(1turn)}}.traffic-demo-legend{display:flex;flex-wrap:wrap;align-items:center;gap:.4rem .6rem;color:var(--muted);font-size:.8125rem}.traffic-legend-ramp{display:inline-flex}.traffic-legend-ramp .traffic-band{width:1.1rem;height:.5rem;border-radius:0}.traffic-legend-ramp .traffic-band:first-child{border-radius:9999px 0 0 9999px}.traffic-legend-ramp .traffic-band:last-child{border-radius:0 9999px 9999px 0}.traffic-legend-missing{display:inline-flex;align-items:center;gap:.35rem;margin-left:.4rem}.traffic-band{display:inline-block;width:1.1rem;height:.5rem;border-radius:9999px}.traffic-band--0{background:var(--map-band-0)}.traffic-band--1{background:var(--map-band-1)}.traffic-band--2{background:var(--map-band-2)}.traffic-band--3{background:var(--map-band-3)}.traffic-band--4{background:var(--map-band-4)}.traffic-band--5{background:var(--map-band-5)}.traffic-band--6{background:var(--map-band-6)}.traffic-band--missing{background:var(--map-missing)}.traffic-demo-missing{padding:1.25rem;border:1px dashed var(--border);border-radius:.85rem;color:var(--muted);text-align:center}.traffic-panel{min-height:100%;padding:clamp(1rem,2.5vw,1.375rem);border:1px solid var(--hairline);border-radius:.85rem;background:var(--surface);box-shadow:var(--shadow-1)}.traffic-panel-head{display:flex;flex-wrap:wrap;gap:.5rem 1rem;align-items:flex-start;justify-content:space-between}.traffic-panel-corridor{margin:0;color:var(--muted);font-size:.8125rem;font-weight:600}.traffic-panel-name{margin:.15rem 0 0;font-size:var(--fs-h3);font-weight:650;line-height:1.3}.traffic-panel-source{padding:.2rem .6rem;border-radius:9999px;font-size:.75rem;font-weight:650;white-space:nowrap}.traffic-panel-source.is-model{background:var(--success-soft);color:var(--success)}.traffic-panel-source.is-unavailable{background:var(--warning-soft);color:var(--warning-strong)}.traffic-panel-state{display:grid;place-items:center;gap:.75rem;min-height:18rem;color:var(--muted);text-align:center}.traffic-panel-state p{margin:0}.traffic-panel-spinner{width:1.5rem;height:1.5rem;border:2px solid var(--hairline);border-top-color:var(--accent);border-radius:9999px}.traffic-panel-retry{min-height:2.5rem;padding:.4rem 1rem;border:1px solid var(--border);border-radius:9999px;background:var(--surface);color:var(--ink);font:inherit;font-weight:600;cursor:pointer}.traffic-panel-body.is-stale{opacity:.6}.traffic-panel-note,.traffic-panel-unavailable{margin:.75rem 0 0;color:var(--muted);font-size:.8125rem;line-height:1.6}.traffic-panel-unavailable{padding:.5rem .75rem;border-radius:.5rem;background:var(--warning-soft);color:var(--warning-strong)}.traffic-panel-stats{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:.75rem;margin:1rem 0}.traffic-panel-stats>div{padding:.65rem .75rem;border-radius:.625rem;background:var(--surface-sunken)}.traffic-panel-stats dt{color:var(--muted);font-size:.75rem;line-height:1.4}.traffic-panel-stats dd{margin:.25rem 0 0;font-size:1.125rem;font-weight:700;font-variant-numeric:tabular-nums}.traffic-panel-stats small{display:block;color:var(--muted);font-size:.75rem;font-weight:500}@media (max-width:480px){.traffic-panel-stats{grid-template-columns:1fr}}.traffic-chart{margin:0}.traffic-chart svg{display:block;width:100%;height:auto}.traffic-chart-grid{stroke:var(--hairline);stroke-width:1}.traffic-chart-axis{fill:var(--muted);font-size:11px;font-variant-numeric:tabular-nums}.traffic-chart-band{fill:color-mix(in srgb,var(--accent) 22%,transparent)}.traffic-chart-history{fill:none;stroke:var(--ink);stroke-width:2;stroke-linecap:round;stroke-linejoin:round}.traffic-chart-forecast{fill:none;stroke:var(--accent);stroke-width:2.25;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:5 4}.traffic-chart-actual{fill:none;stroke:var(--danger);stroke-width:2.25;stroke-linecap:round;stroke-linejoin:round}.traffic-chart-baseline{fill:none;stroke:color-mix(in srgb,var(--muted) 80%,transparent);stroke-width:1.75;stroke-dasharray:2 4;stroke-linecap:round}.traffic-chart-baseline-dot{fill:color-mix(in srgb,var(--muted) 80%,transparent)}.traffic-chart-cut{stroke:color-mix(in srgb,var(--muted) 55%,transparent);stroke-width:1.25;stroke-dasharray:3 4}.traffic-chart-legend{display:flex;flex-wrap:wrap;gap:.5rem 1rem;margin-top:.5rem;color:var(--muted);font-size:.8125rem}.traffic-chart-legend span{display:inline-flex;align-items:center;gap:.4rem}.traffic-swatch{display:inline-block;width:.85rem;height:.28rem;border-radius:9999px}.traffic-swatch--history{background:var(--ink)}.traffic-swatch--forecast{background:var(--accent)}.traffic-swatch--actual{background:var(--danger)}.traffic-swatch--baseline{background:color-mix(in srgb,var(--muted) 80%,transparent)}.traffic-swatch--band{height:.55rem;background:color-mix(in srgb,var(--accent) 35%,transparent)}.traffic-reveal{width:100%;min-height:2.75rem;margin-top:.85rem;border:0;border-radius:.625rem;background:var(--primary);color:var(--on-primary);font:inherit;font-weight:700;cursor:pointer}.traffic-reveal:hover:not(:disabled){background:var(--primary-hover)}.traffic-reveal:disabled{opacity:.5;cursor:progress}.traffic-metrics{margin-top:.85rem;padding:.75rem .85rem;border:1px solid var(--hairline);border-radius:.625rem}.traffic-metrics-title{margin:0 0 .5rem;font-size:.875rem;font-weight:650}.traffic-metrics dl{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:.75rem;margin:0}.traffic-metrics dt{color:var(--muted);font-size:.75rem;line-height:1.4}.traffic-metrics dd{margin:.2rem 0 0;font-size:1.0625rem;font-weight:700;font-variant-numeric:tabular-nums}.traffic-metrics-note{margin:.6rem 0 0;color:var(--muted);font-size:.75rem;line-height:1.6}@media (max-width:480px){.traffic-metrics dl{grid-template-columns:1fr}}.traffic-demo-attribution{margin:1.25rem 0 0;max-width:80ch;color:var(--ink);font-size:.875rem;line-height:1.65}.traffic-demo-disclaimer{margin:1rem 0 0;max-width:72ch;color:var(--muted);font-size:.875rem;line-height:1.65}