/* ===========================
   Markdown typography — one scale for every rendered document

   Everything the app renders from markdown is the same thing: a piece of a
   62366 usability engineering file that ends up in a Word submission. So it is
   set like that document rather than like a web page — hierarchy comes from
   weight, colour and a rule instead of size jumps, the way numbered clauses
   read in the real file.

   This replaced per-page copies that had drifted apart: the step pages each
   declared their own `.markdown-preview` block with an h1 at 1.8rem, which
   dwarfed the prose under it, while the AI suggestion card styled only h2/h3
   and let h1 fall through to the browser's 2em page-title default.

   Surfaces covered:
     .markdown-preview        generated-document preview on the step pages
     #doc-preview-content     the same pane addressed by id
     .preview-document        the preview modal on documents.html
     .formatted-view          the WYSIWYG editing surface
     .ai-suggestion-card__body  the AI 제안 card

   Rules are prefixed with `body ` so this sheet stays authoritative over the
   per-page blocks and over the stylesheet documents.html builds at runtime,
   both of which would otherwise win on load order at equal specificity.
   =========================== */

body .markdown-preview,
body #doc-preview-content,
body #doc-preview-content-page1,
body .preview-document,
body .formatted-view,
body .ai-suggestion-card__body {
    /* Korean faces lead, matching the Word preview, so a document never
       promises on screen a typeface the generated file will not have.
       Hangul also needs more leading than Latin, hence 1.85. */
    font-family: 'Pretendard', 'Malgun Gothic', '맑은 고딕', 'Apple SD Gothic Neo',
                 'Noto Sans KR', 'Inter', -apple-system, BlinkMacSystemFont, sans-serif;
    font-size: 0.94rem;
    line-height: 1.85;
    color: #374151;
    word-break: break-word;
    text-align: left;
}

/* ── Headings ──────────────────────────────────────────────────────────── */

body .markdown-preview h1,
body .markdown-preview h2,
body .markdown-preview h3,
body .markdown-preview h4,
body .markdown-preview h5,
body .markdown-preview h6,
body #doc-preview-content h1,
body #doc-preview-content h2,
body #doc-preview-content h3,
body #doc-preview-content h4,
body #doc-preview-content h5,
body #doc-preview-content h6,
body .preview-document h1,
body .preview-document h2,
body .preview-document h3,
body .preview-document h4,
body .preview-document h5,
body .preview-document h6,
body .formatted-view h1,
body .formatted-view h2,
body .formatted-view h3,
body .formatted-view h4,
body .formatted-view h5,
body .formatted-view h6,
body .ai-suggestion-card__body h1,
body .ai-suggestion-card__body h2,
body .ai-suggestion-card__body h3,
body .ai-suggestion-card__body h4,
body .ai-suggestion-card__body h5,
body .ai-suggestion-card__body h6 {
    margin: 1.7em 0 0.55em;
    line-height: 1.45;
    font-weight: 700;
    letter-spacing: -0.005em;
    color: #111827;
    font-family: inherit;
}

body .markdown-preview h1,
body #doc-preview-content h1,
body .preview-document h1,
body .formatted-view h1,
body .ai-suggestion-card__body h1 {
    font-size: 1.18rem;
    padding-bottom: 0.35em;
    border-bottom: 1px solid #e5e7eb;
}

body .markdown-preview h2,
body #doc-preview-content h2,
body .preview-document h2,
body .formatted-view h2,
body .ai-suggestion-card__body h2 {
    font-size: 1.03rem;
}

body .markdown-preview h3,
body #doc-preview-content h3,
body .preview-document h3,
body .formatted-view h3,
body .ai-suggestion-card__body h3 {
    font-size: 0.94rem;
    color: #4338ca;
}

body .markdown-preview h4,
body .markdown-preview h5,
body .markdown-preview h6,
body #doc-preview-content h4,
body #doc-preview-content h5,
body #doc-preview-content h6,
body .preview-document h4,
body .preview-document h5,
body .preview-document h6,
body .formatted-view h4,
body .formatted-view h5,
body .formatted-view h6,
body .ai-suggestion-card__body h4,
body .ai-suggestion-card__body h5,
body .ai-suggestion-card__body h6 {
    font-size: 0.88rem;
    color: #4b5563;
}

/* ── Body copy ─────────────────────────────────────────────────────────── */

body .markdown-preview p,
body #doc-preview-content p,
body .preview-document p,
body .formatted-view p,
body .ai-suggestion-card__body p {
    margin: 0 0 0.85em;
    /* Explicit, not just inherited: the preview panes sit inside layout
       containers whose own stylesheets set a paragraph size, and those would
       otherwise win over the pane and make the same document render at a
       different size from one page to the next. */
    font-size: inherit;
    color: inherit;
    line-height: inherit;
}

/* The models label clauses as "**1. 시나리오 설명:**", so bold runs carry
   structure here and are set darker than the prose around them. */
body .markdown-preview strong,
body #doc-preview-content strong,
body .preview-document strong,
body .formatted-view strong,
body .ai-suggestion-card__body strong {
    font-weight: 700;
    color: #111827;
}

/* ── Lists ─────────────────────────────────────────────────────────────── */

body .markdown-preview ul,
body .markdown-preview ol,
body #doc-preview-content ul,
body #doc-preview-content ol,
body .preview-document ul,
body .preview-document ol,
body .formatted-view ul,
body .formatted-view ol,
body .ai-suggestion-card__body ul,
body .ai-suggestion-card__body ol {
    margin: 0 0 0.85em;
    padding-left: 1.4em;
}

body .markdown-preview li,
body #doc-preview-content li,
body .preview-document li,
body .formatted-view li,
body .ai-suggestion-card__body li {
    margin: 0.25em 0;
    padding-left: 0.2em;
}

body .markdown-preview li::marker,
body #doc-preview-content li::marker,
body .preview-document li::marker,
body .formatted-view li::marker,
body .ai-suggestion-card__body li::marker {
    color: #8b5cf6;
}

body .markdown-preview li > ul,
body .markdown-preview li > ol,
body #doc-preview-content li > ul,
body #doc-preview-content li > ol,
body .preview-document li > ul,
body .preview-document li > ol,
body .formatted-view li > ul,
body .formatted-view li > ol,
body .ai-suggestion-card__body li > ul,
body .ai-suggestion-card__body li > ol {
    margin: 0.25em 0 0.35em;
}

/* ── Tables ────────────────────────────────────────────────────────────── */
/* The one place structure should be visible, set to the grid of the Word file
   these documents become. */

body .markdown-preview table,
body #doc-preview-content table,
body .preview-document table,
body .formatted-view table,
body .ai-suggestion-card__body table {
    width: 100%;
    margin: 0 0 1em;
    border-collapse: collapse;
    font-size: 0.88rem;
    line-height: 1.6;
}

body .markdown-preview th,
body .markdown-preview td,
body #doc-preview-content th,
body #doc-preview-content td,
body .preview-document th,
body .preview-document td,
body .formatted-view th,
body .formatted-view td,
body .ai-suggestion-card__body th,
body .ai-suggestion-card__body td {
    border: 1px solid #e5e7eb;
    padding: 7px 11px;
    text-align: left;
    vertical-align: top;
}

body .markdown-preview th,
body #doc-preview-content th,
body .preview-document th,
body .formatted-view th,
body .ai-suggestion-card__body th {
    background: #f5f3ff;
    font-weight: 700;
    color: #312e81;
}

/* ── Quotes, code, rules ───────────────────────────────────────────────── */

body .markdown-preview blockquote,
body #doc-preview-content blockquote,
body .preview-document blockquote,
body .formatted-view blockquote,
body .ai-suggestion-card__body blockquote {
    margin: 0 0 0.85em;
    padding: 0.1em 0 0.1em 0.9em;
    border-left: 2px solid #c4b5fd;
    color: #4b5563;
}

body .markdown-preview code,
body #doc-preview-content code,
body .preview-document code,
body .formatted-view code,
body .ai-suggestion-card__body code {
    font-family: 'SF Mono', 'Cascadia Mono', Consolas, monospace;
    font-size: 0.86em;
    padding: 0.12em 0.35em;
    border-radius: 4px;
    background: #f3f0ff;
    color: #4338ca;
}

body .markdown-preview pre,
body #doc-preview-content pre,
body .preview-document pre,
body .formatted-view pre,
body .ai-suggestion-card__body pre {
    margin: 0 0 0.85em;
    padding: 0.8em 1em;
    overflow-x: auto;
    border-radius: 8px;
    background: #f9fafb;
    border: 1px solid #e5e7eb;
}

body .markdown-preview pre code,
body #doc-preview-content pre code,
body .preview-document pre code,
body .formatted-view pre code,
body .ai-suggestion-card__body pre code {
    padding: 0;
    background: none;
    color: inherit;
}

body .markdown-preview hr,
body #doc-preview-content hr,
body .preview-document hr,
body .formatted-view hr,
body .ai-suggestion-card__body hr {
    border: none;
    border-top: 1px solid #e5e7eb;
    margin: 1.4em 0;
}

/* No stray space at a pane's edges, whatever the markdown opens or closes
   with — the box supplies the padding, the content should not add to it. */
body .markdown-preview > *:first-child,
body #doc-preview-content > *:first-child,
body .preview-document > *:first-child,
body .formatted-view > *:first-child,
body .ai-suggestion-card__body > *:first-child {
    margin-top: 0;
}

body .markdown-preview > *:last-child,
body #doc-preview-content > *:last-child,
body .preview-document > *:last-child,
body .formatted-view > *:last-child,
body .ai-suggestion-card__body > *:last-child {
    margin-bottom: 0;
}