/* =========================================================================
   SIMULADO PCMG  ·  /simulado
   Mesma gramática visual do diagnóstico: tela cheia, sem menu, tudo
   calculado no navegador. A diferença é que aqui a pessoa fica mais tempo,
   então o conforto de leitura importa mais que o impacto.
   ========================================================================= */
body{background:var(--ink);color:#f4f2ec}

.sm{max-width:50rem;margin-inline:auto;padding:0 18px 40px}
@media(min-width:700px){.sm{padding:0 24px 56px}}

/* ------------------------------------------------------------- abertura */
.sm-topo{position:relative;padding:46px 0 10px;text-align:center}
@media(min-width:700px){.sm-topo{padding:66px 0 14px}}
.sm-topo::before{
  content:"";position:absolute;left:50%;top:-24%;translate:-50% 0;z-index:-1;
  width:min(92vw,560px);aspect-ratio:1;border-radius:50%;
  background:#c9a25e;filter:blur(110px);opacity:.14;pointer-events:none;
}
.sm-chip{
  display:inline-block;margin-bottom:16px;
  font:500 10.5px/1 var(--mono);letter-spacing:.16em;text-transform:uppercase;
  color:var(--gold-lt);background:rgba(201,162,94,.13);
  border:1px solid rgba(201,162,94,.36);border-radius:999px;padding:9px 15px;
}
.sm-topo h1{font-size:clamp(28px,7vw,44px);letter-spacing:-.05em;line-height:1.08}
.sm-topo h1 em{font-style:normal;color:var(--gold-lt)}
.sm-lead{
  margin:16px auto 0;max-width:46ch;
  font-size:15.5px;line-height:1.7;color:rgba(244,242,237,.74);
}

.sm-num{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin-top:28px}
.sm-num div{
  border:1px solid rgba(255,255,255,.13);border-radius:14px;
  padding:15px 12px;text-align:center;background:rgba(255,255,255,.04);
}
.sm-num b{display:block;font-size:clamp(20px,5vw,26px);font-weight:800;letter-spacing:-.04em}
.sm-num small{
  display:block;margin-top:4px;font:500 10.5px/1.35 var(--mono);
  letter-spacing:.08em;text-transform:uppercase;color:rgba(244,242,237,.6);
}

.sm-fonte{
  margin-top:26px;padding:14px 16px;border-radius:12px;
  border:1px dashed rgba(255,255,255,.2);background:rgba(255,255,255,.03);
  font-size:12.5px;line-height:1.6;color:rgba(244,242,237,.6);text-align:left;
}
.sm-fonte b{color:rgba(244,242,237,.85);font-weight:700}

.sm-comecar{margin-top:26px;display:grid;gap:10px;justify-items:center}
.sm-comecar .btn{width:100%;max-width:400px;justify-content:center;border-radius:999px}
.sm-aviso{font-size:12.5px;line-height:1.55;color:rgba(244,242,237,.55);text-align:center}

/* ---------------------------------------------------------- a prova */
.sm-barra{
  position:sticky;top:0;z-index:40;margin:0 -18px 20px;padding:12px 18px;
  background:rgba(11,11,13,.93);backdrop-filter:blur(12px);
  -webkit-backdrop-filter:blur(12px);
  border-bottom:1px solid rgba(255,255,255,.1);
}
@media(min-width:700px){.sm-barra{margin:0 -24px 24px;padding:14px 24px}}
.sm-barra-topo{
  display:flex;align-items:center;justify-content:space-between;gap:14px;
  font:500 11px/1 var(--mono);letter-spacing:.08em;text-transform:uppercase;
  color:rgba(244,242,237,.7);
}
.sm-trilho{margin-top:9px;height:6px;border-radius:4px;background:rgba(255,255,255,.12);overflow:hidden}
.sm-trilho>div{height:100%;width:0;border-radius:4px;background:var(--gold);transition:width .35s var(--e)}

.sm-disc{
  display:inline-block;margin-bottom:14px;
  font:700 10.5px/1 var(--sans);letter-spacing:.12em;text-transform:uppercase;
  color:#171208;background:var(--gold);border-radius:999px;padding:8px 13px;
}
.sm-enun{
  font-size:16.5px;line-height:1.72;color:#f4f2ec;white-space:pre-line;
}
@media(min-width:700px){.sm-enun{font-size:17.5px}}

.sm-alts{display:grid;gap:10px;margin-top:22px}
.sm-alt{
  display:grid;grid-template-columns:34px 1fr;gap:13px;align-items:start;
  text-align:left;appearance:none;cursor:pointer;
  background:rgba(255,255,255,.045);
  border:1.5px solid rgba(255,255,255,.14);
  border-radius:14px;padding:15px 16px;
  font:500 15.5px/1.55 var(--sans);color:#f4f2ec;
  -webkit-tap-highlight-color:transparent;
  transition:border-color .2s var(--e),background .2s var(--e),transform .2s var(--e);
}
.sm-alt:hover{border-color:rgba(201,162,94,.5);background:rgba(255,255,255,.075)}
.sm-alt .letra{
  display:grid;place-items:center;width:34px;height:34px;border-radius:50%;
  background:rgba(255,255,255,.1);border:1px solid rgba(255,255,255,.16);
  font:800 14px/1 var(--sans);color:rgba(244,242,237,.85);
  transition:background .2s,color .2s,border-color .2s;
}
.sm-alt.marcada{border-color:var(--gold);background:rgba(201,162,94,.14)}
.sm-alt.marcada .letra{background:var(--gold);color:#171208;border-color:var(--gold)}

.sm-pe{
  display:flex;align-items:center;justify-content:space-between;gap:12px;
  margin-top:24px;padding-top:18px;border-top:1px solid rgba(255,255,255,.12);
  flex-wrap:wrap;
}
.sm-link{
  appearance:none;background:none;border:0;cursor:pointer;
  font:700 12.5px/1 var(--sans);letter-spacing:.02em;
  color:rgba(244,242,237,.62);padding:12px 0;
}
.sm-link:hover{color:#f4f2ec}
.sm-link.ativa{color:var(--gold-lt)}
.sm-nav{display:flex;gap:9px;margin-left:auto}
.sm-bt{
  appearance:none;cursor:pointer;border-radius:999px;
  font:800 13px/1 var(--sans);padding:14px 20px;border:1.5px solid rgba(255,255,255,.2);
  background:transparent;color:#f4f2ec;transition:background .2s,border-color .2s;
}
.sm-bt:hover{border-color:var(--gold);background:rgba(201,162,94,.14)}
.sm-bt--cheio{background:var(--gold);border-color:var(--gold);color:#171208}
.sm-bt--cheio:hover{background:var(--gold-lt);border-color:var(--gold-lt)}
.sm-bt:disabled{opacity:.35;pointer-events:none}

/* mapa de questões, para pular e ver o que falta */
.sm-mapa{display:grid;grid-template-columns:repeat(8,1fr);gap:7px;margin-top:22px}
@media(min-width:560px){.sm-mapa{grid-template-columns:repeat(12,1fr)}}
.sm-mapa button{
  appearance:none;cursor:pointer;aspect-ratio:1;border-radius:9px;
  background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.14);
  font:700 12px/1 var(--mono);color:rgba(244,242,237,.6);
  transition:background .18s,color .18s,border-color .18s;
}
.sm-mapa button.feita{background:rgba(201,162,94,.2);border-color:rgba(201,162,94,.5);color:var(--gold-lt)}
.sm-mapa button.revisar{border-color:#d08a3c;color:#e0a765}
.sm-mapa button.atual{outline:2px solid var(--gold);outline-offset:1px;color:#fff}

/* --------------------------------------------------------- análise */
.sm-analise{
  display:grid;gap:16px;justify-items:center;text-align:center;
  padding:clamp(40px,9vw,80px) 20px;
}
.sm-analise .ic{
  width:54px;height:54px;border-radius:50%;display:grid;place-items:center;
  border:2px solid var(--gold);color:var(--gold);animation:sm-gira 2.4s linear infinite;
}
@keyframes sm-gira{to{transform:rotate(360deg)}}
.sm-analise h2{font-size:clamp(21px,5vw,28px);letter-spacing:-.035em;line-height:1.2}
.sm-an-trilho{width:min(100%,26rem);height:7px;border-radius:5px;background:rgba(255,255,255,.14);overflow:hidden}
.sm-an-trilho>div{height:100%;width:0;border-radius:5px;background:var(--gold);transition:width .45s ease}
@media(prefers-reduced-motion:reduce){.sm-analise .ic{animation:none}}

/* ========================================================== o relatório */
.rel{display:grid;gap:0}
.rel-topo{
  position:relative;text-align:center;padding:44px 20px 34px;
  background:rgba(255,255,255,.04);border:1px solid rgba(255,255,255,.13);
  border-radius:22px;overflow:hidden;
}
.rel-topo::before{
  content:"";position:absolute;left:50%;top:-60%;translate:-50% 0;
  width:min(90vw,460px);aspect-ratio:1;border-radius:50%;
  background:#c9a25e;filter:blur(100px);opacity:.18;pointer-events:none;
}
.rel-lbl{
  position:relative;margin:0;font:500 10.5px/1 var(--mono);
  letter-spacing:.16em;text-transform:uppercase;color:var(--gold-lt);
}
.rel-nota{
  position:relative;margin:16px 0 0;font-weight:800;line-height:.9;
  letter-spacing:-.055em;font-size:clamp(66px,20vw,110px);color:#fff;
}
.rel-nota span{font-size:.38em;color:rgba(244,242,237,.55);letter-spacing:-.02em}
.rel-pct{position:relative;margin:12px 0 0;font-size:17px;font-weight:700;color:var(--gold-lt)}
.rel-frase{
  position:relative;margin:14px auto 0;max-width:44ch;
  font-size:15.5px;line-height:1.65;color:rgba(244,242,237,.78);
}

.rel-bloco{padding:34px 0 0}
.rel-bloco h2{font-size:clamp(20px,4.6vw,26px);letter-spacing:-.04em;line-height:1.18}
.rel-bloco > p{margin-top:10px;max-width:52ch;font-size:14.5px;line-height:1.7;color:rgba(244,242,237,.7)}

/* barras por disciplina */
.rel-barras{display:grid;gap:12px;margin-top:20px}
.rel-b .topo{
  display:flex;align-items:baseline;justify-content:space-between;gap:12px;
  font-size:14.5px;font-weight:700;color:rgba(244,242,237,.8);
}
.rel-b .topo b{font:700 13px/1 var(--mono);color:rgba(244,242,237,.6)}
.rel-b .trilho{margin-top:7px;height:9px;border-radius:5px;background:rgba(255,255,255,.1);overflow:hidden;display:flex}
.rel-b .trilho i{height:100%;width:0;transition:width .8s var(--e)}
.rel-b .trilho .ok{background:var(--gold)}
.rel-b .trilho .no{background:rgba(255,255,255,.14)}
.rel-b.zero .topo{color:#e0a765}

/* básicos x específicos */
.rel-duo{display:grid;gap:12px;margin-top:20px}
@media(min-width:560px){.rel-duo{grid-template-columns:1fr 1fr}}
.rel-duo div{
  border:1px solid rgba(255,255,255,.13);border-radius:16px;
  padding:18px;background:rgba(255,255,255,.04);
}
.rel-duo b{display:block;font-size:26px;font-weight:800;letter-spacing:-.04em}
.rel-duo span{display:block;margin-top:5px;font-size:13.5px;color:rgba(244,242,237,.68)}
.rel-duo small{display:block;margin-top:9px;font:500 11px/1.4 var(--mono);color:rgba(244,242,237,.5)}

/* as três mais fracas, ligadas às apostilas */
.rel-fracas{display:grid;gap:10px;margin-top:18px}
.rel-f{
  display:grid;grid-template-columns:44px 1fr;gap:14px;align-items:center;
  border:1px solid rgba(201,162,94,.34);border-radius:14px;padding:15px 16px;
  background:linear-gradient(168deg,rgba(201,162,94,.1),rgba(255,255,255,.03));
}
.rel-f .ap{
  display:grid;place-items:center;width:44px;height:44px;border-radius:12px;
  background:rgba(201,162,94,.18);border:1px solid rgba(201,162,94,.4);
  font:800 15px/1 var(--sans);color:var(--gold-lt);
}
.rel-f b{display:block;font-size:15.5px;font-weight:800;letter-spacing:-.025em;color:#fff}
.rel-f small{display:block;margin-top:3px;font-size:12.5px;color:rgba(244,242,237,.68)}

.rel-nota-peso{
  margin-top:18px;padding:14px 16px;border-radius:12px;
  background:rgba(255,255,255,.04);border:1px dashed rgba(255,255,255,.2);
  font-size:13px;line-height:1.6;color:rgba(244,242,237,.62);
}
.rel-nota-peso b{color:rgba(244,242,237,.88)}

/* revisão questão a questão */
.rev{display:grid;gap:9px;margin-top:18px}
.rev details{
  border:1px solid rgba(255,255,255,.13);border-radius:13px;
  background:rgba(255,255,255,.035);overflow:hidden;
}
.rev summary{
  list-style:none;cursor:pointer;display:grid;grid-template-columns:30px 1fr auto;
  gap:12px;align-items:center;padding:14px 15px;
}
.rev summary::-webkit-details-marker{display:none}
.rev .sinal{
  display:grid;place-items:center;width:30px;height:30px;border-radius:50%;
  font:800 14px/1 var(--sans);
}
.rev .certo .sinal{background:rgba(63,112,66,.3);color:#9ad49e;border:1px solid rgba(63,112,66,.55)}
.rev .errado .sinal{background:rgba(190,70,60,.22);color:#e8a39c;border:1px solid rgba(190,70,60,.5)}
.rev .vazio .sinal{background:rgba(255,255,255,.08);color:rgba(244,242,237,.55);border:1px solid rgba(255,255,255,.16)}
.rev .quem{font-size:14px;line-height:1.35;color:rgba(244,242,237,.8)}
.rev .quem b{display:block;color:#fff;font-weight:700}
.rev .seta{font-size:13px;color:rgba(244,242,237,.5);transition:transform .25s}
.rev details[open] .seta{transform:rotate(180deg)}
.rev .corpo{padding:0 15px 16px;border-top:1px solid rgba(255,255,255,.1)}
.rev .corpo p{margin-top:13px;font-size:14.5px;line-height:1.68;color:rgba(244,242,237,.78);white-space:pre-line}
.rev .alt{
  display:grid;grid-template-columns:26px 1fr;gap:10px;margin-top:9px;
  font-size:14px;line-height:1.5;color:rgba(244,242,237,.7);
}
.rev .alt .l{font:700 12px/1.5 var(--mono);color:rgba(244,242,237,.5)}
.rev .alt.gab{color:#9ad49e}
.rev .alt.gab .l{color:#9ad49e}
.rev .alt.sua{color:#e8a39c}
.rev .alt.sua .l{color:#e8a39c}
.rev .marca{
  margin-top:12px;font:500 11.5px/1.5 var(--mono);letter-spacing:.06em;
  text-transform:uppercase;color:rgba(244,242,237,.5);
}

/* oferta no fim */
.rel-oferta{
  margin-top:34px;padding:28px 22px;border-radius:22px;
  background:linear-gradient(168deg,rgba(201,162,94,.14),rgba(255,255,255,.035));
  border:1px solid rgba(201,162,94,.4);
}
@media(min-width:620px){.rel-oferta{padding:38px 34px}}
.rel-oferta h2{font-size:clamp(21px,5vw,29px);letter-spacing:-.04em;line-height:1.15}
.rel-oferta p{margin-top:13px;font-size:15px;line-height:1.7;color:rgba(244,242,237,.8)}
.rel-oferta .preco{
  margin-top:20px;display:flex;align-items:baseline;gap:12px;flex-wrap:wrap;
}
.rel-oferta .preco b{font-size:clamp(28px,7vw,38px);font-weight:800;letter-spacing:-.045em;color:#fff}
.rel-oferta .preco span{font-size:14.5px;color:rgba(244,242,237,.72)}
.rel-oferta .btn{margin-top:20px;width:100%;justify-content:center;border-radius:999px}
.rel-oferta .risco{margin-top:14px;font-size:12.5px;line-height:1.55;color:rgba(244,242,237,.6)}

.rel-acoes{display:flex;flex-wrap:wrap;gap:10px;justify-content:center;margin-top:26px}