/* QA fixes (Oct 2026). Loaded last so it wins over the layered legacy overrides
   without touching the approved source stylesheets. */

/* Hero: the particle caption row sat on the same baseline as the hero foot line,
   so "Disperse & reform" collided with the scroll hint. Lift it one row up. */
@media(min-width:641px){
  .particle-art .art-caption{bottom:58px!important}
  .particle-art #motion-toggle{bottom:110px!important}
}

/* Short desktop/tablet viewports: chapter copy ran under the rotation timeline. */
@media(min-width:641px) and (max-height:760px){
  .identity .chapters article:not(.chapter-ai){top:112px!important}
  .identity .chapters article:not(.chapter-ai) h2{font-size:clamp(34px,4.2vw,50px)!important;margin:6px 0 14px!important;line-height:1.12!important;height:auto!important}
  .identity .chapters article:not(.chapter-ai) h3{font-size:18px!important;margin-bottom:10px!important}
  .identity .chapters article:not(.chapter-ai)>p:not(.label):not(.chapter-craft){font-size:14px!important;line-height:1.6!important}
  .identity .chapters article:not(.chapter-ai) .chapter-craft{display:none!important}
}

/* Phone: the rotation timeline started flush against the screen edge. */
@media(max-width:640px){
  .story-timeline{left:var(--pad,20px)!important;right:var(--pad,20px)!important}
}

/* Keyboard users get a visible focus ring everywhere. */
:focus-visible{outline:2px solid #ffb829;outline-offset:3px}

/* Arabic chapter headlines: the tight Latin leading made stacked Arabic lines touch. */
html[dir="rtl"] .identity .chapters article:not(.chapter-ai) h2{line-height:1.14!important}
/* 2026-10-04 copy pass: calmer typography and lighter phone/tablet sections */
h1,h2,h3{text-wrap:balance}
p{text-wrap:pretty}
@media(max-width:640px){
  .intro .split>div:last-child>p:nth-child(2),
  .identity .chapters article>p:not(.label):not(.arabic):not(.chapter-craft),
  .stats-head>p:last-child{display:none!important}
}