:root{--color-text-primary: #1A1A1A;--color-text-heading: #1A1A2E;--color-text-secondary: #666666;--color-text-muted: #64748B;--color-accent: #6B8FFF;--color-accent-alt: #5B7FFF;--color-accent-yellow: #FFE66D;--color-green: #4ECDC4;--color-green-alt: #059669;--color-purple: #7C3AED;--color-purple-light: #A78BFA;--gradient-accent: linear-gradient(135deg, #FF6B6B, #FFE66D);--gradient-progress: linear-gradient(90deg, #FF6B6B, #FFE66D, #4ECDC4);--gradient-rainbow: linear-gradient(90deg, #FF6B6B, #FFE66D, #4ECDC4, #7C3AED);--color-bg-white: #FFFFFF;--color-bg-light: #F9FAFB;--color-bg-dark: #1A1A1A;--color-bg-dark-secondary: #2A2A2A;--color-border: #E5E7EB;--color-border-alt: #E5E5E5;--max-width: 1440px;--padding-x: 80px;--header-height: 60px;--font-body: "Space Grotesk", -apple-system, BlinkMacSystemFont, sans-serif;--font-mono: "Space Mono", "Fira Code", monospace;--text-xs: .75rem;--text-sm: .875rem;--text-base: 1rem;--text-lg: 1.125rem;--text-xl: 1.25rem;--text-2xl: 1.5rem;--text-3xl: 1.875rem;--text-4xl: 2.25rem;--text-5xl: 3rem;--text-6xl: 3.75rem;--space-1: .25rem;--space-2: .5rem;--space-3: .75rem;--space-4: 1rem;--space-5: 1.25rem;--space-6: 1.5rem;--space-8: 2rem;--space-10: 2.5rem;--space-12: 3rem;--space-16: 4rem;--space-20: 5rem;--space-24: 6rem;--space-28: 7.5rem;--radius-sm: 0;--radius-md: 0;--radius-lg: 0;--radius-xl: 0;--radius-2xl: 0;--radius-full: 0;--shadow-sm: 0 1px 2px rgba(0, 0, 0, .05);--shadow-md: 0 4px 6px -1px rgba(0, 0, 0, .1), 0 2px 4px -2px rgba(0, 0, 0, .1);--shadow-lg: 0 10px 15px -3px rgba(0, 0, 0, .1), 0 4px 6px -4px rgba(0, 0, 0, .1);--shadow-xl: 0 20px 25px -5px rgba(0, 0, 0, .1), 0 8px 10px -6px rgba(0, 0, 0, .1);--transition-fast: .15s ease;--transition-base: .25s ease;--transition-slow: .35s ease}@media(max-width:1200px){:root{--padding-x: 48px;--text-6xl: 3rem;--text-5xl: 2.5rem;--text-4xl: 2rem}}@media(max-width:768px){:root{--padding-x: 24px;--header-height: 52px;--text-6xl: 2.5rem;--text-5xl: 2rem;--text-4xl: 1.75rem;--text-3xl: 1.5rem;--space-24: 4rem;--space-28: 5rem;--space-20: 3.5rem;--space-16: 3rem}}@media(max-width:480px){:root{--padding-x: 16px;--text-6xl: 2rem;--text-5xl: 1.75rem;--text-4xl: 1.5rem;--text-3xl: 1.25rem;--space-24: 3rem;--space-28: 3.5rem;--space-20: 2.5rem;--space-16: 2rem;--space-12: 2rem}}*,*:before,*:after{box-sizing:border-box;margin:0;padding:0}html{-moz-text-size-adjust:none;-webkit-text-size-adjust:none;text-size-adjust:none;scroll-behavior:smooth;overflow-x:hidden}body{min-height:100vh;line-height:1.6;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}img,picture,video,canvas,svg{display:block;max-width:100%}input,button,textarea,select{font:inherit;color:inherit}p,h1,h2,h3,h4,h5,h6{overflow-wrap:break-word}a{color:inherit;text-decoration:none}ul,ol{list-style:none}button{background:none;border:none;cursor:pointer}body{font-family:var(--font-body);font-size:var(--text-base);color:var(--color-text-primary);background-color:var(--color-bg-white);padding-top:var(--header-height);overflow-x:hidden}h1,h2,h3,h4,h5,h6{color:var(--color-text-heading);font-weight:700;line-height:1.2}h1{font-size:var(--text-5xl)}h2{font-size:var(--text-4xl)}h3{font-size:var(--text-2xl)}h4{font-size:var(--text-xl)}p{color:var(--color-text-secondary);line-height:1.7}code,pre{font-family:var(--font-mono)}.container{max-width:var(--max-width);margin:0 auto;padding-left:var(--padding-x);padding-right:var(--padding-x)}.section{padding:var(--space-24) 0}.section-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:var(--space-12)}.section-label{font-family:var(--font-mono);font-size:var(--text-sm);font-weight:500;color:var(--color-accent);text-transform:uppercase;letter-spacing:.05em;margin-bottom:var(--space-4)}.section-title{font-size:var(--text-4xl);font-weight:700;color:var(--color-text-heading)}.section-description{font-size:var(--text-lg);color:var(--color-text-secondary);max-width:600px;overflow-wrap:break-word;word-break:break-word}.gradient-text{background:var(--gradient-accent);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}.mono{font-family:var(--font-mono)}.view-all-link{display:inline-flex;align-items:center;gap:var(--space-2);font-size:var(--text-sm);font-weight:500;color:var(--color-accent);transition:gap var(--transition-base)}.view-all-link:hover{gap:var(--space-3)}.view-all-link svg{width:16px;height:16px;transition:transform var(--transition-fast)}.view-all-link:hover svg{transform:translate(3px)}.header{height:var(--header-height);display:flex;align-items:center;border-bottom:none;background:#0a0a0a;position:fixed;top:0;left:0;width:100%;z-index:100}.header:after{content:"";position:absolute;bottom:0;left:0;right:0;height:1px;background:var(--gradient-rainbow);opacity:.5}.header .container{display:flex;align-items:center;justify-content:space-between;width:100%}.header-logo{display:inline-flex;align-items:center;gap:0;font-weight:700;font-size:var(--text-base);color:#fff}.header-logo-icon{width:24px;height:24px;margin-right:6px;vertical-align:middle}.header-logo .logo-dot{color:var(--color-accent)}.header-nav{display:flex;align-items:center;gap:var(--space-10)}.header-nav a{font-family:var(--font-body);font-size:var(--text-base);font-weight:400;color:#9ca3af;text-transform:none;letter-spacing:.02em;padding:6px 12px;transition:color var(--transition-fast),background var(--transition-fast);position:relative}.header-nav a:hover{color:#0a0a0a;background:#fff;font-weight:700}.header-nav a.active{color:#9ca3af;font-weight:400}.header-actions{display:flex;align-items:center;gap:var(--space-6)}.header-actions .header-link{font-family:var(--font-body);font-size:var(--text-sm);font-weight:400;color:#9ca3af;text-transform:none;letter-spacing:.02em;transition:color var(--transition-fast);display:inline-flex;align-items:center;gap:var(--space-2)}.header-actions .header-link:hover{color:#fff}.header-actions .header-link svg{width:16px;height:16px}.footer{background:#0a0a0a;color:#fff;padding:var(--space-16) 0 var(--space-8);border-top:1px solid #222}.footer-grid{display:grid;grid-template-columns:1.2fr 1fr 1fr;gap:0;margin-bottom:var(--space-12)}.footer-col{padding:var(--space-8) var(--space-8) 0 var(--space-8);border-left:1px solid #222}.footer-col:first-child{border-left:none;padding-left:0}.footer-col-title{font-family:var(--font-mono);font-size:var(--text-lg);font-weight:700;color:#fff;letter-spacing:.15em;margin-bottom:var(--space-8);padding-bottom:var(--space-4);border-bottom:1px solid #222}.footer-sub-group{margin-bottom:var(--space-6)}.footer-sub-label{font-family:var(--font-mono);font-size:var(--text-xs);color:#6b7280;text-transform:uppercase;letter-spacing:.08em;margin-bottom:var(--space-3)}.footer-sub-group ul{display:flex;flex-direction:column;gap:var(--space-2)}.footer-sub-group a{font-family:var(--font-mono);font-size:var(--text-sm);color:#d1d5db;text-transform:uppercase;letter-spacing:.04em;display:block;padding:6px 10px;margin:0 -10px;max-width:200px;transition:color var(--transition-fast),background var(--transition-fast),transform var(--transition-fast)}.footer-sub-group a:hover{color:#0a0a0a;background:#fff;transform:translate(3px)}.footer-brand-watermark{font-size:clamp(4rem,15vw,12rem);font-weight:700;color:#fff;opacity:.04;text-align:center;line-height:1;margin-top:var(--space-8);-webkit-user-select:none;user-select:none;pointer-events:none}.footer-bottom{display:flex;align-items:center;justify-content:space-between;padding-top:var(--space-6);border-top:1px solid #222}.footer-copyright{font-family:var(--font-mono);font-size:var(--text-xs);color:#6b7280;text-transform:uppercase;letter-spacing:.08em}.footer-bottom-links{display:flex;gap:var(--space-6)}.footer-bottom-links a{font-family:var(--font-mono);font-size:var(--text-xs);color:#6b7280;text-transform:uppercase;letter-spacing:.08em;padding:4px 8px;transition:color var(--transition-fast),background var(--transition-fast),transform var(--transition-fast)}.footer-bottom-links a:hover{color:#0a0a0a;background:#fff;transform:translate(3px)}.btn{display:inline-flex;align-items:center;gap:var(--space-2);padding:14px 28px;border-radius:0;font-family:var(--font-mono);font-size:var(--text-sm);font-weight:700;letter-spacing:.1em;text-transform:uppercase;transition:all var(--transition-base);cursor:pointer;border:none;white-space:nowrap;position:relative}.btn-outline:before,.btn-outline:after,.btn-outline-dark:before,.btn-outline-dark:after{content:"";position:absolute;top:0;bottom:0;width:3px;border-radius:0}.btn-outline:before,.btn-outline-dark:before{left:-3px;background:linear-gradient(180deg,#f33,gold,#ff6b35);box-shadow:0 0 6px #ff333380,0 0 6px #ffd7004d}.btn-outline:after,.btn-outline-dark:after{right:-3px;background:linear-gradient(180deg,#39f,#0c6,#00ced1);box-shadow:0 0 6px #3399ff80,0 0 6px #00cc664d}.btn-primary{background:#5b21b6;color:#fff}.btn-primary:hover{background:#6d28d9;transform:translateY(-1px);box-shadow:0 4px 20px #5b21b666}.btn-outline{background:#e8e4d9;color:#1a1a1a}.btn-outline:hover{background:#f5f1e6;transform:translateY(-1px)}.btn-accent{background:#5b21b6;color:#fff}.btn-accent:hover{background:#6d28d9;transform:translateY(-1px);box-shadow:0 4px 20px #5b21b666}.btn-ghost{background:transparent;color:var(--color-text-secondary);padding:8px 16px}.btn-ghost:hover{background:var(--color-bg-light);color:var(--color-text-primary)}.btn svg{width:16px;height:16px}.card{background:var(--color-bg-white);border:1px solid var(--color-border);border-radius:var(--radius-xl);overflow:hidden;transition:all var(--transition-base)}.card:hover{box-shadow:var(--shadow-lg);transform:translateY(-2px)}.card-image{width:100%;aspect-ratio:16 / 10;background:var(--gradient-accent);position:relative;overflow:hidden}.card-body{padding:var(--space-6)}.card-tags{display:flex;flex-wrap:wrap;gap:var(--space-2);margin-bottom:var(--space-3)}.card-title{font-size:var(--text-lg);font-weight:600;color:var(--color-text-heading);margin-bottom:var(--space-2);line-height:1.4}.card-excerpt{font-size:var(--text-sm);color:var(--color-text-secondary);line-height:1.6;margin-bottom:var(--space-4)}.card-meta{display:flex;align-items:center;gap:var(--space-4);font-size:var(--text-xs);color:var(--color-text-muted)}.card-meta svg{width:14px;height:14px}.card-meta span{display:inline-flex;align-items:center;gap:var(--space-1)}.tag{display:inline-flex;align-items:center;padding:4px 12px;border-radius:var(--radius-sm);font-size:var(--text-xs);font-weight:500;font-family:var(--font-mono);transition:transform var(--transition-fast)}.tag:hover{transform:translateY(-1px)}.tag-default{background:var(--color-bg-light);color:var(--color-text-secondary)}.tag-accent{background:#fef2f2;color:var(--color-accent)}.tag-green{background:#ecfdf5;color:var(--color-green-alt)}.tag-purple{background:#f5f3ff;color:var(--color-purple)}.tag-yellow{background:#fffbeb;color:#d97706}.filter-pills{display:flex;gap:var(--space-2);flex-wrap:wrap}.filter-pill{padding:8px 20px;border-radius:var(--radius-sm);font-size:var(--text-sm);font-weight:500;background:var(--color-bg-white);color:var(--color-text-secondary);border:1px solid var(--color-border);cursor:pointer;transition:all var(--transition-fast)}.filter-pill:hover{border-color:var(--color-text-heading);color:var(--color-text-heading)}.filter-pill:active{transform:scale(.95);transition-duration:80ms}.filter-pill.active{background:var(--color-text-heading);color:#fff;border-color:var(--color-text-heading)}.blob-container{position:relative;overflow:hidden}.blob{position:absolute;border-radius:0;filter:blur(60px);opacity:.3;pointer-events:none}.blob-pink{background:radial-gradient(circle,#FF6B6B,transparent 70%)}.blob-yellow{background:radial-gradient(circle,#FFE66D,transparent 70%)}.blob-green{background:radial-gradient(circle,#4ECDC4,transparent 70%)}.blob-blue{background:radial-gradient(circle,#60A5FA,transparent 70%)}.blob-purple{background:radial-gradient(circle,#A78BFA,transparent 70%)}.search-box{display:flex;align-items:center;gap:var(--space-3);padding:12px 20px;background:var(--color-bg-white);border:1px solid var(--color-border);border-radius:var(--radius-sm);width:100%;max-width:480px}.search-box svg{width:20px;height:20px;color:var(--color-text-muted);flex-shrink:0}.search-box input{flex:1;border:none;outline:none;font-size:var(--text-sm);color:var(--color-text-primary);background:transparent}.search-box input:focus-visible{outline:none}.search-box input::placeholder{color:var(--color-text-muted)}.search-box:focus-within{box-shadow:0 0 0 3px #ff6b6b1f;transition:box-shadow var(--transition-fast)}.search-row{display:flex;justify-content:center;margin-top:var(--space-4)}.page-hero-block-group{display:inline-block;margin-bottom:0}.page-hero-title{font-size:clamp(2.8rem,6vw,5.5rem);font-weight:700;color:#fff;line-height:1.4;margin-bottom:0;text-shadow:none}.page-hero-title span{display:inline;background:#0a0a0a;padding:.05em .3em;box-decoration-break:clone;-webkit-box-decoration-break:clone}.page-hero-title .hero-line-1{transform:rotate(-.6deg);display:inline-block;position:relative}.page-hero-label{font-family:var(--font-mono);font-size:var(--text-sm);font-weight:700;color:#fff;text-transform:uppercase;letter-spacing:.1em;margin-top:-2px;margin-bottom:0;display:inline-block;background:#0a0a0a;padding:.4em .6em;transform:rotate(-.8deg);position:relative}.page-hero-label:before,.page-hero-label:after,.page-hero-title .hero-line-1:before,.page-hero-title .hero-line-1:after{content:"";position:absolute;top:0;bottom:0;width:3px;border-radius:0;background:linear-gradient(180deg,#f33,gold,#0c6,#39f);box-shadow:0 0 6px #ff333380,0 0 6px #ffd7004d}.page-hero-label:before,.page-hero-title .hero-line-1:before{left:-3px}.page-hero-label:after,.page-hero-title .hero-line-1:after{right:-3px}@media(max-width:768px){.page-hero-title{font-size:clamp(2rem,8vw,2.8rem)}}.three-canvas-container{position:absolute;inset:0;z-index:0;overflow:hidden;pointer-events:none}.three-canvas-container canvas{width:100%;height:100%}.literary-quote{padding:var(--space-12) 0;display:flex;justify-content:center}.terminal-chrome{width:100%;max-width:700px;border-radius:var(--radius-lg);overflow:hidden;border:1px solid #222;box-shadow:0 8px 32px #0000004d}.terminal-titlebar{background:#2d2d2d;padding:10px 16px;display:flex;align-items:center;position:relative}.terminal-dots{display:flex;gap:6px}.terminal-dots .dot{width:10px;height:10px;border-radius:0}.dot-red{background:#ff5f56}.dot-yellow{background:#ffbd2e}.dot-green{background:#27c93f}.terminal-title{position:absolute;left:50%;transform:translate(-50%);font-family:var(--font-mono);font-size:var(--text-xs);color:#6b7280}.terminal-body{background:#0a0a0a;padding:var(--space-6) var(--space-8);min-height:140px;position:relative}.terminal-body:after{content:"";position:absolute;inset:0;background:repeating-linear-gradient(0deg,transparent,transparent 2px,rgba(255,255,255,.015) 2px,rgba(255,255,255,.015) 4px);pointer-events:none}.terminal-line{display:flex;align-items:flex-start;gap:var(--space-2)}.terminal-prompt{color:#4ade80;font-family:var(--font-mono);font-size:var(--text-base);font-weight:700;flex-shrink:0;line-height:1.7}.literary-quote blockquote{font-family:var(--font-mono);font-size:var(--text-base);color:#4ade80;margin:0;line-height:1.7;min-height:1.7em;white-space:pre-wrap;display:inline}.literary-quote .quote-cursor{display:inline-block;width:8px;height:1.1em;background:#4ade80;margin-left:2px;vertical-align:text-bottom;animation:cursor-blink .7s step-end infinite}.literary-quote cite{font-family:var(--font-mono);font-size:var(--text-sm);color:#6b7280;font-style:normal;display:block;margin-top:var(--space-2);padding-left:calc(var(--space-2) + 1ch + var(--space-2));opacity:0;transition:opacity .3s ease}.literary-quote cite.cite-visible{opacity:1}@keyframes cursor-blink{0%,49%{opacity:1}50%,to{opacity:0}}.literary-quote.quote-glitching blockquote{animation:glitch-text .08s step-end infinite}.literary-quote.quote-glitching cite{animation:glitch-text .08s step-end infinite reverse}@keyframes glitch-text{0%{text-shadow:2px 0 #6B8FFF,-2px 0 #4ECDC4;transform:translate(0);clip-path:inset(0 0 0 0)}10%{text-shadow:-2px 0 #6B8FFF,2px 0 #4ECDC4;transform:translate(-3px,1px);clip-path:inset(40% 0 20% 0)}20%{text-shadow:2px 0 #6B8FFF,-2px 0 #4ECDC4;transform:translate(3px,-1px);clip-path:inset(10% 0 60% 0)}30%{text-shadow:0 2px #6B8FFF,0 -2px #4ECDC4;transform:translateY(2px);clip-path:inset(50% 0 10% 0)}40%{text-shadow:-1px -1px #6B8FFF,1px 1px #4ECDC4;transform:translate(-2px,-1px);clip-path:inset(20% 0 40% 0)}50%{text-shadow:1px 0 #6B8FFF,-1px 0 #4ECDC4;transform:translate(1px,1px);clip-path:inset(60% 0 5% 0)}60%{text-shadow:-2px 1px #6B8FFF,2px -1px #4ECDC4;transform:translate(-1px,-2px);clip-path:inset(5% 0 50% 0)}70%{text-shadow:2px -1px #6B8FFF,-2px 1px #4ECDC4;transform:translate(2px);clip-path:inset(30% 0 30% 0)}80%{text-shadow:-1px 0 #6B8FFF,1px 0 #4ECDC4;transform:translateY(1px);clip-path:inset(45% 0 15% 0)}90%{text-shadow:1px 1px #6B8FFF,-1px -1px #4ECDC4;transform:translate(-2px,-1px);clip-path:inset(15% 0 45% 0)}to{text-shadow:none;transform:translate(0);clip-path:inset(0 0 0 0)}}.literary-quote.cyberpunk-bg{width:100vw;max-width:none;margin-left:calc(50% - 50vw);padding-left:0;padding-right:0;position:relative;overflow:hidden;background:#050508;padding-top:var(--space-20);padding-bottom:var(--space-20);isolation:isolate;min-height:480px}.literary-quote.cyberpunk-bg:before{content:"";position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:1000px;height:600px;background:radial-gradient(ellipse,rgba(74,222,128,.06) 0%,transparent 70%);pointer-events:none;z-index:1}.cyberpunk-backdrop{position:absolute;inset:0;z-index:0;pointer-events:none;overflow:hidden}.literary-quote.cyberpunk-bg>.terminal-chrome{position:relative;z-index:2;margin:0 auto}.cyber-terminal{position:absolute;border-radius:var(--radius-md);border:1px solid rgba(255,255,255,.08);overflow:hidden;font-family:var(--font-mono);font-size:10px;line-height:1.5;background:#0a0a0eeb;transition:opacity .6s ease,transform .6s ease}.cyber-terminal.cyber-spawning{animation:cyber-spawn .6s ease-out forwards}.cyber-terminal.cyber-closing{opacity:0!important;transform:scale(.93)}.cyber-terminal-bar{background:#111114;padding:5px 8px;display:flex;align-items:center;gap:4px;border-bottom:1px solid rgba(255,255,255,.04)}.cyber-terminal-bar .cyber-dot{width:5px;height:5px;border-radius:0}.cyber-terminal-bar .cyber-title{margin-left:6px;color:#555;font-size:9px;letter-spacing:.5px}.cyber-terminal-body{padding:6px 8px}.cyber-terminal-body .cyber-line{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;height:1.5em}@keyframes cyber-spawn{0%{opacity:0;transform:inherit scale(.92)}to{opacity:var(--term-opacity, .55);transform:inherit scale(1)}}@media(max-width:1024px){.literary-quote.cyberpunk-bg{min-height:360px;padding:var(--space-16) 0}}@media(max-width:768px){.cyberpunk-backdrop{display:none}.literary-quote.cyberpunk-bg{background:#0a0a0a;min-height:auto;padding:var(--space-16) 0}}.sidebar-card{display:flex;gap:var(--space-4);padding:var(--space-4);border:1px solid var(--color-border);border-radius:var(--radius-sm);cursor:pointer;transition:all var(--transition-fast)}.sidebar-card:hover{border-color:var(--color-text-muted);box-shadow:var(--shadow-sm);transform:translate(4px)}.sidebar-card.active{border-color:var(--color-accent);border-width:2px;background:#fffbfb}.sidebar-card.active-teal{border-color:var(--color-green);border-width:2px;background:#f0fdfa}.sidebar-card-thumb{width:80px;height:60px;border-radius:var(--radius-sm);background:var(--gradient-accent);flex-shrink:0;transition:transform var(--transition-fast)}.sidebar-card:hover .sidebar-card-thumb{transform:scale(1.05)}.sidebar-card-content{flex:1;min-width:0}.sidebar-card-title{font-size:var(--text-sm);font-weight:600;color:var(--color-text-heading);margin-bottom:var(--space-1);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.sidebar-card-desc{font-size:var(--text-xs);color:var(--color-text-muted);line-height:1.4;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}body:has(:is(.blog-hero,.tutorials-hero,.projects-hero)){background-color:#0a0a0a;background-image:radial-gradient(circle,rgba(255,255,255,.08) 1px,transparent 1px);background-size:24px 24px}:is(.blog-hero,.tutorials-hero,.projects-hero){background:var(--color-bg-white);padding:calc(var(--header-height) + var(--space-20)) 0 var(--space-20);min-height:520px;display:flex;align-items:center;text-align:center;position:relative;overflow:hidden}:is(.blog-hero,.tutorials-hero,.projects-hero) .section-label{margin-bottom:var(--space-4)}:is(.blog-hero,.tutorials-hero,.projects-hero) .section-title{margin-bottom:var(--space-4)}:is(.blog-hero,.tutorials-hero,.projects-hero) .hero-bio-area{position:relative;display:inline-block;text-align:left;padding-left:82px;margin-top:var(--space-6);margin-bottom:var(--space-8)}:is(.blog-hero,.tutorials-hero,.projects-hero) .hero-bio-area .section-description{max-width:600px;margin:0;color:var(--color-text-primary);font-size:var(--text-base);line-height:1.8}:is(.blog-connector,.tutorials-connector,.projects-connector){position:absolute;left:0;top:-36px;width:70px;height:calc(36px + .9em);border-left:2px solid rgba(255,255,255,.45);border-bottom:2px solid rgba(255,255,255,.45)}:is(.blog-hero,.tutorials-hero,.projects-hero) .filter-pills{justify-content:center}body:has(:is(.blog-hero,.tutorials-hero,.projects-hero)) .sidebar-card{background:transparent;border-color:#222}body:has(:is(.blog-hero,.tutorials-hero,.projects-hero)) .sidebar-card:hover{border-color:#444;background:#111;transform:translate(4px)}body:has(:is(.blog-hero,.tutorials-hero,.projects-hero)) .sidebar-card.active{border-color:var(--color-accent);background:#ff6b6b14}body:has(:is(.blog-hero,.tutorials-hero,.projects-hero)) .sidebar-card-title{color:#fff}body:has(:is(.blog-hero,.tutorials-hero,.projects-hero)) .sidebar-card-desc{color:#9ca3af}body:has(:is(.blog-hero,.tutorials-hero,.projects-hero)) .filter-pill{border-color:#333;color:#9ca3af}body:has(:is(.blog-hero,.tutorials-hero,.projects-hero)) .filter-pill:hover{border-color:#fff;color:#fff}body:has(:is(.blog-hero,.tutorials-hero,.projects-hero)) .filter-pill.active{background:#fff;color:#0a0a0a;border-color:#fff}body:has(:is(.blog-hero,.tutorials-hero,.projects-hero)) .search-box{background:transparent;border-color:#333}body:has(:is(.blog-hero,.tutorials-hero,.projects-hero)) .search-box input{color:var(--color-text-primary);background:transparent}body:has(:is(.blog-hero,.tutorials-hero,.projects-hero)) .search-box input::placeholder{color:#6b7280}body:has(:is(.blog-hero,.tutorials-hero,.projects-hero)) .tag{background:#ffffff1a;color:#d1d5db;border:1px solid #333}:is(.blog-split,.tutorials-split,.projects-split){display:grid;grid-template-columns:320px 1fr;gap:var(--space-8);padding-top:var(--space-12);padding-bottom:var(--space-24)}:is(.blog-sidebar,.tutorials-sidebar,.projects-sidebar){display:flex;flex-direction:column;gap:var(--space-4)}:is(.blog-preview,.tutorials-preview,.projects-preview){position:relative;border-radius:var(--radius-sm);background:#0a0a0a;border:1px solid #222;padding:var(--space-12);min-height:380px;align-self:start;overflow:hidden;max-width:100%}:is(.blog-preview,.tutorials-preview,.projects-preview) .blob{width:300px;height:300px}:is(.blog-preview,.tutorials-preview,.projects-preview) .blob-pink{top:-60px;right:-40px;width:280px;height:280px}:is(.blog-preview,.tutorials-preview,.projects-preview) .blob-yellow{top:40px;right:100px;width:200px;height:200px}:is(.blog-preview,.tutorials-preview,.projects-preview) .blob-green{bottom:-40px;left:-20px;width:240px;height:240px}:is(.blog-preview,.tutorials-preview,.projects-preview) .blob-purple{bottom:40px;right:-20px;width:180px;height:180px}:is(.blog-preview-content,.tutorials-preview-content,.projects-preview-content){position:relative;z-index:2;transition:opacity var(--transition-base) ease}:is(.blog-preview-content,.tutorials-preview-content,.projects-preview-content).preview-fading{opacity:0}:is(.blog-preview-label,.tutorials-preview-label,.projects-preview-label){font-family:var(--font-mono);font-size:var(--text-xs);font-weight:500;color:var(--color-accent);text-transform:uppercase;letter-spacing:.05em;margin-bottom:var(--space-4)}:is(.blog-preview-title,.tutorials-preview-title,.projects-preview-title){font-size:var(--text-3xl);font-weight:700;color:#fff;margin-bottom:var(--space-4);line-height:1.3;overflow-wrap:break-word;word-break:break-word}:is(.blog-preview-desc,.tutorials-preview-desc,.projects-preview-desc){font-size:var(--text-base);color:#d1d5db;line-height:1.7;margin-bottom:var(--space-6);max-width:600px;overflow-wrap:break-word;word-break:break-word}:is(.blog-preview-meta,.tutorials-preview-meta){display:flex;align-items:center;gap:var(--space-4);margin-bottom:var(--space-4);font-size:var(--text-sm);color:#9ca3af;font-family:var(--font-mono)}:is(.blog-preview-meta,.tutorials-preview-meta) span{display:inline-flex;align-items:center;gap:var(--space-2)}:is(.blog-preview-meta,.tutorials-preview-meta) svg{width:16px;height:16px}@media(max-width:1200px){:is(.blog-split,.tutorials-split,.projects-split){grid-template-columns:280px 1fr}}@media(max-width:768px){:is(.blog-hero,.tutorials-hero,.projects-hero){min-height:auto;padding:calc(var(--header-height) + var(--space-12)) 0 var(--space-12)}:is(.blog-hero,.tutorials-hero,.projects-hero) .hero-bio-area{padding-left:0}:is(.blog-connector,.tutorials-connector,.projects-connector){display:none}:is(.blog-hero,.tutorials-hero,.projects-hero) .filter-pills{flex-wrap:wrap}:is(.blog-split,.tutorials-split,.projects-split){grid-template-columns:1fr;gap:var(--space-6)}:is(.blog-sidebar,.tutorials-sidebar,.projects-sidebar){order:2;display:grid;grid-template-columns:1fr 1fr;gap:var(--space-3);min-width:0}:is(.blog-preview,.tutorials-preview,.projects-preview){order:1;min-height:auto;padding:var(--space-8);min-width:0}:is(.blog-preview,.tutorials-preview,.projects-preview) .blob-pink{width:180px;height:180px}:is(.blog-preview,.tutorials-preview,.projects-preview) .blob-yellow{width:140px;height:140px}:is(.blog-preview,.tutorials-preview,.projects-preview) .blob-green{width:160px;height:160px}:is(.blog-preview,.tutorials-preview,.projects-preview) .blob-purple{width:120px;height:120px}}@media(max-width:480px){:is(.blog-sidebar,.tutorials-sidebar,.projects-sidebar){grid-template-columns:1fr;overflow:hidden}:is(.blog-sidebar,.tutorials-sidebar,.projects-sidebar) .sidebar-card{min-width:0}:is(.blog-preview,.tutorials-preview,.projects-preview){padding:var(--space-6)}:is(.blog-preview-title,.tutorials-preview-title,.projects-preview-title){font-size:var(--text-2xl)}:is(.blog-preview-desc,.tutorials-preview-desc,.projects-preview-desc){font-size:var(--text-sm)}}.mobile-nav-toggle{display:none;flex-direction:column;justify-content:center;gap:5px;width:32px;height:32px;background:none;border:none;padding:4px;cursor:pointer;z-index:110}.mobile-nav-toggle span{display:block;width:100%;height:2px;background:#9ca3af;border-radius:0;transition:all .3s ease}.mobile-nav-toggle.active span:nth-child(1){transform:translateY(7px) rotate(45deg);background:#fff}.mobile-nav-toggle.active span:nth-child(2){opacity:0}.mobile-nav-toggle.active span:nth-child(3){transform:translateY(-7px) rotate(-45deg);background:#fff}@media(max-width:768px){.mobile-nav-toggle{display:flex}.header-nav{position:fixed;inset:0;background:#0a0a0af7;flex-direction:column;justify-content:center;align-items:center;gap:var(--space-8);opacity:0;pointer-events:none;transition:opacity .3s ease;z-index:105}.header-nav.nav-open{opacity:1;pointer-events:auto;overscroll-behavior:contain}.header-nav a{font-size:var(--text-2xl);color:#d1d5db;text-transform:none;letter-spacing:0;font-family:var(--font-body)}.header-nav a:hover{color:#0a0a0a;background:#fff}.header-nav a.active{color:#d1d5db;background:transparent}.header-actions{display:none}}@media(max-width:768px){.footer-grid{grid-template-columns:1fr 1fr}.footer-col:first-child{grid-column:1 / -1;border-bottom:1px solid #222;padding-bottom:var(--space-6)}.footer-col:nth-child(2){border-left:none}.footer-bottom{flex-direction:column;gap:var(--space-4);text-align:center}.footer-sub-group a{max-width:100%}}@media(max-width:480px){.footer-grid{grid-template-columns:1fr}.footer-col{border-left:none;border-bottom:1px solid #222;padding:var(--space-6) 0}.footer-col:first-child{padding-top:0}.footer-col:last-child{border-bottom:none}.footer-col-title{font-size:var(--text-base)}}@media(max-width:768px){.search-box{max-width:100%}.filter-pills{width:100%;overflow-x:auto;flex-wrap:nowrap;-webkit-overflow-scrolling:touch;scrollbar-width:none}.filter-pills::-webkit-scrollbar{display:none}.filter-pill{flex-shrink:0}.terminal-chrome{max-width:100%}}@media(max-width:480px){.filter-pill{padding:6px 14px;font-size:var(--text-xs)}.search-box{padding:10px 16px}.btn{padding:12px 20px;font-size:var(--text-xs)}.section-label{font-size:var(--text-xs)}}@media(max-width:768px){.sidebar-card-thumb{width:60px;height:48px}}@media(max-width:480px){.sidebar-card-thumb{width:50px;height:40px}}@media(max-width:768px){.literary-quote{padding:var(--space-8) 0}.terminal-body{padding:var(--space-4) var(--space-5);min-height:120px}.literary-quote blockquote{font-size:var(--text-sm)}}@media(max-width:768px){.page-hero-label{font-size:var(--text-xs)}}@media(max-width:480px){.page-hero-title .hero-line-1,.page-hero-label{transform:rotate(0)}}a:focus-visible,button:focus-visible,.btn:focus-visible,.filter-pill:focus-visible,.sidebar-card:focus-visible,input:focus-visible{outline:2px solid var(--color-accent);outline-offset:2px;border-radius:var(--radius-sm)}.header-nav a:focus-visible{outline:2px solid #FFFFFF;outline-offset:4px}body{cursor:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='26' fill='none' viewBox='0 0 24 26'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M1.69 2.69a2.357 2.357 0 0 1 2.495-.54L21.47 8.632a2.357 2.357 0 0 1-.255 4.494l-7.271 1.818-1.818 7.27a2.357 2.357 0 0 1-4.494.256L1.15 5.185a2.357 2.357 0 0 1 .54-2.495Z' fill='%23fff'/%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M3.633 3.622A.786.786 0 0 0 2.62 4.633L9.103 21.92a.786.786 0 0 0 1.498-.086l2.047-8.185 8.185-2.046a.785.785 0 0 0 .086-1.498L3.633 3.622Z' fill='%23010101'/%3E%3C/svg%3E"),auto}a,button,[role=button],input[type=submit],input[type=button],select,.card,.sidebar-card,.filter-pill,.btn{cursor:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='28' height='29' fill='none' viewBox='0 0 28 29'%3E%3Cpath fill='%23fff' d='M6.84 21.83c-.47-.6-1.05-1.82-2.07-3.34-.58-.83-2.01-2.41-2.45-3.23a2.1 2.1 0 0 1-.25-1.67 2.2 2.2 0 0 1 2.39-1.67c.85.18 1.63.6 2.25 1.2.43.41.82.85 1.18 1.32.27.34.33.47.63.85.3.39.5.77.35.2-.11-.83-.31-2.23-.6-3.48-.21-.95-.26-1.1-.46-1.82s-.32-1.32-.54-2.13c-.2-.8-.35-1.62-.46-2.44a4.7 4.7 0 0 1 .43-3.08c.58-.55 1.44-.7 2.17-.37a4.4 4.4 0 0 1 1.57 2.17c.43 1.07.72 2.19.86 3.33.27 1.67.79 4.1.8 4.6 0-.61-.11-1.91 0-2.5.12-.6.54-1.1 1.12-1.33.5-.15 1.02-.19 1.53-.1.52.1.98.4 1.29.83.38.98.6 2 .63 3.05.04-.91.2-1.82.47-2.7.28-.39.68-.67 1.15-.8.55-.1 1.11-.1 1.66 0 .46.15.85.44 1.14.82.35.88.56 1.82.63 2.77 0 .23.12-.65.48-1.24a1.67 1.67 0 1 1 3.17 1.07v3.77c-.06.97-.2 1.94-.4 2.9-.29.85-.7 1.65-1.2 2.38-.8.9-1.48 1.92-1.98 3.02a6.67 6.67 0 0 0 .03 3.2c-.68.07-1.37.07-2.05 0-.65-.1-1.45-1.4-1.67-1.8a.63.63 0 0 0-1.13 0c-.37.64-1.18 1.79-1.75 1.85-1.12.14-3.42 0-5.23 0 0 0 .3-1.66-.39-2.27-.68-.6-1.38-1.3-1.9-1.76l-1.4-1.6Z'/%3E%3Cpath stroke='%23000' stroke-linecap='round' stroke-linejoin='round' stroke-width='2.25' d='M6.84 21.83c-.47-.6-1.05-1.82-2.07-3.34-.58-.83-2.01-2.41-2.45-3.23a2.1 2.1 0 0 1-.25-1.67 2.2 2.2 0 0 1 2.39-1.67c.85.18 1.63.6 2.25 1.2.43.41.82.85 1.18 1.32.27.34.33.47.63.85.3.39.5.77.35.2-.11-.83-.31-2.23-.6-3.48-.21-.95-.26-1.1-.46-1.82s-.32-1.32-.54-2.13c-.2-.8-.35-1.62-.46-2.44a4.7 4.7 0 0 1 .43-3.08c.58-.55 1.44-.7 2.17-.37a4.4 4.4 0 0 1 1.57 2.17c.43 1.07.72 2.19.86 3.33.27 1.67.79 4.1.8 4.6 0-.61-.11-1.91 0-2.5.12-.6.54-1.1 1.12-1.33.5-.15 1.02-.19 1.53-.1.52.1.98.4 1.29.83.38.98.6 2 .63 3.05.04-.91.2-1.82.47-2.7.28-.39.68-.67 1.15-.8.55-.1 1.11-.1 1.66 0 .46.15.85.44 1.14.82.35.88.56 1.82.63 2.77 0 .23.12-.65.48-1.24a1.67 1.67 0 1 1 3.17 1.07v3.77c-.06.97-.2 1.94-.4 2.9-.29.85-.7 1.65-1.2 2.38-.8.9-1.48 1.92-1.98 3.02a6.67 6.67 0 0 0 .03 3.2c-.68.07-1.37.07-2.05 0-.65-.1-1.45-1.4-1.67-1.8a.63.63 0 0 0-1.13 0c-.37.64-1.18 1.79-1.75 1.85-1.12.14-3.42 0-5.23 0 0 0 .3-1.66-.39-2.27-.68-.6-1.38-1.3-1.9-1.76l-1.4-1.6Z' clip-rule='evenodd'/%3E%3Cpath fill='%23000' d='M20.65 22.3v-6.24c0-.38-.31-.68-.7-.68-.37 0-.68.3-.68.68v6.23c0 .38.3.68.69.68.38 0 .69-.3.69-.68ZM17.2 22.3l-.04-6.25a.67.67 0 1 0-1.34.01l.04 6.24a.67.67 0 1 0 1.34 0ZM12.37 16.07l.04 6.22c0 .38.3.68.67.68.37 0 .67-.3.67-.68l-.04-6.23c0-.38-.3-.68-.67-.68-.37 0-.67.31-.67.69Z'/%3E%3C/svg%3E"),pointer}@media(hover:none),(pointer:coarse){body,a,button,[role=button],input[type=submit],input[type=button],select,.card,.sidebar-card,.filter-pill,.btn{cursor:auto}}[data-animate]{opacity:0;will-change:transform,opacity}@keyframes animate-fallback{to{opacity:1;transform:none}}html:not(.animations-ready) [data-animate]{animation:animate-fallback .5s ease 1.5s both}.no-js [data-animate]{opacity:1;transform:none}[data-animate=fade-up]{transform:translateY(40px);transition:opacity .7s cubic-bezier(.16,1,.3,1),transform .7s cubic-bezier(.16,1,.3,1)}[data-animate=fade-up].is-visible{opacity:1;transform:translateY(0)}[data-animate=fade-in]{transition:opacity .8s cubic-bezier(.16,1,.3,1)}[data-animate=fade-in].is-visible{opacity:1}[data-animate=slide-left]{transform:translate(60px);transition:opacity .7s cubic-bezier(.16,1,.3,1),transform .7s cubic-bezier(.16,1,.3,1)}[data-animate=slide-left].is-visible{opacity:1;transform:translate(0)}[data-animate=slide-right]{transform:translate(-60px);transition:opacity .7s cubic-bezier(.16,1,.3,1),transform .7s cubic-bezier(.16,1,.3,1)}[data-animate=slide-right].is-visible{opacity:1;transform:translate(0)}[data-animate=scale-in]{transform:scale(.9);transition:opacity .7s cubic-bezier(.16,1,.3,1),transform .7s cubic-bezier(.16,1,.3,1)}[data-animate=scale-in].is-visible{opacity:1;transform:scale(1)}[data-animate=text-reveal]{clip-path:inset(0 100% 0 0);opacity:1;transition:clip-path .8s cubic-bezier(.16,1,.3,1)}[data-animate=text-reveal].is-visible{clip-path:inset(0 0% 0 0)}[data-stagger]>[data-animate]:nth-child(1){transition-delay:0ms}[data-stagger]>[data-animate]:nth-child(2){transition-delay:60ms}[data-stagger]>[data-animate]:nth-child(3){transition-delay:.12s}[data-stagger]>[data-animate]:nth-child(4){transition-delay:.18s}[data-stagger]>[data-animate]:nth-child(5){transition-delay:.24s}[data-stagger]>[data-animate]:nth-child(6){transition-delay:.3s}[data-delay="100"]{transition-delay:.1s!important}[data-delay="200"]{transition-delay:.2s!important}[data-delay="300"]{transition-delay:.3s!important}[data-delay="400"]{transition-delay:.4s!important}[data-delay="500"]{transition-delay:.5s!important}[data-delay="600"]{transition-delay:.6s!important}.blob[data-parallax]{transition:transform .1s linear}.header{transition:transform .35s cubic-bezier(.16,1,.3,1),box-shadow .35s ease}.header.header-hidden{transform:translateY(-100%)}.header.header-scrolled{box-shadow:0 1px 20px #0006;border-bottom-color:#ffffff0a}.hero-content [data-animate]{transition-duration:.6s}.card,.sidebar-card,.art-card,.interest-card{transition:transform .4s cubic-bezier(.16,1,.3,1),box-shadow .4s cubic-bezier(.16,1,.3,1),border-color .2s ease}.card:hover,.art-card:hover{transform:translateY(-6px);box-shadow:0 20px 40px -12px #0000001f}.interest-card:hover{transform:translateY(-4px);box-shadow:0 12px 24px -8px #0000001a}@keyframes blob-float-1{0%,to{transform:translate(0) scale(1)}33%{transform:translate(15px,-20px) scale(1.05)}66%{transform:translate(-10px,10px) scale(.97)}}@keyframes blob-float-2{0%,to{transform:translate(0) scale(1)}33%{transform:translate(-20px,15px) scale(.95)}66%{transform:translate(12px,-8px) scale(1.03)}}@keyframes blob-float-3{0%,to{transform:translate(0) scale(1)}33%{transform:translate(10px,20px) scale(1.04)}66%{transform:translate(-15px,-12px) scale(.96)}}.blob-animated:nth-child(odd){animation:blob-float-1 12s ease-in-out infinite}.blob-animated:nth-child(2n){animation:blob-float-2 16s ease-in-out infinite}.blob-animated:nth-child(3n){animation:blob-float-3 20s ease-in-out infinite}.reading-progress{transition:width .15s linear}.header-nav a:after{display:none}.btn:active{transform:translateY(0) scale(.98);transition-duration:.1s}.rainbow-divider{background:var(--gradient-rainbow);height:3px;border-radius:0;transform:scaleX(0);transform-origin:left;transition:transform 1s cubic-bezier(.16,1,.3,1)}.rainbow-divider.is-visible{transform:scaleX(1)}@media(prefers-reduced-motion:reduce){[data-animate]{opacity:1!important;transform:none!important;clip-path:none!important;transition:none!important}.blob-animated{animation:none!important}.header{transition:none!important}.sidebar-card:hover,.sidebar-card:hover .sidebar-card-thumb,.tag:hover,.filter-pill:active,.footer-sub-group a:hover,.footer-bottom-links a:hover,.share-icon:hover,.share-icon:active,.dark-card:hover .dark-card-icon svg,.view-all-link:hover svg,.principle:hover .principle-number{transform:none!important}.toc-link:before{transition:none!important}.code-copy-btn.copied{animation:none!important}:is(.blog-preview-content,.tutorials-preview-content,.projects-preview-content){transition:none!important}:is(.blog-preview-content,.tutorials-preview-content,.projects-preview-content).preview-fading{opacity:1!important}}