:root{--bg-primary:#fff;--bg-secondary:#f8f9fa;--bg-card:#fff;--text-primary:#333;--text-secondary:#555;--text-muted:#666;--accent:#667eea;--accent-hover:#5568d3;--accent-secondary:#764ba2;--border-color:#ddd;--shadow-sm:#0000001a;--shadow-md:#00000026;--shadow-lg:#0003;--tag-bg:#f0f0f0;--tag-text:#555;--nav-bg:#fff;--nav-shadow:#0000001a;--chat-input-bg:#fff;--chat-body-bg:#f8f9fa;--chat-bot-bg:#fff;--chat-bot-border:#ddd;--attachment-bg:#f0f4ff;--attachment-border:#dce4ff}[data-theme=dark]{--bg-primary:#1a1a2e;--bg-secondary:#16213e;--bg-card:#1e2a47;--text-primary:#e0e0e0;--text-secondary:#b0b0b0;--text-muted:#a0a0a0;--accent:#7b93f5;--accent-hover:#6b83e5;--accent-secondary:#9b6fc0;--border-color:#2a2a4a;--shadow-sm:#0000004d;--shadow-md:#0006;--shadow-lg:#00000080;--tag-bg:#2a2a4a;--tag-text:silver;--nav-bg:#16213e;--nav-shadow:#0000004d;--chat-input-bg:#1e2a47;--chat-body-bg:#16213e;--chat-bot-bg:#1e2a47;--chat-bot-border:#2a2a4a;--attachment-bg:#1e2a47;--attachment-border:#2a2a4a}*{box-sizing:border-box;margin:0;padding:0}body{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;color:var(--text-primary);background:var(--bg-primary);min-width:320px;margin:0;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,Fira Sans,Droid Sans,Helvetica Neue,sans-serif;line-height:1.6;transition:background .3s,color .3s}code{font-family:source-code-pro,Menlo,Monaco,Consolas,Courier New,monospace}html{scroll-behavior:smooth}#root{min-height:100vh}.navigation{background:var(--nav-bg);box-shadow:0 2px 8px var(--nav-shadow);z-index:100;transition:background .3s,box-shadow .3s;position:sticky;top:0}.nav-container{justify-content:space-between;align-items:center;max-width:1200px;margin:0 auto;padding:1rem 2rem;display:flex}.nav-logo{color:var(--accent);font-size:1.5rem;font-weight:700;text-decoration:none;transition:color .3s}.nav-logo:hover{color:var(--accent-hover)}.nav-links{align-items:center;gap:2rem;display:flex}.nav-link{color:var(--text-primary);font-size:1rem;font-weight:500;text-decoration:none;transition:color .3s;position:relative}.nav-link:hover{color:var(--accent)}.nav-link:after{content:"";background:var(--accent);width:0;height:2px;transition:width .3s;position:absolute;bottom:-4px;left:0}.nav-link:hover:after{width:100%}.theme-toggle{border:2px solid var(--border-color);cursor:pointer;width:36px;height:36px;color:var(--text-primary);background:0 0;border-radius:8px;justify-content:center;align-items:center;padding:.4rem;transition:border-color .3s,background .3s;display:flex}.theme-toggle:hover{border-color:var(--accent);background:var(--bg-secondary)}.theme-toggle svg{fill:currentColor;width:18px;height:18px;transition:fill .3s}@media (width<=768px){.nav-container{padding:1rem}.nav-logo{font-size:1.25rem}.nav-links{gap:1rem}.nav-link{font-size:.9rem}}.footer{background:var(--bg-secondary);border-top:1px solid var(--border-color);padding:3rem 0 0;transition:background .3s,border-color .3s}.footer-container{max-width:1200px;margin:0 auto;padding:0 2rem}.footer-content{grid-template-columns:2fr 1fr 1fr;gap:3rem;padding-bottom:2rem;display:grid}.footer-section h4{color:var(--text-primary);margin-bottom:1rem;font-size:1.15rem;font-weight:700}.footer-brand{color:var(--accent)!important;font-size:1.35rem!important}.footer-tagline{color:var(--text-muted);font-size:.95rem;line-height:1.6}.footer-links{margin:0;padding:0;list-style:none}.footer-links li{margin-bottom:.6rem}.footer-links a{color:var(--text-secondary);font-size:.95rem;text-decoration:none;transition:color .3s}.footer-links a:hover{color:var(--accent)}.social-links{gap:.75rem;display:flex}.social-btn{background:var(--accent);color:#fff;border-radius:8px;justify-content:center;align-items:center;width:40px;height:40px;text-decoration:none;transition:background .3s,transform .3s;display:flex}.social-btn:hover{background:var(--accent-hover);transform:translateY(-2px)}.social-btn svg{fill:#fff;width:20px;height:20px}.footer-bottom{border-top:1px solid var(--border-color);text-align:center;padding:1.25rem 0;transition:border-color .3s}.footer-bottom p{color:var(--text-muted);margin:0;font-size:.875rem}@media (width<=768px){.footer-content{text-align:center;grid-template-columns:1fr;gap:2rem}.social-links{justify-content:center}}.home{width:100%}.hero{background:linear-gradient(135deg, var(--accent) 0%, var(--accent-secondary) 100%);color:#fff;text-align:center;padding:8rem 2rem}.hero-content h1{margin-bottom:1rem;font-size:3.5rem;font-weight:700}.tagline{opacity:.95;margin-bottom:2rem;font-size:1.5rem}.hero-buttons{flex-wrap:wrap;justify-content:center;gap:1rem;display:flex}.btn{cursor:pointer;border:none;border-radius:8px;padding:.875rem 2rem;font-size:1.1rem;font-weight:600;text-decoration:none;transition:all .3s;display:inline-block}.btn-primary{color:var(--accent);background:#fff}.btn-primary:hover{box-shadow:0 10px 20px var(--shadow-lg);transform:translateY(-2px)}.btn-secondary{color:#fff;background:0 0;border:2px solid #fff}.btn-secondary:hover{color:var(--accent);background:#fff}.container{max-width:1200px;margin:0 auto;padding:0 2rem}.bio,.projects{padding:4rem 0}.bio{background:var(--bg-secondary);transition:background .3s}.bio h2,.projects h2{text-align:center;color:var(--text-primary);margin-bottom:2rem;font-size:2.5rem}.bio-content{max-width:800px;color:var(--text-secondary);margin:0 auto;font-size:1.1rem;line-height:1.8}.skills-container{border:2px solid var(--accent);background:var(--bg-card);border-radius:12px;margin-top:2rem;padding:1.25rem;transition:background .3s,border-color .3s}.skills-header{justify-content:space-between;align-items:center;margin-bottom:1rem;display:flex}.skills-header h3{color:var(--text-primary);margin:0;font-size:1.5rem}.skills-toggle-btn{background:var(--accent);color:#fff;cursor:pointer;white-space:nowrap;border:none;border-radius:20px;padding:.4rem 1rem;font-size:.9rem;font-weight:600;transition:background .3s}.skills-toggle-btn:hover{background:var(--accent-hover)}.skill-tags{flex-wrap:wrap;gap:.75rem;display:flex}.skill-tags-collapsed{max-height:6.5rem;overflow:hidden}.skill-tag{background:var(--accent);color:#fff;border-radius:20px;padding:.5rem 1rem;font-size:.95rem;font-weight:500}.projects{background:var(--bg-primary);transition:background .3s}.projects-container{border:2px solid var(--accent);background:var(--bg-card);border-radius:12px;max-width:800px;margin:2rem auto 0;padding:1.25rem;transition:background .3s,border-color .3s}.projects-header{justify-content:space-between;align-items:center;margin-bottom:1rem;display:flex}.projects-header h3{color:var(--text-primary);margin:0;font-size:1.5rem}.projects-toggle-btn{background:var(--accent);color:#fff;cursor:pointer;white-space:nowrap;border:none;border-radius:20px;padding:.4rem 1rem;font-size:.9rem;font-weight:600;transition:background .3s}.projects-toggle-btn:hover{background:var(--accent-hover)}.projects-grid{grid-template-columns:repeat(2,1fr);gap:1.25rem;display:grid}.projects-grid-collapsed{max-height:280px;overflow:hidden}.project-card{background:var(--bg-secondary);box-shadow:0 4px 6px var(--shadow-sm);border-radius:12px;padding:1.5rem;transition:transform .3s,box-shadow .3s,background .3s}.project-card:hover{box-shadow:0 10px 20px var(--shadow-md);transform:translateY(-5px)}.project-card h3{color:var(--accent);margin-bottom:.75rem;font-size:1.25rem}.project-card p{color:var(--text-muted);margin-bottom:.75rem;font-size:.95rem;line-height:1.6}.tech-stack{flex-wrap:wrap;gap:.5rem;display:flex}.tech-badge{background:var(--tag-bg);color:var(--tag-text);border-radius:12px;padding:.25rem .75rem;font-size:.85rem;transition:background .3s,color .3s}.chat-overlay{z-index:1000;background:#00000080;justify-content:center;align-items:center;display:flex;position:fixed;inset:0}.chat-widget{background:var(--bg-card);border-radius:12px;flex-direction:column;width:90%;max-width:500px;height:600px;transition:background .3s;display:flex;box-shadow:0 20px 60px #0000004d}.chat-header{background:var(--accent);color:#fff;border-radius:12px 12px 0 0;justify-content:space-between;align-items:center;padding:1rem;display:flex}.chat-header h3{margin:0;font-size:1.25rem}.close-btn{color:#fff;cursor:pointer;background:0 0;border:none;width:32px;height:32px;padding:0;font-size:2rem;line-height:1}.close-btn:hover{opacity:.8}.chat-body{background:var(--chat-body-bg);flex:1;padding:1.5rem;transition:background .3s;overflow-y:auto}.chat-placeholder{text-align:center;color:var(--text-muted);padding:2rem}.captcha-wrapper{justify-content:center;margin:1.5rem 0 .5rem;display:flex}.captcha-success{color:#27ae60;margin-top:.75rem;font-size:.9rem}.chat-note{color:var(--text-muted);margin-top:1rem;font-size:.875rem}.chat-message{word-wrap:break-word;border-radius:12px;max-width:80%;margin-bottom:.75rem;padding:.75rem 1rem}.chat-message-user{background:var(--accent);color:#fff;margin-left:auto}.chat-message-bot{background:var(--chat-bot-bg);color:var(--text-primary);border:1px solid var(--chat-bot-border);transition:background .3s,border-color .3s}.chat-message-context{color:var(--text-muted);background:0 0;border:none;padding:.3rem .75rem;font-size:.85rem;font-style:italic}.chat-input{border-top:1px solid var(--border-color);background:var(--chat-input-bg);border-radius:0 0 12px 12px;padding:1rem;transition:background .3s,border-color .3s;display:flex}.chat-input input{border:1px solid var(--border-color);background:var(--bg-primary);color:var(--text-primary);border-radius:8px;flex:1;margin-right:.5rem;padding:.75rem;font-size:1rem;transition:background .3s,border-color .3s,color .3s}.chat-thinking{color:var(--text-muted);align-items:center;gap:.4rem;padding:.5rem .75rem;font-size:.9rem;font-style:italic;display:flex}.thinking-dot{background:var(--accent);border-radius:50%;width:7px;height:7px;animation:1.2s ease-in-out infinite thinking-bounce;display:inline-block}.thinking-dot:first-child{animation-delay:0s}.thinking-dot:nth-child(2){animation-delay:.2s}.thinking-dot:nth-child(3){animation-delay:.4s}@keyframes thinking-bounce{0%,80%,to{opacity:.5;transform:scale(.7)}40%{opacity:1;transform:scale(1)}}.chat-attachment-bar{background:var(--attachment-bg);border-top:1px solid var(--attachment-border);color:var(--text-secondary);align-items:center;gap:.4rem;padding:.4rem 1rem;font-size:.875rem;transition:background .3s,border-color .3s;display:flex}.attachment-icon{font-size:1rem}.attachment-name{text-overflow:ellipsis;white-space:nowrap;flex:1;overflow:hidden}.attachment-remove{color:var(--text-muted);cursor:pointer;background:0 0;border:none;padding:0 .25rem;font-size:1.2rem;line-height:1}.attachment-remove:hover{color:#e74c3c}.attach-btn{border:1px solid var(--border-color);cursor:pointer;background:0 0;border-radius:8px;margin-right:.4rem;padding:.6rem .7rem;font-size:1.1rem;transition:background .2s}.attach-btn:hover{background:var(--attachment-bg)}.send-btn{background:var(--accent);color:#fff;cursor:pointer;border:none;border-radius:8px;padding:.75rem 1.5rem;font-weight:600;transition:background .3s}.send-btn:hover{background:var(--accent-hover)}@media (width<=768px){.hero-content h1{font-size:2.5rem}.tagline{font-size:1.2rem}.projects-grid{grid-template-columns:1fr}.chat-widget{width:95%;height:90%}}.see-architecture-link{color:var(--accent);cursor:pointer;margin-top:1rem;font-size:.9rem;font-weight:600;text-decoration:none;transition:color .2s,letter-spacing .2s;display:inline-block}.see-architecture-link:hover{color:var(--accent-secondary);letter-spacing:.03em;text-decoration:underline}.arch-overlay{z-index:2000;background:#000000b3;justify-content:center;align-items:center;animation:.25s ease-out archFadeIn;display:flex;position:fixed;inset:0}@keyframes archFadeIn{0%{opacity:0}to{opacity:1}}.arch-modal{background:#0a0a1a;border-radius:16px;flex-direction:column;width:88vw;max-width:1400px;height:85vh;animation:.3s ease-out archSlideIn;display:flex;position:relative;overflow:hidden;box-shadow:0 0 0 1px #667eea40,0 25px 80px #0009}@keyframes archSlideIn{0%{opacity:0;transform:scale(.95)translateY(20px)}to{opacity:1;transform:scale(1)translateY(0)}}.arch-header{background:#0f0f23f2;border-bottom:1px solid #667eea33;flex-shrink:0;align-items:center;padding:14px 20px;display:flex}.arch-header h3{color:#e0e0f0;letter-spacing:.02em;margin:0;font-size:16px;font-weight:600}.arch-controls-hint{color:#779;margin-left:auto;margin-right:16px;font-size:12px}.arch-close-btn{color:#aaa;cursor:pointer;background:0 0;border:1px solid #ffffff26;border-radius:8px;flex-shrink:0;justify-content:center;align-items:center;width:34px;height:34px;font-size:22px;line-height:1;transition:all .15s;display:flex}.arch-close-btn:hover{color:#ef5350;background:#ef535026;border-color:#ef535066}.arch-canvas-container{flex:1;position:relative;overflow:hidden}@media (width<=768px){.arch-modal{border-radius:10px;width:96vw;height:90vh}.arch-controls-hint{display:none}.arch-header h3{font-size:14px}}.blog{background:var(--bg-secondary);min-height:100vh;transition:background .3s}.blog-header{background:linear-gradient(135deg, var(--accent) 0%, var(--accent-secondary) 100%);color:#fff;text-align:center;padding:5rem 2rem 4rem}.blog-header h1{margin-bottom:1rem;font-size:3rem;font-weight:700}.blog-header p{opacity:.95;font-size:1.25rem}.blog-content{padding:4rem 0}.posts-list{max-width:800px;margin:0 auto}.blog-post{background:var(--bg-card);box-shadow:0 2px 8px var(--shadow-sm);border-radius:12px;margin-bottom:2rem;padding:2.5rem;transition:transform .3s,box-shadow .3s,background .3s}.blog-post:hover{box-shadow:0 8px 16px var(--shadow-md);transform:translateY(-3px)}.post-meta{margin-bottom:1rem}.post-date{color:var(--accent);font-size:.95rem;font-weight:600}.blog-post h2{color:var(--text-primary);margin-bottom:1rem;font-size:1.75rem}.post-excerpt{color:var(--text-muted);margin-bottom:1.5rem;font-size:1.05rem;line-height:1.7}.post-tags{flex-wrap:wrap;gap:.5rem;margin-bottom:1.5rem;display:flex}.tag{background:var(--tag-bg);color:var(--tag-text);border-radius:16px;padding:.375rem .875rem;font-size:.85rem;font-weight:500;transition:background .3s,color .3s}.read-more{color:var(--accent);cursor:pointer;background:0 0;border:none;padding:0;font-size:1rem;font-weight:600;transition:color .3s}.read-more:hover{color:var(--accent-hover);text-decoration:underline}@media (width<=768px){.blog-header h1{font-size:2.25rem}.blog-header p{font-size:1.1rem}.blog-post{padding:1.5rem}.blog-post h2{font-size:1.5rem}}.App{background:var(--bg-primary);min-height:100vh;transition:background .3s}