@import"https://fonts.googleapis.com/css2?family=Roboto:wght@400;500;700&display=swap";/*! normalize.css v8.0.1 | MIT License | github.com/necolas/normalize.css */html{line-height:1.15;-webkit-text-size-adjust:100%}body{margin:0}main{display:block}h1{font-size:2em;margin:.67em 0}hr{box-sizing:content-box;height:0;overflow:visible}pre{font-family:monospace,monospace;font-size:1em}a{background-color:transparent}abbr[title]{border-bottom:none;text-decoration:underline;text-decoration:underline dotted}b,strong{font-weight:bolder}code,kbd,samp{font-family:monospace,monospace;font-size:1em}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sub{bottom:-.25em}sup{top:-.5em}img{border-style:none}button,input,optgroup,select,textarea{font-family:inherit;font-size:100%;line-height:1.15;margin:0}button,input{overflow:visible}button,select{text-transform:none}button,[type=button],[type=reset],[type=submit]{-webkit-appearance:button}button::-moz-focus-inner,[type=button]::-moz-focus-inner,[type=reset]::-moz-focus-inner,[type=submit]::-moz-focus-inner{border-style:none;padding:0}button:-moz-focusring,[type=button]:-moz-focusring,[type=reset]:-moz-focusring,[type=submit]:-moz-focusring{outline:1px dotted ButtonText}fieldset{padding:.35em .75em .625em}legend{box-sizing:border-box;color:inherit;display:table;max-width:100%;padding:0;white-space:normal}progress{vertical-align:baseline}textarea{overflow:auto}[type=checkbox],[type=radio]{box-sizing:border-box;padding:0}[type=number]::-webkit-inner-spin-button,[type=number]::-webkit-outer-spin-button{height:auto}[type=search]{-webkit-appearance:textfield;outline-offset:-2px}[type=search]::-webkit-search-decoration{-webkit-appearance:none}::-webkit-file-upload-button{-webkit-appearance:button;font:inherit}details{display:block}summary{display:list-item}template{display:none}[hidden]{display:none}body{--color: black;--bg: #eceff1;--secondary-color: #e1e9f3;--tertiary-color: #cfd2e2;--true-highlight: #00ff37;--link: #006992;--link-hover: #005f85;--selection: #138ebe5b;--warning: #fa0;--dark-warning: #730;--error: #f32;--dark-error: #700;--success: #0a0;--dark-success: #070;background-color:var(--bg);font-family:Roboto,sans-serif;margin:.8em;padding:0;color:var(--color);color-scheme:light dark;height:100%}@media (prefers-color-scheme: dark){body{--color: white;--bg: #0f1522;--secondary-color: #2c313a;--tertiary-color: #424a58;--link: #00b7ff;--link-hover: #009bd8}}::selection{background-color:var(--selection);color:#fff;text-shadow:#000a 0 0 .1em}:focus-visible{outline:2px solid var(--link);outline-offset:2px}a,.link{color:var(--link);text-underline-offset:.1em;text-decoration:underline;background:none;font-size:inherit;display:inline;border:none;padding:0;border-radius:0;text-align:start}a:hover,.link:hover{color:var(--link-hover);background:none}.no-line{text-decoration:none!important}.icon-link{display:inline-flex;gap:.3rem;align-items:center}.icon-link.hover-effect{transition:gap .2s ease}.icon-link.hover-effect:hover{gap:.5rem}button{background:var(--secondary-color);color:var(--color);border:2px solid var(--tertiary-color);border-radius:.4em;padding:.5em .8em;cursor:pointer;font:inherit}button:hover{background:var(--tertiary-color)}details{margin:0 0 .5em;padding:1em;border:1px solid var(--tertiary-color);border-radius:.5em}details[open]{margin-top:0}details[open] summary{margin:0 calc(-1em + 2px);padding:0 calc(1em - 2px);margin-bottom:1em;padding-bottom:calc(1em - 3px);border-bottom:1px solid var(--tertiary-color)}details summary{cursor:pointer;font-weight:700;font-size:1.2em;padding:0;-webkit-user-select:none;user-select:none}details summary>*{display:inline}details>*:last-child{margin-bottom:0}*{box-sizing:border-box}p{margin:.5em 0}.form-group{margin:.5em 0;display:flex;flex-direction:row;gap:.5em;align-items:center;font-weight:700}input,select,textarea,option{border:2px solid var(--tertiary-color);background-color:var(--secondary-color);border-radius:.4em;padding:.5em .8em;font:inherit}input[type=range]{padding-left:0;padding-right:0}:disabled{filter:brightness(.8);cursor:not-allowed}:disabled:hover{filter:sepia(1) hue-rotate(-70deg) brightness(.8) contrast(1.5)}body{--highlight: color-mix(in lab, var(--true-highlight) 80%, var(--tertiary-color) 20%)}#soundboard{display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:.8em}#soundboard:not(.loaded){display:flex;justify-content:center;align-items:center;height:100%}#soundboard:not(.loaded) #soundboard-loader{font-size:2em;color:var(--tertiary-color);text-align:center;display:flex;flex-direction:column;align-items:center}#soundboard:not(.loaded)>:not(#soundboard-loader){display:none}#soundboard.loaded{display:grid}#soundboard.loaded #soundboard-loader{display:none}#soundboard button{background-color:var(--secondary-color);color:var(--color);border:.2em solid var(--tertiary-color);border-radius:.4em;padding:.8em;--shadow-size: .5rem;box-shadow:0 var(--shadow-size) 0 var(--tertiary-color);cursor:pointer;transition:background-color .2s,color .2s,box-shadow .2s,transform .2s;transform:translateY(calc(var(--shadow-size)*-1));font-weight:600}#soundboard button.playing .sound-icon{display:inline-block}#soundboard button:not(.playing) .sound-icon{display:none}.sound-icon,.error-icon{margin-left:.5em}#soundboard button.error{--highlight: #ff3333;background-color:red;--tertiary-color: color-mix(in lab, var(--highlight) 60%, var(--secondary-color) 40%);color:#fff}#soundboard button.error:hover{background-color:var(--highlight)}#soundboard button.error .error-icon{display:inline-block}#soundboard button:not(.error) .error-icon{display:none}#soundboard button:active{--shadow-size: .3rem}#soundboard button:hover{background-color:var(--highlight);--tertiary-color: color-mix(in lab, var(--highlight) 60%, var(--secondary-color) 40%)}@media (forced-colors: active){#soundboard button{forced-color-adjust:none;background-color:ButtonFace;color:ButtonText;border-color:ButtonText;box-shadow:0 var(--shadow-size) 0 ButtonText}#soundboard button:hover{border-color:Highlight;background-color:ButtonFace;box-shadow:0 var(--shadow-size) 0 Highlight}}*,*:before,*:after{box-sizing:border-box}@media (prefers-reduced-motion: reduce){*{transition-duration:0s!important}}@media (forced-colors: active){::selection{background-color:Highlight;color:HighlightText}}img.emoji{height:1em;width:1em;margin:0 .05em 0 .1em;vertical-align:-.1em;cursor:inherit}
