*{box-sizing:border-box}body{margin:0;background:#02000a;color:#e8ecff;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Noto Sans JP,sans-serif;line-height:1.7;-webkit-font-smoothing:antialiased}.portfolio{position:relative;min-height:100vh;background:linear-gradient(rgba(168,184,255,.06) 1px,transparent 1px),linear-gradient(90deg,rgba(168,184,255,.06) 1px,transparent 1px),linear-gradient(rgba(168,184,255,.12) 1px,transparent 1px),linear-gradient(90deg,rgba(168,184,255,.12) 1px,transparent 1px),radial-gradient(ellipse at top,#0d1230,#070920 60%,#02020f);background-size:40px 40px,40px 40px,200px 200px,200px 200px,100% 100%;background-position:0 0,0 0,0 0,0 0,0 0}.portfolio:before{content:"";position:fixed;top:30%;left:0;right:0;height:240px;pointer-events:none;z-index:0;background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1200 240' preserveAspectRatio='none'><path d='M0,120 Q150,40 300,120 T600,120 T900,120 T1200,120' fill='none' stroke='rgba(168,184,255,0.18)' stroke-width='1.2'/><path d='M0,120 Q150,200 300,120 T600,120 T900,120 T1200,120' fill='none' stroke='rgba(168,184,255,0.12)' stroke-width='1'/></svg>");background-size:100% 100%;opacity:.7}.starfield{position:absolute;top:0;right:0;bottom:0;left:0;z-index:0;pointer-events:none}.nav{position:fixed;top:0;left:0;right:0;z-index:100;display:flex;justify-content:space-between;align-items:center;padding:18px 32px;background:#02000feb;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border-bottom:1px solid rgba(150,170,255,.1);opacity:0;pointer-events:none;transform:translateY(-10px);transition:opacity .6s ease,transform .6s ease}.nav.is-visible{opacity:1;pointer-events:auto;transform:translateY(0)}.nav-brand{background:transparent;border:0;padding:0;color:#fff;font-weight:700;letter-spacing:.14em;text-decoration:none;text-transform:lowercase;cursor:pointer;font-family:inherit;font-size:inherit;transition:opacity .2s}.nav-brand:hover{opacity:.7}.nav-links{display:flex;gap:24px}.nav-links a{color:#c8d2ffb3;text-decoration:none;font-size:.88rem;letter-spacing:.08em;transition:color .2s}.nav-links a:hover{color:#fff}.hero{position:fixed;top:0;left:0;right:0;height:100vh;z-index:50;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:80px 24px;text-align:center;background:radial-gradient(ellipse at center,#0b0525,#02000a 70%,#000);transition:opacity .6s ease}.portfolio.is-entered .hero{opacity:0;pointer-events:none}.hero-inner{position:relative;z-index:2;display:flex;flex-direction:column;align-items:center;gap:16px;animation:fadeInUp 1.8s ease-out}.hero-eyebrow{margin:0;font-size:1rem;letter-spacing:.6em;color:#c8d2ff8c;animation:drift 6s ease-in-out infinite}.hero-title{margin:0;font-family:Orbitron,Space Grotesk,sans-serif;font-size:clamp(3rem,11vw,7.5rem);font-weight:500;letter-spacing:.2em;text-transform:uppercase;background:linear-gradient(180deg,#fff,#d8c4ff 45%,#8fa0ff);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;filter:drop-shadow(0 0 24px rgba(168,184,255,.55)) drop-shadow(0 0 48px rgba(200,180,255,.25));animation:titleGlow 4s ease-in-out infinite}@keyframes titleGlow{0%,to{filter:drop-shadow(0 0 24px rgba(168,184,255,.55)) drop-shadow(0 0 48px rgba(200,180,255,.25))}50%{filter:drop-shadow(0 0 32px rgba(200,180,255,.75)) drop-shadow(0 0 72px rgba(180,160,255,.35))}}.hero-subtitle{margin:0 0 28px;max-width:600px;font-family:Orbitron,Space Grotesk,sans-serif;font-size:clamp(.78rem,1.4vw,.92rem);font-weight:400;letter-spacing:.4em;text-transform:uppercase;color:#c8d2ffa6}.hero-hint{margin:32px 0 0;font-size:.78rem;letter-spacing:.35em;color:#c8d2ff8c;text-transform:uppercase;animation:drift 3s ease-in-out infinite}.hero{overflow:hidden}.rocket{position:relative;margin:40px auto 0;width:72px;height:116px;padding:0;background:transparent;border:0;cursor:pointer;z-index:3;transition:transform .3s ease,filter .3s ease;filter:drop-shadow(0 0 18px rgba(168,184,255,.55))}.rocket:hover{transform:translateY(-10px);filter:drop-shadow(0 0 28px rgba(168,184,255,.9))}.rocket:hover .rocket-flame{opacity:1;height:34px}.rocket-body{width:100%;height:100%;animation:hover 2.2s ease-in-out infinite}.rocket-body svg{width:100%;height:100%}.rocket-flame{position:absolute;bottom:-6px;left:50%;transform:translate(-50%);width:22px;height:20px;border-radius:50%;background:radial-gradient(ellipse at top,#fff2c4,#ff9453 40%,#ff642800 75%);opacity:.6;transition:opacity .3s,height .3s;pointer-events:none}.rocket.is-launching{animation:rocketLaunch 1.4s cubic-bezier(.45,0,.3,1) forwards;pointer-events:none}.rocket.is-launching .rocket-body{animation:none}.rocket.is-launching .rocket-flame{opacity:1;animation:flame .15s ease-in-out infinite alternate}.hero.is-launching .hero-inner{opacity:0;transition:opacity .4s ease}.starfield{transition:opacity .6s ease}.hero.is-launching .starfield{opacity:0}.hero-sky{position:fixed;top:0;bottom:0;width:50vw;z-index:200;pointer-events:none;overflow:hidden;background-color:#02000a;background-image:radial-gradient(ellipse at center,#0b0525,#02000a 70%,#000);background-size:100vw 100vh;background-repeat:no-repeat}.hero-sky--left{left:0;background-position:0 0;transform:translate(0);transition:transform 1.4s cubic-bezier(.65,0,.2,1)}.hero-sky--right{right:0;background-position:-50vw 0;transform:translate(0);transition:transform 1.4s cubic-bezier(.65,0,.2,1)}.hero-sky--left.is-open{transform:translate(-100%)}.hero-sky--right.is-open{transform:translate(100%)}.btn{display:inline-flex;align-items:center;padding:14px 32px;border-radius:999px;font-size:.88rem;letter-spacing:.12em;text-transform:uppercase;text-decoration:none;cursor:pointer;transition:transform .2s,box-shadow .3s,background .3s;border:1px solid rgba(200,210,255,.4);-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px)}.btn-primary{background:linear-gradient(135deg,#a8b8ff59,#6a7fff4d);color:#fff;box-shadow:0 8px 24px #6a7fff40}.btn-primary:hover{transform:translateY(-2px);background:linear-gradient(135deg,#a8b8ff8c,#6a7fff73);box-shadow:0 12px 32px #6a7fff66}.btn-ghost{background:transparent;color:#dce1ffe6}.btn-ghost:hover{background:#96aaff1f;border-color:#c8d2ffcc;transform:translateY(-2px)}.side-decor{position:fixed;top:0;bottom:0;width:220px;z-index:2;pointer-events:none;opacity:0;animation:sideFadeIn 1.4s ease-out .4s forwards;font-family:SF Mono,JetBrains Mono,Cascadia Code,monospace;font-size:.72rem;letter-spacing:.04em;color:#a8b8ff6b}.side-decor--left{left:0}.side-decor--right{right:0}.side-axis{position:absolute;top:0;height:100%;width:40px;opacity:.9}.side-decor--left .side-axis{left:8px}.side-decor--right .side-axis{right:8px}.side-curve{position:absolute;top:0;height:100%;width:80px;opacity:.7}.side-decor--left .side-curve{left:48px}.side-decor--right .side-curve{right:48px}.side-formula{position:absolute;white-space:nowrap;padding:4px 8px;background:#02000f73;border:1px solid rgba(168,184,255,.15);border-radius:2px;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);animation:sideDrift 12s ease-in-out infinite}.side-decor--left .side-formula{left:56px;animation-delay:calc(var(--i, 0) * -2s)}.side-decor--right .side-formula{right:56px;animation-delay:calc(var(--i, 0) * -2.5s)}.side-decor--left .side-formula:nth-child(3){animation-delay:-1s}.side-decor--left .side-formula:nth-child(4){animation-delay:-3s}.side-decor--left .side-formula:nth-child(5){animation-delay:-5s}.side-decor--left .side-formula:nth-child(6){animation-delay:-7s}.side-decor--left .side-formula:nth-child(7){animation-delay:-9s}.side-decor--left .side-formula:nth-child(8){animation-delay:-11s}.side-decor--right .side-formula:nth-child(3){animation-delay:-2s}.side-decor--right .side-formula:nth-child(4){animation-delay:-4s}.side-decor--right .side-formula:nth-child(5){animation-delay:-6s}.side-decor--right .side-formula:nth-child(6){animation-delay:-8s}.side-decor--right .side-formula:nth-child(7){animation-delay:-10s}.side-decor--right .side-formula:nth-child(8){animation-delay:-12s}.side-decor--right .side-formula:nth-child(9){animation-delay:-14s}@keyframes sideDrift{0%,to{transform:translate(0);opacity:.45}50%{transform:translate(6px);opacity:.75}}.side-decor--right .side-formula{animation-name:sideDriftRight}@keyframes sideDriftRight{0%,to{transform:translate(0);opacity:.45}50%{transform:translate(-6px);opacity:.75}}@keyframes sideFadeIn{0%{opacity:0}to{opacity:1}}@media(max-width:1100px){.side-decor{display:none}}.section{position:relative;z-index:1;padding:120px 24px;min-height:100vh;display:flex;align-items:center;justify-content:center}.section-inner{position:relative;width:100%;max-width:980px;margin:0 auto;padding:48px;border-radius:8px;background:#06081cc7;border:1px solid rgba(150,170,255,.22);-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);box-shadow:0 24px 80px #00000080,inset 0 0 0 1px #a8b8ff0d}.section-inner:before,.section-inner:after{content:"";position:absolute;width:18px;height:18px;border-color:#a8b8ff80;border-style:solid;pointer-events:none}.section-inner:before{top:-1px;left:-1px;border-width:1px 0 0 1px}.section-inner:after{bottom:-1px;right:-1px;border-width:0 1px 1px 0}.section-label{margin:0 0 12px;font-size:.78rem;letter-spacing:.3em;text-transform:uppercase;color:#a8b8ffe6;font-family:SF Mono,JetBrains Mono,Cascadia Code,monospace}.section-label:before{content:"// ";color:#a8b8ff80}.section-title{margin:0 0 40px;font-size:clamp(1.8rem,3.5vw,2.6rem);font-weight:300;letter-spacing:.06em;color:#fff}.about-grid{display:grid;grid-template-columns:auto 1fr;gap:32px;align-items:center}.avatar-ring{width:120px;height:120px;display:grid;place-items:center;border-radius:50%;background:linear-gradient(135deg,#a8b8ffcc,#6a7fff99);box-shadow:0 0 40px #96aaff4d}.avatar-core{width:100px;height:100px;border-radius:50%;object-fit:cover;background:#02000feb;display:block}.about-text p{margin:0 0 12px;color:#dce1ffd9}.skills-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:20px}.skill-card{padding:24px;border-radius:18px;background:#02000f66;border:1px solid rgba(150,170,255,.12)}.skill-card h3{margin:0 0 16px;font-size:.95rem;letter-spacing:.12em;text-transform:uppercase;color:#a8b8ff}.skill-card ul{margin:0;padding-left:18px;color:#dce1ffd9}.skill-card li{margin:6px 0;font-size:.9rem}.works-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:24px}.work-card{display:flex;flex-direction:column;gap:14px;padding:28px;border-radius:20px;background:#02000f80;border:1px solid rgba(150,170,255,.15);transition:transform .3s,box-shadow .3s}.work-card:hover{transform:translateY(-4px);box-shadow:0 20px 40px #6a7fff33;border-color:#96aaff59}.work-card h3{margin:0;font-size:1.25rem;color:#fff;letter-spacing:.04em}.work-card p{margin:0;color:#dce1ffcc;font-size:.92rem}.tags{display:flex;flex-wrap:wrap;gap:8px}.tag{padding:4px 10px;border-radius:999px;background:#a8b8ff1f;border:1px solid rgba(168,184,255,.2);font-size:.75rem;color:#c6cfff;letter-spacing:.04em}.work-links{display:flex;gap:16px;margin-top:auto;padding-top:8px}.work-links a{color:#a8b8ff;text-decoration:none;font-size:.85rem;letter-spacing:.06em;transition:color .2s}.work-links a:hover{color:#fff}.timeline{list-style:none;padding:0;margin:0;position:relative}.timeline:before{content:"";position:absolute;top:0;bottom:0;left:100px;width:1px;background:linear-gradient(180deg,transparent,rgba(168,184,255,.3),transparent)}.timeline li{display:grid;grid-template-columns:100px 1fr;gap:24px;padding:18px 0;position:relative}.timeline-year{font-weight:600;color:#a8b8ff;letter-spacing:.06em}.timeline li:before{content:"";position:absolute;left:96px;top:28px;width:9px;height:9px;border-radius:50%;background:#a8b8ff;box-shadow:0 0 12px #a8b8ffcc}.timeline-body strong,.timeline-body .timeline-title{display:block;color:#fff;font-size:1.05rem;margin-bottom:4px;text-decoration:none}.timeline-body .timeline-title{color:#c6cfff;transition:color .2s}.timeline-body .timeline-title:hover{color:#fff}.timeline-body p{margin:0;color:#dce1ffcc;font-size:.92rem}.contact-intro{margin:0 0 28px;color:#dce1ffd9}.contact-links{display:flex;flex-wrap:wrap;gap:16px}.footer{position:relative;z-index:1;padding:48px 24px;text-align:center;color:#c8d2ff66;font-size:.85rem;letter-spacing:.2em;text-transform:uppercase}.footer p{margin:0}@keyframes fadeInUp{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}@keyframes pulse{0%,to{opacity:.5;transform:translate(-50%) translateY(0)}50%{opacity:.2;transform:translate(-50%) translateY(6px)}}@keyframes drift{0%,to{opacity:.55;letter-spacing:.6em}50%{opacity:.85;letter-spacing:.8em}}@keyframes breathe{0%,to{transform:scale(1)}50%{transform:scale(1.04)}}@keyframes hover{0%,to{transform:translateY(0)}50%{transform:translateY(-8px)}}@keyframes flame{0%{height:20px;opacity:.85}to{height:38px;opacity:1}}@keyframes rocketLaunch{0%{transform:translateY(0)}10%{transform:translateY(8px)}25%{transform:translateY(-30px) scale(1.02)}to{transform:translateY(-110vh) scale(.6)}}@media(max-width:720px){.nav{padding:14px 20px}.nav-links{gap:14px}.nav-links a{font-size:.8rem}.section{padding:80px 16px}.section-inner{padding:28px}.about-grid{grid-template-columns:1fr;text-align:center}.avatar-ring{margin:0 auto}.timeline:before{left:80px}.timeline li{grid-template-columns:80px 1fr;gap:16px}.timeline li:before{left:76px}}*{margin:0;padding:0;box-sizing:border-box}html,body,#root{width:100%;background:#000;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif}