.grade-page{--grade-red:#b95666;--grade-red-soft:#de9aa4;--grade-red-line:#e8b8c0;--grade-red-wash:#fff8f9;--grade-ink:#39404b;--grade-muted:#6b7280;--grade-line:#e3e6ea;--grade-side:#fbfbfc;--grade-accent:var(--grade-red);--grade-accent-line:var(--grade-red-line);--grade-accent-wash:var(--grade-red-wash);min-height:100vh;background:#fff;color:var(--grade-ink);font-size:14px;line-height:1.75}
.grade-page[data-grade="8"]{--grade-accent:#287ea5;--grade-accent-line:#bbd5e3;--grade-accent-wash:#f6fbfd}
.grade-page[data-grade="9"]{--grade-accent:#548561;--grade-accent-line:#c1d8c5;--grade-accent-wash:#f7fbf7}
.grade-page *, .grade-page *::before, .grade-page *::after{box-sizing:border-box}
.grade-page button,.grade-page input{font:inherit}
.grade-page button{cursor:pointer}
.grade-page a{color:inherit;text-decoration:none}
.grade-page :is(a,button,input):focus-visible{outline:3px solid #08728f;outline-offset:2px}
.grade-sprite{position:absolute;width:0;height:0;overflow:hidden}
.grade-page svg:not(.grade-sprite){width:19px;height:19px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round;flex:none}
.grade-shell{display:grid;grid-template-columns:390px minmax(0,1fr);min-height:100vh}
.grade-catalog{position:sticky;top:0;height:100vh;min-width:0;overflow-y:auto;overscroll-behavior:contain;border-left:1px solid var(--grade-line);background:var(--grade-side);scrollbar-color:#cbd0d7 transparent;scroll-padding-top:250px}
.grade-catalog__intro{padding:20px 20px 17px;border-bottom:1px solid var(--grade-line)}
.grade-kicker{color:var(--grade-accent);font-size:12px;font-weight:700}
.grade-catalog__intro h1{margin:4px 0;color:#303641;font-size:21px;font-weight:700;line-height:1.5}
.grade-catalog__intro p{margin:0;color:var(--grade-muted);font-size:12px}
.grade-filter-panel{position:sticky;top:0;z-index:3;padding:12px 20px;border-bottom:1px solid var(--grade-line);background:var(--grade-side)}
.grade-search{display:flex;align-items:center;gap:8px;height:44px;padding:0 11px;border:1px solid #d6dce2;border-radius:7px;background:#fff;color:#737e8b}
.grade-search svg{width:18px!important;height:18px!important}
.grade-search input{width:100%;min-width:0;border:0;outline:0;background:transparent;color:var(--grade-ink);font-size:13px}
.grade-search input:focus-visible{outline:0}
.grade-search:focus-within{outline:2px solid #08728f;outline-offset:2px}
.grade-search input::placeholder{color:#8b929b}
.grade-filter-title{display:block;margin:12px 0 7px;color:#626b76;font-size:12px;font-weight:700}
.grade-filters{display:flex;flex-wrap:wrap;gap:7px}
.grade-filters button{min-height:36px;padding:5px 9px;border:1px solid #d6dce2;border-radius:5px;background:#fff;color:#59616b;font-size:12px;line-height:1.35;transition:color .25s ease-out,border-color .25s ease-out,background-color .25s ease-out}
.grade-filters button:hover{border-color:var(--grade-accent-line);color:var(--grade-accent)}
.grade-filters button[aria-pressed="true"]{border-color:var(--grade-accent);background:var(--grade-accent-wash);color:var(--grade-accent);font-weight:700}
.grade-chapters{padding-bottom:24px}
.grade-chapter{border-bottom:1px solid var(--grade-line)}
.grade-chapter[hidden]{display:none}
.grade-chapter__heading{display:flex;align-items:center;gap:6px;min-height:55px;padding:0 18px}
.grade-chapter__title{flex:1;margin:0;color:var(--grade-ink);font-size:14px;font-weight:700;line-height:1.45}
.grade-chapter__title:hover,.grade-chapter.is-current .grade-chapter__title{color:var(--grade-accent)}
.grade-chapter__toggle{display:grid;place-items:center;width:36px;height:36px;border:0;border-radius:5px;background:transparent;color:#737c88}
.grade-chapter.is-current .grade-chapter__toggle{color:var(--grade-accent)}
.grade-chapter__toggle svg{transition:transform .22s ease-out}
.grade-chapter.is-collapsed .grade-chapter__toggle svg{transform:rotate(180deg)}
.grade-chapter.is-collapsed .grade-chapter__body{display:none}
.grade-chapter__body{padding:0 13px 14px}
.grade-chapter__empty{margin:0;padding:8px 11px;color:#9299a3;font-size:12px}
.grade-resource-group{padding:8px 6px}
.grade-resource-group[hidden]{display:none}
.grade-resource-group h2,.grade-resource-group h3{margin:1px 5px 6px;color:#4b5563;font-size:13px;font-weight:700}
.grade-resource{display:flex;align-items:center;gap:8px;width:100%;min-height:36px;padding:5px;border:0;border-radius:4px;background:transparent;color:#626a75;font-size:13px;line-height:1.4;text-align:right;transition:color .22s ease-out,background-color .22s ease-out}
.grade-resource span{min-width:0;overflow-wrap:anywhere}
.grade-resource:hover,.grade-resource.is-active{background:#f0f2f4;color:var(--grade-ink)}
.grade-resource.is-active{font-weight:700}
.grade-resource[hidden]{display:none}
.grade-resource .grade-resource__icon{width:18px;height:18px;color:var(--grade-accent);stroke-width:1.7}
.grade-no-results{margin:0;padding:22px 18px;color:var(--grade-muted);font-size:13px}
.grade-no-results[hidden]{display:none}
.grade-playlist{display:none}
.grade-playlist #grade-playlist-items{overflow-y:auto;overscroll-behavior:contain;overflow-anchor:none;scrollbar-color:#cbd0d7 transparent}
.grade-playlist__empty{margin:0;padding:20px 14px;color:var(--grade-muted);font-size:13px}
.grade-playlist__empty[hidden]{display:none}
.grade-page .grade-playlist__all{display:block;min-height:44px;padding:11px 14px;border-top:1px solid var(--grade-line);color:var(--grade-accent);font-size:13px;font-weight:700}
.grade-page .grade-playlist__all:hover{text-decoration:underline}
.grade-workspace{min-width:0;padding:0 30px 60px;background:#fff}
.grade-workspace__bar{display:flex;align-items:center;justify-content:space-between;gap:16px;height:61px;border-bottom:1px solid var(--grade-line)}
.grade-toggle-catalog{display:flex;align-items:center;gap:6px;min-height:36px;padding:6px 10px;border:1px solid var(--grade-line);border-radius:6px;background:#fff;color:#6c7480;font-size:12px}
.grade-toggle-catalog:hover{border-color:var(--grade-accent-line);color:var(--grade-accent)}
.grade-toggle-catalog svg{width:16px!important;height:16px!important}
.grade-breadcrumb{color:#747c87;font-size:12px}
.grade-breadcrumb span{color:var(--grade-ink);font-weight:700}
.grade-workspace__inner{max-width:1000px;margin:0 auto}
.grade-initial{padding:28px 0 20px}
.grade-initial[hidden]{display:none}
@media(min-width:901px){.grade-page[data-state="initial"] .grade-lesson,.grade-page[data-state="initial"] .grade-lesson-details,.grade-page[data-state="initial"] .grade-more{display:none}}
.grade-lesson{margin-top:26px}
.grade-lesson__kind{margin:0 0 9px;color:var(--grade-accent);font-size:12px;font-weight:700}
.grade-player{position:relative;display:grid;place-items:center;aspect-ratio:16/9;overflow:hidden;border-radius:8px;background:#28313d;color:#f2f3f5}
.grade-player[hidden]{display:none}
.grade-file-card{display:grid;grid-template-columns:auto minmax(0,auto);align-content:center;align-items:center;justify-content:center;gap:14px 8px;min-height:135px;padding:24px;border:1px solid var(--grade-accent-line);border-radius:8px;background:var(--grade-accent-wash);color:var(--grade-ink);text-align:center}
.grade-file-card[hidden]{display:none}
.grade-file-card>svg{width:20px;height:20px;color:var(--grade-accent)}
.grade-file-card strong{min-width:0;font-size:16px}
.grade-file-card a{grid-column:1/-1;display:inline-flex;align-items:center;justify-content:center;justify-self:center;min-height:44px;padding:8px 15px;border:1px solid var(--grade-accent);border-radius:5px;background:var(--grade-accent);color:#fff}
.grade-file-card a:hover{background:#fff;color:var(--grade-accent)}
.grade-player:focus-visible{outline:3px solid #08728f;outline-offset:3px}
.grade-player__frame{position:absolute;inset:0;display:grid;place-items:center}
.grade-player__frame iframe{width:100%;height:100%;border:0}
.grade-player__empty{margin:0;padding:20px;text-align:center}
.grade-page .grade-player__fallback{padding:12px 16px;color:#fff;text-decoration:underline}
.grade-lesson__heading{display:flex;justify-content:space-between;gap:14px;margin:18px 0 13px}
.grade-lesson__heading h2{margin:0;color:#343b45;font-size:23px;font-weight:700;line-height:1.45}
.grade-lesson__heading p{margin:4px 0 0;color:var(--grade-muted);font-size:13px}
.grade-lesson__heading>span{align-self:start;white-space:nowrap;padding:4px 8px;border:1px solid var(--grade-accent-line);border-radius:5px;color:var(--grade-accent);font-size:12px}
.grade-video-navigation{display:flex;justify-content:space-between;gap:12px;margin-top:15px;padding-top:18px;border-top:1px solid var(--grade-line)}
.grade-video-navigation[hidden]{display:none}
.grade-video-navigation button{display:flex;flex-direction:column;align-items:flex-start;gap:2px;max-width:46%;min-height:48px;padding:7px 12px;border:1px solid var(--grade-accent-line);border-radius:5px;background:#fff;color:var(--grade-accent);text-align:right}
.grade-video-navigation button:last-child{align-items:flex-end;background:var(--grade-accent);color:#fff;text-align:left}
.grade-video-navigation button:disabled{opacity:.42;cursor:not-allowed}
.grade-video-navigation small{font-size:10px}
.grade-video-navigation strong{font-size:12px;line-height:1.45}
.grade-mobile-catalog{display:none}
.grade-more{margin-top:38px;padding-top:25px;border-top:1px solid var(--grade-line)}
.grade-more h2{margin:0 0 14px;font-size:18px;font-weight:700}
.grade-more #grade-more-items{border-top:1px solid var(--grade-line)}
.grade-more .grade-resource{min-height:47px;border-bottom:1px solid var(--grade-line);border-radius:0}
.grade-page .grade-more__book,.grade-page .grade-more__support{display:flex;align-items:center;gap:10px;min-height:50px;padding:8px 5px;color:#59626e;font-size:13px;transition:color .22s ease-out}
.grade-page .grade-more__book{border-top:1px solid var(--grade-line);border-bottom:1px solid var(--grade-line);font-weight:700}
.grade-page .grade-more__book img{width:30px;height:40px;border-radius:3px;object-fit:cover}
.grade-page .grade-more__support{border-top:1px solid var(--grade-line)}
.grade-page .grade-more__support svg{width:20px;height:20px;color:var(--grade-accent)}
.grade-page .grade-more__book:hover,.grade-page .grade-more__support:hover{color:var(--grade-accent)}
.grade-more__empty{margin:0;color:var(--grade-muted);font-size:13px}
.grade-more__empty:empty{display:none}
.grade-shell.is-catalog-hidden{grid-template-columns:minmax(0,1fr)}
.grade-shell.is-catalog-hidden .grade-catalog{display:none}
@media(max-width:900px){
.grade-shell{display:flex;flex-direction:column;min-height:0}
.grade-workspace,.grade-workspace__inner{display:contents}
.grade-workspace__bar,.grade-lesson__kind{display:none}
.grade-catalog{order:2;position:relative;top:auto;height:auto;max-height:none;overflow:visible;border:0}
.grade-lesson{order:1;width:min(calc(100% - 28px),640px);margin:14px auto 0;scroll-margin-top:12px}
.grade-lesson-details{order:3;width:min(calc(100% - 28px),640px);margin:0 auto}
.grade-more{order:4;width:min(calc(100% - 28px),640px);margin:20px auto 48px}
.grade-page[data-state="initial"] .grade-catalog,.grade-page[data-state="initial"] .grade-lesson,.grade-page[data-state="initial"] .grade-lesson-details,.grade-page[data-state="initial"] .grade-more{display:none}
.grade-page[data-state="initial"] .grade-initial{order:0;width:min(calc(100% - 28px),640px);margin:0 auto;padding:20px 0 48px}
.grade-page.is-content-view .grade-catalog__intro,.grade-page.is-content-view .grade-filter-panel,.grade-page.is-content-view .grade-chapters,.grade-page.is-content-view .grade-no-results{display:none}
.grade-page.is-content-view .grade-playlist{display:block}
.grade-page.is-content-view .grade-shell{overflow-anchor:none}
.grade-page.is-content-view .grade-catalog{width:min(calc(100% - 28px),640px);margin:8px auto 0;border:1px solid var(--grade-line);border-radius:6px}
.grade-page.is-content-view .grade-shell:not(.is-catalog-hidden) .grade-catalog{animation:grade-playlist-reveal .26s ease-out both}
.grade-page.is-player-entering .grade-player{animation:grade-player-reveal .38s ease-out both}
.grade-player{width:100%;border-radius:7px;scroll-margin-top:10px}
.grade-mobile-catalog{display:inline-flex;align-items:center;justify-content:center;flex:none;width:44px;height:44px;min-height:44px;margin:0;padding:0;border:0;border-radius:5px;background:transparent;color:var(--grade-accent)}
.grade-mobile-catalog:hover{background:var(--grade-accent-wash)}
.grade-mobile-catalog svg{width:17px;height:17px}
.grade-lesson__heading{align-items:flex-start;justify-content:space-between;gap:8px;width:100%;margin:0;padding:10px 0 8px}
.grade-lesson__heading>div{order:1;flex:1;min-width:0}
.grade-lesson__heading>.grade-mobile-catalog{order:2}
.grade-lesson__heading>span{display:none}
.grade-video-navigation{width:100%;margin:0}
.grade-filter-panel{padding:8px 12px 6px}
.grade-chapter__heading{min-height:56px}
.grade-resource{min-height:44px}
}
@keyframes grade-player-reveal{from{opacity:0;transform:translateY(24px)}to{opacity:1;transform:translateY(0)}}
@keyframes grade-playlist-reveal{from{opacity:0;transform:translateY(-10px)}to{opacity:1;transform:translateY(0)}}
@media(max-width:550px){.grade-page{font-size:14px}.grade-workspace__bar{padding:0 14px}.grade-breadcrumb{font-size:11px}.grade-lesson,.grade-more{width:calc(100% - 28px)}.grade-lesson{margin-top:12px}.grade-lesson__heading h2{font-size:18px}.grade-lesson__heading p{font-size:11px}.grade-catalog__intro h1{font-size:19px}.grade-search input{font-size:14px}.grade-filters button{min-height:44px;padding:7px 9px;font-size:13px}.grade-chapter__title{font-size:15px}.grade-chapter__toggle{width:44px;height:44px}.grade-resource{font-size:14px}.grade-video-navigation strong{font-size:11px}}
.grade-discovery__intro{padding:0 0 21px;border-bottom:1px solid var(--grade-line)}
.grade-discovery__intro h1{margin:3px 0;color:#343b45;font-size:26px;line-height:1.5}
.grade-discovery__intro p{margin:0;color:var(--grade-muted);font-size:13px}
.grade-discovery__tools{padding:20px 0 8px}
@media(min-width:901px){.grade-discovery__tools{display:none}}
.grade-discovery__search{max-width:620px}
.grade-discovery__results{display:flex;align-items:center;justify-content:space-between;gap:12px;min-height:47px;color:var(--grade-muted);font-size:12px}
.grade-discovery__results button{min-height:40px;padding:5px 8px;border:0;background:transparent;color:var(--grade-accent);font-size:12px}
.grade-discovery__results button:hover{text-decoration:underline}
.grade-discovery__results button[hidden],.grade-discovery__chapter[hidden],.grade-discovery__chapter-body[hidden],.grade-discovery__types button[hidden],.grade-discovery__group[hidden],.grade-discovery__more[hidden],.grade-discovery__chapter-count[hidden]{display:none}
.grade-discovery__chapter{margin:14px 0;scroll-margin-top:110px;border:1px solid var(--grade-accent-line);border-radius:7px;background:#fff;overflow:hidden}
.grade-discovery__chapter h2{margin:0}
.grade-discovery__chapter-toggle{display:flex;align-items:center;gap:10px;width:100%;min-height:53px;padding:10px 16px;border:0;background:#fff;color:var(--grade-ink);text-align:right}
.grade-discovery__chapter-toggle:hover{color:var(--grade-accent)}
.grade-discovery__chapter-name{display:flex;align-items:baseline;flex:1;flex-wrap:wrap;gap:3px 9px;min-width:0;font-size:16px}
.grade-discovery__chapter-name>span{color:var(--grade-accent);font-size:12px;font-weight:700;white-space:nowrap}
.grade-discovery__chapter-name strong{font-weight:500}
.grade-discovery__chapter-count{flex:none;color:var(--grade-muted);font-size:11px;font-weight:400;white-space:nowrap}
.grade-discovery__chapter-toggle>svg{width:17px!important;height:17px!important;color:var(--grade-accent);transition:transform .22s ease-out}
.grade-discovery__chapter:not(.is-collapsed) .grade-discovery__chapter-toggle>svg{transform:rotate(180deg)}
.grade-discovery__chapter-body{padding:13px 16px 16px;border-top:1px solid var(--grade-line)}
.grade-discovery__empty{margin:0;color:var(--grade-muted);font-size:13px}
.grade-discovery__types{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;margin-bottom:17px}
.grade-discovery__types button{display:flex;align-items:center;justify-content:space-between;gap:6px;min-height:44px;padding:7px 10px;border:1px solid var(--grade-line);border-radius:5px;background:#fff;color:#59626e;font-size:12px;text-align:right;transition:color .22s ease-out,border-color .22s ease-out,background-color .22s ease-out}
.grade-discovery__types button:hover,.grade-discovery__types button[aria-pressed="true"]{border-color:var(--grade-accent-line);background:var(--grade-accent-wash);color:var(--grade-accent)}
.grade-discovery__types small{color:var(--grade-muted);font-size:11px}
.grade-filter-panel .grade-discovery__types{grid-template-columns:repeat(2,minmax(0,1fr));margin:0}
.grade-filter-panel .grade-discovery__types button{min-width:0}
.grade-filter-panel .grade-discovery__types button span{min-width:0}
.grade-discovery__group{padding:10px 0;border-top:1px solid var(--grade-line)}
.grade-discovery__group h3{margin:0 0 5px;color:#4b5563;font-size:13px;font-weight:700}
.grade-discovery__group .grade-resource{min-height:44px;padding:7px 5px;border-bottom:1px solid #f0f1f3;border-radius:0;color:#636d79}
.grade-discovery__group .grade-resource[hidden]{display:none}
.grade-discovery__group .grade-resource:hover{background:transparent;color:var(--grade-accent)}
.grade-discovery__more{min-height:40px;padding:6px 5px;border:0;background:transparent;color:var(--grade-accent);font-size:12px;font-weight:700;text-align:right}
.grade-discovery__more:hover{text-decoration:underline}
@media(max-width:900px){.grade-discovery__intro h1{font-size:21px}.grade-discovery__types{grid-template-columns:repeat(2,minmax(0,1fr))}.grade-discovery__chapter-toggle{gap:9px;padding:9px 12px}.grade-discovery__chapter-name{display:grid;gap:0;font-size:14px}.grade-discovery__chapter-count{font-size:10px}.grade-discovery__chapter-body{padding:13px 11px 16px}}
@media(max-width:900px){.grade-discovery__chapter{scroll-margin-top:92px}}
@media(max-width:360px){.grade-discovery__chapter-name{font-size:13px}}
@media(prefers-reduced-motion:reduce){.grade-page *{scroll-behavior:auto!important;transition:none!important;animation:none!important}}
