#detailbody .atlas-lesson { margin: 20px 0; }
#detailbody .atlas-lesson h3 { font-size: 1.2rem; margin: 0 0 8px; }
#detailbody .atlas-lesson-video { display: block; width: min(100%, 360px); max-height: 72vh; height: auto; margin: 14px auto; border-radius: 14px; background: #f8f5ed; object-fit: contain; }
#detailbody .atlas-demo-video { display: block; width: 100%; max-height: 65vh; margin-top: 14px; border-radius: 12px; background: #111; object-fit: contain; }
#detailbody .atlas-lesson-phases, #detailbody .atlas-lesson-demo { margin: 18px 0; border: 1px solid var(--line, #718096); border-radius: 12px; padding: 14px; }
#detailbody .atlas-lesson-phases summary, #detailbody .atlas-lesson-demo summary { cursor: pointer; font-weight: 700; line-height: 1.5; }
#detailbody .atlas-lesson-phases summary:focus-visible, #detailbody .atlas-lesson-demo summary:focus-visible { outline: 3px solid #d58b28; outline-offset: 4px; }
#detailbody .atlas-lesson-phases figure { margin: 16px 0 0; }
#detailbody .atlas-lesson-phases img { display: block; width: 100%; height: auto; border-radius: 8px; }
#detailbody .atlas-lesson-phases figcaption { margin-top: 10px; font-size: .85rem; line-height: 1.5; }
#detailbody .atlas-media-status:empty { display: none; }
@media (max-width: 480px) { #detailbody .atlas-lesson-video { max-height: 68vh; } #detailbody .atlas-lesson-phases, #detailbody .atlas-lesson-demo { padding: 10px; } }