{
  "$schema": "https://design-tokens.github.io/community-group/format/",
  "meta": {
    "name": "Inline Design System",
    "version": "0.15.0",
    "description": "Design tokens for Inline: color, typography, spacing, sizing, density, radius, borders, elevation, stacking, motion, and charts.",
    "primaryColor": "#18213B",
    "identityColor": "#E9CB62",
    "inkColor": "#18213B",
    "typeface": "Geist 1.7.2",
    "logoTypeface": "Sora 750",
    "baseUnit": 4
  },
  "color": {
    "brand": {
      "50": { "value": "#FDFBF2", "type": "color" },
      "100": { "value": "#FBF5DC", "type": "color" },
      "200": { "value": "#F7EAB4", "type": "color" },
      "300": { "value": "#F2DD8D", "type": "color" },
      "400": { "value": "#EED273", "type": "color" },
      "500": {
        "value": "#E9CB62",
        "type": "color",
        "description": "Logo marker and identity anchor"
      },
      "600": { "value": "#C9A83F", "type": "color" },
      "700": { "value": "#9D7E27", "type": "color" },
      "800": { "value": "#735A1E", "type": "color" },
      "900": { "value": "#4C3A17", "type": "color" },
      "950": { "value": "#2A200D", "type": "color" }
    },
    "feedback": {
      "argument": {
        "value": "#515197",
        "type": "color",
        "description": "Argument dimension title color; passage marks stay Butter Yellow"
      },
      "evidence": {
        "value": "#735900",
        "type": "color",
        "description": "Evidence dimension title color; passage marks stay Butter Yellow"
      },
      "reasoning": {
        "value": "#2F5A8F",
        "type": "color",
        "description": "Reasoning dimension title color; passage marks stay Butter Yellow"
      },
      "clarity": {
        "value": "#016770",
        "type": "color",
        "description": "Clarity dimension title color; passage marks stay Butter Yellow"
      },
      "strength": {
        "value": "#416A33",
        "type": "color",
        "description": "Strength dimension title color; passage marks stay Butter Yellow"
      }
    },
    "brainstorm": {
      "understand": {
        "value": "#9B3F38",
        "type": "color",
        "description": "Understand purpose title"
      },
      "explore": {
        "value": "#704776",
        "type": "color",
        "description": "Explore purpose title"
      },
      "focus": {
        "value": "#955015",
        "type": "color",
        "description": "Focus purpose title"
      },
      "gather": {
        "value": "#4F5873",
        "type": "color",
        "description": "Gather purpose title"
      },
      "connect": {
        "value": "#2C6663",
        "type": "color",
        "description": "Connect purpose title"
      },
      "challenge": {
        "value": "#873E63",
        "type": "color",
        "description": "Challenge purpose title"
      },
      "next-step": {
        "value": "#536931",
        "type": "color",
        "description": "Next step purpose title"
      }
    },
    "chart": {
      "series-1": { "value": "#3F529C", "type": "color", "description": "Indigo, the Midnight axis at chart chroma. Four series at most, held to one lightness pair and one chroma band and separated by hue" },
      "series-2": { "value": "#8E7000", "type": "color", "description": "Ochre, the brand-gold axis; deep enough to stay clear of the butter emphasis" },
      "series-3": { "value": "#008776", "type": "color", "description": "Teal, perpendicular to the brand axis" },
      "series-4": { "value": "#90382D", "type": "color", "description": "Rust, perpendicular to the brand axis. Never a judgment color: pair it with a legend, never with danger-600 in one view" },
      "series-5": { "value": "{color.ink.300}", "type": "color", "description": "Deprecated in 0.15.0: the categorical set caps at four series. Aliased to the neutral role so lingering consumers stay in palette" },
      "series-6": { "value": "#90382D", "type": "color", "description": "Deprecated in 0.15.0: the categorical set caps at four series. Aliased to series-4 so lingering consumers stay in palette" },
      "emphasis": { "value": "{color.brand.500}", "type": "color", "description": "The one series or datum the chart is about" },
      "neutral": { "value": "{color.ink.300}", "type": "color", "description": "Context series and de-emphasized comparisons" },
      "grid": { "value": "{color.line-soft}", "type": "color" },
      "axis-text": { "value": "{color.ink.500}", "type": "color" }
    },
    "ink": {
      "50": { "value": "#F6F6F3", "type": "color" },
      "100": { "value": "#ECEEF1", "type": "color" },
      "200": { "value": "#D8DCE3", "type": "color" },
      "300": { "value": "#BAC0CC", "type": "color" },
      "400": { "value": "#929BAA", "type": "color" },
      "500": { "value": "#707B8D", "type": "color" },
      "600": { "value": "#536075", "type": "color" },
      "700": { "value": "#39465F", "type": "color" },
      "800": { "value": "#26324D", "type": "color" },
      "900": {
        "value": "#18213B",
        "type": "color",
        "description": "Primary text and wordmark"
      },
      "950": { "value": "#0C1224", "type": "color" }
    },
    "paper": {
      "value": "#F6F6F3",
      "type": "color",
      "description": "Page background"
    },
    "surface": {
      "value": "#FFFFFF",
      "type": "color",
      "description": "Cards, modals, product UI canvas"
    },
    "line": {
      "value": "#DFE0E2",
      "type": "color",
      "description": "Dividers on paper"
    },
    "line-soft": { "value": "#ECEDEA", "type": "color" },
    "border-strong": { "value": "#707B8D", "type": "color" },
    "success": {
      "100": { "value": "#E9F4EE", "type": "color" },
      "200": { "value": "#C3E1D2", "type": "color" },
      "600": { "value": "#2D634B", "type": "color" },
      "800": { "value": "#00452E", "type": "color" }
    },
    "warn": {
      "100": { "value": "#F7F0E7", "type": "color" },
      "200": { "value": "#EAD5BE", "type": "color" },
      "600": { "value": "#855715", "type": "color" },
      "800": { "value": "#513100", "type": "color" }
    },
    "danger": {
      "100": { "value": "#FAEDEE", "type": "color" },
      "200": { "value": "#F1CFD2", "type": "color" },
      "600": { "value": "#992F45", "type": "color" },
      "800": { "value": "#621D2B", "type": "color" }
    },
    "info": {
      "100": { "value": "#E9F3FA", "type": "color" },
      "200": { "value": "#C3DDF0", "type": "color" },
      "600": { "value": "#345B76", "type": "color" },
      "800": { "value": "#063D5C", "type": "color" }
    },
    "alpha": {
      "ink-04": { "value": "#18213B0A", "type": "color" },
      "ink-08": { "value": "#18213B14", "type": "color" },
      "ink-16": { "value": "#18213B29", "type": "color" },
      "ink-32": { "value": "#18213B52", "type": "color" },
      "ink-64": { "value": "#18213BA3", "type": "color" },
      "brand-52": {
        "value": "#E9CB6285",
        "type": "color",
        "description": "Native text selection; translucent over existing marks"
      },
      "brand-strong-64": {
        "value": "#C9A83FA3",
        "type": "color",
        "description": "Native selection when it crosses a persistent highlight"
      },
      "paper-72": { "value": "#F6F6F3B8", "type": "color" },
      "paper-88": { "value": "#F6F6F3E0", "type": "color" }
    },
    "semantic": {
      "text": {
        "primary": { "value": "{color.ink.900}", "type": "color" },
        "secondary": { "value": "{color.ink.600}", "type": "color" },
        "tertiary": { "value": "{color.ink.500}", "type": "color" },
        "disabled": { "value": "{color.ink.400}", "type": "color" },
        "inverse": { "value": "{color.paper}", "type": "color" },
        "link": { "value": "{color.ink.900}", "type": "color" },
        "link-hover": { "value": "{color.brand.800}", "type": "color" },
        "on-primary": { "value": "{color.paper}", "type": "color" },
        "on-danger": { "value": "{color.surface}", "type": "color" }
      },
      "background": {
        "canvas": { "value": "{color.paper}", "type": "color" },
        "surface": { "value": "{color.surface}", "type": "color" },
        "subtle": { "value": "{color.ink.50}", "type": "color" },
        "muted": { "value": "{color.ink.100}", "type": "color" },
        "inverse": { "value": "{color.ink.900}", "type": "color" },
        "brand-subtle": { "value": "{color.brand.100}", "type": "color" },
        "selected": { "value": "{color.brand.200}", "type": "color" },
        "overlay": { "value": "{color.alpha.ink-32}", "type": "color", "description": "The one dialog scrim; menus and popovers never dim the page" }
      },
      "border": {
        "default": { "value": "{color.line}", "type": "color" },
        "subtle": { "value": "{color.line-soft}", "type": "color" },
        "strong": { "value": "{color.border-strong}", "type": "color" },
        "focus": { "value": "{color.brand.700}", "type": "color" },
        "selected": { "value": "{color.brand.700}", "type": "color" },
        "danger": { "value": "{color.danger.600}", "type": "color" }
      },
      "action": {
        "primary": { "value": "{color.ink.900}", "type": "color" },
        "primary-hover": { "value": "{color.ink.800}", "type": "color" },
        "primary-active": { "value": "{color.ink.950}", "type": "color" },
        "primary-disabled": { "value": "{color.ink.200}", "type": "color" },
        "primary-text": { "value": "{color.paper}", "type": "color" }
      },
      "focus": { "ring": { "value": "{color.brand.700}", "type": "color" } },
      "selection": {
        "background": { "value": "{color.alpha.brand-52}", "type": "color" },
        "background-on-mark": { "value": "{color.alpha.brand-strong-64}", "type": "color" },
        "border": { "value": "{color.brand.700}", "type": "color" }
      },
      "feedback": {
        "passage": { "value": "{color.brand.100}", "type": "color" },
        "passage-active": { "value": "{color.brand.200}", "type": "color" },
        "passage-boundary": { "value": "{color.brand.700}", "type": "color" },
        "card": { "value": "{color.surface}", "type": "color" },
        "card-border": { "value": "{color.line}", "type": "color" },
        "card-border-hover": { "value": "{color.ink.300}", "type": "color" },
        "card-border-active": { "value": "{color.ink.400}", "type": "color" },
        "title-argument": { "value": "{color.feedback.argument}", "type": "color" },
        "title-evidence": { "value": "{color.feedback.evidence}", "type": "color" },
        "title-reasoning": { "value": "{color.feedback.reasoning}", "type": "color" },
        "title-clarity": { "value": "{color.feedback.clarity}", "type": "color" },
        "title-strength": { "value": "{color.feedback.strength}", "type": "color" }
      },
      "brainstorm": {
        "card": { "value": "{color.surface}", "type": "color" },
        "card-border": { "value": "{color.line}", "type": "color" },
        "title-understand": { "value": "{color.brainstorm.understand}", "type": "color" },
        "title-explore": { "value": "{color.brainstorm.explore}", "type": "color" },
        "title-focus": { "value": "{color.brainstorm.focus}", "type": "color" },
        "title-gather": { "value": "{color.brainstorm.gather}", "type": "color" },
        "title-connect": { "value": "{color.brainstorm.connect}", "type": "color" },
        "title-challenge": { "value": "{color.brainstorm.challenge}", "type": "color" },
        "title-next-step": { "value": "{color.brainstorm.next-step}", "type": "color" }
      }
    }
  },
  "font": {
    "family": {
      "sans": {
        "value": "'Geist Inline', Geist, ui-sans-serif, system-ui, -apple-system, 'Segoe UI', Roboto, sans-serif",
        "type": "fontFamily"
      },
      "mono": {
        "value": "'Geist Mono Inline', 'Geist Mono', ui-monospace, SFMono-Regular, Menlo, Consolas, monospace",
        "type": "fontFamily"
      },
      "logo": {
        "value": "'Sora Inline', Sora, sans-serif",
        "type": "fontFamily",
        "description": "Logo wordmark only; weight 750 and tracking -0.055em"
      },
      "serif": {
        "value": "ui-serif, Georgia, 'Times New Roman', serif",
        "type": "fontFamily",
        "description": "Reserved for long-form legal/contract PDFs only"
      }
    },
    "weight": {
      "regular": { "value": 400, "type": "fontWeight" },
      "medium": { "value": 500, "type": "fontWeight" },
      "semibold": { "value": 600, "type": "fontWeight" },
      "logo": { "value": 750, "type": "fontWeight" }
    }
  },
  "size": {
    "display-xl": {
      "value": "64px",
      "type": "dimension",
      "lineHeight": "67px",
      "weight": 600,
      "tracking": "-0.03em",
      "responsive": "clamp(2.625rem, 1.95rem + 3vw, 4rem)"
    },
    "display-lg": {
      "value": "52px",
      "type": "dimension",
      "lineHeight": "56px",
      "weight": 600,
      "tracking": "-0.025em",
      "responsive": "clamp(2.375rem, 1.94rem + 1.95vw, 3.25rem)"
    },
    "display": {
      "value": "40px",
      "type": "dimension",
      "lineHeight": "45px",
      "weight": 600,
      "tracking": "-0.02em",
      "responsive": "clamp(2.125rem, 1.94rem + 0.83vw, 2.5rem)"
    },
    "h1": {
      "value": "32px",
      "type": "dimension",
      "lineHeight": "38px",
      "weight": 600,
      "tracking": "-0.02em"
    },
    "h2": {
      "value": "26px",
      "type": "dimension",
      "lineHeight": "33px",
      "weight": 600,
      "tracking": "-0.015em"
    },
    "h3": {
      "value": "20px",
      "type": "dimension",
      "lineHeight": "27px",
      "weight": 600,
      "tracking": "-0.01em"
    },
    "h4": {
      "value": "17px",
      "type": "dimension",
      "lineHeight": "24px",
      "weight": 500,
      "tracking": "0"
    },
    "body-lg": {
      "value": "18px",
      "type": "dimension",
      "lineHeight": "30px",
      "weight": 400
    },
    "prose": {
      "value": "17px",
      "type": "dimension",
      "lineHeight": "30px",
      "weight": 400,
      "measure": "72ch",
      "description": "Student drafts and sustained reading"
    },
    "body-md": {
      "value": "15px",
      "type": "dimension",
      "lineHeight": "24px",
      "weight": 400
    },
    "body-sm": {
      "value": "13px",
      "type": "dimension",
      "lineHeight": "20px",
      "weight": 400
    },
    "label": {
      "value": "13px",
      "type": "dimension",
      "lineHeight": "16px",
      "weight": 500
    },
    "caption": {
      "value": "12px",
      "type": "dimension",
      "lineHeight": "17px",
      "weight": 400
    },
    "overline": {
      "value": "11px",
      "type": "dimension",
      "lineHeight": "14px",
      "weight": 600,
      "tracking": "0.12em",
      "transform": "uppercase"
    },
    "code": {
      "value": "13px",
      "type": "dimension",
      "lineHeight": "20px",
      "weight": 400
    }
  },
  "space": {
    "0": { "value": "0px", "type": "dimension" },
    "0_5": { "value": "2px", "type": "dimension" },
    "1": { "value": "4px", "type": "dimension" },
    "1_5": { "value": "6px", "type": "dimension" },
    "2": { "value": "8px", "type": "dimension" },
    "3": { "value": "12px", "type": "dimension" },
    "4": { "value": "16px", "type": "dimension" },
    "5": { "value": "20px", "type": "dimension" },
    "6": { "value": "24px", "type": "dimension" },
    "7": { "value": "28px", "type": "dimension" },
    "8": { "value": "32px", "type": "dimension" },
    "10": { "value": "40px", "type": "dimension" },
    "12": { "value": "48px", "type": "dimension" },
    "16": { "value": "64px", "type": "dimension" },
    "20": { "value": "80px", "type": "dimension" },
    "24": { "value": "96px", "type": "dimension" },
    "32": { "value": "128px", "type": "dimension" },
    "40": { "value": "160px", "type": "dimension" },
    "semantic": {
      "inline": {
        "xs": { "value": "{space.1}", "type": "dimension", "description": "Tight inline separation" },
        "sm": { "value": "{space.2}", "type": "dimension", "description": "Default inline separation" },
        "md": { "value": "{space.3}", "type": "dimension", "description": "Loose inline separation" }
      },
      "stack": {
        "xs": { "value": "{space.2}", "type": "dimension", "description": "Tight stacked separation" },
        "sm": { "value": "{space.3}", "type": "dimension", "description": "Small stacked separation" },
        "md": { "value": "{space.4}", "type": "dimension", "description": "Default stacked separation" },
        "lg": { "value": "{space.6}", "type": "dimension", "description": "Loose stacked separation" }
      },
      "inset": {
        "sm": { "value": "{space.4}", "type": "dimension", "description": "Compact component inset" },
        "md": { "value": "{space.6}", "type": "dimension", "description": "Default component inset" },
        "lg": { "value": "{space.8}", "type": "dimension", "description": "Spacious component inset" }
      },
      "page-gutter": {
        "mobile": { "value": "{space.4}", "type": "dimension", "description": "Mobile shell gutter" },
        "desktop": { "value": "{space.6}", "type": "dimension", "description": "Desktop shell gutter" }
      },
      "section": {
        "product": { "value": "{space.16}", "type": "dimension", "description": "Product and mobile section separation" },
        "marketing": { "value": "{space.24}", "type": "dimension", "description": "Marketing desktop section separation" }
      },
      "workspace-gap": {
        "value": "{space.6}",
        "type": "dimension",
        "description": "Desktop gap between draft and question rail"
      }
    }
  },
  "control": {
    "height": {
      "sm": { "value": "32px", "type": "dimension" },
      "md": { "value": "40px", "type": "dimension" },
      "lg": { "value": "44px", "type": "dimension" }
    },
    "target-min": {
      "value": "44px",
      "type": "dimension",
      "description": "Minimum effective interactive target"
    },
    "selection-visual": {
      "value": "20px",
      "type": "dimension",
      "description": "Checkbox and radio visual size"
    },
    "switch": {
      "width": { "value": "40px", "type": "dimension" },
      "height": { "value": "24px", "type": "dimension" }
    }
  },
  "icon": {
    "weight": { "value": "regular", "type": "string", "description": "Phosphor weight for all product UI; the set has no stroke attribute to tune" },
    "size": {
      "xs": { "value": "12px", "type": "dimension" },
      "sm": { "value": "16px", "type": "dimension" },
      "md": { "value": "20px", "type": "dimension" },
      "lg": { "value": "24px", "type": "dimension" }
    }
  },
  "avatar": {
    "size": {
      "xs": { "value": "16px", "type": "dimension" },
      "sm": { "value": "24px", "type": "dimension" },
      "md": { "value": "32px", "type": "dimension" },
      "lg": { "value": "40px", "type": "dimension" },
      "xl": { "value": "64px", "type": "dimension" }
    }
  },
  "chip": {
    "height": {
      "sm": { "value": "24px", "type": "dimension" },
      "md": { "value": "32px", "type": "dimension" }
    }
  },
  "toolbar": {
    "height": {
      "compact": { "value": "48px", "type": "dimension" },
      "app": { "value": "64px", "type": "dimension" }
    }
  },
  "border": {
    "width": {
      "none": { "value": "0px", "type": "dimension" },
      "hairline": { "value": "1px", "type": "dimension", "description": "Every card, input, divider, and table rule" },
      "emphasis": { "value": "2px", "type": "dimension", "description": "Focus ring, active passage baseline, selection bars, accent rules" }
    }
  },
  "z": {
    "base": { "value": 0, "type": "number", "description": "In-flow content" },
    "raised": { "value": 10, "type": "number", "description": "Sticky table headers and in-page raised surfaces" },
    "sticky": { "value": 20, "type": "number", "description": "App navigation and sticky toolbars" },
    "overlay": { "value": 30, "type": "number", "description": "Menus, popovers, autocomplete, tooltips" },
    "toast": { "value": 40, "type": "number", "description": "Toasts; below any blocking dialog" },
    "backdrop": { "value": 50, "type": "number", "description": "Dialog scrim" },
    "dialog": { "value": 60, "type": "number", "description": "Blocking dialogs; the top of the product stack" }
  },
  "radius": {
    "none": {
      "value": "0px",
      "type": "dimension",
      "description": "Logo marker, manuscript planes, margin question cards, tables, and full-bleed regions"
    },
    "xs": {
      "value": "2px",
      "type": "dimension",
      "description": "Code, progress tracks, and small indicators"
    },
    "sm": {
      "value": "4px",
      "type": "dimension",
      "description": "Buttons, fields, tabs, tags, and navigation rows"
    },
    "md": {
      "value": "8px",
      "type": "dimension",
      "description": "Detached cards and menus"
    },
    "lg": {
      "value": "12px",
      "type": "dimension",
      "description": "Dialogs and large standalone panels only"
    },
    "full": {
      "value": "9999px",
      "type": "dimension",
      "description": "Avatars, status dots, and genuinely circular controls only"
    }
  },
  "shadow": {
    "none": {
      "value": "none",
      "type": "shadow",
      "description": "Canvas, draft, cards, controls, and all other in-flow surfaces"
    },
    "raised": {
      "value": "0 1px 2px 0 rgb(24 33 59 / 0.06)",
      "type": "shadow",
      "description": "Sticky surfaces after content passes beneath and active drag previews"
    },
    "overlay": {
      "value": "0 8px 24px -4px rgb(24 33 59 / 0.12), 0 2px 6px 0 rgb(24 33 59 / 0.06)",
      "type": "shadow",
      "description": "Menus, popovers, autocomplete panels, and transient floating tools"
    },
    "dialog": {
      "value": "0 24px 64px -12px rgb(12 18 36 / 0.18), 0 6px 18px -4px rgb(12 18 36 / 0.08)",
      "type": "shadow",
      "description": "Modal dialogs and blocking surfaces paired with an overlay backdrop"
    }
  },
  "workspace": {
    "min-height": {
      "value": "460px",
      "type": "dimension",
      "description": "Minimum desktop draft workbench height"
    },
    "viewport-offset": {
      "value": "304px",
      "type": "dimension",
      "description": "Reserved vertical space above and below the desktop workbench"
    },
    "compose-rail": { "value": "248px", "type": "dimension", "description": "Compose progress rail width from lg" },
    "question-rail-min": { "value": "320px", "type": "dimension" },
    "question-rail-max": { "value": "400px", "type": "dimension" },
    "draft-rail-ratio": {
      "value": "2:1",
      "type": "string",
      "description": "Draft receives two flexible columns for each question-rail column"
    },
    "draft-fr": { "value": "2fr", "type": "string" },
    "question-rail-fr": { "value": "1fr", "type": "string" }
  },
  "motion": {
    "duration": {
      "xs": { "value": "80ms", "type": "duration" },
      "sm": { "value": "160ms", "type": "duration" },
      "md": { "value": "240ms", "type": "duration" },
      "lg": { "value": "480ms", "type": "duration" },
      "xl": { "value": "720ms", "type": "duration" }
    },
    "recipe": {
      "hover": { "value": "{motion.duration.xs} {motion.ease.out}", "type": "string", "description": "Color and border state changes; press sinks 1px" },
      "check": { "value": "glyph draw-in · {motion.duration.sm} {motion.ease.out}", "type": "string", "description": "Checkbox check draws via stroke offset; uncheck fades" },
      "radio": { "value": "dot fade and settle from 0.6 scale · {motion.duration.sm} {motion.ease.out}", "type": "string", "description": "No bounce" },
      "switch": { "value": "thumb translate 16px · {motion.duration.sm} {motion.ease.out}", "type": "string", "description": "Track color crossfades on the same clock" },
      "enter": { "value": "fade + 8px rise · {motion.duration.md} {motion.ease.out}", "type": "string", "description": "Cards, panels, and step content entering" },
      "exit": { "value": "fade · {motion.duration.sm} {motion.ease.out}", "type": "string", "description": "Anything leaving; exits never translate" },
      "overlay": { "value": "fade + 4px rise · {motion.duration.sm} {motion.ease.out}", "type": "string", "description": "Menus, popovers, and toasts; no scale, no bounce" },
      "page": { "value": "fade + 8px rise · {motion.duration.md} {motion.ease.out}", "type": "string", "description": "Route-level entrance" },
      "stagger": { "value": "60ms · 6 items maximum", "type": "string", "description": "List entrances; later items appear together" },
      "sticky-raise": { "value": "shadow fade · {motion.duration.sm}", "type": "string", "description": "none to raised as content passes beneath" }
    },
    "ease": {
      "out": {
        "value": "cubic-bezier(0.16, 1, 0.3, 1)",
        "type": "cubicBezier"
      },
      "in-out": {
        "value": "cubic-bezier(0.65, 0, 0.35, 1)",
        "type": "cubicBezier"
      },
      "standard": {
        "value": "cubic-bezier(0.16, 1, 0.3, 1)",
        "type": "cubicBezier"
      },
      "linear": { "value": "linear", "type": "cubicBezier" }
    }
  },
  "breakpoint": {
    "sm": { "value": "640px", "type": "dimension" },
    "md": { "value": "768px", "type": "dimension" },
    "lg": { "value": "1024px", "type": "dimension" },
    "xl": { "value": "1280px", "type": "dimension" },
    "2xl": { "value": "1536px", "type": "dimension" }
  },
  "container": {
    "max": { "value": "1200px", "type": "dimension" },
    "band": { "value": "1120px", "type": "dimension", "description": "Marketing band width" },
    "workbench": { "value": "920px", "type": "dimension", "description": "Compose editor maximum" },
    "reading": { "value": "680px", "type": "dimension" },
    "narrow": { "value": "400px", "type": "dimension", "description": "Auth and narrow forms" },
    "gutter-mobile": { "value": "16px", "type": "dimension" },
    "gutter-desktop": { "value": "24px", "type": "dimension" }
  }
}