/* Account composition reuses Quiet Authority controls, type and core palette. */
.account-heading {margin-bottom:40px}
.account-heading .h1 {margin-bottom:0}
.account-layout {display:grid;grid-template-columns:240px minmax(0,1fr);gap:64px;align-items:start}
.account-nav {display:flex;flex-direction:column;gap:4px;border-top:1px solid var(--c-line2);padding-top:12px}
.account-nav-link {min-height:44px;display:flex;align-items:center;padding:10px 12px;text-decoration:none;color:var(--v-text);font-size:15px;line-height:1.4;border-radius:12px}
.account-nav-link[aria-current="page"] {background:var(--viper-surface-green);font-weight:600}
.account-content {min-width:0;max-width:740px}
.account-content h2, #circle-card h2 {font-size:32px;line-height:1.15;letter-spacing:-.025em;margin:0 0 12px}
.account-content h3,#circle-card h3 {font-size:18px;line-height:1.4;margin:0 0 6px}
.account-content p,#circle-card p {line-height:1.6;max-width:65ch}
.account-content .account-intro {font-size:20px;margin:24px 0 36px}
.account-identity {display:flex;align-items:center;gap:20px}
.account-identity p {margin:0;color:var(--c-body)}
.account-avatar {display:inline-flex;align-items:center;justify-content:center;width:56px;height:56px;flex-shrink:0;border-radius:50%;background:var(--viper-surface-green);color:var(--viper-forest);font-size:21px;font-weight:600;line-height:1}
.account-avatar-small {width:32px;height:32px;font-size:13px}
.account-avatar .ico {width:24px;height:24px}
.account-row {display:flex;justify-content:space-between;align-items:center;gap:24px;padding:24px 0;border-bottom:1px solid var(--c-line2)}
.account-row p {margin:0;color:var(--c-body);font-size:16px}
.account-row .linkbtn {flex-shrink:0}
.account-section {border-top:1px solid var(--c-line2);margin-top:32px;padding-top:24px}
.account-section h3 {margin-top:24px}
.account-section > .btn {margin:8px 8px 0 0}
.account-form {display:flex;flex-direction:column;gap:10px;max-width:440px;margin:28px 0}
.account-form label {font-weight:600;font-size:15px}
.account-form input {width:100%;min-height:48px;padding:12px 16px;border:1px solid var(--c-line2);border-radius:12px;background:white;color:var(--v-text);font:inherit}
.account-form .btn {align-self:flex-start;margin-top:8px}
.account-form p {margin:0}
.account-guest {max-width:700px;padding:32px 0 64px}
.account-guest .authbtns {max-width:430px;margin:32px 0 16px}
.account-guest .lead {max-width:580px}
.account-person {width:100%;display:flex;align-items:center;text-align:left;gap:18px;background:transparent;color:var(--v-text);border:0;border-bottom:1px solid var(--c-line2);padding:22px 0;font:inherit;cursor:pointer}
.account-person>span:nth-child(2) {flex:1;min-width:0}
.account-person strong {display:block;font-size:19px}
.account-person>span>span {display:block;font-size:15px;margin-top:5px;color:var(--c-body)}
.account-person:hover {background:var(--viper-surface-green)}
.account-person strong,.account-identity h2,.account-row {overflow-wrap:anywhere}
.account-loading {color:var(--c-body);min-height:64px}
.account-links {display:flex;gap:20px;flex-wrap:wrap}
#account-message,#family-message {color:var(--v-text);min-height:24px}
#circle-card summary {cursor:pointer;min-height:44px;font-weight:600}
#v-circle {max-width:1100px;margin:auto}
@media(max-width:900px){.account-layout{grid-template-columns:1fr;gap:32px}.account-nav{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:4px}.account-heading{margin-bottom:24px}.account-nav-link{font-size:14px}.account-content{max-width:none}}
@media(max-width:480px){.account-content h2,#circle-card h2{font-size:28px}.account-row{gap:12px}.account-identity{gap:14px}.account-form .btn{width:100%}.account-guest{padding-top:8px}.account-person{gap:12px}.account-section>.btn{width:100%;margin-right:0}}

.account-sr-only {position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap;border:0}
.account-mobile-nav {display:none}
#v-circle > .card {border:0;border-top:1px solid var(--c-line2);border-radius:0;background:transparent;padding:28px 0}
#v-circle .account-row h3 {font-size:18px;line-height:1.4;margin:0 0 6px}
#v-circle .account-row p {margin:0;line-height:1.6}
#v-circle h2 {font-size:32px;line-height:1.2;margin:24px 0 12px}
#v-circle .account-section h3 {font-size:20px;margin:0 0 16px}
#v-circle .account-row {padding:22px 0}
#v-circle .card > .btn {width:auto;margin-top:24px}
#circle-message {overflow-wrap:anywhere}
@media(max-width:900px){
 .account-layout > .account-nav {display:none}
 .account-mobile-nav {display:grid;gap:8px}
 .account-mobile-nav label {font-size:14px;font-weight:600}
 .account-mobile-nav select {font:inherit;min-height:48px;border:1px solid var(--c-line2);border-radius:12px;padding:12px;background:var(--c-canvas);color:var(--v-text);width:100%}
}
/* The account return link is navigation, not a column in the people grid. */
.qa-family-tools > a {grid-column:1 / -1;justify-self:start}
.qa-family-tools {align-items:start}