.lesson-main{max-width:1050px}.lesson-main>p{max-width:800px;color:var(--muted)}
.lesson-progress{display:flex;flex-wrap:wrap;gap:8px;list-style:none;padding:0;margin:24px 0}.lesson-progress li{padding:8px 10px;border:1px solid var(--line);border-radius:5px;font-size:12px;color:var(--muted)}.lesson-progress [aria-current=step]{border-color:var(--mint);color:var(--mint)}
#lesson-instructions{max-width:750px}#lesson-instructions li{margin:10px 0;line-height:1.6}
#lesson-fields{display:grid;gap:17px;margin:24px 0}#lesson-fields label{display:grid;gap:8px;font-size:14px}#lesson-fields label.lesson-check{display:flex;align-items:flex-start;line-height:1.6}#lesson-fields input[type=checkbox]{margin-top:5px;flex-shrink:0;width:18px;height:18px}#lesson-fields select,#lesson-fields input[type=text]{width:100%;max-width:650px}#lesson-next{background:var(--mint);color:#153b28;font-weight:650}
.image-pair{display:grid;grid-template-columns:1fr 1fr;gap:20px}.image-panel{min-width:0;border:1px solid #496456;border-radius:8px;padding:15px}.image-panel canvas{display:block;width:100%;height:auto;background:#0e141b;margin:15px 0;cursor:crosshair;border:1px solid #496456}.image-panel .coordinates{display:flex;gap:10px}.coordinates label{min-width:0}.image-panel p{font-size:12px;color:var(--muted)}#lesson-json{white-space:pre-wrap;overflow-wrap:anywhere;font-size:12px;line-height:1.6}#lesson-result{margin-top:25px}
@media(max-width:650px){.image-pair{grid-template-columns:1fr}.lesson-main .brand{font-size:10px}.lesson-progress li{font-size:10px}}
@media print{.lesson-main>p,.lesson-progress,#lesson-instructions,#lesson-form,.lesson-main>a{display:none}#lesson-result,#lesson-title{color:#111}.lesson-main{max-width:none}}