/* =====================================================================
 * N14 / 17 · 中式英语纠错 —— 独立皮肤「批注稿纸」
 * 上下分区的批改台（不是左右 hero 网格）；朱红删除线 + 蓝墨改写，稿纸横线底纹。
 * 主题：只消费公共导航写入的 <html data-theme>，不自建开关。
 * ===================================================================== */

.ce-page {
    --nx-bg:        #fcfaf6;
    --nx-bg-2:      #f5f1e9;
    --nx-surface:   #fffefb;
    --nx-surface-2: #f8f5ee;
    --nx-surface-3: #efe9dc;
    --nx-ink:       #26221b;
    --nx-ink-2:     #5c5549;
    --nx-ink-3:     #958b7a;
    --nx-line:      #e6dfd1;
    --nx-line-2:    #f0ebdf;
    --nx-a:         #b8332a;
    --nx-b:         #244a86;
    --nx-tint:      #fbebe8;
    --nx-deep:      #96271f;
    --ce-blue-ink:  #244a86;
    --tsk-card: #fffefb; --tsk-line: #e6dfd1; --tsk-faint: #958b7a; --tsk-sub: #5c5549; --tsk-ink: #26221b;
    background-image: repeating-linear-gradient(0deg, transparent 0 31px, rgba(36, 74, 134, .035) 31px 32px);
}
:root[data-theme="dark"] .ce-page {
    --nx-bg:        #101419;
    --nx-bg-2:      #151c24;
    --nx-surface:   #1a222c;
    --nx-surface-2: #212b37;
    --nx-surface-3: #2a3644;
    --nx-ink:       #f2ede5;
    --nx-ink-2:     #b7b0a4;
    --nx-ink-3:     #8c8579;
    --nx-line:      #303c4b;
    --nx-line-2:    #26313e;
    --nx-a:         #ef8b80;
    --nx-b:         #8fb4f0;
    --nx-tint:      rgba(239, 139, 128, .14);
    --nx-deep:      #f2a79e;
    --ce-blue-ink:  #8fb4f0;
    --tsk-card: #1a222c; --tsk-line: #303c4b; --tsk-faint: #8c8579; --tsk-sub: #b7b0a4; --tsk-ink: #f2ede5;
    background-image: repeating-linear-gradient(0deg, transparent 0 31px, rgba(143, 180, 240, .035) 31px 32px);
}

.ce-hero { padding-bottom: 22px; }
.ce-headline { max-width: 100%; }
.ce-headline h1 em { color: var(--nx-a); }
.ce-caveat { margin-top: 16px; max-width: 72ch; }

/* 批改台：标题通栏，下面左右双栏对照 */
.ce-desk { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 16px; margin-top: 26px; }
.ce-editor { border-top: 3px solid var(--nx-a); }
.ce-result { border-top: 3px solid var(--ce-blue-ink); }
.ce-input { min-height: 186px; font-family: var(--nx-sans); font-size: var(--tx-4); line-height: 1.9; }
.ce-toolbar { margin-top: 14px; }
.ce-actions { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 13px; }
.ce-actions .n14-btn--primary { background: var(--nx-a); border-color: var(--nx-a); }

.ce-compare { min-height: 186px; max-height: 320px; overflow: auto; background: var(--nx-surface-2); border: 1px dashed var(--nx-line); border-radius: 10px; padding: 14px 16px; }
.ce-compare__cap { font-family: var(--nx-mono); font-size: 11px; letter-spacing: .12em; text-transform: uppercase; color: var(--nx-ink-3); margin-bottom: 7px; }
.ce-compare__txt { font-size: 15px; line-height: 2; color: var(--nx-ink); margin-bottom: 14px; white-space: pre-wrap; word-break: break-word; }
.ce-compare__txt:last-child { margin-bottom: 0; }
.ce-compare__fix { color: var(--ce-blue-ink); }
.ce-del { color: var(--nx-a); text-decoration: line-through; text-decoration-thickness: 2px; background: var(--nx-tint); padding: 0 2px; border-radius: 3px; }
.ce-ins { color: var(--ce-blue-ink); text-decoration: none; font-weight: 750; border-bottom: 2px solid var(--ce-blue-ink); }
.ce-airow { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; margin-top: 14px; padding-top: 13px; border-top: 1px dashed var(--nx-line); }
.ce-airow .n14-small { flex: 1 1 200px; }
.ce-airow .n14-btn--accent { background: var(--ce-blue-ink); border-color: var(--ce-blue-ink); }

/* 命中条目 */
.ce-hits { display: grid; gap: 10px; }
.ce-hit { display: grid; grid-template-columns: 34px 1fr; gap: 12px; background: var(--nx-surface); border: 1px solid var(--nx-line); border-left: 3px solid var(--nx-a); border-radius: 12px; padding: 13px 16px; }
.ce-hit__no { font-family: var(--nx-mono); font-size: 12px; color: var(--nx-ink-3); padding-top: 2px; }
.ce-hit__pair { display: flex; flex-wrap: wrap; align-items: baseline; gap: 9px; margin-bottom: 7px; }
.ce-hit__from { font-family: var(--nx-mono); font-size: 13px; color: var(--nx-a); text-decoration: line-through; }
.ce-hit__arrow { color: var(--nx-ink-3); }
.ce-hit__to { font-family: var(--nx-mono); font-size: 13px; color: var(--ce-blue-ink); font-weight: 700; }
.ce-hit__why { font-size: 13px; line-height: 1.75; color: var(--nx-ink-2); }
.ce-hit__meta { display: flex; flex-wrap: wrap; gap: 7px; margin-top: 8px; }

.ce-split { align-items: start; }
.ce-escbtns { margin-top: 0; }
.ce-batchwrap, .ce-rulewrap { max-height: 420px; overflow: auto; margin-top: 16px; }
.ce-search { max-width: 340px; }
.ce-note { margin-top: 14px; }
.ce-page .n14-msg { margin-top: 12px; }

@media (max-width: 980px) {
    .ce-desk { grid-template-columns: 1fr; }
}
@media (max-width: 640px) {
    .ce-search { max-width: 100%; }
    .ce-hit { grid-template-columns: 1fr; }
}
