@import"https://fonts.googleapis.com/css2?family=Capriola&display=swap";*,:after,:before{box-sizing:border-box;margin:0;padding:0}body{display:flex;flex-direction:column;background-color:#e07a5f;min-height:100vh;padding:2rem;font-family:Capriola,sans-serif}.body-container{height:100%;display:flex;justify-content:center;align-items:center}.content-wrapper{flex-grow:1;background-color:#f4f1de;border-radius:12px}.button-main{display:inline-flex;align-items:center;justify-content:center;padding:.5rem 1rem;color:#fff;font-size:1.25rem;font-family:Capriola,sans-serif;border:none;border-radius:.5rem;text-decoration:none;cursor:pointer;transition:all .2s ease-in-out;font-weight:500;aspect-ratio:0;text-align:center}.button-main,.button-main:hover{background-color:#81b29a}.button-main:disabled{opacity:.6;cursor:not-allowed}@media(max-width:375px){.button-main{font-size:12px}}.button-clear{display:inline-flex;align-items:center;justify-content:center;padding:.5rem 1rem;background-color:#f2cc8f;color:#fff;font-size:1.25rem;font-family:Capriola,sans-serif;border:none;border-radius:.5rem;text-decoration:none;cursor:pointer;transition:all .2s ease-in-out;font-weight:500;aspect-ratio:0;text-align:center}.button-clear:hover{background-color:#81b29a}.button-clear:disabled{opacity:.6;cursor:not-allowed}@media(max-width:375px){.button-clear{font-size:12px}}.timer-wrapper{flex-direction:row;gap:.5rem}.sticker-picker,.timer-wrapper{display:flex;justify-content:center;align-items:center}.sticker-picker{position:relative;z-index:0;padding:1rem}.sticker-picker__button{display:inline-flex;align-items:center;justify-content:center;padding:.5rem 1rem;background-color:#f2cc8f;color:#fff;font-size:.875rem;font-family:Capriola,sans-serif;border:none;border-radius:50%;text-decoration:none;cursor:pointer;transition:all .2s ease-in-out;font-weight:500;aspect-ratio:1;text-align:center}.sticker-picker__button:hover{background-color:#81b29a}.sticker-picker__button:disabled{opacity:.6;cursor:not-allowed}.sticker-picker__button img{min-width:150px;margin:3rem}@media(max-width:375px){.sticker-picker__button img{width:50px;margin:1rem}}.sticker-picker__dropdown{position:absolute;margin-top:.25rem;min-width:300px;height:auto;overflow-y:auto;background-color:#3d405b;border:none;border-radius:.375rem;box-shadow:0 4px 6px rgba(0,0,0,.1);z-index:100;list-style:none;padding:1rem;display:flex;justify-content:center;align-items:center;flex-wrap:wrap}.sticker-picker__item{position:relative;padding:.5rem;cursor:pointer;display:flex;flex-direction:column;align-items:center;transition:background-color .2s ease}.sticker-picker__item img,.sticker-picker__item span{transition:opacity .2s ease}.sticker-picker__item span{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);color:#000;background:hsla(0,0%,100%,.8);padding:.25rem .5rem;border-radius:.25rem;font-size:.8rem;opacity:0;pointer-events:none}.sticker-picker__item:hover{border-radius:12px}.sticker-picker__item:hover img{opacity:.4}.sticker-picker__item:hover span{opacity:1}.timer-container{flex-grow:1}.interval-container,.timer-container{display:flex;flex-direction:column;justify-content:center;align-items:center;gap:.5rem}.interval-container__interval-name{display:flex;flex-direction:row;justify-content:center;align-items:center;gap:.5rem;font-size:3rem;color:#e07a5f}@media(max-width:375px){.interval-container__interval-name{font-size:1.5rem}}.interval-container__interval-variants{display:flex;flex-direction:row;justify-content:center;align-items:center;gap:.5rem}@media(max-width:900px){.interval-container__interval-variants{display:grid;grid-template-columns:1fr 1fr}}.stickerlog-container{flex-direction:column}.stickerlog,.stickerlog-container{display:flex;justify-content:center;align-items:center;gap:.5rem}.stickerlog{flex-direction:row;padding:3rem 0;flex-wrap:wrap;color:gray}@media(max-width:900px){.stickerlog{font-size:12px}.stickerlog img{width:50px}}.btn-playback button{display:inline-flex;align-items:center;justify-content:center;padding:.5rem 1rem;background-color:rgba(0,0,0,0);color:#fff;font-size:.875rem;font-family:Capriola,sans-serif;border:none;border-radius:.5rem;text-decoration:none;cursor:pointer;transition:all .2s ease-in-out;font-weight:500;aspect-ratio:0;text-align:center}.btn-playback button:hover{background-color:none}.btn-playback button:disabled{opacity:.6;cursor:not-allowed}.cats-container{width:100%;height:95%}.cats-container__inner{padding:3rem;font-size:1.5rem;color:#81b29a}.modal-overlay{position:fixed;top:0;left:0;width:100vw;height:100vh;background-color:rgba(0,0,0,.5);z-index:999}.modal-container,.modal-overlay{display:flex;justify-content:center;align-items:center}.modal-container{flex-direction:column;gap:.5rem;background-color:#fff;padding:2rem;border-radius:12px;z-index:1000;box-shadow:0 10px 30px rgba(0,0,0,.2);max-width:90%;max-height:90%;overflow-y:auto;position:relative;text-align:center}.modal-close{position:absolute;top:.5rem;right:.75rem;font-size:1.5rem;background:rgba(0,0,0,0);border:none;cursor:pointer}.spinning{animation:spin 5s linear infinite}@keyframes spin{0%{transform:rotate(0deg)}to{transform:rotate(1turn)}}.menu{text-decoration:none;color:#000;list-style:none}.menu:hover{background-color:#d3d3d3;color:brown}.menu.active,.menu:hover{border-radius:12px 12px 0 0}.menu.active{background-color:#f7c059;color:#000}.nav{display:flex;justify-content:space-between;padding:1rem 3rem;font-size:1.2rem}@media(max-width:375px){.nav{flex-direction:column;font-size:13px;gap:1rem}}@media(max-width:900px){.nav{flex-direction:column}}.navbar-container,.username-container{display:flex;gap:2rem;justify-content:center;align-items:center}@media(max-width:375px){.navbar-container,.username-container{gap:12px}}.input-bar{width:100%;max-width:400px;padding:8px;font-size:16px;border:2px solid #ccc;border-radius:8px;outline:none;transition:border-color .3s ease,box-shadow .3s ease}.input-bar:focus{border-color:#007bff;box-shadow:0 0 5px rgba(0,123,255,.5)}