/* Tema original Apex; ajustes locais do leitor e visualizador. */
/* Leitor: somente a superfície do artigo usa o branco gelo (#FFFFFF). */
#article {
  color-scheme: light;
  --reading-paper: #FFFFFF;
  --canvas: #FFFFFF;
  --surface: #FFFFFF;
  --surface2: #F2F2F2;
  --ink: #202020;
  --white: var(--ink);
  --secondary: #333333;
  --muted: #626262;
  --bronze: #8C7853;
  --border: rgba(38, 54, 76, .2);
  color: var(--ink);
  background: var(--reading-paper);
  border-radius: 14px;
  padding: clamp(16px, 3vw, 36px);
}
#article :is(p, li, td, blockquote, .lead, figcaption) { color: var(--secondary); }
#article :is(.ww2-callout, .callout, .study-admonition, .questao-card, .solucao-box, .mod01-quiz, .mod01-quiz label, .mod01-feedback:not(:empty)) {
  background: var(--surface);
  color: var(--ink);
}
#article :is(.ww2-callout > strong, .mod01-quiz legend, .mod01-feedback strong) { color: var(--bronze); }
#article .mod01-quiz label:where(:has(:checked):not(.correct, .incorrect)) { background: #F2F2F2; }
#article .mod01-quiz label.correct { background: #dcebe1; }
#article .mod01-quiz label.incorrect { background: #f2dddd; }
#article :is(th, .chapter-nav button) { background: var(--surface2); color: var(--ink); }
#article .chapter-nav .primary { background: var(--gradient); }
#reader .mod01-content h2, #reader .mod01-quiz { scroll-margin-top: 100px; }

.reader-layout {
  grid-template-columns: minmax(0, 1fr) 245px;
  gap: clamp(20px, 2.5vw, 40px);
}
.focus .reader-layout { grid-template-columns: minmax(0, 1120px); }
#article { min-width: 0; }
#article :is(.ww2-callout, .callout, .study-admonition) {
  background: color-mix(in srgb, var(--reading-paper) 75%, var(--surface2));
  color: var(--ink);
}
#article .ww2-callout .study-admonition {
  background: transparent;
  margin: 0;
  padding: 0;
  border: 0;
}
#article .study-table { max-width: 100%; margin: 24px auto; overflow-x: auto; }
#article .study-table table {
  display: table;
  width: 100%;
  min-width: 36rem;
  margin: 0 auto;
  table-layout: auto;
}
#article .ww2-content > table { width: fit-content; margin-inline: auto; }
#article :is(th, td) {
  word-break: normal;
  overflow-wrap: normal;
  hyphens: none;
  vertical-align: top;
}
@media (max-width: 1100px) {
  .reader-layout { grid-template-columns: minmax(0, 1fr) 210px; }
}
@media (max-width: 850px) {
  .reader-layout { grid-template-columns: minmax(0, 1fr); }
}

.study-visual-overlay { position: fixed; inset: 0; z-index: 30; display: grid; place-items: center; padding: 22px; background: rgba(12, 17, 23, .76); backdrop-filter: blur(8px); }
.study-visual-dialog { width: min(100%, 980px); max-height: min(92vh, 1100px); display: grid; grid-template-rows: auto minmax(0, 1fr) auto; gap: 14px; padding: 18px; overflow: hidden; border: 1px solid var(--border); border-radius: 18px; background: var(--surface); box-shadow: 0 24px 80px #10182055; }
.study-visual-dialog header, .study-visual-dialog footer { display: flex; align-items: center; justify-content: space-between; gap: 14px; }
.study-visual-dialog h2 { margin: 0; color: var(--white); font: 500 22px/1.3 var(--serif); }
.study-visual-close { width: 38px; height: 38px; border: 1px solid var(--border); border-radius: 50%; background: var(--surface2); color: var(--white); font-size: 25px; line-height: 1; }
.study-visual-viewport { height: min(68vh, 850px); max-height: 100%; min-height: 0; overflow: hidden; border: 1px solid var(--border); border-radius: 11px; background: var(--canvas); touch-action: none; user-select: none; cursor: zoom-in; }
.study-visual-viewport.is-zoomed { cursor: grab; }
.study-visual-viewport.is-dragging { cursor: grabbing; }
.study-visual-image { display: block; width: 100%; height: 100%; object-fit: contain; }
.study-visual-empty { min-height: 180px; display: grid; place-items: center; margin: 0; border: 1px dashed var(--border); border-radius: 11px; color: var(--white); }
.study-visual-download { justify-self: end; padding: 11px 18px; border: 0; border-radius: 999px; background: var(--gold); color: var(--canvas); font-size: 13px; font-weight: 700; text-decoration: none; }
.study-visual-download.disabled { opacity: .5; pointer-events: none; }

/* Strong heading contrast on the white lesson paper. */
#article :is(h1,h2,h3,h4,h5,h6), #article .mod01-content :is(h1,h2,h3,h4,h5,h6) { color: #202020 !important; }
#article .callout-brand-icon { display:inline-block; flex:0 0 24px; width:24px; height:24px; object-fit:contain; border:0; border-radius:0; margin:0; }

/* Keep chapter banners within the reading column. */
.reader-layout > #article { min-width: 0; }
#article > :is(.mod01-lesson-banner,.mod02-lesson-banner) { display:block; width:100%; max-width:100%; height:auto; object-fit:contain; border-radius:14px; margin:0 0 24px; }

/* Questões do leitor */
#article .mod01-quiz {
  padding: clamp(12px, 2.5vw, 24px);
  border: 1px solid #ded8cc;
  background: #faf8f3;
}
#article .mod01-quiz legend {
  padding: 4px 12px;
  border: 1px solid #ded8cc;
  border-radius: 8px;
  background: #fff;
  color: #66522d;
  font-size: .85em;
}
#article .mod01-quiz label {
  position: relative;
  display: grid;
  grid-template-columns: 30px minmax(0, 1fr);
  align-items: start;
  gap: 6px 12px;
  padding: 12px;
  border-color: #e4ded4;
  line-height: 1.55;
}
#article .mod01-quiz label:hover:not(:has(:disabled)),
#article .mod01-quiz label:has(:checked) { border-color: #9b7836; }
#article .mod01-quiz label:focus-within {
  outline: 2px solid #785b24;
  outline-offset: 2px;
}
#article .mod01-quiz input[type="radio"] {
  position: absolute;
  opacity: 0;
  width: 1px;
  height: 1px;
}
.quiz-letter {
  display: grid;
  place-items: center;
  min-height: 30px;
  border-radius: 7px;
  background: #f1ebdf;
  color: #66522d;
  font-size: .83em;
  font-weight: 700;
}
.quiz-option-text { overflow-wrap: break-word; }
.quiz-option-result {
  grid-column: 2;
  font-size: .8em;
  font-weight: 700;
}
#article .mod01-quiz label.correct { border-color: #548168; color: #204c32; }
#article .mod01-quiz label.incorrect { border-color: #ad6865; color: #752d2b; }
#article .mod01-quiz label:has(:disabled) { cursor: default; }
#article .mod01-feedback:not(:empty) {
  margin-top: 16px;
  padding: 14px;
  border-left: 3px solid #a48140;
  border-radius: 8px;
}