.extra-tool {display:grid;gap:16px;min-width:0;}
.extra-tool .extra-controls {display:flex;flex-wrap:wrap;gap:12px;align-items:end;}
.extra-tool label {display:flex;flex-direction:column;gap:5px;font-size:13px;min-width:0;}
.extra-tool label:has(input[type=checkbox]) {flex-direction:row;align-items:center;}
.extra-tool input[type=number] {width:90px;max-width:100%;}
.extra-upload {display:flex;align-items:center;flex-wrap:wrap;gap:12px;padding:16px;border:1px dashed var(--border);}
.extra-upload>span {font-size:13px;color:var(--text-muted);}
.extra-tool .extra-file-input {position:absolute;width:1px;height:1px;padding:0;opacity:0;overflow:hidden;clip-path:inset(50%);}
.extra-tool select,.extra-tool input:not([type=file]) {min-height:36px;}
.extra-tool input[type=checkbox] {min-height:20px;}
.extra-tool .extra-preview {max-height:480px;overflow:auto;background:var(--panel-soft,var(--panel-bg));border:1px solid var(--border);padding:8px;}
.extra-preview img,.extra-preview video,.extra-preview canvas {display:block;max-width:100%;height:auto;margin:auto;}
.extra-files {display:grid;gap:8px;}
.extra-file {display:flex;align-items:center;gap:8px;flex-wrap:wrap;border-bottom:1px solid var(--border);padding:6px 0;}
.extra-file img {width:48px;height:48px;object-fit:contain;}
.extra-file strong {flex:1;min-width:80px;overflow-wrap:anywhere;font-size:13px;}
.extra-tool table {border-collapse:collapse;width:100%;font-size:13px;table-layout:fixed;}
.extra-tool td,.extra-tool th {padding:8px;border-bottom:1px solid var(--border);text-align:left;overflow-wrap:anywhere;}
.extra-tool th {width:32%;}
.extra-tool .extra-status {white-space:pre-wrap;overflow-wrap:anywhere;min-height:24px;}
.extra-tool .extra-status.error {color:var(--danger,#b83232);}
.extra-links {display:flex;flex-wrap:wrap;gap:8px 16px;}
.extra-seo {margin-top:20px;line-height:1.7;}
.extra-seo h2 {font-size:18px;margin:20px 0 8px;}
.extra-seo h3 {font-size:15px;}
.extra-tool [hidden] {display:none!important;}
.extra-icon-grid {display:grid;grid-template-columns:repeat(auto-fit,minmax(80px,1fr));gap:12px;}
.extra-icon-grid img {width:64px;height:64px;object-fit:contain;}
@media(max-width:600px){.extra-tool .extra-controls{gap:8px}.extra-tool .extra-preview{max-height:360px}.extra-tool .extra-file button{min-width:36px}.extra-tool label{font-size:12px}.extra-tool input[type=number]{width:72px}}
.extra-seo ol {padding-inline-start:1.5em;}
.extra-seo h3 {margin-top:16px;}

.icon-preview-panel {min-width:0;}
.icon-preview-panel h2 {font-size:18px;margin:0 0 8px;}
.icon-preview-panel>p {font-size:13px;line-height:1.6;}
.icon-preview-stage,.icon-size-image {background-color:var(--panel-bg);background-image:conic-gradient(var(--border) 25%,transparent 0 50%,var(--border) 0 75%,transparent 0);background-size:16px 16px;display:grid;place-items:center;}
.icon-preview-stage {min-height:224px;padding:16px;border:1px solid var(--border);}
.icon-preview-stage canvas {width:192px;height:192px;max-width:100%;object-fit:contain;}
.extra-icon-grid {grid-template-columns:repeat(auto-fit,minmax(84px,1fr));}
.extra-icon-grid .icon-size {display:flex;flex-direction:column;gap:8px;padding:8px;min-width:0;}
.icon-size-image {height:64px;width:100%;}
.icon-size-image canvas {max-width:64px;max-height:64px;}
.extra-tool .icon-size.active {outline:2px solid var(--primary);outline-offset:-2px;}
.extra-result-actions {display:flex;gap:12px;max-width:100%;}
.extra-result-actions>.btn {flex:1 1 0;min-width:0;white-space:normal;}
.extra-tool[data-engine=screenshot-stitch] .extra-preview img {cursor:zoom-in;}
.extra-fullscreen {position:fixed;inset:0;width:100vw;height:100dvh;max-width:none;max-height:none;margin:0;padding:0;border:0;background:var(--panel-bg,#fff);color:var(--text);}
.extra-fullscreen[open] {display:flex;flex-direction:column;}
.extra-fullscreen::backdrop {background:#000b;}
.extra-viewer-toolbar {display:flex;gap:12px;justify-content:flex-end;padding:12px;padding-top:max(12px,env(safe-area-inset-top));border-bottom:1px solid var(--border);}
.extra-viewer-scroll {flex:1;min-height:0;overflow:auto;padding:12px;}
.extra-viewer-scroll img {display:block;max-width:100%;max-height:100%;width:auto;height:auto;margin:auto;object-fit:contain;}
.extra-fullscreen.actual img {max-width:none;max-height:none;margin:0 auto;}
#gif-original-width,#gif-video-timing {font-size:12px;color:var(--text-muted);}
.extra-upload>span {line-height:1.65;flex:1 1 260px;}
.extra-thumbnails {display:flex;flex-wrap:wrap;gap:12px;align-items:flex-start;}
.extra-tool .extra-thumbnail {position:relative;padding:6px;width:132px;height:104px;flex:0 0 auto;touch-action:none;user-select:none;cursor:grab;border:1px solid var(--border);background:var(--panel-bg);}
.extra-thumbnail img,.extra-thumbnail video {display:block;width:100%;height:100%;object-fit:contain;pointer-events:none;}
.extra-tool .extra-thumbnail.selected {outline:2px solid var(--primary);outline-offset:-2px;}
.extra-thumbnail.dragging {opacity:.25;}
.extra-drag-ghost {position:fixed!important;z-index:99999;pointer-events:none;transform:translate(-50%,-50%) scale(1.04);opacity:.9;box-shadow:0 6px 24px #0004;}
.extra-sr-only {position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);}
#extra-remove {justify-self:start;}
.gif-grid-settings {align-items:center!important;}
.gif-grid-settings label {flex-direction:row;align-items:center;}
.extra-tool[data-engine=gif-maker] .extra-preview {height:480px;max-height:60vh;overflow:hidden;display:flex;align-items:center;justify-content:center;}
.extra-tool[data-engine=gif-maker] .extra-preview img,.extra-tool[data-engine=gif-maker] .extra-preview video {width:100%;height:100%;max-width:100%;max-height:100%;object-fit:contain;}
.extra-tool[data-engine=gif-maker] #extra-download {justify-self:start;}
.extra-engine-status {font-size:13px;color:var(--text-muted);margin:0;}
@media(max-width:600px){.extra-tool .extra-thumbnail{width:100px;height:82px}.extra-thumbnails{gap:8px}.gif-grid-settings{gap:8px}.gif-grid-settings strong{font-size:13px}.extra-tool[data-engine=gif-maker] .extra-preview{height:360px}}
@media(prefers-reduced-motion:reduce){.extra-thumbnail{animation:none!important;transition:none!important}}
.gif-grid-settings:has(input:disabled) {opacity:.45;}

/* Stitch: document-length mobile preview; a separate right-hand pane when space permits. */
.extra-sort-hint {margin:0;color:var(--text-muted);font-size:13px;}
.stitch-editor {display:grid;gap:16px;min-width:0;}
.extra-tool[data-engine=screenshot-stitch] {align-content:start;}
.extra-tool[data-engine=screenshot-stitch] .extra-result-actions {width:272px;max-width:100%;align-self:start;}
.extra-tool[data-engine=screenshot-stitch] .extra-result-actions>.btn {min-width:0;width:130px;min-height:40px;}
.extra-tool[data-engine=screenshot-stitch] .extra-status:empty {display:none;}
.extra-tool[data-engine=screenshot-stitch] .extra-preview {max-height:none;overflow:visible;min-width:0;}
.extra-tool[data-engine=screenshot-stitch] .extra-preview img {width:100%;height:auto;max-height:none;}
@media(max-width:999px){
 .extra-tool[data-engine=screenshot-stitch].has-result .extra-result-actions {position:sticky;top:0;z-index:10;background:var(--panel-bg);padding:8px 0;}
}
@media(min-width:1000px){
 .extra-tool[data-engine=screenshot-stitch].has-result {grid-template-columns:minmax(280px,1fr) minmax(0,1.2fr);grid-template-rows:auto auto 1fr;}
 .extra-tool[data-engine=screenshot-stitch] .stitch-editor {grid-column:1;grid-row:1;}
 .extra-tool[data-engine=screenshot-stitch] .extra-result-actions {grid-column:1;grid-row:2;}
 .extra-tool[data-engine=screenshot-stitch] .extra-status {grid-column:1;grid-row:3;}
 .extra-tool[data-engine=screenshot-stitch].has-result .extra-preview {grid-column:2;grid-row:1 / 4;max-height:calc(100dvh - 150px);overflow:auto;overscroll-behavior:contain;align-self:start;}
}

#watermark-text {width:min(360px,100%);min-width:0;}
.extra-tool[data-engine=watermark-image] .extra-preview {max-height:none;overflow:visible;}
.extra-tool[data-engine=watermark-image] .extra-preview img {max-height:65vh;object-fit:contain;}