.permission-matrix-root{display:grid;gap:16px}.permission-matrix-head,.perm-profile-card,.perm-group,.perm-target,.perm-global{border:1px solid rgba(109,178,255,.24);border-radius:18px;background:rgba(14,34,58,.58);box-shadow:inset 0 0 0 1px rgba(255,255,255,.018)}.permission-matrix-head{display:flex;justify-content:space-between;gap:16px;align-items:start;padding:18px}.permission-matrix-head h2{margin:0 0 8px;font-size:clamp(1.6rem,2.5vw,2.4rem)}.permission-matrix-head p{margin:0;color:var(--muted)}.perm-legend{display:flex;gap:10px;flex-wrap:wrap;align-items:center;color:var(--muted);font-size:.9rem}.legend-dot{display:inline-grid;place-items:center;width:24px;height:24px;border-radius:8px;margin-right:4px}.legend-dot.standard{color:#ffd66b;border:1px solid rgba(255,214,107,.45);background:rgba(255,214,107,.12)}.legend-dot.allow{color:#7affcc;border:1px solid rgba(122,255,204,.42);background:rgba(122,255,204,.14)}.legend-dot.deny{color:#ff7b9a;border:1px solid rgba(255,123,154,.42);background:rgba(255,123,154,.14)}.perm-profile-list{display:grid;gap:16px}.perm-profile-card{display:grid;gap:12px;padding:16px}.perm-profile-card>header{display:flex;justify-content:space-between;gap:12px;align-items:start}.perm-profile-card h3{margin:0 0 4px}.perm-profile-card p,.perm-target small,.perm-group small{margin:0;color:var(--muted)}.perm-global,.perm-group,.perm-target{padding:0;overflow:hidden}.perm-global>summary,.perm-group>summary,.perm-target>summary{list-style:none;cursor:pointer;display:flex;justify-content:space-between;gap:12px;align-items:center;padding:12px 14px;background:rgba(255,255,255,.025)}.perm-global>summary::-webkit-details-marker,.perm-group>summary::-webkit-details-marker,.perm-target>summary::-webkit-details-marker{display:none}.perm-global>summary::before,.perm-group>summary::before,.perm-target>summary::before{content:"▶";color:var(--blue);margin-right:6px}.perm-global[open]>summary::before,.perm-group[open]>summary::before,.perm-target[open]>summary::before{content:"▼"}.perm-target-list,.perm-section{padding:12px;display:grid;gap:12px}.perm-section h4{margin:0;color:var(--text)}.perm-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(185px,1fr));gap:8px}.perm-cell{display:grid;grid-template-columns:34px minmax(0,1fr) 24px;align-items:center;gap:8px;min-height:38px;padding:7px 9px;border-radius:12px;border:1px solid rgba(109,178,255,.18);background:rgba(255,255,255,.025)}.perm-label{overflow-wrap:anywhere;font-weight:700}.perm-tri{width:28px;height:28px;border-radius:9px;display:grid;place-items:center;border:1px solid rgba(255,255,255,.18);background:rgba(255,255,255,.04);color:var(--text);font-weight:900;cursor:pointer;transition:transform .12s ease,border-color .12s ease,background .12s ease}.perm-tri:hover{transform:translateY(-1px)}.perm-std{color:#ffd66b;border-color:rgba(255,214,107,.55);background:rgba(255,214,107,.12)}.perm-std.deny{color:#ffcf7a;background:rgba(255,159,67,.09)}.perm-allow{color:#7affcc;border-color:rgba(122,255,204,.65);background:rgba(122,255,204,.16);box-shadow:inset 0 0 0 1px rgba(122,255,204,.08)}.perm-deny{color:#ff7b9a;border-color:rgba(255,123,154,.65);background:rgba(255,123,154,.16);box-shadow:inset 0 0 0 1px rgba(255,123,154,.08)}.perm-help{width:22px;height:22px;border-radius:999px;display:grid;place-items:center;color:var(--muted);border:1px solid rgba(109,178,255,.18);background:rgba(255,255,255,.025);font-size:.8rem}.permission-loading,.permission-error{border:1px dashed rgba(109,178,255,.3);border-radius:16px;padding:18px;background:rgba(14,34,58,.38)}.permission-error{border-color:rgba(255,123,154,.55);color:#ffb3c3}@media(max-width:760px){.permission-matrix-head,.perm-profile-card>header{display:grid}.perm-grid{grid-template-columns:1fr}}


.admin-legacy-permissions,
.permission-legacy-panel,
.legacy-permission-panel,
[data-legacy-permissions],
[data-server-permissions-legacy],
.server-permission-legacy,
.server-permissions-legacy {
  display: none !important;
}

/* If old cards contain the old explanatory text, JS will mark them with .is-legacy-permission-ui */
.is-legacy-permission-ui {
  display: none !important;
}

/* Make the new matrix clearly visible near the top */
.permission-matrix-card {
  display: block !important;
  margin-top: 16px;
  border-color: rgba(122,255,204,.34) !important;
}

/* Avoid old default white checkbox look inside matrix if old input elements leak in */
.permission-matrix-root input[type="checkbox"] {
  accent-color: #7affcc;
}



.permission-matrix-head .btn,
.permission-matrix-head button,
.permission-matrix-card [data-perm-refresh] {
  border: 1px solid rgba(109,178,255,.35) !important;
  border-radius: 14px !important;
  background: linear-gradient(180deg, rgba(53,167,255,.22), rgba(14,34,58,.70)) !important;
  color: var(--text) !important;
  font-weight: 800 !important;
  box-shadow: inset 0 0 0 1px rgba(255,255,255,.035), 0 10px 28px rgba(0,0,0,.18) !important;
  padding: 10px 14px !important;
}

.perm-profile-card {
  padding: 0 !important;
  overflow: hidden;
}

.perm-profile-card > summary.perm-profile-summary {
  list-style: none;
  cursor: pointer;
  display: flex;
  justify-content: space-between;
  gap: 12px;
  align-items: center;
  padding: 14px 16px;
  background: rgba(255,255,255,.025);
}

.perm-profile-card > summary.perm-profile-summary::-webkit-details-marker {
  display: none;
}

.perm-profile-card > summary.perm-profile-summary::before {
  content: "▶";
  color: var(--blue);
  margin-right: 8px;
}

.perm-profile-card[open] > summary.perm-profile-summary::before {
  content: "▼";
}

.perm-profile-body {
  display: grid;
  gap: 12px;
  padding: 14px;
}

.perm-meta {
  display: block;
  margin-top: 2px;
  opacity: .72;
  font-size: .78rem;
  font-weight: 700;
  letter-spacing: .01em;
}

.perm-group > summary > span,
.perm-target > summary > span,
.perm-profile-summary > span {
  display: grid;
  gap: 2px;
  min-width: 0;
}

.permission-matrix-card .permission-loading {
  min-height: 58px;
  display: grid;
  align-items: center;
}

/* Hide matrix immediately on non-admin pages when route-safe JS marks body */
body:not([data-page="admin"]):not([data-page="vpn-admin"]) .permission-matrix-card[data-route-orphan="true"] {
  display: none !important;
}



.permission-matrix-card [data-perm-refresh],
.permission-matrix-head .btn,
.permission-matrix-head button {
  border: 1px solid rgba(109,178,255,.38) !important;
  border-radius: 14px !important;
  background: linear-gradient(180deg, rgba(53,167,255,.24), rgba(14,34,58,.74)) !important;
  color: var(--text) !important;
  font-weight: 800 !important;
  padding: 10px 14px !important;
}

.perm-meta {
  display: block !important;
  margin-top: 2px;
  opacity: .72;
  font-size: .78rem;
  font-weight: 700;
}

.perm-profile-card > summary,
.perm-profile-summary {
  list-style: none;
}

.perm-profile-card > summary::-webkit-details-marker,
.perm-profile-summary::-webkit-details-marker {
  display: none;
}



.permission-matrix-card {
  max-width: 100%;
  overflow: hidden;
}

.permission-matrix-root {
  gap: 14px !important;
}

.permission-matrix-head {
  align-items: center !important;
}

.permission-matrix-head [data-perm-refresh],
.permission-matrix-head .btn,
.permission-matrix-head button {
  border: 1px solid rgba(109,178,255,.38) !important;
  border-radius: 14px !important;
  background: linear-gradient(180deg, rgba(53,167,255,.24), rgba(14,34,58,.76)) !important;
  color: var(--text) !important;
  font-weight: 800 !important;
  padding: 10px 16px !important;
  min-height: 42px;
}

.perm-profile-list {
  display: grid !important;
  grid-template-columns: repeat(auto-fit, minmax(320px, 1fr)) !important;
  gap: 12px !important;
}

.perm-profile-card {
  border: 1px solid rgba(109,178,255,.26) !important;
  border-radius: 18px !important;
  background: rgba(14,34,58,.54) !important;
  overflow: hidden !important;
  padding: 0 !important;
}

.perm-profile-card > summary,
.perm-profile-summary {
  min-height: 72px;
  padding: 14px 16px !important;
  display: grid !important;
  grid-template-columns: 28px minmax(0,1fr) auto !important;
  gap: 12px !important;
  align-items: center !important;
  text-align: left !important;
  cursor: pointer;
}

.perm-profile-card > summary::before,
.perm-profile-summary::before {
  content: "▶";
  color: var(--blue);
  font-size: 1.2rem;
}

.perm-profile-card[open] > summary::before,
.perm-profile-card[open] > .perm-profile-summary::before {
  content: "▼";
}

.perm-profile-card > summary > span,
.perm-profile-summary > span {
  display: grid !important;
  justify-items: start !important;
  text-align: left !important;
  gap: 3px !important;
}

.perm-profile-card strong {
  font-size: 1.02rem;
}

.perm-meta {
  display: block !important;
  opacity: .72 !important;
  font-size: .78rem !important;
  font-weight: 700 !important;
  overflow-wrap: anywhere;
}

.perm-profile-body {
  display: grid;
  gap: 12px;
  padding: 12px;
  border-top: 1px solid rgba(109,178,255,.16);
}

.permission-loading {
  min-height: 60px;
  display: grid;
  align-items: center;
}

/* never show old permission UI once route manager marks it */
.is-legacy-permission-ui {
  display: none !important;
}



.perm-profile-list {
  grid-template-columns: 1fr !important;
  gap: 12px !important;
}

.perm-profile-card {
  width: 100% !important;
}

.perm-profile-card > summary,
.perm-profile-summary {
  grid-template-columns: 30px minmax(0,1fr) auto !important;
  text-align: left !important;
}

.perm-profile-card > summary > span,
.perm-profile-summary > span {
  justify-items: start !important;
}

.perm-group,
.perm-target,
.perm-global {
  width: 100%;
}

.perm-target-list {
  grid-template-columns: 1fr !important;
}



.admin-layout {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(260px, 360px);
  gap: 16px;
  align-items: start;
  margin-top: 16px;
}

.profile-admin-list {
  display: grid;
  gap: 12px;
}

.profile-admin-card {
  border: 1px solid rgba(109,178,255,.22);
  border-radius: 18px;
  background: rgba(14,34,58,.48);
  padding: 14px;
  display: grid;
  gap: 12px;
}

.profile-admin-main {
  display: flex;
  justify-content: space-between;
  gap: 12px;
  align-items: start;
}

.profile-admin-main p,
.small-note {
  margin: 4px 0 0;
  color: var(--muted);
}

.profile-admin-controls {
  display: grid;
  grid-template-columns: minmax(130px, 180px) minmax(130px, 180px) minmax(0, 1fr) auto;
  gap: 10px;
  align-items: end;
}

.profile-admin-controls label {
  display: grid;
  gap: 6px;
  color: var(--muted);
  font-weight: 700;
}

.profile-admin-controls select {
  min-height: 42px;
}

.admin-rules-card {
  display: grid;
  gap: 10px;
}

.admin-rules-card p {
  margin: 0;
}

@media (max-width: 980px) {
  .admin-layout {
    grid-template-columns: 1fr;
  }

  .profile-admin-controls {
    grid-template-columns: 1fr;
  }
}



.permission-matrix-card + .permission-matrix-card {
  display: none !important;
}



.admin-link-layout {
  display: grid;
  gap: 12px;
  margin: 16px 0;
}

.admin-link-card {
  overflow: hidden;
}

.admin-link-card > summary {
  list-style: none;
  cursor: pointer;
  display: flex;
  justify-content: space-between;
  gap: 12px;
  align-items: center;
  padding: 14px 16px;
  background: rgba(255,255,255,.025);
}

.admin-link-card > summary::-webkit-details-marker {
  display: none;
}

.admin-link-card > summary::before {
  content: "▶";
  color: var(--blue);
  margin-right: 8px;
}

.admin-link-card[open] > summary::before {
  content: "▼";
}

.admin-link-card > summary > span {
  display: grid;
  gap: 3px;
}

.admin-link-card small {
  color: var(--muted);
}

.admin-link-body {
  display: grid;
  gap: 12px;
  padding: 14px;
  border-top: 1px solid rgba(109,178,255,.16);
}

.admin-link-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(140px, 1fr)) auto;
  gap: 10px;
  align-items: end;
}

.admin-link-grid label {
  display: grid;
  gap: 6px;
  color: var(--muted);
  font-weight: 700;
}

.admin-link-output {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 8px;
}

.admin-token-list {
  display: grid;
  gap: 8px;
}

.admin-token-row {
  display: flex;
  justify-content: space-between;
  gap: 12px;
  align-items: start;
  border: 1px solid rgba(109,178,255,.18);
  border-radius: 14px;
  background: rgba(255,255,255,.025);
  padding: 10px;
}

.admin-token-row p,
.admin-token-row small {
  margin: 3px 0 0;
  color: var(--muted);
}

.admin-token-row small {
  display: flex;
  gap: 12px;
  flex-wrap: wrap;
}

.admin-token-actions {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
  justify-content: flex-end;
}

@media (max-width: 980px) {
  .admin-link-grid,
  .admin-link-output {
    grid-template-columns: 1fr;
  }

  .admin-token-row {
    display: grid;
  }
}



.permission-matrix-collapsible,
.admin-profiles-collapsible,
.vpn-invite-collapsible,
.admin-link-card {
  overflow: hidden;
}

.permission-matrix-collapsible > summary,
.admin-profiles-collapsible > summary,
.vpn-invite-collapsible > summary {
  list-style: none;
  cursor: pointer;
  display: grid;
  grid-template-columns: 28px minmax(0,1fr) auto;
  gap: 12px;
  align-items: center;
  padding: 14px 16px;
  background: rgba(255,255,255,.025);
  text-align: left;
}

.permission-matrix-collapsible > summary::-webkit-details-marker,
.admin-profiles-collapsible > summary::-webkit-details-marker,
.vpn-invite-collapsible > summary::-webkit-details-marker {
  display: none;
}

.permission-matrix-collapsible > summary::before,
.admin-profiles-collapsible > summary::before,
.vpn-invite-collapsible > summary::before {
  content: "▶";
  color: var(--blue);
  font-size: 1.1rem;
}

.permission-matrix-collapsible[open] > summary::before,
.admin-profiles-collapsible[open] > summary::before,
.vpn-invite-collapsible[open] > summary::before {
  content: "▼";
}

.permission-matrix-collapsible > summary > span,
.admin-profiles-collapsible > summary > span,
.vpn-invite-collapsible > summary > span,
.admin-link-card > summary > span {
  display: grid;
  gap: 3px;
  justify-items: start;
  text-align: left;
}

.permission-matrix-collapsible small,
.admin-profiles-collapsible small,
.vpn-invite-collapsible small,
.admin-link-card small {
  color: var(--muted);
  text-align: left;
}

.permission-matrix-collapse-body,
.admin-profile-collapse-body,
.vpn-invite-collapse-body {
  padding: 14px;
  border-top: 1px solid rgba(109,178,255,.16);
  display: grid;
  gap: 12px;
}

/* Admin invite/reset left alignment */
.admin-link-layout,
.admin-link-card,
.admin-link-card *,
.admin-link-body,
.admin-link-grid,
.admin-link-result,
.admin-token-list,
.admin-token-row {
  text-align: left !important;
}

.admin-link-card > summary {
  display: grid !important;
  grid-template-columns: 28px minmax(0,1fr) auto !important;
  text-align: left !important;
}

.admin-link-card > summary::before {
  grid-column: 1;
}

.admin-link-card > summary > span {
  grid-column: 2;
}

.admin-link-card > summary > .pill {
  grid-column: 3;
}

.admin-link-result:empty {
  display: none;
}

.admin-token-list::before {
  content: "Aktive Links";
  color: var(--muted);
  font-weight: 800;
  font-size: .85rem;
  letter-spacing: .04em;
  text-transform: uppercase;
}

.admin-token-actions .mini,
.admin-token-actions button {
  min-height: 34px;
  padding: 6px 10px;
}

/* Prevent the profile panel from being centered accidentally */
.admin-main-card,
.admin-main-card *,
.profile-admin-card,
.profile-admin-card * {
  text-align: left;
}



.admin-panel-stack,
.vpn-admin-panel-stack {
  display: grid;
  gap: 12px;
  margin: 16px 0;
  max-width: min(1120px, 100%);
}

.admin-panel-stack > *,
.vpn-admin-panel-stack > * {
  width: 100%;
}

.admin-rules-card {
  max-width: min(1120px, 100%);
}

.admin-link-card > summary,
.permission-matrix-collapsible > summary,
.admin-profiles-collapsible > summary,
.vpn-invite-collapsible > summary,
.vpn-profiles-collapsible > summary {
  min-height: 64px;
}

.vpn-invite-collapsible,
.vpn-profiles-collapsible {
  overflow: hidden;
}

.vpn-invite-collapsible > summary,
.vpn-profiles-collapsible > summary {
  list-style: none;
  cursor: pointer;
  display: grid;
  grid-template-columns: 28px minmax(0,1fr) auto;
  gap: 12px;
  align-items: center;
  padding: 14px 16px;
  background: rgba(255,255,255,.025);
  text-align: left;
}

.vpn-invite-collapsible > summary::-webkit-details-marker,
.vpn-profiles-collapsible > summary::-webkit-details-marker {
  display: none;
}

.vpn-invite-collapsible > summary::before,
.vpn-profiles-collapsible > summary::before {
  content: "▶";
  color: var(--blue);
  font-size: 1.1rem;
}

.vpn-invite-collapsible[open] > summary::before,
.vpn-profiles-collapsible[open] > summary::before {
  content: "▼";
}

.vpn-invite-collapsible > summary > span,
.vpn-profiles-collapsible > summary > span {
  display: grid;
  gap: 3px;
  justify-items: start;
  text-align: left;
}

.vpn-invite-collapsible-body,
.vpn-profiles-collapsible-body {
  padding: 14px;
  border-top: 1px solid rgba(109,178,255,.16);
  display: grid;
  gap: 12px;
}

/* left align admin links */
.admin-link-layout,
.admin-link-card,
.admin-link-card *,
.admin-token-row,
.admin-token-row * {
  text-align: left !important;
}

.admin-token-toolbar {
  display: flex;
  justify-content: space-between;
  gap: 12px;
  align-items: center;
  color: var(--muted);
  font-weight: 800;
  font-size: .85rem;
  letter-spacing: .04em;
  text-transform: uppercase;
}

.admin-token-list::before {
  content: none !important;
}

.admin-token-row.is-archived {
  opacity: .72;
  border-color: rgba(255,207,120,.28);
}

.admin-token-row.is-revoked {
  opacity: .72;
  border-color: rgba(255,110,140,.28);
}

.permission-matrix-card + .permission-matrix-card,
.admin-panel-stack .permission-matrix-card ~ .permission-matrix-card,
.vpn-admin-panel-stack .permission-matrix-card ~ .permission-matrix-card {
  display: none !important;
}



body[data-route="admin"] .admin-rules-card,
body[data-route="vpn-admin"] .admin-rules-card {
  display: none !important;
}



.admin-panel-stack,.vpn-admin-panel-stack{display:grid;gap:12px;margin:16px 0;max-width:min(1120px,100%)}
.admin-panel-stack>*,.vpn-admin-panel-stack>*,.admin-link-layout>*{width:100%}
.admin-link-layout{display:grid;gap:12px}
.admin-rules-card,.rules-card,.regeln-card{display:none!important}
.permission-matrix-collapsible,.admin-profiles-collapsible,.vpn-invite-collapsible,.vpn-profiles-collapsible,.admin-link-card{overflow:hidden}
.permission-matrix-collapsible>summary,.admin-profiles-collapsible>summary,.vpn-invite-collapsible>summary,.vpn-profiles-collapsible>summary,.admin-link-card>summary{list-style:none;cursor:pointer;display:grid!important;grid-template-columns:28px minmax(0,1fr) auto!important;gap:12px;align-items:center;min-height:64px;padding:14px 16px;background:rgba(255,255,255,.025);text-align:left!important}
.permission-matrix-collapsible>summary::-webkit-details-marker,.admin-profiles-collapsible>summary::-webkit-details-marker,.vpn-invite-collapsible>summary::-webkit-details-marker,.vpn-profiles-collapsible>summary::-webkit-details-marker,.admin-link-card>summary::-webkit-details-marker{display:none}
.permission-matrix-collapsible>summary:before,.admin-profiles-collapsible>summary:before,.vpn-invite-collapsible>summary:before,.vpn-profiles-collapsible>summary:before,.admin-link-card>summary:before{content:"▶";color:var(--blue);font-size:1.1rem}
.permission-matrix-collapsible[open]>summary:before,.admin-profiles-collapsible[open]>summary:before,.vpn-invite-collapsible[open]>summary:before,.vpn-profiles-collapsible[open]>summary:before,.admin-link-card[open]>summary:before{content:"▼"}
.permission-matrix-collapsible>summary>span,.admin-profiles-collapsible>summary>span,.vpn-invite-collapsible>summary>span,.vpn-profiles-collapsible>summary>span,.admin-link-card>summary>span{display:grid;gap:3px;justify-items:start;text-align:left!important}
.permission-matrix-collapsible small,.admin-profiles-collapsible small,.vpn-invite-collapsible small,.vpn-profiles-collapsible small,.admin-link-card small{color:var(--muted);text-align:left!important}
.permission-matrix-collapse-body,.admin-profile-collapse-body,.vpn-invite-collapsible-body,.vpn-profiles-collapsible-body,.admin-link-body{padding:14px;border-top:1px solid rgba(109,178,255,.16);display:grid;gap:12px}
.admin-link-grid,.vpn-invite-grid{display:grid;grid-template-columns:repeat(3,minmax(140px,1fr)) auto;gap:10px;align-items:end}
.admin-link-grid label,.vpn-invite-grid label,.profile-admin-controls label{display:grid;gap:6px;color:var(--muted);font-weight:700;text-align:left}
.admin-link-output{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:8px}
.admin-token-toolbar{display:flex;justify-content:space-between;gap:12px;align-items:center;color:var(--muted);font-weight:800;font-size:.85rem;letter-spacing:.04em;text-transform:uppercase}
.admin-token-list{display:grid;gap:8px}.admin-token-list:before{content:none!important}
.admin-token-row{display:flex;justify-content:space-between;gap:12px;align-items:start;border:1px solid rgba(109,178,255,.18);border-radius:14px;background:rgba(255,255,255,.025);padding:10px;text-align:left}
.admin-token-row p,.admin-token-row small{margin:3px 0 0;color:var(--muted);text-align:left}.admin-token-row small{display:flex;gap:12px;flex-wrap:wrap}
.admin-token-actions{display:flex;gap:8px;flex-wrap:wrap;justify-content:flex-end}.admin-token-row.is-archived{opacity:.72;border-color:rgba(255,207,120,.28)}.admin-token-row.is-revoked{opacity:.72;border-color:rgba(255,110,140,.28)}
.profile-admin-list{display:grid;gap:12px}.profile-admin-card{border:1px solid rgba(109,178,255,.22);border-radius:18px;background:rgba(14,34,58,.48);padding:14px;display:grid;gap:12px}
.profile-admin-main{display:flex;justify-content:space-between;gap:12px;align-items:start}.profile-admin-main p,.small-note{margin:4px 0 0;color:var(--muted)}
.profile-admin-controls{display:grid;grid-template-columns:minmax(130px,180px) minmax(130px,180px) minmax(0,1fr) auto;gap:10px;align-items:end}
.permission-matrix-card+.permission-matrix-card,.admin-panel-stack .permission-matrix-card~.permission-matrix-card,.vpn-admin-panel-stack .permission-matrix-card~.permission-matrix-card{display:none!important}
.admin-link-layout,.admin-link-layout *,.vpn-admin-panel-stack,.vpn-admin-panel-stack *{text-align:left}
@media(max-width:980px){.admin-link-grid,.vpn-invite-grid,.admin-link-output,.profile-admin-controls{grid-template-columns:1fr}.admin-token-row{display:grid}}


/* Integrated groups UI */
.vpn-groups-collapsible > summary {
  list-style: none;
  cursor: pointer;
  display: grid !important;
  grid-template-columns: 28px minmax(0,1fr) auto !important;
  gap: 12px;
  align-items: center;
  min-height: 64px;
  padding: 14px 16px;
  background: rgba(255,255,255,.025);
  text-align: left !important;
}
.vpn-groups-collapsible > summary::-webkit-details-marker { display: none; }
.vpn-groups-collapsible > summary::before {
  content: "▶";
  color: var(--blue);
  font-size: 1.1rem;
}
.vpn-groups-collapsible[open] > summary::before { content: "▼"; }
.vpn-groups-collapsible > summary > span {
  display: grid;
  gap: 3px;
  justify-items: start;
  text-align: left !important;
}
.vpn-groups-collapsible small { color: var(--muted); }
.vpn-groups-collapsible-body {
  padding: 14px;
  border-top: 1px solid rgba(109,178,255,.16);
  display: grid;
  gap: 12px;
}
.vpn-groups-list {
  display: grid;
  gap: 12px;
}
.group-admin-card details > summary {
  list-style: none;
  cursor: pointer;
  display: grid;
  grid-template-columns: 28px minmax(0,1fr);
  gap: 10px;
  align-items: center;
}
.group-admin-card details > summary::-webkit-details-marker { display: none; }
.group-admin-card details > summary::before {
  content: "▶";
  color: var(--blue);
}
.group-admin-card details[open] > summary::before { content: "▼"; }
.group-admin-card details > summary > span {
  display: grid;
  gap: 3px;
}
.group-admin-columns {
  display: grid;
  grid-template-columns: repeat(2, minmax(0,1fr));
  gap: 14px;
  margin-top: 14px;
}
.group-check-grid {
  display: grid;
  gap: 8px;
}
.group-check-row {
  border: 1px solid rgba(109,178,255,.18);
  border-radius: 14px;
  background: rgba(255,255,255,.025);
  padding: 10px;
  display: grid;
  grid-template-columns: auto minmax(0,1fr);
  gap: 10px;
  align-items: start;
}
.group-check-row span {
  display: grid;
  gap: 2px;
}
.group-check-row small {
  color: var(--muted);
}
.group-admin-actions {
  display: flex;
  justify-content: flex-end;
  margin-top: 14px;
}
@media (max-width: 980px) {
  .group-admin-columns {
    grid-template-columns: 1fr;
  }
}


/* Matrix group scope */
.perm-actor-policy {
  border: 1px solid rgba(255, 190, 92, .28);
  border-radius: 14px;
  background: rgba(255, 190, 92, .08);
  padding: 10px 12px;
  margin-bottom: 12px;
  font-weight: 800;
  text-align: left;
}


/* Robust matrix renderer */
.permission-matrix-rendered {
  display: grid;
  gap: 12px;
}
.permission-legend {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  align-items: center;
  font-weight: 800;
}
.permission-legend span {
  display: inline-flex;
  gap: 6px;
  align-items: center;
}
.perm-dot {
  width: 22px;
  height: 22px;
  display: inline-grid;
  place-items: center;
  border-radius: 8px;
  border: 1px solid rgba(255,255,255,.24);
  font-size: .85rem;
}
.perm-dot-default {
  background: rgba(255, 190, 92, .22);
  color: #ffd28a;
}
.perm-dot-allow {
  background: rgba(91, 232, 173, .18);
  color: #75f0c0;
}
.perm-dot-deny {
  background: rgba(255, 112, 150, .18);
  color: #ff8faa;
}
.perm-render-debug {
  border: 1px solid rgba(109,178,255,.16);
  border-radius: 12px;
  padding: 8px 10px;
  background: rgba(255,255,255,.025);
  text-align: left;
}
.perm-profile-list,
.perm-profile-body,
.perm-group-body,
.perm-target-body {
  display: grid;
  gap: 10px;
}
.perm-profile-card,
.perm-group-card,
.perm-target-card {
  border: 1px solid rgba(109,178,255,.22);
  border-radius: 16px;
  background: rgba(12, 30, 54, .42);
  overflow: hidden;
}
.perm-profile-card > summary,
.perm-group-card > summary,
.perm-target-card > summary {
  list-style: none;
  cursor: pointer;
  display: grid;
  grid-template-columns: 26px minmax(0,1fr) auto;
  gap: 10px;
  align-items: center;
  padding: 12px;
  text-align: left;
}
.perm-profile-card > summary::-webkit-details-marker,
.perm-group-card > summary::-webkit-details-marker,
.perm-target-card > summary::-webkit-details-marker {
  display: none;
}
.perm-profile-card > summary::before,
.perm-group-card > summary::before,
.perm-target-card > summary::before {
  content: "▶";
  color: var(--blue);
}
.perm-profile-card[open] > summary::before,
.perm-group-card[open] > summary::before,
.perm-target-card[open] > summary::before {
  content: "▼";
}
.perm-profile-card > summary span,
.perm-group-card > summary span,
.perm-target-card > summary span {
  display: grid;
  gap: 2px;
}
.perm-profile-body,
.perm-group-body,
.perm-target-body {
  padding: 12px;
  border-top: 1px solid rgba(109,178,255,.14);
}
.perm-section {
  display: grid;
  gap: 8px;
}
.perm-section h4 {
  margin: 0;
}
.perm-right-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(130px, 1fr));
  gap: 8px;
}
.perm-right-card {
  position: relative;
  border: 1px solid rgba(109,178,255,.22);
  border-radius: 14px;
  background: rgba(255,255,255,.025);
  color: inherit;
  text-align: left;
  padding: 10px 30px 10px 10px;
  min-height: 58px;
  display: grid;
  gap: 2px;
}
.perm-right-title {
  font-weight: 900;
  word-break: break-word;
}
.perm-right-card small {
  color: var(--muted);
}
.perm-help {
  position: absolute;
  right: 8px;
  top: 10px;
  width: 20px;
  height: 20px;
  display: grid;
  place-items: center;
  border-radius: 999px;
  border: 1px solid rgba(109,178,255,.3);
  color: var(--blue);
  font-size: .75rem;
}
.permission-matrix-loading {
  padding: 14px;
}


/* Permission save states */
.perm-right-card {
  cursor: pointer;
  grid-template-columns: auto minmax(0,1fr) auto;
  align-items: start;
}
.perm-right-card:disabled {
  opacity: .62;
  cursor: wait;
}
.perm-state-mark {
  width: 22px;
  height: 22px;
  display: inline-grid;
  place-items: center;
  border-radius: 8px;
  border: 1px solid rgba(255,255,255,.22);
  font-weight: 900;
}
.perm-state-standard {
  border-color: rgba(255,190,92,.45);
  background: rgba(255,190,92,.08);
}
.perm-state-standard .perm-state-mark {
  color: #ffd28a;
  background: rgba(255,190,92,.18);
}
.perm-state-allow {
  border-color: rgba(91,232,173,.45);
  background: rgba(91,232,173,.08);
}
.perm-state-allow .perm-state-mark {
  color: #75f0c0;
  background: rgba(91,232,173,.18);
}
.perm-state-deny {
  border-color: rgba(255,112,150,.48);
  background: rgba(255,112,150,.08);
}
.perm-state-deny .perm-state-mark {
  color: #ff8faa;
  background: rgba(255,112,150,.18);
}
.perm-section h5 {
  margin: 6px 0 2px;
  color: var(--muted);
  font-size: .9rem;
}


/* Permission-Matrix compact layout */
.permission-matrix-root {
  max-width: 100%;
}
.perm-right-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
  gap: 8px;
}
.perm-right-card {
  min-height: 56px;
  padding: 8px 9px;
  border-radius: 12px;
  overflow: hidden;
}
.perm-right-title {
  overflow-wrap: anywhere;
  hyphens: auto;
  line-height: 1.12;
  font-size: .86rem;
}
.perm-help {
  flex-shrink: 0;
}
.perm-profile-card,
.perm-target-card,
.perm-group-card {
  max-width: 100%;
}
@media (min-width: 1200px) {
  .perm-right-grid {
    grid-template-columns: repeat(auto-fit, minmax(170px, 1fr));
  }
}


/* Permission-Matrix readable compact cleanup */
.permission-matrix-card {
  max-width: 1180px;
}

.permission-matrix-collapse-body {
  overflow-x: auto;
}

.permission-matrix-root,
.permission-matrix {
  max-width: 100%;
}

.perm-section,
.perm-profile-card,
.perm-target-card,
.perm-group-card {
  border-radius: 18px;
}

.perm-right-grid,
.permission-right-grid,
.permission-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(145px, 1fr));
  gap: 8px;
  align-items: stretch;
}

.perm-right-card,
.permission-right-card,
.permission-tile {
  min-height: 54px;
  max-width: 100%;
  padding: 8px 9px;
  border-radius: 12px;
  overflow: hidden;
}

.perm-right-title,
.permission-key,
.permission-label {
  display: block;
  max-width: 100%;
  overflow-wrap: anywhere;
  word-break: break-word;
  hyphens: auto;
  line-height: 1.12;
  font-size: .82rem;
}

.permission-matrix-root code,
.permission-matrix code {
  white-space: normal;
  overflow-wrap: anywhere;
}

.perm-help,
.permission-help,
.permission-info {
  flex-shrink: 0;
}

@media (min-width: 1280px) {
  .perm-right-grid,
  .permission-right-grid,
  .permission-grid {
    grid-template-columns: repeat(auto-fit, minmax(165px, 1fr));
  }
}

@media (max-width: 700px) {
  .perm-right-grid,
  .permission-right-grid,
  .permission-grid {
    grid-template-columns: repeat(auto-fit, minmax(130px, 1fr));
  }
}

/* Permission-Matrix Lesbarkeit, Filter, Mobile */
.permission-matrix-toolbar,.permission-filter-bar,.perm-filter-bar{display:flex;flex-wrap:wrap;gap:10px;align-items:center;margin:10px 0 14px}.permission-matrix-toolbar input,.permission-filter-bar input,.perm-filter-bar input{min-width:min(100%,220px)}.permission-state,.perm-state,.permission-toggle,.perm-toggle,.permission-cell button,.perm-right-card button{display:inline-grid;place-items:center;text-align:center}.perm-state-mark,.permission-state .mark,.perm-state .mark,.permission-toggle .mark,.perm-toggle .mark{display:inline-grid;place-items:center;inline-size:22px;block-size:22px;line-height:1;margin-inline:auto}.perm-right-card,.permission-right-card,.permission-tile{display:grid;gap:4px;align-content:start;min-height:64px;padding:9px 10px;border-radius:12px;overflow:hidden}.perm-right-title,.permission-label,.permission-key-label{font-size:.9rem;font-weight:900;line-height:1.12;overflow-wrap:anywhere}.perm-right-key,.permission-key,.permission-technical-key,.perm-technical-key{display:block;margin-top:2px;color:var(--muted);font-size:.72rem;font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;line-height:1.1;overflow-wrap:anywhere}.perm-profile-card[hidden],.perm-group-card[hidden],.perm-target-card[hidden]{display:none!important}.perm-filter-hit{outline:1px solid rgba(121,189,255,.35)}@media(max-width:760px){.permission-matrix-collapse-body{padding:10px}.perm-right-grid,.permission-right-grid,.permission-grid{grid-template-columns:1fr 1fr}.perm-profile-card>summary,.perm-group-card>summary,.perm-target-card>summary{align-items:flex-start;gap:10px}}@media(max-width:470px){.perm-right-grid,.permission-right-grid,.permission-grid{grid-template-columns:1fr}.permission-matrix-toolbar,.permission-filter-bar,.perm-filter-bar{display:grid}}

/* Maintenance cleanup: readable matrix and stable cards */
.permission-matrix-card{max-width:none!important;width:100%}
.permission-matrix-collapse-body{overflow-x:auto!important;padding:16px!important}
.permission-matrix-rendered{min-width:min(100%,980px)}
.perm-right-grid,.permission-right-grid,.permission-grid{
  grid-template-columns:repeat(auto-fill,minmax(220px,1fr))!important;
  gap:10px!important;
}
.perm-right-card,.permission-right-card,.permission-tile{
  display:grid!important;
  grid-template-columns:28px minmax(0,1fr) 24px!important;
  align-items:start!important;
  gap:8px!important;
  min-height:72px!important;
  padding:10px 12px!important;
  text-align:left!important;
}
.perm-right-text{min-width:0;display:grid;gap:3px;align-content:start}
.perm-right-title,.permission-label,.permission-key-label{
  overflow-wrap:normal!important;
  word-break:normal!important;
  hyphens:none!important;
  line-height:1.18!important;
  font-size:.9rem!important;
}
.perm-right-key,.permission-key,.permission-technical-key,.perm-technical-key{
  white-space:nowrap!important;
  overflow:hidden!important;
  text-overflow:ellipsis!important;
  overflow-wrap:normal!important;
  word-break:normal!important;
  max-width:100%;
}
.perm-state-mark,.perm-dot{
  display:inline-grid!important;
  place-items:center!important;
  width:24px!important;
  height:24px!important;
  line-height:1!important;
  text-align:center!important;
  font-weight:900!important;
}
.perm-help,.permission-help,.permission-info{
  position:static!important;
  justify-self:end!important;
  align-self:start!important;
  width:22px!important;
  height:22px!important;
  display:grid!important;
  place-items:center!important;
}
.perm-state-standard.perm-standard-deny .perm-state-mark,
.perm-dot-default.deny{color:#ffcf90;background:rgba(255,190,92,.18);border-color:rgba(255,190,92,.45)}
.perm-state-standard.perm-standard-allow .perm-state-mark,
.perm-dot-default.allow{color:#ffd28a;background:rgba(255,190,92,.18);border-color:rgba(255,190,92,.45)}
.permission-matrix-toolbar label,.permission-filter-bar label,.perm-filter-bar label{display:grid;gap:5px;text-align:left;font-weight:800;color:var(--muted)}
.perm-profile-card>summary,.perm-group-card>summary,.perm-target-card>summary{min-height:48px!important;padding:10px 12px!important}
.perm-profile-body,.perm-group-body,.perm-target-body{padding:12px!important}
@media(max-width:760px){.perm-right-grid,.permission-right-grid,.permission-grid{grid-template-columns:1fr!important}.permission-matrix-rendered{min-width:0}}

/* Integrated profile/group administration compactness */
.profile-admin-card{padding:12px!important;gap:10px!important}
.profile-admin-controls{grid-template-columns:minmax(120px,180px) minmax(120px,180px) minmax(220px,1fr) auto!important;align-items:end!important}
.profile-groups-panel>summary,.group-admin-card details>summary{min-height:42px!important;padding:6px 0!important;display:flex!important;gap:8px!important;align-items:center!important;text-align:left!important}
.profile-groups-panel>summary small{color:var(--muted);font-weight:700;margin-left:6px}
.group-admin-columns{grid-template-columns:repeat(2,minmax(260px,1fr))!important;gap:12px!important;align-items:start!important}
.group-check-grid{grid-template-columns:repeat(auto-fill,minmax(175px,1fr));gap:8px!important}
.group-check-row{min-height:82px;padding:9px!important;align-items:start!important}
.group-check-row input{margin-top:2px}
.group-check-row strong{line-height:1.1}.group-check-row small{line-height:1.15}
@media(max-width:900px){.profile-admin-controls,.group-admin-columns{grid-template-columns:1fr!important}.group-check-grid{grid-template-columns:1fr!important}}

/* Sidebar session badges */
.sidebar-session-row .status-badge{min-width:0!important;padding:6px 10px!important;border-radius:999px!important;font-size:.76rem!important;line-height:1!important;letter-spacing:.04em;box-shadow:0 0 18px rgba(47,255,178,.08)}
.sidebar-session-row .status-connected{border-color:rgba(47,255,178,.55)!important;color:#dbfff2!important;background:rgba(47,255,178,.14)!important}
.sidebar-session-row .status-ready{border-color:rgba(109,178,255,.48)!important;color:#d9efff!important;background:rgba(53,167,255,.12)!important}
.sidebar-session-row .status-normal{border-color:rgba(109,178,255,.34)!important;color:#e7f3ff!important;background:rgba(109,178,255,.09)!important}
.sidebar-session-row .status-disconnected,.sidebar-session-row .status-expired{border-color:rgba(255,112,150,.45)!important;color:#ffd4dc!important;background:rgba(255,112,150,.10)!important}

/* Runtime-free maintenance fixes: compact admin groups, matrix icon centering, old-style sidebar status */
.permission-matrix-rendered{min-width:min(100%,1040px)!important;}
.perm-right-card,.permission-right-card,.permission-tile{
  grid-template-columns:30px minmax(0,1fr) 24px!important;
  align-items:center!important;
  min-height:68px!important;
}
.perm-state-mark,.perm-dot{
  display:grid!important;
  place-items:center!important;
  inline-size:24px!important;
  block-size:24px!important;
  min-inline-size:24px!important;
  min-block-size:24px!important;
  padding:0!important;
  margin:0!important;
  line-height:24px!important;
  font-size:16px!important;
  font-family:system-ui,-apple-system,"Segoe UI",sans-serif!important;
  text-align:center!important;
  align-self:center!important;
  justify-self:center!important;
  border-radius:8px!important;
}
.perm-state-standard.perm-standard-allow .perm-state-mark::before,
.perm-state-standard.perm-standard-deny .perm-state-mark::before{display:none!important;}
.perm-help{align-self:center!important;justify-self:end!important;}
.perm-right-title{overflow-wrap:normal!important;word-break:normal!important;hyphens:none!important;}
.perm-right-key{max-width:100%;white-space:nowrap!important;overflow:hidden!important;text-overflow:ellipsis!important;}

.sidebar-session-row{display:flex!important;align-items:center!important;gap:8px!important;flex-wrap:wrap!important;}
.sidebar-session-row .status-badge,.sidebar-session-row .pill,.sidebar-dev-badge{
  min-width:0!important;
  min-height:30px!important;
  padding:6px 11px!important;
  border-radius:999px!important;
  font-size:.78rem!important;
  line-height:1!important;
  letter-spacing:0!important;
  text-transform:none!important;
  font-weight:900!important;
  box-shadow:0 0 16px rgba(72,186,255,.10), inset 0 0 0 1px rgba(255,255,255,.025)!important;
}
.sidebar-session-row .status-connected{border-color:rgba(65,255,196,.72)!important;color:#e0fff3!important;background:rgba(41,219,168,.18)!important;}
.sidebar-session-row .status-ready{border-color:rgba(255,211,112,.68)!important;color:#fff0c8!important;background:rgba(255,194,83,.15)!important;}
.sidebar-session-row .status-normal{border-color:rgba(111,187,255,.60)!important;color:#e6f4ff!important;background:rgba(67,151,255,.13)!important;}
.sidebar-session-row .status-disconnected{border-color:rgba(170,181,202,.45)!important;color:#d7dfeb!important;background:rgba(130,145,170,.10)!important;}
.sidebar-session-row .status-expired{border-color:rgba(255,102,132,.68)!important;color:#ffd5dd!important;background:rgba(255,88,116,.14)!important;}
.sidebar-dev-badge{border-color:rgba(255,215,120,.58)!important;color:#ffe9b5!important;background:rgba(255,188,70,.12)!important;}

.profile-admin-list{gap:10px!important;}
.profile-admin-card{padding:10px 12px!important;border-radius:16px!important;gap:8px!important;}
.profile-admin-main{align-items:center!important;}
.profile-admin-main strong{font-size:1rem!important;}
.profile-admin-main p{font-size:.82rem!important;margin-top:2px!important;}
.profile-admin-controls{grid-template-columns:minmax(120px,170px) minmax(120px,170px) minmax(200px,1fr) auto!important;gap:8px!important;}
.profile-admin-controls label{font-size:.78rem!important;}
.profile-groups-panel{margin-top:2px!important;}
.profile-groups-panel>summary,.group-admin-card details>summary{
  min-height:34px!important;
  padding:4px 0!important;
  font-size:.92rem!important;
}
.profile-groups-panel>summary small{display:inline!important;font-size:.78rem!important;}
.group-admin-columns{grid-template-columns:repeat(2,minmax(240px,1fr))!important;gap:10px!important;}
.group-admin-columns h3{font-size:.95rem!important;margin:4px 0 6px!important;}
.group-check-grid{grid-template-columns:repeat(auto-fill,minmax(160px,1fr))!important;gap:7px!important;}
.group-check-row{min-height:62px!important;padding:8px!important;align-items:start!important;border-radius:12px!important;}
.group-check-row input,.profile-group-check input{inline-size:18px!important;block-size:18px!important;margin:1px 0 0!important;align-self:start!important;}
.group-check-row strong{font-size:.86rem!important;line-height:1.05!important;}
.group-check-row small{font-size:.74rem!important;line-height:1.08!important;}
.group-admin-actions,.profile-admin-actions{margin-top:8px!important;}
@media(max-width:900px){.profile-admin-controls,.group-admin-columns{grid-template-columns:1fr!important}.group-check-grid{grid-template-columns:1fr!important}}