/* Scoped styles for the local draft dialog. Theme tokens come from the host page. */
.oni-dialog { margin: auto; width: min(640px, calc(100% - 24px)); max-height: calc(100dvh - 24px); overflow-y: auto; padding: 32px; border: 1px solid var(--border-accent); border-radius: 2px; background: var(--bg-alt); color: var(--text-primary); font: 16px/1.6 var(--font-ui); }
.oni-dialog::backdrop { background: rgb(8 6 4 / 80%); }
.oni-head { display: flex; gap: 16px; justify-content: space-between; align-items: flex-start; }
.oni-head h2 { font-size: 28px; }
.oni-close { flex: 0 0 44px; min-height: 44px; font-size: 28px; border: 1px solid var(--border); border-radius: 2px; background: var(--bg); color: var(--text-primary); }
.oni-dialog p { margin-block: 16px; font-size: 14px; color: var(--text-muted); }
.oni-dialog .oni-kind { color: var(--accent); }
.oni-fields { display: grid; gap: 8px; margin-block: 16px; }
.oni-fields label, .oni-preview label { font-size: 14px; }
.oni-fields input, .oni-fields textarea, #oni-draft { width: 100%; min-width: 0; padding: 8px; border: 1px solid var(--border-accent); border-radius: 2px; background: var(--bg); color: var(--text-primary); font: 16px/1.5 var(--font-ui); }
.oni-fields textarea, #oni-draft { resize: vertical; }
.oni-button { display: inline-flex; align-items: center; justify-content: center; min-height: 44px; padding: 8px 16px; border: 1px solid var(--accent); border-radius: 2px; background: var(--accent); color: var(--bg); font-weight: 600; text-decoration: none; }
.oni-button:hover { background: var(--accent-hover); color: var(--bg); }
.oni-actions { display: flex; flex-wrap: wrap; gap: 16px; margin-top: 16px; }
.oni-preview { border-top: 1px solid var(--border); padding-top: 16px; }
.oni-preview h3 { margin-bottom: 16px; font-size: 20px; }
.oni-status { min-height: 1.6em; }
@media (max-width: 700px) { .oni-dialog { padding: 16px; } }