.roles-perms-summary{color:#aeb8c4;font-size:.92rem;white-space:nowrap;padding:.65rem .75rem;text-align:center;background:#ffffff08;border-radius:6px}.roles-main{padding-bottom:2rem}.roles-hero{display:flex;flex-wrap:wrap;align-items:flex-start;justify-content:space-between;gap:1.25rem 1.5rem;margin-bottom:1.5rem;padding:1.35rem 1.5rem;border-radius:12px;background:linear-gradient(145deg,#1a1f28f2,#12151cfa);border:1px solid rgba(57,255,20,.12);box-shadow:0 8px 32px #00000059}.roles-hero-text{flex:1;min-width:min(100%,18rem)}.roles-title{margin:0 0 .5rem;font-size:1.65rem;font-weight:700;letter-spacing:-.02em;color:#fff;display:flex;align-items:center;gap:.55rem}.roles-title i{color:var(--qtag-green, #39ff14);font-size:1.35em;opacity:.95}.roles-subtitle{margin:0 0 1rem;color:#aeb8c4;font-size:1.05rem;line-height:1.55;max-width:42rem}.roles-meta{display:flex;flex-wrap:wrap;gap:.65rem 1rem;align-items:center}.roles-meta-item{display:inline-flex;align-items:center;gap:.4rem;font-size:.92rem;color:#8b96a8;padding:.35rem .65rem;border-radius:8px;background:#00000040;border:1px solid rgba(255,255,255,.06)}.roles-meta-item i{color:var(--qtag-green, #39ff14);opacity:.85;font-size:.9rem}.roles-meta-note{border-color:#39ff1414}.roles-add-open-btn{flex-shrink:0;align-self:center;padding:.6rem 1.15rem;font-size:1rem;font-weight:600;border-radius:8px;box-shadow:0 2px 12px #39ff1426}.roles-error-banner{margin-bottom:1rem;padding:.85rem 1.1rem;border-radius:10px;border:1px solid rgba(255,107,107,.35);background:#ff475714;color:#ff8a8a;font-size:1rem;line-height:1.45;border-left:4px solid #ff6b6b}.roles-matrix-section{margin-bottom:1.5rem}.roles-section-head{display:flex;flex-wrap:wrap;align-items:baseline;justify-content:space-between;gap:.5rem 1rem;margin-bottom:.75rem}.roles-section-title{margin:0;font-size:.88rem;font-weight:600;text-transform:uppercase;letter-spacing:.08em;color:var(--qtag-green, #39ff14)}.roles-scroll-hint{margin:0;color:#6b7684;font-size:.88rem;line-height:1.35;display:none;align-items:center;gap:.35rem}.roles-scroll-hint i{opacity:.8}@media (max-width: 1100px){.roles-scroll-hint{display:flex}}.roles-table-wrap{--roles-name-col-width: clamp(8.75rem, 14vw, 11rem);--roles-perm-col-width: clamp(5.25rem, 6.6vw, 6.4rem);--roles-side-col-width: clamp(4.25rem, 6vw, 5rem);--roles-cell-pad-y: clamp(.18rem, .45vw, .28rem);--roles-cell-pad-x: clamp(.14rem, .4vw, .26rem);--roles-perm-pad-x: clamp(.08rem, .3vw, .18rem);position:relative;min-width:0;width:100%;max-width:100%;overflow-x:auto;overflow-y:visible;-webkit-overflow-scrolling:touch;overscroll-behavior-x:contain;border-radius:12px;border:1px solid rgba(57,255,20,.1);background:linear-gradient(180deg,#151922,#12151c);box-shadow:inset 0 1px #ffffff08;scrollbar-width:thin;scrollbar-color:var(--qtag-green, #39ff14) #222}.roles-table-wrap::-webkit-scrollbar{width:8px;height:8px}.roles-table-wrap::-webkit-scrollbar-track{background:#222;border-radius:4px}.roles-table-wrap::-webkit-scrollbar-thumb{background:var(--qtag-green, #39ff14);border-radius:4px}.roles-loading{display:flex;align-items:center;justify-content:center;gap:.75rem;min-height:12rem;color:#8b96a8;font-size:.95rem;padding:2rem}.roles-loading-spinner{width:1.35rem;height:1.35rem;border:2px solid rgba(57,255,20,.2);border-top-color:var(--qtag-green, #39ff14);border-radius:50%;animation:roles-spin .7s linear infinite}@keyframes roles-spin{to{transform:rotate(360deg)}}.roles-matrix{width:100%;min-width:0;max-width:100%;table-layout:fixed;border-collapse:separate;border-spacing:0;font-size:.95rem;color:#e8ecf1}.roles-matrix th,.roles-matrix td{padding:var(--roles-cell-pad-y) var(--roles-cell-pad-x);text-align:center;border-bottom:1px solid rgba(42,47,56,.85);vertical-align:middle}.roles-matrix tbody tr.roles-row-super-admin-readonly td:first-child{box-shadow:inset 3px 0 #39ff1466,4px 0 12px #00000059}.roles-matrix tbody tr:nth-child(2n) td{background:#0000001f}.roles-matrix th:first-child,.roles-matrix td:first-child{text-align:left;position:sticky;left:0;width:var(--roles-name-col-width);min-width:var(--roles-name-col-width);max-width:var(--roles-name-col-width);box-shadow:4px 0 12px #00000059}.roles-matrix thead th:first-child{z-index:3;background:#1e242e!important;font-size:.95rem;white-space:nowrap;border-bottom:2px solid rgba(57,255,20,.25)}.roles-matrix tbody td:first-child{z-index:2;background:#12151c}.roles-matrix tbody tr:nth-child(2n) td:first-child{background:#10141a}.roles-matrix thead th{background:#1e242e;color:#7dffb3;font-weight:600;font-size:.86rem;line-height:1.25;vertical-align:bottom;border-bottom:2px solid rgba(57,255,20,.2)}.roles-matrix thead th:not(:first-child):not(.roles-actions-col):not(.roles-status-col){white-space:normal;word-break:normal;overflow-wrap:normal;hyphens:none;text-wrap:balance;width:var(--roles-perm-col-width);min-width:0;max-width:none;padding-left:var(--roles-perm-pad-x);padding-right:var(--roles-perm-pad-x);font-size:.86rem;line-height:1.22}.roles-matrix td.roles-perm-td{padding-left:var(--roles-perm-pad-x);padding-right:var(--roles-perm-pad-x)}.roles-matrix tbody td:not(:first-child):not(.roles-actions-col):not(.roles-status-col){white-space:normal;min-width:0}.roles-status-col{width:var(--roles-side-col-width);white-space:normal;min-width:0;text-align:center;vertical-align:middle}.roles-status-badge{display:inline-block;font-size:.78rem;font-weight:700;text-transform:uppercase;letter-spacing:.04em;padding:.22rem .38rem;border-radius:6px;border:1px solid transparent}.roles-status-badge--active{color:#9effb8;background:#39ff141f;border-color:#39ff1438}.roles-status-badge--inactive{color:#c5ccd6;background:#ffffff0f;border-color:#ffffff14}.roles-actions-col{width:var(--roles-side-col-width);white-space:nowrap;min-width:0;text-align:center;vertical-align:middle}.roles-matrix .action-buttons{display:flex;gap:4px;align-items:center;justify-content:center;flex-wrap:nowrap}.roles-matrix .action-btn{width:30px;height:30px;padding:0;border:none;border-radius:4px;background:#333;color:#fff;cursor:pointer;display:inline-flex;align-items:center;justify-content:center;transition:all .2s ease;font-size:.82rem;flex-shrink:0}.roles-matrix .action-btn:not(.roles-role-active-toggle):hover{background:#444;transform:translateY(-1px)}.roles-matrix .action-btn.roles-save-btn:hover{background:#2ecc71}.roles-matrix .action-btn.roles-role-active-toggle{border:1px solid #444;border-radius:6px;transition:background .2s ease,border-color .2s ease,color .2s ease,transform .15s ease,opacity .2s ease}.roles-matrix .action-btn.roles-role-active-toggle--role-active{border-color:#39ff147a;background:#39ff141f;color:var(--qtag-green, #39ff14);box-shadow:inset 0 0 0 1px #39ff140f}.roles-matrix .action-btn.roles-role-active-toggle--role-active:hover:not(:disabled){background:#f5a62338;border-color:#f5a623a6;color:#ffe08a}.roles-matrix .action-btn.roles-role-active-toggle--has-active-users{border-color:#f39c12;background:linear-gradient(180deg,#f5a623,#e67e22);color:#1a1208;box-shadow:inset 0 1px #ffffff40,0 0 0 1px #f39c1273,0 2px 8px #e67e2273}.roles-matrix .action-btn.roles-role-active-toggle--has-active-users i{color:#1a1208}.roles-matrix .action-btn.roles-role-active-toggle--has-active-users:hover:not(:disabled){background:linear-gradient(180deg,#ffc966,#f39c12);border-color:#ffe08a;color:#1a1208;transform:translateY(-1px)}.roles-matrix .action-btn.roles-role-active-toggle--has-active-users:focus-visible{outline:2px solid #ffe08a;outline-offset:2px}.roles-matrix .action-btn.roles-role-active-toggle--role-inactive{border-color:#e74c3c8c;background:#c0392b33;color:#ff8a80;box-shadow:inset 0 0 0 1px #e74c3c14}.roles-matrix .action-btn.roles-role-active-toggle--role-inactive:hover:not(:disabled){background:#27ae606b;border-color:#27ae60;color:#fff}.roles-matrix .action-btn.roles-role-active-toggle:focus-visible{outline:2px solid var(--qtag-green, #39ff14);outline-offset:2px}.roles-matrix .action-btn.roles-role-active-toggle--role-inactive:focus-visible{outline-color:#ff8a80f2}.roles-matrix .action-btn:disabled,.roles-matrix .action-btn[disabled]{opacity:.42;cursor:not-allowed;transform:none}.roles-matrix .action-btn:disabled:hover,.roles-matrix .action-btn[disabled]:hover{background:#333;transform:none}.roles-matrix .action-btn.roles-role-active-toggle:disabled:hover,.roles-matrix .action-btn.roles-role-active-toggle[disabled]:hover{background:#2a2a2a;border-color:#444;color:#8b96a8;box-shadow:none}.roles-row-inactive td:not(:first-child):not(.roles-status-col):not(.roles-actions-col){opacity:.72}.roles-row-inactive .roles-name-input{opacity:1}.roles-matrix tbody tr:hover td{background:#39ff140f}.roles-matrix tbody tr:hover td:first-child{background:#181e27}.roles-matrix tbody tr:nth-child(2n):hover td:first-child{background:#161c24}.roles-matrix tbody tr:hover td:first-child .roles-name-input{background:#0d0f14}.roles-name-cell{font-weight:600}.roles-name-readonly{display:inline-block;color:#e8ecf1;font-weight:600;font-size:1rem;line-height:1.4}.roles-name-readonly--system{color:#c8ffd8;font-size:1.02rem;letter-spacing:.02em}.roles-matrix tbody tr:hover td:first-child .roles-name-readonly{color:#f0f4f8}.roles-matrix tbody tr:hover td:first-child .roles-name-readonly--system{color:#d8ffe4}.roles-badge{display:inline-block;font-size:.72rem;padding:.2rem .45rem;border-radius:6px;margin-left:.4rem;vertical-align:middle;text-transform:uppercase;letter-spacing:.04em;font-weight:700}.roles-badge-org{background:#39ff1424;color:#9effb8;border:1px solid rgba(57,255,20,.2)}.roles-badge-shared{background:#a0a0a01a;color:#aeb8c4;border:1px solid rgba(255,255,255,.06)}.roles-perm-cell{display:inline-flex;align-items:center;justify-content:center;margin:0;cursor:default}.roles-perm-cb{width:1rem;height:1rem;min-width:1rem;min-height:1rem;margin:0;border-radius:4px;border:2px solid #5a6570;background:#0d0f14;accent-color:#39ff14;appearance:auto;-webkit-appearance:auto;flex-shrink:0}.roles-perm-cb:disabled{cursor:default;opacity:1;border-color:#6b7684}.roles-perm-cb:checked:disabled{border-color:#39ff14}.roles-matrix input[type=checkbox]:not(.roles-perm-cb){width:1.1rem;height:1.1rem;accent-color:#39ff14}.roles-matrix input[type=checkbox]:not(.roles-perm-cb):disabled{cursor:default;opacity:.85}.roles-matrix input[type=checkbox]:not(.roles-perm-cb):not(:disabled){cursor:pointer}.roles-name-input{width:100%;max-width:100%;padding:.4rem .55rem;border-radius:8px;border:1px solid rgba(57,255,20,.15);background:#0d0f14;color:#fff;font-size:.95rem;font-weight:600;margin-right:.35rem;vertical-align:middle;transition:border-color .15s,box-shadow .15s}.roles-name-input:focus{outline:none;border-color:#39ff1473;box-shadow:0 0 0 2px #39ff141f}.roles-readonly-dash{color:#4a5568;font-size:1.1rem;user-select:none}.roles-modal{position:fixed;inset:0;z-index:10050;display:flex;align-items:center;justify-content:center;padding:max(1rem,env(safe-area-inset-top)) max(1rem,env(safe-area-inset-right)) max(1rem,env(safe-area-inset-bottom)) max(1rem,env(safe-area-inset-left));box-sizing:border-box}.roles-modal[hidden]{display:none}.roles-modal-backdrop{position:absolute;inset:0;background:#000000b8;backdrop-filter:blur(4px);-webkit-backdrop-filter:blur(4px);border:none;padding:0;margin:0;cursor:pointer}.roles-modal-box{position:relative;z-index:1;width:min(52rem,100%);max-height:min(92vh,52rem);display:flex;flex-direction:column;min-height:0;filter:drop-shadow(0 20px 50px rgba(0,0,0,.55))}.roles-add-panel{display:flex;flex-direction:column;min-height:0;max-height:min(92vh,52rem);margin:0;padding:0;border-radius:12px;border:1px solid rgba(57,255,20,.18);background:linear-gradient(165deg,#1a1f28,#141820);box-sizing:border-box;overflow:hidden;box-shadow:0 12px 40px #0006}.roles-add-panel-head{display:flex;align-items:flex-start;justify-content:space-between;gap:.75rem 1rem;padding:1.1rem 1rem .85rem 1.25rem;border-bottom:1px solid rgba(255,255,255,.06);background:#39ff140a;flex-shrink:0}.roles-modal-title-block{min-width:0;flex:1}.roles-modal-close{flex-shrink:0;width:2.25rem;height:2.25rem;display:flex;align-items:center;justify-content:center;margin-top:-.15rem;margin-right:-.15rem;border:1px solid rgba(255,255,255,.12);border-radius:8px;background:#00000040;color:#aeb8c4;font-size:1rem;cursor:pointer;transition:background .15s,color .15s,border-color .15s}.roles-modal-close:hover{background:#ff47571f;border-color:#ff6b6b59;color:#ff8a8a}.roles-modal-body{flex:1;min-height:0;overflow-y:auto;overflow-x:hidden;scrollbar-width:thin;scrollbar-color:var(--qtag-green, #39ff14) #222}body.roles-modal-open{overflow:hidden}.roles-disable-block-modal .roles-disable-block-panel{border-color:#ff6b6b38}.roles-disable-block-title{color:#ffb4b4}.roles-disable-block-title i{color:#ff6b6b}.roles-disable-block-body{padding:1rem 1.25rem .5rem}.roles-disable-block-role{margin:0 0 1rem;font-size:1rem;font-weight:600;color:#e8ecf1}.roles-disable-block-sections{display:flex;flex-direction:column;gap:1rem}.roles-disable-block-section-title{margin:0 0 .5rem;font-size:.85rem;font-weight:600;letter-spacing:.03em;text-transform:uppercase;color:#9aa5b4}.roles-disable-block-user-list{margin:0;padding:0;list-style:none;display:flex;flex-direction:column;gap:.45rem}.roles-disable-block-user-item{display:flex;align-items:center;justify-content:space-between;gap:.75rem;padding:.55rem .75rem;border-radius:8px;background:#00000038;border:1px solid rgba(255,255,255,.06)}.roles-disable-block-user-meta{min-width:0;flex:1}.roles-disable-block-user-name{display:block;font-size:.95rem;font-weight:500;color:#e8ecf1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.roles-disable-block-user-email{display:block;font-size:.82rem;color:#9aa5b4;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.roles-disable-block-user-badge{flex-shrink:0;font-size:.72rem;font-weight:600;letter-spacing:.04em;text-transform:uppercase;padding:.2rem .45rem;border-radius:999px;border:1px solid transparent}.roles-disable-block-user-badge--active{color:#39ff14;background:#39ff141a;border-color:#39ff1440}.roles-disable-block-user-badge--inactive{color:#ffb4b4;background:#ff6b6b1a;border-color:#ff6b6b40}.roles-disable-block-footnote{margin:1.1rem 0 0;font-size:.92rem;line-height:1.5;color:#aeb8c4}.roles-disable-block-link{color:var(--qtag-green, #39ff14);text-decoration:underline;text-underline-offset:2px}.roles-disable-block-link:hover{color:#7dff5c}.roles-disable-block-userlist-btn{text-decoration:none;display:inline-flex;align-items:center;gap:.4rem}.roles-add-panel-title{margin:0 0 .4rem;font-size:1.2rem;font-weight:600;color:#fff;display:flex;align-items:center;gap:.5rem}.roles-add-panel-title i{color:var(--qtag-green, #39ff14)}.roles-add-panel-lead{margin:0;font-size:.95rem;color:#8b96a8;line-height:1.5;max-width:40rem}.roles-field-label{display:block;color:#cfd6df;font-size:.92rem;font-weight:500;margin:1rem 1.25rem .35rem}.roles-field-input{display:block;width:calc(100% - 2.5rem);max-width:100%;margin:0 1.25rem .75rem;box-sizing:border-box;padding:.6rem .75rem;border-radius:8px;border:1px solid #444;background:#0d0f14;color:#fff;font-size:1rem;transition:border-color .15s,box-shadow .15s}.roles-field-input:focus{outline:none;border-color:#39ff1466;box-shadow:0 0 0 2px #39ff141a}.roles-perms-legend{margin:.5rem 1.25rem .35rem;font-size:.82rem;font-weight:600;text-transform:uppercase;letter-spacing:.07em;color:var(--qtag-green, #39ff14)}.roles-new-perms{display:grid;grid-template-columns:repeat(auto-fill,minmax(15rem,1fr));gap:.45rem .85rem;margin:0 1.25rem 1rem;max-height:min(16rem,38vh);overflow-y:auto;padding:.65rem .85rem;border-radius:8px;background:#0003;border:1px solid rgba(255,255,255,.05);scrollbar-width:thin;scrollbar-color:var(--qtag-green, #39ff14) #222}.roles-add-perm{display:flex;align-items:flex-start;gap:.5rem;color:#aeb8c4;font-size:.88rem;line-height:1.35;cursor:pointer;margin:0}.roles-add-perm input[type=checkbox]{flex-shrink:0;width:1rem;height:1rem;margin-top:.1rem;accent-color:#39ff14;cursor:pointer}.roles-add-perm span{word-break:break-word}.roles-add-actions{display:flex;gap:.65rem;flex-wrap:wrap;padding:1rem 1.25rem 1.15rem;border-top:1px solid rgba(255,255,255,.06);background:#00000026;flex-shrink:0}.btn-secondary-roles{padding:.5rem 1rem;border-radius:8px;border:1px solid #4a5568;background:transparent;color:#cfd6df;font-size:.95rem;font-weight:500;cursor:pointer;transition:background .15s,border-color .15s,color .15s}.btn-secondary-roles:hover{background:#ffffff0f;border-color:#6b7684;color:#fff}.roles-empty{display:none;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding:3rem 1.5rem;min-height:14rem;color:#8b96a8}.roles-empty.is-visible{display:flex}.roles-empty-icon{width:3.5rem;height:3.5rem;border-radius:50%;background:#39ff1414;border:1px solid rgba(57,255,20,.15);display:flex;align-items:center;justify-content:center;margin-bottom:1rem;color:var(--qtag-green, #39ff14);font-size:1.5rem}.roles-empty-title{margin:0 0 .5rem;font-size:1.2rem;font-weight:600;color:#e8ecf1}.roles-empty-text{margin:0;font-size:1rem;line-height:1.55;max-width:26rem}.roles-empty-text strong{color:#cfd6df}.cs-toast{position:fixed;bottom:28px;left:50%;transform:translate(-50%) translateY(20px);max-width:min(420px,calc(100vw - 32px));padding:14px 20px;border-radius:12px;font-size:.95rem;line-height:1.45;z-index:10160;opacity:0;pointer-events:none;transition:opacity .25s ease,transform .25s ease;box-shadow:0 12px 40px #00000080;border:1px solid rgba(255,255,255,.08);background:#1a1d24;color:#e8ecf1}.cs-toast.cs-toast--show{opacity:1;transform:translate(-50%) translateY(0)}.cs-toast.cs-toast--success{border-color:#39ff1459;box-shadow:0 12px 40px #00000080,0 0 0 1px #39ff141f inset}.cs-toast.cs-toast--error{border-color:#e05a5a73;color:#ffc9c9}