body:is([data-lesson=bai-8],[data-lesson=bai-9],[data-lesson=bai-10],[data-lesson=bai-11]) .code-box{background:#152237;color:#e6edf7;border:1px solid #344761;border-radius:12px;overflow:hidden;padding:0;margin:16px 0}body:is([data-lesson=bai-8],[data-lesson=bai-9],[data-lesson=bai-10],[data-lesson=bai-11]) .code-label{background:#1e304a;color:#cddbef;padding:11px 15px;display:flex;align-items:center;justify-content:space-between;gap:12px;letter-spacing:.04em;font-size:11px}body:is([data-lesson=bai-8],[data-lesson=bai-9],[data-lesson=bai-10],[data-lesson=bai-11]) .code-box pre{margin:0;padding:18px 20px;overflow:auto;max-height:580px;font:14px/1.8 ui-monospace,SFMono-Regular,Consolas,monospace;tab-size:4;white-space:pre}body:is([data-lesson=bai-8],[data-lesson=bai-9],[data-lesson=bai-10],[data-lesson=bai-11]) .code-box code{font:inherit;color:inherit;background:none;padding:0;border:0;white-space:pre;word-break:normal;overflow-wrap:normal;text-shadow:none}body:is([data-lesson=bai-8],[data-lesson=bai-9],[data-lesson=bai-10],[data-lesson=bai-11]) .code-box pre.line-numbers{padding-left:4.4em}body:is([data-lesson=bai-8],[data-lesson=bai-9],[data-lesson=bai-10],[data-lesson=bai-11]) .line-numbers-rows{border-right:1px solid #3c506b}body:is([data-lesson=bai-8],[data-lesson=bai-9],[data-lesson=bai-10],[data-lesson=bai-11]) .line-numbers-rows>span:before{color:#93a7c5}body:is([data-lesson=bai-8],[data-lesson=bai-9],[data-lesson=bai-10],[data-lesson=bai-11]) .copy{color:#ecf3ff;background:#314868;border:1px solid #607797;border-radius:6px;padding:5px 9px;cursor:pointer;flex-shrink:0}.token.comment,.token.prolog{color:#a0b2ca;font-style:italic}.token.keyword,.token.atrule{color:#d9b3ff}.token.string,.token.attr-value{color:#b3e6aa}.token.function,.token.class-name{color:#88d5ff}.token.number,.token.boolean,.token.constant{color:#ffce91}.token.operator,.token.punctuation{color:#dbe7f5}.token.builtin,.token.variable,.token.parameter{color:#f5cadd}.token.property,.token.attr-name{color:#92dcd3}.source-file{padding:15px;border:1px solid #d7e2f0;border-radius:12px;background:#f6f9ff;margin:15px 0}.source-file>p{margin:0 0 8px}.source-file>details>summary{cursor:pointer;color:var(--blue);font-weight:650;font-size:14px;padding:8px 0}.source-file .source-download{display:inline-flex;align-items:center;padding:8px 12px;background:var(--blue);color:#fff;border-radius:7px;text-decoration:none;font-size:14px;font-weight:650;margin:6px 0 10px}.lab-folder{background:#eef6f2;border:1px solid #c9e0d5;border-radius:10px;padding:15px 18px;margin:18px 0}.lab-folder strong{display:block;color:var(--teal)}.lab-folder ul{margin:8px 0;padding-left:20px}.lab-folder li{font-size:14px}.lab-animation{margin:24px 0;border:1px solid #ccdaed;border-radius:18px;overflow:hidden;background:#f3f7fd;box-shadow:0 5px 18px #1d416708}.lab-animation>figcaption{padding:21px 22px 12px;background:#fff}.lab-eyebrow{font-size:11px;font-weight:750;letter-spacing:.08em;color:#526c90}.lecture .lab-animation h4{margin:6px 0 8px;font-size:20px;line-height:1.5}.lecture .lab-animation>figcaption p{font-size:14px;line-height:1.7;color:#536981;margin:0}.lab-controls{display:flex;flex-wrap:wrap;align-items:center;gap:8px;padding:12px 22px;background:#fff;border-bottom:1px solid #dce5ef}.lab-controls[hidden],.lab-dots[hidden],.lab-frame[hidden]{display:none}.lab-controls button,.lab-dots button{font-family:inherit;font-weight:600;font-size:13px;line-height:1.4;border:1px solid #b8cbe5;border-radius:8px;padding:9px 12px;background:#fff;color:#27466f;cursor:pointer}.lab-controls [data-lab-play]{background:#245cea;border-color:#245cea;color:#fff}.lab-controls button:disabled{opacity:.4;cursor:default}.lab-controls button:focus-visible,.lab-dots button:focus-visible{outline:3px solid #d79317;outline-offset:3px}.lab-controls [data-lab-count]{margin-left:auto;color:#526780;font-size:12px;white-space:nowrap}.lab-frame{padding:18px 20px 0}.lab-frame-title{display:flex;align-items:center;gap:9px;font-size:16px;line-height:1.5}.lab-frame-title>span{display:grid;place-items:center;width:29px;height:29px;background:#dce9ff;color:#245cea;border-radius:50%;font-weight:750;flex-shrink:0}.lab-stage{margin:12px 0}.lab-stage svg{display:block;width:100%;height:auto;font-family:inherit;overflow:visible}.lab-speech{font-size:17px;font-weight:700;text-anchor:middle;fill:#324e72}.lab-wire{stroke:#adbed6;stroke-width:2;stroke-dasharray:6 5;fill:none}.lab-device{color:#607fa7}.lab-card{fill:#fff;stroke:#ccdaed;stroke-width:2}.lab-device.is-active{color:#245cea}.is-active .lab-card{stroke:#7ca1f4;fill:#edf4ff}.lab-device.is-muted{opacity:.5}.lab-device-name{font-size:17px;font-weight:750;text-anchor:middle;fill:#233d5d}.lab-device-sub{font-size:14px;text-anchor:middle;fill:#546d8c}.lab-badge{fill:#eaf0f8}.is-active .lab-badge{fill:#d7e7ff}.lab-device-status{font-size:12px;font-weight:650;text-anchor:middle;fill:#345579}.lab-packet{fill:#e49a24;animation:lab-packet-travel 2.6s ease-in-out infinite}.lab-packet-late{animation-delay:1.3s}.lab-animation.is-paused .lab-packet{animation-play-state:paused}.lab-animation.is-playing .lab-cartoon{animation:lab-cartoon-bob 2s ease-in-out infinite}@keyframes lab-packet-travel{0%{cx:88px;opacity:0}12%{opacity:1}88%{opacity:1}to{cx:626px;opacity:0}}@keyframes lab-cartoon-bob{50%{translate:0 -4px}}.lab-explanation{background:#fff;border:1px solid #d9e4f1;border-radius:12px;padding:16px 18px}.lab-code-link>span{display:block;color:#637b98;font-size:10px;font-weight:750;letter-spacing:.05em;margin-bottom:7px}.lab-code-link code{display:block;color:#2258bb;background:#edf4ff;padding:9px 11px;border-radius:6px;font-size:13px;line-height:1.7;overflow-wrap:anywhere}.lecture .lab-explanation p{font-size:14px;line-height:1.8;margin:12px 0}.lecture .lab-explanation .lab-takeaway{margin-bottom:0;padding-top:12px;border-top:1px solid #e4ebf4;color:#176451}.lab-takeaway b{color:#176451}.lab-dots{display:flex;gap:8px;justify-content:center;padding:16px 20px 0}.lab-dots button{padding:6px 11px;border-radius:50%}.lab-dots button[aria-current=step]{background:#245cea;border-color:#245cea;color:#fff}.lecture .lab-footnote{font-size:12px;line-height:1.7;color:#607591;padding:12px 22px 18px;margin:0}@media (max-width:600px){.lab-animation>figcaption{padding:17px 15px 12px}.lecture .lab-animation h4{font-size:18px}.lab-controls{padding:10px 12px;gap:6px}.lab-controls button{padding:9px;font-size:12px}.lab-frame{padding:16px 12px 0}.lab-frame-title{font-size:14px}.lab-explanation{padding:12px}.lab-controls [data-lab-count]{font-size:11px}.lab-stage svg{height:auto}.lab-stage{overflow-x:auto}.lab-stage svg{min-width:510px}.lecture .lab-footnote{padding:12px 15px 16px}.lab-stage:after{content:"\2194  Vu\1ed1t ngang \111\1ec3  xem \111\1ee7  3 nh\e2n v\1eadt";display:block;font-size:11px;color:#607591;margin-top:5px}.lab-code-link code{font-size:12px}}@media (prefers-reduced-motion:reduce){.lab-animation *{animation:none!important;transition:none!important}}@media print{.lab-controls,.lab-dots,.lab-footnote,.source-download{display:none!important}.lab-frame[hidden]{display:block!important}.lab-frame{break-inside:avoid;margin-bottom:18px}.lab-animation{border:1px solid #ccc;box-shadow:none}.lab-stage svg{min-width:0}.lab-stage:after{display:none}.lab-packet{display:none}body:is([data-lesson=bai-8],[data-lesson=bai-9],[data-lesson=bai-10],[data-lesson=bai-11]) .code-box pre{max-height:none;white-space:pre-wrap}body:is([data-lesson=bai-8],[data-lesson=bai-9],[data-lesson=bai-10],[data-lesson=bai-11]) .code-box,body:is([data-lesson=bai-8],[data-lesson=bai-9],[data-lesson=bai-10],[data-lesson=bai-11]) .code-label{background:#f5f5f5;color:#172b47}.token{color:#172b47!important}.source-file{break-inside:auto}}.lab-animation.is-mobile .lab-stage svg{min-width:0}.lab-animation.is-mobile .lab-stage:after{display:none}.lab-animation.is-mobile .lab-speech,.lab-animation.is-mobile .lab-wire,.lab-animation.is-mobile .lab-packet{display:none}@media print{.lab-animation.is-mobile .lab-stage svg{max-width:340px;margin:auto}}.lab-roadmap{margin:20px 0;padding:18px 20px;background:#eef4ff;border:1px solid #cbdcf9;border-radius:12px}.lab-roadmap>strong{color:#2556a0;font-size:16px}.lecture .lab-roadmap p,.lecture .lab-roadmap li{font-size:14px;line-height:1.8}.lab-roadmap ol{padding-left:22px;margin:10px 0}.lab-roadmap p:last-child{margin-bottom:0}.lab-checkpoint{margin:16px 0 24px;padding:15px 18px;border-left:4px solid #16856d;background:#eaf7f1;border-radius:0 10px 10px 0}.lab-checkpoint>strong{color:#176451;font-size:14px}.lecture .lab-checkpoint p{font-size:14px;line-height:1.8;margin:7px 0 0}.lab-more{margin:18px 0;padding:13px 16px;border:1px solid #d4e1f0;border-radius:10px;background:#fafcff}.lab-more>summary{font-size:14px;font-weight:650;color:#315d94;cursor:pointer}.lab-more[open]>summary{margin-bottom:14px}
