:root{--site-paper:#f4f4f4;--site-ink:#000;--site-accent:#0000ff;--site-font:ui-monospace,"SF Mono",SFMono-Regular,Menlo,Monaco,Consolas,monospace}
/* One shared header, with page-specific context kept in .meta. */
.site-header{--paper:var(--site-paper);--ink:var(--site-ink);--line:var(--site-ink);--accent:var(--site-accent);--mono:ui-monospace,"SF Mono",SFMono-Regular,Menlo,Monaco,Consolas,monospace;position:sticky;top:0;z-index:50;display:grid;grid-template-columns:auto auto minmax(0,1fr);align-items:center;gap:16px 28px;width:100%;padding:10px 40px;background:var(--paper);color:var(--ink);border-bottom:1px solid var(--line);font-family:var(--mono);font-size:13px;font-weight:400;letter-spacing:-.02em;line-height:1.35}
.site-header .brand{display:flex;align-items:center;gap:12px;min-width:0}.site-header .logo{font-size:15px;font-weight:400;letter-spacing:-.03em;text-transform:none;color:#000;text-decoration:none;white-space:nowrap}.site-header .site-pages{display:flex;align-items:center;gap:20px;font-size:13px;white-space:nowrap}.site-header .site-pages a{color:var(--accent);text-decoration:underline;text-underline-offset:3px}.site-header .site-pages a[aria-current=page]{color:#000;text-decoration:none}.site-header .meta{display:flex;justify-content:flex-end;align-items:center;gap:14px;font-size:11px;color:#777;text-transform:none;min-width:0}.site-header .meta a{color:var(--accent);text-decoration:underline}.site-header a:focus-visible,.site-header button:focus-visible,.site-header [role=menuitem]:focus-visible{outline:2px solid var(--accent);outline-offset:3px}.site-header [hidden]{display:none!important}
html{scroll-padding-top:calc(var(--site-header-height,42px) + 18px)}
@media(max-width:700px){.site-header{grid-template-columns:minmax(0,1fr) auto;grid-template-areas:"brand context" "pages pages";gap:10px 12px;padding:10px 18px}.site-header .brand{grid-area:brand;gap:8px;flex-wrap:wrap}.site-header .site-pages{grid-area:pages;gap:22px}.site-header .meta{grid-area:context;flex-direction:column;align-items:flex-end;gap:3px;font-size:10px;max-width:145px;text-align:right}.site-header .meta a{font-size:12px}}

/* ===== Editions dropdown (the one deliberate Shopify nod: a black pill) ===== */
.editions { position: relative; }
/* Pill styled like the retro Print button: beige raised bevel, square corners. */
.ed-pill {
  display: inline-flex; align-items: center; gap: 5px;
  font-family: var(--mono); font-size: 10px; letter-spacing: 0.03em;
  color: var(--ink); background: #d4d0c8;
  border: 1px solid; border-color: #fff #808080 #808080 #fff;
  box-shadow: inset 1px 1px 0 #f2f0ec, inset -1px -1px 0 #a8a4a0;
  padding: 3px 9px; cursor: pointer; text-transform: none;
}
/* Open = pressed: invert the bevel like .rail-print:active. */
.editions.open .ed-pill {
  border-color: #808080 #fff #fff #808080;
  box-shadow: inset 1px 1px 0 #a8a4a0, inset -1px -1px 0 #f2f0ec;
}
.editions.open .ed-chev { transform: rotate(180deg); }
.ed-chev { transition: transform .15s ease; }

.ed-menu {
  position: absolute; top: calc(100% + 6px); left: 0;
  width: 232px; background: var(--paper);
  border: 1px solid var(--ink); border-radius: 0;
  box-shadow: 3px 3px 0 var(--ink);          /* hard offset, NO blur — the not-Shopify signal */
  z-index: 60;                                /* above sticky masthead (z 50) */
  font-family: var(--mono); text-align: left;
}
.ed-close { display: none; }
.ed-cap {
  font-size: 8px; letter-spacing: 0.14em; color: #555; text-transform: none;
  padding: 5px 10px; border-bottom: 1px solid var(--ink);
}
.ed-row {
  display: flex; align-items: center; gap: 8px; width: 100%;
  padding: 6px 10px; border: 0; border-bottom: 1px solid var(--ink);
  background: none; text-decoration: none; color: var(--ink);
  cursor: pointer; font-family: var(--mono); text-align: left;
}
.ed-tile {
  flex: 0 0 16px; width: 16px; height: 16px; border: 1px solid var(--ink);
  display: flex; align-items: center; justify-content: center;
  font-size: 10px; font-weight: 700; color: #fff; border-radius: 0;
}
.ed-rowtext { display: flex; flex-direction: column; flex: 1 1 auto; min-width: 0; }
.ed-title { font-size: 11px; letter-spacing: -0.01em; line-height: 1.2; }
.ed-sub { display: block; font-size: 9px; color: #666; }
/* Blue only on actual mouse hover — not when a row is focused (the menu
   auto-focuses the first row on open, which shouldn't paint it blue). */
.ed-row:hover { background: var(--accent); }
.ed-row:hover .ed-title, .ed-row:hover .ed-sub { color: #fff; }
.ed-row:hover .ed-tile { border-color: #fff; }
/* Keyboard focus gets a subtle inset outline instead of the blue fill. */
.ed-row:focus-visible { outline: 1px solid var(--ink); outline-offset: -3px; }
.ed-row:focus { outline: none; }
/* The current edition is marked by a left ink-bar (no text tag — keeps the
   compact row uncluttered). */
.ed-row[aria-current="true"] { border-left: 3px solid var(--ink); padding-left: 7px; }
.ed-row[aria-current="true"]:hover { border-left-color: #fff; }
/* Footer styled like the retro Print button: beige raised bevel, not a black bar. */
.ed-foot {
  display: flex; justify-content: space-between; align-items: center;
  padding: 6px 10px; font-size: 9px; letter-spacing: 0.04em; text-decoration: none;
  font-family: var(--mono); color: var(--ink); background: #d4d0c8;
  border: 1px solid; border-color: #fff #808080 #808080 #fff;
  box-shadow: inset 1px 1px 0 #f2f0ec, inset -1px -1px 0 #a8a4a0;
}
.ed-foot:active {
  border-color: #808080 #fff #fff #808080;
  box-shadow: inset 1px 1px 0 #a8a4a0, inset -1px -1px 0 #f2f0ec;
}


/* Editions panel → full-width sheet on small screens (also the primary
   category navigator once the left rail collapses). */
@media (max-width: 600px) {
  .ed-menu {
    position: fixed; left: 0; right: 0; top: auto; width: 100%;
    border-left: 0; border-right: 0; box-shadow: none;
    max-height: 75vh; overflow-y: auto;
  }
  .ed-close {
    display: flex; align-items: center; justify-content: center;
    position: absolute; top: 6px; right: 10px; width: 26px; height: 26px;
    border: 1px solid var(--ink); background: var(--paper); color: var(--ink);
    font-family: var(--mono); font-size: 15px; line-height: 1; cursor: pointer; z-index: 1;
  }
  .ed-row { padding: 13px 16px; min-height: 44px; }
  .ed-title { font-size: 16px; }
}