{
  "$schema": "web-standards/design-system@2",
  "version": "1.0.0",
  "fictional": true,
  "brand": {
    "name": "Vườn Số",
    "shortName": "Vườn Số",
    "legalName": "Vườn Số (giả lập)",
    "tagline": "Đo đất mỗi sáng, tưới đúng từng luống",
    "description": "Nông nghiệp số cho hộ trồng rau và cây ăn quả: cảm biến độ ẩm cắm luống, app nhắc tưới đúng lúc đúng lượng, lớp canh tác thông minh tại vườn.",
    "url": "https://vuonso.demo.conan1.com",
    "locale": "vi_VN",
    "locales": [
      "vi_VN"
    ],
    "voice": [
      "chắc chắn",
      "gần gũi",
      "tiết kiệm",
      "kiên nhẫn"
    ],
    "social": {
      "facebook": "https://facebook.com/vuonso.demo",
      "youtube": "https://youtube.com/@vuonso.demo",
      "tiktok": "@vuonso.demo",
      "zalo": "Vườn Số OA"
    }
  },
  "logo": {
    "primary": "logo/primary.svg",
    "mark": "logo/mark.svg",
    "wordmark": "logo/wordmark.svg",
    "mono": "logo/mono.svg",
    "onDark": "logo/on-dark.svg",
    "clearSpace": "0.5 × chiều cao mark (32/64) — tương đương 8 ô pixel",
    "minSize": "mark 16px · logo đầy đủ 104px ngang",
    "construction": "Ô 'luống số' 64×64 dựng trên lưới 16×16 ô (4 đơn vị/ô), 4 góc khuyết 1 ô kiểu sprite 16-bit. Mầm hai lá bậc thang 45° màu Lá chuối, thân 2 ô; vạch đất và 3 luống bằng ô Giấy lúa; một ô Cà chua là que đo cảm biến. Wordmark Chakra Petch Bold đã chuyển thành path."
  },
  "favicon": {
    "svg": "favicon/favicon.svg",
    "themeColor": "#4A2C9B",
    "backgroundColor": "#FBF8EF",
    "ico": "favicon/favicon.ico",
    "appleTouch": "favicon/apple-touch-icon.png",
    "png192": "favicon/icon-192.png",
    "png512": "favicon/icon-512.png",
    "maskable512": "favicon/icon-maskable-512.png",
    "manifest": "favicon/site.webmanifest"
  },
  "og": {
    "defaultImage": "social/og-default.png",
    "imageAlt": "Vườn Số — Đo đất mỗi sáng, tưới đúng từng luống",
    "titleSuffix": " · Vườn Số",
    "type": "website"
  },
  "color": {
    "light": {
      "primary": "#4A2C9B",
      "onPrimary": "#FFFFFF",
      "secondary": "#E0452F",
      "onSecondary": "#1B1633",
      "bg": "#FBF8EF",
      "surface": "#FFFFFF",
      "fg": "#1B1633",
      "muted": "#4E4866",
      "border": "#DDD6EA",
      "success": "#2F6B1F",
      "warning": "#8A5A00",
      "danger": "#B42318",
      "info": "#1F5FA8",
      "focus": "#1F5FA8"
    },
    "dark": {
      "primary": "#B9A6F7",
      "onPrimary": "#15112A",
      "secondary": "#FF8A73",
      "onSecondary": "#15112A",
      "bg": "#15112A",
      "surface": "#211B3D",
      "fg": "#F6F3FB",
      "muted": "#B7B0CC",
      "border": "#352D57",
      "success": "#A6D930",
      "warning": "#F2C14E",
      "danger": "#F87171",
      "info": "#8CC4F5",
      "focus": "#8CC4F5"
    }
  },
  "brandColors": [
    {
      "name": "Giấy lúa",
      "hex": "#FBF8EF",
      "role": "Nền đọc",
      "use": [
        "nền trang",
        "nền thẻ in",
        "hộp thoại pixel"
      ],
      "never": [
        "chữ",
        "viền mảnh trên nền trắng"
      ],
      "share": 45
    },
    {
      "name": "Mực đêm",
      "hex": "#1B1633",
      "role": "Chữ và khung sprite",
      "use": [
        "chữ thân bài",
        "viền 1 ô của sprite",
        "thanh đầu trang tối"
      ],
      "never": [
        "nền lớn ở theme sáng"
      ],
      "share": 18
    },
    {
      "name": "Tím số",
      "hex": "#4A2C9B",
      "role": "Hành động chính",
      "use": [
        "nút chính",
        "ô logo",
        "bầu trời trong ảnh pixel"
      ],
      "never": [
        "chữ dài",
        "trang trí rải rác"
      ],
      "share": 12
    },
    {
      "name": "Lá chuối",
      "hex": "#A6D930",
      "role": "Mầm và trạng thái đạt",
      "use": [
        "lá mầm trong logo",
        "thanh tiến độ đã đạt",
        "đồi pixel"
      ],
      "never": [
        "chữ trên nền sáng",
        "nền chữ dài"
      ],
      "share": 8
    },
    {
      "name": "Nước trời",
      "hex": "#1F5FA8",
      "role": "Nước, thông tin và focus",
      "use": [
        "giọt nước, độ ẩm",
        "viền focus",
        "hộp thông tin"
      ],
      "never": [
        "nút chính"
      ],
      "share": 5
    },
    {
      "name": "Vạch luống",
      "hex": "#DDD6EA",
      "role": "Đường kẻ, viền",
      "use": [
        "viền thẻ",
        "đường chia",
        "lưới luống minh hoạ"
      ],
      "never": [
        "chữ"
      ],
      "share": 4
    },
    {
      "name": "Cà chua",
      "hex": "#E0452F",
      "role": "Điểm nhấn duy nhất mỗi màn",
      "use": [
        "que đo cảm biến trong logo",
        "cảnh báo cần tưới",
        "huy hiệu mới"
      ],
      "never": [
        "chữ trên nền sáng",
        "nhiều điểm trên một màn"
      ],
      "share": 3
    },
    {
      "name": "Đất luống",
      "hex": "#7B4B2A",
      "role": "Đất và gốc cây",
      "use": [
        "đất trong minh hoạ pixel",
        "thân giun Tơi"
      ],
      "never": [
        "chữ",
        "nút"
      ],
      "share": 2
    },
    {
      "name": "Nắng sớm",
      "hex": "#F2C14E",
      "role": "Mặt trời và thưởng",
      "use": [
        "nhân vật Nắng",
        "sao thưởng chuỗi ngày"
      ],
      "never": [
        "chữ trên nền sáng"
      ],
      "share": 2
    },
    {
      "name": "Hồng giun",
      "hex": "#FF8A73",
      "role": "Nhân vật Tơi và má hồng",
      "use": [
        "thân giun Tơi",
        "má hồng nhân vật"
      ],
      "never": [
        "chữ",
        "nút"
      ],
      "share": 1
    }
  ],
  "palettes": [
    {
      "id": "vuon-dem",
      "name": "Vườn đêm số",
      "note": "Bảng chính — tím số trên nền giấy lúa, lá chuối cho trạng thái đạt",
      "light": {
        "primary": "#4A2C9B",
        "onPrimary": "#FFFFFF",
        "secondary": "#E0452F",
        "bg": "#FBF8EF",
        "surface": "#FFFFFF",
        "fg": "#1B1633",
        "muted": "#4E4866",
        "border": "#DDD6EA"
      },
      "dark": {
        "primary": "#B9A6F7",
        "onPrimary": "#15112A",
        "secondary": "#FF8A73",
        "bg": "#15112A",
        "surface": "#211B3D",
        "fg": "#F6F3FB",
        "muted": "#B7B0CC",
        "border": "#352D57"
      }
    },
    {
      "id": "nuoc-troi",
      "name": "Nước trời",
      "note": "Xanh nước làm chủ đạo cho trang cảm biến và nhắc tưới",
      "light": {
        "primary": "#1F5FA8",
        "onPrimary": "#FFFFFF",
        "secondary": "#E0452F",
        "bg": "#F3F7FB",
        "surface": "#FFFFFF",
        "fg": "#14213A",
        "muted": "#45536B",
        "border": "#D3DEEA"
      },
      "dark": {
        "primary": "#8CC4F5",
        "onPrimary": "#0E1726",
        "secondary": "#FF8A73",
        "bg": "#0E1726",
        "surface": "#172338",
        "fg": "#F2F6FB",
        "muted": "#A9B8CC",
        "border": "#26364F"
      }
    },
    {
      "id": "dat-nang",
      "name": "Đất nắng",
      "note": "Ấm, dùng cho trang lớp canh tác tại vườn",
      "light": {
        "primary": "#7B4B2A",
        "onPrimary": "#FFFFFF",
        "secondary": "#4A2C9B",
        "bg": "#FBF6EC",
        "surface": "#FFFFFF",
        "fg": "#241709",
        "muted": "#5C4A3A",
        "border": "#E7DAC6"
      },
      "dark": {
        "primary": "#F2C14E",
        "onPrimary": "#241709",
        "secondary": "#B9A6F7",
        "bg": "#1C130A",
        "surface": "#2A1D11",
        "fg": "#FBF6EC",
        "muted": "#C7B49E",
        "border": "#40301F"
      }
    }
  ],
  "typography": {
    "families": {
      "display": "Chakra Petch, system-ui, sans-serif",
      "sans": "Be Vietnam Pro, system-ui, sans-serif",
      "mono": "VT323, ui-monospace, monospace"
    },
    "supportsVietnamese": true,
    "roles": [
      {
        "role": "tiêu đề",
        "family": "Chakra Petch",
        "weights": [
          600,
          700
        ],
        "vietnamese": true,
        "sample": "Luống cải đã đủ ẩm — sáng mai Vườn Số nhắc tưới đúng giờ"
      },
      {
        "role": "thân bài",
        "family": "Be Vietnam Pro",
        "weights": [
          400,
          600
        ],
        "vietnamese": true,
        "sample": "Cắm que đo sâu 15 cm cạnh gốc, chờ 30 phút để có số đo đầu tiên. Đừng lo nếu đất vườn bưởi khô nhanh hơn luống rau — mỗi luống có ngưỡng riêng, Vườn Số tự học theo từng chỗ."
      },
      {
        "role": "số/mã (mono)",
        "family": "VT323",
        "weights": [
          400
        ],
        "vietnamese": true,
        "sample": "Luống 03 · ẩm 62% · Đã tưới 12 phút · Mã VS-2510"
      }
    ],
    "effects": [
      {
        "id": "pixel-type",
        "name": "Gõ chữ pixel",
        "durationMs": 720,
        "reducedMotion": "off",
        "use": "Tiêu đề hero hiện từng ký tự như hộp thoại game 16-bit"
      },
      {
        "id": "meter-fill",
        "name": "Đầy vạch ẩm",
        "durationMs": 480,
        "reducedMotion": "off",
        "use": "Số độ ẩm và thanh vạch nhảy lên theo từng ô"
      }
    ],
    "scale": {
      "xs": "12px",
      "sm": "14px",
      "base": "16px",
      "lg": "18px",
      "xl": "20px",
      "2xl": "24px",
      "3xl": "30px",
      "4xl": "38px",
      "5xl": "52px"
    },
    "lineHeight": {
      "tight": 1.15,
      "normal": 1.55,
      "relaxed": 1.7
    },
    "weights": [
      400,
      600,
      800
    ]
  },
  "typeEffects": [
    {
      "id": "pixel-type",
      "durationMs": 720,
      "reducedMotion": "off"
    },
    {
      "id": "meter-fill",
      "durationMs": 480,
      "reducedMotion": "off"
    }
  ],
  "space": {
    "0": "0",
    "1": "4px",
    "2": "8px",
    "3": "12px",
    "4": "16px",
    "6": "24px",
    "8": "32px",
    "12": "48px",
    "16": "64px"
  },
  "radius": {
    "sm": "2px",
    "md": "4px",
    "lg": "6px",
    "xl": "8px",
    "full": "9999px",
    "pixel": "0"
  },
  "shadow": {
    "sm": "2px 2px 0 rgb(27 22 51 / .18)",
    "md": "4px 4px 0 rgb(27 22 51 / .18)",
    "lg": "6px 6px 0 rgb(27 22 51 / .22)"
  },
  "breakpoints": {
    "sm": "640px",
    "md": "768px",
    "lg": "1024px",
    "xl": "1280px"
  },
  "motion": {
    "durations": {
      "fast": 120,
      "base": 200,
      "slow": 360
    },
    "easing": {
      "standard": "cubic-bezier(.2,.8,.2,1)",
      "step": "steps(4, end)"
    },
    "respectsReducedMotion": true,
    "pauseOffscreen": true
  },
  "icons": {
    "path": "icons/",
    "sprite": "icons/sprite.svg",
    "grid": 24,
    "stroke": 2,
    "linecap": "round",
    "linejoin": "round",
    "states": [
      "rest",
      "active",
      "animated"
    ],
    "construction": "pixel-grid-2px",
    "constructionRules": "Nét 2 px trên lưới ô 2 px (toạ độ nét ở số lẻ để nét phủ đúng ô); chỉ đường ngang, dọc và chéo 45°; không cung tròn — đường tròn thành bát giác vát 1 ô; đầu nét và khớp bo 1 px theo chuẩn icon-build (ở cỡ 24 vẫn đọc như ô vuông); vùng tô (lớp f) là khối ô đặc; tối đa 1 motif vườn mỗi icon; khoảng hở ≥ 2 px (1 ô).",
    "set": "vuon-so (kit/icons)"
  },
  "mascots": [
    {
      "id": "mam",
      "name": "Mầm",
      "role": "mascot chính — mầm cây dẫn đường"
    },
    {
      "id": "phun",
      "name": "Phun",
      "role": "drone tưới — nhắc tưới đúng giờ"
    },
    {
      "id": "toi",
      "name": "Tơi",
      "role": "giun đất — đọc số đo đất"
    },
    {
      "id": "nang",
      "name": "Nắng",
      "role": "mặt trời — ăn mừng và chuỗi ngày"
    }
  ],
  "components": {
    "minTouchPx": 44,
    "button": {
      "interactive": true,
      "levels": [
        "primary",
        "secondary",
        "ghost",
        "danger"
      ],
      "sizes": [
        "sm",
        "md",
        "lg"
      ],
      "states": [
        "default",
        "hover",
        "focusVisible",
        "active",
        "disabled",
        "loading",
        "done"
      ],
      "emphasisMaxPerPage": 1,
      "radius": "pixel"
    },
    "chip": {
      "interactive": true,
      "states": [
        "default",
        "hover",
        "focusVisible",
        "active",
        "disabled"
      ],
      "use": "lọc luống, loại cây, khung giờ tưới"
    },
    "callout": {
      "types": [
        "info",
        "success",
        "warning",
        "danger",
        "tip"
      ],
      "character": true,
      "characterNote": "Hộp lời nhân vật: Mầm cho mẹo canh tác, Phun cho nhắc tưới, Tơi cho số đo đất"
    },
    "toast": {
      "interactive": true,
      "states": [
        "default",
        "hover",
        "focusVisible",
        "active",
        "disabled"
      ],
      "timerMs": 5000,
      "pauseOnHover": true
    },
    "dialog": {
      "interactive": true,
      "states": [
        "default",
        "hover",
        "focusVisible",
        "active",
        "disabled"
      ],
      "escCloses": true,
      "returnsFocus": true
    },
    "input": {
      "interactive": true,
      "states": [
        "default",
        "hover",
        "focusVisible",
        "active",
        "disabled"
      ],
      "label": "Số điện thoại",
      "help": "Vườn Số nhắn lịch tưới mỗi sáng qua số này",
      "error": "Số chưa đủ 10 chữ số — ví dụ: 0912 345 678"
    },
    "progress": {
      "variants": [
        "bar",
        "steps",
        "ring"
      ],
      "example": "Buổi 3/6 của lớp Tự đo"
    },
    "verdict": {
      "variants": [
        "đủ ẩm",
        "cần tưới",
        "dư nước"
      ],
      "stamp": true
    },
    "streak": {
      "unit": "ngày tưới theo số đo",
      "example": "6 ngày liền tưới đúng giờ"
    },
    "roadmap": {
      "steps": [
        "Làm quen",
        "Tự đo",
        "Tự động"
      ]
    }
  },
  "imagery": {
    "illustrationStyle": "pixel-16bit",
    "photoStyle": "không dùng ảnh chụp trong demo",
    "mascot3d": "lowpoly"
  },
  "themes": [
    "luong-so"
  ],
  "approvedAt": "2026-10-25",
  "approvedBy": "auto-approved (fictional demo brand, approved by Dac Nguyen in chat)",
  "sources": {
    "tokens": "themes/luong-so/tokens.css",
    "docs": "guideline/index.html"
  }
}