
.tt-app{max-width:950px;margin:40px auto;padding:20px;font-family:Arial,sans-serif}
.tt-panel{background:#fff;padding:40px;border-radius:22px;box-shadow:0 10px 35px rgba(0,0,0,.08);text-align:center}
.tt-badge{display:inline-block;background:#eef4ff;color:#2563eb;padding:8px 16px;border-radius:30px;font-weight:700;margin-bottom:18px}
.tt-upload{display:block;border:2px dashed #2563eb;padding:40px 20px;border-radius:18px;cursor:pointer;margin:28px 0;transition:.2s}
.tt-upload:hover{background:#f8fbff}
.tt-upload-icon{display:block;font-size:48px;margin-bottom:12px}
.tt-upload strong,.tt-upload small{display:block}
.tt-preview{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:16px;margin:24px 0}
.tt-item{background:#fff;border:1px solid #e5e7eb;border-radius:14px;padding:8px;text-align:center}
.tt-image-wrap{width:100%;aspect-ratio:3/4;border-radius:10px;display:flex;align-items:center;justify-content:center;overflow:hidden;background:#f3f4f6}
.tt-item img{max-width:100%;max-height:100%;object-fit:contain;border-radius:10px;display:block;transition:transform .2s ease}
.tt-item-actions{display:flex;gap:7px;margin-top:8px}
.tt-item-actions button{flex:1;border:0;border-radius:8px;padding:9px;font-weight:700;cursor:pointer}
.tt-rotate{background:#eef4ff;color:#1d4ed8}.tt-edit{background:#2563eb;color:#fff}.tt-remove{background:#fee2e2;color:#991b1b}
.tt-primary{background:#2563eb;color:#fff;border:0;border-radius:12px;padding:14px 26px;font-size:17px;font-weight:700;cursor:pointer}
.tt-primary:disabled{opacity:.5;cursor:not-allowed}
.tt-status{margin-top:16px;font-weight:700}
.tt-modal{display:none;position:fixed;z-index:999999;inset:0;background:rgba(0,0,0,.78);padding:20px;overflow:auto}
.tt-modal.is-open{display:flex;align-items:center;justify-content:center}
.tt-editor{position:relative;width:min(760px,100%);background:#fff;border-radius:18px;padding:24px}
.tt-close{position:absolute;right:14px;top:8px;border:0;background:transparent;font-size:34px;cursor:pointer}
.tt-editor-stage{height:430px;background:#111827;margin:20px 0;overflow:hidden}
.tt-editor-stage img{display:block;max-width:100%}
.tt-row{display:flex;gap:10px;margin-top:14px}
.tt-row button{flex:1;border:0;border-radius:10px;padding:12px;font-weight:700;cursor:pointer;background:#e5e7eb}
.tt-row .tt-primary{background:#2563eb;color:#fff}
.tt-control{display:block;text-align:left;font-weight:700;margin-top:16px}
.tt-control input,.tt-control select{width:100%;margin-top:8px}
@media(max-width:600px){
  .tt-panel{padding:24px 16px}
  .tt-editor{padding:18px}
  .tt-editor-stage{height:330px}
  .tt-row{flex-direction:column}
}

.tt-upload-options{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:16px;
  margin:28px 0;
}
.tt-upload-options .tt-upload{margin:0}
@media(max-width:600px){
  .tt-upload-options{grid-template-columns:1fr}
}

.tt-control-value{
  float:right;
  color:#2563eb;
  font-weight:800;
}

/* Tools hub */
.tt-hub-panel{padding-bottom:46px}
.tt-tools-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px;margin-top:30px;text-align:left}
.tt-tool-card{display:flex;flex-direction:column;min-height:170px;padding:22px;border:1px solid #e5e7eb;border-radius:18px;background:#fff;text-decoration:none!important;color:#111827!important;box-shadow:0 5px 18px rgba(0,0,0,.05);transition:transform .2s,box-shadow .2s,border-color .2s}
.tt-tool-card:hover{transform:translateY(-3px);box-shadow:0 10px 24px rgba(37,99,235,.12);border-color:#93c5fd}
.tt-tool-icon{font-size:38px;margin-bottom:18px}
.tt-tool-card strong{font-size:18px;margin-bottom:8px}
.tt-tool-card small{color:#6b7280;line-height:1.45}
.tt-tool-card.is-coming{opacity:.62;cursor:default}
.tt-tool-card.is-coming:hover{transform:none;box-shadow:0 5px 18px rgba(0,0,0,.05);border-color:#e5e7eb}

/* Merge PDF */
.tt-file-list{display:flex;flex-direction:column;gap:10px;margin:20px 0;text-align:left}
.tt-file-item{display:flex;align-items:center;gap:12px;padding:13px 14px;border:1px solid #e5e7eb;border-radius:12px;background:#f9fafb}
.tt-file-index{width:30px;height:30px;border-radius:50%;display:grid;place-items:center;background:#dbeafe;color:#1d4ed8;font-weight:800;flex:0 0 auto}
.tt-file-meta{min-width:0;flex:1}
.tt-file-name{font-weight:700;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.tt-file-size{font-size:12px;color:#6b7280;margin-top:3px}
.tt-file-remove{border:0;border-radius:8px;background:#fee2e2;color:#991b1b;padding:8px 10px;font-weight:700;cursor:pointer}

@media(max-width:780px){.tt-tools-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:520px){.tt-tools-grid{grid-template-columns:1fr}.tt-tool-card{min-height:145px}}


/* Drag and drop sorting */
.tt-reorder-hint{margin:18px 0 8px;color:#6b7280;font-size:14px;font-weight:700}
.tt-drag-handle,.tt-file-drag-handle{border:0;background:#eef4ff;color:#1d4ed8;border-radius:9px;font-weight:800;cursor:grab;touch-action:none;user-select:none;-webkit-user-select:none}
.tt-drag-handle{width:100%;padding:8px 10px;margin-bottom:8px}
.tt-file-drag-handle{width:38px;height:38px;display:grid;place-items:center;font-size:18px;flex:0 0 auto}
.tt-drag-handle:active,.tt-file-drag-handle:active{cursor:grabbing}
.tt-sortable-ghost{opacity:.35;background:#dbeafe!important}
.tt-sortable-chosen{box-shadow:0 12px 30px rgba(37,99,235,.2)!important}
.tt-sortable-drag{transform:rotate(1deg)}
@media(max-width:520px){
  .tt-file-item{gap:8px;padding:11px 10px}
  .tt-file-drag-handle{width:34px;height:34px}
  .tt-file-remove{padding:7px 8px;font-size:12px}
}

@media(max-width:600px){.tt-item-actions{display:grid;grid-template-columns:repeat(2,1fr)}.tt-item-actions button{min-height:38px}}

/* v1.2.4 editor: movable crop + straighten */
.tt-editor-rotate-actions{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin:14px 0}
.tt-editor-rotate-actions button{border:1px solid #dbe3ef;background:#f8fafc;color:#1f2937;border-radius:10px;padding:11px 8px;font-weight:800;cursor:pointer}
.tt-editor-rotate-actions button:hover{background:#eef4ff;border-color:#93b4ff;color:#1d4ed8}
.tt-editor-help{margin:8px 0 14px;color:#64748b;font-size:13px;line-height:1.45}
.tt-control-value{float:right;font-weight:800;color:#2563eb}
@media(max-width:520px){.tt-editor{padding:18px}.tt-editor-stage{height:360px}.tt-editor-rotate-actions button{font-size:13px;padding:10px 5px}}

/* v1.2.5 perspective crop: four independent corners, no rotate controls */
.tt-editor-stage{display:flex;align-items:center;justify-content:center;position:relative;padding:0;background:#111827}
.tt-perspective-wrap{position:relative;max-width:100%;max-height:100%;touch-action:none;user-select:none;-webkit-user-select:none}
.tt-perspective-wrap img{width:100%;height:100%;object-fit:fill;display:block;pointer-events:none}
.tt-perspective-overlay{position:absolute;inset:0;width:100%;height:100%;overflow:visible;touch-action:none}
.tt-perspective-overlay polygon{fill:rgba(37,99,235,.12);stroke:none}
.tt-perspective-overlay line{stroke:#3b82f6;stroke-width:3;vector-effect:non-scaling-stroke;filter:drop-shadow(0 1px 1px rgba(0,0,0,.45))}
.tt-crop-handle{fill:#3b82f6;stroke:#fff;stroke-width:3;vector-effect:non-scaling-stroke;cursor:grab;touch-action:none}
.tt-crop-handle:active{cursor:grabbing;fill:#1d4ed8}
.tt-editor-help{background:#eff6ff;border:1px solid #bfdbfe;border-radius:10px;padding:11px 12px;color:#334155;text-align:left}
@media(max-width:520px){.tt-editor-stage{height:390px}.tt-crop-handle{stroke-width:4}}


/* v1.2.7 precision magnifier while dragging crop corners */
.tt-crop-magnifier{position:absolute;z-index:8;width:118px;height:118px;border:4px solid #fff;border-radius:50%;overflow:hidden;background:#111827;box-shadow:0 8px 28px rgba(0,0,0,.5),0 0 0 3px #2563eb;pointer-events:none;opacity:0;transform:scale(.88);transition:opacity .1s ease,transform .1s ease}
.tt-crop-magnifier.is-visible{opacity:1;transform:scale(1)}
.tt-crop-magnifier canvas{width:100%;height:100%;display:block}
@media(max-width:520px){.tt-crop-magnifier{width:108px;height:108px;border-width:3px}}

/* v1.3.0 Sign PDF */
.tt-sign-workspace{margin-top:24px}
.tt-sign-toolbar{display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:10px;margin-bottom:14px}
.tt-sign-toolbar button,.tt-sign-actions button{border:1px solid #dbe3ef;background:#f8fafc;color:#1f2937;border-radius:10px;padding:11px 14px;font-weight:800;cursor:pointer}
.tt-sign-toolbar button:first-child{justify-self:start}.tt-sign-toolbar button:last-child{justify-self:end}
.tt-sign-toolbar button:disabled{opacity:.45;cursor:not-allowed}
.tt-sign-document-wrap{position:relative;display:inline-block;max-width:100%;background:#e5e7eb;border-radius:12px;overflow:hidden;line-height:0;touch-action:none}
#tt-sign-pdf-canvas{display:block;max-width:100%;height:auto;background:#fff}
.tt-sign-placement{position:absolute;left:15%;top:70%;width:28%;min-width:70px;max-width:60%;border:2px dashed #2563eb;background:rgba(255,255,255,.2);cursor:grab;touch-action:none;user-select:none;-webkit-user-select:none;line-height:normal}
.tt-sign-placement:active{cursor:grabbing}
.tt-sign-placement img{display:block;width:100%;height:auto;pointer-events:none}
.tt-sign-move-hint{position:absolute;right:2px;top:-24px;background:#2563eb;color:#fff;border-radius:6px;padding:3px 7px;font-size:11px;font-weight:800}
.tt-sign-actions{display:grid;grid-template-columns:auto 1fr auto;align-items:end;gap:14px;margin:18px 0}
.tt-sign-size{text-align:left;font-weight:800;color:#334155}.tt-sign-size input{display:block;width:100%;margin-top:8px}
.tt-signature-pad-wrap{border:2px solid #cbd5e1;border-radius:12px;background:#fff;overflow:hidden;margin:18px 0;touch-action:none}
#tt-signature-pad{display:block;width:100%;height:220px;touch-action:none}
@media(max-width:640px){
  .tt-sign-toolbar{grid-template-columns:1fr 1fr}.tt-sign-toolbar strong{grid-column:1/-1;grid-row:1;text-align:center}.tt-sign-toolbar button:first-child{grid-column:1;grid-row:2}.tt-sign-toolbar button:last-child{grid-column:2;grid-row:2}
  .tt-sign-actions{grid-template-columns:1fr}.tt-sign-actions button{width:100%}
  #tt-signature-pad{height:190px}
}
