release: 2901262036

frontend/app/globals.css

@@ -1084,6 +1084,118 @@ button span {
   line-height: 1.4;
 }
 
+.user-grid {
+  display: grid;
+  grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
+  gap: 16px;
+}
+
+.user-grid-card {
+  display: grid;
+  gap: 14px;
+  padding: 16px;
+  border-radius: 16px;
+  border: 1px solid var(--border);
+  background: rgba(255, 255, 255, 0.04);
+  color: var(--ink);
+  text-decoration: none;
+  transition: border-color 0.2s ease, transform 0.2s ease;
+}
+
+.user-grid-card:hover {
+  border-color: rgba(59, 130, 246, 0.5);
+  transform: translateY(-2px);
+}
+
+.user-grid-header {
+  display: flex;
+  justify-content: space-between;
+  gap: 12px;
+  align-items: flex-start;
+}
+
+.user-grid-meta {
+  display: block;
+  font-size: 12px;
+  color: var(--ink-muted);
+}
+
+.user-grid-pill {
+  padding: 4px 10px;
+  border-radius: 999px;
+  font-size: 12px;
+  border: 1px solid rgba(59, 130, 246, 0.4);
+  color: var(--ink);
+  background: rgba(59, 130, 246, 0.2);
+}
+
+.user-grid-pill.is-blocked {
+  border-color: rgba(255, 82, 82, 0.5);
+  background: rgba(255, 82, 82, 0.2);
+}
+
+.user-grid-stats {
+  display: grid;
+  grid-template-columns: repeat(2, minmax(0, 1fr));
+  gap: 12px;
+}
+
+.user-grid-stats .label {
+  font-size: 12px;
+  color: var(--ink-muted);
+  display: block;
+}
+
+.user-grid-stats .value {
+  font-size: 16px;
+  font-weight: 600;
+}
+
+.user-grid-footer {
+  display: grid;
+  gap: 6px;
+}
+
+.user-detail-card {
+  display: grid;
+  gap: 16px;
+  padding: 18px;
+  border-radius: 18px;
+  border: 1px solid var(--border);
+  background: rgba(255, 255, 255, 0.04);
+}
+
+.user-detail-header {
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
+  gap: 16px;
+  flex-wrap: wrap;
+}
+
+.user-detail-meta {
+  display: flex;
+  gap: 12px;
+  flex-wrap: wrap;
+}
+
+.user-detail-grid {
+  display: grid;
+  grid-template-columns: repeat(auto-fit, minmax(160px, 1fr));
+  gap: 12px;
+}
+
+.user-detail-grid .label {
+  font-size: 12px;
+  color: var(--ink-muted);
+  display: block;
+}
+
+.user-detail-grid .value {
+  font-size: 18px;
+  font-weight: 600;
+}
+
 .label-row {
   display: flex;
   justify-content: space-between;