:root{color:#17212b;background:#f7f8fa;font-family:system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif;font-synthesis:none;line-height:1.6}*{box-sizing:border-box}[hidden]{display:none!important}body{margin:0}img,canvas{max-width:100%}:focus-visible{outline:3px solid #ef8b17;outline-offset:3px}a{color:#155bd7}a:hover{color:#0a3e9b}.container{width:min(70rem,calc(100% - 2rem));margin-inline:auto}.site-header{background:#fff;border-bottom:1px solid #dfe3e8}.header-inner{display:flex;align-items:center;justify-content:space-between;gap:1.25rem;padding-block:1rem}.brand{color:#17212b;font-size:1.15rem;font-weight:750;text-decoration:none;white-space:nowrap}.site-nav ul{display:flex;flex-wrap:wrap;gap:.3rem 1rem;margin:0;padding:0;list-style:none}.site-nav a{display:inline-block;padding-block:.55rem;color:#394553;text-decoration:none}.site-nav a:hover,.site-nav a[aria-current=page]{color:#155bd7;text-decoration:underline;text-underline-offset:.25em}main{min-height:calc(100vh - 12rem)}.hero{padding-block:clamp(3.5rem,9vw,7rem);text-align:center}.hero h1,.page-intro h1{margin:0;font-size:clamp(2rem,5vw,3.75rem);line-height:1.1}.hero p{max-width:42rem;margin:1.25rem auto 0;font-size:1.2rem}.privacy-note{display:inline-block;margin-top:2rem;padding:.75rem 1rem;border-radius:.5rem;background:#e8f2ff;color:#0a3e72;font-weight:700}.tools{padding-bottom:4rem}.tools h2{margin-top:0}.tool-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,15rem),1fr));gap:1rem;padding:0;list-style:none}.tool-card{display:block;height:100%;padding:1.25rem;border:1px solid #dfe3e8;border-radius:.75rem;background:#fff;color:inherit;text-decoration:none}.tool-card:hover{border-color:#8bb4ee;color:inherit}.tool-card strong{display:block;margin-bottom:.4rem;font-size:1.1rem}.page-intro{max-width:48rem;padding-block:clamp(3rem,8vw,6rem)}.page-intro p{font-size:1.15rem}.placeholder{margin-top:2rem;padding:1.25rem;border:1px dashed #9ca7b3;border-radius:.75rem;background:#fff}.tool-page{padding-bottom:4rem}.content-page{max-width:52rem;padding-block:clamp(2.5rem,7vw,5rem)}.content-page h1{margin-top:0;font-size:clamp(2rem,5vw,3.25rem);line-height:1.1}.content-page h2{margin-top:2rem}.tool-guide{max-width:52rem;padding-block:2.5rem 0}.tool-guide h2{margin-top:1.75rem}.related-tools{padding:1rem;border-left:.25rem solid #8bb4ee;background:#f1f6ff}.tool-intro{max-width:48rem;padding-block:2.5rem 1.5rem}.tool-intro h1{margin:0;font-size:clamp(2rem,5vw,3.25rem);line-height:1.1}.tool-intro>p{font-size:1.1rem}.tool-intro .local-note{font-size:1rem;font-weight:700;color:#0a5b42}.compress-workspace,.resize-workspace,.convert-workspace,.batch-workspace,.crop-workspace{display:grid;gap:1rem}.panel{padding:clamp(1rem,3vw,1.75rem);border:1px solid #dfe3e8;border-radius:.75rem;background:#fff}.panel h2{margin-top:0}.drop-zone{display:grid;place-items:center;gap:.35rem;min-height:11rem;padding:1.5rem;border:2px dashed #7f91a5;border-radius:.65rem;text-align:center;cursor:pointer}.drop-zone:hover,.drop-zone:focus-within,.drop-zone.is-dragging,.visually-hidden:focus-visible+.drop-zone{border-color:#155bd7;background:#f1f6ff;outline:3px solid #ef8b17;outline-offset:3px}.button-like,.primary-button,.secondary-button{display:inline-block;border-radius:.45rem;padding:.65rem 1rem;font:inherit;font-weight:700;text-decoration:none;cursor:pointer}.button-like,.primary-button{border:1px solid #155bd7;background:#155bd7;color:#fff}.primary-button:hover{background:#0a3e9b;color:#fff}.primary-button:disabled{border-color:#9ca7b3;background:#9ca7b3;cursor:not-allowed}.secondary-button{border:1px solid #7f91a5;background:#fff;color:#17212b}.visually-hidden{position:absolute;width:1px;height:1px;padding:0;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}.help-text{margin-bottom:0;color:#596675;font-size:.92rem}.media-panel,.result-panel{display:grid;grid-template-columns:minmax(12rem,1fr) minmax(15rem,1fr);gap:1.5rem;align-items:start}.image-preview{display:block;width:100%;max-height:24rem;border-radius:.5rem;background:#eef0f3;object-fit:contain}.detail-list{margin:0}.detail-list div{display:grid;grid-template-columns:minmax(7rem,1fr) 2fr;gap:.75rem;padding-block:.55rem;border-bottom:1px solid #e8ebee}.detail-list dt{font-weight:700}.detail-list dd{margin:0;overflow-wrap:anywhere}.settings-grid{display:grid;grid-template-columns:minmax(8rem,2fr) minmax(6rem,1fr) minmax(10rem,2fr);gap:1rem}.settings-grid label{display:block;margin-bottom:.25rem;font-weight:700}.settings-grid input,.settings-grid select{width:100%;min-height:2.75rem;padding:.45rem .6rem;border:1px solid #7f91a5;border-radius:.35rem;background:#fff;color:inherit;font:inherit}.dimension-grid,.output-settings{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,13rem),1fr));gap:1rem;margin-bottom:1rem}.dimension-grid label,.output-settings label{display:block;margin-bottom:.25rem;font-weight:700}.dimension-grid input,.output-settings select{width:100%;min-height:2.75rem;padding:.45rem .6rem;border:1px solid #7f91a5;border-radius:.35rem;background:#fff;color:inherit;font:inherit}.output-settings{margin-top:1.25rem}.output-settings input[type=range]{width:100%}.output-settings input[type=color]{width:4rem;height:2.75rem;padding:.2rem;border:1px solid #7f91a5;border-radius:.35rem;background:#fff}.checkbox-label{display:inline-flex;align-items:center;gap:.5rem;font-weight:700}.warning,.result-note{padding:.75rem;border-radius:.4rem;background:#fff4d6;color:#654700}.info-note{padding:.75rem;border-radius:.4rem;background:#e8f2ff;color:#0a3e72}.status{min-height:1.6em;font-weight:700}.status[data-kind=error]{color:#a11919}.status[data-kind=success]{color:#0a6848}.status[data-kind=warning]{color:#745000}.action-row{display:flex;flex-wrap:wrap;gap:.75rem;margin-top:1rem}.section-heading-row{display:flex;align-items:center;justify-content:space-between;gap:1rem}.section-heading-row h2{margin-bottom:0}.text-button{display:inline-flex;align-items:center;min-height:2.75rem;border:0;padding:.5rem;background:transparent;color:#155bd7;font:inherit;text-decoration:underline;cursor:pointer}.text-button:disabled{color:#7f91a5;cursor:not-allowed}.batch-list{display:grid;gap:.5rem;margin:1rem 0 0;padding:0;list-style:none}.batch-row{display:grid;grid-template-columns:minmax(10rem,2fr) minmax(10rem,2fr) auto;gap:1rem;align-items:center;padding:.8rem;border:1px solid #e1e5e9;border-radius:.45rem}.batch-row>div:first-child{min-width:0}.batch-row strong,.batch-row span{display:block;overflow-wrap:anywhere}.batch-row-actions{display:flex;flex-wrap:wrap;gap:.6rem}.batch-row-actions a{display:inline-flex;align-items:center;min-height:2.75rem;padding-inline:.5rem}.batch-item-status--failed{color:#a11919}.batch-item-status--success{color:#0a6848}.summary-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(8rem,1fr));gap:1rem}.summary-grid div{padding:.75rem;border-radius:.4rem;background:#f3f5f7}.summary-grid dt{font-weight:700}.summary-grid dd{margin:.25rem 0 0;font-size:1.1rem}.source-inline{display:flex;flex-wrap:wrap;gap:.5rem 1.5rem;margin:0 0 1rem}.source-inline div{display:flex;gap:.4rem}.source-inline dt{font-weight:700}.source-inline dd{margin:0;overflow-wrap:anywhere}.crop-stage{min-height:20rem;max-height:70vh;overflow:hidden;background:#252a30}.crop-stage img{display:block;max-width:100%}.crop-controls{display:grid;grid-template-columns:minmax(10rem,1fr) minmax(18rem,3fr);gap:1rem;margin-top:1rem}.crop-controls label,.crop-controls legend{font-weight:700}.crop-controls select,.coordinate-grid input{width:100%;min-height:2.75rem;padding:.45rem .6rem;border:1px solid #7f91a5;border-radius:.35rem;background:#fff;color:inherit;font:inherit}.crop-controls fieldset{margin:0;border:1px solid #cbd2d9;border-radius:.45rem}.coordinate-grid{display:grid;grid-template-columns:repeat(4,minmax(5rem,1fr));gap:.75rem;margin-bottom:.75rem}.site-footer{border-top:1px solid #dfe3e8;background:#fff}.site-footer .container{padding-block:1.5rem}.site-footer p{margin:0}.footer-inner{display:flex;align-items:center;justify-content:space-between;gap:1rem 2rem}.site-footer ul{display:flex;flex-wrap:wrap;gap:.5rem 1rem;margin:0;padding:0;list-style:none}@media(max-width:48rem){.header-inner,.footer-inner{align-items:flex-start;flex-direction:column}.site-nav ul{gap:.5rem 1rem}.media-panel,.result-panel{grid-template-columns:1fr}.settings-grid{grid-template-columns:2fr 1fr}.settings-grid>:last-child{grid-column:1 / -1}.batch-row{grid-template-columns:1fr;gap:.4rem}.crop-controls{grid-template-columns:1fr}.coordinate-grid{grid-template-columns:repeat(2,1fr)}}@media(max-width:30rem){.container{width:min(100% - 1rem,70rem)}.panel{padding:1rem}.settings-grid{grid-template-columns:1fr}.settings-grid>:last-child{grid-column:auto}.action-row>*{width:100%;text-align:center}.crop-stage{min-height:14rem}}