/* Background, carpet and furniture remain independent of character/save data. */
.room{height:auto;aspect-ratio:3/2;background:#6c6453;--pet-size:clamp(96px,24vw,216px);isolation:isolate}
.room .scenery,.room .season-decor{display:none}
.room-scene{position:absolute;inset:0;z-index:0;pointer-events:none;background:url('assets/rooms/empty-autumn-v4-preview.png') center/100% 100% no-repeat}
.room-rug{position:absolute;left:0;top:5%;width:100%;height:100%}
.room[data-rug=warm] .room-rug{filter:sepia(1) saturate(1.3) brightness(.92)}
.room[data-rug=none] .room-rug{display:none}
.room-customize{display:flex;flex-wrap:wrap;align-items:center;gap:10px;margin:-6px 0 16px}
.room-customize label select{display:block;margin-top:4px}
.room[data-choice-wall=map] [data-choice=clock],.room[data-choice-wall=clock] [data-choice=map],.room[data-choice-wall=none] [data-category=wall],.room[data-choice-floor=bookshelf] [data-choice=model],.room[data-choice-floor=model] [data-choice=bookshelf],.room[data-choice-floor=none] [data-category=floor],.room[data-choice-desk=none] [data-item=desk],.room[data-choice-window=none] [data-item=window]{display:none}
.room-customize label{margin:0}
.room-customize small{font-size:12px;color:#72776a}
.furniture-layer{position:absolute}
.furniture-layer img{display:block;width:100%;height:100%}
.room[data-furniture=desk] [data-mode=bed],.room[data-furniture=bed] [data-mode=desk]{display:none}
.room .pet-position{left:62%;bottom:13%;width:var(--pet-size);z-index:2}
.room .pet,.room #avatar{width:var(--pet-size);height:calc(var(--pet-size)*208/192)}
.room .shadow{width:65%;height:7px;background:#251b1850;filter:blur(3px)}
.room .speech{top:4%;z-index:4;font-size:clamp(11px,1.5vw,15px);padding:7px 16px;background:#fffdf3ed;box-shadow:0 2px 12px #0002}
.room .hint{bottom:2%;z-index:4;color:#fffaf0;text-shadow:0 1px 3px #251c15;font-size:clamp(10px,1.2vw,13px)}
.room-description{font-size:12px;color:#72776a;margin:0 0 16px}
/* Four waking periods, followed by lights-out. Furniture does not move with light. */
.room[data-light=morning] .room-scene{filter:brightness(1.02) saturate(.95)}
.room[data-light=day] .room-scene{filter:sepia(.16) brightness(1.08) saturate(1.04)}
.room[data-light=evening] .room-scene{filter:sepia(.32) saturate(1.15) brightness(.82)}
.room[data-light=night] .room-scene{filter:brightness(.7) saturate(.8)}
.room[data-light=night] .room-scene::after{content:'';position:absolute;inset:0;background:radial-gradient(ellipse at 50% 0%,#ffe6a350,transparent 70%)}
/* Cover the outside glass, leaving its wooden frame and sill visible. */
.room[data-light=night] [data-item=window]::after,.room[data-light=sleep] [data-item=window]::after{content:'';position:absolute;left:9.3%;top:24.1%;width:81.4%;height:43%;background:#02050a;opacity:.97}
.room[data-light=sleep] .room-scene{filter:brightness(.10) saturate(.45)}
.room[data-light=evening] .pet{filter:sepia(.13) brightness(.9)}
.room[data-light=night] .pet{filter:brightness(.8)}
.room[data-light=sleep] .pet{filter:brightness(.13) saturate(.45)}
.room[data-light=sleep] .speech{background:#20252bed;color:#c3c7cb}
.room[data-light=sleep] .hint{opacity:.35}
.room[data-furniture=bed] .pet-position{left:22%;bottom:14%}
.room[data-furniture=bed] .shadow{display:none}
@media(max-width:620px){.room{border-radius:14px}.room .speech{padding:5px 10px}}

/* Scale from the feet so walking into the room remains grounded. */
.room .pet-position{transform-origin:50% 100%}
.room[data-character-state=READING] .pet::before{content:'';position:absolute;z-index:3;left:26%;bottom:12%;width:48%;height:22%;border:2px solid #614b35;border-bottom:4px solid #806b4d;border-radius:3px;background:linear-gradient(90deg,#f3ead1 48%,#8e775a 49%,#8e775a 52%,#fff6df 53%);box-shadow:0 2px 2px #0003;pointer-events:none;transform:rotate(-3deg)}