/**
 * MEIKO-KRAN brand tokens — single source for website + Dispo.
 * Import: @import "@meiko/brand/tokens.css";  (or /brand/tokens.css on static site)
 */

:root {
  /* Primary */
  --meiko-yellow: #fdca31;
  --meiko-yellow-soft: #ffe566;
  --meiko-yellow-dark: #e6b800;
  --meiko-black: #0a0a0a;
  --meiko-charcoal: #141414;
  --meiko-steel: #1c1c1e;
  --meiko-slate: #2a2a2e;
  --meiko-muted: #9a9aa3;
  --meiko-text: #f2f2f4;
  --meiko-white: #ffffff;

  /* Aliases used by legacy website CSS */
  --yellow: var(--meiko-yellow);
  --yellow-soft: var(--meiko-yellow-soft);
  --yellow-dark: var(--meiko-yellow-dark);
  --black: var(--meiko-black);
  --charcoal: var(--meiko-charcoal);
  --steel: var(--meiko-steel);
  --slate: var(--meiko-slate);
  --muted: var(--meiko-muted);
  --text: var(--meiko-text);
  --white: var(--meiko-white);

  /* Typography */
  --meiko-font-sans: Inter, system-ui, -apple-system, "Segoe UI", sans-serif;
  --meiko-font-display: Oswald, Inter, system-ui, sans-serif;

  /* Layout */
  --meiko-radius: 14px;
  --meiko-shadow: 0 18px 50px rgba(0, 0, 0, 0.35);
  --meiko-max: 1180px;
}

/* Tailwind v4 @theme bridge (safe no-op if Tailwind not loaded) */
@theme {
  --color-meiko-yellow: #fdca31;
  --color-meiko-yellow-dim: #e6b800;
  --color-meiko-yellow-soft: #ffe566;
  --color-meiko-black: #0a0a0a;
  --color-meiko-zinc: #141414;
  --color-meiko-card: #1a1a1a;
  --color-meiko-border: #2a2a2e;
  --color-meiko-muted: #9a9aa3;
  --color-meiko-text: #f2f2f4;
  --font-sans: Inter, system-ui, -apple-system, "Segoe UI", sans-serif;
  --font-display: Oswald, Inter, system-ui, sans-serif;
}