
.has-room-background{position:relative;isolation:isolate;overflow:hidden!important}
.room-bg-art{position:absolute;inset:0;z-index:-1;pointer-events:none;background:#171b22;overflow:hidden;border-radius:inherit}
.room-bg-art canvas,.room-bg-art i,.room-bg-art b{position:absolute;inset:0;width:100%;height:100%;pointer-events:none}
.room-bg-art canvas{display:none}
.room-bg-rb-gold{background:linear-gradient(115deg,#16130f,#2b2216 60%,#16130f)}
.room-bg-rb-gold canvas{display:block}
.room-bg-rb-gold i{background:url(./assets/room-backgrounds/golden-tide.png) center/cover;opacity:.18}
.room-bg-rb-gold canvas{z-index:1}
.room-bg-rb-minimal{background:linear-gradient(120deg,#202c32,#33454a 50%,#18242a)}
.room-bg-rb-minimal i{background:radial-gradient(ellipse at 20% 70%,#d0dfcc35,transparent 45%);animation:room-soft-light 16s ease-in-out infinite alternate}
.room-bg-rb-aurora{background:linear-gradient(120deg,#101b2b,#123438,#181e34)}
.room-bg-rb-aurora i{inset:-30%;width:160%;height:160%;background:linear-gradient(112deg,transparent 30%,#68cbae35 42%,#a7e6db60 46%,#8ea3e62c 52%,transparent 64%);filter:blur(22px);animation:room-aurora 12s ease-in-out infinite alternate}
.room-bg-rb-aurora b{background:radial-gradient(circle,#dcfaff88 0 1px,transparent 2px);background-size:173px 117px;opacity:.4;animation:room-soft-light 10s ease-in-out infinite alternate}
.room-bg-rb-obsidian{background:linear-gradient(125deg,#171b22,#35313d 48%,#171a22)}
.room-bg-rb-obsidian i{background:linear-gradient(130deg,transparent 34%,#d9cce724 34.2%,transparent 34.6%),linear-gradient(35deg,transparent 55%,#e4d6e427 55.2%,transparent 55.6%);animation:room-crystal 15s ease-in-out infinite alternate}
.room-bg-rb-obsidian b{background:linear-gradient(115deg,transparent 35%,#d4bfe518 50%,transparent 65%);animation:room-crystal 9s ease-in-out infinite alternate}
@keyframes room-soft-light{to{transform:translateX(18%) scale(1.1);opacity:.5}}
@keyframes room-aurora{to{transform:translateX(14%) skewX(-12deg);opacity:.65}}
@keyframes room-crystal{from{transform:translateX(-12%)}to{transform:translateX(12%)}}
body.soft-ui .mic-panel.has-room-background{background:transparent;color:#f3f5f7}
body.soft-ui .has-room-background .mic-head{background:#12182070;color:#f3f5f7;border-color:#ffffff20}
body.soft-ui .has-room-background .mic-tip{color:#cad4dd}
.has-room-background .chan-empty{color:#d3dce4}
.bp-room-background-preview{width:100%;height:240px;border:1px solid #ffffff25;border-radius:10px;background:#1b2028}
.bp-room-background-preview .room-bg-art{z-index:0}
.bp-prev .bp-room-thumb{display:block;width:100%;height:72px;border-radius:7px}


@media(max-width:620px){.bp-room-background-preview{height:140px}}

/* Room backgrounds always play, including previews in the backpack. */
#bpModal .room-bg-rb-minimal i{animation:room-soft-light 16s ease-in-out infinite alternate!important}
#bpModal .room-bg-rb-aurora i{animation:room-aurora 12s ease-in-out infinite alternate!important}
#bpModal .room-bg-rb-aurora b{animation:room-soft-light 10s ease-in-out infinite alternate!important}
#bpModal .room-bg-rb-obsidian i{animation:room-crystal 15s ease-in-out infinite alternate!important}
#bpModal .room-bg-rb-obsidian b{animation:room-crystal 9s ease-in-out infinite alternate!important}

/* All four room materials now render continuously on their own canvas. */
.room-bg-art canvas{display:block;z-index:1}
.room-bg-art:not(.room-bg-rb-gold) i,.room-bg-art:not(.room-bg-rb-gold) b{display:none}
