*{box-sizing:border-box}html,body,#root{color:#222;background:#f4f4f4;min-height:100%;margin:0;font-family:Arial,sans-serif}button,input{font:inherit}a{color:inherit;text-decoration:none}:root{--color-white:#fff;--color-lightgrey:#cdc9c9;--color-darkgrey:#646464;--color-black:#000;--color-successgreen:#0f5132;--font-family:"Gill Sans", sans-serif}.font-size-h1{font-size:3rem}.font-size-h2{font-size:2rem}.font-size-nav{font-size:1.75rem}.font-size-p{font-size:1.2rem}.font-size-info{font-size:1rem}.flex-col{flex-direction:column;display:flex}.flex-row{flex-direction:row;display:flex}.add-cat-container{flex-direction:column;gap:2rem;width:100%;display:flex}.add-cat-container label{grid-template-columns:10rem 1fr;align-items:center;gap:.5rem;display:grid}.add-cat-container label input,.add-cat-container label textarea{background:#f8f8f8;border:1px solid #666;width:50%;padding:.5rem;position:static;left:auto}.add-cat-container button{color:#222;cursor:pointer;background:#d2d2d2;border:none;align-self:center;min-width:10rem;padding:1rem 1.25rem}.add-cat-container input[type=checkbox]{justify-self:start;width:auto}.login-page{background:#ededed;place-items:center;min-height:100vh;padding:2rem 1.25rem;display:grid}.login-page__card{flex-direction:column;align-items:center;gap:2rem;width:100%;max-width:24rem;display:flex}.login-page__brand{align-items:center;gap:1rem;margin-top:1rem;display:flex}.login-page__logo-circle{background:#d0d0d0;border-radius:50%;width:3rem;height:3rem}.login-page__brand h1{margin:0;font-size:2rem;font-weight:500}.login-page__form{flex-direction:column;gap:1rem;width:100%;display:flex}.login-page__form input{background:#f8f8f8;border:1px solid #666;width:100%;padding:1rem}.login-page__text-link{color:#333;text-align:center;background:0 0;border:none;font-size:.95rem}.login-page__primary-button,.login-page__secondary-button{align-self:center;min-width:10rem;padding:1rem 1.25rem}.login-page__primary-button{color:#222;background:#d2d2d2}.login-page__secondary-button{color:#222;background:0 0;border:1px solid #666}.login-page__invite-block{text-align:center;flex-direction:column;align-items:center;gap:1rem;max-width:16rem;display:flex}.create-account-page{background:#ededed;place-items:center;min-height:100vh;padding:2rem 1.25rem;display:grid}.create-account-page__card{flex-direction:column;align-items:center;gap:2rem;width:100%;max-width:24rem;display:flex}.create-account-page__brand{align-items:center;gap:1rem;margin-top:1rem;display:flex}.create-account-page__logo-circle{background:#d0d0d0;border-radius:50%;width:3rem;height:3rem}.create-account-page__brand h1{margin:0;font-size:2rem;font-weight:500}.create-account-page__form{flex-direction:column;gap:1rem;width:100%;display:flex}.create-account-page__form input{background:#f8f8f8;border:1px solid #666;width:100%;padding:1rem}.create-account-page__primary-button,.create-account-page__secondary-button{align-self:center;min-width:10rem;padding:1rem 1.25rem}.create-account-page__primary-button{color:#222;background:#d2d2d2;margin-top:2.3rem}.create-account-page__secondary-button{color:#222;background:0 0;border:1px solid #666}.create-account-page__status-message{text-align:center;min-height:7.5rem;font-size:.95rem}.top-nav{background:#fff;border-bottom:1px solid #ddd;justify-content:space-between;align-items:center;padding:1rem 1.5rem;display:none}.top-nav__logo{align-items:center;gap:.75rem;font-size:1.1rem;font-weight:600;display:flex}.top-nav__logo-circle{background:#d0d0d0;border-radius:50%;width:2rem;height:2rem}.top-nav__links{align-items:center;gap:.75rem;display:flex}.top-nav__links a,.top-nav__menu-button{border-radius:.75rem;align-items:center;gap:.4rem;padding:.6rem .8rem;display:flex}.top-nav__icon,.top-nav__menu-icon{width:1.5rem;height:1.5rem}.bottom-nav{padding:.45rem .25rem max(.45rem, env(safe-area-inset-bottom));z-index:20;background:#fff;border-top:1px solid #ddd;grid-template-columns:repeat(7,1fr);display:grid;position:fixed;bottom:0;left:0;right:0}.bottom-nav a{color:#444;flex-direction:column;justify-content:center;align-items:center;gap:.2rem;padding:.4rem .2rem;font-size:.75rem;display:flex}.bottom-nav .active{color:#000;font-weight:600}.bottom-nav__icon{width:1.5rem;height:1.5rem}.bottom-nav__icon-home{width:2.5rem!important;height:2.5rem!important}@media (width<=1024px){.top-nav{display:none}.bottom-nav{display:grid}}@media (width>=1025px){.top-nav{display:flex}.bottom-nav{display:none}}