:root {
    --brand-navy:#003b73;
    --brand-blue:#009bff;
    --brand-coral:#f24444;
    --navy:var(--brand-navy);
    --action:#006fbf;
    --action-hover:#005ba6;
    --ink:#163754;
    --muted:#61768c;
    --border:#e0e6e9;
    --soft:#f6f8f9;
    --error:#ad3434;
    --sidebar:252px;
    --header-height:77px;
    color:var(--ink);
    font-family:Inter,-apple-system,BlinkMacSystemFont,"Segoe UI",Arial,sans-serif;
    font-synthesis:none;
    font-size:15px;
    line-height:1.5;
}
* {
    box-sizing:border-box;
}
body {
    margin:0;
    background:#fff;
}
a {
    color:var(--action);
    text-decoration:none;
}
a:hover {
    text-decoration:underline;
}
button,input {
    font:inherit;
}
button,a,input {
    -webkit-tap-highlight-color:transparent;
}
button {
    cursor:pointer;
}
button:disabled {
    cursor:default;
}
input {
    min-width:0;
}
button svg,a svg {
    flex:none;
}
svg {
    vertical-align:middle;
}
h1,h2,p {
    margin:0;
}
h1,h2 {
    font-weight:650;
    line-height:1.2;
    letter-spacing:-.035em;
}
h1 {
    font-size:40px;
}
h2 {
    font-size:23px;
}
p {
    color:var(--muted);
}
:focus-visible {
    outline:3px solid #0078c9;
    outline-offset:4px;
}
button,input {
    border-radius:6px;
}
.brand-link {
    color:#fff;
    display:inline-block;
}
.brand-link:hover {
    text-decoration:none;
}
.button {
    display:inline-flex;
    align-items:center;
    justify-content:center;
    gap:10px;
    min-height:46px;
    padding:11px 19px;
    border:1px solid var(--action);
    border-radius:6px;
    color:white;
    background:var(--action);
    font-weight:600;
    line-height:1.4;
    text-align:center;
    transition:background .15s;
}
.button:hover {
    background:var(--action-hover);
    border-color:var(--action-hover);
    text-decoration:none;
}
.button.secondary {
    background:#fff;
    color:var(--ink);
    border-color:#d6dfe3;
}
.button.secondary:hover {
    background:var(--soft);
}
.icon-button {
    display:inline-flex;
    align-items:center;
    justify-content:center;
    width:40px;
    height:40px;
    border:0;
    background:transparent;
    color:inherit;
}
.sr-only {
    position:absolute;
    width:1px;
    height:1px;
    padding:0;
    margin:-1px;
    overflow:hidden;
    clip:rect(0,0,0,0);
    white-space:nowrap;
    border:0;
}
.skip-link {
    position:fixed;
    top:10px;
    left:280px;
    z-index:40;
    padding:12px;
    background:#fff;
    transform:translateY(-150%);
}
.skip-link:focus {
    transform:none;
}
/* Shared sign-in screen. */
.guest {
    min-height:100svh;
    display:grid;
    grid-template-columns:42.2% 1fr;
}
.guest-brand {
    position:relative;
    background:var(--navy);
    color:white;
    min-height:100svh;
    padding:82px 10.6% 58px;
    display:flex;
    flex-direction:column;
}
.guest-message {
    margin:auto 0;
}
.guest-message h1 {
    font-size:clamp(34px,3.5vw,54px);
    line-height:1.25;
    letter-spacing:-1.7px;
    color:#fff;
}
.guest-message p {
    margin-top:26px;
    font-size:clamp(17px,1.7vw,26px);
    color:#c0cbd2;
    line-height:1.55;
    white-space:nowrap;
}
.guest-footer {
    font-size:15px;
    letter-spacing:1px;
    color:#bdcbd3;
}
.guest-main {
    padding:64px clamp(44px,9.5vw,146px);
    display:flex;
    align-items:center;
    justify-content:center;
}
.auth-form {
    width:100%;
    max-width:625px;
}
.auth-form h2 {
    font-size:48px;
    letter-spacing:-1.6px;
    line-height:1.2;
}
.auth-intro {
    font-size:20px;
    margin:16px 0 42px;
    line-height:1.55;
}
.field {
    margin:0 0 24px;
}
.field>label {
    display:block;
    color:var(--ink);
    font-weight:550;
    margin-bottom:9px;
    line-height:1.5;
}
.input-wrap {
    position:relative;
}
.input-wrap input {
    width:100%;
    height:49px;
    padding:12px 14px;
    color:var(--ink);
    background:#fff;
    border:1px solid #d2dbdf;
    transition:border-color .15s;
}
.input-wrap input::placeholder {
    color:#9aa5ac;
}
.input-wrap input:focus {
    outline:2px solid #ddecff;
    outline-offset:1px;
    border-color:var(--action);
}
.input-wrap input[type=password],.input-wrap input[data-visible-password] {
    padding-right:50px;
}
.input-wrap .invalid {
    border-color:var(--error);
}
.reveal {
    position:absolute;
    right:5px;
    top:50%;
    transform:translateY(-50%);
    width:42px;
    height:40px;
    border:0;
    background:transparent;
    color:#83919a;
    display:flex;
    align-items:center;
    justify-content:center;
}
.reveal:hover {
    color:var(--ink);
}
.field-hint {
    font-size:13px;
    margin-top:7px;
    line-height:1.55;
}
.field-error {
    color:var(--error);
    font-size:13px;
    margin-top:7px;
}
.checkbox {
    display:inline-flex;
    gap:10px;
    align-items:center;
    color:var(--ink);
    line-height:1.5;
    cursor:pointer;
}
.checkbox input {
    width:18px;
    height:18px;
    margin:0;
    accent-color:var(--action);
    flex-shrink:0;
}
.login-options {
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:15px;
    font-size:16px;
    margin:4px 0 30px;
}
.login-submit {
    width:100%;
    height:60px;
    font-size:19px;
}
.auth-help {
    border-top:1px solid var(--border);
    text-align:center;
    padding-top:30px;
    margin-top:40px;
    font-size:16px;
}
.auth-form .field>label {
    font-size:18px;
}
.auth-form .field {
    margin-bottom:26px;
}
.auth-form .input-wrap input {
    height:60px;
    font-size:18px;
}
.auth-form .notice {
    margin-bottom:25px;
}
/* Application navigation and open workspace. */
.sidebar {
    position:fixed;
    inset:var(--header-height) auto 0 0;
    width:var(--sidebar);
    background:var(--navy);
    color:#d5dfe6;
    padding:34px 22px;
    display:flex;
    flex-direction:column;
    z-index:25;
}
.nav-caption {
    font-size:12px;
    text-transform:uppercase;
    letter-spacing:1px;
    color:#92a8b6;
    margin:0 14px 19px;
}
.side-nav {
    display:flex;
    flex-direction:column;
    gap:8px;
}
.side-nav a {
    display:flex;
    align-items:center;
    gap:13px;
    color:#c9d6df;
    padding:13px 14px;
    border-radius:6px;
    font-size:15px;
}
.side-nav a.active {
    color:#fff;
    background:#005397;
}
.side-nav a:hover {
    background:#004b88;
    text-decoration:none;
    color:#fff;
}
.side-nav svg {
    width:20px;
    height:20px;
}
.sidebar-footer {
    border-top:1px solid #23598d;
    margin: auto 12px 0;
    padding-top:25px;
    display:flex;
    flex-direction:column;
    gap:7px;
    font-size:12px;
    overflow-wrap:anywhere;
}
.sidebar-footer strong {
    font-weight:550;
    color:#e9eff3;
}
.sidebar-footer span {
    color:#92a8b6;
}
.workspace {
    margin-left:var(--sidebar);
    min-height:calc(100svh - var(--header-height));
}
.topbar {
    position:sticky;
    top:0;
    z-index:20;
    height:var(--header-height);
    border-bottom:1px solid var(--border);
    display:flex;
    align-items:center;
    padding:0 40px 0 0;
    background:#fff;
}
.user-menu {
    margin-left:auto;
    display:flex;
    align-items:center;
    gap:12px;
    font-size:13px;
}
.avatar {
    height:34px;
    width:34px;
    flex-shrink:0;
    border-radius:50%;
    display:flex;
    align-items:center;
    justify-content:center;
    color:#205b92;
    background:#edf5ff;
    font-size:12px;
    font-weight:650;
}
.viewer-name {
    font-weight:550;
    max-width:240px;
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap;
}
.logout {
    display:flex;
    align-items:center;
    gap:9px;
    color:#6e7d87;
    background:none;
    border:0;
    font-size:13px;
    padding:8px;
    margin-left:18px;
}
.logout:hover {
    color:var(--ink);
}
.logout svg {
    width:17px;
    height:17px;
}
.main-content {
    padding:45px 46px 60px;
    max-width:1600px;
}
.page-heading {
    display:flex;
    justify-content:space-between;
    align-items:center;
    gap:24px;
    margin-bottom:36px;
}
.page-heading p {
    font-size:16px;
    margin-top:13px;
    line-height:1.6;
}
.page-heading h1 {
    overflow-wrap:anywhere;
}
.page-heading>.button {
    flex-shrink:0;
}
.table-panel {
    border:1px solid var(--border);
    border-radius:9px;
    overflow:hidden;
    background:white;
}
.table-search {
    display:flex;
    align-items:center;
    gap:12px;
    padding:21px 25px;
    border-bottom:1px solid var(--border);
    color:#87959e;
}
.table-search input {
    width:100%;
    border:0;
    outline:0;
    background:transparent;
    height:32px;
    color:var(--ink);
}
.table-search input:focus-visible {
    outline:2px solid #75bfff;
    outline-offset:3px;
}
.table-search input::placeholder {
    color:#929ea6;
}
.text-button {
    background:transparent;
    border:0;
    color:var(--action);
    font-size:13px;
    padding:8px;
    font-weight:600;
}
.text-button:hover {
    text-decoration:underline;
}
.muted-link {
    color:#73818a;
    font-size:13px;
}
.table-scroll {
    position:relative;
    overflow-x:auto;
}
table {
    width:100%;
    border-collapse:collapse;
    text-align:left;
    white-space:nowrap;
}
th {
    font-size:13px;
    font-weight:550;
    color:#6d7b84;
    background:#fafbfc;
    padding:17px 25px;
    border-bottom:1px solid var(--border);
}
td {
    padding:19px 25px;
    border-bottom:1px solid var(--border);
    font-size:14px;
}
tbody tr:last-child td {
    border-bottom:0;
}
.cell-primary {
    font-weight:600;
}
.cell-primary a {
    color:var(--ink);
}
.cell-secondary {
    font-weight:400;
    color:var(--muted);
    display:block;
    font-size:13px;
    margin-top:3px;
}
.badge {
    display:inline-flex;
    align-items:center;
    gap:6px;
    border-radius:4px;
    padding:4px 9px;
    font-size:12px;
    font-weight:550;
    color:#205f97;
    background:#edf5ff;
}
.badge:before {
    content:"";
    width:5px;
    height:5px;
    border-radius:50%;
    background:currentColor;
}
.badge-inactive {
    color:#8c4d4d;
    background:#faeeee;
}
.row-action {
    display:inline-flex;
    align-items:center;
    justify-content:center;
    color:#7d8c95;
    width:32px;
    height:32px;
}
.empty-cell {
    padding:0;
    white-space:normal;
}
.empty-state {
    min-height:380px;
    padding:55px 25px 57px;
    text-align:center;
    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:center;
}
.empty-icon {
    width:70px;
    height:70px;
    display:flex;
    align-items:center;
    justify-content:center;
    background:#edf5ff;
    border-radius:14px;
    color:#3977aa;
    margin-bottom:24px;
}
.empty-state h2 {
    font-size:24px;
    letter-spacing:-.5px;
}
.empty-state p {
    font-size:15px;
    margin:13px 0 26px;
}
.table-footer {
    min-height:58px;
    border-top:1px solid var(--border);
    padding:18px 25px;
    color:#82909a;
    font-size:12px;
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:15px;
}
.pagination {
    display:flex;
    align-items:center;
    gap:15px;
}
.pagination [aria-disabled] {
    color:#a7b1b7;
}
.back-link {
    display:inline-block;
    font-size:13px;
    margin-bottom:20px;
}
.form-panel {
    max-width:1050px;
    border:1px solid var(--border);
    border-radius:9px;
    overflow:hidden;
}
.form-section {
    padding:30px 32px 8px;
}
.form-section+.form-section {
    border-top:1px solid var(--border);
}
.section-heading {
    margin-bottom:28px;
}
.section-heading h2 {
    font-size:21px;
    letter-spacing:-.4px;
}
.section-heading p {
    margin-top:8px;
    font-size:14px;
    max-width:680px;
    line-height:1.65;
}
.form-grid {
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:24px;
}
.form-actions {
    display:flex;
    justify-content:flex-end;
    align-items:center;
    gap:12px;
    border-top:1px solid var(--border);
    padding:20px 32px;
}
.spaced-panel {
    margin-top:30px;
}
.notice {
    padding:15px 18px;
    background:#f0f6ff;
    border:1px solid #d2e3f6;
    border-radius:6px;
    font-size:14px;
    display:flex;
    align-items:flex-start;
    gap:10px;
    margin-bottom:25px;
    color:#285a88;
}
.notice svg {
    flex:none;
    margin-top:1px;
}
.notice-error {
    color:var(--error);
    background:#fdf3f3;
    border-color:#ebcdcd;
}
.identity-panel {
    padding:26px 32px;
    max-width:1050px;
    border:1px solid var(--border);
    border-radius:9px;
}
.details {
    display:flex;
    gap:100px;
    margin:0;
}
.details div {
    min-width:0;
}
.details dt {
    font-size:13px;
    color:var(--muted);
    margin-bottom:8px;
}
.details dd {
    margin:0;
    font-size:16px;
    font-weight:550;
    overflow-wrap:anywhere;
}
.company-heading {
    margin-top:45px;
    margin-bottom:26px;
}
.company-heading h2 {
    font-size:24px;
}
.company-heading p {
    font-size:14px;
    margin-top:7px;
}
.onboarding-panel {
    border:1px solid var(--border);
    border-radius:9px;
    padding:36px 38px;
}
.onboarding-panel .empty-icon {
    width:60px;
    height:60px;
    border-radius:12px;
    margin-bottom:22px;
}
.onboarding-panel h2 {
    font-size:26px;
}
.onboarding-panel p {
    margin:12px 0 24px;
    font-size:16px;
}
.dashboard-details {
    padding:32px 0;
    border-bottom:1px solid var(--border);
    margin-top:8px;
}
.roadmap-note {
    font-size:13px;
    margin-top:26px;
}
.overview-panel {
    padding:32px;
    border:1px solid var(--border);
    border-radius:9px;
}
.overview-panel .details {
    margin:32px 0;
}
.menu-toggle,.close-nav {
    display:none;
}
.nav-overlay {
    display:none;
}
@media(min-width:1600px) {
    .guest-main {
        padding-left:146px;
        padding-right:116px;
    }
}
@media(max-width:1200px) {
    .guest-brand {
        padding:65px 9% 40px;
    }
    .guest-main {
        padding:55px 8%;
    }
    .guest-message p {
        font-size:18px;
        white-space:normal;
    }
    .guest-message h1 {
        font-size:38px;
    }
    .auth-form h2 {
        font-size:40px;
    }
    .auth-intro {
        font-size:17px;
    }
    .login-options {
        font-size:14px;
    }
    .main-content {
        padding:36px 30px;
    }
    .topbar {
        padding:0 30px 0 0;
    }
    .page-heading h1 {
        font-size:34px;
    }
    .page-heading {
        gap:15px;
    }
    th,td {
        padding-left:18px;
        padding-right:18px;
    }
    .details {
        gap:60px;
    }
}
@media(max-width:900px) {
    :root {
        --sidebar:220px;
    }
    .sidebar {
        padding:30px 15px;
    }
    .side-nav a {
        font-size:14px;
        gap:10px;
    }
    .main-content {
        padding:30px 24px;
    }
    .topbar {
        padding:0 24px 0 0;
    }
    .page-heading {
        align-items:flex-start;
    }
    .page-heading h1 {
        font-size:30px;
    }
    .page-heading p {
        font-size:14px;
    }
    .form-section {
        padding:24px 24px 2px;
    }
    .form-grid {
        grid-template-columns:1fr;
        gap:0;
    }
    .form-actions {
        padding:18px 24px;
    }
    .details {
        gap:30px;
    }
    .auth-form .field>label {
        font-size:16px;
    }
    .guest-main {
        padding:45px 35px;
    }
    .guest-message h1 {
        font-size:30px;
        letter-spacing:-1px;
    }
    .guest-message p {
        font-size:17px;
    }
    .auth-form h2 {
        font-size:36px;
    }
    .login-options {
        align-items:flex-start;
        flex-direction:column;
        gap:18px;
    }
    .auth-help {
        font-size:14px;
    }
}
@media(max-width:700px) {
    .guest {
        display:block;
    }
    .guest-brand {
        min-height:0;
        padding:28px 25px;
    }
    .guest-message,.guest-footer {
        display:none;
    }
    .guest-main {
        padding:44px 25px 40px;
        align-items:flex-start;
    }
    .auth-form {
        max-width:450px;
    }
    .auth-form h2 {
        font-size:35px;
        letter-spacing:-1px;
    }
    .auth-intro {
        font-size:16px;
        margin:13px 0 30px;
    }
    .auth-form .field {
        margin-bottom:22px;
    }
    .auth-form .input-wrap input {
        height:54px;
        font-size:16px;
    }
    .login-options {
        flex-direction:row;
        font-size:13px;
        gap:10px;
        margin:6px 0 28px;
        align-items:center;
    }
    .checkbox {
        gap:8px;
    }
    .checkbox input {
        width:17px;
        height:17px;
    }
    .login-submit {
        height:54px;
        font-size:17px;
    }
    .auth-help {
        margin-top:30px;
        padding-top:25px;
        font-size:13px;
    }
    .sidebar {
        transform:translateX(-100%);
        width:260px;
        transition:transform .18s ease;
    }
    .nav-open .sidebar {
        transform:translateX(0);
    }
    .nav-overlay {
        position:fixed;
        inset:0;
        background:#00264d80;
        border:0;
        z-index:24;
        width:100%;
        height:100%;
        border-radius:0;
    }
    .nav-open .nav-overlay {
        display:block;
    }
    .nav-open {
        overflow:hidden;
    }
    .workspace {
        margin-left:0;
    }
    .close-nav {
        display:flex;
        position:absolute;
        right:12px;
        top:26px;
    }
    .menu-toggle {
        display:flex;
    }
    .topbar {
        height:68px;
        padding:0 20px;
        justify-content:space-between;
    }
    .user-menu {
        gap:8px;
    }
    .viewer-name {
        font-size:12px;
        max-width:120px;
    }
    .logout {
        margin-left:3px;
        padding:8px 0 8px 8px;
    }
    .logout span {
        display:none;
    }
    .logout svg {
        width:19px;
        height:19px;
    }
    .main-content {
        padding:30px 20px 45px;
    }
    .page-heading {
        flex-wrap:wrap;
        gap:22px;
        margin-bottom:28px;
    }
    .page-heading h1 {
        font-size:31px;
    }
    .page-heading p {
        font-size:14px;
        margin-top:10px;
    }
    .page-heading>.button {
        font-size:14px;
        min-height:43px;
    }
    .table-search {
        padding:15px;
        gap:8px;
        font-size:13px;
    }
    .table-search>svg {
        width:18px;
    }
    .table-search .text-button {
        padding:8px 2px;
        font-size:12px;
    }
    .table-search .muted-link {
        font-size:12px;
    }
    th,td {
        padding:15px;
        font-size:13px;
    }
    .table-footer {
        padding:15px;
        font-size:12px;
        align-items:flex-start;
        flex-direction:column;
    }
    .empty-state {
        padding:35px 18px;
        min-height:335px;
    }
    .empty-state h2 {
        font-size:21px;
    }
    .empty-state p {
        font-size:14px;
        max-width:265px;
        line-height:1.65;
    }
    .empty-icon {
        width:62px;
        height:62px;
    }
    .form-section {
        padding:24px 20px 2px;
    }
    .section-heading p {
        font-size:13px;
    }
    .form-actions {
        padding:18px 20px;
        flex-wrap:wrap;
    }
    .form-actions .button {
        font-size:13px;
    }
    .details {
        flex-direction:column;
        gap:25px;
    }
    .identity-panel {
        padding:24px 20px;
    }
    .company-heading {
        margin-top:32px;
    }
    .onboarding-panel {
        padding:28px 24px;
    }
    .onboarding-panel h2 {
        font-size:24px;
    }
    .onboarding-panel p {
        font-size:14px;
        line-height:1.6;
    }
    .onboarding-panel .button {
        font-size:14px;
    }
    .roadmap-note {
        line-height:1.7;
    }
    .notice {
        font-size:13px;
    }
    .skip-link {
        left:20px;
    }
    .pagination {
        gap:12px;
        font-size:11px;
    }
}
@media(prefers-reduced-motion:reduce) {
    * {
        transition:none!important;
        scroll-behavior:auto!important;
    }
}
/* Match the larger, quieter customer welcome page from the concept. */
@media(min-width:1201px) {
    .guest-main {
        padding-left:9.5vw;
        padding-right:7.5vw;
    }
    .auth-form h2 {
        font-size:54px;
    }
    .auth-intro {
        font-size:23px;
        margin-bottom:42px;
    }
    .auth-form .field>label {
        font-size:20px;
    }
    .auth-form .input-wrap input {
        height:65px;
        font-size:20px;
    }
    .login-options {
        font-size:18px;
    }
    .login-submit {
        height:66px;
        font-size:23px;
    }
    .auth-help {
        font-size:18px;
    }
    .guest-message h1 {
        font-size:54px;
    }
    .guest-message p {
        font-size:28px;
        margin-top:18px;
    }
    .nav-caption {
        text-transform:none;
        font-size:14px;
        letter-spacing:0;
        margin-bottom:18px;
    }
    .side-nav a {
        font-size:16px;
    }
    .side-nav a.active {
        background:#005ca6;
    }
    .sidebar-footer {
        font-size:13px;
    }
    .page-heading h1 {
        font-size:42px;
    }
    .user-menu {
        font-size:14px;
    }
    .logout {
        font-size:14px;
    }
    .client-dashboard .main-content {
        padding:86px 52px 48px 90px;
    }
    .client-dashboard .page-heading {
        margin-bottom:45px;
    }
    .client-dashboard .page-heading h1 {
        font-size:54px;
    }
    .client-dashboard .page-heading p {
        font-size:24px;
        margin-top:14px;
    }
    .client-dashboard .company-heading {
        margin-top:0;
        margin-bottom:32px;
    }
    .client-dashboard .company-heading h2 {
        font-size:31px;
    }
    .client-dashboard .company-heading p {
        font-size:20px;
    }
    .client-dashboard .onboarding-panel {
        padding:48px;
    }
    .client-dashboard .onboarding-panel h2 {
        font-size:36px;
    }
    .client-dashboard .onboarding-panel p {
        font-size:23px;
        margin-top:14px;
        margin-bottom:28px;
    }
    .client-dashboard .onboarding-panel .button {
        font-size:22px;
        padding:17px 24px;
        min-height:64px;
    }
    .client-dashboard .dashboard-details {
        display:block;
        padding:0;
        border-bottom:0;
        border-top:1px solid var(--border);
        margin-top:32px;
    }
    .client-dashboard .dashboard-details>div {
        display:grid;
        grid-template-columns:260px 1fr;
        padding:20px 0;
    }
    .client-dashboard .dashboard-details>div+div {
        border-top:1px solid var(--border);
    }
    .client-dashboard .dashboard-details dt {
        font-size:18px;
        margin:0;
        font-weight:550;
    }
    .client-dashboard .dashboard-details dd {
        font-size:18px;
        font-weight:400;
    }
    .client-dashboard .roadmap-note {
        font-size:17px;
        margin-top:32px;
    }
}
@media(min-width:701px) {
    .admin-clients .empty-state {
        min-height:425px;
    }
    .admin-clients .empty-icon {
        background:transparent;
        border-radius:0;
        color:#758895;
    }
    .admin-clients .empty-icon svg {
        width:64px;
        height:64px;
        stroke-width:1.2;
    }
    .admin-clients .table-footer {
        font-size:14px;
    }
}

/* Place the original logo directly on the white sign-in area and full-width header. */
.brand-logo {
    display:inline-flex;
    align-items:center;
    justify-content:center;
    line-height:0;
}
.brand-logo img {
    display:block;
    width:180px;
    height:auto;
    max-width:100%;
}
.auth-brand {
    margin-bottom:34px;
}
.panel-brand {
    width:var(--sidebar);
    height:100%;
    flex-shrink:0;
    display:flex;
    align-items:center;
    justify-content:center;
}
.panel-brand .brand-logo img {
    width:124px;
}
.guest-footer {
    display:flex;
    align-items:center;
    gap:9px;
}
.guest-footer:before {
    content:"";
    width:7px;
    height:7px;
    border-radius:50%;
    background:var(--brand-coral);
}
@media(max-width:700px) {
    :root {
        --header-height:68px;
    }
    .guest-brand {
        display:none;
    }
    .guest-main {
        padding-top:32px;
    }
    .auth-brand {
        margin-bottom:28px;
    }
    .auth-brand .brand-logo img {
        width:140px;
    }
    .topbar {
        padding:0 16px;
        justify-content:flex-start;
        gap:10px;
    }
    .panel-brand {
        width:auto;
    }
    .panel-brand .brand-logo img {
        width:96px;
    }
    .sidebar {
        padding-top:64px;
    }
    .close-nav {
        top:12px;
    }
}
@media(max-width:420px) {
    .viewer-name {
        position:absolute;
        width:1px;
        height:1px;
        padding:0;
        margin:-1px;
        overflow:hidden;
        clip:rect(0,0,0,0);
        white-space:nowrap;
        border:0;
    }
}