*{color:#f0f0f0;box-sizing:border-box;border:0;margin:0;padding:0}body{background-color:#000;width:100%;height:auto;min-height:100dvh;overflow-x:hidden}button{font:inherit;color:inherit;border:0}a{text-decoration:none}button:focus-visible{outline-offset:4px;outline:3px solid #dcd427}header{text-align:center;width:100%;height:fit-content;padding:1rem 1rem 0;font-size:clamp(2.2rem,8vw,4rem)}main{flex-flow:column wrap;justify-content:center;align-items:center;width:100%;height:fit-content;margin-top:clamp(1rem,4vw,2rem);padding:0 1rem;display:flex;position:relative}#generatePaletteBtn{cursor:pointer;background-color:#323232;border-radius:12px;max-width:100%;margin-bottom:clamp(1.5rem,5vw,3rem);padding:.8rem 1.2rem;font-size:clamp(1.5rem,5vw,2.5rem)}#generatePaletteBtn:hover{color:#dcd427}#buttonsContainer{flex-wrap:wrap;justify-content:center;align-items:center;gap:clamp(1rem,4vw,3rem);width:100%;max-width:1200px;display:flex}#paletteContainer{flex-wrap:wrap;flex:32rem;justify-content:center;width:min(100%,40rem);min-width:280px;max-width:40rem;height:fit-content;display:flex}.colorBoxes{text-align:end;cursor:pointer;word-break:break-word;background-color:#ff0;justify-content:flex-end;align-items:center;width:100%;height:clamp(5rem,12vw,8rem);padding:.75rem 1rem;font-size:clamp(1rem,3vw,1.5rem);display:flex}#copiedAlert{color:#f0f0f0;z-index:1000;white-space:nowrap;background-color:#282828;border-radius:2rem;padding:1rem;font-size:clamp(1rem,4vw,1.5rem);display:none;position:fixed;top:clamp(5rem,12vh,8rem);left:64%;right:auto;transform:translate(-50%)}#dislikeButton,#likeButton{text-align:center;cursor:pointer;background-color:#000;flex-direction:column;justify-content:center;align-items:center;width:clamp(7rem,18vw,15rem);max-width:20rem;max-height:20rem;margin-left:0;margin-right:0;font-size:clamp(1rem,3vw,2rem);display:flex}#likeButton{margin-left:0;margin-right:0}#dislikeButton svg,#likeButton svg{width:clamp(10rem,30vw,15rem);max-width:100%;height:auto}#favoritesButton{cursor:pointer;z-index:900;background-color:#000;border:2px solid #323232;border-radius:8px;align-items:center;padding:8px;font-size:clamp(1rem,3vw,1.5rem);display:flex;position:fixed;top:1rem;right:clamp(1rem,4vw,4rem)}#favoritesButton svg{width:clamp(1.5rem,5vw,2rem);height:clamp(1.5rem,5vw,2rem);margin-left:6px}#favoritesContainer{z-index:950;background-color:#323232;border-radius:2rem;width:min(90rem,100% - 2rem);height:min(80dvh,42rem);padding:1rem;display:none;position:fixed;top:50%;left:50%;overflow:hidden;transform:translate(-50%,-50%)}#favoritesHeader{text-align:center;width:100%;height:fit-content;padding-right:3.5rem;font-size:clamp(2rem,6vw,3rem)}#favoritesBoxesContainer{flex-wrap:wrap;align-content:flex-start;gap:1rem;max-height:calc(100% - 4rem);padding:.5rem;display:flex;overflow-y:auto}.favoritesPaletteContainer{text-align:right;flex:clamp(13rem,22vw,18rem);width:auto;min-width:13rem;height:clamp(15rem,30vw,20rem);margin:0;position:relative}.favoritesColorBoxes{cursor:pointer;word-break:break-word;background-color:#dcd427;justify-content:flex-end;align-items:center;width:100%;height:20%;padding:.4rem .6rem;font-size:clamp(.85rem,2.5vw,1rem);display:flex}.deleteFavorite{cursor:pointer;background:0 0;width:2rem;height:2rem;position:absolute;bottom:1rem;left:.5rem}.deleteFavorite svg{width:100%;height:100%;margin-top:0!important}#closeFavorites{cursor:pointer;background:0 0;width:clamp(2.2rem,7vw,3rem);height:clamp(2.2rem,7vw,3rem);position:absolute;top:1rem;right:1rem}#exportsButtonsContainer{flex-wrap:wrap;justify-content:center;gap:1rem;width:min(100%,34rem);margin-top:2rem;display:flex}.exportButton{cursor:pointer;background-color:#323232;border-radius:1rem;padding:.8rem;font-size:1.5rem}@media (width<=900px){#paletteContainer{flex-basis:100%;order:1;max-width:42rem}#dislikeButton,#likeButton{flex:10rem;order:2;max-width:14rem}}@media (width<=600px){header{padding-top:.75rem}main{margin-top:1rem;padding:0 .75rem}#generatePaletteBtn{width:min(100%,22rem);padding:.5rem}#buttonsContainer{gap:1rem}#paletteContainer{min-width:100%}.colorBoxes{height:clamp(4.5rem,18vw,6rem);padding:.6rem .8rem}#dislikeButton,#likeButton{flex-basis:calc(50% - .5rem);max-width:none;font-size:1rem}#dislikeButton svg,#likeButton svg{width:4.5rem}#favoritesButton{width:fit-content;margin:1rem auto 0;position:static}#favoritesContainer{border-radius:1rem;width:calc(100% - 1rem);height:calc(100dvh - 1rem);padding:.75rem}#favoritesHeader{font-size:2rem}#favoritesBoxesContainer{max-height:calc(100% - 3.5rem)}.favoritesPaletteContainer{flex-basis:100%;min-width:100%;height:16rem}.exportButton{font-size:.8rem}}