/*
 * Learning Games — front-end styles.
 *
 * Tokens: the `.lg` root reads the theme's custom properties and falls back to the REFOOD
 * brand values. A theme can override any `--lg-*` token on `.lg`.
 * Brand rules: text always black; CTAs black pills with white mono uppercase text; labels
 * bordered, mono uppercase, tilted; titles Unbounded Black uppercase, line-height 90%.
 */

.lg {
  --lg-black: var(--rf-black, #000000);
  --lg-white: var(--rf-white, #ffffff);
  --lg-lime: var(--rf-lime, #b8ff00);
  --lg-orange: var(--rf-deep-orange, #ff4600);
  --lg-blue: var(--rf-blue-violet, #5b59de);
  --lg-silver: var(--rf-silver, #d2d2d2);
  --lg-font-title: var(--font-heading, 'Unbounded', system-ui, sans-serif);
  --lg-font-body: var(--font-body, 'OverusedGrotesk', system-ui, sans-serif);
  --lg-font-mono: var(--font-mono, 'NectoMono', ui-monospace, monospace);
  --lg-radius: 12px;
  --lg-gutter: 30px;
  color: var(--lg-black);
  font-family: var(--lg-font-body);
  font-weight: 500;
  line-height: 1.2;
}

.lg *, .lg *::before, .lg *::after { box-sizing: border-box; }

.lg-sr {
  position: absolute !important;
  width: 1px; height: 1px;
  padding: 0; margin: -1px;
  overflow: hidden; clip: rect(0, 0, 0, 0);
  white-space: nowrap; border: 0;
}

.lg a:not(.lg-btn) { color: inherit; }
.lg :focus-visible { outline: 3px solid var(--lg-black); outline-offset: 3px; }

/* ── Type ────────────────────────────────────────────────────────────── */

.lg-title {
  font-family: var(--lg-font-title);
  font-weight: 900;
  text-transform: uppercase;
  line-height: 0.9;
  letter-spacing: 0;
  margin: 0.4em 0 0.5em;
  font-size: clamp(2rem, 5vw, 3.4rem);
  overflow-wrap: anywhere;
}

.lg-summary {
  font-family: var(--lg-font-title);
  font-weight: 400;
  font-size: clamp(1.05rem, 1.6vw, 1.3rem);
  line-height: 1.25;
  margin: 0 0 1rem;
  max-width: 48ch;
}

.lg-meta, .lg-privacy, .lg-catalog__count {
  font-family: var(--lg-font-mono);
  font-size: 0.78rem;
  text-transform: uppercase;
  letter-spacing: 0;
  margin: 0;
}

/* ── Label (etichetta): bordered, mono, tilted ──────────────────────── */

.lg-tag {
  display: inline-block;
  font-family: var(--lg-font-mono);
  font-size: 0.72rem;
  text-transform: uppercase;
  line-height: 1.1;
  padding: 0.45em 0.6em;
  border: 1.5px solid var(--lg-black);
  background: var(--lg-lime);
  transform: rotate(-6deg);
  transform-origin: center;
}
.lg-tag--silver { background: var(--lg-silver); }
.lg-tag--white { background: var(--lg-white); }
.lg-tag--right { transform: rotate(6deg); }

/* ── CTA pill ───────────────────────────────────────────────────────── */

.lg-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.5rem;
  min-height: 48px;
  padding: 0.8rem 1.8rem;
  border: 2px solid var(--lg-black);
  border-radius: 999px;
  background: var(--lg-black);
  color: var(--lg-white);
  font-family: var(--lg-font-mono);
  font-size: 0.78rem;
  font-weight: 400;
  text-transform: uppercase;
  text-decoration: none;
  cursor: pointer;
  transition: background-color 0.15s, color 0.15s;
}
.lg-btn:hover { background: var(--lg-white); color: var(--lg-black); }
.lg-btn:focus-visible { outline-offset: 4px; }
.lg-btn--ghost { background: var(--lg-white); color: var(--lg-black); }
.lg-btn--ghost:hover { background: var(--lg-black); color: var(--lg-white); }
.lg-btn svg { flex: none; }

/* ── Page frame ─────────────────────────────────────────────────────── */

.lg-page { padding: clamp(2rem, 5vw, 4rem) var(--lg-gutter) clamp(3rem, 6vw, 5rem); }
.lg-page--single { max-width: 820px; margin: 0 auto; }
.lg-page--archive { max-width: 1240px; margin: 0 auto; }
.lg-embed { max-width: 1240px; margin: 0 auto; padding: clamp(1.5rem, 4vw, 3rem) var(--lg-gutter, 30px); }

.lg-back {
  display: inline-flex;
  align-items: center;
  gap: 0.4rem;
  min-height: 44px;
  font-family: var(--lg-font-mono);
  font-size: 0.78rem;
  text-transform: uppercase;
  text-decoration: none;
}
.lg-back:hover { text-decoration: underline; text-underline-offset: 4px; }

.lg-game-head__tag, .lg-archive-head__tag { margin: 1rem 0 0.5rem; padding-left: 0.3rem; }
.lg-archive-head { margin-bottom: 1.5rem; }

/* ── Catalogue ──────────────────────────────────────────────────────── */

.lg-filters {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-end;
  gap: 0.75rem 1rem;
  padding: 1.25rem;
  border: 1.5px solid var(--lg-black);
  border-radius: var(--lg-radius);
  background: var(--lg-white);
  margin: 0 0 1.25rem;
}
.lg-filters__search {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  flex: 1 1 220px;
  min-height: 48px;
  padding: 0 1rem;
  border: 1.5px solid var(--lg-black);
  border-radius: 999px;
}
.lg-filters__search input {
  flex: 1;
  min-width: 0;
  border: 0;
  background: transparent;
  font: inherit;
  font-size: 1rem;
  color: inherit;
}
.lg-filters__search input:focus { outline: none; }
.lg-filters__search:focus-within { outline: 3px solid var(--lg-black); outline-offset: 3px; }
.lg-filters__field { display: flex; flex-direction: column; gap: 0.3rem; flex: 0 1 auto; }
.lg-filters__label {
  font-family: var(--lg-font-mono);
  font-size: 0.7rem;
  text-transform: uppercase;
}
.lg-filters select {
  min-height: 48px;
  padding: 0 2.4rem 0 1rem;
  border: 1.5px solid var(--lg-black);
  border-radius: 999px;
  background: var(--lg-white) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 256 256' fill='%23000'%3E%3Cpath d='M213.66 101.66l-80 80a8 8 0 0 1-11.32 0l-80-80a8 8 0 0 1 11.32-11.32L128 164.69l74.34-74.35a8 8 0 0 1 11.32 11.32z'/%3E%3C/svg%3E") no-repeat right 0.9rem center / 16px;
  font-family: var(--lg-font-mono);
  font-size: 0.78rem;
  text-transform: uppercase;
  color: var(--lg-black);
  appearance: none;
  cursor: pointer;
}
.lg-filters__submit { align-self: flex-end; }
.lg-filters__reset {
  align-self: center;
  font-family: var(--lg-font-mono);
  font-size: 0.78rem;
  text-transform: uppercase;
  text-underline-offset: 4px;
}
.lg-catalog__count { margin: 0 0 1rem 0.25rem; }

.lg-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(min(100%, 280px), 1fr));
  gap: 1.5rem;
}

.lg-card {
  display: flex;
  flex-direction: column;
  border: 1.5px solid var(--lg-black);
  border-radius: var(--lg-radius);
  background: var(--lg-white);
  overflow: hidden;
}
.lg-card__cover { display: block; aspect-ratio: 16 / 10; overflow: hidden; }
.lg-card__img { width: 100%; height: 100%; object-fit: cover; display: block; }
.lg-card__badge {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%; height: 100%;
  border-bottom: 1.5px solid var(--lg-black);
}
.lg-card__badge--lime { background: var(--lg-lime); }
.lg-card__badge--silver { background: var(--lg-silver); }
.lg-card__badge--blue { background: var(--lg-blue); }
.lg-card__badge--orange { background: var(--lg-orange); }
.lg-card__body { display: flex; flex-direction: column; gap: 0.75rem; padding: 1.25rem; flex: 1; }
.lg-card__body .lg-tag { align-self: flex-start; margin: -2rem 0 0 0.25rem; position: relative; }
.lg-card__title {
  font-family: var(--lg-font-title);
  font-weight: 900;
  text-transform: uppercase;
  line-height: 0.95;
  font-size: 1.15rem;
  margin: 0;
}
.lg-card__title a { text-decoration: none; }
.lg-card__title a:hover { text-decoration: underline; text-underline-offset: 4px; }
.lg-card__summary { margin: 0; flex: 1; font-size: 0.98rem; line-height: 1.3; }
.lg-card__cta { align-self: flex-start; margin-top: 0.25rem; }

.lg-pager { display: flex; flex-wrap: wrap; gap: 0.5rem; justify-content: center; margin: 2rem 0 0; }
.lg-pager__link {
  display: inline-flex;
  align-items: center;
  gap: 0.4rem;
  min-width: 44px; min-height: 44px;
  padding: 0 1rem;
  border: 1.5px solid var(--lg-black);
  border-radius: 999px;
  font-family: var(--lg-font-mono);
  font-size: 0.78rem;
  text-transform: uppercase;
  text-decoration: none;
  justify-content: center;
}
.lg-pager__link.is-current { background: var(--lg-black); color: var(--lg-white); }

/* ── The game ───────────────────────────────────────────────────────── */

.lg-game { margin: 1.5rem 0 2rem; }
.lg-game:focus { outline: none; }

.lg-progress {
  display: flex;
  justify-content: space-between;
  gap: 1rem;
  font-family: var(--lg-font-mono);
  font-size: 0.78rem;
  text-transform: uppercase;
  margin: 0 0 0.75rem;
}
.lg-progress__bar {
  height: 6px;
  background: var(--lg-silver);
  border-radius: 999px;
  overflow: hidden;
  margin: 0 0 1.5rem;
}
.lg-progress__fill { height: 100%; background: var(--lg-black); transition: width 0.25s; }

.lg-question {
  font-family: var(--lg-font-title);
  font-weight: 400;
  font-size: clamp(1.25rem, 2.4vw, 1.75rem);
  line-height: 1.2;
  margin: 0 0 1.25rem;
}
.lg-question:focus { outline: none; }

.lg-image { margin: 0 0 1.25rem; }
.lg-image img { display: block; max-width: 100%; height: auto; border-radius: var(--lg-radius); border: 1.5px solid var(--lg-black); }

.lg-choices { list-style: none; margin: 0; padding: 0; display: grid; gap: 0.75rem; }
.lg-choices--tf { grid-template-columns: repeat(auto-fit, minmax(min(100%, 200px), 1fr)); }

.lg-choice {
  display: flex;
  align-items: center;
  gap: 1rem;
  width: 100%;
  min-height: 64px;
  padding: 0.9rem 1.1rem;
  border: 2px solid var(--lg-black);
  border-radius: 18px;
  background: var(--lg-white);
  color: var(--lg-black);
  font: inherit;
  font-size: 1.1rem;
  font-weight: 500;
  text-align: left;
  cursor: pointer;
  transition: background-color 0.15s;
}
.lg-choice:hover:not(:disabled) { background: var(--lg-silver); }
.lg-choice:disabled { cursor: default; }
.lg-choice__key {
  flex: none;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 2.2em;
  height: 2.2em;
  border: 1.5px solid var(--lg-black);
  border-radius: 8px;
  font-family: var(--lg-font-mono);
  font-size: 0.8rem;
  text-transform: uppercase;
}
.lg-choice__icon { flex: none; margin-left: auto; display: none; }
.lg-choice.is-correct { background: var(--lg-lime); }
.lg-choice.is-wrong { background: var(--lg-orange); }
.lg-choice.is-correct .lg-choice__icon, .lg-choice.is-wrong .lg-choice__icon { display: inline-flex; }
.lg-choice.is-chosen { box-shadow: inset 0 0 0 2px var(--lg-black); }

.lg-keys {
  font-family: var(--lg-font-mono);
  font-size: 0.72rem;
  text-transform: uppercase;
  margin: 1rem 0 0;
}

.lg-feedback {
  margin: 1.5rem 0 0;
  padding: 1.25rem 1.4rem;
  border: 2px solid var(--lg-black);
  border-radius: var(--lg-radius);
  background: var(--lg-silver);
}
.lg-feedback--ok { background: var(--lg-lime); }
.lg-feedback--ko { background: var(--lg-orange); }
.lg-feedback:focus { outline: none; }
.lg-feedback__title {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  font-family: var(--lg-font-title);
  font-weight: 900;
  text-transform: uppercase;
  font-size: 1.1rem;
  line-height: 1;
  margin: 0 0 0.75rem;
}
.lg-feedback__was { margin: 0 0 0.75rem; font-weight: 700; }
.lg-feedback__text { margin: 0; font-size: 1.05rem; line-height: 1.35; }
.lg-feedback__source {
  margin: 0.75rem 0 0;
  font-family: var(--lg-font-mono);
  font-size: 0.72rem;
  text-transform: uppercase;
  overflow-wrap: anywhere;
}
.lg-feedback__actions { margin: 1.25rem 0 0; display: flex; flex-wrap: wrap; gap: 0.75rem; }

.lg-result { text-align: center; padding: 1rem 0; }
.lg-result__score {
  font-family: var(--lg-font-title);
  font-weight: 900;
  text-transform: uppercase;
  line-height: 0.95;
  font-size: clamp(1.6rem, 4vw, 2.6rem);
  margin: 0.5rem 0 1rem;
}
.lg-result__score strong { display: inline-block; padding: 0.05em 0.2em; background: var(--lg-lime); }
.lg-result__line { font-family: var(--lg-font-title); font-weight: 400; font-size: 1.15rem; margin: 0 0 1rem; }
.lg-result__closing { font-size: 1.05rem; line-height: 1.4; max-width: 52ch; margin: 0 auto 1.5rem; }
.lg-result__actions { display: flex; flex-wrap: wrap; gap: 0.75rem; justify-content: center; }

.lg-notice { padding: 1rem; border: 1.5px solid var(--lg-black); border-radius: var(--lg-radius); background: var(--lg-silver); }

/* ── Under the game ─────────────────────────────────────────────────── */

.lg-game-foot { border-top: 1.5px solid var(--lg-black); padding-top: 1.25rem; display: grid; gap: 0.75rem; }
.lg-topics { margin: 0; display: flex; flex-wrap: wrap; gap: 0.5rem; }
.lg-topic {
  font-family: var(--lg-font-mono);
  font-size: 0.72rem;
  text-transform: uppercase;
  text-decoration: none;
  padding: 0.4em 0.7em;
  border: 1.5px solid var(--lg-black);
  background: var(--lg-silver);
  transform: rotate(-4deg);
}
.lg-topic:nth-child(even) { transform: rotate(4deg); }
.lg-teachers { margin: 0; line-height: 1.35; }
.lg-teachers svg { vertical-align: -0.2em; margin-right: 0.35rem; }
.lg-teachers a { text-underline-offset: 3px; }

@media (prefers-reduced-motion: reduce) {
  .lg * { transition: none !important; }
}

@media print {
  .lg-back, .lg-filters, .lg-pager, .lg-keys, .lg-feedback__actions, .lg-result__actions, .lg-game-foot { display: none !important; }
}

/* ── Story ──────────────────────────────────────────────────────────── */

.lg-story__text { font-size: clamp(1.2rem, 2.2vw, 1.6rem); }
.lg-choice--story { align-items: flex-start; }
.lg-choice__pic {
  flex: none;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 2.6em; height: 2.6em;
  border: 1.5px solid var(--lg-black);
  border-radius: 10px;
  background: var(--lg-silver);
}
.lg-choice__pic svg { width: 1.6em; height: 1.6em; }
.lg-story__nav { margin: 1rem 0 0; }
.lg-link {
  display: inline-flex;
  align-items: center;
  gap: 0.4rem;
  min-height: 44px;
  padding: 0;
  border: 0;
  background: none;
  color: inherit;
  font-family: var(--lg-font-mono);
  font-size: 0.78rem;
  text-transform: uppercase;
  cursor: pointer;
  text-decoration: underline;
  text-underline-offset: 4px;
}
.lg-story__reminder { margin-top: 1.5rem; }
.lg-story__closing { margin-top: 1.25rem; }
.lg-feedback__kicker {
  font-family: var(--lg-font-mono);
  font-size: 0.72rem;
  text-transform: uppercase;
  margin: 1rem 0 0.35rem;
}
.lg-feedback__text--lead { font-family: var(--lg-font-title); font-weight: 400; font-size: 1.15rem; }
.lg-feedback__deltas {
  font-family: var(--lg-font-mono);
  font-size: 0.78rem;
  text-transform: uppercase;
  margin: 0.75rem 0 0;
}
.lg-ending .lg-feedback__title { font-size: 1.35rem; }

/* ── Giornata insieme ───────────────────────────────────────────────── */

.lg-choices--pick { grid-template-columns: repeat(auto-fit, minmax(min(100%, 220px), 1fr)); }
.lg-choice--pick { flex-direction: column; align-items: center; text-align: center; padding: 1.4rem 1rem; gap: 0.75rem; }
.lg-choice--pick .lg-choice__pic { width: 4em; height: 4em; border-radius: 50%; background: var(--lg-lime); }
.lg-choice--pick .lg-choice__pic svg { width: 2.4em; height: 2.4em; }

.lg-meters {
  border: 1.5px solid var(--lg-black);
  border-radius: var(--lg-radius);
  padding: 1rem 1.25rem;
  margin: 0 0 1.5rem;
  background: var(--lg-white);
}
.lg-meters__title {
  font-family: var(--lg-font-mono);
  font-size: 0.72rem;
  font-weight: 400;
  text-transform: uppercase;
  margin: 0 0 0.75rem;
}
.lg-meters__list { list-style: none; margin: 0; padding: 0; display: grid; gap: 0.6rem; grid-template-columns: repeat(auto-fit, minmax(min(100%, 240px), 1fr)); }
.lg-meter { display: grid; grid-template-columns: minmax(6.5em, auto) 1fr 2.5em; align-items: center; gap: 0.6rem; }
.lg-meter__label { display: inline-flex; align-items: center; gap: 0.4rem; font-size: 0.95rem; font-weight: 700; }
.lg-meter__label svg { width: 1.2em; height: 1.2em; flex: none; }
.lg-meter__bar { display: block; height: 12px; border: 1.5px solid var(--lg-black); border-radius: 999px; background: var(--lg-white); overflow: hidden; }
.lg-meter__fill { display: block; height: 100%; background: var(--lg-orange); transition: width 0.5s, background-color 0.5s; }
.lg-meter.is-well .lg-meter__fill { background: var(--lg-lime); }
.lg-meter__value { font-family: var(--lg-font-mono); font-size: 0.78rem; text-align: right; }

.lg-day__moment {
  font-family: var(--lg-font-mono);
  font-size: 0.78rem;
  text-transform: uppercase;
  margin: 0 0 0.5rem;
}
.lg-result--day { text-align: left; }
.lg-result--day .lg-result__score, .lg-result--day .lg-result__closing { text-align: center; margin-left: auto; margin-right: auto; }
.lg-day__box {
  border: 1.5px solid var(--lg-black);
  border-radius: var(--lg-radius);
  padding: 1rem 1.25rem;
  margin: 0 0 1rem;
}
.lg-day__box--well { background: var(--lg-lime); }
.lg-day__box--tips { background: var(--lg-silver); }
.lg-day__box-title {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  font-family: var(--lg-font-title);
  font-weight: 900;
  text-transform: uppercase;
  font-size: 1rem;
  margin: 0 0 0.6rem;
}
.lg-day__box ul { margin: 0; padding-left: 1.2rem; line-height: 1.4; }
.lg-day__box li + li { margin-top: 0.3rem; }
.lg-result--day .lg-result__actions { justify-content: center; margin-top: 1.5rem; }

/* ── Attestato ──────────────────────────────────────────────────────── */

.lg-cert-form { margin: 1.5rem auto 0; max-width: 520px; text-align: left; }
.lg-cert-form__label { display: block; font-family: var(--lg-font-mono); font-size: 0.72rem; text-transform: uppercase; margin: 0 0 0.4rem; }
.lg-cert-form__row { display: flex; gap: 0.5rem; flex-wrap: wrap; }
.lg-cert-form input {
  flex: 1 1 200px;
  min-height: 48px;
  padding: 0 1rem;
  border: 2px solid var(--lg-black);
  border-radius: 999px;
  font: inherit;
  font-size: 1rem;
  color: inherit;
  background: var(--lg-white);
}

.lg-cert {
  position: fixed;
  inset: 0;
  z-index: 10000;
  overflow: auto;
  background: rgba(0, 0, 0, 0.6);
  padding: 2rem var(--lg-gutter);
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 1rem;
}
.lg-cert__sheet {
  width: min(100%, 720px);
  aspect-ratio: 297 / 210;
  background: var(--lg-white);
  border: 3px solid var(--lg-black);
  border-radius: var(--lg-radius);
  padding: clamp(1.5rem, 5vw, 3rem);
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  text-align: center;
  position: relative;
  color: var(--lg-black);
}
.lg-cert__sheet::before {
  content: '';
  position: absolute;
  inset: 10px;
  border: 1.5px solid var(--lg-black);
  border-radius: 8px;
  pointer-events: none;
}
.lg-cert__tag { margin: 0 0 1.25rem; }
.lg-cert__tag .lg-tag { font-size: 0.85rem; padding: 0.5em 0.8em; }
.lg-cert__name {
  font-family: var(--lg-font-title);
  font-weight: 900;
  text-transform: uppercase;
  line-height: 0.95;
  font-size: clamp(1.4rem, 4vw, 2.4rem);
  margin: 0 0 0.6rem;
  overflow-wrap: anywhere;
}
.lg-cert__blank { display: inline-block; width: 60%; border-bottom: 2px solid var(--lg-black); height: 1em; }
.lg-cert__has, .lg-cert__line { margin: 0.2rem 0; font-size: 1rem; }
.lg-cert__title {
  font-family: var(--lg-font-title);
  font-weight: 400;
  font-size: clamp(1.1rem, 2.6vw, 1.5rem);
  margin: 0.4rem 0;
  padding: 0.05em 0.3em;
  background: var(--lg-lime);
}
.lg-cert__date, .lg-cert__site {
  font-family: var(--lg-font-mono);
  font-size: 0.72rem;
  text-transform: uppercase;
  margin: 0.4rem 0 0;
}
.lg-cert__site { margin-top: 1.25rem; font-weight: 700; }
.lg-cert__actions { display: flex; gap: 0.75rem; flex-wrap: wrap; justify-content: center; }

@media print {
  @page { size: A4 landscape; margin: 12mm; }
  body.lg-print-cert > :not(.lg-cert) { display: none !important; }
  body.lg-print-cert { background: #fff !important; }
  .lg-cert { position: static; background: none; padding: 0; display: block; }
  .lg-cert__sheet { width: 100%; aspect-ratio: auto; min-height: 170mm; border-radius: 0; -webkit-print-color-adjust: exact; print-color-adjust: exact; }
  .lg-cert__actions { display: none !important; }
}

/* ── Printable kits (pages with [learning_games_print]) ─────────────── */

.lg-print-row { margin: 1rem 0 2rem; }

@media print {
  body.lg-kit > :not(main) { display: none !important; }
  body.lg-kit { background: #fff !important; color: #000 !important; }
  body.lg-kit .lg-print-row, body.lg-kit .wp-block-buttons, body.lg-kit .lg-kit-figure { display: none !important; }
  body.lg-kit main { padding: 0 !important; margin: 0 !important; max-width: none !important; }
  body.lg-kit h2 { break-before: page; }
  body.lg-kit h2:first-of-type { break-before: auto; }
  body.lg-kit h2, body.lg-kit h3, body.lg-kit h4 { break-after: avoid; }
  body.lg-kit table, body.lg-kit figure, body.lg-kit ul, body.lg-kit ol, body.lg-kit .wp-block-group { break-inside: avoid; }
  body.lg-kit a { color: #000; text-decoration: none; }
  body.lg-kit .lg-cut { border: 2px dashed #000; padding: 12px; margin: 0 0 12px; break-inside: avoid; }
}
.lg-kit-figure { margin: 1.5rem 0 2rem; }
.lg-kit-figure img { display: block; width: 100%; height: auto; border: 1.5px solid var(--rf-black, #000); border-radius: 12px; }
.lg-cut { border: 2px dashed var(--rf-black, #000); border-radius: 12px; padding: 1rem 1.25rem; margin: 0 0 1rem; }

/* ── Mascot (kids’ games) ─────────────────────────────────────────────── */

.lg-mascot { display: block; width: 150px; height: auto; margin: -0.25rem 0 0.5rem; mix-blend-mode: multiply; }
.lg-mascot--end { width: 220px; margin: 0 auto 0.75rem; }
.lg-result--day .lg-mascot--end { margin-bottom: 1rem; }

/* ── Colouring pages ────────────────────────────────────────────────── */

.lg-grid--drawings { grid-template-columns: repeat(auto-fill, minmax(min(100%, 220px), 1fr)); }
.lg-drawing__cover { aspect-ratio: 210 / 297; background: var(--lg-white); border-bottom: 1.5px solid var(--lg-black); }
.lg-drawing__img { width: 100%; height: 100%; object-fit: contain; display: block; }
.lg-drawing__actions { display: flex; flex-wrap: wrap; gap: 0.5rem; margin-top: 0.25rem; }
.lg-drawing__actions .lg-btn { min-height: 44px; padding: 0.6rem 1.2rem; }