/*
 * Overview opening screen on phones (October 8, 2026): the whole statistics
 * block (all four figures and their captions) within the first 740px at
 * 360 x 740, on both designs. Same approach as the 1858 census v27.1.
 *
 * Phone widths only (max-width: 800px). Tablet (820px and wider) and desktop
 * layouts are untouched. No content is hidden and no wording changes: hero
 * spacing, the historical-title type, the binding-fan stage and the statistic
 * figures are tightened. Builds on assets/phone-stats-v102.css.
 */
@media (max-width: 800px) {
  body[data-design] #t-overview:checked ~ .hero .hero-inner {
    padding-top: 12px !important;
    padding-bottom: 10px !important;
  }

  body[data-design] #t-overview:checked ~ .hero h1.bibliographical-title {
    margin: 0 0 4px !important;
  }

  body[data-design] #t-overview:checked ~ .hero .census-edition {
    margin: 3px 0 8px !important;
  }

  body[data-design] #t-overview:checked ~ .hero .full-historical-title {
    margin: 0 0 8px !important;
    font-size: 13.5px !important;
    line-height: 1.36 !important;
  }

  body[data-design] #t-overview:checked ~ .hero .author-credit {
    font-size: 13px !important;
    line-height: 1.36 !important;
  }

  /* Binding fan: slightly shorter stage; books sit a little higher so the
     label stays clear. */
  body[data-design] #t-overview:checked ~ .hero .hero-stage {
    min-height: 184px !important;
  }

  body[data-design] #t-overview:checked ~ .hero .hero-stage:not(.hero-single) .hero-book {
    inset: 43% auto auto 50% !important;
  }

  /* Statistics: slightly smaller figures and cells. */
  body[data-design] #t-overview:checked ~ .stats .stat {
    padding-top: 9px !important;
    padding-bottom: 9px !important;
  }

  body[data-design] #t-overview:checked ~ .stats .stat b {
    font-size: 36px !important;
    line-height: 1 !important;
  }

  body[data-design] #t-overview:checked ~ .stats .stat span {
    margin-top: 5px !important;
  }
}

/* Short phone screens (for example 375 x 667). */
@media (max-width: 800px) and (max-height: 700px) {
  body[data-design] #t-overview:checked ~ .hero .hero-stage {
    min-height: 176px !important;
  }

  body[data-design] #t-overview:checked ~ .stats .stat {
    padding-top: 7px !important;
    padding-bottom: 7px !important;
  }

  body[data-design] #t-overview:checked ~ .stats .stat b {
    font-size: 32px !important;
  }
}