/* shared/variables.css — Single source of truth for SHIROFES OS design tokens.
   Imported by shared/styles.css and standalone pages (mc.html, live.html).
   Keep this file lean: only CSS custom properties, no component styles. */

:root {
    /* ── Brand ─────────────────────────────────────────────────────── */
    --shirofes-red: #E50012;
    --shirofes-red-dark: #CC0010;
    --shirofes-black: #0c0c1a;
    --shirofes-black-alt: #1a1a32;
    --shirofes-white: #FFFFFF;

    /* ── Text ──────────────────────────────────────────────────────── */
    --text-primary: #FFFFFF;
    --text-secondary: #b8b8d0;
    --text-tertiary: #8888a8;
    --text-accent: #d0d0e8;

    /* ── Surfaces & borders ────────────────────────────────────────── */
    --border-color: #2a2a4a;
    --border: var(--border-color);
    --bg-primary: var(--shirofes-black-alt);
    --bg-secondary: rgba(255,255,255,0.06);

    /* ── Semantic ──────────────────────────────────────────────────── */
    --success: #22C55E;
    --warning: #F59E0B;
    --error: #EF4444;
    --info: #3B82F6;

    /* ── Spacing & shape ──────────────────────────────────────────── */
    --radius-sm: 4px;       /* controls, cards, backstage surfaces */
    --radius-md: 8px;       /* public-facing cards, matchup buttons */
    --radius-lg: 16px;      /* kiosk scanner viewport, result cards */
    --shadow-sm: 0 2px 8px rgba(0,0,0,0.15);
    --shadow-md: 0 4px 16px rgba(0,0,0,0.25);
    --shadow-lg: 0 8px 32px rgba(0,0,0,0.3);
    --transition-fast: 0.15s;
    --transition-normal: 0.25s;

    /* ── Typography ────────────────────────────────────────────────── */
    --font-body: 'Inter', 'Noto Sans JP', sans-serif;
    --font-display: 'Inter Tight', 'Inter', 'Noto Sans JP', sans-serif;

    /* ── Motifs (base64 data URIs) ─────────────────────────────────── */
    /* sayagata and kasumi patterns are defined in shared/styles.css
       because they contain large data URIs. Pages that import only
       variables.css and need patterns should add their own. */
}