.dashboard {
.account-shell { padding-block:45px 50px; }
.account-eyebrow { color:#737373; font-size:10px; letter-spacing:2.6px; margin-bottom:11px; }
.account-intro h1 { font:500 36px/1.3 var(--serif); }
.account-intro h1+p { font-size:14px; line-height:1.8; color:#686868; margin-top:11px; }
.account-demo { margin:25px 0 23px; border:1px solid #d8d8d8; padding:13px 16px; border-radius:5px; font-size:12px; line-height:1.7; color:#686868; }
.account-overview { display:grid; grid-template-columns:minmax(0,1.7fr) minmax(0,1fr); gap:24px; }
.account-panel { background:#f8f8f8; border:1px solid #d8d8d8; border-radius:8px; padding:28px; min-width:0; box-shadow:0 6px 22px #33333304; }
.account-panel-heading { display:flex; align-items:center; gap:13px; }
.account-panel h2 { font:500 19px/1.5 var(--serif); }
.account-symbol { display:flex; align-items:center; justify-content:center; flex-shrink:0; width:40px; height:40px; border-radius:9px; background:#e4ebf1; color:#456782; }
.account-symbol svg { width:23px; height:23px; }
.account-symbol.coin { background:#eee4d1; color:#9c783e; }
.account-fields { margin:25px 0 0; }
.account-fields>div { display:grid; grid-template-columns:180px minmax(0,1fr); align-items:center; gap:16px; padding:17px 0; border-bottom:1px solid #e2e2e2; }
.account-fields dt { display:flex; align-items:center; gap:7px; color:#737373; font-size:13px; }
.account-fields dt svg { width:16px; height:16px; }
.account-fields dd { margin:0; font-size:16px; font-weight:500; overflow-wrap:anywhere; }
.account-id-row { display:flex; align-items:center; justify-content:space-between; gap:15px; flex-wrap:wrap; }
.account-copy { display:inline-flex; align-items:center; gap:6px; padding:6px; font-size:11px; font-weight:400; color:#456782; }
.account-copy svg { width:16px; height:16px; }
.account-copy:hover { background:#e4ebf1; border-radius:4px; }
.account-copy-result { font-size:12px; line-height:1.7; color:#456782; }
.account-copy-result:not(:empty) { margin-top:10px; }
.account-security { display:flex; justify-content:space-between; align-items:center; gap:15px; margin-top:24px; }
.account-security>div { display:flex; align-items:center; gap:9px; color:#737373; font-size:12px; line-height:1.6; }
.account-security svg { flex-shrink:0; width:17px; height:17px; }
.account-action { display:inline-flex; align-items:center; justify-content:center; gap:8px; min-height:43px; padding:11px 17px; border-radius:5px; border:1px solid #c4d0db; font-size:13px; font-weight:500; line-height:1.5; text-align:center; }
.account-action.primary { background:#365d7c; color:#fff; border-color:#365d7c; }
.account-action.primary:hover:not(:disabled) { background:#294963; }
.account-action.secondary { background:#f8f8f8; color:#365d7c; }
.account-action.secondary:hover { background:#e4ebf1; }
.account-action:disabled { background:#e1e1e1; border-color:#d8d8d8; color:#777; cursor:not-allowed; }
.account-balance { border-top:3px solid #b59a6a; display:flex; flex-direction:column; align-items:flex-start; }
.account-amount { display:block; font:500 40px/1.35 var(--serif); margin-top:22px; color:#574831; font-variant-numeric:tabular-nums; }
.account-balance>p { font-size:12px; color:#80796e; margin-top:6px; line-height:1.7; }
.account-balance>.account-action { width:100%; margin-top:24px; }
.account-shop-link { align-self:center; margin-top:14px; color:#526779; font-size:12px; }
.account-shop-link:hover { text-decoration:underline; text-underline-offset:3px; }
[dir="rtl"] .account-shop-link span { display:inline-block; transform:scaleX(-1); }
.account-characters { margin-top:35px; }
.account-section-heading { display:flex; align-items:center; justify-content:space-between; margin-bottom:19px; }
.account-section-heading h2 { display:flex; align-items:center; gap:10px; font:500 23px/1.5 var(--serif); }
.account-section-heading h2 span { display:inline-flex; align-items:center; justify-content:center; width:26px; height:26px; border-radius:50%; background:#dedede; color:#686868; font:500 12px 'Golos Text',sans-serif; }
.account-section-heading p { margin-top:6px; font-size:12px; color:#737373; line-height:1.7; }
.character-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:20px; }
.character-card { --class-color:#8e633f; --class-bg:#eee4d9; background:#f8f8f8; border:1px solid #d8d8d8; border-top:3px solid var(--class-color); border-radius:7px; overflow:hidden; min-width:0; }
.character-archer { --class-color:#537854; --class-bg:#e1eade; }
.character-mage { --class-color:#78638e; --class-bg:#e9e3ef; }
.character-heading { display:flex; align-items:center; gap:14px; padding:24px 20px; }
.character-emblem { display:flex; align-items:center; justify-content:center; flex-shrink:0; width:51px; height:56px; border-radius:8px 8px 20px 20px; background:var(--class-bg); color:var(--class-color); }
.character-emblem svg { width:30px; height:30px; }
.character-heading h3 { font:500 19px/1.5 var(--serif); overflow-wrap:anywhere; }
.character-heading p { font-size:12px; color:var(--class-color); margin-top:3px; }
.character-level { margin-inline-start:auto; text-align:end; }
.character-level strong { display:block; font:500 24px/1.4 var(--serif); color:#595959; }
.character-level>span { color:#777; font-size:10px; }
.character-meta { display:flex; align-items:center; justify-content:space-between; gap:10px; padding:14px 20px; background:#f1f1f1; border-top:1px solid #e2e2e2; font-size:11px; color:#777; }
.character-meta>span { display:flex; align-items:center; gap:6px; }
.character-meta svg { width:14px; height:14px; }
.character-state i { width:5px; height:5px; border-radius:50%; background:#9a9a9a; }
.account-empty { grid-column:1/-1; padding:32px; text-align:center; border:1px dashed #ccc; border-radius:7px; color:#777; font-size:14px; }
.account-help { display:flex; justify-content:space-between; align-items:center; gap:22px; padding:23px 26px; margin-top:27px; border:1px solid #d5dce1; border-radius:7px; background:#e8edf0; }
.account-help h2 { font:500 17px/1.5 var(--serif); color:#465e71; }
.account-help p { margin-top:5px; color:#687783; font-size:12px; line-height:1.8; }
.account-help a { flex-shrink:0; }
.account-password-dialog { width:min(560px,calc(100% - 30px)); max-height:90dvh; overflow:auto; padding:30px; border:1px solid #d8d8d8; border-radius:10px; background:#f8f8f8; color:#383838; }
.account-password-dialog::backdrop { background:#282828a3; backdrop-filter:blur(3px); }
.password-dialog-heading { display:flex; align-items:center; gap:12px; }
.password-dialog-heading h2 { font:500 24px/1.4 var(--serif); }
.account-password-dialog>p { margin-top:18px; font-size:13px; line-height:1.8; color:#777; }
.password-fields { margin-top:20px; }
.password-fields label { display:flex; flex-direction:column; gap:8px; margin-top:16px; font-size:13px; color:#666; }
.password-fields input { width:100%; padding:13px; border:1px solid #d5d5d5; border-radius:5px; background:#eee; color:#777; font:14px 'Golos Text',sans-serif; }
.password-actions { display:flex; gap:10px; justify-content:flex-end; margin-top:25px; }
@media(max-width:1100px) { .account-fields>div { grid-template-columns:1fr; gap:8px; } .account-security { flex-wrap:wrap; } .character-heading { padding:20px 14px; gap:10px; } .character-emblem { width:42px; } }
@media(max-width:760px) { .account-shell { padding-block:30px; } .account-intro h1 { font-size:29px; } .account-overview { grid-template-columns:minmax(0,1fr); gap:20px; } .account-panel { padding:23px; } .character-grid { grid-template-columns:minmax(0,1fr); gap:15px; } .character-heading { padding:22px; } .character-emblem { width:51px; } .account-help { align-items:flex-start; flex-direction:column; padding:22px; } .account-security { align-items:flex-start; flex-direction:column; } .account-password-dialog { padding:22px; } .password-actions { flex-wrap:wrap; } }

}
.account-layout.profile-mode { display:block; max-width:1200px; padding-block:10px 40px; }
.profile-mode .account-scene { display:none; }
.profile-mode .account-content { border:0; border-radius:0; padding:0; background:transparent; }
.session-pending .account-scene { display:none; }
.account-loading { min-height:280px; display:flex; align-items:center; justify-content:center; color:#766a79; }
.dashboard .account-details { display:block; margin:0; }
.dashboard .account-intro { margin-bottom:26px; }
.dashboard .account-shell { padding-inline:0; }
.dashboard .account-overview { grid-template-columns:minmax(0,1.4fr) minmax(0,1fr); }
.dashboard .account-security { flex-wrap:wrap; }
@media(max-width:760px) { .dashboard .account-overview { grid-template-columns:minmax(0,1fr); } }