#ol-studio .lesson-video-area{margin-top:20px;border:1px solid #dce8e0;border-radius:18px;overflow:hidden;background:#f5f9f6}
#ol-studio .lesson-media-toolbar{display:flex;align-items:center;justify-content:space-between;padding:12px 18px;color:#274b39;font-size:13px}
#ol-studio .lesson-media-toolbar select{background:#fff;border:1px solid #cbded2;border-radius:9px;padding:9px 12px;margin-left:12px;font:inherit;color:#163d2b;min-width:120px}
#ol-studio .lesson-video-area video{display:block;width:100%;max-height:58dvh;aspect-ratio:16/9;background:#102b20;object-fit:contain}
#ol-studio .lesson-video-area audio{display:none}
#ol-studio .lesson-caption-tile{box-sizing:border-box;margin:10px 0 0;padding:10px 16px;border:1px solid #dce8e0;border-radius:12px;background:#f2f7f3;color:#163d2b;min-width:0}
#ol-studio .lesson-caption-header{display:flex;align-items:center;justify-content:space-between;gap:12px;color:#546b5e;font-size:11px;font-weight:600;letter-spacing:.3px}
#ol-studio .lesson-caption-actions{display:flex;align-items:center;gap:8px}
#ol-studio .lesson-caption-toggle{border:0;background:transparent;color:#176b43;font:inherit;text-decoration:underline;cursor:pointer;min-height:32px;padding:4px 8px}
#ol-studio .lesson-caption-toggle:focus-visible{outline:2px solid #246a47;outline-offset:2px;border-radius:4px}
#ol-studio .lesson-caption-text{font-size:15px;line-height:1.5;min-height:1.5em;margin:4px 0 0;white-space:pre-line;overflow-wrap:anywhere}
#ol-studio .lesson-caption-text[hidden]{display:none}
#ol-studio .lesson-video-area:fullscreen{display:flex;flex-direction:column;max-width:none!important;width:100%;height:100%;box-sizing:border-box;background:#f5f9f6;padding:18px;overflow:auto}
#ol-studio .lesson-video-area:fullscreen video{flex:1;min-height:0;height:0!important;max-height:none;width:100%;object-fit:contain}
#ol-studio .lesson-video-area:fullscreen .lesson-media-toolbar,#ol-studio .lesson-video-area:fullscreen .lesson-caption-tile,#ol-studio .lesson-video-area:fullscreen .lesson-media-status{flex-shrink:0}
#ol-studio .lesson-media-status{font-size:12px;padding:12px 18px;margin:0;color:#546b5e;line-height:1.6}
#ol-studio[data-media-step=watch] .concept-visual,#ol-studio[data-media-step=watch] #concept-example,#ol-studio[data-media-step=watch] .s-code-card,#ol-studio[data-media-step=watch] #studio-caption,#ol-studio[data-media-step=watch] .s-action-area{display:none!important}
@media(min-width:1024px){#ol-studio[data-media-step=watch] .activity-card{display:flex;flex-direction:column;gap:16px}#ol-studio[data-media-step=watch] .s-stage{overflow:auto;flex:1;min-height:0;width:100%;padding:0}#ol-studio[data-media-step=watch] .s-lesson{margin:0;padding:0}#ol-studio[data-media-step=watch] #studio-next{flex:none;margin:0}#ol-studio[data-media-step=theory] .lesson-theory{font-size:14px}}
@media(max-width:767px){#ol-studio .lesson-media-toolbar{padding:10px}#ol-studio .lesson-media-status{padding:12px}#ol-studio .lesson-video-area{border-radius:12px}#ol-studio .lesson-video-area video{max-height:none}}

/* Watch-only refinement: keep the editor, quiz and project layouts intact. */
#ol-studio[data-media-step=watch] .s-lesson{min-width:0}
#ol-studio .lesson-watch-objective{margin-top:22px;padding-left:14px;border-left:3px solid #a4c5b0;color:#546b5e;font-size:14px;line-height:1.65}
#ol-studio .lesson-watch-objective strong{display:block;color:#274b39;margin-bottom:6px;font-weight:600}
#ol-studio .lesson-watch-objective p{margin:0}
#ol-studio[data-media-step=watch] .lesson-video-area{min-width:0;background:transparent;border:0;border-radius:0}
#ol-studio[data-media-step=watch] .lesson-video-area video{height:auto;max-height:none;border-radius:12px;object-fit:contain}
#ol-studio[data-media-step=watch] .lesson-media-toolbar{padding:0 0 12px;gap:12px;flex-wrap:wrap}
#ol-studio[data-media-step=watch] .lesson-media-toolbar label{display:flex;align-items:center;gap:12px;flex-wrap:wrap}
#ol-studio[data-media-step=watch] .lesson-media-toolbar select{margin:0;min-height:44px}
#ol-studio[data-media-step=watch] .lesson-media-status{padding:8px 0 0;font-size:12px}
@media(min-width:1024px){
 #ol-studio[data-media-step=watch] .s-content{height:calc(100dvh - 72px)}
 #ol-studio[data-media-step=watch] .activity-card{padding:22px;gap:12px}
 #ol-studio[data-media-step=watch] .s-lesson{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,var(--watch-media-width,1.4fr));gap:24px;align-items:start;max-width:none;height:auto}
 #ol-studio[data-media-step=watch] .s-heading-row{margin-bottom:8px}
 #ol-studio[data-media-step=watch] .lesson-journey-strip{padding:4px 0;margin-bottom:8px}
 #ol-studio[data-media-step=watch] .s-footer{margin-top:8px;min-height:26px;padding-top:4px}
 #ol-studio[data-media-step=watch] .lesson-media-toolbar{padding-bottom:8px}
 #ol-studio[data-media-step=watch] .lesson-media-toolbar select{min-height:36px;padding:7px 12px}
 #ol-studio[data-media-step=watch] .s-lesson-header{max-width:62ch}
 #ol-studio[data-media-step=watch] .lesson-caption-tile{padding:8px 14px}
 #ol-studio[data-media-step=watch] .lesson-caption-toggle{min-height:28px;padding:2px 6px}
 #ol-studio[data-media-step=watch] .lesson-media-status{padding-top:4px;font-size:11px}
 #ol-studio[data-media-step=watch] .lms-values,#ol-studio[data-media-step=watch] .lms-visible-tests{display:none}
 #ol-studio[data-media-step=watch] .s-lesson-header h1{font-size:30px;line-height:1.18}
 #ol-studio[data-media-step=watch] .s-description p{font-size:15px;line-height:1.7}
 #ol-studio[data-media-step=watch] .lesson-video-area{margin:0;align-self:start;width:100%}
}
@media(max-width:1023px){
 #ol-studio[data-media-step=watch] .s-lesson{display:block}
 #ol-studio[data-media-step=watch] .lesson-video-area{margin-top:22px}
}
.lesson-media-fallback{border:1px solid #b5cfbd;border-radius:8px;background:#edf6ef;color:#153f30;padding:10px 14px;font:inherit;cursor:pointer;min-height:44px}.lesson-media-fallback[hidden]{display:none}.lesson-media-fallback:focus-visible{outline:2px solid #246a47;outline-offset:3px}
.mobile-navigation-account{padding:20px 12px;margin-top:18px;border-top:1px solid #d6e5da;color:#153f30}.mobile-navigation-account p{font-size:12px;line-height:1.5;color:#61776b;margin:6px 0 14px}.mobile-navigation-account button{border:1px solid #b9cdbf;background:#eef5f0;color:#153f30;border-radius:10px;min-height:44px;padding:10px 18px;font:inherit;cursor:pointer}