/* An airy illustrated mark paired with a compact, clear wordmark. */
body .brand{
 align-items:center;gap:10px;min-width:0;max-width:100%;
 border-radius:8px;opacity:1;
 transition:opacity 180ms ease;
}
body .brand:hover{opacity:.92}
body .brand:active{opacity:.85}
body .brand:focus-visible{outline:2px solid #6e9182;outline-offset:5px}
body .brand-symbol{
 display:grid;place-items:center;width:84px;height:56px;
 flex:0 0 84px;padding:0;border:0;border-radius:0;
 background:transparent;box-shadow:none;overflow:visible;
}
body .brand-image{
 display:block;width:84px;height:56px;max-width:100%;
 padding:0;border:0;border-radius:0;background:transparent;
 box-shadow:none;object-fit:contain;object-position:center;filter:none;
}
body .brand-name{display:grid;gap:4px;min-width:0;padding-top:1px;white-space:nowrap}
body .brand-name strong{
 color:#243249;font-size:24px;font-weight:600;line-height:1.1;
 letter-spacing:.06em;
}
body .brand-name small{
 color:#7e8690;font-size:10px;font-weight:400;line-height:1.3;
 letter-spacing:.065em;
}

/* The small assistant mark has the same transparent treatment. */
body .message-avatar.assistant{
 display:flex;align-items:center;justify-content:center;
 width:40px;height:34px;flex:0 0 40px;padding:0;
 border:0;border-radius:0;background:transparent;box-shadow:none;
}
body .message-avatar.assistant>img{
 display:block;width:38px;height:32px;max-width:100%;
 padding:0;border:0;border-radius:0;background:transparent;
 object-fit:contain;object-position:center;filter:none;box-shadow:none;
}

@media(max-width:800px){
 body .brand-symbol{width:72px;height:50px;flex-basis:72px}
 body .brand-image{width:72px;height:50px}
 body .brand-name strong{font-size:23px}
}
@media(max-width:600px){
 body .brand{gap:8px}
 body .brand-symbol{width:64px;height:44px;flex-basis:64px}
 body .brand-image{width:64px;height:44px}
 body .brand-name{gap:3px}
 body .brand-name strong{font-size:21px;letter-spacing:.055em}
 body .brand-name small{font-size:9.5px;letter-spacing:.045em}
 body .message-avatar.assistant{width:36px;height:32px;flex-basis:36px}
 body .message-avatar.assistant>img{width:34px;height:30px}
}
@media(max-width:360px){
 body .brand{gap:7px}
 body .brand-symbol{width:56px;height:40px;flex-basis:56px}
 body .brand-image{width:56px;height:40px}
 body .brand-name strong{font-size:20px;letter-spacing:.04em}
 body .brand-name small{font-size:9px;letter-spacing:.035em}
}
.reduce-motion .brand{transition:none!important}
@media(prefers-reduced-motion:reduce){body .brand{transition:none}}