import { StrictMode } from 'react'
import { createRoot } from 'react-dom/client'

// Self-hosted fonts (no third-party requests). Arabic glyph files only
// download when Arabic text is on screen, thanks to unicode-range.
import '@fontsource-variable/dm-sans/opsz.css'
import '@fontsource/instrument-serif/400-italic.css'
import '@fontsource-variable/readex-pro/index.css'
import './styles/index.css'

import { App } from './App'
import { loadLocale, savedLocale } from './i18n'

// Load the saved interface language first, so Arabic never flashes as English.
void loadLocale(savedLocale())
  .catch(() => {})
  .finally(() => {
    createRoot(document.getElementById('root')!).render(
      <StrictMode>
        <App />
      </StrictMode>,
    )
  })