@import url('https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600&family=Playfair+Display:wght@400;500;600&display=swap'); /* ── Design Tokens ────────────────────────────────── */ :root { --bg-primary: #0a0a0a; --bg-secondary: #111111; --bg-card: #161616; --bg-card-hover: #1a1a1a; --bg-overlay: rgba(0, 0, 0, 0.92); --text-primary: #f0f0f0; --text-secondary: #999999; --text-muted: #666666; --border-subtle: #222222; --border-hover: #333333; --accent: #d4af37; --accent-dim: rgba(212, 175, 55, 0.15); --font-sans: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif; --font-serif: 'Playfair Display', Georgia, 'Times New Roman', serif; --radius-sm: 4px; --radius-md: 8px; --radius-lg: 12px; --transition-fast: 150ms ease; --transition-normal: 300ms ease; --transition-slow: 500ms ease; --max-width: 1400px; --header-height: 64px; } /* ── Light Theme ──────────────────────────────────── */ [data-theme='light'] { --bg-primary: #fafafa; --bg-secondary: #f0f0f0; --bg-card: #ffffff; --bg-card-hover: #f5f5f5; --bg-overlay: rgba(255, 255, 255, 0.92); --text-primary: #1a1a1a; --text-secondary: #666666; --text-muted: #999999; --border-subtle: #e0e0e0; --border-hover: #cccccc; --accent: #b8960e; --accent-dim: rgba(184, 150, 14, 0.12); } /* ── Reset ────────────────────────────────────────── */ *, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; } html { -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; } body { font-family: var(--font-sans); background: var(--bg-primary); color: var(--text-primary); min-height: 100vh; line-height: 1.6; } a { color: inherit; text-decoration: none; } img { display: block; max-width: 100%; }