:root {
  color-scheme: light;
  --ui-accent: #6d5f4e;
  --ui-accent-dark: #453b30;
  --ui-accent-soft: #ebe5db;
  --ui-bg: #e8e6e1;
  --ui-panel: #f7f6f3;
  --ui-card: #fcfbf8;
  --ui-line: #cdc8bf;
  --ui-line-strong: #aea89d;
  --ui-text: #2c2a26;
  --ui-muted: #6d685f;
  --topbar-height: 64px;
  --font-ui: "OC Noto Sans SC","Noto Sans SC","PingFang SC","Microsoft YaHei",sans-serif;
  --font-serif: "OC Noto Serif SC","Noto Serif SC","Songti SC",serif;
  --font-mono: Consolas,"Courier New",monospace;
  font-family: var(--font-ui);
}
* { box-sizing: border-box; }
html { height: 100%; overflow: hidden; }
body { width: 100%; height: 100vh; height: 100dvh; min-width: 320px; margin: 0; overflow: hidden; display: grid; grid-template-rows: var(--topbar-height) minmax(0,1fr); color: var(--ui-text); background: var(--ui-bg); }
body.is-export-busy { cursor: progress; }
body.is-export-busy button { cursor: progress; }
button,input,textarea,select { font: inherit; color: inherit; }
button,.file-button { -webkit-tap-highlight-color: transparent; }
button:focus-visible,input:focus-visible,textarea:focus-visible,select:focus-visible,[tabindex]:focus-visible { outline: 2px solid var(--ui-accent); outline-offset: 2px; }
button:active,.file-button:active { transform: translateY(1px); }
[hidden] { display: none !important; }

/* ================= 编辑器外壳 ================= */
.topbar { height: 100%; display: flex; align-items: center; gap: 14px; padding: 0 16px; border-bottom: 1px solid var(--ui-line); background: rgba(249,248,245,.98); position: relative; z-index: 20; }
.brand { display: inline-flex; align-items: center; gap: 10px; min-width: 236px; color: inherit; text-decoration: none; }
.brand-mark { width: 42px; height: 42px; display: grid; place-items: center; border-radius: 5px; background: var(--ui-accent); color: #fff; font-family: var(--font-serif); font-size: 22px; font-weight: 800; box-shadow: 4px 4px 0 #d6d1c7; }
.brand-copy { display: grid; gap: 1px; }
.brand-copy b { font-family: var(--font-serif); font-size: 18px; line-height: 1.2; }
.brand-copy small { color: var(--ui-muted); font-size: 10px; font-weight: 800; letter-spacing: .13em; }
.project-field { flex: 1; max-width: 420px; display: grid; grid-template-columns: auto minmax(160px,1fr); align-items: center; gap: 8px; }
.project-field span { color: var(--ui-muted); font-size: 12px; font-weight: 700; }
.project-field input { height: 40px; min-width: 0; padding: 0 12px; border: 1px solid var(--ui-line); border-radius: 6px; background: #fff; }
.top-actions { margin-left: auto; display: flex; align-items: center; gap: 6px; white-space: nowrap; }
.button,.preview-actions button { min-height: 38px; padding: 0 13px; border: 1px solid var(--ui-line); border-radius: 6px; background: #fff; cursor: pointer; font-size: 13px; font-weight: 750; white-space: nowrap; }
.button:hover,.preview-actions button:hover { border-color: var(--ui-accent); }
.button.primary { border-color: var(--ui-accent); background: var(--ui-accent); color: #fff; }
.button.quiet { background: transparent; }
.button.compact { min-height: 34px; padding-inline: 10px; font-size: 12px; }
.button:disabled { opacity: .4; cursor: default; }
.file-button { position: relative; display: inline-flex; align-items: center; justify-content: center; overflow: hidden; cursor: pointer; }
.file-button input { position: absolute; inset: 0; width: 100%; height: 100%; margin: 0; opacity: 0; cursor: pointer; }
.text-button { padding: 4px 0; border: 0; background: transparent; color: var(--ui-accent-dark); cursor: pointer; font-size: 12px; font-weight: 750; }
.workspace { min-height: 0; display: grid; grid-template-columns: 348px minmax(430px,1fr) 366px; }
.editor-panel { min-width: 0; min-height: 0; display: grid; grid-template-rows: auto minmax(0,1fr); background: var(--ui-panel); }
.content-panel { border-right: 1px solid var(--ui-line); }
.style-panel { border-left: 1px solid var(--ui-line); }
.panel-heading { min-height: 70px; display: flex; align-items: center; gap: 12px; padding: 12px 16px; border-bottom: 1px solid var(--ui-line); background: #faf9f7; }
.panel-heading > span { padding: 4px 8px; border-radius: 4px; background: var(--ui-accent-soft); color: var(--ui-accent-dark); font-size: 10px; font-weight: 850; letter-spacing: .1em; }
.panel-heading h1 { margin: 0; font-family: var(--font-serif); font-size: 17px; }
.panel-heading p { margin: 2px 0 0; color: var(--ui-muted); font-size: 11px; }
.panel-scroll { min-height: 0; overflow-y: auto; overscroll-behavior: contain; padding: 14px; scrollbar-gutter: stable; }
.editor-card { margin-bottom: 14px; padding: 14px; border: 1px solid var(--ui-line); border-radius: 8px; background: var(--ui-card); box-shadow: 0 1px 0 rgba(44,42,38,.03); }
.card-title { display: flex; align-items: flex-start; justify-content: space-between; gap: 10px; margin-bottom: 12px; }
.card-title h2 { margin: 0; font-family: var(--font-serif); font-size: 15px; }
.card-title p { margin: 3px 0 0; color: var(--ui-muted); font-size: 11px; line-height: 1.5; }
.card-title > span { padding: 3px 7px; border: 1px solid var(--ui-line); border-radius: 4px; color: var(--ui-muted); font-size: 9px; font-weight: 850; letter-spacing: .1em; }
.field { min-width: 0; display: grid; gap: 5px; margin-bottom: 10px; }
.field > span { color: var(--ui-muted); font-size: 11px; font-weight: 750; }
.field input,.field textarea,.field select { min-height: 38px; min-width: 0; padding: 8px 10px; border: 1px solid var(--ui-line); border-radius: 5px; background: #fff; font-size: 13px; }
.field textarea { min-height: 84px; line-height: 1.6; resize: vertical; }
.field-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 9px; }
.image-control { display: grid; grid-template-columns: 82px minmax(0,1fr); align-items: center; gap: 12px; margin-bottom: 12px; }
.image-control:last-child { margin-bottom: 0; }
.image-control b { font-size: 12px; }
.image-control p { margin: 3px 0 6px; color: var(--ui-muted); font-size: 11px; line-height: 1.5; }
.upload-preview { width: 82px; height: 82px; display: grid; place-items: center; overflow: hidden; padding: 5px; border: 1px dashed var(--ui-line-strong); border-radius: 7px; background: #f0eeea; color: var(--ui-muted); font-size: 10px; }
.upload-preview img { max-width: 100%; max-height: 100%; object-fit: contain; }
.inline-actions { display: flex; align-items: center; gap: 9px; flex-wrap: wrap; }
.style-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 8px; }
.style-button { min-width: 0; min-height: 62px; display: grid; grid-template-columns: 30px minmax(0,1fr); align-items: center; gap: 8px; padding: 8px; border: 1px solid var(--ui-line); border-radius: 6px; background: #fff; text-align: left; cursor: pointer; }
.style-button.active { border-color: var(--ui-accent); background: var(--ui-accent-soft); }
.style-swatch { width: 30px; height: 42px; border: 1px solid rgba(0,0,0,.15); border-radius: 3px; background: linear-gradient(180deg,var(--a) 0 44%,var(--b) 44% 62%,var(--d) 62% 74%,var(--c) 74%); }
.style-button b { display: block; font-size: 11px; line-height: 1.35; }
.style-button small { display: block; margin-top: 2px; color: var(--ui-muted); font-size: 9px; line-height: 1.32; }
.segment-control { display: grid; gap: 7px; margin-top: 12px; padding-top: 12px; border-top: 1px solid var(--ui-line); }
.segment-control > span { color: var(--ui-muted); font-size: 11px; font-weight: 750; }
.segment-switch { display: grid; grid-auto-flow: column; grid-auto-columns: minmax(0,1fr); }
.segment-switch button { min-height: 38px; border: 1px solid var(--ui-line); border-right: 0; background: #fff; cursor: pointer; font-size: 12px; font-weight: 800; }
.segment-switch button:first-child { border-radius: 6px 0 0 6px; }
.segment-switch button:last-child { border-right: 1px solid var(--ui-line); border-radius: 0 6px 6px 0; }
.segment-switch button.active { border-color: var(--ui-accent); background: var(--ui-accent); color: #fff; }
.color-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 8px; }
.color-field { min-width: 0; display: grid; grid-template-columns: 40px minmax(0,1fr); align-items: center; gap: 7px; padding: 7px; border: 1px solid var(--ui-line); border-radius: 5px; background: #fff; }
.color-field > span { font-size: 11px; font-weight: 750; }
.color-field .clr-field { width: 100%; }
.color-field input { width: 100%; min-width: 0; height: 32px; border: 0; background: transparent; }
.check-row { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 8px; }
.check-row label,.check-field { min-height: 38px; display: flex; align-items: center; gap: 7px; padding: 7px 9px; border: 1px solid var(--ui-line); border-radius: 5px; background: #fff; font-size: 12px; font-weight: 700; }
.check-field { margin-top: 8px; }
.check-row input,.check-field input { accent-color: var(--ui-accent); }
.range-row { display: grid; grid-template-columns: minmax(0,1fr) 52px; align-items: center; gap: 10px; margin-bottom: 10px; }
.range-row input[type="range"] { width: 100%; accent-color: var(--ui-accent); }
.range-row output { text-align: right; color: var(--ui-muted); font-size: 11px; font-weight: 750; }
.hint-note { margin: 8px 0 0; padding: 8px 10px; border-left: 3px solid var(--ui-line-strong); background: #f4f2ed; color: var(--ui-muted); font-size: 11px; line-height: 1.6; }
.list-editor { display: grid; gap: 8px; }
.list-block + .list-block { margin-top: 14px; padding-top: 12px; border-top: 1px solid var(--ui-line); }
.list-block-head { display: flex; align-items: center; justify-content: space-between; gap: 8px; margin-bottom: 8px; }
.list-block-head b { font-size: 12px; }
.list-block-head small { display: block; margin-top: 2px; color: var(--ui-muted); font-size: 10px; }
.list-item { padding: 9px; border: 1px solid var(--ui-line); border-radius: 6px; background: #fff; }
.list-item-head { display: flex; align-items: center; justify-content: space-between; gap: 6px; margin-bottom: 7px; }
.list-item-head span { color: var(--ui-accent-dark); font-size: 10px; font-weight: 850; letter-spacing: .08em; }
.list-item-actions { display: flex; gap: 3px; }
.list-item-actions button { width: 26px; height: 26px; border: 1px solid var(--ui-line); border-radius: 4px; background: #fff; cursor: pointer; font-size: 11px; }
.list-item .field:last-child { margin-bottom: 0; }
.list-empty { margin: 0; padding: 10px; border: 1px dashed var(--ui-line-strong); border-radius: 6px; color: var(--ui-muted); font-size: 11px; text-align: center; }
.preset-sticker-grid { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 6px; margin-top: 10px; }
.preset-sticker-grid button { min-height: 34px; padding: 5px; border: 1px solid var(--ui-line); border-radius: 5px; background: #fff; cursor: pointer; font-size: 10px; font-weight: 800; }
.sticker-list { display: grid; gap: 6px; }
.sticker-row { display: grid; grid-template-columns: 1fr auto; align-items: center; gap: 6px; padding: 7px 8px; border: 1px solid var(--ui-line); border-radius: 5px; background: #fff; cursor: grab; }
.sticker-row.active { border-color: var(--ui-accent); background: var(--ui-accent-soft); }
.sticker-row b { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 11px; }
.sticker-row-actions { display: flex; gap: 3px; }
.sticker-row-actions button { width: 26px; height: 26px; border: 1px solid var(--ui-line); border-radius: 4px; background: #fff; cursor: pointer; font-size: 11px; }
.sticker-editor { margin-top: 10px; padding-top: 10px; border-top: 1px solid var(--ui-line); }
.sticker-editor-actions { display: grid; grid-template-columns: repeat(4,1fr); gap: 5px; margin-top: 8px; }
.sticker-editor-actions button { min-height: 32px; border: 1px solid var(--ui-line); border-radius: 4px; background: #fff; cursor: pointer; font-size: 10px; }
.empty-note { margin: 4px 0; color: var(--ui-muted); font-size: 11px; }
.export-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 8px; }
.export-grid .button { min-height: 42px; }
.preview-panel { min-width: 0; min-height: 0; display: grid; grid-template-rows: 48px minmax(0,1fr); background: #d8d5ce; }
.preview-toolbar { display: flex; align-items: center; justify-content: space-between; gap: 9px; padding: 0 11px; border-bottom: 1px solid var(--ui-line); background: #f5f4f2; }
.preview-toolbar > div { display: flex; align-items: center; gap: 9px; }
.preview-toolbar strong { font-size: 13px; }
.preview-toolbar #save-state { color: var(--ui-muted); font-size: 11px; }
.preview-actions { display: flex; gap: 5px; }
.preview-actions button { min-height: 34px; padding: 0 10px; font-size: 12px; }
.preview-actions button.active { border-color: var(--ui-accent); background: var(--ui-accent); color: #fff; }
.preview-viewport { min-width: 0; min-height: 0; overflow: auto; overscroll-behavior: contain; }
.preview-stage { position: relative; margin: 28px auto; }

/* ================= 文书画布基座 ================= */
.doc-canvas {
  --doc-surface:#fbfaf6; --doc-ink:#1d1d1b; --doc-accent:#2f6b4f; --doc-muted:#6b665c; --doc-line:#b6b1a6;
  --paper-w:794px; --paper-h:1123px; --doc-scale:1; --doc-line-height:1.75; --doc-indent:2em;
  --style-font:var(--font-serif); --doc-body-font:var(--style-font);
  position: relative; isolation: isolate; width: var(--paper-w); min-height: var(--paper-h); flex-shrink: 0;
  background: var(--doc-surface); color: var(--doc-ink); font-family: var(--doc-body-font); font-size: 16px; line-height: var(--doc-line-height);
  transform-origin: top left; box-shadow: 0 12px 30px rgba(35,32,28,.24); user-select: none;
}
.doc-canvas[data-page-guides="true"]::after { content: ""; position: absolute; inset: 0; z-index: 30; pointer-events: none; background: repeating-linear-gradient(to bottom,transparent 0 calc(var(--paper-h) - 1px),rgba(120,110,95,.34) calc(var(--paper-h) - 1px) var(--paper-h)); }
.doc-canvas.is-exporting { box-shadow: none; }
.doc-page {
  --pad-t:70px; --pad-r:82px; --pad-b:56px; --pad-l:82px;
  position: relative; z-index: 2; min-height: var(--paper-h); display: flex; flex-direction: column;
  padding: var(--pad-t) var(--pad-r) var(--pad-b) var(--pad-l); font-size: calc(16px * var(--doc-scale));
}
.doc-page * { box-sizing: border-box; }
.doc-page > * { flex: 0 0 auto; }
.doc-page > .doc-fill { flex: 1 1 auto; }
.doc-page img { display: block; }
.doc-fill { flex: 1 1 auto; min-height: .6em; }
.doc-logo { display: grid; place-items: center; overflow: hidden; width: 48px; height: 48px; flex: 0 0 auto; }
.doc-logo img { width: 100%; height: 100%; object-fit: contain; }
.fictional-mark { display: inline-block; padding: .1em .5em; border: 1px solid currentColor; color: var(--doc-muted); font-family: var(--font-mono); font-size: .58em; font-weight: 800; letter-spacing: .14em; line-height: 1.5; white-space: nowrap; }
.doc-watermark { position: absolute; left: 50%; top: 42%; z-index: 0; color: var(--doc-line); font-family: var(--font-serif); font-size: 5.4em; font-weight: 800; letter-spacing: .3em; white-space: nowrap; opacity: .16; transform: translate(-50%,-50%) rotate(-24deg); pointer-events: none; }
.doc-canvas.stickers-only .doc-page,.doc-canvas.stickers-only .chrome-spine,.doc-canvas.stickers-only .chrome-punch,.doc-canvas.stickers-only .chrome-filebar,.doc-canvas.stickers-only .chrome-rail,.doc-canvas.stickers-only .chrome-band,.doc-canvas.stickers-only .chrome-scan,.doc-canvas.stickers-only .chrome-matrix,.doc-canvas.stickers-only .chrome-frame,.doc-canvas.stickers-only .chrome-frame-inner,.doc-canvas.stickers-only .chrome-corner,.doc-canvas.stickers-only .chrome-runes,.doc-canvas.stickers-only .chrome-banner,.doc-canvas.stickers-only .chrome-noise,.doc-canvas.stickers-only .chrome-pin,.doc-canvas.stickers-only .chrome-burlap { visibility: hidden; }
.doc-canvas.stickers-only { background: transparent; box-shadow: none; }
.doc-canvas.stickers-only[data-page-guides]::after { display: none; }

/* ---- 语义化通用件 ---- */
.doc-header { display: grid; grid-template-columns: minmax(0,1fr) auto; align-items: start; gap: 20px; margin-bottom: 18px; }
.doc-header-stack { display: block; text-align: center; }
.doc-header-thin { display: flex; align-items: center; justify-content: space-between; gap: 16px; padding-bottom: 8px; border-bottom: 1px solid var(--doc-line); color: var(--doc-muted); font-size: .62em; letter-spacing: .1em; }
.doc-header-thin span { overflow-wrap: anywhere; }
.doc-org { display: flex; align-items: center; gap: 12px; min-width: 0; }
.doc-org b { display: block; font-size: 1.02em; font-weight: 800; overflow-wrap: anywhere; }
.doc-org small { display: block; margin-top: .2em; color: var(--doc-muted); font-family: var(--font-mono); font-size: .58em; letter-spacing: .12em; }
.doc-meta { text-align: right; }
.doc-meta span { display: block; color: var(--doc-muted); font-size: .56em; font-weight: 800; letter-spacing: .12em; }
.doc-meta b { display: block; margin-top: .25em; font-family: var(--font-mono); font-size: .8em; }
.doc-meta-row { display: flex; align-items: flex-end; justify-content: space-between; gap: 16px; margin-top: 22px; font-size: .82em; }
.doc-meta-row span { overflow-wrap: anywhere; }
.doc-meta-line { margin: 22px 0 16px; font-size: .84em; text-align: right; overflow-wrap: anywhere; }
.doc-title { margin: 0 0 6px; font-size: 1.9em; font-weight: 800; letter-spacing: .18em; line-height: 1.4; overflow-wrap: anywhere; text-wrap: balance; }
.doc-title-lg { font-size: 1.86em; letter-spacing: .2em; }
.doc-title-xl { font-size: 2.4em; letter-spacing: .12em; }
.doc-title-sm { font-size: 1.4em; letter-spacing: .14em; }
.doc-title-sub { font-size: 1.42em; font-weight: 700; letter-spacing: .06em; line-height: 1.6; }
.doc-title-center { text-align: center; }
.doc-subtitle { margin: 0 0 22px; color: var(--doc-muted); font-family: var(--font-mono); font-size: .6em; letter-spacing: .26em; }
.doc-subtitle-lg { font-family: inherit; font-size: 1.34em; font-weight: 800; letter-spacing: .5em; text-indent: .5em; color: inherit; margin: 14px 0 0; }
.doc-subtitle-center { text-align: center; }
.doc-header-stack .doc-title,.doc-header-stack .doc-subtitle { text-align: center; }
.doc-section { margin-bottom: 18px; }
.doc-section:last-child { margin-bottom: 0; }
.doc-section-label { display: block; margin: 0 0 8px; color: var(--doc-accent); font-size: .74em; font-weight: 800; letter-spacing: .08em; }
.doc-lead { margin: 0 0 16px; text-indent: var(--doc-indent); font-size: .84em; overflow-wrap: anywhere; }
.doc-lead-strong { font-size: .86em; font-weight: 800; color: inherit; text-indent: var(--doc-indent); }
.doc-to { margin: 0 0 14px; font-size: .88em; font-weight: 700; overflow-wrap: anywhere; }
.doc-body { font-size: .84em; }
.doc-body p { margin: 0 0 .55em; text-indent: var(--doc-indent); overflow-wrap: anywhere; }
.doc-body p:last-child { margin-bottom: 0; }
.doc-flat p { text-indent: var(--doc-indent); }
.doc-inline-label { font-weight: 800; }
.doc-tail { margin: 0 0 20px; text-indent: var(--doc-indent); }
.doc-columns { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 0; border: 1px solid var(--doc-line); }
.doc-columns > * { min-width: 0; padding: 13px 15px; }
.doc-columns > * + * { border-left: 1px solid var(--doc-line); }
.doc-pairs { margin: 0; display: grid; gap: 4px; }
.doc-pairs > div { display: grid; grid-template-columns: 4.4em minmax(0,1fr); gap: 8px; align-items: baseline; min-height: 1.8em; font-size: .74em; }
.doc-pairs dt { color: var(--doc-muted); }
.doc-pairs dd { margin: 0; min-width: 0; overflow-wrap: anywhere; }
.doc-articles { display: grid; gap: 11px; }
.doc-article { break-inside: avoid; }
.doc-article-title { margin: 0 0 5px; font-size: .9em; font-weight: 800; overflow-wrap: anywhere; }
.doc-article-title .doc-index { margin-right: .5em; color: var(--doc-accent); }
.doc-article .doc-body { font-size: .8em; }
.doc-list { display: grid; gap: 8px; margin: 0 0 18px; padding: 0; list-style: none; font-size: .84em; }
.doc-list li { display: grid; grid-template-columns: 2.6em minmax(0,1fr); gap: 6px; align-items: baseline; }
.doc-list li > .doc-index { font-weight: 800; }
.doc-list li > div { min-width: 0; overflow-wrap: anywhere; }
.doc-list.is-plain { list-style: decimal; padding-left: 1.8em; }
.doc-list.is-plain li { display: list-item; }
.doc-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); border: 1px solid var(--doc-line); }
.doc-cell { min-width: 0; display: grid; grid-template-columns: 5em minmax(0,1fr); gap: 8px; align-items: baseline; padding: 9px 14px; border-bottom: 1px solid var(--doc-line); font-size: .74em; }
.doc-cell:nth-child(2n) { border-left: 1px solid var(--doc-line); }
.doc-cell:nth-last-child(-n+2) { border-bottom: 0; }
.doc-cell span { color: var(--doc-muted); }
.doc-cell b { min-width: 0; font-weight: 700; overflow-wrap: anywhere; }
.doc-attachments { font-size: .76em; }
.doc-attachments b { display: block; margin-bottom: 5px; font-weight: 800; }
.doc-attachments ol { margin: 0; padding-left: 1.6em; display: grid; gap: 3px; }
.doc-attachments li { overflow-wrap: anywhere; }
.doc-table { width: 100%; border-collapse: collapse; table-layout: fixed; font-size: .74em; }
.doc-table th,.doc-table td { min-width: 0; padding: 8px 11px; border: 1px solid var(--doc-line); vertical-align: top; text-align: left; overflow-wrap: anywhere; }
.doc-table th { width: 22%; background: color-mix(in srgb,var(--doc-line) 22%,var(--doc-surface)); font-weight: 700; }
.doc-table tr.is-wide th,.doc-table tr.is-wide td { padding-block: 24px; }
.doc-table p { margin: 0 0 .35em; text-indent: 0; }
.doc-table p:last-child { margin-bottom: 0; }
.doc-opinions { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); border: 1px solid var(--doc-line); }
.doc-opinion { min-width: 0; padding: 11px 14px; display: grid; gap: 7px; }
.doc-opinion + .doc-opinion { border-left: 1px solid var(--doc-line); }
.doc-opinion > small { color: var(--doc-muted); font-size: .6em; text-align: right; }
.doc-opinion-box { position: relative; min-height: 82px; padding: 7px; border: 1px dashed var(--doc-line); font-size: .72em; overflow-wrap: anywhere; }
.doc-opinion-box p { margin: 0 0 .35em; text-indent: 0; }
.doc-opinion-rows { display: grid; }
.doc-opinion-row { display: grid; grid-template-columns: 22% minmax(0,1fr); border: 1px solid var(--doc-line); border-top: 0; }
/* 表格审批单的意见栏标题是结构单元格，用专属类隔开：各方向对通用 .doc-section-label 的改写
   （尤其是 margin-bottom）会让它填不满格子，露出纸底 */
.doc-opinion-row > .doc-opinion-head { display: flex; align-items: center; margin: 0; padding: 10px 11px; border-right: 1px solid var(--doc-line); background: color-mix(in srgb,var(--doc-line) 22%,var(--doc-surface)); color: var(--doc-accent); font-size: .72em; font-weight: 800; letter-spacing: .08em; }
.doc-opinion-row .doc-opinion-box { min-height: 84px; border: 0; padding: 10px 12px 28px; }
.doc-opinion-sign { position: absolute; right: 12px; bottom: 7px; color: var(--doc-muted); font-size: .84em; }
.doc-signature { display: grid; gap: 10px; margin-top: 20px; }
.doc-signature-right { justify-items: end; }
.doc-signature-right b { font-weight: 700; font-size: .92em; }
.doc-signature-right span { font-size: .84em; }
.doc-signature-end { grid-template-columns: minmax(0,1fr); justify-items: end; }
.doc-sign-col { min-width: 0; }
.doc-sign-line { display: grid; grid-template-columns: 5em minmax(0,1fr); align-items: end; gap: 8px; min-height: 2.4em; margin-top: 9px; font-size: .74em; }
.doc-sign-line span { color: var(--doc-muted); }
.doc-sign-line i { min-width: 0; display: block; min-height: 1.5em; padding-bottom: 3px; border-bottom: 1px solid var(--doc-ink); font-style: normal; overflow-wrap: anywhere; }
.doc-sign-line i img { max-width: 100%; max-height: 2.2em; object-fit: contain; }
.doc-sign-stack { display: grid; gap: 10px; justify-items: end; font-size: .84em; }
.doc-sign-row { display: grid; grid-template-columns: 4.6em minmax(6em,auto); gap: 12px; align-items: end; }
.doc-sign-row span { color: var(--doc-muted); letter-spacing: .18em; }
.doc-sign-row i { min-height: 1.5em; padding-bottom: 2px; border-bottom: 1px solid var(--doc-ink); font-style: normal; text-align: center; overflow-wrap: anywhere; }
.doc-sign-row i img { max-width: 100%; max-height: 2.1em; object-fit: contain; }
.doc-date { margin: 12px 0 0; font-size: .84em; text-align: right; }
.doc-divider { height: 1px; margin: 4px 0; background: var(--doc-line); }
.doc-footer { margin-top: 16px; display: flex; align-items: center; justify-content: space-between; gap: 12px; color: var(--doc-muted); font-size: .56em; letter-spacing: .08em; }
.doc-footer span { overflow-wrap: anywhere; }

/* 文头本身已经带下边线的方向，不再叠加机关文件自己的分隔线 —— 否则两条线会挤在十几像素内 */
.doc-canvas[data-style="bureau"] .rh-rule,
.doc-canvas[data-style="codex"] .rh-rule,
.doc-canvas[data-style="redacted"] .rh-rule,
.doc-canvas[data-style="guild"] .rh-rule { display: none; }

/* ---- 类型专属微调 ---- */
.type-contract .doc-title { text-align: center; margin-top: 22px; }
.type-contract .doc-subtitle { text-align: center; }
.type-judgment .doc-list li { align-items: baseline; }
.type-redhead { --pad-t:58px; --pad-b:50px; }
.rh-masthead { margin-bottom: 0; }
.rh-emblem { width: 84px; height: 84px; margin: 0 auto 8px; }
.rh-org { color: var(--doc-accent); font-weight: 900; }
.rh-rule { height: 3px; margin-top: 10px; background: var(--doc-accent); }
.rh-title { margin: 42px auto 30px; max-width: 84%; text-align: center; }
.rh-record { margin-top: auto; display: block; font-size: .66em; }
.rh-record-rule { height: 1px; background: var(--doc-ink); }
.rh-record-row { display: grid; gap: 4px; padding: 6px 2px; }
.rh-record-row.is-split { grid-template-columns: minmax(0,1fr) auto; gap: 14px; }
.rh-record-row .is-right { text-align: right; }
.ap-salute { margin: 0; font-size: .88em; text-indent: var(--doc-indent); }
.ap-salute-strong { margin: .2em 0 20px; font-size: 1.04em; font-weight: 800; }
.type-application .doc-opinions { margin-top: auto; }
.type-form { --pad-t:56px; --pad-r:60px; --pad-b:48px; --pad-l:60px; }
.type-form .doc-header { align-items: end; margin-bottom: 16px; }
.bk-blocks { display: grid; gap: 13px; margin-top: 22px; }

/* ---- 分页：续页页眉与每页页码 ---- */
.page-runner { position: absolute; z-index: 3; color: var(--doc-muted); font-family: var(--font-mono); font-size: 11px; letter-spacing: .14em; pointer-events: none; }
.page-runner-head { left: var(--runner-l, 82px); right: var(--runner-r, 82px); display: flex; align-items: baseline; justify-content: space-between; gap: 16px; padding-bottom: 5px; border-bottom: 1px solid var(--doc-line); }
.page-runner-head span { overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }
.page-runner-foot { left: 0; right: 0; text-align: center; }
.doc-canvas.stickers-only .page-runner { visibility: hidden; }

/* ================= 风格装饰件 ================= */
.chrome-spine,.chrome-punch,.chrome-filebar,.chrome-rail,.chrome-band,.chrome-scan,.chrome-matrix,.chrome-frame,.chrome-frame-inner,.chrome-corner,.chrome-runes,.chrome-banner,.chrome-noise,.chrome-pin,.chrome-burlap { position: absolute; z-index: 1; }
.chrome-scan,.chrome-noise,.chrome-burlap,.chrome-frame,.chrome-frame-inner { pointer-events: none; }
.chrome-spine { left: 0; top: 0; bottom: 0; width: 44px; background: repeating-linear-gradient(45deg,var(--doc-ink) 0 6px,color-mix(in srgb,var(--doc-ink) 78%,var(--doc-surface)) 6px 12px); }
.chrome-punch { left: 14px; top: 170px; display: grid; gap: 150px; }
.chrome-punch i { display: block; width: 16px; height: 16px; border-radius: 50%; background: var(--doc-surface); }
.chrome-filebar { left: 84px; right: 56px; top: 40px; display: flex; align-items: center; justify-content: space-between; gap: 12px; padding-bottom: 8px; border-bottom: 2px solid var(--doc-ink); font-family: var(--font-mono); font-size: 11px; letter-spacing: .18em; }
.chrome-filebar span { overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }
.chrome-barcode { display: flex; align-items: flex-end; gap: 2px; height: 18px; flex: 0 0 auto; }
.chrome-barcode i { display: block; width: 2px; height: 100%; background: var(--doc-ink); }
.chrome-barcode i:nth-child(2n) { width: 4px; opacity: .7; }
.chrome-barcode i:nth-child(3n) { height: 68%; }
.chrome-rail { left: 52px; top: 74px; bottom: 60px; width: 130px; display: flex; flex-direction: column; gap: 16px; padding-right: 20px; border-right: 1px solid var(--doc-line); overflow: hidden; }
.chrome-rail b { display: block; color: var(--doc-accent); font-family: var(--font-mono); font-size: 9.5px; font-weight: 700; letter-spacing: .2em; }
.chrome-rail span { display: block; margin-top: 3px; font-size: 11.5px; line-height: 1.5; overflow-wrap: anywhere; hyphens: auto; }
.chrome-band { left: 0; right: 0; top: 0; height: 30px; background: var(--doc-accent); clip-path: polygon(0 0,100% 0,100% 100%,62px 100%,40px 42%,0 42%); }
.chrome-band span { position: absolute; right: 20px; top: 4px; color: var(--doc-surface); font-family: var(--font-mono); font-size: 11px; font-weight: 700; letter-spacing: .22em; }
.chrome-scan { inset: 0; background: repeating-linear-gradient(0deg,transparent 0 2px,color-mix(in srgb,var(--doc-accent) 14%,transparent) 2px 3px); }
.chrome-matrix { left: 52px; bottom: 60px; width: 116px; display: grid; grid-template-columns: repeat(4,1fr); gap: 3px; }
.chrome-matrix i { display: block; aspect-ratio: 1; background: var(--doc-line); }
.chrome-matrix i:nth-child(3n) { background: var(--doc-accent); opacity: .5; }
.chrome-matrix i:nth-child(7n) { background: var(--doc-accent); }
.chrome-frame { inset: 24px; border: 3px double var(--doc-line); }
.chrome-frame-inner { inset: 36px; border: 1px solid color-mix(in srgb,var(--doc-line) 70%,var(--doc-surface)); }
.chrome-corner { width: 22px; height: 22px; border: 2px solid var(--doc-line); background: var(--doc-surface); transform: rotate(45deg); }
.chrome-corner.tl { left: 13px; top: 13px; } .chrome-corner.tr { right: 13px; top: 13px; }
.chrome-corner.bl { left: 13px; bottom: 13px; } .chrome-corner.br { right: 13px; bottom: 13px; }
.chrome-runes { top: 118px; bottom: 118px; width: 26px; color: var(--doc-line); font-size: 15px; line-height: 2.05; text-align: center; overflow: hidden; }
.chrome-runes.l { left: 44px; } .chrome-runes.r { right: 44px; }
.chrome-banner { left: 0; right: 0; display: flex; align-items: center; justify-content: center; gap: 22px; padding: 8px 0; background: var(--doc-ink); color: var(--doc-surface); font-family: var(--font-mono); font-size: 14px; font-weight: 700; letter-spacing: .38em; }
.chrome-banner.top { top: 0; } .chrome-banner.bottom { bottom: 0; letter-spacing: .2em; font-size: 11px; }
.chrome-banner span { overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }
.chrome-noise { inset: 0; background: radial-gradient(circle at 18% 22%,rgba(0,0,0,.05) 0 1px,transparent 1px),radial-gradient(circle at 74% 61%,rgba(0,0,0,.045) 0 1px,transparent 1px); background-size: 13px 13px,17px 17px; }
.chrome-pin { width: 15px; height: 15px; border-radius: 50%; background: radial-gradient(circle at 34% 32%,color-mix(in srgb,var(--doc-surface) 80%,#fff) 0 22%,var(--doc-muted) 60%,var(--doc-ink) 100%); box-shadow: 0 2px 3px rgba(40,30,15,.32); }
.chrome-pin.tl { left: 32px; top: 32px; } .chrome-pin.tr { right: 32px; top: 32px; }
.chrome-pin.bl { left: 32px; bottom: 32px; } .chrome-pin.br { right: 32px; bottom: 32px; }
.chrome-burlap { inset: 0; background: repeating-linear-gradient(96deg,transparent 0 5px,color-mix(in srgb,var(--doc-ink) 4%,transparent) 5px 6px),repeating-linear-gradient(4deg,transparent 0 7px,color-mix(in srgb,var(--doc-ink) 3%,transparent) 7px 8px); }

/* ================= 九个排版方向 ================= */

/* A 公文正统 —— 居中对称、粗横线、通栏 */
.doc-canvas[data-style="statute"] { --style-font: var(--font-serif); }
.doc-canvas[data-style="statute"] .doc-header { border-bottom: 3px double var(--doc-ink); padding-bottom: 12px; }
.doc-canvas[data-style="statute"] .doc-header-stack { border-bottom: 0; }
/* 机关文件：把文号与签发人移到分隔线下方（用 order 重排，不动标记结构） */
.doc-canvas[data-style="statute"] .rh-masthead { display: flex; flex-direction: column; align-items: stretch; }
.doc-canvas[data-style="statute"] .rh-masthead .rh-rule { order: 1; margin-top: 24px; }
.doc-canvas[data-style="statute"] .rh-masthead .doc-meta-row { order: 2; margin-top: 12px; }
.doc-canvas[data-style="statute"] .doc-title { text-align: center; }
/* 表格审批单的标题在两栏页眉的左栏里，居中会偏离纸张中心 —— 通栏堆叠 */
.doc-canvas[data-style="statute"] .type-form .doc-header { display: block; text-align: center; }
.doc-canvas[data-style="statute"] .type-form .doc-meta { margin-top: 10px; text-align: center; }
.doc-canvas[data-style="statute"] .doc-subtitle { text-align: center; }
.doc-canvas[data-style="statute"] .doc-section-label { letter-spacing: .1em; }
.doc-canvas[data-style="statute"] .doc-footer { padding-top: 8px; border-top: 1px solid var(--doc-line); }

/* B 卷宗打字 —— 装订条 + 打孔 + 等宽 + 虚线 */
.doc-canvas[data-style="dossier"] { --style-font: var(--font-ui); }
.doc-canvas[data-style="dossier"] .doc-page { --pad-t:96px; --pad-l:96px; --pad-r:56px; --pad-b:46px; }
.doc-canvas[data-style="dossier"] .doc-title,.doc-canvas[data-style="dossier"] .doc-article-title,.doc-canvas[data-style="dossier"] .doc-section-label,.doc-canvas[data-style="dossier"] .doc-meta b,.doc-canvas[data-style="dossier"] .doc-subtitle { font-family: var(--font-mono); }
.doc-canvas[data-style="dossier"] .doc-title { font-size: 1.5em; letter-spacing: .1em; text-align: left; }
.doc-canvas[data-style="dossier"] .doc-title-xl { font-size: 1.8em; }
.doc-canvas[data-style="dossier"] .doc-header-stack { text-align: left; }
.doc-canvas[data-style="dossier"] .doc-header-stack .doc-title,.doc-canvas[data-style="dossier"] .doc-header-stack .doc-subtitle { text-align: left; }
.doc-canvas[data-style="dossier"] .doc-subtitle-lg { letter-spacing: .28em; text-indent: 0; }
.doc-canvas[data-style="dossier"] .doc-columns,.doc-canvas[data-style="dossier"] .doc-grid,.doc-canvas[data-style="dossier"] .doc-opinions { border-style: dashed; }
.doc-canvas[data-style="dossier"] .doc-columns > * + *,.doc-canvas[data-style="dossier"] .doc-cell:nth-child(2n),.doc-canvas[data-style="dossier"] .doc-opinion + .doc-opinion { border-left-style: dashed; }
.doc-canvas[data-style="dossier"] .doc-cell { border-bottom-style: dashed; }
.doc-canvas[data-style="dossier"] .doc-table th,.doc-canvas[data-style="dossier"] .doc-table td { border-style: dashed; }
.doc-canvas[data-style="dossier"] .doc-body { line-height: 1.95; }
.doc-canvas[data-style="dossier"] .doc-footer { padding-top: 10px; border-top: 1px dashed var(--doc-line); font-family: var(--font-mono); }
.doc-canvas[data-style="dossier"] .rh-rule { height: 2px; }
.doc-canvas[data-style="dossier"] .rh-title { max-width: none; text-align: left; margin-left: 0; }

/* C 编辑网格 —— 左标签栏、大留白、重字重、左对齐 */
.doc-canvas[data-style="editorial"] { --style-font: var(--font-ui); }
.doc-canvas[data-style="editorial"] .doc-page { --pad-t:74px; --pad-l:216px; --pad-r:66px; --pad-b:58px; }
.doc-canvas[data-style="editorial"] .doc-header { grid-template-columns: minmax(0,1fr); }
.doc-canvas[data-style="editorial"] .doc-header-stack,.doc-canvas[data-style="editorial"] .doc-header-stack .doc-title,.doc-canvas[data-style="editorial"] .doc-header-stack .doc-subtitle { text-align: left; }
.doc-canvas[data-style="editorial"] .doc-meta,.doc-canvas[data-style="editorial"] .doc-meta-line { display: none; }
.doc-canvas[data-style="editorial"] .doc-title { font-size: 2.1em; font-weight: 900; letter-spacing: -.01em; line-height: 1.2; text-align: left; }
.doc-canvas[data-style="editorial"] .doc-title-xl { font-size: 2.3em; }
.doc-canvas[data-style="editorial"] .doc-title-sub,.doc-canvas[data-style="editorial"] .rh-title { max-width: none; margin: 20px 0 18px; text-align: left; font-size: 1.5em; font-weight: 900; }
.doc-canvas[data-style="editorial"] .doc-subtitle { text-align: left; letter-spacing: .22em; }
.doc-canvas[data-style="editorial"] .doc-subtitle-lg { letter-spacing: .3em; text-indent: 0; font-size: 1.1em; }
.doc-canvas[data-style="editorial"] .doc-to { padding-bottom: 16px; border-bottom: 2px solid var(--doc-ink); color: var(--doc-muted); font-weight: 400; }
.doc-canvas[data-style="editorial"] .doc-columns,.doc-canvas[data-style="editorial"] .doc-grid,.doc-canvas[data-style="editorial"] .doc-opinions { border: 0; border-top: 1px solid var(--doc-line); }
.doc-canvas[data-style="editorial"] .doc-columns > * + *,.doc-canvas[data-style="editorial"] .doc-cell:nth-child(2n),.doc-canvas[data-style="editorial"] .doc-opinion + .doc-opinion { border-left: 0; }
.doc-canvas[data-style="editorial"] .doc-columns > * { padding: 12px 16px 12px 0; }
.doc-canvas[data-style="editorial"] .doc-cell { padding-inline: 0 14px; border-bottom-color: var(--doc-line); }
.doc-canvas[data-style="editorial"] .doc-article-title { display: grid; grid-template-columns: 4.6em minmax(0,1fr); gap: 8px; }
.doc-canvas[data-style="editorial"] .doc-article-title .doc-index { margin: 0; }
.doc-canvas[data-style="editorial"] .doc-article .doc-body { padding-left: calc(4.6em + 8px); }
.doc-canvas[data-style="editorial"] .doc-article { padding-bottom: 8px; border-bottom: 1px solid var(--doc-line); }
.doc-canvas[data-style="editorial"] .doc-list li { grid-template-columns: 3em minmax(0,1fr); }
.doc-canvas[data-style="editorial"] .doc-list li > .doc-index { color: var(--doc-accent); font-size: 1.3em; font-weight: 900; }
.doc-canvas[data-style="editorial"] .doc-table th { background: transparent; color: var(--doc-muted); }
.doc-canvas[data-style="editorial"] .doc-table th,.doc-canvas[data-style="editorial"] .doc-table td { border: 0; border-bottom: 1px solid var(--doc-line); }
.doc-canvas[data-style="editorial"] .doc-footer { padding-top: 12px; border-top: 1px solid var(--doc-line); }
.doc-canvas[data-style="editorial"] .rh-emblem { display: none; }
.doc-canvas[data-style="editorial"] .rh-rule { height: 2px; }

/* D 全表格 —— 整页网格线、反白表头 */
.doc-canvas[data-style="bureau"] { --style-font: var(--font-ui); }
.doc-canvas[data-style="bureau"] .doc-page { --pad-t:52px; --pad-r:56px; --pad-b:44px; --pad-l:56px; }
.doc-canvas[data-style="bureau"] .doc-header { display: block; margin-bottom: 0; padding: 13px 14px; background: var(--doc-accent); color: var(--doc-surface); }
.doc-canvas[data-style="bureau"] .doc-header .doc-title { font-size: 1.36em; letter-spacing: .16em; text-align: left; }
.doc-canvas[data-style="bureau"] .doc-header .doc-subtitle,.doc-canvas[data-style="bureau"] .doc-header .doc-meta span { color: color-mix(in srgb,var(--doc-surface) 78%,var(--doc-accent)); margin: 4px 0 0; }
.doc-canvas[data-style="bureau"] .doc-header .doc-meta { text-align: left; }
.doc-canvas[data-style="bureau"] .doc-header .doc-meta b { font-size: .9em; }
.doc-canvas[data-style="bureau"] .doc-header-stack { text-align: center; }
.doc-canvas[data-style="bureau"] .doc-header-stack .doc-title,.doc-canvas[data-style="bureau"] .doc-header-stack .doc-subtitle,.doc-canvas[data-style="bureau"] .doc-header-stack .doc-meta-line { text-align: center; color: var(--doc-surface); }
.doc-canvas[data-style="bureau"] .doc-header-stack .doc-meta-line { margin: 8px 0 0; }
.doc-canvas[data-style="bureau"] .doc-title-sub,.doc-canvas[data-style="bureau"] .rh-title { max-width: none; margin: 0; padding: 12px 14px; border: 1px solid var(--doc-line); border-top: 0; text-align: left; font-size: 1.1em; }
.doc-canvas[data-style="bureau"] .doc-to,.doc-canvas[data-style="bureau"] .doc-lead,.doc-canvas[data-style="bureau"] .doc-section-label { margin: 0; padding: 9px 14px; border: 1px solid var(--doc-line); border-top: 0; text-indent: 0; }
.doc-canvas[data-style="bureau"] .doc-section-label { background: color-mix(in srgb,var(--doc-line) 20%,var(--doc-surface)); color: var(--doc-accent); }
.doc-canvas[data-style="bureau"] .doc-section { margin-bottom: 0; }
.doc-canvas[data-style="bureau"] .doc-body { padding: 10px 14px; border: 1px solid var(--doc-line); border-top: 0; }
.doc-canvas[data-style="bureau"] .doc-columns,.doc-canvas[data-style="bureau"] .doc-grid,.doc-canvas[data-style="bureau"] .doc-opinions { border-top: 0; }
.doc-canvas[data-style="bureau"] .doc-articles { display: block; }
.doc-canvas[data-style="bureau"] .doc-article { padding: 9px 14px; border: 1px solid var(--doc-line); border-top: 0; }
.doc-canvas[data-style="bureau"] .doc-list { gap: 0; margin: 0; }
.doc-canvas[data-style="bureau"] .doc-list li { padding: 8px 14px; border: 1px solid var(--doc-line); border-top: 0; grid-template-columns: 2.4em minmax(0,1fr); }
.doc-canvas[data-style="bureau"] .doc-tail { margin: 0; padding: 9px 14px; border: 1px solid var(--doc-line); border-top: 0; }
.doc-canvas[data-style="bureau"] .doc-table th { background: var(--doc-accent); color: var(--doc-surface); }
.doc-canvas[data-style="bureau"] .doc-signature { margin-top: 0; padding: 11px 14px; border: 1px solid var(--doc-line); border-top: 0; }
.doc-canvas[data-style="bureau"] .doc-footer { margin-top: 10px; }
.doc-canvas[data-style="bureau"] .rh-emblem { width: 56px; height: 56px; }
.doc-canvas[data-style="bureau"] .rh-record { padding-top: 12px; }
.doc-canvas[data-style="bureau"] .ap-salute,.doc-canvas[data-style="bureau"] .ap-salute-strong { padding-inline: 14px; }

/* E 敕令羊皮 —— 双层金边、符文条、首字放大、两端对齐 */
.doc-canvas[data-style="decree"] { --style-font: var(--font-serif); }
.doc-canvas[data-style="decree"] .doc-page { --pad-t:78px; --pad-r:104px; --pad-b:70px; --pad-l:104px; text-align: center; }
.doc-canvas[data-style="decree"] .doc-header { display: block; text-align: center; }
.doc-canvas[data-style="decree"] .doc-org { justify-content: center; }
.doc-canvas[data-style="decree"] .doc-meta { text-align: center; margin-top: 10px; }
.doc-canvas[data-style="decree"] .doc-title { font-size: 2.1em; font-weight: 900; letter-spacing: .12em; text-align: center; }
.doc-canvas[data-style="decree"] .doc-title-xl { color: var(--doc-accent); }
.doc-canvas[data-style="decree"] .doc-title-sub,.doc-canvas[data-style="decree"] .rh-title { margin: 22px auto 26px; max-width: 90%; }
.doc-canvas[data-style="decree"] .doc-subtitle,.doc-canvas[data-style="decree"] .doc-meta-line { text-align: center; letter-spacing: .3em; }
.doc-canvas[data-style="decree"] .doc-section,.doc-canvas[data-style="decree"] .doc-body,.doc-canvas[data-style="decree"] .doc-lead,.doc-canvas[data-style="decree"] .doc-to { text-align: justify; }
.doc-canvas[data-style="decree"] .doc-section-label { text-align: center; letter-spacing: .2em; }
.doc-canvas[data-style="decree"] .doc-columns,.doc-canvas[data-style="decree"] .doc-grid,.doc-canvas[data-style="decree"] .doc-opinions,.doc-canvas[data-style="decree"] .doc-table th,.doc-canvas[data-style="decree"] .doc-table td { border-color: var(--doc-line); }
.doc-canvas[data-style="decree"] .doc-columns { border-width: 2px; }
.doc-canvas[data-style="decree"] .doc-list { justify-items: center; }
.doc-canvas[data-style="decree"] .doc-list li { text-align: left; }
.doc-canvas[data-style="decree"] .doc-signature,.doc-canvas[data-style="decree"] .doc-sign-stack { justify-items: center; }
.doc-canvas[data-style="decree"] .doc-date,.doc-canvas[data-style="decree"] .doc-footer { text-align: center; justify-content: center; }
.doc-canvas[data-style="decree"] .rh-rule { width: 34%; height: 3px; margin: 24px auto 0; border-top: 1px solid var(--doc-line); border-bottom: 1px solid var(--doc-line); background: transparent; }
.doc-canvas[data-style="decree"] .rh-record { text-align: center; }
.doc-canvas[data-style="decree"] .doc-header-thin,.doc-canvas[data-style="decree"] .doc-footer { border-color: var(--doc-line); }

/* F 星际官署 —— 深色纸、切角色带、数据栏 */
.doc-canvas[data-style="orbital"] { --style-font: var(--font-ui); }
.doc-canvas[data-style="orbital"] .doc-page { --pad-t:76px; --pad-l:216px; --pad-r:52px; --pad-b:52px; }
.doc-canvas[data-style="orbital"] .doc-header { grid-template-columns: minmax(0,1fr); }
.doc-canvas[data-style="orbital"] .doc-header-stack,.doc-canvas[data-style="orbital"] .doc-header-stack .doc-title,.doc-canvas[data-style="orbital"] .doc-header-stack .doc-subtitle { text-align: left; }
.doc-canvas[data-style="orbital"] .doc-meta,.doc-canvas[data-style="orbital"] .doc-meta-line { display: none; }
.doc-canvas[data-style="orbital"] .doc-title { font-size: 1.9em; font-weight: 900; letter-spacing: .04em; text-align: left; line-height: 1.25; }
.doc-canvas[data-style="orbital"] .doc-title-sub,.doc-canvas[data-style="orbital"] .rh-title { max-width: none; margin: 14px 0 16px; text-align: left; font-size: 1.3em; }
.doc-canvas[data-style="orbital"] .doc-subtitle { color: var(--doc-accent); text-align: left; letter-spacing: .2em; }
.doc-canvas[data-style="orbital"] .doc-subtitle-lg { text-indent: 0; letter-spacing: .3em; font-size: 1.06em; color: var(--doc-accent); }
.doc-canvas[data-style="orbital"] .doc-to { padding-bottom: 14px; border-bottom: 1px solid var(--doc-line); font-family: var(--font-mono); font-size: .74em; letter-spacing: .12em; color: var(--doc-muted); font-weight: 400; }
.doc-canvas[data-style="orbital"] .doc-section-label { display: inline-block; margin-bottom: 10px; padding: 3px 9px; border: 1px solid var(--doc-accent); font-family: var(--font-mono); font-size: .6em; letter-spacing: .22em; }
.doc-canvas[data-style="orbital"] .doc-columns,.doc-canvas[data-style="orbital"] .doc-grid,.doc-canvas[data-style="orbital"] .doc-opinions { border-color: var(--doc-line); background: color-mix(in srgb,var(--doc-accent) 7%,transparent); }
.doc-canvas[data-style="orbital"] .doc-columns > * + *,.doc-canvas[data-style="orbital"] .doc-cell:nth-child(2n),.doc-canvas[data-style="orbital"] .doc-opinion + .doc-opinion { border-left-color: var(--doc-line); }
.doc-canvas[data-style="orbital"] .doc-cell { border-bottom-color: var(--doc-line); }
.doc-canvas[data-style="orbital"] .doc-list li > div { padding: 9px 12px; border-left: 3px solid var(--doc-accent); background: color-mix(in srgb,var(--doc-accent) 8%,transparent); }
.doc-canvas[data-style="orbital"] .doc-list li > .doc-index { color: var(--doc-accent); font-family: var(--font-mono); }
.doc-canvas[data-style="orbital"] .doc-article { padding: 10px 12px; border-left: 3px solid var(--doc-accent); background: color-mix(in srgb,var(--doc-accent) 6%,transparent); }
.doc-canvas[data-style="orbital"] .doc-table th { background: color-mix(in srgb,var(--doc-accent) 16%,transparent); color: var(--doc-accent); }
.doc-canvas[data-style="orbital"] .doc-table th,.doc-canvas[data-style="orbital"] .doc-table td { border-color: var(--doc-line); }
.doc-canvas[data-style="orbital"] .doc-sign-line i,.doc-canvas[data-style="orbital"] .doc-sign-row i { border-bottom-color: var(--doc-line); }
.doc-canvas[data-style="orbital"] .doc-footer { padding-top: 12px; border-top: 1px solid var(--doc-line); font-family: var(--font-mono); }
.doc-canvas[data-style="orbital"] .doc-opinion-box { border-color: var(--doc-line); }
.doc-canvas[data-style="orbital"] .rh-rule { height: 1px; background: var(--doc-line); }
.doc-canvas[data-style="orbital"] .rh-emblem { display: none; }
.doc-canvas[data-style="orbital"] .rh-record-rule { background: var(--doc-line); }
.doc-canvas[data-style="orbital"] .fictional-mark { border-color: var(--doc-line); }

/* H 圣典抄本 —— 边注栏 + 双栏正文 + 首字下沉 */
.doc-canvas[data-style="codex"] { --style-font: var(--font-serif); }
.doc-canvas[data-style="codex"] .doc-page { --pad-t:64px; --pad-l:214px; --pad-r:66px; --pad-b:58px; }
.doc-canvas[data-style="codex"] .doc-header { display: block; padding-bottom: 8px; border-bottom: 2px solid var(--doc-line); text-align: center; }
.doc-canvas[data-style="codex"] .doc-meta { text-align: center; margin-top: 8px; }
.doc-canvas[data-style="codex"] .doc-title { color: var(--doc-accent); font-size: 1.66em; letter-spacing: .08em; text-align: center; }
.doc-canvas[data-style="codex"] .doc-title-sub,.doc-canvas[data-style="codex"] .rh-title { max-width: none; margin: 18px 0 16px; text-align: center; }
.doc-canvas[data-style="codex"] .doc-subtitle,.doc-canvas[data-style="codex"] .doc-meta-line { text-align: center; letter-spacing: .26em; }
.doc-canvas[data-style="codex"] .doc-body,.doc-canvas[data-style="codex"] .doc-section > .doc-body { column-count: 2; column-gap: 24px; column-rule: 1px solid var(--doc-line); text-align: justify; }
.doc-canvas[data-style="codex"] .doc-article .doc-body,.doc-canvas[data-style="codex"] .doc-table p,.doc-canvas[data-style="codex"] .doc-opinion-box p { column-count: 1; }
.doc-canvas[data-style="codex"] .doc-opening { position: relative; min-height: 2.05em; padding-left: 2.25em; text-indent: 0; }
.doc-canvas[data-style="codex"] .doc-initial { position: absolute; left: 0; top: .02em; padding: .06em .16em; border: 1px solid var(--doc-line); color: var(--doc-accent); font-size: 1.5em; font-weight: 900; line-height: 1.1; }
.doc-canvas[data-style="codex"] .doc-inline-label,.doc-canvas[data-style="codex"] .doc-section-label { color: var(--doc-accent); }
.doc-canvas[data-style="codex"] .doc-lead-strong { text-align: center; }
.doc-canvas[data-style="codex"] .doc-columns,.doc-canvas[data-style="codex"] .doc-grid,.doc-canvas[data-style="codex"] .doc-opinions { border-color: var(--doc-line); }
.doc-canvas[data-style="codex"] .doc-list li > .doc-index { color: var(--doc-accent); }
.doc-canvas[data-style="codex"] .doc-footer { margin-top: 18px; padding-top: 12px; border-top: 2px solid var(--doc-line); justify-content: center; gap: 20px; }
.doc-canvas[data-style="codex"] .rh-emblem { width: 60px; height: 60px; }

/* I 密令删节 —— 反白横幅、粗黑线、噪点 */
.doc-canvas[data-style="redacted"] { --style-font: var(--font-ui); }
.doc-canvas[data-style="redacted"] .doc-page { --pad-t:74px; --pad-r:62px; --pad-b:70px; --pad-l:62px; }
.doc-canvas[data-style="redacted"] .doc-header { padding-bottom: 12px; border-bottom: 2px solid var(--doc-ink); }
.doc-canvas[data-style="redacted"] .doc-title { font-family: var(--font-mono); font-size: 1.5em; font-weight: 700; letter-spacing: .12em; text-align: left; }
.doc-canvas[data-style="redacted"] .doc-header-stack,.doc-canvas[data-style="redacted"] .doc-header-stack .doc-title,.doc-canvas[data-style="redacted"] .doc-header-stack .doc-subtitle,.doc-canvas[data-style="redacted"] .doc-header-stack .doc-meta-line { text-align: left; }
.doc-canvas[data-style="redacted"] .doc-title-sub,.doc-canvas[data-style="redacted"] .rh-title { max-width: none; margin: 18px 0 14px; text-align: left; font-family: var(--font-mono); font-size: 1.2em; }
.doc-canvas[data-style="redacted"] .doc-subtitle,.doc-canvas[data-style="redacted"] .doc-meta-line { font-family: var(--font-mono); letter-spacing: .2em; text-align: left; }
.doc-canvas[data-style="redacted"] .doc-subtitle-lg { text-indent: 0; letter-spacing: .3em; font-size: 1.05em; }
.doc-canvas[data-style="redacted"] .doc-section-label { display: inline-block; padding: 3px 10px; background: var(--doc-ink); color: var(--doc-surface); font-family: var(--font-mono); font-size: .64em; letter-spacing: .18em; }
.doc-canvas[data-style="redacted"] .doc-columns,.doc-canvas[data-style="redacted"] .doc-grid,.doc-canvas[data-style="redacted"] .doc-opinions,.doc-canvas[data-style="redacted"] .doc-table th,.doc-canvas[data-style="redacted"] .doc-table td { border-color: var(--doc-ink); }
.doc-canvas[data-style="redacted"] .doc-columns,.doc-canvas[data-style="redacted"] .doc-grid { border-width: 2px; }
.doc-canvas[data-style="redacted"] .doc-table th { background: color-mix(in srgb,var(--doc-ink) 12%,var(--doc-surface)); }
.doc-canvas[data-style="redacted"] .doc-tail { padding: 9px 12px; border: 2px solid var(--doc-accent); color: var(--doc-accent); font-family: var(--font-mono); font-size: .72em; text-indent: 0; }
.doc-canvas[data-style="redacted"] .doc-body { line-height: 1.95; }
.doc-canvas[data-style="redacted"] .doc-footer { padding-top: 10px; border-top: 2px solid var(--doc-ink); font-family: var(--font-mono); }
.doc-canvas[data-style="redacted"] .rh-emblem { display: none; }
.doc-canvas[data-style="redacted"] .rh-org { color: var(--doc-ink); font-family: var(--font-mono); letter-spacing: .18em; }

/* J 公会布告 —— 图钉、麻纸、巨标题、框块 */
.doc-canvas[data-style="guild"] { --style-font: var(--font-serif); }
.doc-canvas[data-style="guild"] .doc-page { --pad-t:58px; --pad-r:72px; --pad-b:52px; --pad-l:72px; text-align: center; }
.doc-canvas[data-style="guild"] .doc-header { display: block; padding: 5px 0 13px; border-top: 4px solid var(--doc-ink); border-bottom: 1px solid var(--doc-ink); text-align: center; }
.doc-canvas[data-style="guild"] .doc-org { justify-content: center; }
.doc-canvas[data-style="guild"] .doc-meta { text-align: center; margin-top: 6px; }
.doc-canvas[data-style="guild"] .doc-meta span { color: var(--doc-accent); letter-spacing: .3em; }
.doc-canvas[data-style="guild"] .doc-title { margin: 16px 0 4px; font-size: 2.5em; font-weight: 900; letter-spacing: .05em; line-height: 1.15; text-align: center; }
.doc-canvas[data-style="guild"] .doc-title-xl { font-size: 2.9em; }
.doc-canvas[data-style="guild"] .doc-title-sub,.doc-canvas[data-style="guild"] .rh-title { max-width: none; margin: 24px 0 18px; font-size: 1.7em; font-weight: 900; text-align: center; }
.doc-canvas[data-style="guild"] .doc-subtitle,.doc-canvas[data-style="guild"] .doc-meta-line { text-align: center; letter-spacing: .24em; font-family: inherit; font-size: .72em; }
.doc-canvas[data-style="guild"] .doc-to { text-align: center; }
.doc-canvas[data-style="guild"] .doc-section-label { display: inline-block; margin-bottom: 6px; color: var(--doc-accent); font-family: var(--font-mono); font-size: .62em; letter-spacing: .2em; }
.doc-canvas[data-style="guild"] .doc-section > .doc-body,.doc-canvas[data-style="guild"] .doc-lead,.doc-canvas[data-style="guild"] .doc-tail { padding: 10px 14px; border: 1px solid var(--doc-line); background: color-mix(in srgb,#fffdf5 42%,transparent); text-align: left; text-indent: 0; }
.doc-canvas[data-style="guild"] .doc-article { padding: 6px 12px; border: 1px solid var(--doc-line); background: color-mix(in srgb,#fffdf5 42%,transparent); text-align: left; }
.doc-canvas[data-style="guild"] .doc-list { text-align: left; }
.doc-canvas[data-style="guild"] .doc-list li > div { padding: 8px 12px; border: 1px solid var(--doc-line); background: color-mix(in srgb,#fffdf5 42%,transparent); }
.doc-canvas[data-style="guild"] .doc-list li > .doc-index { color: var(--doc-accent); }
.doc-canvas[data-style="guild"] .doc-columns,.doc-canvas[data-style="guild"] .doc-grid,.doc-canvas[data-style="guild"] .doc-opinions { border: 3px double var(--doc-ink); text-align: left; }
.doc-canvas[data-style="guild"] .doc-table th { background: color-mix(in srgb,var(--doc-line) 34%,var(--doc-surface)); }
.doc-canvas[data-style="guild"] .doc-signature,.doc-canvas[data-style="guild"] .doc-sign-stack { justify-items: center; text-align: left; }
.doc-canvas[data-style="guild"] .doc-date,.doc-canvas[data-style="guild"] .doc-footer { justify-content: center; text-align: center; }
.doc-canvas[data-style="guild"] .rh-record { text-align: center; }
.doc-canvas[data-style="guild"] .ap-salute,.doc-canvas[data-style="guild"] .ap-salute-strong { text-align: center; text-indent: 0; }

/* ================= 贴纸图层 ================= */
.sticker-layer { position: absolute; inset: 0; z-index: 20; overflow: hidden; pointer-events: none; }
.canvas-sticker { --x:50%; --y:20%; --w:160px; --h:54px; --r:0deg; position: absolute; left: var(--x); top: var(--y); width: var(--w); height: var(--h); transform: translate(-50%,-50%) rotate(var(--r)); pointer-events: auto; touch-action: none; cursor: move; }
.canvas-sticker.is-hidden { display: none; }
.sticker-body { width: 100%; height: 100%; display: flex; align-items: center; justify-content: center; overflow: hidden; white-space: pre-wrap; overflow-wrap: anywhere; }
.sticker-font-sans { font-family: var(--font-ui); }
.sticker-font-serif { font-family: var(--font-serif); }
.image-sticker .sticker-body img { width: 100%; height: 100%; object-fit: contain; }
.image-sticker .sticker-body.fit-cover img { object-fit: cover; }
.image-sticker .sticker-body.fit-stretch img { object-fit: fill; }
.canvas-sticker.is-selected:not(.is-locked) { outline: 3px solid var(--ui-accent); outline-offset: 3px; }
.sticker-handle { position: absolute; z-index: 3; width: 24px; height: 24px; border: 3px solid #fff; border-radius: 50%; background: var(--ui-accent); box-shadow: 0 0 0 1px #33291f; }
.resize-handle { right: -14px; bottom: -14px; cursor: nwse-resize; }
.rotate-handle { left: 50%; top: -42px; transform: translateX(-50%); cursor: grab; }
.rotate-handle::after { content: ""; position: absolute; left: 10px; top: 22px; width: 2px; height: 18px; background: var(--ui-accent); }
.canvas-sticker:not(.is-selected) .sticker-handle,.canvas-sticker.is-locked .sticker-handle,.doc-canvas.is-exporting .sticker-handle { display: none; }
.doc-canvas.is-exporting .canvas-sticker { outline: 0 !important; }

/* ================= 教程 / 提示 ================= */
.mobile-resizer,.mobile-main-tabs { display: none; }
.tour-overlay { position: fixed; inset: 0; z-index: 100; display: grid; place-items: center; }
.tour-overlay[hidden] { display: none !important; }
.tour-blocker { position: absolute; inset: 0; border: 0; background: rgba(38,34,29,.72); }
.tour-card { position: relative; width: min(380px,calc(100vw - 24px)); padding: 20px; border-radius: 9px; background: #fff; }
.tour-card header,.tour-card footer { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.tour-card header span { color: var(--ui-accent); font-size: 12px; font-weight: 850; }
.tour-card header > button { width: 38px; height: 38px; border: 1px solid var(--ui-line); border-radius: 5px; background: #fff; cursor: pointer; font-size: 22px; }
.tour-card h2 { margin: 18px 0 0; font-family: var(--font-serif); font-size: 20px; }
.tour-card p { margin: 8px 0 20px; color: var(--ui-muted); font-size: 13px; line-height: 1.65; }
.tour-card footer { justify-content: flex-end; }
.toast { position: fixed; left: 50%; bottom: 24px; z-index: 140; max-width: calc(100vw - 32px); padding: 10px 14px; border-radius: 6px; background: var(--ui-accent-dark); color: #fff; font-size: 13px; opacity: 0; pointer-events: none; transform: translate(-50%,16px); transition: .16s ease; }
.toast.show { opacity: 1; transform: translate(-50%,0); }

@media (max-width:1280px) {
  .workspace { grid-template-columns:316px minmax(390px,1fr) 336px; }
  .brand { min-width:194px; }
  .brand-copy small { display:none; }
  .top-actions { gap:4px; }
  .button { padding-inline:10px; }
}
@media (max-width:900px) {
  :root { --topbar-height:62px; }
  .topbar { gap:8px; padding:0 10px; }
  .brand { min-width:44px; }
  .brand-copy,.project-field,.desktop-action { display:none; }
  .brand-mark { width:40px; height:40px; }
  .top-actions { width:calc(100% - 50px); justify-content:flex-end; gap:6px; }
  .top-actions .button { min-height:40px; padding:0 12px; }
  .workspace { --mobile-preview-height:42%; height:auto; min-height:0; grid-template-columns:1fr; grid-template-rows:var(--mobile-preview-height) 20px 48px minmax(0,1fr); grid-template-areas:"preview" "resizer" "tabs" "panel"; }
  .preview-panel { grid-area:preview; grid-template-rows:42px minmax(0,1fr); border-bottom:0; }
  .preview-toolbar { padding:0 8px; }
  .preview-viewport { overflow:auto; }
  .preview-stage { margin:0 auto; }
  .mobile-resizer { grid-area:resizer; display:grid; place-items:center; border-top:1px solid var(--ui-line); border-bottom:1px solid var(--ui-line); background:#f1f0ec; cursor:row-resize; touch-action:none; user-select:none; z-index:12; }
  .mobile-resizer span { width:112px; height:5px; border-radius:4px; background:var(--ui-line-strong); pointer-events:none; }
  .mobile-main-tabs { grid-area:tabs; display:grid; grid-template-columns:1fr 1fr; border-top:1px solid var(--ui-line); border-bottom:1px solid var(--ui-line); background:#f7f6f3; z-index:14; }
  .mobile-main-tabs button { border:0; border-right:1px solid var(--ui-line); background:transparent; font-size:13px; font-weight:850; }
  .mobile-main-tabs button:last-child { border-right:0; }
  .mobile-main-tabs button.active { background:var(--ui-accent-soft); box-shadow:inset 0 -3px var(--ui-accent); }
  .editor-panel { grid-area:panel; min-height:0; border:0; display:grid; grid-template-rows:minmax(0,1fr); }
  .panel-heading { display:none; }
  .panel-scroll { padding:12px 10px calc(20px + env(safe-area-inset-bottom)); scrollbar-gutter:auto; }
  body[data-active-mobile-panel="content"] .style-panel,body[data-active-mobile-panel="style"] .content-panel { display:none; }
  .editor-card { padding:13px; }
  .field input,.field textarea,.field select { min-height:42px; }
  .sticker-handle { width:36px; height:36px; }
  .resize-handle { right:-20px; bottom:-20px; }
  .rotate-handle { top:-52px; }
  .rotate-handle::after { left:15px; top:33px; }
  .toast { bottom:calc(20px + env(safe-area-inset-bottom)); }
}
@media (max-width:520px) {
  .top-actions .button { padding-inline:9px; font-size:12px; }
  .field-grid { grid-template-columns:1fr; gap:0; }
  .color-grid { grid-template-columns:1fr; }
  .preset-sticker-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .style-grid { grid-template-columns:1fr; }
  .style-button { grid-template-columns:30px minmax(0,1fr); }
  .sticker-editor-actions { grid-template-columns:repeat(2,1fr); }
  .export-grid { grid-template-columns:1fr; }
}
@media (prefers-reduced-motion:reduce) { *,*::before,*::after { transition-duration:.01s !important; animation-duration:.01s !important; scroll-behavior:auto !important; } }
