#root{min-height:100dvh;font-size:100%;position:relative}body{margin:0}button{padding:0;border:none;box-sizing:content-box}h1{font-size:2em}h2{font-size:1.75em}h3{font-size:1.5em}h4{font-size:1.25em}h5{font-size:1em}h6{font-size:.8em}@property --accentColor{syntax: "<color>"; initial-value: #0886ff; inherits: false;}@property --accentBlendColor{syntax: "<color>"; initial-value: #bfe0ff; inherits: false;}.lightTheme{--primaryColor: #e3e3e3;--secondaryColor: #d0d0d0;--containerHighColor: #3c3c3c;--containerColor: #b9b9b9;--containerLowColor: #a0a0a0;--inverseColor: black;--imageTint: invert(1)}.darkTheme{--primaryColor: black;--secondaryColor: #161616;--containerHighColor: #dcdcdc;--containerColor: #242424;--containerLowColor: #353535;--inverseColor: #e3e3e3;--imageTint: invert(0)}.fixedElementFullScreen{position:fixed;top:0;left:0;width:100dvw;height:100dvh}.themedText{font-family:system-ui;font-weight:400;margin:0;padding:0;overflow-wrap:break-word;overflow:hidden;color:var(--inverseColor)}.bold{font-weight:700}.white{color:#f0f0f0}.black{color:#000}.themedButton{display:flex;justify-content:center;align-items:center;padding:.5rem 1rem;width:fit-content;border:none;border-radius:1rem}.themedButton>p{margin:0;padding:0;font-family:system-ui;font-size:1em;font-weight:700}.themedButton.base.primary{background:var(--accentColor)}.themedButton.base.primary>p{color:#fff}.themedButton.base.accent{background:var(--accentBlendColor)}.themedButton.base.accent>p{color:var(--accentColor)}.themedButton.delete.primary{background:#ff0808}.themedButton.delete.primary>p{color:#fff}.themedButton.delete.accent{background:#ffbfbf}.themedButton.delete.accent>p{color:red}.themedTextArea{padding:.5rem;width:calc(100% - 1rem);background:none;border:none;font-weight:700;font-size:1em;overflow-wrap:break-word;word-wrap:break-word;resize:none;overflow:hidden}.themedTextArea:focus-visible{outline:none}.clickable:not(:disabled){cursor:pointer;transition:scale .25s ease}.clickable:hover:not(.active):not(:disabled){scale:.95}.closeButton{margin:.25rem;width:1.5rem;height:1.5rem}.transparentInput{padding:.5rem;font-size:1.5em;border:none;background:none}.transparentInput:focus-visible{outline:none}.themedInput{padding:.75rem 1.5rem;width:calc(100% - 3rem);border:none;border-radius:1rem;background:var(--containerLowColor);color:var(--inverseColor);font-size:1em;transition:all .25s ease}.themedInput:focus-visible{padding:1rem 1.5rem;outline:none}.divider{margin:.5rem 1rem;width:calc(100% - 2rem);height:2px;background:#ffffff80;border-radius:1px}@media (max-width: 800px){html{font-size:75%}}#headerContainer{padding:1rem;height:4rem;position:relative}#headerBar{padding:.5rem;height:calc(100% - 1rem);display:flex;justify-content:space-between;align-items:center;gap:.5rem;background:color-mix(in srgb,var(--containerLowColor) 100%,black 10%);border-radius:2rem}#notesSidebarButton{width:3rem;height:3rem;border-radius:1.5rem;background:var(--containerHighColor);display:none;flex-shrink:0}#headerSearch{margin-left:1rem;padding:.5rem 1rem;width:70%;height:2rem;border:none;background:var(--secondaryColor);border-radius:1.5rem;color:var(--inverseColor);outline:none;text-align:center;font-family:system-ui;font-size:1em;transition:all .25s ease}#headerSearch:focus-visible{scale:1.02;font-size:1.2em}#headerAccountAvatar{width:3rem;height:3rem;background:var(--secondaryColor);border-radius:1.5rem}@media (max-width: 600px){#notesSidebarButton{display:block}#headerSearch{margin-left:0}}#notesSidebar{position:sticky;left:0;top:0;padding:1rem;width:14rem;flex-shrink:0;min-height:calc(100dvh - 8rem);max-height:calc(100dvh - 2rem);flex-direction:column;align-items:center;gap:.5rem;background:var(--primaryColor);border-top-right-radius:1rem}#notesSidebar.opened{display:flex}#notesSidebar.closed{display:none}.notesSection{padding:.5rem 1rem;width:calc(100% - 2rem);background:none;border-radius:2rem;cursor:pointer;transition:all .4s ease}.notesSection.active{background:color-mix(in srgb,var(--containerHighColor) 80%,transparent)}.notesSection:hover:not(.active){background:color-mix(in srgb,var(--containerHighColor) 20%,transparent)}.notesSection>h5{transition:all .4s ease}.notesSection:hover:not(.active)>h5{translate:4px 0}@media (max-width: 600px){#notesSidebar{position:fixed;height:100dvh;z-index:1;animation:animNotesSidebarAppear .25s ease forwards}@keyframes animNotesSidebarAppear{0%{translate:-14rem 0}to{translate:0 0}}}#notesMainWindow{padding:1rem;width:calc(100% - 19rem);height:calc(100% - 2rem);display:flex;flex-direction:column;gap:1rem;background:var(--secondaryColor);border-top-left-radius:1rem}#notesMainTagsContainer{display:flex;gap:.5rem;max-width:100%;overflow-x:scroll;overflow-y:hidden;scrollbar-width:none;padding-bottom:.5rem;margin-bottom:-.5rem;cursor:grab}#notesMainTagsContainer:active{cursor:grabbing}#notesMainNotesContainer{width:100%;height:100%}.tagSelectElement{padding:0 1rem;height:calc(2rem - 3.2px);display:flex;justify-content:center;align-items:center;border:solid 2px #ffffff00;border-radius:1rem;transition:all .25s ease}@media (max-width: 600px){#notesMainWindow{width:calc(100% - 2rem);border-top-left-radius:0}}.notesBox{margin:1rem;display:flex;flex-direction:column;gap:1rem}.notesContainer{display:grid;gap:1rem;grid-template-columns:repeat(auto-fit,minmax(12rem,1fr));grid-template-rows:repeat(auto-fit,16rem)}.noteElement{padding:1rem;min-width:6rem;height:14rem;display:flex;flex-direction:column;gap:.5rem;position:relative;background:var(--containerColor);border:solid 2px #ffffff00;border-radius:1rem;cursor:pointer;transition:all .5s ease}.noteElement:hover{scale:1.01;box-shadow:0 0 20px color-mix(in srgb,var(--inverseColor) 10%,transparent);border:solid 2px color-mix(in srgb,var(--inverseColor) 20%,transparent)}.noteElement:hover .noteElementIndicator{width:8rem;height:1.5rem}.noteElement:hover .noteElementIndicator>h5{font-size:1em}.noteElementIndicator{position:absolute;top:.5rem;right:.5rem;width:1rem;height:1rem;display:flex;justify-content:center;align-items:center;border-radius:.5rem;transition:all .25s ease}.noteElementIndicator>h5{font-size:0;transition:all .25s ease}.trash{background:#e76f6f}.not_completed{background:#aba53a}.completed{background:#50ad50}.noteElement h1{min-height:fit-content}#noteWindowBg{display:flex;justify-content:end;align-items:start;z-index:1;animation:blurBgAppear .25s ease forwards}@keyframes blurBgAppear{0%{background:#0000;-webkit-backdrop-filter:blur(0px);backdrop-filter:blur(0px)}to{background:#00000080;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px)}}#noteWindow{margin:.5rem;padding:1rem;width:30rem;height:calc(100% - 3rem);border-radius:2rem;display:flex;flex-direction:column;justify-content:space-between;position:relative;gap:1rem;background:var(--containerColor);z-index:1;animation:noteWindowAppear .25s ease forwards}@keyframes noteWindowAppear{0%{scale:.9;translate:32.5rem 0}to{scale:1;translate:0 0}}#noteWindowHeader{display:flex;justify-content:space-between;align-items:center}#noteWindowTags{display:flex;gap:.5rem;cursor:grab;overflow-x:scroll;overflow-y:hidden;scrollbar-width:none;padding-bottom:.5rem;margin-bottom:-.5rem}#noteWindowTags:active{cursor:grabbing}#noteWindowTagsContainer{display:flex;flex-direction:column;position:relative;z-index:1}#noteWindowTagsEdit{padding:.5rem 1rem;height:1rem;display:flex;align-items:center;gap:.5rem;border-radius:1rem;background:var(--primaryColor);cursor:pointer!important}.tagElement{padding:0 1rem;height:2rem;display:flex;justify-content:center;align-items:center;border-radius:1rem}#noteWindowMain{position:relative;height:100%}#noteWindowFooter{display:flex;justify-content:end;align-items:center;gap:.5rem}@media (max-width: 600px){#noteWindow{margin-top:10.5rem;height:calc(100% - 13rem);width:calc(100% - 3rem)}#noteWindowTagsContainer{flex-direction:row-reverse;position:fixed;bottom:0;width:100dvw;z-index:2}#noteWindowTagsEditBg{animation:blurBgAppear .25s ease forwards}}#noteTagsWindow{margin:.5rem;padding:1.5rem;border-radius:2rem;width:10rem;max-height:calc(80% - 3rem);display:flex;flex-direction:column;gap:1rem;background:var(--containerColor);animation:noteTagsWindowAppear .25s ease forwards}@keyframes noteTagsWindowAppear{0%{translate:14rem 0;scale:.95}to{translate:0 0;scale:1}}#noteTagsContainer{display:flex;flex-direction:column;gap:.5rem;overflow-y:scroll;scrollbar-width:none}#tagEditAddNew{width:fit-content;background:var(--primaryColor);gap:.5rem;cursor:pointer}.tagEditElement{height:2rem;padding:0 1rem;border-radius:1rem;display:flex;align-items:center;flex-grow:1}.tagEditElementRemoveButton{padding:.5rem;height:1rem;width:1rem;background:var(--primaryColor);border-radius:1rem;cursor:pointer}@media (max-width: 600px){#noteTagsWindow{margin:.5rem;min-width:fit-content;width:40%;animation:noteTagsWindowAppearMobile .25s ease forwards}@keyframes noteTagsWindowAppearMobile{0%{translate:0 10rem;scale:.95}to{translate:0 0;scale:1}}}#noteWindowTagsAdd{margin:.5rem;padding:1.5rem;border-radius:2rem;width:10rem;max-height:calc(20% - 4rem);display:flex;flex-direction:column;gap:1rem;background:var(--containerColor);z-index:2;animation:noteWindowTagsAddAppear .25s ease forwards}@keyframes noteWindowTagsAddAppear{0%{translate:12.5rem 0;scale:.95}to{translate:0 0;scale:1}}#addTagContainer{position:relative;display:flex;gap:.5rem}#addTagInput{padding:0 1rem;width:calc(100% - 4.5rem);height:2rem;font-size:.8em;border:none;border-radius:1rem;background:var(--primaryColor)}.addTagButton{padding:.5rem;height:1rem;width:1rem;background:var(--primaryColor);border-radius:1rem}.addTagButton:disabled{background:color-mix(in srgb,var(--primaryColor) 50%,transparent)}@media (max-width: 600px){#noteWindowTagsAdd{flex-grow:1;animation:noteWindowTagsAddAppearMobile .25s ease forwards}@keyframes noteWindowTagsAddAppearMobile{0%{translate:0 10rem;scale:.95}to{translate:0 0;scale:1}}}#signinPageBg{display:flex;justify-content:center;align-items:center;background:radial-gradient(var(--primaryColor),var(--secondaryColor))}#signinContainer{padding:2rem;width:20rem;height:30rem;background:var(--containerColor);border-radius:2rem;box-shadow:0 0 50px var(--containerColor);position:relative;display:flex;flex-direction:column;gap:1rem;justify-content:center;align-items:center}#buttonBackToMain{position:absolute;top:0;left:-7rem;padding:.5rem 1rem;display:flex;align-items:center;gap:.25rem;cursor:pointer}#buttonBackToMain>img{transition:all .25s ease}#buttonBackToMain:hover>img{translate:-2px 0}#buttonBackToMain h5{transition:all .25s ease}#buttonBackToMain:hover h5{font-size:1.1em}#errorMessage{margin-top:-.5rem;animation:errorMessageAppear .5s ease forwards}@keyframes errorMessageAppear{0%{translate:0 -.5rem}to{translate:0 0}}#authButton{margin-top:.5rem}#switchAuthButton{margin-top:-.5rem;position:relative;cursor:pointer}#switchAuthButton>h6{color:var(--inverseColor);transition:all .25s ease}#switchAuthButton:hover>h6{color:var(--accentColor)}#switchAuthButton:after{content:"";position:absolute;bottom:-2px;width:100%;height:2px;border-radius:1px;background:color-mix(in srgb,var(--accentColor) 0%,transparent);transition:all .25s ease}#switchAuthButton:hover:after{background:color-mix(in srgb,var(--accentColor) 100%,transparent);translate:0px 1px}@media (max-width: 600px){#buttonBackToMain{top:-3rem;left:0}}
