:root{--font-display: "Outfit", sans-serif;--font-mono: "Space Mono", monospace;--font-handwriting: "Playwrite IT Moderna", cursive;--font-sketch: "Gaegu", cursive;--radius-sm: 8px;--radius-md: 12px;--radius-lg: 20px;--radius-xl: 28px}:root,html[data-theme=light]{--bg-primary: #fafaf9;--bg-secondary: #f5f5f4;--bg-card: #ffffff;--bg-card-hover: #fafaf9;--border: #e7e5e4;--border-glow: #06b6d4;--text-primary: #1c1917;--text-secondary: #57534e;--text-muted: #a8a29e;--accent: #0e7490;--accent-bright: #06b6d4;--accent-dim: #155e75;--accent-glow: rgba(6, 182, 212, .15);--ocean: #06b6d4;--ocean-deep: #0891b2;--indigo: #6366f1;--indigo-soft: #818cf8;--amber: #f59e0b;--rose: #f43f5e;--emerald: #10b981;--violet: #8b5cf6;--gradient-cta: linear-gradient(135deg, #0891b2 0%, #06b6d4 100%);--gradient-hero: linear-gradient(135deg, #0e7490 0%, #06b6d4 50%, #6366f1 100%);--gradient-subtle: linear-gradient(135deg, rgba(6, 182, 212, .06) 0%, rgba(99, 102, 241, .04) 100%);--nav-bg: rgba(250, 250, 249, .92);--topic-underline-height: 7px;--card-shadow: 0 2px 16px rgba(28, 25, 23, .06);--card-shadow-hover: 0 8px 32px rgba(6, 182, 212, .12);--syntax-keyword: #0891b2;--syntax-string: #059669;--syntax-function: #7c3aed;--syntax-comment: #a8a29e;--syntax-number: #ea580c;--syntax-operator: #db2777}@media(prefers-color-scheme:dark){:root{--bg-primary: #0c0a09;--bg-secondary: #1c1917;--bg-card: #1a1816;--bg-card-hover: #262321;--border: #292524;--border-glow: #22d3ee;--text-primary: #fafaf9;--text-secondary: #a8a29e;--text-muted: #78716c;--accent: #22d3ee;--accent-bright: #67e8f9;--accent-dim: #06b6d4;--accent-glow: rgba(34, 211, 238, .2);--ocean: #22d3ee;--ocean-deep: #06b6d4;--indigo: #818cf8;--indigo-soft: #a5b4fc;--amber: #fbbf24;--rose: #fb7185;--emerald: #34d399;--violet: #a78bfa;--gradient-cta: linear-gradient(135deg, #06b6d4 0%, #22d3ee 100%);--gradient-hero: linear-gradient(135deg, #0891b2 0%, #22d3ee 50%, #6366f1 100%);--gradient-subtle: linear-gradient(135deg, rgba(34, 211, 238, .08) 0%, rgba(99, 102, 241, .05) 100%);--nav-bg: rgba(12, 10, 9, .88);--topic-underline-height: 5px;--card-shadow: 0 2px 16px rgba(0, 0, 0, .5);--card-shadow-hover: 0 8px 32px rgba(34, 211, 238, .15);--syntax-keyword: #22d3ee;--syntax-string: #34d399;--syntax-function: #a78bfa;--syntax-comment: #78716c;--syntax-number: #fbbf24;--syntax-operator: #f472b6}}html[data-theme=dark]{--bg-primary: #0c0a09;--bg-secondary: #1c1917;--bg-card: #1a1816;--bg-card-hover: #262321;--border: #292524;--border-glow: #22d3ee;--text-primary: #fafaf9;--text-secondary: #a8a29e;--text-muted: #78716c;--accent: #22d3ee;--accent-bright: #67e8f9;--accent-dim: #06b6d4;--accent-glow: rgba(34, 211, 238, .2);--ocean: #22d3ee;--ocean-deep: #06b6d4;--indigo: #818cf8;--indigo-soft: #a5b4fc;--amber: #fbbf24;--rose: #fb7185;--emerald: #34d399;--violet: #a78bfa;--gradient-cta: linear-gradient(135deg, #06b6d4 0%, #22d3ee 100%);--gradient-hero: linear-gradient(135deg, #0891b2 0%, #22d3ee 50%, #6366f1 100%);--gradient-subtle: linear-gradient(135deg, rgba(34, 211, 238, .08) 0%, rgba(99, 102, 241, .05) 100%);--nav-bg: rgba(12, 10, 9, .88);--topic-underline-height: 5px;--card-shadow: 0 2px 16px rgba(0, 0, 0, .5);--card-shadow-hover: 0 8px 32px rgba(34, 211, 238, .15);--syntax-keyword: #22d3ee;--syntax-string: #34d399;--syntax-function: #a78bfa;--syntax-comment: #78716c;--syntax-number: #fbbf24;--syntax-operator: #f472b6}*{margin:0;padding:0;box-sizing:border-box}html{scroll-behavior:smooth}body{font-family:var(--font-display);font-weight:300;background:var(--bg-primary);color:var(--text-primary);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;overflow-x:hidden;transition:background-color .3s,color .3s}h1,h2,h3,h4{font-family:var(--font-handwriting);font-weight:200;line-height:1.2}a{color:var(--accent);text-decoration:none;transition:color .2s}a:hover{color:var(--accent-bright)}::selection{background:var(--accent-glow);color:var(--text-primary)}.code-keyword{color:var(--syntax-keyword)}.code-string{color:var(--syntax-string)}.code-function{color:var(--syntax-function)}.code-comment{color:var(--syntax-comment);font-style:italic}.code-number{color:var(--syntax-number)}.code-operator{color:var(--syntax-operator)}
