@keyframes slideDown{0%{transform:translateY(-20px);opacity:0}to{transform:translateY(0);opacity:1}}@keyframes jiggle{0%{transform:rotate(0)}25%{transform:rotate(.5deg)}50%{transform:rotate(0)}75%{transform:rotate(-.5deg)}to{transform:rotate(0)}}@keyframes fadeColor{0%{opacity:.7}to{opacity:1}}@keyframes fadeTransform{0%{transform:scale(.98)}to{transform:scale(1)}}@keyframes pulsate{0%{transform:scale(1);opacity:1}50%{transform:scale(1.05);opacity:.7}to{transform:scale(1);opacity:1}}html{height:100%;background-color:#535b49}body{min-height:100%;background-color:#535b49;display:flex;flex-direction:column;margin:0}h1{color:var(--light-text)}.logo{position:fixed;top:0;left:0;width:100%;height:80px;background-color:#fff;display:flex;justify-content:center;align-items:center;z-index:300}#loadingOverlay{position:absolute;top:0;left:0;width:100%;height:100%;background-color:#000c;display:flex;justify-content:center;align-items:center;z-index:10;transition:opacity .5s ease}#loadingOverlay.hidden{opacity:0;pointer-events:none}.loading-text{color:#fff;font-size:1.2em;text-align:center;padding:10px}.spinner{border:12px solid #f3f3f3;border-top:12px solid #3498db;border-radius:50%;width:50px;height:50px;animation:spin 1.5s linear infinite;padding:10px}.main-content{position:relative;display:flex;flex-direction:column;align-items:center;width:100%;padding:20px;background-color:#535b49;box-sizing:border-box;flex-grow:1}.controls-container{display:flex;flex-direction:row;justify-content:space-between;align-items:center;gap:20px;width:96vw;margin:1px;z-index:1}.controls{display:flex;flex-direction:row;align-items:center;gap:10px;margin-bottom:11px}.controls-container button{font-size:clamp(22px,3vw,40px);cursor:pointer;background-color:#fc0;border:none;border-radius:6px;box-shadow:1px 2px 3px #0000001a;display:flex;align-items:center;text-align:center;gap:4px;justify-content:center;color:#3d4335;width:clamp(35px,4.2vw,60px);height:clamp(35px,4.2vw,60px);padding:0}#stopAllBtn{background-color:#e57b7b}.soundboard-selector{display:flex;align-items:center;gap:10px;flex-direction:row;margin-bottom:11px}.emodal-content{background:#fff;padding:30px;border-radius:10px;width:90%;max-width:400px;box-shadow:0 5px 15px #0000004d;position:relative;transition:background-color .3s ease,opacity .3s ease}.slider-container{margin:0 0 5px;display:flex;flex-direction:column;align-items:center}.slider-container label{font-size:1.1em;color:#333}#gridSlider{width:100%}.emodal-button{background-color:#28a745;color:#fff;font-size:16px;padding:10px 20px;border:none;border-radius:5px;cursor:pointer;transition:background-color .3s ease,transform .2s ease;width:100%;display:flex;justify-content:center;align-items:center;gap:5px}.emodal-button:hover{background-color:#218838;transform:translateY(-2px)}#soundboardContainer{position:relative;width:90.4vw;height:70vh;max-width:80vw;max-height:80vh;display:flex;justify-content:center;align-items:center;background-color:#8e9386;border-radius:10px;box-shadow:2px 4px 8px #0000001a;padding:10px;z-index:1}#soundboardGrid{display:grid;grid-template-columns:repeat(3,1fr);grid-gap:5px;width:100%;height:100%}.soundButton{background-color:#3d4335;border:2px solid #ffcc00;border-radius:10px;position:relative;overflow:hidden;cursor:pointer;transition:transform .2s ease,box-shadow .2s ease;animation:fadeColor .3s ease,fadeTransform .3s ease;width:100%;height:100%;display:flex;flex-direction:column;justify-content:center;align-items:center;-webkit-user-select:none;user-select:none}.soundButton:before{content:"";display:block;padding-top:100%}.soundButton:hover{transform:scale(1.05);box-shadow:2px 4px 10px #00000026;animation:fadeColor .2s ease,fadeTransform .2s ease}.top-buttons{position:absolute;top:5px;left:5px;right:5px;display:flex;justify-content:space-between;z-index:1}.soundButton .plusIcon,.soundButton .label{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);text-align:center;width:90%;display:flex;justify-content:center;align-items:center}.soundButton .plusIcon i,.soundButton .label{font-size:4vw;color:#fc0}.soundButton .label{position:absolute;top:20px;left:50%;transform:translate(-50%);text-align:center;font-size:1.8vw;color:#c6e4ec;border-radius:5px;line-height:1.2}.optionsContainer{position:absolute;top:0;left:0;width:100%;height:100%;background:#fffffff2;display:grid;grid-template-columns:1fr 1fr;grid-template-rows:1fr 1fr;gap:5px;padding:5px;opacity:0;visibility:hidden;transition:opacity .3s ease,visibility .3s ease;z-index:10}.optionsContainer.active{opacity:1;visibility:visible}.optionBtn{background-color:#fc0;border:none;border-radius:5px;color:#fff;cursor:pointer;transition:background-color .3s ease,transform .2s ease;display:flex;justify-content:center;align-items:center;animation:fadeColor .3s ease;font-size:clamp(14px,3vw,40px)}.optionBtn:hover{background-color:#e6b800;transform:translateY(-2px);animation:fadeColor .2s ease,fadeTransform .2s ease}button[data-action=cancel]{background-color:#f1807e}button[data-action=cancel]:hover{background-color:#e54747}.soundButton,.optionBtn,.controls button,.emodal-button{-webkit-user-select:none;user-select:none}.soundButton.playing{background-color:#2b6f2e}.soundButton.playing .label{color:#fff}.soundButton.paused{animation:pulsate 1s infinite}.progress-bar-container{position:absolute;bottom:0;left:0;width:100%;height:17px;background-color:#e0e0e0;display:none;overflow:hidden;border:2px solid #bab9b9;box-sizing:border-box}.progress-bar{width:0%;height:100%;background-color:#e57b7b;transition:width .1s linear}.soundButton.playing .progress-bar-container,.soundButton.paused .progress-bar-container{display:block}.restart-button{display:none}.soundButton.playing .restart-button{display:block}.restart-button:hover{color:#e0e0e0}.repeat-button,.retrigger-button,.restart-button{background:transparent;border:none;cursor:pointer;font-size:17px;color:#fff;padding:5px;margin:0}.repeat-button:hover,.retrigger-button:hover,.restart-button:hover{background-color:#4f5744}.volume-percentage{bottom:7px;position:fixed;color:var(--light-text);pointer-events:none;left:7vw}.fa-volume-high:before,.fa-volume-up:before{color:var(--light-text)}.label{font-size:16px;text-align:center;padding:5px;overflow-wrap:break-word;word-wrap:break-word;-webkit-hyphens:auto;hyphens:auto}.soundButton .label.short-label{font-size:2.5em;display:flex;justify-content:center;align-items:center;text-align:center;width:100%;height:100%;margin:0;padding:0;top:16px}.soundButton .label.mid-label{font-size:1.5em}.soundButton.loading{position:relative}.soundButton.loading:after{content:"";position:absolute;top:50%;left:50%;width:24px;height:24px;margin:-12px 0 0 -12px;border:4px solid rgba(255,255,255,.6);border-top-color:transparent;border-radius:50%;animation:spin 1s linear infinite;z-index:10}.soundButton.loading:before{content:"";position:absolute;top:0;left:0;width:100%;height:100%;background-color:#00000080;z-index:5}.soundButton.jiggle{animation:jiggle .2s infinite}.soundButton.jiggle:hover{animation-play-state:paused}.soundButton.sortable-ghost{opacity:.4}.soundboardGrid .sortable-chosen{border:2px dashed #ffcc00}.soundButton.dragging{opacity:.5;border:2px dashed #ffcc00;cursor:grabbing}.soundButton.placeholder{background-color:#f0f8ff;border:2px dashed #ffcc00;height:100%}.edit-mode .soundButton{user-select:none;-webkit-user-select:none;-ms-user-select:none}.soundButton:focus{outline:none}.edit-buttons-container{position:absolute;top:0;left:0;width:100%;pointer-events:none}.rename-btn{position:absolute;pointer-events:all}.delete-btn{position:absolute;right:5px;pointer-events:all;color:#f90707!important}.edit-buttons-container button{background:transparent;border:none;cursor:pointer;font-size:18px;color:#fff;padding:7px}.edit-buttons-container button:hover{color:#000}.confirm-overlay{position:absolute;top:0;left:0;width:100%;height:100%;background:#f00c;display:flex;justify-content:center;align-items:center}.confirm-delete-btn{background:transparent;border:none;color:#fff;font-size:32px;cursor:pointer}.rename-input{width:100%;border:none;text-align:center;font-size:16px;background:transparent;color:#fff}.rename-input:focus{outline:none}#renameInput{width:100%;padding:10px;margin:15px 0;box-sizing:border-box}#renameConfirmBtn{padding:10px 20px;font-size:16px}#soundboardSelect{font-size:16px;padding:4px;border-radius:6px;border:1px solid #ccc;background-color:#fff;box-shadow:1px 2px 4px #0000001a;cursor:pointer;text-align:center;max-width:399px;width:100%;top:35px;position:relative;z-index:100;font-family:inherit}.volume-container{width:73%;z-index:1000;bottom:0;position:absolute}.volume-slider{width:100%}.swal2-popup.create-ai-swal-popup{width:90vw;max-width:500px;padding:1.5em 1em 2em}.create-ai-swal-html-container{margin:1em 0}.create-ai-swal-popup .swal2-input{height:auto;font-size:1rem;padding:12px;margin:.5em auto;border-radius:8px}.swal2-styled.create-ai-swal-confirm-button{font-size:1.1em;padding:.75em 2em;border-radius:8px}@media (max-width: 480px){.swal2-popup.create-ai-swal-popup{width:94vw;padding:1.2em .8em 1.5em}.swal2-popup.create-ai-swal-popup #swal2-title{font-size:1.5em}.create-ai-swal-html-container label,.create-ai-swal-popup .swal2-input{width:90%!important;box-sizing:border-box}}@media (orientation: landscape){body{overflow-x:hidden;width:100vw;height:auto;margin:0;padding:0}.main-content{padding:0}h1{font-size:clamp(15px,3vw,24px);margin:0;padding:0}.nav-bar{padding:10px}#soundboardSelect{position:absolute;left:16px;top:100.8px;width:6%}#soundboardContainer{margin-top:6.2px;width:100%;flex-grow:1;overflow-y:auto;height:100vh;margin-bottom:10px;max-height:100vh}.soundButton .label{display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:3;overflow:hidden;text-overflow:ellipsis;max-height:5em;top:30px}.soundButton .label.short-label{top:0%}.controls,.soundboard-selector{flex-direction:column;margin-top:100px}.nav-bar span{display:none}.controls-container{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}.optionBtn{padding:0}}@media (orientation: landscape) and (max-height: 700px){.retrigger-button{position:absolute;top:8vh;left:0}}@media (orientation: portrait){a[href="/Disclosure"]{display:none}.footer-content{padding:5px}h1{margin-bottom:-13px}.controls-container{align-items:center;gap:15px;margin-top:65px}#soundboardSelect{margin:10px 0;width:18.2%;top:48px}.soundboard-selector,.controls{justify-content:center}#renameSoundboardBtn,#deleteSoundboardBtn{padding:6px}h2.demo-header{padding-top:0!important;font-size:17px}.controls{margin-bottom:0}.soundButton .repeat-button,.soundButton .retrigger-button,.soundButton .restart-button{padding:1px;font-size:18px}#soundboardGrid{grid-template-columns:repeat(2,1fr)}.controls button{margin-bottom:10px;padding:8px}.soundButton .plusIcon i{font-size:6vw}.soundButton .label{text-align:center;font-size:3.5vw;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:4;overflow:hidden;text-overflow:ellipsis;line-height:1.2em;max-height:4.8em;white-space:normal;width:100%;max-width:100%;box-sizing:border-box;padding:0 8px;top:32px}.optionBtn{padding:5px}.emodal-content{padding:20px}.slider-container label{font-size:1em}#soundboardContainer{height:74vh;top:144.8px;margin-top:-144.4px;margin-bottom:131.8px;max-width:100vw}}#renameModal .modal-content h2{margin-top:0;margin-bottom:20px}#renameModal .modal-content label{display:block;margin-bottom:5px;font-weight:700;color:#333}#renameModal .modal-content #renameInput{margin-bottom:15px;width:100%;padding:10px;box-sizing:border-box;border:1px solid #ccc;border-radius:4px}#renameModal .modal-content #waveform{height:128px;background-color:#e9e9e9;border-radius:4px;margin-bottom:10px;position:relative;border:1px solid #ddd;overflow:hidden}#renameModal .modal-content #waveform-loading{display:flex;justify-content:center;align-items:center;position:absolute;left:0;width:100%;height:100%;font-style:italic;color:#555;background-color:#e9e9e9d9;z-index:10;border-radius:4px;text-align:center;padding:10px;box-sizing:border-box}#renameModal .modal-content .wavesurfer-controls{margin-bottom:20px;display:flex;gap:10px;align-items:center;flex-wrap:wrap}#renameModal .modal-content .wavesurfer-controls button:hover:not(:disabled){border-color:#bbb}#renameModal .modal-content .wavesurfer-controls button:disabled{cursor:not-allowed;opacity:.6;pointer-events:none}#renameModal .modal-content .wavesurfer-controls button i{pointer-events:none}#renameModal .modal-content #wsRegionInfo{font-size:.85em;color:#333;flex-grow:1;text-align:right;padding:0 5px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}#renameModal .modal-content #renameConfirmBtn{width:100%;padding:12px 15px;margin-top:5px;font-weight:700;border-radius:4px;cursor:pointer}#renameModal .modal-content #edit-saving-indicator{display:none;margin-top:10px;color:#555;font-style:italic;text-align:center}#renameModal .modal-content #waveform div[data-ws-region]{background-color:#00640026!important;z-index:3!important;border-left:1px dashed rgba(0,0,0,.5);border-right:1px dashed rgba(0,0,0,.5)}#renameModal .modal-content #waveform div[data-ws-handle]{background-color:#000000b3!important;width:8px!important;z-index:4!important;cursor:ew-resize!important;border-radius:2px}.custom-sb-modal{position:fixed;z-index:1070;left:0;top:0;width:100%;height:100%;overflow:auto;background-color:#00000080;display:flex;align-items:center;justify-content:center}.custom-sb-modal.hidden{display:none}.custom-sb-modal-content{background-color:#fff;color:#333;margin:auto;padding:20px;border:1px solid #ccc;border-radius:8px;width:90%;max-width:450px;box-shadow:0 4px 8px #0000001a;position:relative}.custom-sb-modal-close-btn{color:#aaa;position:absolute;top:10px;right:15px;font-size:28px;font-weight:700;line-height:1}.custom-sb-modal-close-btn:hover,.custom-sb-modal-close-btn:focus{color:#000;text-decoration:none;cursor:pointer}#customRenameModalTitle{margin-top:0;margin-bottom:15px;color:#545454;font-size:1.875em}#customRenameSoundboardInput{width:calc(100% - 22px);padding:10px;margin-bottom:10px;border:1px solid #ccc;border-radius:4px;box-sizing:border-box;font-size:16px}.custom-sb-modal-actions{text-align:right;margin-top:20px}.custom-sb-modal-button{padding:10px 15px;margin-left:10px;border:none;border-radius:4px;font-size:1rem}.custom-sb-modal-save-btn:hover{background-color:#0056b3}.custom-sb-modal-cancel-btn{background-color:#6c757d;color:#fff}.custom-sb-modal-cancel-btn:hover{background-color:#545b62}@media screen and (min-width: 1024px) and (orientation: landscape){#soundboardContainer{width:60%}}.custom-dropdown-button{background-color:#fc0;color:#3d4335;font-size:clamp(16px,2.5vw,22px);border:none;border-radius:6px;cursor:pointer;width:auto;height:clamp(35px,4.2vw,60px);display:flex;align-items:center;justify-content:center;text-align:center;box-shadow:1px 2px 3px #0000001a;padding:0 10px}.custom-dropdown-button:hover{background-color:#e6b800}.custom-dropdown-list{display:none;position:absolute;background-color:#f1f1f1;min-width:200px;box-shadow:0 8px 16px #0003;z-index:1001;border-radius:4px;max-height:200px;overflow-y:auto}.custom-dropdown-list.vertical-opening{margin-top:2px}.custom-dropdown-list.horizontal-opening{top:0;left:100%;margin-left:5px}.custom-dropdown-list.show{display:block}.custom-dropdown-item{color:#000;padding:12px 16px;text-decoration:none;display:block;cursor:pointer;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.custom-dropdown-item:hover{background-color:#ddd}.soundboard-selector{display:flex;align-items:center;gap:10px}@media (orientation: landscape){#customSoundboardDropdownContainer{display:inline-block!important}}body.dropdown-is-open .controls-container{z-index:2}#soundboardSelect{display:none!important}.edit-mode .top-buttons{display:none}@media screen and (max-width: 1024px) and (min-width: 650px){.esl-link img{display:none}}#tour-highlight{position:absolute;z-index:1090;border-radius:4px;transition:all .2s ease-in-out,box-shadow .2s ease-in-out;pointer-events:none;border:2px solid rgba(255,255,255,.7)}.tour-tooltip-base{position:absolute;z-index:1100;background-color:#333;color:#fff;border-radius:5px;padding:15px;width:clamp(300px,50vw,calc(40vw - 40px));box-shadow:0 5px 15px #0000004d;visibility:hidden;opacity:0;transition:opacity .2s ease-in-out,visibility .2s ease-in-out,top .2s ease-in-out,left .2s ease-in-out;font-size:clamp(16px,1.5vw,20px)}#tour-tooltip-title{margin-top:0;margin-bottom:10px;font-size:1.3em;font-weight:700;color:#55c57a}#tour-tooltip-text{margin-bottom:15px;line-height:1.6}#tour-tooltip-text p{margin-bottom:.5em}#tour-tooltip-text p:last-child{margin-bottom:0}#tour-tooltip-nav{display:flex;justify-content:space-between;align-items:center;border-top:1px solid #555;padding-top:10px;margin-top:10px}#tour-tooltip-nav button{background-color:#007bff;color:#fff;border:none;padding:8px 12px;border-radius:4px;cursor:pointer;font-size:.9em;transition:background-color .2s ease}#tour-tooltip-nav button:hover{background-color:#0056b3}#tour-tooltip-nav #tour-prev-btn{background-color:#6c757d}#tour-tooltip-nav #tour-prev-btn:hover{background-color:#545b62}#tour-step-counter{font-size:.85em;color:#ccc}.tour-prev-next-buttons button{margin-left:8px}.tour-prev-next-buttons button:first-child{margin-left:0}#tour-end-btn{background-color:#dc3545;color:#fff;border:none;padding:8px 12px;border-radius:4px;cursor:pointer;font-size:.9em;transition:background-color .2s ease;font-weight:400;line-height:normal}#tour-end-btn:hover{background-color:#c82333}#tour-end-btn{background-color:#6c757d;color:#fff;border:none;padding:8px 12px;border-radius:4px;cursor:pointer;font-size:.9em;transition:background-color .2s ease}#tour-end-btn:hover{background-color:#545b62}#tour-tooltip-arrow{position:absolute;width:0;height:0;border-style:solid;border-width:17px}.tour-tooltip-position-bottom #tour-tooltip-arrow{border-color:transparent transparent #333 transparent}.tour-tooltip-position-top #tour-tooltip-arrow{border-color:#333 transparent transparent transparent}.tour-tooltip-position-left #tour-tooltip-arrow{border-color:transparent transparent transparent #333}.tour-tooltip-position-right #tour-tooltip-arrow{border-color:transparent #333 transparent transparent}#welcomeTourModal{z-index:1050}#welcomeTourModal .modal-content{max-width:500px;text-align:center;padding:25px 30px;background-color:#fff;border-radius:8px}#welcomeTourModal #welcomeModalTitle{margin-top:0;margin-bottom:15px;color:#333;font-size:1.8em}#welcomeTourModal #welcomeModalText{margin-bottom:25px;color:#555;line-height:1.6;font-size:1.05em}#welcomeTourModal .modal-actions{display:flex;justify-content:center;gap:15px}#welcomeTourModal .modal-actions button{padding:12px 25px;border-radius:5px;border:none;cursor:pointer;font-size:1em;font-weight:500;transition:background-color .2s ease,transform .1s ease}#welcomeTourModal .modal-actions button:hover{transform:translateY(-1px)}#welcomeTourModal .modal-actions button:active{transform:translateY(0)}#welcomeTourModal #startUsingToolBtn{background-color:#28a745;color:#fff}#welcomeTourModal #startUsingToolBtn:hover{background-color:#218838}#welcomeTourModal #takePageTourBtn{background-color:#007bff;color:#fff}#welcomeTourModal #takePageTourBtn:hover{background-color:#0056b3}#welcomeTourModal .close-welcome-modal{position:absolute;top:9.8px;right:15px;font-size:28px;font-weight:700;color:#aaa;cursor:pointer;background:none;border:none;padding:initial}#welcomeTourModal .close-welcome-modal:hover{color:#777}
