:root{--ink:#171714;--paper:#f2efe8;--line:color-mix(in srgb, var(--ink) 30%, transparent);--world:#1f5eff;--form:#d82673;font-size:16px}*{box-sizing:border-box}html,body{width:100%;min-height:100%;margin:0}body{color:var(--ink);background:var(--paper);letter-spacing:-.015em;font-family:Arial,Helvetica,sans-serif;font-size:.78rem;overflow:hidden}button,input{font:inherit}button{color:inherit}.studio{background:var(--paper);width:100%;height:100svh;min-height:20rem}.transport-dock{z-index:20;left:50%;bottom:calc(1.1rem + env(safe-area-inset-bottom));grid-template-columns:minmax(0,1fr) 2.375rem;align-items:center;gap:.65rem;width:min(42rem,100vw - 2rem);display:grid;position:fixed;transform:translate(-50%)}.timeline{border:1.5px solid var(--ink);background:color-mix(in srgb, var(--paper) 88%, transparent);height:2.375rem;box-shadow:0 .35rem 1.5rem color-mix(in srgb, var(--ink) 14%, transparent);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border-radius:999px;grid-template-columns:minmax(0,1fr);align-items:center;padding:0;display:grid;position:relative}.transport__toggle{border:1.5px solid var(--ink);background:color-mix(in srgb, var(--paper) 88%, transparent);width:2.375rem;height:2.375rem;box-shadow:0 .35rem 1.5rem color-mix(in srgb, var(--ink) 14%, transparent);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);cursor:pointer;border-radius:50%;place-items:center;padding:0;display:grid}.transport-icon{color:currentColor;background:currentColor;display:block}.transport-icon--play{clip-path:polygon(12% 4%,94% 50%,12% 96%);width:.75rem;height:.75rem;transform:translate(.08rem)}.transport-icon--pause{background:linear-gradient(90deg,currentColor 0 31%,#0000 31% 69%,currentColor 69% 100%);width:.75rem;height:.75rem}.transport__toggle:hover,.transport__toggle:focus-visible{color:var(--paper);background:var(--ink);outline:none}.timeline input{z-index:2;appearance:none;cursor:pointer;background:0 0;width:auto;height:100%;margin:0;padding:0;position:absolute;inset:0 .4375rem}.timeline input:focus{outline:none}.timeline__rail{z-index:1;background:var(--ink);pointer-events:none;border-radius:999px;height:4px;position:absolute;top:50%;left:1.1875rem;right:1.1875rem;transform:translateY(-50%)}.timeline__keyframes{z-index:3;opacity:0;pointer-events:none;height:0;position:absolute;top:50%;left:1.1875rem;right:1.1875rem}.studio--timeline-retime .timeline__keyframes{opacity:1}.timeline__keyframe{background:var(--ink);pointer-events:none;cursor:pointer;border:0;border-radius:50%;outline:none;place-items:center;width:.5rem;height:.5rem;padding:0;display:grid;position:absolute;top:0;transform:translate(-50%,-50%)}.studio--timeline-retime .timeline__keyframe{pointer-events:auto;cursor:grab}.studio--timeline-retime .timeline__keyframe:active{cursor:grabbing}.studio--timeline-retime .timeline__keyframe--active{z-index:1;width:.75rem;height:.75rem}.timeline__keyframe:focus-visible{box-shadow:0 0 0 1.5px var(--paper), 0 0 0 3px var(--ink)}.timeline__playhead-track{z-index:4;pointer-events:none;height:0;position:absolute;top:50%;left:1.1875rem;right:1.1875rem}.timeline__playhead{background:radial-gradient(circle, white 0 2px, var(--ink) 2.5px);border-radius:50%;width:1.5rem;height:1.5rem;position:absolute;top:0;transform:translate(-50%,-50%)}.studio--timeline-retime .timeline__playhead{background:radial-gradient(circle, white 0 1px, var(--ink) 1.5px);width:.75rem;height:.75rem}.timeline input::-webkit-slider-runnable-track{background:0 0;border-radius:999px;height:4px}.timeline input::-webkit-slider-thumb{appearance:none;cursor:grab;background:0 0;border:0;border-radius:50%;width:1.5rem;height:1.5rem;margin-top:-.625rem}.timeline input::-moz-range-track{background:0 0;border-radius:999px;height:4px}.timeline input::-moz-range-thumb{cursor:grab;background:0 0;border:0;border-radius:50%;width:1.5rem;height:1.5rem}.timeline input:active::-webkit-slider-thumb{cursor:grabbing}.timeline input:active::-moz-range-thumb{cursor:grabbing}.history-control{z-index:20;border:1.5px solid var(--ink);background:color-mix(in srgb, var(--paper) 88%, transparent);width:2.375rem;height:2.375rem;box-shadow:0 .35rem 1.5rem color-mix(in srgb, var(--ink) 14%, transparent);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);cursor:pointer;border-radius:50%;place-items:center;padding:0;display:grid;position:fixed;top:1rem;right:1rem}.document-controls{z-index:20;gap:.45rem;display:flex;position:fixed;top:1rem;left:1rem}.document-controls button{border:1.5px solid var(--ink);background:color-mix(in srgb, var(--paper) 88%, transparent);width:2.375rem;height:2.375rem;box-shadow:0 .35rem 1.5rem color-mix(in srgb, var(--ink) 14%, transparent);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);cursor:pointer;border-radius:50%;place-items:center;padding:0;display:grid}.document-controls button:hover,.document-controls button:focus-visible,.history-control:hover:not(:disabled),.history-control:focus-visible:not(:disabled){color:var(--paper);background:var(--ink);outline:none}.history-control:disabled{opacity:.28;cursor:default}.stage-window{overscroll-behavior:contain;width:100%;height:100%;position:relative;overflow:hidden auto}.stage{touch-action:none;min-width:100%;display:block}.stage__background{fill:#0000}.animated-shape{cursor:grab;outline:none;transition:filter .16s,opacity .16s}.studio--paused .animated-shape:hover,.studio--paused .animated-shape:focus-visible{filter:brightness(1.04)saturate(1.08);stroke:var(--ink);stroke-width:1.5px;vector-effect:non-scaling-stroke}.studio--paused .animated-shape--selected{stroke:var(--ink);stroke-width:1.5px;vector-effect:non-scaling-stroke}.studio--vertex-track .animated-shape--selected,.studio--presenting .animated-shape,.studio--presenting .animated-shape:hover,.studio--presenting .animated-shape:focus-visible{stroke:none;filter:none}.studio--presenting .animated-shape{cursor:pointer}.studio--shape-scope .animated-shape--context{opacity:.3;filter:saturate(.35)}.studio--dragging,.studio--dragging *{-webkit-user-select:none;user-select:none;cursor:grabbing!important}.editor-overlay{--editor-stroke:#171714}.editor-overlay--world{--track-accent:var(--world)}.editor-overlay--form{--track-accent:var(--form)}.track{opacity:.64}.track--active{opacity:1}.motion-curve{fill:none;stroke:var(--editor-stroke);stroke-width:2px;stroke-linecap:round;stroke-linejoin:round;vector-effect:non-scaling-stroke;pointer-events:none}.motion-curve--world{stroke:var(--ink);stroke-width:2.5px}.motion-curve--form{stroke:var(--form);stroke-width:2.5px}.motion-node,.form-motion-node,.shape-node{fill:var(--editor-stroke);stroke:#0000;stroke-width:12px;paint-order:stroke fill;vector-effect:non-scaling-stroke;pointer-events:all;cursor:move}.motion-node,.form-motion-node{--editor-stroke:var(--ink)}.form-motion-node--landmark{--editor-stroke:var(--form);opacity:.8}.shape-node--neighbor{opacity:.55}.shape-node--neighbor:hover,.form-motion-node--landmark:hover,.form-motion-node--landmark.editor-point--selected{opacity:1}.motion-node--current,.form-motion-node--current,.shape-node--focused{fill:var(--ink)}.motion-node__dot{fill:#fff;pointer-events:none}.motion-node-preview{pointer-events:auto}.handle-line{stroke:var(--editor-stroke);stroke-width:1.5px;vector-effect:non-scaling-stroke;pointer-events:none}.handle-line--world{stroke:var(--ink)}.handle-line--form{stroke:var(--form)}.handle-line--contour{stroke:var(--ink);opacity:.9}.shape-handle-line{opacity:.9}.editor-handle{fill:var(--editor-stroke);stroke:#0000;stroke-width:12px;paint-order:stroke fill;vector-effect:non-scaling-stroke;pointer-events:all;cursor:crosshair}.editor-handle--seed{opacity:.62}.editor-handle--seed:hover,.editor-handle--seed.editor-handle--selected{opacity:1}.editor-point--selected,.editor-handle--selected{filter:drop-shadow(0 0 1px white) drop-shadow(0 0 2px var(--ink))}.editor-hit-target{fill:#0000;pointer-events:none}.selection-marquee{fill:color-mix(in srgb, var(--world) 9%, transparent);stroke:var(--world);stroke-width:1px;vector-effect:non-scaling-stroke;pointer-events:none}.document-message{z-index:30;border:1.5px solid var(--ink);white-space:pre-wrap;background:var(--paper);max-width:min(30rem,100vw - 2rem);max-height:45vh;box-shadow:0 .35rem 1.5rem color-mix(in srgb, var(--ink) 14%, transparent);border-radius:.8rem;gap:1rem;padding:.8rem .9rem;display:flex;position:fixed;top:4rem;left:1rem;overflow:auto}.document-message button{cursor:pointer;background:0 0;border:0;align-self:flex-start;padding:0;font-size:1.25rem;line-height:.8}.sr-only{clip:rect(0, 0, 0, 0);white-space:nowrap;border:0;width:1px;height:1px;margin:-1px;padding:0;position:absolute;overflow:hidden}@media (max-width:30rem){.transport-dock{bottom:calc(.6rem + env(safe-area-inset-bottom));grid-template-columns:minmax(0,1fr) 2.375rem;gap:.5rem;width:calc(100vw - 1.2rem)}.transport__toggle{width:2.375rem;height:2.375rem}.history-control{top:.6rem;right:.6rem}.document-controls{top:.6rem;left:.6rem}}@media (prefers-reduced-motion:reduce){.animated-shape{transition:none}}