:root{--primary:#f4faff;--secondary:#08090a;--accent:#8789c0;--accent-2:#7cc6fe;--accent-3:#5dfdcb;--titles:"Carter One", system-ui;--text:"Nunito Sans", sans-serif;--shadow:0 4px 15px #0000001a;--radius:18px}body{background-color:var(--primary);background-image:radial-gradient(circle at 50% 0,#8789c01a,#0000 60%);min-height:100vh;margin:0;padding:0}@keyframes fadeSlideUp{0%{opacity:0;transform:translateY(24px)}to{opacity:1;transform:translateY(0)}}@keyframes popIn{0%{opacity:0;transform:scale(.92)}60%{transform:scale(1.02)}to{opacity:1;transform:scale(1)}}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}@keyframes headerDrop{0%{opacity:0;transform:translateY(-100%)}to{opacity:1;transform:translateY(0)}}@keyframes checkPop{0%{transform:scale(1)}50%{transform:scale(1.25)}to{transform:scale(1)}}h1,h2{font-family:var(--titles);margin:0}ul{margin:0;padding:0;list-style-type:none}header{text-align:center;background-image:linear-gradient(135deg, var(--accent), var(--accent-2));border-bottom:3px solid #00000014;margin:0;padding:20px 0;animation:.5s both headerDrop;box-shadow:0 2px 12px #0003}h1{letter-spacing:.5px;-webkit-text-stroke:1px black;-webkit-text-fill-color:var(--primary);font-size:2.5rem}.list{padding:40px}.card-list{flex-wrap:wrap;justify-content:space-evenly;gap:30px;padding:0;display:flex}.card-list>li{animation:.45s both fadeSlideUp}.card-list>li:first-child{animation-delay:50ms}.card-list>li:nth-child(2){animation-delay:.12s}.card-list>li:nth-child(3){animation-delay:.19s}.card-list>li:nth-child(4){animation-delay:.26s}.card-list>li:nth-child(5){animation-delay:.33s}.card-list>li:nth-child(n+6){animation-delay:.4s}.card{border:1px solid #0000000f;border-top:4px solid var(--accent);border-radius:var(--radius);width:280px;height:500px;box-shadow:var(--shadow);box-sizing:border-box;background-color:#fff;flex-direction:column;align-items:center;padding:20px;transition:transform .2s,box-shadow .2s;display:flex}.card:hover{transform:translateY(-4px)scale(1.02);box-shadow:0 12px 28px #00000026}.card h2{text-align:center;color:var(--secondary);border-bottom:2px solid #8789c040;width:100%;margin-bottom:14px;padding-bottom:10px;font-size:1.4rem}.card small{font-family:var(--text);color:#888;margin-top:auto;margin-bottom:12px;font-size:.75rem}.card-ul{flex-direction:column;gap:6px;width:100%;display:flex}.card-li{font-size:.95rem;font-family:var(--text);background-color:#8789c014;border-radius:8px;align-items:center;gap:10px;width:100%;padding:4px 8px;transition:background-color .2s,transform .15s;display:flex}.card-li:hover{background-color:#8789c029;transform:translate(3px)}.card-li li{transition:color .25s,opacity .25s}.card-li input[type=checkbox]{accent-color:var(--accent);cursor:pointer;flex-shrink:0;width:16px;height:16px;transition:transform .15s}.card-li input[type=checkbox]:checked{animation:.3s checkPop}.delete-button{width:100%;color:var(--primary);box-shadow:var(--shadow);cursor:pointer;background-color:#ff5050;border:none;border-radius:12px;justify-content:center;align-items:center;padding:8px;transition:background-color .2s,transform .15s,box-shadow .2s;display:flex}.delete-button:hover{background-color:#ff7878;transform:translateY(-1px);box-shadow:0 6px 18px #ff505059}.delete-button:active{transform:scale(.96)}.delete-button svg{transition:transform .2s}.delete-button:hover svg{transform:rotate(-8deg)scale(1.1)}.card-list>li{list-style:none}.create-button{border-radius:var(--radius);background-color:var(--accent-3);width:100%;height:100%;color:var(--secondary);box-shadow:var(--shadow);cursor:pointer;border:none;justify-content:center;align-items:center;transition:background-color .2s,transform .2s;display:flex}.create-button:hover{background-color:#96f6d7;transform:scale(1.03)}.create-button:active{transform:scale(.97)}.create-button svg{transition:transform .25s}.create-button:hover svg{transform:rotate(90deg)}.add-card{box-sizing:border-box;flex-direction:column;gap:8px;width:100%;height:100%;animation:.3s both popIn;display:flex;overflow:hidden}.add-card h2{text-align:center;margin-bottom:2px;font-size:1rem}.add-card input[type=text]{width:100%;font-family:var(--text);box-sizing:border-box;background-color:#8789c00f;border:1.5px solid #00000026;border-radius:8px;padding:4px 8px;font-size:.9rem;transition:border-color .2s,transform .2s}.add-card input[type=text]:focus{border-color:var(--accent);outline:none}.add-card-buttons{gap:8px;margin-top:4px;display:flex}.go-back-button{border:2px solid var(--secondary);background-color:var(--primary);font-family:var(--titles);cursor:pointer;border-radius:10px;flex:1;padding:7px;transition:background-color .2s,transform .15s}.go-back-button:hover{background-color:#e0e0e0}.publish-button{background-color:var(--accent);color:var(--primary);font-family:var(--titles);cursor:pointer;border:none;border-radius:10px;flex:1;padding:7px;transition:background-color .2s,transform .15s}.publish-button:hover{background-color:#6f71a8}.go-back-button:active,.publish-button:active{transform:scale(.96)}.add-card input[type=text]:focus{transform:translateY(-1px)}@media (prefers-reduced-motion:reduce){*,:before,:after{transition-duration:.01ms!important;animation-duration:.01ms!important;animation-iteration-count:1!important}}