.subscription-history{display:flex;flex-direction:column;gap:24px;max-width:1200px;min-width:0;margin:0 auto;padding-bottom:32px}
.subscription-history-heading,.subscription-history-toolbar,.subscription-history-card-heading,.subscription-history-card-footer{display:flex;align-items:center;justify-content:space-between;gap:16px}
.subscription-history-heading h1{font-family:var(--font-display);font-size:var(--fs-h1);font-weight:800;margin:4px 0 8px}
.subscription-history-eyebrow{font-size:11px;letter-spacing:.12em;color:var(--text-lo);font-weight:700;margin:0}
.subscription-history-client{margin:0;color:var(--text-mid)}
.subscription-history-filters{display:flex;gap:4px;padding:4px;border-radius:var(--radius-pill);background:var(--surface-1);flex-wrap:wrap}
.subscription-history-filters button{display:flex;align-items:center;gap:8px;border:0;border-radius:var(--radius-pill);padding:10px 16px;background:transparent;color:var(--text-mid);font:inherit;font-size:var(--fs-small);cursor:pointer}
.subscription-history-filters button[aria-pressed=true]{background:var(--accent);color:var(--accent-ink,#111);font-weight:700}
.subscription-history-filters button span{font-size:11px;opacity:.75}
.subscription-history-filters button:focus-visible{outline:2px solid var(--accent);outline-offset:3px}
.subscription-history-order,.subscription-history-count{font-size:var(--fs-small);color:var(--text-lo);margin:0}
.subscription-history-list{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}
.subscription-history-card{padding:24px;background:var(--surface-1);border:1px solid var(--hairline);border-radius:var(--radius-lg);min-width:0;overflow-wrap:anywhere}
.subscription-history-card::before{content:"";display:block;width:30px;height:3px;background:var(--accent);border-radius:3px;margin-bottom:18px}
.subscription-history-card[data-type=session]::before{background:#a78bfa}
.subscription-history-card-heading{align-items:flex-start}
.subscription-history-card h2{font-family:var(--font-display);font-size:var(--fs-h3);margin:6px 0 0}
.subscription-history-kind{font-size:12px;color:var(--text-mid)}
.subscription-history-status{font-size:11px;font-weight:600;padding:5px 9px;border-radius:var(--radius-pill);background:var(--surface-2);color:var(--text-mid);flex-shrink:0}
.subscription-history-status[data-tone=active]{color:var(--accent);background:color-mix(in srgb,var(--accent) 10%,transparent)}
.subscription-history-status[data-tone=expired]{color:#ff8b8b;background:#ff8b8b14}
.subscription-history-status[data-tone=upcoming],.subscription-history-status[data-tone=pending]{color:#f6c76c;background:#f6c76c14}
.subscription-history-details{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px;margin:24px 0}
.subscription-history dt{font-size:12px;color:var(--text-lo);margin-bottom:6px}
.subscription-history dd{font-size:var(--fs-small);color:var(--text-hi);font-weight:600;margin:0;font-variant-numeric:tabular-nums}
.subscription-history-money{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;padding:18px 0;border-top:1px solid var(--hairline);border-bottom:1px solid var(--hairline);margin:0 0 16px}
.subscription-history dd.subscription-history-pending{color:#f6c76c}
.subscription-history-card-footer{font-size:12px;color:var(--text-lo);flex-wrap:wrap}
.subscription-history-remark{font-size:var(--fs-small);color:var(--text-mid);margin:16px 0 0}
.subscription-history-empty{padding:56px 24px;text-align:center;background:var(--surface-1);border-radius:var(--radius-lg);color:var(--text-mid)}
.subscription-history-empty h2{color:var(--text-hi);font-size:var(--fs-h3);margin:0 0 8px}
.subscription-history-empty p{margin:0 0 20px}
@media(max-width:900px){.subscription-history-list{grid-template-columns:minmax(0,1fr)}}
@media(max-width:540px){.subscription-history{gap:20px}.subscription-history-heading{flex-wrap:wrap}.subscription-history-toolbar{align-items:flex-start;flex-direction:column;gap:10px}.subscription-history-filters button{padding:9px 11px}.subscription-history-card{padding:18px}.subscription-history-card-heading{flex-wrap:wrap}.subscription-history-heading h1{font-size:24px}}