.background-page{--cutout:#725bf5;--cutout-2:#26b99a}.background-hero{text-align:center;justify-items:center;padding:clamp(1.8rem,5vw,4.4rem) 0 2rem;display:grid}.background-hero>span,.background-explainer>div:first-child>span{color:var(--cutout);font:800 .72rem/1 var(--mono);letter-spacing:.13em;text-transform:uppercase}.background-hero h1{letter-spacing:-.055em;max-width:780px;margin:.7rem auto .6rem;font-size:clamp(2rem,6vw,4.2rem)}.background-hero .lead{max-width:68ch}.background-hero-proof{border:1px solid color-mix(in srgb,var(--cutout) 28%,var(--border));background:color-mix(in srgb,var(--cutout) 6%,var(--bg-raised));box-shadow:var(--shadow);border-radius:999px;align-items:center;gap:.65rem;margin-top:1rem;padding:.55rem .75rem;display:flex}.background-hero-proof i{color:var(--cutout-2);font-style:normal}.background-hero-proof strong{font:800 .78rem/1 var(--mono)}.background-hero-proof span,.background-hero-proof b{font:700 .68rem/1 var(--mono);color:var(--text-muted)}.background-hero-proof b{background:var(--success-subtle);color:var(--success);border-radius:999px;padding:.25rem .38rem}.background-tool{margin:0 auto 2.5rem}.background-drop{border:1.5px dashed color-mix(in srgb,var(--cutout) 44%,var(--border));background:radial-gradient(circle at 50% 0,color-mix(in srgb,var(--cutout) 10%,transparent),transparent 45%),var(--bg-raised);text-align:center;border-radius:26px;align-content:center;place-items:center;gap:.65rem;min-height:310px;transition:all .2s;display:grid;position:relative;overflow:hidden}.background-drop:before{content:"";border:1px solid color-mix(in srgb,var(--cutout) 12%,transparent);width:280px;height:280px;box-shadow:0 0 0 34px color-mix(in srgb,var(--cutout) 3%,transparent),0 0 0 70px color-mix(in srgb,var(--cutout) 2%,transparent);pointer-events:none;border-radius:50%;position:absolute}.background-drop.is-over{border-color:var(--cutout);box-shadow:0 20px 50px color-mix(in srgb,var(--cutout) 16%,transparent);transform:translateY(-2px)}.background-drop>*{position:relative}.background-drop input[type=file]{opacity:0;width:1px;height:1px;position:absolute}.background-drop-mark{background:linear-gradient(145deg,var(--cutout),#4c39cd);color:#fff;width:66px;height:66px;box-shadow:0 14px 32px color-mix(in srgb,var(--cutout) 30%,transparent);border-radius:22px;place-items:center;display:grid}.background-drop-mark svg{fill:none;stroke:currentColor;stroke-width:1.7px;stroke-linecap:round;stroke-linejoin:round;width:38px}.background-drop>strong{font-size:1.2rem}.background-drop button,.background-actions button,.background-next button,.background-result-head button{appearance:none;border:1px solid var(--border);background:var(--bg-raised);min-height:44px;color:var(--text);font:inherit;cursor:pointer;border-radius:.75rem;justify-content:center;align-items:center;padding:.68rem .95rem;font-size:.82rem;font-weight:800;display:inline-flex}.background-drop button,.background-actions .is-go{border-color:var(--cutout);background:var(--cutout);color:#fff}.background-drop>span:not(.background-drop-mark),.background-drop small{color:var(--text-muted);font-size:.8rem}.background-badges{flex-wrap:wrap;justify-content:center;gap:.45rem;display:flex}.background-badges span{border:1px solid var(--border);background:var(--bg-subtle);color:var(--text-muted);font:750 .68rem/1 var(--mono);border-radius:999px;padding:.3rem .52rem}.background-drop p{max-width:58ch;color:var(--text-muted);margin:.15rem 1rem 0;font-size:.75rem}.background-drop .background-error{border:1px solid color-mix(in srgb,var(--danger) 35%,var(--border));background:color-mix(in srgb,var(--danger) 8%,var(--bg-raised));color:var(--danger);border-radius:.65rem;padding:.55rem .72rem;font-weight:750}.background-error[hidden]{display:none}.background-progress{border:1px solid var(--border);background:var(--bg-raised);text-align:center;border-radius:26px;align-content:center;justify-items:center;gap:1rem;min-height:310px;padding:2rem;display:grid}.background-progress[hidden],.background-workspace[hidden],.background-drop[hidden]{display:none}.background-progress-orbit{background:color-mix(in srgb,var(--cutout) 7%,var(--bg-subtle));border-radius:50%;place-items:center;width:96px;height:96px;display:grid;position:relative}.background-progress-orbit i{border:2px solid #0000;border-top-color:var(--cutout);border-right-color:var(--cutout-2);border-radius:50%;animation:1.1s linear infinite cutout-spin;position:absolute;inset:5px}.background-progress-orbit b{font:900 .9rem/1 var(--mono);color:var(--cutout)}@keyframes cutout-spin{to{transform:rotate(1turn)}}.background-progress>div:nth-child(2){gap:.25rem;display:grid}.background-progress span{color:var(--text-muted);font-size:.78rem}.background-progress progress{appearance:none;background:var(--bg-subtle);border:0;border-radius:99px;width:min(360px,80vw);height:7px;overflow:hidden}.background-progress progress::-webkit-progress-bar{background:var(--bg-subtle)}.background-progress progress::-webkit-progress-value{background:linear-gradient(90deg,var(--cutout),var(--cutout-2));transition:width .25s}.background-workspace{border:1px solid var(--border);background:var(--bg-raised);border-radius:26px;overflow:hidden;box-shadow:0 24px 70px #14123214}.background-result-head{border-bottom:1px solid var(--border);justify-content:space-between;align-items:center;gap:1rem;padding:1.15rem 1.3rem;display:flex}.background-result-head span{color:var(--cutout);font:800 .68rem/1 var(--mono);text-transform:uppercase}.background-result-head h2{margin:.3rem 0 0;font-size:1.18rem}.background-result-head p{color:var(--text-muted);margin:0;font-size:.76rem}.background-editor{grid-template-columns:minmax(0,1fr) 310px;min-height:520px;display:grid}.background-preview{--split:50%;background:var(--bg-subtle);align-content:center;gap:.7rem;min-width:0;padding:1.1rem;display:grid}.background-frame{border:1px solid var(--border);background-color:#fff;background-image:linear-gradient(45deg,#dfe3e9 25%,#0000 25%),linear-gradient(-45deg,#dfe3e9 25%,#0000 25%),linear-gradient(45deg,#0000 75%,#dfe3e9 75%),linear-gradient(-45deg,#0000 75%,#dfe3e9 75%);background-position:0 0,0 11px,11px -11px,-11px 0;background-size:22px 22px;border-radius:18px;width:100%;max-height:680px;position:relative;overflow:hidden;box-shadow:0 12px 35px #1416221f}.background-frame img,.background-frame canvas{object-fit:fill;width:100%;height:100%;position:absolute;inset:0}.background-frame canvas{clip-path:inset(0 0 0 var(--split))}.background-divider{z-index:3;inset:0 auto 0 var(--split);pointer-events:none;background:#fff;width:2px;position:absolute;transform:translate(-1px);box-shadow:0 0 0 1px #00000026}.background-divider i{background:#fff;border:1px solid #0000001f;border-radius:50%;width:34px;height:34px;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);box-shadow:0 5px 16px #00000038}.background-divider i:before,.background-divider i:after{content:"";border-bottom:2px solid #333;border-left:2px solid #333;width:7px;height:7px;position:absolute;top:50%}.background-divider i:before{left:8px;transform:translateY(-50%)rotate(45deg)}.background-divider i:after{right:8px;transform:translateY(-50%)rotate(225deg)}.background-frame>input{z-index:5;opacity:0;cursor:ew-resize;width:100%;height:100%;margin:0;position:absolute;inset:0}.background-label{z-index:4;color:#fff;font:750 .65rem/1 var(--mono);pointer-events:none;background:#0d0f14b3;border-radius:999px;padding:.3rem .5rem;position:absolute;top:.7rem}.background-label.is-before{left:.7rem}.background-label.is-after{right:.7rem}.background-preview>p{color:var(--text-muted);text-align:center;margin:0;font-size:.72rem}.background-controls{border-left:1px solid var(--border);align-content:start;gap:1rem;padding:1.05rem;display:grid}.background-controls fieldset{border:0;min-width:0;margin:0;padding:0}.background-controls legend{width:100%;color:var(--text);margin-bottom:.65rem;font-size:.74rem;font-weight:850}.background-kinds{grid-template-columns:repeat(2,minmax(0,1fr));gap:.48rem;display:grid}.background-kinds label{border:1px solid var(--border);cursor:pointer;border-radius:.68rem;grid-template-columns:24px 1fr;align-items:center;gap:.45rem;min-height:44px;padding:.55rem;display:grid;position:relative}.background-kinds label:has(input:checked){border-color:var(--cutout);box-shadow:0 0 0 2px color-mix(in srgb,var(--cutout) 14%,transparent)}.background-kinds input{opacity:0;position:absolute}.background-kinds span{border:1px solid var(--border);border-radius:.35rem;place-items:center;width:24px;height:24px;display:grid}.background-kinds b{font-size:.7rem}.background-kinds .is-transparent{background-color:#fff;background-image:linear-gradient(45deg,#cfd4dc 25%,#0000 25%),linear-gradient(-45deg,#cfd4dc 25%,#0000 25%),linear-gradient(45deg,#0000 75%,#cfd4dc 75%),linear-gradient(-45deg,#0000 75%,#cfd4dc 75%);background-position:0 0,0 4px,4px -4px,-4px 0;background-size:8px 8px}.background-kinds .is-white{background:#fff}.background-kinds .is-black{background:#08090c}.background-kinds .is-blur{color:#fff;background:linear-gradient(135deg,#735ff5,#33b9a3)}.background-kinds .is-custom{background:linear-gradient(135deg,#ff8f70,#7467f0 52%,#23b89b)}.background-custom{min-height:44px;color:var(--text-muted);cursor:pointer;justify-content:space-between;align-items:center;gap:.6rem;margin-top:.5rem;font-size:.72rem;display:flex}.background-custom input{cursor:pointer;background:0 0;border:0;border-radius:.4rem;width:42px;height:28px;padding:0}.background-slider{gap:.35rem;margin-bottom:.85rem;display:grid}.background-slider>span{justify-content:space-between;font-size:.72rem;display:flex}.background-slider output{font:750 .68rem/1 var(--mono);color:var(--cutout)}.background-slider input{width:100%;accent-color:var(--cutout)}.background-slider small{color:var(--text-muted);font-size:.65rem;line-height:1.4}.background-proof{border:1px solid color-mix(in srgb,var(--cutout) 24%,var(--border));background:color-mix(in srgb,var(--cutout) 5%,var(--bg-subtle));border-radius:.8rem;padding:.75rem}.background-proof span{color:var(--cutout);font:800 .62rem/1 var(--mono);text-transform:uppercase;display:block}.background-proof strong{font:800 .85rem/1 var(--mono);margin:.4rem 0;display:block}.background-proof p{color:var(--text-muted);margin:0;font-size:.65rem;line-height:1.45}.background-actions,.background-next{border-top:1px solid var(--border);flex-wrap:wrap;gap:.55rem;padding:1rem 1.2rem;display:flex}.background-next{background:var(--bg-subtle);align-items:center}.background-next>span{margin-right:auto;font-size:.78rem;font-weight:800}.background-next button{background:var(--bg-raised);padding:.56rem .75rem}.background-explainer{grid-template-columns:.8fr 1.2fr;align-items:start;gap:clamp(1.5rem,5vw,4rem);margin-top:3rem;display:grid}.background-explainer h2{margin:.7rem 0}.background-proof-grid{gap:.7rem;display:grid}.background-proof-grid article{border:1px solid var(--border);background:var(--bg-raised);border-radius:16px;grid-template-columns:42px 1fr;gap:0 .8rem;padding:1rem;display:grid}.background-proof-grid article>span{background:color-mix(in srgb,var(--cutout) 9%,var(--bg-subtle));width:34px;height:34px;color:var(--cutout);font:800 .7rem/1 var(--mono);border-radius:50%;grid-row:1/3;place-items:center;display:grid}.background-proof-grid h3{margin:0;font-size:.95rem}.background-proof-grid p{color:var(--text-muted);margin:.25rem 0 0;font-size:.8rem}.background-faq details{border-top:1px solid var(--border);padding:.9rem 0}.background-faq summary{cursor:pointer;align-items:center;min-height:44px;font-weight:800;display:flex}.background-faq details p{color:var(--text-muted);margin:.55rem 0 0}@media (width<=760px){.background-hero{padding-top:1.2rem}.background-hero h1{letter-spacing:-.04em}.background-drop{border-radius:20px;min-height:330px}.background-editor{grid-template-columns:1fr;min-height:0}.background-preview{padding:.75rem}.background-controls{border-left:0;border-top:1px solid var(--border)}.background-result-head{align-items:flex-start}.background-result-head button{flex:none}.background-actions{grid-template-columns:1fr;display:grid}.background-actions button{width:100%}.background-next{grid-template-columns:repeat(2,minmax(0,1fr));display:grid}.background-next>span{grid-column:1/-1}.background-next button{min-width:0}.background-explainer{grid-template-columns:1fr}}@media (prefers-reduced-motion:reduce){.background-progress-orbit i{animation:none}}