/* ───────────── every form factor: phones from 320 px, foldables (cover, open, book posture), tablets, desktops ─────────────
   rules_design_review, 28-Oct-2026. The viewport meta carries viewport-fit=cover; see directory-blueprint/design/FOLD-LAYER.md. */

/* nothing wider than the screen: the search box may shrink inside its group (the group kept the box's full width, so at 401–440 px
   the light/dark button sat 33 px off the screen); a long name breaks inside its heading */
.an-end { min-width: 0; }
@media (max-width: 640px) { .an-end { flex: 1; } }
h1, h2, h3 { overflow-wrap: anywhere; }
.head { grid-template-columns: minmax(0, 1fr); }
.head > * { min-width: 0; }

/* the bar never sticks (the owner's standing rule: no sticky header on any site) */
.an-bar { position: relative; }

/* safe areas: notches, rounded corners and the home bar */
.an-bar .an-in, .an-foot .an-in, .an-foot .an-base { padding-left: max(20px, env(safe-area-inset-left)); padding-right: max(20px, env(safe-area-inset-right)); }
.an-foot .an-base { padding-bottom: max(32px, env(safe-area-inset-bottom)); }
@media (max-width: 640px) { .an-bar .an-in { padding-left: max(14px, env(safe-area-inset-left)); padding-right: max(14px, env(safe-area-inset-right)); } }

/* touch: every target at least 44 px (links inside sentences excepted) */
@media (pointer: coarse) {
  .an-word { min-height: 44px; }
  .an-mode { width: 44px; height: 44px; }
  .an-seek { height: 46px; padding-right: 1px; }
  .an-seek input { align-self: stretch; }
  .an-seek button { width: 44px; height: 44px; }
  .an-strip a { display: inline-flex; align-items: center; min-height: 44px; }
  .an-foot ul { gap: 0; }
  .an-foot ul a, .an-foot .an-base a { display: inline-flex; align-items: center; min-height: 44px; min-width: 44px; }
  .siblings a, .btn, .btn.line { min-height: 44px; }
  .letters a, .pager a { min-width: 44px; min-height: 44px; }
  .more, .crumbs a, .den-crumbs a { display: inline-block; padding-block: 12px; margin-block: -12px; }
  aside li a { display: inline-block; padding-block: 11px; margin-block: -11px; }
  .crumbs a, .den-crumbs a { padding-inline: 3px; margin-inline: -3px; }
  details.photo-credits > summary { display: flex; align-items: center; min-height: 44px; }
  .den-sections a { min-height: 44px; }
}

/* book posture (a foldable half-open like a book): nothing across the fold. The page keeps equal margins so the gap between two
   columns lands on the fold; grids put one column on each half, a page's opening words and running text keep to the left half. */
@media (horizontal-viewport-segments: 2) {
  :root { --seg0: env(viewport-segment-width 0 0, 50vw); --fold-gap: calc(env(viewport-segment-left 1 0, 0px) - env(viewport-segment-right 0 0, 0px) + 32px); --fold-page: calc(var(--seg0) - 32px); }
  .wrap, .an-bar .an-in, .an-foot .an-in, .an-foot .an-base, .den-wrap { padding-left: 16px; padding-right: 16px; }
  .hero, .t-hero, .band, .co, .den-cols, .den-lead a { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); column-gap: var(--fold-gap); }
  .doors, .board3, .stories, .gets, .how, .den-grid, .den-grid--3, .passports, .cards, .ad-grid, .plans-w .grid, .an-foot .an-in { grid-template-columns: repeat(2, minmax(0, 1fr)); column-gap: var(--fold-gap); }
  .an-foot .an-in > :first-child { grid-column: auto; }
  .mosaic { grid-template-columns: repeat(2, minmax(0, 1fr)); column-gap: var(--fold-gap); }
  .mosaic .mcell:nth-child(n) { grid-column: auto; grid-row: auto; }
  .head, .lede, .den-head, .den-story, .seekbig, .an-strip, main section > h2, main section > p, main section > ul, main section > ol, .step { max-width: var(--fold-page); }
  .an-end { max-width: calc(var(--seg0) - 60px); margin-left: auto; }
}

/* ── v2 (28-Oct-2026 afternoon, after the full 45-viewport live matrix): the last small targets, book posture on every page type ── */
@media (pointer: coarse) {
  .ym-policy-links a { display: inline-block; min-width: 44px; text-align: center; padding-block: 14px; margin-block: -14px; }
  .facttable dd a { display: inline-block; padding-block: 14px; margin-block: -14px; }
  .den-chip, .den-tags a, .comment-form input[type=submit] { min-height: 44px; display: inline-flex; align-items: center; }
  .den-pager .page-numbers { display: inline-flex; align-items: center; justify-content: center; min-width: 44px; min-height: 44px; box-sizing: border-box; }
  .box li > a { display: flex; align-items: center; min-height: 44px; }
}
@media (horizontal-viewport-segments: 2) {
  /* the article column on the left page, its side column on the right */
  .cols { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); column-gap: var(--fold-gap); }
  .cols > * { min-width: 0; }
  .passport, .svc-head { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); column-gap: var(--fold-gap); }
  .passports, .listgrid { grid-template-columns: repeat(2, minmax(0, 1fr)); column-gap: var(--fold-gap); }
  .plans-w .grid > li { grid-column: auto; }
  .guide-card > header { max-width: calc(var(--fold-page) - 46px); }   /* the card pads 23 px each side */
  .an-foot > .ym-policy-links { padding-left: 16px; padding-right: 16px; box-sizing: border-box; max-width: var(--seg0); }
  .intro, .section > header, .den-mast, .facttable, .scroll, .wrap > p, main#main > p, .ym-policy-links { max-width: var(--fold-page); margin-left: 0; margin-right: auto; flex-wrap: wrap; }
  .den-main img.attachment-large { max-width: var(--fold-page); height: auto; }
}

/* ── v3 (28-Oct-2026 night; helper 34 for lead 68): what the finer book-posture check (loose inline text, every link and picture) found on v2 — the submit page's
   plans sit in a block that keeps to the left half, so v2's two-page split made 124 px plan cards whose words ran over the fold; the
   guides' passports carry their columns in a style attribute (three across at 954); crumb trails, the WordPress section pills and the
   footer's base line crossed the fold. ── */
@media (horizontal-viewport-segments: 2) {
  main .plans-w .grid { grid-template-columns: minmax(0, 1fr); }
  main div.passports[style] { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; column-gap: var(--fold-gap) !important; }
  main nav.crumbs, nav.den-crumbs { max-width: var(--fold-page); }
  nav.den-sections { flex-wrap: wrap; overflow-x: visible; max-width: var(--fold-page); }
  .an-foot .an-base { flex-direction: column; align-items: flex-start; }
  .an-foot .an-base > * { max-width: var(--fold-page); }
}
/* v3, lead 68's stage findings (pre-existing on live): the /best/ software lists' rows take the two halves (one full-width column
   crossed the fold at 626), their name links get a 44 px tap height (23 px), and their action buttons wrap instead of running past a
   narrow screen (68 saw rows reach 341/373 px at 320/360 after resizing); the vendor page's one-column block (columns in a style
   attribute) keeps to the left half */
@media (pointer: coarse) { main#main ol.rows li.row a.nm { padding-block: 11px; margin-block: -11px; } }
main#main ol.rows li.row > .act { min-width: 0; max-width: 100%; }
main#main ol.rows li.row > .act .btn { max-width: 100%; white-space: normal; }
/* the row's action strip is a three-column grid (score, "Price on request" kept on one line, Visit) that needs ~251 px: in a 205 px
   half at book posture, or a narrow phone, the Visit button ran 46 px past its row — there the button takes a line of its own */
@media (horizontal-viewport-segments: 2), (max-width: 480px) {
  main#main ol.rows li.row > .act { grid-template-columns: auto minmax(0, 1fr); }
  main#main ol.rows li.row > .act > a.btn { grid-column: 1 / -1; justify-self: start; }
}
@media (horizontal-viewport-segments: 2) {
  main#main ol.rows { grid-template-columns: repeat(2, minmax(0, 1fr)); column-gap: var(--fold-gap); }
  main#main ol.rows > li { min-width: 0; }
  main#main > .wrap > .co[style*="grid-template-columns"] { max-width: var(--fold-page); margin-left: 0; margin-right: auto; }
}
/* v3: on the software lists the prose sections' paragraphs kept the site's own measure (its .prose rule outranks v2's cap), the
   padded "basis" box and the questions ran the full width, and at 954 the bar's strip links ran past their capped box */
@media (horizontal-viewport-segments: 2) {
  main#main .section.prose :is(p, li) { max-width: var(--fold-page); }
  main#main .basis, main#main section.faq { max-width: var(--fold-page); margin-left: 0; margin-right: auto; }
  header.an-bar nav.an-strip { flex-wrap: wrap; overflow-x: visible; }
}