.account-action-icon{width:23px;height:23px;flex:0 0 23px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
:root[data-theme] body #app .sidebar a:has(>.account-action-icon)>.nav-icon{display:none}
@media(max-width:1023px){
 :root[data-theme] body.account-home #app .workspace>.account-overview{display:flex;flex-direction:column;position:relative;min-width:0;padding:20px;border:1px solid var(--ui-line);border-radius:16px;background:var(--ui-surface);gap:20px}
 :root[data-theme] body.account-home #app .account-overview>.role-welcome{order:0;display:flex;flex-direction:column;align-items:stretch;gap:14px;padding:0;margin:0;border:0!important;border-radius:0;background:transparent!important;box-shadow:none}
 :root[data-theme] body.account-home #app .account-overview>.role-welcome h2{font-size:20px;line-height:1.8;margin:0;overflow-wrap:anywhere}
 :root[data-theme] body.account-home #app .account-overview>.role-welcome p{display:none}
 :root[data-theme] body.account-home #app .account-overview>.role-welcome .button{display:flex;align-items:center;justify-content:center;gap:10px;min-width:0;white-space:normal}
 :root[data-theme] body.account-home #app .account-overview>.stats{order:1;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;margin:0;padding:0}
 :root[data-theme] body.account-home #app .account-overview>.stats>.stat{grid-column:auto!important;min-width:0;display:flex;flex-direction:column;justify-content:space-between;height:auto!important;min-height:112px;gap:8px;padding:12px 8px;border:0!important;border-radius:12px;box-shadow:none;background:var(--ui-soft)!important;margin:0}
 :root[data-theme] body.account-home #app .account-overview>.stats .stat>span:not(.metric-icon){padding:0!important;min-height:44px;font-size:12px;line-height:1.8;white-space:normal;overflow-wrap:anywhere}
 :root[data-theme] body.account-home #app .account-overview>.stats .stat strong{font-size:23px;line-height:1.7;margin-top:6px;overflow-wrap:anywhere}
 :root[data-theme] body.account-home #app .account-overview>.sidebar{order:2;display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr));position:static;align-self:stretch;width:100%;max-width:none;margin:0;padding:20px 0 0;border:0!important;border-top:1px solid var(--ui-line)!important;border-radius:0;box-shadow:none;background:transparent!important;gap:10px}
 :root[data-theme] body.account-home #app .account-overview>.sidebar a{font-size:14px;min-height:56px;padding:12px;gap:10px;line-height:1.8;min-width:0;overflow-wrap:anywhere}
 :root[data-theme] body.account-home #app .account-overview>.sidebar a>.nav-icon{display:none}
 :root[data-theme] body.account-home #app .account-overview .sidebar>.mobile-logout{position:static;grid-column:1/-1;align-self:stretch;width:100%;height:auto;min-height:52px;margin:0;padding:12px 16px;display:flex!important;align-items:center;justify-content:center;gap:10px;font-size:16px;border:1px solid var(--ui-line);border-radius:12px;background:var(--ui-soft)!important}
 :root[data-theme] body.account-home #app .workspace>section:not(.account-overview):empty{display:none}
}
@media(max-width:360px){
 :root[data-theme] body.account-home #app .workspace>.account-overview{padding:16px;gap:16px}
 :root[data-theme] body.account-home #app .account-overview>.sidebar a{padding:10px 8px;font-size:13px;gap:6px}
 :root[data-theme] body.account-home #app .account-overview>.role-welcome h2{font-size:19px}
}

@media(max-width:1023px){:root[data-theme] body.account-home #app .account-overview .stat>.metric-icon{display:none!important}:root[data-theme] body.account-home #app .account-overview>.role-welcome .button{width:100%;max-width:none;margin-inline:0}}

/* Keep logout destructive styling identical across account breakpoints. */
:root[data-theme=light]{--logout-fg:#ed3241;--logout-bg:#f8f9fe;--logout-hover:#e8e9f1}
:root[data-theme] body #logout-button,
:root[data-theme] body #app .sidebar>.mobile-logout,
:root[data-theme] body.account-home #app .account-overview .sidebar>.mobile-logout{color:var(--logout-fg)!important;background:var(--logout-bg)!important;border:1px solid var(--logout-fg)!important}
:root[data-theme] body #logout-button:hover,
:root[data-theme] body #app .sidebar>.mobile-logout:hover,
:root[data-theme] body.account-home #app .account-overview .sidebar>.mobile-logout:hover{background:var(--logout-hover)!important}
@media(max-width:1023px){:root[data-theme] body.account-home #app .workspace>.account-overview~section:not(.account-overview){margin-block-start:40px}}

/* The account home already provides its own navigation and logout. */
:root[data-theme] body.account-home>header .header-account-actions{display:none!important}
@media(min-width:1024px){
 :root[data-theme] body.account-home>header{grid-template-columns:auto minmax(0,1fr)!important}
}

:root[data-theme] body #app .sidebar a:has(>.account-action-icon)>svg:not(.account-action-icon){display:none}
