/* Vorpal — design tokens and shell styles (vp- class prefix).
   Fonts are bundled (Inter and JetBrains Mono, SIL Open Font License); nothing is fetched from a CDN. */

@font-face { font-family: "Inter"; font-style: normal; font-weight: 400; font-display: swap; src: url("../fonts/Inter-Regular.woff2") format("woff2"); }
@font-face { font-family: "Inter"; font-style: normal; font-weight: 500; font-display: swap; src: url("../fonts/Inter-Medium.woff2") format("woff2"); }
@font-face { font-family: "Inter"; font-style: normal; font-weight: 600; font-display: swap; src: url("../fonts/Inter-SemiBold.woff2") format("woff2"); }
@font-face { font-family: "Inter"; font-style: normal; font-weight: 700; font-display: swap; src: url("../fonts/Inter-Bold.woff2") format("woff2"); }
@font-face { font-family: "JetBrains Mono"; font-style: normal; font-weight: 400; font-display: swap; src: url("../fonts/JetBrainsMono-Regular.woff2") format("woff2"); }
@font-face { font-family: "JetBrains Mono"; font-style: normal; font-weight: 500; font-display: swap; src: url("../fonts/JetBrainsMono-Medium.woff2") format("woff2"); }

:root {
  --vp-accent: var(--mud-palette-primary, #FF6A3D);
  --vp-accent-hover: var(--mud-palette-primary-darken, #E5612F);
  --vp-accent-text: #B8431E;
  /* Focus ring: a non-text indicator needs 3:1 against the page (WCAG 1.4.11/2.4.7); Ember is 2.85:1 on white, so the ring is Ember Deep. */
  --vp-focus-ring: #B8431E;
  --vp-accent-contrast: var(--mud-palette-primary-text, #1B1F23);
  --vp-accent-tint: var(--mud-palette-primary-lighten, #FFE8E0);
  --vp-canvas: var(--mud-palette-background, #F5F5F5);
  --vp-surface: var(--mud-palette-surface, #FFFFFF);
  --vp-surface-subtle: var(--mud-palette-background-gray, #EEF2F5);
  --vp-text: var(--mud-palette-text-primary, #1B1F23);
  --vp-text-secondary: var(--mud-palette-text-secondary, #3C4A53);
  --vp-divider: var(--mud-palette-divider, #D7E2EA);
  --vp-control-outline: var(--mud-palette-lines-inputs, #7A879B);
  --vp-flare: #FFC85A;
  --vp-flare-text: #1B1F23;
  --vp-chip-red-bg: #FBECED; --vp-chip-red-fg: #B3261E; --vp-chip-red-bd: #F1BEC2;
  --vp-chip-amber-bg: #FCF7ED; --vp-chip-amber-fg: #7A5A10; --vp-chip-amber-bd: #F5E4C0;
  --vp-chip-green-bg: #EDF9F2; --vp-chip-green-fg: #1F7A45; --vp-chip-green-bd: #C1EAD2;
  --vp-chip-neutral-bg: #FFFFFF; --vp-chip-neutral-fg: #3C4A53; --vp-chip-neutral-bd: #AAB5BE;
  --vp-font-sans: "Inter", "Segoe UI", system-ui, sans-serif;
  --vp-font-mono: "JetBrains Mono", ui-monospace, SFMono-Regular, Menlo, monospace;
  --vp-radius-control: 8px;
  --vp-radius-panel: 12px;
  --vp-radius-dialog: 16px;
  --vp-row-compact: 40px;
  --vp-row-comfortable: 48px;
  --vp-rail-width: 256px;
  --vp-topbar-height: 64px;
}

:root { color-scheme: light; } /* one light theme (D52); no dark palette exists */
.vp-shell { min-height: 100vh; color: var(--vp-text); background: var(--vp-canvas); }

/* MudBlazor paints primary-coloured text, glyphs and focus labels with --mud-palette-primary
   (Ember #FF6A3D, 2.85:1 on white). D21 accepts Ember Deep for link and accent text, so those uses take
   --vp-accent-text here; filled controls keep Ember with Forged Iron text.
   .mud-primary-text covers MudLink and the checked checkbox, switch and radio glyphs. */
.mud-primary-text,
.mud-button-text.mud-button-text-primary,
.mud-button-outlined.mud-button-outlined-primary,
.mud-button-group-text-primary .mud-button-root,
.mud-button-group-outlined-primary .mud-button-root,
.mud-fab-text.mud-fab-text-primary,
.mud-fab-outlined.mud-fab-outlined-primary,
.mud-chip-text.mud-chip-color-primary,
.mud-chip-outlined.mud-chip-color-primary {
  color: var(--vp-accent-text) !important;
  --mud-ripple-color: var(--vp-accent-text) !important;
}
.mud-button-outlined.mud-button-outlined-primary,
.mud-button-group-outlined-primary .mud-button-root,
.mud-fab-outlined.mud-fab-outlined-primary,
.mud-chip-outlined.mud-chip-color-primary { border-color: var(--vp-accent-text) !important; }
.mud-tab.mud-tab-active,
.mud-alert-text-primary .mud-alert-icon,
.mud-alert-outlined-primary .mud-alert-icon,
.mud-treeview-checked-primary .mud-treeview-item-checkbox .mud-button-root.mud-icon-button,
.mud-input:focus-within ~ label.mud-input-label.mud-input-label-inputcontrol { color: var(--vp-accent-text); }
.mud-input.mud-input-outlined:focus-within > .mud-input-outlined-border,
.mud-input.mud-input-outlined:focus-within .mud-shrink > .mud-input-outlined-border { border-color: var(--vp-accent-text); }
.mud-input.mud-input-underline::after { border-bottom-color: var(--vp-accent-text); }

html, body { font-family: var(--vp-font-sans); color: var(--vp-text); background: var(--vp-canvas); }
/* Brand guide typography: Inter throughout, titles at 600 (as legacy Vorpal's headings), body at 400. */
h1, h2, h3, h4, h5, h6, .mud-typography-h1, .mud-typography-h2, .mud-typography-h3 { font-weight: 600; }
.vp-mono, code, kbd, .vp-page :is(.mud-table-root, .mud-simple-table table) td.vp-mono { font-family: var(--vp-font-mono); font-variant-numeric: tabular-nums; }
.vp-tabular { font-variant-numeric: tabular-nums; }
*:focus-visible { outline: 2px solid var(--vp-focus-ring); outline-offset: 2px; }
/* MudBlazor clears the outline on links and buttons (a:focus-visible, button:focus, .mud-button-root, .mud-chip), which
   left keyboard focus invisible on the rail, the top bar and every MudButton; restore the ring with higher specificity. */
body a:focus-visible, body button:focus-visible, body .mud-button-root:focus-visible, body .mud-chip:focus-visible,
body [role="button"]:focus-visible, body [role="tab"]:focus-visible, body [role="menuitem"]:focus-visible, body [role="option"]:focus-visible {
  outline: 2px solid var(--vp-focus-ring); outline-offset: 2px;
}
body .vp-rail .mud-nav-link:focus-visible { outline-offset: -2px; }
h1:focus, h1:focus-visible { outline: none; } /* FocusOnNavigate moves focus to the title for screen readers; no ring needed */
.vp-main:focus { outline: none; } /* the skip link's target: focus lands at the start of the page, which needs no ring */
.vp-visually-hidden { position: absolute !important; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0 0 0 0); clip-path: inset(50%); white-space: nowrap; border: 0; }
/* Skip link: off-screen until it receives keyboard focus, then shown over the top bar. */
.vp-skip-link { position: absolute; left: 8px; top: -48px; z-index: 2000; padding: 8px 16px; border: 0; border-radius: var(--vp-radius-control);
  background: var(--vp-surface); color: var(--vp-text); font: inherit; font-weight: 600; box-shadow: 0 2px 8px rgba(0,0,0,.2); cursor: pointer; }
.vp-skip-link:focus, .vp-skip-link:focus-visible { top: 8px; }
/* Links inside running text are underlined, not told apart by colour alone (WCAG 1.4.1, axe link-in-text-block). */
:where(p, li, dd, .vp-empty) a:not(.mud-button-root):not(.vp-button) { text-decoration: underline; text-underline-offset: 2px; }
/* A region that scrolls sideways at narrow widths; it takes focus (tabindex) so the keyboard can scroll it. */
.vp-scroll-region { max-width: 100%; overflow-x: auto; }
.vp-scroll-region > .mud-table > .mud-table-container { overflow: visible; }

/* Registers share readable column sizing; wide tables scroll instead of breaking identifiers and dates. */
.vp-page :is(.mud-table-root, .mud-simple-table table) > thead > tr > th { white-space: nowrap; background: var(--vp-surface-subtle); font-weight: 600; }
.vp-page :is(.mud-table-root, .mud-simple-table table) > tbody > tr > td { vertical-align: top; font-size: 0.875rem; line-height: 1.57; }
.vp-page .mud-table-dense :is(.mud-table-root, .mud-simple-table table) > :is(thead, tbody) > tr > :is(th, td) { padding: 8px 16px; }
.vp-page :is(.mud-table-root, .mud-simple-table table) td.vp-mono, .vp-page :is(.mud-table-root, .mud-simple-table table) td :is(a, span).vp-mono { white-space: nowrap; }
.vp-page :is(.mud-table-root, .mud-simple-table table) td:has(> div) { min-width: 12rem; }
.vp-page :is(.mud-table-root, .mud-simple-table table) td > div { max-width: 24rem; white-space: normal; overflow-wrap: break-word; }
.vp-page :is(.mud-table-root, .mud-simple-table table) td > .vp-empty { margin-top: 4px; font-family: var(--vp-font-sans); }
.vp-page :is(.mud-table-root, .mud-simple-table table) .vp-chip { white-space: nowrap; flex-shrink: 0; }

/* Register filter fields need room for their floating labels before the next control wraps. */
.vp-page .vp-tile > .d-flex.flex-wrap:has(> [data-testid="filter"]) > :is(.mud-input-control:not(.mud-input-control-boolean-input), .mud-select, .mud-picker) {
  flex: 1 0 14rem; min-width: 14rem;
}

.vp-page .vp-tile > .d-flex.flex-wrap:has(> [data-testid="filter"]) :is(.mud-select > .mud-input-control, .mud-input-control-input-container > .mud-input) {
  width: 100%; min-width: 0 !important; max-width: none !important;
}

/* MudTable's phone flex cells split each child into a separate column, including metadata and badges.
   Normal block flow keeps all value content together; the generated label has its own fixed lane. */
@media (max-width: 599.98px) {
  .vp-page .mud-xs-table .mud-table-root > tbody > tr > td:not(.mud-table-cell-hide) {
    display: flow-root; min-width: 0; min-height: 40px;
    padding: 8px 16px 8px 140px; white-space: normal; overflow-wrap: anywhere;
  }
  .vp-page .mud-xs-table .mud-table-cell::before {
    float: left; width: 108px; margin: 0 16px 0 -124px; padding: 0;
    font-family: var(--vp-font-sans); color: var(--vp-text-secondary); white-space: normal;
  }
  .vp-page .mud-xs-table .mud-table-root td :is(a, span).vp-mono { white-space: normal; }
  .vp-page .mud-xs-table .mud-table-root td > div { overflow-wrap: anywhere; }
  .vp-page .mud-xs-table .mud-table-root td:not([data-label]),
  .vp-page .mud-xs-table .mud-table-root td[data-label=""] { padding-left: 16px; }
  .vp-page .vp-tile > .d-flex.flex-wrap:has(> [data-testid="filter"]) > :is(.mud-input-control:not(.mud-input-control-boolean-input), .mud-select, .mud-picker) {
    flex-basis: 100%; max-width: 100% !important;
  }
}
@media (prefers-reduced-motion: reduce) { *, *::before, *::after { animation-duration: 0.01ms !important; transition-duration: 0.01ms !important; } }

/* Shell */
.vp-appbar { border-bottom: 1px solid var(--vp-divider); }
.vp-rail { border-right: 1px solid var(--vp-divider); }
/* MudBlazor's own active-link rule (.mud-navmenu.mud-navmenu-default .mud-nav-link.active:not(...)) is more specific and paints Ember text. */
.vp-rail .mud-nav-link.active { background: var(--vp-accent-tint) !important; color: var(--vp-accent-text) !important; border-radius: var(--vp-radius-control); }
.vp-rail .mud-nav-link.active .mud-nav-link-icon { color: var(--vp-accent-text); }
.vp-logo-plate { background: var(--vp-surface); border: 1px solid var(--vp-divider); border-radius: var(--vp-radius-panel); padding: 10px 12px; display: flex; align-items: center; gap: 10px; }
.vp-logo-plate img { height: 36px; width: auto; display: block; }
.vp-logo-byline { font-size: 11px; color: var(--vp-text-secondary); margin: 4px 0 0 2px; }
.vp-rail-footer { border-top: 1px solid var(--vp-divider); padding: 12px 16px; font-size: 12px; color: var(--vp-text-secondary); }
.vp-rail-footer .vp-user { display: flex; align-items: center; gap: 8px; margin-top: 8px; color: var(--vp-text); }
.vp-demo-strip { height: 28px; display: flex; align-items: center; justify-content: center; gap: 8px; background: var(--vp-flare); color: var(--vp-flare-text); font-size: 12px; font-weight: 600; letter-spacing: 0.02em; }
.vp-demo-strip span { font-weight: 400; }
.vp-scope-button { font-family: var(--vp-font-sans); text-transform: none; font-weight: 500; }
.vp-scope-menu .mud-button-root { font-family: var(--vp-font-sans); text-transform: none; font-weight: 500; color: var(--vp-text); }
.vp-scope-label { color: var(--vp-text-secondary); display: inline-flex; align-items: center; }
/* The account menu's activator is MudMenu's own role="button"; its content is presentational and styled as a text button. */
.vp-account-menu .mud-menu-activator { border-radius: var(--vp-radius-control); }
.vp-account-activator { display: inline-flex; align-items: center; gap: 8px; min-height: 36px; padding: 6px 8px; border-radius: var(--vp-radius-control);
  color: var(--vp-text); font-family: var(--vp-font-sans); font-size: 14px; font-weight: 500; cursor: pointer; user-select: none; }
.vp-account-activator:hover { background: var(--vp-surface-subtle); }
.vp-menu-heading { color: var(--vp-text-secondary); display: block; }
.vp-search { min-width: 280px; }
.vp-search .mud-input { font-size: 13px; }
.vp-kbd { font-family: var(--vp-font-mono); font-size: 11px; border: 1px solid var(--vp-divider); border-radius: 4px; padding: 1px 5px; color: var(--vp-text-secondary); background: var(--vp-surface-subtle); }
.vp-page { padding: 24px; max-width: 1440px; }
/* SHELL-01 narrow layout (below MudBlazor's md breakpoint, 960px): the rail is an overlay opened from the top bar, the
   top bar keeps scope, the search palette, inbox and account menu, and nothing makes the page scroll sideways. */
@media (max-width: 959.98px) {
  .vp-topbar-deployment, .vp-search, .vp-hide-narrow { display: none !important; }
  .vp-appbar .mud-toolbar { gap: 0; padding-left: 8px; padding-right: 8px; }
  .vp-appbar .mud-button-root { min-width: 0; }
  .vp-palette-button .mud-button-icon-start, .vp-scope-button .mud-button-icon-start { margin-right: 0; margin-left: 0; }
  .vp-scope-menu .mud-button-label { max-width: 40vw; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
  .vp-demo-strip { height: auto; min-height: 28px; flex-wrap: wrap; padding: 4px 16px; text-align: center; }
  .vp-page { padding: 16px; }
}
.vp-page-title { margin-bottom: 4px; }
.vp-page > .d-flex.align-start.flex-wrap > .d-flex { flex-wrap: wrap; }
.vp-page-subtitle { color: var(--vp-text-secondary); margin-bottom: 24px; }
.vp-tile { padding: 16px; border: 1px solid var(--vp-divider); border-radius: var(--vp-radius-panel); background: var(--vp-surface); }
.vp-tile-label { font-size: 12px; color: var(--vp-text-secondary); margin-bottom: 6px; }
.vp-tile-value { font-size: 26px; font-weight: 600; font-variant-numeric: tabular-nums; }
.vp-tile-focus { border-color: var(--vp-accent); box-shadow: 0 0 0 2px var(--vp-accent); }
/* Dashboard stat tiles (D53): legacy Vorpal's card edge (2 px Forged Iron, soft shadow) and an Ember icon badge beside the figure.
   The badge is decorative (aria-hidden); the label carries the meaning. Registers, editors and panels keep the quiet .vp-tile. */
.vp-stat { display: flex; align-items: flex-start; gap: 12px; height: 100%; padding: 16px 20px; background: var(--vp-surface); color: var(--vp-text);
  border: 2px solid var(--vp-text); border-radius: var(--vp-radius-control); box-shadow: 0 2px 8px rgba(27, 31, 35, 0.08); }
.vp-stat-body { flex: 1 1 auto; min-width: 0; }
.vp-stat-icon { flex: none; width: 48px; height: 48px; border-radius: var(--vp-radius-control); background: var(--vp-accent-tint); color: var(--vp-accent);
  display: flex; align-items: center; justify-content: center; }
.vp-stat-icon .mud-icon-root { width: 24px; height: 24px; }
.vp-empty { color: var(--vp-text-secondary); font-size: 13px; }
.vp-dl { display: grid; grid-template-columns: max-content 1fr; gap: 6px 16px; margin: 0; font-size: 13px; }
.vp-dl dt { color: var(--vp-text-secondary); }
.vp-dl dd { margin: 0; }
.cursor-pointer { cursor: pointer; }
.vp-file { display: inline-flex; align-items: center; gap: 8px; border: 1px dashed var(--vp-control-outline); border-radius: var(--vp-radius-control); padding: 8px 12px; cursor: pointer; font-size: 13px; }
.vp-file input[type=file] { position: absolute; width: 1px; height: 1px; opacity: 0; }

/* Chips: colour + shape + label, never colour alone */
.vp-chip { display: inline-flex; align-items: center; gap: 6px; height: 24px; padding: 0 8px; border-radius: 999px; font-size: 12px; font-weight: 500; border: 1px solid var(--vp-chip-neutral-bd); background: var(--vp-chip-neutral-bg); color: var(--vp-chip-neutral-fg); }
.vp-chip::before { content: ""; width: 7px; height: 7px; border-radius: 999px; background: currentColor; }
.vp-chip-red { background: var(--vp-chip-red-bg); color: var(--vp-chip-red-fg); border-color: var(--vp-chip-red-bd); }
.vp-chip-red::before, .vp-chip-amber::before { border-radius: 1px; }
.vp-chip-amber { background: var(--vp-chip-amber-bg); color: var(--vp-chip-amber-fg); border-color: var(--vp-chip-amber-bd); }
.vp-chip-green { background: var(--vp-chip-green-bg); color: var(--vp-chip-green-fg); border-color: var(--vp-chip-green-bd); }
.vp-chip-green::before { content: "✓"; width: auto; height: auto; background: none; font-size: 11px; line-height: 1; }

/* Static (server-rendered) auth pages */
.vp-auth { min-height: 100vh; display: grid; place-items: center; background: var(--vp-canvas); padding: 24px; }
.vp-auth-card { width: 100%; max-width: 420px; background: var(--vp-surface); border: 1px solid var(--vp-divider); border-radius: var(--vp-radius-dialog); padding: 32px; }
.vp-auth-card .vp-logo-plate { width: fit-content; margin-bottom: 20px; }
.vp-auth-card h1 { font-size: 20px; margin: 0 0 4px; }
.vp-auth-card p { color: var(--vp-text-secondary); font-size: 13px; margin: 0 0 20px; }
.vp-field { display: block; margin-bottom: 16px; }
.vp-field label { display: block; font-size: 13px; font-weight: 500; margin-bottom: 6px; }
.vp-field input { width: 100%; height: 40px; border: 1px solid var(--vp-control-outline); border-radius: var(--vp-radius-control); padding: 0 12px; font: inherit; color: var(--vp-text); background: var(--vp-surface); }
.vp-field input:focus { border-color: var(--vp-accent); }
.vp-field .validation-message { color: var(--vp-chip-red-fg); font-size: 12px; margin-top: 4px; display: block; }
.vp-check { display: flex; align-items: center; gap: 8px; font-size: 13px; margin-bottom: 20px; }
.vp-button { height: 40px; border: 0; border-radius: var(--vp-radius-control); padding: 0 16px; font: inherit; font-weight: 600; cursor: pointer; background: var(--vp-accent); color: var(--vp-accent-contrast); box-shadow: inset 0 -2px 0 rgba(0,0,0,.08); width: 100%; }
.vp-button:hover { background: var(--vp-accent-hover); }
.vp-button.vp-button-inline { display: inline-block; width: auto; line-height: 40px; text-align: center; text-decoration: none; margin: 0 8px 8px 0; }
.vp-access-actions { display: flex; flex-wrap: wrap; margin-top: 16px; }
.vp-access-state .vp-alert, .vp-auth-card .vp-alert { margin: 12px 0; }
.vp-scope-options { list-style: none; padding: 0; margin: 4px 0 8px; display: flex; flex-wrap: wrap; gap: 8px; }
.vp-link-button { background: none; border: 1px solid var(--vp-divider); border-radius: var(--vp-radius-control); padding: 4px 10px; font: inherit; color: inherit; cursor: pointer; }
.vp-link-button:hover { border-color: var(--vp-accent); }
.vp-failure-state h1 { font-size: 20px; margin: 0 0 4px; }
.vp-alert { border-radius: var(--vp-radius-control); padding: 10px 12px; font-size: 13px; margin-bottom: 16px; border: 1px solid; }
.vp-alert-error { background: var(--vp-chip-red-bg); color: var(--vp-chip-red-fg); border-color: var(--vp-chip-red-bd); }
.vp-alert-info { background: var(--vp-surface-subtle); color: var(--vp-text-secondary); border-color: var(--vp-divider); }
.vp-auth-foot { margin-top: 20px; font-size: 12px; color: var(--vp-text-secondary); }
/* A standalone link under the card's actions: at least a 24 px target (WCAG 2.5.8, axe target-size). */
.vp-auth-foot > a:first-child { display: inline-block; min-height: 24px; line-height: 24px; }
.vp-auth-card .vp-auth-facts { margin: 0 0 16px; font-size: 13px; display: grid; grid-template-columns: max-content 1fr; gap: 4px 12px; }
.vp-auth-card .vp-auth-facts dt { color: var(--vp-text-secondary); }
.vp-auth-card .vp-auth-facts dd { margin: 0; overflow-wrap: anywhere; }
.vp-capability-preview { border: 1px solid var(--vp-divider); border-radius: var(--vp-radius-control); background: var(--vp-surface-subtle); padding: 10px 12px; margin-bottom: 16px; font-size: 13px; }
.vp-capability-preview-title { font-weight: 600; margin-bottom: 6px; }
.vp-capability-preview dl { margin: 0; }
.vp-capability-preview dt { font-weight: 500; margin-top: 6px; }
.vp-capability-preview dd { margin: 2px 0 0; color: var(--vp-text-secondary); }
.vp-capability-count { color: var(--vp-text-secondary); font-weight: 400; }

#blazor-error-ui { background: var(--vp-chip-red-bg); color: var(--vp-chip-red-fg); border-top: 1px solid var(--vp-chip-red-bd); bottom: 0; box-shadow: 0 -1px 2px rgba(0,0,0,.1); display: none; left: 0; padding: 10px 24px; position: fixed; width: 100%; z-index: 1000; font-size: 13px; }
#blazor-error-ui .dismiss { cursor: pointer; position: absolute; right: 12px; top: 8px; }

.vp-negative { color: var(--vp-chip-red-fg); font-weight: 600; }

/* Reports: past-due rows and contract-monitor cells (colour + glyph, never colour alone). */
.vp-row-late { background: var(--vp-chip-red-bg, #FBECED); }
.vp-monitor { border-collapse: collapse; font-size: 13px; }
.vp-monitor th, .vp-monitor td { padding: 4px 8px; border-bottom: 1px solid var(--vp-divider, #D7E2EA); text-align: left; white-space: nowrap; }
.vp-monitor td[class^="vp-cell"] { text-align: center; font-weight: 600; }
.vp-cell-done { color: var(--vp-chip-green-fg); }
.vp-cell-partial { color: var(--vp-chip-amber-fg); }
.vp-cell-failed { color: var(--vp-chip-red-fg); }
.vp-cell-open { color: var(--vp-text-secondary); }

/* Tasks register: keep task identity visible while saved columns scroll; actions stay in the final table column. */
.vp-task-register-scroll { overscroll-behavior-inline: contain; }
.vp-task-register-scroll .mud-table-root { width: max-content; min-width: 100%; }
.vp-task-register-identity { position: sticky; left: 0; z-index: 1; width: 12rem; min-width: 12rem; max-width: 18rem; white-space: normal; overflow-wrap: anywhere;
  background: var(--vp-surface); box-shadow: 2px 0 4px rgba(27, 31, 35, .12); }
.vp-task-register-actions { min-width: 9rem; white-space: nowrap; }
.vp-task-register-table thead .vp-task-register-identity { z-index: 2; }
.vp-task-register-assignment { flex: 0 0 13rem; min-width: 13rem; }
@media (max-width: 599.98px) {
  .vp-task-register-identity { width: 8rem; min-width: 8rem; }
  .vp-task-register-actions { min-width: 9rem; }
  .vp-task-register-assignment { flex: 0 0 100%; width: 100%; max-width: 100%; min-width: 0; }
}
