# 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 $props instead of "export let"!
- 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.
- Split big components into subcomponents. Always create smaller subcomponents for better context management later.
- Do not do what you're not being asked. Stick to scope of my request.
- Do not edit stores.ts ! Unless is explicitly allow you to.
- Focus only on files that are relevant. Do not venture to fix other things.