{
  "$schema": "./tokens.schema.json",
  "version": 1,
  "font": {
    "family": "Figtree",
    "css": "\"Figtree\",-apple-system,\"Helvetica Neue\",Arial,sans-serif",
    "mono": "\"IBM Plex Mono\",ui-monospace,Menlo,monospace"
  },
  "colors": [
    { "name": "paper", "css": "paper", "group": "core", "label": "Surface", "light": "#FFFFFF", "dark": "#0F141C" },
    { "name": "card", "css": "card", "group": "core", "label": "Card", "light": "#F3F4F7", "dark": "#171D27" },
    { "name": "card2", "css": "card-2", "group": "core", "label": "Card pressed / track", "light": "#E9EBF1", "dark": "#1F2733" },
    { "name": "line", "css": "line", "group": "core", "label": "Hairline", "light": "#E3E6EC", "dark": "#263041" },
    { "name": "inactive", "css": "inactive", "group": "core", "label": "Inactive", "use": "Grabber, timeline", "light": "#C9CDD6", "dark": "#465267" },
    { "name": "ink", "css": "ink", "group": "core", "label": "Ink", "contrast": true, "light": "#101A2E", "dark": "#EEF1F6" },
    { "name": "muted", "css": "muted", "group": "core", "label": "Muted ink", "contrast": true, "light": "#5B6472", "dark": "#98A2B3" },
    { "name": "accent", "css": "accent", "group": "core", "label": "Brand", "use": "Buses, actions, focus ring", "contrast": true, "light": "#0B4EA2", "dark": "#6EA0F0" },
    { "name": "accentInk", "css": "accent-ink", "group": "core", "label": "On Brand", "use": "Text and glyphs on Brand", "light": "#FFFFFF", "dark": "#0F141C" },
    { "name": "accentTint", "css": "accent-tint", "group": "core", "label": "Brand tint", "use": "Icon buttons", "light": "#EAF1FB", "dark": "#182944" },
    { "name": "good", "css": "good", "group": "status", "label": "Due", "contrast": true, "light": "#1B5E20", "dark": "#7FD48A" },
    { "name": "warn", "css": "warn", "group": "status", "label": "Delayed", "contrast": true, "light": "#8A4B00", "dark": "#F2B96B" },
    { "name": "alert", "css": "alert", "group": "status", "label": "Alert", "use": "Glyph only", "contrast": true, "light": "#E0641A", "dark": "#F08A4A" },
    { "name": "favorite", "css": "favorite", "group": "status", "label": "Favorite", "use": "Rounded star · saved fill / unsaved outline", "contrast": true, "light": "#B7800F", "dark": "#E8A317" },
    { "name": "scrim", "css": "scrim", "group": "status", "label": "Scrim", "use": "Behind dialogs", "light": "#101A2E", "dark": "#101A2E", "alpha": 0.62 },
    { "name": "liveBg", "css": "live-bg", "group": "live", "label": "Live surface", "use": "Live Activity and live badges", "light": "#101A2E", "dark": "#EEF1F6" },
    { "name": "liveInk", "css": "live-ink", "group": "live", "label": "Live ink", "use": "Text on the live surface", "light": "#FFFFFF", "dark": "#0F141C" }
  ],
  "fixedColors": [
    { "name": "alwaysWhite", "css": "always-white", "label": "Always white", "use": "Glyphs on line colours, map casings", "value": "#FFFFFF" },
    { "name": "alwaysInk", "css": "always-black", "label": "Always ink", "use": "Glyphs on Blue, Pink and Yellow", "value": "#101A2E" }
  ],
  "lines": [
    { "name": "red", "css": "red-line", "label": "Red", "route": "#C60C30", "light": "#C60C30", "dark": "#C60C30", "glyph": "white" },
    { "name": "blue", "css": "blue-line", "label": "Blue", "route": "#00A1DE", "light": "#00A1DE", "dark": "#00A1DE", "glyph": "ink" },
    { "name": "brown", "css": "brown-line", "label": "Brown", "route": "#62361B", "light": "#62361B", "dark": "#A8653A", "glyph": "white" },
    { "name": "green", "css": "green-line", "label": "Green", "route": "#009B3A", "light": "#009B3A", "dark": "#009B3A", "glyph": "white" },
    { "name": "orange", "css": "orange-line", "label": "Orange", "route": "#F9461C", "light": "#F9461C", "dark": "#F9461C", "glyph": "white" },
    { "name": "purple", "css": "purple-line", "label": "Purple", "route": "#522398", "light": "#522398", "dark": "#8D61D8", "glyph": "white" },
    { "name": "pink", "css": "pink-line", "label": "Pink", "route": "#E27EA6", "light": "#E27EA6", "dark": "#E27EA6", "glyph": "ink" },
    { "name": "yellow", "css": "yellow-line", "label": "Yellow", "route": "#F9E300", "light": "#E3CC00", "dark": "#F9E300", "glyph": "ink" }
  ],
  "type": [
    { "name": "display", "css": "fs-display", "label": "Display", "size": 32, "weight": 750, "tracking": -0.02, "textStyle": "largeTitle", "sample": "Clark/Lake", "use": "Page and sheet titles" },
    { "name": "title", "css": "fs-title", "label": "Title", "size": 20, "weight": 700, "tracking": 0, "textStyle": "title3", "sample": "Favorites", "use": "Section heads, sheet name, dialog title" },
    { "name": "body", "css": "fs-body", "label": "Body", "size": 16, "weight": 400, "tracking": 0, "textStyle": "body", "sample": "Waveland/Broadway", "use": "Rows, destinations, times; names at 600" },
    { "name": "sub", "css": "fs-sub", "label": "Subhead", "size": 13, "weight": 400, "tracking": 0, "textStyle": "footnote", "sample": "0.2 mi · Southbound", "use": "Subtitles, meta, labels" },
    { "name": "cap", "css": "fs-cap", "label": "Caption", "size": 11, "weight": 400, "tracking": 0, "textStyle": "caption2", "sample": "2:14 PM", "use": "Clock times, vehicle, +N" }
  ],
  "spacing": [
    { "name": "gutter", "css": "gutter", "value": 20, "unit": "pt", "use": "Page, sheet, dialog and settings side padding" },
    { "name": "cardPadding", "value": 14, "unit": "pt", "use": "Stop cards" },
    { "name": "arrivalVerticalPadding", "value": 5, "unit": "pt", "use": "Arrival cards, top and bottom", "note": "Keeps three arrival rows above the tab bar at half on a 6.1\" iPhone." },
    { "name": "arrivalHorizontalPadding", "value": 14, "unit": "pt", "use": "Arrival cards, leading and trailing" },
    { "name": "cardStackGap", "value": 8, "unit": "pt", "use": "Between cards in a list" },
    { "name": "arrivalStackGap", "value": 6, "unit": "pt", "use": "Between arrival cards" },
    { "name": "routeToggleGap", "value": 6, "unit": "pt", "use": "Between route filters" },
    { "name": "metadataControlOverlap", "value": 12, "unit": "pt", "use": "Overlap of adjacent 44pt metadata targets", "note": "Compresses adjacent 44pt metadata targets while preserving their full hit frames." },
    { "name": "metadataControlVerticalOverhang", "value": 14, "unit": "pt", "use": "44pt metadata glyph controls above and below their caption row", "note": "The station metadata row is one caption line; its 44 pt glyph controls overhang it\nby this much above and below, so their hit areas may overlap the spacing around it." },
    { "name": "headerMetadataGap", "value": 4, "unit": "pt", "use": "Station title to metadata caption", "note": "Title to metadata caption in the station header." },
    { "name": "headerCloseVerticalOverhang", "value": 8, "unit": "pt", "use": "44pt close button beyond the title line", "note": "The station title row is one title line; the 44 pt close button overhangs it this much." },
    { "name": "directionControlVerticalOverhang", "value": 6, "unit": "pt", "use": "44pt direction row beyond its gaps", "note": "The direction control's 44 pt row overhangs the gaps around it this much." },
    { "name": "sectionGap", "value": 24, "unit": "pt", "use": "Above a section head" }
  ],
  "radius": [
    { "name": "control", "css": "r-control", "value": 10, "unit": "pt", "use": "Segmented control, bus toggle, back link" },
    { "name": "card", "css": "r-card", "value": 12, "unit": "pt", "use": "Cards, list surfaces, search, primary button" },
    { "name": "dialog", "css": "r-modal", "value": 20, "unit": "pt", "use": "Alert dialog" },
    { "name": "sheet", "css": "r-sheet", "value": 28, "unit": "pt", "use": "All four corners of the inset core sheet" },
    { "name": "lineBar", "value": 3, "unit": "pt", "use": "Line bar segments" },
    { "name": "chip", "value": 6, "unit": "pt", "use": "Tags and small chips" },
    { "name": "segment", "value": 8, "unit": "pt", "use": "Segments inside a segmented control (control radius minus its padding)" },
    { "name": "pill", "value": 999, "unit": "pt", "use": "Fully rounded ends: badges, toasts, round buttons" }
  ],
  "size": [
    { "name": "floatingControl", "css": "fab", "value": 52, "unit": "pt", "use": "Floating map controls" },
    { "name": "mapStationMarker", "value": 26, "unit": "pt", "use": "Train station marker", "note": "Train capsules are 1.3× the bus icon while both retain a separate 44pt hit target." },
    { "name": "mapBusMarker", "value": 20, "unit": "pt", "use": "Bus stop marker" },
    { "name": "mapBusMarkerCompact", "value": 7, "unit": "pt", "use": "Bus stop at intermediate zoom", "note": "Intermediate zoom: a bus stop becomes a small solid square without a glyph." },
    { "name": "mapStationMarkerCompact", "value": 10, "unit": "pt", "use": "Station below zoom 15", "note": "Zoomed out (below zoom 15), a station is a solid circle in its line colour." },
    { "name": "iconButton", "value": 44, "unit": "pt", "use": "Live track, favorite" },
    { "name": "minimumTapTarget", "value": 44, "unit": "pt", "use": "Hit area of every control, whatever its visual size" },
    { "name": "controlGlyph", "value": 22, "unit": "pt", "use": "Glyphs in icon buttons" },
    { "name": "alertGlyph", "value": 28, "unit": "pt", "use": "Alert glyph" },
    { "name": "metadataGlyph", "value": 16, "unit": "pt", "use": "Advisory glyphs in stop-sheet metadata", "note": "Small advisory glyphs sit inline with stop-sheet freshness metadata." },
    { "name": "nearbyModeGlyph", "value": 12, "unit": "pt", "use": "Paired transit symbols in the Nearby mode button", "note": "Two transit symbols share the compact Nearby mode button when both modes are visible." },
    { "name": "routeToggle", "value": 28, "unit": "pt", "use": "Route filter chip", "note": "Compact detail-sheet filters leave room for Live and Favorite on the same row." },
    { "name": "denseRouteToggle", "value": 28, "unit": "pt", "use": "Route filter chip when a stop has 5+ routes" },
    { "name": "routeToggleMinimumWidth", "value": 44, "unit": "pt", "use": "Minimum route filter width" },
    { "name": "directionControl", "value": 36, "unit": "pt", "use": "Direction control" },
    { "name": "lineBarHeight", "value": 24, "unit": "pt", "use": "Line bar" },
    { "name": "lineBarSegmentWidth", "value": 10, "unit": "pt", "use": "Line bar segment" },
    { "name": "lineBarSegmentSpacing", "value": 3, "unit": "pt", "use": "Between line bar segments" },
    { "name": "listRowMinimumHeight", "value": 56, "unit": "pt", "use": "List row" },
    { "name": "listLead", "value": 44, "unit": "pt", "use": "List row lead column" },
    { "name": "arrivalPanelWidth", "value": 128, "unit": "pt", "use": "Arrivals column of a stop card" },
    { "name": "timelineRowMinimumHeight", "value": 44, "unit": "pt", "use": "Timeline row" },
    { "name": "searchField", "value": 44, "unit": "pt", "use": "Search field" },
    { "name": "settingsRow", "value": 52, "unit": "pt", "use": "Settings row" },
    { "name": "primaryButton", "value": 48, "unit": "pt", "use": "Primary button" },
    { "name": "tabBar", "value": 64, "unit": "pt", "use": "Tab bar" },
    { "name": "tabBarClearance", "value": 88, "unit": "pt", "use": "Sheet content margin above the tab bar", "note": "Bottom content margin that keeps sheet content scrollable above the floating system tab bar." },
    { "name": "tabBarEdgeFade", "value": 118, "unit": "pt", "use": "Fade behind the tab bar", "note": "Height of the fade that takes sheet content into the sheet colour behind the tab bar." },
    { "name": "tabGlyph", "value": 26, "unit": "pt", "use": "Tab bar glyph" },
    { "name": "sheetLow", "css": "core-low-h", "value": 180, "unit": "pt", "use": "Core sheet low position", "note": "The floating card's low position shows its page header above the system tab bar without list content." },
    { "name": "sheetLowNearby", "value": 120, "unit": "pt", "use": "Nearby sheet low position", "note": "Nearby has nothing to show at low: only the grabber shows above the tab bar." },
    { "name": "sheetHalfFraction", "value": 0.5, "unit": "ratio", "use": "Core sheet half position, share of the screen" },
    { "name": "sheetFullTopOffset", "value": 4, "unit": "pt", "use": "Core sheet full position below the top safe area" },
    { "name": "coreSheetInset", "css": "core-inset", "value": 6, "unit": "pt", "use": "Leading, trailing and bottom space around the floating sheet" },
    { "name": "coreSheetHeader", "css": "corebar-h", "value": 64, "unit": "pt", "use": "Page title and 44pt avatar below the grabber zone" },
    { "name": "sheetGrabberZone", "value": 28, "unit": "pt", "use": "Grabber zone at the top of the sheet", "note": "Top of the panel reserved for the grabber; content starts below it." },
    { "name": "grabberWidth", "value": 40, "unit": "pt", "use": "Grabber" },
    { "name": "grabberHeight", "value": 5, "unit": "pt", "use": "Grabber" },
    { "name": "focusRingWidth", "value": 2.5, "unit": "pt", "use": "Focus ring stroke" },
    { "name": "focusRingOffset", "value": 2, "unit": "pt", "use": "Focus ring gap" }
  ],
  "shadows": [
    { "name": "sheet", "css": "shadow-sheet", "color": "ink", "opacity": 0.16, "radius": 30, "x": 0, "y": -10, "use": "Core sheet only" },
    { "name": "floating", "css": "shadow-fab", "color": "ink", "opacity": 0.24, "radius": 16, "x": 0, "y": 6, "use": "Floating controls" },
    { "name": "control", "css": "shadow-control", "color": "ink", "opacity": 0.18, "radius": 4, "x": 0, "y": 1, "darkColor": "#000000", "darkOpacity": 0.4, "use": "Selected segment of a segmented control (web)" }
  ],
  "motion": [
    { "name": "pageDuration", "value": 0.17, "unit": "s", "use": "Page changes; every Reduce Motion crossfade and sheet settle" },
    { "name": "detail", "bezier": [0.2, 0.85, 0.3, 1], "use": "Detail sheet slide curve" },
    { "name": "detailDuration", "value": 0.39, "unit": "s", "use": "Detail sheet slide" },
    { "name": "sheetDuration", "value": 0.42, "unit": "s", "swiftType": "CGFloat", "use": "Sheet spring response" },
    { "name": "sheetBounce", "value": 0.15, "unit": "ratio", "use": "Sheet spring bounce; damping ratio is 1 − bounce", "note": "A gentle bounce when the sheet lands: about 1% overshoot (damping 0.85)." },
    { "name": "recenterDuration", "value": 0.45, "unit": "s", "use": "Map camera recenter" },
    { "name": "swipeSettleDuration", "value": 0.25, "unit": "s", "use": "Swipe settle" },
    { "name": "liveSectionDuration", "value": 0.25, "unit": "s", "use": "Home's Live Tracking section appearing or leaving" },
    { "name": "upcomingPlaceholderDuration", "value": 0.2, "unit": "s", "use": "Upcoming arrivals placeholder" },
    { "name": "upcomingResizeDuration", "value": 0.25, "unit": "s", "use": "Upcoming arrivals resize" },
    { "name": "upcomingFadeDuration", "value": 0.15, "unit": "s", "use": "Upcoming arrivals fade" },
    { "name": "liveValueDuration", "value": 0.15, "unit": "s", "use": "Live value changes" },
    { "name": "controlDuration", "value": 0.15, "unit": "s", "use": "Web control state changes: hover, press, selection" },
    { "name": "spinDuration", "value": 0.6, "unit": "s", "use": "One turn of a refresh or loading spinner" }
  ],
  "space": [
    { "name": "s0", "css": "space-0", "value": 0, "unit": "pt" },
    { "name": "s2", "css": "space-2", "value": 2, "unit": "pt" },
    { "name": "s4", "css": "space-4", "value": 4, "unit": "pt" },
    { "name": "s6", "css": "space-6", "value": 6, "unit": "pt" },
    { "name": "s8", "css": "space-8", "value": 8, "unit": "pt" },
    { "name": "s10", "css": "space-10", "value": 10, "unit": "pt" },
    { "name": "s12", "css": "space-12", "value": 12, "unit": "pt" },
    { "name": "s14", "css": "space-14", "value": 14, "unit": "pt" },
    { "name": "s16", "css": "space-16", "value": 16, "unit": "pt" },
    { "name": "s20", "css": "space-20", "value": 20, "unit": "pt" },
    { "name": "s24", "css": "space-24", "value": 24, "unit": "pt" },
    { "name": "s32", "css": "space-32", "value": 32, "unit": "pt" },
    { "name": "s40", "css": "space-40", "value": 40, "unit": "pt" }
  ],
  "weight": [
    { "name": "regular", "css": "weight-regular", "value": 400 },
    { "name": "medium", "css": "weight-medium", "value": 500 },
    { "name": "semibold", "css": "weight-semibold", "value": 600 },
    { "name": "bold", "css": "weight-bold", "value": 700 },
    { "name": "heavy", "css": "weight-heavy", "value": 750 }
  ]
}
