/* ============================================================
   P.J.P.C. — presentazione riservata
   Direzione estetica: STRUMENTAZIONE NOTTURNA.
   Riferimento visivo: la cabina di pilotaggio al buio e le carte
   aeronautiche. Ambra sul nero perché è la luce che non brucia
   l'adattamento allo scuro — e perché è il colore degli strumenti.
   Niente lusso patinato: questo documento deve sembrare uno
   strumento di lavoro, non una brochure.
   ============================================================ */

/* ---- Font self-hosted, SIL OFL. Nessun CDN: la CSP è chiusa
       e la sala riunioni può avere rete pessima. ---- */
@font-face {
  font-family: 'Fraunces';
  src: url('/_ingresso/assets/fonts/fraunces-latin-400_900-normal-2.woff2') format('woff2');
  font-weight: 400 900; font-display: swap; font-style: normal;
  unicode-range: U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+2074,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;
}
@font-face {
  font-family: 'Fraunces';
  src: url('/_ingresso/assets/fonts/fraunces-latin-ext-400_900-normal-1.woff2') format('woff2');
  font-weight: 400 900; font-display: swap; font-style: normal;
  unicode-range: U+0100-024F,U+0259,U+1E00-1EFF,U+2020,U+20A0-20AB,U+20AD-20CF,U+2113,U+2C60-2C7F,U+A720-A7FF;
}
@font-face {
  font-family: 'Atkinson';
  src: url('/_ingresso/assets/fonts/atkinson-latin-400-normal-2.woff2') format('woff2');
  font-weight: 400; font-display: swap; font-style: normal;
}
@font-face {
  font-family: 'Atkinson';
  src: url('/_ingresso/assets/fonts/atkinson-latin-700-normal-4.woff2') format('woff2');
  font-weight: 700; font-display: swap; font-style: normal;
}
@font-face {
  font-family: 'PlexMono';
  src: url('/_ingresso/assets/fonts/plexmono-latin-400-normal-2.woff2') format('woff2');
  font-weight: 400; font-display: swap; font-style: normal;
}
@font-face {
  font-family: 'PlexMono';
  src: url('/_ingresso/assets/fonts/plexmono-latin-500-normal-4.woff2') format('woff2');
  font-weight: 500; font-display: swap; font-style: normal;
}
@font-face {
  font-family: 'PlexMono';
  src: url('/_ingresso/assets/fonts/plexmono-latin-600-normal-6.woff2') format('woff2');
  font-weight: 600; font-display: swap; font-style: normal;
}

/* ============================================================
   DUE TEMI, e il CHIARO è quello predefinito.
   Non è solo gusto: in una sala riunioni illuminata un fondo scuro
   proiettato perde contrasto, e questo materiale nasce per essere
   mostrato di persona.

   I nomi delle variabili restano quelli di prima (--nero, --avorio…)
   anche se sul tema chiaro significano il contrario: rinominarli
   avrebbe richiesto di toccare ogni riga del foglio, e un nome
   sbagliato in un punto sarebbe passato inosservato. Vanno letti
   come RUOLI — fondo, testo, bordo — non come colori.
   ============================================================ */

:root {
  /* ---- CHIARO: carta sbiancata dal sole (riferimento Khiva) ---- */
  --nero:        #f6f2e9;   /* fondo pagina */
  --carbone:     #fffdf7;   /* fondo elevato: schede, celle */
  --fumo:        #efe9db;
  --bordo:       #d8cfba;

  /* L'ambra tiene insieme i due temi. Ma quella che brilla sul nero,
     su avorio non ha contrasto sufficiente per il testo: qui è più
     scura e satura (4.6:1 sul fondo), mentre --ambra-grafica resta
     quella viva per le campiture grandi, dove il contrasto lo dà la
     superficie e non il tratto. */
  --ambra:        #a86d15;
  --ambra-chiara: #8a5810;
  --ambra-grafica: #d99a2b;
  --ambra-velo:   rgba(168, 109, 21, 0.09);

  --ghiaccio:    #2f7d75;
  --avorio:      #16241f;   /* testo: verde bosco scurissimo */
  --avorio-soft: #4d5c56;
  --allarme:     #a83a26;

  --velo-uno:    rgba(168, 109, 21, .07);
  --velo-due:    rgba(47, 125, 117, .05);
  --escluso-velo: rgba(168, 58, 38, .07);
  --etichetta-barra: #2b1d05;  /* testo dentro le barre ambra */

  --serif: 'Fraunces', Georgia, serif;
  --sans:  'Atkinson', system-ui, sans-serif;
  --mono:  'PlexMono', ui-monospace, monospace;

  --mis: 68ch;

  color-scheme: light;
}

:root[data-tema="scuro"] {
  /* ---- SCURO: guardia di notte, il tema originale ---- */
  --nero:        #07100f;
  --carbone:     #0d1a18;
  --fumo:        #142623;
  --bordo:       #1e3b36;

  --ambra:        #d99a2b;
  --ambra-chiara: #f0c46a;
  --ambra-grafica: #d99a2b;
  --ambra-velo:   rgba(217, 154, 43, 0.10);

  --ghiaccio:    #6fb4ae;
  --avorio:      #eceae2;
  --avorio-soft: #a8b3ae;
  --allarme:     #d1503f;

  --velo-uno:    rgba(217, 154, 43, .07);
  --velo-due:    rgba(111, 180, 174, .05);
  --escluso-velo: rgba(209, 80, 63, .07);
  --etichetta-barra: #07100f;

  color-scheme: dark;
}

/* ============================================================
   La porta d'ingresso di pjpc.condoe.it.

   Esiste perché un indirizzo con trentadue caratteri casuali non si
   ricorda e non si detta al telefono. Qui si ricorda il dominio e una
   parola, e il link lungo lo consegna il servizio.

   ⚠️ Il compromesso, detto una volta: da oggi il sito è RAGGIUNGIBILE,
   e ciò che lo protegge è la parola d'ordine, non più l'imperscrutabilità
   del percorso. Le difese che restano sono il tetto ai tentativi (otto per
   IP ogni cinque minuti, lato servizio), il confronto a tempo costante e
   il `noindex`. È una scelta di comodità consapevole, non una svista.
   ============================================================ */

* { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; height: 100%; }
body {
  margin: 0; min-height: 100%;
  display: flex; align-items: center; justify-content: center;
  padding: 2rem 1.25rem;
  background: var(--nero); color: var(--avorio);
  font-family: var(--sans); font-size: 16px; line-height: 1.6;
}

.ingresso { width: 100%; max-width: 22rem; text-align: center; }
.segno { width: 76px; height: 76px; margin: 0 auto .9rem; display: block; }

h1 {
  font-family: var(--mono); font-size: 1.05rem; letter-spacing: .3em;
  margin: 0 0 .2rem; color: var(--ambra); font-weight: 600;
}
.occhiello {
  font-family: var(--serif); font-size: 1.5rem; margin: 0 0 2.2rem;
  color: var(--avorio);
}

.modulo { display: flex; flex-direction: column; gap: .6rem; text-align: left; }
label {
  font-family: var(--mono); font-size: .64rem; letter-spacing: .16em;
  text-transform: uppercase; color: var(--avorio-soft);
}
input {
  width: 100%; padding: .7rem .9rem;
  background: var(--carbone); color: var(--avorio);
  border: 1px solid var(--bordo); border-radius: 8px;
  font-family: var(--sans); font-size: 1rem;
}
input:focus { outline: 2px solid var(--ambra); outline-offset: 1px; border-color: var(--ambra); }

button {
  margin-top: .3rem; padding: .75rem 1rem;
  background: var(--ambra); color: var(--carbone);
  border: 1px solid var(--ambra); border-radius: 8px;
  font-family: var(--mono); font-size: .72rem; letter-spacing: .18em;
  text-transform: uppercase; font-weight: 700; cursor: pointer;
}
button:hover { filter: brightness(1.08); }
button:disabled { opacity: .55; cursor: default; }
button:focus-visible { outline: 2px solid var(--ambra-chiara); outline-offset: 2px; }

.esito { min-height: 1.3em; margin: .3rem 0 0; font-size: .86rem; color: var(--avorio-soft); }
.esito.male { color: var(--allarme); }