/* Stock Lucide icons: see /icons/lucide/LICENSE. */
.scene-workspace{--control-button:28px}
.scene-workspace .motion-toggle,.scene-workspace .parameter-reset{width:var(--control-button)!important;height:var(--control-button)!important;min-width:var(--control-button)!important;min-height:var(--control-button)!important;max-width:var(--control-button)!important;max-height:var(--control-button)!important;box-sizing:border-box;flex:0 0 var(--control-button);border:1px solid var(--line);border-radius:50%!important;padding:0!important;margin:0;display:grid!important;place-items:center;line-height:0;font-size:0!important;background:transparent;color:var(--muted);cursor:pointer;transform:none;position:relative}
.scene-workspace .motion-toggle:before,.scene-workspace .parameter-reset:before{content:'';display:block;position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);margin:0;width:14px;height:14px;background:currentColor;mask:url('/icons/lucide/diamond.svg') center/contain no-repeat;-webkit-mask:url('/icons/lucide/diamond.svg') center/contain no-repeat;pointer-events:none}
.scene-workspace .parameter-reset:before{mask-image:url('/icons/lucide/rotate-ccw.svg');-webkit-mask-image:url('/icons/lucide/rotate-ccw.svg')}
.scene-workspace .motion-toggle:hover,.scene-workspace .parameter-reset:hover{border-color:var(--text);color:var(--text)}
.scene-workspace .motion-toggle.active{color:var(--accent);border-color:var(--accent);background:color-mix(in srgb,var(--accent) 10%,transparent)}
.scene-workspace .motion-toggle:focus-visible,.scene-workspace .parameter-reset:focus-visible,.viewport-cube:focus-visible{outline:2px solid var(--accent);outline-offset:3px}
.parameter-track{display:grid;grid-template-columns:var(--control-button) minmax(0,1fr) var(--control-button);align-items:center;gap:8px;min-width:0}
.parameter-track>.base-parameter{margin:0;min-width:0;width:100%}.parameter-track>input[type=range]{height:28px}
.scene-control .control-row{padding:0 calc(var(--control-button) + 8px);margin-bottom:4px;align-items:center}.scene-control .control-row>label{max-width:none;font-size:12px;line-height:1.35}
.scene-control .parameter-number{width:64px;height:27px;line-height:1.2;text-align:right;appearance:textfield;-moz-appearance:textfield}.scene-control .parameter-number::-webkit-inner-spin-button{appearance:none}
.scene-workspace .scene-vector[open]{display:block}.scene-workspace .scene-vector .scene-control{margin-bottom:12px}.scene-workspace .scene-vector .control-row{display:flex}.scene-workspace .scene-vector .parameter-number{width:64px}.scene-workspace .scene-vector .parameter-head{margin:0}
.scene-workspace .scene-rotation[open]{display:block}.scene-workspace .scene-rotation .control-row{display:none}.scene-workspace .scene-rotation .scene-control{margin-bottom:7px}.scene-workspace .scene-spin{height:30px;font-size:12px}
.scene-workspace .source-parameter-track{grid-column:1/-1;grid-template-columns:var(--control-button) minmax(0,1fr);width:100%}.source-parameter-track input[type=range]{width:100%;min-width:0;margin:0}
.scene-workspace .inspector :is(label,summary,button,.tool-block-head,.control-label,.color-motion-settings,.svg-source-range,.svg-source-option,.svg-paint-grid){text-transform:none;letter-spacing:normal}.scene-workspace .inspector-tabs button{text-transform:none;font-size:13px;letter-spacing:0}.scene-workspace .motion-field{font-size:10px}.scene-workspace .motion-field select{text-transform:none}
.scene-workspace .stage{position:relative;cursor:grab;touch-action:none;user-select:none}.scene-workspace .stage.is-rotating{cursor:grabbing}.scene-workspace .stage .paper{pointer-events:none}
.viewport-gizmo{position:absolute;right:12px;bottom:12px;z-index:4;width:100px;display:grid;justify-items:center;gap:1px;cursor:default;color:var(--text)}
.viewport-cube{display:block;width:100px;height:100px;touch-action:none;cursor:grab;overflow:visible}.is-rotating .viewport-cube{cursor:grabbing}
.viewport-view{width:92px;min-height:26px;border:1px solid var(--line);border-radius:5px;padding:3px 6px;font:11px var(--font-sans,Arial,sans-serif);background:var(--panel);color:var(--text);cursor:pointer}
.scene-workspace .timeline,.scene-workspace .timeline.curves-open{grid-template-columns:auto minmax(180px,1fr) auto;gap:18px;padding:10px 18px;align-items:center;height:78px;grid-template-rows:54px}
.scene-workspace .timeline.curves-open{height:300px;grid-template-rows:54px minmax(0,1fr)}
.scene-workspace .timeline-transport{display:flex;align-items:center;gap:6px}
.scene-workspace .timeline-transport button{display:grid;place-items:center;width:32px;height:32px;min-width:32px;min-height:32px;padding:0;border:1px solid var(--line);border-radius:50%;font-size:0;line-height:0;background:transparent;color:var(--muted);cursor:pointer}
.scene-workspace #timelinePlay{color:var(--bg);background:var(--text);border-color:var(--text)}.scene-workspace #timelinePlay.playing{background:var(--accent);border-color:var(--accent)}
.scene-workspace #timelineLoop.active,.scene-workspace #curveToggle[aria-expanded=true]{color:var(--accent);border-color:var(--accent)}
.scene-workspace #timelineLoop:before,.scene-workspace #curveToggle:before,.scene-workspace #timelinePlayIcon:before{content:'';display:block;width:16px;height:16px;background:currentColor;mask:url('/icons/lucide/repeat.svg') center/contain no-repeat;-webkit-mask:url('/icons/lucide/repeat.svg') center/contain no-repeat}
.scene-workspace #curveToggle:before{mask-image:url('/icons/lucide/spline.svg');-webkit-mask-image:url('/icons/lucide/spline.svg')}
.scene-workspace #timelinePlayIcon{font-size:0;line-height:0;display:grid;place-items:center}.scene-workspace #timelinePlayIcon:before{mask-image:url('/icons/lucide/play.svg');-webkit-mask-image:url('/icons/lucide/play.svg')}.scene-workspace .playing #timelinePlayIcon:before{mask-image:url('/icons/lucide/pause.svg');-webkit-mask-image:url('/icons/lucide/pause.svg')}
.scene-workspace .timeline-position{display:grid;grid-template-columns:auto minmax(40px,1fr) auto;align-items:center;gap:9px;min-width:0}
.scene-workspace .timeline-time{font:11px ui-monospace,SFMono-Regular,Menlo,monospace;font-variant-numeric:tabular-nums;min-width:0;margin:0;color:var(--muted);white-space:nowrap}
.scene-workspace .timeline-position .timeline-track{display:block;grid-column:auto;grid-row:auto;padding:0;min-width:0}.scene-workspace .timeline-position .timeline-ruler{display:none}.scene-workspace .timeline-position .timeline-scrub{display:block;height:30px}
.scene-workspace .timeline-settings{display:grid;grid-template-columns:72px 58px 52px 164px;gap:8px;align-items:end;justify-self:end;min-width:0}
.scene-workspace .timeline-settings .player-field{display:grid;grid-template-columns:minmax(0,1fr);gap:5px;align-items:start;min-width:0;max-width:none;margin:0;position:static}
.scene-workspace .timeline-settings .player-field>span,.scene-workspace .timeline-settings .player-field label{display:block;font-size:11px;line-height:1.2;font-weight:400;letter-spacing:0;text-transform:none;color:var(--muted)}
.scene-workspace .timeline-settings .player-field input,.scene-workspace .timeline-settings .player-field select,.scene-workspace .timeline-settings #size{display:block;box-sizing:border-box;width:100%;max-width:none;min-width:0;height:30px;min-height:30px;margin:0;padding:4px 6px;border:1px solid var(--line);border-radius:5px;background:var(--bg);color:var(--text);font:11px ui-monospace,SFMono-Regular,Menlo,monospace;line-height:1.2;text-transform:none}
.scene-workspace .timeline-settings .size-control{min-width:0}.scene-workspace .timeline-settings .control-row{padding:0;margin:0;display:block}.scene-workspace .timeline-settings small{display:none}.scene-workspace .timeline .curve-editor{grid-column:1/-1}
@media(max-width:1050px) and (min-width:901px){.scene-workspace .timeline{gap:10px;padding-inline:12px}.scene-workspace .timeline-settings{grid-template-columns:62px 48px 48px 154px;gap:5px}.scene-workspace .timeline-position{gap:5px}.scene-workspace .timeline-time{font-size:10px}}
@media(max-width:900px){
.scene-workspace{--control-button:30px}.scene-workspace .viewport-gizmo{width:76px;right:7px;bottom:7px}.viewport-cube{width:76px;height:76px}.viewport-view{width:76px;font-size:10px;min-height:26px}
.scene-workspace .timeline,.scene-workspace .timeline.curves-open{height:auto;grid-template-columns:minmax(0,1fr) 34px;grid-template-rows:34px;gap:6px;padding:8px 12px calc(8px + env(safe-area-inset-bottom,0px))}
.scene-workspace .timeline #mobilePlayerToggle{grid-column:2;grid-row:1;width:32px;height:32px;min-height:32px;min-width:32px;margin:0}.scene-workspace .timeline-transport{grid-column:1;grid-row:1}
.scene-workspace .timeline .timeline-position,.scene-workspace .timeline .timeline-settings,.scene-workspace .timeline #timelineLoop,.scene-workspace .timeline #curveToggle{display:none}
.scene-workspace .editor.mobile-player-open{--mobile-player:200px}.scene-workspace .mobile-player-open .timeline,.scene-workspace .mobile-player-open .timeline.curves-open{grid-template-rows:34px 30px 108px}
.scene-workspace .mobile-player-open .timeline #timelineLoop,.scene-workspace .mobile-player-open .timeline #curveToggle{display:grid}
.scene-workspace .mobile-player-open .timeline-position{display:grid;grid-column:1/-1;grid-row:2;gap:8px}.scene-workspace .mobile-player-open .timeline-time{display:block}.scene-workspace .mobile-player-open .timeline-track{display:block;grid-column:auto;grid-row:auto}
.scene-workspace .mobile-player-open .timeline-settings{display:grid;grid-column:1/-1;grid-row:3;grid-template-columns:repeat(2,minmax(0,1fr));grid-template-rows:50px 50px;gap:8px 12px;width:100%}
.scene-workspace .timeline-settings .player-field{grid-column:auto;grid-row:auto;display:grid;gap:4px}.scene-workspace .timeline-settings .player-field input,.scene-workspace .timeline-settings .player-field select{height:32px;min-height:32px;font-size:12px}
.scene-workspace .timeline.curves-open .curve-editor{position:absolute;bottom:100%;left:0;right:0;height:min(320px,48dvh);background:var(--panel);grid-template-columns:90px minmax(0,1fr)}
}
.scene-workspace .parameter-track input[type=range]{appearance:none;-webkit-appearance:none;min-height:28px;height:28px;accent-color:var(--accent)}
.scene-workspace .parameter-track input[type=range]::-webkit-slider-runnable-track{height:5px;border-radius:3px;background:linear-gradient(to right,var(--accent) var(--range-progress,0%),var(--line) var(--range-progress,0%))}
.scene-workspace .parameter-track input[type=range]::-webkit-slider-thumb{appearance:none;-webkit-appearance:none;box-sizing:border-box;width:14px;height:14px;margin-top:-4.5px;border:2px solid var(--panel);border-radius:50%;background:var(--text)}
.scene-workspace .parameter-track input[type=range]::-moz-range-thumb{box-sizing:border-box;width:14px;height:14px;border:2px solid var(--panel);border-radius:50%;background:var(--text)}
.scene-workspace #timelineScrub::-webkit-slider-runnable-track{height:5px;border-radius:3px;background:linear-gradient(to right,var(--accent) 0 var(--progress),var(--line) var(--progress) 100%)}
.scene-workspace #timelineScrub::-webkit-slider-thumb{appearance:none;box-sizing:border-box;width:13px;height:13px;border:2px solid var(--panel);border-radius:50%;margin-top:-4px;background:var(--accent)}
.scene-workspace #timelineScrub::-moz-range-thumb{box-sizing:border-box;width:13px;height:13px;border:2px solid var(--panel);border-radius:50%;background:var(--accent)}
.scene-workspace .scene-control select{height:30px;background:var(--bg);border-color:var(--line);color:var(--text);border-radius:5px}.scene-workspace .scene-gradient .scene-direction-pad{margin:0 auto 14px}
@media(max-width:900px){.scene-workspace .parameter-track input[type=range]::-webkit-slider-thumb{width:18px;height:18px;margin-top:-6.5px}.scene-workspace .parameter-track input[type=range]::-moz-range-thumb{width:18px;height:18px}}

.scene-workspace .source-parameter-track>input{grid-column:2;grid-row:1}.scene-workspace .source-parameter-track>.parameter-reset{grid-column:1;grid-row:1}

/* Keep the play/pause hit target stable while the frame clock updates. */
.scene-workspace #timelinePlayIcon,.scene-workspace #timelinePlayIcon:before{pointer-events:none}

.viewport-cube>*{pointer-events:none}.scene-workspace .stage.is-panning{cursor:move}
/* Compact source monitor; its frozen frame uses the same paint and clock as export. */
.svg-source-preview{height:132px;width:100%;box-sizing:border-box;overflow:hidden;border:1px solid var(--line);border-radius:8px;margin:8px 0 10px;display:grid;place-items:center}
.svg-source-preview>svg{display:block;width:100%;height:100%;max-height:132px}
.svg-animation-controls{border-top:1px solid var(--line);margin-top:10px;padding-top:8px;display:grid;grid-template-columns:1fr 1fr;gap:12px;align-items:center}
.svg-animation-controls[hidden]{display:none!important}.svg-animation-controls .svg-source-option{margin:0;gap:8px}.svg-source-cycles{display:flex;gap:10px;align-items:center;justify-content:space-between;font-size:12px}.svg-source-cycles input{width:56px;min-height:30px;box-sizing:border-box;background:transparent;color:var(--text);border:1px solid var(--line);border-radius:5px;padding:4px 6px;font:inherit}.svg-source-cycles input:disabled{opacity:.4}
@media(max-width:760px){.svg-source-preview,.svg-source-preview>svg{height:104px;max-height:104px}}
.dimension-switch{position:absolute;top:14px;right:14px;z-index:5;display:flex;padding:3px;gap:2px;background:var(--bg);border:1px solid var(--line);border-radius:20px;box-shadow:0 2px 12px #00000012}.dimension-switch button{border:0;border-radius:16px;min-width:36px;height:28px;padding:0 9px;font:500 12px var(--font-mono,monospace);color:var(--muted);background:none;cursor:pointer}.dimension-switch button[aria-pressed=true]{background:var(--text);color:var(--bg)}.dimension-switch button:focus-visible{outline:2px solid var(--accent);outline-offset:2px}.is-2d .viewport-gizmo,.dimension-hidden,.dimension-empty{display:none!important}.is-2d .stage{cursor:grab}.is-2d .stage.is-panning{cursor:grabbing}@media(max-width:760px){.dimension-switch{top:8px;right:8px}.dimension-switch button{height:28px;min-width:34px}}

.is-2d .scene-vector[open]{grid-template-columns:repeat(2,minmax(0,1fr))}.is-2d .scene-rotation[open],.is-2d .scene-gradient[open]{grid-template-columns:1fr}.dimension-switch button{touch-action:manipulation}.dimension-switch button:focus-visible{outline:2px solid var(--accent);outline-offset:3px}