/* Lesson 62 — What is an AI Agent? */
.lesson63-page { font-size:16px; }
.lesson63-page, .lesson63-page * { box-sizing:border-box; }
.lesson63-content { max-width:860px; margin:0 auto; color:#14213d; }
.lesson63-content p, .lesson63-content li, .lesson63-content span, .lesson63-content a, .lesson63-content button { font-size:max(15px,1em); }
.lesson63-breadcrumb { display:flex; gap:9px; align-items:center; flex-wrap:wrap; margin:10px 0 20px; color:#667085; font-size:15px; }
.lesson63-breadcrumb a { color:#4f46e5; text-decoration:none; }
.lesson63-hero { padding:30px 34px; border:1px solid #e5e7eb; border-radius:22px; background:linear-gradient(135deg,#f4f7ff 0%,#fbf7ff 55%,#f4fbff 100%); box-shadow:0 10px 30px rgba(31,41,55,.05); }
.lesson63-label { display:inline-flex; padding:7px 12px; border-radius:999px; background:#ede9fe; color:#5b21b6; font-weight:800; letter-spacing:.04em; font-size:14px!important; }
.lesson63-hero h1 { margin:14px 0 10px; font-size:46px; line-height:1.08; letter-spacing:-.035em; color:#101a3a; }
.lesson63-hero > p { margin:0; max-width:760px; font-size:18px!important; line-height:1.7; color:#344054; }
.lesson63-meta { display:flex; gap:9px; flex-wrap:wrap; margin-top:18px; color:#667085; font-size:15px; }
.lesson63-objectives { margin:24px 0; padding:25px 28px; border:1px solid #dbeafe; border-radius:18px; background:#f7fbff; }
.lesson63-objectives h2 { margin:0 0 12px; font-size:25px; line-height:1.25; }
.lesson63-objectives ul { margin:0; padding-left:23px; }
.lesson63-objectives li { margin:9px 0; line-height:1.6; }
.lesson63-section { display:grid; grid-template-columns:44px minmax(0,1fr); gap:15px; padding:30px 0; border-bottom:1px solid #e5e7eb; }
.lesson63-number { width:36px; height:36px; display:flex; align-items:center; justify-content:center; border:1px solid #c7d2fe; border-radius:50%; color:#4338ca; background:#f5f3ff; font-weight:800; font-size:15px!important; }
.lesson63-body h2 { margin:0 0 11px; font-size:29px; line-height:1.25; letter-spacing:-.02em; }
.lesson63-body h3 { margin:7px 0 5px; font-size:19px; line-height:1.3; }
.lesson63-body p { margin:10px 0; line-height:1.72; color:#27364f; }
.lesson63-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:14px; margin:18px 0; }
.lesson63-card, .lesson63-check, .lesson63-stage, .lesson63-project > div, .lesson63-compare > div { min-width:0; border:1px solid #e1e7ef; border-radius:15px; padding:18px; background:#fff; box-shadow:0 5px 16px rgba(15,23,42,.035); }
.lesson63-card span, .lesson63-stage span, .lesson63-project span, .lesson63-compare span { display:block; margin-bottom:7px; color:#6d28d9; font-weight:800; font-size:13px!important; letter-spacing:.06em; }
.lesson63-card b, .lesson63-project b, .lesson63-compare b { display:block; font-size:18px!important; line-height:1.35; }
.lesson63-card p, .lesson63-stage p, .lesson63-project p, .lesson63-compare p { margin:7px 0 0; }
.lesson63-stage-grid { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:12px; margin:18px 0; }
.lesson63-stage { background:#fafaff; }
.lesson63-flow { display:flex; align-items:stretch; gap:8px; margin:18px 0; overflow-x:auto; padding-bottom:4px; }
.lesson63-flow > div { flex:1 1 150px; min-width:135px; border:1px solid #ddd6fe; border-radius:14px; padding:15px; background:#fbfaff; }
.lesson63-flow > b { align-self:center; flex:0 0 auto; font-size:21px!important; color:#7c3aed; }
.lesson63-flow div b { display:block; font-size:16px!important; }
.lesson63-flow div span { display:block; margin-top:5px; color:#667085; font-size:15px!important; }
.lesson63-callout { display:grid; grid-template-columns:auto minmax(0,1fr); gap:8px; margin:18px 0; padding:16px 18px; border-left:4px solid #6366f1; border-radius:10px; background:#f8fafc; line-height:1.65; }
.lesson63-callout strong { white-space:nowrap; font-size:16px!important; }
.lesson63-callout span { min-width:0; line-height:1.65; }
.lesson63-checklist { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px; margin:18px 0; }
.lesson63-check { background:#fbfffd; }
.lesson63-check b { font-size:17px!important; }
.lesson63-check p { margin-top:6px; }
.lesson63-compare { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:14px; margin:18px 0; }
.lesson63-compare > div:first-child { background:#f8fafc; }
.lesson63-compare > div:last-child { background:#faf5ff; border-color:#ddd6fe; }
.lesson63-project { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px; margin:18px 0; }
.lesson63-project > div { background:#f9fafb; }
.lesson63-quiz { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:14px; margin-top:16px; }
.lesson63-quiz > div { min-width:0; padding:18px; border:1px solid #e1e7ef; border-radius:15px; background:#fff; }
.lesson63-quiz b { display:block; font-size:17px!important; line-height:1.45; }
.lesson63-quiz p { margin:9px 0 0; }
.lesson63-recap { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px; }
.lesson63-recap > div { display:grid; grid-template-columns:32px minmax(0,1fr); gap:10px; align-items:start; padding:13px 15px; border:1px solid #e5e7eb; border-radius:13px; background:#fff; }
.lesson63-recap b { width:30px; height:30px; display:flex; align-items:center; justify-content:center; border-radius:50%; background:#eef2ff; color:#4338ca; font-size:15px!important; }
.lesson63-recap span { line-height:1.55; min-width:0; }
.lesson63-code-note { font-size:15px!important; color:#667085!important; }
.lesson63-bottom-nav { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:10px; margin:25px 0 45px; }
.lesson63-bottom-nav a { min-width:0; display:flex; align-items:center; justify-content:center; text-align:center; min-height:48px; padding:11px 14px; border:1px solid #dbe1ea; border-radius:12px; color:#24324a; text-decoration:none; background:#fff; line-height:1.4; }
.lesson63-bottom-nav a:hover { border-color:#a5b4fc; background:#f8f7ff; }
.sah-lesson-main { min-width:0; }
.sah-lesson-main pre { min-width:0; }
@media (max-width:900px){ .lesson63-content{max-width:100%;} .lesson63-stage-grid{grid-template-columns:repeat(2,minmax(0,1fr));} }
@media (max-width:760px){ .lesson63-hero{padding:24px 20px;border-radius:18px;} .lesson63-hero h1{font-size:36px;} .lesson63-hero > p{font-size:17px!important;} .lesson63-section{grid-template-columns:34px minmax(0,1fr);gap:10px;padding:24px 0;} .lesson63-number{width:32px;height:32px;} .lesson63-body h2{font-size:25px;} .lesson63-grid,.lesson63-checklist,.lesson63-compare,.lesson63-project,.lesson63-quiz,.lesson63-recap{grid-template-columns:1fr;} .lesson63-stage-grid{grid-template-columns:1fr;} .lesson63-flow{margin-right:-4px;} .lesson63-callout{grid-template-columns:1fr;gap:3px;} .lesson63-callout strong{white-space:normal;} .lesson63-bottom-nav{grid-template-columns:1fr;margin-bottom:30px;} }
@media (max-width:480px){ .lesson63-hero h1{font-size:32px;} .lesson63-breadcrumb{margin-top:4px;} .lesson63-objectives{padding:20px;} .lesson63-objectives h2{font-size:22px;} .lesson63-card,.lesson63-check,.lesson63-stage,.lesson63-project > div,.lesson63-compare > div,.lesson63-quiz > div{padding:16px;} }

.lesson63-page{font-size:16px!important}
.lesson63-page p,.lesson63-page li,.lesson63-page a,.lesson63-page span,.lesson63-page strong,.lesson63-page code{font-size:max(15px,1em)!important}
.lesson63-hero{padding:32px 0 24px}.lesson63-label{font-weight:800;letter-spacing:.06em;margin-bottom:10px}.lesson63-hero h1{font-size:46px;line-height:1.1;margin:0 0 14px}.lesson63-hero p{font-size:18px!important;line-height:1.65;max-width:820px}.lesson63-meta{display:flex;gap:10px;flex-wrap:wrap;margin-top:14px;font-weight:700}
.lesson63-objectives{padding:24px;border:1px solid #d8e5f6;border-radius:16px;background:#f7fbff;margin-bottom:38px}.lesson63-objectives h2{font-size:27px;margin:0 0 14px}
.lesson63-section{display:grid;grid-template-columns:40px minmax(0,1fr);gap:12px;margin-bottom:42px}.lesson63-number{width:34px;height:34px;border:1px solid #d9cfff;border-radius:50%;display:flex;align-items:center;justify-content:center;font-weight:800}.lesson63-body h2{font-size:28px;line-height:1.25;margin:0 0 15px}.lesson63-body p,.lesson63-body li{line-height:1.7}.lesson63-body ul,.lesson63-body ol{padding-left:24px}
.lesson63-callout{padding:18px 20px;border-left:4px solid #6f00ff;background:#f8f9fb;border-radius:8px;display:flex;gap:8px;line-height:1.65}.lesson63-callout span{display:block}
.lesson63-flow{display:flex;flex-wrap:wrap;align-items:center;gap:10px;margin-top:20px}.lesson63-flow>div{min-width:125px;flex:1;padding:16px;border:1px solid #ddd5ff;border-radius:12px;background:#fff}.lesson63-flow>div span{display:block;margin-top:6px;line-height:1.5}
.lesson63-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}.lesson63-card{padding:20px;border:1px solid #e0e3e8;border-radius:14px;background:#fff}.lesson63-card span,.lesson63-stage span,.lesson63-project span{display:block;font-weight:800;letter-spacing:.04em;margin-bottom:7px}.lesson63-card b{display:block;font-size:19px!important;margin-bottom:7px}
.lesson63-compare{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}.lesson63-compare>div{padding:20px;border:1px solid #e0e3e8;border-radius:14px;background:#fff}.lesson63-compare b{display:block;font-size:19px!important;margin-bottom:7px}
.lesson63-stage-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}.lesson63-stage{padding:20px;border:1px solid #e0e3e8;border-radius:14px;background:#fff}.lesson63-stage h3{font-size:20px;margin:0 0 8px}
.lesson63-checklist{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}.lesson63-check{padding:18px;border:1px solid #e0e3e8;border-radius:12px;background:#f8fafc}.lesson63-check b{font-size:18px!important;display:block;margin-bottom:6px}
.lesson63-project{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}.lesson63-project>div{padding:18px;border:1px solid #e0e3e8;border-radius:12px;background:#fff}.lesson63-project b{display:block;font-size:18px!important;margin-bottom:6px}
.lesson63-quiz{display:grid;gap:14px}.lesson63-quiz>div{padding:17px 18px;border:1px solid #e0e3e8;border-radius:12px;background:#fff}.lesson63-recap{display:grid;gap:10px}.lesson63-recap>div{display:grid;grid-template-columns:45px 1fr;gap:12px;padding:14px 16px;border:1px solid #e0e3e8;border-radius:10px;background:#fff}.lesson63-recap b{font-size:18px!important}
.lesson63-code-note{font-size:15px!important;margin-top:10px}.lesson63-page pre{font-size:15px!important;line-height:1.65;overflow-x:auto}.lesson63-bottom-nav{display:grid;grid-template-columns:1fr 1fr 1fr;gap:14px;margin:44px 0}.lesson63-bottom-nav a{display:block;padding:15px 16px;border:1px solid #dfe3e8;border-radius:10px;text-decoration:none;font-weight:700;line-height:1.4}
@media(max-width:900px){.lesson63-hero h1{font-size:40px}.lesson63-compare{grid-template-columns:1fr}.lesson63-project{grid-template-columns:1fr}}
@media(max-width:760px){.lesson63-hero{padding:24px 0 18px}.lesson63-hero h1{font-size:34px}.lesson63-hero p{font-size:16px!important}.lesson63-section{grid-template-columns:32px minmax(0,1fr);gap:9px}.lesson63-body h2{font-size:25px}.lesson63-grid,.lesson63-stage-grid,.lesson63-checklist{grid-template-columns:1fr}.lesson63-flow{display:grid;grid-template-columns:1fr}.lesson63-flow>b{display:none}.lesson63-bottom-nav{grid-template-columns:1fr}.lesson63-callout{display:block}}
