@font-face{font-family:Source Code Pro Variable;font-style:normal;font-display:swap;font-weight:200 900;src:url(/assets/source-code-pro-cyrillic-ext-wght-normal-DBsY_gco.woff2) format("woff2-variations");unicode-range:U+0460-052F,U+1C80-1C88,U+20B4,U+2DE0-2DFF,U+A640-A69F,U+FE2E-FE2F}@font-face{font-family:Source Code Pro Variable;font-style:normal;font-display:swap;font-weight:200 900;src:url(/assets/source-code-pro-cyrillic-wght-normal-CDFoT8Zy.woff2) format("woff2-variations");unicode-range:U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116}@font-face{font-family:Source Code Pro Variable;font-style:normal;font-display:swap;font-weight:200 900;src:url(data:font/woff2;base64,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) format("woff2-variations");unicode-range:U+1F00-1FFF}@font-face{font-family:Source Code Pro Variable;font-style:normal;font-display:swap;font-weight:200 900;src:url(/assets/source-code-pro-greek-wght-normal-CVFU5kBX.woff2) format("woff2-variations");unicode-range:U+0370-0377,U+037A-037F,U+0384-038A,U+038C,U+038E-03A1,U+03A3-03FF}@font-face{font-family:Source Code Pro Variable;font-style:normal;font-display:swap;font-weight:200 900;src:url(/assets/source-code-pro-vietnamese-wght-normal-DavMBZpE.woff2) format("woff2-variations");unicode-range:U+0102-0103,U+0110-0111,U+0128-0129,U+0168-0169,U+01A0-01A1,U+01AF-01B0,U+0300-0301,U+0303-0304,U+0308-0309,U+0323,U+0329,U+1EA0-1EF9,U+20AB}@font-face{font-family:Source Code Pro Variable;font-style:normal;font-display:swap;font-weight:200 900;src:url(/assets/source-code-pro-latin-ext-wght-normal-DyxEnqz4.woff2) format("woff2-variations");unicode-range:U+0100-02AF,U+0304,U+0308,U+0329,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}@font-face{font-family:Source Code Pro Variable;font-style:normal;font-display:swap;font-weight:200 900;src:url(/assets/source-code-pro-latin-wght-normal-C54hYqvT.woff2) format("woff2-variations");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+2074,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}@font-face{font-family:Dosis Variable;font-style:normal;font-display:swap;font-weight:200 800;src:url(/assets/dosis-vietnamese-wght-normal-D_hXjpTe.woff2) format("woff2-variations");unicode-range:U+0102-0103,U+0110-0111,U+0128-0129,U+0168-0169,U+01A0-01A1,U+01AF-01B0,U+0300-0301,U+0303-0304,U+0308-0309,U+0323,U+0329,U+1EA0-1EF9,U+20AB}@font-face{font-family:Dosis Variable;font-style:normal;font-display:swap;font-weight:200 800;src:url(/assets/dosis-latin-ext-wght-normal-CWlhEplo.woff2) format("woff2-variations");unicode-range:U+0100-02AF,U+0304,U+0308,U+0329,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}@font-face{font-family:Dosis Variable;font-style:normal;font-display:swap;font-weight:200 800;src:url(/assets/dosis-latin-wght-normal-CqPHOwwo.woff2) format("woff2-variations");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+2074,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}body,body:fullscreen::backdrop{margin:0;background-color:var(--background);transition-timing-function:cubic-bezier(.19,1,.22,1);transition:background-color .2s cubic-bezier(.19,1,.22,1)}button,body,input{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;font-family:Dosis Variable,Arial,Helvetica,sans-serif;line-height:1em;font-weight:600;font-size:15px;letter-spacing:1.2px}.polytronome{display:grid;grid-template-columns:1fr 1fr 1fr;color:var(--accent);-webkit-user-select:none;user-select:none;overflow:hidden;max-height:100vh;opacity:0;transition:opacity 1s cubic-bezier(.19,1,.22,1),color 1s cubic-bezier(.19,1,.22,1)}.polytronome .header{position:relative;display:flex;align-items:center;justify-content:space-between;width:100%}.polytronome .header .logo{display:flex;align-items:center;height:4em}.polytronome .header .logo svg{transform:scale(.8);margin-right:10px}.polytronome .header .logo h1{margin:0;font-size:2.2em;line-height:1em;color:var(--clicks-on)}.polytronome .header .logo p{font-size:1em;margin:0}.polytronome .header .tutorial{position:absolute;display:flex;align-items:center;justify-content:space-between;font-weight:600;height:8em;padding:0 2em;border-radius:20px;min-width:20em;background-color:var(--menu);z-index:3}.polytronome .header .tutorial .dialog{font-size:1.2em;line-height:1.2em;margin-right:2em;max-width:16em}.polytronome .header .tutorial .interactions{display:flex;flex-direction:column}.polytronome .clicks{width:100%;height:10em;display:flex;align-items:center;transition:opacity .12s}.polytronome .clicks .segment,.polytronome .clicks .layers{width:100%}.polytronome .clicks .click-row{display:flex;width:100%;max-height:2em;overflow:hidden;transition:max-height .8s cubic-bezier(.19,1,.22,1)}.polytronome .clicks .click-row.off{max-height:0px}.polytronome .clicks .click-row .click{margin:.3em;width:100%;height:1.2em;border-radius:.6em;background-color:var(--clicks-off);will-change:transform;transition:transform .15s cubic-bezier(.19,1,.22,1),margin .2s cubic-bezier(.19,1,.22,1),background-color .15s cubic-bezier(.19,1,.22,1),width .3s;transform:translate(0) scaleY(.6)}.polytronome .clicks .click-row .click.on{background-color:var(--clicks-on);transform:scale(1)}.polytronome .clicks .click-row .click.off{margin:.3em 0;width:0}.polytronome .clicks .segment .click-row{max-height:7em}.polytronome .clicks .segment .click-row .click{transform:scale(1);height:6em}.polytronome .clicks .block{width:80%;margin:auto}.polytronome .clicks .block .click-row{max-height:7em}.polytronome .clicks .block .click-row .click{transform:scale(1);height:6em;transition:none}.polytronome .layers-table{display:flex;justify-content:center;width:100%;margin:2em 0}.polytronome .layers-table .ls-row{display:flex;flex-direction:column;align-items:center;background-color:var(--layers);border:2px solid transparent;justify-content:space-evenly;border-radius:20px;padding:1em;margin:1em;transition:opacity 1s cubic-bezier(.19,1,.22,1),filter 1s cubic-bezier(.19,1,.22,1),background-color 1s cubic-bezier(.19,1,.22,1)}.polytronome .layers-table .ls-row button{margin:.2em;padding:.2em 1em;text-align:left;background-color:transparent}.polytronome .layers-table .ls-row button:hover{border-color:transparent;background-color:var(--buttons)}.polytronome .layers-table .ls-row button:active{border-color:transparent;background-color:var(--dim)}.polytronome .layers-table .ls-row>div{margin:.6em}.polytronome .layers-table .ls-row.selected{border:2px solid var(--accent)}.polytronome .layers-table .ls-row.off{opacity:.4}.polytronome .layers-table .ls-row.off .ls-note,.polytronome .layers-table .ls-row.off .ls-type,.polytronome .layers-table .ls-row.off .ls-effects,.polytronome .layers-table .ls-row.off .ls-volume{opacity:0;cursor:default;pointer-events:none;transition:opacity .4s cubic-bezier(.19,1,.22,1)}.polytronome .layers-table .notes-wrap{display:flex;align-items:center;position:relative}.polytronome .layers-table .notes-wrap pre.octave{position:absolute;margin:0;right:-.5em;bottom:-.3em;padding:.2em .5em;border-radius:.5em;background-color:transparent;transition:background-color .2s cubic-bezier(.19,1,.22,1)}.polytronome .layers-table .notes-wrap:hover pre.octave{background-color:var(--layers)}.polytronome .layers-table .notes-wrap .immovable_wheel{text-align:left}.polytronome .layers-table .ls-type{text-align:center;background-color:transparent;border-radius:1em}.polytronome .layers-table .ls-type svg{width:4em;height:4em;cursor:pointer}.polytronome .layers-table .ls-type svg path{stroke:var(--accent);transition:stroke 1s cubic-bezier(.19,1,.22,1)}.polytronome .layers-table .ls-effects{text-align:center}.polytronome .layers-table .ls-effects svg{width:1em;margin-right:.8em}.polytronome .layers-table .ls-effects button{min-width:7em;margin:.2em;padding:.2em 1em}.polytronome .layers-table .ls-volume{display:flex;align-items:center}.polytronome .layers-table .ls-volume .mute{width:1em;padding-right:.8em;cursor:pointer}.polytronome .layers-table .ls-volume .mute svg{width:1.2em;height:1.2em}.polytronome .layers-table .ls-volume .range-wrap{display:inline-block;width:5em;height:.8em;border-radius:5px;overflow:hidden;-webkit-user-select:none;user-select:none;cursor:pointer;background-color:var(--buttons);transition:opacity .3s cubic-bezier(.19,1,.22,1),background-color 1s cubic-bezier(.19,1,.22,1)}.polytronome .layers-table .ls-volume .range-wrap.muted{opacity:.1;filter:grayscale(1)}.polytronome .layers-table .ls-volume .range-wrap .inner-range{height:.8em;background-color:var(--accent);transition:background-color 1s cubic-bezier(.19,1,.22,1)}.polytronome .tempo{display:flex;align-items:center;justify-content:flex-end;z-index:2}.polytronome .tempo .immovable_wheel{margin-right:.5em}.polytronome .tempo .tap{width:120px;margin:0%}.polytronome .tempo .tempo-buttons{display:flex}.polytronome .menu{padding-top:10vh}.polytronome .menu>button{margin-left:2em;margin-bottom:2em}.polytronome .menu>button svg{margin-right:1em;vertical-align:bottom}.polytronome aside{display:flex;flex-direction:column;overflow:hidden;margin:0 6em 0 2em;width:25em;transition:width .6s cubic-bezier(.19,1,.22,1),opacity .6s cubic-bezier(.19,1,.22,1)}.polytronome aside hr{opacity:0;height:2em}.polytronome aside a{transition:opacity .6s cubic-bezier(.19,1,.22,1)}.polytronome aside a,.polytronome aside button{display:flex;align-items:center;justify-content:space-between;text-align:left;overflow:hidden;font-size:1.1em;padding-left:1em;padding-right:1em;text-decoration:none;background-color:transparent}.polytronome aside a .option-icon,.polytronome aside button .option-icon{width:2em;display:inline-block;text-align:center;line-height:1.8em}.polytronome aside a .option-text,.polytronome aside button .option-text{margin-left:.5em}.polytronome aside a p,.polytronome aside button p{margin:0}.polytronome aside button .optionState{border-radius:.5em;padding:.3em .6em;background-color:#0000000a}.polytronome aside button.on .optionState{background-color:var(--buttons)}.polytronome aside .theme-list{display:flex;flex-wrap:wrap;max-height:0;margin:0 2em;overflow:hidden;transition:width .3s,margin .3s,max-height .3s}.polytronome aside .theme-list span{width:auto;margin:.2em;font-size:1em;padding:.5em 1em;border-radius:15px;cursor:pointer;overflow:hidden;transition:filter .1s,border-radius .3s}.polytronome aside .theme-list span:hover{filter:brightness(.9)}.polytronome aside .theme-list.opened{max-height:7em;margin:2em}.polytronome aside.closed{width:5.2em}.polytronome aside.closed a{opacity:0;cursor:default;pointer-events:none}.polytronome aside.closed button.on{background-color:var(--buttons)}.polytronome.testBeats .menu,.polytronome.testBeats .tempo,.polytronome.testBeats .clicks,.polytronome.testBeats .bottom-buttons,.polytronome.testBeats .layers-table .ls-row>div:not(:first-child),.polytronome.explainWheel .menu,.polytronome.explainWheel .tempo,.polytronome.explainWheel .clicks,.polytronome.explainWheel .bottom-buttons,.polytronome.explainWheel .layers-table .ls-row>div:not(:first-child){opacity:.1;filter:grayscale(1);pointer-events:none}.polytronome.testLaunch .start{opacity:1}.polytronome.testLaunch .menu,.polytronome.testLaunch .tempo,.polytronome.testLaunch .clicks,.polytronome.testLaunch .layers-table,.polytronome.testLaunch .bottom-buttons .randomize{opacity:.1;filter:grayscale(1);pointer-events:none}.polytronome.showTempo .tempo{opacity:1}.polytronome.showTempo .menu,.polytronome.showTempo .clicks,.polytronome.showTempo .bottom-buttons,.polytronome.showTempo .layers-table{opacity:.1;filter:grayscale(1);pointer-events:none}.polytronome.clickMenu aside,.polytronome.clickMenu .tempo,.polytronome.clickMenu .clicks,.polytronome.clickMenu .bottom-buttons,.polytronome.clickMenu .layers-table{opacity:.1;filter:grayscale(1);pointer-events:none}.polytronome.showBeats aside,.polytronome.showBeats .tempo,.polytronome.showBeats .logo,.polytronome.showBeats .clicks,.polytronome.showBeats .bottom-buttons,.polytronome.showBeats .layers-table .ls-row>div:not(.ls-beats),.polytronome.showBeats .layers-table .ls-row>button:not(.ls-beats){opacity:.1;filter:grayscale(1);pointer-events:none}.polytronome.showNotes aside,.polytronome.showNotes .tempo,.polytronome.showNotes .logo,.polytronome.showNotes .clicks,.polytronome.showNotes .bottom-buttons,.polytronome.showNotes .layers-table .ls-row>div:not(.ls-note),.polytronome.showNotes .layers-table .ls-row>button:not(.ls-note){opacity:.1;filter:grayscale(1);pointer-events:none}.polytronome.showWaveType aside,.polytronome.showWaveType .tempo,.polytronome.showWaveType .logo,.polytronome.showWaveType .clicks,.polytronome.showWaveType .bottom-buttons,.polytronome.showWaveType .layers-table .ls-row>div:not(.ls-type),.polytronome.showWaveType .layers-table .ls-row>button:not(.ls-type){opacity:.1;filter:grayscale(1);pointer-events:none}.polytronome.beatsAgain aside,.polytronome.beatsAgain .tempo,.polytronome.beatsAgain .logo,.polytronome.beatsAgain .clicks,.polytronome.beatsAgain .bottom-buttons,.polytronome.beatsAgain .layers-table .ls-row>div:not(.ls-beats),.polytronome.beatsAgain .layers-table .ls-row>button:not(.ls-beats){opacity:.1;filter:grayscale(1);pointer-events:none}.polytronome.showDuration aside,.polytronome.showDuration .tempo,.polytronome.showDuration .logo,.polytronome.showDuration .clicks,.polytronome.showDuration .bottom-buttons,.polytronome.showDuration .layers-table .ls-row>div:not(.ls-effects),.polytronome.showDuration .layers-table .ls-row>button:not(.ls-effects){opacity:.1;filter:grayscale(1);pointer-events:none}.polytronome.showRelease aside,.polytronome.showRelease .tempo,.polytronome.showRelease .logo,.polytronome.showRelease .clicks,.polytronome.showRelease .bottom-buttons,.polytronome.showRelease .layers-table .ls-row>div:not(.ls-effects),.polytronome.showRelease .layers-table .ls-row>button:not(.ls-effects){opacity:.1;filter:grayscale(1);pointer-events:none}.polytronome.showVolume aside,.polytronome.showVolume .tempo,.polytronome.showVolume .logo,.polytronome.showVolume .clicks,.polytronome.showVolume .bottom-buttons,.polytronome.showVolume .layers-table .ls-row>div:not(.ls-volume),.polytronome.showVolume .layers-table .ls-row>button:not(.ls-volume){opacity:.1;filter:grayscale(1);pointer-events:none}.polytronome.showDuration .ls-effects button:last-child,.polytronome.showRelease .ls-effects button:first-child{opacity:.1;filter:grayscale(1)}.polytronome .spacer{min-width:200px}.polytronome main{display:grid;grid-template-areas:"header tempo" "clicks clicks" "layers layers" "buttons buttons";flex-direction:column;align-items:center;margin:0 auto;padding-top:10vh}.polytronome .header{grid-area:header}.polytronome .tempo{grid-area:tempo}.polytronome .clicks{grid-area:clicks}.polytronome .layers-table{grid-area:layers}.polytronome .bottom-buttons{grid-area:buttons}.polytronome a,.polytronome button{color:var(--accent);background:var(--buttons);width:auto;margin:.2em;padding:.5em 2em;border:2px solid transparent;border-radius:2em;font-size:1em;font-weight:600;white-space:pre;cursor:pointer;transition:background-color .2s cubic-bezier(.19,1,.22,1),color .3s cubic-bezier(.19,1,.22,1),border .2s cubic-bezier(.19,1,.22,1)}.polytronome a svg,.polytronome button svg{width:1em;height:1em;vertical-align:text-bottom}.polytronome a:active,.polytronome button:active{background-color:var(--clicks-off)}.polytronome a:hover,.polytronome button:hover{border:2px solid var(--clicks-off)}.polytronome .immovable_wheel{position:relative;overflow:hidden;padding:.1em .2em .1em .8em;border-radius:.3em;transition:opacity .5s cubic-bezier(.19,1,.22,1),background-color .5s cubic-bezier(.19,1,.22,1);font-size:3em;line-height:1.2em;height:1em}.polytronome .immovable_wheel:hover{background-color:var(--buttons)}.polytronome .immovable_wheel p{margin:0;font-weight:500;font-family:Source Code Pro Variable,Arial,Helvetica,sans-serif}.polytronome .immovable_wheel .arrows{position:absolute;display:flex;flex-direction:column;justify-content:center;margin-left:-.6em;height:1em;z-index:2}.polytronome .immovable_wheel .arrows div{display:flex;width:.35em;text-align:center;cursor:pointer;opacity:.2;transition:opacity .5s cubic-bezier(.19,1,.22,1)}.polytronome .immovable_wheel .arrows div:first-child{transform:rotate(180deg)}.polytronome .immovable_wheel .arrows div:hover{opacity:.5}.polytronome .immovable_wheel .arrows div:focus,.polytronome .immovable_wheel .arrows div:active{opacity:1}.polytronome .immovable_wheel .arrows div svg path{transition:stroke 1s cubic-bezier(.19,1,.22,1)}.polytronome .immovable_wheel .wheel{cursor:grab;touch-action:none;text-align:center;margin-top:-.1em}.polytronome .bottom-buttons,.polytronome .bottom-buttons button{display:flex;justify-content:center;align-items:center}.polytronome .bottom-buttons svg{margin-right:1em}.polytronome .bottom-buttons .start{width:22em}.polytronome .keylog{position:fixed;display:flex;flex-direction:column;justify-content:center;align-items:flex-end;bottom:2em;right:2em;text-align:right;z-index:7}.polytronome .keylog code{background-color:var(--dim);border-radius:20px;padding:2px 10px;margin-left:20px}.polytronome .keylog small{margin:5px}.polytronome.easy main{padding-top:15vh}.polytronome.easy .layers-table{flex-direction:row;margin:4em 0;width:auto}.polytronome.easy .ls-row{background-color:transparent;padding:0}.polytronome.easy .ls-row .immovable_wheel{width:1.6em}.polytronome.performance{transition:opacity 1s}.polytronome.performance *{transition:none!important}@media only screen and (min-width: 1500px){.polytronome.easy .clicks{min-width:1100px}}@media only screen and (max-width: 1600px){.polytronome .spacer,.polytronome .menu{min-width:auto}}@media only screen and (min-height: 900px) and (max-width: 1300px){.polytronome .layers-table{width:auto;flex-direction:column}.polytronome .layers-table .ls-row{flex-direction:row;margin:.5em;padding:.5em 1em}.polytronome .menu,.polytronome main{padding-top:5vh}.polytronome.easy .menu{padding-top:10vh}.polytronome.easy .layers-table .ls-row{padding:0}}@media only screen and (max-height: 900px) and (max-width: 1440px){body{font-size:13px}}@media only screen and (max-height: 750px) and (max-width: 1200px){body{font-size:12px}}@media only screen and (max-width: 1000px) and (max-height: 780px){body{font-size:11px}}@media only screen and (max-width: 500px){body{font-size:11px}.polytronome main{padding-top:5vh;width:100vw}.polytronome main .header{margin-bottom:0}.polytronome main .header .logo{width:100%;justify-content:center;transform:translate(-10px)}.polytronome main .header .logo svg{transform:scale(.6)}.polytronome main .clicks{width:90vw;margin:2em}.polytronome .bottom-buttons{flex-wrap:wrap}.polytronome .bottom-buttons .start{width:16em}.polytronome .layers-table{font-size:11px}.polytronome .layers-table .ls-row{padding:0 1.5em;margin:.5em 1em}.polytronome .layers-table .ls-row>div{margin:.5em 0}.polytronome .layers-table .ls-row .arrows{margin-left:-.5em}.polytronome .layers-table .ls-row .ls-type{padding:0 .5em}.polytronome .layers-table .ls-row .ls-type svg{width:3.2em;height:3.2em;padding:0}.polytronome .layers-table .ls-row .ls-effects{text-align:left;flex-direction:column;max-width:7em}.polytronome .layers-table .ls-row .ls-volume{flex-direction:column}.polytronome .layers-table .ls-row .ls-volume .mute{padding:0;margin-bottom:1em}.polytronome .tempo{display:flex;align-items:center;justify-content:center;margin-bottom:80px;width:100%}.polytronome .tempo .tap{margin-left:10px}.polytronome.easy .header{margin-bottom:0}.polytronome.easy .layers-table{margin:6em 0;justify-content:center}.polytronome.easy .layers-table .ls-row{margin:0;padding:0}.polytronome.easy .layers-table .ls-row .ls-beats{margin:0 .5em}.polytronome.easy .layers-table .ls-row .ls-beats .immovable_wheel{padding-left:.5em;padding-right:0}.polytronome.easy .layers-table .ls-row .ls-beats .immovable_wheel .arrows{margin-left:-.3em}}@media only screen and (max-width: 400px){.polytronome .layers-table{font-size:10px}}.polytronome.mobile{overflow-y:auto}.polytronome.mobile main{padding-top:10vh;grid-template-areas:"header" "clicks" "buttons" "layers" "tempo"}.polytronome.mobile main .ls-row{background-color:transparent}.polytronome.mobile.easy main{padding-top:10vh}.polytronome.mobile.easy main .layers-table{flex-direction:row}.polytronome.mobile.easy main .layers-table .ls-beats{margin:0}.polytronome.mobile.easy .header .tutorial{top:-2em}.polytronome.mobile .layers-table{flex-direction:column}.polytronome.mobile .layers-table .ls-row{flex-direction:row}.polytronome.mobile .header .tutorial{top:0;position:absolute;height:auto;width:50%;padding:2em;left:calc(25% - 2em);flex-direction:column;z-index:6}.polytronome.mobile .header .tutorial .dialog{max-width:90%;margin:0}.polytronome.mobile .header .tutorial .interactions{flex-direction:row}.polytronome.mobile .menu{position:fixed;top:0;left:0;margin:0;padding-top:0;font-size:13px;z-index:5}.polytronome.mobile .menu>button{position:fixed;margin:2em;padding:.6em 1.6em;z-index:6}.polytronome.mobile .menu>button svg{margin:0}.polytronome.mobile .menu aside{position:fixed;display:none;z-index:5;margin:0;top:0;left:0;padding:8vh 0}.polytronome.mobile .menu aside .theme-list.opened{max-height:10em}.polytronome.mobile .menu aside.extended{display:flex;width:calc(100vw - 4em);padding:8em 2em 0;height:100vh;background-color:var(--background);overflow-y:auto;opacity:1}