/* Вкладка «Доступы»: группы + правила по категориям.
   Светлая тема — нейтральные поверхности; Nocturne — токены --noct-*. */

/* --------------------------------------------------------------- каркас */

.b24-access-root .b24-section-chrome {
  flex: 0 0 auto;
}

.b24-access-root .b24-section-body {
  flex: 1 1 auto;
  min-height: 0;
  overflow: hidden;
  display: flex;
  flex-direction: column;
}

.b24-access-toolbar {
  flex-wrap: wrap;
  gap: 8px;
}

.b24-access-layout {
  display: grid;
  grid-template-columns: minmax(300px, 380px) minmax(0, 1fr);
  gap: 16px;
  align-items: stretch;
  flex: 1 1 auto;
  min-height: 0;
  padding: 4px 0 12px;
}

@media (max-width: 980px) {
  .b24-access-layout {
    grid-template-columns: 1fr;
    overflow-y: auto;
  }

  .b24-access-pane_groups,
  .b24-access-pane_rules {
    max-height: none;
  }
}

/* --------------------------------------------------------------- панели */

.b24-access-pane {
  display: flex;
  flex-direction: column;
  min-height: 0;
  position: relative;
  border: 1px solid rgba(83, 92, 105, 0.2);
  border-radius: 12px;
  background: #fff;
  overflow: hidden;
}

/* Акцент слева — отдельная обводка одинаковой толщины со всех сторон,
   иначе угол 3px/1px не скругляется и полоска обрывается до радиуса. */
.b24-access-pane_groups::after,
.b24-access-pane_rules::after {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 3;
  border-radius: inherit;
  box-sizing: border-box;
  border: 3px solid transparent;
  pointer-events: none;
}

.b24-access-pane_groups::after {
  border-left-color: #6e7eb8;
}

.b24-access-pane_rules::after {
  border-left-color: #8b7cc9;
}

.b24-access-pane__head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  flex-wrap: wrap;
  padding: 12px 14px;
  border-bottom: 1px solid rgba(83, 92, 105, 0.14);
  background: rgba(83, 92, 105, 0.04);
  flex: 0 0 auto;
}

.b24-access-pane__titles {
  display: flex;
  align-items: center;
  gap: 8px;
}

.b24-access-pane__title {
  margin: 0;
  font-size: 14px;
  font-weight: 600;
  letter-spacing: 0.01em;
}

.b24-access-pane__count {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 22px;
  height: 22px;
  padding: 0 7px;
  border-radius: 11px;
  font-size: 12px;
  font-weight: 600;
  background: rgba(110, 126, 184, 0.16);
  color: #3d4a7a;
}

.b24-access-pane__actions {
  display: flex;
  gap: 6px;
  flex-wrap: wrap;
}

.b24-access-pane_groups .b24-access-groups {
  flex: 1 1 auto;
  min-height: 0;
  overflow-y: auto;
  padding: 10px 12px 14px;
}

.b24-access-pane_rules {
  padding: 0;
}

.b24-access-pane_rules > .b24-access-prefs,
.b24-access-pane_rules > .b24-access-cats {
  flex: 0 0 auto;
}

.b24-access-panels {
  flex: 1 1 auto;
  min-height: 0;
  overflow-y: auto;
  padding: 0 14px 16px;
}

/* --------------------------------------------------------------- справка */

.b24-access-help {
  margin: 8px 0 4px;
}

.b24-access-help__grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
}

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

.b24-access-help__card {
  border: 1px solid rgba(83, 92, 105, 0.16);
  border-radius: 10px;
  padding: 10px 12px;
  background: rgba(83, 92, 105, 0.04);
}

.b24-access-help__title {
  margin: 0 0 6px;
  font-size: 13px;
  font-weight: 600;
}

.b24-access-help__text {
  margin: 0;
  font-size: 12.5px;
  line-height: 1.45;
  color: #535c69;
}

.b24-access-legend {
  margin: 0;
  padding: 0;
  list-style: none;
  display: flex;
  flex-direction: column;
  gap: 6px;
  font-size: 12.5px;
  color: #535c69;
}

.b24-access-legend li {
  display: flex;
  align-items: center;
  gap: 8px;
}

/* --------------------------------------------------------------- статусы */

.b24-access-status {
  display: inline-flex;
  align-items: center;
  height: 20px;
  padding: 0 8px;
  border-radius: 6px;
  font-size: 11px;
  font-weight: 600;
  letter-spacing: 0.02em;
  white-space: nowrap;
  border: 1px solid transparent;
}

.b24-access-status_open {
  background: rgba(46, 164, 110, 0.14);
  color: #1a7a4c;
  border-color: rgba(46, 164, 110, 0.28);
}

.b24-access-status_groups {
  background: rgba(126, 110, 200, 0.14);
  color: #4d3f8f;
  border-color: rgba(126, 110, 200, 0.3);
}

.b24-access-status_admin {
  background: rgba(210, 150, 40, 0.14);
  color: #8a5a00;
  border-color: rgba(210, 150, 40, 0.32);
}

/* --------------------------------------------------------------- prefs */

.b24-access-prefs {
  display: flex;
  align-items: center;
  gap: 12px;
  flex-wrap: wrap;
  padding: 10px 14px;
  border-bottom: 1px solid rgba(83, 92, 105, 0.12);
  background: rgba(83, 92, 105, 0.03);
}

.b24-access-prefs__toggle {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  cursor: pointer;
  user-select: none;
  font-size: 13px;
}

.b24-access-prefs__toggle input {
  position: absolute;
  opacity: 0;
  width: 0;
  height: 0;
}

.b24-access-prefs__switch {
  position: relative;
  width: 36px;
  height: 20px;
  border-radius: 10px;
  background: rgba(83, 92, 105, 0.28);
  flex: 0 0 auto;
  transition: background 0.15s ease;
}

.b24-access-prefs__switch::after {
  content: '';
  position: absolute;
  top: 2px;
  left: 2px;
  width: 16px;
  height: 16px;
  border-radius: 50%;
  background: #fff;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.25);
  transition: transform 0.15s ease;
}

.b24-access-prefs__toggle input:checked + .b24-access-prefs__switch {
  background: #7e6ec8;
}

.b24-access-prefs__toggle input:checked + .b24-access-prefs__switch::after {
  transform: translateX(16px);
}

.b24-access-prefs__toggle input:focus-visible + .b24-access-prefs__switch {
  outline: 2px solid #7e6ec8;
  outline-offset: 2px;
}

.b24-access-prefs__label {
  font-weight: 500;
}

/* --------------------------------------------------------------- категории */

.b24-access-cats {
  display: flex;
  gap: 6px;
  flex-wrap: wrap;
  padding: 10px 14px;
  border-bottom: 1px solid rgba(83, 92, 105, 0.12);
}

.b24-access-cat {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 7px 12px;
  border: 1px solid rgba(83, 92, 105, 0.2);
  border-radius: 10px;
  background: transparent;
  cursor: pointer;
  font: inherit;
  font-size: 13px;
  color: inherit;
  transition: background 0.12s ease, border-color 0.12s ease, box-shadow 0.12s ease;
}

.b24-access-cat:hover {
  background: rgba(83, 92, 105, 0.06);
}

.b24-access-cat.is-active {
  background: #fff;
  border-color: transparent;
  box-shadow: 0 0 0 1px rgba(126, 110, 200, 0.45), 0 4px 12px rgba(0, 0, 0, 0.06);
}

.b24-access-cat__tone {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  flex: 0 0 auto;
}

.b24-access-cat[data-access-cat='registry'] .b24-access-cat__tone {
  background: #7e6ec8;
}

.b24-access-cat[data-access-cat='billing'] .b24-access-cat__tone {
  background: #4a9bb8;
}

.b24-access-cat[data-access-cat='pickups'] .b24-access-cat__tone {
  background: #c48a2e;
}

.b24-access-cat[data-access-cat='finance'] .b24-access-cat__tone {
  background: #3d9a6e;
}

.b24-access-cat__label {
  font-weight: 600;
}

.b24-access-cat__meta {
  font-size: 11px;
  color: #828b98;
  font-weight: 500;
}

.b24-access-cat.is-active .b24-access-cat__meta {
  color: #5c6570;
}

/* --------------------------------------------------------------- панели правил */

.b24-access-panel[hidden] {
  display: none !important;
}

.b24-access-panel__head {
  padding: 14px 0 10px;
}

.b24-access-panel__title {
  margin: 0 0 4px;
  font-size: 15px;
  font-weight: 600;
}

.b24-access-panel__lead {
  margin: 0;
  font-size: 12.5px;
  line-height: 1.4;
  color: #6a7380;
  max-width: 720px;
}

.b24-access-panel[data-access-panel='registry'] .b24-access-panel__title {
  color: #4d3f8f;
}

.b24-access-panel[data-access-panel='billing'] .b24-access-panel__title {
  color: #1e6a82;
}

.b24-access-panel[data-access-panel='pickups'] .b24-access-panel__title {
  color: #8a5a00;
}

.b24-access-panel[data-access-panel='finance'] .b24-access-panel__title {
  color: #1a7a4c;
}

/* --------------------------------------------------------------- группы */

.b24-access-groups {
  display: flex;
  flex-direction: column;
  gap: 10px;
}

.b24-access-group {
  /* Карточки — дети flex-колонки со своей прокруткой. overflow:hidden
     обнуляет min-height, и flex-shrink срезает раскрытый состав. */
  flex: 0 0 auto;
  border: 1px solid rgba(83, 92, 105, 0.18);
  border-radius: 10px;
  background: rgba(255, 255, 255, 0.9);
  overflow: hidden;
  transition: border-color 0.12s ease, box-shadow 0.12s ease;
}

.b24-access-group:hover {
  border-color: rgba(110, 126, 184, 0.45);
}

.b24-access-group:not(.b24-access-group_collapsed) {
  box-shadow: 0 0 0 1px rgba(110, 126, 184, 0.2), 0 4px 14px rgba(0, 0, 0, 0.04);
  border-color: rgba(110, 126, 184, 0.4);
}

.b24-access-group__head {
  display: flex;
  align-items: center;
  gap: 8px;
  flex-wrap: nowrap;
  padding: 8px 10px;
  cursor: default;
}

.b24-access-group__avatar {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 28px;
  height: 28px;
  border-radius: 8px;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.02em;
  background: rgba(110, 126, 184, 0.16);
  color: #3d4a7a;
  flex: 0 0 auto;
}

.b24-access-group__toggle {
  border: 0;
  background: transparent;
  cursor: pointer;
  font-size: 12px;
  line-height: 1;
  padding: 4px;
  color: inherit;
  opacity: 0.55;
  flex: 0 0 auto;
}

.b24-access-group__toggle:hover {
  opacity: 1;
}

.b24-access-group__count {
  white-space: nowrap;
  font-size: 12px;
}

.b24-access-group_collapsed .b24-access-group__body {
  display: none;
}

.b24-access-group__name {
  flex: 1 1 auto;
  min-width: 0;
  width: auto;
  font-weight: 600;
  border: 1px solid transparent !important;
  background: transparent !important;
  box-shadow: none !important;
  padding: 4px 6px !important;
}

.b24-access-group__name:hover,
.b24-access-group__name:focus {
  border-color: rgba(83, 92, 105, 0.28) !important;
  background: #fff !important;
}

.b24-access-group__search {
  width: 100%;
  min-width: 0;
  box-sizing: border-box;
}

.b24-access-group__delete {
  margin-left: auto;
}

.b24-access-group__body {
  display: flex;
  flex-direction: column;
  gap: 8px;
  padding: 0 10px 10px;
  border-top: 1px solid rgba(83, 92, 105, 0.1);
  padding-top: 10px;
}

.b24-access-group__body-label {
  margin: 0;
  font-size: 11px;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  color: #828b98;
}

.b24-access-badge {
  font-size: 11px;
  line-height: 1;
  padding: 4px 7px;
  border-radius: 6px;
  white-space: nowrap;
  font-weight: 600;
}

.b24-access-badge_auto {
  background: rgba(210, 150, 40, 0.16);
  color: #8a5a00;
}

.b24-access-badge_b24 {
  background: rgba(47, 170, 210, 0.16);
  color: #0b6a8a;
}

.b24-access-group__members,
.b24-access-rule__groups {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
}

.b24-access-chip {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 3px 6px 3px 10px;
  border-radius: 8px;
  background: rgba(110, 126, 184, 0.12);
  border: 1px solid rgba(110, 126, 184, 0.18);
  font-size: 12.5px;
}

.b24-access-chip_group {
  background: rgba(126, 110, 200, 0.12);
  border-color: rgba(126, 110, 200, 0.22);
}

.b24-access-chip_add {
  background: transparent;
  border-style: dashed;
  border-color: rgba(83, 92, 105, 0.35);
  cursor: pointer;
  color: inherit;
  font: inherit;
  padding: 3px 10px;
}

.b24-access-chip_add:hover {
  border-color: #7e6ec8;
  color: #4d3f8f;
}

.b24-access-chip__remove {
  border: 0;
  background: transparent;
  cursor: pointer;
  font-size: 14px;
  line-height: 1;
  padding: 2px 4px;
  color: inherit;
  opacity: 0.55;
  border-radius: 4px;
}

.b24-access-chip__remove:hover {
  opacity: 1;
  background: rgba(200, 60, 60, 0.12);
  color: #b33;
}

.b24-access-group__results {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
}

.b24-access-empty {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 4px;
  padding: 18px 12px;
  border: 1px dashed rgba(83, 92, 105, 0.28);
  border-radius: 10px;
  color: #6a7380;
  font-size: 13px;
}

/* --------------------------------------------------------------- правила */

.b24-access-rules {
  display: flex;
  flex-direction: column;
  gap: 8px;
}

.b24-access-rule {
  border: 1px solid rgba(83, 92, 105, 0.16);
  border-radius: 10px;
  padding: 0;
  overflow: hidden;
  background: #fff;
  border-left-width: 3px;
  border-left-color: rgba(83, 92, 105, 0.25);
}

.b24-access-rule_open {
  border-left-color: #2ea46e;
}

.b24-access-rule_groups {
  border-left-color: #7e6ec8;
  background: rgba(126, 110, 200, 0.03);
}

.b24-access-rule_admin {
  border-left-color: #c48a2e;
  background: rgba(210, 150, 40, 0.04);
}

.b24-access-rule__head {
  display: flex;
  align-items: center;
  gap: 10px;
  flex-wrap: wrap;
  padding: 10px 12px;
}

.b24-access-rule__name {
  font-weight: 600;
  font-size: 13.5px;
  flex: 1 1 140px;
  min-width: 100px;
}

.b24-access-rule__hint {
  margin: 0;
  padding: 0 12px 8px;
  font-size: 12px;
}

.b24-access-rule__toggle {
  margin-left: auto;
}

.b24-access-rule__toggle.b24-filter-check {
  font-size: 12.5px;
}

.b24-access-rule__always {
  margin-left: auto;
  font-size: 12px;
  color: #8a5a00;
  font-weight: 500;
}

.b24-access-rule__body {
  display: flex;
  flex-direction: column;
  gap: 8px;
  padding: 0 12px 12px;
  border-top: 1px solid rgba(83, 92, 105, 0.1);
  padding-top: 10px;
}

/* display:flex выше перебивает нативный [hidden] — как у .b24-filter-check. */
.b24-access-rule__body[hidden] {
  display: none !important;
}

.b24-access-rule__select {
  max-width: 280px;
}

.b24-access-rules__err {
  margin: 0;
  padding: 12px;
  border-radius: 10px;
  background: rgba(200, 60, 60, 0.08);
}

/* --------------------------------------------------- Б24-импорт */

.b24-access-b24-slot {
  flex: 0 0 auto;
  padding: 0 12px 10px;
  border-bottom: 1px solid rgba(83, 92, 105, 0.12);
}

.b24-access-b24-slot[hidden] {
  display: none !important;
}

.b24-access-b24-panel {
  border: 1px solid rgba(47, 170, 210, 0.35);
  border-radius: 10px;
  padding: 8px 10px;
  max-height: 280px;
  overflow-y: auto;
  display: flex;
  flex-direction: column;
  gap: 4px;
  background: rgba(47, 170, 210, 0.06);
}

.b24-access-b24-panel__title {
  margin: 0 0 4px;
  font-size: 12px;
  font-weight: 600;
  color: #0b6a8a;
  text-transform: uppercase;
  letter-spacing: 0.04em;
}

.b24-access-b24-panel__row {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 4px 2px;
  border-radius: 6px;
}

.b24-access-b24-panel__row:hover {
  background: rgba(47, 170, 210, 0.1);
}

.b24-access-b24-panel__name {
  flex: 1 1 auto;
  font-size: 13px;
}

/* =============================================================== Nocturne */

.is-theme-nocturne .b24-access-pane {
  background: var(--noct-surface, #232532);
  border-color: var(--noct-divider, rgba(233, 233, 237, 0.16));
  box-shadow: var(--noct-shadow-sm, 0 0 0 1px #3f424d);
}

.is-theme-nocturne .b24-access-pane_groups::after {
  border-left-color: var(--noct-accent-400, #b5abfc);
}

.is-theme-nocturne .b24-access-pane_rules::after {
  border-left-color: var(--noct-accent, #9184d9);
}

.is-theme-nocturne .b24-access-pane__head {
  background: var(--noct-header, #2a2c3b);
  border-bottom-color: var(--noct-divider, rgba(233, 233, 237, 0.16));
}

.is-theme-nocturne .b24-access-pane__title {
  color: var(--noct-text, #e9e9ed);
  font-weight: var(--noct-font-heading-weight, 500);
}

.is-theme-nocturne .b24-access-pane__count {
  background: var(--noct-accent-bg, rgba(145, 132, 217, 0.15));
  color: var(--noct-accent-300, #d2cefd);
}

.is-theme-nocturne .b24-access-help__card {
  background: var(--noct-header, #2a2c3b);
  border-color: var(--noct-divider, rgba(233, 233, 237, 0.16));
}

.is-theme-nocturne .b24-access-help__title {
  color: var(--noct-text, #e9e9ed);
  font-weight: var(--noct-font-heading-weight, 500);
}

.is-theme-nocturne .b24-access-help__text,
.is-theme-nocturne .b24-access-legend {
  color: var(--noct-neutral-400, #b2b6ca);
}

.is-theme-nocturne .b24-access-status_open {
  background: var(--noct-ok-bg, rgba(120, 200, 150, 0.15));
  color: var(--noct-ok, oklch(78% 0.09 155));
  border-color: var(--noct-ok-border, rgba(120, 200, 150, 0.45));
}

.is-theme-nocturne .b24-access-status_groups {
  background: var(--noct-accent-bg, rgba(145, 132, 217, 0.15));
  color: var(--noct-accent-300, #d2cefd);
  border-color: color-mix(in srgb, var(--noct-accent, #9184d9) 45%, transparent);
}

.is-theme-nocturne .b24-access-status_admin {
  background: var(--noct-warn-bg, rgba(210, 180, 80, 0.15));
  color: var(--noct-warn, oklch(80% 0.1 85));
  border-color: var(--noct-warn-border, rgba(210, 180, 80, 0.45));
}

.is-theme-nocturne .b24-access-prefs {
  background: color-mix(in srgb, var(--noct-text, #e9e9ed) 3%, transparent);
  border-bottom-color: var(--noct-divider, rgba(233, 233, 237, 0.16));
}

.is-theme-nocturne .b24-access-prefs__switch {
  background: var(--noct-neutral-700, #595d6c);
}

.is-theme-nocturne .b24-access-prefs__toggle input:checked + .b24-access-prefs__switch {
  background: var(--noct-accent, #9184d9);
}

.is-theme-nocturne .b24-access-prefs__label {
  color: var(--noct-text, #e9e9ed);
}

.is-theme-nocturne .b24-access-cats {
  border-bottom-color: var(--noct-divider, rgba(233, 233, 237, 0.16));
}

.is-theme-nocturne .b24-access-cat {
  border-color: var(--noct-divider, rgba(233, 233, 237, 0.16));
  color: var(--noct-neutral-300, #cfd3e5);
}

.is-theme-nocturne .b24-access-cat:hover {
  background: var(--noct-hover, rgba(233, 233, 237, 0.05));
}

.is-theme-nocturne .b24-access-cat.is-active {
  background: var(--noct-selected, rgba(145, 132, 217, 0.14));
  color: var(--noct-text, #e9e9ed);
  box-shadow: 0 0 0 1px color-mix(in srgb, var(--noct-accent, #9184d9) 55%, transparent);
}

.is-theme-nocturne .b24-access-cat__meta {
  color: var(--noct-neutral-500, #9397ab);
}

.is-theme-nocturne .b24-access-cat.is-active .b24-access-cat__meta {
  color: var(--noct-neutral-400, #b2b6ca);
}

.is-theme-nocturne .b24-access-cat[data-access-cat='registry'] .b24-access-cat__tone {
  background: var(--noct-accent, #9184d9);
}

.is-theme-nocturne .b24-access-cat[data-access-cat='billing'] .b24-access-cat__tone {
  background: #6eb8d0;
}

.is-theme-nocturne .b24-access-cat[data-access-cat='pickups'] .b24-access-cat__tone {
  background: var(--noct-warn, oklch(80% 0.1 85));
}

.is-theme-nocturne .b24-access-cat[data-access-cat='finance'] .b24-access-cat__tone {
  background: var(--noct-ok, oklch(78% 0.09 155));
}

.is-theme-nocturne .b24-access-panel__title {
  color: var(--noct-text, #e9e9ed) !important;
  font-weight: var(--noct-font-heading-weight, 500);
}

.is-theme-nocturne .b24-access-panel__lead {
  color: var(--noct-neutral-400, #b2b6ca);
}

.is-theme-nocturne .b24-access-group {
  background: color-mix(in srgb, var(--noct-text, #e9e9ed) 2.5%, var(--noct-surface, #232532));
  border-color: var(--noct-divider, rgba(233, 233, 237, 0.16));
}

.is-theme-nocturne .b24-access-group:hover {
  border-color: color-mix(in srgb, var(--noct-accent, #9184d9) 40%, transparent);
}

.is-theme-nocturne .b24-access-group:not(.b24-access-group_collapsed) {
  box-shadow: var(--noct-shadow-sm, 0 0 0 1px #3f424d);
  border-color: color-mix(in srgb, var(--noct-accent, #9184d9) 50%, transparent);
  background: var(--noct-selected, rgba(145, 132, 217, 0.14));
}

.is-theme-nocturne .b24-access-group__avatar {
  background: var(--noct-accent-bg, rgba(145, 132, 217, 0.15));
  color: var(--noct-accent-300, #d2cefd);
}

.is-theme-nocturne .b24-access-group__name:hover,
.is-theme-nocturne .b24-access-group__name:focus {
  background: var(--noct-header, #2a2c3b) !important;
  border-color: var(--noct-divider, rgba(233, 233, 237, 0.16)) !important;
  color: var(--noct-text, #e9e9ed);
}

.is-theme-nocturne .b24-access-group__body {
  border-top-color: var(--noct-divider, rgba(233, 233, 237, 0.16));
}

.is-theme-nocturne .b24-access-group__body-label {
  color: var(--noct-neutral-500, #9397ab);
}

.is-theme-nocturne .b24-access-badge_auto {
  background: var(--noct-warn-bg, rgba(210, 180, 80, 0.15));
  color: var(--noct-warn, oklch(80% 0.1 85));
}

.is-theme-nocturne .b24-access-badge_b24 {
  background: rgba(110, 184, 208, 0.18);
  color: #9ed4e4;
}

.is-theme-nocturne .b24-access-chip {
  background: var(--noct-accent-bg, rgba(145, 132, 217, 0.15));
  border-color: color-mix(in srgb, var(--noct-accent, #9184d9) 30%, transparent);
  color: var(--noct-text, #e9e9ed);
}

.is-theme-nocturne .b24-access-chip_group {
  background: color-mix(in srgb, var(--noct-accent-2, #a7a1db) 18%, transparent);
  border-color: color-mix(in srgb, var(--noct-accent-2, #a7a1db) 35%, transparent);
}

.is-theme-nocturne .b24-access-chip_add {
  border-color: var(--noct-neutral-600, #75798c);
  color: var(--noct-neutral-300, #cfd3e5);
}

.is-theme-nocturne .b24-access-chip_add:hover {
  border-color: var(--noct-accent, #9184d9);
  color: var(--noct-accent-300, #d2cefd);
}

.is-theme-nocturne .b24-access-chip__remove:hover {
  background: var(--noct-err-bg, rgba(220, 100, 90, 0.15));
  color: var(--noct-err, oklch(72% 0.13 25));
}

.is-theme-nocturne .b24-access-empty {
  border-color: var(--noct-neutral-700, #595d6c);
  color: var(--noct-neutral-400, #b2b6ca);
}

.is-theme-nocturne .b24-access-rule {
  background: color-mix(in srgb, var(--noct-text, #e9e9ed) 2%, var(--noct-surface, #232532));
  border-color: var(--noct-divider, rgba(233, 233, 237, 0.16));
}

.is-theme-nocturne .b24-access-rule_open {
  border-left-color: var(--noct-ok, oklch(78% 0.09 155));
}

.is-theme-nocturne .b24-access-rule_groups {
  border-left-color: var(--noct-accent, #9184d9);
  background: var(--noct-selected, rgba(145, 132, 217, 0.14));
}

.is-theme-nocturne .b24-access-rule_admin {
  border-left-color: var(--noct-warn, oklch(80% 0.1 85));
  background: var(--noct-warn-bg, rgba(210, 180, 80, 0.15));
}

.is-theme-nocturne .b24-access-rule__name {
  color: var(--noct-text, #e9e9ed);
}

.is-theme-nocturne .b24-access-rule__body {
  border-top-color: var(--noct-divider, rgba(233, 233, 237, 0.16));
}

.is-theme-nocturne .b24-access-rule__always {
  color: var(--noct-warn, oklch(80% 0.1 85));
}

.is-theme-nocturne .b24-access-rules__err {
  background: var(--noct-err-bg, rgba(220, 100, 90, 0.15));
}

.is-theme-nocturne .b24-access-b24-slot {
  border-bottom-color: var(--noct-divider, rgba(233, 233, 237, 0.16));
}

.is-theme-nocturne .b24-access-b24-panel {
  background: rgba(110, 184, 208, 0.08);
  border-color: rgba(110, 184, 208, 0.35);
}

.is-theme-nocturne .b24-access-b24-panel__title {
  color: #9ed4e4;
}

.is-theme-nocturne .b24-access-b24-panel__row:hover {
  background: rgba(110, 184, 208, 0.12);
}