/* v522: opaque cards, a full-width board, and Telegram-safe landscape. */
html #app #life.active #person.nativeDeck .heroCard {
 opacity:1!important;
 background-color:#111621!important;
 transition:filter .3s ease,transform .3s ease!important;
}
html #app #life.active #person.nativeDeck .heroCard:not(.active) {
 opacity:1!important;filter:brightness(.62)!important;
}
html #app #life.active #person.nativeDeck .heroCard.active {filter:brightness(1)!important}
@media (orientation:landscape) and (min-width:600px) {
 html body:has(#app .page.active),html body:has(#app .page.active) #app {
  height:var(--layout-height,100dvh)!important;
 }
 html body:has(#app .page.active) #app {
  padding-top:max(6px,env(safe-area-inset-top,0px),var(--game-safe-top,0px))!important;
  padding-bottom:max(6px,env(safe-area-inset-bottom,0px),var(--game-safe-bottom,0px))!important;
  padding-left:max(8px,env(safe-area-inset-left,0px),var(--game-safe-left,0px))!important;
  padding-right:max(8px,env(safe-area-inset-right,0px),var(--game-safe-right,0px))!important;
  grid-template-columns:clamp(150px,24vw,190px) minmax(0,1fr)!important;
  grid-template-rows:78px 66px minmax(0,1fr)!important;
  gap:6px!important;box-sizing:border-box!important;
 }
 html body:has(#app .page.active) #app>header {height:78px!important;min-height:0!important}
 html body:has(#app .page.active) #app>section.money.economy4 {height:66px!important}
 html #app>nav.mainNavV369>button {padding:0 8px!important;gap:8px!important}
 html #app>nav.mainNavV369>button img {width:clamp(18px,5dvh,28px)!important;height:clamp(18px,5dvh,28px)!important}
 html #app #depot.page.active {
  grid-template-columns:minmax(0,1fr) clamp(130px,21vw,180px)!important;
  gap:6px!important;
 }
 html #app #depot.active>#mergeBoard.artifactBoard {
  width:100%!important;height:100%!important;max-width:none!important;max-height:none!important;
  min-width:0!important;min-height:0!important;aspect-ratio:auto!important;
  align-self:stretch!important;justify-self:stretch!important;margin:0!important;
  grid-template-columns:repeat(7,minmax(0,1fr))!important;
  grid-template-rows:repeat(7,minmax(0,1fr))!important;
 }
 html #app #mergeBoard.artifactBoard>.artifactCell {
  width:100%!important;height:100%!important;min-width:0!important;min-height:0!important;
  max-width:none!important;max-height:none!important;aspect-ratio:auto!important;box-sizing:border-box!important;
 }
 html #app #mergeBoard.artifactBoard .artifactCell img {object-fit:contain!important}
 html #app #depot.active>#depotSide {padding:8px!important;gap:8px!important}
 html #app #life.active>.cardProgress {flex-basis:26px!important;height:26px!important;min-height:26px!important;padding:3px 10px!important}
 html #app #life.active>.cardProgress>div:first-child {margin-bottom:2px!important}
}
@media(prefers-reduced-motion:reduce){html #app #life.active #person.nativeDeck .heroCard{transition:none!important}}

/* Home lives outside #app; reserve Telegram chrome in both orientations. */
html body>#cats.homeStudio.active {
 top:calc(var(--hs-vy,0px) + var(--game-safe-top,0px))!important;
 left:calc(var(--hs-vx,0px) + var(--game-safe-left,0px))!important;
 width:calc(var(--hs-vw,100vw) - var(--game-safe-left,0px) - var(--game-safe-right,0px))!important;
 height:calc(var(--hs-vh,100dvh) - var(--game-safe-top,0px) - var(--game-safe-bottom,0px))!important;
}
#cats.homeStudio>.hs-shelves{padding-top:40px!important;box-sizing:border-box!important;z-index:60!important}
#cats.homeStudio .hs-drawerclose {
 position:absolute!important;top:3px!important;right:10px!important;
 width:auto!important;min-width:104px!important;height:34px!important;
 padding:4px 12px!important;z-index:65!important;display:flex!important;
 align-items:center!important;justify-content:center!important;
 color:#ffe1a2!important;background:#161e30!important;border:1px solid #6c6070!important;
 border-radius:12px!important;font:600 12px/1 system-ui!important;touch-action:manipulation;
}