/* W4L - Widget da Sala — variáveis ajustáveis. */
#w4l-room-status-widget
{
--accent:#158bfa;
--accent-wainting:#facc15;
--accent-playing:#22c55e;
--accent-closed:#fb4564;
--panel:rgba(10,16,29,.90);
--text:#f8fafc;
--muted:#9ca3af;
--width:300px;
--radius:10px;
position:fixed;
z-index:9998;
left:calc(50% - 100px);
bottom:40%;
color:var(--text);
font:600 12px/1.4 system-ui,sans-serif;
filter:drop-shadow(0 0 18px #0009);
user-select:none;
touch-action:none
}

/* Estado da sala: azul em demonstração; amarelo aguardando; verde jogando; vermelho finalizada. */
#w4l-room-status-widget.is-local{--accent:#158bfa}
#w4l-room-status-widget[data-state="waiting"]{--accent:var(--accent-wainting)}
#w4l-room-status-widget[data-state="playing"]{--accent:var(--accent-playing)}
#w4l-room-status-widget[data-state="closed"]{--accent:var(--accent-closed)}

/* Painel expandido. */
#w4l-room-status-widget .w4l-room__panel{width:var(--width);overflow:hidden;border:2px solid color-mix(in srgb,var(--accent),transparent 25%);border-radius:var(--radius);background:var(--panel);box-shadow:0 0 30px color-mix(in srgb,var(--accent),transparent 72%);backdrop-filter:blur(10px)}
#w4l-room-status-widget .w4l-room__header{padding:10px 12px;background:var(--accent);color:#111;cursor:grab;touch-action:none}
#w4l-room-status-widget .w4l-room__content{padding:8px 11px}
#w4l-room-status-widget .w4l-room__content>div{display:flex;justify-content:space-between;gap:10px;padding:7px 0;border-bottom:1px solid #ffffff1b}
#w4l-room-status-widget .w4l-room__content span{color:var(--muted);font-size:10px}
#w4l-room-status-widget [data-status]{color:var(--accent)}
#w4l-room-status-widget [data-updated]{display:block;padding-top:10px;color:var(--muted);font-size:9px}

/* Botão imagem. - Estado minimizado: ícone 128 × 128 px; o puxador também aceita arraste. */
#w4l-room-status-widget .w4l-room__launcher img
{width:75px;height:80px;object-fit:contain;filter:drop-shadow(0 0 10px var(--accent));pointer-events:none;-webkit-user-drag:none;user-select:none;}

/* Dados do elemento. */
#w4l-room-status-widget .w4l-room__launcher{display:none;width:128px;height:128px;padding:10px;border:2px solid color-mix(in srgb,var(--accent),white 12%);border-radius:var(--radius);background:color-mix(in srgb,var(--accent),transparent 18%);color:var(--text);align-items:center;justify-content:center;flex-direction:column;gap:5px;cursor:grab;touch-action:none;box-shadow:0 0 25px color-mix(in srgb,var(--accent),transparent 30%)}
#w4l-room-status-widget .w4l-room__launcher [data-launch-type]{max-width:100px;text-align:center;font-size:12px;overflow-wrap:anywhere}
#w4l-room-status-widget .w4l-room__launcher [data-launch-status]{color:var(--text);font-size:10px;margin-bottom:10px}

/* Painel minimizado. */
#w4l-room-status-widget.is-minimized .w4l-room__panel{display:none}
#w4l-room-status-widget.is-minimized .w4l-room__launcher{display:flex}
#w4l-room-status-widget.is-expanded .w4l-room__panel{display:block}
#w4l-room-status-widget.is-expanded .w4l-room__launcher{display:none}
#w4l-room-status-widget.is-dragging{opacity:.90;cursor:grabbing}
@media(max-width:520px){#w4l-room-status-widget{top:auto;right:10px;bottom:10px;width:min(var(--width),calc(100vw - 20px))}#w4l-room-status-widget.is-minimized{width:128px}#w4l-room-status-widget .w4l-room__header{padding:8px}}
