/* Physical Cloud panels — original artwork, scoped to containers only.
   Load LAST after cozy-ui.css. Button declarations and gameplay artwork are
   intentionally absent. A single uneven cloud silhouette replaces the old rectangle. The cloud
   background never clips content or focus rings, and does not intercept input. */
#panel,
#trophyScreen>section,
#prizeReveal>div,
.sound-dialog,
#playGuide,
#powerBatchReveal,
#combinedPrizeReveal{
  background:transparent url("ui/cloud-frame.svg") center / 100% 100% no-repeat!important;
  background-origin:border-box!important;
  background-clip:border-box!important;
  border:28px solid transparent!important;
  border-image:none!important;
  border-radius:0!important;
  box-shadow:none!important;
  /* No filter/drop-shadow: it would also change buttons and character pixels. */
  color:#f6f1e7;
  padding:24px clamp(22px,8vw,34px)!important;
  scrollbar-color:#b7bfdf #555578;
}
/* Higher specificity cancels v13's menu-only rectangular border-radius. */
body[data-mode="menu"] #panel{border-radius:0!important}
#panel::after,#panel::before{display:none!important;content:none!important}
#panel{width:min(444px,calc(100vw - 24px));max-height:calc(100dvh - env(safe-area-inset-top) - env(safe-area-inset-bottom) - 24px);overflow-y:auto;overflow-x:hidden;overscroll-behavior:contain;touch-action:pan-y;scrollbar-gutter:auto}
#trophyScreen>section{width:min(484px,calc(100vw - 24px))!important;flex-basis:484px;max-height:calc(100dvh - env(safe-area-inset-top) - env(safe-area-inset-bottom) - 24px)}
.sound-dialog,#playGuide,#powerBatchReveal,#combinedPrizeReveal{box-sizing:border-box;width:min(484px,calc(100vw - 24px));max-height:calc(100dvh - env(safe-area-inset-top) - env(safe-area-inset-bottom) - 24px);overflow-y:auto;overscroll-behavior:contain;touch-action:pan-y}
#prizeReveal>div{max-width:calc(100vw - 24px)!important;max-height:calc(100dvh - env(safe-area-inset-top) - env(safe-area-inset-bottom) - 24px)}
/* Preserve all achievement card colors/contrast, buttons, and HUD from v13.
   Only panel prose moves onto this cooler cloud interior. */
#panel #message,#panel>p,#panel>p>small,.sound-dialog>p,.sound-detail,#playGuide p,#trophyScreen .trophy-count{color:#e1dfed!important}
#panel .pixel-eyebrow,.sound-heading small,#playGuide .guide-kicker{color:#dedff4!important}
#overlay{padding:12px max(12px,env(safe-area-inset-right)) max(12px,env(safe-area-inset-bottom)) max(12px,env(safe-area-inset-left))}
#combinedPrizeReveal::backdrop{background:#211e30cc;backdrop-filter:blur(3px)}
@media(max-width:430px){
  #panel,#trophyScreen>section,#prizeReveal>div,.sound-dialog,#playGuide,#powerBatchReveal,#combinedPrizeReveal{border-width:22px!important;padding:26px clamp(22px,8vw,34px)!important}
}
@media(max-width:360px){
  #panel,#trophyScreen>section,#prizeReveal>div,.sound-dialog,#playGuide,#powerBatchReveal,#combinedPrizeReveal{border-width:18px!important;padding:26px clamp(22px,8vw,34px)!important}
  #panel{width:calc(100vw - 20px)}
}
@media(max-height:640px){
  #panel,#trophyScreen>section,#prizeReveal>div,.sound-dialog,#playGuide,#powerBatchReveal,#combinedPrizeReveal{border-top-width:18px!important;border-bottom-width:18px!important;padding-top:26px!important;padding-bottom:22px!important}
  #trophyScreen>section{height:calc(100dvh - env(safe-area-inset-top) - env(safe-area-inset-bottom) - 24px)!important}
}