@font-face {
  font-family: "LD Inter";
  src: url("/public/fonts/sans/400.woff2") format("woff2");
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "LD Inter";
  src: url("/public/fonts/sans/700.woff2") format("woff2");
  font-weight: 700;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "LD Space Grotesk";
  src: url("/public/fonts/grotesk/400.woff2") format("woff2");
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "LD Space Grotesk";
  src: url("/public/fonts/grotesk/700.woff2") format("woff2");
  font-weight: 700;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "LD Source Serif";
  src: url("/public/fonts/serif/400.woff2") format("woff2");
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "LD Source Serif";
  src: url("/public/fonts/serif/700.woff2") format("woff2");
  font-weight: 700;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "LD Barlow";
  src: url("/public/fonts/condensed/400.woff2") format("woff2");
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "LD Barlow";
  src: url("/public/fonts/condensed/700.woff2") format("woff2");
  font-weight: 700;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "LD Nunito";
  src: url("/public/fonts/rounded/400.woff2") format("woff2");
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "LD Nunito";
  src: url("/public/fonts/rounded/700.woff2") format("woff2");
  font-weight: 700;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "LD Plex Mono";
  src: url("/public/fonts/mono/400.woff2") format("woff2");
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "LD Plex Mono";
  src: url("/public/fonts/mono/700.woff2") format("woff2");
  font-weight: 700;
  font-style: normal;
  font-display: swap;
}
/* Families supply values; every output uses the same components. Legacy scenes
   have no data-family and do not match these rules. */
[data-family="esencial"] {
  --ld-radius: max(0px, calc(2px + var(--ld-radius-step, 0) * 2px));
  --ld-bar-size: 14px;
  --ld-high-bar-size: 21px;
  --ld-gap: 18px;
  --ld-duration: 180ms;
  --ld-entry: ld-fade;
  --ld-title-weight: 700;
}
[data-family="broadcast"] {
  --ld-radius: max(0px, calc(var(--ld-radius-step, 0) * 2px));
  --ld-bar-size: 16px;
  --ld-high-bar-size: 24px;
  --ld-gap: 12px;
  --ld-duration: 300ms;
  --ld-entry: ld-sweep;
  --ld-title-weight: 700;
}
[data-family="editorial"] {
  --ld-radius: max(0px, calc(4px + var(--ld-radius-step, 0) * 2px));
  --ld-bar-size: 8px;
  --ld-high-bar-size: 12px;
  --ld-gap: 24px;
  --ld-duration: 500ms;
  --ld-entry: ld-fade;
  --ld-title-weight: 400;
}
[data-font="sans"] {
  --ld-font: "LD Inter", sans-serif;
}
[data-font="grotesk"] {
  --ld-font: "LD Space Grotesk", sans-serif;
}
[data-font="serif"] {
  --ld-font: "LD Source Serif", serif;
}
[data-font="condensed"] {
  --ld-font: "LD Barlow", sans-serif;
}
[data-font="rounded"] {
  --ld-font: "LD Nunito", sans-serif;
}
[data-font="mono"] {
  --ld-font: "LD Plex Mono", monospace;
}
[data-family] {
  font-family: var(--ld-font);
  color: var(--ld-text) !important;
  --experience-ink: var(--ld-text);
  --experience-accent: var(--ld-accent);
}
[data-family] :is(h1, h2, h3, p, small, label, strong, span, li) {
  color: inherit !important;
  font-family: inherit;
}
[data-family] :is(h1, h2, h3) {
  font-weight: var(--ld-title-weight);
}
.projection-content[data-family]:not([data-brand-overlay]) {
  background: var(--ld-surface);
}
html:has(.projection-content[data-family]):not(:has(.overlay-output)),
body.projection:not(.overlay-output):has(.projection-content[data-family]),
.projection:not(.overlay-output):has(.projection-content[data-family]) #app {
  background: var(--ld-surface, #f4f3ec);
}
/* The viewport owns the surface, while transparent formats paint only a card. */
.projection .presentation-scene[data-family] {
  background: transparent !important;
}
[data-family]
  :is(
    .presentation-card,
    .participant-card,
    .participant-receipt,
    .participant-score,
    .trivia-ranking-row,
    .broadcast-card
  ) {
  color: var(--ld-text) !important;
  background: var(--ld-surface) !important;
  border-radius: var(--ld-radius) !important;
  box-shadow: none;
}
[data-family]
  :is(
    .presentation-options > div,
    .participant-choice,
    .kind-rating-choices button
  ) {
  border: 1px solid var(--ld-primary) !important;
  border-radius: var(--ld-radius) !important;
  background: var(--ld-background) !important;
  color: var(--ld-text) !important;
}
[data-family] .participant-choice.is-selected,
[data-family] .kind-rating-choices button[aria-pressed="true"] {
  outline: 3px solid var(--ld-accent);
  outline-offset: 2px;
}
[data-family] :is(button, input, textarea, select) {
  font: inherit;
  border-radius: var(--ld-radius);
}
[data-family] :is(.participant-primary, .button) {
  color: var(--ld-background) !important;
  background: var(--ld-text) !important;
}
[data-family] :is(input, textarea, select) {
  color: var(--ld-text) !important;
  background: var(--ld-background) !important;
}
[data-family] .presentation-bar {
  background: var(--ld-background);
  border: 1px solid var(--ld-primary);
  height: var(--ld-bar-size);
  border-radius: var(--ld-radius);
  box-sizing: border-box;
}
[data-family] .presentation-bar-fill {
  background: var(--ld-accent);
  border-radius: var(--ld-radius);
  height: 100%;
  transition: none;
}
[data-family] .trivia-countdown progress {
  accent-color: var(--ld-accent);
}
[data-family] :is(.presentation-card, .participant-card, .design-lower-band) {
  animation: var(--ld-entry) var(--ld-duration) ease-out;
}
.design-results {
  display: grid;
  gap: var(--ld-gap);
  min-width: 0;
}
.design-results .presentation-result {
  margin: 0 !important;
  min-width: 0;
  grid-template-columns: minmax(0, 1fr) auto auto;
}
.design-results .design-label {
  display: -webkit-box;
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;
  overflow: hidden;
  overflow-wrap: break-word;
}
.design-results .design-count {
  font-size: 0.75em;
  align-self: center;
}
.design-results .presentation-total {
  grid-column: 1 / -1;
}
.design-results .presentation-bar-fill {
  height: 100% !important;
}
.design-results[data-chart="columns"] {
  grid-template-columns: repeat(var(--ld-options), minmax(0, 1fr));
  align-items: end;
}
.design-results[data-chart="columns"] .presentation-result {
  display: flex;
  flex-direction: column;
  align-items: stretch;
  gap: 8px;
}
.design-results[data-chart="columns"] .presentation-bar {
  order: -1;
  height: 22vh;
  position: relative;
}
.design-results[data-chart="columns"] .presentation-bar-fill {
  width: 100% !important;
  height: auto !important;
  position: absolute;
  bottom: 0;
}
/* Height is a percentage of the same zero-based scale as the horizontal width. */
.design-results[data-chart="columns"] .presentation-bar-fill {
  height: var(--ld-share) !important;
}
.design-empty {
  grid-column: 1 / -1;
}
[data-family] .design-words-list {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  justify-content: stretch;
  gap: var(--ld-gap);
  padding: 0;
}
[data-family] .design-words-list .words-word {
  display: flex;
  justify-content: space-between;
  gap: 1em;
  font-size: clamp(24px, 2vw, 38px);
  border-bottom: 1px solid var(--ld-primary);
  padding: 0.2em 0;
}
[data-family] .words-cloud {
  max-height: 58vh;
  overflow: hidden;
  gap: 0.6em;
}
[data-family] .words-word {
  color: var(--ld-primary);
  animation: none;
}
[data-family] .words-size-1 {
  font-size: clamp(24px, 1.6vw, 32px);
}
[data-family] .words-size-2 {
  font-size: clamp(28px, 2vw, 40px);
}
[data-family] .words-size-3 {
  font-size: clamp(32px, 2.5vw, 48px);
}
[data-family] .words-size-4 {
  font-size: clamp(36px, 3vw, 58px);
}
[data-family] .words-size-5 {
  font-size: clamp(40px, 3.6vw, 70px);
}
[data-show-percent="false"] .design-percent,
[data-show-count="false"]
  :is(.design-count, .trivia-ranking-total, .trivia-ranking-correct),
[data-show-labels="false"] :is(.design-label, .trivia-ranking-alias),
[data-show-positions="false"] .trivia-ranking-rank {
  display: none !important;
}
/* Output text stays at least 24px at 1080p, including long six-option scenes. */
.projection
  [data-family]
  :is(
    .presentation-brand,
    .presentation-state,
    .presentation-total,
    .trivia-ranking-total,
    .trivia-ranking-correct,
    .experience-brand-name
  ) {
  font-size: clamp(16px, 2.23vh, 24px);
}
.projection [data-family] .presentation-card {
  display: block !important;
}
.projection [data-family] .presentation-card h2 {
  font-size: clamp(28px, 4.5vh, 64px);
  line-height: 1.12;
  margin: 0 0 2vh;
}
.projection [data-family] .presentation-result,
.projection [data-family] .presentation-options > div {
  font-size: clamp(18px, 2.23vh, 32px) !important;
  line-height: 1.2;
}
.projection [data-family] .presentation-options {
  gap: var(--ld-gap);
}
.projection [data-family] .presentation-options > div {
  min-width: 0;
  padding: 0.65em;
}
.projection [data-family] .presentation-options > div > span:last-child {
  display: -webkit-box;
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
.projection [data-family] .presentation-result .design-count {
  font-size: inherit;
}
.projection [data-family] .trivia-ranking-row {
  padding: 0.4em 0.7em;
  gap: 0.4em 1em;
  border: 1px solid var(--ld-primary);
}
.projection [data-family] :is(.trivia-ranking-alias, .trivia-ranking-points) {
  font-size: clamp(18px, 2.6vh, 32px);
}
.projection [data-family] .trivia-ranking-alias {
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.participant-stage[data-family] {
  background: var(--ld-surface);
  padding: 24px 16px;
  font-size: 16px;
}
body.participant-view:has([data-family]),
body.participant-view:has([data-family]) #app {
  background: var(--ld-background);
}
.participant-stage[data-family]
  :is(
    p,
    small,
    label,
    button,
    input,
    textarea,
    select,
    .participant-tag,
    .participant-state,
    .participant-kicker,
    .participant-card-top,
    .participant-help,
    .participant-choice-number
  ) {
  font-size: max(16px, 1em) !important;
}
.participant-stage[data-family]
  :is(button, input:not([type="checkbox"]), textarea, select) {
  min-height: 44px;
  min-width: 44px;
}
.participant-stage[data-family] .participant-card-top {
  flex-wrap: wrap;
}
.participant-stage[data-family] .participant-choices {
  gap: 12px;
}
.participant-stage[data-family] .design-results[data-chart] {
  display: grid;
  grid-template-columns: 1fr;
}
.participant-stage[data-family] .design-results .presentation-result {
  display: grid;
  font-size: 16px;
}
.participant-stage[data-family] .design-results .presentation-bar {
  height: var(--ld-bar-size);
  order: initial;
}
.participant-stage[data-family] .design-results .presentation-bar-fill {
  position: static;
  width: var(--ld-share) !important;
  height: 100% !important;
}
.participant-stage[data-family] .words-cloud {
  max-height: none;
}
.participant-stage[data-family] .design-words-list {
  grid-template-columns: 1fr;
}
.participant-stage[data-family] .words-word {
  font-size: 20px;
}
/* Lower paints exactly one bounded band; the surrounding viewport remains alpha 0. */
.lower-output .projection-content {
  padding: 0 !important;
  min-height: 100vh;
  display: block !important;
}
.lower-output .presentation-scene {
  width: 100% !important;
  background: transparent !important;
}
.design-lower-band {
  position: fixed;
  left: 5vw;
  width: 60vw;
  bottom: 5vh;
  box-sizing: border-box;
  max-height: 20vh;
  padding: 1.6vh 2vw;
  overflow: hidden;
  color: var(--ld-text, #f8f7ef);
  background: var(--ld-surface, #24232d);
  border-left: 6px solid var(--ld-accent, #dcff82);
  border-radius: var(--ld-radius, 0);
  font-size: clamp(18px, 2.6vh, 32px);
}
.design-lower-band h2 {
  font-size: clamp(24px, 3.5vh, 44px) !important;
  line-height: 1.1;
  margin: 0 0 1vh !important;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
.design-lower-items {
  display: flex;
  gap: 1.5vw;
  align-items: center;
}
.design-lower-items > span {
  flex: 1;
  min-width: 0;
  display: flex;
  gap: 0.5em;
  align-items: baseline;
}
.design-lower-items .design-label {
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
.design-lower-items .trivia-countdown {
  margin: 0;
  display: flex;
  gap: 1em;
}
.design-lower-items .trivia-countdown progress {
  display: none;
}
.design-lower-band .broadcast-card {
  padding: 0;
  border: 0;
  background: transparent;
}
.design-rehearsal {
  position: fixed;
  top: 1vh;
  right: 1vw;
  font: 700 16px sans-serif !important;
  color: var(--ld-text, #fff) !important;
  background: var(--ld-background, #24232d);
  padding: 3px 6px;
  z-index: 10;
}
@keyframes ld-fade {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}
@keyframes ld-sweep {
  from {
    clip-path: inset(0 100% 0 0);
  }
  to {
    clip-path: inset(0);
  }
}
[data-motion="reduced"] {
  --ld-entry: ld-fade;
  --ld-duration: 180ms;
}
[data-motion="none"] *,
[data-motion="none"] {
  animation: none !important;
  transition: none !important;
}
[data-motion="reduced"] * {
  animation: none !important;
  transition: none !important;
}
[data-motion="reduced"]
  :is(.presentation-card, .participant-card, .design-lower-band) {
  animation: ld-fade 180ms ease-out !important;
}
@media (prefers-reduced-motion: reduce) {
  [data-family] {
    --ld-entry: ld-fade;
    --ld-duration: 180ms;
  }
  [data-family] * {
    animation: none !important;
    transition: none !important;
  }
  [data-family] :is(.presentation-card, .participant-card, .design-lower-band) {
    animation: ld-fade 180ms ease-out !important;
  }
}
@media (orientation: portrait) {
  .design-results[data-chart="columns"][data-options="5"],
  .design-results[data-chart="columns"][data-options="6"] {
    grid-template-columns: 1fr;
  }
  .design-results[data-chart="columns"][data-options="5"] .presentation-result,
  .design-results[data-chart="columns"][data-options="6"] .presentation-result {
    display: grid;
  }
  .design-results[data-chart="columns"][data-options="5"] .presentation-bar,
  .design-results[data-chart="columns"][data-options="6"] .presentation-bar {
    height: var(--ld-bar-size);
    order: initial;
  }
  .design-results[data-chart="columns"][data-options="5"]
    .presentation-bar-fill,
  .design-results[data-chart="columns"][data-options="6"]
    .presentation-bar-fill {
    position: static;
    width: var(--ld-share) !important;
    height: 100% !important;
  }
  [data-family] .design-words-list {
    grid-template-columns: 1fr;
  }
  .projection [data-family] .presentation-options:has(> :nth-child(5)) {
    grid-template-columns: 1fr;
  }
  .projection [data-family] .words-cloud {
    max-height: 60vh;
  }
}
/* High contrast uses the same geometry, with strong text and opaque fills. */
[data-contrast="high"] {
  --ld-title-weight: 700;
  --ld-bar-size: var(--ld-high-bar-size);
}
[data-contrast="high"] * {
  font-weight: 600 !important;
  opacity: 1 !important;
  text-shadow: none !important;
  box-shadow: none !important;
}
[data-contrast="high"] .presentation-bar {
  border: 2px solid var(--ld-text);
}
[data-contrast="high"] [data-winner="false"] .presentation-bar-fill {
  background: var(--ld-background);
  border: 2px solid var(--ld-text);
  box-sizing: border-box;
}
.projection
  [data-contrast="high"]
  :is(
    p,
    span,
    strong,
    small,
    .presentation-result,
    .presentation-options > div,
    .presentation-brand,
    .experience-brand-name,
    h1,
    h2,
    h3
  ) {
  font-size: max(28px, 2.6vh) !important;
}
[data-contrast="high"]
  :is(.presentation-card, .participant-card, .design-lower-band) {
  animation: none;
}

[data-family] .presentation-brand {
  color: var(--ld-text) !important;
}

[data-motion="none"][data-motion="none"] * {
  animation: none !important;
  transition: none !important;
}

.projection [data-family] .design-average {
  font-size: clamp(24px, 3vh, 40px);
  margin: 1vh 0 2vh;
}

.projection [data-family] p {
  font-size: clamp(16px, 2.23vh, 28px);
}

/* Override legacy projection word scales only inside the opt-in design. */
.projection .presentation-scene[data-family] .words-size-1 {
  font-size: clamp(24px, 1.6vw, 32px);
}
.projection .presentation-scene[data-family] .words-size-2 {
  font-size: clamp(28px, 2vw, 40px);
}
.projection .presentation-scene[data-family] .words-size-3 {
  font-size: clamp(32px, 2.5vw, 48px);
}
.projection .presentation-scene[data-family] .words-size-4 {
  font-size: clamp(36px, 3vw, 58px);
}
.projection .presentation-scene[data-family] .words-size-5 {
  font-size: clamp(40px, 3.6vw, 70px);
}
[data-family] .words-cloud[data-density="dense"] {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 6px;
}
.projection
  .presentation-scene[data-family]
  .words-cloud[data-density="dense"]
  .words-word {
  font-size: clamp(18px, 2.23vh, 28px);
  min-width: 0;
}
[data-family] .design-words-list[data-density="dense"] {
  grid-template-columns: repeat(4, minmax(0, 1fr));
}
.participant-stage[data-family] :is(span, strong) {
  font-size: max(16px, 1em);
}
.participant-stage[data-family] .design-count {
  font-size: 16px;
}
.participant-stage[data-family] .words-cloud[data-density="dense"] {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}
.participant-stage[data-family] .design-words-list {
  grid-template-columns: 1fr;
}
body.participant-view:has([data-family]) .device-tools :is(button, p, summary) {
  font-size: 16px;
  min-height: 44px;
}
@media (orientation: portrait) {
  [data-family] .words-cloud[data-density="dense"] {
    grid-template-columns: repeat(4, minmax(0, 1fr));
  }
  [data-family] .design-words-list[data-density="dense"] {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .participant-stage[data-family] .words-cloud[data-density="dense"] {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .participant-stage[data-family] .design-words-list[data-density="dense"] {
    grid-template-columns: 1fr;
  }
}

.participant-stage[data-family] .kind-rating-choices {
  grid-template-columns: repeat(auto-fit, minmax(44px, 1fr));
}
@media (min-aspect-ratio: 1/1) {
  .projection
    [data-family]
    .design-results[data-chart="bars"][data-options="6"] {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}
.projection [data-contrast="high"] h2 {
  font-size: clamp(28px, 4.5vh, 64px) !important;
}

.design-lower-band h2 {
  display: block;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.design-lower-items {
  flex-wrap: nowrap;
}
.design-lower-items .design-label {
  display: block;
  min-width: 0;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.design-lower-items :is(strong, p) {
  white-space: nowrap;
  flex-shrink: 0;
}
.design-lower-items > .design-more {
  flex: 0 0 auto;
  white-space: nowrap;
}
.design-lower-band .broadcast-card-kind {
  display: none;
}
.design-lower-band .broadcast-card p {
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  margin: 0;
}
.projection:not(.overlay-output) .projection-content[data-qr="hidden"] {
  grid-template-columns: minmax(0, 1fr);
}

.participant-stage[data-family]
  :is(.participant-kicker, .experience-brand-name) {
  color: var(--ld-text) !important;
  font-size: 16px;
}
.participant-stage[data-family]
  :is(
    .participant-tag,
    .participant-waiting,
    .participant-feedback,
    .participant-progress,
    .participant-status-icon,
    .participant-receipt > span
  ) {
  background: var(--ld-background) !important;
  color: var(--ld-text) !important;
}
.participant-stage[data-family] :is(input, textarea, select) {
  border-color: var(--ld-primary);
}
.participant-stage[data-family] :focus-visible {
  outline-color: var(--ld-accent);
}
.participant-stage[data-family] progress {
  accent-color: var(--ld-accent);
}
[data-family] .device-tools {
  color: var(--ld-text) !important;
  background: var(--ld-surface);
  border-color: var(--ld-primary);
}
body.participant-view[data-family] :is(footer, .environment, .mode-note) {
  font-size: 16px;
}
body.participant-view[data-family] :is(footer, .mode-note) {
  color: var(--ld-text);
  background: var(--ld-surface);
}
body.participant-view[data-family] .topbar {
  flex-wrap: wrap;
  gap: 12px;
}
body.participant-view[data-family] .brand span {
  font-size: 16px;
  letter-spacing: 0.08em;
}

/* Room projection keeps the 038 scale (question ~80px, options ~46px at 1080p).
   Overlay and the lower band keep their own sizes; 5–6 options step down before overflowing. */
.projection:not(.overlay-output) [data-family] .presentation-card h2 {
  font-size: clamp(32px, min(4.6vw, 7vh), 88px);
}
.projection:not(.overlay-output)
  [data-family]
  :is(.presentation-result, .presentation-options > div) {
  font-size: clamp(24px, min(2.4vw, 3.8vh), 48px) !important;
}
.projection:not(.overlay-output)
  [data-family]
  :is(
    .design-results:is([data-options="5"], [data-options="6"])
      .presentation-result,
    .presentation-options:has(> :nth-child(5)) > div
  ) {
  font-size: clamp(16px, min(1.8vw, 3.2vh), 36px) !important;
}
.projection:not(.overlay-output)
  [data-family]
  :is(.trivia-ranking-alias, .trivia-ranking-points) {
  font-size: clamp(24px, 3.6vh, 44px);
}
.projection:not(.overlay-output) [data-family] .design-average {
  font-size: clamp(32px, 6vh, 72px);
}
.projection:not(.overlay-output)
  [data-family]
  :is(
    .presentation-brand,
    .presentation-state,
    .presentation-total,
    .experience-brand-name
  ) {
  font-size: clamp(18px, 2.6vh, 32px);
}
.projection:not(.overlay-output)
  [data-contrast="high"]
  :is(.presentation-result, .presentation-options > div) {
  font-size: max(28px, min(2.4vw, 3.8vh)) !important;
}
.projection:not(.overlay-output) [data-family] .presentation-options > div {
  padding: 0.45em 0.65em;
}
/* Titles: the legacy tight tracking crowds condensed and serif faces. */
[data-family] :is(h1, h2, h3) {
  letter-spacing: -0.01em;
}
:is([data-font="condensed"], [data-font="mono"]) :is(h1, h2, h3) {
  letter-spacing: 0;
}
