/* A restrained shared space; reading content remains opaque. */
@view-transition{navigation:auto}
::view-transition-group(course-cover),::view-transition-group(course-title){animation-duration:360ms;animation-timing-function:cubic-bezier(.2,.8,.2,1)}
::view-transition-old(root){animation:space-out 180ms ease-out both}::view-transition-new(root){animation:space-in 280ms cubic-bezier(.2,.8,.2,1) both}
@keyframes space-in{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}@keyframes space-out{to{opacity:0;transform:translateY(-6px)}}
.heading{justify-content:flex-start}.heading h1{flex:1}.heading .source{margin-left:auto}.lesson-cover{width:96px;height:54px;object-fit:cover;border-radius:12px;flex-shrink:0;box-shadow:0 3px 10px #25253f0a}
.course-cover{contain:paint}.course-link{transition:border-color 180ms,box-shadow 180ms;background:#fff}.course-link:hover{box-shadow:0 12px 30px #3431550a}.course-link:active,button:active{transform:none}
.modes{position:relative;isolation:isolate}.modes button{position:relative;z-index:1;background:none!important;box-shadow:none!important;transition:color 140ms}.mode-plate{position:absolute;left:4px;top:4px;bottom:4px;border-radius:9px;background:#fff;box-shadow:0 2px 6px #22223c0b;z-index:0;pointer-events:none}
.player{background:linear-gradient(150deg,#ffffffef,#f5f3ffed);border-color:#ffffff;box-shadow:0 12px 35px #34315512,0 1px 3px #34315509;bottom:calc(16px + env(safe-area-inset-bottom))}.settings-panel{animation:none!important;border-color:#fff;background:linear-gradient(150deg,#fffffff7,#f9f8fff7);box-shadow:0 16px 48px #34315517,0 1px 3px #34315508;will-change:auto}.settings-heading{touch-action:none;cursor:grab;user-select:none}.settings-heading:active{cursor:grabbing}.settings-heading>span:before{content:'';display:inline-block;width:16px;height:3px;border-radius:2px;background:#d4d2df;vertical-align:middle;margin-right:8px}.setting-row{min-height:52px}.settings summary,#previous,#next,#all,.primary{min-width:44px;min-height:44px}.controls{gap:1px}.source,.back-link{color:#737589}.library-title>span,.course-meta{color:#77788a}
@media(max-width:600px){.lesson-cover{width:72px;height:48px;border-radius:10px}.heading{gap:12px}.heading h1{font-size:19px}.heading .source{font-size:11px}.player{max-width:300px}.shell{padding-bottom:130px}}
@media(prefers-reduced-motion:reduce){@view-transition{navigation:none}::view-transition-group(*),::view-transition-old(*),::view-transition-new(*){animation:none!important}}
html[data-reduced-motion] *,html[data-reduced-motion] *:before,html[data-reduced-motion] *:after{animation:none!important;transition:none!important;scroll-behavior:auto!important}html[data-reduced-motion]::view-transition-group(*),html[data-reduced-motion]::view-transition-old(*),html[data-reduced-motion]::view-transition-new(*){animation:none!important}