*{margin:0;padding:0}html{font-family:Segoe UI,Tahoma,Geneva,Verdana,sans-serif;font-size:16pt;color:var(--text-color)}body{min-height:100vh;padding:10px;background-color:var(--background);display:flex;flex-direction:column;align-items:center}.wrapper{width:700px;max-width:100%;display:flex;flex-direction:column;gap:10px}#login-register{display:none;flex-direction:column;gap:10px;margin-bottom:20px}#username-input,#password-input{box-sizing:border-box;padding:12px 20px;width:100%;background:none;border:2px solid var(--secondary-color);border-radius:1000px;font:inherit;color:var(--text-color)}#username-input::placeholder,#password-input::placeholder{color:var(--secondary-color)}#username-input:focus,#password-input:focus{outline:none}#login-button,#register-button{background-color:var(--accent-color);padding:15px;border:none;border-radius:1000px;font:inherit;font-weight:600;color:var(--background);cursor:pointer}#login-button:hover,#register-button:hover{background-color:var(--accent-color-dark)}#logout-button{background-color:var(--accent-color);padding:15px;border:none;border-radius:1000px;font:inherit;font-weight:600;color:var(--background);cursor:pointer}#logout-button:hover{background-color:var(--accent-color-dark)}#todo-form{display:grid}#todo-input{box-sizing:border-box;padding:12px 20px;width:100%;background:none;border:2px solid var(--secondary-color);border-radius:1000px;font:inherit;color:var(--text-color);caret-color:var(--accent-color)}form{position:relative}#add-button{position:absolute;top:0;right:0;background-color:var(--accent-color);height:100%;padding:0 30px;border:none;border-radius:1000px;font:inherit;font-weight:600;color:var(--background);cursor:pointer;transition:color .2s ease-in-out,background-color .2s ease-in-out}.todo .todo-text{padding:15px 0 15px 15px;flex-grow:1;transition:200mx ease;cursor:pointer}@media (max-width: 500px){html{font-size:12pt}#add-button{position:unset;width:100%;margin-top:10px;padding:15px;height:auto}h1{margin-top:50px;font-size:15vw}}:root{--background: #101114;--primary-color: #1c1d20;--secondary-color: #4a4d57;--accent-color: #00ff22;--accent-color-dark: #00670e;--text-color: #f9f9f9;--edit-color: #97989d;--edit-color-dark: #6e6e73;--error-color: #bb0808;--error-color-dark: #8a0606}html{font-family:Segoe UI,Tahoma,Geneva,Verdana,sans-serif;font-size:16pt;color:var(--text-color);height:100%}.container{height:90vh;min-height:100%;height:auto!important;margin-bottom:-50px;display:flex;flex-direction:column;align-items:center}.container:after{content:"";display:block;height:50px}.footer{height:50px;color:var(--secondary-color);text-align:center;font-size:.6rem}*{margin:0;padding:0;box-sizing:border-box}:root{--background: #101114;--primary-color: #1c1d20;--secondary-color: #4a4d57;--accent-color: #00ff22;--accent-color-dark: #00670e;--text-color: #f9f9f9}.header{display:flex;justify-content:space-between;align-items:center;padding:0;margin:0;width:100vw}.siteName{font-size:1.75rem;font-weight:700;color:var(--accent-color);padding-left:20px;padding-top:10px;text-decoration:none}.navLinks{display:flex;gap:20px;font-size:1rem;font-weight:700;color:var(--accent-color)}.navLinks li{list-style:none}.userInfo{display:flex;align-items:center;gap:10px;color:var(--text-color);transition:color .2s ease-in-out}.userInfo:hover{color:var(--accent-color);cursor:pointer}.userInfo svg{width:40px;height:40px;stroke:var(--accent-color);transition:stroke .2s ease-in-out}.userInfo:hover svg{stroke:var(--accent-color-dark)}.userWelcome{padding-right:20px;cursor:pointer;position:relative}.userAccountMenu{position:absolute;right:0;top:calc(100% + 8px);background:var(--background);border:1px solid rgba(0,0,0,.08);padding:8px 0;min-width:140px;border-radius:6px;box-shadow:0 6px 18px #00000014;z-index:50;text-align:right}.accountOption{padding:8px 14px;cursor:pointer;color:var(--accent-color);display:block;transition:color .2s ease-in-out;text-decoration:none}.accountOption:hover{color:var(--accent-color-dark)}.accountLink{padding:0;cursor:pointer;color:var(--accent-color);display:block;transition:color .2s ease-in-out;text-decoration:none}.accountLink:hover{color:var(--accent-color-dark)}.accountOptionUser{padding:8px 14px;cursor:default;color:var(--text-color);display:block}body{height:100vh;padding:10px;background-color:var(--background);display:flex;flex-direction:column;align-items:center}h1{margin-top:100px;margin-bottom:20px;font-size:3rem;font-weight:800;text-align:center;color:var(--accent-color)}.wrapper{width:100svw;max-width:700px;margin-left:auto;margin-right:auto;display:flex;flex-direction:column;align-items:center;gap:10px}#todo-form{display:grid;width:100%;max-width:700px;margin-left:auto;margin-right:auto;padding:0 25px}#todo-input{box-sizing:border-box;padding:12px 125px 12px 20px;width:100%;background:none;border:2px solid var(--secondary-color);border-radius:1000px;font:inherit;color:var(--text-color);caret-color:var(--accent-color)}@media screen and (max-width: 600px){#todo-input{padding:12px 20px}}#todo-input::placeholder{color:var(--secondary-color)}#todo-input:focus{outline:none}#add-button{position:absolute;top:0;right:25px;background-color:var(--accent-color);height:100%;padding:0 30px;border:none;border-radius:1000px;font:inherit;font-weight:600;color:var(--background);cursor:pointer;transition:color .2s ease-in-out,background-color .2s ease-in-out}#add-button:hover{color:var(--text-color);background-color:var(--accent-color-dark)}#todo-list{width:100%;max-width:700px;margin-left:auto;margin-right:auto;padding:15px 25px;display:flex;flex-direction:column;gap:10px}.todo{margin-bottom:10px;padding:0 16px;background-color:var(--primary-color);border-radius:15px;display:flex;align-items:center}.todo .todo-text{padding:15px 0 15px 15px;flex-grow:1;transition:.2s ease;cursor:pointer}.delete-button,.edit-button{padding:3px;background:none;border:none;display:flex;justify-content:center;align-items:center;cursor:pointer}.delete-button svg,.edit-button svg{transition:.2s ease}.delete-button:hover svg{fill:#f03}.edit-button:hover svg{fill:var(--accent-color)}.custom-checkbox{border:2px solid var(--accent-color);border-radius:50%;min-height:20px;min-width:20px;display:flex;justify-content:center;align-items:center;flex-shrink:0;transition:.2s ease;cursor:pointer}input[type=checkbox]:checked~.custom-checkbox{background-color:var(--accent-color)}input[type=checkbox]:checked~.custom-checkbox svg{fill:var(--primary-color)}input[type=checkbox]:checked~.todo-text{text-decoration:line-through;color:var(--secondary-color)}input[type=checkbox]{display:none}@media (max-width: 550px){html{font-size:12pt}#add-button{position:unset;width:100%;margin-top:10px;padding:15px;height:auto}h1{margin-top:50px;font-size:15vw}}.logbase-upload-box{padding:20px;text-align:center;cursor:pointer;margin-bottom:20px;border-radius:8px}input,button,select,textarea{font:inherit}.logForm{display:grid;gap:15px}.logbase-upload-box .preview{margin-top:10px;max-width:500px;max-height:500px;object-fit:cover;border-radius:8px}.form-group{display:flex;flex-direction:column;align-items:flex-start}.form-group label{margin-bottom:5px;font-weight:700}.form-group input{width:100%;padding:8px;border:2px solid var(--secondary-color);border-radius:4px;background-color:var(--primary-color);color:var(--text-color)}.logbase-upload-box button{margin-top:10px;padding:8px 16px;font-size:.85rem;font-weight:700;background-color:var(--accent-color);color:var(--background);border:none;border-radius:4px;cursor:pointer}.logbase-upload-box button:hover{background-color:var(--accent-color-dark)}input{background:var(--primary-color);color:var(--text-color);border:2px solid var(--secondary-color);border-radius:16px;padding:1ex 2ex}.LoggedItem{background:var(--primary-color);border:2px solid var(--secondary-color);border-radius:16px;padding:20px;margin-bottom:20px;display:grid;gap:10px}.LoggedItemImage{max-width:400px;max-height:400px;object-fit:cover;border-radius:8px;margin-left:auto;margin-right:auto}.LoggedItemAtr{display:flex;gap:5px;font-size:.85rem}.LoggedItemAtr strong{color:var(--accent-color)}.LoggedItemButton{margin-right:10px;padding:8px 16px;font-size:.85rem;font-weight:700;color:var(--background);border:none;border-radius:4px;cursor:pointer}.edit-btn{background-color:var(--edit-color)}.edit-btn:hover{background-color:var(--edit-color-dark)}.delete-btn{background-color:var(--error-color)}.delete-btn:hover{background-color:var(--error-color-dark)}.home{text-align:center;padding:50px;text-wrap:balance}.loginRegisterLinks{margin:30px 20px;display:flex;flex-direction:column;gap:25px}.button{display:inline-block;padding:10px 20px;background-color:var(--accent-color);color:var(--primary-color);text-decoration:none;border-radius:5px;font-weight:700;transition:background-color .2s ease-in-out;text-align:center}.button:hover{background-color:var(--accent-color-dark)}.container{max-width:400px;margin:0 auto;padding:20px;background-color:var(--background);border-radius:10px;box-shadow:0 4px 8px #0000001a}.login-register{display:flex;flex-direction:column;gap:10px;margin-bottom:20px}.username-input,.password-input{box-sizing:border-box;padding:12px 20px;width:100%;background:none;border:2px solid var(--secondary-color);border-radius:1000px;font:inherit;color:var(--text-color)}.username-input::placeholder,.password-input::placeholder{color:var(--secondary-color)}.username-input:focus,.password-input:focus{outline:none}.login-button,.register-button{background-color:var(--accent-color);padding:15px;border:none;border-radius:1000px;font:inherit;font-weight:600;color:var(--background);cursor:pointer}.login-button:hover,.register-button:hover{background-color:var(--accent-color-dark)}.logout-button{background-color:var(--accent-color);padding:15px;border:none;border-radius:1000px;font:inherit;font-weight:600;color:var(--background);cursor:pointer}.logout-button:hover{background-color:var(--accent-color-dark)}.Link{color:var(--accent-color);text-decoration:none}.Link:hover{color:var(--accent-color-dark);text-decoration:underline}