*{margin:0;padding:0;box-sizing:border-box}body{font-family:Inter Variable,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif;background:#fff;color:#000;line-height:1.6}.app{min-height:100vh;display:flex;flex-direction:column}.app.home-layout{align-items:center;justify-content:center}.app.page-layout{flex-direction:column}.main-navigation{display:flex;justify-content:space-between;align-items:center;padding:1rem 2rem;border-bottom:1px solid #e0e0e0;background:#fff;position:sticky;top:0;z-index:100}.nav-left{display:flex;gap:2rem;align-items:center}.nav-right{display:flex;align-items:center}.main-navigation .nav-link{font-size:.9rem}.main-navigation .nav-link.active{padding:.25rem .5rem;font-weight:650}.main-navigation .nav-link.active:after{width:100%}.container{width:100%;padding:2rem;margin:0 auto}.home-layout .container{max-width:350px;text-align:center}.page-layout .container{max-width:800px;flex:1;display:flex;align-items:center;justify-content:center}.page{width:100%;max-width:600px;text-align:center}.profile{display:flex;flex-direction:row;align-items:center;gap:1.5rem}.profile-image{width:95px;height:95px;border-radius:50%;object-fit:cover;border:1px solid #818181;flex-shrink:0}.profile-text{display:flex;flex-direction:column;gap:.25rem;text-align:left}.name{font-size:1.2rem;font-weight:450;margin:0;line-height:1.2}.slogan{font-size:.9rem;color:#666;font-style:italic;margin:0;line-height:1.2}.profile-bottom{margin-top:1.5rem;display:flex;justify-content:center}.navigation{display:flex;flex-direction:column;gap:0rem;align-items:center}.nav-link{color:#000;text-decoration:none;font-size:1rem;font-weight:400;letter-spacing:.1em;transition:all .2s ease;padding:.25rem 0;position:relative}.nav-link:hover{color:#666}.nav-link:after{content:"";position:absolute;bottom:0;left:50%;width:0;height:1px;background:#000;transition:all .2s ease;transform:translate(-50%)}.nav-link:hover:after{width:100%}.page h1{font-size:2rem;font-weight:500;margin-bottom:1.5rem;color:#000}.page h2{font-size:1.5rem;font-weight:450;margin-bottom:1rem;color:#000}.page h3{font-size:1.25rem;font-weight:450;margin-bottom:.75rem;color:#000}.content{text-align:left;line-height:1.7}.blog-post{margin-bottom:2rem;padding-bottom:1.5rem;border-bottom:1px solid #e0e0e0}.blog-post:last-child{border-bottom:none}.date{color:#666;font-size:.85rem;margin-bottom:.75rem}.photo-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:1rem;margin-top:1.5rem}.photo-placeholder{aspect-ratio:1;border:2px dashed #ccc;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding:1rem;border-radius:8px}.photo-placeholder p{font-size:2rem;margin-bottom:.5rem}.photo-placeholder span{font-size:.8rem;color:#666}.portfolio-section{margin-top:2rem}.project-card{background:#f8f9fa;border-radius:8px;padding:1.5rem;margin-bottom:1.5rem;text-align:left}.project-card h3{margin-bottom:.75rem}.tech-stack{display:flex;flex-wrap:wrap;gap:.5rem;margin-top:1rem}.tech-tag{background:#e9ecef;color:#495057;padding:.25rem .5rem;border-radius:4px;font-size:.8rem;font-weight:500}.quotes-container{margin-top:2rem}.quote-card{background:#f8f9fa;border-radius:8px;padding:1.5rem;margin-bottom:1.5rem;text-align:left}.quote-card blockquote{margin:0 0 1rem;font-style:italic;font-size:1.1rem;line-height:1.6}.quote-footer{display:flex;justify-content:space-between;align-items:center;font-size:.9rem}.quote-context{color:#666;font-size:.8rem}.quote-of-day{background:#000;color:#fff;padding:1.5rem;border-radius:8px;margin-top:2rem}.quote-of-day h2{color:#fff;margin-bottom:.75rem}.about-section{margin-bottom:2rem}.about-section ul{text-align:left;margin-left:1rem}.about-section li{margin-bottom:.5rem}@media (max-width: 768px){.main-navigation{padding:.5rem .75rem;flex-wrap:wrap;gap:.5rem}.nav-left{flex-wrap:wrap;gap:.75rem;order:1;flex:1}.nav-right{order:2}.main-navigation .nav-link{font-size:.8rem;padding:.2rem .35rem}.container,.home-layout .container,.page-layout .container{padding:1rem}.profile{flex-direction:column;gap:1rem}.profile-text{text-align:center}.profile-image{width:100px;height:100px}.name{font-size:1.4rem}.photo-grid{grid-template-columns:repeat(auto-fit,minmax(120px,1fr))}.project-card,.quote-card{padding:1rem}}@media (max-width: 480px){.main-navigation{padding:.4rem .6rem;gap:.3rem}.nav-left{gap:.5rem}.main-navigation .nav-link{font-size:.75rem;padding:.15rem .25rem}.main-navigation .nav-link.active{padding:.15rem .35rem}}
