.account-screen{position:fixed;inset:0;z-index:180;display:grid;place-items:center;overflow:auto;padding:24px 14px}
.account-screen.hidden{display:none}
.account-card{
  position:relative;z-index:1;
  width:min(620px,100%);margin:auto;padding:30px 34px 26px;
  border:1px solid #82714c;box-shadow:0 24px 80px #000b,var(--bevel),0 0 0 1px #1b150c;
}
.account-brand{display:flex;align-items:center;justify-content:center;gap:9px;color:var(--parchment);font:600 18px var(--font-display);letter-spacing:.06em;margin-bottom:20px}
.account-brand strong{color:var(--poke-yellow)}
.account-brand .brand-mark{width:23px;height:23px}
.account-card h1{margin:5px 0 0;text-align:center;color:var(--parchment);font:600 clamp(23px,5vw,32px) var(--font-display);letter-spacing:.02em}
.account-card>.eyebrow{display:block;text-align:center}
.account-intro{max-width:470px;margin:9px auto 19px;text-align:center;color:var(--parchment-dim);font:400 13px/1.5 var(--font-body)}
.account-tabs{position:relative;z-index:2;isolation:isolate;display:grid;grid-template-columns:1fr 1fr;gap:4px;padding:4px;background:#0b0907;border:1px solid #403624;border-radius:5px;margin-bottom:18px}
.account-tabs.hidden{display:none}
.account-tab{position:relative;z-index:1;pointer-events:auto;touch-action:manipulation;border:0;border-radius:3px;padding:10px 12px;background:transparent;color:#9e957f;font:600 12px var(--font-display);letter-spacing:.04em;cursor:pointer}
.account-tab:hover{color:var(--parchment)}
.account-tab.active{background:linear-gradient(#443619,#2a210f);color:var(--poke-yellow);box-shadow:inset 0 0 0 1px #826b2e}
.account-form{display:grid;gap:13px}
.account-form.hidden{display:none}
.account-field{display:grid;gap:6px;text-align:left}
.account-field>span{color:#c7b993;font:600 11px var(--font-display);letter-spacing:.055em;text-transform:uppercase}
.account-field>small{color:#7e7664;font:400 10px var(--font-body)}
.account-field input{
  min-width:0;height:43px;border:1px solid #4f432e;border-radius:4px;padding:0 12px;
  background:#0c0a07;color:var(--parchment);font:500 14px var(--font-body);outline:none;box-shadow:var(--bevel);
}
.account-field input::placeholder{color:#655f52}
.account-field input:focus{border-color:var(--poke-yellow);box-shadow:var(--bevel),0 0 14px #ffcb0525}
.account-field input:invalid:not(:placeholder-shown){border-color:#8b4638}
.account-password-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.account-rules{display:flex;align-items:flex-start;gap:9px;padding:11px 12px;border:1px solid #3d3527;border-radius:4px;background:#100d09;color:#aaa18c;font:400 12px/1.4 var(--font-body);cursor:pointer}
.account-rules input{width:16px;height:16px;margin:1px 0 0;accent-color:var(--poke-yellow);flex:0 0 auto}
.account-rules button{display:inline;padding:0;border:0;background:none;color:var(--poke-yellow);font:700 12px var(--font-body);text-decoration:underline;cursor:pointer}
.account-rules small{color:#77705f}
.account-submit{height:46px;border:1px solid #f4d559;border-radius:4px;background:linear-gradient(#f4cf36,#b88612);color:#201706;font:700 13px var(--font-display);letter-spacing:.05em;text-transform:uppercase;box-shadow:0 3px 0 #674608,inset 1px 1px 0 #fff2a5;cursor:pointer}
.account-submit:hover{filter:brightness(1.07);transform:translateY(-1px)}
.account-submit:active{transform:translateY(2px);box-shadow:0 1px 0 #674608,inset 1px 1px 0 #fff2a5}
.account-link{justify-self:center;border:0;padding:2px;background:none;color:var(--poke-yellow);font:600 11px var(--font-body);text-decoration:underline;cursor:pointer}
.account-link:hover{color:var(--parchment)}
.account-form-copy{margin:0;color:var(--parchment-dim);font:400 13px/1.5 var(--font-body);text-align:center}
.account-screen.is-busy .account-submit{opacity:.6;cursor:wait;transform:none}
.account-status{margin:14px 0 0;padding:10px 12px;border-radius:4px;border:1px solid #743e34;background:#26100d;color:#ef9c8a;font:600 12px/1.45 var(--font-body);text-align:center}
.account-status.hidden{display:none}
.account-status.success{border-color:#39683a;background:#102411;color:#91d794}
.account-status.info{border-color:#6c5a2b;background:#211b0d;color:#ddc97f}
.account-beta-note{display:block;margin-top:15px;text-align:center;color:#6f685b;font:400 10px var(--font-body)}
.account-captcha{display:flex;justify-content:center;min-height:65px}
.account-captcha.hidden{display:none}
.rules-dialog{z-index:210}
.rules-dialog-card{width:min(520px,calc(100vw - 28px));text-align:left}
.rules-dialog-card h2{margin:7px 30px 4px 0;color:var(--parchment);font:600 22px var(--font-display)}
.rules-version{margin:0 0 16px;color:var(--gold);font:600 11px var(--font-display);text-transform:uppercase;letter-spacing:.05em}
.rules-dialog-card ul{display:grid;gap:10px;margin:0;padding-left:20px;color:#c3b99f;font:400 13px/1.55 var(--font-body)}
.rules-draft-note{margin:18px 0 0;padding:11px;border-left:2px solid #8d7330;background:#171207;color:#93886e;font:400 11px/1.5 var(--font-body)}
.settings-account{display:grid;gap:5px;margin-top:20px;padding-top:18px;border-top:1px solid #3c3324}
.settings-account>b{color:var(--parchment);font:600 14px var(--font-display)}
.settings-account>small{color:var(--parchment-dim);font:400 11px var(--font-body)}
.settings-account>button{margin-top:6px;border:1px solid #5c4931;border-radius:3px;padding:8px 10px;background:#17110b;color:#c9ad72;font:600 11px var(--font-display);cursor:pointer}
.settings-account>button:hover{border-color:var(--gold);color:var(--parchment)}

@media(max-width:620px){
  .account-screen{padding:10px}
  .account-card{padding:22px 15px 20px}
  .account-password-grid{grid-template-columns:1fr}
  .account-brand{margin-bottom:14px}
  .account-intro{font-size:12px}
}