:root {
  --ds-ink: #172033;
  --ds-muted: #637083;
  --ds-line: #d7dde8;
  --ds-surface: #ffffff;
  --ds-soft: #f5f7fb;
  --ds-primary: #285f8f;
  --ds-primary-strong: #16466e;
  --ds-accent: #f2c14e;
  --ds-good: #2b7a5b;
  --ds-warn: #a05f16;
  --ds-danger: #a53b3b;
  --ds-danger-strong: #842828;
  --ds-calendar-active-context: #a21caf;
  --ds-calendar-active-context-text: #ffffff;
  --ds-calendar-active-context-border: #86198f;
  --ds-calendar-active-context-subtle: #fae8ff;
  --ds-hero-overlay-a: rgba(21, 34, 56, .93);
  --ds-hero-overlay-b: rgba(21, 34, 56, .74);
  --bs-body-color: var(--ds-ink);
  --bs-body-bg: var(--ds-soft);
  --bs-secondary-color: var(--ds-muted);
  --bs-border-color: var(--ds-line);
  --bs-link-color: var(--ds-primary);
  --ds-toggler-filter: none;
  --ds-sidebar-bg: #152238;
  --ds-sidebar-ink: #e8edf5;
  --ds-sidebar-muted: rgba(255, 255, 255, .62);
  --ds-sidebar-hover: rgba(255, 255, 255, .1);
  --ds-sidebar-active: rgba(125, 183, 230, .22);
  --ds-control-height: 3rem;
  --ds-control-radius: 8px;
  --ds-control-padding-x: .85rem;
  --ds-table-head-height: 3.25rem;
  --ds-row-height: 4.6rem;
  --ds-table-toolbar-height: 3.65rem;
  --ds-table-footer-height: 3.35rem;
  --ds-focus-ring: #0b63ce;
  --ds-focus-ring-outer: #ffffff;
}

/* Enterprise component standards: dropdowns, modals, tables and My Pages. */
html {
  scroll-padding-top: 5.75rem;
}

#main-content {
  scroll-margin-top: 5.75rem;
}

.skip-link {
  position: fixed;
  top: .75rem;
  left: .75rem;
  z-index: 4000;
  transform: translateY(-180%);
  display: inline-flex;
  align-items: center;
  min-height: 2.75rem;
  border: 2px solid var(--ds-focus-ring-outer);
  border-radius: 8px;
  background: var(--ds-focus-ring);
  color: #fff;
  padding: .6rem .85rem;
  font-weight: 850;
  text-decoration: none;
  box-shadow: 0 0 0 3px var(--ds-focus-ring);
}

.skip-link:focus,
.skip-link:focus-visible {
  transform: translateY(0);
  outline: 0;
}

a:focus-visible,
button:focus-visible,
input:focus-visible,
select:focus-visible,
textarea:focus-visible,
[tabindex]:not([tabindex="-1"]):focus-visible,
[role="button"]:focus-visible,
[role="menuitem"]:focus-visible {
  outline: 3px solid var(--ds-focus-ring);
  outline-offset: 3px;
  box-shadow: 0 0 0 5px color-mix(in srgb, var(--ds-focus-ring-outer) 88%, transparent);
}

.module-card,
.folder-tile,
.profile-panel,
.profile-hero,
.btn-action,
.settings-action-card,
.shortcut-grid a,
.compact-table > div,
.document-shortcut-row {
  transition: transform .16s ease, box-shadow .16s ease, border-color .16s ease, background-color .16s ease;
}

.module-card:hover,
.folder-tile:hover,
.profile-panel:hover,
.btn-action:hover,
.settings-action-card:hover,
.shortcut-grid a:hover,
.compact-table > div:hover,
.document-shortcut-row:hover {
  transform: translateY(-2px) scale(1.01);
  box-shadow: 0 14px 34px color-mix(in srgb, var(--ds-ink) 13%, transparent);
}

.search-select-panel,
.dropdown-menu,
.dropdown-panel,
.search-results {
  z-index: 1205;
}

.modal {
  --bs-modal-zindex: 1300;
}

.modal-backdrop {
  --bs-backdrop-zindex: 1290;
}

.ds-modal-content {
  background: var(--ds-surface);
  color: var(--ds-ink);
  border: 1px solid var(--ds-line);
  border-radius: 8px;
  box-shadow: 0 24px 80px color-mix(in srgb, var(--ds-ink) 28%, transparent);
}

.modal-header,
.modal-footer {
  border-color: var(--ds-line);
}

.btn-close {
  width: 2.35rem;
  height: 2.35rem;
  border-radius: 50%;
  background-color: color-mix(in srgb, var(--ds-ink) 10%, var(--ds-surface));
  opacity: 1;
  filter: var(--ds-toggler-filter);
  transition: transform .22s ease, background-color .16s ease;
}

.btn-close:hover {
  transform: rotate(90deg) scale(1.06);
  background-color: color-mix(in srgb, var(--ds-primary) 18%, var(--ds-surface));
}

.search-select-button,
.search-select-option {
  display: flex;
  align-items: center;
  gap: .5rem;
}

.search-select-button::after {
  content: "";
  width: .55rem;
  height: .55rem;
  border-right: 2px solid currentColor;
  border-bottom: 2px solid currentColor;
  transform: rotate(45deg);
  top: .92rem;
  opacity: .7;
}

.search-select-shell.is-open .search-select-button::after {
  top: 1.05rem;
  transform: rotate(225deg);
}

.flag {
  width: 1.35rem;
  height: .95rem;
  flex: 0 0 auto;
  border: 1px solid color-mix(in srgb, var(--ds-ink) 18%, transparent);
  border-radius: 2px;
  box-shadow: inset 0 0 0 1px rgba(255,255,255,.22);
}

.flag-se { background: linear-gradient(90deg, transparent 0 30%, #fecc00 30% 42%, transparent 42%), linear-gradient(180deg, #006aa7 0 38%, #fecc00 38% 56%, #006aa7 56%); }
.flag-dk { background: linear-gradient(90deg, transparent 0 30%, #fff 30% 42%, transparent 42%), linear-gradient(180deg, #c60c30 0 42%, #fff 42% 56%, #c60c30 56%); }
.flag-no { background: linear-gradient(90deg, transparent 0 28%, #fff 28% 35%, #00205b 35% 45%, #fff 45% 52%, transparent 52%), linear-gradient(180deg, #ba0c2f 0 34%, #fff 34% 42%, #00205b 42% 56%, #fff 56% 64%, #ba0c2f 64%); }
.flag-fi { background: linear-gradient(90deg, transparent 0 30%, #002f6c 30% 45%, transparent 45%), linear-gradient(180deg, #fff 0 38%, #002f6c 38% 56%, #fff 56%); }
.flag-de { background: linear-gradient(180deg, #000 0 33%, #dd0000 33% 66%, #ffce00 66%); }
.flag-gb { background: linear-gradient(145deg, transparent 0 43%, #fff 43% 48%, #c8102e 48% 54%, #fff 54% 59%, transparent 59%), linear-gradient(35deg, #012169 0 43%, #fff 43% 48%, #c8102e 48% 54%, #fff 54% 59%, #012169 59%); }
.flag-us { background: repeating-linear-gradient(180deg, #b22234 0 7%, #fff 7% 14%); position: relative; }
.flag-us::before { content: ""; display: block; width: 45%; height: 54%; background: #3c3b6e; }
.flag-fr { background: linear-gradient(90deg, #0055a4 0 33%, #fff 33% 66%, #ef4135 66%); }
.flag-nl { background: linear-gradient(180deg, #ae1c28 0 33%, #fff 33% 66%, #21468b 66%); }
.flag-pl { background: linear-gradient(180deg, #fff 0 50%, #dc143c 50%); }

[data-tooltip] {
  position: relative;
}

[data-tooltip]:hover::after,
[data-tooltip]:focus-visible::after {
  content: attr(data-tooltip);
  position: absolute;
  left: 50%;
  bottom: calc(100% + .55rem);
  z-index: 1400;
  width: max-content;
  max-width: min(22rem, 80vw);
  transform: translateX(-50%);
  border: 1px solid var(--ds-line);
  border-radius: 8px;
  background: var(--ds-ink);
  color: var(--ds-surface);
  padding: .55rem .65rem;
  font-size: .82rem;
  font-weight: 700;
  line-height: 1.35;
  box-shadow: 0 14px 36px color-mix(in srgb, var(--ds-ink) 22%, transparent);
}

.profile-editor-grid {
  grid-template-columns: minmax(16rem, 22rem) minmax(0, 1fr);
}

.avatar-editor,
.profile-main-form,
.profile-main-form .field,
.profile-main-form input,
.profile-main-form textarea,
.profile-main-form .search-select-shell {
  min-width: 0;
}

.profile-main-form textarea,
.field input,
.field textarea {
  overflow-wrap: anywhere;
}

.my-pages-savebar {
  margin-top: 1rem;
  z-index: 25;
}

.settings-action-card {
  width: 100%;
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: .25rem .75rem;
  align-items: center;
  border: 1px solid var(--ds-line);
  border-radius: 8px;
  background: var(--ds-soft);
  color: var(--ds-ink);
  padding: .85rem;
  text-align: left;
}

.settings-action-card small {
  grid-column: 1 / -1;
  color: var(--ds-muted);
}

.settings-action-card span {
  color: var(--ds-primary);
  font-weight: 850;
}

.document-shortcut-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: .15rem .75rem;
  border: 1px solid var(--ds-line);
  border-radius: 8px;
  background: var(--ds-soft);
  color: var(--ds-ink);
  padding: .75rem;
  text-decoration: none;
}

.document-shortcut-row small {
  grid-column: 1 / -1;
  color: var(--ds-muted);
}

.ai-command-strip,
.calendar-grid-view,
.kanban-mini {
  display: grid;
  gap: .6rem;
  margin-bottom: .75rem;
}

.ai-command-strip {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

.ai-command-strip button,
.kanban-mini > div,
.calendar-grid-view > div {
  border: 1px solid var(--ds-line);
  border-radius: 8px;
  background: var(--ds-soft);
  color: var(--ds-ink);
  padding: .7rem;
  text-align: left;
}

.ai-draft-box {
  width: 100%;
  border: 1px solid var(--ds-line);
  border-radius: 8px;
  background: var(--ds-surface);
  color: var(--ds-ink);
  padding: .75rem;
  margin-bottom: .75rem;
}

.calendar-grid-view {
  grid-template-columns: repeat(5, minmax(0, 1fr));
}

.calendar-month-view {
  display: grid;
  grid-template-columns: repeat(7, minmax(2rem, 1fr));
  gap: .35rem;
}

.calendar-month-view span {
  min-height: 2.25rem;
  display: grid;
  place-items: center;
  border: 1px solid var(--ds-line);
  border-radius: 8px;
  background: var(--ds-soft);
}

.calendar-month-view .active {
  border-color: var(--ds-primary);
  background: color-mix(in srgb, var(--ds-primary) 16%, var(--ds-surface));
  color: var(--ds-primary-strong);
  font-weight: 900;
}

.kanban-mini {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

.two-factor-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: .75rem;
}

.ds-table-toolbar,
.ds-table-pager {
  display: flex;
  flex-wrap: wrap;
  gap: .55rem;
  align-items: end;
  justify-content: space-between;
  border: 1px solid var(--ds-line);
  background: var(--ds-surface);
  padding: .65rem;
}

.ds-table-toolbar {
  border-radius: 8px 8px 0 0;
  border-bottom: 0;
  margin-top: .25rem;
}

.ds-smart-table {
  border-radius: 0;
  min-height: 18rem;
}

.ds-table-pager {
  border-radius: 0 0 8px 8px;
  border-top: 0;
  margin-bottom: .5rem;
}

.ds-table-search,
.ds-table-size {
  display: grid;
  gap: .2rem;
  color: var(--ds-muted);
  font-size: .78rem;
  font-weight: 850;
  text-transform: uppercase;
}

.ds-table-search {
  flex: 1 1 18rem;
  max-width: 32rem;
}

.ds-table-search input,
.ds-table-size select {
  min-height: 2.45rem;
  border: 1px solid var(--ds-line);
  border-radius: 8px;
  background: var(--ds-surface);
  color: var(--ds-ink);
  padding: .5rem .65rem;
  text-transform: none;
}

.ds-table-export {
  display: flex;
  gap: .35rem;
}

.ds-table-export button,
.ds-table-pager button {
  min-height: 2.3rem;
  border: 1px solid var(--ds-line);
  border-radius: 8px;
  background: var(--ds-soft);
  color: var(--ds-ink);
  padding: .45rem .7rem;
  font-weight: 800;
}

.ds-table-pager button:disabled {
  cursor: not-allowed;
  opacity: .5;
}

.enterprise-row:hover,
.document-row:hover,
.activity-row:hover,
.trash-row:hover,
.admin-table tbody tr:hover {
  background: color-mix(in srgb, var(--ds-primary) 9%, var(--ds-surface));
}

.sortable {
  cursor: pointer;
  user-select: none;
}

.sortable[data-sort="asc"]::after { content: "  ↑"; }
.sortable[data-sort="desc"]::after { content: "  ↓"; }

.admin-table {
  width: 100%;
  border-collapse: separate;
  border-spacing: 0;
  border: 1px solid var(--ds-line);
  border-radius: 8px;
  overflow: hidden;
  background: var(--ds-surface);
}

.admin-table th,
.admin-table td {
  border-bottom: 1px solid var(--ds-line);
  padding: .8rem;
  color: var(--ds-ink);
}

.admin-table th {
  background: var(--ds-soft);
  color: var(--ds-muted);
  font-size: .82rem;
  font-weight: 900;
  text-transform: uppercase;
}

.admin-table td {
  vertical-align: top;
}

.upload-dialog {
  max-width: min(96vw, 78rem);
}

.upload-modal-grid {
  grid-template-columns: minmax(0, .95fr) minmax(20rem, 1.05fr);
  align-items: stretch;
}

.upload-form-panel {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: .85rem;
}

.upload-preview-panel {
  min-width: 0;
  display: grid;
  grid-template-rows: auto minmax(0, 1fr);
  border: 1px solid var(--ds-line);
  border-radius: 8px;
  background: var(--ds-soft);
  padding: .85rem;
}

.upload-preview-mobile-button,
.upload-preview-close {
  display: none;
}

.upload-preview {
  min-height: 24rem;
  display: grid;
  align-content: start;
  gap: .75rem;
  overflow: auto;
}

.upload-preview iframe,
.upload-preview img {
  width: 100%;
  min-height: 22rem;
  border: 0;
  border-radius: 8px;
  background: #fff;
}

.upload-preview pre {
  max-height: 24rem;
  overflow: auto;
  border: 1px solid var(--ds-line);
  border-radius: 8px;
  background: var(--ds-surface);
  padding: .75rem;
  white-space: pre-wrap;
}

.office-preview-card {
  display: grid;
  gap: .35rem;
  border: 1px solid var(--ds-line);
  border-radius: 8px;
  background: var(--ds-surface);
  padding: 1rem;
}

.office-preview-card small {
  color: var(--ds-muted);
}

@media (max-width: 980px) {
  .my-pages-shell,
  .profile-editor-grid,
  .profile-kpi-grid,
  .profile-section-grid,
  .calendar-grid-view,
  .kanban-mini,
  .two-factor-grid,
  .ai-command-strip,
  .upload-modal-grid,
  .upload-form-panel {
    grid-template-columns: 1fr;
  }

  .my-pages-rail {
    position: static;
  }

  .profile-hero {
    align-items: stretch;
  }

  .quick-action-grid {
    justify-content: stretch;
  }

  .quick-action-grid .btn-action {
    width: 100%;
  }

  .upload-preview-mobile-button,
  .upload-preview-close {
    display: inline-flex;
  }

  .upload-preview-panel {
    position: fixed;
    inset: .75rem;
    z-index: 1320;
    display: none;
    box-shadow: 0 20px 70px rgba(0,0,0,.42);
  }

  .upload-preview-panel.is-open {
    display: grid;
  }

  .document-table,
  .enterprise-table,
  .activity-table,
  .trash-table {
    overflow: visible;
  }

  .enterprise-head {
    display: none;
  }

  .enterprise-row:not(.enterprise-head) {
    grid-template-columns: 1fr;
    border: 1px solid var(--ds-line);
    border-radius: 8px;
    background: var(--ds-surface);
    margin-bottom: .65rem;
  }

  .enterprise-row:not(.enterprise-head) > span {
    display: flex;
    justify-content: space-between;
    gap: .75rem;
    white-space: normal;
  }

  .ds-table-toolbar,
  .ds-table-pager {
    display: grid;
    justify-content: stretch;
  }

  .ds-table-search {
    max-width: none;
  }
}

/* Fixed savebar placement must match HQ and My Pages, with the staging badge above it. */
.portal-content:has(.form-savebar) {
  padding-bottom: 6.5rem;
}

.form-savebar,
.my-pages-savebar {
  position: fixed;
  left: calc(var(--sidebar-width, 260px) + 1rem);
  right: 1rem;
  bottom: .75rem;
  z-index: 25;
  margin: 0;
}

body.sidebar-collapsed .form-savebar,
body.sidebar-collapsed .my-pages-savebar {
  left: calc(var(--sidebar-collapsed-width, 96px) + 1rem);
}

.environment-badge {
  z-index: 30;
  bottom: 5.35rem;
}

@media (max-width: 800px) {
  .form-savebar,
  .my-pages-savebar {
    left: .75rem;
    right: .75rem;
    bottom: 4.75rem;
  }

  .environment-badge {
    bottom: 9.2rem;
  }
}

.my-pages-shell {
  display: grid;
  grid-template-columns: minmax(14rem, 17rem) minmax(0, 1fr);
  gap: 1rem;
}

.my-pages-rail {
  position: sticky;
  top: 5rem;
  align-self: start;
  display: grid;
  gap: .75rem;
}

.mini-profile-card,
.my-pages-nav,
.profile-subcard {
  border: 1px solid var(--ds-line);
  border-radius: 8px;
  background: var(--ds-surface);
  padding: .85rem;
}

.mini-profile-card {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  align-items: center;
  gap: .65rem;
}

.mini-profile-card strong,
.mini-profile-card small {
  display: block;
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.mini-profile-card small,
.profile-subcard small,
.kpi-card small,
.compact-table small,
.agenda-list small,
.task-board small {
  color: var(--ds-muted);
}

.my-pages-nav {
  display: grid;
  gap: .15rem;
}

.my-pages-nav a {
  border-radius: 6px;
  color: var(--ds-ink);
  padding: .48rem .55rem;
  text-decoration: none;
}

.my-pages-nav a:hover {
  background: var(--ds-soft);
  color: var(--ds-primary-strong);
}

.my-pages-content {
  display: grid;
  gap: 1rem;
  min-width: 0;
}

.profile-command-center {
  margin-bottom: 0;
}

.quick-action-grid {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-end;
  gap: .55rem;
}

.profile-kpi-grid,
.profile-section-grid {
  display: grid;
  gap: 1rem;
}

.profile-kpi-grid {
  grid-template-columns: repeat(4, minmax(0, 1fr));
}

.profile-section-grid {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.profile-wide-panel {
  min-width: 0;
}

.kpi-card {
  display: grid;
  gap: .2rem;
}

.kpi-card span {
  color: var(--ds-muted);
  font-size: .82rem;
  font-weight: 800;
  text-transform: uppercase;
}

.kpi-card strong {
  font-size: 1.9rem;
  line-height: 1;
}

.widget-grid,
.shortcut-grid,
.analytics-grid {
  display: grid;
  gap: .65rem;
}

.widget-grid {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.widget-grid > div,
.shortcut-grid a,
.settings-list > div,
.settings-list label,
.agenda-list > div,
.task-board > div,
.compact-table > div {
  border: 1px solid var(--ds-line);
  border-radius: 8px;
  background: var(--ds-soft);
  padding: .75rem;
}

.widget-grid strong,
.widget-grid small,
.settings-list strong,
.settings-list small,
.compact-table strong,
.compact-table small,
.compact-table span {
  display: block;
}

.shortcut-grid {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.shortcut-grid a {
  color: var(--ds-primary-strong);
  font-weight: 800;
  text-decoration: none;
}

.profile-editor-grid {
  display: grid;
  grid-template-columns: minmax(18rem, .6fr) minmax(26rem, 1.4fr);
  gap: 1rem;
  align-items: start;
}

.profile-main-form {
  margin-bottom: 0;
}

.tag-list {
  display: flex;
  flex-wrap: wrap;
  gap: .45rem;
}

.tag-list span,
.priority-pill {
  border: 1px solid var(--ds-line);
  border-radius: 999px;
  background: var(--ds-surface);
  color: var(--ds-primary-strong);
  padding: .22rem .55rem;
  font-size: .82rem;
  font-weight: 800;
}

.security-score-bar {
  height: .65rem;
  overflow: hidden;
  border-radius: 999px;
  background: var(--ds-soft);
  border: 1px solid var(--ds-line);
  margin-bottom: .75rem;
}

.security-score-bar span {
  display: block;
  height: 100%;
  border-radius: inherit;
  background: linear-gradient(90deg, var(--ds-good), var(--ds-primary));
}

.settings-list,
.agenda-list,
.task-board,
.compact-table {
  display: grid;
  gap: .6rem;
}

.settings-list > div,
.settings-list label {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: .35rem .75rem;
  align-items: center;
}

.settings-list small {
  grid-column: 1 / -1;
}

.settings-list.compact label {
  grid-template-columns: minmax(0, 1fr) auto;
}

.settings-list input[role="switch"] {
  width: 2.6rem;
  height: 1.35rem;
}

.inline-search {
  min-height: 2.45rem;
  width: min(100%, 18rem);
  border: 1px solid var(--ds-line);
  border-radius: 8px;
  background: var(--ds-surface);
  color: var(--ds-ink);
  padding: .55rem .7rem;
}

.enterprise-table {
  display: grid;
  border: 1px solid var(--ds-line);
  border-radius: 8px;
  overflow: visible;
}

.enterprise-row {
  display: grid;
  grid-template-columns: minmax(12rem, 1.2fr) minmax(7rem, .65fr) minmax(7rem, .55fr) minmax(8rem, .65fr) minmax(8rem, .55fr);
  gap: .75rem;
  align-items: center;
  border-top: 1px solid var(--ds-line);
  padding: .75rem;
  min-width: 0;
}

.enterprise-row:first-child {
  border-top: 0;
}

.enterprise-head {
  background: var(--ds-soft);
  color: var(--ds-muted);
  font-weight: 800;
}

.enterprise-row span,
.enterprise-row strong,
.enterprise-row small {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.compact-table > div {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: .15rem .75rem;
  align-items: center;
}

.compact-table small {
  grid-column: 1 / -1;
}

.segmented-control {
  display: inline-grid;
  grid-auto-flow: column;
  border: 1px solid var(--ds-line);
  border-radius: 8px;
  overflow: hidden;
}

.segmented-control button {
  min-height: 2.15rem;
  border: 0;
  border-left: 1px solid var(--ds-line);
  background: var(--ds-surface);
  color: var(--ds-ink);
  padding: .35rem .6rem;
}

.segmented-control button:first-child {
  border-left: 0;
}

.segmented-control button.active {
  background: var(--ds-primary);
  color: var(--ds-surface);
  font-weight: 800;
}

:root[data-theme="dark"] .segmented-control button.active {
  color: #07111e;
}

.agenda-list > div {
  display: grid;
  grid-template-columns: 4.5rem minmax(0, 1fr);
  gap: .15rem .65rem;
}

.agenda-list time {
  grid-row: span 2;
  color: var(--ds-primary-strong);
  font-weight: 900;
}

.task-board {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.task-board > div {
  display: grid;
  gap: .35rem;
}

.task-board em {
  color: var(--ds-muted);
  font-style: normal;
}

.analytics-grid {
  grid-template-columns: repeat(5, minmax(0, 1fr));
  align-items: end;
  min-height: 12rem;
}

.analytics-grid div {
  min-height: 11rem;
  display: grid;
  align-items: end;
  gap: .45rem;
}

.analytics-grid span {
  display: block;
  min-height: 2rem;
  border-radius: 8px 8px 0 0;
  background: linear-gradient(180deg, var(--ds-primary), var(--ds-accent));
}

.analytics-grid small {
  text-align: center;
  color: var(--ds-muted);
}

@media (max-width: 1100px) {
  .my-pages-shell,
  .profile-editor-grid,
  .profile-section-grid {
    grid-template-columns: 1fr;
  }

  .my-pages-rail {
    position: static;
  }

  .my-pages-nav {
    grid-template-columns: repeat(auto-fit, minmax(9rem, 1fr));
  }

  .profile-kpi-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 800px) {
  .profile-kpi-grid,
  .widget-grid,
  .shortcut-grid,
  .task-board {
    grid-template-columns: 1fr;
  }

  .quick-action-grid,
  .documents-hero-actions {
    justify-content: stretch;
  }

  .quick-action-grid .btn-action {
    width: 100%;
  }

  .enterprise-table {
    border: 0;
    gap: .65rem;
  }

  .enterprise-head {
    display: none;
  }

  .enterprise-row {
    grid-template-columns: 1fr;
    border: 1px solid var(--ds-line);
    border-radius: 8px;
    background: var(--ds-surface);
  }

  .panel-heading {
    display: grid;
  }

  .inline-search {
    width: 100%;
  }
}

:root[data-theme="dark"] {
  --ds-ink: #edf3fb;
  --ds-muted: #aeb9c8;
  --ds-line: #344158;
  --ds-surface: #182234;
  --ds-soft: #0f1624;
  --ds-primary: #7db7e6;
  --ds-primary-strong: #b8dbf6;
  --ds-accent: #f2c14e;
  --ds-good: #65c49b;
  --ds-warn: #d28a35;
  --ds-danger: #ff9b9b;
  --ds-danger-strong: #ffc4c4;
  --ds-calendar-active-context: #f0abfc;
  --ds-calendar-active-context-text: #18051d;
  --ds-calendar-active-context-border: #f5d0fe;
  --ds-calendar-active-context-subtle: #3b1142;
  --ds-hero-overlay-a: rgba(8, 13, 22, .94);
  --ds-hero-overlay-b: rgba(8, 13, 22, .84);
  --bs-body-color: var(--ds-ink);
  --bs-body-bg: var(--ds-soft);
  --bs-secondary-color: var(--ds-muted);
  --bs-border-color: var(--ds-line);
  --bs-link-color: var(--ds-primary);
  --ds-toggler-filter: invert(1) grayscale(1);
  --ds-sidebar-bg: #152238;
  --ds-sidebar-ink: #e8edf5;
  --ds-sidebar-muted: rgba(255, 255, 255, .62);
  --ds-sidebar-hover: rgba(255, 255, 255, .1);
  --ds-focus-ring: #7dd3fc;
  --ds-focus-ring-outer: #07111e;
  --ds-sidebar-active: rgba(125, 183, 230, .22);
  color-scheme: dark;
}

html {
  font-size: 16px;
}

body {
  margin: 0;
  color: var(--ds-ink);
  background: var(--ds-soft);
  font-family: Inter, Segoe UI, Arial, sans-serif;
}

a {
  color: var(--ds-primary);
}

input,
select,
button,
textarea {
  font: inherit;
}

input,
select,
textarea,
.form-control,
.form-select {
  background-color: var(--ds-surface);
  border-color: var(--ds-line);
  color: var(--ds-ink);
}

input::placeholder,
textarea::placeholder,
.form-control::placeholder {
  color: var(--ds-muted);
}

option {
  background: var(--ds-surface);
  color: var(--ds-ink);
}

.btn-primary {
  background-color: var(--ds-primary);
  border-color: var(--ds-primary);
  color: var(--ds-surface);
}

:root[data-theme="dark"] .btn-primary {
  color: #07111e;
}

.btn-outline-primary,
.btn-outline-secondary {
  border-color: var(--ds-primary);
  color: var(--ds-primary-strong);
  background: transparent;
}

.btn-outline-primary:hover,
.btn-outline-secondary:hover {
  background: var(--ds-primary);
  border-color: var(--ds-primary);
  color: var(--ds-surface);
}

.btn-danger {
  background: var(--ds-danger);
  border-color: var(--ds-danger);
  color: var(--ds-surface);
}

:root[data-theme="dark"] .btn-danger {
  color: #07111e;
}

:root[data-theme="dark"] .btn-outline-primary:hover,
:root[data-theme="dark"] .btn-outline-secondary:hover {
  color: #07111e;
}

.text-danger,
.validation-summary,
.field-validation-error {
  color: var(--ds-danger-strong) !important;
}

.ds-navbar {
  background: var(--ds-surface);
  border-bottom: 1px solid var(--ds-line);
}

.navbar-brand {
  color: var(--ds-ink);
  font-weight: 750;
}

.navbar-nav .nav-link,
.navbar-nav .nav-link:focus,
.navbar-nav .nav-link:hover {
  color: var(--ds-ink);
}

.navbar-toggler {
  border-color: var(--ds-line);
  color: var(--ds-ink);
}

.navbar-toggler-icon {
  filter: var(--ds-toggler-filter);
}

.public-shell {
  min-height: calc(100vh - 122px);
}

.public-hero {
  min-height: 68vh;
  display: flex;
  align-items: center;
  padding: clamp(3rem, 7vw, 6rem);
  background:
    linear-gradient(90deg, var(--ds-hero-overlay-a), var(--ds-hero-overlay-b)),
    url("/icons/dragonstar-icon.svg") right 12% center / min(34vw, 22rem) no-repeat,
    #152238;
  color: white;
}

.public-hero h1 {
  font-size: clamp(3rem, 8vw, 7rem);
  line-height: .95;
  margin: .3rem 0 1rem;
}

.lead {
  max-width: 42rem;
  color: #e8edf5;
}

.hero-actions {
  display: flex;
  flex-wrap: wrap;
  gap: .75rem;
  margin-top: 1.5rem;
}

.public-band,
.narrow-page {
  max-width: 1180px;
  margin: 0 auto;
  padding: 3rem 1rem;
}

.signal-grid,
.module-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
  gap: 1rem;
}

.signal-grid > *,
.module-card {
  background: var(--ds-surface);
  border: 1px solid var(--ds-line);
  border-radius: 8px;
  padding: 1rem;
}

.portal-frame {
  min-height: 100vh;
  display: grid;
  grid-template-columns: 260px minmax(0, 1fr);
  max-width: 100vw;
  overflow-x: clip;
}

.portal-sidebar {
  background: var(--ds-sidebar-bg);
  color: var(--ds-sidebar-ink);
  border-right: 1px solid var(--ds-line);
  padding: 1rem;
  position: sticky;
  top: 0;
  height: 100vh;
  display: flex;
  flex-direction: column;
  overflow: hidden;
}

.sidebar-brand {
  display: block;
  color: var(--ds-sidebar-ink);
  font-weight: 750;
  margin-bottom: 1rem;
  text-decoration: none;
}

.portal-sidebar nav:not(.sidebar-nav) {
  display: grid;
  gap: .25rem;
}

.portal-sidebar a {
  color: var(--ds-sidebar-ink);
  border-radius: 6px;
  padding: .55rem .7rem;
  text-decoration: none;
}

.portal-sidebar a:hover {
  background: var(--ds-sidebar-hover);
}

.portal-main {
  min-width: 0;
  max-width: 100%;
}

.portal-topbar {
  min-height: 64px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  padding: .75rem 1rem;
  background: var(--ds-surface);
  border-bottom: 1px solid var(--ds-line);
}

.mobile-sidebar-button,
.sidebar-scrim {
  display: none;
}

:root[data-topbar-pinned="true"] .portal-topbar {
  position: sticky;
  top: 0;
  z-index: 24;
  box-shadow: 0 10px 28px rgba(23, 32, 51, .12);
}

[data-topbar-pin][aria-pressed="true"] {
  background: var(--ds-primary);
  color: var(--ds-surface);
}

.topbar-actions {
  display: flex;
  align-items: center;
  gap: .5rem;
  flex-wrap: wrap;
}

.global-search input {
  width: min(42vw, 28rem);
  border: 1px solid var(--ds-line);
  border-radius: 8px;
  padding: .55rem .75rem;
}

.portal-content {
  padding: 1.25rem;
  min-width: 0;
  max-width: 100%;
}

.dashboard-header {
  display: flex;
  justify-content: space-between;
  gap: 1rem;
  align-items: start;
  margin-bottom: 1rem;
}

.module-card {
  display: grid;
  gap: .5rem;
}

.module-icon {
  width: 2.25rem;
  height: 2.25rem;
  display: grid;
  place-items: center;
  border-radius: 8px;
  background: color-mix(in srgb, var(--ds-primary) 18%, var(--ds-surface));
  color: var(--ds-primary-strong);
  font-size: .85rem;
  font-weight: 700;
  overflow: hidden;
  text-transform: uppercase;
  white-space: nowrap;
}

.module-meta,
.module-navbar {
  display: flex;
  flex-wrap: wrap;
  gap: .5rem;
}

.module-meta span,
.chip,
.status-pill {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: max-content;
  max-width: 100%;
  min-height: 1.8rem;
  border: 1px solid var(--ds-line);
  border-radius: 999px;
  background: var(--ds-surface);
  color: var(--ds-muted);
  padding: .2rem .55rem;
  font-size: .85rem;
  line-height: 1.2;
  white-space: nowrap;
}

.module-layout {
  display: grid;
  gap: 1rem;
}

.surface-panel,
.metric-card,
.list-card {
  background: var(--ds-surface);
  border: 1px solid var(--ds-line);
  border-radius: 8px;
  padding: 1rem;
}

.surface-panel {
  overflow: clip;
}

.dashboard-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(14rem, 1fr));
  gap: 1rem;
}

.content-grid.two-column {
  display: grid;
  grid-template-columns: minmax(0, 1.35fr) minmax(18rem, .65fr);
  gap: 1rem;
  align-items: start;
}

.metric-card {
  display: grid;
  gap: .25rem;
}

.metric-card span,
.section-kicker {
  color: var(--ds-primary-strong);
  font-size: .78rem;
  font-weight: 900;
  letter-spacing: .08em;
  text-transform: uppercase;
}

.metric-card strong {
  font-size: 2rem;
  line-height: 1;
}

.metric-card small,
.text-muted {
  color: var(--ds-muted) !important;
}

.stack-list {
  display: grid;
  gap: .75rem;
}

.lift-card {
  transition: transform .16s ease, border-color .16s ease, box-shadow .16s ease;
}

.lift-card:hover {
  transform: translateY(-3px) scale(1.01);
  border-color: color-mix(in srgb, var(--ds-primary) 42%, var(--ds-line));
  box-shadow: 0 16px 34px color-mix(in srgb, var(--ds-ink) 13%, transparent);
}

.dragon-table {
  --bs-table-bg: transparent;
  --bs-table-color: var(--ds-text);
  --bs-table-border-color: var(--ds-line);
  --bs-table-hover-bg: color-mix(in srgb, var(--ds-primary) 8%, transparent);
  --bs-table-hover-color: var(--ds-text);
  color: var(--ds-text);
  margin-bottom: 0;
}

.dragon-table.table {
  color: var(--ds-text);
}

.dragon-table thead th {
  background: color-mix(in srgb, var(--ds-surface) 70%, var(--ds-bg));
  border-bottom: 1px solid var(--ds-line);
  color: var(--ds-muted);
  font-size: .82rem;
  text-transform: uppercase;
}

.dragon-table td,
.dragon-table th {
  border-color: var(--ds-line);
  color: var(--ds-text);
  padding: .8rem .75rem;
}

.dragon-table td strong {
  color: var(--ds-heading);
}

.dragon-table .text-muted,
.dragon-table small,
.dragon-table span:not(.status-pill) {
  color: var(--ds-muted) !important;
}

.wfm-grid {
  grid-template-columns: minmax(220px, 280px) minmax(0, 1fr);
  align-items: start;
}

.wfm-sidebar {
  position: sticky;
  top: calc(var(--topbar-height, 64px) + 12px);
}

.wfm-main {
  min-width: 0;
}

.wfm-nav-link {
  display: flex;
  align-items: center;
  min-height: 38px;
  padding: 0.55rem 0.7rem;
  border: 1px solid transparent;
  border-radius: 8px;
  color: var(--ds-text);
  text-decoration: none;
  transition: transform 160ms ease, background-color 160ms ease, border-color 160ms ease;
}

.wfm-nav-link:hover,
.wfm-nav-link:focus {
  transform: translateY(-1px);
  border-color: var(--ds-line-strong);
  background: color-mix(in srgb, var(--ds-primary) 10%, transparent);
  color: var(--ds-heading);
}

.wfm-nav-link.active {
  border-color: var(--ds-primary);
  background: color-mix(in srgb, var(--ds-primary) 16%, var(--ds-surface));
  color: var(--ds-heading);
  font-weight: 750;
}

@media (max-width: 900px) {
  .wfm-grid {
    grid-template-columns: 1fr;
  }

  .wfm-sidebar {
    position: static;
  }

  .wfm-sidebar .stack-list {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

.dragon-table tbody tr {
  transition: background-color .16s ease;
}

.dragon-table tbody tr:hover {
  background: color-mix(in srgb, var(--ds-primary) 8%, transparent);
}

.module-navbar {
  border-bottom: 1px solid var(--ds-line);
  padding-bottom: .75rem;
}

@media (max-width: 900px) {
  .content-grid.two-column {
    grid-template-columns: 1fr;
  }
}

.module-dashboard h1,
.dashboard-header h1,
.narrow-page h1 {
  font-size: clamp(2rem, 4vw, 3rem);
}

.breadcrumbs {
  display: flex;
  gap: .5rem;
  padding: .65rem 1rem;
  background: color-mix(in srgb, var(--ds-primary) 12%, var(--ds-surface));
  border-bottom: 1px solid var(--ds-line);
  font-size: .9rem;
}

.account-page {
  min-height: 100vh;
  display: grid;
  place-items: center;
  padding: 1rem;
}

.account-panel {
  width: min(100%, 30rem);
  background: var(--ds-surface);
  border: 1px solid var(--ds-line);
  border-radius: 8px;
  padding: 1.25rem;
}

.account-panel-wide {
  width: min(100%, 52rem);
}

.account-panel form {
  display: grid;
  gap: .65rem;
}

.account-links {
  display: flex;
  justify-content: space-between;
  gap: 1rem;
  flex-wrap: wrap;
  font-weight: 700;
}

.account-panel input {
  border: 1px solid var(--ds-line);
  border-radius: 8px;
  padding: .65rem .75rem;
}

.environment-badge {
  position: fixed;
  z-index: 10;
  right: .75rem;
  bottom: .75rem;
  background: var(--ds-warn);
  color: #07111e;
  border-radius: 999px;
  padding: .3rem .65rem;
  font-size: .8rem;
  box-shadow: 0 8px 24px rgba(23, 32, 51, .2);
}

.icon-button {
  width: 2rem;
  height: 2rem;
  border: 1px solid var(--ds-line);
  border-radius: 8px;
  background: var(--ds-surface);
  color: var(--ds-ink);
}

.theme-toggle {
  border: 1px solid var(--ds-line);
  border-radius: 999px;
  background: var(--ds-surface);
  color: var(--ds-ink);
  padding: .35rem .7rem;
}

.user-menu {
  display: flex;
  align-items: center;
  gap: .5rem;
}

.mobile-navbar {
  display: none;
}

.site-footer {
  display: flex;
  justify-content: space-between;
  gap: 1rem;
  padding: 1rem;
  border-top: 1px solid var(--ds-line);
  background: var(--ds-surface);
  color: var(--ds-muted);
}

.status-banner {
  border: 1px solid color-mix(in srgb, var(--ds-good) 35%, var(--ds-line));
  background: color-mix(in srgb, var(--ds-good) 10%, var(--ds-surface));
  color: var(--ds-ink);
  padding: .8rem 1rem;
  margin: 1rem 0;
  border-radius: 8px;
}

.status-banner-danger {
  border-color: var(--ds-danger);
  background: color-mix(in srgb, var(--ds-danger) 12%, var(--ds-surface));
}

.qr-panel {
  display: grid;
  place-items: center;
  padding: 1rem;
  border: 1px solid var(--ds-line);
  border-radius: 8px;
  background: #fff;
}

.qr-panel img {
  width: min(280px, 100%);
  height: auto;
}

.copy-token {
  padding: 1rem;
  border: 1px dashed var(--ds-line);
  border-radius: 8px;
  background: var(--ds-surface-muted);
  color: var(--ds-ink);
  font-family: ui-monospace, SFMono-Regular, Consolas, monospace;
  font-size: 1.1rem;
  font-weight: 800;
  overflow-wrap: anywhere;
}

.recovery-code-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
  gap: .75rem;
}

.recovery-code-grid code {
  display: block;
  padding: .85rem 1rem;
  border: 1px solid var(--ds-line);
  border-radius: 8px;
  background: var(--ds-surface-muted);
  color: var(--ds-ink);
  font-size: 1rem;
  font-weight: 800;
  text-align: center;
}

.admin-inline-form {
  display: grid;
  grid-template-columns: minmax(14rem, 1fr) minmax(9rem, .4fr) auto;
  gap: .75rem;
  align-items: end;
}

.admin-table {
  display: grid;
  border: 1px solid var(--ds-line);
  border-radius: 8px;
  overflow: hidden;
  background: var(--ds-surface);
}

.admin-table-row {
  display: grid;
  grid-template-columns: minmax(14rem, 1.5fr) 1fr 1fr minmax(14rem, 1.4fr);
  gap: 1rem;
  align-items: center;
  padding: .85rem 1rem;
  border-top: 1px solid var(--ds-line);
}

.admin-table-row:first-child {
  border-top: 0;
}

.admin-table-head {
  background: var(--ds-soft);
  color: var(--ds-muted);
  font-weight: 700;
}

.admin-table small {
  display: block;
  color: var(--ds-muted);
}

.admin-actions {
  display: flex;
  flex-wrap: wrap;
  gap: .5rem;
}

.btn-sm {
  padding: .35rem .6rem;
  font-size: .9rem;
}

.btn-outline-danger {
  border: 1px solid var(--ds-danger);
  color: var(--ds-danger-strong);
  background: transparent;
}

.btn-outline-danger:hover {
  background: var(--ds-danger);
  color: var(--ds-surface);
}

:root[data-theme="dark"] .btn-outline-danger:hover {
  color: #07111e;
}

.offline-page {
  max-width: 42rem;
  margin: 10vh auto;
  padding: 1rem;
}

.eyebrow {
  margin: 0 0 .35rem;
  color: var(--ds-primary-strong);
  font-size: .78rem;
  font-weight: 800;
  letter-spacing: .08em;
  text-transform: uppercase;
}

.btn,
button.btn {
  border-radius: 8px;
  font-weight: 700;
  transform-origin: center;
  transition: transform .16s ease, box-shadow .16s ease, background-color .16s ease, border-color .16s ease;
}

.btn-action {
  min-height: 2.55rem;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: .45rem;
  padding: .58rem .9rem;
  white-space: nowrap;
  line-height: 1.1;
}

.module-card,
.profile-panel,
.signal-grid > *,
.account-panel,
.user-menu-button,
.theme-switch,
.icon-button {
  transform-origin: center;
  transition: transform .16s ease, box-shadow .16s ease, border-color .16s ease;
}

.module-card:hover,
.profile-panel:hover,
.signal-grid > *:hover,
.account-panel:hover {
  transform: translateY(-4px) scale(1.012);
  border-color: color-mix(in srgb, var(--ds-primary) 45%, var(--ds-line));
  box-shadow: 0 16px 36px rgba(23, 32, 51, .12);
}

.btn:hover,
.user-menu-button:hover,
.theme-switch:hover,
.icon-button:hover {
  transform: translateY(-2px) scale(1.015);
}

@media (prefers-reduced-motion: reduce) {
  *,
  *::before,
  *::after {
    animation-duration: .01ms !important;
    animation-iteration-count: 1 !important;
    scroll-behavior: auto !important;
    transition-duration: .01ms !important;
  }

  .module-card:hover,
  .profile-panel:hover,
  .signal-grid > *:hover,
  .account-panel:hover,
  .btn:hover,
  .user-menu-button:hover,
  .theme-switch:hover,
  .icon-button:hover {
    animation: none;
    transform: none;
  }
}

@media (forced-colors: active) {
  .skip-link,
  a:focus-visible,
  button:focus-visible,
  input:focus-visible,
  select:focus-visible,
  textarea:focus-visible,
  [tabindex]:not([tabindex="-1"]):focus-visible,
  [role="button"]:focus-visible,
  [role="menuitem"]:focus-visible {
    forced-color-adjust: auto;
    outline: 2px solid Highlight;
    box-shadow: none;
  }

  .skip-link {
    color: HighlightText;
    background: Highlight;
    border-color: CanvasText;
  }
}

.header-actions,
.section-heading {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: .75rem;
  flex-wrap: wrap;
}

.section-heading {
  margin-bottom: 1rem;
}

.section-heading h2 {
  margin: 0;
}

.theme-switch {
  width: 3.35rem;
  height: 2rem;
  border: 1px solid var(--ds-line);
  border-radius: 999px;
  background: var(--ds-surface);
  color: var(--ds-ink);
  padding: .15rem;
}

.theme-switch-track {
  position: relative;
  display: block;
  height: 100%;
  border-radius: inherit;
  background: color-mix(in srgb, var(--ds-primary) 14%, var(--ds-soft));
}

.theme-switch-thumb {
  position: absolute;
  top: .14rem;
  left: .14rem;
  width: 1.42rem;
  height: 1.42rem;
  display: grid;
  place-items: center;
  border-radius: 50%;
  background: var(--ds-surface);
  border: 1px solid var(--ds-line);
  color: var(--ds-primary-strong);
  font-size: .72rem;
  font-weight: 900;
  transition: transform .18s ease;
}

:root[data-theme="dark"] .theme-switch-thumb {
  transform: translateX(1.3rem);
}

.portal-frame {
  transition: grid-template-columns .18s ease;
}

body.sidebar-collapsed .portal-frame {
  grid-template-columns: 96px minmax(0, 1fr);
}

.sidebar-header {
  display: grid;
  gap: .75rem;
  margin-bottom: 1rem;
}

.sidebar-brand {
  display: flex;
  align-items: center;
  gap: .65rem;
  min-height: 2.4rem;
}

.sidebar-logo,
.nav-icon {
  width: 2.25rem;
  height: 2.25rem;
  flex: 0 0 2.25rem;
  display: grid;
  place-items: center;
  border-radius: 8px;
  background: var(--ds-sidebar-hover);
  border: 1px solid color-mix(in srgb, var(--ds-sidebar-ink) 12%, transparent);
  color: var(--ds-sidebar-ink);
  font-weight: 850;
  font-size: .78rem;
}

.nav-icon svg,
.icon-button svg {
  width: 1.05rem;
  height: 1.05rem;
  fill: currentColor;
}

.sidebar-controls {
  display: flex;
  gap: .45rem;
}

.sidebar-controls .icon-button {
  background: rgba(255, 255, 255, .08);
  color: var(--ds-sidebar-ink);
  border-color: rgba(255, 255, 255, .18);
}

body.sidebar-pinned [data-sidebar-pin] {
  background: var(--ds-accent);
  color: #07111e;
}

.sidebar-nav {
  display: flex;
  flex-direction: column;
  align-items: stretch;
  justify-content: flex-start;
  gap: .25rem;
  flex: 1 1 auto;
  min-height: 0;
  max-height: calc(100vh - 8rem);
  overflow: auto;
  padding-right: .15rem;
  scrollbar-width: thin;
  scrollbar-color: rgba(255, 255, 255, .45) transparent;
}

.portal-sidebar .sidebar-nav a {
  display: flex;
  align-items: center;
  gap: .65rem;
  min-height: 2.75rem;
}

.portal-sidebar a.active {
  background: var(--ds-sidebar-active);
  color: var(--ds-sidebar-ink);
  box-shadow: inset 3px 0 0 var(--ds-accent);
}

.sidebar-footer {
  flex: 0 0 auto;
  padding-top: .75rem;
  border-top: 1px solid rgba(255, 255, 255, .12);
}

.sidebar-footer a {
  display: flex;
  align-items: center;
  gap: .65rem;
  min-height: 2.75rem;
  color: var(--ds-sidebar-ink);
  border-radius: 6px;
  padding: .55rem .7rem;
  text-decoration: none;
}

.sidebar-section {
  margin: .9rem .2rem .35rem;
  color: var(--ds-sidebar-muted);
  font-size: .72rem;
  font-weight: 800;
  text-transform: uppercase;
}

body.sidebar-collapsed .sidebar-label {
  display: none;
}

body.sidebar-collapsed .portal-sidebar {
  padding-inline: .75rem;
}

body.sidebar-collapsed .sidebar-controls {
  display: grid;
}

body.sidebar-collapsed .sidebar-nav {
  max-height: calc(100vh - 11rem);
  padding-right: 0;
  scrollbar-width: none;
}

body.sidebar-collapsed .sidebar-nav::-webkit-scrollbar {
  width: 0;
  height: 0;
}

body.sidebar-collapsed .portal-sidebar .sidebar-nav a,
body.sidebar-collapsed .sidebar-footer a {
  justify-content: center;
  padding-inline: .35rem;
}

.global-search {
  position: relative;
  width: min(42vw, 32rem);
}

.global-search input {
  width: 100%;
  min-height: 2.55rem;
  padding-left: 2.35rem;
  background:
    linear-gradient(transparent, transparent),
    var(--ds-surface);
  box-shadow: 0 1px 0 rgba(23, 32, 51, .04);
}

.global-search::before {
  content: "S";
  position: absolute;
  left: .75rem;
  top: .68rem;
  color: var(--ds-muted);
  font-size: .78rem;
  font-weight: 900;
  z-index: 1;
}

.search-results,
.dropdown-panel,
.search-select-panel {
  position: absolute;
  z-index: 30;
  border: 1px solid var(--ds-line);
  border-radius: 8px;
  background: var(--ds-surface);
  color: var(--ds-ink);
  box-shadow: 0 18px 48px rgba(23, 32, 51, .18);
}

.search-results {
  left: 0;
  right: 0;
  top: calc(100% + .35rem);
  display: none;
  max-height: 24rem;
  overflow: auto;
  padding: .35rem;
}

.global-search.is-open .search-results {
  display: grid;
}

.search-results a,
.dropdown-panel a,
.dropdown-panel button {
  display: grid;
  gap: .12rem;
  width: 100%;
  border: 0;
  border-radius: 7px;
  background: transparent;
  color: var(--ds-ink);
  padding: .7rem .8rem;
  text-align: left;
  text-decoration: none;
}

.search-results a:hover,
.dropdown-panel a:hover,
.dropdown-panel button:hover,
.search-select-option:hover {
  background: color-mix(in srgb, var(--ds-primary) 12%, var(--ds-surface));
}

.search-results small,
.dropdown-panel small,
.field-hint {
  color: var(--ds-muted);
}

.user-menu {
  position: relative;
}

.user-menu-button {
  min-height: 2.75rem;
  display: flex;
  align-items: center;
  gap: .6rem;
  border: 1px solid var(--ds-line);
  border-radius: 8px;
  background: var(--ds-surface);
  color: var(--ds-ink);
  padding: .25rem .5rem;
}

.user-menu-text {
  display: grid;
  line-height: 1.15;
  text-align: left;
}

.user-menu-text small {
  max-width: 14rem;
  overflow: hidden;
  color: var(--ds-muted);
  text-overflow: ellipsis;
  white-space: nowrap;
}

.chevron {
  color: var(--ds-muted);
  font-size: .8rem;
}

.dropdown-panel {
  right: 0;
  top: calc(100% + .45rem);
  display: none;
  min-width: 18rem;
  padding: .4rem;
}

[data-dropdown].is-open .dropdown-panel {
  display: block;
}

.dropdown-user {
  display: flex;
  align-items: center;
  gap: .75rem;
  padding: .7rem .8rem;
  border-bottom: 1px solid var(--ds-line);
  margin-bottom: .35rem;
}

.avatar {
  width: 3rem;
  height: 3rem;
  display: grid;
  place-items: center;
  overflow: hidden;
  border-radius: 50%;
  background: color-mix(in srgb, var(--ds-primary) 16%, var(--ds-surface));
  color: var(--ds-primary-strong);
  border: 1px solid var(--ds-line);
  font-weight: 850;
}

.avatar-sm {
  width: 2rem;
  height: 2rem;
  font-size: .78rem;
}

.avatar-xl {
  width: clamp(5rem, 9vw, 7rem);
  height: clamp(5rem, 9vw, 7rem);
  font-size: 1.4rem;
}

.avatar img,
.avatar-crop-frame img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.module-card {
  min-height: 16rem;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
}

.module-card-body {
  display: grid;
  gap: .65rem;
}

.module-card-top {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: .75rem;
}

.module-card h2,
.module-card h3 {
  display: flex;
  align-items: center;
  gap: .5rem;
  margin: 0;
  font-size: 1.2rem;
  line-height: 1.25;
}

.module-card p {
  color: var(--ds-muted);
  display: -webkit-box;
  margin: 0;
  overflow: hidden;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 3;
}

.module-card-footer {
  display: flex;
  align-items: center;
  justify-content: flex-start;
  padding-top: .85rem;
}

.module-card-footer .btn-action {
  min-width: 8.5rem;
}

.attention-count,
.attention-badge {
  display: inline-grid;
  place-items: center;
  min-width: 1.45rem;
  height: 1.45rem;
  padding: 0 .38rem;
  border-radius: 999px;
  background: var(--ds-primary);
  color: #06111f;
  font-size: .72rem;
  font-weight: 850;
  line-height: 1;
  white-space: nowrap;
}

.portal-sidebar a .attention-count,
.sidebar-app-grid a .attention-count {
  margin-left: auto;
}

body.sidebar-collapsed .portal-sidebar a .attention-count {
  position: absolute;
  top: .15rem;
  right: .1rem;
  min-width: 1rem;
  height: 1rem;
  padding: 0 .25rem;
  font-size: .58rem;
}

.notification-menu {
  position: relative;
}

.notification-button {
  position: relative;
}

.notification-button .attention-badge {
  position: absolute;
  top: -.45rem;
  right: -.45rem;
  min-width: 1.2rem;
  height: 1.2rem;
  padding: 0 .28rem;
  font-size: .62rem;
}

.notification-panel {
  position: absolute;
  top: calc(100% + .55rem);
  right: 0;
  z-index: 1080;
  display: none;
  width: min(26rem, calc(100vw - 1.5rem));
  max-height: min(34rem, calc(100vh - 5.5rem));
  overflow: auto;
  padding: .85rem;
  border: 1px solid var(--ds-line);
  border-radius: 8px;
  background: var(--ds-surface);
  color: var(--ds-ink);
  box-shadow: 0 1.2rem 3rem rgba(0, 0, 0, .28);
}

.notification-menu.is-open .notification-panel {
  display: grid;
  gap: .8rem;
}

.notification-panel-header,
.notification-group-heading,
.notification-item {
  display: flex;
  align-items: center;
  gap: .65rem;
}

.notification-panel-header {
  justify-content: space-between;
  border-bottom: 1px solid var(--ds-line);
  padding-bottom: .7rem;
}

.notification-panel-header strong {
  display: block;
  line-height: 1.2;
}

.notification-empty {
  margin: 0;
  color: var(--ds-muted);
}

.notification-group {
  display: grid;
  gap: .5rem;
}

.notification-group-heading {
  font-weight: 850;
}

.notification-items {
  display: grid;
  gap: .4rem;
}

.notification-item {
  justify-content: space-between;
  padding: .7rem;
  border: 1px solid var(--ds-line);
  border-radius: 8px;
  background: color-mix(in srgb, var(--ds-surface) 86%, var(--ds-primary) 14%);
  color: var(--ds-ink);
  text-decoration: none;
}

.notification-item:hover,
.notification-item:focus-visible {
  border-color: var(--ds-primary);
  color: var(--ds-ink);
  text-decoration: none;
}

.notification-item span:first-child {
  display: grid;
  gap: .15rem;
  min-width: 0;
}

.notification-item small {
  color: var(--ds-muted);
  line-height: 1.35;
}

.profile-hero,
.profile-panel,
.form-savebar {
  background: var(--ds-surface);
  border: 1px solid var(--ds-line);
  border-radius: 8px;
}

.profile-hero {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  padding: 1.2rem;
  margin-bottom: 1rem;
}

.profile-identity {
  display: flex;
  align-items: center;
  gap: 1rem;
  min-width: 0;
}

.profile-identity h1 {
  margin: 0;
  font-size: clamp(1.8rem, 4vw, 2.65rem);
}

.profile-identity p:not(.eyebrow) {
  color: var(--ds-muted);
  margin: .2rem 0 .55rem;
}

.profile-shell {
  display: grid;
  grid-template-columns: minmax(18rem, .8fr) minmax(24rem, 1.2fr);
  gap: 1rem;
}

.profile-panel {
  padding: 1rem;
}

.panel-heading {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  margin-bottom: 1rem;
}

.panel-heading h2 {
  margin: 0;
  font-size: 1.25rem;
}

.avatar-editor form {
  display: grid;
  gap: .9rem;
}

.avatar-crop-frame {
  position: relative;
  width: min(100%, 18rem);
  aspect-ratio: 1;
  display: grid;
  place-items: center;
  justify-self: center;
  overflow: hidden;
  border-radius: 50%;
  background:
    linear-gradient(45deg, color-mix(in srgb, var(--ds-line) 65%, transparent) 25%, transparent 25%),
    linear-gradient(-45deg, color-mix(in srgb, var(--ds-line) 65%, transparent) 25%, transparent 25%),
    var(--ds-soft);
  background-size: 1rem 1rem;
  border: 1px solid var(--ds-line);
}

.avatar-crop-frame img {
  position: absolute;
  left: 50%;
  top: 50%;
  width: auto;
  height: auto;
  max-width: 100%;
  max-height: 100%;
  transform: translate(-50%, -50%) scale(1);
  transform-origin: center;
}

.avatar-crop-frame img:not(.has-image) {
  display: none;
}

.avatar-crop-frame span {
  font-size: 2.4rem;
  font-weight: 900;
  color: var(--ds-primary-strong);
}

.file-drop {
  position: relative;
  display: grid;
  gap: .15rem;
  padding: .9rem;
  border: 1px dashed var(--ds-line);
  border-radius: 8px;
  background: var(--ds-soft);
  cursor: pointer;
}

.file-drop.is-dragover {
  border-color: var(--ds-primary);
  background: color-mix(in srgb, var(--ds-primary) 12%, var(--ds-soft));
}

.file-drop input {
  position: absolute;
  width: 1px;
  height: 1px;
  overflow: hidden;
  opacity: 0;
  pointer-events: none;
}

.file-picker-row {
  min-height: 2.65rem;
  display: flex;
  align-items: center;
  gap: .75rem;
  margin-top: .5rem;
  border: 1px solid var(--ds-line);
  border-radius: 8px;
  background: var(--ds-surface);
  padding: .25rem;
}

.file-picker-button {
  min-height: 2.1rem;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 7px;
  background: var(--ds-primary);
  color: var(--ds-surface);
  padding: .45rem .75rem;
  font-weight: 800;
  white-space: nowrap;
}

:root[data-theme="dark"] .file-picker-button {
  color: #07111e;
}

.file-picker-name {
  min-width: 0;
  overflow: hidden;
  color: var(--ds-ink);
  text-overflow: ellipsis;
  white-space: nowrap;
}

.avatar-actions {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: .75rem;
}

.appearance-theme-grid {
  display: grid;
  gap: 1rem;
}

.theme-preview-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: .5rem;
}

.theme-preview {
  min-height: 3.25rem;
  border: 1px solid var(--ds-line);
  border-radius: 8px;
}

.theme-preview-primary {
  background: var(--ds-primary);
}

.theme-preview-accent {
  background: var(--ds-accent);
}

.theme-preview-surface {
  background: linear-gradient(135deg, var(--ds-surface), var(--ds-soft));
}

.company-map-panel {
  grid-column: 1 / -1;
}

.company-map {
  display: grid;
  gap: 1.25rem;
  justify-items: center;
}

.company-node {
  position: relative;
  min-width: min(100%, 14rem);
  display: grid;
  gap: .2rem;
  justify-items: center;
  border: 1px solid var(--ds-line);
  border-radius: 8px;
  background: var(--ds-soft);
  padding: .85rem;
  text-align: center;
}

.company-node span {
  width: 2.3rem;
  height: 2.3rem;
  display: grid;
  place-items: center;
  border-radius: 8px;
  background: color-mix(in srgb, var(--ds-primary) 18%, var(--ds-surface));
  color: var(--ds-primary-strong);
  font-size: .8rem;
  font-weight: 900;
}

.company-node small {
  color: var(--ds-muted);
}

.company-node-hq {
  background: color-mix(in srgb, var(--ds-primary) 9%, var(--ds-surface));
}

.company-map-branches {
  position: relative;
  width: 100%;
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(13rem, 1fr));
  gap: 1rem;
  padding-top: 1.25rem;
}

.company-map-branches::before {
  content: "";
  position: absolute;
  left: 50%;
  top: 0;
  width: 1px;
  height: 1.25rem;
  background: var(--ds-line);
}

.documents-hero,
.documents-panel,
.documents-main,
.document-stats article {
  background: var(--ds-surface);
  border: 1px solid var(--ds-line);
  border-radius: 8px;
}

.documents-hero {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 1rem;
  padding: 1rem;
  margin-bottom: 1rem;
}

.documents-hero-actions,
.toolbar-actions {
  display: flex;
  align-items: center;
  gap: .65rem;
  flex-wrap: wrap;
}

.documents-hero h1 {
  margin: 0;
  font-size: clamp(1.9rem, 4vw, 2.8rem);
}

.documents-hero p:not(.eyebrow) {
  color: var(--ds-muted);
  margin: .35rem 0 0;
}

.documents-search {
  display: flex;
  align-items: center;
  gap: .5rem;
}

.documents-search input {
  min-height: 2.55rem;
  min-width: min(50vw, 22rem);
  border: 1px solid var(--ds-line);
  border-radius: 8px;
  background: var(--ds-surface);
  color: var(--ds-ink);
  padding: .6rem .75rem;
}

.document-stats {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 1rem;
  margin-bottom: 1rem;
}

.document-stats article {
  display: grid;
  gap: .15rem;
  padding: 1rem;
}

.document-stats strong {
  font-size: 1.55rem;
}

.document-stats span {
  color: var(--ds-muted);
}

.documents-workspace,
.documents-browser {
  display: grid;
  grid-template-columns: minmax(18rem, .45fr) minmax(32rem, 1.55fr);
  gap: 1rem;
}

.documents-panel,
.documents-main {
  padding: 1rem;
  min-width: 0;
}

.stack-form {
  display: grid;
  gap: .85rem;
  margin-bottom: 1.25rem;
}

.document-toolbar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: .75rem;
  margin-bottom: 1rem;
}

.folder-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(12rem, 1fr));
  gap: .75rem;
  margin-bottom: 1rem;
}

.folder-tile {
  display: grid;
  gap: .4rem;
  border: 1px solid var(--ds-line);
  border-radius: 8px;
  background: var(--ds-soft);
  color: var(--ds-ink);
  padding: .85rem;
  text-decoration: none;
  min-width: 0;
}

.folder-tile strong,
.tree-item span:last-child,
.document-name-stack strong,
.document-name-stack small {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.tree-list {
  display: grid;
  gap: .02rem;
  padding: .35rem;
  border: 1px solid color-mix(in srgb, var(--ds-line) 82%, transparent);
  border-radius: 8px;
  background:
    linear-gradient(90deg, color-mix(in srgb, var(--ds-line) 24%, transparent) 1px, transparent 1px) 1.86rem 0 / 1.35rem 100% no-repeat,
    color-mix(in srgb, var(--ds-soft) 72%, var(--ds-surface));
}

.tree-row {
  position: relative;
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  border: 1px solid transparent;
  border-radius: 4px;
  padding: .08rem .18rem .08rem calc(.2rem + var(--tree-indent, 0rem));
  min-width: 0;
}

.tree-item {
  position: relative;
  display: grid;
  grid-template-columns: 1rem 1.45rem minmax(0, 1fr);
  gap: .45rem;
  align-items: center;
  min-height: 2.15rem;
  color: var(--ds-ink);
  text-decoration: none;
  border-radius: 4px;
  padding: .18rem .3rem;
  min-width: 0;
}

.tree-row[data-folder-depth]:not([data-folder-depth="0"])::before {
  content: "";
  position: absolute;
  left: calc(.82rem + var(--tree-guide, 0rem));
  top: -.25rem;
  bottom: 50%;
  width: 1px;
  background: color-mix(in srgb, var(--ds-line) 70%, transparent);
}

.tree-row[data-folder-depth]:not([data-folder-depth="0"]) .tree-item::before {
  content: "";
  position: absolute;
  left: calc(-.58rem);
  top: 50%;
  width: .58rem;
  height: 1px;
  background: color-mix(in srgb, var(--ds-line) 70%, transparent);
}

.tree-expander {
  display: inline-grid;
  place-items: center;
  width: 1rem;
  color: var(--ds-muted);
  font-size: .78rem;
  font-weight: 900;
}

.tree-row:hover,
.tree-row.active,
.tree-row.is-drop-target {
  border-color: var(--ds-line);
  background: var(--ds-soft);
}

.tree-row:hover .tree-action-button,
.tree-row.active .tree-action-button,
.tree-action-button:focus,
.tree-actions.show .tree-action-button {
  opacity: 1;
}

.folder-glyph,
.drive-glyph {
  position: relative;
  display: inline-block;
  width: 1.35rem;
  height: .95rem;
  border-radius: 3px;
  background: #f5c84c;
  box-shadow: inset 0 -2px 0 rgba(0, 0, 0, .12);
}

.folder-glyph::before {
  content: "";
  position: absolute;
  left: .08rem;
  top: -.26rem;
  width: .65rem;
  height: .32rem;
  border-radius: 3px 3px 0 0;
  background: #e8b63e;
}

.drive-glyph {
  height: 1rem;
  border-radius: 4px;
  background: color-mix(in srgb, var(--ds-primary) 25%, var(--ds-surface));
  border: 1px solid var(--ds-line);
}

.drive-glyph::after {
  content: "";
  position: absolute;
  right: .18rem;
  bottom: .16rem;
  width: .18rem;
  height: .18rem;
  border-radius: 50%;
  background: var(--ds-good);
}

.tree-action-button,
.round-icon-button {
  display: inline-grid;
  place-items: center;
  border: 1px solid var(--ds-line);
  background: var(--ds-surface);
  color: var(--ds-ink);
  font-weight: 900;
}

.tree-action-button {
  width: 1.85rem;
  height: 1.85rem;
  border-radius: 6px;
  opacity: .82;
}

.round-icon-button {
  width: 2rem;
  height: 2rem;
  border-radius: 50%;
  font-size: 1.1rem;
  line-height: 1;
}

.tree-action-button:hover,
.round-icon-button:hover {
  background: color-mix(in srgb, var(--ds-primary) 16%, var(--ds-surface));
  color: var(--ds-primary-strong);
  transform: translateY(-1px);
}

.tree-actions .dropdown-menu {
  z-index: 1080;
  background: var(--ds-surface);
  border: 1px solid var(--ds-line);
  box-shadow: 0 16px 36px rgba(23, 32, 51, .22);
}

.tree-actions .dropdown-item {
  color: var(--ds-ink);
}

.tree-actions .dropdown-item:hover {
  background: var(--ds-soft);
}

.tree-icon,
.file-type-icon {
  display: inline-grid;
  place-items: center;
  width: 2rem;
  height: 2rem;
  border-radius: 8px;
  background: var(--ds-soft);
  color: var(--ds-primary-strong);
  font-size: .72rem;
  font-weight: 900;
}

.folder-tile small {
  color: var(--ds-muted);
}

.document-table {
  display: grid;
  border: 1px solid var(--ds-line);
  border-radius: 8px;
  overflow: visible;
  max-width: 100%;
  min-width: 0;
}

.document-row {
  display: grid;
  grid-template-columns: minmax(14rem, 1.6fr) minmax(6rem, .55fr) minmax(6rem, .45fr) minmax(9rem, .7fr) minmax(7rem, .45fr);
  gap: .75rem;
  align-items: center;
  padding: .8rem;
  border-top: 1px solid var(--ds-line);
  min-width: 0;
}

.document-row:first-child {
  border-top: 0;
}

.document-head {
  background: var(--ds-soft);
  color: var(--ds-muted);
  font-weight: 800;
}

.document-head a {
  display: inline-flex;
  align-items: center;
  gap: .3rem;
  min-width: 0;
  color: inherit;
  text-decoration: none;
  white-space: nowrap;
}

.document-head small {
  display: inline;
  color: var(--ds-primary-strong);
  font-size: .75rem;
  line-height: 1;
}

.document-name-cell {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  align-items: center;
  gap: .7rem;
  min-width: 0;
}

.document-name-stack {
  display: grid;
  min-width: 0;
}

.document-meta-cell,
.document-actions-cell {
  min-width: 0;
}

.file-browser-table .dropdown-toggle {
  min-width: 2.6rem;
  padding-left: .55rem;
  padding-right: .55rem;
}

.file-browser-table .dropdown-menu {
  z-index: 1080;
  background: var(--ds-surface);
  border: 1px solid var(--ds-line);
  box-shadow: 0 16px 36px rgba(23, 32, 51, .22);
}

.file-browser-table .dropdown-item {
  color: var(--ds-ink);
}

.file-browser-table .dropdown-item:hover {
  background: var(--ds-soft);
}

.danger-note {
  border: 1px solid var(--ds-danger);
  border-radius: 8px;
  background: color-mix(in srgb, var(--ds-danger) 12%, var(--ds-surface));
  color: var(--ds-danger-strong);
  padding: .85rem;
  font-weight: 800;
}

.security-note {
  border: 1px solid color-mix(in srgb, var(--ds-primary) 28%, var(--ds-line));
  border-radius: 8px;
  background: color-mix(in srgb, var(--ds-primary) 9%, var(--ds-surface));
  color: var(--ds-ink);
  padding: .85rem;
}

.idle-countdown {
  display: inline-flex;
  gap: .35rem;
  align-items: center;
  border: 1px solid var(--ds-line);
  border-radius: 999px;
  background: var(--ds-soft);
  padding: .35rem .7rem;
  font-weight: 800;
}

.trash-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(22rem, 1fr));
  gap: 1rem;
}

.trash-workspace {
  display: grid;
  gap: 1rem;
}

.trash-tabs {
  border-bottom-color: var(--ds-line);
}

.trash-tabs .nav-link {
  color: var(--ds-primary-strong);
  border-color: transparent;
}

.trash-tabs .nav-link.active {
  background: var(--ds-surface);
  border-color: var(--ds-line) var(--ds-line) var(--ds-surface);
  color: var(--ds-ink);
}

.trash-toolbar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: .75rem;
  margin-bottom: .85rem;
}

.trash-list {
  display: grid;
  gap: .75rem;
}

.trash-table,
.activity-table {
  display: grid;
  border: 1px solid var(--ds-line);
  border-radius: 8px;
  overflow: visible;
}

.trash-row,
.activity-row {
  display: grid;
  gap: .75rem;
  align-items: center;
  border-top: 1px solid var(--ds-line);
  padding: .75rem;
  min-width: 0;
}

.trash-row {
  grid-template-columns: minmax(4.5rem, .35fr) minmax(14rem, 1.3fr) minmax(6rem, .45fr) minmax(12rem, 1fr) minmax(10rem, .8fr) minmax(10rem, .8fr);
}

.activity-row {
  grid-template-columns: minmax(10rem, .55fr) minmax(18rem, 1.5fr) minmax(10rem, .55fr);
}

.trash-row:first-child,
.activity-row:first-child {
  border-top: 0;
}

.trash-head,
.activity-head {
  background: var(--ds-soft);
  color: var(--ds-muted);
  font-weight: 800;
}

.trash-row:not(.trash-head) {
  cursor: pointer;
}

.switch-cell {
  display: flex;
  align-items: center;
}

.switch-cell .form-check-input {
  width: 2.7rem;
  height: 1.35rem;
  margin: 0;
  border-color: var(--ds-line);
  background-color: var(--ds-surface);
  cursor: pointer;
}

.switch-cell .form-check-input:checked {
  background-color: var(--ds-primary);
  border-color: var(--ds-primary);
}

.trash-name-cell,
.trash-row span,
.activity-row span,
.activity-row time {
  min-width: 0;
}

.trash-name-cell {
  display: grid;
}

.trash-name-cell strong,
.trash-name-cell small,
.trash-row span,
.activity-row span,
.activity-row time {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.trash-item {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
  align-items: center;
  gap: .75rem;
  border: 1px solid var(--ds-line);
  border-radius: 8px;
  background: var(--ds-soft);
  padding: .85rem;
  min-width: 0;
}

.admin-trash-item {
  border-color: color-mix(in srgb, var(--ds-danger) 38%, var(--ds-line));
}

.trash-item-body {
  display: grid;
  min-width: 0;
}

.trash-item-body strong,
.trash-item-body small {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.ds-modal-content {
  background: var(--ds-surface);
  color: var(--ds-ink);
  border: 1px solid var(--ds-line);
  border-radius: 8px;
}

.ds-modal-content .modal-header {
  border-bottom-color: var(--ds-line);
}

.ds-modal-content .modal-footer {
  border-top-color: var(--ds-line);
}

.ds-modal-content .btn-close {
  --bs-btn-close-bg: none;
  position: relative;
  width: 2.25rem;
  height: 2.25rem;
  margin: -.35rem -.35rem -.35rem auto;
  padding: 0;
  border: 1px solid var(--ds-line);
  border-radius: 999px;
  background: color-mix(in srgb, var(--ds-surface) 72%, var(--ds-ink) 10%);
  color: var(--ds-ink);
  opacity: 1;
  box-shadow: none;
  transition: transform .18s ease, background-color .18s ease, color .18s ease, border-color .18s ease;
}

.ds-modal-content .btn-close::before,
.ds-modal-content .btn-close::after {
  content: "";
  position: absolute;
  left: 50%;
  top: 50%;
  width: 1rem;
  height: 2px;
  border-radius: 999px;
  background: currentColor;
  transform-origin: center;
}

.ds-modal-content .btn-close::before {
  transform: translate(-50%, -50%) rotate(45deg);
}

.ds-modal-content .btn-close::after {
  transform: translate(-50%, -50%) rotate(-45deg);
}

.ds-modal-content .btn-close:hover {
  background: color-mix(in srgb, var(--ds-primary) 16%, var(--ds-surface));
  color: var(--ds-primary-strong);
  border-color: color-mix(in srgb, var(--ds-primary) 45%, var(--ds-line));
  transform: translateY(-1px) rotate(90deg);
}

.ds-modal-content .btn-close:focus-visible {
  outline: 3px solid color-mix(in srgb, var(--ds-primary) 38%, transparent);
  outline-offset: 2px;
}

.upload-modal-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: .85rem;
}

.upload-preview,
.document-preview-body {
  border: 1px solid var(--ds-line);
  border-radius: 8px;
  background: var(--ds-soft);
  padding: .85rem;
}

.upload-preview {
  min-height: 7rem;
  display: grid;
  gap: .5rem;
}

.upload-preview img {
  max-width: 100%;
  max-height: 14rem;
  border-radius: 8px;
  object-fit: contain;
}

.document-preview-body {
  min-height: 28rem;
}

.document-preview-body iframe,
.document-preview-body img {
  width: 100%;
  min-height: 28rem;
  border: 0;
  border-radius: 8px;
  background: var(--ds-surface);
}

.document-preview-body img {
  object-fit: contain;
  max-height: 70vh;
}

.document-row small,
.activity-row time {
  display: block;
  color: var(--ds-muted);
}

.activity-list {
  display: grid;
  gap: .75rem;
}

.activity-list > div {
  border: 1px solid var(--ds-line);
  border-radius: 8px;
  background: var(--ds-soft);
  padding: .75rem;
}

.empty-state {
  padding: 1rem;
}

.empty-state p {
  color: var(--ds-muted);
}

.control-grid,
.form-grid {
  display: grid;
  gap: .85rem;
}

.control-grid {
  grid-template-columns: repeat(3, 1fr);
}

.field {
  display: grid;
  gap: .35rem;
  color: var(--ds-ink);
  font-weight: 700;
}

.field input,
.field select,
.field textarea,
.search-select-button,
.search-select-input,
.admin-inline-form select {
  width: 100%;
  min-height: 2.7rem;
  border: 1px solid var(--ds-line);
  border-radius: 8px;
  background: var(--ds-surface);
  color: var(--ds-ink);
  padding: .6rem .75rem;
}

.field textarea {
  min-height: 9rem;
  resize: vertical;
}

.check-row {
  display: flex;
  gap: .65rem;
  align-items: flex-start;
  color: var(--ds-ink);
  font-weight: 700;
}

.check-row input {
  width: 1.1rem;
  height: 1.1rem;
  margin-top: .2rem;
  flex: 0 0 auto;
}

.terms-document,
.terms-card {
  border: 1px solid var(--ds-line);
  border-radius: 8px;
  background: var(--ds-soft);
  padding: 1rem;
}

.terms-document {
  max-height: 22rem;
  overflow: auto;
  margin: 1rem 0;
}

.terms-document h2 {
  font-size: 1.15rem;
  margin: 0 0 .75rem 0;
}

.terms-document p,
.terms-card p {
  color: var(--ds-muted);
}

.tenant-registration-page {
  display: grid;
  gap: 1rem;
}

.tenant-registration-shell {
  min-height: calc(100vh - 12rem);
  display: grid;
  grid-template-columns: minmax(18rem, .8fr) minmax(28rem, 1.2fr);
  gap: 1.25rem;
  align-items: start;
}

.tenant-registration-intro,
.tenant-registration-card {
  background: var(--ds-surface);
  border: 1px solid var(--ds-line);
  border-radius: 8px;
  padding: 1.25rem;
}

.tenant-registration-intro {
  position: sticky;
  top: 1rem;
}

.tenant-registration-intro h1 {
  font-size: clamp(2rem, 4vw, 3.3rem);
  margin: .25rem 0 .75rem;
}

.tenant-registration-intro p {
  color: var(--ds-muted);
}

.tenant-registration-form {
  display: grid;
  gap: 1rem;
}

.phone-field {
  display: grid;
  grid-template-columns: minmax(10rem, .65fr) minmax(10rem, 1fr);
  gap: .5rem;
}

.confirmation-panel {
  max-width: 48rem;
  margin: 0 auto;
}

.summary-list {
  display: grid;
  gap: .65rem;
  margin: 1rem 0;
}

.summary-list div {
  display: grid;
  grid-template-columns: 10rem minmax(0, 1fr);
  gap: .75rem;
  border-bottom: 1px solid var(--ds-line);
  padding-bottom: .65rem;
}

.summary-list dt {
  color: var(--ds-muted);
  font-weight: 800;
}

.summary-list dd {
  margin: 0;
  color: var(--ds-ink);
  overflow-wrap: anywhere;
}

.form-grid {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.field-wide {
  grid-column: 1 / -1;
}

.form-actions {
  display: flex;
  justify-content: flex-end;
}

.access-list,
.security-list {
  display: grid;
  gap: .65rem;
}

.access-row,
.security-list {
  align-items: center;
}

.access-row {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
  gap: .75rem;
  padding: .75rem;
  border: 1px solid var(--ds-line);
  border-radius: 8px;
  background: var(--ds-soft);
}

.access-row small,
.security-list small {
  display: block;
  color: var(--ds-muted);
}

.security-list {
  grid-template-columns: minmax(0, 1fr) auto;
  padding: .75rem;
  border: 1px solid var(--ds-line);
  border-radius: 8px;
  background: var(--ds-soft);
}

.backoffice-page {
  display: grid;
  gap: 1rem;
}

.backoffice-grid {
  display: grid;
  gap: 1rem;
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.owner-user-form {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.compact-list,
.audit-list {
  display: grid;
  gap: .65rem;
}

.compact-row,
.audit-row {
  display: flex;
  justify-content: space-between;
  gap: 1rem;
  align-items: center;
  border: 1px solid var(--ds-line);
  border-radius: 8px;
  background: var(--ds-soft);
  padding: .75rem;
}

.compact-row small,
.audit-row small {
  display: block;
  color: var(--ds-muted);
}

.brand-swatch-grid {
  display: grid;
  gap: .75rem;
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

.brand-swatch-grid > div {
  display: grid;
  gap: .35rem;
  min-width: 0;
}

.brand-swatch {
  display: block;
  width: 100%;
  min-height: 3rem;
  border: 1px solid var(--ds-line);
  border-radius: 8px;
  box-shadow: inset 0 0 0 1px rgb(255 255 255 / .12);
}

.audit-row p {
  margin: .2rem 0;
  color: var(--ds-muted);
}

.audit-table {
  min-width: 68rem;
}

.audit-table td {
  vertical-align: top;
}

.muted-text {
  color: var(--ds-muted);
  margin: 0;
}

.hq-form {
  grid-template-columns: 1fr 1fr;
}

.form-savebar {
  position: sticky;
  bottom: 1rem;
  grid-column: 1 / -1;
  display: flex;
  justify-content: flex-end;
  gap: .75rem;
  padding: .8rem;
  box-shadow: 0 12px 32px rgba(23, 32, 51, .12);
}

.search-select-shell {
  position: relative;
  width: 100%;
  min-width: 0;
  max-width: 100%;
}

.compact-select + .search-select-button,
.compact-select.search-select-button {
  min-width: 14rem;
}

.visually-hidden-select {
  position: absolute !important;
  width: 1px !important;
  height: 1px !important;
  overflow: hidden !important;
  opacity: 0 !important;
  pointer-events: none !important;
}

.search-select-button {
  position: relative;
  text-align: left;
  padding-right: 2.1rem;
  width: 100%;
  min-width: 0;
  max-width: 100%;
}

.search-select-button::after {
  content: "v";
  position: absolute;
  right: .75rem;
  top: .72rem;
  color: var(--ds-muted);
  font-size: .8rem;
  font-weight: 900;
}

.search-select-panel {
  left: 0;
  right: 0;
  top: calc(100% + .35rem);
  display: none;
  padding: .45rem;
}

.search-select-shell.is-open .search-select-panel {
  display: grid;
  gap: .45rem;
}

.search-select-list {
  max-height: 15rem;
  overflow: auto;
}

.search-select-option {
  display: flex;
  align-items: center;
  gap: .55rem;
  width: 100%;
  border: 0;
  border-radius: 7px;
  background: transparent;
  color: var(--ds-ink);
  padding: .55rem .6rem;
  text-align: left;
}

.search-select-button {
  display: flex;
  align-items: center;
  gap: .55rem;
  min-height: 2.65rem;
}

.search-select-text {
  display: grid;
  gap: .1rem;
  min-width: 0;
}

.search-select-label {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.search-select-text small {
  color: var(--ds-muted);
  font-size: .78rem;
  font-weight: 700;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.select-icon {
  display: inline-grid;
  place-items: center;
  width: 1.45rem;
  min-width: 1.45rem;
  height: 1.45rem;
  border-radius: 999px;
  background: color-mix(in srgb, var(--ds-primary) 18%, var(--ds-surface));
  color: var(--ds-primary-strong);
  font-size: .72rem;
  font-weight: 900;
}

.search-select-empty {
  color: var(--ds-muted);
  padding: .7rem .6rem;
}

.search-select-option:hover,
.search-select-option.is-active {
  background: color-mix(in srgb, var(--ds-primary) 11%, var(--ds-surface));
  transform: translateY(-1px);
}

.search-select-option[aria-selected="true"] {
  background: color-mix(in srgb, var(--ds-primary) 16%, var(--ds-surface));
  color: var(--ds-primary-strong);
  font-weight: 800;
}

.admin-layout {
  display: grid;
  gap: 1rem;
}

.admin-rail {
  color: var(--ds-muted);
  font-size: .82rem;
  font-weight: 850;
  letter-spacing: .08em;
  text-transform: uppercase;
}

.admin-body {
  min-width: 0;
}

.admin-inline-form {
  grid-template-columns: minmax(16rem, 1fr) minmax(10rem, .42fr) minmax(9rem, auto);
}

.admin-table-row {
  grid-template-columns: minmax(14rem, 1.4fr) minmax(10rem, 1fr) minmax(10rem, 1fr) minmax(17rem, 1.4fr);
}

.admin-actions .btn-action {
  min-height: 2.25rem;
  font-size: .86rem;
}

:root[data-theme="dark"] .search-results,
:root[data-theme="dark"] .dropdown-panel,
:root[data-theme="dark"] .search-select-panel,
:root[data-theme="dark"] .profile-hero,
:root[data-theme="dark"] .profile-panel,
:root[data-theme="dark"] .form-savebar,
:root[data-theme="dark"] .module-card,
:root[data-theme="dark"] .signal-grid > * {
  box-shadow: none;
}

@media (max-width: 800px) {
  .environment-badge {
    right: .75rem;
    bottom: 4.9rem;
    z-index: 26;
  }

  .portal-frame {
    display: block;
    padding-bottom: 4rem;
  }

  .portal-sidebar {
    position: fixed;
    inset: 0 auto 0 0;
    z-index: 1050;
    display: flex;
    width: min(20rem, 86vw);
    height: 100dvh;
    transform: translateX(-105%);
    transition: transform .2s ease;
    box-shadow: 18px 0 48px rgba(0, 0, 0, .35);
  }

  body.mobile-sidebar-open {
    overflow: hidden;
  }

  body.mobile-sidebar-open .portal-sidebar {
    transform: translateX(0);
  }

  .sidebar-scrim {
    position: fixed;
    inset: 0;
    z-index: 1040;
    background: rgba(0, 0, 0, .48);
    border: 0;
    padding: 0;
  }

  body.mobile-sidebar-open .sidebar-scrim {
    display: block;
  }

  body.sidebar-collapsed .portal-sidebar {
    padding-inline: 1rem;
  }

  body.sidebar-collapsed .sidebar-label {
    display: inline;
  }

  body.sidebar-collapsed .sidebar-controls {
    display: flex;
  }

  body.sidebar-collapsed .sidebar-nav {
    max-height: calc(100vh - 8rem);
    scrollbar-width: thin;
  }

  body.sidebar-collapsed .sidebar-nav::-webkit-scrollbar {
    width: .5rem;
    height: .5rem;
  }

  body.sidebar-collapsed .portal-sidebar .sidebar-nav a,
  body.sidebar-collapsed .sidebar-footer a {
    justify-content: flex-start;
    padding-inline: .7rem;
  }

  .portal-topbar,
  .dashboard-header {
    display: grid;
  }

  .portal-topbar {
    grid-template-columns: auto minmax(0, 1fr) auto;
    align-items: center;
  }

  .mobile-sidebar-button {
    display: inline-grid;
    place-items: center;
  }

  .global-search input {
    width: 100%;
  }

  .admin-inline-form,
  .admin-table-row,
  .backoffice-grid,
  .tenant-registration-shell,
  .form-grid,
  .control-grid,
  .owner-user-form {
    grid-template-columns: 1fr;
  }

  .summary-list div {
    grid-template-columns: 1fr;
  }

  .mobile-navbar {
    position: fixed;
    left: 0;
    right: 0;
    bottom: 0;
    display: grid;
    grid-template-columns: repeat(5, 1fr);
    background: var(--ds-surface);
    border-top: 1px solid var(--ds-line);
    z-index: 1030;
  }

  .mobile-navbar a,
  .mobile-navbar button {
    padding: .8rem .4rem;
    text-align: center;
    text-decoration: none;
    border: 0;
    background: transparent;
    color: var(--ds-primary);
    font: inherit;
  }

  .public-hero {
    min-height: 72vh;
    padding: 2rem 1rem;
    background:
      linear-gradient(180deg, var(--ds-hero-overlay-a), var(--ds-hero-overlay-b)),
      url("/icons/dragonstar-icon.svg") center 85% / 9rem no-repeat,
      #152238;
  }

  .global-search {
    width: 100%;
  }

  .user-menu-text,
  .chevron,
  .topbar-actions .chip,
  .topbar-actions > :not(.user-menu):not(.theme-switch) {
    display: none;
  }

  .profile-hero,
  .profile-identity,
  .security-list {
    display: grid;
  }

  .profile-shell,
  .hq-form,
  .form-grid,
  .documents-workspace,
  .documents-browser,
  .document-stats,
  .control-grid,
  .upload-modal-grid {
    grid-template-columns: 1fr;
  }

  .documents-hero,
  .documents-search,
  .document-toolbar {
    display: grid;
  }

  .portal-content {
    padding: .85rem;
    overflow-x: hidden;
  }

  .documents-hero {
    gap: 1rem;
  }

  .documents-hero-actions {
    display: grid;
    grid-template-columns: 1fr;
  }

  .documents-main,
  .documents-panel,
  .documents-browser,
  .document-toolbar,
  .document-table {
    width: 100%;
    max-width: 100%;
    min-width: 0;
  }

  .document-toolbar {
    align-items: stretch;
  }

  .toolbar-actions,
  .documents-search {
    width: 100%;
  }

  .documents-search input {
    min-width: 0;
    width: 100%;
  }

  .folder-grid {
    grid-template-columns: 1fr;
  }

  .document-table {
    border: 0;
    gap: .65rem;
  }

  .document-head {
    display: none;
  }

  .document-row {
    grid-template-columns: 1fr;
    gap: .55rem;
    border: 1px solid var(--ds-line);
    border-radius: 8px;
    background: var(--ds-surface);
    padding: .85rem;
  }

  .document-row:first-child {
    border-top: 1px solid var(--ds-line);
  }

  .document-meta-cell,
  .document-actions-cell {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: .75rem;
  }

  .document-meta-cell::before,
  .document-actions-cell::before {
    content: attr(data-label);
    color: var(--ds-muted);
    font-size: .8rem;
    font-weight: 800;
  }

  .document-actions-cell .dropdown {
    margin-left: auto;
  }

  .trash-grid,
  .trash-item,
  .trash-toolbar {
    grid-template-columns: 1fr;
  }

  .trash-toolbar {
    display: grid;
  }

  .trash-item form,
  .trash-item button {
    width: 100%;
  }

  .trash-table,
  .activity-table {
    border: 0;
    gap: .65rem;
  }

  .trash-head,
  .activity-head {
    display: none;
  }

  .trash-row,
  .activity-row {
    grid-template-columns: 1fr;
    border: 1px solid var(--ds-line);
    border-radius: 8px;
    background: var(--ds-surface);
  }

  .trash-row span:not(.trash-name-cell):not(.switch-cell),
  .activity-row span,
  .activity-row time {
    display: flex;
    justify-content: space-between;
    gap: .75rem;
  }

  .trash-row span:not(.trash-name-cell):not(.switch-cell)::before,
  .activity-row span::before,
  .activity-row time::before {
    content: attr(data-label);
    color: var(--ds-muted);
    font-size: .8rem;
    font-weight: 800;
  }

  .tree-list {
    overflow-x: auto;
    scrollbar-width: thin;
  }

  .tree-row {
    min-width: 17rem;
  }

  .tenant-registration-intro {
    position: static;
  }

  .phone-field {
    grid-template-columns: 1fr;
  }

  .dropdown-panel.user-dropdown {
    position: fixed;
    left: .75rem;
    right: .75rem;
    top: 7.25rem;
    min-width: 0;
    max-width: none;
  }

  .form-savebar {
    position: static;
  }
}

/* Final enterprise overrides kept at the end so all pages share the same components. */
.search-select-panel,
.dropdown-menu,
.dropdown-panel,
.search-results {
  z-index: 1205;
}

.form-savebar {
  z-index: 25;
}

.search-select-button,
.search-select-option {
  display: flex;
  align-items: center;
  gap: .5rem;
}

.search-select-button::after {
  content: "";
  width: .55rem;
  height: .55rem;
  border-right: 2px solid currentColor;
  border-bottom: 2px solid currentColor;
  transform: rotate(45deg);
  top: .92rem;
}

.search-select-shell.is-open .search-select-button::after {
  top: 1.05rem;
  transform: rotate(225deg);
}

.profile-editor-grid {
  grid-template-columns: minmax(16rem, 22rem) minmax(0, 1fr);
}

.profile-main-form,
.avatar-editor,
.profile-main-form .field,
.profile-main-form textarea,
.profile-main-form input {
  min-width: 0;
}

.ds-table-toolbar,
.ds-table-pager {
  display: flex;
  flex-wrap: wrap;
  gap: .55rem;
  align-items: end;
  justify-content: space-between;
  border: 1px solid var(--ds-line);
  background: var(--ds-surface);
  padding: .65rem;
}

.ds-table-toolbar {
  border-radius: 8px 8px 0 0;
  border-bottom: 0;
}

.ds-table-pager {
  border-radius: 0 0 8px 8px;
  border-top: 0;
  margin-bottom: .5rem;
}

.ds-smart-table {
  min-height: 18rem;
  border-radius: 0;
}

.ds-modal-content .btn-close {
  color: var(--ds-ink);
  opacity: 1;
  filter: none;
}

:root[data-theme="dark"] .ds-modal-content .btn-close {
  color: var(--ds-ink);
}

.ds-table-search,
.ds-table-size {
  display: grid;
  gap: .2rem;
  color: var(--ds-muted);
  font-size: .78rem;
  font-weight: 850;
  text-transform: uppercase;
}

.ds-table-search {
  flex: 1 1 18rem;
  max-width: 32rem;
}

.ds-table-search input,
.ds-table-size select,
.ds-table-export button,
.ds-table-pager button {
  min-height: 2.35rem;
  border: 1px solid var(--ds-line);
  border-radius: 8px;
  background: var(--ds-surface);
  color: var(--ds-ink);
  padding: .45rem .65rem;
  font-weight: 800;
}

.enterprise-row:hover,
.document-row:hover,
.activity-row:hover,
.trash-row:hover,
.admin-table tbody tr:hover {
  background: color-mix(in srgb, var(--ds-primary) 9%, var(--ds-surface));
}

.sortable {
  cursor: pointer;
  user-select: none;
}

.sortable[data-sort="asc"]::after { content: "  ↑"; }
.sortable[data-sort="desc"]::after { content: "  ↓"; }

@media (max-width: 980px) {
  .profile-editor-grid,
  .profile-kpi-grid,
  .profile-section-grid,
  .upload-modal-grid,
  .upload-form-panel,
  .two-factor-grid,
  .ai-command-strip {
    grid-template-columns: 1fr;
  }

  .enterprise-head {
    display: none;
  }

  .enterprise-row:not(.enterprise-head) {
    grid-template-columns: 1fr;
    border: 1px solid var(--ds-line);
    border-radius: 8px;
    margin-bottom: .65rem;
  }

  .upload-preview-panel {
    position: fixed;
    inset: .75rem;
    z-index: 1320;
    display: none;
  }

  .upload-preview-panel.is-open {
    display: grid;
  }

  .admin-table,
  .admin-table thead,
  .admin-table tbody,
  .admin-table tr,
  .admin-table th,
  .admin-table td {
    display: block;
    width: 100%;
  }

  .admin-table thead {
    display: none;
  }

  .admin-table tr {
    border: 1px solid var(--ds-line);
    border-radius: 8px;
    background: var(--ds-surface);
    margin-bottom: .65rem;
    overflow: hidden;
  }

  .admin-table td {
    display: flex;
    justify-content: space-between;
    gap: .75rem;
    border-bottom: 1px solid var(--ds-line);
    overflow-wrap: anywhere;
  }
}

/* Final table and account polish pass. */
.ds-table-toolbar {
  display: grid;
  grid-template-columns: max-content minmax(0, 1fr) max-content minmax(18rem, 32rem);
  justify-content: stretch;
  align-items: end;
  gap: .65rem;
}

.ds-table-size {
  grid-column: 1;
}

.ds-table-export {
  grid-column: 3;
}

.ds-table-search {
  grid-column: 4;
}

.ds-table-pager {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  gap: .65rem;
}

.ds-table-search {
  width: 100%;
  max-width: 100%;
  flex: none;
  justify-self: end;
}

.ds-table-export,
.ds-table-pages,
.shortcut-actions {
  display: flex;
  flex-wrap: wrap;
  gap: .35rem;
}

.ds-table-pages {
  justify-content: flex-end;
}

.ds-table-range {
  color: var(--ds-muted);
  font-weight: 850;
}

.ds-table-export button,
.ds-table-pager button,
.ds-table-size select {
  transition: transform .16s ease, background-color .16s ease, border-color .16s ease, box-shadow .16s ease;
}

.ds-table-export button:hover,
.ds-table-pager button:hover:not(:disabled),
.ds-table-size select:hover {
  transform: translateY(-2px);
  border-color: color-mix(in srgb, var(--ds-primary) 48%, var(--ds-line));
  background: color-mix(in srgb, var(--ds-primary) 12%, var(--ds-surface));
  box-shadow: 0 10px 24px color-mix(in srgb, var(--ds-ink) 13%, transparent);
}

.ds-table-pages button.active {
  background: var(--ds-primary);
  border-color: var(--ds-primary);
  color: var(--ds-surface);
}

.enterprise-table,
.document-table,
.activity-table,
.trash-table {
  align-content: start;
  min-height: calc(var(--ds-table-head-height, 3.5rem) + (var(--ds-row-height, 4.7rem) * var(--ds-page-size, 5)));
}

.enterprise-head,
.document-head,
.activity-head,
.trash-head {
  min-height: var(--ds-table-head-height, 3.5rem);
}

.enterprise-row,
.document-row,
.activity-row,
.trash-row {
  min-height: var(--ds-row-height, 4.7rem);
}

.document-table {
  --ds-row-height: 5.1rem;
}

.ds-empty-row {
  color: var(--ds-muted);
  font-weight: 800;
}

.ds-smart-table > .empty-state {
  display: none;
}

.panel-heading .inline-search[data-table-filter] {
  display: none;
}

.user-dropdown .dropdown-user .avatar {
  width: 2.85rem;
  height: 2.85rem;
  flex: 0 0 2.85rem;
  border-radius: 50%;
}

.user-dropdown .dropdown-user .avatar img,
.user-menu-button .avatar img {
  width: 100%;
  height: 100%;
  border-radius: 50%;
  object-fit: cover;
}

.user-dropdown .signout-form button {
  color: var(--ds-danger);
  font-weight: 900;
}

.user-dropdown .signout-form button:hover {
  background: color-mix(in srgb, var(--ds-danger) 13%, var(--ds-surface));
  color: var(--ds-danger-strong);
}

.profile-kpi-grid,
.profile-section-grid {
  margin-top: 1rem;
}

.profile-section-grid {
  align-items: start;
}

.settings-list {
  gap: .85rem;
}

.avatar-editor {
  overflow: hidden;
}

.avatar-editor .file-drop,
.avatar-editor .file-picker-row {
  min-width: 0;
  max-width: 100%;
}

.avatar-editor .control-grid,
.avatar-actions {
  grid-template-columns: 1fr;
}

.password-field-shell {
  position: relative;
  display: block;
}

.password-field-shell input {
  padding-right: 4.8rem;
}

.password-toggle-button {
  position: absolute;
  right: .35rem;
  top: 50%;
  min-height: 2rem;
  transform: translateY(-50%);
  border: 1px solid var(--ds-line);
  border-radius: 7px;
  background: var(--ds-soft);
  color: var(--ds-ink);
  padding: .25rem .55rem;
  font-size: .82rem;
  font-weight: 850;
}

.password-toggle-button:hover {
  background: color-mix(in srgb, var(--ds-primary) 12%, var(--ds-surface));
  border-color: color-mix(in srgb, var(--ds-primary) 45%, var(--ds-line));
}

.shortcut-grid {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.shortcut-card {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: .45rem;
  align-items: center;
  border: 1px solid var(--ds-line);
  border-radius: 8px;
  background: var(--ds-soft);
  padding: .55rem;
}

.shortcut-card > a {
  border: 0;
  background: transparent;
  padding: .2rem;
}

.shortcut-actions button {
  min-height: 1.9rem;
  border: 1px solid var(--ds-line);
  border-radius: 7px;
  background: var(--ds-surface);
  color: var(--ds-ink);
  padding: .2rem .45rem;
  font-size: .78rem;
  font-weight: 850;
}

.shortcut-actions button:hover {
  background: color-mix(in srgb, var(--ds-primary) 12%, var(--ds-surface));
}

.calendar-grid-view {
  grid-template-columns: 4rem repeat(5, minmax(0, 1fr));
}

.outlook-calendar-month {
  display: grid;
  grid-template-columns: 3.25rem repeat(7, minmax(5.75rem, 1fr));
  gap: 0;
  overflow: auto;
  border: 1px solid var(--ds-line);
  border-radius: 8px;
  background: var(--ds-surface);
}

.calendar-corner,
.calendar-day-header,
.calendar-week-cell,
.calendar-month-cell {
  border-right: 1px solid var(--ds-line);
  border-bottom: 1px solid var(--ds-line);
}

.calendar-corner,
.calendar-day-header {
  min-height: 2.4rem;
  display: flex;
  align-items: center;
  padding: .45rem .55rem;
  background: var(--ds-soft);
  color: var(--ds-muted);
  font-size: .82rem;
  font-weight: 850;
}

.calendar-week-cell {
  min-height: 7.5rem;
  display: flex;
  align-items: flex-start;
  justify-content: center;
  padding-top: .55rem;
  background: color-mix(in srgb, var(--ds-soft) 82%, var(--ds-surface));
  color: var(--ds-muted);
  font-size: .82rem;
}

.calendar-month-cell {
  min-height: 7.5rem;
  display: grid;
  align-content: start;
  gap: .35rem;
  border-top: 0;
  background: var(--ds-surface);
  color: var(--ds-ink);
  padding: .5rem;
  text-align: left;
}

.calendar-month-cell.outside {
  color: color-mix(in srgb, var(--ds-muted) 70%, transparent);
  background: color-mix(in srgb, var(--ds-soft) 55%, var(--ds-surface));
}

.calendar-month-cell.today {
  outline: 2px solid var(--ds-primary);
  outline-offset: -2px;
  background: color-mix(in srgb, var(--ds-primary) 9%, var(--ds-surface));
}

.calendar-date-number {
  font-weight: 850;
}

.calendar-event {
  display: block;
  overflow: hidden;
  border-radius: 5px;
  background: color-mix(in srgb, var(--ds-good) 82%, var(--ds-primary));
  color: #fff;
  padding: .2rem .35rem;
  font-size: .78rem;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.week-number,
.calendar-month-view strong {
  display: grid;
  place-items: center;
  border: 1px solid var(--ds-line);
  border-radius: 8px;
  background: color-mix(in srgb, var(--ds-primary) 9%, var(--ds-surface));
  color: var(--ds-primary-strong);
  font-weight: 900;
}

.sortable[data-sort="asc"]::after { content: "  \\2191"; }
.sortable[data-sort="desc"]::after { content: "  \\2193"; }

@media (max-width: 980px) {
  .ds-table-toolbar,
  .ds-table-pager {
    grid-template-columns: 1fr;
    justify-content: stretch;
  }

  .ds-table-size,
  .ds-table-export,
  .ds-table-search {
    grid-column: auto;
  }

  .ds-table-search {
    width: 100%;
  }

  .calendar-grid-view,
  .shortcut-grid {
    grid-template-columns: 1fr;
  }
}

/* Final fixed layer and enterprise component corrections. Keep this block last. */
.portal-content:has(.form-savebar) {
  padding-bottom: 7.25rem;
}

.form-savebar,
.my-pages-savebar {
  position: fixed !important;
  left: calc(var(--sidebar-width, 260px) + 1rem);
  right: 1rem;
  bottom: .8rem;
  z-index: 25;
  display: flex;
  justify-content: flex-end;
  gap: .75rem;
  margin: 0;
  padding: .8rem;
  background: var(--ds-surface);
  border: 1px solid var(--ds-line);
  border-radius: 8px;
  box-shadow: 0 18px 42px color-mix(in srgb, var(--ds-ink) 14%, transparent);
}

body.sidebar-collapsed .form-savebar,
body.sidebar-collapsed .my-pages-savebar {
  left: calc(var(--sidebar-collapsed-width, 96px) + 1rem);
}

.environment-badge {
  right: 1rem;
  bottom: 1.25rem;
  z-index: 80;
  pointer-events: none;
}

#calendar {
  grid-column: 1 / -1;
}

.outlook-calendar-month {
  width: 100%;
  min-height: 36rem;
  grid-template-columns: 3.25rem repeat(7, minmax(7.5rem, 1fr));
}

.calendar-month-cell,
.calendar-week-cell {
  min-height: 8.8rem;
}

.calendar-event {
  position: relative;
}

.calendar-event:hover {
  transform: translateY(-1px);
  filter: brightness(1.03);
}

table.admin-table.ds-smart-table {
  display: table;
  width: 100%;
  min-height: 0;
  border-collapse: separate;
  border-spacing: 0;
  table-layout: fixed;
}

table.admin-table.ds-smart-table thead {
  display: table-header-group;
}

table.admin-table.ds-smart-table tbody {
  display: table-row-group;
}

table.admin-table.ds-smart-table tr {
  display: table-row;
}

table.admin-table.ds-smart-table th,
table.admin-table.ds-smart-table td {
  display: table-cell;
  padding: .85rem .8rem;
  border-bottom: 1px solid var(--ds-line);
  vertical-align: top;
  overflow-wrap: anywhere;
}

table.admin-table.ds-smart-table th {
  background: var(--ds-soft);
  color: var(--ds-muted);
  font-size: .78rem;
  font-weight: 900;
  text-transform: uppercase;
}

.audit-table {
  min-width: 76rem;
}

.audit-table th:nth-child(1),
.audit-table td:nth-child(1) { width: 8.5rem; }
.audit-table th:nth-child(2),
.audit-table td:nth-child(2) { width: 5.5rem; }
.audit-table th:nth-child(3),
.audit-table td:nth-child(3) { width: 10rem; }
.audit-table th:nth-child(4),
.audit-table td:nth-child(4) { width: 13rem; }
.audit-table th:nth-child(5),
.audit-table td:nth-child(5) { width: 8rem; }
.audit-table th:nth-child(6),
.audit-table td:nth-child(6) { width: 7rem; }
.audit-table th:nth-child(7),
.audit-table td:nth-child(7) { width: auto; }
.audit-table th:nth-child(8),
.audit-table td:nth-child(8) { width: 7.5rem; }

.audit-table td {
  line-height: 1.35;
}

.audit-table code {
  display: inline-flex;
  max-width: 100%;
  color: var(--ds-primary-strong);
  font-weight: 900;
  overflow-wrap: anywhere;
}

.profile-hero,
.profile-kpi-grid,
.profile-section-grid,
.profile-wide-panel {
  margin-bottom: 1rem;
}

.profile-kpi-grid,
.profile-section-grid {
  gap: 1rem;
}

.settings-list {
  gap: .95rem;
}

.settings-list > div,
.settings-action-card {
  padding: .95rem;
}

.ds-table-toolbar {
  grid-template-columns: max-content minmax(0, 1fr) max-content minmax(20rem, 32rem);
}

@media (max-width: 980px) {
  table.admin-table.ds-smart-table,
  table.admin-table.ds-smart-table thead,
  table.admin-table.ds-smart-table tbody,
  table.admin-table.ds-smart-table tr,
  table.admin-table.ds-smart-table th,
  table.admin-table.ds-smart-table td {
    display: block;
    width: 100%;
  }

  table.admin-table.ds-smart-table thead {
    display: none;
  }

  table.admin-table.ds-smart-table tr {
    border-bottom: 1px solid var(--ds-line);
  }

  table.admin-table.ds-smart-table td {
    min-height: 2.8rem;
  }

  .outlook-calendar-month {
    min-width: 48rem;
  }
}

@media (max-width: 800px) {
  .form-savebar,
  .my-pages-savebar {
    left: .75rem;
    right: .75rem;
    bottom: 4.75rem;
  }

  .environment-badge {
    right: .85rem;
    bottom: 5.35rem;
    z-index: 80;
  }
}

/* Public commercial website foundation. */
.public-navbar {
  position: sticky;
  top: 0;
  z-index: 1040;
  border-bottom: 1px solid var(--ds-line);
  background: color-mix(in srgb, var(--ds-surface) 94%, transparent);
  backdrop-filter: blur(14px);
}

.public-shell {
  display: grid;
  gap: 0;
}

.public-hero-immersive,
.public-page-hero,
.public-section,
.public-cta {
  padding: clamp(2rem, 5vw, 4.5rem) clamp(1rem, 4vw, 4rem);
}

.public-hero-immersive {
  min-height: min(78vh, 48rem);
  display: grid;
  align-items: center;
  background:
    linear-gradient(90deg, color-mix(in srgb, var(--ds-surface) 92%, transparent), color-mix(in srgb, var(--ds-surface) 42%, transparent)),
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='1400' height='820' viewBox='0 0 1400 820'%3E%3Crect width='1400' height='820' fill='%23152338'/%3E%3Cg fill='none' stroke='%236fb7f1' stroke-opacity='.18'%3E%3Cpath d='M90 680C240 430 430 390 610 470s380 42 520-170 220-210 330-170'/%3E%3Cpath d='M80 520c210-110 390-130 540-60s350 170 630-50'/%3E%3C/g%3E%3Cg fill='%236fb7f1' fill-opacity='.2'%3E%3Ccircle cx='330' cy='310' r='6'/%3E%3Ccircle cx='680' cy='470' r='7'/%3E%3Ccircle cx='1060' cy='250' r='6'/%3E%3Ccircle cx='1130' cy='420' r='5'/%3E%3C/g%3E%3C/svg%3E");
  background-size: cover;
  background-position: center;
}

.public-hero-immersive > div,
.public-page-hero > * {
  max-width: 58rem;
}

.public-hero-immersive h1,
.public-page-hero h1 {
  font-size: clamp(2.5rem, 7vw, 5.5rem);
  line-height: .98;
  margin: 0 0 1rem;
}

.public-hero-immersive .lead,
.public-page-hero p {
  max-width: 52rem;
  color: var(--ds-muted);
  font-size: clamp(1.05rem, 2vw, 1.35rem);
}

.public-overview-grid,
.public-content-layout,
.contact-layout {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 1rem;
}

.public-card-grid,
.module-catalog-grid,
.pricing-card-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(16rem, 1fr));
  gap: 1rem;
}

.public-card,
.module-public-card,
.pricing-public-card,
.public-content-panel,
.public-form,
.public-cta {
  border: 1px solid var(--ds-line);
  border-radius: 8px;
  background: var(--ds-surface);
  color: var(--ds-ink);
  padding: 1rem;
  text-decoration: none;
}

.public-card:hover,
.module-public-card:hover,
.pricing-public-card:hover {
  transform: translateY(-3px) scale(1.01);
  border-color: color-mix(in srgb, var(--ds-primary) 42%, var(--ds-line));
}

.product-count,
.module-status-badge,
.pricing-public-card > span {
  display: inline-flex;
  align-items: center;
  width: fit-content;
  border: 1px solid var(--ds-line);
  border-radius: 999px;
  padding: .25rem .55rem;
  color: var(--ds-muted);
  font-size: .78rem;
  font-weight: 850;
}

.module-card-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: .75rem;
  margin-bottom: .75rem;
}

.module-icon {
  width: 2.25rem;
  height: 2.25rem;
  display: grid;
  place-items: center;
  border-radius: 8px;
  background: var(--ds-soft);
  color: var(--ds-primary-strong);
  font-weight: 900;
}

.status-good { color: var(--ds-good); border-color: color-mix(in srgb, var(--ds-good) 45%, var(--ds-line)); }
.status-preview { color: var(--ds-primary-strong); border-color: color-mix(in srgb, var(--ds-primary) 45%, var(--ds-line)); }
.status-progress { color: #c48b1d; border-color: color-mix(in srgb, #c48b1d 45%, var(--ds-line)); }
.status-planned { color: var(--ds-muted); }
.status-danger { color: var(--ds-danger); border-color: color-mix(in srgb, var(--ds-danger) 45%, var(--ds-line)); }

.pricing-public-card strong {
  display: block;
  margin: .75rem 0;
  font-size: 2rem;
}

.industry-strip,
.public-footer nav {
  display: flex;
  flex-wrap: wrap;
  gap: .65rem;
}

.industry-strip a,
.public-footer a {
  color: var(--ds-primary-strong);
}

.currency-selector,
.public-form,
.compact-public-form {
  display: grid;
  gap: .85rem;
}

.public-form {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.public-form label,
.currency-selector label,
.compact-public-form label {
  display: grid;
  gap: .35rem;
  font-weight: 850;
}

.public-form input,
.public-form textarea,
.public-form select,
.compact-public-form input,
.currency-selector select {
  width: 100%;
  border: 1px solid var(--ds-line);
  border-radius: 8px;
  background: var(--ds-soft);
  color: var(--ds-ink);
  padding: .7rem .8rem;
}

.field-wide,
.checkbox-row {
  grid-column: 1 / -1;
}

.checkbox-row {
  display: flex !important;
  grid-template-columns: auto 1fr;
  align-items: center;
}

.public-footer {
  display: grid;
  grid-template-columns: minmax(14rem, 1fr) minmax(0, 2fr);
  gap: 1rem;
  padding: 2rem clamp(1rem, 4vw, 4rem);
}

@media (max-width: 860px) {
  .public-overview-grid,
  .public-content-layout,
  .contact-layout,
  .public-form,
  .public-footer {
    grid-template-columns: 1fr;
  }
}

/* Public navigation and form polish pass. */
.public-navbar .container-fluid {
  gap: 1rem;
}

.public-navbar .navbar-collapse {
  align-items: center;
}

.public-nav-links,
.public-nav-actions {
  align-items: center;
  gap: .18rem;
}

.public-navbar .navbar-brand {
  color: var(--ds-ink);
  border-radius: 8px;
  padding: .35rem .55rem;
  margin-left: -.55rem;
  transition: transform .16s ease, color .16s ease, background-color .16s ease;
}

.public-navbar .navbar-brand:hover,
.public-navbar .navbar-brand:focus-visible {
  color: var(--ds-primary-strong);
  background: color-mix(in srgb, var(--ds-primary) 10%, transparent);
  transform: translateY(-1px);
}

.public-navbar .nav-link {
  position: relative;
  border-radius: 8px;
  padding: .46rem .68rem;
  line-height: 1.15;
  transition: transform .14s ease, color .14s ease, background-color .14s ease, box-shadow .14s ease;
}

.public-navbar .nav-link:hover,
.public-navbar .nav-link:focus-visible {
  color: var(--ds-primary-strong);
  background: color-mix(in srgb, var(--ds-primary) 11%, transparent);
  transform: translateY(-2px);
}

.public-navbar .nav-link:active {
  transform: translateY(1px) scale(.985);
}

.public-navbar .nav-link.active {
  color: var(--ds-primary-strong);
  background: color-mix(in srgb, var(--ds-primary) 14%, var(--ds-surface));
  box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--ds-primary) 38%, transparent);
}

.public-navbar .theme-switch {
  position: relative;
  width: 2.65rem;
  height: 1.55rem;
  margin: 0 .25rem;
  padding: .12rem;
  vertical-align: middle;
}

.public-navbar .theme-switch:hover,
.public-navbar .theme-switch:focus-visible {
  z-index: 110;
}

.public-navbar .theme-switch-thumb {
  top: .1rem;
  left: .1rem;
  width: 1.12rem;
  height: 1.12rem;
  font-size: .73rem;
  line-height: 1;
}

:root[data-theme="dark"] .public-navbar .theme-switch-thumb {
  transform: translateX(1.1rem);
}

.environment-badge {
  background: #d17b00;
  color: #111827;
  border: 1px solid rgba(17, 24, 39, .24);
  font-weight: 850;
  text-shadow: none;
}

[data-tooltip]::after {
  pointer-events: none;
  white-space: normal;
}

[data-tooltip]:hover::after,
[data-tooltip]:focus-visible::after {
  left: 50%;
  right: auto;
  width: max-content;
  max-width: min(18rem, calc(100vw - 2rem));
  overflow-wrap: break-word;
  text-align: center;
  background: color-mix(in srgb, var(--ds-ink) 94%, #000);
  color: var(--ds-surface);
  border-color: color-mix(in srgb, var(--ds-primary) 28%, var(--ds-line));
}

.public-navbar [data-tooltip]:hover::after,
.public-navbar [data-tooltip]:focus-visible::after {
  bottom: auto;
  top: calc(100% + .48rem);
  z-index: 9999;
}

.public-nav-actions [data-tooltip]:hover::after,
.public-nav-actions [data-tooltip]:focus-visible::after {
  left: auto;
  right: 0;
  transform: none;
  text-align: right;
}

.public-navbar .nav-item:first-child [data-tooltip]:hover::after,
.public-navbar .nav-item:first-child [data-tooltip]:focus-visible::after,
.navbar-brand[data-tooltip]:hover::after,
.navbar-brand[data-tooltip]:focus-visible::after {
  left: 0;
  transform: none;
}

.settings-list select,
.settings-list input[type="date"],
.exchange-import-form select,
.exchange-import-form input[type="date"] {
  min-height: 2.75rem;
  border: 1px solid var(--ds-line);
  border-radius: 8px;
  background-color: var(--ds-soft);
  color: var(--ds-ink);
  padding: .62rem 2.45rem .62rem .78rem;
  box-shadow: inset 0 1px 0 color-mix(in srgb, #fff 9%, transparent);
  transition: border-color .16s ease, box-shadow .16s ease, background-color .16s ease;
}

.settings-list select,
.exchange-import-form select {
  appearance: none;
  background-image:
    linear-gradient(45deg, transparent 50%, currentColor 50%),
    linear-gradient(135deg, currentColor 50%, transparent 50%);
  background-position:
    calc(100% - 1.08rem) 52%,
    calc(100% - .78rem) 52%;
  background-size: .34rem .34rem, .34rem .34rem;
  background-repeat: no-repeat;
}

.settings-list input[type="date"]::-webkit-calendar-picker-indicator,
.exchange-import-form input[type="date"]::-webkit-calendar-picker-indicator {
  cursor: pointer;
  border-radius: 7px;
  padding: .25rem;
  background-color: color-mix(in srgb, var(--ds-primary) 14%, var(--ds-surface));
  filter: var(--ds-date-icon-filter, none);
}

.settings-list select:hover,
.settings-list input[type="date"]:hover,
.exchange-import-form select:hover,
.exchange-import-form input[type="date"]:hover,
.settings-list select:focus,
.settings-list input[type="date"]:focus,
.exchange-import-form select:focus,
.exchange-import-form input[type="date"]:focus {
  border-color: color-mix(in srgb, var(--ds-primary) 55%, var(--ds-line));
  box-shadow: 0 0 0 .18rem color-mix(in srgb, var(--ds-primary) 14%, transparent);
  outline: none;
}

.exchange-import-form label {
  display: grid;
  grid-template-columns: minmax(8rem, .4fr) minmax(12rem, 1fr);
  align-items: center;
  gap: .75rem;
}

.audit-table tbody tr {
  transition: transform .14s ease, background-color .14s ease, box-shadow .14s ease;
}

.audit-table tbody tr:hover {
  background: color-mix(in srgb, var(--ds-primary) 8%, var(--ds-surface));
  transform: translateY(-1px);
  box-shadow: inset 3px 0 0 color-mix(in srgb, var(--ds-primary) 70%, transparent);
}

@media (max-width: 991.98px) {
  .public-navbar .navbar-collapse {
    padding-top: .75rem;
  }

  .public-nav-links,
  .public-nav-actions {
    align-items: stretch;
  }

  .public-navbar .theme-switch {
    margin: .35rem 0;
  }

  .public-navbar [data-tooltip]:hover::after,
  .public-navbar [data-tooltip]:focus-visible::after {
    left: 0;
    right: auto;
    transform: none;
    text-align: left;
  }

  .public-nav-actions [data-tooltip]:hover::after,
  .public-nav-actions [data-tooltip]:focus-visible::after {
    top: calc(100% + .38rem);
    left: 0;
    right: auto;
    min-width: 9.5rem;
    text-align: left;
  }
}

@media (max-width: 680px) {
  .exchange-import-form label {
    grid-template-columns: 1fr;
  }
}

/* Final shared interaction polish. Keep this late so it wins over older page rules. */
[data-tooltip]:hover::after,
[data-tooltip]:focus-visible::after {
  content: none !important;
  display: none !important;
}

.ds-floating-tooltip {
  position: fixed;
  z-index: 5000;
  max-width: min(18rem, calc(100vw - 1.5rem));
  padding: .5rem .65rem;
  border: 1px solid color-mix(in srgb, var(--ds-primary) 34%, var(--ds-line));
  border-radius: 8px;
  background: #101827;
  color: #f8fafc;
  box-shadow: 0 18px 42px color-mix(in srgb, #000 26%, transparent);
  font-size: .78rem;
  font-weight: 850;
  line-height: 1.28;
  opacity: 0;
  pointer-events: none;
  text-align: center;
  transform: translateY(-2px);
  transition: opacity .12s ease, transform .12s ease;
}

.ds-floating-tooltip.is-visible {
  opacity: 1;
  transform: translateY(0);
}

.theme-icon {
  width: .86rem;
  height: .86rem;
  display: block;
  fill: currentColor;
}

.theme-icon-dark {
  display: none;
}

:root[data-theme="dark"] .theme-icon-light {
  display: none;
}

:root[data-theme="dark"] .theme-icon-dark {
  display: block;
}

.mfa-setup-grid {
  display: grid;
  grid-template-columns: minmax(19rem, .85fr) minmax(24rem, 1.15fr);
  gap: 1rem;
  align-items: stretch;
}

.mfa-qr-card,
.mfa-verification-card {
  display: grid;
  gap: 1rem;
  align-content: start;
}

.mfa-qr-card {
  background:
    radial-gradient(circle at 50% 2%, color-mix(in srgb, var(--ds-primary) 12%, transparent), transparent 42%),
    var(--ds-surface);
}

.mfa-verification-card {
  border-color: color-mix(in srgb, var(--ds-primary) 30%, var(--ds-line));
  box-shadow: inset 0 1px 0 color-mix(in srgb, #fff 8%, transparent);
}

.mfa-help-list {
  display: flex;
  flex-wrap: wrap;
  gap: .45rem;
}

.mfa-help-list span {
  border: 1px solid var(--ds-line);
  border-radius: 999px;
  background: var(--ds-soft);
  color: var(--ds-primary-strong);
  padding: .22rem .55rem;
  font-size: .82rem;
  font-weight: 850;
}

.mfa-code-form {
  display: grid;
  gap: .85rem;
}

.mfa-code-field input {
  min-height: 4rem;
  border: 1px solid color-mix(in srgb, var(--ds-primary) 34%, var(--ds-line));
  border-radius: 8px;
  background:
    linear-gradient(180deg, color-mix(in srgb, var(--ds-primary) 5%, var(--ds-surface)), var(--ds-surface));
  color: var(--ds-ink);
  font-family: ui-monospace, SFMono-Regular, Consolas, monospace;
  font-size: clamp(1.55rem, 3vw, 2.35rem);
  font-weight: 900;
  letter-spacing: .16em;
  text-align: center;
  box-shadow: inset 0 1px 0 color-mix(in srgb, #fff 12%, transparent);
}

.mfa-code-field input::placeholder {
  color: color-mix(in srgb, var(--ds-muted) 72%, transparent);
}

.mfa-code-field input:focus {
  border-color: var(--ds-primary);
  outline: none;
  box-shadow:
    0 0 0 .22rem color-mix(in srgb, var(--ds-primary) 18%, transparent),
    inset 0 1px 0 color-mix(in srgb, #fff 12%, transparent);
}

.mfa-manual-key {
  display: grid;
  gap: .55rem;
  margin-top: .25rem;
  padding-top: 1rem;
  border-top: 1px solid var(--ds-line);
}

.mfa-manual-key .copy-token {
  font-size: .98rem;
}

.mfa-challenge-shell {
  width: min(100%, 72rem);
  display: grid;
  gap: 1rem;
}

.account-shell:has(.mfa-challenge-centered) {
  min-height: 100dvh;
  display: grid;
  place-items: center;
  padding-block: clamp(2rem, 7vh, 5rem);
}

.mfa-challenge-centered {
  width: min(100%, 46rem);
  margin-inline: auto;
}

.mfa-challenge-hero {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 1rem;
  padding-bottom: 1rem;
  border-bottom: 1px solid var(--ds-line);
}

.mfa-challenge-hero h1 {
  margin: 0 0 .45rem;
  font-size: clamp(2rem, 4vw, 3.2rem);
}

.mfa-challenge-hero p:not(.eyebrow) {
  margin: 0;
  color: var(--ds-muted);
}

.mfa-challenge-grid {
  display: grid;
  grid-template-columns: minmax(24rem, 1.2fr) minmax(18rem, .8fr);
  gap: 1rem;
  align-items: stretch;
}

.mfa-challenge-stack {
  grid-template-columns: 1fr;
}

.mfa-challenge-stack .profile-panel {
  min-width: 0;
}

.mfa-challenge-stack .mfa-code-form {
  display: grid;
  gap: 1rem;
}

.mfa-challenge-stack .mfa-code-field input,
.mfa-challenge-stack input[name="RecoveryCode"] {
  width: 100%;
  min-height: 3.25rem;
}

.mfa-challenge-stack .btn-action {
  width: 100%;
}

.mfa-challenge-primary {
  background:
    radial-gradient(circle at 0 0, color-mix(in srgb, var(--ds-primary) 12%, transparent), transparent 36%),
    var(--ds-surface);
}

.mfa-recovery-card {
  display: grid;
  gap: 1rem;
  align-content: start;
}

.mfa-submit-button {
  min-height: 3rem;
}

.wfm-nav-groups {
  display: grid;
  gap: .85rem;
}

.wfm-nav-group {
  display: grid;
  gap: .45rem;
}

.wfm-nav-group-title {
  display: flex;
  align-items: center;
  gap: .5rem;
  color: var(--ds-primary-strong);
  font-size: .74rem;
  font-weight: 950;
  letter-spacing: .08em;
  text-transform: uppercase;
}

.wfm-nav-group-icon {
  width: 1.75rem;
  height: 1.75rem;
  display: inline-grid;
  place-items: center;
  border: 1px solid var(--ds-line);
  border-radius: 8px;
  background: color-mix(in srgb, var(--ds-primary) 10%, var(--ds-surface));
  color: var(--ds-primary-strong);
  font-size: .66rem;
  line-height: 1;
}

.wfm-nav-group-links {
  display: grid;
  gap: .28rem;
  padding-left: .65rem;
  margin-left: .85rem;
  border-left: 1px solid var(--ds-line);
}

.wfm-nav-link {
  align-items: flex-start;
  flex-direction: column;
  min-height: 3.35rem;
  gap: .12rem;
}

.wfm-nav-link-title {
  color: var(--ds-heading);
  font-weight: 850;
}

.wfm-nav-link-description {
  color: var(--ds-muted);
  font-size: .78rem;
  line-height: 1.25;
}

.wfm-nav-link.active .wfm-nav-link-description,
.wfm-nav-link:hover .wfm-nav-link-description,
.wfm-nav-link:focus-visible .wfm-nav-link-description {
  color: var(--ds-text);
}

@media (max-width: 980px) {
  .mfa-setup-grid {
    grid-template-columns: 1fr;
  }

  .mfa-challenge-grid {
    grid-template-columns: 1fr;
  }

  .mfa-challenge-hero {
    flex-direction: column;
  }
}

@media (max-width: 900px) {
  .wfm-sidebar .wfm-nav-groups {
    grid-template-columns: 1fr;
  }
}

.wfm-app {
  display: grid;
  gap: 1rem;
  width: 100%;
  min-width: 0;
  max-width: 100%;
}

.wfm-page-header {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 1rem;
  padding: 1.05rem 1.15rem;
  border: 1px solid var(--ds-line);
  border-radius: 8px;
  background:
    radial-gradient(circle at 100% 0, color-mix(in srgb, var(--ds-primary) 11%, transparent), transparent 34%),
    var(--ds-surface);
}

.wfm-page-header h1 {
  margin: 0 0 .35rem;
  font-size: clamp(1.8rem, 3vw, 2.75rem);
}

.wfm-page-header p:not(.section-kicker) {
  margin: 0;
  color: var(--ds-muted);
}

.wfm-header-actions {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-end;
  gap: .55rem;
  flex: 0 0 auto;
}

.wfm-page-header > div,
.wfm-route-toolbar > div {
  min-width: 0;
}

.wfm-shell {
  display: grid;
  grid-template-columns: minmax(13rem, 16rem) minmax(0, 1fr);
  gap: 1rem;
  align-items: start;
  width: 100%;
  min-width: 0;
  max-width: 100%;
  overflow-x: hidden;
}

.wfm-local-nav {
  position: sticky;
  top: calc(var(--topbar-height, 64px) + .75rem);
  max-height: calc(100vh - var(--topbar-height, 64px) - 1.5rem);
  overflow: auto;
  padding: .85rem;
  border: 1px solid var(--ds-line);
  border-radius: 8px;
  background: color-mix(in srgb, var(--ds-surface) 92%, var(--ds-bg));
}

.wfm-local-nav-heading {
  display: flex;
  justify-content: space-between;
  gap: .75rem;
  align-items: center;
  margin-bottom: .85rem;
  color: var(--ds-muted);
  font-size: .78rem;
}

.wfm-local-nav-heading strong {
  color: var(--ds-heading);
}

.wfm-route-content {
  display: grid;
  gap: 1rem;
  width: 100%;
  min-width: 0;
  max-width: 100%;
  overflow-x: hidden;
}

.wfm-kpi-strip {
  display: grid;
  grid-template-columns: repeat(6, minmax(0, 1fr));
  gap: .8rem;
}

.wfm-kpi-card {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  gap: .35rem .7rem;
  align-items: center;
  min-height: 5.5rem;
  padding: .85rem;
  border: 1px solid var(--ds-line);
  border-radius: 8px;
  color: var(--ds-text);
  text-decoration: none;
  background: var(--ds-surface);
}

.wfm-kpi-card > span:not(.wfm-kpi-icon) {
  color: var(--ds-muted);
  font-size: .78rem;
}

.wfm-kpi-card strong {
  color: var(--ds-heading);
  font-size: 1.55rem;
  line-height: 1;
}

.wfm-kpi-card small {
  grid-column: 2;
  font-size: .72rem;
}

.wfm-kpi-icon,
.wfm-mini-icon {
  display: inline-grid;
  place-items: center;
  width: 2.25rem;
  height: 2.25rem;
  border-radius: 8px;
  border: 1px solid var(--ds-line);
  font-size: .7rem;
  font-weight: 900;
}

.icon-blue,
.legend-blue,
.submitted {
  color: #69a7ff;
}

.icon-teal,
.legend-green,
.approved {
  color: #42d4a3;
}

.icon-violet,
.legend-purple {
  color: #9a7cff;
}

.icon-amber,
.legend-yellow {
  color: #ffc247;
}

.icon-red,
.legend-red,
.rejected {
  color: #ff5f6d;
}

.wfm-kpi-icon.icon-blue { background: color-mix(in srgb, #1f78ff 18%, var(--ds-surface)); }
.wfm-kpi-icon.icon-teal { background: color-mix(in srgb, #00b894 18%, var(--ds-surface)); }
.wfm-kpi-icon.icon-violet { background: color-mix(in srgb, #7c5cff 18%, var(--ds-surface)); }
.wfm-kpi-icon.icon-amber { background: color-mix(in srgb, #ffb000 18%, var(--ds-surface)); }
.wfm-kpi-icon.icon-red { background: color-mix(in srgb, #ff385c 18%, var(--ds-surface)); }

.trend-up {
  color: #42d4a3;
}

.trend-down {
  color: #ff5f6d;
}

.wfm-dashboard-grid {
  display: grid;
  grid-template-columns: 1.1fr 1fr 1fr;
  gap: 1rem;
}

.wfm-dashboard-card {
  display: grid;
  gap: .8rem;
  align-content: start;
  min-width: 0;
  min-height: 14rem;
  padding: 1rem;
  border: 1px solid var(--ds-line);
  border-radius: 8px;
  background: var(--ds-surface);
}

.wfm-dashboard-card h2,
.wfm-route-toolbar h2 {
  margin: 0;
  font-size: 1rem;
}

.wfm-donut-layout {
  display: grid;
  grid-template-columns: minmax(8rem, .85fr) minmax(0, 1fr);
  gap: 1rem;
  align-items: center;
}

.wfm-donut {
  display: grid;
  place-items: center;
  align-content: center;
  width: min(12rem, 100%);
  aspect-ratio: 1;
  border-radius: 50%;
  background:
    radial-gradient(circle, var(--ds-surface) 0 42%, transparent 43%),
    conic-gradient(#1f78ff 0 46%, #20bf6b 46% 68%, #ffc247 68% 81%, #ff5f6d 81% 91%, #7c5cff 91% 100%);
  justify-self: center;
}

.wfm-donut strong {
  color: var(--ds-heading);
  font-size: 1.6rem;
}

.wfm-donut span {
  color: var(--ds-muted);
  font-size: .75rem;
}

.wfm-legend,
.wfm-list,
.wfm-task-list {
  display: grid;
  gap: .55rem;
}

.wfm-legend span {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
  gap: .55rem;
  align-items: center;
  color: var(--ds-muted);
  font-size: .82rem;
}

.wfm-legend i {
  width: .55rem;
  height: .55rem;
  border-radius: 2px;
  background: currentColor;
}

.wfm-list-row,
.wfm-task-row {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto auto;
  gap: .65rem;
  align-items: center;
  min-height: 2.8rem;
  padding: .55rem;
  border-radius: 8px;
  color: var(--ds-text);
  text-decoration: none;
}

.wfm-task-row {
  grid-template-columns: auto minmax(0, 1fr) auto;
}

.wfm-list-row:hover,
.wfm-task-row:hover {
  background: color-mix(in srgb, var(--ds-primary) 8%, transparent);
  color: var(--ds-heading);
}

.wfm-list-row small,
.wfm-task-row small {
  display: block;
  color: var(--ds-muted);
}

.task-check {
  width: .8rem;
  height: .8rem;
  border: 1px solid var(--ds-line-strong);
  border-radius: 3px;
}

.wfm-line-chart {
  display: grid;
  gap: .75rem;
}

.wfm-line-chart svg {
  width: 100%;
  min-height: 12rem;
}

.chart-line {
  fill: none;
  stroke: currentColor;
  stroke-width: 4;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.chart-axis line {
  stroke: var(--ds-line);
}

.chart-labels text {
  fill: var(--ds-muted);
  font-size: 13px;
}

.wfm-chart-legend {
  display: flex;
  flex-wrap: wrap;
  gap: 1rem;
  font-size: .8rem;
}

.wfm-route-toolbar {
  display: grid;
  grid-template-columns: minmax(0, auto) minmax(0, 1fr);
  gap: 1rem;
  align-items: end;
  width: 100%;
  min-width: 0;
  max-width: 100%;
  padding: .9rem 1rem;
  border: 1px solid var(--ds-line);
  border-radius: 8px;
  background: var(--ds-surface);
}

.wfm-route-toolbar > .btn-action {
  grid-column: 2;
  grid-row: 1;
  justify-self: end;
  max-width: 100%;
}

.wfm-filter-form {
  display: grid;
  grid-template-columns: minmax(8rem, 1fr) minmax(7rem, .7fr) auto;
  grid-column: 1 / -1;
  grid-row: 2;
  gap: .55rem;
  align-items: end;
  width: 100%;
  min-width: 0;
  max-width: 100%;
}

.wfm-filter-form input,
.wfm-filter-form .btn {
  min-width: 0;
  min-height: 2.55rem;
}

.wfm-route-content .surface-panel {
  max-width: 100%;
  overflow-x: visible;
  overflow-y: visible;
}

.wfm-route-content .surface-panel > .panel-heading {
  margin-bottom: .85rem;
  min-width: 0;
}

.wfm-route-content .form-grid {
  display: grid;
  grid-template-columns: repeat(12, minmax(0, 1fr));
  gap: 1.05rem 1.2rem;
  align-items: start;
  width: 100%;
  min-width: 0;
  max-width: 100%;
}

.wfm-route-content .form-field {
  display: grid;
  grid-column: span 4;
  gap: .42rem;
  align-self: start;
  width: 100%;
  min-width: 0;
  max-width: 100%;
}

.wfm-route-content .form-field.full {
  grid-column: 1 / -1;
}

.wfm-route-content .form-field label {
  margin: 0;
  color: var(--ds-heading);
  font-size: .78rem;
  font-weight: 850;
  letter-spacing: .01em;
  min-height: 1.15rem;
}

.wfm-route-content .form-field input,
.wfm-route-content .form-field select,
.wfm-route-content .form-field textarea,
.wfm-filter-form input {
  width: 100%;
  min-width: 0;
  min-height: var(--ds-control-height);
  border: 1px solid color-mix(in srgb, var(--ds-line) 88%, var(--ds-primary));
  border-radius: 8px;
  background:
    linear-gradient(180deg, color-mix(in srgb, var(--ds-surface) 96%, white), var(--ds-surface));
  color: var(--ds-text);
  box-shadow: inset 0 1px 0 color-mix(in srgb, white 7%, transparent), 0 1px 0 color-mix(in srgb, var(--ds-bg) 65%, transparent);
  padding: .68rem .78rem;
  transition: border-color .16s ease, box-shadow .16s ease, transform .16s ease, background-color .16s ease;
}

.wfm-route-content .form-field select,
.wfm-filter-form select {
  appearance: none;
  background-image:
    linear-gradient(45deg, transparent 50%, var(--ds-primary-strong) 50%),
    linear-gradient(135deg, var(--ds-primary-strong) 50%, transparent 50%),
    linear-gradient(180deg, color-mix(in srgb, var(--ds-surface) 96%, white), var(--ds-surface));
  background-position:
    calc(100% - 1.05rem) 50%,
    calc(100% - .72rem) 50%,
    0 0;
  background-size:
    .34rem .34rem,
    .34rem .34rem,
    100% 100%;
  background-repeat: no-repeat;
  padding-right: 2.35rem;
}

.wfm-route-content .form-field textarea {
  min-height: 10rem;
  resize: vertical;
  line-height: 1.45;
}

.wfm-route-content .form-field:not(.full) textarea {
  min-height: 7.5rem;
}

.wfm-route-content .form-field input::placeholder,
.wfm-route-content .form-field textarea::placeholder,
.wfm-filter-form input::placeholder {
  color: color-mix(in srgb, var(--ds-muted) 82%, transparent);
}

.wfm-route-content .form-field input:hover,
.wfm-route-content .form-field select:hover,
.wfm-route-content .form-field textarea:hover,
.wfm-filter-form input:hover {
  border-color: color-mix(in srgb, var(--ds-primary) 48%, var(--ds-line));
}

.wfm-route-content .form-field input:focus,
.wfm-route-content .form-field select:focus,
.wfm-route-content .form-field textarea:focus,
.wfm-filter-form input:focus {
  outline: none;
  border-color: var(--ds-primary);
  box-shadow: 0 0 0 .22rem color-mix(in srgb, var(--ds-primary) 18%, transparent), inset 0 1px 0 color-mix(in srgb, white 10%, transparent);
}

.wfm-route-content .form-field input[type="datetime-local"],
.wfm-route-content .form-field input[type="date"],
.wfm-route-content .form-field input[type="time"] {
  color-scheme: dark;
}

[data-theme="light"] .wfm-route-content .form-field input[type="datetime-local"],
[data-theme="light"] .wfm-route-content .form-field input[type="date"],
[data-theme="light"] .wfm-route-content .form-field input[type="time"] {
  color-scheme: light;
}

.wfm-route-content .form-grid > .btn,
.wfm-route-content .form-grid > button {
  grid-column: 1 / -1;
  justify-self: end;
  width: auto;
  min-width: 12rem;
  min-height: var(--ds-control-height);
  margin-top: .35rem;
}

.wfm-route-content .form-grid .d-flex {
  grid-column: 1 / -1;
}

.wfm-route-content .form-grid > .form-actions,
.wfm-route-content .form-grid > .form-field.full.d-flex {
  grid-column: 1 / -1;
  display: flex !important;
  justify-content: flex-end;
  align-items: center;
  gap: .75rem;
  margin-top: .25rem;
  padding-top: .85rem;
  border-top: 1px solid color-mix(in srgb, var(--ds-line) 78%, transparent);
}

.wfm-route-content .form-grid > .form-actions .btn,
.wfm-route-content .form-grid > .form-field.full.d-flex .btn {
  min-height: var(--ds-control-height);
  min-width: 10rem;
}

@media (max-width: 1200px) {
  .wfm-route-content .form-field {
    grid-column: span 6;
  }
}

.inline-action-form {
  display: grid;
  grid-template-columns: minmax(10rem, 1fr) auto;
  gap: .5rem;
  align-items: center;
  min-width: min(100%, 24rem);
}

.inline-action-form input {
  min-width: 0;
}

.wfm-action-stack {
  display: grid;
  gap: .55rem;
  min-width: min(100%, 44rem);
}

.wfm-inline-editor {
  display: grid;
  grid-template-columns: minmax(10rem, 1.15fr) minmax(10rem, 1.15fr) minmax(5rem, .55fr) minmax(9rem, .9fr) minmax(11rem, 1fr) auto;
  gap: .5rem;
  align-items: center;
  max-width: 100%;
}

.wfm-inline-editor input,
.wfm-inline-editor select {
  width: 100%;
  min-width: 0;
  min-height: 2.45rem;
  border: 1px solid color-mix(in srgb, var(--ds-line) 88%, var(--ds-primary));
  border-radius: 8px;
  background: color-mix(in srgb, var(--ds-surface) 94%, var(--ds-bg));
  color: var(--ds-text);
  padding: .52rem .66rem;
}

.wfm-inline-editor input:focus,
.wfm-inline-editor select:focus {
  outline: none;
  border-color: var(--ds-primary);
  box-shadow: 0 0 0 .18rem color-mix(in srgb, var(--ds-primary) 18%, transparent);
}

.wfm-inline-editor input[type="datetime-local"] {
  color-scheme: dark;
}

[data-theme="light"] .wfm-inline-editor input[type="datetime-local"] {
  color-scheme: light;
}

.wfm-planner-actions,
.wfm-queue-strip,
.wfm-bulk-bar {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: .65rem;
}

.wfm-filter-bar {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(13rem, 1fr));
  gap: .85rem;
  align-items: end;
  margin: 1rem 0;
}

.wfm-create-panel {
  border: 1px solid var(--ds-line);
  border-radius: 8px;
  padding: .85rem;
  margin: 1rem 0;
  background: color-mix(in srgb, var(--ds-surface) 92%, var(--ds-bg));
}

.wfm-create-panel > summary,
.wfm-row-actions > summary {
  cursor: pointer;
  font-weight: 800;
  color: var(--ds-primary);
}

.wfm-planner-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(16rem, 1fr));
  gap: .85rem;
}

.wfm-planner-grid[data-view="day"] {
  grid-template-columns: minmax(0, 1fr);
}

.wfm-planner-day {
  min-height: 18rem;
  border: 1px solid var(--ds-line);
  border-radius: 8px;
  background: var(--ds-surface);
  overflow: hidden;
}

.wfm-planner-day > header {
  display: flex;
  justify-content: space-between;
  gap: .75rem;
  padding: .8rem 1rem;
  border-bottom: 1px solid var(--ds-line);
  background: color-mix(in srgb, var(--ds-surface) 85%, var(--ds-bg));
}

.wfm-shift-card {
  display: grid;
  grid-template-columns: minmax(4rem, 5rem) minmax(0, 1fr) auto;
  gap: .75rem;
  align-items: start;
  margin: .75rem;
  padding: .85rem;
  border: 1px solid var(--ds-line);
  border-radius: 8px;
  background: var(--ds-bg);
}

.wfm-shift-card.has-warning {
  border-color: #f59e0b;
}

.wfm-shift-time,
.wfm-shift-body {
  display: grid;
  gap: .2rem;
}

.wfm-shift-time span,
.wfm-shift-body small {
  color: var(--ds-muted);
}

.warning-text {
  color: #fbbf24;
  font-weight: 800;
}

.wfm-row-actions {
  grid-column: 1 / -1;
}

.wfm-row-actions[open] {
  padding-top: .75rem;
  border-top: 1px solid var(--ds-line);
}

.wfm-row-actions[open] > summary {
  margin-bottom: .65rem;
}

.wfm-row-actions .wfm-inline-editor {
  grid-template-columns: repeat(2, minmax(10rem, 1fr)) minmax(5.5rem, .45fr) minmax(9rem, .65fr) minmax(11rem, 1fr) auto;
}

.wfm-action-stack .wfm-inline-editor,
.wfm-action-stack .inline-action-form {
  grid-template-columns: minmax(12rem, 1fr) minmax(8rem, auto);
  max-width: min(100%, 34rem);
}

.wfm-action-stack .btn,
.wfm-row-actions .btn {
  white-space: nowrap;
}

.wfm-queue-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(10rem, 1fr));
  gap: .75rem;
  margin: 1rem 0;
}

.wfm-queue-card {
  display: grid;
  gap: .35rem;
  min-height: 5rem;
  padding: .85rem;
  border: 1px solid var(--ds-line);
  border-radius: 8px;
  background: var(--ds-surface);
  text-decoration: none;
}

.wfm-queue-card strong {
  font-size: 1.55rem;
}

.wfm-bulk-bar {
  padding: .85rem;
  margin: 1rem 0;
  border: 1px solid var(--ds-line);
  border-radius: 8px;
  background: color-mix(in srgb, var(--ds-surface) 92%, var(--ds-bg));
}

.wfm-bulk-bar input:not([type="checkbox"]) {
  flex: 1 1 18rem;
}

.wfm-mobile-list {
  display: none;
}

.wfm-mobile-card {
  display: grid;
  gap: .45rem;
  padding: .85rem;
  border: 1px solid var(--ds-line);
  border-radius: 8px;
  background: var(--ds-surface);
}

.wfm-mobile-card > header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: .75rem;
}

.wfm-filter-form input,
.wfm-filter-form .btn {
  min-height: 2.9rem;
}

.wfm-filter-form .btn,
.wfm-route-content .btn-action {
  border-radius: 8px;
  font-weight: 850;
}

.wfm-updated {
  margin: 0;
  color: var(--ds-muted);
  font-size: .82rem;
}

@media (max-width: 1400px) {
  .wfm-kpi-strip {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  .wfm-dashboard-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 1024px) {
  .wfm-shell {
    grid-template-columns: 1fr;
  }

  .wfm-local-nav {
    position: static;
    max-height: none;
  }

  .wfm-nav-groups {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 768px) {
  .wfm-page-header,
  .wfm-route-toolbar {
    display: flex;
    flex-direction: column;
    align-items: stretch;
  }

  .wfm-header-actions,
  .wfm-filter-form {
    grid-template-columns: 1fr;
    justify-content: stretch;
  }

  .wfm-header-actions > *,
  .wfm-header-actions .btn,
  .wfm-filter-form .btn {
    width: 100%;
  }

  .wfm-kpi-strip,
  .wfm-dashboard-grid,
  .wfm-nav-groups {
    grid-template-columns: 1fr;
  }

  .wfm-donut-layout,
  .wfm-list-row {
    grid-template-columns: 1fr;
  }

  .wfm-route-content .form-grid {
    grid-template-columns: 1fr;
  }

  .wfm-route-content .form-field,
  .wfm-route-content .form-field.full,
  .wfm-route-content .form-grid > .btn,
  .wfm-route-content .form-grid > button {
    grid-column: 1;
  }

  .wfm-route-content .form-grid > .btn,
  .wfm-route-content .form-grid > button,
  .wfm-route-content .form-grid > .form-actions .btn,
  .wfm-route-content .form-grid > .form-field.full.d-flex .btn {
    width: 100%;
    min-width: 0;
  }

  .wfm-route-content .form-grid > .form-actions,
  .wfm-route-content .form-grid > .form-field.full.d-flex {
    flex-direction: column-reverse;
    align-items: stretch;
  }

  .wfm-inline-editor {
    grid-template-columns: 1fr;
  }

  .wfm-planner-actions,
  .wfm-bulk-bar {
    align-items: stretch;
  }

  .wfm-planner-actions > *,
  .wfm-bulk-bar > * {
    width: 100%;
  }

  .wfm-shift-card {
    grid-template-columns: 1fr;
  }

  .wfm-mobile-list {
    display: grid;
    gap: .75rem;
    margin: 1rem 0;
  }

  .wfm-approval-workspace .table-responsive {
    display: none;
  }
}

/* DragonStar enterprise UI standard v1: fixed control height, one-line closed selects and universal data grids. */
.form-field input:not([type="checkbox"]):not([type="radio"]):not([type="range"]):not([type="file"]),
.form-field select,
.form-field .search-select-button,
.public-form input:not([type="checkbox"]):not([type="radio"]):not([type="range"]):not([type="file"]),
.public-form select,
.public-form .search-select-button,
.settings-list input:not([type="checkbox"]):not([type="radio"]):not([type="range"]):not([type="file"]),
.settings-list select,
.settings-list .search-select-button,
.admin-inline-form input:not([type="checkbox"]):not([type="radio"]):not([type="range"]):not([type="file"]),
.admin-inline-form select,
.admin-inline-form .search-select-button,
.wfm-filter-form input,
.wfm-filter-form select,
.wfm-filter-form .search-select-button,
.ds-table-search input,
.ds-table-size .search-select-button,
.ds-table-export button,
.ds-table-pager button {
  min-height: var(--ds-control-height);
  height: var(--ds-control-height);
  border-radius: var(--ds-control-radius);
}

.form-field textarea,
.public-form textarea,
.settings-list textarea {
  border-radius: var(--ds-control-radius);
}

.search-select-button {
  min-height: var(--ds-control-height);
  height: var(--ds-control-height);
  overflow: hidden;
  padding: 0 2.35rem 0 var(--ds-control-padding-x);
  white-space: nowrap;
}

.search-select-button::after {
  top: 50%;
  color: var(--ds-muted);
  opacity: .85;
  transform: translateY(-50%) rotate(45deg);
}

.search-select-button:hover::after,
.search-select-button:focus-visible::after {
  color: var(--ds-heading);
  opacity: 1;
}

.search-select-shell.is-open .search-select-button::after {
  top: 50%;
  transform: translateY(-50%) rotate(225deg);
}

.search-select-button .search-select-text {
  display: flex;
  align-items: baseline;
  gap: .5rem;
  min-width: 0;
  width: 100%;
}

.search-select-button .search-select-text--closed {
  align-items: center;
  overflow: hidden;
}

.search-select-button .search-select-label {
  flex: 0 1 auto;
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.search-select-button .search-select-text small {
  display: inline;
  flex: 1 1 auto;
  min-width: 0;
  color: var(--ds-muted);
  font-size: .78rem;
  font-weight: 750;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.search-select-option {
  align-items: flex-start;
  min-height: 3.1rem;
}

.search-select-option .search-select-text {
  display: grid;
  gap: .12rem;
}

.search-select-panel {
  z-index: 1260;
}

.phone-field {
  display: grid;
  grid-template-columns: minmax(11rem, .55fr) minmax(0, 1fr);
  gap: .5rem;
  align-items: start;
}

.phone-field .search-select-button,
.phone-field input,
.phone-number-control {
  height: var(--ds-control-height);
  min-height: var(--ds-control-height);
}

.phone-number-control {
  display: flex;
  align-items: center;
  min-width: 0;
  border: 1px solid var(--ds-border);
  border-radius: 8px;
  background: var(--ds-surface-muted);
  color: var(--ds-text);
  overflow: hidden;
  transition: border-color .14s ease, box-shadow .14s ease, background-color .14s ease;
}

.phone-number-control:focus-within {
  border-color: var(--ds-primary);
  box-shadow: 0 0 0 .18rem color-mix(in srgb, var(--ds-primary) 18%, transparent);
}

.phone-prefix {
  display: inline-flex;
  align-items: center;
  align-self: stretch;
  flex: 0 0 auto;
  justify-content: center;
  min-width: 4.35rem;
  padding: 0 .85rem;
  border-right: 1px solid color-mix(in srgb, var(--ds-border) 86%, var(--ds-heading));
  background: color-mix(in srgb, var(--ds-surface-muted) 82%, var(--ds-heading));
  color: var(--ds-heading);
  font-weight: 850;
  white-space: nowrap;
  user-select: none;
  pointer-events: none;
}

.phone-number-control input[data-phone-national] {
  flex: 1 1 auto;
  min-width: 0;
  height: 100%;
  min-height: 0;
  border: 0 !important;
  border-radius: 0;
  padding-left: .15rem;
  background: transparent !important;
  box-shadow: none !important;
}

.field-validation-message {
  display: block;
  min-height: 1.1rem;
  margin-top: .28rem;
  color: var(--ds-danger);
  font-size: .82rem;
  font-weight: 800;
  line-height: 1.25;
}

.ds-table-toolbar {
  min-height: var(--ds-table-toolbar-height);
  display: grid;
  grid-template-columns: max-content minmax(16rem, 34rem) max-content;
  gap: .65rem;
  align-items: end;
  justify-content: space-between;
}

.ds-table-search {
  grid-column: 2;
  min-width: 0;
  max-width: none;
}

.ds-table-size {
  grid-column: 1;
}

.ds-table-size .search-select-button {
  min-width: 5.75rem;
}

.ds-table-export {
  grid-column: 3;
  justify-content: flex-end;
}

.ds-smart-table-frame {
  min-height: calc(var(--ds-table-head-height) + (var(--ds-row-height) * var(--ds-page-size, 5)));
}

table.ds-smart-table {
  height: auto;
  min-height: 0;
}

.ds-smart-table:not(table) {
  min-height: calc(var(--ds-table-head-height) + (var(--ds-row-height) * var(--ds-page-size, 5)));
  align-content: start;
}

.ds-smart-table thead tr,
.enterprise-head,
.document-head,
.activity-head,
.trash-head,
.admin-table-head {
  height: var(--ds-table-head-height);
  min-height: var(--ds-table-head-height);
}

.ds-smart-table tbody tr,
.enterprise-row:not(.enterprise-head),
.document-row:not(.document-head),
.activity-row:not(.activity-head),
.trash-row:not(.trash-head),
.admin-table-row:not(.admin-table-head) {
  height: var(--ds-row-height);
  min-height: var(--ds-row-height);
}

.ds-smart-table tbody td,
.ds-smart-table tbody th {
  height: var(--ds-row-height);
  vertical-align: middle;
}

.ds-empty-row td,
.ds-empty-row span {
  color: var(--ds-muted);
  font-weight: 800;
}

.decision-column,
.decision-cell {
  width: 12.5rem;
  min-width: 12.5rem;
  white-space: nowrap;
}

.decision-form {
  display: inline-flex;
  align-items: center;
  gap: .45rem;
  justify-content: flex-end;
  min-width: 0;
}

.decision-form .btn {
  min-width: 5.1rem;
  min-height: 2.35rem;
  padding-inline: .75rem;
}

.ds-table-pager {
  min-height: var(--ds-table-footer-height);
}

.error-shell {
  max-width: 920px;
  margin: 7rem auto;
  padding: clamp(2rem, 5vw, 4rem);
  border: 1px solid var(--ds-border);
  border-radius: 8px;
  background: var(--ds-surface);
  box-shadow: 0 24px 70px rgba(5, 12, 22, .12);
}

.error-shell h1 {
  margin: 0 0 1rem;
  font-size: clamp(2.4rem, 5vw, 4.8rem);
}

.error-shell .lead {
  max-width: 62rem;
}

.error-status {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 4.25rem;
  height: 2.25rem;
  margin-bottom: 1rem;
  border: 1px solid var(--ds-border-strong);
  border-radius: 999px;
  color: var(--ds-accent);
  font-weight: 800;
  letter-spacing: 0;
  background: var(--ds-surface-muted);
}

.error-request-id {
  display: grid;
  gap: .35rem;
  margin: 1.5rem 0;
  padding: 1rem;
  border: 1px solid var(--ds-border);
  border-radius: 8px;
  background: var(--ds-surface-muted);
}

.error-request-id span {
  color: var(--ds-muted);
  font-size: .8rem;
  font-weight: 800;
  text-transform: uppercase;
}

.error-request-id code {
  overflow-wrap: anywhere;
  color: var(--ds-text);
}

.error-compact {
  display: grid;
  gap: .75rem;
}

.mfa-centered-grid {
  max-width: 1180px;
  margin-inline: auto;
  align-items: stretch;
}

.mfa-radio-form fieldset,
fieldset.mfa-radio-form {
  display: grid;
  gap: .6rem;
  margin: 0 0 1rem;
  padding: 0;
  border: 0;
}

.mfa-radio-form legend {
  margin-bottom: .45rem;
  color: var(--ds-muted);
  font-size: .78rem;
  font-weight: 900;
  text-transform: uppercase;
}

.mfa-radio-form label {
  display: flex;
  align-items: center;
  gap: .6rem;
  min-height: 2.75rem;
  padding: .7rem .85rem;
  border: 1px solid var(--ds-border);
  border-radius: 8px;
  background: var(--ds-surface-muted);
  cursor: pointer;
}

.mfa-radio-form input[type="radio"] {
  width: 1rem;
  height: 1rem;
  accent-color: var(--ds-accent);
}

.security-definition-list {
  display: grid;
  gap: .65rem;
  margin: 0;
}

.security-definition-list div {
  display: grid;
  grid-template-columns: minmax(10rem, 14rem) 1fr;
  gap: .8rem;
  align-items: center;
  min-height: 2.7rem;
  padding: .65rem .8rem;
  border: 1px solid var(--ds-border);
  border-radius: 8px;
  background: var(--ds-surface-muted);
}

.security-definition-list dt {
  color: var(--ds-muted);
  font-weight: 800;
}

.security-definition-list dd {
  margin: 0;
  font-weight: 800;
}

.mfa-revoke-form textarea {
  min-height: 6rem;
}

.enterprise-dialog {
  width: min(940px, calc(100vw - 2rem));
  max-height: min(82vh, 780px);
  padding: 0;
  border: 1px solid var(--ds-border-strong);
  border-radius: 8px;
  color: var(--ds-text);
  background: var(--ds-surface);
  box-shadow: 0 26px 84px rgba(0, 0, 0, .34);
}

.enterprise-dialog::backdrop {
  background: rgba(4, 10, 20, .68);
}

.dialog-header {
  display: flex;
  justify-content: space-between;
  gap: 1rem;
  align-items: start;
  padding: 1.35rem 1.5rem;
  border-bottom: 1px solid var(--ds-border);
  background: var(--ds-surface-muted);
}

.dialog-header h2 {
  margin: .25rem 0 0;
}

.dialog-close {
  width: 2.4rem;
  height: 2.4rem;
  border: 1px solid var(--ds-border);
  border-radius: 999px;
  color: var(--ds-text);
  background: var(--ds-surface);
  font-size: 1.25rem;
  line-height: 1;
  cursor: pointer;
  transition: transform .16s ease, border-color .16s ease, background-color .16s ease;
}

.dialog-close:hover,
.dialog-close:focus-visible {
  transform: rotate(90deg) scale(1.04);
  border-color: var(--ds-accent);
  background: var(--ds-surface-hover);
}

.authenticator-app-dialog > p,
.authenticator-app-dialog .form-actions {
  padding-inline: 1.5rem;
}

.app-install-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
  gap: 1rem;
  padding: 1rem 1.5rem 1.5rem;
}

.app-install-card {
  display: grid;
  gap: .8rem;
  padding: 1rem;
  border: 1px solid var(--ds-border);
  border-radius: 8px;
  background: var(--ds-surface-muted);
}

.app-install-card small {
  display: block;
  margin-top: .2rem;
  color: var(--ds-muted);
}

.app-install-card img {
  width: 8rem;
  height: 8rem;
  padding: .5rem;
  border-radius: 8px;
  background: #fff;
}

.inline-action-form {
  display: grid;
  grid-template-columns: minmax(9rem, 1fr) auto;
  gap: .5rem;
  align-items: center;
}

.inline-action-form input {
  min-width: 0;
}

/* DragonStar WFM enterprise form system v2. Keep WFM field behavior scoped and reusable. */
.wfm-app {
  --wfm-form-column-gap: clamp(1rem, 2vw, 1.5rem);
  --wfm-form-row-gap: 1rem;
  --wfm-action-min-width: 10rem;
}

.wfm-app .surface-panel {
  min-width: 0;
  max-width: 100%;
  overflow: visible;
}

.wfm-app .dashboard-grid {
  align-items: start;
}

.wfm-app .form-grid,
.wfm-route-content .form-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  column-gap: var(--wfm-form-column-gap);
  row-gap: var(--wfm-form-row-gap);
  align-items: start;
  width: 100%;
  min-width: 0;
}

.wfm-app .form-field,
.wfm-route-content .form-field {
  display: flex;
  flex-direction: column;
  gap: .42rem;
  align-self: start;
  width: 100%;
  min-width: 0;
  max-width: 100%;
}

.wfm-app .form-field.full,
.wfm-route-content .form-field.full {
  grid-column: 1 / -1;
}

.wfm-app .form-field label,
.wfm-route-content .form-field label {
  display: block;
  margin: 0;
  color: var(--ds-heading);
  font-size: .8rem;
  font-weight: 850;
  line-height: 1.25;
  letter-spacing: .01em;
}

.wfm-app .form-field input:not([type="checkbox"]):not([type="radio"]):not([type="range"]):not([type="file"]),
.wfm-app .form-field select,
.wfm-app .form-field textarea,
.wfm-app .form-field .search-select-shell,
.wfm-app .form-field .search-select-button,
.wfm-route-content .form-field input:not([type="checkbox"]):not([type="radio"]):not([type="range"]):not([type="file"]),
.wfm-route-content .form-field select,
.wfm-route-content .form-field textarea,
.wfm-route-content .form-field .search-select-shell,
.wfm-route-content .form-field .search-select-button {
  width: 100%;
  min-width: 0;
}

.wfm-app .form-field input:not([type="checkbox"]):not([type="radio"]):not([type="range"]):not([type="file"]),
.wfm-app .form-field select,
.wfm-app .form-field .search-select-button,
.wfm-route-content .form-field input:not([type="checkbox"]):not([type="radio"]):not([type="range"]):not([type="file"]),
.wfm-route-content .form-field select,
.wfm-route-content .form-field .search-select-button {
  min-height: var(--ds-control-height);
  height: var(--ds-control-height);
}

.wfm-app .form-field textarea,
.wfm-route-content .form-field textarea {
  min-height: 7.5rem;
  resize: vertical;
  line-height: 1.45;
}

.wfm-app .form-field.full textarea,
.wfm-route-content .form-field.full textarea {
  min-height: 8.5rem;
}

.wfm-app .form-grid > .btn,
.wfm-app .form-grid > button,
.wfm-route-content .form-grid > .btn,
.wfm-route-content .form-grid > button {
  grid-column: 1 / -1;
  justify-self: end;
  width: auto;
  min-width: var(--wfm-action-min-width);
  min-height: var(--ds-control-height);
  padding-inline: 1.1rem;
}

.wfm-app .form-grid > .form-actions,
.wfm-app .form-grid > .form-field.full.d-flex,
.wfm-route-content .form-grid > .form-actions,
.wfm-route-content .form-grid > .form-field.full.d-flex {
  grid-column: 1 / -1;
  display: flex !important;
  justify-content: flex-end;
  align-items: center;
  gap: .75rem;
  margin-top: .15rem;
  padding-top: .85rem;
  border-top: 1px solid color-mix(in srgb, var(--ds-line) 78%, transparent);
}

.wfm-app .form-actions .btn,
.wfm-route-content .form-actions .btn {
  min-width: var(--wfm-action-min-width);
  min-height: var(--ds-control-height);
}

.wfm-definition-grid {
  display: grid;
  grid-template-columns: minmax(6.5rem, max-content) minmax(0, 1fr) minmax(6.5rem, max-content) minmax(0, 1fr);
  gap: .8rem 1.25rem;
  align-items: start;
}

.wfm-definition-grid dt,
.wfm-definition-grid dd {
  min-width: 0;
}

.wfm-definition-grid dt {
  margin: 0 0 .18rem;
  color: var(--ds-heading);
  font-size: .78rem;
  font-weight: 900;
  line-height: 1.25;
}

.wfm-definition-grid dd {
  margin: 0;
  color: var(--ds-text);
  overflow-wrap: anywhere;
  line-height: 1.35;
}

.wfm-definition-grid dd + dt {
  margin-top: 0;
}

@media (max-width: 1100px) {
  .wfm-definition-grid {
    grid-template-columns: minmax(6.5rem, max-content) minmax(0, 1fr);
  }
}

.wfm-app .ds-table-toolbar,
.wfm-route-content .ds-table-toolbar {
  grid-template-columns: minmax(5.75rem, max-content) minmax(18rem, 34rem) max-content;
  justify-content: space-between;
  align-items: end;
  gap: .65rem;
  padding: .75rem;
}

.wfm-app .ds-table-size,
.wfm-route-content .ds-table-size {
  grid-column: 1;
}

.wfm-app .ds-table-search,
.wfm-route-content .ds-table-search {
  grid-column: 2;
  justify-self: stretch;
  width: 100%;
}

.wfm-app .ds-table-export,
.wfm-route-content .ds-table-export {
  grid-column: 3;
  justify-content: end;
}

.wfm-app .dragon-table .status-pill,
.wfm-route-content .dragon-table .status-pill {
  justify-self: start;
}

.wfm-app .phone-field,
.wfm-route-content .phone-field {
  display: grid;
  grid-template-columns: minmax(15rem, .72fr) minmax(14rem, 1fr);
  gap: .65rem;
  align-items: start;
}

.wfm-app .phone-field .search-select-button .search-select-label,
.wfm-route-content .phone-field .search-select-button .search-select-label {
  flex: 0 1 auto;
}

.wfm-app .phone-field .search-select-button .search-select-text small,
.wfm-route-content .phone-field .search-select-button .search-select-text small {
  flex: 1 1 auto;
}

.ds-switch {
  display: inline-flex;
  align-items: center;
  gap: .7rem;
  min-height: var(--ds-control-height);
  width: fit-content;
  color: var(--ds-heading);
  font-weight: 850;
  cursor: pointer;
}

.wfm-app .form-field label.ds-switch,
.wfm-route-content .form-field label.ds-switch {
  display: inline-flex;
  color: var(--ds-heading);
  font-size: .95rem;
  font-weight: 850;
  line-height: 1.2;
}

.wfm-app .form-field.form-field-switch,
.wfm-route-content .form-field.form-field-switch {
  justify-content: end;
  min-height: calc(var(--ds-control-height) + 1.65rem);
}

.ds-switch input[type="checkbox"] {
  position: absolute;
  width: 1px;
  height: 1px;
  opacity: 0;
  pointer-events: none;
}

.ds-switch-ui {
  position: relative;
  display: inline-flex;
  flex: 0 0 auto;
  width: 2.85rem;
  height: 1.55rem;
  border: 1px solid color-mix(in srgb, var(--ds-line) 88%, var(--ds-primary));
  border-radius: 999px;
  background: color-mix(in srgb, var(--ds-surface-muted) 88%, var(--ds-bg));
  box-shadow: inset 0 1px 2px rgba(0, 0, 0, .22);
  transition: background-color .16s ease, border-color .16s ease, box-shadow .16s ease;
}

.ds-switch-ui::after {
  content: "";
  position: absolute;
  top: .18rem;
  left: .18rem;
  width: 1.08rem;
  height: 1.08rem;
  border-radius: 999px;
  background: var(--ds-heading);
  box-shadow: 0 2px 6px rgba(0, 0, 0, .28);
  transition: transform .16s ease, background-color .16s ease;
}

.ds-switch input[type="checkbox"]:checked + .ds-switch-ui {
  border-color: var(--ds-primary);
  background: color-mix(in srgb, var(--ds-primary) 34%, var(--ds-surface-muted));
}

.ds-switch input[type="checkbox"]:checked + .ds-switch-ui::after {
  transform: translateX(1.3rem);
  background: #fff;
}

.ds-switch input[type="checkbox"]:focus-visible + .ds-switch-ui {
  outline: .22rem solid color-mix(in srgb, var(--ds-primary) 25%, transparent);
  outline-offset: 2px;
}

.search-select-panel {
  position: absolute;
  top: calc(100% + .35rem);
  left: 0;
  right: 0;
  z-index: 3000;
  max-height: min(22rem, calc(100vh - 4rem));
  overflow: hidden;
  box-shadow: 0 18px 44px rgba(2, 8, 20, .34);
}

.search-select-shell.is-drop-up .search-select-panel {
  top: auto;
  bottom: calc(100% + .35rem);
}

.search-select-list {
  max-height: min(16rem, calc(100vh - 8rem));
  overflow: auto;
}

.ds-table-toolbar {
  grid-template-columns: max-content minmax(16rem, 34rem) max-content;
  align-items: end;
  justify-content: space-between;
}

.ds-table-size {
  grid-column: 1;
}

.ds-table-search {
  grid-column: 2;
  justify-self: end;
  width: min(100%, 34rem);
}

.ds-table-export {
  grid-column: 3;
}

.ds-server-empty-row {
  display: none !important;
}

.ds-empty-row td {
  height: var(--ds-row-height);
}

@media (max-width: 760px) {
  .wfm-app,
  .wfm-shell,
  .wfm-route-content,
  .wfm-app .surface-panel,
  .wfm-route-content .surface-panel {
    width: 100%;
    max-width: 100%;
    min-width: 0;
  }

  .wfm-app .dashboard-grid,
  .wfm-route-content .dashboard-grid {
    grid-template-columns: minmax(0, 1fr);
  }

  .ds-table-toolbar {
    grid-template-columns: 1fr;
    width: 100%;
    min-width: 0;
  }

  .ds-table-search,
  .ds-table-size,
  .ds-table-export {
    grid-column: 1;
    width: 100%;
    min-width: 0;
  }

  .ds-table-export {
    justify-content: stretch;
  }

  .ds-table-export .btn,
  .ds-table-export button {
    flex: 1 1 0;
    min-width: 0;
  }

  .wfm-app .ds-table-toolbar,
  .wfm-route-content .ds-table-toolbar {
    grid-template-columns: minmax(5.75rem, .42fr) minmax(0, 1fr);
    gap: .55rem;
    align-items: end;
    padding: .75rem;
  }

  .wfm-app .ds-table-search,
  .wfm-route-content .ds-table-search {
    grid-column: 1 / -1;
    width: 100%;
  }

  .wfm-app .ds-table-size,
  .wfm-route-content .ds-table-size {
    grid-column: 1;
  }

  .wfm-app .ds-table-export,
  .wfm-route-content .ds-table-export {
    display: grid;
    grid-column: 2;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: .4rem;
  }

  .wfm-app .ds-table-export button,
  .wfm-route-content .ds-table-export button {
    min-height: 2.85rem;
    padding-inline: .45rem;
  }

  .wfm-app .table-responsive,
  .wfm-route-content .table-responsive {
    overflow-x: visible;
    max-width: 100%;
  }

  .wfm-app table.dragon-table.ds-smart-table,
  .wfm-route-content table.dragon-table.ds-smart-table {
    display: block;
    width: 100%;
    min-width: 0;
    border-collapse: separate;
    border-spacing: 0;
  }

  .wfm-app table.dragon-table.ds-smart-table thead,
  .wfm-route-content table.dragon-table.ds-smart-table thead {
    position: absolute !important;
    width: 1px;
    height: 1px;
    margin: -1px;
    padding: 0;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border: 0;
  }

  .wfm-app table.dragon-table.ds-smart-table tbody,
  .wfm-route-content table.dragon-table.ds-smart-table tbody {
    display: grid;
    gap: .8rem;
    width: 100%;
  }

  .wfm-app table.dragon-table.ds-smart-table tbody tr,
  .wfm-route-content table.dragon-table.ds-smart-table tbody tr {
    display: grid;
    gap: .55rem;
    width: 100%;
    height: auto;
    min-height: 0;
    padding: .95rem;
    border: 1px solid var(--ds-border);
    border-radius: 8px;
    background: color-mix(in srgb, var(--ds-surface) 92%, var(--ds-bg));
    box-shadow: 0 12px 30px color-mix(in srgb, var(--ds-ink) 10%, transparent);
  }

  .wfm-app table.dragon-table.ds-smart-table tbody tr[hidden],
  .wfm-route-content table.dragon-table.ds-smart-table tbody tr[hidden] {
    display: none !important;
  }

  .wfm-app table.dragon-table.ds-smart-table tbody td,
  .wfm-route-content table.dragon-table.ds-smart-table tbody td {
    display: grid;
    grid-template-columns: minmax(5.35rem, .34fr) minmax(0, 1fr);
    gap: .75rem;
    align-items: start;
    width: 100%;
    height: auto;
    min-height: 0;
    padding: .08rem 0;
    border: 0;
    overflow-wrap: anywhere;
  }

  .wfm-app table.dragon-table.ds-smart-table tbody td::before,
  .wfm-route-content table.dragon-table.ds-smart-table tbody td::before {
    content: attr(data-mobile-label);
    color: var(--ds-muted);
    font-size: .72rem;
    font-weight: 900;
    line-height: 1.35;
    text-transform: uppercase;
    letter-spacing: .02em;
  }

  .wfm-app table.dragon-table.ds-smart-table tbody td[data-mobile-full="true"],
  .wfm-route-content table.dragon-table.ds-smart-table tbody td[data-mobile-full="true"] {
    grid-template-columns: 1fr;
  }

  .wfm-app table.dragon-table.ds-smart-table tbody td[data-mobile-full="true"]::before,
  .wfm-route-content table.dragon-table.ds-smart-table tbody td[data-mobile-full="true"]::before {
    display: none;
  }

  .wfm-app table.dragon-table.ds-smart-table tbody td > details,
  .wfm-route-content table.dragon-table.ds-smart-table tbody td > details,
  .wfm-app table.dragon-table.ds-smart-table tbody td > form,
  .wfm-route-content table.dragon-table.ds-smart-table tbody td > form {
    min-width: 0;
    max-width: 100%;
  }

  .wfm-app table.dragon-table.ds-smart-table tbody td details .form-grid,
  .wfm-route-content table.dragon-table.ds-smart-table tbody td details .form-grid,
  .wfm-app table.dragon-table.ds-smart-table tbody td .inline-action-form,
  .wfm-route-content table.dragon-table.ds-smart-table tbody td .inline-action-form {
    grid-template-columns: 1fr;
  }

  .phone-field {
    grid-template-columns: 1fr;
  }

  .wfm-app .form-grid,
  .wfm-route-content .form-grid,
  .wfm-app .phone-field,
  .wfm-route-content .phone-field {
    grid-template-columns: 1fr;
  }

  .wfm-app .form-grid > .btn,
  .wfm-app .form-grid > button,
  .wfm-route-content .form-grid > .btn,
  .wfm-route-content .form-grid > button,
  .wfm-app .form-actions .btn,
  .wfm-route-content .form-actions .btn {
    width: 100%;
  }

  .decision-column,
  .decision-cell {
    width: auto;
    min-width: 10.5rem;
  }

  .decision-form {
    justify-content: flex-start;
  }

  .decision-form .btn {
    min-width: 4.8rem;
  }

  .security-definition-list div,
  .inline-action-form {
    grid-template-columns: 1fr;
  }
}

/* Final WFM enterprise control alignment standard. Keep this at the end so it wins over older route-specific rules. */
.wfm-app .ds-table-toolbar,
.wfm-route-content .ds-table-toolbar {
  display: grid !important;
  grid-template-columns: max-content minmax(18rem, 1fr) max-content !important;
  grid-template-areas: "rows search export";
  align-items: end !important;
  gap: .75rem !important;
  width: 100%;
  min-height: auto;
}

.wfm-app .ds-table-size,
.wfm-route-content .ds-table-size {
  grid-area: rows;
  align-self: end;
  width: auto;
  min-width: 5.75rem;
}

.wfm-app .ds-table-search,
.wfm-route-content .ds-table-search {
  grid-area: search;
  align-self: end;
  justify-self: stretch;
  width: 100%;
  max-width: none;
  min-width: 0;
}

.wfm-app .ds-table-export,
.wfm-route-content .ds-table-export {
  grid-area: export;
  align-self: end;
  justify-self: end;
  display: flex;
  flex-wrap: nowrap;
  gap: .45rem;
}

.wfm-app .phone-field,
.wfm-route-content .phone-field {
  grid-template-columns: minmax(15rem, .65fr) minmax(16rem, 1fr);
  align-items: end;
}

.wfm-app .phone-field.phone-field--national,
.wfm-route-content .phone-field.phone-field--national {
  grid-template-columns: minmax(15rem, 38%) minmax(0, 1fr);
  align-items: end;
}

.wfm-app .phone-field.phone-field--locked-prefix,
.wfm-route-content .phone-field.phone-field--locked-prefix {
  grid-template-columns: minmax(15rem, 38%) minmax(0, 1fr);
  align-items: end;
}

.wfm-app .phone-field.phone-field--national input[data-phone-national],
.wfm-route-content .phone-field.phone-field--national input[data-phone-national] {
  width: 100%;
  min-width: 0;
  height: var(--ds-control-height) !important;
  min-height: var(--ds-control-height) !important;
  border: 1px solid var(--ds-border);
  border-radius: 8px;
  background: var(--ds-surface-muted);
  color: var(--ds-text);
  padding: 0 .85rem;
  font: inherit;
  font-weight: 650;
  line-height: 1.2;
}

.wfm-app .phone-field.phone-field--national input[data-phone-national]:focus,
.wfm-route-content .phone-field.phone-field--national input[data-phone-national]:focus {
  border-color: var(--ds-primary);
  box-shadow: 0 0 0 .18rem color-mix(in srgb, var(--ds-primary) 18%, transparent);
}

.wfm-app .phone-number-control,
.wfm-route-content .phone-number-control {
  display: flex;
  align-items: center;
  width: 100%;
  min-width: 0;
  max-width: 100%;
  background: var(--ds-surface-muted);
  border: 1px solid var(--ds-border);
  border-radius: 8px;
  box-shadow: inset 0 1px 0 color-mix(in srgb, var(--ds-heading) 4%, transparent);
  color: var(--ds-text);
  overflow: hidden;
}

.wfm-app .phone-number-control input[data-phone-national],
.wfm-route-content .phone-number-control input[data-phone-national] {
  min-width: 8rem;
}

.wfm-app .form-field .phone-number-control,
.wfm-route-content .form-field .phone-number-control {
  height: var(--ds-control-height) !important;
  min-height: var(--ds-control-height) !important;
  border: 1px solid var(--ds-border) !important;
  background: var(--ds-surface-muted) !important;
  box-shadow: inset 0 1px 0 color-mix(in srgb, var(--ds-heading) 4%, transparent) !important;
}

.wfm-app .form-field .phone-field--locked-prefix .phone-number-control,
.wfm-route-content .form-field .phone-field--locked-prefix .phone-number-control {
  border-radius: 8px;
  box-shadow:
    inset 0 1px 0 color-mix(in srgb, var(--ds-heading) 5%, transparent),
    inset 0 -1px 0 color-mix(in srgb, var(--ds-bg) 28%, transparent) !important;
}

.wfm-app .form-field .phone-number-control:focus-within,
.wfm-route-content .form-field .phone-number-control:focus-within {
  border-color: var(--ds-primary) !important;
  box-shadow: 0 0 0 .18rem color-mix(in srgb, var(--ds-primary) 18%, transparent) !important;
}

.wfm-app .form-field .phone-number-control input[data-phone-national],
.wfm-route-content .form-field .phone-number-control input[data-phone-national] {
  height: 100% !important;
  min-height: 0 !important;
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  color: var(--ds-text);
  padding: 0 .85rem;
  font: inherit;
  font-weight: 650;
  line-height: 1.2;
}

.wfm-app .search-select-button::after,
.wfm-route-content .search-select-button::after {
  opacity: .9;
  border-top-color: currentColor;
}

.wfm-app .search-select-button:hover::after,
.wfm-app .search-select-button:focus-visible::after,
.wfm-route-content .search-select-button:hover::after,
.wfm-route-content .search-select-button:focus-visible::after {
  opacity: 1;
  border-top-color: currentColor;
}

.search-select-shell [data-tooltip]::after,
.search-select-shell [data-tooltip]::before {
  display: none !important;
}

@media (max-width: 760px) {
  .wfm-app .ds-table-toolbar,
  .wfm-route-content .ds-table-toolbar {
    grid-template-columns: 1fr !important;
    grid-template-areas:
      "search"
      "rows"
      "export";
  }

  .wfm-app .ds-table-size,
  .wfm-route-content .ds-table-size,
  .wfm-app .ds-table-search,
  .wfm-route-content .ds-table-search,
  .wfm-app .ds-table-export,
  .wfm-route-content .ds-table-export {
    width: 100%;
  }

  .wfm-app .ds-table-export,
  .wfm-route-content .ds-table-export {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  .wfm-app .phone-field,
  .wfm-route-content .phone-field {
    grid-template-columns: 1fr;
  }

  .wfm-app .phone-field.phone-field--national,
  .wfm-route-content .phone-field.phone-field--national {
    grid-template-columns: 1fr;
  }
}

/* Phase 7 owner UX standard: WFM control, table and sidebar refinements. */
.select-symbol {
  width: 2.1rem;
  height: 2.1rem;
  flex: 0 0 2.1rem;
  display: inline-grid;
  place-items: center;
  border-radius: 999px;
  border: 1px solid color-mix(in srgb, var(--ds-line) 78%, var(--ds-primary));
  background: color-mix(in srgb, var(--ds-primary) 13%, var(--ds-surface-muted));
  color: var(--ds-heading);
  font-size: .75rem;
  font-weight: 900;
  letter-spacing: 0;
}

.wfm-app .form-field input:not([type="checkbox"]):not([type="radio"]):not([type="range"]):not([type="file"]),
.wfm-app .form-field select,
.wfm-app .form-field .search-select-button,
.wfm-route-content .form-field input:not([type="checkbox"]):not([type="radio"]):not([type="range"]):not([type="file"]),
.wfm-route-content .form-field select,
.wfm-route-content .form-field .search-select-button {
  min-height: var(--ds-control-height) !important;
  height: var(--ds-control-height) !important;
  line-height: 1.2;
}

.wfm-app .search-select-button,
.wfm-route-content .search-select-button {
  display: flex;
  align-items: center;
  gap: .55rem;
}

.wfm-app .search-select-button .search-select-text,
.wfm-route-content .search-select-button .search-select-text {
  flex: 1 1 auto;
}

.wfm-app .search-select-button::after,
.wfm-route-content .search-select-button::after {
  right: 1rem;
  color: var(--ds-muted) !important;
  opacity: 1 !important;
}

.wfm-app .search-select-button:hover::after,
.wfm-route-content .search-select-button:hover::after {
  color: var(--ds-heading) !important;
}

.wfm-app .ds-table-toolbar,
.wfm-route-content .ds-table-toolbar {
  grid-template-columns: max-content minmax(16rem, 1fr) max-content !important;
  grid-template-areas: "rows search export" !important;
  align-items: end !important;
  column-gap: .75rem !important;
  row-gap: .45rem !important;
}

.wfm-app .ds-table-search,
.wfm-app .ds-table-size,
.wfm-route-content .ds-table-search,
.wfm-route-content .ds-table-size {
  display: grid;
  grid-template-rows: 1.05rem var(--ds-control-height);
  gap: .3rem;
  align-items: end;
  align-self: end !important;
}

.wfm-app .ds-table-search input,
.wfm-app .ds-table-size .search-select-button,
.wfm-route-content .ds-table-search input,
.wfm-route-content .ds-table-size .search-select-button {
  height: var(--ds-control-height) !important;
  min-height: var(--ds-control-height) !important;
}

.wfm-app .ds-table-export,
.wfm-route-content .ds-table-export {
  align-self: end !important;
  height: var(--ds-control-height);
  align-items: stretch;
}

.wfm-app .ds-table-export button,
.wfm-route-content .ds-table-export button {
  min-width: 3.75rem;
  height: var(--ds-control-height) !important;
}

.ds-row-check {
  position: relative;
  display: inline-grid;
  place-items: center;
  width: 1.65rem;
  height: 1.65rem;
  cursor: pointer;
}

.ds-row-check input[type="checkbox"] {
  position: absolute;
  inset: 0;
  opacity: 0;
  cursor: pointer;
}

.ds-row-check > span {
  position: relative;
  width: 1.35rem;
  height: 1.35rem;
  border-radius: 6px;
  border: 1px solid color-mix(in srgb, var(--ds-line) 82%, var(--ds-primary));
  background: color-mix(in srgb, var(--ds-surface-muted) 90%, var(--ds-bg));
  box-shadow: inset 0 1px 0 color-mix(in srgb, var(--ds-heading) 5%, transparent);
  transition: background-color .14s ease, border-color .14s ease, transform .14s ease;
}

.ds-row-check:hover > span {
  transform: translateY(-1px) scale(1.04);
  border-color: var(--ds-primary);
}

.ds-row-check input[type="checkbox"]:checked + span {
  background: var(--ds-primary);
  border-color: var(--ds-primary);
}

.ds-row-check input[type="checkbox"]:checked + span::after {
  content: "";
  position: absolute;
  width: .56rem;
  height: .32rem;
  border-left: 2px solid #07111e;
  border-bottom: 2px solid #07111e;
  transform: rotate(-45deg);
}

.trash-tabs {
  display: flex;
  gap: .5rem;
  margin-bottom: 1rem;
  border-bottom: 1px solid var(--ds-line);
}

.trash-tabs .nav-link {
  min-height: 2.65rem;
  border: 1px solid var(--ds-border);
  border-bottom: 0;
  border-radius: 8px 8px 0 0;
  color: var(--ds-muted);
  background: color-mix(in srgb, var(--ds-surface-muted) 86%, transparent);
  font-weight: 850;
}

.trash-tabs .nav-link.active {
  color: var(--ds-heading);
  background: var(--ds-surface);
  box-shadow: inset 0 3px 0 var(--ds-primary);
}

body.sidebar-collapsed .portal-sidebar .sidebar-nav a,
body.sidebar-collapsed .sidebar-footer a {
  transition: transform .16s ease, background-color .16s ease, box-shadow .16s ease;
}

body.sidebar-collapsed .portal-sidebar .sidebar-nav a:hover,
body.sidebar-collapsed .sidebar-footer a:hover {
  transform: translateX(.2rem) scale(1.08);
  z-index: 2;
}

body.sidebar-collapsed .portal-sidebar .sidebar-nav a:hover .nav-icon,
body.sidebar-collapsed .sidebar-footer a:hover .nav-icon {
  box-shadow: 0 12px 30px color-mix(in srgb, var(--ds-primary) 28%, transparent);
}

.sidebar-app-launcher {
  display: none;
  min-height: 0;
}

body.sidebar-apps .portal-frame {
  grid-template-columns: 360px minmax(0, 1fr);
}

body.sidebar-apps .portal-sidebar {
  padding: 1rem;
}

body.sidebar-apps .sidebar-nav,
body.sidebar-apps .sidebar-footer {
  display: none;
}

body.sidebar-apps .sidebar-app-launcher {
  display: grid;
  grid-template-rows: auto minmax(0, 1fr);
  gap: 1rem;
  min-height: 0;
  flex: 1 1 auto;
}

.sidebar-app-search {
  position: relative;
}

.sidebar-app-search span {
  position: absolute;
  left: .85rem;
  top: 50%;
  transform: translateY(-50%);
  color: var(--ds-sidebar-muted);
  font-size: .78rem;
  font-weight: 900;
}

.sidebar-app-search input {
  width: 100%;
  height: var(--ds-control-height);
  padding-left: 2.3rem;
  border: 1px solid color-mix(in srgb, var(--ds-sidebar-ink) 16%, transparent);
  border-radius: 8px;
  background: color-mix(in srgb, var(--ds-sidebar-hover) 62%, transparent);
  color: var(--ds-sidebar-ink);
}

.sidebar-app-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: .75rem;
  align-content: start;
  overflow: auto;
  padding-right: .2rem;
}

.sidebar-app-grid a {
  display: grid;
  justify-items: center;
  gap: .45rem;
  min-height: 5.6rem;
  padding: .8rem .45rem;
  border: 1px solid color-mix(in srgb, var(--ds-sidebar-ink) 13%, transparent);
  border-radius: 8px;
  background: color-mix(in srgb, var(--ds-sidebar-hover) 70%, transparent);
  color: var(--ds-sidebar-ink);
  text-align: center;
  text-decoration: none;
  font-size: .78rem;
  font-weight: 750;
  line-height: 1.18;
}

.sidebar-app-grid a:hover,
.sidebar-app-grid a.active {
  background: var(--ds-sidebar-active);
  transform: translateY(-2px);
  box-shadow: 0 14px 34px color-mix(in srgb, var(--ds-sidebar-ink) 12%, transparent);
}

body.sidebar-apps [data-sidebar-apps] {
  background: var(--ds-accent);
  color: #07111e;
}

@media (max-width: 760px) {
  .wfm-app .ds-table-toolbar,
  .wfm-route-content .ds-table-toolbar {
    grid-template-columns: 1fr !important;
    grid-template-areas:
      "search"
      "rows"
      "export" !important;
  }

  .wfm-app .ds-table-export,
  .wfm-route-content .ds-table-export {
    height: auto;
  }

  body.sidebar-apps .portal-frame {
    grid-template-columns: 1fr;
  }
}

/* Phase 7 sidebar and WFM local navigation overlay corrections. */
body.sidebar-apps .portal-frame {
  grid-template-columns: 260px minmax(0, 1fr) !important;
}

body.sidebar-collapsed.sidebar-apps .portal-frame {
  grid-template-columns: 96px minmax(0, 1fr) !important;
}

body.sidebar-apps .portal-sidebar {
  padding: 1rem !important;
}

body.sidebar-apps .sidebar-nav,
body.sidebar-apps .sidebar-footer {
  display: grid;
}

body.sidebar-apps .sidebar-scrim {
  display: block;
  position: fixed;
  inset: 0;
  z-index: 1030;
  border: 0;
  background: color-mix(in srgb, #000 38%, transparent);
  backdrop-filter: blur(1px);
}

body.sidebar-apps .sidebar-app-launcher {
  position: fixed;
  top: .85rem;
  left: clamp(5rem, 7vw, 8.5rem);
  z-index: 1060;
  display: grid;
  grid-template-rows: auto minmax(0, 1fr);
  gap: 1rem;
  width: min(42rem, calc(100vw - 7rem));
  max-height: min(42rem, calc(100dvh - 1.7rem));
  padding: .75rem;
  border: 1px solid color-mix(in srgb, var(--ds-sidebar-ink) 16%, transparent);
  border-radius: 14px;
  background:
    radial-gradient(circle at 10% 0, color-mix(in srgb, var(--ds-primary) 10%, transparent), transparent 34%),
    color-mix(in srgb, var(--ds-sidebar-bg) 96%, var(--ds-surface));
  box-shadow: 0 24px 70px rgba(0, 0, 0, .34);
}

body.sidebar-collapsed.sidebar-apps .sidebar-app-launcher {
  left: 4.8rem;
}

:root[data-theme="light"] body.sidebar-apps .sidebar-app-launcher {
  background:
    radial-gradient(circle at 10% 0, color-mix(in srgb, var(--ds-primary) 10%, transparent), transparent 34%),
    color-mix(in srgb, var(--ds-surface) 96%, #fff);
  box-shadow: 0 24px 70px rgba(15, 23, 42, .22);
}

.sidebar-app-grid {
  grid-template-columns: repeat(auto-fit, minmax(7.25rem, 1fr)) !important;
  gap: .7rem !important;
  max-height: calc(100dvh - 7.5rem);
}

.sidebar-app-grid a {
  min-height: 6.1rem;
  padding: .75rem .55rem;
  align-content: center;
  transition: transform .16s ease, background-color .16s ease, border-color .16s ease, box-shadow .16s ease;
}

.sidebar-app-grid a > span:last-child {
  display: -webkit-box;
  max-width: 100%;
  overflow: hidden;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow-wrap: break-word;
  word-break: normal;
  hyphens: auto;
}

.sidebar-app-grid a:hover,
.sidebar-app-grid a:focus-visible,
.sidebar-app-grid a.active {
  transform: translateY(-3px) scale(1.035);
  border-color: color-mix(in srgb, var(--ds-primary) 72%, var(--ds-line));
  box-shadow: 0 18px 42px color-mix(in srgb, var(--ds-primary) 20%, transparent);
}

body.sidebar-collapsed .portal-sidebar .sidebar-nav a,
body.sidebar-collapsed .sidebar-footer a {
  position: relative;
  transform-origin: center;
  transition: transform .18s cubic-bezier(.2, .9, .2, 1.25), background-color .16s ease, box-shadow .16s ease;
}

body.sidebar-collapsed .portal-sidebar .sidebar-nav a:hover,
body.sidebar-collapsed .portal-sidebar .sidebar-nav a:focus-visible,
body.sidebar-collapsed .sidebar-footer a:hover,
body.sidebar-collapsed .sidebar-footer a:focus-visible {
  transform: translateX(.48rem) scale(1.18);
  z-index: 4;
  background: color-mix(in srgb, var(--ds-sidebar-active) 82%, var(--ds-sidebar-hover));
  box-shadow: 0 16px 38px color-mix(in srgb, var(--ds-primary) 24%, transparent);
}

body.sidebar-collapsed .portal-sidebar .sidebar-nav a:hover .nav-icon,
body.sidebar-collapsed .portal-sidebar .sidebar-nav a:focus-visible .nav-icon,
body.sidebar-collapsed .sidebar-footer a:hover .nav-icon,
body.sidebar-collapsed .sidebar-footer a:focus-visible .nav-icon {
  transform: scale(1.12);
  box-shadow: 0 16px 38px color-mix(in srgb, var(--ds-primary) 34%, transparent);
}

.wfm-local-nav-toggle,
.wfm-local-nav-scrim,
.wfm-local-nav-close {
  display: none;
}

.wfm-nav-link-title,
.wfm-nav-link-description {
  overflow-wrap: break-word;
  word-break: normal;
  hyphens: auto;
}

@media (max-width: 900px) {
  .wfm-shell {
    grid-template-columns: 1fr !important;
  }

  .wfm-local-nav-toggle {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: fit-content;
    min-width: 9rem;
  }

  .wfm-local-nav {
    position: fixed !important;
    inset: 0 auto 0 0;
    z-index: 1060;
    width: min(21rem, 88vw);
    height: 100dvh;
    max-height: none !important;
    border-radius: 0 12px 12px 0;
    transform: translateX(-105%);
    transition: transform .2s ease;
    box-shadow: 18px 0 48px rgba(0, 0, 0, .36);
  }

  body.wfm-local-nav-open {
    overflow: hidden;
  }

  body.wfm-local-nav-open .wfm-local-nav {
    transform: translateX(0);
  }

  .wfm-local-nav-scrim {
    position: fixed;
    inset: 0;
    z-index: 1050;
    border: 0;
    padding: 0;
    background: color-mix(in srgb, #000 44%, transparent);
  }

  body.wfm-local-nav-open .wfm-local-nav-scrim {
    display: block;
  }

  .wfm-local-nav-close {
    display: inline-grid;
    margin-left: auto;
    width: 2.25rem;
    height: 2.25rem;
  }

  .wfm-local-nav-heading {
    position: sticky;
    top: 0;
    z-index: 2;
    padding-bottom: .7rem;
    background: color-mix(in srgb, var(--ds-surface) 92%, var(--ds-bg));
  }

  .wfm-nav-groups {
    grid-template-columns: 1fr !important;
  }
}

@media (max-width: 760px) {
  body.sidebar-apps .portal-frame,
  body.sidebar-collapsed.sidebar-apps .portal-frame {
    grid-template-columns: 1fr !important;
  }

  body.sidebar-apps .sidebar-app-launcher,
  body.sidebar-collapsed.sidebar-apps .sidebar-app-launcher {
    top: .65rem;
    left: .65rem;
    right: .65rem;
    width: auto;
    max-height: calc(100dvh - 1.3rem);
  }

  .sidebar-app-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }
}

/* Phase 7 launcher stacking and filtering fix. */
body.sidebar-apps .portal-sidebar {
  z-index: 3040 !important;
  overflow: visible !important;
}

body.sidebar-apps .portal-topbar {
  z-index: 24;
}

body.sidebar-apps .sidebar-scrim {
  z-index: 3000 !important;
  background: color-mix(in srgb, #000 52%, transparent) !important;
  backdrop-filter: none !important;
}

body.sidebar-apps .sidebar-app-launcher,
body.sidebar-collapsed.sidebar-apps .sidebar-app-launcher {
  top: calc(var(--topbar-height, 64px) + .75rem) !important;
  left: clamp(5.2rem, 6vw, 7.5rem) !important;
  z-index: 3050 !important;
  filter: none !important;
  opacity: 1 !important;
  transform: translateZ(0);
  isolation: isolate;
}

body.sidebar-apps .sidebar-app-search {
  z-index: 2;
}

body.sidebar-apps .sidebar-app-search input {
  background: color-mix(in srgb, var(--ds-surface) 92%, var(--ds-sidebar-bg)) !important;
  color: var(--ds-heading) !important;
  border-color: color-mix(in srgb, var(--ds-primary) 34%, var(--ds-border)) !important;
}

.sidebar-app-empty {
  grid-column: 1 / -1;
  display: grid;
  min-height: 5.5rem;
  place-items: center;
  border: 1px dashed color-mix(in srgb, var(--ds-sidebar-ink) 22%, transparent);
  border-radius: 8px;
  color: var(--ds-sidebar-muted);
  font-weight: 850;
}

.sidebar-app-empty[hidden] {
  display: none !important;
}

@media (max-width: 760px) {
  body.sidebar-apps .portal-sidebar {
    overflow: hidden !important;
  }

  body.sidebar-apps .sidebar-app-launcher,
  body.sidebar-collapsed.sidebar-apps .sidebar-app-launcher {
    top: .75rem !important;
    left: .75rem !important;
    right: .75rem !important;
  }
}

/* Phase 7 launcher ownership, secondary navigation opacity and WFM table density. */
body.sidebar-apps .portal-frame,
body.sidebar-collapsed.sidebar-apps .portal-frame {
  grid-template-columns: 0 minmax(0, 1fr) !important;
}

body.sidebar-apps .portal-sidebar {
  width: 0 !important;
  min-width: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  overflow: visible !important;
}

body.sidebar-apps .sidebar-header,
body.sidebar-apps .sidebar-nav,
body.sidebar-apps .sidebar-footer {
  display: none !important;
}

/* Final runtime standard: logout clarity, global table density and compact launcher rail. */
.public-signout-form {
  margin: 0;
}

.public-signout-link {
  appearance: none;
  background: transparent;
  border: 0;
  color: var(--ds-danger, #ef4444) !important;
  cursor: pointer;
  font: inherit;
  padding: var(--bs-nav-link-padding-y, .5rem) var(--bs-nav-link-padding-x, 1rem);
}

.public-signout-link:hover,
.public-signout-link:focus-visible {
  color: var(--ds-danger-strong, #fecaca) !important;
  text-decoration: underline;
}

.portal-main table,
.public-main table,
.dragon-table,
.enterprise-table,
.document-table,
.activity-table,
.trash-table,
.audit-table,
.admin-table,
.ds-smart-table,
.compact-table,
.table {
  font-size: .84rem;
}

.portal-main table th,
.public-main table th,
.dragon-table th,
.enterprise-table th,
.document-table th,
.activity-table th,
.trash-table th,
.audit-table th,
.admin-table th,
.ds-smart-table th,
.compact-table th,
.table th {
  font-size: .72rem !important;
  line-height: 1.2;
}

.portal-main table td,
.public-main table td,
.dragon-table td,
.enterprise-table td,
.document-table td,
.activity-table td,
.trash-table td,
.audit-table td,
.admin-table td,
.ds-smart-table td,
.compact-table td,
.table td {
  font-size: .82rem !important;
  line-height: 1.32;
}

.portal-main table .btn,
.portal-main table button,
.dragon-table .btn,
.dragon-table button,
.enterprise-table .btn,
.enterprise-table button,
.ds-smart-table .btn,
.ds-smart-table button,
.compact-table .btn,
.compact-table button {
  font-size: .76rem !important;
}

body.sidebar-launcher-mode:not(.sidebar-apps) .portal-frame {
  grid-template-columns: 5.15rem minmax(0, 1fr) !important;
}

body.sidebar-launcher-mode:not(.sidebar-apps) .portal-sidebar {
  width: 5.15rem !important;
  min-width: 5.15rem !important;
  padding: .75rem .45rem !important;
}

body.sidebar-launcher-mode:not(.sidebar-apps) .sidebar-header {
  display: flex !important;
  flex-direction: row !important;
  align-items: center !important;
  justify-content: center !important;
  gap: .38rem !important;
}

body.sidebar-launcher-mode:not(.sidebar-apps) .sidebar-brand,
body.sidebar-launcher-mode:not(.sidebar-apps) .sidebar-controls,
body.sidebar-launcher-mode:not(.sidebar-apps) .sidebar-header > .sidebar-controls [data-sidebar-apps] {
  display: inline-grid !important;
  flex: 0 0 auto;
}

body.sidebar-launcher-mode:not(.sidebar-apps) .sidebar-brand {
  width: 2.05rem;
  height: 2.05rem;
  place-items: center;
}

body.sidebar-launcher-mode:not(.sidebar-apps) .sidebar-logo,
body.sidebar-launcher-mode:not(.sidebar-apps) .sidebar-header > .sidebar-controls [data-sidebar-apps] {
  width: 2.05rem !important;
  height: 2.05rem !important;
}

body.sidebar-launcher-mode:not(.sidebar-apps) .sidebar-controls {
  margin: 0 !important;
  gap: 0 !important;
}

body.sidebar-apps .sidebar-app-launcher,
body.sidebar-collapsed.sidebar-apps .sidebar-app-launcher,
body.sidebar-launcher-mode.sidebar-apps .sidebar-app-launcher {
  top: .85rem !important;
  left: .85rem !important;
  z-index: 12000 !important;
}

:root[data-theme="dark"] [data-tooltip]::after,
:root[data-theme="dark"] [data-tooltip]::before,
:root[data-theme="dark"] .tooltip,
:root[data-theme="dark"] .tooltip-inner {
  background: #0f172a !important;
  border-color: rgba(147, 197, 253, .45) !important;
  color: #f8fafc !important;
  text-shadow: none !important;
}

body.sidebar-apps .sidebar-app-launcher,
body.sidebar-collapsed.sidebar-apps .sidebar-app-launcher {
  top: calc(var(--topbar-height, 64px) + .95rem) !important;
  left: 1rem !important;
  width: min(48rem, calc(100vw - 2rem)) !important;
  padding: 1rem !important;
  gap: .95rem !important;
}

.sidebar-app-launcher-header {
  display: grid;
  grid-template-columns: minmax(16rem, 1fr) max-content;
  gap: .75rem;
  align-items: center;
}

.sidebar-app-controls {
  display: flex;
  gap: .45rem;
}

.sidebar-app-controls .icon-button {
  background: color-mix(in srgb, var(--ds-surface-muted) 84%, transparent);
  border-color: color-mix(in srgb, var(--ds-primary) 26%, var(--ds-border));
  color: var(--ds-heading);
}

.sidebar-app-controls .icon-button:hover,
.sidebar-app-controls .icon-button:focus-visible {
  background: var(--ds-primary);
  color: #07111e;
}

.sidebar-app-grid {
  gap: .95rem !important;
  padding: .2rem .2rem .35rem !important;
}

.sidebar-app-grid a {
  min-height: 6.45rem !important;
  padding: .95rem .7rem !important;
  outline: 2px solid transparent;
  outline-offset: 3px;
}

.sidebar-app-grid a.active {
  outline-color: color-mix(in srgb, var(--ds-primary) 70%, transparent);
  box-shadow:
    0 0 0 5px color-mix(in srgb, var(--ds-primary) 9%, transparent),
    0 18px 42px color-mix(in srgb, var(--ds-primary) 18%, transparent);
}

.wfm-local-nav {
  background: var(--ds-surface) !important;
  color: var(--ds-text);
  opacity: 1 !important;
  isolation: isolate;
}

@media (max-width: 900px) {
  .wfm-local-nav {
    background:
      radial-gradient(circle at 0 0, color-mix(in srgb, var(--ds-primary) 9%, transparent), transparent 32%),
      var(--ds-bg) !important;
    border-right: 1px solid var(--ds-border);
  }

  .wfm-local-nav-heading {
    background: var(--ds-bg) !important;
  }

  body.wfm-local-nav-open .wfm-local-nav {
    box-shadow: 22px 0 58px rgba(0, 0, 0, .5);
  }
}

.wfm-route-content table,
.wfm-route-content .dragon-table,
.wfm-route-content .enterprise-table,
.wfm-route-content .ds-smart-table,
.wfm-route-content .compact-table {
  font-size: .86rem;
}

.wfm-route-content table th,
.wfm-route-content .dragon-table th,
.wfm-route-content .enterprise-table th,
.wfm-route-content .ds-smart-table th {
  font-size: .72rem !important;
  line-height: 1.2;
}

.wfm-route-content table td,
.wfm-route-content .dragon-table td,
.wfm-route-content .enterprise-table td,
.wfm-route-content .ds-smart-table td {
  font-size: .84rem !important;
  line-height: 1.35;
}

.wfm-route-content .status-pill,
.wfm-route-content .btn-sm,
.wfm-route-content .ds-table-pager button,
.wfm-route-content .ds-table-export button {
  font-size: .78rem !important;
}

@media (max-width: 760px) {
  body.sidebar-apps .sidebar-app-launcher,
  body.sidebar-collapsed.sidebar-apps .sidebar-app-launcher {
    top: .75rem !important;
    left: .75rem !important;
    right: .75rem !important;
    width: auto !important;
  }

  .sidebar-app-launcher-header {
    grid-template-columns: 1fr;
  }

  .sidebar-app-controls {
    justify-content: flex-end;
  }
}

/* Persistent navigation modes and WFM secondary navigation. */
.sidebar-header > .sidebar-controls [data-sidebar-pin],
.sidebar-header > .sidebar-controls [data-sidebar-toggle] {
  display: none !important;
}

body.sidebar-launcher-mode:not(.sidebar-apps) .portal-frame {
  grid-template-columns: 5.75rem minmax(0, 1fr) !important;
}

body.sidebar-launcher-mode:not(.sidebar-apps) .portal-sidebar {
  width: 5.75rem !important;
  min-width: 5.75rem !important;
  padding: .85rem .65rem !important;
  overflow: visible !important;
}

body.sidebar-launcher-mode:not(.sidebar-apps) .sidebar-brand {
  justify-content: center;
}

body.sidebar-launcher-mode:not(.sidebar-apps) .sidebar-brand .sidebar-label,
body.sidebar-launcher-mode:not(.sidebar-apps) .sidebar-nav,
body.sidebar-launcher-mode:not(.sidebar-apps) .sidebar-footer {
  display: none !important;
}

body.sidebar-launcher-mode:not(.sidebar-apps) .sidebar-header {
  display: grid;
  gap: .8rem;
  justify-items: center;
}

body.sidebar-launcher-mode:not(.sidebar-apps) .sidebar-controls {
  display: grid;
  justify-items: center;
}

body.sidebar-launcher-mode:not(.sidebar-apps) .sidebar-header > .sidebar-controls [data-sidebar-apps] {
  display: inline-grid !important;
}

body.sidebar-launcher-mode:not(.sidebar-apps) .sidebar-app-launcher {
  display: none !important;
}

body.sidebar-apps .sidebar-app-launcher,
body.sidebar-collapsed.sidebar-apps .sidebar-app-launcher {
  top: calc(var(--topbar-height, 64px) + 1.15rem) !important;
  left: 1rem !important;
  width: min(48rem, calc(100vw - 2rem)) !important;
  max-height: calc(100dvh - var(--topbar-height, 64px) - 2rem) !important;
  overflow: visible !important;
  padding: 1rem !important;
  filter: none !important;
  opacity: 1 !important;
}

.sidebar-app-grid {
  padding: .45rem .35rem .45rem !important;
  overflow: visible !important;
}

.sidebar-app-grid a {
  position: relative;
}

.sidebar-app-grid a.active {
  border-color: color-mix(in srgb, var(--ds-primary) 72%, var(--ds-border)) !important;
  outline-offset: 4px;
}

.sidebar-app-grid a:hover,
.sidebar-app-grid a:focus-visible {
  transform: translateY(-3px) scale(1.025);
}

.wfm-local-nav-collapse {
  display: inline-grid;
  width: 2.15rem;
  height: 2.15rem;
}

body.wfm-local-nav-collapsed .wfm-shell {
  grid-template-columns: 5.25rem minmax(0, 1fr);
}

body.wfm-local-nav-collapsed .wfm-local-nav {
  padding: .65rem .45rem;
  overflow-x: hidden;
}

body.wfm-local-nav-collapsed .wfm-local-nav-heading {
  display: grid;
  justify-items: center;
  gap: .45rem;
}

body.wfm-local-nav-collapsed .wfm-local-nav-heading strong,
body.wfm-local-nav-collapsed .wfm-nav-group-title span:not(.wfm-nav-group-icon),
body.wfm-local-nav-collapsed .wfm-nav-link-description {
  display: none !important;
}

body.wfm-local-nav-collapsed .wfm-nav-groups {
  gap: .55rem;
}

body.wfm-local-nav-collapsed .wfm-nav-group-links {
  margin-left: 0;
  padding-left: 0;
  border-left: 0;
}

body.wfm-local-nav-collapsed .wfm-nav-link {
  min-height: 2.65rem;
  padding: .45rem .35rem;
  align-items: center;
  justify-content: center;
}

body.wfm-local-nav-collapsed .wfm-nav-link-title {
  max-width: 3.4rem;
  overflow: hidden;
  text-align: center;
  text-overflow: ellipsis;
  white-space: nowrap;
  font-size: .72rem;
}

.wfm-local-nav {
  background-color: var(--ds-surface) !important;
  background-image: none !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
  opacity: 1 !important;
}

@media (max-width: 900px) {
  body.wfm-local-nav-collapsed .wfm-shell {
    grid-template-columns: 1fr !important;
  }

  body.wfm-local-nav-collapsed .wfm-local-nav {
    width: min(21rem, 88vw);
  }

  body.wfm-local-nav-collapsed .wfm-local-nav-heading strong,
  body.wfm-local-nav-collapsed .wfm-nav-group-title span:not(.wfm-nav-group-icon),
  body.wfm-local-nav-collapsed .wfm-nav-link-description {
    display: inline !important;
  }

  body.wfm-local-nav-collapsed .wfm-nav-link-title {
    max-width: none;
    text-align: left;
    white-space: normal;
  }
}

/* Hotfix: launcher mode must always be recoverable from its rail button. */
body.sidebar-apps .portal-frame,
body.sidebar-collapsed.sidebar-apps .portal-frame,
body.sidebar-launcher-mode.sidebar-apps .portal-frame {
  grid-template-columns: 0 minmax(0, 1fr) !important;
}

body.sidebar-apps .portal-sidebar,
body.sidebar-launcher-mode.sidebar-apps .portal-sidebar {
  display: block !important;
  width: 0 !important;
  min-width: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  overflow: visible !important;
  background: transparent !important;
  z-index: 3040 !important;
}

body.sidebar-apps .sidebar-app-launcher,
body.sidebar-collapsed.sidebar-apps .sidebar-app-launcher,
body.sidebar-launcher-mode.sidebar-apps .sidebar-app-launcher {
  display: grid !important;
  position: fixed !important;
  top: calc(var(--topbar-height, 64px) + 1rem) !important;
  left: 1rem !important;
  z-index: 3050 !important;
  width: min(48rem, calc(100vw - 2rem)) !important;
  max-height: calc(100dvh - var(--topbar-height, 64px) - 1.5rem) !important;
  overflow: visible !important;
  opacity: 1 !important;
  filter: none !important;
  transform: none !important;
}

body.sidebar-apps .sidebar-header,
body.sidebar-apps .sidebar-nav,
body.sidebar-apps .sidebar-footer {
  display: none !important;
}

/* Absolute final overrides: this block intentionally follows every launcher legacy rule. */
body.sidebar-launcher-mode:not(.sidebar-apps) .portal-frame {
  grid-template-columns: 5.15rem minmax(0, 1fr) !important;
}

body.sidebar-launcher-mode:not(.sidebar-apps) .portal-sidebar {
  width: 5.15rem !important;
  min-width: 5.15rem !important;
  padding: .75rem .45rem !important;
}

body.sidebar-launcher-mode:not(.sidebar-apps) .sidebar-header {
  display: flex !important;
  flex-direction: row !important;
  align-items: center !important;
  justify-content: center !important;
  gap: .38rem !important;
}

body.sidebar-launcher-mode:not(.sidebar-apps) .sidebar-brand,
body.sidebar-launcher-mode:not(.sidebar-apps) .sidebar-controls,
body.sidebar-launcher-mode:not(.sidebar-apps) .sidebar-header > .sidebar-controls [data-sidebar-apps] {
  display: inline-grid !important;
  flex: 0 0 auto;
}

body.sidebar-launcher-mode:not(.sidebar-apps) .sidebar-brand,
body.sidebar-launcher-mode:not(.sidebar-apps) .sidebar-logo,
body.sidebar-launcher-mode:not(.sidebar-apps) .sidebar-header > .sidebar-controls [data-sidebar-apps] {
  width: 2.05rem !important;
  height: 2.05rem !important;
}

body.sidebar-apps .sidebar-app-launcher,
body.sidebar-collapsed.sidebar-apps .sidebar-app-launcher,
body.sidebar-launcher-mode.sidebar-apps .sidebar-app-launcher {
  top: .85rem !important;
  left: .85rem !important;
  z-index: 12000 !important;
}

/* WFM planning calendar */
.wfm-planning-shell,
.wfm-planning-calendar-card,
.wfm-resource-timeline { overflow: visible; }
.wfm-planning-header,
.wfm-planning-actions,
.wfm-planning-filters,
.wfm-planning-metrics,
.wfm-planning-layout { display: grid; gap: 1rem; }
.wfm-planning-header { grid-template-columns: minmax(0, 1fr) auto; align-items: start; }
.wfm-planning-actions { grid-auto-flow: column; align-items: center; justify-content: end; }
.segmented-control { display: inline-grid; grid-auto-flow: column; border: 1px solid var(--ds-border-color); border-radius: 10px; overflow: hidden; background: var(--ds-surface-strong); }
.segmented-control button, .segmented-control a { border: 0; min-height: var(--ds-control-height); padding: 0 .9rem; color: var(--ds-text-color); background: transparent; font-weight: 700; display: inline-flex; align-items: center; justify-content: center; text-decoration: none; }
.segmented-control button.active, .segmented-control a.active { color: #07111f; background: var(--ds-primary); }
.wfm-planning-filters { grid-template-columns: 13rem minmax(16rem, 1fr) 14rem auto; align-items: end; padding-top: .75rem; border-top: 1px solid var(--ds-border-color); }
.wfm-planning-filters .form-field.compact { gap: .35rem; margin: 0; }
.wfm-planning-metrics { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.wfm-planning-metrics article { min-height: 6rem; padding: 1rem; border: 1px solid var(--ds-border-color); border-radius: 10px; background: var(--ds-surface-strong); }
.wfm-planning-metrics span,
.wfm-planning-metrics small { display: block; color: var(--ds-muted-color); }
.wfm-planning-metrics strong { display: block; font-size: 2rem; line-height: 1.1; }
.wfm-planning-layout { grid-template-columns: minmax(0, 1fr) minmax(20rem, 26rem); align-items: start; }
.wfm-planning-calendar-card { isolation: isolate; overflow: visible !important; }
.wfm-calendar-grid { display: grid; grid-template-columns: 4.5rem repeat(7, minmax(8.5rem, 1fr)); overflow: visible; border: 1px solid var(--ds-border-color); border-radius: 10px; background: var(--ds-surface); }
.wfm-calendar-week-head,
.wfm-calendar-day-head,
.wfm-calendar-week-number,
.wfm-calendar-day { border-right: 1px solid var(--ds-border-color); border-bottom: 1px solid var(--ds-border-color); }
.wfm-calendar-week-head,
.wfm-calendar-day-head { min-height: 2.5rem; padding: .7rem .8rem; font-size: .78rem; font-weight: 800; color: var(--ds-muted-color); text-transform: uppercase; letter-spacing: .04em; background: var(--ds-surface-strong); }
.wfm-calendar-week-number { min-height: 9.5rem; padding: .8rem .6rem; color: var(--ds-muted-color); font-weight: 800; background: var(--ds-surface-strong); overflow: hidden; }
.wfm-calendar-week-number span { display: inline-flex; align-items: center; justify-content: center; min-width: 2.6rem; height: 1.8rem; border-radius: 999px; background: color-mix(in srgb, var(--ds-surface) 72%, var(--ds-primary) 28%); color: var(--ds-text-color); font-size: .78rem; white-space: nowrap; }
.wfm-calendar-day { position: relative; display: flex; flex-direction: column; gap: .35rem; min-height: 9.5rem; padding: .55rem; color: var(--ds-text-color); text-decoration: none; background: color-mix(in srgb, var(--ds-surface) 92%, var(--ds-primary) 8%); }
.wfm-calendar-day:hover { background: color-mix(in srgb, var(--ds-surface) 82%, var(--ds-primary) 18%); box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--ds-primary) 40%, transparent); }
.wfm-calendar-day.is-menu-open { z-index: 900; }
.wfm-calendar-day.muted { background: color-mix(in srgb, var(--ds-surface) 96%, var(--ds-primary) 4%); }
.wfm-calendar-day.today { outline: 2px solid var(--ds-primary); outline-offset: -2px; }
.wfm-calendar-date-menu,
.wfm-calendar-event-menu { position: relative; min-width: 0; }
.wfm-calendar-date-menu[open],
.wfm-calendar-event-menu[open] { z-index: 950; }
.wfm-calendar-date-menu summary,
.wfm-calendar-event-menu summary { list-style: none; cursor: pointer; }
.wfm-calendar-date-menu summary::-webkit-details-marker,
.wfm-calendar-event-menu summary::-webkit-details-marker { display: none; }
.wfm-calendar-date { align-self: flex-start; min-width: 2rem; height: 2rem; display: inline-grid; place-items: center; border-radius: 999px; font-weight: 800; background: var(--ds-surface-strong); transition: transform .16s ease, background-color .16s ease; }
.wfm-calendar-day.muted .wfm-calendar-date,
.wfm-calendar-day.muted .wfm-calendar-event { opacity: .62; }
.wfm-calendar-day.muted .wfm-calendar-date-menu[open] .wfm-calendar-date,
.wfm-calendar-day.muted .wfm-calendar-event-menu[open] .wfm-calendar-event { opacity: 1; }
.wfm-calendar-date:hover,
.wfm-calendar-date-menu[open] .wfm-calendar-date { transform: translateY(-1px); background: var(--ds-primary); color: #fff; }
.wfm-calendar-event,
.wfm-resource-chip { display: block; min-width: 0; border-radius: 7px; padding: .35rem .45rem; border: 1px solid transparent; color: var(--ds-text-color); text-decoration: none; font-size: .78rem; line-height: 1.25; overflow: hidden; }
.wfm-calendar-event { position: relative; }
.wfm-calendar-event:hover,
.wfm-calendar-event-menu[open] .wfm-calendar-event { transform: translateY(-1px); border-color: var(--ds-primary); box-shadow: 0 0 0 2px color-mix(in srgb, var(--ds-primary) 24%, transparent), 0 10px 24px color-mix(in srgb, #000 22%, transparent); }
.wfm-calendar-event strong,
.wfm-calendar-event small { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.wfm-calendar-event.assignment,
.wfm-resource-chip.assignment { background: color-mix(in srgb, #60a5fa 22%, transparent); border-color: color-mix(in srgb, #60a5fa 60%, transparent); }
.wfm-calendar-event.booking,
.wfm-resource-chip.booking { background: color-mix(in srgb, #34d399 22%, transparent); border-color: color-mix(in srgb, #34d399 60%, transparent); }
.wfm-calendar-event.shift,
.wfm-resource-chip.shift { background: color-mix(in srgb, #fbbf24 22%, transparent); border-color: color-mix(in srgb, #fbbf24 60%, transparent); }
.wfm-calendar-event-menu[open] .wfm-calendar-event,
.wfm-calendar-event-menu[open] .wfm-calendar-menu-context {
  background: color-mix(in srgb, var(--ds-calendar-active-context-subtle) 72%, var(--ds-surface));
  border-color: var(--ds-calendar-active-context-border);
  box-shadow: 0 0 0 2px color-mix(in srgb, var(--ds-calendar-active-context) 36%, transparent), 0 12px 30px color-mix(in srgb, #000 28%, transparent);
  color: var(--ds-text-color);
}
.wfm-calendar-event-menu[open] .wfm-calendar-menu-context {
  border-width: 1px;
}
.wfm-calendar-event-menu[open] .wfm-calendar-event::after {
  content: "Menu open";
  display: inline-flex;
  align-items: center;
  width: fit-content;
  max-width: 100%;
  margin-top: .25rem;
  padding: .12rem .35rem;
  border-radius: 999px;
  background: var(--ds-calendar-active-context);
  color: var(--ds-calendar-active-context-text);
  font-size: .62rem;
  font-weight: 900;
  letter-spacing: .04em;
  text-transform: uppercase;
}
.wfm-calendar-event-menu[open] .wfm-calendar-menu-context::before {
  content: "Active context";
  color: var(--ds-calendar-active-context);
  font-size: .64rem;
  font-weight: 900;
  letter-spacing: .08em;
  text-transform: uppercase;
}
.wfm-calendar-menu { position: absolute; z-index: 1000; top: calc(100% + .35rem); left: 0; display: grid; gap: .2rem; width: max-content; min-width: 13rem; max-width: min(20rem, calc(100vw - 2rem)); padding: .35rem; border: 1px solid var(--ds-border-color); border-radius: 8px; background: #ffffff; background: color-mix(in srgb, var(--ds-surface) 94%, var(--ds-soft) 6%); box-shadow: 0 18px 48px color-mix(in srgb, #000 42%, transparent); opacity: 1; pointer-events: auto; backdrop-filter: none; -webkit-backdrop-filter: none; }
.wfm-calendar-menu.is-floating { position: fixed; top: var(--wfm-calendar-menu-top); left: var(--wfm-calendar-menu-left); right: auto !important; z-index: 3200; max-height: min(24rem, calc(100vh - 1rem)); overflow: auto; }
:root[data-theme="dark"] .wfm-calendar-menu { background: #121c2d; border-color: #3a4a63; box-shadow: 0 20px 54px rgba(0, 0, 0, .56); }
.wfm-calendar-menu-context { display: grid; gap: .1rem; min-width: 0; margin: -.05rem -.05rem .25rem; padding: .55rem .65rem; border-radius: 6px; background: color-mix(in srgb, var(--ds-primary) 16%, var(--ds-surface)); border: 1px solid color-mix(in srgb, var(--ds-primary) 32%, transparent); }
.wfm-calendar-menu-context span { color: var(--ds-muted-color); font-size: .66rem; font-weight: 900; letter-spacing: .08em; text-transform: uppercase; }
.wfm-calendar-menu-context strong,
.wfm-calendar-menu-context small { display: block; max-width: 16rem; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.wfm-calendar-menu-context strong { color: var(--ds-text-color); font-size: .85rem; }
.wfm-calendar-menu-context small { color: var(--ds-muted-color); font-size: .75rem; }
.wfm-calendar-menu a { display: block; padding: .55rem .65rem; border-radius: 6px; color: var(--ds-text-color); text-decoration: none; font-size: .84rem; font-weight: 700; white-space: nowrap; }
.wfm-calendar-menu a:hover,
.wfm-calendar-menu a:focus-visible { background: color-mix(in srgb, var(--ds-primary) 18%, transparent); color: var(--ds-text-color); outline: none; }
.wfm-calendar-day:nth-child(8n) .wfm-calendar-menu,
.wfm-calendar-day:nth-child(8n + 7) .wfm-calendar-menu { left: auto; right: 0; }
.wfm-calendar-more { color: var(--ds-muted-color); font-size: .78rem; font-weight: 800; text-decoration: none; }
.wfm-calendar-more:hover { color: var(--ds-primary); text-decoration: underline; }
.wfm-planning-side { display: grid; gap: 1rem; }
.wfm-agenda-item,
.wfm-risk-item { display: grid; gap: .15rem; padding: .8rem 0; color: var(--ds-text-color); text-decoration: none; border-bottom: 1px solid var(--ds-border-color); }
.wfm-agenda-item small,
.wfm-agenda-item time,
.wfm-risk-item small,
.wfm-risk-item span { color: var(--ds-muted-color); }
.status-dot { width: .7rem; height: .7rem; border-radius: 999px; background: var(--ds-primary); }
.status-dot.booking { background: #34d399; }
.status-dot.shift { background: #fbbf24; }
.status-dot.assignment { background: #60a5fa; }
.wfm-resource-grid { display: grid; grid-template-columns: minmax(14rem, 18rem) repeat(14, minmax(7rem, 1fr)); overflow-x: auto; border: 1px solid var(--ds-border-color); border-radius: 10px; }
.wfm-resource-head,
.wfm-resource-name,
.wfm-resource-cell { min-height: 3.5rem; padding: .65rem; border-right: 1px solid var(--ds-border-color); border-bottom: 1px solid var(--ds-border-color); }
.wfm-resource-head { position: sticky; top: 0; z-index: 2; background: var(--ds-surface-strong); color: var(--ds-muted-color); font-size: .78rem; font-weight: 800; text-transform: uppercase; }
.wfm-resource-name { position: sticky; left: 0; z-index: 1; background: var(--ds-surface-strong); }
.wfm-resource-name small { display: block; color: var(--ds-muted-color); }
.wfm-resource-cell { background: var(--ds-surface); }
@media (max-width: 1100px) { .wfm-planning-header, .wfm-planning-layout, .wfm-planning-filters, .wfm-planning-metrics { grid-template-columns: 1fr; } .wfm-planning-actions { grid-auto-flow: row; justify-content: stretch; } }
@media (max-width: 760px) {
  .wfm-planning-calendar-card { padding: .85rem; overflow: visible !important; }
  .wfm-planning-calendar-card .panel-heading.compact { align-items: start; gap: .75rem; }
  .wfm-calendar-grid {
    grid-template-columns: minmax(0, 1fr);
    gap: .65rem;
    overflow: visible;
    border: 0;
    border-radius: 0;
    background: transparent;
  }
  .wfm-calendar-week-head,
  .wfm-calendar-day-head { display: none; }
  .wfm-calendar-week-number {
    min-height: auto;
    padding: .15rem 0 0;
    border: 0;
    background: transparent;
    overflow: visible;
  }
  .wfm-calendar-week-number span {
    min-width: 3.2rem;
    height: 1.85rem;
    font-size: .76rem;
    box-shadow: 0 8px 22px color-mix(in srgb, #000 18%, transparent);
  }
  .wfm-calendar-day {
    min-height: auto;
    padding: .75rem;
    gap: .45rem;
    border: 1px solid var(--ds-border-color);
    border-radius: 10px;
    background: color-mix(in srgb, var(--ds-surface) 88%, var(--ds-primary) 12%);
  }
  .wfm-calendar-day::before {
    content: attr(data-day-label);
    display: block;
    padding-right: 2.5rem;
    color: var(--ds-muted-color);
    font-size: .72rem;
    font-weight: 900;
    letter-spacing: .06em;
    line-height: 1.2;
    text-transform: uppercase;
  }
  .wfm-calendar-day::after {
    content: attr(data-event-count) " events";
    position: absolute;
    top: .85rem;
    right: 3rem;
    color: var(--ds-muted-color);
    font-size: .7rem;
    font-weight: 800;
  }
  .wfm-calendar-date-menu { min-height: 2rem; margin-bottom: .2rem; }
  .wfm-calendar-date {
    position: absolute;
    top: .55rem;
    right: .55rem;
    min-width: 2rem;
    height: 2rem;
  }
  .wfm-calendar-event,
  .wfm-resource-chip {
    padding: .48rem .55rem;
    font-size: .82rem;
    line-height: 1.28;
  }
  .wfm-calendar-event strong,
  .wfm-calendar-event small { white-space: normal; }
  .wfm-calendar-more {
    display: inline-flex;
    align-self: flex-start;
    padding: .3rem .5rem;
    border-radius: 999px;
    background: color-mix(in srgb, var(--ds-primary) 14%, transparent);
    color: var(--ds-text-color);
  }
  .wfm-calendar-menu.is-floating {
    width: min(19rem, calc(100vw - 1rem));
    max-width: calc(100vw - 1rem);
  }
}

/* Launcher-only sidebar mode: keep only the brand and app button, never a reserved rail. */
body.sidebar-launcher-mode .portal-frame {
  display: grid !important;
  grid-template-columns: 0 minmax(0, 1fr) !important;
  width: 100vw !important;
  min-width: 100vw !important;
  max-width: 100vw !important;
  overflow-x: clip !important;
}

body.sidebar-launcher-mode .portal-main {
  grid-column: 1 / -1 !important;
  width: 100vw !important;
  min-width: 0 !important;
  max-width: 100vw !important;
}

body.sidebar-launcher-mode .portal-content {
  width: 100% !important;
  max-width: 100vw !important;
  box-sizing: border-box !important;
}

body.sidebar-launcher-mode .portal-sidebar {
  position: fixed !important;
  inset: 0 auto auto 0 !important;
  width: 0 !important;
  min-width: 0 !important;
  height: 0 !important;
  min-height: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  overflow: visible !important;
  background: transparent !important;
  z-index: 3300 !important;
}

body.sidebar-launcher-mode .sidebar-header {
  position: fixed !important;
  top: .7rem !important;
  left: .7rem !important;
  z-index: 3320 !important;
  display: flex !important;
  flex-direction: row !important;
  align-items: center !important;
  justify-content: flex-start !important;
  gap: .35rem !important;
  width: auto !important;
  height: auto !important;
  margin: 0 !important;
  padding: 0 !important;
  background: transparent !important;
}

body.sidebar-launcher-mode .sidebar-brand {
  display: inline-grid !important;
  place-items: center !important;
  width: 2.25rem !important;
  height: 2.25rem !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 1px solid color-mix(in srgb, var(--ds-sidebar-ink) 18%, transparent) !important;
  border-radius: 8px !important;
  background: color-mix(in srgb, var(--ds-sidebar-bg) 92%, var(--ds-surface)) !important;
  box-shadow: 0 10px 24px rgba(0, 0, 0, .18) !important;
}

body.sidebar-launcher-mode .sidebar-brand .sidebar-label,
body.sidebar-launcher-mode .sidebar-nav,
body.sidebar-launcher-mode .sidebar-footer,
body.sidebar-launcher-mode .sidebar-controls [data-sidebar-pin],
body.sidebar-launcher-mode .sidebar-controls [data-sidebar-toggle] {
  display: none !important;
}

body.sidebar-launcher-mode .sidebar-logo,
body.sidebar-launcher-mode .sidebar-controls [data-sidebar-apps] {
  width: 2.25rem !important;
  height: 2.25rem !important;
}

body.sidebar-launcher-mode .sidebar-controls {
  display: flex !important;
  align-items: center !important;
  gap: .35rem !important;
  margin: 0 !important;
  padding: 0 !important;
}

body.sidebar-launcher-mode .sidebar-controls [data-sidebar-apps] {
  display: inline-grid !important;
  place-items: center !important;
  background: color-mix(in srgb, var(--ds-sidebar-bg) 92%, var(--ds-surface)) !important;
  color: var(--ds-sidebar-ink) !important;
  box-shadow: 0 10px 24px rgba(0, 0, 0, .18) !important;
}

body.sidebar-launcher-mode .portal-topbar {
  width: 100vw !important;
  max-width: 100vw !important;
  box-sizing: border-box !important;
  flex-wrap: nowrap !important;
  padding-left: 5.75rem !important;
}

body.sidebar-launcher-mode .portal-topbar .global-search {
  flex: 1 1 28rem !important;
  min-width: 12rem !important;
  max-width: 34rem !important;
}

body.sidebar-launcher-mode .portal-topbar .global-search input {
  width: 100% !important;
}

body.sidebar-launcher-mode .portal-topbar .topbar-actions {
  flex: 0 1 auto !important;
  justify-content: flex-end !important;
}

body.sidebar-launcher-mode.sidebar-apps .sidebar-scrim {
  z-index: 3290 !important;
  background: color-mix(in srgb, #000 24%, transparent) !important;
  backdrop-filter: none !important;
}

body.sidebar-launcher-mode.sidebar-apps .sidebar-app-launcher {
  top: calc(var(--topbar-height, 64px) + .75rem) !important;
  left: .75rem !important;
  z-index: 3310 !important;
  width: min(47rem, calc(100vw - 1.5rem)) !important;
  max-height: calc(100dvh - var(--topbar-height, 64px) - 1.5rem) !important;
  overflow: visible !important;
  opacity: 1 !important;
  filter: none !important;
}

@media (max-width: 760px) {
  body.sidebar-launcher-mode .portal-topbar {
    flex-wrap: wrap !important;
    padding-left: 5.45rem !important;
  }

  body.sidebar-launcher-mode.sidebar-apps .sidebar-app-launcher {
    left: .5rem !important;
    width: calc(100vw - 1rem) !important;
  }
}

/* Final launcher-mode recovery: overlay controls must never reserve a layout column or block the page. */
body.sidebar-launcher-mode .portal-frame {
  display: block !important;
  width: 100% !important;
  min-width: 0 !important;
  max-width: 100vw !important;
  overflow-x: clip !important;
}

:root[data-sidebar-mode="launcher"] body .portal-frame {
  display: block !important;
  width: 100% !important;
  min-width: 0 !important;
  max-width: 100vw !important;
  overflow-x: clip !important;
}

body.sidebar-launcher-mode .portal-main {
  display: block !important;
  width: 100% !important;
  min-width: 0 !important;
  max-width: 100vw !important;
  margin: 0 !important;
}

:root[data-sidebar-mode="launcher"] body .portal-main {
  display: block !important;
  width: 100% !important;
  min-width: 0 !important;
  max-width: 100vw !important;
  margin: 0 !important;
}

body.sidebar-launcher-mode .portal-content {
  width: 100% !important;
  max-width: 100vw !important;
  margin: 0 !important;
}

:root[data-sidebar-mode="launcher"] body .portal-content {
  width: 100% !important;
  max-width: 100vw !important;
  margin: 0 !important;
}

body.sidebar-launcher-mode .portal-sidebar {
  position: fixed !important;
  inset: 0 auto auto 0 !important;
  width: 0 !important;
  min-width: 0 !important;
  max-width: 0 !important;
  height: 0 !important;
  min-height: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  overflow: visible !important;
  background: transparent !important;
  z-index: 3300 !important;
  pointer-events: none !important;
}

:root[data-sidebar-mode="launcher"] body .portal-sidebar {
  position: fixed !important;
  inset: 0 auto auto 0 !important;
  width: 0 !important;
  min-width: 0 !important;
  max-width: 0 !important;
  height: 0 !important;
  min-height: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  overflow: visible !important;
  background: transparent !important;
  z-index: 3300 !important;
  pointer-events: none !important;
}

body.sidebar-launcher-mode .sidebar-header,
body.sidebar-launcher-mode .sidebar-brand,
body.sidebar-launcher-mode .sidebar-controls,
body.sidebar-launcher-mode .sidebar-controls button,
body.sidebar-launcher-mode .sidebar-controls a {
  pointer-events: auto !important;
}

:root[data-sidebar-mode="launcher"] body .sidebar-header,
:root[data-sidebar-mode="launcher"] body .sidebar-brand,
:root[data-sidebar-mode="launcher"] body .sidebar-controls,
:root[data-sidebar-mode="launcher"] body .sidebar-controls button,
:root[data-sidebar-mode="launcher"] body .sidebar-controls a {
  pointer-events: auto !important;
}

body.sidebar-launcher-mode:not(.sidebar-apps) .sidebar-scrim {
  display: none !important;
  pointer-events: none !important;
}

:root[data-sidebar-mode="launcher"] body:not(.sidebar-apps) .sidebar-scrim {
  display: none !important;
  pointer-events: none !important;
}

body.sidebar-launcher-mode.sidebar-apps .sidebar-scrim {
  display: block !important;
  pointer-events: auto !important;
  z-index: 3290 !important;
  background: color-mix(in srgb, #000 24%, transparent) !important;
  backdrop-filter: none !important;
}

:root[data-sidebar-mode="launcher"] body.sidebar-apps .sidebar-scrim {
  display: block !important;
  pointer-events: auto !important;
  z-index: 3290 !important;
  background: color-mix(in srgb, #000 24%, transparent) !important;
  backdrop-filter: none !important;
}

body.sidebar-launcher-mode.sidebar-apps .sidebar-app-launcher {
  display: grid !important;
  position: fixed !important;
  top: calc(var(--topbar-height, 64px) + .75rem) !important;
  left: .75rem !important;
  z-index: 3310 !important;
  width: min(47rem, calc(100vw - 1.5rem)) !important;
  max-height: calc(100dvh - var(--topbar-height, 64px) - 1.5rem) !important;
  overflow: visible !important;
  opacity: 1 !important;
  filter: none !important;
  pointer-events: auto !important;
}

:root[data-sidebar-mode="launcher"] body.sidebar-apps .sidebar-app-launcher {
  display: grid !important;
  position: fixed !important;
  top: calc(var(--topbar-height, 64px) + .75rem) !important;
  left: .75rem !important;
  z-index: 3310 !important;
  width: min(47rem, calc(100vw - 1.5rem)) !important;
  max-height: calc(100dvh - var(--topbar-height, 64px) - 1.5rem) !important;
  overflow: visible !important;
  opacity: 1 !important;
  filter: none !important;
  pointer-events: auto !important;
}

body.sidebar-launcher-mode.sidebar-apps .sidebar-app-launcher *,
body.sidebar-launcher-mode.sidebar-apps .sidebar-app-launcher a,
body.sidebar-launcher-mode.sidebar-apps .sidebar-app-launcher button,
body.sidebar-launcher-mode.sidebar-apps .sidebar-app-launcher input {
  pointer-events: auto !important;
}

:root[data-sidebar-mode="launcher"] body.sidebar-apps .sidebar-app-launcher *,
:root[data-sidebar-mode="launcher"] body.sidebar-apps .sidebar-app-launcher a,
:root[data-sidebar-mode="launcher"] body.sidebar-apps .sidebar-app-launcher button,
:root[data-sidebar-mode="launcher"] body.sidebar-apps .sidebar-app-launcher input {
  pointer-events: auto !important;
}

body.sidebar-launcher-mode .portal-topbar {
  width: 100% !important;
  max-width: 100vw !important;
  padding-left: 5.75rem !important;
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  flex-wrap: nowrap !important;
}

:root[data-sidebar-mode="launcher"] body .portal-topbar {
  width: 100% !important;
  max-width: 100vw !important;
  padding-left: 5.75rem !important;
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  flex-wrap: nowrap !important;
}

body.sidebar-launcher-mode .portal-topbar .topbar-actions {
  display: flex !important;
  flex-direction: row !important;
  align-items: center !important;
  justify-content: flex-end !important;
  flex-wrap: wrap !important;
  gap: .45rem !important;
}

:root[data-sidebar-mode="launcher"] body .portal-topbar .topbar-actions {
  display: flex !important;
  flex-direction: row !important;
  align-items: center !important;
  justify-content: flex-end !important;
  flex-wrap: wrap !important;
  gap: .45rem !important;
}

body.sidebar-launcher-mode .portal-topbar .global-search {
  flex: 1 1 28rem !important;
  min-width: min(22rem, 46vw) !important;
  max-width: 34rem !important;
}

:root[data-sidebar-mode="launcher"] body .portal-topbar .global-search {
  flex: 1 1 28rem !important;
  min-width: min(22rem, 46vw) !important;
  max-width: 34rem !important;
}

body.sidebar-launcher-mode .portal-topbar .global-search input {
  width: 100% !important;
}

:root[data-sidebar-mode="launcher"] body .portal-topbar .global-search input {
  width: 100% !important;
}

@media (max-width: 760px) {
  body.sidebar-launcher-mode .portal-topbar {
    padding-left: 5.45rem !important;
    flex-wrap: wrap !important;
  }

  :root[data-sidebar-mode="launcher"] body .portal-topbar {
    padding-left: 5.45rem !important;
    flex-wrap: wrap !important;
  }

  body.sidebar-launcher-mode .portal-topbar .global-search {
    min-width: 0 !important;
    flex-basis: 100% !important;
  }

  :root[data-sidebar-mode="launcher"] body .portal-topbar .global-search {
    min-width: 0 !important;
    flex-basis: 100% !important;
  }

  body.sidebar-launcher-mode.sidebar-apps .sidebar-app-launcher {
    left: .5rem !important;
    width: calc(100vw - 1rem) !important;
  }

  :root[data-sidebar-mode="launcher"] body.sidebar-apps .sidebar-app-launcher {
    left: .5rem !important;
    width: calc(100vw - 1rem) !important;
  }
}