@import "https://fonts.googleapis.com/css2?family=DM+Mono:wght@400;500&family=DM+Sans:wght@400;500;600;700&display=swap";:root{color:#edf2f3;background:#101519;font-family:DM Sans,sans-serif}*{box-sizing:border-box}html,body,#learning-app{width:100%;height:100%;margin:0;overflow:hidden}button{font:inherit}.learning-stage{position:absolute;inset:0}.learning-stage canvas{width:100%;height:100%;display:block}.learn-overlay{z-index:3;pointer-events:none;position:absolute;inset:0}.learn-heading{position:absolute;top:max(64px,7vh);left:clamp(24px,5vw,76px)}.learn-kicker,.lesson-progress,.lesson-actions button,.haptic-note,.input-controls,.haptic-cursor{letter-spacing:.12em;font-family:DM Mono,monospace}.learn-kicker{color:#a6b6bc;font-size:10px}.learn-kicker span{color:#ff5364}.learn-heading h1{color:#f0f3f3;letter-spacing:-.06em;margin:26px 0 10px;font-size:clamp(40px,5vw,66px);font-weight:500;line-height:.94}.learn-heading p{color:#95a6ad;margin:0;font-size:13px}.lesson-progress{text-align:right;position:absolute;top:max(66px,7.2vh);right:clamp(24px,5vw,76px)}.lesson-steps{color:#5f7078;justify-content:flex-end;align-items:center;gap:9px;font-size:8px;display:flex}.lesson-steps i{color:#36444c;font-style:normal}.lesson-steps [data-active]{color:#79bfff}.lesson-readout{flex-direction:column;gap:7px;margin-top:19px;display:flex}.lesson-readout strong{color:#80bdf4;font-size:11px;font-weight:500}.lesson-readout span{color:#99a9af;font-size:9px}.lesson-prompt{text-align:center;pointer-events:auto;background:#111a20e8;border:1px solid #34434b;width:min(520px,100vw - 40px);padding:13px 16px;position:absolute;bottom:5.3%;left:50%;transform:translate(-50%);box-shadow:0 12px 48px #0005}.lesson-prompt p{color:#d9e2e5;margin:0;font-size:14px}.lesson-actions{justify-content:center;gap:8px;margin-top:10px;display:flex}.lesson-actions:empty{display:none}.lesson-actions button,.input-controls button{color:#c5d2d6;cursor:pointer;background:#18232a;border:1px solid #43545e;padding:7px 10px;font-size:8px}.lesson-actions button:hover,.lesson-actions button:focus-visible,.input-controls button:hover,.input-controls button:focus-visible{color:#fff;border-color:#79bfff;outline:none}.haptic-note{color:#65777f;font-size:8px;position:absolute;bottom:6.3%;left:clamp(24px,5vw,76px)}.input-controls{color:#7f9098;pointer-events:auto;align-items:flex-end;gap:10px;font-size:8px;display:flex;position:absolute;bottom:5.3%;right:clamp(24px,5vw,76px)}.input-choice{justify-items:end;gap:6px;display:grid}.input-choice .input-title{color:#8799a2;font-size:8px}.input-mode{color:#d2dcdf;letter-spacing:.04em;white-space:nowrap;background:#121920df;border:1px solid #34434b;gap:3px;padding:7px 10px;font-size:8px;display:grid}.input-mode strong{font-weight:500}.input-mode small{color:#8799a2;letter-spacing:.1em;text-transform:uppercase;font-size:7px}.input-controls button{color:#dceeff;cursor:pointer;background:#15232d;border:1px solid #79bfff;padding:8px 10px;font-size:8px;transition:background .14s,color .14s,box-shadow .14s}.input-controls button:hover:not(:disabled),.input-controls button:focus-visible{color:#fff;background:#203849;border-color:#a7d5ff;outline:none;box-shadow:0 0 16px #79bfff35}.input-controls button:disabled{opacity:.55;cursor:wait}.input-status{color:#a8b8bf;text-align:right;max-width:230px;font-size:7px}.input-choice [data-connect]{min-width:130px}.input-controls [data-restart]{color:#9eabb2;background:#141a20df;border-color:#43545e}.input-controls [data-restart]:hover,.input-controls [data-restart]:focus-visible{border-color:#ff5364}.haptic-cursor{z-index:4;color:#ff8490;white-space:nowrap;background:#261a20ed;border:1px solid #984b55;padding:5px 7px;font-size:8px;position:absolute;transform:translate(14px,-50%)}[hidden]{display:none!important}@media (width<=760px){.learn-heading{top:58px;left:20px}.learn-heading h1{margin-top:18px;font-size:42px}.learn-heading p{max-width:180px;font-size:11px}.lesson-progress{top:62px;right:18px}.lesson-steps{gap:4px;font-size:6px}.lesson-readout{margin-top:12px}.haptic-note{max-width:170px;font-size:7px;line-height:1.5;bottom:116px;left:20px}.input-controls{flex-wrap:wrap;justify-content:flex-end;max-width:62vw;bottom:106px;right:16px}.input-choice [data-connect]{min-width:118px}.lesson-prompt{bottom:18px}}