:root { --paper-width: 210mm; --paper-height: 297mm; }
body { background: #f3f5f8; color: #25324b; }
.workspace { display: grid; grid-template-columns: minmax(285px, 360px) minmax(0, 1fr); gap: 1.5rem; align-items: start; }
.editor-panel, .preview-panel { min-width: 0; }
.card { border-radius: .8rem; }
#articleText { resize: vertical; min-height: 180px; line-height: 1.7; }
.drop-zone { display: flex; flex-direction: column; align-items: center; gap: .35rem; border: 2px dashed #b8c5dc; border-radius: .6rem; padding: 1.4rem .5rem; text-align: center; cursor: pointer; background: #f7f9ff; transition: background .15s, border-color .15s; }
.drop-zone:hover, .drop-zone:focus-visible, .drop-zone.drag-over { background: #eaf0ff; border-color: #526fd0; outline: 2px solid transparent; }
.image-list { display: grid; gap: .7rem; margin-top: .8rem; }
.image-item { display: flex; align-items: center; gap: .65rem; border: 1px solid #e0e5ee; padding: .5rem; border-radius: .5rem; }
.image-thumbnail { width: 48px; height: 56px; object-fit: contain; background: #f3f5f8; flex-shrink: 0; }
.image-detail { min-width: 0; flex: 1; }
.image-name { display: block; font-size: .8rem; overflow-wrap: anywhere; }
.image-actions { display: flex; gap: .25rem; margin-top: .3rem; }
.image-actions button { font-size: .75rem; padding: .15rem .4rem; }
.empty-preview { min-height: 440px; display: flex; flex-direction: column; align-items: center; justify-content: center; border: 1px dashed #c8d1e0; border-radius: .8rem; color: #7c889e; background: #eef1f6; text-align: center; padding: 1.5rem; }
#pagePreview { min-width: 0; }
.page-frame { position: relative; margin: 0 auto 1.5rem; overflow: hidden; }
.paper-page { width: var(--paper-width); height: var(--paper-height); padding: var(--page-margin, 16mm); background: white; color: #171717; box-sizing: border-box; box-shadow: 0 3px 16px #172d4b1c; transform-origin: top left; position: relative; }
.article-title { margin: 0 0 6mm; padding: 0; font-family: "Noto Serif CJK SC", "Songti SC", SimSun, serif; font-size: calc(var(--article-font, 12pt) * 1.5); font-weight: 700; line-height: 1.4; text-align: center; text-transform: uppercase; white-space: pre-wrap; overflow-wrap: anywhere; }
.paper-columns { display: grid; grid-template-columns: repeat(var(--column-count, 1), minmax(0, 1fr)); column-gap: 8mm; width: 100%; height: 100%; }
.paper-column { min-width: 0; height: 100%; overflow: hidden; font-family: "Noto Serif CJK SC", "Songti SC", SimSun, serif; font-size: var(--article-font, 12pt); line-height: 1.65; }
.article-fragment { margin: 0; padding: 0; white-space: pre-wrap; overflow-wrap: anywhere; word-break: normal; }
.print-image { margin: 0; padding: 0; display: block; text-align: center; line-height: 0; }
.print-image + .print-image, .article-fragment + .print-image { margin-top: 4mm; }
.print-image img { display: inline-block; vertical-align: top; max-width: 100%; }
.page-label { position: absolute; bottom: 4mm; left: 0; right: 0; text-align: center; font: 9px/1.2 system-ui, sans-serif; color: #9aa1ab; }
#printEmptyMessage { display: none; }
@media (max-width: 991px) { .workspace { grid-template-columns: minmax(0, 1fr); } .editor-panel { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1rem; } .editor-panel > .card { margin-bottom: 0 !important; } .editor-panel > .card:first-child { grid-column: 1 / -1; } }
@media (max-width: 575px) { .editor-panel { display: block; } .editor-panel > .card { margin-bottom: 1rem !important; } .print-app { padding-left: .75rem !important; padding-right: .75rem !important; } }
@page { size: A4 portrait; margin: 0; }
@media print {
    html, body { width: 210mm; margin: 0 !important; padding: 0 !important; background: white; }
    body > nav, .print-controls, .page-label, #emptyPreview { display: none !important; }
    .print-app, .workspace, .preview-panel, #pagePreview { display: block !important; width: 210mm !important; max-width: none !important; margin: 0 !important; padding: 0 !important; }
    .page-frame { width: 210mm !important; height: 297mm !important; margin: 0 !important; break-after: page; page-break-after: always; break-inside: avoid; }
    .page-frame:last-child { break-after: auto; page-break-after: auto; }
    .paper-page { transform: none !important; box-shadow: none; margin: 0; }
    body.print-unavailable .print-app { display: none !important; }
    body.print-unavailable #printEmptyMessage { display: block; padding: 20mm; color: black; }
}