:root {
  color-scheme: light;
  --page-bg: #f5f2ea;
  --surface: #fff;
  --ink: #20251d;
  --muted: #50584c;
  --link: #315a12;
  --accent: #e5c900;
  --accent-ink: #201d00;
  --border: #a69c7d;
  --focus: #8b3700;
  --base-size: 1rem;
  font-size: var(--base-size);
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
  margin: 0;
  background: var(--page-bg);
  color: var(--ink);
  font-family: Arial, Helvetica, sans-serif;
  font-size: 1rem;
  line-height: 1.65;
}
a { color: var(--link); text-decoration-thickness: .1em; text-underline-offset: .15em; }
a:hover { text-decoration-thickness: .18em; }
button, input { font: inherit; }
button, summary, a, input { touch-action: manipulation; }
:focus-visible { outline: 3px solid var(--focus); outline-offset: 3px; }
.skip-link {
  position: absolute; z-index: 20; top: .5rem; left: .5rem;
  padding: .6rem 1rem; transform: translateY(-160%);
  color: var(--ink); background: var(--accent); border: 2px solid currentColor;
}
.skip-link:focus { transform: translateY(0); }
.site-header { background: #e8dfcb; border-bottom: 3px solid #8e794a; padding: .8rem clamp(.8rem, 3vw, 2rem) 1rem; }
.utility-row, .brand-row, .reading-controls, .search-row, .panel-heading { display: flex; align-items: center; gap: .55rem; }
.utility-row { justify-content: space-between; max-width: 1500px; margin: 0 auto .75rem; flex-wrap: wrap; }
.reading-controls { flex-wrap: wrap; }
.control, .action-button {
  display: inline-flex; align-items: center; justify-content: center; min-height: 2.65rem;
  padding: .35rem .75rem; color: var(--ink); background: var(--surface);
  border: 2px solid #88794f; border-radius: .35rem; font-weight: 700; cursor: pointer;
}
.normal-link { text-decoration: none; }
.control:hover, .action-button:hover { background: var(--accent); }
.brand-row { max-width: 1500px; margin: 0 auto; justify-content: space-between; align-items: flex-end; gap: 1.5rem; }
.brand { display: inline-flex; align-items: center; gap: .7rem; color: #33310a; font-size: clamp(1.25rem, 2vw, 1.8rem); font-weight: 800; text-decoration: none; }
.brand img { width: 40px; height: 45px; object-fit: contain; }
.site-search { width: min(100%, 36rem); }
.site-search label, .picker-content label { display: block; font-weight: 700; margin-bottom: .2rem; }
.search-row input, #page-filter { min-height: 2.7rem; padding: .45rem .6rem; border: 2px solid #625b46; border-radius: .3rem; background: var(--surface); color: var(--ink); }
.search-row input { flex: 1; min-width: 5rem; }
.field-help { margin: .2rem 0 0; color: var(--muted); font-size: .9em; }
.search-panel { max-width: 1500px; margin: 1rem auto 0; padding: 1rem; background: var(--surface); border: 2px solid var(--border); border-radius: .5rem; }
.panel-heading { justify-content: space-between; flex-wrap: wrap; }
.panel-heading h2 { margin: 0; font-size: 1.25rem; }
.status { margin: .5rem 0; }
.search-results { margin: .5rem 0 0; padding-left: 1.7rem; }
.search-results li { margin: .75rem 0; }
.search-results p { margin: .2rem 0; color: var(--muted); }
.page-layout { display: grid; grid-template-columns: minmax(15rem, 19rem) minmax(0, 1fr); align-items: start; gap: clamp(1rem, 2vw, 2rem); max-width: 1600px; margin: 1.25rem auto; padding: 0 clamp(.75rem, 2.5vw, 2rem); }
.page-picker { align-self: start; position: sticky; top: .75rem; max-height: calc(100vh - 1.5rem); overflow: auto; background: var(--surface); border: 2px solid #8e794a; border-radius: .45rem; }
.page-picker details[open] { display: block; }
.page-picker summary { display: flex; align-items: center; gap: .75rem; padding: .85rem 1rem; color: #272400; background: var(--accent); cursor: pointer; font-size: 1.1rem; font-weight: 800; list-style: none; }
.page-picker summary::-webkit-details-marker { display: none; }
.hamburger { display: inline-flex; flex-direction: column; justify-content: center; gap: 4px; width: 1.5rem; height: 1.3rem; }
.hamburger i { display: block; width: 1.4rem; height: 3px; border-radius: 2px; background: currentColor; }
.picker-content { padding: .85rem; }
#page-filter { width: 100%; }
.page-group { margin: 1rem 0 0; }
.page-group h2 { margin: 0 0 .35rem; padding-bottom: .2rem; color: #3e431f; border-bottom: 1px solid var(--border); font-size: 1rem; }
.page-group ul { margin: 0; padding: 0; list-style: none; }
.page-group li { margin: .1rem 0; }
.page-group a { display: block; padding: .35rem .5rem; border-radius: .25rem; }
.page-group a[aria-current="page"] { color: var(--accent-ink); background: #eee082; font-weight: 800; box-shadow: inset 4px 0 #726500; }
.main-content { min-width: 0; }
.content { width: 100%; max-width: 78rem; min-height: 25rem; margin: 0 auto; padding: clamp(1rem, 3vw, 2rem); background: var(--surface); border: 1px solid #ded7c4; border-radius: .5rem; overflow-wrap: anywhere; }
.content h1 { margin: 0 0 1rem; color: #3a431c; font-size: clamp(1.65rem, 3vw, 2.4rem); line-height: 1.2; }
.content p { max-width: 85ch; }
.content img, .content video, .content iframe { max-width: 100%; height: auto; }
.content iframe { min-height: 20rem; }
.content table { width: 100% !important; max-width: 100%; height: auto !important; }
.content .am-home-layout-table { table-layout: fixed; }
.content th, .content td { max-width: 100%; height: auto !important; white-space: normal !important; }
.content table[border="0"], .content table:not([border]) { border: 0; }
.content .table-scroll { max-width: 100%; overflow-x: auto; overscroll-behavior-inline: contain; }
.content mark { padding: .05em .15em; color: #141000; background: #ffdf00; outline: 2px solid #4c4000; border-radius: .15em; }
.content .am-home-columns { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 27rem), 1fr)); align-items: start; gap: clamp(1rem, 2vw, 1.5rem); }
.content .am-home-columns > * { min-width: 0; }
.content .am-project-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 15rem), 1fr)); align-items: stretch; gap: .8rem; margin: 1rem 0; }
.content .am-project-card { display: flex; min-width: 0; flex-direction: column; gap: .55rem; padding: .75rem; background: #f8f5ed; border-radius: .4rem; text-align: center; }
.content .am-project-card .project-card-media img { display: block; width: auto; max-width: 100%; max-height: 16rem; margin: 0 auto; object-fit: contain; }
.content .am-project-card .project-card-caption { margin: 0; }
body.high-contrast .content .am-project-card { background: #000 !important; outline: 1px solid #fff; }
.load-error { padding: 1rem; border: 2px solid #8e3b2d; background: #fff5f2; border-radius: .4rem; }
.site-footer { display: flex; justify-content: center; flex-wrap: wrap; gap: 1rem 2rem; margin-top: 2rem; padding: 1.1rem; background: #e8dfcb; border-top: 2px solid #8e794a; }
.visually-hidden { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0,0,0,0) !important; white-space: nowrap !important; border: 0 !important; }
body.high-contrast { color-scheme: dark; --page-bg: #000; --surface: #000; --ink: #fff; --muted: #fff; --link: #ff0; --accent: #ff0; --accent-ink: #000; --border: #fff; --focus: #ff0; }
body.high-contrast .site-header, body.high-contrast .site-footer { background: #000; border-color: #fff; }
body.high-contrast .brand, body.high-contrast .page-group h2 { color: #fff; }
body.high-contrast .control, body.high-contrast .action-button, body.high-contrast input { color: #fff; background: #000; border-color: #fff; }
body.high-contrast .control:hover, body.high-contrast .action-button:hover { color: #000; background: #ff0; }
body.high-contrast a:hover, body.high-contrast a:focus-visible { text-decoration: underline; }
body.high-contrast .page-picker, body.high-contrast .content, body.high-contrast .search-panel { background: #000; border-color: #fff; }
body.high-contrast .page-picker summary, body.high-contrast .page-group a[aria-current="page"] { color: #000; background: #ff0; }
body.high-contrast .content h1 { color: #fff; }
body.high-contrast .content mark { color: #000; background: #ff0; outline-color: #fff; }
body.high-contrast .content :is(table, td, th, img, div, p, span)[border]:not([border="0"]), body.high-contrast .content [style*="border"] { border-color: #fff !important; }
body.high-contrast .content * { color: #fff !important; background-color: #000 !important; background-image: none !important; }
body.high-contrast .content a { color: #ff0 !important; }
body.high-contrast .content mark { color: #000 !important; background: #ff0 !important; }
body.high-contrast .load-error { background: #000; border-color: #ff0; }

@media (max-width: 850px) {
  .brand-row { align-items: stretch; flex-direction: column; gap: .75rem; }
  .site-search { width: 100%; }
  .page-layout { display: flex; flex-direction: column; align-items: stretch; }
  .page-picker { position: static; max-height: none; overflow: visible; width: 100%; }
  .page-picker summary { justify-content: flex-start; }
  .page-picker details:not([open]) .picker-content { display: none; }
  .content { padding: 1rem; }
}
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after { animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; }
}
