/* ═══════════════════════════════════════════════════ Aryan Portfolio — Shared Theme Tokens Single source of truth for both index.html and case studies. Theme switching: or "yellow". Default (no attr) = original dark + amber. ═══════════════════════════════════════════════════ */ :root { --bg: #0a0a0a; --s1: #101010; --s2: #161616; --s3: #1c1c1c; --amber: #ffb366; --amber-rgb: 255, 179, 102; --amber-dim: rgba(var(--amber-rgb), 0.12); --amber-mid: rgba(var(--amber-rgb), 0.25); --peacock: #5a8fb8; --peacock-rgb: 37, 99, 235; --peacock-bright: #4090e8; --text: #e8e6e0; --text-muted: #6a6a66; --text-dim: #444; --border: rgba(255, 255, 255, 0.06); --border-amber: rgba(var(--amber-rgb), 0.15); /* Bot logo (SVG) — eyes + all logo animation trace this token. Cobalt/Peach theme → cobalt eyes. Stone/Amber theme → amber eyes. */ --logo-eye: #ffb366; --logo-eye-rgb: 255, 179, 102; --logo-line: var(--amber); /* outer shell outline follows the warm token */ --logo-seam: #6b2a10; /* dark maroon interior lines — theme-invariant */ --green: #4ec97a; --green-dim: rgba(78, 201, 122, 0.12); --font: 'Inter', 'Helvetica Neue', Helvetica, Arial, sans-serif; /* --mono kept as a token alias pointing at Inter — single-font convention. Every var(--mono) call across the site now resolves to Inter. */ --mono: 'Inter', 'Helvetica Neue', Helvetica, Arial, sans-serif; } :root[data-theme="peach"] { --amber: #ed9d6e; --amber-rgb: 237, 157, 110; --amber-dim: rgba(237, 157, 110, 0.14); --amber-mid: rgba(237, 157, 110, 0.28); --peacock: #1e70cc; --peacock-rgb: 30, 112, 204; --peacock-bright: #4090e8; --text: #d4e2ee; --border-amber: rgba(237, 157, 110, 0.18); --logo-eye: #4090e8; /* cobalt eyes */ --logo-eye-rgb: 64, 144, 232; --logo-seam: #7a3418; } :root[data-theme="yellow"] { --amber: #e0bb73; --amber-rgb: 224, 187, 115; --amber-dim: rgba(224, 187, 115, 0.14); --amber-mid: rgba(224, 187, 115, 0.28); --peacock: #8c8a85; --peacock-rgb: 140, 138, 133; --peacock-bright: #b5b3ad; --text: #a8a6a0; --border-amber: rgba(224, 187, 115, 0.18); --logo-eye: #e0bb73; /* amber eyes */ --logo-eye-rgb: 224, 187, 115; --logo-seam: #63451f; }