/* The Exchange theme: public site and partner workspace. Generated by scripts/wp/build-theme-css.ts from the approved Next.js styles. Do not edit; edit the source and rebuild. */
/* GENERATED FILE. Do not edit. Source: design-tokens.json. Run `pnpm tokens`. */
:root {
  /* color */
  --color-paper: #FCFBF8; /* Default page background: soft white */
  --color-vellum: #F5F2EB; /* Alternate bands, input background */
  --color-linen: #E3DED3; /* Hairlines, dividers, disabled fills */
  --color-stone: #A29D92; /* Decorative only, never text */
  --color-graphite: #57534C; /* Secondary text (warm grey) */
  --color-ink: #141C2D; /* Ink navy: primary text, primary action, footer */
  --color-ink-soft: #253049; /* Surfaces and pressed states on ink */
  --color-cordovan: #9E1B32; /* Claret: links on hover, focus ring, small marks (text-safe on paper) */
  --color-cordovan-deep: #7D1427; /* Claret pressed, accent text on vellum */
  --color-brass: #D8C49A; /* Champagne: focus and small marks on ink only */
  --color-sage: #2F6B45; /* Success */
  --color-amber: #8A5A12; /* Warning, closing soon */
  --color-brick: #A12A2A; /* Error, destructive */
  --color-demo-text: #4F4B44; /* Demonstration designation text */
  --color-demo-fill: #EEEAE2; /* Demonstration designation fill */
  --color-vermilion: #B0283F; /* Claret rule: thin accent rules and the active mark, never large fills */
  --color-chartreuse: #F1EADB; /* Champagne wash: quiet highlight fills, always with ink text */
  /* font families */
  --font-display: Afacad, "Avenir Next", Avenir, -apple-system, BlinkMacSystemFont, "Segoe UI", system-ui, "Helvetica Neue", Arial, sans-serif;
  --font-text: "Avenir Next", Avenir, -apple-system, BlinkMacSystemFont, "Segoe UI Variable Text", "Segoe UI", system-ui, "Helvetica Neue", Arial, sans-serif;
  /* font weights */
  --weight-regular: 400;
  --weight-medium: 500;
  --weight-demibold: 600;
  --weight-bold: 700;
  /* type scale (fluid between 375px and 1440px) */
  --type-display-xl-size: clamp(40px, calc(27.32px + 3.3803vw), 76px);
  --type-display-xl-line: 1.04;
  --type-display-xl-weight: var(--weight-medium);
  --type-display-xl-tracking: -0.012em;
  --type-display-xl-family: var(--font-display);
  --type-display-l-size: clamp(32px, calc(23.55px + 2.2535vw), 56px);
  --type-display-l-line: 1.06;
  --type-display-l-weight: var(--weight-medium);
  --type-display-l-tracking: -0.01em;
  --type-display-l-family: var(--font-display);
  --type-display-m-size: clamp(26px, calc(21.77px + 1.1268vw), 38px);
  --type-display-m-line: 1.1;
  --type-display-m-weight: var(--weight-medium);
  --type-display-m-tracking: -0.005em;
  --type-display-m-family: var(--font-display);
  --type-heading-l-size: clamp(22px, calc(19.89px + 0.5634vw), 28px);
  --type-heading-l-line: 1.2;
  --type-heading-l-weight: var(--weight-demibold);
  --type-heading-l-tracking: -0.005em;
  --type-heading-l-family: var(--font-display);
  --type-heading-m-size: clamp(18px, calc(16.94px + 0.2817vw), 21px);
  --type-heading-m-line: 1.3;
  --type-heading-m-weight: var(--weight-demibold);
  --type-heading-m-tracking: 0;
  --type-heading-m-family: var(--font-display);
  --type-body-l-size: clamp(18px, calc(17.30px + 0.1878vw), 20px);
  --type-body-l-line: 1.55;
  --type-body-l-weight: var(--weight-regular);
  --type-body-l-tracking: 0;
  --type-body-l-family: var(--font-text);
  --type-body-size: clamp(16px, calc(15.65px + 0.0939vw), 17px);
  --type-body-line: 1.6;
  --type-body-weight: var(--weight-regular);
  --type-body-tracking: 0;
  --type-body-family: var(--font-text);
  --type-body-s-size: clamp(14px, calc(13.65px + 0.0939vw), 15px);
  --type-body-s-line: 1.5;
  --type-body-s-weight: var(--weight-regular);
  --type-body-s-tracking: 0;
  --type-body-s-family: var(--font-text);
  --type-label-size: 13px;
  --type-label-line: 1.3;
  --type-label-weight: var(--weight-medium);
  --type-label-tracking: 0.01em;
  --type-label-family: var(--font-text);
  --type-eyebrow-size: 12px;
  --type-eyebrow-line: 1.3;
  --type-eyebrow-weight: var(--weight-demibold);
  --type-eyebrow-tracking: 0.14em;
  --type-eyebrow-family: var(--font-text);
  /* space scale: the only spacing values in the system */
  --space-0: 2px;
  --space-1: 4px;
  --space-2: 8px;
  --space-3: 12px;
  --space-4: 16px;
  --space-5: 24px;
  --space-6: 32px;
  --space-7: 48px;
  --space-8: 64px;
  --space-9: 96px;
  --space-10: 128px;
  --space-11: 160px;
  /* radius */
  --radius-none: 0px;
  --radius-control: 2px;
  --radius-round: 9999px;
  /* borders, shadow, focus */
  --border-hairline: 1px solid var(--color-linen);
  --border-control-focus: 1px solid var(--color-ink);
  --shadow-float: 0 12px 32px rgba(20,28,45,0.16);
  --focus-ring: 2px solid var(--color-cordovan);
  --focus-offset: 2px;
  /* motion */
  --duration-micro: 120ms;
  --duration-disclosure: 200ms;
  --duration-page: 280ms;
  --duration-reduced: 0ms;
  --easing-standard: cubic-bezier(0.2, 0, 0, 1);
  /* sizes */
  --size-control-height-mobile: 48px;
  --size-control-height-desktop: 44px;
  --size-touch-min: 44px;
  --size-status-marker: 6px;
  --size-exchange-mark-width: 24px;
  /* aspect ratios */
  --aspect-listing-hero: 4 / 5;
  --aspect-index-thumb: 3 / 2;
  --aspect-video: 16 / 9;
  --aspect-logo: 1 / 1;
  /* grid (breakpoint values are repeated in media queries below because custom properties cannot drive them) */
  --grid-s-columns: 4;
  --grid-s-gutter: 16px;
  --grid-s-margin: 16px;
  --grid-m-columns: 8;
  --grid-m-gutter: 20px;
  --grid-m-margin: 32px;
  --grid-l-columns: 12;
  --grid-l-gutter: 24px;
  --grid-l-margin: 48px;
  --grid-xl-columns: 12;
  --grid-xl-gutter: 24px;
  --grid-xl-margin: auto;
  --grid-xl-max: 1344px;
  --grid-columns: var(--grid-s-columns);
  --grid-gutter: var(--grid-s-gutter);
  --grid-margin: var(--grid-s-margin);
  --control-height: var(--size-control-height-mobile);
}
@media (min-width: 640px) { :root { --grid-columns: var(--grid-m-columns); --grid-gutter: var(--grid-m-gutter); --grid-margin: var(--grid-m-margin); } }
@media (min-width: 1024px) { :root { --grid-columns: var(--grid-l-columns); --grid-gutter: var(--grid-l-gutter); --grid-margin: var(--grid-l-margin); --control-height: var(--size-control-height-desktop); } }
@media (min-width: 1440px) { :root { --grid-columns: var(--grid-xl-columns); --grid-gutter: var(--grid-xl-gutter); --grid-margin: var(--grid-xl-margin); } }
@media (prefers-reduced-motion: reduce) {
  :root { --duration-micro: var(--duration-reduced); --duration-disclosure: var(--duration-reduced); --duration-page: var(--duration-reduced); }
}

/*
 * Fonts for The Exchange (D-60, November 2 redesign).
 * No licensed font files have been supplied, so the site requests none: the stacks in tokens.css use faces
 * already installed on the visitor's device (Avenir Next Condensed or Bahnschrift for display, the system
 * sans for text). This avoids the 404s recorded in K-17. When VibeSociety supplies licensed WOFF2 files in
 * /assets/fonts/licensed/, add font face rules here for exactly those files and nothing else.
 * Never download, copy or commit font files from the internet. See docs/FONT-ASSETS-REQUIRED.txt.
 */

/* Global styles for The Exchange. Every color and spacing value comes from tokens.css (generated). */
*,
*::before,
*::after {
  box-sizing: border-box;
}
html {
  background: var(--color-paper);
  color: var(--color-ink);
  font-family: var(--font-text);
  font-size: var(--type-body-size);
  line-height: var(--type-body-line);
  -webkit-text-size-adjust: 100%;
  font-variant-numeric: tabular-nums;
  scroll-behavior: smooth;
}
@media (prefers-reduced-motion: reduce) {
  html {
    scroll-behavior: auto;
  }
  *,
  *::before,
  *::after {
    transition-duration: 0ms !important;
    animation-duration: 0ms !important;
  }
}
body {
  margin: 0;
  min-height: 100vh;
  overflow-x: hidden;
}
h1,
h2,
h3,
h4,
p,
ul,
ol,
dl,
figure {
  margin: 0;
}
ul,
ol {
  padding: 0;
  list-style: none;
}
img,
video {
  max-width: 100%;
  height: auto;
  display: block;
}
/* The picture wrapper adds no box, so slot rules written for img keep working. */
picture {
  display: contents;
}
button,
input,
select,
textarea {
  font: inherit;
  color: inherit;
}
a {
  color: inherit;
  text-decoration: underline;
  text-decoration-thickness: 1px;
  text-underline-offset: 3px;
  text-decoration-color: rgb(30 28 25 / 0.3);
  transition: text-decoration-color var(--duration-micro) var(--easing-standard);
}
a:hover {
  text-decoration-color: var(--color-cordovan);
}
:focus-visible {
  outline: var(--focus-ring);
  outline-offset: var(--focus-offset);
}
::selection {
  background: var(--color-vellum);
}

/* Typography primitives (Artifact 3, Section 3.3). Display sizes and headings use Afacad (D-61). */
.t-display-xl,
.t-display-l,
.t-display-m,
.t-heading-l,
.t-heading-m,
.t-body-l,
.t-body,
.t-body-s,
.t-label,
.t-eyebrow {
  margin: 0;
}
.t-display-xl { font-family: var(--type-display-xl-family); font-size: var(--type-display-xl-size); line-height: var(--type-display-xl-line); font-weight: var(--type-display-xl-weight); letter-spacing: var(--type-display-xl-tracking); text-wrap: balance; }
.t-display-l { font-family: var(--type-display-l-family); font-size: var(--type-display-l-size); line-height: var(--type-display-l-line); font-weight: var(--type-display-l-weight); letter-spacing: var(--type-display-l-tracking); text-wrap: balance; }
.t-display-m { font-family: var(--type-display-m-family); font-size: var(--type-display-m-size); line-height: var(--type-display-m-line); font-weight: var(--type-display-m-weight); letter-spacing: var(--type-display-m-tracking); text-wrap: balance; }
.t-heading-l { font-family: var(--type-heading-l-family); font-size: var(--type-heading-l-size); line-height: var(--type-heading-l-line); font-weight: var(--type-heading-l-weight); letter-spacing: var(--type-heading-l-tracking); text-wrap: balance; }
.t-heading-m { font-family: var(--type-heading-m-family); font-size: var(--type-heading-m-size); line-height: var(--type-heading-m-line); font-weight: var(--type-heading-m-weight); letter-spacing: var(--type-heading-m-tracking); }
.t-body-l { font-family: var(--type-body-l-family); font-size: var(--type-body-l-size); line-height: var(--type-body-l-line); font-weight: var(--type-body-l-weight); }
.t-body { font-family: var(--type-body-family); font-size: var(--type-body-size); line-height: var(--type-body-line); font-weight: var(--type-body-weight); }
.t-body-s { font-family: var(--type-body-s-family); font-size: var(--type-body-s-size); line-height: var(--type-body-s-line); font-weight: var(--type-body-s-weight); }
.t-label { font-family: var(--type-label-family); font-size: var(--type-label-size); line-height: var(--type-label-line); font-weight: var(--type-label-weight); letter-spacing: var(--type-label-tracking); }
.t-eyebrow { font-family: var(--type-eyebrow-family); font-size: var(--type-eyebrow-size); line-height: var(--type-eyebrow-line); font-weight: var(--type-eyebrow-weight); letter-spacing: var(--type-eyebrow-tracking); text-transform: uppercase; }
.t-graphite { color: var(--color-graphite); }
.t-cordovan { color: var(--color-cordovan); }
.t-measure { max-width: 65ch; }
.t-measure-wide { max-width: 75ch; }

/* Layout primitives (Artifact 3, Section 5). */
.container {
  width: 100%;
  margin-inline: auto;
  padding-inline: var(--grid-margin);
  max-width: calc(var(--grid-xl-max) + 2 * var(--grid-l-margin));
}
@media (min-width: 1440px) {
  .container {
    padding-inline: var(--grid-l-margin);
  }
}
.grid {
  display: grid;
  grid-template-columns: repeat(var(--grid-columns), minmax(0, 1fr));
  column-gap: var(--grid-gutter);
  row-gap: var(--space-6);
}
.band {
  padding-block: var(--space-8);
}
.band-tight {
  padding-block: var(--space-7);
}
.band-dark {
  background: var(--color-ink);
  color: var(--color-paper);
}
.band-dark a:hover {
  text-decoration-color: var(--color-brass);
}
.band-vellum {
  background: var(--color-vellum);
}
.hairline {
  border: 0;
  border-top: var(--border-hairline);
  margin: 0;
}
.visually-hidden {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}
.skip-link {
  position: absolute;
  left: var(--space-4);
  top: calc(-1 * var(--space-9));
  background: var(--color-ink);
  color: var(--color-paper);
  padding: var(--space-3) var(--space-4);
  z-index: 100;
  text-decoration: none;
}
.skip-link:focus {
  top: var(--space-4);
}
.stack > * + * {
  margin-top: var(--space-4);
}
.stack-tight > * + * {
  margin-top: var(--space-2);
}
.stack-loose > * + * {
  margin-top: var(--space-6);
}
.prose p + p {
  margin-top: var(--space-4);
}
.prose h3 {
  font-family: var(--type-heading-m-family);
  font-size: var(--type-heading-m-size);
  line-height: var(--type-heading-m-line);
  font-weight: var(--type-heading-m-weight);
  margin-top: var(--space-6);
}
.prose h4 {
  font-weight: var(--weight-demibold);
  margin-top: var(--space-5);
}
.prose ul,
.prose ol {
  margin-top: var(--space-4);
  padding-left: var(--space-5);
}
.prose ul {
  list-style: disc;
}
.prose ol {
  list-style: decimal;
}
.prose li + li {
  margin-top: var(--space-2);
}
.prose blockquote {
  margin: var(--space-4) 0;
  padding-left: var(--space-4);
  border-left: 2px solid var(--color-linen);
  color: var(--color-graphite);
}
.tabular {
  font-variant-numeric: tabular-nums;
}

/* apps/web/app/(auth)/auth.module.css */
.auth__shell {
  min-height: 100vh;
  display: flex;
  flex-direction: column;
}
.auth__head {
  padding: var(--space-5) var(--grid-margin);
  border-bottom: var(--border-hairline);
}
.auth__wordmark {
  display: inline-flex;
  flex-direction: column;
  text-decoration: none;
  line-height: 1;
}
.auth__name {
  font-family: var(--font-display);
  font-size: 28px;
}
.auth__by {
  font-size: var(--type-label-size);
  color: var(--color-graphite);
  margin-top: var(--space-1);
}
.auth__main {
  flex: 1;
  display: flex;
  justify-content: center;
  padding: var(--space-8) var(--grid-margin);
}
.auth__card {
  width: 100%;
  max-width: 420px;
  display: flex;
  flex-direction: column;
  gap: var(--space-5);
}
.auth__secret {
  font-family: ui-monospace, SFMono-Regular, Menlo, monospace;
  font-size: var(--type-body-size);
  letter-spacing: 0.08em;
  background: var(--color-vellum);
  padding: var(--space-3);
  word-break: break-all;
}
.auth__divider {
  display: flex;
  align-items: center;
  gap: var(--space-3);
  color: var(--color-graphite);
  font-size: var(--type-body-s-size);
}
.auth__divider::before,
.auth__divider::after {
  content: '';
  flex: 1;
  height: 1px;
  background: var(--color-linen);
}

/* apps/web/app/(public)/apply/[slug]/apply.module.css */
.apply__layout {
  display: grid;
  gap: var(--space-7);
  grid-template-columns: minmax(0, 1fr);
}
@media (min-width: 1024px) {
  .apply__layout {
    grid-template-columns: minmax(0, 7fr) minmax(0, 4fr);
    column-gap: calc(var(--grid-gutter) * 3);
    align-items: start;
  }
}
.apply__form {
  display: flex;
  flex-direction: column;
  gap: var(--space-6);
}
.apply__actions {
  display: flex;
  justify-content: space-between;
  gap: var(--space-3);
  padding-top: var(--space-5);
  border-top: var(--border-hairline);
}
.apply__aside {
  display: flex;
  flex-direction: column;
  gap: var(--space-4);
  border-top: 2px solid var(--color-ink);
  padding-top: var(--space-4);
}
@media (min-width: 1024px) {
  .apply__aside {
    position: sticky;
    top: var(--space-5);
  }
}
.apply__review {
  display: flex;
  flex-direction: column;
  gap: var(--space-3);
  border-top: var(--border-hairline);
  padding-top: var(--space-4);
}
.apply__reviewHead {
  display: flex;
  justify-content: space-between;
  align-items: baseline;
}
.apply__reviewList {
  display: flex;
  flex-direction: column;
  gap: var(--space-3);
}
.apply__reviewList dt {
  font-size: var(--type-label-size);
  color: var(--color-graphite);
}
.apply__reviewList dd {
  margin: 0;
  white-space: pre-wrap;
}
.apply__demoNotice {
  background: var(--color-demo-fill);
  color: var(--color-demo-text);
  padding: var(--space-4);
  display: flex;
  flex-direction: column;
  gap: var(--space-2);
}
.apply__thanks {
  display: flex;
  flex-direction: column;
  gap: var(--space-5);
  max-width: 60ch;
}
.apply__reference {
  font-family: var(--font-display);
  font-size: var(--type-display-m-size);
  line-height: 1.1;
  color: var(--color-cordovan);
  font-variant-numeric: tabular-nums;
}
/* Opt-in device draft (D-58) */
.apply__draft {
  padding-block: var(--space-3);
  border-bottom: var(--border-hairline);
}
.apply__draftActions {
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-3);
}

/* apps/web/app/(public)/brands/[slug]/brand.module.css */
.brand__head {
  display: grid;
  gap: var(--space-6);
  grid-template-columns: minmax(0, 1fr);
  padding-bottom: var(--space-7);
  margin-bottom: var(--space-7);
  border-bottom: var(--border-hairline);
}
@media (min-width: 640px) {
  .brand__head {
    grid-template-columns: 160px minmax(0, 1fr);
    column-gap: var(--space-6);
    align-items: start;
  }
}
.brand__mark img {
  width: 160px;
  aspect-ratio: var(--aspect-logo);
  object-fit: contain;
  background: var(--color-vellum);
  padding: var(--space-3);
}
.brand__text {
  min-width: 0;
}
.brand__rule {
  height: 2px;
  width: var(--space-8);
  background: var(--brand-accent, var(--color-ink));
  margin-top: var(--space-2);
}

/* apps/web/app/(public)/how-it-works/how.module.css */
.how__stages {
  display: flex;
  flex-direction: column;
}
.how__stage {
  display: grid;
  grid-template-columns: var(--space-8) minmax(0, 1fr);
  gap: var(--space-4);
  padding: var(--space-6) 0;
  border-top: var(--border-hairline);
}
.how__stage:last-child {
  border-bottom: var(--border-hairline);
}
.how__number {
  font-family: var(--font-display);
  font-size: var(--type-display-m-size);
  line-height: 1;
  color: var(--color-cordovan);
}

/* apps/web/app/(public)/opportunities/search.module.css */
.search__head {
  display: flex;
  flex-direction: column;
  gap: var(--space-5);
  padding-bottom: var(--space-6);
  border-bottom: var(--border-hairline);
}
.search__layout {
  display: grid;
  gap: var(--space-6);
  grid-template-columns: minmax(0, 1fr);
  padding-top: var(--space-6);
}
@media (min-width: 1024px) {
  .search__layout {
    grid-template-columns: minmax(0, 3fr) minmax(0, 9fr);
    column-gap: calc(var(--grid-gutter) * 2);
    align-items: start;
  }
}
.search__results {
  display: flex;
  flex-direction: column;
  gap: var(--space-4);
  min-width: 0;
}
.search__pagination {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: var(--space-4) 0;
}

/* apps/web/app/(public)/sign/[token]/sign.module.css */
.sign__step {
  display: flex;
  flex-direction: column;
  gap: var(--space-4);
  padding: var(--space-6) 0;
  border-top: var(--border-hairline);
}
.sign__document {
  max-height: 60vh;
  overflow: auto;
  border: 1px solid var(--color-linen);
  background: var(--color-paper);
  padding: var(--space-5);
}
.sign__document h3 {
  font-family: var(--font-text);
  font-size: var(--type-heading-m-size);
  font-weight: var(--weight-demibold);
  margin: var(--space-5) 0 var(--space-2);
}
.sign__document h1 {
  font-family: var(--font-display);
  font-size: var(--type-display-m-size);
  line-height: 1.1;
}
.sign__document p,
.sign__document li {
  font-size: var(--type-body-size);
  line-height: 1.6;
}
.sign__toggle {
  display: inline-flex;
  border: 1px solid var(--color-linen);
  border-radius: var(--radius-control);
  overflow: hidden;
}
.sign__toggle button {
  background: none;
  border: 0;
  padding: 0 var(--space-4);
  min-height: var(--size-touch-min);
  cursor: pointer;
}
.sign__toggle button[aria-pressed='true'] {
  background: var(--color-ink);
  color: var(--color-paper);
}
.sign__canvas {
  width: 100%;
  max-width: 600px;
  height: auto;
  aspect-ratio: 10 / 3;
  background: var(--color-vellum);
  border-bottom: 1px solid var(--color-ink);
  touch-action: none;
}
.sign__preview {
  font-family: var(--font-display);
  font-size: var(--type-display-m-size);
  color: var(--color-ink);
}

/* apps/web/components/folio/CategoryIndex.module.css */
.category-index__row {
  display: flex;
  gap: var(--space-5);
  overflow-x: auto;
  padding-bottom: var(--space-2);
  scrollbar-width: thin;
}
@media (min-width: 1024px) {
  .category-index__row {
    display: grid;
    grid-template-columns: repeat(5, minmax(0, 1fr));
    overflow: visible;
    row-gap: var(--space-5);
  }
}
.category-index__item {
  flex: 0 0 auto;
  display: flex;
  align-items: baseline;
  gap: var(--space-2);
  white-space: nowrap;
}
.category-index__item a {
  text-decoration: none;
}
.category-index__item a:hover {
  text-decoration: underline;
  text-decoration-color: var(--color-cordovan);
}
.category-index__count {
  color: var(--color-graphite);
  font-size: var(--type-body-size);
}

/* apps/web/components/folio/DemoBand.module.css */
.demo-band__band {
  background: var(--color-demo-fill);
  color: var(--color-demo-text);
  padding: var(--space-3) 0;
  font-size: var(--type-body-s-size);
  line-height: var(--type-body-s-line);
}
.demo-band__inner {
  display: flex;
  gap: var(--space-3);
  align-items: baseline;
}
.demo-band__word {
  font-weight: var(--weight-demibold);
  white-space: nowrap;
}

/* apps/web/components/folio/ExchangeMark.module.css */
/* The only ornament in the system: two short rules offset vertically, 24 px wide, in linen (Artifact 3, Section 10). */
.exchange-mark__mark {
  display: inline-block;
  width: var(--size-exchange-mark-width);
  height: 10px;
  position: relative;
}
.exchange-mark__mark::before,
.exchange-mark__mark::after {
  content: '';
  position: absolute;
  left: 0;
  width: 16px;
  height: 1px;
  background: var(--color-linen);
}
.exchange-mark__mark::before {
  top: 2px;
}
.exchange-mark__mark::after {
  top: 7px;
  left: var(--space-2);
}
.exchange-mark__onDark::before,
.exchange-mark__onDark::after {
  background: var(--color-stone);
}
.exchange-mark__closing {
  display: flex;
  justify-content: center;
  padding: var(--space-7) 0;
}

/* apps/web/components/folio/ExchangeSummary.module.css */
.exchange-summary__summary {
  border-top: 2px solid var(--color-ink);
  padding-top: var(--space-4);
  display: flex;
  flex-direction: column;
  gap: var(--space-4);
}
.exchange-summary__sticky {
  position: sticky;
  top: var(--space-5);
}
.exchange-summary__title {
  color: var(--color-graphite);
}
.exchange-summary__list {
  display: flex;
  flex-direction: column;
  gap: var(--space-3);
}
.exchange-summary__item {
  display: flex;
  flex-direction: column;
  gap: 2px;
}
.exchange-summary__itemLabel {
  font-size: var(--type-label-size);
  color: var(--color-graphite);
  letter-spacing: var(--type-label-tracking);
}
.exchange-summary__figure {
  font-family: var(--font-display);
  font-size: var(--type-display-m-size);
  line-height: var(--type-display-m-line);
  letter-spacing: var(--type-display-m-tracking);
  color: var(--color-cordovan);
  font-variant-numeric: tabular-nums;
}
.exchange-summary__figureLabel {
  font-size: var(--type-body-s-size);
  color: var(--color-graphite);
}
.exchange-summary__secondary {
  font-size: var(--type-body-s-size);
  color: var(--color-graphite);
}
.exchange-summary__secondary strong {
  color: var(--color-ink);
  font-weight: var(--weight-demibold);
}
.exchange-summary__values {
  display: grid;
  gap: var(--space-4);
}
.exchange-summary__values.exchange-summary__two {
  grid-template-columns: 1fr 1fr;
}
.exchange-summary__values.exchange-summary__two > * + * {
  border-left: 1px solid var(--color-linen);
  padding-left: var(--space-4);
}
.exchange-summary__cta {
  display: flex;
  flex-direction: column;
  gap: var(--space-2);
}
.exchange-summary__internal {
  display: inline-block;
  margin-left: var(--space-2);
  padding: 0 var(--space-1);
  border: 1px solid var(--color-linen);
  color: var(--color-graphite);
  font-size: var(--type-label-size);
  border-radius: var(--radius-control);
  vertical-align: middle;
  font-family: var(--font-text);
}
.exchange-summary__notice {
  color: var(--color-graphite);
  font-size: var(--type-body-s-size);
}
/* Sticky bottom bar on mobile */
.exchange-summary__bar {
  position: fixed;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: 40;
  background: var(--color-paper);
  border-top: var(--border-hairline);
  padding: var(--space-3) var(--grid-margin);
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: var(--space-3);
}
@media (min-width: 1024px) {
  .exchange-summary__bar {
    display: none;
  }
}
.exchange-summary__barSpacer {
  height: 80px;
}
@media (min-width: 1024px) {
  .exchange-summary__barSpacer {
    display: none;
  }
}

/* apps/web/components/folio/FactsStrip.module.css */
.facts-strip__strip {
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-4) var(--space-6);
  padding: var(--space-4) 0;
  border-top: var(--border-hairline);
  border-bottom: var(--border-hairline);
}
.facts-strip__fact {
  display: flex;
  flex-direction: column;
  gap: 2px;
  min-width: 120px;
}
.facts-strip__label {
  font-size: var(--type-label-size);
  letter-spacing: var(--type-label-tracking);
  color: var(--color-graphite);
}

/* apps/web/components/folio/Filters.module.css */
.filters__rail {
  display: none;
  flex-direction: column;
  gap: var(--space-4);
}
@media (min-width: 1024px) {
  .filters__rail {
    display: flex;
  }
}
.filters__mobileBar {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: var(--space-3);
}
@media (min-width: 1024px) {
  .filters__mobileBar {
    display: none;
  }
}
.filters__group {
  border-top: var(--border-hairline);
}
.filters__groupSummary {
  list-style: none;
  cursor: pointer;
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: var(--space-3) 0;
  min-height: var(--size-touch-min);
  font-weight: var(--weight-demibold);
}
.filters__groupSummary::-webkit-details-marker {
  display: none;
}
.filters__groupSummary::after {
  content: '+';
  color: var(--color-graphite);
  font-family: var(--font-display);
  font-size: var(--type-heading-l-size);
  line-height: 1;
}
details[open] > .filters__groupSummary::after {
  content: '\2212';
}
.filters__options {
  display: flex;
  flex-direction: column;
  gap: var(--space-1);
  padding-bottom: var(--space-4);
}
.filters__option {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--space-3);
  min-height: var(--size-touch-min);
  cursor: pointer;
}
.filters__optionLabel {
  display: flex;
  align-items: center;
  gap: var(--space-2);
}
.filters__option input {
  width: 18px;
  height: 18px;
  accent-color: var(--color-cordovan);
}
.filters__count {
  color: var(--color-graphite);
  font-size: var(--type-body-s-size);
}
.filters__active {
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-2);
  align-items: center;
}
.filters__chip {
  display: inline-flex;
  align-items: center;
  gap: var(--space-2);
  padding: var(--space-1) var(--space-2) var(--space-1) var(--space-3);
  border-radius: var(--radius-control);
  background: var(--color-vellum);
  font-size: var(--type-body-s-size);
  border: 0;
  cursor: pointer;
  min-height: 36px;
}
.filters__chip:hover {
  background: var(--color-linen);
}
.filters__chip span:last-child {
  color: var(--color-cordovan);
  font-weight: var(--weight-demibold);
}
.filters__clear {
  background: none;
  border: 0;
  text-decoration: underline;
  cursor: pointer;
  min-height: 36px;
  color: var(--color-graphite);
}
.filters__sortRow {
  display: flex;
  justify-content: space-between;
  align-items: center;
  flex-wrap: wrap;
  gap: var(--space-3);
  padding-bottom: var(--space-4);
  border-bottom: var(--border-hairline);
}
.filters__sortSelect {
  min-height: var(--size-touch-min);
  padding: 0 var(--space-2);
  background: var(--color-vellum);
  border: 0;
  border-bottom: 1px solid var(--color-linen);
}
.filters__sheetFooter {
  padding-top: var(--space-4);
  border-top: var(--border-hairline);
}

/* apps/web/components/folio/FolioPlate.module.css */
/* A designed plate for listings without licensed photography (DS-IMG-02). */
.folio-plate__plate {
  position: relative;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  padding: var(--space-5);
  width: 100%;
  aspect-ratio: var(--aspect-listing-hero);
  background: var(--color-vellum);
  color: var(--color-ink);
  border: 1px solid var(--color-linen);
  overflow: hidden;
}
.folio-plate__plate::after {
  content: '';
  position: absolute;
  inset: var(--space-3);
  border: 1px solid var(--color-linen);
  pointer-events: none;
}
.folio-plate__ink {
  background: var(--color-ink);
  color: var(--color-paper);
  border-color: var(--color-ink-soft);
}
.folio-plate__ink::after {
  border-color: var(--color-ink-soft);
}
.folio-plate__thumb {
  aspect-ratio: var(--aspect-index-thumb);
  padding: var(--space-4);
}
.folio-plate__square {
  aspect-ratio: var(--aspect-logo);
  padding: var(--space-4);
}
.folio-plate__label {
  font-family: var(--font-display);
  font-size: var(--type-display-m-size);
  line-height: var(--type-display-m-line);
  letter-spacing: var(--type-display-m-tracking);
  text-wrap: balance;
  max-width: 10ch;
  position: relative;
}
.folio-plate__thumb .folio-plate__label {
  font-size: var(--type-heading-l-size);
  line-height: 1.1;
}
.folio-plate__square .folio-plate__label {
  font-size: var(--type-heading-m-size);
}
.folio-plate__attribution {
  position: relative;
  color: var(--color-graphite);
}
.folio-plate__ink .folio-plate__attribution {
  color: var(--color-brass);
}
.folio-plate__number {
  position: relative;
  font-size: var(--type-body-s-size);
  color: var(--color-graphite);
}
.folio-plate__ink .folio-plate__number {
  color: var(--color-brass);
}
.folio-plate__top {
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  gap: var(--space-3);
  position: relative;
}

/* apps/web/components/folio/Footer.module.css */
/* D-61: compact and quiet on ink. Three short lists beside the brand line; the brands sit on one line at the bottom. */
.footer__footer {
  padding: var(--space-7) 0 var(--space-5);
}
.footer__grid {
  display: grid;
  gap: var(--space-5) var(--space-6);
  grid-template-columns: repeat(2, minmax(0, 1fr));
}
.footer__grid > div:first-child {
  grid-column: 1 / -1;
}
@media (min-width: 1024px) {
  .footer__grid {
    grid-template-columns: 2fr 1fr 1fr 1fr;
  }
  .footer__grid > div:first-child {
    grid-column: auto;
  }
}
.footer__wordmark {
  font-family: var(--font-display);
  font-weight: var(--weight-medium);
  font-size: 30px;
  letter-spacing: -0.005em;
  line-height: 1.1;
}
.footer__tagline {
  color: var(--color-linen);
  margin-top: var(--space-2);
}
.footer__heading {
  color: var(--color-brass);
  margin-bottom: var(--space-2);
}
.footer__list {
  display: flex;
  flex-direction: column;
}
.footer__list a,
.footer__brands a {
  text-decoration-color: rgb(250 249 244 / 0.35);
  min-height: var(--size-touch-min);
  display: inline-flex;
  align-items: center;
}
.footer__list a:hover,
.footer__brands a:hover {
  text-decoration-color: var(--color-brass);
}
.footer__bottom {
  margin-top: var(--space-6);
  padding-top: var(--space-3);
  border-top: 1px solid var(--color-ink-soft);
  color: var(--color-linen);
  font-size: var(--type-body-s-size);
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  align-items: center;
  gap: var(--space-3);
}
.footer__brands {
  display: flex;
  flex-wrap: wrap;
  gap: 0 var(--space-4);
}

/* apps/web/components/folio/Home.module.css */
.home__opening {
  display: grid;
  gap: var(--space-7);
  grid-template-columns: minmax(0, 1fr);
  padding: var(--space-8) 0 var(--space-8);
}
@media (min-width: 1024px) {
  .home__opening {
    grid-template-columns: minmax(0, 8fr) minmax(0, 4fr);
    column-gap: calc(var(--grid-gutter) * 2);
    padding-top: var(--space-9);
  }
}
.home__openingText {
  display: flex;
  flex-direction: column;
  gap: var(--space-6);
}
.home__lede {
  max-width: 52ch;
}
.home__openingPlate {
  display: flex;
  flex-direction: column;
  gap: var(--space-3);
}
.home__openingPlate a {
  text-decoration: none;
}
.home__openingPlate img {
  width: 100%;
  aspect-ratio: var(--aspect-listing-hero);
  object-fit: cover;
}
.home__moduleHead {
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  gap: var(--space-4);
  margin-bottom: var(--space-5);
}
.home__featured {
  display: grid;
  gap: var(--space-6);
  grid-template-columns: minmax(0, 1fr);
}
@media (min-width: 1024px) {
  .home__featured {
    grid-template-columns: minmax(0, 7fr) minmax(0, 5fr);
    column-gap: var(--grid-gutter);
  }
}
.home__featuredStack {
  display: flex;
  flex-direction: column;
}
.home__dense {
  display: flex;
  flex-direction: column;
}
.home__denseRow {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: var(--space-4);
  padding: var(--space-4) 0;
  border-top: var(--border-hairline);
  align-items: baseline;
}
.home__denseRow:last-child {
  border-bottom: var(--border-hairline);
}
.home__denseRow a {
  text-decoration: none;
}
.home__denseRow a:hover {
  text-decoration: underline;
  text-decoration-color: var(--color-cordovan);
}
.home__denseMeta {
  text-align: right;
  color: var(--color-graphite);
  font-size: var(--type-body-s-size);
  white-space: nowrap;
}
.home__steps {
  display: grid;
  gap: var(--space-6);
  grid-template-columns: minmax(0, 1fr);
}
@media (min-width: 640px) {
  .home__steps {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}
@media (min-width: 1024px) {
  .home__steps {
    grid-template-columns: repeat(4, minmax(0, 1fr));
  }
}
.home__step {
  display: flex;
  flex-direction: column;
  gap: var(--space-3);
  border-top: 1px solid var(--color-ink-soft);
  padding-top: var(--space-4);
}
.home__stepNumber {
  font-family: var(--font-display);
  font-size: var(--type-display-m-size);
  line-height: 1;
  color: var(--color-brass);
}
.home__brandList {
  display: flex;
  flex-direction: column;
}
.home__brandRow {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: var(--space-2) var(--space-5);
  padding: var(--space-4) 0;
  border-top: var(--border-hairline);
  align-items: baseline;
}
@media (min-width: 640px) {
  .home__brandRow {
    grid-template-columns: minmax(0, 4fr) minmax(0, 7fr) auto;
  }
}
.home__brandRow:last-child {
  border-bottom: var(--border-hairline);
}
.home__brandRow a {
  text-decoration: none;
}
.home__brandRow a:hover {
  text-decoration: underline;
  text-decoration-color: var(--color-cordovan);
}
.home__brandCount {
  color: var(--color-graphite);
  font-size: var(--type-body-s-size);
}
.home__privileges {
  display: grid;
  gap: var(--space-6);
  grid-template-columns: minmax(0, 1fr);
}
@media (min-width: 1024px) {
  .home__privileges {
    grid-template-columns: minmax(0, 5fr) minmax(0, 7fr);
    column-gap: calc(var(--grid-gutter) * 2);
  }
}
.home__defs {
  display: flex;
  flex-direction: column;
}
.home__def {
  padding: var(--space-4) 0;
  border-top: var(--border-hairline);
  display: flex;
  flex-direction: column;
  gap: var(--space-1);
}
.home__def:last-child {
  border-bottom: var(--border-hairline);
}
.home__qualifier {
  color: var(--color-graphite);
  font-size: var(--type-body-s-size);
}
.home__propose {
  display: flex;
  flex-direction: column;
  gap: var(--space-5);
  align-items: flex-start;
}
@media (min-width: 1024px) {
  .home__propose {
    flex-direction: row;
    justify-content: space-between;
    align-items: center;
  }
}
.home__stories {
  display: grid;
  gap: var(--space-6);
  grid-template-columns: minmax(0, 1fr);
}
@media (min-width: 1024px) {
  .home__stories {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}
.home__quiet {
  padding: var(--space-8) 0;
}

/* apps/web/components/folio/IndexEntry.module.css */
/* Opportunities are entries in an index, not floating cards (Artifact 3, Section 8). */
.index-entry__entry {
  display: grid;
  gap: var(--space-4);
  padding: var(--space-5) 0;
  border-top: var(--border-hairline);
  position: relative;
}
.index-entry__entry:last-child {
  border-bottom: var(--border-hairline);
}
.index-entry__grid .index-entry__entry {
  grid-template-rows: auto 1fr;
  border-top: var(--border-hairline);
  border-bottom: 0;
}
.index-entry__list .index-entry__entry {
  grid-template-columns: minmax(0, 1fr);
}
@media (min-width: 640px) {
  .index-entry__list .index-entry__entry {
    grid-template-columns: minmax(160px, 3fr) minmax(0, 9fr);
    align-items: start;
  }
}
.index-entry__image {
  width: 100%;
}
.index-entry__image img {
  width: 100%;
  aspect-ratio: var(--aspect-index-thumb);
  object-fit: cover;
}
.index-entry__body {
  display: flex;
  flex-direction: column;
  gap: var(--space-2);
  min-width: 0;
}
.index-entry__meta {
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-2) var(--space-3);
  font-size: var(--type-body-s-size);
  line-height: var(--type-body-s-line);
  color: var(--color-graphite);
}
.index-entry__number {
  font-size: var(--type-body-s-size);
  color: var(--color-graphite);
}
.index-entry__title {
  color: var(--color-ink);
}
.index-entry__title a {
  text-decoration: none;
}
.index-entry__title a::after {
  content: '';
  position: absolute;
  inset: 0;
}
.index-entry__title a:hover {
  text-decoration: underline;
  text-decoration-color: var(--color-cordovan);
}
.index-entry__summary {
  color: var(--color-ink);
}
.index-entry__ledger {
  color: var(--color-graphite);
  font-size: var(--type-body-s-size);
  line-height: var(--type-body-s-line);
}
.index-entry__head {
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  gap: var(--space-3);
}
.index-entry__collection {
  display: grid;
}
.index-entry__grid {
  grid-template-columns: repeat(1, minmax(0, 1fr));
  column-gap: var(--grid-gutter);
}
@media (min-width: 640px) {
  .index-entry__grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}
@media (min-width: 1024px) {
  .index-entry__grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
  .index-entry__grid.index-entry__two {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}
.index-entry__featuredLarge .index-entry__entry {
  border-top: 0;
}
.index-entry__statusRow {
  margin-top: var(--space-1);
}
.index-entry__tags {
  position: relative;
  z-index: 1;
}

/* apps/web/components/folio/Ledger.module.css */
/* The ledger: a titled column of line-item blocks separated by hairlines. Value lines live inside blocks (Artifact 3, Section 9). */
.ledger__ledgers {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  row-gap: var(--space-6);
  position: relative;
}
@media (min-width: 1024px) {
  .ledger__ledgers {
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
    column-gap: calc(var(--grid-gutter) * 2 + 1px);
  }
  /* The spine: a 1 px linen rule centered in the gutter between the two ledgers. */
  .ledger__ledgers::before {
    content: '';
    position: absolute;
    top: 0;
    bottom: 0;
    left: 50%;
    width: 1px;
    background: var(--color-linen);
  }
}
.ledger__mobileSpine {
  display: flex;
  align-items: center;
  gap: var(--space-3);
  color: var(--color-graphite);
  font-size: var(--type-body-s-size);
}
.ledger__mobileSpine::before,
.ledger__mobileSpine::after {
  content: '';
  flex: 1;
  height: 1px;
  background: var(--color-linen);
}
@media (min-width: 1024px) {
  .ledger__mobileSpine {
    display: none;
  }
}
.ledger__column {
  display: flex;
  flex-direction: column;
  min-width: 0;
}
.ledger__columnTitle {
  padding-bottom: var(--space-4);
}
.ledger__items {
  display: flex;
  flex-direction: column;
}
/* Each line item is a block: flex column with gap, no fixed heights, no reserved slots (Artifact 3, Section 9.4). */
.ledger__block {
  display: flex;
  flex-direction: column;
  gap: var(--space-2);
  padding: var(--space-5) 0;
  border-top: var(--border-hairline);
}
.ledger__items .ledger__block:last-child {
  border-bottom: var(--border-hairline);
}
.ledger__cadence {
  color: var(--color-graphite);
  font-size: var(--type-body-s-size);
  line-height: var(--type-body-s-line);
}
.ledger__value {
  font-size: var(--type-body-s-size);
  line-height: var(--type-body-s-line);
  font-variant-numeric: tabular-nums;
}
.ledger__valueFigure {
  font-weight: var(--weight-demibold);
}
.ledger__internal {
  display: inline-block;
  margin-left: var(--space-2);
  padding: 0 var(--space-1);
  border: 1px solid var(--color-linen);
  color: var(--color-graphite);
  font-size: var(--type-label-size);
  border-radius: var(--radius-control);
}
.ledger__conditions,
.ledger__notes,
.ledger__provider,
.ledger__requirements {
  color: var(--color-graphite);
  font-size: var(--type-body-s-size);
  line-height: var(--type-body-s-line);
}
.ledger__link {
  align-self: flex-start;
}
.ledger__total {
  padding: var(--space-5) 0;
  display: flex;
  flex-direction: column;
  gap: var(--space-1);
}
.ledger__totalLine {
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-2);
  align-items: baseline;
}
.ledger__totalFigure {
  font-weight: var(--weight-demibold);
  font-variant-numeric: tabular-nums;
}
.ledger__qualifier {
  color: var(--color-graphite);
  font-size: var(--type-body-s-size);
}

/* apps/web/components/folio/ListingPage.module.css */
.listing-page__crumbs {
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-2);
  padding: var(--space-4) 0;
  font-size: var(--type-body-s-size);
  color: var(--color-graphite);
}
.listing-page__crumbs a {
  color: var(--color-graphite);
  display: inline-flex;
  align-items: center;
  min-height: var(--size-touch-min);
}
.listing-page__head {
  display: grid;
  gap: var(--space-6);
  grid-template-columns: minmax(0, 1fr);
  padding-bottom: var(--space-7);
}
@media (min-width: 1024px) {
  .listing-page__head {
    grid-template-columns: minmax(0, 8fr) minmax(0, 4fr);
    column-gap: calc(var(--grid-gutter) * 2);
    align-items: start;
  }
}
.listing-page__headText {
  display: flex;
  flex-direction: column;
  gap: var(--space-5);
}
.listing-page__plain {
  color: var(--color-graphite);
}
.listing-page__hero img {
  width: 100%;
  aspect-ratio: var(--aspect-listing-hero);
  object-fit: cover;
}
.listing-page__body {
  display: grid;
  gap: var(--space-7);
  grid-template-columns: minmax(0, 1fr);
  padding-top: var(--space-7);
}
@media (min-width: 1024px) {
  .listing-page__body {
    grid-template-columns: minmax(0, 8fr) minmax(0, 4fr);
    column-gap: calc(var(--grid-gutter) * 2);
    align-items: start;
  }
}
.listing-page__main {
  display: flex;
  flex-direction: column;
  gap: var(--space-8);
  min-width: 0;
}
.listing-page__section {
  display: flex;
  flex-direction: column;
  gap: var(--space-4);
}
.listing-page__portfolio {
  display: flex;
  gap: var(--space-4);
  overflow-x: auto;
  padding-bottom: var(--space-2);
}
.listing-page__portfolioItem {
  flex: 0 0 240px;
  display: flex;
  flex-direction: column;
  gap: var(--space-2);
}
.listing-page__portfolioItem img {
  aspect-ratio: var(--aspect-index-thumb);
  object-fit: cover;
  width: 100%;
}
.listing-page__video {
  display: flex;
  flex-direction: column;
  gap: var(--space-2);
  margin: 0;
}
.listing-page__videoFrame {
  aspect-ratio: var(--aspect-video);
  background: var(--color-ink);
  border: var(--border-hairline);
}
.listing-page__videoFrame video {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: contain;
}
.listing-page__closingBand {
  display: flex;
  flex-direction: column;
  gap: var(--space-4);
  align-items: flex-start;
}
.listing-page__rail {
  display: none;
}
@media (min-width: 1024px) {
  .listing-page__rail {
    display: block;
    align-self: stretch;
  }
}
.listing-page__inflowSummary {
  display: block;
}
@media (min-width: 1024px) {
  .listing-page__inflowSummary {
    display: none;
  }
}
.listing-page__notice {
  border: 1px solid var(--color-linen);
  padding: var(--space-4);
  display: flex;
  flex-direction: column;
  gap: var(--space-2);
}
.listing-page__audience {
  display: inline-flex;
  gap: var(--space-2);
  align-items: center;
  padding: var(--space-2) var(--space-3);
  border: 1px solid var(--color-linen);
  font-size: var(--type-body-s-size);
  color: var(--color-graphite);
}

/* apps/web/components/folio/Masthead.module.css */
/* D-61: a quiet header on soft white with one hairline. Afacad wordmark; one ink action. */
.masthead__header {
  background: var(--color-paper);
  color: var(--color-ink);
  border-bottom: var(--border-hairline);
}
.masthead__header a {
  color: inherit;
}
.masthead__inner {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--space-5);
  min-height: 64px;
}
.masthead__wordmark {
  display: inline-flex;
  align-items: baseline;
  gap: var(--space-2);
  text-decoration: none;
  line-height: 1;
  padding: var(--space-2) 0;
  min-height: var(--size-touch-min);
  align-self: center;
  flex-wrap: wrap;
}
.masthead__wordmark:hover {
  text-decoration: none;
}
.masthead__name {
  font-family: var(--font-display);
  font-weight: var(--weight-demibold);
  font-size: 26px;
  letter-spacing: -0.01em;
}
.masthead__by {
  font-size: var(--type-label-size);
  color: var(--color-graphite);
  letter-spacing: 0.02em;
}
.masthead__nav {
  display: none;
  align-items: center;
  gap: var(--space-5);
}
@media (min-width: 1024px) {
  .masthead__nav {
    display: flex;
  }
}
.masthead__nav > a:not(.masthead__cta) {
  text-decoration: none;
  padding: var(--space-2) 0;
  min-height: var(--size-touch-min);
  display: inline-flex;
  align-items: center;
  font-weight: var(--weight-medium);
  border-bottom: 1px solid transparent;
  transition: border-color var(--duration-micro) var(--easing-standard), color var(--duration-micro) var(--easing-standard);
}
.masthead__nav > a:not(.masthead__cta):hover {
  color: var(--color-cordovan);
}
.masthead__nav > a[aria-current='page'] {
  border-bottom-color: var(--color-cordovan);
}
.masthead__signIn {
  color: var(--color-graphite);
}
.masthead__cta {
  margin-left: var(--space-2);
}
.masthead__header .masthead__cta {
  color: var(--color-paper);
}
.masthead__menuButton {
  display: inline-flex;
  align-items: center;
  gap: var(--space-2);
  min-height: var(--size-touch-min);
  padding: 0 var(--space-4);
  background: transparent;
  color: var(--color-ink);
  border: 1px solid var(--color-ink);
  border-radius: var(--radius-control);
  font: inherit;
  font-weight: var(--weight-demibold);
  text-decoration: none;
  cursor: pointer;
}
.masthead__header .masthead__menuButton {
  color: var(--color-ink);
}
.masthead__menuIcon,
.masthead__menuIcon::before,
.masthead__menuIcon::after {
  display: block;
  width: 16px;
  height: 2px;
  background: currentColor;
}
.masthead__menuIcon {
  position: relative;
}
.masthead__menuIcon::before,
.masthead__menuIcon::after {
  content: '';
  position: absolute;
  left: 0;
}
.masthead__menuIcon::before {
  top: -5px;
}
.masthead__menuIcon::after {
  top: 5px;
}
@media (min-width: 1024px) {
  .masthead__menuButton {
    display: none;
  }
}
.masthead__sheetNav {
  display: flex;
  flex-direction: column;
}
.masthead__sheetNav a {
  padding: var(--space-4) 0;
  border-bottom: var(--border-hairline);
  text-decoration: none;
  font-family: var(--font-display);
  font-size: var(--type-heading-m-size);
  font-weight: var(--weight-medium);
  min-height: var(--size-touch-min);
  color: var(--color-ink);
}
.masthead__sheetNav a[aria-current='page'] {
  text-decoration: underline;
  text-decoration-color: var(--color-cordovan);
  text-underline-offset: 6px;
}
.masthead__sheetNav .masthead__sheetCta {
  background: var(--color-ink);
  color: var(--color-paper) !important;
  border: 1px solid var(--color-ink);
  padding: var(--space-4);
  margin-bottom: var(--space-3);
  font-weight: var(--weight-demibold);
}

/* apps/web/components/folio/Parties.module.css */
.parties__list {
  display: grid;
  gap: var(--space-4);
  grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
}
.parties__party {
  display: flex;
  flex-direction: column;
  gap: 2px;
  border-top: var(--border-hairline);
  padding-top: var(--space-3);
}
.parties__party a {
  display: inline-flex;
  align-items: center;
  min-height: var(--size-touch-min);
}
.parties__role {
  font-size: var(--type-label-size);
  letter-spacing: var(--type-label-tracking);
  color: var(--color-graphite);
}

/* apps/web/components/folio/SearchComposer.module.css */
.search-composer__form {
  display: flex;
  flex-direction: column;
  gap: var(--space-4);
}
.search-composer__sentence {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  gap: var(--space-2) var(--space-3);
  font-size: var(--type-body-l-size);
  line-height: 1.8;
}
.search-composer__blank {
  position: relative;
  display: inline-block;
  min-width: 220px;
  flex: 1 1 220px;
}
.search-composer__input {
  width: 100%;
  min-height: var(--control-height);
  padding: var(--space-2) var(--space-3);
  background: var(--color-vellum);
  border: 0;
  border-bottom: 1px solid var(--color-ink);
  border-radius: 0;
  font-size: var(--type-body-l-size);
}
.search-composer__input:focus {
  outline: var(--focus-ring);
  outline-offset: var(--focus-offset);
}
.search-composer__listbox {
  position: absolute;
  z-index: 30;
  top: 100%;
  left: 0;
  right: 0;
  margin: var(--space-1) 0 0;
  background: var(--color-paper);
  border: 1px solid var(--color-linen);
  box-shadow: var(--shadow-float);
  max-height: 240px;
  overflow: auto;
  font-size: var(--type-body-size);
  line-height: 1.4;
}
.search-composer__option {
  padding: var(--space-3) var(--space-3);
  cursor: pointer;
  min-height: var(--size-touch-min);
  display: flex;
  align-items: center;
}
.search-composer__option[aria-selected='true'],
.search-composer__option:hover {
  background: var(--color-vellum);
}
.search-composer__keyword {
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-3);
  align-items: flex-end;
}
.search-composer__keywordField {
  flex: 1 1 240px;
  display: flex;
  flex-direction: column;
  gap: var(--space-2);
}
.search-composer__keywordInput {
  width: 100%;
  min-height: var(--control-height);
  padding: var(--space-2) var(--space-3);
  background: var(--color-vellum);
  border: 0;
  border-bottom: 1px solid var(--color-linen);
  border-radius: 0;
}
.search-composer__keywordInput:focus {
  border-bottom-color: var(--color-ink);
  outline: var(--focus-ring);
  outline-offset: var(--focus-offset);
}
.search-composer__label {
  font-size: var(--type-label-size);
  font-weight: var(--weight-medium);
  color: var(--color-graphite);
}

/* apps/web/components/privacy/Consent.module.css */
/* Privacy choice band and the /privacy-choices controls (D-58). An inline band under the masthead: it never
   covers content or the mobile Apply bar, and it does not block the page. */
.consent__banner {
  background: var(--color-vellum);
  border-bottom: var(--border-hairline);
}
.consent__inner {
  display: grid;
  gap: var(--space-4);
  padding-block: var(--space-4);
}
@media (min-width: 1024px) {
  .consent__inner {
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: center;
    gap: var(--space-6);
  }
}
.consent__text {
  display: grid;
  gap: var(--space-1);
  max-width: 62em;
}
.consent__actions {
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-3);
  align-items: center;
}
.consent__choices {
  border: 0;
  margin: 0;
  padding: 0;
  display: grid;
  gap: 0;
}
.consent__choices legend {
  margin-bottom: var(--space-3);
}
.consent__row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: var(--space-5);
  align-items: start;
  padding-block: var(--space-4);
  border-top: var(--border-hairline);
}
.consent__row:last-child {
  border-bottom: var(--border-hairline);
}
.consent__switch {
  width: 24px;
  height: 24px;
  margin: var(--space-1) 0 0;
  accent-color: var(--color-ink);
}

/* apps/web/components/ui/Button.module.css */
.button__button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: var(--space-2);
  min-height: var(--control-height);
  padding: 0 var(--space-5);
  border-radius: var(--radius-control);
  border: 1px solid transparent;
  font-weight: var(--weight-demibold);
  font-size: var(--type-body-size);
  line-height: 1;
  text-decoration: none;
  cursor: pointer;
  position: relative;
  transition: background-color var(--duration-micro) var(--easing-standard), color var(--duration-micro) var(--easing-standard), border-color var(--duration-micro) var(--easing-standard);
  white-space: nowrap;
}
.button__button:disabled,
.button__button[aria-disabled='true'] {
  cursor: not-allowed;
}
.button__primary {
  /* D-61: a quiet ink action with soft-white text; hover deepens to claret. */
  background: var(--color-ink);
  color: var(--color-paper);
  border-color: var(--color-ink);
  font-weight: var(--weight-demibold);
  letter-spacing: 0.01em;
}
.button__primary:hover {
  background: var(--color-cordovan-deep);
  border-color: var(--color-cordovan-deep);
  color: var(--color-paper);
}
.button__primary:active {
  background: var(--color-ink-soft);
  border-color: var(--color-ink-soft);
  color: var(--color-paper);
}
.button__primary:disabled {
  background: var(--color-linen);
  border-color: var(--color-linen);
  color: var(--color-graphite);
}
.button__secondary {
  background: transparent;
  color: var(--color-ink);
  border-color: var(--color-ink);
}
.button__secondary:hover {
  background: var(--color-vellum);
}
.button__secondary:active {
  background: var(--color-linen);
}
.button__secondary:disabled {
  color: var(--color-graphite);
  border-color: var(--color-linen);
  background: transparent;
}
.button__tertiary {
  background: transparent;
  color: var(--color-ink);
  padding-inline: var(--space-1);
  min-height: var(--size-touch-min);
  text-decoration: underline;
  text-underline-offset: 4px;
  text-decoration-thickness: 1px;
  font-weight: var(--weight-medium);
}
.button__tertiary:hover {
  text-decoration-thickness: 2px;
  text-decoration-color: var(--color-cordovan);
}
.button__tertiary:disabled {
  color: var(--color-graphite);
  text-decoration: none;
}
.button__destructive {
  background: var(--color-brick);
  color: var(--color-paper);
  border-color: var(--color-brick);
}
.button__destructive:hover {
  background: var(--color-cordovan-deep);
  border-color: var(--color-cordovan-deep);
}
.button__destructive:disabled {
  background: var(--color-linen);
  border-color: var(--color-linen);
  color: var(--color-graphite);
}
.button__onDark.button__primary {
  background: var(--color-paper);
  color: var(--color-ink);
  border-color: var(--color-paper);
}
.button__onDark.button__primary:hover {
  background: var(--color-brass);
  border-color: var(--color-brass);
  color: var(--color-ink);
}
.button__onDark.button__secondary {
  color: var(--color-paper);
  border-color: var(--color-paper);
}
.button__onDark.button__secondary:hover {
  background: var(--color-ink-soft);
}
.button__full {
  width: 100%;
}
/* Loading keeps the label and adds a progress indicator, so width never jumps. */
.button__loading .button__label {
  opacity: 0.6;
}
.button__spinner {
  width: 12px;
  height: 12px;
  border-radius: var(--radius-round); /* round: a circular control */
  border: 2px solid currentColor;
  border-right-color: transparent;
  animation: button__spin 800ms linear infinite;
}
@keyframes button__spin {
  to {
    transform: rotate(360deg);
  }
}
@media (prefers-reduced-motion: reduce) {
  .button__spinner {
    animation: none;
    border-right-color: currentColor;
    opacity: 0.5;
  }
}

/* apps/web/components/ui/Dialog.module.css */
.dialog__dialog {
  border: 1px solid var(--color-linen);
  background: var(--color-paper);
  color: var(--color-ink);
  padding: 0;
  max-width: min(560px, calc(100vw - 2 * var(--space-4)));
  width: 100%;
  box-shadow: var(--shadow-float);
}
.dialog__dialog::backdrop {
  background: rgb(30 28 25 / 0.5);
}
.dialog__sheet {
  margin: 0;
  max-width: none;
  width: 100vw;
  height: 100dvh;
  max-height: 100dvh;
  border: 0;
}
.dialog__inner {
  padding: var(--space-5);
  display: flex;
  flex-direction: column;
  gap: var(--space-4);
}
.dialog__head {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: var(--space-4);
}
.dialog__close {
  background: none;
  border: 1px solid var(--color-ink);
  border-radius: var(--radius-control);
  min-width: var(--size-touch-min);
  min-height: var(--size-touch-min);
  cursor: pointer;
}
.dialog__body {
  overflow: auto;
}

/* apps/web/components/ui/Disclosure.module.css */
.disclosure__details {
  border-top: var(--border-hairline);
  border-bottom: var(--border-hairline);
}
.disclosure__summary {
  list-style: none;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--space-4);
  padding: var(--space-4) 0;
  min-height: var(--size-touch-min);
  font-weight: var(--weight-demibold);
}
.disclosure__summary::-webkit-details-marker {
  display: none;
}
.disclosure__summary::after {
  content: '+';
  font-family: var(--font-display);
  font-size: var(--type-heading-l-size);
  line-height: 1;
  color: var(--color-graphite);
  transition: transform var(--duration-disclosure) var(--easing-standard);
}
.disclosure__details[open] .disclosure__summary::after {
  content: '\2212';
}
.disclosure__body {
  padding: 0 0 var(--space-5) 0;
}

/* apps/web/components/ui/EmptyState.module.css */
.empty-state__empty {
  padding: var(--space-6) 0;
  border-top: var(--border-hairline);
  border-bottom: var(--border-hairline);
  display: flex;
  flex-direction: column;
  gap: var(--space-3);
  align-items: flex-start;
}

/* apps/web/components/ui/Form.module.css */
.form__field {
  display: flex;
  flex-direction: column;
  gap: var(--space-2);
}
.form__label {
  font-size: var(--type-label-size);
  line-height: var(--type-label-line);
  font-weight: var(--type-label-weight);
  letter-spacing: var(--type-label-tracking);
}
.form__optional {
  color: var(--color-graphite);
  font-weight: var(--weight-regular);
}
.form__help {
  font-size: var(--type-body-s-size);
  line-height: var(--type-body-s-line);
  color: var(--color-graphite);
}
.form__input,
.form__textarea,
.form__select {
  width: 100%;
  min-height: var(--size-control-height-mobile);
  padding: var(--space-3) var(--space-3);
  background: var(--color-vellum);
  border: 0;
  border-bottom: 1px solid var(--color-linen);
  border-radius: 0;
  transition: border-color var(--duration-micro) var(--easing-standard);
}
.form__input:focus,
.form__textarea:focus,
.form__select:focus {
  border-bottom-color: var(--color-ink);
  outline: var(--focus-ring);
  outline-offset: var(--focus-offset);
}
.form__textarea {
  min-height: 120px;
  resize: vertical;
  line-height: var(--type-body-line);
}
.form__select {
  appearance: none;
  background-image: none;
}
.form__invalid {
  border-bottom-color: var(--color-brick);
}
.form__error {
  display: flex;
  align-items: flex-start;
  gap: var(--space-2);
  color: var(--color-brick);
  font-size: var(--type-body-s-size);
  line-height: var(--type-body-s-line);
}
.form__errorIcon {
  flex: 0 0 auto;
  width: 16px;
  height: 16px;
  margin-top: 2px;
}
.form__check {
  display: flex;
  gap: var(--space-3);
  align-items: flex-start;
  min-height: var(--size-touch-min);
  cursor: pointer;
}
.form__check input {
  width: 20px;
  height: 20px;
  margin: 2px 0 0 0;
  accent-color: var(--color-ink);
  flex: 0 0 auto;
}
.form__choiceGroup {
  display: flex;
  flex-direction: column;
  gap: var(--space-2);
}
.form__summary {
  border: 1px solid var(--color-brick);
  padding: var(--space-4);
  display: flex;
  flex-direction: column;
  gap: var(--space-2);
}
.form__summary ul {
  padding-left: var(--space-5);
  list-style: disc;
}
.form__summary a {
  color: var(--color-brick);
}
.form__fieldset {
  border: 0;
  padding: 0;
  margin: 0;
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: var(--space-5);
}
.form__legend {
  padding: 0;
  margin-bottom: var(--space-2);
}
.form__honeypot {
  position: absolute;
  left: -10000px;
  top: auto;
  width: 1px;
  height: 1px;
  overflow: hidden;
}
.form__row {
  display: grid;
  gap: var(--space-5);
}
@media (min-width: 640px) {
  .form__row2 {
    grid-template-columns: 1fr 1fr;
  }
}
.form__file {
  padding: var(--space-3) 0;
}
.form__fileList {
  display: flex;
  flex-direction: column;
  gap: var(--space-2);
  font-size: var(--type-body-s-size);
}

/* apps/web/components/ui/Skeleton.module.css */
.skeleton__block {
  background: var(--color-vellum);
  border-radius: 0;
}
.skeleton__line {
  height: var(--space-4);
}
.skeleton__stack {
  display: flex;
  flex-direction: column;
  gap: var(--space-3);
}

/* apps/web/components/ui/StatusMarker.module.css */
.status-marker__marker {
  display: inline-flex;
  align-items: center;
  gap: var(--space-2);
  font-size: var(--type-body-s-size);
  line-height: var(--type-body-s-line);
}
.status-marker__square {
  width: var(--size-status-marker);
  height: var(--size-status-marker);
  flex: 0 0 auto;
}
.status-marker__sage {
  background: var(--color-sage);
}
.status-marker__amber {
  background: var(--color-amber);
}
.status-marker__brick {
  background: var(--color-brick);
}
.status-marker__graphite {
  background: var(--color-graphite);
}

/* apps/web/components/ui/Stepper.module.css */
.stepper__stepper {
  display: flex;
  flex-direction: column;
  gap: var(--space-2);
  padding-bottom: var(--space-5);
  border-bottom: var(--border-hairline);
}
.stepper__text {
  font-size: var(--type-label-size);
  font-weight: var(--weight-medium);
  color: var(--color-graphite);
}
.stepper__bars {
  display: flex;
  gap: var(--space-1);
}
.stepper__bar {
  height: 2px;
  flex: 1;
  background: var(--color-linen);
}
.stepper__done {
  background: var(--color-ink);
}

/* apps/web/components/ui/Tag.module.css */
.tag__tag {
  display: inline-block;
  padding: var(--space-1) var(--space-2);
  border-radius: var(--radius-control);
  background: var(--color-vellum);
  color: var(--color-graphite);
  font-size: var(--type-body-s-size);
  line-height: var(--type-body-s-line);
  white-space: nowrap;
}
.tag__demo {
  background: var(--color-demo-fill);
  color: var(--color-demo-text);
}
.tag__row {
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-2);
}

/* apps/web/components/ui/Toast.module.css */
.toast__region {
  position: fixed;
  left: var(--space-4);
  bottom: var(--space-4);
  z-index: 60;
  display: flex;
  flex-direction: column;
  gap: var(--space-2);
  max-width: calc(100vw - 2 * var(--space-4));
}
.toast__toast {
  background: var(--color-ink);
  color: var(--color-paper);
  padding: var(--space-3) var(--space-4);
  display: flex;
  gap: var(--space-4);
  align-items: center;
  border: 1px solid var(--color-ink-soft);
}
.toast__error {
  border-color: var(--color-brass);
}
.toast__close {
  background: none;
  border: 0;
  color: inherit;
  cursor: pointer;
  min-width: var(--size-touch-min);
  min-height: var(--size-touch-min);
}
