/* V5.1: the artwork sets the frame; faces and typography keep their edges. */
.at-canvas{perspective:none;transform-style:flat;transform:none!important;inset:25% 2% 17%;touch-action:pan-y}
.at-scene .at-piece,.at-scene .at-piece.ex-cover-art{transform-origin:center center;transform:translate(-50%,-50%) rotate(var(--pr,0deg)) rotateY(var(--pry,0deg))}
.at-piece-inner{background:transparent;overflow:visible}
.at-piece-inner>img{object-fit:contain;background:transparent}
.at-piece-label{bottom:auto;top:100%;transform:translateY(5px);opacity:0;pointer-events:none;padding:7px 10px;white-space:normal;font-size:10px}
.at-piece:hover .at-piece-label,.at-piece:focus-visible .at-piece-label{opacity:1;transform:none}
.at-title{font-size:clamp(46px,7.5vw,120px);right:var(--pad);line-height:1.2;top:8%;overflow-wrap:anywhere}
.at-enter{min-height:52px;padding:13px 20px;border:1px solid var(--at-ink);background:var(--at-ink);color:var(--at-bg);font-size:14px;font-weight:650;gap:24px;transition:box-shadow .2s,translate .2s;line-height:1.35}
.at-enter:hover,.at-enter:focus-visible{box-shadow:5px 5px 0 color-mix(in srgb,var(--at-ink) 25%,transparent);translate:-2px -2px}
.at-enter:focus-visible{outline:3px solid currentColor;outline-offset:4px}.at-enter>span{font-size:24px}
.at-bottom>div:first-child{max-width:40%}.at-controls button{min-height:40px;padding:9px 12px;font-size:11px}
.at-pin{min-height:0}.at-scroll-cue{top:18%}.at-underword{font-size:13vw;bottom:15%;opacity:.09}
.cv-frame>img{height:calc(100% - 34px);object-fit:contain}
.cv-frame>span{height:34px;line-height:1.3;transform:none;padding:6px 12px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.cv-frame:not(.is-current)>span{font-size:0}.cv-frame:not(.is-current)>span b{margin-left:auto}
.ex-next-art>img,.work-main-image img,.work-detail-image img,.plane-inner>img,.cv-route-image img{object-fit:contain}
.ex-next-art{right:3%;bottom:3%;height:64%;width:58%;transform:rotate(-3deg);background:var(--next-bg)}
.ex-next:hover .ex-next-art{transform:rotate(0deg)}
.ex-experiment-head>div{min-width:0;max-width:70%}.ex-experiment-head h2{font-size:clamp(30px,4.6vw,68px);line-height:1.25;overflow-wrap:anywhere;transform:none!important}
.ex-play-canvas.ex-light-compare{width:min(100%,calc(46vh * 1.5),1000px);width:min(100%,calc(46svh * 1.5),1000px);height:auto;min-height:0;max-height:none;aspect-ratio:3 / 2;margin-inline:auto;transform:none}
.ex-light-compare>img,.ex-compare-layer>img{object-fit:contain}
.ex-play-canvas.ex-tea-table{width:min(100%,1000px);height:auto;min-height:0;max-height:none;aspect-ratio:3 / 2;margin-inline:auto;transform:none}
.ex-tea-table>img{object-fit:contain}
.ex-dialogue{inset:auto 4% 5%;gap:20px}.ex-dialogue span{font-size:clamp(15px,2vw,27px)}.ex-dialogue span+span{margin-top:0}
.ex-play-canvas.ex-score{height:auto;min-height:0;max-height:none;aspect-ratio:1.65}
.ex-case .ts-section{background:#f0f1f2;color:#153dda}.ex-case .ts-section input{color:#153dda}
/* Short screens trade a pinned copy column for an uninterrupted reading flow. */
.cv-compact-reading.cv-sequence{height:auto}
.cv-compact-reading .cv-story-pin{position:relative;top:auto;height:auto;min-height:0;padding:32px var(--pad)}
.cv-compact-reading .cv-layout,.cv-compact-reading .cv-word-track,.cv-compact-reading .cv-story-top,.cv-compact-reading .cv-story-nav{display:none}
.cv-compact-reading .cv-story-copy{position:relative;inset:auto;width:100%;pointer-events:auto}
.cv-compact-reading .cv-story-step{position:relative;inset:auto;display:block;opacity:1!important;visibility:visible;transform:none!important;margin-bottom:48px;pointer-events:auto}
.cv-compact-reading .cv-mobile-fallback{display:block}.cv-compact-reading .cv-mobile-fallback img{max-height:52vh;max-height:52svh;object-fit:contain}
.cv-compact-reading .cv-story-step h2{font-size:42px;margin:20px 0 14px}.cv-compact-reading .cv-story-step h3{font-size:18px}.cv-compact-reading .cv-story-step p,.cv-compact-reading .cv-story-step .cv-detail-copy{font-size:13px;line-height:1.8;margin-top:12px}.cv-compact-reading .cv-story-step>button{width:100%;min-height:44px;margin-top:14px;font-size:12px}
@media(max-width:1000px){.at-enter{font-size:12px;gap:14px;padding:12px 15px}.at-bottom p{font-size:18px}.at-controls button{padding:8px}}
@media(max-width:759px){
 .at-scene{height:175vh;height:175svh}.at-detail.ex-opening{height:190vh;height:190svh}.at-pin{min-height:0;height:calc(100vh - var(--cv-top));height:calc(100svh - var(--cv-top))}
 .at-title{font-size:13vw;top:9%;line-height:1.15;transform:none}.at-meta{top:18px}.at-meta>span:last-child{max-width:53%;text-align:right}
 .at-canvas{inset:23% 0 31%}.at-scroll-cue{top:19%;font-size:8px;writing-mode:horizontal-tb;right:22px}.at-scroll-cue i{display:none}
 .at-bottom{bottom:14px;gap:10px;grid-template-columns:1fr}.at-bottom>div:first-child{max-width:100%}.at-bottom p{font-size:17px;margin:0}.at-bottom>div>span{display:none}
 .at-controls{justify-content:center;gap:10px}.at-controls button{min-height:36px;padding:7px 16px}
 .at-enter{min-height:46px;justify-content:space-between;grid-column:1 / -1;font-size:13px;padding:11px 16px;width:100%}
 .at-piece-label{display:none}.at-underword{bottom:28%;font-size:24vw}
 .cv-frame>span{height:28px;font-size:8px;padding:5px 8px}.cv-frame>img{height:calc(100% - 28px)}
 .ex-next-art{position:absolute;right:5%;bottom:5%;height:60%;width:82%;margin:0}.ex-next h2{font-size:11vw}
 .ex-experiment-head>div{max-width:100%}.ex-experiment-head h2{font-size:clamp(27px,7vw,39px);max-width:14em}.ex-experiment-head>p{font-size:12px}
 .ex-play-canvas.ex-light-compare{width:min(100%,calc(50vh * 1.5));width:min(100%,calc(50svh * 1.5));aspect-ratio:3 / 2}
 .ex-play-canvas.ex-tea-table{aspect-ratio:3 / 2}.ex-dialogue{inset:auto 3% 4%;gap:10px}.ex-dialogue span{font-size:12px;padding:7px 10px;max-width:46%}
 .ex-play-canvas.ex-score{aspect-ratio:auto;display:grid;grid-template-columns:1fr;padding:25px 12px;gap:20px}.ex-score>img{height:auto;max-height:230px}.ex-score-lines{min-height:160px}
 .ex-ruler-canvas.cv-direct-drag,.ts-canvas{touch-action:pan-y}.ts-stage-head{font-size:9px}
 .ts-section .section-head h2{font-size:32px;line-height:1.3;max-width:none}.ts-canvas{height:250px}.ts-stage{min-height:250px}
}
@media(max-height:560px){.at-scene,.at-detail.ex-opening{height:auto}.at-pin{position:relative;top:auto;height:680px}.at-scroll-cue{display:none}.ex-play-canvas.ex-light-compare{width:min(100%,600px)}}
@media(prefers-reduced-motion:reduce){.at-enter{transition:none}}
