:root {
  color-scheme: light;
  --bg: #f5f5f2;
  --surface: #ffffff;
  --ink: #171717;
  --muted: #6f6f68;
  --line: #deded8;
  --gold: #b89a55;
  --gold-soft: #efe6d0;
  --titanium: #606a70;
  --success: #236b4b;
  --warn: #9f5b25;
  --shadow: 0 20px 60px rgba(18, 18, 18, 0.08);
}

* {
  box-sizing: border-box;
}

body {
  margin: 0;
  min-height: 100vh;
  background: var(--bg);
  color: var(--ink);
  font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}

button,
input,
select,
textarea {
  font: inherit;
}

button {
  cursor: pointer;
}

.app-shell {
  display: grid;
  grid-template-columns: 280px minmax(0, 1fr);
  min-height: 100vh;
}

.sidebar {
  position: sticky;
  top: 0;
  display: flex;
  flex-direction: column;
  gap: 18px;
  height: 100vh;
  padding: 28px 20px;
  background: #121211;
  color: #f7f5ef;
  min-height: 0;
}

.brand {
  display: flex;
  align-items: center;
  gap: 12px;
  flex-shrink: 0;
}

.brand-mark {
  display: grid;
  place-items: center;
  width: 44px;
  height: 44px;
  border: 1px solid rgba(184, 154, 85, 0.6);
  background: #201f1c;
  color: var(--gold);
  font-weight: 800;
  letter-spacing: 0;
}

.brand strong,
.brand span,
.coach-card span,
.coach-card small {
  display: block;
}

.brand strong {
  font-size: 16px;
}

.brand span,
.coach-card span,
.coach-card small {
  color: rgba(247, 245, 239, 0.62);
  font-size: 13px;
}

.nav {
  display: grid;
  gap: 8px;
  flex: 1 1 auto;
  min-height: 0;
  overflow-y: auto;
  padding-right: 4px;
  overscroll-behavior: contain;
  scrollbar-width: thin;
  scrollbar-color: rgba(184, 154, 85, 0.7) rgba(255, 255, 255, 0.08);
}

.nav::-webkit-scrollbar {
  width: 6px;
}

.nav::-webkit-scrollbar-track {
  background: rgba(255, 255, 255, 0.08);
}

.nav::-webkit-scrollbar-thumb {
  background: rgba(184, 154, 85, 0.7);
}

.nav-button {
  display: grid;
  grid-template-columns: 34px 1fr;
  align-items: center;
  min-height: 42px;
  border: 1px solid transparent;
  background: transparent;
  color: rgba(247, 245, 239, 0.78);
  text-align: left;
}

.nav-link-button {
  text-decoration: none;
}

.nav-button.active,
.nav-button:hover {
  border-color: rgba(184, 154, 85, 0.38);
  background: rgba(255, 255, 255, 0.07);
  color: #fff;
}

.icon {
  display: grid;
  place-items: center;
  color: var(--gold);
  font-weight: 700;
}

.coach-card {
  margin-top: auto;
  padding: 18px;
  border: 1px solid rgba(255, 255, 255, 0.1);
  background: rgba(255, 255, 255, 0.06);
  flex-shrink: 0;
}

.coach-card strong {
  display: block;
  margin: 7px 0 16px;
  font-size: 28px;
}

.main {
  min-width: 0;
  padding: 24px;
}

.topbar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  margin-bottom: 20px;
}

.topbar-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  justify-content: flex-end;
}

.session-pill {
  display: inline-flex;
  min-height: 42px;
  align-items: center;
  padding: 0 12px;
  border: 1px solid var(--line);
  background: #f8f7f2;
  color: var(--muted);
  font-size: 13px;
  font-weight: 900;
}

.logout-button {
  display: none;
}

.coach-panel-link,
.admin-panel-link {
  display: none;
}

.auth-modal {
  position: fixed;
  inset: 0;
  z-index: 30;
  display: none;
  place-items: center;
  padding: 20px;
  background: rgba(18, 18, 17, 0.62);
}

.auth-modal.show {
  display: grid;
}

.auth-box {
  position: relative;
  display: grid;
  gap: 14px;
  width: min(520px, 100%);
  padding: 28px;
  border: 1px solid rgba(184, 154, 85, 0.38);
  background: var(--surface);
  box-shadow: var(--shadow);
}

.bootstrap-view {
  max-width: 980px;
}

.bootstrap-panel {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(240px, 320px);
  gap: 18px;
  align-items: stretch;
  margin-bottom: 18px;
  padding: 28px;
  border: 1px solid rgba(184, 154, 85, 0.32);
  background: linear-gradient(135deg, #181815 0%, #2b2923 100%);
  color: #fff;
  box-shadow: var(--shadow);
}

.bootstrap-panel h2 {
  max-width: 680px;
  color: #fff;
  font-size: clamp(30px, 5vw, 54px);
}

.bootstrap-panel p:not(.eyebrow) {
  max-width: 680px;
  color: rgba(247, 245, 239, 0.72);
  line-height: 1.6;
}

.bootstrap-status-card {
  display: grid;
  align-content: center;
  gap: 8px;
  padding: 18px;
  border: 1px solid rgba(255, 255, 255, 0.16);
  background: rgba(255, 255, 255, 0.08);
}

.bootstrap-status-card strong,
.bootstrap-status-card small {
  display: block;
}

.bootstrap-status-card small {
  color: rgba(247, 245, 239, 0.68);
  line-height: 1.5;
}

.bootstrap-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
}

.bootstrap-form[data-locked="true"] {
  opacity: 0.72;
}

.role-matrix-row {
  grid-template-columns: minmax(0, 1fr) auto;
}

.role-badges {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  margin-top: 8px;
}

.auth-box h2 {
  margin-bottom: 0;
}

.auth-box p:not(.eyebrow) {
  color: var(--muted);
  line-height: 1.55;
}

.auth-close {
  position: absolute;
  top: 14px;
  right: 14px;
}

.eyebrow {
  margin: 0 0 6px;
  color: var(--gold);
  font-size: 12px;
  font-weight: 800;
  letter-spacing: 0;
  text-transform: uppercase;
}

h1,
h2,
h3,
p {
  margin-top: 0;
}

h1 {
  margin-bottom: 0;
  font-size: clamp(28px, 3vw, 44px);
  letter-spacing: 0;
}

h2 {
  font-size: clamp(26px, 3vw, 48px);
  line-height: 1.02;
  letter-spacing: 0;
}

h3 {
  margin-bottom: 0;
  font-size: 18px;
}

.ghost-button,
.primary-button,
.secondary-button,
.filter-button {
  border: 0;
  min-height: 42px;
  padding: 0 16px;
  font-weight: 750;
}

.ghost-button {
  width: 42px;
  padding: 0;
  border: 1px solid var(--line);
  background: var(--surface);
  color: var(--ink);
  font-size: 20px;
}

.primary-button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: var(--ink);
  color: #fff;
  text-decoration: none;
  cursor: pointer;
}

.primary-button:hover {
  background: #2a2926;
}

.secondary-button {
  border: 1px solid rgba(37, 36, 32, 0.22);
  background: rgba(255, 255, 255, 0.72);
  color: var(--ink);
}

.secondary-button:hover {
  border-color: rgba(184, 154, 85, 0.58);
  background: #fff;
}

.view {
  display: none;
}

.view.active {
  display: block;
}

.hero-panel {
  position: relative;
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  min-height: 520px;
  overflow: hidden;
  background: #f8f7f2;
  box-shadow: var(--shadow);
}

.hero-panel img {
  grid-area: 1 / 1;
  width: 100%;
  height: 100%;
  min-height: 520px;
  object-fit: cover;
}

.hero-copy {
  grid-area: 1 / 1;
  position: relative;
  display: flex;
  flex-direction: column;
  justify-content: center;
  max-width: 760px;
  min-height: 520px;
  margin-right: auto;
  padding: clamp(28px, 6vw, 72px);
  background: linear-gradient(90deg, rgba(248, 247, 242, 0.96) 0%, rgba(248, 247, 242, 0.88) 62%, rgba(248, 247, 242, 0) 100%);
  color: var(--ink);
}

.hero-copy p:not(.eyebrow) {
  max-width: 600px;
  color: #4f514a;
  line-height: 1.65;
  font-size: 18px;
}

.hero-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin-top: 18px;
}

.hero-copy .primary-button {
  background: #171717;
  color: #fff;
}

.hero-proof {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-top: 20px;
}

.hero-proof span {
  padding: 8px 10px;
  border: 1px solid rgba(184, 154, 85, 0.28);
  background: rgba(255, 255, 255, 0.68);
  color: #5f5b51;
  font-size: 12px;
  font-weight: 900;
  text-transform: uppercase;
}

.metrics-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 14px;
  margin: 18px 0;
}

.start-steps-section,
.how-flow-section,
.resource-hub-section {
  margin: 18px 0;
  padding: 22px;
  border: 1px solid var(--line);
  background: var(--surface);
  box-shadow: 0 8px 28px rgba(20, 20, 20, 0.035);
}

.start-steps-section h3,
.how-flow-section h3,
.resource-hub-section h3 {
  max-width: 820px;
  color: var(--ink);
  font-size: clamp(24px, 3vw, 38px);
  line-height: 1.12;
}

.start-steps-section .brand-system {
  margin: 16px 0;
}

.start-steps-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
}

.how-flow-grid,
.resource-hub-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 14px;
  margin-top: 16px;
}

.how-flow-card,
.resource-hub-card {
  display: grid;
  min-height: 176px;
  padding: 18px;
  border: 1px solid var(--line);
  background: linear-gradient(180deg, #ffffff 0%, #fbfaf5 100%);
  color: inherit;
  text-align: left;
  transition: transform 0.18s ease, border-color 0.18s ease, box-shadow 0.18s ease;
}

.how-flow-card:hover,
.resource-hub-card:hover {
  border-color: rgba(184, 154, 85, 0.56);
  box-shadow: 0 14px 34px rgba(30, 28, 22, 0.08);
  transform: translateY(-2px);
}

.how-flow-card span,
.how-flow-card strong,
.how-flow-card small,
.resource-hub-card span,
.resource-hub-card strong,
.resource-hub-card small {
  display: block;
}

.how-flow-card span,
.resource-hub-card span {
  color: var(--gold);
  font-size: 12px;
  font-weight: 900;
  text-transform: uppercase;
}

.how-flow-card strong,
.resource-hub-card strong {
  margin-top: 12px;
  color: #282621;
  font-size: 20px;
  line-height: 1.2;
}

.how-flow-card small,
.resource-hub-card small {
  align-self: end;
  margin-top: 14px;
  color: var(--muted);
  line-height: 1.45;
}

.brand-system {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 14px;
  margin: 18px 0;
}

.brand-system article {
  min-height: 118px;
  padding: 18px;
  border: 1px solid var(--line);
  background: linear-gradient(180deg, #ffffff 0%, #fbfaf5 100%);
}

.brand-system span,
.brand-system strong {
  display: block;
}

.brand-system span {
  margin-bottom: 12px;
  color: var(--gold);
  font-size: 13px;
  font-weight: 900;
  text-transform: uppercase;
}

.brand-system strong {
  color: #262522;
  font-size: 19px;
  line-height: 1.25;
}

.manifesto-band {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 18px;
  align-items: center;
  margin: 18px 0;
  padding: 26px;
  border: 1px solid #d8d0bd;
  background: #fffaf0;
  color: var(--ink);
}

.manifesto-band h3 {
  max-width: 820px;
  margin-bottom: 10px;
  color: #211f1a;
  font-size: clamp(24px, 3vw, 38px);
}

.manifesto-band p:not(.eyebrow) {
  max-width: 860px;
  margin-bottom: 0;
  color: #635f54;
  line-height: 1.6;
}

.manifesto-band .primary-button {
  background: #171717;
  color: #fff;
}

.home-path-section {
  margin: 18px 0;
  padding: 22px;
  border: 1px solid var(--line);
  background: linear-gradient(180deg, #ffffff 0%, #fbfaf5 100%);
  box-shadow: 0 8px 28px rgba(20, 20, 20, 0.035);
}

.home-path-section .panel-heading {
  margin-bottom: 16px;
}

.home-path-section h3 {
  max-width: 720px;
  color: var(--ink);
  font-size: clamp(24px, 3vw, 38px);
  line-height: 1.12;
}

.home-routes {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 14px;
}

.home-route-card {
  position: relative;
  display: grid;
  align-content: end;
  min-height: 260px;
  padding: 18px;
  border: 1px solid var(--line);
  overflow: hidden;
  background: #181815;
  color: #fff;
  cursor: pointer;
  font: inherit;
  text-align: left;
  text-decoration: none;
  transition: transform 0.18s ease, border-color 0.18s ease, box-shadow 0.18s ease;
}

.home-route-card::before {
  content: "";
  position: absolute;
  inset: 0;
  background:
    linear-gradient(180deg, rgba(18, 18, 17, 0.08) 0%, rgba(18, 18, 17, 0.36) 42%, rgba(18, 18, 17, 0.92) 100%),
    var(--route-image, url("assets/hero-real-people-legacy.png")) center / cover;
  transform: scale(1.01);
  transition: transform 0.24s ease, opacity 0.24s ease;
}

.home-route-card::after {
  content: "";
  position: absolute;
  inset: 12px;
  border: 1px solid rgba(255, 255, 255, 0.18);
  pointer-events: none;
}

.home-route-card[data-route="guide"] {
  --route-image: linear-gradient(135deg, rgba(24, 24, 21, 0.95), rgba(184, 154, 85, 0.45)), url("assets/hero-team-legacy.png");
}

.home-route-card[data-route="fat-loss"],
.home-route-card[data-route="health"] {
  --route-image: url("assets/hero-real-people-legacy.png");
}

.home-route-card[data-route="muscle"],
.home-route-card[data-route="competitors"] {
  --route-image: url("assets/hero-legacy-physique.png");
}

.home-route-card[data-route="sport"] {
  --route-image: url("assets/hero-performance-legacy.png");
}

.home-route-card[data-route="girls"] {
  --route-image: url("assets/hero-team-legacy.png");
}

.home-route-card:hover {
  border-color: rgba(184, 154, 85, 0.56);
  box-shadow: 0 14px 34px rgba(30, 28, 22, 0.08);
  transform: translateY(-2px);
}

.home-route-card:hover::before {
  transform: scale(1.06);
}

.home-route-card span,
.home-route-card strong,
.home-route-card small {
  position: relative;
  z-index: 1;
  display: block;
}

.home-route-card span {
  width: fit-content;
  margin-bottom: 10px;
  padding: 7px 9px;
  background: rgba(255, 255, 255, 0.9);
  color: #1f1e1b;
  font-size: 12px;
  font-weight: 900;
  text-transform: uppercase;
}

.home-route-card strong {
  max-width: 320px;
  color: #fff;
  font-size: clamp(22px, 3vw, 30px);
  line-height: 1.05;
}

.home-route-card small {
  max-width: 340px;
  margin-top: 10px;
  color: rgba(255, 255, 255, 0.76);
  line-height: 1.45;
}

.assessment-entry {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 18px;
  align-items: center;
  margin: 18px 0;
  padding: 26px;
  background: #181815;
  color: #fff;
}

.assessment-entry h3 {
  max-width: 780px;
  margin-bottom: 8px;
  color: #fff;
  font-size: clamp(26px, 4vw, 44px);
}

.assessment-entry p:not(.eyebrow) {
  max-width: 880px;
  margin-bottom: 0;
  color: rgba(247, 244, 234, 0.72);
  line-height: 1.6;
}

.assessment-entry .primary-button {
  background: var(--gold);
  color: #111;
}

.why-legacy-section,
.social-proof-section,
.plan-ladder-section,
.faq-section {
  margin: 18px 0;
  padding: 22px;
  border: 1px solid var(--line);
  background: var(--surface);
  box-shadow: 0 8px 28px rgba(20, 20, 20, 0.035);
}

.why-legacy-section h3,
.social-proof-section h3,
.plan-ladder-section h3,
.faq-section h3 {
  max-width: 860px;
  color: var(--ink);
  font-size: clamp(24px, 3vw, 38px);
  line-height: 1.12;
}

.why-grid,
.proof-cards,
.plan-ladder-grid,
.faq-grid {
  display: grid;
  gap: 14px;
}

.why-grid {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

.why-card,
.proof-card,
.plan-tier-card {
  border: 1px solid var(--line);
  background: #f8f7f2;
}

.why-card {
  min-height: 190px;
  padding: 20px;
}

.why-card span,
.proof-card small,
.plan-tier-card span {
  color: var(--gold);
  font-size: 13px;
  font-weight: 900;
  text-transform: uppercase;
}

.why-card strong {
  display: block;
  margin: 14px 0 8px;
  color: #262522;
  font-size: 22px;
}

.why-card p,
.proof-card p,
.plan-tier-card p {
  color: var(--muted);
  line-height: 1.55;
}

.proof-cards {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

.proof-card {
  overflow: hidden;
}

.proof-card > div:last-child {
  padding: 18px;
}

.proof-placeholder {
  display: grid;
  min-height: 220px;
  place-items: center;
  padding: 18px;
  background:
    linear-gradient(135deg, rgba(26, 26, 24, 0.96), rgba(86, 77, 57, 0.88)),
    #171717;
  color: #fff;
  text-align: center;
}

.proof-placeholder span,
.proof-placeholder strong {
  display: block;
}

.proof-placeholder span {
  color: rgba(255, 255, 255, 0.72);
  font-size: 12px;
  font-weight: 900;
  text-transform: uppercase;
}

.proof-placeholder strong {
  margin-top: 10px;
  color: var(--gold);
  font-size: 26px;
}

.proof-card h3 {
  margin: 8px 0;
  font-size: 22px;
}

.plan-ladder-grid {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

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

.faq-card {
  min-height: 150px;
  padding: 18px;
  border: 1px solid var(--line);
  background: #f8f7f2;
}

.faq-card h3 {
  margin-bottom: 10px;
  font-size: 20px;
}

.faq-card p {
  margin: 0;
  color: var(--muted);
  line-height: 1.55;
}

.plan-tier-card {
  display: grid;
  min-height: 390px;
  padding: 20px;
}

.plan-tier-card.featured {
  border-color: rgba(184, 154, 85, 0.58);
  background: linear-gradient(180deg, #fffaf0 0%, #f8f7f2 100%);
  box-shadow: 0 16px 40px rgba(34, 31, 24, 0.08);
}

.plan-tier-card h3 {
  margin: 10px 0 6px;
  font-size: 26px;
}

.plan-tier-card > strong {
  display: block;
  margin-bottom: 10px;
  color: #1f1f1c;
  font-size: 22px;
}

.plan-tier-card ul {
  display: grid;
  gap: 8px;
  padding: 0;
  margin: 14px 0 20px;
  list-style: none;
}

.plan-tier-card li {
  padding-bottom: 8px;
  border-bottom: 1px solid rgba(36, 36, 34, 0.1);
  color: #3b3b36;
}

.plan-tier-card .primary-button {
  align-self: end;
  text-decoration: none;
}

.metric,
.panel,
.form-panel,
.result-card {
  border: 1px solid var(--line);
  background: var(--surface);
  box-shadow: 0 8px 28px rgba(20, 20, 20, 0.035);
}

.metric {
  min-height: 134px;
  padding: 20px;
}

.metric span,
.panel-heading span,
.result-card span {
  color: var(--muted);
  font-size: 13px;
}

.metric strong {
  display: block;
  margin: 14px 0 6px;
  font-size: clamp(24px, 3vw, 38px);
}

.metric small,
.result-card p {
  color: var(--muted);
}

.dashboard-partner {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
  gap: 18px;
  align-items: center;
  margin-bottom: 18px;
  padding: 18px;
  border: 1px solid rgba(184, 154, 85, 0.34);
  background:
    linear-gradient(120deg, rgba(255, 255, 255, 0.95), rgba(248, 247, 242, 0.96)),
    var(--surface);
  box-shadow: 0 8px 28px rgba(20, 20, 20, 0.035);
}

.lifepro-mark {
  display: grid;
  place-items: center;
  min-width: 118px;
  min-height: 74px;
  border: 2px solid #111;
  background: #fff;
  color: #111;
  text-transform: uppercase;
}

.lifepro-mark span {
  font-size: 14px;
  font-weight: 900;
}

.lifepro-mark strong {
  font-size: 34px;
  line-height: 0.9;
}

.partner-paredes {
  border-color: rgba(24, 24, 21, 0.16);
  background:
    linear-gradient(120deg, rgba(248, 247, 242, 0.98), rgba(238, 232, 217, 0.94)),
    var(--surface);
}

.partner-mark {
  display: grid;
  place-items: center;
  min-width: 132px;
  min-height: 82px;
  padding: 12px;
  border: 1px solid rgba(24, 24, 21, 0.28);
  background: #181815;
  color: #fff;
  text-align: center;
  text-transform: uppercase;
}

.partner-mark span {
  color: rgba(255, 255, 255, 0.62);
  font-size: 11px;
  font-weight: 900;
  letter-spacing: 0;
}

.partner-mark strong {
  margin-top: 4px;
  color: var(--gold);
  font-size: 24px;
  line-height: 1;
}

.partner-coupon {
  display: inline-grid;
  grid-template-columns: auto auto auto;
  gap: 8px;
  align-items: center;
  margin-top: 12px;
  padding: 10px 12px;
  border: 1px dashed rgba(184, 154, 85, 0.78);
  background: #fffaf0;
}

.partner-coupon span,
.partner-coupon small {
  color: var(--muted);
  font-size: 12px;
  font-weight: 900;
  text-transform: uppercase;
}

.partner-coupon strong {
  color: var(--ink);
  font-size: 20px;
}

.dashboard-partner h3 {
  margin: 0 0 6px;
  font-size: clamp(22px, 3vw, 32px);
}

.dashboard-partner p:not(.eyebrow) {
  max-width: 760px;
  margin: 0;
  color: var(--muted);
  line-height: 1.5;
}

.dashboard-partner a {
  display: inline-flex;
  min-height: 44px;
  align-items: center;
  justify-content: center;
  padding: 0 16px;
  background: var(--ink);
  color: #fff;
  font-weight: 900;
  text-decoration: none;
}

.content-grid,
.coach-layout {
  display: grid;
  grid-template-columns: minmax(0, 1.45fr) minmax(300px, 0.55fr);
  gap: 18px;
}

.panel,
.form-panel,
.result-card {
  padding: 22px;
}

.panel-heading {
  display: flex;
  justify-content: space-between;
  gap: 16px;
  margin-bottom: 20px;
}

.chart {
  display: grid;
  grid-template-columns: repeat(6, 1fr);
  align-items: end;
  gap: 12px;
  height: 220px;
  padding-top: 20px;
}

.bar-wrap {
  display: grid;
  grid-template-rows: 1fr auto;
  gap: 8px;
  height: 100%;
}

.bar {
  align-self: end;
  min-height: 26px;
  background: linear-gradient(180deg, var(--gold), #2f332f);
}

.bar-label {
  color: var(--muted);
  font-size: 12px;
  text-align: center;
}

.task-list {
  display: grid;
  gap: 16px;
  padding: 0;
  margin: 0;
  list-style: none;
}

.task-list li {
  display: grid;
  grid-template-columns: 14px 1fr;
  align-items: center;
  gap: 12px;
  color: #2c2c29;
}

.task-list span {
  width: 14px;
  height: 14px;
  border: 2px solid var(--gold);
}

.form-panel {
  display: grid;
  gap: 24px;
}

.form-panel.compact {
  margin-bottom: 18px;
}

.form-intro {
  max-width: 760px;
}

.form-intro p:not(.eyebrow) {
  color: var(--muted);
  line-height: 1.6;
}

.form-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 16px;
}

label {
  display: grid;
  gap: 8px;
  color: #343431;
  font-size: 14px;
  font-weight: 750;
}

input,
select,
textarea {
  width: 100%;
  min-height: 44px;
  border: 1px solid var(--line);
  background: #fbfbf8;
  color: var(--ink);
  padding: 10px 12px;
}

textarea {
  min-height: 104px;
  resize: vertical;
}

label:has(textarea) {
  grid-column: span 2;
}

input[type="range"] {
  padding: 0;
  accent-color: var(--gold);
}

output {
  color: var(--gold);
}

.form-status {
  display: block;
  padding: 12px 14px;
  border: 1px solid var(--line);
  background: #f8f7f2;
  color: var(--muted);
  font-weight: 800;
}

.form-status[data-status="sending"] {
  border-color: rgba(184, 154, 85, 0.48);
  color: #7a5d1d;
}

.form-status[data-status="success"] {
  border-color: rgba(57, 132, 86, 0.32);
  background: #edf6ef;
  color: var(--success);
}

.form-status[data-status="error"] {
  border-color: rgba(178, 77, 62, 0.32);
  background: #f8eeee;
  color: var(--warn);
}

.result-card {
  margin-top: 18px;
}

.result-card strong {
  display: block;
  margin: 8px 0;
  font-size: 30px;
}

.timeline {
  display: grid;
  gap: 12px;
}

.timeline-item {
  display: grid;
  gap: 4px;
  padding: 14px;
  border-left: 3px solid var(--gold);
  background: #f8f7f2;
}

.timeline-item strong {
  font-size: 16px;
}

.timeline-item span {
  color: var(--muted);
  font-size: 13px;
}

.free-hero {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(320px, 0.42fr);
  gap: 22px;
  align-items: center;
  min-height: 340px;
  margin-bottom: 18px;
  padding: clamp(28px, 6vw, 58px);
  background: linear-gradient(120deg, #111413, #33413c);
  color: #fff;
}

.free-hero h2 {
  max-width: 820px;
  margin-bottom: 14px;
  color: #fff;
}

.free-hero p:not(.eyebrow) {
  max-width: 720px;
  color: rgba(255, 255, 255, 0.74);
  font-size: 18px;
  line-height: 1.6;
}

.lead-form {
  display: grid;
  gap: 14px;
  padding: 20px;
  background: rgba(255, 255, 255, 0.08);
  border: 1px solid rgba(255, 255, 255, 0.16);
}

.lead-form label {
  color: #fff;
}

.lead-form small {
  color: rgba(255, 255, 255, 0.7);
}

.free-locked,
.free-panel,
.macro-form,
.macro-result article {
  border: 1px solid var(--line);
  background: var(--surface);
}

.free-locked {
  padding: 26px;
  margin-bottom: 18px;
}

.free-locked strong {
  display: block;
  margin-bottom: 8px;
  font-size: 24px;
}

.free-locked p {
  margin-bottom: 0;
  color: var(--muted);
}

.free-content {
  display: grid;
  gap: 18px;
}

.user-panel-hero,
.coach-command {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(280px, 0.35fr);
  gap: 22px;
  align-items: center;
  min-height: 300px;
  margin-bottom: 18px;
  padding: clamp(28px, 6vw, 58px);
  border: 1px solid var(--line);
  background: linear-gradient(120deg, #fdfcf7, #ece7db);
}

.user-panel-hero h2,
.coach-command h2 {
  max-width: 860px;
  margin-bottom: 12px;
  font-size: clamp(30px, 5vw, 58px);
}

.user-panel-hero p:not(.eyebrow),
.coach-command p:not(.eyebrow) {
  max-width: 780px;
  color: var(--muted);
  font-size: 18px;
  line-height: 1.6;
}

.panel-access-card,
.coach-command-card,
.user-panel-card,
.history-card {
  border: 1px solid var(--line);
  background: var(--surface);
}

.panel-access-card {
  display: grid;
  gap: 8px;
  min-height: 190px;
  padding: 20px;
}

.panel-access-card span,
.coach-command-card span,
.user-panel-card span,
.history-card span {
  color: var(--gold);
  font-size: 12px;
  font-weight: 900;
  text-transform: uppercase;
}

.panel-access-card strong,
.coach-command-card strong,
.user-panel-card strong,
.history-card strong {
  color: var(--ink);
  font-size: 24px;
  line-height: 1.12;
}

.panel-access-card p,
.panel-access-card small,
.coach-command-card p,
.user-panel-card p,
.history-card p {
  margin: 0;
  color: var(--muted);
  line-height: 1.5;
}

.user-panel-grid,
.panel-history-grid,
.coach-command-grid {
  display: grid;
  gap: 14px;
}

.user-panel-grid {
  grid-template-columns: repeat(4, minmax(0, 1fr));
  margin-bottom: 18px;
}

.user-panel-card,
.history-card,
.coach-command-card {
  display: grid;
  gap: 10px;
  min-height: 170px;
  padding: 18px;
}

.panel-history-section {
  padding: 22px;
  border: 1px solid var(--line);
  background: var(--surface);
}

.onboarding-section {
  margin: 18px 0;
  padding: 22px;
  border: 1px solid var(--line);
  background: var(--surface);
}

.onboarding-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 12px;
}

.onboarding-card {
  display: grid;
  gap: 8px;
  min-height: 150px;
  padding: 16px;
  border: 1px solid var(--line);
  background: #f8f7f2;
}

.onboarding-card.completed {
  border-color: rgba(41, 123, 74, 0.28);
  background: #eff7f1;
}

.onboarding-card.pending {
  border-color: rgba(173, 135, 62, 0.4);
}

.onboarding-card span,
.crm-card span {
  color: var(--gold);
  font-size: 12px;
  font-weight: 900;
  text-transform: uppercase;
}

.onboarding-card strong {
  color: var(--ink);
}

.onboarding-form {
  margin-top: 14px;
}

.panel-history-grid {
  grid-template-columns: repeat(5, minmax(0, 1fr));
}

.coach-command {
  grid-template-columns: minmax(0, 1fr);
}

.coach-command-grid {
  grid-template-columns: repeat(6, minmax(0, 1fr));
}

.coach-command-card {
  min-height: 150px;
  background: #f8f7f2;
}

.messages-section,
.notifications-section,
.admin-ops-grid .panel {
  margin-top: 18px;
}

.messages-section,
.notifications-section {
  padding: 22px;
  border: 1px solid var(--line);
  background: var(--surface);
}

.message-form {
  display: grid;
  gap: 14px;
  margin-bottom: 16px;
}

.message-list,
.admin-list {
  display: grid;
  gap: 10px;
}

.message-card,
.admin-row,
.notification-card {
  padding: 14px;
  border: 1px solid var(--line);
  background: #f8f7f2;
}

.message-card span,
.admin-row small,
.notification-card span,
.notification-card small {
  display: block;
  color: var(--muted);
  font-size: 13px;
}

.message-card p,
.notification-card p {
  margin: 8px 0 0;
  color: #2f2f2b;
  line-height: 1.5;
}

.message-card.unread,
.notification-card:not(.is-read) {
  border-color: rgba(173, 135, 62, 0.55);
  background: #fffaf0;
}

.message-card.from-team {
  border-left: 4px solid var(--gold);
}

.message-card.from-user {
  border-left: 4px solid #2f2f2b;
}

.notification-list {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
}

.notification-card strong {
  display: block;
  margin-top: 5px;
  color: var(--ink);
}

.admin-hero {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(280px, 0.35fr);
  gap: 22px;
  align-items: center;
  min-height: 300px;
  margin-bottom: 18px;
  padding: clamp(28px, 6vw, 58px);
  border: 1px solid var(--line);
  background: linear-gradient(120deg, #181815, #3a3529);
  color: #fff;
}

.admin-hero h2 {
  max-width: 880px;
  margin-bottom: 12px;
  color: #fff;
  font-size: clamp(30px, 5vw, 58px);
}

.admin-hero p:not(.eyebrow) {
  max-width: 760px;
  color: rgba(247, 245, 239, 0.72);
  font-size: 18px;
  line-height: 1.6;
}

.admin-grid,
.admin-ops-grid {
  display: grid;
  gap: 14px;
}

.admin-grid {
  grid-template-columns: repeat(6, minmax(0, 1fr));
  margin-bottom: 18px;
}

.admin-ops-grid {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.crm-panel {
  grid-column: 1 / -1;
}

.crm-layout {
  display: grid;
  grid-template-columns: minmax(240px, 0.35fr) minmax(0, 1fr);
  gap: 14px;
}

.crm-client-button {
  width: 100%;
  padding: 14px;
  border: 1px solid var(--line);
  background: #f8f7f2;
  color: var(--ink);
  text-align: left;
  cursor: pointer;
}

.crm-client-button.active {
  border-color: var(--gold);
  background: #fffaf0;
}

.crm-client-button strong,
.crm-client-button span {
  display: block;
}

.crm-client-button span {
  margin-top: 4px;
  color: var(--muted);
  font-size: 13px;
}

.crm-detail {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
}

.crm-card {
  padding: 16px;
  border: 1px solid var(--line);
  background: #fbfbf8;
}

.crm-card-wide {
  grid-column: 1 / -1;
}

.crm-card h3 {
  margin: 8px 0;
}

.crm-card p {
  color: var(--muted);
  line-height: 1.5;
}

.crm-card select {
  width: 100%;
  min-height: 44px;
  margin-top: 10px;
}

.crm-tags {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-top: 12px;
}

.crm-tags span {
  padding: 6px 8px;
  background: #ece7db;
  color: var(--ink);
}

.task-row {
  border-left: 4px solid var(--gold);
}

.crm-note-list {
  display: grid;
  gap: 8px;
  margin-top: 12px;
}

.crm-note {
  padding: 10px;
  border: 1px solid var(--line);
  background: #f8f7f2;
}

.crm-note.important {
  border-color: rgba(173, 135, 62, 0.7);
  background: #fff8df;
}

.task-edit-actions select,
.task-edit-actions input {
  min-height: 36px;
  max-width: 210px;
}

.admin-row {
  display: grid;
  gap: 12px;
}

.admin-row strong {
  display: block;
  margin-bottom: 4px;
}

.admin-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
}

.admin-actions .secondary-button {
  min-height: 34px;
  padding: 0 10px;
  font-size: 12px;
}

.consent-row {
  grid-template-columns: auto 1fr;
  align-items: start;
  gap: 10px;
  padding: 12px;
  border: 1px solid var(--line);
  background: #f8f7f2;
  line-height: 1.4;
}

.consent-row input {
  width: auto;
  min-height: 0;
  margin-top: 3px;
}

.photo-compare-section {
  margin-top: 18px;
  padding: 22px;
  border: 1px solid var(--line);
  background: var(--surface);
}

.compare-controls,
.compare-field-tabs,
.coach-filter-bar,
.admin-filter-bar,
.conversion-grid {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin-bottom: 16px;
}

.compare-controls label,
.admin-filter-bar label {
  min-width: 180px;
}

.admin-filter-bar input,
.admin-filter-bar select {
  min-height: 42px;
}

.photo-compare-grid {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 14px;
}

.photo-compare-card {
  padding: 16px;
  border: 1px solid var(--line);
  background: #f8f7f2;
}

.photo-compare-card-wide {
  width: 100%;
}

.photo-compare-card span,
.conversion-card span {
  color: var(--gold);
  font-size: 12px;
  font-weight: 900;
  text-transform: uppercase;
}

.photo-pair {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px;
  margin: 12px 0;
}

.photo-pair img,
.photo-empty {
  width: 100%;
  aspect-ratio: 3 / 4;
  object-fit: cover;
  border: 1px solid var(--line);
  background: #ece7db;
}

.before-after-slider {
  position: relative;
  overflow: hidden;
  width: min(100%, 760px);
  margin: 14px auto;
  aspect-ratio: 3 / 4;
  border: 1px solid var(--line);
  background: #ece7db;
}

.before-after-slider img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.after-img-wrap {
  position: absolute;
  inset: 0;
  width: var(--split);
  overflow: hidden;
  border-right: 3px solid #fff;
  box-shadow: 6px 0 18px rgba(0, 0, 0, 0.18);
}

.compare-range {
  position: absolute;
  inset: auto 5% 18px;
  width: 90%;
  accent-color: var(--gold);
}

.photo-empty-large {
  min-height: 360px;
  padding: 24px;
  text-align: center;
}

.coach-feedback {
  margin-top: 12px;
  padding: 14px;
  border: 1px solid var(--line);
  background: var(--surface);
}

.coach-feedback strong {
  color: var(--ink);
}

.offline-status[data-status="sending"] {
  color: #9a6a13;
}

.photo-empty {
  display: grid;
  place-items: center;
  color: var(--muted);
  font-weight: 900;
}

.conversion-card {
  min-width: 180px;
  padding: 16px;
  border: 1px solid var(--line);
  background: #f8f7f2;
}

.conversion-card strong {
  display: block;
  margin-top: 8px;
  font-size: 30px;
}

.macro-section {
  display: grid;
  grid-template-columns: minmax(0, 1.2fr) minmax(320px, 0.8fr);
  gap: 18px;
}

.macro-form {
  display: grid;
  gap: 18px;
  padding: 22px;
}

.macro-result {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
}

.macro-result article {
  padding: 18px;
}

.macro-result span,
.macro-result small {
  display: block;
  color: var(--muted);
}

.macro-result strong {
  display: block;
  margin: 10px 0 6px;
  font-size: 30px;
}

.free-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 18px;
}

.free-panel {
  padding: 22px;
}

.supplement-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
}

.supplement-card,
.myth-card {
  padding: 16px;
  background: #f8f7f2;
}

.supplement-card span {
  color: var(--gold);
  font-size: 12px;
  font-weight: 900;
  text-transform: uppercase;
}

.supplement-card strong,
.myth-card strong {
  display: block;
  margin: 8px 0;
  font-size: 18px;
}

.supplement-card p,
.supplement-card small,
.myth-card p {
  color: var(--muted);
  line-height: 1.5;
}

.supplement-buy-link {
  display: inline-flex;
  min-height: 38px;
  align-items: center;
  justify-content: center;
  margin-top: 14px;
  padding: 0 12px;
  background: var(--ink);
  color: #fff;
  font-size: 13px;
  font-weight: 900;
  text-decoration: none;
}

.supplement-store-panel {
  background:
    linear-gradient(135deg, rgba(184, 154, 85, 0.16), rgba(255, 255, 255, 0.96)),
    var(--surface);
}

.supplement-store-panel p {
  color: var(--muted);
  line-height: 1.55;
}

.discount-code-card {
  display: grid;
  gap: 6px;
  margin: 18px 0;
  padding: 18px;
  border: 1px dashed rgba(184, 154, 85, 0.72);
  background: #fffaf0;
}

.discount-code-card span,
.discount-code-card small {
  color: var(--muted);
}

.discount-code-card strong {
  color: #7a5d1d;
  font-size: clamp(30px, 5vw, 48px);
  line-height: 1;
}

.store-button {
  display: inline-flex;
  min-height: 46px;
  align-items: center;
  justify-content: center;
  padding: 0 18px;
  background: var(--ink);
  color: #fff;
  font-weight: 900;
  text-decoration: none;
}

.store-priority-list {
  display: grid;
  gap: 12px;
  padding: 0;
  margin: 0;
  list-style: none;
}

.store-priority-list li {
  display: grid;
  gap: 6px;
  padding: 14px;
  background: #f8f7f2;
}

.store-priority-list strong {
  color: var(--ink);
}

.store-priority-list span {
  color: var(--muted);
  line-height: 1.45;
}

.route-test,
.myth-list {
  display: grid;
  gap: 10px;
}

.route-option {
  min-height: 44px;
  border: 1px solid var(--line);
  background: #f8f7f2;
  color: var(--ink);
  padding: 0 12px;
  text-align: left;
  font-weight: 850;
}

.route-result {
  display: none;
  padding: 14px;
  background: #151513;
  color: #fff;
  line-height: 1.5;
}

.route-result.show {
  display: block;
}

.checklist {
  display: grid;
  gap: 10px;
  padding: 0;
  margin: 0;
  list-style: none;
}

.checklist li {
  padding: 12px;
  border-left: 4px solid var(--gold);
  background: #f8f7f2;
}

.start-hero {
  display: grid;
  align-items: center;
  min-height: 300px;
  margin-bottom: 18px;
  padding: clamp(28px, 6vw, 58px);
  background: linear-gradient(120deg, #fdfcf7, #ece7db);
  border: 1px solid var(--line);
}

.start-hero h2 {
  max-width: 860px;
  margin-bottom: 14px;
}

.start-hero p:not(.eyebrow) {
  max-width: 780px;
  color: var(--muted);
  font-size: 18px;
  line-height: 1.6;
}

.path-grid,
.method-steps,
.coaching-grid,
.team-grid,
.testimonial-list,
.calendar-grid {
  display: grid;
  gap: 14px;
}

.path-grid {
  grid-template-columns: repeat(3, minmax(0, 1fr));
  margin-bottom: 18px;
}

.path-card,
.method-card,
.coaching-card,
.team-card,
.testimonial-card,
.calendar-card {
  padding: 20px;
  border: 1px solid var(--line);
  background: var(--surface);
}

.path-card {
  position: relative;
  min-height: 190px;
  overflow: hidden;
}

.path-card::before {
  content: "";
  display: block;
  height: 92px;
  margin: -20px -20px 18px;
  background:
    linear-gradient(180deg, rgba(18, 18, 17, 0.08), rgba(18, 18, 17, 0.45)),
    var(--route-image, url("assets/hero-real-people-legacy.png")) center / cover;
}

.path-card[data-route="guide"] {
  --route-image: linear-gradient(135deg, rgba(24, 24, 21, 0.95), rgba(184, 154, 85, 0.45)), url("assets/hero-team-legacy.png");
}

.path-card[data-route="fat-loss"],
.path-card[data-route="health"] {
  --route-image: url("assets/hero-real-people-legacy.png");
}

.path-card[data-route="muscle"],
.path-card[data-route="competitors"] {
  --route-image: url("assets/hero-legacy-physique.png");
}

.path-card[data-route="sport"] {
  --route-image: url("assets/hero-performance-legacy.png");
}

.path-card[data-route="girls"] {
  --route-image: url("assets/hero-team-legacy.png");
}

.path-link-card {
  color: inherit;
  cursor: pointer;
  font: inherit;
  text-align: left;
  text-decoration: none;
  transition: transform 0.18s ease, border-color 0.18s ease, box-shadow 0.18s ease;
}

.path-link-card:hover {
  border-color: rgba(184, 154, 85, 0.56);
  box-shadow: 0 14px 34px rgba(30, 28, 22, 0.08);
  transform: translateY(-2px);
}

.path-card span,
.coaching-card span,
.testimonial-card span,
.team-card small {
  color: var(--gold);
  font-size: 13px;
  font-weight: 900;
  text-transform: uppercase;
}

.path-card strong,
.method-card strong,
.team-card strong,
.testimonial-card strong,
.calendar-card strong {
  display: block;
  margin: 12px 0 8px;
  font-size: 22px;
}

.path-card p,
.method-card p,
.coaching-card p,
.team-card p,
.testimonial-card p,
.calendar-card p {
  color: var(--muted);
  line-height: 1.55;
}

.method-section,
.coaching-section,
.team-section,
.reviews-section,
.calendar-section {
  margin-top: 18px;
  padding: 22px;
  border: 1px solid var(--line);
  background: var(--surface);
}

.method-steps {
  grid-template-columns: repeat(6, minmax(0, 1fr));
}

.method-card {
  min-height: 210px;
  background: #f8f7f2;
}

.method-card b {
  color: var(--gold);
  font-size: 28px;
}

.coaching-grid {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

.coaching-card {
  display: grid;
  min-height: 340px;
}

.coaching-card h3 {
  margin-top: 10px;
  font-size: 26px;
}

.coaching-card ul {
  display: grid;
  gap: 8px;
  padding: 0;
  margin: 10px 0 18px;
  list-style: none;
}

.coaching-card li {
  border-bottom: 1px solid var(--line);
  padding-bottom: 8px;
}

.proof-grid {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(320px, 0.8fr);
  gap: 18px;
}

.team-grid {
  grid-template-columns: repeat(5, minmax(0, 1fr));
}

.team-card {
  min-height: 230px;
}

.instagram-link {
  display: inline-flex;
  margin-top: 8px;
  color: var(--gold);
  font-size: 13px;
  font-weight: 900;
  text-decoration: none;
}

.instagram-link:hover {
  color: #7a5d1d;
}

.team-avatar {
  display: grid;
  place-items: center;
  width: 54px;
  height: 54px;
  background: #171717;
  color: var(--gold);
  font-weight: 900;
}

.testimonial-list {
  grid-template-columns: 1fr;
}

.testimonial-card {
  background: #f8f7f2;
}

.calendar-grid {
  grid-template-columns: repeat(4, minmax(0, 1fr));
}

.calendar-card {
  min-height: 130px;
  border-left: 4px solid var(--gold);
}

.legacy-os-view {
  --os-dark: #101313;
  --os-accent: #25c7a2;
  --os-accent-2: #d7b865;
}

.os-hero {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 220px;
  gap: 22px;
  align-items: center;
  min-height: 320px;
  margin-bottom: 18px;
  padding: clamp(28px, 6vw, 58px);
  background: linear-gradient(120deg, #101313, #28312f);
  color: #fff;
}

.os-hero h2 {
  max-width: 820px;
  margin-bottom: 14px;
  font-size: clamp(34px, 5vw, 68px);
}

.os-hero p:not(.os-eyebrow) {
  max-width: 720px;
  color: rgba(255, 255, 255, 0.72);
  font-size: 18px;
  line-height: 1.6;
}

.os-eyebrow {
  margin: 0 0 8px;
  color: var(--os-accent);
  font-size: 13px;
  font-weight: 900;
  text-transform: uppercase;
}

.os-score-card {
  display: grid;
  place-items: center;
  min-height: 220px;
  border: 1px solid rgba(37, 199, 162, 0.38);
  background: rgba(255, 255, 255, 0.06);
  text-align: center;
}

.os-score-card span,
.os-score-card small {
  color: rgba(255, 255, 255, 0.72);
}

.os-score-card strong {
  color: var(--os-accent);
  font-size: 76px;
  line-height: 1;
}

.os-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 16px;
}

.os-panel,
.lab-section,
.copilot-section {
  padding: 22px;
  border: 1px solid var(--line);
  background: var(--surface);
}

.score-breakdown,
.weak-map,
.prediction-list,
.athlete-passport,
.copilot-grid {
  display: grid;
  gap: 12px;
}

.score-row,
.weak-row,
.prediction-item,
.athlete-passport div,
.copilot-card {
  padding: 14px;
  background: #f8f7f2;
}

.score-row {
  display: flex;
  justify-content: space-between;
  gap: 16px;
}

.score-row strong,
.score-row span,
.weak-row strong,
.weak-row span,
.athlete-passport span,
.athlete-passport strong {
  display: block;
}

.score-row span,
.weak-row span,
.athlete-passport span,
.copilot-card span {
  color: var(--muted);
  font-size: 13px;
}

.score-row b {
  color: var(--os-accent);
  font-size: 24px;
}

.weak-row {
  display: grid;
  gap: 10px;
}

.weak-meter {
  height: 8px;
  overflow: hidden;
  background: #e2dfd5;
}

.weak-meter i {
  display: block;
  height: 100%;
  background: linear-gradient(90deg, var(--os-accent), var(--os-accent-2));
}

.prediction-item {
  border-left: 4px solid var(--os-accent);
  color: #2d302e;
}

.lab-section,
.copilot-section {
  margin-top: 18px;
}

.lab-grid,
.copilot-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 12px;
}

.lab-card {
  min-height: 150px;
  padding: 16px;
  background: #111413;
  color: #fff;
}

.lab-card strong,
.copilot-card strong {
  display: block;
  margin-bottom: 8px;
}

.lab-card p,
.copilot-card p {
  color: rgba(255, 255, 255, 0.68);
  line-height: 1.5;
}

.copilot-card p {
  color: var(--muted);
}

.library-toolbar {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin-bottom: 16px;
}

.filter-button {
  border: 1px solid var(--line);
  background: var(--surface);
  color: var(--ink);
}

.filter-button.active {
  border-color: var(--ink);
  background: var(--ink);
  color: #fff;
}

.library-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 16px;
}

.library-card {
  min-height: 210px;
  padding: 20px;
  border: 1px solid var(--line);
  background: var(--surface);
}

.library-card .tag,
.client .tag {
  display: inline-flex;
  margin-bottom: 28px;
  padding: 6px 9px;
  background: var(--gold-soft);
  color: #6e581f;
  font-size: 12px;
  font-weight: 800;
}

.library-card h3 {
  margin-bottom: 10px;
}

.library-card p {
  color: var(--muted);
  line-height: 1.55;
}

.shop-heading {
  display: flex;
  justify-content: space-between;
  gap: 18px;
  margin-bottom: 18px;
}

.shop-heading p:not(.eyebrow) {
  max-width: 720px;
  color: var(--muted);
  line-height: 1.6;
}

.shop-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 16px;
}

.shop-card {
  display: grid;
  gap: 18px;
  min-height: 360px;
  padding: 22px;
  border: 1px solid var(--line);
  background: var(--surface);
  box-shadow: 0 8px 28px rgba(20, 20, 20, 0.035);
}

.shop-card.featured {
  border-color: rgba(184, 154, 85, 0.55);
  background: linear-gradient(180deg, #ffffff 0%, #fbf7ef 100%);
}

.shop-card.featured .price {
  color: #7a5d1d;
}

.girls-view {
  --pink: #ff2f92;
  --pink-hot: #ff007a;
  --pink-soft: #ffe1ef;
  --pink-ink: #3b071f;
  --violet: #7d2fff;
}

.girls-hero {
  display: grid;
  align-items: center;
  min-height: 360px;
  margin-bottom: 18px;
  padding: clamp(28px, 6vw, 64px);
  overflow: hidden;
  background:
    linear-gradient(115deg, rgba(255, 0, 122, 0.96), rgba(125, 47, 255, 0.82)),
    linear-gradient(180deg, #ffb4d8, #fff);
  color: #fff;
}

.girls-hero h2 {
  max-width: 820px;
  margin-bottom: 16px;
  font-size: clamp(36px, 6vw, 76px);
}

.girls-hero p:not(.girls-eyebrow) {
  max-width: 680px;
  color: rgba(255, 255, 255, 0.88);
  font-size: 18px;
  line-height: 1.6;
}

.girls-eyebrow {
  margin: 0 0 8px;
  color: #fff;
  font-size: 13px;
  font-weight: 900;
  letter-spacing: 0;
  text-transform: uppercase;
}

.girls-button,
.girls-buy,
.girls-tab {
  border: 0;
  font-weight: 900;
}

.girls-button {
  min-height: 48px;
  margin-top: 12px;
  padding: 0 20px;
  background: #fff;
  color: var(--pink-ink);
}

.girls-tabs {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin-bottom: 16px;
}

.girls-tab {
  min-height: 40px;
  padding: 0 16px;
  background: var(--pink-soft);
  color: var(--pink-ink);
}

.girls-tab.active {
  background: var(--pink-hot);
  color: #fff;
}

.girls-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 16px;
}

.girls-card {
  display: grid;
  gap: 16px;
  min-height: 380px;
  padding: 22px;
  border: 2px solid rgba(255, 47, 146, 0.22);
  background: linear-gradient(180deg, #fff 0%, #fff0f7 100%);
  box-shadow: 0 18px 46px rgba(255, 47, 146, 0.15);
}

.girls-card-head {
  display: flex;
  justify-content: space-between;
  gap: 12px;
}

.girls-card-head span {
  align-self: flex-start;
  padding: 6px 9px;
  background: var(--pink-hot);
  color: #fff;
  font-size: 12px;
  font-weight: 900;
}

.girls-card-head strong {
  color: var(--pink-hot);
  font-size: 36px;
}

.girls-card h3 {
  color: var(--pink-ink);
  font-size: 25px;
  line-height: 1.12;
}

.girls-card p {
  color: #6f3952;
  line-height: 1.55;
}

.girls-meta {
  display: grid;
  gap: 5px;
  padding: 14px;
  background: rgba(255, 255, 255, 0.65);
}

.girls-meta small {
  color: #9a4770;
  font-weight: 850;
}

.girls-meta b {
  color: var(--pink-ink);
}

.girls-buy {
  align-self: end;
  min-height: 44px;
  background: var(--pink-hot);
  color: #fff;
}

.girls-buy.pending {
  background: #a73c70;
}

.performance-view {
  --perf-ink: #17221d;
  --perf-green: #2c7a58;
  --perf-lime: #b7d76b;
}

.performance-hero {
  display: grid;
  align-items: center;
  min-height: 390px;
  margin-bottom: 18px;
  padding: clamp(28px, 6vw, 62px);
  background:
    linear-gradient(90deg, rgba(244, 248, 239, 0.98) 0%, rgba(244, 248, 239, 0.86) 43%, rgba(23, 34, 29, 0.18) 100%),
    url("assets/hero-performance-legacy.png") center / cover;
  border: 1px solid var(--line);
}

.performance-hero h2 {
  max-width: 960px;
  margin-bottom: 14px;
  color: var(--perf-ink);
  font-size: clamp(34px, 6vw, 72px);
  line-height: 1.02;
}

.performance-hero p:not(.eyebrow) {
  max-width: 820px;
  margin-bottom: 24px;
  color: #56665d;
  font-size: 18px;
  line-height: 1.6;
}

.performance-grid,
.performance-plans {
  display: grid;
  gap: 16px;
  margin-bottom: 18px;
}

.performance-grid {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

.performance-card,
.performance-plan-card {
  border: 1px solid var(--line);
  background: var(--surface);
  box-shadow: 0 8px 28px rgba(20, 20, 20, 0.035);
}

.performance-card {
  min-height: 260px;
  padding: 22px;
}

.performance-card span,
.performance-plan-card span {
  color: var(--perf-green);
  font-size: 13px;
  font-weight: 900;
  text-transform: uppercase;
}

.performance-card h3,
.performance-plan-card h3 {
  margin: 14px 0 10px;
  color: var(--perf-ink);
}

.performance-card h3 {
  font-size: 29px;
}

.performance-card p,
.performance-plan-card p,
.performance-band p {
  color: #5f6d61;
  line-height: 1.6;
}

.performance-band {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 20px;
  align-items: center;
  margin-bottom: 18px;
  padding: 28px;
  background: var(--perf-ink);
  color: #fff;
}

.performance-band h3 {
  max-width: 820px;
  margin-bottom: 10px;
  color: #fff;
  font-size: clamp(26px, 4vw, 46px);
}

.performance-band p {
  max-width: 860px;
  margin-bottom: 0;
  color: rgba(255, 255, 255, 0.72);
}

.performance-band > span {
  display: grid;
  place-items: center;
  min-width: 220px;
  min-height: 82px;
  border: 1px solid rgba(183, 215, 107, 0.52);
  color: var(--perf-lime);
  font-weight: 900;
  text-align: center;
  text-transform: uppercase;
}

.performance-plans {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

.performance-plan-card {
  display: grid;
  min-height: 280px;
  padding: 22px;
}

.performance-plan-card h3 {
  font-size: 26px;
}

.performance-plan-card .primary-button {
  align-self: end;
  background: var(--perf-ink);
}

.health-hero {
  display: grid;
  align-items: center;
  min-height: 340px;
  margin-bottom: 18px;
  padding: clamp(28px, 6vw, 58px);
  background: linear-gradient(120deg, #f7fbf6, #dfeadd);
  border: 1px solid var(--line);
}

.health-hero h2 {
  max-width: 900px;
  margin-bottom: 14px;
  color: #213428;
}

.health-hero p:not(.eyebrow) {
  max-width: 820px;
  color: #5f6d61;
  font-size: 18px;
  line-height: 1.6;
}

.health-paths,
.health-tools,
.health-programs {
  display: grid;
  gap: 16px;
}

.health-paths {
  grid-template-columns: repeat(2, minmax(0, 1fr));
  margin-bottom: 18px;
}

.health-path-card,
.health-tool-card,
.health-program-card {
  border: 1px solid var(--line);
  background: var(--surface);
}

.health-path-card {
  min-height: 280px;
  padding: 26px;
}

.health-path-card span,
.health-program-card span {
  color: #2f7850;
  font-size: 13px;
  font-weight: 900;
  text-transform: uppercase;
}

.health-path-card h3 {
  margin: 12px 0;
  font-size: clamp(28px, 4vw, 46px);
}

.health-path-card p,
.health-path-card strong,
.health-program-card p {
  color: #5f6d61;
  line-height: 1.6;
}

.health-path-card strong {
  display: block;
  margin-top: 16px;
  color: #213428;
}

.health-tools {
  grid-template-columns: repeat(2, minmax(0, 1fr));
  margin-bottom: 18px;
}

.health-tool-card {
  display: grid;
  gap: 18px;
  padding: 22px;
}

.health-result article {
  padding: 16px;
  background: #eef6ed;
}

.health-result span,
.health-result strong {
  display: block;
}

.health-result span {
  color: #5f6d61;
  font-size: 13px;
}

.health-result strong {
  margin: 6px 0;
  color: #2f7850;
  font-size: 34px;
}

.health-result p {
  margin-bottom: 0;
  color: #445247;
  line-height: 1.5;
}

.habit-test {
  display: grid;
  gap: 10px;
}

.habit-option {
  min-height: 44px;
  border: 1px solid var(--line);
  background: #eef6ed;
  color: #213428;
  padding: 0 12px;
  text-align: left;
  font-weight: 850;
}

.habit-result {
  display: none;
  padding: 14px;
  background: #213428;
  color: #fff;
  line-height: 1.5;
}

.habit-result.show {
  display: block;
}

.health-programs {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

.health-program-card {
  display: grid;
  min-height: 300px;
  padding: 22px;
}

.health-program-card h3 {
  margin: 10px 0;
  color: #213428;
  font-size: 25px;
}

.health-program-card > strong {
  color: #2f7850;
}

.health-program-card .primary-button {
  align-self: end;
  background: #213428;
}

.team-hero {
  display: grid;
  align-items: center;
  min-height: 320px;
  margin-bottom: 18px;
  padding: clamp(28px, 6vw, 58px);
  background: linear-gradient(120deg, #171717, #393832);
  color: #fff;
}

.team-hero h2 {
  max-width: 860px;
  margin-bottom: 14px;
  color: #fff;
}

.team-hero p:not(.eyebrow) {
  max-width: 760px;
  color: rgba(255, 255, 255, 0.74);
  font-size: 18px;
  line-height: 1.6;
}

.full-team-grid {
  display: grid;
  gap: 18px;
}

.full-team-card {
  display: grid;
  grid-template-columns: 240px minmax(0, 1fr);
  gap: 0;
  border: 1px solid var(--line);
  background: var(--surface);
  box-shadow: 0 8px 28px rgba(20, 20, 20, 0.035);
}

.team-photo-placeholder {
  display: grid;
  place-items: center;
  min-height: 320px;
  background: linear-gradient(145deg, #151513, #3d392f);
  color: var(--gold);
  font-size: 54px;
  font-weight: 900;
}

.full-team-copy {
  padding: clamp(22px, 4vw, 38px);
}

.full-team-copy span {
  color: var(--gold);
  font-size: 13px;
  font-weight: 900;
  text-transform: uppercase;
}

.full-team-copy h3 {
  margin: 10px 0 14px;
  font-size: clamp(28px, 4vw, 46px);
}

.team-quote {
  max-width: 820px;
  color: #2b2a26;
  font-size: 18px;
  line-height: 1.55;
}

.team-detail {
  max-width: 760px;
  margin-top: 18px;
  padding: 16px;
  background: #f8f7f2;
}

.team-detail strong {
  display: block;
  margin-bottom: 6px;
}

.team-detail p {
  margin-bottom: 0;
  color: var(--muted);
  line-height: 1.55;
}

.team-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  align-items: center;
  margin-top: 18px;
}

.team-badge {
  display: inline-flex;
  padding: 8px 10px;
  background: var(--gold-soft);
  color: #6e581f;
  font-size: 13px;
  font-weight: 900;
  text-transform: uppercase;
}

.team-cta {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 18px;
  align-items: center;
  margin-top: 18px;
  padding: 28px;
  border: 1px solid rgba(184, 154, 85, 0.45);
  background: #151513;
  color: #fff;
}

.team-cta h3 {
  max-width: 860px;
  margin-bottom: 10px;
  color: #fff;
  font-size: clamp(24px, 3vw, 38px);
}

.team-cta p:not(.eyebrow) {
  max-width: 780px;
  margin-bottom: 0;
  color: rgba(255, 255, 255, 0.72);
  line-height: 1.6;
}

.team-cta .primary-button {
  background: var(--gold);
  color: #111;
}

.competitors-view {
  --comp-bg: #10100f;
  --comp-panel: #181815;
  --comp-gold: #d7b865;
  --comp-ink: #f7f4ea;
}

.athletes-page {
  background: #10100f;
}

.athletes-main {
  width: min(1180px, calc(100% - 32px));
  margin: 0 auto;
  padding: 28px 0 56px;
}

.athletes-hero {
  display: grid;
  align-items: end;
  min-height: 470px;
  margin-bottom: 18px;
  padding: clamp(28px, 7vw, 72px);
  background:
    linear-gradient(120deg, rgba(16, 16, 15, 0.96), rgba(16, 16, 15, 0.68)),
    url("assets/hero-team-legacy.png") center / cover;
  color: #fff;
}

.athletes-hero h1 {
  max-width: 880px;
  margin: 0 0 16px;
  color: #fff;
  font-size: clamp(42px, 7vw, 86px);
  line-height: 0.98;
}

.athletes-hero p:not(.competitors-eyebrow) {
  max-width: 760px;
  color: rgba(247, 244, 234, 0.78);
  font-size: 19px;
  line-height: 1.6;
}

.athletes-back {
  display: inline-flex;
  margin-top: 18px;
  min-height: 44px;
  align-items: center;
  padding: 0 16px;
  background: var(--gold);
  color: #111;
  font-weight: 900;
  text-decoration: none;
}

.athletes-plans {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 16px;
  margin-bottom: 18px;
}

.athletes-promise {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 220px;
  gap: 20px;
  align-items: center;
  margin-bottom: 18px;
  padding: clamp(24px, 5vw, 44px);
  border: 1px solid rgba(215, 184, 101, 0.55);
  background: linear-gradient(120deg, #1a1915, #10100f);
  color: #fff;
}

.athletes-promise h2 {
  max-width: 840px;
  margin-bottom: 12px;
  color: #fff;
  font-size: clamp(30px, 5vw, 58px);
}

.athletes-promise p:not(.competitors-eyebrow) {
  max-width: 880px;
  margin-bottom: 0;
  color: rgba(247, 244, 234, 0.74);
  font-size: 18px;
  line-height: 1.65;
}

.promise-stamp {
  display: grid;
  place-items: center;
  min-height: 170px;
  border: 1px solid rgba(215, 184, 101, 0.55);
  text-align: center;
}

.promise-stamp strong,
.promise-stamp span {
  display: block;
}

.promise-stamp strong {
  color: var(--gold);
  font-size: 28px;
  line-height: 1.05;
}

.promise-stamp span {
  color: rgba(247, 244, 234, 0.68);
  font-size: 13px;
  font-weight: 900;
  text-transform: uppercase;
}

.athletes-difference {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 14px;
  margin-bottom: 18px;
}

.athletes-difference article {
  min-height: 210px;
  padding: 20px;
  border: 1px solid #2d2c28;
  background: #181815;
  color: #fff;
}

.athletes-difference span {
  color: var(--gold);
  font-weight: 900;
}

.athletes-difference strong {
  display: block;
  margin: 14px 0 10px;
  font-size: 22px;
  line-height: 1.15;
}

.athletes-difference p {
  margin-bottom: 0;
  color: rgba(247, 244, 234, 0.68);
  line-height: 1.5;
}

.athletes-band,
.athletes-includes {
  margin-bottom: 18px;
}

.competitors-hero {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(280px, 0.35fr);
  gap: 24px;
  align-items: end;
  min-height: 360px;
  margin-bottom: 18px;
  padding: clamp(28px, 6vw, 64px);
  background:
    linear-gradient(120deg, rgba(16, 16, 15, 0.96), rgba(16, 16, 15, 0.72)),
    linear-gradient(180deg, #4a4b46, #111);
  color: var(--comp-ink);
}

.competitors-hero h2 {
  max-width: 780px;
  margin-bottom: 16px;
  color: #fff;
  font-size: clamp(36px, 6vw, 76px);
}

.competitors-hero p:not(.competitors-eyebrow) {
  max-width: 680px;
  color: rgba(247, 244, 234, 0.78);
  font-size: 18px;
  line-height: 1.6;
}

.competitors-eyebrow {
  margin: 0 0 8px;
  color: var(--comp-gold);
  font-size: 13px;
  font-weight: 900;
  letter-spacing: 0;
  text-transform: uppercase;
}

.competitors-kpis {
  display: grid;
  gap: 10px;
}

.competitors-kpis span {
  min-height: 42px;
  padding: 11px 14px;
  border: 1px solid rgba(215, 184, 101, 0.35);
  background: rgba(255, 255, 255, 0.06);
  color: var(--comp-gold);
  font-weight: 900;
}

.competitors-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 16px;
  margin-bottom: 18px;
}

.competitor-card {
  display: grid;
  gap: 18px;
  min-height: 430px;
  padding: 24px;
  border: 1px solid #2d2c28;
  background: var(--comp-panel);
  color: var(--comp-ink);
  box-shadow: 0 18px 46px rgba(0, 0, 0, 0.18);
}

.competitor-card.featured {
  border-color: rgba(215, 184, 101, 0.72);
  background: linear-gradient(180deg, #222018 0%, #151513 100%);
}

.competitor-label {
  justify-self: start;
  padding: 7px 10px;
  background: rgba(215, 184, 101, 0.18);
  color: var(--comp-gold);
  font-size: 12px;
  font-weight: 900;
  text-transform: uppercase;
}

.competitor-card h3 {
  color: #fff;
  font-size: 28px;
  line-height: 1.12;
}

.competitor-card p {
  color: rgba(247, 244, 234, 0.7);
  line-height: 1.55;
}

.competitor-price strong,
.competitor-price span {
  display: block;
}

.competitor-price strong {
  color: var(--comp-gold);
  font-size: 44px;
}

.competitor-price span {
  color: rgba(247, 244, 234, 0.62);
}

.competitor-card ul {
  display: grid;
  gap: 9px;
  padding: 0;
  margin: 0;
  list-style: none;
}

.competitor-card li {
  border-bottom: 1px solid rgba(255, 255, 255, 0.09);
  padding-bottom: 8px;
  color: rgba(247, 244, 234, 0.86);
}

.competitor-buy {
  align-self: end;
  min-height: 46px;
  border: 0;
  background: var(--comp-gold);
  color: #111;
  font-weight: 900;
}

.competitor-buy.pending {
  background: #827146;
}

.elite-contact-band {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 20px;
  align-items: center;
  margin-bottom: 18px;
  padding: 28px;
  background: #111;
  color: #fff;
  border: 1px solid rgba(215, 184, 101, 0.55);
}

.elite-contact-band h3 {
  max-width: 820px;
  margin-bottom: 10px;
  color: #fff;
  font-size: clamp(24px, 3vw, 38px);
}

.elite-contact-band p:not(.competitors-eyebrow) {
  max-width: 880px;
  margin-bottom: 0;
  color: rgba(247, 244, 234, 0.72);
  line-height: 1.6;
}

.elite-contact-band > span {
  display: grid;
  place-items: center;
  min-width: 160px;
  min-height: 82px;
  border: 1px solid rgba(215, 184, 101, 0.55);
  color: var(--comp-gold);
  font-weight: 900;
  text-transform: uppercase;
}

.competitors-includes {
  padding: 22px;
  border: 1px solid var(--line);
  background: var(--surface);
}

.includes-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 12px;
}

.includes-grid div {
  min-height: 128px;
  padding: 16px;
  background: #f8f7f2;
}

.includes-grid strong,
.includes-grid small {
  display: block;
}

.includes-grid small {
  margin-top: 8px;
  color: var(--muted);
  line-height: 1.45;
}

.shop-card-top {
  display: flex;
  justify-content: space-between;
  gap: 12px;
}

.shop-card .tag {
  display: inline-flex;
  align-self: flex-start;
  padding: 6px 9px;
  background: var(--gold-soft);
  color: #6e581f;
  font-size: 12px;
  font-weight: 800;
}

.shop-card h3 {
  font-size: 22px;
  line-height: 1.18;
}

.shop-card p {
  color: var(--muted);
  line-height: 1.55;
}

.price {
  display: block;
  font-size: 38px;
  font-weight: 850;
}

.shop-meta {
  display: grid;
  gap: 8px;
  padding: 0;
  margin: 0;
  color: #2d2d2a;
  list-style: none;
}

.shop-meta li {
  display: flex;
  justify-content: space-between;
  gap: 12px;
  border-bottom: 1px solid var(--line);
  padding-bottom: 8px;
}

.shop-meta span {
  color: var(--muted);
}

.buy-button {
  align-self: end;
  border: 0;
  min-height: 44px;
  background: var(--ink);
  color: #fff;
  font-weight: 800;
}

.buy-button.pending {
  background: var(--titanium);
}

.exercise-section {
  margin-top: 24px;
  padding: 22px;
  border: 1px solid var(--line);
  background: var(--surface);
}

.muscle-toolbar {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-bottom: 16px;
}

.muscle-button {
  min-height: 38px;
  border: 1px solid var(--line);
  background: #fbfbf8;
  color: var(--ink);
  padding: 0 12px;
  font-weight: 750;
}

.muscle-button.active {
  border-color: var(--gold);
  background: var(--gold-soft);
  color: #5e4818;
}

.exercise-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 12px;
}

.exercise-card {
  display: grid;
  gap: 12px;
  min-height: 156px;
  padding: 16px;
  border: 1px solid var(--line);
  background: #fbfbf8;
}

.exercise-card strong,
.exercise-card small {
  display: block;
}

.exercise-card small {
  color: var(--muted);
}

.video-frame {
  position: relative;
  overflow: hidden;
  min-height: 140px;
  background: #111;
}

.video-frame video {
  display: none;
  width: 100%;
  height: 180px;
  background: #111;
  object-fit: cover;
}

.video-frame.has-video video {
  display: block;
}

.video-frame.has-video .video-slot {
  display: none;
}

.video-slot {
  display: grid;
  place-items: center;
  min-height: 140px;
  border: 1px dashed #c8c2b3;
  background: #f3f0e8;
  color: #75623b;
  font-size: 13px;
  font-weight: 800;
  text-align: center;
}

.client-list {
  display: grid;
  gap: 12px;
}

.client {
  display: grid;
  grid-template-columns: 1fr auto;
  gap: 12px;
  padding: 16px;
  border: 1px solid var(--line);
  background: #fbfbf8;
}

.client strong,
.client small {
  display: block;
}

.client small {
  color: var(--muted);
}

.status {
  align-self: start;
  padding: 6px 8px;
  font-size: 12px;
  font-weight: 800;
}

.status.ok {
  background: #dceadf;
  color: var(--success);
}

.status.warn {
  background: #f4e1d1;
  color: var(--warn);
}

.coach-detail textarea {
  min-height: 240px;
  margin-bottom: 14px;
}

@media (max-width: 1080px) {
  .app-shell {
    grid-template-columns: 92px minmax(0, 1fr);
  }

  .brand div:last-child,
  .nav-button span:last-child,
  .coach-card {
    display: none;
  }

  .nav-button {
    grid-template-columns: 1fr;
    min-height: 44px;
    padding: 0;
  }

  .hero-panel,
  .content-grid,
  .coach-layout,
  .os-hero,
  .manifesto-band,
  .assessment-entry,
  .free-hero,
  .macro-section,
  .user-panel-hero,
  .admin-hero,
  .admin-ops-grid,
  .bootstrap-panel {
    grid-template-columns: 1fr;
  }

  .team-cta {
    grid-template-columns: 1fr;
  }

  .dashboard-partner {
    grid-template-columns: auto minmax(0, 1fr);
  }

  .dashboard-partner a {
    grid-column: 1 / -1;
  }

  .elite-contact-band {
    grid-template-columns: 1fr;
  }

  .performance-band {
    grid-template-columns: 1fr;
  }

  .metrics-grid,
  .brand-system,
  .how-flow-grid,
  .resource-hub-grid,
  .home-routes,
  .why-grid,
  .proof-cards,
  .plan-ladder-grid,
  .user-panel-grid,
  .panel-history-grid,
  .coach-command-grid,
  .admin-grid,
  .photo-compare-grid,
  .notification-list,
  .onboarding-grid,
  .crm-layout,
  .crm-detail,
  .faq-grid,
  .library-grid,
  .shop-grid,
  .girls-grid,
  .performance-grid,
  .performance-plans,
  .competitors-grid,
  .athletes-plans,
  .athletes-difference,
  .includes-grid,
  .os-grid,
  .lab-grid,
  .copilot-grid,
  .path-grid,
  .method-steps,
  .coaching-grid,
  .team-grid,
  .calendar-grid,
  .free-grid,
  .supplement-grid,
  .health-paths,
  .health-tools,
  .health-programs,
  .exercise-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .competitors-hero {
    grid-template-columns: 1fr;
  }

  .athletes-promise {
    grid-template-columns: 1fr;
  }

  .full-team-card {
    grid-template-columns: 180px minmax(0, 1fr);
  }

  .proof-grid {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 720px) {
  .app-shell {
    display: block;
  }

  .sidebar {
    position: static;
    height: auto;
    min-height: 0;
    padding: 14px;
  }

  .brand div:last-child {
    display: block;
  }

  .nav {
    display: flex;
    overflow-x: auto;
    overflow-y: hidden;
    padding-bottom: 4px;
    padding-right: 0;
  }

  .nav-button {
    flex: 0 0 auto;
    grid-template-columns: 30px auto;
    gap: 4px;
    padding: 0 12px;
    min-height: 48px;
  }

  .nav-button span:last-child {
    display: inline;
    white-space: nowrap;
    font-size: 12px;
    font-weight: 800;
  }

  .full-team-card {
    grid-template-columns: 1fr;
  }

  .team-photo-placeholder {
    min-height: 180px;
  }

  .main {
    padding: 16px;
  }

  .topbar {
    align-items: flex-start;
    flex-direction: column;
  }

  .topbar-actions,
  .topbar-actions .primary-button,
  .topbar-actions .secondary-button,
  .bootstrap-actions .primary-button,
  .bootstrap-actions .secondary-button {
    width: 100%;
  }

  .hero-panel img {
    min-height: 260px;
  }

  .hero-copy {
    padding: 24px;
    min-height: auto;
    background: linear-gradient(180deg, rgba(248, 247, 242, 0.96), rgba(248, 247, 242, 0.86));
  }

  .hero-actions,
  .assessment-entry .primary-button {
    width: 100%;
  }

  .hero-actions .primary-button,
  .hero-actions .secondary-button,
  .start-steps-actions .primary-button,
  .start-steps-actions .secondary-button {
    flex: 1 1 100%;
  }

  .metrics-grid,
  .brand-system,
  .how-flow-grid,
  .resource-hub-grid,
  .home-routes,
  .why-grid,
  .proof-cards,
  .plan-ladder-grid,
  .user-panel-grid,
  .panel-history-grid,
  .coach-command-grid,
  .admin-grid,
  .photo-compare-grid,
  .notification-list,
  .onboarding-grid,
  .crm-layout,
  .crm-detail,
  .faq-grid,
  .form-grid,
  .library-grid,
  .shop-grid,
  .girls-grid,
  .performance-grid,
  .performance-plans,
  .competitors-grid,
  .athletes-plans,
  .athletes-difference,
  .includes-grid,
  .os-grid,
  .lab-grid,
  .copilot-grid,
  .path-grid,
  .method-steps,
  .coaching-grid,
  .team-grid,
  .calendar-grid,
  .free-grid,
  .supplement-grid,
  .macro-result,
  .health-paths,
  .health-tools,
  .health-programs,
  .exercise-grid {
    grid-template-columns: 1fr;
  }

  label:has(textarea) {
    grid-column: span 1;
  }

  .panel-heading {
    display: block;
  }

  .dashboard-partner {
    grid-template-columns: 1fr;
  }

  .lifepro-mark,
  .partner-mark {
    justify-self: start;
  }

  .partner-coupon {
    grid-template-columns: 1fr;
    width: 100%;
  }
}