{
  "$schema": "web-standards/design-system@2",
  "version": "1.0.0",
  "fictional": true,
  "brand": {
    "name": "Gió Vợt",
    "shortName": "Gió Vợt",
    "legalName": "Gió Vợt (giả lập)",
    "tagline": "Hai buổi mỗi tuần, tiến lên từng cú",
    "description": "Câu lạc bộ cầu lông cho người đi làm và học sinh: sân cố định, lớp kỹ thuật nhóm nhỏ, giải phong trào chia bảng theo trình độ.",
    "url": "https://giovot.demo.conan1.com",
    "locale": "vi_VN",
    "locales": [
      "vi_VN"
    ],
    "voice": [
      "nhanh nhẹn",
      "công bằng",
      "khích lệ",
      "vui vẻ"
    ],
    "social": {
      "facebook": "https://facebook.com/giovot.demo",
      "youtube": "https://youtube.com/@giovot.demo",
      "tiktok": "@giovot.demo",
      "zalo": "Gió Vợt 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)",
    "minSize": "mark 16px · logo đầy đủ 96px ngang",
    "construction": "Ô 'cơn gió' 64×64: bo 14 ở góc trên trái và dưới phải, hai góc còn lại vuông. Quả cầu 3 lông + đế cầu xoay 40° bay xuống trái; 2 vệt gió nét 4.5/64 phía sau. Wordmark Lexend ExtraBold đã chuyển thành path."
  },
  "favicon": {
    "svg": "favicon/favicon.svg",
    "themeColor": "#0B6E4F",
    "backgroundColor": "#FAFAF5",
    "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": "Gió Vợt — Hai buổi mỗi tuần, tiến lên từng cú",
    "titleSuffix": " · Gió Vợt",
    "type": "website"
  },
  "color": {
    "light": {
      "primary": "#0B6E4F",
      "onPrimary": "#FFFFFF",
      "secondary": "#F2542D",
      "onSecondary": "#0F1E2E",
      "bg": "#FAFAF5",
      "surface": "#FFFFFF",
      "fg": "#0F1E2E",
      "muted": "#475A55",
      "border": "#D5DED6",
      "success": "#0B6E4F",
      "warning": "#8A5A00",
      "danger": "#B42318",
      "info": "#0A5C8A",
      "focus": "#0A5C8A"
    },
    "dark": {
      "primary": "#4FD1A1",
      "onPrimary": "#0C1620",
      "secondary": "#FF8A66",
      "onSecondary": "#0C1620",
      "bg": "#0C1620",
      "surface": "#142231",
      "fg": "#F4F6EE",
      "muted": "#A7B6AE",
      "border": "#26384A",
      "success": "#4FD1A1",
      "warning": "#F2C14E",
      "danger": "#F87171",
      "info": "#7CC4F0",
      "focus": "#7CC4F0"
    }
  },
  "brandColors": [
    {
      "name": "Mực sân",
      "hex": "#0F1E2E",
      "role": "Chữ và ô logo",
      "use": [
        "chữ thân bài",
        "ô logo",
        "thanh đầu trang tối"
      ],
      "never": [
        "nền lớn ở theme sáng"
      ],
      "share": 18
    },
    {
      "name": "Xanh thảm sân",
      "hex": "#0B6E4F",
      "role": "Hành động chính",
      "use": [
        "nút chính",
        "trạng thái đã đặt sân",
        "liên kết quan trọng"
      ],
      "never": [
        "chữ dài",
        "nền toàn trang"
      ],
      "share": 12
    },
    {
      "name": "Xanh gió",
      "hex": "#0A5C8A",
      "role": "Thông tin và focus",
      "use": [
        "viền focus",
        "liên kết",
        "hộp thông tin"
      ],
      "never": [
        "nút chính"
      ],
      "share": 6
    },
    {
      "name": "Lông cầu",
      "hex": "#FAFAF5",
      "role": "Nền đọc",
      "use": [
        "nền trang",
        "nền thẻ in"
      ],
      "never": [
        "chữ trên nền trắng"
      ],
      "share": 52
    },
    {
      "name": "Vạch sân",
      "hex": "#D5DED6",
      "role": "Đường kẻ, viền",
      "use": [
        "viền thẻ",
        "đường chia",
        "vạch sân minh hoạ"
      ],
      "never": [
        "chữ"
      ],
      "share": 7
    },
    {
      "name": "Đế cầu",
      "hex": "#F2542D",
      "role": "Điểm nhấn duy nhất mỗi màn",
      "use": [
        "đế quả cầu trong logo",
        "huy hiệu mới",
        "một điểm nhấn mỗi màn"
      ],
      "never": [
        "chữ trên nền sáng",
        "trang trí rải rác"
      ],
      "share": 5
    }
  ],
  "palettes": [
    {
      "id": "san-dem",
      "name": "Sân đêm",
      "note": "Bảng chính — xanh thảm sân trên nền lông cầu",
      "light": {
        "primary": "#0B6E4F",
        "onPrimary": "#FFFFFF",
        "secondary": "#F2542D",
        "bg": "#FAFAF5",
        "surface": "#FFFFFF",
        "fg": "#0F1E2E",
        "muted": "#475A55",
        "border": "#D5DED6"
      },
      "dark": {
        "primary": "#4FD1A1",
        "onPrimary": "#0C1620",
        "secondary": "#FF8A66",
        "bg": "#0C1620",
        "surface": "#142231",
        "fg": "#F4F6EE",
        "muted": "#A7B6AE",
        "border": "#26384A"
      }
    },
    {
      "id": "gio-xanh",
      "name": "Gió xanh",
      "note": "Xanh gió làm chủ đạo cho trang lớp học",
      "light": {
        "primary": "#0A5C8A",
        "onPrimary": "#FFFFFF",
        "secondary": "#F2542D",
        "bg": "#F3F7F9",
        "surface": "#FFFFFF",
        "fg": "#0F1E2E",
        "muted": "#475A66",
        "border": "#D3DEE5"
      },
      "dark": {
        "primary": "#7CC4F0",
        "onPrimary": "#0C1620",
        "secondary": "#FF8A66",
        "bg": "#0A1724",
        "surface": "#132536",
        "fg": "#F2F6F8",
        "muted": "#A5B7C4",
        "border": "#24394D"
      }
    },
    {
      "id": "de-cau",
      "name": "Đế cầu",
      "note": "Ấm, dùng cho trang giải phong trào",
      "light": {
        "primary": "#B33A12",
        "onPrimary": "#FFFFFF",
        "secondary": "#0B6E4F",
        "bg": "#FBF7F2",
        "surface": "#FFFFFF",
        "fg": "#1F1610",
        "muted": "#5E5047",
        "border": "#E6DAD0"
      },
      "dark": {
        "primary": "#FF8A66",
        "onPrimary": "#1F1610",
        "secondary": "#4FD1A1",
        "bg": "#1A120D",
        "surface": "#261B14",
        "fg": "#FBF7F2",
        "muted": "#C2B2A6",
        "border": "#3D2E24"
      }
    }
  ],
  "typography": {
    "families": {
      "display": "Lexend, system-ui, sans-serif",
      "sans": "Be Vietnam Pro, system-ui, sans-serif",
      "mono": "JetBrains Mono, ui-monospace, monospace"
    },
    "supportsVietnamese": true,
    "roles": [
      {
        "role": "tiêu đề",
        "family": "Lexend",
        "weights": [
          600,
          800
        ],
        "vietnamese": true,
        "sample": "Đập cầu dứt khoát, giữ vững nhịp chân — lớp tối thứ Ba còn 2 chỗ"
      },
      {
        "role": "thân bài",
        "family": "Be Vietnam Pro",
        "weights": [
          400,
          600
        ],
        "vietnamese": true,
        "sample": "Mỗi buổi khởi động 10 phút, rồi tập lốp cầu cuối sân. Huấn luyện viên ghi sổ tiến bộ để bạn biết cú nào đã vững, cú nào cần sửa."
      },
      {
        "role": "số/mã (mono)",
        "family": "JetBrains Mono",
        "weights": [
          500
        ],
        "vietnamese": true,
        "sample": "Sân 03 · 19:30–21:00 · Đã giữ chỗ · Mã GV-2810"
      }
    ],
    "effects": [
      {
        "id": "smash-in",
        "name": "Cú đập",
        "durationMs": 520,
        "reducedMotion": "off",
        "use": "Tiêu đề hero trượt chéo vào như đường cầu"
      },
      {
        "id": "score-tick",
        "name": "Nhảy điểm",
        "durationMs": 400,
        "reducedMotion": "off",
        "use": "Số điểm, số buổi đếm lên"
      }
    ],
    "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": "smash-in",
      "durationMs": 520,
      "reducedMotion": "off"
    },
    {
      "id": "score-tick",
      "durationMs": 400,
      "reducedMotion": "off"
    }
  ],
  "space": {
    "0": "0",
    "1": "4px",
    "2": "8px",
    "3": "12px",
    "4": "16px",
    "6": "24px",
    "8": "32px",
    "12": "48px",
    "16": "64px"
  },
  "radius": {
    "sm": "4px",
    "md": "8px",
    "lg": "14px",
    "xl": "22px",
    "full": "9999px",
    "gust": "14px 0 14px 0"
  },
  "shadow": {
    "sm": "0 1px 2px rgb(15 30 46 / .08)",
    "md": "0 6px 16px rgb(15 30 46 / .10)",
    "lg": "0 14px 36px rgb(15 30 46 / .14)"
  },
  "breakpoints": {
    "sm": "640px",
    "md": "768px",
    "lg": "1024px",
    "xl": "1280px"
  },
  "motion": {
    "durations": {
      "fast": 140,
      "base": 220,
      "slow": 360
    },
    "easing": {
      "standard": "cubic-bezier(.2,.8,.2,1)",
      "smash": "cubic-bezier(.7,0,.2,1)"
    },
    "respectsReducedMotion": true,
    "pauseOffscreen": true
  },
  "icons": {
    "path": "icons/",
    "sprite": "icons/sprite.svg",
    "grid": 24,
    "stroke": 2,
    "linecap": "round",
    "states": [
      "rest",
      "active",
      "animated"
    ],
    "construction": "bold-geometric-sport",
    "constructionRules": "Nét 2 px đậm, chỉ đường thẳng và cung tròn; góc chéo 45° gợi đường cầu; vùng tô (lớp f) là một khối hình học lớn; tối đa 1 motif cầu lông mỗi icon; khoảng hở ≥ 1.5 px.",
    "set": "gio-vot (kit/icons)"
  },
  "mascots": [
    {
      "id": "lua",
      "name": "Lửa",
      "role": "mascot chính — quả cầu lông dẫn đường"
    },
    {
      "id": "vun",
      "name": "Vun",
      "role": "cây vợt — huấn luyện kỹ thuật"
    },
    {
      "id": "se",
      "name": "Sẻ",
      "role": "chim sẻ — nhắc lịch sân"
    },
    {
      "id": "bon",
      "name": "Bon",
      "role": "đôi giày — khởi động và ăn mừng"
    }
  ],
  "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": "gust"
    },
    "chip": {
      "interactive": true,
      "states": [
        "default",
        "hover",
        "focusVisible",
        "active",
        "disabled"
      ],
      "use": "lọc trình độ, khung giờ"
    },
    "callout": {
      "types": [
        "info",
        "success",
        "warning",
        "danger",
        "tip"
      ],
      "character": true,
      "characterNote": "Hộp lời nhân vật: Lửa cho mẹo, Sẻ cho nhắc lịch"
    },
    "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": "Gió Vợt nhắn mã giữ sân qua số này",
      "error": "Số chưa đủ 10 chữ số — ví dụ: 0912 345 678"
    },
    "progress": {
      "variants": [
        "bar",
        "steps",
        "ring"
      ],
      "example": "Buổi 6/16 của lớp Vững cú"
    },
    "verdict": {
      "variants": [
        "vững",
        "cần sửa",
        "thử lại"
      ],
      "stamp": true
    },
    "streak": {
      "unit": "tuần đều đặn",
      "example": "5 tuần liền đủ 2 buổi"
    },
    "roadmap": {
      "steps": [
        "Làm quen",
        "Vững cú",
        "Thi đấu"
      ]
    }
  },
  "imagery": {
    "illustrationStyle": "flat-geometric",
    "photoStyle": "không dùng ảnh chụp trong demo",
    "mascot3d": "toy-plastic"
  },
  "themes": [
    "san-dem"
  ],
  "approvedAt": "2026-10-25",
  "approvedBy": "auto-approved (fictional demo brand, approved by Dac Nguyen in chat)",
  "sources": {
    "tokens": "themes/san-dem/tokens.css",
    "docs": "guideline/index.html"
  }
}