:root{color-scheme:dark;--bg:#0b0a12;--panel:#171321;--panel2:#21182c;--text:#fff8ff;--muted:#bdb3c8;--accent:#ed4fa8;--accent-two:#8d68ff;--coral:#ff8069;--border:#3a2a49;font-family:Inter,ui-sans-serif,system-ui,-apple-system,"Segoe UI",sans-serif}*{box-sizing:border-box}body{margin:0;background:radial-gradient(circle at 15% 0,#31113a 0,transparent 34rem),var(--bg);color:var(--text);line-height:1.5}button,input,select,textarea{font:inherit}a{color:inherit}.tool-shell{width:min(1240px,calc(100% - 32px));margin:auto;padding:28px 0 64px}.tool-heading{display:flex;align-items:end;justify-content:space-between;gap:20px;margin:14px 0 20px}.eyebrow{margin:0;color:#ff8fc9;font-size:.78rem;font-weight:850;letter-spacing:.14em;text-transform:uppercase}h1{margin:.2rem 0;font-size:clamp(2rem,5vw,4rem);line-height:1;letter-spacing:-.055em}.lede{max-width:720px;margin:.6rem 0 0;color:var(--muted)}.back{font-weight:800;text-decoration:none}.studio{display:grid;grid-template-columns:minmax(0,1fr) 330px;gap:18px}.canvas-panel,.controls,.info-panel{border:1px solid var(--border);border-radius:20px;background:color-mix(in srgb,var(--panel) 94%,transparent);box-shadow:0 20px 70px #0005}.canvas-panel{min-width:0;padding:12px;display:grid;place-items:center;overflow:hidden}.canvas-panel canvas{display:block;width:100%;max-height:72vh;border-radius:12px;background:#08070d;touch-action:none}.controls{padding:18px;align-self:start;max-height:78vh;overflow:auto}.control{display:grid;gap:7px;margin-bottom:14px}.control label,.control legend{font-size:.78rem;font-weight:800}.control output{color:var(--muted);float:right}.control input,.control select{width:100%;min-height:44px}.control input[type=color]{padding:3px;border:1px solid var(--border);border-radius:10px;background:var(--panel2)}.control input[type=checkbox]{width:22px;min-height:22px}.row{display:grid;grid-template-columns:1fr 1fr;gap:10px}.actions{display:flex;flex-wrap:wrap;gap:8px;margin-top:18px}.button{display:inline-flex;min-height:44px;align-items:center;justify-content:center;padding:.65rem .88rem;border:1px solid var(--border);border-radius:11px;background:var(--panel2);color:var(--text);font-weight:800;cursor:pointer;text-decoration:none}.button.primary{border-color:transparent;background:linear-gradient(135deg,var(--accent),var(--accent-two))}.button:hover{border-color:var(--accent)}.status{min-height:1.5em;color:var(--muted);font-size:.82rem}.below{display:grid;grid-template-columns:1fr 1fr;gap:18px;margin-top:18px}.info-panel{padding:20px}.info-panel h2{margin-top:0}.chips{display:flex;flex-wrap:wrap;gap:8px}.chip{padding:.45rem .7rem;border:1px solid var(--border);border-radius:999px;background:transparent;color:var(--text);cursor:pointer}.tool-footer{margin-top:30px;padding-top:20px;border-top:1px solid var(--border);color:var(--muted);font-size:.86rem}.tool-footer a{margin-right:14px}.sr-only{position:absolute!important;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}@media(max-width:850px){.studio{grid-template-columns:1fr}.controls{max-height:none}.below{grid-template-columns:1fr}.tool-heading{align-items:start;flex-direction:column}.canvas-panel canvas{max-height:58vh}}@media(max-width:520px){.tool-shell{width:min(100% - 18px,1240px);padding-top:18px}.row{grid-template-columns:1fr}.controls{padding:14px}.button{flex:1 1 42%}}@media(prefers-reduced-motion:reduce){*,*::before,*::after{scroll-behavior:auto!important;animation:none!important;transition:none!important}}
