@import '_content/Cordis.Studio.CodeEditor/Cordis.Studio.CodeEditor.kaxumgwj2f.bundle.scp.css';
@import '_content/Cordis.Studio.Diagrams/Cordis.Studio.Diagrams.b2r3aemk7x.bundle.scp.css';
@import '_content/Cordis.Studio.Documents/Cordis.Studio.Documents.ysl6e30rbo.bundle.scp.css';
@import '_content/Cordis.Studio.Manual/Cordis.Studio.Manual.5p16l5fc5a.bundle.scp.css';
@import '_content/Cordis.Studio.Specify/Cordis.Studio.Specify.bebqrdh3l8.bundle.scp.css';
@import '_content/Cordis.Studio.Workbench/Cordis.Studio.Workbench.bezwr56n2f.bundle.scp.css';
@import '_content/Cordis.UI.Components/Cordis.UI.Components.mk9zo4t134.bundle.scp.css';

/* /Components/Account/AccountDialog.razor.rz.scp.css */
/* The in-IDE account dialog (#1294). Layout only; every colour is a design-system token. */
.cordis-account[b-80bmbneze7] {
    display: flex;
    flex-direction: column;
    gap: var(--cordis-space-4);
}

.cordis-account__who[b-80bmbneze7] {
    display: flex;
    align-items: center;
    gap: var(--cordis-space-3);
}

.cordis-account__email[b-80bmbneze7] {
    font-weight: 600;
    color: var(--cordis-text-strong);
    overflow-wrap: anywhere;
}

.cordis-account__sub[b-80bmbneze7],
.cordis-account__fine[b-80bmbneze7] {
    font-size: var(--cordis-fs-sm);
    color: var(--cordis-text-muted);
    margin: 0;
}

.cordis-account__section[b-80bmbneze7] {
    display: flex;
    flex-direction: column;
    gap: var(--cordis-space-2h);
    padding-top: var(--cordis-space-3h);
    border-top: 1px solid var(--cordis-border);
}

.cordis-account__heading[b-80bmbneze7] {
    margin: 0;
    font-size: var(--cordis-fs-body);
    font-weight: 600;
    color: var(--cordis-text-strong);
}

.cordis-account__controls[b-80bmbneze7] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: var(--cordis-space-3);
}
/* /Components/Account/Shared/AccountLayout.razor.rz.scp.css */
/* The unauthenticated Account surface, themed to match the IDE shell. It uses the same
   theme-independent --cordis-* chrome tokens as the title bar / activity rail (app.css), so the
   sign-in screen reads as part of the Cordis Studio product rather than a generic login.
   (The Login/Register page content renders inside @Body — a descendant of .auth-card — so its
   form elements are styled here via ::deep.) */

.auth-shell[b-2jdwc1ojs5] {
    min-height: 100vh;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: var(--cordis-space-6);
    font-family: var(--cordis-font);
    /* The modeler's dark chrome: a quiet gradient from the activity-rail black to the chrome grey. */
    background:
        radial-gradient(1200px 600px at 50% -10%, rgba(31, 156, 216, 0.10), transparent 60%),
        linear-gradient(180deg, var(--cordis-rail-bg) 0%, var(--cordis-chrome-bg) 100%);
}

.auth-card[b-2jdwc1ojs5] {
    width: 100%;
    max-width: 384px;
    background: var(--cordis-chrome-bg);
    border: 1px solid var(--cordis-chrome-border);
    border-radius: var(--cordis-radius);
    box-shadow: 0 18px 48px rgba(0, 0, 0, 0.45);
    padding: var(--cordis-space-6) var(--cordis-space-6) var(--cordis-space-5);
}

/* The privacy page (#1752) is a statement to read, not a form to fill in, so its card takes a reading
   width instead of the form width. */
.auth-card:has(.auth-statement)[b-2jdwc1ojs5] {
    max-width: 720px;
}

/* Just the lock-up since #1292 -- no typeset name beside it -- so this is only centring and the
   space below it. line-height: 0 keeps the inline image from adding a descender gap under the card's
   top padding. */
.auth-brand[b-2jdwc1ojs5] {
    display: flex;
    justify-content: center;
    margin-bottom: var(--cordis-space-5);
    line-height: 0;
}

/* ---- Page content (rendered into @Body) -------------------------------- */

.auth-card[b-2jdwc1ojs5]  .auth-title {
    font-size: var(--cordis-fs-h2);
    font-weight: 600;
    margin: 0 0 var(--cordis-space-5);
    text-align: center;
    color: var(--cordis-chrome-active);
}

/* <FocusOnNavigate Selector="h1"> programmatically focuses this heading on load (so screen
   readers announce the page). It's not an interactive control, so hide the focus ring the
   browser would otherwise draw as a full-width box around the title. */
.auth-card[b-2jdwc1ojs5]  .auth-title:focus,
.auth-card[b-2jdwc1ojs5]  .auth-title:focus-visible {
    outline: none;
}

.auth-card[b-2jdwc1ojs5]  .auth-input {
    width: 100%;
    box-sizing: border-box;
    padding: var(--cordis-space-2) var(--cordis-space-3);
    background: var(--cordis-rail-bg);
    border: 1px solid var(--cordis-chrome-border);
    border-radius: var(--cordis-radius-sm);
    color: var(--cordis-chrome-active);
    font-family: inherit;
    font-size: var(--cordis-fs-h3);
    transition: border-color var(--cordis-dur-fast) ease, box-shadow var(--cordis-dur-fast) ease;
}

.auth-card[b-2jdwc1ojs5]  .auth-input::placeholder {
    color: var(--cordis-chrome-fg-dim);
}

.auth-card[b-2jdwc1ojs5]  .auth-input:focus {
    outline: none;
    border-color: var(--cordis-blue-500);
    box-shadow: 0 0 0 3px rgba(31, 156, 216, 0.25);
}

.auth-card[b-2jdwc1ojs5]  .auth-submit {
    width: 100%;
    margin-top: var(--cordis-space-4);
    padding: var(--cordis-space-2);
    border: none;
    border-radius: var(--cordis-radius-sm);
    background: var(--cordis-blue-500);
    color: #fff;
    font-family: inherit;
    font-size: var(--cordis-fs-h3);
    font-weight: 600;
    cursor: pointer;
    transition: background var(--cordis-dur-fast) ease;
}

.auth-card[b-2jdwc1ojs5]  .auth-submit:hover {
    background: var(--cordis-blue-700);
}

.auth-card[b-2jdwc1ojs5]  .auth-sso {
    width: 100%;
    padding: var(--cordis-space-2);
    border: 1px solid var(--cordis-chrome-border);
    border-radius: var(--cordis-radius-sm);
    background: transparent;
    color: var(--cordis-chrome-fg);
    font-family: inherit;
    font-size: var(--cordis-fs-h3);
    font-weight: 600;
    cursor: pointer;
    transition: background var(--cordis-dur-fast) ease, border-color var(--cordis-dur-fast) ease;
}

.auth-card[b-2jdwc1ojs5]  .auth-sso:hover {
    background: var(--cordis-chrome-hover);
    border-color: var(--cordis-chrome-fg-dim);
    color: var(--cordis-chrome-active);
}

.auth-card[b-2jdwc1ojs5]  .auth-error {
    background: rgba(226, 7, 23, 0.14);
    border: 1px solid rgba(226, 7, 23, 0.4);
    color: #ff8a82;
    padding: var(--cordis-space-2) var(--cordis-space-3);
    border-radius: var(--cordis-radius-sm);
    font-size: var(--cordis-fs-body);
    margin-bottom: var(--cordis-space-4);
}

.auth-card[b-2jdwc1ojs5]  .auth-divider {
    display: flex;
    align-items: center;
    gap: var(--cordis-space-3);
    margin: var(--cordis-space-4) 0;
    color: var(--cordis-chrome-fg-dim);
    font-size: var(--cordis-fs-xs);
    text-transform: uppercase;
    letter-spacing: var(--cordis-ls-caption);
}

.auth-card[b-2jdwc1ojs5]  .auth-divider::before,
.auth-card[b-2jdwc1ojs5]  .auth-divider::after {
    content: "";
    flex: 1;
    height: 1px;
    background: var(--cordis-chrome-border);
}

.auth-card[b-2jdwc1ojs5]  .auth-alt {
    margin: var(--cordis-space-5) 0 0;
    text-align: center;
    font-size: var(--cordis-fs-body);
    color: var(--cordis-chrome-fg-dim);
}

.auth-card[b-2jdwc1ojs5]  .auth-alt a {
    color: var(--cordis-blue-300);
    text-decoration: none;
    font-weight: 600;
}

.auth-card[b-2jdwc1ojs5]  .auth-alt a:hover {
    text-decoration: underline;
}

/* ---- Body text ---------------------------------------------------------- */

/* Explanatory copy on the confirmation, access-denied and Connect a PC pages. */
.auth-card[b-2jdwc1ojs5]  .auth-prose {
    margin: 0 0 var(--cordis-space-4);
    font-size: var(--cordis-fs-body);
    line-height: 1.5;
    color: var(--cordis-chrome-fg);
}

.auth-card[b-2jdwc1ojs5]  .auth-prose--dim {
    color: var(--cordis-chrome-fg-dim);
}

.auth-card[b-2jdwc1ojs5]  .auth-prose a {
    color: var(--cordis-blue-300);
    text-decoration: none;
    font-weight: 600;
}

.auth-card[b-2jdwc1ojs5]  .auth-prose a:hover {
    text-decoration: underline;
}

.auth-card[b-2jdwc1ojs5]  .auth-sso-form {
    margin-top: var(--cordis-space-2);
}

/* ---- Your account (issue #965) ----------------------------------------- */

/* Section heading between the card's stacked forms. Quieter than .auth-title (which is the page's one
   h1) and left-aligned, because it labels the block under it rather than the card. */
.auth-card[b-2jdwc1ojs5]  .auth-section {
    margin: var(--cordis-space-6) 0 var(--cordis-space-1);
    padding-top: var(--cordis-space-4);
    border-top: 1px solid var(--cordis-chrome-border);
    font-size: var(--cordis-fs-h3);
    font-weight: 600;
    color: var(--cordis-chrome-active);
}

/* Numbered steps, each one title, one button and one line of detail (Connect a PC, issue #1338). The
   number is drawn by a counter, so the list stays a plain <ol> and renumbers itself when the server has no
   installer to offer and the first step is left out. */
.auth-card[b-2jdwc1ojs5]  .auth-steps {
    list-style: none;
    counter-reset: auth-step;
    margin: var(--cordis-space-4) 0 0;
    padding: 0;
    display: flex;
    flex-direction: column;
    gap: var(--cordis-space-4);
}

.auth-card[b-2jdwc1ojs5]  .auth-step {
    counter-increment: auth-step;
    position: relative;
    padding-left: var(--cordis-space-6);
    display: flex;
    flex-direction: column;
    gap: var(--cordis-space-2);
}

.auth-card[b-2jdwc1ojs5]  .auth-step::before {
    content: counter(auth-step);
    position: absolute;
    left: 0;
    top: 0;
    width: 1.45rem;
    height: 1.45rem;
    border-radius: 50%;
    background: var(--cordis-rail-bg);
    border: 1px solid var(--cordis-chrome-border);
    color: var(--cordis-chrome-active);
    font-size: var(--cordis-fs-xs);
    font-weight: 600;
    display: flex;
    align-items: center;
    justify-content: center;
}

.auth-card[b-2jdwc1ojs5]  .auth-step__title {
    font-size: var(--cordis-fs-h3);
    font-weight: 600;
    line-height: 1.45rem;
    color: var(--cordis-chrome-active);
}

.auth-card[b-2jdwc1ojs5]  .auth-step__hint {
    font-size: var(--cordis-fs-xs);
    color: var(--cordis-chrome-fg-dim);
}

/* A step's button is a link (a download, a cordis-connect: link), dressed as the account pages' buttons. */
.auth-card[b-2jdwc1ojs5]  .auth-step .auth-submit,
.auth-card[b-2jdwc1ojs5]  .auth-step .auth-sso {
    display: block;
    box-sizing: border-box;
    margin-top: 0;
    text-align: center;
    text-decoration: none;
}

/* The counterpart of .auth-error, for a change that went through. Green rather than red and role=status
   rather than role=alert, so a screen reader announces it without interrupting. */
.auth-card[b-2jdwc1ojs5]  .auth-success {
    background: rgba(46, 160, 67, 0.14);
    border: 1px solid rgba(46, 160, 67, 0.4);
    color: #7ee2a8;
    padding: var(--cordis-space-2) var(--cordis-space-3);
    border-radius: var(--cordis-radius-sm);
    font-size: var(--cordis-fs-body);
    margin-bottom: var(--cordis-space-4);
}

.auth-card[b-2jdwc1ojs5]  .auth-list {
    list-style: none;
    margin: var(--cordis-space-4) 0 0;
    padding: 0;
    display: flex;
    flex-direction: column;
    gap: var(--cordis-space-2);
}

.auth-card[b-2jdwc1ojs5]  .auth-listitem {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: var(--cordis-space-3);
    padding: var(--cordis-space-2) var(--cordis-space-3);
    background: var(--cordis-rail-bg);
    border: 1px solid var(--cordis-chrome-border);
    border-radius: var(--cordis-radius-sm);
}

.auth-card[b-2jdwc1ojs5]  .auth-listitem__name {
    display: block;
    font-size: var(--cordis-fs-body);
    color: var(--cordis-chrome-active);
}

.auth-card[b-2jdwc1ojs5]  .auth-listitem__sub {
    display: block;
    font-size: var(--cordis-fs-xs);
    color: var(--cordis-chrome-fg-dim);
}

/* A row action, not a page action: quiet until hovered, so removing a credential is never the thing the eye
   lands on first. .auth-danger is the destructive one and turns red on hover; .auth-rowaction (issue #1323:
   Rename, Save, Cancel on a paired PC) is the same button without the red, and is also drawn on a link. */
.auth-card[b-2jdwc1ojs5]  .auth-danger,
.auth-card[b-2jdwc1ojs5]  .auth-rowaction {
    display: inline-block;
    text-decoration: none;
    line-height: normal;
    padding: var(--cordis-space-1) var(--cordis-space-2);
    border: 1px solid var(--cordis-chrome-border);
    border-radius: var(--cordis-radius-sm);
    background: transparent;
    color: var(--cordis-chrome-fg-dim);
    font-family: inherit;
    font-size: var(--cordis-fs-sm);
    cursor: pointer;
    transition: background var(--cordis-dur-fast) ease, border-color var(--cordis-dur-fast) ease, color var(--cordis-dur-fast) ease;
}

.auth-card[b-2jdwc1ojs5]  .auth-danger:hover {
    background: rgba(226, 7, 23, 0.14);
    border-color: rgba(226, 7, 23, 0.4);
    color: #ff8a82;
}

.auth-card[b-2jdwc1ojs5]  .auth-rowaction:hover {
    background: var(--cordis-chrome-hover);
    color: var(--cordis-chrome-active);
}

/* A row's actions side by side, Remove last, so the destructive one keeps its place at the right edge. */
.auth-card[b-2jdwc1ojs5]  .auth-listitem__actions {
    display: flex;
    align-items: center;
    gap: var(--cordis-space-2);
    flex-shrink: 0;
}

/* The row being renamed (issue #1323): the name field takes the row's width, its hint and actions under it. */
.auth-card[b-2jdwc1ojs5]  .auth-rename {
    display: flex;
    flex-direction: column;
    gap: var(--cordis-space-2);
    width: 100%;
}

.auth-card[b-2jdwc1ojs5]  .auth-rename__actions {
    display: flex;
    justify-content: flex-end;
    gap: var(--cordis-space-2);
}

/* The correlation id on the error page (issue #1063). Selectable, monospaced and boxed, because its
   entire job is to be read aloud or copied into a message accurately — a trace id in the body face
   invites a transcription error in the one string that has to be exact. */
.auth-card[b-2jdwc1ojs5]  .auth-ref {
    margin: 0 0 var(--cordis-space-5);
    padding: var(--cordis-space-2) var(--cordis-space-3);
    background: var(--cordis-rail-bg);
    border: 1px solid var(--cordis-chrome-border);
    border-radius: var(--cordis-radius-sm);
    text-align: center;
    overflow-wrap: anywhere;
}

.auth-card[b-2jdwc1ojs5]  .auth-ref code {
    font-family: var(--cordis-font-mono);
    font-size: var(--cordis-fs-sm);
    color: var(--cordis-chrome-active);
    user-select: all;
}

/* /Components/Admin/AccountInviteDialog.razor.rz.scp.css */
/* The invite dialog's one rule (issue #1185). Everything with a visual identity — the sheet, the fields,
   the inputs, the footer — is a design-system component; the sheet owns the spacing between them. What is
   left is this paragraph, which is copy rather than a control and so has no primitive of its own.

   Tokens only: an undefined var() discards the whole declaration silently, so check
   external/cordis-design-system/css/tokens.css before inventing a name. */
.invite__hint[b-8u5yhdzwr3] {
    margin: var(--cordis-space-2) 0 0;
    color: var(--cordis-text-muted);
    font-size: var(--cordis-fs-sm);
    line-height: 1.5;
}
/* /Components/Admin/Accounts.razor.rz.scp.css */
/* The accounts console's own few rules (issues #860, #1362). Everything with a visual identity — the cards,
   the table, the pills, the banners, the timeline, the pop-up — is a design-system component; what is left
   here is layout between them, which is the only thing a page is allowed to own.

   Tokens only, throughout — an undefined var() discards the whole declaration silently, so check
   external/cordis-design-system/css/tokens.css before inventing a name. */

.accounts[b-j6ert2ruqa] {
    display: flex;
    flex-direction: column;
    gap: var(--cordis-space-4);
    min-width: 0;
    /* The body's two columns ask THIS box how wide it is: a container cannot query itself. */
    container: accounts / inline-size;
}

/* On the portal the console IS the page, and it takes exactly the height the content area gives it, so the
   list and the history can each scroll on their own. The page header keeps its own spacing. */
.accounts--page[b-j6ert2ruqa] {
    flex: 1;
    min-height: 0;
    gap: 0;
}

.accounts--page .accounts__notices[b-j6ert2ruqa] {
    margin-bottom: var(--cordis-space-4);
}

.accounts__notices[b-j6ert2ruqa] {
    display: flex;
    flex-direction: column;
    gap: var(--cordis-space-3);
}

/* The list, then the history in a column of its own. A container query rather than a media query: the
   Settings pane is narrower than the window it sits in, and there the two stack. */
.accounts__body[b-j6ert2ruqa] {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    gap: var(--cordis-space-4);
    align-items: start;
    min-width: 0;
}

@container accounts (min-width: 60rem) {
    .accounts__body[b-j6ert2ruqa] {
        grid-template-columns: minmax(0, 1fr) minmax(18rem, 24rem);
    }
}

/* On the page the body fills what is left and each column scrolls itself: a card is as tall as what it
   holds, and no taller than the page, past which it scrolls. The container sizes only the inline axis, so
   the block size here is still the grid's to give. */
.accounts--page .accounts__body[b-j6ert2ruqa] {
    flex: 1;
    min-height: 0;
    grid-auto-rows: minmax(0, 1fr);
}

.accounts--page[b-j6ert2ruqa]  .accounts__table,
.accounts--page[b-j6ert2ruqa]  .accounts__activity {
    max-height: 100%;
}

.accounts--page[b-j6ert2ruqa]  .accounts__table {
    min-height: 0;
    overflow: auto;
}

.accounts[b-j6ert2ruqa]  .accounts__activity {
    display: flex;
    flex-direction: column;
    min-height: 0;
}

.accounts--page[b-j6ert2ruqa]  .accounts__activity {
    overflow: hidden;
}

.accounts--page[b-j6ert2ruqa]  .accounts__activity > .cordis-card__body {
    flex: 1;
    min-height: 0;
    overflow-y: auto;
}

.accounts__hint[b-j6ert2ruqa] {
    margin: 0 0 var(--cordis-space-4);
    color: var(--cordis-text-muted);
    font-size: var(--cordis-fs-sm);
    line-height: 1.5;
}

/* The pop-up's facts: one wrapping row of label/value pairs, the page header's facts row. */
.accounts__facts[b-j6ert2ruqa] {
    display: flex;
    flex-wrap: wrap;
    gap: var(--cordis-space-2) var(--cordis-space-5);
    margin-bottom: var(--cordis-space-4);
}

/* The email cell's own row: the address, then the "you" pill beside it (issue #910). The span is authored in
   Accounts.razor's cell template (issue #1674) and so carries this component's scope id. The ::deep stays
   from when it was built by RenderTreeBuilder and carried none: it still matches, because the root div
   has the scope id, and dropping it is a separate change that needs its own look at the running page. */
.accounts[b-j6ert2ruqa]  .accounts__email {
    display: inline-flex;
    align-items: center;
    gap: var(--cordis-space-2);
}

/* Every cell on one line, so every row is one row high (issue #910); the columns step aside instead
   (CordisColumn.HideBelow). */
.accounts[b-j6ert2ruqa]  .cordis-table td {
    white-space: nowrap;
}
/* /Components/Admin/SharedProjectMembersDialog.razor.rz.scp.css */
/* The members dialog's one rule (issue #1294). The sheet owns the spacing between fields; what it has
   no primitive for is a COLUMN of checkboxes inside one field, which is what a membership is — every
   other multi-answer field in the product is a picker over hundreds of model elements, and a server's
   accounts are a list you read in one go.

   Tokens only: an undefined var() discards the whole declaration silently. */
/* The field lays its children out in a row; the count and the list are one column inside it. */
.members[b-iz2xrppmpf] {
    display: flex;
    flex-direction: column;
    flex: 1 1 auto;
    min-width: 0;
}

.members__list[b-iz2xrppmpf] {
    display: flex;
    flex-direction: column;
    gap: var(--cordis-space-2);
    max-height: min(24rem, 45vh);
    overflow-y: auto;
    scrollbar-gutter: stable;
}

.members__count[b-iz2xrppmpf] {
    font-size: var(--cordis-fs-xs);
    color: var(--cordis-text-muted);
    margin-bottom: var(--cordis-space-2);
}

/* Add by email address (#1562): the gap between the input and its Add button. `.cordis-field__control` is
   authored by CordisFormField and is already a flex row, so this is a gap, not a layout; the
   CordisModelPathDialog Location and Browse rule. */
.members-add[b-iz2xrppmpf]  .cordis-field__control {
    gap: var(--cordis-space-2);
}

/* A member and, beside them, whether they lead the project (#1417). */
.members__row[b-iz2xrppmpf] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: var(--cordis-space-2);
    min-width: 0;
}
/* /Components/Admin/SharedProjectModelDialog.razor.rz.scp.css */
/* The model dialog's one rule (issue #1294) — copy rather than a control, so it has no primitive of
   its own. The same shape, and the same reasoning, as AccountInviteDialog's hint.

   Tokens only: an undefined var() discards the whole declaration silently. */
.model__hint[b-cgsv4krax2] {
    margin: var(--cordis-space-2) 0 0;
    color: var(--cordis-text-muted);
    font-size: var(--cordis-fs-sm);
    line-height: 1.5;
}
/* /Components/Admin/SharedProjects.razor.rz.scp.css */
/* The shared-projects console's own few rules (issues #1294, #1362), and they are the accounts console's
   rules for the same reasons — the two are the same kind of surface, so a third way of laying one out would
   be a difference with no meaning. Everything with a visual identity is a design-system component; what is
   left here is layout between them.

   Tokens only: an undefined var() discards the whole declaration silently, so check
   external/cordis-design-system/css/tokens.css before inventing a name. */

.shared-projects[b-v7l6n5b3wr] {
    display: flex;
    flex-direction: column;
    gap: var(--cordis-space-4);
    min-width: 0;
}

/* On the portal the console IS the page and takes the content area's height, so a long list scrolls inside
   its card under the header rather than taking the header with it. */
.shared-projects--page[b-v7l6n5b3wr] {
    flex: 1;
    min-height: 0;
    gap: 0;
}

.shared-projects--page .shared-projects__notices[b-v7l6n5b3wr] {
    margin-bottom: var(--cordis-space-4);
}

.shared-projects--page[b-v7l6n5b3wr]  .shared-projects__table {
    min-height: 0;
    flex: 0 1 auto;
    overflow: auto;
}

.shared-projects__notices[b-v7l6n5b3wr] {
    display: flex;
    flex-direction: column;
    gap: var(--cordis-space-3);
}

/* Every cell on one line, so every row is one row high; the columns step aside instead
   (CordisColumn.HideBelow). ::deep because the table is the design system's markup, not ours. */
.shared-projects[b-v7l6n5b3wr]  .cordis-table td {
    white-space: nowrap;
}

/* The members cell is the one that grows with the data (#1353). Capped and ellipsised, so a project with a
   dozen people cannot push the row actions past the edge of the page; the count leads the cell, so what is
   cut off is only names. */
.shared-projects[b-v7l6n5b3wr]  .cordis-table td[data-label="Members"] {
    max-width: 28rem;
    overflow: hidden;
    text-overflow: ellipsis;
}
/* /Components/Portal/Pages/PortalServerHealth.razor.rz.scp.css */
/* Server health (#1568): the range controls in the page header, and the events card — the timeline beside the
   selected event's facts and log. Every value is a token; the components themselves are the design system's. */

.server-health__range[b-cj8j0j9t88] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: flex-end;
    gap: var(--cordis-space-2);
}

.server-health__events[b-cj8j0j9t88] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(min(100%, 24rem), 1fr));
    gap: var(--cordis-space-5);
    align-items: start;
}

.server-health__list[b-cj8j0j9t88],
.server-health__detail[b-cj8j0j9t88] {
    display: flex;
    flex-direction: column;
    gap: var(--cordis-space-3);
    min-width: 0;
}

/* The detail stays in view beside a long list. */
.server-health__detail[b-cj8j0j9t88] {
    position: sticky;
    top: var(--cordis-space-4);
}

.server-health__detail-title[b-cj8j0j9t88] {
    margin: 0;
    font-size: var(--cordis-fs-h3);
    font-weight: 600;
    color: var(--cordis-text);
}

.server-health__event-body[b-cj8j0j9t88] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: var(--cordis-space-3);
    font-size: var(--cordis-fs-sm);
    color: var(--cordis-text-muted);
}

/* The event whose time the charts show. On the row, which the timeline component renders: hence ::deep. */
[b-cj8j0j9t88] .server-health__event--selected .cordis-timeline__title {
    color: var(--cordis-primary);
}

[b-cj8j0j9t88] .server-health__log {
    max-height: 22rem;
}

.server-health__line[b-cj8j0j9t88] {
    padding: 0 var(--cordis-space-3);
    white-space: pre-wrap;
    overflow-wrap: anywhere;
}

.server-health__line--warn[b-cj8j0j9t88] {
    color: var(--cordis-warning-text);
}

.server-health__line--error[b-cj8j0j9t88] {
    color: var(--cordis-danger-text);
}
/* /Components/Portal/Pages/PortalServerLog.razor.rz.scp.css */
/* Server log (#1555): the range controls in the page header, the filters in the card's actions, and the records.
   Every value is a token; the components themselves are the design system's. The line rules follow the health
   page's log (PortalServerHealth.razor.css). */

.server-log__range[b-jb7wh5wwe1],
.server-log__filters[b-jb7wh5wwe1] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: flex-end;
    gap: var(--cordis-space-2);
}

[b-jb7wh5wwe1] .server-log__view {
    max-height: 70vh;
}

.server-log__line[b-jb7wh5wwe1] {
    padding: 0 var(--cordis-space-3);
    white-space: pre-wrap;
    overflow-wrap: anywhere;
}

.server-log__line--warn[b-jb7wh5wwe1] {
    color: var(--cordis-warning-text);
}

.server-log__line--error[b-jb7wh5wwe1] {
    color: var(--cordis-danger-text);
}

.server-log__scopes[b-jb7wh5wwe1] {
    display: block;
    padding-left: var(--cordis-space-5);
    color: var(--cordis-text-muted);
}

.server-log__exception[b-jb7wh5wwe1] {
    padding-left: var(--cordis-space-5);
}

.server-log__exception > summary[b-jb7wh5wwe1] {
    cursor: pointer;
}

.server-log__exception > pre[b-jb7wh5wwe1] {
    margin: 0;
    white-space: pre-wrap;
    overflow-wrap: anywhere;
    font: inherit;
}
/* /Components/Portal/PortalLayout.razor.rz.scp.css */
/* The Studio portal's frame (#1357, #1362). Only what the frame itself authors: the brand, the top bar and
   the content area. It is the Cordis Server's frame (its site.css, .mcs-shell / .mcs-topbar / .mcs-content),
   rule for rule, so the two products' administration pages sit in the same frame. Everything inside a page
   is the design system's. Tokens only: an undefined var() discards the whole declaration silently. */

/* The frame is exactly the viewport, and the content area is the only thing in it that scrolls — so the
   rail and the top bar never scroll away, and a page that wants two independently scrolling columns
   (the accounts console) has a bounded height to divide. */
.cordis-portal[b-womhza1aij] {
    height: 100dvh;
    background: var(--cordis-bg);
    color: var(--cordis-text);
}

.cordis-portal[b-womhza1aij]  .cordis-portal__shell.cordis-appshell {
    height: 100dvh;
    min-height: 0;
}

.cordis-portal[b-womhza1aij]  .cordis-portal__shell .cordis-rail {
    min-height: 0;
    overflow: hidden;
}

.cordis-portal[b-womhza1aij]  .cordis-portal__shell .cordis-appshell__main {
    display: flex;
    flex-direction: column;
    min-height: 0;
    overflow: hidden;
}

/* Brand band: the link around the ONE white CORDIS STUDIO lock-up. Its collapse to the mark (clip, motion,
   the inset that centres the mark in the 60px column) is the design system's CordisBrandLogo CollapseToMark. */
.cordis-portal__brand[b-womhza1aij] {
    display: flex;
    align-items: center;
    min-width: 0;
    height: 32px;
    color: var(--cordis-nav-text-on);
    text-decoration: none;
}

.cordis-portal__brand:hover[b-womhza1aij] {
    text-decoration: none;
}

.cordis-portal__topbar[b-womhza1aij] {
    flex: none;
    display: flex;
    align-items: center;
    gap: var(--cordis-space-3);
    min-height: 56px;
    padding: var(--cordis-space-2) var(--cordis-space-4);
    background: var(--cordis-surface);
    border-bottom: 1px solid var(--cordis-border);
}

.cordis-portal__actions[b-womhza1aij] {
    margin-left: auto;
    display: flex;
    align-items: center;
    gap: var(--cordis-space-2);
    flex: none;
}

/* A flex column, because a page stretches its own children to the height it is given. */
.cordis-portal__content[b-womhza1aij] {
    flex: 1;
    min-height: 0;
    display: flex;
    flex-direction: column;
    overflow-y: auto;
    padding: var(--cordis-space-2);
    background: var(--cordis-bg);
}

@media (max-width: 900px) {
    .cordis-portal__topbar[b-womhza1aij] {
        padding-inline: var(--cordis-space-2);
        gap: var(--cordis-space-2);
    }

    .cordis-portal[b-womhza1aij]  .cordis-usermenu__trigger-name,
    .cordis-portal[b-womhza1aij]  .cordis-usermenu__trigger-chevron {
        display: none;
    }
}

@media (max-width: 640px) {
    .cordis-portal[b-womhza1aij]  .cordis-crumbs.cordis-portal__trail {
        display: none;
    }
}

/* A page whose body is a form or a short list reads at a measure, not across a 2000px window. The Server's
   forms sit in pop-ups; the portal's two such pages (Workspaces, Your account) are pages, so they get it here.
   ::deep because the element is the page's markup, rendered through @Body. */
/* The portal's dashboard pages (#1432: Your activity, Server health): a column of blocks, a row of stat
   tiles that wraps by width, charts side by side where there is room, and a facts line. Here rather than
   in each page so the two pages cannot drift apart. */
.cordis-portal[b-womhza1aij]  .cordis-portal__stack {
    display: flex;
    flex-direction: column;
    gap: var(--cordis-space-4);
    min-width: 0;
}

.cordis-portal[b-womhza1aij]  .cordis-portal__stats {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(10rem, 1fr));
    gap: var(--cordis-space-4);
}

.cordis-portal[b-womhza1aij]  .cordis-portal__charts {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(min(100%, 28rem), 1fr));
    gap: var(--cordis-space-4);
}

.cordis-portal[b-womhza1aij]  .cordis-portal__facts {
    display: flex;
    flex-wrap: wrap;
    gap: var(--cordis-space-2) var(--cordis-space-5);
}

.cordis-portal[b-womhza1aij]  .cordis-portal__hint {
    margin: var(--cordis-space-3) 0 0;
    font-size: var(--cordis-fs-sm);
    color: var(--cordis-text-muted);
}

.cordis-portal[b-womhza1aij]  .cordis-portal__measure {
    display: flex;
    flex-direction: column;
    gap: var(--cordis-space-4);
    width: 100%;
    max-width: 48rem;
}