/* Les Comptes du Skull King — pages d'assistance et de confidentialité.
   Aucune ressource externe : les polices de l'app (Brygada 1918 pour les titres et le texte, Sorts Mill Goudy
   italique pour les accroches, licence OFL, fichiers de licence dans /fonts) sont servies par le site. Même
   habillage que l'app : le cuir du dos des cartes en tête, la corde torsadée dorée, puis le parchemin et le
   papier des cartes de règles. */

@font-face {
  font-family: "Brygada 1918";
  src: url("/fonts/Brygada1918-Regular.ttf") format("truetype");
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: "Brygada 1918";
  src: url("/fonts/Brygada1918-SemiBold.ttf") format("truetype");
  font-weight: 600;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: "Brygada 1918";
  src: url("/fonts/Brygada1918-Bold.ttf") format("truetype");
  font-weight: 700;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: "Sorts Mill Goudy";
  src: url("/fonts/SortsMillGoudy-Italic.ttf") format("truetype");
  font-weight: 400;
  font-style: italic;
  font-display: swap;
}

:root {
  --paper: #faf7f0;
  --raised: #fffefa;
  --text: #3a2a1c;
  --strong: #2b1e12;
  --secondary: #7b6750;
  --line: #e4dac4;
  --border: #e4dac4;
  --red: #a3452f;
  --link: #a3452f;
  --leather: #3a2b1f;
  --leather-deep: #1f1710;
  --parchment: #efe4cd;
  --gold: #d6a445;
  --gold-light: #f7dc8e;
  --gold-edge: #97701f;
  color-scheme: light;
}

@media (prefers-color-scheme: dark) {
  :root {
    --paper: #1a140f;
    --raised: #231b15;
    --text: #efe5d0;
    --strong: #f6eddb;
    --secondary: #ae9c80;
    --line: #3b3026;
    --border: #3b3026;
    --red: #e07c60;
    --link: #e07c60;
    color-scheme: dark;
  }
}

* { box-sizing: border-box; }

body {
  margin: 0;
  background: var(--paper);
  color: var(--text);
  font: 17px/1.6 "Brygada 1918", Georgia, "Times New Roman", serif;
  -webkit-font-smoothing: antialiased;
}

/* Le cuir du dos des cartes, avec les lignes pâles des cartes marines. */
.leather {
  position: relative;
  overflow: hidden;
  background:
    repeating-radial-gradient(circle at 85% 120%, transparent 0 46px, rgba(214, 164, 69, 0.07) 46px 47px),
    linear-gradient(170deg, var(--leather) 0%, #2a2018 55%, var(--leather-deep) 100%);
  color: var(--parchment);
  padding: 18px 16px 64px;
}

.top {
  position: relative;
  max-width: 680px;
  margin: 0 auto;
  display: flex;
  justify-content: flex-end;
  font-size: 15px;
}

.top a {
  color: var(--parchment);
  border: 1px solid rgba(214, 164, 69, 0.6);
  border-radius: 999px;
  padding: 4px 12px;
  text-decoration: none;
}

.brand {
  position: relative;
  max-width: 440px;
  margin: 22px auto 0;
  text-align: center;
}

.brand img {
  width: 80px;
  height: 80px;
  border-radius: 18px;
  box-shadow: 0 6px 16px rgba(0, 0, 0, 0.5);
}

.overline {
  display: block;
  margin: 14px 0 0;
  font: italic 400 19px/1.2 "Sorts Mill Goudy", Georgia, serif;
  color: #d8c8a8;
}

h1 {
  margin: 0 0 6px;
  font: 700 38px/1.1 "Brygada 1918", Georgia, serif;
  letter-spacing: 0.03em;
  text-transform: uppercase;
  color: var(--gold);
}

.tagline {
  margin: 0;
  color: #d8c8a8;
  font: italic 400 18px/1.35 "Sorts Mill Goudy", Georgia, serif;
}

/* La corde torsadée des cartes de règles : brins dorés en biais, un nœud à chaque bout. */
.rope {
  position: relative;
  display: block;
  width: 180px;
  height: 7px;
  margin: 16px auto 0;
  border-radius: 4px;
  background: repeating-linear-gradient(115deg, var(--gold-edge) 0 1.5px, var(--gold) 1.5px 4.5px, var(--gold-light) 4.5px 6px);
}

.rope::before,
.rope::after {
  content: "";
  position: absolute;
  top: 50%;
  width: 11px;
  height: 11px;
  border-radius: 50%;
  background: radial-gradient(circle at 35% 35%, var(--gold-light), var(--gold) 55%, var(--gold-edge));
  transform: translateY(-50%);
}

.rope::before { left: -6px; }
.rope::after { right: -6px; }

/* Le parchemin, qui glisse sur le cuir : coins arrondis en haut. */
main {
  position: relative;
  max-width: 712px;
  margin: -28px auto 0;
  padding: 28px 16px 48px;
  background: var(--paper);
  border-radius: 22px 22px 0 0;
}

h2 {
  margin: 0 0 8px;
  font-weight: 700;
  font-size: 22px;
  line-height: 1.25;
  color: var(--strong);
}

section {
  background: var(--raised);
  border: 1px solid var(--border);
  border-radius: 14px;
  padding: 20px;
  margin: 12px 0;
  box-shadow: 0 1px 2px rgba(89, 64, 26, 0.08);
}

section.summary { background: var(--paper); box-shadow: none; }

p { margin: 0 0 10px; }
p:last-child, ul:last-child, ol:last-child, table:last-child { margin-bottom: 0; }

ul { margin: 0 0 10px; padding-left: 20px; }
li { margin: 4px 0; }

/* Tableaux des points et des bonus. */
table.points {
  width: 100%;
  border-collapse: collapse;
  margin: 10px 0 0;
  font-size: 16px;
}

table.points td {
  padding: 7px 0;
  border-top: 1px solid var(--line);
  vertical-align: top;
  color: var(--text);
}

table.points tr:first-child td { border-top: 0; }

table.points td.pts {
  width: 1%;
  padding-left: 16px;
  white-space: nowrap;
  text-align: right;
  font-weight: 700;
  color: var(--strong);
}

.muted { color: var(--secondary); }

a { color: var(--link); text-underline-offset: 3px; }

.date {
  text-align: center;
  color: var(--secondary);
  font: italic 400 16px/1.4 "Sorts Mill Goudy", Georgia, serif;
  margin: 0 0 8px;
}

details { border-top: 1px solid var(--line); padding: 12px 0; }
details:first-of-type { border-top: 0; padding-top: 4px; }
details:last-of-type { padding-bottom: 0; }
summary { cursor: pointer; font-weight: 600; color: var(--strong); }
details p, details ul, details table { margin-top: 8px; }
details p, details li { color: var(--secondary); }

footer {
  margin-top: 28px;
  text-align: center;
  font-size: 15px;
  color: var(--secondary);
}

footer nav { margin-bottom: 10px; }
footer nav a { margin: 0 8px; }