@font-face {
  font-family: "Libre Baskerville";
  src: url("fonts/LibreBaskerville-Regular.woff2") format("woff2");
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: "Libre Baskerville";
  src: url("fonts/LibreBaskerville-Italic.woff2") format("woff2");
  font-weight: 400;
  font-style: italic;
  font-display: swap;
}

@font-face {
  font-family: "Libre Baskerville";
  src: url("fonts/LibreBaskerville-Bold.woff2") format("woff2");
  font-weight: 700;
  font-style: normal;
  font-display: swap;
  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: "Libre Baskerville";
  src: url("fonts/LibreBaskerville-Bold-Ext.woff2") format("woff2");
  font-weight: 700;
  font-style: normal;
  font-display: swap;
  unicode-range: U+0100-02AF, U+0304, U+0308, U+0329, 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: "Playfair Display";
  src: url("fonts/PlayfairDisplay-Bold.woff2") format("woff2");
  font-weight: 700;
  font-style: normal;
  font-display: swap;
  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: "Playfair Display";
  src: url("fonts/PlayfairDisplay-Bold-Ext.woff2") format("woff2");
  font-weight: 700;
  font-style: normal;
  font-display: swap;
  unicode-range: U+0100-02AF, U+0304, U+0308, U+0329, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}

html {
  background: #e4dccb;
}

body {
  margin: 0;
  color: #1c1a16;
  font-family: "Libre Baskerville", Palatino, "Palatino Linotype", serif;
  font-size: 1.05rem;
  line-height: 1.55;
}

.sheet {
  max-width: 40rem;
  margin: 1.5rem auto;
  padding: 2.2rem 1.6rem 2.6rem;
  background: #f6f1e4;
  border: 3px double #1c1a16;
  box-shadow: 0 0 0 5px #e4dccb, 0 0 0 6px #1c1a16;
}

.essai {
  margin: 0 0 1.2rem;
  padding: 0.35rem 0.6rem;
  text-align: center;
  font-size: 0.85rem;
  background: #fff4cc;
  border: 3px double #1c1a16;
}

.masthead {
  text-align: center;
}

.brand {
  margin: 0;
  font-size: 0.78rem;
  letter-spacing: 0.16em;
  text-transform: uppercase;
}

.masthead h1 {
  margin: 0.15rem 0 0.35rem;
  font-family: "Playfair Display", "Libre Baskerville", serif;
  font-size: 4.2rem;
  font-weight: 700;
  line-height: 1.05;
}

.rule {
  border: 0;
  height: 8px;
  margin: 0.4rem 0 0.7rem;
  border-top: 3px solid #1c1a16;
  border-bottom: 1px solid #1c1a16;
}

.dateline,
.soustitre {
  margin: 0.15rem 0;
}

.dateline {
  font-weight: 700;
}

.soustitre {
  font-style: italic;
}

.chapo {
  margin: 1.3rem 0 1.4rem;
  padding: 0.65rem 1rem;
  font-size: 1.15rem;
  font-style: italic;
  font-weight: 700;
  text-align: center;
  white-space: pre-line;
  border-block: 3px double #1c1a16;
}

.corps {
  text-align: justify;
  hyphens: auto;
}

.corps h2,
.partie > h2 {
  margin: 1.2rem 0 0.55rem;
  font-size: 1.05rem;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-align: center;
  text-transform: uppercase;
}

.partie:first-of-type .corps > p:first-of-type::first-letter,
article.corps > p:first-of-type::first-letter {
  float: left;
  padding: 0.15rem 0.35rem 0 0;
  font-family: "Playfair Display", "Libre Baskerville", serif;
  font-size: 3.2rem;
  line-height: 0.8;
}

.chiffres {
  margin: 1.8rem 0.4rem;
  padding: 0.85rem 1.15rem 1rem;
  border: 3px double #1c1a16;
  outline: 1px solid #1c1a16;
  outline-offset: 5px;
}

.chiffres h2 {
  margin: 0 0 0.6rem;
  font-size: 0.95rem;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-align: center;
  text-transform: uppercase;
}

.chiffres dl {
  margin: 0;
}

.chiffres dl > div {
  display: flex;
  align-items: baseline;
  gap: 0.45rem;
  margin: 0.32rem 0;
}

.chiffres dt,
.chiffres dd {
  margin: 0;
}

.chiffres dt {
  display: flex;
  flex: 1;
  align-items: baseline;
  gap: 0.45rem;
}

.chiffres dt::after {
  content: "";
  flex: 1;
  height: 0.55em;
  background-image: radial-gradient(circle, #c4bdae 1.15px, transparent 1.45px);
  background-size: 8px 100%;
  background-repeat: repeat-x;
  background-position: left center;
}

.chiffres dd {
  white-space: nowrap;
  text-align: right;
}

.pied {
  margin-top: 1.6rem;
  font-size: 0.85rem;
  text-align: center;
}

.cle {
  margin-bottom: 0.2rem;
  letter-spacing: 0.18em;
}

.signature {
  font-style: italic;
}

.liste {
  padding-left: 1.2rem;
}

a {
  color: inherit;
}

.bureau,
.login-simple {
  text-align: left;
}

.sheet:has(.bureau),
.sheet:has(.login-simple) {
  max-width: 40rem;
}

.bureau label,
.login-simple label {
  display: block;
  margin: 0.85rem 0 0.3rem;
}

.bureau input[type="text"],
.bureau textarea,
.bureau select,
.login-simple input {
  display: block;
  width: 100%;
  box-sizing: border-box;
  margin-top: 0.2rem;
  padding: 0.4rem 0.5rem;
  font: inherit;
  color: inherit;
  background: #fffdf8;
  border: 1px solid #1c1a16;
}

.bureau textarea {
  min-height: 8rem;
}

.bureau h2 {
  margin: 1.4rem 0 0.4rem;
  font-size: 1.05rem;
}

.bureau .partie-edit {
  margin: 0.8rem 0;
  padding-top: 0.6rem;
  border-top: 1px solid #1c1a16;
}

.bureau .liste-numeros {
  padding-left: 0;
  list-style: none;
}

.bureau .liste-numeros li {
  margin: 0.35rem 0;
}

.bureau .actions,
.login-simple .actions {
  display: flex;
  gap: 0.6rem;
  margin-top: 1.1rem;
}

.bureau button,
.login-simple button {
  font: inherit;
  padding: 0.45rem 0.85rem;
  color: #f6f1e4;
  background: #1c1a16;
  border: 1px solid #1c1a16;
  cursor: pointer;
}

.bureau button.secondaire {
  color: #1c1a16;
  background: transparent;
}

.bureau .note,
.bureau .alerte {
  margin: 0.8rem 0;
}

.bureau .alerte {
  padding: 0.4rem 0.6rem;
  background: #fff4cc;
  border: 1px solid #1c1a16;
}

.bureau details {
  margin-top: 1rem;
}

@media (min-width: 900px) {
  .sheet {
    max-width: 58rem;
    padding: 2.4rem 2.2rem 2.8rem;
  }

  .partie.cols-2 .corps,
  article.corps {
    column-count: 2;
    column-gap: 2.4rem;
    column-rule: 1px solid #1c1a16;
  }

  .partie.cols-2 .corps > :first-child,
  article.corps > :first-child {
    margin-top: 0;
  }

  article.corps h2 {
    column-span: all;
  }
}

@media (max-width: 640px) {
  .sheet {
    margin: 0;
    padding: 1.4rem 1rem 2rem;
    box-shadow: none;
  }

  .masthead h1 {
    font-size: 3.4rem;
  }

  .chiffres {
    margin-inline: 0;
    outline: none;
  }
}

@media print {
  html {
    background: #fff;
  }

  .sheet {
    margin: 0;
    box-shadow: none;
  }

  .corps {
    column-count: 1;
  }

  .essai,
  .pied a {
    display: none;
  }
}