@font-face {
  font-family: "Arial Monospaced MT Std";
  src: url("fonts/arial-monospaced-mt-std.woff2") format("woff2"),
       url("fonts/arial-monospaced-mt-std.ttf") format("truetype"),
       url("fonts/arial-monospaced-mt-std.eot") format("embedded-opentype");
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}
:root { --page-pad: 2vw; }
* { box-sizing: border-box; }
html { font-size: 17px; }
body {
  margin: 0;
  background: #fff;
  color: #000;
  font-family: "Arial Monospaced MT Std", monospace;
  font-size: 17px;
  font-weight: 400;
  line-height: 1.3;
  letter-spacing: -0.02em;
}
a, a:visited, a:hover, a:active { color: #000; text-decoration: none; }
button, input, table, th, td, h1, p, div, span {
  font: inherit;
  color: #000;
  letter-spacing: inherit;
  line-height: inherit;
}
.site-header { padding: var(--page-pad) var(--page-pad) 0; }
.site-title { display: inline-block; }
main { padding: 24px var(--page-pad) 70px; }
.site-footer {
  position: fixed;
  bottom: 0;
  left: 0;
  width: 100%;
  padding: 12px var(--page-pad) 20px;
  background: #fff;
  display: flex;
  justify-content: center;
  gap: clamp(18px, 4vw, 65px);
  color: #000;
}
/* Shared layout for the index and individual project pages. */
.project-table-wrap { width: 100%; overflow-x: auto; }
table, table.project-meta-table {
  display: block;
  width: 100%;
  min-width: 0;
  table-layout: auto;
  border-collapse: separate;
}
table tbody { display: block; width: 100%; }
table tbody tr {
  display: grid;
  grid-template-columns: 3ch 3ch 3ch 52ch 21ch 27ch 25ch 4ch;
  column-gap: 24px;
  justify-content: space-between;
  align-items: start;
  min-width: max-content;
  width: 100%;
  cursor: pointer;
}
table tbody tr td,
table tbody tr td:nth-child(n) {
  display: block;
  box-sizing: border-box;
  width: auto;
  min-width: 0;
  padding: 0;
  text-align: left;
  vertical-align: top;
  white-space: nowrap;
  font-weight: 400;
}
table tbody tr td:nth-child(8) { text-align: right; }
table tbody tr td.title-cell { white-space: nowrap; }
#project-rows tr.special-project td,
#project-rows tr.special-project a { color: #999; }
.project-meta-table tbody tr.extra-row {
  display: block;
  min-width: 0;
  width: 100%;
}
.project-meta-table tbody tr.extra-row td.extra-content {
  display: block;
  width: 100%;
  padding: 44.2px 0 0;
  text-align: left;
  white-space: normal;
}
.project-meta-table .extra-content .project-text-column { width: min(100%, 40ch); min-width: 0; }
.project-meta-table .extra-content .project-text-column > div:not(.project-content) { width: fit-content; max-width: 100%; text-align: left; }
.project-meta-table .extra-content .extra-entry { padding-left: 2em; }
.project-page tbody tr, .project-page tbody td { cursor: text; }
.project-page a { cursor: pointer; }
/* Password screen: preserve the existing custom bullet display. */
.password-page { min-height: 100vh; }
.password-page .site-header { position: relative; z-index: 2; }
.password-main {
  position: absolute;
  inset: 0;
  display: flex;
  justify-content: center;
  align-items: center;
  padding: 70px 2vw;
}
.password-form { position: relative; display: flex; flex-direction: column; align-items: center; gap: 0; }
.password-form label { display: block; margin: 0; }
.password-form label, .password-glyphs {
  font-family: "Arial Monospaced MT Std", monospace;
  font-size: 17px;
  font-weight: 400;
  letter-spacing: -0.02em;
  line-height: 1.3;
}
.password-input-wrap { position: relative; width: 18ch; height: 1.3em; }
.password-glyphs {
  position: absolute;
  inset: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  pointer-events: none;
  white-space: nowrap;
  color: #000;
}
.password-form input {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  padding: 0;
  margin: 0;
  border: 0;
  border-radius: 0;
  box-shadow: none;
  appearance: none;
  -webkit-appearance: none;
  background: transparent;
  color: transparent;
  -webkit-text-fill-color: transparent;
  caret-color: transparent;
  text-align: center;
  outline: none;
  font-family: "Arial Monospaced MT Std", monospace;
  font-size: 17px;
  font-weight: 400;
  letter-spacing: -0.02em;
  line-height: 1.3;
}
.password-form input:focus { border: 0; box-shadow: none; outline: none; }
.password-error { position: absolute; top: 100%; left: 50%; transform: translateX(-50%); width: max-content; text-align: center; color: #000; }
.password-error:empty { display: none; }

/* Superscript rendered with real glyphs from the site font, not Unicode fallback. */
sup { font-family: inherit; font-size: 0.7em; line-height: 0; vertical-align: super; letter-spacing: inherit; }

/* Project information: headings immediately followed by indented values;
   one blank line between categories. */
.project-meta-table .extra-content .extra-heading { margin-bottom: 0; }
.project-meta-table .extra-content .extra-spacer { height: 1.3em; }

/* Description: 40-character column, separated from preceding information by 2 line heights. */
.project-meta-table .extra-content .project-content { margin-top: 2.6em; }
.project-description { width: min(100%, 40ch); margin: 0; }
.project-description p {
  margin: 0 0 1.3em;
  text-align: justify;
  text-indent: 2em;
  hyphens: none;
  -webkit-hyphens: none;
  word-break: normal;
  overflow-wrap: break-word;
}
.project-description p:last-child { margin-bottom: 0; }

/* One blank line between competition details and the PDF link. */
.project-meta-table .extra-content .project-document { margin-top: 1.3em; }
.project-document a, .project-video-link a {
  text-decoration: underline;
  text-underline-offset: 0.08em;
}
.project-meta-table .extra-content .project-video-link { margin-top: 1.3em; }

/* Reusable project layout: fixed-width text and an adaptive gallery. */
.project-meta-table tbody tr.extra-row td.extra-content.has-side-image {
  display: flex;
  flex-wrap: wrap;
  column-gap: 2.6em;
  row-gap: 2.6em;
  padding-right: max(0px, calc(2.6em - var(--page-pad)));
  align-items: flex-start;
}
.project-meta-table .extra-content.has-side-image .project-text-column {
  flex: 0 0 min(100%, 40ch);
}
/* Initially retain the original four equal columns to measure their full-size width. */
.project-image-grid {
  display: grid;
  flex: 1 1 0;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 0.5em;
  min-width: 0;
  align-content: start;
}
/* Once measured, keep each image cell unchanged as available columns go 4, 3, 2, 1.
   Flex wrapping puts the entire gallery below the text when even one cell will not fit. */
.project-image-grid.is-adaptive {
  grid-template-columns: repeat(auto-fit, var(--gallery-cell-width));
  min-width: var(--gallery-cell-width);
  max-width: calc(var(--gallery-cell-width) + var(--gallery-cell-width) + var(--gallery-cell-width) + var(--gallery-cell-width) + 1.5em);
}
/* When the gallery has moved below the text, keep a single image per row. */
.project-image-grid.is-stacked {
  flex: 0 0 var(--gallery-cell-width);
  grid-template-columns: var(--gallery-cell-width);
  max-width: var(--gallery-cell-width);
}
.project-image-grid .project-image-item { min-width: 0; aspect-ratio: 1 / 1; margin: 0; }
.project-image-grid .project-image-item a {
  display: flex;
  width: 100%;
  height: 100%;
  align-items: center;
  justify-content: center;
  cursor: zoom-in;
}
.project-image-grid .project-image-item img {
  display: block;
  max-width: 100%;
  max-height: 100%;
  width: auto;
  height: auto;
  object-fit: contain;
}

/* Saut de ligne uniquement pour les groupes d’images explicitement séparés. */
.project-image-group-break { grid-column: 1 / -1; height: 0; }
