.perm-groups {
    display: grid;
    gap: 18px;
}

.perm-group {
    margin: 0;
    padding: 16px;
    border: 1px solid var(--border, #e2e6ee);
    border-radius: var(--radius-md, 10px);
    background: var(--surface, #fff);
}

.perm-group legend {
    padding: 0 8px;
    font-weight: 600;
    color: var(--ink-700, #263043);
}

.perm-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
    gap: 10px;
}

.perm-item {
    display: flex;
    align-items: flex-start;
    gap: 10px;
    padding: 10px 12px;
    border: 1px solid var(--border, #e2e6ee);
    border-radius: var(--radius-sm, 7px);
    background: var(--surface, #fff);
}

.perm-item.is-admin-only {
    opacity: .62;
}

.perm-item input[type="checkbox"] {
    margin-top: 3px;
    accent-color: var(--accent, #2456d6);
}

.perm-copy {
    display: flex;
    flex-direction: column;
    gap: 2px;
    min-width: 0;
}

.perm-copy strong {
    font-size: 13px;
    color: var(--ink-800, #1d2636);
}

.perm-copy small {
    font-size: 11px;
    color: var(--ink-500, #6b7280);
    line-height: 1.35;
}

.perm-copy code {
    font-size: 10px;
    color: var(--ink-400, #8a93a3);
}

.perm-matrix-wrap {
    overflow: auto;
    max-height: 70vh;
}

.perm-matrix {
    min-width: 900px;
}

.perm-matrix th,
.perm-matrix td {
    vertical-align: middle;
}

.perm-matrix-perm {
    position: sticky;
    left: 0;
    z-index: 1;
    min-width: 280px;
    background: var(--surface, #fff);
    text-align: left;
}

.perm-matrix thead .perm-matrix-perm {
    z-index: 2;
}

.perm-matrix-perm strong {
    display: block;
    font-size: 12px;
    color: var(--ink-800, #1d2636);
}

.perm-matrix-perm code {
    font-size: 10px;
    color: var(--ink-400, #8a93a3);
}

.perm-matrix-user {
    min-width: 120px;
    text-align: center;
    white-space: nowrap;
}

.perm-matrix-cell {
    text-align: center;
}

.perm-matrix-cell input[type="checkbox"] {
    width: 16px;
    height: 16px;
    accent-color: var(--accent, #2456d6);
}

.perm-matrix-group td {
    background: var(--surface-alt, #f6f7fa);
    font-weight: 600;
    color: var(--ink-700, #263043);
}

.perm-matrix .is-admin-only {
    opacity: .62;
}

.perm-admin-mark {
    color: var(--ink-400, #8a93a3);
}