/* Approved parchment study A, with shared paper tones and compact spacing. */
@font-face {
  font-family: "TL University Roman";
  src: local("UniversityRoman"), local("University Roman");
  font-style: normal;
  font-weight: 400;
  font-display: swap;
}

:root {
  --font-reading: "Times New Roman", "Liberation Serif", serif;
  --font-interface: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  --font-navigation: "TL University Roman", "University Roman", "UniversityRoman", Georgia, serif;
  --ink: #272218;
  --secondary: #4d412e;
  --link: #254719;
  --paper-surface: rgba(255, 245, 223, .18);
  --paper-hover: rgba(255, 245, 223, .32);
  --paper-pressed: rgba(233, 213, 174, .40);
  --paper-panel: rgba(255, 247, 228, .70);
  --paper-post: rgba(255, 249, 234, .78);
  --paper-heading: rgba(208, 178, 122, .36);
  --paper-recess: rgba(74, 56, 32, .07);
  --ornament: url("artwork/banner.jpg");
  --ornament-width: 4px;
  color: var(--ink);
  background: #b59e85;
  font-family: var(--font-reading);
  font-size: 18px;
  line-height: 1.55;
  -webkit-text-size-adjust: 100%;
  text-size-adjust: 100%;
}

* { box-sizing: border-box; }
body {
  margin: 0;
  min-height: 100vh;
  position: relative;
  isolation: isolate;
}
/* One original texture follows the viewport, not the document's height.
   Avoid repeating the non-seamless parchment or stretching it over a long topic. */
body::before {
  content: "";
  position: fixed;
  inset: 0;
  z-index: -1;
  pointer-events: none;
  background: #b59e85 url("artwork/parchment.jpg") center top / cover no-repeat;
}
a { color: var(--link); text-underline-offset: .16em; }
a:hover { color: #482f14; }
:where(a, button, input, select, summary):focus-visible {
  outline: 3px solid #173d0d;
  outline-offset: 4px;
}
h1, h2, h3, p { margin: 0; }
.visually-hidden {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip-path: inset(50%);
  white-space: nowrap;
  border: 0;
}

.skip-link {
  position: absolute;
  top: 8px;
  left: 8px;
  z-index: 5;
  padding: 9px 14px;
  color: var(--link);
  background: #fff9eb;
  font: 16px/1.5 var(--font-interface);
  transform: translateY(-160%);
}
.skip-link:focus { transform: translateY(0); }

.site-wrap {
  width: calc(100% - 32px);
  max-width: 1360px;
  margin: 15px auto 24px;
}
.brand { display: block; }
.brand img { display: block; width: 100%; height: auto; }

/* A 3px slice tiles the unmodified banner's mottled black-and-gold edge.
   The solid border remains as a fallback if artwork cannot be loaded. */
.archive-frame, .reading-panel, .site-nav a, .button, .post, .author-initials, .page-control {
  border: var(--ornament-width) solid #77621b;
  border-image-source: var(--ornament);
  border-image-slice: 3;
  border-image-width: var(--ornament-width);
  border-image-repeat: repeat;
  border-image-outset: 0;
  border-radius: 0;
}
.site-nav {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  align-items: stretch;
  gap: 6px;
  min-height: 62px;
  padding: 12px 5px 0;
}
.site-nav a {
  flex: 1 1 auto;
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 44px;
  min-width: 0;
  padding: 8px 18px;
  /* The frame supplies the one bottom rule; the tab keeps its layout space. */
  border-image-width: 4px 4px 0;
  border-bottom-color: transparent;
  background: linear-gradient(var(--paper-recess), var(--paper-recess)), var(--paper-surface);
  color: #2e2b18;
  font: 400 22.6667px/1.15 var(--font-navigation);
  letter-spacing: .1em;
  text-align: center;
  text-decoration: none;
  overflow-wrap: anywhere;
}
.site-nav a:is([aria-current="page"], [aria-current="location"]) {
  position: relative;
  z-index: 1;
  margin-bottom: -4px;
  padding-bottom: 12px;
  border-image-width: 4px 4px 0;
  border-bottom-color: transparent;
  color: #244419;
  background: var(--paper-surface);
  text-decoration: underline;
  text-underline-offset: .2em;
}
.site-nav a:hover, .button:not(:disabled):hover {
  color: #173700;
  background: var(--paper-hover);
}
.site-nav a:active, .button:not(:disabled):active {
  background: var(--paper-pressed);
  transform: translateY(1px);
}
/* An attached tab stays aligned and keeps the frame's exact parchment wash. */
.site-nav a:is([aria-current="page"], [aria-current="location"]):is(:hover, :active) {
  background: var(--paper-surface);
  transform: none;
}
.site-nav a:focus-visible { position: relative; z-index: 2; }
.site-nav a span, .button span { margin-left: .35em; }

/* Tabs and frame reveal one continuous viewport texture through the same wash. */
.archive-frame { background: var(--paper-surface); clip-path: var(--tab-opening, none); }
/* Cut the frame's top border underneath the selected tab, rather than hiding
   it with another translucent layer. The overlapping tab paints the gap once.
   Coordinates follow four equal tracks, 5px side insets and three 6px gaps. */
.site-wrap:has(.site-nav a:is([aria-current="page"], [aria-current="location"])) {
  --tab-opening: polygon(0 0, var(--tab-start) 0, var(--tab-start) 4px,
    var(--tab-end) 4px, var(--tab-end) 0, 100% 0, 100% 100%, 0 100%);
}
.site-wrap:has(.site-nav a:nth-child(1):is([aria-current="page"], [aria-current="location"])) {
  --tab-start: 9px;
  --tab-end: calc(25% - 6px);
}
.site-wrap:has(.site-nav a:nth-child(2):is([aria-current="page"], [aria-current="location"])) {
  --tab-start: calc(25% + 8px);
  --tab-end: calc(50% - 7px);
}
.site-wrap:has(.site-nav a:nth-child(3):is([aria-current="page"], [aria-current="location"])) {
  --tab-start: calc(50% + 7px);
  --tab-end: calc(75% - 8px);
}
.site-wrap:has(.site-nav a:nth-child(4):is([aria-current="page"], [aria-current="location"])) {
  --tab-start: calc(75% + 6px);
  --tab-end: calc(100% - 9px);
}
.archive-notice {
  padding: 8px 18px;
  border-bottom: 1px solid #9f854f;
  background: #eee0c1;
  color: var(--secondary);
  font: 14px/1.55 var(--font-interface);
}
main { padding: 20px 20px 24px; }
.page-heading { margin-bottom: 18px; }
.eyebrow {
  margin-bottom: 8px;
  color: #4d422c;
  font: 650 14px/1.55 var(--font-interface);
  letter-spacing: .025em;
}
h1 {
  color: #252719;
  font-size: 36px;
  font-weight: 400;
  line-height: 1.25;
}
.intro { margin-top: 12px; font-size: 20px; line-height: 1.55; }
h3 {
  color: #2b2e1b;
  font-size: 22px;
  font-weight: 400;
  line-height: 1.4;
}
.reading-panel { background: var(--paper-panel); scroll-margin-top: 20px; }
.reading-panel h2 {
  padding: 9px 20px;
  border-bottom: 1px solid #a38a58;
  background: var(--paper-heading);
  color: #282716;
  font-size: 26px;
  font-weight: 400;
  line-height: 1.3;
}
.reading-content { padding: 16px 20px 18px; overflow-wrap: anywhere; }
.reading-content p { max-width: 70ch; }
.reading-content p + p { margin-top: 12px; }
.reading-content h3 { margin: 18px 0 10px; }
.reading-content ul, .reading-content ol { margin: 12px 0; padding-left: 1.5em; }
.reading-content li + li { margin-top: 6px; }
.metadata {
  color: var(--secondary);
  font: 14px/1.55 var(--font-interface);
  overflow-wrap: anywhere;
}
.secondary-note {
  color: var(--secondary);
  font: 13px/1.6 var(--font-interface);
}
.sample-quote {
  margin: 22px 0;
  padding: 14px 18px;
  border-left: 3px solid #8d7645;
  background: #f0e4ca;
  font-size: 17px;
  line-height: 1.6;
}
.glyph-samples {
  margin-top: 24px;
  padding-top: 22px;
  border-top: 1px solid #b69c68;
}
.glyph-samples p + p { margin-top: 10px; }
.glyph-samples .metadata:not(:first-child) { margin-top: 22px; }
.glyph-navigation {
  font: 400 22.6667px/1.5 var(--font-navigation);
  letter-spacing: .1em;
}
.reading-panel + .reading-panel { margin-top: 16px; }
.sample-navigation {
  display: flex;
  flex-wrap: wrap;
  gap: 10px 20px;
  margin: 18px 0 24px;
  font: 14px/1.55 var(--font-interface);
}
.sample-note {
  margin-top: 18px;
  color: var(--secondary);
  font: 14px/1.55 var(--font-interface);
}
.reading-content code {
  font-family: ui-monospace, "Cascadia Code", "Courier New", monospace;
  font-size: .9em;
  white-space: normal;
  overflow-wrap: anywhere;
}
.reading-content .snapshot {
  margin-top: 22px;
  color: var(--secondary);
  font: 14px/1.55 var(--font-interface);
}
.button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 44px;
  max-width: 100%;
  margin-top: 22px;
  padding: 9px 16px;
  background: var(--paper-surface);
  color: var(--link);
  font: 600 15px/1.4 var(--font-interface);
  text-align: center;
  text-decoration: none;
  cursor: pointer;
  overflow-wrap: anywhere;
}
.button:disabled {
  color: #625843;
  background: #e1d8c8;
  cursor: not-allowed;
  opacity: 1;
}
.sample-fields {
  min-width: 0;
  margin: 22px 0 0;
  padding: 20px;
  border: 1px solid #9b8455;
}
.sample-fields legend {
  max-width: 100%;
  padding: 0 8px;
  color: var(--secondary);
  font: 600 14px/1.55 var(--font-interface);
  overflow-wrap: anywhere;
}
.field { min-width: 0; }
.field + .field { margin-top: 16px; }
.field label, .check-field {
  color: var(--ink);
  font: 15px/1.5 var(--font-interface);
}
.field label { display: block; margin-bottom: 6px; font-weight: 600; }
.field input, .field select {
  display: block;
  width: 100%;
  min-width: 0;
  min-height: 44px;
  padding: 10px;
  border: 1px solid #806b42;
  border-radius: 0;
  background: #fffaf0;
  color: var(--ink);
  font: 16px/1.5 var(--font-interface);
}
.field input::placeholder { color: #635b4b; opacity: 1; }
.field-help {
  margin-top: 8px;
  color: var(--secondary);
  font: 14px/1.55 var(--font-interface);
}
.check-field {
  display: flex;
  align-items: center;
  gap: 12px;
  min-height: 44px;
  margin-top: 12px;
  padding: 8px 0;
  cursor: pointer;
}
.check-field input {
  flex: none;
  width: 20px;
  height: 20px;
  margin: 0;
  accent-color: #214b21;
}
.check-field span { min-width: 0; }
.button-row { display: flex; flex-wrap: wrap; gap: 10px 16px; margin-top: 16px; }
.button-row .button { margin-top: 0; }
.sample-details { margin-top: 24px; }
.sample-details summary.button {
  display: list-item;
  width: fit-content;
  margin-top: 0;
  list-style-position: inside;
}
.sample-details[open] summary { background-color: #e8d1aa; }
.details-content { margin-top: 18px; }

/* Discussion reading: the author column is quiet; the post body keeps the width. */
.breadcrumbs {
  margin-bottom: 12px;
  color: var(--secondary);
  font: 14px/1.6 var(--font-interface);
}
.breadcrumbs ol {
  display: flex;
  flex-wrap: wrap;
  gap: 6px 10px;
  margin: 0;
  padding: 0;
  list-style: none;
}
.breadcrumbs li { min-width: 0; overflow-wrap: anywhere; }
.breadcrumbs li + li::before { margin-right: 10px; content: "›"; }
.topic-header { margin-bottom: 16px; }
.topic-header h1 { max-width: 28ch; overflow-wrap: anywhere; scroll-margin-top: 20px; }
.topic-summary, .topic-page-count, .topic-return {
  color: var(--secondary);
  font: 14px/1.6 var(--font-interface);
}
.topic-summary { margin-top: 8px; }
.discussion-notice {
  max-width: 78ch;
  margin-top: 18px;
  padding: 12px 16px;
  border-left: 3px solid #8d7645;
  background: #eee0c1;
  color: var(--secondary);
  font: 14px/1.6 var(--font-interface);
}
.topic-toolbar {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 10px 16px;
  margin: 14px 0;
}
.topic-page-count { margin: 0; }
.pagination { min-width: 0; max-width: 100%; }
.pagination-list {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 6px;
  margin: 0;
  padding: 0;
  list-style: none;
}
.pagination-list li { min-width: 0; max-width: 100%; }
.page-control {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 44px;
  min-height: 44px;
  max-width: 100%;
  padding: 8px 12px;
  background: var(--paper-surface);
  color: var(--link);
  font: 600 15px/1.4 var(--font-interface);
  text-align: center;
  text-decoration: none;
  overflow-wrap: anywhere;
}
.page-control[href]:hover {
  background: var(--paper-hover);
  color: #173700;
}
.page-control[href]:active {
  background: var(--paper-pressed);
  transform: translateY(1px);
}
.page-control[aria-current="page"] { background: #3b4a25; color: #fff9eb; }
.page-control[aria-disabled="true"] { background: #e1d8c8; color: #625843; }
.page-direction { gap: 5px; }
.topic-return { color: var(--link); padding: 10px 0; }
.discussion-posts { display: grid; gap: 12px; }
.post {
  display: grid;
  grid-template-columns: 170px minmax(0, 1fr);
  min-width: 0;
  background: var(--paper-post);
  scroll-margin-top: 20px;
}
.post:target {
  outline: 3px solid #173d0d;
  outline-offset: 4px;
}
.post-author {
  min-width: 0;
  padding: 12px 14px;
  border-right: 1px solid #b39a6f;
  background: rgba(201, 173, 124, .28);
}
.author-initials {
  --ornament-width: 3px;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 58px;
  height: 58px;
  margin-bottom: 12px;
  background: #f2e7cd;
  color: #45502b;
  font: 30px/1 var(--font-reading);
}
.author-details { min-width: 0; }
.author-name {
  color: #214b21;
  font: 650 16px/1.5 var(--font-interface);
  overflow-wrap: anywhere;
}
.author-note {
  margin-top: 4px;
  color: var(--secondary);
  font: 14px/1.55 var(--font-interface);
}
.post-content { min-width: 0; }
.post-header {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 4px 14px;
  min-height: 44px;
  margin: 0 18px;
  padding: 0;
  border-bottom: 1px solid rgba(114, 88, 45, .42);
}
.post-date, .post-header h2 {
  color: var(--secondary);
  font: 14px/1.55 var(--font-interface);
}
.post-header h2 { margin: 0; }
.post-permalink {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  min-height: 44px;
  padding: 8px 0;
  font-weight: 600;
}
.post-body {
  min-width: 0;
  padding: 12px 18px 14px;
  font-size: 18px;
  line-height: 1.55;
  overflow-wrap: anywhere;
}
.post-body p { max-width: 70ch; }
.source-post-body { max-width: 70ch; overflow-wrap: anywhere; }
.source-post-body .post-image img { width: auto; max-width: 100%; height: auto; }
.post-avatar { display: block; width: auto; height: auto; max-width: 96px; max-height: 120px; margin-bottom: 12px; object-fit: contain; }
.post-signature { max-width: 70ch; padding-top: 8px; border-top: 1px solid #c4b18a; color: #6a604f; font-size: 16px; line-height: 1.5; overflow-wrap: anywhere; }
.post-signature > .metadata { margin-bottom: 8px; }
.source-signature .post-image img { width: auto; max-width: 100%; height: auto; }
.smiley { display: inline; width: auto; height: auto; max-width: min(100%, 64px); max-height: 64px; vertical-align: text-bottom; }
.section-pagination { margin: 14px 0; }
.post-body > * { margin: 0; }
.post-body > * + * { margin-top: 8px; }
.post-body > .post-signature { margin-top: 12px; }
.post-body ul, .post-body ol { padding-left: 1.5em; }
.post-body li + li { margin-top: 6px; }
.post-body h3 { margin: 18px 0 10px; }
.post-body blockquote {
  margin: 12px 0;
  padding: 10px 14px;
  border-left: 3px solid #8d7645;
  background: #f0e4ca;
  font-size: 17px;
  line-height: 1.5;
}
.post-body blockquote > :first-child { margin-top: 0; }
.post-body blockquote > :last-child { margin-bottom: 0; }
.post-body blockquote p + p { margin-top: 10px; }
.post-body blockquote blockquote { background: #e9dfc7; }
.post-body blockquote blockquote blockquote { background: #fff7e7; }
.post-body cite {
  display: block;
  margin-bottom: 6px;
  color: var(--secondary);
  font: 600 14px/1.55 var(--font-interface);
}
.post-body code {
  font-family: ui-monospace, "Cascadia Code", "Courier New", monospace;
  font-size: 14px;
}
.post-body pre {
  max-width: 100%;
  padding: 16px;
  border: 1px solid #b69c68;
  background: #f3ead6;
  font: 14px/1.65 ui-monospace, "Cascadia Code", "Courier New", monospace;
  white-space: pre-wrap;
  overflow-wrap: anywhere;
  tab-size: 2;
}
.post-body pre code { white-space: inherit; font: inherit; }
.post-image { max-width: 100%; }
.post-image > a { display: block; }
.post-image img { display: block; max-width: 100%; width: 100%; height: auto; }
.post-image figcaption {
  margin-top: 10px;
  color: var(--secondary);
  font: 14px/1.6 var(--font-interface);
}
.missing-media {
  padding: 16px;
  border: 1px dashed #9b8455;
  background: #f0e4ca;
  color: var(--secondary);
  font: 14px/1.6 var(--font-interface);
}
.missing-media strong { display: block; color: #403b28; }
.missing-media p + p, .missing-media strong + p { margin-top: 6px; }
.missing-media.missing-image {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  margin: 0 2px;
  padding: 0;
  border: 0;
  background: none;
  color: var(--link);
  font: inherit;
  line-height: 1;
  vertical-align: middle;
}
.missing-image-link, .missing-image[role="img"] {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 32px;
  min-height: 28px;
}
.missing-image-link { color: inherit; text-decoration: none; }
.missing-image-link:hover { background: #e8dcc0; }
.broken-image-icon {
  position: relative;
  display: inline-block;
  width: 22px;
  height: 18px;
  overflow: hidden;
  border: 1.5px solid currentColor;
}
.broken-image-icon::before, .broken-image-icon::after {
  position: absolute;
  content: "";
  background: currentColor;
}
.broken-image-icon::before {
  inset: auto 2px 2px;
  height: 9px;
  clip-path: polygon(0 100%, 32% 15%, 55% 65%, 72% 40%, 100% 100%);
}
.broken-image-icon::after {
  top: -3px;
  left: 10px;
  width: 2px;
  height: 24px;
  transform: rotate(30deg);
}
.source-signature .missing-image { color: inherit; }
.post-body .post-note {
  color: var(--secondary);
  font: 14px/1.6 var(--font-interface);
}

/* Connected archive pages share the same quiet cream surfaces and compact lists. */
.archive-summary { margin-top: 18px; }
.forum-groups, .topic-groups { display: grid; gap: 12px; margin-bottom: 14px; }
.forum-groups > .reading-panel + .reading-panel, .topic-groups > .reading-panel + .reading-panel { margin-top: 0; }
.list-columns, .forum-row, .topic-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 128px minmax(220px, .7fr);
  gap: 16px;
}
.topic-columns, .topic-row { grid-template-columns: minmax(0, 1fr) 88px minmax(220px, .7fr); }
.list-columns { padding: 7px 16px; border-bottom: 1px solid #b69c68; background: rgba(248, 234, 204, .30); color: var(--secondary); font: 600 14px/1.5 var(--font-interface); }
.forum-list, .topic-list { margin: 0; padding: 0; list-style: none; }
.forum-row, .topic-row { min-width: 0; padding: 8px 16px; }
.forum-row + .forum-row, .topic-row + .topic-row { border-top: 1px solid rgba(114, 88, 45, .38); }
.forum-row > *, .topic-row > * { min-width: 0; }
.forum-title, .topic-title { color: #2b2e1b; font: 400 22px/1.35 var(--font-reading); }
.forum-title a, .topic-title a { display: inline-flex; align-items: center; min-width: 44px; min-height: 32px; max-width: 100%; overflow-wrap: anywhere; }
.list-description { margin-top: 4px; color: var(--secondary); font: 14px/1.5 var(--font-interface); overflow-wrap: anywhere; }
.list-counts { margin: 3px 0 0; color: var(--secondary); font: 14px/1.5 var(--font-interface); }
.list-counts > div { display: flex; flex-wrap: wrap; gap: 4px 8px; }
.list-counts dt, .list-counts dd { margin: 0; }
.list-counts dd { color: var(--ink); font-weight: 650; }
.topic-replies { display: flex; align-items: center; min-height: 32px; margin: 0; }
.list-last-post { overflow-wrap: anywhere; }
.last-post-title { margin: 0; color: var(--link); font: 600 14px/1.5 var(--font-interface); }
.last-post-title a { display: inline-flex; align-items: center; min-width: 44px; min-height: 28px; max-width: 100%; }
.list-last-post .metadata { margin-top: 2px; }
.last-post-meta { display: flex; align-items: baseline; gap: 6px; }
.last-post-author { min-width: 0; overflow-wrap: anywhere; font-weight: 550; }
.last-post-separator { flex: none; color: #8c7d62; }
.last-post-meta time { flex: none; white-space: nowrap; color: #6a604f; font-size: 13px; font-variant-numeric: tabular-nums; }
/* Small status silhouettes share the title's first line; normal topics are plain.
   Native CSS shapes keep the archive self-contained without icon/font assets. */
.topic-title .topic-link-marked {
  display: inline-grid;
  vertical-align: top;
  grid-template-columns: 18px minmax(0, 1fr);
  column-gap: 8px;
  align-items: start;
  align-content: center;
}
.topic-link-text { min-width: 0; }
.topic-marker {
  position: relative;
  display: block;
  width: 18px;
  height: 18px;
  margin-top: 6px;
  color: var(--secondary);
}
.topic-marker::before, .topic-marker::after {
  position: absolute;
  background: currentColor;
  content: "";
}
.topic-marker-pin::before {
  inset: 1px 3px 6px;
  clip-path: polygon(15% 0, 85% 0, 85% 18%, 70% 18%, 70% 60%, 100% 80%, 100% 95%, 0 95%, 0 80%, 30% 60%, 30% 18%, 15% 18%);
}
.topic-marker-pin::after { top: 11px; left: 8px; width: 2px; height: 7px; }
.topic-marker-announcement::before {
  top: 2px; left: 1px; width: 16px; height: 12px;
  clip-path: polygon(0 30%, 30% 30%, 90% 0, 90% 100%, 30% 70%, 0 70%);
}
.topic-marker-announcement::after { top: 11px; left: 5px; width: 3px; height: 6px; transform: skewX(12deg); }
.topic-main > .metadata { margin-top: 4px; }
.preview-links, .recovery-actions, .search-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 10px 16px; margin-top: 14px; }
.preview-links { font: 14px/1.55 var(--font-interface); }
.preview-links a, .state-navigation a { display: inline-flex; align-items: center; min-width: 44px; min-height: 44px; max-width: 100%; }
.recovery-actions .button, .search-actions .button { margin-top: 0; }
.archive-facts { margin: 22px 0 0; color: var(--secondary); font: 14px/1.6 var(--font-interface); }
.archive-facts > div { display: grid; grid-template-columns: 200px minmax(0, 1fr); gap: 12px 20px; padding: 12px 0; border-top: 1px solid #c4b18a; }
.archive-facts dt { font-weight: 650; }
.archive-facts dd { min-width: 0; margin: 0; }
.empty-state { padding: 22px; background: rgba(248, 239, 219, .98); border: 1px solid #b69c68; }
.empty-state h2, .search-state h2 { margin-bottom: 14px; font: 400 24px/1.3 var(--font-reading); }
.empty-state p + p { margin-top: 12px; }
.saved-poll { margin-bottom: 16px; }
.poll-options { margin: 14px 0; padding: 0; list-style: none; }
.poll-options li + li { margin-top: 12px; }
.poll-option-line { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 6px 16px; margin-bottom: 6px; font: 14px/1.6 var(--font-interface); }
.poll-option-label { font-weight: 650; }
.poll-option-total { color: var(--secondary); }
.poll-bar { display: block; width: 100%; height: 16px; accent-color: #45502b; }
.poll-bar::-webkit-meter-bar { border: 1px solid #aa925e; border-radius: 0; background: #e8d9b9; }
.poll-bar::-webkit-meter-optimum-value { background: #45502b; }
.poll-bar::-moz-meter-bar { background: #45502b; }
.media-figure { margin: 0; }
.media-figure > a { display: block; }
.media-figure img { display: block; width: 100%; max-width: 100%; height: auto; }
.media-figure figcaption, .media-label, .attachment-meta { margin-top: 12px; color: var(--secondary); font: 14px/1.6 var(--font-interface); }
.media-label { margin: 0 0 18px; padding: 12px 14px; border-left: 3px solid #8d7645; background: #eee0c1; }
.search-preview-note { margin-top: 18px; }
.search-noscript { margin: 18px 0; padding: 12px 14px; border: 1px solid #b69c68; background: #eee0c1; color: var(--secondary); font: 14px/1.6 var(--font-interface); }
.search-fields { min-width: 0; margin: 0; padding: 0; border: 0; }
.search-fields legend { margin-bottom: 18px; color: #2b2e1b; font: 400 24px/1.3 var(--font-reading); }
.search-form-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px 20px; }
.search-form-grid .field { margin: 0; min-width: 0; }
.search-query-field { grid-column: 1 / -1; }
.search-query-row { display: flex; align-items: flex-end; gap: 12px; }
.search-query-row .field { flex: 1; min-width: 0; margin: 0; }
.search-query-row .button { flex: none; margin-bottom: 0; }
.search-filters { margin-top: 14px; }
.search-filters > summary {
  width: fit-content;
  padding: 5px 0;
  cursor: pointer;
  color: var(--link);
  font: 600 16px/1.5 var(--font-interface);
}
.search-filters > summary:focus-visible { outline: 2px solid currentColor; outline-offset: 3px; }
.search-filters .search-fields { margin-top: 12px; }
@media (max-width: 480px) {
  .search-query-row { flex-wrap: wrap; gap: 10px; }
  .search-query-row .field { flex-basis: 100%; }
}
.search-state { margin-top: 18px; }
.search-state p + p { margin-top: 14px; }
.filter-summary { margin: 14px 0; padding: 10px 14px; border: 1px solid #b69c68; background: #eee0c1; color: var(--secondary); font: 14px/1.6 var(--font-interface); }
.filter-summary h3 { margin: 0 0 8px; font: 650 14px/1.6 var(--font-interface); }
.active-filters { display: flex; flex-wrap: wrap; gap: 8px 20px; margin: 0; }
.active-filters > div { display: flex; flex-wrap: wrap; gap: 4px 8px; }
.active-filters dt { font-weight: 650; }
.active-filters dd { margin: 0; }
.search-result { padding: 14px 20px; border: 4px solid #77621b; border-image: var(--ornament) 3 / 4px / 0 repeat; background: var(--paper-panel); }
.search-result + .search-result { margin-top: 14px; }
.search-result h3 { margin: 0; font: 400 24px/1.35 var(--font-reading); }
.search-result h3 a { display: inline-flex; align-items: center; min-width: 44px; min-height: 32px; max-width: 100%; }
.search-result-meta { margin-top: 4px; color: var(--secondary); font: 14px/1.6 var(--font-interface); }
.search-result-snippet { margin-top: 10px; font: 18px/1.55 var(--font-reading); }
.search-result mark { color: #29251d; background: #e8d4a7; }
.state-navigation { display: flex; flex-wrap: wrap; gap: 8px 18px; margin: 22px 0; font: 14px/1.55 var(--font-interface); }
.state-navigation a[aria-current="page"] { color: #173700; font-weight: 650; text-decoration-thickness: 2px; }
.search-error-message { margin-top: 12px; padding: 12px 14px; border-left: 3px solid #70512e; background: #eee0c1; color: #403725; font: 14px/1.6 var(--font-interface); }
.field [aria-invalid="true"] { border: 2px solid #70512e; }
.loading-example { padding: 16px; border: 1px solid #b69c68; background: #eee0c1; }

.site-footer {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px 24px;
  padding: 16px 20px;
  background: rgba(248, 234, 204, .30);
  color: var(--secondary);
  font: 14px/1.55 var(--font-interface);
}
.site-footer::before {
  position: absolute;
  inset: 0 0 auto;
  height: 3px;
  background: url("artwork/ornament-line.jpg") center / auto 3px repeat-x;
  content: "";
}
.site-footer strong { display: block; color: #303722; font: 400 22px/1.4 var(--font-reading); }
.site-footer span { display: block; margin-top: 2px; }
.site-footer > a { padding: 9px 0; white-space: nowrap; }
.site-footer > a span { display: inline; }

@media (max-width: 760px) {
  .site-wrap { width: calc(100% - 16px); margin-top: 8px; }
  .site-nav { min-height: 59px; padding: 8px 5px 0; }
  .site-nav a { padding: 8px 1px; font-size: clamp(16px, 4.4vw, 18px); min-height: 45px; letter-spacing: 0; }
  .archive-notice { padding: 8px 14px; }
  main { padding: 18px 16px 20px; }
  h1 { font-size: 32px; }
  .intro { font-size: 19px; }
  .reading-panel h2 { padding: 9px 16px; font-size: 24px; }
  .reading-content { padding: 14px 16px 16px; }
  .site-footer { padding: 16px; }
  .post { grid-template-columns: minmax(0, 1fr); }
  .post-author {
    display: flex;
    align-items: center;
    gap: 14px;
    padding: 8px 14px;
    border-right: 0;
    border-bottom: 1px solid #b69c68;
  }
  .author-initials { flex: none; width: 44px; height: 44px; margin: 0; font-size: 22px; }
  .post-avatar { flex: none; max-width: 44px; max-height: 56px; margin: 0; }
  .post-header { margin: 0 14px; }
  .post-body { padding: 12px 14px 14px; }
  .post-body blockquote { padding: 10px 8px; }
  .list-columns { display: none; }
  .forum-row, .topic-row { display: block; padding: 8px 14px; }
  .forum-title, .topic-title { font-size: 22px; }
  .list-counts { display: flex; flex-wrap: wrap; gap: 4px 18px; margin: 6px 0; }
  .topic-replies { min-height: 0; margin: 4px 0; }
  .list-last-post { margin-top: 6px; padding-top: 6px; border-top: 1px solid #c4b18a; }
  .archive-facts > div { grid-template-columns: minmax(0, 1fr); gap: 5px; }
  .search-form-grid { grid-template-columns: minmax(0, 1fr); }
  .search-query-field { grid-column: auto; }
  .search-result { padding: 12px 16px; }
}

@media (max-width: 480px) {
  .site-nav a:is([aria-current="page"], [aria-current="location"]) {
    text-decoration: underline;
    text-underline-offset: 4px;
  }
  main { padding: 16px 12px 18px; }
  .reading-content { padding: 13px 13px 16px; }
  .glyph-navigation { font-size: 18px; letter-spacing: .08em; }
  .sample-fields { padding: 16px 12px; }
  .site-footer { flex-wrap: wrap; padding: 16px 14px; }
  .topic-toolbar { gap: 12px; }
  .pagination-list { gap: 6px; }
  .page-control { padding: 8px 10px; }
  .discussion-notice { padding: 12px; }
  .post-author { gap: 12px; padding: 8px 12px; }
  .post-header { margin: 0 12px; }
  .post-body { padding: 12px 12px 14px; }
  .post-body blockquote { padding: 10px 7px; }
  .post-body pre { padding: 12px; }
  .missing-media { padding: 12px; }
  .forum-row, .topic-row { padding: 8px 12px; }
  .empty-state, .search-result { padding: 12px 13px; }
  .poll-option-line { display: block; }
  .poll-option-total { display: block; margin-top: 4px; }
}

/* Compact list links keep full touch targets on phones and touch-first screens. */
@media (max-width: 760px), (pointer: coarse), screen and (max-width: 960px) and (max-height: 480px) {
  .forum-title a, .topic-title a, .last-post-title a, .search-result h3 a { min-height: 44px; }
  .missing-image-link, .missing-image[role="img"] { min-width: 44px; min-height: 44px; }
}

/* Phone targets keep the reading sizes and original frame; only controls reflow. */
@media screen and (max-width: 760px), screen and (max-width: 960px) and (max-height: 480px) {
  .breadcrumbs li { display: flex; align-items: center; }
  .breadcrumbs a, .topic-return, .site-footer > a {
    display: inline-flex;
    align-items: center;
    min-width: 44px;
    min-height: 44px;
  }
}

@media screen and (max-width: 480px) {
  .post-header {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 8px;
  }
  .post-date { min-width: 0; }
  .page-direction { gap: 0; padding: 8px; }
  .page-arrow { font-size: 20px; line-height: 1; }
  .page-direction-text {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip-path: inset(50%);
    white-space: nowrap;
    border: 0;
  }
}

@media (forced-colors: active) {
  .archive-frame { --tab-opening: none; }
  .missing-media.missing-image { color: LinkText; }
  .broken-image-icon { border-color: currentColor; }
  .broken-image-icon::before, .broken-image-icon::after { forced-color-adjust: none; background: LinkText; }
  .topic-marker { color: CanvasText; }
  .topic-marker::before, .topic-marker::after { forced-color-adjust: none; }
  .archive-frame, .reading-panel, .site-nav a, .button, .post, .author-initials, .page-control { border-image: none; border-color: CanvasText; }
  .site-nav a:is([aria-current="page"], [aria-current="location"]) { border-bottom-width: 4px; border-image-width: 4px; }
  .button:disabled { color: GrayText; border-color: GrayText; }
  :where(a, button, input, select, summary):focus-visible { outline-color: Highlight; }
  .post:target { outline-color: Highlight; }
  .page-control[aria-disabled="true"] { color: GrayText; border-color: GrayText; }
  .page-control[aria-current="page"] { color: HighlightText; background: Highlight; }
  .search-result { border-image: none; border-color: CanvasText; }
  .search-result mark { color: HighlightText; background: Highlight; }
}

@media print {
  :root { background: white; color: black; }
  body { min-height: 0; }
  body::before { display: none; }
  .site-wrap { width: auto; max-width: none; margin: 0; }
  .site-nav, .skip-link, .button, .site-footer > a { display: none; }
  .archive-frame, .reading-panel { border-image: none; border-color: #777; background: white; }
  .archive-frame { border: 0; --tab-opening: none; }
  main { padding: 16px 0 0; }
  .site-footer::before { display: none; }
  .archive-notice, .site-footer, .reading-panel h2 { background: white; }
  .breadcrumbs, .pagination, .topic-return, .discussion-notice { display: none; }
  .site-footer, .topic-toolbar-bottom { display: none; }
  .topic-header { margin-bottom: 16px; }
  .post { display: block; border-image: none; border: 1px solid #777; background: white; }
  .post:target { outline: none; }
  .post-author { display: block; padding: 10px 14px; border: 0; border-bottom: 1px solid #aaa; background: white; }
  .author-initials, .author-note { display: none; }
  .author-name { color: black; }
  .post-header { margin: 0 14px; padding: 4px 0; }
  .post-date, .post-header h2, .post-permalink { color: black; }
  .post-body { padding: 14px; color: black; }
  .post-body p { max-width: none; }
  .post-body blockquote, .post-body pre, .missing-media { background: white; color: black; }
  .post-body blockquote blockquote, .post-body blockquote blockquote blockquote { background: white; }
  .post-header, .post-author { break-after: avoid; }
  .post-body figure, .missing-media { break-inside: avoid; }
  .forum-groups, .topic-groups { display: block; }
  .forum-row, .topic-row { display: block; break-inside: avoid; }
  .topic-marker { color: black; -webkit-print-color-adjust: exact; print-color-adjust: exact; }
  .list-columns, .preview-links, .recovery-actions, .state-navigation, .search-actions { display: none; }
  .search-result { border-image: none; border-color: #777; background: white; break-inside: avoid; }
  .media-figure, .saved-poll { break-inside: avoid; }
}

/* Public-author profiles keep the forum's compact lists and quiet parchment. */
.member-filter { padding: 12px 16px; border-bottom: 1px solid #b69c68; }
.member-filter .field { max-width: 28rem; }
.member-filter-status { margin-top: 6px; }
.member-filter[hidden], .member-filter-status[hidden], .member-row[hidden] { display: none; }
@media (max-width: 760px) { .member-filter { padding: 10px 14px; } }
.member-columns, .member-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 100px 150px;
  gap: 16px;
  align-items: baseline;
}
.member-columns {
  padding: 7px 16px;
  border-bottom: 1px solid #b69c68;
  color: var(--secondary);
  background: rgba(248, 234, 204, .30);
  font: 600 14px/1.5 var(--font-interface);
}
.member-list, .member-recent-list { margin: 0; padding: 0; list-style: none; }
.member-row { min-width: 0; padding: 5px 16px; }
.member-row + .member-row, .member-recent-list li + li { border-top: 1px solid rgba(114, 88, 45, .38); }
.member-row > * { min-width: 0; overflow-wrap: anywhere; }
.member-name { font: 400 20px/1.35 var(--font-reading); }
.member-name a {
  display: inline-flex;
  align-items: center;
  min-width: 44px;
  min-height: 32px;
  max-width: 100%;
}
.member-post-count, .member-joined { color: var(--secondary); font: 14px/1.5 var(--font-interface); }
.member-post-count { font-variant-numeric: tabular-nums; }
.member-cell-label {
  position: absolute;
  width: 1px;
  height: 1px;
  overflow: hidden;
  clip-path: inset(50%);
  white-space: nowrap;
}
.member-profile-header {
  display: flex;
  align-items: flex-start;
  gap: 18px;
  padding: 16px 20px;
  border-bottom: 1px solid #a38a58;
  background: var(--paper-heading);
}
.member-profile-avatar { flex: none; }
.member-profile-avatar:empty { display: none; }
.member-profile-avatar .post-avatar { max-width: 96px; max-height: 120px; margin: 0; }
.member-profile-avatar .author-initials { margin: 0; }
.member-profile-heading { min-width: 0; overflow-wrap: anywhere; }
.member-profile-heading h1 { margin-bottom: 5px; }
.member-search { font: 14px/1.5 var(--font-interface); }
.member-search a { display: inline-flex; align-items: center; min-height: 32px; }
.member-profile-content { padding: 12px 20px 16px; }
.member-facts { margin: 0; }
.member-facts > div { display: grid; grid-template-columns: 190px minmax(0, 1fr); gap: 4px 18px; padding: 4px 0; }
.member-facts dt { color: var(--secondary); font: 600 14px/1.5 var(--font-interface); }
.member-facts dd { min-width: 0; margin: 0; font-size: 17px; line-height: 1.4; overflow-wrap: anywhere; }
.member-profile-content > .post-signature { margin-top: 12px; }
.member-recent-list li { display: flex; flex-wrap: wrap; align-items: baseline; gap: 0 16px; padding: 6px 16px; }
.member-recent-list li > a { display: inline-flex; align-items: center; min-height: 32px; max-width: 100%; overflow-wrap: anywhere; }
.member-recent-list time { color: #6a604f; font: 13px/1.5 var(--font-interface); white-space: nowrap; }

@media (max-width: 760px) {
  .member-columns { display: none; }
  .member-row { grid-template-columns: minmax(0, 1fr) auto; gap: 2px 16px; padding: 5px 14px 8px; }
  .member-name { grid-column: 1 / -1; }
  .member-name a, .member-search a, .member-recent-list li > a { min-height: 44px; }
  .member-cell-label { position: static; width: auto; height: auto; overflow: visible; clip-path: none; white-space: normal; }
  .member-joined { text-align: right; }
  .member-profile-header { gap: 14px; padding: 14px; }
  .member-profile-avatar .post-avatar { max-width: 72px; max-height: 90px; }
  .member-profile-content { padding: 10px 14px 14px; }
  .member-facts > div { grid-template-columns: minmax(0, 1fr); gap: 2px; padding: 5px 0; }
  .member-recent-list li { padding: 4px 14px 8px; }
}

@media (max-width: 480px) {
  .member-row { grid-template-columns: minmax(0, 1fr); }
  .member-joined { text-align: left; }
  .member-profile-header { gap: 12px; }
  .member-profile-heading h1 { font-size: 28px; }
  .member-profile-avatar .post-avatar { max-width: 56px; max-height: 72px; }
}

@media print {
  .member-profile-header { background: white; }
  .member-row, .member-recent-list li { break-inside: avoid; }
  .member-search { display: none; }
}