/* Arelia: foglio di stile condiviso delle schede delle creature.
   Arelia Website Authoring Standard, Sezione 6: classi, colori esadecimali,
   nessuna geometria delle tabelle in CSS (larghezze e allineamenti negli attributi HTML),
   ogni riempimento traslucido preceduto da un colore pieno. */

/* Font Dumbledor 1 (GemFonts), licenza 1001Fonts FFC: solo formato web WOFF, cartella fonts */
@font-face {
  font-family: "Dumbledor";
  src: url("fonts/dumbledor.woff") format("woff");
  font-weight: normal;
  font-style: normal;
}
@font-face {
  font-family: "Dumbledor 1";
  src: url("fonts/dumbledor.woff") format("woff");
  font-weight: normal;
  font-style: normal;
}

body {
  background-color: #E8DCC0;
  color: #000000;
}

/* Ritratto (Plate A) */
.ritratto {
  text-align: center;
  margin: 6px 0 14px;
}
.ritratto img {
  max-width: 100%;
  height: auto;
  border: 1px solid #6B5B3E;
}

/* Contenitore delle tabelle iniziali */
.scheda-tabelle {
  padding: 0 5px;
  margin: 10px 0 20px;
  overflow-x: auto;
}

/* Tabella delle caratteristiche */
.tabella-scheda {
  border-collapse: collapse;
  background-color: #FFFFFF;
  color: #111111;
  font-family: "Bookman Old Style", Georgia, serif;
  font-size: 11pt;
}
.tabella-scheda th,
.tabella-scheda td {
  border: 1px solid #565656;
  padding: 4px 7px;
  line-height: 1.25;
  vertical-align: middle;
  color: #111111;
}
.tabella-scheda th {
  font-family: "Book Antiqua", Georgia, serif;
  font-weight: normal;
}
.tabella-scheda a {
  color: #164D76;
}

/* Tabelle dei Resilience Test */
.titolo-tabelle {
  text-align: center;
  margin: 25px 0 12px;
  font-family: "Book Antiqua", Georgia, serif;
  font-size: 16pt;
  font-weight: bold;
  color: #964000;
}
.tabella-resilienza {
  border-collapse: collapse;
  background-color: #FFFFFF;
  color: #111111;
  font-family: "Book Antiqua", Georgia, serif;
  font-size: 11pt;
}
.tabella-resilienza th,
.tabella-resilienza td {
  border: 1px solid #777777;
  padding: 4px 6px;
  line-height: 1.24;
  color: #111111;
}
.tabella-resilienza .res-title { background-color: #FFA4A4; font-weight: bold; }
.tabella-resilienza .res-col { background-color: #CCFFFF; font-size: 10pt; }
.tabella-resilienza .res-label { background-color: #EDEDED; font-weight: bold; }
.tabella-resilienza .res-up { background-color: #66CCFF; font-weight: bold; }
.tabella-resilienza .res-down { background-color: #FFA4A4; font-weight: bold; }
.tabella-resilienza .res-zero { background-color: #C0C0C0; }
.tabella-resilienza .res-final { background-color: #FFFFFF; font-weight: bold; }
.tabella-resilienza a { color: #164D76; }
.nota-resilienza {
  margin: 4px 0 18px;
  font: 13px/1.45 Georgia, serif;
  color: #3D3D3D;
}

/* Contenitore e pannelli */
.contenitore {
  max-width: 1130px;
  margin: 28px auto 50px;
  padding: 0 18px;
  color: #000000;
  font: 18px/1.45 Georgia, "Times New Roman", serif;
}
.pannello {
  margin: 22px 0;
  padding: 24px 30px;
  background-color: #F3EAD3;
  background-color: rgba(255, 250, 236, 0.55);
  border: 1px solid #8A7A55;
  border-radius: 12px;
  color: #000000;
}
.pannello h2 {
  font: bold 24px/1.3 Georgia, serif;
  color: #964000;
  margin: 0 0 14px;
  padding-bottom: 10px;
  border-bottom: 1px solid #8A7A55;
}
.pannello h3 {
  font: bold 20px/1.3 Georgia, serif;
  color: #6B4210;
  margin: 24px 0 6px;
}
.pannello h4 {
  font: bold 17px/1.3 Georgia, serif;
  color: #6B4210;
  margin: 18px 0 6px;
}
.pannello p {
  margin: 6px 0 10px;
}
.pannello ul {
  margin: 8px 0 12px;
  padding-left: 24px;
}
.pannello li {
  margin-bottom: 6px;
}
.pannello a {
  color: #0B4F7A;
}

/* Tabelle dei pannelli */
.tabella {
  border-collapse: collapse;
  font: 15px/1.35 Georgia, serif;
  color: #000000;
}
.tabella th {
  background-color: #335447;
  color: #FFF7DB;
  padding: 6px 9px;
  border: 1px solid #688073;
  font-weight: bold;
}
.tabella td {
  background-color: #FAF5E8;
  padding: 6px 9px;
  border: 1px solid #8A7A55;
  vertical-align: top;
}
.tabella .riga-totale td {
  font-weight: bold;
  color: #6B3D00;
  border-top: 2px solid #8A7A55;
}
.tabella-scorrevole {
  overflow-x: auto;
  margin: 10px 0 16px;
}
.cifra-ap {
  display: block;
  font-weight: bold;
  color: #6B3D00;
}
.cella-piccola {
  display: block;
  font: 12px/1.3 Arial, sans-serif;
  color: #3D3D3D;
}

/* Poteri */
.legenda {
  margin: 4px 0 18px;
  padding: 8px 14px;
  background-color: #EFE4C9;
  border: 1px solid #8A7A55;
  font: 13px/1.6 Georgia, serif;
  color: #000000;
  text-align: center;
}
.legenda span {
  margin: 0 6px;
  white-space: nowrap;
  font-weight: bold;
}
.potere {
  margin: 18px 0 24px;
}
.potere-testo {
  font: normal normal 14pt/1.45 "Dumbledor", Garamond, Georgia, serif;
  color: #000000;
  text-align: justify;
}
.potere-testo p {
  margin: 6px 0 10px;
}
.potere-testo ul {
  margin: 6px 0 10px;
}
.nome-offensivo,
.nome-difensivo,
.nome-vulnerabilita {
  font-family: "Book Antiqua", Georgia, serif;
  font-style: normal;
  font-weight: bold;
}
.nome-offensivo { color: #7D1FA8; }
.nome-difensivo { color: #1F6B1F; }
.nome-vulnerabilita { color: #B22000; }
.tag-variante {
  color: #B0004A;
  font-family: "Book Antiqua", Georgia, serif;
  font-style: normal;
  font-weight: bold;
}
.tag-attacco { color: #964000; }
.potere-grado {
  color: #005F8F;
  font-style: normal;
  font-weight: normal;
}
/* Nel testo dei poteri (Dumbledor) nessun grassetto: i colori bastano */
.potere-testo .k-azione,
.potere-testo .k-test,
.potere-testo .k-bonus,
.potere-testo .k-limite,
.potere-testo .k-danno,
.potere-testo .k-veleno,
.potere-testo .k-effetto {
  font-weight: normal;
}
.potere-testo .tag-variante {
  font: inherit;
  color: #B0004A;
}
.testo-fonte {
  margin: 10px 0 0;
  padding: 6px 14px;
  background-color: #EFE4C9;
  border-left: 4px solid #8A7A55;
}
.testo-fonte summary {
  cursor: pointer;
  color: #6B4210;
  font: 15px/1.5 Georgia, serif;
}

/* Colori di significato (legenda dei poteri, palette dell autore del 26 ottobre 2026) */
.k-azione { color: #0033CC; font-weight: bold; }
.k-test { color: #7E5429; font-weight: bold; }
.k-bonus { color: #00688A; font-weight: bold; }
.k-limite { color: #800000; font-weight: bold; }
.k-danno { color: #6600FF; font-weight: bold; }
.k-veleno { color: #1D6B1D; font-weight: bold; }
.k-effetto { color: #1D6B1D; font-weight: bold; }

/* Note e blocchi narrativi */
.nota {
  margin: 13px 0;
  padding: 10px 15px;
  background-color: #EFE4C9;
  border-left: 4px solid #964000;
  font: 15px/1.5 Arial, sans-serif;
  color: #000000;
}
.paragrafo-opzionale {
  margin: 13px 0;
  padding: 8px 15px;
  background-color: #EFE4C9;
  border-left: 4px solid #964000;
}
.paragrafo-opzionale summary {
  cursor: pointer;
  color: #6B4210;
  font: 16px/1.4 Georgia, serif;
}
.lettura {
  text-align: left;
  line-height: 1.45;
}

/* Registro provvisorio e colophon */
.registro {
  margin: 22px 0;
  padding: 12px 30px;
  background-color: #EFE4C9;
  border: 1px solid #8A7A55;
  border-radius: 12px;
  font: 15px/1.5 Georgia, serif;
  color: #000000;
}
.registro summary {
  cursor: pointer;
  font: bold 18px/1.4 Georgia, serif;
  color: #964000;
}
.registro h3 {
  font: bold 15px/1.35 Georgia, serif;
  color: #6B4210;
  margin: 16px 0 4px;
}
.colophon {
  text-align: center;
  margin: 18px 0 30px;
  font: 12px/1.5 Georgia, serif;
  color: #3D3D3D;
}

@media (max-width: 750px) {
  .contenitore { padding: 0 10px; }
  .pannello { padding: 17px; }
  .registro { padding: 10px 17px; }
  .tabella { font-size: 12px; }
  .tabella th, .tabella td { padding: 4px 6px; }
}
@media print {
  .pannello, .registro { background-color: #FFFFFF; }
}