:root { --app-bg:#0b1018; --app-surface:#121a27; --app-surface-2:#182235; --app-line:rgba(203,213,225,.14); --app-text:#f8fafc; --app-muted:#98a8bc; --app-primary:#f7c948; --app-primary-dark:#d9a812; --app-success:#40c98d; --app-danger:#fb7185; --app-radius:16px; --app-shadow:0 16px 40px rgba(0,0,0,.22); }
* { box-sizing:border-box; }
body.member-app { margin:0; min-height:100vh; background:radial-gradient(circle at 90% -5%, rgba(32,118,172,.17), transparent 27rem),var(--app-bg); color:var(--app-text); font-family:Inter,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif; }
.member-app a { color:inherit; }.member-layout { min-height:100vh; }.member-sidebar { position:fixed; inset:0 auto 0 0; z-index:40; width:270px; padding:22px 14px; overflow-y:auto; background:#0e1521; border-right:1px solid var(--app-line); }.member-brand { display:flex; align-items:center; gap:11px; margin:0 7px 23px; text-decoration:none; }.member-brand img { width:44px; height:44px; object-fit:cover; border-radius:12px; border:1px solid rgba(247,201,72,.36); }.member-brand strong { display:block; font-family:Poppins,sans-serif; font-size:16px; line-height:1.1; letter-spacing:-.4px; }.member-brand span { display:block; margin-top:3px; color:var(--app-primary); font-size:10px; font-weight:800; letter-spacing:1.5px; }.member-member { margin:0 7px 21px; padding:13px; border:1px solid var(--app-line); border-radius:13px; background:rgba(255,255,255,.025); }.member-member small,.member-menu-label { display:block; color:var(--app-muted); font-size:10px; font-weight:800; letter-spacing:1.1px; text-transform:uppercase; }.member-member b { display:block; margin-top:5px; font-size:14px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }.member-nav { display:grid; gap:3px; }.member-menu-label { padding:16px 12px 6px; }.member-nav a { display:flex; align-items:center; gap:11px; padding:11px 12px; border-radius:10px; color:#c7d2df; text-decoration:none; font-size:13px; font-weight:650; transition:.18s ease; }.member-nav a i { width:17px; text-align:center; color:#9aacc1; }.member-nav a:hover { color:#fff; background:rgba(255,255,255,.055); }.member-nav a.active { color:#121821; background:var(--app-primary); }.member-nav a.active i { color:#121821; }.member-nav .member-logout { margin-top:10px; color:#ffb4c0; }.member-content { min-height:100vh; margin-left:270px; padding:26px; }.member-wrap { max-width:1240px; margin:auto; }.member-header { display:flex; align-items:center; justify-content:space-between; gap:16px; margin-bottom:28px; }.member-header h1 { margin:0; font-family:Poppins,sans-serif; font-size:27px; letter-spacing:-.8px; }.member-header p { margin:4px 0 0; color:var(--app-muted); font-size:13px; }.member-header-user { display:flex; align-items:center; gap:10px; padding:8px 11px; border:1px solid var(--app-line); border-radius:12px; background:rgba(18,26,39,.82); }.member-avatar { width:34px; height:34px; display:grid; place-items:center; border-radius:50%; color:#20202a; background:var(--app-primary); font-size:13px; font-weight:900; }.member-header-user b { display:block; max-width:145px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; font-size:12px; }.member-header-user small { display:block; margin-top:2px; color:var(--app-muted); font-size:10px; }.member-card { border:1px solid var(--app-line); border-radius:var(--app-radius); background:linear-gradient(135deg,rgba(24,34,53,.9),rgba(15,23,37,.94)); box-shadow:var(--app-shadow); }.member-hero { display:flex; align-items:center; justify-content:space-between; gap:25px; padding:29px; overflow:hidden; position:relative; }.member-hero::after { content:""; position:absolute; right:-45px; bottom:-85px; width:250px; height:250px; border-radius:50%; background:radial-gradient(circle,rgba(247,201,72,.18),transparent 65%); pointer-events:none; }.member-kicker { color:var(--app-primary); font-size:11px; font-weight:800; letter-spacing:1.4px; }.member-hero h2 { margin:7px 0; font-family:Poppins,sans-serif; font-size:28px; letter-spacing:-.8px; }.member-hero p { max-width:660px; margin:0; color:var(--app-muted); font-size:14px; line-height:1.6; }.member-goal-pill { position:relative; z-index:1; flex:0 0 auto; min-width:178px; padding:15px; border:1px solid rgba(247,201,72,.27); border-radius:13px; background:rgba(247,201,72,.09); }.member-goal-pill small { display:block; color:#f5d888; font-size:10px; font-weight:800; letter-spacing:1px; }.member-goal-pill b { display:block; margin-top:5px; font-size:16px; }.member-grid { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:14px; margin:16px 0; }.member-stat { padding:18px; }.member-stat small { color:var(--app-muted); font-size:11px; font-weight:750; text-transform:uppercase; letter-spacing:.6px; }.member-stat strong { display:block; margin-top:9px; font-family:Poppins,sans-serif; font-size:22px; line-height:1.2; }.member-stat span { display:block; margin-top:5px; color:var(--app-muted); font-size:12px; }.member-section { margin-top:24px; }.member-section-title { display:flex; align-items:center; justify-content:space-between; gap:15px; margin:0 0 12px; }.member-section-title h2 { margin:0; font-family:Poppins,sans-serif; font-size:18px; }.member-section-title p { margin:0; color:var(--app-muted); font-size:12px; }.today-workout { display:grid; grid-template-columns:1fr auto; align-items:center; gap:24px; padding:24px; }.today-workout h3 { margin:0 0 6px; font-size:22px; }.today-workout p { margin:0; color:var(--app-muted); line-height:1.6; font-size:13px; }.workout-meta { display:flex; flex-wrap:wrap; gap:8px; margin-top:14px; }.workout-meta span { padding:6px 9px; border:1px solid var(--app-line); border-radius:8px; color:#dce5f0; background:rgba(4,8,15,.24); font-size:11px; }.app-button { display:inline-flex; align-items:center; justify-content:center; gap:8px; min-height:42px; padding:11px 16px; border:0; border-radius:10px; color:#151820; background:var(--app-primary); text-decoration:none; font-size:13px; font-weight:850; cursor:pointer; transition:.2s ease; }.app-button:hover { background:#ffe27b; transform:translateY(-1px); }.app-button.secondary { color:#dce5f0; background:transparent; border:1px solid var(--app-line); }.empty-state { padding:21px; color:var(--app-muted); font-size:13px; line-height:1.6; }.recommend-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:14px; }.recommend-card { padding:18px; }.recommend-card i { color:var(--app-primary); font-size:18px; }.recommend-card h3 { margin:10px 0 5px; font-size:14px; }.recommend-card p { margin:0; color:var(--app-muted); font-size:12px; line-height:1.55; }.member-mobile-head,.member-mobile-nav,.member-mobile-overlay { display:none; }
@media(max-width:980px){ .member-sidebar { width:244px; }.member-content { margin-left:244px; }.member-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }.recommend-grid { grid-template-columns:1fr; } }
@media(max-width:760px){ body.member-app { padding-bottom:72px; }.member-sidebar { top:64px; width:min(290px,86vw); transform:translateX(-105%); transition:transform .24s ease; box-shadow:12px 0 40px rgba(0,0,0,.35); }.member-sidebar.open { transform:translateX(0); }.member-mobile-head { position:sticky; top:0; z-index:60; display:flex; align-items:center; justify-content:space-between; height:64px; padding:0 15px; background:#0e1521; border-bottom:1px solid var(--app-line); }.member-mobile-head a { display:flex; align-items:center; gap:8px; color:#fff; text-decoration:none; font-size:13px; font-weight:800; }.member-mobile-head img { width:35px; height:35px; object-fit:cover; border-radius:10px; }.member-menu-toggle { width:39px; height:39px; border:1px solid var(--app-line); border-radius:10px; color:#fff; background:#182235; font-size:17px; }.member-mobile-overlay { position:fixed; inset:64px 0 0; z-index:35; background:rgba(0,0,0,.58); }.member-mobile-overlay.show { display:block; }.member-content { margin:0; padding:15px; }.member-header { margin-bottom:17px; }.member-header h1 { font-size:22px; }.member-header-user { padding:6px; }.member-header-user div:not(.member-avatar) { display:none; }.member-hero { align-items:flex-start; flex-direction:column; padding:21px; }.member-hero h2 { font-size:24px; }.member-goal-pill { width:100%; }.member-grid { grid-template-columns:repeat(2,minmax(0,1fr)); gap:10px; }.member-stat { padding:14px; }.member-stat strong { font-size:18px; }.today-workout { grid-template-columns:1fr; padding:19px; }.today-workout .app-button { width:100%; }.member-mobile-nav { position:fixed; z-index:65; bottom:0; left:0; right:0; display:grid; grid-template-columns:repeat(4,1fr); height:66px; padding:7px 5px; background:#0e1521; border-top:1px solid var(--app-line); }.member-mobile-nav a { display:grid; place-content:center; gap:3px; color:#91a2b6; text-align:center; text-decoration:none; font-size:10px; font-weight:750; }.member-mobile-nav a i { font-size:16px; }.member-mobile-nav a.active { color:var(--app-primary); } }

/* Legacy member-page bridge: keeps existing content while applying the shared platform frame. */
.member-shell { min-height:100vh; background:radial-gradient(circle at 90% -5%,rgba(32,118,172,.17),transparent 27rem),var(--app-bg); color:var(--app-text); font-family:Inter,system-ui,sans-serif; }.member-shell .member-content { background:transparent; }.member-page-body { width:100%; max-width:100%; color:var(--app-text); }.member-page-body .goal-card,.member-page-body .progress-card,.member-page-body .profile-card,.member-page-body .attendance-card,.member-page-body .summary-card,.member-page-body .diet-plan { border:1px solid var(--app-line); border-radius:var(--app-radius); background:linear-gradient(135deg,rgba(24,34,53,.9),rgba(15,23,37,.94)); box-shadow:var(--app-shadow); }.member-page-body .page-header { text-align:left; margin:0 0 20px; }.member-page-body .page-header h1,.member-page-body .goal-card h2,.member-page-body .progress-card h2,.member-page-body .profile-card h2 { color:var(--app-text); }.member-page-body .page-header p,.member-page-body .goal-card p { color:var(--app-muted); }.member-page-body input,.member-page-body select,.member-page-body textarea { border-color:var(--app-line); background:#0e1624; color:var(--app-text); }.member-page-body .primary-btn,.member-page-body #saveGoalBtn,.member-page-body #markAttendanceBtn { color:#151820; background:var(--app-primary); }.member-page-body .profile-card,.member-page-body .progress-card,.member-page-body .goal-card { margin-bottom:16px; }.member-page-body .info-box,.member-page-body .stat-card,.member-page-body .progress-item,.member-page-body .box { border:1px solid var(--app-line); background:rgba(6,12,22,.38); }.member-page-body .info-box:hover,.member-page-body .stat-card:hover { color:var(--app-text); background:rgba(247,201,72,.08); border-color:rgba(247,201,72,.4); transform:none; }.member-page-body .chart-card { width:100%; height:360px; border:1px solid var(--app-line); border-radius:var(--app-radius); background:rgba(6,12,22,.28); }.member-page-body .home-logo { display:none; }.member-page-body .top-bar { display:none; }