.new-tool{max-width:1160px;margin:auto;padding:32px 24px 64px}.new-tool h1{font-size:40px;margin:16px 0}.new-tool .intro{max-width:72ch;color:#4b5563;line-height:1.6;margin-bottom:24px}.new-upload{display:flex;gap:16px;align-items:center;flex-wrap:wrap;padding:20px;border:1px dashed #6b7280;border-radius:12px;margin-bottom:24px}.new-upload.dragover{border-color:#2563eb;background:#eff6ff}.new-workspace{display:grid;grid-template-columns:minmax(0,1fr) 300px;gap:24px}.new-preview{display:grid;grid-template-columns:1fr 1fr;gap:16px}.new-preview figure{margin:0;min-width:0}.new-preview figcaption{font-size:14px;font-weight:600;margin-bottom:8px}.new-preview img{display:block;width:100%;height:320px;object-fit:contain;background:#f9fafb;border:1px solid #e5e7eb;border-radius:12px}.new-panel{background:#f9fafb;border:1px solid #e5e7eb;border-radius:12px;padding:20px;display:flex;flex-direction:column;gap:16px}.new-panel label{display:flex;flex-direction:column;gap:8px;font-size:14px;font-weight:600}.new-panel select,.new-panel input:not([type=range]){width:100%;min-height:44px;border:1px solid #6b7280;border-radius:8px;background:white;padding:8px}.new-panel input[type=range]{width:100%;min-height:44px;accent-color:#2563eb}.new-tool button{min-height:44px;padding:10px 16px;border:1px solid #6b7280;border-radius:10px;background:white;color:#111827;font:600 16px system-ui;cursor:pointer}.new-tool button:disabled{opacity:.5;cursor:default}.new-tool #downloadButton{background:#2563eb;color:white;border-color:#2563eb}.new-tool button:focus-visible,.new-tool input:focus-visible,.new-tool select:focus-visible{outline:2px solid #2563eb;outline-offset:3px}.new-status{min-height:24px;color:#4b5563;font-size:14px;line-height:1.5}.new-tool section.explain{margin-top:56px;max-width:74ch}.new-tool section.explain h2{font-size:24px}.merge-list{list-style:none;margin:0;padding:0;display:grid;gap:8px}.merge-list li{display:flex;gap:8px;align-items:center;border-bottom:1px solid #e5e7eb;padding:8px 0}.merge-list img{width:56px;height:56px;object-fit:contain}.merge-list span{flex:1;overflow-wrap:anywhere;min-width:0;font-size:14px}.merge-list button{font-size:14px;padding:8px}.new-preview.merge-preview{display:block}.new-preview.merge-preview img{height:420px}.new-related{display:flex;flex-wrap:wrap;gap:20px}.new-tool [hidden]{display:none!important}@media(max-width:860px){.new-tool{padding:24px 16px 48px}.new-tool h1{font-size:32px}.new-workspace{grid-template-columns:1fr}.new-preview img{height:240px}.new-preview.merge-preview img{height:320px}.new-panel{padding:16px}.merge-list{margin-bottom:24px}}@media(max-width:480px){.new-preview{grid-template-columns:1fr}.new-preview img{height:220px}.merge-list li{flex-wrap:wrap}}

/* Same preview geometry and mobile save behavior as the established editors. */
.new-tool .new-preview img{height:auto;aspect-ratio:16/9;object-fit:contain}.new-tool .tool-download{margin:0}.new-tool .tool-download label{display:flex}.new-tool .tool-download button{width:100%}.new-tool .related-grid img{width:100%;aspect-ratio:16/9;object-fit:contain}
@media(max-width:860px){.new-preview{grid-template-columns:1fr}.new-tool #editor{padding-bottom:144px}.new-tool .tool-download.tool-save-visible{max-width:none}.new-tool .new-preview img{height:auto}}
@media(max-width:860px) and (max-height:500px){.new-tool #editor{padding-bottom:0}}

.new-tool .new-panel .check-label{flex-direction:row;align-items:center;min-height:44px;gap:12px}.new-tool .new-panel input[type=checkbox]{width:20px;min-height:20px;height:20px;flex:0 0 20px;accent-color:#2563eb}.new-help{font-size:14px;color:#4b5563;line-height:1.5}.split-tiles{margin-top:32px}.tile-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(120px,1fr));gap:16px}.tile-grid figure{margin:0;min-width:0}.tile-grid img{display:block;width:100%;height:120px;object-fit:contain;background:#f9fafb;border:1px solid #e5e7eb;border-radius:8px}.tile-grid a{display:block;min-height:44px;padding:8px 0;color:#2563eb;font-size:14px}.tile-grid a[aria-disabled=true]{color:#4b5563;pointer-events:none}

/* Compact related tools: this route sheet does not load effect-tools.css. */
.image-tool-site .new-tool .tool-related{padding:24px 0;margin-top:32px}
.image-tool-site .new-tool .tool-related>h2{font-size:22px;text-align:left;margin:0 0 16px}
.image-tool-site .new-tool .tool-related .related-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;margin:0;padding:0}
.image-tool-site .new-tool .tool-related article{padding:12px;min-width:0}
.image-tool-site .new-tool .tool-related article>a{display:grid;grid-template-columns:64px minmax(0,1fr);gap:4px 12px;align-content:start;height:100%}
.image-tool-site .new-tool .tool-related article img{grid-row:1/3;width:64px;height:64px;aspect-ratio:1;object-fit:contain;margin:0}
.image-tool-site .new-tool .tool-related article h3{font-size:16px;line-height:1.35;margin:0}
.image-tool-site .new-tool .tool-related article p{font-size:13px;line-height:1.5;margin:0;color:#4b5563}
.image-tool-site .new-tool .tool-related article>a:focus-visible{outline:2px solid #2563eb;outline-offset:4px;border-radius:8px}
@media(max-width:860px){.image-tool-site .new-tool .tool-related .related-grid{grid-template-columns:1fr;gap:12px}}

/* Readable comparison tables within utility-page explanatory copy. */
.image-tool-site .tool-copy-table{max-width:100%;overflow-x:auto;margin:24px 0;border:1px solid var(--line);border-radius:8px}
.image-tool-site .tool-copy-table:focus-visible{outline:2px solid #2563eb;outline-offset:4px}
.image-tool-site .tool-copy-table table{width:100%;border-collapse:collapse;font-size:14px;line-height:1.6;text-align:left}
.image-tool-site .tool-copy-table caption{text-align:left;padding:12px 16px;font-weight:600;background:var(--soft)}
.image-tool-site .tool-copy-table th,.image-tool-site .tool-copy-table td{padding:12px 16px;vertical-align:top;border-top:1px solid var(--line);min-width:120px;overflow-wrap:break-word}
.image-tool-site .tool-copy-table thead th{background:var(--soft);font-weight:600}
