.records-page{position:relative;z-index:1;min-height:calc(100vh - 56px);padding:1.5rem 1.25rem 2.5rem;color:var(--text)}.records-page__wrap{max-width:1080px;margin:0 auto}.records-page__header{margin-bottom:1.25rem;text-align:center}.records-page__title{margin:0;font-size:clamp(1.35rem,3vw,1.65rem);font-weight:800;letter-spacing:.02em;color:var(--text)}.records-page__subtitle{margin:.5rem 0 0;font-size:.9rem;line-height:1.5;color:var(--muted)}.records-page__card{background:var(--glass);border:1px solid var(--border);border-radius:var(--card-radius);backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);box-shadow:0 2px 16px rgba(0,0,0,.15);overflow:hidden}.records-page__tabs{display:flex;flex-wrap:wrap;gap:6px;padding:1rem 1.25rem .75rem;border-bottom:1px solid var(--border-subtle);background:linear-gradient(180deg,hsla(0,0%,100%,.04),hsla(0,0%,100%,0))}.records-page__tab{padding:8px 16px;font-size:.88rem;font-weight:600;color:var(--muted);border-radius:999px;border:1px solid transparent;background:transparent;transition:background .15s ease,color .15s ease,border-color .15s ease}.records-page__tab:hover{color:var(--text);background:hsla(0,0%,100%,.06)}.records-page__tab--on{color:var(--text);background:rgba(107,124,255,.22);border-color:rgba(107,124,255,.35)}.records-page__body{padding:1rem 1.25rem 1.5rem;min-height:280px}.records-page__list{display:flex;flex-direction:column;gap:12px}.records-page__order{display:grid;grid-template-columns:72px 1fr auto;grid-gap:12px 14px;gap:12px 14px;align-items:start;padding:12px 14px;border-radius:var(--card-radius-sm);border:1px solid var(--border-subtle);background:hsla(0,0%,100%,.03);transition:border-color .18s ease,background .18s ease}.records-page__order:hover{border-color:rgba(107,124,255,.2);background:hsla(0,0%,100%,.05)}.records-page__thumb{width:72px;height:72px;border-radius:10px;overflow:hidden;border:1px solid var(--border-subtle);background:rgba(0,0,0,.2)}.records-page__thumb img{width:100%;height:100%;object-fit:cover;display:block}.records-page__meta{min-width:0}.records-page__name{margin:0 0 6px;font-size:.9rem;font-weight:600;line-height:1.4;color:var(--text);display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;overflow:hidden}.records-page__time{margin:0;font-size:.78rem;color:var(--muted)}.records-page__price{margin:6px 0 0;font-size:1rem;font-weight:700;color:var(--accent-hover)}.records-page__aside{display:flex;flex-direction:column;align-items:flex-end;gap:8px}.records-page__badge{display:inline-block;padding:4px 10px;font-size:.72rem;font-weight:700;letter-spacing:.04em;border-radius:999px;border:1px solid transparent;white-space:nowrap}.records-page__badge--pending{color:#fcd34d;background:rgba(251,191,36,.15);border-color:rgba(251,191,36,.35)}.records-page__badge--done{color:#6ee7b7;background:rgba(72,187,120,.15);border-color:rgba(72,187,120,.3)}.records-page__badge--cancelled{color:var(--muted);background:hsla(0,0%,100%,.06);border-color:var(--border-subtle)}@media (max-width:520px){.records-page__order{grid-template-columns:64px 1fr}.records-page__aside{grid-column:1/-1;flex-direction:row;align-items:center;justify-content:space-between;width:100%}.records-page__thumb{width:64px;height:64px}}.records-page__empty{flex-direction:column;padding:2.5rem 1.5rem 2rem;text-align:center}.records-page__empty,.records-page__empty-icon{display:flex;align-items:center;justify-content:center}.records-page__empty-icon{width:72px;height:72px;margin-bottom:1rem;border-radius:50%;background:hsla(0,0%,100%,.05);border:1px solid var(--border-subtle);color:var(--muted)}.records-page__empty-icon svg{width:36px;height:36px;opacity:.85}.records-page__empty-text{margin:0 0 1.25rem;font-size:.95rem;color:var(--muted);line-height:1.5}.records-page__cta{display:inline-flex;align-items:center;justify-content:center;padding:.55rem 1.35rem;font-size:.88rem;font-weight:700;color:#0f1738;text-decoration:none;border-radius:999px;background:#fff;border:none;box-shadow:0 8px 24px rgba(10,15,40,.22);transition:transform .18s ease,box-shadow .18s ease}.records-page__cta:hover{transform:translateY(-1px);box-shadow:0 12px 28px rgba(10,15,40,.28);color:#0f1738}