/* Study 04 — mineral colour, cinematic spatial continuity. Preview only. */
@view-transition{navigation:auto}
:root{--gallery-ease:cubic-bezier(.22,1,.36,1)}
html body.atelier-preview{--at-paper:#f4eee3;--at-accent:#d2a580;--at-line:rgba(210,165,128,.38)}
html body.atelier-preview.home-page .home-stage{background:#181310!important}
html body.atelier-preview.home-page .home-veil{background:linear-gradient(0deg,#181310,rgba(24,19,16,.82) 23%,transparent 72%),linear-gradient(90deg,rgba(32,22,17,.55),transparent 82%)!important}
html body.atelier-preview .at-name span:last-child{color:#d2a580!important}
html body.atelier-preview.home-page .home-film{filter:grayscale(.65) sepia(.15) contrast(1.1) brightness(.8)!important}
html body.atelier-preview.works-page .ex5-works-cover{background:#132529!important}
html body.atelier-preview.works-page .ex5-works-title{color:#c2d4cf!important}
html body.atelier-preview.works-page .ex5-works-title .works-word{color:inherit!important}
@media(min-width:1024px){
 html body.atelier-preview .site-header .desktop-nav{display:none!important;gap:32px!important}
 html body.atelier-preview .site-header .desktop-nav a{min-height:44px;display:flex;align-items:center}
 html body.atelier-preview .site-header .menu-toggle{display:flex!important}
}
/* Requested refinement: single-frame entrance and one menu at every size. */
html:has(body.atelier-preview.home-page){height:100%;overflow:hidden!important;overscroll-behavior:none}
html body.atelier-preview.home-page{height:100svh!important;min-height:0!important;overflow:hidden!important;overscroll-behavior:none}
html body.atelier-preview.home-page main,
html body.atelier-preview.home-page .home-scroll,
html body.atelier-preview.home-page .home-stage{height:100svh!important;min-height:0!important;max-height:100svh!important;width:100%!important;overflow:hidden!important}
html body.atelier-preview.home-page .home-scroll{display:block!important;touch-action:pan-y pinch-zoom!important;scroll-snap-type:none!important}
html body.atelier-preview.home-page .home-stage{touch-action:pan-y pinch-zoom!important}
html body.atelier-preview.home-page :is(.home-work-panel,.quiet-enter,.site-footer,.ex5-ui,.at-scroll-cue){display:none!important}
html body.atelier-preview.home-page .home-copy .quiet-enter{display:none!important}
html body.atelier-preview.home-page .home-copy h1{gap:8px!important}
html body.atelier-preview.home-page .home-copy h1 span:first-child{font:500 clamp(22px,2vw,30px)/1.2 var(--at-sans)!important;letter-spacing:.13em!important}
html body.atelier-preview.home-page .home-copy h1 span:last-child{font:400 clamp(18px,1.6vw,24px)/1.25 var(--at-serif)!important;letter-spacing:0!important}
html body.atelier-preview.home-page .at-home-next{position:absolute;z-index:18;right:var(--at-gutter);bottom:clamp(22px,3svh,40px);display:flex;align-items:center;justify-content:center;width:52px;height:44px;color:var(--at-paper);text-decoration:none;font:300 30px/1 var(--at-sans);transition:transform .3s var(--gallery-ease),color .3s}
html body.atelier-preview.home-page .at-home-next:hover{transform:translateX(5px);color:var(--at-accent)}
html body.atelier-preview.home-page .at-home-next:focus-visible{outline:1px solid currentColor;outline-offset:4px}
html body.atelier-preview.home-page .at-home-direction{position:absolute;left:var(--at-gutter);bottom:clamp(36px,4.5svh,57px);z-index:18;font:500 9px/1.2 var(--at-sans);letter-spacing:.22em;color:var(--at-paper);pointer-events:none}
html body.atelier-preview .site-header .desktop-nav{display:none!important}
html body.atelier-preview .site-header .menu-toggle{display:flex!important;width:48px!important;height:48px!important}
html body.atelier-preview .site-header .menu-toggle span{transition:transform .4s var(--gallery-ease)!important}
html body.atelier-preview.menu-open .site-header .mobile-menu.is-open{background:#181310!important;animation:exhibition-menu-unfold 520ms var(--gallery-ease) both!important}
html body.atelier-preview.menu-open .site-header .mobile-menu a{animation:exhibition-menu-link 620ms var(--gallery-ease) both!important}
html body.atelier-preview.menu-open .site-header .mobile-menu a:nth-child(2){animation-delay:50ms!important}
html body.atelier-preview.menu-open .site-header .mobile-menu a:nth-child(3){animation-delay:100ms!important}
html body.atelier-preview.menu-open .site-header .mobile-menu a:hover{color:var(--at-accent)!important}
@keyframes exhibition-menu-unfold{from{clip-path:inset(0 0 0 100%)}to{clip-path:inset(0)}}
@keyframes exhibition-menu-link{from{opacity:0;transform:translateX(24px)}to{opacity:1;transform:none}}
@media(max-width:699px){
 html body.atelier-preview.home-page .home-copy h1 span:first-child{font-size:22px!important}
 html body.atelier-preview.home-page .home-copy h1 span:last-child{font-size:18px!important}
 html body.atelier-preview.home-page .at-home-next{right:6vw}
 html body.atelier-preview.home-page .at-home-direction{left:6vw;font-size:8px}
}
@media(prefers-reduced-motion:reduce){
 html body.atelier-preview.menu-open .site-header :is(.mobile-menu.is-open,.mobile-menu a){animation:none!important}
 html body.atelier-preview.home-page .at-home-next,html body.atelier-preview .site-header .menu-toggle span{transition:none!important}
}
@media(min-width:900px) and (orientation:landscape){
 html body.atelier-preview.works-page .ex5-works-cover__copy{width:38vw!important}
 html body.atelier-preview.works-page .ex5-works-title{font-size:11vw!important}
}
html body.atelier-preview .at-triptych-link:nth-child(1){--work-colour:#d2a580}
html body.atelier-preview .at-triptych-link:nth-child(2){--work-colour:#a8cbc9}
html body.atelier-preview .at-triptych-link:nth-child(3){--work-colour:#c0c38d}
html body.atelier-preview .at-triptych-link{border-bottom:2px solid var(--work-colour)!important}
html body.atelier-preview .at-triptych-label .at-no{color:var(--work-colour)!important}
html body.atelier-preview .at-triptych-link img{filter:grayscale(.55) contrast(1.1) brightness(.84)!important;transition:filter .65s var(--gallery-ease),transform 1s var(--gallery-ease)!important}
html body.atelier-preview .at-triptych-link:hover img,html body.atelier-preview .at-triptych-link:focus-visible img{filter:grayscale(0) contrast(1.05) brightness(.98)!important}
html body.atelier-preview.room-01{--at-accent:#d2a580;--room-ink:#211714}
html body.atelier-preview.room-02{--at-accent:#a8cbc9;--room-ink:#132529}
html body.atelier-preview.room-03{--at-accent:#c0c38d;--room-ink:#202218}
html body.atelier-preview.work-page .room-hero{background:var(--room-ink)!important}
html body.atelier-preview.work-page .room-hero-shade,
html body.atelier-preview.work-page .media-frame:after,
html body.atelier-preview.work-page .room-player:after{background:linear-gradient(90deg,var(--room-ink),transparent 88%),linear-gradient(0deg,var(--room-ink),transparent 76%)!important;opacity:.86}
/* Internal films share their own room's hero light, without intercepting playback. */
html body.atelier-preview.work-page .media-frame:has(video):after{content:"";position:absolute;inset:0;z-index:2;pointer-events:none}
html body.atelier-preview.work-page .room-player:after{content:"";position:absolute;inset:64px 0 0;z-index:1;pointer-events:none}
html body.atelier-preview.work-page .room-player:has(.room-player-audio):after{bottom:126px}
html body.atelier-preview.work-page:is(.room-01,.room-02,.room-03) .media-frame video[data-room-video]:not(.is-color){filter:grayscale(1) contrast(1.08)!important}
/* Desktop entrance: a quiet classic name, not a monumental two-line display. */
@media(min-width:1024px) and (orientation:landscape){
 html body.atelier-preview.home-page .at-name{top:clamp(150px,26svh,280px);flex-direction:row;align-items:baseline;gap:.24em;font-size:clamp(40px,5vw,76px)}
 html body.atelier-preview.home-page .at-name span{font:400 1em/1.08 var(--at-serif)!important;letter-spacing:-.035em!important;text-transform:none!important;-webkit-text-stroke:0!important;color:var(--at-paper)!important;margin:0!important}
}
html body.atelier-preview.work-page :is(.at-room-stamp,.room-chapter-no){color:var(--at-accent)!important}
html body.atelier-preview.work-page .at-room-ghost{-webkit-text-stroke:1px var(--at-accent)!important;opacity:.34!important}
html body.atelier-preview.work-page .room-hero:after{background:var(--at-accent)!important;opacity:.45}
html body.atelier-preview .at-reading-progress:before{background:var(--at-accent)!important}
html body.atelier-preview.works-page .ex5-work-slide[data-at-room="01"]{background:#211714!important}
html body.atelier-preview.works-page .ex5-work-slide[data-at-room="02"]{background:#132529!important}
html body.atelier-preview.works-page .ex5-work-slide[data-at-room="03"]{background:#202218!important}
html body.atelier-preview :is(.at-side-link,.quiet-enter,.ex5-enter){transition:color .25s ease,border-color .25s ease!important}
html body.atelier-preview :is(.at-side-link,.quiet-enter,.ex5-enter):hover{color:var(--at-accent)!important;border-color:var(--at-accent)!important}
/* Browser-native document transitions preserve real URLs, history and media controls. */
@supports(view-transition-name:root){html body.atelier-preview .ex5-curtain{display:none!important}}
::view-transition-group(root){animation-duration:560ms;animation-timing-function:var(--gallery-ease)}
::view-transition-old(root){animation:gallery-out 560ms var(--gallery-ease) both;mix-blend-mode:normal}
::view-transition-new(root){animation:gallery-in 560ms var(--gallery-ease) both;mix-blend-mode:normal}
@keyframes gallery-out{to{transform:translateX(-7vw);opacity:0}}
@keyframes gallery-in{from{transform:translateX(9vw);opacity:0}to{transform:translateX(0);opacity:1}}
@media(max-width:899px){
 ::view-transition-group(root){animation-duration:440ms}
 ::view-transition-old(root),::view-transition-new(root){animation-duration:440ms}
 @keyframes gallery-out{to{transform:translateX(-12vw);opacity:0}}
 @keyframes gallery-in{from{transform:translateX(16vw);opacity:0}to{transform:translateX(0);opacity:1}}
}
@media(max-width:699px){
 html body.atelier-preview .at-name span:first-child{font-size:14.2vw!important}
 html body.atelier-preview .at-name span:last-child{font-size:21.5vw!important;margin-left:6vw!important}
}
@media(prefers-reduced-motion:reduce){
 @view-transition{navigation:none}
 ::view-transition-group(root),::view-transition-old(root),::view-transition-new(root){animation:none!important}
 html body.atelier-preview .at-triptych-link img{transition:none!important;transform:none!important}
}