* { box-sizing: border-box; }
:root {
    /* Fixed mobile bottom tab bar — match .mobile-bottom-nav footprint (min-height + padding + icons) */
    --mobile-bottom-nav-height: 84px;
    --bottom-nav-height: var(--mobile-bottom-nav-height);
    /* Breathing room above the bar for scrollable column only (not global body padding) */
    --mobile-bottom-content-inset: 28px;
    /* Extra clearance when Smart Gym Scan sticky CTA is present (fixed above nav) */
    --mobile-smart-scan-sticky-extra: 0px;
    --mobile-header-height: 76px;
    /* Fixed marketing landing bar (mobile): safe area + inner row + vertical padding */
    --landing-mobile-fixed-header-offset: calc(env(safe-area-inset-top, 0px) + var(--mobile-header-height) + 18px);
    --bg: #f6f8fb;
    --text: #0f172a;
    --text-soft: #334155;
    --text-muted: #64748b;
    --surface: #ffffff;
    --surface-soft: #eef3f9;
    --surface-2: #f8fafc;
    --border: rgba(15, 23, 42, 0.06);
    --border-strong: rgba(15, 23, 42, 0.12);
    --header-bg: rgba(255, 255, 255, 0.92);
    --header-border: rgba(15, 23, 42, 0.06);
    --primary: #7b8cff;
    --primary-2: #6b5fd6;
    --primary-soft: rgba(37, 99, 235, 0.08);
    --card-shadow: 0 10px 30px rgba(15, 23, 42, 0.04);
    --card-shadow-lg: 0 18px 40px rgba(15, 23, 42, 0.06);
}

html[data-theme="dark"] {
    color-scheme: dark;
    --bg: #0c1022;
    --text: #e8ecff;
    --text-soft: #c4cce8;
    --text-muted: #a8b4d8;
    --surface: #141c38;
    --surface-soft: #10182f;
    --surface-2: #1a2344;
    --border: rgba(130, 150, 255, 0.22);
    --border-strong: rgba(130, 150, 255, 0.35);
    --header-bg: rgba(12, 16, 34, 0.92);
    --header-border: rgba(130, 150, 255, 0.18);
    --primary: #7b8cff;
    --primary-2: #9b6fd6;
    --primary-soft: rgba(123, 140, 255, 0.18);
    --card-shadow: 0 14px 34px rgba(0, 0, 0, 0.45);
    --card-shadow-lg: 0 22px 44px rgba(0, 0, 0, 0.48);
}

html, body {
    margin: 0;
    padding: 0;
    font-family: Inter, Arial, sans-serif;
    background: var(--bg);
    color: var(--text);
}
a { color: inherit; text-decoration: none; }
body {
    min-height: 100vh;
    min-height: 100dvh;
    display: flex;
    flex-direction: column;
}
html, body {
    max-width: 100%;
    overflow-x: hidden;
}
.container { width: min(1180px, calc(100% - 40px)); margin: 0 auto; }
.container,
.dashboard-shell,
.client-app-shell,
.client-app-main,
.client-daily-shell,
.panel,
.workout-exercise-card,
.auth-form,
.dashboard-grid {
    min-width: 0;
}
.hero-actions > * {
    min-width: 0;
}

.site-header {
    position: sticky;
    top: 0;
    z-index: 1000;
    backdrop-filter: blur(16px);
    background: color-mix(in srgb, var(--bg) 84%, transparent);
    border-bottom: 1px solid color-mix(in srgb, var(--border) 65%, transparent);
}
.header-inner {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: space-between;
    min-height: 76px;
    padding: 12px 0;
    gap: 20px;
}

/* Guest marketing home only (landing_marketing_header): burger + drawer on mobile, full nav on desktop */
.header-inner--landing-market {
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    align-items: center;
    gap: 16px;
    isolation: isolate;
}

.header-inner--landing-market .header-landing-burger.burger-btn {
    display: none;
    position: relative;
    z-index: 3;
}

.header-inner--landing-market .header-landing-mobile-tools {
    display: none;
    align-items: center;
    justify-content: flex-end;
    flex-wrap: nowrap;
    gap: 10px;
    flex-shrink: 0;
    margin-left: auto;
    position: relative;
    z-index: 2;
}

.header-inner--landing-market .header-landing-mobile-tools .theme-toggle {
    flex-shrink: 0;
}

.header-inner--landing-market .header-landing-lang {
    color: var(--text-soft);
    font-size: 0.78rem;
    font-weight: 800;
    padding: 4px 2px;
    white-space: nowrap;
    opacity: .72;
    transition: opacity .2s ease, color .2s ease;
}

.header-inner--landing-market .header-landing-lang:hover {
    opacity: 1;
    color: var(--text);
}

.header-inner--landing-market .header-landing-desktop-extra {
    flex: 1;
    min-width: 0;
    display: flex;
    justify-content: flex-end;
}

.header-inner--landing-market .header-landing-desktop-nav {
    flex-wrap: wrap;
    justify-content: flex-end;
    gap: 12px;
}

.header-landing-desktop-nav > a,
.header-landing-desktop-nav > a:visited {
    color: var(--text-soft);
    font-weight: 600;
    font-size: 0.95rem;
    text-decoration: none;
    transition: color 0.15s;
}

.header-landing-desktop-nav > a:hover {
    color: var(--text);
}

.header-landing-desktop-nav > a.is-active {
    color: var(--text);
    font-weight: 700;
}

.header-landing-drawer-nav a.is-active {
    background: var(--primary-soft);
    color: var(--text);
    font-weight: 700;
}

.header-inner--landing-market .header-landing-brand {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    flex: 0 0 auto;
    min-width: 0;
    position: relative;
    z-index: 0;
    overflow: visible;
}
/* Landing marketing + drawer: larger symbol mark (app shell uses .header-app-bar rules below). */
.site-header.site-header--landing-mkt .header-landing-brand .landing-logo.landing-logo--mark,
.header-inner--landing-market .header-landing-brand .landing-logo.landing-logo--mark,
.header-landing-drawer-brand .landing-logo.landing-logo--mark {
    width: auto;
    max-width: none;
    height: clamp(34px, 5.5vw, 40px);
    max-height: 40px;
    object-fit: contain;
}
@media (min-width: 768px) {
    .site-header.site-header--landing-mkt .header-landing-brand .landing-logo.landing-logo--mark,
    .header-inner--landing-market .header-landing-brand .landing-logo.landing-logo--mark,
    .header-landing-drawer-brand .landing-logo.landing-logo--mark {
        height: clamp(42px, 3.2vw, 48px);
        max-height: 48px;
    }
}

body.landing-nav-open {
    overflow: hidden;
    touch-action: none;
}

.header-landing-drawer-backdrop {
    display: none;
    position: fixed;
    inset: 0;
    z-index: 10050;
    background: rgba(4, 8, 20, 0.55);
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
    touch-action: none;
}
.header-landing-drawer-backdrop.is-open {
    display: block;
}

.header-landing-drawer {
    position: fixed;
    inset: 0;
    z-index: 10100;
    display: flex;
    justify-content: flex-end;
    align-items: stretch;
    pointer-events: none;
    visibility: hidden;
    opacity: 0;
    transition: opacity 0.22s ease, visibility 0.22s ease;
}
.header-landing-drawer.is-open {
    pointer-events: auto;
    visibility: visible;
    opacity: 1;
}
.header-landing-drawer-inner {
    width: min(100%, 400px);
    max-width: 100%;
    min-height: 100dvh;
    min-height: 100vh;
    background: var(--surface);
    border-left: 1px solid var(--border-strong);
    box-shadow: -16px 0 48px rgba(0, 0, 0, 0.4);
    display: flex;
    flex-direction: column;
    gap: 0;
    padding: max(10px, env(safe-area-inset-top, 0px)) max(18px, env(safe-area-inset-right, 0px)) max(20px, env(safe-area-inset-bottom, 0px)) max(18px, env(safe-area-inset-left, 0px));
    overflow-y: auto;
    -webkit-overflow-scrolling: touch;
    overscroll-behavior: contain;
    transform: translateX(100%);
    transition: transform 0.28s cubic-bezier(0.22, 1, 0.36, 1);
}
.header-landing-drawer.is-open .header-landing-drawer-inner {
    transform: translateX(0);
}
@media (max-width: 767px) {
    .header-landing-drawer-inner {
        width: 100%;
        max-width: 100%;
        border-left: none;
        box-shadow: none;
    }
    body:has(.site-header--landing-mkt) .header-landing-drawer-inner {
        min-height: calc(100vh - var(--landing-mobile-fixed-header-offset));
        min-height: calc(100dvh - var(--landing-mobile-fixed-header-offset));
    }
}
@media (min-width: 768px) {
    .site-header.site-header--landing-mkt {
        z-index: 40;
    }
    body:has(.site-header--landing-mkt) main {
        padding-top: 0;
    }
}
.header-landing-drawer-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    margin-bottom: 8px;
    flex-shrink: 0;
}
.header-landing-drawer-brand {
    display: inline-flex;
    align-items: center;
    min-width: 0;
    text-decoration: none;
    color: inherit;
    overflow: visible;
}
.header-landing-drawer-brand:hover {
    opacity: 0.9;
}
.header-landing-drawer-close {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 2.6rem;
    height: 2.6rem;
    border-radius: 14px;
    border: 1px solid var(--border-strong);
    background: var(--surface);
    color: var(--text);
    cursor: pointer;
    flex-shrink: 0;
}
.header-landing-drawer-close:hover {
    border-color: var(--primary);
    background: var(--primary-soft);
}
.header-landing-drawer-nav {
    display: flex;
    flex-direction: column;
    gap: 4px;
    padding: 8px 0 16px;
    border-bottom: 1px solid var(--border);
    flex-shrink: 0;
}
.header-landing-drawer-nav a {
    display: block;
    padding: 14px 14px;
    border-radius: 14px;
    color: var(--text-soft);
    font-weight: 600;
    font-size: 1rem;
}
.header-landing-drawer-nav a:hover {
    background: var(--primary-soft);
    color: var(--text);
}
.header-landing-drawer-actions {
    display: flex;
    flex-direction: column;
    gap: 10px;
    padding: 16px 0;
    flex-shrink: 0;
}
.header-landing-drawer-cta-primary {
    min-height: 48px;
    font-weight: 800;
}
.header-landing-drawer-footer {
    margin-top: auto;
    padding-top: 16px;
    border-top: 1px solid var(--border);
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    flex-shrink: 0;
}
.header-landing-drawer-lang-row {
    display: flex;
    align-items: center;
    gap: 10px;
    flex-wrap: wrap;
}
.header-landing-drawer-lang-row a {
    color: var(--text-soft);
    font-size: 0.9rem;
    font-weight: 700;
}
.header-landing-drawer-lang-row a:hover {
    color: var(--text);
}
.header-left { display: flex; align-items: center; gap: 12px; min-width: 0; }
.header-left .brand { display: inline-flex; align-items: center; gap: 0; min-width: 0; }
.header-left .brand.header-brand {
    gap: 10px;
    align-items: center;
}
.header-left .brand span.client-app-badge { white-space: nowrap; }
.brand { font-size: 1.15rem; font-weight: 800; letter-spacing: -0.03em; }
/* Горизонтальный логотип (.landing-logo) — лендинг, auth, app shell */
.header-brand {
    display: inline-flex;
    align-items: center;
    gap: 10px;
}
.landing-logo {
    height: calc(64px * 1.035);
    width: auto;
    max-width: none;
    object-fit: contain;
    display: block;
    flex-shrink: 0;
}
.landing-logo.landing-logo--mark {
    height: auto;
    width: 40px;
    max-width: 40px;
    max-height: 40px;
    object-fit: contain;
}
@media (min-width: 769px) {
    .landing-logo:not(.landing-logo--mark) {
        height: calc(72px * 1.035);
    }
}
/* Login / register auth row: symbol mark reads like an app icon (larger than in-app bar). */
.header-inner--auth .landing-logo.landing-logo--hero {
    height: auto !important;
    max-height: clamp(calc(72px * 1.035), 22vw, calc(96px * 1.035));
    width: auto;
    object-fit: contain;
    filter: none;
}
@media (min-width: 600px) {
    .header-inner--auth .landing-logo.landing-logo--hero {
        max-height: clamp(calc(80px * 1.035), 18vw, calc(96px * 1.035));
    }
}
html[data-theme="light"] .header-inner--auth .landing-logo.landing-logo--hero {
    filter: contrast(1.06) saturate(0.96);
}
.header-brand-picture {
    display: contents;
}
.header-inner--app {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
}
/* App shell (trainer + client): [burger] | centered brand mark | [toolbar + avatar] */
.header-inner--app.header-app-bar.app-mobile-header {
    display: grid;
    grid-template-columns: minmax(48px, auto) minmax(0, 1fr) auto;
    align-items: center;
    column-gap: 12px;
    min-height: 82px;
    padding: 10px 20px;
    box-sizing: border-box;
    max-width: 100%;
}
.app-mobile-header-start {
    display: flex;
    align-items: center;
    justify-content: flex-start;
    min-width: 0;
}
.app-mobile-header-logo {
    display: flex;
    align-items: center;
    justify-content: center;
    min-width: 0;
}
.app-mobile-header-logo .header-app-brand-link {
    justify-content: center;
    max-width: 100%;
}
.app-mobile-header-end.header-app-right {
    justify-self: end;
}
.app-mobile-header-avatar {
    flex-shrink: 0;
}
.menu-button,
.header-app-burger {
    flex-shrink: 0;
}
.header-app-brand-link {
    min-width: 0;
    flex: 0 1 auto;
    display: inline-flex;
    align-items: center;
    justify-content: flex-start;
}
.header-app-right {
    display: flex;
    align-items: center;
    gap: 12px;
    flex-shrink: 0;
    min-width: 0;
}
.nav.nav-desktop.nav-desktop--app-toolbar {
    flex-wrap: nowrap;
    align-items: center;
    gap: 10px;
}
/* Symbol-only mark: taller than old wordmark bar so it reads as the app icon */
.site-header .header-app-bar .landing-logo {
    height: auto;
    max-height: calc(40px * 1.035);
    width: auto;
    object-fit: contain;
    filter: none;
}
.site-header .header-app-bar .landing-logo.landing-logo--mark {
    max-height: calc(40px * 1.035);
    width: 40px;
    max-width: 40px;
}
html[data-theme="light"] .site-header .header-app-bar .landing-logo {
    filter: contrast(1.07) saturate(0.94);
}
@media (min-width: 900px) {
    .site-header .header-app-bar .landing-logo {
        max-height: calc(46px * 1.035);
    }
}
@media (min-width: 1200px) {
    .site-header .header-app-bar .landing-logo {
        max-height: calc(48px * 1.035);
    }
}
.languages-toggle-group {
    display: flex;
    align-items: center;
    gap: 12px;
    flex-shrink: 0;
}
/* AuthHeader (login/register/…): одна строка — горизонтальный FitHub + языки + тема */
.header-inner--auth {
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    flex-wrap: nowrap;
}
.header-inner--auth .auth-header-brand {
    flex: 0 1 auto;
    min-width: 0;
    max-width: min(75vw, 440px);
}
.header-auth-lang {
    color: var(--text-soft);
    font-size: 0.96rem;
    font-weight: 700;
    white-space: nowrap;
}
.brand span.client-app-badge { color: var(--primary); }

.nav { display: flex; align-items: center; gap: 14px; flex-wrap: wrap; }
.nav-desktop { display: flex; }
.burger-btn {
    display: none;
    width: 2.6rem;
    height: 2.6rem;
    border-radius: 14px;
    border: 1px solid var(--border-strong);
    background: var(--surface);
    color: var(--text);
    font-size: 1.2rem;
    font-weight: 900;
    cursor: pointer;
    align-items: center;
    justify-content: center;
}
.burger-btn:hover { border-color: var(--primary); background: var(--primary-soft); }

.avatar-btn {
    display: none;
    width: 2.6rem;
    height: 2.6rem;
    border-radius: 999px;
    border: 1px solid color-mix(in srgb, var(--border-strong) 72%, var(--surface));
    background: var(--surface);
    color: var(--text);
    font-weight: 900;
    letter-spacing: 0.02em;
    cursor: pointer;
}
.avatar-btn:hover { border-color: var(--primary); background: var(--primary-soft); }
.nav a { color: var(--text-soft); font-size: 0.96rem; }
.inline-form { margin: 0; }
.top-user-pill {
    display: inline-flex;
    align-items: center;
    padding: 8px 12px;
    border-radius: 999px;
    background: var(--primary-soft);
    color: var(--text);
    font-size: 0.9rem;
    font-weight: 700;
}
.theme-toggle {
    width: 2.35rem;
    height: 2.35rem;
    border-radius: 999px;
    border: 1px solid var(--border);
    background: var(--surface);
    color: var(--text-soft);
    cursor: pointer;
    font-size: 1rem;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    transition: 0.2s ease;
}
.theme-toggle:hover {
    border-color: var(--border-strong);
    transform: translateY(-1px);
}
.theme-toggle--sidebar { width: 2.15rem; height: 2.15rem; }

.sidebar-backdrop {
    display: none;
    position: fixed;
    inset: 0;
    background: rgba(0,0,0,0.45);
    z-index: 35;
    pointer-events: none;
    touch-action: none;
}
.sidebar-backdrop.is-open { display: block; pointer-events: auto; }

.sidebar-close {
    display: none;
    position: sticky;
    top: 10px;
    margin-left: auto;
    margin-bottom: 8px;
    width: 2.35rem;
    height: 2.35rem;
    border-radius: 14px;
    border: 1px solid var(--border-strong);
    background: var(--surface);
    color: var(--text);
    cursor: pointer;
}
.sidebar-close:hover { border-color: var(--primary); background: var(--primary-soft); }

.sidebar-footer {
    margin-top: auto;
    padding-top: 8px;
    border-top: 1px solid var(--border);
    display: flex;
    flex-direction: column;
    gap: 8px;
}
.sidebar-footer-row {
    display: flex;
    gap: 6px;
    flex-wrap: wrap;
    align-items: center;
}
.sidebar-footer-row a { font-weight: 800; color: var(--text-soft); }
.mobile-menu-bottom-spacer { display: none; }

.btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    border-radius: 14px;
    padding: 11px 18px;
    min-height: 42px;
    font-weight: 700;
    font-size: 0.95rem;
    line-height: 1.2;
    transition: transform 0.15s ease, box-shadow 0.2s ease, border-color 0.2s ease, background-color 0.2s ease, color 0.2s ease;
    border: 1px solid transparent;
    cursor: pointer;
    text-decoration: none;
}
.btn:hover { transform: translateY(-1px); }
.btn:active { transform: translateY(0); }
.btn:focus-visible {
    outline: none;
    box-shadow: 0 0 0 3px rgba(59, 130, 246, 0.25);
}
.btn[disabled],
.btn:disabled {
    opacity: 0.55;
    cursor: not-allowed;
    transform: none;
    box-shadow: none;
}
.btn-lg { padding: 14px 22px; font-size: 1rem; }
.btn-block { width: 100%; }
.btn-primary {
    background: linear-gradient(135deg, var(--primary), var(--primary-2));
    color: #fff;
    border-color: rgba(123, 140, 255, 0.55);
    box-shadow: 0 10px 24px rgba(123, 140, 255, 0.28);
}
.btn-primary:hover {
    filter: brightness(0.96);
    box-shadow: 0 12px 26px rgba(123, 140, 255, 0.34);
}
.btn-primary:active {
    filter: brightness(0.9);
}
.btn-light {
    background: var(--surface);
    border-color: var(--border-strong);
    color: var(--text);
    box-shadow: 0 4px 14px rgba(15, 23, 42, 0.08);
}
.btn-light:hover {
    border-color: var(--primary);
    color: var(--primary);
}
.btn-outline {
    background: transparent;
    border-color: var(--border-strong);
    color: var(--text);
}
.btn-outline:hover {
    border-color: var(--primary);
    color: var(--primary);
    background: var(--primary-soft);
}
.btn-text {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 42px;
    padding: 0 6px;
    color: var(--text-muted);
    text-decoration: none;
    font-weight: 600;
}
.btn-text:hover {
    color: var(--text);
    text-decoration: underline;
}
html[data-theme="dark"] .btn-light {
    background: rgba(26, 35, 68, 0.9);
    border-color: rgba(130, 150, 255, 0.42);
    color: #e8ecff;
    box-shadow: 0 8px 18px rgba(0, 0, 0, 0.36);
}
html[data-theme="dark"] .btn-outline {
    border-color: rgba(130, 150, 255, 0.46);
    color: #e8ecff;
}
html[data-theme="dark"] .btn-outline:hover {
    border-color: #9aa8ff;
    color: #fff;
    background: rgba(123, 140, 255, 0.22);
}

.hero { padding: 72px 0 36px; }
.hero-grid { display: grid; grid-template-columns: 1.2fr 0.8fr; gap: 28px; align-items: center; }
.eyebrow {
    display: inline-block;
    margin-bottom: 14px;
    padding: 8px 12px;
    border-radius: 999px;
    background: var(--primary-soft);
    color: var(--primary);
    font-weight: 700;
    font-size: 0.85rem;
}
.hero-copy h1 {
    margin: 0 0 16px;
    font-size: clamp(2.2rem, 5vw, 4rem);
    line-height: 1.02;
    letter-spacing: -0.05em;
}
.hero-text { margin: 0; color: var(--text-soft); font-size: 1.08rem; line-height: 1.7; max-width: 760px; }
.hero-actions { margin-top: 28px; display: flex; gap: 14px; flex-wrap: wrap; }
.hero-note { margin-top: 18px; color: var(--text-muted); font-size: 0.95rem; }
.hero-card { display: flex; justify-content: flex-end; }
.hero--smart-scan .hero-grid {
    grid-template-columns: minmax(560px, 620px) minmax(420px, 520px);
    gap: 64px;
    align-items: center;
    justify-content: center;
}
.hero--smart-scan .hero-copy {
    max-width: 620px;
}
.hero--smart-scan .hero-copy h1 {
    max-width: 620px;
    font-size: clamp(44px, 5vw, 72px);
    line-height: 0.98;
    letter-spacing: -0.06em;
}
.hero--smart-scan .hero-text {
    max-width: 600px;
}
.hero--smart-scan .hero-actions {
    align-items: center;
}
.hero-coach-link {
    display: inline-flex;
    align-items: center;
    min-height: 48px;
    color: var(--text-soft);
    font-weight: 800;
    text-decoration: none;
}
.hero-coach-link:hover {
    color: var(--primary);
}
.hero-secondary-action {
    margin-top: 10px;
}
.hero-coach-link--light {
    color: rgba(255, 255, 255, 0.8);
}
.hero-coach-link--light:hover {
    color: #fff;
}
.hero-start-options {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 12px;
    margin-top: 18px;
    max-width: 590px;
}
.hero-start-card {
    padding: 14px;
    border: 1px solid color-mix(in srgb, var(--border) 82%, transparent);
    border-radius: 18px;
    background: color-mix(in srgb, var(--surface) 72%, transparent);
    box-shadow: 0 18px 44px rgba(15, 23, 42, 0.08);
}
.hero-start-card strong {
    display: block;
    margin-top: 6px;
    color: var(--text);
    font-size: 0.98rem;
}
.hero-start-card p {
    margin: 6px 0 0;
    color: var(--text-soft);
    font-size: 0.9rem;
    line-height: 1.45;
}
.hero-start-kicker {
    display: inline-flex;
    padding: 5px 8px;
    border-radius: 999px;
    background: color-mix(in srgb, var(--primary) 13%, var(--surface));
    color: var(--primary);
    font-size: 0.68rem;
    font-weight: 900;
    text-transform: uppercase;
    letter-spacing: 0.04em;
}
.card-glass {
    width: 100%;
    max-width: 420px;
    background: rgba(255, 255, 255, 0.8);
    border: 1px solid var(--border);
    border-radius: 28px;
    padding: 28px;
    box-shadow: var(--card-shadow-lg);
}
html[data-theme="dark"] .card-glass {
    background: rgba(20, 28, 56, 0.86);
}
.mini-label { font-size: 0.92rem; font-weight: 700; color: var(--text-soft); margin-bottom: 14px; }
.hero-list { margin: 0; padding-left: 20px; color: var(--text-soft); line-height: 1.8; }
.smart-scan-hero-visual {
    position: relative;
    display: block;
    width: 100%;
    max-width: 520px;
    justify-self: center;
}
.hero-how-card {
    position: relative;
    overflow: hidden;
    border: 1px solid color-mix(in srgb, var(--border) 78%, transparent);
    border-radius: 34px;
    padding: 22px;
    background:
        radial-gradient(circle at 82% 18%, color-mix(in srgb, var(--primary) 24%, transparent), transparent 38%),
        radial-gradient(circle at 12% 86%, color-mix(in srgb, var(--primary-2) 12%, transparent), transparent 36%),
        color-mix(in srgb, var(--surface) 88%, transparent);
    box-shadow:
        0 34px 88px rgba(15, 23, 42, 0.22),
        0 0 0 1px color-mix(in srgb, var(--primary) 10%, transparent);
}
.hero-how-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    margin-bottom: 18px;
}
.hero-how-head span {
    display: inline-flex;
    padding: 7px 10px;
    border-radius: 999px;
    background: color-mix(in srgb, var(--primary) 16%, var(--surface));
    border: 1px solid color-mix(in srgb, var(--primary) 36%, var(--border));
    color: var(--primary);
    font-size: 0.7rem;
    font-weight: 900;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    white-space: nowrap;
}
.hero-how-head strong {
    color: var(--text);
    font-size: 1rem;
}
.hero-how-body {
    display: grid;
    grid-template-columns: minmax(0, 0.92fr) minmax(210px, 0.78fr);
    gap: 18px;
    align-items: center;
}
.hero-how-steps {
    display: grid;
    gap: 12px;
}
.hero-how-step {
    display: grid;
    grid-template-columns: 34px minmax(0, 1fr);
    gap: 10px;
    align-items: start;
    padding: 12px;
    border: 1px solid color-mix(in srgb, var(--border) 80%, transparent);
    border-radius: 18px;
    background: color-mix(in srgb, var(--surface-2) 72%, transparent);
}
.hero-how-step span {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 34px;
    height: 34px;
    border-radius: 50%;
    background: linear-gradient(135deg, var(--primary), var(--primary-2));
    color: #fff;
    font-weight: 900;
}
.hero-how-step p {
    margin: 0;
    color: var(--text-soft);
    font-size: 0.95rem;
    line-height: 1.42;
}
.hero-phone-preview {
    position: relative;
    border: 1px solid var(--border);
    border-radius: 30px;
    padding: 14px;
    background: color-mix(in srgb, var(--surface) 92%, transparent);
    box-shadow:
        0 24px 62px rgba(15, 23, 42, 0.2),
        0 0 44px color-mix(in srgb, var(--primary) 16%, transparent);
}
.scan-demo-card {
    position: relative;
    z-index: 1;
    border: 1px solid var(--border);
    border-radius: 26px;
    background: color-mix(in srgb, var(--surface) 86%, transparent);
    box-shadow: var(--card-shadow-lg);
    overflow: hidden;
}
.scan-demo-card--plan {
    padding: 20px;
}
.scan-demo-card--photo,
.scan-demo-card--plan {
    min-height: 0;
}
.scan-demo-card--photo {
    aspect-ratio: 1.5 / 1;
}
.scan-demo-stack {
    position: relative;
    z-index: 1;
    display: grid;
    gap: 12px;
    align-content: center;
}
.scan-demo-mini-card {
    border: 1px solid var(--border);
    border-radius: 24px;
    padding: 18px;
    background:
        radial-gradient(circle at 14% 18%, color-mix(in srgb, var(--primary) 18%, transparent), transparent 36%),
        color-mix(in srgb, var(--surface) 88%, transparent);
    box-shadow: var(--card-shadow-lg);
}
.scan-demo-mini-card span {
    display: inline-flex;
    padding: 6px 9px;
    border-radius: 999px;
    background: color-mix(in srgb, var(--primary) 14%, var(--surface));
    color: var(--primary);
    font-size: 0.68rem;
    font-weight: 900;
    text-transform: uppercase;
    letter-spacing: 0.04em;
}
.scan-demo-mini-card strong {
    display: block;
    margin-top: 12px;
    color: var(--text);
    font-size: 1.05rem;
}
.scan-demo-mini-card p {
    margin: 7px 0 0;
    color: var(--text-soft);
    font-size: 0.9rem;
    line-height: 1.45;
}
.scan-demo-card--plan {
    width: min(100%, 330px);
    justify-self: center;
    border-radius: 32px;
    padding: 14px;
    min-height: 452px;
    transform: none;
    box-shadow:
        0 28px 68px rgba(15, 23, 42, 0.22),
        0 0 0 1px color-mix(in srgb, var(--primary) 12%, transparent),
        0 0 54px color-mix(in srgb, var(--primary) 18%, transparent);
}
.scan-demo-photo {
    position: relative;
    width: 100%;
    height: 100%;
    min-height: 100%;
    display: flex;
    align-items: flex-end;
    padding: 18px;
    background:
        linear-gradient(180deg, rgba(7, 12, 28, 0.08), rgba(7, 12, 28, 0.76)),
        url("./landing/gym-scan-hero-1.jpg"),
        radial-gradient(circle at 24% 24%, rgba(226, 232, 240, 0.48) 0 9%, transparent 10%),
        linear-gradient(135deg, #25314a 0 26%, #111827 26% 38%, #55657c 38% 45%, #172033 45% 61%, #3f4d63 61% 68%, #0f172a 68% 100%);
    background-position: center;
    background-size: cover;
}
.scan-demo-photo span {
    position: relative;
    z-index: 1;
    display: inline-flex;
    padding: 8px 11px;
    border-radius: 999px;
    background: rgba(15, 23, 42, 0.74);
    color: #fff;
    font-size: 0.84rem;
    font-weight: 800;
}
.scan-demo-ai-bridge {
    position: relative;
    z-index: 2;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 38px;
    min-height: 170px;
}
.scan-demo-ai-bridge::before {
    content: "";
    position: absolute;
    left: -16px;
    right: -16px;
    height: 2px;
    background: linear-gradient(90deg, transparent, var(--primary), transparent);
    box-shadow: 0 0 22px color-mix(in srgb, var(--primary) 58%, transparent);
}
.scan-demo-ai-bridge::after {
    content: "";
    position: absolute;
    right: -18px;
    width: 10px;
    height: 10px;
    border-top: 2px solid var(--primary);
    border-right: 2px solid var(--primary);
    transform: rotate(45deg);
}
.scan-demo-ai-floating {
    position: absolute;
    z-index: 3;
    top: 0;
    left: 50%;
    transform: translateX(-50%);
    display: inline-flex;
    padding: 7px 10px;
    border-radius: 999px;
    background: color-mix(in srgb, var(--primary) 16%, var(--surface));
    border: 1px solid color-mix(in srgb, var(--primary) 38%, var(--border));
    color: var(--primary);
    box-shadow: 0 12px 35px color-mix(in srgb, var(--primary) 22%, transparent);
    font-size: 0.68rem;
    font-weight: 900;
    letter-spacing: 0.02em;
    text-transform: uppercase;
    white-space: nowrap;
}
.scan-demo-card--plan {
    display: flex;
    flex-direction: column;
    gap: 10px;
}
.scan-demo-workout-shot {
    flex: 1;
    min-height: 360px;
    max-height: 360px;
    border-radius: 24px;
    border: 1px solid var(--border);
    background:
        linear-gradient(180deg, rgba(7, 12, 28, 0.01), rgba(7, 12, 28, 0.05)),
        url("./landing/gym-scan-hero-2.jpg"),
        linear-gradient(135deg, rgba(148, 163, 184, 0.36), rgba(15, 23, 42, 0.16));
    background-position: top center;
    background-size: contain;
    background-repeat: no-repeat;
    background-color: var(--surface-2);
    box-shadow: inset 0 -20px 34px rgba(15, 23, 42, 0.06);
    overflow: hidden;
}
.scan-flow-visual {
    height: 118px;
    border: 1px solid var(--border);
    border-radius: 18px;
    margin-bottom: 16px;
    background: var(--surface-2);
    overflow: hidden;
}
.scan-flow-visual--photo {
    display: flex;
    align-items: center;
    justify-content: center;
    background: linear-gradient(135deg, color-mix(in srgb, var(--primary) 10%, var(--surface)), var(--surface-2));
}
.scan-flow-visual--photo::before {
    content: "📷";
    font-size: 1.9rem;
}
.scan-flow-visual--ai,
.scan-flow-visual--telegram,
.scan-flow-visual--plan {
    display: flex;
    align-items: center;
    justify-content: center;
    color: var(--primary);
    font-weight: 900;
}
.scan-flow-visual--ai {
    background:
        radial-gradient(circle at 50% 50%, color-mix(in srgb, var(--primary) 28%, transparent), transparent 58%),
        var(--surface-2);
}
.scan-flow-visual--ai::before {
    content: "";
    width: 46px;
    height: 46px;
    border-radius: 18px;
    background: color-mix(in srgb, var(--primary) 22%, transparent);
    box-shadow: 0 0 34px color-mix(in srgb, var(--primary) 34%, transparent);
}
.scan-flow-visual--plan {
    background: linear-gradient(135deg, color-mix(in srgb, var(--primary) 12%, var(--surface)), var(--surface-2));
    color: var(--primary);
    text-shadow: none;
}
.scan-flow-visual--plan::before {
    content: "✓";
    width: 38px;
    height: 38px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 14px;
    background: var(--primary-soft);
}
.scan-flow-visual--telegram {
    background: linear-gradient(135deg, color-mix(in srgb, var(--primary) 14%, var(--surface)), var(--surface));
}
.scan-flow-visual--telegram::before {
    content: "💬";
    font-size: 1.75rem;
}
.landing-result-card,
.landing-mode-card {
    min-height: 180px;
}
.landing-card-icon {
    width: 46px;
    height: 46px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 16px;
    background: var(--primary-soft);
    margin-bottom: 16px;
    font-size: 1.35rem;
}
.landing-proof-grid,
.landing-mode-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 18px;
}
.landing-mode-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
}
.landing-proof-card {
    min-height: 280px;
    border: 1px solid var(--border);
    border-radius: 28px;
    padding: 22px;
    background: var(--surface);
    box-shadow: var(--card-shadow);
    overflow: hidden;
}
.phone-status-pill,
.progress-card-mini-label {
    display: inline-flex;
    width: fit-content;
    padding: 8px 11px;
    border-radius: 999px;
    background: rgba(15, 23, 42, 0.76);
    color: #fff;
    font-size: 0.82rem;
    font-weight: 850;
}
.landing-proof-card--phone,
.landing-proof-card--progress {
    width: min(100%, 245px);
    justify-self: center;
    border-radius: 34px;
    min-height: 360px;
}
.landing-proof-card--phone {
    display: flex;
    flex-direction: column;
    justify-content: flex-end;
    gap: 14px;
    background:
        linear-gradient(180deg, rgba(255, 255, 255, 0.02), rgba(15, 23, 42, 0.36)),
        url("./landing/gym-scan-hero-2.jpg");
    background-position: top center;
    background-size: contain;
    background-repeat: no-repeat;
    background-color: var(--surface-2);
}
.landing-proof-card--phone strong {
    color: #fff;
    font-size: 1.45rem;
    letter-spacing: -0.04em;
}
.landing-proof-card--phone > span:not(.phone-status-pill) {
    color: rgba(255, 255, 255, 0.86);
    font-weight: 700;
}
.landing-proof-card--progress {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    gap: 14px;
    background:
        radial-gradient(circle at 20% 20%, color-mix(in srgb, var(--primary) 24%, transparent), transparent 34%),
        linear-gradient(160deg, var(--surface), var(--surface-2));
}
.progress-card-photo-shot {
    flex: 1;
    min-height: 260px;
    border-radius: 24px;
    border: 1px solid var(--border);
    background:
        linear-gradient(180deg, rgba(7, 12, 28, 0.01), rgba(7, 12, 28, 0.04)),
        url("./landing/progress-checkin-card.jpg"),
        radial-gradient(circle at 20% 20%, color-mix(in srgb, var(--primary) 24%, transparent), transparent 34%),
        linear-gradient(160deg, var(--surface), var(--surface-2));
    background-position: top center;
    background-size: contain;
    background-repeat: no-repeat;
    background-color: var(--surface-2);
    box-shadow: inset 0 -16px 30px rgba(15, 23, 42, 0.05);
}
.progress-card-caption {
    display: grid;
    gap: 6px;
}
.progress-card-caption strong {
    font-size: 1.05rem;
    letter-spacing: -0.03em;
}
.progress-card-caption span {
    color: var(--text-soft);
    line-height: 1.5;
    font-size: 0.92rem;
}
.progress-card-mini-label {
    background: var(--primary-soft);
    color: var(--primary);
}
.progress-card-mini-stat {
    font-size: clamp(2.4rem, 5vw, 3.4rem);
    font-weight: 950;
    line-height: 1;
    letter-spacing: -0.08em;
}
.progress-card-mini-row {
    display: flex;
    justify-content: space-between;
    border-top: 1px solid var(--border);
    padding-top: 12px;
    color: var(--text-soft);
    font-weight: 750;
}

.stats-strip { padding: 10px 0 40px; }
.stats-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 18px; }
.stat-card, .feature-card, .step-card, .payment-card, .roadmap-card, .panel, .dashboard-stat-card, .trial-box {
    background: var(--surface);
    border: 1px solid var(--border);
    border-radius: 22px;
    padding: 24px;
    box-shadow: var(--card-shadow);
}

/* ---------------- Mobile-first UX ---------------- */
@media (max-width: 767px) {
    .container { width: calc(100% - 24px); }
    .site-header {
        padding-top: env(safe-area-inset-top, 0px);
    }
    .header-inner {
        min-height: var(--mobile-header-height);
        padding: 0;
        gap: 12px;
        flex-direction: row;
        justify-content: space-between;
        align-items: center;
    }
    .header-inner--landing-market {
        flex-direction: row;
        align-items: center;
        justify-content: flex-start;
        gap: 10px;
        min-height: var(--mobile-header-height);
        padding-block: 8px 10px;
        padding-inline: 0;
    }
    .header-inner--landing-market .header-landing-burger.burger-btn {
        display: inline-flex !important;
        position: relative;
        z-index: 3;
    }
    .header-inner--landing-market .header-landing-mobile-tools {
        display: flex !important;
    }
    .header-inner--landing-market .header-landing-desktop-extra {
        display: none !important;
    }
    .header-inner--landing-market .header-landing-brand {
        display: inline-flex;
        align-items: center;
        gap: 10px;
        flex: 1 1 auto;
        min-width: 0;
        min-height: 0;
        overflow: visible;
    }
    /* Fixed landing header: body overflow-x breaks sticky; keep bar + burger always reachable */
    .site-header.site-header--landing-mkt {
        position: fixed;
        left: 0;
        right: 0;
        top: 0;
        width: 100%;
        max-width: 100%;
        z-index: 10000;
    }
    body:has(.site-header--landing-mkt) main {
        padding-top: var(--landing-mobile-fixed-header-offset);
    }
    body:has(.site-header--landing-mkt) main > .hero {
        padding-top: 22px;
    }
    body:has(.site-header--landing-mkt) .header-landing-drawer-backdrop {
        top: var(--landing-mobile-fixed-header-offset);
        right: 0;
        bottom: 0;
        left: 0;
    }
    body:has(.site-header--landing-mkt) .header-landing-drawer {
        inset: auto;
        top: var(--landing-mobile-fixed-header-offset);
        left: 0;
        right: 0;
        bottom: 0;
        height: auto;
    }
    .burger-btn,
    .avatar-btn {
        min-width: 48px;
        min-height: 48px;
        flex-shrink: 0;
        z-index: 9100;
    }

    .brand { font-size: 1.02rem; }
    .brand,
    .header-left .brand {
        min-height: 64px;
        display: inline-flex;
        align-items: center;
    }
    .header-inner--auth .brand {
        min-height: 0;
    }
    .header-app-bar .brand,
    .header-app-bar .app-mobile-header-logo .brand {
        min-height: 0;
    }

    /* Compact spacing */
    .panel, .dashboard-stat-card, .trial-box { padding: 14px; border-radius: 18px; }
    .dashboard-shell { gap: 12px; }

    /* Buttons smaller */
    .btn { padding: 9px 12px; min-height: 38px; font-size: 0.92rem; border-radius: 14px; }
    .btn-lg { padding: 11px 14px; }

    /* Hero/top area smaller on dashboards */
    .desktop-only { display: none !important; }
    .mobile-only { display: block !important; }
    .dashboard-title { font-size: 28px; line-height: 1.1; margin: 6px 0 0; }
    .dashboard-subtitle { font-size: 14px; }
    .eyebrow { margin-bottom: 8px; padding: 6px 10px; font-size: 0.8rem; }

    /* Quick actions: readable vertical flow on mobile */
    .quick-actions-grid { display: grid; grid-template-columns: 1fr; gap: 12px; margin-top: 12px; }
    .quick-actions-grid .btn {
        width: 100%;
        min-height: 48px;
        padding: 12px;
        font-size: 14px;
        justify-content: center;
        white-space: normal;
        text-align: center;
        line-height: 1.3;
    }

    /* Hide tabs on mobile, show all panels stacked */
    .dashboard-tabs { display: none; }
    .tab-panel { display: block !important; }

    /* Reorder blocks for mobile */
    .trainer-dashboard { display: flex; flex-direction: column; gap: 12px; }
    .trainer-dashboard .dash-block { order: 10; }
    .trainer-dashboard .dash-block-next { order: 0; }
    .trainer-dashboard .dash-block-quick { order: 1; }
    .trainer-dashboard .dash-block-top { order: 2; }
    .trainer-dashboard .dash-block-stats { order: 3; }
    .trainer-dashboard .dash-block-overview { order: 4; }
    .trainer-dashboard .dash-block-ai { order: 5; }
    .trainer-dashboard .dash-block-actions { order: 6; }
    .trainer-dashboard .dash-block-activity { order: 7; }

    /* Stats grid 2 columns */
    .dashboard-stats { grid-template-columns: 1fr 1fr; gap: 10px; }
    .dashboard-stat-number { font-size: 1.5rem; }

}

/* Default visibility helpers */
.mobile-only { display: none; }
.trainer-sidebar-main-mobile-only { display: none !important; }
@media (max-width: 899px) {
    .trainer-sidebar-main-mobile-only { display: grid !important; }
}
.stat-number { font-size: 2rem; font-weight: 800; letter-spacing: -0.04em; }
.stat-label { margin-top: 8px; color: var(--text-muted); }

.section { padding: 76px 0; }
.section-muted { background: var(--surface-soft); }

.early-trainers-section .early-trainers-intro {
    margin: 0;
    color: var(--text-soft);
    max-width: 720px;
    line-height: 1.65;
    font-size: 1.02rem;
}
.early-trainers-columns {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 28px;
    margin: 1.5rem 0 1.25rem;
    max-width: 880px;
}
.early-trainers-section .early-trainers-columns h3 {
    font-size: 1.05rem;
    margin: 0 0 0.5rem;
    color: var(--text);
}
.early-trainers-footer {
    margin: 0 0 0.25rem;
    font-weight: 600;
    color: var(--text);
}
@media (max-width: 720px) {
    .early-trainers-columns {
        grid-template-columns: 1fr;
    }
}
.section-head { max-width: 760px; margin-bottom: 34px; }
.section-head h2 { margin: 0 0 12px; font-size: clamp(1.8rem, 3vw, 2.7rem); letter-spacing: -0.04em; }
.section-head p { margin: 0; color: var(--text-muted); line-height: 1.75; }

.feature-grid, .steps-grid, .payments-grid, .roadmap-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 18px;
}
.pricing-grid {
    display: grid;
    grid-template-columns: minmax(0, 560px);
    gap: 18px;
}
.feature-card h3, .step-card h3, .payment-card h3, .panel h3 { margin-top: 0; margin-bottom: 10px; font-size: 1.12rem; }
.feature-card p, .step-card p, .payment-card p { margin: 0; color: var(--text-muted); line-height: 1.7; }
.step-number {
    width: 44px; height: 44px; display: inline-flex; align-items: center; justify-content: center;
    border-radius: 14px; background: var(--primary-soft); color: var(--primary); font-weight: 800; margin-bottom: 14px;
}
.roadmap-card { font-weight: 700; color: var(--text-soft); }

.roadmap-lead {
    max-width: 720px;
    margin: 0 0 18px;
    font-size: 1.05rem;
    line-height: 1.55;
    color: var(--text-muted);
}
.roadmap-soon-title {
    margin: 0 0 16px;
    font-size: 1.35rem;
    letter-spacing: -0.02em;
}
.roadmap-columns {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 16px;
}
.roadmap-block {
    border: 1px solid var(--border);
    border-radius: 16px;
    padding: 16px 18px;
    background: var(--surface-2);
}
.roadmap-block h3 {
    margin: 0 0 10px;
    font-size: 1.02rem;
    letter-spacing: -0.01em;
}
.roadmap-block p {
    margin: 0;
    font-size: 0.95rem;
    line-height: 1.5;
    color: var(--text-muted);
}
@media (max-width: 820px) {
    .roadmap-columns {
        grid-template-columns: 1fr;
    }
}

.cta-section { padding: 0 0 90px; }
.cta-box {
    background: linear-gradient(135deg, #0f172a, #1e293b);
    color: #fff;
    border-radius: 28px;
    padding: 40px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 24px;
}
.cta-box h2 { margin: 0 0 10px; font-size: 2rem; letter-spacing: -0.04em; }
.cta-box p { margin: 0; color: rgba(255, 255, 255, 0.78); }
.cta-actions { display: flex; gap: 14px; flex-wrap: wrap; }

.site-footer { margin-top: auto; border-top: 1px solid var(--header-border); background: var(--surface); }
.footer-inner { display: flex; justify-content: space-between; gap: 24px; padding: 28px 0; }
.footer-brand { font-weight: 800; margin-bottom: 8px; }
.footer-text { color: var(--text-muted); max-width: 620px; line-height: 1.7; }
.footer-social-links { display: flex; gap: 10px; flex-wrap: wrap; margin-top: 12px; }
.footer-social-link {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    min-height: 36px;
    padding: 8px 12px;
    border: 1px solid var(--border-strong);
    border-radius: 999px;
    color: var(--text-soft);
    background: color-mix(in srgb, var(--surface-2) 78%, transparent);
    font-weight: 700;
    font-size: 0.92rem;
}
.footer-social-link svg {
    width: 18px;
    height: 18px;
    fill: currentColor;
    flex: 0 0 auto;
}
.footer-social-link:hover {
    color: var(--primary);
    border-color: var(--primary);
    background: var(--primary-soft);
}
.footer-links { display: flex; gap: 16px; align-items: flex-start; flex-wrap: wrap; }

.auth-page { padding: 80px 20px; }
.auth-card {
    max-width: 460px;
    margin: 0 auto;
    background: var(--surface);
    border: 1px solid var(--border);
    border-radius: 26px;
    padding: 32px;
    box-shadow: var(--card-shadow-lg);
}
.auth-card-wide { max-width: 560px; }
.auth-card h1 { margin: 0 0 10px; font-size: 2rem; letter-spacing: -0.04em; }
.auth-subtext { margin: 0 0 22px; color: var(--text-muted); line-height: 1.7; }
.auth-form { display: grid; gap: 10px; }
.auth-form label { margin-top: 6px; font-weight: 700; font-size: 0.95rem; }
.auth-form input, .auth-form textarea, .auth-form select {
    width: 100%;
    border: 1px solid var(--border-strong);
    border-radius: 14px;
    padding: 14px 16px;
    font-size: 1rem;
    background: var(--surface-2);
    color: var(--text);
}
.auth-form textarea { resize: vertical; }
.auth-form input::placeholder, .auth-form textarea::placeholder { color: var(--text-muted); }
.auth-form input:focus, .auth-form textarea:focus, .auth-form select:focus {
    outline: none;
    border-color: var(--primary);
    box-shadow: 0 0 0 3px rgba(123, 140, 255, 0.2);
}
.checkbox-line {
    display: flex;
    align-items: center;
    gap: 10px;
    margin-top: 10px;
}
.checkbox-line input[type="checkbox"] {
    width: auto;
    margin: 0;
}
.form-error { margin-bottom: 16px; padding: 12px 14px; border-radius: 14px; background: rgba(239, 68, 68, 0.08); color: #b91c1c; font-weight: 600; }
.form-warning { margin-bottom: 16px; padding: 12px 14px; border-radius: 14px; background: rgba(234, 179, 8, 0.12); color: #854d0e; font-weight: 600; }
.form-info { margin-bottom: 16px; padding: 12px 14px; border-radius: 14px; background: rgba(59, 130, 246, 0.1); color: #1e40af; font-weight: 600; }
.form-success { margin-bottom: 16px; padding: 12px 14px; border-radius: 14px; background: rgba(34, 197, 94, 0.15); color: #14532d; font-weight: 600; }
html[data-theme="dark"] .form-success { color: #b7f7c8; background: rgba(34, 197, 94, 0.2); }
html[data-theme="dark"] .form-warning { color: #fde047; background: rgba(234, 179, 8, 0.15); }
html[data-theme="dark"] .form-info { color: #93c5fd; background: rgba(59, 130, 246, 0.18); }
html[data-theme="dark"] .form-error { background: rgba(239, 68, 68, 0.12); color: #fecaca; }
.auth-footer { margin-top: 18px; color: var(--text-muted); }
.auth-footer a { color: var(--primary); font-weight: 700; }
.auth-divider { text-align: center; margin: 16px 0; color: #94a3b8; }
.btn-google[disabled] { opacity: 0.65; cursor: not-allowed; }
.btn-google[disabled]:hover { transform: none; }

.dashboard-page { padding: 34px 0 60px; }
.dashboard-shell { display: grid; grid-template-columns: 280px 1fr; gap: 24px; }
.sidebar {
    background: var(--surface);
    border: 1px solid var(--border);
    border-radius: 24px;
    padding: 22px;
    box-shadow: var(--card-shadow);
    height: fit-content;
    position: sticky;
    top: 92px;
}
.sidebar-brand { font-weight: 800; font-size: 1.1rem; margin-bottom: 20px; }
.sidebar-user { padding: 16px; background: var(--surface-2); border-radius: 18px; margin-bottom: 18px; }
.sidebar-user-name { font-weight: 700; }
.sidebar-user-meta { margin-top: 4px; color: var(--text-muted); font-size: 0.92rem; }
.sidebar-user-role {
    margin-top: 6px;
    font-size: 0.66rem;
    font-weight: 800;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: var(--primary);
}
.sidebar-nav { display: grid; gap: 8px; margin-bottom: 20px; }
.sidebar-nav a { padding: 12px 14px; border-radius: 14px; color: var(--text-soft); font-weight: 600; }
.sidebar-nav a.active, .sidebar-nav a:hover { background: var(--primary-soft); color: var(--primary); }
.sidebar-nav-section,
.client-sidebar-nav-section {
    margin: 10px 6px 2px;
    font-size: 0.72rem;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: 0.08em;
    color: var(--text-muted);
}
.dashboard-content { min-width: 0; }
.dashboard-top { display: flex; justify-content: space-between; gap: 20px; align-items: flex-start; margin-bottom: 22px; }
.dashboard-top > div:first-child {
    min-width: 0;
    flex: 1 1 auto;
}
.dashboard-top h1 { margin: 0 0 8px; font-size: 2rem; letter-spacing: -0.04em; }
.dashboard-subtext { margin: 0; color: var(--text-muted); }
.dashboard-actions-panel { margin-bottom: 16px; }
.dashboard-primary-grid { margin-bottom: 16px; }
.dashboard-actions { margin-top: 10px; }
.dashboard-actions-secondary { margin-top: 12px; }
.dashboard-subtext--spaced { margin-top: 8px; }
.dashboard-panel-gap-bottom { margin-bottom: 16px; }
.dashboard-panel-gap-top { margin-top: 16px; }
.dashboard-inline-form-top { margin-top: 8px; }
.dashboard-cta-row {
    margin-top: 12px;
    display: grid;
    gap: 10px;
    grid-template-columns: repeat(auto-fit, minmax(210px, 1fr));
}
.dashboard-cta-row .btn,
.dashboard-cta-row .inline-form,
.dashboard-cta-row .inline-form .btn {
    width: 100%;
}
.dashboard-card-cta {
    width: 100%;
    margin-top: 12px;
}
.quick-actions-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
    gap: 10px;
    width: 100%;
}
.quick-actions-grid .btn {
    width: 100%;
    justify-content: center;
}
@media (max-width: 767px) {
    .quick-actions-grid {
        grid-template-columns: 1fr;
        gap: 12px;
    }
    .quick-actions-grid .btn {
        min-height: 48px;
        padding: 12px;
        font-size: 14px;
        white-space: normal;
        text-align: center;
        line-height: 1.3;
    }
}
.dashboard-actions,
.dashboard-actions-secondary {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
    gap: 10px;
}
.dashboard-actions .btn,
.dashboard-actions-secondary .btn,
.dashboard-actions .inline-form,
.dashboard-actions-secondary .inline-form,
.dashboard-actions .inline-form .btn,
.dashboard-actions-secondary .inline-form .btn {
    width: 100%;
}

/* Trainer dashboard: primary CTA + compact quick tiles (mobile-first) */
.trainer-dashboard .dashboard-top {
    margin-bottom: 14px;
    gap: 14px;
}
.trainer-workbench-panel {
    padding: 14px 16px 16px;
    margin-bottom: 14px;
}
.trainer-workbench-title {
    margin: 0 0 10px;
    font-size: 1rem;
    font-weight: 800;
    letter-spacing: -0.02em;
}
.trainer-workbench-primary-wrap {
    margin-bottom: 12px;
}
.trainer-dash-primary-cta {
    width: 100%;
    justify-content: center;
    min-height: 48px;
    font-weight: 800;
    letter-spacing: 0.01em;
    border: none;
    color: #fff;
    background: linear-gradient(135deg, var(--primary-2), var(--primary) 55%, #22c55e);
    box-shadow: 0 12px 32px rgba(99, 102, 241, 0.28);
}
.trainer-dash-primary-cta:hover {
    filter: brightness(1.06);
    transform: translateY(-1px);
}
html[data-theme="dark"] .trainer-dash-primary-cta {
    box-shadow: 0 12px 36px rgba(0, 0, 0, 0.45);
}
.trainer-quick-tiles {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 8px;
    list-style: none;
    margin: 0;
    padding: 0;
}
.trainer-quick-tile {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 6px;
    padding: 10px 11px;
    min-height: 0;
    border-radius: 14px;
    border: 1px solid var(--border);
    background: var(--surface-2);
    color: var(--text-soft);
    font: inherit;
    font-size: 0.78rem;
    font-weight: 700;
    line-height: 1.25;
    text-align: left;
    text-decoration: none;
    cursor: pointer;
    transition: border-color 0.15s ease, background 0.15s ease, color 0.15s ease;
}
.trainer-quick-tile:hover {
    border-color: var(--border-strong);
    color: var(--text);
    background: var(--surface-soft);
}
.trainer-quick-tile:focus-visible {
    outline: 2px solid var(--primary);
    outline-offset: 2px;
}
.trainer-quick-tile--button {
    width: 100%;
}
.trainer-quick-tile-icon {
    color: var(--primary);
    opacity: 0.95;
}
.trainer-quick-tile-label {
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}
.trainer-quick-tile:nth-child(5) {
    grid-column: 1 / -1;
    justify-self: center;
    width: min(100%, 220px);
}
.trainer-quick-tile--disabled,
.trainer-quick-tile--disabled:hover {
    opacity: 0.55;
    cursor: not-allowed;
    pointer-events: none;
}
@media (min-width: 1081px) {
    .dashboard-shell:has(.sidebar--trainer-system) {
        grid-template-columns: minmax(220px, 252px) 1fr;
        gap: 18px;
    }
}
.sidebar.sidebar--trainer-system {
    padding: 16px 14px;
    border-radius: 20px;
}
.sidebar.sidebar--trainer-system .sidebar-brand {
    margin-bottom: 10px;
    font-size: 1rem;
}
.sidebar.sidebar--trainer-system .sidebar-user {
    padding: 12px;
    margin-bottom: 10px;
    border-radius: 14px;
}
.sidebar.sidebar--trainer-system .trainer-sidebar-core.sidebar-nav,
.sidebar.sidebar--trainer-system .trainer-sidebar-system.sidebar-nav {
    gap: 4px;
    margin-bottom: 10px;
}
.sidebar.sidebar--trainer-system .trainer-sidebar-core.sidebar-nav a,
.sidebar.sidebar--trainer-system .trainer-sidebar-system.sidebar-nav a {
    padding: 9px 11px;
    border-radius: 12px;
    font-size: 0.9rem;
}
.sidebar.sidebar--trainer-system .sidebar-footer {
    padding-top: 8px;
    margin-top: 4px;
}
.sidebar.sidebar--trainer-system .sidebar-footer-row {
    gap: 6px;
}
@media (max-width: 899px) {
    .trainer-workbench-primary-wrap {
        position: sticky;
        top: calc(env(safe-area-inset-top, 0px) + 52px);
        z-index: 12;
        margin: -4px -4px 8px;
        padding: 8px 4px 10px;
        background: var(--surface);
        border-bottom: 1px solid var(--border);
    }
    .trainer-workbench-panel.panel,
    .trainer-workbench-panel {
        padding-top: 10px;
    }
}
@media (min-width: 900px) {
    .trainer-workbench-primary-wrap {
        position: static;
        margin: 0 0 12px;
        padding: 0;
        background: transparent;
        border-bottom: none;
    }
}
.today-lines { display: grid; gap: 10px; }
.today-line { color: var(--text-soft); line-height: 1.5; }
.today-actions { display: grid; gap: 10px; margin-top: 14px; }
.today-task-row {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    padding: 10px 12px;
    border-radius: 12px;
    border: 1px solid var(--border);
    background: var(--surface-2);
}
.today-task-row .today-task-text {
    flex: 1;
    min-width: 140px;
    color: var(--text-soft);
    font-size: 0.92rem;
    line-height: 1.45;
}
.today-task-row .btn { flex-shrink: 0; }
.recent-client-mini-list {
    list-style: none;
    margin: 10px 0 0;
    padding: 0;
    display: grid;
    gap: 8px;
}
.recent-client-mini-list a {
    font-weight: 600;
    text-decoration: none;
    color: var(--text);
}
.recent-client-mini-list a:hover { text-decoration: underline; }
.dash-ai-links {
    margin: 12px 0 0;
    padding-left: 1.2rem;
    color: var(--text-soft);
    line-height: 1.6;
}
.dash-ai-links li { margin-bottom: 8px; }
.dash-ai-links a { font-weight: 600; color: var(--text); text-decoration: none; }
.dash-ai-links a:hover { text-decoration: underline; }
.dashboard-next-step .trainer-workbench-title { margin-top: 4px; }
.dashboard-grid .dash-recent-programs-panel { grid-column: 1 / -1; }

.program-lib-chip-scroll--clients {
    flex-wrap: wrap;
    gap: 8px;
    row-gap: 8px;
}
.clients-attention-panel {
    margin-bottom: 14px;
}
#trainer-client-library .program-lib-card-hit {
    position: relative;
}
/* «Новый» — не перекрывать кнопку ⋯ (меню absolute top/right на .program-lib-card-inner) */
#trainer-client-library .client-lib-new-badge {
    position: absolute;
    top: 7px;
    right: 48px;
    left: auto;
    z-index: 2;
    font-size: 0.68rem;
    font-weight: 800;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    padding: 4px 8px;
    border-radius: 999px;
    background: rgba(99, 102, 241, 0.2);
    color: var(--primary-2, #6366f1);
    max-width: calc(100% - 96px);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
#trainer-client-library .program-lib-card--compact .client-lib-new-badge {
    top: 5px;
    right: 42px;
    max-width: calc(100% - 88px);
}
#trainer-client-library .client-lib-hints {
    margin-top: 8px;
    display: grid;
    gap: 4px;
    font-size: 0.82rem;
    color: var(--text-muted);
    line-height: 1.35;
}
.clients-empty-title {
    margin: 0 0 6px;
}
.clients-empty-lead {
    margin: 0;
    color: var(--text-soft);
    line-height: 1.5;
}
.muted-label { color: var(--text-muted); font-size: 0.95rem; margin: 0 0 10px; }
.ai-actions { display: flex; gap: 10px; margin-top: 10px; flex-wrap: wrap; }
.ai-undo { opacity: 0.9; }
.ai-status { margin-top: 6px; }
.trial-label { color: var(--text-muted); font-size: 0.92rem; }
.trial-value { margin-top: 6px; font-size: 1.35rem; font-weight: 800; }
.trial-date { margin-top: 6px; color: var(--text-muted); font-size: 0.92rem; }
.trial-progress {
    width: 100%;
    height: 10px;
    border-radius: 999px;
    background: rgba(148, 163, 184, 0.2);
    overflow: hidden;
    margin-top: 8px;
}
.trial-progress-fill {
    height: 100%;
    border-radius: inherit;
    background: linear-gradient(90deg, #4f46e5, #22c55e);
}
.trial-urgency {
    margin-top: 8px;
    font-size: 0.92rem;
    font-weight: 700;
    color: #d97706;
}
.trial-box-warning .trial-urgency { color: #d97706; }
.trial-box-danger .trial-urgency { color: #dc2626; }
.trial-box-warning { border-color: rgba(217, 119, 6, 0.45); }
.trial-box-danger { border-color: rgba(220, 38, 38, 0.55); }
.btn-disabled {
    opacity: 0.65;
    cursor: not-allowed;
    pointer-events: auto;
}
.dashboard-stats { display: grid; grid-template-columns: repeat(4, 1fr); gap: 16px; margin-bottom: 22px; }
.dashboard-stat-number { font-size: 1.9rem; font-weight: 800; letter-spacing: -0.04em; }
.dashboard-stat-label { margin-top: 8px; color: var(--text-muted); }
a.dashboard-stat-card--link {
    display: block;
    text-decoration: none;
    color: inherit;
    transition: border-color 0.15s ease, box-shadow 0.15s ease;
}
a.dashboard-stat-card--link:hover {
    border-color: color-mix(in srgb, var(--primary) 45%, var(--border));
    box-shadow: 0 0 0 1px rgba(37, 99, 235, 0.18);
}
html[data-theme="dark"] a.dashboard-stat-card--link:hover {
    box-shadow: 0 0 0 1px rgba(123, 140, 255, 0.28);
}
.dashboard-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 18px; }

.panel-section-hint {
    margin: -2px 0 12px;
    font-size: 0.92rem;
    line-height: 1.45;
    color: var(--text-muted);
}

.nutrition-plan-render {
    line-height: 1.55;
    white-space: normal;
    word-break: break-word;
    color: var(--text-soft);
    font-size: 0.96rem;
}
.nutrition-plan-render--inset {
    margin-top: 10px;
    margin-bottom: 14px;
    background: transparent;
    border: 1px solid var(--border);
    border-radius: 14px;
    padding: 12px 14px;
}

.dashboard-grid.client-detail-history-grid {
    grid-template-columns: repeat(auto-fit, minmax(min(100%, 280px), 1fr));
    align-items: start;
}
.metrics-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 10px;
}
.metric-card {
    border: 1px solid var(--border);
    border-radius: 12px;
    background: var(--surface-2);
    padding: 10px 12px;
}
.metric-label {
    color: var(--text-muted);
    font-size: 0.78rem;
    text-transform: uppercase;
    letter-spacing: 0.04em;
}
.metric-value {
    margin-top: 4px;
    font-size: 1.1rem;
    font-weight: 700;
}
.measurements-panel {
    border: 1px solid var(--border);
    border-radius: 18px;
    background: var(--surface);
}
.measurements-kpi-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 10px;
    margin-top: 12px;
}
.measurements-kpi-card {
    border: 1px solid var(--border);
    border-radius: 12px;
    background: var(--surface-2);
    padding: 10px 12px;
    min-height: 0;
    display: grid;
    align-content: start;
    gap: 4px;
}
.measurements-kpi-card .metric-value-lg {
    font-size: 1.28rem;
    margin-top: 0;
}
.measurements-kpi-card .metric-label {
    font-size: 0.72rem;
}
.measurements-kpi-delta-msg {
    font-size: 0.8rem;
    font-weight: 600;
    line-height: 1.35;
    margin-top: 2px;
}
.metric-value-lg {
    font-size: 1.5rem;
    letter-spacing: -0.03em;
}
.metric-helper {
    color: var(--text-muted);
    font-size: 0.82rem;
    line-height: 1.4;
}
.metric-trend-good { color: #22c55e; }
.metric-trend-bad { color: #f59e0b; }

/* Measurements / Progress: action hierarchy + compact KPIs */
.measurements-hero-toolbar {
    margin-bottom: 16px;
}
.measurements-hero-toolbar-row {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 8px;
}
.measurements-hero-toolbar .btn {
    min-height: 36px;
    font-weight: 600;
}
.measurements-hero-toolbar .btn-with-lucide {
    gap: 6px;
}
.measurements-hero-toolbar .btn-with-lucide .lucide-svg {
    width: 16px;
    height: 16px;
}
.measurements-hero-toolbar .measurements-add-cta {
    flex: 0 1 auto;
    justify-content: center;
    padding: 7px 14px;
    font-size: 0.875rem;
    border-radius: 11px;
    box-shadow: 0 4px 16px color-mix(in srgb, var(--primary) 22%, transparent);
}
.measurements-hero-toolbar .measurements-add-cta.btn-primary:hover {
    box-shadow: 0 5px 18px color-mix(in srgb, var(--primary) 28%, transparent);
}
.measurements-hero-secondary {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    flex: 0 1 auto;
    justify-content: flex-end;
}
.measurements-hero-sublinks {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 6px 14px;
    margin-top: 10px;
    padding-top: 10px;
    border-top: 1px solid color-mix(in srgb, var(--border) 65%, transparent);
}
.measurements-sublink {
    font-size: 0.88rem;
    font-weight: 600;
    color: var(--text-soft);
    text-decoration: none;
    letter-spacing: -0.01em;
}
.measurements-sublink:hover {
    color: var(--primary-2);
    text-decoration: underline;
    text-underline-offset: 3px;
}
@media (max-width: 520px) {
    .measurements-hero-toolbar-row {
        flex-direction: column;
        align-items: flex-start;
    }
    .measurements-hero-secondary {
        justify-content: flex-start;
    }
    .measurements-hero-secondary .measurements-secondary-cta {
        flex: 0 0 auto;
    }
}

.measurements-goal-grid {
    margin-top: 18px;
    align-items: start;
}
.goal-progress-shell {
    margin-bottom: 14px;
    border: 1px solid var(--border);
    border-radius: 14px;
    padding: 12px;
    background: var(--surface-2);
}
.goal-progress-meta {
    display: flex;
    justify-content: space-between;
    gap: 10px;
    flex-wrap: wrap;
    color: var(--text-muted);
    font-size: 0.9rem;
    margin-bottom: 10px;
}
.goal-progress-track {
    width: 100%;
    height: 10px;
    border-radius: 999px;
    background: rgba(148, 163, 184, 0.18);
    overflow: hidden;
    margin-bottom: 10px;
}
.goal-progress-fill {
    height: 100%;
    background: linear-gradient(90deg, #4f46e5, #22c55e);
    border-radius: inherit;
}
.measurements-empty {
    border: 1px dashed var(--border);
    border-radius: 14px;
    padding: 14px;
    background: rgba(148, 163, 184, 0.04);
    margin-bottom: 12px;
}
.measurements-chart-shell {
    margin-top: 12px;
    border: 1px solid var(--border);
    border-radius: 14px;
    background: var(--surface-2);
    padding: 10px;
}
.measurements-chart-shell canvas {
    width: 100%;
    display: block;
}
.measurements-chart-empty {
    display: none;
    padding: 24px 8px;
    text-align: center;
}
.measurements-content-grid {
    margin-top: 18px;
    align-items: start;
}
.measurements-form .btn-primary {
    margin-top: 8px;
    width: 100%;
}
.measurements-form-section-title {
    margin: 8px 0 2px;
    font-size: 0.9rem;
    color: var(--text-muted);
    font-weight: 700;
}
.measurements-advanced {
    margin-top: 8px;
    padding: 8px 10px;
    border: 1px dashed var(--border);
    border-radius: 10px;
    background: transparent;
}
.measurements-advanced summary {
    cursor: pointer;
    font-weight: 600;
    color: var(--text-soft);
    font-size: 0.88rem;
    list-style: none;
}
.measurements-advanced .empty-text {
    margin: 8px 0 10px;
}
.measurements-timeline {
    display: grid;
    gap: 12px;
    margin-top: 10px;
}
.measurements-entry {
    border: 1px solid var(--border);
    border-radius: 14px;
    padding: 12px;
    background: var(--surface-2);
}
.measurements-entry-head {
    display: flex;
    justify-content: space-between;
    align-items: baseline;
    gap: 8px;
    margin-bottom: 10px;
}
.measurements-entry-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 8px;
}
.measurements-entry-grid div {
    border: 1px solid var(--border);
    border-radius: 10px;
    padding: 8px;
    background: var(--surface);
}
.measurements-entry-grid span {
    display: block;
    color: var(--text-muted);
    font-size: 0.75rem;
    margin-bottom: 3px;
}
.measurements-entry-grid strong {
    font-size: 0.95rem;
}
.measurements-note {
    margin-top: 10px;
    color: var(--text-muted);
    font-size: 0.9rem;
    line-height: 1.45;
}
.measurements-compact-list {
    display: grid;
    gap: 6px;
    margin-top: 8px;
}
.measurements-compact-list div {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 10px;
    padding: 0;
}
.measurements-compact-list span {
    color: var(--text-muted);
    font-size: 0.82rem;
    line-height: 1.25;
}
.measurements-compact-list strong {
    font-size: 0.92rem;
    font-weight: 700;
}
.workout-add-row {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 12px;
}
.dashboard-switcher {
    display: flex;
    gap: 10px;
    flex-wrap: wrap;
    margin-bottom: 14px;
}
.dashboard-switcher .btn {
    flex: 1 1 180px;
    min-width: 0;
}
.media-filter-tabs {
    display: flex;
    align-items: center;
    gap: 8px;
    flex-wrap: nowrap;
    overflow-x: auto;
    padding-bottom: 2px;
    margin-bottom: 0;
}
.media-filter-chip {
    flex: 0 0 auto;
    min-height: 30px;
    padding: 6px 12px;
    border-radius: 999px;
    font-size: 0.84rem;
    font-weight: 700;
    line-height: 1.1;
    border: 1px solid var(--border-strong);
    background: transparent;
    color: var(--text-muted);
    box-shadow: none;
}
.media-filter-chip:hover {
    transform: none;
    border-color: var(--border-strong);
    background: var(--surface-2);
    color: var(--text-soft);
}
.media-filter-chip.is-active,
.media-filter-chip.btn-primary {
    background: var(--primary-soft);
    border-color: color-mix(in srgb, var(--primary) 45%, var(--border-strong));
    color: var(--primary);
}
.media-filter-hidden {
    display: none !important;
}
.workout-detail-card {
    margin-bottom: 18px;
    border-radius: 18px;
    border-color: var(--border-strong);
}
.workout-detail-help {
    margin-top: 0;
    margin-bottom: 12px;
}
.workout-breadcrumbs {
    display: flex;
    gap: 8px;
    flex-wrap: wrap;
    color: var(--text-muted);
    font-size: 0.92rem;
}
.workout-breadcrumbs a {
    color: var(--text-soft);
}
.workout-breadcrumbs--trunc {
    flex-wrap: nowrap;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    max-width: 100%;
    padding-bottom: 2px;
    scrollbar-width: thin;
}
.workout-breadcrumbs--trunc > * {
    flex-shrink: 0;
}
.workout-breadcrumbs__current {
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    max-width: min(52vw, 280px);
}
.workout-breadcrumbs__ellipsis {
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    max-width: min(40vw, 200px);
}
.workout-day-view-card--context-first {
    border-color: var(--border-strong);
}
.btn-action-destructive {
    color: color-mix(in srgb, var(--danger, #b91c1c) 88%, var(--text-soft));
    border-color: color-mix(in srgb, var(--danger, #b91c1c) 35%, var(--border-strong));
    background: color-mix(in srgb, var(--danger, #b91c1c) 6%, var(--surface));
}
.btn-action-destructive:hover {
    border-color: color-mix(in srgb, var(--danger, #b91c1c) 55%, var(--border-strong));
    color: var(--danger, #b91c1c);
    background: color-mix(in srgb, var(--danger, #b91c1c) 10%, var(--surface));
}
.program-day-card-actions {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 10px;
    width: 100%;
}
.program-day-card-actions__grow {
    flex: 1 1 120px;
    min-width: 0;
}
.program-day-card-actions__secondary {
    display: inline-flex;
    flex-wrap: wrap;
    gap: 8px;
    align-items: center;
}
.program-day-card-actions__destructive {
    margin-left: auto;
}
@media (max-width: 560px) {
    .program-day-card-actions__destructive {
        margin-left: 0;
        width: 100%;
    }
    .program-day-card-actions__destructive .btn {
        width: 100%;
    }
}
.workout-exercise-actions--prioritized {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 10px;
    width: 100%;
}
.workout-exercise-actions--prioritized .workout-exercise-actions__reorder {
    display: inline-flex;
    gap: 6px;
    flex-wrap: nowrap;
}
.workout-exercise-actions--prioritized .workout-exercise-actions__destructive {
    margin-left: auto;
}
@media (max-width: 520px) {
    .workout-exercise-actions--prioritized .workout-exercise-actions__destructive {
        margin-left: 0;
        width: 100%;
    }
    .workout-exercise-actions--prioritized .workout-exercise-actions__destructive .btn {
        width: 100%;
    }
}
.workspace-day-nav-wrap--single-row .workspace-day-nav {
    flex-wrap: nowrap;
}
.workspace-day-nav--single-row {
    flex-wrap: nowrap;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    gap: 8px;
    padding-bottom: 4px;
    scrollbar-width: thin;
}
.workspace-day-nav__tab--split {
    flex-direction: column;
    align-items: flex-start;
    line-height: 1.2;
    text-align: left;
    padding: 8px 12px;
}
.workspace-day-nav__tab--split .workspace-day-nav__short,
.workspace-day-nav__tab--split .workspace-day-nav__full {
    display: block;
    white-space: nowrap;
}
.workspace-day-nav__tab--split .workspace-day-nav__full {
    font-weight: 600;
    font-size: 0.78rem;
    color: var(--text-muted);
    max-width: 200px;
    overflow: hidden;
    text-overflow: ellipsis;
}
.workspace-day-nav__tab--split.is-active .workspace-day-nav__full {
    color: inherit;
}
@media (min-width: 720px) {
    .workspace-day-nav__tab--split .workspace-day-nav__short {
        display: none;
    }
    .workspace-day-nav__tab--split .workspace-day-nav__full {
        max-width: none;
        font-size: inherit;
        font-weight: 700;
        color: inherit;
    }
}
@media (max-width: 719.98px) {
    .workspace-day-nav__tab--split .workspace-day-nav__full {
        display: none;
    }
}
.workspace-day-nav-active-context {
    margin: 8px 0 0;
    font-size: 0.84rem;
    font-weight: 600;
}
@media (min-width: 720px) {
    .workspace-day-nav-active-context {
        display: none;
    }
}
.workout-help-panel > summary {
    cursor: pointer;
    font-weight: 600;
    color: var(--text-muted);
    font-size: 0.92rem;
}
.workout-help-panel[open] > summary {
    margin-bottom: 4px;
}
.workout-help-panel .dashboard-subtext {
    font-size: 0.88rem;
}
.client-workspace-top-links {
    display: flex;
    flex-wrap: nowrap;
    gap: 8px;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    padding-bottom: 2px;
    scrollbar-width: thin;
}
.client-workspace-top-links .btn {
    flex-shrink: 0;
    white-space: nowrap;
}
.workout-top-actions {
    display: flex;
    gap: 10px;
    flex-wrap: wrap;
}
.workout-add-shell {
    margin-top: -6px;
}
.selfw-disclosure {
    display: grid;
    gap: 0;
}
.selfw-disclosure-summary {
    list-style: none;
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    justify-content: center;
}
.selfw-disclosure-summary::-webkit-details-marker {
    display: none;
}
.selfw-disclosure[open] > .selfw-disclosure-summary {
    margin-bottom: 10px;
}
.selfw-open-modal-btn {
    margin-top: 10px;
}
.app-modal-open {
    overflow: hidden;
}
.app-modal-backdrop {
    position: fixed;
    inset: 0;
    background: rgba(2, 6, 23, 0.58);
    display: none;
    align-items: center;
    justify-content: center;
    padding: 20px;
    z-index: 13050;
}
.app-modal-backdrop.is-open {
    display: flex;
}
.app-modal-card {
    width: min(680px, 100%);
    border-radius: 16px;
    border: 1px solid var(--border-strong);
    background: var(--surface);
    box-shadow: var(--card-shadow);
    padding: 18px;
    max-height: calc(100vh - 40px);
    max-height: calc(100dvh - 40px);
    overflow-y: auto;
    overflow-x: hidden;
}
.app-modal-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    margin-bottom: 12px;
}
.app-modal-head h3 {
    margin: 0;
}
.selfw-modal-open {
    overflow: hidden;
}
.selfw-modal-backdrop {
    position: fixed;
    inset: 0;
    background: rgba(2, 6, 23, 0.58);
    display: none;
    align-items: center;
    justify-content: center;
    padding: 20px;
    z-index: 13050;
}
.selfw-modal-backdrop.is-open {
    display: flex;
}
.selfw-modal-card {
    width: min(640px, 100%);
    border-radius: 16px;
    border: 1px solid var(--border-strong);
    background: var(--surface);
    box-shadow: var(--card-shadow);
    padding: 18px;
}
.selfw-modal-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    margin-bottom: 12px;
}
.selfw-modal-head h3 {
    margin: 0;
}
.selfw-modal-actions {
    display: flex;
    justify-content: flex-end;
    gap: 8px;
    margin-top: 10px;
}
.selfw-close-modal-btn {
    white-space: nowrap;
}

/* PWA install banner */
.pwa-install-banner {
    position: fixed;
    left: 16px;
    right: 16px;
    bottom: 16px;
    z-index: 1300;
    display: none;
}
.pwa-install-banner.is-visible {
    display: block;
}
.pwa-install-card {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding: 12px 12px;
    border-radius: 16px;
    border: 1px solid rgba(255, 255, 255, 0.10);
    background:
        radial-gradient(circle at 18% 25%, rgba(124, 58, 237, 0.45), transparent 44%),
        radial-gradient(circle at 88% 72%, rgba(147, 51, 234, 0.35), transparent 56%),
        linear-gradient(135deg, rgba(76, 29, 149, 0.55), rgba(15, 23, 42, 0.88));
    backdrop-filter: blur(12px);
    box-shadow: 0 18px 60px rgba(0, 0, 0, 0.40);
}
.pwa-install-text {
    min-width: 0;
}
.pwa-install-title {
    font-weight: 800;
    letter-spacing: -0.02em;
    margin: 0;
    font-size: 0.98rem;
    color: var(--text);
}
.pwa-install-subtitle {
    margin: 2px 0 0 0;
    font-size: 0.90rem;
    color: var(--text-muted);
}
.pwa-install-actions {
    display: flex;
    align-items: center;
    gap: 8px;
    flex-shrink: 0;
}
.btn-install {
    background: linear-gradient(135deg, #7c3aed, #4f46e5);
    border-color: rgba(124, 58, 237, 0.45);
    color: white;
}
.btn-install:hover {
    filter: brightness(1.02);
}
.workout-add-head {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 12px;
    margin-bottom: 12px;
}
.workout-add-form {
    gap: 12px;
}
.workout-advanced-toggle {
    margin-top: 4px;
    align-self: flex-start;
}
.workout-advanced-wrap {
    border: 1px solid var(--border);
    background: var(--surface-2);
    border-radius: 14px;
    padding: 12px;
}
.workout-detail-fields-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 12px;
}
.workout-exercise-list {
    display: grid;
    gap: 14px;
}
.workout-exercise-list--editing-focus .workout-exercise-card:not(.workout-exercise-card--editing) {
    opacity: 0.42;
    pointer-events: none;
    transition: opacity 0.2s ease;
}
.workout-exercise-card--editing {
    outline: 2px solid rgba(120, 128, 255, 0.75);
    outline-offset: 2px;
    box-shadow: 0 8px 28px rgba(0, 0, 0, 0.22);
    position: relative;
    z-index: 2;
    transition: box-shadow 0.2s ease, outline-color 0.2s ease;
}
.workout-exercise-edit-toolbar {
    display: flex;
    justify-content: flex-end;
    margin-bottom: 10px;
    gap: 8px;
    flex-wrap: wrap;
}
.workout-exercise-edit-panel .auth-form {
    margin: 0;
}
.workout-exercise-card {
    border: 1px solid var(--border);
    border-radius: 16px;
    padding: 14px;
    background: var(--surface-2);
    display: grid;
    gap: 12px;
}
.workout-exercise-main {
    display: grid;
    gap: 10px;
}
.workout-exercise-head {
    display: flex;
    align-items: center;
    gap: 10px;
    flex-wrap: wrap;
}
.workout-exercise-head h4 {
    margin: 0;
    font-size: 1.03rem;
}
.workout-exercise-meta {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 8px;
}
.workout-exercise-meta div {
    border: 1px solid var(--border);
    border-radius: 12px;
    padding: 8px 10px;
    background: var(--surface);
}
.workout-exercise-meta span {
    display: block;
    color: var(--text-muted);
    font-size: 0.75rem;
    margin-bottom: 3px;
}
.workout-exercise-meta strong {
    font-size: 0.95rem;
}
.workout-exercise-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    align-items: center;
}
.workspace-plan-card {
    position: relative;
}
.self-plan-card.workspace-plan-card .self-plan-card-v2__main {
    position: relative;
    z-index: 0;
}
.workspace-plan-card-hit {
    position: absolute;
    inset: 0;
    z-index: 1;
    border-radius: inherit;
}
.workspace-plan-card-hit:focus-visible {
    box-shadow: 0 0 0 2px var(--surface), 0 0 0 4px var(--primary);
}
.client-create-workspace-program-panel {
    position: relative;
    z-index: 2;
}
.workspace-plan-card-actions {
    position: relative;
    z-index: 4;
}
.program-card-actions {
    justify-content: space-between;
    width: 100%;
}
.program-card-open-btn {
    flex: 1 1 auto;
}
.program-card-menu {
    position: relative;
}
.program-card-menu summary {
    list-style: none;
}
.program-card-menu summary::-webkit-details-marker {
    display: none;
}
.program-card-menu-trigger {
    min-width: 44px;
    padding: 10px 12px;
    font-size: 1.25rem;
    line-height: 1;
}
.program-card-menu-list {
    position: absolute;
    right: 0;
    top: calc(100% + 6px);
    z-index: 5;
    min-width: 180px;
    padding: 6px;
    border: 1px solid var(--border-strong);
    border-radius: 12px;
    background: var(--surface);
    box-shadow: var(--card-shadow);
    display: grid;
    gap: 4px;
}
.program-card-menu-item {
    width: 100%;
    border: 0;
    border-radius: 8px;
    background: transparent;
    color: var(--text);
    text-align: left;
    padding: 9px 10px;
    font-size: 0.92rem;
    cursor: pointer;
}
.program-card-menu-item:hover {
    background: var(--surface-2);
}
.program-card-menu-item--danger {
    color: #dc2626;
}
.program-card-menu-form {
    margin: 0;
}
.workout-position-actions {
    display: flex;
    gap: 6px;
    flex-wrap: wrap;
}
.workout-position-actions .btn {
    min-width: 42px;
    padding: 9px 12px;
}
.workout-delete-form {
    margin-left: auto;
}
.workout-edit-block {
    border-top: 1px solid var(--border);
    padding-top: 12px;
}
.workout-exercise-edit-panel[hidden] {
    display: none !important;
}

.meal-plan-list--editing-focus .workout-exercise-card:not(.meal-plan-card--editing) {
    opacity: 0.42;
    pointer-events: none;
    transition: opacity 0.2s ease;
}
.meal-plan-card--editing {
    outline: 2px solid rgba(120, 128, 255, 0.75);
    outline-offset: 2px;
    box-shadow: 0 8px 28px rgba(0, 0, 0, 0.22);
    position: relative;
    z-index: 2;
}
.meal-plan-self-card.panel.workout-exercise-card {
    margin: 0;
}
[data-meal-plan-edit-panel][hidden] {
    display: none !important;
}
.meal-plan-initial-data {
    display: none !important;
}
.simple-list { margin: 0; padding-left: 18px; color: var(--text-soft); line-height: 1.8; }
.empty-text { margin: 0; color: var(--text-muted); }
.billing-panel-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    margin-bottom: 10px;
}
.billing-collapsible[hidden] {
    display: none;
}
.billing-collapsible {
    margin-top: 8px;
}
.billing-form-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 14px;
}
.billing-form-section {
    border: 1px solid var(--border);
    border-radius: 14px;
    background: var(--surface-2);
    padding: 12px;
    display: grid;
    gap: 8px;
}
.billing-form-section h4 {
    margin: 0;
}
.billing-form-section-full {
    grid-column: 1 / -1;
}
.billing-platform-meta {
    grid-template-columns: repeat(3, minmax(0, 1fr));
}
.billing-summary-stats {
    margin-bottom: 0;
}
.billing-record-list {
    display: grid;
    gap: 12px;
}
.billing-record-card {
    border: 1px solid var(--border);
    border-radius: 16px;
    padding: 14px;
    background: var(--surface-2);
    display: grid;
    gap: 12px;
}
.billing-record-head {
    display: flex;
    justify-content: space-between;
    gap: 10px;
    align-items: flex-start;
}
.billing-record-head h4 {
    margin: 0 0 4px;
    font-size: 1rem;
}
.billing-record-badges {
    display: flex;
    gap: 8px;
    flex-wrap: wrap;
    justify-content: flex-end;
}
.billing-badge {
    display: inline-flex;
    align-items: center;
    padding: 5px 10px;
    border-radius: 999px;
    font-size: 0.78rem;
    font-weight: 700;
}
.billing-badge-status-paid { background: rgba(34, 197, 94, 0.15); color: #166534; }
.billing-badge-status-pending { background: rgba(59, 130, 246, 0.15); color: #1d4ed8; }
.billing-badge-status-draft { background: rgba(148, 163, 184, 0.2); color: var(--text-soft); }
.billing-badge-status-overdue { background: rgba(245, 158, 11, 0.2); color: #92400e; }
.billing-badge-status-canceled,
.billing-badge-status-expired { background: rgba(239, 68, 68, 0.15); color: #b91c1c; }
.billing-badge-mode-stripe { background: rgba(99, 102, 241, 0.18); color: #4338ca; }
.billing-badge-mode-manual { background: rgba(148, 163, 184, 0.2); color: var(--text-soft); }
.billing-record-meta {
    grid-template-columns: repeat(4, minmax(0, 1fr));
}
.billing-record-flow-note {
    border: 1px dashed var(--border);
    background: rgba(148, 163, 184, 0.05);
    border-radius: 12px;
    padding: 9px 10px;
    font-size: 0.9rem;
    color: var(--text-soft);
}
.billing-record-actions {
    display: flex;
    gap: 8px;
    flex-wrap: wrap;
}
.billing-record-actions .btn {
    min-height: 40px;
}
.clients-table-wrap { overflow-x: auto; }
.clients-table {
    width: 100%;
    border-collapse: collapse;
    margin-top: 10px;
}
.clients-table th,
.clients-table td {
    text-align: left;
    padding: 10px 12px;
    border-bottom: 1px solid var(--border);
    color: var(--text-soft);
    vertical-align: top;
}
.clients-table td::before {
    content: attr(data-label);
    display: none;
    font-weight: 700;
    color: var(--text-muted);
    margin-bottom: 4px;
}
.clients-table th {
    color: var(--text-muted);
    font-size: 0.86rem;
    text-transform: uppercase;
    letter-spacing: 0.03em;
}
.admin-purge-form {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    align-items: center;
    margin-top: 4px;
}
.admin-purge-confirm {
    min-width: 160px;
    max-width: 200px;
    padding: 6px 8px;
    font-size: 0.85rem;
    border-radius: 8px;
    border: 1px solid var(--border);
    background: var(--surface);
    color: var(--text);
}
.video-badge {
    display: inline-flex;
    align-items: center;
    padding: 4px 10px;
    border-radius: 999px;
    font-size: 0.78rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.02em;
}
.video-badge-uploaded {
    background: rgba(34, 197, 94, 0.15);
    color: #166534;
}
.video-badge-external {
    background: rgba(59, 130, 246, 0.15);
    color: #1d4ed8;
}
.video-badge-legacy {
    background: rgba(250, 204, 21, 0.18);
    color: #854d0e;
}
.self-cal-row--active td:first-child {
    border-left: 3px solid #7c3aed;
}
.self-cal-row--completed td:first-child {
    border-left: 3px solid #16a34a;
}
.self-cal-row--canceled td:first-child {
    border-left: 3px solid #ef4444;
}
.self-cal-status-badge--active {
    background: rgba(124, 58, 237, 0.18);
    color: #6d28d9;
}
.self-cal-status-badge--completed {
    background: rgba(34, 197, 94, 0.16);
    color: #166534;
}
.self-cal-status-badge--canceled {
    background: rgba(239, 68, 68, 0.14);
    color: #b91c1c;
}
.video-mode-toggle {
    display: flex;
    gap: 10px;
    flex-wrap: wrap;
    margin-bottom: 14px;
}
.video-mode-btn.is-active {
    background: var(--primary-soft);
    border-color: var(--primary);
    color: var(--primary);
}
.video-mode-panel {
    margin-top: 4px;
}
.video-mode-panel-hidden {
    display: none;
}
.video-dropzone {
    border: 1.5px dashed var(--border-strong);
    border-radius: 14px;
    padding: 18px;
    background: var(--surface-2);
    cursor: pointer;
    transition: border-color 0.2s ease, background 0.2s ease;
}
.video-dropzone:hover,
.video-dropzone.is-dragover {
    border-color: var(--primary);
    background: var(--primary-soft);
}
.video-dropzone-title {
    font-weight: 700;
}
.video-dropzone-sub {
    color: var(--text-muted);
    font-size: 0.9rem;
    margin-top: 4px;
}
.video-dropzone-file {
    margin-top: 8px;
    color: var(--text-soft);
    font-size: 0.9rem;
}
.video-file-input-hidden {
    position: absolute;
    width: 1px !important;
    height: 1px !important;
    margin: -1px;
    border: 0;
    padding: 0;
    clip: rect(0 0 0 0);
    overflow: hidden;
}
.upload-progress-wrap {
    margin-top: 10px;
}
.upload-progress-bar {
    width: 100%;
    height: 10px;
    border-radius: 999px;
    background: var(--surface-2);
    overflow: hidden;
    border: 1px solid var(--border);
}
.upload-progress-fill {
    width: 0;
    height: 100%;
    border-radius: 999px;
    background: linear-gradient(135deg, var(--primary), var(--primary-2));
    transition: width 0.15s linear;
}
.upload-progress-text {
    margin-top: 6px;
    color: var(--text-muted);
    font-size: 0.9rem;
}
html[data-theme="dark"] .video-badge-uploaded {
    color: #bbf7d0;
}
html[data-theme="dark"] .video-badge-external {
    color: #bfdbfe;
}
html[data-theme="dark"] .video-badge-legacy {
    color: #fde68a;
}

@media (max-width: 1080px) {
    .hero-grid, .dashboard-shell, .dashboard-grid, .payments-grid, .steps-grid, .feature-grid, .roadmap-grid, .stats-grid, .dashboard-stats {
        grid-template-columns: 1fr 1fr;
    }
    .hero--smart-scan .hero-grid {
        grid-template-columns: 1fr;
        gap: 36px;
        justify-items: center;
    }
    .hero--smart-scan .hero-copy {
        width: 100%;
        max-width: 720px;
    }
    .smart-scan-hero-visual {
        width: min(100%, 560px);
        padding-top: 26px;
    }
    .hero-start-options {
        grid-template-columns: 1fr 1fr;
    }
    .scan-demo-stack {
        width: min(100%, 560px);
        justify-self: center;
    }
    .smart-scan-hero-visual::before {
        inset: 44px 10px 18px;
    }
    .scan-demo-card--photo {
        aspect-ratio: 1.5 / 1;
    }
    .scan-demo-card--plan {
        width: min(100%, 340px);
        justify-self: center;
        min-height: 440px;
        transform: none;
    }
    .scan-demo-card,
    .scan-demo-card--plan {
        min-height: 0;
        align-self: stretch;
    }
    .scan-demo-ai-bridge {
        width: 100%;
        min-height: 54px;
    }
    .scan-demo-ai-bridge::before {
        left: 50%;
        right: auto;
        width: 2px;
        height: 48px;
        transform: translateX(-50%);
        background: linear-gradient(180deg, transparent, var(--primary), transparent);
    }
    .scan-demo-ai-bridge::after {
        right: auto;
        bottom: 5px;
        transform: rotate(135deg);
    }
    .scan-demo-photo {
        min-height: 220px;
    }
    .scan-demo-workout-shot {
        min-height: 360px;
        max-height: 360px;
    }
    .landing-proof-grid {
        grid-template-columns: 1fr;
    }
    .landing-proof-card--phone,
    .landing-proof-card--progress {
        width: min(100%, 280px);
    }
    .landing-mode-grid {
        grid-template-columns: 1fr;
    }
    .dashboard-shell { grid-template-columns: 1fr; }
    .sidebar { position: static; }
}

@media (max-width: 720px) {
    .hero-grid, .dashboard-grid, .payments-grid, .steps-grid, .feature-grid, .roadmap-grid, .stats-grid, .dashboard-stats, .pricing-grid {
        grid-template-columns: 1fr;
    }
    .cta-box, .footer-inner, .dashboard-top { display: grid; grid-template-columns: 1fr; }
    /* Stack generic headers only — never column for landing, auth, or app PWA bar */
    .header-inner:not(.header-inner--landing-market):not(.header-inner--auth):not(.header-app-bar) {
        flex-direction: column;
        align-items: flex-start;
    }
    .header-inner:not(.header-inner--landing-market):not(.header-inner--auth):not(.header-app-bar) .nav {
        width: 100%;
    }
    .hero { padding-top: 42px; }
    .hero--smart-scan .hero-copy h1 {
        font-size: clamp(38px, 12vw, 52px);
        line-height: 1.02;
        letter-spacing: -0.05em;
    }
    .hero--smart-scan .hero-actions {
        display: grid;
        grid-template-columns: 1fr;
        gap: 10px;
    }
    .hero--smart-scan .hero-actions .btn {
        width: 100%;
    }
    .hero-secondary-action {
        text-align: center;
    }
    .hero-coach-link {
        justify-content: center;
        min-height: 42px;
    }
    .hero-start-options {
        grid-template-columns: 1fr;
    }
    .hero-how-card {
        padding: 16px;
        border-radius: 26px;
    }
    .hero-how-head {
        align-items: flex-start;
        flex-direction: column;
    }
    .hero-how-body {
        grid-template-columns: 1fr;
    }
    .hero-phone-preview {
        width: min(100%, 300px);
        justify-self: center;
    }
    .scan-demo-workout-shot {
        min-height: 320px;
        max-height: 320px;
    }
    .auth-page { padding: 44px 16px 22px; }
    .auth-card, .auth-card-wide { padding: 18px; }
    .container { width: min(1180px, calc(100% - 20px)); }
    .dashboard-page { padding: 20px 0 40px; }
    .panel { padding: 16px; border-radius: 16px; }
    .sidebar { padding: 14px; border-radius: 16px; }
    .dashboard-top .btn { width: 100%; }
    .auth-form .btn { width: 100%; }
    .billing-panel-head {
        align-items: stretch;
        flex-direction: column;
    }
    .billing-panel-head .btn {
        width: 100%;
    }
    .billing-form-grid {
        grid-template-columns: 1fr;
    }
    .billing-platform-meta,
    .billing-record-meta {
        grid-template-columns: 1fr;
    }
    .billing-record-head {
        flex-direction: column;
    }
    .billing-record-badges {
        justify-content: flex-start;
    }
    .billing-record-actions {
        display: grid;
        grid-template-columns: 1fr;
    }
    .billing-record-actions .inline-form,
    .billing-record-actions .btn {
        width: 100%;
    }
    .workout-top-actions {
        width: 100%;
    }
    .workout-top-actions .btn {
        width: 100%;
    }
    .workout-add-head {
        align-items: stretch;
    }
    .workout-add-head .btn {
        width: auto;
    }
    .workout-detail-fields-grid {
        grid-template-columns: 1fr;
    }
    .workout-exercise-meta {
        grid-template-columns: 1fr;
    }
    .workout-exercise-actions {
        flex-direction: column;
        align-items: stretch;
    }
    .program-card-actions {
        flex-direction: row;
        align-items: center;
        gap: 8px;
    }
    .program-card-open-btn {
        flex: 1 1 auto;
        width: auto;
    }
    .program-card-menu {
        margin-left: auto;
    }
    .program-card-menu-list {
        min-width: 168px;
        right: 0;
    }
    .workout-position-actions {
        width: 100%;
    }
    .workout-position-actions .inline-form {
        flex: 1;
    }
    .workout-position-actions .btn {
        width: 100%;
    }
    .workout-delete-form {
        margin-left: 0;
        width: 100%;
    }
    .workout-delete-form .btn {
        width: 100%;
    }
    .clients-table thead {
        display: none;
    }
    .clients-table,
    .clients-table tbody,
    .clients-table tr,
    .clients-table td {
        display: block;
        width: 100%;
    }
    .clients-table tr {
        border: 1px solid var(--border);
        border-radius: 14px;
        padding: 10px;
        margin-bottom: 10px;
        background: var(--surface-2);
    }
    .clients-table td {
        border: 0;
        padding: 6px 0;
        color: var(--text);
    }
    .clients-table td::before {
        display: block;
    }
    .clients-table td .btn {
        width: 100%;
    }
}

/* Client browser workout (parity with Telegram flow) */
.cw-page { padding: 24px 0 48px; }
.cw-top { display: flex; flex-wrap: wrap; align-items: flex-start; justify-content: space-between; gap: 16px; margin-bottom: 20px; }
.cw-h2 { margin: 0 0 8px; font-size: 1.35rem; letter-spacing: -0.02em; }
.cw-h3 { margin: 0 0 8px; font-size: 1.05rem; }
.cw-status { min-height: 1.25em; font-size: 0.92rem; color: var(--text-muted); margin-bottom: 12px; }
.cw-status--error { color: #dc2626; }
html[data-theme="dark"] .cw-status--error { color: #f87171; }
.cw-grid { display: grid; grid-template-columns: 1fr 320px; gap: 20px; align-items: start; }
@media (max-width: 900px) { .cw-grid { grid-template-columns: 1fr; } }
.cw-panel { background: var(--surface); border: 1px solid var(--border); border-radius: 18px; padding: 20px; box-shadow: var(--card-shadow); }
.cw-card { background: var(--surface-2); border: 1px solid var(--border); border-radius: 16px; padding: 18px; margin-top: 14px; }
.cw-card--done { border-color: var(--primary); background: var(--primary-soft); }
.cw-done-title { font-weight: 800; font-size: 1.1rem; margin-bottom: 8px; }
.cw-ex-title { font-weight: 700; font-size: 1.05rem; margin-bottom: 10px; }
.cw-meta { display: flex; flex-wrap: wrap; gap: 10px 16px; font-size: 0.9rem; color: var(--text-soft); margin-bottom: 10px; }
.cw-label { font-size: 0.75rem; text-transform: uppercase; letter-spacing: 0.06em; color: var(--text-muted); margin-bottom: 4px; }
.cw-prose { font-size: 0.95rem; line-height: 1.55; color: var(--text-soft); white-space: pre-wrap; }
.cw-p { margin: 0 0 8px; line-height: 1.5; color: var(--text-soft); }
.cw-muted { color: var(--text-muted); font-size: 0.92rem; }
.cw-progress { margin-top: 12px; font-weight: 600; color: var(--text); }
.cw-actions { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 16px; }
.cw-secondary { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 14px; }
.cw-video-btn { margin-top: 12px; display: inline-block; }
.cw-block { margin-top: 12px; }
.cw-modal { position: fixed; inset: 0; z-index: 13050; background: rgba(10, 14, 30, 0.55); display: flex; align-items: flex-start; justify-content: center; padding: 24px 16px; overflow-y: auto; }
.cw-modal[hidden] { display: none !important; }
.cw-modal-card { background: var(--surface); border: 1px solid var(--border); border-radius: 18px; max-width: 640px; width: 100%; padding: 20px; margin-top: 40px; box-shadow: var(--card-shadow-lg); }
.cw-modal-head { display: flex; justify-content: space-between; align-items: center; gap: 12px; margin-bottom: 12px; }
.cw-modal-body { max-height: min(70vh, 560px); overflow-y: auto; font-size: 0.95rem; }

/* Google branded button */
.google-signin-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    border: 1px solid var(--border-strong);
    background: #ffffff;
    color: #1f1f1f;
    font-weight: 600;
}
.google-signin-btn:hover {
    background: #f8f9fa;
}
.google-signin-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
}
html[data-theme="dark"] .google-signin-btn {
    background: #ffffff;
    color: #1f1f1f;
}

/* Client workspace shell (separate layout from trainer dashboard_base) */
.client-app-body {
    min-height: 100vh;
    min-height: 100dvh;
    display: flex;
    flex-direction: column;
}
main.dashboard-page {
    flex: 1 1 auto;
    min-width: 0;
}
.client-app-badge {
    display: inline-block;
    margin-left: 8px;
    padding: 2px 8px;
    font-size: 0.68rem;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    border-radius: 8px;
    background: var(--primary-soft);
    color: var(--primary);
    vertical-align: middle;
}
.client-app-shell {
    display: grid;
    grid-template-columns: 260px 1fr;
    gap: 24px;
    padding-top: 8px;
    padding-bottom: 32px;
    align-items: start;
}
.client-app-sidebar {
    background: var(--surface);
    border: 1px solid var(--border);
    border-radius: 14px;
    padding: 10px;
    box-shadow: var(--card-shadow);
}
.client-sidebar-brand {
    font-weight: 800;
    font-size: 0.72rem;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    color: var(--text-muted);
    margin-bottom: 8px;
}
.client-sidebar-user {
    padding: 9px 10px;
    background: var(--surface-2);
    border-radius: 10px;
    margin-bottom: 10px;
}
.client-sidebar-user-name { font-weight: 700; font-size: 0.89rem; line-height: 1.2; }
.client-sidebar-user-meta { margin-top: 2px; color: var(--text-muted); font-size: 0.79rem; line-height: 1.2; }
.client-sidebar-user-role {
    margin-top: 4px;
    font-size: 0.64rem;
    font-weight: 800;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: var(--primary);
    line-height: 1.2;
}
.client-sidebar-nav { display: grid; gap: 2px; }
/* Wrappers for mobile drawer empty-section logic; `contents` keeps desktop grid layout unchanged */
.client-sidebar-nav-group {
    display: contents;
}
.client-sidebar-nav a {
    display: flex;
    align-items: center;
    justify-content: flex-start;
    box-sizing: border-box;
    width: 100%;
    min-height: 50px;
    margin: 0 !important;
    padding: 6px 8px;
    border-radius: 9px;
    color: var(--text-soft);
    font-weight: 600;
    font-size: 0.84rem;
    line-height: 1.2;
    border: 1px solid transparent;
    transition: background-color .15s ease, border-color .15s ease, box-shadow .15s ease, color .15s ease;
}
.client-sidebar-nav a:hover,
.client-sidebar-nav a.active {
    background: color-mix(in srgb, var(--primary-soft) 75%, transparent);
    border-color: color-mix(in srgb, var(--primary) 28%, var(--border));
    color: var(--primary);
    box-shadow: 0 0 0 1px color-mix(in srgb, var(--primary) 14%, transparent);
}
.client-sidebar-nav-section {
    margin: 6px 6px 2px;
    font-size: 0.66rem;
    font-weight: 800;
    letter-spacing: 0.06em;
}
.client-app-sidebar .sidebar-footer-row a {
    padding: 3px 6px;
    border-radius: 8px;
    font-size: 0.77rem;
}
.client-app-sidebar .theme-toggle--sidebar {
    width: 1.9rem;
    height: 1.9rem;
}
.client-app-sidebar .sidebar-footer .btn.btn-block {
    min-height: 34px;
    padding: 7px 10px;
    font-size: 0.83rem;
    border-radius: 10px;
}
.client-app-main { min-width: 0; }

/* Client PWA: fixed bottom tab bar (mobile only) */
.mobile-bottom-nav {
    position: fixed;
    bottom: 0;
    left: 0;
    right: 0;
    height: var(--mobile-bottom-nav-height);
    padding: 8px 4px env(safe-area-inset-bottom, 0px);
    box-sizing: border-box;
    display: none;
    justify-content: space-around;
    align-items: center;
    background: color-mix(in srgb, var(--surface) 88%, rgba(10, 12, 26, 0.65));
    backdrop-filter: blur(18px);
    -webkit-backdrop-filter: blur(18px);
    border-top: 1px solid var(--border);
    z-index: 9999;
}
.bottom-nav-item {
    flex: 1;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 4px;
    max-width: 120px;
    text-decoration: none;
    font-size: 12px;
    font-weight: 500;
    line-height: 1.15;
    transition: color 0.22s ease, transform 0.22s ease, filter 0.22s ease;
    -webkit-tap-highlight-color: transparent;
}
.bottom-nav-item:not(.active) {
    color: color-mix(in srgb, var(--text) 58%, var(--text-muted));
}
.bottom-nav-item .bottom-nav-icon,
.bottom-nav-item .lucide-svg {
    width: 22px;
    height: 22px;
    flex-shrink: 0;
    display: block;
}
.bottom-nav-item .lucide-svg {
    stroke-width: 2;
    vector-effect: non-scaling-stroke;
}
html[data-theme="dark"] .mobile-bottom-nav .bottom-nav-item:not(.active) {
    color: rgba(255, 255, 255, 0.8);
}
html[data-theme="dark"] .mobile-bottom-nav .bottom-nav-item:not(.active) .lucide-svg {
    color: rgba(255, 255, 255, 0.8);
}
html[data-theme="dark"] .mobile-bottom-nav .bottom-nav-item.active {
    color: #ffffff;
}
html[data-theme="dark"] .mobile-bottom-nav .bottom-nav-item.active .label {
    color: #ffffff;
}
html[data-theme="dark"] .mobile-bottom-nav .bottom-nav-item.active .lucide-svg {
    color: #9b7cff;
    filter: drop-shadow(0 0 8px rgba(155, 124, 255, 0.35));
}
html[data-theme="light"] .mobile-bottom-nav .bottom-nav-item.active .lucide-svg {
    color: var(--primary-2);
    filter: drop-shadow(0 0 6px rgba(123, 140, 255, 0.28));
}
.bottom-nav-item.active {
    color: var(--primary-2);
}
.bottom-nav-item.active .lucide-svg {
    transform: translateY(-1px);
}
.bottom-nav-item:hover {
    color: var(--primary);
}
/* Lucide: shared */
.lucide-svg {
    flex-shrink: 0;
    display: block;
    color: currentColor;
}
.btn-icon-only {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 8px 10px;
    line-height: 0;
}
.btn-icon-only .lucide-svg {
    width: 18px;
    height: 18px;
}
.btn-with-lucide {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
}
.btn-with-lucide .lucide-svg {
    width: 18px;
    height: 18px;
    flex-shrink: 0;
}
.label-with-lucide,
.h3-with-lucide {
    display: inline-flex;
    align-items: center;
    gap: 8px;
}
.label-with-lucide .lucide-svg,
.h3-with-lucide .lucide-svg {
    width: 16px;
    height: 16px;
    flex-shrink: 0;
}
.h3-with-lucide .lucide-svg {
    width: 20px;
    height: 20px;
}
.measurements-weight-warn {
    display: none;
    align-items: flex-start;
    gap: 8px;
}
.measurements-weight-warn .lucide-svg {
    width: 16px;
    height: 16px;
    flex-shrink: 0;
    margin-top: 2px;
}
.summary-with-lucide {
    cursor: pointer;
    list-style: none;
    display: flex;
    align-items: center;
    gap: 8px;
}
.summary-with-lucide::-webkit-details-marker {
    display: none;
}
.measurements-advanced[open] .lucide-summary-chevron {
    transform: rotate(90deg);
}
.lucide-summary-chevron {
    transition: transform 0.15s ease;
}
.smart-scan-success-card__badge {
    display: inline-flex;
    align-items: center;
    gap: 8px;
}
.smart-scan-success-card__badge .lucide-svg {
    width: 18px;
    height: 18px;
    flex-shrink: 0;
}
.smart-scan-mobile-sticky-cta .btn-with-lucide {
    flex: 1 1 auto;
    min-width: 0;
}
.nutrition-history-badge {
    display: inline-flex;
    align-items: center;
    gap: 6px;
}
.nutrition-history-badge .lucide-svg {
    width: 14px;
    height: 14px;
    flex-shrink: 0;
}
.nutrition-history-badge--active .lucide-svg {
    color: #9b7cff;
}
.nutrition-history-badge--archive .lucide-svg {
    color: rgba(255, 255, 255, 0.45);
}
html[data-theme="light"] .nutrition-history-badge--archive .lucide-svg {
    color: rgba(15, 23, 42, 0.35);
}
.pwa-ios-browser-hint__dismiss {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 4px;
    line-height: 0;
}
.pwa-ios-browser-hint__dismiss .lucide-svg {
    width: 18px;
    height: 18px;
}
.burger-btn .lucide-svg,
.sidebar-close .lucide-svg {
    width: 22px;
    height: 22px;
    stroke-width: 2;
    margin: 0 auto;
}
.theme-toggle-svgs {
    position: relative;
    width: 1.35rem;
    height: 1.35rem;
    display: inline-flex;
    align-items: center;
    justify-content: center;
}
.theme-toggle-svg {
    position: absolute;
    inset: 0;
    display: flex;
    align-items: center;
    justify-content: center;
}
.theme-toggle-svg .lucide-svg {
    width: 18px;
    height: 18px;
    stroke-width: 2;
}
html[data-theme="dark"] .theme-toggle-svg--moon {
    visibility: hidden;
}
html[data-theme="dark"] .theme-toggle-svg--sun {
    visibility: visible;
}
html[data-theme="light"] .theme-toggle-svg--moon {
    visibility: visible;
}
html[data-theme="light"] .theme-toggle-svg--sun {
    visibility: hidden;
}
.theme-toggle--sidebar .theme-toggle-svgs {
    width: 1.2rem;
    height: 1.2rem;
}
.theme-toggle--sidebar .theme-toggle-svg .lucide-svg {
    width: 16px;
    height: 16px;
}
.client-sidebar-nav a,
.sidebar-nav a {
    display: flex;
    align-items: center;
    gap: 10px;
}
.client-sidebar-nav a .lucide-svg,
.sidebar-nav a .lucide-svg {
    width: 20px;
    height: 20px;
    stroke-width: 2;
    flex-shrink: 0;
    color: currentColor;
    opacity: 0.85;
}
.client-sidebar-nav a.active .lucide-svg,
.sidebar-nav a.active .lucide-svg {
    opacity: 1;
    color: var(--primary);
}
.trainer-sidebar-label-mobile { display: none; }
.trainer-sidebar-settings-text {
    display: flex;
    flex-direction: column;
    gap: 0;
    min-width: 0;
    line-height: 1.25;
}
@media (max-width: 899px) {
    html,
    body {
        min-height: 100vh;
        min-height: 100dvh;
    }
    body {
        overflow-x: hidden;
    }
    body:has(.mobile-bottom-nav) main.dashboard-page {
        display: flex;
        flex-direction: column;
        flex: 1 1 auto;
        min-height: 0;
    }
    body:has(.mobile-bottom-nav) .client-app-shell,
    body:has(.mobile-bottom-nav) .dashboard-shell {
        flex: 1 1 auto;
        min-height: 100vh;
        min-height: 100dvh;
        padding-bottom: 0;
    }
    .site-header {
        padding-top: env(safe-area-inset-top, 0px);
    }
    .header-inner {
        min-height: var(--mobile-header-height);
        padding-top: 0;
        padding-bottom: 0;
        flex-direction: row;
        justify-content: space-between;
        align-items: center;
    }
    .burger-btn {
        display: inline-flex;
    }
    .avatar-btn {
        display: inline-flex;
        align-items: center;
        justify-content: center;
    }
    .nav-desktop {
        display: none;
    }
    .burger-btn,
    .avatar-btn {
        min-width: 48px;
        min-height: 48px;
        flex-shrink: 0;
        z-index: 9100;
    }
    .brand,
    .header-left .brand {
        min-height: 64px;
        display: inline-flex;
        align-items: center;
    }
    .header-inner--auth .brand {
        min-height: 0;
    }
    .header-app-bar .brand,
    .header-app-bar .app-mobile-header-logo .brand {
        min-height: 0;
    }
    .mobile-bottom-nav {
        display: flex;
        position: fixed;
        left: 0;
        right: 0;
        bottom: 0;
        height: var(--mobile-bottom-nav-height);
        padding-bottom: env(safe-area-inset-bottom, 0px);
        z-index: 9999;
    }
    /* Scroll column: min slot minus tab bar; padding clears fixed nav + safe area */
    body:has(.mobile-bottom-nav) .main-content,
    body:has(.mobile-bottom-nav) .dashboard-content,
    body:has(.mobile-bottom-nav) .client-app-main,
    body:has(.mobile-bottom-nav) .page-content {
        min-height: calc(100dvh - var(--mobile-bottom-nav-height));
        padding-bottom: calc(
            var(--bottom-nav-height, var(--mobile-bottom-nav-height)) +
                var(--mobile-bottom-content-inset) +
                var(--mobile-smart-scan-sticky-extra) +
                env(safe-area-inset-bottom, 0px)
        );
    }
    /* Modal scroll: last control stays above home indicator; overlay stacks above bottom nav (z-index). */
    body:has(.mobile-bottom-nav) .app-modal-card,
    body:has(.mobile-bottom-nav) .selfw-modal-card {
        scroll-padding-bottom: calc(12px + env(safe-area-inset-bottom, 0px));
    }
    /* Optional: last form row / CTA strip — main column already has nav padding; add only light tail + safe area. */
    body:has(.mobile-bottom-nav) .form-actions-bottom {
        padding-bottom: max(12px, env(safe-area-inset-bottom, 0px));
        scroll-margin-bottom: 24px;
    }
    body:has(.mobile-bottom-nav) footer.site-footer.client-app-site-footer {
        margin-bottom: calc(
            var(--mobile-bottom-nav-height) + env(safe-area-inset-bottom, 0px)
        );
    }
    body:has(.mobile-bottom-nav):has(.smart-scan-mobile-sticky-cta) {
        --mobile-smart-scan-sticky-extra: 68px;
    }
    /* Remove default large bottom padding on <main> — scroll inset lives on .main-content */
    body:has(.mobile-bottom-nav) .dashboard-page {
        padding-bottom: 0;
    }
    /* Rare layouts without .main-content */
    body:has(.mobile-bottom-nav) .dashboard-page:not(:has(.main-content)) {
        min-height: calc(100dvh - var(--mobile-bottom-nav-height));
        padding-bottom: calc(
            var(--bottom-nav-height, var(--mobile-bottom-nav-height)) +
                var(--mobile-bottom-content-inset) +
                var(--mobile-smart-scan-sticky-extra) +
                env(safe-area-inset-bottom, 0px)
        );
    }
    .client-sidebar-nav a.sidebar-link--in-mobile-bottom-nav {
        display: none !important;
    }
    /* Mobile drawer: header avatar opens profile — hide duplicate Profile row (self account group). */
    body:has(.mobile-bottom-nav) .client-sidebar-nav a.client-sidebar-nav-profile-link {
        display: none !important;
    }
    /* Mobile drawer: "Main" links are in bottom nav — hide empty section + links as a unit */
    body:has(.mobile-bottom-nav) .client-sidebar-nav-group--main:not(:has(a:not(.sidebar-link--in-mobile-bottom-nav))) {
        display: none !important;
    }
    /* Mobile drawer: trainer sidebar "Account" was only Profile — hide heading + row (Settings/Alerts stay in compact row). */
    body:has(.mobile-bottom-nav) .client-sidebar-nav-group--trainer-account-mobile-collapse {
        display: none !important;
    }
    /* Mobile drawer: hide Help section when it would show only an empty heading (no wiki / no support rows) */
    body:has(.mobile-bottom-nav) .client-sidebar-nav-group--help:not(:has(a)) {
        display: none !important;
    }
    #trainer-sidebar .trainer-sidebar-label-desktop {
        display: none !important;
    }
    #trainer-sidebar .trainer-sidebar-label-mobile {
        display: inline !important;
    }

    /*
     * Drawer overlay (≤899px): same breakpoint as mobile bottom nav.
     * Overrides .sidebar { position: static } from max-width:1080px when both apply.
     * Scroll the whole panel; nav + footer stack without flex-grow gap.
     */
    .sidebar,
    .client-app-sidebar {
        display: none;
        position: fixed;
        inset: 0 auto 0 0;
        box-sizing: border-box;
        width: min(85vw, 300px);
        max-width: 300px;
        height: 100dvh;
        max-height: 100dvh;
        z-index: 40;
        overflow-x: hidden;
        overflow-y: auto;
        -webkit-overflow-scrolling: touch;
        overscroll-behavior: contain;
        touch-action: pan-y;
        box-shadow: 0 24px 60px rgba(0, 0, 0, 0.45);
        padding-top: max(10px, env(safe-area-inset-top, 0px));
        padding-bottom: max(12px, env(safe-area-inset-bottom, 0px));
        border-radius: 0 18px 18px 0;
    }
    .sidebar.is-open,
    .client-app-sidebar.is-open {
        display: flex;
        flex-direction: column;
        align-content: stretch;
    }
    body.sidebar-open {
        overflow: hidden;
    }
    .sidebar-close {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        position: static;
        top: auto;
        flex: 0 0 auto;
    }
    .sidebar .sidebar-nav {
        margin-bottom: 0;
    }
    .sidebar-nav,
    .client-sidebar-nav {
        flex: 0 0 auto;
        min-height: 0;
        overflow: visible;
        padding-bottom: 0;
    }
    .sidebar .sidebar-footer,
    .client-app-sidebar .sidebar-footer {
        flex: 0 0 auto;
        margin-top: 0;
        background: var(--surface);
        padding-top: 6px;
        padding-bottom: calc(10px + env(safe-area-inset-bottom, 0px));
        border-top: 1px solid var(--border);
    }
    body:has(.mobile-bottom-nav) .sidebar,
    body:has(.mobile-bottom-nav) .client-app-sidebar {
        padding-bottom: calc(
            var(--mobile-bottom-nav-height) + 12px + env(safe-area-inset-bottom, 0px)
        );
    }
    body:has(.mobile-bottom-nav) .mobile-menu-bottom-spacer {
        display: none !important;
        height: 0 !important;
        flex: 0 0 0 !important;
    }
}
@media (min-width: 900px) {
    .mobile-bottom-nav {
        display: none !important;
    }
}

.client-app-site-footer .footer-inner { justify-content: center; }
.client-app-site-footer .footer-brand,
.client-app-site-footer .footer-text { display: none; }

/* Client daily flow dashboard */
.client-daily-shell { max-width: 720px; margin: 0 auto; }
.workspace-day-nav-wrap { padding: 12px 14px; }
.workspace-day-order-box {
    margin-top: 14px;
    padding-top: 14px;
    border-top: 1px solid var(--border);
}
.workspace-day-order-box .hero-actions {
    flex-wrap: wrap;
    gap: 8px;
}
.workspace-day-nav-toolbar {
    margin-bottom: 10px;
}
.workspace-day-nav-paginate {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
}
.workspace-day-nav-paginate > .btn {
    min-width: 48px;
}
.workspace-day-nav-spacer {
    visibility: hidden;
    pointer-events: none;
}
.workspace-day-reorder-inline {
    display: flex;
    gap: 6px;
    align-items: center;
    flex-shrink: 0;
}
.workspace-day-reorder-inline form {
    margin: 0;
}
.workspace-day-reorder-btn {
    min-width: 44px;
    padding: 8px 10px;
    font-size: 1.05rem;
    font-weight: 800;
    line-height: 1;
}
.workspace-day-nav-hint {
    margin: 10px 0 0;
    font-size: 0.78rem;
    opacity: 0.92;
}
/* Legacy layout: prev/next only (trainer day view, client program copy) */
.workspace-day-switch-arrows {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    margin-bottom: 10px;
}
.workspace-day-switch-arrows .btn {
    min-width: 48px;
}
.workspace-day-nav {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    overflow-x: auto;
    padding-bottom: 2px;
    -webkit-overflow-scrolling: touch;
}
.workspace-day-nav__tab {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 8px 12px;
    border-radius: 12px;
    border: 1px solid var(--border-strong);
    background: var(--surface);
    color: var(--text-soft);
    font-weight: 700;
    font-size: 0.84rem;
    white-space: nowrap;
    flex-shrink: 0;
    transition: background-color .15s ease, border-color .15s ease, color .15s ease;
}
.workspace-day-nav__tab:hover {
    border-color: var(--primary);
    color: var(--primary);
    background: var(--primary-soft);
}
.workspace-day-nav__tab.is-active {
    border-color: color-mix(in srgb, var(--primary) 42%, var(--border-strong));
    background: color-mix(in srgb, var(--primary-soft) 80%, var(--surface));
    color: var(--primary);
}
html[data-theme="dark"] .workspace-day-nav__tab.is-active {
    border-color: rgba(155, 145, 255, 0.42);
    background: rgba(123, 140, 255, 0.12);
    color: #e8ecff;
}
.client-daily-cards { display: grid; gap: 16px; }
.client-daily-card--dense {
    padding: 14px 16px 16px;
}
.client-daily-card__h {
    margin: 0 0 10px;
    font-size: 1rem;
    font-weight: 700;
    letter-spacing: -0.01em;
}
.client-daily-card--dense .client-dash-card-title {
    margin: 0 0 6px;
    font-size: 1.02rem;
    font-weight: 700;
    letter-spacing: -0.01em;
}
.client-dash-card-meta {
    margin: 0 0 4px;
    font-size: 0.72rem;
    font-weight: 700;
    letter-spacing: 0.05em;
    text-transform: uppercase;
    color: var(--text-muted);
}
.client-dash-card-excerpt {
    margin: 0 0 10px;
    font-size: 0.86rem;
    line-height: 1.35;
    color: var(--text-soft);
}
.client-dash-card-actions {
    display: flex;
    align-items: center;
    justify-content: flex-start;
    flex-wrap: wrap;
    gap: 8px;
    margin-top: 4px;
}
.client-dash-card-actions .btn {
    min-height: 40px;
    padding-left: 14px;
    padding-right: 14px;
}
.client-dash-activity-strip {
    margin-top: 14px;
    padding: 12px 14px;
    border-radius: 14px;
    border: 1px solid var(--border);
    background: color-mix(in srgb, var(--surface-2) 88%, var(--surface));
}
.client-dash-activity-strip__grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 8px 10px;
}
.client-dash-activity-tile {
    min-width: 0;
}
.client-dash-activity-tile__value {
    font-size: 1.05rem;
    font-weight: 800;
    letter-spacing: -0.02em;
    line-height: 1.15;
}
.client-dash-activity-tile__label {
    margin-bottom: 2px;
    font-size: 0.68rem;
    font-weight: 700;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    color: var(--text-muted);
}
.client-dash-activity-tile__hint {
    margin-top: 2px;
    font-size: 0.7rem;
    color: var(--text-soft);
    line-height: 1.25;
}
.client-dash-activity-foot {
    margin-top: 8px;
    font-size: 0.74rem;
    color: var(--text-soft);
}
@media (max-width: 420px) {
    .client-dash-activity-strip__grid {
        grid-template-columns: 1fr;
    }
}
.client-today-mode--trainer-soft {
    font-size: 0.82rem;
    font-weight: 600;
    color: var(--text-muted);
}
.client-today-mode--trainer-soft .client-today-mode-icon .lucide-svg {
    width: 16px;
    height: 16px;
    opacity: 0.85;
}
.client-sidebar-compact-tools {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 4px 2px;
    margin: 2px 0 8px;
    padding: 0 4px;
    font-size: 0.74rem;
    font-weight: 600;
    color: var(--text-muted);
}
.client-sidebar-compact-tools a {
    color: var(--text-soft);
    text-decoration: none;
    padding: 2px 2px;
    border-radius: 6px;
}
.client-sidebar-compact-tools a:hover {
    color: var(--primary);
    background: color-mix(in srgb, var(--primary-soft) 55%, transparent);
}
.client-sidebar-compact-tools__sep,
.client-sidebar-compact-tools__dot {
    opacity: 0.45;
    padding: 0 2px;
}
.client-daily-card--self-today {
    padding: 14px 16px 16px;
}
.client-daily-card--self-today .status-title {
    font-size: 1.15rem;
    margin-bottom: 6px;
}
.client-daily-card--self-today .status-title--follow {
    margin-top: 10px;
}
.client-daily-card--self-today .status-sub--tight {
    margin-bottom: 10px;
    font-size: 0.88rem;
}
.client-daily-card--self-today .empty-text--tight {
    margin-top: 0;
    margin-bottom: 0;
}
.actions--self-tight {
    gap: 8px;
    margin-top: 4px;
}
.client-self-today-actions {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 8px;
    margin-top: 6px;
}
.client-self-today-actions .client-self-today-actions__primary {
    grid-column: 1 / -1;
}
.client-self-calendar-hint {
    margin: 10px 0 0;
    font-size: 0.82rem;
    text-align: center;
}
.client-self-calendar-hint a {
    color: var(--text-muted);
    font-weight: 600;
    text-decoration: none;
    border-bottom: 1px solid color-mix(in srgb, var(--text-muted) 35%, transparent);
}
.client-self-calendar-hint a:hover {
    color: var(--primary);
    border-bottom-color: color-mix(in srgb, var(--primary) 40%, transparent);
}
.client-today-trainer-note {
    margin: 6px 0 0;
    font-size: 0.8rem;
    font-weight: 600;
    color: var(--text-muted);
}
.client-self-scan-hero-card {
    margin-top: 2px;
}
.client-self-scan-hero__title {
    margin: 0 0 6px;
    font-size: 1.05rem;
    font-weight: 800;
    line-height: 1.25;
    letter-spacing: -0.02em;
}
.client-self-scan-hero__desc {
    margin: 0 0 10px;
    font-size: 0.84rem;
    line-height: 1.35;
    color: var(--text-soft);
}
.client-self-scan-hero__demo {
    margin: 0 0 12px;
    padding: 10px 10px 10px 12px;
    border-radius: 10px;
    border: 1px dashed color-mix(in srgb, var(--border) 80%, var(--primary));
    background: color-mix(in srgb, var(--surface-2) 90%, transparent);
    font-size: 0.78rem;
    line-height: 1.35;
    color: var(--text-soft);
}
.client-self-scan-hero__demo-row--photo {
    font-weight: 700;
    color: var(--text);
    margin-bottom: 4px;
}
.client-self-scan-hero__demo-row--ai {
    font-weight: 600;
    margin-bottom: 2px;
}
.client-self-scan-hero__demo-list {
    margin: 0 0 6px;
    padding-left: 1.1rem;
}
.client-self-scan-hero__demo-list li {
    margin: 1px 0;
}
.client-self-scan-hero__demo-row--result {
    font-weight: 600;
    color: color-mix(in srgb, var(--primary) 88%, var(--text));
}
.client-self-scan-hero__actions {
    display: flex;
    flex-direction: column;
    gap: 8px;
}
.client-self-scan-hero__actions .btn-self-scan-primary {
    order: -1;
}
.btn-self-scan-primary {
    display: inline-flex;
    width: 100%;
    justify-content: center;
    align-items: center;
    min-height: 48px;
    padding: 0 16px;
    font-weight: 800;
    font-size: 0.92rem;
    border: none;
    border-radius: 12px;
    color: #fff !important;
    text-decoration: none;
    background: linear-gradient(
        135deg,
        color-mix(in srgb, var(--primary) 88%, #1a1030),
        color-mix(in srgb, var(--primary-2, var(--primary)) 95%, #0a1628)
    );
    box-shadow: 0 10px 26px color-mix(in srgb, var(--primary) 32%, transparent);
}
.btn-self-scan-primary:hover {
    filter: brightness(1.05);
    color: #fff !important;
}
.btn-self-scan-secondary {
    width: 100%;
    justify-content: center;
    min-height: 44px;
    font-weight: 700;
}
.client-self-scan-hero__tertiary {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: center;
    gap: 6px 10px;
    margin-top: 12px;
    font-size: 0.78rem;
    font-weight: 600;
}
.client-self-scan-hero__tertiary a {
    color: var(--text-muted);
    text-decoration: none;
    border-bottom: 1px solid color-mix(in srgb, var(--text-muted) 35%, transparent);
    padding-bottom: 1px;
}
.client-self-scan-hero__tertiary a:hover {
    color: var(--primary);
    border-bottom-color: color-mix(in srgb, var(--primary) 45%, transparent);
}
.client-self-scan-hero__tertiary-dot {
    opacity: 0.45;
    user-select: none;
}
.client-dash-workout-meta {
    margin: 4px 0 10px;
    font-size: 0.82rem;
    font-weight: 600;
    color: var(--text-muted);
}
.client-dash-card-chips {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    margin: 0 0 8px;
}
.client-dash-card-chip {
    display: inline-flex;
    align-items: center;
    max-width: 100%;
    padding: 4px 8px;
    border-radius: 999px;
    font-size: 0.72rem;
    font-weight: 700;
    line-height: 1.2;
    color: var(--text);
    background: color-mix(in srgb, var(--surface-2) 88%, var(--primary-soft));
    border: 1px solid color-mix(in srgb, var(--border) 70%, var(--primary));
}
.client-dash-card-excerpt--clamp {
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 3;
    overflow: hidden;
    margin-bottom: 8px;
}
.sidebar-footer-row--lang {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    flex-wrap: wrap;
}
.sidebar-lang-seg {
    display: inline-flex;
    border-radius: 9px;
    border: 1px solid var(--border);
    overflow: hidden;
    background: var(--surface-2);
}
.sidebar-lang-seg__btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 2.1rem;
    padding: 5px 8px;
    font-size: 0.68rem;
    font-weight: 800;
    letter-spacing: 0.04em;
    color: var(--text-muted);
    text-decoration: none;
    border-right: 1px solid var(--border);
}
.sidebar-lang-seg__btn:last-child {
    border-right: 0;
}
.sidebar-lang-seg__btn:hover {
    color: var(--text);
    background: color-mix(in srgb, var(--primary-soft) 50%, transparent);
}
.sidebar-lang-seg__btn.is-active {
    color: var(--primary);
    background: color-mix(in srgb, var(--primary-soft) 70%, var(--surface));
}
.client-sidebar-telegram-link .client-sidebar-telegram-ico {
    display: inline-flex;
    margin-right: 6px;
    font-size: 0.95rem;
    transform: rotate(-35deg);
    opacity: 0.85;
}
.client-today-hero {
    margin-bottom: 10px;
}
.client-today-hero-top {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 8px 10px;
}
.client-today-badge {
    display: inline-flex;
    padding: 5px 12px;
    border-radius: 999px;
    background: color-mix(in srgb, var(--primary) 16%, var(--surface-2));
    color: var(--primary);
    font-weight: 700;
    font-size: 0.78rem;
    letter-spacing: 0.02em;
}
.client-today-mode {
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: 0.95rem;
    font-weight: 600;
    color: var(--text-soft);
}
.client-today-mode--trainer {
    color: color-mix(in srgb, var(--primary) 82%, var(--text-soft));
}
.client-today-mode-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
}
.client-today-mode-icon .lucide-svg {
    width: 18px;
    height: 18px;
}
.client-self-account-pill {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    padding: 3px 9px 3px 6px;
    border-radius: 999px;
    font-size: 0.68rem;
    font-weight: 700;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    color: var(--text-muted);
    background: var(--surface-2);
    border: 1px solid var(--border);
}
.client-self-account-pill__icon {
    display: inline-flex;
    opacity: 0.75;
}
.client-self-account-pill__icon .lucide-svg {
    width: 14px;
    height: 14px;
}
.client-today-progress {
    height: 5px;
    background: color-mix(in srgb, var(--border) 65%, transparent);
    border-radius: 999px;
    margin-top: 4px;
    margin-bottom: 6px;
    overflow: hidden;
}
.client-today-progress .today-progress-bar {
    height: 100%;
    border-radius: inherit;
    transition: width 0.3s ease;
    background: linear-gradient(90deg, var(--primary-2), var(--primary));
}
.client-app-sidebar--self .client-sidebar-brand {
    margin-bottom: 5px;
}
.client-app-sidebar--self .client-sidebar-user {
    padding: 7px 8px;
    margin-bottom: 6px;
    border-radius: 9px;
}
.client-app-sidebar--self .client-sidebar-user-role {
    margin-top: 2px;
    font-size: 0.6rem;
}
.client-app-sidebar--self .client-sidebar-user-meta {
    font-size: 0.72rem;
}
.client-app-sidebar--self .client-sidebar-nav-section {
    margin: 4px 4px 2px;
    font-size: 0.62rem;
}
.client-app-sidebar--self .client-sidebar-nav {
    gap: 1px;
}
.client-app-sidebar--self .client-sidebar-nav a {
    min-height: 44px;
    padding: 5px 8px;
    font-size: 0.8rem;
    border-radius: 8px;
}
@media (max-width: 420px) {
    .client-self-today-actions {
        grid-template-columns: 1fr;
    }
}
.client-daily-card .btn { min-height: 44px; }
.client-daily-card .btn.dashboard-card-cta { justify-content: center; }
.small-label {
    font-size: 14px;
    opacity: 0.7;
    margin-bottom: 10px;
}
.today-card h2 {
    margin: 0 0 12px;
    font-size: 1.4rem;
    letter-spacing: -0.02em;
}
.status-title {
    font-size: 20px;
    font-weight: 600;
    margin-bottom: 8px;
}
.status-sub {
    opacity: 0.7;
    margin-bottom: 16px;
}
.actions {
    display: flex;
    flex-direction: column;
    gap: 10px;
}
.secondary-nav {
    margin-top: 14px;
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
}
.secondary-nav .btn {
    flex: 1 1 180px;
}
.dashboard-card-actions {
    margin-top: 12px;
    gap: 10px;
}
.self-schedule-tabs .btn {
    flex: 1 1 170px;
}
.self-schedule-tabs .self-schedule-tab--current {
    border-color: color-mix(in srgb, var(--primary) 45%, var(--border));
    color: var(--text);
    font-weight: 700;
}
.self-schedule-tabs--sticky {
    position: sticky;
    top: 0;
    z-index: 24;
    padding: 10px 0 12px;
    margin-top: -4px;
    background: color-mix(in srgb, var(--surface) 94%, transparent);
    border-bottom: 1px solid var(--border);
    backdrop-filter: blur(12px);
    -webkit-backdrop-filter: blur(12px);
}

@media (max-width: 900px) {
    .client-app-shell { grid-template-columns: 1fr; }
    .metrics-grid,
    .workout-add-row {
        grid-template-columns: 1fr;
    }
    .measurements-kpi-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 768px) {
    .dashboard-switcher {
        display: grid;
        grid-template-columns: 1fr;
        gap: 8px;
    }
    .dashboard-switcher .btn {
        width: 100%;
    }
    .media-filter-tabs {
        display: flex;
        grid-template-columns: none;
        gap: 8px;
    }
    .media-filter-tabs .media-filter-chip {
        width: auto;
    }
    .self-schedule-tabs {
        gap: 8px;
    }
    .secondary-nav {
        display: grid;
        grid-template-columns: 1fr;
    }
    .self-schedule-tabs .btn,
    .dashboard-card-actions .btn,
    .actions .btn {
        width: 100%;
    }
    .measurements-kpi-grid,
    .measurements-entry-grid {
        grid-template-columns: 1fr;
    }
    .goal-progress-meta {
        flex-direction: column;
        align-items: flex-start;
    }
}

/* Wiki / help — accordion like Seaman Guide (expand per topic) */
.fithub-wiki {
    max-width: 720px;
}
.fithub-wiki__item {
    border: 1px solid var(--border-strong);
    border-radius: 14px;
    margin-bottom: 10px;
    background: var(--surface);
    overflow: hidden;
}
.fithub-wiki__item:last-child {
    margin-bottom: 0;
}
.fithub-wiki__summary {
    cursor: pointer;
    list-style: none;
    padding: 14px 16px;
    padding-right: 44px;
    font-weight: 600;
    font-size: 1rem;
    line-height: 1.35;
    color: var(--text);
    position: relative;
    user-select: none;
    -webkit-tap-highlight-color: transparent;
}
.fithub-wiki__summary::-webkit-details-marker {
    display: none;
}
.fithub-wiki__summary::after {
    content: "+";
    position: absolute;
    right: 14px;
    top: 50%;
    transform: translateY(-50%);
    font-size: 1.35rem;
    font-weight: 500;
    line-height: 1;
    color: var(--primary);
    opacity: 0.95;
}
.fithub-wiki__item[open] .fithub-wiki__summary::after {
    content: "−";
}
.fithub-wiki__summary:hover {
    background: var(--surface-2);
}
.fithub-wiki__body {
    padding: 0 16px 16px;
}
.fithub-wiki__body-gap {
    margin-top: 12px;
}
.fithub-wiki__list {
    margin: 0;
    padding-left: 1.15rem;
    line-height: 1.55;
    color: var(--text-soft);
}
.fithub-wiki__list li {
    margin-bottom: 10px;
}
.fithub-wiki__list li:last-child {
    margin-bottom: 0;
}

/* Nutrition: help block should look informational, not actionable CTA */
.nutrition-help-disclosure {
    margin: 0 0 16px;
}
.nutrition-help-summary {
    cursor: pointer;
    list-style: none;
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 0;
    font-size: 0.9rem;
    font-weight: 600;
    color: var(--primary);
    text-decoration: underline;
    text-underline-offset: 2px;
}
.nutrition-help-summary::-webkit-details-marker {
    display: none;
}
.nutrition-help-summary--lucide .lucide-svg {
    width: 18px;
    height: 18px;
    flex-shrink: 0;
}
.nutrition-help-body {
    padding: 8px 0 0;
}
.nutrition-help-body .dashboard-subtext {
    margin: 0 0 8px;
}
.nutrition-help-body .dashboard-subtext:last-child {
    margin-bottom: 0;
}
.nutrition-help-disclosure--subtle {
    margin: 0 0 12px;
}
.nutrition-help-summary--subtle {
    font-size: 0.78rem;
    font-weight: 600;
    color: var(--text-muted);
    text-decoration: none;
    gap: 5px;
}
.nutrition-help-summary--subtle:hover {
    color: var(--text-soft);
}
.nutrition-help-disclosure--subtle .nutrition-help-body {
    padding-top: 6px;
}
.nutrition-help-disclosure--subtle .nutrition-help-body .dashboard-subtext {
    font-size: 0.86rem;
    color: var(--text-muted);
}
.nutrition-empty-current__lead {
    font-weight: 600;
    margin: 0 0 6px;
    color: var(--text-soft);
}
.nutrition-empty-current__actions {
    margin-top: 4px;
}
.nutrition-archive-empty--soft {
    font-size: 0.86rem;
    color: var(--text-muted);
    margin: 0;
    padding: 6px 0 2px;
}
.nutrition-history-disclosure--empty .nutrition-history-disclosure__body {
    padding-bottom: 10px;
}
.nutrition-form-actions {
    align-items: center;
}
.nutrition-compact-stats {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 10px;
    margin-bottom: 12px;
}
.nutrition-stat-card {
    padding: 14px;
    border-radius: 14px;
}
.nutrition-stat-number {
    font-size: 1.35rem;
}
.nutrition-stat-label {
    margin-top: 4px;
    font-size: 0.82rem;
}
.nutrition-quick-actions .btn {
    min-height: 36px;
    padding: 8px 12px;
}
.nutrition-plan-preview {
    position: relative;
    max-height: 128px;
    overflow: hidden;
}
.nutrition-plan-preview:not(.is-open)::after {
    content: "";
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    height: 36px;
    background: linear-gradient(to bottom, rgba(255, 255, 255, 0), var(--surface-2));
}
.nutrition-plan-preview.is-open {
    max-height: none;
}
.nutrition-card-actions .btn {
    min-height: 34px;
    padding: 7px 11px;
    font-size: 0.86rem;
}
.nutrition-nav-tab {
    min-height: 32px;
    padding: 6px 12px;
    box-shadow: none !important;
}
.nutrition-nav-tab.btn-primary {
    background: var(--primary-soft);
    color: var(--primary);
    border-color: color-mix(in srgb, var(--primary) 45%, var(--border-strong));
    box-shadow: none !important;
    filter: none;
}
.nutrition-nav-tab.btn-outline {
    color: var(--text-muted);
    border-color: var(--border);
}
.nutrition-card-open-btn {
    min-height: 34px;
    padding: 7px 12px;
    font-size: 0.86rem;
}
.nutrition-action-danger {
    color: #dc2626;
}
.nutrition-history-badge--active {
    background: rgba(124, 58, 237, 0.18);
    color: #6d28d9;
}
.nutrition-history-badge--archive {
    background: rgba(148, 163, 184, 0.2);
    color: var(--text-muted);
}

.sr-only {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    border: 0;
    white-space: nowrap;
}

.nutrition-quick-actions-panel {
    margin-bottom: 12px;
}
.nutrition-trainer-hub__top .eyebrow {
    margin-bottom: 4px;
}
.nutrition-trainer-hub > .nutrition-trainer-hub__top.dashboard-top {
    margin-bottom: 10px;
}
.nutrition-trainer-hub__top h1 {
    margin: 0 0 6px;
    font-size: clamp(1.32rem, 4.2vw, 1.62rem);
    line-height: 1.18;
    letter-spacing: -0.02em;
}
.nutrition-trainer-hub__sub {
    margin: 0;
    font-size: 0.88rem;
    line-height: 1.35;
    max-width: 34rem;
}
.nutrition-trainer-hub__tabs.dashboard-switcher {
    margin-top: 6px;
    margin-bottom: 10px;
}
.nutrition-cta-strip {
    display: flex;
    flex-direction: column;
    align-items: stretch;
    gap: 6px;
    margin-bottom: 14px;
    padding: 0;
    border: none;
    background: transparent;
}
.nutrition-cta-strip__primary {
    width: 100%;
    justify-content: center;
    min-height: 46px;
    font-weight: 800;
}
.nutrition-cta-strip__secondary {
    align-self: center;
    font-size: 0.88rem;
    padding: 8px 12px;
    min-height: 40px;
    font-weight: 600;
}
.nutrition-plans-panel .nutrition-plans-panel-head {
    margin-bottom: 10px;
}
.nutrition-search-row--hub {
    margin-top: 14px;
    margin-bottom: 0;
    padding-top: 12px;
    border-top: 1px solid var(--border);
    background: transparent;
    gap: 8px;
}
.nutrition-search-row--hub input[type="search"] {
    padding: 8px 10px;
    font-size: 0.88rem;
    border-radius: 10px;
}
.nutrition-hub-stats-row {
    display: flex;
    flex-wrap: wrap;
    gap: 12px 22px;
    margin-top: 12px;
    padding-top: 10px;
    border-top: 1px solid color-mix(in srgb, var(--border) 88%, transparent);
}
.nutrition-hub-stat {
    display: flex;
    flex-direction: column;
    gap: 2px;
    min-width: 0;
}
.nutrition-hub-stat__value {
    font-size: 1.08rem;
    font-weight: 800;
    color: var(--text);
    line-height: 1.2;
}
.nutrition-hub-stat__label {
    font-size: 0.7rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    color: var(--text-muted);
}
.nutrition-assignments-empty-cta {
    margin-top: 8px;
    display: flex;
    justify-content: center;
}
@media (max-width: 480px) {
    .nutrition-hub-stats-row {
        gap: 10px 14px;
    }
    .nutrition-hub-stat__value {
        font-size: 1rem;
    }
}
.nutrition-plans-panel-head {
    display: flex;
    flex-wrap: wrap;
    align-items: baseline;
    justify-content: space-between;
    gap: 10px;
    margin-bottom: 12px;
}
.nutrition-plans-panel-head h3 {
    margin: 0;
}
.nutrition-plans-range,
.nutrition-hub-range {
    margin: 0;
    font-size: 0.86rem;
}
.nutrition-search-row {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    align-items: center;
    margin-bottom: 16px;
}
.nutrition-search-row input[type="search"] {
    flex: 1 1 200px;
    min-width: 0;
    border-radius: 12px;
    border: 1px solid var(--border);
    background: var(--surface-2);
    padding: 10px 12px;
    color: inherit;
    font-size: 0.95rem;
}
.nutrition-plan-card-grid {
    display: grid;
    gap: 12px;
    grid-template-columns: 1fr;
}
@media (min-width: 720px) {
    .nutrition-plan-card-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}
.nutrition-plan-card {
    position: relative;
    border-radius: 16px;
    border: 1px solid var(--border);
    background: var(--surface-2);
    transition: border-color 0.15s ease, background 0.15s ease, transform 0.12s ease;
}
.nutrition-plan-card:hover {
    border-color: color-mix(in srgb, var(--primary) 35%, var(--border));
    background: var(--surface);
}
.nutrition-plan-card-hit {
    display: block;
    text-decoration: none;
    color: inherit;
    padding: 16px 44px 16px 18px;
    border-radius: 16px;
}
.nutrition-plan-card-hit:active {
    transform: scale(0.995);
}
.nutrition-plan-card-menu {
    position: absolute;
    top: 8px;
    right: 8px;
    z-index: 4;
}
.nutrition-plan-card-menu-btn {
    list-style: none;
}
.nutrition-plan-card-menu .program-lib-quick-menu-body {
    right: 0;
    left: auto;
}
button.program-lib-quick-menu-item.nutrition-plan-card-menu-assign {
    width: 100%;
    text-align: left;
    cursor: pointer;
    font-family: inherit;
}
.nutrition-plan-card--link {
    display: block;
    text-decoration: none;
    color: inherit;
    border-radius: 16px;
    border: 1px solid var(--border);
    background: var(--surface-2);
    padding: 16px 18px;
    transition: border-color 0.15s ease, background 0.15s ease, transform 0.12s ease;
}
.nutrition-plan-card--link:hover {
    border-color: color-mix(in srgb, var(--primary) 35%, var(--border));
    background: var(--surface);
}
.nutrition-plan-card--link:active {
    transform: scale(0.995);
}
.nutrition-plan-card-top {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 10px;
}
.nutrition-plan-card-title {
    margin: 0;
    font-size: 1.05rem;
    font-weight: 700;
    letter-spacing: -0.02em;
    line-height: 1.3;
}
.nutrition-plan-card-chevron {
    flex-shrink: 0;
    color: var(--text-muted);
    margin-top: 2px;
}
.nutrition-plan-card-meta,
.nutrition-plan-card-dates {
    margin: 8px 0 0;
    font-size: 0.82rem;
    color: var(--text-muted);
}
.nutrition-plan-card-excerpt {
    margin: 10px 0 0;
    font-size: 0.9rem;
    line-height: 1.45;
    color: var(--text-soft);
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    overflow: hidden;
}
.nutrition-plan-card-excerpt--empty {
    opacity: 0.5;
}
.nutrition-load-more {
    margin-top: 14px;
}
.nutrition-plan-status-pill {
    display: inline-block;
    margin-top: 10px;
    font-size: 0.72rem;
    font-weight: 700;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    padding: 4px 10px;
    border-radius: 999px;
}
.nutrition-plan-status-pill--active {
    background: rgba(124, 58, 237, 0.16);
    color: #6d28d9;
}
.nutrition-plan-status-pill--archive {
    background: rgba(148, 163, 184, 0.2);
    color: var(--text-muted);
}
.nutrition-plan-status-pill--compact {
    margin: 0;
    margin-top: 0;
    font-size: 0.65rem;
    padding: 3px 8px;
    text-transform: none;
    letter-spacing: 0.02em;
}

/* Client nutrition hub: current plan hero + compact history */
.nutrition-current-section {
    margin-bottom: 20px;
}
.nutrition-history-section {
    margin-bottom: 8px;
}
.nutrition-section-heading {
    margin: 0 0 10px;
    font-size: 0.78rem;
    font-weight: 700;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    color: var(--text-muted);
}
.nutrition-current-hero {
    position: relative;
    border-radius: 20px;
    padding: 18px 18px 16px;
    overflow: hidden;
    border: 1px solid color-mix(in srgb, var(--primary) 42%, var(--border));
    background:
        radial-gradient(120% 90% at 10% 0%, color-mix(in srgb, var(--primary) 22%, transparent), transparent 55%),
        radial-gradient(90% 70% at 100% 20%, color-mix(in srgb, var(--primary-2) 18%, transparent), transparent 50%),
        var(--surface);
    box-shadow:
        0 0 0 1px color-mix(in srgb, #fff 6%, transparent) inset,
        0 18px 48px color-mix(in srgb, var(--primary) 16%, transparent);
}
html[data-theme="dark"] .nutrition-current-hero {
    border-color: color-mix(in srgb, var(--primary-2) 38%, rgba(255, 255, 255, 0.1));
    box-shadow:
        0 0 0 1px rgba(255, 255, 255, 0.06) inset,
        0 20px 56px color-mix(in srgb, var(--primary) 22%, transparent),
        0 0 40px color-mix(in srgb, var(--primary-2) 12%, transparent);
}
@media (min-width: 769px) {
    .nutrition-current-hero {
        position: sticky;
        top: calc(12px + env(safe-area-inset-top, 0px));
        z-index: 4;
    }
}
.nutrition-current-hero__glow {
    position: absolute;
    inset: -40% -20% auto;
    height: 70%;
    background: radial-gradient(closest-side, color-mix(in srgb, var(--primary-2) 28%, transparent), transparent 72%);
    pointer-events: none;
    opacity: 0.85;
}
.nutrition-current-hero__header {
    position: relative;
    z-index: 1;
}
.nutrition-current-hero__title-row {
    display: flex;
    flex-wrap: wrap;
    align-items: flex-start;
    justify-content: space-between;
    gap: 10px;
}
.nutrition-current-hero__title {
    margin: 0;
    font-size: clamp(1.25rem, 3.5vw, 1.55rem);
    font-weight: 800;
    letter-spacing: -0.03em;
    line-height: 1.2;
    flex: 1 1 200px;
}
.nutrition-plan-status-pill--hero {
    flex-shrink: 0;
    margin-top: 2px;
    font-size: 0.68rem;
    padding: 5px 12px;
    box-shadow: 0 0 20px color-mix(in srgb, var(--primary) 35%, transparent);
}
.nutrition-current-hero__internal-title {
    margin: 8px 0 0;
    font-size: 0.8rem;
    color: var(--text-muted);
}
.nutrition-current-hero__meta {
    position: relative;
    z-index: 1;
    margin: 12px 0 0;
    font-size: 0.82rem;
    color: var(--text-muted);
}
.nutrition-current-hero__body {
    position: relative;
    z-index: 1;
    margin-top: 10px;
}
.nutrition-current-hero__preview {
    margin: 0;
    font-size: 0.9rem;
    line-height: 1.45;
    color: var(--text-soft);
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    overflow: hidden;
}
.nutrition-current-hero__preview--empty {
    opacity: 0.75;
    font-style: italic;
}
.nutrition-current-hero__actions {
    position: relative;
    z-index: 1;
    margin-top: 14px;
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    align-items: center;
}
.nutrition-empty-current {
    padding: 16px;
    border-radius: 16px;
}
.nutrition-history-disclosure {
    border: 1px solid var(--border);
    border-radius: 16px;
    background: var(--surface);
    overflow: hidden;
}
.nutrition-history-disclosure__summary {
    list-style: none;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 8px 12px;
    padding: 12px 14px;
    cursor: pointer;
    font-weight: 700;
    color: var(--text);
    user-select: none;
}
.nutrition-history-disclosure__summary::-webkit-details-marker {
    display: none;
}
.nutrition-history-disclosure__title {
    margin: 0;
    flex: 1 1 auto;
}
.nutrition-history-disclosure__count {
    font-size: 0.78rem;
    font-weight: 600;
    color: var(--text-muted);
    text-transform: none;
    letter-spacing: 0;
}
.nutrition-history-disclosure__chev {
    transition: transform 0.2s ease;
    color: var(--text-muted);
}
.nutrition-history-disclosure[open] .nutrition-history-disclosure__chev {
    transform: rotate(180deg);
}
.nutrition-history-disclosure__body {
    padding: 0 12px 14px;
    border-top: 1px solid color-mix(in srgb, var(--border) 80%, transparent);
}
.nutrition-archive-list {
    list-style: none;
    margin: 10px 0 0;
    padding: 0;
    display: flex;
    flex-direction: column;
    gap: 8px;
}
.nutrition-archive-item {
    list-style: none;
}
.nutrition-archive-card {
    display: flex;
    flex-direction: column;
    gap: 10px;
    padding: 12px;
    border-radius: 12px;
    border: 1px solid color-mix(in srgb, var(--border) 90%, transparent);
    background: var(--surface-2);
}
@media (min-width: 520px) {
    .nutrition-archive-card {
        flex-direction: row;
        align-items: center;
    }
    .nutrition-archive-card__link {
        flex: 1 1 auto;
        min-width: 0;
    }
    .nutrition-archive-card__actions {
        flex: 0 0 auto;
    }
}
.nutrition-archive-card__link {
    display: block;
    text-decoration: none;
    color: inherit;
    min-width: 0;
}
.nutrition-archive-card__link:hover .nutrition-archive-card__title {
    text-decoration: underline;
    text-decoration-color: color-mix(in srgb, var(--primary) 45%, transparent);
}
.nutrition-archive-card__head {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 8px;
    justify-content: space-between;
}
.nutrition-archive-card__title {
    font-weight: 700;
    font-size: 0.92rem;
    letter-spacing: -0.02em;
    line-height: 1.25;
}
.nutrition-archive-card__meta {
    margin: 4px 0 0;
    font-size: 0.75rem;
    color: var(--text-muted);
}
.nutrition-archive-card__preview {
    margin: 4px 0 0;
    font-size: 0.8rem;
    color: var(--text-soft);
    line-height: 1.35;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}
.nutrition-archive-card__actions {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    align-items: center;
    justify-content: flex-start;
}
@media (min-width: 520px) {
    .nutrition-archive-card__actions {
        justify-content: flex-end;
    }
}
.nutrition-empty-current__hint {
    margin: 6px 0 14px;
    font-size: 0.88rem;
    line-height: 1.45;
    color: var(--text-muted);
    max-width: 28rem;
}
.nutrition-plan-view-head__main {
    min-width: 0;
}
.nutrition-plan-restore-form {
    margin-top: 14px;
}
.nutrition-plan-view-meta .nutrition-plan-status-pill {
    display: inline-block;
    margin-left: 2px;
    vertical-align: text-bottom;
}
.nutrition-meal-line {
    margin: 0 0 8px;
    font-size: 0.95rem;
    line-height: 1.5;
    color: var(--text-soft);
}
.nutrition-meal-line:last-child {
    margin-bottom: 0;
}
.nutrition-meal-line--plain {
    color: var(--text-soft);
}
.nutrition-plan-render--client-detail .nutrition-section-card {
    margin-bottom: 16px;
    padding: 14px 16px 16px;
}
.nutrition-plan-render--client-detail .nutrition-section-card__h {
    margin-bottom: 10px;
}
.nutrition-plan-render--client-detail .nutrition-section-card__body .nutrition-meal-line:last-child {
    margin-bottom: 0;
}
.nutrition-archive-empty {
    margin: 12px 4px 4px;
}
#today-nutrition {
    scroll-margin-top: calc(72px + env(safe-area-inset-top, 0px));
}
#nutrition-plan-doc {
    scroll-margin-top: calc(72px + env(safe-area-inset-top, 0px));
}
#client-settings-profile,
#client-settings-telegram {
    scroll-margin-top: calc(72px + env(safe-area-inset-top, 0px));
}
.nutrition-plan-view-internal-title {
    margin-top: 6px;
}

.nutrition-plan-view-head {
    display: flex;
    flex-wrap: wrap;
    align-items: flex-start;
    justify-content: space-between;
    gap: 14px;
}
.nutrition-plan-view-title {
    margin: 6px 0 0;
    font-size: clamp(1.35rem, 3vw, 1.75rem);
    letter-spacing: -0.03em;
}
.nutrition-plan-view-meta {
    margin: 6px 0 0;
}
.nutrition-plan-view-actions {
    flex-shrink: 0;
}
.nutrition-back-link {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    font-size: 0.88rem;
    font-weight: 600;
    color: var(--primary);
    text-decoration: none;
    margin-bottom: 6px;
}
.nutrition-back-link:hover {
    text-decoration: underline;
    text-underline-offset: 2px;
}
.nutrition-plan-view-doc {
    margin-top: 18px;
}
.nutrition-plan-render--readable {
    font-size: 1rem;
    line-height: 1.6;
    color: var(--text);
    border: none;
    background: transparent;
    padding: 0;
    margin: 0;
    box-shadow: none;
}
.nutrition-section-card {
    border: 1px solid var(--border);
    border-radius: 14px;
    background: var(--surface-2);
    padding: 12px 14px;
    margin: 0 0 12px;
}
.nutrition-section-card:last-child {
    margin-bottom: 0;
}
.nutrition-section-card__h {
    font-weight: 700;
    font-size: 0.95rem;
    margin-bottom: 8px;
    color: var(--text);
}
.nutrition-section-card__body {
    font-size: 0.96rem;
    line-height: 1.55;
    color: var(--text-soft);
}
.nutrition-preamble {
    margin-bottom: 14px;
    font-size: 0.96rem;
    line-height: 1.55;
    color: var(--text-soft);
}
.nutrition-plan-assign-strip {
    margin: 12px 0 0;
    padding: 12px 14px;
    border-radius: 14px;
    border: 1px solid var(--border);
    background: var(--surface-2);
}
.nutrition-plan-assign-list {
    margin: 8px 0 0;
    padding-left: 18px;
    color: var(--text-soft);
    font-size: 0.92rem;
}
.nutrition-plan-assign-list a {
    color: var(--primary);
    font-weight: 600;
    text-decoration: none;
}
.nutrition-plan-assign-list a:hover {
    text-decoration: underline;
}

.nutrition-edit-shell {
    margin-top: 16px;
    max-width: 720px;
}
.nutrition-edit-shell--client {
    max-width: 720px;
}
.nutrition-edit-form {
    display: grid;
    gap: 16px;
}
.nutrition-edit-form--modal {
    gap: 14px;
    margin-top: 8px;
}
.app-modal-card--nutrition {
    max-width: 560px;
}
.nutrition-edit-field label {
    display: block;
    margin-bottom: 6px;
    font-size: 0.82rem;
    font-weight: 600;
    color: var(--text-muted);
}
.nutrition-edit-field input[type="text"],
.nutrition-edit-field textarea,
.nutrition-edit-field select {
    width: 100%;
    box-sizing: border-box;
    border-radius: 12px;
    border: 1px solid var(--border);
    background: var(--surface);
    padding: 10px 12px;
    color: inherit;
    font-size: 0.95rem;
    font-family: inherit;
}
.nutrition-edit-field textarea {
    resize: vertical;
    min-height: 160px;
    line-height: 1.5;
}
.nutrition-edit-ai {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    align-items: center;
}
.nutrition-edit-footer {
    margin-top: 4px;
}
.nutrition-edit-danger {
    margin-top: 28px;
    padding-top: 16px;
    border-top: 1px solid var(--border);
}
.nutrition-clear-form {
    margin-top: 12px;
}
.nutrition-readonly-hint {
    max-width: 260px;
    text-align: right;
}

.history-status-chip {
    text-transform: none;
}
.history-workout-card--completed,
.history-workout-card--completed_late {
    border-color: rgba(34, 197, 94, 0.36);
    background: color-mix(in srgb, rgba(34, 197, 94, 0.08) 55%, var(--surface-2));
}
.history-workout-card--cancelled,
.history-workout-card--missed {
    border-color: rgba(239, 68, 68, 0.34);
    background: color-mix(in srgb, rgba(239, 68, 68, 0.08) 55%, var(--surface-2));
}
.history-workout-card--active,
.history-workout-card--scheduled,
.history-workout-card--reopened,
.history-workout-card--late {
    border-color: rgba(124, 58, 237, 0.34);
    background: color-mix(in srgb, rgba(124, 58, 237, 0.08) 55%, var(--surface-2));
}

/* Schedule slots — compact cards, ⋯ menu, expandable preview */
.schedule-slot-panel-hint,
.schedule-slot-range {
    font-size: 0.9rem;
    margin-top: 6px;
}
.schedule-slot-list {
    display: flex;
    flex-direction: column;
    gap: 10px;
    margin-top: 12px;
}
.schedule-slot-load-more {
    margin-top: 14px;
}
.schedule-slot-card {
    border: 1px solid var(--border);
    border-radius: 16px;
    background: var(--surface-2);
    overflow: visible;
    position: relative;
    z-index: 0;
}
.schedule-slot-card--menu-open {
    z-index: 10050;
}
.schedule-slot-card:has([data-schedule-dropdown]:not([hidden])) {
    z-index: 10050;
}
.schedule-slot-card--active {
    border-color: color-mix(in srgb, var(--primary) 28%, var(--border));
}
.schedule-slot-card__row {
    display: flex;
    align-items: stretch;
    gap: 0;
    min-height: 72px;
}
.schedule-slot-card__expand {
    flex: 0 0 40px;
    border: none;
    background: transparent;
    color: var(--text-muted);
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 0;
}
.schedule-slot-card__expand:hover {
    color: var(--text);
    background: color-mix(in srgb, var(--surface) 50%, transparent);
}
.schedule-slot-card__chev {
    display: inline-flex;
    transition: transform 0.2s ease;
}
.schedule-slot-card__expand[aria-expanded="true"] .schedule-slot-card__chev {
    transform: rotate(180deg);
}
.schedule-slot-card__tapzone {
    flex: 1 1 auto;
    min-width: 0;
    text-align: left;
    border: none;
    background: transparent;
    color: inherit;
    cursor: pointer;
    padding: 12px 10px 12px 4px;
    font: inherit;
}
.schedule-slot-card__meta {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    align-items: center;
    font-size: 0.78rem;
    color: var(--text-muted);
    text-transform: uppercase;
    letter-spacing: 0.04em;
}
.schedule-slot-card__date {
    font-weight: 700;
}
.schedule-slot-card__title {
    margin: 6px 0 0;
    font-size: 1.02rem;
    font-weight: 700;
    letter-spacing: -0.02em;
    line-height: 1.25;
}
.schedule-slot-card__sub {
    margin-top: 4px;
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    align-items: center;
    font-size: 0.86rem;
    color: var(--text-soft);
}
.schedule-slot-card__chips {
    margin-top: 8px;
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    align-items: center;
}
.schedule-slot-status {
    font-size: 0.72rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    padding: 3px 8px;
    border-radius: 999px;
    background: rgba(148, 163, 184, 0.2);
    color: var(--text-muted);
}
.schedule-slot-status--active {
    background: rgba(124, 58, 237, 0.16);
    color: #6d28d9;
}
.schedule-slot-status--completed {
    background: rgba(34, 197, 94, 0.15);
    color: #15803d;
}
.schedule-slot-pill {
    font-size: 0.72rem;
    color: var(--text-muted);
}
.schedule-slot-card__menu {
    flex: 0 0 auto;
    position: relative;
    display: flex;
    align-items: flex-start;
    padding: 8px 8px 0 0;
    z-index: 1;
}
.schedule-slot-menu-btn {
    width: 40px;
    height: 40px;
    border-radius: 12px;
    border: 1px solid transparent;
    background: transparent;
    color: var(--text-muted);
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 0;
}
.schedule-slot-menu-btn:hover {
    border-color: var(--border);
    background: var(--surface);
    color: var(--text);
}
.schedule-slot-dropdown {
    position: absolute;
    right: 0;
    top: calc(100% + 4px);
    min-width: 200px;
    z-index: 10051;
    border-radius: 14px;
    border: 1px solid var(--border);
    background: var(--surface);
    box-shadow: 0 12px 36px rgba(0, 0, 0, 0.18);
    padding: 6px;
}
.schedule-slot-dropdown.is-dropup {
    top: auto;
    bottom: calc(100% + 4px);
}
.schedule-slot-dropdown__item {
    display: block;
    width: 100%;
    text-align: left;
    border: none;
    background: transparent;
    font: inherit;
    font-size: 0.9rem;
    padding: 10px 12px;
    border-radius: 10px;
    color: inherit;
    cursor: pointer;
    text-decoration: none;
    box-sizing: border-box;
}
.schedule-slot-dropdown__item:hover {
    background: var(--surface-2);
}
.schedule-slot-dropdown__item--danger {
    color: #dc2626;
}
.schedule-slot-dropdown__hint {
    display: block;
    padding: 10px 12px;
    font-size: 0.86rem;
    color: var(--text-muted);
}
.schedule-slot-hidden-form {
    display: none;
}
.schedule-slot-inline-panel {
    border-top: 1px solid var(--border);
    padding: 12px 14px 14px;
    background: var(--surface);
}
.schedule-slot-inline-form {
    display: grid;
    gap: 10px;
    max-width: 320px;
}
.schedule-slot-inline-label {
    font-size: 0.82rem;
    font-weight: 600;
    color: var(--text-muted);
}
.schedule-slot-inline-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}
.schedule-slot-preview {
    border-top: 1px solid var(--border);
    padding: 12px 14px 16px;
    background: var(--surface);
}
.schedule-slot-preview__label {
    font-size: 0.72rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    color: var(--text-muted);
    margin: 12px 0 6px;
}
.schedule-slot-preview__label:first-child {
    margin-top: 0;
}
.schedule-slot-preview__text--pre {
    white-space: pre-wrap;
    font-size: 0.92rem;
    line-height: 1.5;
    color: var(--text-soft);
}
.schedule-slot-ex-list {
    margin: 0;
    padding-left: 18px;
    color: var(--text);
    font-size: 0.92rem;
    line-height: 1.45;
}
.schedule-slot-ex-list li {
    margin-bottom: 8px;
}
.schedule-slot-ex-title {
    font-weight: 600;
}
.schedule-slot-ex-meta {
    display: block;
    font-size: 0.84rem;
    color: var(--text-muted);
    font-weight: 500;
}
.schedule-slot-ex-notes {
    font-size: 0.84rem;
    color: var(--text-soft);
    margin-top: 2px;
}

/* Workout day page — view-first header + exercises focus */
.workout-day-view-head {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 16px;
    flex-wrap: wrap;
}
.workout-day-view-head-main {
    min-width: 0;
    flex: 1;
}
.workout-day-view-title {
    margin: 0 0 8px;
    font-size: clamp(1.25rem, 4vw, 1.6rem);
    font-weight: 800;
    letter-spacing: -0.02em;
    line-height: 1.25;
}
.workout-day-view-desc {
    margin: 0;
    max-width: 52ch;
    line-height: 1.55;
}
.workout-exercises-main-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    flex-wrap: wrap;
    margin-bottom: 14px;
}
.workout-exercises-main-head h3 {
    margin: 0;
    font-size: 1.15rem;
}

/* --- Weekday picker (assign program schedule) — mobile-first, no horizontal scroll --- */
.weekdays-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 10px;
    width: 100%;
    max-width: 100%;
    margin-top: 4px;
}

@media (max-width: 480px) {
    .weekdays-grid {
        grid-template-columns: repeat(4, minmax(0, 1fr));
        gap: 8px;
    }
}

.weekday-tile {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: 48px;
    min-width: 0;
    margin: 0;
    padding: 6px 4px;
    cursor: pointer;
    user-select: none;
    -webkit-tap-highlight-color: transparent;
    border-radius: 10px;
    border: 1px solid var(--border-strong);
    background: var(--surface);
    color: var(--text);
    font-size: 0.82rem;
    font-weight: 700;
    letter-spacing: 0.02em;
    transition: background 0.15s ease, border-color 0.15s ease, color 0.15s ease, box-shadow 0.15s ease;
}

.weekday-tile .weekday-tile__abbr {
    position: relative;
    z-index: 0;
    pointer-events: none;
    line-height: 1.2;
    text-align: center;
}

.weekday-tile input {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    margin: 0;
    opacity: 0;
    cursor: pointer;
    z-index: 1;
}

.weekday-tile:has(input:checked) {
    background: var(--primary-soft);
    border-color: var(--primary);
    color: var(--primary-2);
    box-shadow: 0 0 0 1px var(--primary-soft);
}

.weekday-tile:focus-within {
    outline: 2px solid var(--primary);
    outline-offset: 2px;
}

.schedule-weekdays-count-msg {
    margin-top: 6px;
    font-size: 0.88rem;
    line-height: 1.35;
    min-height: 1.35em;
}

.schedule-weekdays-count-msg.is-warn {
    color: #b45309;
}

html[data-theme="dark"] .schedule-weekdays-count-msg.is-warn {
    color: #fbbf24;
}

.schedule-check-row {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    align-items: flex-start;
    gap: 10px;
    width: 100%;
    margin-top: 10px;
    line-height: 1.35;
    font-size: 0.92rem;
    color: var(--text-soft);
}
.schedule-check-row input[type="checkbox"] {
    flex: 0 0 auto;
    margin-top: 2px;
}
.schedule-check-row__text {
    min-width: 0;
    overflow-wrap: anywhere;
}
.btn--assign-tab {
    flex: 1 1 220px;
    min-width: 0;
}

/* Collapsible schedule hints (assign modal) — full width, mobile-friendly */
.schedule-field-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    width: 100%;
    margin: 10px 0 6px;
    flex-wrap: nowrap;
}
.schedule-field-head--compact {
    margin-top: 0;
    margin-bottom: 8px;
}
.schedule-field-label {
    font-weight: 600;
    font-size: 0.95rem;
    color: var(--text);
    line-height: 1.3;
    min-width: 0;
    flex: 1;
}
.schedule-help-toggle {
    flex-shrink: 0;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 44px;
    min-height: 44px;
    margin: 0;
    padding: 0 10px;
    border-radius: 12px;
    border: 1px solid var(--border-strong);
    background: var(--surface);
    color: var(--text);
    font-size: 1.15rem;
    line-height: 1;
    cursor: pointer;
    -webkit-tap-highlight-color: transparent;
    transition: background 0.15s ease, border-color 0.15s ease, box-shadow 0.15s ease;
}
.schedule-help-toggle:hover {
    background: var(--surface-2);
    border-color: var(--primary);
}
.schedule-help-toggle:focus-visible {
    outline: 2px solid var(--primary);
    outline-offset: 2px;
}
.schedule-help-toggle--lucide {
    font-size: 0;
    color: var(--text-muted);
}
.schedule-help-toggle--lucide .lucide-svg {
    width: 18px;
    height: 18px;
}
.schedule-help-panel {
    width: 100%;
    max-height: 0;
    opacity: 0;
    overflow: hidden;
    margin: 0;
    padding: 0;
    border-radius: 10px;
    transition:
        max-height 0.35s ease,
        opacity 0.22s ease,
        margin-top 0.22s ease,
        padding 0.22s ease;
}
.schedule-help-panel.is-open {
    max-height: 320px;
    opacity: 1;
    margin-top: 10px;
    padding: 10px 12px;
    background: var(--surface-2);
    border: 1px solid var(--border);
}
.schedule-help-text {
    width: 100%;
    margin: 0 0 10px;
    font-size: 0.875rem;
    line-height: 1.45;
    color: var(--text-soft);
}
.schedule-help-text:last-child {
    margin-bottom: 0;
}
.schedule-help-panel .schedule-weekdays-count-msg {
    margin-top: 4px;
    font-size: 0.875rem;
    line-height: 1.45;
    min-height: 0;
}

@media (max-width: 720px) {
    .assign-training-modal-card {
        padding: 14px;
        max-height: calc(100vh - 24px);
        max-height: calc(100dvh - 24px);
    }
    .assign-training-modal-card .app-modal-head {
        align-items: flex-start;
        flex-wrap: wrap;
    }
    .assign-training-modal-card .app-modal-head .btn {
        width: 100%;
    }
}

/* Trainer dashboard: AJAX action toasts (progressive enhancement) */
.fithub-toast-host {
    position: fixed;
    z-index: 4000;
    left: 50%;
    bottom: 24px;
    transform: translateX(-50%);
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 8px;
    pointer-events: none;
    max-width: min(420px, calc(100vw - 32px));
}
.fithub-toast {
    pointer-events: none;
    padding: 12px 18px;
    border-radius: 12px;
    font-size: 0.95rem;
    font-weight: 600;
    line-height: 1.35;
    box-shadow: var(--card-shadow-lg);
    opacity: 0;
    transform: translateY(10px);
    transition:
        opacity 0.22s ease,
        transform 0.22s ease;
}
.fithub-toast--show {
    opacity: 1;
    transform: translateY(0);
}
.fithub-toast--success {
    background: var(--surface);
    color: var(--text);
    border: 1px solid var(--border-strong);
}
.fithub-toast--error {
    background: #7f1d1d;
    color: #fef2f2;
    border: 1px solid rgba(0, 0, 0, 0.12);
}
html[data-theme="dark"] .fithub-toast--error {
    background: #991b1b;
    color: #fee2e2;
}

/* iOS non-Safari: subtle install guidance (dismissible) */
.pwa-ios-browser-hint {
    display: flex;
    align-items: flex-start;
    gap: 10px;
    margin: 0;
    padding: 10px 14px;
    font-size: 0.8125rem;
    line-height: 1.45;
    color: var(--text-soft);
    background: var(--surface-soft);
    border-bottom: 1px solid var(--border);
}
.pwa-ios-browser-hint[hidden] {
    display: none !important;
}
.pwa-ios-browser-hint__text {
    flex: 1;
    min-width: 0;
}
.pwa-ios-browser-hint__dismiss {
    flex-shrink: 0;
    margin: -4px -6px -4px 0;
    padding: 4px 10px;
    border: none;
    border-radius: 8px;
    background: transparent;
    color: var(--text-muted);
    font-size: 1.25rem;
    line-height: 1;
    cursor: pointer;
}
.pwa-ios-browser-hint__dismiss:hover,
.pwa-ios-browser-hint__dismiss:focus-visible {
    color: var(--text);
    background: var(--surface-2);
    outline: none;
}

/* My workouts / self programs (client_programs) */
.client-hub-mode-nav {
    position: sticky;
    top: 0;
    z-index: 24;
    margin: 0 0 16px;
    padding: 10px 0 12px;
    flex-wrap: wrap;
    gap: 8px;
    background: color-mix(in srgb, var(--surface) 94%, transparent);
    border-bottom: 1px solid var(--border);
    backdrop-filter: blur(12px);
    -webkit-backdrop-filter: blur(12px);
}
.workspace-top-bar {
    margin-bottom: 14px;
    flex-wrap: wrap;
    gap: 8px;
    align-items: center;
}
.workspace-top-bar .workspace-top-bar__schedule {
    margin-left: auto;
}
@media (max-width: 520px) {
    .workspace-top-bar .workspace-top-bar__schedule {
        margin-left: 0;
        flex: 1 1 auto;
        min-width: min(100%, 200px);
    }
}

.self-programs-page {
    max-width: 820px;
    margin: 0 auto;
}
.dashboard-top--self-programs {
    margin-bottom: 20px;
}
.self-programs-lead {
    margin-bottom: 4px;
    line-height: 1.45;
}
.self-programs-privacy-foot {
    margin: 8px 0 0;
    font-size: 0.82rem;
    color: var(--text-muted);
    opacity: 0.92;
}
.self-programs-cta-band {
    margin-bottom: 22px;
}
.self-programs-cta-band__row {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    align-items: stretch;
}
.btn-self-programs-smart {
    flex: 1 1 220px;
    min-height: 48px;
    font-weight: 750;
    letter-spacing: -0.01em;
    box-shadow: 0 8px 28px color-mix(in srgb, var(--primary) 18%, transparent);
}
.btn-self-programs-secondary {
    flex: 0 1 auto;
    align-self: center;
}
.self-programs-train-context-card {
    display: block;
    margin-top: 14px;
    padding: 12px 14px;
    border-radius: 14px;
    border: 1px solid var(--border-strong);
    background: var(--surface-2);
    text-decoration: none;
    color: inherit;
    transition: border-color 0.15s ease, background 0.15s ease;
}
.self-programs-train-context-card:hover {
    border-color: color-mix(in srgb, var(--primary) 35%, var(--border-strong));
    background: color-mix(in srgb, var(--primary-soft) 55%, var(--surface));
}
.self-programs-train-context-card--borderless {
    border-color: transparent;
    background: transparent;
    padding-left: 2px;
    padding-right: 2px;
}
.self-programs-train-context-card__kicker {
    display: block;
    font-size: 0.72rem;
    font-weight: 800;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    color: var(--text-muted);
    margin-bottom: 4px;
}
.self-programs-train-context-card__line {
    display: block;
    font-weight: 600;
    font-size: 0.98rem;
}
.self-programs-train-context-card__cta {
    display: block;
    margin-top: 6px;
    font-size: 0.86rem;
    color: var(--primary);
    font-weight: 600;
}
.self-programs-train-context-muted-wrap {
    margin-bottom: 16px;
    font-size: 0.88rem;
}
.self-programs-train-context-link {
    color: var(--primary);
    font-weight: 600;
    text-decoration: none;
}
.self-programs-train-context-link:hover {
    text-decoration: underline;
}
.dashboard-switcher--self-library {
    flex-wrap: nowrap;
    overflow-x: auto;
    gap: 8px;
    padding-bottom: 12px;
    margin-bottom: 22px;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: thin;
    border-bottom: 1px solid var(--border);
}
.dashboard-switcher--self-library .btn {
    flex: 0 0 auto;
    white-space: nowrap;
    padding: 8px 14px;
    font-size: 0.86rem;
    font-weight: 600;
    border-radius: 999px;
}
.dashboard-switcher--self-library .btn-outline {
    opacity: 0.92;
    border-color: var(--border-strong);
    color: var(--text-muted);
}
.dashboard-switcher--self-library .btn-primary {
    box-shadow: none;
    background: color-mix(in srgb, var(--primary-soft) 90%, var(--surface));
    border-color: color-mix(in srgb, var(--primary) 38%, var(--border-strong));
    font-weight: 750;
}
.self-programs-create-shell:not([hidden]) {
    margin-bottom: 18px;
}
.self-programs-create-panel--drawer {
    border-color: var(--border-strong);
}
.self-programs-create-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    align-items: center;
}
.self-programs-section-panel,
.self-programs-create-panel {
    padding-top: 16px;
    padding-bottom: 16px;
}
.self-programs-section-heading {
    margin: 0 0 8px;
    font-size: 1.08rem;
    letter-spacing: -0.02em;
    font-weight: 750;
}
.self-programs-section-lead {
    margin: 0 0 14px;
    line-height: 1.5;
    max-width: 52rem;
}
.self-programs-card-list {
    gap: 12px;
}
.self-plan-card-v2 {
    position: relative;
    display: flex;
    flex-direction: column;
    gap: 12px;
    padding: 16px 16px 14px;
    border-radius: 16px;
}
.self-plan-card-v2__main {
    position: relative;
    z-index: 1;
}
.self-plan-card-v2__title {
    margin: 0 0 8px;
    font-size: 1.12rem;
    font-weight: 750;
    letter-spacing: -0.02em;
    line-height: 1.25;
}
.self-plan-card-v2__chips {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    margin-bottom: 4px;
    align-items: center;
}
.plan-pill {
    display: inline-flex;
    align-items: center;
    padding: 4px 10px;
    border-radius: 999px;
    font-size: 0.78rem;
    font-weight: 700;
    border: 1px solid var(--border-strong);
    background: var(--surface);
    color: var(--text-soft);
}
.plan-pill--active {
    border-color: color-mix(in srgb, var(--primary) 40%, var(--border-strong));
    background: color-mix(in srgb, var(--primary-soft) 75%, var(--surface));
    color: var(--primary);
}
.plan-pill--soft {
    font-weight: 600;
    color: var(--text-muted);
}
.plan-pill--muted {
    font-weight: 600;
    opacity: 0.85;
}
.self-plan-card-v2__focus {
    margin: 8px 0 0;
    font-size: 0.92rem;
    color: var(--text-soft);
    line-height: 1.45;
    max-width: 48rem;
}
.self-plan-card-v2__actions {
    position: relative;
    z-index: 2;
    flex-wrap: wrap;
    gap: 8px;
    margin-top: 4px;
}
.self-programs-train-day-card__instr {
    max-height: 4.5em;
    overflow: hidden;
}
.self-programs-empty-train {
    grid-column: 1 / -1;
}
.btn-self-delete {
    font-size: 0.82rem;
    padding: 6px 10px;
    font-weight: 600;
    color: color-mix(in srgb, var(--danger, #b91c1c) 88%, var(--text-muted)) !important;
    border-color: color-mix(in srgb, var(--danger, #b91c1c) 25%, var(--border-strong)) !important;
    background: transparent !important;
}
.btn-self-delete:hover {
    color: var(--danger, #b91c1c) !important;
    border-color: color-mix(in srgb, var(--danger, #b91c1c) 45%, var(--border-strong)) !important;
    background: color-mix(in srgb, var(--danger, #b91c1c) 6%, var(--surface)) !important;
}
.workspace-trash-details {
    margin-bottom: 18px;
    border-radius: 16px;
    border: 1px dashed var(--border-strong);
    padding: 0 14px 14px;
    background: color-mix(in srgb, var(--surface) 92%, var(--surface-2));
}
.workspace-trash-details__summary {
    cursor: pointer;
    list-style: none;
    font-weight: 700;
    padding: 12px 0;
    color: var(--text-muted);
    font-size: 0.95rem;
}
.workspace-trash-details__summary::-webkit-details-marker {
    display: none;
}
.self-programs-log-panel {
    margin-top: 10px;
    border-style: dashed;
}
.self-programs-log-panel .self-programs-section-heading {
    color: var(--text-muted);
    font-size: 1rem;
    font-weight: 700;
}
.self-programs-log-empty {
    margin: 4px 0 0;
    line-height: 1.55;
    color: var(--text-muted);
    font-size: 0.92rem;
}
.self-programs-standalone-head {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 10px;
    justify-content: space-between;
    margin-bottom: 8px;
}
.self-programs-search-form {
    margin-bottom: 12px;
}
.self-programs-muted-follow {
    margin-top: 8px;
    opacity: 0.92;
}
@media (max-width: 560px) {
    .btn-self-programs-smart {
        flex: 1 1 100%;
    }
}

/* Smart Gym Scan (self-mode) */
.smart-scan-hero-guidance {
    margin: 14px 0 0;
    padding-left: 1.15rem;
    max-width: 40rem;
    font-size: 0.88rem;
    line-height: 1.45;
    color: var(--text-muted);
}
.smart-scan-hero-guidance li {
    margin: 0.28em 0;
}
.smart-scan-upload-foot {
    margin-top: 8px;
}
.smart-scan-multi-photo-value {
    margin-top: 8px;
    font-size: 0.88rem;
    line-height: 1.45;
    color: var(--text-muted);
}
.smart-scan-nutrition-fields {
    margin-top: 18px;
    padding-top: 16px;
    border-top: 1px solid var(--border);
}
.smart-scan-section-kicker {
    margin-bottom: 4px;
    font-size: 0.78rem;
    font-weight: 800;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: var(--primary);
}
.smart-scan-nutrition-hint {
    margin: 0 0 12px;
}
.smart-scan-field-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 10px 12px;
}
.smart-scan-nutrition-preview {
    margin-top: 14px;
    padding: 14px;
    border-radius: 16px;
    border: 1px solid color-mix(in srgb, var(--primary) 24%, var(--border-strong));
    background: color-mix(in srgb, var(--primary-soft) 36%, var(--surface));
}
.smart-scan-nutrition-preview__body {
    margin: 10px 0 0;
    white-space: pre-wrap;
    overflow-wrap: anywhere;
    font: inherit;
    line-height: 1.48;
    color: var(--text-soft);
}
.smart-scan-nutrition-preview__summary {
    display: grid;
    gap: 8px;
}
.smart-scan-nutrition-preview__summary strong {
    font-size: 1.08rem;
    letter-spacing: -0.02em;
}
.smart-scan-nutrition-preview__meals {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}
.smart-scan-nutrition-preview__meals span {
    display: inline-flex;
    padding: 5px 10px;
    border-radius: 999px;
    border: 1px solid color-mix(in srgb, var(--primary) 22%, var(--border));
    background: color-mix(in srgb, var(--primary-soft) 28%, var(--surface));
    color: var(--text-soft);
    font-size: 0.84rem;
    font-weight: 700;
}
.smart-scan-nutrition-preview__details {
    margin-top: 10px;
}
.smart-scan-nutrition-preview__details summary {
    cursor: pointer;
    color: var(--primary);
    font-weight: 800;
}
.smart-scan-coach-notes {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 10px;
    margin: 12px 0 14px;
}
.smart-scan-coach-note {
    padding: 12px;
    border-radius: 14px;
    border: 1px solid color-mix(in srgb, var(--primary) 20%, var(--border));
    background: color-mix(in srgb, var(--primary-soft) 26%, var(--surface));
}
.smart-scan-coach-note h4 {
    margin: 0 0 6px;
    font-size: 0.92rem;
}
.smart-scan-coach-note p {
    margin: 0;
    color: var(--text-soft);
    line-height: 1.45;
    font-size: 0.92rem;
}
@media (max-width: 560px) {
    .smart-scan-field-grid {
        grid-template-columns: 1fr;
    }
    .smart-scan-coach-notes {
        grid-template-columns: 1fr;
    }
}
.smart-scan-loading {
    position: fixed;
    inset: 0;
    z-index: 12000;
    display: none;
    align-items: center;
    justify-content: center;
    background: rgba(8, 10, 22, 0.55);
    backdrop-filter: blur(6px);
    -webkit-backdrop-filter: blur(6px);
    pointer-events: all;
}
.smart-scan-loading.is-visible {
    display: flex;
}
.smart-scan-loading__card {
    max-width: 320px;
    width: calc(100vw - 40px);
    padding: 28px 28px 24px;
    border-radius: 20px;
    background: var(--surface);
    border: 1px solid var(--border-strong);
    box-shadow: 0 24px 80px rgba(0,0,0,0.32), var(--card-shadow-lg);
    text-align: center;
}
.smart-scan-loading__spinner {
    width: 40px;
    height: 40px;
    margin: 0 auto 14px;
    border-radius: 50%;
    border: 3px solid color-mix(in srgb, var(--primary) 35%, transparent);
    border-top-color: var(--primary);
    animation: smart-scan-spin 0.85s linear infinite;
}
@keyframes smart-scan-spin {
    to {
        transform: rotate(360deg);
    }
}
.smart-scan-loading__text {
    margin: 0 0 6px;
    font-size: 0.97rem;
    font-weight: 700;
    color: var(--text);
    line-height: 1.45;
}

.smart-scan-loading__sub {
    margin: 0;
    font-size: 0.8rem;
    color: var(--text-muted);
    line-height: 1.4;
}

.smart-scan-preview-root {
    scroll-margin-top: calc(env(safe-area-inset-top, 0px) + 88px);
}
.smart-scan-preview-root--glow {
    animation: smart-scan-preview-glow 2.1s ease-out forwards;
}
@keyframes smart-scan-preview-glow {
    0% {
        box-shadow: 0 0 0 0 rgba(123, 140, 255, 0.55);
    }
    35% {
        box-shadow: 0 0 0 6px rgba(123, 140, 255, 0.35), 0 0 28px rgba(107, 95, 214, 0.45);
    }
    100% {
        box-shadow: 0 0 0 0 transparent;
    }
}

.smart-scan-success-card {
    margin-bottom: 16px;
    padding: 18px 18px 16px;
    border-radius: 18px;
    border: 1px solid color-mix(in srgb, var(--primary) 32%, var(--border));
    background: linear-gradient(
        145deg,
        color-mix(in srgb, var(--primary-soft) 55%, var(--surface)) 0%,
        var(--surface) 55%
    );
    box-shadow: var(--card-shadow);
}
.smart-scan-success-card__badge {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    font-weight: 800;
    font-size: 1.02rem;
    letter-spacing: -0.02em;
    color: var(--text);
    margin-bottom: 10px;
}
.smart-scan-success-card__lead {
    margin: 0 0 8px;
    font-size: 0.92rem;
    color: var(--text-soft);
    line-height: 1.5;
}
.smart-scan-success-card__list {
    margin: 0;
    padding-left: 1.15rem;
    color: var(--text-soft);
    font-size: 0.88rem;
    line-height: 1.55;
}
.smart-scan-success-card__checks {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(190px, 1fr));
    gap: 8px;
    margin: 12px 0 14px;
}
.smart-scan-success-card__checks span {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    padding: 8px 10px;
    border-radius: 12px;
    background: color-mix(in srgb, var(--success, #22c55e) 10%, var(--surface));
    border: 1px solid color-mix(in srgb, var(--success, #22c55e) 20%, var(--border));
    color: var(--text-soft);
    font-size: 0.88rem;
    font-weight: 700;
}
.smart-scan-success-card__checks .lucide-svg {
    color: #16a34a;
    flex-shrink: 0;
}
.smart-scan-success-card__cta {
    width: 100%;
    justify-content: center;
}

.smart-scan-confidence-row {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 8px 14px;
    margin-bottom: 14px;
}
.smart-scan-confidence {
    font-weight: 700;
    font-size: 0.9rem;
}
.smart-scan-confidence--high {
    color: #16a34a;
}
.smart-scan-confidence--medium {
    color: #ca8a04;
}
.smart-scan-confidence--low {
    color: #dc2626;
}
.smart-scan-confidence-hint {
    flex: 1 1 100%;
    font-size: 0.84rem;
    color: var(--text-muted);
    line-height: 1.45;
}

.smart-scan-preview-panel {
    border: 1px solid var(--border-strong);
}
.smart-scan-preview-title {
    margin: 0 0 10px;
    font-size: 1.35rem;
    letter-spacing: -0.03em;
}
.smart-scan-status-msg {
    margin-bottom: 12px;
}

.smart-scan-equipment-block {
    margin-bottom: 16px;
}
.smart-scan-equipment-heading {
    margin: 0 0 8px;
    font-size: 0.78rem;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    color: var(--text-muted);
}
.smart-scan-equipment-sub {
    margin: 0 0 8px;
    font-size: 0.82rem;
}
.smart-scan-pill-row {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}
.smart-start-segment {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 8px;
    width: 100%;
}
.smart-start-segment__option {
    position: relative;
    display: flex;
    min-height: 52px;
    cursor: pointer;
}
.smart-start-segment__option input {
    position: absolute;
    opacity: 0;
    pointer-events: none;
}
.smart-start-segment__option span {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    min-height: 52px;
    padding: 10px 14px;
    border-radius: 18px;
    border: 1px solid var(--border);
    background: var(--surface-2);
    color: var(--text-soft);
    font-size: 0.96rem;
    font-weight: 800;
    line-height: 1.15;
    text-align: center;
    transition: border-color 0.18s ease, background 0.18s ease, color 0.18s ease, box-shadow 0.18s ease;
}
.smart-start-segment__option input:checked + span {
    border-color: color-mix(in srgb, var(--primary) 72%, var(--border));
    background: color-mix(in srgb, var(--primary) 18%, var(--surface));
    color: var(--text);
    box-shadow: 0 0 0 1px color-mix(in srgb, var(--primary) 28%, transparent), 0 14px 34px color-mix(in srgb, var(--primary) 18%, transparent);
}
.smart-start-segment__option:focus-within span {
    outline: 2px solid color-mix(in srgb, var(--primary) 55%, transparent);
    outline-offset: 2px;
}
.smart-scan-pill {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 6px 11px;
    border-radius: 999px;
    font-size: 0.82rem;
    font-weight: 600;
    border: 1px solid var(--border);
    background: var(--surface-2);
    color: var(--text-soft);
}
.smart-scan-pill .lucide-svg {
    width: 14px;
    height: 14px;
    flex-shrink: 0;
}
.smart-scan-pill--ok {
    border-color: color-mix(in srgb, #16a34a 35%, var(--border));
    background: color-mix(in srgb, #16a34a 12%, var(--surface));
}
.smart-scan-pill--warn {
    border-color: color-mix(in srgb, #ca8a04 40%, var(--border));
    background: color-mix(in srgb, #ca8a04 14%, var(--surface));
}

.smart-scan-days {
    margin-top: 6px;
}
.smart-scan-ex-list {
    margin: 10px 0 0;
    padding-left: 1.1rem;
    color: var(--text-soft);
    font-size: 0.9rem;
    line-height: 1.5;
}
.smart-scan-ex-list li {
    margin-bottom: 6px;
}

.self-plan-card.smart-scan-saved-highlight {
    animation: smart-scan-saved-pulse 2.4s ease-out forwards;
}

.smart-scan-page-shell {
    position: relative;
}

.dashboard-top--smart-scan {
    margin-bottom: 12px;
}

.dashboard-subtext--smart-scan-hero {
    margin-bottom: 0;
    max-width: 36rem;
}

.smart-scan-panel-tight {
    margin-bottom: 12px !important;
}

.smart-scan-onboarding-panel .auth-form > label:first-of-type {
    margin-top: 0;
}

.smart-scan-cta-hint {
    margin: 12px 0 0;
    font-size: 0.88rem;
    line-height: 1.45;
    color: var(--text-muted);
}

.smart-scan-form-footer-hint {
    margin: 10px 0 0;
    font-size: 0.86rem;
    line-height: 1.45;
    color: var(--text-muted);
    opacity: 0.92;
}

.btn-smart-scan-generate.smart-scan-premium-locked,
button.smart-scan-premium-locked {
    opacity: 0.68;
    cursor: not-allowed;
    box-shadow: none;
    border-style: dashed;
    border-color: color-mix(in srgb, var(--border-strong) 70%, var(--primary));
}

.smart-scan-premium-card--compact {
    border-color: color-mix(in srgb, var(--border-strong) 88%, rgba(124, 92, 255, 0.35));
    background: color-mix(in srgb, var(--surface-2) 92%, transparent);
    padding: 14px 16px 16px;
}

.smart-scan-premium-card__title {
    margin: 0 0 10px;
    font-size: 1.05rem;
    font-weight: 750;
    letter-spacing: -0.02em;
}

.smart-scan-premium-compact-list {
    margin: 0 0 12px;
    padding-left: 1.15rem;
    line-height: 1.45;
    font-size: 0.9rem;
    color: var(--text-soft);
}

.smart-scan-premium-compact-list li {
    margin-bottom: 4px;
}

.smart-scan-premium-price-line {
    margin: 0 0 12px;
    font-weight: 600;
    font-size: 0.95rem;
    color: var(--text);
}

.smart-scan-premium-checkout {
    display: block;
}

.smart-scan-premium-post-hint {
    margin: 12px 0 0;
    font-size: 0.86rem;
}

.smart-scan-form-actions .btn-primary {
    min-height: 48px;
    font-weight: 700;
}

.client-self-scan-hero__schedule-hint {
    margin: 0;
    font-size: 0.86rem;
    line-height: 1.45;
    color: var(--text-muted);
}

.client-self-scan-hero__schedule-hint a {
    color: inherit;
    font-weight: 600;
    text-decoration: underline;
    text-decoration-color: color-mix(in srgb, var(--text-muted) 55%, transparent);
}

.client-self-scan-hero__schedule-hint a:hover {
    color: var(--primary);
    text-decoration-color: var(--primary);
}

.client-self-scan-hero__tertiary--split {
    display: flex;
    flex-direction: column;
    gap: 8px;
    align-items: flex-start;
}

.client-self-scan-hero__tertiary-row {
    font-size: 0.88rem;
}

.client-self-scan-hero__tertiary-row a {
    color: var(--primary);
    font-weight: 600;
    text-decoration: none;
}

.client-self-scan-hero__tertiary-row a:hover {
    text-decoration: underline;
}

.smart-scan-pill--prob {
    border-color: color-mix(in srgb, #ca8a04 45%, var(--border));
    background: color-mix(in srgb, #ca8a04 12%, var(--surface));
    color: var(--text-soft);
}

.smart-scan-mobile-sticky-cta {
    display: none;
}

@media (max-width: 899px) {
    .smart-scan-mobile-sticky-cta {
        display: flex;
        position: fixed;
        left: 0;
        right: 0;
        bottom: calc(var(--mobile-bottom-nav-height) + env(safe-area-inset-bottom, 0px) + 8px);
        z-index: 10001;
        gap: 8px;
        padding: 10px 12px;
        padding-bottom: max(10px, env(safe-area-inset-bottom, 0px));
        justify-content: center;
        align-items: center;
        flex-wrap: wrap;
        background: color-mix(in srgb, var(--surface) 92%, rgba(8, 10, 22, 0.55));
        backdrop-filter: blur(16px);
        -webkit-backdrop-filter: blur(16px);
        border-top: 1px solid var(--border);
        box-shadow: 0 -8px 28px rgba(0, 0, 0, 0.28);
    }
    .smart-scan-mobile-sticky-cta .btn {
        flex: 1 1 auto;
        min-width: 0;
        font-size: 0.85rem;
        padding: 10px 8px;
    }
    .smart-scan-mobile-sticky-cta .btn-primary {
        flex: 1.15 1 140px;
    }
    .smart-scan-desktop-only-cta {
        display: none !important;
    }
}

@media (max-width: 380px) {
    .smart-start-segment {
        grid-template-columns: 1fr;
    }
}

@media (min-width: 900px) {
    .smart-scan-mobile-sticky-cta {
        display: none !important;
    }
}
@keyframes smart-scan-saved-pulse {
    0% {
        box-shadow: 0 0 0 0 rgba(123, 140, 255, 0.45);
        border-color: var(--border);
    }
    30% {
        box-shadow: 0 0 0 5px rgba(123, 140, 255, 0.28), 0 12px 36px rgba(107, 95, 214, 0.25);
        border-color: color-mix(in srgb, var(--primary) 45%, var(--border));
    }
    100% {
        box-shadow: var(--card-shadow);
        border-color: var(--border);
    }
}

/* Global smart sync FAB (mobile, above bottom nav) — see refresh-fab.js */
.fitness-sync-fab-wrap {
    position: fixed;
    right: max(12px, env(safe-area-inset-right, 0px));
    bottom: calc(env(safe-area-inset-bottom, 0px) + 20px);
    z-index: 10002;
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    gap: 6px;
    pointer-events: none;
    opacity: 0;
    transform: translate3d(0, 10px, 0) scale(0.94);
    transition:
        opacity 0.35s ease,
        transform 0.38s cubic-bezier(0.22, 1, 0.36, 1);
}
body:has(.mobile-bottom-nav) .fitness-sync-fab-wrap {
    bottom: calc(
        var(--mobile-bottom-nav-height) + env(safe-area-inset-bottom, 0px) + 12px
    );
}
.fitness-sync-fab-wrap.is-visible {
    pointer-events: auto;
    opacity: 1;
    transform: translate3d(0, 0, 0) scale(1);
}
.fitness-sync-fab {
    position: relative;
    width: 48px;
    height: 48px;
    border-radius: 50%;
    border: 1px solid color-mix(in srgb, var(--primary-2) 42%, transparent);
    background: color-mix(in srgb, rgba(28, 22, 48, 0.55) 70%, rgba(255, 255, 255, 0.06));
    backdrop-filter: blur(16px);
    -webkit-backdrop-filter: blur(16px);
    color: color-mix(in srgb, var(--primary-2) 88%, #fff);
    box-shadow:
        0 0 0 1px rgba(255, 255, 255, 0.06) inset,
        0 8px 28px rgba(12, 8, 28, 0.45),
        0 0 24px color-mix(in srgb, var(--primary) 35%, transparent);
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0;
    -webkit-tap-highlight-color: transparent;
    transition:
        transform 0.22s ease,
        box-shadow 0.28s ease,
        border-color 0.25s ease;
    animation: fitness-sync-fab-breathe 3.2s ease-in-out infinite;
}
.fitness-sync-fab:hover {
    transform: translateY(-1px) scale(1.03);
    box-shadow:
        0 0 0 1px rgba(255, 255, 255, 0.1) inset,
        0 10px 32px rgba(12, 8, 28, 0.5),
        0 0 32px color-mix(in srgb, var(--primary-2) 42%, transparent);
}
.fitness-sync-fab:active {
    transform: scale(0.96);
}
.fitness-sync-fab.is-working .fitness-sync-fab__icon {
    animation: fitness-sync-fab-spin 0.75s linear infinite;
}
.fitness-sync-fab__glow {
    position: absolute;
    inset: -6px;
    border-radius: inherit;
    background: radial-gradient(
        circle at 35% 30%,
        color-mix(in srgb, var(--primary-2) 55%, transparent) 0%,
        transparent 62%
    );
    opacity: 0.55;
    pointer-events: none;
    z-index: 0;
}
.fitness-sync-fab__icon {
    position: relative;
    z-index: 1;
    font-size: 1.25rem;
    line-height: 1;
    font-weight: 600;
}
.fitness-sync-fab__hint {
    font-size: 11px;
    font-weight: 600;
    letter-spacing: 0.02em;
    color: color-mix(in srgb, var(--text-soft) 88%, var(--primary-2));
    text-shadow: 0 1px 10px rgba(0, 0, 0, 0.45);
    max-width: 120px;
    text-align: right;
    line-height: 1.2;
    opacity: 0.92;
}
@keyframes fitness-sync-fab-breathe {
    0%,
    100% {
        box-shadow:
            0 0 0 1px rgba(255, 255, 255, 0.06) inset,
            0 8px 28px rgba(12, 8, 28, 0.45),
            0 0 20px color-mix(in srgb, var(--primary) 28%, transparent);
    }
    50% {
        box-shadow:
            0 0 0 1px rgba(255, 255, 255, 0.08) inset,
            0 10px 30px rgba(12, 8, 28, 0.48),
            0 0 30px color-mix(in srgb, var(--primary-2) 38%, transparent);
    }
}
@keyframes fitness-sync-fab-spin {
    to {
        transform: rotate(360deg);
    }
}
@media (min-width: 900px) {
    .fitness-sync-fab-wrap {
        display: none !important;
    }
}

/* ——— Program library (trainer / scalable lists) ——— */
.program-lib-dashboard-top .dashboard-subtext {
    max-width: 52rem;
}
.program-lib-eyebrow {
    opacity: 0.85;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    font-size: 0.72rem;
}
.program-lib-h1 {
    font-size: clamp(1.35rem, 4vw, 1.6rem);
    margin: 0.2rem 0 0.35rem;
}
.program-lib-sub {
    margin: 0;
    font-size: 0.92rem;
    opacity: 0.88;
}
.program-lib-panel {
    padding-top: 12px;
}
.program-lib-toolbar {
    display: flex;
    flex-wrap: wrap;
    gap: 12px 14px;
    align-items: center;
    margin-bottom: 12px;
}
.program-lib-search {
    flex: 1 1 220px;
    min-width: 0;
    min-height: 42px;
    box-sizing: border-box;
    border-radius: 12px;
    border: 1px solid var(--border);
    background: var(--surface);
    color: var(--text);
    padding: 10px 12px;
    font-size: 0.95rem;
    line-height: 1.25;
}
.program-lib-toolbar-actions {
    display: flex;
    gap: 8px;
    align-items: center;
    margin-left: auto;
    flex-shrink: 0;
}
@media (max-width: 520px) {
    .program-lib-toolbar-actions {
        margin-left: 0;
        width: 100%;
        justify-content: flex-end;
    }
}
.program-lib-view-toggle {
    display: inline-flex;
    align-items: stretch;
    gap: 0;
    padding: 3px;
    border-radius: 12px;
    border: 1px solid var(--border);
    background: color-mix(in srgb, var(--surface-2) 94%, var(--surface));
    box-shadow: inset 0 1px 0 color-mix(in srgb, var(--text) 5%, transparent);
}
.program-lib-view-toggle .program-lib-view-toggle__btn {
    position: relative;
    z-index: 0;
    min-width: 42px;
    height: 40px;
    padding: 0 11px;
    margin: 0;
    border-radius: 9px;
    border: 1px solid transparent;
    background: transparent;
    color: var(--text-muted);
    opacity: 0.78;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    transition: background 0.15s ease, border-color 0.15s ease, color 0.15s ease, opacity 0.15s ease, box-shadow 0.15s ease;
    -webkit-tap-highlight-color: transparent;
}
.program-lib-view-toggle .program-lib-view-toggle__btn:hover {
    opacity: 1;
    color: var(--text);
    background: color-mix(in srgb, var(--text) 7%, transparent);
}
.program-lib-view-toggle .program-lib-view-toggle__btn:active {
    transform: scale(0.97);
}
.program-lib-view-toggle .program-lib-view-toggle__btn.is-active {
    z-index: 1;
    opacity: 1;
    color: var(--text);
    border-color: color-mix(in srgb, var(--primary) 48%, var(--border));
    background: color-mix(in srgb, var(--primary) 18%, var(--surface));
    box-shadow: 0 0 0 1px color-mix(in srgb, var(--primary) 38%, transparent), 0 1px 2px color-mix(in srgb, var(--text) 10%, transparent);
}
.program-lib-view-toggle .program-lib-view-toggle__btn.is-active .lucide-svg {
    color: var(--text);
    opacity: 1;
}
.program-lib-view-toggle .program-lib-view-toggle__btn .lucide-svg {
    flex-shrink: 0;
    opacity: 0.92;
}
.program-lib-view-toggle .program-lib-view-toggle__btn:focus-visible {
    outline: none;
    box-shadow: 0 0 0 2px var(--surface), 0 0 0 4px color-mix(in srgb, var(--primary) 55%, var(--border));
}
.program-lib-view-toggle .program-lib-view-toggle__btn.btn:hover {
    transform: none;
}
.program-lib-view-toggle .program-lib-view-toggle__btn.btn-outline:hover {
    border-color: transparent;
    color: var(--text);
    background: color-mix(in srgb, var(--text) 7%, transparent);
}
.program-lib-view-toggle .program-lib-view-toggle__btn.btn-outline.is-active:hover {
    border-color: color-mix(in srgb, var(--primary) 48%, var(--border));
    background: color-mix(in srgb, var(--primary) 20%, var(--surface));
    color: var(--text);
}
.btn-icon {
    min-width: 42px;
    padding: 8px 10px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
}
.btn-sm {
    padding: 6px 12px;
    font-size: 0.85rem;
    border-radius: 8px;
}
.measurements-hero-toolbar .btn.btn-sm.measurements-secondary-cta {
    padding: 6px 11px;
    font-size: 0.8125rem;
    border-radius: 10px;
    border-color: color-mix(in srgb, var(--border) 85%, transparent);
    background: color-mix(in srgb, var(--surface-2) 92%, var(--surface));
    color: var(--text-soft);
    font-weight: 500;
}
.measurements-hero-toolbar .btn.btn-sm.measurements-secondary-cta:hover {
    border-color: var(--border);
    color: var(--text);
    background: var(--surface-2);
}
.program-lib-chip-scroll {
    display: flex;
    gap: 8px;
    overflow-x: auto;
    padding-bottom: 4px;
    margin-bottom: 8px;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: thin;
}
.program-lib-chip-scroll--grow {
    flex: 1;
    min-width: 0;
}
.program-lib-chip {
    flex: 0 0 auto;
    border-radius: 999px;
    border: 1px solid var(--border);
    background: var(--surface);
    color: var(--text);
    font-size: 0.82rem;
    padding: 7px 14px;
    cursor: pointer;
    white-space: nowrap;
}
.program-lib-chip.is-active {
    border-color: color-mix(in srgb, var(--primary) 55%, var(--border));
    background: color-mix(in srgb, var(--primary) 18%, var(--surface));
}
.program-lib-chip-scroll--single {
    margin-bottom: 10px;
}
.program-lib-kind-toggle {
    margin-bottom: 4px;
}
.program-lib-chip--link {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    text-decoration: none;
}
.program-lib-chip--link:hover {
    border-color: color-mix(in srgb, var(--primary) 40%, var(--border));
}
.program-lib-kind-hint {
    margin: 0 0 12px;
    font-size: 0.86rem;
    opacity: 0.88;
}
.program-lib-loading,
.program-lib-empty {
    margin: 8px 0;
}
.program-lib-error-wrap {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    flex-wrap: wrap;
    padding: 10px 12px;
    margin: 0 0 10px;
    border-radius: 10px;
    border: 1px solid color-mix(in srgb, #dc2626 35%, var(--border));
    background: color-mix(in srgb, #dc2626 8%, var(--surface));
}
.program-lib-error-wrap[hidden] {
    display: none !important;
}
.program-lib-error-wrap .program-lib-error-text {
    margin: 0;
    flex: 1;
    min-width: 0;
    color: var(--text);
    font-size: 0.86rem;
    line-height: 1.35;
}
.program-lib-desc {
    margin: 0 0 6px;
    color: var(--text-muted);
    font-size: 0.78rem;
    line-height: 1.35;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}
.program-lib-list {
    display: grid;
    gap: 6px;
}
.program-lib-list--cards {
    grid-template-columns: 1fr;
}
@media (min-width: 720px) {
    .program-lib-list--cards:not(.program-lib-list--compact) {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}
.program-lib-list--compact {
    grid-template-columns: 1fr;
}
.program-lib-card {
    border: 1px solid var(--border);
    border-radius: 12px;
    padding: 6px 8px;
    background: var(--surface-2);
    display: grid;
    gap: 4px;
    align-content: start;
}
.program-lib-card--compact {
    padding: 5px 6px;
    gap: 2px;
    border-radius: 10px;
}
.program-lib-card-inner {
    position: relative;
    min-width: 0;
}
.program-lib-card-hit {
    display: block;
    text-decoration: none;
    color: inherit;
    padding: 6px 40px 6px 6px;
    border-radius: 10px;
    margin: -2px;
    -webkit-tap-highlight-color: transparent;
}
.program-lib-card-hit:hover {
    background: color-mix(in srgb, var(--text) 5%, transparent);
}
.program-lib-title--in-hit {
    margin: 0 0 4px;
    font-weight: 600;
    font-size: 0.94rem;
    line-height: 1.25;
    color: var(--text);
}
.program-lib-card--compact .program-lib-title--in-hit {
    font-size: 0.88rem;
    margin-bottom: 2px;
}
.program-lib-meta--tight {
    margin: 0;
    font-size: 0.74rem;
    color: var(--text-muted);
    line-height: 1.3;
}
.program-lib-quick-menu {
    position: absolute;
    top: 0;
    right: 0;
    z-index: 5;
}
.program-lib-quick-menu[open] {
    z-index: 10050;
}
.program-lib-card:has(.program-lib-quick-menu[open]),
.nutrition-plan-card:has(.program-lib-quick-menu[open]) {
    position: relative;
    z-index: 10050;
}
.program-lib-quick-menu-btn {
    list-style: none;
    width: 36px;
    height: 36px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 10px;
    border: 1px solid transparent;
    background: transparent;
    cursor: pointer;
    color: var(--text-muted);
    font-size: 1.2rem;
    line-height: 1;
    user-select: none;
}
.program-lib-quick-menu-btn:hover {
    border-color: var(--border);
    background: var(--surface);
    color: var(--text);
}
.program-lib-quick-menu summary::-webkit-details-marker {
    display: none;
}
.program-lib-quick-menu-body {
    position: absolute;
    right: 0;
    top: calc(100% + 4px);
    z-index: 10051;
    min-width: 168px;
    padding: 6px;
    border: 1px solid var(--border-strong);
    border-radius: 12px;
    background: var(--surface);
    box-shadow: var(--card-shadow);
}
.program-lib-quick-menu-body.is-dropup {
    top: auto;
    bottom: calc(100% + 4px);
}
.program-lib-quick-form {
    margin: 0;
}
.program-lib-quick-menu-item {
    display: block;
    width: 100%;
    text-align: left;
    border: none;
    border-radius: 8px;
    background: transparent;
    color: var(--text);
    font-size: 0.86rem;
    padding: 10px 12px;
    cursor: pointer;
    font-family: inherit;
}
.program-lib-quick-menu-item:hover {
    background: var(--surface-2);
}
.program-lib-quick-menu-item--danger {
    color: #dc2626;
}
.program-lib-card--compact .program-lib-card-hit {
    padding: 4px 34px 4px 4px;
}
.program-lib-card--compact .program-lib-quick-menu-btn {
    width: 32px;
    height: 32px;
    font-size: 1.05rem;
}
.program-lib-card-top {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 8px;
}
.program-lib-title {
    font-weight: 600;
    font-size: 0.98rem;
    margin: 0;
    color: var(--text);
    text-decoration: none;
    line-height: 1.25;
    flex: 1;
    min-width: 0;
}
.program-lib-card--compact .program-lib-title {
    font-size: 0.92rem;
}
.program-lib-meta {
    font-size: 0.78rem;
    color: var(--text-muted);
    line-height: 1.35;
}
.program-lib-desc {
    margin: 0;
    font-size: 0.8rem;
    color: var(--text-muted);
    line-height: 1.3;
}
.line-clamp-2 {
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}
.program-lib-card-actions {
    display: flex;
    gap: 8px;
    flex-wrap: wrap;
    align-items: center;
}
.program-lib-open {
    flex: 0 0 auto;
}
.program-lib-menu {
    position: relative;
    flex: 0 0 auto;
}
.program-lib-menu-trigger {
    list-style: none;
    border: 1px solid var(--border);
    border-radius: 10px;
    background: var(--surface);
    padding: 6px 10px;
    cursor: pointer;
    font-size: 1.1rem;
    line-height: 1;
    color: var(--text-muted);
}
.program-lib-menu summary::-webkit-details-marker {
    display: none;
}
.program-lib-menu-body {
    position: absolute;
    right: 0;
    top: calc(100% + 6px);
    z-index: 20;
    min-width: 240px;
    max-width: min(92vw, 320px);
    padding: 10px;
    border: 1px solid var(--border-strong);
    border-radius: 12px;
    background: var(--surface);
    box-shadow: var(--card-shadow);
}
.program-lib-menu-form {
    margin: 0 0 10px;
}
.program-lib-menu-form:last-child {
    margin-bottom: 0;
}
.program-lib-menu-form label {
    display: block;
    font-size: 0.75rem;
    color: var(--text-muted);
    margin: 6px 0 4px;
}
.program-lib-menu-form input,
.program-lib-menu-form textarea,
.program-lib-menu-form select {
    width: 100%;
    box-sizing: border-box;
    border-radius: 8px;
    border: 1px solid var(--border);
    background: var(--surface-2);
    color: var(--text);
    padding: 7px 9px;
    font-size: 0.88rem;
}
.program-lib-danger {
    color: #dc2626;
}
.program-lib-sentinel {
    height: 1px;
    margin-top: 4px;
}
.program-lib-load-more-wrap {
    display: flex;
    justify-content: center;
    margin-top: 10px;
}
/* Media library (reuses program-lib list/cards) */
.program-lib-card-thumb-wrap {
    margin-bottom: 10px;
}
.program-lib-card-thumb {
    width: 100%;
    max-height: 160px;
    object-fit: cover;
    border-radius: 12px;
    border: 1px solid var(--border);
    display: block;
}
.program-lib-card--compact .program-lib-card-thumb {
    max-height: 88px;
}
.program-lib-title--static {
    display: block;
    font-weight: 600;
    font-size: 1rem;
    line-height: 1.35;
    color: var(--text);
}
.program-lib-meta--stack > div {
    display: flex;
    justify-content: space-between;
    gap: 10px;
    font-size: 0.88rem;
    margin-bottom: 4px;
}
.program-lib-meta--stack > div:last-child {
    margin-bottom: 0;
}
.program-lib-meta--stack span {
    color: var(--muted);
}
.program-lib-card-actions--split {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    align-items: center;
}
.program-lib-inline-delete {
    margin: 0;
}
#trainer-media-library .program-lib-card--compact,
#client-media-library .program-lib-card--compact {
    display: flex;
    flex-direction: row;
    align-items: center;
    flex-wrap: nowrap;
    gap: 10px 12px;
    padding: 8px 10px;
}
#trainer-media-library .program-lib-card--compact .program-lib-card-main,
#client-media-library .program-lib-card--compact .program-lib-card-main {
    flex: 1;
    min-width: 0;
    display: grid;
    column-gap: 10px;
    row-gap: 2px;
    align-items: center;
}
#trainer-media-library .program-lib-card--compact .program-lib-card-main:has(.program-lib-card-thumb-wrap),
#client-media-library .program-lib-card--compact .program-lib-card-main:has(.program-lib-card-thumb-wrap) {
    grid-template-columns: 64px minmax(0, 1fr);
}
#trainer-media-library .program-lib-card--compact .program-lib-card-main:has(.program-lib-card-thumb-wrap) .program-lib-card-thumb-wrap,
#client-media-library .program-lib-card--compact .program-lib-card-main:has(.program-lib-card-thumb-wrap) .program-lib-card-thumb-wrap {
    grid-row: 1 / span 2;
    grid-column: 1;
    margin: 0;
}
#trainer-media-library .program-lib-card--compact .program-lib-card-main:has(.program-lib-card-thumb-wrap) .program-lib-card-thumb,
#client-media-library .program-lib-card--compact .program-lib-card-main:has(.program-lib-card-thumb-wrap) .program-lib-card-thumb {
    width: 64px;
    height: 48px;
    max-height: 48px;
    object-fit: cover;
}
#trainer-media-library .program-lib-card--compact .program-lib-card-main:has(.program-lib-card-thumb-wrap) .program-lib-card-top,
#client-media-library .program-lib-card--compact .program-lib-card-main:has(.program-lib-card-thumb-wrap) .program-lib-card-top {
    grid-column: 2;
    grid-row: 1;
    margin: 0;
}
#trainer-media-library .program-lib-card--compact .program-lib-card-main:has(.program-lib-card-thumb-wrap) .program-lib-meta--stack,
#client-media-library .program-lib-card--compact .program-lib-card-main:has(.program-lib-card-thumb-wrap) .program-lib-meta--stack {
    grid-column: 2;
    grid-row: 2;
}
#trainer-media-library .program-lib-card--compact .program-lib-card-main:not(:has(.program-lib-card-thumb-wrap)),
#client-media-library .program-lib-card--compact .program-lib-card-main:not(:has(.program-lib-card-thumb-wrap)) {
    grid-template-columns: minmax(0, 1fr);
}
#trainer-media-library .program-lib-card--compact .program-lib-meta--stack > div,
#client-media-library .program-lib-card--compact .program-lib-meta--stack > div {
    display: inline-flex;
    gap: 6px;
    align-items: baseline;
    margin-right: 12px;
    margin-bottom: 0;
    font-size: 0.78rem;
}
#trainer-media-library .program-lib-card--compact .program-lib-meta--stack > div:last-child,
#client-media-library .program-lib-card--compact .program-lib-meta--stack > div:last-child {
    margin-right: 0;
}
#trainer-media-library .program-lib-card--compact .program-lib-title--static,
#client-media-library .program-lib-card--compact .program-lib-title--static {
    font-size: 0.92rem;
    line-height: 1.25;
    display: -webkit-box;
    -webkit-line-clamp: 1;
    -webkit-box-orient: vertical;
    overflow: hidden;
}
#trainer-media-library .program-lib-card--compact .program-lib-card-actions,
#client-media-library .program-lib-card--compact .program-lib-card-actions {
    flex-shrink: 0;
    margin: 0;
    flex-wrap: nowrap;
}
@media (max-width: 480px) {
    #trainer-media-library .program-lib-card--compact,
    #client-media-library .program-lib-card--compact {
        flex-wrap: wrap;
    }
    #trainer-media-library .program-lib-card--compact .program-lib-card-actions,
    #client-media-library .program-lib-card--compact .program-lib-card-actions {
        width: 100%;
        justify-content: flex-end;
        flex-wrap: wrap;
    }
}

/* Support hub: compact /support page (burger only; no floating FAB) */
.clients-assign-program-banner {
    margin: 0 0 12px;
    padding: 10px 12px;
    border-radius: 12px;
    border: 1px solid color-mix(in srgb, var(--primary) 35%, var(--border));
    background: color-mix(in srgb, var(--primary) 10%, var(--surface));
    font-size: 0.9rem;
    line-height: 1.4;
}
.support-hub.section {
    padding-top: 20px;
    padding-bottom: 32px;
}
.support-hub-panel {
    max-width: 440px;
    margin: 0 auto;
    padding: 20px 18px 22px;
}
.support-hub__title {
    font-size: 1.28rem;
    font-weight: 600;
    margin: 0 0 8px;
    line-height: 1.25;
}
.support-hub__lead {
    font-size: 0.95rem;
    color: color-mix(in srgb, var(--text) 70%, var(--text-muted));
    margin: 0 0 20px;
    line-height: 1.45;
}
.support-hub__cta {
    margin-bottom: 16px;
}
.support-hub__cta-main {
    min-height: 48px;
    font-size: 1.02rem;
    font-weight: 600;
    padding-top: 12px;
    padding-bottom: 12px;
}
.support-hub__email-secondary {
    margin: 0;
    font-size: 0.88rem;
    text-align: center;
}
.support-hub__email-link {
    color: color-mix(in srgb, var(--text) 78%, var(--text-muted));
    text-decoration: none;
    word-break: break-all;
}
.support-hub__email-link:hover {
    color: var(--primary-2);
    text-decoration: underline;
}

/* Landing — clean / premium */
.landing-clean .landing-hero-grid {
    grid-template-columns: 1fr;
    gap: 40px;
    max-width: 1080px;
    margin: 0 auto;
    align-items: center;
}
.landing-clean .landing-hero-compact .hero-copy h1 {
    font-size: clamp(2rem, 5.5vw, 3.25rem);
    letter-spacing: -0.045em;
}
.landing-clean .landing-hero-compact .hero-text {
    max-width: 40ch;
    font-size: 1.05rem;
    line-height: 1.6;
}
.landing-clean .hero-trust-line {
    margin-top: 22px;
    font-size: 0.88rem;
    color: var(--text-muted);
    letter-spacing: 0.01em;
}
.landing-hero-visual {
    width: 100%;
    max-width: 300px;
    margin: 0 auto;
}
.landing-hero-device {
    padding: 10px;
    border-radius: 28px;
    background: color-mix(in srgb, var(--surface-2) 55%, transparent);
    box-shadow:
        0 24px 64px rgba(15, 23, 42, 0.28),
        0 0 0 1px color-mix(in srgb, var(--border) 70%, transparent);
}
.landing-hero-device__screen {
    aspect-ratio: 9 / 16;
    border-radius: 20px;
    background:
        url("./landing/gym-scan-hero-2.jpg") center top / cover no-repeat,
        var(--surface-2);
}
.landing-flow .landing-hero-compact {
    padding-bottom: 32px;
}
.landing-section-title {
    margin: 0 0 12px;
    font-size: clamp(1.25rem, 3vw, 1.6rem);
    font-weight: 700;
    letter-spacing: -0.03em;
}
.landing-section-lead {
    margin: 0 0 24px;
    max-width: 42ch;
    color: var(--text-soft);
    font-size: 0.92rem;
    line-height: 1.55;
}
.landing-how-simple {
    padding: 28px 0 32px;
    border-top: 1px solid color-mix(in srgb, var(--border) 55%, transparent);
}
.landing-how-simple__steps {
    margin: 0;
    padding: 0;
    list-style: none;
    display: grid;
    gap: 16px;
    max-width: 960px;
    margin-left: auto;
    margin-right: auto;
}
.landing-how-simple__steps li {
    display: grid;
    grid-template-columns: 36px minmax(0, 1fr);
    gap: 16px;
    align-items: start;
}
.landing-how-simple__num {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 36px;
    height: 36px;
    border-radius: 10px;
    font-size: 0.9rem;
    font-weight: 700;
    color: var(--text-soft);
    background: color-mix(in srgb, var(--surface-2) 80%, transparent);
}
.landing-how-simple__steps strong {
    display: block;
    margin-bottom: 6px;
    font-size: 1rem;
    font-weight: 600;
    color: var(--text);
}
.landing-how-simple__steps p {
    margin: 0;
    font-size: 0.9rem;
    line-height: 1.5;
    color: var(--text-soft);
}
.landing-gym-horizontal {
    display: block;
    width: 100%;
    aspect-ratio: 16 / 10;
    min-height: 200px;
    border-radius: 14px;

    background-position: center;
    background-size: cover;
    background-repeat: no-repeat;
    background-color: var(--surface-2);

    border: 1px solid var(--border);
    box-shadow: 0 16px 40px rgba(15, 23, 42, 0.18);

    text-decoration: none;
}

.landing-scan-hero-shot {
    background-image: url("./landing/gym-scan-hero-1.jpg");
}

.landing-gym-vertical {
    width: 100%;
    max-width: 320px;

    aspect-ratio: 9 / 16;

    border-radius: 22px;
    border: 1px solid var(--border);

    background-image: url("./landing/gym-scan-example.jpg");
    background-position: center top;
    background-size: cover;
    background-repeat: no-repeat;

    background-color: var(--surface-2);

    box-shadow: 0 18px 44px rgba(15, 23, 42, 0.18);

    margin: 0 auto;
}
.landing-story {
    padding: 8px 0 40px;
}
.landing-story__stack {
    display: flex;
    flex-direction: column;
    gap: 48px;
    max-width: 1040px;
    margin: 0 auto;
}
.landing-split {
    display: grid;
    gap: 24px;
    align-items: center;
}
.landing-split__copy h2 {
    margin: 0 0 10px;
    font-size: clamp(1.25rem, 3.2vw, 1.65rem);
    font-weight: 700;
    letter-spacing: -0.03em;
    line-height: 1.15;
}
.landing-split__copy > p:not(.landing-split__step) {
    margin: 0 0 16px;
    max-width: 38ch;
    color: var(--text-soft);
    font-size: 0.94rem;
    line-height: 1.55;
}
.landing-split__step {
    margin: 0 0 8px;
    font-size: 0.72rem;
    font-weight: 600;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    color: var(--text-muted);
}
.landing-split__media {
    width: 100%;
    justify-self: center;
}
.landing-split__media--wide {
    max-width: 520px;
}
.landing-split__media--progress {
    max-width: 360px;
}
.landing-device {
    margin: 0 auto;
    padding: 8px;
    border-radius: 22px;
    background: color-mix(in srgb, var(--surface-2) 50%, transparent);
    box-shadow: 0 14px 36px rgba(15, 23, 42, 0.2);
    max-width: 240px;
}
.landing-device__screen {
    width: 100%;
    aspect-ratio: 9 / 16;
    border-radius: 16px;
    background-color: var(--surface-2);
    background-position: center top;
    background-size: cover;
    background-repeat: no-repeat;
}
.landing-device__screen--workout {
    background-image: url("./landing/web-workout-preview.jpg");
}
.landing-device__screen--telegram {
    background-image: url("./landing/telegram-preview.jpg");
}
.landing-progress-visual {
    width: 100%;
    min-height: 280px;
    aspect-ratio: 4 / 5;
    max-height: 380px;
    border-radius: 14px;
    border: none;
    box-shadow: 0 16px 40px rgba(15, 23, 42, 0.2);
}
.landing-bullets {
    margin: 0 0 16px;
    padding: 0;
    list-style: none;
    display: grid;
    gap: 8px;
    max-width: 36ch;
}
.landing-bullets li {
    position: relative;
    padding-left: 14px;
    font-size: 0.88rem;
    line-height: 1.45;
    color: var(--text-soft);
}
.landing-bullets li::before {
    content: "";
    position: absolute;
    left: 0;
    top: 0.55em;
    width: 5px;
    height: 5px;
    border-radius: 50%;
    background: var(--primary);
    opacity: 0.85;
}
.landing-bullets--compact {
    margin-bottom: 14px;
}
.landing-mini-stats {
    display: flex;
    flex-wrap: wrap;
    gap: 16px 24px;
}
.landing-mini-stats div {
    display: flex;
    flex-direction: column;
    gap: 2px;
}
.landing-mini-stats strong {
    font-size: 1rem;
    font-weight: 700;
    color: var(--text);
    letter-spacing: -0.02em;
}
.landing-mini-stats span {
    font-size: 0.75rem;
    color: var(--text-muted);
}
.landing-split--center {
    padding: 24px 0 8px;
    border-top: 1px solid color-mix(in srgb, var(--border) 50%, transparent);
}
.landing-split__copy--center {
    text-align: center;
    max-width: 420px;
    margin: 0 auto;
}
.landing-split__copy--center > p:not(.landing-split__step) {
    margin-left: auto;
    margin-right: auto;
}
.landing-ecosystem {
    padding: 36px 0 40px;
    border-top: 1px solid color-mix(in srgb, var(--border) 50%, transparent);
    border-bottom: 1px solid color-mix(in srgb, var(--border) 50%, transparent);
}
.landing-ecosystem__inner {
    max-width: 52ch;
    margin: 0 auto;
    text-align: center;
}
.landing-ecosystem__inner h2 {
    margin: 0 0 10px;
    font-size: clamp(1.1rem, 2.5vw, 1.4rem);
    font-weight: 700;
    letter-spacing: -0.03em;
}
.landing-ecosystem__inner p {
    margin: 0;
    font-size: 0.94rem;
    line-height: 1.55;
    color: var(--text-soft);
}
.landing-trainers-strip {
    padding: 40px 0;
}
.landing-trainers-strip__inner {
    display: flex;
    flex-direction: column;
    gap: 20px;
    max-width: 720px;
    margin: 0 auto;
    text-align: center;
}
.landing-trainers-strip__inner .landing-section-title {
    margin-bottom: 10px;
    text-align: center;
}
.landing-trainers-strip__inner p {
    margin: 0;
    color: var(--text-soft);
    font-size: 0.95rem;
    line-height: 1.55;
}
.landing-trainers-strip__inner .btn {
    align-self: center;
}
.landing-pricing-section {
    padding: 40px 0 48px;
}
.landing-price-panel {
    padding: 28px;
    border-radius: 20px;
    border: 1px solid color-mix(in srgb, var(--border) 75%, transparent);
    background: color-mix(in srgb, var(--surface) 50%, transparent);
}
.landing-price-panel--muted {
    opacity: 0.92;
    border-color: color-mix(in srgb, var(--border) 50%, transparent);
    background: transparent;
}
.landing-price-panel__price {
    margin: 0 0 8px;
    font-size: 1.15rem;
}
.landing-clean .cta-box .eyebrow {
    display: none;
}
@media (min-width: 900px) {
    .landing-clean .landing-hero-grid {
        grid-template-columns: minmax(0, 1.05fr) minmax(280px, 0.85fr);
        gap: 56px;
        text-align: left;
    }
    .landing-clean .landing-hero-compact .hero-actions--landing-split {
        justify-content: flex-start;
    }
    .landing-clean .hero-trust-line {
        text-align: left;
    }
    .landing-hero-visual {
        margin: 0;
        max-width: none;
        justify-self: end;
    }
    .landing-how-simple__steps {
        grid-template-columns: repeat(3, minmax(0, 1fr));
        gap: 20px;
    }
    .landing-how-simple__steps li {
        grid-template-columns: 36px minmax(0, 1fr);
        gap: 14px;
    }
    .landing-story__stack {
        gap: 56px;
    }
    .landing-split {
        grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
        gap: 40px;
    }
    .landing-split--flip .landing-split__copy {
        order: 2;
    }
    .landing-split--flip .landing-split__media {
        order: 1;
    }
    .landing-split__media--wide {
        justify-self: stretch;
        max-width: none;
    }
    .landing-device {
        max-width: 260px;
        justify-self: center;
    }
    .landing-split--flip .landing-device {
        justify-self: center;
    }
    .landing-progress-visual {
        min-height: 320px;
        max-height: 420px;
    }
    .landing-section-title,
    .landing-section-lead {
        text-align: left;
    }
    .landing-trainers-strip__inner {
        flex-direction: row;
        align-items: center;
        justify-content: space-between;
        max-width: 960px;
        text-align: left;
    }
    .landing-trainers-strip__inner .landing-section-title {
        text-align: left;
    }
}
.landing-hero-eyebrow {
    display: inline-block;
    margin: 0 0 10px;
    padding: 5px 10px;
    border-radius: 999px;
    font-size: 0.72rem;
    font-weight: 700;
    color: var(--text-soft);
    background: var(--surface);
    border: 1px solid var(--border);
}
.landing-cold-mobile .section-tight {
    padding-top: 40px;
    padding-bottom: 40px;
}
.landing-cold-mobile .section-head--compact {
    margin-bottom: 18px;
}
.landing-cold-mobile .section-head--compact h2 {
    font-size: 1.35rem;
}
.landing-previews {
    display: flex;
    flex-direction: column;
    gap: 16px;
    max-width: 340px;
    margin: 0 auto;
}
.landing-preview-block {
    display: flex;
    flex-direction: column;
    gap: 14px;
    padding: 20px;
    border-radius: 20px;
    background: color-mix(in srgb, var(--surface) 96%, transparent);
    border: 1px solid color-mix(in srgb, var(--border) 90%, transparent);
    text-decoration: none;
    color: inherit;
}
a.landing-preview-block:hover {
    border-color: color-mix(in srgb, var(--primary) 30%, var(--border));
}
.landing-preview-block__head {
    display: flex;
    gap: 12px;
    align-items: flex-start;
}
.landing-preview-block__icon {
    font-size: 1.35rem;
    line-height: 1;
}
.landing-preview-block__head h3 {
    margin: 0 0 4px;
    font-size: 1rem;
    font-weight: 800;
}
.landing-preview-block__head p {
    margin: 0;
    font-size: 0.86rem;
    line-height: 1.45;
    color: var(--text-soft);
}
.landing-plan-snippet {
    padding: 14px;
    border-radius: 14px;
    background: var(--surface-2);
    border: 1px solid var(--border);
    font-size: 0.86rem;
    color: var(--text-soft);
}
.landing-plan-snippet__kicker {
    margin: 0 0 6px;
    font-size: 0.65rem;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    color: var(--primary);
}
.landing-plan-snippet strong {
    display: block;
    margin-bottom: 4px;
    font-size: 0.95rem;
    color: var(--text);
}

/* Vertical phone previews: narrow frame = photo aspect, not full card width */
.landing-preview-block--workout-sample,
.landing-preview-block--telegram {
    align-items: center;
}
.landing-preview-block--workout-sample .landing-preview-block__head,
.landing-preview-block--telegram .landing-preview-block__head {
    align-self: stretch;
    width: 100%;
}
.landing-phone-frame {
    --landing-phone-w: clamp(168px, 58vw, 228px);
    width: var(--landing-phone-w);
    max-width: 100%;
    margin-left: auto;
    margin-right: auto;
    padding: 8px;
    border-radius: 24px;
    background: color-mix(in srgb, var(--surface-2) 80%, var(--bg));
    border: 1px solid var(--border);
    box-sizing: border-box;
}
.landing-phone-screen {
    width: 100%;
    border-radius: 18px;
    border: 1px solid var(--border);
    background-color: var(--surface-2);
    background-repeat: no-repeat;
    background-position: center top;
    background-size: cover;
    overflow: hidden;
    position: relative;
}
.landing-phone-screen--workout-sample {
    aspect-ratio: 9 / 16;
    background-image: url("./landing/gym-scan-hero-2.jpg");
    display: flex;
    flex-direction: column;
    justify-content: flex-end;
}
.landing-phone-ui {
    margin: 12px;
    padding: 12px;
    border-radius: 14px;
    background: color-mix(in srgb, var(--surface) 92%, transparent);
    border: 1px solid var(--border);
    font-size: 0.8rem;
    color: var(--text-soft);
}
.landing-phone-ui--overlay strong {
    display: block;
    margin-bottom: 4px;
    font-size: 0.88rem;
    color: var(--text);
}
.landing-phone-ui--overlay span {
    font-size: 0.78rem;
}
.landing-tg-chat {
    width: 100%;
    display: flex;
    flex-direction: column;
    gap: 8px;
}
.landing-phone-frame--telegram {
    padding: 8px;
}
.landing-telegram-phone {
    width: 100%;
    aspect-ratio: 9 / 16;
    border-radius: 18px;
    border: 1px solid var(--border);
    background-color: var(--surface-2);
    background-image: url("./landing/telegram-preview.jpg");
    background-repeat: no-repeat;
    background-position: center top;
    background-size: cover;
}
.landing-tg-bubble {
    max-width: 92%;
    padding: 10px 12px;
    border-radius: 14px 14px 14px 4px;
    font-size: 0.78rem;
    line-height: 1.35;
    background: var(--surface);
    border: 1px solid var(--border);
    color: var(--text-soft);
}
.landing-tg-bubble--done {
    align-self: flex-end;
    border-radius: 14px 14px 4px 14px;
    background: color-mix(in srgb, var(--primary) 12%, var(--surface));
    color: var(--text);
    font-weight: 700;
}
.landing-tg-bubble--streak {
    align-self: center;
    border-radius: 999px;
    font-weight: 700;
}
.landing-progress-compact {
    width: 100%;
    max-width: 260px;
    margin: 0 auto;
    aspect-ratio: 9 / 14;
    max-height: 300px;
    min-height: 0;
    border-radius: 20px;
    border: 1px solid var(--border);
    display: flex;
    align-items: flex-end;
    padding: 10px;
    box-shadow: none;
}
.landing-preview-block--progress .landing-preview-block__head {
    margin-bottom: 4px;
}
.landing-progress-phone__pill {
    position: relative;
    z-index: 1;
    padding: 6px 10px;
    border-radius: 999px;
    font-size: 0.7rem;
    font-weight: 700;
    background: var(--surface);
    border: 1px solid var(--border);
    color: var(--text-soft);
}
.landing-benefits-row {
    grid-template-columns: 1fr;
    gap: 12px;
    max-width: 420px;
    margin: 0 auto;
}
.landing-steps-compact .step-card {
    padding: 16px;
}
.landing-pricing-stack {
    grid-template-columns: 1fr;
    gap: 16px;
    max-width: 420px;
    margin: 0 auto;
}
.landing-coach-pricing {
    opacity: 0.92;
}
@media (min-width: 900px) {
    .landing-clean .landing-pricing-stack {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        max-width: 720px;
        margin-left: auto;
        margin-right: auto;
    }
}

/* Cold mobile landing — home-first */
.landing-clean.hero--home-primary .landing-hero-grid,
.hero--home-primary .landing-hero-grid {
    text-align: center;
}
.hero--home-primary .hero-copy {
    max-width: 100%;
}
.hero--home-primary .hero-copy h1 {
    font-size: clamp(1.75rem, 6.5vw, 2.5rem);
    line-height: 1.08;
    letter-spacing: -0.04em;
}
.hero--home-primary .hero-text {
    font-size: 1rem;
    line-height: 1.55;
    margin: 0 auto;
    max-width: 34ch;
}
.hero-actions--primary-only {
    justify-content: center;
    margin-top: 22px;
}
.hero-actions--primary-only .btn-primary {
    width: 100%;
    max-width: 320px;
    min-height: 52px;
    font-size: 1.05rem;
}
.hero-secondary-scan {
    margin: 14px 0 0;
    text-align: center;
}
.hero-scan-link {
    color: var(--text-muted);
    font-size: 0.92rem;
    font-weight: 700;
    text-decoration: underline;
    text-underline-offset: 3px;
}
.hero-scan-link:hover {
    color: var(--primary);
}
.hero-scan-link--advanced {
    font-size: 0.78rem;
    font-weight: 600;
    opacity: 0.55;
    text-decoration: none;
}
.hero-scan-link--advanced:hover {
    opacity: 0.85;
    color: var(--text-muted);
}
.hero-trust-line {
    margin: 18px 0 0;
    color: var(--text-muted);
    font-size: 0.88rem;
    text-align: center;
}
.hero-scan-link--light {
    color: rgba(255, 255, 255, 0.75);
}
.cta-actions--solo {
    flex-direction: column;
    align-items: stretch;
    gap: 12px;
}
.hero-how-steps--mobile {
    display: none;
    margin-top: 22px;
    gap: 10px;
}
@media (max-width: 899px) {
    .landing-cold-mobile .hero {
        padding-top: 28px;
        padding-bottom: 32px;
    }
    .landing-split--flip .landing-split__copy {
        order: -1;
    }
    .landing-story__stack {
        gap: 40px;
    }
    .hero-how-steps--mobile .hero-how-step {
        display: flex;
        align-items: flex-start;
        gap: 10px;
        text-align: left;
    }
    .hero-how-steps--mobile .hero-how-step span {
        flex-shrink: 0;
        width: 28px;
        height: 28px;
        display: inline-flex;
        align-items: center;
        justify-content: center;
        border-radius: 999px;
        background: color-mix(in srgb, var(--primary) 14%, var(--surface));
        color: var(--primary);
        font-weight: 900;
        font-size: 0.82rem;
    }
    .hero-how-steps--mobile .hero-how-step p {
        margin: 4px 0 0;
        font-size: 0.88rem;
        color: var(--text-soft);
        line-height: 1.4;
    }
    .landing-hero-coach-only {
        font-size: 0.88rem;
    }
    .landing-mode-card--coach {
        order: 2;
    }
}
@media (min-width: 900px) {
    .hero--home-primary .hero-grid {
        text-align: left;
    }
    .hero-actions--primary-only {
        justify-content: flex-start;
    }
    .hero-secondary-scan,
    .hero-trust-line {
        text-align: left;
    }
}

/* Public /start onboarding wizard */
.start-onboarding-page {
    padding: 20px 0 48px;
    min-height: calc(100vh - 72px);
}
.start-onboarding-shell {
    max-width: 520px;
    margin: 0 auto;
}
.start-onboarding-progress {
    display: flex;
    gap: 8px;
    justify-content: center;
    margin-bottom: 24px;
}
.start-onboarding-dot {
    width: 8px;
    height: 8px;
    border-radius: 999px;
    background: color-mix(in srgb, var(--text-muted) 35%, transparent);
}
.start-onboarding-dot.is-active {
    width: 22px;
    background: var(--primary);
}
.start-onboarding-step {
    display: none;
}
.start-onboarding-step.is-active {
    display: block;
}
.start-onboarding-step h1 {
    margin: 0 0 10px;
    font-size: clamp(1.5rem, 5.5vw, 2rem);
    line-height: 1.12;
    letter-spacing: -0.03em;
}
.start-onboarding-kicker {
    margin: 0 0 8px;
    color: var(--primary);
    font-size: 0.78rem;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: 0.06em;
}
.start-onboarding-lead {
    margin: 0 0 20px;
    color: var(--text-soft);
    font-size: 0.98rem;
    line-height: 1.5;
}
.start-onboarding-choices {
    display: grid;
    gap: 10px;
}
.start-onboarding-choices--compact {
    grid-template-columns: 1fr 1fr;
}
.start-choice-card {
    display: block;
    width: 100%;
    text-align: left;
    padding: 16px 18px;
    border-radius: 16px;
    border: 1px solid color-mix(in srgb, var(--border) 85%, transparent);
    background: color-mix(in srgb, var(--surface) 90%, transparent);
    color: var(--text);
    font-size: 1rem;
    font-weight: 800;
    cursor: pointer;
    transition: border-color 0.15s, background 0.15s;
}
.start-choice-card:hover,
.start-choice-card.is-selected {
    border-color: var(--primary);
    background: color-mix(in srgb, var(--primary) 10%, var(--surface));
}
.start-plan-preview {
    margin: 0 0 16px;
    padding: 16px;
    border-radius: 18px;
    border: 1px solid color-mix(in srgb, var(--border) 80%, transparent);
    background: color-mix(in srgb, var(--surface) 88%, transparent);
}
.start-plan-preview-head {
    display: flex;
    justify-content: space-between;
    align-items: baseline;
    gap: 12px;
    margin-bottom: 12px;
}
.start-plan-preview-head strong {
    font-size: 1.05rem;
}
.start-plan-preview-head span {
    color: var(--text-muted);
    font-size: 0.82rem;
    font-weight: 700;
}
.start-plan-preview-list {
    margin: 0;
    padding: 0;
    list-style: none;
    display: grid;
    gap: 10px;
}
.start-plan-exercise {
    display: flex;
    flex-direction: column;
    gap: 4px;
    padding: 12px 14px;
    border-radius: 14px;
    background: color-mix(in srgb, var(--primary) 7%, var(--surface));
    border: 1px solid color-mix(in srgb, var(--border) 70%, transparent);
}
.start-plan-exercise-title {
    font-size: 0.98rem;
    color: var(--text);
    line-height: 1.25;
}
.start-plan-exercise-desc {
    font-size: 0.84rem;
    color: var(--text-soft);
    line-height: 1.4;
    font-weight: 500;
}
.start-plan-exercise-reps {
    font-size: 0.8rem;
    font-weight: 800;
    color: var(--primary);
    letter-spacing: 0.02em;
}
.start-onboarding-motivation {
    margin: 14px 0 8px;
    padding: 12px 14px;
    border-radius: 14px;
    background: color-mix(in srgb, var(--primary) 10%, transparent);
    color: var(--text-soft);
    font-size: 0.9rem;
    line-height: 1.45;
    font-weight: 600;
    text-align: center;
}
.start-value-list {
    margin: 0 0 20px;
    padding: 0;
    list-style: none;
    display: grid;
    gap: 10px;
}
.start-value-card {
    display: flex;
    flex-direction: column;
    gap: 6px;
    padding: 14px 16px;
    border-radius: 16px;
    border: 1px solid color-mix(in srgb, var(--border) 78%, transparent);
    background: color-mix(in srgb, var(--surface) 90%, transparent);
}
.start-value-card strong {
    font-size: 1rem;
    color: var(--text);
}
.start-value-card span {
    font-size: 0.88rem;
    color: var(--text-soft);
    line-height: 1.45;
}
.start-onboarding-streak {
    margin: 0 0 18px;
    padding: 12px 14px;
    border-radius: 14px;
    border: 1px dashed color-mix(in srgb, var(--primary) 28%, var(--border));
    background: color-mix(in srgb, var(--surface) 92%, transparent);
}
.start-onboarding-streak-title {
    margin: 0 0 8px;
    font-size: 0.92rem;
    font-weight: 700;
    color: var(--text);
}
.start-onboarding-streak-list {
    margin: 0;
    padding: 0;
    list-style: none;
    display: grid;
    gap: 4px;
    font-size: 0.86rem;
    color: var(--text-soft);
    line-height: 1.4;
}
.smart-scan-continuity-banner {
    margin-bottom: 14px;
    padding: 16px 18px;
    border-radius: 16px;
    border: 1px solid color-mix(in srgb, var(--primary) 35%, var(--border));
    background: color-mix(in srgb, var(--primary) 8%, var(--surface));
}
.smart-scan-continuity-banner__kicker {
    margin: 0 0 6px;
    font-size: 0.78rem;
    font-weight: 700;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    color: var(--primary);
}
.smart-scan-continuity-banner__title {
    margin: 0 0 8px;
    font-size: 1.15rem;
    line-height: 1.3;
}
.smart-scan-continuity-banner__lead,
.smart-scan-continuity-banner__hint {
    margin: 0;
    font-size: 0.9rem;
    color: var(--text-soft);
    line-height: 1.45;
}
.smart-scan-continuity-banner__hint {
    margin-top: 8px;
    font-weight: 600;
}
.smart-scan-page-shell--onboarding-home .smart-scan-quota-card,
.smart-scan-page-shell--onboarding-home .smart-scan-mode-choice-label,
.smart-scan-page-shell--onboarding-home .smart-start-segment,
.smart-scan-page-shell--onboarding-home [data-smart-mode-hint],
.smart-scan-page-shell--onboarding-home [data-smart-mode-fields="gym_scan"],
.smart-scan-page-shell--onboarding-home .smart-scan-nutrition-fields,
.smart-scan-page-shell--onboarding-home #smart-scan-premium-upsell,
.smart-scan-page-shell--onboarding-home .smart-scan-form-footer-hint {
    display: none !important;
}
.smart-scan-page-shell--onboarding-home .smart-scan-onboarding-details {
    display: none !important;
}
.onboarding-home-summary {
    margin-bottom: 14px;
    padding: 14px 16px;
    border-radius: 12px;
    background: var(--surface-2, rgba(255, 255, 255, 0.04));
    border: 1px solid var(--border-soft, rgba(255, 255, 255, 0.08));
}
.onboarding-home-summary__lead {
    margin: 0 0 10px;
    font-size: 0.95rem;
    color: var(--text-soft);
    line-height: 1.45;
}
.onboarding-home-summary__list {
    margin: 0;
    padding: 0;
    list-style: none;
}
.onboarding-home-summary__list li {
    display: flex;
    justify-content: space-between;
    gap: 12px;
    padding: 8px 0;
    border-bottom: 1px solid var(--border-soft, rgba(255, 255, 255, 0.06));
    font-size: 0.92rem;
}
.onboarding-home-summary__list li:last-child {
    border-bottom: none;
}
.onboarding-home-summary__list strong {
    font-weight: 600;
    text-align: right;
}
.onboarding-home-summary__note {
    margin: 10px 0 0;
    font-size: 0.85rem;
}
.smart-scan-page-shell--onboarding-home .btn-smart-scan-generate {
    width: 100%;
}
.onboarding-save-plan-page {
    max-width: 520px;
    margin: 0 auto;
    padding: 8px 0 28px;
}
.onboarding-save-plan-card {
    padding: 20px 18px;
}
.onboarding-save-plan__kicker {
    margin: 0 0 8px;
    font-size: 0.8rem;
    font-weight: 700;
    color: var(--primary);
    letter-spacing: 0.05em;
    text-transform: uppercase;
}
.onboarding-save-plan-form {
    margin-top: 16px;
}
.onboarding-save-plan__after {
    margin: 12px 0 0;
    font-size: 0.88rem;
    text-align: center;
}
.onboarding-plan-ready {
    max-width: 520px;
    margin: 0 auto;
    padding: 8px 0 32px;
}
.onboarding-plan-ready__card {
    padding: 22px 20px;
    text-align: center;
}
.onboarding-plan-ready__kicker {
    margin: 0 0 8px;
    font-size: 0.8rem;
    font-weight: 700;
    color: var(--primary);
    letter-spacing: 0.05em;
    text-transform: uppercase;
}
.onboarding-plan-ready__title {
    margin: 0 0 10px;
    font-size: 1.55rem;
    line-height: 1.25;
}
.onboarding-plan-ready__lead,
.onboarding-plan-ready__note,
.onboarding-plan-ready__day {
    margin: 0 0 10px;
    font-size: 0.95rem;
    color: var(--text-soft);
    line-height: 1.5;
}
.onboarding-plan-ready__day {
    font-weight: 700;
    color: var(--text);
    margin-bottom: 18px;
}
.onboarding-plan-ready__actions {
    display: grid;
    gap: 10px;
}
.start-secondary-link--tiny {
    font-size: 0.76rem;
    opacity: 0.5;
}
.start-onboarding-note {
    margin: 0 0 10px;
    color: var(--text-muted);
    font-size: 0.88rem;
    line-height: 1.45;
}
.start-onboarding-note--muted {
    margin-bottom: 16px;
    font-size: 0.82rem;
    opacity: 0.85;
}
.start-save-actions {
    display: grid;
    gap: 14px;
}
.start-save-email-link {
    display: block;
    text-align: center;
    color: var(--text-muted);
    font-size: 0.9rem;
    font-weight: 700;
    text-decoration: underline;
}
.start-secondary-link {
    color: var(--text-muted);
    font-size: 0.86rem;
    font-weight: 700;
}
.start-onboarding-foot {
    margin-top: 20px;
    text-align: center;
}
.start-onboarding-trainer-hint {
    margin-top: 16px;
    padding: 12px 16px;
    border-radius: 10px;
    background: var(--surface-alt, rgba(0, 0, 0, 0.03));
    border: 1px solid var(--border);
    font-size: 0.82rem;
    color: var(--text-muted);
    text-align: center;
    line-height: 1.5;
}
.start-onboarding-nav {
    margin-top: 20px;
}
.start-onboarding-back[hidden] {
    display: none;
}
.auth-page--onboarding .auth-google-primary {
    margin-bottom: 16px;
}
.auth-email-fallback {
    margin-top: 8px;
}
.auth-email-fallback summary {
    cursor: pointer;
    color: var(--text-muted);
    font-size: 0.9rem;
    font-weight: 700;
    list-style: none;
    text-align: center;
}
.auth-email-fallback summary::-webkit-details-marker {
    display: none;
}
.auth-form--secondary {
    margin-top: 16px;
}

/* Owner admin — responsive layout, media cache cards */
.admin-page {
    display: flex;
    flex-direction: column;
    gap: 16px;
    max-width: 100%;
}
.admin-page__top {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    align-items: flex-start;
    gap: 12px;
}
.admin-page__top-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    align-items: center;
}
.admin-stats-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(120px, 1fr));
    gap: 10px;
    margin: 0;
}
.admin-stat {
    display: flex;
    flex-direction: column;
    gap: 4px;
    padding: 12px;
    border: 1px solid var(--border);
    border-radius: 12px;
    background: var(--surface-2);
}
.admin-stat__k {
    font-size: 0.76rem;
    color: var(--text-muted);
}
.admin-stat strong {
    font-size: 1.25rem;
    font-weight: 800;
}
.admin-section {
    margin: 0;
}
.admin-section__head {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    align-items: flex-start;
    gap: 12px;
    margin-bottom: 14px;
}
.admin-section__title {
    margin: 0 0 6px;
    font-size: 1.1rem;
}
.admin-filter-pills {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}
.admin-filter-pills .btn.is-active {
    border-color: var(--accent);
    background: color-mix(in srgb, var(--accent) 12%, transparent);
}
.admin-cache-cards {
    display: grid;
    gap: 14px;
    grid-template-columns: repeat(auto-fill, minmax(min(100%, 340px), 1fr));
}
.admin-cache-card {
    border: 1px solid var(--border);
    border-radius: 14px;
    padding: 14px;
    background: var(--surface-2);
    display: flex;
    flex-direction: column;
    gap: 12px;
}
.admin-cache-card--compact {
    padding: 12px;
}
.admin-cache-card__head {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    gap: 10px;
    align-items: flex-start;
}
.admin-cache-card__title {
    margin: 0;
    font-size: 1rem;
    line-height: 1.3;
    word-break: break-word;
}
.admin-cache-card__meta {
    margin: 4px 0 0;
    font-size: 0.82rem;
    color: var(--text-muted);
    word-break: break-word;
}
.admin-cache-card__badges {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    align-items: center;
}
.admin-badge {
    display: inline-block;
    padding: 3px 8px;
    border-radius: 999px;
    font-size: 0.72rem;
    font-weight: 700;
    background: var(--surface-3, var(--surface));
    border: 1px solid var(--border);
    text-transform: lowercase;
}
.admin-badge--approved {
    border-color: #2e7d32;
    color: #2e7d32;
}
.admin-badge--needs_review {
    border-color: #ed6c02;
    color: #ed6c02;
}
.admin-badge--rejected,
.admin-badge--failed {
    border-color: #c62828;
    color: #c62828;
}
.admin-cache-card__previews {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    align-items: center;
}
.admin-cache-card__actions {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}
.admin-media-attach-form {
    display: grid;
    gap: 10px;
}
.admin-media-attach-form__section {
    display: grid;
    gap: 6px;
}
.admin-media-attach-form__label {
    font-size: 0.82rem;
    font-weight: 700;
    color: var(--text-muted);
}
.admin-media-attach-form__divider {
    text-align: center;
    font-size: 0.8rem;
    color: var(--text-muted);
    font-weight: 700;
}
.admin-media-attach-form input[type="file"],
.admin-media-attach-form input[type="text"],
.admin-media-attach-form select {
    width: 100%;
    max-width: 100%;
}
@media (max-width: 720px) {
    .admin-page .admin-table-mobile .clients-table thead {
        display: none;
    }
    .admin-page .admin-table-mobile .clients-table tbody tr {
        display: block;
        padding: 12px 0;
        border-top: 1px solid var(--border);
    }
    .admin-page .admin-table-mobile .clients-table tbody td {
        display: grid;
        grid-template-columns: minmax(90px, 38%) 1fr;
        gap: 8px;
        padding: 6px 0;
        border: none;
    }
    .admin-page .admin-table-mobile .clients-table tbody td::before {
        content: attr(data-label);
        font-weight: 700;
        font-size: 0.78rem;
        color: var(--text-muted);
    }
    .admin-page .admin-table-mobile .clients-table tbody td[data-label=""]::before {
        content: none;
    }
}

/* Hub + dedicated ad landings (/ , /scan , /coaches) */
.landing-hub-page {
    padding-bottom: 48px;
}
.landing-hub-paths {
    padding: 8px 0 40px;
}
.landing-hub-paths__grid {
    display: grid;
    gap: 20px;
    max-width: 1040px;
    margin: 0 auto;
}
@media (min-width: 768px) {
    .landing-hub-paths__grid {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }
}
.landing-path-card {
    display: flex;
    flex-direction: column;
    gap: 12px;
    padding: 22px 20px;
    border-radius: 16px;
    border: 1px solid color-mix(in srgb, var(--border) 70%, transparent);
    background: color-mix(in srgb, var(--surface-2) 55%, transparent);
    min-height: 100%;
}
.landing-path-card--coach {
    border-style: dashed;
}
.landing-path-card__badge {
    margin: 0;
    font-size: 0.68rem;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    color: var(--primary);
}
.landing-path-card h2 {
    margin: 0;
    font-size: 1.15rem;
    font-weight: 700;
    letter-spacing: -0.02em;
}
.landing-path-card p {
    margin: 0;
    flex: 1;
    font-size: 0.9rem;
    line-height: 1.5;
    color: var(--text-soft);
}
.landing-path-card .btn {
    margin-top: auto;
    align-self: flex-start;
}
.landing-hub-footer-cta {
    padding: 0 0 24px;
    text-align: center;
    font-size: 0.9rem;
    color: var(--text-soft);
}
.landing-scan-page .hero-actions,
.landing-coaches-page .hero-actions {
    flex-wrap: wrap;
    gap: 12px;
}
.landing-scan-hero-shot {
    min-height: 220px;
    border-radius: 14px;
}
.landing-scan-example {
    padding: 24px 0 40px;
    border-top: 1px solid color-mix(in srgb, var(--border) 55%, transparent);
}
.landing-scan-example__inner {
    max-width: 960px;
    margin: 0 auto;
}
.landing-scan-example__grid {
    display: grid;
    gap: 24px;
    margin-bottom: 24px;
}
@media (min-width: 768px) {
    .landing-scan-example__grid {
        grid-template-columns: 1fr 1fr;
        align-items: start;
    }
}
.landing-scan-example__photo {
    min-height: 200px;
}
.landing-scan-detected {
    margin: 0 0 12px;
    font-size: 0.92rem;
    color: var(--text-soft);
}
.landing-scan-detected strong {
    color: var(--text);
}
.landing-scan-faq,
.landing-coaches-pain {
    padding: 24px 0 32px;
}
.landing-faq-list {
    margin: 0;
    display: grid;
    gap: 16px;
    max-width: 720px;
}
.landing-faq-list dt {
    margin: 0 0 6px;
    font-weight: 700;
    color: var(--text);
}
.landing-faq-list dd {
    margin: 0;
    font-size: 0.9rem;
    line-height: 1.5;
    color: var(--text-soft);
}
.landing-scan-alt {
    margin-top: 20px;
    font-size: 0.88rem;
}
.landing-coaches-pain .landing-bullets {
    max-width: 640px;
}

/* Admin marketing funnel monitor */
.admin-funnel-grid {
    display: grid;
    gap: 20px;
    margin-top: 20px;
}
@media (min-width: 900px) {
    .admin-funnel-grid {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }
}
.admin-funnel-block h4 {
    margin: 0 0 10px;
    font-size: 0.95rem;
}
.admin-funnel-table td,
.admin-funnel-table th {
    font-size: 0.82rem;
}
.admin-funnel-errors {
    margin: 0;
    padding-left: 1.2rem;
    font-size: 0.88rem;
}
.admin-funnel-status {
    display: inline-block;
    padding: 2px 8px;
    border-radius: 999px;
    font-size: 0.72rem;
    font-weight: 700;
    text-transform: uppercase;
}
.admin-funnel-status--converted {
    background: color-mix(in srgb, #22c55e 18%, transparent);
    color: #166534;
}
.admin-funnel-status--stuck_email,
.admin-funnel-status--stuck_register {
    background: color-mix(in srgb, #f59e0b 20%, transparent);
    color: #92400e;
}
.admin-funnel-status--failed {
    background: color-mix(in srgb, #ef4444 18%, transparent);
    color: #b91c1c;
}
.admin-funnel-status--bounced {
    background: color-mix(in srgb, var(--text-muted) 15%, transparent);
    color: var(--text-muted);
}
.admin-funnel-journey-table td {
    vertical-align: top;
}
/* New /fitness hub redesign */
.landing-hub-page--new {
    padding-bottom: 56px;
}

.hub-hero {
    padding: 76px 0 42px;
    border-bottom: 1px solid color-mix(in srgb, var(--border) 55%, transparent);
    background:
        radial-gradient(circle at 20% 10%, color-mix(in srgb, var(--primary) 16%, transparent), transparent 32%),
        radial-gradient(circle at 85% 20%, color-mix(in srgb, var(--primary-2) 12%, transparent), transparent 30%),
        var(--bg);
}

.hub-hero__inner {
    display: grid;
    grid-template-columns: minmax(0, 1.05fr) minmax(320px, 0.75fr);
    gap: 42px;
    align-items: center;
}

.hub-hero__copy h1 {
    margin: 0 0 16px;
    max-width: 720px;
    font-size: clamp(2.4rem, 5vw, 4.4rem);
    line-height: 0.98;
    letter-spacing: -0.06em;
}

.hub-preview-card {
    border: 1px solid color-mix(in srgb, var(--border-strong) 82%, transparent);
    border-radius: 32px;
    padding: 22px;
    background:
        radial-gradient(circle at 80% 10%, color-mix(in srgb, var(--primary) 18%, transparent), transparent 34%),
        color-mix(in srgb, var(--surface) 88%, transparent);
    box-shadow: var(--card-shadow-lg);
}

.hub-preview-card__top {
    display: grid;
    gap: 8px;
    margin-bottom: 16px;
}

.hub-preview-card__top span {
    width: fit-content;
    padding: 6px 9px;
    border-radius: 999px;
    background: var(--primary-soft);
    color: var(--primary);
    font-size: 0.7rem;
    font-weight: 900;
    text-transform: uppercase;
    letter-spacing: 0.05em;
}

.hub-preview-card__top strong {
    font-size: 1.35rem;
    letter-spacing: -0.04em;
}

.hub-preview-workout {
    display: grid;
    gap: 14px;
    padding: 18px;
    border: 1px solid var(--border);
    border-radius: 24px;
    background: color-mix(in srgb, var(--surface-2) 80%, transparent);
}

.hub-preview-workout strong {
    display: block;
    font-size: 1rem;
}

.hub-preview-workout span {
    display: block;
    margin-top: 4px;
    color: var(--text-muted);
    font-size: 0.9rem;
}

.hub-preview-workout ul {
    margin: 0;
    padding-left: 18px;
    color: var(--text-soft);
    line-height: 1.8;
    font-size: 0.92rem;
}

.hub-preview-row {
    margin-top: 14px;
    display: flex;
    justify-content: space-between;
    gap: 12px;
    padding: 14px 16px;
    border-radius: 18px;
    background: var(--primary-soft);
    color: var(--text);
}

.hub-preview-row span {
    color: var(--text-soft);
    font-weight: 700;
}

.hub-section-head {
    max-width: 720px;
    margin: 0 auto 24px;
    text-align: center;
}

.hub-section-head h2 {
    margin: 0 0 10px;
    font-size: clamp(1.7rem, 3vw, 2.4rem);
    letter-spacing: -0.04em;
}

.hub-section-head p {
    margin: 0;
    color: var(--text-soft);
    line-height: 1.6;
}

.landing-hub-page--new .landing-hub-paths {
    padding: 46px 0 28px;
}

.landing-hub-paths__grid--primary {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    max-width: 920px;
    margin: 0 auto;
}

.landing-path-card--primary {
    padding: 28px;
    border-radius: 28px;
    background:
        radial-gradient(circle at 82% 12%, color-mix(in srgb, var(--primary) 12%, transparent), transparent 32%),
        var(--surface);
    box-shadow: var(--card-shadow);
}

.landing-path-card--primary h2 {
    font-size: 1.5rem;
    letter-spacing: -0.04em;
}

.landing-path-card--primary p {
    font-size: 0.98rem;
    line-height: 1.65;
}

.hub-coach-strip {
    max-width: 920px;
    margin: 20px auto 0;
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 24px;
    padding: 24px 28px;
    border: 1px dashed var(--border-strong);
    border-radius: 26px;
    background: color-mix(in srgb, var(--surface-2) 70%, transparent);
}

.hub-coach-strip h2 {
    margin: 4px 0 8px;
    font-size: 1.35rem;
    letter-spacing: -0.03em;
}

.hub-coach-strip p {
    margin: 0;
    max-width: 640px;
    color: var(--text-soft);
    line-height: 1.6;
}

.landing-hub-page--new .landing-hub-footer-cta {
    padding: 8px 0 28px;
}

.landing-hub-page--new .landing-hub-footer-cta a {
    color: var(--primary);
    font-weight: 800;
}

@media (max-width: 899px) {
    .hub-hero {
        padding: 42px 0 28px;
    }

    .hub-hero__inner {
        grid-template-columns: 1fr;
        gap: 24px;
    }

    .hub-preview-card {
        display: none;
    }

    .hub-hero__copy h1 {
        font-size: clamp(2.1rem, 10vw, 3.2rem);
    }

    .hub-hero__copy,
    .hub-section-head {
        text-align: left;
    }

    .landing-hub-paths__grid--primary {
        grid-template-columns: 1fr;
    }

    .hub-coach-strip {
        flex-direction: column;
        align-items: stretch;
        padding: 22px;
    }

    .hub-coach-strip .btn {
        width: 100%;
    }
}
/* Coaches landing visual polish */
.landing-coaches-page .landing-hero-grid {
    align-items: center;
    gap: 72px;
}

.landing-coaches-page .landing-hero-visual {
    display: flex;
    justify-content: center;
}

.landing-coach-demo-card {
    width: min(100%, 430px);
    border: 1px solid var(--border);
    border-radius: 32px;
    padding: 22px;
    background:
        radial-gradient(circle at 85% 10%, color-mix(in srgb, var(--primary) 18%, transparent), transparent 34%),
        var(--surface);
    box-shadow: var(--card-shadow-lg);
}

.landing-coach-demo-head {
    display: grid;
    gap: 6px;
    margin-bottom: 18px;
}

.landing-coach-demo-head strong {
    font-size: 1.25rem;
    letter-spacing: -0.03em;
}

.landing-coach-demo-head span {
    color: var(--text-soft);
    line-height: 1.5;
}

.landing-coach-client-list {
    display: grid;
    gap: 10px;
}

.landing-coach-client-row {
    display: flex;
    justify-content: space-between;
    gap: 14px;
    align-items: center;
    padding: 13px 14px;
    border: 1px solid var(--border);
    border-radius: 18px;
    background: color-mix(in srgb, var(--surface-2) 82%, transparent);
}

.landing-coach-client-row span {
    color: var(--text-soft);
    font-weight: 700;
}

.landing-coach-client-row strong {
    color: var(--primary);
    font-size: 0.92rem;
    white-space: nowrap;
}

.landing-coach-demo-footer {
    margin-top: 14px;
    padding: 14px 16px;
    border-radius: 18px;
    background: var(--primary-soft);
    color: var(--text-soft);
    font-weight: 700;
    line-height: 1.5;
}

.landing-coaches-page .landing-coaches-pain,
.landing-coaches-page .landing-story,
.landing-coaches-page .landing-how-simple,
.landing-coaches-page .landing-pricing-section,
.landing-coaches-page .landing-scan-faq {
    padding: 54px 0;
}

.landing-coaches-page .landing-section-title {
    text-align: center;
    margin-bottom: 22px;
}

.landing-coaches-page .landing-bullets {
    max-width: 760px;
    margin-left: auto;
    margin-right: auto;
}

.landing-coaches-page .landing-story {
    border-top: 1px solid var(--border);
    border-bottom: 1px solid var(--border);
    background: color-mix(in srgb, var(--surface-2) 58%, transparent);
}

.landing-coaches-page .landing-split__copy--center {
    max-width: 820px;
    margin: 0 auto;
}

.landing-coaches-page .landing-how-simple__steps {
    max-width: 940px;
    margin: 0 auto;
}

.landing-coaches-page .landing-price-panel {
    max-width: 560px;
    margin: 0 auto;
}

@media (max-width: 899px) {
    .landing-coaches-page .landing-hero-grid {
        grid-template-columns: 1fr;
        gap: 28px;
    }

    .landing-coach-demo-card {
        width: 100%;
    }

    .landing-coach-client-row {
        align-items: flex-start;
        flex-direction: column;
        gap: 6px;
    }

    .landing-coaches-page .landing-coaches-pain,
    .landing-coaches-page .landing-story,
    .landing-coaches-page .landing-how-simple,
    .landing-coaches-page .landing-pricing-section,
    .landing-coaches-page .landing-scan-faq {
        padding: 38px 0;
    }

    .landing-coaches-page .landing-section-title {
        text-align: left;
    }
}
/* Landing visual polish */
.hero--home-primary {
    background:
        radial-gradient(circle at top left, rgba(124, 92, 255, 0.10), transparent 34%),
        var(--bg);
}

/* Smart scan example cards */
.landing-scan-example__grid > * {
    background: var(--surface);
    border: 1px solid var(--border);
    border-radius: 28px;
    padding: 18px;
    box-shadow: var(--card-shadow);
}

.landing-scan-example__photo {
    border-radius: 22px;
    overflow: hidden;
}

/* How it works cards */
.landing-how-simple__steps li {
    background: var(--surface);
    border-radius: 24px;
    padding: 22px;
    border: 1px solid var(--border);
    box-shadow: var(--card-shadow);
}

.landing-how-simple__num {
    width: 42px;
    height: 42px;
    min-width: 42px;
    border-radius: 999px;
    background: linear-gradient(135deg, var(--primary), var(--primary-2));
    color: white;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-weight: 900;
}

/* FAQ cards */
.landing-faq-list > div {
    background: var(--surface);
    border: 1px solid var(--border);
    border-radius: 22px;
    padding: 18px 20px;
    box-shadow: var(--card-shadow);
}

.landing-faq-list {
    display: grid;
    gap: 14px;
}

/* Safer sticky header polish */
.site-header {
    z-index: 100;
}
.header-landing-lang {
    opacity: .72;
    font-weight: 800;
    transition: opacity .2s ease, color .2s ease;
}

.header-landing-lang:hover {
    opacity: 1;
    color: var(--text);
}
.header-brand {
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
}

.nav {
    position: relative;
    z-index: 2;
}
/* Language dropdown */
.header-lang-dropdown {
    position: relative;
    display: inline-flex;
}

.header-lang-dropdown summary {
    list-style: none;
    cursor: pointer;
    font-weight: 800;
    color: var(--text-soft);
    padding: 8px 10px;
    border-radius: 999px;
    border: 1px solid var(--border);
    background: color-mix(in srgb, var(--surface) 84%, transparent);
    user-select: none;
}

.header-lang-dropdown summary::-webkit-details-marker {
    display: none;
}

.header-lang-dropdown summary::after {
    content: "▾";
    margin-left: 6px;
    font-size: 0.7rem;
    opacity: .7;
}

.header-lang-dropdown-menu {
    position: absolute;
    top: calc(100% + 8px);
    right: 0;
    left: auto;
    z-index: 1200;
    display: grid;
    gap: 4px;
    min-width: 64px;
    width: max-content;
    max-width: calc(100vw - 20px);
    padding: 8px;
    border-radius: 16px;
    border: 1px solid var(--border);
    background: var(--surface);
    box-shadow: var(--card-shadow-lg);
}

.header-lang-dropdown-menu a {
    padding: 8px 10px;
    border-radius: 10px;
    color: var(--text-soft);
    font-weight: 800;
    text-decoration: none;
}

.header-lang-dropdown-menu a:hover {
    background: var(--primary-soft);
    color: var(--primary);
}

@media (max-width: 899px) {
    .header-lang-dropdown-menu {
        right: 0;
        left: auto;
        max-width: calc(100vw - 16px);
    }
}
/* Fix landing desktop header layout */
@media (min-width: 900px) {
    .header-inner--landing-market {
        display: grid;
        grid-template-columns: 1fr auto 1fr;
        align-items: center;
        min-height: 76px;
    }

    .header-inner--landing-market .header-landing-brand {
        position: static;
        transform: none;
        grid-column: 2;
        justify-self: center;
    }

    .header-inner--landing-market .header-landing-desktop-extra {
        grid-column: 1 / 4;
        grid-row: 1;
        width: 100%;
    }

    .header-inner--landing-market .header-landing-desktop-nav {
        display: flex;
        align-items: center;
        width: 100%;
        gap: 18px;
    }

    .header-inner--landing-market .header-landing-desktop-nav > a:nth-child(3) {
        margin-right: auto;
    }

    .header-inner--landing-market .header-lang-dropdown {
        margin-left: auto;
    }
}
@media (max-width: 899px) {

    .header-inner--landing-market {
        display: flex;
        align-items: center;
        justify-content: space-between;
        position: relative;
        min-height: 74px;
        padding-top: 6px;
    }

    .header-inner--landing-market .header-landing-brand {
        position: absolute;
        left: 50%;
        top: 52%;
        transform: translate(-50%, -50%);
    }

}

/* ─────────────────────────────────────────────
   Coach-focused home page (index.html)
   ───────────────────────────────────────────── */

.coach-home-page {
    padding-bottom: 0;
}

/* HERO */
.coach-home-hero {
    padding: 76px 0 52px;
    border-bottom: 1px solid color-mix(in srgb, var(--border) 55%, transparent);
    background:
        radial-gradient(circle at 18% 8%, color-mix(in srgb, var(--primary) 18%, transparent), transparent 34%),
        radial-gradient(circle at 86% 22%, color-mix(in srgb, var(--primary-2) 12%, transparent), transparent 30%),
        var(--bg);
}

.coach-home-hero__inner {
    display: grid;
    grid-template-columns: minmax(0, 1.1fr) minmax(300px, 0.8fr);
    gap: 48px;
    align-items: center;
}

.coach-home-hero__copy h1 {
    margin: 0 0 18px;
    font-size: clamp(2.4rem, 5vw, 4.2rem);
    line-height: 0.97;
    letter-spacing: -0.06em;
}

/* Hero benefits checklist */
.hub-hero-benefits {
    list-style: none;
    margin: 20px 0 28px;
    padding: 0;
    display: flex;
    flex-direction: column;
    gap: 8px;
}
.hub-hero-benefits li {
    display: flex;
    align-items: center;
    gap: 10px;
    font-size: 0.97rem;
    color: var(--text-2);
    line-height: 1.35;
}
.hub-hero-benefits li::before {
    content: '✓';
    flex-shrink: 0;
    width: 22px;
    height: 22px;
    border-radius: 50%;
    background: color-mix(in srgb, var(--primary) 14%, transparent);
    color: var(--primary);
    font-size: 0.78rem;
    font-weight: 700;
    display: flex;
    align-items: center;
    justify-content: center;
}

/* Dashboard card */
.coach-home-dashboard-card {
    width: min(100%, 420px);
    border: 1px solid color-mix(in srgb, var(--border-strong) 80%, transparent);
    border-radius: 32px;
    padding: 22px;
    background:
        radial-gradient(circle at 85% 10%, color-mix(in srgb, var(--primary) 18%, transparent), transparent 34%),
        var(--surface);
    box-shadow: var(--card-shadow-lg);
}

.coach-home-dashboard-head {
    margin-bottom: 18px;
}

.coach-home-dashboard-head strong {
    font-size: 1.1rem;
    letter-spacing: -0.03em;
    color: var(--text-soft);
    font-weight: 700;
}

/* Metrics row */
.coach-home-metrics {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 8px;
    margin-bottom: 16px;
}

.coach-home-metric {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 2px;
    padding: 12px 6px;
    border-radius: 18px;
    background: color-mix(in srgb, var(--surface-2) 80%, transparent);
    border: 1px solid var(--border);
    text-align: center;
}

.coach-home-metric--warn {
    border-color: color-mix(in srgb, var(--warning, #f59e0b) 40%, transparent);
    background: color-mix(in srgb, var(--warning, #f59e0b) 8%, transparent);
}

.coach-home-metric__value {
    font-size: 1.6rem;
    font-weight: 900;
    letter-spacing: -0.04em;
    color: var(--primary);
    line-height: 1;
}

.coach-home-metric--warn .coach-home-metric__value {
    color: var(--warning, #f59e0b);
}

.coach-home-metric__label {
    font-size: 0.64rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.03em;
    color: var(--text-muted);
    line-height: 1.3;
}

/* Client rows */
.coach-home-client-list {
    display: grid;
    gap: 8px;
    margin-bottom: 14px;
}

.coach-home-client-row {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 12px;
    padding: 11px 14px;
    border: 1px solid var(--border);
    border-radius: 16px;
    background: color-mix(in srgb, var(--surface-2) 82%, transparent);
    font-size: 0.9rem;
}

.coach-home-client-row > span {
    color: var(--text-soft);
    font-weight: 600;
}

.coach-home-status {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 26px;
    height: 26px;
    border-radius: 50%;
    font-size: 0.8rem;
    font-weight: 900;
    flex-shrink: 0;
}

.coach-home-status--done {
    background: color-mix(in srgb, var(--success, #22c55e) 15%, transparent);
    color: var(--success, #22c55e);
}

.coach-home-status--paid {
    background: color-mix(in srgb, var(--primary) 15%, transparent);
    color: var(--primary);
}

.coach-home-status--progress {
    background: color-mix(in srgb, var(--primary-2, #8b5cf6) 15%, transparent);
    color: var(--primary-2, #8b5cf6);
}

.coach-home-dashboard-footer {
    padding: 13px 16px;
    border-radius: 16px;
    background: color-mix(in srgb, #22c55e 12%, var(--surface));
    border: 1px solid color-mix(in srgb, #22c55e 30%, transparent);
    color: #16a34a;
    font-weight: 700;
    font-size: 0.88rem;
    line-height: 1.5;
}

/* Shared section heading */
.coach-home-section-title {
    text-align: center;
    margin: 0 0 32px;
    font-size: clamp(1.7rem, 3vw, 2.5rem);
    letter-spacing: -0.05em;
}

/* WHY section */
.coach-home-why {
    padding: 64px 0;
    border-bottom: 1px solid var(--border);
}

.coach-home-why__grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 20px;
    max-width: 1060px;
    margin: 0 auto;
}

.coach-home-why-card {
    padding: 28px;
    border-radius: 24px;
    border: 1px solid var(--border);
    background: var(--surface);
    box-shadow: var(--card-shadow);
    display: flex;
    flex-direction: column;
    gap: 10px;
}

.coach-home-why-card__icon {
    font-size: 1.4rem;
    color: var(--primary);
    line-height: 1;
}

.coach-home-why-card h3 {
    margin: 0;
    font-size: 1.2rem;
    letter-spacing: -0.03em;
}

.coach-home-why-card p {
    margin: 0;
    color: var(--text-soft);
    line-height: 1.65;
    font-size: 0.96rem;
}

/* FEATURES section */
.coach-home-system {
    padding: 64px 0;
    border-bottom: 1px solid var(--border);
    background: color-mix(in srgb, var(--surface-2) 50%, transparent);
}

.coach-home-feat-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 16px;
    max-width: 1100px;
    margin: 0 auto;
}

.coach-home-feat-card {
    padding: 24px 22px;
    border-radius: 22px;
    border: 1px solid var(--border);
    background: var(--surface);
    box-shadow: var(--card-shadow);
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.coach-home-feat-card__num {
    font-size: 0.7rem;
    font-weight: 900;
    letter-spacing: 0.08em;
    color: var(--primary);
    text-transform: uppercase;
}

.coach-home-feat-card h3 {
    margin: 0;
    font-size: 1.05rem;
    letter-spacing: -0.03em;
}

.coach-home-feat-card p {
    margin: 0;
    color: var(--text-soft);
    line-height: 1.6;
    font-size: 0.92rem;
}

/* HOW IT WORKS */
.coach-home-how {
    padding: 64px 0;
    border-bottom: 1px solid var(--border);
}

.coach-home-how__steps {
    list-style: none;
    margin: 0 auto;
    padding: 0;
    max-width: 820px;
    display: grid;
    gap: 24px;
    counter-reset: steps;
}

.coach-home-how__steps li {
    display: flex;
    gap: 20px;
    align-items: flex-start;
}

.coach-home-how__num {
    flex-shrink: 0;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 40px;
    height: 40px;
    border-radius: 50%;
    background: var(--primary);
    color: #fff;
    font-size: 1rem;
    font-weight: 900;
}

.coach-home-how__steps li div {
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.coach-home-how__steps li strong {
    font-size: 1.08rem;
    letter-spacing: -0.02em;
}

.coach-home-how__steps li p {
    margin: 0;
    color: var(--text-soft);
    line-height: 1.65;
    font-size: 0.96rem;
}

.header-brand-text {
    font-size: 0.95rem;
    font-weight: 800;
    letter-spacing: -0.03em;
    color: var(--text);
    max-width: 11rem;
    line-height: 1.15;
    text-align: center;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

/* CLUBS BLOCK */
.coach-home-clubs {
    padding: 64px 0;
    border-bottom: 1px solid var(--border);
    background: var(--surface);
}

.coach-home-clubs__inner {
    max-width: 760px;
    margin: 0 auto;
    text-align: center;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 20px;
}

.coach-home-clubs__eyebrow {
    margin: 0;
    font-size: 0.82rem;
    font-weight: 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: var(--primary);
}

.coach-home-clubs__title {
    margin: 0;
    font-size: clamp(1.6rem, 3vw, 2.3rem);
    letter-spacing: -0.05em;
}

.coach-home-clubs__lead {
    margin: 0;
    color: var(--text-soft);
    font-size: 1.05rem;
    line-height: 1.7;
    max-width: 640px;
}

.coach-home-clubs__points {
    list-style: none;
    margin: 0;
    padding: 0;
    display: grid;
    gap: 10px;
    width: 100%;
    max-width: 620px;
    text-align: left;
}

.coach-home-clubs__points li {
    display: flex;
    align-items: flex-start;
    gap: 10px;
    font-size: 0.97rem;
    color: var(--text-2);
    line-height: 1.5;
    padding: 10px 14px;
    border-radius: 12px;
    border: 1px solid color-mix(in srgb, var(--border) 80%, transparent);
    background: var(--bg);
}

.coach-home-clubs__points li::before {
    content: "✓";
    color: var(--primary);
    font-weight: 900;
    flex-shrink: 0;
}

.coach-home-clubs__note {
    margin: 0;
    font-size: 0.82rem;
    color: var(--text-muted);
    line-height: 1.5;
}

/* EXISTING CONTENT BLOCK */
.coach-home-content {
    padding: 48px 0 56px;
    background: var(--surface);
    border-bottom: 1px solid color-mix(in srgb, var(--border) 70%, transparent);
}

.coach-home-content--prominent {
    padding: 56px 0 64px;
    background: color-mix(in srgb, var(--primary) 6%, var(--surface));
    border-top: 1px solid color-mix(in srgb, var(--primary) 16%, var(--border));
    border-bottom: 1px solid color-mix(in srgb, var(--primary) 16%, var(--border));
}

.coach-home-content__inner {
    max-width: 720px;
    margin: 0 auto;
    text-align: center;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 20px;
}

.coach-home-content__title {
    margin: 0;
    font-size: clamp(1.5rem, 2.8vw, 2.1rem);
    letter-spacing: -0.04em;
}

.coach-home-content--prominent .coach-home-content__lead {
    font-size: 1.08rem;
    color: var(--text-2);
    max-width: 640px;
}

.coach-home-content__chips {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 10px;
}

.coach-home-content__chips li {
    font-size: 0.92rem;
    font-weight: 600;
    color: var(--text-2);
    background: color-mix(in srgb, var(--primary) 8%, var(--surface-2, var(--surface)));
    border: 1px solid color-mix(in srgb, var(--primary) 20%, var(--border));
    border-radius: 999px;
    padding: 8px 16px;
    line-height: 1.3;
}

.coach-home-content__lead {
    margin: 0;
    font-size: 1.05rem;
    color: var(--text-soft);
    line-height: 1.6;
}

/* WHAT CLIENT SEES */
.coach-home-client {
    padding: 64px 0;
    background: color-mix(in srgb, var(--surface) 92%, var(--bg));
}

.coach-home-client__list {
    list-style: none;
    margin: 28px auto 0;
    padding: 0;
    max-width: 520px;
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.coach-home-client__list li {
    display: flex;
    align-items: center;
    gap: 12px;
    font-size: 1.02rem;
    color: var(--text-2);
    line-height: 1.45;
    background: var(--surface);
    border: 1px solid color-mix(in srgb, var(--border) 70%, transparent);
    border-radius: 14px;
    padding: 12px 16px;
}

.coach-home-client__list li::before {
    content: "✓";
    flex-shrink: 0;
    width: 24px;
    height: 24px;
    border-radius: 50%;
    background: color-mix(in srgb, var(--primary) 16%, transparent);
    color: var(--primary);
    font-size: 0.78rem;
    font-weight: 700;
    display: flex;
    align-items: center;
    justify-content: center;
}

.coach-home-clubs__use-title {
    margin: 20px 0 8px;
    font-weight: 600;
    font-size: 0.95rem;
    color: var(--text-2);
}

.coach-home-clubs__use-list {
    list-style: none;
    margin: 0 0 20px;
    padding: 0;
    display: flex;
    flex-direction: column;
    gap: 8px;
    width: 100%;
    max-width: 560px;
    text-align: left;
}

.coach-home-clubs__use-list li {
    font-size: 0.98rem;
    color: var(--text-soft);
    line-height: 1.5;
    padding-left: 18px;
    position: relative;
}

.coach-home-clubs__use-list li::before {
    content: "·";
    position: absolute;
    left: 4px;
    color: var(--primary);
    font-weight: 700;
}

/* LAUNCH HELP BLOCK */
.coach-home-launch {
    padding: 72px 0;
    background: color-mix(in srgb, var(--primary) 5%, var(--surface));
    border-top: 1px solid color-mix(in srgb, var(--primary) 18%, var(--border));
    border-bottom: 1px solid color-mix(in srgb, var(--primary) 18%, var(--border));
}

.coach-home-launch__inner {
    max-width: 680px;
    margin: 0 auto;
    text-align: center;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 24px;
}

.coach-home-launch__badge {
    font-size: 2.4rem;
    line-height: 1;
}

.coach-home-launch__title {
    margin: 0;
    font-size: clamp(1.7rem, 3vw, 2.4rem);
    letter-spacing: -0.05em;
}

.coach-home-launch__lead {
    margin: 0;
    color: var(--text-soft);
    font-size: 1.05rem;
    line-height: 1.7;
    max-width: 600px;
}

.coach-home-launch__steps-label {
    margin: 24px 0 4px;
    font-weight: 600;
    font-size: 0.95rem;
    color: var(--text-2);
    text-transform: uppercase;
    letter-spacing: 0.04em;
    width: 100%;
    max-width: 560px;
    text-align: left;
}

.coach-home-launch__steps {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    flex-direction: column;
    gap: 14px;
    width: 100%;
    max-width: 560px;
    text-align: left;
}

.coach-home-launch__steps li {
    display: flex;
    align-items: flex-start;
    gap: 14px;
    font-size: 1rem;
    color: var(--text-2);
    line-height: 1.5;
    background: var(--surface);
    border: 1px solid color-mix(in srgb, var(--border) 70%, transparent);
    border-radius: 14px;
    padding: 12px 16px;
}

.coach-home-launch__num {
    flex-shrink: 0;
    width: 28px;
    height: 28px;
    border-radius: 50%;
    background: color-mix(in srgb, var(--primary) 18%, transparent);
    color: var(--primary);
    font-size: 0.82rem;
    font-weight: 700;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-top: 1px;
}

.coach-home-launch__note {
    margin: 0;
    font-size: 0.82rem;
    color: var(--text-muted);
    line-height: 1.5;
}

.coach-home-offer__feature--highlight {
    grid-column: 1 / -1;
    color: #16a34a !important;
    font-weight: 600;
}

/* OFFER / PRICING */
.coach-home-offer {
    padding: 64px 0;
    background:
        radial-gradient(circle at 10% 50%, color-mix(in srgb, var(--primary) 10%, transparent), transparent 40%),
        var(--bg);
}

.coach-home-offer__panel {
    max-width: 780px;
    margin: 0 auto;
    border: 1px solid color-mix(in srgb, var(--primary) 30%, var(--border));
    border-radius: 32px;
    padding: 40px 44px;
    background: var(--surface);
    box-shadow: var(--card-shadow-lg);
    display: grid;
    gap: 28px;
}

.coach-home-offer__copy h2 {
    margin: 0 0 12px;
    font-size: clamp(1.6rem, 2.8vw, 2.2rem);
    letter-spacing: -0.05em;
}

.coach-home-offer__price {
    margin: 0;
    font-size: 2.4rem;
    font-weight: 900;
    letter-spacing: -0.06em;
    color: var(--primary);
}
.coach-home-offer__price--free {
    font-size: 2.8rem;
    background: linear-gradient(90deg, var(--primary), color-mix(in srgb, var(--primary) 60%, #22c55e));
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
}

.coach-home-offer__trial {
    margin: 4px 0 0;
    color: var(--text-soft);
    font-size: 0.96rem;
}

.coach-home-offer__paid-note {
    margin: 0;
    font-size: 0.82rem;
    color: var(--text-muted);
    line-height: 1.45;
    opacity: 0.85;
    text-align: center;
    padding-top: 4px;
    border-top: 1px solid var(--border);
}

.coach-home-offer__features {
    list-style: none;
    margin: 0;
    padding: 0;
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 8px 24px;
}

.coach-home-offer__features li {
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: 0.95rem;
    color: var(--text-soft);
}

.coach-home-offer__features li::before {
    content: "✓";
    color: var(--primary);
    font-weight: 900;
    flex-shrink: 0;
}

/* SECONDARY self block (legacy, kept for compatibility) */
.coach-home-self {
    padding: 24px 0 32px;
    text-align: center;
    border-top: 1px solid var(--border);
}

.coach-home-self__title {
    margin: 0 0 8px;
    color: var(--text-muted);
    font-size: 0.9rem;
    font-weight: 700;
}

.coach-home-self__links {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 12px;
    flex-wrap: wrap;
}

.coach-home-self__links a {
    color: var(--text-soft);
    font-size: 0.9rem;
    font-weight: 700;
    text-decoration: underline;
    text-underline-offset: 3px;
}

.coach-home-self__links a:hover {
    color: var(--primary);
}

.coach-home-self__links span {
    color: var(--border-strong);
}

/* BEGINNER block */
.coach-home-beginner {
    padding: 52px 0 56px;
    border-top: 1px solid var(--border);
    background: var(--surface-alt, var(--surface));
    text-align: center;
}

.coach-home-beginner__eyebrow {
    margin: 0 0 8px;
    font-size: 0.78rem;
    font-weight: 800;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: var(--primary);
}

.coach-home-beginner__title {
    margin: 0 0 16px;
    font-size: 1.55rem;
    font-weight: 800;
    line-height: 1.25;
    color: var(--text);
}

.coach-home-beginner__lead {
    margin: 0 auto 28px;
    font-size: 1rem;
    color: var(--text-muted);
    max-width: 540px;
    line-height: 1.6;
}

.coach-home-beginner__ctas {
    display: flex;
    justify-content: center;
    gap: 12px;
    flex-wrap: wrap;
    margin-bottom: 20px;
}

.coach-home-beginner__trainer-note {
    margin: 0 auto;
    max-width: 480px;
    font-size: 0.8rem;
    color: var(--text-soft);
    font-style: italic;
}

@media (max-width: 599px) {
    .coach-home-beginner__title {
        font-size: 1.25rem;
    }

    .coach-home-beginner__ctas {
        flex-direction: column;
        align-items: center;
    }

    .coach-home-beginner__ctas .btn {
        width: 100%;
        justify-content: center;
    }
}

/* ── Mobile ── */
@media (max-width: 899px) {
    .coach-home-hero {
        padding: 44px 0 36px;
    }

    .coach-home-hero__inner {
        grid-template-columns: 1fr;
        gap: 28px;
    }

    .coach-home-hero__copy h1 {
        font-size: clamp(2.1rem, 10vw, 3.2rem);
    }

    .coach-home-dashboard-card {
        width: 100%;
    }

    .coach-home-metrics {
        grid-template-columns: repeat(2, 1fr);
    }

    .coach-home-why__grid {
        grid-template-columns: 1fr;
    }

    .coach-home-feat-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .coach-home-offer__panel {
        padding: 28px 22px;
    }

    .coach-home-offer__features {
        grid-template-columns: 1fr;
    }

    .coach-home-why,
    .coach-home-system,
    .coach-home-how,
    .coach-home-offer {
        padding: 44px 0;
    }
}

@media (max-width: 599px) {
    .coach-home-feat-grid {
        grid-template-columns: 1fr;
    }
}

/* ═══════════════════════════════════════════════════════
   Trainer UI Utilities — status pills, empty states,
   section headers, attention rows, client detail cards
   ═══════════════════════════════════════════════════════ */

/* ── Status pills ───────────────────────────────────── */
.status-pill {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    border-radius: 999px;
    padding: 3px 10px;
    font-size: 0.78rem;
    font-weight: 700;
    letter-spacing: 0.02em;
    text-transform: uppercase;
    white-space: nowrap;
    line-height: 1.4;
}
.status-pill--success {
    background: rgba(16, 185, 129, 0.13);
    color: #047857;
}
.status-pill--warning {
    background: rgba(217, 119, 6, 0.15);
    color: #b45309;
}
.status-pill--danger {
    background: rgba(220, 38, 38, 0.12);
    color: #b91c1c;
}
.status-pill--neutral {
    background: rgba(100, 116, 139, 0.12);
    color: var(--text-muted);
}
.status-pill--info {
    background: rgba(59, 130, 246, 0.12);
    color: #1d4ed8;
}
html[data-theme="dark"] .status-pill--success { background: rgba(16, 185, 129, 0.18); color: #34d399; }
html[data-theme="dark"] .status-pill--warning  { background: rgba(251, 191, 36, 0.16);  color: #fbbf24; }
html[data-theme="dark"] .status-pill--danger   { background: rgba(248, 113, 113, 0.18); color: #f87171; }
html[data-theme="dark"] .status-pill--neutral  { background: rgba(148, 163, 184, 0.12); color: var(--text-muted); }
html[data-theme="dark"] .status-pill--info     { background: rgba(96, 165, 250, 0.18);  color: #60a5fa; }

/* ── Empty state block ──────────────────────────────── */
.empty-state {
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    padding: 32px 20px;
    gap: 10px;
}
.empty-state__icon { color: var(--text-muted); opacity: 0.65; }
.empty-state__title {
    margin: 0;
    font-size: 1.05rem;
    font-weight: 700;
    color: var(--text-soft);
}
.empty-state__lead {
    margin: 0;
    color: var(--text-muted);
    font-size: 0.92rem;
    line-height: 1.5;
    max-width: 320px;
}

/* ── Section header with optional action ────────────── */
.section-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    margin: 0 0 14px;
}
.section-header h3 { margin: 0; }

/* ── Attention-coloured task rows ───────────────────── */
.today-task-row--warn {
    border-color: rgba(217, 119, 6, 0.35);
    background: rgba(254, 243, 199, 0.4);
}
.today-task-row--danger {
    border-color: rgba(220, 38, 38, 0.28);
    background: rgba(254, 226, 226, 0.4);
}
html[data-theme="dark"] .today-task-row--warn {
    border-color: rgba(251, 191, 36, 0.28);
    background: rgba(92, 59, 3, 0.25);
}
html[data-theme="dark"] .today-task-row--danger {
    border-color: rgba(248, 113, 113, 0.28);
    background: rgba(127, 17, 17, 0.22);
}
.today-task-row--warn  .today-task-text { color: #92400e; }
.today-task-row--danger .today-task-text { color: #991b1b; }
html[data-theme="dark"] .today-task-row--warn  .today-task-text { color: #fcd34d; }
html[data-theme="dark"] .today-task-row--danger .today-task-text { color: #fca5a5; }

/* ── Attention stat card numbers ────────────────────── */
.dashboard-stat-card--warn .dashboard-stat-number  { color: #d97706; }
.dashboard-stat-card--danger .dashboard-stat-number { color: #dc2626; }
html[data-theme="dark"] .dashboard-stat-card--warn .dashboard-stat-number  { color: #fbbf24; }
html[data-theme="dark"] .dashboard-stat-card--danger .dashboard-stat-number { color: #f87171; }

/* ── Attention filter chips (clients page) ──────────── */
.program-lib-chip--warn {
    border-color: rgba(217, 119, 6, 0.4) !important;
    color: #b45309 !important;
}
.program-lib-chip--warn.is-active,
.program-lib-chip--warn:hover {
    background: rgba(217, 119, 6, 0.13) !important;
    border-color: rgba(217, 119, 6, 0.6) !important;
}
.program-lib-chip--danger {
    border-color: rgba(220, 38, 38, 0.35) !important;
    color: #b91c1c !important;
}
.program-lib-chip--danger.is-active,
.program-lib-chip--danger:hover {
    background: rgba(220, 38, 38, 0.12) !important;
    border-color: rgba(220, 38, 38, 0.5) !important;
}
html[data-theme="dark"] .program-lib-chip--warn  { color: #fbbf24 !important; border-color: rgba(251, 191, 36, 0.35) !important; }
html[data-theme="dark"] .program-lib-chip--danger { color: #f87171 !important; border-color: rgba(248, 113, 113, 0.35) !important; }

/* ── Client list hint dots ──────────────────────────── */
.client-lib-hint-dot {
    display: inline-block;
    width: 7px;
    height: 7px;
    border-radius: 50%;
    flex-shrink: 0;
    vertical-align: middle;
    margin-right: 3px;
}
.client-lib-hint-dot--ok      { background: #10b981; }
.client-lib-hint-dot--missing { background: #f59e0b; }
.client-lib-hint-dot--none    { background: #d1d5db; }

/* ── Client detail — extracted from inline <style> ──── */
.client-detail-breadcrumbs { margin: 0 0 12px; }

.history-cards { display: grid; gap: 12px; }
.history-card {
    border: 1px solid var(--border);
    border-radius: 14px;
    padding: 14px 16px;
    background: rgba(15, 23, 42, 0.02);
}
html[data-theme="dark"] .history-card { background: rgba(255, 255, 255, 0.025); }

.history-card-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    flex-wrap: wrap;
}
.history-card-title { margin: 8px 0 2px; font-weight: 700; }

.history-status-badge {
    display: inline-flex;
    align-items: center;
    border-radius: 999px;
    padding: 4px 10px;
    font-size: 0.78rem;
    letter-spacing: 0.02em;
    font-weight: 700;
    text-transform: uppercase;
}
.history-status-badge--active    { background: rgba(59,  130, 246, 0.13); color: #1d4ed8; }
.history-status-badge--completed { background: rgba(16,  185, 129, 0.13); color: #047857; }
.history-status-badge--canceled  { background: rgba(107, 114, 128, 0.16); color: #374151; }
html[data-theme="dark"] .history-status-badge--active    { color: #93c5fd; background: rgba(59,  130, 246, 0.22); }
html[data-theme="dark"] .history-status-badge--completed { color: #6ee7b7; background: rgba(16,  185, 129, 0.22); }
html[data-theme="dark"] .history-status-badge--canceled  { color: var(--text-muted); }

.history-feedback-badge {
    display: inline-flex;
    align-items: center;
    border-radius: 10px;
    padding: 4px 10px;
    font-size: 0.85rem;
    font-weight: 700;
    margin-top: 10px;
}
.history-feedback-badge--easy { background: rgba(107, 114, 128, 0.13); color: #4b5563; }
.history-feedback-badge--good { background: rgba(37,  99,  235, 0.13); color: #1d4ed8; }
.history-feedback-badge--hard { background: rgba(234, 88,  12,  0.13); color: #c2410c; }
html[data-theme="dark"] .history-feedback-badge--easy { color: var(--text-muted); }
html[data-theme="dark"] .history-feedback-badge--good { color: #93c5fd; background: rgba(59, 130, 246, 0.2); }
html[data-theme="dark"] .history-feedback-badge--hard { color: #fb923c; background: rgba(234, 88, 12, 0.2); }

.history-comment {
    margin-top: 10px;
    border-left: 3px solid var(--border);
    padding: 8px 0 8px 12px;
    white-space: pre-wrap;
}
.history-feedback-summary {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 8px;
    margin: 0 0 12px;
}
.history-feedback-summary-item {
    border: 1px solid var(--border);
    border-radius: 10px;
    padding: 8px 10px;
    font-size: 0.9rem;
}
.history-feedback-with-icon {
    display: flex;
    align-items: center;
    gap: 8px;
}
.history-feedback-with-icon .lucide-svg { flex-shrink: 0; width: 16px; height: 16px; }

.history-subtabs {
    display: flex;
    gap: 8px;
    flex-wrap: nowrap;
    overflow-x: auto;
    padding-bottom: 4px;
    scrollbar-width: thin;
    -webkit-overflow-scrolling: touch;
}
.history-subtabs .btn { white-space: nowrap; flex: 0 0 auto; }

.client-data-form.client-data-form--readonly .client-data-field {
    background: transparent;
    border-color: transparent;
    box-shadow: none;
    padding-left: 0;
    padding-right: 0;
    resize: none;
    cursor: default;
    color: var(--text);
}
.client-data-form.client-data-form--readonly .client-data-field:focus {
    outline: none;
    border-color: transparent;
}
.client-data-form.client-data-form--readonly .client-data-field::placeholder {
    color: transparent;
}

#telegram-connect-modal .trainer-invite-hidden-copy-src {
    position: absolute;
    left: -9999px;
    width: 1px;
    height: 1px;
    opacity: 0;
    overflow: hidden;
}
#telegram-connect-modal .trainer-invite-code-badge {
    display: block;
    width: 100%;
    box-sizing: border-box;
    margin: 0 0 4px;
    padding: 10px 12px;
    font-family: ui-monospace, monospace;
    font-size: 0.78rem;
    line-height: 1.35;
    word-break: break-all;
    text-align: left;
    cursor: pointer;
    border: 1px solid rgba(0, 0, 0, 0.12);
    border-radius: 8px;
    background: var(--surface-alt, rgba(0, 0, 0, 0.06));
    color: inherit;
}
#telegram-connect-modal .trainer-invite-code-badge:hover {
    border-color: rgba(0, 0, 0, 0.22);
}
#telegram-connect-modal .trainer-invite-tg-intro,
#telegram-connect-modal .trainer-invite-tg-step__label,
#telegram-connect-modal .trainer-invite-tg-step__hint {
    user-select: none;
}
#telegram-connect-modal .trainer-invite-tg-step {
    margin: 0 0 16px;
    padding: 0 0 14px;
    border-bottom: 1px solid rgba(0, 0, 0, 0.08);
}
#telegram-connect-modal .trainer-invite-tg-step:last-child {
    margin-bottom: 0;
    padding-bottom: 0;
    border-bottom: none;
}
#telegram-connect-modal .trainer-invite-tg-step__label {
    margin: 0 0 8px;
    font-weight: 600;
    font-size: 0.9rem;
}
#telegram-connect-modal .trainer-invite-tg-step__hint {
    margin: 0 0 8px;
    font-size: 0.85rem;
    opacity: 0.88;
    line-height: 1.4;
}
#telegram-connect-modal .trainer-invite-tg-step__actions {
    margin: 10px 0 0;
    flex-wrap: wrap;
    gap: 8px;
}

/* ── Recent client mini-list — clickable rows ───────── */
.recent-client-mini-list li {
    padding: 2px 0;
    border-bottom: 1px solid var(--border);
}
.recent-client-mini-list li:last-child { border-bottom: none; }

/* ── Dashboard section divider label ────────────────── */
.dash-section-label {
    font-size: 0.72rem;
    font-weight: 800;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: var(--text-muted);
    margin: 0 0 8px;
}

/* ── Clients attention panel — stronger visual weight ── */
.clients-attention-panel {
    border-left: 3px solid #f59e0b;
}
html[data-theme="dark"] .clients-attention-panel {
    border-left-color: #fbbf24;
}

/* ── Program day card improvements ─────────────────── */
.program-day-card-meta {
    font-size: 0.82rem;
    color: var(--text-muted);
    margin-top: 4px;
}

/* ── Client header status row ───────────────────────── */
.client-header-status-row {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    align-items: center;
    margin-top: 8px;
}

/* ── Sidebar active item — bolder label ─────────────── */
.sidebar-nav a.active { font-weight: 700; }

/* ── Client-side Telegram hidden copy sources ────────── */
.client-tg-hidden-src {
    position: absolute;
    left: -9999px;
    width: 1px;
    height: 1px;
    opacity: 0;
    overflow: hidden;
}
.client-tg-code-badge {
    display: block;
    width: 100%;
    box-sizing: border-box;
    margin: 0 0 4px;
    padding: 10px 12px;
    font-family: ui-monospace, monospace;
    font-size: 0.78rem;
    line-height: 1.35;
    word-break: break-all;
    text-align: left;
    cursor: pointer;
    border: 1px solid rgba(0, 0, 0, 0.12);
    border-radius: 8px;
    background: var(--surface-alt, rgba(0, 0, 0, 0.06));
    color: inherit;
    transition: border-color 0.15s;
}
.client-tg-code-badge:hover { border-color: rgba(0, 0, 0, 0.22); }
html[data-theme="dark"] .client-tg-code-badge {
    border-color: rgba(255, 255, 255, 0.12);
    background: rgba(255, 255, 255, 0.05);
}
html[data-theme="dark"] .client-tg-code-badge:hover { border-color: rgba(255, 255, 255, 0.28); }

/* ── Telegram nudge in Today ─────────────────────────── */
.client-telegram-nudge {
    display: flex;
    align-items: flex-start;
    gap: 10px;
    background: var(--surface);
    border: 1px solid color-mix(in srgb, #229ED9 28%, var(--border));
    border-left: 3px solid #229ED9;
    border-radius: 14px;
    padding: 12px 14px;
    margin: 8px 0 4px;
    box-shadow: var(--card-shadow);
}
.client-telegram-nudge__icon {
    flex-shrink: 0;
    color: #229ED9;
    margin-top: 2px;
}
.client-telegram-nudge__body {
    flex: 1;
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 2px;
}
.client-telegram-nudge__title {
    font-size: 0.9rem;
    font-weight: 700;
    color: var(--text);
}
.client-telegram-nudge__text {
    font-size: 0.82rem;
    color: var(--text-muted);
    line-height: 1.45;
}
.client-telegram-nudge__cta {
    flex-shrink: 0;
    align-self: center;
    font-size: 0.82rem;
    padding: 6px 12px;
    white-space: nowrap;
}
@media (max-width: 480px) {
    .client-telegram-nudge {
        flex-wrap: wrap;
    }
    .client-telegram-nudge__cta {
        width: 100%;
        text-align: center;
        margin-top: 4px;
    }
}

/* ── Trainer Telegram connect steps ──────────────────── */
.tg-connect-steps {
    list-style: none;
    margin: 0 0 8px;
    padding: 0;
    display: grid;
    gap: 12px;
}
.tg-connect-step {
    display: grid;
    gap: 8px;
    padding: 12px 14px;
    border: 1px solid var(--border);
    border-radius: 12px;
    background: var(--surface-2);
    counter-increment: none;
}
.tg-connect-step__label {
    font-weight: 700;
    font-size: 0.92rem;
    color: var(--text);
}
.tg-connect-step__action {
    width: 100%;
    text-align: center;
}

/* ═══════════════════════════════════════════════════════
   Gym Scan Landing — enhanced visual styles
   ═══════════════════════════════════════════════════════ */

/* ── Hero demo card ─────────────────────────────────── */
.landing-scan-demo-card {
    border-radius: 20px;
    border: 1px solid var(--border);
    overflow: hidden;
    box-shadow: 0 24px 60px rgba(15, 23, 42, 0.22), 0 4px 12px rgba(15, 23, 42, 0.08);
    background: var(--surface);
}

.landing-scan-demo-card .landing-gym-horizontal {
    border-radius: 0;
    border: none;
    border-bottom: 1px solid var(--border);
    box-shadow: none;
    aspect-ratio: 16 / 9;
}

.landing-scan-ai-result {
    padding: 16px 18px 18px;
}

.landing-scan-ai-result strong {
    display: flex;
    align-items: center;
    gap: 6px;
    font-size: 0.85rem;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    color: var(--text-muted);
    margin-bottom: 8px;
}

.landing-scan-ai-result strong::before {
    content: '🤖';
    font-size: 1rem;
}

.landing-scan-ai-result > span {
    display: block;
    font-size: 0.82rem;
    color: var(--text-muted);
    margin-bottom: 10px;
    line-height: 1.4;
}

.landing-scan-eq-pills {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    margin-bottom: 12px;
}

.landing-scan-eq-pill {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    font-size: 0.73rem;
    font-weight: 700;
    padding: 3px 9px;
    border-radius: 999px;
    background: color-mix(in srgb, var(--primary) 12%, var(--surface));
    border: 1px solid color-mix(in srgb, var(--primary) 28%, var(--border));
    color: var(--primary);
}

.landing-scan-ai-result .landing-bullets {
    margin: 0;
}

.landing-scan-ai-result .landing-bullets li {
    font-size: 0.88rem;
}

/* ── Features strip ─────────────────────────────────── */
.landing-scan-features {
    padding: 0 0 32px;
}

.landing-scan-features__grid {
    display: grid;
    gap: 12px;
    max-width: 900px;
    margin: 0 auto;
}

@media (min-width: 600px) {
    .landing-scan-features__grid {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }
}

.landing-scan-feature {
    display: flex;
    flex-direction: column;
    gap: 6px;
    padding: 18px 18px 16px;
    border-radius: 18px;
    border: 1px solid var(--border);
    background: var(--surface);
}

.landing-scan-feature__icon {
    font-size: 1.6rem;
    line-height: 1;
    margin-bottom: 2px;
}

.landing-scan-feature__title {
    font-size: 0.95rem;
    font-weight: 750;
    color: var(--text);
    margin: 0;
}

.landing-scan-feature__text {
    font-size: 0.83rem;
    color: var(--text-muted);
    line-height: 1.45;
    margin: 0;
}

/* ── How-it-works cards ─────────────────────────────── */
.landing-how-cards {
    display: grid;
    gap: 12px;
    margin-top: 24px;
}

@media (min-width: 700px) {
    .landing-how-cards {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }
}

.landing-how-card {
    position: relative;
    display: flex;
    flex-direction: column;
    gap: 8px;
    padding: 20px 18px 18px;
    border-radius: 18px;
    border: 1px solid var(--border);
    background: var(--surface);
}

.landing-how-card__num {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 32px;
    height: 32px;
    border-radius: 50%;
    background: var(--primary);
    color: #fff;
    font-size: 0.88rem;
    font-weight: 800;
    flex-shrink: 0;
    margin-bottom: 4px;
}

.landing-how-card__icon {
    font-size: 1.5rem;
    line-height: 1;
    margin-bottom: 4px;
}

.landing-how-card__title {
    font-size: 1rem;
    font-weight: 750;
    color: var(--text);
    margin: 0;
}

.landing-how-card__text {
    font-size: 0.85rem;
    color: var(--text-muted);
    line-height: 1.5;
    margin: 0;
}

/* ── FAQ accordion cards ────────────────────────────── */
.landing-faq-cards {
    display: grid;
    gap: 10px;
    max-width: 720px;
    margin-top: 20px;
}

.landing-faq-card {
    border: 1px solid var(--border);
    border-radius: 16px;
    overflow: hidden;
}

.landing-faq-card summary {
    list-style: none;
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 12px;
    padding: 15px 18px;
    font-weight: 700;
    font-size: 0.95rem;
    color: var(--text);
    cursor: pointer;
    user-select: none;
    background: var(--surface);
}

.landing-faq-card summary::-webkit-details-marker { display: none; }

.landing-faq-card summary::after {
    content: '+';
    font-size: 1.3rem;
    font-weight: 400;
    color: var(--text-muted);
    flex-shrink: 0;
    transition: transform 0.2s;
}

.landing-faq-card[open] summary::after {
    transform: rotate(45deg);
}

.landing-faq-card__body {
    padding: 0 18px 16px;
    font-size: 0.9rem;
    color: var(--text-soft);
    line-height: 1.55;
    border-top: 1px solid var(--border);
    background: var(--surface);
}

/* ═══════════════════════════════════════════════════════
   Home Start Onboarding — enhanced visual styles
   ═══════════════════════════════════════════════════════ */

/* ── Progress bar (pill steps) ──────────────────────── */
.start-onboarding-progress-pills {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0;
    margin-bottom: 28px;
}

.start-progress-pill {
    display: flex;
    align-items: center;
    gap: 6px;
    font-size: 0.75rem;
    font-weight: 700;
    padding: 5px 12px 5px 8px;
    border-radius: 999px;
    color: var(--text-muted);
    background: transparent;
    white-space: nowrap;
    transition: color 0.2s;
}

.start-progress-pill__num {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 20px;
    height: 20px;
    border-radius: 50%;
    background: color-mix(in srgb, var(--text-muted) 25%, transparent);
    font-size: 0.72rem;
    font-weight: 800;
    color: var(--text-muted);
    transition: background 0.2s, color 0.2s;
    flex-shrink: 0;
}

.start-progress-pill.is-active {
    color: var(--primary);
}

.start-progress-pill.is-active .start-progress-pill__num {
    background: var(--primary);
    color: #fff;
}

.start-progress-pill.is-done .start-progress-pill__num {
    background: color-mix(in srgb, var(--primary) 30%, transparent);
    color: var(--primary);
}

.start-progress-sep {
    width: 20px;
    height: 2px;
    background: color-mix(in srgb, var(--border) 80%, transparent);
    flex-shrink: 0;
}

/* ── Enhanced choice cards ──────────────────────────── */
.start-choice-card {
    display: flex;
    align-items: flex-start;
    gap: 12px;
    text-align: left;
    padding: 16px 18px;
    border-radius: 16px;
    border: 2px solid color-mix(in srgb, var(--border) 75%, transparent);
    background: var(--surface);
    color: var(--text);
    font-size: 1rem;
    font-weight: 800;
    cursor: pointer;
    transition: border-color 0.15s, background 0.15s, box-shadow 0.15s;
    width: 100%;
}

.start-choice-card:hover {
    border-color: color-mix(in srgb, var(--primary) 60%, var(--border));
    background: color-mix(in srgb, var(--primary) 5%, var(--surface));
}

.start-choice-card.is-selected {
    border-color: var(--primary);
    background: color-mix(in srgb, var(--primary) 8%, var(--surface));
    box-shadow: 0 0 0 3px color-mix(in srgb, var(--primary) 16%, transparent);
}

.start-choice-card__icon {
    font-size: 1.6rem;
    line-height: 1;
    flex-shrink: 0;
    margin-top: 1px;
}

.start-choice-card__body {
    display: flex;
    flex-direction: column;
    gap: 2px;
}

.start-choice-card__label {
    font-size: 1rem;
    font-weight: 800;
    color: var(--text);
    line-height: 1.2;
}

.start-choice-card__sub {
    font-size: 0.8rem;
    font-weight: 500;
    color: var(--text-muted);
    line-height: 1.35;
}

/* ── Preview plan card ──────────────────────────────── */
.start-plan-preview {
    margin: 0 0 16px;
    padding: 18px 18px 16px;
    border-radius: 18px;
    border: 1px solid color-mix(in srgb, var(--border) 80%, transparent);
    background: var(--surface);
    box-shadow: 0 4px 20px rgba(0,0,0,0.06);
}

/* ── Mobile responsive for new utilities ────────────── */
@media (max-width: 767px) {
    .history-feedback-summary {
        grid-template-columns: 1fr;
    }
    .measurements-kpi-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

/* ═══════════════════════════════════════════════════════
   Smart Gym Scan — enhanced visual components
   ═══════════════════════════════════════════════════════ */

/* ── Hero steps bar ─────────────────────────────────── */
.smart-scan-steps {
    display: flex;
    align-items: flex-start;
    gap: 0;
    margin: 16px 0 4px;
    padding: 14px 16px;
    background: color-mix(in srgb, var(--surface-2) 70%, transparent);
    border: 1px solid var(--border);
    border-radius: 16px;
}

.smart-scan-step {
    flex: 1;
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    position: relative;
    padding: 0 4px;
}

.smart-scan-step + .smart-scan-step::before {
    content: '';
    position: absolute;
    left: -1px;
    top: 14px;
    width: 2px;
    height: 2px;
    background: var(--border-strong);
    border-radius: 50%;
    transform: translateX(-50%);
}

.smart-scan-step__num {
    width: 28px;
    height: 28px;
    border-radius: 50%;
    background: var(--primary);
    color: #fff;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 0.8rem;
    font-weight: 700;
    margin-bottom: 6px;
    flex-shrink: 0;
}

.smart-scan-step__label {
    font-size: 0.78rem;
    font-weight: 700;
    color: var(--text);
    line-height: 1.2;
    margin-bottom: 2px;
}

.smart-scan-step__detail {
    font-size: 0.72rem;
    color: var(--text-muted);
    line-height: 1.3;
}

/* ── Mode cards ─────────────────────────────────────── */
.smart-scan-mode-cards {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 10px;
    margin-bottom: 4px;
}

.smart-scan-mode-card {
    position: relative;
    border: 2px solid var(--border);
    border-radius: 14px;
    padding: 14px 14px 12px;
    cursor: pointer;
    transition: border-color 0.15s, box-shadow 0.15s, background 0.15s;
    background: var(--surface);
    user-select: none;
}

.smart-scan-mode-card input[type="radio"] {
    position: absolute;
    opacity: 0;
    width: 0;
    height: 0;
    pointer-events: none;
}

.smart-scan-mode-card:hover {
    border-color: color-mix(in srgb, var(--primary) 55%, var(--border));
    background: color-mix(in srgb, var(--surface-2) 80%, transparent);
}

.smart-scan-mode-card.is-selected {
    border-color: var(--primary);
    background: color-mix(in srgb, var(--primary) 6%, var(--surface));
    box-shadow: 0 0 0 3px color-mix(in srgb, var(--primary) 18%, transparent);
}

.smart-scan-mode-card__icon {
    font-size: 1.6rem;
    line-height: 1;
    margin-bottom: 7px;
}

.smart-scan-mode-card__title {
    font-size: 0.92rem;
    font-weight: 700;
    color: var(--text);
    margin: 0 0 4px;
    letter-spacing: -0.01em;
}

.smart-scan-mode-card__hint {
    font-size: 0.78rem;
    color: var(--text-muted);
    line-height: 1.35;
    margin: 0;
}

.smart-scan-mode-card__badge {
    position: absolute;
    top: 10px;
    right: 10px;
    font-size: 0.68rem;
    font-weight: 700;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    color: var(--primary);
    background: color-mix(in srgb, var(--primary) 12%, transparent);
    border: 1px solid color-mix(in srgb, var(--primary) 30%, transparent);
    border-radius: 20px;
    padding: 2px 7px;
}

/* ── Upload zone ────────────────────────────────────── */
.smart-scan-upload-zone {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 6px;
    border: 2px dashed var(--border-strong);
    border-radius: 14px;
    padding: 20px 16px 18px;
    margin: 4px 0 8px;
    cursor: pointer;
    transition: border-color 0.15s, background 0.15s;
    background: color-mix(in srgb, var(--surface-2) 50%, transparent);
    text-align: center;
    position: relative;
}

.smart-scan-upload-zone:hover {
    border-color: var(--primary);
    background: color-mix(in srgb, var(--primary) 4%, var(--surface));
}

.smart-scan-upload-zone.has-file {
    border-color: var(--success, #16a34a);
    background: color-mix(in srgb, var(--success, #16a34a) 6%, var(--surface));
}

.smart-scan-upload-zone__icon {
    font-size: 1.8rem;
    line-height: 1;
    opacity: 0.6;
}

.smart-scan-upload-zone input[type="file"] {
    position: absolute;
    inset: 0;
    opacity: 0;
    cursor: pointer;
    width: 100%;
    height: 100%;
}

.smart-scan-upload-zone__label {
    font-size: 0.86rem;
    font-weight: 600;
    color: var(--text-soft);
    margin: 0;
    pointer-events: none;
}

.smart-scan-upload-zone__hint {
    font-size: 0.76rem;
    color: var(--text-muted);
    margin: 0;
    pointer-events: none;
    line-height: 1.35;
}

.smart-scan-upload-zone__filename {
    font-size: 0.78rem;
    font-weight: 600;
    color: var(--primary);
    margin: 0;
    max-width: 100%;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    display: none;
    pointer-events: none;
}

.smart-scan-upload-zone.has-file .smart-scan-upload-zone__filename {
    display: block;
}

.smart-scan-upload-zone.has-file .smart-scan-upload-zone__hint {
    display: none;
}

/* ── Form section title ─────────────────────────────── */
.smart-scan-form-section-title {
    display: flex;
    align-items: center;
    gap: 8px;
    margin: 20px 0 12px;
    font-size: 0.82rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    color: var(--text-muted);
}

.smart-scan-form-section-title::before,
.smart-scan-form-section-title::after {
    content: '';
    flex: 1;
    height: 1px;
    background: var(--border);
}

/* ── Exercise row in preview ────────────────────────── */
.smart-scan-ex-row {
    display: flex;
    align-items: baseline;
    gap: 6px;
    flex-wrap: wrap;
    padding: 8px 0;
    border-bottom: 1px solid var(--border);
}

.smart-scan-ex-row:last-child {
    border-bottom: none;
}

.smart-scan-ex-row__name {
    font-weight: 650;
    color: var(--text);
    font-size: 0.93rem;
}

.smart-scan-ex-row__meta {
    display: flex;
    align-items: center;
    gap: 5px;
    flex-wrap: wrap;
}

.smart-scan-ex-pill {
    display: inline-flex;
    align-items: center;
    gap: 3px;
    font-size: 0.75rem;
    font-weight: 600;
    color: var(--text-soft);
    background: var(--surface-2);
    border: 1px solid var(--border);
    border-radius: 20px;
    padding: 2px 8px;
    white-space: nowrap;
}

.smart-scan-ex-pill--sets { color: var(--primary); border-color: color-mix(in srgb, var(--primary) 30%, var(--border)); }
.smart-scan-ex-pill--alt { color: var(--text-muted); font-style: italic; }

.smart-scan-ex-row__alt {
    width: 100%;
    font-size: 0.76rem;
    color: var(--text-muted);
    margin-top: 2px;
    line-height: 1.35;
}

.smart-scan-ex-row__link {
    font-size: 0.76rem;
    color: var(--primary);
    text-decoration: none;
    margin-top: 2px;
    display: block;
}

.smart-scan-ex-row__link:hover { text-decoration: underline; }

/* ── Day card header ────────────────────────────────── */
.smart-scan-day-header {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-bottom: 6px;
    flex-wrap: wrap;
}

.smart-scan-day-title {
    font-size: 0.97rem;
    font-weight: 700;
    color: var(--text);
    margin: 0;
    flex: 1;
    min-width: 0;
}

.smart-scan-day-count {
    font-size: 0.75rem;
    font-weight: 700;
    color: var(--text-muted);
    background: var(--surface-2);
    border: 1px solid var(--border);
    border-radius: 20px;
    padding: 2px 9px;
    flex-shrink: 0;
}

.smart-scan-warmup-line,
.smart-scan-cooldown-line {
    font-size: 0.85rem;
    color: var(--text-muted);
    margin: 4px 0;
    line-height: 1.4;
}

/* ── Quota / info card ──────────────────────────────── */
.smart-scan-quota-badge {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    font-size: 0.78rem;
    font-weight: 700;
    padding: 3px 10px;
    border-radius: 20px;
    border: 1px solid var(--border);
    background: var(--surface-2);
    color: var(--text-soft);
    margin-left: auto;
    flex-shrink: 0;
}

.smart-scan-quota-badge--ok {
    color: var(--success, #16a34a);
    border-color: color-mix(in srgb, var(--success, #16a34a) 30%, var(--border));
    background: color-mix(in srgb, var(--success, #16a34a) 8%, var(--surface));
}

.smart-scan-quota-badge--warn {
    color: #b45309;
    border-color: color-mix(in srgb, #b45309 30%, var(--border));
    background: color-mix(in srgb, #b45309 8%, var(--surface));
}

/* Support mode (admin helping trainer setup) */
.support-mode-banner {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    flex-wrap: wrap;
    margin: 0 0 16px;
    padding: 12px 16px;
    border-radius: 12px;
    border: 1px solid color-mix(in srgb, #f59e0b 35%, var(--border));
    background: color-mix(in srgb, #f59e0b 10%, var(--surface));
    color: var(--text);
    font-size: 0.9rem;
    font-weight: 600;
}

.support-mode-banner__text {
    flex: 1;
    min-width: 0;
}

.support-grant-panel__status {
    margin: 0;
    font-size: 0.88rem;
    color: var(--primary);
    font-weight: 700;
}

.support-mode-admin-panel {
    border-color: color-mix(in srgb, #f59e0b 30%, var(--border));
}

/* ── Responsive ─────────────────────────────────────── */
@media (max-width: 519px) {
    .smart-scan-steps {
        gap: 0;
        padding: 12px 10px;
    }
    .smart-scan-step__detail {
        display: none;
    }
    .smart-scan-mode-cards {
        grid-template-columns: 1fr 1fr;
        gap: 8px;
    }
    .smart-scan-mode-card {
        padding: 11px 11px 10px;
    }
    .smart-scan-mode-card__hint {
        display: none;
    }
}

/* ── Club white-label landing (app.joinfithub.com) ───── */
.club-wl-page {
    overflow-x: clip;
}

.club-wl-hero {
    padding: clamp(2.5rem, 6vw, 4.5rem) 0 clamp(2rem, 5vw, 3.5rem);
}

.club-wl-hero__inner {
    display: grid;
    grid-template-columns: 1fr;
    gap: 2rem;
    align-items: center;
}

@media (min-width: 900px) {
    .club-wl-hero__inner {
        grid-template-columns: 1.05fr 0.95fr;
        gap: 2.5rem;
    }
}

.club-wl-hero h1 {
    font-size: clamp(1.85rem, 4.5vw, 2.75rem);
    line-height: 1.12;
    margin: 0.5rem 0 1rem;
    letter-spacing: -0.02em;
}

.club-wl-brand-preview {
    border: 1px solid var(--border);
    border-radius: 18px;
    background: linear-gradient(165deg, color-mix(in srgb, var(--primary) 12%, var(--surface)) 0%, var(--surface) 55%);
    box-shadow: 0 18px 48px color-mix(in srgb, var(--text) 8%, transparent);
    overflow: hidden;
}

.club-wl-brand-preview__bar {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 14px 16px;
    border-bottom: 1px solid var(--border);
    background: color-mix(in srgb, var(--primary) 18%, var(--surface));
}

.club-wl-brand-preview__dot {
    width: 10px;
    height: 10px;
    border-radius: 50%;
    background: var(--primary);
    flex-shrink: 0;
}

.club-wl-brand-preview__name {
    font-weight: 800;
    font-size: 0.95rem;
}

.club-wl-brand-preview__body {
    padding: 14px 16px 16px;
    display: grid;
    gap: 10px;
}

.club-wl-brand-preview__row {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 10px 12px;
    border-radius: 12px;
    background: color-mix(in srgb, var(--surface) 88%, var(--text) 4%);
    border: 1px solid var(--border);
    font-size: 0.88rem;
}

.club-wl-brand-preview__row span {
    flex: 1;
}

.club-wl-brand-preview__ok {
    color: var(--success, #22c55e);
}

.club-wl-brand-preview__channels {
    display: flex;
    gap: 8px;
    margin-top: 4px;
}

.club-wl-brand-preview__channels span {
    font-size: 0.72rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    padding: 4px 10px;
    border-radius: 999px;
    border: 1px solid var(--border);
    color: var(--text-soft);
}

.club-wl-section {
    padding: clamp(2.5rem, 5vw, 4rem) 0;
}

.club-wl-section--alt {
    background: color-mix(in srgb, var(--surface) 92%, var(--primary) 4%);
    border-block: 1px solid var(--border);
}

.club-wl-section-lead {
    max-width: 42rem;
    margin: 0 0 1.75rem;
    color: var(--text-soft);
    font-size: 1.02rem;
    line-height: 1.55;
}

.club-wl-compare {
    padding: clamp(2.5rem, 5vw, 4rem) 0;
}

.club-wl-compare__grid {
    display: grid;
    grid-template-columns: 1fr;
    gap: 1rem;
    align-items: stretch;
}

@media (min-width: 768px) {
    .club-wl-compare__grid {
        grid-template-columns: 1fr auto 1fr;
        gap: 1.25rem;
        align-items: center;
    }
}

.club-wl-compare__card {
    border-radius: 16px;
    border: 1px solid var(--border);
    padding: 1.25rem 1.35rem;
    background: var(--surface);
}

.club-wl-compare__card--before {
    border-color: color-mix(in srgb, #ef4444 35%, var(--border));
}

.club-wl-compare__card--after {
    border-color: color-mix(in srgb, var(--primary) 45%, var(--border));
    background: color-mix(in srgb, var(--primary) 6%, var(--surface));
}

.club-wl-compare__label {
    font-size: 0.75rem;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    color: var(--text-soft);
    margin: 0 0 0.75rem;
}

.club-wl-compare__list {
    margin: 0;
    padding-left: 1.1rem;
    display: grid;
    gap: 0.55rem;
    color: var(--text);
    line-height: 1.45;
}

.club-wl-compare__arrow {
    display: none;
    font-size: 1.75rem;
    font-weight: 800;
    color: var(--primary);
    text-align: center;
}

@media (min-width: 768px) {
    .club-wl-compare__arrow {
        display: block;
    }
}

.club-wl-feat-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
    gap: 1rem;
}

.club-wl-feat-card {
    border: 1px solid var(--border);
    border-radius: 16px;
    padding: 1.15rem 1.2rem;
    background: var(--surface);
}

.club-wl-feat-card__icon {
    width: 42px;
    height: 42px;
    border-radius: 12px;
    display: grid;
    place-items: center;
    background: color-mix(in srgb, var(--primary) 14%, var(--surface));
    color: var(--primary);
    margin-bottom: 0.75rem;
}

.club-wl-feat-card h3 {
    margin: 0 0 0.45rem;
    font-size: 1rem;
}

.club-wl-feat-card p {
    margin: 0;
    color: var(--text-soft);
    font-size: 0.9rem;
    line-height: 1.45;
}

.club-wl-member-grid {
    display: grid;
    grid-template-columns: 1fr;
    gap: 1.5rem;
    align-items: center;
}

@media (min-width: 860px) {
    .club-wl-member-grid {
        grid-template-columns: 1fr 0.85fr;
    }
}

.club-wl-member-card {
    border: 1px solid var(--border);
    border-radius: 16px;
    padding: 1.25rem;
    background: var(--surface);
}

.club-wl-member-list {
    list-style: none;
    margin: 0;
    padding: 0;
    display: grid;
    gap: 0.75rem;
}

.club-wl-member-list li {
    display: flex;
    align-items: center;
    gap: 10px;
    font-weight: 600;
    font-size: 0.95rem;
}

.club-wl-phone-mock {
    border: 1px solid var(--border);
    border-radius: 22px;
    padding: 1rem 1rem 1.1rem;
    background: var(--surface);
    box-shadow: 0 14px 36px color-mix(in srgb, var(--text) 7%, transparent);
}

.club-wl-phone-mock__head {
    font-weight: 800;
    margin-bottom: 0.85rem;
    font-size: 0.95rem;
}

.club-wl-phone-mock__line {
    padding: 0.65rem 0.75rem;
    border-radius: 10px;
    border: 1px solid var(--border);
    margin-bottom: 0.5rem;
    font-size: 0.85rem;
    color: var(--text-soft);
}

.club-wl-phone-mock__line--active {
    border-color: color-mix(in srgb, var(--primary) 50%, var(--border));
    color: var(--text);
    background: color-mix(in srgb, var(--primary) 8%, var(--surface));
}

.club-wl-phone-mock__pill {
    margin-top: 0.65rem;
    display: inline-block;
    font-size: 0.75rem;
    font-weight: 700;
    padding: 6px 12px;
    border-radius: 999px;
    background: color-mix(in srgb, var(--primary) 16%, var(--surface));
    color: var(--primary);
}

.club-wl-brand-grid {
    display: grid;
    grid-template-columns: 1fr;
    gap: 1.25rem;
}

@media (min-width: 768px) {
    .club-wl-brand-grid {
        grid-template-columns: 1.1fr 0.9fr;
        align-items: start;
    }
}

.club-wl-brand-list {
    list-style: none;
    margin: 0;
    padding: 0;
    display: grid;
    gap: 0.7rem;
}

.club-wl-brand-list li {
    display: flex;
    align-items: center;
    gap: 10px;
    font-weight: 600;
}

.club-wl-domain-note {
    border: 1px dashed color-mix(in srgb, var(--primary) 40%, var(--border));
    border-radius: 14px;
    padding: 1rem 1.1rem;
    background: color-mix(in srgb, var(--primary) 5%, var(--surface));
}

.club-wl-domain-note p {
    margin: 0;
    color: var(--text-soft);
    line-height: 1.5;
    font-size: 0.92rem;
}

.club-wl-demo {
    padding: clamp(2.75rem, 6vw, 4.5rem) 0;
    background: linear-gradient(180deg, color-mix(in srgb, var(--primary) 10%, var(--surface)) 0%, var(--surface) 100%);
    border-block: 1px solid var(--border);
}

.club-wl-demo__inner {
    text-align: center;
}

.club-wl-demo__inner .club-wl-section-lead {
    margin-inline: auto;
}

.club-wl-demo__actions {
    display: flex;
    flex-wrap: wrap;
    gap: 0.75rem;
    justify-content: center;
    margin-top: 1.25rem;
}

.club-wl-pricing {
    padding: clamp(2.5rem, 5vw, 4rem) 0 clamp(3rem, 6vw, 5rem);
}

.club-wl-pricing__panel {
    max-width: 720px;
    margin: 0 auto;
    text-align: center;
    border: 1px solid var(--border);
    border-radius: 20px;
    padding: clamp(1.5rem, 4vw, 2.25rem);
    background: var(--surface);
    box-shadow: 0 16px 40px color-mix(in srgb, var(--text) 6%, transparent);
}

.club-wl-pricing__highlight {
    font-size: clamp(1.25rem, 3vw, 1.55rem);
    font-weight: 800;
    color: var(--primary);
    margin: 0.35rem 0 0.75rem;
}

.club-wl-pricing__features {
    list-style: none;
    margin: 0 0 1.25rem;
    padding: 0;
    display: grid;
    gap: 0.45rem;
    color: var(--text-soft);
}

.club-wl-pricing__panel .hero-actions {
    justify-content: center;
}

.header-landing-desktop-nav .btn-sm {
    padding: 0.45rem 0.85rem;
    font-size: 0.82rem;
}

/* ── Demo club portal (app.joinfithub.com) ───────────── */
.club-portal-body {
    min-height: 100dvh;
    background:
        radial-gradient(1200px 600px at 50% -10%, color-mix(in srgb, var(--primary) 16%, transparent), transparent 60%),
        var(--bg);
}

.club-portal-page {
    min-height: 100dvh;
    display: flex;
    justify-content: center;
    padding: 0 1rem 2.5rem;
}

.club-portal-shell {
    width: min(560px, 100%);
    padding-top: env(safe-area-inset-top, 0px);
}

.club-portal-topbar {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    padding: 0.85rem 0 0.25rem;
}

.club-portal-topbar__tools {
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.club-portal-lang summary {
    cursor: pointer;
    font-weight: 700;
    font-size: 0.82rem;
    padding: 0.35rem 0.55rem;
    border-radius: 8px;
    border: 1px solid var(--border);
}

.club-portal-hero {
    text-align: center;
    padding: 1.5rem 0 1.75rem;
}

.club-portal-logo {
    width: 88px;
    height: 88px;
    margin: 0 auto 1rem;
    border-radius: 22px;
    display: grid;
    place-items: center;
    background: linear-gradient(145deg, color-mix(in srgb, var(--primary) 28%, var(--surface)), var(--surface));
    border: 1px solid color-mix(in srgb, var(--primary) 35%, var(--border));
    box-shadow: 0 14px 36px color-mix(in srgb, var(--primary) 18%, transparent);
}

.club-portal-logo__mark {
    font-size: 1.65rem;
    font-weight: 900;
    letter-spacing: 0.04em;
    color: var(--primary);
}

.club-portal-eyebrow {
    margin: 0 0 0.35rem;
    font-size: 0.78rem;
    font-weight: 800;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: var(--text-soft);
}

.club-portal-name {
    margin: 0 0 0.65rem;
    font-size: clamp(1.65rem, 5vw, 2.15rem);
    line-height: 1.12;
    letter-spacing: -0.02em;
}

.club-portal-welcome {
    margin: 0 auto 1.35rem;
    max-width: 26rem;
    color: var(--text-soft);
    line-height: 1.55;
    font-size: 1rem;
}

.club-portal-actions {
    display: flex;
    flex-direction: column;
    gap: 0.65rem;
    align-items: stretch;
}

.club-portal-actions .btn {
    width: 100%;
    justify-content: center;
}

.club-portal-benefits {
    margin-top: 0.5rem;
    border: 1px solid var(--border);
    border-radius: 16px;
    padding: 1.1rem 1.15rem;
    background: color-mix(in srgb, var(--surface) 94%, var(--primary) 3%);
}

.club-portal-benefits__title {
    margin: 0 0 0.85rem;
    font-size: 0.92rem;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    color: var(--text-soft);
}

.club-portal-benefits__list {
    list-style: none;
    margin: 0;
    padding: 0;
    display: grid;
    gap: 0.55rem;
}

.club-portal-benefits__list li {
    display: flex;
    align-items: center;
    gap: 0.55rem;
    font-size: 0.92rem;
    font-weight: 600;
}

.club-portal-demo-note {
    margin: 1.15rem 0 0;
    text-align: center;
    font-size: 0.82rem;
    line-height: 1.45;
    color: var(--text-soft);
}

.club-portal-staff-link {
    margin: 0.85rem 0 0;
    text-align: center;
    font-size: 0.82rem;
}

.club-portal-staff-link a {
    color: var(--text-soft);
    text-decoration: underline;
    text-underline-offset: 0.15em;
}

.club-portal-staff-credentials {
    margin: 0.45rem 0 0;
    text-align: center;
    font-size: 0.78rem;
    line-height: 1.45;
    color: var(--text-soft);
    font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace;
}

.header-inner--club-portal-auth {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    padding-top: 0.85rem;
    padding-bottom: 0.85rem;
}

.club-portal-auth-brand {
    display: inline-flex;
    align-items: center;
    text-decoration: none;
    color: inherit;
}

.club-portal-brand {
    display: inline-flex;
    align-items: center;
    gap: 0.65rem;
}

.club-portal-brand--compact .club-portal-brand__name {
    font-size: 0.95rem;
}

.club-portal-brand__name {
    font-size: 1.05rem;
    font-weight: 800;
    letter-spacing: -0.02em;
}

.club-portal-auth-tools {
    display: inline-flex;
    align-items: center;
    gap: 0.55rem;
}

.site-header--club-portal-auth {
    border-bottom: 1px solid var(--border-soft);
}

.auth-page--club-portal .auth-card {
    margin-top: 0.5rem;
}

.footer-inner--club-portal {
    justify-content: center;
    padding-top: 1.25rem;
    padding-bottom: 1.5rem;
}

.footer-links--club-portal {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 0.75rem 1rem;
}