/* Shared layout for the tools built into tidy.onl (crop, cover, convert). Loaded after /styles.css. */
[hidden]{display:none!important}
.visually-hidden{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
.tool-hero{padding:44px 0 26px}.tool-hero .eyebrow{margin:0}
.tool-hero h1{font-size:clamp(40px,6vw,68px);letter-spacing:-.045em;line-height:1.04;margin:14px 0 16px;text-wrap:balance}
.tool-lede{font-size:19px;line-height:1.55;color:#5a665e;max-width:44rem;margin:0}
.tool-facts{list-style:none;display:flex;flex-wrap:wrap;gap:8px 26px;padding:0;margin:22px 0 0;font-size:13px;color:#58675b}.tool-facts li::before{content:'✓';color:#537b53;margin-right:8px}
.tool{display:grid;grid-template-columns:minmax(0,1.5fr) minmax(300px,1fr);gap:22px;align-items:start;padding-bottom:48px}
.tool-stage,.tool-panel{border:1px solid #dce1d8;border-radius:15px;background:#fff;min-width:0}
.tool-stage{padding:18px}.tool-panel{padding:6px 22px 22px}
.drop{display:grid;justify-items:center;align-content:center;gap:14px;min-height:340px;padding:28px 18px;border:2px dashed #b9c5b6;border-radius:11px;background:#f7f9f4;text-align:center}
.drop.is-over{border-color:#27644e;background:#eaf1ea}
.drop-title{font-size:21px;font-weight:650;letter-spacing:-.4px;margin:0}
.drop-actions{display:flex;flex-wrap:wrap;gap:10px 18px;justify-content:center;align-items:center}
.fine{font-size:13px;line-height:1.55;color:#5a665e;margin:0}
.tool-button{font:inherit;font-size:15px;font-weight:600;color:#fff;background:#253d30;border:1px solid #253d30;border-radius:8px;padding:12px 20px;cursor:pointer;text-decoration:none;display:inline-flex;align-items:center;justify-content:center;gap:8px}
.tool-button:hover{background:#385843}.tool-button:disabled{background:#9aa69c;border-color:#9aa69c;cursor:not-allowed}
.tool-button.secondary{color:#253d30;background:#fff;border-color:#b9c5b6}.tool-button.secondary:hover{background:#f2f6f0}
.tool-button.small{font-size:14px;padding:8px 14px}.tool-button.wide{width:100%}
.tool-link{font:inherit;font-size:15px;color:#1f5a45;background:none;border:0;padding:6px 2px;text-decoration:underline;text-underline-offset:3px;cursor:pointer}
.tool-status{margin:12px 2px 0;font-size:14px;line-height:1.5;color:#3d4a43;min-height:21px}.tool-status.is-error{color:#9a3a1c;font-weight:600}
.tool-step{display:flex;align-items:baseline;gap:10px;margin:20px 0 10px;padding-top:16px;border-top:1px solid #e8eae3}
.tool-step:first-child{border-top:0;padding-top:0}
.tool-step span{font:11px/1 monospace;letter-spacing:1.5px;color:#5b6c5b}.tool-step h3{font-size:16px;margin:0;letter-spacing:-.2px}
.tool-field{display:grid;gap:5px;font-size:13px;color:#5a665e;margin:0 0 12px;min-width:0}
.tool-row{display:flex;flex-wrap:wrap;gap:10px;align-items:end}.tool-row>.tool-field{flex:1 1 84px}
.tool-panel select,.tool-panel input[type=number],.tool-panel input[type=text]{width:100%;min-width:0;font:inherit;font-size:16px;color:#17221d;padding:9px 10px;border:1px solid #c6cfc4;border-radius:8px;background:#fbfcfa}
.tool-panel input[type=range]{width:100%;accent-color:#27644e;margin:4px 0}
.tool-panel select:focus-visible,.tool-panel input:focus-visible,.tool-button:focus-visible,.tool-link:focus-visible{outline:3px solid #176654;outline-offset:2px}
.tool-radios{border:0;margin:0 0 12px;padding:0;display:flex;flex-wrap:wrap;gap:8px 18px;font-size:15px;color:#3d4a43}.tool-radios legend{font-size:13px;color:#5a665e;padding:0;margin-bottom:6px;width:100%}
.tool-radios label{display:inline-flex;gap:7px;align-items:center}.tool-radios input{accent-color:#27644e;width:17px;height:17px;margin:0}
.tool-readout{padding:16px 18px;border-radius:10px;background:#f2f6f0;margin:4px 0 0}
.tool-readout p{margin:0 0 6px;font-size:15px;line-height:1.5;color:#3d4a43}.tool-readout p:last-child{margin:0}
.tool-big{display:flex;flex-wrap:wrap;align-items:baseline;gap:8px}.tool-big strong{font-size:38px;letter-spacing:-.03em;color:#1f5a45;font-variant-numeric:tabular-nums;line-height:1.1}.tool-big span{font-size:14px;color:#5a665e}
.tool-readout dl{display:grid;grid-template-columns:auto 1fr;gap:4px 14px;margin:10px 0 0;font-size:14px}.tool-readout dt{color:#5a665e}.tool-readout dd{margin:0;font-variant-numeric:tabular-nums;color:#17221d;font-weight:600}
.tool-file{font-size:14px;line-height:1.5;color:#3d4a43;margin:0 0 10px;overflow-wrap:anywhere}
.tool-article{padding-top:8px}.tool-article article>h2:first-child{margin-top:8px}
.tool-article .faq h3{font-size:18px;margin:26px 0 6px}
.tool-links{list-style:none;padding:0!important}.tool-links li{padding:12px 16px;border:1px solid #dce1d8;border-radius:10px;background:#fff}
@media(max-width:900px){.tool{grid-template-columns:1fr}}
@media(max-width:640px){.tool-hero{padding:28px 0 20px}.tool-lede{font-size:17px}.tool-stage{padding:12px}.tool-panel{padding:4px 16px 18px}.drop{min-height:250px}.tool{gap:14px;padding-bottom:32px}}