.ts-sheet-host {
  --ts-bg: #F8F0F0;
  --ts-ink: #16130F;
  --ts-muted: #4B4741;
  --ts-rule: #E0D6D4;
  --ts-accent: #0A82FF;
  --ts-display: 'Young Serif', 'Bodoni Moda', Georgia, 'Times New Roman', serif;
  --ts-body: 'Space Grotesk', 'Helvetica Neue', Helvetica, Arial, sans-serif;
  --ts-mono: 'Azeret Mono', 'IBM Plex Mono', ui-monospace, 'SF Mono', Menlo, monospace;
  --ts-measure: 63ch;
  --ts-gutter: clamp(20px, 5vw, 64px);

  background: var(--ts-bg);
  color: var(--ts-ink);
  font-family: var(--ts-body);
  font-size: 16px;
  font-weight: 300;
  line-height: 1.6;
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}

.ts-sheet-host[data-ground="bone"] { --ts-bg: #F8F0F0; --ts-ink: #16130F; --ts-muted: #4B4741; --ts-rule: #E0D6D4; --ts-accent: #0A82FF; }
.ts-sheet-host[data-ground="paper"] { --ts-bg: #D5DBDF; --ts-ink: #0E0850; --ts-muted: rgba(14,8,80,0.70); --ts-rule: rgba(14,8,80,0.18); --ts-accent: #0E0850; }
.ts-sheet-host[data-ground="entrees"] { --ts-bg: #0E0850; --ts-ink: #F8F0F0; --ts-muted: rgba(248,240,240,0.72); --ts-rule: rgba(248,240,240,0.20); --ts-accent: #0A82FF; }
.ts-sheet-host[data-ground="klein"] { --ts-bg: #0A82FF; --ts-ink: #FFFFFF; --ts-muted: rgba(255,255,255,0.80); --ts-rule: rgba(255,255,255,0.28); --ts-accent: #F8F0F0; }
.ts-sheet-host[data-ground="citron"] { --ts-bg: #F0EC88; --ts-ink: #0E0850; --ts-muted: rgba(14,8,80,0.72); --ts-rule: rgba(14,8,80,0.22); --ts-accent: #0E0850; }
.ts-sheet-host[data-ground="coral"] { --ts-bg: #F77072; --ts-ink: #0E0850; --ts-muted: rgba(14,8,80,0.74); --ts-rule: rgba(14,8,80,0.20); --ts-accent: #0E0850; }
.ts-sheet-host[data-ground="mint"] { --ts-bg: #A5E3C8; --ts-ink: #0E0850; --ts-muted: rgba(14,8,80,0.72); --ts-rule: rgba(14,8,80,0.20); --ts-accent: #0E0850; }
.ts-sheet-host[data-ground="marigold"] { --ts-bg: #F58A4E; --ts-ink: #0E0850; --ts-muted: rgba(14,8,80,0.74); --ts-rule: rgba(14,8,80,0.20); --ts-accent: #0E0850; }
.ts-sheet-host[data-ground="espresso"] { --ts-bg: #2A1A12; --ts-ink: #F2E7D3; --ts-muted: rgba(242,231,211,0.75); --ts-rule: rgba(242,231,211,0.22); --ts-accent: #E0612A; }

.ts-sheet-host *, .ts-sheet-host *::before, .ts-sheet-host *::after { box-sizing: border-box; }

.ts-sheet { max-width: 1180px; margin: 0 auto; padding: 0 var(--ts-gutter) clamp(64px, 10vw, 128px); }

/* ——— the masthead: the one signature moment ——— */
.ts-sheet-host .ts-stamp {
  display: flex; flex-wrap: wrap; gap: 12px 28px; align-items: baseline;
  padding: 18px 0 14px;
  border-bottom: 1px solid var(--ts-rule);
  font-family: var(--ts-mono); font-size: 11px; font-weight: 400;
  letter-spacing: 0.22em; text-transform: uppercase; color: var(--ts-muted);
}
.ts-sheet-host .ts-stamp b { font-weight: 500; color: var(--ts-accent); }
.ts-sheet-host .ts-spacer { flex: 1 1 auto; }

.ts-sheet-host .ts-masthead { padding: clamp(40px, 7vw, 92px) 0 clamp(28px, 4vw, 48px); border-bottom: 1px solid var(--ts-rule); }
.ts-sheet-host .ts-masthead h1 {
  font-family: var(--ts-display); font-weight: 400;
  font-size: clamp(34px, 6.4vw, 76px); line-height: 1.02;
  letter-spacing: -0.02em; margin: 0; max-width: 20ch;
  text-wrap: balance;
}
.ts-sheet-host .ts-deck {
  font-family: var(--ts-body); font-weight: 300;
  font-size: clamp(17px, 1.6vw, 21px); line-height: 1.45;
  color: var(--ts-muted); max-width: 48ch; margin: clamp(20px, 3vw, 32px) 0 0;
  text-wrap: pretty;
}

/* ——— the body: rail + single measure ——— */
.ts-sheet-host .ts-body { display: grid; grid-template-columns: minmax(0, 1fr); gap: clamp(32px, 5vw, 56px); padding-top: clamp(36px, 5vw, 64px); }
@media (min-width: 900px) {
  .ts-sheet-host .ts-body { grid-template-columns: 200px minmax(0, 1fr); gap: 64px; }
  .ts-sheet-host .ts-rail { position: sticky; top: 40px; align-self: start; }
}

.ts-sheet-host .ts-rail { font-family: var(--ts-mono); font-size: 11px; line-height: 1.55; letter-spacing: 0.04em; color: var(--ts-muted); }
.ts-sheet-host .ts-rail dl { margin: 0; display: grid; gap: 14px; }
.ts-sheet-host .ts-rail dt { text-transform: uppercase; letter-spacing: 0.2em; font-size: 10px; opacity: 0.6; }
.ts-sheet-host .ts-rail dd { margin: 3px 0 0; color: var(--ts-ink); overflow-wrap: anywhere; }
.ts-sheet-host .ts-rail hr { border: 0; border-top: 1px solid var(--ts-rule); margin: 22px 0; }

/* Reset first, rhythm second — a later rule resetting the child margin would
   out-specify the adjacent-sibling rule and silently kill every gap. */
.ts-sheet-host .ts-prose { max-width: var(--ts-measure); }
.ts-sheet-host .ts-prose > * { margin: 0; }
.ts-sheet-host .ts-prose > * + * { margin-top: 1.35em; }
.ts-sheet-host .ts-prose p { text-wrap: pretty; }
.ts-sheet-host .ts-lede { font-size: clamp(19px, 2vw, 23px); line-height: 1.5; font-weight: 300; letter-spacing: -0.008em; }
.ts-sheet-host .ts-prose h2 {
  font-family: var(--ts-mono); font-size: 11px; font-weight: 500;
  letter-spacing: 0.24em; text-transform: uppercase; color: var(--ts-accent);
  margin-top: 2.6em; padding-top: 1.1em; border-top: 1px solid var(--ts-rule);
}
.ts-sheet-host .ts-prose a { color: inherit; text-decoration: underline; text-underline-offset: 3px; text-decoration-thickness: 1px; text-decoration-color: var(--ts-rule); }
.ts-sheet-host .ts-prose a:hover { text-decoration-color: var(--ts-accent); }
.ts-sheet-host .ts-prose code { font-family: var(--ts-mono); font-size: 0.86em; }
.ts-sheet-host .ts-prose s { opacity: 0.5; }
.ts-sheet-host .ts-link { border-bottom: 1px dotted var(--ts-rule); }

.ts-sheet-host .ts-pull {
  margin: 2.2em 0; padding: 0 0 0 24px;
  border-left: 2px solid var(--ts-accent);
  font-family: var(--ts-display); font-weight: 400;
  font-size: clamp(22px, 2.6vw, 32px); line-height: 1.22;
  letter-spacing: -0.015em; max-width: 26ch; text-wrap: balance;
}

.ts-sheet-host .ts-prose ul { margin: 0; padding: 0; list-style: none; }
.ts-sheet-host .ts-prose ul li { position: relative; padding-left: 22px; }
.ts-sheet-host .ts-prose ul li + li { margin-top: 0.7em; }
.ts-sheet-host .ts-prose ul li::before { content: ''; position: absolute; left: 0; top: 0.72em; width: 10px; height: 1px; background: var(--ts-accent); }

/* figures may break the measure — the only thing on the page that does */
.ts-sheet-host .ts-plate { margin: clamp(32px, 5vw, 56px) 0; max-width: none; }
.ts-sheet-host .ts-plate img { display: block; width: 100%; height: auto; background: color-mix(in srgb, var(--ts-ink) 6%, transparent); }
.ts-sheet-host .ts-plate figcaption {
  font-family: var(--ts-mono); font-size: 11px; line-height: 1.5;
  letter-spacing: 0.04em; color: var(--ts-muted);
  margin-top: 12px; padding-top: 10px; border-top: 1px solid var(--ts-rule);
  max-width: 52ch;
}
.ts-sheet-host .ts-plate figcaption b { font-weight: 500; color: var(--ts-accent); text-transform: uppercase; letter-spacing: 0.18em; margin-right: 10px; }

.ts-sheet-host .ts-spec { border-collapse: collapse; width: 100%; max-width: var(--ts-measure); font-family: var(--ts-mono); font-size: 12px; margin: 2em 0; }
.ts-sheet-host .ts-spec th, .ts-sheet-host .ts-spec td { text-align: left; padding: 10px 16px 10px 0; border-top: 1px solid var(--ts-rule); vertical-align: top; }
.ts-sheet-host .ts-spec th { font-weight: 400; text-transform: uppercase; letter-spacing: 0.18em; font-size: 10px; color: var(--ts-muted); width: 34%; }

.ts-sheet-host .ts-colophon {
  margin-top: clamp(56px, 8vw, 96px); padding-top: 20px; border-top: 1px solid var(--ts-rule);
  font-family: var(--ts-mono); font-size: 11px; line-height: 1.65; letter-spacing: 0.04em; color: var(--ts-muted);
  display: grid; gap: 8px;
}
.ts-sheet-host .ts-colophon a { color: inherit; }
.ts-sheet-host .ts-colophon ul { margin: 0; padding: 0; list-style: none; }
.ts-sheet-host .ts-note { opacity: 0.75; }

@media print {
  .ts-sheet-host { background: #fff; color: #16130F; font-size: 11pt; }
  .ts-sheet-host .ts-rail { position: static; }
  .ts-sheet-host .ts-body { grid-template-columns: 170px minmax(0, 1fr); }
  .ts-sheet-host .ts-plate, .ts-sheet-host .ts-pull, .ts-sheet-host .ts-spec { break-inside: avoid; }
  .ts-sheet-host .ts-prose h2 { break-after: avoid; }
  @page { margin: 18mm; }
}

@media (prefers-reduced-motion: reduce) {
  .ts-sheet-host * { transition: none !important; animation: none !important; }
}
