:root{--paper:#f3f0e7;--card:#fbfaf6;--ink:#202b30;--muted:#5e686f;--rule:#d7d1c3;--blue:#2f4d74;--green:#2f6d4f;--serif:Georgia,"Yu Mincho","Hiragino Mincho ProN",serif;--sans:"Avenir Next","Segoe UI","Yu Gothic UI",system-ui,sans-serif;font-family:var(--sans);color:var(--ink);background:var(--paper);font-synthesis:none;scroll-behavior:smooth;scroll-padding-top:32px}*{box-sizing:border-box}body{margin:0}a{color:inherit;text-decoration:none}button{font:inherit;color:inherit;cursor:pointer}img{display:block;max-width:100%;height:auto}button,a,summary{-webkit-tap-highlight-color:transparent}a:focus-visible,button:focus-visible,summary:focus-visible{outline:3px solid var(--green);outline-offset:5px}button:disabled{cursor:default}.wrap{width:min(1280px,calc(100% - 96px));margin-inline:auto}.site-header{min-height:100px;display:flex;align-items:center;justify-content:space-between;gap:24px;border-bottom:1px solid var(--rule)}.brand{display:flex;align-items:center;gap:13px;font-size:12px;font-weight:650}.brand-icons{display:flex;align-items:center;gap:5px}.site-header nav{display:flex;gap:28px;font-size:12px}.site-header nav a:hover,.text-link:hover{color:var(--green)}.language{display:flex;padding:4px;border:1px solid var(--rule);border-radius:6px;flex-shrink:0}.language button{border:0;background:transparent;padding:7px 9px;font-size:11px;border-radius:3px}.language [aria-pressed=true]{background:var(--blue);color:white}.hero{display:grid;grid-template-columns:1fr 1.06fr;gap:50px;padding-block:84px 76px;align-items:center;min-height:690px}.eyebrow{font-size:10px;font-weight:650;letter-spacing:.16em;color:var(--blue);margin:0 0 28px;line-height:1.6}.hero h1{font-family:var(--serif);font-weight:400;font-size:clamp(54px,5.8vw,84px);line-height:1.06;letter-spacing:-.055em;margin:0 0 28px}.hero h1 em{color:var(--blue);font-weight:400}.intro{font-size:17px;line-height:1.8;max-width:445px;color:var(--muted);margin:0 0 32px}.button{display:inline-flex;align-items:center;justify-content:space-between;gap:32px;padding:17px 22px;font-size:12px;font-weight:600;border-radius:4px}.primary{background:var(--blue);color:#fff;transition:background .2s}.primary:hover{background:#243d5e}.hero-note{font-size:10px;margin-top:23px;color:var(--muted)}.hero-art{position:relative;height:480px}.visual-caption{display:flex;align-items:center;gap:8px;font-size:10px;color:var(--muted);padding-left:14px}.status-dot{width:6px;height:6px;background:var(--green);border-radius:50%}.hero-screen{position:absolute;margin:0;border:1px solid #c7c6bb;border-radius:7px;overflow:hidden;background:var(--card);box-shadow:0 20px 35px #25352b12}.hero-screen>img{width:100%}.screen-one{top:43px;left:0;width:83%;transform:rotate(-3deg)}.screen-two{bottom:16px;right:-7px;width:85%;transform:rotate(3deg)}.screen-label{padding:8px 12px;display:flex;align-items:center;gap:8px;border-bottom:1px solid var(--rule);background:var(--card);font-size:10px;font-weight:600}.screen-kind{margin-left:auto;font-size:8px;font-weight:400;color:var(--muted)}.art-footnote{position:absolute;bottom:-24px;right:0;font-size:9px;color:var(--muted)}.principles{border-block:1px solid var(--rule);padding-block:23px;display:flex;justify-content:space-between;gap:24px;font-size:11px;color:var(--muted)}.principles>span:first-child{color:var(--ink);font-weight:600}.project{padding-block:86px 92px}.project-heading{margin-bottom:38px}.project-heading .eyebrow{margin-bottom:15px}.product-name{display:flex;align-items:center;gap:17px}.product-name h2{font:400 45px/1.1 var(--serif);letter-spacing:-.035em;margin:0}.project-tagline{font-size:15px;color:var(--muted);margin:12px 0 0 81px}.project-grid{display:grid;grid-template-columns:.78fr 1.22fr;gap:65px;align-items:center}.body-large{font-size:16px;line-height:1.85;margin:0 0 22px}.feature-list{list-style:none;padding:0;margin:0}.feature-list li{display:flex;gap:17px;padding:17px 0;border-top:1px solid var(--rule)}.feature-list li>span{font-size:10px;color:var(--green);padding-top:4px}.feature-list h3{font-size:13px;font-weight:650;margin:0 0 6px}.feature-list p{font-size:12px;line-height:1.8;color:var(--muted);margin:0}.product-tags{display:flex;flex-wrap:wrap;gap:7px;margin-top:20px}.product-tags span{border:1px solid var(--rule);padding:5px 9px;font-size:9px;border-radius:3px;color:var(--muted)}.gallery{min-width:0}.gallery-tabs{display:flex;gap:18px;border-bottom:1px solid var(--rule);margin-bottom:18px}.gallery-tabs button{background:none;border:0;border-bottom:2px solid transparent;padding:0 0 12px;font-size:11px;color:var(--muted)}.gallery-tabs [aria-pressed=true]{border-bottom-color:var(--blue);color:var(--blue);font-weight:600}.image-button{display:block;padding:0;border:1px solid var(--rule);border-radius:5px;overflow:hidden;background:var(--card);width:100%;position:relative;box-shadow:0 15px 30px #24342f0c}.gallery-image{width:100%;height:450px;object-fit:contain;background:var(--card)}.zoom-label{position:absolute;right:10px;bottom:10px;background:var(--card);border:1px solid var(--rule);border-radius:3px;padding:6px 10px;font-size:9px;opacity:0;transition:opacity .15s}.image-button:hover .zoom-label,.image-button:focus-visible .zoom-label{opacity:1}.gallery-caption{font-size:10px;line-height:1.6;color:var(--muted);margin:13px 0 0}.bird-section{background:#e9eee9;border-block:1px solid #d5ded5}.bird-grid{grid-template-columns:1.22fr .78fr}.bird-grid .gallery-image{height:350px}.bird-section .project-heading{margin-bottom:40px}.rhythm{padding-block:82px;display:grid;grid-template-columns:.75fr 1.4fr;gap:75px;border-bottom:1px solid var(--rule)}.rhythm h2,.craft h2{font:400 36px/1.2 var(--serif);letter-spacing:-.025em;margin:0}.rhythm-steps{display:grid;grid-template-columns:repeat(3,1fr);gap:28px}.step-number{font:italic 30px var(--serif);color:#879b8d}.rhythm h3{font-size:13px;margin:17px 0 10px}.rhythm-steps p{font-size:12px;line-height:1.85;color:var(--muted);margin:0}.craft{padding-block:82px;display:grid;grid-template-columns:1fr 1fr;gap:90px}.craft-heading>p:last-child{font-size:14px;line-height:1.85;color:var(--muted);max-width:465px;margin:23px 0 0}.craft details{border-bottom:1px solid var(--rule);padding:23px 0}.craft details:first-child{border-top:1px solid var(--rule)}.craft summary{cursor:pointer;font-size:14px;line-height:1.6;padding-right:10px}.craft details p{font-size:12px;line-height:1.85;color:var(--muted);margin:16px 0 0}.closing{text-align:center;border-top:1px solid var(--rule);padding-block:64px 68px}.closing-icons{display:flex;justify-content:center;align-items:center;gap:20px;margin-bottom:24px}.closing .eyebrow{margin-bottom:18px}.closing h2{font:400 44px/1.2 var(--serif);letter-spacing:-.025em;margin:0 0 29px}.text-link{display:inline-flex;gap:28px;font-size:12px;padding-bottom:7px;border-bottom:1px solid var(--rule)}footer{display:flex;justify-content:space-between;gap:30px;font-size:10px;color:var(--muted);padding-block:23px 30px;border-top:1px solid var(--rule)}.skip-link{position:absolute;top:-100px;left:20px;padding:15px;background:white;z-index:5}.skip-link:focus{top:10px}dialog{width:min(1450px,96vw);max-width:96vw;max-height:94dvh;padding:16px;background:var(--card);border:1px solid var(--rule);border-radius:8px}dialog::backdrop{background:#16232edb}.lightbox-toolbar{display:flex;justify-content:space-between;gap:20px;align-items:center;margin-bottom:14px;font-size:12px}.lightbox-toolbar p{margin:0}.lightbox-toolbar button{background:var(--blue);color:white;border:0;border-radius:4px;padding:9px 18px}#lightbox-image{max-height:calc(94dvh - 90px);width:100%;object-fit:contain}html:lang(ja) .hero h1{font-style:normal;font-size:clamp(40px,4.5vw,65px);letter-spacing:-.035em;line-height:1.35}html:lang(ja) .hero h1 em{font-style:normal}html:lang(ja) .intro{font-size:15px}html:lang(ja) .craft h2,html:lang(ja) .rhythm h2{font-size:30px;line-height:1.5}html:lang(ja) .closing h2{font-size:36px;line-height:1.5}
/* Personal-site additions: hero actions, live-app links, about, resume, contact */
.hero-actions{display:flex;flex-wrap:wrap;gap:12px}.button.secondary{background:transparent;border:1px solid var(--rule);color:var(--ink);transition:border-color .2s,color .2s}.button.secondary:hover{border-color:var(--blue);color:var(--blue)}.hero-screen>a{display:block;color:inherit}.hero-screen{transition:border-color .2s}.hero-screen:hover{border-color:var(--blue)}.product-name h2 a{border-bottom:1px solid transparent;transition:color .2s,border-color .2s}.product-name h2 a:hover{color:var(--blue);border-bottom-color:var(--rule)}.visit{margin-top:26px}.closing-icons a{display:block;border-radius:6px}.contact-links{display:flex;flex-wrap:wrap;justify-content:center;gap:12px;margin-bottom:34px}
.about,.resume-block{display:grid;grid-template-columns:.75fr 1.4fr;gap:75px}.about{padding-block:82px;border-top:1px solid var(--rule)}.about h2,.resume h2{font:400 36px/1.2 var(--serif);letter-spacing:-.025em;margin:0}.about-copy p{font-size:15px;line-height:1.9;margin:0 0 16px}.facts{margin:30px 0 0;border-top:1px solid var(--rule)}.facts>div,.skills>div{display:grid;grid-template-columns:150px 1fr;gap:20px;padding:13px 0;border-bottom:1px solid var(--rule);font-size:12px;line-height:1.7}.facts dt,.skills dt{color:var(--muted)}.facts dd,.skills dd{margin:0}
.resume{padding-block:82px 70px;border-top:1px solid var(--rule)}.resume-head{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:flex-end;gap:20px 40px;margin-bottom:40px}.resume-head .eyebrow{margin-bottom:18px}.resume-contact{font-size:12px;color:var(--muted);margin:0}.resume-contact a{border-bottom:1px solid var(--rule)}.resume-contact a:hover{color:var(--green);border-bottom-color:var(--green)}
.resume-block{padding-block:34px;border-top:1px solid var(--rule)}.block-label{font-size:10px;font-weight:650;letter-spacing:.16em;text-transform:uppercase;color:var(--blue);margin:4px 0 0}.resume-summary{font-size:14px;line-height:1.9;margin:0;max-width:760px}.skills{margin:0}.skills>div:first-child{padding-top:0}
.jobs{display:grid;gap:44px}.job h4{font:400 21px/1.35 var(--serif);letter-spacing:-.01em;margin:0 0 6px}.job-role{font-size:13px;font-weight:600;margin:0}.job-meta{font-size:11px;color:var(--muted);margin:4px 0 0}.job-intro{font-size:13px;line-height:1.85;margin:16px 0 0}.job ul{list-style:none;margin:16px 0 0;padding:0}.job li{position:relative;padding:10px 0 10px 22px;border-top:1px solid var(--rule);font-size:12.5px;line-height:1.85;color:var(--muted)}.job li::before{content:"";position:absolute;left:2px;top:23px;width:9px;height:1px;background:var(--green)}.job li a{color:var(--ink);font-weight:600;border-bottom:1px solid var(--rule)}.job li a:hover{color:var(--green);border-bottom-color:var(--green)}
html:lang(ja) .about h2,html:lang(ja) .resume h2{font-size:30px;line-height:1.5}html:lang(ja) .about-copy p,html:lang(ja) .resume-summary{line-height:2}
@media(min-width:1500px){.hero-art{height:520px}}
@media(max-width:1100px){.wrap{width:calc(100% - 64px)}.hero{gap:25px;padding-block:65px;min-height:610px}.hero-art{height:380px}.hero h1{font-size:62px}.project-grid,.bird-grid{gap:35px;grid-template-columns:1fr 1.2fr}.bird-grid{grid-template-columns:1.2fr 1fr}.gallery-image{height:365px}.bird-grid .gallery-image{height:300px}.rhythm{gap:35px;grid-template-columns:1fr}.craft{gap:45px}.project{padding-block:65px}.product-name h2{font-size:40px}}
@media(max-width:760px){.wrap{width:calc(100% - 40px)}.site-header{min-height:78px;gap:10px}.site-header nav{gap:15px;font-size:10px}.brand-icons img{width:26px}.brand-icons{gap:2px}.language button{padding:6px;font-size:10px}.hero{grid-template-columns:1fr;padding-block:48px 40px;gap:36px}.hero h1{font-size:64px}.hero .eyebrow{font-size:9px;margin-bottom:22px}.intro{font-size:15px;max-width:480px}.hero-note{font-size:10px}.hero-art{height:450px;width:min(520px,100%);margin-inline:auto}.screen-two{right:3px}.principles{display:grid;grid-template-columns:1fr 1fr;padding-block:20px;gap:15px;font-size:10px}.principles>span:first-child{grid-column:1/-1}.project{padding-block:52px}.project-grid,.bird-grid{grid-template-columns:1fr;gap:30px}.bird-grid .gallery{order:2}.project-heading{margin-bottom:28px}.product-name h2{font-size:38px}.product-name img{width:52px}.project-tagline{margin-left:0;font-size:14px}.body-large{font-size:15px}.feature-list h3{font-size:14px}.feature-list p{font-size:13px}.gallery-image{height:auto;aspect-ratio:1.35;object-fit:contain}.bird-grid .gallery-image{height:auto;aspect-ratio:16/9}.gallery-caption{font-size:10px}.zoom-label{opacity:1}.rhythm{padding-block:52px}.rhythm-steps{gap:20px}.rhythm h3{font-size:12px}.rhythm-steps p{font-size:12px}.craft{grid-template-columns:1fr;gap:25px;padding-block:52px}.craft-heading>p:last-child{font-size:14px}.craft details p{font-size:13px}.closing{padding-block:48px}.closing h2{font-size:36px}footer{flex-direction:column;gap:9px;font-size:10px}html:lang(ja) .hero h1{font-size:48px}.lightbox-toolbar{font-size:10px}.lightbox-toolbar button{font-size:12px;flex-shrink:0}}
@media(max-width:420px){.site-header nav{gap:10px;font-size:9px}.brand-icons img{width:22px}.brand-icons img:last-child{display:none}.wrap{width:calc(100% - 32px)}.hero h1{font-size:56px}.hero-art{height:340px}.screen-one{width:87%}.screen-two{width:91%;bottom:15px}.visual-caption{font-size:9px;padding:0}.rhythm-steps{grid-template-columns:1fr;gap:25px}.rhythm-steps article{display:grid;grid-template-columns:36px 1fr;column-gap:12px}.rhythm-steps h3{margin:0 0 7px;font-size:14px}.rhythm-steps p{grid-column:2}.step-number{grid-row:1/3}.product-name h2{font-size:34px}html:lang(ja) .hero h1{font-size:40px}html:lang(ja) .closing h2{font-size:29px}.art-footnote{font-size:8px}}
@media(prefers-reduced-motion:reduce){:root{scroll-behavior:auto}*,*::before,*::after{transition:none!important}}
@media(max-width:1100px){.about,.resume-block{grid-template-columns:1fr;gap:26px}.about{padding-block:65px}.resume{padding-block:65px 52px}}
@media(max-width:760px){.about{padding-block:52px}.resume{padding-block:52px 40px}.about h2,.resume h2{font-size:32px}.facts>div,.skills>div{grid-template-columns:1fr;gap:2px}.resume-block{padding-block:28px}.job h4{font-size:19px}.job li{font-size:13px}.resume-head{align-items:flex-start}.hero-actions .button{flex:1 1 auto}.contact-links .button{flex:1 1 auto;justify-content:center}}
@media(max-width:420px){.hero-actions{flex-direction:column}.hero-actions .button{justify-content:space-between}.closing h2{font-size:30px}}