.outline-builder { margin-block: 1.6rem 2.8rem; padding: clamp(1rem, 3vw, 1.75rem); background: #f4f0e7; border: 1px solid #d8d0c1; border-radius: 1rem; color: #352438; }
.outline-builder fieldset { min-width: 0; margin: 1.15rem 0; padding: 1rem; border: 1px solid #cfc5c9; border-radius: .65rem; }
.outline-builder legend { padding-inline: .4rem; font-weight: 650; }
.outline-field { margin-block: .9rem; }
.outline-field label { display: block; margin-bottom: .35rem; font-size: .95rem; font-weight: 600; line-height: 1.5; }
.outline-builder .outline-help { margin: .1rem 0 .4rem; font-size: .86rem; line-height: 1.5; color: #655766; }
.outline-field textarea { display: block; box-sizing: border-box; width: 100%; max-width: 100%; min-height: 4.1rem; padding: .7rem; border: 1px solid #a99dab; border-radius: .45rem; background: #fffdf8; color: #352438; font: inherit; font-size: 1rem; line-height: 1.5; resize: vertical; }
.outline-builder details { margin-block: 1rem .4rem; }
.outline-builder summary { cursor: pointer; font-weight: 600; padding: .45rem 0; line-height: 1.5; }
.outline-actions, .outline-block-tools { display: flex; flex-wrap: wrap; align-items: center; gap: .55rem; margin-block: .7rem; }
.outline-builder button { box-sizing: border-box; min-height: 44px; padding: .6rem .85rem; border: 1px solid #81677d; border-radius: 999px; color: var(--ink); background: #fffcf7; font: inherit; font-size: .9rem; font-weight: 600; line-height: 1.4; cursor: pointer; transition: background-color .15s, border-color .15s; }
.outline-builder button:hover { background: #e7ddef; border-color: #53355e; }
.outline-builder button:disabled { opacity: .5; cursor: default; }
.outline-builder :is(button, textarea, summary, pre):focus-visible { outline: 3px solid #806396; outline-offset: 3px; }
.outline-builder [data-outline-download] { background: linear-gradient(135deg, #813ea0, #6b2d88); border-color: #71328f; color: #fffdf8; }
.outline-builder [data-outline-download]:hover { background: #4b1b63; border-color: #4b1b63; }
.outline-builder [hidden] { display: none !important; }
.outline-confirm { padding: 1rem; border: 1px solid #9a7846; border-radius: .6rem; background: #fff4df; }
.outline-confirm button { margin: .3rem .35rem .1rem 0; }
.outline-builder .outline-status { font-size: .9rem; min-height: 1.5em; }
.outline-preview { margin-top: 1.5rem; padding-top: .5rem; border-top: 1px solid #d3c7cd; }
.outline-preview pre { max-height: 34rem; overflow: auto; padding: 1rem; border: 1px solid #d2c8c9; border-radius: .5rem; background: #fffdf8; font: inherit; font-size: .88rem; line-height: 1.6; white-space: pre-wrap; overflow-wrap: anywhere; }
@media (max-width: 520px) { .outline-builder fieldset { padding: .75rem; } .outline-block-tools button { flex: 1 1 auto; } }
@media (prefers-reduced-motion: reduce) { .outline-builder button { transition: none; } }