.beta-login { box-sizing:border-box; width:min(100% - 32px,460px); margin:40px auto; padding:24px; border:1px solid #2a3a52; border-radius:20px; background:#101d31; color:#f7f9fc; font:16px/1.5 system-ui,sans-serif; }
body:has(.beta-login:not([hidden])) { margin:0; background:#07101f; color:#f7f9fc; }
.beta-login[hidden], .beta-login [hidden] { display:none !important; }
.beta-login h1 { font-size:clamp(26px,7vw,36px); line-height:1.15; }
.beta-eyebrow { color:#82f1d0; font-weight:700; }
.beta-login label { display:block; margin-top:20px; font-weight:600; }
.beta-login input { box-sizing:border-box; display:block; width:100%; margin:8px 0 16px; padding:12px; border:1px solid #9cacc2; border-radius:8px; background:#07101f; color:#f7f9fc; font:inherit; }
.beta-login button, .beta-account button { cursor:pointer; padding:12px 16px; margin:4px 8px 4px 0; border:0; border-radius:9px; background:#61a5ff; color:#07101f; font:600 16px system-ui,sans-serif; }
.beta-login button:disabled { opacity:.6; cursor:wait; }
.beta-login :focus-visible, .beta-account button:focus-visible { outline:3px solid #82f1d0; outline-offset:3px; }
.beta-help { font-size:14px; color:#9cacc2; }
.beta-account { font:14px/1.5 system-ui,sans-serif; color:#9cacc2; overflow-wrap:anywhere; }
.beta-account button { font-size:14px; }
/* Recovery is outside the trainer; its layout never changes lesson positioning. */
#beta-recovery pre { white-space:pre-wrap; overflow-wrap:anywhere; color:inherit; font:inherit; background:#091426; padding:16px; border-radius:12px; }
#beta-recovery button { margin-top:10px; }

#beta-backup textarea { display:block; width:100%; box-sizing:border-box; resize:vertical; color:inherit; background:#091426; border:1px solid #35445e; border-radius:10px; padding:12px; font:13px monospace; margin:12px 0; }