@font-face {
  font-family: "Inter";
  font-style: normal;
  font-weight: 100 900;
  font-display: swap;
  src: url("fonts/inter-latin-wght-normal.woff2") format("woff2-variations");
}

@font-face {
  font-family: "Inter";
  font-style: italic;
  font-weight: 100 900;
  font-display: swap;
  src: url("fonts/inter-latin-wght-italic.woff2") format("woff2-variations");
}

:root {
  --ink: #f7f4fa;
  --ink-soft: #d2ccd9;
  --accent: #aa82e8;
  --accent-strong: #6c4aa2;
  --accent-light: #241a32;
  --surface: #050505;
  --surface-soft: #0e0c11;
  --surface-warm: #17111f;
  --line: #3d3744;
  --focus: #dac5ff;
  --max: 92rem;
  --radius: .8rem;
  --shadow: 0 .6rem 1.6rem rgba(0,0,0,.28);
  --shadow-soft: 0 .25rem 1rem rgba(0,0,0,.24);
}

html[data-font-scale="large"] { font-size: 115%; }
html[data-font-scale="xlarge"] { font-size: 130%; }
html[data-line-spacing="more"] body { line-height: 1.82; }
html[data-line-spacing="more"] :is(p, li, dd, legend, .checkbox-label span) { line-height: 1.82; }
html[data-letter-spacing="more"] body { letter-spacing: .035em; }

html[data-color-mode="high-contrast"] {
  color-scheme: dark;
  --ink: #fff;
  --ink-soft: #fff;
  --accent: #ffe600;
  --accent-strong: #000;
  --accent-light: #191919;
  --surface: #000;
  --surface-soft: #000;
  --surface-warm: #000;
  --line: #fff;
  --focus: #00e5ff;
}
html[data-color-mode="light"] {
  color-scheme: light;
  --ink: #1a171d;
  --ink-soft: #3d3742;
  --accent: #5d3c8d;
  --accent-strong: #5d3c8d;
  --accent-light: #ebe4f3;
  --surface: #faf8f4;
  --surface-soft: #f0ece6;
  --surface-warm: #eee8f3;
  --line: #6a646f;
  --focus: #3e176f;
}
html[data-color-mode="grayscale"] {
  color-scheme: dark;
  --ink: #f7f7f7;
  --ink-soft: #d5d5d5;
  --accent: #c8c8c8;
  --accent-strong: #666;
  --accent-light: #262626;
  --surface: #050505;
  --surface-soft: #111;
  --surface-warm: #1a1a1a;
  --line: #666;
  --focus: #fff;
}

[hidden] { display: none !important; }

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after { animation-duration: .01ms !important; transition-duration: .01ms !important; }
  .shore-motion, .motion-toggle { display: none !important; }
}
body {
  margin: 0;
  font-family: "Inter", system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Arial, sans-serif;
  color: var(--ink);
  background: var(--surface);
  background-attachment: fixed;
  font-size: 1rem;
  line-height: 1.58;
}
p, li, legend, .checkbox-label span {
  text-wrap: pretty;
}
.lead,
.notice p,
.home-orientation,
.speech-note,
.depth-section-intro,
.result-note,
.book-list > p {
  text-wrap: balance;
}
.shore-motion {
  position: fixed;
  inset: 0 auto 0 0;
  width: clamp(32rem, 54vw, 56rem);
  overflow: visible;
  pointer-events: none;
  z-index: 110;
  opacity: .72;
}
.shore-motion span {
  position: absolute;
  left: -82%;
  width: 100%;
  aspect-ratio: 1;
  border-radius: 50%;
  background: linear-gradient(135deg, rgba(129,83,194,.88), rgba(86,54,139,.56));
  filter: saturate(.9);
  animation: shore-sway 13s ease-in-out infinite alternate;
  transform-origin: left center;
}
.shore-motion span:nth-child(1) { top: -20%; }
.shore-motion span:nth-child(2) {
  top: 35%;
  opacity: .58;
  animation-delay: -6s;
  animation-duration: 16s;
}
.motion-toggle {
  position: fixed;
  left: 1rem;
  bottom: 1rem;
  z-index: 120;
  min-height: 2.2rem;
  padding: .38rem .65rem;
  border-color: rgba(210,204,217,.7);
  background: rgba(14,12,17,.92);
  color: var(--ink-soft);
  box-shadow: var(--shadow-soft);
  font-size: .78rem;
  backdrop-filter: blur(.5rem);
}
.motion-toggle:hover { color: var(--ink); }
.motion-toggle[aria-pressed="true"] { border-color: var(--accent); color: var(--ink); }
.motion-disabled .shore-motion { display: none; }
@keyframes shore-sway {
  0% { transform: translate(-4%, -1%) scale(.98); }
  55% { transform: translate(10%, 2%) scale(1.03); }
  100% { transform: translate(3%, -2%) scale(1); }
}
a { color: var(--ink); text-underline-offset: .18em; }
a:hover { color: var(--accent); text-decoration-thickness: .15em; }
button, input, select, textarea { font: inherit; }
button, .button {
  min-height: 2.45rem;
  border-radius: .65rem;
  border: 1px solid #746a80;
  padding: .5rem .85rem;
  background: var(--surface-soft);
  color: var(--ink);
  cursor: pointer;
}
button:hover, .button:hover { border-color: var(--accent); background: var(--accent-light); }
button:disabled { cursor: not-allowed; opacity: .6; }
:focus-visible {
  outline: .25rem solid var(--focus);
  outline-offset: .2rem;
}
.skip-link {
  position: fixed;
  top: .5rem;
  left: .5rem;
  transform: translateY(-200%);
  background: var(--accent);
  color: #09070b;
  padding: .8rem 1rem;
  z-index: 1000;
}
.skip-link:focus { transform: none; }

.site-header {
  position: sticky;
  top: 0;
  z-index: 100;
  display: grid;
  grid-template-columns: minmax(28rem, .95fr) minmax(0, 2fr);
  grid-template-areas:
    "actions actions"
    "brand nav";
  gap: .55rem 1.35rem;
  align-items: center;
  padding: .42rem max(1rem, calc((100vw - var(--max)) / 2)) .66rem;
  background: rgba(5,5,5,.95);
  border-bottom: 1px solid var(--line);
  box-shadow: var(--shadow-soft);
  backdrop-filter: blur(.75rem);
}
.brand {
  grid-area: brand;
  display: flex;
  align-items: center;
  gap: .75rem;
  min-width: 0;
}
.brand-link { display: flex; flex: 1; flex-direction: column; min-width: 0; text-decoration: none; }
.brand-kicker { font-size: .67rem; letter-spacing: .09em; text-transform: uppercase; color: var(--accent); font-weight: 700; white-space: nowrap; }
.brand-title {
  overflow: visible;
  font-size: .92rem;
  font-weight: 800;
  line-height: 1.25;
  text-overflow: clip;
  white-space: nowrap;
}
.brand-logo {
  display: grid;
  place-items: center;
  flex: 0 0 auto;
  width: 3rem;
  height: 3rem;
  padding: .12rem;
  overflow: hidden;
  border: 1px solid rgba(170,130,232,.5);
  border-radius: 50%;
  background: #fff;
  box-shadow: 0 .2rem .7rem rgba(0,0,0,.35);
}
.brand-logo img { display: block; width: 100%; height: 100%; object-fit: contain; border-radius: 50%; }
.main-nav {
  grid-area: nav;
  display: flex;
  flex-wrap: nowrap;
  gap: .15rem .5rem;
  align-items: center;
  justify-content: flex-end;
  white-space: nowrap;
}
.main-nav a {
  padding: .38rem .16rem;
  border-bottom: .16rem solid transparent;
  font-size: clamp(.73rem, .88vw, .88rem);
  font-weight: 680;
  text-decoration: none;
}
.main-nav a:hover { border-bottom-color: var(--accent); }
.main-nav a[aria-current="page"] { border-bottom-color: var(--accent); color: var(--accent); }
.header-actions {
  grid-area: actions;
  display: flex;
  flex-wrap: wrap;
  gap: .35rem;
  align-items: center;
  justify-content: flex-end;
  padding-bottom: .48rem;
  border-bottom: 1px solid var(--line);
  position: relative;
}
.lang-button, .plain-button { padding: .28rem .5rem; min-height: 2.05rem; font-size: .84rem; }
.lang-button[aria-pressed="true"], .plain-button[aria-pressed="true"] { border-color: var(--accent); background: var(--accent-strong); color: white; }
.accessibility-menu { position: relative; font-size: .84rem; }
.accessibility-menu > summary {
  min-height: 2.05rem;
  padding: .35rem .65rem;
  border: 1px solid #746a80;
  border-radius: .65rem;
  background: var(--surface-soft);
  color: var(--ink);
  cursor: pointer;
  font-weight: 700;
  list-style: none;
}
.accessibility-menu > summary::-webkit-details-marker { display: none; }
.accessibility-menu > summary::after { content: " +"; color: var(--accent); }
.accessibility-menu[open] > summary { border-color: var(--accent); background: var(--accent-light); }
.accessibility-menu[open] > summary::after { content: " −"; }
.accessibility-panel {
  position: absolute;
  top: calc(100% + .55rem);
  right: 0;
  z-index: 300;
  width: min(31rem, calc(100vw - 2rem));
  max-height: min(80vh, 42rem);
  overflow: auto;
  padding: 1rem;
  border: 1px solid var(--line);
  border-radius: var(--radius);
  background: var(--surface-soft);
  color: var(--ink);
  box-shadow: 0 1.25rem 3.5rem rgba(0,0,0,.55);
  text-align: left;
}
.accessibility-panel > p { margin: 0 0 1rem; color: var(--ink-soft); }
.accessibility-panel fieldset { margin: 0; padding: .9rem 0; border: 0; border-top: 1px solid var(--line); }
.accessibility-panel legend { padding: 0 .35rem 0 0; font-weight: 800; }
.preference-options { display: flex; flex-wrap: wrap; gap: .45rem; margin-top: .55rem; }
.preference-options button { flex: 1 1 8.5rem; text-align: center; }
.preference-options button[aria-pressed="true"] { border-color: var(--accent); background: var(--accent-strong); color: #fff; }
html[data-color-mode="high-contrast"] .preference-options button[aria-pressed="true"] { color: #ffe600; }
.reset-preferences { width: 100%; margin-top: .35rem; font-weight: 750; }
.nav-toggle { grid-area: toggle; display: none; }

main, .site-footer { position: relative; z-index: 1; }
main { max-width: var(--max); margin: 0 auto; padding: 1.35rem 1.25rem 4rem; }
.page { min-height: 60vh; }
.hero {
  width: 100%;
  max-width: none;
  margin-top: .7rem;
  padding: clamp(1.8rem, 4vw, 2.8rem) clamp(1.25rem, 3.5vw, 2.5rem) 2.1rem;
  border: 1px solid var(--line);
  border-radius: calc(var(--radius) * 1.35);
  background: rgba(8,7,10,.92);
  box-shadow: inset 0 .2rem 0 var(--accent-strong), var(--shadow-soft);
}
.hero > * { max-width: 66rem; }
.eyebrow { color: var(--accent); text-transform: uppercase; letter-spacing: .1em; font-size: .71rem; font-weight: 800; }
h1, h2, h3 {
  line-height: 1.16;
  text-wrap: wrap;
  overflow-wrap: break-word;
  word-break: normal;
  hyphens: auto;
}
h1 { font-size: clamp(1.52rem, 2.55vw, 2.35rem); margin: .25rem 0 .85rem; letter-spacing: -.02em; }
h2 { font-size: clamp(1.06rem, 1.35vw, 1.3rem); }
h3 { font-size: 1rem; }
.lead { font-size: clamp(1rem, 1.12vw, 1.1rem); max-width: 56rem; color: var(--ink-soft); }
.hero-actions, .form-actions { display: flex; flex-wrap: wrap; gap: .75rem; margin-top: 1.5rem; }
.button { display: inline-flex; align-items: center; text-decoration: none; font-weight: 750; }
.button.primary { border-color: var(--accent); background: var(--accent-strong); color: white; }
.button.primary:hover { background: #7a56b2; border-color: #bd9af1; }
.button.secondary { background: transparent; }

.read-tools {
  display: flex; flex-wrap: wrap; gap: .55rem; align-items: center;
  background: rgba(14,12,17,.94); border: 1px solid var(--line); border-radius: var(--radius); padding: .75rem; margin: .8rem 0 1.35rem;
}
.read-tools label { margin: 0 0 0 .25rem; }
.read-tools select { width: auto; min-width: 6rem; padding: .46rem .6rem; }
.read-tools #speech-voice { max-width: min(22rem, 100%); }
.speech-note { flex-basis: 100%; margin: .1rem 0 0; color: var(--ink-soft); font-size: .82rem; }
.home-orientation { max-width: 64rem; margin: 1.25rem 0; color: var(--ink-soft); }
.editorial-visual {
  width: min(58rem, 92%);
  margin: 2rem auto 2.2rem;
  padding: .4rem;
  border: 1px solid rgba(170,130,232,.38);
  border-radius: 1rem;
  background: linear-gradient(145deg, rgba(170,130,232,.13), rgba(14,12,17,.9));
  box-shadow: 0 1.1rem 3rem rgba(0,0,0,.38);
}
.editorial-visual--wide { width: 100%; margin-block: 1.7rem 2.4rem; }
.editorial-visual img { display: block; width: 100%; height: auto; border-radius: .72rem; }
.summary-box, .practice-panel {
  margin: 1.4rem 0;
  padding: 1rem 1.1rem;
  border: 1px solid var(--line);
  border-radius: var(--radius);
  background: linear-gradient(125deg, rgba(108,74,162,.22), rgba(14,12,17,.95));
}
.summary-box h2, .practice-panel h2 { margin-top: 0; }
.reflection-prompt { color: #ded0f4; }
.compact-grid { margin-bottom: 1.4rem; }
.notice, .questions-box, .toolkit-resource {
  border-left: .45rem solid var(--accent);
  background: var(--surface-warm);
  padding: .9rem 1.05rem;
  margin: 1.15rem 0 1.5rem;
}
.notice p { margin-bottom: 0; }
.posts-link {
  margin: 1.15rem 0 1.5rem;
  padding: .9rem 1.05rem;
  border: 1px solid rgba(170,130,232,.38);
  border-radius: var(--radius);
  background: rgba(170,130,232,.09);
}
.posts-link a { display: inline-block; margin-left: .25rem; font-weight: 750; text-underline-offset: .2em; }
.transparency-note {
  margin: 1.15rem 0 1.5rem;
  border: 1px solid var(--line);
  border-radius: .65rem;
  background: rgba(14,12,17,.55);
}
.transparency-note > summary {
  padding: .7rem .85rem;
  cursor: pointer;
  color: var(--ink-soft);
  font-size: .9rem;
  font-weight: 700;
}
.transparency-note[open] > summary { border-bottom: 1px solid var(--line); color: var(--ink); }
.transparency-note > p { margin: 0; padding: .8rem .9rem .95rem; color: var(--ink-soft); font-size: .9rem; }
.transparency-note a { color: inherit; text-decoration-thickness: .06em; }
.toolkit-downloads { display: flex; flex-wrap: wrap; gap: .75rem; margin: 1rem 0 1.8rem; }
.toolkit-edition { margin-top: 1.6rem; }
.toolkit-edition h3 { margin-bottom: .8rem; }
.toolkit-pages { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: .85rem; }
.toolkit-pages a {
  display: block;
  overflow: hidden;
  border: 1px solid rgba(170,130,232,.45);
  border-radius: .7rem;
  background: #fff;
  box-shadow: var(--shadow-soft);
}
.toolkit-pages a:hover { border-color: var(--accent); transform: translateY(-.12rem); }
.toolkit-pages a:focus-visible { outline: .2rem solid var(--accent); outline-offset: .16rem; }
.toolkit-pages img { display: block; width: 100%; height: auto; }

.accessible-toolkit {
  margin-top: 1.5rem;
  border: 1px solid rgba(233,226,244,.72);
  border-radius: .8rem;
  background: #f7f5f1;
  color: #17151a;
}
.accessible-toolkit > summary {
  padding: 1rem 1.15rem;
  cursor: pointer;
  font-weight: 800;
  color: #17151a;
  text-decoration: underline;
  text-decoration-thickness: .08em;
  text-underline-offset: .22em;
}
.accessible-toolkit > summary:hover { background: #ece8e1; }
.accessible-toolkit > summary:focus-visible { outline: .2rem solid #4e3478; outline-offset: .15rem; }
.accessible-toolkit[open] > summary { border-bottom: 1px solid #cbc5ba; }
.accessible-toolkit-content {
  max-width: 78ch;
  margin-inline: auto;
  padding: clamp(1rem, 3vw, 2rem);
  font-size: clamp(1rem, .96rem + .2vw, 1.12rem);
  line-height: 1.72;
}
.accessible-toolkit-content p,
.accessible-toolkit-content li,
.accessible-toolkit-content dd { text-wrap: pretty; }
.accessible-toolkit-intro {
  margin: 0 0 2rem;
  padding: 1rem 1.1rem;
  border-left: .35rem solid #4e3478;
  background: #ebe7f0;
}
.accessible-toolkit-page + .accessible-toolkit-page {
  margin-top: 3rem;
  padding-top: 2.5rem;
  border-top: .18rem solid #5b5560;
}
.accessible-toolkit-page h3,
.accessible-toolkit-page h4,
.accessible-toolkit-page h5 { color: #17151a; text-wrap: balance; }
.accessible-toolkit-page h3 { margin: .25rem 0 1.5rem; font-size: clamp(1.55rem, 1.25rem + 1vw, 2.2rem); }
.accessible-toolkit-page h4 { margin: 1.8rem 0 .65rem; font-size: clamp(1.2rem, 1.08rem + .4vw, 1.5rem); }
.accessible-toolkit-page h5 { margin: 0 0 .55rem; font-size: 1.05em; }
.accessible-toolkit-page ul { padding-left: 1.4rem; }
.accessible-toolkit-page li + li { margin-top: .5rem; }
.accessible-page-number { margin: 0; color: #4b4650; font-size: .92em; font-weight: 750; }
.accessible-myth-list { display: grid; gap: .8rem; }
.accessible-myth-list > section {
  padding: 1rem 1.05rem;
  border: 1px solid #c9c3b9;
  border-left: .35rem solid #5b5560;
  border-radius: .35rem;
  background: #fff;
}
.accessible-myth-list p { margin-bottom: 0; }
.accessible-terms { display: grid; gap: .8rem; margin: 0; }
.accessible-terms > div { padding: 1rem 1.05rem; border: 1px solid #c9c3b9; border-radius: .35rem; background: #fff; }
.accessible-terms dt { margin-bottom: .45rem; font-size: 1.08em; font-weight: 850; }
.accessible-terms dd { margin: .3rem 0 0; }
.accessible-note,
.accessible-calling-in { padding: 1rem 1.05rem; border-left: .35rem solid #4e3478; background: #ebe7f0; }
.accessible-disclaimer { margin-top: 1.5rem; color: #403b43; font-size: .92em; }

.toolkit-lightbox {
  width: min(96vw, 92rem);
  max-width: none;
  max-height: 96vh;
  padding: 0;
  border: 1px solid rgba(210,188,245,.45);
  border-radius: 1rem;
  color: var(--ink);
  background: #111016;
  box-shadow: 0 1.5rem 5rem rgba(0,0,0,.7);
}
.toolkit-lightbox::backdrop { background: rgba(4,3,7,.88); backdrop-filter: blur(.18rem); }
.lightbox-shell { display: grid; grid-template-rows: auto minmax(0, 1fr) auto; max-height: 96vh; }
.lightbox-toolbar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  padding: .75rem 1rem;
  border-bottom: 1px solid var(--line);
}
.lightbox-toolbar h2 { margin: 0; font-size: 1rem; }
.lightbox-viewer {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
  align-items: center;
  gap: .75rem;
  min-height: 0;
  padding: .8rem;
  overflow: auto;
}
.lightbox-viewer img {
  display: block;
  width: auto;
  max-width: 100%;
  height: auto;
  max-height: calc(96vh - 9rem);
  margin: auto;
  object-fit: contain;
  background: white;
}
.lightbox-nav { min-width: 8.5rem; }
.lightbox-counter { margin: 0; padding: .65rem 1rem .8rem; text-align: center; color: var(--ink-soft); }
.cards, .content-grid { display: grid; gap: .8rem; }
.cards.four { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.content-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.card, .content-block {
  border: 1px solid var(--line);
  border-radius: var(--radius);
  padding: 1.05rem;
  background: rgba(11,10,13,.96);
  box-shadow: var(--shadow);
  transition: transform .2s ease, box-shadow .2s ease, border-color .2s ease;
}
.card {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  column-gap: .8rem;
  align-content: start;
}
.card h2 {
  align-self: center;
  margin: 0;
  font-size: clamp(.94rem, 1.05vw, 1.08rem);
}
.card > p:not(.card-number), .card > a {
  grid-column: 1 / -1;
}
.card > p:not(.card-number) { margin-top: 1.1rem; }
.card:hover, .content-block:hover { border-color: var(--accent-strong); box-shadow: 0 .8rem 1.8rem rgba(0,0,0,.34); transform: translateY(-.12rem); }
.card-number {
  display: inline-flex;
  width: 2.65rem;
  height: 2.65rem;
  min-width: 2.65rem;
  min-height: 2.65rem;
  margin: 0;
  border-radius: 50%;
  align-self: center;
  justify-self: start;
  align-items: center;
  justify-content: center;
  background: var(--accent-strong);
  font-weight: 800;
  line-height: 1;
  color: white;
}
.term-list details {
  border-top: 1px solid var(--line);
  padding: 1rem 0;
}
.term-list summary { cursor: pointer; font-weight: 800; font-size: 1.03rem; }
.term-body { max-width: 60rem; padding: .6rem 0 .3rem; }
.term-note { color: var(--ink-soft); }
.depth-section { margin: 2.25rem 0 1.5rem; }
.depth-section > h2 { margin-bottom: .35rem; }
.depth-section-intro { max-width: 66rem; margin-top: 0; color: var(--ink-soft); }
.depth-list {
  margin-top: 1.1rem;
  border-block: 1px solid var(--line);
}
.depth-list details { border-top: 1px solid var(--line); background: rgba(11,10,13,.72); }
.depth-list details:first-child { border-top: 0; }
.depth-list details[open] { background: linear-gradient(120deg, rgba(108,74,162,.16), rgba(11,10,13,.92)); }
.depth-list summary {
  cursor: pointer;
  padding: .95rem 1rem;
  color: var(--ink);
  font-size: 1rem;
  font-weight: 800;
}
.depth-list summary::marker { color: var(--accent); }
.depth-body { max-width: 72rem; padding: 0 1rem 1rem; color: var(--ink-soft); }
.depth-body p { margin: .65rem 0; }
.depth-practice { color: var(--ink); }

fieldset { border: 1px solid var(--line); border-radius: var(--radius); padding: 1rem; margin: 1.15rem 0; }
legend { font-weight: 800; padding: 0 .4rem; }
select, input[type="text"], textarea {
  width: 100%;
  border: 2px solid var(--line);
  border-radius: .55rem;
  padding: .7rem;
  background: var(--surface-soft);
  color: var(--ink);
  color-scheme: dark;
}
label { display: block; font-weight: 700; margin-top: 1.1rem; }
.checkbox-label { display: flex; gap: .7rem; align-items: flex-start; font-weight: 500; }
.checkbox-label input { margin-top: .35rem; transform: scale(1.25); }
.question-group { margin: 1.45rem 0; }
.question-item {
  border: 1px solid var(--line);
  border-radius: .75rem;
  padding: 1rem;
  margin: .8rem 0;
}
.question-item fieldset { border: 0; padding: 0; margin: 0; }
.question-item legend { font-size: .98rem; padding: 0; margin-bottom: .65rem; }
.radio-row { display: grid; grid-template-columns: repeat(4, minmax(0,1fr)); gap: .5rem; }
.radio-option { display: flex; gap: .4rem; align-items: flex-start; font-weight: 500; margin: 0; padding: .55rem; border-radius: .45rem; background: var(--surface-soft); }
.results { border-top: .35rem solid var(--accent); margin-top: 2rem; padding-top: 1.2rem; }
.result-section { margin: 1.5rem 0; }
.resource-category { margin: 2rem 0; }
.resource-item { padding: 1rem 0; border-top: 1px solid var(--line); }
.resource-meta { color: var(--ink-soft); font-size: .88rem; }
.resource-access-note { max-width: 72rem; margin: 1rem 0 1.25rem; padding: .75rem .9rem; border-left: .25rem solid var(--accent-strong); background: rgba(170,130,232,.07); }
.resource-access-note h2 { margin: 0 0 .3rem; color: var(--ink); font-size: 1rem; }
.resource-access-note p { margin: 0; color: var(--ink-soft); font-size: .9rem; }
.resource-filters { display: grid; grid-template-columns: auto minmax(10rem, 1fr); gap: .6rem; align-items: center; max-width: 32rem; margin: 1.3rem 0; padding: .9rem; border: 1px solid var(--line); border-radius: var(--radius); background: var(--surface-soft); }
.resource-filters label { margin: 0; }
.resource-heading { display: flex; flex-wrap: wrap; gap: .7rem; align-items: baseline; }
.resource-heading h3 { margin-bottom: 0; }
.format-badge { padding: .18rem .5rem; border: 1px solid var(--accent-strong); border-radius: 999px; color: var(--accent); font-size: .72rem; text-transform: uppercase; letter-spacing: .05em; }
.resource-theme { color: var(--ink-soft); font-size: .9rem; }
.book-list { margin-top: 2.5rem; padding-top: 1rem; border-top: 1px solid var(--line); }
.book-list ul { columns: 2; column-gap: 2rem; }
.book-list li { break-inside: avoid; margin-bottom: .35rem; }
.book-list a { text-underline-offset: .18em; }
.about-layout { display: grid; grid-template-columns: minmax(15rem, 22rem) minmax(0, 1fr); gap: clamp(1.5rem, 4vw, 3.5rem); align-items: start; margin-top: 3rem; }
.about-portrait { margin: 0; }
.about-portrait img { width: 100%; aspect-ratio: 4 / 5; object-fit: cover; object-position: 50% 30%; border-radius: var(--radius); border: 1px solid var(--line); box-shadow: 0 1.25rem 3rem rgba(0,0,0,.18); }
.about-copy h2 { margin-top: 0; }
.result-note { margin-top: 1.2rem; padding: .8rem 1rem; border-left: .35rem solid var(--accent); background: var(--surface-warm); }
.small { font-size: .86rem; color: var(--ink-soft); }

.site-footer {
  border-top: 1px solid var(--line);
  background: var(--surface-soft);
  padding: 2rem max(1rem, calc((100vw - var(--max)) / 2));
  font-size: .86rem;
}
.simple-mode .lead { max-width: 64rem; }
.simple-only { display: none; }
.simple-mode .standard-only { display: none !important; }
.simple-mode .simple-only { display: block; }

html[data-color-mode="light"] .site-header { background: rgba(250,248,244,.96); }
html[data-color-mode="light"] :is(.hero, .read-tools, .card, .content-block, .depth-list details, .toolkit-lightbox) { background: #fff; }
html[data-color-mode="light"] :is(.summary-box, .practice-panel, .editorial-visual, .depth-list details[open]) { background: #f2eee8; }
html[data-color-mode="light"] .transparency-note { background: rgba(255,255,255,.55); }
html[data-color-mode="light"] .motion-toggle { background: rgba(255,255,255,.94); }
html[data-color-mode="light"] :is(.reflection-prompt, .depth-practice) { color: #32273c; }
html[data-color-mode="light"] .shore-motion { opacity: .2; filter: grayscale(.65); }
html[data-color-mode="light"] .toolkit-lightbox::backdrop { background: rgba(28,24,32,.72); }

html[data-color-mode="high-contrast"] :is(.site-header, .hero, .read-tools, .card, .content-block, .summary-box, .practice-panel, .editorial-visual, .depth-list details, .depth-list details[open], .toolkit-lightbox) {
  background: #000;
  border-color: #fff;
  box-shadow: none;
}
html[data-color-mode="high-contrast"] :is(.transparency-note, .resource-access-note) { background: #000; border-color: #fff; }
html[data-color-mode="high-contrast"] :is(.reflection-prompt, .depth-practice) { color: #fff; }
html[data-color-mode="high-contrast"] .shore-motion { display: none; }
html[data-color-mode="high-contrast"] .motion-toggle { display: none; }
html[data-color-mode="high-contrast"] .button.primary { border-color: #ffe600; color: #fff; }

html[data-color-mode="grayscale"] :is(.site-header, .hero, .read-tools, .card, .content-block, .summary-box, .practice-panel, .editorial-visual, .depth-list details, .depth-list details[open], .toolkit-lightbox) {
  background: var(--surface-soft);
}
html[data-color-mode="grayscale"] :is(img, .shore-motion) { filter: grayscale(1); }
html[data-color-mode="grayscale"] :is(.reflection-prompt, .depth-practice) { color: var(--ink); }

html[data-font-scale="large"] .site-header,
html[data-font-scale="xlarge"] .site-header {
  grid-template-columns: 1fr auto;
  grid-template-areas:
    "actions actions"
    "brand toggle"
    "nav nav";
}
html[data-font-scale="large"] .nav-toggle,
html[data-font-scale="xlarge"] .nav-toggle { display: inline-block; justify-self: end; }
html[data-font-scale="large"] .main-nav,
html[data-font-scale="xlarge"] .main-nav { display: none; flex-direction: column; align-items: flex-start; padding: .8rem 0; white-space: normal; }
html[data-font-scale="large"] .main-nav.open,
html[data-font-scale="xlarge"] .main-nav.open { display: flex; }

@media (max-width: 84rem) {
  .site-header {
    grid-template-columns: 1fr auto;
    grid-template-areas:
      "actions actions"
      "brand toggle"
      "nav nav";
  }
  .nav-toggle { display: inline-block; justify-self: end; }
  .main-nav { display: none; flex-direction: column; align-items: flex-start; padding: .8rem 0; white-space: normal; }
  .main-nav.open { display: flex; }
  .cards.four { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 48rem) {
  .about-layout { grid-template-columns: 1fr; }
  .about-portrait { max-width: 24rem; }
  .book-list ul { columns: 1; }
}
@media (hover: none) and (pointer: coarse) {
  .shore-motion,
  .motion-toggle { display: none !important; }
  .shore-motion span { animation: none !important; }
}
@media (max-width: 46rem) {
  body { background: var(--surface); font-size: .98rem; }
  main { padding-inline: 1rem; }
  .header-actions {
    display: grid;
    grid-template-columns: auto auto minmax(0, .9fr) minmax(0, 1.25fr);
    gap: .25rem;
    align-items: stretch;
  }
  .header-actions :is(.lang-button, .plain-button, .accessibility-menu > summary) {
    width: 100%;
    min-width: 0;
    min-height: 2.25rem;
    padding: .28rem .3rem;
    font-size: clamp(.66rem, 3vw, .78rem);
    line-height: 1.15;
    white-space: normal;
    text-align: center;
  }
  .accessibility-menu {
    position: static;
    width: auto;
  }
  .accessibility-menu > summary { display: flex; align-items: center; justify-content: center; }
  .accessibility-panel {
    position: absolute;
    top: calc(100% + .55rem);
    right: 0;
    left: 0;
    width: auto;
    max-height: calc(100dvh - 5rem);
    margin: 0;
    overflow: auto;
    overscroll-behavior: contain;
  }
  .brand-logo { width: 2.7rem; height: 2.7rem; }
  .hero { margin-top: .2rem; padding-top: 1.65rem; }
  .cards.four, .content-grid, .radio-row { grid-template-columns: 1fr; }
  .site-header { position: relative; }
  .shore-motion,
  .motion-toggle,
  html[data-color-mode="light"] .shore-motion,
  html[data-color-mode="grayscale"] .shore-motion { display: none !important; }
  .shore-motion span { animation: none !important; }
  .resource-filters { grid-template-columns: 1fr; }
  .toolkit-pages { grid-template-columns: 1fr; }
  .toolkit-lightbox { width: 100vw; max-height: 100vh; border-radius: 0; }
  .lightbox-shell { max-height: 100vh; }
  .lightbox-viewer { grid-template-columns: 1fr 1fr; }
  .lightbox-viewer img { grid-column: 1 / -1; grid-row: 1; max-height: calc(100vh - 11rem); }
  .lightbox-nav { min-width: 0; grid-row: 2; }
  .book-list ul { columns: 1; }
}
@media (max-width: 38rem) {
  .brand-kicker, .brand-title { white-space: normal; }
}
@media print {
  .site-header, .site-footer, .read-tools, .hero-actions, .form-actions, .skip-link, .shore-motion, .motion-toggle, .resource-filters, .toolkit-lightbox, .accessibility-menu { display: none !important; }
  main { max-width: none; padding: 0; }
  .page { display: none !important; }
  .page.active, #reflection-results:not([hidden]) { display: block !important; }
  body { background: white; font-size: 11pt; color: black; }
  a { color: black; }
  .hero, .card, .content-block, .notice, .questions-box, .toolkit-resource, .question-item, .radio-option {
    background: white;
    color: black;
    border-color: #999;
  }
  .card, .content-block, .question-item { box-shadow: none; break-inside: avoid; }
  .depth-list details > .depth-body { display: block !important; }
}
