.lesson-page{overflow:hidden}.lesson-layout,.lesson-page #play-header{max-width:1056px}.lesson-layout{--watch-controls-h: 3.5rem;--lesson-video-height: min( 25dvh, calc(480px / var(--watch-video-ratio)), calc((100vw - 1rem) / var(--watch-video-ratio)) );--lesson-reading-inset: calc(var(--lesson-video-height) + 1rem);display:grid;grid-template-columns:minmax(0,1fr);grid-template-rows:minmax(0,1fr) auto;gap:.5rem;height:var(--shot-usable-dvh, 100dvh);margin-inline:auto;padding:4rem .5rem max(.5rem,env(safe-area-inset-bottom))}.lesson-video{position:relative;z-index:1;grid-area:1 / 1;width:calc(var(--lesson-video-height) * var(--watch-video-ratio));height:var(--lesson-video-height);align-self:start;margin-inline:auto}.lesson-reading{grid-area:1 / 1;min-width:0;min-height:0;overflow-y:auto;scroll-padding-block:var(--lesson-reading-inset) 1rem;margin-inline:-.25rem;padding-inline:.25rem}.lesson-article,.lesson-controls{max-width:672px;margin-inline:auto}.lesson-article{display:flex;flex-direction:column;gap:2rem;padding:var(--lesson-reading-inset) .5rem 2rem;overflow-wrap:anywhere}.lesson-sentence,.lesson-article [data-note-id]{scroll-margin-block:1rem}.lesson-enhanced .lesson-original [data-word-index]{color:hsl(var(--muted-foreground))}.lesson-enhanced .lesson-original [data-played]{color:hsl(var(--foreground))}.lesson-enhanced .lesson-original .play-active-word{color:transparent}.lesson-controls{grid-area:2 / 1;position:relative;min-width:0;height:var(--watch-controls-h);width:100%}.lesson-dictionary,.lesson-enhanced [data-lesson-static]{display:none}.lesson-practice>summary{list-style:none}.lesson-practice>summary::-webkit-details-marker{display:none}.lesson-practice>summary [data-practice-chevron] svg{transform:rotate(-90deg);transition:transform .15s ease-out}.lesson-practice[open]>summary [data-practice-chevron] svg{transform:rotate(0)}@media (prefers-reduced-motion: reduce){.lesson-practice>summary [data-practice-chevron] svg{transition:none}}.lesson-article summary{list-style-position:inside}@media (min-width: 640px){.lesson-video{margin-inline:auto 0}}@media (min-width: 768px){.lesson-layout{--lesson-reading-inset: 1rem;grid-template-columns:minmax(0,1fr) 320px;grid-template-rows:280px minmax(0,1fr) var(--watch-controls-h);gap:1rem;padding-inline:1rem}.lesson-reading{grid-column:1;grid-row:1 / 3}.lesson-article{padding-top:0;padding-inline:0}.lesson-controls{grid-column:1;grid-row:3}.lesson-dictionary{display:block;grid-column:2;grid-row:1}.lesson-video{grid-column:2;grid-row:2;width:auto;max-width:320px;height:min(100%,calc(320px / var(--watch-video-ratio)));margin-inline:auto}}@media (min-width: 1024px){.lesson-layout{-moz-column-gap:2rem;column-gap:2rem}}@media (max-height: 600px){.lesson-page{overflow:auto}.lesson-layout{--lesson-reading-inset: 1rem;height:auto;min-height:var(--shot-usable-dvh, 100dvh)}.lesson-reading{overflow:clip visible}.lesson-article{padding-top:0}.lesson-controls{position:sticky;bottom:max(.5rem,env(safe-area-inset-bottom));z-index:20;border-radius:9999px}.lesson-page #play-header-shell,.lesson-controls{background-color:hsl(var(--background))}.lesson-page :is(a,button,summary,input),.lesson-sentence,.lesson-original,.lesson-article [data-note-id]{scroll-margin-block:4.5rem}}@media (max-width: 767px) and (max-height: 600px){.lesson-layout{grid-template-rows:auto auto auto}.lesson-reading{grid-row:2}.lesson-controls{grid-row:3}}
