*,*::before,*::after{box-sizing:border-box}
:root{
  --navy:#003060; --navy-d:#00203f; --azul:#0a6fa8;
  --texto:#16202f; --texto-2:#4d5c72; --texto-3:#77869b;
  --linha:#e3e9f0; --fundo:#f7f9fb; --cartao:#ffffff;
  --ok:#1f9d55; --ok-cl:#e8f6ee; --lento:#d08a00; --lento-cl:#fdf4e1; --fora:#d23b2f; --fora-cl:#fcebea;
  --dia-ok:#2fb468; --dia-quase:#9fd36b; --dia-lento:#e5a823; --dia-fora:#d23b2f; --dia-vazio:#dfe5ec;
  --fonte:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;
  --max:960px;
}
@media (prefers-color-scheme:dark){
  :root{
    --navy:#9cc6ef; --navy-d:#e6eef7; --azul:#6cb2e8;
    --texto:#dfe6ee; --texto-2:#a6b3c3; --texto-3:#7d8b9c;
    --linha:#25303d; --fundo:#0f151c; --cartao:#151d27;
    --ok:#3cc47a; --ok-cl:#13281d; --lento:#e9b23d; --lento-cl:#2b2310; --fora:#f0665b; --fora-cl:#2e1715;
    --dia-ok:#33b86d; --dia-quase:#86bf55; --dia-lento:#d79a1c; --dia-fora:#e0483c; --dia-vazio:#283340;
  }
}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--fundo);color:var(--texto);font-family:var(--fonte);font-size:15px;line-height:1.55;-webkit-font-smoothing:antialiased}
a{color:var(--azul);text-decoration:none}
a:hover{text-decoration:underline}
h1,h2,h3{margin:0;line-height:1.25;color:var(--navy-d);letter-spacing:-.01em}
p{margin:0}
.wrap{width:100%;max-width:var(--max);margin-inline:auto;padding-inline:16px}

.topo{background:var(--cartao);border-bottom:1px solid var(--linha)}
.topo-in{display:flex;align-items:center;justify-content:space-between;height:58px;gap:12px}
.marca{display:flex;align-items:center;gap:9px;color:var(--navy-d);font-weight:700;font-size:16px}
.marca:hover{text-decoration:none}
.marca img{width:26px;height:auto}
.marca em{font-style:normal;font-weight:500;color:var(--texto-3);padding-left:9px;border-left:1px solid var(--linha)}
.topo-link{font-size:13.5px;color:var(--texto-2)}

main{padding:28px 0 40px;min-height:60vh}
.carregando{padding:60px 0;text-align:center;color:var(--texto-3)}

.faixa{display:flex;align-items:center;gap:14px;padding:18px 20px;border-radius:10px;background:var(--ok-cl);border:1px solid transparent;margin-bottom:10px}
.faixa.ok{background:var(--ok-cl);border-color:color-mix(in srgb,var(--ok) 25%,transparent)}
.faixa.lento{background:var(--lento-cl);border-color:color-mix(in srgb,var(--lento) 30%,transparent)}
.faixa.fora{background:var(--fora-cl);border-color:color-mix(in srgb,var(--fora) 30%,transparent)}
.faixa h1{font-size:19px;font-weight:700}
.faixa .ic{flex:0 0 auto;width:30px;height:30px;border-radius:50%;display:grid;place-items:center;color:#fff}
.faixa.ok .ic{background:var(--ok)} .faixa.lento .ic{background:var(--lento)} .faixa.fora .ic{background:var(--fora)}
.faixa .ic svg{width:17px;height:17px;stroke:currentColor;fill:none;stroke-width:2.6;stroke-linecap:round;stroke-linejoin:round}
.meta{display:flex;flex-wrap:wrap;justify-content:space-between;gap:6px 16px;color:var(--texto-3);font-size:13px;margin:0 2px 22px}
.aviso{background:var(--cartao);border:1px solid var(--linha);border-radius:8px;padding:10px 14px;margin-bottom:14px;font-size:14px;color:var(--texto-2)}

.busca{width:100%;padding:10px 12px;border:1px solid var(--linha);border-radius:8px;background:var(--cartao);color:var(--texto);font:inherit;margin-bottom:14px}
.busca:focus{outline:2px solid color-mix(in srgb,var(--azul) 45%,transparent);outline-offset:1px}

.lista{background:var(--cartao);border:1px solid var(--linha);border-radius:10px;overflow:hidden}
.item{padding:16px 18px;border-top:1px solid var(--linha)}
.item:first-child{border-top:0}
.item-cab{display:flex;align-items:center;gap:10px;margin-bottom:9px}
.item-cab .nome{font-weight:650;color:var(--navy-d);font-size:15.5px}
.item-cab a.nome:hover{text-decoration:underline}
.item-cab .seg{color:var(--texto-3);font-size:13px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;min-width:0}
.item-cab .dir{margin-left:auto;font-size:13px;color:var(--texto-2);white-space:nowrap}
.item-cab .dir b{font-weight:600}
.estado-txt{font-size:13px;font-weight:600}
.estado-txt.ok{color:var(--ok)} .estado-txt.lento{color:var(--lento)} .estado-txt.fora{color:var(--fora)}

.bola{flex:0 0 auto;width:10px;height:10px;border-radius:50%;background:var(--ok);box-shadow:0 0 0 3px color-mix(in srgb,var(--ok) 18%,transparent)}
.bola.lento{background:var(--lento);box-shadow:0 0 0 3px color-mix(in srgb,var(--lento) 20%,transparent)}
.bola.fora{background:var(--fora);box-shadow:0 0 0 3px color-mix(in srgb,var(--fora) 20%,transparent)}

.barra{display:flex;gap:2px;height:30px;align-items:stretch}
.dia{flex:1 1 0;min-width:0;border-radius:2px;background:var(--dia-vazio);cursor:default}
.dia.d-ok{background:var(--dia-ok)} .dia.d-quase{background:var(--dia-quase)}
.dia.d-lento{background:var(--dia-lento)} .dia.d-fora{background:var(--dia-fora)}
.dia:hover,.dia:focus{opacity:.75;outline:none}
.escala{display:flex;justify-content:space-between;gap:10px;font-size:12px;color:var(--texto-3);margin-top:6px}
.escala .meio{flex:1;border-bottom:1px solid var(--linha);margin:0 4px 7px}
.escala .curto{display:none}

.dica{position:fixed;z-index:20;pointer-events:none;background:var(--navy-d);color:var(--fundo);font-size:12.5px;line-height:1.4;padding:7px 10px;border-radius:6px;max-width:220px;box-shadow:0 4px 14px rgba(0,0,0,.18)}
.dica b{display:block;font-weight:600}

.voltar{display:inline-block;font-size:14px;margin-bottom:18px}
.sis-cab{display:flex;align-items:center;gap:16px;flex-wrap:wrap;background:var(--cartao);border:1px solid var(--linha);border-radius:10px;padding:18px 20px;margin-bottom:14px}
.sis-cab .logo{height:44px;width:auto;max-width:200px;object-fit:contain}
.sis-cab .sigla{width:44px;height:44px;border-radius:9px;display:grid;place-items:center;color:#fff;font-weight:700;font-size:16px}
.sis-cab .tit{min-width:0;flex:1}
.sis-cab h1{font-size:21px;font-weight:700}
.sis-cab .seg{color:var(--texto-3);font-size:13.5px}
.sis-cab .site{font-size:14px;font-weight:600;white-space:nowrap}
@media (prefers-color-scheme:dark){.sis-cab .logo{background:#fff;border-radius:6px;padding:4px 8px}}

.h2{font-size:16px;font-weight:700;margin:26px 2px 10px}
.comp-cab{display:flex;align-items:center;gap:10px;margin-bottom:9px;flex-wrap:wrap}
.comp-cab .nome{font-weight:600;color:var(--navy-d)}
.comp-cab .dir{margin-left:auto;font-size:13px;color:var(--texto-2);white-space:nowrap}
.inc{padding:13px 18px;border-top:1px solid var(--linha);font-size:14px}
.inc:first-child{border-top:0}
.inc b{color:var(--navy-d);font-weight:600}
.inc .q{color:var(--texto-3);font-size:13px;margin-top:2px}
.inc .aberto{color:var(--fora);font-weight:600}
.vazio{padding:16px 18px;color:var(--texto-3);font-size:14px}

.rodape{border-top:1px solid var(--linha);padding:22px 0 30px;color:var(--texto-3);font-size:13px}
.rodape p+p{margin-top:8px}

@media (max-width:640px){
  .barra .dia:nth-child(-n+60){display:none}
  .escala .longo{display:none}
  .escala .curto{display:inline}
  .item{padding:14px 14px}
  .item-cab .seg{display:none}
  .faixa{padding:14px 14px}
  .faixa h1{font-size:17px}
  .topo-link{display:none}
  .sis-cab{padding:16px 14px}
  .sis-cab .site{width:100%}
}