:root{--bg-primary: #0a0a0f;--bg-secondary: #12121a;--bg-tertiary: #1a1a25;--text-color: #eaeaf0;--text-muted: #8888a0;--text-subtle: #5a5a72;--accent-color: #4ade80;--accent-secondary: #22c55e;--accent-glow: rgba(74, 222, 128, .25);--accent-dim: rgba(74, 222, 128, .08);--surface-color: rgba(255, 255, 255, .03);--surface-hover: rgba(255, 255, 255, .06);--border-color: rgba(255, 255, 255, .06);--border-hover: rgba(255, 255, 255, .12);--nav-glass-bg: rgba(10, 10, 15, .8);--nav-text: #eaeaf0;--card-bg: rgba(255, 255, 255, .025);--card-border: rgba(255, 255, 255, .06);--card-hover-border: rgba(74, 222, 128, .2);--font-heading: "Outfit", sans-serif;--font-body: "Inter", sans-serif;--shadow-sm: 0 2px 8px rgba(0, 0, 0, .3);--shadow-md: 0 8px 24px rgba(0, 0, 0, .4);--shadow-lg: 0 16px 48px rgba(0, 0, 0, .5);--shadow-glow: 0 0 20px var(--accent-glow);--radius-sm: 8px;--radius-md: 12px;--radius-lg: 16px;--radius-xl: 24px;--transition-fast: .15s ease;--transition-base: .3s cubic-bezier(.16, 1, .3, 1);--transition-slow: .5s cubic-bezier(.16, 1, .3, 1)}.theme-light{--bg-primary: #f5f5f7;--bg-secondary: #ffffff;--bg-tertiary: #eeeef2;--text-color: #1a1a2e;--text-muted: #555570;--text-subtle: #8888a0;--accent-color: #16a34a;--accent-secondary: #15803d;--accent-glow: rgba(22, 163, 74, .2);--accent-dim: rgba(22, 163, 74, .06);--surface-color: rgba(0, 0, 0, .02);--surface-hover: rgba(0, 0, 0, .04);--border-color: rgba(0, 0, 0, .08);--border-hover: rgba(0, 0, 0, .14);--nav-glass-bg: rgba(245, 245, 247, .85);--nav-text: #1a1a2e;--card-bg: #ffffff;--card-border: rgba(0, 0, 0, .06);--card-hover-border: rgba(22, 163, 74, .3);--shadow-sm: 0 2px 8px rgba(0, 0, 0, .06);--shadow-md: 0 8px 24px rgba(0, 0, 0, .08);--shadow-lg: 0 16px 48px rgba(0, 0, 0, .1);--shadow-glow: 0 0 20px var(--accent-glow)}*,*:before,*:after{margin:0;padding:0;box-sizing:border-box}*:focus-visible{outline:2px solid var(--accent-color);outline-offset:4px}html{scroll-behavior:smooth}body{font-family:var(--font-body);background-color:var(--bg-primary);color:var(--text-color);transition:background-color .4s ease,color .4s ease;min-height:100vh;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;line-height:1.7}h1,h2,h3,h4,h5,h6{font-family:var(--font-heading);font-weight:700;letter-spacing:-.025em;line-height:1.2}p{max-width:68ch;line-height:1.8}a{color:var(--accent-color);text-decoration:none;transition:color var(--transition-fast)}a:hover{color:var(--accent-secondary)}img{max-width:100%;display:block}@keyframes fadeInUp{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}@keyframes scaleIn{0%{opacity:0;transform:scale(.95)}to{opacity:1;transform:scale(1)}}@keyframes shimmer{0%{background-position:-200% 0}to{background-position:200% 0}}@keyframes slideInLeft{0%{opacity:0;transform:translate(-30px)}to{opacity:1;transform:translate(0)}}@keyframes float{0%,to{transform:translateY(0)}50%{transform:translateY(-6px)}}@keyframes pulse-glow{0%,to{box-shadow:0 0 8px var(--accent-glow)}50%{box-shadow:0 0 20px var(--accent-glow)}}.fade-in{animation:fadeInUp .6s var(--transition-base) forwards}.fade-in-delay-1{animation-delay:.1s;opacity:0}.fade-in-delay-2{animation-delay:.2s;opacity:0}.fade-in-delay-3{animation-delay:.3s;opacity:0}.fade-in-delay-4{animation-delay:.4s;opacity:0}.app-container{display:flex;flex-direction:column;min-height:100vh}.main-content{flex:1;width:100%}.container{max-width:1100px;margin:0 auto;padding:2rem}.section-padding{padding:5rem 2rem}nav{position:sticky;top:0;width:100%;backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);background-color:var(--nav-glass-bg);border-bottom:1px solid var(--border-color);z-index:100;padding:.75rem 2rem;display:flex;justify-content:space-between;align-items:center;transition:background-color .4s ease,border-color .4s ease}.nav-brand a{font-weight:800;font-size:1.25rem;text-decoration:none;color:var(--nav-text);font-family:var(--font-heading);letter-spacing:-.02em}.desktop-theme-toggle{display:block}.mobile-theme-item{display:none}.mobile-menu-toggle{display:none;background:none;border:none;cursor:pointer;padding:.5rem;z-index:101}.mobile-menu-toggle .bar{display:block;width:24px;height:2px;margin:5px auto;transition:all .3s ease-in-out;background-color:var(--nav-text);border-radius:2px}.nav-links{display:flex;gap:2.5rem;list-style:none;align-items:center}.nav-links a{color:var(--nav-text);text-decoration:none;font-weight:500;font-size:.9rem;position:relative;transition:color var(--transition-fast);letter-spacing:.01em}.nav-links a:after{content:"";position:absolute;width:0;height:2px;bottom:-4px;left:0;background-color:var(--accent-color);transition:width var(--transition-base);border-radius:1px}.nav-links a:hover,.nav-links a.active{color:var(--accent-color)}.nav-links a:hover:after,.nav-links a.active:after{width:100%}.theme-toggle{background:var(--surface-color);border:1px solid var(--border-color);color:var(--text-color);padding:.35rem .9rem;border-radius:9999px;cursor:pointer;transition:all var(--transition-base);font-size:1rem;display:flex;align-items:center;justify-content:center;line-height:1}.theme-toggle:hover{transform:translateY(-2px);border-color:var(--accent-color);box-shadow:var(--shadow-glow)}.bento-grid{display:grid;gap:1.25rem;grid-template-columns:repeat(12,1fr)}.bento-cell{background:var(--card-bg);border:1px solid var(--card-border);border-radius:var(--radius-lg);padding:2rem;transition:all var(--transition-base);position:relative;overflow:hidden}.bento-cell:hover{border-color:var(--card-hover-border);transform:translateY(-2px);box-shadow:var(--shadow-md)}.bento-cell.span-4{grid-column:span 4}.bento-cell.span-5{grid-column:span 5}.bento-cell.span-6{grid-column:span 6}.bento-cell.span-7{grid-column:span 7}.bento-cell.span-8{grid-column:span 8}.bento-cell.span-12{grid-column:span 12}.card{background:var(--card-bg);border:1px solid var(--card-border);border-radius:var(--radius-lg);padding:1.75rem;transition:all var(--transition-base)}.card:hover{border-color:var(--card-hover-border);transform:translateY(-3px);box-shadow:var(--shadow-md)}.featured-card{display:grid;grid-template-columns:minmax(200px,280px) 1fr;gap:2rem;align-items:start}.section-header{text-align:center;margin-bottom:3rem}.section-title{font-size:2.5rem;margin-bottom:1rem;position:relative;display:inline-block;color:var(--text-color)}.section-title:after{content:"";position:absolute;bottom:-.5rem;left:50%;transform:translate(-50%);width:48px;height:3px;background:linear-gradient(90deg,var(--accent-color),var(--accent-secondary));border-radius:2px}.section-subtitle{color:var(--text-muted);font-size:1.1rem;max-width:55ch;margin:0 auto;line-height:1.7}.hero-title{font-size:clamp(2rem,5vw,3.5rem);color:var(--text-color);margin-bottom:.5rem;letter-spacing:-.03em}.hero-subtitle{color:var(--accent-color);font-family:var(--font-heading);font-weight:600;font-size:1rem;letter-spacing:.15em;text-transform:uppercase;margin-bottom:1rem}.hero-description{color:var(--text-muted);font-size:1.1rem;line-height:1.8;max-width:55ch}.btn-primary{background:var(--accent-color);color:#0a0a0f;border:2px solid var(--accent-color);padding:.8rem 2.2rem;border-radius:var(--radius-sm);font-weight:700;font-family:var(--font-heading);font-size:.95rem;cursor:pointer;text-decoration:none;display:inline-flex;align-items:center;gap:.5rem;transition:all var(--transition-fast);box-shadow:0 4px 14px var(--accent-glow)}.btn-primary:hover{background:var(--accent-secondary);border-color:var(--accent-secondary);transform:translateY(-2px);box-shadow:0 8px 24px var(--accent-glow);color:#0a0a0f}.btn-primary:active{transform:translateY(0)}.btn-outline{background:transparent;color:var(--text-color);border:2px solid var(--border-hover);padding:.8rem 2.2rem;border-radius:var(--radius-sm);font-weight:600;font-family:var(--font-heading);font-size:.95rem;cursor:pointer;text-decoration:none;display:inline-flex;align-items:center;gap:.5rem;transition:all var(--transition-fast)}.btn-outline:hover{border-color:var(--accent-color);color:var(--accent-color);background:var(--accent-dim)}.btn-icon{background:var(--surface-color);border:1px solid var(--border-color);color:var(--text-muted);width:40px;height:40px;border-radius:var(--radius-sm);display:inline-flex;align-items:center;justify-content:center;cursor:pointer;transition:all var(--transition-fast);text-decoration:none}.btn-icon:hover{border-color:var(--accent-color);color:var(--accent-color);background:var(--accent-dim);transform:translateY(-2px)}.tag{background:var(--accent-dim);border:1px solid rgba(74,222,128,.15);padding:.3rem .85rem;border-radius:9999px;font-size:.8rem;font-weight:500;color:var(--accent-color);display:inline-block;margin-right:.4rem;margin-bottom:.4rem;transition:all var(--transition-fast)}.tag:hover{background:#4ade8026;border-color:var(--accent-color)}.tag-custom{background:transparent;border:1px solid currentColor;padding:.3rem .85rem;border-radius:9999px;font-size:.8rem;font-weight:500;display:inline-block;margin-right:.4rem;margin-bottom:.4rem}.grid-2{display:grid;grid-template-columns:repeat(2,1fr);gap:1.5rem}.grid-3{display:grid;grid-template-columns:repeat(3,1fr);gap:1.5rem}.hero-section{min-height:calc(100vh - 60px);display:flex;align-items:center;padding:4rem 2rem}.hero-bento{max-width:1100px;margin:0 auto;width:100%}.hero-bento .bento-grid{grid-template-rows:auto auto}.avatar-container{display:flex;justify-content:center;align-items:center}.avatar-container img{width:180px;height:180px;border-radius:50%;object-fit:cover;border:4px solid var(--accent-dim);box-shadow:var(--shadow-md),0 0 30px var(--accent-glow);transition:transform var(--transition-base)}.avatar-container img:hover{transform:scale(1.05)}.hero-intro{display:flex;flex-direction:column;justify-content:center;gap:1rem}.hero-cta-row{display:flex;gap:1rem;margin-top:1.5rem;flex-wrap:wrap}.hero-stat-cell{display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;gap:.5rem}.hero-stat-value{font-family:var(--font-heading);font-size:2rem;font-weight:800;color:var(--accent-color)}.hero-stat-label{font-size:.85rem;color:var(--text-muted);text-transform:uppercase;letter-spacing:.1em}.projects-page{padding:4rem 2rem;max-width:1100px;margin:0 auto}.projects-bento{display:grid;grid-template-columns:repeat(2,1fr);gap:1.25rem;margin-top:2rem}.project-block{background:var(--card-bg);border:1px solid var(--card-border);border-radius:var(--radius-lg);overflow:hidden;position:relative;cursor:pointer;transition:all var(--transition-base)}.project-block:hover{border-color:var(--card-hover-border);transform:translateY(-4px);box-shadow:var(--shadow-lg)}.project-block-thumb{width:100%;height:220px;object-fit:cover;transition:transform var(--transition-slow)}.project-block:hover .project-block-thumb{transform:scale(1.03)}.project-block-body{padding:1.5rem}.project-block-title{font-size:1.35rem;margin-bottom:.5rem;color:var(--text-color)}.project-block-subtitle{font-size:.85rem;color:var(--accent-color);margin-bottom:.75rem}.project-block-desc{color:var(--text-muted);font-size:.92rem;line-height:1.7;margin-bottom:1rem}.project-block-tags{display:flex;flex-wrap:wrap;gap:.4rem;margin-bottom:1rem}.project-block-links{display:flex;gap:.5rem}.project-overlay{position:absolute;top:0;right:0;bottom:0;left:0;background:linear-gradient(to top,rgba(10,10,15,.95) 40%,transparent 100%);display:flex;flex-direction:column;justify-content:flex-end;padding:1.5rem;opacity:0;transition:opacity var(--transition-base);pointer-events:none}.project-block:hover .project-overlay{opacity:1;pointer-events:auto}.project-overlay-desc{color:#ddd;font-size:.9rem;line-height:1.7;margin-bottom:1rem;max-width:68ch}.project-block.full-width{grid-column:span 2}.project-block.full-width .project-block-thumb{height:280px}.lightbox-overlay{position:fixed;top:0;right:0;bottom:0;left:0;background:#000000eb;z-index:1000;display:flex;justify-content:center;align-items:center;padding:2rem;animation:fadeInUp .2s ease}.lightbox-overlay img{max-width:90%;max-height:90vh;object-fit:contain;border-radius:var(--radius-md);box-shadow:var(--shadow-lg)}.lightbox-close{position:absolute;top:2rem;right:3rem;font-size:2.5rem;color:#fff;cursor:pointer;background:none;border:none;transition:transform var(--transition-fast)}.lightbox-close:hover{transform:scale(1.2)}.skills-page{padding:4rem 2rem;max-width:1100px;margin:0 auto}.skills-category{margin-bottom:3rem}.skills-category-title{font-size:1rem;font-weight:600;color:var(--text-muted);text-transform:uppercase;letter-spacing:.12em;margin-bottom:1.25rem;padding-bottom:.5rem;border-bottom:1px solid var(--border-color)}.skills-category-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(130px,1fr));gap:1rem}.skill-card{background:var(--card-bg);border:1px solid var(--card-border);border-radius:var(--radius-md);padding:1.5rem 1rem;text-align:center;transition:all var(--transition-base);display:flex;flex-direction:column;align-items:center;gap:.75rem}.skill-card:hover{border-color:var(--card-hover-border);transform:translateY(-3px);box-shadow:var(--shadow-md);background:var(--surface-hover)}.skill-card img{width:48px;height:48px;object-fit:contain}.skill-card.core img{width:64px;height:64px}.skill-card.core{padding:2rem 1.25rem;border-color:var(--accent-dim);background:var(--accent-dim)}.skill-card.core:hover{box-shadow:var(--shadow-glow)}.skill-card-name{font-size:.85rem;font-weight:600;color:var(--text-color)}.skill-card.core .skill-card-name{font-size:1rem}.skills-category.core-stack .skills-category-grid{grid-template-columns:repeat(auto-fill,minmax(160px,1fr))}.movies-page{padding:4rem 2rem;max-width:1100px;margin:0 auto}.media-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:1.25rem;margin-top:1.5rem}.media-card{background:var(--card-bg);border:1px solid var(--card-border);border-radius:var(--radius-lg);overflow:hidden;transition:all var(--transition-base);text-decoration:none;color:var(--text-color);display:flex;flex-direction:column}.media-card:hover{border-color:var(--card-hover-border);transform:translateY(-4px);box-shadow:var(--shadow-md);color:var(--text-color)}.media-card img{width:100%;height:280px;object-fit:cover}.media-card-body{padding:1rem 1.25rem}.media-card-title{font-size:1rem;margin-bottom:.25rem;font-weight:600}.media-card-meta{color:var(--text-muted);font-size:.85rem}.section-divider{border:none;border-top:1px solid var(--border-color);margin:3rem 0}.music-books-page{padding:4rem 2rem;max-width:1100px;margin:0 auto}.iframe-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:1.5rem;margin-top:1.5rem}.iframe-wrapper{border-radius:var(--radius-lg);overflow:hidden;border:1px solid var(--card-border);box-shadow:var(--shadow-sm);background:var(--card-bg);aspect-ratio:16 / 10}.iframe-wrapper iframe{width:100%;height:100%;border:none;display:block}.books-mode-toggle{display:flex;align-items:center;gap:.75rem;margin-bottom:2rem;justify-content:center}.books-mode-toggle span{font-size:.9rem;color:var(--text-muted);font-weight:500}.books-mode-toggle span.active-mode{color:var(--accent-color);font-weight:700}.toggle-switch{position:relative;width:52px;height:28px;background:var(--surface-color);border:1px solid var(--border-color);border-radius:9999px;cursor:pointer;transition:all var(--transition-base)}.toggle-switch:after{content:"";position:absolute;top:3px;left:3px;width:20px;height:20px;border-radius:50%;background:var(--accent-color);transition:transform var(--transition-base);box-shadow:0 2px 4px #0003}.toggle-switch.night:after{transform:translate(24px)}.toggle-switch.night{background:var(--bg-tertiary);border-color:var(--accent-dim)}footer{background:var(--bg-secondary);border-top:1px solid var(--border-color);color:var(--text-muted);padding:3rem 2rem;text-align:center;margin-top:auto}footer p{margin:0 auto}.footer-links{margin-top:.5rem}.footer-links a{color:var(--accent-color);text-decoration:none;font-weight:500}.footer-links a:hover{text-decoration:underline}.footer-socials{list-style:none;display:flex;justify-content:center;gap:.75rem;margin-top:1.5rem;padding:0}.footer-socials li a{display:flex;align-items:center;justify-content:center;width:42px;height:42px;border-radius:var(--radius-sm);background:var(--surface-color);border:1px solid var(--border-color);color:var(--text-muted);transition:all var(--transition-base)}.footer-socials li a:hover{border-color:var(--accent-color);color:var(--accent-color);background:var(--accent-dim);transform:translateY(-3px);box-shadow:var(--shadow-glow)}.footer-socials svg{width:20px;height:20px;fill:currentColor}@media (max-width: 992px){.bento-grid{grid-template-columns:repeat(6,1fr)}.bento-cell.span-4,.bento-cell.span-5{grid-column:span 3}.bento-cell.span-6,.bento-cell.span-7,.bento-cell.span-8{grid-column:span 6}.projects-bento{grid-template-columns:1fr}.project-block.full-width{grid-column:span 1}.nav-links{gap:1.5rem}}@media (max-width: 768px){nav{padding:.75rem 1.25rem}.desktop-theme-toggle{display:none}.mobile-menu-toggle{display:block}.mobile-theme-item{display:block;margin-top:1rem}.mobile-menu-toggle .bar.open:nth-child(2){opacity:0}.mobile-menu-toggle .bar.open:nth-child(1){transform:translateY(7px) rotate(45deg)}.mobile-menu-toggle .bar.open:nth-child(3){transform:translateY(-7px) rotate(-45deg)}.nav-links{position:fixed;left:-100%;top:56px;flex-direction:column;background-color:var(--nav-glass-bg);backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);width:100%;height:calc(100vh - 56px);text-align:center;transition:.3s ease;box-shadow:var(--shadow-lg);padding:2rem 0;gap:1.5rem;z-index:99;border-top:1px solid var(--border-color)}.nav-links.active{left:0}.nav-links a{font-size:1.15rem;display:block;width:100%}.bento-grid{grid-template-columns:1fr}.bento-cell.span-4,.bento-cell.span-5,.bento-cell.span-6,.bento-cell.span-7,.bento-cell.span-8,.bento-cell.span-12{grid-column:span 1}.hero-section{min-height:auto;padding:3rem 1.5rem}.hero-title,.section-title{font-size:2rem}.featured-card{grid-template-columns:1fr;gap:1.5rem}.featured-card img{max-width:280px;margin:0 auto}.grid-2,.iframe-grid{grid-template-columns:1fr}.avatar-container img{width:140px;height:140px}.projects-page,.skills-page,.movies-page,.music-books-page{padding:2.5rem 1.25rem}.project-overlay{position:static;opacity:1;pointer-events:auto;background:none;padding:0 1.5rem 1.5rem}.project-block-body{display:none}}@media (max-width: 480px){.grid-3,.media-grid{grid-template-columns:1fr}.hero-cta-row{flex-direction:column}.btn-primary,.btn-outline{width:100%;justify-content:center}.hero-title{font-size:1.75rem}.section-title{font-size:1.6rem}}