body{font-family:var(--font-sans);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;background-color:var(--bg-page);color:var(--color-text);transition:background-color var(--transition-base), color var(--transition-base);margin:0}code{font-family:var(--font-mono)}.navbar{padding:var(--space-4) var(--space-8);background-color:var(--bg-nav);color:#fff;box-shadow:var(--shadow-md);z-index:200;transition:background-color var(--transition-base);justify-content:space-between;align-items:center;display:flex;position:sticky;top:0}.logo h1{color:#fff;font-size:1.25rem;font-weight:700}.navbar-right{align-items:center;gap:var(--space-4);display:flex}.nav-links{align-items:center;gap:var(--space-2);list-style:none;display:flex}.nav-links li{margin-left:var(--space-2)}.nav-links a,.nav-links button{color:#fffc;transition:color var(--transition-fast);padding:var(--space-2) var(--space-3);cursor:pointer;background:0 0;border:none;border-radius:4px;font-size:.95rem;font-weight:500;text-decoration:none;display:inline-block;position:relative}.nav-links a:hover,.nav-links button:hover{color:#fff;text-decoration:none}.nav-links a.active{color:var(--color-accent)}.nav-links a.active:after{content:"";bottom:-2px;left:var(--space-3);right:var(--space-3);background-color:var(--color-accent);border-radius:2px;height:2px;position:absolute}.dropdown-container{align-items:center;display:flex;position:relative}.dropdown-container.active .dropdown-trigger{color:var(--color-accent)}.dropdown-trigger{align-items:center;gap:var(--space-1);display:flex}.dropdown-menu{top:calc(100% + var(--space-2));background-color:var(--bg-nav);box-shadow:var(--shadow-md);border:1px solid var(--color-border);z-index:300;min-width:140px;padding:var(--space-2) 0;border-radius:6px;list-style:none;position:absolute;left:0}[data-theme=dark] .dropdown-menu{border-color:var(--color-border);background-color:#1e293b}.dropdown-menu li{width:100%;margin:0}.dropdown-menu a{text-align:left;width:100%;padding:var(--space-2) var(--space-4);white-space:nowrap;color:#fffc;transition:background-color var(--transition-fast), color var(--transition-fast);display:block}.dropdown-menu a:hover{color:#fff;background-color:#ffffff1a;text-decoration:none}.dropdown-menu a.active{color:var(--color-accent)}.dropdown-menu a.active:after{display:none}.theme-toggle{color:#fff;cursor:pointer;width:36px;height:36px;transition:background-color var(--transition-fast), border-color var(--transition-fast);background:0 0;border:1px solid #ffffff4d;border-radius:50%;flex-shrink:0;justify-content:center;align-items:center;padding:0;font-size:1rem;display:flex}.theme-toggle:hover{background-color:#ffffff26;border-color:#fff9}@media (width<=768px){.navbar{padding:var(--space-4);gap:var(--space-3);flex-direction:column}.logo{justify-content:space-between;align-items:center;width:100%;display:flex}.navbar-right{flex-wrap:wrap;justify-content:center;width:100%}.nav-links{justify-content:center;gap:var(--space-1);flex-wrap:wrap;width:100%}.nav-links li{margin:0}.dropdown-menu{left:50%;transform:translate(-50%)}}.hero{background-color:var(--bg-page);background-image:linear-gradient(160deg, var(--bg-page) 0%, var(--bg-subtle) 100%);padding:5rem var(--space-8) 4.5rem;margin:calc(-1 * var(--space-8));margin-bottom:0;position:relative;overflow:hidden}.hero:before{content:"";background-image:radial-gradient(circle at 1px 1px, var(--color-border) 1px, transparent 0);opacity:.5;pointer-events:none;background-size:28px 28px;position:absolute;inset:0}.hero-inner{z-index:1;align-items:center;gap:var(--space-8);max-width:820px;margin:0 auto;display:flex;position:relative}.hero-text{flex:1;min-width:0}.hero-greeting{color:var(--color-muted);margin-bottom:var(--space-2);font-size:1.1rem;font-weight:500;animation:.45s both fadeInUp}.hero-name{background:linear-gradient(130deg, var(--color-primary) 30%, var(--color-accent) 100%);-webkit-text-fill-color:transparent;margin-bottom:var(--space-3);-webkit-background-clip:text;background-clip:text;font-size:clamp(2.4rem,5.5vw,3.8rem);font-weight:700;line-height:1.1;animation:.45s 80ms both fadeInUp}.hero-subtitle{color:var(--color-muted);letter-spacing:.02em;margin-bottom:var(--space-8);font-size:1rem;font-weight:500;animation:.45s .16s both fadeInUp}.hero-ctas{gap:var(--space-3);flex-wrap:wrap;animation:.45s .24s both fadeInUp;display:flex}.hero-photo{aspect-ratio:3/4;width:260px;box-shadow:0 0 0 .5px var(--color-accent), 0 8px 32px #00000026;border-radius:16px;flex-shrink:0;animation:.5s .1s both fadeInUp;overflow:hidden}[data-theme=dark] .hero{background-image:none}[data-theme=dark] .hero-photo{box-shadow:0 0 0 .5px var(--color-accent), 0 8px 32px #00000059}.hero-photo img{object-fit:cover;object-position:55% top;width:100%;height:100%;display:block}.about-section{padding-top:var(--space-10)}.about-content{max-width:900px;margin:0 auto}.about-bio{margin-bottom:var(--space-10)}.about-bio p{color:var(--color-text);margin-bottom:var(--space-5);max-width:72ch;font-size:1.05rem;line-height:1.75}.about-bio p:last-child{margin-bottom:0}.skills-section{padding-top:var(--space-6);border-top:1px solid var(--color-border)}.skills-section h3{color:var(--color-primary);margin-bottom:var(--space-6);letter-spacing:.01em;font-size:1.1rem;font-weight:600}.skills-grid{gap:var(--space-4);grid-template-columns:repeat(auto-fill,minmax(190px,1fr));display:grid}.skill-category{background-color:var(--bg-card);border:1px solid var(--color-border);padding:var(--space-4) var(--space-5);box-shadow:var(--shadow-sm);transition:box-shadow var(--transition-fast), transform var(--transition-fast);border-radius:10px}.skill-category:hover{box-shadow:var(--shadow-md);transform:translateY(-2px)}.skill-category h4{letter-spacing:.1em;text-transform:uppercase;color:var(--color-accent);margin-bottom:var(--space-3);font-size:.7rem;font-weight:700}.skill-tags{gap:var(--space-2);flex-wrap:wrap;display:flex}.skill-tag{background-color:var(--bg-subtle);color:var(--color-text);padding:2px var(--space-3);border:1px solid var(--color-border);font-size:.78rem;font-weight:500;font-family:var(--font-mono);transition:background-color var(--transition-fast), color var(--transition-fast), border-color var(--transition-fast);border-radius:20px}.skill-tag:hover{background-color:var(--color-accent);color:#fff;border-color:var(--color-accent)}@media (width<=768px){.hero{padding:3.5rem var(--space-6) 3rem;margin:calc(-1 * var(--space-8));margin-bottom:0}.hero-inner{align-items:flex-start;gap:var(--space-8);flex-direction:column-reverse}.hero-photo{aspect-ratio:1;border-radius:50%;align-self:center;width:140px}.hero-ctas{justify-content:flex-start}.about-bio p{max-width:100%}.skills-grid{grid-template-columns:repeat(auto-fill,minmax(160px,1fr))}}@media (width<=480px){.hero-photo{align-self:flex-start}}.experience-section{padding:var(--space-8) 0}.timeline{max-width:800px;margin:0 auto;position:relative}.timeline:before{content:"";background-color:var(--color-border);width:2px;position:absolute;top:0;bottom:0;left:50%;transform:translate(-50%)}.timeline-item{margin-bottom:var(--space-8);position:relative}.timeline-content{background-color:var(--bg-card);padding:var(--space-6);box-shadow:var(--shadow-md);border:1px solid var(--color-border);z-index:1;width:calc(50% - 30px);transition:box-shadow var(--transition-fast);border-radius:8px;margin-left:auto;position:relative}.timeline-content:hover{box-shadow:0 6px 20px #00000026}.timeline-item:nth-child(2n) .timeline-content{margin-left:0;margin-right:auto}.timeline-content:before{content:"";background-color:var(--color-accent);border:3px solid var(--bg-page);border-radius:50%;width:14px;height:14px;position:absolute;top:20px}.timeline-item:nth-child(odd) .timeline-content:before{left:-37px}.timeline-item:nth-child(2n) .timeline-content:before{right:-37px}.timeline-content h3{color:var(--color-primary);margin-bottom:var(--space-2);font-size:1.05rem;font-weight:600}.timeline-content h4{color:var(--color-accent);margin-bottom:var(--space-2);font-size:.95rem;font-weight:600}.timeline-content .duration{color:var(--color-muted);margin-bottom:var(--space-4);font-size:.875rem;font-style:italic}.experience-bullets{padding-left:var(--space-5);color:var(--color-text);margin:0;line-height:1.7}.experience-bullets li{margin-bottom:var(--space-2);font-size:.9rem}@media (width<=768px){.timeline:before{left:20px}.timeline-content{width:calc(100% - 50px);margin-left:50px}.timeline-item:nth-child(2n) .timeline-content{margin-left:50px;margin-right:0}.timeline-item:nth-child(odd) .timeline-content:before,.timeline-item:nth-child(2n) .timeline-content:before{left:-36px;right:auto}}.projects-section{padding:var(--space-8) 0}.projects-grid{gap:var(--space-8);margin-top:var(--space-8);grid-template-columns:repeat(auto-fill,minmax(300px,1fr));display:grid}.project-card{cursor:pointer;background-color:var(--bg-card);box-shadow:var(--shadow-sm);border:1px solid var(--color-border);transition:transform var(--transition-base), box-shadow var(--transition-base);padding:var(--space-6);border-radius:10px;flex-direction:column;display:flex;overflow:hidden}.project-card:hover{box-shadow:var(--shadow-md);transform:translateY(-4px)}.project-card h3{color:var(--color-primary);margin-bottom:var(--space-4);font-size:1rem;font-weight:600}.project-card p{color:var(--color-text);margin-bottom:var(--space-6);flex:1;font-size:.9rem;line-height:1.6}.tech-stack{margin-bottom:var(--space-6);gap:var(--space-2);flex-wrap:wrap;display:flex}.tech-tag{background-color:var(--bg-subtle);border:1px solid var(--color-border);padding:var(--space-1) var(--space-3);color:var(--color-muted);font-size:.75rem;font-family:var(--font-mono);transition:background-color var(--transition-fast), color var(--transition-fast);border-radius:20px}.tech-tag:hover{background-color:var(--color-accent);color:#fff;border-color:var(--color-accent)}.project-links{gap:var(--space-3);margin-top:auto;display:flex}.project-links a,.project-link-btn{padding:var(--space-2) var(--space-4);background-color:var(--color-accent);color:#fff;transition:background-color var(--transition-fast);cursor:pointer;border:none;border-radius:6px;font-size:.875rem;font-weight:500;text-decoration:none;display:inline-block}.project-links a:hover,.project-link-btn:hover{background-color:var(--color-accent-hover);text-decoration:none}@media (width<=480px){.projects-grid{grid-template-columns:1fr}}.music-section{padding:var(--space-8) 0}.music-intro{max-width:800px;margin:0 auto var(--space-8)}.music-intro p{color:var(--color-text);margin-bottom:var(--space-4);font-size:1.05rem;line-height:1.7}.music-subsection-title{color:var(--color-primary);margin:var(--space-8) auto var(--space-6);text-align:left;max-width:800px;font-size:1.4rem;font-weight:600}.music-videos{gap:var(--space-8);flex-direction:column;max-width:800px;margin:0 auto;display:flex}.video-container{background-color:var(--bg-card);box-shadow:var(--shadow-sm);border:1px solid var(--color-border);width:100%;transition:box-shadow var(--transition-fast);border-radius:10px;overflow:hidden}.video-container:hover{box-shadow:var(--shadow-md)}.video-embed{width:100%;height:0;padding-bottom:56.25%;position:relative;overflow:hidden}.video-embed iframe{border:none;width:100%;height:100%;position:absolute;top:0;left:0}.video-info{padding:var(--space-6);width:100%}.video-info h4{color:var(--color-primary);margin-bottom:var(--space-2);word-wrap:break-word;font-size:1.05rem;font-weight:600}.video-date{color:var(--color-muted);margin-bottom:var(--space-2);font-size:.875rem;font-style:italic}.video-description{color:var(--color-text);font-size:.9rem}.music-cta{max-width:800px;margin:var(--space-10) auto 0;text-align:center;background-color:var(--bg-subtle);padding:var(--space-8);box-shadow:var(--shadow-sm);border:1px solid var(--color-border);border-radius:10px}.music-cta h3{color:var(--color-primary);margin-bottom:var(--space-4);font-weight:600}.music-cta p{margin-bottom:var(--space-6);color:var(--color-text)}.music-contact-btn{background-color:var(--color-accent);color:#fff;padding:var(--space-3) var(--space-6);cursor:pointer;transition:background-color var(--transition-fast), transform var(--transition-fast);border:none;border-radius:6px;font-size:1rem;font-weight:600}.music-contact-btn:hover{background-color:var(--color-accent-hover);transform:translateY(-1px)}@media (width<=768px){.music-videos{padding:0}}.contact-section{padding:var(--space-8) 0}.contact-container{gap:var(--space-8);max-width:800px;margin:0 auto;display:flex}.contact-info,.contact-form{flex:1}.contact-info{background-color:var(--bg-card);padding:var(--space-8);box-shadow:var(--shadow-sm);border:1px solid var(--color-border);border-radius:10px}.contact-info h3{color:var(--color-primary);margin-bottom:var(--space-4);font-weight:600}.contact-info p{margin-bottom:var(--space-4);color:var(--color-text)}.contact-details{margin-top:var(--space-8)}.contact-details p{margin-bottom:var(--space-2);font-size:.9rem}.contact-form{background-color:var(--bg-card);padding:var(--space-8);box-shadow:var(--shadow-sm);border:1px solid var(--color-border);border-radius:10px}.form-group{margin-bottom:var(--space-6)}.form-group label{margin-bottom:var(--space-2);color:var(--color-text);font-size:.9rem;font-weight:500;display:block}.form-group input,.form-group textarea{width:100%;padding:var(--space-3) var(--space-4);border:1px solid var(--color-border);background-color:var(--bg-page);color:var(--color-text);transition:border-color var(--transition-fast), box-shadow var(--transition-fast);border-radius:6px;font-family:inherit;font-size:1rem}.form-group input:focus,.form-group textarea:focus{border-color:var(--color-accent);outline:none;box-shadow:0 0 0 3px #3b82f626}.form-group textarea{resize:vertical;min-height:150px}.submit-btn{background-color:var(--color-accent);color:#fff;padding:var(--space-3) var(--space-6);cursor:pointer;transition:background-color var(--transition-fast), transform var(--transition-fast);border:none;border-radius:6px;font-size:1rem;font-weight:600}.submit-btn:hover{background-color:var(--color-accent-hover);transform:translateY(-1px)}.submit-btn:disabled{background-color:var(--color-muted);cursor:not-allowed;transform:none}.success-message{padding:var(--space-8);color:#065f46;text-align:center;background-color:#d1fae5;border-radius:8px}.error-message{padding:var(--space-8);color:#991b1b;text-align:center;background-color:#fee2e2;border-radius:8px}[data-theme=dark] .success-message{color:#6ee7b7;background-color:#064e3b}[data-theme=dark] .error-message{color:#fca5a5;background-color:#7f1d1d}@media (width<=768px){.contact-container{flex-direction:column}}.craft-section{padding:var(--space-8) 0}.craft-section h2{text-align:center;margin-bottom:var(--space-2)}.craft-section>p{text-align:center;margin-bottom:var(--space-8);color:var(--color-muted)}.craft-grid{gap:var(--space-8);grid-template-columns:repeat(auto-fill,minmax(280px,1fr));display:grid}.craft-card{box-shadow:var(--shadow-sm);border:1px solid var(--color-border);transition:transform var(--transition-base), box-shadow var(--transition-base);cursor:pointer;background-color:var(--bg-card);border-radius:10px;flex-direction:column;display:flex;overflow:hidden}.craft-card:hover{box-shadow:var(--shadow-md);transform:translateY(-4px)}.craft-image-container{height:380px;overflow:hidden}.craft-image{object-fit:cover;width:100%;height:100%;transition:transform var(--transition-slow)}.craft-card:hover .craft-image{transform:scale(1.04)}.craft-info{padding:var(--space-5);flex-direction:column;flex:1;display:flex}.craft-info h3{margin-top:0;margin-bottom:var(--space-2);color:var(--color-primary);font-weight:600}.craft-info p{margin-bottom:var(--space-4);color:var(--color-muted);flex:1;font-size:.875rem}.view-more-btn{background-color:var(--color-accent);color:#fff;padding:var(--space-2) var(--space-4);cursor:pointer;transition:background-color var(--transition-fast), transform var(--transition-fast);border:none;border-radius:6px;font-size:.875rem;font-weight:500}.view-more-btn:hover{background-color:var(--color-accent-hover);transform:translateY(-1px)}.project-modal-overlay{z-index:1000;background-color:#000000b3;justify-content:center;align-items:center;display:flex;position:fixed;inset:0}.project-modal{background-color:var(--bg-card);padding:var(--space-8);border:1px solid var(--color-border);border-radius:10px;width:90%;max-width:700px;max-height:90vh;position:relative;overflow-y:auto}.project-modal h2{color:var(--color-primary);text-align:left;margin-bottom:var(--space-2)}.project-modal>p{color:var(--color-text);margin-bottom:var(--space-4);font-size:.9rem}.close-modal-btn{top:var(--space-4);right:var(--space-4);background:var(--bg-subtle);border:1px solid var(--color-border);color:var(--color-text);cursor:pointer;width:32px;height:32px;transition:background-color var(--transition-fast);border-radius:50%;justify-content:center;align-items:center;font-size:1.25rem;display:flex;position:absolute}.close-modal-btn:hover{background-color:var(--color-border)}.project-gallery{margin-top:var(--space-6)}.main-project-image-container{width:100%;margin-bottom:var(--space-5);justify-content:center;align-items:center;display:flex}.main-project-image{justify-content:center;align-items:center;max-width:100%;display:flex}.main-project-image img{object-fit:contain;border-radius:6px;max-width:100%;max-height:60vh}.additional-images{justify-content:center;gap:var(--space-3);margin-top:var(--space-3);flex-wrap:wrap;display:flex}.additional-images img{object-fit:cover;cursor:pointer;width:80px;height:80px;transition:transform var(--transition-fast), border-color var(--transition-fast);border:2px solid #0000;border-radius:6px}.additional-images img:hover{transform:scale(1.05)}.selected-thumbnail{box-shadow:0 0 0 2px #3b82f64d;border-color:var(--color-accent)!important}.navigation-help{text-align:center;margin-top:var(--space-3);color:var(--color-muted);font-size:.8rem}@media (width<=768px){.craft-grid{grid-template-columns:1fr}.craft-image-container{height:auto}.craft-image{height:260px}.project-modal{padding:var(--space-5);width:95%}.additional-images img{width:64px;height:64px}}.footer{background-color:var(--bg-nav);color:#fffc;padding:var(--space-6) var(--space-8);transition:background-color var(--transition-base);margin-top:auto}.footer-content{justify-content:space-between;align-items:center;max-width:1200px;margin:0 auto;font-size:.875rem;display:flex}.social-links{gap:var(--space-6);display:flex}.social-links a{color:#ffffffb3;transition:color var(--transition-fast);font-weight:500;text-decoration:none}.social-links a:hover{color:var(--color-accent);text-decoration:none}@media (width<=768px){.footer-content{gap:var(--space-4);text-align:center;flex-direction:column}}.project-detail-container{max-width:900px;padding:var(--space-8) var(--space-5);flex-direction:column;align-items:flex-start;margin:0 auto;display:flex}.back-button{margin-bottom:var(--space-6);color:var(--color-accent);cursor:pointer;padding:var(--space-2) 0;transition:color var(--transition-fast);background:0 0;border:none;font-size:.95rem;font-weight:500;display:inline-block}.project-detail-container h1{color:var(--color-primary);margin-bottom:var(--space-5);font-size:2rem;font-weight:700}.project-tech-stack{margin:var(--space-5) 0;gap:var(--space-2);flex-wrap:wrap;display:flex}.project-links{margin:var(--space-5) 0;gap:var(--space-4);display:flex}.project-link{padding:var(--space-2) var(--space-5);background-color:var(--color-accent);color:#fff;transition:background-color var(--transition-fast), transform var(--transition-fast);border-radius:6px;font-size:.95rem;font-weight:600;text-decoration:none;display:inline-block}.project-link:hover{background-color:var(--color-accent-hover);text-decoration:none;transform:translateY(-1px)}.project-content{margin-top:var(--space-8);width:100%}.project-section{margin-bottom:var(--space-8);padding:var(--space-6);background-color:var(--bg-card);border:1px solid var(--color-border);box-shadow:var(--shadow-sm);border-radius:10px}.project-section h2{margin-bottom:var(--space-4);color:var(--color-primary);text-align:left;font-size:1.4rem}.project-section ul{padding-left:var(--space-6);list-style-type:disc}.project-section li{margin-bottom:var(--space-3);color:var(--color-text);font-size:.95rem;line-height:1.7}.section-image{text-align:center;margin-top:var(--space-5);margin-bottom:var(--space-5);width:100%;list-style:none!important}.section-image img{max-width:100%;height:auto;max-height:400px;box-shadow:var(--shadow-md);transition:transform var(--transition-base);border-radius:8px}.section-image img:hover{transform:scale(1.02)}.section-image p{color:var(--color-muted);margin-top:var(--space-2);font-size:.85rem;font-style:italic}@media (width<=768px){.project-detail-container,.project-section{padding:var(--space-4)}.section-image img{object-fit:contain;max-height:280px}}.nudge-page .project-section code{background-color:var(--bg-subtle);border:1px solid var(--color-border);border-radius:6px;padding:.05rem .35rem;font-size:.85em}.nudge-nav-links{flex-wrap:wrap}.nudge-link-active{background-color:var(--color-accent-hover)}.nudge-inline-links{padding-left:0;list-style:none}.nudge-inline-links li{margin-bottom:var(--space-3)}.recipes-section{padding:var(--space-8) 0}.recipes-section h2{margin-bottom:var(--space-6);text-align:center}.search-container{margin-bottom:var(--space-8);justify-content:center;display:flex}.recipe-search{width:100%;max-width:500px;padding:var(--space-3) var(--space-4);border:1px solid var(--color-border);background-color:var(--bg-card);color:var(--color-text);transition:border-color var(--transition-fast), box-shadow var(--transition-fast);border-radius:6px;font-size:1rem}.recipe-search:focus{border-color:var(--color-accent);outline:none;box-shadow:0 0 0 3px #3b82f626}.recipes-grid{gap:var(--space-8);grid-template-columns:repeat(auto-fill,minmax(280px,1fr));display:grid}.recipe-card{background-color:var(--bg-card);box-shadow:var(--shadow-sm);border:1px solid var(--color-border);transition:transform var(--transition-base), box-shadow var(--transition-base);cursor:pointer;border-radius:10px;flex-direction:column;display:flex;overflow:hidden}.recipe-card:hover{box-shadow:var(--shadow-md);transform:translateY(-4px)}.recipe-image{aspect-ratio:1;overflow:hidden}.recipe-image img{object-fit:cover;width:100%;height:100%;transition:transform var(--transition-slow)}.recipe-card:hover .recipe-image img{transform:scale(1.04)}.recipe-card h3{padding:var(--space-4) var(--space-4) var(--space-2);color:var(--color-primary);margin:0;font-size:1rem;font-weight:600}.recipe-card p{padding:0 var(--space-4);margin:0 0 var(--space-4);color:var(--color-muted);font-size:.875rem;line-height:1.5}.recipe-details{padding:var(--space-3) var(--space-4);background-color:var(--bg-subtle);border-top:1px solid var(--color-border);justify-content:space-between;margin-top:auto;font-size:.8rem;display:flex}.prep-time,.difficulty{padding:var(--space-1) var(--space-3);background-color:var(--bg-card);border:1px solid var(--color-border);color:var(--color-muted);border-radius:4px;font-weight:500;display:inline-block}.recipe-details-section{padding:var(--space-8);max-width:1000px;margin:0 auto}.back-button{color:var(--color-accent);cursor:pointer;padding:var(--space-2) 0;margin-bottom:var(--space-6);transition:color var(--transition-fast);background-color:#0000;border:none;font-size:.95rem;font-weight:500;display:inline-block}.back-button:hover{color:var(--color-accent-hover)}.recipe-title{margin-bottom:var(--space-6);text-align:center;color:var(--color-primary);font-size:2rem}.recipe-hero{gap:var(--space-8);margin-bottom:var(--space-10);flex-direction:column;display:flex}@media (width>=768px){.recipe-hero{flex-direction:row;align-items:flex-start}}.recipe-image-large{object-fit:cover;width:100%;height:auto;box-shadow:var(--shadow-md);border-radius:10px}@media (width>=768px){.recipe-image-large{width:55%}}.recipe-meta{background-color:var(--bg-subtle);padding:var(--space-6);border:1px solid var(--color-border);border-radius:10px;flex:1}.meta-item{margin-bottom:var(--space-4)}.meta-item:last-child{margin-bottom:0}.meta-label{color:var(--color-primary);margin-right:var(--space-2);font-size:.9rem;font-weight:600}.meta-value{color:var(--color-text);font-size:.9rem}.recipe-description{margin-bottom:var(--space-10);color:var(--color-text);font-size:1.05rem;line-height:1.7}.recipe-content{gap:var(--space-8);flex-direction:column;display:flex}@media (width>=768px){.recipe-content{flex-direction:row}}.ingredients-table{border-collapse:collapse;width:100%}.ingredients-table td{padding:var(--space-3);border-bottom:1px solid var(--color-border);color:var(--color-text);font-size:.9rem}.ingredient-name{width:50%;color:var(--color-primary);font-weight:600}.ingredients-section,.directions-section{flex:1}.ingredients-section h2,.directions-section h2{margin-bottom:var(--space-4);padding-bottom:var(--space-3);border-bottom:2px solid var(--color-border);text-align:left;color:var(--color-primary);font-size:1.25rem}.directions-list{padding-left:var(--space-5);margin:0;list-style-position:outside}.directions-list li{padding:var(--space-3) 0;border-bottom:1px solid var(--color-border);color:var(--color-text);font-size:.9rem;line-height:1.6}.directions-list li:last-child{border-bottom:none}.blog-section{max-width:1100px;padding:var(--space-8) var(--space-6);margin:0 auto}.blog-section h2{color:var(--color-primary);margin-bottom:var(--space-6);font-size:2rem;font-weight:700}.blog-tags-filter{gap:var(--space-2);margin-bottom:var(--space-6);flex-wrap:wrap;display:flex}.tag-chip{background:var(--bg-subtle);color:var(--color-text);border:1px solid var(--color-border);padding:var(--space-1) var(--space-3);cursor:pointer;transition:background var(--transition-fast), color var(--transition-fast), border-color var(--transition-fast);border-radius:20px;font-size:.82rem}.tag-chip:hover,.tag-chip.active{background:var(--color-accent);color:#fff;border-color:var(--color-accent)}.posts-grid{gap:var(--space-6);grid-template-columns:repeat(auto-fill,minmax(320px,1fr));display:grid}.post-card{background:var(--bg-card);border:1px solid var(--color-border);color:inherit;box-shadow:var(--shadow-sm);transition:transform var(--transition-base), box-shadow var(--transition-base);border-radius:12px;flex-direction:column;text-decoration:none;display:flex;overflow:hidden}.post-card:hover{box-shadow:var(--shadow-md);transform:translateY(-4px)}.post-card-image{aspect-ratio:16/9;background:var(--bg-subtle);width:100%;overflow:hidden}.post-card-image img{object-fit:cover;width:100%;height:100%;transition:transform var(--transition-slow)}.post-card:hover .post-card-image img{transform:scale(1.04)}.post-card-body{padding:var(--space-4);gap:var(--space-2);flex-direction:column;flex:1;display:flex}.post-card-tags{gap:var(--space-1);flex-wrap:wrap;display:flex}.post-tag{background:var(--bg-subtle);color:var(--color-accent);border:1px solid var(--color-border);padding:2px var(--space-2);border-radius:4px;font-size:.75rem;font-weight:500}.post-card-body h3{color:var(--color-primary);margin:0;font-size:1.1rem;font-weight:600;line-height:1.4}.post-card-body p{color:var(--color-muted);flex:1;margin:0;font-size:.9rem;line-height:1.6}.post-card-meta{gap:var(--space-3);color:var(--color-muted);padding-top:var(--space-2);border-top:1px solid var(--color-border);margin-top:auto;font-size:.8rem;display:flex}.blog-loading{gap:var(--space-6);grid-template-columns:repeat(auto-fill,minmax(320px,1fr));display:grid}.post-card-skeleton{background:var(--bg-subtle);border-radius:12px;height:280px;animation:1.4s ease-in-out infinite skeleton-pulse}@keyframes skeleton-pulse{0%,to{opacity:1}50%{opacity:.5}}.blog-empty{color:var(--color-muted);padding:var(--space-6) 0;font-size:.95rem}@media (width<=640px){.blog-section{padding:var(--space-6) var(--space-4)}.posts-grid{grid-template-columns:1fr}}.blogpost-section{max-width:1100px;padding:var(--space-8) var(--space-6);margin:0 auto}.blogpost-container{max-width:740px;margin:0 auto}.blogpost-back{color:var(--color-accent);margin-bottom:var(--space-6);transition:color var(--transition-fast);font-size:.9rem;text-decoration:none;display:inline-block}.blogpost-back:hover{color:var(--color-accent-hover)}.blogpost-header{margin-bottom:var(--space-6)}.blogpost-tags{gap:var(--space-1);margin-bottom:var(--space-3);flex-wrap:wrap;display:flex}.blogpost-header h1{color:var(--color-primary);margin-bottom:var(--space-3);font-size:2rem;font-weight:700;line-height:1.25}.blogpost-meta{align-items:center;gap:var(--space-2);color:var(--color-muted);font-size:.85rem;display:flex}.meta-sep{opacity:.5}.blogpost-cover{margin-bottom:var(--space-8);background:var(--bg-subtle);border-radius:12px;overflow:hidden}.blogpost-cover img{width:100%;height:auto;display:block}.blogpost-body{color:var(--color-text);font-size:1rem;line-height:1.8}.blogpost-body p{margin-bottom:var(--space-4)}.blogpost-body a{color:var(--color-accent);text-decoration:underline}.blogpost-body a:hover{color:var(--color-accent-hover)}.blog-h2{color:var(--color-primary);margin-top:var(--space-8);margin-bottom:var(--space-3);font-size:1.5rem;font-weight:700}.blog-h3{color:var(--color-primary);margin-top:var(--space-6);margin-bottom:var(--space-2);font-size:1.2rem;font-weight:600}.blog-blockquote{border-left:3px solid var(--color-accent);padding-left:var(--space-4);margin:var(--space-6) 0;color:var(--color-muted);font-style:italic}.blog-list{padding-left:var(--space-6);margin-bottom:var(--space-4)}.blog-list li{margin-bottom:var(--space-2)}.blog-figure{margin:var(--space-6) 0;text-align:center}.blog-figure img{max-width:100%;box-shadow:var(--shadow-md);border-radius:8px}.blog-figure figcaption{color:var(--color-muted);margin-top:var(--space-2);font-size:.85rem}.inline-code{background:var(--bg-subtle);border:1px solid var(--color-border);font-family:var(--font-mono);color:var(--color-accent);border-radius:4px;padding:1px 6px;font-size:.875em}.blogpost-skeleton-header{background:var(--bg-subtle);height:48px;margin-bottom:var(--space-6);border-radius:8px;animation:1.4s ease-in-out infinite skeleton-pulse}.blogpost-skeleton-body{gap:var(--space-3);flex-direction:column;display:flex}.blogpost-skeleton-line{background:var(--bg-subtle);border-radius:4px;height:20px;animation:1.4s ease-in-out infinite skeleton-pulse}.blogpost-skeleton-line:nth-child(2n){width:80%}.blogpost-not-found{color:var(--color-muted);padding:var(--space-8) 0;font-size:.95rem}.blogpost-not-found a{color:var(--color-accent)}.comments-section{margin-top:var(--space-10);padding-top:var(--space-8);border-top:1px solid var(--color-border)}.comments-section h2{color:var(--color-primary);margin-bottom:var(--space-5);font-size:1.4rem;font-weight:700}.comments-loading,.comments-empty{color:var(--color-muted);margin-bottom:var(--space-6);font-size:.9rem}.comments-list{margin:0 0 var(--space-8) 0;gap:var(--space-4);flex-direction:column;padding:0;list-style:none;display:flex}.comment-item{background:var(--bg-card);border:1px solid var(--color-border);padding:var(--space-4);border-radius:8px}.comment-header{align-items:baseline;gap:var(--space-3);margin-bottom:var(--space-2);display:flex}.comment-author{color:var(--color-primary);font-size:.9rem;font-weight:600}.comment-date{color:var(--color-muted);font-size:.8rem}.comment-content{color:var(--color-text);margin:0;font-size:.9rem;line-height:1.6}.comment-form{gap:var(--space-3);flex-direction:column;display:flex}.comment-form h3{color:var(--color-primary);margin-bottom:var(--space-1);font-size:1.1rem;font-weight:600}.comment-form label{color:var(--color-text);font-size:.85rem;font-weight:500}.comment-form input,.comment-form textarea{background:var(--bg-card);border:1px solid var(--color-border);padding:var(--space-3);color:var(--color-text);font-size:.9rem;font-family:var(--font-sans);transition:border-color var(--transition-fast);resize:vertical;border-radius:8px}.comment-form input:focus,.comment-form textarea:focus{border-color:var(--color-accent);outline:none}.comment-form input::placeholder,.comment-form textarea::placeholder{color:var(--color-muted)}.comment-error{color:#ef4444;margin:0;font-size:.85rem}.comment-success{color:#22c55e;margin:0;font-size:.85rem}.comment-form .btn{align-self:flex-start}@media (width<=640px){.blogpost-section{padding:var(--space-6) var(--space-4)}.blogpost-header h1{font-size:1.5rem}}.admin-page{max-width:1100px;padding:var(--space-6) var(--space-4);min-height:100vh;margin:0 auto}.admin-header{margin-bottom:var(--space-6);padding-bottom:var(--space-4);border-bottom:1px solid var(--color-border);justify-content:space-between;align-items:center;display:flex}.admin-header h1{color:var(--color-text);margin:0;font-size:1.75rem;font-weight:700}.admin-header-actions{gap:var(--space-2);align-items:center;display:flex}.admin-btn{align-items:center;gap:var(--space-1);cursor:pointer;transition:var(--transition-fast);border:1px solid #0000;border-radius:6px;padding:.5rem 1rem;font-size:.875rem;font-weight:500;text-decoration:none;display:inline-flex}.admin-btn-primary{background:var(--color-accent);color:#fff;border-color:var(--color-accent)}.admin-btn-primary:hover{background:var(--color-accent-hover);border-color:var(--color-accent-hover)}.admin-btn-secondary{background:var(--bg-subtle);color:var(--color-text);border-color:var(--color-border)}.admin-btn-secondary:hover{background:var(--bg-card)}.admin-btn-danger{color:#dc2626;background:0 0;border-color:#dc2626}.admin-btn-danger:hover{color:#fff;background:#dc2626}.admin-btn-sm{padding:.3rem .65rem;font-size:.8rem}.admin-btn:disabled{opacity:.6;cursor:not-allowed}.admin-login-page{background:var(--bg-page);justify-content:center;align-items:center;min-height:100vh;display:flex}.admin-login-card{background:var(--bg-card);border:1px solid var(--color-border);padding:var(--space-8);width:100%;max-width:400px;box-shadow:var(--shadow-md);border-radius:12px}.admin-login-card h1{margin-bottom:var(--space-5);color:var(--color-text);font-size:1.5rem;font-weight:700}.admin-form{gap:var(--space-3);flex-direction:column;display:flex}.admin-form label,.admin-editor-fields label,.admin-editor-body label{color:var(--color-muted);text-transform:uppercase;letter-spacing:.04em;font-size:.85rem;font-weight:600}.admin-form input,.admin-editor-fields input{border:1px solid var(--color-border);background:var(--bg-page);color:var(--color-text);font-size:.95rem;font-family:var(--font-sans);transition:var(--transition-fast);border-radius:6px;padding:.6rem .75rem}.admin-form input:focus,.admin-editor-fields input:focus{border-color:var(--color-accent);box-shadow:0 0 0 3px color-mix(in srgb, var(--color-accent) 15%, transparent);outline:none}.admin-error{color:#dc2626;margin:0;font-size:.875rem}.admin-success{color:#16a34a;margin:0;font-size:.875rem}.admin-loading,.admin-empty{color:var(--color-muted);padding:var(--space-4) 0}.admin-table{border-collapse:collapse;width:100%;font-size:.9rem}.admin-table th{text-align:left;padding:var(--space-2) var(--space-3);border-bottom:2px solid var(--color-border);text-transform:uppercase;letter-spacing:.05em;color:var(--color-muted);font-size:.8rem}.admin-table td{padding:var(--space-3);border-bottom:1px solid var(--color-border);color:var(--color-text);vertical-align:middle}.admin-table-title{max-width:300px;font-weight:500}.admin-table-date{color:var(--color-muted);white-space:nowrap}.admin-table-actions{gap:var(--space-2);display:flex}.admin-badge{border-radius:999px;padding:.2rem .6rem;font-size:.75rem;font-weight:600;display:inline-block}.badge-published{color:#16a34a;background:#dcfce7}.badge-draft{background:var(--bg-subtle);color:var(--color-muted)}.admin-editor-layout{gap:var(--space-5);flex-direction:column;display:flex}.admin-editor-fields{gap:var(--space-3);flex-direction:column;display:flex}.admin-editor-body{gap:var(--space-2);flex-direction:column;display:flex}.admin-editor-body-header{justify-content:space-between;align-items:center;display:flex}.admin-mode-toggle{border:1px solid var(--color-border);border-radius:6px;display:flex;overflow:hidden}.admin-mode-btn{background:var(--bg-page);color:var(--color-muted);cursor:pointer;transition:var(--transition-fast);border:none;padding:.3rem .85rem;font-size:.8rem;font-weight:500}.admin-mode-btn+.admin-mode-btn{border-left:1px solid var(--color-border)}.admin-mode-btn.active{background:var(--color-accent);color:#fff}.admin-split-pane{gap:var(--space-4);grid-template-columns:1fr 1fr;min-height:500px;display:grid}.admin-split-left,.admin-split-right{flex-direction:column;display:flex}.admin-body-textarea{min-height:460px;padding:var(--space-3);border:1px solid var(--color-border);background:var(--bg-page);color:var(--color-text);font-family:var(--font-mono);resize:vertical;transition:var(--transition-fast);border-radius:6px;flex:1;font-size:.9rem;line-height:1.6}.admin-body-textarea:focus{border-color:var(--color-accent);box-shadow:0 0 0 3px color-mix(in srgb, var(--color-accent) 15%, transparent);outline:none}.admin-preview{min-height:460px;padding:var(--space-3);border:1px solid var(--color-border);background:var(--bg-subtle);border-radius:6px;flex:1;font-size:.95rem;line-height:1.7;overflow-y:auto}.admin-preview-empty{color:var(--color-muted);font-style:italic}.admin-editor-actions{gap:var(--space-3);padding-top:var(--space-4);border-top:1px solid var(--color-border);margin-top:var(--space-4);display:flex}.tiptap-wrapper{border:1px solid var(--color-border);background:var(--bg-page);transition:border-color var(--transition-fast), box-shadow var(--transition-fast);border-radius:8px;overflow:hidden}.tiptap-wrapper:focus-within{border-color:var(--color-accent);box-shadow:0 0 0 3px color-mix(in srgb, var(--color-accent) 15%, transparent)}.tiptap-toolbar{padding:var(--space-2);background:var(--bg-subtle);border-bottom:1px solid var(--color-border);flex-wrap:wrap;gap:2px;display:flex}.tiptap-toolbar-btn{min-width:2rem;height:2rem;color:var(--color-text);font-size:.85rem;font-family:var(--font-sans);cursor:pointer;transition:var(--transition-fast);background:0 0;border:1px solid #0000;border-radius:4px;justify-content:center;align-items:center;padding:0 .4rem;display:inline-flex}.tiptap-toolbar-btn:hover{background:var(--bg-card);border-color:var(--color-border)}.tiptap-toolbar-btn.active{background:var(--color-accent);color:#fff;border-color:var(--color-accent)}.tiptap-toolbar-btn:disabled{opacity:.35;cursor:not-allowed}.tiptap-toolbar-sep{background:var(--color-border);align-self:stretch;width:1px;margin:2px 4px}.tiptap-editor-content{min-height:480px;padding:var(--space-4);color:var(--color-text);outline:none;font-size:1rem;line-height:1.75}.tiptap-editor-content p.is-editor-empty:first-child:before{content:attr(data-placeholder);color:var(--color-muted);pointer-events:none;float:left;height:0}.tiptap-editor-content h1{margin:1.2em 0 .4em;font-size:1.75rem;font-weight:700}.tiptap-editor-content h2{margin:1.1em 0 .4em;font-size:1.4rem;font-weight:700}.tiptap-editor-content h3{margin:1em 0 .3em;font-size:1.15rem;font-weight:600}.tiptap-editor-content p{margin:0 0 .75em}.tiptap-editor-content ul,.tiptap-editor-content ol{margin:0 0 .75em;padding-left:1.5rem}.tiptap-editor-content li{margin-bottom:.25em}.tiptap-editor-content blockquote{border-left:3px solid var(--color-accent);color:var(--color-muted);margin:.75em 0;padding:.4em 1em;font-style:italic}.tiptap-editor-content pre{background:var(--bg-subtle);border:1px solid var(--color-border);padding:var(--space-3);font-family:var(--font-mono);border-radius:6px;margin:.75em 0;font-size:.875rem;overflow-x:auto}.tiptap-editor-content code{font-family:var(--font-mono);background:var(--bg-subtle);border-radius:3px;padding:.15em .35em;font-size:.875em}.tiptap-editor-content pre code{background:0 0;padding:0}.tiptap-editor-content a{color:var(--color-accent);text-decoration:underline}.tiptap-editor-content hr{border:none;border-top:1px solid var(--color-border);margin:1.5em 0}.admin-btn-ai{color:#fff;background:linear-gradient(135deg,#7c3aed,#2563eb);border-color:#0000}.admin-btn-ai:hover{opacity:.9}.admin-ai-thinking{color:var(--color-muted);align-self:center;font-size:.8rem;font-style:italic}.admin-spinner{border:3px solid var(--color-border);border-top-color:var(--color-accent);border-radius:50%;width:32px;height:32px;animation:.7s linear infinite admin-spin}@keyframes admin-spin{to{transform:rotate(360deg)}}@media (width<=768px){.admin-split-pane{grid-template-columns:1fr}.admin-header{align-items:flex-start;gap:var(--space-3);flex-direction:column}.admin-table{font-size:.8rem}}:root{--bg-page:#f8fafc;--bg-card:#fff;--bg-subtle:#f1f5f9;--color-primary:#0f172a;--color-text:#334155;--color-muted:#64748b;--color-accent:#3b82f6;--color-accent-hover:#2563eb;--color-border:#e2e8f0;--bg-nav:#0f172a;--shadow-sm:0 1px 3px #00000014;--shadow-md:0 4px 12px #0000001a;--transition-fast:.15s ease;--transition-base:.25s ease;--transition-slow:.4s ease;--font-sans:"Inter", system-ui, -apple-system, sans-serif;--font-mono:"JetBrains Mono", "Fira Code", monospace;--space-1:.25rem;--space-2:.5rem;--space-3:.75rem;--space-4:1rem;--space-5:1.25rem;--space-6:1.5rem;--space-7:1.75rem;--space-8:2rem;--space-9:2.25rem;--space-10:2.5rem}[data-theme=dark]{--bg-page:#0f172a;--bg-card:#1e293b;--bg-subtle:#1e293b;--color-primary:#f8fafc;--color-text:#cbd5e1;--color-muted:#64748b;--color-accent:#60a5fa;--color-accent-hover:#93c5fd;--color-border:#334155;--bg-nav:#0f172a;--shadow-sm:0 1px 3px #0000004d;--shadow-md:0 4px 12px #0006}.animate-on-scroll{opacity:0;transition:opacity .5s,transform .5s;transform:translateY(24px)}.animate-on-scroll.visible{opacity:1;transform:translateY(0)}.animate-on-scroll:nth-child(2){transition-delay:50ms}.animate-on-scroll:nth-child(3){transition-delay:.1s}.animate-on-scroll:nth-child(4){transition-delay:.15s}.animate-on-scroll:nth-child(5){transition-delay:.2s}.animate-on-scroll:nth-child(6){transition-delay:.25s}*{box-sizing:border-box;margin:0;padding:0}body{font-family:var(--font-sans);color:var(--color-text);background-color:var(--bg-page);line-height:1.6}.App{flex-direction:column;min-height:100vh;display:flex}main{padding:var(--space-8);flex:1;width:100%;max-width:1200px;margin:0 auto}section{margin-bottom:var(--space-8)}h2{margin-bottom:var(--space-6);color:var(--color-primary);text-align:center;font-size:2rem}button{cursor:pointer;font-family:inherit;font-size:inherit;background:0 0;border:none}a{color:var(--color-accent);text-decoration:none}a:hover{text-decoration:underline}.btn{padding:var(--space-3) var(--space-6);transition:background-color var(--transition-fast), transform var(--transition-fast), box-shadow var(--transition-fast);cursor:pointer;border-radius:6px;font-size:.95rem;font-weight:600;text-decoration:none;display:inline-block}.btn:hover{text-decoration:none;transform:translateY(-1px)}.btn-primary{background-color:var(--color-accent);color:#fff;border:2px solid var(--color-accent)}.btn-primary:hover{background-color:var(--color-accent-hover);border-color:var(--color-accent-hover);box-shadow:var(--shadow-md)}.btn-secondary{color:var(--color-accent);border:2px solid var(--color-accent);background-color:#0000}.btn-secondary:hover{background-color:var(--color-accent);color:#fff;box-shadow:var(--shadow-md)}@keyframes fadeIn{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}@keyframes fadeInUp{0%{opacity:0;transform:translateY(16px)}to{opacity:1;transform:translateY(0)}}section{animation:.4s ease-in fadeIn}
