#room-cards{position:fixed;inset:0;z-index:2;pointer-events:none;overflow:hidden}
#room-cards>svg{position:absolute;inset:0;width:100%;height:100%;overflow:visible}
#room-cards path{stroke:rgba(var(--theme),.65);stroke-width:1;fill:none}
#room-cards circle{fill:rgb(var(--theme));stroke:#fff9;stroke-width:1}
.room-float-card{position:absolute;left:0;top:0;width:168px;height:102px;margin:0;padding:10px;border:1px solid rgba(var(--theme),.28);border-top-color:rgba(var(--theme),.52);border-radius:16px;background:linear-gradient(140deg,rgba(var(--theme),.10),transparent),#1a202de8;box-shadow:0 8px 22px #0002,inset 0 1px 0 #ffffff12;pointer-events:auto;contain:layout style;animation:card-appear .25s ease-out}
.room-float-card[hidden]{display:none!important}
.room-float-card:has([data-room-light]){height:72px}
.room-float-heading{display:flex;justify-content:space-between;align-items:center;margin-bottom:8px;gap:5px;line-height:16px}
.room-float-heading strong{font-size:12px;font-weight:700}
.room-float-heading span{font-size:9px;color:#afb6c5}
.room-float-actions{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:4px}
.room-float-actions:has([data-room-light]){grid-template-columns:repeat(2,minmax(0,1fr))}
.room-float-actions button{padding:4px 0;border-radius:8px;font-size:10px;line-height:16px;border-color:#ffffff19;background:#ffffff04;color:#dce1ed;min-width:0}
.room-float-actions button:hover{background:#ffffff15}
.room-float-actions button[aria-pressed=true]{background:rgba(var(--theme),.23);border-color:rgba(var(--theme),.6);color:#fff}
.room-float-card:focus-within{border-color:rgba(var(--theme),.8)}
@keyframes card-appear{from{opacity:0;filter:blur(4px)}to{opacity:1;filter:blur(0)}}
@media(max-width:600px){.room-float-card{width:140px;padding:10px 7px}.room-float-heading span{font-size:8px}.room-float-actions button{font-size:9px}}
@media(prefers-reduced-motion:reduce){.room-float-card{animation:none}}
.room-float-card,.room-float-card:has([data-room-light]){height:36px;padding:0;background:rgba(28,30,36,.36);backdrop-filter:blur(16px) saturate(115%);-webkit-backdrop-filter:blur(16px) saturate(115%);border-color:#ffffff38;border-top-color:#ffffff70;border-radius:12px;transition:height .22s ease,background .22s ease;overflow:hidden}
.room-float-card{width:max-content;--popup-width:168px}
.room-float-card.is-open{width:var(--popup-width);height:102px;background:rgba(28,30,36,.60);z-index:1;translate:var(--expand-shift,0px) var(--expand-rise,0px)}
.room-float-card.is-open:has([data-room-light]){height:72px}
.room-float-heading{position:relative;width:max-content;height:34px;margin:0;padding:0 10px;border:0;border-radius:11px;background:transparent!important;box-shadow:none;color:#fff;cursor:pointer;white-space:nowrap}
.is-open .room-float-heading{width:100%}
.room-float-heading span{position:absolute;right:10px;opacity:0;visibility:hidden;transition:opacity .2s ease,visibility .2s}
.is-open .room-float-heading span{opacity:1;visibility:visible}
.room-float-actions{position:absolute;top:34px;left:0;width:calc(var(--popup-width) - 2px);padding:0 9px;opacity:0;filter:blur(5px);visibility:hidden;transition:opacity .22s ease,filter .22s ease,visibility .22s}
.is-open .room-float-actions{opacity:1;filter:blur(0);visibility:visible}
@media(max-width:600px){.room-float-card{--popup-width:140px}}
@media(prefers-reduced-motion:reduce){.room-float-card,.room-float-actions,.room-float-heading span{transition:none}}
