/**
 * Editorial layer — diagnostic phases (01–05)
 * Calm spacing, typography-first, open layout. Loads after page + chrome CSS.
 * Scoped with html.phase-page-min
 */

html.phase-page-min {
  --ed-measure: min(40rem, 92vw);
  --ed-space-lg: clamp(2rem, 6vw, 4rem);
  --ed-space-md: clamp(1.25rem, 4vw, 2.25rem);
  --ed-space-sm: clamp(0.75rem, 2vw, 1.25rem);
  --ed-line: rgba(232, 224, 212, 0.07);
  --ed-faint: rgba(232, 224, 212, 0.42);
}

/* —— Single focal column —— */
html.phase-page-min #flow-wrap .main-col,
html.phase-page-min #summary {
  max-width: var(--ed-measure);
  margin-left: auto;
  margin-right: auto;
}

html.phase-page-min #summary .diag-body,
html.phase-page-min #summary .diag-section,
html.phase-page-min #summary .m2-diagnosis,
html.phase-page-min #summary .m2-meaning,
html.phase-page-min #summary .m2-action,
html.phase-page-min #summary .p3-diagnosis,
html.phase-page-min #summary .p3-meaning,
html.phase-page-min #summary .p3-action {
  max-width: 100%;
}

html.phase-page-min #summary p,
html.phase-page-min #summary .diag-body p {
  max-width: 38rem;
}

/* —— Bridge / instinct: open, no card box —— */
html.phase-page-min .instinct-block {
  border: none !important;
  border-top: 1px solid var(--ed-line) !important;
  background: transparent !important;
  box-shadow: none !important;
  padding: var(--ed-space-lg) 0 !important;
  margin-bottom: var(--ed-space-lg) !important;
}

html.phase-page-min .instinct-kicker {
  opacity: 0.55;
  margin-bottom: var(--ed-space-sm) !important;
}

html.phase-page-min .instinct-h2 {
  font-size: clamp(1.5rem, 3.8vw, 2rem) !important;
  line-height: 1.22 !important;
  margin-bottom: var(--ed-space-sm) !important;
}

html.phase-page-min .instinct-sub {
  font-size: 15px !important;
  opacity: 0.88;
  margin-bottom: var(--ed-space-md) !important;
}

html.phase-page-min .instinct-reality {
  border-top-color: var(--ed-line) !important;
  padding-top: var(--ed-space-md) !important;
}

/* —— Questions: headline + quiet meta —— */
html.phase-page-min .step-header {
  margin-bottom: var(--ed-space-lg) !important;
}

html.phase-page-min .step-instruction {
  font-size: clamp(1.65rem, 4vw, 2.35rem) !important;
  line-height: 1.16 !important;
  font-weight: 300 !important;
  letter-spacing: -0.02em !important;
  max-width: var(--ed-measure);
}

html.phase-page-min .step-micro {
  font-size: 11px !important;
  letter-spacing: 0.1em !important;
  text-transform: uppercase;
  color: var(--ed-faint) !important;
  margin-top: 0.75rem !important;
}

html.phase-page-min .step-adaptive {
  font-size: 10px !important;
  letter-spacing: 0.06em !important;
  opacity: 0.5 !important;
  margin-bottom: 1rem !important;
}

/* —— Answer rows: light touch —— */
html.phase-page-min .option-list {
  gap: 10px !important;
}

html.phase-page-min .option-item {
  border: 1px solid var(--ed-line) !important;
  background: rgba(255, 255, 255, 0.015) !important;
  border-radius: 2px !important;
  padding: 1.1rem 1.2rem !important;
  font-size: 15px !important;
  line-height: 1.45 !important;
  box-shadow: none !important;
}

html.phase-page-min .option-item:hover {
  border-color: rgba(154, 130, 96, 0.22) !important;
  background: rgba(154, 130, 96, 0.04) !important;
}

html.phase-page-min .option-item.selected {
  border-color: rgba(154, 130, 96, 0.45) !important;
  background: rgba(154, 130, 96, 0.06) !important;
}

/* —— Progress: separator only —— */
html.phase-page-min .capture-layout--chrome #flow.flow--chrome .diag-progress-stack {
  border-top-color: var(--ed-line) !important;
  margin-top: var(--ed-space-md) !important;
  padding-top: var(--ed-space-md) !important;
}

html.phase-page-min .diag-progress-topline {
  margin-bottom: var(--ed-space-sm) !important;
}

html.phase-page-min .diag-progress-area {
  opacity: 0.5;
}

/* —— Collapsible maps: minimal chrome —— */
html.phase-page-min .diag-details {
  border: none !important;
  border-top: 1px solid var(--ed-line) !important;
  border-radius: 0 !important;
  background: transparent !important;
  margin-top: var(--ed-space-md) !important;
}

html.phase-page-min .diag-details__summary {
  padding: 12px 0 !important;
  color: var(--ed-faint) !important;
}

html.phase-page-min .diag-details__summary::before {
  opacity: 0.45;
  font-weight: 400;
}

html.phase-page-min .diag-details__body {
  padding: 0 0 var(--ed-space-sm) !important;
}

html.phase-page-min .rail.rail--embedded .rail-item {
  border: none !important;
  border-bottom: 1px solid var(--ed-line) !important;
  border-radius: 0 !important;
  padding: 10px 0 !important;
  background: transparent !important;
}

/* —— Live read: secondary, quieter —— */
html.phase-page-min .live-panel--chrome .live-panel__shell {
  border: none !important;
  border-top: 1px solid var(--ed-line) !important;
  background: rgba(12, 10, 9, 0.35) !important;
  box-shadow: none !important;
  border-radius: 0 !important;
}

html.phase-page-min .live-panel__shell > summary {
  opacity: 0.85;
}

html.phase-page-min .live-field {
  border-bottom-color: var(--ed-line) !important;
  padding: 12px 16px !important;
}

html.phase-page-min .live-label {
  opacity: 0.55;
  font-size: 8px !important;
}

/* Non-chrome live panel (older markup on some pages) */
html.phase-page-min .live-panel:not(.live-panel--chrome) {
  border: none !important;
  border-top: 1px solid var(--ed-line) !important;
  box-shadow: none !important;
  background: rgba(12, 10, 9, 0.25) !important;
}

html.phase-page-min .live-panel-head {
  border-bottom-color: var(--ed-line) !important;
}

/* —— Decision blocks (M2 / P3 / similar) —— */
html.phase-page-min .m2-decision-block,
html.phase-page-min .p3-decision-block {
  border: none !important;
  border-top: 1px solid var(--ed-line) !important;
  background: transparent !important;
  padding: var(--ed-space-lg) 0 !important;
  border-radius: 0 !important;
}

html.phase-page-min .diag-h {
  font-size: 9px !important;
  letter-spacing: 0.2em !important;
  opacity: 0.5 !important;
  margin-bottom: 0.5rem !important;
}

html.phase-page-min .summary-title {
  font-size: clamp(1.6rem, 4vw, 2.1rem) !important;
  line-height: 1.15 !important;
  margin-bottom: 0.5rem !important;
}

html.phase-page-min .summary-sub {
  font-size: 14px !important;
  line-height: 1.65 !important;
  opacity: 0.75;
  margin-bottom: var(--ed-space-lg) !important;
}

html.phase-page-min .diag-section {
  margin-bottom: var(--ed-space-md) !important;
}

/* —— Buttons: one calm primary —— */
html.phase-page-min .btn-solid,
html.phase-page-min .btn-terminal {
  box-shadow: none !important;
  filter: none !important;
  border-radius: 2px !important;
  letter-spacing: 0.18em !important;
}

html.phase-page-min .btn-ghost {
  opacity: 0.72;
  border-color: var(--ed-line) !important;
  box-shadow: none !important;
}

html.phase-page-min .magnetic {
  /* keep interaction script; soften visual expectation */
  transition: opacity 0.2s ease, border-color 0.2s ease !important;
}

/* —— Rail (legacy column): lighter —— */
html.phase-page-min .rail-item {
  border-left-width: 1px !important;
  border-left-color: var(--ed-line) !important;
  padding: 12px 0 12px 14px !important;
}

html.phase-page-min .rail-item.active {
  border-left-color: rgba(154, 130, 96, 0.5) !important;
}

/* —— Nav row back —— */
html.phase-page-min .nav-row {
  margin-top: var(--ed-space-lg) !important;
}

/* —— Capture result: editorial measure —— */
html.phase-page-min .result-decision,
html.phase-page-min .result-section {
  max-width: var(--ed-measure);
}

html.phase-page-min .result-breakdown-details {
  border: none !important;
  border-top: 1px solid var(--ed-line) !important;
  background: transparent !important;
  margin-top: var(--ed-space-md) !important;
}

html.phase-page-min .result-breakdown-details > summary {
  padding: 14px 0 !important;
}

/* —— Grid: more air —— */
html.phase-page-min .capture-layout--chrome {
  gap: 28px 36px !important;
}

@media (max-width: 960px) {
  html.phase-page-min .capture-layout--chrome {
    gap: var(--ed-space-lg) !important;
  }
}

/* —— Structure supporting details —— */
html.phase-page-min .p3-supporting-details {
  border: none !important;
  border-top: 1px solid var(--ed-line) !important;
  background: transparent !important;
}

html.phase-page-min .p3-supporting-details > summary {
  padding: 14px 0 !important;
}

/* —— Fixed flow bar (interactive.js): calmer primary —— */
html.phase-page-min .sh-flow-end__pri {
  background: rgba(154, 130, 96, 0.92) !important;
  background-image: none !important;
  color: #0c0a09 !important;
  border: 1px solid transparent !important;
}

html.phase-page-min .sh-flow-end {
  border-top-color: var(--ed-line) !important;
  background: rgba(8, 7, 6, 0.88) !important;
}

html.phase-page-min .sh-flow-end__saved {
  opacity: 0.65;
}