/* Seegnalz design tokens (CSS custom properties). Same values as tokens.json. */
:root{
  /* Seegnalz/Primitives */
  --primitive-black:#000;--primitive-white:#fff;
  --primitive-gray-700:#5c5c5c;--primitive-gray-300:#bdbdbd;--primitive-gray-100:#ededed;--primitive-gray-placeholder:#d9d9d9;
  --primitive-yellow-500:#ffd731;--primitive-yellow-100:#fcf4d3;
  --primitive-green-500:#55db9c;--primitive-green-100:#c7f2de;
  --primitive-blue-500:#ccf0fa;--primitive-blue-100:#dfeeff;
  --primitive-purple-500:#684bf7;--primitive-purple-100:#e7e3fc;
  --primitive-pink-500:#ff6ada;--primitive-pink-100:#ffe6f9;
  --primitive-red-500:#ff383c;--primitive-red-100:#ffe4e4;
  --primitive-success-500:#34c759;--primitive-success-100:#e2f7e7;
  --primitive-orange-500:#ff6600;--primitive-orange-100:#ffe4d2;
  --primitive-light-blue-500:#a0f1e7;--primitive-light-blue-100:#f3fefe;
  --primitive-light-purple-500:#e9ccff;--primitive-light-purple-100:#f6ebff;

  /* Seegnalz/Color (Light) */
  --color-bg-canvas:var(--primitive-white);--color-bg-surface:var(--primitive-white);--color-bg-subtle:var(--primitive-light-purple-100);
  --color-bg-muted:var(--primitive-gray-100);--color-bg-inverse:var(--primitive-black);--color-bg-disabled:var(--primitive-gray-100);
  --color-bg-placeholder:var(--primitive-gray-placeholder);--color-bg-overlay:var(--primitive-black);
  --color-text-primary:var(--primitive-black);--color-text-secondary:var(--primitive-gray-700);--color-text-disabled:var(--primitive-gray-300);
  --color-text-inverse:var(--primitive-white);--color-text-danger:var(--primitive-red-500);--color-text-success:var(--primitive-success-500);
  --color-icon-primary:var(--primitive-black);--color-icon-secondary:var(--primitive-gray-700);--color-icon-disabled:var(--primitive-gray-300);--color-icon-inverse:var(--primitive-white);
  --color-border-default:var(--primitive-gray-placeholder);--color-border-muted:var(--primitive-gray-700);--color-border-disabled:var(--primitive-gray-300);
  --color-border-danger:var(--primitive-red-500);--color-border-success:var(--primitive-success-500);--color-border-focus:var(--primitive-purple-500);--color-border-selected:var(--primitive-purple-500);
  --color-action-primary:var(--primitive-black);--color-action-primary-pressed:var(--primitive-purple-100);
  --color-action-secondary:var(--primitive-white);--color-action-secondary-pressed:var(--primitive-gray-100);
  --color-action-danger:var(--primitive-red-500);--color-action-danger-pressed:var(--primitive-red-100);--color-action-ghost-pressed:var(--primitive-purple-100);
  --color-selection-on:var(--primitive-purple-500);--color-selection-on-subtle:var(--primitive-purple-100);--color-selection-check:var(--primitive-green-500);--color-selection-off:var(--primitive-purple-100);
  --color-feedback-success:var(--primitive-green-500);--color-feedback-success-subtle:var(--primitive-green-100);
  --color-feedback-danger:var(--primitive-red-500);--color-feedback-danger-subtle:var(--primitive-red-100);
  --color-feedback-info:var(--primitive-blue-500);--color-feedback-info-subtle:var(--primitive-blue-100);
  --color-feedback-warning:var(--primitive-yellow-500);--color-feedback-warning-subtle:var(--primitive-yellow-100);
  --color-accent-pink:var(--primitive-pink-500);--color-accent-pink-subtle:var(--primitive-pink-100);
  --color-accent-yellow:var(--primitive-yellow-500);--color-accent-yellow-subtle:var(--primitive-yellow-100);
  --color-accent-green:var(--primitive-green-500);--color-accent-green-subtle:var(--primitive-green-100);
  --color-accent-blue:var(--primitive-blue-500);--color-accent-blue-subtle:var(--primitive-blue-100);
  --color-accent-purple:var(--primitive-purple-500);--color-accent-purple-subtle:var(--primitive-purple-100);
  --color-accent-orange:var(--primitive-orange-500);--color-accent-orange-subtle:var(--primitive-orange-100);
  --color-accent-light-blue:var(--primitive-light-blue-500);--color-accent-light-blue-subtle:var(--primitive-light-blue-100);
  --color-accent-light-purple:var(--primitive-light-purple-500);--color-accent-light-purple-subtle:var(--primitive-light-purple-100);
  --color-game-block-move:var(--primitive-blue-100);--color-game-block-turn:var(--primitive-yellow-100);--color-game-block-loop:var(--primitive-purple-100);
  --color-game-block-condition:var(--primitive-pink-100);--color-game-block-function:var(--primitive-green-100);
  --color-game-tile-empty:var(--primitive-white);--color-game-tile-path:var(--primitive-yellow-100);--color-game-tile-obstacle:var(--primitive-gray-700);
  --color-game-tile-goal:var(--primitive-green-100);--color-game-tile-start:var(--primitive-blue-100);
  --color-shadow-default:var(--primitive-black);--color-shadow-danger:var(--primitive-red-500);--color-shadow-success:var(--primitive-success-500);

  /* Seegnalz/Dimension */
  --space-2:2px;--space-4:4px;--space-8:8px;--space-12:12px;--space-16:16px;--space-20:20px;--space-24:24px;--space-32:32px;--space-40:40px;--space-48:48px;--space-64:64px;
  --radius-none:0;--radius-sm:4px;--radius-md:8px;--radius-lg:12px;--radius-xl:16px;--radius-full:999px;
  --stroke-default:1.5px;--stroke-thick:2px;--size-touch-target:44px;--size-icon:24px;

  /* Effect styles */
  --shadow-sm:2px 2px 0 0 var(--color-shadow-default);
  --shadow-md:3px 3px 0 0 var(--color-shadow-default);
  --shadow-lg:6px 6px 0 0 var(--color-shadow-default);
  --shadow-danger:3px 3px 0 0 var(--color-shadow-danger);
  --shadow-success:3px 3px 0 0 var(--color-shadow-success);

  --font-display:"Krona One",system-ui,sans-serif;
  --font-mono:"IBM Plex Mono",ui-monospace,Menlo,monospace;
  --page:#fafafa;   /* screen background under the dot grid */
}
