/* Approved gameplay carousel. Artwork stays separate from live text and game UI. */
.gameplay-gallery { padding:0; background:#f6f0e5; color:#181b1d; color-scheme:light; font-family:'IBM Plex Sans KR','Malgun Gothic',sans-serif; }
.gallery-stage { position:relative; max-width:1800px; margin:auto; background:#f6f0e5 url('assets/gallery/backdrop.webp') center/cover no-repeat; isolation:isolate; }
[data-gallery-viewport] { touch-action:pan-y pinch-zoom; }
.gameplay-scene { position:relative; aspect-ratio:1672/970; overflow:hidden; isolation:isolate; background:#fff8ee url('assets/gallery/backdrop.webp') center/cover no-repeat; }
.scene-copy { position:absolute; z-index:2; top:4.5%; left:5.5%; width:57%; }
.scene-copy>p:first-child { font-size:clamp(12px,1.35vw,23px); line-height:1.5; color:#39332c; letter-spacing:-.035em; }
.scene-copy h2 { font-family:inherit; font-weight:700; font-size:clamp(31px,3.6vw,61px); line-height:1.23; letter-spacing:-.055em; margin:10px 0 13px; }
.scene-description { font-size:clamp(12px,1.25vw,21px); line-height:1.65; letter-spacing:-.025em; max-width:95%; }
.compact-break { display:none; }
.scene-screen { position:absolute; z-index:2; top:33%; left:2%; width:57%; aspect-ratio:16/9; border:2px solid #b69a59; box-shadow:0 0 0 3px #fff8e480,0 12px 35px #6f542227; background:#111a1c; }
.scene-screen>img { width:100%; height:100%; object-fit:contain; }
.screen-wordmark-cover { position:absolute; left:0; top:0; width:26%; height:5.55%; display:flex; align-items:center; gap:12%; padding-left:3%; background:#090a08; color:#e9e3d5; font-size:clamp(9px,1.5vw,25px); line-height:1; }
.screen-wordmark-cover>span { font-size:.58em; font-weight:600; }
.scene-character { position:absolute; z-index:1; pointer-events:none; }
.scene-character img { width:100%; max-width:none; height:auto; }
.athena .scene-character img,.poseidon .scene-character img { filter:url('#gallery-white-key'); }
.athena .scene-character { width:61%; right:-17%; top:5%; }
.poseidon .scene-character { width:57%; right:-12%; top:-14%; }
.artemis .scene-character { width:45%; right:-4%; top:-3%; mix-blend-mode:normal; }
.gallery-controls { position:absolute; z-index:3; bottom:2.3%; left:2%; width:57%; height:7%; display:flex; align-items:center; gap:15px; padding:0 4%; background:#fffbf2d9; border-block:1px solid #b99c653b; }
.gallery-tabs { display:flex; flex:1; justify-content:space-evenly; gap:12px; }
.gallery-tabs button { font:inherit; font-size:clamp(12px,1.25vw,20px); font-weight:500; padding:9px 7px; border:0; border-bottom:3px solid transparent; color:#4d463b; background:transparent; white-space:nowrap; }
.gallery-tabs button span { font-size:.85em; margin-right:10px; }
.gallery-tabs button[aria-selected=true] { color:#6f4c16; border-bottom-color:#bd8b2b; font-weight:700; }
.gallery-arrow { flex:0 0 44px; height:44px; padding:0; border:0; background:none; color:#654f32; font-size:26px; }
.gallery-arrow:hover,.gallery-tabs button:hover { color:#ad7520; }
.gallery-after { text-align:center; padding:18px 24px 44px; border-top:1px solid #b79c6c35; }
.gallery-disclaimer { font-size:10px; color:#767367; }
.gallery-after .button { margin-top:20px; box-shadow:none; gap:22px; font-family:inherit; }
.sr-only { position:absolute; width:1px; height:1px; margin:-1px; padding:0; border:0; overflow:hidden; clip-path:inset(50%); white-space:nowrap; }
@media(min-width:1800px) { .scene-copy h2 { font-size:65px; } }
@media(max-width:1000px) and (min-width:701px) {
 .scene-copy { top:3%; }
 .scene-copy h2 { font-size:3.65vw; margin:7px 0; }
 .scene-copy>p:first-child,.scene-description { font-size:1.4vw; }
 .gallery-controls { padding:0 1%; gap:4px; }
 .gallery-tabs { gap:2px; }
}
@media(max-width:700px) {
 .gameplay-scene { aspect-ratio:auto; height:calc(515px + 51.75vw); }
 .scene-copy { top:29px; left:6%; width:88%; }
 .scene-copy>p:first-child { font-size:11px; }
 .scene-copy h2 { margin-top:12px; font-size:30px; line-height:1.25; }
 .scene-description { font-size:12px; width:57%; line-height:1.8; margin-top:18px; }
 .compact-break { display:initial; }
 .scene-character { height:275px; overflow:hidden; }
 .athena .scene-character { width:69%; top:161px; right:-10%; }
 .poseidon .scene-character { width:58%; top:146px; right:-8%; height:290px; }
 .poseidon .scene-description { width:49%; }
 .artemis .scene-character { width:53%; top:121px; right:-3%; height:315px; }
 .scene-screen { top:435px; left:4%; width:92%; border-width:1px; }
 .screen-wordmark-cover { font-size:16px; }
 .gallery-controls { height:54px; left:4%; width:92%; bottom:5px; padding:0; gap:4px; background:#fffaf0; }
 .gallery-tabs { gap:1px; }
 .gallery-tabs button { font-size:12px; padding:9px 5px; }
 .gallery-tabs button span { font-size:10px; margin-right:5px; }
 .gallery-arrow { flex-basis:35px; }
 .gallery-after { padding-bottom:30px; }
}
@media(min-width:440px) and (max-width:700px) {
 .gameplay-scene { height:calc(520px + 51.75vw); }
 .scene-screen { top:440px; }
 .gallery-controls { bottom:9px; }
 .athena .scene-character { width:52%; right:-4%; }
 .poseidon .scene-character { width:44%; top:115px; height:325px; }
 .artemis .scene-character { width:43%; }
}