.usersContainer{display:flex;flex-direction:column;width:90%;max-width:1200px;margin:0 auto;height:80vh;max-height:700px;overflow-y:auto;background-color:#1e1e1e;border-radius:8px;box-shadow:0 4px 6px rgba(0,0,0,.2);position:relative;scroll-behavior:smooth}.usersContainer::-webkit-scrollbar{width:10px}.usersContainer::-webkit-scrollbar-track{background:#1e1e1e;border-radius:0 8px 8px 0}.usersContainer::-webkit-scrollbar-thumb{background:#444;border-radius:5px}.usersContainer::-webkit-scrollbar-thumb:hover{background:#8e44ad}.usersContainer .header{display:flex;flex-direction:row;align-items:center;padding:16px;background-color:#1a1a1a;color:#f5f5f5;font-weight:600;position:-webkit-sticky;position:sticky;top:0;z-index:10;border-bottom:1px solid #333;border-radius:8px 8px 0 0;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}.usersContainer .header .username,.usersContainer .header .overallCount,.usersContainer .header .overallUsed{flex:1;text-align:center;padding:8px;transition:color .2s ease;cursor:pointer;display:flex;align-items:center;justify-content:center;gap:8px}.usersContainer .header .username:hover,.usersContainer .header .overallCount:hover,.usersContainer .header .overallUsed:hover{color:#9b59b6}.usersContainer .header .username i,.usersContainer .header .overallCount i,.usersContainer .header .overallUsed i{font-size:14px}.usersContainer .header .username{text-align:left}.usersContainer .user{display:flex;flex-direction:column;padding:12px 16px;border-bottom:1px solid rgba(80,80,80,.2);transition:background-color .2s ease}.usersContainer .user:last-child{border-bottom:none}.usersContainer .user:hover{background-color:#2d2d2d}.usersContainer .user .user-header{display:flex;align-items:center}.usersContainer .user .user-header .username,.usersContainer .user .user-header .overallCount{flex:1;text-align:center;padding:4px;color:#b0b0b0;font-size:16px}.usersContainer .user .user-header .username{text-align:left;font-weight:500;color:#f5f5f5}.usersContainer .user .user-header .overallUsed{flex:1;text-align:center;padding:4px;color:#b0b0b0;font-size:16px;position:relative}.usersContainer .user .collapseBtn{display:flex;justify-content:center;margin-top:10px;padding:8px 12px;cursor:pointer;background-color:#1a1a1a;color:#f5f5f5;transition:background-color .2s ease;border-radius:6px}.usersContainer .user .collapseBtn:hover{background-color:#9b59b6}.usersContainer .user .collapseBtn i{font-size:16px}.usersContainer .user .cardList{overflow:hidden;height:0;transition:height .3s ease;background-color:#252525;border-top:1px solid #333;margin-top:30px}.usersContainer .user .cardList.expanded{height:auto;border-bottom:1px solid #333}.usersContainer .user .cardList .cardHeader{display:flex;flex-direction:row;padding:8px 16px;background-color:#1a1a1a;color:#f5f5f5;font-weight:500;border-bottom:1px solid #333}.usersContainer .user .cardList .cardHeader .name{flex:2;text-align:left;padding:4px}.usersContainer .user .cardList .cardHeader .count,.usersContainer .user .cardList .cardHeader .used{flex:1;text-align:center;padding:4px}.usersContainer .user .cardList .card{display:flex;flex-direction:row;padding:8px 16px;border-bottom:1px solid rgba(80,80,80,.2);color:#b0b0b0}.usersContainer .user .cardList .card:last-child{border-bottom:none}.usersContainer .user .cardList .card .name{flex:2;text-align:left;padding:4px}.usersContainer .user .cardList .card .count,.usersContainer .user .cardList .card .used{flex:1;text-align:center;padding:4px}.usersContainer #loading,.usersContainer #error{padding:24px;text-align:center;color:#b0b0b0;font-size:16px}.usersContainer #error{color:#e74c3c}.usersContainer #data{min-height:100%}@media only screen and (max-width: 950px){.usersContainer{width:95%;height:75vh}.usersContainer .header{padding:12px 8px}.usersContainer .header .username,.usersContainer .header .overallCount,.usersContainer .header .overallUsed{font-size:14px;padding:4px}.usersContainer .user{padding:10px 8px}.usersContainer .user .user-header .username,.usersContainer .user .user-header .overallCount,.usersContainer .user .user-header .overallUsed{font-size:14px}.usersContainer .user .user-header .overallUsed .collapseBtn{padding:6px 10px;bottom:-25px}.usersContainer .user .cardList{margin-top:25px}.usersContainer .user .cardList .cardHeader .name,.usersContainer .user .cardList .card .name{font-size:14px}.usersContainer .user .cardList .cardHeader .count,.usersContainer .user .cardList .cardHeader .used,.usersContainer .user .cardList .card .count,.usersContainer .user .cardList .card .used{font-size:14px}}@media only screen and (max-width: 600px){.usersContainer{width:98%}.usersContainer .header{padding:10px 4px}.usersContainer .header .username,.usersContainer .header .overallCount,.usersContainer .header .overallUsed{font-size:12px;padding:2px}.usersContainer .header .username i,.usersContainer .header .overallCount i,.usersContainer .header .overallUsed i{font-size:12px}.usersContainer .user{padding:8px 4px}.usersContainer .user .user-header .username,.usersContainer .user .user-header .overallCount,.usersContainer .user .user-header .overallUsed{font-size:12px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.usersContainer .user .user-header .overallUsed .collapseBtn{padding:5px 8px;bottom:-20px}.usersContainer .user .user-header .overallUsed .collapseBtn i{font-size:14px}.usersContainer .user .cardList{margin-top:20px}.usersContainer .user .cardList .cardHeader .name,.usersContainer .user .cardList .card .name{font-size:12px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.usersContainer .user .cardList .cardHeader .count,.usersContainer .user .cardList .cardHeader .used,.usersContainer .user .cardList .card .count,.usersContainer .user .cardList .card .used{font-size:12px}.usersContainer .user .cardList .card .card-img{width:30px;height:30px}}.usersContainer .user .cardList .cardHeader .name{flex:2;text-align:left;padding:4px;display:flex;align-items:center;gap:10px}.usersContainer .user .cardList .card .name{flex:2;text-align:left;padding:4px;display:flex;align-items:center;gap:10px}.usersContainer .user .cardList .card .card-img{width:40px;height:40px;-o-object-fit:cover;object-fit:cover;border-radius:4px;box-shadow:0 1px 3px rgba(0,0,0,.3)}/*# sourceMappingURL=cards.css.map */