html.tlcm-lock, body.tlcm-lock {
  width: 100% !important;
  height: 100% !important;
  overflow: hidden !important;
  overscroll-behavior: none !important;
  touch-action: pan-y !important;
}
body.tlcm-lock { margin: 0 !important; }
.tlcm-app-mount {
  width: 100%;
  min-height: calc(var(--tlcm-app-vh, 100dvh) - var(--tlcm-admin-offset, 0px));
  height: calc(var(--tlcm-app-vh, 100dvh) - var(--tlcm-admin-offset, 0px));
  display: flex;
  justify-content: center;
  align-items: stretch;
  padding: 12px;
  box-sizing: border-box;
  overflow: hidden;
}

#tlcmApp,
#tlcmApp * {
  box-sizing: border-box;
}

#tlcmApp {
  --bg: #1c1d21;
  --surface: #25272d;
  --surface-2: #2d3038;
  --surface-3: #353944;
  --text: #f5f7fb;
  --muted: #9aa3b2;
  --border: rgba(255,255,255,0.06);
  --primary: #fac643;
  --primary-dark: #e5b31f;
  --success: #7ad86e;
  --success-bg: rgba(122,216,110,0.14);
  --blue: #5da8ff;
  --blue-soft: rgba(93,168,255,0.16);
  --yellow-soft: rgba(250,198,67,0.18);
  --danger: #ff7272;
  --card-gold-1: #f6cf56;
  --card-gold-2: #dfab1e;
  --shadow: 0 24px 60px rgba(0,0,0,0.35);
  width: min(430px, calc(var(--tlcm-app-vw, 100vw) - 24px));
  max-width: 430px;
  min-height: min(880px, calc(var(--tlcm-app-vh, 100dvh) - 24px - var(--tlcm-admin-offset, 0px)));
  height: calc(var(--tlcm-app-vh, 100dvh) - 24px - var(--tlcm-admin-offset, 0px));
  max-height: calc(var(--tlcm-app-vh, 100dvh) - 24px - var(--tlcm-admin-offset, 0px));
  background: linear-gradient(180deg, #202228 0%, #1c1d21 100%);
  border-radius: 34px;
  overflow: hidden;
  position: relative;
  display: flex;
  flex-direction: column;
  box-shadow: var(--shadow);
  border: 1px solid rgba(255,255,255,0.05);
  color: var(--text);
  font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}

#tlcmApp .status-bar { display: none; }
#tlcmApp .screen { display: none; min-height: 0; height: 100%; position: absolute; inset: 0; width: 100%; flex-direction: column; }
#tlcmApp .screen.active { display: flex; }
#tlcmApp .screen.app-main { display: none; }
#tlcmApp .screen.app-main.active { display: grid; }
#tlcmApp .hidden { display: none !important; }
#tlcmApp .splash { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 22px; background: var(--bg); position: absolute; inset: 0; z-index: 20; opacity: 1; visibility: visible; transition: opacity .45s ease, visibility .45s ease; padding: 24px; text-align: center; }
#tlcmApp .splash.hide { opacity: 0; visibility: hidden; pointer-events: none; }
#tlcmApp .splash-logo-wrap { width: 110px; height: 110px; border-radius: 30px; background: rgba(255,255,255,0.04); display: flex; align-items: center; justify-content: center; box-shadow: inset 0 0 0 1px rgba(255,255,255,0.05), 0 12px 30px rgba(0,0,0,0.28); animation: tlcm-pulse 1.5s infinite ease-in-out; }
#tlcmApp .splash-logo { width: 72px; height: 72px; object-fit: contain; }
#tlcmApp .brand-title { font-size: 24px; font-weight: 800; letter-spacing: .02em; }
#tlcmApp .brand-sub { color: var(--muted); font-size: 14px; }
#tlcmApp .loader { width: 170px; height: 8px; border-radius: 999px; background: rgba(255,255,255,0.07); overflow: hidden; position: relative; }
#tlcmApp .loader::after { content: ""; position: absolute; inset: 0; width: 45%; border-radius: inherit; background: linear-gradient(90deg, var(--primary-dark), var(--primary)); animation: tlcm-loading 1.4s infinite ease-in-out; }
#tlcmApp .login-screen { padding: max(28px, env(safe-area-inset-top)) 24px max(28px, env(safe-area-inset-bottom)); background: radial-gradient(circle at top right, rgba(250,198,67,0.14), transparent 32%), radial-gradient(circle at top left, rgba(255,255,255,0.04), transparent 26%), var(--bg); opacity: 0; transform: translateY(16px); transition: opacity .45s ease, transform .45s ease; overflow-y: auto; overflow-x: hidden; -webkit-overflow-scrolling: touch; }
#tlcmApp .login-screen.ready { opacity: 1; transform: translateY(0); }
#tlcmApp .logo-top { width: 84px; height: 84px; border-radius: 24px; background: rgba(255,255,255,0.05); display: flex; align-items: center; justify-content: center; margin-bottom: 18px; box-shadow: inset 0 0 0 1px rgba(255,255,255,0.05); animation: tlcm-floatIn .55s ease both; }
#tlcmApp .logo-top img { width: 56px; height: 56px; object-fit: contain; }
#tlcmApp .login-title { font-size: 28px; font-weight: 800; margin: 0 0 8px; animation: tlcm-fadeInUp .55s ease both; animation-delay: .08s; }
#tlcmApp .login-sub { margin: 0 0 24px; color: var(--muted); line-height: 1.45; font-size: 14px; animation: tlcm-fadeInUp .55s ease both; animation-delay: .14s; }
#tlcmApp .login-card { margin-top: 34px; background: rgba(255,255,255,0.04); border: 1px solid rgba(255,255,255,0.06); border-radius: 28px; padding: 22px; backdrop-filter: blur(10px); animation: tlcm-loginCardEnter .6s ease both; }
#tlcmApp .toggle-wrap { display: grid; grid-template-columns: repeat(2, 1fr); gap: 8px; background: rgba(255,255,255,0.04); border: 1px solid rgba(255,255,255,0.05); border-radius: 18px; padding: 6px; margin-bottom: 22px; animation: tlcm-fadeInUp .55s ease both; animation-delay: .2s; }
#tlcmApp .toggle-btn { background: transparent; border: 0; border-radius: 14px; padding: 12px 10px; color: var(--muted); font-weight: 700; cursor: pointer; transition: .2s ease; }
#tlcmApp .toggle-btn.active { background: var(--primary); color: #1c1d21; box-shadow: 0 8px 18px rgba(250,198,67,0.22); }
#tlcmApp .login-pane { animation: tlcm-fadeSwitch .28s ease; }
#tlcmApp .form-row { margin-bottom: 14px; }
#tlcmApp .label { display: block; margin-bottom: 8px; color: #dfe5f1; font-size: 13px; font-weight: 600; }
#tlcmApp .input { width: 100%; min-height: 52px; border-radius: 16px; border: 1px solid rgba(255,255,255,0.07); background: rgba(255,255,255,0.04); color: var(--text); padding: 0 16px; outline: none; transition: .2s ease; }
#tlcmApp textarea.input { padding: 14px 16px; resize: vertical; min-height: 88px; }
#tlcmApp .password-field { position: relative !important; display: flex !important; align-items: center !important; width: 100% !important; }
#tlcmApp .password-field .input { padding-right: 52px !important; }
#tlcmApp .password-toggle { position: absolute !important; right: 10px !important; top: 50% !important; transform: translateY(-50%) !important; width: 36px !important; height: 36px !important; border: 0 !important; border-radius: 12px !important; background: rgba(255,255,255,0.06) !important; color: var(--text) !important; display: flex !important; align-items: center !important; justify-content: center !important; cursor: pointer !important; padding: 0 !important; line-height: 1 !important; box-shadow: none !important; min-height: 0 !important; }
#tlcmApp .password-toggle:hover { background: rgba(255,255,255,0.1) !important; }

#tlcmApp .input:focus { border-color: rgba(250,198,67,0.6); box-shadow: 0 0 0 4px rgba(250,198,67,0.12); }
#tlcmApp .hint, #tlcmApp .subtle-note { color: var(--muted); font-size: 12px; line-height: 1.5; }
#tlcmApp .subtle-note { font-size: 13px; }
#tlcmApp .btn-primary, #tlcmApp .btn-secondary, #tlcmApp .btn-ghost, #tlcmApp .back-link, #tlcmApp .selector-btn, #tlcmApp .filter-chip, #tlcmApp .hmenu-nav, #tlcmApp .client-dropdown-item, #tlcmApp .icon-btn { transition: .2s ease; }
#tlcmApp .btn-primary, #tlcmApp .btn-secondary, #tlcmApp .btn-ghost { border: 0; border-radius: 18px; cursor: pointer; font-weight: 800; }
#tlcmApp .btn-primary { width: 100%; height: 54px; background: var(--primary); color: #1b1c20; font-size: 15px; margin-top: 10px; box-shadow: 0 14px 28px rgba(250,198,67,0.18); }
#tlcmApp .btn-secondary { background: rgba(250,198,67,0.14); color: var(--primary); padding: 14px 16px; border: 1px solid rgba(250,198,67,0.18); }
#tlcmApp .btn-ghost { background: rgba(255,255,255,0.04); color: var(--text); padding: 12px 14px; border: 1px solid rgba(255,255,255,0.08); }
#tlcmApp .message { margin-top: 14px; min-height: 20px; font-size: 13px; font-weight: 600; }
#tlcmApp .message.error { color: #ff8d8d; }
#tlcmApp .message.success { color: #8ee584; }
#tlcmApp .app-main { padding: max(12px, env(safe-area-inset-top)) 18px max(10px, env(safe-area-inset-bottom)); background: var(--bg); display: grid; grid-template-rows: auto minmax(0, 1fr); height: 100%; min-height: 0; overflow: hidden; }
#tlcmApp .app-main main { min-height: 0; height: 100%; overflow-y: auto; overflow-x: hidden; -webkit-overflow-scrolling: touch; padding: 0 0 18px; overscroll-behavior: contain; scrollbar-width: none; -ms-overflow-style: none; }
#tlcmApp .app-main main::-webkit-scrollbar { width: 0 !important; height: 0 !important; display: none !important; }
#tlcmApp .topbar { display: flex; align-items: center; justify-content: space-between; padding-top: 2px; margin-bottom: 22px; }
#tlcmApp .topbar-left, #tlcmApp .topbar-right { display: flex; align-items: center; gap: 12px; }
#tlcmApp .icon-btn { width: 44px; height: 44px; border-radius: 14px; border: 1px solid rgba(255,255,255,0.07); background: rgba(255,255,255,0.04); color: var(--text); display: flex; align-items: center; justify-content: center; cursor: pointer; }
#tlcmApp .icon-btn:hover { background: rgba(255,255,255,0.07); }
#tlcmApp .avatar { width: 44px; height: 44px; border-radius: 14px; background: linear-gradient(135deg, var(--card-gold-1), var(--card-gold-2)); color: #1c1d21; font-weight: 800; display: flex; align-items: center; justify-content: center; border: 1px solid rgba(255,255,255,0.08); overflow: hidden; }
#tlcmApp .page-kicker { color: var(--primary); font-weight: 700; font-size: 13px; letter-spacing: .04em; text-transform: uppercase; margin-bottom: 6px; }
#tlcmApp .page-title-row { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-bottom: 8px; }
#tlcmApp .page-title { font-size: 30px; font-weight: 800; margin: 0; line-height: 1.08; }
#tlcmApp .page-sub { color: var(--muted); margin: 8px 0 22px; font-size: 14px; line-height: 1.45; }
#tlcmApp .stats-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; margin-bottom: 24px; }
#tlcmApp .stat-card, #tlcmApp .section-card, #tlcmApp .mini-card, #tlcmApp .info-card, #tlcmApp .plan-card, #tlcmApp .record-card, #tlcmApp .progress-photo-card, #tlcmApp .chart-card, #tlcmApp .profile-top-card, #tlcmApp .client-card { background: rgba(255,255,255,0.03); border: 1px solid rgba(255,255,255,0.06); box-shadow: inset 0 1px 0 rgba(255,255,255,0.03); }
#tlcmApp .stat-card { border-radius: 24px; padding: 16px; }
#tlcmApp .stat-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 8px; margin-bottom: 14px; }
#tlcmApp .stat-icon { width: 44px; height: 44px; border-radius: 14px; background: rgba(255,255,255,0.06); display: flex; align-items: center; justify-content: center; color: var(--primary); }
#tlcmApp .stat-pill { background: var(--success-bg); color: var(--success); font-size: 12px; font-weight: 800; padding: 8px 10px; border-radius: 999px; white-space: nowrap; }
#tlcmApp .stat-value { font-size: 30px; font-weight: 800; line-height: 1; margin: 0 0 6px; }
#tlcmApp .stat-label { margin: 0; color: #d9dfeb; font-size: 14px; font-weight: 700; }
#tlcmApp .section-card { border-radius: 28px; padding: 22px 16px 16px; margin-bottom: 18px; }
#tlcmApp .section-title { font-size: 28px; line-height: 1.1; margin: 0 0 8px; font-weight: 800; }
#tlcmApp .section-sub { color: var(--muted); margin: 0 0 20px; font-size: 14px; line-height: 1.45; }
#tlcmApp .mini-card { border-radius: 24px; padding: 16px; margin-bottom: 14px; }
#tlcmApp .mini-head { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-bottom: 14px; }
#tlcmApp .mini-head-left { display: flex; align-items: center; gap: 12px; }
#tlcmApp .mini-icon { width: 42px; height: 42px; border-radius: 13px; display: flex; align-items: center; justify-content: center; flex: 0 0 auto; }
#tlcmApp .mini-icon.blue { background: rgba(93,168,255,0.16); color: #5da8ff; }
#tlcmApp .mini-icon.yellow { background: rgba(250,198,67,0.18); color: var(--primary); }
#tlcmApp .mini-title { font-size: 15px; font-weight: 800; margin: 0; }
#tlcmApp .progress-bar { width: 100%; height: 10px; border-radius: 999px; overflow: hidden; background: rgba(255,255,255,0.08); margin-bottom: 12px; }
#tlcmApp .progress-fill { height: 100%; border-radius: inherit; }
#tlcmApp .progress-fill.blue { background: linear-gradient(90deg, #5da8ff, #85bcff); }
#tlcmApp .progress-fill.yellow { background: linear-gradient(90deg, #fac643, #f0b400); }
#tlcmApp .progress-meta { display: flex; align-items: center; justify-content: space-between; gap: 10px; font-size: 14px; font-weight: 700; }
#tlcmApp .progress-meta .muted { color: var(--muted); font-weight: 600; }
#tlcmApp .blue-text { color: #5da8ff; }
#tlcmApp .yellow-text { color: var(--primary); }
#tlcmApp .activity-list { display: flex; flex-direction: column; gap: 12px; }
#tlcmApp .activity-item { display: flex; gap: 12px; align-items: flex-start; padding: 14px; border-radius: 20px; background: rgba(255,255,255,0.04); border: 1px solid rgba(255,255,255,0.06); }
#tlcmApp .activity-dot { width: 12px; height: 12px; border-radius: 999px; background: var(--primary); margin-top: 5px; box-shadow: 0 0 0 6px rgba(250,198,67,0.08); flex: 0 0 auto; }
#tlcmApp .activity-title { margin: 0 0 4px; font-weight: 700; font-size: 14px; color: var(--text); }
#tlcmApp .activity-meta { margin: 0; font-size: 12px; color: var(--muted); line-height: 1.45; }
#tlcmApp .side-menu { position: absolute; inset: 0 auto 0 0; width: 290px; background: linear-gradient(180deg, #23252c 0%, #1c1d21 100%); border-right: 1px solid rgba(255,255,255,0.07); z-index: 30; transform: translateX(-102%); transition: transform .25s ease; padding: 26px 18px; display: flex; flex-direction: column; gap: 18px; box-shadow: 20px 0 50px rgba(0,0,0,0.34); }
#tlcmApp .side-menu.open { transform: translateX(0); }
#tlcmApp .menu-overlay { position: absolute; inset: 0; background: rgba(0,0,0,.5); z-index: 25; opacity: 0; visibility: hidden; transition: .25s ease; }
#tlcmApp .menu-overlay.show { opacity: 1; visibility: visible; }
#tlcmApp .menu-brand { display: flex; align-items: center; gap: 12px; padding-bottom: 8px; border-bottom: 1px solid rgba(255,255,255,0.07); }
#tlcmApp .menu-brand-logo { width: 48px; height: 48px; border-radius: 15px; background: rgba(255,255,255,0.05); display: flex; align-items: center; justify-content: center; }
#tlcmApp .menu-brand-logo img { width: 30px; height: 30px; object-fit: contain; }
#tlcmApp .menu-brand-title { font-weight: 800; font-size: 16px; }
#tlcmApp .menu-brand-sub { color: var(--muted); font-size: 12px; margin-top: 4px; }
#tlcmApp .nav { display: flex; flex-direction: column; gap: 8px; }
#tlcmApp .nav-item { width: 100%; border: 0; background: transparent; color: #edf1f8; display: flex; align-items: center; gap: 12px; padding: 14px 14px; border-radius: 16px; cursor: pointer; text-align: left; font-weight: 700; }
#tlcmApp .nav-item:hover, #tlcmApp .nav-item.active { background: rgba(250,198,67,0.12); color: var(--primary); }
#tlcmApp .content-page { display: none; }
#tlcmApp .content-page.active { display: block; animation: tlcm-fadeIn .35s ease; }
#tlcmApp .placeholder-card, #tlcmApp .empty-block { min-height: 210px; border-radius: 24px; border: 1px dashed rgba(255,255,255,0.12); background: rgba(255,255,255,0.03); display: flex; align-items: center; justify-content: center; text-align: center; color: var(--muted); padding: 20px; line-height: 1.6; }
#tlcmApp .small-note { margin-top: 12px; color: var(--muted); font-size: 12px; text-align: center; animation: tlcm-fadeInUp .55s ease both; animation-delay: .28s; }
#tlcmApp .clients-header-actions { display: flex; justify-content: flex-end; margin-bottom: 16px; }
#tlcmApp .clients-grid { display: grid; gap: 16px; }
#tlcmApp .client-card { border-radius: 28px; overflow: visible; position: relative; }
#tlcmApp .client-card-top { height: 124px; background: linear-gradient(135deg, var(--card-gold-1), var(--card-gold-2)); position: relative; border-radius: 28px 28px 0 0; }
#tlcmApp .client-card-menu { position: absolute; right: 14px; top: 12px; width: 42px; height: 42px; border-radius: 50%; border: 0; color: rgba(255,255,255,0.92); background: rgba(255,255,255,0.18); backdrop-filter: blur(6px); cursor: pointer; display: flex; align-items: center; justify-content: center; }
#tlcmApp .client-card-badge { position: absolute; left: 14px; top: 12px; background: #7cff33; color: #192012; font-weight: 800; font-size: 12px; padding: 6px 10px; border-radius: 10px; text-transform: uppercase; letter-spacing: .04em; }
#tlcmApp .client-avatar-wrap { position: absolute; left: 50%; bottom: -45px; transform: translateX(-50%); }
#tlcmApp .client-avatar, #tlcmApp .profile-avatar { overflow: hidden; }
#tlcmApp .client-avatar { width: 92px; height: 92px; border-radius: 50%; border: 5px solid rgba(255,255,255,0.92); display: flex; align-items: center; justify-content: center; font-size: 24px; font-weight: 800; background: linear-gradient(135deg, var(--card-gold-1), var(--card-gold-2)); box-shadow: 0 14px 28px rgba(0,0,0,0.24); }
#tlcmApp .client-card-body { padding: 58px 18px 18px; text-align: center; }
#tlcmApp .client-name { margin: 0 0 8px; font-size: 18px; font-weight: 800; }
#tlcmApp .client-email { margin: 0; font-size: 14px; color: var(--muted); word-break: break-word; }
#tlcmApp .client-dropdown { position: absolute; top: 62px; right: 14px; width: 170px; border-radius: 18px; border: 1px solid rgba(255,255,255,0.08); background: #262931; box-shadow: 0 18px 34px rgba(0,0,0,0.28); overflow: hidden; z-index: 4; }
#tlcmApp .client-dropdown-item { width: 100%; background: transparent; border: 0; color: var(--text); text-align: left; padding: 14px 16px; cursor: pointer; font-weight: 700; border-bottom: 1px solid rgba(255,255,255,0.06); }
#tlcmApp .client-dropdown-item:last-child { border-bottom: 0; }
#tlcmApp .client-dropdown-item:hover { background: rgba(255,255,255,0.04); }
#tlcmApp .client-dropdown-item.danger { color: #ff9a9a; }
#tlcmApp .client-form { display: grid; gap: 14px; margin-top: 6px; }
#tlcmApp .back-row { display: flex; align-items: center; gap: 10px; margin-bottom: 16px; }
#tlcmApp .back-link { background: rgba(255,255,255,0.04); border: 1px solid rgba(255,255,255,0.08); color: var(--text); border-radius: 14px; padding: 10px 14px; cursor: pointer; font-weight: 700; }
#tlcmApp .profile-top-card { border-radius: 28px; overflow: hidden; margin-bottom: 18px; }
#tlcmApp .profile-top-banner { height: 126px; background: linear-gradient(135deg, var(--card-gold-1), var(--card-gold-2)); position: relative; }
#tlcmApp .profile-avatar { width: 96px; height: 96px; border-radius: 50%; background: linear-gradient(135deg, var(--card-gold-1), var(--card-gold-2)); border: 5px solid rgba(255,255,255,0.94); display: flex; align-items: center; justify-content: center; font-size: 28px; font-weight: 800; position: absolute; left: 18px; bottom: -42px; box-shadow: 0 14px 28px rgba(0,0,0,0.24); }
#tlcmApp .profile-top-body { padding: 58px 18px 18px; }
#tlcmApp .profile-name { margin: 0 0 6px; font-size: 22px; font-weight: 800; }
#tlcmApp .profile-email { margin: 0; color: var(--muted); font-size: 14px; }
#tlcmApp .hmenu-wrap { display: flex; align-items: stretch; gap: 8px; margin-bottom: 18px; }
#tlcmApp .hmenu-window { flex: 1; overflow: hidden; border-radius: 22px; border: 1px solid rgba(255,255,255,0.06); background: rgba(255,255,255,0.03); padding: 8px; }
#tlcmApp .hmenu-track { display: grid; grid-template-columns: repeat(6, calc(50% - 4px)); gap: 8px; transition: transform .28s ease; }
#tlcmApp .hmenu-item { min-height: 74px; border-radius: 18px; border: 1px solid rgba(255,255,255,0.06); background: rgba(255,255,255,0.03); color: var(--muted); display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 8px; text-align: center; padding: 10px 6px; font-size: 12px; font-weight: 700; cursor: pointer; }
#tlcmApp .hmenu-item.active { color: var(--primary); background: rgba(250,198,67,0.10); border-color: rgba(250,198,67,0.16); }
#tlcmApp .hmenu-nav { width: 46px; border-radius: 18px; border: 1px solid rgba(255,255,255,0.07); background: rgba(255,255,255,0.04); color: var(--text); cursor: pointer; font-size: 20px; font-weight: 800; }
#tlcmApp .info-card { border-radius: 26px; padding: 20px 16px; margin-bottom: 16px; }
#tlcmApp .info-card-header { display: flex; align-items: center; justify-content: space-between; gap: 10px; margin-bottom: 18px; }
#tlcmApp .info-card-title { display: flex; align-items: center; gap: 10px; font-size: 18px; font-weight: 800; color: var(--text); }
#tlcmApp .info-card-actions { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }
#tlcmApp .info-pill { padding: 6px 10px; border-radius: 999px; border: 1px solid rgba(255,255,255,0.14); color: #dbe3f2; font-size: 12px; font-weight: 700; }
#tlcmApp .edit-inline-btn { border: 0; background: transparent; color: var(--muted); font-weight: 800; cursor: pointer; display: inline-flex; align-items: center; gap: 8px; }
#tlcmApp .info-section-title { font-size: 14px; font-weight: 800; color: #9eb0c9; margin: 0 0 12px; }
#tlcmApp .info-row { display: flex; align-items: center; gap: 12px; padding: 10px 0; color: var(--text); }
#tlcmApp .info-divider { height: 1px; background: rgba(255,255,255,0.08); margin: 18px 0; }
#tlcmApp .muted-italic { color: var(--muted); font-style: italic; line-height: 1.5; }
#tlcmApp .medical-alert { border-radius: 18px; background: rgba(93,168,255,0.22); color: #dcebff; padding: 18px 16px; line-height: 1.6; margin-bottom: 18px; display: flex; gap: 12px; align-items: flex-start; }
#tlcmApp .medical-grid { display: grid; gap: 16px; }
#tlcmApp .selector-row, #tlcmApp .filter-chip-row { display: flex; gap: 10px; margin-bottom: 16px; flex-wrap: wrap; }
#tlcmApp .selector-btn, #tlcmApp .filter-chip { border: 1px solid rgba(255,255,255,0.08); background: rgba(255,255,255,0.03); color: var(--muted); border-radius: 14px; padding: 10px 14px; font-weight: 700; cursor: pointer; }
#tlcmApp .selector-btn.active, #tlcmApp .filter-chip.active { background: rgba(250,198,67,0.12); color: var(--primary); border-color: rgba(250,198,67,0.18); }
#tlcmApp .plan-card, #tlcmApp .record-card, #tlcmApp .progress-photo-card { border-radius: 20px; padding: 16px; margin-bottom: 12px; }
#tlcmApp .plan-card-title, #tlcmApp .record-title, #tlcmApp .progress-photo-date { font-weight: 800; color: var(--text); margin: 0 0 8px; }
#tlcmApp .plan-card-meta, #tlcmApp .record-meta, #tlcmApp .progress-photo-meta { color: var(--muted); line-height: 1.5; font-size: 14px; margin: 0; }
#tlcmApp .modal { position: fixed; inset: 0; background: rgba(0,0,0,0.55); display: none; align-items: center; justify-content: center; padding: 16px; z-index: 50; }
#tlcmApp .modal.show { display: flex; }
#tlcmApp .modal-card { width: 100%; max-width: 420px; max-height: 90vh; overflow: auto; border-radius: 24px; background: #22252c; border: 1px solid rgba(255,255,255,0.08); padding: 18px; box-shadow: 0 24px 60px rgba(0,0,0,0.35); scrollbar-width: none; -ms-overflow-style: none; }
#tlcmApp .modal-card::-webkit-scrollbar { width: 0 !important; height: 0 !important; display: none !important; }
#tlcmApp .modal-header { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-bottom: 16px; }
#tlcmApp .modal-title { margin: 0; font-size: 20px; font-weight: 800; }
#tlcmApp .photo-thumb { width: 100%; aspect-ratio: 1 / 1; object-fit: cover; border-radius: 16px; margin-top: 12px; border: 1px solid rgba(255,255,255,0.08); background: rgba(255,255,255,0.03); }
#tlcmApp .avatar-image, #tlcmApp .profile-avatar-image, #tlcmApp .client-avatar-image { width: 100%; height: 100%; object-fit: cover; border-radius: inherit; display: block; }
#tlcmApp .chart-card { border-radius: 22px; padding: 14px; margin-top: 14px; }
#tlcmApp .chart-svg { width: 100%; height: 220px; display: block; }
#tlcmApp .chart-empty { min-height: 220px; display: flex; align-items: center; justify-content: center; color: var(--muted); text-align: center; line-height: 1.6; }
@keyframes tlcm-loading { 0% { transform: translateX(-120%); } 100% { transform: translateX(300%); } }
@keyframes tlcm-pulse { 0%, 100% { transform: scale(1); } 50% { transform: scale(1.05); } }
@keyframes tlcm-fadeIn { from { opacity: 0; } to { opacity: 1; } }
@keyframes tlcm-fadeInUp { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }
@keyframes tlcm-loginCardEnter { from { opacity: 0; transform: translateY(18px) scale(.985); } to { opacity: 1; transform: translateY(0) scale(1); } }
@keyframes tlcm-floatIn { from { opacity: 0; transform: translateY(-8px) scale(.92); } to { opacity: 1; transform: translateY(0) scale(1); } }
@keyframes tlcm-fadeSwitch { from { opacity: 0; transform: translateY(8px); } to { opacity: 1; transform: translateY(0); } }


#tlcmApp .tlcm-icon {
  width: 1.1em;
  height: 1.1em;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex: 0 0 auto;
  line-height: 0;
  vertical-align: middle;
}

#tlcmApp .tlcm-icon svg {
  width: 100%;
  height: 100%;
  display: block;
}

#tlcmApp .tlcm-icon-lg {
  width: 18px;
  height: 18px;
}

#tlcmApp .icon-btn .tlcm-icon,
#tlcmApp .stat-icon .tlcm-icon,
#tlcmApp .mini-icon .tlcm-icon {
  width: 20px;
  height: 20px;
}

#tlcmApp .back-link .tlcm-icon,
#tlcmApp .edit-inline-btn .tlcm-icon,
#tlcmApp .hmenu-nav .tlcm-icon,
#tlcmApp .password-toggle .tlcm-icon,
#tlcmApp .client-card-menu .tlcm-icon {
  width: 18px;
  height: 18px;
}

#tlcmApp .info-row .tlcm-icon {
  width: 18px;
  height: 18px;
  color: #d6dde8;
}


@media (max-width: 480px) { .tlcm-app-mount { padding: 0; } #tlcmApp { width: 100vw; max-width: 100vw; min-height: var(--tlcm-app-vh, 100dvh); height: var(--tlcm-app-vh, 100dvh); max-height: var(--tlcm-app-vh, 100dvh); border-radius: 0; border: 0; } #tlcmApp .screen { min-height: 0; height: 100%; } }

#tlcmApp .nav-spacer { margin-top: auto; }
#tlcmApp .nav-item-danger { margin-top: auto; background: rgba(255,255,255,0.04); color: #ffb4b4; }
#tlcmApp .nav-item-danger:hover { background: rgba(255,114,114,0.14); color: #ffd1d1; }

#tlcmApp .tlcm-toast { position: absolute; left: 14px; right: 14px; bottom: calc(max(14px, env(safe-area-inset-bottom)) + 6px); z-index: 70; padding: 14px 16px; border-radius: 16px; background: rgba(24,26,31,0.92); border: 1px solid rgba(255,255,255,0.08); color: #f5f7fb; box-shadow: 0 18px 36px rgba(0,0,0,0.28); transform: translateY(140%); opacity: 0; pointer-events: none; transition: transform .25s ease, opacity .25s ease; }
#tlcmApp .tlcm-toast.show { transform: translateY(0); opacity: 1; }
#tlcmApp .tlcm-toast.error { border-color: rgba(255,114,114,0.24); color: #ffd0d0; }
#tlcmApp .tlcm-toast.success { border-color: rgba(122,216,110,0.22); color: #d9ffd4; }
#tlcmApp .menu-footer { margin-top: auto; display: flex; flex-direction: column; justify-content: flex-end; min-height: 120px; }

#tlcmApp .exercise-grid { display: grid; gap: 16px; }
#tlcmApp .exercise-card { border-radius: 24px; overflow: visible; background: rgba(255,255,255,0.03); border: 1px solid rgba(255,255,255,0.06); }
#tlcmApp .exercise-media { aspect-ratio: 16 / 9; background: rgba(255,255,255,0.04); display: flex; align-items: center; justify-content: center; overflow: hidden; border-radius: 24px 24px 0 0; }
#tlcmApp .exercise-media-el { width: 100%; height: 100%; object-fit: cover; display: block; }
#tlcmApp .exercise-media-placeholder { width: 72px; height: 72px; color: var(--primary); display: flex; align-items: center; justify-content: center; }
#tlcmApp .exercise-body { padding: 16px; }
#tlcmApp .exercise-topline { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-bottom: 10px; }
#tlcmApp .exercise-badge { display: inline-flex; align-items: center; padding: 7px 10px; border-radius: 999px; background: rgba(250,198,67,0.14); color: var(--primary); border: 1px solid rgba(250,198,67,0.18); font-size: 12px; font-weight: 800; }
#tlcmApp .exercise-title { margin: 0 0 8px; font-size: 18px; font-weight: 800; }
#tlcmApp .exercise-desc { margin: 0; color: var(--muted); line-height: 1.55; font-size: 14px; }


#tlcmApp .exercise-card { position: relative; }
#tlcmApp .exercise-media { position: relative; }
#tlcmApp .exercise-card-menu {
  z-index: 8;
  position: absolute;
  right: 12px;
  top: 12px;
  width: 42px;
  height: 42px;
  border-radius: 50%;
  border: 0;
  color: rgba(255,255,255,0.92);
  background: rgba(17,17,17,0.34);
  backdrop-filter: blur(6px);
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
}
#tlcmApp .exercise-dropdown {
  z-index: 9;
  position: absolute;
  top: 62px;
  right: 12px;
  width: 170px;
  border-radius: 18px;
  border: 1px solid rgba(255,255,255,0.08);
  background: #262931;
  box-shadow: 0 18px 34px rgba(0,0,0,0.28);
  overflow: hidden;
  z-index: 5;
}
#tlcmApp .exercise-dropdown-item {
  width: 100%;
  background: transparent;
  border: 0;
  color: var(--text);
  text-align: left;
  padding: 14px 16px;
  cursor: pointer;
  font-weight: 700;
  border-bottom: 1px solid rgba(255,255,255,0.06);
}
#tlcmApp .exercise-dropdown-item:last-child { border-bottom: 0; }
#tlcmApp .exercise-dropdown-item:hover { background: rgba(255,255,255,0.04); }
#tlcmApp .exercise-dropdown-item.danger { color: #ff9a9a; }
#tlcmApp .exercise-badges { display:flex; flex-wrap:wrap; gap:8px; }
#tlcmApp .checkbox-grid { display:grid; grid-template-columns: repeat(2, minmax(0,1fr)); gap:10px; }
#tlcmApp .checkbox-card {
  display:flex;
  align-items:center;
  gap:10px;
  padding:12px 14px;
  border-radius:16px;
  border:1px solid rgba(255,255,255,0.08);
  background: rgba(255,255,255,0.03);
  color: var(--text);
  cursor:pointer;
}
#tlcmApp .checkbox-card input { width:18px; height:18px; accent-color: var(--primary); flex:0 0 auto; }
#tlcmApp .checkbox-card span { font-size:14px; line-height:1.3; }


#tlcmApp .exercise-toolbar {
  display: grid;
  grid-template-columns: 1.4fr 1fr;
  gap: 12px;
  margin-bottom: 16px;
}

#tlcmApp .exercise-search-wrap,
#tlcmApp .exercise-filter-wrap {
  position: relative;
}

#tlcmApp .exercise-search-input,
#tlcmApp .exercise-filter-select {
  min-height: 52px;
}

#tlcmApp .exercise-search-input {
  padding-right: 52px;
}

#tlcmApp .exercise-search-icon {
  position: absolute;
  right: 16px;
  top: 50%;
  transform: translateY(-50%);
  color: var(--muted);
  pointer-events: none;
  display: flex;
  align-items: center;
  justify-content: center;
}

#tlcmApp .exercise-search-icon .tlcm-icon {
  width: 18px;
  height: 18px;
}

@media (max-width: 640px) {
  #tlcmApp .exercise-toolbar {
    grid-template-columns: 1fr;
  }
}


#tlcmApp .plan-assigned-avatars { display:flex; align-items:center; gap:8px; flex-wrap:wrap; }
#tlcmApp .plan-avatar { width:32px; height:32px; border-radius:50%; overflow:hidden; background: linear-gradient(135deg, var(--card-gold-1), var(--card-gold-2)); color:#1c1d21; font-weight:800; display:flex; align-items:center; justify-content:center; border:2px solid rgba(255,255,255,0.12); font-size:12px; }
#tlcmApp .checkbox-card-profile .checkbox-card-row { display:flex; align-items:center; gap:10px; }
#tlcmApp .mini-profile-thumb { width:32px; height:32px; border-radius:50%; overflow:hidden; background: linear-gradient(135deg, var(--card-gold-1), var(--card-gold-2)); color:#1c1d21; font-weight:800; display:flex; align-items:center; justify-content:center; font-size:12px; flex:0 0 auto; }


#tlcmApp .checkbox-card-input-hidden { position: absolute; opacity: 0; pointer-events: none; width: 0; height: 0; }
#tlcmApp .checkbox-card-selectable { position: relative; }
#tlcmApp .checkbox-card-selectable.selected { border-color: rgba(250,198,67,0.45); background: rgba(250,198,67,0.12); box-shadow: inset 0 0 0 1px rgba(250,198,67,0.16); }
#tlcmApp .checkbox-card-text-wrap { display:flex; flex-direction:column; gap:2px; }
#tlcmApp .checkbox-card-text-wrap strong { font-size:14px; font-weight:800; color: var(--text); }
#tlcmApp .plan-card-body { display:flex; flex-direction:column; gap:12px; }
#tlcmApp .plan-assigned-avatars-large { gap:10px; }
#tlcmApp .plan-avatar-large { width:44px; height:44px; font-size:14px; border-width: 3px; }
#tlcmApp .btn-primary.is-loading, #tlcmApp .btn-secondary.is-loading, #tlcmApp .btn-ghost.is-loading { opacity: .88; cursor: wait; }
#tlcmApp .btn-primary:disabled, #tlcmApp .btn-secondary:disabled, #tlcmApp .btn-ghost:disabled { opacity: .88; cursor: wait; }
#tlcmApp .btn-spinner { width: 18px; height: 18px; border-radius: 50%; border: 2px solid currentColor; border-right-color: transparent; display: inline-block; animation: tlcm-spin .8s linear infinite; }
#tlcmApp .btn-primary.is-loading, #tlcmApp .btn-secondary.is-loading, #tlcmApp .btn-ghost.is-loading { display:inline-flex; align-items:center; justify-content:center; gap:10px; }
#tlcmApp .exercise-dropdown-item.is-loading, #tlcmApp .client-dropdown-item.is-loading, #tlcmApp .icon-btn.is-loading, #tlcmApp .plan-set-step.is-loading, #tlcmApp .plan-add-exercise.is-loading, #tlcmApp .plan-week-menu-btn.is-loading, #tlcmApp .plan-week-nav.is-loading, #tlcmApp .plan-builder-add-client.is-loading, #tlcmApp .plan-builder-edit-image.is-loading { opacity:.88; cursor:wait; }
#tlcmApp .exercise-dropdown-item.is-loading, #tlcmApp .client-dropdown-item.is-loading { display:inline-flex; width:100%; align-items:center; justify-content:center; gap:10px; }
#tlcmApp .icon-btn.is-loading, #tlcmApp .plan-set-step.is-loading, #tlcmApp .plan-week-menu-btn.is-loading, #tlcmApp .plan-week-nav.is-loading, #tlcmApp .plan-builder-add-client.is-loading, #tlcmApp .plan-builder-edit-image.is-loading { display:inline-flex; align-items:center; justify-content:center; }

@keyframes tlcm-spin { from { transform: rotate(0deg); } to { transform: rotate(360deg); } }

#tlcmApp .plan-builder-hero { position: relative; min-height: 210px; border-radius: 28px; overflow: hidden; margin-bottom: 18px; background: rgba(255,255,255,0.04); border: 1px solid rgba(255,255,255,0.06); }
#tlcmApp .plan-builder-cover { position: absolute; inset: 0; }
#tlcmApp .plan-builder-cover-img, #tlcmApp .plan-builder-cover video { width: 100%; height: 100%; object-fit: cover; display: block; }
#tlcmApp .plan-builder-cover-placeholder { width: 100%; height: 100%; display:flex; align-items:center; justify-content:center; color: var(--muted); }
#tlcmApp .plan-builder-overlay { position:absolute; inset:0; background: linear-gradient(180deg, rgba(28,29,33,0.18) 0%, rgba(28,29,33,0.72) 75%, rgba(28,29,33,0.88) 100%); }
#tlcmApp .plan-builder-content { position: relative; z-index: 1; padding: 18px; display:flex; flex-direction:column; justify-content:flex-end; min-height:210px; }
#tlcmApp .plan-builder-title { margin:0 0 8px; font-size:32px; font-weight:800; }
#tlcmApp .plan-builder-description { margin:0 0 14px; color:#e5e9f2; max-width: 80%; }
#tlcmApp .plan-builder-actions { display:flex; align-items:center; gap:12px; flex-wrap:wrap; margin: 0 0 14px; position:relative; z-index:2; }
#tlcmApp .plan-save-btn { min-width: 132px; }
#tlcmApp .plan-save-status { color:#f2f4f8; font-size:13px; font-weight:700; opacity:.92; }
#tlcmApp .plan-builder-clients-card { align-self:flex-start; display:flex; align-items:center; gap:14px; background: rgba(255,255,255,0.8); color:#2b3442; border-radius:18px; padding:12px 14px; }
#tlcmApp .plan-builder-clients-label { font-size:13px; font-weight:800; text-transform:uppercase; color:#66758a; }
#tlcmApp .plan-builder-client-avatars { display:flex; align-items:center; gap:8px; }
#tlcmApp .plan-builder-add-client, #tlcmApp .plan-builder-edit-image { width:38px; height:38px; border-radius:50%; border:1px solid rgba(0,0,0,0.08); background: rgba(255,255,255,0.82); color:#3565c8; display:flex; align-items:center; justify-content:center; cursor:pointer; }
#tlcmApp .plan-builder-edit-image { position:absolute; top:16px; right:16px; z-index:2; }
#tlcmApp .plan-weeks-row { display:grid; grid-template-columns:44px 1fr 44px; align-items:center; gap:12px; margin-bottom:12px; }
#tlcmApp .plan-add-week-btn { justify-self:center; min-width:min(100%,280px); }
#tlcmApp .plan-week-nav-placeholder { visibility:hidden; pointer-events:none; }
#tlcmApp .plan-weeks-scroller { display:flex; gap:10px; overflow-x:auto; overflow-y:visible; padding-bottom:12px; margin-bottom:0; scrollbar-width:none; position:relative; z-index:60; }
#tlcmApp .plan-weeks-scroller::-webkit-scrollbar { display:none; }
#tlcmApp .plan-week-chip { position:relative; min-width:160px; background: rgba(255,255,255,0.04); border:1px solid rgba(255,255,255,0.08); border-radius:18px; padding:6px; display:flex; align-items:center; gap:6px; overflow:visible; flex:0 0 auto; }
#tlcmApp .plan-week-chip.active { background: rgba(250,198,67,0.16); border-color: rgba(250,198,67,0.55); color: var(--primary); }
#tlcmApp .plan-week-chip.active .plan-week-main, #tlcmApp .plan-week-chip.active .plan-week-menu-btn { color: var(--primary); }
#tlcmApp .plan-week-main { flex:1; border:0; background:transparent; color:inherit; text-align:left; padding:10px 12px; font-weight:800; cursor:pointer; }
#tlcmApp .plan-week-menu-btn, #tlcmApp .plan-week-nav, #tlcmApp .plan-day-menu-btn { width:38px; height:38px; border-radius:14px; border:0; background:transparent; color:inherit; display:flex; align-items:center; justify-content:center; cursor:pointer; position:relative; z-index:3; }
#tlcmApp .plan-week-menu-btn svg, #tlcmApp .plan-week-nav svg, #tlcmApp .plan-day-menu-btn svg { pointer-events:none; }
#tlcmApp .plan-day-card { background: rgba(255,255,255,0.04); border:1px solid rgba(255,255,255,0.08); border-radius:24px; padding:16px; margin-bottom:14px; position:relative; }
#tlcmApp .plan-day-header { display:flex; align-items:center; justify-content:space-between; gap:12px; margin-bottom:14px; position:relative; }
#tlcmApp .plan-day-title-wrap { display:flex; align-items:center; gap:10px; }
#tlcmApp .plan-day-title { margin:0; font-size:26px; font-weight:800; }
#tlcmApp .plan-day-drag { color: var(--muted); display:flex; }
#tlcmApp .plan-add-exercise { width:100%; min-height:54px; border-radius:18px; border:1px dashed rgba(255,255,255,0.18); background: transparent; color: var(--muted); font-weight:700; cursor:pointer; }
#tlcmApp .plan-exercise-block { border:1px solid rgba(255,255,255,0.08); border-radius:20px; padding:14px; margin-bottom:12px; background: rgba(255,255,255,0.03); }
#tlcmApp .plan-exercise-head { display:flex; gap:14px; align-items:center; margin-bottom:12px; }
#tlcmApp .plan-exercise-media { width:92px; height:92px; border-radius:16px; overflow:hidden; flex:0 0 auto; background: rgba(255,255,255,0.04); }
#tlcmApp .plan-exercise-main { flex:1; }
#tlcmApp .plan-exercise-name { margin:0 0 10px; font-size:18px; font-weight:800; }
#tlcmApp .plan-set-control { display:inline-flex; align-items:center; justify-content:center; border:1px solid rgba(255,255,255,0.1); border-radius:999px; overflow:hidden; min-height:44px; }
#tlcmApp .plan-set-step { width:44px; height:44px; border:0; background:transparent; color: var(--text); font-size:22px; cursor:pointer; display:flex; align-items:center; justify-content:center; line-height:1; padding:0; }
#tlcmApp .plan-set-count { min-height:44px; padding:0 16px; font-weight:800; display:flex; align-items:center; justify-content:center; }
#tlcmApp .plan-set-grid-wrap { overflow-x:auto; }
#tlcmApp .plan-set-grid { display:grid; gap:8px; align-items:center; min-width: 100%; }
#tlcmApp .plan-set-label { color: var(--muted); font-weight:700; font-size:13px; }
#tlcmApp .plan-set-colhead { text-align:center; color: var(--muted); font-weight:700; }
#tlcmApp .plan-set-input { min-height:44px; padding:0 10px; text-align:center; }
#tlcmApp .plan-set-e1rm { min-height:44px; display:flex; align-items:center; justify-content:center; border-radius:12px; background: rgba(255,255,255,0.04); color: var(--text); font-weight:800; }
#tlcmApp .plan-picker-list { display:grid; gap:10px; max-height: 50vh; overflow:auto; }
#tlcmApp .plan-picker-item { width:100%; border:1px solid rgba(255,255,255,0.08); background: rgba(255,255,255,0.03); border-radius:18px; padding:10px; display:flex; align-items:center; gap:12px; cursor:pointer; color: var(--text); text-align:left; }
#tlcmApp .plan-picker-thumb { width:68px; height:68px; border-radius:12px; object-fit:cover; display:flex; align-items:center; justify-content:center; background: rgba(255,255,255,0.04); }
#tlcmApp .plan-picker-thumb.placeholder .tlcm-icon { width:24px; height:24px; }
#tlcmApp .plan-picker-name { font-weight:800; }
#tlcmApp .tlcm-icon { display:inline-flex; width:18px; height:18px; }
#tlcmApp .tlcm-icon svg { width:100%; height:100%; }

#tlcmApp .plan-week-dropdown { z-index: 30; right: 6px; top: calc(100% - 2px); }
#tlcmApp .plan-weeks-scroller { align-items: stretch; }

#tlcmApp .plan-top-actions { display:flex; align-items:center; justify-content:space-between; gap:12px; margin-bottom:14px; }
#tlcmApp .plan-save-btn-header { min-width:132px; }
#tlcmApp .plan-builder-weeks { position:relative; z-index:80; overflow:visible; }
#tlcmApp .plan-builder-days { position:relative; z-index:1; overflow:visible; }
#tlcmApp .plan-weeks-scroller { position:relative; z-index:9; }
#tlcmApp .plan-week-chip { z-index:10; }
#tlcmApp .plan-week-chip.menu-open { z-index:1000; }
#tlcmApp .plan-week-dropdown { z-index:999 !important; left:0; right:auto; top:calc(100% + 8px); min-width:180px; max-width:220px; }
#tlcmApp .plan-day-toggle { width:32px; height:32px; border:0; background:transparent; color:var(--text); display:flex; align-items:center; justify-content:center; cursor:pointer; padding:0; }
#tlcmApp .plan-day-card.collapsed .plan-day-header { margin-bottom:0; }
#tlcmApp .plan-exercise-block { position:relative; }
#tlcmApp .plan-exercise-delete { position:absolute; top:10px; right:10px; width:28px; height:28px; border-radius:50%; border:0; background:rgba(255,82,82,0.16); color:#ff6a6a; font-size:20px; line-height:1; display:flex; align-items:center; justify-content:center; cursor:pointer; z-index:2; }
#tlcmApp .plan-set-control { align-items:center !important; }
#tlcmApp .plan-set-step, #tlcmApp .plan-set-count { align-self:center !important; }


#tlcmApp .plan-top-actions { display:flex; align-items:center; justify-content:space-between; gap:12px; margin-bottom:14px; }
#tlcmApp .plan-top-actions .back-link { margin:0; }
#tlcmApp .plan-top-actions .plan-save-btn-header { margin:0; }
#tlcmApp .plan-save-status-wrap { margin: 0 0 14px; }
#tlcmApp .plan-builder-actions { display:flex; align-items:center; gap:12px; flex-wrap:wrap; margin:0; position:relative; z-index:2; }
#tlcmApp .plan-day-header-actions { display:flex; align-items:center; gap:6px; flex:0 0 auto; }
#tlcmApp .plan-day-drag { display:none !important; }
#tlcmApp .plan-day-dropdown { position:absolute; top:56px; right:12px; z-index:950; min-width:160px; }
#tlcmApp .plan-day-card { position:relative; overflow:visible; }
#tlcmApp .plan-day-title { margin:0; }
#tlcmApp .plan-exercise-block { position:relative; z-index:1; }
#tlcmApp .plan-exercise-media .exercise-media-el { width:100%; height:100%; object-fit:cover; display:block; }
#tlcmApp .plan-exercise-media .exercise-media-placeholder { width:100%; height:100%; display:flex; align-items:center; justify-content:center; }
#tlcmApp .plan-day-toggle { background: rgba(255,255,255,0.04); }


#tlcmApp .plan-builder-weeks { position:relative; z-index:2000 !important; overflow:visible; }
#tlcmApp .plan-weeks-scroller { position:relative; z-index:2001 !important; overflow-y:visible !important; }
#tlcmApp .plan-week-chip { position:relative; z-index:2002; overflow:visible !important; isolation:isolate; }
#tlcmApp .plan-week-chip.menu-open { z-index:9999 !important; }
#tlcmApp .plan-week-dropdown { position:absolute; top:calc(100% + 8px); left:0; right:auto; z-index:10000 !important; min-width:180px; max-width:220px; }
#tlcmApp .plan-builder-days,
#tlcmApp .plan-day-card,
#tlcmApp .plan-exercise-block { position:relative; z-index:1 !important; }
#tlcmApp .plan-day-title-wrap > .plan-day-drag,
#tlcmApp .plan-day-title-wrap > .tlcm-icon,
#tlcmApp .plan-day-title-wrap > button,
#tlcmApp .plan-day-title-wrap > span:not(.plan-day-title) { display:none !important; }
#tlcmApp .plan-exercise-media .exercise-media-el { width:100%; height:100%; object-fit:cover; display:block; }
#tlcmApp .plan-exercise-media .exercise-media-placeholder { width:100%; height:100%; display:flex; align-items:center; justify-content:center; }

#tlcmApp .plan-top-actions { align-items:flex-start; }
#tlcmApp .plan-top-actions-right { display:flex; flex-direction:column; align-items:flex-end; gap:8px; }
#tlcmApp .plan-top-actions-right .plan-save-status-wrap.header { margin:0; }
#tlcmApp .plan-builder-actions, #tlcmApp .plan-save-btn-inline { display:none !important; }
#tlcmApp .plan-builder-hero { z-index: 1; }
#tlcmApp .plan-builder-weeks, #tlcmApp .plan-weeks-scroller, #tlcmApp .plan-week-chip { overflow: visible !important; }
#tlcmApp .plan-week-dropdown.floating-open { box-shadow: 0 24px 44px rgba(0,0,0,0.42); }
#tlcmApp .plan-builder-days, #tlcmApp .plan-day-card, #tlcmApp .plan-exercise-block { z-index: 1 !important; }


/* v1.6.1 definitive builder menu layering */
#tlcmApp .plan-builder-weeks,
#tlcmApp .plan-weeks-row,
#tlcmApp .plan-weeks-scroller {
  position: relative;
  overflow: visible !important;
}
#tlcmApp .plan-week-chip {
  position: relative;
  overflow: visible !important;
  isolation: isolate;
}
#tlcmApp .plan-week-chip.menu-open {
  z-index: 2147483000 !important;
}
#tlcmApp .plan-week-dropdown {
  position: absolute !important;
  top: calc(100% + 8px) !important;
  left: 0 !important;
  right: auto !important;
  bottom: auto !important;
  margin: 0 !important;
  transform: none !important;
  z-index: 2147483001 !important;
}
#tlcmApp .plan-builder-days,
#tlcmApp .plan-day-card,
#tlcmApp .plan-exercise-block {
  z-index: 1 !important;
}


/* v1.6.2 ensure hamburger menu is always above builder UI */
#tlcmApp .menu-overlay {
  z-index: 2147483645 !important;
}
#tlcmApp .side-menu {
  z-index: 2147483646 !important;
}
#tlcmApp .side-menu.open {
  z-index: 2147483646 !important;
}


#tlcmApp .client-main {
  padding: max(12px, env(safe-area-inset-top)) 18px 0;
  background: var(--bg);
  height: 100%;
  min-height: 0;
  overflow: hidden;
}
#tlcmApp .client-shell {
  min-height: 100%;
  height: 100%;
  min-height: 0;
  position: relative;
  display: grid;
  grid-template-rows: auto minmax(0, 1fr);
  overflow: hidden;
}
#tlcmApp .client-header-row {
  display:flex; align-items:center; justify-content:space-between; gap:12px; margin: 6px 0 20px;
}
#tlcmApp .client-header-left { display:flex; align-items:center; gap:12px; min-width:0; }
#tlcmApp .client-logo-mini { width:48px; height:48px; border-radius:16px; background:rgba(255,255,255,.05); display:flex; align-items:center; justify-content:center; overflow:hidden; }
#tlcmApp .client-logo-mini img { width:32px; height:32px; object-fit:contain; }
#tlcmApp .client-hello { font-size:22px; font-weight:800; line-height:1.1; }
#tlcmApp .client-subline { color:var(--muted); font-size:13px; }
#tlcmApp .client-profile-trigger { border:0; background:transparent; padding:0; cursor:pointer; }
#tlcmApp .client-profile-avatar { width:50px; height:50px; border-radius:16px; overflow:hidden; display:flex; align-items:center; justify-content:center; background:linear-gradient(135deg,var(--card-gold-1),var(--card-gold-2)); color:#1c1d21; font-weight:800; }
#tlcmApp .client-content {
  min-height: 0;
  height: 100%;
  overflow-y: auto;
  overflow-x: hidden;
  -webkit-overflow-scrolling: touch;
  overscroll-behavior: contain;
  scrollbar-width: none;
  -ms-overflow-style: none;
  padding-bottom: calc(124px + env(safe-area-inset-bottom));
}
#tlcmApp .client-content::-webkit-scrollbar { display: none; }
#tlcmApp .client-page { display:none; }
#tlcmApp .client-page.active { display:block; animation: tlcm-fadeIn .25s ease; }
#tlcmApp .client-page-head { margin-bottom:18px; }
#tlcmApp .client-page-title { margin:0 0 6px; font-size:28px; font-weight:800; }
#tlcmApp .client-page-sub { margin:0; color:var(--muted); font-size:14px; line-height:1.5; }
#tlcmApp .client-stats-grid { display:grid; gap:12px; grid-template-columns:repeat(2,minmax(0,1fr)); margin-bottom:18px; }
#tlcmApp .client-stats-grid.detail { grid-template-columns:1fr; }
#tlcmApp .client-stat-card { border-radius:24px; padding:16px; display:flex; gap:12px; align-items:center; }
#tlcmApp .client-stat-icon { width:42px; height:42px; border-radius:14px; background:rgba(250,198,67,.12); color:var(--primary); display:flex; align-items:center; justify-content:center; }
#tlcmApp .client-stat-value { font-size:20px; font-weight:800; }
#tlcmApp .client-stat-label { color:var(--muted); font-size:12px; }
#tlcmApp .client-panel { border-radius:26px; padding:18px 16px; background:rgba(255,255,255,.03); border:1px solid rgba(255,255,255,.06); margin-bottom:18px; }
#tlcmApp .client-panel-title { font-size:18px; font-weight:800; margin-bottom:14px; }
#tlcmApp .client-history-list { display:grid; gap:12px; }
#tlcmApp .client-history-card { width:100%; text-align:left; border-radius:22px; padding:16px; border:1px solid rgba(255,255,255,.07); background:rgba(255,255,255,.03); color:var(--text); display:grid; gap:10px; }
#tlcmApp .client-history-card.compact { cursor:default; }
#tlcmApp .client-history-title { font-size:16px; font-weight:800; }
#tlcmApp .client-history-date { color:var(--muted); font-size:13px; }
#tlcmApp .client-history-meta { display:flex; flex-wrap:wrap; gap:8px 14px; color:var(--muted); font-size:13px; }
#tlcmApp .client-history-row { display:flex; justify-content:space-between; gap:14px; padding:12px 0; border-top:1px solid rgba(255,255,255,.06); }
#tlcmApp .client-history-row:first-of-type { border-top:0; }
#tlcmApp .client-bottom-nav {
  position:absolute;
  left:14px;
  right:14px;
  bottom:10px;
  z-index:30;
  padding:14px 16px calc(12px + env(safe-area-inset-bottom));
  display:grid;
  grid-template-columns:1fr 1fr 1.2fr 1fr 1fr;
  gap:8px;
  align-items:end;
  border-radius:28px;
  background:rgba(31,33,40,.92);
  border:1px solid rgba(255,255,255,.06);
  box-shadow:0 18px 40px rgba(0,0,0,.35), inset 0 1px 0 rgba(255,255,255,.03);
  backdrop-filter:blur(14px);
}
#tlcmApp .client-nav-item {
  border:0;
  background:transparent;
  color:var(--muted);
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:flex-end;
  gap:6px;
  font-size:11px;
  font-weight:700;
  cursor:pointer;
  min-height:58px;
  padding:4px 2px;
}
#tlcmApp .client-nav-item .tlcm-icon, #tlcmApp .client-nav-item .logo-mark-inline { width:22px; height:22px; display:flex; align-items:center; justify-content:center; }
#tlcmApp .logo-mark-inline img { width:22px; height:22px; object-fit:contain; }
#tlcmApp .client-nav-item.active { color:var(--primary); }
#tlcmApp .client-nav-plus-slot {
  position:relative;
  display:flex;
  align-items:flex-end;
  justify-content:center;
}
#tlcmApp .client-plus-nav {
  color:var(--muted);
}
#tlcmApp .client-plus-nav .tlcm-icon {
  width:22px;
  height:22px;
  background:transparent;
  color:inherit;
  box-shadow:none;
}
#tlcmApp .client-plus-nav.active,
#tlcmApp .client-plus-nav:hover { color:var(--text); }
#tlcmApp .client-plan-center {
  position:relative;
  transform:translateY(-22px);
}
#tlcmApp .client-plan-center .tlcm-icon, #tlcmApp .client-plan-center .logo-mark-inline {
  width:72px;
  height:72px;
  border-radius:50%;
  background:linear-gradient(180deg, rgba(255,255,255,.14), rgba(255,255,255,.05));
  border:1px solid rgba(255,255,255,.12);
  color:#fff;
  box-shadow:0 18px 35px rgba(0,0,0,.4), 0 0 0 8px rgba(20,22,28,.9);
  display:flex;
  align-items:center;
  justify-content:center;
}
#tlcmApp .client-plan-center .logo-mark-inline img {
  width:36px;
  height:36px;
}
#tlcmApp .client-plan-center.active .tlcm-icon,
#tlcmApp .client-plan-center.active .logo-mark-inline {
  box-shadow:0 18px 35px rgba(0,0,0,.42), 0 0 0 8px rgba(20,22,28,.9), 0 0 28px rgba(250,198,67,.18);
}
#tlcmApp .client-plan-center span:last-child { color:#fff; font-weight:800; }
#tlcmApp .client-fab-menu {
  position:absolute;
  bottom:72px;
  left:50%;
  transform:translateX(-50%);
  display:grid;
  gap:10px;
  min-width:220px;
  z-index:34;
}
#tlcmApp .client-fab-action { border:1px solid rgba(255,255,255,.08); background:#262931; color:var(--text); border-radius:16px; padding:12px 14px; display:flex; align-items:center; gap:10px; box-shadow:0 14px 30px rgba(0,0,0,.28); }

#tlcmApp .client-plan-card { cursor:pointer; }
#tlcmApp .client-self-profile .profile-top-banner { min-height:126px; }
#tlcmApp .client-main .back-row { margin-bottom:14px; }
@media (max-width: 480px) {
  #tlcmApp .client-main { padding-bottom: 0; }
}


#tlcmApp .checkbox-row {
  display: flex;
  align-items: center;
  gap: 10px;
  color: var(--text);
  font-weight: 600;
}

#tlcmApp .checkbox-row input[type="checkbox"] {
  width: 18px;
  height: 18px;
}

#tlcmApp .pinned-pr-panel {
  margin-bottom: 16px;
}

#tlcmApp .pinned-pr-card {
  border-radius: 24px;
  padding: 18px 16px;
  background: linear-gradient(135deg, rgba(250,198,67,0.16), rgba(255,255,255,0.04));
  border: 1px solid rgba(250,198,67,0.18);
}

#tlcmApp .pinned-pr-exercise {
  font-size: 14px;
  font-weight: 700;
  color: var(--muted);
  margin-bottom: 8px;
}

#tlcmApp .pinned-pr-value {
  display: flex;
  align-items: flex-start;
  gap: 2px;
  line-height: 1;
}

#tlcmApp .pinned-pr-weight {
  font-size: 44px;
  font-weight: 900;
  color: var(--text);
  letter-spacing: -0.03em;
}

#tlcmApp .pinned-pr-reps {
  font-size: 16px;
  font-weight: 800;
  color: var(--primary);
  transform: translateY(4px);
}

#tlcmApp .pinned-pr-meta {
  margin-top: 8px;
  color: var(--muted);
  font-size: 13px;
  font-weight: 600;
}


#tlcmApp .record-card-head{display:flex;align-items:flex-start;justify-content:space-between;gap:12px}
#tlcmApp .record-actions{display:flex;gap:8px;flex-shrink:0}
#tlcmApp .mini-action-btn{border:1px solid rgba(255,255,255,.08);background:rgba(255,255,255,.04);color:var(--text);border-radius:12px;padding:8px 10px;font-weight:700;cursor:pointer}
#tlcmApp .mini-action-btn.danger{color:#ff9a9a;border-color:rgba(255,114,114,.22)}
#tlcmApp .record-badge{margin:8px 0 0;font-size:12px;color:var(--primary);font-weight:700}
#tlcmApp .pinned-pr-weight{font-size:34px;font-weight:900;line-height:1}
#tlcmApp .pinned-pr-reps{font-size:15px;vertical-align:super;margin-left:2px}

/* v1.7.21 fixes */
#tlcmApp .progress-photo-card { position: relative; }
#tlcmApp .progress-delete-btn { position: absolute; top: 14px; right: 14px; z-index: 2; }
#tlcmApp .bodyweight-custom-range { display: grid; grid-template-columns: 1fr 1fr auto; gap: 10px; margin-bottom: 14px; }
#tlcmApp .bodyweight-range-input { min-height: 44px; }


#tlcmApp .bodyweight-table-wrap{margin-top:16px}
#tlcmApp .bodyweight-table-title{font-size:14px;font-weight:800;color:#dbe3f2;margin-bottom:10px}
#tlcmApp .bodyweight-table{border:1px solid rgba(255,255,255,0.08);border-radius:18px;overflow:hidden;background:rgba(255,255,255,0.03)}
#tlcmApp .bodyweight-table-head,
#tlcmApp .bodyweight-table-row{display:grid;grid-template-columns:1.4fr .8fr auto;gap:10px;align-items:center;padding:12px 14px}
#tlcmApp .bodyweight-table-head{font-size:12px;font-weight:800;color:var(--muted);background:rgba(255,255,255,0.02)}
#tlcmApp .bodyweight-table-row{border-top:1px solid rgba(255,255,255,0.06);font-size:14px}
#tlcmApp .bodyweight-delete-btn{border:1px solid rgba(255,255,255,0.08);background:rgba(255,255,255,0.03);color:#ff9a9a;border-radius:12px;padding:8px 10px;font-weight:700;cursor:pointer}
#tlcmApp .bodyweight-delete-btn[disabled]{opacity:.7;cursor:wait}
#tlcmApp .compact-empty{min-height:0;padding:16px;border-style:solid}


/* v1.7.21 pinned records redesign */
#tlcmApp .pinned-pr-stack{
  display:flex;
  flex-direction:column;
  gap:12px;
}
#tlcmApp .pinned-pr-card{
  text-align:center;
}
#tlcmApp .pinned-pr-exercise{
  margin-bottom:12px;
}
#tlcmApp .pinned-pr-value{
  display:flex;
  align-items:flex-start;
  justify-content:center;
  gap:6px;
  line-height:1;
}
#tlcmApp .pinned-pr-main{
  display:inline-flex;
  align-items:baseline;
  justify-content:center;
  gap:6px;
}
#tlcmApp .pinned-pr-weight{
  font-size:56px !important;
  font-weight:900;
  line-height:.95;
  letter-spacing:-0.04em;
}
#tlcmApp .pinned-pr-unit{
  font-size:20px;
  font-weight:800;
  opacity:.92;
}
#tlcmApp .pinned-pr-reps{
  font-size:18px !important;
  font-weight:800;
  color:var(--primary);
  vertical-align:super;
  transform:translateY(-2px);
}
#tlcmApp .pinned-pr-meta{
  margin-top:10px;
}

#tlcmApp .chart-point{cursor:pointer;}