/* Account page layer (loaded after auth.css). Signed out: a short welcome column beside the login card. Signed in: a
   summary rail on the left (avatar, name, settings) and, on the right, the four-step membership progress, the representative
   character cards and the page actions. Presentation only; auth.js, onboarding.js and member-characters.js are unchanged. */
[data-account-page]{--account-line:var(--border);--account-hairline:var(--border)}
[data-account-page]::before{display:none}
[data-account-page] .account-layout{width:100%;max-width:1440px;min-height:calc(100svh - 160px);margin:0 auto;padding:36px 24px 64px;display:grid;grid-template-columns:minmax(280px,.8fr) minmax(0,1.2fr);align-items:start;gap:32px;background:none}
[data-account-page] .account-intro{position:relative;isolation:isolate;overflow:visible;display:flex;flex-direction:column;justify-content:flex-start;gap:0;min-height:0;padding:8px 0 0;border:0;border-radius:0;background:none;box-shadow:none}
[data-account-page] .account-intro::before,[data-account-page] .account-intro::after{display:none}
.account-identity{display:flex;align-items:center;gap:12px;align-self:flex-start;color:var(--text);filter:none}
.account-identity img{width:36px;height:36px;object-fit:contain;flex-shrink:0}
.account-identity div{display:flex;flex-direction:column;gap:2px}
.account-identity strong{font:700 22px/1.2 var(--body);letter-spacing:-.03em;color:var(--text)}
.account-identity span{display:none}
.account-tagline{margin:10px 0 0;color:var(--text-dim);font-size:14px;line-height:1.8;letter-spacing:0;text-shadow:none}
.account-intro-copy{margin:0;padding:28px 0 0;max-width:460px;text-shadow:none}
[data-account-page] .account-intro h1{font:700 30px/1.4 var(--body);letter-spacing:-.04em;color:var(--text)}
.account-intro-copy>p{position:static;margin-top:14px;padding-top:0;color:var(--text-dim);font-size:15px;line-height:1.9}
.account-intro-copy>p::before,.account-intro-copy>p::after{display:none}
.account-caps{display:none}
[data-account-page] .account-intro-links{display:flex;flex-wrap:wrap;gap:16px;margin-top:20px}
.account-intro-links a{display:inline-flex;align-items:center;min-height:36px;color:var(--accent);font-size:14px;font-weight:500}
.account-intro-links span{margin-left:6px}
.account-quote{display:none}
[data-account-page] .account-card{position:relative;display:block;margin:0;padding:28px 28px 32px;border:1px solid var(--border);border-radius:12px;background:var(--bg-card);box-shadow:var(--shadow);backdrop-filter:none}
.account-card::before,.account-card::after{display:none}
[data-account-page] .account-card>*{max-width:none}
[data-account-page] .account-card h2{font:700 24px/1.35 var(--body);letter-spacing:-.03em}
[data-account-page] #auth-status{margin:6px 0 20px;font-size:13px;line-height:1.7;color:var(--text-dim);min-height:0}
[data-account-page] .account-status.error{color:var(--theme-danger)}
[data-account-page] .account-card .account-help{font-size:13px;line-height:1.8;color:var(--text-dim)}
[data-account-page] .provider-buttons{gap:12px;margin-top:6px}
[data-account-page] .provider-button{border-radius:8px;min-height:50px;font-size:15px}
[data-account-page] .account-privacy{font-size:13px;margin-top:22px;padding-top:18px;border-top:1px solid var(--border);line-height:1.8}
[data-account-page] .account-policy-detail{font-size:12px;line-height:1.8}
/* Signed in: the welcome column leaves; the card spans the page and splits into rail and content. */
[data-account-page] .account-layout:has(#signed-in:not([hidden])){grid-template-columns:minmax(0,1fr)}
[data-account-page] .account-layout:has(#signed-in:not([hidden])) .account-intro{display:none}
[data-account-page] .account-layout:has(#signed-in:not([hidden])) .account-card{padding:0;border:0;background:none;box-shadow:none}
[data-account-page] .account-layout:has(#signed-in:not([hidden])) .account-card h2{margin-bottom:2px}
[data-account-page] #signed-in{display:grid;grid-template-columns:300px minmax(0,1fr);grid-template-rows:auto auto auto auto;gap:24px;align-items:start}
[data-account-page] .account-member-summary{grid-column:1;grid-row:1/5;position:relative;display:flex;flex-direction:column;align-items:center;gap:6px;padding:28px 22px 22px;border:1px solid var(--border);border-radius:12px;background:var(--bg-card);box-shadow:var(--shadow);text-align:center}
[data-account-page] .account-member-summary .member-avatar{width:84px;height:84px;margin:0 0 8px;display:grid;place-items:center;border:1px solid var(--border);border-radius:50%;background:var(--accent-soft);color:var(--accent);font-size:28px}
.account-member-identity{min-width:0;width:100%}
[data-account-page] #member-name{font-size:19px;line-height:1.4;letter-spacing:-.02em;font-weight:700;overflow-wrap:anywhere}
[data-account-page] #member-provider,[data-account-page] #member-character{font-size:13px;line-height:1.6;margin:4px 0 0;color:var(--text-dim)}
.account-settings{width:100%;margin-top:12px;padding-top:14px;border-top:1px solid var(--border)}
.account-settings>summary{list-style:none;display:flex;align-items:center;justify-content:center;gap:8px;min-height:40px;padding:7px 14px;border:1px solid var(--border-strong);border-radius:8px;color:var(--text);font-size:13px;font-weight:500;cursor:pointer}
.account-settings>summary::-webkit-details-marker{display:none}
.account-settings>summary svg{width:15px;height:15px;fill:none;stroke:currentColor;stroke-width:1.6}
.account-settings>summary:hover,.account-settings[open]>summary{color:var(--accent);border-color:var(--accent)}
.account-settings-body{position:static;width:auto;margin-top:12px;padding:14px;border:1px solid var(--border);border-radius:10px;background:var(--bg-soft);text-align:left}
[data-account-page] .account-settings-body .account-help{margin:0;font-size:12.5px;line-height:1.7}
[data-account-page] .account-settings-body .member-actions{margin-top:12px;gap:8px}
.account-settings-body .account-reauth{margin-top:12px}
.account-settings-body .delete-link{width:100%;margin-top:8px;text-align:center;font-size:12.5px}
[data-account-page] .account-guild,[data-account-page] .member-characters{grid-column:2;margin:0;padding:20px 22px 22px;border:1px solid var(--border);border-radius:12px;background:var(--bg-card);box-shadow:var(--shadow)}
[data-account-page] .account-guild{grid-row:1}
[data-account-page] .member-characters{grid-row:2}
[data-account-page] #signed-in>.account-help{grid-column:2;grid-row:3;margin:0;font-size:12.5px;color:var(--text-muted)}
[data-account-page] #signed-in>.account-help::before{content:none}
.account-page-actions{grid-column:2;grid-row:4;display:flex;justify-content:flex-end;margin:0}
.account-page-actions .quiet-button{display:inline-flex;align-items:center;justify-content:center;gap:8px;text-decoration:none}
.account-section-head,[data-account-page] .member-characters-heading{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap;padding-bottom:12px;border-bottom:1px solid var(--border)}
[data-account-page] .account-guild h3,[data-account-page] .member-characters-heading h3{display:flex;align-items:center;gap:10px;margin:0;font-size:17px;font-weight:700;letter-spacing:-.02em}
.account-onboarding h3::before,.member-characters-heading h3::before{content:none}
[data-account-page] .account-guide-link,[data-account-page] .member-characters-heading .quiet-button{display:inline-flex;align-items:center;min-height:36px;padding:6px 12px;border:1px solid var(--border-strong);border-radius:8px;background:var(--bg-card);color:var(--text);font-size:13px;text-decoration:none}
[data-account-page] .account-guide-link:hover,[data-account-page] .member-characters-heading .quiet-button:hover:not(:disabled){border-color:var(--accent);color:var(--accent);background:var(--bg-card)}
/* Four-step progress. */
[data-account-page] .onboarding-steps{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:0;margin:20px 0 16px;padding:0;list-style:none;counter-reset:account-step}
[data-account-page] .onboarding-steps li{position:relative;padding:40px 4px 0;border:0;text-align:center;font-size:13px;line-height:1.5;color:var(--text-muted);counter-increment:account-step}
.onboarding-steps li::after{content:"";position:absolute;top:15px;left:0;right:0;height:2px;background:var(--border)}
.onboarding-steps li:first-child::after{left:50%}
.onboarding-steps li:last-child::after{right:50%}
.onboarding-steps .account-step-mark::before{content:counter(account-step);position:absolute;z-index:1;top:0;left:50%;transform:translateX(-50%);width:32px;height:32px;display:grid;place-items:center;border:2px solid var(--border-strong);border-radius:50%;background:var(--bg-card);color:var(--text-muted);font-size:13px;font-weight:600}
[data-account-page] .onboarding-steps li[data-complete=true]{color:var(--text-dim)}
.onboarding-steps li[data-complete=true] .account-step-mark::before{content:"✓";border-color:var(--accent);background:var(--accent);color:var(--theme-on-accent)}
.onboarding-steps li[data-complete=true]::after{background:var(--accent)}
[data-account-page] .onboarding-steps li[aria-current=step]{font-weight:600;color:var(--accent)}
.onboarding-steps li[aria-current=step] .account-step-mark::before{border-color:var(--accent);background:var(--bg-card);color:var(--accent);box-shadow:0 0 0 4px var(--accent-soft)}
.account-membership-summary{display:flex;align-items:center;gap:12px;flex-wrap:wrap;margin:0 0 18px;padding:12px 16px;border:1px solid var(--border);border-radius:10px;background:var(--bg-soft)}
.account-membership-summary::before{content:none}
[data-account-page] .account-membership-summary .membership-status{display:inline-block;flex-shrink:0;margin:0;padding:3px 10px;border:0;border-radius:999px;background:var(--accent-soft);color:var(--accent);font-size:13px;font-weight:600}
[data-account-page] .account-membership-summary .account-help{flex:1 1 200px;margin:0;font-size:13px;line-height:1.65}
[data-account-page] .account-guild label{display:flex;align-items:center;gap:10px;margin:18px 0 8px;font-size:13px;font-weight:600;color:var(--text)}
[data-account-page] .account-guild label::before{content:none}
[data-account-page] .account-guild input{min-height:44px;border:1px solid var(--border-strong);border-radius:8px;background:var(--bg-card);color:var(--text);padding:8px 12px;font:inherit;width:100%}
[data-account-page] .account-guild input:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
[data-account-page] .signup-preview{position:relative;margin-top:16px;padding:14px 16px;border:1px solid var(--border);border-radius:10px;background:var(--bg-soft)}
[data-account-page] #ownership-character-profile::before{content:none}
[data-account-page] .signup-preview h4{font-size:16px;font-weight:700;margin:0 0 4px}
[data-account-page] .signup-preview p{font-size:13px;line-height:1.6;margin:3px 0 0;color:var(--text-dim)}
[data-account-page] .signup-preview .ownership-verified{position:absolute;right:14px;top:14px;margin:0;padding:3px 10px;border:0;border-radius:999px;background:var(--accent-soft);color:var(--accent);font-size:12px;font-weight:600}
[data-account-page] .account-onboarding .guild-verification{margin-top:16px;padding:16px;border:1px solid var(--border);border-radius:10px;background:var(--bg-soft)}
[data-account-page] .guild-verification h4{font-size:14px}
[data-account-page] #application-status:empty{display:none}
[data-account-page] .account-guild .account-status{margin:12px 0 0;font-size:13px}
/* Representative character cards. */
[data-account-page] .member-characters>.account-help{margin-top:10px;font-size:13px;line-height:1.7}
[data-account-page] .representative-character{margin:12px 0 0;padding:10px 14px;border:1px solid var(--border);border-left:3px solid var(--accent);border-radius:8px;background:var(--bg-soft);font-size:13px;font-weight:500}
[data-account-page] .member-characters .account-status{margin:10px 0 12px;font-size:13px;line-height:1.7;min-height:0}
[data-account-page] .member-characters-groups{max-height:none;gap:14px;padding:0;overflow:visible;scrollbar-width:thin}
[data-account-page] .member-character-server{margin:0;padding:0;border:0;border-radius:0;background:none}
[data-account-page] .member-character-server legend{padding:0;margin:0 0 8px;font-size:13px;font-weight:600;color:var(--text-dim)}
[data-account-page] .member-character-server{display:grid;grid-template-columns:repeat(auto-fill,minmax(210px,1fr));gap:10px}
[data-account-page] .member-character-server legend{grid-column:1/-1}
[data-account-page] .member-character-option{position:relative;display:grid;grid-template-columns:40px minmax(0,1fr);grid-template-rows:auto auto;align-items:center;column-gap:12px;row-gap:2px;min-height:76px;padding:12px 40px 12px 14px;border:1px solid var(--border);border-radius:10px;background:var(--bg-card);cursor:pointer}
[data-account-page] .member-character-option:last-child{border-bottom:1px solid var(--border)}
[data-account-page] .member-character-option:hover{border-color:var(--border-strong)}
[data-account-page] .member-character-option:has(input:checked){border-color:var(--accent);background:var(--accent-soft)}
[data-account-page] .member-character-option:has(input:checked)+.member-character-option{border-top:1px solid var(--border)}
[data-account-page] .member-character-option:focus-within{outline:2px solid var(--accent);outline-offset:2px;border-radius:10px}
[data-account-page] .member-character-option input{position:absolute;right:12px;top:12px;appearance:none;display:grid;place-content:center;width:20px;height:20px;margin:0;border:1px solid var(--border-strong);border-radius:50%;background:var(--bg-card)}
.member-character-option input:checked{border-color:var(--accent);background:var(--accent)!important}
.member-character-option input:checked::before{content:"✓";font-size:12px;font-weight:700;color:var(--theme-on-accent)}
.member-character-glyph{grid-row:1/3;width:40px;height:40px;display:grid;place-items:center;border:1px solid var(--border);border-radius:50%;background:var(--bg-soft);color:var(--text-dim);font-size:15px;font-weight:600}
[data-account-page] .member-character-info{grid-column:2;grid-row:1;display:flex;flex-direction:column;gap:1px;line-height:1.4;min-width:0}
[data-account-page] .member-character-info strong{font-size:14px;font-weight:600;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
[data-account-page] .member-character-info>span{font-size:12px;color:var(--text-dim)}
[data-account-page] .member-character-level{grid-column:2;grid-row:2;font-size:12.5px;white-space:nowrap;color:var(--text-dim);font-variant-numeric:tabular-nums}
[data-account-page] .account-card .home-button{min-height:46px;border:1px solid var(--accent);border-radius:8px;background:var(--accent);color:var(--theme-on-accent);font-weight:600;box-shadow:none}
[data-account-page] .account-card .home-button:hover:not(:disabled){background:var(--theme-accent-hover);border-color:var(--theme-accent-hover);filter:none}
[data-account-page] .account-card .home-button:disabled{opacity:.5;cursor:not-allowed;box-shadow:none}
[data-account-page] #member-characters-save{margin-top:16px;width:auto;min-width:220px}
[data-account-page] #member-characters-save::before{content:none}
[data-account-page] .account-card .quiet-button,.guild-layout .quiet-button{border-radius:8px;font-size:13px;min-height:40px}
[data-account-page] .home-button,.guild-layout .home-button{border-radius:8px;min-height:46px;font-size:14px}
[data-account-page] .delete-link{font-size:12.5px;margin-top:16px}
.delete-dialog{border-radius:12px;border:1px solid var(--border);background:var(--bg-card);color:var(--text)}
.delete-dialog::backdrop{background:rgba(18,21,27,.45);backdrop-filter:none}
[data-account-page] .account-footer,.guild-layout~.account-footer{max-width:1440px;font-size:12px;padding:24px;gap:22px}
[data-account-page].signup-active .account-intro{align-self:stretch}
:root[data-theme="light"] [data-account-page] .account-card .home-button{color:var(--theme-on-accent)}
:root[data-theme="light"] [data-account-page] .account-intro h1{color:var(--text)}
@media(max-width:1100px){
[data-account-page] .account-layout{grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);gap:24px}
[data-account-page] #signed-in{grid-template-columns:260px minmax(0,1fr);gap:16px}
}
@media(max-width:900px){
[data-account-page] #signed-in{grid-template-columns:minmax(0,1fr);grid-template-rows:none}
[data-account-page] .account-member-summary{grid-column:auto;grid-row:auto;flex-direction:row;flex-wrap:wrap;align-items:center;text-align:left;padding:16px 18px;gap:4px 14px}
[data-account-page] .account-member-summary .member-avatar{width:56px;height:56px;margin:0;font-size:22px}
.account-member-identity{flex:1 1 160px;width:auto}
.account-settings{flex-basis:100%;margin-top:10px;padding-top:12px}
[data-account-page] .account-guild,[data-account-page] .member-characters,[data-account-page] #signed-in>.account-help,.account-page-actions{grid-column:auto;grid-row:auto}
}
@media(max-width:820px){
[data-account-page] .account-layout{display:block;min-height:0;padding:24px 14px 48px}
[data-account-page] .account-intro{margin-bottom:20px;padding:0}
.account-identity strong{font-size:20px}
.account-identity img{width:30px;height:30px}
.account-tagline{display:none}
.account-intro-copy{padding-top:14px}
[data-account-page] .account-intro h1{font-size:24px}
.account-intro-copy>p{font-size:14px;margin-top:10px}
[data-account-page] .account-intro-links{margin-top:12px;gap:14px}
[data-account-page] .account-card{padding:20px 16px 24px}
[data-account-page] .account-card h2{font-size:22px}
[data-account-page] .account-guild,[data-account-page] .member-characters{padding:16px 14px 18px}
[data-account-page] .account-guild input{font-size:16px}
[data-account-page] .onboarding-steps li{font-size:12px;padding-top:38px}
[data-account-page] .member-character-server{grid-template-columns:minmax(0,1fr)}
[data-account-page] #member-characters-save{width:100%}
}
@media(max-width:1024px),(pointer:coarse){
.account-settings>summary,[data-account-page] .account-guide-link,[data-account-page] .member-characters-heading .quiet-button,[data-account-page] .account-card .quiet-button,.account-intro-links a{min-height:44px}
}