:root{--bg: #0f1115;--panel: #171a21;--panel-2: #1f242e;--line: #2a313d;--text: #e6e9ef;--muted: #9aa3b2;--accent: #4f8cff;--accent-2: #2f6fe0;--danger: #ff5d5d;--warn: #e8973a;--size: #2faa5b;--size-2: #248a49;--sheet: #ffffff;--measure-bg: #4f8cff}*{box-sizing:border-box}html,body,#root{height:100%;margin:0}body{font-family:ui-sans-serif,system-ui,-apple-system,Segoe UI,Roboto,sans-serif;background:var(--bg);color:var(--text);font-size:14px}.app{display:flex;flex-direction:column;height:100%}.logo{display:flex;align-items:center;gap:9px}.logo-mark{display:block;color:var(--text)}.logo-word-svg{display:block;height:24px;width:auto;position:relative;top:3px}.btn{background:var(--panel-2);color:var(--text);border:1px solid var(--line);border-radius:8px;padding:8px 14px;cursor:pointer;font-weight:600}.btn:hover{border-color:var(--accent)}.btn:disabled{opacity:.5;cursor:not-allowed}.btn-primary{background:var(--accent);border-color:var(--accent);color:#fff}.btn-primary:hover{background:var(--accent-2)}.btn-ghost{background:transparent;border:1px dashed var(--line);color:var(--muted);border-radius:8px;padding:6px 10px;cursor:pointer}.btn-ghost:hover{color:var(--text);border-color:var(--accent)}.banner{padding:8px 16px;font-size:13px}.banner.error{background:#ff5d5d1f;color:var(--danger);border-bottom:1px solid rgba(255,93,93,.3)}.layout{flex:1;display:grid;grid-template-columns:230px 1fr 300px;min-height:0}.pagelist{background:var(--panel);border-right:1px solid var(--line);padding:12px;display:flex;flex-direction:column;gap:10px;min-height:0;overflow:hidden}.pagelist-logo{display:flex;align-items:center;padding:2px 2px 8px;border-bottom:1px solid var(--line)}.pagelist-head{display:flex;align-items:center;justify-content:space-between}.pagelist h3{margin:0;font-size:13px;text-transform:uppercase;letter-spacing:.5px;color:var(--muted)}.thumbs{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:8px;flex:1 1 auto;min-height:0;overflow-y:auto}.export-btn{flex:none;width:100%}.output{flex:none;display:flex;flex-direction:column;gap:8px;padding:12px;background:var(--panel-2);border:1px solid var(--line);border-radius:10px}.output h3{margin:0;font-size:13px;text-transform:uppercase;letter-spacing:.6px;color:var(--muted)}.info-row{display:flex;align-items:center;justify-content:space-between;font-size:12px;color:var(--muted)}.info-row strong{color:var(--text);font-variant-numeric:tabular-nums}.thumb{display:grid;grid-template-columns:14px 14px 44px 1fr;align-items:center;gap:7px;padding:6px;border:1px solid var(--line);border-radius:8px;cursor:pointer;position:relative}.thumb:hover{border-color:var(--accent)}.thumb.active{border-color:var(--accent);background:var(--panel-2)}.thumb.dragging{opacity:.4}.thumb-grip{display:flex;align-items:center;justify-content:center;color:var(--muted);cursor:grab}.thumb-grip:active{cursor:grabbing}.thumb-grip:hover{color:var(--text)}.thumb-num{color:var(--muted);text-align:center;font-variant-numeric:tabular-nums}.thumb img{width:44px;height:44px;object-fit:contain;background:#fff;border-radius:4px}.thumb-name{font-size:12px;color:var(--muted);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.thumb-actions{grid-column:1 / -1;display:flex;gap:4px;justify-content:flex-end}.thumb-actions button{background:var(--panel-2);border:1px solid var(--line);color:var(--muted);border-radius:5px;width:26px;height:24px;cursor:pointer}.thumb-actions button:hover:not(:disabled){color:var(--text);border-color:var(--accent)}.thumb-actions button:disabled{opacity:.35;cursor:not-allowed}.empty{color:var(--muted);font-style:italic;padding:8px}.canvas-area{min-width:0;display:flex;flex-direction:column;background:#0b0d11}.stage{flex:1;position:relative;display:flex;align-items:center;justify-content:center;padding:0;overflow:hidden}.page-sheet{position:relative;background:var(--sheet);box-shadow:0 10px 40px #00000080}.placed-img{position:absolute;-webkit-user-select:none;user-select:none}.placed-img.ghost{opacity:.3;cursor:move}.page-clip{position:absolute;left:0;top:0;overflow:hidden;pointer-events:none}.page-clip .placed-img{pointer-events:none}.img-outline{position:absolute;box-sizing:border-box;border:1px solid rgba(79,140,255,.9);pointer-events:none}.handle{position:absolute;width:12px;height:12px;background:#fff;border:2px solid var(--accent);border-radius:2px;transform:translate(-50%,-50%);z-index:5}.guide{position:absolute;background:transparent;pointer-events:none}.guide-h{height:0;border-top:1px dashed rgba(79,140,255,.7)}.guide-v{width:0;border-left:1px dashed rgba(79,140,255,.7)}.dim-svg{position:absolute;left:0;top:0;overflow:visible;pointer-events:none;z-index:4}.dim-line{stroke:var(--size);stroke-width:1;stroke-dasharray:4 3;opacity:.75}.dim-ext{stroke:var(--size);stroke-width:1;stroke-dasharray:4 3;opacity:.55}.dim-svg marker path{fill:var(--size);opacity:.85}.measure{position:absolute;z-index:6}.measure-btn{display:inline-flex;align-items:baseline;gap:2px;background:var(--measure-bg);color:#fff;border:none;border-radius:5px;padding:2px 6px;font-size:11px;font-variant-numeric:tabular-nums;cursor:pointer;white-space:nowrap;box-shadow:0 1px 4px #0006}.measure-btn:hover{background:var(--accent-2)}.measure.size .measure-btn{background:var(--size)}.measure.size .measure-btn:hover{background:var(--size-2)}.measure.size .measure-input{border-color:var(--size)}.measure-unit{font-size:9px;opacity:.8}.measure-input{width:56px;font-size:11px;padding:2px 4px;border:1px solid var(--accent);border-radius:5px;background:#fff;color:#111;font-variant-numeric:tabular-nums}.dropzone{flex:1;margin:32px;border:2px dashed var(--line);border-radius:14px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:6px;color:var(--muted);cursor:pointer}.dropzone:hover{border-color:var(--accent);color:var(--text)}.dropzone p{font-size:16px;margin:0}.sidebar{background:var(--panel);border-left:1px solid var(--line);overflow-y:auto;padding:14px;display:flex;flex-direction:column;gap:12px}.sidebar>*{flex-shrink:0}.sidebar.disabled{opacity:.45;pointer-events:none;-webkit-user-select:none;user-select:none}.row-between{display:flex;align-items:center;justify-content:space-between}.units-bar{display:flex;align-items:center;justify-content:space-between;font-size:13px;color:var(--muted)}.units-bar .seg button{text-transform:none}.fold{background:var(--panel-2);border:1px solid var(--line);border-radius:10px;overflow:hidden}.fold-head{display:flex;align-items:center;gap:8px;width:100%;padding:11px 12px;background:none;border:none;cursor:pointer;color:var(--text);font-size:13px;font-weight:600;text-transform:uppercase;letter-spacing:.6px}.fold-head:hover{color:var(--accent)}.fold-chevron{flex:none;transition:transform .15s ease;color:var(--muted)}.fold.open .fold-chevron{transform:rotate(90deg)}.fold-title{flex:1;text-align:left}.fold-hint{font-size:10px;font-weight:500;letter-spacing:.3px;text-transform:none;color:var(--muted)}.fold-body{display:flex;flex-direction:column;gap:12px;padding:0 12px 14px}.margins-cross{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:6px;align-items:center;max-width:180px;margin:0 auto}.margins-cross .numfield input{padding:6px 4px;font-size:12px;text-align:center}.margins-cross .numfield span{text-align:center}.mc-top{grid-column:2;grid-row:1}.mc-left{grid-column:1;grid-row:2}.mc-link{grid-column:2;grid-row:2;justify-self:center;width:34px;height:34px;border-radius:8px;border:1px solid var(--line);background:var(--panel);cursor:pointer;font-size:15px;line-height:1;opacity:.6}.mc-link.on{border-color:var(--accent);opacity:1}.mc-right{grid-column:3;grid-row:2}.mc-bottom{grid-column:2;grid-row:3}.seg{display:inline-flex;border:1px solid var(--line);border-radius:8px;overflow:hidden}.seg.full{display:flex}.seg button{flex:1;background:var(--panel-2);color:var(--muted);border:none;padding:7px 12px;cursor:pointer;text-transform:capitalize}.seg button.seg-on{background:var(--accent);color:#fff}.numfield{display:flex;flex-direction:column;gap:4px;font-size:12px;color:var(--muted);min-width:0}.numfield input,.numfield select{background:var(--panel-2);border:1px solid var(--line);border-radius:7px;padding:8px;color:var(--text);font-size:13px;min-width:0;width:100%;box-sizing:border-box}.numfield input:focus,.numfield select:focus{outline:none;border-color:var(--accent)}.numfield input.invalid{border-color:var(--danger)}.field-warn{margin:-4px 0 0;font-size:11px;line-height:1.3;color:var(--danger)}.dpi{display:flex;align-items:center;justify-content:space-between;font-size:12px;color:var(--muted)}.dpi strong{color:var(--text);font-variant-numeric:tabular-nums}.dpi.low strong{color:var(--danger)}.dpi.warn strong,.field-warn.warn{color:var(--warn)}.grid2{display:grid;grid-template-columns:1fr 1fr;gap:10px}.grid4{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:6px}.grid4 .numfield input{padding:6px 5px;font-size:12px;text-align:center}.grid4 .numfield span{text-align:center}.check{display:flex;align-items:center;gap:8px;font-size:13px;color:var(--text);cursor:pointer}.tool-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}.tool-grid.cols-2{grid-template-columns:repeat(2,1fr)}.tool-btn{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:5px;background:var(--panel-2);border:1px solid var(--line);color:var(--text);border-radius:8px;padding:10px 4px;font-size:22px;cursor:pointer}.tool-btn span{font-size:11px;line-height:1.1;text-align:center;color:var(--muted)}.tool-btn:hover{border-color:var(--accent);color:var(--accent)}.tool-btn:hover span{color:var(--text)}.full{width:100%}.modal-backdrop{position:fixed;top:0;right:0;bottom:0;left:0;z-index:100;display:flex;align-items:center;justify-content:center;padding:24px;background:#0009}.modal{width:100%;max-width:440px;background:var(--panel);border:1px solid var(--line);border-radius:14px;padding:22px;display:flex;flex-direction:column;gap:16px;box-shadow:0 20px 60px #00000080}.modal-head{display:flex;align-items:center;justify-content:space-between}.modal-x{flex:none;width:28px;height:28px;border-radius:8px;border:1px solid var(--line);background:var(--panel-2);color:var(--muted);cursor:pointer}.modal-x:hover{color:var(--text);border-color:var(--accent)}.modal-title{margin:0;font-size:18px;letter-spacing:-.2px}.intro-steps{margin:0;padding-left:20px;display:flex;flex-direction:column;gap:8px;color:var(--muted);font-size:14px;line-height:1.4}.intro-steps b{color:var(--text)}.intro-privacy{display:flex;gap:10px;align-items:flex-start;padding:12px;border-radius:10px;background:#2faa5b1f;border:1px solid rgba(47,170,91,.35);font-size:13px;line-height:1.45;color:var(--text)}.intro-lock{font-size:16px;line-height:1.3}.modal-cta{align-self:flex-end}