:root{--ink:#182033;--muted:#667085;--blurple:#5865f2;--blurple-dark:#4752c4;--lavender:#eef0ff;--surface:#fff;--line:#dfe3f0;--success:#11784f;--danger:#c43d4b;--shadow:0 20px 60px #252d5b1f;--shadow-soft:0 10px 28px #252d5b14;--radius-sm:10px;--radius-md:16px;--radius-lg:24px;--radius-xl:32px}*{box-sizing:border-box}html{--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light;overflow-x:hidden}body{color:var(--ink);text-rendering:optimizelegibility;background:radial-gradient(circle at 50% -12rem,#5865f226,#0000 34rem),#f7f8fc;min-width:320px;margin:0;font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif;font-size:16px;line-height:1.6;overflow-x:hidden}button,input{font:inherit}button,[role=button],summary{-webkit-tap-highlight-color:transparent}button{background:var(--surface);border:1px solid var(--line);border-radius:var(--radius-sm);color:var(--ink);cursor:pointer;justify-content:center;align-items:center;min-height:44px;padding:.6rem 1rem;font-weight:700;transition:background-color .16s,border-color .16s,color .16s,box-shadow .16s;display:inline-flex}button:hover:not(:disabled){color:var(--blurple-dark);border-color:#5865f26b}button:disabled{cursor:not-allowed;opacity:.48}:where(button,input,[role=button],[role=application],summary):focus-visible{outline:3px solid var(--blurple);outline-offset:3px}h1,h2,h3,p{margin-top:0}h1,h2,h3{color:var(--ink);text-wrap:balance;line-height:1.13}h1{letter-spacing:-.048em;margin-bottom:1rem;font-size:clamp(2.35rem,7vw,4.25rem)}h2{letter-spacing:-.035em;margin-bottom:1rem;font-size:clamp(1.75rem,4vw,2.65rem)}h3{letter-spacing:-.015em;font-size:1.12rem}.site-shell{width:100%;margin:0 auto;padding:0 24px}.tool-section,.content-section,.ad-placeholder,.site-footer{max-width:1120px;margin-left:auto;margin-right:auto}.tool-section{padding-top:clamp(2.25rem,6vw,4.75rem)}.tool-intro{text-align:center;max-width:760px;margin:0 auto 1.75rem}.eyebrow{color:var(--blurple-dark);letter-spacing:.12em;text-transform:uppercase;justify-content:center;align-items:center;gap:.55rem;margin-bottom:.75rem;font-size:.75rem;font-weight:800;display:flex}.eyebrow__mark{background:var(--blurple);border-radius:999px;width:7px;height:7px;box-shadow:0 0 0 5px #5865f21c}.tool-intro__lead{color:#3c465d;max-width:650px;margin:0 auto .45rem;font-size:clamp(1.05rem,2vw,1.22rem);line-height:1.55}.tool-intro__support{color:var(--muted);max-width:72ch;margin:0 auto}.avatar-cropper{border-radius:var(--radius-xl);box-shadow:var(--shadow);background:#fffffff5;border:1px solid #d2d7e8eb;padding:20px}.upload-dropzone{border-radius:calc(var(--radius-xl) - 10px);color:var(--muted);cursor:pointer;text-align:center;background:radial-gradient(circle at 50% 34%,#5865f21c,#0000 11rem),#fbfbff;border:2px dashed #c6cceb;flex-direction:column;justify-content:center;align-items:center;min-height:260px;padding:2rem;transition:background-color .16s,border-color .16s,box-shadow .16s;display:flex}.upload-dropzone:hover,.upload-dropzone:focus-visible{background-color:var(--lavender);border-color:var(--blurple);box-shadow:inset 0 0 0 1px #5865f214}.upload-dropzone__icon{background:var(--blurple);color:#fff;border-radius:14px;justify-content:center;align-items:center;width:54px;height:54px;margin-bottom:1rem;display:inline-flex;box-shadow:0 9px 20px #5865f240}.upload-dropzone__title{color:var(--ink);margin-bottom:.2rem;font-size:1.12rem;font-weight:800}.upload-dropzone__meta{margin-bottom:0;font-size:.9rem}.privacy-note{color:var(--success);justify-content:center;align-items:center;gap:.45rem;margin:1rem auto 0;font-size:.92rem;font-weight:750;display:flex}.privacy-note svg{flex:none}.cropper-workspace{grid-template-columns:minmax(0,1.45fr) minmax(250px,.72fr);grid-template-areas:"details details""editor result";gap:20px;display:grid}.image-details{border:1px solid var(--line);border-radius:var(--radius-md);background:#f7f8fc;grid-area:details;justify-content:space-between;align-items:center;gap:1rem;min-width:0;padding:.75rem .8rem .75rem 1rem;display:flex}.image-details__copy{min-width:0}.image-details__filename{text-overflow:ellipsis;white-space:nowrap;margin-bottom:-.1rem;font-weight:800;overflow:hidden}.image-details__meta,.image-details__notice{color:var(--muted);margin-bottom:0;font-size:.82rem}.image-details__notice{color:var(--blurple-dark)}.crop-editor{flex-direction:column;grid-area:editor;align-items:center;min-width:0;padding:.35rem .25rem .25rem;display:flex}.crop-pane-heading{text-align:center;align-self:stretch;margin-bottom:1rem}.crop-pane-heading h2,.result-preview h2{letter-spacing:-.025em;margin-bottom:.25rem;font-size:clamp(1.25rem,2vw,1.55rem)}.crop-pane-heading p{color:var(--muted);margin-bottom:0;font-size:.9rem}.crop-stage{box-shadow:var(--shadow-soft);background:#d9dce8;border:1px solid #c9cedf;border-radius:22px;flex:none;width:min(100%,360px);max-width:360px}.crop-stage:active{cursor:grabbing!important}.crop-controls{align-self:stretch;width:100%;max-width:520px;margin:1.2rem auto 0}.zoom-control{grid-template-columns:auto 44px minmax(80px,1fr) 44px;align-items:center;gap:.55rem;display:grid}.zoom-control>label,.size-control legend{color:#394158;font-size:.83rem;font-weight:800}.zoom-control button{width:44px;padding:0;font-size:1.25rem}.zoom-control input[type=range]{accent-color:var(--blurple);cursor:pointer;width:100%;min-width:0;min-height:44px}.size-control{border:0;grid-template-columns:repeat(3,minmax(0,1fr));gap:.5rem;margin:.9rem 0 0;padding:0;display:grid}.size-control legend{float:left;grid-column:1/-1;width:100%;margin-bottom:.35rem}.size-option{border:1px solid var(--line);border-radius:var(--radius-sm);color:#4a5268;cursor:pointer;text-align:center;background:#f8f9fc;justify-content:center;align-items:center;gap:.35rem;min-height:44px;padding:.35rem .45rem;font-size:.78rem;font-weight:750;line-height:1.25;display:flex}.size-option:has(input:checked){background:var(--lavender);border-color:var(--blurple);color:var(--blurple-dark)}.size-option input{accent-color:var(--blurple);flex:none;width:16px;height:16px}.result-pane{background:linear-gradient(145deg, var(--lavender), #f8f8ff 70%);border:1px solid #d9ddfb;border-radius:20px;flex-direction:column;grid-area:result;justify-content:center;align-items:stretch;min-width:0;padding:clamp(1.25rem,3vw,2rem);display:flex}.result-preview{text-align:center}.result-preview h2{margin-bottom:1.1rem}.result-preview__canvas-wrap{background-color:#f7f8fc;background-image:linear-gradient(45deg,#dfe3f0 25%,#0000 25%),linear-gradient(-45deg,#dfe3f0 25%,#0000 25%),linear-gradient(45deg,#0000 75%,#dfe3f0 75%),linear-gradient(-45deg,#0000 75%,#dfe3f0 75%),none;background-position:0 0,0 8px,8px -8px,-8px 0;background-repeat:repeat,repeat,repeat,repeat,repeat;background-size:16px 16px;background-attachment:scroll,scroll,scroll,scroll,scroll;background-origin:padding-box,padding-box,padding-box,padding-box,padding-box;background-clip:border-box,border-box,border-box,border-box,border-box;border:7px solid #fff;border-radius:50%;margin:0 auto 1.35rem;display:inline-flex;box-shadow:0 12px 28px #252d5b29}.download-button{background:var(--blurple);border-color:var(--blurple);color:#fff;width:100%;box-shadow:0 8px 20px #5865f23b}.download-button:hover:not(:disabled){background:var(--blurple-dark);border-color:var(--blurple-dark);color:#fff}.cropper-status,.cropper-alert{border-radius:var(--radius-sm);margin:.8rem 0 0;padding:.7rem .9rem;font-size:.9rem}.cropper-status{background:var(--lavender);color:var(--blurple-dark)}.cropper-alert{color:var(--danger);background:#fff0f2}.content-section{margin-top:clamp(4.75rem,9vw,7.5rem)}.section-heading{text-align:center;max-width:760px;margin:0 auto 2.15rem}.section-heading .eyebrow,.tips-section .eyebrow{margin-bottom:.7rem}.how-to-grid{grid-template-columns:repeat(4,minmax(0,1fr));gap:18px;margin:0;padding:0;list-style:none;display:grid}.how-to-card{background:var(--surface);border:1px solid var(--line);border-radius:var(--radius-lg);box-shadow:var(--shadow-soft);min-width:0;overflow:hidden}.how-to-card__copy{padding:1.1rem 1.2rem 1.35rem;position:relative}.step-number{background:var(--lavender);color:var(--blurple-dark);border-radius:8px;justify-content:center;align-items:center;width:28px;height:28px;margin-bottom:.8rem;font-size:.75rem;font-weight:850;display:inline-flex}.how-to-card h3{margin-bottom:.5rem}.how-to-card p{color:var(--muted);margin-bottom:0;font-size:.9rem;line-height:1.55}.step-illustration{background:radial-gradient(circle at 75% 15%, #5865f22e, transparent 34%), linear-gradient(145deg, #f8f8ff, var(--lavender));color:var(--blurple);width:100%;height:154px;margin:0;position:relative;overflow:hidden}.step-illustration__panel{background:#fffffff5;border:1px solid #d9dded;border-radius:14px;position:absolute;inset:15% 11%;overflow:hidden;box-shadow:0 12px 24px #323a671c}.step-illustration__panel:before{content:"";opacity:.9;background:radial-gradient(circle,#c7cbde 0 2px,#0000 2.5px) 0 0/10px 10px;width:28px;height:8px;position:absolute;top:10px;left:12px}.step-illustration__picture{background:#edf0ff;border:1px solid #d4d9f2;border-radius:9px;width:45%;position:absolute;top:28%;bottom:15%;left:11%;overflow:hidden}.step-illustration__sun{background:#f7c96a;border-radius:50%;width:13px;height:13px;position:absolute;top:14%;right:13%}.step-illustration__hill{clip-path:polygon(0 100%,40% 18%,60% 54%,76% 36%,100% 100%);background:#aeb6ff;width:110%;height:72%;position:absolute;bottom:-12%;left:-5%}.step-illustration__upload-arrow,.step-illustration__download-arrow{background:currentColor;border-radius:999px;width:3px;height:39px;position:absolute;top:35%;right:23%}.step-illustration__upload-arrow:before,.step-illustration__download-arrow:before{content:"";border-top:3px solid;border-left:3px solid;width:11px;height:11px;position:absolute;top:0;left:-5px;transform:rotate(45deg)}.step-illustration__upload-arrow>span,.step-illustration__download-arrow>span{border:2px solid;border-top:0;border-radius:0 0 6px 6px;width:27px;height:10px;position:absolute;bottom:-10px;left:-12px}.step-illustration--position .step-illustration__picture,.step-illustration--size .step-illustration__picture,.step-illustration--download .step-illustration__picture{aspect-ratio:1;border-radius:50%;width:auto;height:58%;top:25%;bottom:auto;left:50%;transform:translate(-50%)}.step-illustration__crop-ring{aspect-ratio:1;border:2px solid;border-radius:50%;width:auto;height:60%;position:absolute;top:24%;bottom:auto;left:50%;transform:translate(-50%);box-shadow:-3px -3px 0 -1px #fff,3px 3px 0 -1px #fff}.step-illustration__move-arrows{opacity:.92;background:currentColor;border-radius:999px;width:62%;height:2px;position:absolute;top:54%;left:19%}.step-illustration__move-arrows:before{content:"";background:currentColor;border-radius:999px;width:2px;height:62px;position:absolute;top:-30px;left:calc(50% - 1px)}.step-illustration__move-arrows:after{content:"";background:#fff;border:2px solid;border-radius:50%;width:7px;height:7px;position:absolute;top:-4px;left:calc(50% - 5px)}.step-illustration--size .step-illustration__picture,.step-illustration--size .step-illustration__crop-ring{height:50%;top:19%;bottom:auto}.step-illustration__slider{background:#d6daeb;border-radius:999px;width:64%;height:4px;position:absolute;bottom:12%;left:18%}.step-illustration__slider>span{background:currentColor;border:3px solid #fff;border-radius:50%;width:15px;height:15px;position:absolute;top:-6px;left:58%;box-shadow:0 2px 7px #2b336238}.step-illustration--download .step-illustration__picture,.step-illustration--download .step-illustration__crop-ring{width:auto;height:56%;left:11%;transform:none}.step-illustration__download-arrow{height:36px;top:32%;right:24%;transform:rotate(180deg)}.step-illustration__download-arrow>span{display:none}.step-illustration__tray{border:2px solid;border-top:0;border-radius:0 0 6px 6px;width:35px;height:11px;position:absolute;bottom:17%;right:16%}.tips-section{background:var(--ink);border-radius:var(--radius-xl);box-shadow:var(--shadow);color:#d5d9e6;grid-template-columns:minmax(260px,.8fr) minmax(0,1.2fr);align-items:start;gap:clamp(2rem,5vw,5rem);padding:clamp(2rem,5vw,4rem);display:grid}.tips-section .eyebrow{color:#aeb6ff;justify-content:flex-start}.tips-section h2{color:#fff;margin-bottom:0}.tips-section__copy{max-width:72ch}.tips-section__copy p:last-child{margin-bottom:0}.faq-section{max-width:880px}.faq-list{border-top:1px solid var(--line)}.faq-list details{border-bottom:1px solid var(--line)}.faq-list summary{cursor:pointer;justify-content:space-between;align-items:center;min-height:64px;padding:1rem 3.25rem 1rem 0;font-weight:800;list-style:none;display:flex;position:relative}.faq-list summary::-webkit-details-marker{display:none}.faq-list summary:before,.faq-list summary:after{background:var(--blurple);content:"";border-radius:999px;width:15px;height:2px;transition:transform .16s;position:absolute;top:calc(50% - 1px);right:.6rem}.faq-list summary:after{transform:rotate(90deg)}.faq-list details[open] summary:after{transform:rotate(0)}.faq-list details p{color:var(--muted);max-width:72ch;margin:-.25rem 0 1.25rem;padding-right:2.5rem}.ad-placeholder{border:1px solid var(--line);border-radius:var(--radius-md);color:#5f687c;background:linear-gradient(135deg,#dfe3f047 25%,#0000 25%) 0 0/14px 14px,#ffffff8f;justify-content:center;align-items:center;min-height:112px;margin-top:2rem;display:flex}.faq-section+.ad-placeholder{margin-top:clamp(4rem,8vw,7rem)}.ad-placeholder span{letter-spacing:.12em;text-transform:uppercase;font-size:.68rem;font-weight:750}.site-footer{color:var(--muted);text-align:center;padding:2rem 0 2.5rem;font-size:.78rem}@media (max-width:980px){.how-to-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}@media (max-width:760px){.site-shell{padding:0 16px}.tool-section{padding-top:1.65rem}.tool-intro{margin-bottom:1.25rem}h1{margin-bottom:.7rem;font-size:clamp(2.25rem,11vw,3rem)}.tool-intro__lead{margin-bottom:.35rem;font-size:1rem;line-height:1.48}.tool-intro__support{font-size:.9rem;line-height:1.5}.avatar-cropper{border-radius:22px;padding:11px}.upload-dropzone{border-radius:15px;min-height:210px;padding:1.25rem}.upload-dropzone__icon{width:48px;height:48px;margin-bottom:.75rem}.privacy-note{margin-top:.8rem;font-size:.82rem}.cropper-workspace{grid-template-columns:minmax(0,1fr);grid-template-areas:"details""editor""result";gap:16px}.image-details{align-items:flex-start;padding:.65rem}.image-details button{flex:none;padding-left:.7rem;padding-right:.7rem}.crop-editor{padding:0}.crop-stage{width:min(82vw,360px);max-width:360px}.zoom-control{gap:.4rem}.size-option{padding-left:.25rem;padding-right:.25rem;font-size:.7rem}.size-option input{width:14px;height:14px}.result-pane{padding:1.35rem}.content-section{margin-top:4.75rem}.section-heading{margin-bottom:1.6rem}.how-to-grid{grid-template-columns:minmax(0,1fr)}.how-to-card{grid-template-columns:118px minmax(0,1fr);align-items:stretch;display:grid}.step-illustration{height:100%;min-height:154px}.step-illustration__panel{inset:16% 9%}.how-to-card__copy{padding:1rem}.step-number{width:24px;height:24px;margin-bottom:.55rem}.how-to-card h3{margin-bottom:.35rem;font-size:1rem}.how-to-card p{font-size:.82rem}.tips-section{grid-template-columns:minmax(0,1fr);gap:1.5rem;padding:1.65rem}.tips-section__copy{font-size:.92rem}.faq-list summary{align-items:flex-start;min-height:60px;padding-right:2.5rem}.faq-list summary:before,.faq-list summary:after{top:1.75rem;right:.35rem}.ad-placeholder{min-height:96px}}@media (max-width:380px){.site-shell{padding:0 12px}.how-to-card{grid-template-columns:102px minmax(0,1fr)}.size-option{gap:.2rem}}@media (prefers-reduced-motion:reduce){*,:before,:after{scroll-behavior:auto!important;transition-duration:.01ms!important}}