:root{--color-bg: #000000;--color-bg-subtle: #0a0a0a;--color-bg-elevated: #111111;--color-border: rgba(255, 255, 255, .08);--color-border-hover: rgba(255, 255, 255, .16);--color-text: #ffffff;--color-text-secondary: rgba(255, 255, 255, .6);--color-text-muted: rgba(255, 255, 255, .4);--color-accent: #10a37f;--color-accent-hover: #1a7f64;--color-accent-indigo: #6366f1;--color-accent-violet: #8b5cf6;--color-accent-teal: #14b8a6;--color-accent-amber: #f59e0b;--color-accent-rose: #f43f5e;--gradient-indigo: linear-gradient(135deg, #6366f1 0%, #8b5cf6 100%);--gradient-teal: linear-gradient(135deg, #10a37f 0%, #14b8a6 100%);--gradient-warm: linear-gradient(135deg, #f59e0b 0%, #f43f5e 100%);--gradient-subtle: linear-gradient(135deg, rgba(99, 102, 241, .15) 0%, rgba(139, 92, 246, .05) 100%);--color-surface-glass: rgba(17, 17, 17, .8);--color-surface-glass-hover: rgba(17, 17, 17, .95);--color-surface-glass-light: rgba(18, 18, 18, .85);--color-overlay-full: rgba(0, 0, 0, .9);--color-overlay-medium: rgba(0, 0, 0, .8);--color-overlay-heavy: rgba(0, 0, 0, .95);--color-overlay-arrow: rgba(0, 0, 0, .6);--color-shadow-strong: rgba(0, 0, 0, .3);--color-shadow-medium: rgba(0, 0, 0, .2);--color-hover-fill: rgba(255, 255, 255, .05);--color-hover-fill-subtle: rgba(255, 255, 255, .03);--color-soft-border: rgba(255, 255, 255, .1);--color-soft-border-inner: rgba(255, 255, 255, .06);--color-scrollbar: rgba(255, 255, 255, .1);--color-scrollbar-hover: rgba(255, 255, 255, .2);--color-selection: rgba(99, 102, 241, .3);--color-vignette: rgba(0, 0, 0, .4);--color-watermark: rgba(255, 255, 255, .02);--noise-opacity: .03;--ambient-orb-opacity: .07;--scene-opacity: .5;--gradient-text-start: #ffffff;--gradient-text-end: rgba(255, 255, 255, .7);--gradient-text-end-muted: rgba(255, 255, 255, .6);--color-code-bg: #0d1117;--color-code-text: #e6edf3;--color-code-inline: #f472b6;--color-link: #a78bfa;--color-link-hover: #c4b5fd;--logo-bg: linear-gradient(135deg, #fff 0%, #a0a0a0 100%);--logo-text: #000;--avatar-bg: linear-gradient(135deg, #1a1a2e 0%, #16213e 100%);--avatar-border: rgba(99, 102, 241, .2);--btn-primary-glow: rgba(255, 255, 255, .15);--btn-glow-bg: linear-gradient(135deg, rgba(255, 255, 255, .2), rgba(255, 255, 255, 0));--font-sans: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;--text-xs: .75rem;--text-sm: .875rem;--text-base: 1rem;--text-lg: 1.125rem;--text-xl: 1.25rem;--text-2xl: 1.5rem;--text-3xl: 2rem;--text-4xl: 2.5rem;--text-5xl: 3.5rem;--text-6xl: 4.5rem;--text-7xl: 6rem;--space-1: .25rem;--space-2: .5rem;--space-3: .75rem;--space-4: 1rem;--space-6: 1.5rem;--space-8: 2rem;--space-10: 2.5rem;--space-12: 3rem;--space-16: 4rem;--space-20: 5rem;--space-24: 6rem;--space-32: 8rem;--space-40: 10rem;--container-max: 1100px;--container-narrow: 800px;--container-padding: clamp(1.5rem, 5vw, 3rem);--sidebar-width: 72px;--ease-out: cubic-bezier(.16, 1, .3, 1);--duration-fast: .15s;--duration-base: .3s;--duration-slow: .5s}:root[data-theme=light]{--color-bg: #ffffff;--color-bg-subtle: #f8f8fa;--color-bg-elevated: #f0f0f3;--color-border: rgba(0, 0, 0, .08);--color-border-hover: rgba(0, 0, 0, .16);--color-text: #1a1a2e;--color-text-secondary: rgba(0, 0, 0, .6);--color-text-muted: rgba(0, 0, 0, .4);--color-accent: #0d8f6f;--color-accent-hover: #0b7a5e;--color-accent-indigo: #4f46e5;--color-accent-violet: #7c3aed;--color-accent-teal: #0d9488;--color-accent-amber: #d97706;--color-accent-rose: #e11d48;--gradient-subtle: linear-gradient(135deg, rgba(79, 70, 229, .08) 0%, rgba(124, 58, 237, .03) 100%);--color-surface-glass: rgba(255, 255, 255, .85);--color-surface-glass-hover: rgba(255, 255, 255, .95);--color-surface-glass-light: rgba(255, 255, 255, .9);--color-overlay-full: rgba(255, 255, 255, .95);--color-overlay-medium: rgba(255, 255, 255, .9);--color-overlay-heavy: rgba(255, 255, 255, .97);--color-overlay-arrow: rgba(255, 255, 255, .8);--color-shadow-strong: rgba(0, 0, 0, .08);--color-shadow-medium: rgba(0, 0, 0, .05);--color-hover-fill: rgba(0, 0, 0, .04);--color-hover-fill-subtle: rgba(0, 0, 0, .02);--color-soft-border: rgba(0, 0, 0, .08);--color-soft-border-inner: rgba(0, 0, 0, .04);--color-scrollbar: rgba(0, 0, 0, .1);--color-scrollbar-hover: rgba(0, 0, 0, .2);--color-selection: rgba(79, 70, 229, .2);--color-vignette: rgba(0, 0, 0, .03);--color-watermark: rgba(0, 0, 0, .03);--noise-opacity: .015;--ambient-orb-opacity: .05;--scene-opacity: .2;--gradient-text-start: #1a1a2e;--gradient-text-end: rgba(26, 26, 46, .7);--gradient-text-end-muted: rgba(26, 26, 46, .6);--color-code-bg: #f6f8fa;--color-code-text: #24292f;--color-code-inline: #cf222e;--color-link: #7c3aed;--color-link-hover: #6d28d9;--logo-bg: linear-gradient(135deg, #1a1a2e 0%, #444 100%);--logo-text: #fff;--avatar-bg: linear-gradient(135deg, #e8e8f0 0%, #d8d8e8 100%);--avatar-border: rgba(79, 70, 229, .2);--btn-primary-glow: rgba(0, 0, 0, .1);--btn-glow-bg: linear-gradient(135deg, rgba(0, 0, 0, .08), rgba(0, 0, 0, 0))}html.theme-ready,html.theme-ready *,html.theme-ready *:before,html.theme-ready *:after{transition-property:background-color,color,border-color,box-shadow,opacity;transition-duration:.3s;transition-timing-function:ease}*,*:before,*:after{box-sizing:border-box;margin:0;padding:0}html{scroll-behavior:smooth;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}body{font-family:var(--font-sans);font-size:var(--text-base);line-height:1.6;color:var(--color-text-secondary);background:var(--color-bg);overflow-x:hidden;position:relative}.noise-overlay{position:fixed;inset:0;z-index:9999;pointer-events:none;opacity:var(--noise-opacity);background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 256 256' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='noise'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23noise)'/%3E%3C/svg%3E");background-repeat:repeat;background-size:256px 256px}.ambient-orbs{position:fixed;inset:0;z-index:0;pointer-events:none;overflow:hidden}.ambient-orb{position:absolute;border-radius:50%;filter:blur(120px);opacity:var(--ambient-orb-opacity);animation:orbFloat 20s ease-in-out infinite}.ambient-orb--1{width:600px;height:600px;background:var(--color-accent-indigo);top:-200px;right:-100px;animation-delay:0s}.ambient-orb--2{width:500px;height:500px;background:var(--color-accent-violet);bottom:-150px;left:-100px;animation-delay:-7s}.ambient-orb--3{width:400px;height:400px;background:var(--color-accent-teal);top:50%;left:50%;transform:translate(-50%,-50%);animation-delay:-14s;opacity:.04}@keyframes orbFloat{0%,to{transform:translate(0) scale(1)}25%{transform:translate(30px,-40px) scale(1.05)}50%{transform:translate(-20px,20px) scale(.95)}75%{transform:translate(15px,35px) scale(1.02)}}.ambient-orb--3{animation-name:orbFloat3}@keyframes orbFloat3{0%,to{transform:translate(-50%,-50%) scale(1)}25%{transform:translate(calc(-50% + 30px),calc(-50% - 40px)) scale(1.05)}50%{transform:translate(calc(-50% - 20px),calc(-50% + 20px)) scale(.95)}75%{transform:translate(calc(-50% + 15px),calc(-50% + 35px)) scale(1.02)}}.vignette{position:fixed;inset:0;z-index:1;pointer-events:none;background:radial-gradient(ellipse at center,transparent 50%,var(--color-vignette) 100%)}h1,h2,h3,h4,h5,h6{font-family:var(--font-sans);color:var(--color-text);font-weight:600;line-height:1.1;letter-spacing:-.03em}h1{font-size:clamp(var(--text-5xl),8vw,var(--text-7xl))}h2{font-size:clamp(var(--text-4xl),5vw,var(--text-5xl))}h3{font-size:var(--text-3xl)}h4{font-size:var(--text-2xl)}p{line-height:1.7}a{color:inherit;text-decoration:none}.container{width:100%;max-width:var(--container-max);margin:0 auto;padding:0 var(--container-padding)}.container-narrow{max-width:var(--container-narrow)}.section{padding:var(--space-32) 0;margin-left:var(--sidebar-width);position:relative;z-index:2}.section-lg{padding:var(--space-40) 0;margin-left:var(--sidebar-width);position:relative;z-index:2}@media(max-width:768px){.section,.section-lg{margin-left:0;padding-top:var(--space-20)}}.section-bg-shift{position:relative}.section-bg-shift:before{content:"";position:absolute;inset:0;z-index:-1;opacity:.5}.btn{display:inline-flex;align-items:center;justify-content:center;gap:var(--space-2);padding:var(--space-3) var(--space-6);font-family:var(--font-sans);font-size:var(--text-sm);font-weight:500;border-radius:9999px;border:none;cursor:pointer;transition:all var(--duration-base) var(--ease-out);text-decoration:none;position:relative}.btn-primary{background:var(--color-text);color:var(--color-bg)}.btn-primary:hover{opacity:.85;transform:translateY(-1px);box-shadow:0 4px 20px var(--btn-primary-glow)}.btn-secondary{background:transparent;color:var(--color-text);border:1px solid var(--color-border)}.btn-secondary:hover{background:var(--color-hover-fill);border-color:var(--color-border-hover);box-shadow:0 4px 20px var(--color-shadow-medium)}.btn-ghost{background:transparent;color:var(--color-text-secondary);padding:var(--space-2) var(--space-4)}.btn-ghost:hover{color:var(--color-text)}.card{background:var(--color-surface-glass);border:1px solid var(--color-border);border-radius:16px;overflow:hidden;transition:all var(--duration-base) var(--ease-out);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px)}.card:hover{border-color:var(--color-border-hover);box-shadow:0 8px 32px var(--color-shadow-strong),0 0 0 1px var(--color-hover-fill)}.fade-in{opacity:0;transform:translateY(20px);transition:opacity .7s var(--ease-out),transform .7s var(--ease-out)}.fade-in.visible{opacity:1;transform:translateY(0)}.label{font-size:var(--text-sm);color:var(--color-text-muted);text-transform:uppercase;letter-spacing:.1em;margin-bottom:var(--space-4);display:inline-flex;align-items:center;gap:var(--space-3)}.label:before{content:"";display:inline-block;width:24px;height:1px;background:var(--gradient-indigo)}.text-center{text-align:center}.text-muted{color:var(--color-text-muted)}.text-secondary{color:var(--color-text-secondary)}.mt-4{margin-top:var(--space-4)}.mt-6{margin-top:var(--space-6)}.mt-8{margin-top:var(--space-8)}.mb-4{margin-bottom:var(--space-4)}.mb-6{margin-bottom:var(--space-6)}.mb-8{margin-bottom:var(--space-8)}::selection{background:var(--color-selection);color:var(--color-text)}::-webkit-scrollbar{width:6px}::-webkit-scrollbar-track{background:transparent}::-webkit-scrollbar-thumb{background:var(--color-scrollbar);border-radius:3px}::-webkit-scrollbar-thumb:hover{background:var(--color-scrollbar-hover)}@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation-duration:.01ms!important;transition-duration:.01ms!important}html{scroll-behavior:auto}.ambient-orb{animation:none!important}}body{background:var(--color-bg)}.blog-header{position:fixed;top:0;left:0;right:0;height:60px;display:flex;align-items:center;justify-content:space-between;padding:0 var(--space-6);background:var(--color-overlay-medium);backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);border-bottom:1px solid var(--color-border);z-index:100}.back-link{display:flex;align-items:center;gap:var(--space-2);color:var(--color-text-secondary);font-size:var(--text-sm);font-weight:500;transition:color var(--duration-fast) var(--ease-out)}.back-link:hover{color:var(--color-text)}.blog-main{min-height:100vh;padding-top:100px;padding-bottom:var(--space-20)}.blog-article{max-width:720px;margin:0 auto;padding:0 var(--space-6)}.article-header{margin-bottom:var(--space-12);padding-bottom:var(--space-8);border-bottom:1px solid var(--color-border)}.article-meta{display:flex;align-items:center;gap:var(--space-3);font-size:var(--text-sm);color:var(--color-text-muted);margin-bottom:var(--space-4)}.separator{opacity:.3}.article-header h1{font-size:clamp(var(--text-3xl),5vw,var(--text-4xl));line-height:1.2;margin-bottom:var(--space-4)}.article-description{font-size:var(--text-lg);color:var(--color-text-secondary);line-height:1.6}.article-tags{display:flex;flex-wrap:wrap;gap:var(--space-2);margin-top:var(--space-6)}.article-tags .tag{font-size:var(--text-xs);color:var(--color-text-muted);padding:var(--space-1) var(--space-3);background:var(--color-bg-elevated);border:1px solid var(--color-border);border-radius:9999px}.article-content{font-size:var(--text-lg);line-height:1.8;color:var(--color-text-secondary)}.article-content h2{font-size:var(--text-2xl);margin-top:var(--space-12);margin-bottom:var(--space-6);padding-top:var(--space-4);border-top:1px solid var(--color-border)}.article-content h3{font-size:var(--text-xl);margin-top:var(--space-8);margin-bottom:var(--space-4)}.article-content h4{font-size:var(--text-lg);margin-top:var(--space-6);margin-bottom:var(--space-3)}.article-content p{margin-bottom:var(--space-6)}.article-content strong{color:var(--color-text);font-weight:600}.article-content em{font-style:italic}.article-content a{color:var(--color-link);text-decoration:underline;text-underline-offset:3px;transition:color var(--duration-fast) var(--ease-out)}.article-content a:hover{color:var(--color-link-hover)}.article-content ul,.article-content ol{margin-bottom:var(--space-6);padding-left:var(--space-6)}.article-content li{margin-bottom:var(--space-2)}.article-content li::marker{color:var(--color-text-muted)}.article-content blockquote{margin:var(--space-8) 0;padding:var(--space-4) var(--space-6);border-left:3px solid var(--color-link);background:var(--color-bg-elevated);border-radius:0 8px 8px 0;font-style:italic}.article-content blockquote p{margin-bottom:0}.article-content code{font-family:JetBrains Mono,monospace;font-size:.9em}.article-content :not(pre)>code{background:var(--color-bg-elevated);padding:.2em .4em;border-radius:4px;color:var(--color-code-inline)}.article-content pre{margin:var(--space-6) 0;padding:var(--space-6);background:var(--color-code-bg);border:1px solid var(--color-border);border-radius:12px;overflow-x:auto;font-size:var(--text-sm);line-height:1.6}.article-content pre code{background:none;padding:0;color:var(--color-code-text)}.article-content img{max-width:100%;height:auto;border-radius:12px;margin:var(--space-8) 0;border:1px solid var(--color-border)}.article-content table{width:100%;margin:var(--space-8) 0;border-collapse:collapse;font-size:var(--text-sm)}.article-content th,.article-content td{padding:var(--space-3) var(--space-4);border:1px solid var(--color-border);text-align:left}.article-content th{background:var(--color-bg-elevated);font-weight:600;color:var(--color-text)}.article-content hr{margin:var(--space-12) 0;border:none;border-top:1px solid var(--color-border)}.callout{margin:var(--space-8) 0;padding:var(--space-6);background:var(--color-bg-elevated);border:1px solid var(--color-border);border-radius:12px}.callout-title{display:flex;align-items:center;gap:var(--space-2);font-weight:600;color:var(--color-text);margin-bottom:var(--space-3)}.callout.insight{border-left:3px solid var(--color-link)}.callout.warning{border-left:3px solid #f59e0b}.callout.tip{border-left:3px solid #10b981}.blog-footer{max-width:720px;margin:0 auto;padding:var(--space-8) var(--space-6);border-top:1px solid var(--color-border);text-align:center;font-size:var(--text-sm);color:var(--color-text-muted)}.blog-footer a{color:var(--color-text-secondary)}.blog-footer a:hover{color:var(--color-text)}.formula{display:block;margin:var(--space-6) 0;padding:var(--space-4);background:var(--color-bg-elevated);border-radius:8px;text-align:center;font-family:JetBrains Mono,monospace;color:var(--color-text);overflow-x:auto}figure{margin:var(--space-8) 0}figcaption{text-align:center;font-size:var(--text-sm);color:var(--color-text-muted);margin-top:var(--space-3)}@media(max-width:768px){.blog-main{padding-top:80px}.article-content{font-size:var(--text-base)}.article-content pre{padding:var(--space-4);font-size:var(--text-xs);margin-left:calc(-1 * var(--space-6));margin-right:calc(-1 * var(--space-6));border-radius:0}}