import test from 'node:test'
import assert from 'node:assert/strict'
import { readFile } from 'node:fs/promises'

const css = await readFile(new URL('../src/index.css', import.meta.url), 'utf8')

test('defines a centered 800 by 480 KiddOs screen frame', () => {
  assert.match(css, /\.kiddos-stage\s*\{[^}]*place-items:\s*center/s)
  assert.match(css, /\.kiddos-screen\s*\{[^}]*width:\s*800px/s)
  assert.match(css, /\.kiddos-screen\s*\{[^}]*height:\s*480px/s)
  assert.match(css, /\.kiddos-screen\s*\{[^}]*border:/s)
})

test('uses the full physical display without a desktop frame at 800 by 480', () => {
  assert.match(css, /@media\s*\(max-width:\s*800px\),\s*\(max-height:\s*480px\)/s)
  assert.match(css, /\.kiddos-screen\s*\{[^}]*width:\s*100vw/s)
  assert.match(css, /\.kiddos-screen\s*\{[^}]*height:\s*100vh/s)
})