wavesforthemasses carichissimo .cursorrules file for Svelte

Before you deal with the request, you should check if there is a package.json file in the root of the project.
If there is one, read it and check what kind of framework is used. And all the other modules installed.
Usually I use SvelteKit, but if you see a different framework, you should use that framework's rules.

When you are asked to design something, you should always design it using this guidelines:
1. Good design is as little design as possible. It means focus on essentials features and make them better and useful for the user. It also means less colors, words and clutters on the screen. What you need to keep in mind is the key functionality or the main selling point of the website. It will be provided to you in the prompt or in this file. After that, design as little as possible, don't over complicate things.
2. Use the law of similarity and proximity to group elements together. Use shapes, sizes and colors to guide the user's eyes through the page. In simple words, the design should be scannable by the user in seconds.
3. Spacing is important and it's better to have a good spacing between elements than nothing.
4. Use a design system for the colors, fonts, spacing, etc. You can find it in design.css. You should rarely change it, unless requested. And when coding other files, you must use the variables as much as possible. 
5. When using colors be sure to use the variables for colors in a way that is easy to read for the user.
6. When possible, avoid text align center, especially for paragraphs and small texts.
7. Line height should be inversely proportional to the font size: smaller font size, bigger line height.
8. When designing something new, try to first understand if its css should be in the app.css or in the component's css. If it's important for many components, it should be in the app.css. You must be consistent with this.
9. Web design is just about putting the right elements in the right place with the right color, font, size and spacing.
10. Hierarchy is important. You should guide the user's eyes through the page by using the right color, size/spacing and weight. To do this, ask yourself what is the first thing the user should see or read? And do it. Sometimes, to emphasize something, you should de-emphasize other competing elements. All depends on the context.
11. Good design is less design. But there are few exceptions. Introduce depth to elevate important elements by using shadows, gradients, etc. The most something looks closer to the user, the more it'll be noticed. 
12. Use the accent color to highlight important elements.
13. One way to add a bit of excitement is to use a soft gradient instead of a solid color.
14. When you need a table make it simple and readable. But also engaging in a modern way.
15. Try using cards for bland elements.
16. Read the .inspiration file to get more ideas.

Design.css:
/* Import Google Fonts */
@import url('https://....');

/* Font Variables */
:root {
  --font-heading: ...;
  --font-body: ...;
  --primaryH: ...;
  --primaryS: ...;
  --primaryL: ...;
  --primaryHSL: var(--primaryH), var(--primaryS), var(--primaryL);
  --primary: hsl(var(--primaryHSL));
  --secondaryH: ...;
  --secondaryS: ...;
  --secondaryL: ...;
  --secondaryHSL: var(--secondaryH), var(--secondaryS), var(--secondaryL);
  --secondary: hsl(var(--secondaryHSL));
  --whiteH: ...;
  --whiteS: ...;
  --whiteL: ...;
  --whiteHSL: var(--whiteH), var(--whiteS), var(--whiteL);
  --white: hsl(var(--whiteHSL));
  --blackH: ...;
  --blackS: ...;
  --blackL: ...;
  --blackHSL: var(--blackH), var(--blackS), var(--blackL);
  --black: hsl(var(--blackHSL));

  /* Reverse colors */
  --primary-reverse: var(--white);
  --secondary-reverse: var(--white);
  --white-reverse: var(--black);
  --black-reverse: var(--white);

  /* Colors - Extended Palette */
  --primary-lightest: hsl(var(--primaryH), var(--primaryS), calc(var(--primaryL) + 30%));
  --primary-lighter: hsl(var(--primaryH), var(--primaryS), calc(var(--primaryL) + 20%));
  --primary-light: hsl(var(--primaryH), var(--primaryS), calc(var(--primaryL) + 10%));
  --primary-dark: hsl(var(--primaryH), var(--primaryS), calc(var(--primaryL) - 10%));
  --primary-darker: hsl(var(--primaryH), var(--primaryS), calc(var(--primaryL) - 20%));
  --primary-darkest: hsl(var(--primaryH), var(--primaryS), calc(var(--primaryL) - 30%));

  --secondary-lightest: hsl(var(--secondaryH), var(--secondaryS), calc(var(--secondaryL) + 30%));
  --secondary-lighter: hsl(var(--secondaryH), var(--secondaryS), calc(var(--secondaryL) + 20%));
  --secondary-light: hsl(var(--secondaryH), var(--secondaryS), calc(var(--secondaryL) + 10%));
  --secondary-dark: hsl(var(--secondaryH), var(--secondaryS), calc(var(--secondaryL) - 10%));
  --secondary-darker: hsl(var(--secondaryH), var(--secondaryS), calc(var(--secondaryL) - 20%));
  --secondary-darkest: hsl(var(--secondaryH), var(--secondaryS), calc(var(--secondaryL) - 30%));

  /* Reverse colors */
  --primaryHSL-reverse: var(--whiteHSL);
  --primary-reverse: var(--white);
  --secondaryHSL-reverse: var(--whiteHSL);
  --secondary-reverse: var(--white);
  --whiteHSL-reverse: var(--blackHSL);
  --white-reverse: var(--black);
  --blackHSL-reverse: var(--whiteHSL);
  --black-reverse: var(--white);

  /* Gray Scale */
  --gray-100: #F5F5F5;
  --gray-200: #E5E5E5;
  --gray-300: #D4D4D4;
  --gray-400: #A3A3A3;
  --gray-500: #737373;
  --gray-600: #525252;
  --gray-700: #404040;
  --gray-800: #262626;
  --gray-900: #171717;

  /* Reverse Gray Scale */
  --gray-100-reverse: var(--gray-500);
  --gray-200-reverse: var(--gray-600);
  --gray-300-reverse: var(--gray-700);
  --gray-400-reverse: var(--gray-800);
  --gray-500-reverse: var(--gray-900);
  --gray-600-reverse: var(--gray-400);
  --gray-700-reverse: var(--gray-300);
  --gray-800-reverse: var(--gray-200);
  --gray-900-reverse: var(--gray-100);

  /* Typography Scale */
  --text-xs: 0.75rem;    /* 12px */
  --text-sm: 0.875rem;   /* 14px */
  --text-base: 1rem;     /* 16px */
  --text-lg: 1.125rem;   /* 18px */
  --text-xl: 1.25rem;    /* 20px */
  --text-2xl: 1.5rem;    /* 24px */
  --text-3xl: 1.875rem;  /* 30px */
  --text-4xl: 2.25rem;   /* 36px */
  --text-5xl: 3rem;      /* 48px */
  --text-6xl: 3.75rem;   /* 60px */

  /* Line Height Scale it's inversely proportional to the font size */
  --leading-6xl: 1.2;
  --leading-5xl: 1.22;
  --leading-4xl: 1.25;
  --leading-3xl: 1.3;
  --leading-2xl: 1.36;
  --leading-xl: 1.45;
  --leading-lg: 1.5;
  --leading-md: 1.55;
  --leading-sm: 1.57;
  --leading-xs: 1.6;

  /* Spacing Scale */
  --space-1: 0.25rem;    /* 4px */
  --space-2: 0.5rem;     /* 8px */
  --space-3: 0.75rem;    /* 12px */
  --space-4: 1rem;       /* 16px */
  --space-6: 1.5rem;     /* 24px */
  --space-8: 2rem;       /* 32px */
  --space-12: 3rem;      /* 48px */
  --space-16: 4rem;      /* 64px */
  --space-24: 6rem;      /* 96px */
  --space-32: 8rem;      /* 128px */

  /* Border Radius */
  --radius-sm: 0.125rem;  /* 2px */
  --radius-md: 0.375rem;  /* 6px */
  --radius-lg: 0.5rem;    /* 8px */
  --radius-xl: 1rem;      /* 16px */
  --radius-2xl: 2rem;     /* 32px */
  --radius-full: 9999px;

  /* Shadows */
  --shadow-sm: 0 1px 2px 0 rgba(0, 0, 0, 0.05);
  --shadow-md: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06);
  --shadow-lg: 0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -2px rgba(0, 0, 0, 0.05);
  --shadow-xl: 0 20px 25px -5px rgba(0, 0, 0, 0.1), 0 10px 10px -5px rgba(0, 0, 0, 0.04);

  /* Transitions */
  --transition-fast: 150ms;
  --transition-normal: 300ms;
  --transition-slow: 500ms;
  --ease-in-out: cubic-bezier(0.4, 0, 0.2, 1);
  --ease-out: cubic-bezier(0, 0, 0.2, 1);
  --ease-in: cubic-bezier(0.4, 0, 1, 1);

  /* Z-index */
  --z-0: 0;
  --z-10: 10;
  --z-20: 20;
  --z-30: 30;
  --z-40: 40;
  --z-50: 50;
  --z-auto: auto;

  /* Container Max Widths */
  --container-sm: 640px;
  --container-md: 768px;
  --container-lg: 1024px;
  --container-xl: 1280px;
}

Nice designs that you should look at by searching on google:
https://collectifdiapason.com/
https://www.louxibiza.com/
https://www.airbnb.it/
https://www.paypal.com/it/home
https://www.notion.com/
https://www.duolingo.com/
https://owltastic.com/
https://www.jasper.ai/