**CSS**
- Pseudo Selectors (:hover, :focus, ...)
- Font Management
---
روزی روزگاری، در سرزمین پریان، دانشجویی به نام پمبه زندگی می‌کرد!
یک روز که پمبه درحال چک‌کردن ایمیل‌هایش بود، متوجه شد که شرکت Mockstar ایمیلی به او ارسال کرده است
و در آن از او خواسته‌اند که برای مصاحبه به آنجا برود.
امروز، روز مصاحبه است اما پمبه از شدت هیجان، قادر به حل سوال نیست؛ بنابراین از شما می‌خواهد به او کمک کنید.
## توضیحات سوال
<details class="green">
<summary>تصویر خروجی نمونه</summary>
</details>
## پروژه اولیه
پروژه اولیه را از [این لینک](https://quera.ir/contest/assignments/41564/download_problem_initial_project/139929) دانلود کنید.
<details class="blue">
<summary>ساختار فایل‌ها</summary>
```
initial-project-01.zip
├── dynamic.css
├── index.html
└── static.css
```
</details>
<details class="pink">
<summary>راه‌اندازی پروژه</summary>
+ ابتدا پروژۀ اولیه را دانلود و از حالت فشرده خارج کنید.
+ سپس فایل `index.html` را در مرورگر خود باز کنید.
</details>
## خواسته‌های مسئله
| مقدار | ویژگی | وضعیت | المان |
| :--------------------------------: | :----------: | :---: | :---: |
| `Merienda` | فونت | \- | html |
| `--color--body-background` | رنگ پس‌زمینه | \- | body |
| `--color--body-foreground` | رنگ | \- | body |
| وسط صفحه | موقعیت | \- | h1 |
| `4.8rem` | اندازه فونت | \- | h1 |
| `transparent` | رنگ | \- | .heart |
| `--color--heart-foreground--hover` | رنگ | hover | .heart |
## نکات
- شما تنها مجاز به تغییر در فایل `dynamic.css` هستید. تغییرات در باقی فایل‌ها نادیده گرفته می‌شود.
- توجه کنید که داوری خودکار بر مبنای ساختار فایل `index.html` انجام می‌شود.
- برای ثبت پاسخ، پروژه را با ساختار زیر ارسال کنید.
```
[your-zip-file-name].zip
└── dynamic.css
```