/* V471: complete V431 visual baseline, applied only on MacBook/desktop. */
@media (min-width: 768px) {
:root {
  --bg: #0d1117;
  --card: #151b23;
  --muted: #8b949e;
  --line: #30363d;
  --text: #f0f6fc;
  --accent: #58a6ff;
  --accent2: #3fb950;
  --warn: #f2cc60;
}

/* V607: keep the mobile hero readable and blend the photo into the page like desktop. */
@media (max-width: 620px) {
  .darwinLanding .hero-section {
    grid-template-columns: minmax(0, 1.12fr) minmax(0, .88fr);
    gap: 4px;
    overflow: hidden;
  }
  .darwinLanding .hero-copy {
    position: relative;
    z-index: 2;
  }
  .darwinLanding .hero-title {
    font-size: clamp(13px, 3.75vw, 15px);
    line-height: 1.5;
    letter-spacing: 0;
  }
  .darwinLanding .hero-title-nowrap {
    white-space: normal !important;
  }
  .darwinLanding .hero-photo {
    z-index: 1;
    width: calc(100% + 18px);
    margin-left: -18px;
    border: 0;
    border-radius: 0;
    background: transparent;
    box-shadow: none;
    overflow: hidden;
  }
  .darwinLanding .hero-photo::before,
  .darwinLanding .hero-photo::after {
    content: none;
  }
  .darwinLanding .hero-photo img {
    object-position: 57% 50%;
    -webkit-mask-image: linear-gradient(to right, transparent 0%, rgba(0,0,0,.22) 10%, #000 34%, #000 100%);
    mask-image: linear-gradient(to right, transparent 0%, rgba(0,0,0,.22) 10%, #000 34%, #000 100%);
  }
}

/* V608: approved editorial mobile hero — headline, arch photo, copy, CTA. */
@media (max-width: 620px) {
  .darwinLanding .hero-section {
    position: relative;
    isolation: isolate;
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    grid-template-areas:
      "eyebrow"
      "title"
      "photo"
      "lead"
      "actions"
      "note";
    width: calc(100% - 32px);
    margin: 0 auto 30px;
    padding: 36px 0 8px;
    gap: 0;
    overflow: hidden;
  }
  .darwinLanding .hero-section::before {
    content: "";
    position: absolute;
    z-index: 0;
    top: 250px;
    left: -18%;
    width: 128%;
    height: 520px;
    border: 1px solid rgba(91, 124, 94, .38);
    border-radius: 48% 52% 46% 54%;
    transform: rotate(-7deg);
    pointer-events: none;
  }
  .darwinLanding .hero-copy { display: contents; }
  .darwinLanding .hero-copy .eyebrow,
  .darwinLanding .hero-title,
  .darwinLanding .hero-lead,
  .darwinLanding .hero-actions,
  .darwinLanding .hero-note,
  .darwinLanding .hero-photo {
    position: relative;
    z-index: 2;
  }
  .darwinLanding .hero-copy .eyebrow {
    grid-area: eyebrow;
    margin: 0 0 16px;
    font-size: 12px;
    font-weight: 700;
    line-height: 1.5;
    letter-spacing: .04em;
  }
  .darwinLanding .hero-title {
    grid-area: title;
    max-width: none;
    margin: 0;
    font-size: clamp(28px, 7.7vw, 32px);
    font-weight: 500;
    line-height: 1.38;
    letter-spacing: -.025em;
    text-wrap: initial;
  }
  .darwinLanding .hero-title br { display: initial; }
  .darwinLanding .hero-title-nowrap { white-space: nowrap !important; }
  .darwinLanding .hero-photo {
    grid-area: photo;
    justify-self: end;
    width: 88%;
    height: 205px;
    min-height: 205px;
    margin: 22px 0 22px;
    border: 0;
    border-radius: 50% 50% 14px 14px / 42% 42% 8px 8px;
    background: transparent;
    box-shadow: none;
    overflow: hidden;
  }
  .darwinLanding .hero-photo::before,
  .darwinLanding .hero-photo::after { content: none; }
  .darwinLanding .hero-photo img {
    width: 100%;
    height: 205px;
    min-height: 205px;
    object-fit: cover;
    object-position: 52% 48%;
    -webkit-mask-image: linear-gradient(to bottom, #000 0%, #000 72%, rgba(0,0,0,.82) 84%, transparent 100%);
    mask-image: linear-gradient(to bottom, #000 0%, #000 72%, rgba(0,0,0,.82) 84%, transparent 100%);
  }
  .darwinLanding .hero-lead {
    grid-area: lead;
    max-width: none;
    margin: 0 4px 20px;
    font-size: 15px;
    line-height: 1.82;
  }
  .darwinLanding .hero-actions {
    grid-area: actions;
    display: grid;
    grid-template-columns: 1fr;
    width: calc(100% - 36px);
    margin: 0 auto;
  }
  .darwinLanding .hero-actions > *,
  .darwinLanding .hero-actions .primary-button {
    width: 100%;
  }
  .darwinLanding .hero-actions .primary-button {
    min-height: 56px;
    padding: 14px 18px;
    border-radius: 999px;
    font-size: 16px;
    line-height: 1.4;
  }
  .darwinLanding .hero-note {
    grid-area: note;
    margin: 14px 0 0;
    text-align: center;
    font-size: 12px;
    line-height: 1.65;
  }
}

@media (max-width: 620px) {
  .darwinLanding .hero-title { font-size: clamp(27px,7.2vw,29px); }
}

/* V609 final: pixel-matched mobile composition from the approved reference. */
@media (max-width: 620px) {
  .darwinLanding .hero-section {
    grid-template-areas: "eyebrow" "title" "photo" "lead" "actions" "note";
    width: calc(100% - 56px);
    margin: 0 auto 30px;
    padding: 40px 0 8px;
    overflow: visible;
  }
  .darwinLanding .hero-section::before { content: none; }
  .darwinLanding .hero-copy .eyebrow {
    margin: 0 0 18px;
    font-size: 12px;
    line-height: 1.5;
    letter-spacing: .035em;
  }
  .darwinLanding .hero-title {
    margin: 0;
    font-size: clamp(25px,6.65vw,27px);
    line-height: 1.55;
    letter-spacing: -.025em;
  }
  .darwinLanding .hero-title br { display: initial; }
  .darwinLanding .hero-title-nowrap { white-space: nowrap !important; }
  .darwinLanding .hero-photo {
    justify-self: center;
    width: calc(100% + 56px);
    height: auto;
    min-height: 0;
    margin: 0 -28px 8px;
    border: 0;
    border-radius: 0;
    overflow: visible;
  }
  .darwinLanding .hero-photo picture { display: block; width: 100%; }
  .darwinLanding .hero-photo img {
    display: block;
    width: 100%;
    height: auto;
    min-height: 0;
    object-fit: contain;
    object-position: center;
    -webkit-mask-image: none;
    mask-image: none;
  }
  .darwinLanding .hero-lead {
    margin: 0 6px 26px;
    font-size: 14px;
    line-height: 1.9;
  }
  .darwinLanding .hero-actions {
    width: calc(100% - 48px);
    margin: 0 auto;
  }
  .darwinLanding .hero-actions .primary-button {
    min-height: 54px;
    padding: 14px 16px;
    font-size: 16px;
  }
  .darwinLanding .hero-note {
    margin: 14px -8px 0;
    font-size: 12px;
    line-height: 1.65;
  }
}

* { box-sizing: border-box; }
html, body { padding: 0; margin: 0; background: radial-gradient(circle at top, #111827 0%, var(--bg) 52%); color: var(--text); font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif; }
button { font: inherit; }
.app { width: min(980px, 100%); margin: 0 auto; padding: 28px 18px 60px; }
.header { margin-bottom: 22px; }
.brand { display: flex; align-items: center; gap: 14px; }
.logo { width: 46px; height: 46px; border-radius: 16px; background: linear-gradient(135deg, var(--accent), var(--accent2)); display: grid; place-items: center; font-weight: 900; color: white; box-shadow: 0 14px 28px rgba(88,166,255,.22); }
h1 { margin: 0; font-size: clamp(26px, 4vw, 42px); }
h2 { font-size: clamp(24px, 4vw, 34px); margin: 0 0 14px; }
h3 { margin: 22px 0 8px; }
.sub { color: var(--muted); line-height: 1.75; }
.card { background: rgba(21, 27, 35, .92); border: 1px solid var(--line); border-radius: 26px; padding: clamp(18px, 4vw, 34px); box-shadow: 0 24px 60px rgba(0,0,0,.28); }
.grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; margin: 22px 0; }
.core { border: 1px solid var(--line); border-radius: 20px; padding: 18px; background: rgba(255,255,255,.03); }
.core h3 { margin-top: 0; }
.core p { color: var(--muted); line-height: 1.65; }
.actions { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 22px; }
.btn { border: 0; background: var(--accent); color: #06111f; font-weight: 800; padding: 14px 20px; border-radius: 999px; cursor: pointer; transition: transform .12s ease, opacity .12s ease; }
.btn:hover { transform: translateY(-1px); }
.btn:disabled { opacity: .45; cursor: not-allowed; transform: none; }
.btn.secondary { background: #263241; color: var(--text); border: 1px solid var(--line); }
.status { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 14px; }
.pill { border: 1px solid var(--line); background: rgba(255,255,255,.04); color: var(--text); padding: 8px 12px; border-radius: 999px; }
.progress { height: 10px; background: #0b1220; border-radius: 999px; overflow: hidden; border: 1px solid var(--line); margin: 12px 0 24px; }
.progress span { display: block; height: 100%; background: linear-gradient(90deg, var(--accent), var(--accent2)); }
.answerGrid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 12px; margin: 24px 0; }
.answer { padding: 18px 12px; border-radius: 18px; border: 1px solid var(--line); background: rgba(255,255,255,.04); color: var(--text); cursor: pointer; font-weight: 800; }
.answer.selected { background: rgba(88,166,255,.18); border-color: var(--accent); box-shadow: inset 0 0 0 1px var(--accent); }
.notice { color: var(--warn); font-size: 12px; line-height: 1.7; }
.small { font-size: 14px; color: var(--muted); line-height: 1.8; }
.mono { font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace; white-space: pre-wrap; }
details { margin-top: 20px; border-top: 1px solid var(--line); padding-top: 18px; }
summary { cursor: pointer; color: var(--accent); font-weight: 400; }
.results .scoreBlock { margin: 18px 0; }
.barRow { display: grid; grid-template-columns: 160px 1fr 80px; align-items: center; gap: 12px; }
.bar { height: 14px; background: #0b1220; border: 1px solid var(--line); border-radius: 999px; overflow: hidden; }
.bar span { display: block; height: 100%; background: linear-gradient(90deg, var(--accent), var(--accent2)); }
.logList { display: grid; gap: 8px; margin-top: 12px; }
.logItem { border: 1px solid var(--line); border-radius: 14px; padding: 10px 12px; color: var(--muted); background: rgba(255,255,255,.03); line-height: 1.6; }
@media (max-width: 720px) {
  .grid { grid-template-columns: 1fr; }
  .answerGrid { grid-template-columns: 1fr; }
  .barRow { grid-template-columns: 1fr; gap: 8px; }
  .app { padding: 18px 12px 40px; }
}
.label { display: block; margin: 18px 0 8px; font-weight: 400; }
.input { width: 100%; padding: 14px 16px; border-radius: 14px; border: 1px solid var(--line); background: rgba(255,255,255,.04); color: var(--text); font: inherit; }
.big { font-size: 24px; font-weight: 900; color: var(--text); margin: 8px 0 0; }
.linkItem { display: block; text-decoration: none; }
.linkItem:hover { border-color: var(--accent); color: var(--text); }


/* v13 front rework: parent-child forest theme */
:root {
  --bg: #f3f7ee;
  --card: #fffdf7;
  --muted: #60715d;
  --line: #d7e4cf;
  --text: #20301f;
  --accent: #5ca66b;
  --accent2: #e2a84b;
  --warn: #8a6a22;
}
html, body {
  background:
    radial-gradient(circle at 10% 0%, rgba(129, 199, 132, .25), transparent 34%),
    radial-gradient(circle at 90% 20%, rgba(226, 168, 75, .18), transparent 28%),
    linear-gradient(180deg, #f7fbf1 0%, #eef6e8 100%);
  color: var(--text);
}
.card {
  background: rgba(255, 253, 247, .96);
  border: 1px solid var(--line);
  box-shadow: 0 22px 52px rgba(55, 85, 45, .13);
}
.logo {
  background: linear-gradient(135deg, #65b875, #e2a84b);
  box-shadow: 0 14px 28px rgba(92,166,107,.22);
}
.sub, .small, .core p { color: var(--muted); }
.core {
  background: rgba(92,166,107,.055);
  border-color: var(--line);
}
.btn {
  background: var(--accent);
  color: #ffffff;
}
.btn.secondary {
  background: #eef6e8;
  color: var(--text);
  border: 1px solid var(--line);
}
.pill {
  background: rgba(92,166,107,.09);
  color: var(--text);
  border-color: var(--line);
}
.answer {
  background: #ffffff;
  color: var(--text);
  border-color: var(--line);
}
.answer.selected {
  background: rgba(92,166,107,.18);
  border-color: var(--accent);
  box-shadow: inset 0 0 0 1px var(--accent);
}
.bar, .progress {
  background: #e7efe0;
  border-color: var(--line);
}
.bar span, .progress span {
  background: linear-gradient(90deg, var(--accent), var(--accent2));
}
.notice { color: var(--warn); }
.eyebrow {
  margin: 0 0 10px;
  color: var(--accent);
  font-weight: 800;
  letter-spacing: .04em;
}
.forestHero {
  display: grid;
  grid-template-columns: 1fr auto;
  gap: 18px;
  align-items: center;
}
.forestBadge {
  width: 92px;
  height: 92px;
  display: grid;
  place-items: center;
  border-radius: 30px;
  background: linear-gradient(135deg, rgba(92,166,107,.18), rgba(226,168,75,.16));
  font-size: 48px;
  border: 1px solid var(--line);
}
.parentGuide {
  margin: 22px 0;
  padding: 18px;
  border: 1px solid var(--line);
  border-radius: 20px;
  background: rgba(255,255,255,.68);
}
.parentGuide h3 { margin-top: 0; }
.parentGuide p { margin: 7px 0; color: var(--muted); line-height: 1.7; }
.forestProgress { margin: 12px 0 28px; }
.forestTrail {
  position: relative;
}
.trailScene {
  position: relative;
  height: 142px;
  border-radius: 28px;
  overflow: hidden;
  border: 1px solid rgba(94, 129, 95, 0.24);
  background: linear-gradient(180deg, rgba(255,255,255,0.96), rgba(233, 244, 229, 0.98));
  box-shadow: inset 0 1px 0 rgba(255,255,255,0.86), 0 12px 26px rgba(57, 88, 59, 0.10);
}
.trailScene::before {
  content: '';
  position: absolute;
  inset: 0;
  background: radial-gradient(circle at 16% 20%, rgba(255,255,255,0.34), transparent 24%), radial-gradient(circle at 82% 24%, rgba(255,255,255,0.24), transparent 18%);
  pointer-events: none;
  z-index: 1;
}
.trailScene::after {
  content: '';
  position: absolute;
  inset: 0;
  background: linear-gradient(180deg, transparent 0%, transparent 72%, rgba(34, 58, 37, 0.06) 100%);
  pointer-events: none;
  z-index: 1;
}
.trailSceneBg,
.trailSceneActive {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
}
.trailSceneBg { z-index: 0; }
.trailActiveClip {
  position: absolute;
  inset: 0 auto 0 0;
  overflow: hidden;
  transition: width .42s ease;
  z-index: 2;
}
.trailMarker {
  position: absolute;
  top: 63%;
  transform: translate(-50%, -50%);
  transition: left .42s ease;
  width: 66px;
  height: 66px;
  z-index: 3;
  animation: trailWalkerFloat 1.8s ease-in-out infinite;
}
.trailBoySvg {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  filter: drop-shadow(0 10px 14px rgba(28, 42, 30, 0.22));
}
.forestLabels {
  display: flex;
  justify-content: space-between;
  margin-top: 10px;
  padding: 0 2px;
  font-size: 13px;
  color: var(--muted);
}
@keyframes trailWalkerFloat {
  0%, 100% { transform: translate(-50%, -50%) translateY(0); }
  50% { transform: translate(-50%, -50%) translateY(-2px); }
}
@media (max-width: 720px) {
  .trailScene {
    height: 118px;
    border-radius: 22px;
  }
  .trailMarker {
    width: 54px;
    height: 54px;
    top: 64%;
  }
}

.testCard h2 { margin-top: 10px; }
@media (max-width: 720px) {
  .forestHero { grid-template-columns: 1fr; }
  .forestBadge { width: 74px; height: 74px; font-size: 40px; }
}


.attentionBox {
  margin: 16px 0;
  padding: 16px;
  border: 1px solid #fde68a;
  background: #fffbeb;
  border-radius: 18px;
  color: #713f12;
}
.attentionBox h3 {
  margin: 0 0 8px;
}
.attentionBox p {
  margin: 4px 0;
}
.parentMini {
  margin-top: 12px;
  padding-top: 10px;
  border-top: 1px solid #fde68a;
  font-size: 0.92rem;
  line-height: 1.7;
}
.measurementMemo {
  margin: 18px 0;
  padding: 16px;
  border: 1px solid #bfdbfe;
  background: #eff6ff;
  border-radius: 18px;
  color: #1e3a8a;
}
.measurementMemo h3 {
  margin: 0 0 8px;
}
.measurementMemo p {
  margin: 4px 0;
}


/* v35 experimental nature interface: reversible prototype */
.app.forest {
  width: min(1120px, 100%);
}
.app.forest .header {
  background: rgba(255, 253, 247, 0.82);
  border: 1px solid rgba(205, 221, 194, 0.86);
  border-radius: 24px;
  padding: 16px 18px;
  box-shadow: 0 12px 34px rgba(69, 92, 62, 0.08);
}
.app.forest .brand h1 {
  font-size: clamp(24px, 3.2vw, 34px);
}
.app.forest .testCard {
  padding: 24px;
  background: rgba(255, 253, 247, 0.985);
  border-radius: 30px;
  border-color: rgba(202, 216, 190, 0.95);
}
.app.forest .testCard > h2 {
  text-align: center;
  margin-top: 26px;
  font-size: clamp(26px, 4vw, 40px);
  color: #41563b;
}
.app.forest .testCard > .sub {
  text-align: center;
  max-width: 720px;
  margin: 0 auto 18px;
  color: #4e5c4c;
  font-weight: 650;
}
.app.forest .status {
  justify-content: center;
  gap: 10px;
  margin-bottom: 18px;
}
.app.forest .assessmentStatus {
  align-items: flex-start;
  justify-content: space-between;
}
.app.forest .parentSignal {
  display: inline-flex;
  flex-direction: column;
  gap: 2px;
  min-width: 156px;
  padding: 9px 12px;
  border-radius: 16px;
  border: 1px solid #ded6c7;
  background: #f8f4e9;
  color: #56624d;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.8);
}
.app.forest .parentSignal span {
  font-size: 12px;
  font-weight: 800;
  letter-spacing: .04em;
  color: #7a806f;
}
.app.forest .parentSignal strong {
  font-size: 13px;
  line-height: 1.25;
  color: #41563b;
}
.app.forest .statusPills {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-end;
  gap: 10px;
}
.app.forest .pill {
  background: #f8f4e9;
  border-color: #ded6c7;
  color: #56624d;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.8);
}
.forestMapProgress {
  margin: 10px 0 30px;
}
.forestMapTop {
  display: flex;
  justify-content: space-between;
  margin: 0 8px 8px;
  color: #557051;
  font-weight: 850;
  font-size: 13px;
}
.forestMapStage {
  position: relative;
  height: 190px;
  overflow: hidden;
  border-radius: 22px;
  border: 1px solid rgba(184, 204, 174, 0.88);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.85), 0 10px 28px rgba(58, 82, 52, .09);
}
.forestMapArt {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
}
.forestNodes {
  position: absolute;
  left: 0;
  right: 0;
  top: 110px;
  height: 48px;
}
.forestNode {
  position: absolute;
  transform: translate(-50%, -50%);
  width: 38px;
  height: 38px;
  border-radius: 999px;
  display: grid;
  place-items: center;
  background: rgba(255,255,255,.92);
  color: #6b6f65;
  border: 1px solid #d8d5c7;
  font-weight: 850;
  box-shadow: 0 6px 14px rgba(75, 94, 69, .12);
}
.forestNode.done {
  background: #769867;
  color: white;
  border-color: #6d8d60;
}
.forestNode.active {
  background: #c39764;
  color: white;
  border-color: #b6854e;
  box-shadow: 0 0 0 6px rgba(195,151,100,.18), 0 8px 18px rgba(120, 89, 52, .16);
}
.mapBoy {
  position: absolute;
  top: 80px;
  transform: translate(-50%, -54%);
  width: 58px;
  height: 64px;
  transition: left .45s ease;
  filter: drop-shadow(0 7px 11px rgba(53, 73, 49, .16));
}
.mapBoy svg {
  width: 100%;
  height: 100%;
}
.app.forest .playActions {
  justify-content: center;
  margin-top: 16px;
}
.app.forest .playBtn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 190px;
  min-height: 72px;
  font-size: 20px;
  background: #52723d;
  box-shadow: 0 10px 24px rgba(67, 91, 58, .20);
}
.app.forest .playBtn::before {
  content: '▶';
  display: inline-grid;
  place-items: center;
  width: 46px;
  height: 46px;
  border-radius: 50%;
  margin-right: 12px;
  background: rgba(255,255,255,.18);
}
.app.forest .natureAnswerGrid {
  max-width: 820px;
  margin: 28px auto 0;
}
.app.forest .answer {
  min-height: 78px;
  font-size: 23px;
  border-radius: 18px;
  background: rgba(255,255,255,.96);
  box-shadow: 0 10px 24px rgba(72, 82, 62, .08);
}
.app.forest .answer:nth-child(1) {
  color: #477147;
  border-color: #8bb686;
}
.app.forest .answer:nth-child(2) {
  color: #2f5d9d;
  border-color: #86a8dc;
}
.app.forest .answer:nth-child(3) {
  color: #6d6861;
  border-color: #c9c0b7;
}
.app.forest .answer.selected {
  background: #f5f9ef;
  border-color: #5ca66b;
  box-shadow: inset 0 0 0 2px rgba(92,166,107,.26), 0 12px 24px rgba(74, 103, 66, .12);
}
.app.forest .testCard .small {
  text-align: center;
}
@media (max-width: 720px) {
  .app.forest .testCard { padding: 16px; }
  .app.forest .assessmentStatus { justify-content: flex-start; }
  .app.forest .statusPills { justify-content: flex-start; }
  .forestMapStage { height: 154px; }
  .forestNodes { top: 95px; }
  .forestNode { width: 30px; height: 30px; font-size: 13px; }
  .mapBoy { top: 66px; width: 45px; height: 52px; }
  .app.forest .playBtn { min-height: 54px; font-size: 20px; }
}


/* v41 core transition pages - visual flow only. Audio content and scoring are unchanged from v39. */
.simpleProgress {
  height: 20px;
  width: 100%;
  border-radius: 999px;
  overflow: hidden;
  border: 1px solid #d7e4cf;
  background: #eaf2e4;
  margin: 4px 0 28px;
  box-shadow: inset 0 1px 2px rgba(68, 91, 61, .08);
}
.simpleProgress span {
  display: block;
  height: 100%;
  border-radius: 999px;
  background: linear-gradient(90deg, #52723d, #7aa46a);
  transition: width .38s ease;
}
.coreCompleteCard {
  max-width: 1120px;
  margin: 0 auto;
}
/* v331: core completion page aligned with LP's calm cream/green world. Text/content only; no scoring or flow logic changes. */
.completePanel {
  min-height: 170px;
  display: grid;
  place-items: center;
  text-align: center;
  padding: clamp(34px, 5vw, 58px);
  border: 1px solid #e7dccb;
  border-radius: 34px;
  background:
    radial-gradient(circle at 12% 0%, rgba(255, 250, 240, 0.92), transparent 44%),
    radial-gradient(circle at 88% 8%, rgba(223, 234, 221, 0.82), transparent 36%),
    rgba(255, 250, 242, 0.88);
  color: #1f2a24;
  box-shadow: 0 18px 50px rgba(40, 60, 49, 0.08);
  position: relative;
  overflow: hidden;
}
.completePanel::before {
  content: '';
  position: absolute;
  inset: 14px;
  border: 1px solid rgba(52, 93, 70, 0.10);
  border-radius: 26px;
  pointer-events: none;
}
.completePanel::after {
  content: '';
  position: absolute;
  width: 118px;
  height: 118px;
  right: -34px;
  bottom: -42px;
  border-radius: 999px;
  background: rgba(201, 163, 92, 0.10);
  pointer-events: none;
}
.completePanel h2 {
  color: #234434;
  margin: 0 0 18px;
  font-size: clamp(30px, 4.1vw, 46px);
  line-height: 1.24;
  letter-spacing: -0.05em;
  font-weight: 900;
  position: relative;
  z-index: 1;
}
.completePanel .sub {
  color: #516159;
  margin: 2px auto;
}
.completePanelCopyV329 {
  display: grid;
  gap: 8px;
  color: #516159;
  font-size: clamp(18px, 2.05vw, 23px);
  font-weight: 760;
  line-height: 1.85;
  position: relative;
  z-index: 1;
}
.completePanelCopyV329 p {
  margin: 0;
}
.completeActions {
  justify-content: flex-end;
  border-top: 1px solid #e1eadb;
  padding-top: 22px;
}
.app.forest .coreIntroCard {
  max-width: 920px;
  margin: 0 auto;
}
.app.forest .coreIntroCard > h2 {
  text-align: center;
  color: #41563b;
  font-size: clamp(28px, 4.2vw, 42px);
}
.app.forest .coreIntroCard > .sub {
  max-width: 760px;
  margin-left: auto;
  margin-right: auto;
  text-align: center;
  font-weight: 650;
}
@media (max-width: 720px) {
  .completeActions { justify-content: stretch; }
  .completeActions .btn { width: 100%; }
  .completePanel { min-height: 150px; }
}


/* Development-only table of contents. Remove before production launch. */
.devMenuCard {
  max-width: 1120px;
}

.devMenuGrid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
  gap: 14px;
  margin: 24px 0;
}

.devMenuBtn {
  text-align: left;
  border: 1px solid rgba(91, 120, 79, 0.22);
  background: rgba(255, 255, 255, 0.72);
  border-radius: 22px;
  padding: 18px;
  cursor: pointer;
  box-shadow: 0 10px 26px rgba(57, 79, 54, 0.08);
  transition: transform .16s ease, box-shadow .16s ease, border-color .16s ease;
}

.devMenuBtn:hover {
  transform: translateY(-2px);
  box-shadow: 0 14px 30px rgba(57, 79, 54, 0.12);
  border-color: rgba(91, 120, 79, 0.38);
}

.devMenuBtn strong {
  display: block;
  color: #2f4b2f;
  font-size: 1.04rem;
  margin-bottom: 6px;
}

.devMenuBtn span {
  display: block;
  color: #6a7663;
  font-size: .92rem;
  line-height: 1.45;
}

.resultMailBox {
  margin: 16px 0 18px;
  padding: 14px 16px;
  border-radius: 18px;
  background: rgba(255, 255, 255, 0.72);
  border: 1px solid rgba(111, 136, 103, 0.22);
}

.resultMailBox p {
  margin: 4px 0;
}

.optionalMailConsent {
  margin-top: 14px;
  align-items: flex-start;
}

.smallNote {
  font-size: 0.88rem;
}


/* Gentle question-to-question transition. Keep this quiet: no sound, no reward cue. */
.questionTransition {
  animation: questionCardIn .24s ease-out;
  will-change: opacity, transform;
}

@keyframes questionCardIn {
  from {
    opacity: 0;
    transform: translateY(10px) scale(0.992);
  }
  to {
    opacity: 1;
    transform: translateY(0) scale(1);
  }
}

@media (prefers-reduced-motion: reduce) {
  .questionTransition {
    animation: none;
  }
}


/* v52 simple landing page styles */
.simpleLanding {
          min-height: 100vh;
          background: #f6f0df;
          color: #3e3a2f;
          font-family: -apple-system, BlinkMacSystemFont, "Hiragino Sans", "Yu Gothic", "YuGothic", "Noto Sans JP", sans-serif;
        }
        .simpleLanding * {
          box-sizing: border-box;
        }
        .simpleLandingWrap {
          max-width: 1120px;
          margin: 0 auto;
          padding: 32px 20px 56px;
        }
        .simpleLandingHeader {
          display: flex;
          justify-content: space-between;
          align-items: center;
          margin-bottom: 40px;
        }
        .simpleLandingBrand {
          display: flex;
          gap: 12px;
          align-items: center;
        }
        .simpleLandingLogo {
          width: 44px;
          height: 44px;
          border-radius: 18px;
          background: #6f8d5c;
          color: white;
          display: grid;
          place-items: center;
          font-size: 20px;
          box-shadow: 0 8px 20px rgba(66, 76, 46, .12);
          font-weight: 800;
        }
        .simpleLandingSmall {
          color: #7a6f55;
          font-size: 14px;
        }
        .simpleLandingBrandTitle {
          font-weight: 400;
          margin-top: 2px;
        }
        .simpleLandingGhost {
          border: 1px solid #d8c9a8;
          background: rgba(255,255,255,.55);
          padding: 10px 20px;
          border-radius: 999px;
          color: #655b47;
          font-weight: 600;
          text-decoration: none;
        }
        .simpleLandingHero {
          display: grid;
          grid-template-columns: 1.1fr .9fr;
          gap: 32px;
          align-items: center;
        }
        .simpleLandingPanel {
          background: rgba(255,250,240,.92);
          border: 1px solid #e2d4b7;
          border-radius: 34px;
          padding: 40px;
          box-shadow: 0 24px 60px rgba(76, 65, 43, .14);
        }
        .simpleLandingBadge {
          display: inline-flex;
          align-items: center;
          gap: 8px;
          background: #eef3e7;
          color: #5f7f54;
          border-radius: 999px;
          padding: 9px 15px;
          font-size: 14px;
          font-weight: 400;
          margin-bottom: 22px;
        }
        .simpleLandingTitle {
          font-size: clamp(38px, 5vw, 58px);
          line-height: 1.08;
          margin: 0 0 22px;
          letter-spacing: -.04em;
          color: #3e3a2f;
        }
        .simpleLandingTitle span {
          color: #6f8d5c;
        }
        .simpleLandingLead {
          color: #6b624f;
          font-size: 18px;
          line-height: 1.9;
          margin: 0 0 28px;
        }
        .simpleLandingButtons {
          display: flex;
          gap: 14px;
          flex-wrap: wrap;
        }
        .simpleLandingPrimary {
          border: 0;
          background: #6f8d5c;
          color: #fff;
          padding: 16px 28px;
          border-radius: 18px;
          font-size: 18px;
          font-weight: 800;
          box-shadow: 0 10px 24px rgba(77, 98, 62, .25);
          cursor: pointer;
          text-decoration: none;
          display: inline-flex;
          align-items: center;
          justify-content: center;
        }
        .simpleLandingSecondary {
          border: 1px solid #d8c9a8;
          background: rgba(255,255,255,.7);
          color: #5f5645;
          padding: 16px 28px;
          border-radius: 18px;
          font-size: 18px;
          font-weight: 800;
          cursor: pointer;
          text-decoration: none;
          display: inline-flex;
          align-items: center;
          justify-content: center;
        }
        .simpleLandingVisual {
          background: #fff7e8;
          border: 1px solid #e2d4b7;
          border-radius: 34px;
          padding: 24px;
          box-shadow: 0 18px 45px rgba(76, 65, 43, .11);
        }
        .simpleLandingForest {
          height: 360px;
          border-radius: 28px;
          background: linear-gradient(#dfeccb, #f8efd9);
          position: relative;
          overflow: hidden;
        }
        .simpleLandingCircle1,
        .simpleLandingCircle2 {
          position: absolute;
          border-radius: 50%;
          background: rgba(171,200,140,.55);
        }
        .simpleLandingCircle1 {
          width: 150px;
          height: 150px;
          left: -40px;
          top: 42px;
        }
        .simpleLandingCircle2 {
          width: 118px;
          height: 118px;
          right: -20px;
          top: 80px;
        }
        .simpleLandingHill {
          position: absolute;
          bottom: -45px;
          left: 50%;
          transform: translateX(-50%);
          width: 420px;
          height: 170px;
          background: #d0b98f;
          border-radius: 50% 50% 0 0;
        }
        .simpleLandingPath {
          position: absolute;
          left: 20px;
          right: 20px;
          bottom: 56px;
          height: 125px;
        }
        .simpleLandingKid {
          position: absolute;
          bottom: 96px;
          left: 175px;
          width: 52px;
          height: 52px;
          border-radius: 999px;
          display: grid;
          place-items: center;
          background: #5f7f54;
          font-size: 21px;
          box-shadow: 0 10px 25px rgba(38,55,30,.22);
        }
        .simpleLandingFloating {
          position: absolute;
          top: 24px;
          left: 24px;
          right: 24px;
          background: rgba(255,255,255,.72);
          border-radius: 20px;
          padding: 16px;
          box-shadow: 0 8px 20px rgba(76,65,43,.09);
          backdrop-filter: blur(4px);
        }
        .simpleLandingFloating b {
          display: block;
          margin-top: 6px;
          font-size: 20px;
        }
        .simpleLandingCards {
          display: grid;
          grid-template-columns: repeat(3, 1fr);
          gap: 16px;
          margin-top: 32px;
        }
        .simpleLandingCard {
          background: rgba(255,255,255,.7);
          border: 1px solid #e2d4b7;
          border-radius: 26px;
          padding: 24px;
          box-shadow: 0 10px 24px rgba(76,65,43,.07);
        }
        .simpleLandingIcon {
          width: 44px;
          height: 44px;
          border-radius: 17px;
          display: grid;
          place-items: center;
          background: #eef3e7;
          color: #6f8d5c;
          font-size: 20px;
          margin-bottom: 15px;
        }
        .simpleLandingCard h3 {
          margin: 0 0 10px;
          font-size: 18px;
          color: #3e3a2f;
        }
        .simpleLandingCard p {
          margin: 0;
          line-height: 1.7;
          color: #6b624f;
        }
        .simpleLandingFlow {
          margin-top: 32px;
          background: rgba(255,255,255,.65);
          border: 1px solid #e2d4b7;
          border-radius: 30px;
          padding: 28px;
        }
        .simpleLandingFlow h2 {
          margin: 0 0 18px;
          font-size: 26px;
          color: #3e3a2f;
        }
        .simpleLandingSteps {
          display: grid;
          grid-template-columns: repeat(4, 1fr);
          gap: 12px;
        }
        .simpleLandingStep {
          background: #fbf5e7;
          border-radius: 20px;
          padding: 16px;
          font-weight: 700;
          color: #3e3a2f;
        }
        .simpleLandingNum {
          width: 32px;
          height: 32px;
          border-radius: 999px;
          background: #6f8d5c;
          color: white;
          display: grid;
          place-items: center;
          margin-bottom: 10px;
        }
        @media (max-width: 820px) {
          .simpleLandingHeader {
            gap: 14px;
          }
          .simpleLandingGhost {
            display: none;
          }
          .simpleLandingHero,
          .simpleLandingCards,
          .simpleLandingSteps {
            grid-template-columns: 1fr;
          }
          .simpleLandingPanel {
            padding: 28px;
          }
          .simpleLandingForest {
            height: 300px;
          }
        }


/* v53 science explainer sections */
.simpleLandingThinking {
  margin-top: 32px;
  background: rgba(255,255,255,.68);
  border: 1px solid #e2d4b7;
  border-radius: 30px;
  padding: 28px;
  box-shadow: 0 10px 24px rgba(76,65,43,.06);
}
.simpleLandingThinking h2 {
  margin: 0 0 14px;
  font-size: 26px;
  color: #3e3a2f;
}
.simpleLandingThinking p {
  color: #6b624f;
  line-height: 1.85;
  margin: 0 0 14px;
}
.simpleLandingThinkingGrid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 16px;
  margin-top: 16px;
}
.simpleLandingThinkingGrid > div {
  background: #fbf5e7;
  border: 1px solid #eadfc5;
  border-radius: 22px;
  padding: 18px;
}
.simpleLandingThinkingGrid h3 {
  margin: 0 0 10px;
  color: #3e3a2f;
  font-size: 18px;
}
.simpleLandingThinkingGrid ul {
  margin: 0;
  padding-left: 1.2em;
  color: #5f5645;
  line-height: 1.8;
}
.scienceNote,
.scoreGuide {
  margin: 18px 0;
  padding: 16px;
  border: 1px solid rgba(141, 163, 113, 0.45);
  background: rgba(239, 246, 232, 0.82);
  border-radius: 18px;
  color: #41563b;
}
.scienceNote h3,
.scoreGuide h3 {
  margin: 0 0 8px;
  color: #41563b;
}
.scienceNote p,
.scoreGuide p {
  margin: 4px 0;
  line-height: 1.75;
}
@media (max-width: 820px) {
  .simpleLandingThinkingGrid {
    grid-template-columns: 1fr;
  }
}


/* v54 free result page */
.freeResults {
  background: rgba(255, 253, 247, 0.985);
  border-color: rgba(202, 216, 190, 0.95);
}
.resultHero {
  display: grid;
  grid-template-columns: 1fr auto;
  gap: 16px;
  align-items: center;
  margin: 8px 0 18px;
  padding: 22px;
  border-radius: 26px;
  background: linear-gradient(135deg, #f4f8ed, #fff8e8);
  border: 1px solid rgba(141, 163, 113, 0.35);
}
.resultHero h2 {
  margin: 0 0 8px;
  color: #3f5639;
}
.resultScore {
  font-size: clamp(36px, 7vw, 52px);
  line-height: 1;
  font-weight: 900;
  color: #5f7f54;
  letter-spacing: -0.05em;
}
.resultSection {
  margin: 18px 0;
  padding: 18px;
  border: 1px solid rgba(202, 216, 190, 0.9);
  background: rgba(255, 255, 255, 0.62);
  border-radius: 22px;
}
.resultSection h3,
.paidTeaser h3 {
  margin: 0 0 12px;
  color: #41563b;
}
.resultSection p,
.paidTeaser p {
  line-height: 1.8;
  color: #4e5c4c;
}
.coreScoreList {
  display: grid;
  gap: 12px;
}
.freeResults .scoreBlock {
  margin: 0;
  padding: 14px;
  border: 1px solid rgba(213, 225, 204, 0.95);
  border-radius: 18px;
  background: rgba(255, 253, 247, 0.84);
}
.freeResults .barRow {
  grid-template-columns: minmax(180px, 230px) 1fr 92px;
}
.scoreDescription {
  margin: 4px 0 0;
  font-size: 13px;
  color: #6a7564;
  line-height: 1.5;
}
.scoreNumber {
  font-weight: 850;
  color: #41563b;
  text-align: right;
}
.scoreBlockPlus {
  border-color: rgba(111, 141, 92, 0.55);
}
.scorePlusNote {
  margin: 8px 0 0;
  color: #5f7f54;
  font-weight: 700;
  line-height: 1.7;
}
.typeResultCard {
  background: #fbf5e7;
}
.typeLine {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin: 8px 0;
  padding: 12px 14px;
  border-radius: 16px;
  background: rgba(255, 255, 255, 0.65);
}
.typeLine span {
  color: #6a7564;
  font-size: 14px;
}
.typeLine strong {
  color: #41563b;
  font-size: 18px;
}
.expertCommentCard {
  background: #f7f8ee;
}
.directionCard {
  background: #f7fbf2;
}
.paidTeaser {
  margin: 20px 0;
  padding: 20px;
  border-radius: 24px;
  border: 1px solid rgba(111, 141, 92, 0.36);
  background: linear-gradient(135deg, #eef3e7, #fff8e8);
}
@media (max-width: 720px) {
  .resultHero {
    grid-template-columns: 1fr;
  }
  .freeResults .barRow {
    grid-template-columns: 1fr;
  }
  .scoreNumber {
    text-align: left;
  }
}


/* v57 result cleanup */
.coreScoresSection {
  margin-top: 12px;
}


/* v58 result layout sample 4 */
.freeResults {
  max-width: 820px;
  margin-left: auto;
  margin-right: auto;
}
.resultHeroCentered {
  display: block;
  text-align: center;
  margin: 4px 0 18px;
  padding: 0 0 20px;
  border: 0;
  border-bottom: 1px solid rgba(216, 203, 174, 0.9);
  border-radius: 0;
  background: transparent;
}
.resultHeroCentered h2 {
  margin: 0;
  color: #41563b;
  font-size: 24px;
}
.resultScoreCentered {
  display: inline-flex;
  align-items: baseline;
  justify-content: center;
  gap: 8px;
  margin-top: 8px;
  color: #5f7f54;
  letter-spacing: -0.04em;
}
.resultScoreMain {
  font-size: clamp(42px, 8vw, 60px);
  line-height: 1;
  font-weight: 900;
}
.resultScoreSuffix {
  font-size: clamp(18px, 3.2vw, 26px);
  line-height: 1;
  font-weight: 800;
  letter-spacing: -0.02em;
  color: #6f8d5c;
}
.coreScoresSection {
  margin-top: 8px;
  padding: 0;
  border: 0;
  background: transparent;
  border-radius: 0;
}
.freeResults .scoreBlock {
  margin: 0;
  padding: 14px 0;
  border: 0;
  border-bottom: 1px solid rgba(216, 203, 174, 0.72);
  border-radius: 0;
  background: transparent;
}
.freeResults .scoreBlock:last-child {
  border-bottom: 0;
}
.freeResults .barRow {
  grid-template-columns: minmax(180px, 250px) 1fr 70px;
}
.scoreGuide {
  border: 0;
  border-top: 1px solid rgba(216, 203, 174, 0.85);
  border-bottom: 1px solid rgba(216, 203, 174, 0.85);
  background: transparent;
  border-radius: 0;
  padding: 16px 0;
}
.typeResultCard,
.expertCommentCard,
.directionCard {
  border: 0;
  border-top: 1px solid rgba(216, 203, 174, 0.85);
  border-radius: 0;
  background: transparent;
  padding: 18px 0;
}
.typeLine {
  background: rgba(255, 253, 247, 0.55);
}
.paidTeaser {
  border-radius: 26px;
}
@media (max-width: 720px) {
  .freeResults .barRow {
    grid-template-columns: 1fr;
  }
}


/* v59 result layout sample 4 width and color refinement */
.freeResults {
  width: min(1120px, 100%);
  max-width: 1120px;
  margin-left: auto;
  margin-right: auto;
  background: rgba(255, 253, 247, 0.985);
}

.resultHeroCentered {
  max-width: 760px;
  margin-left: auto;
  margin-right: auto;
  padding-bottom: 22px;
  border-bottom-color: rgba(226, 212, 183, 0.95);
}

.resultHeroCentered h2 {
  color: #3e3a2f;
  font-weight: 850;
}

.resultScoreCentered {
  color: #6f8d5c;
}

.resultScoreSuffix {
  color: #8a7652;
  opacity: 0.9;
}

.coreScoresSection,
.scoreGuide,
.typeResultCard,
.expertCommentCard,
.directionCard {
  width: min(760px, 100%);
  margin-left: auto;
  margin-right: auto;
}

.freeResults .scoreBlock {
  border-bottom-color: rgba(226, 212, 183, 0.9);
}

.freeResults .bar {
  height: 10px;
  background: #e7ddc7;
  border: 0;
  border-radius: 999px;
}

.freeResults .bar span {
  background: linear-gradient(90deg, #8da371, #5f7f54);
  border-radius: 999px;
}

.scoreDescription,
.resultSection p,
.paidTeaser p,
.scoreGuide p {
  color: #6b624f;
}

.scoreNumber,
.typeLine strong,
.resultSection h3,
.paidTeaser h3,
.scoreGuide h3 {
  color: #41563b;
}

.typeLine {
  background: rgba(251, 245, 231, 0.72);
  border: 1px solid rgba(234, 223, 197, 0.72);
}

.paidTeaser {
  width: min(760px, 100%);
  margin-left: auto;
  margin-right: auto;
  background: linear-gradient(135deg, #eef3e7, #fff8e8);
  border-color: rgba(226, 212, 183, 0.95);
  box-shadow: 0 14px 34px rgba(76, 65, 43, 0.06);
}

@media (max-width: 720px) {
  .freeResults {
    width: 100%;
  }
  .coreScoresSection,
  .scoreGuide,
  .typeResultCard,
  .expertCommentCard,
  .directionCard,
  .paidTeaser,
  .resultHeroCentered {
    width: 100%;
    max-width: 100%;
  }
}


/* v61 core specialist labels */
.coreScoresSection {
  width: min(920px, 100%);
}
.freeResults .barRow {
  grid-template-columns: minmax(260px, 340px) 1fr 88px;
  gap: 18px;
}
.expertLabel {
  font-size: 0.72em;
  font-weight: 700;
  color: #6b624f;
  white-space: nowrap;
}
.scoreDescription {
  max-width: 360px;
}
@media (max-width: 820px) {
  .freeResults .barRow {
    grid-template-columns: 1fr;
  }
  .expertLabel {
    white-space: normal;
  }
}


/* v62 restore score width and simplify type result */
.coreScoresSection {
  width: min(760px, 100%);
}

.freeResults .barRow {
  grid-template-columns: minmax(180px, 250px) 1fr 70px;
  gap: 14px;
}

.scoreDescription {
  max-width: none;
}

.typeResultCard {
  width: min(760px, 100%);
  margin-left: auto;
  margin-right: auto;
  border: 0;
  border-top: 1px solid rgba(216, 203, 174, 0.85);
  border-radius: 0;
  background: transparent;
  padding: 18px 0;
}

.typeResultCard h3 {
  margin-bottom: 12px;
}

.typeLine {
  display: grid;
  grid-template-columns: 90px 1fr;
  align-items: baseline;
  gap: 10px;
  margin: 6px 0;
  padding: 0;
  background: transparent;
  border: 0;
  border-radius: 0;
}

.typeLine span {
  color: #6b624f;
  font-size: 14px;
}

.typeLine strong {
  color: #41563b;
  font-size: 18px;
}

.typeResultCard p {
  margin: 12px 0 0;
  line-height: 1.85;
  color: #4e5c4c;
}

@media (max-width: 820px) {
  .coreScoresSection,
  .typeResultCard {
    width: 100%;
  }

  .freeResults .barRow {
    grid-template-columns: 1fr;
  }

  .typeLine {
    grid-template-columns: 1fr;
    gap: 2px;
  }
}


/* v63 core meaning section */
.coreMeaningCard {
  width: min(760px, 100%);
  margin-left: auto;
  margin-right: auto;
  border: 0;
  border-top: 1px solid rgba(216, 203, 174, 0.85);
  border-radius: 0;
  background: transparent;
  padding: 18px 0;
}

.coreMeaningCard h3 {
  margin: 0 0 14px;
  color: #41563b;
}

.coreMeaningItem {
  padding: 14px 0;
  border-top: 1px solid rgba(226, 212, 183, 0.72);
}

.coreMeaningItem:first-of-type {
  border-top: 0;
  padding-top: 4px;
}

.coreMeaningItem h4 {
  margin: 0 0 8px;
  color: #41563b;
  font-size: 17px;
}

.coreMeaningItem p {
  margin: 8px 0;
  color: #4e5c4c;
  line-height: 1.85;
}

@media (max-width: 820px) {
  .coreMeaningCard {
    width: 100%;
  }
}

/* v77: 「この結果で分かること」だけサイズと横幅を再調整 */
.result-understanding-section,
.result-understanding-section--comment-like {
  box-sizing: border-box;
  width: min(100% - clamp(2.6rem, 9vw, 5.8rem), 720px);
  margin: 2.6rem auto 0;
  padding: 1.85rem 0 0;
  border-top: 1px solid rgba(126, 107, 74, 0.28);
  background: transparent;
  box-shadow: none;
  border-radius: 0;
}

.result-understanding-section h2,
.result-understanding-title,
.result-understanding-title--comment-like {
  color: #36573c;
  font-size: clamp(1.03rem, 1.35vw, 1.18rem);
  font-weight: 700;
  line-height: 1.55;
  letter-spacing: 0.01em;
  margin: 0 0 1rem;
}

.result-understanding-section p,
.result-understanding-body,
.result-understanding-body--comment-like,
.result-understanding-body p,
.result-understanding-body--comment-like p {
  color: #706a5f;
  font-size: clamp(0.88rem, 1vw, 0.95rem);
  font-weight: 400;
  line-height: 1.9;
  letter-spacing: 0.01em;
}

.result-understanding-section p,
.result-understanding-body p,
.result-understanding-body--comment-like p {
  margin: 0 0 0.95rem;
}

.result-understanding-section p:last-child,
.result-understanding-body p:last-child,
.result-understanding-body--comment-like p:last-child {
  margin-bottom: 0;
}

/* v78: 「この結果で分かること」をコメントと同じ文字サイズに合わせる */
.result-understanding-section h2,
.result-understanding-title,
.result-understanding-title--comment-like {
  font-size: clamp(1.03rem, 1.35vw, 1.18rem) !important;
  font-weight: 700 !important;
  line-height: 1.55 !important;
  letter-spacing: 0.01em !important;
}

.result-understanding-section p,
.result-understanding-body,
.result-understanding-body--comment-like,
.result-understanding-body p,
.result-understanding-body--comment-like p {
  font-size: clamp(0.88rem, 1vw, 0.95rem) !important;
  font-weight: 400 !important;
  line-height: 1.9 !important;
  letter-spacing: 0.01em !important;
}

/* v82: 「この結果で分かること」の本文をコメント本文と同じptに固定 */
.result-understanding-section p,
.result-understanding-section .result-understanding-body,
.result-understanding-section .result-understanding-body p,
.result-understanding-section .result-understanding-body--comment-like,
.result-understanding-section .result-understanding-body--comment-like p,
.result-understanding-section .result-understanding-body-match-comment,
.result-understanding-section .result-understanding-body-exact-comment-font {
  font-family: inherit !important;
  font-size: 1rem !important;
  font-weight: 400 !important;
  line-height: 1.9 !important;
  letter-spacing: normal !important;
  color: var(--muted) !important;
  margin: 8px 0 !important;
}

.result-understanding-section p:last-child,
.result-understanding-section .result-understanding-body p:last-child,
.result-understanding-section .result-understanding-body--comment-like p:last-child {
  margin-bottom: 0 !important;
}

/* v85: 「コメント」の横幅だけを「この結果で分かること」に合わせる */
.result-comment-section--understanding-width {
  box-sizing: border-box;
  width: min(100% - clamp(2.6rem, 9vw, 5.8rem), 720px);
  margin-left: auto;
  margin-right: auto;
}

/* v86: コメントと「この結果で分かること」を4つの力の見方に合わせる */
.expertCommentCard.result-comment-section--understanding-width,
.result-understanding-section.result-understanding-section--comment-like {
  box-sizing: border-box !important;
  width: min(760px, 100%) !important;
  margin: 18px auto !important;
  padding: 18px 0 !important;
  border: 0 !important;
  border-top: 1px solid rgba(216, 203, 174, 0.85) !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

.expertCommentCard.result-comment-section--understanding-width .result-detail-heading,
.result-understanding-section.result-understanding-section--comment-like .result-detail-heading {
  margin: 0 0 8px !important;
  color: #41563b !important;
  font-size: 17px !important;
  font-weight: 700 !important;
  line-height: 1.55 !important;
  letter-spacing: normal !important;
}

.expertCommentCard.result-comment-section--understanding-width p,
.result-understanding-section.result-understanding-section--comment-like p {
  margin: 8px 0 !important;
  color: #4e5c4c !important;
  font-family: inherit !important;
  font-size: 1rem !important;
  font-weight: 400 !important;
  line-height: 1.85 !important;
  letter-spacing: normal !important;
}

.expertCommentCard.result-comment-section--understanding-width p:last-child,
.result-understanding-section.result-understanding-section--comment-like p:last-child {
  margin-bottom: 0 !important;
}
/* end v86 */

/* v87: 4つの力の見方の二重線解消と本文色統一 */
/* スコアの見方の下線を残し、4つの力の見方側の上線を消して二重線を1本にする */
.coreMeaningCard {
  border-top: 0 !important;
}

/* スコアの見方本文と同じ本文色に統一 */
.coreMeaningItem p,
.expertCommentCard.result-comment-section--understanding-width p,
.result-understanding-section.result-understanding-section--comment-like p {
  color: #6b624f !important;
}
/* end v87 */



/* v107 tighter result header frame */
.result-header-box {
  position: relative;
  display: flex;
  align-items: flex-start;
  gap: 14px;

  width: 100%;
  max-width: 100%;

  border: 1px solid rgba(221, 214, 193, 0.9);
  border-radius: 20px;

  background: rgba(255, 253, 248, 0.82);

  padding:
    14px
    18px
    16px
    18px;

  box-shadow:
    inset 0 1px 0 rgba(255,255,255,0.55);
}

.result-header-accent {
  width: 3px;
  height: 54px;

  border-radius: 999px;

  background:
    linear-gradient(
      to bottom,
      #6f915b,
      #5f7f4d
    );

  margin-top: 2px;

  flex: 0 0 auto;
}

.result-header-copy {
  display: flex;
  flex-direction: column;
  justify-content: center;

  min-width: 0;
}

.result-header-label {
  margin-bottom: 2px;

  color: rgba(54, 86, 61, 0.72);

  font-size: 12px;
  font-weight: 700;

  letter-spacing: 0.08em;
  line-height: 1.2;
}

.result-header-title {
  margin: 0;

  color: #193323;

  font-size: clamp(32px, 4.2vw, 48px);
  font-weight: 900;

  line-height: 1.04;
  letter-spacing: -0.045em;
}

@media (max-width: 640px) {
  .result-header-box {
    padding: 12px 14px 14px 14px;
    gap: 12px;
    border-radius: 16px;
  }

  .result-header-accent {
    height: 46px;
  }

  .result-header-title {
    font-size: 30px;
  }
}























/* v119 separate header box and wide score card */
.resultReferencePanel {
  width: 100% !important;
  max-width: none !important;
  margin: 0 auto 44px !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  padding: 0 !important;
  box-shadow: none !important;
  box-sizing: border-box;
}

.resultTopHeaderBox {
  width: 100% !important;
  max-width: none !important;
  margin: 0 0 22px 0 !important;
  padding: 0 !important;
  border: 1px solid rgba(221, 214, 193, 0.92);
  border-radius: 28px;
  background: rgba(255, 253, 248, 0.82);
  box-shadow:
    0 18px 48px rgba(54, 86, 61, 0.035),
    inset 0 1px 0 rgba(255, 255, 255, 0.62);
  box-sizing: border-box;
}

.resultTopHeaderRow {
  display: flex;
  align-items: center;
  gap: 24px;
  padding: 28px 34px;
}

.resultTopHeaderLine {
  width: 9px;
  height: 94px;
  flex: 0 0 auto;
  border-radius: 999px;
  background: linear-gradient(
    to bottom,
    #6f915b,
    #4f7145
  );
}

.resultTopHeaderCopy {
  min-width: 0;
}

.resultTopHeaderService {
  margin-bottom: 8px;
  color: rgba(54, 86, 61, 0.78);
  font-size: 20px;
  font-weight: 800;
  letter-spacing: 0.04em;
  line-height: 1.15;
}

.resultTopHeaderTitle {
  margin: 0;
  color: #193323;
  font-size: clamp(46px, 6.2vw, 68px);
  font-weight: 900;
  line-height: 1.02;
  letter-spacing: -0.055em;
}

/*
  Bar card: restore wider layout.
  Text, scores, and bars are not edited.
*/
.resultReferencePanel > .resultTopHeaderBox + *,
.resultReferencePanel > .resultReferenceHeader + * {
  width: 100% !important;
  max-width: none !important;
  margin: 0 !important;
  box-sizing: border-box;
  background: rgba(255, 253, 248, 0.82) !important;
}

@media (max-width: 768px) {
  .resultReferencePanel {
    width: calc(100% - 28px) !important;
    max-width: calc(100% - 28px) !important;
    margin-bottom: 34px !important;
  }

  .resultTopHeaderBox {
    border-radius: 22px;
    margin-bottom: 16px !important;
  }

  .resultTopHeaderRow {
    gap: 16px;
    padding: 20px 22px;
  }

  .resultTopHeaderLine {
    width: 7px;
    height: 74px;
  }

  .resultTopHeaderService {
    margin-bottom: 6px;
    font-size: 16px;
  }

  .resultTopHeaderTitle {
    font-size: 38px;
  }
}



/* v120 add analysis heading and smaller header title */
.resultTopHeaderService {
  font-size: 18px !important;
  margin-bottom: 7px !important;
}

.resultTopHeaderTitle {
  font-size: clamp(38px, 5.2vw, 58px) !important;
  letter-spacing: -0.05em !important;
}

.resultTopHeaderRow {
  padding: 24px 32px !important;
}

.resultTopHeaderLine {
  height: 82px !important;
}

.resultBarsHeading {
  margin: 0 0 18px 0;

  color: #193323;

  font-size: 30px;
  font-weight: 900;

  line-height: 1.2;
  letter-spacing: -0.02em;
}

@media (max-width: 768px) {
  .resultTopHeaderService {
    font-size: 14px !important;
  }

  .resultTopHeaderTitle {
    font-size: 34px !important;
  }

  .resultTopHeaderRow {
    padding: 18px 20px !important;
  }

  .resultTopHeaderLine {
    height: 66px !important;
  }

  .resultBarsHeading {
    margin-bottom: 14px;
    font-size: 24px;
  }
}



/* v121 score card heading inside bar box */
.resultBarsHeading {
  display: none !important;
}

.scoreCardHeading {
  margin: 0 0 28px 0;

  color: #193323;

  font-size: 24px;
  font-weight: 900;

  line-height: 1.2;
  letter-spacing: -0.02em;
}

@media (max-width: 768px) {
  .scoreCardHeading {
    margin-bottom: 20px;
    font-size: 26px;
  }
}



/* v122 center and shrink score card heading */
.scoreCardHeading {
  margin: 0 0 22px 0 !important;

  color: #193323;

  font-size: 17px !important;
  font-weight: 900;

  line-height: 1.2;
  letter-spacing: -0.01em;

  text-align: center;
}

@media (max-width: 768px) {
  .scoreCardHeading {
    margin-bottom: 18px !important;
    font-size: 14px !important;
  }
}



/* v123 analysis heading 36px */
.scoreCardHeading {
  margin: 0 0 34px 0 !important;

  color: #193323;

  font-size: 36px !important;
  font-weight: 900;

  line-height: 1.2;
  letter-spacing: -0.02em;

  text-align: center;
}

@media (max-width: 768px) {
  .scoreCardHeading {
    margin-bottom: 24px !important;
    font-size: 28px !important;
  }
}



/* v124 analysis heading 24px */
.scoreCardHeading {
  margin: 0 0 30px 0 !important;

  color: #193323;

  font-size: 24px !important;
  font-weight: 900;

  line-height: 1.2;
  letter-spacing: -0.02em;

  text-align: center;
}

@media (max-width: 768px) {
  .scoreCardHeading {
    margin-bottom: 22px !important;
    font-size: 22px !important;
  }
}



/* v125 analysis heading color, top divider, spacing */
.scoreCardHeading {
  margin: 0 0 42px 0 !important;

  color: #193323 !important;

  font-size: 24px !important;
  font-weight: 900;

  line-height: 1.2;
  letter-spacing: -0.02em;

  text-align: center;
}

/*
  Add the same divider line above the first score row.
  The target is intentionally scoped under resultReferencePanel to avoid affecting other pages.
*/
.resultReferencePanel .scoreCardHeading + *,
.resultReferencePanel .scoreCardHeading + div,
.resultReferencePanel .scoreCardHeading + section {
  border-top: 1px solid rgba(224, 211, 178, 0.95);
  padding-top: 34px;
}

@media (max-width: 768px) {
  .scoreCardHeading {
    margin-bottom: 30px !important;
    font-size: 22px !important;
  }

  .resultReferencePanel .scoreCardHeading + *,
  .resultReferencePanel .scoreCardHeading + div,
  .resultReferencePanel .scoreCardHeading + section {
    padding-top: 24px;
  }
}



/* v126 analysis spacing and closer top divider */
.scoreCardHeading {
  margin: 0 0 56px 0 !important;

  color: #193323 !important;

  font-size: 24px !important;
  font-weight: 900;

  line-height: 1.2;
  letter-spacing: -0.02em;

  text-align: center;
}

/*
  Keep the heading position, create more overall space before the bars,
  but place the divider line closer to the first score row.
*/
.resultReferencePanel .scoreCardHeading + *,
.resultReferencePanel .scoreCardHeading + div,
.resultReferencePanel .scoreCardHeading + section {
  border-top: 1px solid rgba(224, 211, 178, 0.95);
  padding-top: 18px !important;
}

@media (max-width: 768px) {
  .scoreCardHeading {
    margin-bottom: 42px !important;
    font-size: 22px !important;
  }

  .resultReferencePanel .scoreCardHeading + *,
  .resultReferencePanel .scoreCardHeading + div,
  .resultReferencePanel .scoreCardHeading + section {
    padding-top: 14px !important;
  }
}



/* v127 move bar list down about 2cm */
.scoreCardHeading {
  margin: 0 0 72px 0 !important;

  color: #193323 !important;

  font-size: 24px !important;
  font-weight: 900;

  line-height: 1.2;
  letter-spacing: -0.02em;

  text-align: center;
}

/*
  The divider above "音の高さ" moves together with the bar list.
  Keep the divider close to the first row.
*/
.resultReferencePanel .scoreCardHeading + *,
.resultReferencePanel .scoreCardHeading + div,
.resultReferencePanel .scoreCardHeading + section {
  border-top: 1px solid rgba(224, 211, 178, 0.95);
  padding-top: 18px !important;
}

@media (max-width: 768px) {
  .scoreCardHeading {
    margin-bottom: 52px !important;
    font-size: 22px !important;
  }

  .resultReferencePanel .scoreCardHeading + *,
  .resultReferencePanel .scoreCardHeading + div,
  .resultReferencePanel .scoreCardHeading + section {
    padding-top: 14px !important;
  }
}



/* v128 move analysis heading and bar list down about 3cm */
.scoreCardHeading {
  margin: 112px 0 72px 0 !important;

  color: #193323 !important;

  font-size: 24px !important;
  font-weight: 900;

  line-height: 1.2;
  letter-spacing: -0.02em;

  text-align: center;
}

/*
  Keep the divider above "音の高さ" moving together with the bar list.
  Keep the divider close to the first row.
*/
.resultReferencePanel .scoreCardHeading + *,
.resultReferencePanel .scoreCardHeading + div,
.resultReferencePanel .scoreCardHeading + section {
  border-top: 1px solid rgba(224, 211, 178, 0.95);
  padding-top: 18px !important;
}

@media (max-width: 768px) {
  .scoreCardHeading {
    margin: 72px 0 52px 0 !important;
    font-size: 22px !important;
  }

  .resultReferencePanel .scoreCardHeading + *,
  .resultReferencePanel .scoreCardHeading + div,
  .resultReferencePanel .scoreCardHeading + section {
    padding-top: 14px !important;
  }
}



/* v129 move analysis heading and bar list up about 1cm */
.scoreCardHeading {
  margin: 74px 0 72px 0 !important;

  color: #193323 !important;

  font-size: 24px !important;
  font-weight: 900;

  line-height: 1.2;
  letter-spacing: -0.02em;

  text-align: center;
}

/*
  Keep the divider above "音の高さ" moving together with the bar list.
  Keep the divider close to the first row.
*/
.resultReferencePanel .scoreCardHeading + *,
.resultReferencePanel .scoreCardHeading + div,
.resultReferencePanel .scoreCardHeading + section {
  border-top: 1px solid rgba(224, 211, 178, 0.95);
  padding-top: 18px !important;
}

@media (max-width: 768px) {
  .scoreCardHeading {
    margin: 48px 0 52px 0 !important;
    font-size: 22px !important;
  }

  .resultReferencePanel .scoreCardHeading + *,
  .resultReferencePanel .scoreCardHeading + div,
  .resultReferencePanel .scoreCardHeading + section {
    padding-top: 14px !important;
  }
}



/* v130 sample D compact result header */
.resultTopHeaderBox {
  width: 100% !important;
  max-width: none !important;

  margin: 0 0 22px 0 !important;
  padding: 0 !important;

  border: 1px solid rgba(221, 214, 193, 0.92);
  border-radius: 28px;

  background: rgba(255, 253, 248, 0.82);

  box-shadow:
    0 18px 48px rgba(54, 86, 61, 0.035),
    inset 0 1px 0 rgba(255, 255, 255, 0.62);

  box-sizing: border-box;
}

.resultTopHeaderRow {
  display: flex;
  align-items: center;
  gap: 24px;

  /*
    Sample D: compact vertical scale.
    Keep the left line, shrink the title block.
  */
  padding: 24px 34px !important;
}

.resultTopHeaderLine {
  width: 9px;
  height: 86px;

  flex: 0 0 auto;

  border-radius: 999px;

  background: linear-gradient(
    to bottom,
    #6f915b,
    #4f7145
  );
}

.resultTopHeaderCopy {
  min-width: 0;
}

.resultTopHeaderService {
  margin-bottom: 7px;

  color: rgba(54, 86, 61, 0.78);

  font-size: 18px;
  font-weight: 800;

  letter-spacing: 0.04em;
  line-height: 1.15;
}

.resultTopHeaderTitle {
  margin: 0;

  color: #193323;

  font-size: clamp(36px, 5.1vw, 52px);
  font-weight: 900;

  line-height: 1.02;
  letter-spacing: -0.055em;
}

@media (max-width: 768px) {
  .resultTopHeaderBox {
    border-radius: 22px;
    margin-bottom: 16px !important;
  }

  .resultTopHeaderRow {
    gap: 16px;
    padding: 18px 22px !important;
  }

  .resultTopHeaderLine {
    width: 7px;
    height: 68px;
  }

  .resultTopHeaderService {
    margin-bottom: 6px;
    font-size: 14px;
  }

  .resultTopHeaderTitle {
    font-size: 32px;
  }
}



/* v132 sample D compact final result header */
.resultTopHeaderBox {
  width: 100% !important;
  max-width: none !important;

  margin: 0 0 22px 0 !important;
  padding: 0 !important;

  border: 1px solid rgba(221, 214, 193, 0.92);
  border-radius: 28px;

  background: rgba(255, 253, 248, 0.82);

  box-shadow:
    0 18px 48px rgba(54, 86, 61, 0.035),
    inset 0 1px 0 rgba(255, 255, 255, 0.62);

  box-sizing: border-box;
}

.resultTopHeaderRow {
  display: flex;
  align-items: center;
  gap: 22px;

  /* Sample D compact: smaller type and reduced vertical padding */
  padding: 18px 32px !important;
}

.resultTopHeaderLine {
  width: 9px;
  height: 66px;

  flex: 0 0 auto;

  border-radius: 999px;

  background: linear-gradient(
    to bottom,
    #6f915b,
    #4f7145
  );
}

.resultTopHeaderCopy {
  min-width: 0;
}

.resultTopHeaderService {
  margin-bottom: 5px;

  color: rgba(54, 86, 61, 0.78);

  font-size: 13px;
  font-weight: 800;

  letter-spacing: 0.04em;
  line-height: 1.15;
}

.resultTopHeaderTitle {
  margin: 0;

  color: #193323;

  font-size: clamp(32px, 4.1vw, 36px);
  font-weight: 900;

  line-height: 1.03;
  letter-spacing: -0.05em;
}

@media (max-width: 768px) {
  .resultTopHeaderBox {
    border-radius: 22px;
    margin-bottom: 16px !important;
  }

  .resultTopHeaderRow {
    gap: 14px;
    padding: 16px 20px !important;
  }

  .resultTopHeaderLine {
    width: 7px;
    height: 58px;
  }

  .resultTopHeaderService {
    margin-bottom: 5px;
    font-size: 13px;
  }

  .resultTopHeaderTitle {
    font-size: 30px;
  }
}



/* v133 sample B open line result header */
.resultTopHeaderBox {
  border: 0 !important;
  box-shadow: none !important;
  background: transparent !important;
}

.resultOpenHeader {
  width: 100% !important;
  max-width: none !important;

  margin: 0 0 46px 0 !important;
  padding: 0 !important;

  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;

  box-sizing: border-box;
}

.resultOpenHeaderInner {
  display: flex;
  align-items: center;
  gap: 24px;

  width: 100%;

  padding: 8px 0 18px 0;

  border-bottom: 1px solid rgba(224, 211, 178, 0.95);
  box-sizing: border-box;
}

.resultOpenAccent {
  width: 6px;
  height: 52px;

  flex: 0 0 auto;

  border-radius: 999px;

  background: linear-gradient(
    to bottom,
    #6f915b,
    #4f7145
  );
}

.resultOpenService {
  color: rgba(54, 86, 61, 0.78);

  font-size: 17px;
  font-weight: 800;

  letter-spacing: 0.04em;
  line-height: 1.15;

  white-space: nowrap;
}

.resultOpenDivider {
  width: 1px;
  height: 36px;

  flex: 0 0 auto;

  background: rgba(54, 86, 61, 0.36);
}

.resultOpenTitle {
  margin: 0;

  color: #193323;

  font-size: clamp(32px, 3.6vw, 42px);
  font-weight: 900;

  line-height: 1.05;
  letter-spacing: -0.05em;

  white-space: nowrap;
}

.resultOpenLine {
  height: 1px;
  flex: 1 1 auto;

  background: rgba(54, 86, 61, 0.36);
  margin-left: 8px;
}

@media (max-width: 768px) {
  .resultOpenHeader {
    margin-bottom: 28px !important;
  }

  .resultOpenHeaderInner {
    gap: 12px;
    padding: 6px 0 14px 0;
  }

  .resultOpenAccent {
    width: 5px;
    height: 42px;
  }

  .resultOpenService {
    font-size: 13px;
  }

  .resultOpenDivider {
    height: 28px;
  }

  .resultOpenTitle {
    font-size: 21px;
  }

  .resultOpenLine {
    display: none;
  }
}



/* v133 sample B no-box result header */
.resultTopHeaderBox {
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

.resultTopHeaderSampleB {
  width: 100% !important;
  max-width: none !important;

  margin: 0 0 22px 0 !important;
  padding: 0 !important;

  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;

  box-sizing: border-box;
}

.resultTopHeaderSampleBRow {
  display: flex;
  align-items: center;
  gap: 22px;

  padding: 8px 0 12px 0 !important;
}

.resultTopHeaderSampleBLine {
  width: 3px;
  height: 54px;

  flex: 0 0 auto;

  border-radius: 999px;

  background: #5f7f4d;
}

.resultTopHeaderSampleBCopy {
  min-width: 0;
}

.resultTopHeaderSampleBService {
  margin-bottom: 5px;

  color: rgba(54, 86, 61, 0.78);

  font-size: 14px;
  font-weight: 800;

  letter-spacing: 0.04em;
  line-height: 1.15;
}

.resultTopHeaderSampleBTitle {
  margin: 0;

  color: #193323;

  font-size: clamp(30px, 3.8vw, 34px);
  font-weight: 900;

  line-height: 1.04;
  letter-spacing: -0.05em;
}

.resultTopHeaderSampleBUnderline {
  width: 100%;
  height: 1px;

  background: rgba(130, 153, 111, 0.62);
}

@media (max-width: 768px) {
  .resultTopHeaderSampleB {
    margin-bottom: 18px !important;
  }

  .resultTopHeaderSampleBRow {
    gap: 14px;
    padding: 6px 0 10px 0 !important;
  }

  .resultTopHeaderSampleBLine {
    width: 3px;
    height: 46px;
  }

  .resultTopHeaderSampleBService {
    margin-bottom: 4px;
    font-size: 13px;
  }

  .resultTopHeaderSampleBTitle {
    font-size: 21px;
  }
}



/* v134 remove result page title header */
.resultReferencePanel > .resultTopHeaderSampleB,
.resultReferencePanel > .resultTopHeaderBox,
.resultReferencePanel > .resultReferenceHeader,
.resultReferencePanel > [data-result-component="ResultHeader"] {
  display: none !important;
}

/*
  When the result header is removed, keep the analysis/card area clean.
  Do not change score rows, bars, text, or logic.
*/
.resultReferencePanel {
  padding-top: 0 !important;
}



/* v135 move analysis heading and bar list up about 0.5cm */
.scoreCardHeading {
  margin: 55px 0 72px 0 !important;

  color: #193323 !important;

  font-size: 24px !important;
  font-weight: 900;

  line-height: 1.2;
  letter-spacing: -0.02em;

  text-align: center;
}

/*
  Keep the divider above "音の高さ" moving together with the bar list.
  Keep the divider close to the first row.
*/
.resultReferencePanel .scoreCardHeading + *,
.resultReferencePanel .scoreCardHeading + div,
.resultReferencePanel .scoreCardHeading + section {
  border-top: 1px solid rgba(224, 211, 178, 0.95);
  padding-top: 18px !important;
}

@media (max-width: 768px) {
  .scoreCardHeading {
    margin: 38px 0 52px 0 !important;
    font-size: 22px !important;
  }

  .resultReferencePanel .scoreCardHeading + *,
  .resultReferencePanel .scoreCardHeading + div,
  .resultReferencePanel .scoreCardHeading + section {
    padding-top: 14px !important;
  }
}



/* v136 observation report paragraphs */
.observationReportCard {
  background: rgba(255, 253, 248, 0.82) !important;
}

.observationReportCard p {
  margin: 0 0 12px;
  color: #3f5639;
  line-height: 1.9;
}

.observationReportCard p:last-child {
  margin-bottom: 0;
}


/* v138 observation report matches result text cards */
.observationReportCard {
  width: min(760px, 100%);
  margin: 18px auto;
  padding: 18px 0;

  border: 0;
  border-top: 1px solid rgba(216, 203, 174, 0.85);
  border-radius: 0;

  background: transparent !important;
  box-shadow: none;
}

.observationReportCard p {
  margin: 8px 0;

  color: #4e5c4c;

  font-size: 13px;
  font-weight: 500;

  line-height: 1.85;
  letter-spacing: 0;
}

.observationReportCard p:first-child {
  margin-top: 0;
}

.observationReportCard p:last-child {
  margin-bottom: 0;
}

@media (max-width: 820px) {
  .observationReportCard {
    width: 100%;
  }
}


/* v139 analysis preview observation patterns */
.previewObservationList {
  width: min(760px, 100%);
  margin: 18px auto;
  padding: 0;
  border: 0;
  background: transparent;
  box-shadow: none;
}

.previewObservationList > .result-detail-heading {
  margin-bottom: 18px;
}

.previewObservationCard {
  margin: 18px 0 22px 0;
}

.previewObservationLabel {
  margin: 0 0 8px 0;
  color: #193323;
  font-size: 13px;
  font-weight: 900;
  line-height: 1.4;
}

.previewObservationExample {
  color: rgba(78, 92, 76, 0.78) !important;
  font-size: 13px !important;
  line-height: 1.7 !important;
}


/* v140 observation report above bars */
.observationReportCardAboveBars {
  margin-top: 30px;
  margin-bottom: 42px;
}

@media (max-width: 768px) {
  .observationReportCardAboveBars {
    margin-top: 24px;
    margin-bottom: 32px;
  }
}

/* v143 unknown button label layout */
.natureAnswerGrid button:last-child {
  font-size: 14px;
  line-height: 1.25;
  min-height: 52px;
  white-space: normal;
}

@media (max-width: 768px) {
  .natureAnswerGrid button:last-child {
    font-size: 13px;
    min-height: 54px;
    padding-left: 10px;
    padding-right: 10px;
  }
}


/* v150 core guide note */
.coreGuideNote {
  margin: 8px 0 22px;
}











/* v155 actual divider css fix */
.result-understanding-section,
.result-understanding-section--comment-like,
.result-understanding-section.result-understanding-section--comment-like {
  border-top: 0 !important;
  padding-top: 0 !important;
}

.observationReportCard {
  border-bottom: 1px solid rgba(216, 203, 174, 0.85) !important;
  padding-bottom: 24px !important;
  margin-bottom: 24px !important;
}


/* v158 paid result page */
.paidReportPage {
  min-height: 100vh;
  background:
    radial-gradient(circle at 10% 0%, rgba(223, 238, 218, 0.55), transparent 28%),
    radial-gradient(circle at 96% 10%, rgba(245, 237, 215, 0.65), transparent 24%),
    #f8f6ed;
  color: #26382d;
  padding: 48px 28px 56px;
}

.paidReportShell {
  max-width: 1240px;
  margin: 0 auto;
  display: grid;
  grid-template-columns: 248px minmax(0, 1fr);
  gap: 24px;
}

.paidReportSidebar,
.paidHeroCard,
.paidWideCard,
.paidScoreCard,
.paidInfoCard {
  background: rgba(255, 253, 247, 0.92);
  border: 1px solid rgba(218, 204, 174, 0.72);
  border-radius: 18px;
  box-shadow: 0 14px 36px rgba(55, 66, 44, 0.06);
}

.paidReportSidebar {
  position: sticky;
  top: 24px;
  height: fit-content;
  padding: 24px 18px;
}

.paidReportBrand {
  border-bottom: 1px solid rgba(218, 204, 174, 0.72);
  padding-bottom: 18px;
  margin-bottom: 18px;
}

.paidReportTree {
  width: 44px;
  height: 44px;
  border-radius: 50%;
  background: #eef3e8;
  display: grid;
  place-items: center;
  color: #70835f;
  font-size: 20px;
  margin-bottom: 10px;
}

.paidReportBrandTitle {
  font-size: 20px;
  font-weight: 700;
  letter-spacing: 0.04em;
  margin: 0 0 4px;
}

.paidReportBrandSub,
.paidReportNavTitle,
.paidReportAboutBox p,
.paidReportHeader p,
.paidReportFootnote {
  color: #756f61;
}

.paidReportNavTitle {
  font-size: 13px;
  margin: 0 0 12px;
}

.paidReportNav {
  display: grid;
  gap: 4px;
}

.paidReportNavItem {
  display: grid;
  grid-template-columns: 34px 1fr;
  align-items: center;
  gap: 9px;
  padding: 10px 8px;
  border-radius: 12px;
  color: #4b594b;
}

.paidReportNavItem span {
  width: 26px;
  height: 26px;
  border: 1px solid rgba(138, 152, 121, 0.35);
  border-radius: 50%;
  display: grid;
  place-items: center;
  font-size: 12px;
}

.paidReportNavItem p {
  margin: 0;
  font-size: 14px;
}

.paidReportNavItem.isActive {
  background: #eef1df;
}

.paidReportNavItem.isActive span {
  background: #70835f;
  color: #fff;
}

.paidReportAboutBox {
  margin-top: 30px;
  padding: 16px;
  border: 1px solid rgba(218, 204, 174, 0.72);
  border-radius: 14px;
  background: rgba(249, 246, 234, 0.75);
}

.paidReportAboutTitle {
  color: #425b42 !important;
  font-weight: 700;
  margin: 0 0 8px;
}

.paidReportAboutBox p {
  font-size: 13px;
  line-height: 1.8;
  margin: 0;
}

.paidReportMain {
  display: grid;
  gap: 20px;
}

.paidReportHeader {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 24px;
  padding: 8px 4px 6px;
}

.paidReportEyebrow {
  font-size: 13px;
  margin: 0 0 10px;
  color: #70835f !important;
  font-weight: 700;
}

.paidReportHeader h1 {
  font-size: clamp(28px, 3.6vw, 44px);
  line-height: 1.35;
  letter-spacing: 0.04em;
  margin: 0;
  color: #1f3328;
}

.paidReportProfile {
  min-width: 310px;
  display: flex;
  align-items: center;
  gap: 14px;
  justify-content: flex-end;
}

.paidReportAvatar {
  width: 64px;
  height: 64px;
  border-radius: 50%;
  background: #e9efe2;
  color: #506b4c;
  display: grid;
  place-items: center;
  font-weight: 700;
}

.paidReportName {
  color: #28372c !important;
  font-size: 18px;
  font-weight: 700;
  margin: 0 0 4px;
}

.paidHeroCard {
  padding: 28px;
  display: grid;
  grid-template-columns: 230px 1fr;
  gap: 26px;
  align-items: center;
}

.paidHeroScore {
  width: 210px;
  height: 210px;
  border-radius: 50%;
  border: 12px solid #dce5d2;
  border-right-color: #758b63;
  display: grid;
  place-items: center;
  align-content: center;
  text-align: center;
  background: #fffdf7;
}

.paidHeroScore p,
.paidHeroScore span,
.paidHeroScore em {
  margin: 0;
  color: #716a5d;
  font-style: normal;
}

.paidHeroScore strong {
  font-size: 64px;
  line-height: 1;
  color: #3b2c21;
}

.paidHeroScore em {
  margin-top: 8px;
  color: #5e7a4f;
  font-size: 24px;
  font-weight: 700;
}

.paidHeroText h2 {
  font-size: 26px;
  line-height: 1.7;
  margin: 0 0 16px;
  color: #26382d;
}

.paidHeroText p {
  font-size: 16px;
  line-height: 2.05;
  margin: 0;
  color: #5f5a50;
}

.paidHeroMini {
  grid-column: 1 / -1;
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  border: 1px solid rgba(218, 204, 174, 0.72);
  border-radius: 14px;
  overflow: hidden;
}

.paidHeroMini div {
  padding: 18px 14px;
  border-right: 1px solid rgba(218, 204, 174, 0.72);
}

.paidHeroMini div:last-child {
  border-right: 0;
}

.paidHeroMini span {
  display: block;
  color: #8a7a54;
  font-size: 13px;
  margin-bottom: 7px;
}

.paidHeroMini strong {
  color: #496442;
  font-size: 16px;
}

.paidWideCard,
.paidScoreCard,
.paidInfoCard {
  padding: 24px;
}

.paidSectionTitle {
  display: flex;
  align-items: flex-start;
  gap: 12px;
  margin-bottom: 18px;
}

.paidSectionTitle span {
  width: 34px;
  height: 34px;
  border-radius: 50%;
  background: #667d58;
  color: #fff;
  display: grid;
  place-items: center;
  font-weight: 700;
  flex: 0 0 auto;
}

.paidSectionTitle h2 {
  margin: 0;
  font-size: 20px;
  letter-spacing: 0.03em;
  color: #2d432f;
}

.paidSectionTitle p {
  margin: 4px 0 0;
  color: #777063;
  line-height: 1.7;
}

.paidSectionTitle.compact {
  align-items: center;
}

.paidSectionTitle.compact h2 {
  font-size: 20px;
}

.paidEvidenceGrid,
.paidTeacherGrid,
.paidStrategyGrid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 16px;
}

.paidEvidenceGrid div,
.paidStrategyGrid div,
.paidTeacherGrid div {
  border: 1px solid rgba(218, 204, 174, 0.72);
  border-radius: 14px;
  padding: 18px;
  background: #fffef9;
}

.paidEvidenceGrid h3,
.paidStrategyGrid h3,
.paidTeacherGrid h3,
.paidScoreRow h3 {
  margin: 0 0 8px;
  color: #3d5b39;
  font-size: 16px;
}

.paidEvidenceGrid ul,
.paidInfoCard ul {
  margin: 0;
  padding-left: 1.2em;
  line-height: 2;
  color: #5b554c;
}

.paidScoreLayout {
  display: grid;
  grid-template-columns: 330px 1fr;
  gap: 28px;
  align-items: center;
}

.paidRadarMock {
  position: relative;
  min-height: 300px;
  display: grid;
  place-items: center;
}

.paidRadarDiamond {
  width: 150px;
  height: 150px;
  background: rgba(117, 139, 99, 0.28);
  border: 2px solid rgba(89, 115, 76, 0.7);
  transform: rotate(45deg);
}

.paidRadarMock p {
  position: absolute;
  text-align: center;
  font-size: 13px;
  line-height: 1.6;
  color: #4d4b43;
}

.paidRadarMock b {
  color: #5b7a4e;
  font-size: 20px;
}

.radarTop { top: 0; left: 50%; transform: translateX(-50%); }
.radarRight { right: 0; top: 50%; transform: translateY(-50%); }
.radarBottom { bottom: 0; left: 50%; transform: translateX(-50%); }
.radarLeft { left: 0; top: 50%; transform: translateY(-50%); }

.paidScoreList {
  display: grid;
  gap: 4px;
}

.paidScoreRow {
  display: flex;
  justify-content: space-between;
  gap: 16px;
  align-items: center;
  padding: 16px 0;
  border-bottom: 1px solid rgba(218, 204, 174, 0.72);
}

.paidScoreRow:last-child {
  border-bottom: 0;
}

.paidScoreRow p {
  margin: 0;
  color: #756f61;
  line-height: 1.6;
}

.paidScoreRow strong {
  color: #4f703f;
  font-size: 30px;
}

.paidScoreRow strong span {
  color: #776f63;
  font-size: 13px;
  margin-left: 3px;
}

.paidCardGrid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 20px;
}

.paidInfoCard.wide {
  grid-column: span 1;
}

.paidInfoCard.warning .paidSectionTitle span {
  background: #a88948;
}

.paidCardLead {
  color: #4f5d4d;
  line-height: 1.9;
  margin: 0 0 14px;
  font-weight: 600;
}

.paidStrategyGrid,
.paidTeacherGrid {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

.paidStrategyGrid p,
.paidTeacherGrid p {
  margin: 0;
  color: #5c564d;
  line-height: 1.8;
}

.paidAdviceBox {
  background: #eef1e6;
  border-radius: 12px;
  padding: 14px 16px;
  margin: 16px 0 0;
  color: #4f624d;
  line-height: 1.8;
}

.paidReportFootnote {
  text-align: center;
  font-size: 13px;
  margin: 0;
  padding: 6px 0;
}

.resultCtaButton[href],
.paidResultCtaButton[href] {
  text-decoration: none;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}

@media (max-width: 980px) {
  .paidReportShell {
    grid-template-columns: 1fr;
  }

  .paidReportSidebar {
    position: static;
  }

  .paidReportHeader,
  .paidHeroCard {
    grid-template-columns: 1fr;
    display: grid;
  }

  .paidReportProfile {
    justify-content: flex-start;
    min-width: 0;
  }

  .paidHeroMini,
  .paidScoreLayout,
  .paidCardGrid,
  .paidEvidenceGrid,
  .paidStrategyGrid,
  .paidTeacherGrid {
    grid-template-columns: 1fr;
  }

  .paidHeroScore {
    margin: 0 auto;
  }
}


/* v159 dev links and button press */
.devMenuLinkBtn {
  text-decoration: none;
  color: inherit;
}

.resultCtaButton,
.paidResultCtaButton {
  transition: transform 120ms ease, box-shadow 120ms ease, filter 120ms ease;
  will-change: transform;
}

.resultCtaButton:active,
.paidResultCtaButton:active {
  transform: translateY(2px) scale(0.985);
  box-shadow: 0 4px 12px rgba(58, 83, 60, 0.12) inset, 0 2px 8px rgba(58, 83, 60, 0.08) !important;
  filter: brightness(0.97);
}


/* v160 paid report toc layout */
.paidReportPageV160 { height: 100vh; overflow: hidden; padding: 28px; }
.paidReportShellV160 { max-width: 1280px; height: calc(100vh - 56px); grid-template-columns: 290px minmax(0, 1fr); align-items: stretch; }
.paidReportSidebarV160 { position: static; height: 100%; overflow-y: auto; padding: 24px 18px; scrollbar-width: thin; }
.paidReportMainV160 { height: 100%; overflow-y: auto; padding: 0 8px 40px 0; scroll-behavior: smooth; scrollbar-width: thin; }
.paidReportNavV160 { gap: 10px; }
.paidReportNavCard { display: grid; grid-template-columns: 42px 1fr; gap: 12px; padding: 14px 12px; border: 1px solid rgba(218, 204, 174, 0.58); border-radius: 15px; background: rgba(255, 253, 247, 0.72); color: inherit; text-decoration: none; transition: transform 140ms ease, box-shadow 140ms ease, background 140ms ease; }
.paidReportNavCard:hover { transform: translateY(-1px); background: rgba(247, 249, 239, 0.96); box-shadow: 0 10px 22px rgba(52, 64, 45, 0.06); }
.paidReportNavCard.isActive { background: #eef1df; }
.paidReportNavNo { width: 34px; height: 34px; border-radius: 10px; background: #4f6a4d; color: #fff; display: grid; place-items: center; font-weight: 700; }
.paidReportNavCard strong { display: block; color: #2f4433; font-size: 16px; margin-bottom: 4px; }
.paidReportNavCard p { margin: 0; color: #756f61; font-size: 12px; line-height: 1.7; }
.paidReportNavCard ul { margin: 8px 0 0; padding-left: 1.1em; color: #777064; font-size: 12px; line-height: 1.65; }
.paidReportHeaderV160 { background: rgba(255, 253, 247, 0.6); border: 1px solid rgba(218, 204, 174, 0.46); border-radius: 20px; padding: 24px 26px; margin-bottom: 4px; }
.paidReportHeaderLead { max-width: 720px; font-size: 13px; line-height: 1.9; margin: 16px 0 0; }
.paidReportProfileV160 { align-self: flex-start; }
.paidChapter { scroll-margin-top: 24px; background: rgba(255, 253, 247, 0.92); border: 1px solid rgba(218, 204, 174, 0.72); border-radius: 22px; box-shadow: 0 14px 36px rgba(55, 66, 44, 0.055); padding: 28px; margin-top: 20px; }
.paidChapterHero { background: linear-gradient(135deg, rgba(240, 247, 235, 0.9), rgba(255, 253, 247, 0.96)); border-color: rgba(149, 170, 133, 0.55); }
.paidChapterHead { display: flex; gap: 14px; align-items: flex-start; padding-bottom: 18px; margin-bottom: 22px; border-bottom: 1px solid rgba(218, 204, 174, 0.72); }
.paidChapterHead > span { width: 42px; height: 42px; border-radius: 12px; background: #4f6a4d; color: #fff; display: grid; place-items: center; font-weight: 700; flex: 0 0 auto; }
.paidChapterHead p { margin: 0 0 4px; color: #7a715f; font-size: 14px; font-weight: 700; }
.paidChapterHead h2 { margin: 0; color: #26382d; font-size: 26px; line-height: 1.45; letter-spacing: 0.03em; }
.paidJudgementPanel { display: grid; grid-template-columns: 230px 1fr; gap: 26px; align-items: center; }
.paidJudgementBadge { min-height: 190px; border-radius: 20px; border: 1px solid rgba(218, 204, 174, 0.72); background: #fffdf7; display: grid; align-content: center; justify-items: center; text-align: center; padding: 24px; }
.paidJudgementBadge p { color: #756f61; margin: 0 0 12px; }
.paidJudgementBadge strong { color: #43603f; font-size: 48px; letter-spacing: 0.06em; }
.paidJudgementText h3 { font-size: 21px; line-height: 1.55; color: #2f4d33; margin: 0 0 14px; }
.paidJudgementText p, .paidReportBlock p { color: #575148; line-height: 2.05; margin: 0 0 12px; }
.paidTwoColumn { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 18px; }
.paidReportBlock { border: 1px solid rgba(218, 204, 174, 0.72); border-radius: 18px; background: #fffef9; padding: 22px; }
.paidReportBlock h3 { color: #365338; font-size: 20px; margin: 0 0 12px; }
.paidReportBlock ul { margin: 12px 0 0; padding-left: 1.2em; color: #575148; line-height: 2; }
.paidTrustTiles, .paidMethodRows { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; margin-top: 16px; }
.paidTrustTiles div, .paidMethodRows div { border-radius: 14px; background: #f2f4ea; border: 1px solid rgba(218, 204, 174, 0.56); padding: 14px; text-align: center; }
.paidTrustTiles span, .paidMethodRows span { display: block; color: #7a715f; font-size: 12px; margin-bottom: 6px; }
.paidTrustTiles strong, .paidMethodRows strong { color: #45633f; font-size: 16px; }
@media (max-width: 980px) { .paidReportPageV160 { height: auto; overflow: visible; padding: 20px; } .paidReportShellV160 { height: auto; grid-template-columns: 1fr; } .paidReportSidebarV160, .paidReportMainV160 { height: auto; overflow: visible; } .paidJudgementPanel, .paidTwoColumn, .paidTrustTiles, .paidMethodRows { grid-template-columns: 1fr; } }


/* v161 paid toc no scrollbar no status link */
.paidReportSidebarV160,
.paidReportMainV160 {
  -ms-overflow-style: none;
  scrollbar-width: none;
}

.paidReportSidebarV160::-webkit-scrollbar,
.paidReportMainV160::-webkit-scrollbar {
  display: none;
}

.paidReportNavCard {
  width: 100%;
  border: 1px solid rgba(218, 204, 174, 0.58);
  font: inherit;
  text-align: left;
  cursor: pointer;
}

.paidReportNavCard:active {
  transform: translateY(1px) scale(0.995);
  box-shadow: inset 0 3px 9px rgba(58, 83, 60, 0.08);
}


/* v163 paid summary patterns */
.paidJudgementPanelTextOnly {
  grid-template-columns: 1fr !important;
}

.paidJudgementTextFull {
  max-width: 820px;
}

.paidDetailPlaceholder {
  min-height: 72px;
  margin-top: 20px;
  border-radius: 16px;
  border: 1px dashed rgba(218, 204, 174, 0.82);
  background: rgba(255, 253, 247, 0.45);
}

.paidPatternPreviewPage {
  min-height: 100vh;
  height: auto;
  overflow: visible;
}

.paidPatternPreviewShell {
  width: min(980px, calc(100vw - 40px));
  margin: 0 auto;
  padding: 24px 0 56px;
}

.paidPatternPreviewHeader {
  background: rgba(255, 253, 247, 0.92);
  border: 1px solid rgba(218, 204, 174, 0.72);
  border-radius: 22px;
  padding: 28px;
  margin-bottom: 20px;
}

.paidPatternPreviewHeader h1 {
  margin: 0 0 10px;
  color: #26382d;
  font-size: 30px;
}

.paidPatternPreviewHeader p:last-child {
  margin: 0;
  color: #756f61;
  line-height: 1.8;
}

.paidPatternPreviewList {
  display: grid;
  gap: 18px;
}

.paidPatternCard {
  background: rgba(255, 253, 247, 0.94);
  border: 1px solid rgba(218, 204, 174, 0.72);
  border-radius: 22px;
  box-shadow: 0 14px 36px rgba(55, 66, 44, 0.055);
  padding: 28px;
}

.paidPatternLabel {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: #eef1df;
  color: #496442;
  border: 1px solid rgba(149, 170, 133, 0.45);
  border-radius: 999px;
  padding: 6px 14px;
  font-weight: 700;
  margin-bottom: 14px;
}

.paidPatternCard h2 {
  margin: 0 0 16px;
  color: #2f4d33;
  font-size: 26px;
  line-height: 1.55;
}

.paidPatternCard p {
  color: #575148;
  line-height: 2.05;
  margin: 0 0 12px;
}


/* v165 growth section */
.paidGrowthReportBlock h4 {
  margin: 0 0 14px;
  color: #2f4d33;
  font-size: 21px;
  line-height: 1.6;
}


/* v166 growth topics */
.paidGrowthTopicList {
  display: grid;
  gap: 14px;
  margin: 18px 0;
}

.paidGrowthTopic {
  border: 1px solid rgba(89, 116, 76, 0.18);
  border-radius: 18px;
  background: rgba(255, 252, 244, 0.72);
  padding: 16px 18px;
}

.paidGrowthTopic h5 {
  margin: 0 0 8px;
  color: #2f4d33;
  font-size: 16px;
  line-height: 1.5;
}

.paidGrowthTopic p {
  margin: 0;
}


/* v167 growth plain */
.paidGrowthPlainBlock {
  max-width: none;
}

.paidGrowthPlainBlock h4 {
  margin: 0 0 22px;
  color: #2f4d33;
  font-size: 21px;
  line-height: 1.6;
}

.paidGrowthPlainBlock p {
  margin: 0 0 18px;
}

.paidGrowthPlainBlock .paidGrowthTopicList,
.paidGrowthPlainBlock .paidGrowthTopic {
  display: contents;
}

.paidGrowthPlainBlock .paidGrowthTopic h5 {
  display: none;
}


/* v175 paid report Readdy-like premium polish */
.paidReportPageV160 {
  height: 100vh;
  overflow: hidden;
  padding: 22px;
  background:
    radial-gradient(circle at 4% 4%, rgba(186, 214, 173, 0.46), transparent 30%),
    radial-gradient(circle at 94% 2%, rgba(234, 213, 169, 0.50), transparent 27%),
    linear-gradient(135deg, #f6f5ec 0%, #fbf8ed 48%, #eff4e8 100%);
}

.paidReportShellV160 {
  max-width: 1460px;
  height: calc(100vh - 44px);
  grid-template-columns: 240px minmax(0, 1fr);
  gap: 26px;
}

.paidReportSidebarV160 {
  border: 1px solid rgba(210, 196, 160, 0.52);
  border-radius: 30px;
  background: linear-gradient(180deg, rgba(255, 254, 248, 0.86), rgba(248, 249, 239, 0.76));
  box-shadow: 0 28px 80px rgba(52, 68, 48, 0.09);
  backdrop-filter: blur(16px);
  padding: 24px 16px;
}

.paidReportAboutBox { display: none; }

.paidReportNavCard {
  border: 1px solid rgba(210, 196, 160, 0.46);
  border-radius: 20px;
  background: rgba(255, 254, 248, 0.58);
  grid-template-columns: 38px 1fr;
  padding: 14px 12px;
}

.paidReportNavCard.isActive {
  background: linear-gradient(135deg, #eff6e9, #fffaf0);
  border-color: rgba(81, 112, 75, 0.30);
  box-shadow: 0 18px 42px rgba(57, 78, 52, 0.10);
}

.paidReportNavNo {
  width: 36px;
  height: 36px;
  border-radius: 14px;
  background: #405f42;
}

.paidReportNavCard ul { display: none; }

.paidReportHeaderV175 {
  position: relative;
  overflow: hidden;
  min-height: 168px;
  border: 1px solid rgba(210, 196, 160, 0.48);
  border-radius: 32px;
  background: linear-gradient(135deg, rgba(255, 254, 248, 0.94), rgba(245, 250, 238, 0.92));
  box-shadow: 0 30px 90px rgba(50, 64, 45, 0.09);
  padding: 34px 38px;
  margin-bottom: 30px;
}

.paidReportHeaderV175::after {
  content: "";
  position: absolute;
  width: 280px;
  height: 280px;
  right: -120px;
  top: -120px;
  border-radius: 50%;
  background: radial-gradient(circle, rgba(135, 166, 119, 0.20), transparent 68%);
  pointer-events: none;
}

.paidReportHeaderCopyV175 h1 {
  margin: 4px 0 0;
  color: #213529;
  font-size: clamp(34px, 4.4vw, 58px);
  line-height: 1.16;
  letter-spacing: 0.06em;
}

.paidReportHeaderV175 .paidReportEyebrow {
  color: #517047;
  font-size: 12px;
  font-weight: 800;
  letter-spacing: 0.16em;
}

.paidReportHeaderV175 .paidReportHeaderLead {
  max-width: 720px;
  margin-top: 16px;
  color: #716b60;
  font-size: 13px;
  line-height: 1.9;
}

.paidReportStatusV175 {
  position: relative;
  z-index: 1;
  min-width: 158px;
  border-radius: 28px;
  background: linear-gradient(155deg, #3f613f, #2e4d34);
  color: #fff;
  padding: 22px 20px;
  text-align: center;
  box-shadow: 0 22px 55px rgba(50, 76, 47, 0.24);
}

.paidReportStatusV175 span {
  display: block;
  font-size: 11px;
  letter-spacing: 0.14em;
  opacity: 0.82;
  font-weight: 800;
}

.paidReportStatusV175 strong {
  display: block;
  font-size: 36px;
  line-height: 1.15;
  margin-top: 7px;
}

.paidReportStatusV175 p {
  margin: 9px 0 0;
  color: rgba(255,255,255,.86);
  font-size: 12px;
  font-weight: 700;
}

.paidChapterV175,
.paidChapter {
  border: 1px solid rgba(210, 196, 160, 0.44);
  border-radius: 32px;
  background: linear-gradient(180deg, rgba(255, 254, 249, 0.92), rgba(255, 252, 244, 0.86));
  box-shadow: 0 28px 84px rgba(49, 63, 44, 0.08);
  padding: 38px 44px;
  margin-top: 26px;
}

.paidChapterHeroV175,
.paidChapterHero {
  background: linear-gradient(135deg, rgba(236, 248, 230, 0.96), rgba(255, 254, 249, 0.95));
  border-color: rgba(122, 151, 104, 0.36);
}

.paidChapterHead {
  display: grid;
  grid-template-columns: 58px 1fr;
  gap: 18px;
  align-items: center;
  border-bottom: 1px solid rgba(210, 196, 160, 0.58);
  padding-bottom: 24px;
  margin-bottom: 30px;
}

.paidChapterHead > span {
  width: 58px;
  height: 58px;
  border-radius: 18px;
  background: linear-gradient(145deg, #466847, #36553a);
  color: #fff;
  font-size: 18px;
  box-shadow: 0 15px 28px rgba(54, 78, 50, 0.22);
}

.paidChapterHead p {
  color: #68745e;
  font-size: 13px;
  font-weight: 800;
  letter-spacing: 0.09em;
}

.paidChapterHead h2 {
  color: #223529;
  font-size: clamp(26px, 3vw, 40px);
  line-height: 1.34;
  letter-spacing: 0.04em;
}

.paidJudgementText h3,
.paidGrowthPlainBlock h4,
.paidReportBlockV175 h3 {
  color: #253f2f;
  font-size: clamp(23px, 2.4vw, 32px);
  line-height: 1.58;
  letter-spacing: 0.03em;
  margin: 0 0 22px;
}

.paidJudgementText p,
.paidReportBlock p,
.paidGrowthPlainBlock p {
  color: #524c44;
  font-size: 16.5px;
  line-height: 2.1;
  margin: 0 0 16px;
}

.paidReportBlockV175,
.paidReportBlock {
  border: 0;
  background: transparent;
  box-shadow: none;
  padding: 0;
}

.paidReportBlockV175 ul,
.paidReportBlock ul {
  margin: 12px 0 20px;
  padding: 18px 26px 18px 44px;
  border-left: 4px solid rgba(68, 100, 65, 0.30);
  border-radius: 0 18px 18px 0;
  background: rgba(241, 246, 234, 0.72);
  color: #524c44;
  line-height: 2.05;
}

.paidReportFootnote {
  margin: 26px 0 0;
  padding: 18px 22px;
  border: 1px solid rgba(210, 196, 160, 0.48);
  border-radius: 18px;
  background: rgba(255, 254, 249, 0.72);
}

.paidDetailPlaceholder { display: none; }

@media (max-width: 980px) {
  .paidReportPageV160 { height: auto; overflow: visible; padding: 16px; }
  .paidReportShellV160 { height: auto; grid-template-columns: 1fr; }
  .paidReportSidebarV160 { display: none; }
  .paidReportMainV160 { height: auto; overflow: visible; padding: 0; }
  .paidReportHeaderV175 { display: grid; gap: 20px; padding: 28px 22px; }
  .paidReportStatusV175 { width: fit-content; }
  .paidChapterV175, .paidChapter { padding: 26px 22px; border-radius: 24px; }
  .paidChapterHead { grid-template-columns: 48px 1fr; }
  .paidChapterHead > span { width: 48px; height: 48px; }
}

/* v176 cleanup */
.paidReportHeaderV175,
.paidReportHeader{
  display:none !important;
}

/* 総合判断だけ色が違う問題を統一 */
.paidJudgementPanel,
.paidJudgementPanelTextOnly,
.paidJudgementText{
  background:#fffdf9 !important;
}


/* v177: 総合判断セクション全体を白へ統一 */
#summary,
#summary .paidJudgementPanel,
#summary .paidJudgementPanelTextOnly,
#summary .paidJudgementText,
#summary .paidReportBlock,
#summary .paidReportBlockV175,
#summary .paidGrowthPlainBlock {
  background: #fffdf9 !important;
}


/* v178 pretest landing upgrade */
.pretestLandingV178 {
  max-width: 1180px;
  margin: 0 auto;
  color: #223528;
}

.pretestHeroV178,
.pretestSectionV178,
.pretestInfoPanelV178,
.pretestMethodV178,
.pretestParentGuideV178,
.pretestBottomCtaV178 {
  border: 1px solid rgba(201, 219, 190, 0.9);
  background: rgba(255, 254, 248, 0.9);
  border-radius: 32px;
  box-shadow: 0 28px 80px rgba(53, 77, 50, 0.09);
}

.pretestHeroV178 {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 290px;
  gap: 32px;
  align-items: center;
  padding: clamp(28px, 5vw, 54px);
  overflow: hidden;
  position: relative;
}

.pretestHeroV178::before {
  content: "";
  position: absolute;
  right: -120px;
  top: -120px;
  width: 320px;
  height: 320px;
  border-radius: 50%;
  background: radial-gradient(circle, rgba(108, 160, 93, 0.18), transparent 68%);
  pointer-events: none;
}

.pretestKickerV178,
.pretestSectionHeadV178 p {
  margin: 0 0 10px;
  color: #4f9c65;
  font-weight: 900;
  letter-spacing: 0.08em;
  font-size: 13px;
}

.pretestHeroCopyV178 h2 {
  margin: 0 0 20px;
  font-size: clamp(38px, 6vw, 72px);
  line-height: 1.08;
  letter-spacing: 0.04em;
  color: #1e3227;
}

.pretestHeroCopyV178 p {
  color: #5f6d5e;
  font-size: 17px;
  line-height: 2;
  margin: 0 0 12px;
}

.pretestHeroActionsV178 {
  display: flex;
  align-items: center;
  gap: 16px;
  flex-wrap: wrap;
  margin-top: 26px;
}

.pretestHeroActionsV178 span {
  color: #6e786b;
  font-size: 13px;
  font-weight: 700;
}

.pretestPrimaryBtnV178 {
  background: linear-gradient(135deg, #3f8f59, #6ba967) !important;
  color: #fff !important;
  box-shadow: 0 18px 34px rgba(66, 143, 85, 0.25);
  padding: 15px 24px;
}

.pretestSummaryCardV178 {
  position: relative;
  z-index: 1;
  min-height: 250px;
  border-radius: 30px;
  padding: 28px;
  background:
    linear-gradient(155deg, #345a39, #273f2f);
  color: #fff;
  box-shadow: 0 26px 58px rgba(44, 72, 43, 0.24);
  display: flex;
  flex-direction: column;
  justify-content: center;
}

.pretestSummaryCardV178 span {
  font-size: 12px;
  opacity: 0.76;
  font-weight: 900;
  letter-spacing: 0.15em;
}

.pretestSummaryCardV178 strong {
  display: block;
  font-size: 30px;
  line-height: 1.35;
  margin: 16px 0;
}

.pretestSummaryCardV178 p {
  color: rgba(255,255,255,0.82);
  line-height: 1.85;
  margin: 0;
}

.pretestSectionV178 {
  margin-top: 24px;
  padding: 30px;
}

.pretestSectionHeadV178 h3 {
  margin: 0;
  color: #223528;
  font-size: clamp(24px, 3vw, 34px);
  line-height: 1.35;
}

.pretestCoreGridV178 {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 16px;
  margin-top: 22px;
}

.pretestCoreCardV178 {
  border: 1px solid rgba(201, 219, 190, 0.92);
  border-radius: 24px;
  background: linear-gradient(180deg, #ffffff, #f8fbf4);
  padding: 22px;
}

.pretestCoreCardV178 span {
  display: inline-grid;
  place-items: center;
  width: 38px;
  height: 38px;
  border-radius: 14px;
  background: #e9f4e4;
  color: #3f784c;
  font-weight: 900;
  margin-bottom: 16px;
}

.pretestCoreCardV178 h4 {
  margin: 0 0 10px;
  color: #203529;
  font-size: 20px;
}

.pretestCoreCardV178 p {
  color: #647062;
  line-height: 1.75;
  margin: 0;
}

.pretestTwoColumnV178 {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 20px;
  margin-top: 24px;
}

.pretestInfoPanelV178 {
  padding: 30px;
}

.pretestSoftPanelV178 {
  background: rgba(255, 252, 241, 0.92);
  border-color: rgba(222, 211, 179, 0.9);
}

.pretestInfoPanelV178 ul {
  margin: 20px 0 0;
  padding: 0;
  list-style: none;
  display: grid;
  gap: 12px;
}

.pretestInfoPanelV178 li {
  position: relative;
  padding: 14px 16px 14px 42px;
  border-radius: 16px;
  background: rgba(242, 248, 236, 0.82);
  color: #4f5b50;
  line-height: 1.6;
  font-weight: 700;
}

.pretestInfoPanelV178 li::before {
  content: "✓";
  position: absolute;
  left: 16px;
  top: 14px;
  color: #4f9c65;
  font-weight: 900;
}

.pretestSoftPanelV178 li {
  background: rgba(255, 255, 255, 0.72);
}

.pretestSoftPanelV178 li::before {
  content: "–";
  color: #a3844c;
}

.pretestMethodV178 {
  margin-top: 24px;
  padding: 34px;
  display: grid;
  grid-template-columns: minmax(0, 1fr) 360px;
  gap: 30px;
  align-items: center;
}

.pretestMethodV178 h3 {
  margin: 0 0 16px;
  color: #203529;
  font-size: clamp(24px, 3vw, 34px);
}

.pretestMethodV178 p {
  color: #5f6d5e;
  line-height: 2;
  margin: 0 0 12px;
}

.pretestStepsV178 {
  display: grid;
  gap: 12px;
}

.pretestStepsV178 div {
  display: grid;
  grid-template-columns: 54px 1fr;
  align-items: center;
  gap: 14px;
  border-radius: 18px;
  background: #f4f8ee;
  border: 1px solid rgba(201, 219, 190, 0.9);
  padding: 14px;
}

.pretestStepsV178 strong {
  width: 42px;
  height: 42px;
  border-radius: 14px;
  background: #3f6b45;
  color: #fff;
  display: grid;
  place-items: center;
  font-size: 14px;
}

.pretestStepsV178 span {
  color: #405342;
  font-weight: 800;
}

.pretestParentGuideV178 {
  margin-top: 24px;
  padding: 28px 30px;
}

.pretestParentGuideV178 h3 {
  color: #203529;
  font-size: 24px;
}

.pretestBottomCtaV178 {
  margin-top: 24px;
  padding: 26px 30px;
  display: flex;
  justify-content: space-between;
  gap: 20px;
  align-items: center;
}

.pretestBottomCtaV178 p {
  margin: 0 0 6px;
  color: #4f9c65;
  font-weight: 900;
  letter-spacing: 0.04em;
}

.pretestBottomCtaV178 strong {
  color: #203529;
  font-size: 20px;
}

@media (max-width: 980px) {
  .pretestHeroV178,
  .pretestMethodV178,
  .pretestTwoColumnV178 {
    grid-template-columns: 1fr;
  }

  .pretestCoreGridV178 {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .pretestBottomCtaV178 {
    display: grid;
  }
}

@media (max-width: 640px) {
  .pretestCoreGridV178 {
    grid-template-columns: 1fr;
  }

  .pretestHeroV178,
  .pretestSectionV178,
  .pretestInfoPanelV178,
  .pretestMethodV178,
  .pretestParentGuideV178,
  .pretestBottomCtaV178 {
    border-radius: 24px;
    padding: 22px;
  }
}

/* v179 Darwin landing replacement for the first explanation page */
.darwinLanding {
  --darwin-bg: #f7f3ec;
  --darwin-panel: #fffaf2;
  --darwin-panel-strong: #ffffff;
  --darwin-text: #1f2a24;
  --darwin-muted: #68756d;
  --darwin-line: #e7dccb;
  --darwin-accent: #345d46;
  --darwin-accent-dark: #234434;
  --darwin-accent-soft: #dfeadd;
  --darwin-gold: #c9a35c;
  --darwin-shadow: 0 22px 70px rgba(54, 74, 58, 0.14);
  min-height: 100vh;
  color: var(--darwin-text);
  background: radial-gradient(circle at top left, #fffaf0 0, #f8f0e4 38%, #edf4ea 100%);
  overflow-x: hidden;
}

.darwinLanding a { color: inherit; text-decoration: none; }

/* v204 LP in-page navigation */
html {
  scroll-behavior: smooth;
}
.darwinLanding #choice,
.darwinLanding #flow,
.darwinLanding #faq {
  scroll-margin-top: 96px;
}
.darwinLanding h1,
.darwinLanding h2,
.darwinLanding h3,
.darwinLanding p { margin-top: 0; }

.darwinLanding .site-header {
  position: sticky;
  top: 0;
  z-index: 20;
  display: grid;
  grid-template-columns: auto auto 1fr;
  align-items: center;
  gap: clamp(34px, 5vw, 76px);
  width: 100%;
  max-width: none;
  margin: 0;
  padding: 17px clamp(18px, 3vw, 48px);
  background: transparent;
  backdrop-filter: none;
  box-shadow: none;
  border: 0;
}
.darwinLanding .brand {
  display: inline-flex;
  align-items: center;
  min-width: 132px;
}
.darwinLanding .brand strong {
  display: block;
  color: var(--darwin-text);
  font-size: 20px;
  line-height: 1;
  font-weight: 850;
  letter-spacing: -0.055em;
  transition: opacity 160ms ease, transform 160ms ease;
}
.darwinLanding .brand.is-refreshing strong {
  opacity: 0.42;
  transform: translateY(-1px);
}
.darwinLanding .main-nav {
  display: flex;
  align-items: center;
  justify-content: flex-start;
  gap: 26px;
  color: #506058;
  font-size: 14px;
  font-weight: 700;
  white-space: nowrap;
}
.darwinLanding .main-nav a:hover { color: var(--darwin-accent-dark); }
.darwinLanding .header-actions {
  display: inline-flex;
  align-items: center;
  justify-content: flex-end;
  justify-self: end;
  gap: 12px;
  white-space: nowrap;
}
.darwinLanding .header-cta,
.darwinLanding .login-button,
.darwinLanding .primary-button,
.darwinLanding .secondary-button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 44px;
  border-radius: 999px;
  padding: 0 20px;
  font-weight: 700;
  font-size: 14px;
}
.darwinLanding .header-cta,
.darwinLanding .primary-button {
  color: #fff;
  background: var(--darwin-accent);
  box-shadow: 0 12px 28px rgba(35, 68, 52, 0.22);
}
.darwinLanding .login-button {
  color: var(--darwin-accent-dark);
  background: transparent;
  border: 1px solid rgba(52, 93, 70, 0.18);
}
.darwinLanding .login-button:hover {
  border-color: rgba(52, 93, 70, 0.32);
  background: rgba(255, 255, 255, 0.5);
}
.darwinLanding .secondary-button { color: var(--darwin-accent-dark); background: rgba(255,255,255,0.72); border: 1px solid var(--darwin-line); }

.darwinLanding .hero-section {
  display: grid;
  grid-template-columns: minmax(0, 1.08fr) minmax(320px, 0.92fr);
  gap: 64px;
  align-items: center;
  width: min(1160px, calc(100% - 40px));
  margin: 70px auto 80px;
  padding: 34px 0 28px;
}
.darwinLanding .eyebrow {
  margin: 0 0 14px;
  color: var(--darwin-accent);
  font-size: 13px;
  font-weight: 800;
  letter-spacing: 0.08em;
}
.darwinLanding h1 {
  max-width: 780px;
  margin-bottom: 22px;
  font-size: clamp(34px, 5.1vw, 58px);
  line-height: 1.14;
  letter-spacing: -0.055em;
}
.darwinLanding .hero-lead {
  max-width: 610px;
  margin-bottom: 28px;
  color: #516159;
  font-size: 19px;
  line-height: 1.9;
}
.darwinLanding .hero-actions { display: flex; flex-wrap: wrap; gap: 14px; margin-bottom: 18px; }
.darwinLanding .hero-note { color: var(--darwin-muted); font-size: 13px; }
/* v227: hero diagnostic card removed and replaced by photographic hero visual. */
.darwinLanding .worry-section,
.darwinLanding .content-section,
.darwinLanding .final-cta {
  width: min(1160px, calc(100% - 40px));
  margin: 0 auto 70px;
}
.darwinLanding .worry-section {
  padding: 44px;
  border-radius: 34px;
  background: var(--darwin-panel-strong);
  box-shadow: 0 18px 50px rgba(40, 60, 49, 0.08);
}
.darwinLanding .worry-section h2,
.darwinLanding .section-heading h2,
.darwinLanding .final-cta h2 {
  margin-bottom: 28px;
  font-size: clamp(28px, 4vw, 46px);
  line-height: 1.24;
  letter-spacing: -0.05em;
}
.darwinLanding .worry-grid,
.darwinLanding .card-grid,
.darwinLanding .flow-grid,
.darwinLanding .sample-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 18px;
}
.darwinLanding .worry-grid article,
.darwinLanding .info-card,
.darwinLanding .flow-grid article,
.darwinLanding .sample-card,
.darwinLanding .core-item,
.darwinLanding details {
  border: 1px solid var(--darwin-line);
  background: rgba(255,255,255,0.78);
  border-radius: 24px;
}
.darwinLanding .worry-grid article { padding: 24px; font-weight: 800; color: #34483d; }
.darwinLanding .content-section { padding: 64px 0; }
.darwinLanding .soft-bg {
  padding: 58px;
  border-radius: 38px;
  background: rgba(255, 250, 242, 0.76);
  box-shadow: 0 18px 50px rgba(40, 60, 49, 0.07);
}
.darwinLanding .section-heading { max-width: 760px; margin-bottom: 30px; }
.darwinLanding .info-card { padding: 28px; }
.darwinLanding .info-card h3,
.darwinLanding .core-item h3,
.darwinLanding .flow-grid h3,
.darwinLanding .sample-card h3 { margin-bottom: 10px; font-size: 21px; letter-spacing: -0.03em; }
.darwinLanding .info-card p,
.darwinLanding .core-item p,
.darwinLanding .flow-grid p,
.darwinLanding .sample-card p,
.darwinLanding .faq-list p { color: var(--darwin-muted); line-height: 1.8; }
.darwinLanding .core-list { display: grid; gap: 16px; }
.darwinLanding .core-item { display: grid; grid-template-columns: 64px 1fr; gap: 18px; padding: 24px; }
.darwinLanding .core-item span,
.darwinLanding .flow-grid span {
  display: grid;
  place-items: center;
  width: 44px;
  height: 44px;
  border-radius: 16px;
  background: var(--darwin-accent-soft);
  color: var(--darwin-accent-dark);
  font-weight: 900;
}
.darwinLanding .flow-grid article { padding: 28px; }
.darwinLanding .sample-grid { grid-template-columns: repeat(2, 1fr); }
.darwinLanding .sample-card { padding: 30px; }
.darwinLanding .sample-card.highlight { border-color: rgba(52, 93, 70, 0.35); background: #f4fbf3; }
.darwinLanding .sample-card ul { margin: 18px 0 0; padding-left: 20px; color: #506058; line-height: 1.9; }
.darwinLanding .faq-section { padding-top: 30px; }
.darwinLanding .faq-list { display: grid; gap: 12px; }
.darwinLanding details { padding: 22px 24px; }
.darwinLanding summary { cursor: pointer; font-weight: 800; }
.darwinLanding details p { margin: 14px 0 0; }
.darwinLanding .faq-bullets { margin: 14px 0 0; padding-left: 1.25em; color: var(--darwin-muted); line-height: 1.8; }
.darwinLanding .faq-bullets li { margin: 2px 0; }
.darwinLanding .final-cta {
  margin-bottom: 40px;
  padding: 70px 40px;
  text-align: center;
  border-radius: 42px;
  color: white;
  background: linear-gradient(135deg, #234434, #406a50);
  box-shadow: var(--darwin-shadow);
}
.darwinLanding .final-cta .eyebrow { color: #dcebd9; }
.darwinLanding .final-cta .primary-button { background: #fff; color: var(--darwin-accent-dark); }

@media (max-width: 900px) {
  .darwinLanding .site-header {
    grid-template-columns: 1fr auto;
    gap: 14px 22px;
    align-items: center;
  }
  .darwinLanding .brand strong { font-size: 21px; }
  .darwinLanding .main-nav {
    grid-column: 1 / -1;
    grid-row: 2;
    width: 100%;
    gap: 18px;
    overflow-x: auto;
    padding: 4px 0 2px;
  }
  .darwinLanding .header-actions { grid-column: 2; grid-row: 1; }
  .darwinLanding .hero-section { grid-template-columns: 1fr; gap: 30px; margin-top: 42px; }
  .darwinLanding .worry-grid,
  .darwinLanding .card-grid,
  .darwinLanding .flow-grid,
  .darwinLanding .sample-grid { grid-template-columns: 1fr; }
  .darwinLanding .soft-bg { padding: 34px 22px; }
}

@media (max-width: 560px) {
  .darwinLanding .hero-section,
  .darwinLanding .worry-section,
  .darwinLanding .content-section,
  .darwinLanding .final-cta { width: min(100% - 24px, 1160px); }
  .darwinLanding .site-header {
    width: 100%;
    grid-template-columns: 1fr;
    padding: 14px 12px 8px;
  }
  .darwinLanding .brand strong { font-size: 20px; }
  .darwinLanding .header-actions {
    grid-column: 1;
    grid-row: 2;
    width: 100%;
    justify-content: stretch;
  }
  .darwinLanding .login-button,
  .darwinLanding .header-cta { flex: 1 1 0; padding: 0 14px; }
  .darwinLanding .main-nav { grid-row: 3; gap: 14px; }
  .darwinLanding .hero-actions a { width: 100%; }
  .darwinLanding .worry-section { padding: 28px 20px; }
  .darwinLanding .core-item { grid-template-columns: 1fr; }
}

/* v180 Darwin first page copy refinement */
.darwinLanding .definition-section {
  width: min(960px, calc(100% - 40px));
  margin: -34px auto 70px;
  padding: 42px 46px;
  border: 1px solid var(--darwin-line);
  border-radius: 34px;
  background: rgba(255, 255, 255, 0.78);
  box-shadow: 0 18px 50px rgba(40, 60, 49, 0.07);
}
.darwinLanding .definition-section h2 {
  margin-bottom: 18px;
  font-size: clamp(26px, 3.5vw, 42px);
  line-height: 1.28;
  letter-spacing: -0.05em;
}
.darwinLanding .definition-section p:not(.eyebrow) {
  color: var(--darwin-muted);
  font-size: 17px;
  line-height: 1.95;
}
.darwinLanding .definition-section p:last-child { margin-bottom: 0; }
.darwinLanding .card-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); }
@media (max-width: 960px) {
  .darwinLanding .card-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 720px) {
  .darwinLanding .definition-section {
    width: min(100% - 28px, 960px);
    margin: -24px auto 48px;
    padding: 28px 22px;
    border-radius: 26px;
  }
  .darwinLanding .definition-section p:not(.eyebrow) { font-size: 13px; }
  .darwinLanding .card-grid { grid-template-columns: 1fr; }
}

/* v181 hero title balance */
@media (max-width: 560px) {
  .darwinLanding h1 {
    font-size: clamp(30px, 10vw, 42px);
    line-height: 1.18;
    letter-spacing: -0.045em;
  }
}


/* v182 hero title three-line balance */
.darwinLanding .hero-title {
  max-width: 720px;
  font-size: clamp(32px, 4.35vw, 52px);
  line-height: 1.22;
  letter-spacing: -0.045em;
}
@media (max-width: 900px) {
  .darwinLanding .hero-title {
    max-width: 680px;
    font-size: clamp(31px, 7.4vw, 48px);
    line-height: 1.2;
  }
}
@media (max-width: 560px) {
  .darwinLanding .hero-title {
    font-size: clamp(27px, 8.4vw, 36px);
    line-height: 1.24;
    letter-spacing: -0.035em;
  }
}


/* v189 header logo size +2px */
.darwinLanding .brand strong {
  font-size: 26px;
}
.darwinLanding .brand.is-refreshing strong {
  opacity: 0.42;
  transform: translateY(-1px);
}

@media (max-width: 900px) {
  .darwinLanding .brand strong {
    font-size: 25px;
  }
}

@media (max-width: 560px) {
  .darwinLanding .brand strong {
    font-size: 24px;
  }
}

/* v191 explanation section layout refinement */
.darwinLanding .choice-section {
  position: relative;
  display: grid;
  grid-template-columns: minmax(360px, 0.92fr) minmax(470px, 1.08fr);
  align-items: stretch;
  gap: 42px;
  width: min(1240px, calc(100% - 64px));
  margin: -24px auto 82px;
  padding: 52px 54px;
  overflow: hidden;
  border: 1px solid rgba(222, 211, 192, 0.9);
  border-radius: 44px;
  background:
    radial-gradient(circle at 8% 18%, rgba(223, 234, 221, 0.78), transparent 34%),
    radial-gradient(circle at 92% 12%, rgba(239, 226, 198, 0.72), transparent 30%),
    linear-gradient(135deg, rgba(255, 255, 255, 0.96), rgba(255, 250, 242, 0.9));
  box-shadow: 0 28px 80px rgba(40, 60, 49, 0.13);
}
.darwinLanding .choice-section::before {
  content: "";
  position: absolute;
  inset: 18px;
  pointer-events: none;
  border: 1px solid rgba(255, 255, 255, 0.72);
  border-radius: 32px;
}
.darwinLanding .choice-section::after {
  content: "";
  position: absolute;
  right: 52px;
  bottom: 42px;
  width: 132px;
  height: 132px;
  pointer-events: none;
  border-radius: 999px;
  background: rgba(52, 93, 70, 0.07);
  box-shadow: -72px -42px 0 rgba(201, 163, 92, 0.08);
}
.darwinLanding .choice-heading,
.darwinLanding .choice-copy {
  position: relative;
  z-index: 1;
}
.darwinLanding .choice-heading {
  display: flex;
  flex-direction: column;
  justify-content: center;
  gap: 18px;
  padding: 34px 34px 34px 38px;
  border-radius: 32px;
  background: linear-gradient(180deg, rgba(255,255,255,0.4), rgba(255,255,255,0.12));
  border: 1px solid rgba(231, 220, 203, 0.7);
  box-shadow: inset 0 1px 0 rgba(255,255,255,0.45);
}
.darwinLanding .choice-heading .eyebrow {
  margin: 0;
}
.darwinLanding .choice-heading h2 {
  max-width: none;
  margin: 0;
  white-space: nowrap;
  font-size: clamp(38px, 3.2vw, 54px);
  line-height: 1.08;
  letter-spacing: -0.055em;
}
.darwinLanding .choice-heading::after {
  content: "";
  width: 84px;
  height: 4px;
  border-radius: 999px;
  background: linear-gradient(90deg, rgba(47,86,65,0.95), rgba(47,86,65,0.18));
}
.darwinLanding .choice-copy {
  display: grid;
  gap: 18px;
}
.darwinLanding .choice-copy p {
  margin: 0;
  padding: 24px 26px;
  border: 1px solid rgba(231, 220, 203, 0.84);
  border-radius: 26px;
  background: rgba(255, 255, 255, 0.68);
  color: #5f6f66;
  font-size: 17px;
  font-weight: 700;
  line-height: 1.95;
  box-shadow: 0 14px 36px rgba(40, 60, 49, 0.06);
}
@media (max-width: 1120px) {
  .darwinLanding .choice-section {
    grid-template-columns: minmax(300px, 0.88fr) minmax(420px, 1.12fr);
    gap: 28px;
    padding: 44px 36px;
  }
  .darwinLanding .choice-heading {
    padding: 30px 26px 30px 30px;
  }
  .darwinLanding .choice-heading h2 {
    font-size: clamp(34px, 3.8vw, 46px);
  }
}
@media (max-width: 960px) {
  .darwinLanding .choice-section {
    grid-template-columns: 1fr;
    gap: 24px;
    width: min(100% - 36px, 860px);
    margin: -18px auto 64px;
    padding: 40px 28px;
    border-radius: 34px;
  }
  .darwinLanding .choice-heading {
    padding: 28px 24px;
  }
  .darwinLanding .choice-heading h2 {
    font-size: clamp(30px, 4.8vw, 40px);
  }
}
@media (max-width: 560px) {
  .darwinLanding .choice-section {
    width: min(100% - 24px, 860px);
    margin: -14px auto 48px;
    padding: 26px 16px;
    border-radius: 28px;
  }
  .darwinLanding .choice-section::before { inset: 10px; border-radius: 22px; }
  .darwinLanding .choice-heading {
    gap: 14px;
    padding: 22px 18px;
    border-radius: 22px;
  }
  .darwinLanding .choice-heading h2 {
    white-space: normal;
    font-size: clamp(28px, 8vw, 34px);
    line-height: 1.14;
  }
  .darwinLanding .choice-copy { gap: 12px; }
  .darwinLanding .choice-copy p {
    padding: 18px 18px;
    border-radius: 20px;
    font-size: 13px;
    line-height: 1.85;
  }
}

/* v193 HIGH5-inspired measurement flow section */
.darwinLanding .flow-section {
  width: min(1180px, calc(100% - 40px));
  margin: 0 auto 86px;
  padding: 54px 0 28px;
}
.darwinLanding .flow-intro {
  max-width: 760px;
  margin: 0 0 34px;
}
.darwinLanding .flow-intro h2 {
  margin: 0;
  font-size: clamp(30px, 4.2vw, 50px);
  line-height: 1.22;
  letter-spacing: -0.055em;
}
.darwinLanding .flow-showcase {
  display: grid;
  gap: 58px;
}
.darwinLanding .flow-step {
  display: grid;
  grid-template-columns: minmax(420px, 1.08fr) minmax(360px, 0.92fr);
  align-items: center;
  gap: 76px;
  min-height: 480px;
  padding: 26px 0;
}
.darwinLanding .flow-step-report {
  grid-template-columns: minmax(360px, 0.9fr) minmax(440px, 1.1fr);
}
.darwinLanding .flow-copy {
  max-width: 520px;
}
.darwinLanding .step-label {
  margin: 0 0 18px;
  color: var(--darwin-accent);
  font-size: 17px;
  font-weight: 900;
  letter-spacing: 0.08em;
}
.darwinLanding .flow-copy h3 {
  margin: 0 0 22px;
  color: #15231d;
  font-size: clamp(34px, 4.1vw, 58px);
  line-height: 1.14;
  letter-spacing: -0.06em;
}
.darwinLanding .flow-copy p:not(.step-label) {
  margin: 0 0 28px;
  color: #34423c;
  font-size: 18px;
  font-weight: 500;
  line-height: 1.95;
}
.darwinLanding .flow-button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 240px;
  min-height: 58px;
  padding: 0 28px;
  border-radius: 14px;
  color: #fff;
  background: var(--darwin-accent);
  box-shadow: 0 14px 34px rgba(35, 68, 52, 0.24);
  font-size: 16px;
  font-weight: 900;
  text-decoration: none;
}
.darwinLanding .flow-button-muted {
  color: var(--darwin-accent-dark);
  background: #f7ead0;
  box-shadow: 0 14px 34px rgba(126, 100, 46, 0.16);
}
.darwinLanding .flow-visual {
  position: relative;
  display: grid;
  place-items: center;
  min-height: 430px;
  border-radius: 34px;
  background:
    radial-gradient(circle at 18% 18%, rgba(255,255,255,0.96), transparent 36%),
    linear-gradient(135deg, rgba(255,255,255,0.94), rgba(255,252,247,0.78));
  box-shadow: 0 30px 86px rgba(41, 51, 45, 0.1);
  overflow: hidden;
}
.darwinLanding .flow-visual::before,
.darwinLanding .flow-visual::after {
  content: "";
  position: absolute;
  border-radius: 999px;
  pointer-events: none;
}
.darwinLanding .flow-visual::before {
  width: 230px;
  height: 230px;
  left: -78px;
  top: -70px;
  background: rgba(52, 93, 70, 0.06);
}
.darwinLanding .flow-visual::after {
  width: 180px;
  height: 180px;
  right: -64px;
  bottom: -62px;
  background: rgba(201, 163, 92, 0.11);
}
.darwinLanding .test-mockup,
.darwinLanding .report-mockup {
  position: relative;
  z-index: 1;
  width: min(82%, 560px);
  min-height: 330px;
  padding: 38px;
  border-radius: 32px;
  border: 1px solid rgba(233, 224, 208, 0.92);
  background: rgba(255, 255, 255, 0.82);
  box-shadow: 0 26px 70px rgba(40, 60, 49, 0.08);
}

/* v203 step 2 report mock balance: slightly smaller without changing design language */
.darwinLanding .flow-step-report .flow-visual {
  min-height: 400px;
}
.darwinLanding .flow-step-report .report-mockup {
  width: min(78%, 520px);
  min-height: 310px;
  padding: 34px;
}
.darwinLanding .test-logo {
  margin-bottom: 52px;
  color: rgba(52, 93, 70, 0.42);
  text-align: center;
  font-size: 16px;
  font-weight: 900;
  letter-spacing: 0.14em;
  text-transform: uppercase;
}
.darwinLanding .test-mockup p {
  max-width: 430px;
  margin: 0 auto 34px;
  color: #17231e;
  text-align: center;
  font-size: 24px;
  font-weight: 900;
  line-height: 1.45;
  letter-spacing: -0.035em;
}
.darwinLanding .sound-wave {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 12px;
  height: 76px;
  margin-bottom: 28px;
}
.darwinLanding .sound-wave span {
  display: block;
  width: 10px;
  border-radius: 999px;
  background: var(--darwin-accent);
  opacity: 0.88;
}
.darwinLanding .sound-wave span:nth-child(1) { height: 28px; }
.darwinLanding .sound-wave span:nth-child(2) { height: 58px; }
.darwinLanding .sound-wave span:nth-child(3) { height: 76px; }
.darwinLanding .sound-wave span:nth-child(4) { height: 46px; }
.darwinLanding .sound-wave span:nth-child(5) { height: 30px; }
.darwinLanding .answer-row {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 10px;
  margin-bottom: 24px;
}
.darwinLanding .answer-row span {
  padding: 14px 8px;
  border-radius: 14px;
  color: #34423c;
  background: #f3efe7;
  text-align: center;
  font-size: 13px;
  font-weight: 900;
}
.darwinLanding .test-progress {
  height: 8px;
  overflow: hidden;
  border-radius: 999px;
  background: #ece4d7;
}
.darwinLanding .test-progress span {
  display: block;
  width: 42%;
  height: 100%;
  border-radius: inherit;
  background: var(--darwin-accent);
}
.darwinLanding .report-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 22px;
  margin-bottom: 28px;
}
.darwinLanding .report-head span {
  color: rgba(52, 93, 70, 0.54);
  font-size: 13px;
  font-weight: 900;
  letter-spacing: 0.1em;
  text-transform: uppercase;
}
.darwinLanding .report-head strong {
  color: #15231d;
  font-size: 21px;
  line-height: 1.2;
  letter-spacing: -0.04em;
}
.darwinLanding .report-mockup ul {
  display: grid;
  gap: 14px;
  padding: 0;
  margin: 0 0 28px;
  list-style: none;
}
.darwinLanding .report-mockup li {
  display: grid;
  grid-template-columns: 106px 1fr;
  align-items: center;
  gap: 16px;
  color: #5f6f66;
  font-size: 14px;
  font-weight: 900;
}
.darwinLanding .report-mockup li b {
  height: 10px;
  border-radius: 999px;
  background: linear-gradient(90deg, var(--darwin-accent), rgba(52, 93, 70, 0.1));
}
.darwinLanding .report-mockup li:nth-child(1) b { width: 84%; }
.darwinLanding .report-mockup li:nth-child(2) b { width: 72%; }
.darwinLanding .report-mockup li:nth-child(3) b { width: 64%; }
.darwinLanding .report-mockup li:nth-child(4) b { width: 78%; }
.darwinLanding .report-menu {
  display: grid;
  gap: 10px;
}
.darwinLanding .report-menu p {
  margin: 0;
  padding: 14px 16px;
  border-radius: 14px;
  color: #5f6f66;
  background: #f7f3ec;
  font-size: 14px;
  font-weight: 900;
}
@media (max-width: 980px) {
  .darwinLanding .flow-step,
  .darwinLanding .flow-step-report {
    grid-template-columns: 1fr;
    gap: 30px;
    min-height: 0;
    padding: 20px 0 42px;
  }
  .darwinLanding .flow-step-report .flow-copy { order: 2; }
  .darwinLanding .flow-step-report .flow-visual { order: 1; }
  .darwinLanding .flow-copy { max-width: 760px; }
  .darwinLanding .flow-visual { min-height: 360px; }
}
@media (max-width: 560px) {
  .darwinLanding .flow-section {
    width: min(100% - 24px, 1180px);
    margin-bottom: 54px;
    padding: 46px 0 8px;
  }
  .darwinLanding .flow-showcase { gap: 28px; }
  .darwinLanding .flow-copy h3 {
    font-size: clamp(29px, 9vw, 38px);
  }
  .darwinLanding .flow-copy p:not(.step-label) {
    font-size: 13px;
    line-height: 1.85;
  }
  .darwinLanding .flow-button {
    width: 100%;
  }
  .darwinLanding .flow-visual {
    min-height: 300px;
    border-radius: 26px;
  }
  .darwinLanding .test-mockup,
  .darwinLanding .report-mockup {
    width: calc(100% - 24px);
    min-height: 0;
    padding: 24px;
    border-radius: 24px;
  }
  .darwinLanding .test-logo { display: none; }
  .darwinLanding .test-mockup p { font-size: 20px; }

  .darwinLanding .flow-step-report .flow-visual { min-height: 292px; }
  .darwinLanding .flow-step-report .report-mockup {
    width: calc(100% - 32px);
    padding: 22px;
  }
  .darwinLanding .answer-row { grid-template-columns: 1fr; }
  .darwinLanding .report-mockup li { grid-template-columns: 88px 1fr; gap: 12px; }
}


/* v226: FAQ question text slightly reduced, answer text black regular, faster measured height linear accordion. */
.darwinLanding .faq-list {
  display: block;
  border-top: 1px solid rgba(77, 96, 83, 0.18);
}
.darwinLanding .faq-item {
  margin: 0;
  padding: 0;
  border: 0;
  border-bottom: 1px solid rgba(77, 96, 83, 0.18);
  background: transparent;
}
.darwinLanding .faq-question {
  appearance: none;
  width: 100%;
  display: block;
  padding: 21px 0;
  border: 0;
  background: transparent;
  cursor: pointer;
  text-align: left;
  color: #243b2f;
  font-size: clamp(18.72px, 1.697vw, 23.4px);
  line-height: 1.45;
  font-weight: 800;
  letter-spacing: -0.02em;
  font-family: inherit;
}
.darwinLanding .faq-question span {
  display: block;
  max-width: 1080px;
}
.darwinLanding .faq-question:focus-visible {
  outline: 2px solid rgba(112, 141, 113, 0.55);
  outline-offset: 6px;
  border-radius: 10px;
}
.darwinLanding .faq-answer {
  height: 0;
  overflow: hidden;
  transition: height 313ms linear;
  will-change: height;
}
.darwinLanding .faq-answer-inner {
  max-width: 920px;
  padding: 0 0 33px;
}
.darwinLanding .faq-answer-inner p {
  margin: 0 0 16px;
  color: #101713;
  line-height: 1.85;
  font-size: 16px;
  font-weight: 400;
}
.darwinLanding .faq-answer-inner p:last-child {
  margin-bottom: 0;
}
.darwinLanding .faq-answer-inner .faq-bullets {
  margin: -2px 0 0;
  color: #101713;
  font-weight: 400;
}
.darwinLanding .faq-answer-inner .faq-bullets li {
  color: #101713;
  font-weight: 400;
}
@media (max-width: 720px) {
  .darwinLanding .faq-question {
    padding: 19px 0;
    font-size: clamp(18.72px, 5.616vw, 22.23px);
    line-height: 1.45;
  }
  .darwinLanding .faq-answer-inner {
    padding-bottom: 30px;
  }
  .darwinLanding .faq-answer-inner p {
    font-size: 15.5px;
    line-height: 1.8;
    font-weight: 400;
  }
}

/* v227: Darwin monogram logo and photographic hero visual. */
.darwinLanding .brand {
  gap: 10px;
  min-width: 168px;
}
.darwinLanding .brand-mark {
  position: relative;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 39px;
  height: 39px;
  flex: 0 0 39px;
  border-radius: 13px 18px 18px 13px;
  color: var(--darwin-accent-dark);
  background: linear-gradient(145deg, rgba(255, 252, 244, 0.96), rgba(237, 243, 232, 0.86));
  border: 1px solid rgba(52, 93, 70, 0.17);
  box-shadow: 0 10px 24px rgba(35, 68, 52, 0.09), inset 0 1px 0 rgba(255,255,255,0.8);
  overflow: hidden;
}
.darwinLanding .brand-mark-letter {
  position: relative;
  z-index: 1;
  transform: translateX(-1px);
  color: #244b38;
  font-family: Georgia, "Times New Roman", serif;
  font-size: 31px;
  font-weight: 700;
  line-height: 1;
  letter-spacing: -0.08em;
}
.darwinLanding .brand-mark-leaf {
  position: absolute;
  z-index: 2;
  left: 17px;
  bottom: 9px;
  width: 12px;
  height: 36px;
  border-radius: 12px 12px 12px 0;
  background: linear-gradient(150deg, #d1aa62 0%, #86a875 45%, #315f47 100%);
  transform: rotate(32deg);
  box-shadow: 0 0 0 2px rgba(255, 252, 244, 0.85);
}
.darwinLanding .brand strong {
  color: #213b2e;
  font-family: Georgia, "Times New Roman", serif;
  font-weight: 500;
  letter-spacing: -0.045em;
}
.darwinLanding .hero-title {
  max-width: 780px;
  color: #1f3429;
  font-family: "Yu Mincho", "Hiragino Mincho ProN", "Noto Serif JP", "Times New Roman", serif;
  font-size: clamp(38px, 4.75vw, 64px);
  font-weight: 500;
  line-height: 1.36;
  letter-spacing: 0.01em;
  text-wrap: balance;
}
.darwinLanding .hero-photo {
  position: relative;
  min-height: 520px;
  margin: 0;
  border-radius: 46px;
  overflow: hidden;
  background: linear-gradient(140deg, rgba(255,255,255,0.96), rgba(238,244,233,0.78));
  box-shadow: 0 34px 96px rgba(40, 60, 49, 0.14);
  border: 1px solid rgba(255,255,255,0.86);
  isolation: isolate;
}
.darwinLanding .hero-photo::before {
  content: "";
  position: absolute;
  z-index: 1;
  inset: -16% -22% auto auto;
  width: 74%;
  height: 74%;
  border-radius: 999px;
  border: 1px solid rgba(52, 93, 70, 0.11);
  background: radial-gradient(circle, rgba(52, 93, 70, 0.07) 0%, rgba(52, 93, 70, 0.02) 58%, transparent 70%);
  pointer-events: none;
}
.darwinLanding .hero-photo::after {
  content: "";
  position: absolute;
  z-index: 2;
  inset: 0;
  background: linear-gradient(90deg, rgba(255, 250, 242, 0.36), transparent 34%, rgba(255,255,255,0.04));
  pointer-events: none;
}
.darwinLanding .hero-photo img {
  position: relative;
  z-index: 0;
  display: block;
  width: 100%;
  height: 100%;
  min-height: 520px;
  object-fit: cover;
  object-position: 52% 50%;
}
@media (max-width: 900px) {
  .darwinLanding .brand { min-width: 150px; }
  .darwinLanding .brand-mark { width: 36px; height: 36px; flex-basis: 36px; border-radius: 12px 16px 16px 12px; }
  .darwinLanding .brand-mark-letter { font-size: 21px; }
  .darwinLanding .hero-title {
    font-size: clamp(34px, 7.6vw, 54px);
    line-height: 1.32;
  }
  .darwinLanding .hero-photo,
  .darwinLanding .hero-photo img {
    min-height: 430px;
  }
}
@media (max-width: 560px) {
  .darwinLanding .brand-mark { width: 33px; height: 33px; flex-basis: 33px; }
  .darwinLanding .brand-mark-letter { font-size: 26px; }
  .darwinLanding .hero-title {
    font-size: clamp(31px, 9.2vw, 42px);
    line-height: 1.34;
    letter-spacing: 0;
  }
  .darwinLanding .hero-photo,
  .darwinLanding .hero-photo img {
    min-height: 360px;
  }
}

/* v228: blend hero image into page background and refine Darwin logo to match selected concept. */
.darwinLanding .brand {
  gap: 12px;
  min-width: 186px;
}
.darwinLanding .brand-mark {
  position: relative;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 52px;
  height: 48px;
  flex: 0 0 52px;
  border: 0;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
  overflow: visible;
  color: #234736;
}
.darwinLanding .brand-mark-letter {
  position: absolute;
  z-index: 1;
  left: 1px;
  top: -4px;
  transform: none;
  color: #214936;
  font-family: Georgia, "Times New Roman", serif;
  font-size: 54px;
  font-weight: 500;
  line-height: 1;
  letter-spacing: -0.12em;
}
.darwinLanding .brand-mark::before {
  content: "";
  position: absolute;
  z-index: 3;
  left: 19px;
  bottom: 9px;
  width: 8px;
  height: 36px;
  border-radius: 999px;
  background: linear-gradient(180deg, #b99958 0%, #2e6248 100%);
  transform: rotate(1deg);
  opacity: 0.95;
}
.darwinLanding .brand-mark::after {
  content: "";
  position: absolute;
  z-index: 4;
  left: 27px;
  bottom: 20px;
  width: 13px;
  height: 18px;
  border-radius: 16px 16px 16px 2px;
  background: linear-gradient(145deg, #d8b66f 0%, #7f9f71 52%, #315f47 100%);
  transform: rotate(37deg);
  box-shadow: 0 0 0 2px rgba(255, 250, 242, 0.72);
}
.darwinLanding .brand-mark-leaf {
  position: absolute;
  z-index: 4;
  left: 12px;
  bottom: 19px;
  width: 13px;
  height: 18px;
  border-radius: 16px 16px 2px 16px;
  background: linear-gradient(215deg, #d7b46d 0%, #86a875 45%, #315f47 100%);
  transform: rotate(-38deg);
  box-shadow: 0 0 0 2px rgba(255, 250, 242, 0.72);
}
.darwinLanding .brand strong {
  color: #203d2f;
  font-family: Georgia, "Times New Roman", serif;
  font-size: 44px;
  font-weight: 500;
  line-height: 0.94;
  letter-spacing: -0.055em;
}
.darwinLanding .hero-section {
  grid-template-columns: minmax(0, 1.02fr) minmax(360px, 0.98fr);
  gap: clamp(34px, 5vw, 72px);
  align-items: center;
}
.darwinLanding .hero-photo {
  position: relative;
  min-height: 610px;
  margin: 0;
  border: 0;
  border-radius: 0;
  overflow: visible;
  background: transparent;
  box-shadow: none;
  isolation: auto;
}
.darwinLanding .hero-photo::before,
.darwinLanding .hero-photo::after {
  content: none;
}
.darwinLanding .hero-photo img {
  position: relative;
  z-index: 0;
  display: block;
  width: 100%;
  height: 100%;
  min-height: 610px;
  object-fit: cover;
  object-position: 50% 50%;
  border: 0;
  border-radius: 0;
  box-shadow: none;
  background: transparent;
  -webkit-mask-image: linear-gradient(90deg, transparent 0%, #000 8%, #000 88%, transparent 100%);
  mask-image: linear-gradient(90deg, transparent 0%, #000 8%, #000 88%, transparent 100%);
}
@media (max-width: 900px) {
  .darwinLanding .brand { min-width: 166px; }
  .darwinLanding .brand-mark { width: 45px; height: 42px; flex-basis: 45px; }
  .darwinLanding .brand-mark-letter { font-size: 47px; top: -4px; }
  .darwinLanding .brand strong { font-size: 38px; }
  .darwinLanding .brand-mark::before { left: 17px; bottom: 8px; height: 19px; width: 7px; }
  .darwinLanding .brand-mark::after { left: 24px; bottom: 18px; width: 11px; height: 15px; }
  .darwinLanding .brand-mark-leaf { left: 11px; bottom: 17px; width: 11px; height: 15px; }
  .darwinLanding .hero-photo,
  .darwinLanding .hero-photo img {
    min-height: 460px;
  }
}
@media (max-width: 560px) {
  .darwinLanding .brand { min-width: 144px; }
  .darwinLanding .brand-mark { width: 38px; height: 36px; flex-basis: 38px; }
  .darwinLanding .brand-mark-letter { font-size: 40px; top: -3px; }
  .darwinLanding .brand strong { font-size: 32px; }
  .darwinLanding .brand-mark::before { left: 14px; bottom: 7px; height: 16px; width: 6px; }
  .darwinLanding .brand-mark::after { left: 20px; bottom: 15px; width: 10px; height: 13px; }
  .darwinLanding .brand-mark-leaf { left: 9px; bottom: 14px; width: 10px; height: 13px; }
  .darwinLanding .hero-photo,
  .darwinLanding .hero-photo img {
    min-height: 360px;
  }
}

/* v229: refine Darwin mark to match the selected D monogram reference. */
.darwinLanding .brand {
  gap: 11px;
  min-width: 188px;
}
.darwinLanding .brand-mark {
  width: 52px;
  height: 52px;
  flex: 0 0 52px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: transparent;
  border: 0;
  border-radius: 0;
  box-shadow: none;
  overflow: visible;
}
.darwinLanding .brand-mark-svg {
  width: 52px;
  height: 52px;
  display: block;
  overflow: visible;
}
.darwinLanding .brand-mark-d {
  fill: none;
  stroke: #173f31;
  stroke-width: 3.8;
  stroke-linecap: round;
  stroke-linejoin: round;
}
.darwinLanding .brand-mark-stem {
  fill: none;
  stroke: #b99a54;
  stroke-width: 3.5;
  stroke-linecap: round;
  stroke-linejoin: round;
}
.darwinLanding .brand-mark-leaf-left {
  fill: #2d6047;
  stroke: rgba(255, 250, 240, 0.86);
  stroke-width: 1.1;
  stroke-linejoin: round;
}
.darwinLanding .brand-mark-leaf-right {
  fill: #b99a54;
  stroke: rgba(255, 250, 240, 0.86);
  stroke-width: 1.1;
  stroke-linejoin: round;
}
.darwinLanding .brand-mark-root {
  fill: none;
  stroke: #b99a54;
  stroke-width: 2.4;
  stroke-linecap: round;
  opacity: 0.85;
}
.darwinLanding .brand strong {
  color: #173f31;
  font-family: Georgia, "Times New Roman", serif;
  font-size: 44px;
  font-weight: 500;
  line-height: 0.92;
  letter-spacing: -0.058em;
}
@media (max-width: 900px) {
  .darwinLanding .brand { min-width: 170px; }
  .darwinLanding .brand-mark,
  .darwinLanding .brand-mark-svg { width: 47px; height: 47px; flex-basis: 47px; }
  .darwinLanding .brand strong { font-size: 39px; }
}
@media (max-width: 640px) {
  .darwinLanding .brand { min-width: 145px; }
  .darwinLanding .brand-mark,
  .darwinLanding .brand-mark-svg { width: 40px; height: 40px; flex-basis: 40px; }
  .darwinLanding .brand strong { font-size: 33px; }
}

/* v231: match the provided Darwin reference by keeping the wordmark and refining only the D monogram. */
.darwinLanding .brand {
  gap: 9px;
}
.darwinLanding .brand-mark {
  width: 50px;
  height: 50px;
  flex-basis: 50px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}
.darwinLanding .brand-mark-svg {
  width: 50px;
  height: 50px;
  overflow: visible;
}
.darwinLanding .brand-mark-d,
.darwinLanding .brand-mark-d-stem,
.darwinLanding .brand-mark-root {
  fill: none;
  stroke: #173f31;
  stroke-linecap: round;
  stroke-linejoin: round;
}
.darwinLanding .brand-mark-d {
  stroke-width: 3.45;
}
.darwinLanding .brand-mark-d-stem {
  stroke-width: 3.15;
}
.darwinLanding .brand-mark-root {
  stroke-width: 2.35;
}
.darwinLanding .brand-mark-plant-stem,
.darwinLanding .brand-mark-plant-branch {
  fill: none;
  stroke: #b79a57;
  stroke-width: 2.45;
  stroke-linecap: round;
  stroke-linejoin: round;
}
.darwinLanding .brand-mark-leaf-left {
  fill: #2d644b;
  stroke: rgba(255, 253, 246, 0.95);
  stroke-width: 0.65;
  stroke-linejoin: round;
}
.darwinLanding .brand-mark-leaf-right {
  fill: #b79a57;
  stroke: rgba(255, 253, 246, 0.95);
  stroke-width: 0.65;
  stroke-linejoin: round;
}
.darwinLanding .brand strong {
  font-size: 43px;
  letter-spacing: -0.052em;
}
@media (max-width: 900px) {
  .darwinLanding .brand-mark,
  .darwinLanding .brand-mark-svg { width: 46px; height: 46px; flex-basis: 46px; }
  .darwinLanding .brand strong { font-size: 39px; }
}
@media (max-width: 640px) {
  .darwinLanding .brand-mark,
  .darwinLanding .brand-mark-svg { width: 39px; height: 39px; flex-basis: 39px; }
  .darwinLanding .brand strong { font-size: 33px; }
}


/* v233: replace the D monogram SVG with the exact cropped D mark from the approved reference image. */
.darwinLanding .brand {
  gap: 9px;
}
.darwinLanding .brand-mark {
  width: 49px;
  height: 52px;
  flex-basis: 49px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}
.darwinLanding .brand-mark-image {
  display: block;
  width: 49px;
  height: 52px;
  object-fit: contain;
}
@media (max-width: 900px) {
  .darwinLanding .brand-mark,
  .darwinLanding .brand-mark-image {
    width: 45px;
    height: 48px;
    flex-basis: 45px;
  }
}
@media (max-width: 640px) {
  .darwinLanding .brand-mark,
  .darwinLanding .brand-mark-image {
    width: 38px;
    height: 41px;
    flex-basis: 38px;
  }
}


/* v235: refine the pretest intro page to match the LP quality with richer hierarchy, premium cards, and clearer parent-facing guidance. */
.pretestLandingV178 {
  max-width: 1280px;
  padding: 0 8px 12px;
}

.pretestHeroV178,
.pretestSectionV178,
.pretestInfoPanelV178,
.pretestMethodV178,
.pretestParentGuideV178,
.pretestBottomCtaV178 {
  border: 1px solid rgba(198, 214, 187, 0.92);
  background: linear-gradient(180deg, rgba(255, 254, 248, 0.96), rgba(250, 251, 245, 0.96));
  border-radius: 36px;
  box-shadow: 0 28px 90px rgba(42, 72, 48, 0.10);
  backdrop-filter: blur(8px);
}

.pretestHeroV178 {
  grid-template-columns: minmax(0, 1.12fr) 360px;
  gap: 42px;
  padding: clamp(34px, 5vw, 64px);
}

.pretestHeroV178::before {
  right: -90px;
  top: -100px;
  width: 340px;
  height: 340px;
  background: radial-gradient(circle, rgba(107, 164, 93, 0.20), rgba(107, 164, 93, 0.10) 32%, transparent 70%);
}

.pretestHeroV178::after {
  content: "";
  position: absolute;
  left: -120px;
  bottom: -150px;
  width: 360px;
  height: 360px;
  border-radius: 50%;
  background: radial-gradient(circle, rgba(231, 212, 164, 0.16), transparent 72%);
  pointer-events: none;
}

.pretestKickerV178,
.pretestSectionHeadV178 p {
  letter-spacing: 0.12em;
  font-size: 13px;
}

.pretestHeroCopyV178 {
  position: relative;
  z-index: 1;
}

.pretestHeroCopyV178 h2 {
  margin: 0 0 22px;
  font-size: clamp(54px, 7vw, 92px);
  line-height: 1.02;
  letter-spacing: 0.01em;
}

.pretestLeadV235 {
  font-size: 19px !important;
  line-height: 1.95 !important;
  color: #475b49 !important;
  max-width: 760px;
  margin-bottom: 14px !important;
}

.pretestBodyV235 {
  max-width: 760px;
}

.pretestQuickFactsV235 {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin-top: 22px;
}

.pretestQuickFactsV235 span,
.pretestBottomMetaV235 span {
  display: inline-flex;
  align-items: center;
  min-height: 38px;
  padding: 9px 14px;
  border-radius: 999px;
  border: 1px solid rgba(196, 217, 184, 0.95);
  background: rgba(245, 250, 239, 0.92);
  color: #45624c;
  font-size: 13px;
  font-weight: 800;
  line-height: 1.2;
}

.pretestHeroActionsV178 {
  margin-top: 24px;
  gap: 18px 20px;
}

.pretestHeroActionsV178 span {
  font-size: 14px;
  color: #5f6f5f;
}

.pretestPrimaryBtnV178 {
  padding: 17px 28px;
  border-radius: 999px;
  font-size: 13px;
  font-weight: 900;
  letter-spacing: 0.01em;
}

.pretestSummaryCardV178 {
  min-height: 100%;
  border-radius: 34px;
  padding: 32px;
  background: linear-gradient(155deg, #2f613a 0%, #295338 52%, #20392d 100%);
  box-shadow: 0 28px 60px rgba(36, 64, 44, 0.28);
  gap: 18px;
}

.pretestSummaryCardV178::after {
  content: "";
  position: absolute;
  inset: 0;
  border-radius: inherit;
  background: linear-gradient(180deg, rgba(255,255,255,0.08), rgba(255,255,255,0));
  pointer-events: none;
}

.pretestSummaryCardV178 strong {
  font-size: clamp(30px, 3vw, 42px);
  line-height: 1.28;
  margin: 0;
}

.pretestSummaryCardV178 p {
  position: relative;
  z-index: 1;
  font-size: 13px;
  line-height: 1.95;
}

.pretestSummaryMiniListV235 {
  position: relative;
  z-index: 1;
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
  margin-top: 2px;
}

.pretestSummaryMiniListV235 div {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 11px 12px;
  border-radius: 16px;
  background: rgba(255, 255, 255, 0.10);
  border: 1px solid rgba(255, 255, 255, 0.12);
}

.pretestSummaryMiniListV235 b {
  display: inline-grid;
  place-items: center;
  width: 28px;
  height: 28px;
  border-radius: 10px;
  background: rgba(255,255,255,0.18);
  color: #f7f6ef;
  font-size: 11px;
  letter-spacing: 0.08em;
}

.pretestSummaryMiniListV235 span {
  font-size: 13px;
  color: rgba(255,255,255,0.92);
  font-weight: 800;
  letter-spacing: 0;
  opacity: 1;
}

.pretestSectionV178,
.pretestInfoPanelV178,
.pretestMethodV178,
.pretestParentGuideV178,
.pretestBottomCtaV178 {
  margin-top: 26px;
}

.pretestSectionV178 {
  padding: 34px;
}

.pretestSectionHeadWideV235 {
  display: flex;
  justify-content: space-between;
  align-items: flex-end;
  gap: 20px;
}

.pretestSectionHeadWideV235 > span {
  color: #6f7f70;
  font-size: 14px;
  font-weight: 700;
  line-height: 1.6;
  max-width: 360px;
}

.pretestSectionHeadV178 h3 {
  font-size: clamp(30px, 4vw, 50px);
  line-height: 1.16;
}

.pretestCoreGridV178 {
  gap: 18px;
  margin-top: 26px;
}

.pretestCoreCardV178 {
  position: relative;
  padding: 24px;
  border-radius: 26px;
  background: linear-gradient(180deg, #ffffff, #f7fbf4);
  box-shadow: 0 14px 28px rgba(50, 84, 55, 0.06);
  transition: transform 0.18s ease, box-shadow 0.18s ease, border-color 0.18s ease;
}

.pretestCoreCardV178:hover {
  transform: translateY(-3px);
  box-shadow: 0 20px 36px rgba(50, 84, 55, 0.10);
  border-color: rgba(157, 198, 146, 0.95);
}

.pretestCoreCardV178 span {
  width: 42px;
  height: 42px;
  border-radius: 15px;
  margin-bottom: 14px;
}

.pretestCoreCardV178 small {
  display: block;
  color: #6d7f6f;
  font-size: 12px;
  font-weight: 800;
  letter-spacing: 0.03em;
  line-height: 1.5;
  margin-bottom: 10px;
}

.pretestCoreCardV178 h4 {
  font-size: 20px;
  margin-bottom: 12px;
}

.pretestCoreCardV178 p {
  font-size: 13px;
  line-height: 1.82;
}

.pretestTwoColumnV178 {
  gap: 22px;
}

.pretestInfoPanelV178 {
  padding: 32px;
}

.pretestInfoPanelV178 li {
  padding: 16px 18px 16px 46px;
  border-radius: 18px;
  line-height: 1.7;
}

.pretestInfoPanelV178 li::before {
  left: 18px;
  top: 15px;
}

.pretestMethodV178 {
  padding: 36px;
  grid-template-columns: minmax(0, 1fr) 400px;
  gap: 34px;
}

.pretestMethodV178 p {
  font-size: 16px;
}

.pretestStepsV178 {
  gap: 14px;
}

.pretestStepsV178 div {
  position: relative;
  padding: 16px;
  border-radius: 20px;
  background: linear-gradient(180deg, #f7fbf4, #eef6e8);
  box-shadow: inset 0 1px 0 rgba(255,255,255,0.8);
}

.pretestStepsV178 strong {
  width: 46px;
  height: 46px;
  border-radius: 16px;
}

.pretestStepsV178 span {
  font-size: 13px;
}

.pretestParentGuideV178 {
  padding: 32px;
}

.pretestParentGuideV178 h3 {
  margin: 0;
  font-size: clamp(28px, 3vw, 40px);
}

.pretestParentGuideGridV235 {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 16px;
  margin-top: 22px;
}

.pretestParentGuideItemV235 {
  padding: 22px;
  border-radius: 24px;
  background: linear-gradient(180deg, rgba(251, 254, 248, 0.96), rgba(242, 248, 236, 0.96));
  border: 1px solid rgba(201, 219, 190, 0.92);
  box-shadow: 0 10px 22px rgba(46, 73, 49, 0.05);
}

.pretestParentGuideItemV235 strong {
  display: block;
  color: #203529;
  font-size: 18px;
  margin-bottom: 10px;
}

.pretestParentGuideItemV235 p {
  margin: 0;
  color: #617062;
  line-height: 1.8;
}

.pretestBottomCtaV178 {
  padding: 28px 32px;
  align-items: center;
}

.pretestBottomCtaV178 strong {
  display: block;
  margin-bottom: 14px;
  font-size: clamp(20px, 2.5vw, 28px);
  line-height: 1.45;
}

.pretestBottomMetaV235 {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
}

@media (max-width: 1100px) {
  .pretestHeroV178,
  .pretestMethodV178 {
    grid-template-columns: 1fr;
  }

  .pretestHeroCopyV178 h2 {
    font-size: clamp(50px, 9vw, 84px);
  }

  .pretestSummaryCardV178 {
    min-height: auto;
  }

  .pretestParentGuideGridV235 {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 980px) {
  .pretestTwoColumnV178,
  .pretestCoreGridV178 {
    grid-template-columns: 1fr 1fr;
  }

  .pretestSectionHeadWideV235 {
    display: grid;
    align-items: start;
  }

  .pretestSectionHeadWideV235 > span {
    max-width: none;
  }
}

@media (max-width: 760px) {
  .pretestLandingV178 {
    padding: 0 2px 10px;
  }

  .pretestHeroCopyV178 h2 {
    font-size: clamp(44px, 14vw, 66px);
  }

  .pretestCoreGridV178,
  .pretestTwoColumnV178,
  .pretestSummaryMiniListV235 {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 640px) {
  .pretestHeroV178,
  .pretestSectionV178,
  .pretestInfoPanelV178,
  .pretestMethodV178,
  .pretestParentGuideV178,
  .pretestBottomCtaV178 {
    border-radius: 26px;
    padding: 22px;
  }

  .pretestHeroActionsV178 {
    align-items: stretch;
  }

  .pretestHeroActionsV178 > * {
    width: 100%;
  }

  .pretestCoreGridV178,
  .pretestTwoColumnV178 {
    grid-template-columns: 1fr;
  }

  .pretestQuickFactsV235 span,
  .pretestBottomMetaV235 span {
    width: 100%;
    justify-content: center;
  }
}



/* v245: keep the preparation/calibration screens on one continuous forest background. */
html, body {
  min-height: 100%;
}

body {
  min-height: 100vh;
  background:
    radial-gradient(circle at 10% 0%, rgba(129, 199, 132, .25), transparent 34%),
    radial-gradient(circle at 90% 20%, rgba(226, 168, 75, .18), transparent 28%),
    linear-gradient(180deg, #f7fbf1 0%, #eef6e8 100%);
  background-repeat: no-repeat;
  background-attachment: fixed;
}

.app.forest {
  min-height: 100vh;
}

/* v236-v238: dedicated sound-preparation page after consent, simplified to a compact Proms-style text layout. */
.soundPrepPageV236 {
  max-width: 1180px;
  margin: 0 auto;
  padding: 14px 8px 12px;
  color: #1f3528;
}

.soundPrepCardV236 {
  position: relative;
  overflow: hidden;
  border: 1px solid rgba(199, 218, 189, 0.92);
  border-radius: 32px;
  background: linear-gradient(180deg, rgba(255, 254, 248, 0.96), rgba(250, 251, 245, 0.97));
  box-shadow: 0 22px 60px rgba(42, 72, 48, 0.10);
  padding: clamp(26px, 4vw, 46px) clamp(28px, 5vw, 58px);
}

.soundPrepCardV236::before {
  content: "";
  position: absolute;
  right: -90px;
  top: -110px;
  width: 260px;
  height: 260px;
  border-radius: 999px;
  background: radial-gradient(circle, rgba(104, 166, 94, 0.12), transparent 70%);
  pointer-events: none;
}

.soundPrepCardV236::after {
  content: "";
  position: absolute;
  left: -120px;
  bottom: -130px;
  width: 280px;
  height: 280px;
  border-radius: 999px;
  background: radial-gradient(circle, rgba(227, 209, 163, 0.10), transparent 72%);
  pointer-events: none;
}

.soundPrepKickerV236 {
  display: none;
}

.soundPrepCardV236 h2 {
  position: relative;
  z-index: 1;
  margin: 0 0 20px;
  color: #1e3227;
  font-size: clamp(30px, 3.4vw, 48px);
  line-height: 1.18;
  letter-spacing: 0.01em;
}

.soundPrepLeadV236 {
  position: relative;
  z-index: 1;
  max-width: 980px;
  margin: 0 0 20px;
  color: #526453;
  font-size: clamp(14px, 1.2vw, 17px);
  line-height: 1.82;
  font-weight: 700;
}

.soundPrepListV236 {
  position: relative;
  z-index: 1;
  margin: 0;
  padding-left: 1.45em;
  display: grid;
  gap: 13px;
  color: #263c2e;
}

.soundPrepItemV236 {
  border: 0;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
  padding: 0 0 0 4px;
}

.soundPrepItemV236::marker {
  color: #3f784c;
  font-weight: 900;
}

.soundPrepItemV236 strong {
  display: inline;
  color: #203529;
  font-size: inherit;
  line-height: inherit;
}

.soundPrepItemV236 strong span {
  display: none;
}

.soundPrepItemV236 p {
  margin: 0;
  color: #405442;
  font-size: clamp(13px, 1.1vw, 16px);
  line-height: 1.72;
  font-weight: 700;
}

.soundPrepActionsV236 {
  position: relative;
  z-index: 1;
  display: flex;
  justify-content: flex-end;
  align-items: center;
  gap: 12px;
  margin-top: 24px;
}

.soundPrepActionsV236 .btn {
  min-height: 46px;
  padding: 0 20px;
}

.soundPrepPrimaryV236 {
  background: linear-gradient(135deg, #3f8f59, #6ba967) !important;
  color: #fff !important;
  box-shadow: 0 14px 26px rgba(66, 143, 85, 0.22);
}

@media (max-width: 760px) {
  .soundPrepPageV236 {
    padding: 8px 2px 10px;
  }

  .soundPrepCardV236 {
    border-radius: 24px;
    padding: 22px;
  }

  .soundPrepCardV236 h2 {
    font-size: clamp(28px, 9vw, 40px);
    margin-bottom: 14px;
  }

  .soundPrepLeadV236 {
    font-size: 13px;
    line-height: 1.68;
  }

  .soundPrepListV236 {
    gap: 11px;
    padding-left: 1.35em;
  }

  .soundPrepItemV236 p {
    font-size: 12px;
    line-height: 1.62;
  }

  .soundPrepActionsV236 {
    display: grid;
    justify-content: stretch;
    margin-top: 18px;
  }

  .soundPrepActionsV236 .btn {
    width: 100%;
  }
}

/* v240: sound calibration page inserted between environment confirmation and test instructions. */
.soundCalibrationPageV240 {
  max-width: 1180px;
  margin: 0 auto;
  padding: 12px 8px 12px;
  color: #1f3528;
}

.soundCalibrationCardV240 {
  position: relative;
  overflow: hidden;
  border: 1px solid rgba(199, 218, 189, 0.92);
  border-radius: 32px;
  background: linear-gradient(180deg, rgba(255, 254, 248, 0.97), rgba(250, 251, 245, 0.98));
  box-shadow: 0 22px 60px rgba(42, 72, 48, 0.10);
  padding: clamp(28px, 4vw, 48px);
}

.soundCalibrationCardV240::before {
  content: "";
  position: absolute;
  right: -90px;
  top: -90px;
  width: 250px;
  height: 250px;
  border-radius: 999px;
  background: radial-gradient(circle, rgba(104, 166, 94, 0.13), transparent 70%);
  pointer-events: none;
}

.soundCalibrationCardV240 h2 {
  position: relative;
  z-index: 1;
  margin: 0 0 20px;
  color: #1e3227;
  font-size: clamp(30px, 3.4vw, 48px);
  line-height: 1.18;
  letter-spacing: 0.01em;
}

.soundCalibrationLeadV240 {
  position: relative;
  z-index: 1;
  max-width: 980px;
  margin: 0 0 16px;
  color: #314838;
  font-size: clamp(15px, 1.2vw, 18px);
  line-height: 1.85;
  font-weight: 800;
}

.soundCalibrationTextV240 {
  position: relative;
  z-index: 1;
  max-width: 1040px;
  margin: 0 0 14px;
  color: #526453;
  font-size: clamp(14px, 1.1vw, 16px);
  line-height: 1.85;
  font-weight: 700;
}

.soundCalibrationStatusV240 {
  position: relative;
  z-index: 1;
  display: inline-flex;
  align-items: center;
  gap: 10px;
  margin-top: 18px;
  padding: 10px 14px;
  border-radius: 999px;
  background: rgba(237, 246, 231, 0.9);
  color: #3f784c;
  font-size: 13px;
  font-weight: 900;
}

.soundCalibrationStatusV240 span {
  width: 10px;
  height: 10px;
  border-radius: 999px;
  background: #9db4a0;
}

.soundCalibrationStatusV240 span.isPlaying {
  background: #4f9c65;
  box-shadow: 0 0 0 6px rgba(79, 156, 101, 0.15);
}

.soundCalibrationActionsV240 {
  margin-top: 30px;
}

@media (max-width: 760px) {
  .soundCalibrationPageV240 {
    padding: 8px 2px 10px;
  }

  .soundCalibrationCardV240 {
    border-radius: 24px;
    padding: 22px;
  }

  .soundCalibrationCardV240 h2 {
    font-size: clamp(28px, 9vw, 40px);
    margin-bottom: 14px;
  }

  .soundCalibrationLeadV240,
  .soundCalibrationTextV240 {
    font-size: 13px;
    line-height: 1.7;
  }
}


/* v246: fix the background split on the parent consent page only. */
.consentCardV246 {
  position: relative;
  z-index: 0;
}

.consentCardV246::before {
  content: "";
  position: fixed;
  inset: 0;
  z-index: -2;
  pointer-events: none;
  background:
    radial-gradient(circle at 10% 0%, rgba(129, 199, 132, .25), transparent 34%),
    radial-gradient(circle at 90% 20%, rgba(226, 168, 75, .18), transparent 28%),
    linear-gradient(180deg, #f7fbf1 0%, #eef6e8 100%);
  background-repeat: no-repeat;
  background-attachment: fixed;
}


/* v247-v248: parent consent copy inside a single full-card white bordered box. */
.consentCardV246 {
  overflow: hidden;
  background: rgba(255, 253, 247, 0.98);
  border: 1px solid rgba(199, 218, 189, 0.92);
  border-radius: 34px;
  box-shadow: 0 28px 74px rgba(42, 72, 48, 0.10);
  padding: clamp(30px, 4.4vw, 56px);
}

.consentTextBoxV247 {
  margin-top: 22px;
  max-width: 1120px;
}

.consentTextBoxV247 .sub {
  margin: 0;
  color: #4f604f;
  font-weight: 700;
  line-height: 1.9;
}

.consentTextBoxV247 .sub + .sub {
  margin-top: 14px;
}

.consentCheckRowV247 {
  margin-top: 26px;
}

.consentActionsV247 {
  justify-content: flex-end;
  margin-top: 30px;
}

@media (max-width: 760px) {
  .consentCardV246 {
    border-radius: 26px;
    padding: 24px;
  }
}


/* v249: parent consent page full-card frame. This targets only the consent screen. */
.consentCardV249 {
  position: relative;
  z-index: 0;
  display: block;
  width: min(1200px, calc(100vw - 48px));
  margin: clamp(18px, 3.4vw, 42px) auto;
  overflow: hidden;
  background: rgba(255, 253, 247, 0.98);
  border: 1px solid rgba(199, 218, 189, 0.95);
  border-radius: 34px;
  box-shadow: 0 28px 74px rgba(42, 72, 48, 0.10);
  padding: clamp(30px, 4.4vw, 56px);
}

.consentCardV249::before {
  content: "";
  position: fixed;
  inset: 0;
  z-index: -2;
  pointer-events: none;
  background:
    radial-gradient(circle at 10% 0%, rgba(129, 199, 132, .25), transparent 34%),
    radial-gradient(circle at 90% 20%, rgba(226, 168, 75, .18), transparent 28%),
    linear-gradient(180deg, #f7fbf1 0%, #eef6e8 100%);
  background-repeat: no-repeat;
  background-attachment: fixed;
}

.consentCardV249 .eyebrow {
  margin: 0 0 22px;
}

.consentCopyV249 {
  max-width: 1120px;
}

.consentCopyV249 .sub {
  margin: 0;
  color: #4f604f;
  font-weight: 700;
  line-height: 1.9;
}

.consentCopyV249 .sub + .sub {
  margin-top: 14px;
}

.consentCheckRowV249 {
  margin-top: 26px;
}

.consentActionsV249 {
  justify-content: flex-end;
  margin-top: 30px;
}

@media (max-width: 760px) {
  .consentCardV249 {
    width: min(100%, calc(100vw - 28px));
    border-radius: 26px;
    padding: 24px;
  }

  .consentActionsV249 {
    justify-content: stretch;
  }

  .consentActionsV249 .btn {
    flex: 1 1 auto;
  }
}


/* v250: real parent consent page panel. The whole consent content lives inside one white bordered box. */
.consentPageV250 {
  width: min(100%, 1280px);
  margin: 0 auto;
  padding: clamp(18px, 3.5vw, 44px) 8px 24px;
}

.consentPanelV250 {
  width: min(100%, 1180px);
  margin: 0 auto;
  padding: clamp(30px, 4.2vw, 56px);
  background: rgba(255, 253, 247, 0.98);
  border: 1px solid rgba(199, 218, 189, 0.96);
  border-radius: 34px;
  box-shadow: 0 28px 74px rgba(42, 72, 48, 0.10);
  color: #20301f;
}

.consentEyebrowV250 {
  margin: 0 0 28px;
  color: #4f9c65;
  font-size: clamp(17px, 1.5vw, 22px);
  line-height: 1.4;
}

.consentCopyV250 {
  max-width: 1060px;
}

.consentCopyV250 p {
  margin: 0;
  color: #4f604f;
  font-size: clamp(15px, 1.18vw, 18px);
  font-weight: 700;
  line-height: 1.9;
}

.consentCopyV250 p + p {
  margin-top: 16px;
}

.consentCheckRowV250 {
  margin-top: 24px;
}

.consentActionsV250 {
  justify-content: flex-end;
  margin-top: 30px;
}

@media (max-width: 760px) {
  .consentPageV250 {
    padding: 10px 2px 18px;
  }

  .consentPanelV250 {
    border-radius: 26px;
    padding: 24px;
  }

  .consentActionsV250 {
    display: grid;
    justify-content: stretch;
  }

  .consentActionsV250 .btn {
    width: 100%;
  }
}


/* v252: parent consent page only. Keep the same wide card, move it higher, shorten its vertical height, and tune typography to the requested reference values. */
.consentPageV251 {
  width: 100%;
  margin: 0 auto;
  padding: 10px 8px 22px;
  color: #1f3528;
}

.consentPanelV251 {
  width: min(100%, 1180px);
  margin: 0 auto;
  padding: 30px 46px 28px;
  background: rgba(255, 253, 247, 0.98);
  border: 1px solid rgba(199, 218, 189, 0.96);
  border-radius: 34px;
  box-shadow: 0 24px 64px rgba(42, 72, 48, 0.10);
}

.consentEyebrowV251 {
  margin: 0 0 22px;
  color: #4f9c65;
  font-size: 21px;
  font-weight: 900;
  line-height: 1.4;
  letter-spacing: 0.01em;
}

.consentCopyV251 {
  max-width: 1050px;
}

.consentCopyV251 p {
  margin: 0;
  color: #60715d;
  font-size: 19px;
  font-weight: 700;
  line-height: 1.7;
}

.consentCopyV251 p + p {
  margin-top: 12px;
}

.consentCheckRowV251 {
  margin-top: 20px;
  color: #20301f;
  font-size: 19px;
  font-weight: 700;
  line-height: 1.45;
}

.consentActionsV251 {
  display: flex;
  justify-content: flex-end;
  align-items: center;
  gap: 12px;
  margin-top: 20px;
}

.consentActionsV251 .btn {
  min-height: 50px;
  padding: 0 24px;
}

@media (max-width: 760px) {
  .consentPageV251 {
    padding: 8px 2px 18px;
  }

  .consentPanelV251 {
    border-radius: 26px;
    padding: 22px;
  }

  .consentEyebrowV251 {
    margin-bottom: 16px;
    font-size: 18px;
  }

  .consentCopyV251 p {
    font-size: 14px;
    line-height: 1.72;
  }

  .consentCheckRowV251 {
    margin-top: 18px;
    font-size: 14px;
  }

  .consentActionsV251 {
    display: grid;
    justify-content: stretch;
    margin-top: 22px;
  }

  .consentActionsV251 .btn {
    width: 100%;
  }
}


/* v253: parent consent page only. Dedicated structure to match the reference card typography and placement without relying on shared card/check/actions styles. */
.consentPageV253 {
  width: 100%;
  margin: 0 auto;
  padding: 12px 8px 18px;
  color: #1f3528;
}

.consentPanelV253 {
  width: min(100%, 1180px);
  margin: 0 auto;
  padding: 34px 48px 28px;
  background: rgba(255, 253, 247, 0.98);
  border: 1px solid rgba(199, 218, 189, 0.96);
  border-radius: 34px;
  box-shadow: 0 24px 64px rgba(42, 72, 48, 0.10);
}

.consentEyebrowV253 {
  margin: 0 0 20px;
  color: #4f9c65;
  font-size: 16px;
  font-weight: 900;
  line-height: 1.35;
  letter-spacing: 0.01em;
}

.consentCopyV253 {
  max-width: 1080px;
}

.consentCopyV253 p {
  margin: 0;
  color: #60715d;
  font-size: 16px;
  font-weight: 700;
  line-height: 1.7;
}

.consentCopyV253 p + p {
  margin-top: 0;
}

.consentCheckRowV253 {
  display: flex;
  align-items: center;
  gap: 6px;
  margin: 18px 0 0;
  color: #20301f;
  font-size: 16px;
  font-weight: 700;
  line-height: 1.45;
}

.consentCheckRowV253 input {
  width: 24px;
  height: 24px;
  flex: 0 0 auto;
  margin: 0;
}

.consentCheckRowV253 span {
  display: inline-block;
}

.consentActionsV253 {
  display: flex;
  justify-content: flex-end;
  align-items: center;
  gap: 12px;
  margin-top: 24px;
}

.consentActionsV253 .btn {
  min-height: 50px;
  padding: 0 24px;
}

@media (max-width: 760px) {
  .consentPageV253 {
    padding: 8px 2px 16px;
  }

  .consentPanelV253 {
    border-radius: 26px;
    padding: 24px 22px;
  }

  .consentEyebrowV253 {
    margin-bottom: 18px;
    font-size: 18px;
  }

  .consentCopyV253 p,
  .consentCheckRowV253 {
    font-size: 14px;
  }

  .consentCopyV253 p {
    line-height: 1.72;
  }

  .consentActionsV253 {
    display: grid;
    justify-content: stretch;
    margin-top: 22px;
  }

  .consentActionsV253 .btn {
    width: 100%;
  }
}


/* v256: consent page only - rename heading and move action buttons to the right while keeping the v214-style card layout. */
.consentActionsRightV256 {
  justify-content: flex-end;
}


/* v258 instructions page redesign */
.instructionsV258Page {
  display: grid;
  gap: 24px;
  padding: 38px 38px 42px;
}
.instructionsV258Header {
  display: grid;
  gap: 10px;
}
.instructionsV258Header .eyebrow {
  margin-bottom: 0;
  font-size: 18px;
  color: #5ca66b;
}
.instructionsV258Header h2 {
  margin: 0;
  font-size: clamp(36px, 4.8vw, 54px);
  line-height: 1.16;
  letter-spacing: -0.02em;
  color: #20301f;
}
.instructionsV258Lead {
  margin: 0;
  max-width: 860px;
  font-size: 20px;
  line-height: 1.9;
  color: #60715d;
  font-weight: 600;
}
.instructionsV258FlowCard {
  padding: 26px 22px 22px;
  border-radius: 28px;
  border: 1px solid #c9d9bf;
  background: linear-gradient(180deg, rgba(245, 249, 239, 0.98), rgba(237, 244, 231, 0.98));
  box-shadow: inset 0 1px 0 rgba(255,255,255,0.88);
}
.instructionsV258FlowHeader {
  margin-bottom: 18px;
}
.instructionsV258FlowHeader h3,
.instructionsV258InfoCard h3,
.instructionsV258FooterNote h3 {
  margin: 0 0 8px;
  font-size: 21px;
  line-height: 1.35;
  color: #29402a;
}
.instructionsV258FlowHeader p,
.instructionsV258InfoCard p,
.instructionsV258FooterNote p {
  margin: 0;
  font-size: 18px;
  line-height: 1.9;
  color: #60715d;
  font-weight: 600;
}
.instructionsV258FlowSteps {
  display: grid;
  grid-template-columns: repeat(7, minmax(0, auto));
  gap: 12px;
  align-items: stretch;
}
.instructionsV258FlowStep {
  min-width: 0;
  display: grid;
  align-content: start;
  gap: 8px;
  padding: 18px 16px;
  border-radius: 22px;
  border: 1px solid #d4e2c8;
  background: rgba(255,255,255,0.94);
  box-shadow: 0 10px 24px rgba(82, 106, 72, 0.08);
}
.instructionsV258FlowStep strong {
  font-size: 20px;
  line-height: 1.45;
  color: #20301f;
}
.instructionsV258FlowStep p {
  margin: 0;
  font-size: 16px;
  line-height: 1.8;
  color: #60715d;
  font-weight: 600;
}
.instructionsV258StepNumber {
  width: 38px;
  height: 38px;
  display: inline-grid;
  place-items: center;
  border-radius: 999px;
  background: #5ca66b;
  color: #ffffff;
  font-size: 18px;
  font-weight: 800;
}
.instructionsV258FlowArrow {
  align-self: center;
  justify-self: center;
  font-size: 30px;
  line-height: 1;
  color: #8aa182;
  font-weight: 700;
}
.instructionsV258FlowStep.isAnswer {
  background: linear-gradient(180deg, #fffef9, #f7fbf2);
  border-color: #c7dabb;
}
.instructionsV258ContentGrid {
  display: grid;
  grid-template-columns: 1.2fr 1fr;
  gap: 20px;
}
.instructionsV258InfoCard {
  padding: 24px 22px;
  border-radius: 24px;
  border: 1px solid #d9e6d0;
  background: rgba(255,255,255,0.92);
  box-shadow: 0 12px 30px rgba(64, 87, 57, 0.06);
}
.instructionsV258List {
  margin: 0;
  padding-left: 1.15em;
  display: grid;
  gap: 10px;
}
.instructionsV258List li {
  color: #20301f;
  font-size: 18px;
  line-height: 1.95;
  font-weight: 600;
}
.instructionsV258AnswerCard {
  background: linear-gradient(180deg, rgba(255,253,247,0.98), rgba(247,250,242,0.98));
}
.instructionsV258ChoiceRow {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  margin: 18px 0 16px;
}
.instructionsV258Choice {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 110px;
  padding: 12px 18px;
  border-radius: 999px;
  border: 1px solid #cadecf;
  background: #f6fbf2;
  color: #29402a;
  font-size: 18px;
  font-weight: 800;
  box-shadow: inset 0 1px 0 rgba(255,255,255,0.86);
}
.instructionsV258Choice.isWide {
  min-width: 220px;
}
.instructionsV258FooterNote {
  display: flex;
  justify-content: space-between;
  gap: 20px;
  align-items: center;
  padding: 24px 22px;
  border-radius: 24px;
  border: 1px solid #d5e3cb;
  background: rgba(248, 251, 242, 0.96);
}
.instructionsV258Actions {
  margin-top: 0;
  justify-content: flex-end;
}
.instructionsV258Actions .btn {
  min-width: 132px;
  padding: 16px 26px;
  font-size: 18px;
}
@media (max-width: 980px) {
  .instructionsV258FlowSteps {
    grid-template-columns: 1fr;
  }
  .instructionsV258FlowArrow {
    transform: rotate(90deg);
    padding: 2px 0;
  }
  .instructionsV258ContentGrid {
    grid-template-columns: 1fr;
  }
  .instructionsV258FooterNote {
    flex-direction: column;
    align-items: flex-start;
  }
  .instructionsV258Actions {
    width: 100%;
    justify-content: flex-start;
  }
}
@media (max-width: 720px) {
  .instructionsV258Page {
    padding: 24px 18px 28px;
    gap: 18px;
  }
  .instructionsV258Header .eyebrow {
    font-size: 16px;
  }
  .instructionsV258Header h2 {
    font-size: clamp(28px, 8vw, 38px);
  }
  .instructionsV258Lead,
  .instructionsV258FlowHeader p,
  .instructionsV258InfoCard p,
  .instructionsV258FooterNote p,
  .instructionsV258List li {
    font-size: 16px;
    line-height: 1.85;
  }
  .instructionsV258FlowHeader h3,
  .instructionsV258InfoCard h3,
  .instructionsV258FooterNote h3 {
    font-size: 20px;
  }
  .instructionsV258FlowStep strong {
    font-size: 18px;
  }
  .instructionsV258Choice {
    font-size: 16px;
    min-width: 96px;
  }
  .instructionsV258Choice.isWide {
    min-width: 100%;
  }
  .instructionsV258Actions .btn {
    width: 100%;
  }
}

/* v260: align parent guidance card background with the instruction page world */
.instructionsV260ParentCard {
  background:
    radial-gradient(circle at 12% 0%, rgba(255,255,255,0.88), transparent 34%),
    linear-gradient(180deg, rgba(245, 249, 239, 0.98), rgba(237, 244, 231, 0.98));
  border-color: #c9d9bf;
  box-shadow: inset 0 1px 0 rgba(255,255,255,0.88), 0 12px 30px rgba(64, 87, 57, 0.07);
}
.instructionsV260ParentCard h3 {
  color: #29402a;
}
.instructionsV260ParentCard p {
  color: #60715d;
}

/* v261 pitch practice intro copy/design */
.pitchIntroV261 {
  display: grid;
  gap: 18px;
  margin: 22px 0 8px;
  max-width: 820px;
}
.pitchIntroV261Lead,
.pitchIntroV261Focus {
  padding: 20px 22px;
  border-radius: 22px;
  border: 1px solid rgba(201, 217, 191, 0.92);
  background: linear-gradient(180deg, rgba(248, 251, 242, 0.98), rgba(239, 247, 232, 0.98));
  box-shadow: inset 0 1px 0 rgba(255,255,255,0.86), 0 12px 26px rgba(64, 87, 57, 0.06);
}
.pitchIntroV261Focus {
  background: linear-gradient(180deg, rgba(255, 253, 247, 0.98), rgba(246, 250, 241, 0.98));
  border-color: rgba(211, 224, 202, 0.98);
}
.pitchIntroV261 p {
  margin: 0;
  color: #60715d;
  font-size: clamp(17px, 1.7vw, 20px);
  line-height: 1.9;
  font-weight: 650;
}
.pitchIntroV261Lead p + p,
.pitchIntroV261Focus p + p {
  margin-top: 4px;
}
.pitchIntroV261Answer,
.pitchIntroV261Start {
  padding-left: 4px;
}
.pitchIntroV261Answer {
  color: #20301f !important;
  font-weight: 800 !important;
}
.pitchIntroV261Start {
  color: #4f604f !important;
}
@media (max-width: 720px) {
  .pitchIntroV261 {
    gap: 14px;
    margin-top: 18px;
  }
  .pitchIntroV261Lead,
  .pitchIntroV261Focus {
    padding: 17px 18px;
    border-radius: 18px;
  }
  .pitchIntroV261 p {
    font-size: 16px;
    line-height: 1.85;
  }
}


/* v263 pitch intro: three bordered instruction boxes matching the approved concept */
.pitchIntroFlowV262 {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  align-items: stretch;
  gap: 20px;
  margin: 4px 0 8px;
}
.pitchIntroStepV262 {
  min-height: 240px;
  display: grid;
  justify-items: center;
  align-content: center;
  gap: 14px;
  padding: 28px 22px 24px;
  border: 2px solid rgba(180, 205, 152, 0.98);
  border-radius: 34px;
  background: rgba(255, 255, 253, 0.82);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.92), 0 12px 28px rgba(88, 111, 75, 0.06);
  text-align: center;
}
.pitchIntroStepNumberV262 {
  width: 46px;
  height: 46px;
  display: inline-grid;
  place-items: center;
  border-radius: 999px;
  background: linear-gradient(180deg, #79bb72, #58a85f);
  color: #ffffff;
  font-size: 24px;
  font-weight: 900;
  line-height: 1;
  box-shadow: 0 8px 16px rgba(89, 160, 95, 0.18);
}
.pitchIntroStepV262 strong {
  color: #1f4a28;
  font-size: clamp(20px, 1.8vw, 26px);
  font-weight: 900;
  line-height: 1.25;
  letter-spacing: 0.02em;
}
.pitchIntroIllustrationV263 {
  width: min(118px, 100%);
  color: #204b28;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}
.pitchIntroIllustrationV263 svg {
  width: 100%;
  height: auto;
  display: block;
}
.pitchIntroIllustrationCompareV263 {
  width: min(136px, 100%);
}
@media (max-width: 980px) {
  .pitchIntroFlowV262 {
    gap: 14px;
  }
  .pitchIntroStepV262 {
    min-height: 220px;
    padding: 24px 16px 22px;
    border-radius: 28px;
  }
  .pitchIntroStepNumberV262 {
    width: 46px;
    height: 46px;
    font-size: 20px;
  }
  .pitchIntroStepV262 strong {
    font-size: 24px;
  }
  .pitchIntroIllustrationV263 {
    width: min(102px, 100%);
  }
  .pitchIntroIllustrationCompareV263 {
    width: min(122px, 100%);
  }
}
@media (max-width: 860px) {
  .pitchIntroFlowV262 {
    grid-template-columns: 1fr;
    gap: 12px;
  }
  .pitchIntroStepV262 {
    min-height: 0;
  }
}
@media (max-width: 720px) {
  .pitchIntroStepV262 {
    gap: 14px;
    padding: 24px 16px 20px;
    border-radius: 24px;
  }
  .pitchIntroStepV262 strong {
    font-size: 20px;
  }
}

/* v264 pitch intro: use exact approved mark assets for the three boxes */
.pitchIntroMarkV264 {
  display: block;
  width: min(96px, 58%);
  height: 96px;
  object-fit: contain;
  margin-top: 0;
}
.pitchIntroMarkCompareV264 {
  width: min(112px, 66%);
}
@media (max-width: 980px) {
  .pitchIntroMarkV264 {
    width: min(84px, 56%);
    height: 84px;
  }
  .pitchIntroMarkCompareV264 {
    width: min(100px, 64%);
  }
}
@media (max-width: 720px) {
  .pitchIntroMarkV264 {
    width: min(78px, 54%);
    height: 78px;
  }
  .pitchIntroMarkCompareV264 {
    width: min(92px, 62%);
  }
}

/* v266 pitch intro balance: square boxes, aligned number/text/mark rows, smaller marks */
.pitchIntroFlowV262 {
  max-width: 850px;
  margin: 2px auto 10px;
  gap: 18px;
}
.pitchIntroStepV262 {
  aspect-ratio: 1 / 1;
  min-height: 0;
  display: grid;
  grid-template-rows: 40px 54px 82px;
  align-content: center;
  justify-items: center;
  gap: 12px;
  padding: 20px 18px;
  border-radius: 30px;
}
.pitchIntroStepNumberV262 {
  width: 40px;
  height: 40px;
  font-size: 20px;
  align-self: center;
}
.pitchIntroStepV262 strong {
  align-self: center;
  font-size: clamp(16px, 1.45vw, 20px);
  line-height: 1.28;
}
.pitchIntroMarkV264 {
  align-self: center;
  justify-self: center;
  width: auto;
  height: 68px;
  max-width: 76px;
  object-fit: contain;
  margin: 0;
}
.pitchIntroMarkCompareV264 {
  width: auto;
  height: 74px;
  max-width: 92px;
}
@media (max-width: 980px) {
  .pitchIntroFlowV262 {
    max-width: 760px;
    gap: 12px;
  }
  .pitchIntroStepV262 {
    grid-template-rows: 38px 52px 76px;
    padding: 18px 14px;
    border-radius: 26px;
  }
  .pitchIntroStepNumberV262 {
    width: 38px;
    height: 38px;
    font-size: 19px;
  }
  .pitchIntroStepV262 strong {
    font-size: 17px;
  }
  .pitchIntroMarkV264 {
    height: 62px;
    max-width: 70px;
  }
  .pitchIntroMarkCompareV264 {
    height: 68px;
    max-width: 84px;
  }
}
@media (max-width: 860px) {
  .pitchIntroFlowV262 {
    max-width: 420px;
  }
  .pitchIntroStepV262 {
    aspect-ratio: auto;
    min-height: 178px;
  }
}
@media (max-width: 720px) {
  .pitchIntroStepV262 {
    grid-template-rows: 36px 46px 68px;
    padding: 16px;
    border-radius: 22px;
  }
  .pitchIntroStepNumberV262 {
    width: 36px;
    height: 36px;
    font-size: 18px;
  }
  .pitchIntroStepV262 strong {
    font-size: 16px;
  }
  .pitchIntroMarkV264 {
    height: 58px;
    max-width: 66px;
  }
  .pitchIntroMarkCompareV264 {
    height: 62px;
    max-width: 78px;
  }
}


/* v267 pitch intro: restore label size, enlarge square boxes, and add arrows */
.pitchIntroFlowV262 {
  grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr) auto minmax(0, 1fr);
  max-width: 1040px;
  gap: 16px;
  align-items: center;
}
.pitchIntroStepV262 {
  aspect-ratio: 1 / 1;
  grid-template-rows: 40px 70px 82px;
  gap: 13px;
  padding: 24px 18px;
  border-radius: 32px;
}
.pitchIntroStepV262 strong {
  font-size: clamp(22px, 2vw, 30px);
  line-height: 1.22;
}
.pitchIntroArrowV267 {
  align-self: center;
  justify-self: center;
  color: #86a47a;
  font-size: 30px;
  font-weight: 900;
  line-height: 1;
  margin: 0 -2px;
}
@media (max-width: 980px) {
  .pitchIntroFlowV262 { max-width: 880px; gap: 10px; }
  .pitchIntroStepV262 { grid-template-rows: 38px 64px 76px; padding: 20px 14px; border-radius: 28px; }
  .pitchIntroStepV262 strong { font-size: clamp(20px, 2.2vw, 24px); }
  .pitchIntroArrowV267 { font-size: 25px; }
}
@media (max-width: 860px) {
  .pitchIntroFlowV262 { grid-template-columns: 1fr; max-width: 430px; gap: 10px; }
  .pitchIntroArrowV267 { transform: rotate(90deg); font-size: 24px; margin: -2px 0; }
  .pitchIntroStepV262 { aspect-ratio: auto; min-height: 205px; }
}
@media (max-width: 720px) {
  .pitchIntroStepV262 { grid-template-rows: 36px 56px 68px; padding: 18px 16px; border-radius: 24px; }
  .pitchIntroStepV262 strong { font-size: 21px; }
}

/* v272: restore pitch intro page and enlarge only the three square boxes under the title by 1.2x */
.pitchIntroFlowV262 {
  width: min(1176px, calc(100vw - 48px));
  max-width: none;
  justify-self: center;
}

/* v273 pitch intro reset: use v262 layout/content, keeping only the improved mark images */
.pitchIntroFlowV262 {
  display: grid;
  grid-template-columns: 1fr auto 1fr auto 1fr;
  align-items: stretch;
  gap: 14px;
  margin: 4px 0 4px;
  width: auto;
  max-width: none;
  justify-self: auto;
}
.pitchIntroStepV262 {
  min-height: 150px;
  aspect-ratio: auto;
  display: grid;
  place-items: center;
  align-content: center;
  grid-template-rows: none;
  gap: 10px;
  padding: 18px 16px;
  border: 1px solid rgba(188, 211, 176, 0.96);
  border-radius: 24px;
  background: rgba(255, 253, 247, 0.72);
  box-shadow: inset 0 1px 0 rgba(255,255,255,0.88), 0 10px 24px rgba(64, 87, 57, 0.05);
  text-align: center;
}
.pitchIntroStepNumberV262 {
  width: 36px;
  height: 36px;
  font-size: 18px;
  align-self: auto;
}
.pitchIntroStepV262 strong {
  color: #20301f;
  font-size: clamp(18px, 2.2vw, 24px);
  font-weight: 900;
  line-height: 1.35;
  align-self: auto;
}
.pitchIntroMarkV264 {
  display: block;
  width: auto;
  height: 54px;
  max-width: 72px;
  object-fit: contain;
  margin: 0;
  align-self: auto;
  justify-self: center;
}
.pitchIntroMarkCompareV264 {
  height: 58px;
  max-width: 86px;
}
.pitchIntroArrowV262 {
  align-self: center;
  justify-self: center;
  color: #8aa182;
  font-size: 21px;
  font-weight: 900;
}
@media (max-width: 860px) {
  .pitchIntroFlowV262 {
    grid-template-columns: 1fr;
    gap: 10px;
  }
  .pitchIntroArrowV262 {
    transform: rotate(90deg);
    font-size: 24px;
    line-height: 1;
  }
  .pitchIntroStepV262 {
    min-height: 120px;
  }
}
@media (max-width: 720px) {
  .pitchIntroStepV262 {
    border-radius: 20px;
    padding: 16px;
  }
  .pitchIntroStepV262 strong {
    font-size: 20px;
  }
  .pitchIntroMarkV264 {
    height: 50px;
    max-width: 68px;
  }
  .pitchIntroMarkCompareV264 {
    height: 54px;
    max-width: 80px;
  }
}

/* v274 pitch intro only: replace top-left label and align the three step rows without resizing the numbers/text/marks */
.pitchIntroSignalV274 {
  min-width: 0;
  padding: 8px 14px;
}
.pitchIntroSignalV274 strong {
  font-size: 14px;
  line-height: 1;
}
.pitchIntroStepV262 {
  grid-template-rows: 36px 34px 58px;
  align-content: center;
  justify-items: center;
}
.pitchIntroStepNumberV262,
.pitchIntroStepV262 strong,
.pitchIntroMarkV264 {
  align-self: center;
  justify-self: center;
}
@media (max-width: 720px) {
  .pitchIntroStepV262 {
    grid-template-rows: 36px 34px 54px;
  }
}

/* v275 pitch intro only: extend the three step boxes downward, align vertical spacing, remove the label box, and right-align the practice button */
.pitchIntroSignalV274 {
  min-width: 0;
  padding: 0;
  border: 0;
  background: transparent;
  box-shadow: none;
  color: #60715d;
}
.pitchIntroSignalV274 strong {
  font-size: 14px;
  line-height: 1.1;
  color: #60715d;
}
.pitchIntroStepV262 {
  min-height: 222px;
  grid-template-rows: 36px 42px 58px;
  row-gap: 17px;
  padding-top: 26px;
  padding-bottom: 26px;
  align-content: center;
}
.pitchIntroStepNumberV262,
.pitchIntroStepV262 strong,
.pitchIntroMarkV264 {
  justify-self: center;
  align-self: center;
}
.pitchIntroActionsV275 {
  justify-content: flex-end;
}
@media (max-width: 860px) {
  .pitchIntroStepV262 {
    min-height: 190px;
    grid-template-rows: 36px 38px 58px;
    row-gap: 14px;
    padding-top: 22px;
    padding-bottom: 22px;
  }
}
@media (max-width: 720px) {
  .pitchIntroStepV262 {
    min-height: 184px;
    grid-template-rows: 36px 38px 54px;
    row-gap: 13px;
    padding-top: 22px;
    padding-bottom: 22px;
  }
}
/* v276 pitch practice/test: label and action alignment only */
.app.forest .parentSignal.pitchPracticeSignalV276 {
  min-width: 0;
  padding: 0;
  border: 0;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
}
.app.forest .parentSignal.pitchPracticeSignalV276 strong {
  font-size: 13px;
  line-height: 1.25;
  color: #41563b;
}
.pitchPracticeSubmitActionsV276 {
  justify-content: flex-end;
}
/* v277: pitch practice feedback page only */
.pitchPracticeFeedbackParentV277 {
  margin-top: 0;
  padding-top: 0;
  border-top: 0;
}
.pitchPracticeFeedbackNextActionsV277 {
  justify-content: flex-end;
}

/* v279: main assessment submit button alignment */
.mainTestSubmitActionsV279 {
  justify-content: flex-end;
}


/* v280: keep the forest map label space while hiding the text during test pages */
.testCard .forestMapTop .mapLabel {
  visibility: hidden;
}

/* v283 LP only: restore v262 hero headline shape and add hover/press feedback */
.darwinLanding .hero-title {
  max-width: 720px;
  font-size: clamp(32px, 4.35vw, 52px);
  line-height: 1.22;
  letter-spacing: -0.045em;
}

@media (max-width: 900px) {
  .darwinLanding .hero-title {
    max-width: 680px;
    font-size: clamp(31px, 7.4vw, 48px);
    line-height: 1.2;
  }
}

@media (max-width: 560px) {
  .darwinLanding .hero-title {
    font-size: clamp(27px, 8.4vw, 36px);
    line-height: 1.24;
    letter-spacing: -0.035em;
  }
}

.darwinLanding .header-cta,
.darwinLanding .login-button,
.darwinLanding .primary-button,
.darwinLanding .secondary-button,
.darwinLanding .flow-button {
  transition: transform 120ms ease, box-shadow 120ms ease, filter 120ms ease, background 120ms ease, border-color 120ms ease;
  will-change: transform;
}

@media (hover: hover) and (pointer: fine) {
  .darwinLanding .header-cta:hover,
  .darwinLanding .login-button:hover,
  .darwinLanding .primary-button:hover,
  .darwinLanding .secondary-button:hover,
  .darwinLanding .flow-button:hover {
    transform: translateY(2px) scale(0.985);
    box-shadow: 0 4px 12px rgba(58, 83, 60, 0.12) inset, 0 2px 8px rgba(58, 83, 60, 0.08) !important;
    filter: brightness(0.97);
  }
}

.darwinLanding .header-cta:active,
.darwinLanding .login-button:active,
.darwinLanding .primary-button:active,
.darwinLanding .secondary-button:active,
.darwinLanding .flow-button:active {
  transform: translateY(2px) scale(0.985);
  box-shadow: 0 4px 12px rgba(58, 83, 60, 0.12) inset, 0 2px 8px rgba(58, 83, 60, 0.08) !important;
  filter: brightness(0.97);
}

/* v285 LP only: keep the second hero headline line from auto-wrapping without changing font size or family. */
.darwinLanding .hero-title-nowrap {
  white-space: nowrap;
}


/* v290 core intro labels: text only, no bordered box */
.app.forest .parentSignal.introSignal.pitchIntroSignalV274 {
  min-width: 0;
  padding: 0;
  border: 0;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
  color: #60715d;
}
.app.forest .parentSignal.introSignal.pitchIntroSignalV274 strong {
  font-size: 14px;
  line-height: 1.1;
  color: #60715d;
}


/* v291 WM core intro: move only the illustration flow on the X axis so the middle arrow aligns with the center. */
@media (min-width: 861px) {
  .wmIntroFlowCenterArrowV291 {
    transform: translateX(16.5%);
  }
}

/* v307: make the assessment app itself the scroll surface so each remounted screen starts at top. */
.app.forest.assessmentViewportV307 {
  height: 100dvh;
  overflow-y: auto;
  overscroll-behavior: contain;
  -webkit-overflow-scrolling: touch;
  scroll-behavior: auto;
}

/* v308: keep the v307 assessment scroll surface scrollable, but hide its visible scrollbar. */
.app.forest.assessmentViewportV307 {
  scrollbar-width: none;
  -ms-overflow-style: none;
}

.app.forest.assessmentViewportV307::-webkit-scrollbar {
  display: none;
  width: 0;
  height: 0;
}

/* v328: shared practice/main AAX/AX playback marks for all cores. AAX uses 3 marks; WM AX uses 2 marks. */
.pitchPlaybackFlowV310 {
  height: 0;
  overflow: visible;
  display: grid;
  grid-template-columns: 66px 66px 66px;
  justify-content: center;
  align-items: center;
  gap: 46px;
  width: min(330px, 100%);
  margin: 0 auto;
  transform: translateY(14px);
  pointer-events: none;
  position: relative;
  z-index: 2;
}
.pitchPlaybackFlowWmV328 {
  grid-template-columns: 66px 66px;
  gap: 56px;
  width: min(210px, 100%);
}
.pitchPlaybackFlowV310::before {
  content: none;
}
.pitchPlaybackStepV310 {
  width: 66px;
  height: 66px;
  min-height: 0;
  display: grid;
  place-items: center;
  padding: 0;
  border: 0;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
  text-align: center;
  position: relative;
  z-index: 1;
  transition: filter .12s ease, opacity .12s ease, transform .12s ease;
}
.pitchPlaybackStepV310::before {
  content: none;
}
.pitchPlaybackStepV310::after {
  content: '';
  position: absolute;
  left: calc(100% + 23px);
  top: 50%;
  width: 36px;
  height: 7px;
  transform: translate(-50%, -50%);
  background:
    radial-gradient(circle at 50% 50%, rgba(34, 39, 33, .92) 0 2.8px, transparent 3.05px),
    linear-gradient(to bottom, transparent calc(50% - .5px), rgba(194, 203, 188, .52) calc(50% - .5px) calc(50% + .5px), transparent calc(50% + .5px));
  border-radius: 999px;
  transition: background .12s ease, filter .12s ease;
  z-index: 0;
}
.pitchPlaybackStepV310:last-child::after {
  content: none;
}
.pitchPlaybackStepV310.isActive {
  border: 0;
  background: transparent;
  box-shadow: none;
  transform: none;
}
.pitchPlaybackStepV310.isActive::after {
  background:
    radial-gradient(circle at 50% 50%, rgba(34, 39, 33, .92) 0 2.8px, transparent 3.05px),
    linear-gradient(to bottom, transparent calc(50% - .5px), rgba(194, 203, 188, .52) calc(50% - .5px) calc(50% + .5px), transparent calc(50% + .5px));
  filter: none;
}
.pitchPlaybackMarkV310 {
  width: auto;
  height: 54px;
  max-width: 63px;
  object-fit: contain;
  justify-self: center;
  opacity: 1;
  filter: none;
  transition: filter .12s ease, opacity .12s ease, transform .12s ease;
}
.pitchPlaybackStepV310.isActive .pitchPlaybackMarkV310 {
  opacity: 1;
  filter: brightness(0) saturate(100%) invert(54%) sepia(95%) saturate(1416%) hue-rotate(349deg) brightness(101%) contrast(94%);
  transform: scale(1.04);
}
.pitchPlaybackMarkCompareV310 {
  height: 54px;
  max-width: 66px;
}
.pitchPlaybackArrowV310 {
  display: none;
}
@media (max-width: 720px) {
  .pitchPlaybackFlowV310 {
    grid-template-columns: 52px 52px 52px;
    justify-content: center;
    gap: 32px;
    width: min(240px, 100%);
    margin: 0 auto;
    transform: translateY(12px);
  }
  .pitchPlaybackFlowWmV328 {
    grid-template-columns: 52px 52px;
    gap: 40px;
    width: min(160px, 100%);
  }
  .pitchPlaybackFlowV310::before {
    content: none;
  }
  .pitchPlaybackStepV310 {
    width: 52px;
    height: 52px;
    padding: 0;
  }
  .pitchPlaybackStepV310::before {
    content: none;
  }
  .pitchPlaybackStepV310::after {
    left: calc(100% + 16px);
    top: 50%;
    width: 24px;
    height: 6px;
    transform: translate(-50%, -50%);
    background:
      radial-gradient(circle at 50% 50%, rgba(34, 39, 33, .92) 0 2.35px, transparent 2.6px),
      linear-gradient(to bottom, transparent calc(50% - .5px), rgba(194, 203, 188, .52) calc(50% - .5px) calc(50% + .5px), transparent calc(50% + .5px));
    box-shadow: none;
  }
  .pitchPlaybackStepV310.isActive::after {
    background:
      radial-gradient(circle at 50% 50%, rgba(34, 39, 33, .92) 0 2.35px, transparent 2.6px),
      linear-gradient(to bottom, transparent calc(50% - .5px), rgba(194, 203, 188, .52) calc(50% - .5px) calc(50% + .5px), transparent calc(50% + .5px));
    box-shadow: none;
    filter: none;
  }
  .pitchPlaybackMarkV310 {
    height: 42px;
    max-width: 48px;
  }
  .pitchPlaybackMarkCompareV310 {
    height: 42px;
    max-width: 51px;
  }
}

/* v334: free result paid report teaser - more compact and blended into the free result world while keeping the premium-access structure */
.paidTeaserV332 {
  position: relative;
  overflow: hidden;
  margin: 18px auto 20px;
  padding: clamp(20px, 2.6vw, 28px) clamp(18px, 3.2vw, 32px) clamp(22px, 2.8vw, 30px);
  border-radius: 24px;
  background:
    linear-gradient(135deg, rgba(247, 251, 242, .94), rgba(255, 250, 238, .96));
  border: 1px solid rgba(202, 216, 190, .92);
  box-shadow: 0 12px 28px rgba(76, 65, 43, .045);
}

.paidTeaserV332::before {
  content: '';
  position: absolute;
  left: 28px;
  right: 28px;
  top: 14px;
  height: 1px;
  background: linear-gradient(90deg, transparent, rgba(211, 191, 150, .68), transparent);
}

.paidTeaserBadgeV332 {
  display: flex;
  align-items: center;
  justify-content: center;
  width: fit-content;
  margin: 0 auto 10px;
  padding: 5px 13px;
  border-radius: 999px;
  background: rgba(93, 128, 78, .13);
  color: #48663f;
  font-weight: 850;
  font-size: 12px;
  letter-spacing: .035em;
}

.paidTeaserV332 h3 {
  max-width: 660px;
  margin: 0 auto 8px;
  color: #314b34;
  text-align: center;
  font-size: clamp(21px, 2.9vw, 30px);
  line-height: 1.32;
  letter-spacing: -.04em;
  font-weight: 900;
}

.paidTeaserV332 .paidTeaserLeadV332 {
  max-width: 720px;
  margin: 0 auto 18px;
  color: #6b624f;
  text-align: center;
  font-size: clamp(13px, 1.45vw, 15px);
  line-height: 1.78;
  font-weight: 700;
}

.paidTeaserItemsV332 {
  display: grid;
  gap: 7px;
  max-width: 760px;
  margin: 14px auto 20px;
}

.paidTeaserItemV332 {
  display: grid;
  grid-template-columns: auto 1fr;
  gap: 12px;
  align-items: start;
  padding: 8px 6px;
  border-radius: 0;
  background: transparent;
  border: 0;
  box-shadow: none;
}

.paidTeaserItemV332 + .paidTeaserItemV332 {
  border-top: 1px solid rgba(213, 225, 204, .72);
  padding-top: 11px;
}

.paidTeaserNumberV332 {
  display: inline-flex;
  width: 34px;
  height: 34px;
  align-items: center;
  justify-content: center;
  border-radius: 12px;
  background: #3e6444;
  color: #fffdf6;
  font-size: 14px;
  font-weight: 900;
  letter-spacing: -.035em;
  line-height: 1;
  box-shadow: 0 6px 12px rgba(55, 88, 58, .12);
}

.paidTeaserItemV332 h4 {
  margin: 0 0 2px;
  color: #2f4a34;
  font-size: clamp(15px, 1.7vw, 18px);
  line-height: 1.34;
  font-weight: 900;
  letter-spacing: -.035em;
}

.paidTeaserItemV332 p {
  margin: 0;
  color: #6d6657;
  font-size: clamp(12px, 1.35vw, 14px);
  line-height: 1.55;
  font-weight: 650;
}

.paidTeaserButtonV332 {
  display: flex;
  width: fit-content;
  min-width: min(100%, 270px);
  min-height: 50px;
  justify-content: center;
  margin: 0 auto;
  padding-left: 24px;
  padding-right: 24px;
  font-size: 13px;
  box-shadow: 0 10px 20px rgba(73, 127, 83, .14);
}

@media (max-width: 720px) {
  .paidTeaserV332 {
    margin: 16px auto 18px;
    padding: 19px 15px 21px;
    border-radius: 22px;
  }

  .paidTeaserV332::before {
    left: 20px;
    right: 20px;
    top: 12px;
  }

  .paidTeaserBadgeV332 {
    margin-bottom: 9px;
    padding: 5px 12px;
    font-size: 11px;
  }

  .paidTeaserV332 h3 {
    font-size: 21px;
    line-height: 1.34;
  }

  .paidTeaserV332 .paidTeaserLeadV332 {
    font-size: 13px;
    line-height: 1.68;
    margin-bottom: 14px;
  }

  .paidTeaserItemsV332 {
    gap: 5px;
    margin: 12px auto 18px;
  }

  .paidTeaserItemV332 {
    gap: 10px;
    padding: 7px 2px;
  }

  .paidTeaserItemV332 + .paidTeaserItemV332 {
    padding-top: 10px;
  }

  .paidTeaserNumberV332 {
    width: 32px;
    height: 32px;
    border-radius: 11px;
    font-size: 13px;
  }

  .paidTeaserItemV332 h4 {
    font-size: 13px;
  }

  .paidTeaserItemV332 p {
    font-size: 12px;
    line-height: 1.52;
  }

  .paidTeaserButtonV332 {
    width: 100%;
    min-height: 49px;
    font-size: 14px;
  }
}


/* v337 public result login modal - compact 16Personalities-like sizing while keeping green/cream world. */
.darwinLanding .login-button {
  border: 1px solid rgba(52, 93, 70, 0.18);
  cursor: pointer;
  font-family: inherit;
}

.resultLoginOverlay {
  position: fixed;
  inset: 0;
  z-index: 90;
  display: grid;
  place-items: center;
  padding: 22px;
  background:
    radial-gradient(circle at 50% 0%, rgba(232, 243, 222, 0.36), transparent 36%),
    rgba(35, 46, 38, 0.28);
  backdrop-filter: blur(8px);
}

.resultLoginModal {
  position: relative;
  width: min(560px, calc(100vw - 34px));
  border-radius: 22px;
  border: 1px solid rgba(205, 220, 196, 0.96);
  background:
    linear-gradient(180deg, rgba(255, 255, 249, 0.98), rgba(250, 247, 235, 0.98)),
    #fffdf4;
  box-shadow: 0 20px 54px rgba(55, 71, 54, 0.20);
  overflow: hidden;
}

.resultLoginModal::before {
  content: '';
  position: absolute;
  inset: 0;
  pointer-events: none;
  background:
    radial-gradient(circle at 12% 15%, rgba(122, 166, 109, 0.13), transparent 28%),
    radial-gradient(circle at 87% 80%, rgba(214, 188, 130, 0.16), transparent 34%);
}

.resultLoginClose {
  position: absolute;
  top: 12px;
  right: 12px;
  z-index: 2;
  display: grid;
  place-items: center;
  width: 34px;
  height: 34px;
  border-radius: 999px;
  border: 1px solid rgba(100, 116, 96, 0.22);
  background: rgba(255, 255, 255, 0.78);
  color: #7a8676;
  font-size: 24px;
  line-height: 1;
  cursor: pointer;
}

.resultLoginClose:hover {
  background: rgba(246, 250, 240, 0.96);
  color: #365b40;
}

.resultLoginForm {
  position: relative;
  z-index: 1;
  display: grid;
  gap: 13px;
  padding: clamp(34px, 4.8vw, 48px) clamp(26px, 5.2vw, 46px) clamp(28px, 4.2vw, 40px);
}

.resultLoginPill {
  justify-self: center;
  margin: 0 0 4px;
  padding: 5px 14px;
  border-radius: 999px;
  background: rgba(86, 154, 101, 0.13);
  color: #3f7048;
  border: 1px solid rgba(86, 154, 101, 0.18);
  font-weight: 850;
  font-size: 12px;
  letter-spacing: .03em;
}

.resultLoginForm h2 {
  margin: 0;
  color: #2d3746;
  font-size: clamp(30px, 4.4vw, 42px);
  line-height: 1.12;
  font-weight: 900;
  letter-spacing: -0.055em;
  text-align: center;
}

.resultLoginLead {
  width: min(440px, 100%);
  margin: 0 auto 6px;
  color: #465045;
  font-size: clamp(16px, 2.1vw, 19px);
  line-height: 1.58;
  font-weight: 700;
  text-align: center;
  letter-spacing: -0.03em;
}

.resultLoginLabel {
  margin-top: 8px;
  color: #2d3746;
  font-weight: 900;
  font-size: clamp(16px, 2.1vw, 19px);
  letter-spacing: -0.04em;
}

.resultLoginInputWrap {
  display: grid;
  grid-template-columns: auto 1fr;
  align-items: center;
  gap: 15px;
  min-height: 54px;
  padding: 0 18px;
  border-radius: 9px;
  border: 1.5px solid rgba(63, 122, 80, 0.72);
  background: rgba(255, 255, 255, 0.9);
  box-shadow: 0 7px 20px rgba(72, 130, 88, 0.10);
}

.resultLoginInputWrap span {
  color: #3f8b5a;
  font-size: 21px;
  line-height: 1;
}

.resultLoginInputWrap input {
  width: 100%;
  border: 0;
  outline: 0;
  background: transparent;
  color: #2d3746;
  font-size: clamp(18px, 2.8vw, 24px);
  line-height: 1;
  font-weight: 600;
  font-family: inherit;
}

.resultLoginInputWrap input::placeholder {
  color: rgba(45, 55, 70, 0.34);
}

.resultLoginSubmit {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  min-height: 56px;
  margin-top: 12px;
  border: 0;
  border-radius: 999px;
  background: linear-gradient(180deg, #66ae75, #4d9660);
  color: #fff;
  box-shadow: 0 13px 30px rgba(60, 121, 75, 0.22);
  font-family: inherit;
  font-size: clamp(19px, 2.7vw, 25px);
  font-weight: 900;
  letter-spacing: -0.045em;
  cursor: pointer;
}

.resultLoginSubmit:hover {
  transform: translateY(-1px);
  box-shadow: 0 20px 44px rgba(60, 121, 75, 0.28);
}

.resultLoginFootnote,
.resultLoginDevCode,
.resultLoginMessage {
  margin: 0;
  text-align: center;
  font-size: 12px;
  line-height: 1.55;
}

.resultLoginFootnote {
  color: #76806f;
}

.resultLoginMessage {
  color: #9a4b3b;
  font-weight: 800;
}

.resultLoginCodeBoxes {
  position: relative;
  display: grid;
  grid-template-columns: repeat(6, 1fr);
  width: min(430px, 100%);
  min-height: 58px;
  margin: 8px auto 0;
  overflow: hidden;
  border-radius: 9px;
  border: 1.5px solid rgba(63, 122, 80, 0.62);
  background: rgba(255, 255, 255, 0.9);
  box-shadow: 0 12px 30px rgba(72, 130, 88, 0.12);
}

.resultLoginCodeBoxes span {
  display: grid;
  place-items: center;
  border-right: 1px solid rgba(83, 103, 78, 0.22);
  color: #2d3746;
  font-size: clamp(20px, 3.4vw, 28px);
  font-weight: 900;
}

.resultLoginCodeBoxes span:last-child {
  border-right: 0;
}

.resultLoginCodeInput {
  position: absolute;
  left: -9999px;
  width: 1px;
  height: 1px;
  opacity: 0;
}

.resultLoginDevCode {
  color: #4f744f;
  font-weight: 850;
}

.resultLoginBack {
  justify-self: center;
  border: 0;
  background: transparent;
  color: #3f7048;
  font-family: inherit;
  font-size: 13px;
  font-weight: 800;
  text-decoration: underline;
  text-underline-offset: 4px;
  cursor: pointer;
}

@media (max-width: 720px) {
  .resultLoginOverlay {
    padding: 14px;
    align-items: flex-end;
  }

  .resultLoginModal {
    width: min(520px, 100%);
    border-radius: 22px;
  }

  .resultLoginClose {
    top: 12px;
    right: 12px;
    width: 34px;
    height: 34px;
    font-size: 24px;
  }

  .resultLoginForm {
    gap: 12px;
    padding: 40px 22px 28px;
  }

  .resultLoginLead {
    font-size: 16px;
    line-height: 1.62;
  }

  .resultLoginInputWrap {
    min-height: 54px;
    padding: 0 16px;
    gap: 10px;
  }

  .resultLoginInputWrap span {
    font-size: 20px;
  }

  .resultLoginSubmit {
    min-height: 54px;
    font-size: 20px;
  }

  .resultLoginCodeBoxes {
    min-height: 54px;
  }
}

/* v340 lesson guidance priority cards */
.paidLessonGuidanceBlock h3 {
  margin-bottom: 18px;
  color: #2f4f36;
  letter-spacing: -0.02em;
}

.paidLessonGuidanceBlock > p {
  max-width: 920px;
}

.paidLessonPriorityList {
  display: grid;
  gap: 16px;
  margin-top: 26px;
}

.paidLessonCard {
  position: relative;
  display: grid;
  grid-template-columns: 132px minmax(0, 1fr);
  overflow: hidden;
  border: 1px solid rgba(112, 145, 93, 0.24);
  border-radius: 24px;
  background: linear-gradient(180deg, rgba(255, 254, 249, 0.98), rgba(247, 250, 240, 0.88));
  box-shadow: 0 18px 46px rgba(50, 64, 45, 0.06);
}

.paidLessonCard::after {
  content: '';
  position: absolute;
  inset: 0;
  pointer-events: none;
  background: radial-gradient(circle at 86% 8%, rgba(113, 153, 101, 0.12), transparent 38%);
}

.paidLessonPriorityRail {
  position: relative;
  z-index: 1;
  display: flex;
  flex-direction: column;
  justify-content: center;
  gap: 12px;
  padding: 24px 18px;
  background: linear-gradient(180deg, #6f8d58, #4f744f);
  color: #fff;
  text-align: center;
}

.paidLessonCardPriority2 .paidLessonPriorityRail {
  background: linear-gradient(180deg, #7f9460, #5f7f4b);
}

.paidLessonCardPriority3 .paidLessonPriorityRail {
  background: linear-gradient(180deg, #8ca17a, #6d875f);
}

.paidLessonCardPriority4 .paidLessonPriorityRail {
  background: linear-gradient(180deg, #9aa98b, #7e9272);
}

.paidLessonPriorityRail span {
  font-size: 42px;
  line-height: 1;
  font-weight: 900;
  letter-spacing: -0.06em;
  font-family: Georgia, 'Times New Roman', serif;
}

.paidLessonPriorityRail strong {
  align-self: center;
  width: fit-content;
  padding: 7px 12px;
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.18);
  color: #fff;
  font-size: 13px;
  line-height: 1;
  font-weight: 900;
  letter-spacing: 0.08em;
}

.paidLessonCardBody {
  position: relative;
  z-index: 1;
  padding: 24px 26px 24px;
}

.paidLessonCardHead {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 18px;
  margin-bottom: 12px;
}

.paidLessonCardHead p {
  width: fit-content;
  margin: 0 0 8px !important;
  padding: 6px 10px;
  border-radius: 999px;
  background: rgba(238, 244, 229, 0.92);
  color: #55704b !important;
  font-size: 12px !important;
  line-height: 1.1 !important;
  font-weight: 900;
  letter-spacing: 0.06em;
}

.paidLessonCardHead h4 {
  margin: 0;
  color: #263b2d;
  font-size: 23px;
  line-height: 1.35;
  letter-spacing: -0.03em;
}

.paidLessonCardHead small {
  display: block;
  margin-top: 6px;
  color: #6f7669;
  font-size: 13.5px;
  line-height: 1.75;
  font-weight: 750;
}

.paidLessonSummary {
  margin-bottom: 16px !important;
  color: #46463f !important;
  font-weight: 700;
  line-height: 1.95 !important;
}

.paidLessonInsightGrid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
}

.paidLessonMiniBox {
  border: 1px solid rgba(122, 151, 104, 0.26);
  border-radius: 18px;
  background: rgba(241, 246, 234, 0.72);
  padding: 14px 16px;
}

.paidLessonMiniBoxFamily {
  background: rgba(255, 250, 238, 0.86);
  border-color: rgba(210, 196, 160, 0.55);
}

.paidLessonMiniBox strong,
.paidLessonExamples strong {
  display: block;
  color: #365338;
  font-size: 13.5px;
  margin-bottom: 6px;
  font-weight: 900;
  letter-spacing: 0.02em;
}

.paidLessonMiniBox p {
  margin: 0 !important;
  font-size: 14px !important;
  line-height: 1.85 !important;
}

.paidLessonExamples {
  margin-top: 14px;
}

.paidLessonExamples ul {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin: 8px 0 0 !important;
  padding: 0 !important;
  border-left: 0 !important;
  background: transparent !important;
  list-style: none !important;
}

.paidLessonExamples li {
  margin: 0 !important;
  padding: 7px 10px;
  border-radius: 999px;
  background: rgba(255, 253, 247, 0.92);
  border: 1px solid rgba(218, 204, 174, 0.62);
  color: #5a564e;
  font-size: 12.5px;
  line-height: 1.45;
  font-weight: 750;
}

.paidLessonNote {
  margin-top: 22px !important;
  padding: 16px 18px;
  border-radius: 18px;
  background: rgba(237, 242, 230, 0.76);
  border: 1px solid rgba(122, 151, 104, 0.22);
  color: #596257 !important;
  font-size: 14.5px !important;
}

@media (max-width: 980px) {
  .paidLessonCard { grid-template-columns: 1fr; }
  .paidLessonPriorityRail { flex-direction: row; justify-content: flex-start; align-items: center; padding: 16px 18px; text-align: left; }
  .paidLessonPriorityRail span { font-size: 34px; }
  .paidLessonInsightGrid { grid-template-columns: 1fr; }
  .paidLessonCardBody { padding: 20px; }
}

/* v341 paid lesson guidance high-band refinement */
.paidLessonGuidanceBlock-high h3 {
  max-width: 920px;
  margin-bottom: 14px;
  font-size: 30px;
  line-height: 1.55;
}

.paidLessonGuidanceBlock-high > p {
  max-width: 920px;
  margin-bottom: 0 !important;
  color: #555d50 !important;
  font-size: 15.5px !important;
  line-height: 2 !important;
}

.paidLessonGuidanceBlock-high .paidLessonPriorityList {
  gap: 14px;
  margin-top: 28px;
}

.paidLessonCardWrap {
  display: grid;
  gap: 10px;
}

.paidLessonGuidanceBlock-high .paidLessonGroupLabel {
  width: fit-content;
  margin: 8px 0 0 !important;
  padding: 7px 13px;
  border-radius: 999px;
  background: rgba(226, 238, 212, 0.86);
  color: #45663f !important;
  font-size: 13px !important;
  line-height: 1 !important;
  font-weight: 900;
  letter-spacing: 0.04em;
}

.paidLessonGuidanceBlock-high .paidLessonCard {
  grid-template-columns: 96px minmax(0, 1fr);
  border-radius: 20px;
  box-shadow: 0 12px 30px rgba(50, 64, 45, 0.045);
}

.paidLessonGuidanceBlock-high .paidLessonPriorityRail {
  padding: 20px 12px;
  gap: 8px;
  background: linear-gradient(180deg, #7e9a66, #5d7e54);
}

.paidLessonGuidanceBlock-high .paidLessonPriorityRail span {
  font-size: 34px;
}

.paidLessonGuidanceBlock-high .paidLessonPriorityRail strong {
  display: none;
}

.paidLessonGuidanceBlock-high .paidLessonCardBody {
  padding: 20px 22px 18px;
}

.paidLessonGuidanceBlock-high .paidLessonCardHead {
  margin-bottom: 10px;
}

.paidLessonGuidanceBlock-high .paidLessonCardHead p {
  margin-bottom: 7px !important;
  padding: 5px 9px;
  font-size: 11.5px !important;
}

.paidLessonGuidanceBlock-high .paidLessonCardHead h4 {
  font-size: 21px;
  line-height: 1.35;
}

.paidLessonGuidanceBlock-high .paidLessonCardHead small {
  margin-top: 5px;
  font-size: 13px;
  line-height: 1.65;
}

.paidLessonGuidanceBlock-high .paidLessonSummary {
  margin-bottom: 12px !important;
  font-size: 14.5px !important;
  line-height: 1.85 !important;
}

.paidLessonGuidanceBlock-high .paidLessonInsightGrid {
  gap: 10px;
}

.paidLessonGuidanceBlock-high .paidLessonMiniBox {
  border-radius: 15px;
  padding: 12px 14px;
}

.paidLessonGuidanceBlock-high .paidLessonMiniBox strong,
.paidLessonGuidanceBlock-high .paidLessonExamples strong {
  font-size: 12.5px;
}

.paidLessonGuidanceBlock-high .paidLessonMiniBox p {
  font-size: 13px !important;
  line-height: 1.75 !important;
}

.paidLessonGuidanceBlock-high .paidLessonExamples {
  margin-top: 12px;
}

.paidLessonGuidanceBlock-high .paidLessonExamples li {
  padding: 6px 9px;
  font-size: 12px;
}

@media (max-width: 980px) {
  .paidLessonGuidanceBlock-high .paidLessonCard { grid-template-columns: 1fr; }
  .paidLessonGuidanceBlock-high .paidLessonPriorityRail { flex-direction: row; justify-content: flex-start; align-items: center; padding: 14px 18px; text-align: left; }
  .paidLessonGuidanceBlock-high .paidLessonPriorityRail span { font-size: 30px; }
}


/* v359: keep the LP scrollable while hiding the browser's visible scrollbar. */
html.lpScrollbarHidden,
body.lpScrollbarHidden {
  scrollbar-width: none;
  -ms-overflow-style: none;
}

html.lpScrollbarHidden::-webkit-scrollbar,
body.lpScrollbarHidden::-webkit-scrollbar {
  display: none;
  width: 0;
  height: 0;
}

/* v360: match the typography of "測定を始める前に①" to the consent page without changing any copy. */
.soundPrepCardV236 h2 {
  margin: 0 0 14px;
  color: #20301f;
  font-family: inherit;
  font-size: clamp(24px, 4vw, 34px);
  font-weight: 700;
  line-height: normal;
  letter-spacing: normal;
}

.soundPrepLeadV236 {
  color: var(--muted);
  font-family: inherit;
  font-size: 16px;
  font-weight: 400;
  line-height: 1.75;
}

.soundPrepItemV236 p {
  color: var(--muted);
  font-family: inherit;
  font-size: 16px;
  font-weight: 400;
  line-height: 1.75;
}

.soundPrepItemV236 strong {
  color: var(--text);
  font-weight: 700;
}

@media (max-width: 760px) {
  .soundPrepCardV236 h2 {
    font-size: clamp(24px, 8vw, 34px);
    margin-bottom: 14px;
  }

  .soundPrepLeadV236,
  .soundPrepItemV236 p {
    font-size: 14px;
    line-height: 1.75;
  }
}

/* v361: match the typography of "測定を始める前に②" to the consent page and step ① without changing any copy. */
.soundCalibrationCardV240 h2 {
  margin: 0 0 14px;
  color: #20301f;
  font-family: inherit;
  font-size: clamp(24px, 4vw, 34px);
  font-weight: 700;
  line-height: normal;
  letter-spacing: normal;
}

.soundCalibrationLeadV240,
.soundCalibrationTextV240 {
  color: var(--muted);
  font-family: inherit;
  font-size: 16px;
  font-weight: 400;
  line-height: 1.75;
}

@media (max-width: 760px) {
  .soundCalibrationCardV240 h2 {
    font-size: clamp(24px, 8vw, 34px);
    margin-bottom: 14px;
  }

  .soundCalibrationLeadV240,
  .soundCalibrationTextV240 {
    font-size: 14px;
    line-height: 1.75;
  }
}


/* v362: simplify all four core-completion pages and remove the progress-bar presentation. */
.coreCompleteCard {
  max-width: 1180px;
  margin: 0 auto;
  padding: clamp(26px, 4vw, 46px) clamp(28px, 5vw, 58px);
  border: 1px solid rgba(199, 218, 189, 0.92);
  border-radius: 32px;
  background: linear-gradient(180deg, rgba(255, 254, 248, 0.96), rgba(250, 251, 245, 0.97));
  box-shadow: 0 22px 60px rgba(42, 72, 48, 0.10);
}

.coreCompleteCard .completePanel {
  min-height: 0;
  display: block;
  padding: 0;
  border: 0;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
  text-align: left;
  color: #1f3528;
  overflow: visible;
}

.coreCompleteCard .completePanel::before,
.coreCompleteCard .completePanel::after {
  display: none;
}

.coreCompleteCard .completePanel h2 {
  margin: 0 0 22px;
  color: #20301f;
  font-family: inherit;
  font-size: clamp(28px, 4vw, 38px);
  font-weight: 700;
  line-height: 1.3;
  letter-spacing: normal;
}

.coreCompleteCard .completePanelCopyV329 {
  display: grid;
  gap: 10px;
  color: #526453;
  font-family: inherit;
  font-size: clamp(16px, 1.5vw, 19px);
  font-weight: 400;
  line-height: 1.8;
}

.coreCompleteCard .completePanelCopyV329 p {
  margin: 0;
}

.coreCompleteCard .completeActions {
  margin-top: 34px;
  padding-top: 22px;
  border-top: 1px solid #e1eadb;
  justify-content: flex-end;
}

@media (max-width: 720px) {
  .coreCompleteCard {
    padding: 28px 22px;
    border-radius: 24px;
  }

  .coreCompleteCard .completePanel h2 {
    margin-bottom: 16px;
    font-size: clamp(26px, 8vw, 34px);
  }

  .coreCompleteCard .completePanelCopyV329 {
    font-size: 16px;
    line-height: 1.75;
  }

  .coreCompleteCard .completeActions {
    margin-top: 28px;
    justify-content: stretch;
  }

  .coreCompleteCard .completeActions .btn {
    width: 100%;
  }
}

/* v363: blend the four core-completion pages into the same calm visual system as the preparation pages. */
.coreCompleteCard {
  position: relative;
  overflow: hidden;
  max-width: 1180px;
  margin: 0 auto;
  padding: clamp(26px, 4vw, 46px) clamp(28px, 5vw, 58px);
  border: 1px solid rgba(199, 218, 189, 0.92);
  border-radius: 32px;
  background: linear-gradient(180deg, rgba(255, 254, 248, 0.97), rgba(250, 251, 245, 0.98));
  box-shadow: 0 22px 60px rgba(42, 72, 48, 0.10);
}

.coreCompleteCard::before {
  content: "";
  position: absolute;
  right: -90px;
  top: -110px;
  width: 260px;
  height: 260px;
  border-radius: 999px;
  background: radial-gradient(circle, rgba(104, 166, 94, 0.10), transparent 70%);
  pointer-events: none;
}

.coreCompleteCard::after {
  content: "";
  position: absolute;
  left: -120px;
  bottom: -130px;
  width: 280px;
  height: 280px;
  border-radius: 999px;
  background: radial-gradient(circle, rgba(227, 209, 163, 0.08), transparent 72%);
  pointer-events: none;
}

.coreCompleteCard .completePanel,
.coreCompleteCard .completeActions {
  position: relative;
  z-index: 1;
}

.coreCompleteCard .completePanel h2 {
  margin: 0 0 16px;
  color: #20301f;
  font-family: inherit;
  font-size: clamp(24px, 3.2vw, 32px);
  font-weight: 700;
  line-height: 1.35;
  letter-spacing: normal;
}

.coreCompleteCard .completePanelCopyV329 {
  gap: 8px;
  color: var(--muted);
  font-family: inherit;
  font-size: 16px;
  font-weight: 400;
  line-height: 1.75;
}

.coreCompleteCard .completeActions {
  margin-top: 30px;
  padding-top: 20px;
  border-top: 1px solid #e1eadb;
}

@media (max-width: 720px) {
  .coreCompleteCard {
    padding: 28px 22px;
    border-radius: 24px;
  }

  .coreCompleteCard .completePanel h2 {
    margin-bottom: 14px;
    font-size: clamp(23px, 7.2vw, 30px);
  }

  .coreCompleteCard .completePanelCopyV329 {
    font-size: 14px;
    line-height: 1.75;
  }
}


/* v365: keep the v364 inner-card design while restoring the larger v362 typography. */
.coreCompleteCard.pitchOnly .completePanel {
  width: min(100%, 860px);
  margin: 0 auto 40px;
  padding: clamp(42px, 5vw, 56px) clamp(44px, 6vw, 68px);
  background: linear-gradient(180deg, rgba(254, 255, 252, 0.99), rgba(250, 253, 248, 0.98));
  border: 1px solid rgba(180, 200, 180, 0.80);
  border-radius: 26px;
  box-shadow: 0 4px 14px rgba(49, 82, 54, 0.04);
  text-align: center;
}

.coreCompleteCard.pitchOnly .completePanel h2 {
  margin: 0 0 24px;
  font-size: clamp(28px, 4vw, 38px);
  line-height: 1.3;
}

.coreCompleteCard.pitchOnly .completePanelCopyV329 {
  gap: 10px;
  font-size: clamp(16px, 1.5vw, 19px);
  line-height: 1.8;
  text-align: center;
}

@media (max-width: 720px) {
  .coreCompleteCard.pitchOnly .completePanel {
    margin-bottom: 28px;
    padding: 34px 24px;
    border-radius: 22px;
  }

  .coreCompleteCard.pitchOnly .completePanel h2 {
    margin-bottom: 18px;
    font-size: clamp(26px, 8vw, 34px);
  }

  .coreCompleteCard.pitchOnly .completePanelCopyV329 {
    font-size: 16px;
    line-height: 1.75;
  }
}

/* v366: restore the pitch completion outer card to the previous compact footprint while keeping v362 typography. */
.coreCompleteCard.pitchOnly {
  max-width: 1180px;
  padding: clamp(26px, 4vw, 46px) clamp(28px, 5vw, 58px);
  border-radius: 32px;
}

.coreCompleteCard.pitchOnly .completePanel {
  width: min(100%, 760px);
  margin: 0 auto 32px;
  padding: clamp(36px, 4.5vw, 46px) clamp(36px, 5vw, 52px);
  border-radius: 24px;
  box-shadow: 0 3px 10px rgba(49, 82, 54, 0.035);
}

.coreCompleteCard.pitchOnly .completePanel h2 {
  margin-bottom: 22px;
  font-size: clamp(28px, 4vw, 38px);
  line-height: 1.3;
}

.coreCompleteCard.pitchOnly .completePanelCopyV329 {
  gap: 10px;
  font-size: clamp(16px, 1.5vw, 19px);
  line-height: 1.8;
}

@media (max-width: 720px) {
  .coreCompleteCard.pitchOnly {
    padding: 28px 22px;
    border-radius: 24px;
  }

  .coreCompleteCard.pitchOnly .completePanel {
    margin-bottom: 26px;
    padding: 30px 20px;
    border-radius: 20px;
  }

  .coreCompleteCard.pitchOnly .completePanel h2 {
    margin-bottom: 18px;
    font-size: clamp(26px, 8vw, 34px);
  }

  .coreCompleteCard.pitchOnly .completePanelCopyV329 {
    font-size: 16px;
    line-height: 1.75;
  }
}

/* v368: simplify the test-flow page to match the measurement-preparation pages without changing any copy. */
.instructionsV258Page {
  position: relative;
  overflow: hidden;
  max-width: 1180px;
  margin: 0 auto;
  padding: clamp(26px, 4vw, 46px) clamp(28px, 5vw, 58px);
  gap: 22px;
  border: 1px solid rgba(199, 218, 189, 0.92);
  border-radius: 32px;
  background: linear-gradient(180deg, rgba(255, 254, 248, 0.96), rgba(250, 251, 245, 0.97));
  box-shadow: 0 22px 60px rgba(42, 72, 48, 0.10);
}

.instructionsV258Page::before {
  content: "";
  position: absolute;
  right: -90px;
  top: -110px;
  width: 260px;
  height: 260px;
  border-radius: 999px;
  background: radial-gradient(circle, rgba(104, 166, 94, 0.10), transparent 70%);
  pointer-events: none;
}

.instructionsV258Page::after {
  content: "";
  position: absolute;
  left: -120px;
  bottom: -130px;
  width: 280px;
  height: 280px;
  border-radius: 999px;
  background: radial-gradient(circle, rgba(227, 209, 163, 0.08), transparent 72%);
  pointer-events: none;
}

.instructionsV258Header,
.instructionsV258FlowCard,
.instructionsV258ContentGrid,
.instructionsV258FooterNote {
  position: relative;
  z-index: 1;
}

.instructionsV258Header {
  gap: 12px;
}

.instructionsV258Header .eyebrow {
  margin: 0;
  color: #20301f;
  font-size: clamp(24px, 4vw, 34px);
  font-weight: 700;
  line-height: normal;
  letter-spacing: normal;
}

.instructionsV258Lead {
  max-width: 980px;
  color: var(--muted);
  font-size: 16px;
  font-weight: 400;
  line-height: 1.75;
}

.instructionsV258FlowCard {
  padding: 24px;
  border: 1px solid rgba(180, 200, 180, 0.80);
  border-radius: 24px;
  background: rgba(253, 255, 251, 0.92);
  box-shadow: 0 3px 10px rgba(49, 82, 54, 0.035);
}

.instructionsV258FlowHeader {
  margin-bottom: 18px;
}

.instructionsV258FlowHeader h3,
.instructionsV258InfoCard h3,
.instructionsV258FooterNote h3 {
  margin: 0 0 8px;
  color: #20301f;
  font-size: 18px;
  font-weight: 700;
  line-height: 1.45;
}

.instructionsV258FlowHeader p,
.instructionsV258InfoCard p,
.instructionsV258FooterNote p {
  color: var(--muted);
  font-size: 15px;
  font-weight: 400;
  line-height: 1.75;
}

.instructionsV258FlowSteps {
  grid-template-columns: 1fr;
  gap: 10px;
}

.instructionsV258FlowArrow {
  display: none;
}

.instructionsV258FlowStep,
.instructionsV258FlowStep.isAnswer {
  grid-template-columns: 38px minmax(0, 1fr);
  column-gap: 14px;
  row-gap: 2px;
  align-items: center;
  padding: 14px 16px;
  border: 1px solid rgba(209, 224, 201, 0.92);
  border-radius: 18px;
  background: rgba(255, 255, 255, 0.76);
  box-shadow: none;
}

.instructionsV258StepNumber {
  grid-row: 1 / span 2;
  width: 34px;
  height: 34px;
  background: #5b9864;
  font-size: 15px;
  font-weight: 700;
}

.instructionsV258FlowStep strong {
  color: #20301f;
  font-size: 16px;
  font-weight: 700;
  line-height: 1.45;
}

.instructionsV258FlowStep p {
  color: var(--muted);
  font-size: 14px;
  font-weight: 400;
  line-height: 1.6;
}

.instructionsV258ContentGrid {
  grid-template-columns: 1fr 1fr;
  gap: 16px;
}

.instructionsV258InfoCard,
.instructionsV260ParentCard,
.instructionsV258AnswerCard {
  padding: 20px;
  border: 1px solid rgba(209, 224, 201, 0.92);
  border-radius: 20px;
  background: rgba(255, 255, 255, 0.72);
  box-shadow: none;
}

.instructionsV258ChoiceRow {
  gap: 8px;
  margin: 14px 0 12px;
}

.instructionsV258Choice {
  min-width: 94px;
  padding: 9px 14px;
  border-color: rgba(190, 211, 184, 0.95);
  background: #f7fbf3;
  color: #29402a;
  font-size: 15px;
  font-weight: 700;
  box-shadow: none;
}

.instructionsV258Choice.isWide {
  min-width: 190px;
}

.instructionsV258FooterNote {
  padding: 20px 0 0;
  border: 0;
  border-top: 1px solid rgba(199, 218, 189, 0.88);
  border-radius: 0;
  background: transparent;
}

.instructionsV258Actions .btn {
  min-width: 124px;
  padding: 14px 24px;
  font-size: 16px;
}

@media (max-width: 860px) {
  .instructionsV258ContentGrid {
    grid-template-columns: 1fr;
  }

  .instructionsV258FooterNote {
    flex-direction: column;
    align-items: stretch;
  }

  .instructionsV258Actions {
    width: 100%;
    justify-content: flex-end;
  }
}

@media (max-width: 720px) {
  .instructionsV258Page {
    padding: 28px 22px;
    gap: 18px;
    border-radius: 24px;
  }

  .instructionsV258Header .eyebrow {
    font-size: clamp(24px, 8vw, 34px);
  }

  .instructionsV258Lead {
    font-size: 14px;
    line-height: 1.75;
  }

  .instructionsV258FlowCard,
  .instructionsV258InfoCard,
  .instructionsV260ParentCard,
  .instructionsV258AnswerCard {
    padding: 18px;
    border-radius: 18px;
  }

  .instructionsV258FlowHeader h3,
  .instructionsV258InfoCard h3,
  .instructionsV258FooterNote h3 {
    font-size: 17px;
  }

  .instructionsV258FlowHeader p,
  .instructionsV258InfoCard p,
  .instructionsV258FooterNote p {
    font-size: 14px;
  }

  .instructionsV258FlowStep {
    padding: 13px 14px;
  }

  .instructionsV258Choice {
    min-width: 88px;
    font-size: 14px;
  }

  .instructionsV258Choice.isWide {
    min-width: 100%;
  }

  .instructionsV258Actions {
    justify-content: stretch;
  }

  .instructionsV258Actions .btn {
    width: 100%;
  }
}

/* v369: restore the larger child-facing typography from the previous test-flow design while preserving the v368 layout. */
.instructionsV258Lead {
  font-size: 20px;
  font-weight: 600;
  line-height: 1.9;
}

.instructionsV258FlowCard {
  padding: 26px;
}

.instructionsV258FlowHeader h3,
.instructionsV258AnswerCard h3,
.instructionsV258FooterNote h3 {
  font-size: 21px;
  line-height: 1.35;
}

.instructionsV258FlowHeader p,
.instructionsV258AnswerCard p,
.instructionsV258FooterNote p {
  font-size: 18px;
  font-weight: 600;
  line-height: 1.9;
}

.instructionsV258FlowSteps {
  gap: 12px;
}

.instructionsV258FlowStep,
.instructionsV258FlowStep.isAnswer {
  padding: 16px 18px;
  column-gap: 16px;
}

.instructionsV258FlowStep strong {
  font-size: 20px;
  line-height: 1.45;
}

.instructionsV258FlowStep p {
  font-size: 16px;
  font-weight: 600;
  line-height: 1.8;
}

.instructionsV258AnswerCard {
  padding: 22px;
}

.instructionsV258ChoiceRow {
  gap: 12px;
  margin: 18px 0 16px;
}

.instructionsV258Choice {
  min-width: 110px;
  padding: 12px 18px;
  font-size: 18px;
  font-weight: 800;
}

.instructionsV258Choice.isWide {
  min-width: 220px;
}

.instructionsV258FooterNote {
  padding-top: 22px;
}

/* Keep the parent-only guidance compact. */
.instructionsV260ParentCard h3 {
  font-size: 18px;
  line-height: 1.45;
}

.instructionsV260ParentCard p {
  font-size: 15px;
  font-weight: 400;
  line-height: 1.75;
}

@media (max-width: 720px) {
  .instructionsV258Lead,
  .instructionsV258FlowHeader p,
  .instructionsV258AnswerCard p,
  .instructionsV258FooterNote p {
    font-size: 16px;
    line-height: 1.85;
  }

  .instructionsV258FlowHeader h3,
  .instructionsV258AnswerCard h3,
  .instructionsV258FooterNote h3 {
    font-size: 20px;
  }

  .instructionsV258FlowStep {
    padding: 15px 16px;
  }

  .instructionsV258FlowStep strong {
    font-size: 18px;
  }

  .instructionsV258FlowStep p {
    font-size: 16px;
    line-height: 1.8;
  }

  .instructionsV258Choice {
    min-width: 96px;
    font-size: 16px;
  }

  .instructionsV258Choice.isWide {
    min-width: 100%;
  }

  .instructionsV260ParentCard h3 {
    font-size: 17px;
  }

  .instructionsV260ParentCard p {
    font-size: 14px;
    line-height: 1.75;
  }
}

/* v377 scalable admin console */
.adminApp { width: min(1500px, 100%); }
.adminHeader { margin-bottom: 18px; padding: 8px 6px; }
.adminCard { overflow: hidden; }
.adminNav { margin-top: 0; margin-bottom: 26px; }
.adminKpiGrid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 12px; margin: 22px 0; }
.adminKpi { min-height: 126px; padding: 18px; border: 1px solid var(--line); border-radius: 20px; background: rgba(92,166,107,.055); display: flex; flex-direction: column; justify-content: space-between; gap: 12px; }
.adminKpi span { color: var(--muted); font-weight: 750; }
.adminKpi strong { font-size: clamp(24px, 3vw, 36px); line-height: 1.1; }
.adminKpi .dateValue, .dateValue { font-size: 17px; line-height: 1.5; }
.adminHint { border: 1px solid #f0d899; background: #fff9e7; color: #705921; border-radius: 14px; padding: 12px 14px; }
.adminSectionHeading { margin: 34px 0 14px; display: flex; justify-content: space-between; align-items: flex-end; gap: 18px; }
.adminSectionHeading h2 { margin-bottom: 2px; }
.textLink { color: #397d48; font-weight: 850; text-decoration: none; white-space: nowrap; }
.textLink:hover { text-decoration: underline; }
.coreOverviewGrid, .scoreDetailGrid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 12px; }
.coreOverview, .scoreDetailCard { border: 1px solid var(--line); border-radius: 18px; background: rgba(255,255,255,.72); padding: 16px; }
.coreOverviewTop, .scoreDetailTop { display: flex; align-items: center; justify-content: space-between; gap: 10px; }
.coreOverviewTop span, .scoreDetailTop > strong { font-size: 32px; font-weight: 900; }
.coreOverview p { color: var(--muted); font-size: 13px; margin-bottom: 0; }
.adminBar { height: 10px; margin-top: 12px; border-radius: 999px; background: #e7efe0; overflow: hidden; }
.adminBar span { display: block; height: 100%; background: linear-gradient(90deg, var(--accent), var(--accent2)); }
.adminTableWrap { width: 100%; overflow-x: auto; border: 1px solid var(--line); border-radius: 18px; background: rgba(255,255,255,.62); }
.adminTable { width: 100%; border-collapse: collapse; min-width: 760px; }
.adminTable th, .adminTable td { padding: 13px 14px; border-bottom: 1px solid var(--line); text-align: left; vertical-align: top; }
.adminTable th { background: #f0f6eb; color: #41563b; font-size: 13px; white-space: nowrap; position: sticky; top: 0; z-index: 1; }
.adminTable tbody tr:hover { background: rgba(92,166,107,.055); }
.adminTable tbody tr:last-child td { border-bottom: 0; }
.tag { display: inline-flex; align-items: center; width: fit-content; padding: 5px 9px; border-radius: 999px; border: 1px solid var(--line); font-size: 12px; font-weight: 850; margin-left: 6px; white-space: nowrap; }
.doneTag { background: #e9f7eb; border-color: #b9dfc0; color: #347342; }
.dropTag { background: #fff2e8; border-color: #efc9aa; color: #8a4e21; }
.testTag { background: #eef1ff; border-color: #cbd1f5; color: #4d56a3; }
.filterPanel { margin: 24px 0 14px; padding: 16px; border: 1px solid var(--line); border-radius: 18px; background: rgba(92,166,107,.045); }
.searchForm { display: grid; grid-template-columns: 1fr auto; gap: 10px; margin-bottom: 14px; }
.filterGrid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 10px; }
.filterGrid label { font-size: 13px; font-weight: 800; color: var(--muted); }
.filterGrid .input { margin-top: 6px; background: #fff; }
.listMeta { display: flex; justify-content: space-between; align-items: center; gap: 12px; margin: 14px 0; color: var(--muted); }
.wideTable { overflow-x: auto; }
.sessionsTable { min-width: 1420px; }
.logsTable { min-width: 1700px; }
.sessionId, .accuracyMini { display: block; margin-top: 4px; color: var(--muted); font-size: 12px; font-weight: 500; }
.scoreCell { font-size: 20px; font-weight: 900; }
.pagination { display: flex; align-items: center; justify-content: center; gap: 16px; margin-top: 20px; }
.sessionFullId { font-family: ui-monospace, SFMono-Regular, Menlo, monospace; color: var(--muted); overflow-wrap: anywhere; }
.detailHero { display: flex; justify-content: space-between; align-items: center; gap: 22px; margin: 24px 0; padding: 22px; border-radius: 22px; background: linear-gradient(135deg, rgba(92,166,107,.12), rgba(226,168,75,.10)); border: 1px solid var(--line); }
.detailHero h2 { margin: 12px 0 4px; }
.detailHero p { margin: 0; color: var(--muted); }
.detailHeroScore { font-size: clamp(44px, 7vw, 72px); font-weight: 950; line-height: 1; }
.detailHeroScore span { font-size: 16px; color: var(--muted); }
.detailKpis { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.scoreDetailTop h3 { margin: 2px 0 0; }
.scoreDetailCard dl { display: grid; gap: 8px; margin: 16px 0 0; }
.scoreDetailCard dl div { display: flex; justify-content: space-between; gap: 10px; border-top: 1px solid var(--line); padding-top: 8px; }
.scoreDetailCard dt { color: var(--muted); }
.scoreDetailCard dd { margin: 0; font-weight: 850; }
.infoGrid { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
.infoGrid > div { border: 1px solid var(--line); border-radius: 18px; padding: 16px; background: rgba(255,255,255,.62); overflow: auto; }
.inlineDetails { margin: 0; padding: 0; border: 0; }
.inlineDetails summary { font-size: 12px; }
.tinyMono { font-size: 11px; max-width: 420px; max-height: 260px; overflow: auto; }
.developerData { margin-top: 34px; padding: 18px; border: 1px dashed #aabca2; border-radius: 18px; background: #f9fbf5; }
.developerData pre { max-height: 520px; overflow: auto; }
@media (max-width: 980px) {
  .adminKpiGrid, .detailKpis, .coreOverviewGrid, .scoreDetailGrid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .filterGrid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 620px) {
  .adminKpiGrid, .detailKpis, .coreOverviewGrid, .scoreDetailGrid, .filterGrid, .infoGrid { grid-template-columns: 1fr; }
  .searchForm { grid-template-columns: 1fr; }
  .adminSectionHeading, .detailHero { align-items: flex-start; flex-direction: column; }
  .adminKpi { min-height: 100px; }
}

/* v378 environment capture */
.environmentCheckV378{margin:24px 0;padding:18px;border:1px solid #dce8df;border-radius:16px;background:#f7fbf8;display:grid;gap:14px}.environmentCheckV378 label{display:grid;gap:8px;font-weight:700}


/* v379 measurement analysis and expandable core details */
.adminTitleRow{display:flex;align-items:flex-start;justify-content:space-between;gap:20px;margin-bottom:20px}.adminToggle{display:flex;align-items:center;gap:9px;padding:11px 14px;border:1px solid var(--line);border-radius:14px;background:#fff;font-weight:800;white-space:nowrap}.analysisGrid{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin-top:30px}.analysisPanel{border:1px solid var(--line);border-radius:20px;background:rgba(255,255,255,.68);padding:18px}.analysisPanel h2{margin-top:0}.analysisBarRow{display:grid;grid-template-columns:minmax(90px,1fr) 2fr auto;align-items:center;gap:10px;margin:12px 0;font-size:13px}.analysisBarRow>div{height:12px;background:#e8efe3;border-radius:999px;overflow:hidden}.analysisBarRow i{display:block;height:100%;min-width:2px;background:linear-gradient(90deg,var(--accent),var(--accent2));border-radius:inherit}.analysisBarRow strong{min-width:32px;text-align:right}.coreDetailCardV379{padding:0;overflow:hidden}.coreDetailCardV379>.scoreDetailTop,.coreDetailCardV379>.coreQuickFactsV379,.coreDetailCardV379>.adminBar{margin-left:16px;margin-right:16px}.coreDetailCardV379>.scoreDetailTop{margin-top:16px}.coreQuickFactsV379{display:grid;gap:7px;margin-top:14px;font-size:13px;color:var(--muted)}.coreQuickFactsV379 span{display:flex;justify-content:space-between;gap:10px}.coreQuickFactsV379 strong,.coreQuickFactsV379 b{color:var(--ink)}.adjustmentApplied{color:#8a4e21!important}.adjustmentNone{color:#347342!important}.coreDisclosureV379{margin-top:16px;border-top:1px solid var(--line)}.coreDisclosureV379 summary{cursor:pointer;padding:14px 16px;font-weight:900;color:#397d48;background:#f5f9f2;list-style-position:inside}.coreDetailSectionsV379{display:grid;gap:12px;padding:14px}.coreDetailSectionsV379 section{border:1px solid var(--line);border-radius:14px;padding:13px;background:#fff}.coreDetailSectionsV379 h4{margin:0 0 10px}.coreDetailSectionsV379 dl{margin:0}.coreDetailSectionsV379 dl div{align-items:flex-start}.coreDetailSectionsV379 dd{text-align:right;overflow-wrap:anywhere}.scoreDetailGrid{align-items:start}
@media(max-width:760px){.analysisGrid{grid-template-columns:1fr}.adminTitleRow{flex-direction:column}.adminToggle{white-space:normal}.analysisBarRow{grid-template-columns:90px 1fr auto}}

.adminHeaderWithInfo{display:inline-flex;align-items:center;gap:5px;white-space:nowrap}.adminInfoTip{position:relative;display:inline-block}.adminInfoTip summary{display:grid;place-items:center;width:15px;height:15px;border:1px solid currentColor;border-radius:50%;font-size:10px;font-weight:800;cursor:pointer;list-style:none;opacity:.7}.adminInfoTip summary::-webkit-details-marker{display:none}.adminInfoTip>div{position:absolute;z-index:30;top:22px;left:0;width:300px;max-width:70vw;padding:12px;border:1px solid #d8ded9;border-radius:10px;background:#fff;box-shadow:0 12px 30px rgba(20,40,30,.16);font-size:12px;line-height:1.7;text-align:left;font-weight:400;white-space:normal}.patternTags{display:flex;flex-wrap:wrap;gap:4px}.detailHeroScore small{display:block;font-size:12px;font-weight:600}.inlineButton{border:0;background:none;margin-left:8px;cursor:pointer;padding:0}
.adminDashboardToolbar{display:flex;align-items:flex-end;justify-content:space-between;gap:16px;margin:18px 0}.adminDashboardToolbar label{display:grid;gap:7px;min-width:260px}.adminDashboardToolbar label span{font-size:13px;font-weight:800}.adminKpi small{display:block;margin-top:6px;font-size:11px;font-weight:600;opacity:.7}@media(max-width:700px){.adminDashboardToolbar{align-items:stretch;flex-direction:column}.adminDashboardToolbar label{min-width:0}}

/* V388 admin analytics */
.adminDashboardToolbarV388{flex-wrap:wrap;align-items:flex-end}.adminDashboardToolbarV388 label{min-width:180px}.testStatusButton{border:1px solid var(--line);background:rgba(255,255,255,.78);border-radius:12px;padding:11px 14px;font-weight:800;cursor:pointer}.testStatusPanel{border:1px solid var(--line);border-radius:16px;padding:14px 16px;background:rgba(255,255,255,.72);margin:10px 0 18px}.testReasonChip{display:inline-block;margin:6px 6px 0 0;padding:5px 9px;border-radius:999px;background:rgba(36,104,76,.09)}.adminRangeLabel{margin:14px 0 0}.adminAnalyticsSection{margin:34px 0}.chartPanel{border:1px solid var(--line);border-radius:18px;padding:16px;margin:14px 0;background:rgba(255,255,255,.62)}.chartPanel h3{margin:0 0 10px}.chartToggles{display:flex;flex-wrap:wrap;gap:8px;margin:8px 0 14px}.chartToggles button{border:1px solid var(--line);background:white;border-radius:999px;padding:7px 11px;font-weight:750;cursor:pointer}.chartToggles button.active{background:#176b4d;color:white;border-color:#176b4d}.chartToggles button:disabled{opacity:.45;cursor:not-allowed}.adminChartWrap{width:100%;overflow-x:auto}.adminChartWrap svg{width:100%;min-width:680px;height:auto}.chartGrid{stroke:rgba(42,67,55,.14);stroke-width:1}.chartAxis{font-size:11px;fill:#58655e}.funnelGrid{display:grid;gap:9px}.funnelStage{border:1px solid var(--line);border-radius:16px;padding:14px 16px;background:rgba(255,255,255,.66)}.funnelStageTop{display:flex;justify-content:space-between;gap:12px;font-size:16px}.funnelStageTop span{font-size:20px;font-weight:850;color:#176b4d}.funnelMetrics{display:flex;gap:18px;flex-wrap:wrap;margin-top:8px;font-size:12px;color:#56635c}.ageStatsControls{display:flex;justify-content:space-between;gap:16px;flex-wrap:wrap}.ageStatsTable{min-width:1280px}.warnTag{background:#fff3cf;color:#795a00}.ageStatsSection .adminTableWrap{margin-top:8px}@media(max-width:700px){.adminDashboardToolbarV388 label{min-width:0;width:100%}.testStatusButton{width:100%}.funnelMetrics{gap:8px}.ageStatsControls{display:block}}
.versionBars{display:grid;gap:10px;margin:18px 0}.versionBarRow{display:grid;grid-template-columns:110px 1fr 90px;align-items:center;gap:12px}.versionBarTrack{height:18px;background:#e7eee9;border-radius:999px;overflow:hidden}.versionBarFill{height:100%;background:#176b4d;border-radius:999px}

.adminAlertStack{margin:18px 0;padding:16px;border:1px solid #e3b6ae;border-radius:16px;background:#fff8f6}.adminAlertStack h2{margin-top:0}.adminAlert{margin:8px 0;padding:10px 12px;border-radius:12px;background:white}.adminAlert.critical{border-left:5px solid #a72f2f}.adminAlert.warning{border-left:5px solid #b7791f}.adminAlert.notice{border-left:5px solid #4b708c}.adminAlert summary{cursor:pointer}.systemHealth{margin:18px 0;padding:16px;border:1px solid #d9e4df;border-radius:16px;background:#f8fbfa}.healthGrid{display:grid;grid-template-columns:repeat(auto-fit,minmax(190px,1fr));gap:10px}.healthGrid span{display:flex;flex-direction:column;padding:10px;background:white;border-radius:10px;font-size:12px}.healthGrid strong{margin-top:5px;font-size:14px;overflow-wrap:anywhere}.adminKpiButton{border:0;text-align:left;cursor:pointer}.scoreDistribution{display:flex;align-items:flex-end;gap:10px;min-height:240px;padding:20px;overflow:auto}.scoreBin{min-width:65px;text-align:center}.scoreBin>div{background:#2f765c;border-radius:6px 6px 0 0}.scoreBin span,.scoreBin strong{display:block;font-size:11px}.recommendationPanel{margin:24px 0;padding:18px;border:1px solid #d8caa4;border-radius:16px;background:#fffdf6}.recommendationCard{background:white;border-radius:12px;padding:14px;margin:10px 0}.severity{display:inline-block;padding:3px 8px;border-radius:999px;font-size:12px;background:#eee}.severity.high{background:#ffe4e0}.severity.medium{background:#fff0c9}

/* V393 admin three-category information architecture */
.adminCategoryNav{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;margin-bottom:14px}.adminCategoryTab{display:flex;flex-direction:column;gap:5px;padding:18px;border:1px solid rgba(30,93,70,.18);border-radius:18px;background:#f7fbf8;color:inherit;text-decoration:none;transition:.18s}.adminCategoryTab:hover{transform:translateY(-1px);border-color:#4f8b70}.adminCategoryTab.active{background:#e7f4ed;border-color:#176b4d;box-shadow:inset 0 0 0 1px #176b4d}.adminCategoryTab strong{font-size:1.05rem}.adminCategoryTab span{font-size:.8rem;opacity:.72}.adminSubNav{display:flex;flex-wrap:wrap;gap:8px;margin:0 0 24px}.adminSubNav .active{background:#176b4d;color:#fff;border-color:#176b4d}.adminPageIntro{display:flex;align-items:center;gap:14px;padding:18px 20px;margin-bottom:22px;border-radius:18px;background:linear-gradient(135deg,#f4faf6,#eef5f2)}.adminPageIntro h2{margin:0}.adminPageIntro p{margin:4px 0 0}.adminPageIntro .btn{margin-left:auto}.adminPageNumber{display:grid;place-items:center;width:42px;height:42px;border-radius:50%;background:#176b4d;color:#fff;font-weight:800;font-size:1.1rem}.adminLinkGrid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px;margin:20px 0}.adminLinkGrid a{display:flex;flex-direction:column;gap:8px;padding:22px;border:1px solid rgba(30,93,70,.18);border-radius:18px;background:#fff;color:inherit;text-decoration:none}.adminLinkGrid a:hover{border-color:#176b4d;background:#f7fbf8}.adminLinkGrid span{font-size:.86rem;opacity:.72}@media(max-width:760px){.adminCategoryNav{grid-template-columns:1fr}.adminLinkGrid{grid-template-columns:1fr}.adminPageIntro{align-items:flex-start}.adminPageIntro .btn{margin-left:0}}
.versionCategoryTabs button{font:inherit;text-align:left;cursor:pointer}.versionCategoryTabs button:not(.active){color:inherit}

/* V394 operations dashboard visual hierarchy */
.operationsHealth{padding:0;overflow:hidden;background:#fbfdfb}.operationsHealth.isHealthy{border-color:#bcd8c6}.operationsHealth.hasIssue{border-color:#e3b183}.operationsHealthSummary{display:flex;align-items:center;justify-content:space-between;gap:18px;padding:18px 20px}.operationsHealthSummary>div:first-child{display:flex;align-items:center;gap:13px}.operationsHealthSummary strong{display:block;font-size:17px}.operationsHealthSummary p{margin:5px 0 0}.operationsHealthDot{width:12px;height:12px;border-radius:50%;background:#3e9b65;box-shadow:0 0 0 6px rgba(62,155,101,.12);flex:0 0 auto}.operationsHealth.hasIssue .operationsHealthDot{background:#d47a29;box-shadow:0 0 0 6px rgba(212,122,41,.13)}.operationsHealthActions{display:flex;gap:8px;flex-wrap:wrap}.operationsHealthDetails{padding:0 18px 18px;border-top:1px solid var(--line);padding-top:16px}
.operationsNeeds{margin:26px 0}.operationsNeedGrid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px}.operationsNeedGrid a,.operationsNeedGrid button{display:flex;align-items:center;justify-content:space-between;gap:12px;min-height:76px;padding:15px 16px;border:1px solid var(--line);border-radius:16px;background:#fff;text-decoration:none;color:var(--text);font:inherit;text-align:left;cursor:pointer}.operationsNeedGrid span{font-size:13px;color:var(--muted);font-weight:750}.operationsNeedGrid strong{font-size:24px}.operationsNeedGrid a:hover,.operationsNeedGrid button:hover{border-color:#79ab8e;box-shadow:0 8px 20px rgba(43,93,65,.08)}
.operationsKpiSection{margin:34px 0}.operationsKpiGroups{display:grid;gap:16px}.operationsKpiGroup{padding:19px;border:1px solid var(--line);border-radius:22px;background:linear-gradient(145deg,rgba(255,255,255,.9),rgba(242,248,243,.78))}.operationsKpiGroupTitle{display:flex;align-items:center;gap:12px;margin-bottom:15px}.operationsKpiGroupTitle>span{display:grid;place-items:center;width:36px;height:36px;border-radius:12px;background:#e4f1e8;color:#276544;font-size:12px;font-weight:900}.operationsKpiGroupTitle h3{margin:0;font-size:18px}.operationsKpiGroupTitle p{margin:3px 0 0;color:var(--muted);font-size:12px}.operationsMetricGrid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px}.operationsMetric{min-height:94px;padding:14px 15px;border-radius:16px;border:1px solid rgba(76,114,88,.13);background:#fff;display:flex;flex-direction:column;justify-content:space-between;gap:8px}.operationsMetric.primary{background:#edf7f0;border-color:#c5dfcd}.operationsMetric span{font-size:12px;color:var(--muted);font-weight:800}.operationsMetric strong{font-size:clamp(23px,2.7vw,32px);line-height:1.05}.operationsMetric small{font-size:10px;color:var(--muted)}
.operationsSegmented{display:inline-flex;gap:4px;padding:4px;border:1px solid var(--line);border-radius:14px;background:#f5f8f5;flex-wrap:wrap}.operationsSegmented button{border:0;border-radius:10px;background:transparent;padding:8px 12px;color:var(--muted);font-weight:800;cursor:pointer}.operationsSegmented button.active{background:#fff;color:#1f6542;box-shadow:0 2px 8px rgba(38,75,51,.12)}.operationsBehaviorSection,.operationsTrendSection,.operationsRecentSection{padding:20px;border:1px solid var(--line);border-radius:22px;background:rgba(255,255,255,.72)}.operationsConversionSummary{display:grid;grid-template-columns:repeat(3,minmax(0,1fr)) auto;gap:10px;margin:16px 0}.operationsConversionSummary>div{padding:15px;border:1px solid var(--line);border-radius:16px;background:#fff;display:grid;gap:6px}.operationsConversionSummary span{font-size:12px;color:var(--muted);font-weight:800}.operationsConversionSummary strong{font-size:28px}.operationsConversionSummary small{font-size:10px;color:var(--muted)}.operationsConversionSummary>a{display:flex;align-items:center;justify-content:center;padding:14px;text-decoration:none;border:1px solid var(--line);border-radius:16px;background:#eff7f1;color:#286548;font-weight:850}.operationsFunnel{margin-top:14px}.adminSectionHeading.compact{margin:14px 0 10px}.operationsPurchaseLink{display:flex;align-items:center;justify-content:space-between;gap:18px;padding:22px;border:1px solid var(--line);border-radius:18px;background:linear-gradient(135deg,#fff,#f5f9f5)}.operationsPurchaseLink>div{display:flex;align-items:center;gap:14px}.operationsPurchaseLink h3{margin:0 0 5px}.operationsPurchaseLink p{margin:0;color:var(--muted)}.operationsPurchaseIcon{display:grid;place-items:center;width:52px;height:52px;border-radius:17px;background:#e8f2eb;font-size:25px}.operationsRecentSection{margin:34px 0}.operationsRecentSection .adminTableWrap{margin-top:10px}
@media(max-width:920px){.operationsNeedGrid{grid-template-columns:repeat(2,minmax(0,1fr))}.operationsMetricGrid{grid-template-columns:repeat(2,minmax(0,1fr))}.operationsConversionSummary{grid-template-columns:repeat(2,minmax(0,1fr))}.operationsConversionSummary>a{min-height:74px}.operationsHealthSummary{align-items:flex-start;flex-direction:column}.operationsHealthActions{width:100%}}
@media(max-width:620px){.operationsNeedGrid,.operationsMetricGrid,.operationsConversionSummary{grid-template-columns:1fr}.operationsBehaviorSection,.operationsTrendSection,.operationsRecentSection,.operationsKpiGroup{padding:15px}.operationsSegmented{width:100%}.operationsSegmented button{flex:1}.operationsPurchaseLink{align-items:stretch;flex-direction:column}.operationsPurchaseLink .btn{width:100%;text-align:center}.operationsHealthActions .btn{flex:1}}

/* V395 quality dashboard visual hierarchy */
.qualityOverview{display:grid;grid-template-columns:1fr auto;gap:18px;align-items:center;margin:22px 0 28px;padding:22px;border:1px solid var(--line);border-radius:22px;background:linear-gradient(135deg,#fbfdfc,#f3f8f5)}
.qualityOverview.isHealthy{border-color:#bcd8c6}.qualityOverview.hasIssue{border-color:#e4b782;background:linear-gradient(135deg,#fffaf4,#fbf7ef)}
.qualityOverviewMain{display:flex;align-items:center;gap:16px}.qualityStatusIcon{display:grid;place-items:center;width:52px;height:52px;border-radius:16px;background:#e3f1e7;color:#23653f;font-size:24px;font-weight:900;flex:0 0 auto}.qualityOverview.hasIssue .qualityStatusIcon{background:#fff0df;color:#b2641f}.qualityEyebrow{display:block;margin-bottom:4px;color:#557066;font-size:11px;font-weight:900;letter-spacing:.08em;text-transform:uppercase}.qualityOverview h2,.qualityRulePanel h2{margin:0}.qualityOverview p,.qualityRulePanel p{margin:6px 0 0}.qualityOverviewActions{display:flex;gap:8px;flex-wrap:wrap;justify-content:flex-end}.qualityExpanded{grid-column:1/-1;padding-top:18px;border-top:1px solid var(--line)}
.qualityAlertSection,.qualityNeeds,.qualityKpiSection,.qualityDestinationSection{margin:34px 0}.qualityAlertList{display:grid;gap:10px}.qualityAlert{padding:13px 15px;border:1px solid var(--line);border-left-width:5px;border-radius:14px;background:#fff}.qualityAlert.critical{border-left-color:#a72f2f}.qualityAlert.high{border-left-color:#d07a24}.qualityAlert.medium{border-left-color:#d8b13d}.qualityAlert.info{border-left-color:#4c7898}.qualityAlert summary{display:flex;justify-content:space-between;gap:12px;cursor:pointer}.qualityAlert p{margin:10px 0}
.qualityNeedGrid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px}.qualityNeedGrid a{display:grid;grid-template-columns:1fr auto;gap:6px 12px;padding:16px;border:1px solid var(--line);border-radius:17px;background:#fff;color:var(--text);text-decoration:none}.qualityNeedGrid a:hover{border-color:#77a98b;box-shadow:0 8px 20px rgba(43,93,65,.08)}.qualityNeedGrid span{font-size:13px;color:var(--muted);font-weight:850}.qualityNeedGrid strong{font-size:24px}.qualityNeedGrid small{grid-column:1/-1;color:var(--muted);font-size:10px;line-height:1.5}
.qualityKpiGroups{display:grid;gap:16px}.qualityKpiGroup{padding:20px;border:1px solid var(--line);border-radius:22px;background:linear-gradient(145deg,rgba(255,255,255,.94),rgba(244,249,246,.78))}.qualityKpiTitle{display:flex;align-items:center;gap:12px;margin-bottom:15px}.qualityKpiTitle>span{display:grid;place-items:center;width:36px;height:36px;border-radius:12px;background:#e5f0e8;color:#245f40;font-size:12px;font-weight:900}.qualityKpiTitle h3{margin:0;font-size:18px}.qualityKpiTitle p{margin:3px 0 0;color:var(--muted);font-size:12px}.qualityMetricGrid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px}.qualityMetricGrid.compact{grid-template-columns:repeat(3,minmax(0,1fr))}.qualityMetricGrid.compact>div,.qualityMetric{display:flex;flex-direction:column;justify-content:space-between;gap:8px;min-height:90px;padding:14px 15px;border:1px solid rgba(76,114,88,.14);border-radius:15px;background:#fff}.qualityMetric span,.qualityMetricGrid.compact span{font-size:12px;color:var(--muted);font-weight:850}.qualityMetric strong,.qualityMetricGrid.compact strong{font-size:24px;line-height:1.1}.qualityMetric small{font-size:10px;color:var(--muted)}.qualityMetric.good{border-left:4px solid #4b9a68}.qualityMetric.warning{border-left:4px solid #d5ad32}.qualityMetric.exclude{border-left:4px solid #d17a2c}.qualityMetric.unknown{border-left:4px solid #929b96}.qualityMetric.link{color:inherit;text-decoration:none}.qualityMetric.link:hover{border-color:#75a78a;background:#f7fbf8}
.qualityCoreGrid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px}.qualityCoreGrid>div{display:flex;flex-direction:column;gap:6px;padding:15px;border:1px solid var(--line);border-radius:15px;background:#fff}.qualityCoreGrid span{font-size:12px;color:var(--muted);font-weight:850}.qualityCoreGrid strong{font-size:28px}.qualityCoreGrid small{font-size:10px;color:var(--muted)}.qualityInlineLinks{display:flex;gap:10px;flex-wrap:wrap;margin-top:12px}.qualityInlineLinks a{padding:9px 12px;border-radius:12px;background:#edf6f0;color:#296749;text-decoration:none;font-size:12px;font-weight:850}
.qualityDestinationGrid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.qualityDestinationGrid a{display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:14px;padding:18px;border:1px solid var(--line);border-radius:18px;background:#fff;color:var(--text);text-decoration:none}.qualityDestinationGrid a:hover{border-color:#73a488;background:#f8fbf9}.qualityDestinationGrid strong{display:block}.qualityDestinationGrid p{margin:5px 0 0;color:var(--muted);font-size:12px}.qualityDestinationNo{display:grid;place-items:center;width:38px;height:38px;border-radius:12px;background:#e8f2eb;color:#286447;font-size:12px;font-weight:900}.qualityDestinationGrid b{color:#4d7b63;font-size:20px}
.qualityRulePanel{display:flex;align-items:center;justify-content:space-between;gap:18px;margin:34px 0 10px;padding:22px;border:1px solid var(--line);border-radius:22px;background:#f7faf8}
@media(max-width:980px){.qualityNeedGrid,.qualityMetricGrid,.qualityCoreGrid{grid-template-columns:repeat(2,minmax(0,1fr))}.qualityMetricGrid.compact{grid-template-columns:repeat(2,minmax(0,1fr))}.qualityOverview{grid-template-columns:1fr}.qualityOverviewActions{justify-content:flex-start}}
@media(max-width:650px){.qualityNeedGrid,.qualityMetricGrid,.qualityMetricGrid.compact,.qualityCoreGrid,.qualityDestinationGrid{grid-template-columns:1fr}.qualityOverviewMain{align-items:flex-start}.qualityOverviewActions .btn{flex:1}.qualityRulePanel{align-items:stretch;flex-direction:column}.qualityRulePanel .btn{text-align:center}.qualityAlert summary{display:block}}

/* V396 management pages */
.statusBadge{display:inline-flex;padding:.2rem .55rem;border-radius:999px;background:#eef3f0;font-weight:700;margin-bottom:.25rem}.statusBadge.paid,.statusBadge.refunded{background:#e5f5ed;color:#176b4d}.statusBadge.failed,.statusBadge.refund_failed{background:#fdeceb;color:#9b2c2c}.statusBadge.pending{background:#fff4d7;color:#8a5b00}.sampleBadge{display:inline-flex;padding:.15rem .5rem;border-radius:999px;font-size:.78rem;font-weight:700}.sampleBadge.insufficient{background:#f1f1f1;color:#666}.sampleBadge.reference{background:#fff4d7;color:#805a00}.sampleBadge.normal{background:#e5f5ed;color:#176b4d}.adminJson{white-space:pre-wrap;max-width:520px;max-height:320px;overflow:auto;background:#f7f9f8;padding:.8rem;border-radius:10px;font-size:.78rem}.adminDetailGrid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:1rem;margin-top:1rem}.adminPanel{border:1px solid #dce6e1;border-radius:14px;padding:1rem;background:#fff;margin-top:1rem}.adminModalBackdrop{position:fixed;inset:0;background:rgba(12,25,20,.5);display:grid;place-items:center;z-index:1000;padding:1rem}.adminModal{width:min(560px,100%);background:#fff;border-radius:18px;padding:1.25rem;box-shadow:0 24px 80px rgba(0,0,0,.28);display:grid;gap:.8rem}.qualityPreview{margin-top:1rem;padding:1rem;border-radius:12px;background:#f5f8f7}.adminTable small{display:block;color:#66736d;margin-top:.2rem}@media(max-width:900px){.adminDetailGrid{grid-template-columns:1fr}}

/* V397: the three-category navigation already identifies the dashboard, so the redundant page masthead is removed. */
.adminCardFlush{margin-top:0}

/* V398 public account, legal and checkout */
.accountPage,.legalPage,.checkoutStatusPage{min-height:100vh;background:#f5f7f2;color:#203025;padding:48px 20px}.accountHero,.accountPanel,.legalPage,.checkoutStatusCard{max-width:960px;margin:0 auto 24px;background:#fff;border:1px solid #dfe7dd;border-radius:24px;padding:28px;box-shadow:0 12px 34px rgba(34,64,40,.06)}.legalPage h1,.accountHero h1,.checkoutStatusCard h1{font-size:clamp(28px,4vw,44px);margin:8px 0 16px}.legalPage h2{margin-top:30px}.legalPage dl{display:grid;grid-template-columns:minmax(150px,220px) 1fr;gap:0}.legalPage dt,.legalPage dd{padding:14px;border-bottom:1px solid #e7ece5;margin:0}.childProfileGrid{display:grid;grid-template-columns:repeat(auto-fit,minmax(210px,1fr));gap:14px}.childProfileCard{display:flex;flex-direction:column;gap:7px;text-align:left;padding:18px;border:1px solid #d9e4d7;border-radius:18px;background:#fff;color:inherit;text-decoration:none;cursor:pointer}.childProfileCard.active{border-color:#2f6b3f;box-shadow:0 0 0 3px rgba(47,107,63,.12)}.childProfileCard.add{border-style:dashed}.resultHistoryList article{display:flex;justify-content:space-between;gap:20px;padding:18px 0;border-bottom:1px solid #e7ece5}.resultHistoryList article>div{display:flex;flex-direction:column;gap:5px}.accountResultActions{align-items:flex-end}.accountResultActions a,.paidTermsLink{color:#245f36}.checkoutStatusCard{text-align:center;max-width:680px;margin-top:10vh}.paidPriceBox{display:flex;flex-direction:column;align-items:center;gap:4px;margin:22px 0;padding:18px;border-radius:18px;background:#f1f7ef}.paidPriceBox strong{font-size:32px}.paidPriceBox del{color:#67756a}.paidPriceBox small{color:#5d6a60}.paidTermsLink{display:block;text-align:center;margin-top:12px;font-size:13px}@media(max-width:640px){.legalPage dl{grid-template-columns:1fr}.legalPage dt{font-weight:700;padding-bottom:4px}.legalPage dd{padding-top:4px}.resultHistoryList article{flex-direction:column}.accountResultActions{align-items:flex-start}}

/* V404: LP legal footer and detailed SCTA page */
.lpLegalFooter{margin-top:72px;padding:28px clamp(20px,5vw,72px);background:#243629;color:#eef5ee;display:grid;grid-template-columns:minmax(180px,1fr) auto;align-items:center;gap:20px 32px}.lpLegalFooterBrand{display:flex;align-items:center;gap:10px}.lpLegalFooterBrand .brand-mark{width:34px;height:34px}.lpLegalFooterBrand strong{font-size:20px;letter-spacing:.03em}.lpLegalFooterBrand>span:last-child{color:#b9c9bb;font-size:13px}.lpLegalFooterLinks{display:flex;justify-content:flex-end;flex-wrap:wrap;gap:0}.lpLegalFooterLinks a{color:#eef5ee;text-decoration:none;font-size:13px;line-height:1.4;padding:0 14px;border-right:1px solid rgba(238,245,238,.32)}.lpLegalFooterLinks a:last-child{padding-right:0;border-right:0}.lpLegalFooterLinks a:hover{text-decoration:underline;text-underline-offset:4px}.lpLegalFooter>p{grid-column:1/-1;margin:0;text-align:right;color:#b9c9bb;font-size:12px}.legalPageDetailed{max-width:1040px}.legalEyebrow{margin:0;color:#356448;font-size:13px;font-weight:800;letter-spacing:.14em}.legalIntro{max-width:720px;line-height:1.9;color:#536159}.legalDraftNotice{padding:14px 16px;border:1px solid #dccf9d;border-radius:12px;background:#fffaf0;color:#6a5520;font-weight:700}.legalPageDetailed dl{display:block;margin-top:28px}.legalPageDetailed .legalRow{display:grid;grid-template-columns:minmax(180px,240px) 1fr;border-bottom:1px solid #e3e9e1}.legalPageDetailed .legalRow:first-child{border-top:1px solid #e3e9e1}.legalPageDetailed .legalRow dt,.legalPageDetailed .legalRow dd{border:0}.legalPageDetailed .legalRow dt{font-weight:800;background:#f4f7f2}.legalPageDetailed .legalRow dd{line-height:1.85;white-space:normal}.legalPageDetailed .legalRow dd span{display:block}.legalUpdated{margin-top:28px;color:#69736c;font-size:13px}.legalBackLink{display:inline-flex;margin-top:14px;color:#245f36;font-weight:700;text-underline-offset:4px}@media(max-width:760px){.lpLegalFooter{grid-template-columns:1fr;text-align:center}.lpLegalFooterBrand,.lpLegalFooterLinks{justify-content:center}.lpLegalFooterLinks a{padding:4px 10px}.lpLegalFooter>p{text-align:center}.legalPageDetailed .legalRow{grid-template-columns:1fr}.legalPageDetailed .legalRow dt{padding-bottom:10px}.legalPageDetailed .legalRow dd{padding-top:10px}}

/* V406: restore approved Darwin header controls and refine shared legal navigation */
.publicSiteHeader{
  position:fixed!important;top:0;left:0;right:0;z-index:1200;
  width:100%;max-width:none;margin:0;
  min-height:76px;padding:18px clamp(18px,3vw,48px) 12px;
  display:grid;grid-template-columns:auto minmax(0,1fr) auto;align-items:center;
  gap:clamp(28px,4vw,64px);
  background:rgba(247,243,236,.92);
  border:0;border-bottom:1px solid rgba(52,93,70,.15);
  box-shadow:0 7px 22px rgba(54,74,58,.055);
  backdrop-filter:blur(13px);
}
.darwinLanding>.publicSiteHeader{position:fixed!important}
.publicSiteNav{justify-content:flex-start;gap:26px;min-width:0;overflow:hidden}
.publicSiteActions{justify-self:end}
.darwinLanding{padding-top:76px}
.darwinLanding .hero-section{margin-top:clamp(28px,5vw,64px)}

/* V422: use a fixed gap so adjacent desktop navigation items are evenly spaced. */
@media (min-width:1051px){
  .publicSiteNav{display:flex;align-items:center;justify-content:center;gap:clamp(20px,2vw,32px);width:100%}
}

/* V429: refined Darwin account entry. Authentication behaviour is unchanged. */
.resultLoginOverlay{z-index:6000;padding:24px;background:rgba(22,39,29,.48);backdrop-filter:blur(10px)}
.resultLoginModal{width:min(500px,calc(100vw - 32px));border:1px solid rgba(43,78,55,.16);border-radius:20px;background:#fffdf8;box-shadow:0 32px 92px rgba(16,32,22,.30)}
.resultLoginModal::before{background:linear-gradient(145deg,rgba(228,239,222,.88),rgba(255,253,248,0) 48%),radial-gradient(circle at 90% 6%,rgba(239,219,181,.38),transparent 26%)}
.resultLoginForm{gap:17px;padding:52px clamp(25px,6vw,48px) 40px}
.resultLoginHeading{display:flex;align-items:center;gap:14px;padding-right:30px}
.resultLoginSeal{display:grid;flex:0 0 42px;place-items:center;width:42px;height:42px;border:1px solid rgba(48,94,62,.25);border-radius:50%;color:#245b3a;background:rgba(255,253,248,.74);font-family:Georgia,"Times New Roman",serif;font-size:25px;line-height:1;box-shadow:inset 0 0 0 4px rgba(230,239,225,.72)}
.resultLoginPill{justify-self:start;margin:0 0 5px;padding:0;border:0;border-radius:0;background:transparent;color:#55735b;font-size:10px;font-weight:800;letter-spacing:.15em}
.resultLoginForm h2{text-align:left;font-family:Georgia,"Times New Roman",serif;font-size:clamp(27px,5.5vw,35px);font-weight:500;letter-spacing:-.04em;color:#1b3828}
.resultLoginLead{width:auto;margin:4px 0 7px;text-align:left;color:#5d6d62;font-size:15px;font-weight:500;letter-spacing:0;line-height:1.72}
.resultLoginLabel{margin-top:2px;font-size:13px;color:#365242;font-weight:800;letter-spacing:.02em}
.resultLoginInputWrap{gap:11px;min-height:58px;border:1px solid #c6d2c5;border-radius:12px;background:#fffefa;box-shadow:none}
.resultLoginInputWrap:focus-within{border-color:#326947;box-shadow:0 0 0 4px rgba(50,105,71,.11)}
.resultLoginInputWrap input{font-size:17px;font-weight:500}
.resultLoginSubmit{min-height:56px;margin-top:5px;border-radius:12px;background:#285d3d;box-shadow:0 10px 20px rgba(34,83,53,.18);font-size:16px;letter-spacing:.02em}
.resultLoginSubmit:hover{transform:translateY(-1px);background:#204c32;box-shadow:0 14px 25px rgba(34,83,53,.22)}
.resultLoginMeta{display:flex;align-items:center;gap:9px;color:#718075;font-size:11px;line-height:1.5}
.resultLoginMeta i{display:block;flex:1;height:1px;background:#d7e0d5}
.resultLoginFootnote,.resultLoginMessage{text-align:left;font-size:12px}
.resultLoginFootnote{color:#7a887d}
.resultLoginClose{top:17px;right:17px;width:31px;height:31px;border:1px solid transparent;border-radius:50%;background:transparent;color:#617166;font-size:24px}
.resultLoginClose:hover{border-color:#d7e0d5;background:#f5f8f2;color:#284d37}
.resultLoginCodeBoxes{border:1px solid #c6d2c5;border-radius:12px;box-shadow:none}
@media(max-width:720px){.resultLoginOverlay{padding:14px;align-items:flex-end}.resultLoginForm{padding:42px 22px 30px}.resultLoginHeading{gap:12px}.resultLoginSeal{flex-basis:38px;width:38px;height:38px;font-size:23px}.resultLoginMeta{gap:7px;font-size:10px}}

/* The legal pages use the same approved logo, wordmark and button behavior as the LP. */
.legalSiteShell .publicSiteBrand{display:inline-flex;align-items:center;gap:9px;min-width:188px;color:#173f31;text-decoration:none;white-space:nowrap}
.legalSiteShell .publicSiteBrand .brand-mark{width:49px;height:52px;flex:0 0 49px;display:inline-flex;align-items:center;justify-content:center}
.legalSiteShell .publicSiteBrand .brand-mark-image{display:block;width:49px;height:52px;object-fit:contain}
.legalSiteShell .publicSiteBrand strong{display:block;color:#173f31;font-family:Georgia,"Times New Roman",serif;font-size:43px;font-weight:500;line-height:.92;letter-spacing:-.052em}
.legalSiteShell .publicSiteNav{display:flex;align-items:center;color:#506058;font-size:14px;font-weight:700;white-space:nowrap}
.legalSiteShell .publicSiteNav a{color:inherit;text-decoration:none}
.legalSiteShell .publicSiteNav a:hover{color:#234434}
.legalSiteShell .publicSiteActions{display:inline-flex;align-items:center;justify-content:flex-end;gap:12px;white-space:nowrap}
.legalSiteShell .publicLoginButton,.legalSiteShell .publicMeasureButton{display:inline-flex;align-items:center;justify-content:center;min-height:44px;border-radius:999px;padding:0 20px;font:inherit;font-size:14px;font-weight:700;text-decoration:none;cursor:pointer;transition:transform 120ms ease,box-shadow 120ms ease,filter 120ms ease,background 120ms ease,border-color 120ms ease;will-change:transform}
.legalSiteShell .publicLoginButton{color:#234434;background:transparent;border:1px solid rgba(52,93,70,.18)}
.legalSiteShell .publicMeasureButton{color:#fff;background:#345d46;border:0;box-shadow:0 12px 28px rgba(35,68,52,.22)}
@media(hover:hover) and (pointer:fine){
  .legalSiteShell .publicLoginButton:hover,.legalSiteShell .publicMeasureButton:hover{transform:translateY(2px) scale(.985);box-shadow:0 4px 12px rgba(58,83,60,.12) inset,0 2px 8px rgba(58,83,60,.08)!important;filter:brightness(.97)}
}
.legalSiteShell .publicLoginButton:active,.legalSiteShell .publicMeasureButton:active{transform:translateY(2px) scale(.985);box-shadow:0 4px 12px rgba(58,83,60,.12) inset,0 2px 8px rgba(58,83,60,.08)!important;filter:brightness(.97)}

.legalSiteShell{min-height:100vh;padding-top:76px;color:#23372a;background:radial-gradient(circle at 4% 4%,#edf5e8 0,#f7f3ec 44%,#f3f5ed 100%)}
.legalSiteContent{width:min(940px,calc(100% - 40px));margin:0 auto;padding:76px 0 100px;background:transparent}
.legalSiteContent h1{margin:8px 0 20px;font-size:clamp(31px,5vw,52px);line-height:1.2;letter-spacing:-.045em}
.legalSiteContent h2{margin:46px 0 12px;font-size:clamp(20px,2.6vw,28px);color:#2d5638}
.legalSiteContent>p:not(.legalEyebrow):not(.legalDraftNotice):not(.legalUpdated){max-width:800px;color:#536158;line-height:1.95}
.legalEyebrow{margin:0 0 12px;color:#4b7957;font-size:12px;font-weight:850;letter-spacing:.16em}
.legalIntro{max-width:760px;color:#536158;line-height:1.95}
.legalDraftNotice{display:inline-block;margin:22px 0 12px;padding:10px 0;border:0;background:transparent;color:#806728;font-weight:750}
.simpleLegalList{display:block;margin:34px 0 0}
.simpleLegalRow{display:grid;grid-template-columns:minmax(190px,250px) minmax(0,1fr);gap:34px;padding:26px 0;border-top:1px solid rgba(62,91,68,.18)}
.simpleLegalRow:last-child{border-bottom:1px solid rgba(62,91,68,.18)}
.simpleLegalRow dt{margin:0;padding:0;color:#2f6946;font-weight:850}
.simpleLegalRow dd{margin:0;padding:0;color:#44544a;line-height:1.9}
.simpleLegalRow dd span{display:block}
.legalUpdated{margin-top:32px;color:#748078;font-size:13px}

/* Footer: keep only Darwin Piano at the lower-left, preserving its existing scale and treatment. */
.lpLegalFooterBrand{display:flex;align-items:center;justify-content:flex-start;gap:0}
.lpLegalFooterBrand>span:last-child{color:#b9c9bb;font-size:13px}

@media(max-width:1050px){
  .publicSiteHeader{grid-template-columns:auto 1fr;gap:10px 20px}
  .publicSiteNav{grid-column:1/-1;grid-row:2;justify-content:flex-start;overflow-x:auto;padding:5px 0 1px}
  .publicSiteActions{grid-column:2;grid-row:1;justify-self:end}
  .darwinLanding,.legalSiteShell{padding-top:124px}
}
@media(max-width:900px){
  .legalSiteShell .publicSiteBrand{min-width:170px}
  .legalSiteShell .publicSiteBrand .brand-mark,.legalSiteShell .publicSiteBrand .brand-mark-image{width:45px;height:48px;flex-basis:45px}
  .legalSiteShell .publicSiteBrand strong{font-size:39px}
}
@media(max-width:620px){
  .publicSiteHeader{padding:10px 12px}
  .publicMeasureButton{display:none!important}
  .publicSiteNav{gap:18px}
  .publicSiteNav a{font-size:12px}
  .darwinLanding,.legalSiteShell{padding-top:118px}
  .legalSiteContent{width:min(100% - 28px,940px);padding:52px 0 76px}
  .simpleLegalRow{grid-template-columns:1fr;gap:9px;padding:22px 0}
  .legalSiteShell .publicSiteBrand{min-width:145px}
  .legalSiteShell .publicSiteBrand .brand-mark,.legalSiteShell .publicSiteBrand .brand-mark-image{width:38px;height:41px;flex-basis:38px}
  .legalSiteShell .publicSiteBrand strong{font-size:33px}
  .legalSiteShell .publicLoginButton{min-height:40px;padding:0 15px;font-size:13px}
}

/* V407: match the LP header brand to the legal-page brand and strengthen fixed-header separation. */
.darwinLanding .publicSiteBrand{
  display:inline-flex;align-items:center;gap:9px;min-width:188px;color:#173f31;text-decoration:none;white-space:nowrap;
}
.darwinLanding .publicSiteBrand .brand-mark{
  width:49px;height:52px;flex:0 0 49px;display:inline-flex;align-items:center;justify-content:center;
  border:0;border-radius:0;background:transparent;box-shadow:none;overflow:visible;
}
.darwinLanding .publicSiteBrand .brand-mark::before,
.darwinLanding .publicSiteBrand .brand-mark::after{content:none!important}
.darwinLanding .publicSiteBrand .brand-mark-image{
  position:static;display:block;width:49px;height:52px;object-fit:contain;transform:none;
}
.darwinLanding .publicSiteBrand strong{
  display:block;color:#173f31;font-family:Georgia,"Times New Roman",serif;font-size:43px;font-weight:500;line-height:.92;letter-spacing:-.052em;
}
.publicSiteHeader{
  border-bottom:1px solid rgba(44,73,52,.2)!important;
  box-shadow:0 8px 18px rgba(36,58,42,.12)!important;
  isolation:isolate;
}
.darwinLanding>.publicSiteHeader+.landing-content,
.legalSiteShell>.publicSiteHeader+.legalSiteContent{position:relative;z-index:0}

/* V407: simple Gifted Gaze-inspired legal rows, recolored for Darwin. */
.legalSiteContent{width:min(960px,calc(100% - 40px));padding-top:64px}
.legalSiteContent h1{margin:0 0 34px;color:#23372a;font-size:clamp(32px,4.6vw,50px);font-weight:800;letter-spacing:-.04em}
.giftedGazeStyleLegalList{margin-top:20px}
.giftedGazeStyleLegalList .simpleLegalRow{grid-template-columns:1fr;gap:10px;padding:25px 0;border-top:0;border-bottom:1px solid rgba(58,83,60,.16)}
.giftedGazeStyleLegalList .simpleLegalRow:first-child{border-top:1px solid rgba(58,83,60,.16)}
.giftedGazeStyleLegalList .simpleLegalRow dt{color:#3f8a58;font-size:16px;font-weight:850;line-height:1.5}
.giftedGazeStyleLegalList .simpleLegalRow dd{color:#303b33;font-size:16px;line-height:1.9}
.giftedGazeStyleLegalList .simpleLegalRow dd span+span{margin-top:4px}

@media(max-width:900px){
  .darwinLanding .publicSiteBrand{min-width:170px}
  .darwinLanding .publicSiteBrand .brand-mark,.darwinLanding .publicSiteBrand .brand-mark-image{width:45px;height:48px;flex-basis:45px}
  .darwinLanding .publicSiteBrand strong{font-size:39px}
}
@media(max-width:620px){
  .darwinLanding .publicSiteBrand{min-width:145px}
  .darwinLanding .publicSiteBrand .brand-mark,.darwinLanding .publicSiteBrand .brand-mark-image{width:38px;height:41px;flex-basis:38px}
  .darwinLanding .publicSiteBrand strong{font-size:33px}
  .legalSiteContent{padding-top:46px}
}

/* V408: keep the shared public header visually above page content without changing its color world. */
.publicSiteHeader{
  z-index:5000!important;
  background:#f7f3ec!important;
  border-bottom:1px solid rgba(44,73,52,.24)!important;
  box-shadow:0 8px 18px rgba(36,58,42,.13)!important;
  isolation:isolate;
}
.darwinLanding>.publicSiteHeader+.landing-content,
.legalSiteShell>.publicSiteHeader+.legalSiteContent{
  position:relative;
  z-index:0;
}
.sctaResponsiblePerson{
  margin:28px 0 0;
  color:#303b33;
  font-size:16px;
  line-height:1.9;
}

/* V409: blend the fixed public header and logo into the LP background. */
.publicSiteHeader{
  background:radial-gradient(circle at top left,#fffaf0 0,#f8f0e4 38%,#edf4ea 100%)!important;
  backdrop-filter:none!important;
}
.publicSiteHeader .publicSiteBrand .brand-mark,
.publicSiteHeader .publicSiteBrand .brand-mark-image{
  background:transparent!important;
}
.publicSiteHeader .publicSiteBrand .brand-mark-image{
  mix-blend-mode:multiply;
}

/* V410: use one uniform LP-toned header surface and remove the logo image backdrop. */
.publicSiteHeader{
  background:#fffaf0!important;
}
.publicSiteHeader .publicSiteBrand .brand-mark-image{
  mix-blend-mode:normal!important;
}
/* Keep the shared LP/legal header brand presentation identical on every public page. */
.publicSiteHeader .publicSiteBrand{
  display:inline-flex;align-items:center;gap:9px;min-width:188px;color:#173f31;text-decoration:none;white-space:nowrap;
}
.publicSiteHeader .publicSiteBrand .brand-mark{
  width:49px;height:52px;flex:0 0 49px;display:inline-flex;align-items:center;justify-content:center;
  border:0;border-radius:0;background:transparent!important;box-shadow:none;overflow:visible;
}
.publicSiteHeader .publicSiteBrand .brand-mark::before,
.publicSiteHeader .publicSiteBrand .brand-mark::after{content:none!important}
.publicSiteHeader .publicSiteBrand .brand-mark-image{
  position:static;display:block;width:49px;height:52px;object-fit:contain;transform:none;background:transparent!important;
}
.publicSiteHeader .publicSiteBrand strong{
  display:block;color:#173f31;font-family:Georgia,"Times New Roman",serif;font-size:43px;font-weight:500;line-height:.92;letter-spacing:-.052em;
}
@media(max-width:900px){
  .publicSiteHeader .publicSiteBrand{min-width:170px}
  .publicSiteHeader .publicSiteBrand .brand-mark,.publicSiteHeader .publicSiteBrand .brand-mark-image{width:45px;height:48px;flex-basis:45px}
  .publicSiteHeader .publicSiteBrand strong{font-size:39px}
}
@media(max-width:620px){
  .publicSiteHeader .publicSiteBrand{min-width:145px}
  .publicSiteHeader .publicSiteBrand .brand-mark,.publicSiteHeader .publicSiteBrand .brand-mark-image{width:38px;height:41px;flex-basis:38px}
  .publicSiteHeader .publicSiteBrand strong{font-size:33px}
}

/* V411: readable structure for the Darwin Piano privacy policy only. */
.legalSiteContent h3{margin:30px 0 10px;color:#365f43;font-size:18px;line-height:1.6}
.legalSiteContent ul,.legalSiteContent ol{max-width:820px;margin:12px 0 20px;padding-left:1.45em;color:#46544b;line-height:1.9}
.legalSiteContent li+li{margin-top:5px}
.privacyRetentionList{display:block;max-width:820px;margin:18px 0 24px;border-top:1px solid rgba(58,83,60,.18)}
.privacyRetentionList>div{display:grid;grid-template-columns:minmax(180px,230px) 1fr;border-bottom:1px solid rgba(58,83,60,.18)}
.privacyRetentionList dt,.privacyRetentionList dd{margin:0;padding:14px 12px;line-height:1.75}
.privacyRetentionList dt{color:#365f43;font-weight:800}
.privacyRetentionList dd{color:#46544b}
@media(max-width:640px){.privacyRetentionList>div{grid-template-columns:1fr}.privacyRetentionList dt{padding-bottom:3px}.privacyRetentionList dd{padding-top:3px}}

/* V414: LP contact entry point and Darwin-styled contact form. */
.lpContactButton{
  position:fixed;right:24px;bottom:24px;z-index:4600;display:inline-flex;align-items:center;gap:9px;
  min-height:52px;padding:0 21px;border:1px solid rgba(255,255,255,.58);border-radius:999px;
  background:#285f40;color:#fff;text-decoration:none;font-size:14px;font-weight:800;letter-spacing:.03em;
  box-shadow:0 12px 28px rgba(28,68,44,.26);transition:transform .2s ease,box-shadow .2s ease,background .2s ease;
}
.lpContactButton span{font-size:17px}
.lpContactButton:hover{transform:translateY(-2px);background:#1f5035;box-shadow:0 16px 32px rgba(28,68,44,.3)}
.lpContactButton:focus-visible{outline:3px solid rgba(218,156,73,.5);outline-offset:3px}

.contactPage{min-height:100vh;padding-top:76px;background:radial-gradient(circle at 8% 8%,#fffaf0 0,#f7efe3 42%,#edf4ea 100%);color:#28372d}
.contactHero{width:min(780px,calc(100% - 40px));margin:0 auto;padding:88px 0 38px;text-align:center}
.contactHero .eyebrow{margin:0 0 12px;color:#43805a;font-size:13px;font-weight:850;letter-spacing:.18em}
.contactHero h1{margin:0;color:#20382a;font-family:Georgia,"Times New Roman",serif;font-size:clamp(38px,6vw,58px);font-weight:500;letter-spacing:-.035em}
.contactHero>p:last-child{margin:20px auto 0;color:#607066;font-size:16px;line-height:1.85}
.contactPanel{width:min(760px,calc(100% - 40px));margin:0 auto;padding:0 0 100px}
.contactForm,.contactConfirmation,.contactComplete{padding:46px 52px;border:1px solid rgba(60,91,67,.15);border-radius:28px;background:rgba(255,253,247,.92);box-shadow:0 22px 55px rgba(48,68,51,.11)}
.contactIntro{margin:0 0 32px;color:#657269;font-size:14px;line-height:1.8}
.contactRequired,.contactField b{display:inline-flex;align-items:center;justify-content:center;margin-left:7px;padding:2px 7px;border-radius:999px;background:#e8f1e8;color:#37714c;font-size:11px;font-weight:850;font-style:normal}
.contactField{display:block;margin-top:27px}
.contactField>span{display:block;margin:0 0 10px;color:#304438;font-size:15px;font-weight:800}
.contactField input,.contactField select,.contactField textarea{
  width:100%;box-sizing:border-box;border:1px solid #cbd7cc;border-radius:12px;background:#fffdf8;color:#28372d;
  font:inherit;font-size:16px;line-height:1.6;outline:none;transition:border-color .18s ease,box-shadow .18s ease;
}
.contactField input,.contactField select{height:54px;padding:0 16px}
.contactField textarea{min-height:190px;padding:15px 16px;resize:vertical}
.contactField input:focus,.contactField select:focus,.contactField textarea:focus{border-color:#4e8b61;box-shadow:0 0 0 4px rgba(78,139,97,.12)}
.contactField input::placeholder,.contactField textarea::placeholder{color:#9aa49c}
.contactField small{display:block;margin-top:7px;color:#7d8980;font-size:12px;text-align:right}
.contactHoneypot{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}
.contactPrivacy{margin:32px 0 0;padding:18px 20px;border-radius:12px;background:#f1f4ed;color:#5d6c62;font-size:13px;line-height:1.8}
.contactPrivacy a{margin:0 3px;color:#32714a;font-weight:750}
.contactError{margin:20px 0 0;padding:13px 16px;border-radius:10px;background:#fff0ed;color:#9b3e31;font-size:14px;line-height:1.6}
.contactPrimaryButton,.contactSecondaryButton{
  display:inline-flex;align-items:center;justify-content:center;min-width:190px;height:54px;padding:0 26px;border-radius:999px;
  font:inherit;font-size:15px;font-weight:850;cursor:pointer;text-decoration:none;transition:transform .18s ease,box-shadow .18s ease,opacity .18s ease;
}
.contactPrimaryButton{border:0;background:#2f7048;color:#fff;box-shadow:0 11px 24px rgba(37,93,58,.22)}
.contactPrimaryButton:hover{transform:translateY(-2px);box-shadow:0 14px 28px rgba(37,93,58,.27)}
.contactPrimaryButton:disabled,.contactSecondaryButton:disabled{cursor:wait;opacity:.6;transform:none}
.contactSubmitButton{display:flex;margin:34px auto 0}
.contactSecondaryButton{border:1px solid #b9c7bb;background:transparent;color:#46604f}
.contactButtonRow{display:flex;justify-content:center;gap:14px;margin-top:34px}
.contactConfirmation h2,.contactComplete h2{margin:0;color:#263d2e;font-size:28px}
.contactReview{margin:30px 0 0;border-top:1px solid #d9e1d9}
.contactReview>div{display:grid;grid-template-columns:180px 1fr;border-bottom:1px solid #d9e1d9}
.contactReview dt,.contactReview dd{margin:0;padding:17px 14px;line-height:1.75}
.contactReview dt{color:#3d654a;font-weight:800}
.contactReview dd{color:#3f4d44;overflow-wrap:anywhere}
.contactReviewMessage{white-space:pre-wrap}
.contactComplete{text-align:center}
.contactCompleteMark{display:flex;align-items:center;justify-content:center;width:68px;height:68px;margin:0 auto 22px;border-radius:50%;background:#e6f2e7;color:#2f7048;font-size:32px;font-weight:800}
.contactComplete p{max-width:520px;margin:18px auto 30px;color:#5f6d63;line-height:1.85}

@media(max-width:680px){
  .lpContactButton{right:14px;bottom:14px;min-height:46px;padding:0 16px;font-size:13px}
  .contactHero{padding:58px 0 28px}
  .contactPanel{width:min(100% - 24px,760px);padding-bottom:70px}
  .contactForm,.contactConfirmation,.contactComplete{padding:30px 20px;border-radius:20px}
  .contactReview>div{grid-template-columns:1fr}
  .contactReview dt{padding-bottom:3px}
  .contactReview dd{padding-top:3px}
  .contactButtonRow{flex-direction:column-reverse}
  .contactPrimaryButton,.contactSecondaryButton{width:100%}
}

@media(max-width:1050px){
  .contactPage{padding-top:124px}
}

@media(max-width:620px){
  .contactPage{padding-top:118px}
}

.resultLoginExistingCode,.resultLoginGoogle{width:100%;min-height:48px;border-radius:14px;font:inherit;font-weight:700;cursor:pointer}.resultLoginExistingCode{border:0;background:transparent;color:#415b46;text-decoration:underline;text-underline-offset:4px}.resultLoginGoogle{display:flex;align-items:center;justify-content:center;gap:12px;border:1px solid #d8ded7;background:#fff;color:#202521}.resultLoginGoogle span{display:grid;place-items:center;width:24px;height:24px;border-radius:50%;border:1px solid #d8ded7;font-weight:800}.resultLoginDivider{display:flex;align-items:center;gap:12px;color:#8a918b;font-size:12px}.resultLoginDivider:before,.resultLoginDivider:after{content:"";height:1px;background:#e4e8e3;flex:1}.assessmentProfileGate{min-height:100vh;display:grid;place-items:center;padding:32px 18px;background:#f3f6ef}.assessmentProfileCard{width:min(760px,100%);background:#fff;border:1px solid #dfe7db;border-radius:28px;padding:clamp(24px,5vw,48px);box-shadow:0 24px 70px rgba(55,75,57,.12)}.assessmentProfileCard h1{margin:8px 0 10px;font-size:clamp(28px,4vw,42px)}.assessmentProfileLead{color:#69736b}.assessmentProfileGrid{display:grid;grid-template-columns:repeat(auto-fit,minmax(210px,1fr));gap:14px;margin-top:28px}.assessmentProfileChoice{display:flex;flex-direction:column;align-items:flex-start;gap:7px;padding:20px;border:1px solid #dce5d8;border-radius:18px;background:#fff;color:#253329;text-decoration:none;text-align:left;cursor:pointer}.assessmentProfileChoice:hover{border-color:#73977a;box-shadow:0 8px 24px rgba(78,112,84,.12)}.assessmentProfileChoice strong{font-size:20px}.assessmentProfileChoice span,.assessmentProfileChoice small{color:#6c786e}.assessmentProfileChoice b{margin-top:8px;color:#486c50}.assessmentProfileChoice.add{justify-content:center;min-height:150px;border-style:dashed}.assessmentProfileForm{display:grid;gap:18px;margin-top:28px}.assessmentProfileForm label{display:grid;gap:8px;font-weight:700}.assessmentProfileForm input,.assessmentProfileForm select{width:100%;min-height:50px;border:1px solid #d5ded2;border-radius:12px;padding:0 14px;font:inherit;background:#fff}.assessmentProfileMessage{color:#a33;margin:0}

/* V551: pitch-introduction layout only. Preserve every label and illustration,
   make the three existing step panels square by changing height only, tighten
   the lower panel vertically, and balance the guidance with the two actions. */
.app.forest .pitchCoreIntroV551 {
  padding-top: 28px;
  padding-bottom: 22px;
}
.app.forest .pitchCoreIntroV551 .pitchIntroStepV262 {
  min-height: 0;
  aspect-ratio: 1 / 1;
}
.app.forest .pitchCoreIntroV551 .pitchIntroV261 {
  gap: 12px;
  margin-top: 16px;
  margin-bottom: 4px;
}
.app.forest .pitchCoreIntroV551 .pitchIntroApprovedABoxV545 {
  min-height: 0;
  padding-top: 3px;
  padding-bottom: 3px;
}
.app.forest .pitchCoreIntroV551 .pitchIntroApprovedAVisualV545 {
  height: 50px;
}
.app.forest .pitchCoreIntroV551 .pitchIntroApprovedATitleV545 {
  line-height: 1.08;
}
.app.forest .pitchCoreIntroV551 .pitchIntroApprovedARuleV545 {
  margin-top: -5px;
  line-height: 1.08;
}
.app.forest .pitchCoreIntroV551 .pitchIntroActionsV546 {
  margin-top: 12px;
}
.app.forest .pitchCoreIntroV551 .pitchIntroUnknownV546 {
  font-size: 15px;
  line-height: 1.4;
}

@media (max-width: 720px) {
  .app.forest .pitchCoreIntroV551 {
    padding-top: 18px;
    padding-bottom: 14px;
  }
  .app.forest .pitchCoreIntroV551 .pitchIntroStepV262 {
    min-height: 0;
    aspect-ratio: 1 / 1;
  }
  .app.forest .pitchCoreIntroV551 .pitchIntroV261 {
    gap: 9px;
    margin-top: 12px;
  }
  .app.forest .pitchCoreIntroV551 .pitchIntroApprovedABoxV545 {
    min-height: 0;
    padding-top: 3px;
    padding-bottom: 3px;
  }
  .app.forest .pitchCoreIntroV551 .pitchIntroApprovedAVisualV545 {
    height: 43px;
  }
  .app.forest .pitchCoreIntroV551 .pitchIntroApprovedATitleV545 {
    line-height: 1.08;
  }
  .app.forest .pitchCoreIntroV551 .pitchIntroApprovedARuleV545 {
    margin-top: -4px;
    line-height: 1.08;
  }
  .app.forest.assessmentViewportV307 .pitchCoreIntroV551 .pitchIntroActionsV546 {
    margin-top: 10px;
  }
  .app.forest .pitchCoreIntroV551 .pitchIntroUnknownV546 {
    font-size: 12px;
    line-height: 1.35;
  }
}

/* V552: restore only the pitch 1/2/3 guide to V540's final composition.
   Keep the V551 lower comparison content and center that panel on the outer card. */
.app.forest .pitchCoreIntroV552 .pitchIntroV261 {
  width: 100%;
  max-width: none;
}
.app.forest .pitchCoreIntroV552 .pitchIntroFlowV262 {
  display: grid;
  grid-template-columns: 1fr auto 1fr auto 1fr;
  align-items: stretch;
  gap: 14px;
  width: auto;
  max-width: none;
  margin: 4px 0;
  justify-self: auto;
}
.app.forest .pitchCoreIntroV552 .pitchIntroStepV262 {
  min-height: 222px;
  aspect-ratio: auto;
  display: grid;
  grid-template-rows: 36px 42px 58px;
  place-items: center;
  align-content: center;
  row-gap: 17px;
  padding: 26px 16px;
  border: 1px solid rgba(188, 211, 176, 0.96);
  border-radius: 24px;
  background: rgba(255, 253, 247, 0.72);
  box-shadow: inset 0 1px 0 rgba(255,255,255,0.88), 0 10px 24px rgba(64, 87, 57, 0.05);
}
.app.forest .pitchCoreIntroV552 .pitchIntroStepNumberV262 {
  width: 36px;
  height: 36px;
  font-size: 18px;
  align-self: center;
  justify-self: center;
}
.app.forest .pitchCoreIntroV552 .pitchIntroStepV262 strong {
  color: #20301f;
  font-size: clamp(18px, 2.2vw, 24px);
  line-height: 1.35;
  align-self: center;
  justify-self: center;
}
.app.forest .pitchCoreIntroV552 .pitchIntroMarkV264 {
  width: auto;
  height: 54px;
  max-width: 72px;
  margin: 0;
  align-self: center;
  justify-self: center;
}
.app.forest .pitchCoreIntroV552 .pitchIntroMarkCompareV264 {
  height: 58px;
  max-width: 86px;
}
.app.forest .pitchCoreIntroV552 .pitchIntroArrowV262 {
  align-self: center;
  justify-self: center;
  color: #8aa182;
  font-size: 21px;
  font-weight: 900;
}
.app.forest .pitchCoreIntroV552 .pitchIntroApprovedABoxV545 {
  justify-self: center;
  margin-inline: auto;
}

@media (max-width: 860px) and (min-width: 721px) {
  .app.forest .pitchCoreIntroV552 .pitchIntroFlowV262 {
    grid-template-columns: 1fr;
    gap: 10px;
  }
  .app.forest .pitchCoreIntroV552 .pitchIntroArrowV262 {
    transform: rotate(90deg);
    font-size: 24px;
    line-height: 1;
  }
  .app.forest .pitchCoreIntroV552 .pitchIntroStepV262 {
    min-height: 190px;
    grid-template-rows: 36px 38px 58px;
    row-gap: 14px;
    padding: 22px 16px;
  }
}

@media (max-width: 720px) {
  .app.forest .pitchCoreIntroV552 .pitchIntroFlowV262 {
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 6px;
    align-items: stretch;
  }
  .app.forest .pitchCoreIntroV552 .pitchIntroArrowV262 {
    display: none;
  }
  .app.forest .pitchCoreIntroV552 .pitchIntroStepV262 {
    min-height: 124px;
    aspect-ratio: auto;
    grid-template-rows: 24px 36px 42px;
    gap: 6px;
    padding: 10px 5px;
    border-radius: 15px;
  }
  .app.forest .pitchCoreIntroV552 .pitchIntroStepNumberV262 {
    width: 24px;
    height: 24px;
    font-size: 12px;
  }
  .app.forest .pitchCoreIntroV552 .pitchIntroStepV262 strong {
    font-size: 13px;
    line-height: 1.32;
  }
  .app.forest .pitchCoreIntroV552 .pitchIntroMarkV264,
  .app.forest .pitchCoreIntroV552 .pitchIntroMarkCompareV264 {
    height: 38px;
    max-width: 45px;
  }
}

@media (max-width: 374px) {
  .app.forest .pitchCoreIntroV552 .pitchIntroStepV262 {
    min-height: 118px;
  }
  .app.forest .pitchCoreIntroV552 .pitchIntroStepV262 strong {
    font-size: 12px;
  }
}

/* V554: based on V552. Change only the vertical size of the three pitch
   step borders so each existing width produces a square-shaped panel. */
.app.forest .pitchCoreIntroV554 .pitchIntroStepV262 {
  min-height: 0;
  aspect-ratio: 1 / 1;
}

/* V555: reproduce only the approved pitch-introduction guide composition. */
.app.forest .pitchCoreIntroV555 .pitchIntroV261 {
  gap: 26px;
}
.app.forest .pitchCoreIntroV555 .pitchIntroFlowV262 {
  width: 100%;
  margin: 4px 0 0;
}
.app.forest .pitchCoreIntroV555 .pitchIntroStepV262 {
  min-height: 0;
  aspect-ratio: 1 / 1;
}
.app.forest .pitchCoreIntroV555 .pitchIntroApprovedABoxV545 {
  box-sizing: border-box;
  width: 100%;
  min-height: 178px;
  margin: 0;
  padding: 18px 20px 16px;
  gap: 8px;
  align-content: center;
}
.app.forest .pitchCoreIntroV555 .pitchIntroApprovedAVisualV545 {
  height: 58px;
}
.app.forest .pitchCoreIntroV555 .pitchIntroApprovedATitleV545 {
  line-height: 1.2;
}
.app.forest .pitchCoreIntroV555 .pitchIntroApprovedARuleV545 {
  margin-top: 0;
  line-height: 1.2;
}

@media (max-width: 720px) {
  .app.forest .pitchCoreIntroV555 .pitchIntroV261 {
    gap: 12px;
  }
  .app.forest .pitchCoreIntroV555 .pitchIntroApprovedABoxV545 {
    width: 100%;
    min-height: 132px;
    padding: 10px 8px 9px;
    gap: 4px;
  }
  .app.forest .pitchCoreIntroV555 .pitchIntroApprovedAVisualV545 {
    height: 47px;
  }
}

/* V556: bound the complete five-column pitch guide to its parent card. */
.app.forest .pitchCoreIntroV556 .pitchIntroV261 {
  width: 100%;
  max-width: 100%;
  gap: clamp(18px, 2.6vw, 40px);
  overflow: hidden;
}
.app.forest .pitchCoreIntroV556 .pitchIntroFlowV262 {
  box-sizing: border-box;
  display: grid;
  grid-template-columns:
    minmax(0, 1fr) clamp(44px, 4.8vw, 72px)
    minmax(0, 1fr) clamp(44px, 4.8vw, 72px)
    minmax(0, 1fr);
  align-items: center;
  gap: 0;
  width: 100%;
  max-width: 100%;
  min-width: 0;
  margin: 0;
  overflow: hidden;
}
.app.forest .pitchCoreIntroV556 .pitchIntroStepV262 {
  box-sizing: border-box;
  width: 100%;
  max-width: 100%;
  min-width: 0;
  min-height: 0;
  aspect-ratio: 1 / 1;
}
.app.forest .pitchCoreIntroV556 .pitchIntroArrowV262 {
  width: 100%;
  min-width: 0;
  text-align: center;
}
.app.forest .pitchCoreIntroV556 .pitchIntroApprovedABoxV545 {
  box-sizing: border-box;
  width: 100%;
  max-width: 100%;
  min-width: 0;
  min-height: clamp(150px, 16.25vw, 248px);
  margin: 0;
  padding: 18px 20px 16px;
  gap: 8px;
  align-content: center;
}
.app.forest .pitchCoreIntroV556 .pitchIntroApprovedAVisualV545 {
  height: 58px;
}
.app.forest .pitchCoreIntroV556 .pitchIntroApprovedATitleV545,
.app.forest .pitchCoreIntroV556 .pitchIntroApprovedARuleV545 {
  line-height: 1.2;
}
.app.forest .pitchCoreIntroV556 .pitchIntroApprovedARuleV545 {
  margin-top: 0;
}

@media (max-width: 720px) {
  .app.forest .pitchCoreIntroV556 .pitchIntroV261 {
    gap: 12px;
  }
  .app.forest .pitchCoreIntroV556 .pitchIntroFlowV262 {
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 6px;
  }
  .app.forest .pitchCoreIntroV556 .pitchIntroApprovedABoxV545 {
    min-height: 132px;
    padding: 10px 8px 9px;
    gap: 4px;
  }
  .app.forest .pitchCoreIntroV556 .pitchIntroApprovedAVisualV545 {
    height: 47px;
  }
}

/* V557: change only the lower pitch comparison panel to the approved ratio. */
.app.forest .pitchCoreIntroV557 .pitchIntroApprovedABoxV545 {
  box-sizing: border-box;
  width: 100%;
  max-width: 100%;
  min-width: 0;
  height: auto;
  min-height: 0;
  aspect-ratio: 5.37 / 1;
  margin: -20px 0 0;
  padding: 12px 20px;
  gap: 8px;
  align-content: center;
  justify-items: center;
  overflow: hidden;
}
.app.forest .pitchCoreIntroV557 .pitchIntroApprovedAVisualV545 {
  height: 58px;
}
.app.forest .pitchCoreIntroV557 .pitchIntroApprovedATitleV545,
.app.forest .pitchCoreIntroV557 .pitchIntroApprovedARuleV545 {
  line-height: 1.2;
}
.app.forest .pitchCoreIntroV557 .pitchIntroApprovedARuleV545 {
  margin-top: 0;
}

@media (max-width: 720px) {
  .app.forest .pitchCoreIntroV557 .pitchIntroApprovedABoxV545 {
    height: auto;
    min-height: 132px;
    aspect-ratio: auto;
    margin-top: 0;
    padding: 10px 8px 9px;
    gap: 4px;
  }
  .app.forest .pitchCoreIntroV557 .pitchIntroApprovedAVisualV545 {
    height: 47px;
  }
}

/* V558: tighten only the three vertical spaces on the pitch intro screen. */
.app.forest .pitchCoreIntroV558 > h2 {
  margin-bottom: 0;
}
.app.forest .pitchCoreIntroV558 .pitchIntroV261 {
  margin-top: 6px;
  margin-bottom: 0;
  gap: 30px;
}
.app.forest .pitchCoreIntroV558 .pitchIntroActionsV546 {
  margin-top: 4px;
}

@media (max-width: 720px) {
  .app.forest .pitchCoreIntroV558 .pitchIntroV261 {
    margin-top: 5px;
    margin-bottom: 0;
    gap: 8px;
  }
  .app.forest.assessmentViewportV307 .pitchCoreIntroV558 .pitchIntroActionsV546 {
    margin-top: 4px;
  }
}

/* V559: reduce the same three pitch-intro spaces to their safe minimum. */
.app.forest .pitchCoreIntroV559 > h2 {
  margin-bottom: -8px;
}
.app.forest .pitchCoreIntroV559 .pitchIntroV261 {
  margin-top: 0;
  margin-bottom: 0;
  gap: 22px;
}
.app.forest .pitchCoreIntroV559 .pitchIntroActionsV546 {
  margin-top: 0;
}

@media (max-width: 720px) {
  .app.forest .pitchCoreIntroV559 > h2 {
    margin-bottom: -4px;
  }
  .app.forest .pitchCoreIntroV559 .pitchIntroV261 {
    margin-top: 0;
    margin-bottom: 0;
    gap: 4px;
  }
  .app.forest.assessmentViewportV307 .pitchCoreIntroV559 .pitchIntroActionsV546 {
    margin-top: 0;
  }
}

/* V560: pull the same three pitch-intro blocks up substantially, with the
   strongest reduction between the lower guide panel and the action row. */
.app.forest .pitchCoreIntroV560 {
  padding-bottom: 10px;
}
.app.forest .pitchCoreIntroV560 > h2 {
  margin-bottom: -20px;
}
.app.forest .pitchCoreIntroV560 .pitchIntroV261 {
  margin-top: -4px;
  margin-bottom: 0;
  gap: 20px;
}
.app.forest .pitchCoreIntroV560 .pitchIntroActionsV546 {
  margin-top: -12px;
}

@media (max-width: 720px) {
  .app.forest .pitchCoreIntroV560 {
    padding-bottom: 8px;
  }
  .app.forest .pitchCoreIntroV560 > h2 {
    margin-bottom: -10px;
  }
  .app.forest .pitchCoreIntroV560 .pitchIntroV261 {
    margin-top: -2px;
    margin-bottom: 0;
    gap: 2px;
  }
  .app.forest.assessmentViewportV307 .pitchCoreIntroV560 .pitchIntroActionsV546 {
    margin-top: -8px;
  }
}

/* V561: apply 1.5x the V560 pitch-intro compression. */
.app.forest .pitchCoreIntroV561 {
  padding-bottom: 6px;
}
.app.forest .pitchCoreIntroV561 > h2 {
  margin-bottom: -30px;
}
.app.forest .pitchCoreIntroV561 .pitchIntroV261 {
  margin-top: -6px;
  margin-bottom: 0;
  gap: 15px;
}
.app.forest .pitchCoreIntroV561 .pitchIntroActionsV546 {
  margin-top: -18px;
}

@media (max-width: 720px) {
  .app.forest .pitchCoreIntroV561 {
    padding-bottom: 5px;
  }
  .app.forest .pitchCoreIntroV561 > h2 {
    margin-bottom: -15px;
  }
  .app.forest .pitchCoreIntroV561 .pitchIntroV261 {
    margin-top: -3px;
    margin-bottom: 0;
    gap: 1px;
  }
  .app.forest.assessmentViewportV307 .pitchCoreIntroV561 .pitchIntroActionsV546 {
    margin-top: -12px;
  }
}

/* V562: increase the V561 three-space compression by 1.2x. */
.app.forest .pitchCoreIntroV562 {
  padding-bottom: 5px;
}
.app.forest .pitchCoreIntroV562 > h2 {
  margin-bottom: -36px;
}
.app.forest .pitchCoreIntroV562 .pitchIntroV261 {
  margin-top: -7px;
  margin-bottom: 0;
  gap: 14px;
}
.app.forest .pitchCoreIntroV562 .pitchIntroActionsV546 {
  margin-top: -22px;
}

@media (max-width: 720px) {
  .app.forest .pitchCoreIntroV562 {
    padding-bottom: 4px;
  }
  .app.forest .pitchCoreIntroV562 > h2 {
    margin-bottom: -18px;
  }
  .app.forest .pitchCoreIntroV562 .pitchIntroV261 {
    margin-top: -4px;
    margin-bottom: 0;
    gap: 0;
  }
.app.forest.assessmentViewportV307 .pitchCoreIntroV562 .pitchIntroActionsV546 {
    margin-top: -14px;
  }
}

/* V564: keep the V562 title spacing and compress only the remaining two gaps. */
.app.forest .pitchCoreIntroV564 .pitchIntroV261 {
  gap: 9px;
}
.app.forest .pitchCoreIntroV564 .pitchIntroActionsV546 {
  margin-top: -33px;
}

@media (max-width: 720px) {
  .app.forest .pitchCoreIntroV564 .pitchIntroV261 {
    gap: 0;
  }
.app.forest.assessmentViewportV307 .pitchCoreIntroV564 .pitchIntroActionsV546 {
    margin-top: -21px;
  }
}

/* V565: shorten only the two remaining gaps by approximately 1 cm (38 CSS px). */
.app.forest .pitchCoreIntroV565 .pitchIntroV261 {
  gap: 0;
}
.app.forest .pitchCoreIntroV565 .pitchIntroApprovedABoxV545 {
  margin-top: -29px;
}
.app.forest .pitchCoreIntroV565 .pitchIntroActionsV546 {
  margin-top: -71px;
}

@media (max-width: 720px) {
  .app.forest .pitchCoreIntroV565 .pitchIntroApprovedABoxV545 {
    margin-top: -38px;
  }
.app.forest.assessmentViewportV307 .pitchCoreIntroV565 .pitchIntroActionsV546 {
    margin-top: -59px;
  }
}

/* V566: shorten only the guide-to-actions gap by approximately 1.5 cm (57 CSS px). */
.app.forest .pitchCoreIntroV566 .pitchIntroActionsV546 {
  margin-top: -128px;
}

@media (max-width: 720px) {
.app.forest.assessmentViewportV307 .pitchCoreIntroV566 .pitchIntroActionsV546 {
    margin-top: -116px;
  }
}

/* V567: extend only the desktop outer frame bottom to provide a 68px action gap. */
.app.forest .pitchCoreIntroV567 {
  padding-bottom: 63px;
}

@media (max-width: 720px) {
.app.forest .pitchCoreIntroV567 {
    padding-bottom: 4px;
  }
}

/* V568: reduce only the desktop action-to-bottom-frame space from 68px to 45px. */
.app.forest .pitchCoreIntroV568 {
  padding-bottom: 40px;
}

@media (max-width: 720px) {
  .app.forest .pitchCoreIntroV568 {
    padding-bottom: 4px;
  }
}

}

/* V606: mobile LP hero mirrors the desktop hero composition; only scaled to fit phones. */
@media (max-width: 620px) {
  .darwinLanding .hero-section {
    display: grid;
    grid-template-columns: minmax(0, 1.08fr) minmax(0, .92fr);
    gap: 12px;
    align-items: center;
    width: calc(100% - 20px);
    margin: 18px auto 28px;
    padding: 14px 0 12px;
  }
  .darwinLanding .hero-copy {
    grid-column: 1;
    grid-row: 1;
    min-width: 0;
    width: auto;
    order: initial;
    display: block;
  }
  .darwinLanding .hero-copy .eyebrow {
    margin: 0 0 6px;
    font-size: 8px;
    line-height: 1.45;
    letter-spacing: .08em;
  }
  .darwinLanding .hero-title {
    max-width: 100%;
    margin: 0 0 8px;
    font-size: clamp(18px, 5.25vw, 22px);
    font-weight: 500;
    line-height: 1.36;
    letter-spacing: .01em;
    text-wrap: balance;
  }
  .darwinLanding .hero-title br { display: initial; }
  .darwinLanding .hero-title-nowrap { white-space: nowrap !important; }
  .darwinLanding .hero-lead {
    max-width: 100%;
    margin: 0 0 10px;
    font-size: 9px;
    line-height: 1.78;
  }
  .darwinLanding .hero-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 5px;
    margin: 0 0 7px;
  }
  .darwinLanding .hero-actions > * { width: auto; }
  .darwinLanding .hero-actions .primary-button {
    width: auto;
    min-height: 31px;
    padding: 7px 9px;
    font-size: 9px;
    line-height: 1.3;
  }
  .darwinLanding .hero-actions .secondary-button {
    width: auto;
    min-height: 31px;
    padding: 7px 9px;
    font-size: 8px;
    line-height: 1.3;
  }
  .darwinLanding .hero-note {
    margin: 0;
    font-size: 7.5px;
    line-height: 1.5;
  }
  .darwinLanding .hero-photo {
    grid-column: 2;
    grid-row: 1;
    position: relative;
    align-self: center;
    width: 100%;
    min-height: 205px;
    height: 205px;
    margin: 0;
    order: initial;
    border-radius: 18px;
    overflow: hidden;
    background: linear-gradient(140deg, rgba(255,255,255,.96), rgba(238,244,233,.78));
    box-shadow: 0 12px 34px rgba(40,60,49,.12);
    border: 1px solid rgba(255,255,255,.86);
    isolation: isolate;
  }
  .darwinLanding .hero-photo::before {
    content: "";
    position: absolute;
    z-index: 1;
    inset: -16% -22% auto auto;
    width: 74%;
    height: 74%;
    border-radius: 999px;
    border: 1px solid rgba(52,93,70,.11);
    background: radial-gradient(circle, rgba(52,93,70,.07) 0%, rgba(52,93,70,.02) 58%, transparent 70%);
    pointer-events: none;
  }
  .darwinLanding .hero-photo::after {
    content: "";
    position: absolute;
    z-index: 2;
    inset: 0;
    background: linear-gradient(90deg, rgba(255,250,242,.36), transparent 34%, rgba(255,255,255,.04));
    pointer-events: none;
  }
  .darwinLanding .hero-photo img {
    position: relative;
    z-index: 0;
    display: block;
    width: 100%;
    height: 205px;
    min-height: 205px;
    object-fit: cover;
    object-position: 52% 50%;
    -webkit-mask-image: none;
    mask-image: none;
  }
}

/* V607 final mobile hero override. */
@media (max-width: 620px) {
  .darwinLanding .hero-section {
    grid-template-columns: minmax(0, 1.12fr) minmax(0, .88fr);
    gap: 4px;
    overflow: hidden;
  }
  .darwinLanding .hero-copy { position: relative; z-index: 2; }
  .darwinLanding .hero-title {
    font-size: clamp(13px, 3.75vw, 15px);
    line-height: 1.5;
    letter-spacing: 0;
  }
  .darwinLanding .hero-title-nowrap { white-space: normal !important; }
  .darwinLanding .hero-photo {
    z-index: 1;
    width: calc(100% + 18px);
    margin-left: -18px;
    border: 0;
    border-radius: 0;
    background: transparent;
    box-shadow: none;
    overflow: hidden;
  }
  .darwinLanding .hero-photo::before,
  .darwinLanding .hero-photo::after { content: none; }
  .darwinLanding .hero-photo img {
    object-position: 57% 50%;
    -webkit-mask-image: linear-gradient(to right, transparent 0%, rgba(0,0,0,.22) 10%, #000 34%, #000 100%);
    mask-image: linear-gradient(to right, transparent 0%, rgba(0,0,0,.22) 10%, #000 34%, #000 100%);
  }
}

/* V608 final: approved editorial mobile hero. */
@media (max-width: 620px) {
  .darwinLanding .hero-section {
    position: relative;
    isolation: isolate;
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    grid-template-areas: "eyebrow" "title" "photo" "lead" "actions" "note";
    width: calc(100% - 32px);
    margin: 0 auto 30px;
    padding: 36px 0 8px;
    gap: 0;
    overflow: hidden;
  }
  .darwinLanding .hero-section::before {
    content: "";
    position: absolute;
    z-index: 0;
    top: 250px;
    left: -18%;
    width: 128%;
    height: 520px;
    border: 1px solid rgba(91,124,94,.38);
    border-radius: 48% 52% 46% 54%;
    transform: rotate(-7deg);
    pointer-events: none;
  }
  .darwinLanding .hero-copy { display: contents; }
  .darwinLanding .hero-copy .eyebrow,
  .darwinLanding .hero-title,
  .darwinLanding .hero-lead,
  .darwinLanding .hero-actions,
  .darwinLanding .hero-note,
  .darwinLanding .hero-photo { position: relative; z-index: 2; }
  .darwinLanding .hero-copy .eyebrow {
    grid-area: eyebrow;
    margin: 0 0 16px;
    font-size: 12px;
    font-weight: 700;
    line-height: 1.5;
    letter-spacing: .04em;
  }
  .darwinLanding .hero-title {
    grid-area: title;
    max-width: none;
    margin: 0;
    font-size: clamp(27px,7.2vw,29px);
    font-weight: 500;
    line-height: 1.38;
    letter-spacing: -.025em;
    text-wrap: initial;
  }
  .darwinLanding .hero-title br { display: initial; }
  .darwinLanding .hero-title-nowrap { white-space: nowrap !important; }
  .darwinLanding .hero-photo {
    grid-area: photo;
    justify-self: end;
    width: 88%;
    height: 205px;
    min-height: 205px;
    margin: 22px 0;
    border: 0;
    border-radius: 50% 50% 14px 14px / 42% 42% 8px 8px;
    background: transparent;
    box-shadow: none;
    overflow: hidden;
  }
  .darwinLanding .hero-photo::before,
  .darwinLanding .hero-photo::after { content: none; }
  .darwinLanding .hero-photo img {
    width: 100%;
    height: 205px;
    min-height: 205px;
    object-fit: cover;
    object-position: 52% 48%;
    -webkit-mask-image: linear-gradient(to bottom,#000 0%,#000 72%,rgba(0,0,0,.82) 84%,transparent 100%);
    mask-image: linear-gradient(to bottom,#000 0%,#000 72%,rgba(0,0,0,.82) 84%,transparent 100%);
  }
  .darwinLanding .hero-lead {
    grid-area: lead;
    max-width: none;
    margin: 0 4px 20px;
    font-size: 15px;
    line-height: 1.82;
  }
  .darwinLanding .hero-actions {
    grid-area: actions;
    display: grid;
    grid-template-columns: 1fr;
    width: calc(100% - 36px);
    margin: 0 auto;
  }
  .darwinLanding .hero-actions > *,
  .darwinLanding .hero-actions .primary-button { width: 100%; }
  .darwinLanding .hero-actions .primary-button {
    min-height: 56px;
    padding: 14px 18px;
    border-radius: 999px;
    font-size: 16px;
    line-height: 1.4;
  }
  .darwinLanding .hero-note {
    grid-area: note;
    margin: 14px 0 0;
    text-align: center;
    font-size: 12px;
    line-height: 1.65;
  }
}