/* Small-screen layouts are deliberately last, after desktop art refinements. */
@media (max-width:1100px) and (orientation:portrait), (max-width:600px) {
 :root{--header:68px;--hero-height: min(56vw,calc(100svh - var(--header)));}
 html{scroll-snap-type:none;scroll-padding-top:calc(var(--header) + 16px);}
 .header{display:flex;padding:0 max(18px,env(safe-area-inset-left));gap:16px;justify-content:space-between;}
 .header .brand{width:176px;left:0;flex:none;}
 .header .header-caption{display:none;}
 .header .menu-toggle{display:flex;flex-direction:column;justify-content:center;align-items:center;gap:6px;width:48px;height:48px;margin-left:auto;}
 .menu-toggle span{width:25px;height:2px;background:#fff;}
 .header #main-nav{display:none;position:absolute;top:100%;inset-inline:0;margin:0;padding:16px 24px 24px;max-height:calc(100dvh - var(--header));overflow-y:auto;background:#080812;flex-direction:column;align-items:stretch;gap:4px;font-size:18px;}
 .header #main-nav.open{display:flex;}
 .header #main-nav>a:nth-child(n){border:0;padding:12px;min-height:48px;}
 .header #main-nav .contact{height:auto;min-width:0;margin:8px 0 0;font-size:17px;}
 .hero{height:var(--hero-height);min-height:0;}
 .hero .hero-composition{width:100%;height:100%;aspect-ratio:auto;}
 .hero .hero-controls{bottom:8px;gap:4px;}
 .hero-controls button,.hero-dots button{min-width:44px;height:44px;}
 .hero-dots{gap:0;}
 .portfolio-layout,#projects.portfolio-layout,.capabilities-layout{display:block;padding:26px 24px 0;max-width:900px;}
 .side-nav{margin:0 0 26px;visibility:visible!important;pointer-events:auto!important;}
 .side-nav nav{position:static;display:flex;flex-direction:row;align-items:center;gap:16px;overflow-x:auto;padding:4px 0 10px;scrollbar-width:thin;}
 .side-nav h2{flex:none;font-size:22px;margin:0;white-space:nowrap;}
 .side-nav a{flex:none;width:auto;max-width:none;min-height:44px;display:flex;align-items:center;white-space:nowrap;font-size:16px;border:0;}
 .chapter,.capabilities-layout .chapter{min-height:0;margin:0 0 48px;scroll-margin-top:0;}
 .chapter .section-heading{margin:0 0 20px;min-height:0;gap:14px;flex-wrap:wrap;}
 .chapter .section-heading h2,.about .section-heading h2{font-size:clamp(32px,5vw,48px);line-height:1.15;}
 .chapter .section-heading p{font-size:16px;line-height:1.5;}
 .store-links{padding:0!important;flex-wrap:wrap;font-size:14px;}
 .store-links a{min-height:44px;}
 .store-links img{width:18px;height:22px;}
 .chapter .art-panel{aspect-ratio:auto;height:auto;min-height:0;width:100%;max-width:none;margin:0;border:1px solid #ffffff24;border-radius:18px;background:#08071bc7;padding:20px;}
 .chapter .frame{display:none;}
 .chapter .released-content{position:relative;inset:auto;display:flex;flex-direction:column;gap:24px;padding:0;}
 .released .featured-project{width:100%;height:auto;aspect-ratio:16/10;align-self:stretch;}
 .released .featured-project>img{max-width:100%;max-height:100%;object-fit:contain;}
 .project-thumbs,.project-thumbs.short-grid{height:auto;grid-template-columns:repeat(3,minmax(0,1fr));grid-template-rows:none;grid-auto-rows:auto;gap:14px;}
 .project-thumb{aspect-ratio:1.28;}
 .chapter .gallery-content{position:relative;inset:auto!important;display:flex;flex-direction:column-reverse;gap:24px!important;translate:none;padding:0;}
 .chapter .gallery-main{width:100%;height:auto;aspect-ratio:16/10;scale:1;translate:none;transform:none;align-self:center;overflow:hidden;}
 .chapter .gallery-main>img,.chapter .gallery-main>video{max-width:100%;max-height:100%;object-fit:contain;scale:1;}
 .characters .gallery-main{aspect-ratio:4/3;}
 .chapter .gallery-thumbs{width:100%;height:auto;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));grid-template-rows:none;grid-auto-rows:auto;gap:14px;padding:0;translate:none;align-self:stretch;}
 .chapter .asset-thumb{aspect-ratio:1;min-width:0;padding:4px;}
 .chapter .asset-thumb img{scale:1;max-width:100%;max-height:100%;}
 .backgrounds .asset-thumb,.games .asset-thumb,.marketing .asset-thumb{aspect-ratio:1.5;}
 .logos .gallery-thumbs,.games .gallery-thumbs,.marketing .gallery-thumbs{grid-template-columns:repeat(3,minmax(0,1fr));}
 .chapter .panel-arrow,.released .panel-arrow{top:auto!important;bottom:-54px;left:auto!important;right:0!important;transform:none;width:48px;height:48px;min-height:48px;font-size:40px;background:#ffffff0a;border-radius:12px;}
 .chapter .panel-arrow.prev,.released .panel-arrow.prev{right:58px!important;}
 .page-info{justify-content:flex-start;padding:10px 116px 0 0;min-height:56px;}
 .page-info button{width:44px;height:44px;}
 .capabilities-layout .chapter{margin-bottom:78px;}
 .stylization .art-panel{height:340px;margin:0;}
 .stylization .styles-stage{inset:20px 20px 56px;}
 .styles-stage.rotating-styles .style-item .style-label{font-size:16px;top:calc(100% + 8px);}
 .zoom{opacity:1;width:40px;height:40px;}
 .zoom svg{width:20px;height:20px;}
 .about{padding:0 24px 40px;max-width:900px;scroll-margin-top:0;}
 .about .section-heading{margin:0 0 24px;flex-wrap:wrap;}
 .about-panel{min-height:0;padding:28px;grid-template-columns:180px minmax(0,1fr);gap:28px;}
 .about .profile img{width:160px;margin:0 auto 24px;}
 .about .profile ul{font-size:15px;translate:none!important;}
 .about .section-heading>div{translate:none!important;}
 .about .about-copy p{font-size:17px;line-height:1.6;}
 .about .about-copy .intro{font-size:21px;}
 .about .about-copy .email{display:block;overflow-wrap:anywhere;}
 footer{padding:24px;}
 .footer-nav{width:100%;gap:12px 20px;}
 .footer-nav a{min-height:44px;display:inline-flex;align-items:center;}
 dialog{width:96vw;height:94dvh;}
 .viewer-header h2{font-size:18px;overflow-wrap:anywhere;}
 .viewer-header button{min-width:44px;height:44px;}
 .viewer-stage{padding:12px 48px;}
 .viewer-arrow{width:44px;height:52px;}
 #viewer-thumbs button{width:86px;height:64px;}
}
@media(max-width:600px){
 :root{--header:64px;--hero-height:min(100vw,calc(100svh - var(--header)));}
 .header .brand{width:164px;}
 .hero .hero-composition{width:200%;height:auto;aspect-ratio:1920/952;}
 .hero .hero-controls{bottom:4px;gap:0;}
 .hero-dots button{min-width:32px;}
 .intro-slogan{font-size:clamp(22px,6vw,34px);max-width:90%;}
 .portfolio-layout,#projects.portfolio-layout,.capabilities-layout{padding:22px 16px 0;}
 .side-nav nav{flex-wrap:wrap;gap:0 14px;}
 .side-nav h2{width:100%;font-size:22px;margin-bottom:4px;}
 .chapter .art-panel{padding:14px;border-radius:14px;}
 .chapter .gallery-thumbs{grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;}
 .chapter .gallery-main{aspect-ratio:4/3;}
 .backgrounds .gallery-main,.games .gallery-main,.marketing .gallery-main{aspect-ratio:16/10;}
 .project-thumbs{gap:12px;}
 .released .project-thumb img{max-width:calc(100% - 6px);max-height:calc(100% - 6px);}
 .stylization .art-panel{height:285px;}
 .styles-stage.rotating-styles .style-item .style-label{font-size:13px;}
 .about{padding:0 16px 32px;}
 .about-panel{display:block;padding:22px 18px;}
 .profile{display:flex;align-items:center;gap:18px;margin-bottom:24px;}
 .about .profile img{width:100px;margin:0;}
 .about .profile ul{font-size:13px;}
 .about-points>li{grid-template-columns:30px minmax(0,1fr);gap:12px;}
 .about .social-links{width:100%;gap:20px;}
 .about .social-links a{min-height:44px;}
 dialog{width:100%;height:100dvh;margin:0;border:0;border-radius:0;padding-top:env(safe-area-inset-top);padding-bottom:env(safe-area-inset-bottom);}
 .viewer-header{gap:8px;padding:10px;}
 .viewer-header h2{font-size:16px;}
 .viewer-header span{font-size:12px;white-space:nowrap;}
 .viewer-stage{padding:8px 36px;}
 .viewer-arrow{width:32px;}
 #viewer-thumbs{padding-bottom:max(12px,env(safe-area-inset-bottom));}
}
@media(pointer:coarse){html{scroll-snap-type:none;}.project-thumb:hover,.asset-thumb:hover{transform:none!important;}.cosmos{will-change:auto;}}

/* Tablet Released Games: smaller covers with wider, equal gutters. */
@media (min-width:601px) and (max-width:1100px) and (orientation:portrait) {
 .released .project-thumbs,.released .project-thumbs.short-grid{gap:24px;}
 .released .project-thumb img{max-width:calc(88% - 6px);max-height:calc(88% - 6px);}
}

@media (min-width:601px) and (max-width:1100px) and (orientation:portrait) {
 .stylization .art-panel{height:390px;}
 .stylization .styles-stage{inset:28px 12px 64px;}
 .stylization .style-item img{scale:1.15;transform-origin:center;}
}

/* Landscape tablets retain the desktop composition and frame proportions. */
@media (min-width:601px) and (max-width:1400px) and (orientation:landscape) {
 :root{--header:60px;--hero-height:calc(100svh - var(--header));}
 .header{display:flex;justify-content:space-between;padding:0 max(16px,env(safe-area-inset-left));gap:16px;}
 .header .brand{width:clamp(125px,16vw,171px);flex:none;}
 .header .header-caption,.header .menu-toggle{display:none;}
 .header #main-nav,.header #main-nav.open{display:flex;position:static;flex-direction:row;align-items:center;padding:0;margin:0;gap:10px;background:transparent;font-size:clamp(11px,1.5vw,16px);}
 .header #main-nav>a:nth-child(-n+3){padding:0 10px 0 0;border-right:1px solid #292929;}
 .header #main-nav>a:not(.contact){white-space:nowrap;}
 .header #main-nav .contact{margin:0;min-width:0;height:36px;padding:0 12px;font-size:inherit;}
 .hero{height:var(--hero-height);}
 .hero .hero-composition{left:50%;right:auto;}
}
.fullscreen-toggle{display:none;position:fixed;right:max(16px,env(safe-area-inset-right));bottom:max(16px,env(safe-area-inset-bottom));z-index:80;width:46px;height:46px;border:1px solid #ffffff55;border-radius:12px;background:#070812cc;color:#fff;align-items:center;justify-content:center;cursor:pointer;}
.fullscreen-toggle svg{width:24px;height:24px;fill:none;stroke:currentColor;stroke-width:1.8;}
.fullscreen-toggle:focus-visible{outline:2px solid #ffe36c;outline-offset:3px;}
@media (min-width:601px) and (orientation:landscape) and (pointer:coarse){.fullscreen-toggle:not([hidden]){display:flex;}}
