/* Painel do comitê · Plantão da Urna
   Estilo herdado do protótipo aprovado (Material Design 3, semente #006B5F).
   Componentes só leem papéis de cor, nunca hex. */
:root{
  --md-primary:#006B5F; --md-on-primary:#FFFFFF;
  --md-primary-container:#9EF2E1; --md-on-primary-container:#00201C;
  --md-secondary:#4A635E; --md-on-secondary:#FFFFFF;
  --md-secondary-container:#CCE8E1; --md-on-secondary-container:#05201B;
  --md-tertiary:#436278; --md-tertiary-container:#C9E6FF; --md-on-tertiary-container:#001E2F;
  --md-error:#BA1A1A; --md-on-error:#FFFFFF;
  --md-error-container:#FFDAD6; --md-on-error-container:#410002;
  /* cores estendidas (o M3 prevê cor personalizada com papel de contêiner) */
  --md-ok:#1E6D3B; --md-ok-container:#B7F1C2; --md-on-ok-container:#00210B;
  --md-warn:#7C5800; --md-warn-container:#FFDEA6; --md-on-warn-container:#271900;
  --md-surface:#F5FBF8;
  --md-sc-lowest:#FFFFFF; --md-sc-low:#EFF5F2; --md-sc:#E9EFEC; --md-sc-high:#E3EAE7; --md-sc-highest:#DEE4E1;
  --md-on-surface:#171D1B; --md-on-surface-variant:#3F4946;
  --md-outline:#6F7976; --md-outline-variant:#BEC9C5;
  --md-inverse-surface:#2B3230; --md-inverse-on-surface:#ECF2EF; --md-inverse-primary:#82D5C5;
  --device:#1B1F1E; --device-edge:#2C3230;
  --cam-bg:#050807; --cam-fg:#F1F5F3; --cam-rec:#FF5449;

  --shape-xs:4px; --shape-s:8px; --shape-m:12px; --shape-l:16px; --shape-xl:28px; --shape-full:999px;
  --elev-1:0 1px 2px rgba(0,0,0,.3),0 1px 3px 1px rgba(0,0,0,.15);
  --elev-3:0 1px 3px rgba(0,0,0,.3),0 4px 8px 3px rgba(0,0,0,.15);
  --f:"Roboto",system-ui,"Segoe UI",Arial,sans-serif;
  --f-mono:"Roboto Mono",ui-monospace,"SFMono-Regular",Menlo,monospace;
  --tf-bg:var(--md-surface);
  color-scheme:light;
}
@media (prefers-color-scheme: dark){
  :root:not([data-theme="light"]){
    --md-primary:#82D5C5; --md-on-primary:#003731;
    --md-primary-container:#005047; --md-on-primary-container:#9EF2E1;
    --md-secondary:#B1CCC5; --md-on-secondary:#1C3531;
    --md-secondary-container:#334B47; --md-on-secondary-container:#CCE8E1;
    --md-tertiary:#ABCAE4; --md-tertiary-container:#2B4A5F; --md-on-tertiary-container:#C9E6FF;
    --md-error:#FFB4AB; --md-on-error:#690005;
    --md-error-container:#93000A; --md-on-error-container:#FFDAD6;
    --md-ok:#8CD89B; --md-ok-container:#0B5227; --md-on-ok-container:#B7F1C2;
    --md-warn:#F0BF48; --md-warn-container:#5E4200; --md-on-warn-container:#FFDEA6;
    --md-surface:#0E1513;
    --md-sc-lowest:#090F0E; --md-sc-low:#171D1B; --md-sc:#1B2120; --md-sc-high:#252B2A; --md-sc-highest:#303635;
    --md-on-surface:#DEE4E1; --md-on-surface-variant:#BEC9C5;
    --md-outline:#899390; --md-outline-variant:#3F4946;
    --md-inverse-surface:#DEE4E1; --md-inverse-on-surface:#2B3230; --md-inverse-primary:#006B5F;
    --device:#000000; --device-edge:#262B29;
    color-scheme:dark;
  }
}
:root[data-theme="dark"]{
  --md-primary:#82D5C5; --md-on-primary:#003731;
  --md-primary-container:#005047; --md-on-primary-container:#9EF2E1;
  --md-secondary:#B1CCC5; --md-on-secondary:#1C3531;
  --md-secondary-container:#334B47; --md-on-secondary-container:#CCE8E1;
  --md-tertiary:#ABCAE4; --md-tertiary-container:#2B4A5F; --md-on-tertiary-container:#C9E6FF;
  --md-error:#FFB4AB; --md-on-error:#690005;
  --md-error-container:#93000A; --md-on-error-container:#FFDAD6;
  --md-ok:#8CD89B; --md-ok-container:#0B5227; --md-on-ok-container:#B7F1C2;
  --md-warn:#F0BF48; --md-warn-container:#5E4200; --md-on-warn-container:#FFDEA6;
  --md-surface:#0E1513;
  --md-sc-lowest:#090F0E; --md-sc-low:#171D1B; --md-sc:#1B2120; --md-sc-high:#252B2A; --md-sc-highest:#303635;
  --md-on-surface:#DEE4E1; --md-on-surface-variant:#BEC9C5;
  --md-outline:#899390; --md-outline-variant:#3F4946;
  --md-inverse-surface:#DEE4E1; --md-inverse-on-surface:#2B3230; --md-inverse-primary:#006B5F;
  --device:#000000; --device-edge:#262B29;
  color-scheme:dark;
}


/* ============================================================
   Espaçamento: só 4, 8, 12, 16, 24 e 32 px. Miolo de caixa 16 px,
   entre blocos 16 px, entre controles do mesmo grupo 8 px.
   ============================================================ */

/* ---------- base ---------- */
*{box-sizing:border-box}
[hidden]{display:none!important}
img{max-width:100%}
body{margin:0;background:var(--md-surface);color:var(--md-on-surface);font:400 14px/20px var(--f);letter-spacing:.25px;-webkit-font-smoothing:antialiased}
h1,h2,h3,h4,p{margin:0}
h1,h2,h3,h4{font-weight:400;text-wrap:balance}
button{font-family:inherit;color:inherit}
dl{margin:0}
:focus-visible{outline:3px solid var(--md-secondary);outline-offset:2px}
.mono{font-family:var(--f-mono);font-variant-numeric:tabular-nums;letter-spacing:0}
/* telefone, protocolo e hora nunca se partem no meio */
.nw{white-space:nowrap}
.muted{color:var(--md-on-surface-variant)}
.t-bs{font:400 12px/16px var(--f);letter-spacing:.4px}

/* ---------- ícones Material Symbols ---------- */
.msi{
  font-family:"Material Symbols Outlined";font-weight:normal;font-style:normal;font-size:24px;line-height:1;
  letter-spacing:normal;text-transform:none;display:inline-block;white-space:nowrap;direction:ltr;
  font-feature-settings:"liga";-webkit-font-feature-settings:"liga";-webkit-font-smoothing:antialiased;
  width:1em;height:1em;overflow:hidden;flex:none;user-select:none;
  font-variation-settings:"FILL" 0,"wght" 400,"GRAD" 0,"opsz" 24;
}
.msi.fill{font-variation-settings:"FILL" 1,"wght" 400,"GRAD" 0,"opsz" 24}

/* ---------- camada de estado (hover, foco, toque) ---------- */
.sl{position:relative;overflow:hidden}
.sl::before{content:"";position:absolute;inset:0;background:currentColor;opacity:0;transition:opacity .15s;pointer-events:none;border-radius:inherit}
.sl:hover::before{opacity:.08}
.sl:focus-visible::before{opacity:.1}
.sl:active::before{opacity:.12}

/* ---------- botões ---------- */
.btn{
  --h:40px;display:inline-flex;align-items:center;justify-content:center;gap:8px;height:var(--h);min-height:var(--h);
  padding:0 24px;border-radius:var(--shape-full);border:1px solid transparent;cursor:pointer;
  font:500 14px/20px var(--f);letter-spacing:.1px;white-space:nowrap;text-decoration:none;
  background:var(--md-primary);color:var(--md-on-primary);position:relative;overflow:hidden;
}
.btn .msi{font-size:18px}
.btn-block{display:flex;width:100%}
.btn-lg{--h:56px;font-size:16px}
.btn-lg .msi{font-size:22px}
.btn-sm{--h:32px;padding:0 12px;font-size:13px}
.btn-tonal{background:var(--md-secondary-container);color:var(--md-on-secondary-container)}
.btn-text{background:transparent;color:var(--md-primary);padding:0 12px}
.btn-error{background:var(--md-error);color:var(--md-on-error)}
.btn-outlined-error{background:transparent;color:var(--md-error);border-color:var(--md-error)}
.btn::before{content:"";position:absolute;inset:0;background:currentColor;opacity:0;transition:opacity .15s;pointer-events:none}
.btn:hover::before{opacity:.08}.btn:active::before{opacity:.12}
.btn:disabled{background:color-mix(in srgb,var(--md-on-surface) 12%,transparent);color:color-mix(in srgb,var(--md-on-surface) 38%,transparent);border-color:transparent;cursor:not-allowed}
.btn-text:disabled{background:transparent}
.btn:disabled::before{display:none}

/* ---------- aviso em caixa (tela de entrada) ---------- */
.card-err{background:var(--md-error-container);color:var(--md-on-error-container);border-radius:var(--shape-m);padding:12px 16px}
.row-ico{display:flex;gap:12px;align-items:flex-start}

/* ---------- campos de texto contornados ---------- */
.tf{display:flex;flex-direction:column;gap:4px;min-width:0}
.tf-box{position:relative}
.tf-box input,.tf-box select,.tf-box textarea{
  display:block;width:100%;min-height:56px;padding:15px 16px;border:1px solid var(--md-outline);border-radius:var(--shape-xs);
  background:transparent;color:var(--md-on-surface);font:400 16px/24px var(--f);letter-spacing:.5px;outline:none;appearance:none;-webkit-appearance:none;
}
.tf-box textarea{resize:vertical;min-height:96px}
/* a seta ocupa a direita: o texto da lista para antes dela, também com o campo em foco ou com erro */
.tf-box select{padding-right:44px;cursor:pointer;text-overflow:ellipsis;white-space:nowrap;overflow:hidden}
.tf-box select option{color:var(--md-on-surface);background:var(--md-sc-lowest)}
.tf-box .tf-arrow{position:absolute;right:12px;top:16px;pointer-events:none;color:var(--md-on-surface-variant)}
.tf-box label{
  position:absolute;left:12px;top:16px;padding:0 4px;background:var(--tf-bg);color:var(--md-on-surface-variant);
  font:400 16px/24px var(--f);letter-spacing:.5px;pointer-events:none;transition:top .15s,font-size .15s,line-height .15s;
  max-width:calc(100% - 24px);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;
}
.tf-box select + label{max-width:calc(100% - 56px)}
.tf-box input::placeholder,.tf-box textarea::placeholder{color:transparent}
.tf-box input:focus::placeholder,.tf-box textarea:focus::placeholder{color:var(--md-on-surface-variant)}
.tf-box input:focus + label,.tf-box input:not(:placeholder-shown) + label,
.tf-box textarea:focus + label,.tf-box textarea:not(:placeholder-shown) + label,
.tf-box select + label{top:-8px;font-size:12px;line-height:16px;letter-spacing:.4px}
.tf-box input:focus,.tf-box select:focus,.tf-box textarea:focus{border:2px solid var(--md-primary);padding:14px 15px}
.tf-box select:focus{padding-right:43px}
.tf-box input:focus + label,.tf-box select:focus + label,.tf-box textarea:focus + label{color:var(--md-primary)}
.tf .sup{font:400 12px/16px var(--f);letter-spacing:.4px;color:var(--md-on-surface-variant);padding:0 16px}
.tf.erro .tf-box input,.tf.erro .tf-box select,.tf.erro .tf-box textarea{border:2px solid var(--md-error);padding:14px 15px}
.tf.erro .tf-box select{padding-right:43px}
.tf.erro .tf-box label,.tf.erro .sup{color:var(--md-error)}
.erro-campo{color:var(--md-error);font:400 12px/16px var(--f);padding:0 16px}

/* ---------- chips ---------- */
.chips{display:flex;flex-wrap:wrap;gap:8px}
.chip{
  display:inline-flex;align-items:center;gap:8px;height:32px;padding:0 16px;border-radius:var(--shape-s);
  border:1px solid var(--md-outline);background:transparent;color:var(--md-on-surface-variant);
  font:500 14px/20px var(--f);letter-spacing:.1px;cursor:pointer;white-space:nowrap;position:relative;overflow:hidden;
}
.chip .msi{font-size:18px}
button.chip::before{content:"";position:absolute;inset:0;background:currentColor;opacity:0;transition:opacity .15s;pointer-events:none}
button.chip:hover::before{opacity:.08}
button.chip:active::before{opacity:.12}
.chip:disabled{opacity:.38;cursor:default}
.chip .ck{display:none}
.chip[aria-pressed="true"]{background:var(--md-secondary-container);color:var(--md-on-secondary-container);border-color:transparent;padding-left:8px}
.chip[aria-pressed="true"] .ck{display:inline-block}
.chip.assist{color:var(--md-on-surface);min-width:0}
.chip.assist .msi{color:var(--md-primary)}
.chip.info{cursor:default;background:var(--md-sc-high);border-color:transparent;color:var(--md-on-surface-variant)}

/* ---------- situação: forma + palavra, nunca só cor ---------- */
.tg{display:inline-flex;align-items:center;gap:6px;font:500 12px/16px var(--f);letter-spacing:.3px;white-space:nowrap}
.tg i{width:10px;height:10px;box-sizing:border-box;flex:none}
.tg-ok{color:var(--md-on-surface-variant)}.tg-ok i{border-radius:50%;background:var(--md-ok)}
.tg-warn{color:var(--md-warn)}.tg-warn i{border-radius:50%;border:2px solid var(--md-warn)}
.tg-crit{color:var(--md-error)}.tg-crit i{border-radius:2px;background:var(--md-error)}
.tg-none{color:var(--md-on-surface-variant)}.tg-none i{border-radius:50%;border:1.5px dashed var(--md-on-surface-variant)}
.tg-mudo{color:var(--md-on-surface-variant)}.tg-mudo i{transform:rotate(45deg);border:2px solid var(--md-on-surface-variant)}
.tg-azul{color:var(--md-tertiary)}.tg-azul i{border-radius:50%;background:var(--md-tertiary)}
.tag-perfil{display:inline-block;font:500 12px/16px var(--f);padding:2px 8px;border-radius:var(--shape-s);background:var(--md-sc-high)}

/* ============================================================
   Moldura: cabeçalho, faixa de ajuda, faixa de som
   ============================================================ */
@keyframes pulso{0%,100%{opacity:.35}50%{opacity:1}}
.cabeca{position:sticky;top:0;z-index:40;background:var(--md-sc);display:flex;flex-wrap:wrap;align-items:center;gap:8px 16px;padding:12px 24px;border-bottom:1px solid var(--md-outline-variant)}
.marca{display:flex;align-items:center;gap:12px;margin-right:auto;min-width:0}
.marca-ico{width:40px;height:40px;border-radius:var(--shape-m);background:var(--md-primary);color:var(--md-on-primary);display:grid;place-items:center;flex:none}
.marca b{display:block;font:400 20px/26px var(--f)}
.marca small{display:block;font:500 12px/16px var(--f);letter-spacing:.5px;color:var(--md-on-surface-variant)}
.cabeca-dir{display:flex;align-items:center;gap:8px;flex-wrap:wrap;min-width:0}
.cabeca-dir form{margin:0}
.live{display:inline-flex;align-items:center;gap:8px;font:500 12px/16px var(--f);letter-spacing:.5px;color:var(--md-on-surface-variant);white-space:nowrap}
.live i{width:8px;height:8px;border-radius:50%;background:var(--md-ok);animation:pulso 2s ease-in-out infinite}
.live[data-estado="erro"]{color:var(--md-error);white-space:normal}
.live[data-estado="erro"] i{background:var(--md-error);animation:none}
#btn-som[aria-pressed="true"]{color:var(--md-ok)}
#eu-nome{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}

/* Pedido de ajuda: um alerta só, vermelho, de uma linha, preso logo abaixo do cabeçalho até o último
   atendimento registrado. O sininho (a faixa inteira) abre a gaveta com todos os pedidos e as ações. */
.sos-faixa{position:sticky;top:var(--altura-cabeca,65px);z-index:39;background:var(--md-error);color:var(--md-on-error)}
.sos-resumo{display:flex;align-items:center;gap:16px;width:100%;min-height:48px;padding:6px 24px;border:0;background:transparent;color:inherit;font:inherit;text-align:left;cursor:pointer;position:relative}
.sos-resumo::before{content:"";position:absolute;inset:0;background:currentColor;opacity:0;transition:opacity .15s;pointer-events:none}
.sos-resumo:hover::before{opacity:.08}
.sos-resumo:focus-visible{outline:2px solid var(--md-on-error);outline-offset:-4px}
.sino{width:32px;height:32px;border-radius:50%;display:grid;place-items:center;flex:none;background:var(--md-on-error);color:var(--md-error)}
.sino .msi{font-size:20px}
.sos-txt{display:flex;flex-direction:column;gap:2px;min-width:0;padding:4px 0;border:0;background:transparent;color:inherit;font:inherit;text-align:left;cursor:pointer}
.sos-resumo .sos-txt{flex:1 1 auto;flex-direction:row;flex-wrap:wrap;align-items:baseline;column-gap:12px;padding:0}
.sos-l1{font:500 14px/20px var(--f)}
.sos-l2{font:400 13px/18px var(--f);opacity:.92}
.sos-resumo .sos-l1,.sos-resumo .sos-l2{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:100%}
.sos-com{display:inline-block;padding:0 8px;margin:0 4px 0 8px;border-radius:var(--shape-s);background:color-mix(in srgb,var(--md-on-error) 22%,transparent);font:500 12px/18px var(--f)}
.sos-abrir{display:inline-flex;align-items:center;gap:4px;height:36px;padding:0 10px 0 16px;border-radius:var(--shape-full);background:var(--md-on-error);color:var(--md-error);font:500 14px/20px var(--f);white-space:nowrap;flex:none}
.sos-abrir .msi{font-size:20px}

/* A gaveta dos alertas: entra pela direita, com o fundo escurecido; a lista rola por dentro. */
@keyframes gv-entra{from{transform:translateX(32px);opacity:0}}
.gaveta{position:fixed;inset:0 0 0 auto;margin:0;height:auto;max-height:none;width:min(680px,100%);max-width:100%;border:0;padding:0;overflow:hidden;
  background:var(--md-sc-low);color:var(--md-on-surface);border-radius:var(--shape-xl) 0 0 var(--shape-xl);box-shadow:var(--elev-3)}
.gaveta[open]{animation:gv-entra .18s ease-out}
@media (prefers-reduced-motion:reduce){.gaveta[open]{animation:none}}
.gaveta::backdrop{background:rgba(0,0,0,.45)}
.gv{display:flex;flex-direction:column;height:100%}
.gv-cab{display:grid;grid-template-columns:40px minmax(0,1fr) 40px;align-items:start;gap:16px;padding:24px 16px 16px 24px;border-bottom:1px solid var(--md-outline-variant)}
.gv-cab .sino{width:40px;height:40px;background:var(--md-error);color:var(--md-on-error)}
.gv-cab .sino .msi{font-size:22px}
.gv-tit h2{margin:0;font:400 24px/32px var(--f)}
.gv-tit p{margin:4px 0 0;font:400 14px/20px var(--f);color:var(--md-on-surface-variant)}
.gv-fechar{--h:40px;width:40px;padding:0;color:var(--md-on-surface-variant)}
.gv-fechar .msi{font-size:24px}
.gv-lista{flex:1 1 auto;min-height:0;overflow-y:auto;padding:0 24px 24px}
.gaveta .sos-item{display:grid;grid-template-columns:24px minmax(0,1fr);align-items:start;gap:8px 16px;padding:16px 0}
.gaveta .sos-item + .sos-item{border-top:1px solid var(--md-outline-variant)}
.gaveta .sos-item > .msi{color:var(--md-error);margin-top:2px}
.gaveta .sos-txt{padding:0}
.gaveta .sos-txt:hover .sos-l1{text-decoration:underline}
.gaveta .sos-l2{color:var(--md-on-surface-variant);opacity:1}
.sos-motivo{font:400 14px/20px var(--f)}
.gaveta .sos-com{background:var(--md-error-container);color:var(--md-on-error-container)}
.sos-acoes{grid-column:2;display:flex;flex-wrap:wrap;align-items:center;gap:8px}
.sos-acoes .btn{--h:36px;padding:0 16px}
.sos-acoes .btn-text{padding:0 8px}

.som-faixa{display:flex;flex-wrap:wrap;align-items:center;gap:8px 16px;padding:8px 24px;background:var(--md-warn-container);color:var(--md-on-warn-container)}
.som-faixa .msi{font-size:22px}
.som-faixa .txt{flex:1 1 360px}
.som-faixa b{font-weight:500}
.som-faixa .btn{--h:36px;background:var(--md-on-warn-container);color:var(--md-warn-container);padding:0 16px}

/* ============================================================
   Corpo do painel: menu lateral + conteúdo
   ============================================================ */
.painel{display:grid;grid-template-columns:88px minmax(0,1fr);gap:24px;align-items:start;padding:24px 24px 56px;max-width:1640px;margin:0 auto}
.rail{position:sticky;top:calc(var(--altura-cabeca,65px) + var(--altura-sos,0px) + 16px);display:flex;flex-direction:column;align-items:center;gap:12px}
.rail button{width:84px;border:0;background:transparent;display:flex;flex-direction:column;align-items:center;gap:4px;padding:0;cursor:pointer;color:var(--md-on-surface-variant);font:500 12px/16px var(--f);letter-spacing:.5px;text-align:center}
.rail .ind{width:56px;height:32px;border-radius:var(--shape-full);display:grid;place-items:center;position:relative;overflow:visible}
.rail button[aria-current="true"]{color:var(--md-on-surface)}
.rail button[aria-current="true"] .ind{background:var(--md-secondary-container);color:var(--md-on-secondary-container)}
.rail button[aria-current="true"] .msi{font-variation-settings:"FILL" 1,"wght" 400,"GRAD" 0,"opsz" 24}
/* aviso de quantidade no canto do ícone (proposital sobre o ícone, como no padrão Material) */
.badge{position:absolute;top:-4px;left:32px;min-width:16px;height:16px;border-radius:8px;padding:0 4px;background:var(--md-error);color:var(--md-on-error);font:500 11px/16px var(--f);text-align:center;letter-spacing:0}

.pc{display:flex;flex-direction:column;gap:16px;min-width:0}
.pg-head{display:flex;flex-wrap:wrap;gap:8px 24px;align-items:baseline;justify-content:space-between}
.pg-head h1{font:400 28px/36px var(--f)}
.pg-head p{color:var(--md-on-surface-variant);max-width:70ch;margin-top:4px}
.foot{padding-top:16px;border-top:1px solid var(--md-outline-variant);color:var(--md-on-surface-variant);font:400 12px/18px var(--f);letter-spacing:.3px;max-width:80ch}

/* números do dia */
.kpis{display:grid;grid-template-columns:repeat(auto-fit,minmax(168px,1fr));grid-auto-rows:1fr;gap:12px}
/* quantidade fixa de indicadores: colunas que dividem certo, sem um sozinho na última linha */
.kpis.k6{grid-template-columns:repeat(6,minmax(0,1fr))}
.kpis.k4{grid-template-columns:repeat(4,minmax(0,1fr))}
@media (max-width:1250px){.kpis.k6{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media (max-width:700px){.kpis.k4{grid-template-columns:repeat(2,minmax(0,1fr))}}
.kpi{background:var(--md-sc-low);border-radius:var(--shape-m);padding:16px;display:flex;flex-direction:column;gap:4px;min-width:0}
.kpi b{font:400 36px/44px var(--f);font-variant-numeric:tabular-nums}
.kpi b i{font-style:normal;font-size:18px;color:var(--md-on-surface-variant)}
.kpi span{font:400 13px/18px var(--f);color:var(--md-on-surface-variant)}
.kpi small{font:400 12px/16px var(--f);color:inherit;opacity:.8}
.kpi button{all:unset;cursor:pointer}
.kpi.aten{background:var(--md-error-container);color:var(--md-on-error-container)}
.kpi.aten span,.kpi.aten b i{color:var(--md-on-error-container)}
.kpi.pend{background:var(--md-warn-container);color:var(--md-on-warn-container)}
.kpi.pend span{color:var(--md-on-warn-container)}

.banner{display:flex;flex-wrap:wrap;align-items:center;gap:8px 16px;padding:8px 8px 8px 16px;min-height:56px;border-radius:var(--shape-m);background:var(--md-warn-container);color:var(--md-on-warn-container)}
.banner .txt{flex:1 1 280px}
.banner b{font-weight:500}
.banner .btn{color:inherit}
.banner.info{background:var(--md-tertiary-container);color:var(--md-on-tertiary-container)}

/* duas colunas: lista à esquerda, detalhe à direita */
.grid2{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:16px;align-items:start}
.grid2.equipe{grid-template-columns:minmax(0,1.3fr) minmax(0,1fr)}
@media (max-width:1080px){.grid2,.grid2.equipe{grid-template-columns:minmax(0,1fr)}}

/* ---------- quadro (pane): cabeçalho, ferramentas, corpo ---------- */
.pane{background:var(--md-sc-lowest);border:1px solid var(--md-outline-variant);border-radius:var(--shape-m);overflow:hidden;--tf-bg:var(--md-sc-lowest);container-type:inline-size}
.pane-head{display:flex;flex-wrap:wrap;gap:4px 12px;align-items:baseline;padding:16px 16px 8px}
.pane-head h2{font:500 16px/24px var(--f);letter-spacing:.15px}
.pane-head .sub{font:400 13px/18px var(--f);color:var(--md-on-surface-variant)}
.pane-head .btn{margin-left:auto}
.pane-tools{display:flex;flex-wrap:wrap;gap:8px 12px;align-items:center;padding:8px 16px 12px}
.pane-tools .search{flex:1 1 100%}
.pane-tools .chips{flex:1 1 auto}
.pane-tools .chip{padding-left:12px;padding-right:12px}
.pane-tools .chip[aria-pressed="true"]{padding-left:8px}
.pane-tools .conta{margin-left:auto;font:400 12px/16px var(--f);color:var(--md-on-surface-variant);white-space:nowrap}
.pane-corpo{padding:8px 16px 16px;display:flex;flex-direction:column;gap:16px}
.cobertura{padding:0 16px 8px;font:400 13px/18px var(--f);color:var(--md-on-surface-variant)}
.cobertura b{font-weight:500;color:var(--md-on-surface)}
.search{display:flex;align-items:center;gap:8px;height:40px;padding:0 16px;border-radius:var(--shape-full);background:var(--md-sc-high);min-width:0;color:var(--md-on-surface-variant)}
.search .msi{font-size:20px}
.search input{flex:1;min-width:0;border:0;background:transparent;outline:none;color:var(--md-on-surface);font:400 14px/20px var(--f);text-overflow:ellipsis}
.search:focus-within{outline:2px solid var(--md-primary);outline-offset:-2px}

/* ---------- tabelas ---------- */
.dt-wrap{overflow-x:auto}
.dt{width:100%;border-collapse:collapse}
.dt th{text-align:left;padding:0 12px;height:44px;font:500 13px/18px var(--f);letter-spacing:.1px;color:var(--md-on-surface-variant);white-space:nowrap;border-bottom:1px solid var(--md-outline-variant);border-top:1px solid var(--md-outline-variant)}
.dt th.num,.dt td.num{text-align:right;font-variant-numeric:tabular-nums}
.dt td.num{font:400 13px/20px var(--f-mono);letter-spacing:0;white-space:nowrap}
.dt th:first-child,.dt td:first-child{padding-left:16px}
.dt th:last-child,.dt td:last-child{padding-right:16px}
.dt td{padding:10px 12px;border-bottom:1px solid var(--md-outline-variant);vertical-align:middle;font:400 14px/20px var(--f)}
.dt tbody tr:last-child td{border-bottom:0}
.dt tbody tr{cursor:pointer}
.dt tbody tr:hover td{background:color-mix(in srgb,var(--md-on-surface) 5%,transparent)}
.dt tbody tr[aria-selected="true"] td{background:var(--md-secondary-container);color:var(--md-on-secondary-container)}
.dt .nome{font-weight:500}
.dt .l2{display:block;font:400 12px/16px var(--f);letter-spacing:.3px;color:var(--md-on-surface-variant);margin-top:2px}
.dt tbody tr[aria-selected="true"] .l2{color:var(--md-on-secondary-container)}
.dt-vazio{padding:32px 16px!important;color:var(--md-on-surface-variant);cursor:default;text-align:center}
tr[aria-selected="true"] .tg{color:inherit}
td>.tg+.tg{display:flex;margin-top:4px}
/* Quadro estreito (notebook, zoom, celular): a situação desce para baixo do nome e o nome ganha a largura,
   sem coluna escondida à direita. */
.sit-estreita,.ult-estreita,.so-estreito,.dt .so-estreito{display:none}
@container (max-width:640px){
  .sit-larga,.ult-larga,.so-largo{display:none}
  .sit-estreita{display:flex;flex-wrap:wrap;gap:4px 12px;margin-top:4px}
  .ult-estreita{display:inline}
  .so-estreito,.dt .so-estreito{display:block}
  .tabela-equipe .linha-botoes,.dt .linha-botoes{flex-wrap:wrap}
}
/* Quadro bem estreito (celular): mais uma coluna desce para baixo do nome. */
.so-no-celular,.dt .so-no-celular{display:none}
@container (max-width:420px){
  .fora-no-celular{display:none}
  .so-no-celular,.dt .so-no-celular{display:block;margin-top:4px}
}
/* nome da coluna só para leitor de tela (a coluna de botões não precisa de título à vista) */
.so-leitor{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.tabela-equipe td .btn{--h:32px}
.tabela-equipe .linha-botoes{flex-wrap:nowrap;gap:4px}
.tabela-equipe .sua{display:block;max-width:24ch;font:400 12px/16px var(--f);color:var(--md-on-surface-variant)}

/* ---------- detalhe (chamado, cadastro) ---------- */
.det{padding:16px;display:flex;flex-direction:column;gap:16px}
.det-cab{display:flex;flex-wrap:wrap;gap:8px 12px;align-items:center}
.det-cab h2{font:400 24px/32px var(--f);flex:1 1 220px;overflow-wrap:anywhere}
.linha-info{display:flex;flex-wrap:wrap;gap:8px}
/* etiqueta com nome de escola longo quebra dentro da própria caixa */
.linha-info .chip{height:auto;min-height:32px;padding:6px 12px;white-space:normal;overflow-wrap:anywhere}
.quote{background:var(--md-sc-high);border-radius:var(--shape-m);padding:12px 16px;font:400 16px/24px var(--f);letter-spacing:.3px;overflow-wrap:anywhere;white-space:pre-line}
.eyebrow{display:block;font:500 12px/16px var(--f);letter-spacing:.5px;color:var(--md-on-surface-variant);margin-bottom:8px}
.acoes{display:grid;grid-template-columns:repeat(auto-fit,minmax(160px,1fr));gap:8px}
.acoes .btn{justify-content:flex-start;padding:0 16px}
.linha-botoes{display:flex;flex-wrap:wrap;gap:8px}
.aviso-selo,.pedido{display:flex;gap:12px;align-items:flex-start;padding:12px 16px;border-radius:var(--shape-m)}
.aviso-selo{background:var(--md-error-container);color:var(--md-on-error-container)}
.pedido{background:var(--md-tertiary-container);color:var(--md-on-tertiary-container)}
.pedido small{display:block;margin-top:4px;font:400 14px/20px var(--f);white-space:pre-line}
.resposta{display:flex;flex-direction:column;gap:12px;margin-top:8px;padding-left:12px;border-left:3px solid var(--md-tertiary)}
.dados{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:12px 16px}
.dados div{display:flex;flex-direction:column;gap:2px;min-width:0}
.dados dt{font:500 12px/16px var(--f);letter-spacing:.4px;color:var(--md-on-surface-variant)}
.dados dd{margin:0;font:400 14px/20px var(--f);overflow-wrap:anywhere}
.dados dd a{color:var(--md-primary)}
.dados dd .l2{display:block;font:400 12px/16px var(--f-mono);letter-spacing:0;color:var(--md-on-surface-variant)}
.copiar{border:0;background:transparent;color:var(--md-primary);cursor:pointer;font:500 12px/16px var(--f);padding:0 0 0 8px;vertical-align:1px}
.trilha{list-style:none;margin:0;padding:0}
.trilha li{display:grid;grid-template-columns:48px minmax(0,1fr);gap:12px;padding:12px 0;border-top:1px solid var(--md-outline-variant)}
.trilha li:first-child{border-top:0;padding-top:0}
.trilha .qd{font:400 13px/20px var(--f-mono);letter-spacing:0;color:var(--md-on-surface-variant)}
.trilha .qd small{display:block;font:400 11px/14px var(--f)}
.trilha b{font-weight:500}
.trilha small{display:block;color:var(--md-on-surface-variant);font:400 12px/16px var(--f);margin-top:2px;overflow-wrap:anywhere}
.vazio{padding:48px 24px;text-align:center;color:var(--md-on-surface-variant);display:flex;flex-direction:column;align-items:center;gap:12px}
.vazio .msi{font-size:36px;color:var(--md-outline)}
.checagens{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:8px}
.checagens li{display:flex;gap:12px;align-items:flex-start}
.checagens .msi{font-size:20px}
.checagens .ok .msi{color:var(--md-ok)}
.checagens .aten{color:var(--md-on-surface)}
.checagens .aten .msi{color:var(--md-warn)}
.checagens .info .msi{color:var(--md-tertiary)}

/* formulário de ação (resolver, pedir material, liberar, recusar...) */
.form-acao{background:var(--md-sc-high);border-radius:var(--shape-l);padding:16px;display:flex;flex-direction:column;gap:16px;--tf-bg:var(--md-sc-high)}
#t-form>.form-acao,#c-form>.form-acao{margin-top:12px}
.form-acao h4{font:500 16px/24px var(--f)}
.form-acao .opcoes{display:flex;flex-direction:column;background:var(--md-sc-lowest);border-radius:var(--shape-m);overflow:hidden}
.form-acao .opcoes label{display:flex;gap:12px;align-items:flex-start;padding:12px 16px;cursor:pointer;font:400 14px/20px var(--f)}
.form-acao .opcoes label + label{border-top:1px solid var(--md-outline-variant)}
.form-acao .opcoes input{width:20px;height:20px;margin:0;accent-color:var(--md-primary);flex:none}
.form-acao .pe{display:flex;flex-wrap:wrap;gap:8px}
.campos{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:16px 12px;padding-top:8px}
/* posto da liberação: município e local ocupam a linha toda; zona e seções dividem a de baixo */
.campos-posto{grid-template-columns:repeat(2,minmax(0,1fr))}
.campos-posto .largo{grid-column:1 / -1}
@container (max-width:420px){.campos-posto{grid-template-columns:minmax(0,1fr)}}

/* ---------- triagem ---------- */
/* abas: todas à vista (quebram de linha), nada escondido numa rolagem sem barra */
.sec-tabs{display:flex;flex-wrap:wrap;border-bottom:1px solid var(--md-outline-variant);padding:0 8px}
.sec-tab{height:44px;padding:0 8px;border:0;background:transparent;cursor:pointer;display:flex;align-items:center;gap:6px;white-space:nowrap;color:var(--md-on-surface-variant);font:500 14px/20px var(--f);position:relative}
.sec-tab b{font:500 11px/16px var(--f);min-width:20px;height:18px;padding:1px 6px;border-radius:9px;background:var(--md-sc-highest);color:var(--md-on-surface-variant);text-align:center}
.sec-tab[aria-selected="true"]{color:var(--md-on-surface)}
.sec-tab[aria-selected="true"]::after{content:"";position:absolute;left:0;right:0;bottom:0;height:2px;background:var(--md-primary)}
.sec-tab[aria-selected="true"] b{background:var(--md-primary);color:var(--md-on-primary)}
.fila-corte{padding:8px 16px 0;font:400 13px/18px var(--f)}
/* a lista rola por dentro e cabe na tela junto com o cabeçalho e a faixa de ajuda presos no alto */
.fila-lista{max-height:max(280px,calc(100vh - var(--altura-cabeca,65px) - var(--altura-sos,0px) - 250px));overflow-y:auto}
.tarefa{display:grid;grid-template-columns:4px minmax(0,1fr) auto;gap:12px;align-items:start;padding:12px 16px;border-top:1px solid var(--md-outline-variant)}
.tarefa:first-child{border-top:0}
.tarefa.sel{background:var(--md-secondary-container);color:var(--md-on-secondary-container)}
.tarefa .sv{width:4px;border-radius:2px;align-self:stretch}
.tarefa[data-g="alta"] .sv{background:var(--md-error)}
.tarefa[data-g="media"] .sv{background:var(--md-warn)}
.tarefa[data-g="baixa"] .sv{background:var(--md-ok)}
.tarefa .corpo{width:100%;border:0;background:transparent;padding:0;text-align:left;cursor:pointer;font:inherit;color:inherit;min-width:0}
.tarefa .corpo strong{display:block;font:500 15px/22px var(--f)}
.tarefa .corpo span{display:block;font:400 13px/18px var(--f);color:var(--md-on-surface-variant);overflow-wrap:anywhere}
.tarefa.sel .corpo span{color:var(--md-on-secondary-container)}
.tarefa .corpo em{display:block;font:400 12px/16px var(--f-mono);letter-spacing:0;font-style:normal;color:var(--md-on-surface-variant);margin-top:4px}
/* gravidade escrita na fila: a cor da barra sozinha não basta (daltonismo, sol na tela) */
.tarefa .corpo strong .gtxt{display:inline-block;margin-left:8px;font:600 11px/16px var(--f);letter-spacing:.5px;text-transform:uppercase;vertical-align:1px}
.tarefa[data-g="alta"] .gtxt{color:var(--md-error)}
.tarefa[data-g="media"] .gtxt{color:var(--md-warn)}
.tarefa[data-g="baixa"] .gtxt{color:var(--md-ok)}
.tarefa .prazo{font:500 12px/16px var(--f-mono);letter-spacing:0;text-align:right;white-space:nowrap}
.tarefa .prazo small{display:block;font:400 11px/14px var(--f);color:var(--md-on-surface-variant)}
.tarefa .venc{color:var(--md-error);font-weight:500}

/* provas (vídeo, foto, áudio) */
.midia-grade{display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:12px}
.midia{background:var(--md-sc-high);border-radius:var(--shape-m);overflow:hidden;display:flex;flex-direction:column;min-width:0}
.midia video,.midia img{display:block;width:100%;max-height:340px;object-fit:contain;background:#000}
.midia a.foto{display:block}
.midia audio{display:block;width:calc(100% - 16px);margin:12px 8px 0}
.midia .rod{padding:8px 12px 12px;display:flex;flex-direction:column;gap:2px;font:400 12px/16px var(--f);color:var(--md-on-surface-variant);overflow-wrap:anywhere}
.midia .rod b{font:500 12px/16px var(--f);display:flex;align-items:center;gap:4px}
.midia .rod .msi{font-size:16px}
.midia .ok{color:var(--md-ok)}
.midia .mal{color:var(--md-error)}
/* arquivo que ainda não chegou: caixa baixa, sem o espaço de um vídeo vazio */
.midia-falta{min-height:96px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;text-align:center;color:var(--md-on-surface-variant);padding:12px 16px}
.midia-falta .msi{font-size:28px;color:var(--md-outline)}

/* o que está chegando, em ordem de chegada */
.feed{list-style:none;margin:0;padding:0}
.feed button{display:grid;grid-template-columns:44px 24px minmax(0,1fr);gap:12px;align-items:start;width:100%;padding:12px 16px;border:0;border-top:1px solid var(--md-outline-variant);background:transparent;text-align:left;font:inherit;color:inherit;cursor:pointer}
.feed li:first-child button{border-top:0}
.feed button:hover{background:color-mix(in srgb,var(--md-on-surface) 5%,transparent)}
.feed .h{font:400 13px/20px var(--f-mono);letter-spacing:0;color:var(--md-on-surface-variant)}
.feed .ic{font-size:20px;color:var(--md-on-surface-variant)}
.feed [data-t="SOS"] .ic,.feed [data-g="ALTA"] .ic{color:var(--md-error)}
.feed [data-g="MEDIA"] .ic{color:var(--md-warn)}
.feed [data-t="BU"] .ic{color:var(--md-tertiary)}
.feed [data-t="CI"] .ic,.feed [data-t="RC"] .ic,.feed [data-t="RA"] .ic{color:var(--md-ok)}
.feed b{display:block;font-weight:500}
.feed small{display:block;color:var(--md-on-surface-variant);font:400 12px/16px var(--f);margin-top:2px;overflow-wrap:anywhere}
.feed-novo{animation:chegou 2.4s ease-out}
@keyframes chegou{from{background:var(--md-primary-container)}to{background:transparent}}

/* ============================================================
   Aviso rápido, janela e tela de entrada
   ============================================================ */
.snack{position:fixed;inset:auto;margin:0;border:0;overflow:visible;left:50%;transform:translateX(-50%);bottom:24px;z-index:60;background:var(--md-inverse-surface);color:var(--md-inverse-on-surface);border-radius:var(--shape-xs);padding:14px 16px;box-shadow:var(--elev-3);width:max-content;max-width:min(560px,calc(100% - 32px))}
.snack.erro{background:var(--md-error-container);color:var(--md-on-error-container)}
.dlg{border:0;border-radius:var(--shape-xl);padding:24px;background:var(--md-sc-high);color:var(--md-on-surface);width:min(560px,calc(100% - 32px));max-height:calc(100vh - 32px);--tf-bg:var(--md-sc-high)}
.dlg::backdrop{background:rgba(0,0,0,.45)}
.dlg h2{font:400 24px/32px var(--f)}
.dlg p{color:var(--md-on-surface-variant)}
/* entre os blocos da janela, sempre 16 px; o texto logo abaixo do título fica a 8 px */
.dlg > * + *{margin-top:16px}
.dlg > h2 + p{margin-top:8px}
.dlg form{display:flex;flex-direction:column;gap:16px}
.dlg .pe{display:flex;flex-wrap:wrap;justify-content:flex-end;gap:8px}
.dlg form .pe{margin-top:8px}
.senha-mostra{font:500 22px/30px var(--f-mono);letter-spacing:1px;background:var(--md-sc-lowest);padding:12px 16px;border-radius:var(--shape-m);user-select:all;word-break:break-all}
.tela-entrar{min-height:100vh;display:grid;place-items:center;padding:24px 16px}
.entrar-caixa{width:100%;max-width:400px;display:flex;flex-direction:column;gap:16px;background:var(--md-sc-lowest);border:1px solid var(--md-outline-variant);border-radius:var(--shape-xl);padding:32px 24px;--tf-bg:var(--md-sc-lowest)}
.entrar-caixa h1{font:400 28px/36px var(--f)}
.form-entrar{display:flex;flex-direction:column;gap:16px}

/* ============================================================
   Mapa (28/09): um ponto por local de votação, do frio ao quente
   ============================================================ */
:root{
  /* paleta de dado, separada da de interface: do frio (tudo calmo) ao quente (pede ação agora) */
  --calor-0:#2F6DB5; --calor-1:#2A9FC1; --calor-2:#43A35A; --calor-3:#E0B021; --calor-4:#EA7D2C; --calor-5:#D23A2E;
  --calor-sos:#9E1A1F;
  --mapa-agua:#DCE9EE;
}
/* no escuro o pedido de ajuda clareia: vermelho fechado some no fundo escuro, e ele é o ponto que mais precisa aparecer */
@media (prefers-color-scheme: dark){:root:not([data-theme="light"]){--mapa-agua:#13222A;--calor-sos:#FF6B6B}}
:root[data-theme="dark"]{--mapa-agua:#13222A;--calor-sos:#FF6B6B}

.mapa-barra{display:flex;flex-wrap:wrap;gap:8px 16px;align-items:center}
.mapa-barra .chips{flex:1 1 auto}
.mapa-barra .chip,.mapa-barra .chip[aria-pressed="true"]{padding:0 12px}
.mapa-barra .chip b{font:500 12px/16px var(--f-mono);color:inherit}
.mapa-acoes{display:flex;flex-wrap:wrap;gap:8px;align-items:center}
.mapa-acoes select{height:32px;border-radius:var(--shape-s);border:1px solid var(--md-outline);background:var(--md-surface);
  color:var(--md-on-surface);font:400 14px/20px var(--f);padding:0 8px;max-width:100%}
.mapa-legenda{display:flex;flex-wrap:wrap;align-items:center;gap:4px 12px;font:400 12px/16px var(--f);color:var(--md-on-surface-variant)}
/* rótulo que diz o que os pontos e a cor das áreas mostram: letra de ler, não de nota de rodapé */
.m-rot{margin:0;font:400 13px/18px var(--f);color:var(--md-on-surface-variant)}
.m-rot b{font-weight:500;color:var(--md-on-surface)}
.mapa-barra .m-rot{flex-basis:100%}
.m-leg-nota{flex-basis:100%;margin:0;font:400 13px/18px var(--f)}
.m-temp{display:inline-flex;align-items:center;gap:6px;white-space:nowrap}
.m-temp i{width:14px;height:14px;border-radius:3px;flex:none;display:inline-block}
.m-temp .t0{background:var(--calor-0)} .m-temp .t1{background:var(--calor-1)} .m-temp .t2{background:var(--calor-2)}
.m-temp .t3{background:var(--calor-3)} .m-temp .t4{background:var(--calor-4)} .m-temp .t5{background:var(--calor-5)}
.m-temp .tn{background:var(--md-sc-lowest);border:1px solid var(--md-outline)}
/* a escala em faixa contínua, como no Mapa de campo: a cor e, embaixo, até onde ela vai */
.m-escala{display:inline-grid;grid-template-columns:repeat(5,minmax(48px,76px)) minmax(48px,100px);align-items:start}
.m-degrau{display:flex;flex-direction:column;gap:4px;min-width:0;padding-right:4px}
.m-degrau i{display:block;height:10px}
.m-degrau:first-child i{border-radius:3px 0 0 3px} .m-degrau:last-child i{border-radius:0 3px 3px 0}
.m-degrau .t0{background:var(--calor-0)} .m-degrau .t1{background:var(--calor-1)} .m-degrau .t2{background:var(--calor-2)}
.m-degrau .t3{background:var(--calor-3)} .m-degrau .t4{background:var(--calor-4)} .m-degrau .t5{background:var(--calor-5)}
.m-degrau .tn{box-sizing:border-box;background:var(--md-sc-lowest);border:1px solid var(--md-outline);border-radius:3px}
.m-sem{width:76px;padding-right:0}
/* barra do ranking: a parte dos locais com fiscal que pede atenção, na cor da faixa */
.m-barra{-webkit-appearance:none;appearance:none;display:block;width:100%;height:6px;border:0;border-radius:3px;background:var(--md-sc-high);overflow:hidden}
.m-barra::-webkit-meter-bar{background:var(--md-sc-high);border:0;border-radius:3px;height:6px}
.m-barra::-webkit-meter-optimum-value,.m-barra::-webkit-meter-suboptimum-value,.m-barra::-webkit-meter-even-less-good-value{background:var(--barra);border-radius:3px}
.m-barra::-moz-meter-bar{background:var(--barra);border-radius:3px}
.m-barra.t0{--barra:var(--calor-0)} .m-barra.t1{--barra:var(--calor-1)} .m-barra.t2{--barra:var(--calor-2)}
.m-barra.t3{--barra:var(--calor-3)} .m-barra.t4{--barra:var(--calor-4)} .m-barra.t5{--barra:var(--calor-5)}

/* situação do local: forma e cor, a mesma do ponto no mapa */
.mt{display:inline-flex;align-items:center;gap:6px;font:500 12px/16px var(--f);letter-spacing:.3px;white-space:nowrap;color:var(--md-on-surface-variant)}
.mt i{width:10px;height:10px;flex:none;display:inline-block;box-sizing:border-box}
.mt-sos,.mt-atencao{color:var(--md-error)}
.mt-sos i{border-radius:2px;background:var(--calor-sos);box-shadow:0 0 0 2px var(--md-sc-lowest),0 0 0 4px var(--calor-sos);margin:0 2px}
.mt-atencao i{border-radius:2px;background:var(--calor-5)}
.mt-silencio i{transform:rotate(45deg) scale(.85);background:var(--calor-4)}
.mt-ausente i{border-radius:50%;background:var(--calor-3)}
.mt-ok i{border-radius:50%;background:var(--calor-2)}
.mt-encerrado i{border-radius:50%;background:var(--calor-0)}
.mt-sem_fiscal i{border-radius:50%;border:1.5px dashed var(--md-on-surface-variant)}

.mapa-grade{display:grid;grid-template-columns:minmax(0,1fr) 380px;gap:16px;align-items:stretch}
/* isolation: as camadas da biblioteca do mapa (até 1000) ficam presas na caixa e não passam por cima da faixa de ajuda */
.mapa-caixa{position:relative;isolation:isolate;border:1px solid var(--md-outline-variant);border-radius:var(--shape-m);overflow:hidden;
  height:min(72vh,760px);min-height:520px;background:var(--mapa-agua)}
#m-mapa{position:absolute;inset:0}
.mapa-aviso{position:absolute;inset:0;z-index:500;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:12px;
  padding:24px;text-align:center;background:var(--md-sc-low);color:var(--md-on-surface-variant);max-width:none}
.mapa-aviso[hidden]{display:none}
.mapa-aviso span:not(.msi){max-width:52ch}
/* a biblioteca do mapa chega depois deste arquivo: as regras abaixo levam um nível a mais para valerem */
.mapa-caixa .leaflet-container{background:var(--mapa-agua);font:400 12px/16px var(--f)}
.mapa-caixa .leaflet-bar a{background:var(--md-sc-lowest);color:var(--md-on-surface);border-bottom-color:var(--md-outline-variant)}
.mapa-caixa .leaflet-bar a:hover,.mapa-caixa .leaflet-bar a:focus{background:var(--md-sc-high)}
.mapa-caixa .leaflet-container .leaflet-control-attribution{background:color-mix(in srgb,var(--md-surface) 85%,transparent);color:var(--md-on-surface-variant)}
.mapa-caixa .leaflet-tooltip{background:var(--md-sc-lowest);color:var(--md-on-surface);border:1px solid var(--md-outline-variant);box-shadow:none;
  border-radius:var(--shape-s);font:500 12px/16px var(--f);padding:4px 8px}
.mapa-caixa .leaflet-tooltip-top:before{border-top-color:var(--md-outline-variant)}

.mapa-lado{display:flex;flex-direction:column;min-height:0;height:min(72vh,760px);min-height:520px;
  scroll-margin-top:calc(var(--altura-cabeca,65px) + var(--altura-sos,0px) + 8px)}
.m-busca{padding:16px 16px 0}
.m-lado{display:flex;flex-direction:column;min-height:0;flex:1 1 auto}
.m-rolo{overflow:auto;padding:16px;display:flex;flex-direction:column;gap:16px;min-height:0;flex:1 1 auto}
.m-voltar{align-self:flex-start;display:inline-flex;align-items:center;gap:4px;border:0;background:transparent;color:var(--md-primary);
  font:500 14px/20px var(--f);padding:4px 0;cursor:pointer}
.m-voltar .msi{font-size:20px}
.m-cab{display:flex;flex-direction:column;gap:4px}
.m-cab h2{font:400 22px/28px var(--f);text-wrap:balance;overflow-wrap:anywhere}
.m-meta{color:var(--md-on-surface-variant);font:400 13px/18px var(--f);overflow-wrap:anywhere}
.m-nums{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}
.m-num{background:var(--md-sc-low);border-radius:var(--shape-m);padding:12px;display:flex;flex-direction:column;gap:2px;min-width:0}
.m-num b{font:500 22px/28px var(--f);font-variant-numeric:tabular-nums}
.m-num b small{font:400 14px/20px var(--f);color:var(--md-on-surface-variant)}
.m-num span{font:400 12px/16px var(--f);color:var(--md-on-surface-variant)}
.m-num.aten b{color:var(--md-error)} .m-num.pend b{color:var(--md-warn)}
.m-bloco{display:flex;flex-direction:column;gap:8px}
.m-bloco h3{font:500 14px/20px var(--f);display:flex;flex-wrap:wrap;justify-content:space-between;align-items:baseline;gap:2px 8px}
.m-bloco h3 small{font:400 12px/16px var(--f);color:var(--md-on-surface-variant)}
.m-lista{display:flex;flex-direction:column;border:1px solid var(--md-outline-variant);border-radius:var(--shape-m);overflow:hidden}
.m-item{display:grid;grid-template-columns:auto minmax(0,1fr) auto;gap:4px 10px;align-items:start;text-align:left;width:100%;
  border:0;border-top:1px solid var(--md-outline-variant);background:transparent;color:inherit;padding:10px 12px;font:inherit;cursor:pointer}
.m-item:first-child{border-top:0}
.m-item:hover{background:var(--md-sc-low)}
.m-item:focus-visible,.m-voltar:focus-visible{outline:2px solid var(--md-primary);outline-offset:-2px}
.m-item > .mt,.m-item > .m-temp{margin-top:3px}
.m-item strong{font-weight:500;overflow-wrap:anywhere;grid-column:2}
.m-item .d{grid-column:3;font:500 12px/20px var(--f-mono);color:var(--md-on-surface-variant);white-space:nowrap}
.m-item .l2{grid-column:2 / 4;color:var(--md-on-surface-variant);font:400 12px/16px var(--f)}
.m-item .m-barra{grid-column:2 / 4;margin-top:2px}
.m-cham{grid-template-columns:minmax(0,1fr) auto}
.m-cham strong{grid-column:1}.m-cham .d{grid-column:2}.m-cham .l2{grid-column:1 / 3}
.m-tags{display:flex;flex-wrap:wrap;gap:4px 12px;align-items:center}
.m-sos{border-color:var(--calor-sos)}
.m-fiscal{background:var(--md-sc-low);border-radius:var(--shape-m);padding:12px;display:flex;flex-direction:column;gap:2px}
.m-fiscal strong{font-weight:500}
.m-fiscal span{color:var(--md-on-surface-variant);font:400 12px/16px var(--f)}
.m-fiscal strong .mono{font-size:12px;color:var(--md-on-surface-variant)}
.m-secoes{display:flex;flex-wrap:wrap;gap:6px}
.m-sec{display:inline-flex;align-items:center;height:24px;padding:0 8px;border-radius:var(--shape-s);font:500 12px/16px var(--f-mono);
  border:1px solid var(--md-outline-variant);color:var(--md-on-surface-variant)}
.m-sec.com{background:var(--md-ok-container);border-color:transparent;color:var(--md-on-ok-container)}
.m-nota{display:flex;gap:8px;align-items:flex-start;font:400 12px/16px var(--f);color:var(--md-on-surface-variant);background:var(--md-sc-low);
  border-radius:var(--shape-s);padding:8px 12px}
.m-nota .msi{font-size:18px}
.m-vazio,.m-dica{color:var(--md-on-surface-variant);font:400 13px/18px var(--f)}
@media (max-width:1280px){.mapa-grade{grid-template-columns:minmax(0,1fr) 340px}}
@media (max-width:1080px){
  .mapa-grade{grid-template-columns:minmax(0,1fr)}
  .mapa-caixa{height:60vh;min-height:380px}
  .mapa-lado{height:auto;min-height:0}
  .m-rolo{overflow:visible}
}
@media (max-width:600px){
  .mapa-acoes{width:100%}
  .mapa-acoes select{flex:1 1 100%;height:44px}
}

/* ============================================================
   Telas menores
   ============================================================ */
@media (max-width:1080px){.fila-lista{max-height:none}}
@media (max-width:840px){
  .cabeca{position:static;padding:8px 16px}
  .sos-faixa{top:0}
  .sos-resumo{padding:6px 16px;gap:12px}
  .som-faixa{padding:8px 16px;display:grid;grid-template-columns:22px minmax(0,1fr);align-items:start;gap:8px 12px}
  .som-faixa .btn{grid-column:2;justify-self:start}
  .painel{grid-template-columns:minmax(0,1fr);gap:16px;padding:16px 16px 48px}
  .rail{position:static;flex-direction:row;justify-content:space-between;gap:0;background:var(--md-sc);border-radius:var(--shape-l);padding:8px 4px}
  .rail button{flex:1 1 0;min-width:0;width:auto;white-space:nowrap}
}
@media (max-width:600px){
  /* cabeçalho numa linha: som e sair só no ícone (o nome segue no aria-label), o perfil sai da vista */
  .cabeca .rot,#eu-nome,#eu-perfil,.cabeca .marca small{display:none}
  .cabeca .chip.assist{padding:0 10px}
  .cabeca .btn-text{padding:0 10px}
  .cabeca-dir{gap:4px}
  /* com as 6 seções da administração, cada botão do menu tem uns 56 px: o nome quebra em duas linhas em vez de cortar */
  .rail button{white-space:normal;font-size:11px;line-height:14px;letter-spacing:0}
  .rail .ind{width:100%;max-width:56px}
  .live{order:3;width:100%}
  .marca b{font-size:18px;line-height:24px}
  .pg-head h1{font-size:24px;line-height:32px}
  .kpis,.kpis.k6,.kpis.k4{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}
  .kpi{padding:12px}
  .kpi b{font-size:28px;line-height:36px}
  /* todo controle com pelo menos 44 px de altura para o dedo */
  .btn{min-height:44px}
  .btn-sm,.sos-acoes .btn,.som-faixa .btn{--h:44px}
  /* no celular a gaveta ocupa a tela toda e o "Ver os pedidos" fica só na seta */
  .gaveta{width:100%;border-radius:0}
  .gv-cab{padding:16px 8px 12px 16px;gap:12px}
  .gv-lista{padding:0 16px 16px}
  .sos-resumo .sos-l1,.sos-resumo .sos-l2{white-space:normal}
  .sos-abrir{width:36px;padding:0;justify-content:center}
  .sos-abrir .rot{display:none}
  .chip{height:44px}
  .copiar{display:inline-block;padding:14px 8px;margin:-14px 0}
  .dt th,.dt td{padding-left:8px;padding-right:8px}
  .dt th:first-child,.dt td:first-child{padding-left:16px}
  .dt th:last-child,.dt td:last-child{padding-right:16px}
  .sit-larga,.ult-larga,.so-largo{display:none}
  .sit-estreita{display:flex;flex-wrap:wrap;gap:4px 12px;margin-top:4px}
  .ult-estreita{display:inline}
  .so-estreito,.dt .so-estreito{display:block}
  .tabela-equipe .linha-botoes{flex-wrap:wrap}
  .dlg{padding:20px 16px}
}