:root{--ink:#142139;--muted:#627087;--line:#d8e0ea;--paper:#f4f7fb;--surface:#fff;--accent:#7c3aed;font-family:Inter,ui-sans-serif,system-ui,sans-serif;color:var(--ink);background:var(--paper)}*{box-sizing:border-box}body{margin:0;min-width:20rem}button,input,select{font:inherit}button{min-height:2.75rem;cursor:pointer}button:disabled{cursor:not-allowed;opacity:.45}header{height:4rem;display:flex;align-items:center;justify-content:space-between;padding:0 1rem;border-bottom:1px solid var(--line);background:#fff}header a{color:inherit;text-decoration:none;font-weight:700}.brand{font-size:1.15rem}.brand span{color:#2563eb}.intro{max-width:78rem;margin:auto;padding:3rem 1rem 2rem}.intro p{margin:0;color:var(--accent);font-size:.72rem;font-weight:850;letter-spacing:.14em}.intro h1{margin:.6rem 0 1rem;font-size:clamp(2.7rem,9vw,6rem);line-height:.9;letter-spacing:-.065em}.intro h1 em{color:var(--accent);font-style:normal}.intro>span{color:var(--muted)}.editor{display:grid;max-width:78rem;margin:0 auto 4rem;border:1px solid var(--line);border-radius:1rem;background:var(--surface);overflow:hidden}.controls{padding:1rem}.upload,.primary{display:grid;place-items:center;min-height:3.2rem;border-radius:.7rem;background:var(--accent);color:#fff;font-weight:800;cursor:pointer}.upload input{position:absolute;opacity:0;pointer-events:none}.group{padding:1rem 0;border-bottom:1px solid var(--line)}.group>b{display:block;margin-bottom:.75rem;font-size:.75rem;letter-spacing:.09em;text-transform:uppercase}.button-grid,.fields{display:grid;grid-template-columns:1fr 1fr;gap:.5rem}.button-grid button,.secondary,#replace{border:1px solid var(--line);border-radius:.6rem;background:#fff;color:var(--ink);font-weight:700}.fields label,.sliders label{display:grid;gap:.35rem;color:var(--muted);font-size:.8rem}.fields input,.fields select{width:100%;min-height:2.75rem;padding:.55rem;border:1px solid var(--line);border-radius:.55rem;background:var(--paper);color:var(--ink)}.check{display:flex!important;align-items:center;gap:.5rem!important;margin-top:.7rem}.sliders label{grid-template-columns:1fr auto;margin-top:.7rem}.sliders input{grid-column:1/-1;width:100%;accent-color:var(--accent)}.actions{display:grid;grid-template-columns:1fr;gap:.5rem;padding-top:1rem}.primary{border:0}.stage{min-width:0;border-top:1px solid var(--line);background:#eef2f7}.stage-head{display:flex;justify-content:space-between;align-items:center;gap:1rem;padding:1rem;background:#fff;border-bottom:1px solid var(--line)}.stage-head b,.stage-head span{display:block}.stage-head span{margin-top:.2rem;color:var(--muted);font-size:.75rem}.canvas-wrap{min-height:28rem;display:grid;place-items:center;padding:1rem;background-image:linear-gradient(45deg,#e5e9ef 25%,transparent 25%),linear-gradient(-45deg,#e5e9ef 25%,transparent 25%),linear-gradient(45deg,transparent 75%,#e5e9ef 75%),linear-gradient(-45deg,transparent 75%,#e5e9ef 75%);background-size:1.25rem 1.25rem;background-position:0 0,0 .625rem,.625rem -.625rem,-.625rem 0}.canvas-wrap p{padding:1rem;color:var(--muted);text-align:center;background:#ffffffd9;border-radius:.6rem}canvas{display:block;max-width:100%;max-height:70vh;background:#fff;box-shadow:0 1rem 3rem #14213920}@media(min-width:48rem){header{padding-inline:2rem}.intro{padding-inline:2rem}.editor{grid-template-columns:minmax(19rem,.72fr) minmax(0,1.6fr)}.controls{padding:1.25rem}.stage{border-top:0;border-left:1px solid var(--line);position:sticky;top:0;align-self:start}.actions{grid-template-columns:.8fr 1.2fr}.canvas-wrap{min-height:42rem}}@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important}}