/* Camera commands return to a quiet resting state after activation. */
#views button,#views button[data-view=top]{background:#ffffff08;border:1px solid #ffffff24;color:#c8cbcd;box-shadow:inset 0 1px 0 #ffffff06;transition:background .2s,border-color .2s,color .2s}
@media(hover:hover){#views button:hover:not([data-triggered]){background:#ffffff18;border-color:#ffffff50;color:#fff}}
#views button:active{background:#ffffff22;border-color:#ffffff65}
.room-scenes button::after,.room-scenes button[aria-pressed=true]::after{content:'';width:6px;height:6px;right:12px;bottom:16px;border:1px solid #ffffff50;border-radius:50%;background:transparent;box-shadow:none}
.room-scenes button[aria-pressed=true]::after{background:rgb(var(--theme));border-color:rgb(var(--theme))}
.room-float-card:hover,.room-float-card:focus-within{opacity:1;border-color:#ffffff70;background:#34363870}
/* Use the same dimensions for the room rail and its header control. */
:root{--room-rail-left:24px;--room-rail-width:300px}
#room-workspace{left:var(--room-rail-left);width:var(--room-rail-width)}
#panel-toggle,body.panel-hidden #panel-toggle{left:calc(var(--room-rail-left) + var(--room-rail-width));right:auto;transform:translateX(-100%)}
@media(min-width:901px) and (max-width:1100px){:root{--room-rail-left:16px;--room-rail-width:278px}#home-bar h1{font-size:32px}}
@media(max-width:900px){
  :root{--room-rail-left:16px;--room-rail-width:min(320px,calc(100vw - 32px))}
  #panel-toggle,body.panel-hidden #panel-toggle{left:var(--room-rail-left);top:73px;transform:none}
}
@media(prefers-reduced-motion:reduce){#views button{transition:none}}