/* Mobile-only layout. Desktop styles remain in style.css. */
@media (max-width:768px){
 :root{--gutter:20px}html{scroll-padding-top:calc(78px + env(safe-area-inset-top,0px));-webkit-text-size-adjust:100%;text-size-adjust:100%}body{width:100%;min-width:0;margin:0;overflow-x:clip}main{max-width:100%;overflow-x:clip}
 .site-header,.site-header.scrolled{height:calc(76px + env(safe-area-inset-top,0px));padding:calc(14px + env(safe-area-inset-top,0px)) max(18px,env(safe-area-inset-right,0px)) 14px max(18px,env(safe-area-inset-left,0px))}.menu-toggle{width:46px;height:46px;flex:0 0 46px}.site-menu{top:calc(72px + env(safe-area-inset-top,0px));right:max(18px,env(safe-area-inset-right,0px));max-width:calc(100dvw - 36px);max-height:calc(100dvh - 94px - env(safe-area-inset-top,0px));min-width:230px;padding:18px 24px}.site-menu a,.site-menu .menu-works{font-size:25px;min-height:44px}.site-menu .menu-categories a{min-height:44px}
 .hero{height:auto;min-height:100svh;max-height:none;padding:calc(80px + env(safe-area-inset-top,0px)) max(18px,env(safe-area-inset-right,0px)) calc(30px + env(safe-area-inset-bottom,0px)) max(18px,env(safe-area-inset-left,0px));display:flex;flex-direction:column;align-items:center;gap:0}
 .hero h1{font-size:14.5vw;line-height:1.3;margin:0;padding:0 0 .18em;letter-spacing:-.05em;width:100%;white-space:nowrap}
 .hero-collage{position:relative;left:auto;top:auto;width:min(100%,520px);transform:none;margin-top:clamp(42px,12vw,68px);flex:none}
 .ideas{left:23%;width:58%;top:17%}.idea{--sink:18px}.idea-yarn{--sink:38px}.idea-tube{--sink:34px}
 .hero-socials{position:relative;inset:auto;align-self:flex-end;margin-top:24px;margin-bottom:58px}.social-links{gap:7px}.social-links a,.social-links button{width:44px;height:44px}.scroll-cue{left:max(20px,env(safe-area-inset-left,0px));bottom:calc(32px + env(safe-area-inset-bottom,0px));font-size:16px;gap:8px}.hero-continuation{height:0!important}
 .carousel-section{--carousel-height:clamp(460px,78svh,700px);height:var(--carousel-height);padding-top:0;overflow:hidden}.round-carousel{height:var(--carousel-height);perspective:1400px;touch-action:pan-y}.round-card{touch-action:pan-y}.carousel-corners{inset:0}.corner{font-size:clamp(25px,5.5vw,42px);line-height:1.25}.top-left,.top-right{top:30px}.bottom-left,.bottom-right{bottom:30px}.top-left,.bottom-left{left:20px}.top-right,.bottom-right{right:20px}
 .expressions{display:grid;grid-template-columns:minmax(0,1fr);height:auto;min-height:0;max-height:none;padding:64px 12px 36px;overflow:hidden;gap:0;align-items:start}
 .ideas-title{position:relative;inset:auto;transform:none;justify-self:center;width:100%;max-width:500px;font-size:clamp(35px,8vw,56px);line-height:1.3;margin:0;grid-column:1/-1}
 .peel-hint{position:relative;inset:auto;transform:none;justify-self:center;width:115px;height:52px;margin:16px 0 0;font-size:22px;grid-column:1/-1}.peel-hint svg{order:1;width:55px;height:42px;flex-basis:55px;transform:rotate(-65deg)}
 .expressions .photo-sticker{position:relative;inset:auto;width:min(88vw,390px);max-width:none;justify-self:center;aspect-ratio:1;--photo-tilt:-4deg;margin:-4px 0}
 .expressions .photo-sticker:nth-of-type(even){--photo-tilt:4deg;translate:8px 0}.expressions .photo-sticker:nth-of-type(odd){translate:-8px 0}.hidden-idea{gap:6px}
 .about{height:auto;min-height:0;max-height:none;padding:76px 22px 80px;gap:0}.about h2{font-size:clamp(48px,10vw,72px);line-height:1.2}.about-collage{width:min(78vw,350px);max-width:100%;margin:38px 0 30px}.about-statement{font-size:clamp(28px,6.8vw,42px);line-height:1.35;max-width:620px}.desktop-break{display:none}
 .works{display:block;min-height:100svh;padding:calc(84px + env(safe-area-inset-top,0px)) max(20px,env(safe-area-inset-right,0px)) calc(64px + env(safe-area-inset-bottom,0px)) max(20px,env(safe-area-inset-left,0px));max-width:none}.work-index{position:relative;inset:auto;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));align-items:start;gap:20px 18px;padding:0;margin-bottom:38px}.category-group{min-width:0}.category-group:has(.category-link[aria-expanded=true]){grid-column:1/-1}.category-link{font-size:clamp(25px,5vw,34px);line-height:1.3;display:inline-flex;align-items:center;min-height:44px;padding:4px 0}.work-titles{max-width:none;padding-top:10px;gap:4px}.category-group:has(.category-link[aria-expanded=true]) .work-titles{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));column-gap:14px}.work-link{font-size:18px;line-height:1.35;min-height:44px;padding:9px 0 9px 9px;overflow-wrap:anywhere}.work-display,.work-detail{width:100%;min-width:0}.work-caption{padding-top:24px;max-width:100%}.work-caption h2{font-size:clamp(28px,6vw,38px);line-height:1.25;overflow-wrap:anywhere}.work-meta{font-size:17px;line-height:1.5;margin:12px 0 22px}.work-description{font-size:20px;line-height:1.55;overflow-wrap:break-word}.work-description p+p{margin-top:22px}.work-gallery{gap:18px;margin-top:18px}.work-gallery-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;margin-top:0}.artwork-dialog{padding:calc(58px + env(safe-area-inset-top,0px)) 12px calc(16px + env(safe-area-inset-bottom,0px));width:100dvw;max-width:100dvw;height:100dvh;max-height:100dvh}.artwork-dialog img{max-width:100%;max-height:calc(100dvh - 90px - env(safe-area-inset-top,0px) - env(safe-area-inset-bottom,0px))}.dialog-close{top:calc(8px + env(safe-area-inset-top,0px));right:max(14px,env(safe-area-inset-right,0px));min-height:44px}
 .companions{min-height:100svh;height:auto;padding:calc(82px + env(safe-area-inset-top,0px)) max(24px,env(safe-area-inset-right,0px)) calc(58px + env(safe-area-inset-bottom,0px)) max(24px,env(safe-area-inset-left,0px));overflow:hidden}.pet-intro{width:100%;padding-bottom:80px}.pet-loading{font-size:clamp(25px,6.8vw,48px);min-height:44px;padding:10px 0}.click-hint{font-size:20px;left:52%}.pet-reveal{width:100%;max-width:650px}.pet-heading{font-size:clamp(24px,6vw,42px);line-height:1.45}.pet-pair{flex-direction:column;gap:38px;margin:30px auto;width:100%}.pet-sticker{width:min(55vw,230px);flex:none}.pet-caption{font-size:clamp(27px,7vw,44px);line-height:1.4}.pet-name text{font-size:34px}.site-footer{display:flex;flex-direction:column;align-items:center;gap:22px;padding:25px max(20px,env(safe-area-inset-right,0px)) calc(28px + env(safe-area-inset-bottom,0px)) max(20px,env(safe-area-inset-left,0px))}.footer-socials{align-self:center}.copyright{font-size:14px;line-height:1.6}
 .email-dialog{width:98dvw;max-width:98dvw}.email-dialog p{font-size:clamp(14px,4vw,25px);left:13%;right:13%;top:49%}.email-close{font-size:14px;min-height:44px;min-width:64px;top:21%;right:15%}
}
@media (min-width:481px) and (max-width:768px){
 .hero h1{font-size:clamp(70px,14.5vw,108px)}
 .expressions{grid-template-columns:repeat(2,minmax(0,1fr));padding-inline:20px}.expressions .photo-sticker{width:min(112%,390px);margin:0}.expressions .photo-sticker:nth-of-type(even){translate:-5px 18px}.expressions .photo-sticker:nth-of-type(odd){translate:5px 0}
 .category-group:has(.category-link[aria-expanded=true]) .work-titles{grid-template-columns:repeat(3,minmax(0,1fr))}
 .pet-pair{flex-direction:row;gap:65px;margin:45px auto}.pet-sticker{width:min(29vw,200px)}
}
@media (max-width:360px){
 :root{--gutter:16px}.site-header,.site-header.scrolled{padding-inline:14px}.site-menu{right:14px;max-width:calc(100dvw - 28px)}
 .hero{padding-inline:14px}.hero h1{font-size:14vw}.hero-collage{margin-top:36px}.hero-socials{margin-bottom:54px}.scroll-cue{left:16px}
 .corner{font-size:24px}.top-left,.bottom-left{left:16px}.top-right,.bottom-right{right:16px}
 .expressions{padding-inline:8px}.expressions .photo-sticker{width:90vw}
 .works{padding-inline:16px}.work-index{gap:16px 12px}.category-link{font-size:23px}.work-link{font-size:17px}.work-description{font-size:19px}.work-gallery-grid{gap:9px}
 .companions{padding-inline:18px}.email-dialog p{font-size:14px}
}
@media (max-width:768px) and (max-height:520px) and (orientation:landscape){
 .hero{min-height:680px}.hero-collage{width:min(62vw,390px);margin-top:20px}.hero-socials{margin-top:10px}
 .carousel-section{--carousel-height:500px}.round-carousel{height:500px}
}
@media (max-width:768px) and (hover:none){
 .about-collage:hover,.social-links a:hover,.social-links button:hover{transform:none}.artwork-open:hover img{opacity:1}
}
