/* Same artwork, Onest lettering and theme colors as the application. */
:root{--brand-mark:#0b7a5e}
@media(prefers-color-scheme:dark){:root:not([data-theme="light"]){--brand-mark:#4cc39c}}
:root[data-theme="dark"]{--brand-mark:#4cc39c}
.brand{gap:10px;flex-shrink:0;font-family:"Onest",system-ui,sans-serif;font-size:28px;font-weight:600;line-height:1;letter-spacing:-.035em;white-space:nowrap}
.brand-mark{display:block;flex:none;width:32px;height:32px;background:var(--brand-mark);mask:url('/brand/docroost-mark.svg') center/contain no-repeat}
footer .brand{font-size:28px}
@media(max-width:560px){.brand,footer .brand{font-size:24px;gap:8px}.brand-mark{width:28px;height:28px}.top .wrap{gap:12px}.top .btn.sm{padding-inline:12px;font-size:13px}}
@media(max-width:360px){.top .wrap{height:auto;min-height:60px;flex-wrap:wrap;padding-block:12px;gap:10px}.top .brand{flex-basis:100%}}
.locale-link{flex:none;color:var(--ink-2);font-size:13px;font-weight:600;text-decoration:none;padding:6px 3px;border-radius:6px}
.locale-link:hover{color:var(--ink);background:var(--bg-2)}
@media(max-width:560px){.top .wrap{gap:10px}.top .brand{font-size:22px;gap:8px}.top .brand-mark{width:26px;height:26px}.top .login{font-size:13px}}