.file-list{list-style:none;margin:16px 0 0;padding:0;border:1px solid #dce4ef;border-radius:12px;max-height:280px;overflow:auto}
.file-list li{display:flex;align-items:center;gap:8px;padding:8px 12px;border-top:1px solid #eef2f7}.file-list li:first-child{border-top:0}
.file-list .file-name{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:.9rem}
.file-list .hint{margin:0;white-space:nowrap}
button.icon{padding:6px 10px;font-size:.9rem;min-width:34px}
.add-files{display:inline-block;margin-top:10px;font-size:.9rem;font-weight:bold;color:#0e806f;cursor:pointer;position:relative}
.add-files input{position:absolute;inset:0;opacity:0;cursor:pointer;width:100%}
.add-files:focus-within{outline:3px solid #e59b16;outline-offset:3px;border-radius:6px}
.tool-settings{margin-top:22px;padding:20px;background:#f2f7fa;border-radius:14px;border:1px solid #cdddea}
.tool-settings label{display:block;font-size:.9rem;font-weight:bold;margin-bottom:12px}
.tool-settings input:not([type=range]):not([type=checkbox]){display:block;width:100%;font-size:1rem;padding:13px;border:1px solid #becbdc;border-radius:10px;margin-top:10px;background:#fff;color:#183153}
.range-label input[type=range]{display:block;width:100%;margin-top:10px;accent-color:#0e806f}
.range-label output{font-weight:normal;color:#52647c}
.zoom-controls{display:flex;flex-wrap:wrap;align-items:center;gap:8px;margin:12px 0 4px;font-size:.9rem}
.zoom-controls button{padding:6px 12px;font-size:.9rem}.zoom-controls button[aria-pressed=true]{background:#183153;color:#fff}
.zoom-controls .hint{margin:0;flex-basis:100%}
.comparison-frame{touch-action:pan-y}.comparison-frame.zoomed{cursor:grab;touch-action:none}.comparison-frame.zoomed:active{cursor:grabbing}
.comparison-frame .cmp-img{position:absolute;inset:0;width:100%;height:100%;object-fit:fill;transform-origin:0 0;transform:translate(var(--tx,0),var(--ty,0)) scale(var(--z,1));user-select:none;-webkit-user-drag:none;pointer-events:none}
.comparison-frame .after-clip{position:absolute;inset:0;clip-path:inset(0 0 0 var(--split));overflow:hidden}
.comparison-frame #after-image{clip-path:none}
.comparison-frame.zoomed .cmp-img{image-rendering:auto}
#result-summary:empty{display:none}#result-summary{font-weight:bold;color:#0e806f}
.tools-section{margin-top:64px}.tools-section>h2{text-align:center;font-size:1.8rem;margin-bottom:6px}.tools-section>p{text-align:center;margin-top:0}
.tool-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(210px,1fr));gap:14px;margin-top:24px}
.tool-card{display:flex;flex-direction:column;gap:6px;padding:18px;background:#fff;border:1px solid #dce4ef;border-radius:14px;text-decoration:none;color:#183153;transition:border-color .15s,transform .15s}
.tool-card:hover{border-color:#0e806f;transform:translateY(-2px)}.tool-card strong{font-size:1.02rem}.tool-card span:last-child{font-size:.85rem;color:#52647c;line-height:1.45}
.tool-icon{font-size:1.4rem}
.qr-section{max-width:760px;margin:44px auto 0;background:#fff;padding:30px;border:1px solid #dce4ef;border-radius:20px}.qr-section h2{margin-top:0;font-size:1.8rem}
.qr-grid{display:grid;grid-template-columns:1fr 1fr;gap:24px;align-items:start}
.qr-section label{display:block;font-size:.9rem;font-weight:bold;margin-bottom:12px}
.qr-section textarea{display:block;width:100%;min-height:110px;margin-top:8px;padding:12px;font:inherit;border:1px solid #becbdc;border-radius:10px;color:#183153;resize:vertical}
.qr-section input[type=color]{display:block;width:100%;height:46px;margin-top:10px;padding:4px;border:1px solid #becbdc;border-radius:10px;background:#fff}
.qr-preview canvas{width:100%;max-width:320px;height:auto;border:1px solid #dce4ef;border-radius:12px;display:block;margin:0 auto 12px}
.tool-steps{max-width:760px;margin:40px auto 0}.tool-steps ol{padding-inline-start:22px;line-height:1.7;color:#52647c}
.tool-faq details{border-bottom:1px solid #dce4ef;padding:16px 0}.tool-faq summary{cursor:pointer;font-weight:600;line-height:1.5}.tool-faq p{line-height:1.7;color:#52647c}.tool-faq summary:focus-visible{outline:3px solid #087f70;outline-offset:4px}
@media(max-width:650px){.qr-grid{grid-template-columns:1fr}.qr-section{padding:20px}.tool-settings{padding:16px}}