*{margin:0;padding:0;box-sizing:border-box;font-family:Shadows Into Light,cursive}html,body,#root,.app-container{height:100%}.login-container{display:flex;flex-direction:column;height:100%}.login-topbar{display:flex;flex-direction:row;align-items:center;justify-content:center;min-height:56px;background:#7e39d8}.login-topbar>h1{color:#000;font-weight:400}.login-topbar-logo{height:56px;width:56px;margin-left:10px}.login-form{flex-grow:1;display:flex;flex-direction:column;align-items:center;justify-content:center}.login-btn-google-signin{display:flex;flex-direction:row;align-items:center;justify-content:center;height:44px;width:200px;color:#000;background:#e5e2eb;border:none;box-shadow:2px 2px 5px gray}.login-btn-google-signin>p{font-size:16px}.login-btn-google-signin>img{height:24px;width:24px;margin-right:10px}.login-btn-google-signin:hover{border:1px solid #4285F4}.login-btn-google-signin:active{transform:translate(2px,2px);box-shadow:none}.home-container{height:100%;display:flex;flex-direction:column;overflow:hidden}.outlet-container{position:relative;flex-grow:1;overflow-y:auto}.navbar{display:flex;flex-direction:row;min-height:56px;background:#7e39d8;align-items:center;border-bottom:1px solid black}.navbar-logo{height:56px;width:56px;margin-left:10px}.navbar h1{color:#000;font-weight:400;margin:0 10px}.drawer{position:fixed;top:56px;right:0;width:65%;background:#7e39d8;z-index:100;height:calc(100% - 56px);transform:translate(100%);transition:transform .3s ease-in-out;display:flex;flex-direction:column;align-items:center;border-left:1px solid black;border-top:1px solid black}.drawer-open{transform:translate(0)}.navbar-btn-logout{background:#cc4a4f;border:none;display:flex;flex-direction:row;align-items:center;justify-content:center;height:100%;margin-left:20px;border-left:1px solid black;color:#000}.navbar-btn-logout:hover{cursor:pointer}.navbar-btn-logout>p{font-size:16px;margin-left:20px;margin-right:20px}.navbar-spacer{flex-grow:1}.navbar-link{font-size:20px;color:#000;padding:0 20px;text-decoration:none;font-styleA:italic;-webkit-user-select:none;user-select:none}.navbar-link:visited{color:#000}.navbar-link:hover{text-decoration:underline}.navbar-active{font-weight:600;text-decoration:underline}.navbar-profile-image{height:32px;width:32px;border-radius:50%;background:#e5e2eb;display:flex;justify-content:center;align-items:center;margin-left:20px}.navbar-btn-menu{background:#45caad;border:none;display:none;-webkit-user-select:none;user-select:none;height:100%;padding:0 20px;font-size:16px;border-left:1px solid black;color:#000}.navbar-btn-menu:hover{cursor:pointer}@media(max-width:576px){.navbar-link,.navbar-btn-logout{display:none}.navbar-btn-menu{display:block}}@media not (max-width:576px){.drawer{display:none}}.drawer-link{font-size:20px;color:#000;padding:10px 20px;text-decoration:none;font-styleA:italic;-webkit-user-select:none;user-select:none}.drawer-link:visited{color:#000}.drawer-active{font-weight:600;text-decoration:underline}.drawer-profile-image{height:100px;width:100px;border-radius:50%;background:#e5e2eb;display:flex;justify-content:center;align-items:center;margin:20px 0;border:1px solid black}.drawer-profile-image>p{font-size:38px}.drawer-user-name{font-size:20px}.drawer-divider{width:100%;height:1px;background:#000;margin:20px 0}.drawer-spacer{flex-grow:1}.drawer-btn-logout{width:100%;background:#cc4a4f;border:none;padding:20px 0;border-top:1px solid black;color:#000}.drawer-btn-logout>p{font-size:16px}.date-jar-container{position:relative;height:100%;display:flex;flex-direction:column;justify-content:center;align-items:center}.date-jar-btn-add{position:absolute;bottom:25px;right:25px;height:75px;width:75px;border-radius:50%;font-size:32px;border:1px solid black;z-index:1;box-shadow:2px 2px 5px #000;background:#45caad;color:#000}.date-jar-btn-add:active{transform:translate(2px,2px);box-shadow:none}.date-jar-popup-add{position:absolute;top:0;left:0;height:100%;width:100%;background-color:#80808080;visibility:hidden;opacity:0;transition:opacity .25s ease-in,visibility 0ms ease-in .25s;display:flex;flex-direction:row;justify-content:center;align-items:center;z-index:2}.date-jar-popup-add-visible{visibility:visible;opacity:1}.date-jar-popup-add-container{position:relative;height:80%;width:90%;background:#e5e2eb;opacity:1;display:flex;flex-direction:column;justify-content:center;align-items:center;border-radius:20px;box-shadow:2px 2px 5px #000}.date-jar-popup-add-container>h1{margin-bottom:10px}.date-jar-form-add{width:100%;display:flex;flex-direction:column;justify-content:center;align-items:center}.date-jar-form-add-idea-container{width:100%;height:150px;display:flex;flex-direction:column;justify-content:center;align-items:center}.date-jar-form-add-input-idea{width:80%;height:100px;border-radius:10px;border:1px solid black;padding:10px;min-width:60%;max-width:80%;min-height:70px;max-height:100px;font-size:22px}.date-jar-form-add-input-idea-error{color:#cc4a4f;display:block;opacity:0}.date-jar-form-add-input-idea-error-show{color:#cc4a4f;display:block;opacity:1}.date-jar-form-add-tag-container{width:100%;height:70px;display:flex;flex-direction:column;justify-content:center;align-items:center}.date-jar-form-add-input-tag{width:80%;height:50px;border-radius:10px;border:1px solid black;padding:10px;font-size:22px}.date-jar-form-add-color-container{width:80%;height:75px;display:flex;flex-direction:row;justify-content:space-between;align-items:center}.date-jar-form-add-color-container>label{font-size:22px;text-align:center;margin-right:10px}.date-jar-form-add-input-color{border:1px solid black}.date-jar-form-add-btn-container{width:100%;height:100px;display:flex;flex-direction:row;justify-content:center;align-items:center}.date-jar-form-add-btn-ok{width:35%;height:44px;background:#45caad;font-size:24px;border:1px solid black;border-radius:10px;margin-right:2.5%;box-shadow:2px 2px 5px #000;color:#000}.date-jar-form-add-btn-ok:active{transform:translate(2px,2px);box-shadow:none}.date-jar-form-add-btn-cancel{width:35%;height:44px;background:#cc4a4f;font-size:24px;border:1px solid black;border-radius:10px;margin-left:2.5%;box-shadow:2px 2px 5px #000;color:#000}.date-jar-form-add-btn-cancel:active{transform:translate(2px,2px);box-shadow:none}.date-jar-form-add-spinner{position:absolute;top:0;left:0;height:100%;width:100%;border-radius:20px;background-color:#80808080;display:flex;flex-direction:column;justify-content:center;align-items:center}.date-jar-container>h2{padding:20px;text-align:center}.date-ideas-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(75px,135px));gap:16px;padding:16px;width:90%;flex-grow:1;justify-content:center;align-content:start;overflow-y:scroll;scrollbar-width:none}.date-idea-card{background:#fff;border-radius:10px;padding:12px 16px;box-shadow:2px 2px 5px #000;height:250px;display:flex;flex-direction:column;justify-content:center;align-items:center}.date-idea-card:hover{cursor:pointer;box-shadow:5px 5px 10px #000}.date-idea-card-revealed{box-shadow:5px 5px 10px #000}.date-idea-card-content{position:relative;z-index:1;text-align:center}.date-idea-card-reveal-content{display:flex;flex-direction:column;align-items:center;justify-content:center}.date-idea-card-reveal-content>p{font-size:20px}.date-idea-card-btns{display:flex;flex-direction:row;align-items:center;justify-content:space-around}.date-idea-card-hide-btn,.date-idea-card-use-btn{margin-top:12px;padding:6px 12px;border-radius:8px;border:1px solid black;background:#ffffffd9;cursor:pointer}.spinner{border-radius:50%;border-style:solid;border-width:3px;border-color:#0000001a;border-top-color:currentColor;animation:spinner-rotate .6s linear infinite}@keyframes spinner-rotate{to{transform:rotate(360deg)}}.tasks-container{height:100%;display:flex;flex-direction:column;align-items:center;justify-content:center}