.ds-root{border:1px solid var(--border);background:var(--card);border-radius:.875rem;flex-direction:column;display:flex;overflow:hidden}.ds-root:fullscreen,.ds-root[data-fullscreen=css]{border:0;border-radius:0;width:100%;height:100%}.ds-root[data-fullscreen=css]{z-index:100;height:100dvh;position:fixed;inset:0}.ds-root::backdrop{background:var(--card)}html.ds-scroll-lock{overflow:hidden}.ds-toolbar{border-bottom:1px solid var(--border);flex-wrap:wrap;align-items:center;gap:.5rem .75rem;padding:.5rem .625rem .5rem .875rem;display:flex}.ds-tool-button{border:1px solid var(--border);height:2.125rem;color:var(--foreground);border-radius:.5rem;align-items:center;gap:.375rem;padding:0 .625rem;font-size:.8125rem;font-weight:700;transition:border-color .15s,box-shadow .15s,transform .15s;display:inline-flex;&:hover{border-color:var(--primary);box-shadow:2px 2px 0 0 var(--primary);transform:translate(-1px,-1px)}}.ds-viewport{height:var(--ds-stage-height,34rem);position:relative;overflow:hidden}@media (width<=639px){.ds-viewport{height:var(--ds-stage-height-phone,31rem)}}.ds-root:fullscreen .ds-viewport,.ds-root[data-fullscreen=css] .ds-viewport{flex:1 1 0;height:auto}.ds-stage{cursor:grab;-webkit-user-select:none;user-select:none;touch-action:pan-y;position:absolute;inset:0;&.is-dragging{cursor:grabbing}}.ds-root:fullscreen .ds-stage,.ds-root[data-fullscreen=css] .ds-stage{touch-action:none}.ds-svg{width:100%;height:100%;display:block;overflow:visible}@media (width<=719px){.ds-stage:not([data-ready]) .ds-svg{visibility:hidden}}.ds-world{transform-origin:0 0;transition:var(--ds-camera-transition,none)}.ds-zoom{border:1px solid var(--border);background:var(--card);border-radius:.5rem;flex-direction:column;display:flex;position:absolute;top:.625rem;left:.625rem;overflow:hidden;& button{width:2.125rem;height:2.125rem;color:var(--foreground);justify-content:center;align-items:center;transition:background-color .15s,color .15s;display:flex;&:hover:not(:disabled){background:var(--muted)}&:disabled{color:var(--muted-foreground);opacity:.45}&+button{border-top:1px solid var(--border)}}}.ds-panel{z-index:2;border:2px solid var(--primary);background:var(--card);width:22rem;box-shadow:4px 4px 0 0 var(--accent);border-radius:.75rem;flex-direction:column;animation:.22s cubic-bezier(.2,.7,.2,1) ds-slide-in;display:flex;position:absolute;top:.625rem;bottom:.625rem;right:.625rem;overflow:hidden;&.is-sheet{width:auto;max-height:52%;animation-name:ds-slide-up;inset:auto .5rem .5rem}}.ds-panel-body{overscroll-behavior:contain;scrollbar-width:thin;flex:auto;padding:1rem;overflow-y:auto}.ds-panel-bar{z-index:2;background:var(--primary);width:min(20rem,100% - 1.25rem);color:var(--primary-foreground);box-shadow:3px 3px 0 0 var(--accent);border-radius:.625rem;align-items:center;gap:.5rem;padding:.375rem .375rem .375rem .75rem;animation:.2s cubic-bezier(.2,.7,.2,1) ds-slide-up;display:flex;position:absolute;bottom:.625rem;right:.625rem;&.is-sheet{width:auto;bottom:.5rem;left:.5rem;right:.5rem}}.ds-step-button{height:2rem;color:var(--foreground);border-radius:.375rem;align-items:center;gap:.25rem;padding:0 .5rem;font-size:.8125rem;font-weight:700;display:inline-flex;&:hover{background:var(--muted)}}@keyframes ds-slide-in{0%{opacity:0;transform:translate(1.5rem)}}@keyframes ds-slide-up{0%{opacity:0;transform:translateY(1.5rem)}}.ds-legend{border-top:1px solid var(--border);align-items:center;gap:.75rem;padding:.625rem .75rem;display:flex}.ds-chip{border:1px solid var(--border);border-radius:999px;align-items:center;gap:.375rem;height:1.875rem;padding:0 .625rem;font-size:.75rem;font-weight:700;transition:border-color .15s,background-color .15s;display:inline-flex;&:hover{border-color:currentColor}}@media (width<=639px){.ds-legend{padding:.5rem}.ds-chip{gap:.25rem;height:1.625rem;padding:0 .5rem;font-size:.6875rem}}.ds-icon-button{width:2rem;height:2rem;color:var(--muted-foreground);border-radius:.375rem;justify-content:center;align-items:center;transition:background-color .15s,color .15s;display:flex;&:hover{background:var(--muted);color:var(--foreground)}&.is-dark{color:var(--primary-foreground);&:hover{color:var(--accent);background:#ffffff1f}}}@media (prefers-reduced-motion:reduce){.ds-panel,.ds-panel-bar{animation:none}.ds-world{transition:none}}
