.loyalty-page{width:100%;max-width:none}.loyalty-toolbar{display:flex;align-items:center;justify-content:space-between;gap:16px;margin:0 0 16px}.loyalty-copy{color:var(--muted);font-size:16px}.loyalty-toolbar .actions{display:flex;gap:10px;flex-wrap:wrap;justify-content:flex-end}.loyalty-stats{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px}.loyalty-card{overflow:hidden}.loyalty-filters{display:flex;align-items:center;gap:12px;padding:16px;border-bottom:1px solid var(--border);background:var(--surface-muted)}.loyalty-search{position:relative;flex:1;min-width:220px}.loyalty-search .input{width:100%;padding-left:40px}.loyalty-search-icon{position:absolute;left:14px;top:50%;transform:translateY(-50%);color:var(--muted);z-index:1}.loyalty-tier{display:inline-flex;align-items:center;gap:6px;border-radius:999px;padding:5px 10px;font-size:12px;font-weight:800;background:var(--surface-muted);color:var(--text-2);white-space:nowrap}.loyalty-tier.silver{background:var(--blue-50);color:var(--blue)}.loyalty-tier.gold{background:var(--amber-50);color:#9a5b00}.loyalty-tier.platinum{background:var(--violet-50);color:#5b3ac4}.loyalty-points{font-weight:800;font-variant-numeric:tabular-nums}.loyalty-points.negative{color:var(--danger)}.loyalty-table{max-height:calc(100vh - 390px);overflow:auto;position:relative;overscroll-behavior:contain;background:var(--surface);-webkit-overflow-scrolling:touch}.loyalty-table .table{min-width:900px;border-collapse:separate;border-spacing:0}.loyalty-table thead{position:static}.loyalty-table thead th{position:sticky;top:0;z-index:50;background:var(--surface-muted);box-shadow:inset 0 -2px 0 var(--border-strong);background-clip:padding-box}.loyalty-table tbody{position:static}.loyalty-table tbody td{background:var(--surface)}.loyalty-table tbody tr{position:static}.loyalty-settings{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:14px 16px;border-bottom:1px solid var(--border);background:var(--surface)}.loyalty-settings-copy{display:flex;flex-direction:column;gap:2px}.loyalty-settings-copy span{font-size:12px;color:var(--muted)}.loyalty-rate{display:flex;align-items:center;gap:8px;white-space:nowrap}.loyalty-rate .input{width:92px}.loyalty-member-name{display:flex;align-items:center;gap:10px}.loyalty-avatar{width:34px;height:34px;border-radius:50%;display:grid;place-items:center;flex:none;background:var(--primary-50);color:var(--primary-700);font-weight:800}.loyalty-empty{padding:32px;text-align:center}.loyalty-ledger{display:flex;flex-direction:column;gap:0}.loyalty-ledger-row{display:flex;align-items:flex-start;justify-content:space-between;gap:18px;padding:12px 0;border-bottom:1px solid var(--border)}.loyalty-ledger-row:last-child{border-bottom:0}.loyalty-ledger-row .detail{display:flex;flex-direction:column;gap:3px}.loyalty-ledger-row .date{font-size:12px;color:var(--muted)}.loyalty-ledger-row .value{font-weight:800;white-space:nowrap}.loyalty-ledger-row .value.earn{color:var(--primary-700)}.loyalty-ledger-row .value.redeem{color:var(--danger)}@media(max-width:1000px){.loyalty-stats{grid-template-columns:repeat(2,minmax(0,1fr))}}@media(max-width:680px){.loyalty-toolbar{align-items:stretch;flex-direction:column}.loyalty-toolbar .actions{justify-content:flex-start}.loyalty-stats{grid-template-columns:1fr}.loyalty-filters{align-items:stretch;flex-direction:column}.loyalty-search{min-width:0;width:100%}.loyalty-settings{align-items:stretch;flex-direction:column}.loyalty-rate{justify-content:space-between}.loyalty-table{max-height:calc(100vh - 500px);margin-left:-1px;margin-right:-1px}}

/* Loyalty table sticky-header fix: keep the card from clipping the sticky header,
   and let the header cells be the only sticky table elements. */
.view-enter.loyalty-page{animation:none;transform:none}
.loyalty-card{overflow:visible}
.loyalty-table{
  position:relative;
  isolation:isolate;
  overflow:auto;
  overscroll-behavior:contain;
  background:var(--surface);
  -webkit-overflow-scrolling:touch
}
.loyalty-table .table{
  position:relative;
  min-width:900px;
  border-collapse:separate;
  border-spacing:0
}
.loyalty-table .table thead{
  position:static!important;
  z-index:auto
}
.loyalty-table .table thead th{
  position:sticky!important;
  top:0!important;
  z-index:20!important;
  background:var(--surface-muted)!important;
  background-color:var(--surface-muted)!important;
  background-clip:padding-box;
  box-shadow:inset 0 -2px 0 var(--border-strong),0 1px 0 rgba(15,27,45,.08);
  backface-visibility:hidden
}
.loyalty-table .table tbody{
  position:static!important;
  z-index:auto
}
.loyalty-table .table tbody tr{
  position:static!important;
  z-index:auto
}
.loyalty-table .table tbody td{
  position:static!important;
  z-index:auto;
  background:var(--surface)!important;
  background-color:var(--surface)!important;
  background-clip:padding-box
}