/* Un único grupo mantiene separados los controles, también en pantallas pequeñas. */
.control-stack{position:fixed;z-index:25;right:4%;bottom:max(28px,calc(env(safe-area-inset-bottom) + 12px));display:flex;align-items:center;gap:12px}
.control-stack .global-controls,.control-stack .credits-button{position:static;inset:auto;margin:0;flex-shrink:0}
.control-stack .global-controls{gap:0;padding:4px}
.control-stack .global-controls .icon-button{width:44px;height:44px}
.utility-controls{display:flex;align-items:center;gap:6px}
.control-stack .credits-button,.guide-button{width:44px;height:44px;min-width:44px;min-height:44px;padding:0;display:grid;place-items:center;background:#100b16ed;border:1px solid #c59ba650;color:#e3bccd;clip-path:polygon(7px 0,100% 0,100% calc(100% - 7px),calc(100% - 7px) 100%,0 100%,0 7px)}
.guide-button{font-family:'Reenie Beanie',cursive;font-size:32px;line-height:1}
.control-stack .credits-button{font-size:15px;letter-spacing:0}
.story-navigation{bottom:110px}
.hint-target{outline:1px solid #f0c0d2!important;outline-offset:5px;box-shadow:0 0 18px #d59aa52e}
.control-hint{position:fixed;z-index:50;width:232px;padding:14px 30px 14px 17px;background:#1a101bee;color:#efd6db;border:1px solid #bc8b9d87;box-shadow:0 6px 28px #0006;clip-path:polygon(7px 0,100% 0,100% calc(100% - 8px),calc(100% - 8px) 100%,0 100%,0 7px);animation:hint-arrive .35s ease-out;pointer-events:none}
.control-hint strong{display:block;font-family:'Reenie Beanie',cursive;font-size:28px;font-weight:400;line-height:1.02;color:#edbfcd}
.control-hint p{font-family:'Sora',sans-serif;font-size:10px;line-height:1.65;margin:8px 0 0;text-wrap:pretty;color:#e2cdd3}
.control-hint button{pointer-events:auto;position:absolute;right:2px;top:2px;width:29px;height:29px;display:grid;place-items:center;color:#bb96a8;font-size:18px}
.control-hint button:hover{color:white}
@keyframes hint-arrive{from{opacity:0;translate:0 4px}to{opacity:1;translate:0 0}}
.controls-guide{width:min(590px,calc(100vw - 28px));max-height:88svh;padding:0 31px 30px;background:#150e19;color:#e9d7dc;border:1px solid #bb8a9f70;border-radius:2px;scrollbar-width:thin;scrollbar-color:#816072 #150e19}
.controls-guide h2{font-family:'Reenie Beanie',cursive;font-size:48px;font-weight:400;line-height:1;margin:35px 0 13px;color:#ecc0ce}
.guide-intro{font-size:10px;line-height:1.8;color:#bba2b1;margin:0 0 22px}
.guide-list{display:grid;gap:0;margin:0}
.guide-list>div{display:grid;grid-template-columns:34px minmax(0,1fr);gap:13px;padding:15px 0;border-top:1px solid #b17b932c}
.guide-list svg{width:24px;height:24px;color:#d3a0b6;align-self:start;margin-top:3px}
.guide-list dt{font-family:'Cormorant Garamond',serif;font-size:24px;line-height:1.1;color:#f0d1d8}
.guide-list dd{font-family:'Sora',sans-serif;font-size:10px;line-height:1.8;color:#cbb4c2;margin:7px 0 0}
.guide-glyph{font-family:'Reenie Beanie',cursive;font-size:27px;color:#dbafbf}
.guide-replay{font-family:'Reenie Beanie',cursive;font-size:26px;color:#e2b6c6;border-bottom:1px solid #b57f936b;min-height:44px;margin:22px 0 0}
.immersive .frame-header,.immersive .story-navigation,.immersive .last-reel,.immersive .flow-button,.immersive .trail,.immersive .music-dock,.immersive .control-stack,.immersive .film-progress{visibility:hidden;opacity:0;pointer-events:none}
.immersive .control-hint{display:none}
.immersive .collection.teaser,.immersive .memory-counter{visibility:hidden}
.immersive #experience{cursor:none}.immersive #languageMoment,.immersive #finale,.immersive .immersive-exit{cursor:auto}
.immersive-exit{position:fixed;z-index:40;left:50%;bottom:max(22px,calc(env(safe-area-inset-bottom) + 12px));translate:-50% 0;padding:9px 18px;background:#100b16dd;border:1px solid #c095a64d;color:#e7c6d2;font-family:'Reenie Beanie',cursive;font-size:25px;line-height:1;min-height:44px;white-space:nowrap;animation:hint-arrive .35s ease-out}
.immersive-exit:after{content:'';position:absolute;bottom:4px;left:18%;right:18%;height:6px;border-bottom:1px solid #dcafbe5e;border-radius:50%;rotate:-3deg}
@media(max-width:700px){
 .control-stack{left:13px;right:8px;bottom:max(16px,calc(env(safe-area-inset-bottom) + 9px));justify-content:space-between;gap:8px}
 .control-stack .global-controls{padding:3px}
 .utility-controls{gap:5px}
 .music-dock{left:13px;right:13px;max-width:none;bottom:max(81px,calc(env(safe-area-inset-bottom) + 74px))}
 .music-dock .icon-button{width:44px;height:44px}
 .story-navigation{bottom:max(149px,calc(env(safe-area-inset-bottom) + 142px))}
 .control-hint{width:190px;padding:11px 24px 12px 13px}
 .control-hint strong{font-size:24px}.control-hint p{font-size:9px;line-height:1.65;margin-top:6px}
 .controls-guide{padding:0 23px 25px;max-height:90svh}.controls-guide h2{font-size:41px}.guide-list>div{gap:9px;padding:14px 0}.guide-list dd{font-size:10px}
}
@media(orientation:landscape) and (max-height:580px){
 .control-stack{left:auto;right:5%;bottom:max(12px,env(safe-area-inset-bottom));gap:10px}
 .control-stack .global-controls{padding:3px}
 .music-dock{left:5%;right:auto;max-width:min(240px,32vw);bottom:max(12px,env(safe-area-inset-bottom))}
 .story-navigation{bottom:max(12px,env(safe-area-inset-bottom));right:calc(5% + 307px)}
 .control-hint{width:232px;padding:10px 29px 11px 14px}.control-hint strong{font-size:25px}.control-hint p{font-size:9px;line-height:1.6;margin-top:5px}
 .controls-guide{width:min(690px,90vw);max-height:92svh}.guide-list{grid-template-columns:1fr 1fr;column-gap:27px}.guide-list>div{gap:8px}.controls-guide h2{font-size:39px}
 .immersive-exit{font-size:23px;bottom:12px}
}
@media(orientation:landscape) and (max-height:580px) and (max-width:760px){.story-navigation{bottom:80px;right:5%}}
@media(prefers-reduced-motion:reduce){.control-hint,.immersive-exit{animation:none}}