/* Mellow identity: violet, peach and ink across the workspace and client pages. */
:root{--bg:#f8f8fc;--ink:#27253f;--muted:#807c92;--line:#e9e7f1;--green:#6553d4;--dark:#222236;--lime:#e0daff}
.sidebar{color:#d3cee5}
.brand small,.nav-label{color:#a39bbd}
.nav-link{color:#c3bdd8}
.nav-link:hover{background:#333149;color:#fff}
.nav-link.active{background:#e0daff;color:#342967}
.nav-link.active:after{background:#6553d4}
.profile{border-top-color:#403b57;color:#eeeaf8}
.profile:hover{color:#fff}
.profile small{color:#b2a9c7}
.avatar{background:#ede9fb;color:#51467b}
.avatar.small{background:#403753;color:#e4dcf5}
.workspace-switch select{background:#302b44;border-color:#514862;color:#f1edff}
.sidebar .nav-folder>summary{color:#c3bdd8}
.login-story{color:#d9d0f2}
.login-story:after{border-color:#514773}
.login-story p:not(.eyebrow),.login-story>.eyebrow,.login-story>small{color:#b5abc9}
.login-story .eyebrow{color:#c5b6e0}
.login-story h1 em{color:#ffb18f}
input:focus,select:focus,textarea:focus{border-color:#7765ed;box-shadow:0 0 0 3px #7765ed18}
.button.primary:hover{background:#5140bb}
.mellow-logo{display:block;width:100%;height:auto;object-fit:contain}
.brand.mellow-brand{display:block;padding:0;width:100%;max-width:204px;flex-shrink:0}
.login-story>.brand.mellow-brand{width:240px;max-width:100%;position:relative;z-index:1}
.selection-brand:has(.mellow-logo){width:210px;max-width:100%;line-height:1}
.client-header .selection-brand{flex-shrink:0;margin-right:20px}
@media(max-width:600px){
 .login-story>.brand.mellow-brand{width:180px}
 .client-header .selection-brand{width:160px;margin-right:14px}
 .client-header>div:last-child{min-width:0;overflow-wrap:anywhere}
}
@media print{
 .selection-brand:has(.mellow-logo){width:180px}
}