/* ============================================================================
   RACHA · as salas (v68) — camada visual, depois de lobby.css
   SALAS PERSONALIZADAS (a lista), CRIAR SALA, a sala em cima da favela, o apito do árbitro
   e a pausa do árbitro na partida. Medidas de dentro do lobby em px do palco (1920 × 888 deitado).
   ============================================================================ */
#lb{ --sx-azul:#1b2557; --sx-azul2:#24316c; --sx-fundo:#0f1534; --sx-borda:#0b0f24; --sx-linha:#2b3772; --sx-txt:#e8ecff; --sx-sub:#9aa6d8;
  --sx-amarelo:#ffd23f; --sx-f-tit:"Lilita One","Anton","Arial Black",Impact,sans-serif;
  --sx-f-num:"Barlow Condensed","Roboto Condensed","Arial Narrow",system-ui,sans-serif; --sx-f-txt:"Barlow",system-ui,"Segoe UI",Roboto,sans-serif;
  --sx-cols:minmax(0, 2.5fr) minmax(0, 1fr) minmax(0, 1.25fr) 116px 168px 214px; }

/* ---------------------------------------------------------------- o painel */
#lb .sx-tela #am-st{ display:none; }
#lb .sx-corpo{ gap:0; padding-top:18px; padding-bottom:22px; }
#lb .sx-corpo > .sx{ flex:1 1 auto; min-height:0; }
#lb .sx{ position:relative; display:flex; flex-direction:column; border:4px solid var(--sx-borda); border-radius:26px; overflow:hidden; color:var(--sx-txt);
  background:linear-gradient(180deg, #22306b 0, #1a2456 28%, #10173a 100%);
  box-shadow:0 8px 0 var(--sx-borda), 0 20px 44px rgba(0,0,0,.42), inset 0 2px 0 rgba(255,255,255,.07); animation:sxEntra .22s ease-out both; }
@keyframes sxEntra{ from{ opacity:0; transform:translateY(10px); } to{ opacity:1; transform:none; } }
#lb.calmo .sx{ animation:none; }
#lb .sx :where(button){ font:inherit; color:inherit; -webkit-appearance:none; appearance:none; cursor:pointer; touch-action:manipulation; }
#lb .sx button:focus-visible, #lb .sx input:focus-visible{ outline:4px solid var(--sx-amarelo); outline-offset:3px; }
#lb .sx-cab{ flex:none; display:flex; align-items:center; gap:18px; min-height:94px; padding:10px 24px; background:linear-gradient(#2b3a7d, #1f2b63); border-bottom:4px solid var(--sx-borda); }
#lb .sx-tit{ display:flex; align-items:center; gap:16px; min-width:0; margin:0; font-family:var(--sx-f-tit); font-weight:400; font-style:italic; font-size:56px; line-height:1;
  letter-spacing:1px; color:#fff; text-shadow:0 4px 0 rgba(0,0,0,.38); white-space:nowrap; }
#lb .sx-tag{ flex:none; padding:7px 18px 6px; border-radius:999px; font-size:24px; letter-spacing:.6px; color:#2a1d00; background:var(--sx-amarelo); text-shadow:none;
  box-shadow:0 3px 0 rgba(0,0,0,.3); transform:translateY(3px); }
#lb .sx-st{ margin-left:auto; flex:none; display:inline-flex; align-items:center; gap:12px; height:56px; padding:0 22px; border-radius:999px; background:#141c44; border:3px solid var(--sx-borda);
  font-family:var(--sx-f-num); font-weight:800; font-size:24px; letter-spacing:1.6px; white-space:nowrap; }
#lb .sx-st i{ width:16px; height:16px; border-radius:50%; background:#ff5a4e; box-shadow:0 0 0 3px rgba(255,90,78,.25), 0 0 12px #ff5a4e; }
#lb .sx-st.ok i{ background:#4fe05a; box-shadow:0 0 0 3px rgba(79,224,90,.25), 0 0 12px #4fe05a; }
#lb .sx-st.liga i{ background:var(--sx-amarelo); box-shadow:0 0 12px var(--sx-amarelo); animation:sxPisca 1s ease-in-out infinite; }
@keyframes sxPisca{ 50%{ opacity:.35; } }
#lb .sx-corpo2{ display:flex; flex-direction:column; gap:16px; padding:20px 24px 22px; flex:1 1 auto; min-height:0; overflow-y:auto; overscroll-behavior:contain; scrollbar-width:thin; }

/* ---------------------------------------------------------------- busca e filtros */
#lb .sx-busca{ display:flex; gap:14px; height:68px; }
#lb .sx-corpo2 > *:not(.sx-tab), #lb .sx-form > *{ flex-shrink:0; }
#lb .sx-in{ flex:1 1 auto; min-width:0; display:flex; align-items:center; gap:14px; padding:0 20px; border-radius:16px; background:var(--sx-fundo); border:3px solid var(--sx-linha); color:var(--sx-sub); cursor:text; }
#lb .sx-in:focus-within{ border-color:var(--sx-amarelo); }
#lb .sx-in svg{ flex:none; width:32px; height:32px; }
#lb .sx-in input{ flex:1 1 auto; min-width:0; height:100%; border:0; outline:0; background:transparent; color:#fff; font:600 30px var(--sx-f-txt); -webkit-appearance:none; appearance:none; }
#lb .sx-in input::placeholder{ color:#7480b8; }
#lb .sx-in input::-webkit-search-cancel-button{ filter:invert(1); }
#lb .sx-fil{ flex:none; display:inline-flex; align-items:center; gap:12px; padding:0 20px; border-radius:16px; background:#141c44; border:3px solid var(--sx-linha);
  font-family:var(--sx-f-num); font-weight:800; font-size:24px; letter-spacing:1.6px; white-space:nowrap; }
#lb .sx-fil i{ position:relative; flex:none; width:30px; height:30px; border-radius:8px; background:var(--sx-linha); box-shadow:inset 0 2px 0 rgba(0,0,0,.3); }
#lb .sx-fil.on{ border-color:var(--sx-amarelo); }
#lb .sx-fil.on i{ background:var(--sx-amarelo); }
#lb .sx-fil.on i::after{ content:""; position:absolute; left:10px; top:4px; width:8px; height:15px; border:solid #2a1d00; border-width:0 4px 4px 0; transform:rotate(45deg); }
#lb .sx-fil.sx-gira{ width:74px; padding:0; justify-content:center; }
#lb .sx-fil.sx-gira svg{ width:34px; height:34px; }
#lb .sx-fil:active, #lb .sx-op:active, #lb .sx-seta:active{ transform:translateY(2px); }
@media (hover:hover){ #lb .sx-fil:hover, #lb .sx-sala:hover, #lb .sx-op:hover{ filter:brightness(1.12); } }

/* ---------------------------------------------------------------- os botões */
#lb .sx-criar{ flex:none; display:inline-flex; align-items:center; justify-content:center; gap:14px; height:74px; padding:0 34px 0 26px; border-radius:16px;
  border:4px solid #0d3a06; background:linear-gradient(#98f262, #55c92b 52%, #39a71b); color:#fff;
  box-shadow:0 6px 0 #0d3a06, 0 10px 18px rgba(0,0,0,.3), inset 0 3px 0 rgba(255,255,255,.45);
  font-family:var(--sx-f-tit); font-style:italic; font-size:38px; letter-spacing:1px; white-space:nowrap;
  text-shadow:-2px -2px 0 #155c0b, 2px -2px 0 #155c0b, -2px 2px 0 #155c0b, 2px 2px 0 #155c0b, 0 4px 0 #155c0b; transition:transform .08s, box-shadow .08s; }
#lb .sx-criar svg{ width:32px; height:32px; filter:drop-shadow(0 3px 0 #155c0b); }
#lb .sx-criar:active{ transform:translateY(4px); box-shadow:0 2px 0 #0d3a06, inset 0 3px 0 rgba(255,255,255,.45); }
#lb .sx-bt{ flex:none; display:inline-flex; align-items:center; justify-content:center; height:66px; padding:0 26px; border-radius:14px; border:4px solid var(--sx-borda);
  font-family:var(--sx-f-tit); font-style:italic; font-size:28px; letter-spacing:1px; color:#fff; white-space:nowrap; text-shadow:0 3px 0 rgba(0,0,0,.35);
  box-shadow:0 5px 0 var(--sx-borda), inset 0 3px 0 rgba(255,255,255,.3); background:linear-gradient(#5f6fa6, #44528a); transition:transform .08s, box-shadow .08s; }
#lb .sx-bt:active{ transform:translateY(3px); box-shadow:0 2px 0 var(--sx-borda), inset 0 3px 0 rgba(255,255,255,.3); }
#lb .sx-bt.verde{ background:linear-gradient(#7fe24e, #3fae1f); }
#lb .sx-bt.verm{ background:linear-gradient(#ff7a6b, #d8261a); }
#lb .sx-bt.azul{ background:linear-gradient(#56b4ff, #1f74e0); }
#lb .sx-bt.cinza{ background:linear-gradient(#6575ad, #48558d); }
#lb .sx-cria{ display:flex; align-items:center; gap:18px; flex-wrap:wrap; }
#lb .sx-nota{ flex:1 1 300px; min-width:0; margin:0; font:600 24px/1.3 var(--sx-f-txt); color:#c3cbef; }
#lb .sx-nota b{ color:#fff; font-weight:800; }

/* ---------------------------------------------------------------- a tabela */
#lb .sx-tab{ display:flex; flex-direction:column; gap:8px; flex:1 0 auto; }
#lb .sx-cols{ display:grid; grid-template-columns:var(--sx-cols); gap:12px; padding:0 22px; font-family:var(--sx-f-num); font-weight:800; font-size:20px; letter-spacing:3px; color:var(--sx-sub); }
#lb .sx-cols span:nth-child(n+4){ text-align:center; }
#lb .sx-lista{ flex:1 0 auto; min-height:280px; display:flex; flex-direction:column; gap:10px; padding:10px; border-radius:18px; background:var(--sx-fundo); border:3px solid #26316a; box-shadow:inset 0 3px 0 rgba(0,0,0,.25); }
#lb .sx-sala{ display:grid; grid-template-columns:var(--sx-cols); gap:12px; align-items:center; min-height:80px; padding:6px 12px; border-radius:14px; text-align:left;
  background:linear-gradient(#202b60, #19224f); border:3px solid var(--sx-linha); font:700 25px var(--sx-f-txt); }
#lb .sx-sala:active{ transform:translateY(2px); }
#lb .sx-sala.jogando{ background:linear-gradient(#1b2350, #161d43); }
#lb .sx-sala > *{ min-width:0; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
#lb .sx-nm{ display:flex; align-items:center; gap:10px; font-family:var(--sx-f-tit); font-weight:400; font-size:31px; color:#fff; }
#lb .sx-nm span{ overflow:hidden; text-overflow:ellipsis; }
#lb .sx-ofi{ flex:none; font-style:normal; font-family:var(--sx-f-num); font-weight:800; font-size:17px; letter-spacing:1.4px; padding:4px 8px; border-radius:7px; color:#2a1d00; background:var(--sx-amarelo); }
#lb .sx-c{ color:#c3cbef; }
#lb .sx-reg{ display:flex; justify-content:center; align-items:center; }
#lb .sx-reg .sl-flag{ width:44px; height:32px; }
#lb .sx-reg .sl-flag-e{ font-size:32px; }
#lb .sx-n{ text-align:center; font-family:var(--sx-f-num); font-weight:800; font-size:32px; font-variant-numeric:tabular-nums; }
#lb .sx-sit{ justify-self:center; padding:7px 14px; border-radius:10px; font-family:var(--sx-f-num); font-weight:800; font-size:20px; letter-spacing:1.2px; color:#eaffe2; background:#2b8a3e; }
#lb .sx-sit.on{ background:#d86a38; color:#fff3ea; }
#lb .sx-sit.copa{ background:var(--sx-amarelo); color:#2a1d00; }
#lb .sx-vazio{ flex:1 1 auto; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:8px; padding:16px 20px; text-align:center; }
#lb .sx-vazio > i{ display:flex; width:72px; height:72px; opacity:.55; }
#lb .sx-vazio > i svg{ width:100%; height:100%; }
#lb .sx-vazio > b{ font-family:var(--sx-f-tit); font-weight:400; font-style:italic; font-size:42px; color:var(--sx-amarelo); text-shadow:0 3px 0 rgba(0,0,0,.35); }
#lb .sx-vazio > p{ max-width:1180px; margin:0; font:600 24px/1.3 var(--sx-f-txt); color:#c3cbef; }
#lb .sx-vazio-bts{ display:flex; gap:18px; flex-wrap:wrap; justify-content:center; margin-top:6px; }
#lb .sx-vazio-bts .sx-criar{ height:66px; font-size:32px; }
#lb .sx-vazio-bts .sx-bt{ height:66px; }
#lb .sx-na{ display:grid; grid-template-columns:minmax(0, 1fr) auto auto; grid-template-rows:auto auto; gap:6px 16px; align-items:center; padding:16px 20px; border-radius:18px;
  background:rgba(255,210,63,.09); border:3px solid var(--sx-amarelo); }
#lb .sx-na > b{ grid-column:1; font-family:var(--sx-f-tit); font-weight:400; font-style:italic; font-size:32px; color:var(--sx-amarelo); }
#lb .sx-na > span{ grid-column:1; font:600 24px var(--sx-f-txt); color:#dfe4ff; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
#lb .sx-na > button{ grid-row:1 / 3; }
#lb .sx-aviso{ min-height:0; }
#lb .sx-aviso .sx-na{ margin:24px; }
#lb .sx-duelos{ display:flex; flex-direction:column; gap:6px; padding:16px 20px; border-radius:16px; background:rgba(0,0,0,.18); font:600 24px var(--sx-f-txt); color:#dfe4ff; }
#lb .sx-duelos b{ font-family:var(--sx-f-tit); font-weight:400; font-style:italic; font-size:28px; color:var(--sx-amarelo); }

/* ---------------------------------------------------------------- CRIAR SALA */
#lb .sx-volta{ flex:none; width:74px; height:74px; border-radius:50%; display:grid; place-items:center; background:var(--sx-fundo); border:3px solid var(--sx-linha); color:#fff; box-shadow:0 4px 0 var(--sx-borda); }
#lb .sx-volta svg{ width:36px; height:36px; }
#lb .sx-form{ display:flex; flex-direction:column; gap:10px; padding:18px 24px 34px; flex:1 1 auto; min-height:0; overflow-y:auto; overscroll-behavior:contain; scrollbar-width:thin;
  -webkit-mask-image:linear-gradient(to bottom, #000 calc(100% - 30px), transparent); mask-image:linear-gradient(to bottom, #000 calc(100% - 30px), transparent); }
#lb .sx-rot{ display:block; margin-top:8px; font-family:var(--sx-f-tit); font-weight:400; font-style:italic; font-size:29px; letter-spacing:.8px; color:var(--sx-amarelo); text-shadow:0 2px 0 rgba(0,0,0,.3); }
#lb .sx-rot small{ font:600 22px var(--sx-f-txt); font-style:normal; color:var(--sx-sub); text-shadow:none; }
#lb .sx-rot.apagado{ opacity:.45; }
#lb .sx-campo{ height:76px; padding:0 22px; border-radius:16px; background:var(--sx-fundo); border:3px solid var(--sx-linha); color:#fff; font:700 30px var(--sx-f-txt); outline:0; }
#lb .sx-campo::placeholder{ color:#7480b8; }
#lb .sx-campo:focus{ border-color:var(--sx-amarelo); }
#lb .sx-onde{ display:grid; grid-template-columns:repeat(2, minmax(0, 1fr)); gap:16px; }
#lb .sx-op{ display:flex; flex-direction:column; align-items:center; justify-content:center; gap:4px; min-height:88px; padding:8px 14px; border-radius:16px;
  background:linear-gradient(#22306a, #1a2456); border:3px solid var(--sx-borda); box-shadow:0 5px 0 var(--sx-borda), inset 0 2px 0 rgba(255,255,255,.06); }
#lb .sx-op b{ font-family:var(--sx-f-tit); font-weight:400; font-style:italic; font-size:31px; letter-spacing:.6px; }
#lb .sx-op small{ font:600 20px var(--sx-f-txt); color:var(--sx-sub); }
#lb .sx-op.on{ background:linear-gradient(#ffe36b, #ffc81f 60%, #f5b400); color:#2a1d00; box-shadow:0 5px 0 #6b4a00, inset 0 3px 0 rgba(255,255,255,.5); }
#lb .sx-op.on small{ color:#5a4300; }
#lb .sx-op.off{ opacity:.5; }
#lb .sx-quem.travado .sx-op{ opacity:.4; cursor:default; }
#lb .sx-grade2{ display:grid; grid-template-columns:repeat(2, minmax(0, 1fr)); gap:4px 22px; }
#lb .sx-campo-sel{ display:flex; flex-direction:column; gap:6px; min-width:0; }
#lb .sx-sel{ display:grid; grid-template-columns:66px minmax(0, 1fr) 66px; height:72px; border-radius:16px; overflow:hidden; background:var(--sx-fundo); border:3px solid var(--sx-linha); }
#lb .sx-seta{ display:grid; place-items:center; background:#1f2a62; color:var(--sx-amarelo); }
#lb .sx-seta svg{ width:32px; height:32px; }
#lb .sx-seta.dir svg{ transform:rotate(180deg); }
#lb .sx-val{ min-width:0; padding:0 10px; font-family:var(--sx-f-tit); font-size:29px; color:#fff; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
#lb .sx-sel.travado{ opacity:.55; }
#lb .sx-sel.travado .sx-seta{ visibility:hidden; }
#lb .sx-form .sx-nota{ flex:none; margin-top:8px; }
#lb .sx-pe{ flex:none; display:flex; justify-content:flex-end; align-items:center; gap:18px; padding:14px 24px 18px; border-top:3px solid var(--sx-borda); background:rgba(0,0,0,.22); }

/* ---------------------------------------------------------------- os pops das salas */
#lb .pop-caixa.sx-pop .on-card{ text-align:left; }
#lb .pop-caixa.sx-pop .sx-como{ font-size:22px; color:#cfd5ea; }
#lb .pop-caixa.arb-pop .sl-menu{ max-height:52vh; overflow-y:auto; }

/* ---------------------------------------------------------------- em pé */
#lb.retrato .sx-tit{ font-size:46px; gap:12px; }
#lb.retrato .sx-tag{ font-size:20px; padding:6px 14px 5px; }
#lb.retrato .sx-cab{ flex-wrap:wrap; }
#lb.retrato .sx-st{ height:50px; font-size:21px; padding:0 16px; }
#lb.retrato .sx-busca{ flex-wrap:wrap; height:auto; }
#lb.retrato .sx-in{ flex:1 1 100%; height:74px; }
#lb.retrato .sx-fil{ flex:1 1 auto; height:66px; justify-content:center; font-size:21px; padding:0 14px; }
#lb.retrato .sx-fil.sx-gira{ flex:0 0 66px; width:66px; }
#lb.retrato .sx-cols{ display:none; }
#lb.retrato .sx-sala{ display:flex; flex-wrap:wrap; align-items:center; gap:6px 14px; padding:12px 16px; }
#lb.retrato .sx-sala .sx-nm{ flex:1 1 100%; }
#lb.retrato .sx-sala .sx-c{ font-size:22px; }
#lb.retrato .sx-sala .sx-n{ font-size:26px; margin-left:auto; }
#lb.retrato .sx-sala .sx-sit{ font-size:18px; }
#lb.retrato .sx-na{ grid-template-columns:1fr 1fr; grid-template-rows:auto auto auto; }
#lb.retrato .sx-na > b, #lb.retrato .sx-na > span{ grid-column:1 / -1; }
#lb.retrato .sx-na > button{ grid-row:3; }
#lb.retrato .sx-grade2{ grid-template-columns:minmax(0, 1fr); }
#lb.retrato .sx-op b{ font-size:27px; } #lb.retrato .sx-op small{ font-size:18px; }
#lb.retrato .sx-criar{ font-size:34px; height:74px; }

/* ---------------------------------------------------------------- a sala em cima da favela */
#lb .sl-tela{ background:#6fb7e6; }
#lb .sl-fundo.favela{ background:#6fb7e6; }
#lb .sl-fundo .sl-favela{ position:absolute; inset:0; width:100%; height:100%; display:block; }
/* os quadros dos times no vermelho e no azul da sala (como no print), com a textura de colmeia */
#lb .sl-verm .sl-caixa{ background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='56' height='48'%3E%3Cpath d='M14 0h28l14 24-14 24H14L0 24z' fill='none' stroke='%23fff' stroke-opacity='.07' stroke-width='2'/%3E%3C/svg%3E") 0 0/56px 48px,
  linear-gradient(170deg, #f0565c, #d8323a 55%, #c4232d) !important; }
#lb .sl-azul .sl-caixa{ background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='56' height='48'%3E%3Cpath d='M14 0h28l14 24-14 24H14L0 24z' fill='none' stroke='%23fff' stroke-opacity='.08' stroke-width='2'/%3E%3C/svg%3E") 0 0/56px 48px,
  linear-gradient(170deg, #3aa8ff, #1a7ef0 55%, #0f66d8) !important; }
#lb .sl-esp .sl-caixa{ background:linear-gradient(165deg, rgba(255,255,255,.2) 0 22%, transparent 22% 30%, rgba(255,255,255,.12) 30% 34%, transparent 34%),
  radial-gradient(circle at 50% 120%, rgba(255,255,255,.55), transparent 60%), linear-gradient(#d9dde3, #b9bfc8) !important; }
#lb .sl-verm .sl-fita::after{ background:linear-gradient(#ff6a72, #e12b3b 70%) !important; }
#lb .sl-azul .sl-fita::after{ background:linear-gradient(#49b7ff, #0f78ea 70%) !important; }
#lb .sl-col.sl-time{ filter:drop-shadow(0 10px 14px rgba(0,0,0,.35)); }
#lb .sl-esp-tit{ color:#fff; }
#lb .sl-titulo h2{ color:#ffd21f; }
/* o apito nos cartões e o aviso de quem é o árbitro */
#lb .sl-arb{ position:absolute; z-index:2; right:58px; top:-16px; display:inline-flex; align-items:center; gap:5px; height:30px; padding:0 10px 0 7px; border-radius:9px;
  background:#171a1c; color:#f3efe4; border:3px solid #0e1024; box-shadow:0 3px 0 rgba(0,0,0,.35); pointer-events:none; transform:rotate(-2deg); }
#lb .sl-arb svg{ width:22px; height:22px; flex:none; }
#lb .sl-arb b{ font-family:var(--sx-f-num); font-weight:800; font-size:17px; letter-spacing:1.4px; line-height:1; }
#lb .sl-arb.p{ background:var(--sx-amarelo); color:#2a1d00; }
#lb .sl-arb.p svg circle{ fill:var(--sx-amarelo); }
#lb .sl-card.arb-p{ box-shadow:inset 0 2px 0 rgba(255,255,255,.14), 0 0 0 4px rgba(255,210,63,.55), 0 6px 0 rgba(0,0,0,.25); }
#lb .sl-card.eu.arb-p{ box-shadow:inset 0 2px 0 rgba(255,255,255,.14), 0 0 0 4px #ffd21f, 0 6px 0 rgba(0,0,0,.25); }
#lb .sl-card.bot .sl-tx small{ color:#9fe6ff; }
#lb .sl-legenda{ position:relative; z-index:1; flex:none; align-self:center; display:flex; align-items:center; gap:8px; max-width:min(1500px, 92%); margin:14px auto 0; padding:8px 20px;
  border-radius:14px; background:rgba(11,15,36,.78); border:3px solid rgba(11,15,36,.9); color:#e8ecff; font:600 23px var(--sx-f-txt); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
#lb .sl-legenda i{ display:flex; flex:none; width:28px; height:28px; color:var(--sx-amarelo); }
#lb .sl-legenda i svg{ width:100%; height:100%; }
#lb .sl-legenda i svg circle{ fill:#0b0f24; }
#lb .sl-legenda b{ flex:none; font-family:var(--sx-f-num); font-weight:800; letter-spacing:1.4px; color:var(--sx-amarelo); }
#lb .sl-legenda .sl-leg-dica{ color:#aab4e0; overflow:hidden; text-overflow:ellipsis; }
#lb .sl-legenda[hidden]{ display:none; }
#lb:not(.retrato) .sl-meio{ padding-top:44px; }
#lb:not(.retrato) .sl-base{ height:250px; }
#lb.retrato .sl-legenda{ white-space:normal; flex-wrap:wrap; gap:2px 8px; margin:20px 18px 0; max-width:none; text-align:left; }
#lb.retrato .sl-legenda .sl-leg-dica{ flex:1 1 100%; }
#lb .sl-local .sl-serv i{ background:#ffd23f; }

/* ---------------------------------------------------------------- na partida (fora do lobby: px de verdade) */
#arb-faixa{ position:absolute; left:50%; top:26%; z-index:6; transform:translateX(-50%); display:flex; flex-direction:column; align-items:center; gap:4px; max-width:calc(100% - 32px);
  padding:clamp(8px, 2vh, 14px) clamp(16px, 4vw, 30px); border-radius:16px; background:rgba(15,16,17,.86); border:3px solid #ffd23f; box-shadow:0 6px 0 rgba(0,0,0,.45);
  color:#f3efe4; text-align:center; pointer-events:none; font-family:"Lilita One","Anton","Arial Black",Impact,sans-serif; animation:arbFaixa 1.6s ease-in-out infinite; }
#arb-faixa[hidden]{ display:none; }
#arb-faixa b{ font-weight:400; font-size:clamp(20px, 5vh, 38px); letter-spacing:1.5px; color:#ffd23f; }
#arb-faixa small{ font:700 clamp(11px, 2.6vh, 16px) "Barlow",system-ui,sans-serif; color:#d9d4c4; }
@keyframes arbFaixa{ 50%{ box-shadow:0 6px 0 rgba(0,0,0,.45), 0 0 0 6px rgba(255,210,63,.18); } }
.pa-arb{ display:grid; grid-template-columns:1fr 1fr; gap:clamp(8px, 2vh, 12px); margin-top:clamp(10px, 2.4vh, 16px); padding-top:clamp(10px, 2.4vh, 14px); border-top:2px dashed rgba(243,239,228,.18); }
.pa-arb[hidden]{ display:none; }
.pa-arb-tit{ grid-column:1 / -1; display:flex; align-items:center; justify-content:center; gap:8px; margin:0; font:400 clamp(13px, 3.4vh, 17px) "Lilita One","Arial Black",Impact,sans-serif; letter-spacing:1px; color:#ffd23f; }
.pa-arb-tit svg{ width:1.3em; height:1.3em; }
.pa-arb-tit svg circle{ fill:#1e1338; }
.pa-bt.pa-arb-pausa{ background:linear-gradient(#ffe066, #ffc61a); color:#2a1d00; box-shadow:0 5px 0 #6b4a00; font-size:clamp(14px, 3.8vh, 19px); }
.pa-bt.pa-arb-fim{ background:linear-gradient(#ff7a6b, #d8261a); color:#fff; box-shadow:0 5px 0 #6d0e08; font-size:clamp(14px, 3.8vh, 19px); }
.pa-bt.pa-arb-fim.confirma{ background:#8e1209; }
#sala-jogo .sj-arb{ display:grid; grid-template-columns:1fr 1fr; gap:10px; margin:0 0 clamp(8px, 2vh, 14px); padding:clamp(8px, 2vh, 12px); border-radius:14px; background:rgba(255,210,63,.1); box-shadow:inset 0 0 0 2px rgba(255,210,63,.45); }
#sala-jogo .sj-arb-tit{ grid-column:1 / -1; font-size:clamp(11px, 3vh, 15px); letter-spacing:1px; color:#ffd23f; }
#sala-jogo .sj-amarelo{ background:linear-gradient(#ffe066, #ffc61a); color:#2a1d00; box-shadow:inset 0 2px 0 rgba(255,255,255,.5), 0 4px 0 #6b4a00; }
#sala-jogo .sj-cod.sj-nome{ font-size:clamp(20px, 6vh, 34px); letter-spacing:1px; }