/* ==========================================================
   RICH TEXT — shared by the app and the admin panel.
   Styles the small Markdown subset produced by js/richtext.js
   (paragraphs, bullet and numbered lists, bold, italic, code,
   links). Kept in its own file because both pages load it.
   ========================================================== */

.rich { overflow-wrap: break-word; }
.rich > :first-child { margin-top: 0; }
.rich > :last-child { margin-bottom: 0; }

.rich p { margin: 0 0 7px; }

.rich ul,
.rich ol { margin: 6px 0 8px; padding-left: 1.3em; }
.rich li { margin: 3px 0; }
.rich ul li::marker { color: var(--accent-c); }
.rich ol li::marker { color: var(--accent-c); font-weight: 700; }

.rich strong { font-weight: 800; color: var(--text); }
.rich em { font-style: italic; }

.rich code {
    padding: 1px 5px;
    border-radius: 5px;
    background: color-mix(in srgb, var(--text) 11%, transparent);
    font-family: ui-monospace, SFMono-Regular, Menlo, monospace;
    font-size: 0.92em;
}

.rich-link {
    color: var(--accent-c);
    font-weight: 600;
    text-decoration: underline;
    text-decoration-thickness: 1.5px;
    text-underline-offset: 2px;
    overflow-wrap: anywhere;
    transition: color 0.15s ease;
}
.rich-link:hover { color: var(--accent-a); }
.rich-link:focus-visible {
    outline: 2px solid var(--accent-a);
    outline-offset: 2px;
    border-radius: 3px;
}
