/* ═══════════════════════════════════════════════════════════════════════════════════════════════════════════
   COSMO, IL SISTEMA VISIVO (corsia V, PRO-217; Tommaso, 20/10: «A · Osservatorio», «Indaco»)

   Lo stesso file, byte per byte, nelle due facce di Cosmo:
     Cosmo.Studio/wwwroot/css/sistema.css   il programma dello studio
     Cosmo.Server/wwwroot/sistema.css       l'app dei telefoni
   Si cambia in un posto e si copia nell'altro; la prova V (tests/Cosmo.Tests/V) è rossa se i due file divergono.
   Qui stanno i caratteri e i token, nient'altro: gli app.css usano solo questi nomi, mai un colore scritto.

   È la famiglia dei prodotti Probal. Dal sistema «Osservatorio» del sito e della dashboard di Saturno, con gli
   stessi nomi e, dove il valore è della famiglia, gli stessi valori: la notte (--void …), i tre pianeti, i
   caratteri, la curva e le tre durate del movimento. Le tre regole dell'Osservatorio valgono anche qui:
     · il nero di fondo vira al blu-verde, mai al viola;
     · filetti al posto dei riquadri: angoli vivi (--raggio: 0), niente ombre di elevazione; l'ombra resta solo
       a ciò che sta sopra la pagina (finestre, menu, avvisi a comparsa);
     · il campo è una riga su cui scrivere: un fondo appena velato e il filetto sotto, che va all'accento sul fuoco.
   Di Cosmo sono il colore (l'indaco, --cosmo, nella stessa banda dei pianeti), il giorno freddo per lavorare e il
   marchio con le due orbite. Un solo accento: azioni, scelte, il giorno di oggi. Mai sui fondi.

   Le due luci, come la dashboard: il GIORNO in :root, per lavorare (schede, tabelle, moduli); la NOTTE per la
   cornice e l'accesso, con gli stessi nomi e altri valori. Le superfici di notte sono nominate qui sotto per le
   due app (lo studio: testata, menu, il lato dell'accesso; il telefono: l'accesso e la testata delle pagine),
   così nessuna schermata deve cambiare per averle. I due blocchi hanno gli stessi nomi: la prova lo controlla.

   ⚠️ Un token che ne cita un altro si risolve dove è dichiarato, non dove si usa: per questo i nomi vecchi qui in
   fondo stanno sia nel giorno sia nella notte.
   ⚠️ I contrasti sono misurati: testo almeno 4,5:1 sul suo fondo (inchiostro sul bianco 17,8:1, note 5,0:1,
   bianco sull'accento 8,1:1, l'indaco sulla notte 5,0:1); il filetto sotto un campo almeno 3:1
   (3,2:1). Il rosso di giorno non scende sotto #b03a33.
   ═══════════════════════════════════════════════════════════════════════════════════════════════════════════ */

/* I caratteri, serviti da noi (come la dashboard dal 10/09): nessun browser chiede niente a Google. Sono i file
   variabili ufficiali, SIL Open Font License 1.1 (scripts.sil.org/OFL), copiati dalla dashboard:
   Manrope © 2019 The Manrope Project Authors, pesi 200-800; JetBrains Mono © 2020 The JetBrains Mono Project
   Authors, pesi 400-800. Due tagli per famiglia, con le unicode-range di Google: il secondo (latin-ext) si scarica
   solo se la pagina ha lettere che il primo non copre. */
@font-face {
  font-family: Manrope; font-style: normal; font-weight: 200 800; font-display: swap;
  src: url(caratteri/manrope-latin-ext.woff2) format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
  font-family: Manrope; font-style: normal; font-weight: 200 800; font-display: swap;
  src: url(caratteri/manrope-latin.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: 'JetBrains Mono'; font-style: normal; font-weight: 400 800; font-display: swap;
  src: url(caratteri/jetbrains-mono-latin-ext.woff2) format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
  font-family: 'JetBrains Mono'; font-style: normal; font-weight: 400 800; font-display: swap;
  src: url(caratteri/jetbrains-mono-latin.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

/* ── Le costanti: valgono di giorno e di notte ── */
:root {
  /* i pianeti di Probal, dai loro colori reali (gli stessi del sito); Cosmo nella stessa banda */
  --saturno: #d9b26a;
  --giove:   #c9764a;
  --nettuno: #5b84c9;
  --cosmo:   #7177d6;

  /* il cielo di notte, per ciò che sta fuori dalle due luci (lo sfondo della pagina sotto la testata) */
  --cielo-notte: #07090c;
  --velo-notte: rgba(7, 9, 12, .55);
  --ombra-sopra: 0 18px 48px -12px rgba(7, 9, 12, .28), 0 2px 6px rgba(7, 9, 12, .08);

  /* tipografia: Manrope per leggere, JetBrains Mono per le ore, le date e i codici */
  --display: Manrope, -apple-system, BlinkMacSystemFont, "Segoe UI", system-ui, sans-serif;
  --ui: Manrope, -apple-system, BlinkMacSystemFont, "Segoe UI", system-ui, sans-serif;
  --mono: "JetBrains Mono", ui-monospace, "SF Mono", Menlo, monospace;

  /* forma: angoli vivi */
  --raggio: 0;

  /* movimento: una curva sola, tre durate (quelle del sito) */
  --ease: cubic-bezier(0.16, 1, 0.3, 1);
  --ease-io: cubic-bezier(0.65, 0, 0.35, 1);
  --t-corta: 200ms;
  --t-media: 420ms;
  --t-lunga: 900ms;
}

/* ── Il giorno: per lavorare. Neutri freddi, che virano al blu-verde come la notte ── */
:root {
  --void:      #ffffff;
  --deep:      #f3f5f6;
  --panel:     #ffffff;
  --panel-hi:  #f7f8f9;
  --rule:      #e3e7ea;
  --rule-mid:  #cfd5da;
  --rule-hi:   #828c96;
  --paper:     #14181d;
  --paper-dim: #424a53;
  --paper-mute:#66707b;
  --accento:       #3b42b0;
  --accento-forte: #2f3594;
  --accento-velo:  #eef0fb;
  --su-accento:    #ffffff;
  --ok:            #2e7552;
  --ok-velo:       #e9f3ed;
  --allarme:       #b03a33;
  --allarme-velo:  #f9ebea;
  --attesa:        #8f6a24;
  --attesa-velo:   #fbf6ec;
  --su-stato:      #ffffff;
  --spento:        var(--paper-mute);
  --velo:          rgba(20, 24, 29, .03);
  --velo-2:        rgba(20, 24, 29, .055);
  --campo:         #f5f7f8;
  /* nomi vecchi (le schermate della replica li usano): valori nuovi, non usarli in regole nuove */
  --testo:   var(--paper);
  --bordo:   var(--rule-mid);
  --verde:   var(--accento);
  --blu:     var(--accento);
  --arancio: var(--accento);
  --rosso:   var(--allarme);
}

/* ── La notte: la cornice e l'accesso. I valori dell'Osservatorio, l'indaco di Cosmo per accento ── */
.notte,
#radice > .testata, #radice > .laterale, #radice .accesso > .lato,
#app .accesso, #app .testa {
  --void:      #07090c;
  --deep:      #0a0d12;
  --panel:     #0e1219;
  --panel-hi:  #131822;
  --rule:      #1b212b;
  --rule-mid:  #29313d;
  --rule-hi:   #3b4553;
  --paper:     #e9e6df;
  --paper-dim: #9aa0a8;
  --paper-mute:#767e8a;
  --accento:       var(--cosmo);
  --accento-forte: #8a90e2;
  --accento-velo:  rgba(113, 119, 214, .16);
  --su-accento:    #07090c;
  --ok:            #5c9c7a;
  --ok-velo:       rgba(92, 156, 122, .14);
  --allarme:       #cc5b54;
  --allarme-velo:  rgba(204, 91, 84, .14);
  --attesa:        var(--saturno);
  --attesa-velo:   rgba(217, 178, 106, .12);
  --su-stato:      #07090c;
  --spento:        var(--paper-mute);
  --velo:          rgba(233, 230, 223, .02);
  --velo-2:        rgba(233, 230, 223, .045);
  --campo:         rgba(233, 230, 223, .04);
  --testo:   var(--paper);
  --bordo:   var(--rule-mid);
  --verde:   var(--accento);
  --blu:     var(--accento);
  --arancio: var(--accento);
  --rosso:   var(--allarme);
}