.member-wrap { max-width: var(--container-narrow); margin-inline: auto; padding: var(--space-section) var(--space-5); }
.member-card { background: rgb(var(--color-surface)); padding: var(--space-6); box-shadow: var(--shadow-card); margin-top: var(--space-6); }
.member-row { display: flex; gap: var(--space-4); align-items: flex-end; }
.member-row .mfield { flex: 1; }
.mc-tier { display: inline-flex; align-items: center; gap: var(--space-2); padding: var(--space-2) var(--space-4); background: rgb(var(--color-gold-soft, 201 168 106)); color: #fff; font-family: var(--font-zh); font-size: var(--text-sm); }
.mc-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: var(--space-4); margin-top: var(--space-5); }
.mc-stat { text-align: center; }
.mc-stat .mc-num { font-size: var(--text-2xl); font-family: var(--font-display); color: rgb(var(--color-accent)); }
.mc-stat .mc-label { font-size: var(--text-sm); color: rgb(var(--color-text-muted)); margin-top: var(--space-1); }
.mc-benefits { margin-top: var(--space-5); }
.mc-benefits h3 { font-family: var(--font-zh); margin-bottom: var(--space-3); }
.mc-benefits ul { list-style: none; padding: 0; }
.mc-benefits li { padding: var(--space-2) 0; border-bottom: 1px solid rgb(var(--color-border)); }
.points-list { margin-top: var(--space-6); }
.points-item { display: flex; justify-content: space-between; padding: var(--space-3) 0; border-bottom: 1px solid rgb(var(--color-border)); }
.points-item .pi-left { flex: 1; }
.points-item .pi-amount { font-family: var(--font-display); font-weight: 600; }
.points-item .pi-amount.pos { color: rgb(var(--color-success)); }
.points-item .pi-amount.neg { color: rgb(var(--color-danger, 192 0 0)); }

@media (max-width: 768px) {
	.mc-grid { grid-template-columns: 1fr; gap: var(--space-3); }
	.mc-stat { display: flex; justify-content: space-between; align-items: baseline; padding: var(--space-2) 0; border-bottom: 1px solid rgb(var(--color-border)); text-align: left; }
	.mc-stat .mc-label { margin-top: 0; }
	.member-row { flex-direction: column; align-items: stretch; gap: var(--space-3); }
	.member-row .btn-primary { width: 100%; }
	.points-item { flex-wrap: wrap; gap: var(--space-2); }
}
