*,*:before,*:after{box-sizing:border-box;margin:0;padding:0}:root{--color-backgroundPrimary: #0f1117;--color-backgroundSecondary: #131620;--color-backgroundTertiary: #0c0e14;--color-surfacePrimary: #1a1d28;--color-surfaceSecondary: #1e2130;--color-surfaceTertiary: #232738;--color-surfaceHover: rgba(255, 255, 255, .04);--color-borderPrimary: rgba(255, 255, 255, .12);--color-borderSecondary: rgba(255, 255, 255, .08);--color-borderFocus: #5b9cf5;--color-text: #e4e6ed;--color-textSecondary: #a0a4b8;--color-textMuted: #6b7084;--color-accent: #5b9cf5;--color-accentPrimary: #5b9cf5;--color-accentSecondary: #4a87dc;--color-accentHover: #7ab4ff;--color-primary: #5b9cf5;--color-error: #f87171;--color-success: #4ade80;--color-warning: #fbbf24;--color-info: #5b9cf5;--color-shadow: rgba(0, 0, 0, .5);--space-xs: 4px;--space-sm: 8px;--space-md: 12px;--space-lg: 16px;--space-xl: 24px;--radius-sm: 4px;--radius-md: 6px;--radius-lg: 8px}html,body,#app{height:100%;width:100%;background:var(--color-backgroundPrimary);color:var(--color-text);font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif;font-size:14px;line-height:1.5;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}a{color:var(--color-accent);text-decoration:none}a:hover{color:var(--color-accentHover)}button{cursor:pointer;font-family:inherit;font-size:inherit}input,select,textarea{font-family:inherit;font-size:inherit;background:var(--color-backgroundTertiary);color:var(--color-text);border:1px solid var(--color-borderPrimary);border-radius:var(--radius-md);padding:8px 12px;outline:none;transition:border-color .15s ease}input:focus,select:focus,textarea:focus{border-color:var(--color-borderFocus);box-shadow:0 0 0 2px #5b9cf526}input::placeholder,textarea::placeholder{color:var(--color-textMuted)}select{-moz-appearance:none;appearance:none;-webkit-appearance:none;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 12 12'%3E%3Cpath fill='%236b7084' d='M2.5 4.5L6 8l3.5-3.5'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 10px center;background-size:12px;padding-right:32px;cursor:pointer}select option{background:var(--color-surfacePrimary);color:var(--color-text);padding:8px}input[type=checkbox]{width:16px;height:16px;accent-color:var(--color-accent);cursor:pointer;border-radius:var(--radius-sm)}.toggle-label{display:flex;align-items:center;gap:8px;cursor:pointer}.toggle-label input[type=checkbox]{width:16px;height:16px;cursor:pointer}::-webkit-scrollbar{width:8px;height:8px}::-webkit-scrollbar-track{background:transparent}::-webkit-scrollbar-thumb{background:#ffffff1a;border-radius:4px}::-webkit-scrollbar-thumb:hover{background:#ffffff2e}.page-container{padding:var(--space-xl)}.page-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:var(--space-xl)}.page-header h1{margin:0;font-size:1.5rem;font-weight:600;color:var(--color-text)}.page-header .btn-primary,.page-header .btn-secondary{min-width:180px;text-align:center}.btn-primary,.btn-secondary,.btn-danger,.btn-warning,.action-btn{display:inline-flex;align-items:center;justify-content:center;gap:6px;padding:7px 16px;font-size:.8125rem;font-weight:500;line-height:1.4;border:1px solid transparent;border-radius:var(--radius-md);cursor:pointer;transition:background .15s ease,border-color .15s ease,opacity .15s ease;white-space:nowrap}.btn-primary{background:var(--color-accent);color:#fff;border-color:var(--color-accent)}.btn-primary:hover:not(:disabled){background:var(--color-accentHover);border-color:var(--color-accentHover)}.btn-secondary{background:var(--color-surfaceSecondary);color:var(--color-text);border-color:var(--color-borderPrimary)}.btn-secondary:hover:not(:disabled){background:var(--color-surfaceTertiary);border-color:var(--color-borderPrimary)}.btn-danger{background:#ef444426;color:var(--color-error);border-color:#ef44444d}.btn-danger:hover:not(:disabled){background:#ef444440;border-color:#ef444480}.btn-warning{background:#f59e0b26;color:#f59e0b;border-color:#f59e0b4d}.btn-warning:hover:not(:disabled){background:#f59e0b40;border-color:#f59e0b80}.btn-primary:disabled,.btn-secondary:disabled,.btn-danger:disabled,.btn-warning:disabled{opacity:.5;cursor:not-allowed}.btn-sm{padding:4px 10px;font-size:.75rem}.btn-link{background:none;border:none;color:var(--color-accent);cursor:pointer;padding:0;font-weight:500;font-size:.8125rem;margin-right:12px}.btn-link:hover{color:var(--color-accentHover)}.btn-link-danger{color:var(--color-error)}.btn-link-danger:hover{color:#fca5a5}.filters-bar{display:flex;gap:12px;margin-bottom:var(--space-xl);flex-wrap:wrap;align-items:flex-end}.filters-bar input,.filters-bar select{padding:7px 12px;font-size:.8125rem;background:var(--color-surfacePrimary);border:1px solid var(--color-borderPrimary);border-radius:var(--radius-md)}.filters-bar input,.filters-bar .search-input,.filters-panel .search-input{flex:1;min-width:200px}.filters-panel{display:flex;gap:16px;margin-bottom:var(--space-xl);padding:12px 16px;background:var(--color-surfacePrimary);border:1px solid var(--color-borderSecondary);border-radius:var(--radius-lg);flex-wrap:wrap;align-items:flex-end}.filter-group{display:flex;flex-direction:column;gap:4px;min-width:150px}.filter-group label{font-weight:500;color:var(--color-textSecondary);font-size:.75rem;text-transform:uppercase;letter-spacing:.03em}.filter-group input,.filter-group select{padding:7px 12px;font-size:.8125rem;background:var(--color-surfaceSecondary);border:1px solid var(--color-borderPrimary);border-radius:var(--radius-md)}.table-wrapper{overflow-x:auto;border:1px solid var(--color-borderPrimary);border-radius:var(--radius-lg)}.data-table{width:100%;border-collapse:collapse;font-size:.8125rem;background:var(--color-surfacePrimary)}.data-table thead{background:var(--color-surfaceSecondary)}.data-table th{padding:10px 16px;text-align:left;font-size:.6875rem;font-weight:600;color:var(--color-textSecondary);text-transform:uppercase;letter-spacing:.05em;border-bottom:1px solid var(--color-borderPrimary)}.data-table th.sortable{cursor:pointer;-webkit-user-select:none;user-select:none;transition:color .15s ease}.data-table th.sortable:hover{color:var(--color-text)}.data-table td{padding:10px 16px;border-bottom:1px solid var(--color-borderSecondary);color:var(--color-text)}.data-table tbody tr:hover{background:var(--color-surfaceHover)}.data-table .actions-cell{display:flex;gap:6px;justify-content:flex-end}.data-table .text-right{text-align:right}.data-table .text-center{text-align:center}.data-table .text-muted{color:var(--color-textMuted)}.data-table .monospace{font-family:SFMono-Regular,Consolas,Courier New,monospace;font-size:.75rem;color:var(--color-textSecondary)}.data-table .date-col{color:var(--color-textSecondary);font-size:.8125rem;white-space:nowrap}.badge{display:inline-flex;align-items:center;padding:2px 8px;border-radius:10px;font-size:.6875rem;font-weight:500;line-height:1.4;white-space:nowrap}.badge-success,.badge-active{background:#4ade801f;color:#4ade80}.badge-error,.badge-revoked,.badge-terminated,.badge-cancelled{background:#f871711f;color:#f87171}.badge-warning,.badge-expired{background:#fbbf241f;color:#fbbf24}.badge-info,.badge-updated{background:#5b9cf51f;color:#5b9cf5}.badge-default,.badge-inactive{background:#6b72801f;color:#9ca3af}.badge-created{background:#4ade801f;color:#4ade80}.badge-used{background:#a855f71f;color:#a855f7}.role-user{background:#5b9cf526;color:#5b9cf5}.role-org_admin{background:#a855f726;color:#a855f7}.role-system_admin{background:#f8717126;color:#f87171}.domain-badge{display:inline-block;padding:2px 8px;font-size:.75rem;background:var(--color-surfaceSecondary);color:var(--color-text);border-radius:var(--radius-sm);font-family:SFMono-Regular,Consolas,Courier New,monospace}.pagination{display:flex;justify-content:center;align-items:center;gap:12px;padding:16px 0}.pagination .page-info,.pagination-info{color:var(--color-textMuted);font-size:.8125rem}.loading-state,.error-state,.empty-state{padding:48px 24px;text-align:center;color:var(--color-textMuted);font-size:.875rem}.spinner{width:32px;height:32px;border:2px solid var(--color-borderSecondary);border-top-color:var(--color-accent);border-radius:50%;animation:spin .8s linear infinite;margin:0 auto 12px}@keyframes spin{to{transform:rotate(360deg)}}.modal-overlay{position:fixed;top:0;left:0;right:0;bottom:0;background:#0009;display:flex;align-items:center;justify-content:center;z-index:1000;animation:fadeIn .15s ease}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}.modal-dialog{background:var(--color-surfacePrimary);border:1px solid var(--color-borderPrimary);border-radius:var(--radius-lg);box-shadow:0 16px 48px #0006;max-width:520px;width:90%;max-height:90vh;overflow-y:auto;animation:slideUp .2s ease}.modal-dialog.modal-lg{max-width:700px}@keyframes slideUp{0%{transform:translateY(12px);opacity:0}to{transform:translateY(0);opacity:1}}.modal-header{display:flex;justify-content:space-between;align-items:center;padding:16px 20px;border-bottom:1px solid var(--color-borderSecondary)}.modal-header h2{margin:0;font-size:1.1rem;font-weight:600;color:var(--color-text)}.modal-close{background:none;border:none;font-size:1.25rem;color:var(--color-textMuted);cursor:pointer;padding:4px;line-height:1}.modal-close:hover{color:var(--color-text)}.modal-body{padding:20px}.modal-footer{display:flex;gap:8px;justify-content:flex-end;padding:16px 20px;border-top:1px solid var(--color-borderSecondary)}.form-group{margin-bottom:16px}.form-label{display:block;margin-bottom:4px;font-weight:500;color:var(--color-textSecondary);font-size:.8125rem}.form-row{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:12px}.form-section{margin-bottom:24px}.form-section h3{margin:0 0 12px;font-size:.8125rem;font-weight:600;color:var(--color-textSecondary);text-transform:uppercase;letter-spacing:.05em}.form-input,.text-input{width:100%;padding:8px 12px;border:1px solid var(--color-borderPrimary);border-radius:var(--radius-md);background:var(--color-surfaceSecondary);color:var(--color-text);font-size:.8125rem}.form-input:focus,.text-input:focus{border-color:var(--color-borderFocus);box-shadow:0 0 0 2px #5b9cf526}.select-input{padding:8px 12px;border:1px solid var(--color-borderPrimary);border-radius:var(--radius-md);background:var(--color-surfaceSecondary);color:var(--color-text);font-size:.8125rem;min-width:160px}.textarea-input{width:100%;padding:8px 12px;border:1px solid var(--color-borderPrimary);border-radius:var(--radius-md);background:var(--color-surfaceSecondary);color:var(--color-text);font-family:inherit;font-size:.8125rem;resize:vertical}.checkbox-group{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:8px}.checkbox-label{display:flex;align-items:center;gap:8px;font-weight:400;color:var(--color-text);cursor:pointer;-webkit-user-select:none;user-select:none;font-size:.8125rem}.tabs-section{background:var(--color-surfacePrimary);border:1px solid var(--color-borderPrimary);border-radius:var(--radius-lg);overflow:hidden}.tab-nav{display:flex;border-bottom:1px solid var(--color-borderPrimary);background:var(--color-surfaceSecondary)}.tab-button{flex:1;padding:10px 16px;border:none;background:none;color:var(--color-textMuted);font-weight:500;font-size:.8125rem;cursor:pointer;transition:color .15s ease;border-bottom:2px solid transparent;margin-bottom:-1px}.tab-button:hover{color:var(--color-text)}.tab-button.active{color:var(--color-accent);border-bottom-color:var(--color-accent)}.tab-content{padding:20px}.json-editor{width:100%;min-height:360px;padding:12px;font-family:SFMono-Regular,Consolas,Courier New,monospace;font-size:12px;background:var(--color-surfaceSecondary);color:var(--color-text);border:1px solid var(--color-borderPrimary);border-radius:var(--radius-md);resize:vertical;margin-bottom:12px;-moz-tab-size:2;tab-size:2}.json-editor:focus{border-color:var(--color-borderFocus);box-shadow:0 0 0 2px #5b9cf526}.info-box{padding:12px 16px;background:#5b9cf514;border-left:3px solid var(--color-accent);border-radius:var(--radius-sm);color:var(--color-textSecondary);font-size:.8125rem;margin-bottom:16px}.search-input-wrapper{position:relative}.dropdown-list{position:absolute;top:100%;left:0;right:0;background:var(--color-surfacePrimary);border:1px solid var(--color-borderPrimary);border-top:none;border-radius:0 0 var(--radius-md) var(--radius-md);max-height:200px;overflow-y:auto;z-index:100;box-shadow:0 4px 12px #0000004d}.dropdown-item{padding:8px 12px;cursor:pointer;color:var(--color-text);font-size:.8125rem}.dropdown-item:hover{background:var(--color-surfaceSecondary)}.selected-item{margin-top:4px;font-size:.75rem;color:var(--color-textSecondary)}.text-muted{color:var(--color-textMuted)}
