@property --hue{syntax:"<number>";inherits:true;initial-value:258}@property --hue2{syntax:"<number>";inherits:true;initial-value:133}.studio-light-switches-bar .switch,.studio-light-switches-bar .switch *,.studio-light-switches-bar .switch :before,.studio-light-switches-bar .switch :after{box-sizing:border-box;border:0;margin:0;padding:0}.studio-light-switches-bar .switch{--hue:258;--hue2:133;--trans-dur:.3s;--trans-timing:cubic-bezier(.83, 0, .17, 1);background-color:hsl(var(--hue), 10%, 90%);box-shadow:0 4.375em 2em hsl(var(--hue), 10%, 70%) inset, 0 .125em 0 hsl(var(--hue), 10%, 90%) inset, 0 0 .375em hsla(var(--hue), 10%, 10%, .5);transition:background-color var(--trans-dur) var(--trans-timing), box-shadow var(--trans-dur) var(--trans-timing), --hue var(--trans-dur) var(--trans-timing);border-radius:.375em;width:3.75em;height:8.75em;font-size:calc(.0669643vw + 6.78571px);display:block;position:relative}.studio-light-switches-bar[data-light=white] .switch:not(.switch--burned){--hue:212}.studio-light-switches-bar[data-light=yellow] .switch:not(.switch--burned){--hue:40}.studio-light-switches-bar[data-light=both] .switch:not(.switch--burned){--hue:58}.studio-light-switches-bar .switch-slot:first-child{margin-inline-start:clamp(40px,22vw,380px)}.studio-light-switches-bar .switch-slot:last-child{margin-inline-end:clamp(40px,22vw,380px)}@media (max-width:767px){.studio-light-switches-bar .switch-slot:first-child{margin-inline-start:4px}.studio-light-switches-bar .switch-slot:last-child{margin-inline-end:4px}}.studio-light-switches-bar .switch,.studio-light-switches-bar .switch__input{-webkit-tap-highlight-color:transparent}.studio-light-switches-bar .switch__input,.studio-light-switches-bar .switch__lever,.studio-light-switches-bar .switch__lever-half-top,.studio-light-switches-bar .switch__lever-half-bottom,.studio-light-switches-bar .switch__lever-shadow,.studio-light-switches-bar .switch__lever-shadow:before,.studio-light-switches-bar .switch__lever-shadow:after{display:block}.studio-light-switches-bar .switch__input,.studio-light-switches-bar .switch__label,.studio-light-switches-bar .switch__lever-half-top,.studio-light-switches-bar .switch__lever-half-bottom,.studio-light-switches-bar .switch__lever-shadow,.studio-light-switches-bar .switch__lever-shadow:before,.studio-light-switches-bar .switch__lever-shadow:after{position:absolute}.studio-light-switches-bar .switch__input{cursor:pointer;z-index:6;appearance:none;width:100%;height:100%}.studio-light-switches-bar .switch__label{width:1px;height:1px;overflow:hidden}.studio-light-switches-bar .switch__lever,.studio-light-switches-bar .switch__lever-shadow{pointer-events:none}.studio-light-switches-bar .switch__lever{--hue:258;background-color:hsla(var(--hue), 10%, 80%);box-shadow:0 0 .25em hsl(var(--hue), 10%, 10%) inset, 0 0 .45em hsl(var(--hue), 10%, 90%) inset;perspective:8em;transition:background-color var(--trans-dur) var(--trans-timing), box-shadow var(--trans-dur) var(--trans-timing);border-radius:.25em;width:auto;height:auto;margin:0;position:absolute;inset:.375em}.studio-light-switches-bar .switch__lever:before{background-image:linear-gradient(hsla(var(--hue), 10%, 10%, 0), hsla(var(--hue), 10%, 10%, .2));border-radius:inherit;content:"";width:100%;height:100%;display:block}.studio-light-switches-bar .switch__lever-half-top,.studio-light-switches-bar .switch__lever-half-bottom{width:auto;height:calc(50% - .125em);transition:background-color var(--trans-dur) var(--trans-timing), transform var(--trans-dur) var(--trans-timing);justify-content:center;padding:.5em;display:flex;left:.125em;right:.125em}.studio-light-switches-bar .switch__lever-half-top{background-color:hsl(var(--hue), 10%, 85%);transform-origin:50% 100%;border-radius:.25em .25em 0 0;bottom:50%}.studio-light-switches-bar .switch__lever-half-top:before,.studio-light-switches-bar .switch__lever-half-bottom:before{content:"";transition:background-color var(--trans-dur) var(--trans-timing), box-shadow var(--trans-dur) var(--trans-timing);display:block}.studio-light-switches-bar .switch__lever-half-top:before{box-shadow:0 0 0 .125em hsl(var(--hue), 10%, 65%) inset, 0 .25em 0 hsl(var(--hue), 10%, 90%) inset, 0 .125em 0 hsl(var(--hue), 10%, 90%);border-radius:50%;width:1em;height:1em}.studio-light-switches-bar .switch__lever-half-bottom{background-color:hsl(var(--hue), 10%, 90%);transform-origin:50% 0;border-radius:0 0 .25em .25em;align-items:flex-end;top:50%;transform:rotateX(-35deg)}.studio-light-switches-bar .switch__lever-half-bottom:before{background-color:hsl(var(--hue2), 10%, 45%);box-shadow:0 .125em 0 hsl(var(--hue2), 10%, 30%) inset, 0 -.0625em 0 hsl(var(--hue), 10%, 90%) inset, 0 0 .5em hsla(var(--hue2), 90%, 45%, 0);width:.25em;height:1.125em}.studio-light-switches-bar .switch__lever-shadow{border-radius:.25em;width:auto;height:calc(100% - 1em);top:.5em;left:.375em;right:.375em;overflow:hidden}.studio-light-switches-bar .switch__lever-shadow:before,.studio-light-switches-bar .switch__lever-shadow:after{background-color:hsla(var(--hue), 10%, 10%, .15);content:"";width:3em;height:50%;transition:background-color var(--trans-dur) var(--trans-timing), transform var(--trans-dur) var(--trans-timing);left:1.625em}.studio-light-switches-bar .switch__lever-shadow:before{transform-origin:0 100%;border-radius:1.5em 0 0/1em 0 0}.studio-light-switches-bar .switch__lever-shadow:after{transform-origin:0 0;border-radius:.25em;bottom:0;transform:skew(-10deg)}.studio-light-switches-bar .switch__input:checked~.switch__lever .switch__lever-half-top{background-color:hsl(var(--hue), 10%, 70%);transform:rotateX(35deg)}.studio-light-switches-bar .switch__input:checked~.switch__lever .switch__lever-half-bottom{background-color:hsl(var(--hue), 10%, 85%);transform:rotateX(0)}.studio-light-switches-bar .switch__input:checked~.switch__lever-shadow:before{transform:rotate(-10deg)}.studio-light-switches-bar .switch__input:checked~.switch__lever-shadow:after{transform:skew(0)scaleY(.85)}.studio-light-switches-bar .switch{opacity:.78;background-color:hsl(var(--hue), 10%, 40%);box-shadow:0 4.375em 2em hsl(var(--hue), 10%, 30%) inset, 0 .125em 0 hsl(var(--hue), 10%, 40%) inset, 0 0 .375em hsla(var(--hue), 10%, 10%, .5)}.studio-light-switches-bar .switch__lever{background-color:hsla(var(--hue), 10%, 30%);box-shadow:0 0 .25em hsl(var(--hue), 10%, 10%) inset, 0 0 .4em hsl(var(--hue), 10%, 40%) inset}.studio-light-switches-bar .switch__lever-half-top{background-color:hsl(var(--hue), 10%, 35%)}.studio-light-switches-bar .switch__lever-half-top:before{box-shadow:0 0 0 .125em hsl(var(--hue), 10%, 25%) inset, 0 .25em 0 hsl(var(--hue), 10%, 40%) inset, 0 .125em 0 hsl(var(--hue), 10%, 40%)}.studio-light-switches-bar .switch__lever-half-bottom{background-color:hsl(var(--hue), 10%, 40%)}.studio-light-switches-bar .switch__lever-half-bottom:before{background-color:hsl(var(--hue2), 10%, 25%);box-shadow:0 .125em 0 hsl(var(--hue2), 10%, 20%) inset, 0 -.0625em 0 hsl(var(--hue), 10%, 40%) inset, 0 0 .5em hsla(var(--hue2), 90%, 45%, 0)}.studio-light-switches-bar .switch__lever-shadow:before,.studio-light-switches-bar .switch__lever-shadow:after{background-color:hsla(var(--hue), 10%, 10%, .25)}.studio-light-switches-bar .switch__input:checked~.switch__lever .switch__lever-half-top{background-color:hsl(var(--hue), 10%, 25%)}.studio-light-switches-bar .switch__input:checked~.switch__lever .switch__lever-half-top:before{box-shadow:0 0 0 .125em hsl(var(--hue), 10%, 15%) inset, 0 .25em 0 hsl(var(--hue), 10%, 30%) inset, 0 .125em 0 hsl(var(--hue), 10%, 30%)}.studio-light-switches-bar .switch__input:checked~.switch__lever .switch__lever-half-bottom{background-color:hsl(var(--hue), 10%, 35%)}.studio-light-switches-bar .switch__input:checked~.switch__lever .switch__lever-half-bottom:before{background-color:hsl(var(--hue2), 90%, 45%);box-shadow:0 .125em 0 hsl(var(--hue2), 90%, 20%) inset, 0 -.0625em 0 hsl(var(--hue), 10%, 40%) inset, 0 0 .5em hsla(var(--hue2), 90%, 45%, 1)}.studio-light-switches-bar .switch-slot{width:max-content;display:block;position:relative}.studio-light-switches-bar .switch__smoke{pointer-events:none;z-index:6;width:7em;height:8em;margin-left:-3.5em;position:absolute;bottom:72%;left:50%;overflow:visible}.studio-light-switches-bar .switch__smoke-puff{filter:blur(.4em);opacity:0;background:radial-gradient(55% 48% at 38% 58%,#ece8e28c,#0000 70%),radial-gradient(70% 60% at 62% 42%,#a09c9652,#0000 76%);border-radius:50%;width:2.1em;height:2.4em;animation:4.8s ease-out infinite switch-smoke-rise;display:block;position:absolute;bottom:0;left:50%;transform:translate(-50%)}.studio-light-switches-bar .switch__smoke-puff--a{width:1.5em;height:1.8em;animation-name:switch-smoke-left;animation-duration:4.2s;animation-delay:0s}.studio-light-switches-bar .switch__smoke-puff--b{width:2.6em;height:2.2em;animation-name:switch-smoke-right;animation-duration:5.6s;animation-delay:.7s}.studio-light-switches-bar .switch__smoke-puff--c{width:1.8em;height:2.8em;animation-name:switch-smoke-rise;animation-duration:5.1s;animation-delay:1.4s}.studio-light-switches-bar .switch__smoke-puff--d{width:2.2em;height:1.7em;animation-name:switch-smoke-left;animation-duration:6.2s;animation-delay:2.1s}.studio-light-switches-bar .switch__smoke-puff--e{width:1.3em;height:1.6em;animation-name:switch-smoke-right;animation-duration:3.8s;animation-delay:.35s}.studio-light-switches-bar .switch__smoke-puff--f{filter:blur(.55em);width:3em;height:2.4em;animation-name:switch-smoke-rise;animation-duration:6.8s;animation-delay:1.9s}@keyframes switch-smoke-rise{0%{opacity:0;transform:translate(-50%,.15em)scale(.25)rotate(0)}16%{opacity:.62}55%{opacity:.34}to{opacity:0;transform:translate(-42%,-7.2em)scale(2.15)rotate(12deg)}}@keyframes switch-smoke-left{0%{opacity:0;transform:translate(-50%,.1em)scale(.22)}20%{opacity:.55}to{opacity:0;transform:translate(calc(-50% - 1.8em),-6.6em)scale(1.9)rotate(-16deg)}}@keyframes switch-smoke-right{0%{opacity:0;transform:translate(-50%,.2em)scale(.28)}18%{opacity:.5}to{opacity:0;transform:translate(calc(1.6em - 50%),-7.6em)scale(2.3)rotate(14deg)}}.studio-light-switches-bar .switch--burned{--hue:24;--hue2:18;cursor:pointer;opacity:.58;background-color:#433c38;box-shadow:inset 0 4.375em 2em #201a18,inset 0 .125em #534c46,0 0 .45em #0000008c}.studio-light-switches-bar .switch--burned:after{content:"";z-index:5;border-radius:inherit;pointer-events:none;background:radial-gradient(90% 38% at 50% 12%,#0c0806b8,#0000 68%),radial-gradient(46% 28% at 58% 74%,#5c260e6b,#0000 74%),linear-gradient(#2818102e,#0000 42%);animation:.7s ease-out both switch-soot;position:absolute;inset:0}.studio-light-switches-bar .switch--burned .switch__input{cursor:pointer;pointer-events:none}.studio-light-switches-bar .switch--burned .switch__lever{background-color:#272320;box-shadow:inset 0 0 .25em #120e0d,inset 0 0 .4em #3d3834}.studio-light-switches-bar .switch--burned .switch__lever-half-top,.studio-light-switches-bar .switch--burned .switch__input:checked~.switch__lever .switch__lever-half-top{background-color:#322d2a}.studio-light-switches-bar .switch--burned .switch__lever-half-top:before,.studio-light-switches-bar .switch--burned .switch__input:checked~.switch__lever .switch__lever-half-top:before{box-shadow:inset 0 0 0 .125em #1d1816,inset 0 .25em #413c39,0 .125em #363230}.studio-light-switches-bar .switch--burned .switch__lever-half-bottom,.studio-light-switches-bar .switch--burned .switch__input:checked~.switch__lever .switch__lever-half-bottom{background-color:#393432}.studio-light-switches-bar .switch--burned .switch__lever-half-bottom:before,.studio-light-switches-bar .switch--burned .switch__input:checked~.switch__lever .switch__lever-half-bottom:before{background-color:#4a3024;box-shadow:inset 0 .125em #2a1a12,inset 0 -.0625em #4d4642,0 0 .2em #78280c26}@keyframes switch-soot{0%{opacity:0}to{opacity:1}}@media (prefers-reduced-motion:reduce){.studio-light-switches-bar .switch{transition-duration:.01ms}.studio-light-switches-bar .switch--burned:after{animation:none}.studio-light-switches-bar .switch__smoke-puff{opacity:.4;animation:none;transform:translate(-50%,-1.6em)scale(1.2)}}