/* 4.4.5: decorative assets, retaining the 4.4.4 layout and animation. */
.interior-mist{position:fixed;inset:0;z-index:0;pointer-events:none;visibility:hidden;background:url('assets/visual-4.4.5/mist.webp') center bottom/auto min(100svh,1024px) no-repeat;opacity:.055}
body:not([data-mode=landing]){background:linear-gradient(135deg,#fdfcf9,#fbf7f0)}
body:not([data-mode=landing]) .interior-mist{visibility:visible}
body:not([data-mode=landing]) .sky-ambient{display:none}
.shell{position:relative;z-index:1}
.chest-cell{background:linear-gradient(145deg,#fdfbf8,#f8f3e8);box-shadow:inset 0 1px 2px #ffffffed,0 2px 6px #6c4d380a}
body:not(#ui-pass) .chest-cell.suggested{border-color:#ca9731;box-shadow:inset 0 0 0 2px #ca9731,inset 0 0 0 4px #fff3cf,0 3px 12px #bb8c3b26}
.chest-cell.winner{background:linear-gradient(145deg,#fffcd7,#ffeba6);border-color:#f3b123;box-shadow:inset 0 0 0 1px #ffda70,0 3px 10px #e0a92e26}
.shop-art.framed{border:0;border-radius:12px;background:transparent;box-shadow:none;isolation:isolate}
.shop-art.framed::after{display:none}
.shop-art.framed .shop-portrait{position:absolute;inset:6%;width:88%;height:88%;border-radius:4px;object-fit:contain;transform:none}
.shop-art.framed .shop-frame{position:absolute;inset:0;width:100%;height:100%;display:block;pointer-events:none;z-index:1}
.shop-art.framed .shop-frame img{display:block;width:100%;height:100%;object-fit:contain;border-radius:0;transform:none;transition:none}
.shop-card:hover>.shop-art.framed{box-shadow:none;transform:translateY(-3px)}
.shop-card:hover>.shop-art.framed img{transform:none}
.shop-art.framed .preview-seal{z-index:2;right:6%;bottom:6%;border:1px solid #dcb256;background:#fff9daed;color:#846018;box-shadow:0 2px 6px #704e1f1c}
.redeem-summary .shop-art.framed{flex-shrink:0}
/* Short phone viewports keep all primary play actions in the first screen. */
@media(max-width:760px) and (max-height:740px){
 body:not(#ui-pass)[data-round=active] .topbar:has(.app-nav:not([hidden])){height:88px}
 body:not(#ui-pass)[data-round=active] .scene{padding-top:4px;padding-bottom:12px}
 body:not(#ui-pass)[data-round=active] .role-toggle{margin-bottom:4px;padding-top:2px;padding-bottom:2px}
 body:not(#ui-pass)[data-round=active] .floor-line{margin-bottom:4px}
 body:not(#ui-pass)[data-round=active] .suggestion{min-height:40px;padding:4px 10px;margin-bottom:4px}
 body:not(#ui-pass)[data-round=active] .suggestion b{font-size:24px}
 body:not(#ui-pass)[data-round=active] .play-note{padding:0 9px;margin-bottom:0}
 body:not(#ui-pass)[data-round=active]:is([data-mode=account],[data-mode=guest]) .board-scene{max-width:clamp(224px,calc((100svh - 352px)*1.05),320px);padding-bottom:2px}
 body:not(#ui-pass)[data-round=active] .board{padding:8px}
 body:not(#ui-pass)[data-round=active] .chest-cell.playable{min-height:50px;aspect-ratio:1.2}
 body:not(#ui-pass)[data-round=active] .play-controls{margin-top:6px;margin-bottom:4px}
 body:not(#ui-pass)[data-round=active] .play-controls .button{min-height:44px;padding:8px 12px}
 body:not(#ui-pass)[data-round=active] .round-path{margin-bottom:4px}
 body:not(#ui-pass)[data-round=active] .round-path span{height:20px}
 body:not(#ui-pass)[data-round=active] .save-note{line-height:1.5}
 body:not(#ui-pass)[data-round=active] .sub-actions .text-btn{min-height:44px}
}
@media(max-width:760px) and (max-height:620px){
 body:not(#ui-pass)[data-mode=shop] .topbar:has(.app-nav:not([hidden])){height:100px;padding-top:7px}
 body:not(#ui-pass)[data-mode=shop] .workspace{padding-top:18px}
 body:not(#ui-pass)[data-mode=shop] .shop-grid{margin-top:0}
}
@media(prefers-reduced-motion:reduce){.shop-card:hover>.shop-art.framed{transform:none}}