.image-app{margin:0;background:#f7f8fc;color:#202a44;font-family:var(--font,Arial,sans-serif)}.image-app *{box-sizing:border-box}.image-app [hidden]{display:none!important}.image-header,.image-footer{display:flex;align-items:center;justify-content:space-between;gap:24px;padding:24px max(24px,calc((100vw - 1200px)/2));background:white}.image-header nav,.image-footer nav{display:flex;gap:20px;flex-wrap:wrap}.image-header a,.image-footer a{color:inherit;text-decoration:none}.image-header a[aria-current=page]{color:#394ee8}.image-workspace{max-width:1100px;padding:54px 24px 40px;margin:auto}.image-eyebrow{font-size:12px;font-weight:700;letter-spacing:.15em;color:#5362bc}.image-workspace h1{font-size:clamp(32px,5vw,54px);line-height:1.1;margin:14px 0}.image-intro{max-width:650px;color:#5b657a;line-height:1.6}.image-drop{margin-top:32px;padding:48px 24px;text-align:center;border:2px dashed #cbd2e7;border-radius:24px;background:white}.image-drop.drag-over{border-color:#394ee8;background:#f0f2ff}.image-symbol{display:block;font-size:56px;color:#394ee8}.image-drop p,.image-note{color:#626e83;font-size:14px;line-height:1.6}.image-app button,.image-app input,.image-app select{font:inherit}.image-app button{min-height:44px;border:1px solid #cbd2e7;border-radius:12px;padding:10px 18px;background:white;color:#202a44;cursor:pointer}.image-app button:disabled{opacity:.55;cursor:wait}.image-app .image-primary{border-color:#394ee8;background:#394ee8;color:white;font-weight:600}.image-app :focus-visible{outline:3px solid #aeb7ff;outline-offset:3px}.image-editor{display:grid;grid-template-columns:minmax(0,1fr) 340px;gap:24px;margin:32px 0}.image-preview,.image-settings,.image-result{background:white;border:1px solid #e0e4ef;border-radius:20px;padding:24px;min-width:0}.image-preview{text-align:center}.image-preview img{display:block;max-width:100%;max-height:460px;object-fit:contain;margin:auto;background:repeating-conic-gradient(#eff1f5 0 25%,white 0 50%) 50%/20px 20px}.image-preview p{overflow-wrap:anywhere;color:#626e83;font-size:14px}.image-settings h2{margin-top:0}.image-settings label{display:block;font-size:14px;font-weight:600;margin:18px 0 8px}.image-app input:not([type=range]):not([type=checkbox]),.image-app select{min-width:0;width:100%;min-height:44px;border:1px solid #cbd2e7;border-radius:9px;padding:10px 12px;background:white;color:#202a44}.image-settings input[type=range]{width:100%;min-height:36px;accent-color:#394ee8}.image-settings output{float:right}.image-dimensions{display:grid;grid-template-columns:1fr 1fr;gap:12px}.image-check{display:flex!important;gap:8px;align-items:center}.image-check input{width:18px;height:18px;accent-color:#394ee8}.image-settings .image-primary{width:100%;margin-top:8px}.image-result{margin:24px 0}.image-result h2{margin-top:0}.image-result form{max-width:420px}.image-result form button{margin-top:12px}.image-error{padding:14px 18px;border-radius:12px;background:#fff0ee;color:#983d31;overflow-wrap:anywhere}.image-footer-note{margin-top:32px;color:#626e83;font-size:14px}.image-footer-note a{color:#394ee8}.image-footer{font-size:13px;border-top:1px solid #e0e4ef}.image-app .skip-link{position:absolute;top:-100px}.image-app .skip-link:focus{top:8px;left:8px;z-index:10;background:white;padding:10px}@media(max-width:760px){.image-header{align-items:flex-start;padding:20px;flex-direction:column;gap:18px}.image-header nav{gap:16px;font-size:14px}.image-workspace{padding:28px 16px}.image-editor{grid-template-columns:minmax(0,1fr)}.image-preview,.image-settings,.image-result{padding:20px}.image-drop{padding:32px 16px}.image-footer{padding:24px 20px;align-items:flex-start;flex-direction:column}.image-footer nav{gap:12px}.image-preview img{max-height:320px}}
