.user-card{background:var(--card-bg);border:2px solid var(--shadow);box-shadow:3px 3px var(--shadow);border-radius:1rem;padding:1rem;transition:all .3s;display:flex}.user-card:hover{border:2px solid var(--accent-1);box-shadow:6px 6px var(--shadow);transform:translate(-3px,-3px)}.user-card .user-icon{margin-right:1rem;display:block}.user-card .user-icon img{border-radius:50%}.user-card .user-description{flex-direction:column;gap:.5rem;display:flex}.user-card .user-description .user-title{align-items:center;gap:.5rem;display:flex}.user-card .user-description .user-title .user-username{color:var(--foreground);font-size:1.3rem}.user-card .user-description .user-stats{color:var(--faded-text)}.user-role{color:var(--faded-text);font-weight:700}.ADMIN-badge{color:#aadfe6!important;border-color:#aadfe6!important}.MOD-badge{color:#dbc291!important;border-color:#dbc291!important}.DEV-badge{color:#beaee8!important;border-color:#beaee8!important}.user-profile-card{margin-top:1rem;padding:2rem;display:flex}.user-profile-info{flex:1;margin:0 1rem 0 0}.user-profile-info h2{margin:0 1rem 0 0}.user-profile-events{flex-wrap:wrap;align-items:center;gap:.25rem;margin-bottom:1rem;display:flex}.user-profile-events a{display:block}.user-profile-events strong{margin-right:.5rem}.user-profile-events .badge{color:var(--faded-text);transition:all .3s}.user-profile-events .badge:hover{border-color:var(--faded-text);background:var(--background)}.user-profile-icon{border:3px solid var(--shadow);box-shadow:3px 3px var(--shadow);border-radius:1rem;margin-right:3rem;display:flex;position:relative}.user-profile-icon .default-icon{background-image:url(/placeholder.png);background-size:cover;border-radius:1rem;width:100px;height:100px;position:relative}.user-profile-icon img{z-index:0;border-radius:1rem;position:relative}.user-profile-icon:before{content:"";border:2px dashed var(--accent-1);z-index:9;border-radius:1rem;width:103px;height:103px;animation:10s linear infinite spin;position:absolute;top:-3px;left:-3px}.user-profile-links{flex-wrap:wrap;gap:.5rem;display:flex}.user-profile-stats{flex-direction:column;gap:.5rem;display:flex}.user-profile-stats .stat-card{background:var(--background);border:2px solid var(--shadow);border-radius:1rem;width:150px;padding:.75rem}.user-profile-stats .stat-card .d-flex{gap:.5rem;margin-left:.5rem}.user-profile-stats .stat-card .d-flex small{text-transform:uppercase;color:var(--faded-text);letter-spacing:1px}.user-profile-stats .stat-card .d-flex span{font-size:1.5rem;font-weight:700}.user-preferences .card{position:relative}.user-preferences .card:has(.preference-picker-menu){z-index:10}.user-preferences .card h3{margin:0}.user-preferences .d-flex{flex-wrap:wrap;align-items:center;gap:.5rem;margin-top:1rem}.user-preferences .badge{align-items:center;gap:.5rem;display:flex}.user-preferences .badge .action{cursor:pointer}.user-preferences .badge .action:hover{color:var(--faded-text)}.user-preferences .preference-add{border:2px solid var(--shadow);background:var(--card-bg);width:2rem;height:2rem;color:var(--foreground);cursor:pointer;border-radius:50%;justify-content:center;align-items:center;padding:0;font-size:1.25rem;line-height:1;display:inline-flex}.user-preferences .preference-add:hover:not(:disabled){border-color:var(--faded-text);background:var(--background)}.user-preferences .preference-add:disabled{opacity:.5;cursor:not-allowed}.user-preferences .preference-picker{align-items:center;display:inline-flex;position:relative}.user-preferences .preference-picker-menu{z-index:1;background:var(--background);border:2px solid var(--shadow);min-width:10rem;max-height:12rem;box-shadow:3px 3px 0 var(--shadow);border-radius:1rem;flex-direction:column;display:flex;position:absolute;top:calc(100% + .35rem);left:0;overflow-y:auto}.user-preferences .preference-picker-item{color:var(--foreground);cursor:pointer;padding:.35rem 1rem;font-family:Space Grotesk,sans-serif;font-size:.9rem;font-weight:500}.user-preferences .preference-picker-item:hover{background:var(--card-bg)}@media screen and (max-width:768px){.user-profile-card{flex-wrap:wrap}.user-profile-info{margin:1rem 0}.user-profile-stats{flex-direction:row;flex:1}.user-profile-stats .stat-card{width:50%}}@keyframes spin{0%{transform:rotate(1)}to{transform:rotate(360deg)}}
