.scroll-container {
    height: 100%;
    width: 100%;
    overflow-x: hidden;
    overflow-y: auto;
    box-sizing: border-box;
    background: var(--gradient-sky);
    --spacing-xs: 4px;
    --spacing-sm: 8px;
    --spacing-md: 16px;
    --spacing-lg: 24px;
    --spacing-xl: 32px;
    --font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
    --font-size-xs: 11px;
    --font-size-sm: 12px;
    --font-size-base: 14px;
    --font-size-md: 16px;
    --font-size-lg: 18px;
    --font-size-xl: 20px;
    --font-size-2xl: 22px;
    --font-size-3xl: 24px;
    --font-size-4xl: 28px;
    --font-size-5xl: 32px;
}

.scroll-container > view {
    width: 100%;
}

.member-page {
    width: 100%;
    min-height: 100%;
    height: auto;
    overflow: visible;
    position: relative;
    flex-shrink: 0;
    display: flex;
    flex-direction: column;
    align-items: stretch;
    background: var(--gradient-sky);
    box-sizing: border-box;
    padding-bottom: calc(120rpx + env(safe-area-inset-bottom));
}

.member-page__body {
    width: 100%;
    height: auto;
    flex: 1;
    position: relative;
    flex-shrink: 0;
    display: flex;
    flex-direction: column;
    align-items: stretch;
}

.member-page__sections {
    display: flex;
    flex-direction: column;
    gap: 12px;
    align-items: stretch;
    padding: var(--spacing-md, 16px);
    padding-bottom: calc(var(--spacing-md, 16px) + env(safe-area-inset-bottom));
    width: 100%;
    box-sizing: border-box;
    position: relative;
    font-family: var(--font-family);
}

.member-page__sections text {
    font-family: var(--font-family);
}

/* ????????? */
.status-bar,
.profile-header,
.member-card-section,
.quick-actions,
.booking-section,
.checkin-section,
.body-report-section,
.coupon-section,
.referral-section,
.settings-section,
.logout-btn__border-wrap,
.logout-section {
    width: 100%;
    box-sizing: border-box;
}