#navbar {
    .above;
    .bkg(#EEE);
    .dock-top(fixed, 48px);
    .pad(4px);
    .user-select-none;
    border-bottom: 2px solid @lightGrey;

    .logo {
        .dock-left(absolute, 48px);
        .img-logo;
        .no-outline;
        margin: 4px;

        &:hover, &:focus {
            -webkit-filter: brightness(110%);
            filter: brightness(110%);
        }
    }

    h1 {
        .fill(absolute);
        .single-line(ellipsis);
        color: #C4C4C4;
        font: 600 28px/40px @baseFont;
        margin: 6px 64px 6px 64px;
    }
}

#navbar {
    .above;
    .bkg(#EEE);
    .dock-top(fixed, 48px);
    .pad(4px);
    .user-select-none;
    border-bottom: 2px solid @lightGrey;

    .logo {
        .dock-left(absolute, 40px);
        .img-logo-glyph;
        .no-outline;
        margin: 8px;

        &:hover, &:focus {
            -webkit-filter: brightness(110%);
            filter: brightness(110%);
        }
    }

    h1 {
        .fill(absolute);
        .single-line(ellipsis);
        color: #C4C4C4;
        font: 600 28px/40px @baseFont;
        margin: 6px 64px 6px 64px;
    }
}

#account {
    .block;
    .dock-right(absolute, 128px);
    .no-underline;
    .text-center;
    border-left: 3px solid @lightGrey;
    color: #AAA;
    margin: 8px 0;

    p, b { margin: 2px 4px; }

    b {
        .block;
        .single-line;
        color: #BBB;
    }
}

Use a more compact SVG glyph-style version of the logo.
Use a more compact SVG glyph-style version of the logo.
