*,:before,:after{box-sizing:border-box}html,body{background:#000;width:100%;height:100%;margin:0;overflow:hidden}body{color:#f2f2f2;-webkit-font-smoothing:antialiased;letter-spacing:-.2px;font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif;font-size:14px}button,label{-webkit-tap-highlight-color:transparent}button{appearance:none;color:inherit;cursor:pointer;font:inherit;letter-spacing:inherit;background:0 0;border:0;padding:0}p{margin:0}.canvas{opacity:0;touch-action:none;width:100%;height:100%;transition:opacity 1.2s;display:block;position:fixed;inset:0}.is-ready .canvas{opacity:1}.is-idle.is-playing .canvas{cursor:none}.is-capture .canvas{opacity:1;transition:none}@media (prefers-reduced-motion:reduce){.canvas{transition-duration:.3s}}.boxes{pointer-events:none;z-index:1;width:100%;height:100%;position:fixed;inset:0}.chrome{opacity:0;padding:max(24px, env(safe-area-inset-top)) max(24px, env(safe-area-inset-right)) max(24px, env(safe-area-inset-bottom)) max(24px, env(safe-area-inset-left));pointer-events:none;z-index:2;grid-template-rows:auto 1fr auto;grid-template-columns:minmax(0,1fr) auto;transition:opacity 1.2s .6s;display:grid;position:fixed;inset:0}.is-ready .chrome{opacity:1}.is-capture .chrome{display:none}.is-video .chrome{opacity:1;transition:none;display:grid}.chrome a,.chrome button,.chrome label{pointer-events:auto}@media (width<=640px){.chrome{padding:max(16px, env(safe-area-inset-top)) max(16px, env(safe-area-inset-right)) max(16px, env(safe-area-inset-bottom)) max(16px, env(safe-area-inset-left));font-size:13px}}@media (prefers-reduced-motion:reduce){.chrome{transition-duration:.3s}}.link{color:inherit;line-height:normal;text-decoration:none;position:relative}.link:after{content:"";transform-origin:100%;background:currentColor;height:1px;transition:transform .6s cubic-bezier(.19,1,.22,1);position:absolute;bottom:0;left:0;right:0;transform:scaleX(0)}@media (prefers-reduced-motion:reduce){.link:after{transition-duration:10ms}}.link:hover:after,.link:focus-visible:after,.link[aria-pressed=true]:after{transform-origin:0;transform:scaleX(1)}.link:focus-visible{outline:none}.logo{grid-area:1/1;place-self:start;height:22px;display:block}.logo img{width:auto;height:100%;display:block}.logo:focus-visible{outline-offset:6px;outline:1px solid}.contact{grid-area:1/2;place-self:start end;gap:16px;display:flex}@media (hover:none){.downloads{display:none}}.is-video .downloads{display:none}.copy{text-wrap:balance;grid-area:3/1;align-self:end;max-width:520px;line-height:20px;transition:opacity 1.2s .6s}.is-idle.is-playing .copy{opacity:0;transition-duration:.6s;transition-delay:0s}.is-video .copy{display:none}@media (width<=640px){.copy{max-width:325px}.is-tuning .copy{opacity:0;visibility:hidden;transition-duration:.3s;transition-delay:0s}}@media (prefers-reduced-motion:reduce){.copy{transition-duration:.3s}}.track__hint{font-weight:600;display:none}.is-blocked .track__hint--blocked{display:inline}.track__hint--touch{display:none}@media (hover:none){.track__hint--touch{display:inline}.track__hint--pointer{display:none}}.track__file{cursor:pointer;white-space:nowrap;font-weight:600}.is-blocked .track__file{display:none}.track__file:focus-within:after{transform-origin:0;transform:scaleX(1)}.track__listen{font-weight:600}.track__listen[hidden]{display:none}.track__error{color:#f2f2f273}.track__error:empty{display:none}.track__input{opacity:0;width:1px;height:1px;position:absolute;overflow:hidden}.scenes{display:inline}.scenes__list{margin:0 8px 0 0;padding:0;list-style:none;display:inline}.scenes__item{white-space:nowrap;display:inline}.scenes__item:not(:last-child):after{content:", "}.scenes__item:last-child:after{content:"."}.scenes__auto:focus-visible{outline-offset:2px;outline:1px solid}.scenes__button[aria-pressed=false]{color:#f2f2f273}@media (hover:hover){.scenes__button:hover{color:#f2f2f2}}.tune{-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);opacity:0;visibility:hidden;background:#0a0a0ab8;border:1px solid #f2f2f229;grid-template-columns:max-content 112px 40px;align-items:center;gap:8px 16px;min-width:0;margin:0 0 16px;padding:12px 16px;line-height:20px;transition:opacity .4s,transform .6s cubic-bezier(.19,1,.22,1),visibility 0s linear .6s;display:grid;position:absolute;bottom:100%;right:0;transform:translateY(4px)}.tune:before{content:"";pointer-events:none;background:linear-gradient(#f2f2f2,#f2f2f2) 0 0/4px 4px no-repeat,linear-gradient(#f2f2f2,#f2f2f2) 100% 0/4px 4px no-repeat,linear-gradient(#f2f2f2,#f2f2f2) 100% 100%/4px 4px no-repeat,linear-gradient(#f2f2f2,#f2f2f2) 0 100%/4px 4px no-repeat;position:absolute;inset:-2.5px}.is-tuning .tune{opacity:1;visibility:visible;transition:opacity .4s,transform .6s cubic-bezier(.19,1,.22,1),visibility;transform:none}.is-tuning.is-idle.is-playing .tune{opacity:0;visibility:hidden;transition:opacity .6s,visibility 0s linear .6s}.is-video .tune{display:none}@media (prefers-reduced-motion:reduce){.tune{transition-duration:10ms;transform:none}}.tune__row{pointer-events:auto;display:contents}.tune__label{color:#f2f2f299;cursor:pointer;transition:color .3s}.tune__row:hover .tune__label,.tune__row:focus-within .tune__label{color:#f2f2f2}.tune__value{font-variant-numeric:tabular-nums;text-align:right}.tune__range{--value:100%;appearance:none;color:#f2f2f2;cursor:pointer;background:0 0;width:100%;height:20px;margin:0}.tune__range::-webkit-slider-runnable-track{background:linear-gradient(to right, currentcolor var(--value), #f2f2f233 var(--value));height:1px}.tune__range::-moz-range-track{background:linear-gradient(to right, currentcolor var(--value), #f2f2f233 var(--value));height:1px}.tune__range::-webkit-slider-thumb{appearance:none;background:currentColor;border:0;border-radius:0;width:7px;height:7px;margin-top:-3px}.tune__range::-moz-range-thumb{background:currentColor;border:0;border-radius:0;width:7px;height:7px}.tune__range:focus-visible{outline-offset:2px;outline:1px solid}.tune__check{appearance:none;color:#f2f2f299;cursor:pointer;background:linear-gradient(currentColor,currentColor) 3px/5px 5px no-repeat;border:1px solid #f2f2f266;border-radius:0;justify-self:start;width:25px;height:13px;margin:0;transition:background-position .4s cubic-bezier(.19,1,.22,1),border-color .3s,color .3s}.tune__check:checked{color:#f2f2f2;background-position:calc(100% - 3px);border-color:#f2f2f2}.tune__check:focus-visible{outline-offset:2px;outline:1px solid #f2f2f2}@media (prefers-reduced-motion:reduce){.tune__check{transition-duration:10ms}}.dock{grid-area:3/2;place-self:end;align-items:center;gap:16px;display:flex}.dock__settings{position:relative}.cog{color:#f2f2f273;justify-content:center;align-items:center;width:28px;height:28px;margin:-6px;transition:color .3s,opacity 1.2s .6s;display:flex}.cog:hover,.cog[aria-expanded=true]{color:#f2f2f2}.is-idle.is-playing .cog{opacity:0;transition-duration:.6s;transition-delay:0s}.is-video .cog{display:none}.cog:focus-visible{outline-offset:2px;outline:1px solid}@media (prefers-reduced-motion:reduce){.cog{transition-duration:.3s}}.cog__icon{display:block}.toggle{justify-content:center;align-items:center;width:28px;height:28px;margin:-6px;display:flex}.toggle:disabled{cursor:default;opacity:.3}.toggle:focus-visible{outline-offset:2px;outline:1px solid}.bars{align-items:flex-end;gap:2px;height:12px;display:flex}.bars span{transform-origin:bottom;background:currentColor;width:2px;height:100%;transition:transform .4s;transform:scaleY(.2)}[aria-pressed=true] .bars span{animation:.9s ease-in-out infinite alternate bars}[aria-pressed=true] .bars span:nth-child(2){animation-delay:-.45s}[aria-pressed=true] .bars span:nth-child(3){animation-delay:-.2s}[aria-pressed=true] .bars span:nth-child(4){animation-delay:-.7s}@media (prefers-reduced-motion:reduce){[aria-pressed=true] .bars span{animation:none;transform:scaleY(.7)}}@keyframes bars{0%{transform:scaleY(.2)}to{transform:scaleY(1)}}.drop{opacity:0;pointer-events:none;z-index:3;background:#0009;justify-content:center;align-items:center;transition:opacity .3s;display:flex;position:fixed;inset:0}.is-dragging .drop{opacity:1}.drop__label{border:1px dashed #f2f2f280;padding:24px 40px}.unsupported{display:none;position:fixed;top:50%;left:50%;transform:translate(-50%,-50%)}.is-unsupported .unsupported{display:block}
