*{margin:0;padding:0;box-sizing:border-box}:root{--bg-primary: #0B0B0F;--bg-secondary: #14141C;--purple-primary: #8F3DFF;--purple-glow: #B56CFF;--purple-dark: #5B1FB8;--text-primary: #EDEAF5;--text-secondary: #A6A2B8;--primary-gradient: linear-gradient(135deg, #8F3DFF 0%, #5B1FB8 100%);--glow-purple: 0 0 15px rgba(143, 61, 255, .6);--glow-purple-strong: 0 0 25px rgba(181, 108, 255, .8);--card-shadow: 0 0 24px rgba(143, 61, 255, .27), 0 10px 30px rgba(0, 0, 0, .2);--success-color: #8F3DFF;--danger-color: #dc3545;--warning-color: #ffc107;--info-color: #B56CFF}body{font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,Fira Sans,Droid Sans,Helvetica Neue,sans-serif;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;background:var(--bg-primary);color:var(--text-primary);min-height:100vh}.app{min-height:100vh;padding:2rem;background:var(--bg-primary)}.container{max-width:1200px;margin:0 auto}.header{text-align:center;color:var(--text-primary);margin-bottom:3rem;background:var(--bg-secondary);padding:2rem;border-radius:12px;box-shadow:var(--card-shadow);border-bottom:2px solid var(--purple-primary)}.header h1{font-size:2.5rem;margin-bottom:.5rem;color:var(--purple-primary);text-shadow:var(--glow-purple)}.header p{font-size:1.1rem;opacity:.9;color:var(--text-secondary)}.card{background:var(--bg-secondary);border-radius:12px;padding:2rem;box-shadow:var(--card-shadow);margin-bottom:2rem;color:var(--text-primary);border:1px solid var(--purple-dark)}.card h2{color:var(--purple-primary);margin-bottom:1.5rem;font-size:1.5rem;display:flex;align-items:center;gap:.5rem;text-shadow:var(--glow-purple)}.button{background:var(--primary-gradient);color:var(--text-primary);border:none;padding:.75rem 2rem;border-radius:8px;font-size:1rem;cursor:pointer;transition:transform .2s,box-shadow .2s;font-weight:600;box-shadow:var(--glow-purple)}.button:hover:not(:disabled){transform:translateY(-2px);box-shadow:var(--glow-purple-strong)}.button:disabled{opacity:.6;cursor:not-allowed}.button-secondary{background:var(--text-secondary);color:var(--bg-secondary)}.button-danger{background:var(--danger-color);color:var(--text-primary);box-shadow:0 0 12px #dc354566}.qr-container{text-align:center;padding:2rem}.qr-image{max-width:300px;margin:0 auto;border:4px solid var(--purple-primary);border-radius:12px;box-shadow:var(--glow-purple)}.status{display:inline-block;padding:.5rem 1rem;border-radius:20px;font-weight:600;margin-bottom:1rem}.status-disconnected{background:var(--warning-color);color:var(--bg-secondary);box-shadow:0 0 8px #ffc10780}.status-connected{background:var(--purple-primary);color:var(--text-primary);box-shadow:var(--glow-purple)}.status-qr_ready{background:var(--purple-glow);color:var(--text-primary);box-shadow:0 0 8px #b56cff80}.groups-list{display:grid;gap:1rem;margin-top:1rem}.group-item{border:1px solid var(--purple-dark);border-radius:8px;padding:1rem;transition:all .2s;background:var(--bg-secondary);color:var(--text-primary);box-shadow:0 0 12px #8f3dff21;display:flex;align-items:center;justify-content:space-between;gap:1rem}.group-item:hover{border-color:var(--purple-primary);box-shadow:var(--glow-purple)}.group-item h3{color:var(--purple-glow);margin-bottom:.5rem;font-size:1.1rem}.group-item p{color:var(--text-secondary);font-size:.9rem;margin:.25rem 0}.group-details{background:var(--bg-secondary);border-radius:8px;padding:1.5rem;margin-top:1rem;border:1px solid var(--purple-dark);box-shadow:0 0 12px #8f3dff21}.group-details h4{color:var(--purple-primary);margin-bottom:1rem;font-size:1.2rem;text-shadow:var(--glow-purple)}.participants-list{max-height:300px;overflow-y:auto;background:var(--bg-primary);border-radius:6px;padding:1rem;border:1px solid var(--purple-dark)}.participant-item{padding:.5rem;border-bottom:1px solid var(--purple-dark);display:flex;justify-content:space-between;align-items:center;color:var(--text-primary)}.participant-item:last-child{border-bottom:none}.badge{display:inline-block;padding:.25rem .5rem;border-radius:4px;font-size:.75rem;font-weight:600;margin-left:.5rem}.badge-super-admin{background:#dc3545;color:var(--text-primary)}.loading{text-align:center;padding:2rem;color:var(--text-secondary)}.error{background:#f8d7da;color:#721c24;padding:1rem;border-radius:8px;margin-bottom:1rem;border:1px solid #f5c6cb}.success{background:#d4edda;color:#155724;padding:1rem;border-radius:8px;margin-bottom:1rem;border:1px solid #c3e6cb}.info{background:#d1ecf1;color:#0c5460;padding:1rem;border-radius:8px;margin-bottom:1rem;border:1px solid #bee5eb}.button-group{display:flex;gap:1rem;flex-wrap:wrap}@media (max-width: 768px){.app{padding:1rem}.header h1{font-size:1.8rem}.card{padding:1rem}.button-group{flex-direction:column}.button{width:100%}}.auth-container{display:flex;align-items:center;justify-content:center;min-height:100vh;background:var(--bg-primary);padding:2rem}.auth-card{background:var(--bg-secondary);border-radius:20px;padding:3rem;box-shadow:var(--card-shadow),var(--glow-purple);max-width:480px;width:100%;border:1px solid var(--purple-dark);position:relative;overflow:hidden}.auth-card:before{content:"";position:absolute;top:-50%;left:-50%;width:200%;height:200%;background:radial-gradient(circle,rgba(143,61,255,.05) 0%,transparent 70%);pointer-events:none}.auth-header{text-align:center;margin-bottom:2.5rem;position:relative;z-index:1}.auth-header h1{color:var(--purple-primary);margin-bottom:1rem;font-size:2.5rem;text-shadow:var(--glow-purple);font-weight:700;letter-spacing:1px}.auth-header h2{color:var(--text-primary);font-size:1.3rem;font-weight:500;letter-spacing:.5px}.auth-form{display:flex;flex-direction:column;gap:1.5rem;position:relative;z-index:1}.form-group{display:flex;flex-direction:column;gap:.6rem}.form-group label{font-weight:600;color:var(--purple-glow);font-size:.95rem;letter-spacing:.3px}.form-group input{padding:1rem;background:var(--bg-primary);border:2px solid var(--purple-dark);border-radius:12px;font-size:1rem;color:var(--text-primary);transition:all .3s ease;font-family:inherit}.form-group input::placeholder{color:var(--text-secondary);opacity:.6}.form-group input:focus{outline:none;border-color:var(--purple-primary);background:var(--bg-secondary);box-shadow:0 0 0 3px #8f3dff1a}.form-group input:disabled{background:#0b0b0f80;cursor:not-allowed;opacity:.6}.recaptcha-container{display:flex;justify-content:center;margin:.5rem 0}.auth-footer{margin-top:2rem;text-align:center;position:relative;z-index:1}.auth-footer p{margin:.5rem 0;color:var(--text-secondary)}.auth-footer a{color:var(--purple-primary);text-decoration:none;font-weight:600;transition:all .3s ease}.auth-footer a:hover{color:var(--purple-glow);text-shadow:var(--glow-purple)}.recaptcha-notice{font-size:.85rem;color:var(--text-secondary);margin-top:1rem}@media (max-width: 768px){.auth-container{padding:1rem}.auth-card{padding:2rem}.auth-header h1{font-size:2rem}.auth-header h2{font-size:1.1rem}}.dashboard-nav{background:var(--bg-secondary);box-shadow:0 2px 10px #0000001a;padding:1rem 0;margin-bottom:2rem}.nav-container{max-width:1200px;margin:0 auto;padding:0 2rem;display:flex;justify-content:space-between;align-items:center;gap:2rem;flex-wrap:wrap}.nav-brand h1{font-size:1.5rem;color:var(--purple-primary);margin:0}.nav-menu{display:flex;gap:1rem;flex:1;flex-wrap:wrap}.nav-menu a{padding:.5rem 1rem;border-radius:8px;text-decoration:none;color:var(--purple-primary);font-weight:500;transition:all .2s}.nav-menu a:hover{background:var(--bg-secondary)}.nav-menu a.active{background:linear-gradient(135deg,var(--purple-primary) 0%,var(--purple-dark) 100%);color:var(--text-primary)}.nav-user{display:flex;align-items:center;gap:1rem}.user-welcome{font-weight:600;color:var(--purple-primary)}.dashboard-app{padding:0;background:var(--bg-primary)}.dashboard-content{padding:2rem}.dashboard-header{text-align:center;margin-bottom:2rem}.dashboard-header h2{color:var(--purple-primary);font-size:2rem;margin-bottom:.5rem}.dashboard-header p{color:var(--text-secondary)}.stats-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:1.5rem;margin-bottom:2rem}.stat-card{background:var(--bg-secondary);border-radius:12px;padding:1.5rem;display:flex;align-items:center;gap:1rem;box-shadow:0 4px 12px #0000001a;transition:transform .2s}.stat-card:hover{transform:translateY(-4px)}.stat-icon{font-size:2.5rem}.stat-content h3{color:var(--text-secondary);font-size:.9rem;font-weight:500;margin-bottom:.5rem}.stat-number{color:var(--purple-primary);font-size:2rem;font-weight:700;margin:0}.stat-text{color:var(--purple-primary);font-size:1.1rem;font-weight:600;margin:0}.quick-actions{display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:1.5rem;margin-top:1.5rem}.action-card{background:var(--bg-secondary);border-radius:12px;padding:1.5rem;text-align:center;text-decoration:none;color:var(--purple-primary);transition:all .2s;border:2px solid transparent}.action-card:not(.disabled):hover{background:var(--bg-secondary);border-color:var(--purple-primary);transform:translateY(-4px);box-shadow:0 4px 12px #667eea33}.action-card.disabled{opacity:.5;cursor:not-allowed}.action-icon{font-size:3rem;margin-bottom:1rem}.action-card h3{margin-bottom:.5rem;color:var(--purple-primary)}.action-card p{color:var(--text-secondary);font-size:.9rem}.activities-list{display:flex;flex-direction:column;gap:1rem}.activity-item{background:var(--bg-secondary);border-radius:8px;padding:1rem;display:flex;justify-content:space-between;align-items:start;gap:1rem}.activity-content{flex:1}.activity-content strong{color:var(--purple-primary)}.activity-details{margin-top:.5rem;color:var(--text-secondary);font-size:.9rem}.activity-time{color:var(--text-secondary);font-size:.85rem;white-space:nowrap}.badge{display:inline-block;padding:.25rem .5rem;border-radius:4px;font-size:.75rem;font-weight:600;margin-right:.5rem}.badge-admin{background:#ffc107;color:#000}@media (max-width: 768px){.group-item-csv{flex-direction:column;align-items:stretch}.button-download{width:100%}.users-table{font-size:.9rem}.users-table th,.users-table td{padding:.5rem}}.grabber-app{min-height:100vh;background:var(--bg-primary)}.grabber-nav{background:var(--bg-secondary);box-shadow:0 2px 10px #0000001a;padding:1rem 0;margin-bottom:2rem}.grabber-content{padding:2rem}.subtitle{color:var(--text-secondary);font-size:1rem;margin-top:.5rem}.group-item-csv{border:1px solid var(--purple-dark);border-radius:8px;padding:1rem;background:var(--bg-secondary);display:flex;justify-content:space-between;align-items:center;gap:1rem;transition:all .2s}.group-item-csv:hover{border-color:var(--purple-primary);box-shadow:0 2px 8px #667eea33}.group-info{flex:1}.group-info h3{color:var(--purple-primary);margin-bottom:.5rem;font-size:1.1rem}.group-info p{color:var(--text-secondary);font-size:.9rem;margin:0}.button-download{white-space:nowrap;min-width:120px}.users-table{overflow-x:auto}.users-table table{width:100%;border-collapse:collapse;margin-top:1rem}.users-table th,.users-table td{padding:.75rem;text-align:right;border-bottom:1px solid var(--purple-dark)}.users-table th{background:var(--bg-secondary);font-weight:600;color:var(--purple-primary)}.users-table tr:hover{background:var(--bg-secondary)}.button-small{padding:.5rem 1rem;font-size:.9rem}.grabber-header{text-align:center;margin-bottom:3rem}.grabber-header h1{color:var(--purple-primary);font-size:2.5rem;text-shadow:var(--glow-purple);margin-bottom:1rem}.grabber-header p{color:var(--text-secondary);font-size:1.2rem}.platform-tabs{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:1rem;margin-bottom:2rem}.platform-tab{background:var(--bg-secondary);border:2px solid var(--purple-dark);border-radius:12px;padding:1.5rem;display:flex;flex-direction:column;align-items:center;gap:.8rem;cursor:pointer;transition:all .3s ease;position:relative;overflow:hidden}.platform-tab:not(.disabled):hover{border-color:var(--purple-primary);box-shadow:var(--glow-purple);transform:translateY(-3px)}.platform-tab.active{background:linear-gradient(135deg,var(--purple-dark) 0%,var(--bg-secondary) 100%);border-color:var(--purple-primary);box-shadow:var(--glow-purple)}.platform-tab.disabled{opacity:.5;cursor:not-allowed}.platform-tab.disabled:hover{transform:none;border-color:var(--purple-dark);box-shadow:none}.platform-icon{font-size:3rem;filter:drop-shadow(0 0 10px rgba(143,61,255,.3))}.platform-name{font-size:1.2rem;font-weight:600;color:var(--text-primary)}.platform-badge{background:var(--purple-primary);color:var(--text-primary);padding:.3rem .8rem;border-radius:20px;font-size:.75rem;font-weight:600;text-transform:uppercase;letter-spacing:.5px}.platform-content{background:var(--bg-secondary);border:1px solid var(--purple-dark);border-radius:16px;padding:2rem;min-height:400px}.coming-soon-card{text-align:center;padding:3rem 2rem;display:flex;flex-direction:column;align-items:center;gap:1.5rem}.coming-soon-icon{font-size:6rem;filter:drop-shadow(0 0 20px rgba(143,61,255,.4));animation:float 3s ease-in-out infinite}@keyframes float{0%,to{transform:translateY(0)}50%{transform:translateY(-20px)}}.coming-soon-card h2{color:var(--purple-primary);font-size:2rem;margin:0}.coming-soon-description{color:var(--text-secondary);font-size:1.1rem;max-width:600px;line-height:1.6}.coming-soon-badge-large{background:linear-gradient(135deg,var(--purple-primary) 0%,var(--purple-glow) 100%);color:var(--text-primary);padding:1rem 2rem;border-radius:30px;font-size:1.1rem;font-weight:700;text-transform:uppercase;letter-spacing:1px;box-shadow:var(--glow-purple);margin:1rem 0}.roadmap-info{background:var(--bg-primary);border:1px solid var(--purple-dark);border-radius:12px;padding:2rem;margin-top:2rem;max-width:600px}.roadmap-info h3{color:var(--purple-glow);margin-top:0;margin-bottom:1.5rem;font-size:1.3rem}.roadmap-info ul{list-style:none;padding:0;margin:0;display:flex;flex-direction:column;gap:1rem}.roadmap-info li{display:flex;align-items:center;gap:1rem;padding:1rem;background:var(--bg-secondary);border:1px solid var(--purple-dark);border-radius:8px;color:var(--text-secondary);transition:all .3s ease}.roadmap-info li.completed{border-color:#4ade80;background:#4ade800d}.roadmap-info li.current{border-color:var(--purple-primary);background:#8f3dff1a;box-shadow:0 0 15px #8f3dff33;color:var(--text-primary)}.roadmap-icon{font-size:1.5rem;min-width:30px}@media (max-width: 768px){.platform-tabs{grid-template-columns:1fr}.grabber-header h1{font-size:2rem}.coming-soon-icon{font-size:4rem}.roadmap-info{padding:1.5rem}}