:root{
  --bg:#f7f5f0;
  --card:#ffffff;
  --ink:#26241f;
  --ink-soft:#6b6459;
  --line:#e7e1d5;
  --brand:#1c2b45;
  --brand-dark:#121c30;
  --brand-soft:#eef1f6;
  --gold:#b3874f;
  --gold-soft:#f6ede0;
  --ok:#1e7d4f;
  --ok-bg:#e8f6ee;
  --bad:#a8332b;
  --bad-bg:#fbeae8;
  --warn:#8a5a00;
  --warn-bg:#fdf3e3;
  --radius:18px;
  --serif: Georgia, "Iowan Old Style", "Palatino Linotype", "Times New Roman", serif;
  font-family:-apple-system,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;
}
*{box-sizing:border-box;}
body{
  margin:0;
  background:var(--bg);
  color:var(--ink);
  line-height:1.6;
}

nav.top{
  background:var(--brand);
  color:#fff;
  padding:18px 26px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  flex-wrap:wrap;
  gap:10px;
  border-bottom:3px solid var(--gold);
}
nav.top .brand{
  font-family:var(--serif);
  font-weight:700;
  font-size:1.22rem;
  letter-spacing:.02em;
  display:flex; align-items:center; gap:10px;
}
nav.top .brand .marca-icone{ font-size:1.15rem; color:var(--gold); }
nav.top .brand .marca-sub{
  display:block; font-family:-apple-system,"Segoe UI",sans-serif; font-weight:400;
  font-size:.68rem; letter-spacing:.09em; text-transform:uppercase; color:#c7cedb; margin-top:2px;
}
nav.top .links{
  display:flex; gap:6px; align-items:center;
}
nav.top .links a{
  color:#e7eaf1;
  text-decoration:none;
  padding:8px 16px;
  border-radius:999px;
  font-size:.86rem;
  font-weight:600;
  letter-spacing:.01em;
  opacity:.85;
  transition:background .15s, opacity .15s, color .15s;
}
nav.top .links a:hover{
  background:rgba(255,255,255,.10);
  opacity:1;
}
nav.top .links a.active{
  background:var(--gold);
  color:var(--brand-dark);
  opacity:1;
}
.wrap{
  max-width:840px;
  margin:0 auto;
  padding:32px 18px 64px;
}

.card{
  background:var(--card);
  border-radius:var(--radius);
  box-shadow:0 10px 30px rgba(28,43,69,.07), 0 1px 2px rgba(28,43,69,.05);
  padding:28px 26px;
  margin-bottom:20px;
  border:1px solid rgba(28,43,69,.04);
}
.card.destaque{
  border-top:3px solid var(--gold);
}

h1{ font-family:var(--serif); font-size:1.5rem; font-weight:700; margin:0 0 8px; color:var(--brand); }
h2{ font-family:var(--serif); font-size:1.18rem; font-weight:700; margin:0 0 16px; color:var(--brand); }
p.sub{ color:var(--ink-soft); margin:0 0 18px; font-size:.93rem; }

.stat-grid{
  display:grid;
  grid-template-columns:repeat(auto-fit, minmax(150px, 1fr));
  gap:14px;
  margin-bottom:8px;
}
.stat{
  background:var(--brand-soft);
  border-radius:14px;
  padding:18px 16px;
  text-align:center;
}
.stat .num{ font-family:var(--serif); font-size:1.8rem; font-weight:700; color:var(--brand); }
.stat .label{ font-size:.78rem; color:var(--ink-soft); margin-top:4px; }

button.primary{
  background:var(--brand);
  color:#fff;
  border:none;
  padding:13px 28px;
  border-radius:999px;
  font-weight:700;
  font-size:.95rem;
  letter-spacing:.01em;
  cursor:pointer;
  transition:background .15s, transform .1s;
}
button.primary:hover{ background:var(--brand-dark); }
button.primary:active{ transform:translateY(1px); }
button.primary:disabled{ opacity:.4; cursor:not-allowed; }

button.ghost{
  background:none;
  border:1.5px solid var(--line);
  padding:10px 20px;
  border-radius:999px;
  font-weight:600;
  font-size:.88rem;
  cursor:pointer;
  color:var(--ink-soft);
  transition:border-color .15s, color .15s;
}
button.ghost:hover{ border-color:var(--brand); color:var(--brand); }
button.ghost:disabled{ opacity:.35; cursor:not-allowed; }

button.link-sutil{
  background:none;
  border:none;
  padding:6px 4px;
  font-size:.8rem;
  font-weight:600;
  color:var(--ink-soft);
  cursor:pointer;
  text-decoration:underline;
  text-underline-offset:3px;
  transition:color .15s;
}
button.link-sutil:hover{ color:var(--bad); }

a.button-link{
  display:inline-block;
  text-decoration:none;
}

.tag-row{ display:flex; gap:8px; flex-wrap:wrap; margin-bottom:14px; align-items:center; justify-content:space-between; }
.tag-row .tag-esquerda{ display:flex; gap:8px; flex-wrap:wrap; }
.tag{
  font-size:.72rem;
  text-transform:uppercase;
  letter-spacing:.04em;
  padding:5px 12px;
  border-radius:999px;
  background:var(--brand-soft);
  color:var(--brand);
  font-weight:700;
}
.tag.formato-c{ background:var(--warn-bg); color:var(--warn); }
.tag.formato-a{ background:#eef0f2; color:#495a70; }

.enunciado{ white-space:pre-line; margin-bottom:18px; font-size:1.03rem; }

.options{ display:flex; flex-direction:column; gap:10px; margin-bottom:18px; }
.opt{
  display:flex; align-items:flex-start; gap:12px;
  padding:13px 15px; border:1.5px solid var(--line); border-radius:12px;
  cursor:pointer; transition:border-color .15s, background .15s;
}
.opt:hover{ border-color:var(--gold); }
.opt.selected{ border-color:var(--brand); background:var(--brand-soft); }
.opt.correct{ border-color:var(--ok); background:var(--ok-bg); }
.opt.incorrect{ border-color:var(--bad); background:var(--bad-bg); }
.opt.disabled{ cursor:default; }
.opt .letter{
  flex:0 0 auto; width:27px; height:27px; border-radius:50%;
  border:1.5px solid var(--line); display:flex; align-items:center; justify-content:center;
  font-size:.82rem; font-weight:700; color:var(--ink-soft);
}
.opt.selected .letter{ border-color:var(--brand); color:var(--brand); }
.opt.correct .letter{ border-color:var(--ok); color:var(--ok); background:#fff; }
.opt.incorrect .letter{ border-color:var(--bad); color:var(--bad); background:#fff; }
.opt .text{ font-size:.95rem; }

.ce-row{ display:flex; gap:12px; margin-bottom:18px; }
.ce-btn{
  flex:1; padding:17px; text-align:center; border:1.5px solid var(--line); border-radius:12px;
  cursor:pointer; font-weight:700; font-size:1rem; color:var(--ink-soft);
  transition:border-color .15s, background .15s;
}
.ce-btn:hover{ border-color:var(--gold); }
.ce-btn.selected{ border-color:var(--brand); background:var(--brand-soft); color:var(--brand); }
.ce-btn.correct{ border-color:var(--ok); background:var(--ok-bg); color:var(--ok); }
.ce-btn.incorrect{ border-color:var(--bad); background:var(--bad-bg); color:var(--bad); }

.actions{ display:flex; justify-content:space-between; align-items:center; gap:10px; flex-wrap:wrap; }

.feedback{ margin-top:18px; padding:17px 19px; border-radius:12px; font-size:.93rem; }
.feedback.ok{ background:var(--ok-bg); border:1px solid #b7e2c9; }
.feedback.bad{ background:var(--bad-bg); border:1px solid #f0c4bd; }
.feedback .veredito{ font-weight:700; margin-bottom:6px; display:flex; align-items:center; gap:6px; }
.feedback.ok .veredito{ color:var(--ok); }
.feedback.bad .veredito{ color:var(--bad); }
.feedback .comentario{ color:var(--ink); white-space:pre-line; }

.fonte-line{
  font-size:.78rem; color:var(--ink-soft); margin-top:14px; padding-top:10px; border-top:1px dashed var(--line);
}

.progress-bar{ background:var(--line); border-radius:999px; height:8px; overflow:hidden; margin-bottom:10px; }
.progress-fill{ background:var(--gold); height:100%; width:0%; transition:width .3s ease; }
.meta-row{ display:flex; justify-content:space-between; align-items:center; color:var(--ink-soft); font-size:.85rem; margin-bottom:6px; }

.summary-list{ margin-top:18px; display:flex; flex-direction:column; gap:8px; }
.summary-item{
  display:flex; justify-content:space-between; align-items:center;
  padding:11px 15px; border-radius:12px; border:1px solid var(--line);
  font-size:.88rem; cursor:pointer;
  transition:border-color .15s;
}
.summary-item:hover{ border-color:var(--gold); }
.summary-item .status{ font-weight:700; }
.summary-item.ok .status{ color:var(--ok); }
.summary-item.bad .status{ color:var(--bad); }

.chart-block{ margin-bottom:26px; }
.chart-block h3{ font-family:var(--serif); font-size:1rem; font-weight:700; margin:0 0 4px; color:var(--brand); }
.chart-block .chart-sub{ font-size:.78rem; color:var(--ink-soft); margin:0 0 14px; }
.bar-row{ display:flex; align-items:center; gap:10px; margin-bottom:8px; }
.bar-row .bar-label{ flex:0 0 210px; font-size:.8rem; color:var(--ink-soft); text-align:right; line-height:1.25; }
.bar-row .bar-track{ flex:1; background:var(--bg); border-radius:3px; height:16px; overflow:hidden; position:relative; }
.bar-row .bar-fill{
  height:100%;
  border-radius:0 4px 4px 0;
  margin-right:2px;
}
.bar-row .bar-fill.good{ background:#0ca30c; }
.bar-row .bar-fill.warning{ background:#c98c1f; }
.bar-row .bar-fill.critical{ background:#b3403a; }
.bar-row .bar-value{ flex:0 0 44px; font-size:.8rem; font-weight:700; color:var(--ink-soft); }

.trend-svg{ width:100%; height:auto; display:block; }
.trend-svg .grid-line{ stroke:var(--line); stroke-width:1; }
.trend-svg .trend-path{ fill:none; stroke:var(--brand); stroke-width:2; stroke-linejoin:round; stroke-linecap:round; }
.trend-svg .trend-dot{ fill:var(--gold); stroke:var(--card); stroke-width:2; }
.trend-svg .axis-label{ fill:var(--ink-soft); font-size:10px; }
.trend-svg .end-label{ fill:var(--brand); font-size:11px; font-weight:700; }

.legenda-status{ display:flex; gap:16px; flex-wrap:wrap; margin:6px 0 18px; font-size:.78rem; color:var(--ink-soft); }
.legenda-status span{ display:inline-flex; align-items:center; gap:6px; }
.legenda-status i{ width:10px; height:10px; border-radius:3px; display:inline-block; }

.arquivadas-lista{ display:flex; flex-direction:column; gap:8px; margin-top:14px; }
.arquivada-item{
  display:flex; justify-content:space-between; align-items:center; gap:14px;
  padding:12px 15px; border-radius:12px; border:1px solid var(--line); font-size:.85rem;
}
.arquivada-item .arquivada-texto{ color:var(--ink-soft); }
.arquivada-item .arquivada-tag{ font-size:.7rem; color:var(--brand); font-weight:700; text-transform:uppercase; letter-spacing:.03em; }

.empty-state{
  text-align:center; padding:30px 10px; color:var(--ink-soft); font-size:.92rem;
}

.hidden{ display:none !important; }

footer{ text-align:center; color:var(--ink-soft); font-size:.78rem; padding:22px 0 44px; }