:root {
  --ink: #111411;
  --muted: #737871;
  --line: #e7e9e5;
  --paper: #f5f6f2;
  --white: #fff;
  --lime: #c9f31d;
  --lime-dark: #a9d000;
  --dark: #0b0d0c;
  --radius: 22px;
  --shadow: 0 12px 40px rgba(22, 27, 17, 0.07);
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { margin: 0; background: var(--paper); color: var(--ink); font-family: "Archivo", sans-serif; }
img, svg { max-width: 100%; }
button, input, select { font: inherit; }
button { cursor: pointer; }
.app-shell { min-height: 100vh; display: grid; grid-template-columns: 246px 1fr; }
.sidebar { position: fixed; inset: 0 auto 0 0; width: 246px; background: var(--dark); color: #fff; padding: 30px 20px 22px; display: flex; flex-direction: column; z-index: 20; }
.brand { color: #fff; text-decoration: none; display: flex; align-items: center; gap: 10px; padding: 0 10px 40px; font: 800 21px "Poppins", sans-serif; letter-spacing: -1px; }
.brand > span:last-child span { color: var(--lime); }
.brand-mark { width: 36px; height: 36px; border-radius: 9px; display: grid; place-items: center; color: var(--dark); background: var(--lime); font: 800 19px "Poppins", sans-serif; }
.nav { display: grid; gap: 7px; }
.nav-item { border: 0; color: #969b96; background: transparent; padding: 13px 15px; border-radius: 11px; text-align: left; display: flex; align-items: center; gap: 13px; font-weight: 600; transition: .2s; }
.nav-item:hover, .nav-item.active { color: #fff; background: #20231f; }
.nav-item.active { box-shadow: inset 3px 0 var(--lime); }
.icon { width: 21px; height: 21px; flex: 0 0 21px; display: grid; place-items: center; color: var(--lime); }
.icon svg { width: 100%; height: 100%; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; transition: transform .2s ease; }
.nav-item:hover .icon svg, .nav-item.active .icon svg { transform: scale(1.06); }
.sidebar-bottom { margin-top: auto; display: grid; gap: 15px; }
.signup-link { color: var(--lime); border: 1px solid #30342f; border-radius: 10px; padding: 10px 12px; text-align: center; text-decoration: none; font-size: 10px; font-weight: 800; }
.signup-link.auth-pending { opacity: .55; pointer-events: none; }
.signup-link.logout-link { color: #ff746c; border-color: rgba(255,116,108,.3); background: rgba(255,116,108,.05); }
.signup-link.logout-link:hover { color: #fff; border-color: #ff746c; background: rgba(255,116,108,.14); }
.watch-card { border: 1px solid #30342f; padding: 13px; border-radius: 14px; display: grid; grid-template-columns: auto 1fr auto; align-items: center; gap: 10px; }
.watch-icon { width: 35px; height: 35px; display: grid; place-items: center; background: #242824; color: var(--lime); border-radius: 10px; }
.watch-card strong, .watch-card span { display: block; font-size: 12px; }
.watch-card span { color: #777d77; margin-top: 2px; }
.status-dot { width: 7px; height: 7px; border-radius: 50%; background: #555; }
.profile-mini { background: transparent; color: white; border: 0; border-top: 1px solid #292c29; padding: 15px 4px 0; display: grid; grid-template-columns: auto 1fr auto; text-align: left; align-items: center; gap: 10px; }
.avatar { width: 38px; height: 38px; display: grid; place-items: center; border-radius: 50%; background: var(--lime); color: var(--dark); font-weight: 800; }
.profile-mini strong, .profile-mini small { display: block; }
.profile-mini small { color: #7e837e; margin-top: 2px; }
.main { grid-column: 2; min-width: 0; padding: 0 4.2vw 60px; }
.topbar { height: 110px; display: flex; justify-content: space-between; align-items: center; }
.eyebrow { color: #8b9089; letter-spacing: 1.6px; font-size: 10px; font-weight: 800; margin: 0 0 6px; }
h1, h2, h3, p { margin-top: 0; }
h1 { font: 700 clamp(20px, 2vw, 28px) "Poppins", sans-serif; margin-bottom: 0; letter-spacing: -1px; }
h2 { font: 800 clamp(30px, 4vw, 54px) "Poppins", sans-serif; letter-spacing: -2.7px; line-height: 1.02; }
h3 { font: 700 20px "Poppins", sans-serif; letter-spacing: -.6px; margin-bottom: 0; }
.top-actions { display: flex; gap: 12px; align-items: center; }
.icon-button { width: 43px; height: 43px; border: 1px solid var(--line); background: #fff; border-radius: 12px; position: relative; }
.icon-button span { position: absolute; width: 6px; height: 6px; background: var(--lime-dark); border-radius: 50%; top: 10px; right: 10px; }
.primary-button, .light-button, .outline-button, .ghost-button { border: 0; padding: 13px 18px; border-radius: 11px; font-weight: 700; transition: .2s; }
.primary-button { background: var(--dark); color: #fff; }
.primary-button:hover { background: #252925; transform: translateY(-1px); }
.primary-button b, .light-button b { margin-left: 13px; }
.page { display: none; animation: fade .25s ease; }
.page.active { display: block; }
@keyframes fade { from { opacity: 0; transform: translateY(4px); } }
.hero-card { min-height: 335px; border-radius: 27px; background: var(--lime); overflow: hidden; position: relative; display: grid; grid-template-columns: 1.1fr 1fr; padding: 42px 48px; }
.hero-content { z-index: 2; }
.pill { display: inline-block; border-radius: 100px; padding: 7px 11px; font-size: 9px; letter-spacing: 1.2px; font-weight: 800; }
.pill.dark { background: rgba(11, 13, 12, .1); }
.hero-card h2 { margin: 18px 0 10px; max-width: 620px; }
.hero-card p { font-size: 14px; color: #46520c; }
.hero-actions { display: flex; gap: 10px; margin-top: 29px; }
.hero-actions > button { min-height: 72px; display: grid; grid-template-columns: 42px minmax(0,1fr) auto; align-items: center; gap: 11px; padding: 13px 14px; text-align: left; border-radius: 16px; overflow: hidden; }
.light-button { background: white; color: var(--ink); box-shadow: 0 12px 25px rgba(64,78,12,.15); }
.light-button:hover { transform: translateY(-2px); box-shadow: 0 16px 30px rgba(64,78,12,.22); }
.ghost-button { background: rgba(255,255,255,.22); color: var(--ink); border: 1px solid rgba(10,12,10,.24); backdrop-filter: blur(8px); }
.hero-card.empty-hero .coach-action { background: var(--dark); color: #fff; border-color: var(--dark); box-shadow: 0 12px 25px rgba(7,10,7,.2); }
.hero-card.empty-hero .coach-action small { color: #c7cdbf; }
.hero-card.empty-hero .coach-action .action-icon { color: var(--dark); background: var(--lime); border-color: var(--lime); }
.hero-card.empty-hero .coach-action .action-arrow { color: var(--dark); background: var(--lime); }
.ghost-button:hover { background: rgba(255,255,255,.24); transform: translateY(-2px); }
.action-icon { width: 38px; height: 38px; display: grid; place-items: center; border-radius: 11px; background: var(--dark); color: var(--lime); }
.action-icon.outline { color: var(--dark); background: rgba(255,255,255,.35); border: 1px solid rgba(10,12,10,.14); }
.action-icon svg { width: 19px; height: 19px; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
.action-icon svg path:first-child:last-child[d$="Z"] { fill: currentColor; stroke: none; }
.action-copy { min-width: 0; }
.action-copy strong, .action-copy small { display: block; }
.action-copy strong { font-size: 13px; line-height: 1.2; }
.action-copy small { margin-top: 4px; color: #6b751f; font-size: 9px; line-height: 1.25; font-weight: 600; white-space: normal; }
.action-arrow { width: 25px; height: 25px; display: grid; place-items: center; border-radius: 50%; background: #eef4d0; font-size: 14px; transition: transform .2s; }
.light-button:hover .action-arrow { transform: translateX(2px); }
.hero-visual { position: absolute; width: 58%; height: 100%; right: 0; top: 0; background:
  radial-gradient(circle at 68% 35%, rgba(255,255,255,.72) 0, rgba(238,255,162,.5) 18%, transparent 45%),
  radial-gradient(circle at 88% 88%, rgba(111,142,0,.28) 0, transparent 42%),
  linear-gradient(135deg, transparent 5%, rgba(255,255,255,.18) 46%, rgba(118,151,0,.25) 100%);
}
.hero-visual::before { content:""; position:absolute; inset:0; background:linear-gradient(90deg, var(--lime) 0%, rgba(201,243,29,.15) 45%, transparent 75%); }
.hero-card.empty-hero .hero-visual { opacity: .25; }
.empty-workouts { grid-column: 1 / -1; padding: 52px 28px; border: 1px solid var(--line); border-radius: 22px; background: #fff; text-align: center; }
.empty-workouts > span { display: inline-grid; place-items: center; width: 48px; height: 48px; border-radius: 15px; background: var(--lime); font-size: 23px; }
.empty-workouts h3 { margin: 16px 0 7px; }
.empty-workouts p { max-width: 520px; margin: 0 auto 22px; color: var(--muted); line-height: 1.55; }
.empty-workouts > div { display: flex; justify-content: center; gap: 10px; }
.empty-workouts.compact { padding: 28px 20px; text-align: left; }
.empty-workouts.compact p { margin: 6px 0 0; }
button:disabled { cursor: not-allowed; opacity: .45; }
.stats-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 18px; margin: 20px 0 38px; }
.stat-card { background: white; border-radius: 17px; padding: 20px 22px; box-shadow: var(--shadow); min-height: 158px; }
.metric-info-card { position:relative; cursor:pointer; transition:transform .18s ease,box-shadow .18s ease; }
.metric-info-card::after { content:"?"; position:absolute; right:14px; bottom:13px; width:20px; height:20px; display:grid; place-items:center; border:1px solid var(--line); border-radius:50%; color:var(--muted); background:rgba(255,255,255,.72); font-size:10px; font-weight:800; }
.metric-info-card:hover { transform:translateY(-2px); box-shadow:0 18px 40px rgba(36,43,23,.12); }
.metric-info-card:focus-visible { outline:3px solid var(--lime); outline-offset:3px; }
.calorie-card.metric-info-card::after { color:var(--lime); border-color:#4a5248; background:#252b24; }
.metric-explanation { display:grid; gap:13px; }
.metric-explanation p { color:var(--muted); line-height:1.6; }
.metric-formula { padding:14px 16px; border-left:4px solid var(--lime); border-radius:10px; background:#f3f5ef; font-weight:800; }
.metric-explanation small { color:var(--muted); line-height:1.5; }
.stat-head { display: flex; align-items: center; justify-content: space-between; font-size: 12px; color: var(--muted); }
.stat-head b { font-size: 10px; color: #6d8f00; background: #eff8ce; padding: 4px 6px; border-radius: 6px; }
.stat-head b.neutral { background: transparent; font-size: 16px; }
.stat-value { font: 800 30px "Poppins", sans-serif; margin: 12px 0 6px; }
.stat-value small { color: #929691; font-size: 13px; }
.stat-card p { color: #a0a49e; font-size: 10px; margin: 8px 0 0; }
.progress-line { height: 5px; background: #eef0ec; border-radius: 10px; overflow: hidden; }
.progress-line i { height: 100%; background: var(--lime); display: block; }
.calorie-card { background:linear-gradient(145deg,#111411,#20251f); color:#fff; }
.calorie-card .stat-head,.calorie-card p { color:#aeb3ad; }
.calorie-card .stat-value small { color:#b7bcb5; }
.calorie-progress { background:#343a33; }
.calorie-progress i { background:var(--lime); }
.week-dots { display: flex; gap: 6px; }
.week-dots span { width: 24px; height: 24px; border-radius: 50%; display: grid; place-items: center; font-size: 8px; color: #a5a9a3; background: #f1f2ef; }
.week-dots .done { background: var(--lime); color: #30370d; }
.spark-bars { height: 27px; display: flex; align-items: end; gap: 5px; }
.spark-bars i { display: block; width: 12%; background: #e8ebe5; border-radius: 3px; }
.spark-bars i.hot { background: var(--lime); }
.content-grid { display: grid; grid-template-columns: 1.6fr .8fr; gap: 35px; }
.section-heading, .page-heading { display: flex; align-items: flex-end; justify-content: space-between; margin-bottom: 18px; }
.page-heading { margin: 15px 0 30px; }
.page-heading h2 { font-size: 38px; margin: 0; }
.text-button { background: none; border: 0; font-size: 11px; font-weight: 700; }
.upcoming-list { display: grid; gap: 9px; }
.upcoming-item { display: grid; grid-template-columns: 48px 1fr auto; align-items: center; gap: 14px; background: #fff; padding: 12px 15px; border-radius: 13px; box-shadow: 0 4px 20px rgba(22,27,17,.04); }
.date-box { border-radius: 9px; background: #f0f2ed; text-align: center; padding: 5px; }
.date-box b, .date-box span { display: block; }
.date-box b { font: 800 17px "Poppins", sans-serif; }
.date-box span { font-size: 8px; color: var(--muted); }
.upcoming-item h4 { font-size: 13px; margin: 0 0 3px; }
.upcoming-item p { font-size: 10px; color: #959a94; margin: 0; }
.upcoming-item button { border: 0; background: transparent; font-size: 17px; }
.coach-card { border-radius: 19px; padding: 25px; color: white; background: var(--dark); min-height: 248px; }
.coach-head { display: flex; gap: 12px; align-items: center; }
.coach-head .eyebrow { color: var(--lime); }
.coach-head h3 { font-size: 17px; }
.ai-mark { width: 40px; height: 40px; display: grid; place-items: center; background: var(--lime); color: var(--dark); border-radius: 12px; font-size: 20px; }
.coach-card > p { color: #9ca09b; line-height: 1.55; font-size: 12px; margin: 20px 0; }
.outline-button { width: 100%; color: inherit; background: transparent; border: 1px solid #424642; display: flex; justify-content: space-between; }
.outline-button:hover { border-color: var(--lime); }
.coach-note { border-top: 1px solid #292c29; margin-top: 16px; padding-top: 13px; color: #747974; font-size: 9px; display: flex; gap: 8px; }
.coach-note span { border: 1px solid #575c57; border-radius: 50%; width: 14px; height: 14px; display: grid; place-items: center; }
.filter-row, .muscle-tabs { display: flex; gap: 8px; flex-wrap: wrap; margin-bottom: 22px; }
.filter { border: 1px solid var(--line); background: #fff; border-radius: 100px; padding: 9px 15px; font-size: 12px; }
.filter.active { background: var(--dark); color: white; }
.workout-grid, .machine-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 18px; }
.workout-card, .machine-card { background: #fff; border-radius: 19px; overflow: hidden; box-shadow: var(--shadow); }
.workout-cover { height: 148px; padding: 18px; position: relative; display: flex; align-items: flex-end; background: linear-gradient(135deg, #171b17, #343c31); color: white; }
.workout-cover.lime { background: linear-gradient(135deg, #c9f31d, #96b90e); color: var(--dark); }
.workout-cover.sand { background: linear-gradient(135deg, #dcd9cd, #b6b2a4); color: var(--dark); }
.workout-cover .pill { position: absolute; top: 14px; left: 14px; background: rgba(255,255,255,.16); }
.workout-cover h3 { position: relative; z-index: 2; font-size: 23px; max-width: 58%; }
.body-map { position: absolute; right: 5px; top: 5px; width: 145px; height: 138px; opacity: .92; }
.body-map svg { width: 100%; height: 100%; overflow: visible; }
.body-map .anatomy-plate { opacity: .62; filter: grayscale(1) contrast(1.12); }
.body-map .muscle { fill: transparent; stroke: transparent; stroke-width: .5; stroke-linecap: round; stroke-linejoin: round; transition: opacity .2s, fill .2s; }
.body-map .muscle.active, .body-map .muscle.group-active { fill: #d9271c; stroke: rgba(115,12,8,.28); stroke-width: .32; opacity: .66; mix-blend-mode: multiply; }
.body-map .muscle.active path, .body-map .muscle.group-active path { filter: var(--muscle-texture); }
.workout-cover.lime .body-map, .workout-cover.sand .body-map { color: var(--dark); }
.workout-body { padding: 17px; }
.workout-meta { display: flex; gap: 13px; color: var(--muted); font-size: 11px; margin-bottom: 16px; }
.workout-card .start-card { border: 0; width: 100%; border-radius: 10px; background: var(--dark); color:#fff; padding: 11px; font-weight: 700; }
.workout-card-actions { display: grid; grid-template-columns: 1fr 1fr; gap: 6px; }
.view-card { border:1px solid #ccd0c9; border-radius:10px; background:#fff; padding:10px; font-size:10px; font-weight:800; }
.view-card:hover { border-color:var(--lime-dark); background:#f6f9ec; }
.manage-card { border: 1px solid var(--line); border-radius: 9px; background: white; padding: 9px; font-size: 10px; font-weight: 700; }
.manage-card.danger { color: #a23636; }
.workout-preview-list { display:grid; gap:10px; }
.workout-preview-item { position:relative; display:grid; grid-template-columns:100px minmax(0,1fr); gap:14px; align-items:center; border:1px solid var(--line); border-radius:15px; background:#f8f9f6; padding:12px 14px 12px 12px; overflow:hidden; }
.workout-preview-item img { width:100px; height:92px; object-fit:contain; mix-blend-mode:multiply; }
.workout-preview-item > div > small { color:#7d827c; font-size:8px; font-weight:800; letter-spacing:1.2px; }
.workout-preview-item h3 { margin:3px 0; font-size:15px; }
.workout-preview-item p { margin:0; color:var(--muted); font-size:10px; }
.preview-order { position:absolute; top:8px; left:8px; z-index:1; border-radius:20px; background:var(--dark); color:#fff; padding:4px 6px; font-size:8px; font-weight:800; }
.preview-prescription { display:flex; flex-wrap:wrap; gap:5px; margin-top:9px; }
.preview-prescription b { border-radius:20px; background:#eaf4c3; color:#4f6300; padding:5px 8px; font-size:9px; }
.workout-preview-item .preview-note { margin-top:7px; line-height:1.4; }
.search { background: white; border: 1px solid var(--line); border-radius: 11px; padding: 10px 14px; display: flex; gap: 8px; align-items: center; width: min(320px, 45vw); }
.search input { border: 0; outline: 0; width: 100%; }
.machine-visual { height: 230px; background: linear-gradient(145deg,#f8f9f6,#e9ece6); position: relative; overflow: hidden; }
.machine-visual img { position: absolute; inset: 16px; display: block; width: calc(100% - 32px); max-width: none; height: calc(100% - 32px); object-fit: contain; object-position: center; }
.machine-detail-visual { margin: 0; border-radius: 18px; overflow: hidden; background: linear-gradient(145deg,#f8f9f6,#e9ece6); }
.machine-detail-visual img { display: block; width: 100%; height: min(46vh,420px); object-fit: contain; padding: 16px; }
.machine-detail-visual figcaption { padding: 9px 14px; background: #151815; color: #fff; font-size: 10px; text-align: center; }
.cardio-map { position:absolute; right:22px; top:22px; width:150px; height:105px; display:flex; align-items:center; justify-content:center; gap:8px; color:#e1261c; }
.cardio-map span { font-size:34px; line-height:1; }
.cardio-map i { width:48px; height:24px; background:linear-gradient(135deg,transparent 42%,currentColor 43% 48%,transparent 49%) 0 3px/16px 16px repeat-x; }
.cardio-map b { position:absolute; bottom:0; color:currentColor; font-size:9px; letter-spacing:2px; }
.machine-sketch { width: 85px; height: 120px; border: 8px solid #242924; border-radius: 8px 30px 8px 8px; position: relative; opacity: .85; }
.machine-sketch::before { content: ""; position: absolute; width: 75px; height: 10px; background: #242924; left: -30px; top: 50px; transform: rotate(-30deg); border-radius: 8px; }
.machine-sketch::after { content: ""; position: absolute; width: 50px; height: 35px; background: var(--lime); left: 5px; bottom: 12px; border-radius: 8px; }
.machine-card-body { padding: 16px; }
.machine-card h3 { font-size: 16px; }
.machine-card p { font-size: 11px; color: var(--muted); margin: 6px 0 14px; }
.machine-actions { display: flex; gap: 7px; }
.machine-actions button { flex: 1; border: 1px solid var(--line); background: white; border-radius: 8px; padding: 8px; font-size: 10px; font-weight: 700; }
.machine-actions button:first-child { background: var(--dark); color: white; }
.calendar-layout { display: grid; grid-template-columns: 1fr 300px; gap: 22px; }
.weekly-planner-card { margin-bottom:22px; border-radius:20px; background:#fff; padding:22px; box-shadow:var(--shadow); }
.weekly-planner-card .section-heading { margin-bottom:16px; }
.weekly-planner-card .section-heading > small { color:var(--muted); font-size:10px; }
.weekly-planner { overflow-x:auto; }
.weekly-grid { min-width:760px; display:grid; grid-template-columns:minmax(170px,1.7fr) repeat(7,minmax(64px,1fr)); border:1px solid var(--line); border-radius:14px; overflow:hidden; }
.weekly-corner,.weekly-day { display:grid; place-items:center; min-height:44px; border-bottom:1px solid var(--line); background:#f2f4ef; font-size:10px; font-weight:800; }
.weekly-corner { justify-content:start; padding-left:15px; }
.weekly-day { border-left:1px solid var(--line); }
.weekly-workout-name { min-height:58px; display:flex; flex-direction:column; justify-content:center; padding:10px 14px; border-bottom:1px solid var(--line); }
.weekly-workout-name b { font-size:11px; }
.weekly-workout-name small { margin-top:3px; color:var(--muted); font-size:8px; text-transform:uppercase; letter-spacing:.8px; }
.weekly-check { min-height:58px; display:grid; place-items:center; border-left:1px solid var(--line); border-bottom:1px solid var(--line); cursor:pointer; }
.weekly-check input { position:absolute; opacity:0; pointer-events:none; }
.weekly-check span { width:24px; height:24px; display:grid; place-items:center; border:1px solid #cfd3cc; border-radius:7px; color:transparent; background:#fff; font-size:12px; font-weight:900; transition:.18s; }
.weekly-check:hover span { border-color:var(--lime-dark); }
.weekly-check input:checked + span { border-color:var(--lime-dark); color:var(--dark); background:var(--lime); box-shadow:0 0 0 3px rgba(201,243,29,.16); }
.calendar-card, .day-plan, .chart-card { background: white; border-radius: 20px; padding: 25px; box-shadow: var(--shadow); }
.calendar-head { display: flex; justify-content: space-between; align-items: center; margin-bottom: 25px; }
.calendar-head button { border: 1px solid var(--line); width: 34px; height: 34px; border-radius: 9px; background: white; }
.calendar-week, .calendar-days { display: grid; grid-template-columns: repeat(7, 1fr); }
.calendar-week span { text-align: center; font-size: 9px; font-weight: 800; color: #999; padding-bottom: 12px; }
.calendar-day { min-height: 75px; border: 1px solid #f0f1ef; background: white; padding: 9px; position: relative; text-align: left; }
.calendar-day.muted { color: #c5c8c3; background: #fafbf9; }
.calendar-day.today b { background: var(--lime); width: 26px; height: 26px; border-radius: 50%; display: grid; place-items: center; }
.calendar-day.selected { outline: 2px solid var(--dark); z-index: 1; }
.calendar-day i { position: absolute; width: 7px; height: 7px; background: var(--lime-dark); border-radius: 50%; bottom: 9px; left: 10px; }
.calendar-day > small { position:absolute; right:5px; bottom:7px; left:22px; overflow:hidden; color:#6d736b; font-size:7px; font-weight:700; text-overflow:ellipsis; white-space:nowrap; }
.calendar-day.missed { background:#fff8f7; }
.calendar-day.missed i { background:#d94a3f; }
.day-plan h3 { margin-bottom: 22px; }
.plan-item { border-left: 3px solid var(--lime); padding: 11px 12px; background: #f7f8f5; border-radius: 0 10px 10px 0; }
.plan-item strong, .plan-item span { display: block; }
.plan-item span { font-size: 10px; color: var(--muted); margin-top: 4px; }
.plan-item div { display: flex; gap: 6px; margin-top: 12px; }
.plan-item button { border: 1px solid var(--line); background: white; border-radius: 7px; padding: 7px 9px; font-size: 9px; font-weight: 800; }
.empty-plan { color: var(--muted); font-size: 13px; line-height: 1.5; }
.progress-cards { display: grid; grid-template-columns: repeat(3, 1fr); gap: 17px; margin-bottom: 22px; }
.measurements-card { background: white; border-radius: 20px; padding: 22px; box-shadow: var(--shadow); margin-bottom: 22px; }
.measurement-item { display: grid; grid-template-columns: 1.2fr 1fr 1fr auto; gap: 12px; align-items: center; border-bottom: 1px solid var(--line); padding: 10px 0; }
.measurement-item:last-child { border-bottom: 0; }
.measurement-item strong, .measurement-item small, .measurement-item b { display: block; }
.measurement-item small { color: var(--muted); font-size: 10px; margin-top: 2px; }
.measurement-item button { border: 0; background: #f2f3f0; border-radius: 50%; width: 27px; height: 27px; }
.metric-card { background: #fff; border-radius: 18px; padding: 22px; }
.metric-card.lime { background: var(--lime); }
.metric-card span, .metric-card strong, .metric-card p { display: block; }
.metric-card span { font-size: 11px; color: var(--muted); }
.metric-card strong { font: 800 32px "Poppins", sans-serif; margin: 10px 0; }
.metric-card small { font-size: 12px; }
.metric-card p { margin: 0; font-size: 10px; color: #727771; }
.chart-card { min-height: 370px; }
.history-card { background: white; border-radius: 20px; padding: 25px; box-shadow: var(--shadow); margin-top: 22px; }
.history-item { width: 100%; display: grid; grid-template-columns: 48px 1fr auto; align-items: center; gap: 12px; border: 0; border-bottom: 1px solid var(--line); background: white; padding: 11px 4px; text-align: left; }
.history-item:last-child { border-bottom: 0; }
.history-item > span:nth-child(2) strong, .history-item > span:nth-child(2) small { display: block; }
.history-item small { color: var(--muted); margin-top: 3px; }
.history-date { text-align: center; text-transform: uppercase; font-size: 9px; color: var(--muted); }
.history-date b { display: block; color: var(--dark); font-size: 17px; }
.session-exercise { border-bottom: 1px solid var(--line); padding: 12px 0; }
.session-exercise strong, .session-exercise span { display: block; }
.session-exercise span { color: var(--muted); font-size: 11px; margin-top: 5px; }
.chart-card select { border: 1px solid var(--line); background: white; padding: 9px; border-radius: 8px; }
.chart { display: grid; grid-template-columns: 50px 1fr; height: 245px; margin-top: 30px; }
.y-labels { display: flex; flex-direction: column; justify-content: space-between; font-size: 9px; color: #999; padding-bottom: 17px; }
.chart-area { position: relative; }
.grid-lines { position: absolute; inset: 0 0 18px; display: flex; flex-direction: column; justify-content: space-between; }
.grid-lines i { display: block; border-top: 1px dashed #eceeeb; }
.chart svg { width: 100%; height: calc(100% - 20px); position: relative; overflow: visible; }
.x-labels { display: flex; justify-content: space-between; color: #999; font-size: 9px; }
.mobile-menu { display: none; }
.modal-backdrop { position: fixed; inset: 0; background: rgba(7,9,7,.66); backdrop-filter: blur(5px); z-index: 50; display: none; place-items: center; padding: 20px; }
.modal-backdrop.open { display: grid; }
.modal { width: min(620px, 100%); max-height: 88vh; overflow: auto; background: white; border-radius: 24px; padding: 28px; box-shadow: 0 30px 80px rgba(0,0,0,.25); }
.modal-head { display: flex; justify-content: space-between; align-items: start; margin-bottom: 23px; }
.modal-head h2 { font-size: 28px; margin-bottom: 4px; }
.workout-live-metrics { width:max-content; margin-top:12px; display:flex; align-items:stretch; gap:7px; }
.workout-elapsed,.workout-calories { display:flex; align-items:center; gap:10px; padding:8px 11px; border-radius:12px; background:var(--dark); color:#fff; }
.workout-elapsed span { color:#aeb3ad; font-size:8px; font-weight:700; text-transform:uppercase; letter-spacing:.08em; }
.workout-elapsed strong { color:var(--lime); font:800 17px "Poppins",sans-serif; font-variant-numeric:tabular-nums; letter-spacing:.03em; }
.workout-calories { display:grid; gap:0; min-width:78px; }
.workout-calories span { color:#aeb3ad; font-size:7px; font-weight:700; text-transform:uppercase; letter-spacing:.06em; }
.workout-calories strong { color:#fff; font:800 14px "Poppins",sans-serif; font-variant-numeric:tabular-nums; }
.close-modal { border: 0; background: #f0f1ee; width: 36px; height: 36px; border-radius: 50%; }
.form-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }
.field { display: grid; gap: 6px; }
.field.full { grid-column: 1 / -1; }
.field label { font-size: 11px; font-weight: 700; }
.field input, .field select { border: 1px solid var(--line); border-radius: 10px; padding: 12px; outline: none; background: #fff; }
.field input:focus, .field select:focus { border-color: var(--lime-dark); box-shadow: 0 0 0 3px #eff9c9; }
.field-help { color: var(--muted); font-size: 10px; line-height: 1.4; }
.choice-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 8px; }
.choice { border: 1px solid var(--line); background: white; border-radius: 10px; padding: 12px; text-align: left; }
.choice.selected { border-color: var(--dark); background: #f3f5ef; box-shadow: inset 3px 0 var(--lime); }
.machine-choice-grid { max-height: 360px; overflow: auto; display: grid; gap: 18px; padding-right: 4px; }
.field-hint { color: var(--muted); font-size: 11px; line-height: 1.4; margin: 0 0 4px; }
.machine-choice-section { display: grid; gap: 8px; }
.machine-choice-section h4 { position: sticky; top: 0; z-index: 2; margin: 0; padding: 7px 9px; border-radius: 8px; background: #eef0eb; font-size: 11px; letter-spacing: .08em; text-transform: uppercase; }
.machine-choice-section .choice-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.machine-choice-grid .choice { display: grid; gap: 10px; }
.machine-choice-grid .choice input { width: auto; accent-color: var(--lime); }
.workout-machine-option > label { display: grid; grid-template-columns: auto 44px 1fr; align-items: center; gap: 8px; cursor: pointer; }
.workout-machine-option > label img { width: 44px; height: 44px; object-fit: contain; border-radius: 8px; background: #eef0eb; }
.machine-prescription { display: grid; grid-template-columns: .75fr 1.25fr 1fr; gap: 6px; padding-top: 9px; border-top: 1px solid var(--line); }
.machine-prescription label { display: grid; gap: 3px; color: var(--muted); font-size: 8px; position: relative; }
.machine-prescription input { width: 100% !important; min-width: 0; padding: 7px !important; font-size: 11px; }
.machine-prescription label:last-child small { position: absolute; right: 5px; bottom: 9px; font-size: 7px; }
.remove-workout-machine { width:100%; border:1px solid #efcaca; border-radius:8px; background:#fff7f7; color:#a52323; padding:8px 10px; font-size:9px; font-weight:800; cursor:pointer; }
.remove-workout-machine:hover { border-color:#d94a4a; background:#fff0f0; }
.profile-goal-grid .choice { display: flex; align-items: center; gap: 9px; cursor: pointer; }
.profile-goal-grid .choice input { width: auto; margin: 0; accent-color: var(--lime); }
.profile-goal-grid .choice span { line-height: 1.25; }
.machine-choice-grid .choice small { display: block; color: var(--muted); margin-top: 2px; }
.modal-footer { display: flex; justify-content: flex-end; gap: 8px; margin-top: 22px; }
.secondary-button { border: 1px solid var(--line); background: white; border-radius: 10px; padding: 12px 16px; font-weight: 700; }
.exercise-row { border: 1px solid var(--line); border-radius: 12px; padding: 12px; margin-bottom: 8px; display: grid; grid-template-columns: 1fr 75px 75px; gap: 8px; align-items: center; }
.exercise-row input { width: 100%; border: 1px solid var(--line); border-radius: 7px; padding: 8px; }
.exercise-row small { color: var(--muted); }
.exercise-block { border: 1px solid var(--line); border-radius: 14px; padding: 12px; margin: 0 0 12px; }
.exercise-block legend { font-weight: 800; padding: 0 6px; }
.exercise-block legend small { color: var(--muted); font-weight: 500; margin-left: 5px; }
.exercise-machine-photo { width:100%; min-height:112px; margin:4px 0 10px; border:1px solid var(--line); border-radius:13px; background:linear-gradient(145deg,#f8f9f6,#edf0e9); display:grid; grid-template-columns:108px 1fr auto; align-items:center; gap:12px; padding:8px 12px 8px 8px; text-align:left; cursor:zoom-in; }
.exercise-machine-photo img { width:108px; height:94px; object-fit:contain; mix-blend-mode:multiply; }
.exercise-machine-photo span b,.exercise-machine-photo span small { display:block; }
.exercise-machine-photo span b { font-size:11px; }
.exercise-machine-photo span small { margin-top:4px; color:var(--muted); font-size:9px; }
.exercise-machine-photo > i { width:30px; height:30px; display:grid; place-items:center; border-radius:50%; background:#fff; font-style:normal; font-size:13px; }
.exercise-swap-button { display:flex; align-items:center; justify-content:center; gap:7px; width:100%; margin:-3px 0 10px; border:1px solid var(--line); border-radius:9px; background:#fff; padding:8px 12px; color:#3f453f; font-size:10px; font-weight:800; }
.exercise-swap-button:hover { border-color:var(--lime-dark); background:#f5f9e7; }
.exercise-swap-button span { color:#7f9e00; font-size:15px; line-height:1; }
.swap-machine-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:10px; max-height:min(55vh,520px); overflow:auto; padding:2px; }
.swap-machine-option { min-width:0; border:1px solid var(--line); border-radius:14px; background:#f7f8f4; padding:10px; display:grid; grid-template-columns:80px 1fr auto; align-items:center; gap:10px; text-align:left; }
.swap-machine-option:hover { border-color:var(--lime-dark); box-shadow:inset 3px 0 var(--lime); }
.swap-machine-option img { width:80px; height:72px; object-fit:contain; mix-blend-mode:multiply; }
.swap-machine-option b,.swap-machine-option small { display:block; }
.swap-machine-option b { font-size:11px; }
.swap-machine-option small { margin-top:4px; color:var(--muted); font-size:9px; line-height:1.35; }
.swap-machine-option i { color:#7f9e00; font-style:normal; font-weight:800; }
.machine-zoom-overlay { position:fixed; inset:0; z-index:120; border:0; background:rgba(7,9,7,.92); backdrop-filter:blur(12px); display:none; place-items:center; padding:max(24px,env(safe-area-inset-top)) 18px max(24px,env(safe-area-inset-bottom)); cursor:zoom-out; }
.machine-zoom-overlay.open { display:grid; }
.machine-zoom-overlay img { width:min(92vw,720px); height:min(76vh,720px); object-fit:contain; border-radius:22px; background:#f4f5f1; padding:14px; box-shadow:0 25px 80px rgba(0,0,0,.45); }
.machine-zoom-overlay span { position:absolute; bottom:max(25px,env(safe-area-inset-bottom)); color:#fff; font-size:11px; font-weight:700; letter-spacing:.3px; }
body.image-zoom-open { overflow:hidden; }
.set-row { display: grid; grid-template-columns: 58px 75px 75px 1fr; gap: 8px; align-items: center; padding: 7px 0; border-bottom: 1px solid #f0f1ee; }
.cardio-rest-hidden { display:none; }
.set-row.cardio-row { grid-template-columns:58px minmax(110px,180px) 1fr; }
.cardio-row label { grid-column:auto; }
.cardio-summary { background:#edf4da; }
.set-row:last-child { border-bottom: 0; }
.set-row b { font-size: 10px; }
.set-row input[type="number"] { width: 100%; border: 1px solid var(--line); border-radius: 8px; padding: 8px; }
.set-row input.field-error { border-color: #d33b3b; background: #fff4f4; box-shadow: 0 0 0 3px rgba(211,59,59,.12); animation: field-shake .25s ease; }
@keyframes field-shake { 25% { transform: translateX(-3px); } 75% { transform: translateX(3px); } }
.set-row label { font-size: 10px; color: var(--muted); }
.set-row label input { accent-color: var(--lime-dark); }
.rest-timer { position: sticky; top: -28px; z-index: 2; display: grid; grid-template-columns: auto 1fr auto; align-items: center; gap: 13px; background: linear-gradient(145deg,#111411,#050605); color: white; margin: -5px 0 16px; padding: 12px 13px; border: 1px solid #252a24; border-radius: 16px; box-shadow: 0 12px 30px rgba(0,0,0,.18); }
.rest-heading span, .rest-heading strong { display: block; }
.rest-heading span { color: #a7ada7; font-size: 9px; }
.rest-heading strong { margin-top: 2px; font: 800 19px "Poppins", sans-serif; }
.rest-timer button { border: 0; border-radius: 8px; background: var(--lime); padding: 8px 10px; font-size: 10px; font-weight: 800; }
.rest-timer.active { box-shadow: 0 0 0 3px #e4f69c; }
.rest-duration { display: flex; justify-content: center; gap: 6px; }
.rest-duration .duration-option { position: relative; width: 43px; height: 43px; padding: 0; display: grid; place-content: center; border-radius: 50%; color: #b4bab3; background: linear-gradient(145deg,#252a25,#171a17); border: 1px solid #343a34; box-shadow: inset 0 1px rgba(255,255,255,.06), 0 4px 10px rgba(0,0,0,.18); transition: .2s ease; }
.rest-duration .duration-option b, .rest-duration .duration-option small { display: block; line-height: 1; }
.rest-duration .duration-option b { font-size: 11px; }
.rest-duration .duration-option small { margin-top: 2px; font-size: 6px; text-transform: uppercase; }
.rest-duration .duration-option.selected { color: #111411; background: var(--lime); border-color: #e5ff72; box-shadow: 0 0 0 3px rgba(201,243,29,.18), inset 0 1px rgba(255,255,255,.5); transform: scale(1.06); }
.rest-duration .duration-option:disabled:not(.selected) { opacity: .4; }
.rest-duration .custom-duration { border-style: dashed; }
.custom-time-picker { display: grid; grid-template-columns: 1fr auto 1fr; gap: 13px; align-items: end; margin: 20px 0 8px; }
.custom-time-picker label { display: grid; gap: 7px; text-align: center; }
.custom-time-picker label span { color: var(--muted); font-size: 10px; font-weight: 800; }
.custom-time-picker input { width: 100%; border: 1px solid var(--line); border-radius: 16px; padding: 16px 8px; text-align: center; font: 800 28px "Poppins", sans-serif; outline: none; }
.custom-time-picker > b { padding-bottom: 16px; font-size: 25px; }
.time-hint { color: var(--muted); text-align: center; font-size: 10px; }
.resume-workout { position: fixed; right: 24px; bottom: 24px; z-index: 14; width: max-content; max-width: min(210px,calc(100vw - 24px)); border: 0; border-radius: 100px; background: var(--lime); color: var(--dark); padding: 11px 16px; font-size: 12px; font-weight: 800; box-shadow: 0 10px 26px rgba(42,50,15,.22); }
.learn-movement { display: block; border: 0; background: none; color: #536600; font-size: 10px; font-weight: 800; padding: 7px 0 0; }
.movement-demo { position: relative; }
.movement-frame { aspect-ratio: 16 / 9; border-radius: 16px; background-image: var(--movement-image); background-size: 200% 100%; background-position: left center; animation: movement-positions 3.2s steps(1, end) infinite; box-shadow: inset 0 0 0 1px rgba(255,255,255,.08); }
.movement-demo.paused .movement-frame { animation-play-state: paused; }
.movement-caption { display: flex; justify-content: space-between; align-items: center; gap: 8px; color: var(--muted); font-size: 10px; margin-top: 8px; }
.movement-caption strong { color: var(--dark); font-size: 11px; }
.movement-caption span { display: flex; align-items: center; gap: 5px; }
.movement-caption i { width: 7px; height: 7px; border-radius: 50%; background: var(--lime); }
.movement-reference { color: var(--muted); font-size: 9px; line-height: 1.4; margin-top: 7px; }
.official-reference { border: 1px solid var(--line); border-left: 4px solid var(--lime); border-radius: 14px; padding: 18px; background: #f7f8f4; }
.official-reference strong { display: block; margin-bottom: 6px; }
.official-reference p { color: var(--muted); font-size: 12px; line-height: 1.5; margin-bottom: 10px; }
.official-reference a { color: var(--dark); font-size: 11px; font-weight: 800; text-decoration: none; }
.movement-toggle { position: absolute; right: 10px; top: 10px; border: 1px solid rgba(255,255,255,.3); border-radius: 20px; background: rgba(7,9,7,.78); color: white; padding: 7px 10px; font-size: 10px; font-weight: 700; backdrop-filter: blur(5px); }
.movement-steps { margin: 15px 0 0; padding-left: 22px; color: var(--muted); font-size: 12px; line-height: 1.55; }
.movement-steps li { padding: 3px 0 3px 4px; }
@keyframes movement-positions {
  0%, 45% { background-position: left center; }
  50%, 95% { background-position: right center; }
  100% { background-position: left center; }
}
.bmi-result { background: #f2f8dc; padding: 13px; border-radius: 10px; font-size: 12px; margin-top: 15px; }
.ai-chat-head { margin-bottom: 14px; }
.ai-chat { height: min(420px,45vh); overflow-y: auto; display: grid; align-content: start; gap: 10px; padding: 14px; border-radius: 15px; background: #f1f3ef; }
.ai-message { max-width: 84%; padding: 11px 13px; border-radius: 15px 15px 15px 4px; background: white; font-size: 12px; line-height: 1.5; white-space: pre-wrap; }
.ai-message.user { justify-self: end; border-radius: 15px 15px 4px 15px; color: white; background: var(--dark); }
.ai-assessment-progress { display:grid; gap:8px; margin:4px 0 14px; padding:12px 14px; border:1px solid var(--line); border-radius:14px; background:#f7f8f5; }
.ai-assessment-progress span { display:flex; align-items:center; justify-content:space-between; gap:12px; }
.ai-assessment-progress b { font-size:11px; }
.ai-assessment-progress small { color:var(--muted); font-size:9px; }
.ai-assessment-progress > i { height:5px; overflow:hidden; border-radius:10px; background:#e5e8e1; }
.ai-assessment-progress > i b { display:block; height:100%; border-radius:inherit; background:var(--lime-dark); transition:width .35s ease; }
.ai-question-card { margin:0 0 12px; padding:15px; border:1px solid #dce2d4; border-radius:17px; background:linear-gradient(145deg,#fbfcf8,#f1f5e8); }
.ai-question-card h3 { margin:5px 0 4px; font-size:15px; line-height:1.35; }
.ai-question-card p { margin:0 0 10px; color:var(--muted); font-size:10px; }
.ai-choice-list { display:flex; flex-wrap:wrap; gap:7px; margin-top:11px; }
.ai-choice-list button { border:1px solid #d7dcd2; border-radius:100px; background:white; padding:9px 12px; color:var(--ink); font-size:10px; font-weight:700; transition:.18s ease; }
.ai-choice-list button:hover, .ai-choice-list button.selected { border-color:var(--lime-dark); background:var(--lime); box-shadow:0 4px 14px rgba(129,158,12,.14); }
.ai-confirm-choices { width:100%; margin-top:11px; border:0; border-radius:10px; padding:10px; color:white; background:var(--dark); font-size:10px; font-weight:800; }
.ai-confirm-choices:disabled { opacity:.35; cursor:not-allowed; }
.ai-composer { display: grid; grid-template-columns: 1fr auto; gap: 8px; margin-top: 10px; }
.ai-composer textarea { resize: none; border: 1px solid var(--line); border-radius: 12px; padding: 11px; outline: none; font: inherit; }
.ai-composer button { border: 0; border-radius: 11px; padding: 0 15px; color: var(--dark); background: var(--lime); font-weight: 800; }
.ai-disclaimer { margin-top: 9px; color: var(--muted); font-size: 9px; }
.create-ai-workout.ready { animation: create-workout-pulse 1.15s ease-in-out infinite; box-shadow: 0 0 0 0 rgba(201,243,29,.45); }
.ai-preparing { min-height: 520px; display: flex; flex-direction: column; align-items: center; justify-content: center; text-align: center; }
.ai-preparing h2 { font-size: 30px; margin-bottom: 28px; }
.ai-orbit { width: 70px; height: 70px; display: grid; place-items: center; margin-bottom: 17px; border-radius: 22px; color: var(--dark); background: var(--lime); font-size: 31px; animation: ai-pulse 1.25s ease-in-out infinite; }
.preparing-steps { width: min(390px,100%); display: grid; gap: 10px; text-align: left; }
.preparing-steps div { display: flex; gap: 10px; align-items: center; color: #a1a69f; transition: .3s; }
.preparing-steps i { width: 21px; height: 21px; border: 2px solid #d9ddd7; border-radius: 50%; }
.preparing-steps .active { color: var(--dark); }
.preparing-steps .active i { border-color: var(--lime-dark); border-top-color: transparent; animation: ai-spin .7s linear infinite; }
.preparing-steps .done i { border: 0; background: var(--lime); animation: none; }
.preparing-steps .done i::after { content:"✓"; display:grid; place-items:center; height:100%; color:var(--dark); font-size:11px; font-style:normal; font-weight:900; }
.preparing-progress { width: min(390px,100%); height: 5px; margin-top: 25px; overflow: hidden; border-radius: 5px; background: #e8ebe6; }
.preparing-progress i { display: block; width: 0; height: 100%; background: var(--lime-dark); transition: width .5s; }
.exercise-prescription { display: flex; flex-wrap: wrap; gap: 6px; margin: 2px 0 8px; padding: 9px; border-radius: 9px; background: #f2f6e2; }
.exercise-prescription span { border-radius: 20px; background: white; padding: 5px 8px; color: #536400; font-size: 9px; font-weight: 800; }
.exercise-prescription p { width: 100%; margin: 3px 0 0; color: var(--muted); font-size: 10px; line-height: 1.4; }
@keyframes ai-spin { to { transform: rotate(360deg); } }
@keyframes ai-pulse { 50% { transform: scale(1.08) rotate(5deg); box-shadow: 0 0 0 15px rgba(201,243,29,.15); } }
@keyframes create-workout-pulse {
  0%, 100% { color: white; background: var(--dark); box-shadow: 0 0 0 0 rgba(201,243,29,.1); transform: scale(1); }
  50% { color: var(--dark); background: var(--lime); box-shadow: 0 0 0 7px rgba(201,243,29,.2); transform: scale(1.025); }
}
@media (prefers-reduced-motion: reduce) {
  .create-ai-workout.ready { animation: none; color: var(--dark); background: var(--lime); }
}
.modal-footer button:disabled { opacity: .4; cursor: not-allowed; }
.toast { position: fixed; left: 50%; bottom: 28px; transform: translate(-50%, 20px); background: var(--dark); color: white; border-left: 4px solid var(--lime); padding: 12px 18px; border-radius: 10px; z-index: 80; opacity: 0; pointer-events: none; transition: .25s; }
.toast.show { opacity: 1; transform: translate(-50%, 0); }

@media (max-width: 980px) {
  body { overflow-x: hidden; }
  body.menu-open { overflow: hidden; }
  body.menu-open::after { content:""; position:fixed; inset:0; z-index:15; background:rgba(0,0,0,.42); backdrop-filter:blur(2px); }
  .app-shell { grid-template-columns: 1fr; }
  .sidebar { width: min(310px, 86vw); transform: translateX(-105%); transition: transform .25s; box-shadow: 20px 0 55px rgba(0,0,0,.24); }
  .sidebar.open { transform: translateX(0); }
  .main { grid-column: 1; padding-inline: 25px; }
  .mobile-menu { display: grid; place-items: center; border: 0; background: white; width: 42px; height: 42px; border-radius: 10px; margin-right: 15px; }
  .topbar > div:first-of-type { margin-right: auto; }
  .stats-grid, .workout-grid, .machine-grid { grid-template-columns: repeat(2, 1fr); }
  .content-grid { grid-template-columns: 1fr; }
  .calendar-layout { grid-template-columns: minmax(0,1fr); }
  .progress-cards { grid-template-columns: repeat(2,1fr); }
  .nav-item { min-height: 47px; }
}
@media (max-width: 680px) {
  button, a, input, select { -webkit-tap-highlight-color: transparent; }
  input, select { font-size: 16px; }
  .main { padding: 0 14px calc(90px + env(safe-area-inset-bottom)); }
  .topbar { height: auto; min-height: 82px; gap: 9px; padding: 14px 0; }
  .topbar > div:first-of-type { min-width: 0; }
  .topbar .eyebrow { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; max-width: 68vw; }
  .topbar h1 { font-size: 16px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; max-width: 68vw; }
  .mobile-menu { flex: 0 0 42px; margin-right: 4px; }
  .top-actions { gap: 7px; }
  .top-actions .icon-button { display: none; }
  .top-actions .primary-button { display: none; }
  .hero-card { grid-template-columns: 1fr; padding: 25px 21px; min-height: 350px; border-radius: 21px; }
  .hero-card h2 { font-size: clamp(31px,10vw,39px); letter-spacing: -2px; }
  .hero-card p { max-width: 82%; line-height: 1.45; }
  .hero-visual { width: 100%; height: 52%; top: auto; bottom: 0; opacity: .55; }
  .hero-content { display: flex; flex-direction: column; align-items: flex-start; }
  .hero-actions { width: 100%; margin-top: 14px; }
  .hero-actions button { flex: 1; min-width: 0; }
  .hero-actions > button { min-height: 104px; grid-template-columns: 1fr auto; grid-template-rows: auto 1fr; align-items: start; gap: 10px; padding: 14px; }
  .hero-actions .action-icon { grid-column: 1; grid-row: 1; }
  .hero-actions .action-arrow { grid-column: 2; grid-row: 1; }
  .hero-actions .action-copy { grid-column: 1 / -1; grid-row: 2; align-self: end; }
  .action-copy strong { font-size: 13px; }
  .action-copy small { font-size: 9px; overflow: visible; white-space: normal; }
  .stats-grid, .workout-grid, .machine-grid, .progress-cards { grid-template-columns: 1fr; }
  .stats-grid { gap: 11px; margin-bottom: 28px; }
  .stat-card { min-height: 145px; }
  .content-grid { gap: 24px; }
  .section-heading, .page-heading { align-items: flex-start; gap: 13px; flex-wrap: wrap; }
  .page-heading { margin: 8px 0 22px; }
  .page-heading h2 { font-size: 30px; }
  .page-heading > button { min-height: 43px; }
  .search { width: 100%; }
  .filter-row, .muscle-tabs { flex-wrap: nowrap; overflow-x: auto; margin-inline: -14px; padding: 0 14px 8px; scrollbar-width: none; }
  .filter-row::-webkit-scrollbar, .muscle-tabs::-webkit-scrollbar { display: none; }
  .filter { flex: 0 0 auto; min-height: 40px; }
  .workout-meta { flex-wrap: wrap; }
  .workout-card-actions { grid-template-columns: 1fr 1fr; }
  .workout-card-actions .start-card,.workout-card-actions .view-card { min-height: 43px; }
  .workout-preview-item { grid-template-columns:82px minmax(0,1fr); padding:10px; gap:10px; }
  .workout-preview-item img { width:82px; height:78px; }
  .machine-actions button { min-height: 42px; }
  .swap-machine-grid { grid-template-columns:1fr; }
  .machine-visual { height: 245px; }
  .calendar-card { padding: 12px 8px; overflow: hidden; }
  .weekly-planner-card { margin-inline:-2px; padding:16px 12px; border-radius:16px; }
  .weekly-grid { min-width:700px; }
  .calendar-head { margin: 3px 5px 17px; }
  .calendar-week span { font-size: 7px; }
  .calendar-day { min-width: 0; min-height: 50px; padding: 5px 3px; font-size: 10px; }
  .calendar-day.today b { width: 23px; height: 23px; }
  .day-plan, .chart-card, .history-card, .measurements-card { padding: 18px 15px; border-radius: 16px; }
  .measurement-item { grid-template-columns: 1fr auto; gap: 7px; }
  .measurement-item > span:nth-child(3) { grid-column: 1 / -1; }
  .chart { grid-template-columns: 39px minmax(0,1fr); height: 205px; margin-top: 20px; }
  .chart-card .section-heading select { width: 100%; }
  .history-item { grid-template-columns: 42px minmax(0,1fr) auto; }
  .form-grid { grid-template-columns: 1fr; }
  .field.full { grid-column: auto; }
  .choice-grid { grid-template-columns: 1fr; }
  .exercise-row { grid-template-columns: 1fr 65px 65px; }
  .modal-backdrop { align-items: end; padding: 0; }
  .modal { width: 100%; max-height: 94dvh; border-radius: 22px 22px 0 0; padding: 22px 16px calc(22px + env(safe-area-inset-bottom)); }
  .modal-head { gap: 12px; margin-bottom: 18px; }
  .modal-head > div { min-width: 0; }
  .modal-head h2 { font-size: 25px; overflow-wrap: anywhere; }
  .workout-live-metrics { margin-top:10px; }
  .workout-elapsed,.workout-calories { padding:7px 10px; }
  .workout-elapsed strong { font-size:15px; }
  .modal-footer { position: sticky; bottom: calc(-22px - env(safe-area-inset-bottom)); z-index: 3; margin-inline: -16px; padding: 13px 16px calc(13px + env(safe-area-inset-bottom)); background: rgba(255,255,255,.96); border-top: 1px solid var(--line); }
  .modal-footer button { flex: 1; min-height: 44px; padding-inline: 8px; }
  .machine-choice-grid { grid-template-columns: 1fr; max-height: 38vh; }
  .machine-choice-section .choice-grid { grid-template-columns: 1fr; }
  .rest-timer { top: -22px; grid-template-columns: 1fr auto; gap: 9px; margin-inline: -2px; padding: 11px; }
  .rest-heading { display: flex; align-items: center; justify-content: space-between; }
  .rest-heading strong { margin: 0; }
  .rest-duration { grid-column: 1 / -1; grid-row: 2; justify-content: space-between; }
  .rest-duration .duration-option { width: 48px; height: 48px; }
  .rest-duration .custom-duration { width: 55px; }
  .rest-timer > #startRest { grid-column: 2; grid-row: 1; min-width: 72px; min-height: 40px; border-radius: 11px; }
  .set-row { grid-template-columns: 48px 1fr 1fr; }
  .set-row label { grid-column: 2 / -1; }
  .set-row.cardio-row { grid-template-columns:48px 1fr; }
  .set-row.cardio-row label { grid-column:2; }
  .resume-workout { right: 12px; left: auto; bottom: calc(10px + env(safe-area-inset-bottom)); width: max-content; max-width: 180px; min-height: 42px; padding: 9px 14px; }
  .toast { width: calc(100% - 28px); bottom: calc(74px + env(safe-area-inset-bottom)); text-align: center; }
  .iphone-16-pro-max-preview .topbar { min-height: 126px; padding-top: 56px; }
  .iphone-16-pro-max-preview .sidebar { padding-top: 62px; }
}
@media (max-width: 380px) {
  .main { padding-inline: 10px; }
  .hero-card { padding-inline: 17px; }
  .hero-actions { flex-direction: column; }
  .hero-actions > button { width: 100%; }
  .page-heading h2 { font-size: 27px; }
  .calendar-day { min-height: 45px; font-size: 9px; }
  .modal-footer { flex-direction: column-reverse; }
}