/* Seletor de canal da zona.
   Mora na MESMA linha do analisador de caçada, logo à esquerda do botão dele.
   O canto superior esquerdo é do painel de Eventos (#event-schedule, com
   top:14px e z-index:10025 dentro do jogo), então aquele lado está ocupado.
   O deslocamento horizontal é medido em tempo de execução, a partir da largura
   real dos botões do analisador (ver ZoneChannelsRuntime.posicionar): o texto
   "Analisador" muda de largura com a fonte disponível, e um número fixo aqui
   ora deixaria um buraco, ora encostaria um painel no outro. */
#zone-channels { position:absolute; z-index:44; top:14px; right:var(--zone-channels-right,14px); width:max-content; max-width:calc(100vw - 28px); color:#d9e7e5; font:11px Arial,sans-serif; filter:drop-shadow(0 8px 16px rgba(0,0,0,.6)); }
#zone-channels[hidden] { display:none!important; }

/* É um indicador, não um painel: o botão tem a largura do próprio texto e a
   altura do botão do analisador, para os dois formarem uma linha só. */
.zone-channels-toggle { display:flex; align-items:center; gap:6px; padding:8px 9px; border:1px solid #789091; background:linear-gradient(135deg,#25383b,#0a1011 70%); color:#e8ddad; font:700 10px Georgia,serif; letter-spacing:.4px; line-height:1; text-transform:uppercase; cursor:pointer; box-shadow:inset 0 0 0 1px #060909; }
.zone-channels-toggle:hover { filter:brightness(1.2); }
.zone-channels-toggle b { color:#80e4c0; font:700 10px Consolas,monospace; }

/* Ponto vivo: distingue num relance a zona compartilhada (onde há gente de
   verdade) da caçada comum. */
.zone-channels-dot { flex:none; width:6px; height:6px; border-radius:50%; background:#7ce5be; box-shadow:0 0 6px #7ce5be; }

/* A largura mínima é da LISTA aberta, não do botão fechado. */
.zone-channels-list { display:none; margin-top:4px; border:1px solid #607879; background:linear-gradient(145deg,rgba(20,36,38,.96),rgba(4,9,10,.96)); box-shadow:inset 0 0 22px #000; }
#zone-channels.is-open .zone-channels-list { display:grid; gap:1px; min-width:132px; max-height:min(46vh,300px); overflow:auto; padding:1px; }

.zone-channels-item { display:flex; align-items:center; justify-content:space-between; gap:8px; padding:6px 9px; border:0; background:#0d1718; color:#c5d6d2; font:10px Arial,sans-serif; text-align:left; cursor:pointer; }
.zone-channels-item:hover:not(:disabled) { background:#16292b; color:#e8ddad; }
.zone-channels-item b { color:#f0d98c; font:700 10px Consolas,monospace; }
.zone-channels-item.is-current { background:#17282a; color:#f3e5ad; box-shadow:inset 2px 0 0 #7ce5be; }
.zone-channels-item.is-full { color:#7e9693; cursor:not-allowed; }
.zone-channels-item.is-full b { color:#b06a66; }

.zone-channels-empty { margin:0; padding:8px; color:#7e9693; font-style:italic; text-align:center; }
.zone-channels-msg { margin:4px 0 0; padding:5px 8px; border:1px solid #7d6a36; background:#211d0d; color:#f0d98c; font-size:9px; text-align:right; }

@media (max-width:600px) { #zone-channels { top:8px; max-width:calc(100vw - 16px); } .zone-channels-toggle { padding:7px 8px; } }