.english-keyboard{position:fixed;z-index:1000;left:0;right:0;bottom:0;padding:8px max(8px,env(safe-area-inset-right)) max(8px,env(safe-area-inset-bottom)) max(8px,env(safe-area-inset-left));background:#f2eafa;box-shadow:0 -5px 24px #60369328;display:grid;gap:6px;max-height:55dvh;overflow-y:auto;touch-action:manipulation}
.english-keyboard[hidden]{display:none}
.english-keyboard-row{display:flex;justify-content:center;gap:5px;min-width:0}
.english-keyboard .english-key{flex:1 1 0;min-width:0;min-height:42px;padding:3px;border:1px solid #fff;background:#f9f4ff;color:#322044;border-radius:11px;font-size:clamp(17px,5vw,25px);font-weight:400;line-height:1.1;box-shadow:0 2px 4px #9065aa40}
.english-keyboard .english-key-shift,.english-keyboard .english-key-backspace,.english-keyboard .english-key-symbols{flex:1.35 1 0;background:#dfccf5;color:#573288}
.english-keyboard .english-key-shift,.english-keyboard .english-key-backspace,.english-keyboard .english-key-symbols{display:flex;align-items:center;justify-content:center}
.english-keyboard .english-key-shift svg,.english-keyboard .english-key-backspace svg{width:21px;height:21px;fill:none;stroke:currentColor;stroke-width:1.5;stroke-linejoin:round;stroke-linecap:round;pointer-events:none}
.english-keyboard .english-key-symbols{font-size:17px;text-align:center}
.english-keyboard .english-key-shift[aria-pressed=true]{background:#aa81dc}
.english-keyboard .english-key-space{flex:5 1 0;font-size:17px;position:relative}
.english-keyboard .english-key-space span{position:absolute;right:9px;bottom:5px;font-size:9px;letter-spacing:.06em;opacity:.35;pointer-events:none}
.english-keyboard .english-key-submit{flex:1.4 1 0;background:#7847be;color:white;font-size:24px}
.english-keyboard-open{padding-bottom:calc(var(--keyboard-height, 240px) + 12px)}
.english-keyboard-open input,.english-keyboard-open textarea{scroll-margin-bottom:calc(var(--keyboard-height, 240px) + 16px)}
.english-keyboard-open:not(.keyboard-navigation) #practice .answer-input:focus-visible,.english-keyboard-open:not(.keyboard-navigation) #quiz input:focus-visible{outline:none;box-shadow:none}
.english-keyboard-open .ambient-bg,.english-keyboard-open .practice-breadcrumb{display:none}
html[data-theme=dark] .english-keyboard{background:#1c0e2d;box-shadow:0 -5px 24px #0008}
html[data-theme=dark] .english-keyboard .english-key{background:#39224f;color:#fff;border-color:#665079;box-shadow:none}
html[data-theme=dark] .english-keyboard .english-key-shift,html[data-theme=dark] .english-keyboard .english-key-backspace,html[data-theme=dark] .english-keyboard .english-key-symbols{background:#594074;color:#e2c7ff}
html[data-theme=dark] .english-keyboard .english-key-submit{background:#8153c6;color:white}
.english-keyboard button:focus-visible{outline:3px solid #a573e6;outline-offset:2px}
button,[role="button"],summary{-webkit-user-select:none;user-select:none;-webkit-touch-callout:none}
input,textarea{-webkit-user-select:text;user-select:text;-webkit-touch-callout:default}
@media(max-height:500px){.english-keyboard{gap:2px}.english-keyboard-row{gap:3px}.english-keyboard .english-key{min-height:30px;font-size:16px}}