Crea un sito web HTML responsive utilizzando lo stack esistente del progetto per [PROJECT] e [AUDIENCE]. L'attività è: Dettagli dell'evento della community.
## Contenuti e struttura obbligatori
Fornisci l'obiettivo della sessione, l'organizzatore, la data, il fuso orario, il formato, il programma e i requisiti di partecipazione.
Usa [APPROVED_CONTENT] come fonte per nomi, date, dati, dichiarazioni e destinazioni. Elenca gli input mancanti prima di sostituire qualsiasi elemento. Se è necessaria una dimostrazione, indica che i contenuti sono fittizi. Non inventare citazioni di clienti, classifiche, loghi di partner o funzionalità del prodotto.
## Direzione del design
Usa [BRAND_RULES] e il design system già selezionato nel progetto. Se non viene fornito alcun sistema, parti da questa direzione: tipografia nera marcata, pannelli giallo caldo e composizioni geometriche nette; contrasto controllato. Mantieni coerenti i ruoli di caratteri, spaziatura e colori. Dai priorità all'attività rispetto agli elementi decorativi ed evita una raccolta generica di schede non correlate.
## Preparazione dei contenuti
Raccogli l'organizzatore confermato, lo scopo della sessione, la data, il fuso orario, il formato, il luogo e i requisiti di partecipazione. Chiarisci se le iscrizioni sono aperte e quali condizioni di annullamento o accesso si applicano.
## Layout e comportamento
Consenti a chiunque di capire cosa farà, quando dovrà arrivare e come potrà partecipare prima di leggere il programma completo. Raggruppa i dettagli pratici invece di distribuirli in schede decorative.
## Verifica di accettazione specifica dell'attività
- Rendi facili da trovare lo stato delle iscrizioni e i dettagli sull'annullamento.
- Verifica un evento da remoto, un evento al completo e una modifica dell'orario di inizio.
- Mantieni coerenti lo stato delle iscrizioni e le istruzioni per partecipare tra l'azione principale e i dettagli dell'evento.
## Implementazione e revisione
Mantieni il testo modificabile. Usa una struttura semantica, controlli descrittivi, un focus da tastiera visibile e stati vuoti/di errore appropriati. Verifica i layout stretti e ampi. Rispetta le preferenze per la riduzione del movimento. Mantieni il framework e le dipendenze esistenti del progetto; non sostituire lo stack senza segnalarlo. Restituisci i file modificabili e spiega eventuali comportamenti incompleti o input non supportati. Esamina questa attività specifica prima di proporre funzionalità aggiuntive.
## Allegato di riferimento e obiettivo di ricostruzione
Allega reference.webp, incluso nel pacchetto scaricabile di questo prompt, insieme al prompt in OpenDesign. Crea un risultato modificabile con composizione e gerarchia simili; non incorporare l'intera immagine di riferimento come interfaccia finale. Mantieni i contenuti di progetto approvati e le regole del brand se sono in conflitto con le etichette fittizie dell'esempio. Se l'immagine manca o è illeggibile, richiedila invece di dichiarare fedeltà visiva.
## Composizione e contenuti di riferimento
Usa il file reference.webp allegato come riferimento visivo per i dettagli dell'evento della community. Prima di iniziare, individua dall'alto verso il basso le aree principali, le relative larghezze e altezze, l'allineamento, la spaziatura, la gerarchia tipografica, i colori delle superfici, i bordi, le immagini e i componenti ricorrenti. Mantieni queste relazioni anziché sostituirle con un modello generico. Contenuto richiesto per l'attività: fornisci l'obiettivo della sessione, l'organizzatore, la data, il fuso orario, il formato, il programma e i requisiti di partecipazione. Nel trasformare l'immagine in elementi modificabili, segui queste indicazioni specifiche per il layout: consenti a chiunque di capire cosa farà, quando dovrà arrivare e come potrà partecipare prima di leggere il programma completo. Raggruppa i dettagli pratici invece di distribuirli in schede decorative.
## Direzione visiva dal brief di esempio
Tipografia nera marcata, pannelli giallo caldo e composizioni geometriche nette; contrasto controllato.
## Specifiche di interazione
Il riferimento è un concept statico: il comportamento descritto di seguito è un requisito da implementare, non la prova che l'immagine sia già funzionante. Copia il prompt personalizzato nel tuo progetto di lavoro. Inizia dall'attività principale: fornisci l'obiettivo della sessione, l'organizzatore, la data, il fuso orario, il formato, il programma e i requisiti di partecipazione. Rendi facili da trovare lo stato delle iscrizioni e i dettagli sull'annullamento. Per ogni controllo visibile, specifica l'evento che lo attiva, lo stato interessato e il feedback; implementa le modifiche locali mantenendo lo stato coerente tra le viste correlate. Assicurati che ricerca e filtri producano risultati reali, che i controlli di selezione abbiano uno stato attivo esplicito e che le azioni di salvataggio mostrino, ove pertinente, un feedback visibile di operazione in corso, riuscita o non riuscita. Non aggiungere flussi di lavoro non correlati. Usa link appropriati per la navigazione, pulsanti per le azioni e nomi accessibili per i controlli a icona. Non far credere che un'operazione backend sia riuscita se è cambiata soltanto una demo locale.
## Confronto visivo e consegna
1. Confronta il risultato con l'immagine allegata usando le stesse proporzioni. Prima di perfezionare i dettagli decorativi, verifica il posizionamento delle aree principali, le dimensioni relative delle immagini, le interruzioni di riga, la spaziatura, la gerarchia tipografica, il contrasto, gli stati attivi e la densità dei contenuti.
2. Quindi testa il layout stretto senza comprimere il testo desktop in etichette minuscole.
3. Mantieni loghi, foto e icone come risorse separate e tutte le etichette significative modificabili. Elenca eventuali caratteri o risorse non disponibili e qualsiasi scostamento intenzionale. Restituisci i file funzionanti insieme a una descrizione concisa dei comportamenti implementati e delle integrazioni ancora necessarie; non promettere un risultato identico al pixel basandoti solo sul prompt.