/* ── /work : message d'attente ── */
#work-page {
  min-height: 100vh;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: calc(var(--nav-clearance) + 1rem) 2rem 2rem;
}
.work-empty-panel {
  border: 1px solid var(--ui-frame);
  background: rgba(var(--surface-rgb), 0.9);
  box-shadow: 0 16px 44px rgba(var(--shadow-rgb), 0.055);
  display: grid;
  gap: var(--ui-frame-gap);
  padding: var(--ui-frame-pad);
  width: min(420px, calc(100vw - 2rem));
}
/* Bandeau au cadre du bloc, texte au niveau secondaire : la même lecture que
   les panneaux À propos et administration. */
.work-empty-panel > span {
  border: 1px solid var(--ui-frame);
  background:
    linear-gradient(90deg, var(--ui-frame-soft) 0%, rgba(var(--surface-rgb), 0.74) 100%);
  color: var(--fg);
  font-size: 0.66rem;
  letter-spacing: 0.12em;
  line-height: 1.15;
  padding: var(--ui-band-pad);
  text-transform: uppercase;
}
.work-empty-panel p {
  border: 1px solid var(--ui-sub-frame);
  background: rgba(var(--surface-rgb), 0.66);
  color: var(--fg-soft);
  font-size: 0.78rem;
  line-height: 1.35;
  margin: 0;
  padding: var(--ui-text-pad);
}

/* Garde-fou global pour les petits écrans. Les adaptations de composant
   restent dans leurs modules propriétaires. */
@media (max-width: 620px) {
  html, body { overflow-x: hidden; }
  img, video, canvas, svg, iframe { max-width: 100%; }
}