/* Mina design tokens — keep in sync with mina-portal/src/tokens.css
   Material: Proconnesian marble + Tyrian ink + tessera gold.
   Purple is writing, not the room. Gold is metal, not gradient text. */

:root {
  color-scheme: light;

  --marble:     oklch(0.97 0.008 85);
  --ink:        oklch(0.22 0.04 310);
  --tyrian:     oklch(0.42 0.16 305);
  --amethyst:   oklch(0.55 0.14 305);
  --tessera:    oklch(0.78 0.12 85);
  --bloodstone: oklch(0.48 0.18 25);

  --fog:        oklch(0.94 0.02 305);
  --line:       color-mix(in oklch, var(--tyrian) 16%, var(--marble));
  --text-2:     color-mix(in oklch, var(--ink) 58%, var(--marble));
  --surface:    #ffffff;

  /* Compat aliases — existing class names */
  --primary:        var(--tyrian);
  --secondary:      var(--amethyst);
  --dark-purple:    var(--ink);
  --light-purple:   var(--fog);
  --border-purple:  var(--line);
  --bg:             var(--marble);
  --bg-card:        var(--surface);
  --text:           var(--ink);
  --text-secondary: var(--text-2);
  --text-muted:     color-mix(in oklch, var(--ink) 42%, var(--marble));
  --gold:           var(--tessera);
  --red:            var(--bloodstone);
  --red-dark:       oklch(from var(--bloodstone) calc(l - 0.08) c h);
  --green:          #2D9E6B;

  --font-sans:  'Inter', -apple-system, BlinkMacSystemFont, sans-serif;
  --font-serif: 'Playfair Display', Georgia, serif;

  --ease:       cubic-bezier(0.22, 1, 0.36, 1);
  --ease-enter: cubic-bezier(0.22, 1, 0.36, 1);
  --ease-state: cubic-bezier(0.2, 0.8, 0.2, 1);
  --ease-press: cubic-bezier(0.2, 0, 0, 1);
  --dur-immediate: 100ms;
  --dur-fast:      160ms;
  --dur-standard:  240ms;
  --dur-reveal:    360ms;
  --reveal-travel: 12px;
  --stagger:       60ms;
  --radius:     16px;
  --radius-sm:  10px;

  --shadow-sm:     0 2px 4px color-mix(in oklch, var(--ink) 8%, transparent);
  --shadow-md:     0 4px 16px color-mix(in oklch, var(--tyrian) 12%, transparent);
  --shadow-lg:     0 10px 30px color-mix(in oklch, var(--tyrian) 14%, transparent);
  --shadow-purple: 0 10px 30px color-mix(in oklch, var(--tyrian) 18%, transparent);

  --header-h: 72px;
  --tesserae: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='80' height='10' preserveAspectRatio='none'><rect width='80' height='10' fill='%23D9D2C8'/><rect x='1' y='1' width='7' height='8' fill='%234F2F78'/><rect x='9' y='1' width='5' height='8' fill='%23C4A05A'/><rect x='15' y='1' width='10' height='8' fill='%23F6F4F1'/><rect x='26' y='1' width='6' height='8' fill='%236B5CB8'/><rect x='33' y='1' width='4' height='8' fill='%232A2433'/><rect x='38' y='1' width='9' height='8' fill='%23C4A05A'/><rect x='48' y='1' width='7' height='8' fill='%23E8E0D4'/><rect x='56' y='1' width='6' height='8' fill='%235B4DB8'/><rect x='63' y='1' width='10' height='8' fill='%23D4B87A'/><rect x='74' y='1' width='5' height='8' fill='%233D2A5C'/></svg>");
}