/* Image cropper (#60) */
.container--image-cropper{max-width:1440px;min-width:0}
.image-cropper-intro{max-width:860px}
.image-cropper-loader,.image-cropper-editor-panel,.image-cropper-settings-card,.image-cropper-result-panel{min-width:0}
.image-cropper-loader>h2,.image-cropper-settings-card>h2,.image-cropper-result-panel>h2{margin-top:0}
.image-cropper-drop-zone{display:flex;min-height:250px;align-items:center;justify-content:center;flex-direction:column;gap:.55rem;padding:1.5rem;border:2px dashed #83aaa5;border-radius:18px;background:#f5fbfa;color:#284b47;text-align:center;cursor:pointer;transition:border-color .15s ease,background .15s ease}
.image-cropper-drop-zone:hover,.image-cropper-drop-zone:focus-within,.image-cropper-drop-zone.is-dragging{border-color:#146b63;background:#eaf7f5}
.image-cropper-drop-zone.is-dragging{box-shadow:inset 0 0 0 3px rgba(20,107,99,.14)}
.image-cropper-drop-zone__icon{display:grid;width:54px;height:54px;place-items:center;border-radius:50%;background:#146b63;color:#fff;font-size:2rem;font-weight:400;line-height:1}
.image-cropper-drop-zone__title{font-size:1.15rem;font-weight:800}
.image-cropper-drop-zone__help,.image-cropper-support{color:#586d69;font-size:.9rem}
.image-cropper-support{margin:.8rem 0 0}
.image-cropper-error{margin:.8rem 0 0;padding:.75rem .9rem;border-left:4px solid #b42318;border-radius:8px;background:#fff3f2;color:#8e1b12;font-weight:700}
.image-cropper-status{min-height:1.5em;margin:.65rem 0 0;color:#315d57;font-weight:700}
.image-cropper-workspace{display:grid;grid-template-columns:minmax(0,1.45fr) minmax(340px,.72fr);gap:1rem;align-items:start;margin:1rem 0;min-width:0}
.image-cropper-editor-panel,.image-cropper-settings{display:grid;gap:1rem;min-width:0}
.image-cropper-heading{display:flex;align-items:flex-start;justify-content:space-between;gap:1rem}
.image-cropper-heading h2,.image-cropper-heading p{margin:0}
.image-cropper-heading p{margin-top:.25rem;color:#586d69}
.image-cropper-file-info,.image-cropper-result-details{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.65rem;margin:0}
.image-cropper-file-info div,.image-cropper-result-details div{min-width:0;padding:.7rem .8rem;border:1px solid #d4e3e0;border-radius:10px;background:#f7fbfa}
.image-cropper-file-info dt,.image-cropper-result-details dt{color:#59706c;font-size:.78rem;font-weight:800}
.image-cropper-file-info dd,.image-cropper-result-details dd{margin:.2rem 0 0;overflow-wrap:anywhere;color:#193f3b;font-weight:750}
.image-cropper-editor-toolbar{display:flex;align-items:end;justify-content:space-between;gap:1rem;min-width:0}
.image-cropper-editor-toolbar label{display:grid;gap:.35rem;min-width:13rem;color:#294943;font-weight:800}
.image-cropper-editor-toolbar select,.image-cropper-output-settings select,.image-cropper-coordinate-grid input,.image-cropper-custom-ratio input{width:100%;max-width:100%;min-width:0;min-height:44px;padding:.55rem .65rem;border:1px solid #9dbab5;border-radius:9px;background:#fff;color:#183d39;font:inherit}
.image-cropper-editor-toolbar p{margin:0;color:#586d69;font-size:.88rem}
.image-cropper-viewport{width:100%;max-width:100%;height:min(68vh,720px);min-height:340px;overflow:auto;overscroll-behavior:contain;padding:12px;border:1px solid #b9cfcb;border-radius:14px;background:#19211f}
.image-cropper-stage{position:relative;min-width:1px;min-height:1px;margin:auto;overflow:hidden;background:#26302e;box-shadow:0 8px 26px rgba(0,0,0,.28)}
.image-cropper-preview{display:block;width:100%;height:100%;pointer-events:none;user-select:none}
.image-cropper-selection{position:absolute;z-index:2;box-sizing:border-box;border:2px solid #fff;outline:1px solid rgba(20,107,99,.95);box-shadow:0 0 0 9999px rgba(0,0,0,.58);cursor:move;touch-action:none}
.image-cropper-selection::before,.image-cropper-selection::after{content:"";position:absolute;inset:0;pointer-events:none;background-image:linear-gradient(90deg,transparent 33.1%,rgba(255,255,255,.7) 33.3%,rgba(255,255,255,.7) 33.6%,transparent 33.8%,transparent 66.2%,rgba(255,255,255,.7) 66.4%,rgba(255,255,255,.7) 66.7%,transparent 66.9%)}
.image-cropper-selection::after{transform:rotate(90deg)}
.image-cropper-selection:focus-visible{outline:4px solid #f5ad32;outline-offset:3px}
.image-cropper-selection.is-dragging{cursor:grabbing}
.crop-handle{position:absolute;z-index:3;display:block;width:22px;height:22px;border:3px solid #fff;border-radius:50%;background:#146b63;box-shadow:0 1px 5px rgba(0,0,0,.45)}
.crop-handle--nw{top:0;left:0;transform:translate(-50%,-50%);cursor:nwse-resize}.crop-handle--n{top:0;left:50%;transform:translate(-50%,-50%);cursor:ns-resize}.crop-handle--ne{top:0;right:0;transform:translate(50%,-50%);cursor:nesw-resize}.crop-handle--e{top:50%;right:0;transform:translate(50%,-50%);cursor:ew-resize}.crop-handle--se{right:0;bottom:0;transform:translate(50%,50%);cursor:nwse-resize}.crop-handle--s{bottom:0;left:50%;transform:translate(-50%,50%);cursor:ns-resize}.crop-handle--sw{bottom:0;left:0;transform:translate(-50%,50%);cursor:nesw-resize}.crop-handle--w{top:50%;left:0;transform:translate(-50%,-50%);cursor:ew-resize}
.image-cropper-editor-help{margin:0;color:#586d69;font-size:.9rem}
.image-cropper-settings{position:sticky;top:1rem}
.image-cropper-settings-card{padding:1rem}
.image-cropper-settings-card>p{margin:.35rem 0 .8rem;color:#586d69;font-size:.9rem}
.image-cropper-ratios{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.55rem;margin:0;padding:0;border:0}
.image-cropper-ratios legend{margin-bottom:.5rem;color:#294943;font-weight:800}
.image-cropper-ratios label{display:flex;min-width:0;min-height:44px;align-items:center;gap:.45rem;padding:.55rem .65rem;border:1px solid #c9dcd8;border-radius:9px;background:#fff;font-weight:700;cursor:pointer}
.image-cropper-ratios label:has(input:checked){border-color:#146b63;background:#e9f6f4;color:#0d514a}
.image-cropper-ratios input{width:1.15rem;height:1.15rem;accent-color:#146b63}
.image-cropper-custom-ratio{display:grid;grid-template-columns:minmax(0,1fr) auto minmax(0,1fr);align-items:end;gap:.55rem;margin-top:.7rem}
.image-cropper-custom-ratio label,.image-cropper-coordinate-grid label,.image-cropper-output-settings label{display:grid;gap:.35rem;min-width:0;color:#294943;font-weight:750}
.image-cropper-small-actions{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:.5rem;margin-top:.8rem}
.image-cropper-small-actions button{min-width:0;padding-inline:.5rem}
.image-cropper-coordinate-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.65rem;margin-bottom:.7rem}
.image-cropper-coordinate-grid [aria-invalid=true]{border-color:#b42318;background:#fff5f4;box-shadow:0 0 0 2px rgba(180,35,24,.12)}
.image-cropper-settings-card .form-message{margin:.45rem 0;color:#b42318;font-weight:750}
.image-cropper-settings-card form>.button{width:100%}
.image-cropper-output-settings{display:grid;gap:.75rem}
.image-cropper-output-settings input[type=range]{width:100%;accent-color:#146b63}
.image-cropper-output-settings input[type=color]{width:100%;height:44px;padding:.25rem;border:1px solid #9dbab5;border-radius:9px;background:#fff}
.image-cropper-create-actions{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.6rem;margin-top:.2rem}
.image-cropper-create{width:100%;min-width:0;min-height:48px}
.image-cropper-result-panel{margin:1rem 0}
.image-cropper-result{display:grid;grid-template-columns:minmax(220px,.7fr) minmax(0,1fr);gap:1rem;align-items:start}
.image-cropper-result-preview-wrap{display:grid;min-height:220px;place-items:center;overflow:auto;padding:.8rem;border-radius:12px;background:repeating-conic-gradient(#e5ecea 0 25%,#fff 0 50%) 50%/20px 20px}
.image-cropper-result-preview-wrap img{display:block;max-width:100%;max-height:520px;height:auto;object-fit:contain}
.image-cropper-result-details{align-self:start}
.image-cropper-result>p,.image-cropper-result>.button{grid-column:2}
.image-cropper-result>p{margin:0;color:#4f6864}
.image-cropper-result>.button{justify-self:start}
.image-cropper-guide code{overflow-wrap:anywhere}
.image-cropper-faq{display:grid;gap:.65rem}
@media(max-width:1050px){.image-cropper-workspace{grid-template-columns:1fr}.image-cropper-settings{position:static;grid-template-columns:repeat(2,minmax(0,1fr))}.image-cropper-settings-card:last-child{grid-column:1/-1}}
@media(max-width:720px){.image-cropper-heading,.image-cropper-editor-toolbar{align-items:stretch;flex-direction:column}.image-cropper-heading button{width:100%}.image-cropper-editor-toolbar label{min-width:0}.image-cropper-settings{grid-template-columns:1fr}.image-cropper-settings-card:last-child{grid-column:auto}.image-cropper-result{grid-template-columns:1fr}.image-cropper-result>p,.image-cropper-result>.button{grid-column:auto}.image-cropper-result>.button{width:100%}.image-cropper-viewport{height:58vh;min-height:300px}}
@media(max-width:480px){.container--image-cropper{max-width:100%;padding-inline:12px}.image-cropper-loader,.image-cropper-editor-panel,.image-cropper-settings-card,.image-cropper-result-panel{padding:.8rem}.image-cropper-drop-zone{min-height:210px;padding:1rem}.image-cropper-file-info,.image-cropper-result-details{grid-template-columns:1fr}.image-cropper-small-actions,.image-cropper-create-actions{grid-template-columns:1fr}.image-cropper-small-actions button{width:100%}.image-cropper-viewport{min-height:260px;padding:10px}.crop-handle{width:30px;height:30px}.image-cropper-result-preview-wrap{min-height:180px}}
@media(max-width:360px){.container--image-cropper,.image-cropper-workspace,.image-cropper-editor-panel,.image-cropper-settings,.image-cropper-settings-card,.image-cropper-result-panel,.image-cropper-viewport,.image-cropper-stage{max-width:100%;min-width:0}.image-cropper-ratios{grid-template-columns:1fr}.image-cropper-coordinate-grid{grid-template-columns:1fr}.image-cropper-custom-ratio{grid-template-columns:minmax(0,1fr) auto minmax(0,1fr)}.image-cropper-loader,.image-cropper-editor-panel,.image-cropper-settings-card,.image-cropper-result-panel{padding:.7rem}.image-cropper-viewport{width:100%}}
/* Image editor top modes */
.image-editor-tabs{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:.5rem;margin:0 0 1.25rem;padding:.45rem;border:1px solid #b8d5d0;border-radius:1rem;background:#eef8f6}.image-editor-tab{min-width:0;border:0;border-radius:.7rem;padding:.75rem .55rem;background:transparent;color:#294744;font:inherit;font-weight:700;cursor:pointer}.image-editor-tab[aria-selected="true"]{background:#146b63;color:#fff;box-shadow:0 4px 12px rgba(20,107,99,.2)}.image-editor-tab:focus-visible{outline:3px solid #f3a712;outline-offset:2px}.image-editor-panel{min-width:0}.image-editor-panel[hidden]{display:none!important}.image-editor-panel>.counter-panel:first-child{margin-top:0}@media(max-width:640px){.image-editor-tabs{grid-template-columns:repeat(2,minmax(0,1fr))}.image-editor-tab:last-child{grid-column:1/-1}}@media(max-width:360px){.image-editor-tab{padding:.7rem .35rem;font-size:.9rem}}