:root{
  --page:#18213f;--page-deep:#0e1429;--paper:#f1ead9;--paper-2:#faf6ec;
  --ink:#272317;--muted:#665f4d;--line:#d8ccb0;--gold:#aa873f;--red:#822e2e;
  --green:#315b50;--sky:#aebbd1;--white:#fffdf8;--focus:#f6ce65;
  --r-sm:.5rem;--r-md:.85rem;--r-lg:1.3rem;--shadow:0 28px 70px rgba(0,0,0,.28);
}
*{box-sizing:border-box}html{color-scheme:dark;scroll-behavior:smooth}
body{margin:0;min-height:100vh;min-height:100dvh;background:
radial-gradient(circle at 50% -10%,#2c396d 0,transparent 40rem),
linear-gradient(180deg,var(--page),var(--page-deep));color:var(--white);
font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif}
button,input,textarea{font:inherit}button{cursor:pointer}button:disabled{cursor:not-allowed}
[hidden]{display:none!important}
:focus-visible{outline:3px solid var(--focus);outline-offset:3px}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.skip-link{position:fixed;z-index:1000;left:1rem;top:1rem;transform:translateY(-160%);padding:.75rem 1rem;background:var(--paper);color:var(--ink);border-radius:var(--r-sm)}
.skip-link:focus{transform:none}
.site-header{width:min(76rem,calc(100% - 2rem));margin:auto;min-height:5rem;display:flex;align-items:center;justify-content:space-between;gap:1rem}
.brand{display:flex;align-items:center;gap:.7rem;color:var(--white);text-decoration:none}
.brand-mark{display:grid;place-items:center;width:2.2rem;height:2.2rem;border:1px solid rgba(255,255,255,.22);border-radius:50%;color:var(--gold)}
.brand strong,.brand small{display:block}.brand strong{font-family:Georgia,serif;font-size:1.05rem}.brand small{color:var(--sky);font-size:.7rem;text-transform:uppercase;letter-spacing:.12em}
.header-btn,.text-btn{border:0;background:transparent;color:var(--sky);padding:.65rem;text-decoration:underline;text-underline-offset:.25rem}
.shell{width:min(76rem,calc(100% - 2rem));margin:0 auto;padding:clamp(1.5rem,4vw,4.5rem) 0 5rem}
.view[hidden]{display:none}
.hero{display:grid;grid-template-columns:minmax(0,1.2fr) minmax(19rem,.8fr);gap:clamp(2rem,7vw,6rem);align-items:center;min-height:calc(100dvh - 10rem)}
.eyebrow{margin:0 0 1rem;color:#d2b66f;font-size:.72rem;line-height:1.3;text-transform:uppercase;letter-spacing:.17em;font-weight:800}
.eyebrow.dark{color:var(--red)}
.hero h1,.panel h1{font-family:Georgia,"Times New Roman",serif;font-weight:500;letter-spacing:-.035em;line-height:.98;margin:0}
.hero h1{font-size:clamp(2.8rem,7vw,6.4rem)}.hero h1 em,.panel h1 em{color:#d7b464;font-weight:500}
.hero-lead{max-width:43rem;color:#d3d9e6;font-size:clamp(1.05rem,2vw,1.25rem);line-height:1.7;margin:1.7rem 0}
.hero-actions,.form-actions{display:flex;gap:.75rem;flex-wrap:wrap}.quiet{font-size:.82rem;color:var(--sky);max-width:34rem;line-height:1.6;margin-top:1.25rem}
.btn{min-height:3rem;border-radius:var(--r-sm);padding:.75rem 1.15rem;border:1px solid transparent;font-weight:750;transition:transform .15s ease,filter .15s ease,background .15s ease}
.btn:hover{transform:translateY(-1px)}.btn.primary{background:linear-gradient(135deg,#b99649,#8e6a28);color:#171203}
.btn.secondary{background:rgba(255,255,255,.04);border-color:rgba(255,255,255,.25);color:var(--white)}
.btn.dark-border{border-color:#bcb092;color:var(--ink);background:transparent}
.formation-card,.panel,.question-card{background:var(--paper);color:var(--ink);box-shadow:var(--shadow)}
.formation-card{border-radius:var(--r-lg);padding:clamp(1.4rem,4vw,2.4rem)}
.formation-card h2{font-family:Georgia,serif;font-size:clamp(1.7rem,3vw,2.3rem);line-height:1.08;margin:0 0 1.5rem}
.movement-list{list-style:none;padding:0;margin:0;display:grid;gap:.25rem}
.movement-list li{display:flex;align-items:center;gap:1rem;padding:.85rem 0;border-top:1px solid var(--line)}
.movement-list li>span{font-size:.68rem;color:var(--red);font-weight:800;letter-spacing:.1em}
.movement-list strong,.movement-list small{display:block}.movement-list small{color:var(--muted);margin-top:.15rem}
.panel{border-radius:var(--r-lg);padding:clamp(1.4rem,5vw,3.5rem);max-width:60rem;margin:auto}
.panel-heading{max-width:45rem}.panel h1{font-size:clamp(2.2rem,5vw,4rem)}.panel-heading>p:last-child{color:var(--muted);line-height:1.65}
.setup-grid{display:grid;grid-template-columns:1fr 1fr;gap:1.5rem;margin-top:2rem}.full{grid-column:1/-1}
.choice-group{border:0;padding:0;margin:0;display:grid;gap:.65rem}.choice-group legend{font-weight:800;margin-bottom:.7rem}
.choice-card{display:flex;align-items:flex-start;gap:.8rem;border:1px solid var(--line);border-radius:var(--r-md);padding:1rem;background:var(--paper-2);cursor:pointer}
.choice-card:has(input:checked){border-color:var(--gold);box-shadow:0 0 0 2px rgba(170,135,63,.18)}
.choice-card input{margin-top:.2rem;accent-color:var(--red)}.choice-card strong,.choice-card small{display:block}.choice-card small{color:var(--muted);margin-top:.2rem;line-height:1.45}
.segmented{display:flex;gap:.55rem;flex-wrap:wrap}.segmented label{cursor:pointer}.segmented input{position:absolute;opacity:0}.segmented span{display:block;border:1px solid var(--line);border-radius:999px;padding:.7rem .9rem;background:var(--paper-2);font-size:.85rem}
.segmented input:checked+span{background:var(--gold);border-color:var(--gold);color:#171203;font-weight:800}
.field-note{color:var(--muted);font-size:.82rem;line-height:1.5}
.game-view{max-width:54rem;margin:auto}.game-meta{display:flex;justify-content:space-between;align-items:end;gap:1rem}.position{margin:0;font-weight:800}
.progress{height:.32rem;background:rgba(255,255,255,.14);border-radius:999px;overflow:hidden;margin:1rem 0 1.3rem}.progress span{display:block;height:100%;width:0;background:linear-gradient(90deg,var(--gold),#c76559);transition:width .25s}
.question-card{border-radius:var(--r-lg);padding:clamp(1.3rem,5vw,3.2rem);position:relative;overflow:hidden}
.question-card:before{content:"";position:absolute;inset:0 auto auto 2rem;width:calc(100% - 4rem);height:1px;background:var(--line)}
.card-kicker{display:flex;justify-content:space-between;color:var(--muted);font-size:.7rem;text-transform:uppercase;letter-spacing:.12em;font-weight:800}
.movement-heading{display:flex;gap:.85rem;align-items:flex-start;margin:1.6rem 0}.movement-heading>span{color:var(--red);font-size:.7rem;font-weight:900;letter-spacing:.1em;padding-top:.18rem}
.movement-heading small,.movement-heading strong{display:block}.movement-heading small{text-transform:uppercase;letter-spacing:.12em;color:var(--red);font-weight:800;font-size:.66rem}.movement-heading strong{font-family:Georgia,serif;font-size:1.15rem;margin-top:.18rem}
.movement-heading.compact{margin:0 0 .8rem}.movement-heading.compact strong{font-size:1rem}
#card-title{font-family:Georgia,serif;font-style:italic;font-size:clamp(1.9rem,4.5vw,3rem);line-height:1.25;margin:1.2rem 0;color:var(--ink)}
.citation{font-family:ui-monospace,SFMono-Regular,Menlo,monospace;color:var(--muted);font-size:.8rem}
.answer-fieldset{border:0;padding:0;margin:2rem 0 0}.answer-fieldset legend{font-weight:800;margin-bottom:1rem}
.answers{display:grid;grid-template-columns:1fr 1fr;gap:.7rem}.answer-btn{min-height:3.4rem;text-align:left;border:1px solid #cbbf9f;background:var(--paper-2);border-radius:var(--r-sm);padding:.85rem 1rem;color:var(--ink)}
.answer-btn:hover{border-color:var(--red)}.answer-btn[aria-pressed=true]{border-color:var(--gold);box-shadow:0 0 0 2px rgba(170,135,63,.2)}
.answer-btn.correct{background:#e4eee8;border-color:var(--green);font-weight:800}.answer-btn.wrong{background:#f4e2df;border-color:var(--red)}
.group-action{margin-top:1rem}.full-btn{width:100%}.revelation{margin-top:2rem;padding-top:2rem;border-top:1px dashed var(--line)}
.verdict{display:flex;align-items:center;gap:.7rem;border-radius:999px;width:max-content;max-width:100%;padding:.65rem .9rem;background:var(--red);color:white;font-size:.74rem;text-transform:uppercase;letter-spacing:.08em;font-weight:850}
.insight-grid{display:grid;grid-template-columns:1fr 1fr;gap:1rem;margin-top:1.3rem}.insight{border:1px solid var(--line);border-radius:var(--r-md);padding:1rem;background:var(--paper-2)}
.insight p,.insight blockquote{color:#423d2d;line-height:1.65;margin:.4rem 0}.insight blockquote{font-family:Georgia,serif;font-style:italic;font-size:1.08rem;border-left:3px solid var(--red);padding-left:1rem}
.insight.accent{grid-column:1/-1;background:#eef3f0;border-color:#c9d8d0}.reference-list{display:flex;gap:.5rem;flex-wrap:wrap;margin-top:.8rem}
.reference-btn{border:1px solid #d5c9aa;background:#eee4ca;color:#51472d;border-radius:999px;padding:.55rem .75rem;font-family:ui-monospace,monospace;font-size:.74rem}
.reflection-label{display:block;font-size:.78rem;font-weight:800;margin-top:1rem}.reflection-label span{font-weight:500;color:var(--muted)}
textarea{width:100%;margin-top:.4rem;border:1px solid #bdcfc6;background:white;color:var(--ink);border-radius:var(--r-sm);padding:.8rem;resize:vertical}
.small-btn{margin-top:.55rem;border:0;border-radius:var(--r-sm);padding:.6rem .8rem;background:var(--green);color:white;font-weight:750}
.game-nav{display:flex;justify-content:space-between;gap:.8rem;margin-top:1rem}.game-nav .btn{min-width:8rem}
.completion{text-align:center}.completion>p:not(.eyebrow){color:var(--muted);line-height:1.65}.virtues{display:grid;grid-template-columns:repeat(4,1fr);gap:.7rem;margin:2rem 0}
.virtues div{border:1px solid var(--line);background:var(--paper-2);border-radius:var(--r-md);padding:1rem}.virtues strong,.virtues span{display:block}.virtues span{color:var(--muted);font-size:.8rem;margin-top:.3rem;line-height:1.4}
.closing-quote{font-family:Georgia,serif;font-size:1.25rem;line-height:1.5;margin:2rem auto;max-width:42rem;color:var(--red)}
.completion .form-actions{justify-content:center}
.modal{width:min(42rem,calc(100% - 1.5rem));max-height:86dvh;border:0;border-radius:var(--r-lg);padding:0;background:var(--paper);color:var(--ink);box-shadow:var(--shadow)}
.modal.wide{width:min(50rem,calc(100% - 1.5rem))}.modal::backdrop{background:rgba(6,9,20,.75);backdrop-filter:blur(4px)}
.modal-header{position:sticky;top:0;display:flex;justify-content:space-between;gap:1rem;align-items:flex-start;padding:1.3rem 1.4rem;background:var(--paper);border-bottom:1px solid var(--line)}
.modal-header h2{font-family:Georgia,serif;margin:0;font-size:1.8rem}.close-btn{border:1px solid var(--line);background:var(--paper-2);color:var(--ink);border-radius:50%;width:2.6rem;height:2.6rem;font-size:1.4rem}
.scripture-copy,.about-copy{padding:1.5rem;font-family:Georgia,serif;font-size:1.1rem;line-height:1.85;white-space:pre-line}.about-copy{font-family:inherit}.about-copy blockquote{font-family:Georgia,serif;color:var(--red);font-size:1.2rem;line-height:1.6;border-left:3px solid var(--gold);padding-left:1rem}
.modal-note{margin:0;padding:1rem 1.5rem;border-top:1px solid var(--line);font-size:.76rem;color:var(--muted);line-height:1.5}
.toast{position:fixed;z-index:1200;left:50%;bottom:calc(1rem + env(safe-area-inset-bottom));transform:translateX(-50%);background:#10162c;color:white;padding:.8rem 1rem;border-radius:999px;box-shadow:var(--shadow);font-size:.85rem}
@media(max-width:760px){
  .hero{grid-template-columns:1fr;min-height:auto}.setup-grid{grid-template-columns:1fr}.full{grid-column:auto}
  .answers,.insight-grid{grid-template-columns:1fr}.insight.accent{grid-column:auto}.virtues{grid-template-columns:1fr 1fr}
}
@media(max-width:480px){
  .site-header{min-height:4.2rem}.shell{padding-top:1.5rem}.hero h1{font-size:2.65rem}
  .hero-actions,.form-actions,.game-nav{flex-direction:column}.hero-actions .btn,.form-actions .btn,.game-nav .btn{width:100%}
  .toolbar{flex-direction:column}.virtues{grid-template-columns:1fr}.question-card{padding:1.2rem}.card-kicker{gap:.5rem}
}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{scroll-behavior:auto!important;animation-duration:.01ms!important;transition-duration:.01ms!important;animation-iteration-count:1!important}}


/* Caminho formativo */
.module-note {
  max-width: 42rem;
  margin: 1rem 0 0;
  color: var(--sky);
  font-size: 0.86rem;
  line-height: 1.55;
}

.path-view {
  width: 100%;
  max-width: var(--content);
  margin-inline: auto;
}

.path-header {
  display: flex;
  justify-content: space-between;
  align-items: end;
  gap: 1rem;
  margin-bottom: 0.75rem;
}

.path-header h1 {
  margin: 0;
  font-family: Georgia, "Times New Roman", serif;
  font-size: clamp(2rem, 4vw, 3.4rem);
  font-weight: 500;
  line-height: 1.08;
}

.path-position {
  margin: 0.45rem 0 0;
  color: var(--sky);
  font-size: 0.84rem;
}

.path-progress {
  height: 0.32rem;
  margin-bottom: 1rem;
  overflow: hidden;
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.14);
}

.path-progress span {
  display: block;
  height: 100%;
  width: 0;
  background: #b3944e;
  transition: width 0.2s ease;
}

.path-layout {
  display: grid;
  grid-template-columns: minmax(13rem, 17rem) minmax(0, 1fr);
  gap: 1rem;
  align-items: start;
}

.path-map {
  position: sticky;
  top: 1rem;
  max-height: calc(100dvh - 2rem);
  overflow: auto;
  padding: 0.55rem;
  border: 1px solid rgba(255, 255, 255, 0.13);
  border-radius: var(--r-md);
  background: rgba(255, 255, 255, 0.035);
}

.path-map ol {
  list-style: none;
  margin: 0;
  padding: 0;
}

.path-step-btn {
  width: 100%;
  min-height: 2.75rem;
  display: grid;
  grid-template-columns: 1.8rem minmax(0, 1fr);
  gap: 0.55rem;
  align-items: center;
  padding: 0.55rem;
  border: 0;
  border-radius: var(--r-sm);
  background: transparent;
  color: var(--sky);
  text-align: left;
}

.path-step-btn:hover {
  background: rgba(255, 255, 255, 0.06);
  color: var(--white);
}

.path-step-btn[aria-current="step"] {
  background: rgba(179, 148, 78, 0.17);
  color: var(--white);
}

.path-step-btn.is-complete .path-step-index {
  background: var(--green);
  border-color: var(--green);
  color: #fff;
}

.path-step-index {
  display: grid;
  place-items: center;
  width: 1.65rem;
  height: 1.65rem;
  border: 1px solid rgba(255, 255, 255, 0.23);
  border-radius: 50%;
  font-size: 0.67rem;
  font-weight: 800;
}

.path-step-copy {
  min-width: 0;
}

.path-step-copy strong,
.path-step-copy small {
  display: block;
}

.path-step-copy strong {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  font-size: 0.79rem;
}

.path-step-copy small {
  margin-top: 0.08rem;
  color: inherit;
  opacity: 0.75;
  font-size: 0.68rem;
}

.lesson-card {
  min-width: 0;
  padding: clamp(1.15rem, 4vw, 2.5rem);
  border: 1px solid rgba(216, 207, 186, 0.9);
  border-radius: var(--r-lg);
  background: var(--paper);
  color: var(--ink);
  box-shadow: var(--shadow-sm);
}

.lesson-topline {
  display: flex;
  justify-content: space-between;
  gap: 0.75rem;
  color: var(--muted);
  font-size: 0.7rem;
  text-transform: uppercase;
  letter-spacing: 0.1em;
  font-weight: 800;
}

.lesson-theme {
  color: var(--red);
}

.lesson-card > h2 {
  max-width: 23ch;
  margin: 1rem 0 0.65rem;
  font-family: Georgia, "Times New Roman", serif;
  font-size: clamp(1.8rem, 4vw, 2.8rem);
  font-weight: 500;
  line-height: 1.13;
}

.lesson-summary {
  max-width: 48rem;
  margin: 0;
  color: var(--muted);
  font-size: 1.02rem;
  line-height: 1.65;
}

.lesson-section {
  margin-top: 1.35rem;
  padding-top: 1.2rem;
  border-top: 1px solid var(--line);
}

.lesson-section h3 {
  margin: 0 0 0.5rem;
  color: var(--red);
  font-size: 0.72rem;
  text-transform: uppercase;
  letter-spacing: 0.1em;
}

.lesson-section p {
  margin: 0;
  line-height: 1.68;
}

.lesson-truth {
  padding: 1rem;
  border: 1px solid #d8c99e;
  border-radius: var(--r-md);
  background: #f6efd9;
}

.lesson-truth h3 {
  color: var(--gold);
}

.lesson-truth blockquote {
  margin: 0;
  font-family: Georgia, "Times New Roman", serif;
  font-size: 1.14rem;
  line-height: 1.58;
}

.lesson-reflection label {
  display: block;
  margin-top: 0.85rem;
  font-size: 0.8rem;
  font-weight: 750;
}

.lesson-reflection label span {
  color: var(--muted);
  font-weight: 500;
}

.lesson-practice {
  padding: 1rem;
  border: 1px solid #cbd6d0;
  border-radius: var(--r-md);
  background: #eef2ef;
}

.lesson-practice h3 {
  color: var(--green);
}

.lesson-actions {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  gap: 0.65rem;
  margin-top: 1.4rem;
}

.path-completion {
  text-align: center;
}

.path-completion > p:not(.eyebrow) {
  max-width: 43rem;
  margin-inline: auto;
  color: var(--muted);
  line-height: 1.7;
}

.confession-box {
  max-width: 42rem;
  margin: 1.4rem auto;
  padding: 1rem;
  border: 1px solid #d8c99e;
  border-radius: var(--r-md);
  background: #f6efd9;
  text-align: left;
}

.confession-box strong {
  color: var(--red);
  font-size: 0.75rem;
  text-transform: uppercase;
  letter-spacing: 0.08em;
}

.confession-box p {
  margin: 0.45rem 0 0;
  font-family: Georgia, "Times New Roman", serif;
  font-size: 1.08rem;
  line-height: 1.6;
}

@media (max-width: 52rem) {
  .path-layout {
    grid-template-columns: 1fr;
  }

  .path-map {
    position: static;
    max-height: none;
    overflow-x: auto;
  }

  .path-map ol {
    display: flex;
    gap: 0.4rem;
    min-width: max-content;
  }

  .path-step-btn {
    width: 10.5rem;
  }
}

@media (max-width: 40rem) {
  .path-header {
    align-items: flex-start;
    flex-direction: column;
  }

  .lesson-actions {
    flex-direction: column;
  }

  .lesson-actions .btn {
    width: 100%;
  }

  .lesson-card {
    border-radius: var(--r-md);
  }
}


/* Escolhas guiadas do caminho formativo */
.choice-intro {
  margin-bottom: 1rem !important;
  color: var(--muted);
  font-size: 0.88rem;
}

.guided-question {
  min-width: 0;
  margin: 0;
  padding: 1rem 0;
  border: 0;
  border-top: 1px solid var(--line);
}

.guided-question:first-of-type {
  border-top: 0;
  padding-top: 0;
}

.guided-question legend {
  width: 100%;
  margin-bottom: 0.75rem;
  font-family: Georgia, "Times New Roman", serif;
  font-size: 1.08rem;
  font-weight: 600;
  line-height: 1.48;
}

.guided-options {
  display: grid;
  gap: 0.55rem;
}

.guided-option {
  width: 100%;
  min-height: 3.25rem;
  padding: 0.75rem 0.9rem;
  border: 1px solid #c9bea1;
  border-radius: var(--r-sm);
  background: var(--paper-2);
  color: var(--ink);
  text-align: left;
  line-height: 1.45;
}

.guided-option:hover:not(:disabled) {
  border-color: var(--gold);
  background: #fffaf0;
}

.guided-option:disabled {
  cursor: default;
  opacity: 0.72;
}

.guided-option.is-correct {
  border-color: var(--green);
  background: #e5ede8;
  opacity: 1;
  font-weight: 700;
}

.guided-option.is-correct::before {
  content: "✓ ";
}

.guided-option.is-wrong {
  border-color: var(--red);
  background: #f3e4e1;
  opacity: 1;
}

.guided-option.is-wrong::before {
  content: "× ";
}

.guided-feedback {
  margin-top: 0.65rem;
  padding: 0.8rem 0.9rem;
  border-left: 3px solid var(--green);
  border-radius: 0 var(--r-sm) var(--r-sm) 0;
  background: #eef2ef;
}

.guided-feedback.correction {
  border-left-color: var(--gold);
  background: #f6efd9;
}

.guided-feedback strong,
.guided-feedback p {
  display: block;
}

.guided-feedback p {
  margin: 0.2rem 0 0;
  color: #4b4535;
  font-size: 0.88rem;
  line-height: 1.55;
}

@media (max-width: 40rem) {
  .guided-option {
    min-height: 3.5rem;
  }
}

/* Identidade visual — Está Escrito? */
.brand-logo {
  width: 2.5rem;
  height: 2.5rem;
  flex: 0 0 auto;
  border-radius: 0.6rem;
  object-fit: cover;
  box-shadow: 0 5px 14px rgba(4, 8, 18, 0.22);
}

.brand-copy {
  min-width: 0;
}

@media (max-width: 30rem) {
  .brand-logo {
    width: 2.25rem;
    height: 2.25rem;
    border-radius: 0.5rem;
  }

  .brand-copy strong {
    font-size: 0.9rem;
  }
}