.code-course-hub,.code-setup,.code-results,.custom-code-setup{--flow-space:var(--wf-space-6)}.code-course-next,.custom-code-card,.code-local-stats{justify-content:space-between;align-items:center;gap:var(--wf-space-6);display:flex}.code-course-next>div,.custom-code-card>div,.code-local-stats>div{max-width:68ch}.code-progress{gap:var(--wf-space-3);display:grid}.code-progress>div:first-child{justify-content:space-between;gap:var(--wf-space-3);flex-wrap:wrap;display:flex}.code-progress span{color:var(--wf-text-muted)}.code-lesson-grid{gap:var(--wf-space-4);grid-template-columns:repeat(2,minmax(0,1fr));display:grid}.code-lesson-card{grid-template-columns:auto minmax(0,1fr);display:grid;overflow:hidden}.code-lesson-card__number{width:3.5rem;padding-block:var(--wf-space-5);border-inline-end:1px solid var(--wf-border-subtle);color:var(--wf-text-muted);font-family:var(--wf-font-typing);font-variant-numeric:tabular-nums;place-items:start center;font-weight:750;display:grid}.code-lesson-card__body{align-content:start;gap:var(--wf-space-3);min-width:0;padding:var(--wf-space-5);display:grid}.code-lesson-card__body p{margin:0}.code-lesson-card__title{justify-content:space-between;align-items:start;gap:var(--wf-space-3);flex-wrap:wrap;display:flex}.code-lesson-card__title h3{margin:0}.code-section-intro{max-width:70ch;margin-block:calc(var(--wf-space-3) * -1) var(--wf-space-5);color:var(--wf-text-secondary)}.code-local-stats{align-items:start}.code-local-stats dl{gap:var(--wf-space-3);grid-template-columns:repeat(3,minmax(7rem,1fr));width:min(100%,36rem);margin:0;display:grid}.code-local-stats dl>div{gap:var(--wf-space-1);display:grid}.code-local-stats dt{color:var(--wf-text-muted);font-size:.78rem;font-weight:700}.code-local-stats dd{font-variant-numeric:tabular-nums;margin:0;font-size:1.15rem;font-weight:800}.code-setup,.custom-code-setup,.code-results{padding:clamp(var(--wf-space-5), 4vw, var(--wf-space-8))}.code-setup__heading,.code-results__heading,.code-session__header{justify-content:space-between;align-items:start;gap:var(--wf-space-5);display:flex}.code-setup__summary{gap:var(--wf-space-3);grid-template-columns:repeat(3,minmax(0,1fr));display:grid}.code-setup__summary>div,.code-setup__summary>label{align-content:start;gap:var(--wf-space-2);min-height:5.6rem;padding:var(--wf-space-4);border:1px solid var(--wf-border-subtle);border-radius:var(--wf-radius-control);background:var(--wf-surface-sunken);display:grid}.code-setup__summary span{color:var(--wf-text-secondary);font-size:.78rem;font-weight:700}.code-session{min-width:0;overflow:visible}.code-session__header{min-height:6.6rem;padding:var(--wf-space-5);border-block-end:1px solid var(--wf-border-subtle)}.code-session__header h2,.code-results__heading h2{margin-block:var(--wf-space-1) 0}.code-session__time{justify-items:end;gap:var(--wf-space-1);min-width:8rem;display:grid}.code-session__time span,.code-metrics span,.code-result-metric span{color:var(--wf-text-muted);letter-spacing:.025em;font-size:.78rem;font-weight:700}.code-result-metric span{color:var(--wf-text-secondary)}.code-session__time strong{font-size:1.45rem}.code-metrics{border-block-end:1px solid var(--wf-border-subtle);grid-template-columns:repeat(4,minmax(0,1fr));min-height:5.3rem;display:grid}.code-metrics>div{place-items:center;gap:var(--wf-space-1);min-width:0;padding:var(--wf-space-3);display:grid}.code-metrics>div+div{border-inline-start:1px solid var(--wf-border-subtle)}.code-metrics strong{font-variant-numeric:tabular-nums;text-align:center;min-width:4ch;font-size:clamp(1.1rem,1rem + .45vw,1.45rem)}.code-next-character{align-items:center;gap:var(--wf-space-3);min-height:3.25rem;padding-inline:clamp(var(--wf-space-4), 3vw, var(--wf-space-6));border-block-end:1px solid var(--wf-border-subtle);background:var(--wf-surface-sunken);display:flex}.code-next-character span{color:var(--wf-text-secondary);text-transform:uppercase;font-size:.78rem;font-weight:700}.code-next-character strong{font-family:var(--wf-font-typing);text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.code-typing-area{gap:var(--wf-space-3);padding:clamp(var(--wf-space-4), 3vw, var(--wf-space-6));display:grid}.code-session__status-row{align-items:center;gap:var(--wf-space-2);min-height:2.8rem;color:var(--wf-text-muted);flex-wrap:wrap;font-size:.85rem;display:flex}.code-whitespace-toggle{align-items:center;gap:var(--wf-space-2);min-height:44px;color:var(--wf-text-secondary);cursor:pointer;margin-inline-start:auto;display:inline-flex}.code-focus-status{flex:0 0 21ch}.code-whitespace-toggle input{width:1.1rem;height:1.1rem}.code-restart-hint{margin-inline-start:var(--wf-space-2)}.code-session__actions{min-height:4.8rem;padding:0 var(--wf-space-5) var(--wf-space-5);align-items:center;display:flex}.code-result-metrics{gap:var(--wf-space-3);grid-template-columns:repeat(3,minmax(0,1fr));display:grid}.code-result-metric{align-content:start;gap:var(--wf-space-2);min-height:6.5rem;padding:var(--wf-space-4);border:1px solid var(--wf-border-subtle);border-radius:var(--wf-radius-control);background:var(--wf-surface-sunken);display:grid}.code-result-metric strong{font-variant-numeric:tabular-nums;font-size:clamp(1.15rem,1rem + .6vw,1.65rem)}.code-result-metric--primary{border-color:var(--wf-brand);background:var(--wf-surface-brand)}.custom-code-field{gap:var(--wf-space-2);font-weight:700;display:grid}.custom-code-field textarea{width:100%;min-height:18rem;padding:var(--wf-space-4);border:1px solid var(--wf-border-control);border-radius:var(--wf-radius-control);background:var(--wf-surface-sunken);color:var(--wf-text-primary);font-family:var(--wf-font-typing);resize:vertical;white-space:pre-wrap;font-size:1rem;line-height:1.5}.custom-code-field textarea:focus-visible{outline:3px solid var(--wf-focus-ring);outline-offset:2px}.custom-code-meta{justify-content:space-between;align-items:start;gap:var(--wf-space-4);display:flex}.custom-code-meta p{margin:0}.field-error{min-height:1.5rem;color:var(--wf-danger);font-weight:700}@media (width<=48rem){.code-course-next,.custom-code-card,.code-local-stats{flex-direction:column;align-items:stretch}.code-lesson-grid,.code-setup__summary,.code-result-metrics,.code-local-stats dl{grid-template-columns:1fr}.code-session__header{min-height:7.2rem}.code-metrics{grid-template-columns:repeat(2,minmax(0,1fr));min-height:8.9rem}.code-metrics>div:nth-child(3){border-inline-start:0;border-block-start:1px solid var(--wf-border-subtle)}.code-metrics>div:nth-child(4){border-block-start:1px solid var(--wf-border-subtle)}.code-session__status-row{min-height:6rem}.code-whitespace-toggle{width:100%;margin-inline-start:0}.code-restart-hint{margin-inline-start:auto}.custom-code-meta{flex-direction:column}}@media (width<=26.875rem){.code-session__header{flex-direction:column;min-height:8rem}.code-session__time{grid-template-columns:auto auto;justify-items:start;min-width:0}}@media (prefers-reduced-motion:reduce){.code-session *,.code-results *{scroll-behavior:auto}}@media (forced-colors:active){.code-result-metric--primary,.code-next-character,.code-lesson-card__number{border-color:canvastext}}.code-language-identity{color:var(--wf-text-primary);flex-wrap:wrap;align-items:center;gap:.5rem;display:flex}.code-language-extension{border:1px solid var(--wf-border-control);border-radius:var(--wf-radius-control);font-family:var(--wf-font-typing);padding:.15rem .5rem}.code-language-focus{color:var(--wf-text-secondary);flex-basis:100%;font-size:.875rem}.code-guidance{padding:var(--wf-space-5);border-block-start:1px solid var(--wf-border-subtle)}.code-guidance-settings summary{cursor:pointer;min-height:44px}.code-guidance-settings label{align-items:center;gap:.5rem;min-height:44px;display:inline-flex}.code-guidance-copy{min-height:3rem;margin-block:1rem}.code-guidance-visuals{grid-template-columns:minmax(0,1fr) minmax(15rem,20rem);gap:1rem;margin-block-end:1rem;display:grid}.code-guidance-visuals>:only-child{grid-column:1/-1}.code-guidance .training-hand-panel p{align-content:start;height:8rem;min-height:8rem;margin-block-end:0}.code-file-context{height:5rem;padding:.5rem var(--wf-space-5);color:var(--wf-text-secondary);margin:0;overflow:hidden}.code-learning-controls{padding:var(--wf-space-5)}.code-learning-controls select{max-width:100%}.code-learning-instruction{min-height:5rem}.code-history{overflow-wrap:anywhere}.code-session__header h2{font-size:1.2rem}@media (width<=70rem){.code-guidance-visuals{grid-template-columns:minmax(0,1fr)}}@media (width<=48rem){.code-guidance-copy{min-height:6rem}.code-learning-instruction{min-height:8rem}}.code-result-context{flex-wrap:wrap;gap:1.5rem;display:flex}.code-result-context dt{color:var(--wf-text-secondary);font-size:.875rem}.code-result-context dd{margin:.25rem 0 0}.code-duration{border:0;min-width:0;padding:0}.code-duration legend{margin-block-end:.5rem}.code-duration button[aria-pressed=true]{outline:2px solid var(--wf-brand);outline-offset:2px}.code-session .typing-capture{height:1px;inset-block-end:auto}.code-learning-workspace{scroll-margin-block-start:8px}.code-learning-controls{grid-template-columns:1fr auto;gap:6px 16px;margin-block-end:8px;padding:12px 16px;display:grid}.code-learning-controls h2{margin:0;font-size:1rem}.code-learning-controls p{margin:0;font-size:.875rem}.code-learning-controls .training-round-progress{grid-column:1;margin:0}.code-round-review{grid-area:2/2;align-self:start}.code-round-review summary{cursor:pointer;min-height:36px;font-size:.875rem}.code-round-review[open]{grid-area:auto/1/auto/-1}.code-learning-controls .code-learning-instruction,.code-learning-controls .notice,.code-learning-controls [role=status]{grid-column:1/-1;min-height:0}.code-guidance-settings>summary{align-items:center;gap:8px;font-weight:700;display:flex}.code-guidance-settings>summary:before{content:"▸"}.code-guidance-settings[open]>summary:before{content:"▾"}.code-guidance-settings .finger-guide-reference{margin-block:12px}.code-guidance-visuals{margin-block-end:0}.code-session--guided .code-session__header{min-height:0;padding:10px 16px}.code-session--guided .code-session__header>div:first-child{flex-wrap:wrap;align-items:center;gap:4px 16px;display:flex}.code-session--guided .code-session__header h2{margin:0;font-size:1rem}.code-session--guided .code-session__time{gap:0;min-width:5rem}.code-session--guided .code-session__time strong{font-size:1rem}.code-session--guided .code-metrics{min-height:54px}.code-session--guided .code-metrics>div{gap:0;padding:4px}.code-session--guided .code-metrics strong{font-size:1.1rem}.code-session--guided .code-next-character{min-height:36px;padding-inline:16px}.code-session--guided .code-typing-area{gap:4px;padding:12px 16px}.code-session--guided .code-session__actions{gap:8px;min-height:52px;padding:0 16px 8px}.code-session--guided .code-guidance{flex-direction:column;padding:8px 12px;display:flex}.code-session--guided .code-guidance-copy{min-height:3rem;margin:0 0 8px;font-size:.875rem}.code-session--guided .code-guidance-settings{order:3}.code-session--guided .code-guidance-visuals{gap:8px}@media (width>=60rem){.code-session--guided{grid-template-rows:auto 54px 36px 1fr auto;grid-template-columns:minmax(0,.85fr) minmax(0,1.15fr);display:grid}.code-session--guided .code-session__header{grid-column:1/-1}.code-session--guided .code-metrics,.code-session--guided .code-next-character,.code-session--guided .code-typing-area,.code-session--guided .code-session__actions{grid-column:1}.code-session--guided .code-guidance{border-block-start:0;border-inline-start:1px solid var(--wf-border-subtle);grid-area:2/2/6}.code-session--guided .code-guidance-visuals{grid-template-columns:1fr}.code-session--guided .training-keyboard{padding:8px}.code-session--guided .training-key{height:44px}.code-session--guided .training-hand-panel{padding:4px}.code-session--guided .hand-guide-diagram{max-width:210px}.code-session--guided .typing-viewport--code{height:260px;padding:12px}.code-session--guided .code-session__status-row{align-content:start;min-height:72px}.code-session--guided .code-whitespace-toggle{margin-inline-start:0}.code-session--guided .code-restart-hint{margin-inline-start:auto}}@media (width<=59.999rem){.code-session--guided .typing-viewport--code{height:220px}.code-session--guided .code-guidance-visuals{grid-template-columns:1fr}.code-session--guided .code-session__header{flex-direction:row}.code-session--guided .code-session__time{grid-template-columns:1fr;justify-items:end;display:grid}}@media (width<=36rem){.code-learning-controls{grid-template-columns:1fr}.code-learning-controls .training-round-progress{grid-template-columns:repeat(8,minmax(0,1fr));gap:4px}.code-round-review{grid-area:auto/1}.code-learning-controls .code-learning-instruction{font-size:.875rem}}.code-quick-nav{flex-wrap:wrap;gap:8px 24px;margin-block-start:12px;display:flex}.code-quick-nav a{align-items:center;min-height:44px;font-weight:700;display:inline-flex}.code-entry-section{scroll-margin-block-start:16px}.code-hub-primary{grid-template-columns:minmax(0,1.1fr) minmax(0,1fr);align-items:start;gap:20px;display:grid}.code-hub-primary h2{font-size:1.4rem}.code-hub-primary .code-lesson-grid{grid-template-columns:1fr}.code-hub-primary .code-lesson-card__number{display:none}.code-hub-primary .code-lesson-card{grid-template-columns:1fr}.code-hub-primary .code-lesson-card__body{gap:8px;padding:16px}.code-hub-primary .code-lesson-card__body>p:not(.field-help){display:none}.code-hub-primary .code-setup{--flow-space:16px;padding:20px}.code-hub-primary .code-setup [data-code-language]{display:none}.code-hub-primary .code-history{margin-block-start:16px}.code-hub-primary:has(.code-session),.code-hub-primary:has(.code-results){grid-template-columns:1fr}@media (width<=59.999rem){.code-hub-primary{grid-template-columns:1fr}}@media (width>=60rem){.code-session--guided .code-session__time{align-items:center;gap:8px;display:flex}.code-session--guided .training-keyboard{padding:6px}.code-session--guided .training-keyboard__caption{height:22px;margin-block-end:4px}.code-learning-controls .code-learning-instruction{line-height:1.45}}.code-learning-notes{margin-block:12px;font-size:.875rem}
