.room-art{inset:0;background-size:cover;background-position:center;background-image:url('assets/livingroom.png')}
.stage[data-room=kitchen] .room-art{background-image:url('assets/kitchen-floor-v2.png');background-position:center}
.stage[data-room=bathroom] .room-art{background-image:url('../game%20art%20from%20illustrator/bathroom_new/bathroom_new/bathroom_new.png');background-position:center bottom}
.stage[data-room=bedroom] .room-art{background-image:url('assets/bedroom.png');background-position:center}
.pet{width:38%;height:55%;left:31%;bottom:19%;overflow:visible;animation:none!important;transform:none!important}
.pet:hover{transform:none}.pet>img{position:absolute;height:137%;width:auto;max-width:none;top:-29%;left:50%;transform:translateX(-50%);object-fit:initial;animation:none!important}
.pet[data-pose=sofa]{inset:0;width:100%;height:100%;pointer-events:auto;filter:none}
.pet[data-pose=sofa]>img{height:max(100%,calc(100vw * .5625));width:max(100%,calc((100svh - 110px) * 1.77778));top:50%;left:50%;transform:translate(-50%,-50%)}
.pet[data-pose=sofa] .dirt,.pet[data-pose=sofa] .foam{display:none}
.stage[data-room=living] .speech{left:67%;top:22%}
.stage[data-room=kitchen] .pet{bottom:30%;height:46%}
.stage[data-room=bathroom] .pet{bottom:22%;height:51%}
.stage[data-room=bathroom]::after{content:none}
.stage[data-room=bathroom] .shower{inset:18% 32% 26%}
.stage[data-room=bedroom] .pet{left:51%;width:34%;height:49%;bottom:20%}
.stage[data-room=bedroom] .speech{left:68%}
.stage[data-room=living] .plant{left:15%;height:20%;bottom:9%}
.dirt b{top:35%}.dirt b:nth-child(2){top:42%}.dirt b:nth-child(3){top:68%}
.foam{top:35%;left:27%;height:40%;width:48%}
@media(max-width:1100px){.stage[data-room=living] .speech{top:24%}.stage[data-room=bedroom] .speech{left:60%}}
@media(max-width:600px){
  .stage[data-room=living] .room-art{background-position:75% center}
  .pet{width:70%;height:42%;left:15%;bottom:28%}
  .pet[data-pose=sofa]>img{height:100%;width:auto;top:0;left:75%;transform:translateX(-75%)}
  .stage[data-room=living] .speech{left:50%;top:25%;max-width:76%}
  .stage[data-room=living] .plant{left:3%;height:17%;width:19%;bottom:25%}
  .stage[data-room=kitchen] .pet{bottom:38%;height:34%;width:70%;left:15%}
  .stage[data-room=bathroom] .pet{bottom:18%;height:42%;width:70%;left:15%}
  .stage[data-room=bathroom] .shower{inset:24% 16% 28%}
  .stage[data-room=bedroom] .pet{left:22%;width:70%;height:39%;bottom:27%}
  .stage[data-room=bedroom] .room-art{background-position:70% center}
  .stage[data-room=bedroom] .speech{left:50%}
}
.stage[data-room=living] .rug{bottom:5%}
.stage[data-room=living] .pet[data-animation=pet]{bottom:calc(19% + 40px)}
@media(max-width:600px){.stage[data-room=living] .pet[data-animation=pet]{bottom:calc(28% + 30px)}}
@media(max-width:600px){.stage[data-room=living] .rug{bottom:14%}}
main{width:100%;margin-inline:auto}
@media(orientation:landscape) and (max-height:600px){
  .header{height:44px;padding:0 12px}.brand{font-size:19px;gap:6px}.brand img{width:30px;height:30px}.brand small{font-size:6px}.balances{gap:7px}.balance{min-width:0;padding:4px 8px;font-size:12px}.header button{width:30px;height:29px;padding:5px}.header svg{width:15px;height:15px}
  .stage{height:calc(100svh - 44px);min-height:0;aspect-ratio:auto}.pet-heading{display:none}footer{display:none}
  .pet[data-pose=sofa]>img{width:100%;height:auto;top:50%;left:50%;transform:translate(-50%,-50%)}
  .needs{top:8px;width:310px;gap:7px}.need{padding:4px 6px 6px}.need-label{font-size:8px;gap:3px;margin-bottom:4px;flex-wrap:wrap}.need-label>svg{width:15px;height:15px;padding:2px}.need-label b{width:100%;font-size:8px;margin:0;text-align:right}.need progress{height:6px}
  .rooms{left:8px;top:85px;width:62px;gap:7px;display:grid;grid-template-columns:1fr;right:auto;bottom:auto}.rooms button{min-height:36px;padding:3px 2px;gap:2px;font-size:8px}.rooms svg{width:17px;height:17px}
  .mood{top:64px;right:9px;left:auto;padding:4px 6px;font-size:8px}.speech,.stage[data-room=living] .speech{top:20%;font-size:10px;padding:6px 10px;max-width:47%;box-shadow:2px 3px 0 #253735}.stage[data-room=living] .speech{left:66%}
  .care-menu{width:310px;bottom:12px}.care-menu h2{font-size:11px;margin-bottom:5px}.actions{gap:12px}.actions button{min-height:39px;padding:5px 10px;font-size:10px;grid-template-columns:21px 1fr;gap:2px 7px}.actions button>svg{width:21px;height:21px}.actions button small{font-size:8px}
  .pantry{width:220px;margin-bottom:7px;gap:7px}.food-choice{min-height:35px;display:grid;grid-template-columns:18px 1fr;padding:4px;font-size:9px;gap:2px}.food-choice.active{padding:4px}.food-choice>svg{width:18px;height:18px;grid-row:1/3}.food-choice small{font-size:8px}
  .room-bottom{display:none}.play-hud{bottom:73px;font-size:10px;padding:5px 8px}.plant-badge{font-size:8px;padding:3px 5px}.plant{bottom:10%}.float{font-size:22px}
  #journal-panel{top:63px;right:9px;padding:12px;width:250px;max-height:calc(100svh - 115px);overflow:auto}.section-title h2{font-size:14px}.task{padding:10px 0;font-size:10px}.garden-summary{margin-top:10px;padding-top:4px}
  .stage[data-room=living] .pet[data-animation=pet]{bottom:calc(19% + 14px)}
  dialog{max-height:calc(100svh - 24px);padding:18px 24px}dialog h2{font-size:20px}.shop-item{padding:10px;gap:7px}.shop-item>svg{width:28px;height:28px}
}
.care-menu h2{display:inline-block;background:#253735e6;padding:4px 9px;border-radius:4px;text-shadow:none}
.actions button:hover{transform:none;box-shadow:0 4px 0 #253735;filter:brightness(1.04)}
.actions button:active:not(:disabled){transform:translateY(3px);box-shadow:0 1px 0 #253735}
.actions button:disabled{transform:none;filter:none;box-shadow:0 3px 0 #253735}
.volume-control{display:flex;align-items:center;gap:10px}.volume-control input[type=range]{width:140px;height:20px}.volume-control output{min-width:38px;text-align:right;font-size:12px}
@media(orientation:landscape) and (max-height:600px){.setting-row{padding:10px 0}.setting-row input[type=checkbox]{width:18px;height:18px}}
.rooms #hidden-hunt{background:#c3d8ff}.rooms [data-room-tab=bedroom]{background:#f5bcd5}
@media(orientation:landscape) and (max-height:600px){.speech,.stage[data-room=living] .speech{top:24%}}
.hunt-preview{text-align:center;padding:10px 0}.hunt-preview>svg{width:54px;height:54px;color:#168378;margin:8px 0 14px}.hunt-preview .eyebrow{color:#168378}.hunt-preview img{width:120px;height:120px;object-fit:contain;display:block;margin:10px auto}
.stage[data-room=bedroom] .pet[data-pose=bed]{inset:0;width:100%;height:100%;filter:none}
.pet[data-pose=bed]>img{height:max(100%,calc(100vw * .5625));width:max(100%,calc((100svh - 110px) * 1.77778));top:50%;left:calc(50% + min(8vw,120px));transform:translate(-50%,-50%)}
.pet[data-pose=bed] .dirt,.pet[data-pose=bed] .foam,.pet[data-pose=bed] .sleep-z{display:none}
@media(orientation:landscape) and (max-height:600px){.pet[data-pose=bed]>img{width:100%;height:auto}}
@media(max-width:600px) and (orientation:portrait){.stage[data-room=bedroom] .pet[data-pose=bed]>img{height:100%;width:auto;left:20%;top:0;transform:translateX(-20%)}.stage[data-room=bedroom]:has(.pet[data-pose=bed]) .room-art{background-position:20% center}}
@media(max-width:600px) and (orientation:portrait){.rooms{grid-template-columns:repeat(5,1fr)}.rooms button{font-size:7px}}
.stage[data-room=kitchen],.stage[data-room=bathroom]{--standing-floor:70%}
.stage[data-room=kitchen] .pet,.stage[data-room=bathroom] .pet{left:31%;width:38%;bottom:calc(100% - var(--standing-floor));height:46%}
.stage[data-room=kitchen] .pet>img,.stage[data-room=bathroom] .pet>img{top:auto;bottom:0}
.stage[data-room=kitchen] .pet>img{bottom:-7.1%}
.stage[data-room=kitchen]::before,.stage[data-room=bathroom]::before{content:'';position:absolute;z-index:1;pointer-events:none;width:18%;height:2.2%;left:50%;top:var(--standing-floor);transform:translate(-50%,-35%);border-radius:50%;background:#20333126}
.stage[data-room=bathroom] .shower{inset:22% 38% 30%}
#shower.shower{inset:0;pointer-events:none;z-index:3;overflow:hidden}
@media(orientation:landscape) and (max-height:600px){
  .stage[data-room=kitchen],.stage[data-room=bathroom]{--standing-floor:64%}
  .stage[data-room=kitchen] .pet,.stage[data-room=bathroom] .pet{height:40%}
  .stage[data-room=kitchen] .speech,.stage[data-room=bathroom] .speech{left:76%;top:26%;max-width:32%}
  .stage[data-room=kitchen]::before,.stage[data-room=bathroom]::before{width:14%}
  .stage[data-room=bathroom] .shower{inset:24% 38% 36%}
}
@media(max-width:600px) and (orientation:portrait){
  .stage[data-room=kitchen],.stage[data-room=bathroom]{--standing-floor:66%}
  .stage[data-room=kitchen] .pet,.stage[data-room=bathroom] .pet{left:15%;width:70%;height:34%}
  .stage[data-room=kitchen]::before,.stage[data-room=bathroom]::before{width:28%}
}
.stage[data-room=bathroom]{--standing-floor:82%}
.stage[data-room=bathroom] .pet{inset:0;width:100%;height:100%}
.stage[data-room=bathroom] .pet>img,.shower-art{position:absolute;top:auto;bottom:14%;left:50%;height:78%;width:auto;max-width:none;transform:translateX(-50%);object-fit:contain}
#shower .shower-art,.shower-fixture .shower-art{bottom:6%;transform:translateX(-43%)}
.shower-fixture{position:absolute;inset:0;z-index:1;pointer-events:none;display:none}
.stage[data-room=bathroom] .shower-fixture{display:block}
.stage[data-room=bathroom] .pet .foam,.stage[data-room=bathroom] .pet .dirt{display:none}
.stage[data-room=bathroom] .speech{left:74%;top:24%;max-width:35%}
@media(max-width:600px) and (orientation:portrait){.stage[data-room=bathroom] .speech{left:50%;top:15%;max-width:80%}}
