
.tool-app{max-width:1060px;margin:0 auto 36px;padding:0 22px}.tool-shell{background:#fff;border:1px solid #dce7df;border-radius:20px;padding:clamp(18px,3vw,30px);box-shadow:0 12px 34px #143c2510}.tool-shell h2{margin:0 0 8px;font-size:25px}.drop{border:2px dashed #a7c6b4;border-radius:16px;padding:36px 18px;text-align:center;background:#f7fbf8;cursor:pointer;display:block;transition:background .2s,border-color .2s}.drop:hover,.drop.drag{background:#e9f6ec;border-color:#24714d}.drop strong{display:block;font-size:18px}.drop span{font-size:13px;color:#5b7264}.tool-actions{display:flex;align-items:center;gap:12px;flex-wrap:wrap;margin-top:18px}.tool-btn{background:#166448;color:white;border:0;border-radius:11px;padding:13px 22px;font:inherit;font-weight:750;cursor:pointer}.tool-btn:disabled{opacity:.45;cursor:not-allowed}.tool-secondary{border:1px solid #b6d0c0;background:white;color:#215b41}.tool-msg{margin:14px 0 0;min-height:22px;color:#416655;font-size:14px}.tool-msg.error{color:#a52b2b}.tool-fields{display:grid;grid-template-columns:repeat(auto-fit,minmax(190px,1fr));gap:15px;margin:20px 0}.tool-fields label{display:flex;flex-direction:column;gap:6px;font-size:13px;font-weight:700}.tool-fields input,.tool-fields select{border:1px solid #bed2c5;border-radius:9px;padding:11px;font:inherit;width:100%;min-width:0}.file-list{margin:18px 0 0;padding:0;list-style:none}.file-list li{display:flex;align-items:center;gap:10px;padding:10px;border:1px solid #e1e9e2;border-radius:10px;margin:8px 0;background:#fff}.file-list .file-name{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:14px}.file-list button{border:1px solid #c5d7c9;background:white;border-radius:7px;padding:5px 9px;cursor:pointer}.tool-info{font-size:13px;color:#5a7163;margin-top:12px}.tool-preview{display:flex;gap:12px;flex-wrap:wrap;margin-top:16px}.tool-preview img{max-width:110px;max-height:145px;object-fit:contain;border:1px solid #d5e1d8;border-radius:6px}.tool-preview figure{margin:0;text-align:center;font-size:12px;color:#61776b}.tool-hidden{display:none!important}@media(max-width:600px){.drop{padding:24px 12px}.tool-actions .tool-btn{width:100%}}

/* Phase 5: visual file tiles and page previews */
.file-list{display:grid;grid-template-columns:repeat(auto-fill,minmax(170px,1fr));gap:14px;margin-top:16px}
.file-list li.file-tile{display:flex;flex-direction:column;align-items:stretch;gap:9px;padding:12px;margin:0;min-width:0;border-radius:14px}
.tile-visual{height:210px;background:#f3f7f4;border:1px solid #e3eae4;border-radius:9px;display:flex;flex-direction:column;justify-content:center;align-items:center;overflow:hidden;font-size:12px;color:#62776b;position:relative}
.tile-visual canvas,.tile-visual img{max-width:100%;max-height:182px;width:auto;height:auto;object-fit:contain;box-shadow:0 2px 9px #19352520;background:white}
.tile-pages{position:absolute;bottom:5px;right:5px;background:#fff;border-radius:5px;padding:2px 5px;color:#365a46;font-size:11px}
.file-list .file-name{width:100%;flex:initial;font-weight:650}
.tile-controls{display:flex;gap:7px;justify-content:flex-end}.tile-controls button{min-width:32px;min-height:32px}
.tool-preview{display:block;margin-top:16px}.preview-heading{font-size:15px;margin:0 0 8px;color:#365c45}
@media(max-width:600px){.file-list{grid-template-columns:repeat(2,minmax(0,1fr));gap:9px}.file-list li.file-tile{padding:8px}.tile-visual{height:160px}.tile-visual canvas,.tile-visual img{max-height:136px}}

/* One draggable tile per PDF page */
.page-tile{cursor:grab;touch-action:pan-y}.page-tile.dragging{opacity:.4}.page-tile:focus-within{outline:2px solid #2e8056;outline-offset:2px}.page-tile .tile-controls{margin-top:auto}.page-tile .file-name{font-size:12px;overflow-wrap:anywhere;white-space:normal;line-height:1.35}.page-tile .tile-visual{height:230px}.page-tile .tile-visual canvas{max-height:204px}.page-tile .tile-controls button:disabled{opacity:.35;cursor:not-allowed}

/* Split PDF: selectable page tiles */
.page-tile.split-selectable{cursor:pointer;user-select:none;transition:border-color .15s,background .15s,box-shadow .15s;border:2px solid #dce6dd}
.page-tile.split-selectable:hover{border-color:#72a88a;background:#f7fbf8}
.page-tile.split-selectable.split-selected{border-color:#17724e;background:#e9f7ee;box-shadow:0 0 0 2px #17724e24}
.page-tile.split-selectable:focus-visible{outline:3px solid #17724e;outline-offset:3px}
.split-tick{display:block;font-size:13px;font-weight:750;color:#34644b;text-align:center}
.split-selected .split-tick{color:#12653f}

.file-summary{list-style:none;padding:13px 16px;border:1px solid #dce7df;border-radius:12px;background:#f7faf8;overflow-wrap:anywhere;font-weight:600;color:#23483b}

/* Contextual preview: full document instead of tiles for document-wide tools */
.file-list:has(.file-summary){display:block}.file-list .file-summary{display:block;margin:10px 0}.single-page-holder{position:relative;max-width:100%;margin:8px auto 0;background:white;box-shadow:0 5px 24px #15382522;overflow:hidden}.single-page-holder canvas{display:block;width:100%;height:100%}.single-preview-overlay{position:absolute;left:50%;top:50%;white-space:nowrap;max-width:95%;overflow:hidden;color:#3d5e52;font-family:Arial,sans-serif;pointer-events:none}.tool-preview:empty{display:none}

/* Watermark tool: selectable individual page thumbnails with live overlays */
.page-tile .tile-visual{position:relative;overflow:hidden}
.tile-watermark-overlay{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);font-family:Helvetica,Arial,sans-serif;font-weight:600;white-space:nowrap;pointer-events:none;color:#3d5e52;max-width:100%;overflow:hidden;text-overflow:clip}

.tile-number-overlay{position:absolute;left:50%;transform:translateX(-50%);color:#3d5e52;font-weight:600;line-height:1;pointer-events:none;text-shadow:0 0 2px white;background:#ffffffa8;border-radius:3px;padding:1px 3px}.tool-history{display:flex;gap:8px;margin:10px 0}.tool-history button{padding:7px 12px;border:1px solid #b9d1c3;border-radius:8px;background:#fff;color:#174735;cursor:pointer}.tool-history button:disabled{opacity:.4;cursor:default}

/* Orientation-aware previews: the PDF page, not a portrait-shaped slot,
   defines both thumbnail dimensions and annotation coordinates. */
.page-tile .tile-visual.page-aspect-preview{height:auto;min-height:0;display:block;overflow:hidden;background:#f3f7f4}
.page-preview-surface{position:relative;width:100%;height:100%;overflow:hidden;background:white}
.page-tile .page-preview-surface canvas{display:block;width:100%;height:100%;max-height:none;max-width:none;object-fit:fill;box-shadow:none}
.page-tile .page-preview-surface .tile-number-overlay,.page-tile .page-preview-surface .tile-watermark-overlay{z-index:2}
.page-tile .tile-visual.page-aspect-preview .tile-pages{z-index:3}

.watermark-confirm{display:flex;align-items:flex-start;gap:10px;margin:16px 0;line-height:1.5;font-size:14px}.watermark-confirm input{margin-top:5px;flex:none}#watermark-scan{padding:12px 14px;border:1px solid #dbe8df;border-radius:10px;background:#f7faf8}
