/* RELS 101 page styles (copied from assets/phil/phil-101.css 2026-10-03; class prefix phil- renamed rels-) (course page rows + lesson section markers and figures). Uses the site tokens from /style.css. */
.course-row.is-soon { cursor: default; }
.course-row.is-soon .course-row-title { color: var(--muted); }
.course-row.is-soon .whisper-label { color: var(--muted); }

/* Section markers: small line icons before each lead question (no emoji on the site). */
.chunk-mark {
  display: flex; align-items: center; gap: 0.6rem;
  margin: 2.25rem 0 0.2rem;
  font-family: var(--font-chrome); font-size: var(--size-label);
  letter-spacing: 0.08em; text-transform: uppercase; color: var(--muted);
}
.chunk-mark svg { width: 1.6rem; height: 1.6rem; flex: none; stroke: var(--dust); fill: none; stroke-width: 1.6; stroke-linecap: round; stroke-linejoin: round; }
.chunk-mark + .lead-q { margin-top: 0.3rem; }

/* One-minute summary and key-idea boxes */
.rels-box {
  border: 1px solid var(--rule); border-left: 3px solid var(--dust);
  background: var(--bg-band); padding: 0.9rem 1.1rem; margin: 1.25rem 0;
}
.rels-box h3 { font-family: var(--font-chrome); font-size: var(--size-label); letter-spacing: 0.08em; text-transform: uppercase; color: var(--dust); margin: 0 0 0.45rem; font-weight: 400; }
.rels-box ul { margin: 0; padding-left: 1.1rem; }
.rels-box li { margin: 0.25rem 0; color: var(--paper); }
.rels-box p { margin: 0.3rem 0; }
.rels-quote { border-left: 2px solid var(--dust); padding: 0.2rem 0 0.2rem 1rem; margin: 1.1rem 0; font-family: var(--font-display); font-size: var(--size-lead); line-height: 1.45; }
.rels-quote cite { display: block; font-family: var(--font-chrome); font-size: var(--size-label); color: var(--muted); font-style: normal; margin-top: 0.4rem; }

/* SVG figures */
.rels-svg { display: block; width: 100%; height: auto; background: #0f0f0f; border: 1px solid var(--rule); }
.rels-svg text { font-family: "Source Sans 3", Arial, sans-serif; fill: #E8E4DC; }
.rels-svg .t-label { font-size: 17px; font-weight: 600; }
.rels-svg .t-sub { font-size: 13.5px; fill: #8E8A82; }
.rels-svg .t-dust { fill: #C4B49A; }
.rels-svg .t-chrome { font-family: "Courier Prime", "Courier New", monospace; font-size: 12.5px; letter-spacing: 0.06em; fill: #C4B49A; }
.rels-svg .box { fill: #161616; stroke: #C4B49A; stroke-width: 1.4; }
.rels-svg .box-soft { fill: #131313; stroke: rgba(232,228,220,0.28); stroke-width: 1.2; }
.rels-svg .box-hot { fill: #1d1a15; stroke: #C4B49A; stroke-width: 2.2; }
.rels-svg .line { stroke: rgba(232,228,220,0.45); stroke-width: 1.5; fill: none; }
.rels-svg .line-dust { stroke: #C4B49A; stroke-width: 1.8; fill: none; }
.rels-svg .dot { fill: #C4B49A; }
.rels-svg .arrowhead { fill: #C4B49A; }
.diagram-scroll { overflow-x: auto; }
@media (max-width: 640px) { .rels-svg.wide { min-width: 620px; } }

/* Shared lesson pieces, copied from assets/pilot/neuron-pilot.css so RELS lessons match PSY 101 without loading the neuron file. */
.check { margin: 2.25rem 0 0; max-width: 38rem; }
.check details { border-bottom: 1px solid var(--rule); padding: 0.6rem 0; }
.check summary { cursor: pointer; color: var(--paper); font-family: var(--font-body); font-size: var(--size-body); }
.check details p { color: var(--muted); margin: 0.5rem 0 0.2rem; }
.check summary:focus-visible { outline: 2px solid var(--focus); outline-offset: 2px; }
.prose ul.plain { margin: 0.75rem 0 0 1.1rem; color: var(--muted); }
.prose ul.plain li { margin: 0.35rem 0; }
.prose ul.plain strong { color: var(--paper); }
.page-article .sidenotes.long { position: static; }
.page-article .article-col { min-width: 0; }
.diagram-scroll:focus-visible { outline: 2px solid var(--focus); outline-offset: 2px; }
@media (max-width: 640px) {
  .diagram-scroll { overflow-x: auto; -webkit-overflow-scrolling: touch; }
}
.listen-article { margin: 0 0 1.75rem; padding: 0.75rem 0.9rem; border: 1px solid var(--rule); background: var(--bg-band); max-width: 42rem; }
.listen-article-label { display: block; margin: 0 0 0.45rem; font-family: var(--font-chrome); font-size: var(--size-small); letter-spacing: 0.04em; color: var(--dust); }
.listen-article audio { display: block; width: 100%; height: 40px; color-scheme: dark; }
.listen-article-meta { margin: 0.4rem 0 0; font-size: 0.8rem; color: var(--muted); }
.photo-credit { margin: 2rem 0 0; font-family: var(--font-chrome); font-size: var(--size-label); color: var(--muted); }
.ex-table caption.visually-hidden { caption-side: top; }

/* RELS 101 course page: learning goals and track notes under the lesson list */
.course-about { margin: 2.5rem 0 0; max-width: 42rem; }
.course-about h2 { font-family: var(--font-display); font-size: var(--size-lead); font-weight: 600; color: var(--paper); margin: 2rem 0 0.6rem; }
.course-about p { color: var(--muted); margin: 0.5rem 0; }
.course-about ul { margin: 0.5rem 0 0 1.1rem; color: var(--muted); }
.course-about li { margin: 0.35rem 0; }
.course-about strong { color: var(--paper); }

/* Long reference URLs wrap on phones (the same URL overflow exists on the live PHIL 101 Lesson 1 page at 390 px). */
.refs a { overflow-wrap: anywhere; }
