HAVE FUN TEACHING - FAVICON

The favicon is a tab-optimised version of the pinwheel: same shapes and colours,
with the gloss highlights removed and the navy outline + white sticker edge
thickened so it stays crisp at 16px and pops on both light AND dark browser tabs.

EASIEST (WordPress):
  Appearance > Customize > Site Identity > Site Icon
  Upload: android-chrome-512x512.png  (WordPress makes the small sizes itself)
  Note: WordPress downsizes that file, so tiny tabs show the regular pinwheel.
  For the sharpest tab icon use the manual method below.

MANUAL (upload all files in this folder to the site root, then put this in <head>):

  <link rel="icon" href="/favicon.ico" sizes="any">
  <link rel="icon" href="/favicon.svg" type="image/svg+xml">
  <link rel="icon" type="image/png" sizes="32x32" href="/favicon-32x32.png">
  <link rel="icon" type="image/png" sizes="16x16" href="/favicon-16x16.png">
  <link rel="apple-touch-icon" sizes="180x180" href="/apple-touch-icon.png">
  <link rel="manifest" href="/site.webmanifest">
  <meta name="theme-color" content="#1C437D">

FILES
  favicon.ico                 16/32/48/64/128/256 in one file (all browsers)
  favicon.svg                 scalable tab icon (modern browsers)
  favicon-16x16 / 32x32 / 48x48.png
  apple-touch-icon.png        180x180, white background (iPhone/iPad home screen)
  android-chrome-192 / 512    Android home screen / PWA
  maskable-icon-512x512.png   Android adaptive icon (extra safe-zone padding)
  site.webmanifest
