/* ===========================================================================
   CIPA — Especificação Funcional · tema híbrido (hero escuro + leitura clara)
   =========================================================================== */
:root{
  /* hero (escuro) */
  --h-bg:#0b1020; --h-bg2:#0f1629; --h-ink:#e7ecf5; --h-muted:#95a3bd;
  --indigo:#6366f1; --cyan:#22d3ee; --green:#34d399; --gold:#f6c350;
  --slate:#64748b;
  /* corpo (claro) */
  --bg:#f4f2ee; --paper:#ffffff; --ink:#23211e; --muted:#6b6660;
  --line:#e7e3dc; --accent:#2f6f4f; --accent2:#9a6a00; --link:#2563eb;
}
*{box-sizing:border-box}
html,body{margin:0;padding:0}
body{background:var(--bg); color:var(--ink); font-family:Georgia,'Times New Roman',serif; line-height:1.72; font-size:18px;}

/* ----------------------------------- HERO --------------------------------- */
.hero{
  position:relative; overflow:hidden; color:var(--h-ink);
  background:radial-gradient(1200px 500px at 15% -20%, #1b2550 0%, transparent 60%),
             radial-gradient(900px 450px at 95% 0%, #0c3a45 0%, transparent 55%),
             linear-gradient(180deg, var(--h-bg2), var(--h-bg));
  border-bottom:1px solid rgba(255,255,255,.07);
}
.hero-inner{max-width:880px; margin:0 auto; padding:30px 26px 0;}
.status{
  display:inline-flex; align-items:center; gap:10px;
  font-family:-apple-system,'Segoe UI',Roboto,sans-serif; font-size:12.5px; font-weight:700;
  letter-spacing:.14em; text-transform:uppercase;
  padding:7px 14px 7px 12px; border-radius:999px;
  background:rgba(255,255,255,.05); border:1px solid rgba(255,255,255,.10);
}
.dot{width:10px; height:10px; border-radius:50%; background:var(--slate); flex:none;}
.dot.live{background:var(--green); animation:pulse 2s infinite;}
.dot.cold{background:var(--slate);}
.status.live{color:#a7f3d0; border-color:rgba(52,211,153,.35); background:rgba(52,211,153,.08);}
.status.cold{color:var(--h-muted);}
@keyframes pulse{
  0%{box-shadow:0 0 0 0 rgba(52,211,153,.65);}
  70%{box-shadow:0 0 0 12px rgba(52,211,153,0);}
  100%{box-shadow:0 0 0 0 rgba(52,211,153,0);}
}
.hero-title{
  font-family:-apple-system,'Segoe UI',Roboto,sans-serif; font-weight:800;
  font-size:34px; line-height:1.15; letter-spacing:-.02em; margin:16px 0 6px;
}
.hero-title .accent{
  background:linear-gradient(90deg,var(--indigo),var(--cyan));
  -webkit-background-clip:text; background-clip:text; -webkit-text-fill-color:transparent;
}
.hero-sub{font-family:-apple-system,'Segoe UI',sans-serif; font-size:14.5px; color:var(--h-muted); margin:0 0 18px;}
.hero-sub b{color:var(--h-ink); font-weight:600;}

/* progresso */
.progress{max-width:520px; margin:0 0 18px;}
.progress-head{
  display:flex; justify-content:space-between; align-items:baseline;
  font-family:-apple-system,'Segoe UI',sans-serif; font-size:13px; color:var(--h-muted); margin-bottom:7px;
}
.progress-head b{color:var(--h-ink); font-weight:700;}
.progress-head .pct{font-size:15px; color:var(--cyan); font-weight:800;}
.bar{height:9px; border-radius:999px; background:rgba(255,255,255,.08); overflow:hidden;}
.bar-fill{height:100%; width:0; border-radius:999px;
  background:linear-gradient(90deg,var(--indigo),var(--cyan)); transition:width 1.1s cubic-bezier(.2,.8,.2,1);}

/* chips */
.chips{display:flex; flex-wrap:wrap; gap:9px; margin:0 0 22px; font-family:-apple-system,'Segoe UI',sans-serif;}
.chip{
  display:inline-flex; align-items:center; gap:7px; font-size:12.5px; color:var(--h-muted);
  background:rgba(255,255,255,.04); border:1px solid rgba(255,255,255,.09);
  padding:6px 12px; border-radius:10px;
}
.chip b{color:var(--h-ink); font-weight:700; font-size:13.5px;}
.chip .ic{font-size:14px; line-height:1;}

/* abas */
.tabs{display:flex; gap:4px; margin-top:6px;}
.tab{
  appearance:none; cursor:pointer; border:none; background:transparent;
  font-family:-apple-system,'Segoe UI',sans-serif; font-size:14px; font-weight:600;
  color:var(--h-muted); padding:12px 16px; border-bottom:2.5px solid transparent;
  transition:color .15s, border-color .15s;
}
.tab:hover{color:var(--h-ink);}
.tab.is-active{color:#fff; border-bottom-color:var(--cyan);}
.tabbar{display:flex; justify-content:space-between; align-items:center; flex-wrap:wrap; gap:10px;}
.painel-link{
  display:inline-flex; align-items:center; gap:7px; text-decoration:none; white-space:nowrap;
  font-family:-apple-system,'Segoe UI',Roboto,sans-serif; font-size:13px; font-weight:600;
  color:#cdd6f4; background:rgba(99,102,241,.18); border:1px solid rgba(99,102,241,.45);
  padding:8px 14px; border-radius:9px; transition:background .15s, border-color .15s, color .15s;
}
.painel-link:hover{background:rgba(99,102,241,.32); border-color:var(--cyan); color:#fff;}

/* ----------------------------------- CORPO -------------------------------- */
.wrap{max-width:880px; margin:0 auto; padding:30px 26px 90px;}
.panel{display:none; animation:fade .35s ease;}
.panel.is-active{display:block;}
@keyframes fade{from{opacity:0; transform:translateY(6px);} to{opacity:1; transform:none;}}

.paper{
  background:var(--paper); border:1px solid var(--line); border-radius:16px;
  padding:46px 52px; box-shadow:0 1px 3px rgba(0,0,0,.05);
}
.paper h1{font-size:30px; line-height:1.25; margin:.1em 0 .5em; letter-spacing:-.01em;}
.paper h2{font-size:23px; margin:1.9em 0 .5em; padding-top:.55em; border-top:1px solid var(--line); color:#1b1916;}
.paper h2:first-of-type{border-top:none;}
.paper h3{font-size:18.5px; margin:1.4em 0 .3em; color:#332f2a; font-family:-apple-system,'Segoe UI',sans-serif;}
.paper p{margin:.75em 0;}
.paper a{color:var(--link); text-decoration:none;} .paper a:hover{text-decoration:underline;}
.paper strong{color:#171513;}
.paper ul,.paper ol{padding-left:1.3em;} .paper li{margin:.32em 0;}
.paper hr{border:none; border-top:1px solid var(--line); margin:2.2em 0;}
.paper code{background:#f1efe9; padding:.1em .4em; border-radius:5px; font-size:.86em; font-family:ui-monospace,Menlo,monospace; color:#5a534a;}
.paper blockquote{margin:1.1em 0; padding:.7em 1.1em; border-radius:10px; background:#f4f7f4; border-left:4px solid var(--accent); font-size:.95em; color:#33433a;}
.paper blockquote em{color:var(--muted);}
.paper blockquote p{margin:.35em 0;}
.paper > blockquote:first-of-type{background:#fbf7ee; border-left-color:var(--accent2);}
.paper table{border-collapse:collapse; width:100%; margin:1em 0; font-size:.9em;}
.paper th,.paper td{border:1px solid var(--line); padding:8px 11px; text-align:left;}
.paper th{background:#f4f2ec;}

/* ------------------------------- HISTÓRICO -------------------------------- */
.hist{
  background:var(--paper); border:1px solid var(--line); border-radius:16px;
  padding:38px 44px; box-shadow:0 1px 3px rgba(0,0,0,.05);
}
.hist-title{font-family:-apple-system,'Segoe UI',sans-serif; font-size:22px; font-weight:800; letter-spacing:-.01em; margin:0 0 4px; color:#1b1916;}
.hist-lead{font-family:-apple-system,'Segoe UI',sans-serif; font-size:14px; color:var(--muted); margin:0 0 26px;}
.timeline{position:relative; margin:0; padding:0 0 0 26px; list-style:none;}
.timeline::before{content:""; position:absolute; left:6px; top:6px; bottom:6px; width:2px;
  background:linear-gradient(180deg,var(--indigo),var(--cyan) 60%,var(--line));}
.tl-item{position:relative; padding:0 0 24px 8px;}
.tl-item:last-child{padding-bottom:2px;}
.tl-dot{position:absolute; left:-26px; top:3px; width:14px; height:14px; border-radius:50%;
  background:var(--slate); border:3px solid var(--paper); box-shadow:0 0 0 1px var(--line);}
.tl-head{font-family:-apple-system,'Segoe UI',sans-serif; display:flex; flex-wrap:wrap; align-items:baseline; gap:10px;}
.tl-when{font-size:12.5px; font-weight:700; color:var(--muted); font-variant-numeric:tabular-nums;}
.tl-phase{font-size:11px; font-weight:700; text-transform:uppercase; letter-spacing:.06em; color:var(--indigo);
  background:#eef0fe; border-radius:6px; padding:2px 7px;}
.tl-title{font-family:-apple-system,'Segoe UI',sans-serif; font-weight:700; font-size:15.5px; color:#1b1916; margin:5px 0 2px;}
.tl-detail{font-family:-apple-system,'Segoe UI',sans-serif; font-size:13.5px; color:var(--muted); line-height:1.6;}

/* commits expansível */
.commits{margin-top:30px; border-top:1px solid var(--line); padding-top:8px;}
.commits summary{cursor:pointer; font-family:-apple-system,'Segoe UI',sans-serif; font-weight:700; font-size:14px; color:#332f2a; padding:12px 2px; list-style:none;}
.commits summary::-webkit-details-marker{display:none;}
.commits summary::before{content:"▸ "; color:var(--muted);}
.commits[open] summary::before{content:"▾ ";}
.commit{display:flex; gap:12px; align-items:baseline; font-family:ui-monospace,Menlo,monospace; font-size:12.5px; padding:5px 2px; border-top:1px dashed var(--line);}
.commit .h{color:var(--accent2); font-weight:700;}
.commit .d{color:var(--muted); white-space:nowrap;}
.commit .s{color:#3a352e;}

/* rodapé */
.foot{max-width:880px; margin:0 auto; padding:0 26px 50px; font-family:-apple-system,'Segoe UI',sans-serif; font-size:12.5px; color:var(--muted);}
.foot a{color:var(--link); text-decoration:none;}

.loading{font-family:-apple-system,'Segoe UI',sans-serif; color:var(--muted); padding:50px; text-align:center;}

@media (max-width:640px){
  body{font-size:17px;}
  .hero-title{font-size:27px;}
  .paper{padding:30px 24px;}
  .hist{padding:28px 22px;}
  .tab{padding:11px 10px; font-size:13px;}
}