/* Chatnauta: Curso Chatnauta */
.pg-curso .doc-topo-in > .selo { margin-left: -6px; }
.curso { display: grid; grid-template-columns: 300px minmax(0, 1fr); gap: 34px; padding: 26px 0 80px; align-items: start; }
.curso-menu { position: sticky; top: 86px; max-height: calc(100vh - 106px); overflow-y: auto; padding-right: 6px; }
.curso-prog { background: var(--sup); border: 1px solid var(--linha); border-radius: 16px; padding: 14px 16px; margin-bottom: 14px; }
.titulo-prog { display: flex; justify-content: space-between; font-size: 0.92rem; }
.titulo-prog span { color: var(--lima); font-weight: 800; }
.mod { border-radius: 14px; margin-bottom: 4px; }
.mod summary { list-style: none; display: flex; align-items: center; gap: 10px; padding: 10px 12px; border-radius: 12px; cursor: pointer; font-weight: 700; font-size: 0.95rem; }
.mod summary::-webkit-details-marker { display: none; }
.mod summary:hover { background: var(--sup); }
.mod[open] summary { background: var(--sup); }
.mod-n { width: 26px; height: 26px; flex: none; border-radius: 50%; display: grid; place-items: center; background: var(--sup-3); color: var(--txt-2); font-size: 0.78rem; font-weight: 800; }
.mod.feito .mod-n { background: var(--lima); color: var(--lima-txt); }
.mod ul { list-style: none; margin: 4px 0 8px; padding: 0 0 0 22px; border-left: 2px solid var(--linha); margin-left: 24px; }
.mod li a { display: flex; align-items: flex-start; gap: 8px; padding: 7px 10px; border-radius: 10px; color: var(--txt-2); font-size: 0.9rem; line-height: 1.35; }
.mod li a:hover { background: var(--sup); text-decoration: none; color: var(--txt); }
.mod li a.atual { background: var(--sup-2); color: var(--txt); box-shadow: inset 3px 0 0 var(--lima); }
.mod li a.feita { color: var(--muted); }
.mod li a svg { color: var(--lima); flex: none; margin-top: 2px; }
.bol { width: 12px; height: 12px; flex: none; border-radius: 50%; border: 2px solid var(--linha-forte); margin-top: 3px; }
.curso-aula { max-width: 760px; outline: none; }
.aula-caminho { display: flex; justify-content: space-between; gap: 10px; flex-wrap: wrap; color: var(--muted); font-size: 0.85rem; font-weight: 600; margin: 0 0 10px; }
.aula-caminho span { display: inline-flex; align-items: center; gap: 6px; }
.aula-caminho svg { color: var(--lima); }
.curso-aula h1 { font-size: clamp(1.8rem, 4vw, 2.6rem); margin-bottom: 10px; }
.aula-obj { background: rgb(var(--roxo-rgb, 139 92 246) / 0.14); border: 1px solid rgb(var(--roxo-rgb, 139 92 246) / 0.35); border-radius: 14px; padding: 12px 16px; color: var(--txt-2); }
.leitor { display: flex; gap: 10px; align-items: center; flex-wrap: wrap; margin: 18px 0 26px; }
.aula-corpo p, .aula-corpo li { font-size: 1.06rem; line-height: 1.75; color: var(--txt-2); }
.aula-corpo b { color: var(--txt); }
.aula-corpo .passos-num li { padding-left: 42px; margin-bottom: 4px; }
.aula-corpo .passos-num li::before { width: 30px; height: 30px; line-height: 30px; top: 0; background: var(--lima); color: var(--lima-txt); }
[data-ler] { transition: background 240ms ease, box-shadow 240ms ease; border-radius: 12px; }
.lendo { background: rgb(var(--lima-rgb, 198 255 61) / 0.1); box-shadow: 0 0 0 8px rgb(var(--lima-rgb, 198 255 61) / 0.1); }
.caixa-aula { border-radius: 16px; padding: 14px 18px; margin: 18px 0; border: 1px solid; }
.caixa-aula b { display: flex; align-items: center; gap: 8px; font-family: var(--titulo); }
.caixa-aula p { margin: 6px 0 0; }
.caixa-aula.dica { background: rgb(var(--roxo-rgb, 139 92 246) / 0.12); border-color: rgb(var(--roxo-rgb, 139 92 246) / 0.4); }
.caixa-aula.dica svg { color: var(--roxo-2); }
.caixa-aula.erro { background: rgba(255, 197, 61, 0.08); border-color: rgba(255, 197, 61, 0.4); }
.caixa-aula.confere { background: rgba(61, 220, 132, 0.08); border-color: rgba(61, 220, 132, 0.4); }
.aula-fim { display: flex; justify-content: space-between; gap: 12px; flex-wrap: wrap; margin-top: 34px; padding-top: 22px; border-top: 1px solid var(--linha); }
.proxima-aula { display: grid; gap: 2px; margin-top: 18px; padding: 16px 18px; border-radius: 16px; background: var(--sup); border: 1px solid var(--linha); color: var(--txt); }
.proxima-aula:hover { border-color: var(--roxo-2); text-decoration: none; }
.parabens { display: flex; gap: 18px; align-items: center; padding: 20px; border-radius: var(--r-l); margin-bottom: 26px; background: linear-gradient(120deg, rgb(var(--lima-rgb, 198 255 61) / 0.18), rgb(var(--roxo-rgb, 139 92 246) / 0.22)); border: 1px solid var(--lima); animation: pula 500ms cubic-bezier(0.2, 1.6, 0.4, 1); }
.parabens h2 { margin: 0 0 4px; font-size: 1.4rem; }
.parabens p { margin: 0; }
.selo-curso { width: 70px; height: 70px; flex: none; border-radius: 50%; display: grid; place-items: center; background: var(--lima); color: var(--lima-txt); }
@keyframes pula { from { transform: scale(0.9); opacity: 0; } to { transform: none; opacity: 1; } }
/* desenhos */
.fig { margin: 22px 0; }
.fig-fluxo { display: grid; grid-template-columns: 1fr auto 1fr auto 1fr; gap: 10px; align-items: center; }
.fig-fluxo > div { display: grid; justify-items: center; text-align: center; gap: 4px; padding: 16px 10px; border-radius: 16px; background: var(--sup); border: 1px solid var(--linha); }
.fig-fluxo > div span { width: 52px; height: 52px; border-radius: 16px; display: grid; place-items: center; background: rgb(var(--lima-rgb, 198 255 61) / 0.12); color: var(--lima); }
.fig-fluxo small { color: var(--muted); font-size: 0.8rem; }
.fig-fluxo i { color: var(--muted); display: grid; }
.st-janela { border-radius: 14px; overflow: hidden; border: 1px solid var(--linha-forte); background: #16131f; }
.st-barra { display: flex; align-items: center; gap: 6px; padding: 8px 12px; background: #221d30; font-size: 0.8rem; color: var(--muted); }
.st-barra i { width: 10px; height: 10px; border-radius: 50%; background: #3a3350; }
.st-barra span { margin-left: 8px; }
.st-corpo { display: grid; grid-template-columns: 180px 1fr; min-height: 220px; }
.st-fontes { padding: 14px; border-right: 1px solid #2b2540; position: relative; font-size: 0.85rem; }
.st-mais { position: absolute; top: 10px; right: 12px; width: 26px; height: 26px; border-radius: 8px; background: var(--lima); color: var(--lima-txt); display: grid; place-items: center; font-weight: 800; }
.st-fontes ul { list-style: none; padding: 0; margin: 14px 0 0; display: grid; gap: 6px; }
.st-fontes li { padding: 7px 9px; border-radius: 8px; background: #221d30; color: var(--txt-2); font-size: 0.8rem; }
.st-fontes li.on { background: rgb(var(--lima-rgb, 198 255 61) / 0.16); color: var(--lima); font-weight: 700; outline: 1px dashed var(--lima); }
.st-tela { display: grid; place-items: center; padding: 14px; background: radial-gradient(circle, #2a2240, #120f1c); }
.st-celular { width: 100px; aspect-ratio: 9 / 16; border-radius: 12px; border: 2px dashed var(--lima); display: grid; place-content: center; text-align: center; color: var(--lima); font-weight: 800; }
.st-celular small { color: var(--muted); font-weight: 500; font-size: 0.7rem; }
.curso-menu-cel { display: none; }
@media (max-width: 960px) {
  .curso { grid-template-columns: minmax(0, 1fr); }
  .curso-menu { position: fixed; inset: 66px 0 0 0; z-index: 40; max-height: none; background: var(--bg); padding: 16px; transform: translateX(-100%); transition: transform 220ms ease; }
  .menu-aberto .curso-menu { transform: none; }
  .curso-menu-cel { display: inline-flex; align-items: center; gap: 8px; position: fixed; left: 16px; bottom: calc(16px + env(safe-area-inset-bottom)); z-index: 45; min-height: 48px; padding: 0 18px; border-radius: 999px; border: 0; background: var(--roxo); color: #fff; font: 700 0.95rem var(--fonte); box-shadow: 0 10px 30px rgb(var(--roxo-rgb, 139 92 246) / 0.45); }
  .fig-fluxo { grid-template-columns: 1fr; }
  .fig-fluxo i { transform: rotate(90deg); justify-self: center; }
  .st-corpo { grid-template-columns: 1fr; }
  .st-fontes { border-right: 0; border-bottom: 1px solid #2b2540; }
}

/* 10.0: trilhas, mini teste e certificado */
.trilhas { display: grid; gap: 6px; margin: 0 0 14px; }
.trilhas .rotulo { margin: 0; }
.trilha-ok { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; padding: 10px 12px; margin-bottom: 10px; border-radius: 12px; background: rgb(var(--lima-rgb, 122 108 255) / 0.14); border: 1px solid rgb(var(--lima-rgb, 122 108 255) / 0.4); }
.trilha-ok svg { color: var(--lima); }
.quiz { margin-top: 22px; padding: 18px; border-radius: 16px; background: var(--sup-2); border: 1px solid var(--linha); display: grid; gap: 14px; }
.quiz-tit { display: flex; align-items: center; gap: 8px; font-family: var(--titulo); }
.quiz-tit svg { color: var(--lima); }
.quiz-q p { margin: 0 0 8px; font-weight: 600; }
.quiz-ops { display: flex; flex-wrap: wrap; gap: 8px; }
.quiz-ops button { min-height: 40px; padding: 0 14px; border-radius: 10px; border: 1px solid var(--linha-forte); background: var(--bg-2); color: var(--txt); font: 600 0.92rem var(--fonte); cursor: pointer; transition: border-color var(--mov), background var(--mov); }
.quiz-ops button:hover:not(:disabled) { border-color: var(--lima); }
.quiz-ops button.certa { background: rgba(52, 211, 153, 0.18); border-color: var(--ok); color: var(--txt); }
.quiz-ops button.errada { background: rgba(251, 113, 133, 0.16); border-color: var(--erro); }
.quiz-ops button:disabled { cursor: default; }
.quiz-res { margin: 0; font-weight: 700; color: var(--txt) !important; }