@layer base {
  .prose-rendered {
    font-family: 'Inter', ui-sans-serif, system-ui, sans-serif;
    color: #374151;
    overflow-wrap: break-word;
    word-wrap: break-word;
  }

  /* Headings — Rubik */
  .prose-rendered h1,
  .prose-rendered h2,
  .prose-rendered h3,
  .prose-rendered h4 {
    font-family: 'Rubik', ui-sans-serif, system-ui, sans-serif;
    color: #111827;
  }
  .prose-rendered h1 { font-size: 1.875rem; font-weight: 400; margin: 2em 0 0.6em; }
  .prose-rendered h2 { font-size: 1.5rem; font-weight: 400; margin: 1.75em 0 0.5em; }
  .prose-rendered h3 { font-size: 1.25rem; font-weight: 400; margin: 1.5em 0 0.4em; }
  .prose-rendered h4 { font-size: 1.125rem; font-weight: 400; margin: 1.25em 0 0.4em; }

  /* Paragraphs */
  .prose-rendered p { margin-bottom: 1.25em; }

  /* Links */
  .prose-rendered a { color: #ea580c; text-decoration: underline; text-underline-offset: 2px; }
  .prose-rendered a:hover { color: #c2410c; }

  /* Bold / italic */
  .prose-rendered strong { font-weight: 400; color: #111827; }
  .prose-rendered em { font-style: italic; }

  /* Lists */
  .prose-rendered ul, .prose-rendered ol { padding-left: 1.5em; margin-bottom: 1.25em; }
  .prose-rendered ul { list-style-type: disc; }
  .prose-rendered ol { list-style-type: decimal; }
  .prose-rendered li { margin-bottom: 0.35em; line-height: 1.75; }
  .prose-rendered li > ul, .prose-rendered li > ol { margin-top: 0.35em; margin-bottom: 0; }

  /* Blockquotes */
  .prose-rendered blockquote {
    border-left: 3px solid #ea580c40;
    padding-left: 1em;
    color: #6b7280;
    font-style: italic;
    margin: 1.25em 0;
  }
  .prose-rendered blockquote p { margin-bottom: 0.5em; }

  /* Inline code */
  .prose-rendered code {
    background: #fff7ed;
    color: #ea580c;
    padding: 0.15em 0.4em;
    border-radius: 0.25rem;
    font-size: 0.875em;
    font-family: 'JetBrains Mono', 'Fira Code', ui-monospace, monospace;
  }

  /* Code blocks — solarized-light */
  .prose-rendered pre {
    background: #fdf6e3;
    color: #657b83;
    border-radius: 0.5rem;
    overflow-x: auto;
    margin: 1.5em 0;
    padding: 1.25em;
    font-size: 0.75rem;
    line-height: 1.7;
    font-family: 'JetBrains Mono', 'Fira Code', ui-monospace, monospace;
  }
  .prose-rendered pre code {
    display: block;
    padding: 0;
    background: none;
    color: inherit;
    font-size: inherit;
    line-height: inherit;
    border-radius: 0;
  }

  /* Tables */
  .prose-rendered table {
    width: 100%;
    border-collapse: collapse;
    margin: 1.5em 0;
    font-size: 0.9375rem;
  }
  .prose-rendered thead th {
    background: #f9fafb;
    font-weight: 400;
    color: #111827;
    text-align: left;
    padding: 0.625em 1em;
    border-bottom: 2px solid #e5e7eb;
  }
  .prose-rendered tbody td {
    padding: 0.625em 1em;
    border-bottom: 1px solid #e5e7eb;
    color: #374151;
  }
  .prose-rendered tbody tr:last-child td { border-bottom: none; }
  .prose-rendered tbody tr:hover { background: #fafafa; }

  /* Horizontal rule */
  .prose-rendered hr {
    border: none;
    border-top: 1px solid #e5e7eb;
    margin: 2em 0;
  }

  /* Images */
  .prose-rendered img {
    border-radius: 0.5rem;
    margin: 1.5em 0;
    max-width: 100%;
  }
}

/* Outside @layer so it beats the unlayered highlight.js theme */
.prose-rendered pre code.hljs {
  background: transparent;
}