:root{font-family:system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif}*{box-sizing:border-box}body{color:#18223d;background:#edf2ff;margin:0}#app,.trainer,.screen{min-height:100svh}.trainer{max-width:720px;margin:0 auto;padding:10px}.hidden{display:none!important}.select-screen{flex-direction:column;justify-content:center;gap:12px;display:flex}h1{text-align:center;margin:0;font-size:1.45rem}.sub{text-align:center;color:#4f628f;margin:0 0 10px}.mode-buttons{flex-direction:column;gap:12px;display:flex}.mode{color:#fff;background:#2f53c8;border:none;border-radius:14px;width:100%;min-height:72px;font-size:1.08rem;font-weight:700}.play-screen{grid-template-rows:30vh 20vh 45vh 5vh;height:100svh;display:grid}.target-area,.morse-area,.input-area{justify-content:center;align-items:center;display:flex}.target-area{flex-direction:column;gap:6px}.target-label{color:#667dad;margin:0;font-size:.85rem}.target-char{margin:0;font-size:min(22vh,11rem);font-weight:700;line-height:1}.progress{color:#3f5a95;margin:0;font-size:.95rem}.feedback{min-height:1.4em;margin:0;font-size:.9rem}.feedback.neutral{color:#365092}.feedback.success{color:#19753d}.feedback.error{color:#b12323}.morse-area{flex-direction:column;gap:6px}.current-input{margin:0;font-size:min(9vh,3.2rem);line-height:1.1}.mnemonic{text-align:center;color:#5f2d92;min-height:1.4em;margin:0;font-size:.92rem}.input-area{padding-bottom:2vh}.input-pad{aspect-ratio:1;color:#fff;touch-action:none;-webkit-user-select:none;user-select:none;background:#1e3fac;border:none;border-radius:24px;width:min(70vw,320px);font-size:1.2rem;font-weight:700}.input-pad.active{background:#173385}.input-pad:disabled{background:#97a7cf}.scoreboard{color:#18223d8c;justify-content:space-between;align-items:center;gap:10px;font-size:.72rem;display:flex}.scoreboard p{white-space:nowrap;margin:0}.result-screen{text-align:center;flex-direction:column;justify-content:center;align-items:center;gap:10px;display:flex}.result-screen h2{margin:0 0 10px;font-size:1.5rem}.result-mode,.result-line{margin:0}.result-score{font-size:1.4rem;font-weight:700}.result-actions{flex-direction:column;gap:10px;width:min(90vw,420px);margin-top:12px;display:flex}.result-btn{color:#fff;background:#2f53c8;border:none;border-radius:12px;width:100%;min-height:54px;font-size:1rem;font-weight:700}.result-btn.secondary{color:#24396f;background:#d9e2fb}