/* Responsive viewing layer: preserve the folding composition. */
html{scroll-padding-top:80px}body{overflow-x:hidden}
.composition{min-height:440px}
.device{max-width:calc(100vw - 28px)}
.portfolio section{padding:32px 24px 34px}
.portfolio h2{font-size:clamp(46px,6vw,60px);line-height:.98;overflow-wrap:anywhere}
.portfolio p{font-size:14px;line-height:1.65}
.portfolio .intro-title{font-size:17px;line-height:1.45}
.eyebrow,.section-label{font-size:9px;letter-spacing:1px}
.portfolio .intro{padding-top:26px}
.intro h2{font-size:54px;margin:16px 0}
.portrait-wrap{margin:20px -24px 0}
.intro-photo{height:260px;object-position:50% 35%}
.pill{font-size:12px;min-height:42px;padding:12px 17px}
.highlights{gap:22px 18px;padding:25px 0}
.highlights strong{font-size:49px}
.highlights span{font-size:9px;letter-spacing:.5px}
.international>span{font-size:9px}.international b{font-size:14px}
.permission-note{font-size:12px!important;line-height:1.6}
.store-heading{font-size:9px;line-height:1.6}
.store-availability{padding:16px;margin:22px 0}
.store-availability p{font-size:12px}
.store-availability a{font-size:13px;min-height:48px}
.store-app-name img{width:32px;height:32px}
.filters{top:30px;gap:6px;padding:10px 0;flex-wrap:wrap}
.filters button{min-height:40px;font-size:12px;padding:8px 13px}
.filters small{font-size:10px}
.project-grid{gap:25px}
.project-group-label{margin-top:8px;padding-top:22px}
.project-group-label h3{font-size:12px;line-height:1.5}
.project-group-label p{font-size:12px}
.project-image{height:auto;aspect-ratio:1.5;border-radius:9px}
.project-card[data-category=apps] .project-image{aspect-ratio:1.8}
.project-card[data-category=apps] .project-image img{padding:30px;position:absolute;inset:0}
.project-card:not([data-category=apps]) .project-image img{position:absolute;inset:0;object-fit:contain;background:#e4e4dc}
.project-arrow{width:32px;height:32px;font-size:19px}
.project-meta{padding-top:14px}.project-meta>span{font-size:9px;letter-spacing:.7px}
.project-meta h3{font-size:29px;line-height:1.08;margin:9px 0}
.project-meta p{font-size:12px}
.full-name{font-size:18px}.about-photo{height:245px}
.facts>div{font-size:12px;gap:15px}.facts span{font-size:9px}
.experience-row{padding:19px 0}.experience-row small{font-size:11px}
.experience-row h3{font-size:15px;line-height:1.45}.experience-row p{font-size:12px}
.profile-links a{font-size:12px;min-height:46px;gap:12px;overflow-wrap:anywhere}
.email-link{font-size:15px;overflow-wrap:anywhere}
#contact{padding-bottom:100px}
footer{font-size:9px;flex-wrap:wrap;gap:10px}
nav{width:calc(100% - 28px);justify-content:space-between;bottom:12px;padding:5px;background:#343a32d9;box-shadow:0 4px 18px #0002}
nav a{font-size:12px;min-height:36px;padding:10px 12px;text-align:center;flex:1}
.status{font-size:10px;padding:10px 15px;line-height:1}
.finishes{bottom:20px}
.finishes button{width:22px;height:22px}
.outer-caption{font-size:9px;bottom:29px}
.is-open .outer-caption{opacity:.5}
.lock-bottom button{min-height:30px;font-size:10px}
dialog{width:min(700px,calc(100vw - 28px));max-height:calc(100svh - 32px);border-radius:16px;overscroll-behavior:contain}
dialog>img{padding:16px;max-height:350px}
.dialog-body{padding:24px 28px 30px}
dialog h2{font-size:38px;line-height:1.05;overflow-wrap:anywhere}
dialog p{font-size:15px;line-height:1.7}
.close{width:40px;height:40px;font-size:27px;top:12px;margin:12px 12px -52px}
#dialog-gallery img{height:200px}
@media(max-width:600px){
 header{top:14px;left:16px;right:16px;gap:10px}.brand{font-size:23px}
 .backgrounds{padding:3px}.backgrounds button{padding:9px 10px;font-size:11px;min-height:34px}
 .outer-caption{display:none}.top-name{top:13vh;font-size:100px}.bottom-name{bottom:16vh;font-size:100px}
 .portfolio section{padding-left:21px;padding-right:21px}.portrait-wrap{margin-left:-21px;margin-right:-21px}
 .portfolio h2{font-size:49px}.intro h2{font-size:51px}
 .filters button{padding:8px 12px}.project-meta h3{font-size:27px}
 .dialog-body{padding:20px}.store-heading{font-size:8px}.finishes{bottom:17px}
 #dialog-gallery{grid-template-columns:1fr}#dialog-gallery img{height:auto;max-height:300px}
}
@media(max-height:560px){.top-name,.bottom-name{font-size:70px}.top-name{top:16vh}.bottom-name{bottom:18vh}.finishes{bottom:8px;padding:6px}.finishes button{width:17px;height:17px}}

.intro-story{margin:16px 0 18px}.intro-story p{margin:0 0 14px}.intro-story a{color:var(--ink);text-decoration:underline;text-decoration-color:#677d4d70;text-underline-offset:3px}.intro-story a:hover{color:var(--accent)}