.topic-shell{max-width:1080px;min-height:70vh;margin:0 auto;padding:34px 34px 88px}
.topic-shell .breadcrumbs{margin-bottom:30px;flex-wrap:wrap}
.topic-hero{padding:40px 44px;background:linear-gradient(135deg,#142a45 55%,#1a4057);border:1px solid #28465d;border-radius:16px;color:#fff}
.topic-hero .eyebrow{margin:0 0 18px;color:#63ddd0;font:10px/1.6 var(--mono);letter-spacing:1px}
.topic-hero h1{max-width:850px;margin:0;color:#f1f5fa;font:800 clamp(36px,5vw,58px)/1.08 var(--display);letter-spacing:-2px;overflow-wrap:anywhere}
.topic-summary{max-width:790px;margin:20px 0 0;color:#d0dbe7;font:16px/1.8 var(--sans)}
.topic-meta{display:flex;flex-wrap:wrap;gap:9px;margin-top:23px}
.topic-meta span{padding:8px 11px;border:1px solid #50637b;border-radius:999px;color:#e2ebf4;font:9px/1.5 var(--mono);letter-spacing:.35px}
.topic-section{margin:38px 0 0}
.topic-kicker{margin:0 0 9px;color:#168b98;font:10px/1.5 var(--mono);letter-spacing:.9px}
.topic-section h2,.topic-practice h2{margin:0 0 13px;color:#142238;font:700 clamp(24px,3vw,32px)/1.2 var(--display);letter-spacing:-.8px}
.topic-section>p:not(.topic-kicker),.topic-practice>p:not(.topic-kicker){max-width:800px;margin:0;color:#596b80;font:15px/1.8 var(--sans)}
.topic-concepts{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:15px;margin-top:20px}
.topic-concept{min-width:0;padding:24px;background:#fff;border:1px solid #dfe7ee;border-radius:12px;box-shadow:0 8px 22px #142a4508}
.topic-number{display:inline-grid;place-items:center;width:32px;height:32px;border-radius:9px;background:#e7f6f5;color:#087f86;font:11px var(--mono)}
.topic-concept h3{margin:14px 0 8px;color:#142238;font:700 19px/1.35 var(--display);letter-spacing:-.25px;overflow-wrap:anywhere}
.topic-concept>p,.topic-example p{margin:0;color:#596b80;font:14px/1.8 var(--sans)}
.topic-example{margin-top:15px;padding:14px 15px;background:#f3f7fa;border:1px solid #e1e9ef;border-radius:9px}
.topic-example strong{display:block;margin-bottom:5px;color:#168b98;font:10px var(--mono);letter-spacing:.5px;text-transform:uppercase}
.topic-steps{display:grid;gap:10px;counter-reset:topic-step;list-style:none;margin:20px 0 0;padding:0}
.topic-steps li{position:relative;min-height:50px;padding:13px 16px 13px 60px;background:#fff;border:1px solid #dfe7ee;border-radius:10px;color:#40536a;font:14px/1.65 var(--sans);counter-increment:topic-step}
.topic-steps li::before{content:counter(topic-step,decimal-leading-zero);position:absolute;left:16px;top:14px;color:#168b98;font:11px var(--mono)}
.topic-practice{margin-top:38px;padding:26px 30px;background:#eaf7f6;border:1px solid #d1e9e7;border-radius:13px}
.topic-checks>div{display:grid;gap:9px;margin-top:20px}
.topic-checks details{padding:16px 18px;background:#fff;border:1px solid #dfe7ee;border-radius:10px}
.topic-checks summary{color:#20354e;font:700 14px/1.55 var(--sans);cursor:pointer}
.topic-checks details p{margin:12px 0 0;color:#596b80;font:14px/1.75 var(--sans)}
.topic-return{display:flex;flex-wrap:wrap;justify-content:space-between;gap:12px 22px;margin-top:38px;padding-top:20px;border-top:1px solid #dfe7ee}
.topic-return a{color:#147d91;font:700 12px/1.6 var(--sans);text-decoration:none}
.topic-return a:hover{text-decoration:underline;text-underline-offset:3px}
.topic-prerequisites{max-width:790px;margin:17px 0 0;padding:12px 15px;border-left:3px solid #63ddd0;background:#ffffff12;color:#e2ebf4;font:13px/1.7 var(--sans)}
.topic-prerequisites strong{color:#fff}
.topic-detail-section{padding-top:8px}
.topic-section-intro{max-width:850px!important;margin:0!important;color:#596b80;font:15px/1.85 var(--sans)}
.topic-callout{margin-top:18px;padding:20px 22px;background:#edf7f7;border:1px solid #d5e9e9;border-left:4px solid #168b98;border-radius:11px}
.topic-callout-label{margin:0 0 8px!important;color:#168b98!important;font:10px/1.5 var(--mono)!important;letter-spacing:.8px}
.topic-callout h3{margin:0 0 7px;color:#142238;font:700 18px/1.4 var(--display);letter-spacing:-.25px}
.topic-callout>p:last-child{margin:0;color:#40536a;font:14px/1.8 var(--sans)}
.topic-detail-grid,.topic-flow-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px;margin-top:18px}
.topic-detail-card,.topic-flow-card{min-width:0;padding:22px;background:#fff;border:1px solid #dfe7ee;border-radius:12px;box-shadow:0 8px 22px #142a4508}
.topic-detail-card h3,.topic-flow-card h3{margin:14px 0 8px;color:#142238;font:700 18px/1.4 var(--display);letter-spacing:-.3px;overflow-wrap:anywhere}
.topic-detail-card>p,.topic-flow-intro,.topic-flow-card li span{color:#596b80;font:14px/1.75 var(--sans)}
.topic-detail-card>p{margin:0}
.topic-tradeoff{margin-top:13px!important;padding-top:12px;border-top:1px solid #e4ebf0}
.topic-tradeoff strong{color:#20354e}
.topic-flow-card .topic-kicker{margin:0}
.topic-flow-card h3{margin-top:8px}
.topic-flow-intro{margin:0 0 15px}
.topic-flow-card ol{display:grid;gap:10px;list-style:none;counter-reset:flow-step;margin:0;padding:0}
.topic-flow-card li{position:relative;display:grid;gap:3px;padding:11px 12px 11px 43px;background:#f5f8fa;border-radius:8px;counter-increment:flow-step}
.topic-flow-card li::before{content:counter(flow-step,decimal-leading-zero);position:absolute;left:12px;top:12px;color:#168b98;font:10px/1.5 var(--mono)}
.topic-flow-card li strong{color:#20354e;font:700 13px/1.5 var(--sans)}
.topic-flow-card li span{font-size:13px}
.topic-table-wrap{max-width:100%;margin-top:18px;overflow-x:auto;border:1px solid #dfe7ee;border-radius:11px;background:#fff}
.topic-table{width:100%;border-collapse:collapse;min-width:650px}
.topic-table th,.topic-table td{padding:14px 16px;border-bottom:1px solid #e5ebf0;text-align:left;vertical-align:top;color:#596b80;font:13px/1.7 var(--sans)}
.topic-table thead th{background:#f1f6f8;color:#20354e;font-weight:700}
.topic-table tbody th{width:130px;color:#142238;font-weight:700}
.topic-table tr:last-child th,.topic-table tr:last-child td{border-bottom:0}
.topic-list-block{margin-top:18px;padding:20px 22px;background:#fff;border:1px solid #dfe7ee;border-radius:11px}
.topic-list-block h3{margin:0 0 10px;color:#142238;font:700 17px/1.4 var(--display)}
.topic-list-block ul{display:grid;gap:8px;margin:0;padding-left:20px;color:#596b80;font:14px/1.75 var(--sans)}
.topic-course-cta{margin-top:34px;padding:24px 27px;background:linear-gradient(135deg,#142a45,#1a4057);border:1px solid #28465d;border-radius:13px;color:#f1f5fa}
.topic-course-cta h2{margin:0 0 9px;color:#f1f5fa;font:700 clamp(21px,3vw,28px)/1.25 var(--display)}
.topic-course-cta>p:not(.topic-kicker){max-width:760px;margin:0 0 15px;color:#d0dbe7;font:14px/1.75 var(--sans)}
.topic-course-cta .topic-kicker{color:#63ddd0}
.topic-course-cta a{color:#d8f36f;font:700 13px/1.6 var(--sans);text-decoration:none}
.topic-course-cta a:hover{text-decoration:underline;text-underline-offset:3px}
html[data-theme="dark"] .topic-section h2,html[data-theme="dark"] .topic-practice h2{color:var(--theme-text)}
html[data-theme="dark"] .topic-section>p:not(.topic-kicker),html[data-theme="dark"] .topic-practice>p:not(.topic-kicker),html[data-theme="dark"] .topic-concept>p,html[data-theme="dark"] .topic-example p,html[data-theme="dark"] .topic-checks details p{color:var(--theme-muted)}
html[data-theme="dark"] .topic-concept,html[data-theme="dark"] .topic-steps li,html[data-theme="dark"] .topic-checks details{background:var(--theme-surface);border-color:var(--theme-border);color:var(--theme-text)}
html[data-theme="dark"] .topic-concept h3,html[data-theme="dark"] .topic-checks summary{color:var(--theme-text)}
html[data-theme="dark"] .topic-example{background:#142b39;border-color:#285064}
html[data-theme="dark"] .topic-practice{background:#112b36;border-color:#285064}
html[data-theme="dark"] .topic-return{border-color:var(--theme-border)}
html[data-theme="dark"] .topic-section-intro,html[data-theme="dark"] .topic-detail-card>p,html[data-theme="dark"] .topic-flow-intro,html[data-theme="dark"] .topic-flow-card li span,html[data-theme="dark"] .topic-table th,html[data-theme="dark"] .topic-table td,html[data-theme="dark"] .topic-list-block ul{color:var(--theme-muted)}
html[data-theme="dark"] .topic-callout,html[data-theme="dark"] .topic-detail-card,html[data-theme="dark"] .topic-flow-card,html[data-theme="dark"] .topic-table-wrap,html[data-theme="dark"] .topic-list-block{background:var(--theme-surface);border-color:var(--theme-border)}
html[data-theme="dark"] .topic-callout{border-left-color:#63ddd0}
html[data-theme="dark"] .topic-callout h3,html[data-theme="dark"] .topic-flow-card h3,html[data-theme="dark"] .topic-flow-card li strong,html[data-theme="dark"] .topic-tradeoff strong,html[data-theme="dark"] .topic-list-block h3,html[data-theme="dark"] .topic-table tbody th{color:var(--theme-text)}
html[data-theme="dark"] .topic-callout>p:last-child,html[data-theme="dark"] .topic-detail-card>p,html[data-theme="dark"] .topic-tradeoff{color:var(--theme-muted)}
html[data-theme="dark"] .topic-flow-card li,html[data-theme="dark"] .topic-table thead th{background:#10243a}
html[data-theme="dark"] .topic-flow-card li,html[data-theme="dark"] .topic-table th,html[data-theme="dark"] .topic-table td,html[data-theme="dark"] .topic-tradeoff{border-color:var(--theme-border)}
html[data-theme="dark"] .topic-prerequisites{color:#d0dbe7}
@media(max-width:700px){.topic-shell{padding:24px 7% 66px}.topic-shell .breadcrumbs{margin-bottom:22px}.topic-hero{padding:28px 22px}.topic-hero h1{font-size:38px;letter-spacing:-1.3px}.topic-summary{font-size:14px}.topic-concepts,.topic-detail-grid,.topic-flow-grid{grid-template-columns:1fr}.topic-concept,.topic-detail-card,.topic-flow-card{padding:19px}.topic-section{margin-top:30px}.topic-section h2,.topic-practice h2{font-size:24px}.topic-practice{padding:21px}.topic-steps li{padding-left:52px}.topic-return{flex-direction:column}.topic-prerequisites{font-size:12px}.topic-callout{padding:17px}.topic-table-wrap{margin-right:-2px}}