/* shared/atlas.css
 * Canonical design tokens for all Atlas apps.
 * Import in any HTML file:  <link rel="stylesheet" href="/shared/atlas.css">
 * or from a sub-app:        <link rel="stylesheet" href="../../shared/atlas.css">
 */

/* ── Fonts ── */
@import url('https://fonts.googleapis.com/css2?family=Playfair+Display:wght@300;400;500;600;700&family=DM+Sans:wght@300;400;500;600;700&family=DM+Mono:wght@400;500&display=swap');

/* ── Design Tokens ── */
:root {
    /* Brand */
    --gold: #C9A96E;
    --gold-dim: rgba(201, 169, 110, 0.10);

    /* Backgrounds */
    --bg: #0A0A0A;
    --surface: #111111;
    --surface-2: #1A1A1A;
    --surface-3: #222222;

    /* Text */
    --text: #E8E8E8;
    --text-secondary: #888888;
    --text-dim: #555555;

    /* Borders */
    --border: #2A2A2A;
    --border-hover: #3A3A3A;

    /* Radius */
    --radius: 8px;
    --radius-sm: 4px;
    --radius-lg: 12px;

    /* Semantic colours */
    --blue: #5B8DEF;
    --blue-dim: rgba(91, 141, 239, 0.10);
    --green: #4ADE80;
    --green-dim: rgba(74, 222, 128, 0.10);
    --red: #F87171;
    --purple: #A78BFA;
    --purple-dim: rgba(167, 139, 250, 0.10);
    --orange: #FB923C;
    --orange-dim: rgba(251, 146, 60, 0.10);
    --cyan: #22D3EE;
    --cyan-dim: rgba(34, 211, 238, 0.10);
    --pink: #F472B6;
    --pink-dim: rgba(244, 114, 182, 0.10);

    /* Typography */
    --font: 'DM Sans', -apple-system, BlinkMacSystemFont, sans-serif;
    --mono: 'DM Mono', monospace;
    --display: 'Playfair Display', Georgia, serif;
}