/* Faithful warmth, pilot 11. Approved image bytes; real Sora and original logo.
   Source frame 2092×752; ornament-safe crop 0 165 2092 415.
   The flow reserves only source y230..480, never the entire 415-unit crop.
   Above/below ivy and lantern bleed is decorative and cannot intercept input. */
.site-header.material-header {
  --masthead-paper: url("/assets/paper-void-1672.webp");
  --timber: #362619;
  --brass: #bb965d;
  --nav-ink: #fff0d0;
  --nav-active: #ffe2a3;
  position: relative;
  isolation: isolate;
  z-index: 2;
  display: block;
  width: min(1560px, calc(100% - 32px));
  aspect-ratio: 2092 / 250;
  min-height: 0;
  margin: clamp(36px, 3vw, 48px) auto 12px;
  padding: 0;
  border: 0;
  color: var(--nav-ink);
  background: transparent;
  font-family: "Sora", sans-serif;
  line-height: 1.5;
}
.site-header.material-header .header-decoration {
  position: absolute;
  z-index: -1;
  inset-inline: 0;
  top: -26%;
  aspect-ratio: 2092 / 415;
  overflow: hidden;
  pointer-events: none;
  user-select: none;
  filter: drop-shadow(0 4px 3px rgba(3,10,18,.58)) drop-shadow(0 12px 10px rgba(3,10,18,.38));
}
.site-header.material-header .header-decoration img {
  position: absolute;
  width: 100%;
  max-width: none;
  height: auto;
  top: -39.759036%;
  left: 0;
  pointer-events: none;
}
.site-header.material-header .header-ivy { display: none; pointer-events: none; }
.site-header.material-header .wordmark {
  position: absolute;
  left: 5.83174%;
  top: 50.6%;
  transform: translateY(-50%);
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  min-width: 0;
  width: 24.37859%;
  max-width: none;
  min-height: 48px;
  padding-inline: clamp(10px, .765vw, 12px);
  color: var(--ink);
  background: transparent;
  border: 0;
  font-family: "Sora", sans-serif;
  font-size: clamp(1.75rem, 2.01vw, 2rem);
  font-weight: 800;
  line-height: 1.18;
  letter-spacing: .025em;
  text-transform: uppercase;
  text-decoration: none;
}
.site-header.material-header .brand-mark {
  width: clamp(86px, 7.6282vw, 119px);
  height: auto;
  flex-shrink: 0;
  padding: 0;
  background: transparent;
  border-radius: 0;
  filter: drop-shadow(0 .65px 0 rgba(255,239,181,.75)) drop-shadow(0 -.45px .4px rgba(77,49,12,.28));
}
.site-header.material-header .wordmark span { min-width: 0; overflow-wrap: normal; text-align: left; margin-inline-end: -.047em; }
.site-header.material-header .header-panel { position: absolute; inset: 0; pointer-events: none; }
/* One centered group in source x671..1490. Every label shares a line box.
   Actual desktop text never drops below 22 CSS px at the default 16 px root size. */
.site-header.material-header nav {
  position: absolute;
  left: 32.07457%;
  top: 50.6%;
  width: 39.14914%;
  transform: translateY(-50%);
  display: flex;
  flex-wrap: nowrap;
  align-items: center;
  justify-content: center;
  gap: 20px;
  margin: 0;
  padding: 0;
  border: 0;
  pointer-events: auto;
  isolation: isolate;
}
.site-header.material-header nav::before {
  content: ""; position: absolute; inset: -12px -16px; z-index: -1; pointer-events: none;
  background: none;
  mask-image: linear-gradient(90deg, transparent, #000 4%, #000 96%, transparent);
}
.site-header.material-header nav a {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex: 0 0 auto;
  min-height: 48px;
  min-width: 48px;
  padding: .5rem 0;
  color: var(--nav-ink);
  font-size: clamp(1.375rem, 1.5vw, 1.5rem);
  font-weight: 700;
  line-height: 1.5;
  overflow-wrap: normal;
  text-align: center;
  text-decoration: none;
  text-decoration-color: var(--nav-active);
  text-underline-offset: .6em;
  /* A narrow, slightly uneven cut into timber; crisp ink stays fully opaque. */
  text-shadow: none;
}
.site-header.material-header nav a:hover,
.site-header.material-header nav a[aria-current],
.site-header.material-header nav a:focus-visible { text-decoration-line: underline; text-decoration-thickness: 2px; }
body:has(#movement:target) .material-header nav a[href="#movement"],
body:has(#infinite-arts:target) .material-header nav a[href="#infinite-arts"],
body:has(#work-with-us:target) .material-header nav a[href="#work-with-us"] { text-decoration-line: underline; text-decoration-thickness: 2px; }
/* Inner metal plaque is source x1580..1860; center x1720.
   The title is centered on that rectangle, not on the surrounding mural/cap.
   Coming soon remains status text, with no fake login button or disabled link. */
.site-header.material-header .member-link {
  position: absolute;
  left: 75.52581%;
  top: 50.6%;
  width: 13.38432%;
  transform: translateY(-50%);
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 48px;
  margin: 0;
  padding: 0;
  border: 0;
  background: transparent;
  color: #231b0e;
  text-align: center;
  isolation: isolate;
  font-size: clamp(1rem, 1.13vw, 1.125rem);
  line-height: 1.5;
  pointer-events: auto;
}
.site-header.material-header .member-link::before {
  content: ""; position: absolute; inset: -6px -4px -20px; z-index: -1; pointer-events: none;
  background: linear-gradient(0deg, transparent, rgba(255,236,173,.5) 20%, rgba(255,236,173,.5) 80%, transparent);
  mask-image: linear-gradient(90deg, transparent, #000 3%, #000 97%, transparent);
}
.site-header.material-header .member-title {
  font-weight: 700;
  letter-spacing: .035em;
  text-transform: uppercase;
  white-space: nowrap;
  /* Precise laser-etched brass lettering: clean dark face and one fine glint. */
  text-shadow: 0 .7px 0 rgba(255,236,173,.8), 0 -.45px 0 rgba(58,36,9,.48);
}
.site-header.material-header .member-link small {
  position: absolute;
  top: calc(50% + .95em);
  left: 0;
  width: 100%;
  color: #30230f;
  font-size: .625rem;
  font-weight: 600;
  line-height: 1.5;
  letter-spacing: .14em;
  text-transform: uppercase;
  text-align: center;
  text-shadow: 0 .5px 0 rgba(255,236,173,.55);
}
.site-header.material-header a:focus-visible,
.site-header.material-header button:focus-visible { outline: 3px solid var(--nav-active); outline-offset: 4px; }
.site-header.material-header .wordmark:focus-visible { outline-color: var(--focus); outline-offset: 6px; }
.site-header.material-header .menu-toggle { display: none; }
.site-header.material-header .menu-toggle[hidden],
.site-header.material-header .header-panel[hidden] { display: none; }
/* Companion pages retain their approved structure and typography. */
.companion-page { overflow-wrap: anywhere; }
.companion-page :is(.interior-grid,.tool-grid) > * { min-width: 0; }
.companion-page :is(h1,h2) em { font-family: inherit; font-style: normal; }
.companion-page .footer-brand { font-family: inherit; font-size: 1rem; }
.companion-page :is(.eyebrow,.tool-card .eyebrow,.tool-status,.quiet) { font-size: .875rem; }
.companion-page :is(.button,.text-link) { font-size: 1rem; min-height: 48px; }
.companion-page .text-link { display: inline-flex; align-items: center; }

/* The frame yields to the compact menu before labels become cramped. */
@media (max-width: 1535px) {
.site-header.material-header {
  --masthead-paper: url("/assets/paper-void-1200.webp");
  width: calc(100% - 32px);
  aspect-ratio: auto;
  display: grid;
  grid-template-columns: minmax(0, 1fr) 64px;
  align-items: stretch;
  margin: 16px auto 12px;
  min-height: 84px;
  border: 1px solid var(--brass);
  background-color: var(--timber);
  background-image: url("/assets/header-fluid-depth.webp");
  background-size: 1000px auto;
  background-position: center -110px;
  box-shadow: inset 0 0 0 2px #362619, inset 0 0 0 3px #9e7a42, 0 4px 3px rgba(3,10,18,.45), 0 12px 12px rgba(3,10,18,.28);
}
.site-header.material-header .header-decoration { display: none; }
.site-header.material-header .header-ivy {
  display: block;
  position: absolute;
  left: -10px;
  top: -9px;
  width: 86px;
  height: 32px;
  background-image: url("/assets/header-fluid-depth.webp");
  background-size: 610px auto;
  background-repeat: no-repeat;
  background-position: -4px -49px;
  z-index: 1;
}
.site-header.material-header .wordmark {
  position: static;
  transform: none;
  width: auto;
  max-width: none;
  min-width: 0;
  min-height: 70px;
  margin: 6px 0 6px 6px;
  padding: 8px;
  gap: 12px;
  justify-content: flex-start;
  align-items: center;
  background-color: #faf0d7;
  background-image: linear-gradient(rgba(255,253,248,.72), rgba(255,253,248,.72)), var(--masthead-paper);
  background-size: cover;
  background-position: center;
  border: 1px solid var(--brass);
  font-size: 1.25rem;
  line-height: 1.18;
  letter-spacing: .015em;
}
.site-header.material-header .brand-mark { width: 72px; height: auto; }
.site-header.material-header .wordmark span { overflow-wrap: normal; }
.site-header.material-header .menu-toggle {
  grid-column: 2;
  grid-row: 1;
  display: inline-flex;
  align-self: center;
  justify-self: center;
  align-items: center;
  justify-content: center;
  width: 48px;
  height: 48px;
  padding: 0;
  border: 1px solid #e4c56b;
  border-radius: 2px;
  /* An aged solid-gold inset: fine scratches, a bevel and a recessed edge. */
  background-color: #d8b15b;
  background-image: repeating-linear-gradient(4deg, rgba(255,240,173,.07) 0 .7px, rgba(79,49,11,.05) .7px 1.2px, transparent 1.2px 4px), linear-gradient(135deg, #d9b657, #f0d27c 36%, #bb913a 68%, #d8b15b);
  box-shadow: 0 0 0 1px #332519, inset 1px 1px 2px rgba(44,26,10,.55), inset -1px -1px 0 rgba(234,209,155,.9), inset 0 0 0 4px rgba(69,47,19,.12), 0 2px 4px rgba(24,16,9,.3);
  color: #241a0e;
  cursor: pointer;
}
.site-header.material-header .menu-glyph { position: relative; display: block; width: 22px; height: 18px; pointer-events: none; }
.site-header.material-header .menu-glyph i { position: absolute; left: 0; width: 22px; height: 2.4px; border-radius: .5px; background: currentColor; box-shadow: 0 1px 0 rgba(255,242,194,.88), 0 -.5px 0 rgba(54,32,12,.4); }
.site-header.material-header .menu-glyph i:nth-child(1) { top: 1px; }
.site-header.material-header .menu-glyph i:nth-child(2) { top: 8px; }
.site-header.material-header .menu-glyph i:nth-child(3) { top: 15px; }
.site-header.material-header .menu-toggle[aria-expanded="true"] .menu-glyph i:nth-child(1) { top: 8px; transform: rotate(45deg); }
.site-header.material-header .menu-toggle[aria-expanded="true"] .menu-glyph i:nth-child(2) { opacity: 0; }
.site-header.material-header .menu-toggle[aria-expanded="true"] .menu-glyph i:nth-child(3) { top: 8px; transform: rotate(-45deg); }
.site-header.material-header .header-panel {
  position: static;
  grid-column: 1 / -1;
  width: 100%;
  padding: 12px 16px 16px;
  color: var(--ink);
  background-color: #faf0d7;
  background-image: linear-gradient(rgba(255,253,248,.72), rgba(255,253,248,.72)), var(--masthead-paper);
  background-size: cover;
  background-position: center;
  border-top: 1px solid var(--brass);
  pointer-events: auto;
}
.site-header.material-header nav {
  position: static;
  transform: none;
  width: 100%;
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  align-items: stretch;
  justify-content: center;
  gap: 4px 16px;
  margin: 0;
  padding: 0 0 12px;
}
.site-header.material-header nav a {
  min-width: 0;
  min-height: 48px;
  width: 100%;
  padding: 10px 4px;
  align-items: center;
  justify-content: center;
  color: var(--ink);
  font-size: 1.25rem;
  line-height: 1.5;
  text-align: center;
  overflow-wrap: anywhere;
  text-shadow: 0 .65px 0 #fffdf8, -.25px -.3px 0 rgba(94,64,29,.2);
  text-decoration-color: #765522;
}
.site-header.material-header .member-link {
  position: static;
  transform: none;
  width: min(100%, 320px);
  margin: 0 auto;
  min-height: 68px;
  padding: 12px;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 4px;
  border: 1px solid #a37f40;
  box-shadow: inset 0 0 0 2px rgba(255,240,202,.35);
  background: linear-gradient(100deg, #d7b566, #efd796 45%, #d3ad5c);
  font-size: 1rem;
  color: #231b0e;
}
.site-header.material-header .member-link small { position: static; width: auto; font-size: .6875rem; text-align: center; }
.site-header.material-header .wordmark:focus-visible { outline-offset: -5px; }
.site-header.material-header .header-panel a:focus-visible { outline-color: var(--focus); outline-offset: 0; }
}

/* Text enlargement also gets a flowing compact layout via header-menu.js. */
.site-header.material-header.force-compact {
  --masthead-paper: url("/assets/paper-void-1200.webp");
  width: calc(100% - 32px);
  aspect-ratio: auto;
  display: grid;
  grid-template-columns: minmax(0, 1fr) 64px;
  align-items: stretch;
  margin: 16px auto 12px;
  min-height: 84px;
  border: 1px solid var(--brass);
  background-color: var(--timber);
  background-image: url("/assets/header-fluid-depth.webp");
  background-size: 1000px auto;
  background-position: center -110px;
  box-shadow: inset 0 0 0 2px #362619, inset 0 0 0 3px #9e7a42, 0 4px 3px rgba(3,10,18,.45), 0 12px 12px rgba(3,10,18,.28);
}
.site-header.material-header.force-compact .header-decoration { display: none; }
.site-header.material-header.force-compact .header-ivy {
  display: block;
  position: absolute;
  left: -10px;
  top: -9px;
  width: 86px;
  height: 32px;
  background-image: url("/assets/header-fluid-depth.webp");
  background-size: 610px auto;
  background-repeat: no-repeat;
  background-position: -4px -49px;
  z-index: 1;
}
.site-header.material-header.force-compact .wordmark {
  position: static;
  transform: none;
  width: auto;
  max-width: none;
  min-width: 0;
  min-height: 70px;
  margin: 6px 0 6px 6px;
  padding: 8px;
  gap: 12px;
  justify-content: flex-start;
  align-items: center;
  background-color: #faf0d7;
  background-image: linear-gradient(rgba(255,253,248,.72), rgba(255,253,248,.72)), var(--masthead-paper);
  background-size: cover;
  background-position: center;
  border: 1px solid var(--brass);
  font-size: 1.25rem;
  line-height: 1.18;
  letter-spacing: .015em;
}
.site-header.material-header.force-compact .brand-mark { width: 72px; height: auto; }
.site-header.material-header.force-compact .wordmark span { overflow-wrap: normal; }
.site-header.material-header.force-compact .menu-toggle {
  grid-column: 2;
  grid-row: 1;
  display: inline-flex;
  align-self: center;
  justify-self: center;
  align-items: center;
  justify-content: center;
  width: 48px;
  height: 48px;
  padding: 0;
  border: 1px solid #e4c56b;
  border-radius: 2px;
  /* An aged solid-gold inset: fine scratches, a bevel and a recessed edge. */
  background-color: #d8b15b;
  background-image: repeating-linear-gradient(4deg, rgba(255,240,173,.07) 0 .7px, rgba(79,49,11,.05) .7px 1.2px, transparent 1.2px 4px), linear-gradient(135deg, #d9b657, #f0d27c 36%, #bb913a 68%, #d8b15b);
  box-shadow: 0 0 0 1px #332519, inset 1px 1px 2px rgba(44,26,10,.55), inset -1px -1px 0 rgba(234,209,155,.9), inset 0 0 0 4px rgba(69,47,19,.12), 0 2px 4px rgba(24,16,9,.3);
  color: #241a0e;
  cursor: pointer;
}
.site-header.material-header.force-compact .menu-glyph { position: relative; display: block; width: 22px; height: 18px; pointer-events: none; }
.site-header.material-header.force-compact .menu-glyph i { position: absolute; left: 0; width: 22px; height: 2.4px; border-radius: .5px; background: currentColor; box-shadow: 0 1px 0 rgba(255,242,194,.88), 0 -.5px 0 rgba(54,32,12,.4); }
.site-header.material-header.force-compact .menu-glyph i:nth-child(1) { top: 1px; }
.site-header.material-header.force-compact .menu-glyph i:nth-child(2) { top: 8px; }
.site-header.material-header.force-compact .menu-glyph i:nth-child(3) { top: 15px; }
.site-header.material-header.force-compact .menu-toggle[aria-expanded="true"] .menu-glyph i:nth-child(1) { top: 8px; transform: rotate(45deg); }
.site-header.material-header.force-compact .menu-toggle[aria-expanded="true"] .menu-glyph i:nth-child(2) { opacity: 0; }
.site-header.material-header.force-compact .menu-toggle[aria-expanded="true"] .menu-glyph i:nth-child(3) { top: 8px; transform: rotate(-45deg); }
.site-header.material-header.force-compact .header-panel {
  position: static;
  grid-column: 1 / -1;
  width: 100%;
  padding: 12px 16px 16px;
  color: var(--ink);
  background-color: #faf0d7;
  background-image: linear-gradient(rgba(255,253,248,.72), rgba(255,253,248,.72)), var(--masthead-paper);
  background-size: cover;
  background-position: center;
  border-top: 1px solid var(--brass);
  pointer-events: auto;
}
.site-header.material-header.force-compact nav {
  position: static;
  transform: none;
  width: 100%;
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  align-items: stretch;
  justify-content: center;
  gap: 4px 16px;
  margin: 0;
  padding: 0 0 12px;
}
.site-header.material-header.force-compact nav a {
  min-width: 0;
  min-height: 48px;
  width: 100%;
  padding: 10px 4px;
  align-items: center;
  justify-content: center;
  color: var(--ink);
  font-size: 1.25rem;
  line-height: 1.5;
  text-align: center;
  overflow-wrap: anywhere;
  text-shadow: 0 .65px 0 #fffdf8, -.25px -.3px 0 rgba(94,64,29,.2);
  text-decoration-color: #765522;
}
.site-header.material-header.force-compact .member-link {
  position: static;
  transform: none;
  width: min(100%, 320px);
  margin: 0 auto;
  min-height: 68px;
  padding: 12px;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 4px;
  border: 1px solid #a37f40;
  box-shadow: inset 0 0 0 2px rgba(255,240,202,.35);
  background: linear-gradient(100deg, #d7b566, #efd796 45%, #d3ad5c);
  font-size: 1rem;
  color: #231b0e;
}
.site-header.material-header.force-compact .member-link small { position: static; width: auto; font-size: .6875rem; text-align: center; }
.site-header.material-header.force-compact .wordmark:focus-visible { outline-offset: -5px; }
.site-header.material-header.force-compact .header-panel a:focus-visible { outline-color: var(--focus); outline-offset: 0; }

@media (max-width: 600px) {
  .site-header.material-header { --masthead-paper: url("/assets/paper-void-800.webp"); }
}
@media (max-width: 380px) {
  .site-header.material-header { width: calc(100% - 24px); }
  .site-header.material-header .brand-mark { width: 56px; }
  .site-header.material-header .wordmark { gap: 8px; font-size: 1.125rem; }
  .site-header.material-header nav { grid-template-columns: 1fr; }
}
@media (forced-colors: active) {
  .site-header.material-header { border: 1px solid CanvasText; background: Canvas; }
  .site-header.material-header .header-decoration, .site-header.material-header .header-ivy { visibility: hidden; }
  .site-header.material-header :is(a,.member-link,.wordmark,.menu-toggle,.header-panel) { color: CanvasText; background: Canvas; }
  .site-header.material-header :is(nav a,.member-title,.member-link small) { text-shadow: none; }
  .site-header.material-header nav a[aria-current], .site-header.material-header nav a:hover { text-decoration-color: LinkText; }
  .site-header.material-header :is(a,button):focus-visible { outline-color: Highlight; }
}

@media (max-width: 1535px) {
 .site-header.material-header nav::before, .site-header.material-header .member-link::before { display: none; }
}
.site-header.material-header.force-compact nav::before, .site-header.material-header.force-compact .member-link::before { display: none; }

/* Keep enlarged identity/status text in flow rather than clipping it. */
.site-header.material-header.force-compact .wordmark { flex-wrap: wrap; }
.site-header.material-header.force-compact .wordmark span { max-width: 100%; overflow-wrap: anywhere; }
.site-header.material-header.force-compact .member-title { white-space: normal; overflow-wrap: anywhere; }

/* Pilot14 bronze names: solid live letter bodies carry legibility.
   The same-document inner-cut filter adds only a fine decorative metal edge. */
.site-header.material-header nav .wood-lettering {
  display: inline-block;
  color: #21160e;
  font-synthesis: none;
  background: none;
  -webkit-text-fill-color: currentColor;
  -webkit-text-stroke: 0;
  text-shadow: none;
  filter: none;
}
@media (max-width: 1535px) {
 .site-header.material-header nav .wood-lettering { filter: none; text-shadow: none; }
}
.site-header.material-header.force-compact nav .wood-lettering { filter: none; text-shadow: none; }
@media (forced-colors: active) {
 .site-header.material-header nav .wood-lettering { color: LinkText; background: none; filter: none; text-shadow: none; }
}

/* Dark carved-wood underline/focus stays readable on the lighter timber. */
.site-header.material-header nav a { text-decoration-color: #593912; }
.site-header.material-header nav a:focus-visible,
.site-header.material-header .menu-toggle:focus-visible { outline-color: #2f1d0d; }
@media (forced-colors: active) {
 .site-header.material-header nav a:focus-visible, .site-header.material-header .menu-toggle:focus-visible { outline-color: Highlight; }
}

/* The compact bar owns one continuous frame around both transparent identity
   and menu control. The open panel cannot resize/reposition its wood surface. */
.site-header.material-header .masthead-bar { display: contents; }
.site-header.material-header .header-filter-defs { position: absolute; width: 0; height: 0; overflow: hidden; pointer-events: none; }
@media (min-width: 1536px) {
 @supports (width: 1cqw) {
  .site-header.material-header:not(.force-compact) { container-type: inline-size; }
  .site-header.material-header:not(.force-compact) .wordmark { font-size: clamp(1.75rem, 2.05cqw, 2rem); gap: 8px; padding-inline: .765cqw; }
  .site-header.material-header:not(.force-compact) .brand-mark { width: clamp(86px, 7.6282cqw, 119px); }
 }
}

@media (max-width: 1535px) {

.site-header.material-header { display: block; min-height: 0; padding: 0; border: 0; background: none; box-shadow: none; }
.site-header.material-header .masthead-bar {
 display: grid; grid-template-columns: minmax(0, 1fr) 64px; align-items: stretch;
 width: 100%; min-height: 84px; padding: 6px; gap: 0;
 border: 1px solid #bb965d;
 background-color: #d8b36c;
 background-image: url("/assets/header-fluid-depth.webp");
 background-size: 290.55556% auto; background-position: 48.469388% 47%; background-repeat: no-repeat;
 box-shadow: inset 0 0 0 2px #74521d, inset 0 0 0 3px #dfbf70, 0 4px 3px rgba(3,10,18,.45), 0 12px 12px rgba(3,10,18,.28);
}
.site-header.material-header .wordmark { width: auto; margin: 0; border: 0; background: none; box-shadow: none; justify-content: flex-start; align-items: center; }
.site-header.material-header .menu-toggle { grid-column: 2; grid-row: 1; align-self: center; justify-self: center; margin: 0; }
.site-header.material-header .header-panel { border: 1px solid #bb965d; border-top: 0; }
}

.site-header.material-header.force-compact { display: block; min-height: 0; padding: 0; border: 0; background: none; box-shadow: none; }
.site-header.material-header.force-compact .masthead-bar {
 display: grid; grid-template-columns: minmax(0, 1fr) 64px; align-items: stretch;
 width: 100%; min-height: 84px; padding: 6px; gap: 0;
 border: 1px solid #bb965d;
 background-color: #d8b36c;
 background-image: url("/assets/header-fluid-depth.webp");
 background-size: 290.55556% auto; background-position: 48.469388% 47%; background-repeat: no-repeat;
 box-shadow: inset 0 0 0 2px #74521d, inset 0 0 0 3px #dfbf70, 0 4px 3px rgba(3,10,18,.45), 0 12px 12px rgba(3,10,18,.28);
}
.site-header.material-header.force-compact .wordmark { width: auto; margin: 0; border: 0; background: none; box-shadow: none; justify-content: flex-start; align-items: center; }
.site-header.material-header.force-compact .menu-toggle { grid-column: 2; grid-row: 1; align-self: center; justify-self: center; margin: 0; }
.site-header.material-header.force-compact .header-panel { border: 1px solid #bb965d; border-top: 0; }

@media (forced-colors: active) {
 .site-header.material-header .masthead-bar { color: CanvasText; background: Canvas; border: 1px solid CanvasText; box-shadow: none; }
 .site-header.material-header .brand-mark { filter: none; }
}

/* Icons use a shared square viewBox, never font baselines or offset line boxes. */
.site-header.material-header .masthead-bar .menu-toggle:not([hidden]) { display: grid; place-items: center; }
.site-header.material-header .menu-glyph,
.site-header.material-header.force-compact .menu-glyph { position: relative; display: grid; place-items: center; width: 24px; height: 24px; line-height: 0; }
.site-header.material-header .menu-glyph svg { display: block; width: 24px; height: 24px; fill: none; stroke: currentColor; stroke-width: 2.4; stroke-linecap: round; stroke-linejoin: round; }
.site-header.material-header .menu-glyph .menu-close { display: none; }
.site-header.material-header .menu-toggle[aria-expanded="true"] .menu-bars { display: none; }
.site-header.material-header .menu-toggle[aria-expanded="true"] .menu-close { display: block; }
.action-icon { display: inline-grid; place-items: center; width: 1.5rem; height: 1.5rem; min-width: 1.5rem; flex: 0 0 auto; line-height: 0; }
.action-icon svg { display: block; width: 1.125rem; height: 1.125rem; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }

/* Inline progressive filter styles must yield to system forced-color rendering. */
@media (forced-colors: active) {
 .site-header.material-header nav .wood-lettering,
 .site-header.material-header.force-compact nav .wood-lettering { filter: none !important; color: LinkText !important; background: none !important; -webkit-text-fill-color: currentColor !important; -webkit-text-stroke: 0; }
 .site-header.material-header.force-compact .masthead-bar,
 .site-header.material-header .masthead-bar,
 .site-header.material-header.force-compact :is(.wordmark,.header-panel,.member-link,.menu-toggle) { color: CanvasText; background: Canvas; border-color: CanvasText; box-shadow: none; }
}

/* Pilot14: a left-anchored logo and larger 800-weight name fill the cream inset.
   Desktop padding maps to ~16 source units at each edge; the final S bearing
   is compensated by .047em. This is source geometry, pending rendered review. */
@media (min-width: 601px) and (max-width: 1535px) {
 .site-header.material-header .wordmark { font-size: 1.5rem; }
}
@media (max-width: 1535px) {
 .site-header.material-header .wordmark { flex-wrap: wrap; }
 .site-header.material-header .wordmark span { max-width: 100%; overflow-wrap: anywhere; }
}
.site-header.material-header.force-compact .wordmark { font-size: 1.5rem; justify-content: flex-start; }

.site-header.material-header .header-panel { box-shadow: none; }
@media (max-width: 1535px) { .site-header.material-header .header-panel { box-shadow: 0 7px 12px rgba(9,19,28,.13); } }
.site-header.material-header.force-compact .header-panel { box-shadow: 0 7px 12px rgba(9,19,28,.13); }
@media (forced-colors: active) { .site-header.material-header .header-decoration { filter: none; } .site-header.material-header .header-panel { box-shadow: none; } }

/* Pilot15: real font-size ratio, no horizontally distorted logo lettering. */
.site-header.material-header .wordmark > .brand-name { display: grid; gap: .12em; font-size: inherit; line-height: .96; text-align: left; }
.site-header.material-header .brand-name > span { display: block; margin: 0; line-height: 1.02; text-align: left; }
.site-header.material-header .brand-name .brand-name-top { font-size: 1.2821em; }
.site-header.material-header .brand-name .brand-name-bottom { font-size: 1em; }
/* Shallow raised oak labels deliberately separate from the distressed rail.
   Controlled light oak retains 24% aligned source grain under every glyph. */
.site-header.material-header nav a { position: relative; isolation: isolate; }
.site-header.material-header nav a::before {
 content: ""; position: absolute; inset: 0 -6px; z-index: -1; pointer-events: none;
 border: 1px solid rgba(103,72,32,.42); border-radius: 2px;
 background-color: #e5c58d;
 background-image: linear-gradient(rgba(229,197,141,.76),rgba(229,197,141,.76)), url("/assets/header-fluid-depth.webp");
 background-size: 100% 100%, var(--patch-frame-width,1560px) auto;
 background-position: 0 0, var(--patch-x,50%) var(--patch-y,47%);
 background-repeat: no-repeat;
 box-shadow: 0 2px 2px rgba(45,28,12,.28), inset 0 1px 0 rgba(255,240,202,.65), inset 0 -1px 0 rgba(95,62,24,.24);
}
.site-header.material-header nav .wood-lettering { color: #21160e; -webkit-text-stroke: .25px currentColor; paint-order: stroke fill; }
@media (max-width: 1535px) { .site-header.material-header nav a::before { display: none; } }
.site-header.material-header.force-compact nav a::before { display: none; }
@media (forced-colors: active) { .site-header.material-header nav a::before { display: none; } .site-header.material-header nav .wood-lettering { -webkit-text-stroke: 0; } }

/* Render-led breathing room: reduce the desktop identity group by 10%,
   preserving the two measured word widths and an explicit equal inner inset. */
@media (min-width: 1536px) {
 .site-header.material-header:not(.force-compact) .wordmark { font-size: clamp(1.575rem,1.845vw,1.8rem); padding-inline: clamp(16px,1.15vw,18px); justify-content: center; gap: 8px; }
 .site-header.material-header:not(.force-compact) .brand-mark { width: clamp(77.4px,6.86538vw,107.1px); }
 @supports (width: 1cqw) {
  .site-header.material-header:not(.force-compact) .wordmark { font-size: clamp(1.575rem,1.845cqw,1.8rem); padding-inline: 1.15cqw; }
  .site-header.material-header:not(.force-compact) .brand-mark { width: clamp(77.4px,6.86538cqw,107.1px); }
 }
}
@media (max-width: 1535px) { .site-header.material-header .wordmark { padding: 12px; } }
.site-header.material-header.force-compact .wordmark { padding: 12px; }

/* Pilot16.1: keep mark and name as one fixed-gap lockup; center the combined
   unit inside the same sign padding instead of distributing its parts. */

/* Pilot16.1 provisional material after actual study-v2 feedback. Background
   imagery is separate from the live original logo and live recessed labels. */
.site-header.material-header nav a::before { display: none !important; }
.site-header.material-header nav .wood-lettering { color: #16283c; -webkit-text-stroke: .3px #c7b28d; paint-order: stroke fill; text-shadow: none; }
@media (forced-colors: active) { .site-header.material-header nav .wood-lettering { color: LinkText !important; -webkit-text-stroke: 0; filter: none !important; } }

/* Pilot16.6: the menu is a set of real light-oak surfaces raised above the
   liquid, not carved lettering on the wet backboard. The image is unchanged;
   the native crop supplies grain, while a small bevel/contact/cast shadow gives
   each live control its own thickness. No positioning or font-size reduction. */
.site-header.material-header .header-panel nav a { position: relative; isolation: isolate; }
.site-header.material-header .header-panel nav a::before {
 display: block !important;
 content: ""; position: absolute; inset: 0 -4px; z-index: -1; pointer-events: none;
 border: 1px solid #9b773d; border-radius: 3px;
 background-color: #dfbe85;
 background-image: linear-gradient(180deg,rgba(255,239,196,.2),rgba(176,124,55,.08)),url("/assets/faithful-light-oak-solid-gold.webp");
 background-size: 100% 100%,1560px auto;
 background-position: 0 0,50% 47%; background-repeat: no-repeat;
 box-shadow: inset 0 1px 0 rgba(255,243,210,.85),inset 0 -3px 0 rgba(101,66,25,.7),0 2px 1px rgba(36,22,10,.56),0 7px 5px rgba(4,17,29,.42);
}
.site-header.material-header .header-panel nav .wood-lettering { color: #21160e; -webkit-text-stroke: 0; text-shadow: none; }
.site-header.material-header .header-panel nav a:is(:hover,:focus-visible)::before { border-color: #6f4c1d; box-shadow: inset 0 1px 0 rgba(255,246,223,.95),inset 0 -3px 0 rgba(101,66,25,.7),0 2px 1px rgba(36,22,10,.6),0 8px 6px rgba(4,17,29,.46); }
.site-header.material-header .header-panel nav a:active::before { box-shadow: inset 0 1px 0 rgba(255,243,210,.8),inset 0 -2px 0 rgba(101,66,25,.7),0 2px 2px rgba(4,17,29,.4); }
@media (max-width: 1535px) {
 .site-header.material-header .header-panel nav { gap: 12px 16px; padding-bottom: 18px; }
 .site-header.material-header .header-panel nav a::before { inset: 0; }
}
.site-header.material-header.force-compact .header-panel nav { gap: 12px 16px; padding-bottom: 18px; }
.site-header.material-header.force-compact .header-panel nav a::before { inset: 0; }
@media (forced-colors: active) {
 .site-header.material-header .header-panel nav a::before { background: Canvas; border: 1px solid ButtonText; box-shadow: none; }
 .site-header.material-header .header-panel nav .wood-lettering { color: LinkText !important; -webkit-text-stroke: 0; filter: none !important; }
}
@media (forced-colors: active) {
 .site-header.material-header .header-panel nav a:is(:hover,:focus-visible,:active)::before { background: Canvas; border-color: ButtonText; box-shadow: none; }
}

/* Pilot16.7: shallow pressed-fabric impression on the live wordmark only.
   Symbol, glyph geometry, Sora size/weight and navy face remain unchanged. */
.site-header.material-header .wordmark .brand-name { filter: url(#nm-wordmark-pressed); text-shadow: none; }
@media (forced-colors: active) {
 .site-header.material-header .wordmark .brand-name { filter: none !important; text-shadow: none; }
}

/* Pilot16.7 render-led refinement: quiet only the central reading band of
   each oak tile. Grain remains visible at its edges and through the wash;
   borders, bevel and cast/contact shadows are unchanged. */
.site-header.material-header .header-panel nav a::before {
 background-image: linear-gradient(180deg,transparent 0%,rgba(225,195,146,.66) 24%,rgba(225,195,146,.66) 76%,transparent 100%),linear-gradient(180deg,rgba(255,239,196,.2),rgba(176,124,55,.08)),url("/assets/faithful-light-oak-solid-gold.webp");
 background-size: 100% 100%,100% 100%,1560px auto;
 background-position: 0 0,0 0,50% 47%;
}
/* The compact viewport moves rightward into the clear center of the same
   pool, leaving its noisy left perimeter away from the identity. No new veil,
   crop height, material alpha, geometry or logo surface is introduced. */
@media (max-width: 1535px) {
 .site-header.material-header .masthead-bar { background-position: 58% 47%; }
}
.site-header.material-header.force-compact .masthead-bar { background-position: 58% 47%; }
@media (forced-colors: active) {
 .site-header.material-header .header-panel nav a::before { background: Canvas; }
}

/* Pilot16.8: the compact Member Access plaque carries the same shallow
   elevation as the source-image signs, without changing its size or labels. */
@media (max-width: 1535px) {
 .site-header.material-header .header-panel .member-link { box-shadow: inset 0 0 0 2px rgba(255,240,202,.35),0 2px 2px rgba(4,17,29,.34),0 6px 5px rgba(4,17,29,.2); }
}
.site-header.material-header.force-compact .header-panel .member-link { box-shadow: inset 0 0 0 2px rgba(255,240,202,.35),0 2px 2px rgba(4,17,29,.34),0 6px 5px rgba(4,17,29,.2); }
@media (forced-colors: active) {
 .site-header.material-header .header-panel .member-link,.site-header.material-header.force-compact .header-panel .member-link { box-shadow: none; }
}

/* Pilot16.8: the compact identity uses the actual original cream textile
   sign and gold edge above the liquid. Preserve the sign's source aspect,
   current symbol/type dimensions and 48px menu target; let its row grow. */
@media (max-width: 1535px) {
 .site-header.material-header .masthead-bar .wordmark {
  justify-self: start; width: max-content; max-width: 100%; min-height: 0;
  aspect-ratio: 545 / 215; padding: 14px 18px; gap: 8px;
  background-color: #eddfbf;
  background-image: url("/assets/header-fluid-depth.webp");
  background-size: 383.853211% 349.767442%;
  background-position: 6.851972% 46.368715%; background-repeat: no-repeat;
  box-shadow: 0 3px 2px rgba(4,17,29,.5),0 8px 6px rgba(4,17,29,.32);
 }
}
.site-header.material-header.force-compact .masthead-bar .wordmark {
 justify-self: start; width: max-content; max-width: 100%; min-height: 0;
 aspect-ratio: 545 / 215; padding: 14px 18px; gap: 8px;
 background-color: #eddfbf;
 background-image: url("/assets/header-fluid-depth.webp");
 background-size: 383.853211% 349.767442%;
 background-position: 6.851972% 46.368715%; background-repeat: no-repeat;
 box-shadow: 0 3px 2px rgba(4,17,29,.5),0 8px 6px rgba(4,17,29,.32);
}
@media (forced-colors: active) {
 .site-header.material-header .masthead-bar .wordmark,.site-header.material-header.force-compact .masthead-bar .wordmark { background: Canvas; border: 1px solid CanvasText; box-shadow: none; }
}
/* Retain the one-row lockup at the narrowest breakpoint. This changes only
   the sign's internal side clearance, not symbol/type or menu target size. */
@media (max-width: 380px) {
 .site-header.material-header .masthead-bar .wordmark,.site-header.material-header.force-compact .masthead-bar .wordmark { padding-inline: 12px; }
}

/* Pilot16.9: actual Chromium diagnostics found a subpixel shortfall from the
   inherited negative name margin. Wrapping flex then stacked the lockup while
   the sign retained its preferred ratio. Explicit columns, a reset margin and
   a 2px name allowance keep both pieces together at the measured widths. */
@media (max-width: 1535px) {
 .site-header.material-header .masthead-bar .wordmark {
  display: grid; grid-template-columns: auto minmax(0,1fr);
  grid-template-rows: auto; align-items: center; column-gap: 8px;
  flex-wrap: nowrap; width: fit-content; height: auto;
  min-height: min-content; max-width: 100%;
 }
 .site-header.material-header .masthead-bar .wordmark > .brand-mark { grid-column: 1; grid-row: 1; }
 .site-header.material-header .masthead-bar .wordmark > .brand-name { grid-column: 2; grid-row: 1; min-width: 0; width: auto; margin: 0; padding-inline-end: 2px; }
 .site-header.material-header .masthead-bar .brand-name > span { white-space: nowrap; overflow-wrap: normal; }
}
.site-header.material-header.force-compact .masthead-bar .wordmark {
 display: grid; grid-template-columns: auto minmax(0,1fr);
 grid-template-rows: auto; align-items: center; column-gap: 8px;
 flex-wrap: nowrap; width: fit-content; height: auto;
 min-height: min-content; max-width: 100%;
}
.site-header.material-header.force-compact .masthead-bar .wordmark > .brand-mark { grid-column: 1; grid-row: 1; }
.site-header.material-header.force-compact .masthead-bar .wordmark > .brand-name { grid-column: 2; grid-row: 1; min-width: 0; width: auto; margin: 0; padding-inline-end: 2px; }
/* Text-only enlargement may need more than one line per word. Keep that text
   beside the symbol and let the sign grow; never hide or scale the letters. */
.site-header.material-header.force-compact .masthead-bar .brand-name > span { white-space: normal; overflow-wrap: anywhere; }
/* Pilot16.9 enlargement-only supplement. Normal root-size compact and desktop
   layouts stay unchanged; only JS-detected text enlargement reflows. */
.site-header.material-header.force-compact .masthead-bar .wordmark {
 aspect-ratio: auto; height: auto; min-height: 0;
}
@media (max-width: 600px) {
 .site-header.material-header.force-compact .masthead-bar { grid-template-columns: minmax(0,1fr); row-gap: 8px; }
 .site-header.material-header.force-compact .masthead-bar .wordmark { grid-column: 1; grid-row: 1; width: 100%; grid-template-columns: minmax(0,1fr); row-gap: 8px; font-size: 1.25rem; }
 .site-header.material-header.force-compact .masthead-bar .wordmark > .brand-mark { grid-column: 1; grid-row: 1; justify-self: center; }
 .site-header.material-header.force-compact .masthead-bar .wordmark > .brand-name { grid-column: 1; grid-row: 2; width: 100%; padding-inline-end: 0; text-align: center; }
 .site-header.material-header.force-compact .masthead-bar .brand-name > span { text-align: center; white-space: normal; overflow-wrap: anywhere; }
 .site-header.material-header.force-compact .masthead-bar .menu-toggle { grid-column: 1; grid-row: 2; justify-self: end; margin: 0; }
}
@media (max-width: 380px) {
 .site-header.material-header.force-compact .masthead-bar .wordmark { font-size: 1.125rem; }
}

/* Pilot16.9 driftwood: unchanged live link geometry and focus targets. Only
   decorative pseudos use the two original transparent pieces. Alpha-based
   shadows follow their worn silhouettes; no rectangular cut-lumber frame. */
:is(.site-header.material-header,.site-header.material-header.force-compact) .header-panel nav a {
 --driftwood-image: url("/assets/nav-driftwood-a.png");
 --driftwood-size: 100% 140%;
}
:is(.site-header.material-header,.site-header.material-header.force-compact) .header-panel nav a:nth-of-type(even) {
 --driftwood-image: url("/assets/nav-driftwood-b.png");
 --driftwood-size: 100% 172%;
}
:is(.site-header.material-header,.site-header.material-header.force-compact) .header-panel nav a::before {
 display: block !important; inset: -3px -5px;
 border: 0; border-radius: 0; background-color: transparent;
 background-image: var(--driftwood-image); background-size: var(--driftwood-size);
 background-position: center; background-repeat: no-repeat;
 box-shadow: none; pointer-events: none;
 filter: drop-shadow(0 2px 1px rgba(4,17,29,.36)) drop-shadow(0 6px 4px rgba(4,17,29,.32));
}
:is(.site-header.material-header,.site-header.material-header.force-compact) .header-panel nav a::after {
 content: ""; position: absolute; inset: -3px -5px; z-index: -1; pointer-events: none;
 background: radial-gradient(ellipse at center,rgba(239,229,208,.14),rgba(239,229,208,.08) 52%,transparent 78%);
 mask-image: var(--driftwood-image); mask-size: var(--driftwood-size); mask-position: center; mask-repeat: no-repeat;
}
:is(.site-header.material-header,.site-header.material-header.force-compact) .header-panel nav a:nth-of-type(n+3)::before,
:is(.site-header.material-header,.site-header.material-header.force-compact) .header-panel nav a:nth-of-type(n+3)::after { transform: scaleX(-1); }
:is(.site-header.material-header,.site-header.material-header.force-compact) .header-panel nav a:is(:hover,:focus-visible,:active)::before {
 border: 0; box-shadow: none;
 filter: drop-shadow(0 2px 1px rgba(4,17,29,.4)) drop-shadow(0 7px 5px rgba(4,17,29,.38));
}
@media (forced-colors: active) {
 :is(.site-header.material-header,.site-header.material-header.force-compact) .header-panel nav a::before { background: Canvas !important; border: 1px solid ButtonText !important; filter: none !important; box-shadow: none !important; transform: none !important; }
 :is(.site-header.material-header,.site-header.material-header.force-compact) .header-panel nav a::after { display: none !important; }
}
/* Third isolated-trial supplement: preserve complete enlarged words. */
@media (max-width: 380px) {
 .site-header.material-header.force-compact .masthead-bar .wordmark { padding-inline: 8px; }
}
@media (max-width: 600px) {
 .site-header.material-header.force-compact .header-panel nav { grid-template-columns: minmax(0,1fr); }
 .site-header.material-header.force-compact .header-panel nav a,
 .site-header.material-header.force-compact .header-panel nav .wood-lettering { white-space: normal; overflow-wrap: normal; word-break: normal; }
}

/* Pilot16.10: deeply cut, lightly scorched live label cavities. */
/* Optional palette controls only. Append after material-header.css.
   The actual effect is the replacement #nm-inner-cut in the SAME document.
   Preserve header-menu.js syncCuts(), which already sets the inline filter URL.
   These variables inherit into the filter defs inside .material-header. */
.site-header.material-header {
  --nm-cut-floor: #432b1b;
  --nm-cut-wall: #060706;
  --nm-cut-lower-wall: #6b4a30;
  --nm-cut-lip: #c8ab7b;
}
.header-filter-defs [data-cut-palette="floor"] { flood-color: var(--nm-cut-floor, #432b1b); }
.header-filter-defs [data-cut-palette="wall"] { flood-color: var(--nm-cut-wall, #060706); }
.header-filter-defs [data-cut-palette="lower-wall"] { flood-color: var(--nm-cut-lower-wall, #6b4a30); }
.header-filter-defs [data-cut-palette="lip"] { flood-color: var(--nm-cut-lip, #c8ab7b); }
/* Existing Sora, size, weight, line-height, control bounds and labels stay intact.
   Existing forced-colors rule uses filter:none !important and remains required.
   Do not add strokes, text shadows, duplicated text, or generated label images. */

/*16.16: modest optical wordmark enlargement inside the unchanged sign. */
/* Optical enlargement only: preserve the sign, layout boxes and 8px inner gap.
   The inner-edge origins keep the symbol/name gap fixed as both grow by 4%.
   Narrow phones and text-enlarged layouts retain their verified safe sizing. */
@media (min-width: 381px) {
 .site-header.material-header:not(.force-compact) .wordmark > .brand-mark { transform: scale(1.04); transform-origin: 100% 50%; }
 .site-header.material-header:not(.force-compact) .wordmark > .brand-name { transform: scale(1.04); transform-origin: 0 50%; }
}

/* 16.18 compact identity correction. Append after material-header.css.
   Browser zoom can reduce the effective viewport into this layout. Respond to
   that layout normally; never infer zoom or counter-scale the page.
   Only the 16.16 paint enlargement is removed. The original sign, logo aspect,
   two-column lockup, Sora sizes, 8px gap and all hit boxes remain unchanged.
   Keep the separately tested .force-compact text-enlargement cascade exact. */
@media (min-width: 381px) and (max-width: 1535px) {
  .site-header.material-header:not(.force-compact) .wordmark > .brand-mark,
  .site-header.material-header:not(.force-compact) .wordmark > .brand-name {
    transform: none;
  }
}

/*16.18: full-fill compact material integration.
   Requires the new opaque, liquid-only texture with a vertical mirrored-pair
   wrapper (source then vertically reflected source) and no outer rim,
   white border, cream backing, frame, signs, writing or repeated Source orb.
   Delivery tile: 2172 by 1800, mirrored in both axes from the nucleus-free
   upper 1086 by 900 region of the approved thicker-gel artwork. No color edits.
   Before enabling, set --nm-compact-fluid-image to the verified asset URL on
   this header and add data-compact-fluid="full". Do not point it at the old
   alpha puddle or entire framed-header image. The fallback color is a loading
   fallback, not a substitute for the required full-fill material.

   The header paints ONE background behind its bar and complete flowing panel.
   Texture scale has no dependence on panel height or root-font size. A long
   menu reveals more texture instead of magnifying a cover image. Normal browser
   zoom still scales CSS pixels; this does not and must not counteract zoom.
   The mirrored tile uses a fixed 1086 CSS-pixel width in both axes. Each
   original crop spans 543 CSS pixels: grain stays stable from phones to wide
   bars, with 2 source pixels per CSS pixel. The nucleus is never repeated.
   The two mirror joins share exact edge pixels, although their reflected wave
   direction can still be noticeable and needs native-size visual review.
   The existing sign's own image, all controls, and one nav Source orb stay as-is.
 */
@media (max-width: 1535px) {
  .site-header.material-header[data-compact-fluid="full"] {
    background-color: var(--nm-compact-fluid-base, #f9f5ef);
    background-image: var(--nm-compact-fluid-image, none);
    background-size: 1086px auto;
    background-position: left top;
    background-repeat: repeat;
  }
  .site-header.material-header[data-compact-fluid="full"] .masthead-bar,
  .site-header.material-header[data-compact-fluid="full"] .header-panel {
    background: transparent;
  }
  .site-header.material-header[data-compact-fluid="full"] nav[data-carved-navigation] > .carving-context {
    display: none !important;
  }
}
.site-header.material-header.force-compact[data-compact-fluid="full"] {
  background-color: var(--nm-compact-fluid-base, #f9f5ef);
  background-image: var(--nm-compact-fluid-image, none);
  background-size: 1086px auto;
  background-position: left top;
  background-repeat: repeat;
}
.site-header.material-header.force-compact[data-compact-fluid="full"] .masthead-bar,
.site-header.material-header.force-compact[data-compact-fluid="full"] .header-panel {
  background: transparent;
}
.site-header.material-header.force-compact[data-compact-fluid="full"] nav[data-carved-navigation] > .carving-context {
  display: none !important;
}
/* Decorative preferences remain explicit. Existing forced-color controls and
   focus outlines retain their system colors. No texture in print/data-saving. */
@media (forced-colors: active) {
  .site-header.material-header[data-compact-fluid="full"] {
    background: Canvas !important;
  }
}
@media (prefers-reduced-data: reduce) {
  .site-header.material-header[data-compact-fluid="full"] {
    background-image: none !important;
  }
}
@media print {
  .site-header.material-header[data-compact-fluid="full"] {
    background: none !important;
  }
}

.site-header.material-header[data-compact-fluid="full"] { --nm-compact-fluid-base: #35271b; --nm-compact-fluid-image: url("/assets/compact-water-highlight-shoulder.svg"); }
@media (prefers-reduced-data: reduce) { .site-header.material-header[data-compact-fluid="full"] { background: #f9f5ef !important; } }

/*16.20: dedicated compact sign, enabled by data-compact-sign="native-clean".
   Native source/geometry checked; actual browser validation remains pending.

   Asset canvas: 550×217; original cream face: x20,y18.5,w510,h180.
   Face center = canvas center = (275,108.5). No guessed wordmark translation.
   Keep all current font sizes, grid columns, 8px gap and hit-box geometry.
   Keep root32 <=380px padding-inline:8px at material-header.css:854.
*/
.site-header.material-header[data-compact-sign="native-clean"] {
  --nm-compact-sign-image: url("/assets/compact-timber-sign.png");
}
@media (max-width: 1535px) {
  .site-header.material-header[data-compact-sign="native-clean"] .masthead-bar .wordmark {
    position: relative;
    inset: auto;
    isolation: isolate;
    background: none;
  }
  .site-header.material-header[data-compact-sign="native-clean"] .masthead-bar .wordmark::before {
    content: "";
    position: absolute;
    inset: 0;
    z-index: -1;
    pointer-events: none;
    background: var(--nm-compact-sign-image) center / contain no-repeat;
  }
  /* Independent readable face if the decorative PNG fails to load. Its fill
     does not extend into the transparent perimeter or enlarge the live link. */
  .site-header.material-header[data-compact-sign="native-clean"] .masthead-bar .wordmark::after {
    content: "";
    position: absolute;
    inset: 8.52534562% 3.63636364%;
    z-index: -2;
    pointer-events: none;
    background: #eddfbf;
  }
}
.site-header.material-header.force-compact[data-compact-sign="native-clean"] .masthead-bar .wordmark {
  position: relative;
  inset: auto;
  isolation: isolate;
  background: none;
}
.site-header.material-header.force-compact[data-compact-sign="native-clean"] .masthead-bar .wordmark::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: -1;
  pointer-events: none;
  background: none;
  border: 1px solid transparent;
  border-image-source: var(--nm-compact-sign-image);
  border-image-slice: 64 24 fill;
  border-image-width: 25.6px 9.6px;
  border-image-outset: 0;
  border-image-repeat: stretch;
}
.site-header.material-header.force-compact[data-compact-sign="native-clean"] .masthead-bar .wordmark::after {
  content: "";
  position: absolute;
  inset: 7.4px 8px;
  z-index: -2;
  pointer-events: none;
  background: #eddfbf;
}
/* Narrow text enlargement alone: recover the unused 6px on each side of
   this already stacked masthead. Wordmark8px padding, fonts and48px toggle
   stay unchanged. At320/root32 the sign grows274px to286px, still inside
   the288px border-box masthead; the open navigation is unaffected. */
@media (max-width: 380px) {
  .site-header.material-header.force-compact[data-compact-sign="native-clean"] .masthead-bar {
    padding-inline: 0;
  }
}
@media (forced-colors: active) {
  .site-header.material-header[data-compact-sign="native-clean"] .masthead-bar .wordmark {
    background: Canvas !important;
  }
  .site-header.material-header[data-compact-sign="native-clean"] .masthead-bar .wordmark::before,
  .site-header.material-header[data-compact-sign="native-clean"] .masthead-bar .wordmark::after {
    display: none;
  }
}

/* 16.21: CSS-only no-JS/script-failure reflow. Successful enhancement opts out
   after its own layout pass; enlarged live words are never scaled or clipped.
   At narrow widths the complete identity gets the available masthead width. */
@media (max-width: 1535px) {
  html:not(.header-preparing) .site-header.material-header:not([data-header-enhanced]) .masthead-bar .brand-name > span {
    white-space: normal;
    overflow-wrap: anywhere;
  }
  html:not(.header-preparing) .site-header.material-header:not([data-header-enhanced]) .masthead-bar .wordmark {
    aspect-ratio: auto;
    height: auto;
    min-height: 0;
  }
}
@media (max-width: 600px) {
  html:not(.header-preparing) .site-header.material-header:not([data-header-enhanced]) .masthead-bar {
    grid-template-columns: minmax(0, 1fr);
  }
  html:not(.header-preparing) .site-header.material-header:not([data-header-enhanced]) .masthead-bar .wordmark {
    grid-column: 1;
    grid-template-columns: minmax(0, 1fr);
    width: 100%;
    row-gap: 8px;
  }
  html:not(.header-preparing) .site-header.material-header:not([data-header-enhanced]) .masthead-bar .wordmark > .brand-mark {
    grid-column: 1;
    grid-row: 1;
    justify-self: center;
  }
  html:not(.header-preparing) .site-header.material-header:not([data-header-enhanced]) .masthead-bar .wordmark > .brand-name {
    grid-column: 1;
    grid-row: 2;
    width: 100%;
    padding-inline-end: 0;
  }
  html:not(.header-preparing) .site-header.material-header:not([data-header-enhanced]) .masthead-bar .brand-name > span {
    text-align: center;
  }
  html:not(.header-preparing) .site-header.material-header:not([data-header-enhanced]) .header-panel nav {
    grid-template-columns: minmax(0, 1fr);
  }
}

/* The same approved nine-slice used by JS-detected enlargement also frames
   the CSS-only stacked fallback. No new image or lettering geometry. */
@media (max-width: 600px) {
  html:not(.header-preparing) .site-header.material-header:not([data-header-enhanced])[data-compact-sign="native-clean"] .masthead-bar .wordmark::before {
    background: none;
    border: 1px solid transparent;
    border-image-source: var(--nm-compact-sign-image);
    border-image-slice: 64 24 fill;
    border-image-width: 25.6px 9.6px;
    border-image-outset: 0;
    border-image-repeat: stretch;
  }
  html:not(.header-preparing) .site-header.material-header:not([data-header-enhanced])[data-compact-sign="native-clean"] .masthead-bar .wordmark::after {
    inset: 7.4px 8px;
  }
}

/* Keep the compact first paint in the controller's closed layout.
   The bootstrap restores the visible no-JS fallback if enhancement fails. */
@media (max-width: 1535px) {
 html.header-preparing .site-header.material-header:not([data-header-enhanced]) .header-panel { display: none; }
 html.header-preparing .site-header.material-header:not([data-header-enhanced]) .menu-toggle[hidden] { display: grid; visibility: hidden; }
}

/* The unchanged large decorative water image waits for the critical hero.
   Its existing base colour and geometry remain while that image loads. */
@media (max-width: 1535px) {
 html.hero-art-loading .homepage-pilot .site-header.material-header[data-compact-fluid="full"] { --nm-compact-fluid-image: none; }
}