@import '_content/Cosmyre.Photon/Cosmyre.Photon.9g19iz4mti.bundle.scp.css';

/* /Components/Layout/AuthLayout.razor.rz.scp.css */
/* Cosmyre's AuthLayout.razor.css: a black sky (the logo's own ground) with twinkling stars. The
   colours are the --nexus-auth-* host tokens in app.css. */
.auth-shell[b-j48q336nzx] {
    position: relative;
    overflow: hidden;
    min-height: 100vh;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 1.75rem;
    padding: 2rem 1rem;
    background: var(--nexus-auth-sky);
    /* data-bs-theme=dark swaps the variables, but only <body> sets the base text colour. */
    color: var(--bs-body-color);
}

.auth-stars[b-j48q336nzx] {
    position: absolute;
    inset: 0;
    pointer-events: none;
}

.auth-star[b-j48q336nzx] {
    position: absolute;
    border-radius: 50%;
    background: var(--nexus-auth-star);
    opacity: .15;
    animation: auth-twinkle-b-j48q336nzx 3s ease-in-out infinite;
}

@keyframes auth-twinkle-b-j48q336nzx {
    0%, 100% {
        opacity: .15;
        transform: scale(1);
    }

    50% {
        opacity: .9;
        transform: scale(1.4);
    }
}

.auth-brand[b-j48q336nzx] {
    position: relative;
    z-index: 1;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: .9rem;
}

.auth-mark[b-j48q336nzx] {
    width: 5.5rem;
    height: auto;
    filter: drop-shadow(0 0 1.5rem var(--nexus-auth-glow));
}

.auth-wordmark[b-j48q336nzx] {
    font-size: 1.6rem;
    font-weight: 600;
    letter-spacing: .32em;
    color: var(--nexus-auth-ink);
    /* The letter-spacing trails the last letter; pull it back so the word centres. */
    margin-right: -.32em;
}

.auth-wordmark-nexus[b-j48q336nzx] {
    color: var(--nexus-brand-accent);
    font-weight: 700;
}

.auth-body[b-j48q336nzx] {
    position: relative;
    z-index: 1;
    width: 100%;
    max-width: 26rem;
}

.auth-body:has(.auth-panel-wide)[b-j48q336nzx] {
    max-width: 44rem;
}

@media (prefers-reduced-motion: reduce) {
    .auth-star[b-j48q336nzx] {
        animation: none;
    }
}

#blazor-error-ui[b-j48q336nzx] {
    background: var(--bs-warning-bg-subtle);
    color: var(--bs-warning-text-emphasis);
    bottom: 0;
    box-shadow: 0 -1px 2px rgba(0, 0, 0, 0.2);
    box-sizing: border-box;
    display: none;
    left: 0;
    padding: 0.6rem 1.25rem 0.7rem 1.25rem;
    position: fixed;
    width: 100%;
    z-index: 1000;
}

    #blazor-error-ui .dismiss[b-j48q336nzx] {
        cursor: pointer;
        position: absolute;
        right: 0.75rem;
        top: 0.5rem;
    }
/* /Components/Layout/MainLayout.razor.rz.scp.css */
/* Cosmyre's MainLayout.razor.css, adapted: same geometry (3.75rem header, 250px sidebar, 3.6rem
   rail), the sidebar's navy from Nexus's host tokens in app.css, no case bubble / navigator dock. */
.page[b-5zo3vsqoft] {
    position: relative;
    display: flex;
    flex-direction: column;
}

main[b-5zo3vsqoft] {
    flex: 1;
    min-width: 0;
    display: flex;
    flex-direction: column;
    /* Containing block for .nav-throb below. */
    position: relative;
}

/* The navigation throbber: inset by the header so the header and the user menu stay live. */
.nav-throb[b-5zo3vsqoft] {
    display: none;
    position: absolute;
    inset: 3.75rem 0 0 0;
    z-index: 1010;
    align-items: center;
    justify-content: center;
    background: color-mix(in srgb, var(--cosmyre-page-bg) 72%, transparent);
    backdrop-filter: blur(1px);
    pointer-events: none;
}

/* Raised by photon's tabs module; keyed on <html> because that element survives enhanced navigation. */
:root.nav-busy .nav-throb[b-5zo3vsqoft] {
    display: flex;
}

/* Three rows: the brand/toggle cell, the scrolling menu, the version foot. */
.sidebar[b-5zo3vsqoft] {
    background: linear-gradient(180deg, var(--nexus-sidebar-top) 0%, var(--nexus-sidebar-bottom) 100%);
    overflow: hidden;
    display: none;
    grid-template-rows: 3.75rem 1fr auto;
}

/* The hidden checkbox in the markup drives the sidebar: an overlay on a phone, the rail on a desktop. */
.sidebar-toggle-state[b-5zo3vsqoft] {
    display: none;
}

.sidebar-toggle-state:checked ~ .sidebar[b-5zo3vsqoft] {
    display: grid;
    position: fixed;
    top: 0;
    left: 0;
    width: 250px;
    height: 100vh;
    z-index: 1030;
    box-shadow: 0 0 30px rgba(0, 0, 0, .4);
}

/* ---- Top app header: window chrome left, the area name centred, the user menu right. Its height
   is fixed at 3.75rem: Photon's .page-fill measures against it. */
.app-header[b-5zo3vsqoft] {
    position: sticky;
    top: 0;
    z-index: 1020;
    display: flex;
    align-items: center;
    justify-content: flex-start;
    gap: 1rem;
    height: 3.75rem;
    padding: 0 1.25rem;
    background-color: var(--bs-body-bg);
    border-bottom: 1px solid var(--bs-border-color);
}

.app-header-left[b-5zo3vsqoft],
.app-header-right[b-5zo3vsqoft] {
    display: flex;
    align-items: center;
    gap: .75rem;
    min-width: 0;
    flex: 0 0 auto;
}

.app-header-right[b-5zo3vsqoft] {
    margin-left: auto;
}

.app-header-title[b-5zo3vsqoft] {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: .5rem;
    flex: 1 1 auto;
    min-width: 0;
}

/* The area name — the header's subject: a flat label marked by the tab rail's accent keyline
   (Cosmyre's case bubble, which names a case there). */
.area-bubble[b-5zo3vsqoft] {
    display: inline-flex;
    align-items: center;
    gap: .5rem;
    flex: 0 1 auto;
    min-width: 0;
    padding: .3rem .15rem;
    border-bottom: 2px solid var(--cosmyre-tab-accent);
    color: inherit;
    font-size: .9rem;
    line-height: 1.2;
}

.area-bubble-name[b-5zo3vsqoft] {
    font-weight: 600;
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.area-bubble[b-5zo3vsqoft]  .area-bubble-icon {
    color: var(--cosmyre-tab-accent);
    flex-shrink: 0;
}

/* The quiet half of the crumb: which tab of the area. */
.app-header-section[b-5zo3vsqoft] {
    flex: 0 0 auto;
    font-size: .9rem;
    color: var(--bs-secondary-color);
    white-space: nowrap;
}

.app-header-title[b-5zo3vsqoft]  .app-header-crumb {
    flex: 0 0 auto;
    font-size: .7rem;
    color: var(--bs-tertiary-color);
}

@media (max-width: 900px) {
    .app-header-section[b-5zo3vsqoft],
    .app-header-title[b-5zo3vsqoft]  .app-header-crumb {
        display: none;
    }
}

.header-icon-btn[b-5zo3vsqoft] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 2.25rem;
    height: 2.25rem;
    border-radius: .5rem;
    cursor: pointer;
    color: var(--bs-secondary-color);
    font-size: 1.15rem;
}

.header-icon-btn:hover[b-5zo3vsqoft] {
    background-color: var(--bs-secondary-bg);
}

.back-btn[b-5zo3vsqoft] {
    display: inline-flex;
    align-items: center;
    gap: .25rem;
    white-space: nowrap;
}

.content[b-5zo3vsqoft] {
    flex: 1;
    padding-top: 1.1rem;
}

@media (min-width: 641px) {
    .page[b-5zo3vsqoft] {
        flex-direction: row;
    }

    .sidebar[b-5zo3vsqoft] {
        display: grid;
        width: 250px;
        height: 100vh;
        position: sticky;
        top: 0;
        flex: 0 0 250px;
    }

    /* On wide screens "checked" means the icon rail, never the phone overlay. */
    .sidebar-toggle-state:checked ~ .sidebar[b-5zo3vsqoft] {
        display: grid;
        position: sticky;
        top: 0;
        width: 3.6rem;
        flex: 0 0 3.6rem;
        height: 100vh;
        z-index: auto;
        box-shadow: none;
    }

    .sidebar-toggle-state:checked ~ .sidebar[b-5zo3vsqoft]  .brand-link,
    .sidebar-toggle-state:checked ~ .sidebar[b-5zo3vsqoft]  .section-link span,
    .sidebar-toggle-state:checked ~ .sidebar[b-5zo3vsqoft]  .section-expander,
    .sidebar-toggle-state:checked ~ .sidebar[b-5zo3vsqoft]  .subsection-menu,
    .sidebar-toggle-state:checked ~ .sidebar[b-5zo3vsqoft]  .sidebar-version {
        display: none;
    }

    /* Collapsed, the rail's top cell is the toggle alone: in the one state where space is scarcest
       the control that gets you out of it beats the mark, which returns when you expand. */
    .sidebar-toggle-state:checked ~ .sidebar[b-5zo3vsqoft]  .sidebar-brand {
        padding: 0;
        justify-content: center;
    }

    .sidebar-toggle-state:checked ~ .sidebar[b-5zo3vsqoft]  .sidebar-menu-toggle {
        margin-left: 0;
        width: 2.4rem;
        height: 2.4rem;
    }

    .sidebar-toggle-state:checked ~ .sidebar[b-5zo3vsqoft]  .sidebar-nav {
        padding: 1rem .3rem;
    }

    .sidebar-toggle-state:checked ~ .sidebar[b-5zo3vsqoft]  .section-link {
        justify-content: center;
        padding: .55rem 0;
    }

    /* The sidebar is permanent from here up, so the header copy of its toggle is redundant. */
    .header-menu-fallback[b-5zo3vsqoft] {
        display: none;
    }
}

#blazor-error-ui[b-5zo3vsqoft] {
    background: var(--bs-warning-bg-subtle);
    color: var(--bs-warning-text-emphasis);
    bottom: 0;
    box-shadow: 0 -1px 2px rgba(0, 0, 0, 0.2);
    box-sizing: border-box;
    display: none;
    left: 0;
    padding: 0.6rem 1.25rem 0.7rem 1.25rem;
    position: fixed;
    width: 100%;
    z-index: 1000;
}

    #blazor-error-ui .dismiss[b-5zo3vsqoft] {
        cursor: pointer;
        position: absolute;
        right: 0.75rem;
        top: 0.5rem;
    }
/* /Components/Layout/NavMenu.razor.rz.scp.css */
/* Cosmyre's NavMenu.razor.css, adapted. The navy, the inks and the glow are Nexus host tokens
   (app.css), copied from Cosmyre's sidebar so the two products look the same. */
.sidebar-glow[b-jab6crem5g] {
    position: absolute;
    top: -40px;
    left: -30px;
    width: 180px;
    height: 180px;
    border-radius: 50%;
    background: radial-gradient(circle at 40% 40%, var(--nexus-sidebar-glow), transparent 70%);
    filter: blur(6px);
    pointer-events: none;
    z-index: 0;
}

.moon-defs[b-jab6crem5g] {
    position: absolute;
}

.moon-stop-top[b-jab6crem5g] {
    stop-color: var(--nexus-moon-top);
}

.moon-stop-bottom[b-jab6crem5g] {
    stop-color: var(--nexus-moon-bottom);
}

.sidebar-brand[b-jab6crem5g] {
    position: relative;
    z-index: 1;
    height: 3.75rem;
    display: flex;
    align-items: center;
    padding: 0 1rem 0 1.1rem;
    background-color: var(--nexus-sidebar-brand-bg);
    border-bottom: 1px solid var(--nexus-sidebar-rule);
}

.brand-link[b-jab6crem5g] {
    display: flex;
    align-items: center;
    gap: .55rem;
    min-width: 0;
    color: var(--nexus-sidebar-ink-strong);
    text-decoration: none;
    white-space: nowrap;
}

.brand-mark[b-jab6crem5g] {
    height: 1.75rem;
    width: auto;
    flex-shrink: 0;
}

.brand-name[b-jab6crem5g] {
    font-size: 1.02rem;
    font-weight: 600;
    letter-spacing: .02em;
}

/* NEXUS in the crescent's violet, lifted for the navy ground. */
.brand-nexus[b-jab6crem5g] {
    color: var(--nexus-brand-accent);
    font-weight: 700;
}

.sidebar-menu-toggle[b-jab6crem5g] {
    margin-left: auto;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    width: 2rem;
    height: 2rem;
    border-radius: .4rem;
    cursor: pointer;
    color: var(--nexus-moon-bottom);
}

/* ::deep: the svg comes from PhIcon and carries its scope; fill beats PhIcon's currentColor. */
.sidebar-menu-toggle[b-jab6crem5g]  svg {
    width: 1.35rem;
    height: 1.35rem;
    fill: url(#nexus-moon-grad) var(--nexus-moon-bottom);
}

.sidebar-menu-toggle:hover[b-jab6crem5g] {
    background: var(--nexus-sidebar-hover);
}

.sidebar-nav[b-jab6crem5g] {
    position: relative;
    z-index: 1;
    padding: 1rem .75rem;
    min-height: 0;
    overflow-y: auto;
}

.sidebar-foot[b-jab6crem5g] {
    position: relative;
    z-index: 1;
    padding: .6rem 1.1rem .8rem;
    border-top: 1px solid var(--nexus-sidebar-rule);
    font-size: .72rem;
    letter-spacing: .03em;
    color: var(--nexus-sidebar-ink-sub);
    white-space: nowrap;
}

.section-menu[b-jab6crem5g] {
    list-style: none;
    margin: 0;
    padding: 0;
}

/* The area row: its link, the expander beside it, the tab list wrapping underneath. */
.section-menu li[b-jab6crem5g] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    margin-bottom: .25rem;
}

.section-menu > li > .subsection-menu[b-jab6crem5g] {
    flex: 1 0 100%;
}

.section-link[b-jab6crem5g] {
    flex: 1 1 auto;
    min-width: 0;
    display: flex;
    align-items: center;
    gap: .6rem;
    padding: .55rem .75rem;
    color: var(--nexus-sidebar-ink);
    text-decoration: none;
    border-radius: 6px;
    font-size: .92rem;
}

.section-link[b-jab6crem5g]  .section-icon {
    font-size: 1.05rem;
    flex-shrink: 0;
    color: inherit;
}

.section-link:hover[b-jab6crem5g] {
    background-color: var(--nexus-sidebar-hover);
    color: var(--nexus-sidebar-ink-strong);
}

.section-link.active[b-jab6crem5g] {
    background-color: var(--nexus-sidebar-active);
    color: var(--nexus-sidebar-ink-strong);
    box-shadow: inset 2px 0 0 var(--cosmyre-accent);
}

/* The expander: quiet until the row is hovered. */
.section-expander[b-jab6crem5g] {
    flex: 0 0 auto;
    display: inline-flex;
    align-items: center;
    padding: .35rem .5rem;
    border: 0;
    border-radius: 6px;
    background: none;
    color: var(--nexus-sidebar-ink);
    opacity: 0;
    cursor: pointer;
    transition: transform .15s, opacity .15s;
}

.section-expander[b-jab6crem5g]  .bi {
    color: inherit;
}

.section-menu li:hover > .section-expander[b-jab6crem5g],
.section-expander:focus-visible[b-jab6crem5g] {
    opacity: 1;
}

.section-expander:hover[b-jab6crem5g] {
    color: var(--nexus-sidebar-ink-strong);
    background-color: var(--nexus-sidebar-hover);
}

.section-menu li:not(.nav-collapsed) > .section-expander[b-jab6crem5g] {
    opacity: .75;
}

.nav-collapsed > .section-expander[b-jab6crem5g] {
    transform: rotate(-90deg);
}

.nav-collapsed > .subsection-menu[b-jab6crem5g] {
    display: none;
}

/* ---- An area's tabs, indented under it on a faint rail ---- */
.subsection-menu[b-jab6crem5g] {
    position: relative;
    list-style: none;
    margin: .2rem 0 .45rem;
    padding: 0 0 0 1.65rem;
}

.subsection-menu[b-jab6crem5g]::before {
    content: "";
    position: absolute;
    left: .95rem;
    top: .15rem;
    bottom: .15rem;
    width: 1px;
    background: var(--nexus-sidebar-rule-strong);
}

.subsection-menu li[b-jab6crem5g] {
    margin-bottom: .1rem;
}

.subsection-link[b-jab6crem5g] {
    flex: 1 1 auto;
    min-width: 0;
    display: flex;
    align-items: center;
    gap: .5rem;
    padding: .32rem .6rem;
    color: var(--nexus-sidebar-ink-sub);
    text-decoration: none;
    border-radius: 5px;
    font-size: .82rem;
}

.subsection-link[b-jab6crem5g]  .subsection-icon {
    font-size: .9rem;
    flex-shrink: 0;
    color: inherit;
}

.subsection-link:hover[b-jab6crem5g] {
    background-color: var(--nexus-sidebar-hover);
    color: var(--nexus-sidebar-ink-strong);
}

.subsection-link.active[b-jab6crem5g] {
    background-color: var(--nexus-sidebar-active-sub);
    color: var(--nexus-sidebar-ink-strong);
    box-shadow: inset 2px 0 0 var(--cosmyre-accent);
}