.header-account { gap: 9px; white-space: nowrap; }
.header-account .icon { flex: 0 0 19px; width: 19px; height: 19px; max-width: none; }
.nav-custom-mobile { display: none; }
.header-account[aria-current] { color: var(--accent-ink); }
@media (max-width:1320px) { .header-account-label { display: none; } .site-header .header-account { padding: 0; width: 44px; min-width: 44px; height: 44px; } }
@media (max-width:836px) { .header-actions > a[href="#/custom"] { display: none; } .site-header .nav-custom-mobile { display: block; } }
.account-page { max-width: 1130px; min-height: 70vh; padding-top: 60px; padding-bottom: 80px; }
.account-page h1 { font-size: clamp(34px, 4vw, 52px); letter-spacing: -.035em; }
.account-entry { display: grid; grid-template-columns: 1fr 420px; gap: 80px; align-items: start; }
.account-entry-copy { padding-top: 48px; }
.account-entry-copy h1 { font-size: clamp(42px,5vw,64px); }
.account-entry-copy p { margin-top: 22px; max-width: 29ch; color: var(--muted); font-size: 19px; line-height: 1.65; }
.account-guide { display: inline-flex; gap: 12px; margin-top: 36px; min-height: 44px; align-items: center; font-size: 14px; color: var(--accent-ink); }
.account-auth { padding: 30px; background: #111113; border: 1px solid #242327; border-radius: 22px; }
.account-auth-switch { display: flex; gap: 26px; margin-bottom: 30px; }
.account-auth-switch button { position: relative; padding: 0 0 12px; min-height: 44px; font-size: 16px; color: var(--muted); }
.account-auth-switch [aria-selected=true] { color: var(--text); }
.account-auth-switch [aria-selected=true]::after { content: ''; position: absolute; left: 0; bottom: 0; width: 100%; height: 2px; background: var(--accent-ink); }
.account-field { display: grid; gap: 10px; font-size: 14px; margin-bottom: 22px; }
.account-field input { min-width: 0; width: 100%; height: 52px; padding: 13px 16px; color: var(--text); background: #09090a; border: 1px solid #393238; border-radius: 10px; outline: none; }
.account-field input:read-only { color: var(--muted); }
.account-field small { color: var(--muted); font-size: 12px; line-height: 1.6; }
.account-password { position: relative; display: block; }
.account-password input { padding-right: 50px; }
.account-password button { position: absolute; display: grid; place-items: center; right: 4px; top: 4px; width: 44px; height: 44px; color: var(--muted); border-radius: 8px; }
.account-password button:hover { color: var(--text); }
.account-consent { display: flex; align-items: flex-start; gap: 10px; margin: 2px 0 24px; font-size: 12px; line-height: 1.65; color: var(--muted); }
.account-consent input { flex-shrink: 0; margin-top: 3px; width: 17px; height: 17px; }
.account-consent a { color: var(--accent-ink); text-decoration: underline; text-underline-offset: 3px; }
.account-auth form > .btn { width: 100%; }
.account-status { color: var(--accent-ink); font-size: 13px; line-height: 1.6; margin-top: 16px; overflow-wrap: anywhere; }
.account-status:empty { display: none; }
.account-heading { display: flex; justify-content: space-between; gap: 28px; align-items: center; }
.account-heading p { margin-top: 16px; font-size: 17px; }
.account-tabs { display: flex; gap: 32px; margin-top: 40px; border-bottom: 1px solid #2b2529; overflow-x: auto; }
.account-tabs a { padding: 14px 0; color: var(--muted); font-size: 16px; min-height: 52px; white-space: nowrap; border-bottom: 2px solid transparent; }
.account-tabs [aria-current] { color: var(--text); border-bottom-color: var(--accent-ink); }
.account-content { padding-top: 36px; }
.account-content h2 { font-size: 28px; letter-spacing: -.025em; }
.account-empty { padding: 38px; background: #111113; border: 1px solid #242327; border-radius: 20px; }
.account-empty p { max-width: 48ch; color: var(--muted); line-height: 1.65; margin-top: 15px; font-size: 16px; }
.account-empty .btn { margin-top: 28px; }
.account-section-heading { display: flex; justify-content: space-between; align-items: center; gap: 20px; margin-bottom: 30px; }
.account-brief { padding: 30px; background: #111113; border: 1px solid #242327; border-radius: 20px; }
.account-brief h3 { font-size: 22px; }
.account-brief > p { margin-top: 18px; white-space: pre-wrap; overflow-wrap: anywhere; color: var(--muted); font-size: 15px; line-height: 1.7; }
.account-brief-bottom { display: flex; justify-content: space-between; align-items: center; gap: 20px; margin-top: 24px; font-size: 13px; }
.account-local-brief { margin-top: 28px; font-size: 14px; color: var(--muted); }
.account-local-brief .text-link { color: var(--accent-ink); margin-top: 8px; }
.account-profile { display: grid; grid-template-columns: 1fr 420px; gap: 80px; }
.account-profile > div > p { margin-top: 14px; font-size: 15px; }
.account-password-change { margin-top: 28px; border-top: 1px solid #2b2529; }
.account-password-change summary { padding: 22px 0; font-size: 14px; cursor: pointer; }
.account-packs { display: grid; gap: 16px; }
.account-pack { display: flex; align-items: center; gap: 24px; padding: 20px; background: #111113; border-radius: 18px; }
.account-pack img { width: 100px; border-radius: 10px; }
.account-page :is(input,button,a,summary):focus-visible { outline: 2px solid var(--accent-ink); outline-offset: 4px; }
.account-page input:focus:not(:focus-visible),body:not(.keyboard-navigation) .account-page input:focus { outline: none; box-shadow: none; }
@media(max-width:1100px) { .account-entry,.account-profile { grid-template-columns: 1fr 360px; gap: 40px; } .header-actions { gap: 10px; } .header-account { padding-inline: 14px; } }
@media(max-width:836px) { .account-page { padding-top: 32px; padding-bottom: 52px; } .account-entry,.account-profile { grid-template-columns: 1fr; gap: 30px; } .account-entry-copy { padding-top: 0; } .account-entry-copy h1 { font-size: 40px; } .account-entry-copy p { max-width: 42ch; font-size: 16px; margin-top: 15px; } .account-guide { margin-top: 18px; } .account-auth { padding: 24px; border-radius: 18px; } .account-heading { align-items: flex-start; gap: 15px; } .account-heading h1 { font-size: 32px; } .account-heading p { font-size: 15px; } .account-tabs { gap: 28px; margin-top: 26px; } .account-content { padding-top: 28px; } .account-empty,.account-brief { padding: 24px; border-radius: 18px; } .account-empty h2,.account-content h2 { font-size: 25px; } .account-section-heading { align-items: flex-start; } .account-section-heading h2 { max-width: 12ch; } .account-brief-bottom { flex-wrap: wrap; } .header-account-label { display: none; } .header-account { padding: 0; width: 44px; min-width: 44px; height: 44px; } }
@media(max-width:390px) { .account-auth { padding: 20px; } .account-auth-switch { gap: 22px; } .account-auth-switch button { font-size: 15px; } }