.virtual-keyboard{max-width:1100px!important}.keyboard-row{display:flex;justify-content:center}.v-key{flex:0 0 56px}.v-key.modifier{font-size:9px!important;min-width:0!important}.v-key.backspace-key{flex-basis:105px}.v-key.tab-key{flex-basis:82px}.v-key.caps-key{flex-basis:105px}.v-key.enter-key{flex-basis:104px}.v-key.shift-key{flex-basis:128px}.v-key.ctrl-key{flex-basis:75px}.v-key.win-key,.v-key.alt-key,.v-key.fn-key{flex-basis:65px}.v-key.wide{flex:1 1 350px;max-width:420px}.bottom-modifiers{padding-inline:7px}@media(max-width:1050px){.v-key{flex-basis:5vw!important;min-width:31px!important}.v-key.backspace-key,.v-key.tab-key,.v-key.caps-key,.v-key.enter-key,.v-key.shift-key{flex-basis:9vw!important}.v-key.ctrl-key,.v-key.win-key,.v-key.alt-key,.v-key.fn-key{flex-basis:7vw!important}.v-key.wide{flex:1 1 32vw!important;max-width:36vw!important}}

/* Compact keyboard so lessons + keyboard fit better on laptop screens. */
.virtual-keyboard{max-width:1010px!important;padding:12px!important;gap:5px!important}
.keyboard-row{gap:5px!important}
.v-key{flex-basis:50px!important;height:38px!important;padding:2px 5px!important;border-radius:7px!important}
.v-key small{font-size:6px!important}
.v-key .base-char{font-size:13px!important;line-height:1!important}
.v-key .shift-char{font-size:10px!important;line-height:1!important}
.v-key.backspace-key{flex-basis:94px!important}
.v-key.tab-key{flex-basis:74px!important}
.v-key.caps-key{flex-basis:94px!important}
.v-key.enter-key{flex-basis:94px!important}
.v-key.shift-key{flex-basis:116px!important}
.v-key.ctrl-key{flex-basis:68px!important}
.v-key.win-key,.v-key.alt-key,.v-key.fn-key{flex-basis:58px!important}
.v-key.wide{flex-basis:320px!important;max-width:380px!important}
@media(max-width:1150px){
  .virtual-keyboard{max-width:930px!important;padding:10px!important}
  .keyboard-row{gap:4px!important}
  .v-key{flex-basis:43px!important;height:36px!important}
  .v-key.backspace-key,.v-key.caps-key,.v-key.enter-key{flex-basis:82px!important}
  .v-key.tab-key{flex-basis:68px!important}
  .v-key.shift-key{flex-basis:98px!important}
  .v-key.ctrl-key,.v-key.win-key,.v-key.alt-key,.v-key.fn-key{flex-basis:54px!important}
  .v-key.wide{flex-basis:280px!important;max-width:320px!important}
}

/* Final laptop fit override: keep the full keyboard visible in practice screen. */
.virtual-keyboard{width:min(100%,940px)!important;max-width:940px!important;padding:10px!important;gap:4px!important;overflow:visible!important}
.keyboard-row{min-width:0!important;width:100%!important;gap:4px!important;justify-content:center!important}
.v-key{min-width:0!important;flex:1 1 40px!important;height:34px!important;padding:2px 4px!important;border-radius:7px!important;border-bottom-width:2px!important}
.v-key .latin-key{font-size:6px!important}.v-key .shift-char{font-size:9px!important}.v-key .base-char{font-size:12px!important;line-height:1!important}.v-key.modifier{font-size:8px!important}
.v-key.backspace-key{flex:1.7 1 74px!important}.v-key.tab-key{flex:1.35 1 60px!important}.v-key.caps-key{flex:1.7 1 74px!important}.v-key.enter-key{flex:1.7 1 74px!important}.v-key.shift-key{flex:2.1 1 92px!important}.v-key.ctrl-key,.v-key.win-key,.v-key.alt-key,.v-key.fn-key{flex:1.15 1 50px!important}.v-key.wide{flex:5.8 1 230px!important;max-width:none!important}
@media(max-height:760px){.virtual-keyboard{padding:8px!important}.v-key{height:31px!important}.keyboard-row{gap:3px!important}.keyboard-hint{margin-top:10px!important}.target-text{min-height:100px!important}}

/* Practice-screen height fit: target preview + full keyboard visible on laptops. */
body.practice-screen .topbar{height:62px!important}
body.practice-screen .header-title h1{font-size:18px!important;margin-bottom:0!important}
body.practice-screen .header-title p{display:none!important}
body.practice-screen main{padding-bottom:14px!important}
body.practice-screen .typing-panel{padding:16px!important;max-width:980px!important}
body.practice-screen .typing-head{align-items:center!important}
body.practice-screen .typing-head h2{font-size:17px!important;margin-top:4px!important}
body.practice-screen .typing-head .eyebrow{font-size:8px!important;padding:4px 8px!important}
body.practice-screen .secondary-button{padding:7px 11px!important}
body.practice-screen .stage-progress{margin:10px 0 0!important;padding:9px 12px!important}
body.practice-screen .stage-dots{margin-top:6px!important}
body.practice-screen .live-stats{padding:8px 0!important;margin:9px 0!important}
body.practice-screen .target-text{min-height:0!important;margin:8px 0 8px!important;padding:12px 14px!important;gap:9px!important;font-size:clamp(19px,1.55vw,23px)!important;line-height:1.45!important}
body.practice-screen .target-base-text{padding:13px 12px 7px!important;border-radius:13px!important;font-size:clamp(19px,1.55vw,23px)!important;line-height:1.45!important}
body.practice-screen .target-base-text::before{display:none!important}
body.practice-screen .typing-feedback{width:min(820px,100%)!important}
body.practice-screen .typing-feedback::before,body.practice-screen .typing-feedback::after{display:none!important}
body.practice-screen .typed-preview{min-height:40px!important;padding:10px 12px 8px!important;font-size:clamp(19px,1.55vw,23px)!important;line-height:1.35!important}
body.practice-screen .typed-progress{height:6px!important;margin-top:6px!important}
body.practice-screen .next-key-guide{height:34px!important;margin:8px 0!important;grid-template-columns:auto 38px 1fr!important}
body.practice-screen .next-key-guide strong{width:36px!important;height:32px!important;font-size:15px!important}
body.practice-screen .keyboard-hint{margin-top:8px!important;font-size:10px!important}
@media(max-height:760px){body.practice-screen .topbar{height:52px!important}body.practice-screen .typing-panel{padding:12px!important}body.practice-screen .target-text{font-size:20px!important;line-height:1.35!important}body.practice-screen .target-base-text,body.practice-screen .typed-preview{font-size:20px!important;line-height:1.3!important}.virtual-keyboard{padding:6px!important}.v-key{height:28px!important}}
