/* Lesson 8 only. Shared components are intentionally not styled here. */
.lesson9-page .lesson9-content { min-width:0; }
.lesson9-page .lesson9-breadcrumb { display:flex; flex-wrap:wrap; gap:7px; margin:2px 0 18px; color:#7b7390; font-size: 14px; }
.lesson9-page .lesson9-breadcrumb a { color:#675f79; text-decoration:none; }
.lesson9-page .lesson9-breadcrumb a:hover { color:#651fff; }
.lesson9-page .lesson9-header { padding:0 0 28px; }
.lesson9-page .lesson9-kicker,.lesson9-page .lesson9-practice-label,.lesson9-page .lesson9-quiz-label { color:#651fff; font-size: 14px; font-weight:800; letter-spacing:.07em; }
.lesson9-page .lesson9-header h1 { margin:7px 0 12px; color:#111827; font-size:clamp(38px,4vw,56px); line-height:1.08; letter-spacing:-.045em; }
.lesson9-page .lesson9-lead { max-width:830px; margin:0 0 12px; color:#4b5563; font-size:18px; line-height:1.7; }
.lesson9-page .lesson9-meta { display:flex; flex-wrap:wrap; gap:8px; color:#7a7287; font-size:14px; }
.lesson9-page .lesson9-objectives { margin:0 0 42px; padding:21px 23px; border:1px solid #e6ddec; border-radius:10px; background:#fff; }
.lesson9-page .lesson9-objectives h2 { margin:0 0 10px; color:#171526; font-size:20px; }
.lesson9-page .lesson9-objectives ul { margin:0; padding-left:21px; }
.lesson9-page .lesson9-objectives li { margin:6px 0; color:#454052; font-size:15px; line-height:1.65; }
.lesson9-page .lesson9-section { display:grid; grid-template-columns:32px minmax(0,1fr); gap:13px; margin:0 0 48px; scroll-margin-top:110px; }
.lesson9-page .lesson9-number { width:28px; height:28px; display:flex; align-items:center; justify-content:center; border-radius:50%; background:#651fff; color:#fff; font-size:14px; font-weight:800; }
.lesson9-page .lesson9-section h2 { margin:0 0 10px; color:#111827; font-size:27px; line-height:1.3; }
.lesson9-page .lesson9-section p,.lesson9-page .lesson9-practice p,.lesson9-page .lesson9-quiz p,.lesson9-page .lesson9-recap li { color:#344054; font-size:16px; line-height:1.78; }
.lesson9-page .lesson9-section p { margin:0 0 12px; }
.lesson9-page .lesson9-pipeline,.lesson9-page .lesson9-example-grid,.lesson9-page .lesson9-two-col,.lesson9-page .lesson9-experiment-grid,.lesson9-page .lesson9-summary-grid { display:grid; gap:12px; margin-top:18px; }
.lesson9-page .lesson9-pipeline { grid-template-columns:1fr auto 1fr auto 1fr auto 1.2fr auto 1fr; align-items:stretch; }
.lesson9-page .lesson9-pipeline>div,.lesson9-page .lesson9-api-flow>div { padding:16px 13px; border:1px solid #dfe4ec; border-radius:10px; background:#fff; }
.lesson9-page .lesson9-pipeline>div b { display:inline-flex; width:25px; height:25px; align-items:center; justify-content:center; border-radius:50%; background:#f0e6ff; color:#5f00dc; font-size: 14px; }
.lesson9-page .lesson9-pipeline strong,.lesson9-page .lesson9-pipeline span { display:block; }
.lesson9-page .lesson9-pipeline strong { margin-top:8px; color:#172033; font-size:15px; }
.lesson9-page .lesson9-pipeline span { margin-top:4px; color:#667085; font-size: 14px; line-height:1.45; }
.lesson9-page .lesson9-pipeline i,.lesson9-page .lesson9-api-flow i { align-self:center; color:#8b6eb5; font-style:normal; font-size:20px; }
.lesson9-page .lesson9-pipeline .is-focus { border-color:#b27cff; background:#faf5ff; }
.lesson9-page .lesson9-note,.lesson9-page .lesson9-mental-model,.lesson9-page .lesson9-explain { margin-top:16px; padding:13px 15px; border:1px solid #e4d7ef; border-radius:9px; background:#fbf7ff; color:#4b4458; font-size:14px; line-height:1.65; }
.lesson9-page .lesson9-note strong,.lesson9-page .lesson9-mental-model strong,.lesson9-page .lesson9-explain strong { color:#5f00dc; }
.lesson9-page .lesson9-token-example { display:grid; grid-template-columns:1fr auto 1fr; align-items:center; gap:14px; margin:18px 0; }
.lesson9-page .lesson9-token-input,.lesson9-page .lesson9-token-output { padding:17px; border:1px solid #dfe4ec; border-radius:10px; background:#fff; }
.lesson9-page .lesson9-token-input span,.lesson9-page .lesson9-token-output>span { display:block; color:#651fff; font-size: 14px; font-weight:800; letter-spacing:.07em; }
.lesson9-page .lesson9-token-input strong { display:block; margin-top:7px; color:#172033; font-size:18px; }
.lesson9-page .lesson9-token-output div { display:flex; flex-wrap:wrap; gap:7px; margin-top:8px; }
.lesson9-page .lesson9-token-output b { padding:6px 8px; border:1px solid #ddd6fe; border-radius:6px; background:#f5f3ff; color:#4c1d95; font-size:14px; }
.lesson9-page .lesson9-token-arrow { color:#8b6eb5; font-size:22px; }
.lesson9-page .lesson9-example-grid { grid-template-columns:1fr 1fr; }
.lesson9-page .lesson9-example-grid>div,.lesson9-page .lesson9-two-col>div,.lesson9-page .lesson9-experiment-grid>div { padding:16px; border:1px solid #dfe4ec; border-radius:10px; background:#fff; }
.lesson9-page .lesson9-example-grid strong,.lesson9-page .lesson9-example-grid span { display:block; }
.lesson9-page .lesson9-example-grid strong { color:#651fff; font-size: 14px; text-transform:uppercase; letter-spacing:.05em; }
.lesson9-page .lesson9-example-grid span { margin-top:7px; color:#667085; font-size:14px; line-height:1.6; }
.lesson9-page .lesson9-vector-card { display:grid; grid-template-columns:auto minmax(80px,1fr) auto minmax(180px,2fr); align-items:center; gap:12px; margin:18px 0; padding:18px; border:1px solid #dfe4ec; border-radius:10px; background:#fff; }
.lesson9-page .lesson9-vector-label { color:#651fff; font-size: 14px; font-weight:800; letter-spacing:.07em; }
.lesson9-page .lesson9-vector-card strong { color:#172033; font-size:21px; }
.lesson9-page .lesson9-vector-arrow { color:#8b6eb5; font-size:22px; }
.lesson9-page .lesson9-vector-card code { overflow:auto; color:#155e75; font-size:14px; }
.lesson9-page .lesson9-transformer-diagram { display:grid; gap:9px; margin-top:18px; }
.lesson9-page .lesson9-transformer-diagram>div { padding:15px 17px; border:1px solid #dfe4ec; border-radius:9px; background:#fff; }
.lesson9-page .lesson9-transformer-diagram>div.is-attention { border-color:#b27cff; background:#faf5ff; }
.lesson9-page .lesson9-transformer-diagram strong,.lesson9-page .lesson9-transformer-diagram span { display:block; }
.lesson9-page .lesson9-transformer-diagram strong { color:#172033; font-size:16px; }
.lesson9-page .lesson9-transformer-diagram span { margin-top:4px; color:#667085; font-size: 14px; }
.lesson9-page .lesson9-transformer-diagram>b { justify-self:center; color:#8b6eb5; }
.lesson9-page .lesson9-attention-example { margin-top:18px; padding:18px; border:1px solid #dfe4ec; border-radius:10px; background:#fff; }
.lesson9-page .lesson9-sentence { color:#172033; font-size:17px; line-height:1.7; }
.lesson9-page .lesson9-sentence mark { padding:2px 5px; border-radius:5px; background:#f0e6ff; color:#5f00dc; }
.lesson9-page .lesson9-attention-lines { display:grid; grid-template-columns:auto 1fr auto; align-items:center; gap:10px; margin:16px 0 4px; color:#651fff; font-size:14px; text-align:center; }
.lesson9-page .lesson9-attention-lines b { padding:9px; border-top:2px solid #b27cff; border-bottom:2px solid #b27cff; font-size: 14px; }
.lesson9-page .lesson9-attention-example p { margin:8px 0 0; color:#667085; font-size: 14px; }
.lesson9-page .lesson9-two-col { grid-template-columns:1fr 1fr; }
.lesson9-page .lesson9-two-col strong { color:#172033; font-size:15px; }
.lesson9-page .lesson9-two-col p { margin:5px 0 0; color:#667085; font-size:14px; line-height:1.6; }
.lesson9-page .lesson9-probabilities { display:grid; gap:9px; margin-top:18px; }
.lesson9-page .lesson9-probabilities>div { display:grid; grid-template-columns:130px 55px minmax(100px,1fr); gap:10px; align-items:center; }
.lesson9-page .lesson9-probabilities span { color:#344054; font-size:14px; }
.lesson9-page .lesson9-probabilities b { color:#5f00dc; font-size: 14px; }
.lesson9-page .lesson9-probabilities i { display:block; height:9px; border-radius:99px; background:#c4a7e7; }
.lesson9-page .lesson9-loop { display:grid; grid-template-columns:1fr auto 1fr auto 1fr auto 1fr; align-items:center; gap:10px; margin-top:18px; }
.lesson9-page .lesson9-loop>div { padding:15px 12px; border:1px solid #dfe4ec; border-radius:9px; background:#fff; }
.lesson9-page .lesson9-loop strong,.lesson9-page .lesson9-loop span { display:block; }
.lesson9-page .lesson9-loop strong { color:#172033; font-size:14px; }
.lesson9-page .lesson9-loop span { margin-top:4px; color:#667085; font-size: 14px; line-height:1.45; }
.lesson9-page .lesson9-loop>b { color:#8b6eb5; }
.lesson9-page .lesson9-generation-table { display:grid; margin-top:18px; border:1px solid #dfe4ec; border-radius:9px; overflow:hidden; background:#fff; }
.lesson9-page .lesson9-generation-table>div { display:grid; grid-template-columns:70px minmax(0,1fr) 100px; gap:10px; padding:11px 13px; border-top:1px solid #ece8f0; font-size:14px; }
.lesson9-page .lesson9-generation-table>div:first-child { border-top:0; background:#f7f4fa; color:#667085; font-size: 14px; font-weight:800; }
.lesson9-page .lesson9-generation-table span { color:#667085; }
.lesson9-page .lesson9-generation-table b { color:#5f00dc; }
.lesson9-page .lesson9-api-flow { display:grid; grid-template-columns:1fr auto 1fr auto 1fr auto 1fr; align-items:center; gap:10px; margin:18px 0; }
.lesson9-page .lesson9-api-flow strong,.lesson9-page .lesson9-api-flow span { display:block; }
.lesson9-page .lesson9-api-flow strong { color:#172033; font-size:14px; }
.lesson9-page .lesson9-api-flow span { margin-top:4px; color:#667085; font-size: 14px; line-height:1.45; }
.lesson9-page .lesson9-api-flow .is-model { border-color:#b27cff; background:#faf5ff; }
.lesson9-page .lesson9-code-block { margin:18px 0; overflow:hidden; border:1px solid #d9dee7; border-radius:10px; background:#fbfcfd; }
.lesson9-page .lesson9-code-head { min-height:44px; display:flex; align-items:center; justify-content:space-between; gap:10px; padding:0 12px; background:#f1f3f5; border-bottom:1px solid #d9dee7; }
.lesson9-page .lesson9-code-head>span { color:#172033; font-size:14px; font-weight:700; }
.lesson9-page .lesson9-code-head>div { display:flex; align-items:center; gap:8px; }
.lesson9-page .lesson9-code-head a,.lesson9-page .lesson9-code-head button { padding:6px 10px; border:1px solid #cfd6df; border-radius:6px; background:#fff; color:#344054; font-size:14px; text-decoration:none; cursor:pointer; }
.lesson9-page .lesson9-code-head a:hover,.lesson9-page .lesson9-code-head button:hover { border-color:#9b72dc; color:#5f00dc; }
.lesson9-page .lesson9-code-head button.is-copied { border-color:#86efac; background:#f0fdf4; color:#166534; }
.lesson9-page .lesson9-code-block pre { margin:0; padding:18px; overflow:auto; background:#fbfcfd; }
.lesson9-page .lesson9-code-block code { font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,"Liberation Mono",monospace; color:#26364d; font-size:15px; line-height:1.65; white-space:pre; }
.lesson9-page .py-keyword { color:#7c3aed; font-weight:600; }
.lesson9-page .py-string { color:#00897b; }
.lesson9-page .py-built-in { color:#1565c0; }
.lesson9-page .lesson9-output { margin:10px 0 14px; padding:12px 14px; border:1px solid #e2e8f0; border-radius:8px; background:#f8fafc; }
.lesson9-page .lesson9-output strong { color:#172033; font-size:14px; }
.lesson9-page .lesson9-output code { display:block; margin-top:6px; color:#087f5b; font-size:14px; line-height:1.6; }
.lesson9-page .lesson9-experiment-grid { grid-template-columns:1fr 1fr; }
.lesson9-page .lesson9-experiment-grid span,.lesson9-page .lesson9-experiment-grid strong,.lesson9-page .lesson9-experiment-grid b { display:block; }
.lesson9-page .lesson9-experiment-grid span { color:#651fff; font-size: 14px; font-weight:800; letter-spacing:.06em; }
.lesson9-page .lesson9-experiment-grid strong { margin-top:7px; color:#172033; font-size:15px; line-height:1.5; }
.lesson9-page .lesson9-experiment-grid b { margin-top:8px; color:#667085; font-size: 14px; line-height:1.5; }
.lesson9-page .lesson9-break-fix { display:grid; grid-template-columns:1fr 1fr; gap:12px; margin-top:12px; }
.lesson9-page .lesson9-break-fix>div { padding:15px; border-radius:9px; }
.lesson9-page .lesson9-break-fix>div:first-child { border:1px solid #fecaca; background:#fff7f7; }
.lesson9-page .lesson9-break-fix>div:last-child { border:1px solid #bbf7d0; background:#f0fdf4; }
.lesson9-page .lesson9-break-fix strong { color:#172033; }
.lesson9-page .lesson9-break-fix p { margin:5px 0 0; font-size:14px; }
.lesson9-page .lesson9-summary-grid { grid-template-columns:repeat(3,1fr); }
.lesson9-page .lesson9-summary-grid>div { padding:15px; border:1px solid #dfe4ec; border-radius:9px; background:#fff; }
.lesson9-page .lesson9-summary-grid strong,.lesson9-page .lesson9-summary-grid span { display:block; }
.lesson9-page .lesson9-summary-grid strong { color:#172033; font-size:14px; }
.lesson9-page .lesson9-summary-grid span { margin-top:5px; color:#667085; font-size: 14px; line-height:1.55; }
.lesson9-page .lesson9-practice { margin:0 0 42px; padding:22px; border:1px solid #e0d2ec; border-radius:12px; background:#fff; }
.lesson9-page .lesson9-practice h2,.lesson9-page .lesson9-quiz h2,.lesson9-page .lesson9-recap h2 { margin:5px 0 8px; color:#171526; font-size:24px; }
.lesson9-page .lesson9-practice-row { display:grid; grid-template-columns:30px minmax(0,1fr) auto; gap:12px; align-items:center; padding:14px 0; border-top:1px solid #ece8f0; }
.lesson9-page .lesson9-practice-row>span { width:26px; height:26px; display:flex; align-items:center; justify-content:center; border-radius:50%; background:#f0e6ff; color:#5f00dc; font-weight:800; font-size: 14px; }
.lesson9-page .lesson9-practice-row strong { color:#344054; font-size:15px; line-height:1.5; }
.lesson9-page .lesson9-practice-row button { padding:7px 10px; border:1px solid #cfd6df; border-radius:6px; background:#fff; color:#344054; font-size: 14px; cursor:pointer; }
.lesson9-page .lesson9-practice-row em { display:none; grid-column:2 / 4; color:#087f5b; font-style:normal; font-size:14px; line-height:1.6; }
.lesson9-page .lesson9-practice-row.is-revealed em { display:block; }
.lesson9-page .lesson9-practice-row.is-revealed button { display:none; }
.lesson9-page .lesson9-quiz { margin:0 0 42px; padding:22px; border:1px solid #ded0eb; border-radius:12px; background:#fbf7ff; }
.lesson9-page .lesson9-quiz-options { display:grid; gap:9px; margin-top:16px; }
.lesson9-page .lesson9-quiz-options button { padding:12px 14px; text-align:left; border:1px solid #d8d0df; border-radius:8px; background:#fff; color:#344054; font-size:15px; cursor:pointer; }
.lesson9-page .lesson9-quiz-options button:hover { border-color:#a98ad1; }
.lesson9-page .lesson9-quiz-options button.is-correct { border-color:#86efac; background:#f0fdf4; color:#166534; }
.lesson9-page .lesson9-quiz-options button.is-wrong { border-color:#fecaca; background:#fef2f2; color:#991b1b; }
.lesson9-page .lesson9-quiz-feedback { min-height:25px; margin-bottom:0 !important; font-weight:700; }
.lesson9-page .lesson9-recap { margin:0 0 42px; padding:22px; border:1px solid #e1d7e8; border-radius:12px; background:#fff; }
.lesson9-page .lesson9-recap ul { margin:0; padding-left:22px; }
.lesson9-page .lesson9-recap li { margin:7px 0; }
.lesson9-page .lesson9-navigation { display:grid; grid-template-columns:1fr 1fr; gap:14px; margin-top:12px; }
.lesson9-page .lesson9-nav-card { display:block; padding:16px; border:1px solid #ded5e5; border-radius:10px; background:#fff; text-decoration:none; }
.lesson9-page .lesson9-nav-card span { display:block; color:#7b7390; font-size: 14px; }
.lesson9-page .lesson9-nav-card strong { display:block; margin-top:5px; color:#4f00b8; font-size:15px; }
.lesson9-page .lesson9-nav-card.next { text-align:right; }
@media (max-width:1100px) {
    .lesson9-page .lesson9-pipeline { grid-template-columns:1fr auto 1fr auto 1fr; }
    .lesson9-page .lesson9-pipeline>i:nth-of-type(n+3),.lesson9-page .lesson9-pipeline>div:nth-of-type(n+7) { display:none; }
    .lesson9-page .lesson9-summary-grid { grid-template-columns:1fr 1fr; }
    .lesson9-page .lesson9-loop { grid-template-columns:1fr auto 1fr auto 1fr; }
    .lesson9-page .lesson9-loop>i:nth-of-type(n+3),.lesson9-page .lesson9-loop>div:nth-of-type(n+7) { display:none; }
    .lesson9-page .lesson9-api-flow { grid-template-columns:1fr auto 1fr auto 1fr; }
    .lesson9-page .lesson9-api-flow>i:nth-of-type(n+3),.lesson9-page .lesson9-api-flow>div:nth-of-type(n+5) { display:none; }
}
@media (max-width:760px) {
    .lesson9-page .lesson9-header h1 { font-size:36px; }
    .lesson9-page .lesson9-lead { font-size:16px; }
    .lesson9-page .lesson9-section { grid-template-columns:28px minmax(0,1fr); gap:9px; margin-bottom:40px; }
    .lesson9-page .lesson9-section h2 { font-size:23px; }
    .lesson9-page .lesson9-number { width:26px; height:26px; font-size: 14px; }
    .lesson9-page .lesson9-pipeline,.lesson9-page .lesson9-token-example,.lesson9-page .lesson9-example-grid,.lesson9-page .lesson9-vector-card,.lesson9-page .lesson9-two-col,.lesson9-page .lesson9-loop,.lesson9-page .lesson9-api-flow,.lesson9-page .lesson9-experiment-grid,.lesson9-page .lesson9-break-fix,.lesson9-page .lesson9-summary-grid { grid-template-columns:1fr; }
    .lesson9-page .lesson9-pipeline>i,.lesson9-page .lesson9-loop>b,.lesson9-page .lesson9-api-flow>i { justify-self:center; transform:rotate(90deg); }
    .lesson9-page .lesson9-pipeline>i:nth-of-type(n+1),.lesson9-page .lesson9-pipeline>div:nth-of-type(n+1),.lesson9-page .lesson9-loop>div:nth-of-type(n+1),.lesson9-page .lesson9-api-flow>div:nth-of-type(n+1) { display:block; }
    .lesson9-page .lesson9-token-arrow,.lesson9-page .lesson9-vector-arrow { justify-self:center; transform:rotate(90deg); }
    .lesson9-page .lesson9-probabilities>div { grid-template-columns:90px 48px 1fr; }
    .lesson9-page .lesson9-generation-table>div { grid-template-columns:42px minmax(0,1fr) 70px; font-size: 14px; }
    .lesson9-page .lesson9-attention-lines { grid-template-columns:1fr; }
    .lesson9-page .lesson9-attention-lines b { border-left:2px solid #b27cff; border-right:2px solid #b27cff; border-top:0; border-bottom:0; }
    .lesson9-page .lesson9-practice-row { grid-template-columns:28px minmax(0,1fr); }
    .lesson9-page .lesson9-practice-row button { grid-column:2; justify-self:start; }
    .lesson9-page .lesson9-practice-row em { grid-column:2; }
    .lesson9-page .lesson9-navigation { grid-template-columns:1fr; }
    .lesson9-page .lesson9-nav-card.next { text-align:left; }
    .lesson9-page .lesson9-code-head { align-items:flex-start; flex-direction:column; padding:9px 12px; }
    .lesson9-page .lesson9-code-head>div { width:100%; flex-wrap:wrap; }
    .lesson9-page .lesson9-code-head a,.lesson9-page .lesson9-code-head button { font-size: 14px; }
    .lesson9-page .lesson9-code-block code { font-size:14px; }
}
@media (max-width:480px) {
    .lesson9-page .lesson9-header h1 { font-size:32px; }
    .lesson9-page .lesson9-objectives,.lesson9-page .lesson9-practice,.lesson9-page .lesson9-quiz,.lesson9-page .lesson9-recap { padding:18px; }
    .lesson9-page .lesson9-code-block pre { padding:14px; }
}

.lesson9-page .lesson9-sequence-card,.lesson9-page .lesson9-flow,.lesson9-page .lesson9-gradient-flow,.lesson9-page .lesson9-update-example,.lesson9-page .lesson9-loss-card,.lesson9-page .lesson9-training-terms,.lesson9-page .lesson9-scale-grid,.lesson9-page .lesson9-validation-grid,.lesson9-page .lesson9-cost-grid,.lesson9-page .lesson9-compare-table,.lesson9-page .lesson9-project-grid,.lesson9-page .lesson9-shift-grid { display:grid; gap:12px; margin-top:18px; }
.lesson9-page .lesson9-sequence-card { grid-template-columns:1fr auto; align-items:center; padding:18px; border:1px solid #ddd4e8; border-radius:10px; background:#fff; }
.lesson9-page .lesson9-sequence-card span,.lesson9-page .lesson9-shift-grid strong,.lesson9-page .lesson9-training-terms strong,.lesson9-page .lesson9-scale-grid strong,.lesson9-page .lesson9-validation-grid strong,.lesson9-page .lesson9-cost-grid strong,.lesson9-page .lesson9-compare-table strong,.lesson9-page .lesson9-project-grid strong { display:block; color:#651fff; font-size: 14px; font-weight:800; letter-spacing:.05em; text-transform:uppercase; }
.lesson9-page .lesson9-sequence-card strong { display:block; margin-top:6px; color:#172033; font-size:20px; }
.lesson9-page .lesson9-sequence-target { padding-left:18px; border-left:2px solid #c6a5ef; }
.lesson9-page .lesson9-shift-grid { grid-template-columns:1fr 1fr; }
.lesson9-page .lesson9-shift-grid>div,.lesson9-page .lesson9-training-terms>div,.lesson9-page .lesson9-scale-grid>div,.lesson9-page .lesson9-validation-grid>div,.lesson9-page .lesson9-cost-grid>div,.lesson9-page .lesson9-compare-table>div,.lesson9-page .lesson9-project-grid>div { padding:15px; border:1px solid #dfe4ec; border-radius:9px; background:#fff; }
.lesson9-page .lesson9-shift-grid span,.lesson9-page .lesson9-training-terms span,.lesson9-page .lesson9-scale-grid span,.lesson9-page .lesson9-validation-grid span,.lesson9-page .lesson9-cost-grid span,.lesson9-page .lesson9-compare-table span,.lesson9-page .lesson9-project-grid span { display:block; margin-top:6px; color:#667085; font-size:14px; line-height:1.55; }
.lesson9-page .lesson9-flow,.lesson9-page .lesson9-gradient-flow { grid-template-columns:1fr auto 1fr auto 1fr; align-items:stretch; }
.lesson9-page .lesson9-flow>div,.lesson9-page .lesson9-gradient-flow>div { padding:16px; border:1px solid #dfe4ec; border-radius:9px; background:#fff; }
.lesson9-page .lesson9-flow strong,.lesson9-page .lesson9-gradient-flow strong { display:block; color:#172033; font-size:15px; }
.lesson9-page .lesson9-flow span,.lesson9-page .lesson9-gradient-flow span { display:block; margin-top:5px; color:#667085; font-size: 14px; line-height:1.5; }
.lesson9-page .lesson9-flow>b,.lesson9-page .lesson9-gradient-flow>b { align-self:center; color:#8b6eb5; font-size:20px; }
.lesson9-page .lesson9-loss-card { grid-template-columns:1fr auto 1fr; align-items:center; padding:18px; border:1px solid #ddd4e8; border-radius:10px; background:#fff; }
.lesson9-page .lesson9-loss-card>div:not(.lesson9-loss-arrow):not(.lesson9-loss-result) { padding:12px; border:1px solid #e6e0eb; border-radius:8px; }
.lesson9-page .lesson9-loss-card span { display:block; color:#651fff; font-size: 14px; font-weight:800; letter-spacing:.05em; }
.lesson9-page .lesson9-loss-card strong { display:block; margin-top:6px; color:#344054; font-size:14px; line-height:1.5; }
.lesson9-page .lesson9-loss-arrow { text-align:center; color:#8b6eb5; font-size:20px; }
.lesson9-page .lesson9-loss-result { grid-column:1 / -1; padding:13px 15px; border-radius:9px; background:#fbf7ff; }
.lesson9-page .lesson9-loss-result b,.lesson9-page .lesson9-loss-result small { display:block; }
.lesson9-page .lesson9-loss-result b { margin-top:4px; color:#5f00dc; font-size:15px; }
.lesson9-page .lesson9-loss-result small { margin-top:4px; color:#667085; font-size: 14px; line-height:1.5; }
.lesson9-page .lesson9-two-col { display:grid; grid-template-columns:1fr 1fr; gap:12px; margin-top:14px; }
.lesson9-page .lesson9-two-col>div { padding:15px; border:1px solid #dfe4ec; border-radius:9px; background:#fff; }
.lesson9-page .lesson9-two-col strong { color:#172033; }
.lesson9-page .lesson9-two-col p { margin:5px 0 0; font-size:14px; }
.lesson9-page .lesson9-formula { margin:14px 0; padding:16px; overflow:auto; border:1px solid #ddd4e8; border-radius:9px; background:#fbf7ff; }
.lesson9-page .lesson9-formula code { color:#4f00b8; font-size:17px; white-space:nowrap; }
.lesson9-page .lesson9-update-example { grid-template-columns:1fr auto 1fr auto 1fr; align-items:center; }
.lesson9-page .lesson9-update-example>div { text-align:center; }
.lesson9-page .lesson9-update-example span { display:block; color:#651fff; font-size: 14px; font-weight:800; }
.lesson9-page .lesson9-update-example strong { display:block; margin-top:5px; color:#172033; font-size:21px; }
.lesson9-page .lesson9-loop { display:grid; grid-template-columns:1fr auto 1fr auto 1fr auto 1fr auto 1fr auto; gap:9px; align-items:stretch; margin-top:18px; }
.lesson9-page .lesson9-loop>div { padding:14px 10px; border:1px solid #dfe4ec; border-radius:9px; background:#fff; }
.lesson9-page .lesson9-loop strong,.lesson9-page .lesson9-loop span { display:block; }
.lesson9-page .lesson9-loop strong { color:#172033; font-size:14px; }
.lesson9-page .lesson9-loop span { margin-top:4px; color:#667085; font-size: 14px; line-height:1.4; }
.lesson9-page .lesson9-loop>b { align-self:center; color:#8b6eb5; }
.lesson9-page .lesson9-training-terms { grid-template-columns:repeat(4,1fr); }
.lesson9-page .lesson9-scale-grid,.lesson9-page .lesson9-validation-grid,.lesson9-page .lesson9-cost-grid { grid-template-columns:repeat(2,1fr); }
.lesson9-page .lesson9-validation-grid { grid-template-columns:repeat(3,1fr); }
.lesson9-page .lesson9-cost-grid { grid-template-columns:repeat(4,1fr); }
.lesson9-page .lesson9-compare-table { grid-template-columns:repeat(3,1fr); }
.lesson9-page .lesson9-project-grid { grid-template-columns:repeat(2,1fr); }
.lesson9-page .lesson9-example-grid>div { padding:16px; border:1px solid #dfe4ec; border-radius:9px; background:#fff; }
.lesson9-page .lesson9-example-grid strong,.lesson9-page .lesson9-example-grid span,.lesson9-page .lesson9-example-grid small { display:block; }
.lesson9-page .lesson9-example-grid strong { color:#172033; font-size:15px; }
.lesson9-page .lesson9-example-grid span { margin-top:7px; color:#344054; font-size:14px; line-height:1.5; }
.lesson9-page .lesson9-example-grid small { margin-top:7px; color:#667085; font-size: 14px; line-height:1.5; }
@media (max-width:1100px) {
  .lesson9-page .lesson9-training-terms,.lesson9-page .lesson9-cost-grid,.lesson9-page .lesson9-compare-table { grid-template-columns:1fr 1fr; }
  .lesson9-page .lesson9-validation-grid { grid-template-columns:1fr 1fr; }
  .lesson9-page .lesson9-loop { grid-template-columns:1fr auto 1fr auto 1fr; }
  .lesson9-page .lesson9-loop>b:nth-of-type(n+3),.lesson9-page .lesson9-loop>div:nth-of-type(n+7) { display:none; }
}
@media (max-width:760px) {
  .lesson9-page .lesson9-sequence-card,.lesson9-page .lesson9-shift-grid,.lesson9-page .lesson9-flow,.lesson9-page .lesson9-gradient-flow,.lesson9-page .lesson9-loss-card,.lesson9-page .lesson9-two-col,.lesson9-page .lesson9-update-example,.lesson9-page .lesson9-training-terms,.lesson9-page .lesson9-scale-grid,.lesson9-page .lesson9-validation-grid,.lesson9-page .lesson9-cost-grid,.lesson9-page .lesson9-compare-table,.lesson9-page .lesson9-project-grid { grid-template-columns:1fr; }
  .lesson9-page .lesson9-flow>b,.lesson9-page .lesson9-gradient-flow>b { justify-self:center; transform:rotate(90deg); }
  .lesson9-page .lesson9-loss-arrow { transform:rotate(90deg); }
  .lesson9-page .lesson9-loss-result { grid-column:auto; }
  .lesson9-page .lesson9-loop { grid-template-columns:1fr; }
  .lesson9-page .lesson9-loop>b { display:block !important; justify-self:center; transform:rotate(90deg); }
  .lesson9-page .lesson9-loop>div { display:block !important; }
}