.form-appear{animation:formIn .4s cubic-bezier(.175,.885,.32,1.275) forwards!important}.form-gone{animation:formOut .01s cubic-bezier(.175,.885,.32,1.275)!important;pointer-events:none}@keyframes formIn{0%{transform:translateY(10px)}to{transform:translateY(0)}}@keyframes formOut{}html{height:fit-content;width:97vw;margin:0;display:flex;flex-direction:column;color:var(--text-normalColor);background-color:var(--main-color)}.alert{z-index:2000}#navbar{text-align:center;overflow-x:hidden;z-index:300px;border-radius:2px;position:fixed;border:.5pt solid var(--main-color);border-style:none;-webkit-user-select:none;user-select:none;-webkit-backdrop-filter:blur(3.5px);backdrop-filter:blur(3.5px);top:0;width:97vw;margin-left:.1px;justify-self:center;padding:2px 15px;overflow-y:visible;box-sizing:content-box;z-index:320}#show-as{justify-self:flex-end;box-shadow:none;margin-top:200px;font-size:1.1rem;margin-right:1rem;background-color:transparent;text-align:center;vertical-align:middle;cursor:pointer;width:fit-content;position:fixed;right:0;top:-184px;z-index:900;padding:5px 4px 4px;border-radius:50%}#show-as:hover{box-shadow:0 0 2px var(--color-ocean) inset;scale:1.01}#show-as ul{border:1pt solid var(--color-sky-white);width:fit-content;position:fixed;right:14px;top:16px;z-index:900px;background-color:transparent;-webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px);box-shadow:0 0 4px var(--main-color);display:none}#show-as ul li:nth-of-type(1) .modeBtn{background-color:var(--color-ocean-secondary);color:var(--text-normalColor)}#show-as ul li{text-align:start;list-style:none;display:flex;padding:4px;flex-direction:row;box-sizing:border-box;justify-content:center;border-radius:12px;animation-name:formAnim;animation-duration:.4s;animation-timing-function:ease-in;animation-iteration-count:1;background-color:transparent}li .icon{box-sizing:border-box;border:none}@keyframes iconAnim{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.icon:hover{animation-name:iconAnim;animation-duration:1s;animation-iteration-count:1;animation-timing-function:ease-in}#app-name{font-size:2.7rem;padding:0;text-align:center;color:var(--appNameColor);background:linear-gradient(45deg,rgb(70,70,255) 10%,var(--color-ocean),var(--color-sky));background-clip:border-box;-webkit-background-clip:text;-webkit-text-fill-color:transparent}#app-det{margin-top:-2px;border-radius:0;font-size:.5rem;padding-block:2px;color:var(--appDet);display:block}.note-title{font-size:small;display:inline-block;text-align:center;background-color:transparent;max-height:98px;overflow:hidden;margin-bottom:18px;font-family:Verdana,Geneva,Tahoma,sans-serif;font-weight:lighter;border-radius:0}.due-date,.created-date{font-size:xx-small;font-style:normal;text-align:start;background-color:transparent}.note .checkbox-container{align-self:start;display:flex;background-color:transparent;font-size:x-small;text-align:center}.note .checkbox-container input{background-color:#0ff;text-align:center;cursor:pointer}.note{padding-inline:8px;display:flex;flex-direction:column;margin:8px;max-height:80vh;overflow:hidden;min-height:240px;box-sizing:border-box;line-break:strict;max-width:200px;-webkit-backdrop-filter:blur(2.5);backdrop-filter:blur(2.5);align-items:safe;justify-content:center;border-radius:4px;padding-bottom:12px}.note-desc{padding:8px;font-size:x-small;overflow:hidden;background-color:transparent}.created-date span{background:#c5fdd1cc;border-radius:89px;padding-inline-end:14px;padding-inline-start:7px;margin-left:8px}.due-date span{background:#fac9a8d0;padding-inline-start:7px;border-radius:89px;padding-inline-end:14px;margin-left:8px}.note-wrapper:hover{border:1px solid black;box-shadow:0 0 4px 0 var(--appDet)}footer{display:flex;justify-content:center;margin-top:24px;position:absolute;bottom:-40px;left:0;right:0;justify-self:center}input{background-color:var(--main-color);color:var(--appNameColor);height:fit-content}#form-container,#editor{background:transparent;text-align:start!important;-webkit-backdrop-filter:blur(100.5px);backdrop-filter:blur(100.5px);width:fit-content;height:fit-content;border-radius:8px;position:fixed;bottom:4px;box-shadow:0 0 1px #2e2e2e!important;margin:8px;border:1px solid var(--border);right:2px;z-index:1000;animation-name:formAnim;animation-duration:.2s;animation-timing-function:ease-in-out;animation-iteration-count:1;box-sizing:border-box;padding:20px;overflow:auto}#editor{animation:none}#form-container form,#editor form{display:flex;flex-direction:column;box-sizing:border-box;justify-content:center;text-align:start;align-items:center;margin-bottom:40px}#form-container form label{width:90%}form input,form textarea{height:fit-content;width:fit-content;min-width:100%;min-height:52px;text-align:start;border:1px;border-radius:4px;padding:8px;margin:4px}form textarea:nth-of-type(1){text-align:start;min-height:100px}form input,textarea{outline:1px var(--appDet) solid;background-color:transparent}form button{width:90%;box-sizing:border-box;padding:8px;background-color:var(--color-sky);border-color:var(--color-sky);border:none;margin-block:12px}form button:hover{opacity:.9;cursor:pointer}.form-actions{width:min-content}.page-title{position:relative;background-color:transparent;font-family:Verdana,Geneva,Tahoma,sans-serif;text-align:start;padding:12px;color:var(--text-normalColor);display:block;margin:0;font-style:normal;font-size:1.8rem}.dropdown-btn{border:1px solid grey;background-image:url("data:image/svg+xml,%3c?xml%20version='1.0'%20encoding='utf-8'?%3e%3c!--%20Uploaded%20to:%20SVG%20Repo,%20www.svgrepo.com,%20Generator:%20SVG%20Repo%20Mixer%20Tools%20--%3e%3csvg%20width='2px'%20height='2px'%20viewBox='0%200%2024%2024'%20id='_24x24_On_Light_Dots'%20data-name='24x24/On%20Light/Dots'%20xmlns='http://www.w3.org/2000/svg'%3e%3crect%20id='view-box'%20width='24'%20height='24'%20fill='%23d1981ddb'%20opacity='0'%20/%3e%3cpath%20id='Shape'%20d='M12,1.5A1.5,1.5,0,1,1,13.5,3,1.5,1.5,0,0,1,12,1.5Zm-6,0A1.5,1.5,0,1,1,7.5,3,1.5,1.5,0,0,1,6,1.5Zm-6,0A1.5,1.5,0,1,1,1.5,3,1.5,1.5,0,0,1,0,1.5Z'%20transform='translate(4.5%2011)'%20fill='%23d1981ddb'%20/%3e%3c/svg%3e");background-size:cover;position:relative;top:25px;left:4px;z-index:10;height:20px;width:20px}form input,form textarea{min-width:90%}.dropdown-btn:hover{background-image:url(./src/assets/close.svg);border:1px solid transparent}.dropdown{border:1pt solid grey;width:fit-content;padding:10px 4px;visibility:collapse;background-color:var(--main-color);-webkit-backdrop-filter:blur(106.5);backdrop-filter:blur(106.5);box-shadow:0 0 4px gray}.dropdown li{min-width:150px;padding:4px 4px 4px 12px;border-radius:20px;list-style:none;border-radius:var(--radius-curve);vertical-align:middle;cursor:pointer}.dropdown li span{vertical-align:middle}.dropdown li span img{height:25px;vertical-align:middle;padding-bottom:5px;padding-right:4px}.dropdown li:hover{background-color:var(--color-ocean);color:#fff}.dropdown-btn:hover>.dropdown{visibility:visible}#feedback-res{background-color:#c30000;vertical-align:middle;text-align:center;padding:20px;border-radius:2px;position:fixed;bottom:20px;left:12px;display:inline-block;z-index:200;visibility:collapse;font-style:normal;font-weight:400;color:#fff;box-sizing:border-box}#feedback-res span img{margin-bottom:4px;vertical-align:middle}.close-btn{position:absolute;right:15px;top:15px;cursor:pointer;font-size:1.8rem;background:transparent;color:var(--appNameColor);width:20px;height:20px;display:flex;padding:14px;align-items:center;justify-content:center;border-radius:50%;transition:all .3s ease}.close-btn:hover{background:#b30404;color:#fff;transform:rotate(90deg) scale(1.1)}.notes-wrapper{display:flex;flex-wrap:wrap;justify-content:center;flex-basis:content;flex-flow:wrap;flex-shrink:inherit}.homepage{margin-top:70px;margin-inline:0}.readme{padding:20px 20px 20px 62px;margin-top:-119px;border-radius:2px;width:100vw}.readme hr{margin-block:10px}.readme h2{margin:2px}.developer{display:flex;flex-direction:row;font-size:small!important;color:#5f5f5f}.developer img{height:25px;padding-bottom:4px}.developer span a{text-decoration:none;color:inherit}.developer span a:hover{color:var(--color-sky)}.external{visibility:hidden;vertical-align:middle}.developer span a:hover>.external{visibility:visible;color:#5f5f5f}.divider{margin-inline:8px}@media screen and (max-width:500px){#app-name{font-size:1.8rem}form button{margin-left:-.5rem}#form-container{justify-content:center;display:flex;flex-direction:column;justify-self:center;align-self:center;top:128px;left:0;right:0;width:90vw;box-sizing:border-box}#navbar{padding-top:9px;width:100vw;margin:0 0 0 8px;justify-self:center}}*{border-radius:8px;box-sizing:border-box;max-width:98vw;font-family:system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,Open Sans,Helvetica Neue,sans-serif;margin:0;padding:0}@keyframes modeAnim{0%{transform:rotate(0);border-radius:50%}to{transform:rotate(360deg);border-radius:50%}}#mode{background-color:transparent;position:fixed;bottom:12px;left:8px;width:fit-content;padding:4px 2px 2px;border-radius:40px;cursor:pointer;filter:brightness(1.05);border:1px solid var(--color-sky-secondary)}#mode:hover{box-shadow:0 0 4px 1px #000000a2}#add-note{position:fixed;bottom:36px;right:12px;-webkit-user-select:none;user-select:none;height:60px;width:fit-content;padding:16px;box-sizing:border-box;display:flex;justify-content:center;font-weight:600;font-family:Lucida Sans,Lucida Sans Regular,Lucida Grande,Lucida Sans Unicode,Geneva,Verdana,sans-serif;align-items:center;text-align:center;background:linear-gradient(40deg,var(--color-ocean) 10%,var(--color-sky) 90%);border-radius:14px;-webkit-backdrop-filter:blur(120.5);backdrop-filter:blur(120.5);z-index:999}#add-note i{margin-right:6px;margin-top:2px}#add-note:hover{background-color:var(--color-ocean-secondary);scale:1.05;cursor:pointer;box-shadow:0 0 4px 1px #000000a2}#add-note span{margin-right:2px;margin-left:2px;text-align:center}#add-note img{margin-right:12px}.card-body,#user-title,.card-text{background-color:transparent}.empty-state-container{display:flex;justify-content:center;align-items:center;padding:20px;position:relative;top:200px}.empty-card{background-color:var(--main-color);border-radius:12px;max-width:480px;width:100%;color:var(--text-normalColor);border:1px solid var(--color-sky-white);overflow:hidden}.empty-card-content{padding:24px;text-align:center}.empty-card-title{margin:0 0 12px;font-size:1.5rem}.empty-card-text{color:#666;margin-bottom:20px;line-height:1.5}.btn-add-note{background-color:#007bff;color:#fff;border:none;margin-right:112px;width:fit-content;border-radius:6px;font-size:1rem;cursor:pointer;display:none;transition:background-color .2s ease}.btn-add-note:hover{background-color:#0056b3}.edit{position:relative}:root{--card-background-color: #f3f1f1;--card-heading: #222;--card-desc: #020202;--card-dueCreate: rgb(10, 9, 9);--label-footer: rgb(0, 0, 0);--id: #4a4a4a;--border: #bababa;--radius-normal: 16px;--radius-curve: 20px;--main-color: #03ffdd;--appNameColor: black;--appDet: #909193;--text-normalColor: black;--main-color-secondary: #06ffb8;--color-ocean: #3b9aff;--color-ocean-secondary: #468faf;--date-border: 1px solid var(--border);--color-sky: #61a5c2;--color-sky-secondary: #89c2d9;--color-sky-white: #a9d6e5;--color-sky-white-secondary: #caf0f8;--color-light: #f9f9f9;--color-single-note-bg: #ffffff;--info-container-bg: #b0b0b03b}[data-theme=dark]{--date-border: none;--card-background-color: #1a1b1c62;--card-heading: #ffffff;--card-desc: #e9e9e9;--card-dueCreate: rgb(189, 185, 185);--label-footer: rgb(122, 117, 117);--id: #757364;--border: rgb(35, 35, 35);--main-color: #121212;--main-color-secondary: #1e1e1e;--color-single-note-bg: #252525;--color-light: #181818;--appNameColor: #ffffff;--text-normalColor: #e0e0e0;--appDet: #a0a0a0;--color-ocean: #4dabff;--color-ocean-secondary: #52b1d6;--color-sky: #3d5afe;--color-sky-secondary: #2c3e50;--color-sky-white: #2a2d2e;--color-sky-white-secondary: #323739;--info-container-bg: rgba(255, 255, 255, .1)}.note-card{width:320px;padding:16px 16px 42px;margin:12px;position:relative!important;border-radius:4px;height:fit-content;box-shadow:0 8px 20px #00000014;border:1px solid var(--border);font-family:system-ui,sans-serif;background-color:var(--main-color-secondary)}.note-header{display:flex;flex-direction:row;justify-content:space-between;align-items:center;margin-bottom:8px}.note-title{font-size:1.1rem;font-weight:600;color:var(--card-heading);margin:0}span{font-size:small}.note-id{font-size:xx-small;color:var(--id)}.note-desc{font-size:.95rem;color:var(--card-desc);line-height:1.4;margin:10px 0 14px}.label{font-weight:400;margin-right:4px;color:var(--color-ocean)}.menu:hover{cursor:pointer}.menu:active{background-color:var(--color-ocean-secondary);color:var(--main-color);padding:1px;border-radius:4px}.show{height:fit-content;width:fit-content;right:32px;display:flex;z-index:200;position:absolute;box-sizing:border-box;padding:1px;flex-direction:column;border:1px solid var(--border);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);animation-name:formAnim;animation-duration:.1s;animation-timing-function:ease-in;animation-iteration-count:1;border-radius:12px}.show:hover{box-shadow:0 0 2px var(--color-sky-white)}.hide{display:none}.menu-item{background-color:transparent;-webkit-backdrop-filter:blur(100px);backdrop-filter:blur(100px);padding-inline-start:1px;padding-inline-end:60px;padding-block:8px;margin-inline:0px 1px;box-sizing:border-box;display:inline-block;border:none;font-size:14px;text-align:left;color:var(--text-normalColor);border-radius:inherit;cursor:pointer}.menu-item:hover{background-color:var(--color-ocean);border-radius:12px}.menu-item:focus{background-color:green}.danger:hover{background-color:red}.check-done{height:15px;width:15px;will-change:var(--text-normalColor)}.note-card details{position:absolute;cursor:pointer;left:12px;border-radius:inherit}details summary{color:var(--color-ocean);list-style:none;background-color:var(--main-color);border:var(--date-border);padding:4px 12px 4px 4px}.note-card details .note-footer{background-color:var(--main-color);z-index:500;width:fit-content;min-width:140px;border:1px solid var(--border);position:absolute;top:32px;left:50px;padding:8px}.detailsTouched{background:var(--color-sky-secondary);color:#fff}.none{display:none}.editor-form-container{position:absolute;top:-10px;z-index:120px;background-color:var(--main-color);-webkit-backdrop-filter:blur(120px);backdrop-filter:blur(120px);width:fit-content;border-radius:12px;box-shadow:0 0 2px #2e2e2e;color:var(--text-normalColor);padding:10px;box-sizing:border-box;animation:formAnim .2s ease-in-out;font-family:system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,Open Sans,Helvetica Neue,sans-serif}@keyframes formAnim{0%{transform:translateY(-16px);opacity:0}to{transform:translateY(0);opacity:1}}.editor-close-btn{position:absolute;right:15px;top:15px;cursor:pointer;font-size:1.8rem;color:red;width:30px;height:30px;display:flex;padding:14px;align-items:center;text-align:center;justify-content:center;border-radius:50%;border:none;transition:all .3s ease}.editor-close-btn:hover{color:red;scale:1.2}.editor-title{font-size:1.2rem;color:var(--text-normalColor);margin-bottom:4px;text-align:start;padding-left:2px}.editor-form{display:flex;flex-direction:column;gap:16px;margin-bottom:20px}.editor-field-group{display:flex;flex-direction:column;gap:8px}.editor-label{font-size:14px;font-weight:600;color:var(--text-normalColor);padding-left:2px}.editor-input{min-width:90%;min-height:52px;padding:4px;font-size:small;border:1px solid #909193;border-radius:4px;background-color:var(--main-color-secondary);color:var(--text-normalColor);font-family:inherit;margin:0}.editor-input:focus{outline:2px solid #3b9aff;border-color:#3b9aff}.editor-textarea{min-width:90%;min-height:10px;padding:4px;font-size:small;outline:0;border-radius:4px;background-color:var(--main-color-secondary);color:var(--text-normalColor);resize:vertical;font-family:inherit;margin:0}.editor-textarea:focus{outline:1px solid #3b9aff;border-color:#3b9aff}.editor-button-container{display:flex;gap:12px;margin-top:16px;width:fit-content}.editor-submit-btn{text-align:center;background-color:#3b9aff;border:1px solid #468faf;cursor:pointer;color:wheat;border-radius:8px;padding:8px 4px;min-height:5px;font-size:16px;font-weight:600;transition:opacity .2s;font-family:inherit;min-width:150px}.editor-submit-btn:hover{opacity:.9}.editor-submit-btn-disabled{opacity:.6;cursor:not-allowed}.editor-cancel-btn{text-align:center;background-color:transparent;border:1px solid #61a5c2;cursor:pointer;color:var(--text-normalColor);border-radius:8px;padding:2px 4px;min-height:52px;font-size:16px;font-weight:600;transition:all .2s;font-family:inherit;min-width:100px}.editor-cancel-btn:hover{background-color:#61a5c2;color:#fff}.open-right{left:100%}.open-left{right:100%}@media screen and (max-width:500px){.open-right,.open-left{left:-100%;top:300%}.editor-form-container{padding:20px;max-width:100vw;margin:4px}.editor-button-container{flex-direction:column;width:100%}.editor-submit-btn,.editor-cancel-btn{width:100%}}.form-error{color:#d32f2f;font-size:.85rem;margin-top:4px;font-weight:500;letter-spacing:.3px;max-width:99vw}:root{--background-color: #fcebeb}[data-theme=dark]{--background-color: #000000}.card{background-color:var(--background-color);border-radius:8px;padding:16px;margin:16px 12px 16px 32px;max-width:90vw;height:fit-content;line-break:anywhere;line-gap-override:12%;overflow-x:hidden}.title{color:#c00;margin-bottom:10px}.message{color:#b19e9e;font-size:14px;margin-bottom:6px}.item{color:#8c0e0e;font-size:13px;margin-bottom:4px}.item strong{color:#00c3ff}.card-dark{background-color:#1b0f0f}:root{--radius-normal: 16px;--radius-curve: 20px;--main-color: #ffffff;--appNameColor: black;--appDet: #909193;--text-normalColor: black;--main-color-secondary: #fdfdfd;--color-ocean: #3b9aff;--color-ocean-secondary: #468faf;--color-sky: #61a5c2;--color-sky-secondary: #89c2d9;--color-sky-white: #a9d6e5;--color-sky-white-secondary: #caf0f8;--color-light: #f9f9f9;--color-single-note-bg: #ffffff;--info-container-bg: #b0b0b03b}[data-theme=dark]{--main-color: #121212;--main-color-secondary: #1e1e1e;--color-single-note-bg: #252525;--color-light: #181818;--appNameColor: #ffffff;--text-normalColor: #e0e0e0;--appDet: #a0a0a0;--color-ocean: #4dabff;--color-ocean-secondary: #52b1d6;--color-sky: #3d5afe;--color-sky-secondary: #2c3e50;--color-sky-white: #2a2d2e;--color-sky-white-secondary: #323739;--info-container-bg: rgba(255, 255, 255, .1)}.splash-container{background-color:var(--main-color);display:flex;align-items:center;flex-direction:column;border-radius:2px;justify-self:center;position:fixed;inset:50%}.splash-text{color:gray;font-family:Verdana,Geneva,Tahoma,sans-serif;font-size:x-small;margin-top:-10px}.dot{display:none}.dark{background-color:#161616}.loaderIcon{cursor:progress}