/* The homepage from 1200 (run 4 P6, D-097): two tracks either side of the light, the reading
   pages' law (WINNER.md 15.7). The left track ends 6vw short of the column (57vw) and the right
   one starts 9vw past it, clear of a row's placard as it turns in the light (to about 67vw): the
   lane is 15vw, the band's limit. The why's prose stays left at its measure and its closing line
   stands right; each committee row's name stands left and its line right; from 900 (it was 1200
   until the tablet sweep: at 1024 the middle left 42 to 55 percent of the screen bare). From 600 to
   899, where the light stands at the right edge (80vw), the copy takes the reading pages' tablet
   measure (32.5em, never past 70vw) instead of the phone's 34 characters. Linked from
   src/pages/index.astro with media="(min-width: 600px)", so a phone never waits for it and the
   homepage's document stays inside the first round trip (D-023); the html prefix outranks the
   page's inlined rules whatever their order. */
@media (max-width: 899px) {
  html .home { --measure: min(32.5em, 70vw); }
}
/* A phone on its side (600 wide and over, so this sheet is on it): the crest beside the year a fifth
   of the height (run 6, D-120; here rather than in the homepage's document). */
@media (max-height: 500px) and (orientation: landscape) and (max-width: 899px) {
  html .hero .hero-crest { --mark-w: 20vh; }
}
@media (min-width: 900px) {
  /* Run 6 (P2, D-119): a desktop without the renderer (the Minimal tier, reduced motion, no WebGL)
     shows the served crest on the beam, where the lit crest stands in the Full tier, so the static
     hero is composed, not emptied; from 1200 to 2199, where the lane between the copy and the rail
     holds it clear of every line (at 1024 the lane is narrower than the crest, from 2200 the beam
     stands over the rail). The phone places the same element beside the year (D-120). */
  @media (min-width: 1200px) and (max-width: 2199px) {
  html:not([data-stage]) .hero-crest {
    display: block;
    position: absolute;
    left: calc(var(--col-x) - min(9rem, 17vh));
    top: calc(var(--head-h) + 36vh); /* under the year, in the lane between the copy and the rail */
    width: min(18rem, 34vh);
    color: var(--ember-100);
    pointer-events: none;
  }
  }
  html .why,
  html .committees { width: 100%; }
  html .why,
  html .committee-row a { display: grid; grid-template-columns: calc(51vw - var(--gutter)) 1fr; column-gap: 15vw; }
  html .why { row-gap: var(--space-5); }
  html .why-body { display: contents; }
  html .why::before,
  html .why > *,
  html .why-body > * { grid-column: 1; }
  html .why-body .why-close { grid-area: 2 / 2 / span 3; align-self: center; }
  html .committee-row a { align-content: center; }
  html .committee-abbr { grid-area: 1 / 1; }
  html .committee-full { grid-area: 2 / 1; }
  html .committee-desc { grid-area: 1 / 2; align-self: end; }
  html .committee-track { grid-area: 2 / 2; }
  /* Run 5 (P4, D-116): from 1200 each row's official emblem stands in its left track between the
     name and the light's lane (its right edge at 43vw, clear of the row's placard), so a short name
     (IP, FIA) no longer leaves a third of the width bare; painted in the ember from the same mask as /committees (D-114), from this stylesheet, so
     the homepage's document carries none of it. */
  @media (min-width: 1200px) {
    html .committee-row a::after {
      content: '';
      grid-area: 1 / 1 / span 2;
      justify-self: end;
      align-self: center;
      margin-right: 8vw; /* clear of the row's placard, whose left edge turns out to about 45vw */
      width: 6.5rem;
      height: 6.5rem;
      background-color: var(--ember-500);
      opacity: 0.8;
      -webkit-mask: var(--emblem-src) center / contain no-repeat;
      mask: var(--emblem-src) center / contain no-repeat;
      pointer-events: none;
    }
    html .committee-row[data-shard='DISEC'] { --emblem-src: url(/emblems/disec.webp); }
    html .committee-row[data-shard='UNHRC Junior'] { --emblem-src: url(/emblems/unhrc-junior.svg); }
    html .committee-row[data-shard='FIA'] { --emblem-src: url(/emblems/fia.webp); }
    html .committee-row[data-shard='IP'] { --emblem-src: url(/emblems/ip.webp); }
    html .committee-row[data-shard='UNCSW'] { --emblem-src: url(/emblems/uncsw.webp); }
    html .committee-row[data-shard='Lok Sabha'] { --emblem-src: url(/emblems/lok-sabha.webp); }
  }
}
