/*
 * OPORA design tokens: the single source for colour, type and shape.
 * Every page loads this file first; page stylesheets refer to these
 * variables instead of hard-coded values.
 *
 * Accent: one emerald scale (Tailwind "emerald"), used on every page.
 *   - dark surfaces use --op-accent (500) and --op-accent-hover (400);
 *   - light surfaces (landing) use --op-accent-strong (600) for fills and
 *     --op-accent-ink (700) for text, which keep WCAG contrast on white.
 */

:root {
    /* Surfaces (dark app UI) */
    --op-bg: #09090b;
    --op-surface: #18181b;
    --op-surface-2: #27272a;
    --op-border: #3f3f46;
    --op-border-strong: #52525b;

    /* Text */
    --op-text-strong: #fafafa;
    --op-text: #f4f4f5;
    --op-text-2: #e4e4e7;
    --op-text-soft: #d4d4d8;
    --op-text-muted: #a1a1aa;
    --op-text-subtle: #71717a;

    /* The one accent */
    --op-accent-light: #6ee7b7;
    --op-accent-hover: #34d399;
    --op-accent: #10b981;
    --op-accent-strong: #059669;
    --op-accent-ink: #047857;
    --op-accent-deep: #064e3b;
    --op-accent-rgb: 16 185 129;
    --op-accent-soft: rgb(var(--op-accent-rgb) / 0.12);
    --op-accent-border: rgb(var(--op-accent-rgb) / 0.35);

    /* Status */
    --op-warn: #f59e0b;
    --op-warn-soft: #fbbf24;
    --op-danger: #ef4444;
    --op-danger-soft: #f87171;

    /* Type and shape */
    --op-font: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont,
        "Segoe UI", sans-serif;
    --op-radius-sm: 8px;
    --op-radius: 12px;
    --op-radius-lg: 18px;
    --op-focus-ring: 0 0 0 3px rgb(var(--op-accent-rgb) / 0.45);
}