/* map-topics-by-chapter: page styles. The family patterns (scope panel,
   method note, questions, sources, tables, the series nav) come from
   bible-map-of-meaning.css, loaded before this file. The figure is twelve
   strips of 1,189 marks shaded on one hue, the map's Law blue, from pale to
   deep in light mode and from dim to bright in dark mode; the six shades are
   written into the region below by tools/build-semantic-map-topics.mjs --page
   from the data file, where the builder checks them (one hue, monotone
   lightness in steps of at least 0.06, the lowest shade at 2:1 or better
   against the strip's surface) and validate_palette.js --ordinal was run on
   them in both themes. Edit them there, not here. */

/* topics:ramp */
:root{--tc-s0:#96b4ee;--tc-s1:#7496d9;--tc-s2:#5379c3;--tc-s3:#345bad;--tc-s4:#143d97;--tc-s5:#001b81;--tc-surface:#ffffff}
html[data-theme="dark"]{--tc-s0:#3f5893;--tc-s1:#556fa7;--tc-s2:#6d86bc;--tc-s3:#859dd2;--tc-s4:#9eb5e7;--tc-s5:#b8cefd;--tc-surface:#201d16}
/* /topics:ramp */


/* the figure */
.tc-figure{margin:22px 0 26px;padding:20px 20px 12px;border:1px solid var(--line);border-radius:10px;background:linear-gradient(145deg,var(--card),var(--card-2));box-shadow:var(--shadow-soft)}
.tc-figure figcaption{margin:6px 0 4px;font-size:14px;line-height:1.65;color:var(--ink-2)}
.tc-figure .research-legend{padding:12px 0 4px;font-size:12.5px}
.tc-figure details.research-disclosure{margin:8px 0 0}
.tc-figure .tc-note{margin:12px 0 2px;font-size:13.5px;line-height:1.6;color:var(--ink-2)}
.tc-reading-note{margin:28px 0 30px;padding:24px 26px;border:1px solid color-mix(in srgb,var(--gold) 28%,var(--line));border-left:4px solid var(--gold);border-radius:14px;background:color-mix(in srgb,var(--paper) 88%,var(--gold) 12%)}
.tc-reading-note h3{margin:0 0 12px;font-size:clamp(1.25rem,2vw,1.55rem)}
.tc-reading-note p{margin:0;color:var(--ink-2)}
.tc-reading-note p+p{margin-top:12px}
.tc-legend-note{margin:8px 0 18px;font-size:13.5px;line-height:1.55;color:var(--ink-2);font-style:italic}
@media(max-width:600px){.tc-reading-note{margin:22px 0 24px;padding:20px 18px}.tc-reading-note p+p{margin-top:10px}}

/* the ruler: testament labels over their spans, a tick at the start of
   every book, book labels by tier (more appear as the page widens) */
.tc-ruler{position:relative;margin:0 0 8px;font:11px/1.3 var(--sans);color:var(--ink-3)}
.tc-testaments{position:relative;height:18px}
.tc-testament{position:absolute;top:0;white-space:nowrap;font-weight:600;letter-spacing:.02em;color:var(--ink-2)}
.tc-books{position:relative;height:24px;border-top:1px solid var(--line-2)}
.tc-tick{position:absolute;top:0;width:1px;height:6px;background:var(--line-2)}
.tc-book{position:absolute;top:7px;padding-left:3px;font-size:10px;line-height:1.4;white-space:nowrap;color:var(--ink-3)}
.tc-book.end{padding-left:0;padding-right:3px}
.tc-book.tier-2,.tc-book.tier-3{display:none}
#tc-ruler-bottom{margin:6px 0 0}
#tc-ruler-bottom .tc-testaments{display:none}
#tc-ruler-bottom .tc-books{height:8px;border-top:0;border-bottom:1px solid var(--line-2)}
#tc-ruler-bottom .tc-tick{top:auto;bottom:0}

/* the strips */
.tc-strips{list-style:none;margin:0;padding:0}
.tc-strip{margin:0 0 8px}
.tc-head{display:flex;flex-wrap:wrap;align-items:baseline;gap:2px 14px;margin:0 0 4px}
.research-section-body .tc-strip .tc-title{margin:0;font:600 15px/1.3 var(--sans)}
.tc-title a{color:var(--ink);text-decoration:none;border-bottom:1px solid var(--line-2)}
.tc-title a:hover{color:var(--accent);border-bottom-color:var(--accent)}
.tc-stat{margin:0;font:12.5px/1.4 var(--sans);color:var(--ink-2)}
.tc-track{position:relative;height:20px;background:var(--tc-surface);border:1px solid var(--line);border-radius:3px;overflow:hidden}
.tc-marks{display:block;width:100%;height:20px}
.tc-marks .s0{fill:var(--tc-s0)}
.tc-marks .s1{fill:var(--tc-s1)}
.tc-marks .s2{fill:var(--tc-s2)}
.tc-marks .s3{fill:var(--tc-s3)}
.tc-marks .s4{fill:var(--tc-s4)}
.tc-marks .s5{fill:var(--tc-s5)}
.tc-divider{position:absolute;top:0;bottom:0;width:1px;background:var(--ink);opacity:.6}
.tc-peak-row{position:relative;height:18px;font:11px/1.5 var(--sans);color:var(--ink-2)}
.tc-peak{position:absolute;top:0;padding-left:7px;white-space:nowrap}
.tc-peak::before{content:"";position:absolute;left:0;top:0;width:1px;height:9px;background:var(--ink-2)}
.tc-peak.end{padding-left:0;padding-right:7px}
.tc-peak.end::before{left:auto;right:0}

/* legend swatches */
.tc-sw{display:inline-block;width:14px;height:12px;margin-right:6px;border:1px solid var(--line);border-radius:3px;vertical-align:-1px}
.tc-sw.s0{background:var(--tc-s0)}
.tc-sw.s1{background:var(--tc-s1)}
.tc-sw.s2{background:var(--tc-s2)}
.tc-sw.s3{background:var(--tc-s3)}
.tc-sw.s4{background:var(--tc-s4)}
.tc-sw.s5{background:var(--tc-s5)}

/* tables, the try-it box */
.tc-table td:nth-child(n+2){font-variant-numeric:tabular-nums}
.tc-table td.tc-rank{color:var(--ink-3)}
.tc-table small{font-size:11px;color:var(--ink-3);letter-spacing:.04em}
.tc-try{margin:18px 0 6px;padding:16px 18px;border:1px solid var(--line);border-radius:8px;background:var(--card)}
.tc-try p{margin:0}
.tc-try p+p{margin-top:8px}
.tc-try a.tc-search-link{display:inline-block;margin-top:10px;padding:8px 14px;border:1px solid var(--accent);border-radius:6px;color:var(--accent);font:600 14px/1.2 var(--sans,system-ui,sans-serif);text-decoration:none}
.tc-try a.tc-search-link:hover{background:var(--accent);color:var(--accent-ink)}

@media (min-width:721px){
  .tc-book.tier-2{display:block}
}
@media (min-width:1100px){
  .tc-book.tier-3{display:block}
}
@media (max-width:720px){
  .tc-figure{padding:14px 12px 8px}
  .tc-testament{font-size:10.5px}
  .research-section-body .tc-strip .tc-title{font-size:14px}
}
