@import url("/practice-cards.css");
/* Dedicated lessons reuse the existing viewer typography and controls. */
.lesson-document .lesson-sheet{max-width:900px;margin:32px auto;border:1px solid var(--line);border-radius:14px;background:var(--paper)}
.lesson-document .dialoghead{position:sticky;top:0;z-index:2;display:grid;grid-template-columns:auto minmax(0,1fr) auto;border-radius:14px 14px 0 0;gap:12px;background:var(--paper)}
.lesson-document .lesson-back{font-size:12px;white-space:nowrap}
.lesson-document #lessonTag{font-size:10px;color:var(--muted);min-width:0;overflow-wrap:anywhere}
.lesson-document #lessonContent{padding-top:25px}
@media(max-width:520px){.lesson-document .lesson-sheet{margin:20px auto}.lesson-document .dialoghead{padding:18px 22px}}

.lesson-document .lesson-close{display:inline-flex;align-items:center;justify-content:center;justify-self:end;align-self:start;width:40px;height:40px;flex:none;border:0;background:transparent;color:var(--ink);font-size:22px;border-radius:6px}

/* The document title keeps the viewer's existing h2 typography. */
.lesson-document #lessonContent h1.lesson-title-heading{font-size:35px;line-height:normal;letter-spacing:-1.2px;margin:0 0 17px}
@media(max-width:520px){.lesson-document #lessonContent h1.lesson-title-heading{font-size:29px}}

/* Semantic section levels retain the existing viewer's text sizes and spacing. */
.lesson-document #lessonContent h2.lesson-section-heading{font-size:19px;letter-spacing:-.5px;margin:28px 0 1em;line-height:normal}
.lesson-document #lessonContent h3.lesson-example-heading{font-size:1em;letter-spacing:normal;margin:1.33em 0;line-height:normal}
.lessonnav a.secondary{display:inline-flex;align-items:center;justify-content:center;font:inherit;text-decoration:none}