/* Equal4:5 story frames retain proportional source pixels and stable copy flow. */
@media (max-width:800px) {
  .assembled-page .assembled-stories-source-surface { background: #000; }
  .assembled-page .assembled-stories {
    --mobile-story-prose-width: 100%;
    --story-inline-inset: 16px;
    --story-header-clearance: calc(88px + env(safe-area-inset-top, 0px));
    height: auto;
    min-height: 0;
    margin-bottom: 0;
    background: #f7f7f3;
  }
  .assembled-page .assembled-story-track { height: var(--story-active-height, auto); align-items: flex-start; }
  .assembled-page .assembled-story-slide {
    position: relative;
    flex: 0 0 100%;
    width: 100%;
    height: auto;
    background: #f7f7f3;
    grid-template-columns: minmax(0, 1fr);
    grid-template-rows: auto minmax(0, 1fr);
  }
  .assembled-page .assembled-story-photo {
    grid-column: 1;
    grid-row: 1;
    width: 100%;
    height: auto;
    aspect-ratio: 4 / 5;
    justify-self: center;
    align-self: start;
    margin: 0;
    padding: 0;
  }
  .assembled-page .assembled-story-photo img {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    max-width: none;
    transform: none;
    object-fit: cover;
    object-position: 50% 50%;
  }
  .assembled-page .assembled-story-photo-44 img {
    /* V8: preserve scale and the horizontal window; shift the source window
       down 210 original pixels (3120..8349.869 -> 3330..8559.869). */
    inset: auto;
    top: -63.672722968778%;
    left: 68%;
    width: auto;
    max-width: none;
    height: 166.9449081803005%;
    transform: translateX(-68%);
    object-fit: fill;
    object-position: 50% 50%;
  }
  /* Large viewport units remain stable during browser chrome movement. */
  .assembled-page[data-page="home"] { --mobile-home-large-height: 100vh; }
  @supports (height: 100lvh) {
    .assembled-page[data-page="home"] { --mobile-home-large-height: 100lvh; }
  }
  .assembled-page[data-page="home"] .rr-hero,
  .assembled-page[data-page="home"] .assembled-dp-places.dp-archive {
    height: max(var(--mobile-home-photo-height, var(--mobile-visible-height, 100vh)), var(--mobile-home-large-height));
    min-height: max(var(--mobile-home-photo-height, var(--mobile-visible-height, 100vh)), var(--mobile-home-large-height));
  }
  .assembled-page[data-page="home"] .rr-hero > img {
    width: max(var(--mobile-home-photo-height, var(--mobile-visible-height, 100vh)), var(--mobile-home-large-height));
  }
  .assembled-page .assembled-story-copy {
    grid-column: 1;
    grid-row: 2;
    align-self: stretch;
    width: 100%;
    max-width: none;
    margin: 0;
    padding: 22px var(--story-inline-inset) 84px;
    background: #f7f7f3;
  }
  .assembled-page .assembled-story-copy h3,
  .assembled-page[data-page="home"] .assembled-story-copy p {
    width: 100%;
    max-width: none;
    margin-inline: 0;
  }
  .assembled-page[data-page="home"] .assembled-story-copy p {
    text-align: justify;
    text-align-last: left;
    text-wrap: wrap;
    hyphens: none;
    -webkit-hyphens: none;
    word-break: normal;
    overflow-wrap: normal;
  }
  .assembled-page .assembled-story-link {
    position: absolute;
    right: var(--story-inline-inset);
    bottom: 18px;
    margin: 0;
  }
  .assembled-page .assembled-story-tools {
    left: var(--story-inline-inset);
    right: auto;
    bottom: 18px;
    width: auto;
    display: flex;
    justify-content: flex-start;
    gap: 8px;
  }
  .assembled-page .assembled-story-tools [data-assembled-story-counter] { text-align: center; }
  .assembled-page[data-page="home"] .hermes-collection {
    background: #000;
    color: #f7f7f4;
  }
  .assembled-page .assembled-ferment .diagram-label.is-zone-active :is(h3, p) { font-weight: 700; }
  /* Amiri has one approved normal face. Allow weight synthesis only for these
     explicitly bold popup headings; the site's global synthesis stays off. */
  .assembled-page .assembled-ferment .diagram-label.is-zone-active h3 { font-synthesis: weight; }
  .assembled-ferment :is(.label-3,.label-0) { top: var(--mobile-caption-inset, 0px); }
  .assembled-ferment :is(.label-4,.label-1,.label-2) { top: calc(-1 * var(--mobile-caption-inset, 0px)); }
  .assembled-page .portal-stage { height: var(--mobile-visible-height, 100svh); }
  /* The fallback is only for a non-initialized portal. Never stack a second
     red icon on the moving mask; the poster supplies the first masked frame. */
  .assembled-page .assembled-portal[data-portal-initialized] .portal-static-icon { visibility: hidden; }
  .assembled-page .assembled-portal[data-portal-initialized] .portal-media { opacity: 1; }
}
@media (min-width:661px) and (max-width:800px) {
  .assembled-page .assembled-story-slide {
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
    grid-template-rows: minmax(0, 1fr);
  }
  .assembled-page .assembled-story-photo { grid-column: 1; grid-row: 1; }
  .assembled-page .assembled-story-copy { grid-column: 2; grid-row: 1; align-self: center; }
  .assembled-page .assembled-story-tools { left: calc(50% + var(--story-inline-inset)); }
}
@media (max-width:360px) {
  .assembled-page .assembled-stories { --story-inline-inset: 12px; }
}
