:root{font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}*{box-sizing:border-box}html,body,#root{margin:0;min-width:320px;min-height:100%}html,body{height:100%;scroll-padding-top:0;overscroll-behavior-y:contain}body{margin:0;min-height:100%;background:#f7f7f7;font-family:Montserrat,Noto Sans JP,sans-serif;overflow-x:hidden;overflow-y:hidden}body:before{content:none}.hero-layer{position:relative;width:100%;--scroll-offset: 80px;height:100svh;min-height:100svh;margin:0;padding:0;overflow:hidden;background-image:url(/Portfolio/assets/background-DQUmRiyV.png);background-size:cover;background-position:center center;background-repeat:no-repeat;background-attachment:fixed}.hero-inner{width:min(1300px,95vw);max-width:1300px;margin:0 auto;position:relative;height:100svh;min-height:100svh;box-sizing:border-box;padding:4rem 1.25rem 0;overflow-y:auto;overflow-x:hidden;scroll-snap-type:y mandatory;scroll-padding-top:50px;scroll-behavior:smooth;overscroll-behavior-y:contain;-ms-overflow-style:none;scrollbar-width:none}.hero-inner::-webkit-scrollbar{display:none}.hero-top{position:relative;height:100vh}.hero-layer:before{content:"";position:absolute;inset:0;background:#ffffff40;z-index:5;pointer-events:none}.profile{position:absolute;top:calc(50% - 280px);left:50%;transform:translate(-50%);z-index:30;text-align:left;margin-top:0;font-size:.85rem;font-weight:400;letter-spacing:.08em;color:#666;width:min(820px,100%);max-width:820px;box-sizing:border-box}.profile-title{font-size:1rem;font-weight:600;letter-spacing:.32em;text-transform:uppercase;color:#a97812;margin-bottom:1.5rem}.profile-title:after{content:"";display:block;width:36px;height:1px;margin-top:.6rem;background:#a9781299}.name-block{margin-bottom:.2rem}.name-ja{font-family:Noto Sans JP,Montserrat,sans-serif;font-size:clamp(2rem,3vw,3rem);font-weight:550;letter-spacing:.04em;color:#555;line-height:1.05;margin:0}.name-en{margin-top:.4rem;font-size:clamp(.75rem,1.8vw,.9rem);font-weight:500;letter-spacing:.24em;color:#666;margin-bottom:2.5rem}.role{margin-top:.2rem;font-size:clamp(.9rem,1.5vw,1.2rem);font-weight:600;letter-spacing:.1em;color:#555;margin-bottom:1rem}.stack-label{margin-top:1.5rem;font-size:.9rem;font-weight:600;letter-spacing:.2em;color:#999;text-transform:uppercase;margin-bottom:.05rem}.stack{font-size:clamp(.8rem,1.3vw,1rem);font-weight:500;letter-spacing:.08em;color:#444;margin:0;margin-bottom:.05rem}.github{display:inline-block;margin-top:.1rem;margin-bottom:.2rem;font-size:.8rem;font-weight:500;letter-spacing:.08em;color:#555;text-decoration:none;transition:color .2s ease,opacity .2s ease}.github:after{content:" →";opacity:0;transition:opacity .2s ease}.github:hover{color:#a97812;opacity:.9}.github:hover:after{opacity:.6}.location,.education{line-height:1.4}.location{margin-top:1rem;font-size:.8rem;font-weight:400;letter-spacing:.12em;color:#666;margin-bottom:0}.education{margin-top:.25rem;font-size:.8rem;font-weight:400;opacity:.9;letter-spacing:.08em;color:#777}.contact-label{margin-top:1.5rem;font-size:.9rem;font-weight:600;letter-spacing:.1em;color:#999;text-transform:uppercase;margin-bottom:.05rem}.contact-mail{display:inline-block;margin-top:.05rem;margin-bottom:.2rem;font-size:.8rem;font-weight:500;letter-spacing:.08em;color:#555;text-decoration:none;transition:color .2s ease,opacity .2s ease}.contact-mail:after{content:" →";opacity:0;transition:opacity .2s ease}.contact-mail:hover{color:#a97812;opacity:.9}.contact-mail:hover:after{opacity:.6}.contact:after{content:"";display:block;width:36px;height:1px;margin-top:.6rem;background:#a9781299}@media(max-width:768px){body{--mobile-overlay-inset-x: 10px;--mobile-overlay-opacity: .82;--mobile-overlay-size: 111% 108%;--mobile-overlay-pos-y: 2px;--mobile-back-size: auto 100%;--mobile-back-opacity: .9}body.mobile-bg-soft{--mobile-overlay-inset-x: 14px;--mobile-overlay-opacity: .68;--mobile-overlay-size: 108% 105%;--mobile-overlay-pos-y: 2px;--mobile-back-size: auto 100%;--mobile-back-opacity: .88}body.mobile-bg-vivid{--mobile-overlay-inset-x: 8px;--mobile-overlay-opacity: .9;--mobile-overlay-size: 114% 111%;--mobile-overlay-pos-y: 1px;--mobile-back-size: auto 100%;--mobile-back-opacity: .94}.hero-layer>img.overlay,.hero-layer .overlay{display:none}.hero-layer{background-image:none;background-color:#ececf3}.hero-layer:before{content:"";position:fixed;inset:0 var(--mobile-overlay-inset-x);background-image:url(/Portfolio/assets/mobile_overlay-B-lsV64x.png);background-size:var(--mobile-overlay-size);background-position:center var(--mobile-overlay-pos-y);background-repeat:no-repeat;opacity:var(--mobile-overlay-opacity);pointer-events:none;z-index:10}.hero-layer:after{content:"";position:fixed;inset:0;background-image:url(/Portfolio/assets/mobile_back-DnbCVwiP.jpg);background-size:var(--mobile-back-size);background-position:center center;background-repeat:no-repeat;opacity:var(--mobile-back-opacity);pointer-events:none;z-index:0}html,body{height:auto}body{overflow-y:auto}.hero-layer{height:auto;min-height:100svh;overflow:visible;padding:1.5rem 0 2rem;background-attachment:scroll}.hero-inner{height:auto;min-height:auto;padding:1.5rem 1rem 0;overflow:visible;scroll-snap-type:none;scroll-padding-top:0}.hero-top{height:auto;min-height:85svh}.profile{position:relative;left:auto;top:auto;transform:none;width:calc(100vw - (var(--mobile-overlay-inset-x) * 2) - 36px);max-width:700px;margin:2.5rem auto 0;text-align:center}.about-section,.works-section,.skills-section{padding-left:calc(var(--mobile-overlay-inset-x) + 10px);padding-right:calc(var(--mobile-overlay-inset-x) + 10px)}.scroll-indicator{position:relative;top:auto;left:auto;bottom:auto;transform:none;display:block;margin:2.8rem auto 0}.scroll-indicator:hover,.scroll-indicator:focus-visible{transform:translateY(-1px)}.name-ja{font-size:clamp(1.8rem,7.5vw,2.6rem);letter-spacing:.02em}.name-en{letter-spacing:.2em}.role,.stack,.location{font-size:clamp(.8rem,2.2vw,1rem)}}.scroll-indicator{position:absolute;top:calc(50% + 100px);left:50%;transform:translate(-50%);bottom:6vh;z-index:40;background:none;border:none;padding:0;font-family:Montserrat,sans-serif;font-size:.75rem;font-weight:600;letter-spacing:.32em;text-transform:uppercase;color:#666;cursor:pointer;transition:color .2s ease,opacity .2s ease,transform .2s ease}.scroll-indicator:after{content:"";position:absolute;left:50%;bottom:-6px;width:100%;height:1px;background:currentColor;opacity:0;transform:translate(-50%) scaleX(.6);transform-origin:center;transition:opacity .25s ease,transform .25s ease}.scroll-indicator:hover,.scroll-indicator:focus-visible{color:#a97812;transform:translate(-50%) translateY(-1px)}.scroll-indicator:hover:after,.scroll-indicator:focus-visible:after{opacity:.6;transform:translate(-50%) scaleX(1)}.hero-layer,.hero-layer *{filter:none!important;perspective:none!important}.hero-top,.about-section,.works-section,.skills-section{scroll-snap-align:start;scroll-snap-stop:always}.hero-layer>img.overlay,.hero-layer .overlay{--overlay-shift-x: 0px;--overlay-shift-y: 0px;position:fixed;top:50%;left:50%;transform:translate(calc(-50% + var(--overlay-shift-x)),calc(-50% + var(--overlay-shift-y)));width:min(1300px,95vw);height:auto;object-fit:contain;z-index:20;pointer-events:none;opacity:.85;display:block}@media(max-width:768px){.hero-layer>img.overlay,.hero-layer .overlay{display:none!important}}.about-section{height:100svh;min-height:100svh;box-sizing:border-box;padding:5rem 1.25rem 4rem;scroll-margin-top:calc(var(--scroll-offset, 0px) + 240px);display:block;position:relative;z-index:40;background:transparent;color:#333;border-top:none}.about-wrap{width:min(820px,100%);max-width:820px;margin:0 auto;box-sizing:border-box;padding-left:0}.about-header{margin:0 auto 3rem;max-width:100%}.about-eyebrow{margin:0 0 1.5rem;font-size:1rem;font-weight:600;letter-spacing:.32em;text-transform:uppercase;color:#a97812}.about-eyebrow:after{content:"";display:block;width:36px;height:1px;margin-top:.6rem;background:#a9781299}.about-lead{margin:0;line-height:1.8;font-size:clamp(.98rem,1.6vw,1.1rem);color:#444}.about-body{max-width:100%;margin:0 auto;background:#f8f9fa52;border:1px solid rgba(169,120,18,.18);border-radius:16px;padding:1.75rem 1.8rem;box-shadow:0 10px 26px #00000014}.about-body p{margin:0;line-height:1.8;color:#444;font-size:.95rem}.about-body p+p{margin-top:1rem}.about-body p:last-child{margin-bottom:0}@media(max-width:920px){.about-wrap{width:min(820px,100%)}}@media(max-width:720px){.about-section{height:auto;min-height:auto;padding:4rem 1rem 3rem}.about-header,.about-body{max-width:100%}}@media(prefers-reduced-motion:reduce){.about-section,.about-wrap,.about-header,.about-body{scroll-behavior:auto}}.works-section{height:100svh;min-height:100svh;box-sizing:border-box;margin-top:0;padding:5rem 1.25rem 6rem;display:block;position:relative;z-index:40;color:#333}.works-wrap{width:min(820px,100%);max-width:820px;margin:0 auto;box-sizing:border-box;padding-left:0}.works-header{margin:0 auto 2rem;max-width:100%}.works-eyebrow{margin:0 0 1.25rem;font-size:1rem;font-weight:600;letter-spacing:.32em;text-transform:uppercase;color:#a97812}.works-eyebrow:after{content:"";display:block;width:36px;height:1px;margin-top:.6rem;background:#a9781299}.works-lead{margin:0;line-height:1.8;font-size:clamp(.98rem,1.6vw,1.1rem);color:#444}.works-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1rem;max-width:100%;margin:0 auto}.work-card{background:#f8f9fa59;border:1px solid rgba(169,120,18,.18);border-radius:16px;padding:1.25rem 1.3rem;box-shadow:0 10px 24px #00000014}.work-title{margin:0 0 .75rem;font-size:1.05rem;font-weight:700;letter-spacing:.04em;color:#444}.work-description{margin:0;line-height:1.75;color:#444;font-size:.92rem}.work-tech{margin:.85rem 0 0;font-size:.8rem;letter-spacing:.08em;color:#666}.work-link,.work-link-placeholder{display:inline-block;margin-top:.9rem;font-size:.8rem;letter-spacing:.08em}.work-link{color:#555;text-decoration:none}.work-link:hover{color:#a97812}.work-link-placeholder{color:#888}@media(max-width:920px){.works-wrap{width:min(820px,100%)}.works-grid{max-width:100%}}@media(max-width:720px){.works-section{height:auto;min-height:auto;padding:4rem 1rem 4.5rem}.works-grid{grid-template-columns:1fr}}.skills-section{height:100svh;min-height:100svh;box-sizing:border-box;padding:5rem 1.25rem 6rem;display:block;position:relative;z-index:40;color:#333}.skills-wrap{width:min(820px,100%);max-width:820px;margin:0 auto;box-sizing:border-box}.skills-header{margin:0 auto 2rem;max-width:100%}.skills-eyebrow{margin:0 0 1.25rem;font-size:1rem;font-weight:600;letter-spacing:.32em;text-transform:uppercase;color:#a97812}.skills-eyebrow:after{content:"";display:block;width:36px;height:1px;margin-top:.6rem;background:#a9781299}.skills-lead{margin:0;line-height:1.8;font-size:clamp(.98rem,1.6vw,1.1rem);color:#444}.skills-summary{margin:1rem 0 0;color:#7a7a7a;font-size:.85rem;letter-spacing:.06em}.skills-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:1rem}.skills-card{padding:0 1rem}.skills-card+.skills-card{border-left:1px solid rgba(145,100,15,.65)}.skills-card-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:.85rem}.skills-title{margin:0;font-size:1rem;font-weight:700;color:#444}.skills-count{display:inline-flex;align-items:center;justify-content:center;min-width:1.7rem;height:1.7rem;padding:0 .5rem;border-radius:999px;font-size:.76rem;color:#6c4c0f;background:#a9781224;border:1px solid rgba(169,120,18,.2)}.skills-list{margin:0;padding:0;list-style:none;display:grid;grid-template-columns:1fr;gap:.8rem .75rem}.skills-item{position:relative;margin:0;padding-left:1rem;padding-right:0;font-size:.92rem;color:#444;line-height:1.9;display:flex;align-items:center;gap:.5rem}.skills-item:before{content:"";position:absolute;left:0;top:.72em;width:.36rem;height:.36rem;border-radius:50%;background:#a97812b8}.skills-item-name{display:inline-block}.skills-item-divider{flex:1;border-bottom:1px dashed rgba(145,100,15,.6);transform:translateY(1px)}.skills-item-level{display:inline-block;min-width:2.4rem;text-align:right;font-size:.78rem;letter-spacing:.04em;color:#6c4c0f}@media(max-width:920px){.skills-wrap{width:min(820px,100%)}.skills-grid{grid-template-columns:1fr;gap:1.25rem}.skills-card{padding:0}.skills-card+.skills-card{border-left:none;border-top:1px solid rgba(145,100,15,.5);padding-top:1.25rem}}@media(max-width:720px){.skills-section{height:auto;min-height:auto;padding:4rem 1rem 4.5rem}}