:root{--blue: 61, 110, 245;--light-blue: 52, 215, 244;--green: 63, 233, 58;--yellow: 231, 212, 39;--red: 245, 61, 61;--white: 255, 255, 255;--black: 0, 0, 0;--dark: 25, 25, 25;--light: 2020, 220, 220;--gray: 100, 100, 100;--primary: var(--blue);--secondary: var(--gray);--info: var(--light-blue);--success: var(--green);--warning: var(--yellow);--danger: var(--red);--background: 30, 32, 35;--background-1: 50, 50, 50;--background-2: 24, 25, 28;--background-3: 18, 18, 20;--background-4: 12, 13, 16;--background-5: 10, 11, 14;--background-opacity: .5;--header: var(--background-3);--text: var(--white);--text-contrast: var(--black);--placeholder: 117, 117, 117;--big-radius: 1em;--medium-radius: .75em;--small-radius: .5em;font-size:16px;font-weight:400;color-scheme:light dark;color:rgba(var(--text),1);background-color:rgba(var(--background),1);font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;-webkit-text-size-adjust:100%}@media only screen and (max-width: 767px){:root{font-size:14px}}*{box-sizing:border-box;outline:none;font-family:Poppins,sans-serif}body{margin:0;min-width:320px;min-height:100vh;display:flex;flex-direction:row-reverse}body:not([data-connected=yes]) #header,body:not([data-connected=yes]) #board{display:none}body:not([data-connected=no]) #not-found{display:none}body.mobile #board.immersive #sounds .sound{width:calc(100% / var(--sounds-columns))!important;height:calc(100% / var(--sounds-breakpoint))!important}#header{z-index:50}#header #header-nav{height:100vh;width:4rem;color:rgba(var(--text),1);display:flex;align-items:center;flex-direction:column;background:rgba(var(--header),1)}#header #header-nav .header-group{width:100%;display:flex;flex-direction:column;justify-content:space-between;gap:.75em;margin:.5em 0}#header #header-nav .header-group.hidden{display:none}#header #header-nav>.header-group{height:100%;padding:0 .6em}#header #header-nav button.header-item{cursor:pointer;-webkit-user-select:none;user-select:none}#header #header-nav button.header-item:hover{background-color:rgba(var(--background-1),1)}#header #header-nav button.header-item.active{background-color:rgba(var(--primary),1)}#header #header-nav .header-item{width:100%;position:relative;display:flex;justify-content:center;padding:.4em;align-items:center;background:none;border:none;border-radius:.75em;transition:background-color .25s}#header #header-nav .header-item:focus-visible{outline:2px solid rgb(var(--text),1)}#header #header-nav .header-menu{position:relative;height:4rem;min-height:4rem;padding:0;border-radius:0}#header #header-nav .header-menu:after{content:"";position:absolute;left:.5rem;bottom:0;height:1px;width:calc(100% - 1rem);height:100%;margin:auto;border-bottom:1px solid rgba(var(--background),1);pointer-events:none}#header #header-nav .brand-container{display:none;width:calc(100% - 4rem);height:4rem;padding:.4em}#header #header-nav .brand-container .brand{width:100%;height:100%;padding:.2em;border-radius:var(--big-radius);transition:transform .2s}#header #header-nav .brand-container .brand>svg{color:rgb(var(--text),1);width:100%;height:100%}#header #header-nav .brand-container .brand:focus-visible{outline:2px solid rgb(var(--text),1)}#header #header-nav.extend{align-items:flex-start;width:15em}#header #header-nav.extend .brand-container{display:flex}#header #header-nav.extend .hamburger .hamburger-inner{background-color:rgba(var(--text));transition-delay:.12s;transition-timing-function:cubic-bezier(.215,.61,.355,1);transform:rotate(45deg)}#header #header-nav.extend .hamburger .hamburger-inner:before{top:0;opacity:0;background-color:rgba(var(--text));transition:top 75ms ease,opacity 75ms ease .12s}#header #header-nav.extend .hamburger .hamburger-inner:after{bottom:0;background-color:rgba(var(--text));transition:bottom 75ms ease,transform 75ms cubic-bezier(.215,.61,.355,1) .12s;transform:rotate(-90deg)}#header #header-nav.extend>.header-item{justify-content:space-between}#header #header-nav.extend .header-group{gap:.5em}#header #header-nav.extend .header-group .header-item{justify-content:flex-start;padding:.2em .5em}#header #header-nav.extend .header-group .header-item .tooltip{position:relative;visibility:visible;right:auto;background:none}#header #header-nav.extend .header-group .header-item .tooltip:after{content:none}#board{width:100%;height:100vh;margin:0 auto;text-align:center}#board #sounds{--sound-font-size: 10em;overflow:hidden;display:grid;grid-template-columns:repeat(var(--sounds-columns),1fr);grid-template-rows:repeat(var(--sounds-rows),calc(100% / var(--sounds-rows)));height:100%}#board #sounds .sound{--card-text-light: var(--text);--card-text-dark: var(--background-1);--card-color: var(--card-text-light);flex-grow:1;-webkit-user-select:none;user-select:none;font-size:calc(var(--sound-font-size) / (2 * var(--sounds-rows)));font-weight:700;overflow:hidden;cursor:pointer}#board #sounds .sound.hidden{display:none}#board #sounds .sound .card{min-width:auto;color:rgba(var(--card-color),1);background-color:var(--card-background);border:1px solid rgba(var(--card-color),.05);box-shadow:none;border-radius:0;animation:rainbow calc(var(--easter-egg) * 2s) linear infinite}@keyframes rainbow{0%,to{background-color:red}10%{background-color:#ff9a00}20%{background-color:#d0de21}30%{background-color:#4fdc4a}40%{background-color:#3fdad8}50%{background-color:#2fc9e2}60%{background-color:#1c7fee}70%{background-color:#5f15f2}80%{background-color:#ba0cf8}90%{background-color:#fb07d9}}#board #sounds .sound .card .card-header,#board #sounds .sound .card .card-body,#board #sounds .sound .card .card-footer{padding:.5rem}#board #sounds .sound .card .card-header{justify-content:space-between;gap:0}#board #sounds .sound .card .card-header .sound-actions{width:100%;display:flex;justify-content:space-between;color:rgba(var(--card-color),1)}#board #sounds .sound .card .card-header .sound-actions .button{margin:0;padding:.25em;background-color:transparent}#board #sounds .sound .card .card-header .sound-actions .button:focus-visible{outline:2px solid rgb(var(--card-color),1)}#board #sounds .sound .card .card-header .sound-actions .button svg{height:1.75em;width:1.75em}#board #sounds .sound .card .card-body>p{height:fit-content;width:100%;display:flex;flex-direction:column;margin:0;overflow-wrap:break-word;overflow:hidden;text-transform:uppercase}#board #sounds .sound .card .card-body>p>small{font-size:.7em;opacity:.4}#board #sounds .sound .card .card-footer{justify-content:space-between;font-weight:400;font-size:1rem}#board.immersive{padding:0}#board.immersive #sounds{display:flex;flex-wrap:wrap;-webkit-user-select:none;user-select:none}#board.immersive #sounds .sound{width:calc(100% / var(--sounds-breakpoint));font-size:calc(var(--sound-font-size) / min(var(--sounds-count),7))}#board.immersive #sounds .sound .card>:not(.card-body){display:none}#board.immersive #sounds .sound .card .card-body>p>small{font-size:.5em}#not-found{position:fixed;top:0;left:0;height:100%;width:100%;display:flex;justify-content:center;align-items:center}#not-found .title{font-size:3em;text-align:center;text-transform:uppercase}#not-found .background{height:100vh;width:100%;position:fixed;display:flex;justify-content:center;align-items:center;padding:2em}#not-found .background svg{opacity:.05;width:40rem;height:40rem;overflow:visible}@keyframes spinLeft{0%{transform:rotate(0)}50%{transform:rotate(3deg)}to{transform:rotate(0)}}@keyframes spinRight{0%{transform:rotate(0)}50%{transform:rotate(-3deg)}to{transform:rotate(0)}}#not-found .background svg .left{transform-origin:bottom center;animation:spinLeft 4s ease-in-out infinite 1.5s}#not-found .background svg .right{transform-origin:bottom center;animation:spinRight 4s ease-in-out infinite}.hamburger-container{position:absolute;right:0;top:0;height:4rem;width:4rem;display:flex;justify-content:center;align-items:center}.hamburger-container .hamburger{padding:.4em;margin:0;border:0;text-transform:none;background-color:transparent;cursor:pointer;transition-timing-function:linear;transition-duration:.15s;transition-property:opacity,filter;border-radius:var(--medium-radius)}.hamburger-container .hamburger:focus-visible{outline:2px solid rgb(var(--text),1)}.hamburger-container .hamburger .hamburger-box{position:relative;width:2em;height:2em}.hamburger-container .hamburger .hamburger-box .hamburger-inner{top:50%;display:block;margin-top:-2px;transition-timing-function:cubic-bezier(.55,.055,.675,.19);transition-duration:75ms}.hamburger-container .hamburger .hamburger-box .hamburger-inner,.hamburger-container .hamburger .hamburger-box .hamburger-inner:before,.hamburger-container .hamburger .hamburger-box .hamburger-inner:after{position:absolute;width:100%;height:.25em;border-radius:4px;background-color:rgba(var(--text))}.hamburger-container .hamburger .hamburger-box .hamburger-inner:before{content:"";display:block;top:.6em;transition:top 75ms ease .12s,opacity 75ms ease}.hamburger-container .hamburger .hamburger-box .hamburger-inner:after{content:"";display:block;bottom:.6em;transition:bottom 75ms ease .12s,transform 75ms cubic-bezier(.55,.055,.675,.19)}.modals-container .modal{background:rgba(0,0,0,var(--background-opacity));position:fixed;left:0;top:0;z-index:100;display:-webkit-box;display:-ms-flexbox;display:flex;align-items:center;justify-content:center;width:100%;height:100%;max-height:100vh;overflow-y:auto;overflow-x:hidden;padding-top:5em;padding-bottom:5em;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px)}.modals-container .modal:not(.show){display:none}.modals-container .modal .modal-content{min-width:25em;max-width:50em;margin:1em}@keyframes rebound{0%{transform:scale(.9);opacity:0}to{transform:scale(1);opacity:1}}.modals-container .modal.modal-opening>*{animation:rebound var(--modal-transition-duration) forwards}.modals-container .modal.modal-closing>*{animation:rebound var(--modal-transition-duration) reverse forwards}.modals-container .modal[data-popup]{background:none;-webkit-backdrop-filter:none;backdrop-filter:none;justify-content:end;align-items:start;padding:0;pointer-events:none}.modals-container .modal[data-popup] .modal-content{pointer-events:all}.modals-container .modal[data-popup] .modal-content .input{box-shadow:.2em .2em 1em #000}.card{width:100%;height:100%;position:relative;display:flex;flex-direction:column;justify-content:space-between;margin:auto;border-radius:var(--big-radius);background:rgba(var(--background-2),1);color:rgba(var(--text),1);box-shadow:.2em .2em 1em #000}.card .card-header{display:flex;align-items:center;gap:.5em;vertical-align:middle;padding:1em 1em 0}.card .card-header>svg{margin:0 .5em}.card .card-header>h1,.card .card-header>h2,.card .card-header>h3,.card .card-header>h4,.card .card-header>h5,.card .card-header>h6{font-weight:400;margin:0}.card .card-body{height:100%;display:flex;flex-direction:column;justify-content:center;padding:.75em 1em}.card .card-footer{padding:0 1em 1em;display:flex;justify-content:flex-end}.form-group{width:100%;position:relative;display:flex;flex-direction:column;padding:.5em 0}.form-group.inline{flex-direction:row}.form-group.invalid .input{border-color:rgba(var(--danger),1)}.form-group>.input{width:100%}.form-group>.input-invalid{font-size:.8em;padding-left:1em;margin-top:.2em;color:rgba(var(--danger),1)}.form-group>.max-length{position:absolute;right:.4em;bottom:.8em;opacity:.5;font-weight:400;font-size:.8em}.input{height:3em;display:flex;gap:.5em;align-items:center;padding:.5em .75em;background:rgba(var(--background-3),1);color:rgba(var(--text),1);border-radius:var(--medium-radius);border:2px solid transparent;font-size:1em;white-space:nowrap;transition:background-color .25s ease}.input:disabled{opacity:.6}.input::placeholder{transition:background-color .15s ease}.input:focus-visible{background-color:rgba(var(--background-4),1)}.input:focus-visible::placeholder{opacity:0}.input-file{cursor:pointer}.input-file input[type=file]{position:absolute;height:0;opacity:0;width:0}.input-file.dragover .input,.input-file :focus-visible~.input{background-color:rgba(var(--background-4),1)}.input-file.has-file .input-placeholder{display:none}.input-file:not(.has-file) .input .input-placeholder,.input-file:not(.has-file) .input svg{color:rgba(var(--placeholder),1)}.input-file .input{pointer-events:none}.input-file .input>.input-placeholder{font-size:1em}.input-file .input>svg{width:1.5em;height:1.5em}.input-file .input .input-label{overflow:hidden}.input-switch{position:relative;display:inline-block;width:3em;height:1.5em;margin:0 .5em}.input-switch:focus-visible input:not(:checked)+.input-switch-slider{outline:2px solid rgb(var(--text),1)}.input-switch:focus-visible input:checked+.input-switch-slider{outline:2px solid rgb(var(--text),1)}.input-switch input{display:none}.input-switch input:not(:checked)+.input-switch-slider{background-color:rgba(var(--background-3),1)}.input-switch input:checked+.input-switch-slider:before{transform:translate(1.4em)}.input-switch .input-switch-slider{position:absolute;cursor:pointer;top:0;left:0;right:0;bottom:0;background-color:rgba(var(--primary),1);transition:all .3s ease 0s,outline 0s;border-radius:var(--medium-radius)}.input-switch .input-switch-slider:before{position:absolute;content:"";height:1em;width:1em;left:.25em;bottom:.25em;border-radius:50%;background-color:#fff;transition:all .3s,outline 0s}.input-range .input{border:none}.input-range input[type=range]{--slider-height: .8em;--thumb-size: 1.5em;height:var(--slider-height);width:100%;padding:0;-webkit-appearance:none;-moz-appearance:none;appearance:none}.input-range input[type=range]::-webkit-slider-runnable-track{width:100%;height:var(--slider-height);cursor:pointer}.input-range input[type=range]::-webkit-slider-thumb{height:var(--thumb-size);width:var(--thumb-size);margin-top:calc((var(--thumb-size) - var(--slider-height)) * -.5);border-radius:var(--thumb-size);background-color:rgb(var(--text),1);-webkit-appearance:none;-moz-appearance:none;appearance:none;cursor:pointer}.input-range input[type=range]::-moz-range-track{width:100%;height:var(--slider-height);cursor:pointer}.input-range input[type=range]::-moz-range-thumb{height:var(--thumb-size);width:var(--thumb-size);margin-top:calc((var(--thumb-size) - var(--slider-height)) * -.5);border-radius:var(--thumb-size);background-color:rgb(var(--text),1);-webkit-appearance:none;-moz-appearance:none;appearance:none;cursor:pointer}.input-range input[type=range]::-ms-track{width:100%;height:var(--slider-height);cursor:pointer}.input-range input[type=range]::-ms-thumb{height:var(--thumb-size);width:var(--thumb-size);margin-top:calc((var(--thumb-size) - var(--slider-height)) * -.5);border-radius:var(--thumb-size);background-color:rgb(var(--text),1);-webkit-appearance:none;-moz-appearance:none;appearance:none;cursor:pointer}.input-color{border-radius:50%}.input-color,.input-color input[type=color]{width:2.5rem;height:2.5rem}.input-color input[type=color]{visibility:hidden}button{font-size:1rem;color:inherit}button:disabled{pointer-events:none;opacity:.25}.button{display:flex;margin:0 .4em;padding:.4em 1em;border-radius:var(--medium-radius);border:none;background-color:rgba(var(--background-1),1);cursor:pointer;-webkit-user-select:none;user-select:none;transition:box-shadow .2s}.button:hover{box-shadow:inset 0 0 100vw 100vw #ffffff0d}.button:active{box-shadow:inset 0 0 100vw 100vw #ffffff1f}.button:focus-visible{outline:2px solid rgb(var(--text),1)}.button:disabled{pointer-events:none;opacity:.35;color:inherit}.button.primary:hover,.button.secondary:hover,.button.info:hover,.button.success:hover,.button.warning:hover,.button.danger:hover{box-shadow:inset 0 0 100vw 100vw #0003}.button.primary:active,.button.secondary:active,.button.info:active,.button.success:active,.button.warning:active,.button.danger:active{box-shadow:inset 0 0 100vw 100vw #0006}.button.primary{background-color:rgba(var(--primary),1)}.button.secondary{background-color:rgba(var(--secondary),1)}.button.info{color:rgb(var(--text-contrast),1);background-color:rgba(var(--info),1)}.button.success{color:rgb(var(--text-contrast),1);background-color:rgba(var(--success),1)}.button.warning{color:rgb(var(--text-contrast),1);background-color:rgba(var(--warning),1)}.button.danger{background-color:rgba(var(--danger),1)}.button.icon{background-color:rgba(var(--background-3),1);padding:.5em;box-shadow:.2em .2em 1em #000}.link{margin:0 .4em;background:none;border:none;cursor:pointer}.link:hover,.link:focus-visible{text-decoration:underline}:hover>.tooltip,:focus-visible>.tooltip{visibility:visible}.tooltip{--tooltip: var(--background-3);visibility:hidden;z-index:100;position:absolute;background-color:rgba(var(--tooltip),1);border-radius:.5em;padding:.3em .6em;white-space:nowrap}.tooltip.white{--tooltip: var(--white);color:rgba(var(--text-contrast),1)}.tooltip:after{content:"";position:absolute}.tooltip.left{right:4.5em}.tooltip.left:after{top:50%;left:100%;margin-top:-6px;border:6px solid transparent;border-left-color:rgba(var(--tooltip),1)}.tooltip.top{top:-2.5em}.tooltip.top:after{top:100%;left:50%;margin-left:-6px;border:6px solid transparent;border-top-color:rgba(var(--tooltip),1)}.badge{width:1.75em;height:1.75em;padding:.25em;display:flex;justify-content:center;align-items:center;-webkit-user-select:none;user-select:none;border-radius:calc(var(--big-radius) / 1.75);background-color:rgba(var(--primary),1)}svg{width:2em;height:2em}.tabs{position:relative}.tabs .tab-list{position:absolute;width:100%;top:-2.5em;height:2.6em;display:flex;justify-content:center;list-style:none;padding:0;margin:0;z-index:-1}.tabs .tab-list>li{padding:.5em .75em;border-top-left-radius:var(--medium-radius);border-top-right-radius:var(--medium-radius);background-color:rgba(var(--background-3),1);cursor:pointer}.tabs .tab-list>li.active{background-color:rgba(var(--background-2),1)}.tabs .tab-list>li:focus-visible{outline:2px solid rgb(var(--text),1)}.tabs .tab-content>:not(.active){display:none}.filter-sounds-container{display:flex;justify-content:center;align-items:center;gap:.5em}#theme-palettes{display:flex;flex-direction:column;gap:1em}#theme-palettes .palette{display:flex;align-items:center;justify-content:space-between;gap:2em}#theme-palettes .palette .palette-name{display:flex;gap:.5em;cursor:pointer}#theme-palettes .palette .palette-name>input{position:relative;padding:0;margin:auto;width:1.5em;height:1.5em;border-radius:50%;background-color:rgba(var(--background-2),1);border:2px solid rgba(var(--primary),1);cursor:pointer;-webkit-appearance:none;-moz-appearance:none;appearance:none}#theme-palettes .palette .palette-name>input:checked{background-color:rgba(var(--primary),1)}#theme-palettes .palette .palette-name>input:focus-visible{outline:2px solid rgb(var(--text),1)}#theme-palettes .palette .colors{display:flex;flex-wrap:wrap;justify-content:flex-end;gap:.5em}#theme-palettes .palette .colors .color{width:2em;height:2em;padding:.25em;border-radius:50%;border:2px solid rgb(var(--text),1)}