{
  "meta": {
    "name": "Easel",
    "description": "Open-source, prompt-driven AI design-generation tool. Warm editorial/vintage-paper marketing site (paper ground, coral accent, Playfair Display + Inter Tight) paired with a three-pane prompt-to-canvas design editor. Documents the website and the app/editor as one shared visual language.",
    "url": "",
    "designSystemName": "Easel Tokens",
    "platform": "Web (HTML/CSS) + Tailwind CSS — Playfair Display, Inter Tight, Inter, JetBrains Mono",
    "type": "AI design / generative-canvas tool",
    "extracted": "2026-06-06",
    "portal": "",
    "iosApp": false,
    "scope": "Marketing site + AI design editor (app)"
  },
  "website": {
    "color": {
      "_description": "Warm editorial palette on a vintage-paper ground. Near-black ink for type, a single coral accent for primary actions and brand, and a small set of editorial secondaries (green, mustard, olive). Light-but-warm — NOT a generic white theme. Body background is paper (#efe7d2).",
      "brand": {
        "coral": { "value": "#ed6f5c", "description": "Primary accent — primary CTA pill, brand mark, active states, links" },
        "coral-soft": { "value": "#f08e7c", "description": "Lighter coral — hover lift, soft accent text, glow tint" }
      },
      "paper": {
        "paper": { "value": "#efe7d2", "description": "Body background — the canonical vintage-paper ground" },
        "paper-warm": { "value": "#ece4cf", "description": "Slightly warmer section background" },
        "paper-dark": { "value": "#ddd2b6", "description": "Deeper paper for contrast bands, insets, dividers" },
        "bone": { "value": "#f7f1de", "description": "Lightest surface — cards, panels, raised tiles" }
      },
      "ink": {
        "ink": { "value": "#15140f", "description": "Headings and primary type, near-black warm ink" },
        "ink-soft": { "value": "#2a2620", "description": "Body copy" },
        "ink-mute": { "value": "#5a5448", "description": "Secondary text, supporting copy" },
        "ink-faint": { "value": "#8b8676", "description": "Labels, captions, microcopy, eyebrow text" }
      },
      "editorial": {
        "green": { "value": "#237f00", "description": "Editorial positive / success accent" },
        "mustard": { "value": "#e9b94a", "description": "Editorial warm highlight" },
        "olive": { "value": "#6e7448", "description": "Editorial muted secondary" }
      },
      "line": {
        "line": { "value": "rgba(21, 20, 15, 0.16)", "description": "Default hairline border on paper" },
        "line-soft": { "value": "rgba(21, 20, 15, 0.08)", "description": "Subtle divider" },
        "line-faint": { "value": "rgba(21, 20, 15, 0.05)", "description": "Faintest separator" }
      }
    },
    "typography": {
      "fontFamily": {
        "serif": "'Playfair Display', 'Times New Roman', serif",
        "sans": "'Inter Tight', 'Inter', -apple-system, BlinkMacSystemFont, system-ui, sans-serif",
        "body": "'Inter', -apple-system, system-ui, sans-serif",
        "mono": "'JetBrains Mono', 'SF Mono', Menlo, monospace"
      },
      "_note": "Playfair Display is the editorial display/serif voice. Inter Tight drives the large compressed headings (H1-H4). Inter handles body copy. JetBrains Mono for code, IDs, and labels-as-data.",
      "scale": {
        "h1": { "fontSize": "72px", "lineHeight": "72px", "letterSpacing": "-2.016px", "weight": 800, "family": "Inter Tight", "use": "Hero headline" },
        "h2": { "fontSize": "77.76px", "lineHeight": "77.76px", "letterSpacing": "-2.177px", "weight": 800, "family": "Inter Tight", "use": "Major section heading" },
        "h3": { "fontSize": "22px", "lineHeight": "23.1px", "letterSpacing": "-0.308px", "weight": 700, "family": "Inter Tight", "use": "Sub-section / card heading" },
        "h4": { "fontSize": "18px", "lineHeight": "27.9px", "letterSpacing": "-0.252px", "weight": 700, "family": "Inter Tight", "use": "Card title, link heading" },
        "body": { "fontSize": "16px", "lineHeight": "24.8px", "weight": 400, "family": "Inter", "use": "Default body copy (line-height ~1.55)" },
        "link": { "fontSize": "18px", "lineHeight": "27.9px", "letterSpacing": "-0.18px", "weight": 700, "family": "Inter Tight", "use": "Inline nav / emphasized links" },
        "label": { "fontSize": "10px", "lineHeight": "15.5px", "letterSpacing": "1px", "weight": 400, "family": "Inter Tight", "textTransform": "uppercase", "color": "#8b8676", "use": "Eyebrows, labels, captions" }
      },
      "weights": { "regular": 400, "medium": 500, "semibold": 700, "extrabold": 800 }
    },
    "spacing": {
      "_unit": "px",
      "scale": {
        "1": "4px", "2": "8px", "3": "12px", "4": "16px", "5": "20px",
        "6": "24px", "8": "32px", "10": "40px", "12": "48px", "16": "64px",
        "20": "80px", "24": "96px", "32": "128px"
      }
    },
    "radius": {
      "xs": "2px",
      "sm": "6px",
      "md": "8px",
      "lg": "12px",
      "xl": "14px",
      "2xl": "18px",
      "pill": "999px",
      "full": "50%"
    },
    "shadow": {
      "soft": "0 30px 60px -30px rgba(21, 20, 15, 0.18)",
      "card": "0 12px 36px rgba(26, 26, 26, 0.08)",
      "coral": "0 14px 26px -16px #ed6f5c",
      "hairline-inset": "0 0 0 1px rgba(21, 20, 15, 0.06)",
      "soft-with-inset": "0 30px 60px -30px rgba(21, 20, 15, 0.18), 0 0 0 1px rgba(21, 20, 15, 0.06) inset"
    },
    "layout": {
      "wrapper-max": "1200px",
      "container-padding": { "desktop": "32px", "mobile": "20px" },
      "section-gap": { "default": "80px", "spacious": "128px" },
      "grid-gap": "24px"
    },
    "motion": {
      "reveal": "opacity .6s ease, transform .6s ease (delay var --reveal-delay .4s)",
      "transition-default": "all 200ms ease",
      "transition-color": "color 150ms ease",
      "transition-lift": "transform 200ms ease, box-shadow 200ms ease"
    },
    "components": {
      "buttonPrimary": {
        "background": "#ed6f5c",
        "color": "#ffffff",
        "borderRadius": "999px",
        "padding": "11px 22px",
        "fontSize": "14px",
        "fontWeight": 500,
        "boxShadow": "0 14px 26px -16px #ed6f5c",
        "hover": { "background": "#f08e7c" },
        "active": { "transform": "translateY(1px)" }
      },
      "buttonDark": {
        "background": "#15140f",
        "color": "#efe7d2",
        "borderRadius": "999px",
        "padding": "11px 22px",
        "fontSize": "14px",
        "fontWeight": 500,
        "hover": { "background": "#2a2620" }
      },
      "buttonOutline": {
        "background": "transparent",
        "color": "#15140f",
        "border": "1px solid rgba(21, 20, 15, 0.16)",
        "borderRadius": "999px",
        "padding": "9px 18px",
        "fontSize": "13px",
        "fontWeight": 400,
        "hover": { "background": "rgba(21, 20, 15, 0.05)", "borderColor": "rgba(21, 20, 15, 0.28)" }
      },
      "buttonGithubStar": {
        "_use": "GitHub-style outline pill, e.g. 'Star · 60.3K' — open-source social proof",
        "background": "transparent",
        "color": "#15140f",
        "border": "1px solid rgba(21, 20, 15, 0.18)",
        "borderRadius": "999px",
        "padding": "9px 16px",
        "fontSize": "13px",
        "fontWeight": 500
      },
      "navLink": {
        "color": "#15140f",
        "fontSize": "18px",
        "fontWeight": 700,
        "fontFamily": "Inter Tight",
        "hover": { "color": "#ed6f5c" }
      },
      "card": {
        "background": "#f7f1de",
        "border": "1px solid rgba(21, 20, 15, 0.08)",
        "borderRadius": "18px",
        "padding": "28px",
        "color": "#15140f",
        "boxShadow": "0 12px 36px rgba(26, 26, 26, 0.08)",
        "hover": { "boxShadow": "0 30px 60px -30px rgba(21, 20, 15, 0.18)", "transform": "translateY(-2px)" }
      },
      "categoryPill": {
        "_use": "Filter pills (e.g. 'All', 'Prototype'). Active fills coral, white text.",
        "background": "transparent",
        "color": "#2a2620",
        "border": "1px solid rgba(21, 20, 15, 0.16)",
        "borderRadius": "999px",
        "padding": "9px 18px",
        "fontSize": "13px",
        "active": { "background": "#ed6f5c", "color": "#ffffff", "border": "1px solid #ed6f5c" }
      }
    }
  },
  "app": {
    "_description": "The Easel design editor — a prompt-to-canvas tool. Three-pane shell: left tool/asset panel, center artboard canvas, right inspector. The warm paper/coral/Playfair+Inter-Tight identity is applied to AI-design-tool app patterns (top toolbar, prompt-to-generate panel, floating canvas prompt bar, on-canvas object toolbar, layers tree, AI-prompt modal). Surfaces push to bone/paper-warm for panels; canvas reads as a dotted paper-dark field.",
    "color": {
      "background": {
        "canvas": { "value": "#ddd2b6", "description": "Center artboard field (dotted/grid paper)" },
        "panel": { "value": "#f7f1de", "description": "Left tool panel and right inspector surface (bone)" },
        "panel-warm": { "value": "#ece4cf", "description": "Toolbar / secondary panel rows" },
        "artboard": { "value": "#efe7d2", "description": "Artboard / page surface placed on the canvas" },
        "row-hover": { "value": "rgba(21, 20, 15, 0.05)", "description": "Layer-row / list-item hover" },
        "selected": { "value": "rgba(237, 111, 92, 0.10)", "description": "Selected layer / active tile fill (coral tint)" }
      },
      "text": {
        "primary": { "value": "#15140f", "description": "Panel headings, active labels" },
        "muted": { "value": "#5a5448", "description": "Secondary panel text, inactive controls" },
        "faint": { "value": "#8b8676", "description": "Section labels, layer meta, placeholder" }
      },
      "accent": {
        "coral": { "value": "#ed6f5c", "description": "Generate CTA, selection handles, active tool, focus ring" },
        "coral-soft": { "value": "#f08e7c", "description": "Hover, selection glow" }
      },
      "border": {
        "panel": "rgba(21, 20, 15, 0.16)",
        "divider": "rgba(21, 20, 15, 0.08)",
        "input": "rgba(21, 20, 15, 0.16)",
        "selection": "#ed6f5c"
      }
    },
    "typography": {
      "fontFamily": {
        "ui": "'Inter Tight', 'Inter', system-ui, sans-serif",
        "body": "'Inter', system-ui, sans-serif",
        "mono": "'JetBrains Mono', 'SF Mono', Menlo, monospace"
      },
      "scale": {
        "panel-title": { "fontSize": "18px", "weight": 700, "family": "Inter Tight", "use": "Inspector / panel section heading" },
        "panel-label": { "fontSize": "10px", "weight": 400, "letterSpacing": "1px", "textTransform": "uppercase", "color": "#8b8676", "use": "Group labels in panels" },
        "control": { "fontSize": "13px", "weight": 500, "family": "Inter Tight", "use": "Buttons, toolbar controls, tabs" },
        "field": { "fontSize": "14px", "weight": 400, "family": "Inter", "use": "Prompt textarea, inputs" },
        "layer-row": { "fontSize": "13px", "weight": 400, "family": "Inter", "use": "Layers tree row label" },
        "mono-value": { "fontSize": "12px", "weight": 400, "family": "JetBrains Mono", "use": "Numeric inspector values (X/Y/W/H, opacity)" }
      }
    },
    "layout": {
      "topbar-height": "56px",
      "left-panel-width": "280px",
      "right-panel-width": "300px",
      "panel-padding": "16px",
      "canvas-min-height": "520px",
      "object-toolbar-height": "40px",
      "prompt-bar-max-width": "640px"
    },
    "components": {
      "editorShell": {
        "_use": "Three-pane editor grid",
        "display": "grid",
        "gridTemplateColumns": "280px 1fr 300px",
        "gridTemplateRows": "56px 1fr",
        "background": "#ddd2b6",
        "panelBackground": "#f7f1de",
        "panelBorder": "1px solid rgba(21, 20, 15, 0.16)"
      },
      "topToolbar": {
        "height": "56px",
        "background": "#ece4cf",
        "borderBottom": "1px solid rgba(21, 20, 15, 0.16)",
        "padding": "0 16px",
        "fileName": { "fontFamily": "Inter Tight", "fontSize": "13px", "fontWeight": 700, "color": "#15140f" },
        "autosave": { "fontSize": "10px", "letterSpacing": "1px", "textTransform": "uppercase", "color": "#8b8676" },
        "controlGroup": { "gap": "8px" },
        "primaryCta": { "background": "#ed6f5c", "color": "#ffffff", "borderRadius": "999px", "padding": "8px 18px", "fontSize": "13px", "fontWeight": 500 }
      },
      "promptPanel": {
        "_use": "Prompt-to-generate panel (left or modal): textarea + reference chips + style preset grid + Generate",
        "background": "#f7f1de",
        "borderRadius": "14px",
        "padding": "16px",
        "boxShadow": "0 12px 36px rgba(26, 26, 26, 0.08)",
        "textarea": {
          "background": "#efe7d2",
          "border": "1px solid rgba(21, 20, 15, 0.16)",
          "borderRadius": "12px",
          "padding": "12px 14px",
          "fontFamily": "Inter",
          "fontSize": "14px",
          "color": "#15140f",
          "placeholderColor": "#8b8676",
          "focus": { "borderColor": "#ed6f5c", "boxShadow": "0 0 0 3px rgba(237,111,92,0.18)" }
        },
        "referenceChip": {
          "background": "#ece4cf",
          "border": "1px solid rgba(21, 20, 15, 0.16)",
          "borderRadius": "999px",
          "padding": "4px 10px 4px 4px",
          "fontSize": "12px",
          "color": "#2a2620"
        },
        "stylePreset": {
          "size": "auto / 1:1",
          "borderRadius": "12px",
          "border": "1px solid rgba(21, 20, 15, 0.16)",
          "background": "#efe7d2",
          "selected": { "border": "2px solid #ed6f5c", "boxShadow": "0 0 0 2px rgba(237,111,92,0.18)" }
        },
        "generateButton": {
          "width": "100%",
          "background": "#ed6f5c",
          "color": "#ffffff",
          "borderRadius": "999px",
          "padding": "12px",
          "fontSize": "14px",
          "fontWeight": 500,
          "boxShadow": "0 14px 26px -16px #ed6f5c",
          "hover": { "background": "#f08e7c" }
        }
      },
      "floatingPromptBar": {
        "_use": "Single prompt input floating over the canvas (Generate + variation count 1/2/4)",
        "background": "#f7f1de",
        "border": "1px solid rgba(21, 20, 15, 0.16)",
        "borderRadius": "999px",
        "padding": "8px 8px 8px 18px",
        "boxShadow": "0 30px 60px -30px rgba(21, 20, 15, 0.18)",
        "maxWidth": "640px",
        "input": { "fontFamily": "Inter", "fontSize": "14px", "color": "#15140f", "placeholderColor": "#8b8676", "background": "transparent" },
        "variationToggle": { "background": "#ece4cf", "borderRadius": "999px", "fontSize": "12px", "activeColor": "#ed6f5c" },
        "generate": { "background": "#ed6f5c", "color": "#ffffff", "borderRadius": "999px", "padding": "8px 16px", "fontSize": "13px", "fontWeight": 500 }
      },
      "objectToolbar": {
        "_use": "On-canvas toolbar over a selected object (opacity / effects / set-as-background / delete / overflow)",
        "height": "40px",
        "background": "#f7f1de",
        "border": "1px solid rgba(21, 20, 15, 0.16)",
        "borderRadius": "12px",
        "boxShadow": "0 12px 36px rgba(26, 26, 26, 0.08)",
        "padding": "4px",
        "iconButton": { "size": "32px", "borderRadius": "8px", "color": "#5a5448", "hover": { "background": "rgba(21,20,15,0.05)", "color": "#15140f" } },
        "danger": { "color": "#ed6f5c", "hover": { "background": "rgba(237,111,92,0.10)" } }
      },
      "layersTree": {
        "_use": "Nested object tree with visibility/lock toggles",
        "rowHeight": "32px",
        "rowPadding": "0 12px",
        "fontFamily": "Inter",
        "fontSize": "13px",
        "color": "#2a2620",
        "indent": "16px",
        "hover": { "background": "rgba(21, 20, 15, 0.05)" },
        "selected": { "background": "rgba(237, 111, 92, 0.10)", "color": "#15140f" },
        "toggleColor": "#8b8676",
        "toggleActiveColor": "#15140f"
      },
      "inspector": {
        "_use": "Right properties panel (frame / position / color / settings)",
        "width": "300px",
        "background": "#f7f1de",
        "borderLeft": "1px solid rgba(21, 20, 15, 0.16)",
        "padding": "16px",
        "sectionLabel": { "fontSize": "10px", "letterSpacing": "1px", "textTransform": "uppercase", "color": "#8b8676" },
        "numberField": {
          "background": "#efe7d2",
          "border": "1px solid rgba(21, 20, 15, 0.16)",
          "borderRadius": "8px",
          "padding": "6px 10px",
          "fontFamily": "JetBrains Mono",
          "fontSize": "12px",
          "color": "#15140f"
        },
        "toggle": { "trackOff": "rgba(21,20,15,0.16)", "trackOn": "#ed6f5c", "knob": "#f7f1de" }
      },
      "aiPromptModal": {
        "_use": "'Create anything…' entry modal (Create / Edit / Brainstorm), early-preview banner",
        "background": "#f7f1de",
        "borderRadius": "18px",
        "boxShadow": "0 30px 60px -30px rgba(21, 20, 15, 0.18), 0 0 0 1px rgba(21, 20, 15, 0.06) inset",
        "padding": "32px",
        "title": { "fontFamily": "Playfair Display", "fontSize": "32px", "color": "#15140f" },
        "input": { "background": "#efe7d2", "border": "1px solid rgba(21, 20, 15, 0.16)", "borderRadius": "12px", "padding": "14px 16px" },
        "featurePill": { "background": "#ece4cf", "borderRadius": "999px", "padding": "6px 14px", "fontSize": "13px", "color": "#2a2620" },
        "earlyPreviewBanner": { "background": "rgba(233, 185, 74, 0.18)", "color": "#6e7448", "borderRadius": "8px", "fontSize": "12px" }
      }
    }
  },
  "tailwind": {
    "_description": "Drop into tailwind.config.ts → theme.extend. Tailwind v4 users can mirror these into @theme directly. Shared theme across website + app; the app reuses the same colors/fonts and adds editor-shell spacing.",
    "theme": {
      "extend": {
        "colors": {
          "brand": {
            "coral": "#ed6f5c",
            "coralSoft": "#f08e7c"
          },
          "paper": {
            "DEFAULT": "#efe7d2",
            "warm": "#ece4cf",
            "dark": "#ddd2b6",
            "bone": "#f7f1de"
          },
          "ink": {
            "DEFAULT": "#15140f",
            "soft": "#2a2620",
            "mute": "#5a5448",
            "faint": "#8b8676"
          },
          "editorial": {
            "green": "#237f00",
            "mustard": "#e9b94a",
            "olive": "#6e7448"
          },
          "line": {
            "DEFAULT": "rgba(21, 20, 15, 0.16)",
            "soft": "rgba(21, 20, 15, 0.08)",
            "faint": "rgba(21, 20, 15, 0.05)"
          }
        },
        "fontFamily": {
          "serif": ["Playfair Display", "Times New Roman", "serif"],
          "sans": ["Inter Tight", "Inter", "ui-sans-serif", "system-ui", "sans-serif"],
          "body": ["Inter", "ui-sans-serif", "system-ui", "sans-serif"],
          "mono": ["JetBrains Mono", "SF Mono", "Menlo", "ui-monospace", "monospace"]
        },
        "fontSize": {
          "h1": ["72px", { "lineHeight": "72px", "letterSpacing": "-2.016px", "fontWeight": "800" }],
          "h2": ["77.76px", { "lineHeight": "77.76px", "letterSpacing": "-2.177px", "fontWeight": "800" }],
          "h3": ["22px", { "lineHeight": "23.1px", "letterSpacing": "-0.308px", "fontWeight": "700" }],
          "h4": ["18px", { "lineHeight": "27.9px", "letterSpacing": "-0.252px", "fontWeight": "700" }],
          "body": ["16px", { "lineHeight": "24.8px", "fontWeight": "400" }],
          "label": ["10px", { "lineHeight": "15.5px", "letterSpacing": "1px", "fontWeight": "400" }]
        },
        "spacing": {
          "panel-left": "280px",
          "panel-right": "300px",
          "topbar": "56px",
          "wrapper": "1200px"
        },
        "borderRadius": {
          "xs": "2px",
          "sm": "6px",
          "md": "8px",
          "lg": "12px",
          "xl": "14px",
          "2xl": "18px",
          "pill": "999px"
        },
        "boxShadow": {
          "soft": "0 30px 60px -30px rgba(21, 20, 15, 0.18)",
          "card": "0 12px 36px rgba(26, 26, 26, 0.08)",
          "coral": "0 14px 26px -16px #ed6f5c",
          "hairline": "0 0 0 1px rgba(21, 20, 15, 0.06) inset"
        },
        "screens": {
          "sm": "640px",
          "md": "768px",
          "lg": "1024px",
          "xl": "1280px",
          "2xl": "1440px"
        },
        "backgroundImage": {
          "canvasDots": "radial-gradient(rgba(21,20,15,0.10) 1px, transparent 1px)"
        }
      }
    },
    "componentRecipes": {
      "buttonPrimary": "inline-flex items-center justify-center rounded-pill bg-brand-coral text-white px-5 py-2.5 text-[14px] font-medium shadow-coral transition-colors hover:bg-brand-coralSoft active:translate-y-px",
      "buttonDark": "inline-flex items-center justify-center rounded-pill bg-ink text-paper px-5 py-2.5 text-[14px] font-medium transition-colors hover:bg-ink-soft",
      "buttonOutline": "inline-flex items-center justify-center rounded-pill bg-transparent text-ink border border-line px-4.5 py-2 text-[13px] transition-colors hover:bg-line-faint hover:border-line",
      "buttonGithubStar": "inline-flex items-center gap-2 rounded-pill bg-transparent text-ink border border-line px-4 py-2 text-[13px] font-medium",
      "categoryPill": "inline-flex items-center rounded-pill border border-line text-ink-soft text-[13px] px-4.5 py-2 transition-colors data-[active=true]:bg-brand-coral data-[active=true]:text-white data-[active=true]:border-brand-coral",
      "card": "rounded-2xl bg-paper-bone border border-line-soft p-7 text-ink shadow-card transition-all hover:-translate-y-0.5 hover:shadow-soft",
      "navLink": "font-sans text-[18px] font-bold text-ink transition-colors hover:text-brand-coral",
      "editorShell": "grid grid-cols-[280px_1fr_300px] grid-rows-[56px_1fr] h-screen bg-paper-dark",
      "topToolbar": "col-span-3 flex items-center gap-4 h-topbar bg-paper-warm border-b border-line px-4",
      "leftPanel": "bg-paper-bone border-r border-line overflow-y-auto p-4",
      "rightPanel": "bg-paper-bone border-l border-line overflow-y-auto p-4",
      "canvas": "relative overflow-hidden bg-paper-dark bg-canvasDots [background-size:20px_20px]",
      "promptTextarea": "w-full rounded-lg bg-paper border border-line px-3.5 py-3 font-body text-[14px] text-ink placeholder:text-ink-faint focus:border-brand-coral focus:outline-none focus:ring-2 focus:ring-brand-coral/30",
      "stylePreset": "aspect-square rounded-lg border border-line bg-paper data-[selected=true]:border-2 data-[selected=true]:border-brand-coral data-[selected=true]:ring-2 data-[selected=true]:ring-brand-coral/20",
      "generateButton": "w-full rounded-pill bg-brand-coral text-white py-3 text-[14px] font-medium shadow-coral transition-colors hover:bg-brand-coralSoft",
      "floatingPromptBar": "flex items-center gap-2 max-w-[640px] rounded-pill bg-paper-bone border border-line pl-4.5 pr-2 py-2 shadow-soft",
      "objectToolbar": "inline-flex items-center gap-1 rounded-lg bg-paper-bone border border-line p-1 shadow-card",
      "objectToolbarButton": "grid place-items-center w-8 h-8 rounded-md text-ink-mute transition-colors hover:bg-line-faint hover:text-ink",
      "layerRow": "flex items-center h-8 px-3 font-body text-[13px] text-ink-soft rounded-md transition-colors hover:bg-line-faint data-[selected=true]:bg-brand-coral/10 data-[selected=true]:text-ink",
      "inspectorLabel": "font-sans text-label uppercase tracking-[1px] text-ink-faint",
      "numberField": "rounded-md bg-paper border border-line px-2.5 py-1.5 font-mono text-[12px] text-ink"
    }
  }
}