.ocean{z-index:-1;pointer-events:none;width:100%;height:15vh;position:fixed;bottom:0;left:0;overflow:hidden}.waves{width:100%;height:15vh;min-height:80px;max-height:150px;position:absolute;bottom:0}.parallax>use{animation:25s cubic-bezier(.55,.5,.45,.5) infinite move-forever}.parallax>use:first-child{fill:#38bdf80d;animation-duration:11s;animation-delay:-2s}.parallax>use:nth-child(2){fill:#38bdf81a;animation-duration:14s;animation-delay:-4s}.parallax>use:nth-child(3){fill:#38bdf826;animation-duration:17s;animation-delay:-6s}.parallax>use:nth-child(4){fill:#38bdf833;animation-duration:22s;animation-delay:-8s}body[data-theme=light] .parallax>use:first-child{fill:#0ea5e914}body[data-theme=light] .parallax>use:nth-child(2){fill:#0ea5e926}body[data-theme=light] .parallax>use:nth-child(3){fill:#0ea5e933}body[data-theme=light] .parallax>use:nth-child(4){fill:#0ea5e94d}@keyframes move-forever{0%{transform:translate(-90px)}to{transform:translate(85px)}}.rain-container{z-index:1;pointer-events:none;width:100%;height:100%;position:absolute;top:0;left:0;overflow:hidden}.raindrop{will-change:transform;background:linear-gradient(#fff0,#ffffffb3);width:1px;height:25px;animation:linear infinite fall;position:absolute;top:-50px}[data-theme=light] .raindrop{background:linear-gradient(#0000,#0000004d)}@keyframes fall{0%{transform:translateY(0)translate(0)}to{transform:translateY(120vh)translate(-15px)}}.sound-settings-container{z-index:100;display:inline-block;position:relative}.sound-controls-group{align-items:center;gap:8px;display:flex}.sound-toggle-btn{background:var(--surface);color:var(--text);border:1px solid var(--border);cursor:pointer;border-radius:50%;justify-content:center;align-items:center;width:45px;height:45px;font-size:1.2rem;transition:all .2s;display:flex;box-shadow:0 4px 6px #0000001a}.sound-toggle-btn:hover{background:var(--surface-hover);transform:translateY(-2px)}.sound-settings-btn{background:var(--surface);color:var(--text);border:1px solid var(--border);cursor:pointer;border-radius:50%;justify-content:center;align-items:center;width:32px;height:32px;font-size:.9rem;transition:all .2s;display:flex;box-shadow:0 2px 4px #0000001a}.sound-settings-btn:hover{background:var(--surface-hover);transform:translateY(-2px)}.sound-popover{background:var(--surface);border:1px solid var(--border);border-radius:12px;width:240px;animation:.2s ease-out popIn;position:absolute;top:55px;right:0;overflow:hidden;box-shadow:0 10px 25px #0003}@keyframes popIn{0%{opacity:0;transform:scale(.5)}to{opacity:1;transform:scale(1)}}.popover-header{background:var(--primary);color:#fff;padding:10px 15px}.popover-header h4{margin:0;font-size:.95rem;font-weight:500}.popover-content{padding:15px}.setting-row{color:var(--text);justify-content:space-between;align-items:center;margin-bottom:15px;font-size:.9rem;display:flex}.setting-row:last-child{margin-bottom:0}.volume-row{flex-direction:column;align-items:flex-start;gap:10px}.volume-slider{cursor:pointer;width:100%}.switch{width:40px;height:22px;display:inline-block;position:relative}.switch input{opacity:0;width:0;height:0}.slider{cursor:pointer;background-color:#ccc;transition:all .4s;position:absolute;inset:0}body[data-theme=dark] .slider{background-color:#555}.slider:before{content:"";background-color:#fff;width:16px;height:16px;transition:all .4s;position:absolute;bottom:3px;left:3px}input:checked+.slider{background-color:var(--primary)}input:checked+.slider:before{transform:translate(18px)}.slider.round{border-radius:34px}.slider.round:before{border-radius:50%}:root{--primary:#6366f1;--primary-hover:#4f46e5;--bg-dark:#0f172a;--glass-bg:#1e293bb3;--glass-border:#ffffff1a;--success:#10b981;--error:#ef4444;--text-main:#f8fafc;--text-muted:#94a3b8;--kbd-bg:#1e293b;--kbd-border:#334155;--key-bg:#0f172a;--key-border:#1e293b;--key-shadow:#020617;--key-text:#f8fafc}body[data-theme=light]{--primary:#4f46e5;--primary-hover:#4338ca;--bg-dark:#f1f5f9;--glass-bg:#ffffffb3;--glass-border:#0000001a;--success:#059669;--error:#dc2626;--text-main:#0f172a;--text-muted:#475569;--kbd-bg:#d5d9df;--kbd-border:#c0c4c9;--key-bg:#fff;--key-border:#d1d5db;--key-shadow:#c2c5c9;--key-text:#4a4a4a}body{background-color:var(--bg-dark);color:var(--text-main);min-height:100vh;margin:0;font-family:Roboto,Tiro Bangla,sans-serif;transition:background-color .3s,color .3s;position:relative;overflow-x:hidden}body:before{content:"";z-index:-1;pointer-events:none;background:radial-gradient(circle,#6366f10f 0%,#0000 60%),radial-gradient(circle at 80% 20%,#c084fc0a 0%,#0000 50%),radial-gradient(circle at 20% 80%,#10b98108 0%,#0000 50%);width:200%;height:200%;animation:25s ease-in-out infinite alternate mindFocusBreathing;position:fixed;top:-50%;left:-50%}body[data-theme=light]:before{background:radial-gradient(circle,#4f46e514 0%,#0000 60%),radial-gradient(circle at 80% 20%,#a855f70f 0%,#0000 50%),radial-gradient(circle at 20% 80%,#0596690a 0%,#0000 50%)}@keyframes mindFocusBreathing{0%{transform:rotate(0)scale(1)translate(0)}33%{transform:rotate(1deg)scale(1.02)translate(1%,1%)}66%{transform:rotate(-1deg)scale(.98)translate(-1%)}to{transform:rotate(0)scale(1.03)translateY(-1%)}}.top-controls{z-index:100;gap:15px;display:flex;position:absolute;top:2rem;right:2rem}.theme-toggle{cursor:pointer;background:var(--glass-bg);border:1px solid var(--glass-border);z-index:100;-webkit-user-select:none;user-select:none;border-radius:50%;justify-content:center;align-items:center;width:45px;height:45px;padding:.5rem;font-size:1.5rem;transition:all .3s;display:flex}.theme-toggle:hover{transform:scale(1.1)}.app-container{z-index:10;box-sizing:border-box;flex-direction:column;justify-content:flex-start;align-items:center;width:100%;max-width:92vw;min-height:100vh;margin:0 auto;padding:2rem;display:flex;position:relative}.app-header{text-align:center;margin-bottom:3rem}.app-header h1{background:-webkit-linear-gradient(45deg,#60a5fa,#c084fc);-webkit-text-fill-color:transparent;-webkit-background-clip:text;margin:0;font-size:3rem}.app-header p{color:var(--text-muted);font-size:1.1rem}main{z-index:5;position:relative}.typing-layout-wrapper{align-items:flex-start;gap:2rem;width:100%;max-width:1500px;display:flex}.sidebar{background:var(--glass-bg);border:1px solid var(--glass-border);-webkit-backdrop-filter:blur(16px);border-radius:24px;flex-direction:column;flex-shrink:0;width:250px;padding:1.5rem;display:flex;box-shadow:0 25px 50px -12px #00000080}.sidebar-title{color:var(--text-muted);text-transform:uppercase;letter-spacing:1px;border-bottom:1px solid var(--glass-border);margin-bottom:1.5rem;padding-bottom:.8rem;font-size:1.2rem;font-weight:400}.sidebar-buttons{flex-direction:column;gap:.8rem;display:flex}.sidebar-btn{border:1px solid var(--glass-border);color:var(--text-main);text-align:left;cursor:pointer;background:#9696960d;border-radius:12px;padding:1rem;font-family:inherit;font-size:1rem;font-weight:400;transition:all .2s}.sidebar-btn:hover{background:#96969626;transform:translate(4px)}.sidebar-btn.active{background:var(--primary);color:#fff;border-color:var(--primary-hover);box-shadow:0 4px 15px #6366f14d}.typing-board-container{background:var(--glass-bg);-webkit-backdrop-filter:blur(16px);border:1px solid var(--glass-border);border-radius:24px;flex-direction:column;flex-grow:1;justify-content:flex-start;align-items:center;width:100%;padding:2.5rem;display:flex;position:relative;overflow:hidden;box-shadow:0 25px 50px -12px #00000080}.stats-panel{border-bottom:1px solid var(--glass-border);justify-content:space-between;margin-bottom:2rem;padding-bottom:1.5rem;display:flex}.stat-box{flex-direction:row;align-items:baseline;gap:12px;display:flex}.stat-label{color:var(--text-muted);text-transform:uppercase;letter-spacing:1px;font-size:.9rem}.stat-value{color:var(--primary);font-size:1.5rem;font-weight:400}.text-display{flex-wrap:wrap;place-content:flex-start center;gap:12px;max-width:100%;min-height:200px;margin-bottom:3rem;animation:.4s cubic-bezier(.25,.46,.45,.94) forwards pageSlideIn;display:flex}@media (width<=768px){.text-display{gap:8px}}@keyframes pageSlideIn{0%{opacity:0;transform:translate(40px)}to{opacity:1;transform:translate(0)}}.char-box{border:1px solid var(--glass-border);background:#ffffff0d;border-radius:12px;flex-direction:column;justify-content:center;align-items:center;padding:12px 20px;transition:all .3s cubic-bezier(.4,0,.2,1);display:flex}.bn-char{font-family:Tiro Bangla,serif;font-size:2rem;font-weight:400}.char-box.error-box{border-color:var(--danger);background:#ef444426;box-shadow:0 0 12px #ef444466}.char-box.error-box .bn-char,.char-box.error-box .qwerty-hint{color:var(--danger)}.error-alert-box{border:2px solid var(--danger);color:#fff;background:#ef444426;border-radius:12px;justify-content:center;align-items:center;gap:15px;margin:10px 0;padding:12px 25px;animation:.4s ease-in-out shakeAlert;display:flex;box-shadow:0 4px 15px #ef44444d}.error-icon{font-size:1.8rem;animation:1s infinite warningPulse}.error-alert-text{text-align:left;flex-direction:row;align-items:center;gap:8px;display:flex}.error-alert-text strong{color:#ff6b6b;font-size:1.1rem}.error-alert-text span{color:#f1f1f1;font-size:1rem}.error-alert-text kbd{color:#fff;letter-spacing:.5px;background:#2a2a2a;border:1px solid #111;border-bottom-width:4px;border-radius:6px;margin:0 4px;padding:4px 12px;font-family:Segoe UI,system-ui,sans-serif;font-size:.95rem;font-weight:400;display:inline-block;transform:translateY(-2px);box-shadow:0 3px 6px #0006,inset 0 1px 1px #ffffff26}@keyframes shakeAlert{0%,to{transform:translate(0)}20%,60%{transform:translate(-5px)}40%,80%{transform:translate(5px)}}@keyframes warningPulse{0%,to{transform:scale(1)}50%{transform:scale(1.2)}}.qwerty-hint{color:var(--text-muted);margin-top:8px;font-family:monospace;font-size:14px;font-weight:400}.pressed-key{color:#4ade80;opacity:.5;text-decoration:line-through}.char-box.correct{border-color:var(--success);color:var(--success);background:#10b98133}.char-box.correct .qwerty-hint{color:var(--success)}.char-box.active{border-color:var(--primary);background:#6366f133;transform:translateY(-4px)scale(1.05);box-shadow:0 10px 15px -3px #6366f14d}.char-box.active .qwerty-hint{color:var(--text-main)}.char-box.wrong{border-color:var(--error);color:var(--error);background:#ef444433;animation:.4s cubic-bezier(.36,.07,.19,.97) both shake}.keyboard-info{text-align:center;color:var(--text-muted);font-size:1.1rem}.key-pressed{color:var(--text-main);border:1px solid var(--glass-border);background:#0000004d;border-radius:8px;padding:6px 16px;font-family:monospace;font-weight:400;display:inline-block}.completion-modal-overlay{-webkit-backdrop-filter:blur(12px);z-index:100;background:#0f172a99;border-radius:20px;flex-direction:column;justify-content:center;align-items:center;animation:.3s ease-out fadeIn;display:flex;position:absolute;inset:0}.completion-modal-premium{text-align:center;background:#1e293bb3;border:1px solid #ffffff1a;border-radius:24px;width:90%;max-width:550px;padding:3rem;animation:.4s cubic-bezier(.175,.885,.32,1.275) forwards slideUp;transform:translateY(20px);box-shadow:0 25px 50px -12px #00000080,0 0 40px #6366f126}@keyframes slideUp{to{transform:translateY(0)}}.completion-modal-premium h3{background:-webkit-linear-gradient(45deg,#60a5fa,#c084fc);-webkit-text-fill-color:transparent;-webkit-background-clip:text;margin:0 0 1rem;font-size:2.5rem}.premium-stars-container{justify-content:center;gap:10px;margin:1.5rem 0;display:flex}.premium-stars-container .star{color:#ffffff1a;font-size:3rem;transition:all .3s}.premium-stars-container .star.active{color:#fbbf24;text-shadow:0 0 20px #fbbf2480;animation:.5s cubic-bezier(.175,.885,.32,1.275) popIn}.premium-stats-grid{grid-template-columns:repeat(3,1fr);gap:1.5rem;margin:2rem 0;display:grid}.premium-stat-card{background:#ffffff08;border:1px solid #ffffff0d;border-radius:16px;flex-direction:column;justify-content:center;align-items:center;padding:1.5rem 1rem;transition:transform .3s,background .3s;display:flex}.premium-stat-card:hover{background:#ffffff14;border-color:#ffffff1a;transform:translateY(-5px)}.premium-stat-value{color:var(--text-main);margin-bottom:.5rem;font-size:2.2rem;font-weight:700;line-height:1}.premium-stat-label{color:var(--text-muted);text-transform:uppercase;letter-spacing:1px;font-size:.95rem}.modal-actions{justify-content:center;gap:1.5rem;margin-top:2rem;display:flex}.modal-actions button{cursor:pointer;border-radius:12px;align-items:center;gap:.8rem;padding:1rem 2rem;font-family:Tiro Bangla,Roboto,sans-serif;font-size:1.1rem;transition:all .3s;display:flex}.btn-primary{background:var(--primary);color:#fff;border:none;box-shadow:0 4px 15px #6366f14d}.btn-primary:hover{background:var(--primary-hover);transform:translateY(-2px);box-shadow:0 6px 20px #6366f180}.btn-secondary{color:var(--text-main);background:#ffffff0d;border:1px solid #ffffff1a}.btn-secondary:hover{background:#ffffff1a;transform:translateY(-2px)}.shortcut-hint{color:var(--text-muted);background:#0000004d;border-radius:6px;padding:.3rem .6rem;font-family:monospace;font-size:.85rem}@keyframes shake{10%,90%{transform:translate(-1px)}20%,80%{transform:translate(2px)}30%,50%,70%{transform:translate(-4px)}40%,60%{transform:translate(4px)}}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}.level-select:hover{border-color:var(--primary);background-color:#ffffff26}.level-select option{background:var(--bg-dark);color:var(--text-main);padding:10px}.practice-guide-area{flex-direction:column;align-items:center;margin-top:1rem;display:flex;position:relative}.virtual-keyboard{background:var(--kbd-bg);border:1px solid var(--kbd-border);-webkit-user-select:none;user-select:none;border-radius:14px;flex-direction:column;gap:6px;margin-bottom:2rem;padding:1.2rem;transition:all .3s;display:flex;box-shadow:inset 0 2px 5px #ffffff0d,0 10px 20px #0003}.keyboard-row{justify-content:center;gap:6px;display:flex}.key{background:var(--key-bg);color:var(--key-text);border:1px solid var(--key-border);border-bottom:2px solid var(--key-shadow);width:48px;height:50px;box-shadow:0 2px 0 var(--key-shadow);border-radius:8px;justify-content:center;align-items:center;font-family:Roboto,-apple-system,sans-serif;font-size:.95rem;font-weight:400;transition:all .1s cubic-bezier(.4,0,.2,1);display:flex;position:relative}[data-theme=light] .key{color:#475569;background:#fff;border:1px solid #e2e8f0;border-bottom:2px solid #cbd5e1;box-shadow:0 2px #cbd5e1}.key-active{transform:translateY(2px);background:var(--primary)!important;color:#fff!important;border-color:var(--primary-hover)!important;border-bottom-width:1px!important;box-shadow:0 0 #0000!important}[data-theme=light] .key-active{background:var(--primary)!important;color:#fff!important;border-color:var(--primary-hover)!important;box-shadow:0 0 #0000!important}.key-error{animation:.3s ease-in-out shake;transform:translateY(2px);background:var(--error)!important;color:#fff!important;border-color:#b91c1c!important;border-bottom-width:1px!important;box-shadow:0 0 #0000!important}[data-theme=light] .key-error{background:var(--error)!important;color:#fff!important;border-color:#b91c1c!important;border-bottom-width:1px!important;box-shadow:0 0 #0000!important}.flex-1{width:45px}.flex-1-25{width:56px}.flex-1-5{width:67px}.flex-1-75{width:78px}.flex-2{width:90px}.flex-2-25{width:101px}.flex-6{width:270px}.hands-container{pointer-events:none;z-index:10;opacity:.85;justify-content:center;gap:1rem;width:100%;display:flex;position:absolute;bottom:-60px;left:50%;transform:translate(-50%);-webkit-mask-image:linear-gradient(#000 65%,#0000 100%);mask-image:linear-gradient(#000 65%,#0000 100%)}.hand{width:360px;height:auto}.finger-group{transition:transform .15s cubic-bezier(.4,0,.2,1)}.finger-group.pressing{transform:scale(.95)translateY(-15px)}.glow-overlay{transition:opacity .15s}.finger-group.pressing .glow-overlay{opacity:.6!important}.sub-lesson-list{background:var(--surface);border:1px solid var(--border);text-align:center;border-radius:12px;flex-direction:column;align-items:center;width:100%;max-width:1000px;margin:0 auto;padding:2rem;display:flex;box-shadow:0 4px 6px -1px #0000001a}.sub-lesson-list h2{color:var(--text-main);margin-bottom:.5rem;font-size:1.8rem}.sub-lesson-subtitle{color:var(--text-muted);margin-bottom:2rem;font-size:1rem}.progressive-buttons-container{flex-direction:column;gap:1rem;width:100%;display:flex}.lesson-card{background:#fff;border:1px solid #e2e8f0;border-radius:8px;flex-direction:column;display:flex;overflow:hidden;box-shadow:0 2px 4px #0000000d}body[data-theme=dark] .lesson-card{background:var(--kbd-bg);border-color:var(--kbd-border)}.lesson-card-main{padding:1.2rem 1.5rem}.lesson-card-header{justify-content:space-between;align-items:center;margin-bottom:.8rem;display:flex}.lesson-card-title-area{align-items:center;gap:1rem;display:flex}.lesson-number{color:#64748b;border:2px solid #cbd5e1;border-radius:50%;justify-content:center;align-items:center;width:36px;height:36px;font-size:1.1rem;font-weight:400;display:flex}body[data-theme=dark] .lesson-number{color:#94a3b8;border-color:#475569}.lesson-title{color:#334155;letter-spacing:2px;font-size:1.3rem;font-weight:400}body[data-theme=dark] .lesson-title{color:var(--text-main)}.lesson-action-btn{cursor:pointer;border:none;border-radius:6px;align-items:center;gap:.5rem;padding:.6rem 1.2rem;font-size:.95rem;font-weight:400;transition:all .2s;display:flex}.start-btn{color:#0369a1;background:#bae6fd}.start-btn:hover{background:#7dd3fc}.resume-btn{color:#854d0e;background:#fde047}.resume-btn:hover{background:#facc15}body[data-theme=dark] .start-btn{color:#f0f9ff;background:#0284c7}body[data-theme=dark] .resume-btn{color:#fefce8;background:#ca8a04}.lesson-card-divider{background:#e2e8f0;width:100%;height:1px;margin:.8rem 0}body[data-theme=dark] .lesson-card-divider{background:#334155}.lesson-stats{color:#64748b;gap:1.5rem;font-size:.85rem;display:flex}body[data-theme=dark] .lesson-stats{color:#94a3b8}.stat-item{align-items:center;display:flex}.lesson-progress-bar{gap:2px;width:100%;height:8px;display:flex}.progress-segment{background:#e2e8f0;flex:1}body[data-theme=dark] .progress-segment{background:#334155}.progress-segment.filled{background:#38bdf8}body[data-theme=dark] .progress-segment.filled{background:#0284c7}.practice-header{justify-content:center;align-items:center;width:100%;margin-bottom:1.5rem;display:flex;position:relative}.practice-header h3{color:var(--text-main);margin:0;font-size:1.5rem}.back-btn{border:1px solid var(--border);color:var(--text-muted);cursor:pointer;background:0 0;border-radius:8px;padding:.5rem 1rem;font-size:.9rem;transition:all .2s;position:absolute;left:0}.back-btn:hover{background:var(--surface-hover);color:var(--text-main)}.modal-overlay{-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);z-index:1000;background:#0009;justify-content:center;align-items:center;display:flex;position:fixed;inset:0}.modal-content{background:var(--glass-bg);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);border:1px solid var(--glass-border);border-radius:16px;width:100%;max-width:400px;padding:2.5rem;position:relative;box-shadow:0 20px 25px -5px #0000001a,0 10px 10px -5px #0000000a}.close-btn{color:var(--text-muted);cursor:pointer;background:0 0;border:none;font-size:1.5rem;transition:color .2s;position:absolute;top:15px;right:15px}.close-btn:hover{color:var(--text-main)}.login-modal h2{color:var(--text-main);text-align:center;margin-top:0;margin-bottom:.5rem;font-size:1.8rem}.login-subtitle{text-align:center;color:var(--text-muted);margin-bottom:2rem;font-size:.9rem}.login-form{flex-direction:column;gap:1.2rem;display:flex}.form-group{flex-direction:column;gap:.5rem;display:flex}.form-group label{color:var(--text-main);font-size:.9rem;font-weight:400}.form-group input{border:1px solid var(--glass-border);color:var(--text-main);background:#0000001a;border-radius:8px;outline:none;padding:.8rem 1rem;font-size:1rem;transition:border-color .2s}.form-group input:focus{border-color:var(--primary)}.login-btn{background:var(--primary);color:#fff;cursor:pointer;border:none;border-radius:8px;margin-top:.5rem;padding:1rem;font-size:1rem;font-weight:400;transition:background .2s,transform .1s}.login-btn:hover:not(:disabled){background:var(--primary-hover)}.login-btn:active:not(:disabled){transform:scale(.98)}.login-btn:disabled{opacity:.7;cursor:not-allowed}.error-msg{color:#ef4444;text-align:center;background:#ef44441a;border-radius:6px;padding:.5rem;font-size:.9rem}.divider{text-align:center;color:var(--text-muted);margin:1.5rem 0;position:relative}.divider:before,.divider:after{content:"";background:var(--glass-border);width:40%;height:1px;position:absolute;top:50%}.divider:before{left:0}.divider:after{right:0}.social-btn{color:#333;cursor:pointer;background:#fff;border:1px solid #ddd;border-radius:8px;justify-content:center;align-items:center;gap:.8rem;width:100%;padding:.8rem;font-size:1rem;font-weight:400;transition:background .2s;display:flex}.social-btn:hover{background:#f9fafb}body[data-theme=light] .form-group input{color:var(--text-main);background:#fff}@media (width<=900px){.app-container{max-width:100vw;padding:1rem}.app-header{margin-bottom:1.5rem}.app-header h1{font-size:2rem}.app-header p{font-size:.95rem}.typing-layout-wrapper{flex-direction:column;gap:1.5rem}.sidebar{flex-flow:wrap;justify-content:center;width:100%;margin-bottom:1rem;padding:1rem}.sidebar-title{text-align:center;width:100%;margin-bottom:1rem}.sidebar-buttons{flex-flow:wrap;justify-content:center;gap:.5rem}.sidebar-btn{text-align:center;flex:auto;padding:.6rem 1rem;font-size:.9rem}.typing-board-container{border-radius:16px;padding:1.2rem}.stats-panel{flex-wrap:wrap;justify-content:center;gap:1rem;margin-bottom:1.5rem}.stat-box{flex:45%;justify-content:center}.stat-value{font-size:1.2rem}.text-display{min-height:150px;margin-bottom:1.5rem}.bn-char{font-size:1.5rem}.char-box{padding:8px 12px}.virtual-keyboard{border-radius:8px;gap:3px;width:100%;padding:.5rem}.keyboard-row{justify-content:space-between;gap:2px;width:100%}.key{border-bottom-width:1px;border-radius:4px;flex:1;width:auto;min-width:0;height:38px;padding:0;font-size:.8rem}.flex-1{flex:1;width:auto}.flex-1-25{flex:1.25;width:auto}.flex-1-5{flex:1.5;width:auto}.flex-1-75{flex:1.75;width:auto}.flex-2{flex:2;width:auto}.flex-2-25{flex:2.25;width:auto}.flex-6{flex:6;width:auto}.hands-container{display:none}.completion-modal-premium{width:95%;padding:1.5rem}.premium-stats-grid{grid-template-columns:1fr;gap:1rem}.modal-actions{flex-direction:column;gap:1rem}.modal-actions button{justify-content:center;width:100%}.sub-lesson-list{box-sizing:border-box;width:100%;max-width:100vw;padding:1rem}.lesson-card-header{flex-direction:column;align-items:flex-start;gap:1rem}.lesson-card-title-area{width:100%}.lesson-action-btn{justify-content:center;width:100%}.lesson-stats{flex-wrap:wrap;gap:.8rem}}@media (width<=480px){.key{height:32px;font-size:.65rem}}