.tool-engine { max-width: 1080px; margin: 0 auto; color: #25272b; }
.tool-engine .x-video-input { box-sizing: border-box; width: 100%; min-height: 44px; border: 1px solid #cbd0d6; border-radius: 6px; padding: 10px 12px; font: inherit; }
.tool-engine.x-video-tool > .tool-field { margin-bottom: 18px; }
.tool-engine .x-video-summary { overflow-wrap: anywhere; white-space: pre-wrap; font-size: 14px; }
.tool-engine .x-video-result { margin: 22px 0; }
.tool-engine .bg-previews { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 18px; margin: 22px 0; }
.tool-engine .bg-previews[hidden], .tool-engine .bg-brush-controls[hidden], .tool-engine .bg-point-fields[hidden] { display: none; }
.tool-engine .bg-previews section { min-width: 0; }
.tool-engine .bg-before, .tool-engine .bg-after { display: block; width: 100%; height: auto; border: 1px solid #dce0e5; background: repeating-conic-gradient(#eef0f2 0% 25%, #fff 0% 50%) 50% / 16px 16px; }
.tool-engine .bg-before { cursor: crosshair; }
.tool-engine .bg-after.is-painting { cursor: crosshair; touch-action: none; }
.tool-engine .bg-point-fields { margin-top: 14px; }
@media (max-width: 650px) { .tool-engine .bg-previews { grid-template-columns: minmax(0, 1fr); } }
.tool-engine.qr-tool > .tool-field, .tool-engine.qr-tool > .qr-wifi-fields { margin-bottom: 18px; }
.tool-engine .qr-input { width: 100%; box-sizing: border-box; min-height: 110px; resize: vertical; border: 1px solid #cbd0d6; border-radius: 6px; padding: 12px; font: 14px/1.7 inherit; }
.tool-engine .qr-wifi-fields { display: grid; gap: 16px; }
.tool-engine .qr-wifi-fields[hidden], .tool-engine .qr-result[hidden] { display: none; }
.tool-engine .qr-result { margin-top: 24px; padding: 20px; border: 1px solid #e1e4e8; border-radius: 8px; }
.tool-engine .qr-preview { display: block; width: auto; max-width: 100%; height: auto; max-height: 360px; image-rendering: pixelated; margin: 0 auto 18px; }
.tool-engine .qr-summary { overflow-wrap: anywhere; white-space: pre-wrap; font-size: 14px; line-height: 1.7; }
.tool-engine .qr-wifi-fields input:not([type=checkbox]) { box-sizing: border-box; width: 100%; max-width: 100%; min-height: 42px; padding: 8px 12px; border: 1px solid #cbd0d6; border-radius: 6px; font: inherit; }
.tool-engine .tool-local-note { color: #687078; font-size: 13px; margin: 0 0 22px; }
.tool-engine .tool-drop-zone { position: relative; min-height: 138px; border: 1px dashed #bdc3ca; background: #fafbfc; border-radius: 10px; display: flex; flex-direction: column; gap: 10px; align-items: center; justify-content: center; cursor: pointer; padding: 24px; }
.tool-engine .tool-drop-zone strong { font-size: 17px; }
.tool-engine .tool-drop-zone span { font-size: 13px; color: #727880; }
.tool-engine .tool-sample-button { margin-top: 12px; }
.tool-engine .tool-drop-zone:focus-within, .tool-engine .tool-drop-zone.is-over { border-color: #306bd5; outline: 2px solid #dce8ff; }
.tool-engine .tool-file-input { position: absolute; width: 1px; height: 1px; opacity: 0; }
.tool-engine .tool-settings { display: flex; align-items: end; gap: 18px; flex-wrap: wrap; margin: 26px 0 12px; }
.tool-engine .tool-field { display: flex; flex-direction: column; gap: 9px; min-width: 0; max-width: 100%; flex: 0 1 230px; font-size: 14px; }
.tool-engine .tool-field > span { font-weight: 600; }
.tool-engine select, .tool-engine input[type=number] { border: 1px solid #cbd0d6; border-radius: 6px; background: white; color: #25272b; min-height: 42px; padding: 8px 12px; font: inherit; max-width: 230px; }
.tool-engine input[type=number] { width: 160px; }
.tool-engine .tool-check { display: flex; gap: 9px; align-items: center; padding: 12px 0; font-size: 14px; }
.tool-engine input[type=checkbox] { width: 17px; height: 17px; accent-color: #306bd5; }
.tool-engine .tool-range { display: flex; gap: 12px; min-width: 0; max-width: 100%; min-height: 42px; align-items: center; }
.tool-engine input[type=range] { flex: 1 1 0; min-width: 0; width: 100%; max-width: 100%; accent-color: #306bd5; }
.tool-engine output { flex: 0 0 42px; min-width: 42px; font-size: 13px; font-variant-numeric: tabular-nums; }
.tool-engine .tool-small { color: #747a82; font-size: 12px; line-height: 1.7; margin: 12px 0 20px; }
.tool-engine .tool-status { min-height: 22px; font-size: 14px; line-height: 1.6; margin: 15px 0; overflow-wrap: anywhere; }
.tool-engine .tool-status.is-error { color: #b42327; }
.tool-engine .tool-preview-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 24px; margin: 10px 0 20px; }
.tool-engine .tool-image-panel:empty { display: none; }
.tool-engine .tool-image-panel { min-width: 0; border: 1px solid #e1e4e8; border-radius: 8px; padding: 16px; }
.tool-engine .tool-image-panel img { display: block; width: 100%; height: 250px; object-fit: contain; background: #f4f5f6; }
.tool-engine .tool-image-label { font-size: 13px; font-weight: 600; margin: 0 0 12px; }
.tool-engine .tool-image-panel .tool-small { margin-bottom: 0; }
.tool-engine .tool-output { margin: 18px 0; }
.tool-engine .tool-actions { display: flex; align-items: end; gap: 10px; flex-wrap: wrap; margin: 18px 0; }
.tool-engine .tool-textarea { display: block; resize: vertical; min-height: 200px; width: 100%; border: 1px solid #cbd0d6; border-radius: 8px; padding: 16px; font: 14px/1.7 ui-monospace, SFMono-Regular, Consolas, monospace; color: #25272b; background: #fff; }
.tool-engine textarea:focus, .tool-engine select:focus, .tool-engine input:focus-visible { outline: 2px solid #d4e2fd; outline-offset: 2px; border-color: #306bd5; }
.tool-engine textarea[readonly] { background: #fafbfc; }
.tool-engine .tool-stats { display: grid; grid-template-columns: repeat(5, 1fr); border: 1px solid #e1e4e8; border-radius: 8px; overflow: hidden; }
.tool-engine .tool-stats > div { padding: 22px 18px; border-right: 1px solid #e1e4e8; }
.tool-engine .tool-stats > div:last-child { border: 0; }
.tool-engine .tool-stats dt { color: #747a82; font-size: 12px; }
.tool-engine .tool-stats dd { font-size: 29px; font-weight: 600; margin: 12px 0 0; font-variant-numeric: tabular-nums; }
.tool-engine .tool-file-list { list-style: none; margin: 22px 0 8px; padding: 0; }
.tool-engine .tool-file-row { display: flex; gap: 12px; align-items: center; border-bottom: 1px solid #e7e9ec; padding: 12px 0; }
.tool-engine .tool-file-row img { width: 64px; height: 50px; object-fit: contain; background: #f4f5f6; }
.tool-engine .tool-file-name { flex: 1; min-width: 0; overflow-wrap: anywhere; font-size: 13px; }
.tool-engine .tool-small-button { font-size: 12px; min-height: 32px; padding: 6px 10px; }
.tool-engine .btn[hidden] { display: none; }
.tool-engine [hidden] { display: none !important; }
.tool-engine .tool-page-range { border: 1px solid #cbd0d6; border-radius: 6px; min-height: 42px; padding: 8px 12px; font: inherit; width: 100%; max-width: 100%; min-width: 0; box-sizing: border-box; }
@media (max-width: 700px) {
  .tool-engine .tool-preview-grid { grid-template-columns: 1fr; }
  .tool-engine .tool-settings { gap: 14px; }
  .tool-engine .tool-field { min-width: 0; flex: 1 1 140px; }
  .tool-engine input[type=number], .tool-engine select { max-width: 100%; width: 100%; }
  .tool-engine .tool-stats { grid-template-columns: repeat(2, 1fr); }
  .tool-engine .tool-stats > div { border-bottom: 1px solid #e1e4e8; }
  .tool-engine .tool-file-row { flex-wrap: wrap; }
  .tool-engine .tool-file-name { flex-basis: calc(100% - 80px); }
  .tool-engine .tool-file-row .btn { margin-left: 0; }
}
.tool-engine .tool-crop-canvas, .tool-engine .tool-edit-preview { display: block; max-width: 100%; height: auto; max-height: 560px; object-fit: contain; background: repeating-conic-gradient(#eef0f2 0% 25%, #fff 0% 50%) 50% / 16px 16px; border: 1px solid #dce0e5; }
.tool-engine .tool-crop-canvas { touch-action: none; cursor: crosshair; }
.tool-engine input[type=color] { width: 80px; height: 42px; padding: 4px; border: 1px solid #cbd0d6; background: #fff; border-radius: 6px; }
.tool-engine .pdf-page-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(170px, 1fr)); gap: 14px; list-style: none; padding: 0; margin: 20px 0; }
.tool-engine .pdf-page-card { min-width: 0; border: 1px solid #dfe3e7; border-radius: 8px; padding: 12px; background: #fafbfc; }
.tool-engine .pdf-page-card[draggable=true] { cursor: grab; }
.tool-engine .pdf-thumb-frame { height: 180px; display: flex; align-items: center; justify-content: center; overflow: hidden; background: #f0f2f4; }
.tool-engine .pdf-thumb-frame img { max-width: 160px; max-height: 160px; object-fit: contain; }
.tool-engine .pdf-page-label { font-size: 12px; overflow-wrap: anywhere; line-height: 1.6; }
.tool-engine .pdf-page-actions { display: flex; gap: 6px; flex-wrap: wrap; }
.tool-engine .pdf-download-list { padding-left: 20px; font-size: 13px; line-height: 2.2; overflow-wrap: anywhere; }
.tool-engine .pdf-download-list a { color: #176a4b; text-decoration: underline; }
.pdf-preview-dialog { width: min(94vw, 1000px); max-width: min(94vw, 1000px); max-height: 94vh; border: 1px solid #dfe3e7; border-radius: 10px; padding: 18px; color: #25272b; }
.pdf-preview-dialog::backdrop { background: #0008; }
.pdf-preview-head { display: flex; justify-content: space-between; align-items: center; gap: 14px; margin-bottom: 16px; }
.pdf-preview-head h2 { font-size: 15px; overflow-wrap: anywhere; min-width: 0; }
.pdf-preview-body { overflow: auto; max-height: 75vh; background: #eef0f2; text-align: center; }
.pdf-preview-body canvas { display: block; max-width: 100%; height: auto; margin: auto; }
.tool-engine .batch-progress { width: 100%; height: 8px; accent-color: #30715a; }
.tool-engine .batch-list { list-style: none; margin: 0; padding: 0; }
.tool-engine .batch-row { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 7px 18px; padding: 18px 0; border-bottom: 1px solid #e1e4e8; font-size: 13px; }
.tool-engine .batch-name { grid-column: 1; overflow-wrap: anywhere; font-size: 14px; }
.tool-engine .batch-original, .tool-engine .batch-result { grid-column: 1; color: #606871; font-variant-numeric: tabular-nums; }
.tool-engine .batch-state { grid-column: 2; grid-row: 1; align-self: start; color: #606871; }
.tool-engine .batch-row[data-state=done] .batch-state { color: #176a4b; }
.tool-engine .batch-row[data-state=unmet] .batch-state, .tool-engine .batch-row[data-state=unmet] .batch-error { color: #8a5409; }
.tool-engine .batch-row[data-state=failed] .batch-state, .tool-engine .batch-error { color: #b42327; }
.tool-engine .batch-error { grid-column: 1 / -1; margin: 0; overflow-wrap: anywhere; line-height: 1.7; }
.tool-engine .batch-row-actions { grid-column: 1 / -1; display: flex; flex-wrap: wrap; gap: 8px; margin-top: 4px; }
.batch-preview-body { text-align: center; background: repeating-conic-gradient(#eef0f2 0% 25%, #fff 0% 50%) 50% / 16px 16px; }
.batch-preview-body img { display: block; margin: auto; max-width: 100%; max-height: 75vh; width: auto; height: auto; object-fit: contain; }
@media (max-width: 450px) { .tool-engine .pdf-page-grid { grid-template-columns: 1fr; } }

.tool-engine .gif-result { display:block; width:min(100%,440px); height:auto; max-width:100%; max-height:440px; object-fit:contain; margin:18px 0; background:repeating-conic-gradient(#eef0f2 0% 25%, #fff 0% 50%) 50% / 16px 16px; }

.tool-engine .gif-quality-warning { color:#a33b17; font-weight:600; }
.redact-preview{display:block;max-width:100%;height:auto;border:1px solid #d9dce1;touch-action:none;cursor:crosshair;background:repeating-conic-gradient(#eee 0% 25%,white 0% 50%) 0 0/16px 16px}
.redact-preview[hidden],.pdf-text-preview[hidden]{display:none}
.redact-preview:focus-visible{outline:3px solid #236ac4;outline-offset:3px}
.redact-numeric{margin:16px 0;border-top:1px solid #e2e4e8;padding-top:12px}
.redact-numeric summary{cursor:pointer;margin-bottom:12px}
.pdf-text-preview{display:block;box-sizing:border-box;width:100%;resize:vertical;min-height:240px;max-height:640px;padding:16px;border:1px solid #cdd1d8;border-radius:4px;font:15px/1.65 ui-monospace,SFMono-Regular,monospace;white-space:pre-wrap;background:white;color:#26292e}
.pdf-text-warning:empty{display:none}
