#modiono-exercise-catalog {
  --mdn-bg: #0A0F1C;
  --mdn-card: #121A2E;
  --mdn-border: rgba(91,143,255,0.16);
  --mdn-primary: #1DF5A4;
  --mdn-secondary: #5B8FFF;
  --mdn-highlight: #FF2D85;
  --mdn-tertiary: #A78BFA;
  --mdn-text: #FFFFFF;
  --mdn-text-dim: rgba(255,255,255,0.62);
  --mdn-text-faint: rgba(255,255,255,0.38);
  font-family: 'Oswald', sans-serif;
  background: var(--mdn-bg);
  color: var(--mdn-text);
  padding: 48px 24px 80px;
  box-sizing: border-box;
  letter-spacing: 0.5px;
  line-height: 1.5em;
}
#modiono-exercise-catalog *, #modiono-exercise-catalog *::before, #modiono-exercise-catalog *::after {
  box-sizing: border-box;
}

.mdn-header { max-width: 1200px; margin: 0 auto 36px; text-align: center; }
.mdn-eyebrow {
  display: inline-block; font-size: 12px; letter-spacing: 3px; text-transform: uppercase;
  color: var(--mdn-primary); font-weight: 600; margin-bottom: 12px;
}
.mdn-header h1 { font-size: clamp(28px, 4vw, 44px); font-weight: 700; letter-spacing: -0.5px; margin: 0 0 12px; }
.mdn-header p {
  color: var(--mdn-text-dim); font-size: 16px; max-width: 620px; margin: 0 auto; line-height: 1.6;
  font-family: 'Inter', -apple-system, sans-serif;
}

.mdn-controls {
  max-width: 1200px; margin: 0 auto 32px; display: flex; gap: 12px; flex-wrap: wrap;
  position: sticky; top: 0; z-index: 20; background: var(--mdn-bg); padding: 16px 0;
}
.mdn-search { flex: 1 1 260px; position: relative; }
.mdn-search input {
  width: 100%; padding: 12px 16px 12px 40px; background: rgba(91,143,255,0.06);
  border: 1px solid var(--mdn-border); border-radius: 10px; color: var(--mdn-text);
  font-family: 'Oswald', sans-serif; font-size: 14px; letter-spacing: 0.3px;
}
.mdn-search input::placeholder { color: var(--mdn-text-faint); }
.mdn-search input:focus { outline: none; border-color: var(--mdn-secondary); box-shadow: 0 0 0 3px rgba(91,143,255,0.15); }
.mdn-search svg { position: absolute; left: 13px; top: 50%; transform: translateY(-50%); opacity: 0.4; }

.mdn-filter-group { display: flex; gap: 8px; flex-wrap: wrap; }
.mdn-filter-btn {
  padding: 11px 18px; border-radius: 10px; border: 1px solid var(--mdn-border);
  background: rgba(91,143,255,0.06); color: var(--mdn-text-dim); font-family: 'Oswald', sans-serif;
  font-size: 13px; letter-spacing: 0.5px; text-transform: uppercase; cursor: pointer; transition: all 0.15s;
}
.mdn-filter-btn:hover { border-color: var(--mdn-secondary); color: var(--mdn-text); }
.mdn-filter-btn.active { background: var(--mdn-primary); border-color: var(--mdn-primary); color: #0A0F1C; font-weight: 600; }

.mdn-grid { max-width: 1200px; margin: 0 auto; display: grid; grid-template-columns: repeat(3, 1fr); gap: 24px; }
@media (max-width: 980px) { .mdn-grid { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 640px) { .mdn-grid { grid-template-columns: 1fr; } .mdn-controls { position: static; } }

.mdn-card {
  background: var(--mdn-card); border: 1px solid var(--mdn-border); border-radius: 14px;
  overflow: hidden; display: flex; flex-direction: column; transition: border-color 0.2s, transform 0.2s;
}
.mdn-card:hover { border-color: var(--mdn-secondary); transform: translateY(-3px); }

.mdn-card-video { position: relative; width: 100%; aspect-ratio: 16 / 9; background: #05070E; overflow: hidden; }
.mdn-card-video video, .mdn-card-video img { width: 100%; height: 100%; object-fit: cover; display: block; }
.mdn-camera-tag {
  position: absolute; top: 10px; right: 10px; background: rgba(10,15,28,0.75);
  border: 1px solid var(--mdn-border); border-radius: 6px; padding: 4px 8px; font-size: 10px;
  letter-spacing: 1px; text-transform: uppercase; color: var(--mdn-text-dim); backdrop-filter: blur(4px);
}

.mdn-card-body { padding: 18px 20px 20px; display: flex; flex-direction: column; gap: 10px; flex: 1; }
.mdn-card-top-row { display: flex; align-items: center; justify-content: space-between; gap: 8px; }
.mdn-card-type { font-size: 11px; letter-spacing: 1.5px; text-transform: uppercase; font-weight: 600; }
.mdn-card-type.dynamic { color: var(--mdn-primary); }
.mdn-card-type.static { color: var(--mdn-secondary); }
.mdn-card-type.staticmobility { color: var(--mdn-tertiary); }
.mdn-card-type.other { color: var(--mdn-text-faint); }

.mdn-tier-pill {
  font-family: 'Oswald', sans-serif; font-size: 10px; font-weight: 700; letter-spacing: 1px;
  text-transform: uppercase; padding: 4px 10px; border-radius: 20px; white-space: nowrap;
}
.mdn-tier-pill.free { background: rgba(29,245,164,0.12); border: 1px solid rgba(29,245,164,0.4); color: var(--mdn-primary); }
.mdn-tier-pill.paid { background: rgba(240,255,60,0.12); border: 1px solid rgba(240,255,60,0.4); color: #F0FF3C; }

.mdn-card-title { font-size: 20px; font-weight: 600; margin: 0; letter-spacing: -0.2px; }
.mdn-card-desc { font-family: 'Inter', -apple-system, sans-serif; font-size: 13.5px; line-height: 1.55; color: var(--mdn-text-dim); margin: 0; }

.mdn-movements-label { font-size: 11px; letter-spacing: 1.5px; text-transform: uppercase; color: var(--mdn-text-faint); margin-top: 6px; font-weight: 600; }
.mdn-movements-list { display: flex; flex-wrap: wrap; gap: 6px; }
.mdn-movement-chip {
  font-family: 'Inter', -apple-system, sans-serif; font-size: 11.5px; padding: 5px 10px;
  border-radius: 20px; background: rgba(255,45,133,0.1); border: 1px solid rgba(255,45,133,0.25); color: #FF7FB3;
}
.mdn-movements-pending { font-family: 'Inter', -apple-system, sans-serif; font-size: 12px; color: var(--mdn-text-faint); font-style: italic; }

.mdn-empty { max-width: 1200px; margin: 60px auto; text-align: center; color: var(--mdn-text-faint); font-family: 'Inter', -apple-system, sans-serif; }