:root{color-scheme:dark;font-family:Inter,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;color:#f5f7fb;background:#0a111c}
*{box-sizing:border-box}
body{margin:0;min-height:100vh}
button,input{font:inherit}
button{cursor:pointer}
a{color:inherit;text-decoration:none}
:focus-visible{outline:2px solid #6db9ff;outline-offset:3px}
.account-layout{min-height:100vh;display:grid;grid-template-columns:minmax(0,1fr) minmax(460px,1fr);background:#0b1726}
.account-art{position:relative;overflow:hidden;background:#091522}
.account-art-w,.account-art-d{position:absolute;inset:0;background-size:cover;background-position:center}
.account-art-w{background-image:linear-gradient(90deg,rgba(9,21,34,.25),rgba(9,21,34,.65)),url('/images/games/world-of-warcraft/hero.webp');clip-path:polygon(0 0,100% 0,65% 100%,0 100%)}
.account-art-d{background-image:linear-gradient(90deg,rgba(9,21,34,.45),rgba(9,21,34,.75)),url('/images/games/diablo-4/editorial-sanctuary.webp');clip-path:polygon(100% 0,100% 100%,32% 100%)}
.account-art:after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,transparent 30%,#0b1726 100%),linear-gradient(0deg,rgba(7,17,29,.25),rgba(7,17,29,.25));pointer-events:none}
.account-panel{display:grid;place-items:center;padding:44px 24px;background:#0b1726}
.account-card{width:min(100%,420px);padding:31px;background:#122743;border:1px solid #2b4b6d;box-shadow:0 22px 70px #06101c80}
.back-link{display:inline-block;color:#a9c9ea;font-size:12px;margin-bottom:27px}
.back-link:hover{color:#fff}
.account-brand{display:flex;align-items:center;gap:11px;margin-bottom:26px}
.brand-mark{width:37px;height:37px;border-radius:50%;display:grid;place-items:center;background:linear-gradient(135deg,#163851,#216587);border:1px solid #4281a3;color:#79dbff;font-size:13px;font-weight:900}
.account-brand strong{display:block;font-size:19px;letter-spacing:.07em;line-height:1}
.account-brand small{display:block;color:#50caff;font-size:9px;font-weight:700;margin-top:4px}
h1{font-size:23px;line-height:1.2;margin:0 0 8px}
.account-lead{font-size:13px;color:#bed0e3;line-height:1.5;margin:0 0 18px}
.account-notice{font-size:11px;line-height:1.5;color:#b7cce1;background:#173553;border-left:3px solid #6daeff;padding:10px 12px;margin-bottom:23px}
.account-tabs{display:grid;grid-template-columns:1fr 1fr;border-bottom:1px solid #55708b;margin-bottom:19px}
.account-tabs button{border:0;border-bottom:2px solid transparent;background:transparent;color:#90a6be;padding:12px;font-size:15px;font-weight:700}
.account-tabs button[aria-selected="true"]{border-bottom-color:#79beff;color:#fff}
.account-tab-panel label:not(.check-row){display:block;font-size:11px;font-weight:700;color:#d7e5f3;margin:0 0 6px}
.account-tab-panel>input{display:block;width:100%;height:43px;border:1px solid #2e4864;border-radius:4px;background:#0d1d31;color:#fff;padding:0 13px;margin-bottom:15px;outline:0}
.account-tab-panel>input:focus{border-color:#6daeff}
.account-tab-panel>input::placeholder{color:#839ab2}
.check-row{display:flex;align-items:center;gap:8px;color:#c4d5e7;font-size:11px;margin:2px 0 17px}
.check-row input{margin:0;accent-color:#3094ee}
.primary-action{width:100%;min-height:44px;border:0;border-radius:4px;background:#258df1;color:white;font-weight:800;font-size:13px}
.primary-action:hover{background:#3aa1ff}
.recovery-link{display:block;margin:17px auto 0;border:0;background:transparent;color:#76bdff;font-size:12px}
.account-feedback{min-height:18px;color:#9bcaff;font-size:11px;line-height:1.45;text-align:center;margin:11px 0 0}
.account-providers{border-top:1px solid #37516b;padding-top:17px;margin-top:12px;text-align:center}
.account-providers>span{display:block;color:#97afc8;font-size:10px;line-height:1.5;margin-bottom:13px}
.account-providers>div{display:grid;grid-template-columns:repeat(3,1fr);gap:6px}
.account-providers button{min-height:36px;border:1px solid #36516e;border-radius:4px;background:#172b45;color:#9eb5cb;font-size:11px;cursor:not-allowed}
@media(max-width:850px){.account-layout{display:block}.account-art{position:fixed;inset:0;opacity:.25}.account-panel{position:relative;min-height:100vh;background:rgba(8,20,34,.72)}.account-card{width:min(100%,440px)}}
@media(max-width:520px){.account-panel{padding:18px 12px}.account-card{padding:23px 19px}.back-link{margin-bottom:20px}.account-brand{margin-bottom:20px}}
