:root{color-scheme:dark}body,.app{margin:0;padding:0;min-height:100vh;background:#b3b3b3;color:#000;font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,Liberation Mono,Courier New,monospace;font-size:14px;line-height:1.35}.app{display:flex;justify-content:center;align-items:center;padding:1rem}.virt-screen{width:min(100ch,960px);background:#d1d1d1;border:1px solid #999;box-shadow:0 0 0 1px #00000040;padding:1rem}.virt-header{display:flex;justify-content:space-between;align-items:center;padding-bottom:.5rem;border-bottom:1px solid #999}.virt-title{font-size:1.2rem;letter-spacing:.18rem;color:#444}.virt-sub{font-size:.85rem;color:#333;display:flex;align-items:center;gap:.5rem}.virt-sub--steps{padding-top:.25rem;padding-bottom:.25rem;border-bottom:1px solid #999;margin-bottom:.5rem}.virt-cpm{font-weight:700;color:#222}.virt-sep{padding:0 .5rem;color:#777}.virt-main{margin-top:.75rem;display:flex;flex-direction:column;gap:.75rem}.virt-instruction{font-size:.78rem;color:#555;text-align:center}.virt-text{background:#fff;border:1px solid #999;padding:1rem;min-height:230px;display:block;position:relative;width:100%}.virt-text pre{margin:0;white-space:pre;font-size:1.05rem;letter-spacing:.08rem}.virt-top,.virt-bottom{width:100%;overflow-x:visible}.virt-top{border-bottom:1px solid #ccc;padding-bottom:.25rem;white-space:pre}.virt-next{color:#0a0;font-weight:700;text-decoration:underline}.virt-bottom pre{color:#000000b3;white-space:pre}.virt-hidden{visibility:hidden}.virt-text.virt-good{border-color:#4caf50;box-shadow:0 0 0 2px #4caf504d}.virt-text.virt-ok{border-color:#ff9800;box-shadow:0 0 0 2px #ff98004d}.virt-text.virt-bad{border-color:#f44336;box-shadow:0 0 0 2px #f443364d}.virt-input{position:relative;height:1px;width:1px;overflow:hidden}.virt-hidden-input{position:absolute;width:1px;height:1px;opacity:0;pointer-events:none}.virt-footer{display:grid;grid-template-columns:1fr;gap:.5rem;padding-top:.5rem;border-top:1px solid #999}.footer-row{display:flex;gap:.75rem;justify-content:space-between}.footer-row--muted{opacity:.75}.step-bar{display:inline-flex;align-items:center;gap:.2rem;margin-left:.5rem}.step-dot{width:.65rem;height:.65rem;border-radius:50%;background:#ccc;border:1px solid #999}.step-dot.completed{background:#4caf50;border-color:#2e7d32}.step-dot.current{background:#ff9800;border-color:#e65100}.stat{background:#f2f2f2;border:1px solid #999;padding:.5rem;text-align:center}.stat-label{font-size:.75rem;color:#444}.stat-value{font-size:1.2rem;font-weight:700;color:#000}.stat-value.good{color:#0b6623}.stat-value.ok{color:#ba8b00}.stat-value.bad{color:#b71c1c}.virt-nav{display:flex;justify-content:space-between;gap:.5rem}.virt-nav button{flex:1;padding:.5rem;border:1px solid #999;background:#e0e0e0;cursor:pointer;font-weight:700}.virt-nav button:disabled{opacity:.4;cursor:not-allowed}.virt-hint{color:#444;padding:.4rem;border:1px dashed #999;background:#eee}.virt-error{padding:.4rem;border:1px solid #c00;background:#f8d7da;color:#600}.panel pre{margin:0;white-space:pre}.lesson-list{margin:0;padding:0;list-style:none}.lesson-list li{margin:.25rem 0}.lesson-list button{width:100%;padding:.35rem .5rem;border:1px solid rgba(170,255,170,.5);background:#0000004d;color:inherit;text-align:left;cursor:pointer;font-family:inherit}.lesson-list button:hover,.lesson-list button:focus{outline:1px dashed rgba(170,255,170,.8)}.lesson-list button.active{background:#aaffaa40;border-color:#aaffaae6}.lesson-list button.locked{opacity:.5;cursor:not-allowed}.lesson-list button.passed{background:#00ff0026}.score-box{border:1px solid rgba(170,255,170,.8);padding:.7rem;background:#000000d9;white-space:pre}.score-box .line{margin:.35rem 0}.typing-area textarea{width:100%;height:140px;background:#00000040;border:1px solid rgba(170,255,170,.4);color:inherit;padding:.7rem;resize:vertical;font-family:inherit}.typing-area button{padding:.5rem .9rem;border:1px solid rgba(170,255,170,.55);background:#00000080;color:inherit;cursor:pointer;font-weight:700;margin-top:.5rem}.navigation{margin-top:.75rem;display:flex;gap:.5rem}.nav{padding:.4rem .75rem;border:1px solid rgba(170,255,170,.6);background:#0009;color:inherit;cursor:pointer}.nav:disabled{opacity:.4;cursor:not-allowed}.hint{margin-top:.75rem;padding:.5rem;background:#0000008c;border:1px dashed rgba(170,255,170,.6);color:#afac}.error{margin-top:.4rem;color:#f77;background:#ff00000f;border:1px solid rgba(255,0,0,.3);padding:.5rem;border-radius:.35rem}.footer{margin-top:1rem;width:100%;text-align:right;font-size:.85rem;opacity:.7}*{box-sizing:border-box}body{margin:0;font-family:system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif;background:#0b1220;color:#f7f7ff;line-height:1.5}a{color:inherit}.app{min-height:100vh;display:flex;flex-direction:column}.header{padding:1.5rem;border-bottom:1px solid rgba(255,255,255,.12);display:flex;flex-wrap:wrap;justify-content:space-between;align-items:center}.header h1{margin:0;font-size:1.6rem}.lang label{display:flex;gap:.5rem;align-items:center;font-weight:600}main{flex:1;display:grid;grid-template-columns:280px 1fr;gap:1.5rem;padding:1.5rem}.lessons{border:1px solid rgba(255,255,255,.12);border-radius:12px;padding:1rem}.lessons h2{margin-top:0}.lessons ul{list-style:none;padding:0;margin:0}.lessons li+li{margin-top:.5rem}.lessons button{width:100%;padding:.6rem .75rem;border:1px solid rgba(255,255,255,.18);border-radius:8px;background:#ffffff0f;color:inherit;cursor:pointer;text-align:left}.lessons button.active{border-color:#78c8ff;background:#78c8ff29}.lessons button.locked{opacity:.5;cursor:not-allowed}.lessons button.passed{border-color:#78ff78e6;background:#78ff781f}.practice{border:1px solid rgba(255,255,255,.12);border-radius:12px;padding:1rem}.lesson-preview pre{white-space:pre-wrap;word-break:break-word;padding:1rem;border-radius:10px;background:#ffffff0d;border:1px solid rgba(255,255,255,.1)}.typing-form{margin-top:1rem;display:grid;gap:.75rem}.typing-form textarea{width:100%;min-height:120px;padding:.85rem;border:1px solid rgba(255,255,255,.12);border-radius:10px;background:#ffffff0a;color:inherit;font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,Liberation Mono,Courier New,monospace;resize:vertical}.typing-form button{width:fit-content;align-self:flex-end;padding:.6rem 1rem;border:1px solid rgba(255,255,255,.2);border-radius:10px;background:#ffffff0f;color:inherit;cursor:pointer;font-weight:600}.score{margin-top:1.25rem;padding:1rem;border-radius:10px;background:#ffffff0d;border:1px solid rgba(255,255,255,.1)}.score dl{display:grid;grid-template-columns:160px 1fr;gap:.5rem 1rem;margin:0}.lesson-hint{margin:0 0 .75rem;font-size:.95rem;opacity:.85}.error{padding:.75rem;border-radius:10px;background:#ff32321a;border:1px solid rgba(255,50,50,.3)}.footer{padding:1rem 1.5rem;border-top:1px solid rgba(255,255,255,.12);font-size:.9rem;opacity:.75}
