/* Stitch geometry and interaction surfaces, recalibrated for a white base. */
@keyframes stitch-aurora { to { transform: rotate(360deg); } }
.stitch-surface { position:relative; isolation:isolate; border:1px solid #dcdce3; border-radius:28px; corner-shape:var(--md-corner-shape); background:rgb(255 255 255 / .76); backdrop-filter:blur(40px); box-shadow:inset 0 1px 0 #fff,0 10px 32px #39344809; transition:border-color 200ms,box-shadow 200ms,background 200ms; }
.stitch-surface::before { content:""; position:absolute; inset:-1px; padding:1px; border-radius:inherit; corner-shape:inherit; pointer-events:none; background:conic-gradient(from 0deg at 50% 50%,#bca9e87a,transparent 15%,#7eb9e87d 28%,#9ed9c26b 40%,transparent 52%,#b49cdba1 70%,transparent 85%,#bca9e87a); -webkit-mask:linear-gradient(#fff 0 0) content-box,linear-gradient(#fff 0 0); -webkit-mask-composite:xor; mask-composite:exclude; opacity:.65; }
.stitch-surface::after { content:""; position:absolute; z-index:-1; inset:0; border-radius:inherit; corner-shape:inherit; background:radial-gradient(ellipse at var(--composer-x, 50%) 100%,#d9d0f12b,transparent 65%); pointer-events:none; opacity:.45; transition:opacity 250ms; }
.stitch-surface:focus-within { border-color:#c5bfd5; box-shadow:0 0 0 3px #c9bfe914,0 12px 36px #3934480b; }
.stitch-surface:focus-within::after { opacity:1; }
.stitch-surface.is-dragover { border-color:#a58bc7!important; box-shadow:0 0 0 4px #b79bd52b; }
.stitch-aurora { position:absolute; inset:-1px; border-radius:inherit; corner-shape:inherit; overflow:hidden; pointer-events:none; padding:1px; -webkit-mask:linear-gradient(#fff 0 0) content-box,linear-gradient(#fff 0 0); -webkit-mask-composite:xor; mask-composite:exclude; opacity:.65; }
.stitch-aurora::before { content:""; position:absolute; width:160%; aspect-ratio:1; left:-30%; top:50%; margin-top:-80%; background:conic-gradient(transparent 0% 50%,#aa80df 61%,#77bcde 72%,#b6d9cf 80%,transparent 94%); animation:stitch-aurora 12s linear infinite; }
.stitch-toolbar { --stitch-control-surface:rgb(0 0 0 / .035); --stitch-control-size:48px; --stitch-control-font-size:14px; --stitch-control-icon-size:18px; display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; width:100%; gap:8px 14px; }
.stitch-tools-left,.stitch-tools-right { display:flex; align-items:center; gap:8px; }
.stitch-tools-right { margin-left:auto; }
.stitch-upload-strip { display:flex; gap:10px; overflow-x:auto; padding:0 1px 14px; }
.stitch-upload-strip:empty { display:none; }
.stitch-upload-item { position:relative; flex:0 0 70px; height:70px; border:1px solid #ddd8e5; border-radius:12px; corner-shape:var(--md-corner-shape); background:#f4f1f8; animation:stitch-menu-in 180ms; }
.stitch-upload-item img { width:100%; height:100%; object-fit:cover; border-radius:11px; corner-shape:var(--md-corner-shape); }
.stitch-upload-item button { position:absolute; right:3px; top:3px; display:grid; place-items:center; width:22px; height:22px; border:1px solid #ffffff70; border-radius:50%; corner-shape:round; color:#fff; background:#332e40a6; backdrop-filter:blur(5px); cursor:pointer; }
@media(max-width:600px) {
 .stitch-toolbar { --stitch-control-size:36px; --stitch-control-font-size:12px; --stitch-control-icon-size:16px; gap:8px; } .stitch-tools-left,.stitch-tools-right { gap:4px; }

}
@media(prefers-reduced-motion:reduce) {
 .stitch-aurora::before,.stitch-upload-item { animation:none; }
 .stitch-surface { transition:none; }
}
