.concurrency-lesson{background:radial-gradient(circle at 80% 12%,#b975ff17,#0000 28%),radial-gradient(circle at 16% 82%,#9dff3a17,#0000 28%),#030604}.trace-workspace,.split-workspace,.overlap-workspace{grid-template-columns:minmax(390px,.8fr) minmax(590px,1.2fr);gap:16px;display:grid}.trace-code-panel,.timeline-panel,.queue-preview-panel,.overlap-code-panel,.overlap-timeline-panel{min-width:0}.concurrency-code{align-content:center;min-height:225px}.queue-state{background:#050806;border:1px solid #273129;justify-content:space-between;align-items:center;margin:0 18px 18px;padding:12px 14px;display:flex}.queue-state span,.queue-state strong{font-family:var(--font-geist-mono), monospace;letter-spacing:.1em;font-size:7px}.queue-state span{color:#6c786f}.queue-state strong{color:var(--green);font-size:11px;font-weight:500}.queue-state--running{border-color:#b975ff80;animation:.72s ease-in-out infinite queue-pulse}.timeline-shell,.overlap-timeline{min-width:780px;padding:18px}.timeline-panel,.overlap-timeline-panel{overflow-x:auto}.timeline-axis,.resource-row{align-items:stretch;gap:3px;display:grid}.timeline-axis--nine,.resource-row--nine{grid-template-columns:92px repeat(9,minmax(64px,1fr))}.timeline-axis{margin-bottom:5px}.timeline-axis i{color:#4e5951;font-family:var(--font-geist-mono), monospace;text-align:center;font-size:6px;font-style:normal}.resource-row{margin-bottom:4px}.resource-row>strong,.stream-row>strong{color:#68746b;font-family:var(--font-geist-mono), monospace;letter-spacing:.08em;align-items:center;font-size:7px;font-weight:500;display:flex}.task-cell{color:#3f4941;min-height:51px;font-family:var(--font-geist-mono), monospace;text-align:center;background:#29322b14;border:1px solid #202922;place-items:center;padding:5px;font-size:6px;transition:opacity .1s linear,background .1s linear;display:grid}.task-cell--input,.stream-task--input,.queue-task--input{--task-color:#72d7ff}.task-cell--compute,.stream-task--compute,.queue-task--compute{--task-color:var(--green)}.task-cell--output,.stream-task--output,.queue-task--output{--task-color:#bf8dff}.task-cell:not(.task-cell--idle){border-color:color-mix(in srgb, var(--task-color) 34%, transparent);color:color-mix(in srgb, var(--task-color) 58%, #667168)}.task-cell.is-complete{background:color-mix(in srgb, var(--task-color) 19%, #050806);border-color:var(--task-color);color:var(--task-color)}.task-cell.is-current{background:color-mix(in srgb, var(--task-color) 28%, #050806);border-color:var(--task-color);color:#fff;box-shadow:0 0 13px color-mix(in srgb, var(--task-color) 25%, transparent)}.stream-strategies{border:1px solid var(--line);background:#070d09c2;align-content:start;gap:8px;padding:18px;display:grid}.stream-strategies>span{color:var(--green);font-family:var(--font-geist-mono), monospace;letter-spacing:.12em;margin-bottom:4px;font-size:8px}.stream-strategies button{color:#778279;cursor:pointer;text-align:left;background:#050806;border:1px solid #273129;align-content:center;gap:5px;min-height:96px;padding:13px;display:grid}.stream-strategies button strong{color:#b7c1b8;font-family:var(--font-geist-mono), monospace;font-size:9px;font-weight:500}.stream-strategies button small{color:#68736a;font-size:9px;line-height:1.45}.stream-strategies button i{color:#4f5a51;font-family:var(--font-geist-mono), monospace;letter-spacing:.08em;font-size:6px;font-style:normal}.stream-strategies button.is-selected{border-color:var(--green);background:#9dff3a0e}.stream-strategies button.is-selected strong,.stream-strategies button.is-selected i{color:var(--green)}:is(.stream-strategies button:focus-visible,.sync-options button:focus-visible){outline-offset:2px;outline:2px solid #fff}.queue-preview{gap:9px;padding:18px;display:grid}.queue-lane{background:#050806;border:1px solid #253027;grid-template-columns:75px minmax(0,1fr);align-items:center;gap:8px;min-width:0;padding:10px;display:grid}.queue-lane>strong{color:#657168;font-family:var(--font-geist-mono), monospace;font-size:7px;font-weight:500}.queue-lane>span{gap:4px;min-width:0;display:flex;overflow-x:auto}.queue-task{border:1px solid color-mix(in srgb, var(--task-color) 37%, transparent);background:color-mix(in srgb, var(--task-color) 8%, #050806);min-width:58px;min-height:39px;color:var(--task-color);font-family:var(--font-geist-mono), monospace;text-align:center;place-items:center;padding:5px;font-size:5px;font-style:normal;display:grid}.queue-preview--byStage .queue-lane{border-color:#ffb25f4d}.queue-preview--byChunk .queue-lane{border-color:#9dff3a61}.stream-rule{border:1px solid var(--line);justify-content:space-between;gap:16px;margin:0 18px 18px;padding:13px 14px;display:flex}.stream-rule span{color:#5d685f;font-family:var(--font-geist-mono), monospace;font-size:7px}.stream-rule code{color:var(--green);font-family:var(--font-geist-mono), monospace;font-size:9px}.strategy-feedback,.overlap-controls{border:1px solid var(--line);background:#070d09bf;grid-template-columns:1fr auto;align-items:center;gap:18px;margin-top:14px;padding:15px 17px;display:grid}.strategy-feedback p,.overlap-controls p{color:#9aa69c;margin:0;font-size:11px;line-height:1.55}.strategy-feedback small,.overlap-controls small{color:#566158;margin-top:5px;font-size:9px;line-height:1.5;display:block}.overlap-controls p.is-correct{color:var(--green)}.overlap-workspace{grid-template-columns:minmax(430px,.83fr) minmax(560px,1.17fr)}.concurrency-code--async{min-height:208px}.concurrency-code--async .lesson-code-line code{font-size:clamp(9px,.93vw,11px)}.sync-options{grid-template-columns:repeat(3,1fr);gap:6px;padding:0 18px 18px;display:grid}.sync-options button{color:#778279;cursor:pointer;text-align:left;background:#050806;border:1px solid #263028;align-content:center;gap:5px;min-height:74px;padding:9px;display:grid}.sync-options button strong{color:#b1bcb3;font-family:var(--font-geist-mono), monospace;font-size:7px;font-weight:500}.sync-options button small{color:#5e6960;font-size:7px;line-height:1.4}.sync-options button.is-selected{border-color:var(--green);background:#9dff3a0e}.sync-options button.is-selected strong{color:var(--green)}.timeline-axis--thirteen{grid-template-columns:82px repeat(13,minmax(34px,1fr))}.stream-row{grid-template-columns:82px minmax(0,1fr);margin-bottom:6px;display:grid}.stream-row>div{background-image:repeating-linear-gradient(90deg,#0000 0 calc(7.69231% - 1px),#9dff3a0e calc(7.69231% - 1px) 7.69231%);grid-template-columns:repeat(13,minmax(34px,1fr));gap:3px;min-height:61px;display:grid;position:relative}.stream-task{grid-column:var(--task-start) / span var(--task-span);border:1px solid color-mix(in srgb, var(--task-color) 32%, transparent);background:color-mix(in srgb, var(--task-color) 6%, #050806);color:color-mix(in srgb, var(--task-color) 55%, #667168);font-family:var(--font-geist-mono), monospace;text-align:center;place-items:center;padding:7px;font-size:6px;display:grid}.stream-task.is-current{border-color:var(--task-color);background:color-mix(in srgb, var(--task-color) 25%, #050806);color:#fff;box-shadow:0 0 13px color-mix(in srgb, var(--task-color) 23%, transparent);animation:.62s ease-in-out infinite stream-pulse}.stream-task.is-complete{border-color:var(--task-color);background:color-mix(in srgb, var(--task-color) 14%, #050806);color:var(--task-color)}.overlap-state{background:#050806;border:1px solid #263028;justify-content:space-between;margin:0 18px 18px;padding:12px 14px;display:flex}.overlap-state span,.overlap-state strong{font-family:var(--font-geist-mono), monospace;letter-spacing:.1em;font-size:7px}.overlap-state span{color:#667269}.overlap-state strong{color:var(--green);font-size:10px;font-weight:500}.overlap-state--running{border-color:#9dff3a6b}.concurrency-principle code{color:#bf8dff;background:#b975ff12}@keyframes queue-pulse{0%,to{opacity:.65}50%{opacity:1}}@keyframes stream-pulse{0%,to{filter:brightness(.85)}50%{filter:brightness(1.25)}}@media (max-width:1040px){.trace-workspace,.overlap-workspace{grid-template-columns:1fr}.concurrency-code{min-height:0}.split-workspace{grid-template-columns:minmax(300px,.7fr) minmax(500px,1.3fr)}}@media (max-width:760px){.split-workspace{grid-template-columns:1fr}.timeline-shell,.overlap-timeline{padding:14px}.strategy-feedback,.overlap-controls,.sync-options{grid-template-columns:1fr}.queue-lane{grid-template-columns:62px minmax(0,1fr)}.stream-rule{flex-direction:column;align-items:flex-start}}@media (max-width:420px){.stream-strategies{padding:13px}.queue-preview{padding:12px}.sync-options{padding-left:12px;padding-right:12px}.concurrency-code--async .lesson-code-line code{font-size:8px}}@media (prefers-reduced-motion:reduce){.queue-state--running,.stream-task.is-current{animation:none}.task-cell{transition:none}}