:root{--white:0, 0%, 0%;--black:0, 0%, 100%;--night:0, 0%, 93%;--darkgrey:0, 0%, 80%;--jet:120, 1%, 70%;--grey:0, 0%, 67%;--pink:320, 81%, 60%;--red:345, 100%, 50%;--success:120, 80%, 40%;--main-gradient:linear-gradient(45deg, hsl(var(--pink)) 0%, hsl(var(--red)) 100%);--main-gradient-reverse:linear-gradient(135deg, hsl(var(--pink)) 0%, hsl(var(--red)) 100%);--faux-gradient:linear-gradient(45deg, hsl(var(--grey)) 0%, hsl(var(--grey)) 100%)}.darkmode{--white:0, 0%, 100%;--black:0, 0%, 0%;--night:0, 0%, 7%;--darkgrey:0, 0%, 13%;--jet:120, 1%, 17%;--grey:0, 0%, 33%;--pink:320, 81%, 60%;--red:345, 100%, 50%}*{box-sizing:border-box;margin:0;padding:0}html{font-optical-sizing:auto;background-color:hsl(var(--night));height:100vh;font-size:18px;font-style:normal}*{font-family:JetBrains Mono,monospace}.cc-app{flex-direction:column;align-items:center;width:100vw;height:100%;min-height:100vh;padding:1rem;display:flex}.cc-app header{width:100%;max-width:666px;height:300px;color:hsl(var(--white));flex-direction:column;justify-content:center;display:flex}.cc-app header h1{font-size:2.6rem;font-weight:800}.cc-app header h3{font-size:1.2rem;font-weight:200}.cc-app main{flex-direction:column;justify-content:center;align-items:center;gap:1rem;width:100%;display:flex;position:relative}.cc-app header{flex-direction:column;min-height:140px;padding:20px 0;display:flex}.cc-app--footer{font-size:.8rem;position:fixed;bottom:0}.cc-app--footer__left{left:0}.cc-app--footer__right{right:0}.cc-app--items{flex-direction:column;align-items:center;width:100%;display:flex}.cc-app footer{z-index:1000}#root{overflow:hidden}.cc-area{background-color:hsl(var(--darkgrey));width:100%;max-width:666px;box-shadow:0 0 25px 0 hsl(var(--black), 0);color:hsl(var(--white));-webkit-user-select:none;user-select:none;border-radius:10px;margin-bottom:1rem;padding:1rem;transition:box-shadow .3s ease-out;position:relative;transform:scale(1)}.cc-area__reorder-handle{cursor:grab;width:calc(25px + 2rem);color:hsl(var(--white), .222);padding:1rem;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}.cc-area__reorder-handle:active{cursor:grabbing}.cc-area--dragging{box-shadow:0 0 25px 0 hsl(var(--black), .5);z-index:2;cursor:grabbing;max-width:700px}.cc-area--dragging .cc-area__reorder-handle{cursor:grabbing}.cc-area__content{width:100%}.cc-area:last-child{margin-bottom:0}.cc-area__title-wrapper{justify-content:space-between;display:flex;position:relative}.cc-area__title{color:hsl(var(--white));margin-bottom:.5rem;font-size:.8rem}.cc-area__title-skeleton{background:var(--main-gradient);border-radius:5px;width:100px;height:20px;margin-bottom:.5rem}.cc-area__textbox{appearance:none;background:linear-gradient(hsl(var(--jet)), hsl(var(--jet))) padding-box, var(--main-gradient) border-box;resize:none;width:100%;height:auto;min-height:100px;color:hsl(var(--white));border:3px solid #0000;border-radius:10px;outline:none;margin-bottom:1rem;padding:1rem;font-size:1rem;line-height:1.5;transition:border .3s ease-out;overflow:hidden}.cc-area__textbox--copy{cursor:pointer;box-shadow:0 0 7px hsl(var(--pink), 0);background:linear-gradient(hsl(var(--night)), hsl(var(--night))) padding-box, var(--main-gradient) border-box;border:3px solid #0000;border-radius:10px;transition:box-shadow .3s ease-out}.cc-area__textbox--copy:hover,.cc-area__textbox--copy:focus{box-shadow:0 0 7px hsl(var(--pink), 1);transition:box-shadow .3s ease-in}.cc-area__controls{justify-content:space-between;width:100%;max-width:666px;display:flex;position:relative}.cc-area__controls--clear{color:#fff;appearance:none;background:var(--main-gradient);border:none;border-radius:5px;outline:none;padding:5px;transition:background .3s ease-out}.cc-area__controls--clear:hover{background:var(--main-gradient-reverse);cursor:pointer;transition:background .3s ease-in}.cc-area__close-button{color:hsl(var(--white));cursor:pointer;background-color:#0000;border:none;border-radius:5px;margin:0;padding:2px;font-size:.6rem;transition:background-color .3s ease-out;position:absolute;right:0}.cc-area__close-button:hover,.cc-area__close-button:focus,.cc-area__close-button:active{background-color:hsl(var(--red))}.cc-area__toast{opacity:0;background-color:hsl(var(--white));color:hsl(var(--black));border-radius:5px;padding:5px;font-size:.8rem;transition:opacity .3s ease-out;position:absolute;bottom:1rem;left:50%;transform:translate(-50%)}.cc-area__toast.visible{opacity:1}.cc-area__toast--error{background-color:hsl(var(--red));color:hsl(var(--white))}.cc-area--skeleton{opacity:.5;filter:saturate(0);cursor:pointer;border:none;transition:opacity .3s ease-out,filter .3s ease-out}.cc-area--skeleton .cc-area__textbox{background:linear-gradient(hsl(var(--jet)), hsl(var(--jet))) padding-box, var(--main-gradient) border-box;border:3px solid #0000;height:105px;position:relative}.cc-area--skeleton .cc-area__controls--clear{background:var(--main-gradient);cursor:default;pointer-events:none}.cc-area--skeleton .cc-area__controls--clear span{opacity:0}.cc-area--skeleton .cc-area__controls--editSkeleton{background:var(--main-gradient);border-radius:5px;width:70px;height:27.5px}.cc-area--skeleton .cc-area--title__skeleton{background:var(--main-gradient);border-radius:5px;width:100px;height:20px;margin-bottom:.5rem}.cc-area--skeleton .cc-area__close-button{background:var(--main-gradient)}.cc-area--skeleton .cc-area__close-button span{opacity:0}.cc-area--skeleton:hover{opacity:1;filter:saturate();transition:filter .3s ease-in,opacity .3s ease-in}.cc-area__plus-icon{fill:#fff;opacity:.5;transition:opacity .3s ease-out;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}.cc-area--skeleton:hover .cc-area__plus-icon{opacity:1;transition:opacity .3s ease-in}.cc-area [type=checkbox]{margin-right:.5rem}.cc-add-area{background:var(--main-gradient);color:hsl(var(--jet));cursor:pointer;z-index:1000;border:none;border-radius:100%;width:50px;height:50px;margin:1rem 0;padding:5px;transition:all .3s;position:relative;box-shadow:0 0 25px #00000080}.cc-add-area div{opacity:0;background-color:hsl(var(--jet));border-radius:5px;width:80px;padding:5px;transition:all .3s;position:absolute;top:12px;left:calc(100% + 10px)}.cc-add-area div:before{content:"";border-style:solid;border-width:6px 7px 6px 0;border-color:transparent hsl(var(--jet)) transparent transparent;position:absolute;top:50%;left:-7px;transform:translateY(-50%)}.cc-add-area:before,.cc-add-area:after{content:"";background-color:hsl(var(--white));border-radius:5px;width:30px;height:4px;display:inline-block;position:absolute;top:23px;left:10px}.cc-add-area:before{transform:rotate(90deg)}.cc-add-area:hover{transform:scale(1.1)}.cc-add-area:hover div{opacity:1}.cc-add-area:active{transform:scale(.9)}.cc-button{appearance:none;background:hsl(var(--jet));cursor:pointer;border:none;border-radius:5px;width:auto;padding:5px;transition:transform .4s ease-in-out;transform:scale(1)}.cc-button:hover{transform:scale(1.1)}.cc-app--userconfig{gap:10px;display:flex;position:absolute;top:10px;right:10px}.cc-modal-button{position:absolute;top:10px;left:10px}.cc-app--functional-buttons{justify-content:space-between;gap:10px;width:100%;max-width:666px;display:flex}.cc-app--button{appearance:none;background-color:hsl(var(--jet));cursor:pointer;color:hsl(var(--white));border:none;border-radius:5px;padding:3px;font-size:.6rem;transition:background-color .3s ease-out,transform .3s ease-out}.cc-app--button:hover{background-color:hsl(var(--pink))}.cc-app--clearAll:hover,.cc-app--clearAll:focus,.cc-app--clearAll:active{background-color:hsl(var(--red))}.cc-modal--overlay{background-color:hsl(var(--black), .5);width:100%;height:100%;color:hsl(var(--white));z-index:1000;position:fixed;top:0;left:0}.cc-modal--content{background-color:hsl(var(--night));border-radius:10px;width:100%;max-width:700px;max-height:700px;padding:20px;line-height:1.6;position:absolute;top:50%;left:50%;overflow:auto;transform:translate(-50%,-50%)}.cc-modal--content h2,.cc-modal--content h3{margin-bottom:5px;line-height:1.5}.cc-modal--content h2{margin-bottom:1.2rem;font-size:1.2rem;font-weight:800}.cc-modal--content h3{font-size:.85rem;font-weight:600}.cc-modal--content p,.cc-modal--content li:last-child{margin-bottom:15px;line-height:1.5}.cc-modal--content p,.cc-modal--content li{font-size:.85rem;font-weight:200}.cc-modal--content b{font-weight:400}.cc-modal--content ul{margin:0;padding:0}.cc-modal--content li{margin-bottom:10px;margin-left:20px}@keyframes fadeIn{to{opacity:1;transform:translateY(0)}}@keyframes fadeOut{to{opacity:0;transform:translateY(0)}}