* { margin: 0; padding: 0; box-sizing: border-box; -webkit-tap-highlight-color: transparent; }
:root {
  --bg: #0f0f1a;
  --surface: #1a1a2e;
  --surface-2: #24243e;
  --surface-dim: #12121d;
  --surface-container: #1f1e2a;
  --surface-high: #292935;
  --primary: #8b5cf6;
  --primary-soft: #d0bcff;
  --primary-tint: #7c3aed;
  --on-primary: #3c0091;
  --gold: #ffb95f;
  --success: #4ae176;
  --danger: #ffb4ab;
  --text: #f0f0f4;
  --text-2: #cbc3d7;
  --text-3: #6b6b80;
  --outline: #958ea0;
  --outline-variant: #494454;
  --surface-container-low: #1b1a26;
  --surface-container-highest: #343440;
  --surface-elevated: #24243e;
  --surface-variant: #343440;
  --nav-bg: #16162a;
}
html, body { height: 100%; overflow: hidden; background: var(--bg); color: var(--text); font-family: -apple-system, BlinkMacSystemFont, sans-serif; font-size: 14px; }

/* Splash */
.splash { position: fixed; inset: 0; z-index: 9999; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 18px; background: #0f0f1a; transition: opacity .45s; }
.splash.fade-out { opacity: 0; pointer-events: none; }
.splash-spinner { width: 34px; height: 34px; border: 3px solid rgba(139,92,246,.15); border-top-color: #8b5cf6; border-radius: 50%; animation: spin .8s linear infinite; }
@keyframes spin { to { transform: rotate(360deg); } }
.splash-logo {
  font-weight: 800;
  font-size: 34px;
  letter-spacing: 1.5px;
  background: linear-gradient(90deg, #d0bcff, #8b5cf6 45%, #ffb95f);
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
  filter: drop-shadow(0 0 20px rgba(139,92,246,.5));
  animation: splashLogo 2.2s ease-in-out infinite;
}
@keyframes splashLogo {
  0%, 100% { opacity: .85; transform: scale(1); }
  50% { opacity: 1; transform: scale(1.03); }
}
.splash-tag { font-size: 12px; color: #6b6b80; letter-spacing: .5px; margin-top: -12px; }

/* App */
#app { display: flex; flex-direction: column; height: 100%; }

/* Header */
.header { display: flex; align-items: center; padding: 12px 16px; background: rgba(15,15,26,.8); backdrop-filter: blur(16px); -webkit-backdrop-filter: blur(16px); border-bottom: 1px solid rgba(255,255,255,.05); font-size: 13px; flex-shrink: 0; position: sticky; top: 0; z-index: 50; }
.header-title {
  font-weight: 800;
  font-size: 19px;
  letter-spacing: .3px;
  background: linear-gradient(90deg, var(--primary-soft), var(--primary) 45%, var(--gold));
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
  text-shadow: 0 0 18px rgba(139,92,246,.25);
}
.header-date { margin-left: 12px; color: var(--text-2); flex: 1; }

/* Main */
.main { flex: 1; overflow-y: auto; padding: 12px; -webkit-overflow-scrolling: touch; }

/* Pages */
.page { display: none; }
.page.active { display: block; }

/* Cards */
.card { background: var(--surface); border-radius: 12px; margin-bottom: 12px; overflow: hidden; }
.card-title { display: flex; align-items: center; padding: 12px 14px; font-weight: 600; font-size: 14px; border-bottom: 1px solid rgba(255,255,255,.04); }

/* Buttons */
.btn { display: block; padding: 12px 16px; border: none; border-radius: 12px; font-size: 14px; font-weight: 700; cursor: pointer; text-align: center; transition: transform .12s, box-shadow .12s, opacity .12s; }
.btn:active { transform: scale(.96); opacity: .85; }
.btn-primary { background: linear-gradient(135deg, var(--primary), var(--primary-tint)); color: #fff; box-shadow: 0 4px 14px rgba(139,92,246,.35); }
.btn-success { background: linear-gradient(135deg, #4ae176, #22c55e); color: #04210f; box-shadow: 0 4px 14px rgba(74,225,118,.25); }
.btn-secondary { background: var(--surface-2); color: var(--text); border: 1px solid rgba(255,255,255,.07); }
.btn-sm { font-size: 12px; padding: 7px 13px; display: inline-block; border-radius: 10px; }
.btn-block { width: 100%; }
.btn:disabled { opacity: .4; pointer-events: none; }

/* Dashboard */
.dash-ring-wrap { position: relative; width: 130px; height: 130px; margin: 16px auto 8px; }
.dash-ring { transform: rotate(-90deg); width: 130px; height: 130px; }
.ring-bg { fill: none; stroke: var(--surface-2); stroke-width: 8; }
.ring-fg { fill: none; stroke: var(--primary); stroke-width: 8; stroke-linecap: round; }
.dash-ring-text { position: absolute; inset: 0; display: flex; flex-direction: column; align-items: center; justify-content: center; }
.dash-cals { font-size: 32px; font-weight: 700; line-height: 1; }
.dash-cals-sub { font-size: 13px; color: var(--text-3); margin-top: 2px; }
.dash-macros { text-align: center; font-size: 12px; color: var(--text-2); margin: 0 14px 8px; }
.dash-empty { text-align: center; padding: 12px; color: var(--text-3); font-size: 13px; }
.dash-meals { padding: 0 14px 8px; }
.dash-meal-row { font-size: 12px; color: var(--text-2); padding: 4px 0; border-bottom: 1px solid rgba(255,255,255,.03); }
.dash-meal-row:last-child { border: none; }
.dash-meal-row::before { content: "🍽 "; }

/* Photo input */
.photo-input-area { padding: 12px 14px; }
.btn-gallery { margin-bottom: 8px; background: var(--surface-2); color: var(--text); width: 100%; }
.photo-placeholder { display: flex; flex-direction: column; align-items: center; padding: 26px; border: 2px dashed var(--outline-variant); border-radius: 12px; cursor: pointer; transition: border-color .2s; background: var(--surface-2); gap: 6px; }
.photo-placeholder:active { border-color: var(--primary); }
.photo-icon { font-size: 40px; margin-bottom: 8px; }
.photo-label { font-size: 15px; color: var(--text-2); }
.photo-sublabel { font-size: 12px; color: var(--text-3); margin-top: 4px; }
.photo-preview { width: 100%; max-height: 300px; object-fit: contain; border-radius: 10px; }
.photo-actions { display: flex; gap: 8px; margin-top: 8px; }

/* Input */
.input-area { display: block; width: 100%; background: var(--surface-2); border: none; border-radius: 10px; padding: 12px 14px; color: var(--text); font-size: 14px; font-family: inherit; margin: 8px 0; resize: vertical; min-height: 60px; }
.input-area::placeholder { color: var(--text-3); }

/* Analysis result */
.analysis-card { padding: 14px; }
.analysis-name { font-size: 16px; font-weight: 600; margin-bottom: 4px; }
.analysis-portion { font-size: 12px; color: var(--text-3); margin-bottom: 10px; }
.analysis-macros { display: flex; gap: 12px; font-size: 13px; color: var(--text-2); margin-bottom: 12px; }
.analysis-actions { display: flex; flex-direction: column; gap: 6px; }

/* Meals list */
.meals-list { padding: 10px 14px 4px; display:flex; flex-direction:column; gap:8px; }
.meal-item { display: flex; align-items: center; gap: 10px; padding: 10px; background: var(--surface-container-low); border: 1px solid rgba(255,255,255,.06); border-radius: 10px; }
.meal-thumb { width: 44px; height: 44px; border-radius: 10px; background: var(--surface-variant); overflow: hidden; flex-shrink: 0; display: flex; align-items: center; justify-content: center; }
.meal-thumb img { width: 100%; height: 100%; object-fit: cover; }
.meal-thumb .ms-icon { font-size: 22px; color: var(--text-3); }
.meal-info { flex: 1; min-width: 0; }
.meal-top { display: flex; justify-content: space-between; align-items: flex-start; gap: 8px; }
.meal-name { font-size: 13px; font-weight: 700; color: var(--text); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.meal-cal { font-size: 13px; font-weight: 700; color: var(--primary-soft); flex-shrink: 0; }
.meal-meta { display: flex; align-items: center; gap: 6px; margin-top: 3px; }
.meal-portion { font-size: 10px; color: var(--text-3); }
.meal-dot { width: 3px; height: 3px; border-radius: 50%; background: var(--outline-variant); }
.meal-macros { font-size: 10px; color: var(--text-3); }
.meal-macros b { font-weight:700; }
.meal-macros i { font-style:normal; color:var(--text-3); opacity:.5; }
.meal-del { background: none; border: none; color: var(--danger); font-size: 15px; cursor: pointer; padding: 4px; flex-shrink: 0; }
.card-title-count { font-size: 11px; color: var(--text-3); font-weight: 500; }

/* Totals */
.totals-bar { padding: 10px 14px; border-top: 1px solid rgba(255,255,255,.04); }
.totals-row { display: flex; justify-content: space-between; font-size: 12px; color: var(--text-2); }

/* Empty */
.empty-tab { display: flex; flex-direction: column; align-items: center; justify-content: center; min-height: 50vh; text-align: center; }
.empty-icon { font-size: 48px; margin-bottom: 12px; }
.empty-text { font-size: 17px; font-weight: 600; margin-bottom: 6px; }
.empty-sub { font-size: 13px; color: var(--text-3); }

/* Edit card (analysis result) */
.edit-card { padding: 14px; }
.edit-row { display: flex; align-items: center; gap: 8px; margin-bottom: 8px; }
.edit-label { font-size: 12px; color: var(--text-2); width: 60px; flex-shrink: 0; }
.edit-input { flex: 1; background: var(--surface-2); border: none; border-radius: 8px; padding: 8px 10px; color: var(--text); font-size: 14px; font-family: inherit; }
.edit-short { width: 80px; flex: none; text-align: center; }
.edit-tiny { width: 60px; flex: none; text-align: center; }
.edit-unit { font-size: 12px; color: var(--text-3); }
.edit-macros-row { display: flex; gap: 6px; margin: 10px 0; }
.edit-macro { flex: 1; text-align: center; }
.edit-macro .edit-label { width: auto; display: block; font-size: 10px; margin-bottom: 2px; white-space: nowrap; }
.edit-macro .edit-input { width: 100%; }
.edit-actions { display: flex; flex-direction: column; gap: 6px; margin-top: 8px; }

/* Bottom nav */
.bottom-nav { display: flex; flex-shrink: 0; background: var(--nav-bg); border-top: 1px solid rgba(255,255,255,.04); padding: 4px 0; padding-bottom: max(4px, env(safe-area-inset-bottom)); }
.nav-item { flex: 1; display: flex; flex-direction: column; align-items: center; padding: 6px 0; cursor: pointer; color: var(--text-3); transition: color .15s; user-select: none; }
.nav-item svg { width: 22px; height: 22px; margin-bottom: 2px; }
.nav-item span { font-size: 10px; }
.nav-item.active { color: var(--primary); }

/* Set list */
.set-list { padding: 8px 14px; }
.set-row { display: flex; align-items: center; gap: 8px; padding: 6px 0; border-bottom: 1px solid rgba(255,255,255,.03); font-size: 13px; }
.set-row:last-child { border-bottom: none; }
.set-badge { width: 24px; height: 24px; display: flex; align-items: center; justify-content: center; border-radius: 50%; font-size: 11px; font-weight: 700; color: var(--text-3); }
.set-badge.warmup { color: var(--gold); }
.set-val { flex: 1; font-weight: 500; }
.set-del { background: none; border: none; color: var(--danger); cursor: pointer; font-size: 14px; padding: 2px; }
.set-add-row { display: flex; align-items: center; gap: 6px; margin-top: 8px; }
.set-add-row input { background: var(--surface-2); border: none; border-radius: 8px; padding: 8px; width: 60px; text-align: center; color: var(--text); font-size: 14px; }
.set-times { color: var(--text-3); font-size: 14px; }
.set-section-title { font-size: 11px; color: var(--text-3); padding: 6px 0 2px; font-weight: 600; }
.btn-warmup { background: rgba(255,185,95,.15); color: var(--gold); }
.ex-remove { background: none; border: none; color: var(--text-3); cursor: pointer; font-size: 14px; margin-left: auto; padding: 4px; }
.ex-no-sets { font-size: 12px; color: var(--text-3); padding: 8px 0; text-align: center; }

/* Modal */
.modal-overlay { position: fixed; inset: 0; z-index: 999; background: rgba(0,0,0,.7); display: flex; align-items: flex-end; justify-content: center; }
.modal { background: var(--surface); border-radius: 16px 16px 0 0; width: 100%; max-width: 420px; max-height: 80vh; overflow-y: auto; padding: 16px; }
.modal-title { font-size: 16px; font-weight: 600; margin-bottom: 12px; display: flex; align-items: center; justify-content: space-between; gap: 8px; }
.modal-close { background: var(--surface-2); border: none; color: var(--text-2); width: 30px; height: 30px; border-radius: 50%; font-size: 14px; cursor: pointer; display: flex; align-items: center; justify-content: center; flex-shrink: 0; }
.modal-close:active { transform: scale(.9); }

/* Muscle grid */
.muscle-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 8px; margin-bottom: 12px; }
.muscle-tile { position: relative; background: var(--surface-2); border-radius: 12px; padding: 10px 6px; text-align: center; cursor: pointer; transition: all .15s; height: 88px; display: flex; flex-direction: column; justify-content: flex-end; align-items: center; overflow: hidden; background-size: cover; background-position: center; }
.muscle-tile:active { transform: scale(.96); }
.muscle-tile-ov { position: absolute; inset: 0; background: linear-gradient(to top, rgba(10,10,20,.8) 0%, rgba(10,10,20,.15) 55%, rgba(10,10,20,.05) 100%); }
.muscle-label { font-size: 12px; color: var(--text-2); margin-top: 6px; position: relative; z-index: 1; font-weight: 600; text-shadow: 0 1px 4px rgba(0,0,0,.6); }

/* Exercise picker */
.ex-picker { margin-bottom: 12px; }
.ex-group { margin-bottom: 8px; }
.ex-group-head { display: flex; align-items: center; gap: 8px; padding: 10px 12px; background: var(--surface-2); border-radius: 10px; cursor: pointer; font-size: 13px; }
.ex-group-head:active { opacity: .7; }
.ex-count { margin-left: auto; font-size: 11px; color: var(--text-3); }
.ex-icon { color: var(--text-3); }
.ex-group-list { padding: 4px 0; }
.ex-pick { padding: 10px 12px; cursor: pointer; font-size: 13px; border-bottom: 1px solid rgba(255,255,255,.03); }
.ex-pick:last-child { border: none; }
.ex-pick:active { background: var(--surface-2); }

/* Program list */
.prog-list { padding: 4px 14px; }
.prog-item { display: flex; align-items: center; gap: 6px; padding: 8px 0; border-bottom: 1px solid rgba(255,255,255,.03); font-size: 13px; }
.prog-item:last-child { border-bottom: none; }
.prog-item-info { flex: 1; }
.prog-item-info b { display: block; font-size: 13px; }
.prog-item-info span { font-size: 11px; }

/* Program editor */
.prog-editor { margin-bottom: 12px; }
.prog-day-block { background: var(--surface-2); border-radius: 10px; padding: 10px; margin-bottom: 8px; }
.prog-day-head { display: flex; align-items: center; gap: 8px; margin-bottom: 6px; }
.input-inline { background: transparent; border: none; color: var(--text); font-size: 13px; font-weight: 600; flex: 1; padding: 4px 0; }
.prog-day-exes { }
.prog-ex-row { display: flex; align-items: center; gap: 6px; padding: 4px 0; font-size: 12px; }
.prog-ex-row span:first-child { flex: 1; }


.last-set-hint { font-size:11px;color:var(--text-3);padding:4px 14px 0; }


/* ===== Calendar ===== */
.cal-head { display:flex; align-items:center; gap:8px; padding:12px 4px; }
.cal-title { flex:1; font-weight:700; font-size:16px; text-align:center; color:var(--text); }

/* ===== Material Symbols ===== */
.ms-icon { font-family:'Material Symbols Outlined'; font-weight:normal; font-style:normal; display:inline-block; line-height:1; letter-spacing:normal; text-transform:none; white-space:nowrap; word-wrap:normal; direction:ltr; -webkit-font-smoothing:antialiased; font-variation-settings:'FILL' 1; user-select:none; }
.icon-btn { width:34px; height:34px; border-radius:50%; background:var(--surface-2); border:1px solid rgba(255,255,255,.07); color:var(--text-2); display:flex; align-items:center; justify-content:center; cursor:pointer; transition:transform .1s, background .15s; flex-shrink:0; }
.icon-btn:active { transform:scale(.88); }
.icon-btn .ms-icon { font-size:20px; }
.cal-fire { color:var(--gold); font-size:10px; }
.cal-food { color:var(--success); font-size:10px; }
.cal-plan { color:var(--primary-soft); font-size:10px; }
.cal-streak { background:var(--gold); color:#0f0f1a; font-size:12px; font-weight:800; padding:4px 10px; border-radius:999px; box-shadow:0 0 12px rgba(255,185,95,.35); white-space:nowrap; }
.cal-card { background:var(--surface); border:1px solid rgba(255,255,255,.06); border-radius:12px; padding:12px; margin-bottom:10px; }
.cal-grid { display:grid; grid-template-columns:repeat(7,1fr); gap:4px; }
.cal-dow { text-align:center; font-size:11px; color:var(--text-3); font-weight:600; padding:4px 0 8px; }
.cal-cell { aspect-ratio:1/1; background:var(--surface-container); border-radius:10px; display:flex; flex-direction:column; align-items:center; justify-content:center; cursor:pointer; min-height:38px; transition:transform .1s; }
.cal-cell:active { transform:scale(.92); }
.cal-cell.empty { background:transparent; cursor:default; }
.cal-cell.today { background:var(--primary); box-shadow:0 0 14px rgba(139,92,246,.45); }
.cal-cell.today .cal-num { color:#fff; font-weight:800; }
.cal-cell.today .cal-marks { filter:brightness(1.25); }
.cal-cell.selected { background:var(--gold); }
.cal-cell.selected .cal-num { color:#0f0f1a; font-weight:800; }
.cal-cell.selected .cal-marks { filter:brightness(.85); }
.cal-cell.has-workout:not(.today):not(.selected) { background:rgba(255,185,95,.14); }
.cal-cell.has-meals:not(.today):not(.selected) { background:rgba(74,225,118,.08); }
.cal-num { font-size:12px; font-weight:600; color:var(--text); }
.cal-marks { font-size:8px; line-height:1; display:flex; gap:1px; }
.cal-food { color:var(--success); }
.cal-cell.has-meals { background:rgba(74,225,118,.08); }

.cal-day { padding:0; }
.cal-day-title { font-weight:700; font-size:14px; margin-bottom:6px; text-transform:capitalize; color:var(--text); }
.cal-day-row { font-size:13px; padding:3px 0; color:var(--text-2); }
.cal-day-row.muted { color:var(--text-3); }
.cal-day-ex { display:flex; flex-wrap:wrap; gap:4px; margin-top:6px; }
.cal-day-ex span.cal-pill { background:var(--surface-2); color:var(--text-2); border:1px solid rgba(255,255,255,.06); border-radius:999px; font-size:11px; padding:4px 10px; }
.cal-day-ex span.cal-pill b { color:var(--text); font-weight:700; }
.cal-day-empty { color:var(--text-3); font-size:13px; padding:4px 0; }
.cal-summary { padding:0; }
.cal-stat-row { display:flex; justify-content:space-between; font-size:13px; padding:6px 0; border-bottom:1px solid rgba(255,255,255,.06); color:var(--text-2); }
.cal-stat-row b { color:var(--text); }
.cal-stat-row:last-child { border-bottom:none; }
.cal-compare b { font-size:12px; color:var(--text-2); }

/* ===== Stats ===== */
.stat-kpis { display:grid; grid-template-columns:1fr 1fr; gap:8px; margin-bottom:10px; }
.stat-kpi { background:var(--surface); border:1px solid rgba(255,255,255,.07); border-radius:12px; padding:10px; }
.stat-kpi-val { font-size:18px; font-weight:800; color:var(--text); }
.stat-kpi-label { font-size:11px; color:var(--text-2); margin-top:2px; }
.stat-kpi-sub { font-size:10px; color:var(--text-3); }
.stat-card { padding:12px; margin-bottom:10px; }
.stat-card-title { font-weight:700; font-size:14px; color:var(--text); margin-bottom:10px; }
.stat-bars { display:flex; align-items:flex-end; gap:6px; height:70px; margin-bottom:4px; }
.stat-bar-col { flex:1; display:flex; flex-direction:column; align-items:center; gap:4px; height:100%; justify-content:flex-end; }
.stat-bar { width:100%; max-width:26px; background:var(--primary); border-radius:4px 4px 0 0; min-height:4px; opacity:.85; }
.stat-bar-label { font-size:9px; color:var(--text-3); }
.stat-sub { font-size:12px; color:var(--text-2); margin-top:6px; }
.stat-sub b { color:var(--text); }
.stat-top-row { display:flex; align-items:center; gap:8px; padding:5px 0; border-bottom:1px solid rgba(255,255,255,.05); font-size:13px; }
.stat-top-row:last-child { border-bottom:none; }
.stat-top-num { width:18px; height:18px; border-radius:50%; background:var(--surface-2); color:var(--text-2); font-size:11px; font-weight:700; display:flex; align-items:center; justify-content:center; flex-shrink:0; }
.stat-top-name { flex:1; color:var(--text-2); }
.stat-top-row b { color:var(--text); }
.stat-muscle-row { display:flex; align-items:center; gap:8px; padding:4px 0; font-size:12px; }
.stat-muscle-name { width:70px; color:var(--text-2); flex-shrink:0; }
.stat-muscle-bar { flex:1; background:var(--surface-2); border-radius:4px; height:8px; overflow:hidden; }
.stat-muscle-fill { height:100%; background:var(--success); border-radius:4px; }
.stat-muscle-row b { color:var(--text); width:30px; text-align:right; }

/* ===== Stats v2 ===== */
.stat-header { display:flex; align-items:flex-start; justify-content:space-between; padding:12px 14px; background:var(--surface); border-radius:12px; border:1px solid rgba(255,255,255,.07); margin-bottom:10px; }
.stat-month-val { font-size:20px; font-weight:800; color:var(--text); line-height:1.1; }
.stat-month-label { font-size:11px; color:var(--text-3); margin-top:4px; }
.stat-streak { font-size:13px; font-weight:700; color:var(--gold); padding:4px 8px; background:rgba(255,185,95,.12); border-radius:8px; flex-shrink:0; }
.stat-card { padding:12px 14px; margin-bottom:10px; background:var(--surface); border:1px solid rgba(255,255,255,.07); border-radius:12px; }
.stat-card-title { font-weight:700; font-size:13px; color:var(--text); margin-bottom:10px; }
.stat-bars { display:flex; align-items:flex-end; gap:5px; height:58px; margin-bottom:4px; }
.stat-bar-col { flex:1; display:flex; flex-direction:column; align-items:center; gap:4px; height:100%; justify-content:flex-end; }
.stat-bar { width:100%; max-width:26px; background:var(--primary); border-radius:4px 4px 0 0; min-height:3px; opacity:.85; }
.stat-bar-label { font-size:9px; color:var(--text-3); }
.stat-trend { display:flex; align-items:flex-end; gap:3px; height:50px; }
.stat-trend-col { flex:1; display:flex; flex-direction:column; align-items:center; gap:3px; height:100%; justify-content:flex-end; }
.stat-trend-bar { width:100%; max-width:18px; background:#10b981; border-radius:3px 3px 0 0; min-height:2px; opacity:.7; }
.stat-trend-label { font-size:8px; color:var(--text-3); }
.stat-pr-row { display:flex; align-items:center; gap:6px; padding:4px 0; border-bottom:1px solid rgba(255,255,255,.05); font-size:12px; }
.stat-pr-row:last-child { border-bottom:none; }
.stat-pr-name { flex:1; color:var(--text-2); overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.stat-pr-val { color:var(--gold); font-weight:700; min-width:48px; text-align:right; }
.stat-pr-date { color:var(--text-3); font-size:10px; min-width:24px; text-align:right; }
.stat-top-row { display:flex; align-items:center; gap:6px; padding:5px 0; border-bottom:1px solid rgba(255,255,255,.05); font-size:12px; }
.stat-top-row:last-child { border-bottom:none; }
.stat-top-num { width:18px; height:18px; border-radius:50%; background:var(--surface-2); color:var(--text-2); font-size:10px; font-weight:700; display:flex; align-items:center; justify-content:center; flex-shrink:0; }
.stat-top-name { flex:0 0 90px; color:var(--text-2); overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.stat-vol-bar { flex:1; background:var(--surface-2); border-radius:3px; height:6px; overflow:hidden; }
.stat-vol-fill { height:100%; background:var(--primary); border-radius:3px; }
.stat-top-row b { color:var(--text); font-size:11px; min-width:42px; text-align:right; }
.stat-muscle-row { display:flex; align-items:center; gap:6px; padding:4px 0; font-size:12px; }
.stat-muscle-name { width:80px; color:var(--text-2); flex-shrink:0; }
.stat-muscle-bar { flex:1; background:var(--surface-2); border-radius:3px; height:8px; overflow:hidden; }
.stat-muscle-fill { height:100%; background:#10b981; border-radius:3px; }
.stat-muscle-row b { color:var(--text); min-width:50px; text-align:right; font-size:11px; }
.stat-cardio { font-size:14px; font-weight:700; color:var(--text); }
.stat-cal-row { font-size:13px; color:var(--text-2); margin-bottom:8px; }
.stat-cal-row b { color:var(--text); }
.stat-macros { display:flex; height:8px; border-radius:4px; overflow:hidden; background:var(--surface-2); margin-bottom:4px; }
.stat-macro { height:100%; }
.stat-macro-p { background:#3b82f6; }
.stat-macro-f { background:var(--gold); }
.stat-macro-c { background:#10b981; }
.stat-macros-label { font-size:11px; color:var(--text-3); }


.stat-cardio-sub { font-size:11px; color:var(--text-3); margin-top:2px; }

/* ===== Profile ===== */
.profile-avatar { width:34px; height:34px; border-radius:50%; background:var(--primary); display:flex; align-items:center; justify-content:center; cursor:pointer; font-size:14px; color:var(--text); flex-shrink:0; margin-left:8px; user-select:none; }
.profile-top { display:flex; align-items:center; gap:12px; margin-bottom:12px; }
.profile-name { font-size:18px; font-weight:800; color:var(--text); }
.profile-stats { display:grid; grid-template-columns:1fr 1fr 1fr 1fr; gap:6px; margin-bottom:12px; }
.profile-stat { background:var(--surface-2); border-radius:10px; padding:8px 4px; text-align:center; }
.profile-stat b { display:block; font-size:15px; color:var(--text); }
.profile-stat span { font-size:9px; color:var(--text-3); }
.profile-section { font-size:13px; font-weight:700; color:var(--text); margin:12px 0 6px; }
.profile-goal-row { display:flex; gap:6px; margin-top:6px; }
.profile-input { flex:1; background:var(--surface-2); border:1px solid rgba(255,255,255,.1); border-radius:8px; color:var(--text); padding:8px 10px; font-size:14px; min-width:0; }
.profile-input::placeholder { color:var(--text-3); }
.profile-wlabel { font-size:10px; color:var(--text-3); margin-bottom:4px; }
.profile-meas-list { margin-top:6px; }
.profile-meas-row { display:flex; align-items:center; gap:8px; padding:5px 0; border-bottom:1px solid rgba(255,255,255,.05); font-size:13px; color:var(--text-2); }
.profile-meas-row:last-child { border-bottom:none; }
.profile-meas-date { flex:1; color:var(--text-3); font-size:11px; }
.profile-meas-del { cursor:pointer; color:var(--text-3); padding:0 4px; font-size:13px; }
.profile-empty { font-size:12px; color:var(--text-3); padding:8px 0; }

.prog-ex-name { flex:1; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; font-size:12px; }
.prog-set-input { width:40px; background:var(--surface-2); border:1px solid rgba(255,255,255,.1); border-radius:6px; color:var(--text); padding:4px 2px; text-align:center; font-size:12px; }
.prog-set-input:focus { outline:none; border-color:var(--primary); }
.prog-ex-times { color:var(--text-3); font-size:12px; margin:0 2px; }

/* ===== Toast ===== */
.toast { position:fixed; left:50%; bottom:96px; transform:translateX(-50%); background:rgba(22,22,40,.96); color:var(--text); padding:10px 18px; border-radius:12px; font-size:13px; font-weight:600; z-index:9999; border:1px solid rgba(255,255,255,.12); max-width:80%; text-align:center; opacity:0; transition:opacity .2s; pointer-events:none; box-shadow:0 4px 20px rgba(0,0,0,.4); }
.toast.show { opacity:1; }

/* ===== Dashboard v3 ===== */
.dash-wrap { position:relative; z-index:1; display:flex; flex-direction:column; gap:10px; }
.ambient { position:fixed; border-radius:50%; filter:blur(90px); pointer-events:none; z-index:0; }
.main { position:relative; z-index:1; }
.ambient-purple { top:-8%; left:-12%; width:55vw; height:55vw; background:rgba(124,58,237,.12); }
.ambient-gold { bottom:15%; right:-15%; width:45vw; height:45vw; background:rgba(255,185,95,.08); }

/* Hero ring */
.dash-hero { padding:20px 16px 16px; display:flex; flex-direction:column; align-items:center; animation:fadeUp .4s ease; }
.dash-ring-wrap { position:relative; width:168px; height:168px; margin:0 auto 14px; }
.dash-ring { transform:rotate(-90deg); width:100%; height:100%; filter:drop-shadow(0 0 12px rgba(139,92,246,.35)); }
.ring-bg { fill:none; stroke:rgba(255,255,255,.1); stroke-width:10; }
.ring-fg { fill:none; stroke:var(--primary); stroke-width:10; stroke-linecap:round; }
.dash-ring-text { position:absolute; inset:0; display:flex; flex-direction:column; align-items:center; justify-content:center; }
.dash-remain-big { font-size:34px; font-weight:800; line-height:1; color:var(--text); }
.dash-remain-over { color:var(--gold); }
.dash-remain-label { font-size:10px; font-weight:700; color:var(--primary-soft); text-transform:uppercase; letter-spacing:1px; margin-top:4px; }
.dash-remain-from { font-size:10px; color:var(--text-3); margin-top:5px; padding:2px 10px; background:rgba(255,255,255,.05); border-radius:999px; border:1px solid rgba(255,255,255,.05); }

/* Macro bars */
.dash-macros { width:100%; display:flex; flex-direction:column; gap:10px; padding:0 2px; }
.dash-macro-head { display:flex; justify-content:space-between; align-items:flex-end; padding:0 2px; margin-bottom:4px; }
.dash-macro-head span { font-size:10px; color:var(--text-3); text-transform:uppercase; letter-spacing:.4px; font-weight:600; }
.dash-macro-head b { font-size:12px; font-weight:700; }
.dash-macro-bar { height:6px; width:100%; background:rgba(255,255,255,.06); border-radius:999px; overflow:hidden; }
.dash-macro-fill { height:100%; border-radius:999px; transition:width .6s ease; }
.m-p { color:var(--primary-soft); }
.dash-macro-fill.m-p { background:linear-gradient(90deg, var(--primary-tint), var(--primary-soft)); box-shadow:0 0 8px rgba(167,139,250,.4); }
.m-f { color:var(--gold); }
.dash-macro-fill.m-f { background:linear-gradient(90deg, #ea580c, var(--gold)); box-shadow:0 0 8px rgba(255,185,95,.4); }
.m-c { color:var(--success); }
.dash-macro-fill.m-c { background:linear-gradient(90deg, #16a34a, var(--success)); box-shadow:0 0 8px rgba(74,225,118,.4); }

/* Ивент недели (bento-панель с двумя прогресс-барами) */
.event-bar-row { width:100%; }
.event-bar-head { display:flex; justify-content:space-between; align-items:baseline; margin-bottom:3px; }
.event-bar-label { font-size:9.5px; color:var(--text-3); text-transform:uppercase; letter-spacing:.4px; font-weight:600; }
.event-bar-val { font-size:10px; font-weight:700; color:var(--text-1); }

/* Bento grid */
.dash-bento { display:grid; grid-template-columns:1.7fr 1fr; gap:10px; }
.dash-bento-card { position:relative; background:var(--surface); border:1px solid rgba(255,255,255,.06); border-radius:14px; padding:12px; overflow:hidden; animation:fadeUp .45s ease; cursor:pointer; }
.dash-bento-col .dash-bento-card { padding:10px 10px; }
.dash-bento-card:nth-child(2) { animation-delay:.08s; }
.dash-bento-head { display:flex; align-items:center; gap:8px; margin-bottom:8px; }
.dash-bento-ic { width:28px; height:28px; border-radius:8px; background:rgba(139,92,246,.12); display:flex; align-items:center; justify-content:center; }
.dash-bento-ic .ms-icon { font-size:16px; color:var(--primary-soft); }
.dash-bento-label { font-size:11px; color:var(--text-3); font-weight:600; }
.dash-bento-title { font-size:15px; font-weight:700; color:var(--text); line-height:1.25; }
.dash-bento-sub { font-size:10px; color:var(--text-3); margin-top:2px; }
.dash-bento-play { position:absolute; top:50%; margin-top:-20px; right:12px; width:40px; height:40px; border-radius:50%; background:var(--primary-tint); color:#fff; display:flex; align-items:center; justify-content:center; box-shadow:0 0 14px rgba(124,58,237,.4); animation:float 2.6s ease-in-out infinite; }
.dash-bento-play .ms-icon { font-size:24px; }
.dash-bento-col { display:flex; flex-direction:column; gap:10px; }
.dash-bento-weight { flex:1; min-height:96px; }
.dash-bento-weight .dash-bento-title { font-size:16px; }
.dash-bento-scale { color:var(--success); font-size:18px; margin-left:auto; }
.dash-bento-chart { position:absolute; left:0; right:0; bottom:0; height:44px; }
.bento-chart { width:100%; height:100%; display:block; }
.dash-bento-pr-val { font-size:12px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.dash-bento-pr .dash-bento-title { font-size:13px; }

/* Actions */
.dash-actions { display:flex; gap:8px; margin-top:2px; animation:fadeUp .5s ease; }
.dash-actions .btn { flex:1; }

/* Animations */
@keyframes fadeUp { from { opacity:0; transform:translateY(10px); } to { opacity:1; transform:none; } }
@keyframes float { 0%,100% { transform:translateY(0); } 50% { transform:translateY(-3px); } }

/* Header streak pill */
.header-streak { background:var(--gold); color:#0f0f1a; font-size:12px; font-weight:800; padding:3px 10px; border-radius:999px; display:inline-flex; align-items:center; gap:3px; box-shadow:0 0 10px rgba(255,185,95,.3); }
.header-streak .ms-icon { font-size:14px; }

/* Narrow screens */
@media (max-width: 480px) {
  .dash-bento { grid-template-columns:1fr; }
  .dash-bento-col { flex-direction:row; }
  .dash-bento-col .dash-bento-card { flex:1; min-width:0; }
  .dash-bento-workout { min-width:0; }
  .dash-bento-col .dash-bento-card { flex:1; }
  .dash-ring-wrap { width:148px; height:148px; }
}

/* Smartphone tuning */
@media (max-width: 430px) {
  .dash-hero { padding:16px 12px 14px; }
  .dash-ring-wrap { width:150px; height:150px; margin-bottom:12px; }
  .ring-bg, .ring-fg { stroke-width:9; }
  .dash-remain-big { font-size:30px; }
  .dash-remain-label { font-size:9px; }
  .dash-macro-head b { font-size:11px; }
  .dash-bento { gap:8px; }
  .dash-bento-card { border-radius:12px; padding:10px; }
  .dash-bento-play { width:32px; height:32px; top:50%; margin-top:-16px; right:10px; }
  .dash-bento-play .ms-icon { font-size:20px; }
  .dash-actions .btn { font-size:13px; padding:10px 8px; }
  .dash-bento-title { font-size:14px; }
  .dash-bento-weight .dash-bento-title { font-size:15px; }
  .dash-bento-sub { font-size:9px; }
}

/* ===== Floating day summary (food) ===== */
.food-summary { position:fixed; left:12px; right:12px; bottom:calc(64px + env(safe-area-inset-bottom)); z-index:40; background:var(--surface-elevated); border:1px solid rgba(139,92,246,.25); border-radius:14px; padding:12px 14px; box-shadow:0 8px 30px rgba(0,0,0,.5); backdrop-filter:blur(12px); animation:fadeUp .35s ease; }
.food-summary-top { display:flex; justify-content:space-between; align-items:flex-end; gap:10px; }
.food-summary-label { font-size:10px; color:var(--text-3); text-transform:uppercase; letter-spacing:.5px; margin-bottom:2px; display:block; }
.food-summary-cals { display:flex; align-items:baseline; gap:5px; }
.food-summary-cals b { font-size:24px; font-weight:800; color:var(--primary-soft); line-height:1; }
.food-summary-cals span { font-size:12px; color:var(--text-2); }
.food-summary-macros { display:flex; gap:14px; margin-bottom:2px; }
.fsm { text-align:right; }
.fsm p { font-size:9px; color:var(--text-3); margin:0; }
.fsm b { font-size:13px; font-weight:700; }
.food-summary-bar { height:4px; background:var(--surface-container-highest); border-radius:999px; overflow:hidden; margin-top:10px; }
#foodSumFill { height:100%; background:linear-gradient(90deg, var(--primary), var(--primary-soft)); border-radius:999px; transition:width .5s ease; }
.food-summary-over { border-color:rgba(255,185,95,.45); }
.food-summary-over #foodSumFill { background:linear-gradient(90deg, #ea580c, var(--gold)); }
.food-summary-over .food-summary-cals b { color:var(--gold); }
/* keep food content clear of the floating panel */
.page[data-page="food"] { padding-bottom:130px; }

/* ===== Day stats bar (mockup style) ===== */
.cal-stats-bar { display:grid; grid-template-columns:repeat(3,1fr); gap:8px; padding:10px 0; border-top:1px solid rgba(255,255,255,.06); border-bottom:1px solid rgba(255,255,255,.06); margin-bottom:8px; }
.cal-stat-item { display:flex; align-items:center; gap:8px; }
.cal-stat-icon { font-size:18px; color:var(--gold); }
.cal-stat-item:nth-child(1) .cal-stat-icon { color:var(--gold); }
.cal-stat-item:nth-child(2) .cal-stat-icon { color:var(--success); }
.cal-stat-item:nth-child(3) .cal-stat-icon { color:var(--primary-soft); }
.cal-stat-item b { display:block; font-size:13px; color:var(--text); line-height:1.2; }
.cal-stat-item span:not(.ms-icon) { display:block; font-size:10px; color:var(--text-3); }

/* ===== Achievements ===== */
.ach-count { font-size:12px; color:rgba(240,240,244,.55); margin-bottom:8px; }
.ach-grid { display:grid; grid-template-columns:1fr 1fr; gap:8px; }
.ach-card { background:var(--surface-2); border:1px solid rgba(255,255,255,.06); border-radius:12px; padding:10px; }
.ach-done { border-color:rgba(255,185,95,.45); background:rgba(255,185,95,.07); }
.ach-top { display:flex; align-items:center; gap:6px; }
.ach-icon { font-size:18px; }
.ach-title { font-size:12px; font-weight:700; color:var(--text); flex:1; }
.ach-check { color:var(--gold); font-weight:900; font-size:13px; }
.ach-desc { font-size:10px; color:rgba(240,240,244,.5); margin:3px 0 6px; }
.ach-bar { height:4px; border-radius:2px; background:rgba(255,255,255,.09); overflow:hidden; }
.ach-fill { height:100%; background:linear-gradient(90deg,var(--primary),var(--gold)); border-radius:2px; }
.ach-prog { font-size:10px; color:rgba(240,240,244,.45); margin-top:3px; }

/* Achievement tabs */
.ach-tabs { display:flex; gap:8px; margin-bottom:10px; }
.ach-tab { flex:1 1 0; min-width:0; text-align:center; padding:9px 4px; border-radius:10px; background:var(--surface-2); color:rgba(240,240,244,.55); font-size:12px; font-weight:600; line-height:1.2; border:1px solid rgba(255,255,255,.06); cursor:pointer; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.ach-tab-active { background:rgba(139,92,246,.16); color:var(--text); border-color:rgba(139,92,246,.45); }

/* Achievement modal */
.ach-status { text-align:center; font-size:12px; font-weight:700; color:rgba(255,185,95,.9); }
.ach-status-done { color:var(--success); }
.ach-quote { font-size:14px; font-style:italic; color:rgba(240,240,244,.9); line-height:1.5; text-align:center; padding:12px 10px; background:rgba(139,92,246,.1); border-radius:10px; border-left:3px solid var(--primary); }
.ach-quote-author { text-align:center; font-size:12px; color:rgba(240,240,244,.55); margin-top:6px; }

/* Secret achievements */
.ach-secret { border-color:rgba(255,185,95,.4); animation:achPulse 1.7s ease-in-out infinite; }
@keyframes achPulse {
  0%,100% { box-shadow:0 0 0 0 rgba(255,185,95,.45); }
  50% { box-shadow:0 0 16px 4px rgba(255,185,95,.25); }
}
.ach-secret-icon { display:inline-block; animation:achWiggle 1.9s ease-in-out infinite; }
@keyframes achWiggle {
  0%,100% { transform:rotate(-10deg); }
  50% { transform:rotate(10deg); }
}
.ach-secret-title { color:rgba(240,240,244,.75); letter-spacing:2px; }
.ach-secret-desc { color:rgba(255,185,95,.75); font-weight:600; }

/* New achievement glow + nav badge */
.ach-new { animation:achNewGlow 1.5s ease-in-out infinite; border-color:rgba(255,185,95,.7); }
@keyframes achNewGlow {
  0%,100% { box-shadow:0 0 0 0 rgba(255,185,95,.55); }
  50% { box-shadow:0 0 18px 5px rgba(255,185,95,.3); }
}
.nav-badge { position:absolute; top:-2px; right:calc(50% - 26px); min-width:16px; height:16px; padding:0 4px; border-radius:8px; background:var(--gold); color:var(--bg); font-size:10px; font-weight:800; align-items:center; justify-content:center; }
.nav-item { position:relative; }

/* ===== Progress chart ===== */
.prog-select { width:100%; padding:9px 11px; border-radius:10px; background:var(--surface-2); color:var(--text); border:1px solid rgba(255,255,255,.1); font-size:14px; margin-bottom:10px; -webkit-appearance:none; appearance:none; }
.prog-svg { width:100%; height:auto; display:block; }
.prog-line { fill:none; stroke:var(--primary-soft); stroke-width:1.5; stroke-linecap:round; }
.prog-last { fill:var(--gold); font-size:11px; font-weight:700; }
.prog-ytick, .prog-xtick { fill:rgba(240,240,244,.55); font-size:10px; }
.prog-axis { stroke:rgba(255,255,255,.14); stroke-width:1; }
.prog-note { font-size:11px; color:rgba(240,240,244,.45); margin-top:5px; }

/* ===== Profile macros ===== */
.profile-macro-row { display:flex; align-items:center; gap:8px; margin-top:8px; }
.profile-macro-row label { font-size:12px; color:var(--text-2); width:90px; flex-shrink:0; }

/* ===== Workout screen (mockup style) ===== */
.wk-title { font-size:20px; font-weight:800; color:var(--text); margin:14px 4px 12px; }
.wk-start { display:flex; align-items:center; justify-content:center; gap:8px; padding:16px; font-size:16px; border-radius:14px; margin-bottom:12px; animation:wkPulse 2.4s ease-in-out infinite; }
@keyframes wkPulse { 0%,100% { box-shadow:0 4px 14px rgba(139,92,246,.35); } 50% { box-shadow:0 4px 24px rgba(139,92,246,.6); } }

/* Last workout card */
.wk-last { position:relative; overflow:hidden; background:linear-gradient(135deg, var(--surface-container), var(--surface-container-low)); border:1px solid rgba(255,255,255,.1); border-radius:14px; padding:14px; display:flex; align-items:center; justify-content:space-between; margin-bottom:12px; }
.wk-last-glow { position:absolute; top:-24px; right:-24px; width:96px; height:96px; background:rgba(255,185,95,.12); border-radius:50%; filter:blur(28px); pointer-events:none; }
.wk-last-body { position:relative; z-index:1; }
.wk-last-badge { display:flex; align-items:center; gap:4px; font-size:10px; font-weight:700; color:var(--gold); text-transform:uppercase; letter-spacing:.5px; margin-bottom:4px; }
.wk-last-name { font-size:15px; font-weight:700; color:var(--text); margin-bottom:6px; }
.wk-last-meta { display:flex; gap:14px; font-size:12px; color:var(--text-2); }
.wk-last-meta span { display:flex; align-items:center; gap:3px; }
.wk-last-meta .ms-icon { font-size:14px; color:var(--text-3); }
.wk-last-arrow { width:36px; height:36px; border-radius:50%; background:var(--surface-variant); display:flex; align-items:center; justify-content:center; color:var(--primary); flex-shrink:0; }
.wk-last-arrow .ms-icon { font-size:20px; }

/* Programs cards */
.wk-prog-card { padding:12px 14px; }
.wk-card-head { display:flex; align-items:center; justify-content:space-between; font-weight:700; font-size:14px; color:var(--text); margin-bottom:10px; }
.wk-add { display:flex; align-items:center; gap:2px; background:none; border:none; color:var(--primary-soft); font-size:12px; font-weight:600; cursor:pointer; padding:4px; }
.wk-prog-list { display:flex; flex-direction:column; gap:8px; }
.wk-prog-row { display:flex; align-items:center; gap:10px; background:var(--surface); border:1px solid rgba(255,255,255,.06); border-radius:12px; padding:10px; }
.wk-prog-tile { width:42px; height:42px; border-radius:10px; background:var(--surface-container-highest); border:1px solid rgba(255,255,255,.06); display:flex; align-items:center; justify-content:center; flex-shrink:0; }
.wk-prog-tile .ms-icon { font-size:20px; color:var(--primary); }
.wk-prog-info { flex:1; min-width:0; }
.wk-prog-info b { display:block; font-size:13px; color:var(--text); overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.wk-prog-info span { font-size:10px; color:var(--text-3); }
.wk-icobtn { width:32px; height:32px; border-radius:9px; background:var(--surface-container-low); border:1px solid rgba(255,255,255,.06); color:var(--text-2); display:flex; align-items:center; justify-content:center; cursor:pointer; flex-shrink:0; }
.wk-icobtn .ms-icon { font-size:16px; }
.wk-icobtn:active { transform:scale(.9); }
.wk-play { background:rgba(139,92,246,.12); border-color:rgba(139,92,246,.25); color:var(--primary); }
.wk-del { color:var(--danger); }

/* Builtin programs grid */
.wk-builtin-grid { display:grid; grid-template-columns:1fr 1fr; gap:8px; }
.wk-builtin { position:relative; height:110px; border-radius:12px; padding:10px; display:flex; flex-direction:column; justify-content:flex-end; overflow:hidden; cursor:pointer; transition:transform .12s; background-size:cover; background-position:center; }
.wk-builtin:active { transform:scale(.96); }
.wk-builtin-ov { position:absolute; inset:0; background:linear-gradient(to top, rgba(10,10,20,.85) 0%, rgba(10,10,20,.25) 60%, rgba(10,10,20,.1) 100%); }
.wk-builtin-name { font-size:13px; font-weight:700; color:#fff; text-shadow:0 1px 4px rgba(0,0,0,.6); position:relative; z-index:1; }
.wk-builtin-desc { font-size:9px; color:rgba(255,255,255,.85); text-transform:uppercase; letter-spacing:.4px; margin-top:1px; position:relative; z-index:1; }
.wk-builtin-play { position:absolute; top:8px; right:8px; width:24px; height:24px; border-radius:50%; background:rgba(0,0,0,.35); display:flex; align-items:center; justify-content:center; z-index:1; }
.wk-builtin-play .ms-icon { font-size:16px; color:#fff; }

.edit-hint { font-size:10px; color:var(--text-3); }

/* ===== Workout analysis ===== */
.wk-analyze-btn { display:flex; align-items:center; gap:4px; background:rgba(139,92,246,.12); border:1px solid rgba(139,92,246,.3); color:var(--primary-soft); font-size:12px; font-weight:700; padding:8px 12px; border-radius:10px; cursor:pointer; flex-shrink:0; margin-left:8px; position:relative; z-index:2; }
.wk-analyze-btn:active { transform:scale(.95); }
.wk-analyze-btn .ms-icon { font-size:16px; }
.wk-ana-head { font-size:15px; font-weight:800; color:var(--text); margin-bottom:10px; }
.wk-ana-head span { color:var(--text-3); font-weight:500; font-size:12px; }
.wk-ana-stats { display:grid; grid-template-columns:repeat(3,1fr); gap:8px; margin-bottom:10px; }
.wk-ana-stat { background:var(--surface-2); border:1px solid rgba(255,255,255,.06); border-radius:10px; padding:8px; text-align:center; }
.wk-ana-stat .ms-icon { font-size:16px; color:var(--primary-soft); display:block; margin-bottom:2px; }
.wk-ana-stat b { display:block; font-size:13px; color:var(--text); }
.wk-ana-stat i { font-size:9px; color:var(--text-3); font-style:normal; }
.wk-ana-ex { display:flex; flex-direction:column; gap:6px; margin-bottom:10px; }
.wk-ana-ex-row { background:var(--surface-container-low); border:1px solid rgba(255,255,255,.05); border-radius:8px; padding:7px 9px; }
.wk-ana-ex-row b { display:block; font-size:12px; color:var(--text); }
.wk-ana-ex-row span { font-size:11px; color:var(--text-2); }
.wk-ana-ex-row i { font-style:normal; color:var(--gold); font-size:10px; }
.wk-ai-analysis { margin-top:10px; padding:12px; background:rgba(139,92,246,.08); border-left:3px solid var(--primary); border-radius:10px; font-size:13px; line-height:1.55; color:var(--text); white-space:pre-wrap; }

/* ===== Active workout (mockup v2) ===== */
.wk-active-bar { display:flex; align-items:center; justify-content:space-between; gap:10px; background:linear-gradient(135deg, var(--surface-2), var(--surface)); border:1px solid rgba(139,92,246,.25); border-radius:14px; padding:12px 14px; margin-bottom:12px; }
.wk-active-info { display:flex; flex-direction:column; gap:2px; min-width:0; }
.wk-active-name { font-size:11px; color:var(--text-3); font-weight:500; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.wk-active-timer { display:flex; align-items:center; gap:6px; color:var(--primary-soft); }
.wk-active-timer .ms-icon { font-size:18px; animation:pulse 2s ease-in-out infinite; }
.wk-active-timer b { font-size:24px; font-weight:800; letter-spacing:1px; font-variant-numeric:tabular-nums; }
.wk-finish-btn { flex-shrink:0; background:rgba(139,92,246,.1); color:var(--primary-soft); border:1px solid rgba(139,92,246,.25); border-radius:10px; padding:9px 14px; font-size:12px; font-weight:600; cursor:pointer; }
.wk-finish-btn:active { transform:scale(.95); }

.wk-ex-head { display:flex; align-items:center; gap:8px; background:var(--surface-container-low); padding:10px 12px; border-bottom:1px solid rgba(255,255,255,.06); }
.wk-ex-name { font-size:14px; font-weight:700; color:var(--text); flex:1; min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.wk-ex-cat { font-size:10px; font-weight:600; color:var(--gold); background:var(--surface-container-highest); border-radius:6px; padding:2px 8px; flex-shrink:0; }

.set-table { padding:10px 12px 12px; display:flex; flex-direction:column; gap:5px; }
.st-head { display:grid; grid-template-columns:0.7fr 1.3fr 1fr 1fr 1.2fr; gap:6px; text-align:center; color:var(--text-3); font-size:10px; font-weight:600; text-transform:uppercase; letter-spacing:.3px; padding:0 2px 2px; }
.st-head span:first-child, .st-head span:nth-child(2) { text-align:left; }
.st-row { display:grid; grid-template-columns:0.7fr 1.3fr 1fr 1fr 1.2fr; gap:6px; align-items:center; padding:7px 8px; border-radius:9px; }
.st-row.done { background:rgba(74,225,118,.08); border:1px solid rgba(74,225,118,.18); }
.st-row.done.warm { background:rgba(255,185,95,.07); border:1px solid rgba(255,185,95,.18); }
.st-row.active { background:var(--surface-container-low); border:1px solid rgba(255,255,255,.07); }
.st-n { text-align:center; font-size:13px; font-weight:700; color:var(--text); }
.st-prev { font-size:11px; color:var(--text-3); overflow:hidden; text-overflow:ellipsis; white-space:nowrap; text-align:left; }
.st-row.active .st-prev { color:var(--text); font-weight:500; }
.st-val { text-align:center; font-size:13px; font-weight:600; color:var(--text); font-variant-numeric:tabular-nums; }
.st-input { width:100%; background:var(--surface); border:1px solid rgba(139,92,246,.4); border-radius:8px; padding:7px 4px; text-align:center; font-size:13px; font-weight:600; color:var(--text); outline:none; }
.st-input::placeholder { color:var(--text-3); font-weight:400; }
.st-input:focus { border-color:var(--primary); }
.st-actions { display:flex; align-items:center; justify-content:center; gap:5px; }
.st-ok { width:26px; height:26px; border-radius:8px; background:var(--success); color:#003915; display:flex; align-items:center; justify-content:center; flex-shrink:0; }
.st-ok .ms-icon { font-size:16px; }
.st-del { width:24px; height:24px; border-radius:6px; color:var(--danger); display:flex; align-items:center; justify-content:center; cursor:pointer; flex-shrink:0; }
.st-del .ms-icon { font-size:15px; }
.st-del:active { transform:scale(.9); }
.st-ok-btn { width:28px; height:28px; border-radius:8px; background:var(--primary); color:#fff; border:none; display:flex; align-items:center; justify-content:center; cursor:pointer; flex-shrink:0; }
.st-ok-btn .ms-icon { font-size:16px; }
.st-ok-btn:active { transform:scale(.9); }
.st-warm-btn { width:28px; height:28px; border-radius:8px; background:var(--surface-container-highest); border:1px solid rgba(255,255,255,.1); font-size:13px; cursor:pointer; display:flex; align-items:center; justify-content:center; flex-shrink:0; }
.st-warm-btn:active { transform:scale(.9); }

.wk-add-ex { display:flex; align-items:center; justify-content:center; gap:6px; border:1px dashed rgba(139,92,246,.5); background:none; color:var(--primary-soft); font-weight:600; }
.wk-add-ex .ms-icon { font-size:18px; }

@keyframes pulse { 0%, 100% { opacity: 1; } 50% { opacity: .4; } }

.set-table.incline .st-head, .set-table.incline .st-row { grid-template-columns: 0.6fr 1.1fr 1fr 1fr 0.8fr 1.2fr; }

/* ===== Page transitions ===== */
@keyframes pageIn {
  from { opacity: 0; transform: translateY(18px); }
  to { opacity: 1; transform: translateY(0); }
}
.page-in { animation: pageIn .2s ease; }

/* Stagger: dashboard cards (static DOM) animate on switch */
.page-in .dash-hero { animation: pageIn .3s cubic-bezier(.2,.7,.3,1) both; }
.page-in .dash-bento-card { animation: pageIn .34s cubic-bezier(.2,.7,.3,1) both; }
.page-in .dash-bento-card:nth-child(2) { animation-delay: .05s; }
.page-in .dash-bento-col .dash-bento-card:nth-child(1) { animation-delay: .08s; }
.page-in .dash-bento-col .dash-bento-card:nth-child(2) { animation-delay: .11s; }
.page-in .dash-actions { animation: pageIn .34s cubic-bezier(.2,.7,.3,1) both; animation-delay: .14s; }

/* ===== Tab loading overlay ===== */
.tab-loading { position:absolute; inset:0; z-index:60; display:none; align-items:center; justify-content:center; background:var(--bg); min-height:60vh; }
.tab-loading.show { display:flex; }
.tab-spinner { width:34px; height:34px; border:3px solid rgba(139,92,246,.15); border-top-color:#8b5cf6; border-radius:50%; animation:spin .8s linear infinite; }

/* Content fade-in right after loader hides */
@keyframes fadeInOnly { from { opacity: 0; } to { opacity: 1; } }
.tab-enter { animation: fadeInOnly .32s ease; }

/* ===== Trainer mode ===== */
.trainer-prof-row { display:flex; flex-direction:column; gap:0; }
.trainer-sub { font-size:12px; color:var(--text-3); margin-top:2px; }
.trainer-empty { color:var(--text-3); font-size:13px; padding:14px 4px; text-align:center; line-height:1.5; }
.trainer-client-row { display:flex; align-items:center; gap:10px; padding:10px 2px; border-bottom:1px solid rgba(255,255,255,.05); cursor:pointer; }
.trainer-client-row:last-child { border-bottom:none; }
.trainer-client-avatar { width:38px; height:38px; border-radius:50%; background:linear-gradient(135deg,var(--primary),var(--primary-soft)); display:flex; align-items:center; justify-content:center; font-weight:700; font-size:16px; color:var(--bg); flex-shrink:0; }
.trainer-client-info { flex:1; min-width:0; }
.trainer-client-info b { font-size:14px; display:block; }
.trainer-inv-row { display:flex; align-items:center; justify-content:space-between; gap:8px; padding:10px 2px; border-bottom:1px solid rgba(255,255,255,.05); }
.trainer-inv-row:last-child { border-bottom:none; }
.trainer-inv-actions { display:flex; gap:6px; flex-shrink:0; }
.trainer-task-row { display:flex; align-items:center; gap:10px; padding:10px 2px; border-bottom:1px solid rgba(255,255,255,.05); cursor:pointer; }
.trainer-task-row:last-child { border-bottom:none; }
.trainer-task-row b { font-size:14px; }
.trainer-task-done b { text-decoration:line-through; color:var(--text-3); }
.trainer-wk-row { padding:8px 2px; border-bottom:1px solid rgba(255,255,255,.05); }
.trainer-wk-row:last-child { border-bottom:none; }
.trainer-wk-row b { font-size:14px; display:block; }
.trainer-act-dot { width:22px; height:22px; border-radius:50%; background:var(--surface-2); margin:0 auto 4px; border:1px solid rgba(255,255,255,.08); }
.trainer-act-dot.on { background:var(--success); box-shadow:0 0 8px rgba(74,225,118,.5); }

/* ===== Trainer toggle button animation ===== */
.trainer-toggle { position: relative; transition: transform .15s ease; }
.trainer-toggle:active { transform: scale(.92); }

/* OFF state: calm, subtle glow — nothing demanding attention */
.trainer-toggle.off {
  background: var(--primary);
  animation: trOff 3.2s ease-in-out infinite;
}
@keyframes trOff {
  0%, 100% { box-shadow: 0 0 2px rgba(139, 92, 246, .25); }
  50%      { box-shadow: 0 0 8px rgba(139, 92, 246, .18); }
}

/* ON state: noticeable pulse + gold dot — the mode is alive */
.trainer-toggle.on {
  background: var(--success);
  animation: trOnPulse 1.6s ease-in-out infinite;
}
@keyframes trOnPulse {
  0%, 100% { box-shadow: 0 0 4px rgba(74, 225, 118, .45); transform: scale(1); }
  50%      { box-shadow: 0 0 18px 5px rgba(74, 225, 118, .6); transform: scale(1.05); }
}
.trainer-toggle.on::after {
  content: '';
  position: absolute;
  top: -4px; right: -4px;
  width: 10px; height: 10px;
  border-radius: 50%;
  background: var(--gold);
  box-shadow: 0 0 6px var(--gold);
  animation: trDot 1.6s ease-in-out infinite;
}
@keyframes trDot {
  0%, 100% { opacity: 1; transform: scale(1); }
  50%      { opacity: .4; transform: scale(.7); }
}

/* ===== Trainer action tiles (3+2 grid) ===== */
.ta-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; margin-bottom: 10px; }
.ta-tile {
  display: flex; flex-direction: column; align-items: center; justify-content: center;
  gap: 4px; background: #24243e; border: 1px solid rgba(139,92,246,0.15);
  border-radius: 12px; padding: 10px 6px; color: #f0f0f4;
  font-size: 12px; font-weight: 600; cursor: pointer; min-height: 64px;
  transition: border-color .15s ease, background .15s ease;
}
.ta-tile:active { border-color: #8b5cf6; background: rgba(139,92,246,0.15); }
.ta-tile .ta-icon { font-size: 26px; line-height: 1; }
.ta-tile.ta-wide { grid-column: 1 / -1; flex-direction: row; gap: 8px; min-height: 48px; }
.ta-tile.ta-wide .ta-icon { font-size: 20px; }

/* ===== Кнопка анализа (спиннер из Stitch) ===== */
@keyframes spinner-gradient { 0% { transform: rotate(0deg); } 100% { transform: rotate(360deg); } }
.spinner-gradient {
  background: conic-gradient(from 0deg, #8b5cf6, #ffb95f, transparent);
  -webkit-mask-image: radial-gradient(transparent 55%, black 60%);
  mask-image: radial-gradient(transparent 55%, black 60%);
  animation: spinner-gradient 1s linear infinite;
}
#btnAnalyze.analyzing {
  box-shadow: 0 0 20px rgba(139,92,246,.45);
  animation: analyze-pulse 1.2s ease-in-out infinite;
  pointer-events: none;
  opacity: .92;
}
@keyframes analyze-pulse {
  0%, 100% { box-shadow: 0 0 14px rgba(139,92,246,.35); }
  50% { box-shadow: 0 0 26px rgba(255,185,95,.4); }
}

/* ===== Переключатель уведомлений (switch) ===== */
.switch { position: relative; display: inline-block; width: 46px; height: 26px; flex-shrink: 0; }
.switch input { opacity: 0; width: 0; height: 0; }
.switch .slider { position: absolute; cursor: pointer; inset: 0; background: #24243e; border: 1px solid #2f2f4a; border-radius: 26px; transition: .3s; }
.switch .slider:before { content: ''; position: absolute; height: 18px; width: 18px; left: 3px; top: 3px; background: #6b6b80; border-radius: 50%; transition: .3s; }
.switch input:checked + .slider { background: #8b5cf6; border-color: #8b5cf6; box-shadow: 0 0 10px rgba(139,92,246,.5); }
.switch input:checked + .slider:before { transform: translateX(20px); background: #fff; }
.profile-notif-desc { line-height: 1.3; }


/* ===== ОНБОРДИНГ (первый запуск) ===== */
#onboard{position:fixed;inset:0;z-index:900;background:#0f0f1a;display:flex;flex-direction:column;overflow-y:auto}
#onboard.hidden{display:none}
.onb-head{display:flex;align-items:center;justify-content:space-between;padding:16px 16px 10px;gap:10px}
.onb-back{background:none;border:0;color:#cbc3d7;font-size:22px;line-height:1;padding:4px 0;cursor:pointer;font-family:inherit}
.onb-back.off{visibility:hidden}
.onb-logo{font-weight:800;font-size:19px;background:linear-gradient(90deg,#d0bcff,#8b5cf6 45%,#ffb95f);-webkit-background-clip:text;background-clip:text;color:transparent}
.onb-skip{background:none;border:0;color:#6b6b80;font-size:13px;font-family:inherit;cursor:pointer}
.onb-prog{display:flex;gap:4px;padding:0 16px 14px}
.onb-prog i{flex:1;height:4px;border-radius:2px;background:#24243e;transition:background .25s}
.onb-prog i.on{background:#8b5cf6;box-shadow:0 0 8px rgba(139,92,246,.55)}
.onb-main{flex:1;padding:0 16px 130px}
.onb-main h2{font-size:23px;font-weight:800;line-height:1.2;margin:4px 0 8px;letter-spacing:-.2px}
.onb-sub{color:#cbc3d7;font-size:13px;line-height:1.45;margin-bottom:16px}
.onb-feat{display:flex;gap:11px;align-items:center;background:#1a1a2e;border:1px solid rgba(255,255,255,.06);border-radius:12px;padding:13px;margin-bottom:10px}
.onb-feat .ic{width:34px;height:34px;border-radius:10px;background:rgba(139,92,246,.16);display:flex;align-items:center;justify-content:center;font-size:17px;flex:none}
.onb-feat b{display:block;font-size:13.5px}
.onb-feat span{font-size:11.5px;color:#6b6b80}
.onb-card{background:#1a1a2e;border:1px solid rgba(255,255,255,.06);border-radius:12px;padding:14px;margin-bottom:12px}
.onb-lbl{font-size:11px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:#6b6b80;margin:16px 0 8px}
.onb-card .onb-lbl:first-child{margin-top:0}
.onb-chips{display:flex;gap:7px;flex-wrap:wrap}
.onb-chip{background:#24243e;border:1px solid rgba(255,255,255,.06);color:#cbc3d7;font-family:inherit;font-size:13px;font-weight:600;padding:9px 13px;border-radius:11px;cursor:pointer}
.onb-chip.on{background:#8b5cf6;border-color:#8b5cf6;color:#fff;box-shadow:0 0 14px rgba(139,92,246,.4)}
.onb-grid{display:grid;grid-template-columns:1fr 1fr;gap:9px}
.onb-pick{background:#1a1a2e;border:1px solid rgba(255,255,255,.06);border-radius:12px;padding:12px;text-align:left;font-family:inherit;color:#f0f0f4;cursor:pointer;position:relative}
.onb-pick b{display:block;font-size:13.5px;margin-bottom:2px}
.onb-pick span{font-size:11px;color:#6b6b80;line-height:1.35;display:block}
.onb-pick.on{border-color:#8b5cf6;box-shadow:0 0 16px rgba(139,92,246,.3);background:#20203a}
.onb-pick .tk{position:absolute;top:9px;right:9px;width:16px;height:16px;border-radius:50%;background:#8b5cf6;color:#fff;font-size:11px;line-height:16px;text-align:center;display:none}
.onb-pick.on .tk{display:block}
.onb-range{width:100%;-webkit-appearance:none;height:8px;border-radius:999px;background:#24243e;outline:none;margin:10px 0 4px}
.onb-range::-webkit-slider-thumb{-webkit-appearance:none;width:24px;height:24px;border-radius:50%;background:#8b5cf6;border:3px solid #0f0f1a;box-shadow:0 0 14px rgba(139,92,246,.65)}
.onb-row{display:flex;align-items:center;justify-content:space-between;gap:10px}
.onb-val{font-size:26px;font-weight:800;color:#ffb95f}
.onb-val small{font-size:13px;font-weight:600;color:#cbc3d7;margin-left:3px}
.onb-input{background:#24243e;border:1px solid rgba(255,255,255,.06);color:#f0f0f4;font-family:inherit;font-size:22px;font-weight:800;width:110px;padding:8px 10px;border-radius:11px;text-align:center}
.onb-link{background:none;border:0;color:#6b6b80;font-family:inherit;font-size:12px;text-decoration:underline;cursor:pointer;padding:0}
.onb-foot{position:fixed;bottom:0;left:0;right:0;background:linear-gradient(180deg,rgba(15,15,26,.15),#0f0f1a 45%);padding:12px 16px 18px;z-index:901}
.onb-foot-in{max-width:430px;margin:0 auto}
.onb-btn{width:100%;height:50px;border:0;border-radius:12px;background:#8b5cf6;color:#fff;font-family:inherit;font-size:15.5px;font-weight:700;cursor:pointer}
.onb-btn.ghost{background:none;color:#6b6b80;font-weight:500;height:32px;font-size:12.5px;margin-top:6px}
.onb-hint{font-size:11px;color:#6b6b80;text-align:center;margin-top:8px}
.onb-big{font-size:44px;font-weight:800;color:#ffb95f;line-height:1;letter-spacing:-1px}
.onb-mac{display:flex;flex-direction:column;gap:9px;margin-top:14px}
.onb-mac .m{display:flex;align-items:center;gap:9px;font-size:12.5px}
.onb-mac .m b{min-width:76px;font-weight:700}
.onb-mac .track{flex:1;height:6px;border-radius:3px;background:#24243e;overflow:hidden}
.onb-mac .track i{display:block;height:6px;background:#8b5cf6}
.onb-mac .m em{font-style:normal;color:#cbc3d7;min-width:56px;text-align:right}
.onb-forecast{display:flex;align-items:center;justify-content:space-between;gap:8px;background:#24243e;border-radius:10px;padding:10px 12px;font-size:12.5px;margin-top:10px}
.onb-forecast span{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.onb-forecast b{flex:none;text-align:right;white-space:nowrap}
.onb-forecast b{color:#4ae176}
.onb-scale{display:flex;align-items:center;gap:8px;margin-top:10px;font-size:11px;color:#6b6b80}
.onb-scale .bar{flex:1;height:6px;border-radius:3px;background:#24243e;overflow:hidden}
.onb-scale .bar i{display:block;height:6px;background:#4ae176}
.onb-ach{display:flex;gap:10px;align-items:center;background:rgba(255,185,95,.1);border:1px solid rgba(255,185,95,.3);border-radius:12px;padding:12px;margin-top:12px}
.onb-ach .ic{font-size:22px}
.onb-ach b{display:block;font-size:13px;color:#ffb95f}
.onb-ach span{font-size:11px;color:#cbc3d7}

/* ===== Плавные переходы между экранами онбординга ===== */
#onboard{overflow-x:hidden}
.onb-main{will-change:transform,opacity}
.onb-main.onb-in-fwd{animation:onbInFwd .30s cubic-bezier(.22,.9,.3,1) both}
.onb-main.onb-in-back{animation:onbInBack .30s cubic-bezier(.22,.9,.3,1) both}
@keyframes onbInFwd{from{opacity:.2;transform:translate3d(28px,0,0)}to{opacity:1;transform:translate3d(0,0,0)}}
@keyframes onbInBack{from{opacity:.2;transform:translate3d(-28px,0,0)}to{opacity:1;transform:translate3d(0,0,0)}}
@keyframes onbRise{from{opacity:0;transform:translate3d(0,12px,0)}to{opacity:1;transform:translate3d(0,0,0)}}
/* прогресс: плавная заливка + акцент на только что включённом сегменте */
.onb-prog i{transition:background .35s ease,box-shadow .35s ease}
.onb-prog i.onb-pop{animation:onbPop .45s cubic-bezier(.2,.9,.3,1) both}
@keyframes onbPop{0%{transform:scaleY(1)}38%{transform:scaleY(2.2)}100%{transform:scaleY(1)}}
/* микро-интеракции: заметнее выбранное, отзывчивее нажатия */
.onb-chip,.onb-pick,.onb-btn,.onb-link,.onb-skip,.onb-back{transition:transform .16s ease,background .2s ease,border-color .2s ease,box-shadow .2s ease,color .2s ease,filter .2s ease}
.onb-chip:active,.onb-pick:active,.onb-link:active{transform:scale(.955)}
.onb-btn:active{transform:scale(.98);filter:brightness(.93)}
.onb-chip.on{animation:onbChipOn .22s cubic-bezier(.2,.9,.3,1)}
@keyframes onbChipOn{from{transform:scale(.88)}to{transform:scale(1)}}
.onb-pick.on .tk{animation:onbTick .28s cubic-bezier(.2,.9,.3,1) both}
@keyframes onbTick{from{transform:scale(.4);opacity:0}to{transform:scale(1);opacity:1}}
/* полоски макросов и прогноза наполняются слева направо */
.onb-mac .track i,.onb-scale .bar i{transform-origin:left center;animation:onbBar .7s cubic-bezier(.3,.8,.3,1) 140ms both}
@keyframes onbBar{from{transform:scaleX(0)}to{transform:scaleX(1)}}
@media (prefers-reduced-motion:reduce){
  .onb-main.onb-in-fwd,.onb-main.onb-in-back,.onb-chip.on,.onb-pick.on .tk,.onb-mac .track i,.onb-scale .bar i,.onb-prog i.onb-pop{animation:none!important}
}
