.sg-root{--sg-dark:0;--sg-wood:#d8ba95;--sg-sand:#ebe2d3;--sg-rake:#b8865b;--sg-rake-dark:#67432e;--sg-shadow:46 32 18;--sg-shadow-strength:1;--sg-quiet:var(--muted,#6b6b66);--sg-loud:var(--heading,#22221f);--sg-ease-ui:cubic-bezier(.2, .8, .2, 1);-webkit-user-select:none;user-select:none;flex-direction:column;align-items:center;gap:14px;width:min(540px,100%);display:flex}@supports (color:lab(0% 0 0)){.sg-root{--sg-wood:lab(77.383% 7.2785 22.7697);--sg-sand:lab(90.1981% 1.3642 8.36076);--sg-rake:lab(60.3193% 15.7695 31.3209);--sg-rake-dark:lab(32.421% 13.9204 19.8312);--sg-quiet:var(--muted,lab(45.0833% -.770927 2.93185));--sg-loud:var(--heading,lab(13.0496% -.566229 2.20828))}}[data-theme=dark] .sg-root{--sg-dark:1;--sg-wood:#4e372a;--sg-sand:#cebaa2;--sg-rake:#9a7050;--sg-rake-dark:#4b3122;--sg-shadow:0 0 0;--sg-shadow-strength:2.2}@supports (color:lab(0% 0 0)){[data-theme=dark] .sg-root{--sg-wood:lab(25.557% 9.39165 12.495);--sg-sand:lab(76.8162% 4.59349 14.9241);--sg-rake:lab(51.0305% 14.1717 24.5208);--sg-rake-dark:lab(23.2029% 10.7191 14.2949)}}@media (prefers-color-scheme:dark){:root:not([data-theme=light]) .sg-root{--sg-dark:1;--sg-wood:#4e372a;--sg-sand:#cebaa2;--sg-rake:#9a7050;--sg-rake-dark:#4b3122;--sg-shadow:0 0 0;--sg-shadow-strength:2.2}@supports (color:lab(0% 0 0)){:root:not([data-theme=light]) .sg-root{--sg-wood:lab(25.557% 9.39165 12.495);--sg-sand:lab(76.8162% 4.59349 14.9241);--sg-rake:lab(51.0305% 14.1717 24.5208);--sg-rake-dark:lab(23.2029% 10.7191 14.2949)}}}.sg-tray{aspect-ratio:560/368;background:linear-gradient(var(--sg-sand), var(--sg-sand)) 50% 50% / calc(100% * 512 / 560) calc(100% * 320 / 368) no-repeat, var(--sg-wood);width:100%;box-shadow:0 .5px 1px rgb(var(--sg-shadow) / calc(.2 * var(--sg-shadow-strength))), 0 4px 10px -3px rgb(var(--sg-shadow) / calc(.14 * var(--sg-shadow-strength))), 0 22px 40px -18px rgb(var(--sg-shadow) / calc(.3 * var(--sg-shadow-strength)));border-radius:6px;position:relative;overflow:clip;container-type:inline-size}.sg-tray>*{--sg-u:calc(100cqw / 560)}.sg-tray:after{content:"";border-radius:inherit;box-shadow:inset 0 0 0 .5px rgb(var(--sg-shadow) / .22), inset 0 1px 0 #ffffff38;pointer-events:none;position:absolute;inset:0}@supports (color:lab(0% 0 0)){.sg-tray:after{box-shadow:inset 0 0 0 .5px rgb(var(--sg-shadow) / .22), inset 0 1px 0 lab(100% 0 0/.22)}}.sg-canvas{opacity:0;width:100%;height:100%;transition:opacity .22s var(--sg-ease-ui);display:block;position:absolute;inset:0}.sg-root[data-ready] .sg-canvas{opacity:1}.sg-sand{cursor:crosshair;touch-action:none;-webkit-tap-highlight-color:transparent;background:0 0;border:0;width:91.4286%;height:86.9565%;margin:0;padding:0;position:absolute;top:6.52174%;left:4.28571%}@media (hover:hover) and (pointer:fine){.sg-sand{cursor:none}}.sg-sand:focus-visible{outline:2px solid var(--link,#3d7a50);outline-offset:calc(var(--sg-u) * -3);border-radius:2px}@supports (color:lab(0% 0 0)){.sg-sand:focus-visible{outline:2px solid var(--link,lab(46.3206% -28.2577 16.8119))}}.sg-rake{opacity:0;pointer-events:none;will-change:transform, opacity;width:0;height:0;filter:drop-shadow(calc(var(--sg-u) * 2.6) calc(var(--sg-u) * 2.1) calc(var(--sg-u) * 1.6) #2e20126b);transition:opacity .14s var(--sg-ease-ui);position:absolute;top:0;left:0}.sg-rake svg{left:calc(var(--sg-u) * -6);top:calc(var(--sg-u) * -28);width:calc(var(--sg-u) * 80);height:calc(var(--sg-u) * 56);transform-origin:calc(var(--sg-u) * 6) calc(var(--sg-u) * 28);position:absolute;overflow:visible}.sg-rake-bar{fill:var(--sg-rake);stroke:var(--sg-rake-dark);stroke-width:.7px}.sg-rake-handle{stroke:none}.sg-rake-peg{fill:var(--sg-rake-dark);opacity:.7}.sg-controls{align-items:center;gap:2px;min-height:40px;display:flex}.sg-action{min-height:40px;color:var(--sg-quiet);font:inherit;letter-spacing:.005em;cursor:pointer;-webkit-tap-highlight-color:transparent;transition:color .15s var(--sg-ease-ui), background-color .15s var(--sg-ease-ui), transform .16s var(--sg-ease-ui);background:0 0;border:0;border-radius:999px;padding:0 16px;font-size:13px;font-weight:500}.sg-action-label{animation:sg-label .22s var(--sg-ease-ui) both;display:inline-block}@keyframes sg-label{0%{opacity:0;transform:translateY(3px)}}.sg-mute{width:40px;height:40px;color:var(--sg-quiet);cursor:pointer;-webkit-tap-highlight-color:transparent;transition:color .15s var(--sg-ease-ui), background-color .15s var(--sg-ease-ui), transform .16s var(--sg-ease-ui);background:0 0;border:0;border-radius:999px;place-items:center;padding:0;display:grid}.sg-mute svg{width:18px;height:18px}@media (hover:hover){.sg-action:hover,.sg-mute:hover{color:var(--sg-loud);background:color-mix(in oklch, var(--sg-loud) 7%, transparent)}}.sg-action:active,.sg-mute:active{transform:scale(.97)}.sg-action:focus-visible,.sg-mute:focus-visible{outline:2px solid var(--link,#3d7a50);outline-offset:2px;color:var(--sg-loud)}@supports (color:lab(0% 0 0)){.sg-action:focus-visible,.sg-mute:focus-visible{outline:2px solid var(--link,lab(46.3206% -28.2577 16.8119))}}.sg-error{text-align:center;color:var(--sg-quiet);font-size:13px;position:absolute;inset:auto 0 12px}.sg-sr-only{clip-path:inset(50%);white-space:nowrap;width:1px;height:1px;position:absolute;overflow:hidden}@media (prefers-reduced-motion:reduce){.sg-action-label{animation:none}.sg-rake{transition:none}}