.app-container{grid-template-columns:13rem auto;grid-template-rows:1.5rem auto;overflow:hidden;display:grid;height:100dvh;width:100vw}.header-bar{background-color:#9e9e9e;grid-column:1 / span 2;letter-spacing:12px;align-items:center;padding-left:30px;font-weight:400;font-size:1rem;grid-row:1 / 1;height:1.5rem;display:flex;color:#fff}.header-bar[its-me=false]{background-color:tomato}.sidebar{border-right:1px solid #f0f0f0;justify-content:space-between;background-color:var(--sidebar-background-color);flex-direction:column;grid-column:1 / 1;padding:2rem 1rem;grid-row:2 / 2;display:flex}.sidebar .links{flex-direction:column;display:flex;gap:1rem}.sidebar .links .link{text-decoration:none;align-items:center;font-weight:600;cursor:pointer;color:var(--text-color);display:flex;gap:.5rem}.sidebar .links .link .dot{background-color:var(--primary-color);border:2px solid var(--primary-color);border-radius:.2rem;height:1rem;width:1rem}.sidebar .bottom-container .logged-in-user-email{font-weight:500}.sidebar .bottom-container p{cursor:pointer;color:red}.page-content-container{grid-column:2 / 2;grid-row:2 / 2;padding:1rem;overflow-x:hidden;overflow-y:auto}.mobile-menu{display:none}button.square{aspect-ratio:1 / 1}ul{border:var(--default-border);border-radius:var(--border-radius);list-style:none;padding:0}li{padding:.5rem 1rem}li:not(:last-child){border-bottom:var(--default-border)}span.badge{background-color:var(--primary-color);border-radius:var(--border-radius);padding:0 .35rem;margin:0 .25rem;color:#fff}@media screen and (width<=50rem){.app-container{grid-template-rows:1.5rem auto 4rem}.sidebar{display:none}.page-content-container{grid-column:1 / span 2;overflow-x:auto}.mobile-menu{justify-content:space-around;border-top:var(--default-border);grid-column:1 / span 2;align-items:center;grid-row:3 / 3;display:flex}.mobile-menu a.link,.mobile-menu button.link{justify-content:space-between;flex-direction:column;text-decoration:none;align-items:center;height:2.5rem;display:flex}.mobile-menu button.link{anchor-name:--hr-mobile-menu-anchor;background-color:unset;border:unset;color:#333}.mobile-menu button.link:focus{box-shadow:none;outline:none}.mobile-menu #hr-mobile-menu{position-anchor:--hr-mobile-menu-anchor;position-area:top span-left;border:var(--default-border);border-radius:var(--border-radius);margin-bottom:.8rem;position:absolute;width:80vw}.mobile-menu #hr-mobile-menu a.link{justify-content:flex-start;flex-direction:row;padding:0 1rem;display:flex;gap:1rem}.mobile-menu a.link svg,.mobile-menu button.link svg{height:1.2rem;width:1.2rem}.mobile-menu a.link span,.mobile-menu button.link span{font-size:.8rem}}