/* WEISS.PRESS base components, v1.1 (2026-10-22; v1.0.1 added table, sign-off, lead words). Uses tokens.css only.
   v1.1: Bauhaus accents (heavy masthead bar, red rules, dot separators, triangle markers,
   vertical section labels on wide screens) and the embedded player block. Two families only.
   One stylesheet for every template. A template picks components; it does not add CSS. */

*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; text-size-adjust: 100%; }
body {
  margin: 0;
  background: var(--paper);
  color: var(--ink);
  font-family: var(--font-text);
  font-size: var(--body-size);
  line-height: var(--body-leading);
  font-optical-sizing: auto;
  text-rendering: optimizeLegibility;
}
img { max-width: 100%; height: auto; display: block; }
a { color: inherit; text-decoration-thickness: 1px; text-underline-offset: 0.18em; }
a:hover { color: var(--red); }
:focus-visible { outline: 3px solid var(--red); outline-offset: 2px; }
.skip { position: absolute; left: -9999px; }
.skip:focus { left: var(--s4); top: var(--s4); background: var(--ink); color: var(--paper); padding: var(--s2) var(--s3); z-index: 10; }

.page { max-width: var(--page-max); margin: 0 auto; padding: 0 var(--page-pad) var(--s8); }

/* Status band: generated from approval metadata, never edited by hand */
.status {
  font-family: var(--font-display);
  font-size: var(--label-size);
  letter-spacing: 0.06em;
  text-transform: uppercase;
  background: var(--ink);
  color: var(--paper);
  padding: var(--s2) var(--page-pad);
  text-align: center;
}

/* Masthead */
.mast { padding-top: var(--s5); }
.mast__bar {
  display: flex; flex-wrap: wrap; justify-content: space-between; gap: var(--s2) var(--s4);
  font-family: var(--font-display); font-size: var(--label-size);
  letter-spacing: 0.08em; text-transform: uppercase;
  border-bottom: var(--rule-thin) solid var(--rule); padding-bottom: var(--s2);
}
.mast__name {
  font-family: var(--font-display); font-weight: 900; font-stretch: var(--display-stretch);
  font-size: clamp(3rem, 11vw, 8.5rem); line-height: 0.88; letter-spacing: -0.02em;
  margin: var(--s3) 0 var(--s3); text-transform: uppercase;
}
.mast__name .dot { color: var(--red); }
.mast__rule { border: 0; border-top: var(--rule-mast) solid var(--rule); margin: 0; }
.mast__rule--thin { border-top-width: var(--rule-thin); margin-top: var(--s1); }

/* Subdued masthead (SSM and other quiet pages) */
.mast--quiet .mast__name { font-size: clamp(1.25rem, 3vw, 1.75rem); font-weight: 800; margin: var(--s3) 0; letter-spacing: 0.02em; }
.mast--quiet .mast__rule { border-top-width: var(--rule-section); }

/* Headline block */
.head { padding: var(--s6) 0 var(--s5); border-bottom: var(--rule-thin) solid var(--rule); }
.kicker {
  font-family: var(--font-display); font-size: var(--label-size); font-weight: 700;
  letter-spacing: 0.1em; text-transform: uppercase; color: var(--red); margin: 0 0 var(--s3);
}
.headline {
  font-family: var(--font-display); font-weight: 850; font-stretch: var(--display-stretch);
  font-size: var(--h1-size); line-height: 0.95; letter-spacing: -0.01em; margin: 0 0 var(--s4);
  max-width: 18ch;
}
.deck { font-style: italic; font-size: 1.25em; line-height: 1.35; max-width: var(--measure); margin: 0 0 var(--s4); color: var(--ink-soft); }
.byline { font-family: var(--font-display); font-size: var(--label-size); letter-spacing: 0.06em; text-transform: uppercase; margin: 0; }

/* Layout: one column on phones, main plus rail on wide screens */
.grid { display: grid; grid-template-columns: 1fr; gap: var(--s6) var(--gutter); padding-top: var(--s6); }
@media (min-width: 900px) {
  .grid { grid-template-columns: repeat(12, minmax(0, 1fr)); }
  .grid__main { grid-column: 1 / span 8; }
  .grid__rail { grid-column: 9 / span 4; }
  .grid__full { grid-column: 1 / -1; }
}

/* Sections and body text */
.section { margin: 0 0 var(--s7); }
.section__label {
  font-family: var(--font-display); font-size: var(--label-size); font-weight: 700;
  letter-spacing: 0.1em; text-transform: uppercase; margin: 0 0 var(--s3);
  padding-top: var(--s3); border-top: var(--rule-section) solid var(--rule);
}
.section .section__label { font-family: var(--font-display); font-size: var(--label-size); font-weight: 700; font-stretch: 100%; line-height: 1.5; letter-spacing: 0.1em; margin: 0 0 var(--s3); }
.section h2, .h2 {
  font-family: var(--font-display); font-weight: 800; font-stretch: 85%;
  font-size: var(--h2-size); line-height: 1.05; margin: 0 0 var(--s4);
}
.section h3, .h3 {
  font-family: var(--font-display); font-weight: 750; font-size: var(--h3-size);
  line-height: 1.15; margin: var(--s5) 0 var(--s2);
}
.prose p, .prose ul, .prose ol { max-width: var(--measure); margin: 0 0 var(--s4); }
.prose ul, .prose ol { padding-left: 1.2em; }
.prose li { margin: 0 0 var(--s2); }
.prose li::marker { color: var(--red); }

.callout {
  border-left: var(--rule-section) solid var(--red); padding: var(--s3) var(--s4);
  background: var(--paper-deep); max-width: var(--measure); margin: 0 0 var(--s4);
}
.callout p { margin: 0; }
.callout__label { font-family: var(--font-display); font-size: var(--label-size); font-weight: 700; letter-spacing: 0.08em; text-transform: uppercase; display: block; margin-bottom: var(--s1); }

/* Fact table */
.facts { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); border-top: var(--rule-section) solid var(--rule); margin: 0 0 var(--s5); }
.fact { display: flex; flex-direction: column-reverse; justify-content: flex-end; border-bottom: var(--rule-thin) solid var(--rule-light); padding: var(--s3) var(--s2) var(--s3) 0; }
.fact__value { margin: 0; font-family: var(--font-display); font-weight: 800; font-stretch: 80%; font-size: 1.9rem; line-height: 1; display: block; }
.fact__label { font-family: var(--font-display); font-size: var(--label-size); letter-spacing: 0.06em; text-transform: uppercase; display: block; margin-top: var(--s1); }

/* Phase and option cards */
.cards { display: grid; grid-template-columns: 1fr; gap: var(--s5); margin: 0 0 var(--s5); }
@media (min-width: 700px) { .cards--2 { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
.card { border-top: var(--rule-section) solid var(--rule); padding-top: var(--s3); }
.card__tag { font-family: var(--font-display); font-size: var(--label-size); font-weight: 700; letter-spacing: 0.1em; text-transform: uppercase; color: var(--red); margin: 0 0 var(--s2); }
.card h3 { margin-top: 0; }
.card__note { font-style: italic; border-top: var(--rule-thin) solid var(--rule-light); padding-top: var(--s2); margin-top: var(--s3); }

/* Media list (links only; no embedded players yet) */
.media-feature { border: var(--rule-thin) solid var(--rule); padding: var(--s5); margin: 0 0 var(--s7); background: var(--paper-deep); }
.media-list { list-style: none; margin: 0 0 var(--s7); padding: 0; border-top: var(--rule-section) solid var(--rule); }
.prose .media-list { max-width: none; padding-left: 0; }
.prose .media-item { margin: 0; }
.media-item::marker { content: none; }
.media-item { display: grid; grid-template-columns: 1fr; gap: var(--s2); padding: var(--s4) 0; border-bottom: var(--rule-thin) solid var(--rule-light); }
@media (min-width: 700px) { .media-item { grid-template-columns: 9rem minmax(0, 1fr) auto; align-items: baseline; gap: var(--s4); } }
.media-item__provider { font-family: var(--font-display); font-size: var(--label-size); font-weight: 700; letter-spacing: 0.08em; text-transform: uppercase; }
.media-item__title { font-family: var(--font-display); font-weight: 750; font-size: var(--h3-size); line-height: 1.2; margin: 0; }
.media-item__desc { margin: var(--s1) 0 0; max-width: var(--measure); }
.media-item__meta { font-family: var(--font-display); font-size: var(--label-size); color: var(--ink-soft); margin: var(--s1) 0 0; }
.btn {
  display: inline-flex; align-items: center; justify-content: center; min-height: var(--target-min); min-width: var(--target-min);
  padding: 0 var(--s4); border: 2px solid var(--ink); font-family: var(--font-display); font-weight: 700;
  font-size: 14px; letter-spacing: 0.06em; text-transform: uppercase; text-decoration: none; text-align: center; overflow-wrap: anywhere; padding-top: var(--s2); padding-bottom: var(--s2);
}
.btn:hover { background: var(--ink); color: var(--paper); }
.btn--solid { background: var(--ink); color: var(--paper); }
.btn--solid:hover { background: var(--red); border-color: var(--red); color: var(--paper); }

/* Contact block */
.contact { border-top: var(--rule-section) solid var(--rule); padding-top: var(--s3); }
.contact p { margin: 0 0 var(--s1); }
.contact__name { font-family: var(--font-display); font-weight: 800; font-size: var(--h3-size); }

/* Flags left in source copy, e.g. [CONFIRM], are shown, never hidden */
.flag { background: var(--red); color: var(--paper); font-family: var(--font-display); font-size: 0.8em; font-weight: 700; padding: 0 var(--s1); white-space: nowrap; }

/* Footer */
.foot { border-top: var(--rule-mast) solid var(--rule); margin-top: var(--s7); padding-top: var(--s3);
  font-family: var(--font-display); font-size: var(--label-size); letter-spacing: 0.04em; display: flex; flex-wrap: wrap; gap: var(--s2) var(--s5); justify-content: space-between; }
.foot p { margin: 0; }

/* Proposal (screen view) */
.proposal .sheet { max-width: 8.5in; margin: var(--s6) auto; background: var(--paper); }
.proposal .titleblock { border-top: var(--rule-mast) solid var(--rule); border-bottom: var(--rule-thin) solid var(--rule); padding: var(--s4) 0; display: grid; grid-template-columns: 1fr; gap: var(--s3); }
@media (min-width: 700px) { .proposal .titleblock { grid-template-columns: 2fr 1fr; align-items: end; } }
.proposal .titleblock__org { font-family: var(--font-display); font-weight: 900; font-stretch: var(--display-stretch); font-size: clamp(2rem, 6vw, 3.5rem); line-height: 0.9; text-transform: uppercase; margin: 0; }
.proposal .titleblock__meta { font-family: var(--font-display); font-size: var(--label-size); letter-spacing: 0.06em; text-transform: uppercase; margin: 0; }
.proposal .titleblock__meta p { margin: 0 0 var(--s1); }
.proposal .cols { display: grid; grid-template-columns: 1fr; gap: 0 var(--s6); }
@media (min-width: 700px) { .proposal .cols { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
.proposal .section { margin-bottom: var(--s5); }

.section h2.section__label, .section h3.section__label { font-size: var(--label-size); font-weight: 700; font-stretch: 100%; line-height: 1.5; margin: 0 0 var(--s3); }

/* v1.0.1: list lead words, plain tables, sign-off line (press-build table, signoff, lead items) */
.prose li .lead, .lead { font-family: var(--font-display); font-weight: 750; }
.tablewrap { max-width: var(--measure); margin: 0 0 var(--s5); }
.table { width: 100%; border-collapse: collapse; border-top: var(--rule-section) solid var(--rule); }
.table caption { text-align: left; font-family: var(--font-display); font-size: var(--label-size); font-weight: 700; letter-spacing: 0.1em; text-transform: uppercase; padding-bottom: var(--s2); }
.table th { font-family: var(--font-display); font-size: var(--label-size); font-weight: 700; letter-spacing: 0.08em; text-transform: uppercase; text-align: left; padding: var(--s2) var(--s3) var(--s2) 0; border-bottom: var(--rule-thin) solid var(--rule); }
.table td { vertical-align: top; text-align: left; padding: var(--s3) var(--s3) var(--s3) 0; border-bottom: var(--rule-thin) solid var(--rule-light); }
.table td:first-child { font-family: var(--font-display); font-weight: 750; }
@media (max-width: 599px) {
  .table thead { position: absolute; left: -9999px; }
  .table tr { display: block; padding: var(--s3) 0; border-bottom: var(--rule-thin) solid var(--rule-light); }
  .table td { display: block; border: 0; padding: 0 0 var(--s1); }
  .table td::before { content: attr(data-col); display: block; font-family: var(--font-display); font-size: var(--label-size); font-weight: 700; letter-spacing: 0.08em; text-transform: uppercase; color: var(--red); }
  .table td:first-child::before { content: none; }
}
.signoff { font-family: var(--font-display); font-weight: 700; font-size: var(--h3-size); border-top: var(--rule-mast) solid var(--rule); padding-top: var(--s3); margin: var(--s6) 0 0; max-width: var(--measure); }

/* ---------- v1.1 Bauhaus accents (Robert, Oct 22 2026 4:38 PM ET: more red rules, more of the type) ---------- */

/* Heavy masthead bar: an ink band with a red block at its start */
.mast__bar {
  background: var(--ink); color: var(--paper); border-bottom: 0;
  border-left: var(--s3) solid var(--red); padding: var(--s2) var(--s3); font-weight: 700;
}
.mast__rule--red { border-top: var(--rule-section) solid var(--red); margin-top: var(--s1); }

/* Dot separators: a red disc between items in the bar and the footer */
.mast__bar > span + span::before,
.foot > p + p::before {
  content: ""; display: inline-block; width: var(--dot); height: var(--dot); border-radius: 50%;
  background: var(--red); margin-right: var(--s2); vertical-align: 0.1em;
}
.mast__bar { justify-content: flex-start; gap: var(--s2) var(--s4); }

/* Triangle marker before a kicker */
.kicker::before {
  content: ""; display: inline-block; width: 0; height: 0; margin-right: var(--s2); vertical-align: 0.05em;
  border-left: 0.6em solid var(--red); border-top: 0.38em solid transparent; border-bottom: 0.38em solid transparent;
}

/* Red rules: every section label and the footer start in red */
.section__label { border-top-color: var(--red); }
.foot { position: relative; }
.foot::before { content: ""; position: absolute; left: 0; top: calc(-1 * var(--rule-mast)); width: var(--s8); height: var(--rule-mast); background: var(--red); }
.media-list { border-top-color: var(--ink); }
.media-feature { border-top: var(--rule-section) solid var(--red); }

/* Vertical section labels, wide screens only, main column only. DOM order stays label first. */
@media screen and (min-width: 900px) {
  body:not(.proposal) :is(.grid__main, .grid__full) > .section:has(> .section__label) {
    display: grid; grid-template-columns: var(--s7) minmax(0, 1fr); column-gap: var(--s5); align-items: start;
  }
  body:not(.proposal) :is(.grid__main, .grid__full) > .section:has(> .section__label) > * { grid-column: 2; }
  body:not(.proposal) :is(.grid__main, .grid__full) > .section > .section__label {
    grid-column: 1; grid-row: 1 / span 20; writing-mode: vertical-rl; transform: rotate(180deg);
    margin: 0; padding: var(--s3) var(--s2) 0 0; border-top: 0; border-left: var(--rule-section) solid var(--red);
    white-space: nowrap; justify-self: end; align-self: start;
  }
}

/* Embedded player (official provider embed only; see the embed block) */
.embed__frame { display: block; width: 100%; border: var(--rule-thin) solid var(--rule); background: var(--paper); margin: var(--s4) 0 var(--s3); }
.embed__fallback { font-family: var(--font-display); font-size: var(--label-size); letter-spacing: 0.04em; margin: 0; display: flex; flex-wrap: wrap; align-items: center; gap: var(--s2) var(--s3); }

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

/* ---------- Print ---------- */
@media print {
  :root { --paper: #ffffff; --paper-deep: #f3f1ec; }
  @page { size: Letter; margin: 0.6in 0.6in 0.7in; }
  html, body { background: #fff; }
  body { font-size: var(--print-body-size); line-height: var(--print-leading); }
  .status, .skip, .no-print { display: none !important; }
  .mast__bar, .mast__bar *, .foot, .kicker, .section__label { -webkit-print-color-adjust: exact; print-color-adjust: exact; }
  .page { max-width: none; padding: 0; }
  a { text-decoration: none; }
  .print-url::after { content: " (" attr(href) ")"; font-size: 0.85em; word-break: break-all; }
  .section, .card, .media-item, .fact, .callout { break-inside: avoid; }
  h2, h3, .section__label { break-after: avoid; }
  .mast__name { font-size: 54pt; }
  .headline { font-size: 34pt; }
  .grid { display: block; padding-top: var(--s4); }
  .facts { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .cards--2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .btn { border: 0; padding: 0; min-height: 0; min-width: 0; text-transform: none; font-weight: 600; }

  /* Proposal: two pages exactly, running footer with page numbers */
  .proposal .sheet { max-width: none; margin: 0; }
  .proposal .sheet + .sheet { break-before: page; }
  .proposal .titleblock { grid-template-columns: 2fr 1fr; align-items: end; padding: var(--s3) 0; }
  .proposal .titleblock__org { font-size: 30pt; }
  .proposal .cols { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0 0.35in; }
  .proposal .section { margin-bottom: var(--s4); }
  .proposal .section__label { font-size: var(--print-label-size); }
  .proposal h2 { font-size: 15pt; margin-bottom: var(--s2); }
  .proposal .prose p, .proposal .prose ul, .proposal .prose ol { margin-bottom: var(--s2); }
  .proposal .prose li { margin-bottom: var(--s1); }
  .proposal .foot { margin-top: var(--s4); }
}
@page proposal {
  size: Letter;
  margin: 0.6in 0.65in 0.75in;
  @bottom-right { content: "Page " counter(page) " of " counter(pages); font-family: 'Archivo', Arial, sans-serif; font-size: 8pt; }
}
@media print { .proposal { page: proposal; } }
