#root{min-height:100vh;max-width:1000px;margin:0;padding:0 1rem;display:flex;flex-direction:column;align-items:center;flex-grow:1;color-scheme:light dark;text-decoration:none;text-align:center;font-family:Verdana,Arial,sans-serif;line-height:1.5;font-weight:400;font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;-webkit-text-size-adjust:100%}body{margin:0;padding:0;min-width:320px;min-height:100vh;background-color:var(--background-color);display:flex;justify-content:center;color:#fff;--background-color-light: #a4a4a4;--accent-color: #ed6e04;--primary-color: #604f8f;--secondary-color: #c1a0ff;--secondary-color-light: #604f8f;--todo-complete: #545454;--background-color: #242424}h1{font-size:3.8em;line-height:1.1;letter-spacing:.08em;margin:1rem 0}ul{display:flex;flex-direction:column;margin:0;padding:0}li{font-weight:700;text-align:left;list-style-type:none;text-align:center;margin:.4rem 0}button{border-radius:8px;border:1px solid transparent;color:#fff;font-size:1em;font-weight:500;background-color:#1a1a1a;cursor:pointer;transition:border-color .25s}label{display:flex;flex-direction:column;align-items:start}.appTitle{font-size:7rem;color:var(--primary-color);text-shadow:0 0 4px var(--accent-color)}.usernameForm{display:flex;justify-content:center;align-items:center;flex-direction:column;gap:20px;padding:10px 20px}.addBtn:hover{border-color:#fff}.listTitle{width:fit-content;font-size:3rem;margin:1rem 0 .5rem;padding:0;cursor:pointer;border-bottom:2px solid var(--secondary-color)}.listTitle:hover,.todoGroup:hover{color:var(--secondary-color);border-bottom:2px solid var(--accent-color)}.todoGroupContainer{position:relative;display:flex;margin:1rem 0 0;justify-content:center;align-items:center}.todoGroup{cursor:pointer;font-size:2rem;margin:0;border-bottom:2px solid var(--secondary-color)}.todoGroupMenu{width:250px;height:425px;font-weight:700;font-size:2rem;display:flex;justify-content:start;align-items:center}.listMenu{min-width:260px;height:fit-content;min-height:350px;max-height:450px;margin-top:1rem;margin-bottom:-1rem;font-weight:700;z-index:2;display:flex;flex-direction:column;justify-content:center;align-items:center}.listOptions{overflow-y:auto;padding:1rem;margin:1rem .5rem;min-height:175px;max-width:375px;border:2px solid var(--secondary-color)}.listOptionContainer{display:flex;align-items:center;border-bottom:1px solid var(--secondary-color)}.todoGroupMenuOption,.todoGroupMenuOption:target,.listMenuOption,.listMenuOption:target{background-color:transparent;border:none;outline:none;margin:0;padding:0}.todoGroupMenuOption:hover{border-bottom:1px solid var(--accent-color);padding-bottom:-1px;border-radius:0}.listMenuOption{font-size:2.5rem;font-weight:700;justify-self:end;flex-grow:1;letter-spacing:.1rem;min-height:3rem}.listEdit{writing-mode:vertical-rl;text-orientation:upright;letter-spacing:-.8rem;text-indent:-1.2rem;height:1.8rem;font-size:1.2rem}.todoGroupMenuOption:hover,.listMenuOption:hover,.listEdit:hover{color:var(--secondary-color);cursor:pointer}.todoContainer{display:flex;flex-wrap:wrap-reverse;flex-direction:column-reverse;justify-content:space-between;align-items:center;width:90%;margin-top:1.7rem;padding:1rem 1rem .5rem;border-radius:10px;background-color:var(--primary-color);cursor:pointer}.todoContainer:nth-of-type(2){margin-top:2rem}.todoContainer:hover{filter:brightness(120%)}.todoBottom{display:flex;justify-content:space-between;width:100%;align-items:center;padding-left:10px}.todoLeft{display:flex;justify-content:space-between;gap:.5rem;font-family:monospace}.todoRight{display:flex;justify-content:space-around;width:80px}.day{font-size:1rem;margin:0;padding:0}.picker{width:120px;color:#fff;font-size:1rem;background-color:transparent;border:none;cursor:pointer}.todoTitle{margin:0;font-size:1rem;text-align:right;color:#fff;font-weight:700;letter-spacing:1px}.todoDetail{font-weight:700;color:#fff;font-family:Verdana,Geneva,Tahoma,sans-serif;margin:1rem}.urgent{border-left:6px solid var(--accent-color);border-radius:6px}.complete{background-color:var(--todo-complete)}.strikethrough{font-weight:400;letter-spacing:normal;text-decoration:line-through}.edit,.delete{width:30px}.edit:hover,.delete:hover,.deleteList:hover{filter:invert(100%)}.deleteList{width:fit-content;margin-right:10px;font-size:1.5rem;text-align:center;justify-self:start}.editForm{min-width:300px;display:flex;flex-direction:column;gap:10px;justify-content:center;align-items:center}.editForm>input{max-width:90%;border-radius:4px;border:none;padding-left:10px}.editForm>label{font-size:1.2rem}.editTitle{height:30px;width:70%;font-size:1.2rem}.editDescription{min-width:80%;max-width:80%;min-height:80px;max-height:200px;border-radius:4px;padding:4px}.editDueDate{width:120px;color:#fff;font-family:monospace;border:none;font-size:1rem;padding:4px 10px;border-radius:4px;cursor:pointer}.editUrgent,.editComplete{height:25px;width:25px}.buttonContainer{display:flex;margin-top:20px;gap:20px;justify-content:space-around}.buttonContainer>button{padding:.6em 1.2em;font-size:1.2rem}.addBtn{position:relative;background-color:var(--accent-color);border-radius:50%;border:2px solid var(--accent-color);height:50px;width:50px;padding:0;margin:1rem 0}.addBtn:before,.addBtn:after{content:"";background-color:#fff;position:absolute;display:block}.addBtn:before{top:20px;bottom:20px;left:6px;right:6px}.addBtn:after{top:6px;bottom:6px;left:20px;right:20px}.listMenu>.addBtn{margin:.5rem}.overlay{position:fixed;top:0;left:0;display:grid;place-items:center;height:100vh;width:100vw;z-index:2;background-color:#000;filter:opacity(50%)}.modal{position:fixed;display:flex;flex-direction:column;justify-content:center;align-items:center;height:fit-content;width:fit-content;min-width:250px;min-height:100px;max-width:min(680px,80%);border:2px solid white;border-radius:10px;padding:20px;top:50%;left:50%;transform:translate(-50%,-50%);background-color:var(--primary-color);z-index:3}.modalContent{z-index:4}.confirm{display:flex;flex-direction:column;justify-content:center;width:fit-content;height:fit-content;margin-top:1.8rem;align-items:center;filter:opacity(100%)}.confirmMessage{font-weight:400;width:80%;margin:0;padding:0}.confirmItem{color:#000}.listForm{position:relative;display:flex;align-items:center;padding-top:1rem;min-height:150px;width:fit-content;max-width:80%;height:fit-content;flex-direction:column}.listForm>input{height:1.5rem;max-width:90%;font-size:1.5rem}.listForm>label{font-size:1.5rem}.listForm>button,.usernameForm>button{max-width:80%;font-size:1.5rem;padding:10px 15px}#newListTitle{margin-bottom:1rem}.close{position:absolute;top:8px;right:8px;aspect-ratio:1;width:fit-content!important;height:fit-content;border-radius:5px;font-size:2rem;padding:0 .5rem;text-align:center}.close:hover{filter:invert(100%)}.buttonContainer>button:hover,.listForm>button:hover,.editForm>button:hover,.usernameForm>button:hover{filter:invert(100%)}@media (prefers-color-scheme: light){body{color:#213547;background-color:var(--background-color-light)}a:hover{color:#747bff}.editDueDate{color:#000}button{background-color:#f9f9f9;color:#000}.addBtn{color:#fff}.listTitle{border-bottom:2px solid var(--secondary-color-light)}.listTitle:hover,.todoGroup:hover{color:var(--secondary-color-light)}.todoGroup{border-bottom:2px solid var(--secondary-color-light)}}