/* ═══════════════════════════════════════
   DESIGN TOKENS & VARIABLES
   ═══════════════════════════════════════ */
:root {
    /* --- Dark theme palette --- */
    --bg-primary: #0a0e1a;
    --bg-secondary: #111827;
    --bg-card: #1a1f35;
    --bg-card-hover: #222842;
    --bg-glass: rgba(26, 31, 53, 0.7);
    --bg-input: #0f1629;

    --text-primary: #f1f5f9;
    --text-secondary: #94a3b8;
    --text-muted: #64748b;

    --accent: #6366f1;
    --accent-glow: rgba(99, 102, 241, 0.25);
    --accent-hover: #818cf8;
    --accent-2: #8b5cf6;

    --border: rgba(148, 163, 184, 0.08);
    --border-active: rgba(99, 102, 241, 0.4);

    /* Publisher colors */
    --clr-acm: #f43f5e;
    --clr-ais: #3b82f6;
    --clr-springer: #10b981;
    --clr-elsevier: #f59e0b;
    --clr-wiley: #a855f7;

    /* CORE rating colors */
    --clr-core-a-star: #fbbf24;
    --clr-core-a: #34d399;
    --clr-core-b: #60a5fa;
    --clr-core-c: #94a3b8;
    --clr-core-unranked: #64748b;

    /* Urgency */
    --clr-urgent: #ef4444;
    --clr-warning: #f59e0b;
    --clr-ok: #10b981;

    /* Spacing & radius */
    --radius-sm: 8px;
    --radius: 12px;
    --radius-lg: 16px;
    --radius-xl: 24px;

    /* Shadows */
    --shadow-sm: 0 1px 2px rgba(0,0,0,.3);
    --shadow: 0 4px 24px rgba(0,0,0,.3);
    --shadow-lg: 0 12px 48px rgba(0,0,0,.4);
    --shadow-glow: 0 0 40px var(--accent-glow);
}