/* Keep lessons wide. The classroom community is a separate right-hand rail. */
html{scrollbar-gutter:stable}
.menu-toggle{display:grid;flex:none;width:46px;height:46px;border:1px solid #deded2;background:#fff;border-radius:13px;color:#294b3b}
.navigation-backdrop{position:fixed;inset:0;z-index:19;background:#15261a55;border:0;backdrop-filter:blur(2px)}
.navigation-backdrop[hidden]{display:none}
.sidebar .menu-close{display:grid;position:absolute;top:10px;right:10px;z-index:2;color:#fff;background:#ffffff18;border:1px solid #ffffff35}
.sidebar .brand{padding-top:45px}
.sidebar[inert]{visibility:hidden}
@media(min-width:901px){
  body.sidebar-collapsed .app-shell,body.classroom-view .app-shell{grid-template-columns:minmax(0,1fr)}
  body.sidebar-collapsed .sidebar,body.classroom-view .sidebar{display:none}
  body.classroom-view.menu-open .sidebar{display:block;position:fixed;inset:0 auto 0 0;z-index:20;width:300px;height:100dvh;box-shadow:15px 0 50px #15261a33}
  body.classroom-view.menu-open{overflow:hidden}
}
body.classroom-view .main{width:100%;max-width:none;justify-self:stretch}
body.classroom-view #classroomDashboard{max-width:none;margin:0;padding:28px clamp(22px,3vw,48px) 56px}
body.classroom-view .cs-learning-and-feed{display:block;margin-top:36px}
body.classroom-view #classroomLessons{width:100%;container-type:inline-size}
body.classroom-view .cs-learning-and-feed .cs-lessons .home-dashboard-episode{grid-template-columns:minmax(230px,1fr) minmax(340px,1.15fr);padding:22px;gap:24px}
body.classroom-view .cs-learning-and-feed .cs-lessons .home-dashboard-addon-slot{min-height:126px;font-size:14px}
body.classroom-view .cs-learning-and-feed .cs-lessons .home-dashboard-addon-slot strong{font-size:22px}
body.classroom-view .cs-learning-and-feed .cs-lessons .home-dashboard-episode-number{height:64px}
body.classroom-view .cs-feed-column{margin-top:40px;max-height:none;position:static;border-radius:24px;padding:22px;background:#f4f5ef}
body.classroom-view .cs-feed-column .cs-feed-grid{max-width:520px}
body.classroom-view .cs-feed-column .cs-section-head h2{font-size:23px}
body.classroom-view .cs-feed-column .cs-post-image{aspect-ratio:4/5}
body.classroom-view .cs-feed-column .cs-post-heading{padding:16px 16px 0}
body.classroom-view .cs-feed-column .cs-post-body{padding:16px}
body.classroom-view .cs-feed-column .cs-post-author{gap:7px;flex-wrap:wrap}
body.classroom-view .cs-feed-column .cs-post-author>small{font-size:10px}
@media(min-width:1180px){
  body.classroom-view{--classroom-rail:350px}
  body.classroom-view #classroomDashboard{padding-right:calc(var(--classroom-rail) + 42px)}
  body.classroom-view #classroomFeed{position:fixed;right:14px;top:94px;bottom:14px;width:var(--classroom-rail);margin:0;max-height:none;overflow-y:auto;overscroll-behavior:contain;border-radius:22px;z-index:3;box-shadow:0 10px 32px #253e2810}
  body.classroom-view .cs-feed-column .cs-section-head{align-items:center;flex-wrap:nowrap}
  body.classroom-view .cs-feed-column .cs-section-head>button{width:48px;min-width:48px;height:48px}
  body.classroom-view .cs-feed-column .cs-section-head p{font-size:12px}
  body.classroom-view .cs-feed-column .cs-feed-toolbar{flex-wrap:wrap;gap:7px}
  body.classroom-view .cs-feed-column .cs-feed-toolbar label{flex-basis:100%}
}
@media(min-width:1560px){body.classroom-view{--classroom-rail:390px}}
@media(min-width:1900px){body.classroom-view{--classroom-rail:420px}body.classroom-view #classroomDashboard{padding-left:64px;padding-right:calc(var(--classroom-rail) + 64px)}}
@container(max-width:700px){body.classroom-view .cs-learning-and-feed .cs-lessons .home-dashboard-episode{grid-template-columns:1fr;gap:18px}}
@media(max-width:700px){
  body.classroom-view #classroomDashboard{padding:20px 16px 36px}
  body.classroom-view .cs-feed-column{padding:16px}
  body.classroom-view .cs-learning-and-feed .cs-lessons .home-dashboard-episode{padding:18px;grid-template-columns:1fr}
  body.classroom-view .cs-learning-and-feed .cs-lessons .home-dashboard-addon-slot{min-height:110px}
  .sidebar .brand{padding-top:8px}
  .topbar{gap:8px}.menu-toggle{width:40px;height:40px}
}
