.lesson-workspace{--session-board-size:100%;overflow-wrap:anywhere;width:100%;max-width:1120px;margin-inline:auto}.lesson-heading{margin-bottom:8px}.lesson-context{justify-content:space-between;align-items:center;gap:8px;display:flex}.lesson-return{min-height:48px;color:var(--color-primary);align-items:center;gap:6px;font-size:.875rem;display:inline-flex}.lesson-phase-label{text-align:right;color:var(--color-muted-foreground);font-size:.75rem}.lesson-heading h1{margin:0;font-size:1.125rem;font-weight:700;line-height:1.35}.lesson-phase-progress{gap:4px;margin-top:8px;display:flex}.lesson-phase-progress span{border-radius:999px;flex:1;height:4px}.lesson-activity-grid{grid-template-columns:minmax(0,1fr);align-items:start;gap:8px;display:grid}.lesson-board{width:100%;min-width:0}.lesson-panel{flex-direction:column;gap:8px;min-width:0;display:flex}.lesson-comment{border:1px solid var(--color-primary);background:var(--color-card);border-radius:12px;padding:8px 12px}.lesson-comment-wrong{border-color:var(--color-destructive);background:color-mix(in srgb, var(--color-destructive) 7%, var(--color-card))}.lesson-comment-correct{border-color:var(--color-success)}.lesson-explanation{font-size:.875rem;line-height:1.4}.lesson-explanation-detail summary{cursor:pointer;min-height:48px;color:var(--color-primary);justify-content:space-between;align-items:center;gap:8px;font-size:.875rem;font-weight:600;display:flex}.lesson-explanation-detail[open] summary svg{transform:rotate(180deg)}.lesson-primary-actions{flex-wrap:wrap;gap:8px;display:flex}.lesson-button{border-radius:10px;justify-content:center;align-items:center;gap:8px;min-width:48px;min-height:48px;padding:8px 12px;font-size:.875rem;font-weight:600;display:inline-flex}.lesson-primary-actions .lesson-button{flex:8rem}.lesson-button-primary{border:1px solid var(--color-primary);background:var(--color-primary);color:var(--color-primary-foreground)}.lesson-button-secondary{border:1px solid var(--color-primary);background:var(--color-card);color:var(--color-primary)}.lesson-button-secondary:hover,.lesson-icon-button:hover{background:var(--color-surface)}.lesson-playback-controls{flex-wrap:wrap;gap:8px;display:flex}.lesson-icon-button{border:1px solid var(--color-border);border-radius:10px;justify-content:center;align-items:center;min-width:48px;min-height:48px;display:inline-flex}.lesson-speed{max-width:100%;margin-left:auto}.lesson-speed select{border:1px solid var(--color-border);background:var(--color-card);border-radius:10px;max-width:100%;min-height:48px;padding:8px;font-size:1rem}.lesson-details{border:1px solid var(--color-border);background:var(--color-card);border-radius:10px}.lesson-details summary{cursor:pointer;align-items:center;gap:8px;min-height:48px;padding:8px 12px;font-size:.875rem;font-weight:600;display:flex}.lesson-details>p{padding:0 12px 12px;font-size:.875rem;line-height:1.5}.lesson-workspace summary{min-height:48px}.lesson-workspace button:disabled{opacity:.4}.lesson-workspace :is(button,a,summary,select):focus-visible{outline:3px solid var(--color-primary);outline-offset:3px}.lesson-workspace ol button{min-height:48px}@media (width>=900px){.lesson-heading h1{font-size:1.375rem}.lesson-activity-grid{grid-template-columns:minmax(0,1fr) minmax(280px,.75fr);gap:24px}.lesson-board{max-width:min(100%,max(320px,100dvh - 208px));margin-inline:auto}.lesson-comment{padding:12px 16px}}@media (width<=359px){.lesson-context{flex-wrap:wrap}.lesson-phase-label{text-align:left}}
