html,body{margin:0;padding:0;min-height:100vh;min-height:100dvh}body{--header-height: 70px;--sidebar-width: 70px;--sidebar-offset-scrollbar: 0px;--notification-offset-scrollbar: 0px;--notification-duration: 7.5s;--notification-fade: 0.3s;display:grid;grid-template:[header-top] "header header" var(--header-height) [header-bottom] "sidebar container" auto [page-bottom]/70px auto;overflow:hidden}@media only screen and (max-height: 550px){body{--header-height: 60px}}@media only screen and (max-width: 700px),only screen and (hover: none),only screen and (pointer: coarse){body{display:block;overflow-y:auto}}.sidebar{grid-area:sidebar;display:flex;flex-direction:column;background-color:red;width:70px;height:calc(100vh - var(--header-height));height:calc(100dvh - var(--header-height));transition:width 200ms ease-in-out;overflow:hidden;cursor:default;-webkit-user-select:none;-moz-user-select:none;user-select:none;z-index:1}.sidebar:hover{width:calc(250px + var(--sidebar-offset-scrollbar));overflow-y:auto}.sidebar:hover .label{opacity:1}.sidebar>div{width:250px;height:70px;display:flex;align-items:center;transition:background-color 300ms ease-in-out;cursor:pointer}.sidebar>div:hover{background-color:#ff6464}.sidebar:not(.signed-in)>.sign-in-required{display:none}.sidebar:not(.mentor)>.mentor-required{display:none}.sidebar div.filler{flex:1 1 0;cursor:default;pointer-events:none}.sidebar div.sign-in{background-color:#202124}.sidebar div.sign-in:not(.disabled):hover{background-color:#3c4043}.sidebar div.sign-in.disabled{pointer-events:none}.sidebar div.sign-in.disabled img,.sidebar div.sign-in.disabled .label{opacity:.5}.sidebar .icon{width:70px;height:70px;display:flex;justify-content:center;align-items:center}.sidebar .icon img{display:block;width:40px}.sidebar .icon img.dark{-webkit-filter:invert(1);filter:invert(1)}.sidebar .label{width:167.5px;height:50px;line-height:47.5px;font-family:Oswald,sans-serif;color:#fff;font-size:28px;transition:opacity 200ms ease-in;padding-left:5px;box-sizing:border-box}.sidebar>div.selected{background-color:#af0000;transition:background-color 300ms ease-in-out;pointer-events:none}.sidebar div.apple-bug{pointer-events:none;height:100px;display:none}.sidebar div.apple-bug.show{display:block}.sidebar div.apple-bug .label{width:100%;height:100px;padding:0 5px;font-size:24px;line-height:30px;display:flex;align-items:center;justify-content:center;text-align:center}@media only screen and (max-width: 700px),only screen and (hover: none),only screen and (pointer: coarse){.sidebar{width:auto;overflow:auto;position:fixed;top:var(--header-height);left:0;bottom:0;right:0;background-color:#323232;pointer-events:none;opacity:0;transition:opacity 200ms ease-in}.sidebar:hover{width:auto}.sidebar.open{opacity:1;pointer-events:all;transition:opacity 200ms ease-out}.sidebar>div{width:auto;justify-content:center}.sidebar .icon{margin-right:12.5px}}.sidebar-shadow{position:fixed;top:var(--header-height);left:0;right:0;bottom:0;opacity:0;pointer-events:none;background-color:#000;transition:opacity 200ms ease-in-out}.sidebar-shadow.open{opacity:.6;pointer-events:all}.header{grid-area:header;background-color:#000;color:#fff;display:flex;-webkit-user-select:none;-moz-user-select:none;user-select:none}.menu-bars{display:none;opacity:0;pointer-events:none}@media only screen and (max-width: 700px),only screen and (hover: none),only screen and (pointer: coarse){.header{position:fixed;top:0;left:0;right:0;height:var(--header-height)}.menu-bars{flex:0 0 var(--header-height);padding:0 15px;box-sizing:border-box;background-color:red;opacity:1;display:flex;flex-direction:column;gap:8px;justify-content:center;align-items:center;pointer-events:all;cursor:pointer}.menu-bars div{width:calc(var(--header-height) - 30px);height:4px;background-color:#fff;pointer-events:none;transition:width 200ms ease-out,transform 300ms ease-out}.menu-bars.open>:first-child,.menu-bars.open>:last-child{width:0}.menu-bars .menu-bar-middle{background-color:rgba(0,0,0,0)}.menu-bars .menu-bar-middle div{position:absolute;transform-origin:center}.menu-bars.open .menu-bar-middle div:first-child{transform:rotate(45deg) scaleX(1.4)}.menu-bars.open .menu-bar-middle div:last-child{transform:rotate(-45deg) scaleX(1.4)}}.header-pad-left{flex:1 1 0px}.header-container{display:flex;flex:0 0 350px;align-items:center;font-size:30px;font-family:Oswald,sans-serif;text-align:center;line-height:30px;justify-content:center}.header-container img{height:calc(var(--header-height) - 20px);display:block;margin-right:10px}@media only screen and (max-width: 450px){.header-container{font-size:24px;flex:0 0 300px}}.header-pad-right{flex:1 1 0px}.container{grid-area:container;background-color:#fff;padding:40px 60px;overflow-y:auto;box-sizing:border-box;height:calc(100vh - var(--header-height));height:calc(100dvh - var(--header-height))}@media only screen and (max-width: 900px){.container{padding:15px}}@media only screen and (max-width: 700px),only screen and (hover: none),only screen and (pointer: coarse){.container{overflow:visible;height:100vh;height:100dvh;padding-top:calc(var(--header-height) + 15px);box-sizing:border-box}}.content{margin:0 auto;width:1200px;font-family:system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen,Ubuntu,Cantarell,"Open Sans","Helvetica Neue",sans-serif;overflow-x:auto}@media only screen and (max-width: 1450px)and (min-width: 1126px){.content{width:900px}}@media only screen and (max-width: 1125px)and (min-width: 901px){.content{width:675px}}@media only screen and (max-width: 900px){.content{width:100%}}button:not([disabled]){cursor:pointer}.notification-container{position:absolute;bottom:15px;right:calc(15px + var(--notification-offset-scrollbar));font-family:system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen,Ubuntu,Cantarell,"Open Sans","Helvetica Neue",sans-serif;background-color:#fff;font-size:18px;width:250px;border:5px solid #000}.notification-container.fade{opacity:0;animation:NotificationPop var(--notification-fade) ease-out 1}@media only screen and (max-width: 400px){.notification-container{position:fixed;width:auto;left:15px;transform:translate3d(0, 0, 0)}}.loading-bar-container{height:7.5px}.loading-bar-container div{height:7.5px;width:0px;animation:NotificationBar var(--notification-duration) linear 1;background-color:red}.notification-message{padding:7.5px 15px 15px 15px}@keyframes NotificationBar{0%{width:100%}100%{width:0%}}@keyframes NotificationPop{0%{opacity:1}100%{opacity:0}}
