body.with-sticky-header {
    padding-top: var(--header-height);
    padding-bottom: calc(var(--footer-safe-area, 8rem) + env(safe-area-inset-bottom, 0px));
}

main.layout-container {
    max-width: var(--width-tool-container);
    margin-inline: auto;
    padding-inline: var(--space-lg);
    padding-bottom: max(var(--footer-safe-area, 8rem), 8rem);
    min-height: calc(100vh - var(--header-height));
}

body.is-1-4-result-view main.layout-container {
    max-width: min(calc(100% - 2rem), 68rem);
}

body.is-1-4-result-view #result-card {
    width: 100%;
}

body.is-1-4-result-view #result-capture-area {
    max-width: 64rem;
    margin-inline: auto;
}

:root {
  --color-sensitive-high-soft: var(--color-primary-light);
}

.inline-emoji {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    line-height: 1;
    margin-right: var(--space-xs);
    font-size: 1.15em;
    vertical-align: -0.12em;
}

.intro-text__note {
  margin-top: var(--space-md);
}

.intro-time-note {
  margin-top: var(--space-md);
  margin-bottom: 0;
  color: var(--color-text-light);
}

.intro-strong-text {
  color: var(--color-primary-dark);
}

.icon-suffix {
  margin-left: var(--space-xs);
}

.intro-action-row {
  text-align: center;
  margin-top: var(--space-xs) !important;
}

.page-header {
  background: var(--color-primary-lighter);
  padding: var(--space-xl) var(--space-md);
  border-bottom: 1px solid var(--color-border);
  margin-bottom: var(--space-xl);
  text-align: center;
  position: relative;
  z-index: 10;
}

.page-header__title {
  color: var(--color-primary-dark);
  margin-bottom: var(--space-sm);
  display: flex;
  align-items: center;
  justify-content: center;
  gap: var(--space-sm);
}

.page-header__title .emoji,
.page-header__title .emoji-icon,
.page-header__title > [role="img"] {
  font-size: clamp(1.25rem, 0.5rem + 2vw, 2rem);
  line-height: 1;
}

.page-header__description {
  font-size: var(--font-size-base);
  color: var(--color-text-light);
  line-height: 1.65;
  max-width: 65ch;
  margin: 0 auto;
  display: block;
}

.intro-analogy-box {
    background-color: var(--color-primary-lighter);
    border: 1px solid var(--color-border);
    border-radius: var(--border-radius-base);
    padding: var(--space-lg);
    margin: var(--space-xl) 0;
    box-shadow: var(--shadow-soft);
}
@media (any-hover: hover) { .intro-analogy-box:hover { transform: translateY(-0.08rem); box-shadow: var(--shadow-soft); } }
.intro-analogy-box strong { word-break: keep-all; }
.intro-analogy-box__title {
    color: var(--color-primary-dark);
    margin-bottom: var(--space-md);
    display: flex;
    align-items: center;
    gap: var(--space-xs);
}
.intro-analogy-box__text {
    word-break: keep-all;
    color: var(--color-text-light);
    line-height: var(--line-height-base);
    margin-bottom: var(--space-md);
}
.intro-analogy-box__text:last-child { margin-bottom: 0; }
.intro-analogy-box__text strong {
    display: block;
    text-align: center;
    margin-top: var(--space-md);
    color: var(--color-primary-dark);
    font-weight: var(--font-weight-bold);
}

.evidence-note {
  margin: var(--space-lg) 0 var(--space-xl);
  padding: var(--space-md) var(--space-lg);
  border: 1px solid var(--color-border-light);
  border-radius: var(--border-radius-base);
  background-color: var(--color-surface-alt, var(--color-primary-lighter));
}

.evidence-note__title {
  display: flex;
  align-items: center;
  gap: var(--space-xs);
  margin: 0;
  color: var(--color-primary-dark);
  font-size: var(--font-size-base);
  font-weight: var(--font-weight-semibold);
}

.evidence-note--compact > .evidence-note__title {
  cursor: pointer;
  list-style: none;
}

.evidence-note--compact > .evidence-note__title::-webkit-details-marker {
  display: none;
}

.evidence-note--compact > .evidence-note__title::after {
  content: "열기";
  margin-left: auto;
  color: var(--color-text-light);
  font-size: var(--font-size-sm);
  font-weight: var(--font-weight-regular);
}

.evidence-note--compact[open] > .evidence-note__title::after {
  content: "닫기";
}

.evidence-note__text {
  margin: var(--space-sm) 0 0;
  color: var(--color-text-light);
  font-size: var(--font-size-sm);
  line-height: 1.75;
}

.evidence-note__text a {
  color: var(--color-primary-dark);
  font-weight: var(--font-weight-semibold);
  text-decoration: underline;
  text-underline-offset: 0.18em;
}


.mol-progress-bar {
  height: 0.5rem;
  width: 100%;
  background-color: var(--color-border-light);
  border-radius: var(--border-radius-pill);
  margin: var(--space-lg) 0;
  overflow: hidden;
}
.mol-progress-bar__fill {
  height: 100%;
  width: 5%;
  background-color: var(--color-primary);
  border-radius: var(--border-radius-pill);
  transition: width var(--transition-medium) ease;
}
.mol-progress-bar__text {
  text-align: right;
  font-size: var(--font-size-sm);
  color: var(--color-text-light);
  margin-top: var(--space-xs);
}

.question-actions {
  display: flex;
  justify-content: center;
  gap: var(--space-sm);
  margin-top: var(--space-lg);
  flex-wrap: wrap;
}

.atm-card__title {
  color: var(--color-primary-dark);
  margin: 0;
}
.mol-question { display: none; }
.mol-question.is-active { display: block; }
.mol-question__header {
  display: flex;
  align-items: center;
  gap: var(--space-sm);
  margin-bottom: var(--space-md);
  width: 100%;
}
.atm-question-number {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 2.25rem;
  height: 2.25rem;
  background-color: var(--color-primary);
  color: var(--color-text-on-primary);
  font-weight: var(--font-weight-bold);
  border-radius: var(--border-radius-circle);
  flex-shrink: 0;
  box-shadow: var(--shadow-soft);
}
.mol-question__title {
  color: var(--color-text-dark);
  flex: 1 1 auto;
  min-width: 0;
  max-width: none;
  line-height: 1.55;
  word-break: keep-all;
  overflow-wrap: break-word;
}
.mol-option-group {
  display: grid;
  grid-template-columns: repeat(5, 1fr);
  gap: var(--space-sm);
  margin: var(--space-lg) 0;
}
.mol-option-group--binary {
    grid-template-columns: repeat(2, 1fr);
    max-width: 25rem;
    margin-inline: auto;
}
.mol-option-group--3choice {
    grid-template-columns: repeat(3, 1fr);
}

.atm-check-label {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: var(--space-xs);
  padding: var(--space-md);
  min-height: 6.25rem;
  border: 1px solid var(--color-border-light);
  border-radius: var(--border-radius-lg);
  cursor: pointer;
  transition: all var(--transition-medium);
  text-align: center;
  background-color: var(--color-surface);
  box-shadow: var(--shadow-soft);
}
@media (any-hover: hover) {
  .atm-check-label:hover,
  .domain-btn:hover,
  .next-tool-card:hover {
    background-color: var(--color-primary-lighter);
    border-color: var(--color-primary-light);
    transform: translateY(-0.08rem);
    box-shadow: var(--shadow-soft);
  }
}
.mol-option-group input[type="radio"] {
  position: absolute;
  width: 1px;
  height: 1px;
  margin: 0;
  opacity: 0;
  clip-path: inset(50%);
}
.mol-option-group input[type="radio"]:focus-visible + .atm-check-label {
  outline: 3px solid var(--focus-ring-color);
  outline-offset: 3px;
}
.mol-option-group input[type="radio"]:checked + .atm-check-label {
  background-color: var(--color-primary-dark);
  border-color: var(--color-primary-dark);
  box-shadow: 0 0 0 3px var(--focus-ring-color), var(--shadow-soft);
}
.mol-option-group input[type="radio"]:checked + .atm-check-label .atm-check-label__emoji { transform: scale(1.1); }
.mol-option-group input[type="radio"]:checked + .atm-check-label .atm-check-label__text {
    color: var(--color-text-on-primary);
    font-weight: var(--font-weight-semibold);
}
.atm-check-label__emoji {
    font-size: 1.75rem;
    transition: transform var(--transition-medium);
}
.atm-check-label__text {
    font-size: var(--font-size-sm);
    color: var(--color-text-light);
    line-height: 1.4;
}
.org-result-section { display: none; }
#result-capture-area { background-color: var(--color-surface); padding: var(--space-lg); border-radius: var(--border-radius-base); }

.card[class*="atm-card--domain-"] {
    box-shadow: var(--shadow-soft);
    margin-bottom: var(--space-xxl);
    border-radius: var(--border-radius-lg);
    border-width: 0;
    overflow: hidden;
}
@media (any-hover: hover) { .card[class*="atm-card--domain-"]:hover { transform: translateY(-0.08rem); box-shadow: var(--shadow-soft); } }
.atm-card__body {
    padding: var(--space-lg);
}
.atm-card--domain-1 { background: var(--color-sensitive-high-bg); border-color: var(--color-sensitive-high-soft); }
.atm-card--domain-2 { background: var(--color-primary-lighter); border-color: var(--color-primary-light); }
.atm-card--domain-3 { background: var(--color-warm-beige); border-color: var(--color-border); }
.atm-card--domain-4 { background: var(--color-primary-lighter); border-color: var(--color-primary-light); }
.atm-card--domain-5 { background: var(--color-success-bg); border-color: var(--color-success); }


.mol-domain-header { display: flex; justify-content: space-between; align-items: flex-start; gap: var(--space-sm); margin-bottom: var(--space-sm); }
.mol-domain-name { display: flex; min-width: 0; align-items: flex-start; gap: var(--space-xs); color: var(--color-text-dark); }
.mol-domain-score { flex: 0 0 auto; font-weight: var(--font-weight-bold); font-size: var(--font-size-sm); color: var(--color-text-dark); text-align: right; white-space: nowrap; }
.mol-domain-description { line-height: var(--line-height-base); color: var(--color-text-light); }
.mol-domain-description--empty { color: var(--color-text-light); font-style: italic; }

.mol-info-box {
  background-color: var(--color-primary-lighter);
  border-radius: var(--border-radius-lg);
  padding: var(--space-lg);
  margin: var(--space-lg) 0;
  border: 0;
  box-shadow: var(--shadow-soft);
}
@media (any-hover: hover) { .mol-info-box:hover { transform: translateY(-0.08rem); box-shadow: var(--shadow-soft); } }
.mol-info-box__title {
  color: var(--color-primary-dark);
  margin-bottom: var(--space-md);
  display: flex;
  align-items: center;
  gap: var(--space-xs);
}
.mol-info-box__title .icon,
.mol-info-box__title .inline-emoji { font-size: 1.2em; }
.mol-info-box p, .mol-info-box ul { color: var(--color-text-light); margin-bottom: var(--space-sm); }
.mol-info-box ul { padding-left: var(--space-lg); list-style-type: disc; }
.mol-info-box li { margin-bottom: var(--space-xs); padding-left: var(--space-xs); }
.mol-recommendation-section { margin-top: var(--space-lg); padding-top: var(--space-lg); border-top: 0; }
.mol-recommendation-section__title { color: var(--color-primary-dark); margin-bottom: var(--space-md); }

.mol-result-action-buttons .btn { flex-grow: 1; max-width: 12.5rem; }

.result-footer-row {
  text-align: center;
  margin-top: var(--space-lg);
}

.mol-result-action-buttons--stacked {
  flex-direction: column;
  align-items: center;
  gap: var(--space-md);
}

.mol-result-action-buttons + p {
  margin-top: var(--space-lg) !important;
}

#restart-btn {
  min-width: 12.5rem;
}

.result-helper-text {
  color: var(--color-text-light);
  font-size: var(--font-size-sm);
  margin-top: var(--space-md);
  line-height: 1.7;
  word-break: keep-all;
}

@media (max-width: 48rem) {
    body.is-1-4-result-view main.layout-container {
      max-width: var(--width-tool-container);
    }

    main.layout-container {
      padding-inline: var(--space-md);
    }
    .page-header__title { gap: var(--space-xs); }
    .page-header__title .emoji,
    .page-header__title .emoji-icon { font-size: clamp(1.25rem, 0.5rem + 2vw, 2rem); }
    .page-header__description { font-size: var(--font-size-sm); }

    .tool-progress {
      display: none;
    }

    .intro-analogy-box {
      margin: var(--space-lg) 0;
      padding: var(--space-md);
    }

    .card-header {
      flex-direction: column;
      align-items: flex-start;
      gap: var(--space-sm);
    }

    .context-check-section,
    .trait-note-card,
    .medical-notice-card {
      padding: var(--space-md);
    }

    .context-option-grid,
    .trait-note-grid {
      grid-template-columns: 1fr;
    }

    .mol-option-group {
     
      grid-template-columns: 1fr; 
    }
   
    .mol-option-group--binary {
        grid-template-columns: 1fr;
    }
    
    .mol-option-group .atm-check-label {
        min-height: 3.5rem; 
        flex-direction: row; 
        justify-content: flex-start;
        padding-left: var(--space-lg);
    }

    .atm-check-label {
      min-height: 2.75rem;
    }
}

@media (prefers-reduced-motion: reduce) {
  .intro-analogy-box,
  .atm-check-label,
  .card[class*="atm-card--domain-"],
  .mol-info-box,
  .mol-progress-bar__fill {
    animation: none;
    transition: none;
    transform: none;
  }
}

@media (max-width: 30rem) {
    .mol-result-action-buttons .btn { width: 100%; min-width: 0; max-width: none; }
    #restart-btn { min-width: 0; }
    .question-actions {
      align-items: stretch;
      flex-direction: column;
    }
    .question-actions .btn {
      width: 100%;
    }
}

#result-capture-area > .card,
#result-capture-area > .mol-info-box,
#result-capture-area > .result-details {
    margin-bottom: var(--space-xxl);
}

#result-capture-area > :last-child {
    margin-bottom: 0;
}

#question-card {
    width: 100%;
    max-width: var(--width-tool-container);
    margin-inline: auto;

}
@media (min-width: 768px) {
    #question-card {
            width: 760px;
    }
}

.card-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
}

/* 1-4 v2: 관계 반응을 짧게 확인하는 고정형 흐름 */
.sr-only {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}

#domain-selection-screen {
  width: 100%;
  max-width: var(--width-tool-container);
  margin-inline: auto;
}

.relation-lead,
.question-context-line {
  margin: 0 0 var(--space-lg);
  color: var(--color-text-light);
  line-height: 1.65;
  text-align: center;
  word-break: keep-all;
}

.domain-selection-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: var(--space-md);
  min-width: 0;
  margin: 0;
  padding: 0;
  border: 0;
}

.domain-choice {
  position: relative;
  min-width: 0;
}

.domain-input {
  position: absolute;
  width: 1px;
  height: 1px;
  margin: 0;
  opacity: 0;
  clip-path: inset(50%);
}

.domain-btn {
  display: flex;
  position: relative;
  width: 100%;
  height: 100%;
  min-width: 0;
  min-height: 6rem;
  padding: var(--space-md);
  align-items: center;
  justify-content: center;
  gap: var(--space-sm);
  border: 1px solid var(--color-border-light);
  border-radius: var(--border-radius-lg);
  background: var(--color-surface);
  color: var(--color-text-dark);
  font: inherit;
  font-weight: var(--font-weight-semibold);
  line-height: 1.45;
  text-align: center;
  cursor: pointer;
  transition: background-color var(--transition-fast), border-color var(--transition-fast);
  word-break: keep-all;
}

.domain-btn .domain-icon {
  flex: 0 0 auto;
  font-size: 1.65rem;
}

.domain-input:focus-visible + .domain-btn {
  outline: 3px solid var(--focus-ring-color);
  outline-offset: 3px;
}

.domain-check {
  position: absolute;
  top: var(--space-sm);
  right: var(--space-sm);
  color: var(--color-primary-dark);
  font-weight: var(--font-weight-bold);
  opacity: 0;
}

.domain-input:checked + .domain-btn {
  background: var(--color-primary-lighter);
  box-shadow: inset 0 0 0 2px var(--color-primary-dark);
  font-weight: var(--font-weight-bold);
}

.domain-input:checked + .domain-btn .domain-check {
  opacity: 1;
}

@media (any-hover: hover) and (pointer: fine) {
  .intro-analogy-box:hover,
  .trait-note-card:hover,
  .card[class*="atm-card--domain-"]:hover,
  .mol-info-box:hover {
    transform: none;
    box-shadow: none;
  }
}

.mol-question__header {
  align-items: flex-start;
}

body.tool-standard-ui .mol-question__title > .question-emoji:first-child {
  display: block;
  margin: 0 auto var(--space-sm);
  font-size: clamp(3rem, 2.35rem + 2vw, 4rem) !important;
  line-height: 1;
  text-align: center;
}

.mol-question__title {
  max-width: 42rem;
  margin-inline: auto;
  font-weight: var(--font-weight-regular);
  line-height: 1.65;
  text-align: center;
  word-break: keep-all;
  overflow-wrap: break-word;
}

.mol-question__title strong {
  color: var(--color-primary-dark);
  font-weight: var(--font-weight-bold);
}

.mol-option-group,
.mol-option-group--binary,
.mol-option-group--3choice {
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: var(--space-md);
}

.mol-option-group__item {
  position: relative;
  min-width: 0;
}

.atm-check-label {
  position: relative;
  min-height: 5.75rem;
  padding: var(--space-md);
  border: 1px solid var(--color-border-light);
  border-radius: var(--border-radius-lg);
  background: var(--color-surface);
  box-shadow: none;
  transition: background-color var(--transition-fast), border-color var(--transition-fast);
}

.atm-check-label::before {
  display: none;
}

.mol-option-group input[type="radio"]:checked + .atm-check-label {
  border-color: var(--color-primary-dark);
  background: var(--color-primary-lighter);
  box-shadow: inset 0 0 0 1px var(--color-primary-dark);
}

.mol-option-group input[type="radio"]:checked + .atm-check-label .atm-check-label__text {
  color: var(--color-primary-dark);
  font-weight: var(--font-weight-bold);
}

.atm-check-label__emoji {
  font-size: 1.65rem;
}

.atm-check-label__text {
  color: var(--color-text-dark);
  font-size: var(--font-size-md);
  word-break: keep-all;
}

#result-card,
#result-capture-area {
  background: transparent;
}

#result-capture-area {
  padding: 0;
  border-radius: 0;
}

.result-relation-label {
  margin: 0 0 var(--space-xs);
  color: var(--color-primary-dark);
  font-weight: var(--font-weight-semibold);
  text-align: center;
}

.result-score-panel {
  margin-bottom: var(--space-lg);
  padding: clamp(var(--space-lg), 4vw, var(--space-xxl));
  border: 0;
  border-radius: var(--border-radius-lg);
  background: var(--color-primary-lighter);
}

.result-score-panel h3,
.result-score-panel p {
  margin: 0;
}

.result-state-title {
  color: var(--color-text-dark);
  font-size: var(--font-size-lg);
}

.result-state-copy {
  color: var(--color-text-light);
  line-height: 1.7;
  word-break: keep-all;
}

.result-top-section,
.strong-scenes-card,
.trait-note-card,
.today-action,
.body-note {
  margin: 0 0 var(--space-lg);
  padding: var(--space-lg);
  border: 0;
  border-radius: var(--border-radius-lg);
  box-shadow: none;
}

.result-top-section,
.strong-scenes-card,
.trait-note-card {
  background: var(--color-surface-muted, #f7f8fa);
}

.result-top-section h3,
.strong-scenes-card h3,
.today-action h3,
.body-note h3 {
  margin: 0 0 var(--space-md);
  color: var(--color-primary-dark);
}

.top-domain-list {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: var(--space-md);
}

.top-domain-card {
  min-width: 0;
  padding: var(--space-md);
  border-radius: var(--border-radius-base);
  background: var(--color-surface);
}

.top-domain-card__head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: var(--space-sm);
  color: var(--color-text-dark);
  font-weight: var(--font-weight-semibold);
}

.top-domain-card__head > :first-child {
  min-width: 0;
}

.top-domain-card__score {
  flex: 0 0 auto;
  color: var(--color-primary-dark);
  font-size: var(--font-size-sm);
  font-weight: var(--font-weight-bold);
  text-align: right;
  white-space: nowrap;
}

.top-domain-card p,
.trait-note-card p,
.today-action p,
.body-note p {
  margin: var(--space-sm) 0 0;
  color: var(--color-text-light);
  line-height: 1.65;
  word-break: keep-all;
}

.today-action {
  background: var(--color-primary-lighter);
}

.today-action p {
  color: var(--color-text-dark);
  font-weight: var(--font-weight-medium);
}

.strong-scenes-card ul {
  margin: 0;
  padding: 0;
  list-style: none;
}

.strong-scenes-card li {
  padding: var(--space-sm) 0;
  color: var(--color-text-dark);
  line-height: 1.6;
  word-break: keep-all;
}

.strong-scenes-card li + li {
  border-top: 1px solid var(--color-border-light);
}

.result-details {
  margin: 0 0 var(--space-lg);
  border: 1px solid var(--color-border-light);
  border-radius: var(--border-radius-lg);
  background: var(--color-surface);
  overflow: hidden;
}

.result-details > summary {
  min-height: 3.25rem;
  padding: var(--space-md) var(--space-lg);
  color: var(--color-primary-dark);
  font-weight: var(--font-weight-semibold);
  cursor: pointer;
}

.result-details > summary:focus-visible {
  outline: 3px solid var(--focus-ring-color);
  outline-offset: -3px;
}

.result-details > div,
.result-details > ol {
  margin: 0;
  padding: 0 var(--space-lg) var(--space-lg);
}

.card[class*="atm-card--domain-"] {
  margin: 0;
  border: 0;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
}

.card[class*="atm-card--domain-"] + .card[class*="atm-card--domain-"] {
  border-top: 1px solid var(--color-border-light);
}

.atm-card__body {
  padding: var(--space-md);
}

.mol-domain-description {
  display: block;
  margin: 0;
  color: var(--color-text-light);
  line-height: 1.55;
}

#answer-review-list {
  list-style-position: inside;
}

#answer-review-list li {
  padding: var(--space-sm) 0;
  color: var(--color-text-light);
  line-height: 1.6;
}

#answer-review-list li + li {
  border-top: 1px solid var(--color-border-light);
}

.answer-review-value {
  display: inline-block;
  margin-left: var(--space-xs);
  color: var(--color-primary-dark);
  font-weight: var(--font-weight-semibold);
}

.body-note {
  background: var(--color-warm-beige);
}

body.tool-standard-ui .next-tools-list {
  display: grid;
  grid-template-columns: 1fr !important;
  gap: var(--space-md);
}

.next-tool-card {
  display: flex;
  min-height: 7rem;
  padding: var(--space-lg);
  flex-direction: column;
  justify-content: center;
  gap: var(--space-xs);
  border: 1px solid var(--color-border-light);
  border-radius: var(--border-radius-lg);
  background: var(--color-surface);
  color: var(--color-text-dark);
  text-decoration: none;
  transition: background-color var(--transition-fast), border-color var(--transition-fast);
}

.next-tool-card:focus-visible {
  outline: 3px solid var(--focus-ring-color);
  outline-offset: 3px;
}

.next-tool-card__title {
  color: var(--color-primary-dark);
  font-weight: var(--font-weight-bold);
}

.next-tool-card__desc {
  color: var(--color-text-light);
  font-size: var(--font-size-sm);
  line-height: 1.55;
}

@media (max-width: 48rem) {
  body.tool-standard-ui .tool-progress {
    display: grid !important;
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  }

  body.tool-standard-ui .domain-selection-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }

  .domain-btn {
    min-height: 5.25rem;
    padding: var(--space-sm);
    flex-direction: column;
  }

  .mol-option-group,
  .mol-option-group--binary,
  .mol-option-group--3choice {
    grid-template-columns: 1fr;
  }

  .mol-option-group .atm-check-label {
    min-height: 3.75rem;
    padding: var(--space-sm) var(--space-md);
    flex-direction: row;
    justify-content: flex-start;
  }

  .top-domain-list {
    grid-template-columns: 1fr;
  }

  body.tool-standard-ui .next-tools-list {
    grid-template-columns: 1fr !important;
  }

  .result-top-section,
  .strong-scenes-card,
  .trait-note-card,
  .today-action,
  .body-note {
    padding: var(--space-md);
  }
}

@media (prefers-reduced-motion: reduce) {
  .domain-btn,
  .atm-check-label,
  .next-tool-card {
    transition: none;
  }
}

@media (forced-colors: active) {
  .domain-btn,
  .atm-check-label,
  .result-score-panel,
  .today-action,
  .next-tool-card,
  .result-details {
    border: 1px solid CanvasText;
  }

  .mol-option-group input[type="radio"]:checked + .atm-check-label::before {
    background: Highlight;
  }
}

.result-warm-note {
  margin-top: var(--space-md);
  padding: var(--space-md);
  border-radius: var(--border-radius-base);
  background: var(--color-primary-lighter);
  color: var(--color-primary-dark);
  font-weight: var(--font-weight-medium);
}