@import"https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700&display=swap";:root{--color-primary: #2563eb;--color-primary-hover: #1d4ed8;--color-primary-light: #eff6ff;--color-bg-base: #f8fafc;--color-bg-surface: #ffffff;--color-bg-surface-elevated: #ffffff;--color-bg-overlay: rgba(15, 23, 42, .4);--color-text-main: #0f172a;--color-text-muted: #64748b;--color-text-inverse: #ffffff;--color-border: #e2e8f0;--color-border-hover: #cbd5e1;--color-success: #10b981;--color-success-bg: #ecfdf5;--color-error: #ef4444;--color-error-bg: #fef2f2;--color-warning: #f59e0b;--color-warning-bg: #fffbeb;--badge-ghost-bg: #f1f5f9;--badge-ghost-text: #475569;--badge-creator-bg: #eff6ff;--badge-creator-text: #1d4ed8;--badge-admin-bg: #fef3c7;--badge-admin-text: #b45309;--shadow-sm: 0 1px 2px 0 rgba(0, 0, 0, .05);--shadow-md: 0 4px 6px -1px rgba(0, 0, 0, .1), 0 2px 4px -2px rgba(0, 0, 0, .1);--shadow-lg: 0 10px 15px -3px rgba(0, 0, 0, .1), 0 4px 6px -4px rgba(0, 0, 0, .1);--glass-bg: rgba(255, 255, 255, .85);--glass-border: rgba(226, 232, 240, .8);--backdrop-blur: blur(12px);--radius-sm: 6px;--radius-md: 10px;--radius-lg: 16px;--radius-full: 9999px;--font-family: "Inter", system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;--transition-fast: .15s ease;--transition-normal: .25s ease}[data-theme=dark]{--color-primary: #3b82f6;--color-primary-hover: #60a5fa;--color-primary-light: rgba(59, 130, 246, .15);--color-bg-base: #0f172a;--color-bg-surface: #1e293b;--color-bg-surface-elevated: #334155;--color-bg-overlay: rgba(0, 0, 0, .7);--color-text-main: #f8fafc;--color-text-muted: #94a3b8;--color-text-inverse: #0f172a;--color-border: #334155;--color-border-hover: #475569;--color-success: #34d399;--color-success-bg: rgba(52, 211, 153, .15);--color-error: #f87171;--color-error-bg: rgba(248, 113, 113, .15);--color-warning: #fbbf24;--color-warning-bg: rgba(251, 191, 36, .15);--badge-ghost-bg: #334155;--badge-ghost-text: #cbd5e1;--badge-creator-bg: rgba(59, 130, 246, .2);--badge-creator-text: #93c5fd;--badge-admin-bg: rgba(245, 158, 11, .2);--badge-admin-text: #fde68a;--shadow-sm: 0 1px 2px 0 rgba(0, 0, 0, .3);--shadow-md: 0 4px 6px -1px rgba(0, 0, 0, .4);--shadow-lg: 0 10px 15px -3px rgba(0, 0, 0, .5);--glass-bg: rgba(30, 41, 59, .85);--glass-border: rgba(51, 65, 85, .8)}*{box-sizing:border-box;margin:0;padding:0}body{font-family:var(--font-family);background-color:var(--color-bg-base);color:var(--color-text-main);line-height:1.5;-webkit-font-smoothing:antialiased;transition:background-color var(--transition-normal),color var(--transition-normal)}a{color:var(--color-primary);text-decoration:none;transition:color var(--transition-fast)}a:hover{color:var(--color-primary-hover)}button{font-family:inherit;cursor:pointer;border:none;outline:none}input,select,textarea{font-family:inherit;font-size:.95rem}.app-header{height:64px;background-color:var(--glass-bg);backdrop-filter:var(--backdrop-blur);-webkit-backdrop-filter:var(--backdrop-blur);border-bottom:1px solid var(--color-border);position:sticky;top:0;z-index:40;display:flex;align-items:center;justify-content:space-between;padding:0 1.5rem;transition:background-color var(--transition-normal),border-color var(--transition-normal)}.header-left{display:flex;align-items:center;gap:1rem}.icon-btn{background:transparent;color:var(--color-text-main);padding:.5rem;border-radius:var(--radius-sm);display:inline-flex;align-items:center;justify-content:center;transition:background-color var(--transition-fast),color var(--transition-fast)}.icon-btn:hover{background-color:var(--color-bg-base);color:var(--color-primary)}.header-brand{display:flex;align-items:center;gap:.5rem;font-size:1.25rem;font-weight:700;color:var(--color-text-main);letter-spacing:-.025em}.brand-icon{color:var(--color-primary)}.header-right{display:flex;align-items:center;gap:1rem}.profile-dropdown-container{position:relative}.avatar-btn{display:flex;align-items:center;gap:.5rem;background:transparent;padding:.35rem .6rem;border-radius:var(--radius-full);border:1px solid var(--color-border);color:var(--color-text-main);transition:background-color var(--transition-fast)}.avatar-btn:hover{background-color:var(--color-bg-base)}.avatar-circle{width:32px;height:32px;border-radius:50%;background-color:var(--color-primary);color:#fff;display:flex;align-items:center;justify-content:center;font-weight:600;font-size:.875rem}.dropdown-menu{position:absolute;right:0;top:calc(100% + 8px);width:200px;background-color:var(--color-bg-surface-elevated);border:1px solid var(--color-border);border-radius:var(--radius-md);box-shadow:var(--shadow-lg);padding:.5rem 0;z-index:50;animation:fadeIn .15s ease-out}.dropdown-item{width:100%;display:flex;align-items:center;gap:.75rem;padding:.6rem 1rem;background:transparent;color:var(--color-text-main);font-size:.9rem;text-align:left;transition:background-color var(--transition-fast)}.dropdown-item:hover{background-color:var(--color-bg-base)}.dropdown-item.danger{color:var(--color-error)}.dropdown-divider{height:1px;background-color:var(--color-border);margin:.4rem 0}.drawer-overlay{position:fixed;top:0;right:0;bottom:0;left:0;background-color:var(--color-bg-overlay);-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);z-index:50;animation:fadeIn .2s ease-out}.drawer-content{position:fixed;top:0;bottom:0;left:0;width:280px;background-color:var(--color-bg-surface);box-shadow:var(--shadow-lg);display:flex;flex-direction:column;justify-content:space-between;padding:1.25rem;z-index:60;animation:slideRight .25s cubic-bezier(.16,1,.3,1)}.drawer-header{display:flex;align-items:center;justify-content:space-between;padding-bottom:1rem;border-bottom:1px solid var(--color-border)}.drawer-nav{margin-top:1.5rem;display:flex;flex-direction:column;gap:.5rem}.drawer-link{display:flex;align-items:center;gap:.75rem;padding:.75rem 1rem;border-radius:var(--radius-md);color:var(--color-text-main);font-weight:500;transition:background-color var(--transition-fast),color var(--transition-fast)}.drawer-link:hover,.drawer-link.active{background-color:var(--color-primary-light);color:var(--color-primary)}.drawer-footer{padding-top:1rem;border-top:1px solid var(--color-border);display:flex;flex-direction:column;gap:1rem}.drawer-toggle-row{display:flex;align-items:center;justify-content:space-between;padding:.5rem;font-size:.9rem;color:var(--color-text-muted)}.lang-select{background-color:var(--color-bg-base);color:var(--color-text-main);border:1px solid var(--color-border);padding:.35rem .6rem;border-radius:var(--radius-sm);cursor:pointer}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}@keyframes slideRight{0%{transform:translate(-100%)}to{transform:translate(0)}}.main-content{min-height:calc(100vh - 64px);padding:2rem 1.5rem;max-width:1100px;margin:0 auto}.admin-dashboard{padding:2rem;max-width:1200px;margin:0 auto}.admin-header{display:flex;align-items:center;gap:1rem;margin-bottom:2rem;color:var(--text-primary)}.admin-icon{color:var(--primary-color)}.admin-stats-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:1.5rem;margin-bottom:3rem}.stat-card{background-color:var(--bg-surface);border:1px solid var(--border-color);border-radius:var(--radius-lg);padding:1.5rem;display:flex;align-items:center;gap:1rem;box-shadow:0 2px 4px #0000000d}.stat-icon{background-color:rgba(var(--primary-rgb),.1);color:var(--primary-color);padding:1rem;border-radius:50%;display:flex;align-items:center;justify-content:center}.stat-info{display:flex;flex-direction:column}.stat-label{font-size:.875rem;color:var(--text-secondary);font-weight:500}.stat-value{font-size:1.5rem;font-weight:700;color:var(--text-primary)}.admin-users-section h2{color:var(--text-primary);margin-bottom:1.5rem}.table-responsive{overflow-x:auto;background-color:var(--bg-surface);border:1px solid var(--border-color);border-radius:var(--radius-lg)}.admin-table{width:100%;border-collapse:collapse;text-align:left}.admin-table th,.admin-table td{padding:1rem;border-bottom:1px solid var(--border-color)}.admin-table th{background-color:var(--bg-body);color:var(--text-secondary);font-weight:600;font-size:.875rem}.admin-table tr{transition:background-color .2s ease}.admin-table tr:hover{background-color:var(--bg-body)}.suspended-row{opacity:.7}.badge{padding:.25rem .5rem;border-radius:var(--radius-full);font-size:.75rem;font-weight:600}.badge-superadmin{background-color:#8b5cf61a;color:#8b5cf6}.badge-user{background-color:#6b72801a;color:#6b7280}.badge-active{background-color:#22c55e1a;color:#22c55e}.badge-pending{background-color:#eab3081a;color:#eab308}.badge-suspended{background-color:#ef44441a;color:#ef4444}.action-btn{display:inline-flex;align-items:center;gap:.5rem;padding:.5rem .75rem;border-radius:var(--radius-md);font-size:.875rem;font-weight:500;cursor:pointer;border:none;transition:opacity .2s}.action-btn:disabled{opacity:.5;cursor:not-allowed}.btn-suspend{background-color:#ef44441a;color:#ef4444}.btn-suspend:hover:not(:disabled){background-color:#ef4444;color:#fff}.btn-unsuspend{background-color:#22c55e1a;color:#22c55e}.btn-unsuspend:hover:not(:disabled){background-color:#22c55e;color:#fff}.admin-loading{display:flex;justify-content:center;align-items:center;height:50vh;color:var(--text-secondary);font-size:1.2rem}.auth-container{min-height:calc(100vh - 120px);display:flex;align-items:center;justify-content:center;padding:2rem 1rem}.auth-card{width:100%;max-width:440px;background-color:var(--color-bg-surface);border:1px solid var(--color-border);border-radius:var(--radius-lg);padding:2.5rem 2rem;box-shadow:var(--shadow-lg);-webkit-backdrop-filter:var(--backdrop-blur);backdrop-filter:var(--backdrop-blur)}.auth-header{text-align:center;margin-bottom:2rem}.auth-title{font-size:1.75rem;font-weight:700;color:var(--color-text-main);letter-spacing:-.025em;margin-bottom:.5rem}.auth-subtitle{font-size:.95rem;color:var(--color-text-muted)}.auth-form{display:flex;flex-direction:column;gap:1.25rem}.form-group{display:flex;flex-direction:column;gap:.4rem}.form-label{font-size:.875rem;font-weight:500;color:var(--color-text-main)}.input-field{width:100%;padding:.75rem 1rem;border-radius:var(--radius-md);border:1px solid var(--color-border);background-color:var(--color-bg-base);color:var(--color-text-main);transition:border-color var(--transition-fast),box-shadow var(--transition-fast)}.input-field:focus{outline:none;border-color:var(--color-primary);box-shadow:0 0 0 3px var(--color-primary-light)}.input-field.error{border-color:var(--color-error)}.field-error{font-size:.8rem;color:var(--color-error)}.auth-btn{width:100%;padding:.85rem;margin-top:.5rem;border-radius:var(--radius-md);background-color:var(--color-primary);color:#fff;font-size:1rem;font-weight:600;display:flex;align-items:center;justify-content:center;gap:.5rem;transition:background-color var(--transition-fast)}.auth-btn:hover:not(:disabled){background-color:var(--color-primary-hover)}.auth-btn:disabled{opacity:.65;cursor:not-allowed}.auth-footer{text-align:center;margin-top:1.75rem;font-size:.9rem;color:var(--color-text-muted)}.alert-box{padding:.85rem 1rem;border-radius:var(--radius-md);font-size:.9rem;display:flex;flex-direction:column;gap:.5rem}.alert-box.error{background-color:var(--color-error-bg);border:1px solid var(--color-error);color:var(--color-error)}.alert-box.warning{background-color:var(--color-warning-bg);border:1px solid var(--color-warning);color:#b45309}.alert-box.success{background-color:var(--color-success-bg);border:1px solid var(--color-success);color:var(--color-success)}.otp-field{font-family:monospace;font-size:1.25rem;letter-spacing:.4em;text-align:center}.groups-container{display:flex;flex-direction:column;gap:1.5rem}.page-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:.5rem}.page-title{font-size:1.75rem;font-weight:700;color:var(--color-text-main);letter-spacing:-.025em}.primary-btn{display:inline-flex;align-items:center;gap:.5rem;padding:.65rem 1.25rem;background-color:var(--color-primary);color:var(--color-text-inverse);border-radius:var(--radius-md);font-weight:600;font-size:.9rem;transition:background-color var(--transition-fast)}.primary-btn:hover{background-color:var(--color-primary-hover)}.groups-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:1.25rem}.group-card{background-color:var(--color-bg-surface);border:1px solid var(--color-border);border-radius:var(--radius-lg);padding:1.25rem;box-shadow:var(--shadow-sm);display:flex;flex-direction:column;justify-content:space-between;gap:1rem;transition:transform var(--transition-fast),border-color var(--transition-fast),box-shadow var(--transition-fast);cursor:pointer}.group-card:hover{transform:translateY(-2px);border-color:var(--color-primary);box-shadow:var(--shadow-md)}.group-card-header{display:flex;align-items:flex-start;justify-content:space-between;gap:.75rem}.group-icon-wrapper{width:42px;height:42px;border-radius:var(--radius-md);background-color:var(--color-primary-light);color:var(--color-primary);display:flex;align-items:center;justify-content:center;flex-shrink:0}.group-name{font-size:1.15rem;font-weight:700;color:var(--color-text-main);line-height:1.3}.group-desc{font-size:.875rem;color:var(--color-text-muted);margin-top:.25rem;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}.group-card-footer{display:flex;align-items:center;justify-content:space-between;padding-top:.75rem;border-top:1px solid var(--color-border);font-size:.8rem;color:var(--color-text-muted)}.badge{display:inline-flex;align-items:center;gap:.25rem;padding:.2rem .55rem;border-radius:var(--radius-full);font-size:.75rem;font-weight:600}.badge.ghost{background-color:var(--badge-ghost-bg);color:var(--badge-ghost-text)}.badge.creator{background-color:var(--badge-creator-bg);color:var(--badge-creator-text)}.badge.admin{background-color:var(--badge-admin-bg);color:var(--badge-admin-text)}.badge.member{background-color:var(--color-bg-base);color:var(--color-text-muted);border:1px solid var(--color-border)}.badge.archived{background-color:var(--badge-ghost-bg);color:var(--badge-ghost-text);border:1px solid var(--color-border)}.badge.voided{background-color:var(--color-error-bg);color:var(--color-error)}.badge.warning{background-color:var(--color-warning-bg);color:var(--color-warning)}.badge.success{background-color:var(--color-success-bg);color:var(--color-success)}.empty-state{text-align:center;padding:4rem 2rem;background-color:var(--color-bg-surface);border:1px dashed var(--color-border);border-radius:var(--radius-lg);display:flex;flex-direction:column;align-items:center;gap:1rem}.empty-icon{width:64px;height:64px;border-radius:50%;background-color:var(--color-primary-light);color:var(--color-primary);display:flex;align-items:center;justify-content:center}.empty-title{font-size:1.25rem;font-weight:700;color:var(--color-text-main)}.empty-desc{color:var(--color-text-muted);max-width:400px}.modal-overlay{position:fixed;top:0;right:0;bottom:0;left:0;background-color:var(--color-bg-overlay);-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);z-index:100;display:flex;align-items:center;justify-content:center;padding:1rem;animation:fadeIn .15s ease-out}.modal-card{width:100%;max-width:480px;background-color:var(--color-bg-surface);border:1px solid var(--color-border);border-radius:var(--radius-lg);padding:1.75rem;box-shadow:var(--shadow-lg);animation:scaleUp .2s ease-out}.modal-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:1.25rem}.modal-title{font-size:1.35rem;font-weight:700;color:var(--color-text-main)}.modal-actions{display:flex;align-items:center;justify-content:flex-end;gap:.75rem;margin-top:1.5rem}.secondary-btn{padding:.65rem 1.25rem;background-color:var(--color-bg-base);color:var(--color-text-main);border:1px solid var(--color-border);border-radius:var(--radius-md);font-weight:600;font-size:.9rem;transition:background-color var(--transition-fast)}.secondary-btn:hover{background-color:var(--color-border)}.members-list{display:flex;flex-direction:column;gap:.75rem;margin-top:1rem}.member-item{display:flex;align-items:center;justify-content:space-between;padding:.85rem 1rem;background-color:var(--color-bg-surface);border:1px solid var(--color-border);border-radius:var(--radius-md);transition:border-color var(--transition-fast)}.member-info{display:flex;align-items:center;gap:.85rem}.member-name{font-weight:600;color:var(--color-text-main);font-size:.95rem}.member-email{font-size:.8rem;color:var(--color-text-muted)}.member-actions-container{position:relative}@keyframes scaleUp{0%{opacity:0;transform:scale(.95)}to{opacity:1;transform:scale(1)}}
