.groups-page{flex-direction:column;gap:20px;display:flex}.groups-toolbar{flex-wrap:wrap;justify-content:space-between;align-items:center;gap:12px;display:flex}.groups-create-compact{flex:none;align-items:center;gap:8px;display:flex}.groups-create-compact input{flex:1;min-width:200px}.groups-grid{grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:14px;display:grid}.group-card{background:var(--surface-2);border:1px solid var(--border-color);color:inherit;cursor:pointer;border-radius:14px;flex-direction:column;gap:12px;padding:18px;text-decoration:none;transition:border-color .16s,background-color .16s;display:flex;position:relative}.group-card:hover{background:var(--surface-3);border-color:rgba(var(--accent-primary-rgb),.35)}.group-card:focus-visible{outline:2px solid rgba(var(--accent-primary-rgb),.55);outline-offset:2px;background:var(--surface-3);border-color:rgba(var(--accent-primary-rgb),.35)}.group-card-header{justify-content:space-between;align-items:flex-start;gap:12px;display:flex}.group-card-icon{background:rgba(var(--accent-primary-rgb),.14);border:1px solid rgba(var(--accent-primary-rgb),.22);width:42px;height:42px;color:var(--accent-primary);border-radius:12px;flex-shrink:0;justify-content:center;align-items:center;font-size:1.2rem;font-weight:700;display:flex}.group-card-title{flex-direction:column;flex:1;gap:4px;min-width:0;display:flex}.group-card-title h3{color:var(--text-primary);text-overflow:ellipsis;white-space:nowrap;margin:0;font-size:1.1rem;font-weight:600;overflow:hidden}.group-card-title .group-role{color:var(--text-muted);font-size:.85rem}.group-card-actions{opacity:0;gap:6px;transition:opacity .16s;display:flex}.group-card:hover .group-card-actions{opacity:1}.group-card-action-btn{width:32px;height:32px;color:var(--text-secondary);cursor:pointer;transition:var(--transition-fast);background:#ffffff0f;border:1px solid #0000;border-radius:8px;flex-shrink:0;justify-content:center;align-items:center;text-decoration:none;display:flex}.group-card-action-btn:hover{color:var(--text-primary);background:#ffffff1f}.group-card-action-btn:focus-visible{outline:2px solid rgba(var(--accent-primary-rgb),.55);outline-offset:2px}.group-card-action-btn svg{width:16px;height:16px}.group-card-stats{border-top:1px solid #ffffff14;gap:14px;padding-top:8px;display:flex}.group-card-stat{color:var(--text-muted);align-items:center;gap:6px;font-size:.85rem;display:flex}.group-card-stat svg{opacity:.7;width:14px;height:14px}.group-empty{text-align:center;background:var(--surface-1);border:1px dashed #ffffff26;border-radius:16px;flex-direction:column;grid-column:1/-1;align-items:center;gap:16px;padding:48px 24px;display:flex}.group-empty-icon{background:rgba(var(--accent-primary-rgb),.1);border:1px solid rgba(var(--accent-primary-rgb),.15);width:64px;height:64px;color:var(--accent-primary);border-radius:16px;justify-content:center;align-items:center;font-size:1.8rem;display:flex}.group-empty h3{color:var(--text-primary);margin:0;font-size:1.25rem;font-weight:600}.group-empty p{color:var(--text-secondary);max-width:400px;font-size:.95rem;line-height:var(--line-height-relaxed);margin:0}.groups-error{color:var(--error-text,#ff6b6b);font-size:var(--font-size-sm);background:#ff6b6b1a;border:1px solid #ff6b6b33;border-radius:8px;padding:12px 16px}.group-role{font-size:var(--font-size-xs);color:var(--text-muted)}.groups-sidebar,.groups-detail{display:none}@media (max-width:600px){.groups-grid{grid-template-columns:1fr}.groups-toolbar{flex-direction:column;align-items:stretch}.groups-create-compact{flex-direction:column}.groups-create-compact input{min-width:0}.group-card-header{align-items:flex-start}.group-card-actions{opacity:1}}