/* Original game's metal/chipped-crystal assets surround the new room illustrations. */
.home-card { position:relative; isolation:isolate; padding:14px 14px 22px; margin:12px 0 16px; border:1px solid transparent; border-image:url('/assets/ui-mmorpg/action-frame.webp') 64 fill / 12px / 0 stretch; background:#183744; color:#dbedf1; }
.home-room-frame { position:relative; overflow:hidden; margin:0; aspect-ratio:3/2; touch-action:pan-y; border:1px solid #789cac; box-shadow:0 3px 12px #0005; }
.home-room-art { display:block; width:100%; height:100%; object-fit:cover; user-select:none; pointer-events:none; }
/* Unframed metal chevrons: the transparent 48px button remains easy to tap. */
.home-arrow { position:absolute; top:50%; transform:translateY(-50%); display:grid; place-items:center; width:48px; min-width:48px; min-height:48px; height:48px; padding:0; border:0; border-radius:0; background:none; box-shadow:none; }
.home-arrow span { display:block; width:21px; height:32px; margin:0; font-size:0; filter:drop-shadow(0 1px 1px #001018e6) drop-shadow(0 0 3px #c5efffa6); }
.home-arrow span::before { content:''; display:block; width:100%; height:100%; clip-path:polygon(75% 0,100% 16%,42% 50%,100% 84%,75% 100%,0 50%); background:linear-gradient(135deg,#f5fbff 4%,#ccdbe4 24%,#728a9a 44%,#eff8fc 51%,#a4bac9 68%,#e2edf5 84%,#8198a8 100%); }
.home-arrow-next span { transform:scaleX(-1); }
.home-arrow-prev { left:7px; }.home-arrow-next { right:7px; }
.home-arrow:disabled { opacity:.28; cursor:default; }
.home-arrow:disabled span { filter:drop-shadow(0 1px 1px #001018b3); }
.home-arrow:focus-visible { outline:2px solid #cdeaf6; outline-offset:-2px; }
.home-dots { display:flex; justify-content:center; align-items:center; gap:0; margin:9px 0 1px; }
.home-dots button { position:relative; min-height:26px; min-width:26px; width:26px; height:26px; border:0; border-radius:0; padding:0; background:none; box-shadow:none; }
.home-dots button::after { content:''; display:block; width:6px; height:6px; margin:auto; border-radius:50%; background:#66848e; border:1px solid #8aaab4; }
.home-dots button.is-active::after { width:16px; height:16px; border:0; border-radius:0; background:url('/assets/ui-mmorpg/crystal-mounted.webp') center/contain no-repeat; }
.home-room-description { text-align:center; }.home-room-description h2 { color:#edf7f7; font-size:22px; margin:4px 0; }.home-room-name { margin:4px 0 10px; font-size:13px; color:#a8c0c8; }.home-effect { color:#d0e4e9; font-size:14px; margin:0 0 17px; }.home-effect strong { color:#f1dfb5; }
.home-card .home-buy { display:flex; justify-content:center; align-items:center; width:100%; min-height:46px; margin:0; padding:11px 13px; white-space:normal; font-size:14px; line-height:1.3; }.home-buy:disabled { opacity:.62; }
.home-recovery { display:grid; justify-items:center; gap:3px; margin:17px 0 0; font-size:12px; line-height:1.5; color:#a2bec7; }.home-recovery span:first-child { color:#d2e8eb; font-weight:600; margin-bottom:2px; }
.home-extras { margin-bottom:15px; color:#bdd2da; }.home-extras summary { cursor:pointer; padding:12px 2px; font-size:13px; }.home-extras .full { margin-top:8px; }
.home-upgraded .home-room-art { animation:home-upgrade-reveal 1.1s ease-out both; }
@keyframes home-upgrade-reveal { 0% { filter:brightness(1.8) saturate(.65); transform:scale(1.045); } 100% { filter:brightness(1); transform:scale(1); } }
@media(max-width:360px) { .home-card { padding:12px 11px 18px; } .home-card .home-buy { font-size:13px; } .home-room-description h2 { font-size:20px; } }
@media(prefers-reduced-motion:reduce) { .home-upgraded .home-room-art { animation:none; } }

.home-arrow:active:not(:disabled) { transform:translateY(calc(-50% + 1px)); }

/* Home opens in the shared backpack-style modal; its shell owns the frame. */
#sheet[data-type="home"] .home-card { padding:0; margin:0 0 8px; border:0; border-image:none; background:none; }
#sheet[data-type="home"] .home-room-frame {
  aspect-ratio:auto; margin:7px 8px 0; padding:9px;
  border:1px solid transparent; border-radius:0;
  border-image:url('/assets/ui-mmorpg/action-frame.webp') 64 fill / 11px / 0 stretch;
  background:#102a37; box-shadow:0 4px 12px #0006;
}
#sheet[data-type="home"] .home-room-art { aspect-ratio:3/2; height:auto; }
#sheet[data-type="home"] .home-arrow-prev { left:17px; }
#sheet[data-type="home"] .home-arrow-next { right:17px; }
#sheet[data-type="home"] .home-room-description h2 { margin:3px 0; }
#sheet[data-type="home"] .home-effect { margin-bottom:12px; }
#sheet[data-type="home"] .home-recovery { margin-top:12px; }
#sheet[data-type="home"] .home-extras { margin-bottom:0; }