# Sito bg-perspective.it, fase 2: video tutorial, famiglia, pagine per meccanica e categoria

Data: 2026-09-14. Approvato da Paolo sulle anteprime `_instagram/sito-concept/F-post-v2.html`
(scheda) e `G-meccanica.html` (pagina per meccanica). Stato: **specifica approvata, da pianificare
e implementare.**

## Dati

Due colonne nuove in `giochi` (Turso `bg-perspective`, `sito/schema.sql`):
- `video text`: json `[{"url","id","titolo","autore"}]`, solo i video del portale con `lingua == "Italian"`
  e `galleria == "instructional"` più quelli con "tutorial" nel titolo; senza duplicati per id; `id` è
  l'id YouTube ricavato dall'url.
- `collegati text`: json `[{"bgg_id","nome","tipo"}]` dal campo `collegati` del portale (tipi:
  base, espansione, precedente).

`codice/sito.py pubblica` le riempie da `portale.dati_gioco`. I 15 già online si aggiornano
rilanciando `pubblica` con `--senza-deploy` (l'upsert riscrive tutte le colonne).

## Scheda gioco (`/gioco/[slug]`)

- I tag diventano link: categoria → `/categoria/<slug>`, meccanica → `/meccanica/<slug>`.
- Dopo "La scatola", sezione **Video tutorial**: un `<details>` chiuso con summary "Mostra i video
  tutorial" e una pill ambra "N in italiano". Aperto: lista, ogni riga = anteprima 16:9 (immagine
  `https://i.ytimg.com/vi/<id>/hqdefault.jpg`), titolo, autore · YouTube. **L'intera riga è
  cliccabile** e al click carica nel riquadro l'iframe `https://www.youtube-nocookie.com/embed/<id>?autoplay=1`
  (nessuna chiamata a YouTube prima del click). Nota sotto: "I video sono di chi li ha fatti. Si
  caricano da YouTube solo quando li apri." Se `video` è vuoto la sezione non si stampa.
- Dopo i video, sezione **Della stessa famiglia**: le card `.vicini` dei `collegati` che hanno una
  riga visibile in `giochi` (match su `bgg_id`), con etichetta in alto a destra ("Gioco base",
  "Espansione", "Precedente") e la card con padding superiore di 30 px, così l'etichetta non tocca il titolo. Se nessun collegato è sul sito, la sezione non si stampa.
- Stile: CSS dei blocchi in `F-post-v2.html` (`.video*`, `.pill`, `.fam*`, `.tag a*`).

## Pagine nuove

`/categoria/[slug]` e `/meccanica/[slug]`: stessa struttura di `/editore/[slug]` (Testata con
indietro, occhiello "Categoria"/"Meccanica", h1 con il nome, griglia `Tavolo` senza tendina).
Filtro in memoria su `visibili()` (colonne json `categorie`/`meccaniche`, slug con `slugifica`).
404 se vuote. In `sitemap.xml`. Il nome mostrato è quello originale del tag (si prende dalla prima
riga che lo contiene).

## Fuori

Recensioni video, pagine famiglia, video in altre lingue, descrizioni delle meccaniche.