body{background:#fff;margin:0;font-family:Inter,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif;overflow-x:hidden}#root{box-sizing:border-box;flex-direction:column;width:100%;min-height:100svh;display:flex}.typewriter-text,.typewriter-cursor{display:inline}:root{--c-bg:#fff;--c-bg-alt:#fafafa;--c-text:#111;--c-text-2:#555;--c-text-3:#666;--c-muted:#888;--c-subtle:#aaa;--c-border:#d8d8d8;--c-border-soft:#e8e8e8;--c-nav-bg:#fffffff2;--c-mobile-menu-bg:#fffffffa;--c-tag-bg:#f4f4f4;--c-tag-border:#eee;--c-link-arrow:#bbb;--c-card-shadow:0 2px 12px #00000014}.dark{--c-bg:#111;--c-bg-alt:#161616;--c-text:#f0f0f0;--c-text-2:#aaa;--c-text-3:#999;--c-muted:#777;--c-subtle:#555;--c-border:#2a2a2a;--c-border-soft:#222;--c-nav-bg:#111111f2;--c-mobile-menu-bg:#111111fa;--c-tag-bg:#222;--c-tag-border:#2a2a2a;--c-link-arrow:#555;--c-card-shadow:none}.btn-primary{color:#fff;cursor:pointer;background:#111;border:none;border-radius:8px;padding:.8rem 1.8rem;font-family:inherit;font-size:.95rem;font-weight:600;transition:background .2s}.btn-primary:hover{background:#333}.dark .btn-primary{color:#111;background:#f0f0f0}.dark .btn-primary:hover{background:#d0d0d0}.btn-secondary{color:var(--c-text);border:1.5px solid var(--c-border);cursor:pointer;background:0 0;border-radius:8px;padding:.8rem 1.8rem;font-family:inherit;font-size:.95rem;font-weight:600;text-decoration:none;transition:border-color .2s;display:inline-block}.btn-secondary:hover{border-color:#999}.card{box-shadow:var(--c-card-shadow)}.nav-links{align-items:center;gap:2rem;display:flex}.hamburger{cursor:pointer;z-index:101;background:0 0;border:none;flex-direction:column;justify-content:center;gap:5px;padding:4px;display:none}.hamburger span{background:var(--c-text);border-radius:2px;width:22px;height:2px;transition:transform .2s,opacity .2s;display:block}.mobile-menu,.mobile-controls{display:none}.dark-toggle-mobile{border:1px solid var(--c-border);cursor:pointer;color:var(--c-text-2);background:0 0;border-radius:6px;padding:.25rem .65rem;font-family:inherit;font-size:.8rem;font-weight:500;transition:color .2s,border-color .2s}@media (width<=640px){.nav-links{display:none}.hamburger{display:flex}.mobile-controls{align-items:center;gap:.75rem;display:flex}.mobile-menu{background:var(--c-mobile-menu-bg);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);border-bottom:1px solid var(--c-border-soft);z-index:99;flex-direction:column;align-items:center;gap:.75rem;padding:1rem 2rem;display:flex;position:fixed;top:64px;left:0;right:0}}.portfolio-nav{z-index:100;background:var(--c-nav-bg);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);border-bottom:1px solid var(--c-border-soft);justify-content:space-between;align-items:center;height:64px;padding:0 2rem;display:flex;position:fixed;top:0;left:0;right:0}.portfolio-nav-brand{letter-spacing:-.5px;color:var(--c-text);cursor:pointer;background:0 0;border:none;padding:0;font-family:inherit;font-size:1.1rem;font-weight:700}.nav-dark-toggle{border:1px solid var(--c-border);cursor:pointer;color:var(--c-text-2);background:0 0;border-radius:6px;padding:.25rem .65rem;font-family:inherit;font-size:.8rem;font-weight:500;transition:color .2s,border-color .2s}.nav-item{cursor:pointer;color:var(--c-text-2);letter-spacing:.01em;background:0 0;border:none;padding:.25rem 0;font-family:inherit;font-size:.9rem;font-weight:500;text-decoration:none;transition:color .2s;display:block}.nav-item:hover{color:var(--c-text)}.section-label{letter-spacing:.1em;text-transform:uppercase;color:var(--c-subtle);margin-bottom:.6rem;font-size:.78rem;font-weight:700}.section-heading{color:var(--c-text);letter-spacing:-.5px;margin:0 0 .5rem;font-size:clamp(1.6rem,3vw,2.2rem);font-weight:800;line-height:1.2}.body-text{color:var(--c-text-2);margin-bottom:1.25rem;font-size:.97rem;line-height:1.8}.body-text:last-child{margin-bottom:0}.hero-section{background:var(--c-bg-alt);justify-content:center;align-items:center;min-height:100vh;padding:4rem 2rem 2rem;display:flex}.hero-inner{text-align:center;max-width:680px}.hero-title{color:var(--c-text);letter-spacing:-1.5px;margin-bottom:1.25rem;font-size:clamp(1.6rem,3.5vw,2.4rem);font-weight:800;line-height:1.1}.hero-typewriter{color:var(--c-text-2);white-space:nowrap;font-weight:600;display:block}.hero-subtitle{color:var(--c-text-3);max-width:520px;margin:0 auto 2.5rem;font-size:1.1rem;line-height:1.75}.hero-actions{flex-wrap:wrap;justify-content:center;gap:1rem;display:flex}.about-section{background:var(--c-bg);justify-content:center;padding:6rem 2rem;display:flex}.about-inner{width:100%;max-width:680px}.experience-section{background:var(--c-bg-alt);justify-content:center;padding:6rem 2rem;display:flex}.experience-inner{width:100%;max-width:800px}.experience-list{flex-direction:column;gap:1.5rem;margin-top:2.5rem;display:flex}.experience-card{background:var(--c-bg);border:1px solid var(--c-border);border-radius:12px;padding:1.75rem}.card-header{flex-wrap:wrap;justify-content:space-between;align-items:flex-start;gap:.5rem;margin-bottom:.3rem;display:flex}.card-title{color:var(--c-text);margin:0;font-size:1.05rem;font-weight:700}.card-period{color:var(--c-muted);white-space:nowrap;font-size:.85rem;font-weight:500}.card-company{color:var(--c-text-2);margin-bottom:1rem;font-size:.9rem;font-weight:500}.card-sep{color:var(--c-border);margin:0 .3rem}.card-location{color:var(--c-muted)}.card-bullets{flex-direction:column;gap:.5rem;margin:0;padding-left:1.25rem;display:flex}.card-bullet{color:var(--c-text-3);font-size:.9rem;line-height:1.65}.card-bullet strong{color:var(--c-text-2);font-weight:600}.skills-section{background:var(--c-bg-alt);justify-content:center;padding:6rem 2rem;display:flex}.skills-inner{width:100%;max-width:800px}.skills-grid{grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:1.5rem;margin-top:2.5rem;display:grid}.skill-card{background:var(--c-bg);border:1px solid var(--c-border);border-radius:12px;padding:1.5rem}.skill-category{color:var(--c-muted);letter-spacing:.06em;text-transform:uppercase;margin-bottom:1rem;font-size:.85rem;font-weight:700}.skill-tags{flex-wrap:wrap;gap:.5rem;display:flex}.skill-tag{background:var(--c-tag-bg);border:1px solid var(--c-tag-border);color:var(--c-text);border-radius:6px;padding:.35rem .75rem;font-size:.85rem;font-weight:500}.projects-section{background:var(--c-bg);justify-content:center;padding:6rem 2rem;display:flex}.projects-inner{width:100%;max-width:800px}.projects-grid{grid-template-columns:repeat(auto-fit,minmax(340px,1fr));gap:1.5rem;margin-top:2.5rem;display:grid}.project-card{background:var(--c-bg);border:1px solid var(--c-border);cursor:pointer;color:inherit;border-radius:12px;flex-direction:column;gap:.75rem;padding:1.75rem;text-decoration:none;transition:box-shadow .2s,transform .2s,border-color .2s;display:flex}.project-card:hover{border-color:var(--c-link-arrow);transform:translateY(-2px);box-shadow:0 4px 24px #0000001f}.project-card--static{cursor:default}.project-card--static:hover{box-shadow:none;border-color:var(--c-border);transform:none}.project-header{justify-content:space-between;align-items:flex-start;display:flex}.project-title{color:var(--c-text);margin:0 0 .2rem;font-size:1.05rem;font-weight:700}.project-year{color:var(--c-subtle);font-size:.78rem;font-weight:500}.project-link-icon{color:var(--c-link-arrow);flex-shrink:0;font-size:1.1rem;transition:transform .15s}.project-card:hover .project-link-icon{transform:translate(2px,-2px)}.project-description{color:var(--c-text-3);margin:0;font-size:.9rem;line-height:1.65}.project-tags{flex-wrap:wrap;gap:.5rem;margin-top:.25rem;display:flex}.project-tag{background:var(--c-tag-bg);color:var(--c-text-2);border-radius:5px;padding:.2rem .6rem;font-size:.78rem;font-weight:500}.education-section{background:var(--c-bg);justify-content:center;padding:6rem 2rem;display:flex}.education-inner{width:100%;max-width:800px}.education-list{flex-direction:column;gap:1.5rem;margin-top:2.5rem;display:flex}.education-card{background:var(--c-bg-alt);border:1px solid var(--c-border);border-radius:12px;padding:1.75rem}.education-notes{color:var(--c-text-3);margin-top:.75rem;font-size:.88rem;line-height:1.65}.certs-section{background:var(--c-bg);justify-content:center;padding:6rem 2rem;display:flex}.certs-inner{width:100%;max-width:800px}.certs-grid{grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:1.25rem;margin-top:2.5rem;display:grid}.cert-card{background:var(--c-bg);border:1px solid var(--c-border);border-radius:12px;flex-direction:column;gap:.3rem;padding:1.5rem;display:flex}.cert-name{color:var(--c-text);margin:0;font-size:1rem;font-weight:700}.cert-meta{color:var(--c-muted);font-size:.85rem;font-weight:500}.not-found{background:var(--c-bg);text-align:center;flex-direction:column;justify-content:center;align-items:center;gap:1rem;min-height:100vh;padding:2rem;display:flex}.not-found-code{letter-spacing:-4px;color:var(--c-border);margin:0;font-size:clamp(5rem,15vw,9rem);font-weight:800;line-height:1}.not-found-title{color:var(--c-text);margin:0;font-size:1.4rem;font-weight:700}.not-found-sub{color:var(--c-text-3);margin:0;font-size:.95rem}.not-found-link{background:var(--c-text);color:var(--c-bg);border-radius:8px;margin-top:.5rem;padding:.7rem 1.6rem;font-size:.95rem;font-weight:600;text-decoration:none;transition:opacity .2s;display:inline-block}.not-found-link:hover{opacity:.8}.footer-hint{color:var(--c-subtle);letter-spacing:.02em;margin:0 0 1.25rem;font-size:.7rem}.portfolio-footer{text-align:center;border-top:1px solid var(--c-border-soft);background:var(--c-bg);color:var(--c-subtle);padding:2rem;font-size:.85rem}.portfolio-footer-links{justify-content:center;gap:1.5rem;margin-bottom:.75rem;display:flex}.portfolio-footer-link{color:var(--c-muted);font-size:.85rem;font-weight:500;text-decoration:none;transition:color .2s}.portfolio-footer-link:hover{color:var(--c-text)}@media (width<=640px){.portfolio-footer a[href=\/music]{padding:.4rem;font-size:1.25rem;display:inline-block}}.now-page{--spotify-green:#1db954;--n-bg:#0a0a0a;--n-bg-card:#161616;--n-border:#2a2a2a;--n-text:#f0f0f0;--n-text-2:#aaa;--n-text-3:#666;--n-label:#555;--n-accent:#f0f0f0;--p-bg:#0a0a0a;--p-border:#2a2a2a;--p-text:#f0f0f0;--p-text-2:#aaa;--p-text-3:#666;--p-label:#555}.now-page.light{--n-bg:#fafafa;--n-bg-card:#fff;--n-border:#d8d8d8;--n-text:#111;--n-text-2:#555;--n-text-3:#888;--n-label:#aaa;--n-accent:#111;--p-bg:#fafafa;--p-border:#d8d8d8;--p-text:#111;--p-text-2:#555;--p-text-3:#888;--p-label:#aaa}.now-page{background:var(--n-bg);min-height:100vh;color:var(--n-text);flex-direction:column;align-items:center;padding:0 2rem;display:flex}.now-content{flex-direction:row;flex:1;justify-content:center;align-items:center;gap:4rem;width:100%;max-width:900px;padding:8rem 0 4rem;display:flex}.now-manga-wrap{flex-direction:column;flex-shrink:0;align-items:center;gap:.6rem;margin:0;display:flex}.now-manga{object-fit:cover;border-radius:12px;width:363px;display:block}.now-manga-caption{color:var(--n-label);text-align:center;font-size:.75rem}.now-right{flex-direction:column;flex:1;gap:2rem;min-width:0;display:flex}.now-header{text-align:left}@media (width<=640px){.now-content{padding:6rem 0 4rem}.now-manga-wrap{display:none}}.now-label{letter-spacing:.12em;text-transform:uppercase;color:var(--n-label);margin:0 0 .6rem;font-size:.78rem;font-weight:700}.now-title{letter-spacing:-1px;color:var(--n-text);margin:0 0 .75rem;font-size:clamp(1.8rem,4vw,2.8rem);font-weight:800}.now-updated{color:var(--n-text-3);margin:0;font-size:.82rem}.now-body{flex-direction:column;gap:1rem;width:100%;display:flex}.now-location{letter-spacing:.06em;text-transform:uppercase;color:var(--n-label);margin:0;font-size:.82rem;font-weight:600}.now-line{color:var(--n-text-2);margin:0;font-size:1.05rem;line-height:1.7}.now-spotify{border-top:1px solid var(--n-border);margin-top:.5rem;padding-top:1.5rem}.now-playing-bar{width:100%;color:inherit;box-shadow:none;background:0 0;border:none;border-radius:0;justify-content:space-between;align-items:center;gap:1.5rem;padding:0;text-decoration:none;transition:opacity .2s;display:flex}.now-playing-bar.now-playing-active:hover{opacity:.8}.now-playing-info{flex-direction:column;gap:.25rem;min-width:0;display:flex}.now-playing-label{letter-spacing:.1em;text-transform:uppercase;color:var(--n-label);align-items:center;gap:.5rem;margin-bottom:.2rem;font-size:.72rem;font-weight:700;display:flex}.now-playing-dot{border-radius:50%;flex-shrink:0;width:7px;height:7px}.now-playing-dot.playing{background:var(--spotify-green);box-shadow:0 0 6px var(--spotify-green);animation:1.8s ease-in-out infinite pulse}.now-playing-dot.idle{background:#444}@keyframes pulse{0%,to{opacity:1}50%{opacity:.4}}.now-playing-song{color:var(--n-text);white-space:nowrap;text-overflow:ellipsis;font-size:1rem;font-weight:700;overflow:hidden}.now-playing-artist{color:var(--n-text-2);white-space:nowrap;text-overflow:ellipsis;font-size:.85rem;font-weight:500;overflow:hidden}.now-playing-progress-wrap{align-items:center;gap:.5rem;margin-top:.5rem;display:flex}.now-playing-time{color:var(--n-text-3);font-variant-numeric:tabular-nums;flex-shrink:0;font-size:.72rem}.now-playing-progress-track{background:var(--n-border);border-radius:99px;flex:1;height:3px;overflow:hidden}.now-playing-progress-fill{background:var(--spotify-green);border-radius:99px;height:100%;transition:width .9s linear}.now-playing-art{object-fit:cover;border-radius:8px;flex-shrink:0;width:56px;height:56px}.now-what-link{color:var(--n-text-3);margin-bottom:1rem;font-size:.8rem;text-decoration:none;transition:color .2s}.now-what-link:hover{color:var(--n-text-2)}.now-playing-text{color:var(--n-text-3);font-size:.88rem}.page-nav{background:var(--p-bg);border-bottom:1px solid var(--p-border);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);z-index:100;justify-content:space-between;align-items:center;height:64px;padding:0 2rem;display:flex;position:fixed;top:0;left:0;right:0}.page-nav-brand{letter-spacing:-.5px;color:var(--p-text);font-size:1.1rem;font-weight:700;text-decoration:none}.page-nav-toggle{border:1px solid var(--p-border);cursor:pointer;color:var(--p-text-2);background:0 0;border-radius:6px;padding:.25rem .65rem;font-family:inherit;font-size:.8rem;font-weight:500;transition:color .2s,border-color .2s}.page-footer{border-top:1px solid var(--p-border);flex-direction:column;align-items:center;gap:.75rem;width:100%;max-width:960px;margin-top:4rem;padding-top:2rem;display:flex}.page-footer-links{gap:1.5rem;display:flex}.page-footer-link{color:var(--p-text-3);font-size:.85rem;font-weight:500;text-decoration:none;transition:color .2s}.page-footer-link:hover{color:var(--p-text)}.page-footer-copy{color:var(--p-label);font-size:.82rem}.poem-page{background:#fff;justify-content:center;align-items:center;min-height:100vh;padding:2rem;display:flex}.poem-page.dark{background:#111}.poem-inner{text-align:center;flex-direction:column;gap:1rem;display:flex}.poem-line{color:#111;margin:0;font-family:Georgia,serif;font-size:clamp(1rem,2.5vw,1.3rem);line-height:1.7}.poem-page.dark .poem-line{color:#f0f0f0}