/* Portal PTIJ — identidade institucional do Governo de Alagoas.
   Paleta derivada do brasão: azul do escudo, vermelho do castelo dessaturado,
   papel em neutro quente. Tema único e explícito. */

:root{
  --papel:#f5f3ef;
  --superficie:#ffffff;
  --superficie2:#efece6;
  --tinta:#14181c;
  --tinta2:#4a5158;
  --tinta3:#787f86;
  --regua:#d9d5cd;
  --regua-fina:#e8e5de;

  --rail:#0b2e45;
  --rail2:#123a55;
  --rail-tinta:#dce6ed;
  --rail-tinta2:#8fa8bb;

  --azul:#0f6e96;
  --azul-claro:#e3eef4;
  --ciano:#0098d8;
  --vermelho:#9c3b33;
  --vermelho-claro:#f6e9e7;
  --verde:#3d6b4b;
  --verde-claro:#e7efe8;
  --ambar:#8a6a1f;
  --ambar-claro:#f6efdd;

  --sombra:0 1px 2px rgba(11,46,69,.06), 0 10px 28px -20px rgba(11,46,69,.35);
}

*{box-sizing:border-box}
html,body{margin:0;padding:0}
body{
  background:var(--papel); color:var(--tinta);
  font-family:"IBM Plex Sans",-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
  font-size:16px; line-height:1.55; -webkit-font-smoothing:antialiased;
}
a{color:var(--azul)}
h1,h2,h3{font-family:Newsreader,Georgia,serif;font-weight:600;letter-spacing:-.012em;margin:0}
.pular{position:absolute;left:-9999px}
.pular:focus{left:8px;top:8px;background:#fff;padding:8px 12px;z-index:99;border:2px solid var(--azul)}
:focus-visible{outline:2px solid var(--ciano);outline-offset:2px}

/* ---------------------------------------------------------------- estrutura */
.quadro{display:grid;grid-template-columns:264px minmax(0,1fr);min-height:100vh}

.rail{
  background:var(--rail); color:var(--rail-tinta);
  padding:26px 22px 20px; display:flex; flex-direction:column; gap:22px;
  position:sticky; top:0; height:100vh; overflow-y:auto;
}
.brasao{width:52px;height:auto;display:block;margin-bottom:12px;
  filter:drop-shadow(0 1px 2px rgba(0,0,0,.35))}
.rail-org{font-size:12.5px;font-weight:600;margin:0;letter-spacing:.01em}
.rail-sec{font-size:11.5px;color:var(--rail-tinta2);margin:2px 0 0;line-height:1.35}
.rail hr{border:0;border-top:1px solid rgba(255,255,255,.14);margin:16px 0}
.rail-proj{font-family:Newsreader,Georgia,serif;font-size:17px;line-height:1.2;margin:0 0 6px}
.rail-conv{font-family:"IBM Plex Mono",monospace;font-size:10.5px;color:var(--rail-tinta2);margin:0;line-height:1.5}

.rail-nav{display:flex;flex-direction:column;gap:1px;margin-top:-6px}
.rail-est{display:flex;align-items:baseline;gap:9px;padding:6px 8px;border-radius:3px;
  text-decoration:none;color:var(--rail-tinta);border-left:2px solid transparent}
.rail-est:hover{background:var(--rail2)}
.rail-est b{font-family:"IBM Plex Mono",monospace;font-size:12px;font-weight:500;min-width:42px}
.rail-est span{font-size:12.5px;color:var(--rail-tinta2)}
.rail-est.perto{border-left-color:var(--ciano)}
.rail-est.perto span{color:#bfe4f6}
.rail-est.passou{opacity:.5}

.rail-pe{margin-top:auto;border-top:1px solid rgba(255,255,255,.14);padding-top:14px}
.rail-quem{font-size:12px;font-weight:600;letter-spacing:.06em;text-transform:uppercase;margin:0;color:#bfe4f6}
.rail-nome{font-size:13px;margin:3px 0 8px;color:var(--rail-tinta)}
.rail-sair{font-size:11.5px;color:var(--rail-tinta2)}

.palco{padding:38px 44px 90px;max-width:1180px}

/* ---------------------------------------------------------------- capa */
.capa{border-bottom:2px solid var(--tinta);padding-bottom:20px;margin-bottom:26px}
.olho{font-family:"IBM Plex Mono",monospace;font-size:11px;letter-spacing:.09em;
  text-transform:uppercase;color:var(--tinta3);margin:0 0 10px}
.capa h1{font-size:clamp(30px,4vw,42px);line-height:1.05;margin:0 0 12px}
.linha-fina{font-family:Newsreader,Georgia,serif;font-size:18px;line-height:1.5;
  color:var(--tinta2);max-width:66ch;margin:0 0 20px}
.numeros{display:flex;flex-wrap:wrap;gap:0;border:1px solid var(--regua);background:var(--superficie)}
.numeros>div{padding:12px 20px;border-right:1px solid var(--regua-fina);min-width:120px}
.numeros>div:last-child{border-right:0}
.numeros b{display:block;font-family:"IBM Plex Mono",monospace;font-size:22px;font-weight:500;
  font-variant-numeric:tabular-nums;letter-spacing:-.02em}
.numeros span{font-size:11px;letter-spacing:.07em;text-transform:uppercase;color:var(--tinta3)}
.numeros .alarme b{color:var(--vermelho)}

.aviso{padding:11px 16px;margin:0 0 22px;font-size:14.5px;border-left:3px solid var(--azul);
  background:var(--azul-claro)}
.aviso.ok{border-left-color:var(--verde);background:var(--verde-claro)}
.aviso.erro{border-left-color:var(--vermelho);background:var(--vermelho-claro)}

/* ---------------------------------------------------------------- trilha */
.trilha{display:grid;grid-auto-flow:column;grid-auto-columns:1fr;gap:2px;margin:0 0 34px;
  border:1px solid var(--regua);background:var(--superficie);padding:14px 16px}
.tr-est{display:flex;flex-direction:column;gap:5px;padding:0 6px;border-left:1px solid var(--regua-fina)}
.tr-est:first-child{border-left:0}
.tr-data{font-family:"IBM Plex Mono",monospace;font-size:11.5px;color:var(--tinta2);margin:0}
.tr-barra{display:block;height:5px;background:var(--superficie2);border-radius:2px;overflow:hidden}
.tr-barra i{display:block;height:100%;width:var(--pc);background:var(--verde)}
.tr-rot{font-size:11px;color:var(--tinta3);margin:0;line-height:1.25}
.tr-num{font-family:"IBM Plex Mono",monospace;font-size:10.5px;color:var(--tinta3)}
.tr-est.critica .tr-data{font-weight:600;color:var(--tinta)}
.tr-est.perto .tr-barra{box-shadow:0 0 0 1px var(--ciano)}
.tr-est.passou{opacity:.55}

/* ---------------------------------------------------------------- estação */
.estacao{display:grid;grid-template-columns:196px minmax(0,1fr);gap:0 28px;
  border-top:1px solid var(--tinta);padding:24px 0 30px}
.estacao.passou{opacity:.86}
.est-gutter{position:sticky;top:24px;align-self:start}
.est-data{font-family:Newsreader,Georgia,serif;font-size:30px;line-height:1;margin:0}
.est-sem{font-family:"IBM Plex Mono",monospace;font-size:10.5px;letter-spacing:.08em;
  text-transform:uppercase;color:var(--tinta3);margin:5px 0 0}
.est-rot{display:inline-block;margin:10px 0 0;font-size:10.5px;font-weight:600;letter-spacing:.07em;
  text-transform:uppercase;padding:3px 7px;background:var(--superficie2);color:var(--tinta2);border-radius:2px}
.estacao.critica .est-rot{background:var(--vermelho-claro);color:var(--vermelho)}
.est-prazo{font-family:"IBM Plex Mono",monospace;font-size:11.5px;margin:10px 0 0;color:var(--tinta2)}
.est-prazo.perto{color:var(--ambar);font-weight:500}
.est-prazo.venceu{color:var(--vermelho);font-weight:500}
.est-nota{font-size:12.5px;color:var(--tinta3);line-height:1.45;margin:10px 0 0}

.est-itens{display:flex;flex-direction:column;gap:14px}

/* ---------------------------------------------------------------- item */
.item{background:var(--superficie);border:1px solid var(--regua);border-left:3px solid var(--regua);
  padding:16px 18px;box-shadow:var(--sombra)}
.item.atrasado{border-left-color:var(--vermelho)}
.it-cab{display:flex;flex-wrap:wrap;gap:7px;align-items:center;margin-bottom:9px}
.item h3{font-size:18px;line-height:1.3;margin:0 0 6px}
.it-det{font-size:14.2px;color:var(--tinta2);margin:0 0 7px;line-height:1.5}
.it-base{font-family:"IBM Plex Mono",monospace;font-size:11.5px;color:var(--tinta3);margin:0}
.it-nota{font-size:13.5px;background:var(--ambar-claro);border-left:2px solid var(--ambar);
  padding:8px 11px;margin:10px 0 0}

.tag{font-family:"IBM Plex Mono",monospace;font-size:10px;font-weight:600;letter-spacing:.08em;
  padding:3px 7px;border-radius:2px}
.t-fep{background:var(--azul-claro);color:var(--azul)}
.t-dbn{background:var(--ambar-claro);color:var(--ambar)}
.chip{font-size:10.5px;font-weight:600;letter-spacing:.07em;text-transform:uppercase;
  padding:3px 7px;border-radius:2px;background:var(--superficie2);color:var(--tinta2)}
.s-aceito{background:var(--verde-claro);color:var(--verde)}
.s-entregue{background:var(--azul-claro);color:var(--azul)}
.s-devolvido{background:var(--vermelho-claro);color:var(--vermelho)}
.s-atraso{background:var(--vermelho);color:#fff}
.s-ato{background:transparent;color:var(--tinta3);border:1px solid var(--regua)}

.anexos{list-style:none;margin:12px 0 0;padding:0;border-top:1px solid var(--regua-fina)}
.anexos li{display:flex;flex-wrap:wrap;align-items:baseline;gap:6px 12px;
  padding:9px 0;border-bottom:1px solid var(--regua-fina)}
.ax-nome{font-size:14px;font-weight:500;text-decoration:none;border-bottom:1px solid var(--azul)}
.ax-meta{font-size:12px;color:var(--tinta3)}
.ax-hash{font-family:"IBM Plex Mono",monospace;font-size:11px;color:var(--tinta3);
  background:var(--superficie2);padding:1px 6px;border-radius:2px}
.ax-rm{margin-left:auto}
.ax-rm button{background:none;border:0;color:var(--tinta3);font-size:11.5px;cursor:pointer;
  text-decoration:underline;font-family:inherit;padding:0}
.ax-rm button:hover{color:var(--vermelho)}

.envio{display:flex;flex-wrap:wrap;gap:10px;align-items:stretch;margin-top:13px}
.alvo{flex:1 1 320px;position:relative;display:flex;flex-direction:column;justify-content:center;
  gap:3px;border:1px dashed var(--regua);background:var(--papel);padding:13px 16px;cursor:pointer;
  transition:border-color .15s, background .15s}
.alvo:hover,.alvo.sobre{border-color:var(--ciano);background:var(--azul-claro)}
.alvo input[type=file]{position:absolute;inset:0;opacity:0;cursor:pointer}
.alvo-txt{font-size:13.5px;color:var(--tinta2)}
.alvo-lim{font-family:"IBM Plex Mono",monospace;font-size:11px;color:var(--tinta3)}
.alvo.tem .alvo-txt{color:var(--azul);font-weight:600}

.bt{font-family:inherit;font-size:13.5px;font-weight:600;padding:10px 20px;border:0;cursor:pointer;
  background:var(--rail);color:#fff;border-radius:2px}
.bt:hover{background:var(--rail2)}
.bt-ok{background:var(--verde)}
.bt-nao{background:var(--vermelho)}
.bt-neutro{background:var(--tinta3)}

.curadoria{display:flex;flex-wrap:wrap;gap:8px;margin-top:13px;padding-top:13px;
  border-top:1px solid var(--regua-fina)}
.curadoria input[type=text]{flex:1 1 260px;font-family:inherit;font-size:13.5px;padding:9px 12px;
  border:1px solid var(--regua);background:var(--papel)}
.curadoria .bt{padding:9px 15px;font-size:12.5px}

.hist{margin-top:12px}
.hist summary{font-size:12px;color:var(--tinta3);cursor:pointer;letter-spacing:.03em}
.hist ol{margin:8px 0 0;padding-left:20px;font-size:12.5px;color:var(--tinta2);line-height:1.6}
.hist b{font-family:"IBM Plex Mono",monospace;font-weight:500}

.pe{border-top:2px solid var(--tinta);margin-top:44px;padding-top:18px;
  font-size:12px;color:var(--tinta3);line-height:1.6}
.pe p{max-width:82ch;margin:0 0 8px}

/* ---------------------------------------------------------------- entrada */
.entrada-body{display:grid;place-items:center;min-height:100vh;
  background:linear-gradient(180deg,#0b2e45 0%,#0b2e45 46%,#f5f3ef 46%,#f5f3ef 100%)}
.entrada{background:var(--superficie);border:1px solid var(--regua);box-shadow:var(--sombra);
  padding:40px 44px 34px;max-width:520px;width:calc(100% - 40px);text-align:center;margin:24px}
.brasao-g{width:78px;height:auto;margin:0 auto 16px;display:block}
.ent-org{font-size:13px;font-weight:600;margin:0}
.ent-sec{font-size:12px;color:var(--tinta3);margin:3px 0 20px;line-height:1.4}
.entrada h1{font-size:25px;line-height:1.2;margin:0 0 8px}
.ent-conv{font-family:"IBM Plex Mono",monospace;font-size:11.5px;color:var(--tinta3);margin:0 0 20px}
.ent-txt{font-size:14px;color:var(--tinta2);text-align:left;margin:0 0 20px;line-height:1.55}
.ent-erro{background:var(--vermelho-claro);color:var(--vermelho);font-size:13.5px;
  padding:9px 13px;margin:0 0 16px;text-align:left;border-left:3px solid var(--vermelho)}
.ent-form{display:flex;flex-direction:column;gap:14px;text-align:left}
.ent-form label{font-size:12px;font-weight:600;letter-spacing:.05em;text-transform:uppercase;
  color:var(--tinta2);display:flex;flex-direction:column;gap:6px}
.ent-form input{font-family:inherit;font-size:15px;padding:11px 13px;border:1px solid var(--regua);
  background:var(--papel);text-transform:none;letter-spacing:0;font-weight:400}
.ent-pe{font-size:11.5px;color:var(--tinta3);margin:22px 0 0}

/* ---------------------------------------------------------------- telas menores */
@media (max-width:960px){
  .quadro{grid-template-columns:1fr}
  .rail{position:static;height:auto;flex-direction:row;flex-wrap:wrap;align-items:center;gap:14px 22px;padding:18px 20px}
  .rail-topo{flex:1 1 240px}
  .brasao{width:40px;margin-bottom:8px}
  .rail hr,.rail-proj{display:none}
  .rail-nav{flex-direction:row;flex-wrap:wrap;flex:1 1 100%;gap:4px}
  .rail-est{padding:5px 8px;background:var(--rail2)}
  .rail-pe{margin:0;border-top:0;padding:0}
  .palco{padding:24px 20px 60px}
  .trilha{grid-auto-flow:row;grid-auto-columns:auto}
  .tr-est{flex-direction:row;align-items:center;gap:10px;border-left:0;border-top:1px solid var(--regua-fina);padding:7px 0}
  .tr-est:first-child{border-top:0}
  .tr-barra{flex:1}
  .estacao{grid-template-columns:1fr;gap:16px}
  .est-gutter{position:static;display:flex;flex-wrap:wrap;align-items:baseline;gap:6px 14px}
  .est-nota{flex:1 1 100%;margin:0}
}

@media print{
  .rail,.envio,.curadoria,.ax-rm,.aviso{display:none}
  .quadro{grid-template-columns:1fr}
  body{background:#fff}
  .item{box-shadow:none;break-inside:avoid}
  .estacao{break-inside:auto}
}