@import"https://fonts.googleapis.com/css2?family=Open+Sans:wght@400;500;600;700;800&family=Roboto:wght@400;500;700;900&display=swap";main{max-width:1460px;margin:0 auto;min-height:100vh;margin-bottom:2rem}.home-empty h1{text-align:center;margin-bottom:0}.home-empty .para-empty{text-align:center;margin-top:1rem}.home-empty .para-empty .nav-new{display:inline-flex;margin-inline:.5rem;height:35px}.home,.grid{display:grid;grid-template-columns:1fr;gap:1rem;row-gap:1.5rem;padding-top:1rem;padding-inline:1rem}@media screen and (min-width: 430px){.home,.grid{grid-template-columns:1fr 1fr}}@media screen and (min-width: 540px){.home,.grid{grid-template-columns:repeat(auto-fill,minmax(200px,1fr))}}@media screen and (min-width: 600px){.home,.grid{grid-template-columns:1fr 1fr 1fr}}@media screen and (min-width: 1100px){.home,.grid{grid-template-columns:1fr 1fr 1fr 1fr}}.note-item{height:280px;max-height:280px;overflow:hidden;border-radius:8px;text-decoration:none;color:unset;width:100%}.note-item:visited{color:unset}.note-item p{border-radius:8px;font-size:.9375rem;height:80%;text-overflow:ellipsis;padding:.5rem;padding-inline:1rem;background-color:#333;display:-webkit-box;-webkit-line-clamp:7;-webkit-box-orient:vertical;overflow:hidden;white-space:pre-wrap;transition:all .3s ease}.note-item:hover p{background-color:#444}.note-item h4{font-size:1rem;text-align:center;text-overflow:ellipsis;white-space:nowrap;overflow:hidden;margin-top:.5rem}.note-item h5{font-size:.875rem;text-align:center;text-overflow:ellipsis;white-space:nowrap;overflow:hidden;color:#949494;margin-top:.1rem;margin-bottom:.5rem;display:flex;justify-content:center;align-items:center;gap:.4rem}.not-found,.note-error{text-align:center}.not-found>p,.note-error>p{display:flex;flex-direction:row;align-items:center;justify-content:center;margin-top:1rem;gap:.4rem}.not-found a,.note-error a{text-decoration:underline white;color:#fff}.root-div{text-align:center;padding-bottom:3rem;line-height:1;background-color:#000;background-position:top;background-size:cover;background-repeat:no-repeat}.note-count{color:#959595;font-size:1.1rem;margin-top:.2rem}h1{color:var(--color-main);padding-inline:.5rem;padding-top:3rem}.nav{background-color:#000;background-position:top;background-size:cover;border-top:2px solid #333;border-bottom:2px solid #333;height:2.6875rem;position:sticky;top:0%}.nav-ul{display:flex;flex-direction:row;gap:1rem;justify-content:flex-end;align-items:center;max-width:91.25rem;margin:0 auto}.nav-list{display:flex;padding-inline:.6rem;border-radius:6px;transition:all .3s ease}.nav-list:not(.nav-list-new):hover{background-color:#333}.nav-list:not(.nav-list-new){height:30px}.nav-list .nav-a{color:var(--color);text-decoration:unset;font-size:20px;border:2px solid transparent;border-radius:5px;position:relative;transition:all .2s ease}.nav-list .nav-a>span{display:none}.nav-list .nav-a:after{content:"";position:absolute;opacity:0;bottom:-8px;left:50%;transform:translate(-50%);width:135%;height:3px;border-radius:8px;background-color:#fff;transition:all .3s ease}.nav-list .nav-a.active:after{opacity:1}.nav-list .nav-a:hover:after{opacity:1}.nav-list .nav-a:hover{color:#fff}.nav-list .nav-a:visited{text-decoration:none;color:unset}.nav-list:last-of-type{margin-right:1rem}.nav-list .nav-a.active{color:#fff}.nav-list-new{margin-right:auto;margin-left:1rem;padding-inline:unset}.nav-list-note-count{position:absolute;right:20px;top:50%;transform:translateY(-50%);display:none;color:#ddd;font-weight:700}.nav-new{color:#000;border:1px solid var(--color-main);background-color:var(--color-main);display:flex;align-items:center;justify-content:center;gap:.5rem;padding-inline:.5rem;padding-block:.5rem;font-family:Open Sans;font-size:15px;font-weight:600;border-radius:6px;cursor:pointer;text-decoration:none;transition:all .2s ease}.nav-new:visited{color:#000}.nav-new:hover{background-color:transparent;color:var(--color-main)}.nav-ul-mobile{display:none}.nav-mobile-li{display:flex;list-style:unset}.nav-mobile-path{font-size:1.2rem;margin-left:.5rem}.nav-mobile-bars{margin-left:1rem}.nav-mobile-bars button{display:flex;justify-content:center;align-items:center;background-color:transparent;border:1px solid transparent;border-radius:50%;aspect-ratio:1/1;height:2.5rem;transition:all .2s ease}.nav-mobile-bars button:hover{background-color:#333}.nav-mobile-new{margin-left:auto;margin-right:1rem}@media screen and (max-width: 540px){.root-div{display:none}.nav-ul-mobile{display:flex;justify-content:flex-end;align-items:center}.nav{position:sticky;z-index:999}.nav-ul{background-color:#222;position:absolute;transform:translate(-100%);top:0;height:100vh;width:100%;flex-direction:column;justify-content:unset;padding-top:4rem;padding-left:20%;z-index:999;border-top-right-radius:20px;transition:transform .1s ease}.nav-ul.active{display:flex;transform:translate(-20%)}.nav-list-new{display:none}.nav-list{width:100%;padding-inline:unset;align-items:center;position:relative}.nav-list:not(.nav-list-new):hover{background-color:#666}.nav-list:last-of-type{margin-right:unset;position:relative}.nav-list:last-of-type:after{content:"";bottom:-120%;position:absolute;background-color:transparent;width:100%;height:1px;border:1px dashed #666;border-style:dashed}.nav-list .nav-a{width:100%;padding-left:1.8rem;display:flex;gap:1rem;align-items:center;justify-content:flex-start}.nav-list .nav-a>span{display:flex;justify-content:center;align-items:center}.nav-list .nav-a.active{background-color:#666;font-size:1.4rem}.nav-list .nav-a.active:after{display:none}.nav-list .nav-a:hover:after{display:none}.nav-list-note-count{display:block}}.new-note,.trash-note{max-width:500px;margin:0 auto;position:relative}@media screen and (min-width: 700px){.new-note,.trash-note{max-width:80%}}form{height:200vh}input,textarea{background:#000;color:#fff}input{width:100%;padding-block:.4rem;font-family:var(--font-open);font-size:19px;border:none;outline:none}textarea{width:100%;min-height:100%;font-family:var(--font-open);font-size:17px;padding-left:1.5rem;padding-block:.8rem;border:none;border-bottom:2px solid #333;outline:none;resize:none;opacity:.9}.title-input-div{background-color:#000;display:flex;gap:.4rem;justify-content:flex-start;align-items:center;position:relative;border-bottom:2px solid #333;padding-left:.1rem;padding-right:.5rem}.title-input-div>.buttons{color:#fff;font-size:1rem;font-family:var(--font-open);font-weight:600}.trash-note .title-input-div{padding-right:1rem}.buttons{background-color:#000;display:flex;justify-content:center;align-items:center;border-radius:50%;cursor:pointer;border:none;padding-inline:.2rem;padding-block:.2rem;transition:all .2s ease;aspect-ratio:1 / 1;width:max-content}.back-button{aspect-ratio:1 / 1;height:35px;width:35px}.back-button:hover{background-color:#333}.favorite-svg{transition:all .2s ease;color:#fff}.favorite-svg.active{fill:#ffe234;color:#ffe234}.buttons:hover>.favorite-svg{transform:scale(1.1);color:#ffe234}@media screen and (min-width: 700px){.trash-button{margin-left:.4rem}}.trash-svg{color:#fff;transition:all .2s ease}.buttons:hover>.trash-svg{transform:scale(1.2);color:#fff;fill:#fff}.save-svg{color:#fff;transition:all .2s ease}.buttons:hover>.save-svg{transform:scale(1.2)}.restore-button{margin-right:1rem}.title-input-div>.restore-button,.title-input-div .delete-button{border-radius:10px;aspect-ratio:unset;padding-inline:.8rem;font-size:1.1rem}.restore-button:hover,.delete-button:hover{background-color:#333}.clear{position:absolute;top:0%}.get{position:absolute;top:0%;left:50px}.backdrop{position:absolute;height:100%;width:100%;opacity:.5;z-index:10;cursor:grab;background-color:#000}.delete-div{background-color:#333;color:#fff;position:absolute;top:90px;left:50%;transform:translate(-50%);width:calc(100% - 50px);max-width:350px;height:140px;border-radius:10px;display:flex;flex-direction:column;justify-content:space-between;padding-block:1rem;z-index:99}.delete-div>p{text-align:center;font-size:1.2rem}.delete-div>.button-container{display:flex;align-items:center;justify-content:center;gap:1rem;width:100%;height:30px;position:relative;padding-inline:1.2rem}.delete-div>.button-container>button{font-size:1rem;width:50%;display:block;border:unset;border-radius:5px;font-family:var(--font-roboto);background-color:transparent;color:#fff;height:25px;cursor:pointer;transition:all .25s ease}.delete-div>.button-container>button:hover{background-color:#4a4a4a}.delete-div .middle-div{height:70%;width:2px;border:1px solid white;border-radius:10px;background-color:#fff}*,*:before,*:after{margin:0;padding:0;box-sizing:border-box;-webkit-tap-highlight-color:transparent}:root{font-family:Open Sans,sans-serif;line-height:1.5;font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;-webkit-text-size-adjust:100%;--color: rgba(255, 255, 255, .87);--color-main: rgb(237, 237, 237);--font-open: "Open Sans", sans-serif;--font-roboto: "Roboto", sans-serif}body{color:var(--color-main);background-color:#111;min-height:100vh;margin:0 auto}#root{position:relative}button{cursor:pointer}