:root{color-scheme:light;font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif;background:#eef2f6;color:#172033}*{box-sizing:border-box}body{margin:0;min-width:1080px}button,input,select{font:inherit}button{border:1px solid #cbd5e1;background:#fff;color:#172033;border-radius:6px;min-height:34px;padding:0 12px;cursor:pointer}button:hover{border-color:#64748b}.app-shell{display:grid;grid-template-columns:var(--left-panel-width, 280px) 6px minmax(600px,1fr) 300px;gap:0;min-height:100vh;background:#d7dee8}.panel,.workspace{background:#f8fafc}.panel{padding:18px}.file-panel{display:flex;flex-direction:column;min-height:100vh;min-width:0;overflow:hidden}.panel-resizer{position:relative;background:#d7dee8;cursor:col-resize}.panel-resizer:after{content:"";position:absolute;inset:0 2px;background:#cbd5e1;transition:background .12s ease}.panel-resizer:hover:after{background:#7b2cbf}.panel-title{display:flex;align-items:baseline;justify-content:space-between;gap:12px;margin-bottom:14px}.panel-title h2,.topbar h1{margin:0;letter-spacing:0}.panel-title h2{font-size:18px}.panel-title span,.topbar p,.drop-zone small,.statusbar{color:#64748b}.drop-zone{display:grid;place-items:center;gap:6px;min-height:128px;border:1px dashed #94a3b8;border-radius:8px;background:#fff;text-align:center;cursor:pointer}.drop-zone input{display:none}.drop-zone.is-dragging{border-color:#6d28d9;background:#f5f3ff}.copy-tools{display:grid;grid-template-columns:2fr 1fr;align-items:center;gap:8px;margin-top:10px}.copy-toggle-button{display:inline-flex;align-items:center;justify-content:center;gap:7px;border-color:#cbd5e1;background:#fff;color:#334155;font-size:13px;font-weight:800}.copy-toggle-button.is-active{border-color:#2563eb;background:#eff6ff;color:#1d4ed8;box-shadow:0 8px 18px #2563eb38}.copy-toggle-knob{position:relative;width:30px;height:16px;border-radius:999px;background:#cbd5e1;transition:background .14s ease}.copy-toggle-knob:after{content:"";position:absolute;top:2px;left:2px;width:12px;height:12px;border-radius:50%;background:#fff;box-shadow:0 1px 3px #0f172a38;transition:transform .14s ease}.copy-toggle-button.is-active .copy-toggle-knob{background:#2563eb}.copy-toggle-button.is-active .copy-toggle-knob:after{transform:translate(14px)}.copy-tools button{min-height:34px;white-space:nowrap}.copy-tools button:disabled{opacity:.45;cursor:not-allowed}.blank-actions{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin:14px 0}.page-list{display:grid;align-content:start;gap:8px;max-height:calc(100vh - 426px);overflow:auto;padding-right:4px}.page-row{display:grid;grid-template-columns:52px minmax(0,1fr) 92px 30px;align-items:center;gap:8px;min-height:38px;padding:6px 8px;border:1px solid #e2e8f0;border-radius:7px;background:#fff;cursor:grab;transition:border-color .12s ease,box-shadow .12s ease,opacity .12s ease,transform .12s ease}.page-row:active{cursor:grabbing}.page-row.is-dragging{opacity:.48}.page-row.is-drag-over{border-color:#6d28d9;box-shadow:inset 0 0 0 1px #6d28d9;transform:translateY(1px)}.page-row.is-copy-mode{cursor:pointer}.page-row.is-selected{border-color:#2563ebb3;background:#dbeafeb8;box-shadow:inset 0 0 0 1px #2563eb57}.page-row.is-selected .page-index{background:#2563eb;color:#fff}.page-index{display:grid;place-items:center;width:48px;height:24px;border-radius:5px;background:#e2e8f0;font-size:11px;font-weight:700}.page-name{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:13px}.page-row button{min-height:26px;padding:0;color:#64748b}.page-fit-select{min-width:0;width:92px;min-height:28px;border:1px solid #cbd5e1;border-radius:6px;background:#fff;color:#334155;font-size:11px;padding:0 6px}.page-fit-select:disabled{color:#94a3b8;background:#f1f5f9}.usage-guide{margin-top:auto;padding:14px;border:1px solid #dbe3ee;border-radius:8px;background:#fff}.usage-guide h3{margin:0 0 8px;font-size:14px}.usage-guide p{margin:0 0 10px;color:#334155;font-size:11px;line-height:1.45}.usage-guide ol{margin:0;padding-left:18px;color:#475569;font-size:11px;line-height:1.55}.usage-guide li+li{margin-top:4px}.workspace{display:grid;grid-template-rows:auto auto 1fr auto;min-width:0}.topbar{display:flex;align-items:center;justify-content:space-between;gap:24px;padding:18px 22px;background:#fff;border-bottom:1px solid #e2e8f0}.topbar-actions{display:flex;align-items:center;gap:10px;flex-shrink:0}.language-toggle{display:inline-grid;grid-template-columns:1fr 1fr;border:1px solid #cbd5e1;border-radius:7px;overflow:hidden;background:#fff}.language-toggle button{min-height:34px;border:0;border-radius:0;padding:0 10px;color:#475569}.language-toggle .active{background:#172033;color:#fff}.topbar h1{font-size:22px}.topbar p{margin:4px 0 0;font-size:13px}.primary-button{border-color:#312e81;background:#312e81;color:#fff;font-weight:700}.preview-toolbar{display:flex;align-items:center;gap:14px;padding:12px 22px;border-bottom:1px solid #e2e8f0;background:#f8fafc}.segmented{display:inline-grid;grid-template-columns:1fr 1fr;border:1px solid #cbd5e1;border-radius:7px;overflow:hidden}.segmented button{border:0;border-radius:0}.segmented .active{background:#172033;color:#fff}.preview-toolbar label{display:inline-flex;align-items:center;gap:8px;font-size:13px;color:#475569}.toolbar-label{color:#334155;font-size:13px;font-weight:800}.preview-toolbar select,.field select{min-height:34px;border:1px solid #cbd5e1;border-radius:6px;background:#fff;padding:0 10px}.layout-readout{margin-left:auto;font-size:13px;font-weight:700;color:#312e81}.work-page-readout{min-width:92px;padding:6px 10px;border:1px solid rgba(37,99,235,.32);border-radius:6px;background:#dbeafedb;color:#1d4ed8;font-size:13px;font-weight:900;text-align:center}.output-fill-status{color:#475569;font-size:13px;font-weight:700}.preview-stage{display:grid;place-items:center;padding:0 26px 26px;overflow:auto;background:linear-gradient(90deg,rgba(15,23,42,.04) 1px,transparent 1px),linear-gradient(rgba(15,23,42,.04) 1px,transparent 1px);background-size:24px 24px}.preview-stack{display:grid;gap:10px;width:min(100%,980px)}.book-position{display:grid;grid-template-columns:minmax(150px,1fr) 210px minmax(210px,1fr);align-items:center;justify-self:stretch;gap:10px;width:100%;max-width:100%;padding:6px 12px;border:1px solid #dbe3ee;border-radius:8px;background:#ffffffeb;box-shadow:0 12px 26px #0f172a1a}.book-position-copy{display:grid;gap:3px}.book-position-copy span,.book-position-relation{color:#64748b;font-size:12px}.book-position-copy strong{color:#172033;font-size:18px;letter-spacing:0}.book-visual{position:relative;width:210px;min-height:79px;overflow:hidden;border-radius:8px;background:transparent;isolation:isolate}.book-visual img{display:block;width:100%;height:79px;object-fit:contain;object-position:center;filter:saturate(.92)}.is-back-side .book-visual img{filter:saturate(.82) contrast(.94)}.book-page-hit{position:absolute;top:22%;display:grid;align-content:end;gap:2px;width:23%;height:54%;padding:4px;border:1px solid rgba(49,46,129,.28);border-radius:5px;background:#ffffff42;color:#172033bf;opacity:.72;transform:scale(1.01);box-shadow:0 0 0 1px #94a3b847;transition:opacity .16s ease,transform .16s ease,box-shadow .16s ease,background .16s ease}.book-page-hit.is-active{border-color:#2563ebc7;background:#2563eb2e;opacity:1;box-shadow:0 0 0 2px #2563eb80,0 0 18px #2563eb57;animation:active-page-pulse 3s ease-in-out infinite}.book-page-left{left:27%;transform:rotate(7deg) scale(1.01);transform-origin:right bottom}.book-page-right{right:26%;transform:rotate(-7deg) scale(1.01);transform-origin:left bottom}.book-page-label{justify-self:start;max-width:100%;padding:2px 4px;border-radius:4px;background:#ffffffd1;color:#1e293b;font-size:9px;font-weight:800;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.book-page-hit.is-active .book-page-label{background:#dbeafef2;color:#1d4ed8}.book-work-arrow{position:absolute;left:50%;bottom:7%;z-index:3;display:grid;place-items:center;min-width:72px;height:18px;padding:0 8px;border:1px solid rgba(37,99,235,.36);border-radius:999px;background:#ffffffe6;color:#1d4ed8;font-size:10px;font-weight:900;line-height:1;transform:translate(-50%);box-shadow:0 8px 18px #2563eb2e;white-space:nowrap}.book-back-arrow{position:absolute;top:34%;z-index:3;display:grid;gap:3px;min-width:70px;color:#312e81;font-weight:900;text-align:center}.book-back-arrow span{padding:3px 5px;border:1px solid rgba(123,44,191,.28);border-radius:999px;background:#ffffffdb;box-shadow:0 8px 18px #312e8129;font-size:9px;white-space:nowrap}.book-back-arrow strong{color:#7b2cbf;font-size:24px;line-height:.8;text-shadow:0 0 16px rgba(123,44,191,.3)}.book-back-arrow-left{left:8%}.book-back-arrow-right{right:8%}.binding-note{position:absolute;z-index:2;padding:2px 5px;border-radius:999px;background:#ffffffc7;color:#475569;font-size:8px;font-weight:800}.binding-note{left:50%;bottom:13%;transform:translate(-50%);display:inline-flex;align-items:center;gap:4px}.binding-note.is-rtl{color:#312e81}.book-position-relation{margin:0;line-height:1.5}@keyframes active-page-pulse{0%,to{box-shadow:0 0 0 2px #2563eb70,0 0 18px #2563eb4d}50%{box-shadow:0 0 0 2px #2563ebb8,0 0 28px #2563eb70}}.preview-slot-labels{display:grid;grid-template-columns:1fr 1fr;gap:1px;font-size:13px;font-weight:800;color:#312e81;text-align:center}.preview-slot-labels span{min-width:0;padding:7px 10px;border:1px solid #cbd5e1;border-radius:6px;background:#fff;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.preview-slot-labels span.is-active{border-color:#2563eb8f;background:#dbeafef0;color:#1d4ed8;box-shadow:inset 0 0 0 1px #2563eb47}.preview-canvas-shell{position:relative;width:100%;perspective:1200px}.preview-canvas-shell.is-page-turning .preview-canvas{animation:preview-page-turn .26s ease-out;transform-origin:right center}.preview-canvas{display:block;width:100%;height:auto;background:#fff;border:1px solid #cbd5e1;box-shadow:0 18px 40px #0f172a29}.preview-drop-overlay{position:absolute;inset:1px;display:grid;grid-template-columns:1fr 1fr;pointer-events:none}.preview-page-drop-zone{position:relative;display:grid;place-items:center;min-width:0;border:1px dashed transparent;pointer-events:auto;transition:background .12s ease,border-color .12s ease}.preview-page-drop-zone:not(.is-fixed-blank){cursor:pointer}.preview-page-drop-zone span{max-width:min(78%,260px);padding:8px 12px;border:1px dashed #94a3b8;border-radius:7px;background:#ffffffe0;color:#475569;font-size:13px;font-weight:800;line-height:1.35;text-align:center;word-break:keep-all}.preview-page-drop-zone.is-dragging{border-color:#6d28d9;background:#f5f3ff8f}.preview-page-drop-zone.is-dragging span{border-color:#6d28d9;color:#312e81}.preview-page-drop-zone.is-selected:after{content:"";position:absolute;inset:9px;border:3px solid rgba(37,99,235,.9);border-radius:8px;background:#2563eb0d;box-shadow:inset 0 0 0 1px #fffc,0 0 0 1px #2563eb38;pointer-events:none}.preview-page-drop-zone.is-fixed-blank{pointer-events:none}.preview-page-arrow{position:absolute;top:50%;z-index:3;display:grid;place-items:center;width:5mm;height:20mm;min-height:20mm;padding:0;border:1px solid #94a3b8;border-radius:4px;background:#ffffffeb;color:#172033;font-size:20px;font-weight:900;line-height:1;transform:translateY(-50%)}.preview-page-arrow:disabled{opacity:.36;cursor:not-allowed}.preview-page-arrow-left{left:1px}.preview-page-arrow-right{right:1px}@keyframes preview-page-turn{0%{opacity:.68;transform:rotateY(-5deg) translate(10px)}to{opacity:1;transform:rotateY(0) translate(0)}}.statusbar{display:flex;align-items:center;gap:16px;min-height:38px;padding:0 22px;border-top:1px solid #e2e8f0;background:#fff;font-size:12px}.statusbar strong{margin-left:auto;color:#172033;font-weight:700}.settings-panel{display:flex;flex-direction:column;gap:16px}.field{display:grid;gap:8px;font-size:13px;color:#475569}.field input[type=range]{width:100%}.check-group{display:grid;gap:12px;padding-top:4px}.check-group label{display:grid;grid-template-columns:18px 1fr;align-items:center;gap:9px;font-size:13px;color:#334155}.page-number-options{display:grid;grid-template-columns:minmax(84px,1fr) auto auto;align-items:center;gap:8px;min-width:0}.check-group .page-number-options label{display:inline-grid;grid-template-columns:18px auto;gap:6px;white-space:nowrap}.check-group .page-number-options label.is-disabled{color:#94a3b8}@media(max-width:1180px){body{min-width:0}.app-shell{grid-template-columns:1fr}.panel-resizer{display:none}.book-position{grid-template-columns:1fr}.panel{min-height:auto}}
