@import url("/assets/lexxy-content-0ff2f961.css");
@import url("/assets/lexxy-editor-5b842411.css");

/* Align Lexxy theme with Playpass color tokens (light + dark). */
lexxy-editor,
.lexxy-content {
  --lexxy-color-canvas: var(--bg-bright);
  --lexxy-color-text: var(--text-bright);
  --lexxy-color-text-subtle: var(--text-color);
  --lexxy-color-ink: var(--text-bright);
  --lexxy-color-ink-medium: var(--text-color);
  --lexxy-color-ink-light: var(--text-muted);
  --lexxy-color-ink-lighter: var(--border-grayer);
  --lexxy-color-ink-lightest: var(--bg-gray);
  --lexxy-color-ink-inverted: var(--text-on-color-primary);

  --lexxy-color-link: var(--color-primary);
  --lexxy-color-accent-dark: var(--color-primary-dark);
  --lexxy-color-accent-medium: var(--color-primary);
  --lexxy-color-accent-light: var(--color-primary-faint);
  --lexxy-color-accent-lightest: var(--color-primary-faint);

  --lexxy-color-selected: var(--color-primary-faint);
  --lexxy-color-selected-hover: var(--color-primary-faint);
  --lexxy-color-selected-dark: var(--color-primary);

  --lexxy-color-code-bg: var(--bg-grayer);
  --lexxy-color-table-header-bg: var(--bg-gray);
  --lexxy-color-table-cell-border: var(--border-gray);
  --lexxy-color-table-cell-selected: var(--color-primary-faint);
  --lexxy-color-table-cell-selected-border: var(--color-primary);
  --lexxy-color-table-cell-selected-bg: var(--color-primary-faint);

  --lexxy-focus-ring-color: var(--color-primary);
  --lexxy-shadow: 0 2px 8px var(--shadow-color-a);
}

/* Lexxy stores highlight colors as inline CSS variables. The renderer converts
 * those trusted values to classes so arbitrary inline styles remain blocked. */
.lexxy-content__highlight-1 {
  background-color: var(--highlight-bg-1);
}
.lexxy-content__highlight-2 {
  background-color: var(--highlight-bg-2);
}
.lexxy-content__highlight-3 {
  background-color: var(--highlight-bg-3);
}
.lexxy-content__highlight-4 {
  background-color: var(--highlight-bg-4);
}
.lexxy-content__highlight-5 {
  background-color: var(--highlight-bg-5);
}
.lexxy-content__highlight-6 {
  background-color: var(--highlight-bg-6);
}
.lexxy-content__highlight-7 {
  background-color: var(--highlight-bg-7);
}
.lexxy-content__highlight-8 {
  background-color: var(--highlight-bg-8);
}
.lexxy-content__highlight-9 {
  background-color: var(--highlight-bg-9);
}