/* CHE evolution desktop readability & viewport fit | 2026-10-15.
   Isolated responsive overlay. Do not alter approved star SVG, desktop
   interaction/labels, mobile layout, or original creative source files. */
@media (min-width:1024px) {
  #che-page.che-canonical.che-desktop-vnext .che-evolution {
    --ev-muted:#4c555b;
  }
  #che-page.che-canonical.che-desktop-vnext .che-evolution[data-che-era="today"] {
    --ev-muted:#bdccc4;
  }
  /* Keep the scene dramatic without forcing a tall, multi-screen widget. */
  #che-page.che-canonical.che-desktop-vnext .che-evolution-scene {
    padding:clamp(19px,2.3vw,30px) clamp(24px,3vw,38px) 17px;
  }
  #che-page.che-canonical.che-desktop-vnext .che-evolution-scene-top {
    font-size:11px;
    line-height:1.4;
    letter-spacing:.10em;
  }
  #che-page.che-canonical.che-desktop-vnext .che-evolution-scene-grid {
    grid-template-columns:minmax(140px,.78fr) minmax(0,1.2fr);
    gap:clamp(24px,3vw,46px);
    padding:8px 0 0;
  }
  #che-page.che-canonical.che-desktop-vnext .che-evolution-symbol {
    height:clamp(154px,16.4vw,212px);
  }
  #che-page.che-canonical.che-desktop-vnext .che-evolution-symbol>.che-evolution-large-star {
    width:clamp(114px,12vw,160px);
    height:clamp(114px,12vw,160px);
  }
  #che-page.che-canonical.che-desktop-vnext .che-evolution-symbol-ring {
    width:min(76%,205px);
  }
  #che-page.che-canonical.che-desktop-vnext .che-evolution-state {
    font-size:11px;
    line-height:1.4;
    margin-bottom:8px;
  }
  #che-page.che-canonical.che-desktop-vnext .che-evolution-scene-copy h3 {
    max-width:19ch;
    font-size:clamp(28px,2.85vw,38px);
    line-height:1.14;
    margin:0 0 11px;
  }
  #che-page.che-canonical.che-desktop-vnext .che-evolution-scene-copy p {
    font-size:15px;
    line-height:1.5;
    max-width:56ch;
  }
  /* The controls remain full-size touch/keyboard operable, only the
     surrounding whitespace and visual lettering shrink. */
  #che-page.che-canonical.che-desktop-vnext .che-evolution-controls {
    padding:15px clamp(24px,3vw,38px) 13px;
  }
  #che-page.che-canonical.che-desktop-vnext .che-evolution-control-label {
    font-size:14px;
    line-height:1.42;
    margin-bottom:6px;
  }
  #che-page.che-canonical.che-desktop-vnext .che-evolution-rail {
    height:46px;
  }
  #che-page.che-canonical.che-desktop-vnext .che-evolution-options {
    margin-top:0;
  }
  #che-page.che-canonical.che-desktop-vnext .che-evolution-options button {
    min-height:44px;
    padding:5px 8px;
    margin:0 -8px;
    font-size:14px;
    line-height:1.32;
  }
  #che-page.che-canonical.che-desktop-vnext .che-evolution-option-index {
    font-size:10.5px;
    margin-bottom:2px;
  }
  #che-page.che-canonical.che-desktop-vnext .che-evolution-hint {
    font-size:12px;
    line-height:1.43;
    margin:6px 0 0;
  }
  #che-page.che-canonical.che-desktop-vnext .che-evolution-chapters {
    grid-template-columns:minmax(0,1fr) 24px minmax(0,1fr);
    gap:18px;
    padding:17px clamp(24px,3vw,38px) 19px;
  }
  #che-page.che-canonical.che-desktop-vnext .che-evolution-chapter {
    padding-left:14px;
    opacity:1;
  }
  #che-page.che-canonical.che-desktop-vnext .che-evolution-chapter-label {
    font-size:10.5px;
    line-height:1.35;
    margin-bottom:6px;
  }
  #che-page.che-canonical.che-desktop-vnext .che-evolution-chapter h4 {
    font-size:clamp(17px,1.55vw,21px);
    line-height:1.26;
    margin:0 0 7px;
  }
  #che-page.che-canonical.che-desktop-vnext .che-evolution-chapter p {
    font-size:13.5px;
    line-height:1.46;
  }
  #che-page.che-canonical.che-desktop-vnext .che-evolution-between {
    font-size:18px;
    line-height:1.7;
  }
  /* Regression fix: a desktop-only dark-background override had imposed
     pale #bfcac5 labels on the LIGHT panel, making them almost invisible.
     Set readable theme-specific colours for *both* chapters, not only the
     active one. CSS variables alone were previously overridden by che.css. */
  #che-page.che-canonical.che-desktop-vnext .che-evolution[data-che-era="earlier"] .che-evolution-chapter-label,
  #che-page.che-canonical.che-desktop-vnext .che-evolution[data-che-era="earlier"] .che-evolution-chapter p {
    color:#4d575d;
  }
  #che-page.che-canonical.che-desktop-vnext .che-evolution[data-che-era="earlier"] .che-evolution-chapter h4 {
    color:#222c31;
  }
  #che-page.che-canonical.che-desktop-vnext .che-evolution[data-che-era="today"] .che-evolution-chapter-label,
  #che-page.che-canonical.che-desktop-vnext .che-evolution[data-che-era="today"] .che-evolution-chapter p {
    color:#b9c8c0;
  }
  #che-page.che-canonical.che-desktop-vnext .che-evolution[data-che-era="today"] .che-evolution-chapter h4 {
    color:#f0f5ef;
  }
  #che-page.che-canonical.che-desktop-vnext .che-evolution[data-che-era="earlier"] [data-evolution-chapter="earlier"] .che-evolution-chapter-label,
  #che-page.che-canonical.che-desktop-vnext .che-evolution[data-che-era="earlier"] [data-evolution-chapter="earlier"] p {
    color:#414b50;
  }
  #che-page.che-canonical.che-desktop-vnext .che-evolution[data-che-era="today"] [data-evolution-chapter="today"] .che-evolution-chapter-label,
  #che-page.che-canonical.che-desktop-vnext .che-evolution[data-che-era="today"] [data-evolution-chapter="today"] p {
    color:#d6e3d9;
  }
}
@media (min-width:1024px) and (max-height:760px) {
  /* Small laptop browser viewports keep the whole control usable. */
  #che-page.che-canonical.che-desktop-vnext .che-evolution-scene {
    padding-block:16px 12px;
  }
  #che-page.che-canonical.che-desktop-vnext .che-evolution-symbol {
    height:148px;
  }
  #che-page.che-canonical.che-desktop-vnext .che-evolution-symbol-ring {
    width:min(70%,154px);
  }
  #che-page.che-canonical.che-desktop-vnext .che-evolution-symbol>.che-evolution-large-star {
    width:120px;height:120px;
  }
  #che-page.che-canonical.che-desktop-vnext .che-evolution-controls {
    padding-block:12px 10px;
  }
  #che-page.che-canonical.che-desktop-vnext .che-evolution-chapters {
    padding-block:13px 15px;
  }
}