/* 英文字帖生成器 - 暖橙咖啡主题，对齐中文字帖 zitie.css 风格
   关键修复：原 .ez-page 同时被用于"外层页面"和"A4 纸"两种结构，造成 CSS 规则冲突。
   现在外层用 .english-zitie-page，A4 纸保留 .ez-page，所有其它选择器都 scope 在外层下。 */

.english-zitie-page {
    --ez-bg: #FBF7F0;
    --ez-surface: #FFFFFF;
    --ez-primary: #B45309;
    --ez-primary-hover: #92400E;
    --ez-accent: #EA580C;
    --ez-yellow: #FEF3C7;
    --ez-warm: #FED7AA;
    --ez-border: #E0DAC9;
    --ez-text: #2A2520;
    --ez-text-2: #57534E;
    --ez-text-3: #857F75;
    --ez-red: #c0392b;

    max-width: 1340px;
    margin: 0 auto;
    padding: 18px 16px 60px;
    background: var(--ez-bg);
    color: var(--ez-text);
    font-family: -apple-system, BlinkMacSystemFont, "PingFang SC", "HarmonyOS Sans SC", system-ui, sans-serif;
}

/* === 面包屑 === */
.english-zitie-page .ez-breadcrumb { font-size: 13px; color: var(--ez-text-3); margin-bottom: 12px; }
.english-zitie-page .ez-breadcrumb a { color: var(--ez-text-2); text-decoration: none; }
.english-zitie-page .ez-breadcrumb a:hover { color: var(--ez-primary); }
.english-zitie-page .ez-breadcrumb .ez-sep { margin: 0 8px; color: var(--ez-text-3); }

/* === Hero === */
.english-zitie-page .ez-hero {
    background: var(--ez-surface);
    border: 1px solid rgba(180,83,9,0.10);
    border-radius: 22px;
    padding: 32px 28px;
    margin-bottom: 22px;
    text-align: center;
    box-shadow: 0 2px 0 rgba(180,83,9,0.08);
}
.english-zitie-page .ez-hero-badge {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 5px 12px;
    background: var(--ez-yellow);
    color: #92400E;
    border: 1px solid #FCD34D;
    border-radius: 999px;
    font-size: 12px;
    font-weight: 600;
    margin-bottom: 12px;
}
.english-zitie-page .ez-hero-badge .dot {
    width: 6px; height: 6px;
    background: var(--ez-primary);
    border-radius: 50%;
    animation: ezPulse 1.8s ease-in-out infinite;
}
@keyframes ezPulse {
    0%, 100% { opacity: 1; transform: scale(1); }
    50% { opacity: 0.4; transform: scale(1.5); }
}
.english-zitie-page .ez-hero-title {
    font-size: 28px;
    font-weight: 700;
    margin: 0 0 8px;
    color: var(--ez-text);
    font-family: "PingFang SC", "Songti SC", serif;
}
.english-zitie-page .ez-hero-sub {
    font-size: 14px;
    color: var(--ez-text-2);
    margin: 0;
    line-height: 1.6;
}

/* === 双栏 === */
.english-zitie-page .ez-app {
    display: grid;
    grid-template-columns: 320px 1fr;
    gap: 20px;
    align-items: start;
}

/* === 左侧输入面板 === */
.english-zitie-page .ez-panel {
    background: var(--ez-surface);
    border: 1px solid var(--ez-border);
    border-radius: 18px;
    padding: 20px 18px;
    box-shadow: 0 2px 0 rgba(180,83,9,0.06);
    position: sticky;
    top: 20px;
}
.english-zitie-page .ez-field { margin-bottom: 16px; }
.english-zitie-page .ez-field-row { display: flex; gap: 12px; }
.english-zitie-page .ez-half { flex: 1; }
.english-zitie-page .ez-label {
    display: block;
    font-size: 12px;
    color: var(--ez-text-2);
    font-weight: 600;
    margin-bottom: 6px;
}
.english-zitie-page .ez-hint-inline {
    font-weight: 400;
    color: var(--ez-text-3);
    font-size: 11px;
}
.english-zitie-page .ez-textarea,
.english-zitie-page .ez-input {
    width: 100%;
    padding: 8px 10px;
    border: 1px solid var(--ez-border);
    border-radius: 8px;
    font-size: 14px;
    color: var(--ez-text);
    background: #FDFBF6;
    box-sizing: border-box;
    font-family: inherit;
    transition: border-color 0.15s, box-shadow 0.15s;
}
.english-zitie-page .ez-textarea:focus,
.english-zitie-page .ez-input:focus {
    outline: none;
    border-color: var(--ez-accent);
    box-shadow: 0 0 0 3px rgba(234,88,12,0.12);
}
.english-zitie-page .ez-textarea {
    resize: vertical;
    min-height: 80px;
    line-height: 1.5;
}

/* === 选项胶囊 === */
.english-zitie-page .ez-options { display: flex; flex-wrap: wrap; gap: 6px; }
.english-zitie-page .ez-opt {
    flex: 1 1 auto;
    min-width: 60px;
    position: relative;
    cursor: pointer;
    user-select: none;
}
.english-zitie-page .ez-opt input { position: absolute; opacity: 0; pointer-events: none; }
.english-zitie-page .ez-opt span {
    display: block;
    padding: 6px 4px;
    text-align: center;
    font-size: 12px;
    border: 1px solid var(--ez-border);
    border-radius: 8px;
    background: #F5EFE3;
    color: var(--ez-text-2);
    transition: all 0.15s;
}
.english-zitie-page .ez-opt input:checked + span {
    background: linear-gradient(135deg, var(--ez-accent), var(--ez-primary));
    color: #fff;
    border-color: var(--ez-primary);
    font-weight: 600;
    box-shadow: 0 2px 6px rgba(234,88,12,0.20);
}
/* 字体选项卡显示字体本身预览 */
.english-zitie-page .ez-opt .ez-font-patrickhand { font-family: 'Patrick Hand', cursive; font-size: 14px; }
.english-zitie-page .ez-opt .ez-font-caveat      { font-family: 'Caveat', cursive; font-size: 15px; font-weight: 600; }
.english-zitie-page .ez-opt .ez-font-dancing     { font-family: 'Dancing Script', cursive; font-size: 14px; font-weight: 600; }

/* === 进阶设置 === */
.english-zitie-page .ez-advanced {
    margin-top: 12px;
    border: 1px solid var(--ez-border);
    border-radius: 10px;
    background: #FDFBF6;
}
.english-zitie-page .ez-advanced summary {
    padding: 9px 12px;
    cursor: pointer;
    font-size: 13px;
    color: var(--ez-text-2);
    user-select: none;
    list-style: none;
}
.english-zitie-page .ez-advanced summary::-webkit-details-marker { display: none; }
.english-zitie-page .ez-advanced summary::after { content: " ▾"; font-size: 10px; opacity: 0.6; }
.english-zitie-page .ez-advanced[open] summary::after { content: " ▴"; }
.english-zitie-page .ez-advanced-body {
    padding: 8px 12px 12px;
    border-top: 1px solid var(--ez-border);
    font-size: 12px;
    color: var(--ez-text-3);
}

/* === 按钮 === */
.english-zitie-page .ez-actions {
    margin-top: 18px;
    display: flex;
    flex-direction: column;
    gap: 8px;
}
.english-zitie-page .ez-btn {
    width: 100%;
    padding: 10px 14px;
    border: none;
    border-radius: 10px;
    font-size: 14px;
    font-weight: 600;
    cursor: pointer;
    transition: all 0.15s;
    font-family: inherit;
}
.english-zitie-page .ez-btn-primary {
    background: linear-gradient(135deg, var(--ez-accent), var(--ez-primary));
    color: #fff;
    box-shadow: 0 4px 10px rgba(234,88,12,0.25);
}
.english-zitie-page .ez-btn-primary:hover {
    transform: translateY(-1px);
    box-shadow: 0 6px 14px rgba(234,88,12,0.35);
}
.english-zitie-page .ez-btn-secondary {
    background: var(--ez-yellow);
    color: var(--ez-primary);
    border: 1px solid #FCD34D;
}
.english-zitie-page .ez-btn-secondary:hover { background: var(--ez-warm); }
.english-zitie-page .ez-tip {
    font-size: 12px;
    color: var(--ez-text-3);
    text-align: center;
    margin-top: 12px;
    line-height: 1.5;
}

/* === 右侧预览容器 === */
.english-zitie-page .ez-preview-wrap {
    background: var(--ez-surface);
    border: 1px solid var(--ez-border);
    border-radius: 18px;
    padding: 16px;
    min-height: 600px;
}
.english-zitie-page .ez-preview-toolbar {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 0 4px 12px;
    border-bottom: 1px solid var(--ez-border);
    margin-bottom: 16px;
}
.english-zitie-page .ez-preview-title { font-size: 14px; font-weight: 600; color: var(--ez-text-2); }
.english-zitie-page .ez-preview-meta { font-size: 12px; color: var(--ez-text-3); }
.english-zitie-page .ez-preview { padding: 0; }
.english-zitie-page .ez-empty {
    padding: 80px 20px;
    text-align: center;
    color: var(--ez-text-3);
    font-size: 14px;
}

/* === A4 页面容器（JS 渲染） === */
.english-zitie-page .ez-pages {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 16px;
    padding: 8px 0;
    overflow-x: auto;
}
.english-zitie-page .ez-page {
    width: 210mm;
    min-height: 297mm;
    padding: 14mm 18mm;
    background: #fff;
    color: #1a1a1a;
    box-sizing: border-box;
    border: 1px solid #e6e6e6;
    border-radius: 2px;
    position: relative;
    flex-shrink: 0;
    display: flex;
    flex-direction: column;
}

/* 试卷头：班级 / 姓名 / 学号 三栏，与 zitie 模板一致 */
.english-zitie-page .ez-page-header {
    display: flex;
    align-items: baseline;
    gap: 8mm;
    margin: 0 0 6mm;
    font-size: 12pt;
    font-weight: 700;
    color: #000;
    font-family: "PingFang SC", "Songti SC", serif;
}
.english-zitie-page .ez-page-header-item {
    flex: 1;
    display: inline-flex;
    align-items: baseline;
    gap: 2mm;
    white-space: nowrap;
    color: #000;
}
.english-zitie-page .ez-page-header-line {
    flex: 1;
    align-self: end;
    height: 0;
    border-bottom: 0.3mm solid #000;
    margin-bottom: 0.5mm;
}

/* === 每行：四线背景 + 字母内容叠加（标准小学英语本规格：四线组 10mm + 行间距 6mm） === */
.english-zitie-page .ez-line {
    position: relative;
    height: 10mm;
    margin-bottom: 6mm;
    page-break-inside: avoid;
}
.english-zitie-page .ez-fourlines {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
}
.english-zitie-page .ez-line-content {
    position: absolute;
    inset: 0;
    display: flex;
    /* 字母基线对准线 3（自顶 2/3 ≈ 6.7mm），大写字母占上两格、小写 x-height 落中格、降部入下格 */
    align-items: flex-end;
    /* space-between：N 份 token 在整行内均匀分布（首份贴左、末份贴右），间距随宽度自动调节 */
    justify-content: space-between;
    padding: 0 2mm 1.7mm;
    line-height: 1;
    font-size: var(--ez-font, 8.5mm);
}
/* 单 token 时 space-between 表现为左对齐，改为 space-around 让它居中 */
.english-zitie-page .ez-line-content:has(.ez-token:only-child) {
    justify-content: center;
}
.english-zitie-page .ez-token {
    display: inline-block;
    white-space: nowrap;
}

/* === 字色 === */
.english-zitie-page .ez-color-solid     .ez-token { color: #1a1a1a; }
.english-zitie-page .ez-color-redtrace  .ez-token { color: #f5b8b8; }
.english-zitie-page .ez-color-graytrace .ez-token { color: #d0d0d0; }
.english-zitie-page .ez-color-blank     .ez-token { display: none; }

/* === 字体 === */
.english-zitie-page .ez-font-patrickhand .ez-token { font-family: 'Patrick Hand', cursive; }
.english-zitie-page .ez-font-caveat      .ez-token { font-family: 'Caveat', cursive; }
.english-zitie-page .ez-font-dancing     .ez-token { font-family: 'Dancing Script', cursive; }
.english-zitie-page .ez-font-system      .ez-token { font-family: 'Arial', 'Helvetica', sans-serif; }

.english-zitie-page .ez-page-footer {
    margin-top: auto;
    text-align: center;
    font-size: 8pt;
    color: #aaa;
    padding-top: 4mm;
}

/* === SEO 长尾正文 === */
.english-zitie-page .ez-article {
    background: var(--ez-surface);
    border: 1px solid var(--ez-border);
    border-radius: 18px;
    padding: 28px 32px;
    margin-top: 22px;
    line-height: 1.8;
    color: var(--ez-text-2);
}
.english-zitie-page .ez-article h2 {
    font-size: 18px;
    font-weight: 700;
    color: var(--ez-text);
    margin: 24px 0 10px;
    padding-left: 10px;
    border-left: 4px solid var(--ez-primary);
}
.english-zitie-page .ez-article h2:first-child { margin-top: 0; }
.english-zitie-page .ez-article h3 {
    font-size: 15px;
    font-weight: 600;
    color: var(--ez-text);
    margin: 16px 0 6px;
}
.english-zitie-page .ez-article p { margin: 8px 0; font-size: 14px; }
.english-zitie-page .ez-article ul { padding-left: 22px; font-size: 14px; }
.english-zitie-page .ez-article ul li { margin: 4px 0; }
.english-zitie-page .ez-article strong { color: var(--ez-primary); }
.english-zitie-page .ez-presets {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    padding-left: 0 !important;
    list-style: none;
}
.english-zitie-page .ez-presets li {
    background: var(--ez-yellow);
    border: 1px solid #FCD34D;
    border-radius: 999px;
    padding: 4px 14px;
}
.english-zitie-page .ez-presets a {
    color: var(--ez-primary);
    text-decoration: none;
    font-weight: 600;
    font-size: 13px;
}
.english-zitie-page .ez-presets a:hover { color: var(--ez-primary-hover); }

/* === 响应式 === */
@media (max-width: 1024px) {
    .english-zitie-page .ez-app { grid-template-columns: 1fr; }
    .english-zitie-page .ez-panel { position: static; }
}
@media (max-width: 768px) {
    .english-zitie-page { padding: 14px 12px 50px; }
    .english-zitie-page .ez-hero { padding: 24px 18px; border-radius: 18px; }
    .english-zitie-page .ez-hero-title { font-size: 22px; }
    .english-zitie-page .ez-hero-sub { font-size: 13px; }
    .english-zitie-page .ez-article { padding: 20px 18px; }
    /* A4 物理尺寸不变，外层允许横滚 */
    .english-zitie-page .ez-pages { align-items: flex-start; padding: 8px; }
    .english-zitie-page .ez-line { height: 8mm; margin-bottom: 5mm; }
    .english-zitie-page .ez-line-content { font-size: 7mm; padding-bottom: 1.3mm; }
}

/* ================================================
   🌙 暗色模式适配（沿用站点暖咖啡色板）
   预览 A4 纸保持白底，工具页其余区域走深咖啡
   ================================================ */
[data-theme="dark"] .english-zitie-page {
    --ez-bg: transparent;
    --ez-surface: #221C17;
    --ez-primary: #E6A82E;
    --ez-primary-hover: #FCD34D;
    --ez-accent: #E5874F;
    --ez-yellow: #3C2F25;
    --ez-warm: #4A3A2C;
    --ez-border: #4A3A2C;
    --ez-text: #E8DCC5;
    --ez-text-2: #B5A795;
    --ez-text-3: #7D7263;
}

[data-theme="dark"] .english-zitie-page .ez-hero,
[data-theme="dark"] .english-zitie-page .ez-panel,
[data-theme="dark"] .english-zitie-page .ez-preview-wrap,
[data-theme="dark"] .english-zitie-page .ez-article {
    background: #221C17;
    border-color: #4A3A2C;
    box-shadow: 0 1px 0 rgba(255,255,255,0.04) inset, 0 8px 24px rgba(0,0,0,0.35);
}
[data-theme="dark"] .english-zitie-page .ez-hero-title { color: #E8DCC5; }
[data-theme="dark"] .english-zitie-page .ez-hero-sub { color: #B5A795; }
[data-theme="dark"] .english-zitie-page .ez-hero-badge {
    background: #3C2F25;
    color: #E6A82E;
    border-color: #5C4838;
}
[data-theme="dark"] .english-zitie-page .ez-hero-badge .dot { background: #E6A82E; }

[data-theme="dark"] .english-zitie-page .ez-breadcrumb { color: #7D7263; }
[data-theme="dark"] .english-zitie-page .ez-breadcrumb a { color: #B5A795; }
[data-theme="dark"] .english-zitie-page .ez-breadcrumb a:hover { color: #E6A82E; }

[data-theme="dark"] .english-zitie-page .ez-label { color: #B5A795; }
[data-theme="dark"] .english-zitie-page .ez-hint-inline { color: #7D7263; }
[data-theme="dark"] .english-zitie-page .ez-textarea,
[data-theme="dark"] .english-zitie-page .ez-input {
    background: #2A211B;
    border-color: #4A3A2C;
    color: #E8DCC5;
}
[data-theme="dark"] .english-zitie-page .ez-textarea::placeholder,
[data-theme="dark"] .english-zitie-page .ez-input::placeholder { color: #7D7263; }
[data-theme="dark"] .english-zitie-page .ez-textarea:focus,
[data-theme="dark"] .english-zitie-page .ez-input:focus {
    border-color: #E5874F;
    box-shadow: 0 0 0 3px rgba(251,146,60,0.18);
}

[data-theme="dark"] .english-zitie-page .ez-opt span {
    background: #2A211B;
    border-color: #4A3A2C;
    color: #B5A795;
}
[data-theme="dark"] .english-zitie-page .ez-opt input:checked + span {
    background: linear-gradient(135deg, #B45309, #92400E);
    color: #FEF3C7;
    border-color: #92400E;
    box-shadow: 0 2px 6px rgba(0,0,0,0.45);
}

[data-theme="dark"] .english-zitie-page .ez-advanced {
    background: #2A211B;
    border-color: #4A3A2C;
}
[data-theme="dark"] .english-zitie-page .ez-advanced summary { color: #B5A795; }
[data-theme="dark"] .english-zitie-page .ez-advanced-body {
    color: #7D7263;
    border-top-color: #4A3A2C;
}

[data-theme="dark"] .english-zitie-page .ez-btn-primary {
    background: linear-gradient(135deg, #B45309, #92400E);
    color: #FEF3C7;
    box-shadow: 0 4px 10px rgba(0,0,0,0.45);
}
[data-theme="dark"] .english-zitie-page .ez-btn-primary:hover {
    box-shadow: 0 6px 14px rgba(180,83,9,0.55);
}
[data-theme="dark"] .english-zitie-page .ez-btn-secondary {
    background: #3C2F25;
    color: #E6A82E;
    border-color: #5C4838;
}
[data-theme="dark"] .english-zitie-page .ez-btn-secondary:hover {
    background: #4A3A2C;
    color: #FCD34D;
}
[data-theme="dark"] .english-zitie-page .ez-tip { color: #7D7263; }

[data-theme="dark"] .english-zitie-page .ez-preview-toolbar { border-bottom-color: #4A3A2C; }
[data-theme="dark"] .english-zitie-page .ez-preview-title { color: #B5A795; }
[data-theme="dark"] .english-zitie-page .ez-preview-meta { color: #7D7263; }
[data-theme="dark"] .english-zitie-page .ez-empty { color: #7D7263; }

/* 暗色下：预览容器透明，每张 A4 自带白纸 */
[data-theme="dark"] .english-zitie-page .ez-preview { background: transparent; }
/* 用户要求：A4 预览纸张本身夜间也按白天模式渲染 */
[data-theme="dark"] .english-zitie-page .ez-page {
    background: #fff;
    color: #1a1a1a;
    border-color: #e6e6e6;
    box-shadow: none;
}
/* 反制全站 [data-theme="dark"] span / h2 等规则把页内文字变浅 */
[data-theme="dark"] .english-zitie-page .ez-page,
[data-theme="dark"] .english-zitie-page .ez-page-header,
[data-theme="dark"] .english-zitie-page .ez-page-header-item,
[data-theme="dark"] .english-zitie-page .ez-article-title-preview {
    color: #000;
}
[data-theme="dark"] .english-zitie-page .ez-page-footer { color: #aaa; }

[data-theme="dark"] .english-zitie-page .ez-article { color: #B5A795; }
[data-theme="dark"] .english-zitie-page .ez-article h2 {
    color: #E8DCC5;
    border-left-color: #E6A82E;
}
[data-theme="dark"] .english-zitie-page .ez-article h3 { color: #E8DCC5; }
[data-theme="dark"] .english-zitie-page .ez-article strong { color: #E6A82E; }
[data-theme="dark"] .english-zitie-page .ez-presets li {
    background: #3C2F25;
    border-color: #5C4838;
}
[data-theme="dark"] .english-zitie-page .ez-presets a { color: #E6A82E; }
[data-theme="dark"] .english-zitie-page .ez-presets a:hover { color: #FCD34D; }

/* ================================================
   用户要求：工具箱"实时预览"与"说明"区在夜间也按白天模式渲染
   显式覆盖每一个可能被全站 p/span/li/h2/strong 染色的子元素
   ================================================ */
[data-theme="dark"] .english-zitie-page .ez-preview-wrap,
[data-theme="dark"] .english-zitie-page .ez-article {
    background: #FFFFFF !important;
    border-color: #E0DAC9 !important;
    color: #2A2520 !important;
    box-shadow: 0 2px 0 rgba(180,83,9,0.06) !important;
}
[data-theme="dark"] .english-zitie-page .ez-preview-toolbar { border-bottom-color: #E0DAC9 !important; }
[data-theme="dark"] .english-zitie-page .ez-preview-title { color: #1a1a1a !important; }
[data-theme="dark"] .english-zitie-page .ez-preview-meta { color: #555 !important; }
[data-theme="dark"] .english-zitie-page .ez-empty { color: #666 !important; }
[data-theme="dark"] .english-zitie-page .ez-article,
[data-theme="dark"] .english-zitie-page .ez-article p,
[data-theme="dark"] .english-zitie-page .ez-article ul,
[data-theme="dark"] .english-zitie-page .ez-article ul li,
[data-theme="dark"] .english-zitie-page .ez-article li { color: #1a1a1a !important; }
[data-theme="dark"] .english-zitie-page .ez-article h2 { color: #000 !important; border-left-color: #B45309 !important; }
[data-theme="dark"] .english-zitie-page .ez-article h3,
[data-theme="dark"] .english-zitie-page .ez-article h4 { color: #000 !important; }
[data-theme="dark"] .english-zitie-page .ez-article strong,
[data-theme="dark"] .english-zitie-page .ez-article b { color: #B45309 !important; }
[data-theme="dark"] .english-zitie-page .ez-article span { color: inherit !important; }
[data-theme="dark"] .english-zitie-page .ez-presets li { background: #FEF3C7 !important; border-color: #FCD34D !important; color: #B45309 !important; }
[data-theme="dark"] .english-zitie-page .ez-presets a { color: #B45309 !important; }
[data-theme="dark"] .english-zitie-page .ez-presets a:hover { color: #92400E !important; }

/* === 打印 === */
@media print {
    @page { size: A4 portrait; margin: 0; }
    body * { visibility: hidden; }
    .english-zitie-page .ez-pages,
    .english-zitie-page .ez-pages * { visibility: visible; }
    .english-zitie-page .ez-pages {
        position: absolute;
        left: 0; top: 0;
        width: 100%;
        gap: 0 !important;
        padding: 0 !important;
        overflow: visible !important;
    }
    .english-zitie-page .ez-page {
        width: 210mm !important;
        min-height: 297mm !important;
        padding: 14mm 18mm !important;
        margin: 0 !important;
        box-shadow: none !important;
        border: none !important;
        border-radius: 0 !important;
        page-break-after: always;
        break-after: page;
    }
    .english-zitie-page .ez-page:last-child {
        page-break-after: auto;
        break-after: auto;
    }
    .english-zitie-page .ez-line { page-break-inside: avoid; }
    .english-zitie-page .ez-page-footer { display: none; }
    .english-zitie-page .ez-panel,
    .english-zitie-page .ez-hero,
    .english-zitie-page .ez-article,
    .english-zitie-page .ez-breadcrumb,
    .english-zitie-page .ez-empty,
    .english-zitie-page .ez-preview-toolbar { display: none !important; }
}

/* =====================================================
   v1.1 新增：模式切换 + OCR 上传 + 文章抄写模式
   ===================================================== */

/* === 模式切换栏 === */
.english-zitie-page .ez-mode-bar {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-bottom: 14px;
    padding-bottom: 12px;
    border-bottom: 1px dashed var(--ez-border);
}
.english-zitie-page .ez-mode-tabs {
    display: inline-flex;
    background: #F5EFE3;
    border-radius: 8px;
    padding: 3px;
    flex: 1;
}
.english-zitie-page .ez-mode-tab {
    flex: 1;
    border: none;
    background: transparent;
    color: var(--ez-text-2);
    padding: 6px 10px;
    border-radius: 6px;
    font-size: 12px;
    font-weight: 600;
    cursor: pointer;
    font-family: inherit;
    transition: all 0.15s;
}
.english-zitie-page .ez-mode-tab.is-active {
    background: #fff;
    color: var(--ez-primary);
    box-shadow: 0 1px 3px rgba(180,83,9,0.15);
}
.english-zitie-page .ez-mode-tab:hover:not(.is-active) {
    color: var(--ez-primary);
}

.english-zitie-page .ez-btn-ocr {
    border: 1px solid var(--ez-primary);
    background: linear-gradient(135deg, #FFF9E0, #FEF3C7);
    color: var(--ez-primary);
    padding: 6px 10px;
    border-radius: 8px;
    font-size: 12px;
    font-weight: 600;
    cursor: pointer;
    font-family: inherit;
    white-space: nowrap;
    transition: all 0.15s;
}
.english-zitie-page .ez-btn-ocr:hover {
    background: linear-gradient(135deg, var(--ez-yellow), var(--ez-warm));
    transform: translateY(-1px);
}

/* === OCR 弹窗 === */
.english-zitie-page .ez-ocr-modal {
    position: fixed;
    inset: 0;
    z-index: 9999;
    display: flex;
    align-items: center;
    justify-content: center;
}
.english-zitie-page .ez-ocr-modal-mask {
    position: absolute;
    inset: 0;
    background: rgba(31, 27, 22, 0.55);
    animation: ezOcrFadeIn 0.18s ease-out;
}
.english-zitie-page .ez-ocr-modal-dialog {
    position: relative;
    background: #fff;
    border-radius: 16px;
    width: min(540px, 92vw);
    max-height: 88vh;
    display: flex;
    flex-direction: column;
    box-shadow: 0 16px 48px rgba(0,0,0,0.25);
    animation: ezOcrModalIn 0.22s cubic-bezier(0.16, 1, 0.3, 1);
}
@keyframes ezOcrFadeIn { from { opacity: 0; } to { opacity: 1; } }
@keyframes ezOcrModalIn {
    from { opacity: 0; transform: translateY(20px) scale(0.96); }
    to   { opacity: 1; transform: translateY(0) scale(1); }
}
.english-zitie-page .ez-ocr-modal-head {
    padding: 16px 20px;
    border-bottom: 1px solid var(--ez-border);
    display: flex;
    align-items: center;
    justify-content: space-between;
}
.english-zitie-page .ez-ocr-modal-head h3 {
    margin: 0;
    font-size: 16px;
    font-weight: 700;
    color: var(--ez-text);
}
.english-zitie-page .ez-ocr-modal-close {
    border: none;
    background: transparent;
    font-size: 24px;
    line-height: 1;
    color: var(--ez-text-3);
    cursor: pointer;
    padding: 0 4px;
}
.english-zitie-page .ez-ocr-modal-close:hover { color: var(--ez-primary); }
.english-zitie-page .ez-ocr-modal-body {
    padding: 16px 20px;
    overflow-y: auto;
}
.english-zitie-page .ez-ocr-modal-body .ez-textarea {
    min-height: 240px;
    font-family: ui-monospace, "SF Mono", Menlo, Consolas, monospace;
    font-size: 13px;
    line-height: 1.6;
}
.english-zitie-page .ez-ocr-tip {
    background: #F5EFE3;
    color: var(--ez-text-2);
    padding: 8px 12px;
    border-radius: 6px;
    font-size: 12px;
    margin-bottom: 10px;
    line-height: 1.5;
}
.english-zitie-page .ez-ocr-tip.is-error {
    background: #FEE2E2;
    color: #B91C1C;
}
.english-zitie-page .ez-ocr-tip.is-success {
    background: #DCFCE7;
    color: #166534;
}
.english-zitie-page .ez-ocr-note {
    font-size: 11px;
    color: var(--ez-text-3);
    margin-top: 8px;
    line-height: 1.5;
}
.english-zitie-page .ez-ocr-modal-foot {
    padding: 12px 20px;
    border-top: 1px solid var(--ez-border);
    display: flex;
    gap: 10px;
    justify-content: flex-end;
}
.english-zitie-page .ez-ocr-modal-foot .ez-btn { width: auto; padding: 8px 18px; }

/* === OCR 加载遮罩 === */
.english-zitie-page .ez-ocr-loading {
    position: fixed;
    inset: 0;
    z-index: 9998;
    background: rgba(255, 255, 255, 0.85);
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 14px;
}
.english-zitie-page .ez-ocr-loading-spinner {
    width: 48px;
    height: 48px;
    border: 4px solid var(--ez-warm);
    border-top-color: var(--ez-primary);
    border-radius: 50%;
    animation: ezOcrSpin 0.8s linear infinite;
}
@keyframes ezOcrSpin { to { transform: rotate(360deg); } }
.english-zitie-page .ez-ocr-loading-text {
    font-size: 14px;
    color: var(--ez-primary);
    font-weight: 600;
}

/* === 文章模式 - 预览样式 === */
.english-zitie-page .ez-article-title-preview {
    text-align: center;
    font-size: 14mm;
    color: inherit;
    font-weight: bold;
    line-height: 1.1;
    margin: 6mm 0 8mm;
    padding: 0 4mm;
}
.english-zitie-page .ez-color-redtrace .ez-article-title-preview { color: #f5b8b8; }
.english-zitie-page .ez-color-graytrace .ez-article-title-preview { color: #d0d0d0; }
.english-zitie-page .ez-color-solid .ez-article-title-preview { color: #1a1a1a; }
.english-zitie-page .ez-color-blank .ez-article-title-preview { display: none; }
.english-zitie-page .ez-font-patrickhand .ez-article-title-preview { font-family: 'Patrick Hand', cursive; }
.english-zitie-page .ez-font-caveat      .ez-article-title-preview { font-family: 'Caveat', cursive; }
.english-zitie-page .ez-font-dancing     .ez-article-title-preview { font-family: 'Dancing Script', cursive; }
.english-zitie-page .ez-font-system      .ez-article-title-preview { font-family: Arial, Helvetica, sans-serif; }

.english-zitie-page .ez-para-gap {
    height: 4mm;
}

/* 响应式：移动端弹窗全屏 */
@media (max-width: 640px) {
    .english-zitie-page .ez-ocr-modal-dialog {
        width: 100vw;
        height: 100vh;
        max-height: 100vh;
        border-radius: 0;
    }
    .english-zitie-page .ez-mode-bar {
        flex-wrap: wrap;
        gap: 6px;
    }
    .english-zitie-page .ez-btn-ocr {
        width: 100%;
    }
}

/* === 文章模式：左对齐单行原文（不沿用 word 模式 flex 居中规则） === */
.english-zitie-page .ez-line-article {
    /* 复用 .ez-line 的 height/margin/page-break，仅替换内部内容样式 */
}
.english-zitie-page .ez-article-line-text {
    position: absolute;
    inset: 0;
    padding: 0 2mm 1.7mm;
    line-height: 1;
    font-size: var(--ez-font, 8.5mm);
    /* 词与词间距用 space-between 撑满四线宽度 */
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    white-space: nowrap;
    overflow: hidden;
    gap: 2mm;
}
.english-zitie-page .ez-article-word {
    display: inline-block;
    white-space: nowrap;
}
/* 单词独占整行时回退左对齐（防止单词被无穷间距撑到怪异位置） */
.english-zitie-page .ez-article-line-text:has(.ez-article-word:only-child) {
    justify-content: flex-start;
}
.english-zitie-page .ez-color-solid     .ez-article-line-text { color: #1a1a1a; }
.english-zitie-page .ez-color-redtrace  .ez-article-line-text { color: #f5b8b8; }
.english-zitie-page .ez-color-graytrace .ez-article-line-text { color: #d0d0d0; }
.english-zitie-page .ez-color-blank     .ez-article-line-text { display: none; }
.english-zitie-page .ez-font-patrickhand .ez-article-line-text { font-family: 'Patrick Hand', cursive; }
.english-zitie-page .ez-font-caveat      .ez-article-line-text { font-family: 'Caveat', cursive; }
.english-zitie-page .ez-font-dancing     .ez-article-line-text { font-family: 'Dancing Script', cursive; }
.english-zitie-page .ez-font-system      .ez-article-line-text { font-family: Arial, Helvetica, sans-serif; }