
/* Layout: cofre e papel. A AMETRA e o login vivem no escuro (cofre); a escola lê no claro (papel) sob uma faixa marinha.
   O tema é escolhido pelo papel de quem acessa, não pelo sistema do visitante: cada superfície declara as próprias cores. */
:root{
  --f-display:"Playfair Display", Georgia, "Times New Roman", serif;
  --f-ui:"Manrope", "Segoe UI", system-ui, sans-serif;
  --f-text:"Source Serif 4", Georgia, serif;
  --r:4px;
  /* cofre (padrão) */
  --bg:#090E1A; --bg-2:#0D1424; --surface:#111A2C; --surface-2:#172137; --line:#1D2740; --line-2:#29355280;
  --ink:#EDE9DE; --ink-2:#B4BAC8; --muted:#7A8197;
  --gold:#C9A84C; --gold-2:#E8C96A; --gold-ink:#E2C670; --gold-soft:#C9A84C1F;
  --ok:#6CBF98; --ok-soft:#6CBF981A; --warn:#E0AE57; --warn-soft:#E0AE571A; --crit:#E8837C; --crit-soft:#E8837C1C;
  --navy:#1B2A4A; --chart:#8FA3D1;
  color-scheme:dark;
}
.papel{
  --bg:#F4F2EC; --bg-2:#EEEBE3; --surface:#FBFAF6; --surface-2:#F0EDE5; --line:#E3DED2; --line-2:#D4CEBF;
  --ink:#10172A; --ink-2:#3A4154; --muted:#737A8C;
  --gold:#A8892F; --gold-2:#C9A84C; --gold-ink:#86691A; --gold-soft:#F1E8CF;
  --ok:#2C7353; --ok-soft:#E0EEE6; --warn:#9C6812; --warn-soft:#F5E9D2; --crit:#A23833; --crit-soft:#F5E0DE;
  --chart:#1B2A4A;
  color-scheme:light;
}
.cofre{ --bg:#090E1A; color-scheme:dark }

*{box-sizing:border-box}
html,body{height:100%}
body{background:#090E1A; color:#EDE9DE; font-family:var(--f-ui); font-size:14px; line-height:1.6; -webkit-font-smoothing:antialiased; letter-spacing:.005em}
button,input,select,textarea{font:inherit; color:inherit; letter-spacing:inherit}
:focus-visible{outline:1.5px solid var(--gold-2); outline-offset:3px}
.tab{font-variant-numeric:tabular-nums lining-nums}
h1,h2,h3{font-family:var(--f-display); font-weight:500; margin:0; color:var(--ink); text-wrap:balance; letter-spacing:.003em}
.eyebrow{font-size:10.5px; letter-spacing:.22em; text-transform:uppercase; color:var(--muted); font-weight:600}
.gold{color:var(--gold-ink)}
.rule{height:1px; background:linear-gradient(90deg, var(--gold) 0, var(--gold) 48px, var(--line) 48px)}

/* ================= LOGIN ================= */
.login{min-height:100%; display:grid; grid-template-columns:minmax(0,1.25fr) minmax(0,1fr); background:var(--bg)}
.login-brand{position:relative; overflow:hidden; padding-block:56px; padding-left:max(56px, env(safe-area-inset-left,0px)); padding-right:56px; display:flex; flex-direction:column; justify-content:space-between; gap:48px; border-right:1px solid var(--line); background:radial-gradient(120% 90% at 0% 100%, #16233F 0%, #090E1A 60%)}
.login-brand canvas{position:absolute; inset:0; width:100%; height:100%}
@media (max-width:820px){.login-brand canvas{opacity:.35}}
.login-brand > :not(canvas){position:relative}
.mark{display:flex; align-items:center; gap:14px}
.seal-sm{width:40px; height:40px; flex:none}
.mark-name{font-family:var(--f-display); font-size:16px; color:var(--ink); letter-spacing:.16em}
.mark-sub{font-size:9.5px; letter-spacing:.32em; text-transform:uppercase; color:var(--gold)}
.claim{max-width:34rem}
.claim h1{font-size:clamp(34px,4.4vw,60px); line-height:1.06; font-weight:400; letter-spacing:-.005em}
.claim h1 em{font-style:normal; color:var(--gold-2)}
.claim p{font-family:var(--f-text); font-weight:300; font-size:17px; line-height:1.65; color:var(--ink-2); margin:22px 0 0; max-width:31rem}
.counter{display:flex; gap:28px; flex-wrap:wrap}
.counter div{display:grid; gap:2px}
.counter b{font-family:var(--f-display); font-weight:400; font-size:30px; color:var(--ink); line-height:1}
.counter span{font-size:10.5px; letter-spacing:.18em; text-transform:uppercase; color:var(--muted)}
.login-form{display:grid; place-items:center; padding-block:48px; padding-left:32px; padding-right:max(32px, env(safe-area-inset-right,0px)); background:var(--bg)}
.login-card{width:100%; max-width:360px; display:grid; gap:26px}
.login-card h2{font-size:30px; font-weight:400}
.field{display:grid; gap:8px}
.field label,.field .lab{font-size:10.5px; font-weight:600; color:var(--muted); letter-spacing:.18em; text-transform:uppercase}
.input{height:48px; padding:0 2px; background:transparent; border:0; border-bottom:1px solid var(--line-2); border-radius:0; width:100%; font-size:15px; color:var(--ink)}
.input::placeholder{color:var(--muted); opacity:.7}
.input:focus{outline:none; border-bottom-color:var(--gold-2)}
.box{height:46px; padding:0 14px; border:1px solid var(--line-2); border-radius:var(--r); background:var(--surface)}
.box:focus{border-color:var(--gold)}
textarea.box{height:auto; min-height:130px; padding:12px 14px; resize:vertical; font-family:var(--f-text); font-size:15.5px; line-height:1.6}
.btn{height:44px; padding:0 22px; border-radius:var(--r); border:1px solid var(--line-2); background:transparent; cursor:pointer; font-weight:600; font-size:12.5px; letter-spacing:.08em; display:inline-flex; align-items:center; justify-content:center; gap:10px; white-space:nowrap; color:var(--ink); transition:border-color .2s, background .2s}
.btn:hover{border-color:var(--gold)}
.btn-gold{background:linear-gradient(180deg,#D9BC63,#C2A044); border-color:#C2A044; color:#15110A}
.btn-gold:hover{background:linear-gradient(180deg,#E4C871,#CBA84B)}
.papel .btn-gold{background:#14203A; border-color:#14203A; color:#F1EDE2}
.papel .btn-gold:hover{background:#1E2D50}
.btn-sm{height:34px; padding:0 14px; font-size:11.5px}
.btn svg{width:15px; height:15px; stroke:currentColor; fill:none; stroke-width:1.6}
.otp{display:grid; grid-template-columns:repeat(6,minmax(0,1fr)); gap:10px}
.otp input{height:58px; text-align:center; font-size:24px; font-family:var(--f-display); background:var(--surface); border:1px solid var(--line-2); border-radius:var(--r); min-width:0; width:100%; color:var(--ink)}
.otp input:focus{outline:none; border-color:var(--gold-2); box-shadow:0 0 0 4px var(--gold-soft)}
.hint{font-size:12.5px; color:var(--muted); margin:0; line-height:1.55}
.tag{display:inline-flex; align-items:center; gap:8px; font-size:10px; letter-spacing:.2em; text-transform:uppercase; color:var(--gold-ink); border:1px solid var(--gold-soft); background:var(--gold-soft); padding:5px 10px; border-radius:2px; font-weight:600; width:max-content; max-width:100%}

/* ================= APP ================= */
.app{display:grid; grid-template-columns:264px minmax(0,1fr); min-height:100%}
.side{background:#070B15; border-right:1px solid #1A2338; color:#B4BAC8; display:flex; flex-direction:column; gap:34px; padding-block:30px; padding-left:max(22px, env(safe-area-inset-left,0px)); padding-right:22px; position:sticky; top:0; height:100vh; height:100dvh; overflow:auto}
.nav{display:grid; gap:1px}
.nav-label{font-size:9.5px; letter-spacing:.28em; text-transform:uppercase; color:#5E667C; margin:0 12px 10px}
.nav button{all:unset; cursor:pointer; display:flex; align-items:center; gap:12px; padding:10px 12px; border-radius:3px; font-size:13.5px; color:#A9AFBE; position:relative; transition:color .2s, background .2s}
.nav button:hover{color:#EDE9DE}
.nav button[aria-current="page"]{color:#F3EFE4; background:linear-gradient(90deg,#C9A84C14,transparent)}
.nav button[aria-current="page"]::before{content:""; position:absolute; left:0; top:9px; bottom:9px; width:1.5px; background:#E8C96A}
.nav button:focus-visible{outline:1.5px solid #E8C96A}
.nav svg{width:17px; height:17px; flex:none; stroke:currentColor; fill:none; stroke-width:1.35}
.nav .count{margin-left:auto; font-size:10.5px; color:#E8C96A; border:1px solid #C9A84C55; border-radius:10px; padding:0 7px; font-weight:600}
.side-foot{margin-top:auto; display:grid; gap:14px; font-size:12px}
.who{display:flex; gap:12px; align-items:center; padding-top:16px; border-top:1px solid #1A2338}
.mono-av{width:38px; height:38px; border-radius:50%; display:grid; place-items:center; font-family:var(--f-display); font-size:14px; color:#E8C96A; border:1px solid #C9A84C; flex:none; background:radial-gradient(circle at 30% 30%,#1E2C4C,#0B1222)}
.who b{color:#EDE9DE; font-weight:600; display:block; font-size:13px}
.secure{display:flex; align-items:center; gap:9px; color:#7A8197; font-size:11px; letter-spacing:.02em}
.secure i{width:6px; height:6px; border-radius:50%; background:#6CBF98; box-shadow:0 0 0 3px #6CBF9822; flex:none}

.main{min-width:0; display:flex; flex-direction:column; background:var(--bg); color:var(--ink)}
.top{display:flex; align-items:center; gap:12px 18px; flex-wrap:wrap; padding-block:16px; padding-left:44px; padding-right:max(44px, env(safe-area-inset-right,0px)); border-bottom:1px solid var(--line); background:var(--bg); position:sticky; top:env(safe-area-inset-top,0px); z-index:6}
.crumb{font-size:12px; color:var(--muted); letter-spacing:.04em; min-width:0}
.crumb b{color:var(--ink); font-weight:600}
.spacer{flex:1}
.seg{display:inline-flex; border:1px solid var(--line-2); border-radius:20px; padding:3px; gap:2px}
.seg button{all:unset; cursor:pointer; padding:5px 14px; font-size:11.5px; color:var(--ink-2); border-radius:16px; letter-spacing:.04em; font-weight:600}
.seg button[aria-pressed="true"]{background:var(--gold-2); color:#15110A}
.papel .seg button[aria-pressed="true"]{background:#14203A; color:#F1EDE2}
.seg button:focus-visible{outline:1.5px solid var(--gold-2)}
.content{padding-block:44px 80px; padding-left:44px; padding-right:max(44px, env(safe-area-inset-right,0px)); display:grid; gap:36px; max-width:1280px; width:100%}
.head{display:flex; align-items:flex-end; gap:24px; flex-wrap:wrap; justify-content:space-between}
.head > div{min-width:0}
.head h1{font-size:clamp(32px,3.4vw,46px); line-height:1.08; font-weight:400; margin-top:10px}
.head p{margin:10px 0 0; color:var(--ink-2); max-width:42rem; font-family:var(--f-text); font-weight:300; font-size:16px}

.grid{display:grid; gap:24px}
.g3{grid-template-columns:repeat(3,minmax(0,1fr))}
.g2{grid-template-columns:repeat(2,minmax(0,1fr))}
.g-side{grid-template-columns:minmax(0,1.7fr) minmax(0,1fr)}
.panel{background:var(--surface); border:1px solid var(--line); border-radius:var(--r); padding:28px 30px; min-width:0}
.panel-h{display:flex; align-items:baseline; justify-content:space-between; gap:14px; margin-bottom:22px; flex-wrap:wrap}
.panel-h h2{font-size:21px}
.panel-h .sub{font-size:11.5px; color:var(--muted); letter-spacing:.04em}

/* números de abertura, separados por fios, sem caixas */
.figures{display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); border-top:1px solid var(--line); border-bottom:1px solid var(--line)}
.fig{padding:26px 28px 24px 0; display:grid; gap:6px; min-width:0}
.fig + .fig{padding-left:28px; border-left:1px solid var(--line)}
.fig .v{font-family:var(--f-display); font-size:52px; line-height:1; font-weight:400; color:var(--ink)}
.fig .v small{font-size:20px; color:var(--muted); margin-left:4px}
.fig .l{font-size:10.5px; letter-spacing:.2em; text-transform:uppercase; color:var(--muted); font-weight:600}
.fig .d{font-size:12.5px; color:var(--ink-2)}
.up{color:var(--ok)} .down{color:var(--crit)}

.pill{display:inline-flex; align-items:center; gap:7px; font-size:11px; font-weight:600; padding:3px 10px; border-radius:20px; white-space:nowrap; letter-spacing:.03em}
.pill::before{content:""; width:5px; height:5px; border-radius:50%; background:currentColor; flex:none}
.p-ok{color:var(--ok); background:var(--ok-soft)}
.p-warn{color:var(--warn); background:var(--warn-soft)}
.p-crit{color:var(--crit); background:var(--crit-soft)}
.p-neutral{color:var(--ink-2); background:var(--surface-2)}
.p-gold{color:var(--gold-ink); background:var(--gold-soft)}
.code{font-family:var(--f-display); font-size:14px; color:var(--gold-ink); white-space:nowrap}

.tbl-wrap{overflow-x:auto; margin:0 -30px; padding:0 30px}
table{width:100%; border-collapse:collapse; font-size:13.5px}
th{text-align:left; font-size:9.5px; letter-spacing:.22em; text-transform:uppercase; color:var(--muted); font-weight:600; padding:0 16px 12px 0; border-bottom:1px solid var(--line-2); white-space:nowrap}
td{padding:16px 16px 16px 0; border-bottom:1px solid var(--line); vertical-align:middle}
tr:last-child td{border-bottom:0}
.small{font-size:12px; color:var(--muted)}
.mono{font-family:ui-monospace,"Cascadia Mono",Consolas,monospace; font-size:11px; color:var(--muted); letter-spacing:.06em}
.strong{font-weight:600}

/* lista de escolas da carteira */
.school{display:grid; grid-template-columns:64px minmax(0,1.6fr) minmax(0,1fr) 110px minmax(0,1fr) auto; gap:22px; align-items:center; padding:20px 0; border-bottom:1px solid var(--line); cursor:pointer; transition:background .2s}
.school:last-child{border-bottom:0}
.school:hover{background:linear-gradient(90deg, var(--gold-soft), transparent 70%)}
.school:focus-visible{outline:1.5px solid var(--gold-2); outline-offset:0}
.school .nm{font-family:var(--f-display); font-size:19px; line-height:1.25; color:var(--ink)}
.school .ct{font-size:12px; color:var(--muted); margin-top:3px}
.school .ph{font-size:12.5px; color:var(--ink-2)}
.school .ph small{display:block; color:var(--muted); font-size:11px; letter-spacing:.08em; text-transform:uppercase}
.chev{width:16px; height:16px; stroke:var(--muted); fill:none; stroke-width:1.5}

.axis-row{display:grid; grid-template-columns:150px minmax(0,1fr) 48px; gap:18px; align-items:center; padding:11px 0}
.axis-row .k{font-size:13.5px; min-width:0; font-weight:500}
.axis-row .k small{display:block; color:var(--muted); font-size:11.5px; font-weight:400}
.axis-row .v{font-family:var(--f-display); font-size:22px; text-align:right}
.bar{height:3px; background:var(--line); position:relative}
.bar i{position:absolute; left:0; top:0; bottom:0; background:var(--chart)}
.bar i::after{content:""; position:absolute; right:-3px; top:-3px; width:9px; height:9px; border-radius:50%; background:var(--gold-2); box-shadow:0 0 0 3px var(--surface)}
.bar.low i{background:var(--crit)}

/* faixa de abertura da escola */
.hero{background:radial-gradient(110% 140% at 100% 0%, #1D2C50 0%, #0E1628 55%, #0A101E 100%); color:#EDE9DE; border-radius:var(--r); padding:40px 44px; display:grid; grid-template-columns:auto minmax(0,1fr) auto; gap:44px; align-items:center; position:relative; overflow:hidden; border:1px solid #1D2740}
.hero::after{content:""; position:absolute; left:44px; right:44px; bottom:0; height:1px; background:linear-gradient(90deg,#C9A84C,transparent)}
.hero .eyebrow{color:#8E95AA}
.score{display:grid; gap:4px}
.score .n{font-family:var(--f-display); font-weight:400; font-size:118px; line-height:.9; color:#F3EFE4; letter-spacing:-.02em}
.score .n small{font-size:26px; color:#7A8197; letter-spacing:0; margin-left:6px}
.hero-mid{display:grid; gap:16px; min-width:0}
.hero-mid h2{color:#F3EFE4; font-size:30px; font-weight:400}
.hero-mid p{margin:0; color:#B4BAC8; font-family:var(--f-text); font-weight:300; font-size:15.5px; max-width:36rem}
.ladder{display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:6px; max-width:520px}
.ladder div{display:grid; gap:8px}
.ladder i{height:2px; background:#2A3654}
.ladder .on i{background:#E8C96A}
.ladder .cur i{background:linear-gradient(90deg,#E8C96A 50%,#2A3654 50%)}
.ladder span{font-size:10px; letter-spacing:.14em; text-transform:uppercase; color:#7A8197; line-height:1.3}
.ladder .on span,.ladder .cur span{color:#E8C96A}
.seal-lg{width:150px; height:150px; flex:none}

/* gestor do programa */
.gestor{display:grid; grid-template-columns:auto minmax(0,1fr); gap:20px; align-items:center}
.gestor .mono-av{width:64px; height:64px; font-size:22px}
.gestor b{font-family:var(--f-display); font-weight:500; font-size:19px; display:block; color:var(--ink)}
.gestor .role{font-size:12px; color:var(--muted)}
.meet{display:grid; grid-template-columns:auto minmax(0,1fr); gap:14px; align-items:center; padding:16px 0 0; margin-top:18px; border-top:1px solid var(--line)}
.cal{width:52px; text-align:center; border:1px solid var(--line-2); border-radius:var(--r); overflow:hidden}
.cal span{display:block; font-size:9.5px; letter-spacing:.16em; text-transform:uppercase; background:#14203A; color:#E8C96A; padding:3px 0}
.cal b{display:block; font-family:var(--f-display); font-weight:400; font-size:22px; padding:3px 0 4px; color:var(--ink)}

.track{display:grid}
.phase{display:grid; grid-template-columns:36px minmax(0,1fr); gap:20px; position:relative; padding-bottom:28px}
.phase::before{content:""; position:absolute; left:17px; top:36px; bottom:0; width:1px; background:var(--line-2)}
.phase:last-child{padding-bottom:0} .phase:last-child::before{display:none}
.dot{width:36px; height:36px; border-radius:50%; border:1px solid var(--line-2); background:var(--surface); display:grid; place-items:center; font-family:var(--f-display); font-size:14px; color:var(--muted); position:relative; z-index:1}
.phase.done .dot{background:#14203A; border-color:#14203A; color:#E8C96A}
.phase.now .dot{border:1.5px solid var(--gold-2); color:var(--gold-ink); background:var(--gold-soft); box-shadow:0 0 0 6px var(--gold-soft)}
.phase h3{font-size:19px; display:flex; gap:12px; align-items:center; flex-wrap:wrap}
.phase .meta{font-size:12.5px; color:var(--muted); margin-top:3px}
.steps{display:flex; flex-wrap:wrap; gap:0; margin-top:14px; border:1px solid var(--line); border-radius:var(--r); overflow:hidden; width:max-content; max-width:100%}
.step{font-size:12px; padding:7px 14px; color:var(--muted); background:var(--surface); border-right:1px solid var(--line)}
.step:last-child{border-right:0}
.step.ok{color:var(--ok); background:var(--ok-soft)}
.step.cur{color:var(--gold-ink); background:var(--gold-soft); font-weight:600}

.list{display:grid}
.li{display:grid; grid-template-columns:auto minmax(0,1fr) auto; gap:16px; align-items:center; padding:15px 0; border-bottom:1px solid var(--line)}
.li:last-child{border-bottom:0}
.li .t{font-weight:500}
.li .s{font-size:12px; color:var(--muted)}
.mark-dot{width:9px; height:9px; border-radius:50%; border:1.5px solid var(--muted); flex:none}
.mark-dot.crit{border-color:var(--crit); background:var(--crit)}
.mark-dot.warn{border-color:var(--warn)}

.docs{display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:24px}
.doc{display:grid; gap:12px; padding:26px 24px 20px; background:var(--surface); border:1px solid var(--line); border-radius:var(--r); position:relative; min-width:0; align-content:start}
.doc::before{content:""; position:absolute; top:0; right:0; width:28px; height:28px; background:linear-gradient(225deg, var(--bg) 50%, var(--line-2) 50%)}
.doc .t{font-family:var(--f-display); font-size:19px; line-height:1.28; color:var(--ink)}
.doc .foot{display:flex; justify-content:space-between; gap:10px; align-items:center; flex-wrap:wrap; border-top:1px solid var(--line); padding-top:14px; margin-top:6px}
.signed{display:inline-flex; gap:7px; align-items:center; font-size:11.5px; color:var(--ok); font-weight:600}
.signed svg{width:13px; height:13px; stroke:currentColor; fill:none; stroke-width:2}

.legal{border:1px solid var(--line-2); border-radius:var(--r); background:var(--surface); overflow:hidden}
.legal-h{background:#14203A; color:#EDE9DE; padding:22px 28px; display:flex; justify-content:space-between; gap:12px; flex-wrap:wrap; align-items:center; border-bottom:1px solid #C9A84C}
.legal-h b{font-family:var(--f-display); font-weight:500; font-size:17px; letter-spacing:.14em}
.legal-h span{font-size:10.5px; color:#E8C96A; letter-spacing:.18em; text-transform:uppercase}
.legal-b{padding:6px 28px 12px}

.msg{display:grid; gap:6px; padding:22px 0; border-bottom:1px solid var(--line)}
.msg:first-child{padding-top:0} .msg:last-child{border-bottom:0; padding-bottom:0}
.msg .h{display:flex; gap:12px; align-items:center; flex-wrap:wrap}
.msg .t{font-family:var(--f-display); font-size:18px}
.msg p{margin:4px 0 0; font-family:var(--f-text); font-weight:300; font-size:16px; line-height:1.65; color:var(--ink-2); max-width:62ch}
.form{display:grid; gap:20px}
.row{display:flex; gap:12px; flex-wrap:wrap; align-items:center}
.chips{display:flex; gap:8px; flex-wrap:wrap}
.chip{all:unset; cursor:pointer; font-size:12.5px; padding:7px 14px; border:1px solid var(--line-2); border-radius:20px}
.chip[aria-pressed="true"]{border-color:var(--gold); background:var(--gold-soft); color:var(--gold-ink); font-weight:600}
.chip:focus-visible{outline:1.5px solid var(--gold-2)}

.drop{border:1px dashed var(--line-2); border-radius:var(--r); padding:28px; display:grid; gap:10px; background:var(--surface); position:relative; cursor:pointer; min-width:0; transition:border-color .2s}
.drop:hover,.drop:focus-within{border-color:var(--gold)}
.drop input{position:absolute; inset:0; opacity:0; cursor:pointer; width:100%}
.drop .t{font-family:var(--f-display); font-size:20px}
.drop .ok{font-size:12.5px; color:var(--ok); font-weight:600}

.sec-grid{display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); border-top:1px solid var(--line)}
.sec{padding:26px 26px 26px 0; display:grid; gap:8px; align-content:start; border-bottom:1px solid var(--line)}
.sec:not(:nth-child(3n+1)){padding-left:26px; border-left:1px solid var(--line)}
.sec svg{width:22px; height:22px; stroke:var(--gold-ink); fill:none; stroke-width:1.3}
.sec b{font-family:var(--f-display); font-weight:500; font-size:18px}
.sec span{font-size:13px; color:var(--muted); line-height:1.55}

/* relatório trimestral: dossiê */
.dossie{background:var(--surface); border:1px solid var(--line); border-radius:var(--r); max-width:860px; width:100%; justify-self:center; box-shadow:0 30px 60px -40px #10172A55}
.dossie-h{background:#14203A; color:#EDE9DE; padding:30px 48px; display:flex; justify-content:space-between; gap:16px; align-items:center; flex-wrap:wrap; border-bottom:1px solid #C9A84C}
.dossie-h .mark-name{color:#EDE9DE}
.dossie-b{padding:44px 48px 48px; display:grid; gap:30px}
.dossie-b h2{font-size:clamp(28px,3vw,38px); font-weight:400; line-height:1.12}
.dossie-b p{font-family:var(--f-text); font-weight:300; font-size:16.5px; line-height:1.72; margin:0; color:var(--ink); max-width:64ch}
.dossie-b h3{font-size:12px; font-family:var(--f-ui); letter-spacing:.22em; text-transform:uppercase; color:var(--gold-ink); font-weight:700; display:flex; gap:14px; align-items:center}
.dossie-b h3::after{content:""; flex:1; height:1px; background:linear-gradient(90deg,var(--gold-2),transparent)}
.dfig{display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); border-top:1px solid var(--line); border-bottom:1px solid var(--line)}
.dfig div{padding:20px 0; display:grid; gap:4px}
.dfig div + div{padding-left:24px; border-left:1px solid var(--line)}
.dfig b{font-family:var(--f-display); font-weight:400; font-size:40px; line-height:1}
.dfig span{font-size:11.5px; color:var(--muted)}
.sign{display:grid; justify-items:end; gap:4px; padding-top:10px}
.sign i{width:240px; height:1px; background:#14203A}
.sign b{font-family:var(--f-display); font-weight:500; font-size:17px}

/* página pública do selo */
.pub{display:grid; gap:0; border-radius:var(--r); overflow:hidden; border:1px solid var(--line); background:var(--surface)}
.pub-top{background:radial-gradient(90% 120% at 50% 0%, #1D2C50 0%, #0A101E 70%); color:#EDE9DE; padding:56px 40px 48px; display:grid; justify-items:center; text-align:center; gap:18px}
.pub-top .seal-xl{width:190px; height:190px}
.pub-top h2{color:#F3EFE4; font-size:clamp(28px,3.4vw,42px); font-weight:400}
.pub-top p{margin:0; color:#B4BAC8; font-family:var(--f-text); font-weight:300; font-size:16px; max-width:36rem}
.pub-body{padding:36px 40px; display:grid; gap:26px}
.verify{display:flex; gap:16px; align-items:center; flex-wrap:wrap; justify-content:center; padding:16px 20px; border:1px solid var(--line); border-radius:var(--r); background:var(--ok-soft)}
.verify b{color:var(--ok)}
.pub-axes{display:grid; grid-template-columns:repeat(5,minmax(0,1fr)); gap:0; border-top:1px solid var(--line); border-bottom:1px solid var(--line)}
.pub-axes div{padding:20px 14px; text-align:center; display:grid; gap:6px}
.pub-axes div + div{border-left:1px solid var(--line)}
.pub-axes b{font-family:var(--f-display); font-weight:500; font-size:17px}
.pub-axes span{font-size:11.5px; color:var(--ok); font-weight:600}

/* abas internas */
.tabs{display:flex; gap:0; border-bottom:1px solid var(--line); flex-wrap:wrap}
.tabs button{all:unset; cursor:pointer; padding:12px 2px; margin-right:28px; font-size:13px; font-weight:600; letter-spacing:.04em; color:var(--muted); position:relative}
.tabs button[aria-selected="true"]{color:var(--ink)}
.tabs button[aria-selected="true"]::after{content:""; position:absolute; left:0; right:0; bottom:-1px; height:1.5px; background:var(--gold-2)}
.tabs button:focus-visible{outline:1.5px solid var(--gold-2)}
.tabs .n{font-family:var(--f-display); font-weight:400; color:var(--gold-ink); margin-left:6px}

/* processos */
.proc-row{display:grid; grid-template-columns:minmax(0,1.5fr) minmax(0,1fr) minmax(0,1.2fr) auto; gap:22px; align-items:center; padding:20px 0; border-bottom:1px solid var(--line); cursor:pointer}
.proc-row:last-child{border-bottom:0}
.proc-row:hover{background:linear-gradient(90deg, var(--gold-soft), transparent 70%)}
.proc-row:focus-visible{outline:1.5px solid var(--gold-2)}
.proc-row .nm{font-family:var(--f-display); font-size:18px; line-height:1.3; color:var(--ink)}
.proc-row .num{font-family:ui-monospace,"Cascadia Mono",Consolas,monospace; font-size:11.5px; color:var(--muted); letter-spacing:.03em; margin-top:3px}
.proc-row .last{font-size:12.5px; color:var(--ink-2)}
.proc-row .last small{display:block; font-size:11px; color:var(--muted); letter-spacing:.06em; text-transform:uppercase}
.capa{display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); border-top:1px solid var(--line); border-bottom:1px solid var(--line)}
.capa div{padding:18px 20px 18px 0; display:grid; gap:4px; min-width:0}
.capa div + div{padding-left:20px; border-left:1px solid var(--line)}
.capa > div > span{font-size:9.5px; letter-spacing:.22em; text-transform:uppercase; color:var(--muted); font-weight:600}
.capa b{font-weight:500; font-size:13.5px; color:var(--ink); overflow-wrap:anywhere}
.tl{display:grid; position:relative}
.tl-item{display:grid; grid-template-columns:96px 28px minmax(0,1fr); gap:0 18px; position:relative; padding-bottom:30px}
.tl-item:last-child{padding-bottom:0}
.tl-item::before{content:""; position:absolute; left:calc(96px + 18px + 13px); top:28px; bottom:0; width:1px; background:var(--line-2)}
.tl-item:last-child::before{display:none}
.tl-date{font-size:12px; color:var(--muted); text-align:right; padding-top:5px; line-height:1.35}
.tl-date b{display:block; font-family:var(--f-display); font-weight:400; font-size:20px; color:var(--ink)}
.tl-dot{width:28px; height:28px; border-radius:50%; display:grid; place-items:center; border:1px solid var(--line-2); background:var(--surface); position:relative; z-index:1}
.tl-dot svg{width:13px; height:13px; stroke:var(--ink-2); fill:none; stroke-width:1.6}
.tl-item.trib .tl-dot{background:#14203A; border-color:#14203A} .tl-item.trib .tl-dot svg{stroke:#E8C96A}
.tl-item.nos .tl-dot{background:var(--gold-soft); border-color:var(--gold)} .tl-item.nos .tl-dot svg{stroke:var(--gold-ink)}
.tl-body{display:grid; gap:10px; min-width:0}
.tl-head{display:flex; gap:10px; flex-wrap:wrap; align-items:center}
.tl-head .k{font-family:var(--f-display); font-size:18px; color:var(--ink)}
.tl-src{font-size:10px; letter-spacing:.18em; text-transform:uppercase; color:var(--muted); font-weight:600}
.simples{font-family:var(--f-text); font-weight:300; font-size:16px; line-height:1.65; color:var(--ink); margin:0; max-width:66ch}
.acao{display:grid; grid-template-columns:auto minmax(0,1fr); gap:12px; padding:12px 16px; border-left:2px solid var(--gold-2); background:var(--gold-soft); border-radius:0 var(--r) var(--r) 0; font-size:13px; max-width:66ch}
.acao b{font-size:10px; letter-spacing:.18em; text-transform:uppercase; color:var(--gold-ink); padding-top:2px}
.acao.nada{border-left-color:var(--line-2); background:var(--surface-2)} .acao.nada b{color:var(--muted)}
details.oficial{border:1px solid var(--line); border-radius:var(--r); max-width:66ch}
details.oficial summary{cursor:pointer; padding:9px 14px; font-size:11.5px; color:var(--muted); letter-spacing:.04em; list-style:none; display:flex; gap:8px; align-items:center}
details.oficial summary::-webkit-details-marker{display:none}
details.oficial summary::before{content:"+"; font-family:var(--f-display); color:var(--gold-ink); font-size:15px; width:12px}
details.oficial[open] summary::before{content:"–"}
details.oficial .txt{padding:4px 16px 16px; font-family:ui-monospace,"Cascadia Mono",Consolas,monospace; font-size:11.5px; line-height:1.6; color:var(--ink-2); white-space:pre-wrap; overflow-wrap:anywhere}
.auto{display:inline-flex; gap:6px; align-items:center; font-size:11px; color:var(--muted)}
.auto i{width:6px; height:6px; border-radius:50%; background:var(--ok)}
.auto.pend i{background:var(--warn)}
.anexo{display:inline-flex; gap:8px; align-items:center; font-size:12.5px; padding:6px 12px; border:1px solid var(--line-2); border-radius:var(--r); width:max-content; max-width:100%}
.anexo svg{width:14px; height:14px; stroke:var(--gold-ink); fill:none; stroke-width:1.5; flex:none}
.check{display:flex; gap:10px; align-items:center; font-size:13px; cursor:pointer}
.check input{width:16px; height:16px; accent-color:#C9A84C}
.inbox{display:grid; grid-template-columns:minmax(0,1.6fr) minmax(0,1fr) minmax(0,1fr) auto; gap:18px; align-items:center; padding:18px 0; border-bottom:1px solid var(--line)}
.inbox:last-child{border-bottom:0}
.inbox .t{font-weight:500; overflow-wrap:anywhere}
.motivo{grid-column:1/-1; display:flex; gap:10px; flex-wrap:wrap; align-items:center}
.motivo .box{flex:1 1 260px; height:38px}
.devolvido{grid-column:1/-1; font-size:12.5px; color:var(--crit); background:var(--crit-soft); padding:8px 12px; border-radius:var(--r)}

.toast{position:fixed; right:max(28px, env(safe-area-inset-right,0px)); bottom:calc(28px + env(safe-area-inset-bottom,0px)); max-width:min(440px, calc(100vw - 32px)); background:#0D1424; color:#EDE9DE; padding:16px 20px; border-radius:var(--r); font-size:13px; border:1px solid #C9A84C66; box-shadow:0 24px 50px -10px #000a; z-index:30; line-height:1.5}
.notice{font-size:12px; color:var(--muted); border-top:1px solid var(--line); padding-top:16px; margin:0}
svg text{font-family:var(--f-ui)}
.ax{fill:var(--muted); font-size:10.5px; letter-spacing:.04em}
.gridl{stroke:var(--line); stroke-width:1}
.mobile-nav{display:none}

@media (max-width: 1100px){
  .figures{grid-template-columns:repeat(2,minmax(0,1fr))}
  .fig:nth-child(3){padding-left:0; border-left:0}
  .fig:nth-child(-n+2){border-bottom:1px solid var(--line)}
  .g-side,.g3,.docs{grid-template-columns:minmax(0,1fr)}
  .hero{grid-template-columns:auto minmax(0,1fr); padding:34px 32px}
  .hero .seal-lg{display:none}
  .school{grid-template-columns:56px minmax(0,1fr) 100px auto; gap:16px}
  .school .ph,.school .el{display:none}
  .sec-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .sec:not(:nth-child(3n+1)){padding-left:0; border-left:0}
  .sec:nth-child(2n){padding-left:26px; border-left:1px solid var(--line)}
}
@media (max-width: 820px){
  .login{grid-template-columns:minmax(0,1fr)}
  .login-brand{padding-block:40px; padding-left:max(20px, env(safe-area-inset-left,0px)); padding-right:max(20px, env(safe-area-inset-right,0px)); border-right:0; border-bottom:1px solid var(--line); gap:36px}
  .login-form{padding-left:max(20px, env(safe-area-inset-left,0px)); padding-right:max(20px, env(safe-area-inset-right,0px))}
  .app{grid-template-columns:minmax(0,1fr)}
  .side{display:none}
  .mobile-nav{display:flex; gap:4px; overflow-x:auto; padding-block:10px; padding-left:max(16px, env(safe-area-inset-left,0px)); padding-right:max(16px, env(safe-area-inset-right,0px)); background:#070B15; border-bottom:1px solid #1A2338}
  .mobile-nav button{all:unset; cursor:pointer; color:#A9AFBE; font-size:13px; padding:7px 12px; white-space:nowrap}
  .mobile-nav button[aria-current="page"]{color:#F3EFE4; box-shadow:inset 0 -1.5px 0 #E8C96A}
  .top,.content{padding-left:max(16px, env(safe-area-inset-left,0px)); padding-right:max(16px, env(safe-area-inset-right,0px))}
  .content{padding-block:28px 56px; gap:28px}
  .g2,.sec-grid,.figures{grid-template-columns:minmax(0,1fr)}
  .fig,.fig + .fig{padding-left:0; border-left:0; border-bottom:1px solid var(--line)}
  .fig:last-child{border-bottom:0}
  .sec,.sec:nth-child(2n){padding-left:0; border-left:0}
  .panel{padding:22px 18px}
  .tbl-wrap{margin:0 -18px; padding:0 18px}
  .hero{grid-template-columns:minmax(0,1fr); padding:28px 22px; gap:24px}
  .hero::after{left:22px; right:22px}
  .score .n{font-size:88px}
  .axis-row{grid-template-columns:100px minmax(0,1fr) 40px; gap:12px}
  .li{grid-template-columns:auto minmax(0,1fr)}
  .li > :last-child{grid-column:2; justify-self:start}
  .school{grid-template-columns:48px minmax(0,1fr) auto; gap:14px}
  .school .tr{display:none}
  .dossie-h,.dossie-b{padding-left:22px; padding-right:22px}
  .dfig{grid-template-columns:minmax(0,1fr)}
  .dfig div + div{padding-left:0; border-left:0; border-top:1px solid var(--line)}
  .pub-top,.pub-body{padding-left:20px; padding-right:20px}
  .pub-axes{grid-template-columns:repeat(2,minmax(0,1fr))}
  .pub-axes div + div{border-left:0}
  .pub-axes div{border-bottom:1px solid var(--line)}
  .proc-row{grid-template-columns:minmax(0,1fr) auto; gap:12px}
  .proc-row .ph2,.proc-row .last{display:none}
  .capa{grid-template-columns:minmax(0,1fr)}
  .capa div + div{padding-left:0; border-left:0; border-top:1px solid var(--line)}
  .tl-item{grid-template-columns:28px minmax(0,1fr); gap:0 14px}
  .tl-item::before{left:13px}
  .tl-date{grid-column:2; grid-row:1; text-align:left; padding:0 0 6px}
  .tl-date b{display:inline; font-size:16px; margin-right:6px}
  .tl-dot{grid-column:1; grid-row:1 / span 2}
  .tl-body{grid-column:2}
  .inbox{grid-template-columns:minmax(0,1fr)}
}
@media (min-width: 821px) and (max-width: 1100px){
  .proc-row{grid-template-columns:minmax(0,1.4fr) minmax(0,1fr) auto}
  .proc-row .last{display:none}
  .capa{grid-template-columns:repeat(2,minmax(0,1fr))}
  .capa div:nth-child(3){padding-left:0; border-left:0}
  .capa div:nth-child(-n+2){border-bottom:1px solid var(--line)}
  .inbox{grid-template-columns:minmax(0,1fr) auto}
  .inbox .hide-md{display:none}
}
@media (prefers-reduced-motion: reduce){*{transition:none!important; animation:none!important}}
