.multigpu-lesson{--violet:#c78cff;--cyan:#72d7ff}.capacity-workspace,.collect-workspace{grid-template-columns:minmax(390px,.82fr) minmax(520px,1.18fr);gap:16px;display:grid}.multigpu-code{align-content:center;min-height:205px}.allocation-order{grid-template-columns:1fr auto 1fr;align-items:center;gap:12px;margin:0 18px 18px;display:grid}.allocation-order span{color:#5f6a61;min-height:48px;font-family:var(--font-geist-mono),monospace;letter-spacing:.1em;border:1px solid #263028;place-items:center;font-size:8px;display:grid}.allocation-order span.is-active{border-color:var(--green);color:var(--green);background:#9dff3a0d}.allocation-order span.is-blocked{color:#ff8a7b;background:#ff5c480f;border-color:#ff715f}.allocation-order i{color:#526057;font-style:normal}.capacity-memory-panel{overflow:hidden}.capacity-memory{gap:11px;padding:32px 24px 22px;display:grid}.capacity-memory__labels{color:#556159;font-family:var(--font-geist-mono),monospace;grid-template-columns:2fr 1fr;font-size:7px;display:grid}.capacity-memory__labels span:nth-child(2){text-align:center}.capacity-memory__labels span:last-child{text-align:right}.capacity-memory__track{background:repeating-linear-gradient(90deg,#9dff3a09 0 calc(8.33333% - 1px),#0000 calc(8.33333% - 1px) 8.33333%);border:1px solid #2c382e;height:88px;position:relative}.capacity-memory__fill,.capacity-memory__overflow{height:100%;transition:width 70ms linear;position:absolute;top:0}.capacity-memory__fill{background:linear-gradient(90deg,#9dff3a29,#9dff3a9e);left:0;box-shadow:0 0 18px #9dff3a1f}.capacity-memory__overflow{background:repeating-linear-gradient(135deg,#ff614eb8 0 6px,#ff614e47 6px 12px);left:66.666%}.capacity-memory__track>i{color:#ff8f81;height:calc(100% + 18px);font-family:var(--font-geist-mono),monospace;letter-spacing:.08em;writing-mode:vertical-rl;border-left:1px solid #ff7867;font-size:6px;font-style:normal;position:absolute;top:-9px;left:66.666%}.capacity-memory>strong{color:var(--green);font-family:var(--font-geist-mono),monospace;font-size:23px;font-weight:500}.capacity-memory>small{color:#67736a;min-height:16px;font-family:var(--font-geist-mono),monospace;letter-spacing:.11em;font-size:7px}.capacity-memory-panel--done .capacity-memory>strong,.capacity-memory-panel--done .capacity-memory>small{color:#ff8b7c}.capacity-stats{border:1px solid #273128;grid-template-columns:repeat(3,1fr);margin:0 24px 24px;display:grid}.capacity-stats>span{border-right:1px solid #273128;align-content:center;gap:5px;min-height:68px;padding:12px;display:grid}.capacity-stats>span:last-child{border-right:0}.capacity-stats small{color:#59655c;font-family:var(--font-geist-mono),monospace;letter-spacing:.1em;font-size:6px}.capacity-stats strong{color:#b8c2b9;font-family:var(--font-geist-mono),monospace;font-size:12px;font-weight:500}.capacity-stats .is-alert strong{color:#ff8575}.teaching-note{color:#566259;margin:12px 0 0;font-size:9px;line-height:1.55}.shard-workspace{grid-template-columns:minmax(270px,.55fr) minmax(0,1.45fr);gap:16px;display:grid}.shard-strategies{border:1px solid var(--line);background:#070d09c7;align-content:start;gap:8px;padding:17px;display:grid}.shard-strategies>span,.collect-methods>span{color:var(--green);font-family:var(--font-geist-mono),monospace;letter-spacing:.12em;margin-bottom:4px;font-size:8px}.shard-strategies button,.collect-methods button{color:#758078;cursor:pointer;text-align:left;background:#050806;border:1px solid #273128;gap:5px;padding:13px;display:grid}.shard-strategies button{min-height:104px}.shard-strategies button strong,.collect-methods button strong{color:#b7c1b8;font-family:var(--font-geist-mono),monospace;font-size:8px;font-weight:500}.shard-strategies button small,.collect-methods button small{color:#657067;font-size:8px;line-height:1.45}.shard-strategies button i{color:#4f5b52;font-family:var(--font-geist-mono),monospace;letter-spacing:.07em;font-size:6px;font-style:normal;line-height:1.45}.shard-strategies button.is-selected,.collect-methods button.is-selected{border-color:var(--green);background:#9dff3a0d}.shard-strategies button.is-selected strong,.shard-strategies button.is-selected i,.collect-methods button.is-selected strong{color:var(--green)}.gpu-shard-grid{grid-template-columns:repeat(4,1fr);gap:8px;display:grid}.gpu-shard{border:1px solid var(--line);background:#070d09cc;align-content:start;gap:12px;min-width:0;padding:13px;display:grid}.gpu-shard>header{font-family:var(--font-geist-mono),monospace;justify-content:space-between;gap:6px;display:flex}.gpu-shard>header span{color:#a3afa5;font-size:7px}.gpu-shard>header i{color:#58645b;font-size:5px;font-style:normal}.gpu-shard__die{aspect-ratio:1;background:#060b07;border:1px solid #303c32;grid-template-columns:repeat(2,1fr);gap:4px;padding:12px;display:grid;position:relative}.gpu-shard__die>span{background:#9dff3a06;border:1px solid #9dff3a1f}.gpu-shard__die>b{color:#677269;font-family:var(--font-geist-mono),monospace;place-items:center;font-size:9px;font-weight:500;display:grid;position:absolute;inset:0}.gpu-shard__assignment{gap:4px;display:grid}.gpu-shard__assignment span,.gpu-shard>small{color:#59655c;font-family:var(--font-geist-mono),monospace;letter-spacing:.08em;font-size:6px}.gpu-shard__assignment strong{color:#8d9990;font-family:var(--font-geist-mono),monospace;font-size:17px;font-weight:500}.gpu-shard__meter{background:#1b241d;height:5px;overflow:hidden}.gpu-shard__meter span{background:#6d7b6f;height:100%;transition:width .18s;display:block}.gpu-shard.is-overflow{border-color:#ff695699}.gpu-shard.is-overflow header i,.gpu-shard.is-overflow .gpu-shard__assignment strong{color:#ff8676}.gpu-shard.is-overflow .gpu-shard__meter span{background:#ff715f}.gpu-shard.is-straggler{border-color:#ffb85c94}.gpu-shard.is-straggler header i,.gpu-shard.is-straggler .gpu-shard__assignment strong{color:#ffbd69}.gpu-shard.is-straggler .gpu-shard__meter span{background:#ffb85f}.gpu-shard.is-balanced{border-color:#9dff3a75}.gpu-shard.is-balanced header i,.gpu-shard.is-balanced .gpu-shard__assignment strong{color:var(--green)}.gpu-shard.is-balanced .gpu-shard__die>span{background:#9dff3a14;border-color:#9dff3a47}.gpu-shard.is-balanced .gpu-shard__meter span{background:var(--green)}.shard-feedback{margin-top:14px}.collect-code-panel{grid-template-rows:auto auto 1fr;display:grid}.multigpu-code--collect{min-height:184px}.multigpu-code--collect .lesson-code-line code{font-size:clamp(8px,.85vw,10px)}.collect-methods{gap:6px;padding:0 18px 18px;display:grid}.collect-methods button{min-height:66px}.collect-methods button:disabled{cursor:not-allowed;opacity:.7}.collective-panel{overflow:hidden}.collective-topology{min-height:360px;position:relative}.collective-topology svg{width:100%;height:100%;position:absolute;inset:0}.topology-links line{stroke:#405047;stroke-width:2px;stroke-dasharray:7 7}.collective-topology--host .topology-links line{stroke:#72d7ff}.collective-topology--root .topology-links line{stroke:#ffb85f}.collective-topology--allReduce .topology-links line{stroke:var(--green);animation:.85s linear infinite link-flow}.rank-node{width:112px;min-height:82px;font-family:var(--font-geist-mono),monospace;background:#060a07;border:1px solid #344137;place-items:center;gap:3px;padding:10px;display:grid;position:absolute}.rank-node--0{top:8%;left:8%}.rank-node--1{top:8%;right:8%}.rank-node--2{bottom:8%;right:8%}.rank-node--3{bottom:8%;left:8%}.rank-node span{color:#738077;letter-spacing:.1em;font-size:6px}.rank-node strong{color:#c2cbc3;font-size:20px;font-weight:500}.rank-node small{color:#566158;font-size:5px}.rank-node.is-complete{border-color:var(--green);box-shadow:0 0 16px #9dff3a1f}.rank-node.is-complete strong,.rank-node.is-complete small{color:var(--green)}.topology-center{border:1px solid var(--cyan);color:#7ecfe9;width:80px;height:80px;font-family:var(--font-geist-mono),monospace;text-align:center;background:#071014;place-items:center;font-size:7px;display:grid;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}.topology-center strong{font-size:10px}.collective-state{background:#050806;border:1px solid #263128;justify-content:space-between;gap:12px;margin:0 18px 18px;padding:12px 14px;display:flex}.collective-state span,.collective-state strong{font-family:var(--font-geist-mono),monospace;letter-spacing:.09em;font-size:7px}.collective-state span{color:#657168}.collective-state strong{color:var(--green);font-size:10px;font-weight:500}.collective-state--running{border-color:#9dff3a73}.collect-controls{margin-top:14px}.multigpu-principle code{color:var(--violet);background:#c78cff12}@keyframes link-flow{to{stroke-dashoffset:-28px}}@media (max-width:1040px){.capacity-workspace,.collect-workspace{grid-template-columns:1fr}.shard-workspace{grid-template-columns:minmax(250px,.58fr) minmax(520px,1.42fr);overflow-x:auto}}@media (max-width:760px){.shard-workspace{grid-template-columns:1fr;overflow:visible}.gpu-shard-grid{grid-template-columns:repeat(2,1fr)}.collective-topology{min-height:330px}.rank-node{width:96px;min-height:74px}.capacity-stats{margin-left:16px;margin-right:16px}}@media (max-width:520px){.capacity-memory{padding-left:16px;padding-right:16px}.capacity-stats{grid-template-columns:1fr}.capacity-stats>span{border-bottom:1px solid #273128;border-right:0;min-height:54px}.capacity-stats>span:last-child{border-bottom:0}.gpu-shard-grid{grid-template-columns:1fr 1fr}.gpu-shard__die{padding:8px}.collective-topology{min-height:390px}.rank-node--0{top:6%;left:4%}.rank-node--1{top:6%;right:4%}.rank-node--2{bottom:6%;right:4%}.rank-node--3{bottom:6%;left:4%}.collective-state{flex-direction:column;align-items:flex-start}.multigpu-code--collect .lesson-code-line code{font-size:7px}}@media (prefers-reduced-motion:reduce){.capacity-memory__fill,.capacity-memory__overflow,.gpu-shard__meter span{transition:none}.collective-topology--allReduce .topology-links line{animation:none}}
