/* Legacy <font face> replacement - single class covers both comma-spacing
   variants found in the pre-HTML5 survey (same font stack either way) */
.site-font {
	font-family: Verdana, Arial, Helvetica, sans-serif;
}

/* Legacy <font size> replacement - these map 1:1 to the CSS absolute-size
   keywords, which were designed to correspond to <font size="N">.
   size="-1"/"+1" (relative sizes) map to text-sm/text-lg respectively. */
.text-xs { font-size: xx-small; }  /* size="1" */
.text-sm { font-size: x-small;  }  /* size="2", size="-1" */
.text-md { font-size: medium;   }  /* size="3" */
.text-lg { font-size: large;    }  /* size="4", size="+1" */

/* One-off color override found in the survey */
.text-red { color: red; }

/* Standalone <center> replacement - only for non-redundant cases; anything
   already inside a centered table cell or <div align="center"> should just
   drop the <center> tag entirely rather than getting this class.
   text-align only centers inline content - the old <center> tag also
   centered block-level children (tables in particular), which text-align
   alone does not replicate, so give nested tables auto side margins too,
   matching <center>'s original dual behavior. Descendant selector (not
   just direct child) so it still works regardless of how deeply the
   table needing centering ends up nested. */
.center { text-align: center; }
.center table { margin-left: auto; margin-right: auto; }

/* Prevent oversized images (some source files hard-code width= well past
   a typical content column, e.g. news/news.0's 878px artwork scans) from
   forcing the whole content column wider than the viewport - that overflow
   is what breaks alignment between the main content and the separately
   laid-out tail nav table. Never shrinks images below their natural size
   on wide-enough windows, only caps growth on narrower ones.
   Scoped to .wide-img (hand-applied to the ~400px+ images in arch/media/
   mural/news/poem/topsrc-video that actually risk overflow), not a blanket
   img[width] rule - that broader version also caught small illustrative
   images elsewhere (e.g. overview.htm's ~150-310px photos), shrinking them
   inconsistently whenever they happened to sit in a table cell narrower
   than their declared size, even though they never risked overflow and
   were never meant to be responsive. A new large image needs this class
   added by hand (see 2026-08-14 survey of img width= values sitewide -
   everything <=316px stayed unstyled, only >=409px got tagged). */
.wide-img { max-width: 100%; height: auto; }

/* pix/big gallery-index images (_model/pix.tablerow) are deliberately NOT
   covered by img[width] above, and get no CSS sizing at all: each is one
   image per table row (not several competing side-by-side, unlike a
   typical thumbnail grid), so there's no overflow risk from letting it
   render at its full declared size. Also avoids the percentage-max-width
   circularity (browser needs the column's width to size the image, but
   the column's width is supposed to come from the image) that shrank the
   nav column in Firefox (see _model/head) - here it would've collapsed
   these images instead of growing them, which is what an earlier max-width
   version of this rule actually did. bin/pix.build's $thumbdims fix
   already gives these images explicit width=/height= HTML attributes
   (currently the "_md"/640px-class renditions), so plain unstyled <img>
   behavior is sufficient - they display at that full 640px size. */

/* Prev/next nav bar (_model/prevnext) - 3-column grid (not a table) so the
   middle tilde separator stays truly centered on the page - matching the
   plain separator bars above/below it - regardless of "<Previous" and
   "Next>" being different widths. The outer 1fr columns soak up the extra
   space so the middle "auto" column can't drift off-center; justify-self
   on the side spans keeps each one shrunk to its own text (not stretched
   to fill its column) so the blue highlight hugs just the text, and the
   three spans still butt up against each other with no gap. */
.prevnext-bar {
	display: grid;
	grid-template-columns: 1fr auto 1fr;
	align-items: center;
}
.prevnext-bar span { background-color: #99CCFF; padding: 2px 4px; }
.pn-prev { justify-self: end; width: 115px; }
.pn-next { justify-self: start; width: 115px; }
/* Anchor fills its whole span (padding included) so the extra width added
   to balance Previous/Next is part of the click target, not just visual. */
.pn-prev a, .pn-next a { display: block; }
.pn-prev a { text-align: right; }
.pn-next a { text-align: center; }

/* Left nav logo (_model/head, title2.jpg - a small 124x104 source stretched
   to fill the 165px-wide nav column). align="left" makes the browser apply
   a default UA-stylesheet margin (roughly 3px right, 3px bottom - the
   classic legacy spacing between a left-floated image and surrounding
   content), which the table's auto-layout then counts as part of the
   image's footprint when sizing the column - so the column always ended up
   ~3px wider than the image itself no matter what width the image was
   given, leaving a sliver of the column's blue bgcolor showing on the
   right. Zeroing the margin removes that phantom extra width rather than
   chasing it by further inflating the image. */
.nav-logo { margin: 0; }
