/* Quill 2 inside the design system's .rte paper. Loaded after vendor/quill/quill.core.css.
   The container is .rte__area (Quill adds .ql-container); the writing surface is .ql-editor. */
.rte__area.ql-container { height: auto; font-family: var(--font-content); font-size: var(--fs-md); line-height: var(--lh-loose); }
.rte__area .ql-editor { padding: 0; min-height: 340px; overflow: visible; color: #241f1a; white-space: pre-wrap; }
.rte__area .ql-editor p + p, .rte__area .ql-editor p + h3, .rte__area .ql-editor h3 + p,
.rte__area .ql-editor p + blockquote, .rte__area .ql-editor blockquote + p,
.rte__area .ql-editor p + ol, .rte__area .ql-editor ol + p, .rte__area .ql-editor p + ul, .rte__area .ql-editor ul + p { margin-top: var(--sp-4); }
.rte__area .ql-editor h3 { font-family: var(--font-content); font-weight: var(--fw-semibold, 600); font-size: 1.15em; line-height: 1.3; }
.rte__area .ql-editor blockquote { margin: 0; padding-left: var(--sp-4); border-left: 3px solid var(--amber-500); color: #4a443d; font-style: italic; }
.rte__area .ql-editor a { color: var(--amber-700); text-decoration: underline; }
.rte__area .ql-editor img { max-width: 100%; height: auto; display: block; margin: var(--sp-3) 0; }
.rte__area .ql-editor.ql-blank::before { color: #8a847c; font-style: italic; left: 0; right: 0; }
.rte__area .ql-editor ol, .rte__area .ql-editor ul { padding-left: 1.5em; }
.rte__area .ql-editor li { padding-left: 0.25em; }
.rte__area .ql-editor li > .ql-ui { left: -1.5em; }

/* ---- Lead image: focal point picker (js/media.js) -------------------------- */
.dropzone.is-compact { min-height: 0; padding: var(--sp-2) var(--sp-3); flex-direction: row; gap: var(--sp-2); font-size: var(--fs-xs); }
.dropzone.is-compact .dropzone__prompt { flex-direction: row; gap: var(--sp-2); align-items: center; }
.dropzone.is-compact .dropzone__prompt .icon--lg { width: 18px; height: 18px; }
.dropzone.is-compact .dropzone__prompt .field__hint { display: none; }
.focal { display: flex; flex-direction: column; gap: var(--sp-2); margin-top: var(--sp-3); }
.focal__stage { position: relative; width: 100%; aspect-ratio: 3 / 2; background: var(--surface-sunken); border-radius: var(--r-md); overflow: hidden; cursor: crosshair; }
.focal__stage img { width: 100%; height: 100%; object-fit: contain; display: block; }
.focal__dot { position: absolute; width: 18px; height: 18px; margin: -9px 0 0 -9px; border-radius: 50%; border: 2px solid #fff; background: var(--amber-500);
  box-shadow: 0 0 0 2px rgba(0,0,0,.45), 0 0 0 6px rgba(255,255,255,.15); pointer-events: none; }
.focal__previews { display: grid; grid-template-columns: 1fr 1fr 1fr; gap: var(--sp-2); }
.focal__preview { margin: 0; width: 100%; overflow: hidden; border-radius: var(--r-sm); background: var(--surface-sunken); position: relative; }
.focal__preview img { width: 100%; height: 100%; object-fit: cover; display: block; }
.focal__preview figcaption { position: absolute; left: 0; right: 0; bottom: 0; padding: 2px 6px; font-size: 10px; letter-spacing: .04em; text-transform: uppercase; color: #fff; background: rgba(0,0,0,.45); }
.focal__status { font-size: var(--fs-xs); color: var(--text-3); min-height: 1.2em; }
.focal__status[data-tone="ok"] { color: var(--success-fg); }
.focal__status[data-tone="busy"] { color: var(--amber-300); }
.focal__status[data-tone="error"] { color: var(--danger-fg); }
.focal__status[data-tone="info"] { color: var(--text-2); }