{
  "$meta": {
    "name": "HibouPay Design Tokens",
    "format": "DTCG 2025.10",
    "version": "0.4.0",
    "note": "Fonte canônica. dist/* é gerado por scripts/build.mjs."
  },
  "brand": {
    "$description": "Paleta oficial. Escala de tom: corporativo (Black) → popular (Vivid Blue).",
    "black": {
      "$type": "color",
      "$value": "#000000",
      "$description": "Robustez. Fim da escala corporativa, fundo da superfície escura."
    },
    "graffiti": {
      "$type": "color",
      "$value": "#2E3440",
      "$description": "Credibilidade. Tinta de texto, sidebar, dock e toda sombra."
    },
    "vividBlue": {
      "$type": "color",
      "$value": "#0061F1",
      "$description": "Confiança e tecnologia. Ação principal, foco e luz."
    },
    "white": {
      "$type": "color",
      "$value": "#FFFFFF",
      "$description": "Transparência. Papel onde o dado mora."
    },
    "gradient": {
      "$type": "gradient",
      "$value": "linear-gradient(90deg, #000000 0%, #2e3440 38%, #0061f1 100%)",
      "$description": "Escala de tom corporativo → popular."
    },
    "owl": {
      "$description": "Degradê do símbolo da coruja.",
      "from": {
        "$type": "color",
        "$value": "#0162F7"
      },
      "via": {
        "$type": "color",
        "$value": "#0C53DA"
      },
      "to": {
        "$type": "color",
        "$value": "#312782"
      }
    }
  },
  "color": {
    "primary": {
      "$type": "color",
      "$value": "{brand.vividBlue}",
      "$description": "Ação principal, foco, luz."
    },
    "primaryDeep": {
      "$type": "color",
      "$value": "#0048B8",
      "$description": "Texto azul sobre papel com contraste AA. Base do degradê do botão no hover."
    },
    "primaryLight": {
      "$type": "color",
      "$value": "#1672FF",
      "$description": "Topo do degradê do botão primário. Nunca texto."
    },
    "black": {
      "$type": "color",
      "$value": "{brand.black}"
    },
    "graffiti": {
      "$type": "color",
      "$value": "{brand.graffiti}"
    },
    "white": {
      "$type": "color",
      "$value": "{brand.white}"
    },
    "night": {
      "$type": "color",
      "$value": "{brand.graffiti}",
      "$description": "Superfície escura da marca: sidebar, dock, cabeçalho do agente."
    },
    "secondary": {
      "$type": "color",
      "$value": "#A02CFA",
      "$description": "Só estado (rascunho, custo). Nunca superfície nem luz ambiente."
    },
    "secondaryInk": {
      "$type": "color",
      "$value": "#6B21A8",
      "$description": "Secundário como texto sobre papel. Rascunho, experimento."
    },
    "graffitiDeep": {
      "$type": "color",
      "$value": "#15181E",
      "$description": "Base do degradê da superfície noite. Nunca sombra."
    },
    "graffitiLight": {
      "$type": "color",
      "$value": "#383F4D",
      "$description": "Hover da superfície noite. Nunca texto de apoio."
    },
    "bg": {
      "$type": "color",
      "$value": "#F3F5F8",
      "$description": "Canvas da aplicação."
    },
    "card": {
      "$type": "color",
      "$value": "#FFFFFF",
      "$description": "Papel."
    },
    "cardElevated": {
      "$type": "color",
      "$value": "#FFFFFF"
    },
    "wash": {
      "$type": "color",
      "$value": "#EEF0F3",
      "$description": "Preenchimento neutro: skeleton, trilho."
    },
    "ink": {
      "$type": "color",
      "$value": "{brand.graffiti}",
      "$description": "Tinta de título e dado."
    },
    "muted": {
      "$type": "color",
      "$value": "#686D75",
      "$description": "Texto de apoio. AA sobre papel."
    },
    "text": {
      "$type": "color",
      "$value": "{brand.graffiti}",
      "$description": "Corpo de texto."
    },
    "success": {
      "$type": "color",
      "$value": "#2BC155"
    },
    "successInk": {
      "$type": "color",
      "$value": "#157A38",
      "$description": "Sucesso como texto sobre papel."
    },
    "warning": {
      "$type": "color",
      "$value": "#FFBC11"
    },
    "warningInk": {
      "$type": "color",
      "$value": "#8A6200",
      "$description": "Atenção como texto sobre papel."
    },
    "danger": {
      "$type": "color",
      "$value": "#F94687"
    },
    "dangerInk": {
      "$type": "color",
      "$value": "#C2256A",
      "$description": "Perigo como texto sobre papel."
    },
    "border": {
      "$type": "color",
      "$value": "#E3E6EE"
    },
    "borderSoft": {
      "$type": "color",
      "$value": "#EEF0F5"
    },
    "ring": {
      "$type": "color",
      "$value": "{brand.vividBlue}",
      "$description": "Anel de foco."
    }
  },
  "radius": {
    "$description": "Raios concêntricos: interno = externo − padding. Cartão 16 com 4 de respiro abriga controle 12.",
    "xs": {
      "$type": "dimension",
      "$value": "6px",
      "$description": "Etiqueta."
    },
    "sm": {
      "$type": "dimension",
      "$value": "8px",
      "$description": "Controle pequeno, item de lista."
    },
    "md": {
      "$type": "dimension",
      "$value": "12px",
      "$description": "Controle padrão e input."
    },
    "lg": {
      "$type": "dimension",
      "$value": "16px",
      "$description": "Cartão."
    },
    "xl": {
      "$type": "dimension",
      "$value": "22px",
      "$description": "Modal e palco."
    },
    "ear": {
      "$type": "dimension",
      "$value": "9px",
      "$description": "Orelhas do símbolo: chanfro dos cantos superiores."
    },
    "card": {
      "$type": "dimension",
      "$value": "16px",
      "$description": "Compatibilidade CRM. Não usar no Core."
    },
    "pill": {
      "$type": "dimension",
      "$value": "999px",
      "$description": "Compatibilidade CRM. Não usar no Core."
    },
    "input": {
      "$type": "dimension",
      "$value": "12px",
      "$description": "Compatibilidade CRM. Não usar no Core."
    },
    "modal": {
      "$type": "dimension",
      "$value": "22px",
      "$description": "Compatibilidade CRM. Não usar no Core."
    }
  },
  "space": {
    "0": {
      "$type": "dimension",
      "$value": "0px"
    },
    "1": {
      "$type": "dimension",
      "$value": "4px"
    },
    "2": {
      "$type": "dimension",
      "$value": "8px"
    },
    "3": {
      "$type": "dimension",
      "$value": "12px"
    },
    "4": {
      "$type": "dimension",
      "$value": "16px"
    },
    "5": {
      "$type": "dimension",
      "$value": "20px"
    },
    "6": {
      "$type": "dimension",
      "$value": "24px"
    },
    "7": {
      "$type": "dimension",
      "$value": "32px"
    },
    "8": {
      "$type": "dimension",
      "$value": "40px"
    },
    "9": {
      "$type": "dimension",
      "$value": "56px"
    },
    "10": {
      "$type": "dimension",
      "$value": "72px"
    },
    "$description": "Grade de 4pt. Os passos pulam para manter ritmo, não para preencher."
  },
  "gutter": {
    "$description": "Margem lateral da página. Um valor por largura, em todo produto.",
    "base": {
      "$type": "dimension",
      "$value": "16px"
    },
    "md": {
      "$type": "dimension",
      "$value": "24px",
      "$extensions": {
        "hibou.minWidth": "768px"
      }
    },
    "xl": {
      "$type": "dimension",
      "$value": "40px",
      "$extensions": {
        "hibou.minWidth": "1280px"
      }
    }
  },
  "control": {
    "$description": "Altura compartilhada por botão, input, chip e segmento.",
    "xs": {
      "$type": "dimension",
      "$value": "28px"
    },
    "sm": {
      "$type": "dimension",
      "$value": "32px"
    },
    "md": {
      "$type": "dimension",
      "$value": "40px"
    },
    "lg": {
      "$type": "dimension",
      "$value": "48px"
    }
  },
  "elevation": {
    "0": {
      "$type": "shadow",
      "$value": "0 0 0 1px rgba(46,52,64,0.07)"
    },
    "1": {
      "$type": "shadow",
      "$value": "0 0 0 1px rgba(46,52,64,0.06), 0 1px 2px rgba(46,52,64,0.05), 0 6px 16px -10px rgba(46,52,64,0.16)"
    },
    "2": {
      "$type": "shadow",
      "$value": "0 0 0 1px rgba(46,52,64,0.07), 0 18px 40px -20px rgba(46,52,64,0.4)"
    },
    "3": {
      "$type": "shadow",
      "$value": "0 0 0 1px rgba(46,52,64,0.09), 0 32px 80px -24px rgba(46,52,64,0.52)"
    },
    "$description": "0 papel plano · 1 papel · 2 vidro flutuante · 3 sobreposição. Sombra tingida de Graffiti; Black nunca é sombra."
  },
  "font": {
    "heading": {
      "$type": "fontFamily",
      "$value": "var(--font-sora)",
      "$description": "Sora decide: título, número, marca."
    },
    "body": {
      "$type": "fontFamily",
      "$value": "var(--font-inter)",
      "$description": "Inter explica: corpo e controles."
    },
    "mono": {
      "$type": "fontFamily",
      "$value": "var(--font-mono)",
      "$description": "JetBrains Mono registra: IDs, rótulos, estado."
    }
  },
  "type": {
    "$description": "Escala tipográfica. Dez passos inteiros. Nenhum componente escolhe o próprio tamanho.",
    "caption": {
      "$type": "dimension",
      "$value": "11px",
      "$description": "Rótulo de máquina, contagem, iniciais pequenas."
    },
    "small": {
      "$type": "dimension",
      "$value": "12px",
      "$description": "Apoio, hint, botão xs."
    },
    "compact": {
      "$type": "dimension",
      "$value": "13px",
      "$description": "Controle denso, item de menu, célula."
    },
    "body": {
      "$type": "dimension",
      "$value": "14px",
      "$description": "Controle padrão e texto de interface."
    },
    "lead": {
      "$type": "dimension",
      "$value": "15px",
      "$description": "Corpo corrido e botão lg."
    },
    "title": {
      "$type": "dimension",
      "$value": "16px",
      "$description": "Título de cartão e de seção."
    },
    "titleLg": {
      "$type": "dimension",
      "$value": "18px",
      "$description": "Título de diálogo e total enfatizado."
    },
    "metric": {
      "$type": "dimension",
      "$value": "26px",
      "$description": "Número de métrica."
    },
    "metricLg": {
      "$type": "dimension",
      "$value": "30px",
      "$description": "Número de métrica em tela larga."
    },
    "display": {
      "$type": "dimension",
      "$value": "clamp(32px, 2.2vw + 24px, 44px)",
      "$description": "Título de página. Um por tela."
    }
  },
  "motion": {
    "ease": {
      "$type": "cubicBezier",
      "$value": "cubic-bezier(0.16, 1, 0.3, 1)",
      "$description": "Curva da marca: sai rápido, pousa devagar."
    },
    "spring": {
      "$type": "cubicBezier",
      "$value": "cubic-bezier(0.34, 1.36, 0.64, 1)",
      "$description": "Só feedback de toque, nunca layout."
    },
    "instant": {
      "$type": "duration",
      "$value": "120ms",
      "$description": "Fecha a pálpebra, hover, troca de cor."
    },
    "quick": {
      "$type": "duration",
      "$value": "200ms",
      "$description": "Botão, chip, toast, drawer."
    },
    "calm": {
      "$type": "duration",
      "$value": "280ms",
      "$description": "Abre a pálpebra. Diálogo que assenta. Aba que desliza."
    },
    "slow": {
      "$type": "duration",
      "$value": "420ms",
      "$description": "Bloco que entra na tela. Tile ativo da navegação."
    },
    "pupil": {
      "$type": "duration",
      "$value": "80ms",
      "$description": "A luz entra depois que o corpo chegou."
    },
    "strike": {
      "$type": "duration",
      "$value": "150ms",
      "$description": "O corpo do controle viaja antes da luz."
    }
  },
  "glass": {
    "$description": "Um desenho de vidro, três níveis. Nível vem de data-glass no <html> ou de .hb-glass--* no elemento.",
    "base": {
      "$description": "Lê a cor de trás, não a forma. Mais sóbrio, mais corporativo.",
      "top": {
        "$type": "number",
        "$value": 0.56
      },
      "bottom": {
        "$type": "number",
        "$value": 0.4
      },
      "blur": {
        "$type": "dimension",
        "$value": "32px"
      },
      "sat": {
        "$type": "string",
        "$value": "200%"
      },
      "bright": {
        "$type": "number",
        "$value": 1
      },
      "edge": {
        "$type": "number",
        "$value": 0.95
      },
      "rim": {
        "$type": "number",
        "$value": 0.5
      },
      "sheen": {
        "$type": "number",
        "$value": 0
      },
      "nightAlpha": {
        "$type": "number",
        "$value": 0.86
      },
      "nightBlur": {
        "$type": "dimension",
        "$value": "30px"
      }
    },
    "medio": {
      "$description": "A forma de trás aparece borrada. Brilho na quina superior.",
      "top": {
        "$type": "number",
        "$value": 0.4
      },
      "bottom": {
        "$type": "number",
        "$value": 0.24
      },
      "blur": {
        "$type": "dimension",
        "$value": "24px"
      },
      "sat": {
        "$type": "string",
        "$value": "220%"
      },
      "bright": {
        "$type": "number",
        "$value": 1.03
      },
      "edge": {
        "$type": "number",
        "$value": 1
      },
      "rim": {
        "$type": "number",
        "$value": 0.62
      },
      "sheen": {
        "$type": "number",
        "$value": 0.35
      },
      "nightAlpha": {
        "$type": "number",
        "$value": 0.72
      },
      "nightBlur": {
        "$type": "dimension",
        "$value": "26px"
      }
    },
    "intenso": {
      "$description": "Quase líquido: vê-se o que está atrás. Borda e brilho seguram a leitura.",
      "top": {
        "$type": "number",
        "$value": 0.2
      },
      "bottom": {
        "$type": "number",
        "$value": 0.08
      },
      "blur": {
        "$type": "dimension",
        "$value": "14px"
      },
      "sat": {
        "$type": "string",
        "$value": "250%"
      },
      "bright": {
        "$type": "number",
        "$value": 1.08
      },
      "edge": {
        "$type": "number",
        "$value": 1
      },
      "rim": {
        "$type": "number",
        "$value": 0.75
      },
      "sheen": {
        "$type": "number",
        "$value": 0.6
      },
      "nightAlpha": {
        "$type": "number",
        "$value": 0.58
      },
      "nightBlur": {
        "$type": "dimension",
        "$value": "20px"
      }
    }
  }
}