/* Área do aluno: reaproveita os tokens do admin.css */
.container { max-width: 70rem; margin: 0 auto; padding: 1.5rem 1rem 3rem; }
.topbar { display: flex; align-items: center; gap: 1rem; padding: .6rem 1rem; background: var(--md-surface-container); position: sticky; top: 0; z-index: 10; }
.topbar .brand { padding: 0; font-weight: 600; }
.topnav { display: flex; gap: .25rem; }
.topnav a { padding: .4rem .8rem; border-radius: 999px; text-decoration: none; color: var(--md-on-surface); }
.topnav a:hover { background: var(--md-surface-high); }
.lead { font-size: 1.1rem; color: var(--md-on-surface-variant); }
.price { font-size: 1.8rem; font-weight: 500; color: var(--md-primary); margin: 0 0 1rem; }
.prewrap { white-space: pre-wrap; }
.course-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(16rem, 1fr)); gap: 1rem; }
.course-card { display: block; text-decoration: none; color: inherit; margin: 0; }
.course-card img { width: 100%; aspect-ratio: 16 / 9; object-fit: cover; border-radius: var(--md-radius-sm); margin-bottom: .75rem; }
.course-card h2 { font-size: 1.1rem; margin-bottom: .4rem; }
.course-card h2 a { color: inherit; text-decoration: none; }
.progress { height: .5rem; border-radius: 999px; background: var(--md-surface-high); overflow: hidden; margin: .5rem 0; }
.progress > span { display: block; height: 100%; background: var(--md-primary); }
.module-card.locked { opacity: .75; }
.module-card h3, .outline h3 { margin: 0 0 .5rem; font-size: 1.05rem; font-weight: 500; }
.lesson-list { margin: 0; padding-left: 1.4rem; }
.lesson-list li { padding: .3rem 0; display: list-item; }
.lesson-list li a { text-decoration: none; }
.lesson-list li.current > a { font-weight: 700; }
.player-layout { display: grid; grid-template-columns: minmax(0, 1fr) 20rem; gap: 1.5rem; align-items: start; }
.video { background: #000; border-radius: var(--md-radius); overflow: hidden; margin-bottom: 1rem; }
.video iframe, .video video { display: block; width: 100%; aspect-ratio: 16 / 9; border: 0; }
.video p { padding: 2rem; color: #ccc; }
.lesson-nav { margin-top: 1.5rem; }
.outline { position: sticky; top: 4.5rem; max-height: calc(100vh - 6rem); overflow-y: auto; }
@media (max-width: 900px) { .player-layout { grid-template-columns: 1fr; } .outline { position: static; max-height: none; } }