.account-dialog{
  width:min(640px,calc(100% - 28px));
  max-height:calc(100dvh - 28px);
  overflow:auto;
  border:1px solid #294958;
  border-radius:22px;
  background:#0a1720;
  color:#f4f8fa;
  padding:0;
  box-shadow:0 34px 110px rgba(0,0,0,.62),0 0 0 1px rgba(118,222,208,.04) inset;
}
.account-dialog::backdrop{background:rgba(1,8,12,.76);backdrop-filter:blur(6px)}
.account-shell{padding:30px}
.account-head{display:flex;align-items:flex-start;justify-content:space-between;gap:20px}
.account-head .kicker{color:#77d9cf;letter-spacing:.14em}
.account-head h2{margin:7px 0 0;font-size:clamp(38px,6vw,52px);line-height:1;font-weight:850;letter-spacing:-.035em}
.icon-button{display:grid;place-items:center;flex:0 0 auto;border:1px solid #355465;border-radius:8px;background:#0c1b24;color:#dce6ea;width:48px;height:48px;cursor:pointer;font-size:26px;line-height:1}
.icon-button:hover{border-color:#6ed7ca;color:#fff}
.account-status{margin:24px 0 0;max-width:48ch;color:#b8c7ce;font-size:16px;line-height:1.55}
.account-status.is-error{color:#ff9eaa}
.account-section{display:grid;gap:14px;margin-top:28px}
.account-section[hidden],.account-section [hidden]{display:none!important}
.auth-choice-panel{display:grid;gap:14px}
.provider-option{width:100%;min-height:64px;display:grid;grid-template-columns:44px minmax(0,1fr) 28px;align-items:center;gap:12px;border-radius:12px;padding:0 18px;cursor:pointer;font:800 17px/1.2 var(--sans);text-align:left;transition:transform .15s ease,border-color .15s ease,filter .15s ease}
.provider-option:hover:not(:disabled){transform:translateY(-1px)}
.provider-option:focus-visible{outline:2px solid #8ee8dc;outline-offset:3px}
.provider-google{border:1px solid #8ce9dc;background:#72ddcf;color:#041317}
.provider-google:hover:not(:disabled){filter:brightness(1.045)}
.provider-email{border:1px solid #416174;background:#0d1c26;color:#f3f8fa}
.provider-email:hover:not(:disabled){border-color:#70b6bd;background:#10242f}
.provider-icon{display:grid;place-items:center;width:36px;height:36px;border-radius:50%;font:900 18px/1 var(--sans)}
.provider-google .provider-icon{background:rgba(255,255,255,.9);color:#245d78}
.provider-email .provider-icon{border:1px solid #6c8896;border-radius:8px;color:#dce8ec;font-size:17px}
.provider-arrow{justify-self:end;font-size:24px;font-weight:500}
.signin-benefits{margin-top:8px;border:1px solid #234654;border-radius:16px;background:linear-gradient(145deg,#0d2029,#0b1a23);padding:22px 22px 20px}
.signin-benefits-head{display:flex;align-items:center;gap:12px;margin-bottom:14px}
.signin-benefits-icon{display:grid;place-items:center;width:42px;height:42px;border:1px solid #2d625f;border-radius:50%;background:#103039;color:#79e2d5;font:800 18px var(--mono)}
.signin-benefits h3{margin:0;color:#f3f8fa;font-size:18px}
.signin-benefits ul{display:grid;gap:10px;margin:0;padding:0;list-style:none}
.signin-benefits li{display:grid;grid-template-columns:24px minmax(0,1fr);gap:10px;align-items:start;color:#c4d1d7;font-size:14px;line-height:1.4}
.signin-benefits li::before{content:"✓";display:grid;place-items:center;width:22px;height:22px;border-radius:50%;background:#71dfd0;color:#062026;font:900 12px/1 var(--sans)}
.email-auth-panel{display:grid;gap:13px}
.email-back{justify-self:start;min-height:0!important;border:0;background:transparent;color:#82ddd2;padding:2px 0 8px;cursor:pointer;font:700 12px var(--mono)}
.email-back:hover{text-decoration:underline}
.account-section label{display:grid;gap:8px;color:#8da2ac;font:700 10px var(--mono);text-transform:uppercase;letter-spacing:.06em}
.account-section input{width:100%;min-width:0;border:1px solid #294653;border-radius:8px;background:#071219;color:#f2f7f9;padding:13px 14px;font:600 14px var(--sans)}
.account-section input::placeholder{color:#637681}
.account-section input:focus{outline:2px solid rgba(118,222,208,.24);outline-offset:1px;border-color:#76ded0}
.account-section button{min-height:44px}
.account-primary{border:1px solid #7fe5d8;border-radius:9px;background:#72ddcf;color:#061417;padding:12px 14px;cursor:pointer;font-weight:850}
.account-primary:hover:not(:disabled){filter:brightness(1.06)}
.account-section button:disabled{opacity:.48;cursor:wait}
.full{width:100%}
.password-row{display:grid;grid-template-columns:minmax(0,1fr) auto}
.password-row input{border-radius:8px 0 0 8px;border-right:0}
.password-row button{min-width:72px;border:1px solid #294653;border-radius:0 8px 8px 0;background:#0d202a;color:#b8c7ce;padding:0 12px;cursor:pointer}
.auth-secondary{display:flex;align-items:center;justify-content:center;gap:8px 10px;flex-wrap:wrap;color:#7f929c;font-size:12px;padding-top:3px}
.link-button{border:0;background:transparent;color:#7ce0d4;padding:4px 0;min-height:0!important;cursor:pointer}
.link-button:hover:not(:disabled){text-decoration:underline}
.profile-card{border:1px solid #294653;border-radius:12px;background:#0d2029;padding:17px;display:flex;justify-content:flex-start;gap:14px;align-items:center}
.profile-card strong{font-size:18px}
.profile-card strong::before{content:"✓";display:inline-grid;place-items:center;width:22px;height:22px;margin-right:10px;border:1px solid #3a675f;border-radius:50%;color:#77e0d3;font:700 12px var(--mono);vertical-align:2px}
.profile-card span{display:none;color:#8ca1aa;font:600 9px var(--mono);text-transform:uppercase}
#signedInPanel{margin-top:20px}
#signedInPanel #signOutButton{border:1px solid #294653;border-radius:8px;background:transparent;color:#9eb0b8;padding:11px 12px;cursor:pointer}
#signedInPanel #signOutButton:hover{border-color:#76ded0;color:#f4f8fa}
.gamer-tag-card{border:1px solid #294653;border-radius:12px;background:#08151c;padding:15px;display:grid;gap:9px}
.gamer-tag-row{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:8px}
.gamer-tag-row input{text-transform:uppercase;letter-spacing:.14em;font:700 15px var(--mono)}
.gamer-tag-row button{min-width:76px;border:1px solid #76ded0;border-radius:8px;background:#0e252d;color:#82e4d8;padding:0 14px;cursor:pointer}
.gamer-tag-card small{color:#718892;font-size:11px;line-height:1.45}
.gamer-tag-card small.error{color:#ff9eaa}
.account-note{margin:22px 0 0;padding-top:18px;border-top:1px solid #294653;color:#667d87;font-size:11px;line-height:1.5}
.account-toast{margin:12px 0 0;border:1px solid rgba(118,222,208,.38);border-radius:8px;background:#082124;color:#b4eee7;padding:10px 12px;font-size:12px;line-height:1.4}
.account-toast.is-error{border-color:rgba(255,139,154,.45);background:#211016;color:#ffb3bd}
.identity button{cursor:pointer}
.identity button:not(:disabled):hover{border-color:var(--accent);color:var(--accent)}
@media(max-width:560px){
  .account-dialog{width:min(100% - 12px,640px);max-height:calc(100dvh - 12px);border-radius:15px}
  .account-shell{padding:20px}
  .account-head h2{font-size:40px}
  .account-status{margin-top:18px;font-size:14px}
  .account-section{margin-top:22px}
  .provider-option{min-height:58px;grid-template-columns:38px minmax(0,1fr) 22px;padding:0 14px;font-size:15px}
  .provider-icon{width:32px;height:32px}
  .signin-benefits{padding:18px 16px}
  .signin-benefits li{font-size:13px}
  .password-row{grid-template-columns:minmax(0,1fr) 64px}
  .gamer-tag-row{grid-template-columns:1fr}
  .gamer-tag-row button{min-height:42px}
  .auth-secondary{justify-content:flex-start}
}