{
  "$schema": "https://www.designtokens.org/schemas/2025.10/format.json",
  "$description": "Aoyue Design identity 2026 — Monochrome Precision. Source of truth for colour, type, space, shape and motion. Generate CSS with `node scripts/build-tokens.mjs`.",
  "brand": {
    "$description": "Identity constants. The symbol and wordmark geometry are fixed; only colour and size change.",
    "symbol": {
      "diagonal": {
        "$type": "number",
        "$value": 58,
        "$description": "Degrees. Every diagonal in the A/D monogram and every brand wipe uses this angle."
      },
      "rotation": {
        "$type": "number",
        "$value": 180,
        "$description": "Degrees. The A and the D are the same form turned half a revolution."
      },
      "aperture-gap": {
        "$type": "number",
        "$value": 44,
        "$description": "Degrees of each opening in the ring."
      },
      "clearspace": {
        "$type": "number",
        "$value": 0.25,
        "$description": "Minimum clear space as a ratio of the ring diameter."
      },
      "min-size": {
        "$type": "dimension",
        "$value": {
          "value": 48,
          "unit": "px"
        }
      },
      "micro-range": {
        "$type": "string",
        "$value": "16–47px uses the micro symbol"
      }
    },
    "wordmark": {
      "min-size": {
        "$type": "dimension",
        "$value": {
          "value": 144,
          "unit": "px"
        }
      }
    }
  },
  "color": {
    "$type": "color",
    "$description": "A hue-free grey scale. Primitives are never used directly in components.",
    "gray": {
      "0": {
        "$value": "#FFFFFF",
        "$description": "White"
      },
      "25": {
        "$value": "#FAFAFA",
        "$description": "Paper 紙白"
      },
      "50": {
        "$value": "#F4F4F4"
      },
      "100": {
        "$value": "#EDEDED",
        "$description": "Mist 霧"
      },
      "150": {
        "$value": "#E4E4E4"
      },
      "200": {
        "$value": "#D6D6D6"
      },
      "300": {
        "$value": "#BDBDBD"
      },
      "400": {
        "$value": "#A1A1A1",
        "$description": "Ash 灰"
      },
      "500": {
        "$value": "#858585"
      },
      "600": {
        "$value": "#6B6B6B",
        "$description": "Steel 鋼"
      },
      "700": {
        "$value": "#525252"
      },
      "800": {
        "$value": "#2B2B2B",
        "$description": "Graphite 石墨"
      },
      "850": {
        "$value": "#1F1F1F"
      },
      "900": {
        "$value": "#161616"
      },
      "950": {
        "$value": "#0E0E0E"
      },
      "1000": {
        "$value": "#0A0A0A",
        "$description": "Ink 墨"
      }
    }
  },
  "theme": {
    "$description": "Semantic colour roles. Light and dark are the same system rotated 180°.",
    "light": {
      "$type": "color",
      "bg": {
        "$value": "{color.gray.25}",
        "$description": "Page canvas"
      },
      "bg-subtle": {
        "$value": "{color.gray.50}"
      },
      "surface": {
        "$value": "{color.gray.100}",
        "$description": "Image mats, tiles"
      },
      "surface-raised": {
        "$value": "{color.gray.0}"
      },
      "fg": {
        "$value": "{color.gray.1000}",
        "$description": "Headings and primary text"
      },
      "fg-body": {
        "$value": "{color.gray.800}"
      },
      "fg-muted": {
        "$value": "{color.gray.700}",
        "$description": "7.5:1 on bg"
      },
      "fg-subtle": {
        "$value": "{color.gray.600}",
        "$description": "5.1:1 on bg, 4.5:1 on surface"
      },
      "line": {
        "$value": "{color.gray.150}"
      },
      "line-strong": {
        "$value": "{color.gray.300}"
      },
      "line-contrast": {
        "$value": "{color.gray.1000}"
      },
      "inverse-bg": {
        "$value": "{color.gray.1000}"
      },
      "inverse-fg": {
        "$value": "{color.gray.25}"
      },
      "inverse-muted": {
        "$value": "{color.gray.400}"
      },
      "inverse-line": {
        "$value": "{color.gray.800}"
      },
      "inverse-surface": {
        "$value": "{color.gray.900}"
      },
      "focus": {
        "$value": "{color.gray.1000}"
      },
      "overlay": {
        "$value": "rgb(10 10 10 / 0.96)"
      },
      "nav": {
        "$value": "rgb(250 250 250 / 0.82)"
      }
    },
    "dark": {
      "$type": "color",
      "bg": {
        "$value": "{color.gray.1000}"
      },
      "bg-subtle": {
        "$value": "{color.gray.950}"
      },
      "surface": {
        "$value": "{color.gray.900}"
      },
      "surface-raised": {
        "$value": "{color.gray.850}"
      },
      "fg": {
        "$value": "{color.gray.25}"
      },
      "fg-body": {
        "$value": "{color.gray.150}"
      },
      "fg-muted": {
        "$value": "{color.gray.400}"
      },
      "fg-subtle": {
        "$value": "{color.gray.500}"
      },
      "line": {
        "$value": "{color.gray.850}"
      },
      "line-strong": {
        "$value": "{color.gray.700}"
      },
      "line-contrast": {
        "$value": "{color.gray.25}"
      },
      "inverse-bg": {
        "$value": "{color.gray.50}"
      },
      "inverse-fg": {
        "$value": "{color.gray.1000}"
      },
      "inverse-muted": {
        "$value": "{color.gray.700}"
      },
      "inverse-line": {
        "$value": "{color.gray.200}"
      },
      "inverse-surface": {
        "$value": "{color.gray.100}"
      },
      "focus": {
        "$value": "{color.gray.25}"
      },
      "overlay": {
        "$value": "rgb(10 10 10 / 0.97)"
      },
      "nav": {
        "$value": "rgb(10 10 10 / 0.78)"
      }
    }
  },
  "font": {
    "family": {
      "$type": "fontFamily",
      "sans": {
        "$value": [
          "var(--font-geist)",
          "Aoyue Site TC",
          "system-ui",
          "sans-serif"
        ]
      },
      "sans-sc": {
        "$value": [
          "var(--font-geist)",
          "Aoyue Site SC",
          "Aoyue Site TC",
          "system-ui",
          "sans-serif"
        ]
      },
      "sans-jp": {
        "$value": [
          "var(--font-geist)",
          "Aoyue Site JP",
          "Aoyue Site TC",
          "system-ui",
          "sans-serif"
        ]
      },
      "sans-kr": {
        "$value": [
          "var(--font-geist)",
          "Aoyue Site KR",
          "Aoyue Site TC",
          "system-ui",
          "sans-serif"
        ]
      },
      "mono": {
        "$value": [
          "var(--font-geist-mono)",
          "ui-monospace",
          "SFMono-Regular",
          "monospace"
        ]
      }
    },
    "weight": {
      "$type": "fontWeight",
      "regular": {
        "$value": 400
      },
      "medium": {
        "$value": 500
      },
      "semibold": {
        "$value": 600
      }
    },
    "size": {
      "$type": "dimension",
      "$description": "Fluid between 375px and 1440px viewports.",
      "2xs": {
        "$value": {
          "value": 11,
          "unit": "px"
        }
      },
      "xs": {
        "$value": {
          "value": 12,
          "unit": "px"
        }
      },
      "sm": {
        "$value": {
          "value": 14,
          "unit": "px"
        }
      },
      "base": {
        "$value": {
          "value": 16,
          "unit": "px"
        },
        "$extensions": {
          "design.aoyue.fluid": {
            "max": 17
          }
        }
      },
      "md": {
        "$value": {
          "value": 18,
          "unit": "px"
        },
        "$extensions": {
          "design.aoyue.fluid": {
            "max": 20
          }
        }
      },
      "lg": {
        "$value": {
          "value": 20,
          "unit": "px"
        },
        "$extensions": {
          "design.aoyue.fluid": {
            "max": 26
          }
        }
      },
      "xl": {
        "$value": {
          "value": 24,
          "unit": "px"
        },
        "$extensions": {
          "design.aoyue.fluid": {
            "max": 36
          }
        }
      },
      "2xl": {
        "$value": {
          "value": 30,
          "unit": "px"
        },
        "$extensions": {
          "design.aoyue.fluid": {
            "max": 52
          }
        }
      },
      "3xl": {
        "$value": {
          "value": 36,
          "unit": "px"
        },
        "$extensions": {
          "design.aoyue.fluid": {
            "max": 76
          }
        }
      },
      "display": {
        "$value": {
          "value": 46,
          "unit": "px"
        },
        "$extensions": {
          "design.aoyue.fluid": {
            "max": 116
          }
        }
      }
    },
    "leading": {
      "$type": "number",
      "none": {
        "$value": 1
      },
      "tight": {
        "$value": 1.12
      },
      "snug": {
        "$value": 1.3
      },
      "normal": {
        "$value": 1.6
      },
      "relaxed": {
        "$value": 1.85
      }
    },
    "tracking": {
      "$type": "dimension",
      "display": {
        "$value": {
          "value": -0.035,
          "unit": "em"
        }
      },
      "heading": {
        "$value": {
          "value": -0.02,
          "unit": "em"
        }
      },
      "body": {
        "$value": {
          "value": 0,
          "unit": "em"
        }
      },
      "label": {
        "$value": {
          "value": 0.08,
          "unit": "em"
        }
      }
    }
  },
  "space": {
    "$type": "dimension",
    "$description": "4px base unit.",
    "0": {
      "$value": {
        "value": 0,
        "unit": "px"
      }
    },
    "1": {
      "$value": {
        "value": 4,
        "unit": "px"
      }
    },
    "2": {
      "$value": {
        "value": 8,
        "unit": "px"
      }
    },
    "3": {
      "$value": {
        "value": 12,
        "unit": "px"
      }
    },
    "4": {
      "$value": {
        "value": 16,
        "unit": "px"
      }
    },
    "5": {
      "$value": {
        "value": 20,
        "unit": "px"
      }
    },
    "6": {
      "$value": {
        "value": 24,
        "unit": "px"
      }
    },
    "8": {
      "$value": {
        "value": 32,
        "unit": "px"
      }
    },
    "10": {
      "$value": {
        "value": 40,
        "unit": "px"
      }
    },
    "12": {
      "$value": {
        "value": 48,
        "unit": "px"
      }
    },
    "16": {
      "$value": {
        "value": 64,
        "unit": "px"
      }
    },
    "20": {
      "$value": {
        "value": 80,
        "unit": "px"
      }
    },
    "24": {
      "$value": {
        "value": 96,
        "unit": "px"
      }
    },
    "32": {
      "$value": {
        "value": 128,
        "unit": "px"
      }
    },
    "40": {
      "$value": {
        "value": 160,
        "unit": "px"
      }
    }
  },
  "layout": {
    "$type": "dimension",
    "max-width": {
      "$value": {
        "value": 1440,
        "unit": "px"
      }
    },
    "reading-width": {
      "$value": {
        "value": 680,
        "unit": "px"
      }
    },
    "columns": {
      "$type": "number",
      "$value": 12
    },
    "margin": {
      "$value": {
        "value": 20,
        "unit": "px"
      },
      "$extensions": {
        "design.aoyue.fluid": {
          "max": 56
        }
      }
    },
    "gutter": {
      "$value": {
        "value": 16,
        "unit": "px"
      },
      "$extensions": {
        "design.aoyue.fluid": {
          "max": 24
        }
      }
    },
    "section": {
      "$value": {
        "value": 88,
        "unit": "px"
      },
      "$extensions": {
        "design.aoyue.fluid": {
          "max": 176
        }
      }
    },
    "nav-height": {
      "$value": {
        "value": 64,
        "unit": "px"
      },
      "$extensions": {
        "design.aoyue.fluid": {
          "max": 76
        }
      }
    },
    "hit-target": {
      "$value": {
        "value": 44,
        "unit": "px"
      }
    }
  },
  "radius": {
    "$type": "dimension",
    "$description": "No rounded corners. Structure and controls are square; the only round form in the system is the aperture ring of the symbol.",
    "none": {
      "$value": {
        "value": 0,
        "unit": "px"
      }
    }
  },
  "border": {
    "$type": "dimension",
    "hairline": {
      "$value": {
        "value": 1,
        "unit": "px"
      }
    },
    "focus": {
      "$value": {
        "value": 2,
        "unit": "px"
      }
    }
  },
  "motion": {
    "duration": {
      "$type": "duration",
      "instant": {
        "$value": {
          "value": 100,
          "unit": "ms"
        }
      },
      "fast": {
        "$value": {
          "value": 200,
          "unit": "ms"
        }
      },
      "base": {
        "$value": {
          "value": 360,
          "unit": "ms"
        }
      },
      "slow": {
        "$value": {
          "value": 640,
          "unit": "ms"
        }
      },
      "slower": {
        "$value": {
          "value": 1000,
          "unit": "ms"
        }
      }
    },
    "easing": {
      "$type": "cubicBezier",
      "focus": {
        "$value": [
          0.16,
          1,
          0.3,
          1
        ],
        "$description": "Lens finding focus — fast start, long settle. Default for entrances."
      },
      "standard": {
        "$value": [
          0.2,
          0,
          0,
          1
        ]
      },
      "inout": {
        "$value": [
          0.65,
          0,
          0.35,
          1
        ],
        "$description": "Wipes and inversions."
      },
      "exit": {
        "$value": [
          0.4,
          0,
          1,
          1
        ]
      }
    },
    "focus-blur": {
      "$type": "dimension",
      "$value": {
        "value": 6,
        "unit": "px"
      },
      "$description": "Starting blur of the focus-pull entrance."
    },
    "focus-distance": {
      "$type": "dimension",
      "$value": {
        "value": 16,
        "unit": "px"
      }
    }
  },
  "z": {
    "$type": "number",
    "base": {
      "$value": 0
    },
    "raised": {
      "$value": 10
    },
    "nav": {
      "$value": 50
    },
    "cursor": {
      "$value": 80
    },
    "dialog": {
      "$value": 100
    }
  },
  "texture": {
    "$description": "Graphic textures carried over from the previous site and aligned to the identity: hatching runs on the 58° axis; dotted rules separate items while solid hairlines separate sections; the dot grid is the drawing surface for the mark and for image mats. Colours mix the local foreground, so textures invert inside inverse bands.",
    "hatch-gap": {
      "$type": "dimension",
      "$value": {
        "value": 7,
        "unit": "px"
      },
      "$description": "Distance between hatch lines."
    },
    "hatch-weight": {
      "$type": "dimension",
      "$value": {
        "value": 1,
        "unit": "px"
      }
    },
    "hatch-strength": {
      "$type": "number",
      "$value": 16,
      "$description": "Percent of the foreground colour."
    },
    "dot-gap": {
      "$type": "dimension",
      "$value": {
        "value": 12,
        "unit": "px"
      }
    },
    "dot-size": {
      "$type": "dimension",
      "$value": {
        "value": 1,
        "unit": "px"
      }
    },
    "dot-strength": {
      "$type": "number",
      "$value": 30,
      "$description": "Percent of the foreground colour."
    },
    "rule-minor": {
      "$type": "strokeStyle",
      "$value": "dotted",
      "$description": "Dividers between items: cards, table rows, list entries."
    },
    "rule-major": {
      "$type": "strokeStyle",
      "$value": "solid",
      "$description": "Dividers between sections."
    }
  }
}