html.zt-workspace-modal-open { overflow:hidden; }
/* Preview-first workspace, scoped to the English worksheet tool. */
.zitie-page { max-width:1680px; }
.zitie-page .zt-workspace-bar { display:flex; align-items:center; gap:20px; padding:8px 0 18px; }
.zitie-page .zt-workspace-bar h1 { margin:0; font-size:20px; line-height:1.4; font-weight:650; color:var(--zt-text); }
.zitie-page .zt-workspace-tools,.zitie-page .zt-workspace-export { display:flex; gap:8px; align-items:center; }
.zitie-page .zt-workspace-export { margin-left:auto; }
.zitie-page .zt-workspace-bar button,.zitie-page .zt-drawer-head button,.zitie-page .zt-drawer-done { min-height:42px; padding:9px 14px; border:1px solid var(--zt-border); border-radius:9px; color:var(--zt-text-2); background:var(--zt-surface); font:inherit; font-size:13px; cursor:pointer; }
.zitie-page .zt-workspace-bar button:hover,.zitie-page #zt-settings-toggle.is-active { background:var(--zt-yellow); color:var(--zt-primary); border-color:var(--zt-warm); }
.zitie-page .zt-workspace-bar button.is-primary,.zitie-page .zt-drawer-done { background:var(--zt-primary); color:#fff; border-color:var(--zt-primary); }
.zitie-page .zt-workspace-bar button:disabled { opacity:.55; cursor:wait; }
.zitie-page .zt-workspace-bar button i { margin-right:5px; }
.zitie-page .zt-workspace-feedback { margin:0; color:var(--zt-primary); font-size:13px; line-height:1.6; }
.zitie-page .zt-workspace-feedback:not(:empty) { margin-bottom:12px; }
.zitie-page .zt-app { grid-template-columns:minmax(0,0) minmax(0,1fr); gap:0; transition:grid-template-columns 220ms ease,gap 220ms ease; }
.zitie-page.is-settings-open .zt-app { grid-template-columns:340px minmax(0,1fr); gap:18px; }
.zitie-page .zt-preview-wrap { grid-column:2; border-radius:12px; background:#f0eee8; scroll-margin-top:140px; }
.zitie-page .zt-settings-drawer { grid-column:1; grid-row:1; position:sticky; top:132px; margin:0; padding:0; width:340px; max-width:100%; max-height:calc(100dvh - 100px); border:1px solid var(--zt-border); border-radius:12px; color:var(--zt-text); background:var(--zt-surface); overflow:auto; overscroll-behavior:contain; box-sizing:border-box; }
.zitie-page .zt-settings-drawer:not([open]):not([open]) { display:none; }
.zitie-page .zt-settings-drawer .zt-panel { position:static; border:0; border-radius:0; padding:0 18px 18px; box-shadow:none; max-width:none; }
.zitie-page .zt-drawer-head { display:flex; align-items:center; justify-content:space-between; gap:12px; position:sticky; top:0; z-index:3; padding:14px 0 12px; background:var(--zt-surface); }
.zitie-page .zt-drawer-head h2 { margin:0; font-size:15px; line-height:1.5; font-weight:650; }
.zitie-page .zt-drawer-head button { border:0; min-height:36px; padding:6px 8px; font-size:12px; color:var(--zt-text-3); }
.zitie-page .zt-drawer-head button span { font-size:20px; vertical-align:-1px; padding-left:5px; }
.zitie-page .zt-drawer-done { display:block; position:sticky; bottom:0; width:100%; margin-top:16px; box-shadow:0 0 0 8px var(--zt-surface); }
@media(max-width:991px) {
 .zitie-page .zt-app,.zitie-page.is-settings-open .zt-app { display:block; }
 .zitie-page .zt-workspace-bar { flex-wrap:wrap; gap:10px; padding-bottom:12px; }
 .zitie-page .zt-workspace-bar h1 { font-size:18px; }
 .zitie-page .zt-workspace-tools { margin-left:auto; }
 .zitie-page .zt-settings-drawer { position:fixed; inset:0 auto 0 0; width:min(400px,92vw); max-width:none; max-height:none; height:100dvh; margin:0; border:0; border-radius:0 16px 16px 0; padding:env(safe-area-inset-top,0px) 0 env(safe-area-inset-bottom,0px); }
 .zitie-page .zt-settings-drawer[open] { animation:zt-drawer-enter 200ms ease-out; }
 .zitie-page .zt-drawer-done { min-height:46px; }
}
@media(max-width:768px) {
 .zitie-page .zt-workspace-export { display:none; }
 .zitie-page .zt-workspace-bar { align-items:flex-start; }
 .zitie-page .zt-workspace-tools { width:100%; margin:0; }
 .zitie-page .zt-workspace-tools button { flex:1; }
 .zitie-page .zt-preview-wrap { padding:10px; min-height:420px; }
}
@keyframes zt-drawer-enter { from { transform:translateX(-100%); } to { transform:translateX(0); } }
@media(prefers-reduced-motion:reduce) { .zitie-page .zt-app { transition:none; } .zitie-page .zt-settings-drawer[open] { animation:none; } }
@media print { .zitie-page .zt-workspace-bar,.zitie-page .zt-settings-drawer { display:none!important; } .zitie-page .zt-app { display:block!important; } }

.zitie-page .zt-workspace-tools { flex-wrap:wrap; }
.zitie-page .zt-settings-drawer .zt-panel { margin:0; }
.zitie-page .zt-ocr-result-dialog { width:min(560px,92vw); max-height:90dvh; box-sizing:border-box; padding:0 22px 22px; border:0; border-radius:16px; color:var(--zt-text); background:var(--zt-surface); overflow:auto; }
.zitie-page .zt-ocr-result-dialog::backdrop,.zitie-page .zt-settings-drawer::backdrop { background:#21190f80; }
.zitie-page .zt-ocr-result-dialog label { display:block; font-size:13px; color:var(--zt-text-2); margin:12px 0 8px; }
.zitie-page #zt-ocr-result { width:100%; padding:12px; box-sizing:border-box; border:1px solid var(--zt-border); border-radius:8px; font:inherit; line-height:1.8; background:var(--zt-surface); color:var(--zt-text); resize:vertical; }
.zitie-page #zt-ocr-status,.zitie-page #zt-ocr-count { font-size:13px; line-height:1.6; color:var(--zt-text-3); }
.zitie-page .zt-ocr-result-foot { display:flex; align-items:center; gap:16px; margin-top:16px; }
.zitie-page .zt-ocr-result-foot .zt-drawer-done { width:auto; margin:0 0 0 auto; position:static; }
.zitie-page button:disabled { opacity:.55; cursor:not-allowed; }
@media(min-width:992px) { .zitie-page .zt-workspace-bar { position:sticky; top:56px; z-index:10; background:var(--zt-bg); padding:12px 0; margin-bottom:12px; } }
[data-theme="dark"] .zitie-page .zt-workspace-bar { background:#2d2722; }
[data-theme="dark"] .zitie-page .zt-workspace-bar button.is-primary,[data-theme="dark"] .zitie-page .zt-drawer-done { color:#35261a; }
@media print { .zitie-page .zt-ocr-result-dialog { display:none!important; } }