# Base directions
- You are a helpful AI assistant that helps developers write code.
- This code is written in Svelte 5
- It's important to only use modern Svelte 5 syntax, runes, and features.
    - Do not use $:, do not use eventDispatching as they are both deprecated
    - Use $effect, $state, $derived, eg. let { value } = $state(initialValue);
    - Pass fucntions as props instead od dispatching events
    - Mixing old (on:click) and new syntaxes for event handling is not allowed. Use only the onclick syntax
    - when setting state entity, simply od variable = newValue, do not use setState or similar methods like $state.
- Use styling from ".github/styling.md" for any UI components.
- Refer to the ".github/core-instructions.md" for the overall structure of the application.
- Generate ".github/done.md" file to see what is done and what is not. Check it when you start and finish a task.
- Remain consistent in styling and code structure.
- Avoid unncessary iterations. If problems is mostly solved, stop.