@font-face { font-family: 'Press Start 2P'; font-style: normal; font-weight: 400; font-display: swap; src: url('/fonts/press-start-2p-latin.woff2') format('woff2'); 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: 'Press Start 2P'; font-style: normal; font-weight: 400; font-display: swap; src: url('/fonts/press-start-2p-latin-ext.woff2') format('woff2'); unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF; }

.ue-bereich { background: var(--bg-lavender); scroll-margin-top: 76px; }
.ue-box {
  max-width: 860px;
  margin: 0 auto;
}

.ue-musik {
  display: flex;
  align-items: center;
  gap: 14px;
  flex-wrap: wrap;
  background: var(--white);
  border-radius: var(--radius);
  box-shadow: var(--shadow-sm);
  padding: 12px 18px;
  margin-bottom: 18px;
}
.ue-musik__titel { font-weight: 800; color: var(--navy); margin: 0; flex: 1 1 180px; }
.ue-musik__titel small { display: block; font-weight: 600; color: var(--ink-light); }
.ue-musik__spur {
  flex: 1 1 140px;
  height: 6px;
  border-radius: var(--radius-pill);
  background: var(--purple-soft);
  overflow: hidden;
}
.ue-musik__spur i { display: block; height: 100%; width: 0; background: var(--purple); transition: width .25s linear; }
.ue-musik__laut { display: inline-flex; align-items: center; gap: 6px; flex: 0 1 140px; }
.ue-musik__laut input { width: 100%; accent-color: var(--purple); }

.ue-musik__schalter { display: flex; flex-direction: column; align-items: flex-start; gap: 8px; }
.ue-schalter {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  border: 0;
  background: none;
  font: inherit;
  font-weight: 800;
  color: var(--navy);
  cursor: pointer;
  padding: 6px 0;
}
.ue-schalter__bahn {
  position: relative;
  width: 48px;
  height: 28px;
  border-radius: var(--radius-pill);
  background: #d9dce8;
  transition: background .2s;
}
.ue-schalter__bahn::after {
  content: "";
  position: absolute;
  top: 3px;
  left: 3px;
  width: 22px;
  height: 22px;
  border-radius: 50%;
  background: var(--white);
  box-shadow: var(--shadow-sm);
  transition: transform .2s;
}
.ue-schalter[aria-checked="true"] .ue-schalter__bahn { background: var(--green); }
.ue-schalter[aria-checked="true"] .ue-schalter__bahn::after { transform: translateX(20px); }
.ue-schalter:focus-visible { outline: 3px solid var(--purple); outline-offset: 3px; border-radius: 8px; }

.ue-app { min-height: 420px; }
.ue-app:not(.is-bereit) .ue-ohne-js { display: block; }
.ue-leiste {
  list-style: none;
  display: grid;
  grid-template-columns: repeat(6, minmax(0, 1fr));
  gap: 6px;
  margin: 0 0 14px;
  padding: 0;
  counter-reset: none;
}
.ue-leiste li {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 4px;
  font-size: .78rem;
  font-weight: 700;
  color: var(--ink-light);
  text-align: center;
  line-height: 1.2;
}
.ue-leiste span {
  display: grid;
  place-items: center;
  width: 30px;
  height: 30px;
  border-radius: 50%;
  background: var(--white);
  border: 2px solid #dfe1ec;
  font-family: var(--font-display);
  font-size: .95rem;
  color: var(--ink-light);
}
.ue-leiste .is-fertig span { background: var(--green); border-color: var(--green); color: var(--white); }
.ue-leiste .is-jetzt { color: var(--navy); }
.ue-leiste .is-jetzt span { background: var(--yellow); border-color: var(--yellow-dark); color: var(--navy); }
.ue-leiste .is-offen span { border-color: var(--yellow-dark); color: var(--navy); }
.ue-leiste__knopf {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 4px;
  border: 0;
  background: none;
  padding: 0;
  font: inherit;
  color: inherit;
  cursor: pointer;
}
.ue-leiste__knopf:hover span { transform: scale(1.12); box-shadow: 0 0 0 3px var(--purple-soft); }
.ue-leiste__knopf:hover { color: var(--purple); }
.ue-leiste__knopf span { transition: transform .15s; }
.ue-leiste__knopf:focus-visible { outline: 3px solid var(--purple); outline-offset: 3px; border-radius: 8px; }

.ue-karte,
.ue-start {
  background: var(--white);
  border-radius: var(--radius-lg);
  box-shadow: var(--shadow);
  padding: 30px 34px;
}
.ue-karte__nr,
.ue-start__runde {
  margin: 0 0 4px;
  font-size: .8rem;
  font-weight: 800;
  letter-spacing: .06em;
  text-transform: uppercase;
  color: var(--purple);
}
.ue-karte__titel { margin: 0 0 12px; font-size: 1.6rem; }
.ue-karte__titel:focus { outline: none; }
.ue-karte h3, .ue-start h3 { font-size: 1.1rem; margin: 22px 0 8px; }
.ue-karte p, .ue-start p { color: var(--ink); }

.ue-regel {
  background: var(--bg-peach);
  border-radius: var(--radius);
  padding: 16px 22px;
  margin: 18px 0 22px;
}
.ue-regel h3 { margin-top: 0; }
.ue-regel ol { margin: 0; padding-left: 20px; color: var(--navy); font-weight: 600; }
.ue-regel li + li { margin-top: 6px; }

.ue-hinweis {
  background: var(--bg-mint);
  border-radius: var(--radius-sm);
  padding: 10px 14px;
  font-weight: 600;
}
.ue-satz {
  font-family: var(--font-hand);
  font-size: 1.25rem;
  color: var(--navy) !important;
  text-align: center;
  margin: 22px 0 6px;
}
.ue-klein-text { font-size: .9rem; color: var(--ink-light) !important; }

.ue-knoepfe { display: flex; flex-wrap: wrap; gap: 10px; justify-content: space-between; margin-top: 22px; }
.ue-knoepfe--mitte { justify-content: center; }
.ue-knoepfe .btn[disabled], .ue-frage .btn[disabled] { opacity: .45; cursor: not-allowed; box-shadow: none; }

.ue-fuenf { display: flex; flex-wrap: wrap; gap: 10px; margin: 16px 0 20px; }
.ue-fuenf span {
  font-family: var(--font-display);
  font-size: 1.3rem;
  color: var(--navy);
  background: var(--purple-soft);
  border-radius: var(--radius-sm);
  padding: 8px 14px;
}
.ue-fuenf span { position: relative; }
.ue-fuenf span.is-neu { animation: ue-auftauchen .35s ease-out; box-shadow: 0 0 0 2px var(--purple) inset; }
.ue-countdown-klein {
  display: inline-grid;
  place-items: center;
  width: 26px;
  height: 26px;
  margin-left: 10px;
  border-radius: 50%;
  background: var(--yellow);
  color: var(--navy);
  font-style: normal;
  font-size: .95rem;
  vertical-align: middle;
}
@keyframes ue-auftauchen { from { opacity: 0; transform: translateY(6px) scale(.96); } to { opacity: 1; transform: none; } }
@media (prefers-reduced-motion: reduce) { .ue-fuenf span.is-neu { animation: none; } }
.ue-skala { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 8px; }
.ue-skala__wahl {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 2px;
  border: 2px solid #e2e4ee;
  background: var(--white);
  border-radius: var(--radius);
  padding: 10px 4px;
  font: inherit;
  color: var(--navy);
  cursor: pointer;
}
.ue-skala__wahl b { font-family: var(--font-display); font-size: 1.2rem; }
.ue-skala__wahl small { font-size: .72rem; color: var(--ink); line-height: 1.2; text-align: center; }
.ue-skala__emoji { font-size: 1.6rem; }
.ue-skala__wahl[aria-checked="true"],
.ue-spass button[aria-checked="true"] { border-color: var(--purple); background: var(--purple-soft); }

.ue-bild { display: inline-grid; place-items: center; font-size: 1.6em; line-height: 1; }
.ue-memory { display: flex; flex-direction: column; align-items: center; gap: 6px; margin: 10px 0 16px; }
.ue-memory .ue-bild { font-size: 4.5rem; }
.ue-memory b { font-family: var(--font-display); font-size: 1.4rem; color: var(--navy); font-weight: 500; }
.ue-memory__zahlen { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 8px; max-width: 420px; margin: 0 auto; }
.ue-memory__zahlen button {
  font-family: var(--font-display);
  font-size: 1.4rem;
  color: var(--navy);
  background: var(--purple-soft);
  border: 0;
  border-radius: var(--radius);
  padding: 10px 0;
  cursor: pointer;
}
.ue-memory__zahlen button[disabled] { opacity: .35; cursor: default; }
.ue-geschichte {
  background: var(--bg-mint);
  border-radius: var(--radius);
  padding: 12px 16px;
  margin: 12px 0 0;
  color: var(--navy);
  font-weight: 600;
}
.ue-geschichte p { margin: 6px 0 0; color: var(--navy) !important; }
.ue-rechnung { display: flex; align-items: center; justify-content: center; flex-wrap: wrap; gap: 6px; font-family: var(--font-display); font-size: 1.6rem; color: var(--navy); }
.ue-rechnung i { font-style: normal; color: var(--purple); }
.ue-rechnung b { font-weight: 500; }
.ue-rechnung .ue-bild { font-size: 2.2rem; }
.ue-rechnung--beides .ue-bild { font-size: 1.8rem; margin-right: -2px; }
.ue-rechnung--zahlen { font-size: 2.6rem; }
.ue-frage-bild { margin: 8px 0 14px; }
.ue-frage-bild .ue-rechnung { font-size: 2.2rem; }
.ue-frage-bild .ue-rechnung .ue-bild { font-size: 3rem; }
.ue-rueckmeldung .ue-rechnung { font-size: 1.2rem; margin-top: 6px; }
.ue-rueckmeldung .ue-rechnung .ue-bild { font-size: 1.8rem; }
.ue-geschichte--gross { text-align: center; padding: 22px 18px; }
.ue-geschichte--gross .ue-rechnung .ue-bild { font-size: 3rem; }
.ue-geschichte--gross p { font-size: 1.1rem; }
.ue-geschichte__rechnung { font-family: var(--font-display); font-size: 1.8rem !important; font-weight: 500; color: var(--purple) !important; }
.ue-memory__zahl { font-family: var(--font-display); font-size: 3rem; line-height: 1; color: var(--purple); }
.ue-form-satz { text-align: center; font-weight: 700; color: var(--navy) !important; }
.ue-plan { list-style: none; padding: 0; margin: 14px 0 0; display: grid; gap: 8px; }
.ue-plan li { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; background: var(--bg-peach); border-radius: var(--radius-sm); padding: 8px 14px; color: var(--navy); }

.ue-plan__bilder { display: inline-flex; flex-wrap: wrap; gap: 4px; font-size: 1.4rem; min-width: 0; }
.ue-plan li { min-width: 0; }
.ue-plan small { color: var(--ink); margin-left: auto; }
.ue-tabelle small.ue-tabelle__geschichte { color: #1d6b40; margin-top: 4px; }

.ue-legende { display: flex; flex-wrap: wrap; gap: 8px; margin: 10px 0 14px; font-size: .82rem; font-weight: 700; }
.ue-legende span { border-radius: var(--radius-pill); padding: 4px 10px; }
.ue-legende span.is-aus { opacity: .35; filter: grayscale(1); }

.ue-legende span.ue-zelle--leer { background: #ffdfe6; color: #9c2744; }
.ue-zelle--S { background: #d7f2e1; color: #1d6b40; }
.ue-zelle--K { background: #fff0c2; color: #7a5a00; }
.ue-zelle--L { background: #ffe2c4; color: #9a4a00; }
.ue-zelle--leer { background: #f1f2f7; color: var(--ink); }
.ue-raster { display: grid; gap: 4px; }
.ue-raster__reihe { display: grid; grid-template-columns: repeat(10, minmax(0, 1fr)); gap: 4px; }
.ue-zelle {
  position: relative;
  border: 2px solid transparent;
  border-radius: 10px;
  padding: 8px 0 12px;
  font: inherit;
  font-size: .8rem;
  font-weight: 700;
  cursor: pointer;
  min-height: 44px;
}
.ue-zelle i {
  position: absolute;
  right: 4px;
  bottom: 1px;
  font-style: normal;
  font-family: var(--font-display);
  font-size: .72rem;
}
.ue-zelle[aria-pressed="true"] { border-color: currentColor; }
.ue-zelle { transition: opacity .35s ease, transform .35s ease; }
.ue-zelle.is-verborgen { opacity: 0; transform: scale(.85); pointer-events: none; }
.ue-raster { position: relative; }
.ue-zeiger {
  position: absolute;
  top: 0;
  left: 0;
  margin: -4px 0 0 -4px;
  transition: transform 1.2s cubic-bezier(.4, 0, .2, 1);
  pointer-events: none;
  z-index: 2;
  filter: drop-shadow(0 2px 3px rgba(31, 42, 77, .35));
}
.ue-zeiger::after {
  content: "";
  position: absolute;
  left: -10px;
  top: -10px;
  width: 24px;
  height: 24px;
  border-radius: 50%;
  border: 3px solid var(--purple);
  opacity: 0;
}
.ue-zeiger.is-klick svg { transform: scale(.85); transition: transform .12s; }
.ue-zeiger.is-klick::after { animation: ue-klick .45s ease-out; }
@keyframes ue-klick { from { opacity: .9; transform: scale(.3); } to { opacity: 0; transform: scale(1.6); } }
@media (prefers-reduced-motion: reduce) { .ue-zeiger { transition: none; } .ue-zelle { transition: none; } }
.ue-zelle[aria-disabled="true"] { opacity: .55; cursor: default; }
.ue-zelle:focus-visible { outline: 3px solid var(--purple); outline-offset: 1px; }
.ue-zaehler { font-weight: 700; margin-top: 12px; }
.ue-warte { margin: 10px 0 0; font-weight: 700; color: var(--purple) !important; }

.ue-punkte { display: flex; flex-wrap: wrap; gap: 6px; margin: 12px 0 18px; }
.ue-punkte i { width: 12px; height: 12px; border-radius: 50%; background: #e2e4ee; }
.ue-punkte i.is-fertig { background: var(--green); }
.ue-punkte i.is-jetzt { background: var(--yellow); }

.ue-frage { display: flex; align-items: center; justify-content: center; gap: 14px; flex-wrap: wrap; }
.ue-frage__aufgabe { font-family: var(--font-display); font-size: 2.2rem; color: var(--navy); }
.ue-frage__feld {
  width: 120px;
  font: inherit;
  font-family: var(--font-display);
  font-size: 2.2rem;
  text-align: center;
  color: var(--navy);
  border: 3px solid var(--purple);
  border-radius: var(--radius);
  padding: 6px 8px;
}
.ue-frage__feld:focus { outline: 3px solid var(--yellow); outline-offset: 2px; }
.ue-frage--gross .ue-frage__aufgabe,
.ue-frage--gross .ue-frage__feld { font-size: 3rem; }
.ue-rueckmeldung { min-height: 1.5em; font-weight: 800; text-align: center; margin: 10px 0 0; }
.ue-rueckmeldung.is-richtig { color: var(--green) !important; }
.ue-rueckmeldung.is-falsch { color: var(--red) !important; }

.ue-fakten { list-style: none; padding: 0; margin: 14px 0; display: flex; flex-wrap: wrap; gap: 8px; }
.ue-fakten li { background: var(--bg-blue); border-radius: var(--radius-pill); padding: 6px 14px; color: var(--navy); }
.ue-countdown {
  font-family: var(--font-display);
  font-size: 5rem;
  text-align: center;
  color: var(--purple) !important;
  margin: 30px 0;
}

.ue-tabelle { width: 100%; border-collapse: collapse; margin: 12px 0 6px; }
.ue-tabelle th, .ue-tabelle td { text-align: left; padding: 8px 10px; border-bottom: 1px solid #ececf3; color: var(--navy); vertical-align: top; }
.ue-tabelle thead th { font-size: .78rem; text-transform: uppercase; letter-spacing: .04em; color: var(--ink-light); }
.ue-tabelle tbody th { font-family: var(--font-display); font-weight: 500; }
.ue-tabelle small { display: block; color: var(--ink); font-size: .8rem; }
.ue-tabelle .is-falsch td:nth-child(2) { color: var(--red); }
.ue-spass { display: flex; gap: 8px; flex-wrap: wrap; }
.ue-spass button {
  font-size: 1.8rem;
  border: 2px solid #e2e4ee;
  background: var(--white);
  border-radius: var(--radius);
  padding: 6px 14px;
  cursor: pointer;
}
.ue-spass .ue-wort { font: inherit; font-weight: 800; color: var(--navy); font-size: 1rem; padding: 10px 18px; }

.ue-vergleich { text-align: center; font-weight: 700; color: var(--navy) !important; }
.ue-code {
  text-align: center;
  background: var(--bg-peach);
  border-radius: var(--radius-lg);
  padding: 22px 20px;
  margin-top: 14px;
}
.ue-code__eis { font-size: 2.6rem; margin: 0; }
.ue-code__wert {
  display: inline-block;
  font-family: ui-monospace, "Cascadia Mono", Consolas, monospace;
  font-size: 2rem;
  font-weight: 800;
  letter-spacing: .08em;
  color: var(--navy) !important;
  background: var(--white);
  border: 3px dashed var(--yellow-dark);
  border-radius: var(--radius);
  padding: 10px 18px;
  margin: 6px 0 4px;
}
.ue-wette {
  text-align: left;
  background: var(--white);
  border-radius: var(--radius);
  padding: 14px 18px;
  margin-top: 16px;
}
.ue-wette h3 { margin-top: 0; }
.ue-wette p { margin: 0; }

.ue-ohne-js { display: none; }

@media (max-width: 720px) {
  .ue-karte, .ue-start { padding: 22px 16px; }
  .ue-leiste li { font-size: 0; gap: 0; }
  .ue-leiste li.is-jetzt { font-size: .72rem; gap: 4px; }
  .ue-skala small { display: none; }
  .ue-zelle { font-size: .62rem; padding: 6px 0 10px; min-height: 38px; border-radius: 7px; }
  .ue-zelle i { font-size: .6rem; right: 2px; }
  .ue-raster, .ue-raster__reihe { gap: 3px; }
  .ue-code__wert { font-size: 1.4rem; }
}

.ue-kopf {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  margin: -8px 0 14px;
}
.ue-kopf__eis { font-weight: 700; color: var(--navy); background: var(--bg-peach); border-radius: var(--radius-pill); padding: 4px 12px; font-size: .9rem; }
.ue-kopf__pause {
  font: inherit;
  font-size: .85rem;
  font-weight: 800;
  color: var(--purple);
  background: var(--purple-soft);
  border: 0;
  border-radius: var(--radius-pill);
  padding: 6px 14px;
  cursor: pointer;
}
.ue-kopf__pause:hover { background: #e4dcff; }
.ue-naschbaer { text-align: center; margin: 6px 0 4px; }
.ue-naschbaer__bild { display: block; width: 180px; max-width: 60%; height: auto; margin: 0 auto; animation: ue-huepfen 1.2s ease-in-out 2; }
.ue-naschbaer__plus { font-family: var(--font-display); font-size: 2rem; color: var(--green) !important; margin: 4px 0; }
@keyframes ue-huepfen { 0%, 100% { transform: translateY(0); } 40% { transform: translateY(-12px); } }
@media (prefers-reduced-motion: reduce) { .ue-naschbaer__bild { animation: none; } }
.ue-knoepfe--links { justify-content: flex-start; }
.ue-fortsetzen { margin-top: 22px; padding-top: 16px; border-top: 1px dashed #e2e4ee; }
.ue-fortsetzen h3 { margin: 0 0 4px; }
.ue-fortsetzen label { display: block; color: var(--ink); margin-bottom: 8px; }
.ue-fortsetzen div { display: flex; gap: 8px; flex-wrap: wrap; }
.ue-fortsetzen input {
  font: inherit;
  font-family: ui-monospace, "Cascadia Mono", Consolas, monospace;
  font-weight: 700;
  letter-spacing: .06em;
  text-transform: uppercase;
  border: 2px solid #cfd3e3;
  border-radius: var(--radius-pill);
  padding: 10px 16px;
  min-width: 0;
  flex: 1 1 200px;
}
.ue-fortsetzen .ue-rueckmeldung { text-align: left; }

.ue-code__hinweis { margin-top: 18px !important; }

.ue-karte { position: relative; }
.ue-kopf { position: relative; }
.ue-hand {
  position: absolute;
  top: 0;
  left: 0;
  font-size: 2.2rem;
  line-height: 1;
  z-index: 3;
  pointer-events: none;
  transition: transform 1.2s cubic-bezier(.4, 0, .2, 1), opacity .4s;
  filter: drop-shadow(0 2px 3px rgba(31, 42, 77, .3));
}
.ue-hand.is-tipp { animation: ue-tippen .5s ease-in-out 2; }
.ue-hand.is-weg { opacity: 0; }
@keyframes ue-tippen { 50% { margin-top: -8px; } }
.ue-kopf__pause.is-vorgefuehrt { box-shadow: 0 0 0 4px var(--yellow); background: #fff3c4; }
.ue-kopf__pause { transition: box-shadow .3s, background .3s; }
.ue-sprechblase {
  position: absolute;
  top: calc(100% + 10px);
  right: 0;
  z-index: 2;
  background: var(--navy);
  color: var(--white);
  font-size: .85rem;
  font-weight: 700;
  border-radius: var(--radius-sm);
  padding: 8px 12px;
  max-width: 230px;
  box-shadow: var(--shadow);
  transition: opacity .5s;
}
.ue-sprechblase::before {
  content: "";
  position: absolute;
  top: -6px;
  right: 28px;
  width: 12px;
  height: 12px;
  background: var(--navy);
  transform: rotate(45deg);
}
.ue-sprechblase.is-weg { opacity: 0; }
@media (prefers-reduced-motion: reduce) { .ue-hand { transition: none; } .ue-hand.is-tipp { animation: none; } }

.ue-knoepfe--zurueck { justify-content: flex-start; margin-top: 10px; }

.ue-knoepfe__rechts { display: flex; flex-wrap: wrap; gap: 10px; justify-content: flex-end; }

.ue-auswahl { display: flex; justify-content: center; flex-wrap: wrap; gap: 18px; margin: 22px 0 18px; }
.ue-auswahl__bild {
  width: 104px;
  height: 104px;
  display: grid;
  place-items: center;
  border: 3px solid #e2e4ee;
  border-radius: var(--radius);
  background: var(--white);
  cursor: pointer;
  font-size: 2.6rem;
}
.ue-auswahl__bild .ue-bild { font-size: 3.4rem; line-height: 1; }
.ue-auswahl__bild[aria-pressed="true"] { border-color: var(--purple); background: var(--purple-soft); box-shadow: 0 0 0 3px var(--purple-soft); }
.ue-auswahl__bild:focus-visible { outline: 3px solid var(--purple); outline-offset: 2px; }

.ue-tafel { display: flex; justify-content: center; align-items: stretch; flex-wrap: wrap; gap: 8px; margin: 4px 0 8px; }
.ue-tafel__feld {
  display: flex;
  align-items: flex-end;
  justify-content: center;
  gap: 6px;
  min-width: 64px;
  padding: 10px 12px 8px;
  background: #eee;
  border: 2px solid transparent;
  border-radius: var(--radius-sm);
}
.ue-tafel__ziffer { display: flex; flex-direction: column; align-items: center; gap: 6px; }
.ue-tafel__ziffer .ue-bild { font-size: 2.6rem; line-height: 1; }
.ue-tafel__ziffer b { font-family: var(--font-display); font-weight: 500; font-size: 1.8rem; line-height: 1; color: #9aa1b2; }
.ue-tafel__feld--zeichen { min-width: 0; align-items: center; background: none; border-color: transparent; padding: 10px 2px; }
.ue-tafel__feld--zeichen b { font-family: var(--font-display); font-weight: 500; font-size: 1.8rem; line-height: 1; color: var(--ink-light); }
.ue-tafel__feld--ergebnis { border: 3px solid var(--navy); background: #e6f3ff; box-shadow: 0 4px 0 var(--yellow); }
.ue-tafel__feld--ergebnis .ue-tafel__ziffer b { color: var(--navy); font-weight: 600; font-size: 2rem; }
@media (max-width: 720px) {
  .ue-tafel { gap: 4px; }
  .ue-tafel__feld { min-width: 0; padding: 8px 6px 6px; }
  .ue-tafel__ziffer .ue-bild { font-size: 1.9rem; }
  .ue-tafel__ziffer b, .ue-tafel__feld--zeichen b { font-size: 1.4rem; }
  .ue-tafel__feld--ergebnis .ue-tafel__ziffer b { font-size: 1.6rem; }
}

@media (max-width: 720px) { .ue-auswahl { gap: 12px; } .ue-auswahl__bild { width: 76px; height: 76px; } .ue-auswahl__bild .ue-bild { font-size: 2.4rem; } }

.ue-tafel__glueck { display: flex; align-items: center; gap: 4px; font-size: 3.2rem; line-height: 1; margin-left: 6px; animation: ue-auftauchen .4s ease-out; }
@media (max-width: 720px) { .ue-tafel__glueck { font-size: 2.2rem; margin-left: 2px; } }

.ue-geschichte--gross { position: relative; }
.ue-kleeblatt { position: absolute; top: -26px; right: -18px; font-size: 3.4rem; line-height: 1; rotate: 18deg; animation: ue-auftauchen .45s ease-out .7s both; pointer-events: none; }
@media (max-width: 720px) { .ue-kleeblatt { font-size: 2.4rem; top: -18px; right: -8px; } }

.ue-tafel__feld--zahl { align-items: center; }
.ue-tafel__feld--zahl b { font-family: var(--font-display); font-weight: 600; font-size: 2rem; line-height: 1; color: var(--navy); }
.ue-aufdecken {
  display: flex; flex-direction: column; align-items: center; gap: 6px;
  padding: 4px 8px; border: 0; border-radius: var(--radius-sm); background: none;
  cursor: pointer; transition: transform .15s ease;
}
.ue-aufdecken .ue-bild { font-size: 2.6rem; line-height: 1; }
.ue-aufdecken b { font-family: var(--font-display); font-weight: 600; font-size: 2rem; line-height: 1; color: var(--navy); opacity: 0; transition: opacity .5s ease; }
.ue-aufdecken { position: relative; }
.ue-aufdecken.is-dran:hover { transform: scale(1.08); }
.ue-aufdecken.is-dran .ue-bild { animation: ue-wackeln 1.6s ease-in-out infinite; }
.ue-aufdecken:disabled { cursor: default; opacity: 1; color: inherit; }

.ue-aufdecken__hand {
  position: absolute; right: -14px; bottom: -18px; z-index: 2;
  font-size: 2rem; line-height: 1; pointer-events: none;
  filter: drop-shadow(0 2px 3px rgba(31, 42, 77, .3));
  animation: ue-hand-tippt 1.6s ease-in-out infinite;
}
@keyframes ue-hand-tippt { 0%, 60%, 100% { transform: translate(0, 0); } 30% { transform: translate(-4px, -10px) scale(.92); } }
.ue-aufdecken.is-offen { cursor: default; }
.ue-aufdecken.is-offen b { opacity: 1; }
.ue-aufdecken:focus-visible { outline: 3px solid var(--purple); outline-offset: 2px; }
@keyframes ue-wackeln { 0%, 100% { transform: rotate(0); } 10% { transform: rotate(-8deg); } 20% { transform: rotate(8deg); } 30% { transform: rotate(0); } }
@media (max-width: 720px) {
  .ue-aufdecken .ue-bild { font-size: 1.9rem; }
  .ue-aufdecken b, .ue-tafel__feld--zahl b { font-size: 1.6rem; }
}
@media (prefers-reduced-motion: reduce) { .ue-aufdecken.is-dran .ue-bild, .ue-aufdecken__hand { animation: none; } }

.ue-benennen { display: flex; flex-direction: column; align-items: center; gap: 16px; }
.ue-benennen__zeile { display: flex; align-items: center; justify-content: center; gap: 18px; }
.ue-benennen__zeile > i { font-style: normal; font-family: var(--font-display); font-size: 2.2rem; color: var(--purple); }
.ue-benennen__faktor { display: flex; flex-direction: column; align-items: center; gap: 10px; }
.ue-benennen__faktor .ue-bild { font-size: 3rem; line-height: 1; }
.ue-benennen__feld { width: 88px; }
.ue-benennen .btn[disabled] { opacity: .45; cursor: not-allowed; box-shadow: none; }

.ue-gruppen { display: flex; align-items: center; flex-wrap: wrap; gap: 6px; margin: -2px 0 10px; font-size: .85rem; font-weight: 700; color: var(--ink-light); }
.ue-gruppen > span:first-child { margin-right: 2px; }
.ue-gruppen__nr {
  display: inline-grid; place-items: center; width: 28px; height: 28px; border-radius: 50%;
  border: 2px solid #e2e4ee; background: var(--white); color: #b4b9c8;
  font: inherit; font-size: .85rem; line-height: 1; padding: 0;
}
button.ue-gruppen__nr { cursor: pointer; border-color: var(--purple); color: var(--purple); }
button.ue-gruppen__nr:hover { background: var(--purple-soft); }
button.ue-gruppen__nr:focus-visible { outline: 3px solid var(--purple); outline-offset: 2px; }
.ue-gruppen__nr.is-jetzt { border-color: var(--yellow); background: var(--yellow); color: var(--navy); }

.ue-benennen__feld:disabled { background: #eee; border-color: #d6d9e3; color: #9aa1b2; -webkit-text-fill-color: #9aa1b2; opacity: 1; }
.ue-benennen__frage { font-family: var(--font-display); color: var(--purple); font-weight: 600; }
@media (max-width: 720px) {
  .ue-benennen__zeile { gap: 8px; }
  .ue-benennen__faktor .ue-bild { font-size: 2.2rem; }
  .ue-benennen__feld { width: 64px; font-size: 1.8rem; }
}

.ue-turmrechnung { display: flex; align-items: center; justify-content: center; flex-wrap: wrap; gap: 10px; margin: 8px 0 4px; font-family: var(--font-display); }
.ue-turmrechnung .ue-bild { font-size: 3rem; line-height: 1; }
.ue-turmrechnung > i { font-style: normal; font-size: 2.2rem; color: var(--purple); }
.ue-turmrechnung__frage { min-width: 1.2em; text-align: center; font-weight: 600; }
.ue-turm { display: inline-flex; flex-direction: column; align-items: center; gap: 2px; padding: 6px 8px; border-radius: var(--radius-sm); background: #eee; }
.ue-turm .ue-bild { font-size: 2.2rem; }
.ue-auswahl__bild:disabled { cursor: default; opacity: 1; color: inherit; }
@media (max-width: 720px) { .ue-turmrechnung .ue-bild { font-size: 2.2rem; } .ue-turm .ue-bild { font-size: 1.7rem; } }

.ue-zerlegen__ziel { display: flex; align-items: center; justify-content: center; gap: 10px; margin: 6px 0 10px; font-family: var(--font-display); }
.ue-zerlegen__ziel .ue-bild { font-size: 3.2rem; line-height: 1; }
.ue-zerlegen__ziel i { font-style: normal; font-size: 2.2rem; color: var(--purple); }
.ue-zerlegen { display: flex; flex-direction: column; align-items: center; gap: 10px; margin: 8px 0; }
.ue-zerlegen__wahl {
  min-width: 220px; display: flex; justify-content: center; flex-wrap: wrap; gap: 4px;
  padding: 10px 14px; border: 3px solid #e2e4ee; border-radius: var(--radius); background: var(--white); cursor: pointer;
}
.ue-zerlegen__wahl .ue-bild { font-size: 2rem; line-height: 1; }
.ue-zerlegen__wahl[aria-pressed="true"] { border-color: var(--purple); background: var(--purple-soft); }
.ue-zerlegen__wahl:disabled { cursor: default; opacity: 1; color: inherit; }
.ue-zerlegen__wahl.is-richtig { border-color: var(--green); background: #e8f8ee; }
.ue-zerlegen__wahl.is-falsch { border-color: #e5484d; background: #fdecec; }
.ue-zerlegen__wahl:focus-visible { outline: 3px solid var(--purple); outline-offset: 2px; }
@media (max-width: 720px) { .ue-zerlegen__wahl { min-width: 0; width: 100%; } .ue-zerlegen__wahl .ue-bild { font-size: 1.6rem; } }

.ue-auswahl__bild.is-falsch { opacity: .35; border-color: #e2e4ee; }

.ue-basteln__feld {
  width: 84px; height: 84px; display: grid; place-items: center;
  border: 3px dashed var(--purple); border-radius: var(--radius); background: var(--white); cursor: pointer;
}
.ue-basteln__feld .ue-bild { font-size: 2.8rem; line-height: 1; }
.ue-basteln__feld:focus-visible { outline: 3px solid var(--purple); outline-offset: 2px; }
@media (max-width: 720px) { .ue-basteln__feld { width: 64px; height: 64px; } .ue-basteln__feld .ue-bild { font-size: 2.1rem; } }

.ue-basteln__art { display: inline-flex; flex-direction: column; gap: 4px; }
.ue-basteln__zeichen {
  width: 40px; height: 34px; border: 2px solid #e2e4ee; border-radius: var(--radius-sm); background: var(--white);
  font-family: var(--font-display); font-size: 1.4rem; line-height: 1; color: var(--ink-light); cursor: pointer;
}
.ue-basteln__zeichen[aria-checked="true"] { border-color: var(--purple); background: var(--purple-soft); color: var(--purple); }
.ue-auswahl__bild--neu { position: relative; border-color: var(--yellow); }
.ue-auswahl__bild--neu::after { content: "neu"; position: absolute; top: -10px; right: -8px; padding: 1px 6px; border-radius: var(--radius-pill); background: var(--yellow); color: var(--navy); font-size: .7rem; font-weight: 800; }

.ue-zielzahl { margin: 4px 0 0; text-align: center; font-family: var(--font-display); font-weight: 600; font-size: 4.5rem; line-height: 1; color: var(--purple); }

.ue-turmrechnung > i.ue-zeichen-wackelt { display: inline-block; font-weight: 700; animation: ue-zeichen-wackeln 1.5s ease-in-out 2;   }
@keyframes ue-zeichen-wackeln { 0%, 100% { transform: rotate(0) scale(1); } 15% { transform: rotate(-14deg) scale(1.25); } 30% { transform: rotate(14deg) scale(1.25); } 45% { transform: rotate(0) scale(1); } }
@media (prefers-reduced-motion: reduce) { .ue-turmrechnung > i.ue-zeichen-wackelt { animation: none; } }

.ue-pyramide { display: flex; flex-direction: column; align-items: center; gap: 10px; margin: 10px 0; }
.ue-pyramide__zeile { display: flex; align-items: center; justify-content: center; flex-wrap: wrap; gap: 6px; }
.ue-pyramide__block {
  display: inline-flex; align-items: center; gap: 3px; padding: 6px 8px;
  border: 2px solid #e2e4ee; border-radius: var(--radius-sm); background: var(--white); font-family: var(--font-display);
}
.ue-pyramide__block .ue-bild { font-size: 1.5rem; line-height: 1; }
.ue-pyramide__block i, .ue-pyramide__op { font-style: normal; color: var(--purple); font-family: var(--font-display); }
.ue-pyramide__op { font-size: 1.3rem; font-weight: 700; }
.ue-pyramide__block.is-jetzt { border: 3px solid var(--yellow); background: #fff8e1; }
.ue-pyramide__frage { font-weight: 700; min-width: .8em; text-align: center; }
.ue-auswahl__bild--breit { width: auto; min-width: 104px; padding: 0 12px; display: inline-flex; align-items: center; justify-content: center; gap: 2px; }
.ue-auswahl__bild--breit .ue-bild { font-size: 2.4rem; }
@media (max-width: 720px) { .ue-pyramide__block .ue-bild { font-size: 1.1rem; } .ue-pyramide__block { padding: 4px 5px; } }

.ue-spiel { display: flex; align-items: flex-start; gap: 16px; margin: 10px 0; }
.ue-spiel__tnt {
  flex: 0 0 auto; width: 84px; height: 84px; display: grid; place-items: center; touch-action: none;
  border: 3px solid var(--yellow); border-radius: var(--radius); background: #fff8e1; cursor: grab;
}
.ue-spiel__tnt .ue-bild { font-size: 3rem; line-height: 1; }
.ue-spiel__tnt.is-gewaehlt { box-shadow: 0 0 0 4px var(--yellow); }
.ue-spiel__feld { flex: 1; display: flex; flex-wrap: wrap; gap: 6px; min-height: 84px; padding: 8px; border-radius: var(--radius); background: #eef6ff; }
.ue-spiel__bild { width: 56px; height: 56px; display: grid; place-items: center; border: 2px solid #e2e4ee; border-radius: var(--radius-sm); background: var(--white); cursor: pointer; animation: ue-auftauchen .3s ease-out; }
.ue-spiel__bild .ue-bild { font-size: 2rem; line-height: 1; }

.ue-spiel__geist { position: fixed; z-index: 2000; pointer-events: none; transform: translate(-50%, -50%) scale(1.1); font-size: 3rem; line-height: 1; filter: drop-shadow(0 6px 8px rgba(31, 42, 77, .35)); opacity: .95; }
@media (max-width: 720px) { .ue-spiel { flex-direction: column; align-items: center; } .ue-spiel__feld { width: 100%; } .ue-spiel__bild { width: 46px; height: 46px; } .ue-spiel__bild .ue-bild { font-size: 1.6rem; } }

.ue-tafel__ziffer--portal .ue-bild { animation: ue-portal-leuchten 1s ease-in-out 1s both; }
@keyframes ue-portal-leuchten {
  0%, 100% { filter: none; transform: scale(1); }
  40% { filter: drop-shadow(0 0 6px #b57bff) drop-shadow(0 0 14px #8a3cff); transform: scale(1.2); }
}
.ue-tafel__ziffer--verschluckt { max-width: 60px; overflow: hidden; animation: ue-verschlucken .9s ease-in 1.6s forwards; }
@keyframes ue-verschlucken {
  0% { transform: none; opacity: 1; max-width: 60px; }
  70% { transform: translateX(28px) scale(.3) rotate(200deg); opacity: .7; max-width: 60px; }
  100% { transform: translateX(34px) scale(0) rotate(360deg); opacity: 0; max-width: 0; margin: 0; padding: 0; }
}
@media (prefers-reduced-motion: reduce) {
  .ue-tafel__ziffer--portal .ue-bild { animation: none; }
  .ue-tafel__ziffer--verschluckt { animation: none; display: none; }
}

.ue-tafel__mal { font-family: var(--font-display); font-size: 2rem; line-height: 1.3; color: var(--purple); }
.ue-tafel__ziffer--mal { animation-delay: 1.75s; }

.ue-ueberblick { display: flex; flex-direction: column; gap: 3px; margin: 10px 0; overflow-x: auto; }
.ue-ueberblick__zeile { display: grid; grid-template-columns: repeat(10, minmax(0, 1fr)); gap: 3px; min-width: 520px; }
.ue-ueberblick__feld {
  display: flex; align-items: center; justify-content: center; gap: 1px; min-height: 34px; padding: 2px;
  border-radius: 6px; background: #f3f4f8; color: #b4b9c8; font-size: .75rem; font-weight: 700; white-space: nowrap;
}
.ue-ueberblick__feld.is-S { background: #d7f2e1; color: #1d6b40; }
.ue-ueberblick__feld.is-K { background: #fff0c2; color: #7a5a00; }
.ue-ueberblick__feld.is-L { background: #ffe2c4; color: #9a4a00; }
.ue-ueberblick__feld.is-leer { background: #ffdfe6; color: #9c2744; }
.ue-ueberblick__feld.is-bild { color: var(--navy); }
.ue-ueberblick__feld .ue-bild { font-size: .95rem; line-height: 1; }
.ue-ueberblick__feld i { font-style: normal; color: var(--purple); font-size: .7rem; }

.ue-pyramide { gap: 0; }
.ue-pyramide__zeile--teile { position: relative; display: grid; grid-template-columns: 1fr 1fr; column-gap: 28px; padding-top: 22px; }
.ue-pyramide__zeile--teile .ue-pyramide__block { justify-content: center; }
.ue-pyramide__zeile--teile::before { content: ""; position: absolute; top: 0; left: calc(50% - 1px); width: 2px; height: 11px; background: #b9bed3; }
.ue-pyramide__zeile--teile .ue-pyramide__block { position: relative; }
.ue-pyramide__zeile--teile .ue-pyramide__block::before { content: ""; position: absolute; top: -11px; left: calc(50% - 1px); width: 2px; height: 11px; background: #b9bed3; }
.ue-pyramide__zeile--teile .ue-pyramide__block::after { content: ""; position: absolute; top: -11px; height: 2px; background: #b9bed3; }
.ue-pyramide__zeile--teile .ue-pyramide__block:first-child::after { left: 50%; right: -14px; }
.ue-pyramide__zeile--teile .ue-pyramide__block:last-child::after { left: -14px; right: 50%; }

.ue-freischalten__bild { display: block; text-align: center; animation: ue-auftauchen .5s ease-out; }
.ue-freischalten__bild .ue-bild { font-size: 6rem; line-height: 1; }
.ue-schalter:disabled { opacity: .55; cursor: not-allowed; }

.ue-asche { display: block; width: 34px; height: 18px; margin-top: 10px; border-radius: 50% 50% 6px 6px / 100% 100% 6px 6px; background: radial-gradient(circle at 35% 40%, #9a9a9a 0 3px, transparent 4px), radial-gradient(circle at 65% 55%, #7d7d7d 0 2px, transparent 3px), #5f5f5f; }

.ue-spiel__bild { touch-action: none; }
.ue-spiel__bild.is-gewaehlt { border-color: var(--purple); box-shadow: 0 0 0 3px var(--purple-soft); }
.ue-spiel__rechnung { display: flex; align-items: flex-end; justify-content: center; flex-wrap: wrap; gap: 8px; margin: 4px 0 10px; font-family: var(--font-display); }
.ue-spiel__rechnung i { font-style: normal; color: var(--purple); font-size: 1.4rem; padding-bottom: 4px; }
.ue-spiel__zahl { display: inline-flex; flex-direction: column; align-items: center; gap: 2px; }
.ue-spiel__zahl .ue-bild { font-size: 1.8rem; line-height: 1; }
.ue-spiel__zahl b { color: var(--navy); font-size: 1.3rem; font-weight: 600; line-height: 1; }

.ue-farm { margin: 10px auto; padding: 10px 12px; max-width: 420px; border-radius: var(--radius); background: #dff3cf; }
.ue-farm__baeume { display: flex; justify-content: space-around; font-size: 1.8rem; line-height: 1; }
.ue-farm__mitte { display: flex; align-items: center; justify-content: center; gap: 12px; margin: 8px 0; }
.ue-farm__baeume--seite { flex-direction: column; gap: 14px; }
.ue-farm__gehege {
  display: grid; gap: 6px; padding: 10px;
  border: 6px solid #a0703a; border-radius: 6px;
  background: #c8e6a8;
  box-shadow: inset 0 0 0 2px #7a4f22, 0 0 0 2px #7a4f22;
  background-image: repeating-linear-gradient(90deg, transparent 0 30px, rgba(122, 79, 34, .15) 30px 32px);
}
.ue-farm__feld { width: 64px; height: 64px; display: grid; place-items: center; border: 2px dashed #8fbf6a; border-radius: 6px; background: #d9f0c2; cursor: pointer; }
.ue-farm__feld .ue-bild { font-size: 2.4rem; line-height: 1; animation: ue-auftauchen .3s ease-out; }
.ue-farm__stall { display: flex; align-items: center; justify-content: center; gap: 10px; margin: 6px 0; font-weight: 700; color: var(--ink-light); }
.ue-farm__tier { width: 64px; height: 64px; display: grid; place-items: center; border: 3px solid var(--yellow); border-radius: var(--radius); background: #fff8e1; cursor: grab; touch-action: none; }
.ue-farm__tier .ue-bild { font-size: 2.4rem; line-height: 1; }
@media (max-width: 720px) { .ue-farm__baeume { font-size: 1.4rem; } }

.ue-farm__feld { position: relative; }
.ue-herzen { position: absolute; left: 50%; top: -6px; pointer-events: none; }
.ue-herzen i { position: absolute; font-style: normal; font-size: 1rem; opacity: 0; animation: ue-herz-steigt 1.6s ease-out forwards; }
.ue-herzen i:nth-child(1) { left: -18px; }
.ue-herzen i:nth-child(2) { left: -6px; animation-delay: .2s; }
.ue-herzen i:nth-child(3) { left: 6px; animation-delay: .4s; }
@keyframes ue-herz-steigt { 0% { opacity: 0; transform: translateY(0) scale(.6); } 20% { opacity: 1; } 100% { opacity: 0; transform: translateY(-46px) scale(1.2); } }
.ue-farm__tier.is-gewaehlt { box-shadow: 0 0 0 4px var(--yellow); }
.ue-farm-knopf { margin-left: 10px; padding: 3px 10px; border: 2px solid #8fbf6a; border-radius: var(--radius-pill); background: #dff3cf; color: #3d6b1f; font: inherit; font-size: .8rem; font-weight: 800; cursor: pointer; }
.ue-karte--farm > :not(.ue-farm-fenster) { display: none; }
@media (prefers-reduced-motion: reduce) { .ue-herzen i { animation: none; opacity: 1; } }

.ue-rezepte { display: flex; flex-direction: column; gap: 14px; margin: 12px 0; }
.ue-rezept { padding: 14px 16px; border: 2px solid #f0e2c4; border-radius: var(--radius); background: #fffaf0; }
.ue-rezept__name { margin: 0 0 8px; font-family: var(--font-display); font-size: 1.2rem; color: var(--navy); }
.ue-rezept__text { margin: 8px 0 0; text-align: center; color: var(--ink-light); }

.ue-farm__frage { margin-top: 8px; }
.ue-farm__frage label { flex-basis: 100%; text-align: center; color: var(--navy); }

.ue-farm__gefressen { position: absolute; left: 0; right: 0; bottom: 2px; text-align: center; font-size: .7rem; line-height: 1; letter-spacing: -2px; }
.ue-farm__feld.is-satt { border: 2px solid var(--green); background: #e8f8ee; }
.ue-farm__satt { position: absolute; top: -8px; right: -8px; width: 20px; height: 20px; display: grid; place-items: center; border-radius: 50%; background: var(--green); color: #fff; font-size: .75rem; font-weight: 800; }

.ue-auswahl__bild.is-wackelt .ue-bild { animation: ue-wackeln 1.6s ease-in-out infinite; }
@media (prefers-reduced-motion: reduce) { .ue-auswahl__bild.is-wackelt .ue-bild { animation: none; } }

.ue-basteln__ziel { display: grid; place-items: center; width: 84px; height: 84px; border: 3px solid var(--yellow); border-radius: var(--radius); background: #fff8e1; }
.ue-basteln__ziel .ue-bild { font-size: 2.8rem; line-height: 1; }
.ue-auswahl__bild.is-gesperrt { cursor: not-allowed; opacity: 1; color: inherit; }
@media (max-width: 720px) { .ue-basteln__ziel { width: 64px; height: 64px; } .ue-basteln__ziel .ue-bild { font-size: 2.1rem; } }

.ue-farm__kiste { position: relative; display: flex; align-items: center; justify-content: center; gap: 10px; margin: 8px auto 0; padding: 6px 12px; width: fit-content; border: 2px solid #c9a46a; border-radius: var(--radius); background: #fbf1df; }
.ue-farm__kiste-bild { font-size: 2rem; line-height: 1; }
.ue-farm__feld .ue-asche { margin-top: 0; }

.ue-asche--turm { width: 44px; height: 24px; margin-top: 18px; }

.ue-turmrechnung__zahl { font-family: var(--font-display); font-size: 2.6rem; font-weight: 600; line-height: 1; color: var(--navy); }

.ue-aschenturm { display: inline-flex; flex-direction: column; align-items: center; gap: 3px; }
.ue-aschenturm .ue-asche { margin-top: 0; width: 38px; height: 18px; }

.ue-raster__reihe.is-leer { display: none; }

.ue-tafel__ziffer--gross { align-self: center; }
.ue-tafel__ziffer--gross b { font-size: 3.4rem; font-weight: 600; color: var(--navy); }
@media (max-width: 720px) { .ue-tafel__ziffer--gross b { font-size: 2.6rem; } }

.ue-farm__baum, .ue-farm__fels { position: relative; padding: 2px; border: 0; background: none; font: inherit; line-height: 1; cursor: pointer; touch-action: none; user-select: none; -webkit-user-select: none; -webkit-touch-callout: none; border-radius: 8px; }
.ue-farm__baum:focus-visible, .ue-farm__fels:focus-visible { outline: 3px solid var(--purple); }
.ue-farm__fels { font-size: 2.6rem; }
.ue-farm__fels.is-zu { opacity: .7; }
.ue-farm__baum.is-halten, .ue-farm__fels.is-halten { animation: ue-hacken .18s linear infinite; }

.ue-farm__baum.is-leer { opacity: .4; filter: grayscale(.8); }
.ue-farm__baum.is-halten::after, .ue-farm__fels.is-halten::after { content: ""; position: absolute; left: 10%; bottom: -4px; height: 4px; width: 80%; border-radius: 2px; background: var(--yellow); transform-origin: left; animation: ue-halten .9s linear forwards; }
@keyframes ue-hacken { 0%, 100% { transform: rotate(0); } 50% { transform: rotate(-6deg); } }
@keyframes ue-halten { from { transform: scaleX(0); } to { transform: scaleX(1); } }
.ue-brett { display: inline-block; width: 20px; height: 8px; margin: 1px; border-radius: 2px; background: linear-gradient(#c08a4e, #a0703a); box-shadow: inset 0 -1px 0 #7a4f22; vertical-align: middle; }
.ue-erz { display: inline-block; width: 14px; height: 14px; margin: 1px; border-radius: 4px; background: radial-gradient(circle at 30% 35%, #e0a96d 0 2px, transparent 3px), radial-gradient(circle at 70% 65%, #e0a96d 0 2px, transparent 3px), #8a8f99; vertical-align: middle; }
.ue-barren { display: inline-block; width: 20px; height: 8px; margin: 1px; border-radius: 2px 2px 3px 3px; background: linear-gradient(#eef0f4, #b9bec8); box-shadow: inset 0 -1px 0 #8a8f99, 0 0 0 1px #9aa0aa; vertical-align: middle; }
.ue-werkstatt { margin: 10px auto 0; padding: 8px 12px; max-width: 420px; border: 2px solid #c9a46a; border-radius: var(--radius); background: #fbf1df; }
.ue-werkstatt__vorrat { display: flex; flex-wrap: wrap; align-items: center; gap: 4px 8px; margin: 0; font-size: .85rem; font-weight: 700; color: var(--ink-light); }
.ue-werkstatt__vorrat i { font-style: normal; }
.ue-werkstatt__bank { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; margin-top: 8px; }
.ue-werkstatt__werkbank { font-size: 2rem; line-height: 1; }
.ue-werkstatt__ding { display: inline-flex; align-items: center; gap: 2px; }
.ue-werkstatt__ding .ue-bild { font-size: 1.8rem; line-height: 1; }
.ue-werkstatt__ding b { font-size: .8rem; color: var(--ink-light); }
.ue-werkstatt__rezept { display: inline-flex; align-items: center; gap: 6px; padding: 6px 10px; border: 2px solid var(--yellow); border-radius: var(--radius); background: #fff8e1; font: inherit; cursor: pointer; }
.ue-werkstatt__rezept:disabled { border-color: #e3e5ec; background: #f6f7fa; cursor: not-allowed; opacity: .6; }
.ue-werkstatt__rezept i { font-style: normal; font-weight: 800; color: var(--purple); }
.ue-werkstatt__rezept .ue-bild { font-size: 1.6rem; line-height: 1; }
.ue-werkstatt__preis { display: inline-flex; flex-wrap: wrap; max-width: 92px; align-items: center; }
.ue-werkstatt__gebaut { display: flex; flex-wrap: wrap; gap: 10px; margin: 8px 0 0; }
.ue-farm__kiste-name { font-weight: 800; color: #7a5410; }
.ue-farm__kiste-name b { color: var(--navy); }

.ue-regione { display: flex; flex-wrap: wrap; justify-content: center; gap: 10px; margin: 10px auto 0; max-width: 420px; }
.ue-region { position: relative; display: flex; flex-direction: column; align-items: center; gap: 2px; min-width: 120px; padding: 6px 14px 8px; border: 2px solid #b9bec8; border-radius: var(--radius); background: #eceef2; }
.ue-region.is-zu { border-style: dashed; background: #f3f4f8; color: var(--ink-light); }
.ue-region.is-neu::after { content: "neu"; position: absolute; top: -10px; right: -8px; padding: 1px 6px; border-radius: var(--radius-pill); background: var(--yellow); color: var(--navy); font-size: .7rem; font-weight: 800; }
.ue-region__name { margin: 0; font-size: .8rem; font-weight: 800; text-transform: uppercase; letter-spacing: .04em; color: var(--ink-light); }
.ue-region__schloss { font-size: 2rem; line-height: 1.2; filter: grayscale(1); opacity: .7; }
.ue-region__ab { margin: 0; font-size: .85rem; font-weight: 700; }

.ue-farm-flaeche { display: grid; grid-template-columns: auto auto auto; grid-template-areas: "links wiese bereich" "stall stall stall" "kiste kiste kiste"; justify-content: center; align-items: center; column-gap: 14px; }
.ue-farm-flaeche > .ue-farm { grid-area: wiese; margin: 10px 0; }
.ue-farm-flaeche > .ue-regione { grid-area: bereich; flex-direction: column; margin: 0; }
.ue-farm-flaeche > .ue-regione--links { grid-area: links; }
.ue-farm-flaeche > .ue-farm__stall { grid-area: stall; }
.ue-farm-flaeche > .ue-farm__kiste { grid-area: kiste; }
@media (max-width: 720px) {
  .ue-farm-flaeche { grid-template-columns: 1fr 1fr; grid-template-areas: "wiese wiese" "stall stall" "kiste kiste" "links bereich"; }
  .ue-farm-flaeche > .ue-farm { margin: 10px auto; }
  .ue-farm-flaeche > .ue-regione { flex-direction: row; margin-top: 10px; }
}

.ue-region--offen { font: inherit; cursor: pointer; border-color: #8a8f99; background: #eceef2; }
.ue-region--offen:hover { background: #e2e5ea; }
.ue-region--offen:focus-visible { outline: 3px solid var(--purple); }
.ue-region__bild { font-size: 2.2rem; line-height: 1.1; }

.ue-gebirge { position: relative; height: 240px; max-width: 440px; margin: 10px auto; overflow: hidden; border-radius: var(--radius); background: linear-gradient(#cfe8ff 0 58%, #a8d88f 58% 100%); }
.ue-gebirge__wasserfall:focus-visible { outline: 3px solid var(--purple); border-radius: 6px; }
.ue-gebirge__fels:focus-visible { outline: 3px solid var(--purple); }
.ue-gebirge__fels.is-halten { animation: ue-hacken .18s linear infinite; }
.ue-gebirge__fels.is-halten::after { content: ""; position: absolute; left: 10%; bottom: -6px; height: 4px; width: 80%; border-radius: 2px; background: var(--yellow); transform-origin: left; animation: ue-halten .9s linear forwards; }

.ue-konfetti { position: fixed; inset: 0; pointer-events: none; overflow: hidden; z-index: 1000; }
.ue-konfetti i { position: absolute; top: -12px; width: 8px; height: 12px; border-radius: 2px; animation: ue-konfetti linear forwards; }
@keyframes ue-konfetti { to { top: 105%; transform: rotate(540deg) translateX(30px); } }

.ue-werkstatt__titel { margin: 0 0 4px; font-size: .8rem; font-weight: 800; text-transform: uppercase; letter-spacing: .04em; color: #7a5410; }
.ue-werkstatt__oeffnen { display: inline-flex; align-items: center; gap: 6px; margin-top: 8px; padding: 6px 12px; border: 2px solid var(--yellow); border-radius: var(--radius-pill); background: #fff8e1; font: inherit; font-weight: 800; color: var(--navy); cursor: pointer; }
.ue-werkstatt__oeffnen span { font-size: 1.3rem; }
.ue-modal { position: fixed; inset: 0; z-index: 900; display: grid; place-items: center; padding: 16px; background: rgba(20, 24, 40, .45); }
.ue-modal__kasten { width: min(440px, 100%); max-height: calc(100vh - 32px); overflow: auto; padding: 18px 20px; border-radius: var(--radius); background: #fff; box-shadow: 0 12px 40px rgba(0, 0, 0, .25); }
.ue-modal__titel { margin: 0 0 8px; font-family: var(--font-display); font-size: 1.4rem; }
.ue-modal__leer { padding: 10px 12px; border-radius: var(--radius); background: #f3f4f8; }

.ue-raster3 { display: inline-grid; grid-template-columns: repeat(3, 30px); gap: 3px; padding: 4px; border-radius: 6px; background: #8b8b8b; }
.ue-raster3__feld { display: grid; place-items: center; width: 30px; height: 30px; background: #c6c6c6; box-shadow: inset 2px 2px 0 #555, inset -2px -2px 0 #fff; }
.ue-raster3__feld .ue-brett, .ue-raster3__feld .ue-barren { margin: 0; }
.ue-rezept__werkbank { display: flex; align-items: center; justify-content: center; gap: 10px; }
.ue-rezept__werkbank > i { font-style: normal; font-weight: 800; font-size: 1.4rem; color: var(--purple); }
.ue-werkstatt__knoepfe { display: flex; flex-wrap: wrap; gap: 8px; margin: 0; }

.ue-modal__kasten--frage { text-align: center; }
.ue-modal__bild { margin: 0 0 6px; font-size: 2.6rem; line-height: 1; }
.ue-modal__kasten--frage .ue-farm__frage { justify-content: center; }

.ue-farm__kiste { flex-wrap: wrap; max-width: 240px; }
.ue-kiste__ding { display: inline-flex; flex-wrap: wrap; align-items: center; max-width: 120px; }
.ue-farm__kiste-knoepfe { display: flex; flex-wrap: wrap; justify-content: center; gap: 6px; flex-basis: 100%; }
.ue-farm__kiste-knoepfe .ue-werkstatt__oeffnen { margin-top: 2px; padding: 4px 10px; font-size: .85rem; }
.ue-gebirge__kiste { display: flex; justify-content: center; }

.ue-kopf__rechts { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 6px; }
.ue-kopf__rezepte { background: #fff4dc; color: #7a5410; }

.ue-modal__kasten.ue-mc { border-radius: 6px; background: #c6c6c6; color: #3f3f3f; box-shadow: inset 3px 3px 0 #fff, inset -3px -3px 0 #555, 0 12px 40px rgba(0, 0, 0, .3); }
.ue-mc__titel { margin: 0 0 4px; font-family: var(--font-display); font-size: 1.3rem; color: #3f3f3f; }
.ue-mc__tipp { margin: 0 0 8px; font-size: .9rem; }
.ue-mc__label { display: block; margin: 8px 0 4px; font-weight: 800; font-size: .9rem; color: #3f3f3f; }
.ue-mc__zeile { display: flex; align-items: center; justify-content: center; gap: 14px; }
.ue-mc__raster { display: grid; grid-template-columns: repeat(3, 46px); gap: 4px; }
.ue-mc__slot { position: relative; display: grid; place-items: center; width: 46px; height: 46px; padding: 0; border: 0; border-radius: 0; background: #8b8b8b; box-shadow: inset 2px 2px 0 #373737, inset -2px -2px 0 #fff; font: inherit; cursor: pointer; }
.ue-mc__slot:disabled { cursor: default; }
.ue-mc__slot.is-gewaehlt { outline: 3px solid var(--yellow); outline-offset: -1px; }
.ue-mc__slot:focus-visible { outline: 3px solid var(--purple); }
.ue-mc__slot .ue-bild { font-size: 1.6rem; line-height: 1; }
.ue-mc__slot .ue-brett, .ue-mc__slot .ue-barren { width: 30px; height: 11px; margin: 0; }
.ue-mc__slot .ue-erz { width: 22px; height: 22px; margin: 0; }
.ue-mc__slot b { position: absolute; right: 3px; bottom: 1px; font-size: .8rem; font-weight: 800; color: #fff; text-shadow: 1px 1px 0 #3f3f3f; }
.ue-mc__slot--ergebnis { width: 60px; height: 60px; }
.ue-mc__slot--ergebnis.is-fertig { animation: ue-auftauchen .3s ease-out, ue-leuchten 1.4s ease-in-out .3s infinite; }
.ue-mc__pfeil { font-style: normal; font-size: 1.8rem; color: #8b8b8b; }
.ue-mc__meldung { min-height: 1.2em; margin: 8px 0 0; }
.ue-mc__inventar { display: grid; grid-template-columns: repeat(9, minmax(0, 46px)); gap: 4px; justify-content: center; }
.ue-mc__inventar .ue-mc__slot { width: auto; height: auto; aspect-ratio: 1; }
.ue-mc__inventar .ue-mc__slot .ue-brett, .ue-mc__inventar .ue-mc__slot .ue-barren { width: 70%; }

.ue-holz { display: inline-block; font-size: 1rem; line-height: 1; vertical-align: middle; }
.ue-raster3__feld .ue-holz { font-size: 1.2rem; }
.ue-mc__slot .ue-holz { font-size: 1.6rem; }
.ue-mc__geist .ue-holz { font-size: 2rem; }
.ue-mc__geist .ue-barren { width: 30px; height: 11px; }

.ue-farm__hinweis { display: flex; align-items: center; gap: 12px; margin: 4px 0 12px; padding: 14px 18px; border: 3px solid #e0a400; border-radius: var(--radius); background: var(--yellow); color: var(--navy); font-size: 1.15rem; line-height: 1.35; box-shadow: 0 6px 0 #e0a400; animation: ue-hinweis .5s ease-out; }
.ue-farm__hinweis-bild { font-size: 2.2rem; line-height: 1; animation: ue-wippen 1.4s ease-in-out infinite; }
.ue-farm__hinweis.is-steht { animation: none; }
@keyframes ue-hinweis { 0% { transform: scale(.9); opacity: 0; } 70% { transform: scale(1.03); opacity: 1; } 100% { transform: scale(1); } }
@keyframes ue-wippen { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(-4px); } }

.ue-region.is-leuchtet { border-color: #e0a400; animation: ue-leuchten 1.4s ease-in-out infinite; }
@keyframes ue-leuchten { 0%, 100% { box-shadow: 0 0 0 0 rgba(249, 183, 0, .7); } 50% { box-shadow: 0 0 0 10px rgba(249, 183, 0, 0); } }
@media (prefers-reduced-motion: reduce) { .ue-farm__hinweis, .ue-farm__hinweis-bild, .ue-region.is-leuchtet { animation: none; } }

.ue-farm__kiste-knopf { position: relative; display: grid; place-items: center; padding: 2px; border: 0; background: none; font: inherit; cursor: pointer; border-radius: 8px; }
.ue-farm__kiste-knopf:focus-visible { outline: 3px solid var(--purple); }
.ue-farm__kiste-knopf .ue-farm__kiste-bild { transition: transform .2s; }
.ue-farm__kiste.is-auf .ue-farm__kiste-bild { transform: rotate(-8deg) scale(1.08); }
.ue-farm__kiste-knopf.is-wackelt .ue-farm__kiste-bild { animation: ue-wackeln 1.6s ease-in-out infinite; }
.ue-kiste-hand { position: absolute; right: -16px; bottom: -18px; z-index: 2; font-size: 1.8rem; line-height: 1; pointer-events: none; filter: drop-shadow(0 2px 3px rgba(31, 42, 77, .3)); animation: ue-hand-tippt 1.6s ease-in-out infinite; }
@media (prefers-reduced-motion: reduce) { .ue-farm__kiste-knopf.is-wackelt .ue-farm__kiste-bild, .ue-kiste-hand { animation: none; } }

.ue-gebirge__berg { position: absolute; bottom: 30%; line-height: 1; pointer-events: none; }
.ue-gebirge__deko { position: absolute; font-size: 1.8rem; line-height: 1; pointer-events: none; }
.ue-gebirge__wasserfall { position: absolute; left: 46%; bottom: 8%; display: flex; flex-direction: column; align-items: center; padding: 0; border: 0; background: none; cursor: pointer; }
.ue-gebirge__wasserfall:focus-visible { outline: 3px solid var(--purple); border-radius: 6px; }
.ue-gebirge__tropfen { display: flex; flex-direction: column; align-items: center; height: 100px; overflow: hidden; }
.ue-gebirge__tropfen i { font-style: normal; font-size: 1.2rem; line-height: 1.25; animation: ue-tropfen 1s linear infinite; }
.ue-gebirge__tropfen i:nth-child(2) { animation-delay: .25s; }
.ue-gebirge__tropfen i:nth-child(3) { animation-delay: .5s; }
.ue-gebirge__tropfen i:nth-child(4) { animation-delay: .75s; }
@keyframes ue-tropfen { from { transform: translateY(-22px); opacity: .3; } to { transform: translateY(22px); opacity: 1; } }
.ue-gebirge__see { font-size: 2rem; line-height: 1; margin-top: -6px; }
.ue-gebirge__fels { position: absolute; margin-left: -24px; padding: 0; border: 0; background: none; font-size: 2.6rem; line-height: 1; cursor: pointer; touch-action: none; user-select: none; -webkit-user-select: none; -webkit-touch-callout: none; border-radius: 8px; }
.ue-gebirge__fels.is-zu { filter: grayscale(.4); }
@media (max-width: 720px) { .ue-gebirge__berg { transform: scale(.8); transform-origin: bottom left; } .ue-gebirge__fels { font-size: 2.1rem; } }
@media (prefers-reduced-motion: reduce) { .ue-gebirge__tropfen i { animation: none; } }

.ue-kopf__rechts .ue-farm-knopf { margin-left: 0; padding: 4px 12px; font-size: .85rem; }

.ue-farm__baum.ue-gebirge__baum { position: absolute; font-size: 1.8rem; }

.ue-farm__stall { flex-direction: column; }
.ue-inv { display: flex; flex-direction: column; align-items: center; padding: 6px 8px 8px; border-radius: 6px; background: #c6c6c6; box-shadow: inset 2px 2px 0 #fff, inset -2px -2px 0 #555; }
.ue-inv .ue-mc__label { margin: 0 0 4px; }
.ue-inv__leiste { display: grid; grid-template-columns: repeat(7, auto); gap: 3px; }
.ue-inv__leiste .ue-mc__slot { width: 42px; height: 42px; }
.ue-inv__leiste .ue-mc__slot[tabindex="-1"] { cursor: default; }
.ue-inv__platz--rest { opacity: .7; }
.ue-mc__kiste { display: grid; grid-template-columns: repeat(5, 46px); gap: 4px; justify-content: center; }
.ue-mc__material { display: flex; flex-wrap: wrap; gap: 4px; justify-content: center; }
@media (max-width: 380px) { .ue-inv__leiste { grid-template-columns: repeat(4, auto); } }

.ue-sand { display: inline-block; width: 30px; height: 16px; border-radius: 50% 50% 6px 6px / 100% 100% 6px 6px; background: radial-gradient(circle at 35% 40%, #fff1b8 0 2px, transparent 3px), radial-gradient(circle at 65% 60%, #d9b45a 0 2px, transparent 3px), #ecc96b; vertical-align: middle; }
.ue-farm__baum.ue-gebirge__sand { position: absolute; margin-left: -18px; font-size: 1.9rem; }

.ue-modal__kasten--frage { padding: 26px 30px 22px; }
.ue-modal__kasten--frage .ue-modal__bild { margin-bottom: 14px; }
.ue-modal__kasten--frage .ue-farm__frage { gap: 14px; }
.ue-modal__kasten--frage .ue-farm__frage label { margin-bottom: 6px; }

#ue-rezepte-fenster { z-index: 950; }
#ue-schmelzen .ue-erz, #ue-schmelzen .ue-barren { margin: 0 2px; }

.ue-gebirge__wueste { bottom: 26%; }

.ue-erz { width: 18px; height: 18px; border-radius: 50%; background: radial-gradient(circle at 30% 32%, #d2731f 0 3px, transparent 4px), radial-gradient(circle at 68% 40%, #d2731f 0 2.5px, transparent 3.5px), radial-gradient(circle at 48% 72%, #d2731f 0 3px, transparent 4px), #c3c7ce; box-shadow: inset -2px -2px 0 rgba(0, 0, 0, .18), 0 0 0 1px #8a8f99; }
.ue-bruchstein { display: inline-block; width: 18px; height: 18px; margin: 1px; border-radius: 2px; vertical-align: middle;
  background: linear-gradient(90deg, transparent 0 46%, #3f434a 46% 54%, transparent 54%) 0 0 / 100% 50% no-repeat,
              linear-gradient(90deg, transparent 0 20%, #3f434a 20% 28%, transparent 28% 72%, #3f434a 72% 80%, transparent 80%) 0 100% / 100% 50% no-repeat,
              linear-gradient(0deg, transparent 0 46%, #3f434a 46% 54%, transparent 54%),
              #6f747c;
  box-shadow: inset 2px 2px 0 rgba(255, 255, 255, .15), inset -2px -2px 0 rgba(0, 0, 0, .3); }
.ue-mc__slot .ue-bruchstein { width: 26px; height: 26px; margin: 0; }
.ue-mc__slot .ue-erz { width: 26px; height: 26px; }

.ue-mc__geist .ue-erz, .ue-mc__geist .ue-bruchstein { width: 34px; height: 34px; }
.ue-mc__geist .ue-sand { width: 44px; height: 24px; }

.ue-kohle { margin: 10px 0 4px; padding: 10px 12px; border-radius: 6px; background: #e3e3e3; box-shadow: inset 2px 2px 0 #fff, inset -2px -2px 0 #8b8b8b; }
.ue-kohle p { margin: 0 0 8px; font-size: .9rem; }
.ue-kohle__zeile { display: flex; align-items: center; justify-content: center; gap: 16px; flex-wrap: wrap; }
.ue-kohle__turm { display: inline-flex; flex-direction: column; align-items: center; gap: 2px; padding: 6px 10px; border-radius: 6px; background: #c6c6c6; }
.ue-kohle__turm .ue-bild { font-size: 1.8rem; line-height: 1; }
.ue-kohle__turm span:last-child { display: flex; flex-wrap: wrap; justify-content: center; max-width: 120px; }
.ue-kohle__frage { display: flex; align-items: center; gap: 8px; margin: 0; }
.ue-kohle__frage label { font-size: 1.3rem; }
.ue-kohle__frage .ue-frage__feld { width: 70px; }

.ue-ofen__vorrat { display: flex; flex-wrap: wrap; justify-content: center; gap: 14px; margin: 6px 0 4px; font-weight: 700; }
.ue-ofen__vorrat > span { display: inline-flex; align-items: center; gap: 4px; }
.ue-ofen__vorrat .ue-bild { font-size: 1.3rem; line-height: 1; }
#ue-schmelzen .ue-bild, #ue-kohle-machen .ue-bild { font-size: 1.1rem; line-height: 1; }

.ue-kohle-fokus .ue-mc__titel .ue-bild { font-size: 1.3rem; }
.ue-kohle-fokus .ue-kohle { background: none; box-shadow: none; padding: 0; text-align: center; }
.ue-kohle-fokus .ue-kohle p { font-size: 1rem; margin-bottom: 14px; }
.ue-kohle-fokus .ue-kohle__zeile { gap: 24px; }
.ue-kohle-fokus .ue-kohle__turm .ue-bild { font-size: 2.6rem; }
.ue-kohle-fokus .ue-kohle__frage label { font-size: 2rem; }
.ue-kohle-fokus .ue-kohle__frage .ue-frage__feld { width: 90px; font-size: 1.8rem; }

.ue-farm__kiste { max-width: 340px; }
.ue-farm__kiste-knoepfe { flex-wrap: nowrap; }
.ue-farm__kiste-knoepfe .ue-werkstatt__oeffnen { margin-top: 0; white-space: nowrap; }

.ue-mc, .ue-mc p, .ue-mc label, .ue-mc b, .ue-mc__tipp, .ue-mc__label, .ue-mc__titel,
.ue-inv .ue-mc__label, .ue-kohle p, .ue-kohle__frage label, .ue-ofen__vorrat { color: #1b1d22; }
.ue-mc__tipp { font-size: .95rem; }
.ue-mc__label { font-weight: 800; }
.ue-mc .ue-rueckmeldung.is-richtig { color: #146b38; }
.ue-mc .ue-rueckmeldung.is-falsch { color: #a3152c; }
.ue-kohle__turm { background: #e9e9e9; box-shadow: inset 2px 2px 0 #8b8b8b, inset -2px -2px 0 #fff; }
.ue-mc .ue-frage__feld { background: #fff; color: #1b1d22; }

.ue-kohle__zeichen { font-size: 1.6rem; font-weight: 800; color: #1b1d22; margin-right: 4px; align-self: center; }

.ue-karte .ue-mc__titel, .ue-mc__titel { font-size: 1.8rem; line-height: 1.2; margin: 0 0 8px; }
.ue-mc__titel .ue-bild, .ue-mc__titel span[aria-hidden] { font-size: 1.8rem; }
@media (max-width: 720px) { .ue-karte .ue-mc__titel, .ue-mc__titel, .ue-mc__titel .ue-bild { font-size: 1.5rem; } }

.ue-kohle__stufe { display: inline-block; margin: 0 0 10px !important; padding: 2px 12px; border-radius: var(--radius-pill); background: #1b1d22; color: #fff !important; font-size: .8rem !important; font-weight: 800; letter-spacing: .04em; text-transform: uppercase; }

.ue-kohle__turm span:last-child { display: flex; flex-wrap: nowrap; align-items: center; gap: 6px; max-width: none; }
.ue-kohle__turm .ue-bild { margin: 0; }
.ue-kohle-fokus .ue-kohle__turm span:last-child .ue-bild { font-size: 2rem; }
.ue-kohle-fokus .ue-kohle__turm { gap: 8px; padding: 10px 14px; }
.ue-kohle__kohlen { display: flex; gap: 6px; }

.ue-kohle__lob { display: flex; flex-direction: column; align-items: center; gap: 2px; margin: 0 auto 12px; padding: 8px 14px; max-width: 360px; border-radius: 8px; background: #fff; box-shadow: inset 0 0 0 2px #146b38; text-align: center; }
.ue-kohle__lob b { color: #146b38; font-size: 1.15rem; white-space: nowrap; }
.ue-kohle__lob span { display: inline-flex; align-items: center; gap: 4px; color: #1b1d22; font-size: .9rem; font-weight: 700; }
.ue-kohle__lob .ue-bild { font-size: 1rem; line-height: 1; }
.ue-kohle__frage .ue-frage__feld.is-richtig { border-color: #146b38; background: #e6f6ec; color: #146b38; font-weight: 800; }

.ue-ofen__anlage { display: flex; align-items: center; justify-content: center; gap: 18px; margin: 10px 0 6px; }
.ue-ofen__links { display: flex; flex-direction: column; align-items: center; gap: 4px; }
.ue-ofen__platz { cursor: default; }
.ue-ofen__platz .ue-bild { font-size: 1.5rem; line-height: 1; }
.ue-ofen__platz .ue-erz { width: 26px; height: 26px; }
.ue-ofen__platz .ue-barren { width: 32px; height: 12px; }
.ue-ofen__platz--gross { width: 60px; height: 60px; }
.ue-ofen__feuer { font-size: 1.6rem; line-height: 1; filter: grayscale(1); opacity: .35; }
.ue-ofen__anlage.is-laeuft .ue-ofen__feuer { filter: none; opacity: 1; animation: ue-flackern .3s ease-in-out infinite alternate; }
@keyframes ue-flackern { from { transform: scale(1); } to { transform: scale(1.15) translateY(-2px); } }
.ue-ofen__pfeil { position: relative; width: 70px; height: 16px; border-radius: 2px; background: #8b8b8b; box-shadow: inset 2px 2px 0 #373737, inset -2px -2px 0 #fff; overflow: hidden; }
.ue-ofen__pfeil i { position: absolute; left: 0; top: 0; bottom: 0; width: 0; background: linear-gradient(90deg, #fff 0, #e9e9e9 100%); }
.ue-ofen__anlage.is-laeuft .ue-ofen__pfeil i { animation: ue-schmelzen 1.8s linear forwards; }
@keyframes ue-schmelzen { from { width: 0; } to { width: 100%; } }
@media (prefers-reduced-motion: reduce) { .ue-ofen__anlage.is-laeuft .ue-ofen__feuer { animation: none; } }

.ue-tafel__bilder { display: flex; gap: 4px; }

.ue-rezept__ofen .ue-bild { font-size: 1.8rem; line-height: 1; }
.ue-rezept__ofen .ue-erz { width: 26px; height: 26px; }
.ue-rezept__ofen .ue-barren { width: 32px; height: 12px; }

.ue-benennen__faktor--ofen .ue-benennen__frage { animation: ue-flackern .35s ease-in-out infinite alternate; }
.ue-benennen__faktor--ofen .ue-benennen__frage.is-fertig { animation: ue-auftauchen .4s ease-out; }
@media (prefers-reduced-motion: reduce) { .ue-benennen__faktor--ofen .ue-benennen__frage { animation: none; } }
.ue-tafel__plus { align-self: center; font-style: normal; font-weight: 800; font-size: 1.4rem; color: var(--purple); }

.ue-tafel__feld.is-zusammen, .ue-rechnung__zusammen { position: relative; }
.ue-rechnung__zusammen { display: inline-flex; align-items: center; }
.ue-zusammen { position: absolute; top: -12px; right: -12px; font-size: 1.4rem; line-height: 1; pointer-events: none; animation: ue-funkeln 1.6s ease-in-out infinite; }
@keyframes ue-funkeln { 0%, 100% { transform: scale(1) rotate(0); opacity: 1; } 50% { transform: scale(1.2) rotate(15deg); opacity: .75; } }
@media (prefers-reduced-motion: reduce) { .ue-zusammen { animation: none; } }

.ue-held {
  position: relative; overflow: hidden; padding: 26px 0 90px;

  background: #a9dbff url("/images/lernmission-1x1/bergland.webp") center bottom / cover no-repeat;
}
.ue-held::after {
  content: ""; position: absolute; left: 0; right: 0; bottom: -1px; height: 40px; z-index: 0;
  background: linear-gradient(transparent, var(--bg-lavender));
}
.ue-held__innen { position: relative; z-index: 1; display: grid; grid-template-columns: minmax(0, 1.15fr) minmax(0, 1fr) minmax(0, .85fr); align-items: center; gap: 18px; }
.ue-held__text { padding: 26px 28px; border-radius: 40px; background: rgba(255, 255, 255, .9); box-shadow: 0 10px 30px rgba(31, 42, 77, .08); }
.ue-held__text .eyebrow { margin-bottom: 10px; }
.ue-held__text h1 { margin: 0 0 14px; font-family: var(--font-display); font-size: clamp(2.1rem, 4.2vw, 3.3rem); line-height: 1.05; color: var(--navy); transform: rotate(-2deg); }
.ue-held__text p { color: var(--navy-soft); }

.ue-held__pinsel { display: inline-block; margin: 6px 0 12px; padding: 10px 20px; border-radius: 14px 24px 16px 26px; background: var(--purple-soft); border-left: 5px solid var(--purple); transform: rotate(-1.5deg); font-family: var(--font-display); font-size: 1.25rem; line-height: 1.2; }
.ue-held__pinsel b { color: var(--purple-dark); }
.ue-held__fett { font-weight: 700; }
.ue-held__los { margin: 18px 0 0; }
.ue-held__bild { position: relative; min-height: 420px; display: flex; align-items: flex-end; justify-content: center; }
.ue-held__pfad { position: absolute; z-index: 0; right: -30%; bottom: -40px; width: 130%; max-width: none; height: auto; }
.ue-held__ziel { position: absolute; z-index: 0; right: -14%; top: -10px; width: 40%; height: auto; }
.ue-held__monster { position: relative; z-index: 1; width: 100%; max-width: 360px; height: auto; filter: drop-shadow(0 12px 18px rgba(31, 42, 77, .2)); }
.ue-held__blasen { display: flex; flex-direction: column; gap: 18px; }
.ue-blase { position: relative; display: flex; align-items: center; gap: 12px; margin: 0; padding: 14px 18px; border-radius: 28px; background: #fff; box-shadow: 0 8px 22px rgba(31, 42, 77, .12); font-weight: 700; color: var(--navy); line-height: 1.35; }
.ue-blase::after { content: ""; position: absolute; left: 22px; bottom: -12px; border: 12px solid transparent; border-top-color: #fff; border-bottom: 0; }
.ue-blase--buch { transform: rotate(-2deg); }
.ue-blase--eis { transform: rotate(1.5deg); }
.ue-blase__bild { flex: none; font-size: 2.6rem; line-height: 1; }
img.ue-blase__bild { width: 64px; height: auto; }
.ue-held__schild { margin: 6px 0 0; padding: 14px 18px; border: 4px solid #7a4a1f; border-radius: 10px; background: repeating-linear-gradient(0deg, #c68848 0 22px, #b97b3c 22px 24px); color: #fff8e8; font-family: var(--font-display); font-size: 1.05rem; line-height: 1.3; text-shadow: 0 1px 0 rgba(0, 0, 0, .35); transform: rotate(2deg); box-shadow: 0 8px 18px rgba(74, 43, 14, .3); }
.ue-held__schild b { display: block; color: #fff; }
@media (max-width: 960px) {
  .ue-held { padding-bottom: 70px; }
  .ue-held__innen { grid-template-columns: 1fr; }
  .ue-held__bild { min-height: 300px; order: 3; }
  .ue-held__monster { max-width: 240px; }
  .ue-held__pfad { right: -10%; width: 110%; }
  .ue-held__ziel { right: 0; width: 30%; }
  .ue-held__blasen { order: 2; }
}
@media (max-width: 560px) {
  .ue-held__text { padding: 20px; border-radius: 28px; }
  .ue-held__pinsel { font-size: 1.1rem; }
}

.ue-musik { position: relative; padding: 16px 24px; border-radius: 24px; box-shadow: var(--shadow); }
.ue-musik__titel { display: flex; align-items: center; gap: 12px; }
.ue-musik__note { font-size: 2.4rem; line-height: 1; }
.ue-musik__titel #ue-musik-name { font-family: var(--font-display); font-size: 1.1rem; }
.ue-musik__deko { position: absolute; right: -10px; top: -26px; font-size: 2rem; transform: rotate(-12deg); pointer-events: none; }
@media (max-width: 560px) { .ue-musik__deko { display: none; } }

.ue-start--held { display: grid; grid-template-columns: minmax(0, .8fr) minmax(0, 1.4fr); gap: 10px 30px; align-items: center; position: relative; overflow: hidden; }
.ue-start__bild { position: relative; align-self: start; padding-top: 30px; }
.ue-start__monster { display: block; width: 100%; max-width: 300px; height: auto; margin: 0 auto; }
.ue-start__birne { position: absolute; top: -6px; right: 0; width: 26%; height: auto; }
.ue-start__buecher { position: absolute; left: -4%; bottom: -10px; width: 42%; height: auto; }
.ue-start--held .ue-karte__titel { font-family: var(--font-display); font-size: 2rem; color: var(--navy); }
.ue-start__unter b { color: var(--navy); font-size: 1.05rem; }
.ue-start--held .ue-regel { display: flex; align-items: center; gap: 16px; }
.ue-regel__ziel { flex: none; width: 72px; height: auto; }
.ue-regel__liste { list-style: none; padding: 0 !important; }
.ue-regel__liste li { display: flex; align-items: flex-start; gap: 10px; font-weight: 600; }

.ue-regel__liste .ue-nr { margin-top: 1px; }
.ue-nr { flex: none; display: grid; place-items: center; width: 28px; height: 28px; border-radius: 8px; color: #fff; font-weight: 800; font-family: var(--font-display); }
.ue-nr--1 { background: var(--green); }
.ue-nr--2 { background: var(--yellow); }
.ue-nr--3 { background: var(--blue); }
.ue-start__los { font-family: var(--font-display); font-size: 1.15rem; box-shadow: 0 6px 0 var(--yellow-dark); }
@media (max-width: 760px) {
  .ue-start--held { grid-template-columns: 1fr; }
  .ue-start__monster { max-width: 190px; }
  .ue-start--held .ue-regel { flex-direction: column; align-items: flex-start; }
}

.ue-fortsetzen--karte { display: flex; align-items: center; gap: 22px; margin-top: 20px; padding: 22px 28px; border-top: 0; border-radius: var(--radius-lg); background: #fff; box-shadow: var(--shadow); }
.ue-fortsetzen__bild { flex: none; width: 110px; height: auto; }
.ue-fortsetzen--karte .ue-fortsetzen__text { display: block; flex: 1 1 auto; }
.ue-fortsetzen--karte h3 { font-family: var(--font-display); font-size: 1.3rem; color: var(--navy); }
.ue-fortsetzen--karte .ue-fortsetzen__zeile { display: flex; flex-wrap: wrap; gap: 10px; }
.ue-fortsetzen--karte .ue-fortsetzen__zeile input { flex: 1 1 220px; border-radius: var(--radius-pill); }
@media (max-width: 640px) { .ue-fortsetzen--karte { flex-direction: column; text-align: center; } .ue-fortsetzen--karte .ue-fortsetzen__zeile { justify-content: center; } }

.ue-eiskasten { padding: 26px 30px; border-radius: 30px; background: #fff3e2; }
.ue-eiskasten__kopf { display: flex; align-items: center; gap: 14px; margin-bottom: 18px; }
.ue-eiskasten__kopf img { width: 64px; height: auto; flex: none; }
.ue-eiskasten__kopf h2 { margin: 0; font-family: var(--font-display); font-size: 1.6rem; color: var(--navy); }
.ue-eiskasten__kopf p { margin: 2px 0 0; color: var(--ink); }
.ue-eiskasten__spalten { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); }
.ue-eiskasten__spalte { display: flex; gap: 14px; align-items: flex-start; padding: 4px 20px; }
.ue-eiskasten__spalte + .ue-eiskasten__spalte { border-left: 1px solid #f0d9b8; }
.ue-eiskasten__spalte > img { flex: none; width: 84px; height: auto; }
.ue-eiskasten__spalte h3 { margin: 0 0 6px; font-size: 1.02rem; color: var(--navy); }
.ue-eiskasten__spalte p { margin: 0; font-size: .92rem; color: var(--ink); }
.ue-eiskasten__code { position: relative; flex: none; width: 110px; }
.ue-eiskasten__code img { display: block; width: 100%; height: auto; }
.ue-eiskasten__code span { position: absolute; left: 18%; right: 18%; top: 54%; text-align: center; font-family: ui-monospace, Consolas, monospace; font-weight: 800; font-size: .62rem; line-height: 1.2; color: var(--navy); }
@media (max-width: 860px) {
  .ue-eiskasten__spalten { grid-template-columns: 1fr; gap: 16px; }
  .ue-eiskasten__spalte { padding: 0; }
  .ue-eiskasten__spalte + .ue-eiskasten__spalte { border-left: 0; padding-top: 16px; border-top: 1px solid #f0d9b8; }
}

.ue-regel__liste li b { display: block; }

.ue-ueberblick__zusammen { position: relative; display: inline-flex; align-items: center; }
.ue-ueberblick__zusammen .ue-zusammen { top: -9px; right: -11px; font-size: .8rem; }

.ue-farm-knopf__huelle { position: relative; display: inline-flex; }
.ue-farm-knopf.is-neu { position: relative; animation: ue-wackeln 1.6s ease-in-out infinite; box-shadow: 0 0 0 3px rgba(249, 183, 0, .55); }
.ue-farm-knopf.is-neu::after { content: "neu"; position: absolute; top: -9px; right: -8px; padding: 0 5px; border-radius: var(--radius-pill); background: var(--yellow); color: var(--navy); font-size: .65rem; font-weight: 800; }
.ue-farm-knopf__tipp { position: absolute; top: calc(100% + 8px); right: 0; z-index: 5; width: max-content; max-width: 220px; padding: 6px 10px; border-radius: 10px; background: var(--navy); color: #fff; font-size: .8rem; font-weight: 700; box-shadow: var(--shadow-sm); }
.ue-farm-knopf__tipp::before { content: ""; position: absolute; top: -6px; right: 20px; border: 6px solid transparent; border-bottom-color: var(--navy); border-top: 0; }
@media (prefers-reduced-motion: reduce) { .ue-farm-knopf.is-neu { animation: none; } }

.ue-warte-zeile { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 10px 16px; margin-top: 10px; }
.ue-warte-zeile .ue-warte { margin: 0; }
.ue-tempo { display: flex; align-items: center; gap: 8px; margin-left: auto; }
.ue-tempo .btn { padding: 6px 14px; font-size: .9rem; }
.ue-tempo .btn:disabled { opacity: .45; cursor: not-allowed; }
.ue-tempo__wert { min-width: 4.5em; text-align: center; font-weight: 700; font-size: .9rem; color: var(--navy-soft); }

.ue-unterzeile { margin: -6px 0 12px; font-family: var(--font-display); font-size: 1.1rem; color: var(--navy-soft); }

.ue-fuenf--wahl { justify-content: center; }
.ue-wahl-rechnung { padding: 12px 22px; border: 2px solid var(--line, #e3e1f0); border-radius: 14px; background: #f1edff; font: inherit; font-size: 1.3rem; color: var(--navy); cursor: pointer; }
.ue-wahl-rechnung:hover:not(:disabled) { border-color: var(--purple); }
.ue-wahl-rechnung.is-falsch { opacity: .45; text-decoration: line-through; }
.ue-wahl-rechnung.is-richtig { border-color: var(--green); background: #e3f6e9; }

.ue-bruecke { display: flex; flex-wrap: wrap; align-items: center; justify-content: center; gap: 8px 14px; margin: 14px auto 0; padding: 10px 16px; max-width: 520px; border-radius: 16px; background: #f1edff; color: var(--navy); font-size: 1.05rem; }
.ue-bruecke .ue-bild { font-size: 1.6rem; vertical-align: middle; }
.ue-bruecke .ue-tafel__plus { font-style: normal; margin: 0 2px; }
.ue-bruecke__schritt { display: inline-flex; align-items: center; gap: 6px; font-size: 1.2rem; }
.ue-bruecke__schritt i { font-style: normal; font-weight: 800; color: var(--purple); }

.ue-modal--feier { z-index: 950; }
.ue-modal--feier .ue-modal__kasten { text-align: center; }

.ue-farm__feld.is-beet { background: #e9d3b0; border-style: solid; border-color: #b98a4e; }
.ue-beet { display: flex; flex-wrap: wrap; justify-content: center; max-width: 56px; }
.ue-farm__feld .ue-beet .ue-bild { font-size: 1.3rem; }
.ue-beet__zahl { position: absolute; right: 3px; bottom: 1px; font-size: .8rem; color: #fff; text-shadow: 0 1px 2px #000; }
.ue-beet__uhr { position: absolute; top: -10px; right: -10px; display: grid; place-items: center; min-width: 24px; height: 24px; padding: 0 5px; border-radius: 999px; background: #ff5d73; color: #fff; font-weight: 800; font-size: .85rem; box-shadow: 0 2px 6px rgba(0, 0, 0, .25); }
.ue-farm__feld.is-schnappt .ue-bild { animation: ue-wackeln .7s ease-in-out; }

.ue-herleitung { display: grid; gap: 10px; margin: 16px auto 8px; max-width: 560px; }
.ue-herleitung__zeile { margin: 0; padding: 12px 16px; border-radius: 14px; background: #f1edff; color: var(--navy); font-size: 1.1rem; animation: ue-auftauchen .35s ease-out; }
.ue-herleitung__zeile .ue-bild { font-size: 1.5rem; vertical-align: middle; }
.ue-herleitung__zeile--ziel { background: #e3f6e9; font-size: 1.25rem; }
.ue-hoer-frage { position: relative; display: inline-grid; place-items: center; width: 1.6em; height: 1.6em; margin-left: 4px; border: 0; border-radius: 50%; background: #f1edff; color: var(--purple); font: inherit; font-weight: 800; cursor: pointer; animation: ue-wackeln 2.4s ease-in-out infinite; }
.ue-hoer-frage::before, .ue-hoer-frage::after { content: ""; position: absolute; inset: 0; border: 2px solid var(--purple); border-radius: 50%; opacity: 0; animation: ue-schallwelle 2.4s ease-out infinite; pointer-events: none; }
.ue-hoer-frage::after { animation-delay: .8s; }
@keyframes ue-schallwelle { 0% { transform: scale(1); opacity: .6; } 100% { transform: scale(2.2); opacity: 0; } }
@media (prefers-reduced-motion: reduce) { .ue-hoer-frage, .ue-hoer-frage::before, .ue-hoer-frage::after { animation: none; } }

.ue-leiste__bilder { font-style: normal; font-size: .95rem; letter-spacing: 1px; }

@media (max-width: 720px) { .ue-leiste li:not(.is-jetzt) .ue-leiste__bilder { display: none; } .ue-leiste li.is-jetzt .ue-leiste__bilder { font-size: .72rem; } }

.ue-prolog__kopf { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.ue-prolog__ueberspringen { border: 0; background: none; color: var(--ink-light); font: inherit; font-size: .85rem; font-weight: 700; cursor: pointer; padding: 6px 8px; border-radius: 8px; }
.ue-prolog__ueberspringen:hover { color: var(--purple); }
.ue-prolog__welt { position: relative; overflow: hidden; margin: 12px 0 0; padding: 70px 12px 18px; border-radius: 16px 16px 0 0;
  background: linear-gradient(180deg, #8fd3ff 0%, #c8ecff 60%, #7cc35c 60%, #6bb04c 100%); transition: background 2.4s ease; }
.ue-prolog__welt.is-nacht { background: linear-gradient(180deg, #071233 0%, #1a2a5e 60%, #2f5a2c 60%, #264a24 100%); }
.ue-prolog__sterne { position: absolute; inset: 0 0 40% 0; opacity: 0; transition: opacity 2.4s ease .6s; pointer-events: none;
  background-image: radial-gradient(2px 2px at 12% 20%, #fff 50%, transparent 51%), radial-gradient(2px 2px at 30% 8%, #fff 50%, transparent 51%),
    radial-gradient(1.5px 1.5px at 48% 26%, #fff 50%, transparent 51%), radial-gradient(2px 2px at 66% 12%, #fff 50%, transparent 51%),
    radial-gradient(1.5px 1.5px at 82% 30%, #fff 50%, transparent 51%), radial-gradient(2px 2px at 92% 10%, #fff 50%, transparent 51%),
    radial-gradient(1.5px 1.5px at 22% 40%, #fff 50%, transparent 51%), radial-gradient(1.5px 1.5px at 58% 44%, #fff 50%, transparent 51%); }
.ue-prolog__welt.is-nacht .ue-prolog__sterne { opacity: 1; }
.ue-prolog__mond { position: absolute; right: 9%; top: 6px; font-size: 3rem; line-height: 1; transform: translateY(260%); opacity: 0; transition: transform 3s ease-out, opacity 1.2s ease; filter: drop-shadow(0 0 14px rgba(255, 240, 160, .8)); }
.ue-prolog__welt.is-mond .ue-prolog__mond { transform: translateY(0); opacity: 1; }
.ue-prolog__baum { position: absolute; bottom: 14px; font-size: 2.2rem; line-height: 1; }
.ue-prolog__baum--l { left: 2%; } .ue-prolog__baum--r { right: 2%; }
.ue-prolog__feldraster { position: relative; z-index: 1; display: grid; grid-template-columns: repeat(var(--spalten), 1fr); gap: 3px; width: min(100%, 420px); margin: 0 auto; touch-action: none; user-select: none; }
.ue-prolog__feld { aspect-ratio: 1; display: grid; place-items: center; padding: 0; border: 0; border-radius: 3px; cursor: pointer;
  background: linear-gradient(180deg, #6fbf4a 0 28%, #8b5a2b 28% 100%); box-shadow: inset 0 0 0 2px rgba(0, 0, 0, .18); }
.ue-prolog__feld:hover { box-shadow: inset 0 0 0 3px rgba(255, 255, 255, .7); }
.ue-prolog__feld .ue-bild { font-size: clamp(1.1rem, 5vw, 1.9rem); line-height: 1; }
.ue-prolog__feld.is-tnt { background: #c0392b; box-shadow: inset 0 0 0 2px rgba(0, 0, 0, .25), inset 0 -6px 0 rgba(0, 0, 0, .15); }
.ue-prolog__feld.is-tnt .ue-bild { animation: ue-prolog-setzen .18s ease-out; }
@keyframes ue-prolog-setzen { from { transform: scale(.4) translateY(-30%); } to { transform: none; } }
.ue-prolog__feld.is-weg { background: #3b2a1a; box-shadow: none; }
.ue-prolog__feld.is-weg .ue-bild { animation: ue-prolog-boom .5s ease-out forwards; }
@keyframes ue-prolog-boom { 0% { transform: scale(.3); opacity: 1; } 60% { transform: scale(1.6); opacity: 1; } 100% { transform: scale(2); opacity: 0; } }
.ue-prolog__welt.is-boom { animation: ue-prolog-wackeln .5s linear 3; }
@keyframes ue-prolog-wackeln { 0%, 100% { transform: translate(0, 0); } 25% { transform: translate(-5px, 3px); } 50% { transform: translate(4px, -3px); } 75% { transform: translate(-3px, -2px); } }
.ue-prolog__schwein { position: absolute; z-index: 2; bottom: 6px; left: -14%; font-size: 2.6rem; line-height: 1; transition: left 2.6s linear; }
.ue-prolog__welt.is-schwein .ue-prolog__schwein { left: 14%; animation: ue-prolog-trotten .4s ease-in-out infinite; }
.ue-prolog__welt.is-boom .ue-prolog__schwein { animation: ue-prolog-fliegen 1.2s ease-out forwards; }
@keyframes ue-prolog-trotten { 50% { transform: translateY(-5px) rotate(-4deg); } }
@keyframes ue-prolog-fliegen { to { transform: translate(-160px, -260px) rotate(-540deg); opacity: 0; } }
.ue-prolog__leiste { display: flex; justify-content: center; gap: 3px; padding: 6px; background: #3a3a3a; border-radius: 0 0 10px 10px; }
.ue-prolog__platz { position: relative; display: grid; place-items: center; width: 40px; height: 40px; background: #8b8b8b; box-shadow: inset 2px 2px 0 #5a5a5a, inset -2px -2px 0 #c6c6c6; }
.ue-prolog__platz.is-gewaehlt { outline: 3px solid #fff; outline-offset: -1px; }
.ue-prolog__platz .ue-bild { font-size: 1.4rem; }
.ue-prolog__platz b { position: absolute; right: 2px; bottom: 0; color: #fff; font-size: .75rem; text-shadow: 1px 1px 0 #000; }
@media (max-width: 480px) { .ue-prolog__platz { width: 30px; height: 30px; } .ue-prolog__platz:nth-child(n+7) { display: none; } }
.ue-prolog__zaehler { margin: 10px 0 0; text-align: center; color: var(--navy); }
.ue-prolog__rechnung { display: flex; flex-wrap: wrap; align-items: center; justify-content: center; gap: 8px 12px; margin: 16px 0 6px; font-family: var(--font-display); font-size: 1.5rem; color: var(--navy); }
.ue-prolog__rechnung i { font-style: normal; color: var(--purple); }
.ue-prolog__rechnung .ue-bild { font-size: 2.2rem; }
.ue-prolog__satz { text-align: center; }
@media (prefers-reduced-motion: reduce) { .ue-prolog__welt.is-boom, .ue-prolog__welt.is-schwein .ue-prolog__schwein { animation: none; } }

.ue-vga { position: relative; overflow: hidden; display: flex; flex-direction: column; align-items: center; gap: 14px; padding: 34px 18px 26px; border: 6px double #55ffff; border-radius: 4px;
  background: radial-gradient(ellipse at 50% 30%, #0000d0 0%, #0000aa 55%, #000060 100%); color: #ffffff; text-align: center;
  font-family: 'Press Start 2P', ui-monospace, monospace; text-transform: uppercase; letter-spacing: .08em; image-rendering: pixelated; box-shadow: 0 12px 40px rgba(0, 0, 60, .4); }
.ue-vga::after { content: ""; position: absolute; inset: 0; pointer-events: none; background: repeating-linear-gradient(0deg, rgba(0, 0, 0, .22) 0 1px, transparent 1px 3px); }
.ue-vga__vorspann { margin: 0; color: #55ffff; font-size: .8rem; font-weight: 700; }
.ue-vga__mond { font-size: 4rem; line-height: 1; filter: drop-shadow(0 0 16px #ffff55); animation: ue-vga-schweben 3s ease-in-out infinite; }
@keyframes ue-vga-schweben { 50% { transform: translateY(-8px); } }
.ue-vga__titel { display: flex; flex-direction: column; margin: 0; font-family: 'Press Start 2P', ui-monospace, monospace; font-weight: 900; font-size: clamp(1.5rem, 6vw, 2.6rem); line-height: 1.15; color: #ffff55;
  text-shadow: 3px 3px 0 #aa5500, 6px 6px 0 #000; outline: none; }
.ue-vga__titel span + span { color: #ff55ff; text-shadow: 3px 3px 0 #aa00aa, 6px 6px 0 #000; }
.ue-vga__unter { margin: 0; color: #aaaaaa; font-size: .8rem; font-weight: 700; }
.ue-vga__start { margin-top: 8px; padding: 10px 18px; border: 3px solid #ffffff; background: #000000; color: #ffffff; font: inherit; font-weight: 900; font-size: 1.05rem; letter-spacing: .12em; cursor: pointer; animation: ue-vga-blinken 1s steps(1) infinite; }
.ue-vga__start:hover, .ue-vga__start:focus-visible { background: #55ffff; color: #000; animation: none; outline: none; }
@keyframes ue-vga-blinken { 50% { color: transparent; } }
.ue-vga__fuss { margin: 6px 0 0; color: #5555ff; font-size: .7rem; font-weight: 700; }
@media (prefers-reduced-motion: reduce) { .ue-vga__mond, .ue-vga__start { animation: none; } }

.ue-prolog__welt { padding-bottom: 64px; image-rendering: pixelated;
  background: linear-gradient(180deg, #5fb8ff 0 18%, #7cc6ff 18% 36%, #a5d9ff 36% 54%, #2e7d32 54% 57%, #4caf50 57% 100%); }
.ue-prolog__welt.is-nacht { background: linear-gradient(180deg, #050a24 0 18%, #0b1640 18% 36%, #16245c 36% 54%, #1b4d1f 54% 57%, #2b6a2e 57% 100%); }
.ue-tnt { display: grid; place-items: center; width: 100%; height: 100%; border-radius: 2px;
  background: linear-gradient(180deg, #d63a2a 0 34%, #f2f2f2 34% 66%, #d63a2a 66% 100%); box-shadow: inset 0 0 0 2px #7a1a12, inset 0 -4px 0 rgba(0, 0, 0, .25); }
.ue-tnt b { font-family: 'Press Start 2P', ui-monospace, monospace; font-weight: 900; font-size: clamp(.45rem, 2.4vw, .8rem); letter-spacing: .02em; color: #111; }
.ue-prolog__feld.is-tnt { background: none; box-shadow: none; padding: 0; }
.ue-prolog__feld.is-tnt .ue-tnt { animation: ue-prolog-setzen .18s ease-out; }
.ue-prolog__platz .ue-tnt { width: 70%; height: 70%; }
.ue-prolog__zaun { position: absolute; left: 0; right: 0; bottom: 46px; height: 18px; pointer-events: none;
  background: linear-gradient(180deg, transparent 0 20%, #8d5a2b 20% 34%, transparent 34% 62%, #8d5a2b 62% 76%, transparent 76%),
    repeating-linear-gradient(90deg, #6b3f1a 0 6px, transparent 6px 34px); opacity: .9; }
.ue-prolog__feuer { position: absolute; right: 3%; bottom: 8px; z-index: 1; font-size: 2.4rem; line-height: 1; animation: ue-flackern .4s ease-in-out infinite alternate; filter: drop-shadow(0 0 10px rgba(255, 170, 0, .9)); }
.ue-prolog__schwein { left: 4%; transition: none; }
.ue-prolog__welt.is-schwein .ue-prolog__schwein { left: auto; animation: none; }
.ue-prolog__schwein.is-links { transform: scaleX(-1); }
.ue-prolog__schwanz { position: absolute; left: -.35em; top: .1em; font-size: .55em; display: none; animation: ue-flackern .3s ease-in-out infinite alternate; }
.ue-prolog__schwein.is-brennt .ue-prolog__schwanz { display: inline; }
.ue-prolog__steuer { display: flex; justify-content: center; gap: 18px; margin: 12px 0 0; }
.ue-prolog__steuer[hidden] { display: none; }
.ue-prolog__pfeil { width: 74px; height: 56px; border: 0; border-radius: 6px; background: #3a3a3a; color: #fff; font-size: 1.6rem; cursor: pointer; touch-action: none; user-select: none;
  box-shadow: inset 3px 3px 0 #6a6a6a, inset -3px -3px 0 #1c1c1c; }
.ue-prolog__pfeil:active { box-shadow: inset -3px -3px 0 #6a6a6a, inset 3px 3px 0 #1c1c1c; }
.ue-prolog__pfeil:focus-visible { outline: 3px solid var(--yellow); outline-offset: 2px; }

.ue-titelbild { position: relative; overflow: hidden; border-radius: 10px; box-shadow: 0 12px 40px rgba(0, 0, 60, .4); line-height: 0; }
.ue-titelbild img { display: block; width: 100%; height: auto; image-rendering: pixelated; }
.ue-titelbild__knopf { position: absolute; left: 33%; width: 34%; border: 0; background: transparent; color: transparent; font-size: 0; cursor: pointer; border-radius: 6px; }
.ue-titelbild__knopf--start { top: 78%; height: 7.5%; animation: ue-titel-puls 1.6s ease-in-out infinite; }
.ue-titelbild__knopf--optionen { top: 85.5%; height: 5.5%; }
.ue-titelbild__knopf--ende { top: 91%; height: 5.5%; }
.ue-titelbild__knopf:hover, .ue-titelbild__knopf:focus-visible { outline: 3px solid #ffeb3b; outline-offset: 0; background: rgba(255, 235, 59, .12); }
@keyframes ue-titel-puls { 50% { box-shadow: 0 0 0 3px rgba(255, 235, 59, .55); } }
.ue-musik.is-leuchtet { animation: ue-leuchten 1.2s ease-in-out 2; }

.ue-prolog__mathe { position: absolute; left: 50%; top: 14px; z-index: 2; transform: translateX(-50%); margin: 0; padding: 6px 14px; border: 3px solid #ffeb3b; border-radius: 4px;
  background: #0b1640; color: #ffeb3b; font-family: 'Press Start 2P', ui-monospace, monospace; font-weight: 900; font-size: clamp(1rem, 4.5vw, 1.5rem); letter-spacing: .06em; white-space: nowrap; box-shadow: 4px 4px 0 rgba(0, 0, 0, .35); }
.ue-prolog__feld { position: relative; }
.ue-prolog__hand { position: absolute; left: 45%; top: 55%; z-index: 3; font-size: clamp(1.6rem, 7vw, 2.4rem); line-height: 1; pointer-events: none; animation: ue-prolog-tippen 1.7s ease-in-out forwards; transition: opacity .5s; }
.ue-prolog__hand.is-weg { opacity: 0; }
@keyframes ue-prolog-tippen { 0% { transform: translate(60%, 80%); opacity: 0; } 30% { transform: translate(20%, 30%); opacity: 1; } 70% { transform: translate(0, 0); } 85% { transform: translate(0, 0) scale(.85); } 100% { transform: translate(0, 0) scale(1); } }

.ue-buehne__leiste { display: flex; justify-content: flex-end; margin: 0 0 8px; }
.ue-vollbild { display: inline-flex; align-items: center; gap: 8px; padding: 6px 12px; border: 2px solid #dfe1ec; border-radius: var(--radius-pill); background: #fff; color: var(--navy); font: inherit; font-size: .85rem; font-weight: 700; cursor: pointer; }
.ue-vollbild:hover { border-color: var(--purple); color: var(--purple); }
.ue-vollbild__zu { display: none; }
.ue-buehne.is-vollbild .ue-vollbild__auf { display: none; }
.ue-buehne.is-vollbild .ue-vollbild__zu { display: block; }
.ue-buehne.is-vollbild { position: fixed; inset: 0; z-index: 800; overflow: auto; padding: 12px 16px 32px; background: var(--bg-lavender, #f4f2fb); -webkit-overflow-scrolling: touch; }
.ue-buehne.is-vollbild .ue-app { max-width: 980px; margin: 0 auto; }
.ue-buehne.is-vollbild .ue-buehne__leiste { max-width: 980px; margin: 0 auto 8px; }
html.ue-im-vollbild, html.ue-im-vollbild body { overflow: hidden; }
@media (max-width: 560px) { .ue-vollbild__text { display: none; } .ue-vollbild { padding: 6px 8px; } }

@media (max-width: 560px) { .ue-prolog__feldraster { width: 80%; margin: 0 auto 0 4%; } .ue-prolog__baum--l { display: none; } }

.ue-prolog .ue-prolog__mathe { color: #ffeb3b; }
.ue-prolog__welt.is-schwein.is-boom .ue-prolog__schwein { animation: ue-prolog-fliegen 1.2s ease-out forwards; }

.ue-prolog__feld.is-tnt.is-weg { background: #3b2a1a; box-shadow: inset 0 0 0 2px rgba(0, 0, 0, .3); }

.ue-buehne__leiste { gap: 8px; }
.ue-optionen-heimat[hidden] { display: none !important; }
.ue-titel { position: relative; overflow: hidden; aspect-ratio: 4 / 3; container-type: inline-size; border: 4px solid #1b1b3a; border-radius: 10px;
  background: linear-gradient(180deg, #050a24 0%, #0d1a4d 45%, #1d2f7a 70%, #24398a 100%); box-shadow: 0 12px 40px rgba(0, 0, 60, .45); color: #fff; image-rendering: pixelated; }
.ue-titel__himmel, .ue-titel__himmel > span { position: absolute; display: block; pointer-events: none; }
.ue-titel__himmel { inset: 0; }
.ue-titel__sterne { inset: 0 0 35% 0; background-image:
  radial-gradient(.35cqw .35cqw at 6% 8%, #fff 60%, transparent 61%), radial-gradient(.3cqw .3cqw at 15% 30%, #fff 60%, transparent 61%),
  radial-gradient(.4cqw .4cqw at 27% 14%, #fff 60%, transparent 61%), radial-gradient(.3cqw .3cqw at 38% 34%, #fff 60%, transparent 61%),
  radial-gradient(.35cqw .35cqw at 55% 6%, #fff 60%, transparent 61%), radial-gradient(.3cqw .3cqw at 63% 28%, #fff 60%, transparent 61%),
  radial-gradient(.4cqw .4cqw at 74% 10%, #fff 60%, transparent 61%), radial-gradient(.3cqw .3cqw at 88% 22%, #fff 60%, transparent 61%),
  radial-gradient(.35cqw .35cqw at 95% 5%, #fff 60%, transparent 61%), radial-gradient(.3cqw .3cqw at 47% 40%, #fff 60%, transparent 61%),
  radial-gradient(.3cqw .3cqw at 8% 48%, #fff 60%, transparent 61%), radial-gradient(.3cqw .3cqw at 33% 52%, #fff 60%, transparent 61%); }
.ue-titel__funkeln { left: 4%; top: 4%; width: 92%; height: 40%; }
.ue-titel__funkeln::before, .ue-titel__funkeln::after { content: "✦"; position: absolute; color: #fff7b0; font-size: 3cqw; text-shadow: 0 0 1cqw #fff; animation: ue-titel-funkeln 2.4s ease-in-out infinite; }
.ue-titel__funkeln::before { left: 4%; top: 8%; }
.ue-titel__funkeln::after { left: 78%; top: 70%; animation-delay: 1.2s; }
@keyframes ue-titel-funkeln { 0%, 100% { opacity: .3; transform: scale(.7); } 50% { opacity: 1; transform: scale(1.1); } }
.ue-titel__mond { right: 4%; top: 22%; width: 18%; aspect-ratio: 1; border-radius: 50%;
  background: radial-gradient(circle at 35% 40%, #c9c7a6 0 9%, transparent 10%), radial-gradient(circle at 62% 30%, #c9c7a6 0 6%, transparent 7%),
    radial-gradient(circle at 58% 64%, #c3c09c 0 11%, transparent 12%), radial-gradient(circle at 30% 70%, #cfcdaa 0 5%, transparent 6%),
    radial-gradient(circle at 45% 45%, #fffbe0 0%, #f2edc0 60%, #dcd6a2 100%);
  box-shadow: 0 0 4cqw 1cqw rgba(255, 246, 190, .55), 0 0 10cqw 3cqw rgba(140, 160, 255, .35); }
.ue-titel__berge { left: -5%; right: -5%; bottom: 20%; height: 26%; background: #18266a; clip-path: polygon(0 100%, 8% 55%, 16% 70%, 26% 30%, 36% 62%, 46% 40%, 58% 72%, 68% 28%, 78% 58%, 88% 36%, 100% 64%, 100% 100%); }
.ue-titel__berge--hinten { bottom: 24%; height: 30%; background: #22327d; opacity: .8; clip-path: polygon(0 100%, 12% 45%, 22% 60%, 34% 20%, 44% 52%, 56% 26%, 66% 50%, 76% 18%, 90% 48%, 100% 30%, 100% 100%); }
.ue-titel__wiese { left: 0; right: 0; bottom: 0; height: 24%; background: linear-gradient(180deg, #2f7d32 0 12%, #256b29 12% 40%, #1d5a22 40% 100%); }
.ue-titel__zaun { left: 0; right: 0; bottom: 14%; height: 5%; background: linear-gradient(180deg, transparent 0 18%, #7a4a20 18% 34%, transparent 34% 62%, #7a4a20 62% 78%, transparent 78%), repeating-linear-gradient(90deg, #5d3614 0 1.2cqw, transparent 1.2cqw 6cqw); }

.ue-titel__bild { background: no-repeat center bottom / contain; }
.ue-titel__bild--scheune { left: 1%; bottom: 14%; width: 24%; height: 26%; }
.ue-titel__bild--baum { left: 0; bottom: 22%; width: 14%; height: 34%; }
.ue-titel__bild--haus { right: 12%; bottom: 18%; width: 12%; height: 12%; }
.ue-titel__bild--windrad { right: 1%; bottom: 16%; width: 12%; height: 34%; }
.ue-titel__bild--laterne { right: 6%; bottom: 4%; width: 5%; height: 12%; }

.ue-titel__name { position: absolute; left: 0; right: 0; top: 2.5%; z-index: 2; display: flex; flex-direction: column; align-items: center; margin: 0; font-family: 'Press Start 2P', ui-monospace, monospace; font-weight: 900; line-height: 1; outline: none; }
.ue-titel__oben { font-size: 8.4cqw; letter-spacing: -.02em; color: #ffd23a; -webkit-text-stroke: .25cqw #7a1d0e;
  text-shadow: .5cqw .5cqw 0 #b33a12, 1cqw 1cqw 0 #7a1d0e, 1.4cqw 1.4cqw 0 rgba(0, 0, 0, .55); }
.ue-titel__oben em { font-style: normal; font-size: 1.25em; color: #ffb21f; }
.ue-titel__schild { display: inline-flex; align-items: center; gap: 1.6cqw; margin-top: 1.4cqw; padding: .8cqw 3cqw; border: .5cqw solid #3d2410; border-radius: .6cqw;
  background: repeating-linear-gradient(180deg, #7a4d27 0 2.2cqw, #6a4120 2.2cqw 2.5cqw); transform: rotate(-1.5deg);
  font-size: 6cqw; color: #dfe6ff; -webkit-text-stroke: .2cqw #2a3570; text-shadow: .4cqw .4cqw 0 #2a3570, .8cqw .8cqw 0 rgba(0, 0, 0, .5); box-shadow: .6cqw .8cqw 0 rgba(0, 0, 0, .45); }
.ue-titel__schild span { font-size: 4.6cqw; -webkit-text-stroke: 0; text-shadow: none; }
.ue-titel__tafel { position: absolute; left: 13%; top: 33%; z-index: 2; margin: 0; padding: 1.2cqw 2.4cqw; border: .7cqw solid #4a2c12; border-radius: .6cqw; background: #2e3b2c;
  font-family: "Comic Sans MS", "Chalkboard SE", "Segoe Print", cursive; font-size: 5cqw; font-weight: 700; color: #f3ecd2; transform: rotate(-3deg); box-shadow: .6cqw .8cqw 0 rgba(0, 0, 0, .5); }
.ue-titel__turm { position: absolute; left: 50%; bottom: 21%; z-index: 2; width: 27%; transform: translateX(-50%); display: flex; flex-direction: column; align-items: center; }
.ue-titel__schwein { font-size: 7cqw; line-height: 1; margin-bottom: -.4cqw; animation: ue-vga-schweben 2.2s ease-in-out infinite; filter: drop-shadow(0 .4cqw 0 rgba(0, 0, 0, .35)); }
.ue-titel__bloecke { display: grid; grid-template-columns: repeat(6, 1fr); gap: .25cqw; width: 100%; }
.ue-titel__bloecke .ue-tnt { aspect-ratio: 1; }
.ue-titel__bloecke .ue-tnt b { font-size: 1.1cqw; }
.ue-titel__menue { position: absolute; left: 50%; bottom: 2.5%; z-index: 3; transform: translateX(-50%); display: flex; flex-direction: column; align-items: stretch; gap: .4cqw; width: 36%; padding: 1.2cqw; border: .6cqw solid #e8b923; border-radius: .8cqw; background: rgba(8, 12, 40, .92); box-shadow: 0 0 0 .3cqw #1b1b3a, .8cqw .8cqw 0 rgba(0, 0, 0, .5); }
.ue-titel__punkt { position: relative; padding: .5cqw 1cqw .5cqw 4cqw; border: .35cqw solid transparent; border-radius: .5cqw; background: none; color: #c9d2ff; font-family: 'Press Start 2P', ui-monospace, monospace; font-weight: 900; font-size: 3.4cqw; text-align: center; cursor: pointer; text-shadow: .3cqw .3cqw 0 #000; outline: none; }
.ue-titel__punkt.is-gewaehlt { border-color: #ffd23a; color: #ffe36b; }
.ue-titel__punkt.is-gewaehlt::before { content: "▶"; position: absolute; left: 1.2cqw; top: 50%; transform: translateY(-50%); color: #ffd23a; animation: ue-vga-blinken 1s steps(1) infinite; }
.ue-titel__punkt:focus-visible { box-shadow: 0 0 0 .3cqw #fff; }
@media (prefers-reduced-motion: reduce) { .ue-titel__funkeln::before, .ue-titel__funkeln::after, .ue-titel__schwein, .ue-titel__punkt.is-gewaehlt::before { animation: none; } }

.ue-optionen { z-index: 950; }
.ue-optionen__kasten { width: min(560px, 100%); }
.ue-optionen__titel { margin: 0 0 12px; font-family: var(--font-display); font-size: 1.4rem; color: var(--navy); }
.ue-optionen .ue-musik { margin: 0; box-shadow: none; }
.ue-optionen .ue-musik__deko { display: none; }

.ue-optionen__teil { padding: 12px 0; border-top: 1px solid #ecebf5; }
.ue-optionen__teil:first-of-type { border-top: 0; padding-top: 0; }
.ue-optionen__teil h4 { margin: 0 0 6px; font-size: 1.05rem; color: var(--navy); }
.ue-optionen__teil p { margin: 0 0 8px; }
.ue-optionen__laden label { display: block; margin-bottom: 6px; }
.ue-optionen__laden .ue-fortsetzen__zeile { display: flex; flex-wrap: wrap; gap: 8px; }
.ue-optionen__laden input { flex: 1 1 200px; padding: 10px 14px; border: 2px solid #dfe1ec; border-radius: var(--radius-pill); font: inherit; letter-spacing: .05em; }
.ue-optionen__kasten { max-height: calc(100vh - 32px); overflow: auto; }

.ue-titel__turm { width: 19%; bottom: 33%; }
.ue-titel__schwein { font-size: 5.6cqw; }
.ue-titel__bloecke .ue-tnt b { font-size: .9cqw; }
.ue-titel__tafel { left: 9%; top: 38%; font-size: 4.4cqw; }
.ue-titel__menue { width: 34%; gap: .15cqw; padding: .8cqw; bottom: 2%; }
.ue-titel__punkt { font-size: 3cqw; padding: .3cqw 1cqw .3cqw 3.6cqw; }

.ue-titel { background: #0b1440 url("/images/lernmission-1x1/spiel/hintergrund.webp") center / cover no-repeat; }
.ue-titel__logo { position: absolute; left: 50%; top: 2%; z-index: 2; width: 80%; height: auto; transform: translateX(-50%); filter: drop-shadow(0 .6cqw 0 rgba(0, 0, 0, .45)); }
.ue-titel__tafel-bild { position: absolute; left: 4%; top: 33%; z-index: 2; width: 27%; height: auto; transform: rotate(-3deg); }
.ue-titel__turm { position: absolute; left: 50%; bottom: 24%; z-index: 2; width: 23%; transform: translateX(-50%); display: flex; flex-direction: column; align-items: center; }
.ue-titel__sau { width: 62%; height: auto; margin-bottom: -2%; animation: ue-vga-schweben 2.2s ease-in-out infinite; }
.ue-titel__tnt { width: 100%; height: auto; }
.ue-titel__menue { bottom: 2%; }

.ue-prolog__welt, .ue-prolog__welt.is-nacht { background: #0b1440 url("/images/lernmission-1x1/spiel/hintergrund.webp") center 62% / cover no-repeat; padding: 70px 12px 74px; }
.ue-prolog__welt::after { content: ""; position: absolute; inset: 0; pointer-events: none; background: rgba(5, 10, 40, 0); transition: background 2s ease; }
.ue-prolog__welt.is-nacht::after { background: rgba(5, 10, 40, .25); }
.ue-prolog__mondlicht { position: absolute; right: 7%; top: 2%; width: 26%; aspect-ratio: 1; border-radius: 50%; pointer-events: none; z-index: 1;
  background: radial-gradient(circle, rgba(255, 246, 190, .55) 0%, rgba(255, 246, 190, 0) 65%); opacity: 0; transition: opacity 2s ease; }
.ue-prolog__welt.is-mond .ue-prolog__mondlicht { opacity: 1; animation: ue-mond-pulsieren 2.4s ease-in-out infinite; }
@keyframes ue-mond-pulsieren { 50% { transform: scale(1.12); } }
.ue-prolog__feldraster { z-index: 2; width: min(46%, 300px); gap: 2px; }
@media (max-width: 560px) { .ue-prolog__feldraster { width: 62%; margin: 0 auto 0 12%; } }
.ue-prolog__feld { border-radius: 2px; box-shadow: inset 0 0 0 1px rgba(0, 0, 0, .45);
  background: radial-gradient(circle at 22% 62%, #c98a4a 0 6%, transparent 7%), radial-gradient(circle at 70% 78%, #c98a4a 0 5%, transparent 6%), radial-gradient(circle at 58% 48%, #a8693a 0 5%, transparent 6%),
    linear-gradient(180deg, #7bd23d 0 16%, #4f9a24 16% 24%, #8a5226 24% 100%); }
.ue-prolog__feld:hover { box-shadow: inset 0 0 0 2px #fff; }
.ue-prolog__feld.is-tnt { background: none; box-shadow: none; }
.ue-tnt-bild { display: block; width: 100%; height: 100%; object-fit: contain; image-rendering: pixelated; animation: ue-prolog-setzen .18s ease-out; }
.ue-prolog__mathe { padding: 6px 18px; border: 0; border-radius: 4px; background: repeating-linear-gradient(180deg, #7a4a24 0 8px, #6a3e1c 8px 10px); color: #ffd54a;
  box-shadow: inset 0 0 0 3px #3d2410, 0 4px 0 rgba(0, 0, 0, .45); text-shadow: 2px 2px 0 #3d2410; }
.ue-prolog .ue-prolog__mathe { color: #ffd54a; }
.ue-prolog__feuer { right: 6%; bottom: 10px; z-index: 2; font-size: 0; animation: none; filter: none; }
.ue-prolog__feuer span { display: block; font-size: 2.6rem; line-height: 1; animation: ue-flackern .4s ease-in-out infinite alternate; filter: drop-shadow(0 0 12px rgba(255, 170, 0, .95)); }
.ue-prolog__feuer::after { content: ""; display: block; width: 3.4rem; height: .8rem; margin: -6px auto 0; border-radius: 50%; background: radial-gradient(ellipse, #6b6b6b 0 45%, #3e3e3e 46% 70%, transparent 71%); }

.ue-prolog__schwein { bottom: 8px; z-index: 3; font-size: 0; }
.ue-sau { display: block; width: clamp(56px, 9cqw, 96px); aspect-ratio: 1; background: url("/images/lernmission-1x1/spiel/schwein-sprites.webp") 66.667% 50% / 400% 300% no-repeat; image-rendering: pixelated; }
.ue-prolog__welt { container-type: inline-size; }
.ue-prolog__schwein.is-laeuft .ue-sau { background-position-y: 0%; animation: ue-sau-laufen .5s steps(4) infinite; }
.ue-prolog__schwein.is-brennt .ue-sau { background-position: 0% 100%; }
.ue-prolog__schwein.is-brennt.is-laeuft .ue-sau { background-position-y: 100%; }
@keyframes ue-sau-laufen { from { background-position-x: 0%; } to { background-position-x: 133.333%; } }
.ue-prolog__schwein.is-links { transform: scaleX(-1); }
.ue-prolog__leiste { background: #2a1a0c; box-shadow: inset 0 0 0 4px #7a4a24, inset 0 0 0 6px #3d2410; border-radius: 0 0 10px 10px; padding: 8px; }
.ue-prolog__platz { background: #1f2340; box-shadow: inset 2px 2px 0 #0d0f20, inset -2px -2px 0 #3a3f6a; }
.ue-prolog__platz .ue-tnt-bild { width: 78%; height: 78%; }
.ue-prolog__pfeil { background: #1b2a6b; border: 3px solid #e8b923; box-shadow: 0 4px 0 #0d1540; }
.ue-prolog__pfeil:active { transform: translateY(2px); box-shadow: 0 2px 0 #0d1540; }

.ue-prolog__feuer::after { display: none; }
.ue-feuer { display: block; width: clamp(54px, 8cqw, 90px); aspect-ratio: 120 / 143; background: url("/images/lernmission-1x1/spiel/lagerfeuer.webp") 0 0 / 800% 100% no-repeat;
  image-rendering: pixelated; animation: ue-feuer-flackern .8s steps(8) infinite; filter: drop-shadow(0 0 10px rgba(255, 160, 0, .7)); }
@keyframes ue-feuer-flackern { from { background-position-x: 0%; } to { background-position-x: 114.2857%; } }
@media (prefers-reduced-motion: reduce) { .ue-feuer { animation: none; } }

.ue-titel__logo { width: 66%; top: 1.5%; }
.ue-titel__turm { width: 16.5%; bottom: 31%; }
.ue-titel__tafel-bild { top: 36%; width: 25%; }

.ue-prolog__feld { background: url("/images/lernmission-1x1/spiel/gras.webp") center / 100% 100% no-repeat; box-shadow: none; image-rendering: pixelated; }
.ue-prolog__feld:hover, .ue-prolog__feld:focus-visible { background-image: url("/images/lernmission-1x1/spiel/gras-aktiv.webp"); box-shadow: none; outline: none; }
.ue-prolog__feld.is-tnt { background: none; }
.ue-prolog__feld.is-tnt.is-weg { background: #3b2a1a; }
.ue-prolog__platz { background: url("/images/lernmission-1x1/spiel/platz.webp") center / 100% 100% no-repeat; box-shadow: none; }
.ue-prolog__platz.is-gewaehlt { outline: 3px solid #f5c518; outline-offset: -1px; border-radius: 4px; }
.ue-prolog__pfeil { width: 72px; height: 68px; border: 0; background: center / contain no-repeat; box-shadow: none; image-rendering: pixelated; }
.ue-prolog__pfeil--links { background-image: url("/images/lernmission-1x1/spiel/pfeil-links.webp"); }
.ue-prolog__pfeil--rechts { background-image: url("/images/lernmission-1x1/spiel/pfeil-rechts.webp"); }
.ue-prolog__pfeil:active { transform: translateY(2px) scale(.97); box-shadow: none; }
.ue-prolog__schild { display: block; width: min(320px, 80%); height: auto; margin: 16px auto 0; image-rendering: pixelated; }

.ue-prolog__welt, .ue-prolog__welt.is-nacht { background-image: url("/images/lernmission-1x1/spiel/spielwelt.webp"); background-position: center 70%; }
.ue-prolog__mondlicht { right: 5%; top: 0; width: 22%; }

.ue-prolog .ue-karte__titel, .ue-kopf__pause, .ue-titel__punkt, .ue-prolog__ueberspringen, .ue-optionen__titel, .ue-vollbild {
  font-family: 'Press Start 2P', ui-monospace, monospace; font-weight: 700; letter-spacing: .01em; }
.ue-prolog .ue-karte__titel { font-size: clamp(1.5rem, 4vw, 2.1rem); color: #141a3c; }
.ue-titel__punkt { font-size: 3.6cqw; text-transform: none; }
.ue-prolog__text, .ue-prolog__zaehler, .ue-prolog__satz { font-family: 'Nunito', sans-serif; }
.ue-prolog__mathe, .ue-prolog__platz b, .ue-prolog__rechnung, .ue-prolog__zaehler b {
  font-family: 'Press Start 2P', ui-monospace, monospace; font-weight: 400; letter-spacing: 0; }
.ue-prolog__mathe { font-size: clamp(.8rem, 3.2vw, 1.25rem); padding: 10px 16px; line-height: 1.2; }
.ue-prolog__platz b { font-size: .6rem; }
.ue-prolog__rechnung { font-size: clamp(.8rem, 3vw, 1.1rem); gap: 8px 14px; line-height: 1.6; }
.ue-kopf__pause { font-size: .95rem; }

.ue-app .ue-karte:not(.ue-prolog) { padding: 22px 26px 120px; color: #fff; border: 4px solid #2e1a0a; border-radius: 14px; overflow: hidden; background: linear-gradient(180deg, rgba(5, 10, 40, .72) 0%, rgba(5, 10, 40, .45) 45%, rgba(5, 10, 40, .1) 80%), #0b1440 url('/images/lernmission-1x1/spiel/spielwelt.webp') center bottom / cover no-repeat; box-shadow: inset 0 0 0 3px #7a4a24, 0 12px 30px rgba(0, 0, 40, .35) }
.ue-app .ue-karte:not(.ue-prolog)::after { content: ''; position: absolute; left: 3%; bottom: 10px; width: 76px; aspect-ratio: 1; pointer-events: none; z-index: 0; background: url('/images/lernmission-1x1/spiel/schwein-sprites.webp') 66.667% 50% / 400% 300% no-repeat; image-rendering: pixelated; animation: ue-vga-schweben 2.6s ease-in-out infinite; }
.ue-app .ue-karte:not(.ue-prolog) > * { position: relative; z-index: 1 }
.ue-app .ue-karte:not(.ue-prolog) .ue-kopf__eis { background: repeating-linear-gradient(180deg, #6e4220 0 10px, #5e3818 10px 12px); border: 3px solid #2e1a0a; box-shadow: inset 0 0 0 2px #8f5a2c, 0 4px 0 rgba(0, 0, 0, .45); border-radius: 6px; color: #fff; padding: 6px 14px; font-family: 'Press Start 2P', ui-monospace, monospace; font-weight: 700; font-size: 1rem }
.ue-app .ue-karte:not(.ue-prolog) .ue-kopf__eis b { color: #ffd54a }
.ue-app .ue-karte:not(.ue-prolog) .ue-kopf__pause, .ue-app .ue-karte:not(.ue-prolog) .ue-farm-knopf { background: #13205a; color: #fff; border: 3px solid #e8b923; border-radius: 6px; box-shadow: 0 4px 0 #0a1238; padding: 6px 14px; font-family: 'Press Start 2P', ui-monospace, monospace; font-weight: 700 }
.ue-app .ue-karte:not(.ue-prolog) .ue-karte__nr { background: repeating-linear-gradient(180deg, #6e4220 0 10px, #5e3818 10px 12px); border: 3px solid #2e1a0a; box-shadow: inset 0 0 0 2px #8f5a2c, 0 4px 0 rgba(0, 0, 0, .45); border-radius: 6px; display: inline-block; margin: 14px 0 6px; padding: 6px 12px; color: #ffd54a; font-family: 'Press Start 2P', ui-monospace, monospace; font-size: .62rem; letter-spacing: .04em; line-height: 1.4 }
.ue-app .ue-karte:not(.ue-prolog) .ue-karte__titel { font-family: 'Press Start 2P', ui-monospace, monospace; font-weight: 700; font-size: clamp(1.6rem, 4vw, 2.4rem); color: #fff; text-shadow: 3px 3px 0 #0a0f2e, 0 0 12px rgba(0, 0, 0, .6); margin: 4px 0 12px }
.ue-app .ue-karte:not(.ue-prolog) > p:not(.ue-karte__nr):not(.ue-rueckmeldung):not(.ue-form-satz), .ue-app .ue-karte:not(.ue-prolog) .ue-kohle > p, .ue-app .ue-karte:not(.ue-prolog) > .ue-zaehler, .ue-app .ue-karte:not(.ue-prolog) > .ue-warte-zeile { background: repeating-linear-gradient(180deg, #6e4220 0 10px, #5e3818 10px 12px); border: 3px solid #2e1a0a; box-shadow: inset 0 0 0 2px #8f5a2c, 0 4px 0 rgba(0, 0, 0, .45); border-radius: 6px; color: #fff !important; padding: 9px 16px; margin: 10px 0 }
.ue-app .ue-karte:not(.ue-prolog) > p b, .ue-app .ue-karte:not(.ue-prolog) > p strong { color: #ffe7a0 }
.ue-app .ue-karte:not(.ue-prolog) h3 { color: #fff; font-family: 'Press Start 2P', ui-monospace, monospace; text-shadow: 2px 2px 0 #0a0f2e }
.ue-app .ue-karte:not(.ue-prolog) .ue-frage-bild, .ue-app .ue-karte:not(.ue-prolog) .ue-geschichte, .ue-app .ue-karte:not(.ue-prolog) .ue-memory, .ue-app .ue-karte:not(.ue-prolog) .ue-bruecke, .ue-app .ue-karte:not(.ue-prolog) .ue-herleitung__zeile, .ue-app .ue-karte:not(.ue-prolog) .ue-ueberblick, .ue-app .ue-karte:not(.ue-prolog) .ue-tabelle, .ue-app .ue-karte:not(.ue-prolog) .ue-pyramide, .ue-app .ue-karte:not(.ue-prolog) .ue-form-satz, .ue-app .ue-karte:not(.ue-prolog) .ue-rezept, .ue-app .ue-karte:not(.ue-prolog) .ue-kohle__zeile, .ue-app .ue-karte:not(.ue-prolog) .ue-spiel, .ue-app .ue-karte:not(.ue-prolog) .ue-basteln, .ue-turmrechnung { background: #f6ecd2; color: #1f2a4d; border: 4px solid #6b4220; box-shadow: inset 0 0 0 2px #c79a5c, 0 5px 0 rgba(0, 0, 0, .4); border-radius: 8px; padding: 14px }
.ue-app .ue-karte:not(.ue-prolog) .ue-herleitung__zeile--ziel { background: #e3f6d8 }
.ue-app .ue-karte:not(.ue-prolog) .ue-fuenf span, .ue-app .ue-karte:not(.ue-prolog) .ue-skala__wahl, .ue-app .ue-karte:not(.ue-prolog) .ue-auswahl__bild, .ue-app .ue-karte:not(.ue-prolog) .ue-wahl-rechnung, .ue-app .ue-karte:not(.ue-prolog) .ue-aufdecken, .ue-app .ue-karte:not(.ue-prolog) .ue-basteln__feld, .ue-app .ue-karte:not(.ue-prolog) .ue-basteln__zeichen { background: #f6ecd2; color: #1f2a4d; border: 4px solid #6b4220; box-shadow: inset 0 0 0 2px #c79a5c, 0 5px 0 rgba(0, 0, 0, .4); border-radius: 8px; font-family: 'Press Start 2P', ui-monospace, monospace; font-weight: 700 }
.ue-app .ue-karte:not(.ue-prolog) .ue-skala__wahl[aria-checked='true'], .ue-app .ue-karte:not(.ue-prolog) .ue-auswahl__bild[aria-pressed='true'], .ue-app .ue-karte:not(.ue-prolog) .ue-basteln__zeichen[aria-checked='true'], .ue-app .ue-karte:not(.ue-prolog) .ue-wahl-rechnung.is-richtig { background: #d9d2ff; border-color: #f5c518; box-shadow: inset 0 0 0 2px #fff3b0, 0 0 0 3px #f5c518, 0 5px 0 rgba(0, 0, 0, .4) }
.ue-app .ue-karte:not(.ue-prolog) .ue-rueckmeldung:not(:empty) { background: #f6ecd2; color: #1f2a4d; border: 4px solid #6b4220; box-shadow: inset 0 0 0 2px #c79a5c, 0 5px 0 rgba(0, 0, 0, .4); border-radius: 8px; padding: 10px 14px }
.ue-app .ue-karte:not(.ue-prolog) .ue-frage__feld { background: #e6e3ff; color: #13205a; border: 4px solid #3a3fbf; box-shadow: 0 0 0 4px #f5c518, 0 6px 0 rgba(0, 0, 0, .4); border-radius: 8px; font-family: 'Press Start 2P', ui-monospace, monospace; font-size: 1.3rem }
.ue-app .ue-karte:not(.ue-prolog) .btn-primary { background: #f5c518; color: #1b1b3a; border: 4px solid #2e1a0a; border-radius: 8px; box-shadow: inset 0 0 0 2px #ffe680, 0 5px 0 #8a5a12; font-family: 'Press Start 2P', ui-monospace, monospace; font-weight: 700 }
.ue-app .ue-karte:not(.ue-prolog) .btn-primary:hover { background: #ffd23a; transform: translateY(-1px) }
.ue-app .ue-karte:not(.ue-prolog) .btn-primary:disabled { opacity: .6 }
.ue-app .ue-karte:not(.ue-prolog) .btn-outline { background: #13205a; color: #fff; border: 4px solid #e8b923; border-radius: 8px; box-shadow: 0 5px 0 #0a1238; font-family: 'Press Start 2P', ui-monospace, monospace; font-weight: 700 }
.ue-app .ue-karte:not(.ue-prolog) .btn-outline:hover { background: #1d2f7a; color: #fff }
.ue-app .ue-karte:not(.ue-prolog) #ue-zurueck::before { content: '◀ '; color: #fff }
.ue-app .ue-karte:not(.ue-prolog) .ue-punkte { background: repeating-linear-gradient(180deg, #6e4220 0 10px, #5e3818 10px 12px); border: 3px solid #2e1a0a; box-shadow: inset 0 0 0 2px #8f5a2c, 0 4px 0 rgba(0, 0, 0, .45); border-radius: 6px; display: inline-flex; gap: 6px; padding: 7px 12px; margin: 6px 0 10px }
.ue-app .ue-karte:not(.ue-prolog) .ue-punkte i { width: 14px; height: 14px; border-radius: 50%; background: #b8bccb; box-shadow: inset -2px -2px 0 rgba(0, 0, 0, .25) }
.ue-app .ue-karte:not(.ue-prolog) .ue-punkte i.is-fertig { background: #3fbf3f }
.ue-app .ue-karte:not(.ue-prolog) .ue-punkte i.is-jetzt { background: #f5c518 }
.ue-app .ue-karte:not(.ue-prolog) .ue-gruppen { background: repeating-linear-gradient(180deg, #6e4220 0 10px, #5e3818 10px 12px); border: 3px solid #2e1a0a; box-shadow: inset 0 0 0 2px #8f5a2c, 0 4px 0 rgba(0, 0, 0, .45); border-radius: 6px; display: inline-flex; padding: 6px 12px; color: #fff }
.ue-app .ue-karte:not(.ue-prolog) .ue-gruppen__nr { background: #f6ecd2; color: #1f2a4d; border: 3px solid #6b4220; font-family: 'Press Start 2P', ui-monospace, monospace; font-weight: 700 }
.ue-app .ue-karte:not(.ue-prolog) .ue-gruppen__nr.is-jetzt { background: #f5c518; border-color: #8a5a12 }
.ue-app .ue-karte:not(.ue-prolog) .ue-raster { padding: 8px; background: #2a1a0c; border: 4px solid #6b4220; border-radius: 8px; box-shadow: inset 0 0 0 2px #8f5a2c }
.ue-app .ue-karte:not(.ue-prolog) .ue-zelle { border: 2px solid rgba(0, 0, 0, .45); box-shadow: inset 0 -3px 0 rgba(0, 0, 0, .18); font-family: 'Press Start 2P', ui-monospace, monospace; font-weight: 700; border-radius: 6px }
.ue-app .ue-karte:not(.ue-prolog) .ue-zelle.is-verborgen { background: #3b2614 !important; border-color: #2a1a0c; color: transparent }
.ue-app .ue-karte:not(.ue-prolog) .ue-legende span { border: 2px solid rgba(0, 0, 0, .45); box-shadow: 0 3px 0 rgba(0, 0, 0, .35); font-family: 'Press Start 2P', ui-monospace, monospace }
.ue-app .ue-karte:not(.ue-prolog) .ue-tempo__wert { color: #fff }
.ue-app .ue-karte:not(.ue-prolog) .ue-ueberblick__feld { border: 1px solid rgba(0, 0, 0, .25) }
.ue-app .ue-karte:not(.ue-prolog) .ue-rechnung, .ue-app .ue-karte:not(.ue-prolog) .ue-tafel__ziffer b, .ue-app .ue-karte:not(.ue-prolog) .ue-fuenf span { font-family: 'Press Start 2P', ui-monospace, monospace; font-weight: 700 }
@media (max-width: 720px) { .ue-app .ue-karte:not(.ue-prolog) { padding: 18px 14px 110px; } .ue-app .ue-karte:not(.ue-prolog)::after { width: 58px; } }

.ue-app .ue-karte:not(.ue-prolog) .ue-rechnung, .ue-app .ue-karte:not(.ue-prolog) .ue-rechnung b, .ue-app .ue-karte:not(.ue-prolog) .ue-tafel__ziffer b, .ue-app .ue-karte:not(.ue-prolog) .ue-fuenf span, .ue-app .ue-karte:not(.ue-prolog) .ue-skala__wahl b, .ue-app .ue-karte:not(.ue-prolog) .ue-wahl-rechnung, .ue-app .ue-karte:not(.ue-prolog) .ue-memory__zahl, .ue-app .ue-karte:not(.ue-prolog) .ue-herleitung__zeile b, .ue-app .ue-karte:not(.ue-prolog) .ue-bruecke b, .ue-app .ue-karte:not(.ue-prolog) .ue-form-satz { font-family: 'Press Start 2P', ui-monospace, monospace; font-weight: 400; letter-spacing: 0 }
.ue-app .ue-karte:not(.ue-prolog) .ue-fuenf span, .ue-app .ue-karte:not(.ue-prolog) .ue-wahl-rechnung { font-size: .85rem; line-height: 1.6 }
.ue-app .ue-karte:not(.ue-prolog) .ue-rechnung { font-size: clamp(1rem, 3.4vw, 1.5rem); line-height: 1.6 }
.ue-app .ue-karte:not(.ue-prolog) .ue-zelle, .ue-app .ue-karte:not(.ue-prolog) .ue-legende span, .ue-app .ue-karte:not(.ue-prolog) .ue-ueberblick__feld, .ue-app .ue-karte:not(.ue-prolog) .ue-skala__wahl small { font-family: 'Nunito', sans-serif; font-weight: 800 }
.ue-app .ue-karte:not(.ue-prolog) .ue-warte { color: #ffd54a !important }
.ue-app .ue-karte:not(.ue-prolog) .btn, .ue-app .ue-karte:not(.ue-prolog) .ue-kopf__pause, .ue-app .ue-karte:not(.ue-prolog) .ue-farm-knopf, .ue-app .ue-karte:not(.ue-prolog) .ue-kopf__eis { font-family: 'Nunito', sans-serif; font-weight: 900; letter-spacing: .01em }

.ue-app .ue-karte:not(.ue-prolog) , .ue-app .ue-karte:not(.ue-prolog) .ue-karte__titel, .ue-app .ue-karte:not(.ue-prolog) .btn, .ue-app .ue-karte:not(.ue-prolog) h3 { font-variant-ligatures: none; font-feature-settings: 'liga' 0, 'clig' 0 }
.ue-app .ue-karte:not(.ue-prolog) .ue-herleitung__zeile b, .ue-app .ue-karte:not(.ue-prolog) .ue-bruecke b, .ue-app .ue-karte:not(.ue-prolog) .ue-form-satz { font-family: 'Nunito', sans-serif; font-weight: 900 }

.ue-naschbaer__sprite { display: block; width: clamp(150px, 34vw, 230px); aspect-ratio: 200 / 202; margin: 0 auto; background: url("/images/lernmission-1x1/spiel/naschbaer-feier.webp") 0 0 / 800% 100% no-repeat;
  image-rendering: pixelated; animation: ue-naschbaer-jubeln 1.6s steps(8) infinite; filter: drop-shadow(0 6px 0 rgba(0, 0, 0, .35)); }
@keyframes ue-naschbaer-jubeln { from { background-position-x: 0%; } to { background-position-x: 114.2857%; } }
@media (prefers-reduced-motion: reduce) { .ue-naschbaer__sprite { animation: none; background-position-x: 85.714%; } }
.ue-app .ue-karte:not(.ue-prolog) .ue-naschbaer { display: flex; flex-direction: column; align-items: center; gap: 10px; text-align: center; }
.ue-app .ue-karte:not(.ue-prolog) .ue-naschbaer p { background: repeating-linear-gradient(180deg, #6e4220 0 10px, #5e3818 10px 12px); border: 3px solid #2e1a0a; box-shadow: inset 0 0 0 2px #8f5a2c, 0 4px 0 rgba(0, 0, 0, .45); border-radius: 6px; color: #fff; padding: 9px 18px; margin: 0; }
.ue-app .ue-karte:not(.ue-prolog) .ue-naschbaer .ue-naschbaer__plus { background: #f6ecd2; color: #1f2a4d; border: 4px solid #6b4220; box-shadow: inset 0 0 0 2px #c79a5c, 0 5px 0 rgba(0, 0, 0, .4); font-family: 'Press Start 2P', ui-monospace, monospace; font-size: 1.3rem; padding: 12px 22px; }
.ue-app .ue-karte:not(.ue-prolog) .ue-naschbaer p b { color: #ffe7a0; }

.ue-app .ue-karte:not(.ue-prolog) .ue-code, .ue-app .ue-karte:not(.ue-prolog) .ue-wette, .ue-app .ue-karte:not(.ue-prolog) .ue-spass button, .ue-app .ue-karte:not(.ue-prolog) .ue-wort { background: #f6ecd2; color: #1f2a4d; border: 4px solid #6b4220; box-shadow: inset 0 0 0 2px #c79a5c, 0 5px 0 rgba(0, 0, 0, .4); border-radius: 8px; }
.ue-app .ue-karte:not(.ue-prolog) .ue-code p, .ue-app .ue-karte:not(.ue-prolog) .ue-wette p, .ue-app .ue-karte:not(.ue-prolog) .ue-wette h3 { color: #1f2a4d; text-shadow: none; background: none; border: 0; box-shadow: none; }

.ue-app .ue-karte:not(.ue-prolog) .ue-gebirge, .ue-app .ue-karte:not(.ue-prolog) .ue-farm { border: 6px solid #6b4220; box-shadow: inset 0 0 0 3px #3d2410, 0 0 0 3px #2e1a0a, 0 8px 0 rgba(0, 0, 0, .45); border-radius: 10px; max-width: 680px; }
.ue-app .ue-karte:not(.ue-prolog) .ue-gebirge { height: 300px; }
.ue-app .ue-karte:not(.ue-prolog) .ue-inv { background: repeating-linear-gradient(180deg, #6e4220 0 10px, #5e3818 10px 12px); border: 3px solid #2e1a0a; box-shadow: inset 0 0 0 2px #8f5a2c, 0 4px 0 rgba(0, 0, 0, .45); border-radius: 8px; padding: 8px 12px 10px; }
.ue-app .ue-karte:not(.ue-prolog) .ue-inv .ue-mc__label { color: #fff; font-family: 'Press Start 2P', ui-monospace, monospace; font-weight: 700; text-shadow: 2px 2px 0 #2e1a0a; }
.ue-app .ue-karte:not(.ue-prolog) .ue-inv__leiste .ue-mc__slot { background: #8b8b8b; box-shadow: inset 2px 2px 0 #5a5a5a, inset -2px -2px 0 #c6c6c6; }
.ue-app .ue-karte:not(.ue-prolog) .ue-werkstatt { background: repeating-linear-gradient(180deg, #6e4220 0 10px, #5e3818 10px 12px); border: 3px solid #2e1a0a; box-shadow: inset 0 0 0 2px #8f5a2c, 0 4px 0 rgba(0, 0, 0, .45); border-radius: 8px; color: #fff; max-width: 680px; }
.ue-app .ue-karte:not(.ue-prolog) .ue-region { border: 3px solid #6b4220; background: #f6ecd2; color: #1f2a4d; box-shadow: 0 4px 0 rgba(0, 0, 0, .4); }
.ue-app .ue-karte:not(.ue-prolog) .ue-farm__hinweis { font-family: 'Nunito', sans-serif; }

.ue-app .ue-karte:not(.ue-prolog) p { color: inherit; }
.ue-app .ue-karte:not(.ue-prolog) #ue-farm-platz > p, .ue-app .ue-karte:not(.ue-prolog) .ue-farm-fenster > p { background: repeating-linear-gradient(180deg, #6e4220 0 10px, #5e3818 10px 12px); border: 3px solid #2e1a0a; box-shadow: inset 0 0 0 2px #8f5a2c, 0 4px 0 rgba(0, 0, 0, .45); border-radius: 8px; color: #fff; padding: 9px 16px; }
.ue-app .ue-karte:not(.ue-prolog) #ue-farm-platz > p b { color: #ffe7a0; }
.ue-app .ue-karte:not(.ue-prolog) .ue-farm__kiste { background: repeating-linear-gradient(180deg, #6e4220 0 10px, #5e3818 10px 12px); border: 3px solid #2e1a0a; box-shadow: inset 0 0 0 2px #8f5a2c, 0 4px 0 rgba(0, 0, 0, .45); border-radius: 8px; color: #fff; }

.ue-optionen .ue-optionen__kasten { background: #0f1a4a url("/images/lernmission-1x1/spiel/spielwelt.webp") center bottom / cover; background-blend-mode: multiply; color: #fff;
  border: 6px solid #6b4220; box-shadow: inset 0 0 0 3px #3d2410, 0 0 0 3px #2e1a0a, 0 12px 40px rgba(0, 0, 0, .55); border-radius: 12px; padding: 18px 20px; }
.ue-optionen .ue-optionen__titel { color: #fff; font-family: 'Press Start 2P', ui-monospace, monospace; font-weight: 700; font-size: 1.8rem; text-shadow: 3px 3px 0 #0a0f2e; font-variant-ligatures: none; }
.ue-optionen .ue-optionen__teil { background: repeating-linear-gradient(180deg, #6e4220 0 10px, #5e3818 10px 12px); border: 3px solid #2e1a0a; box-shadow: inset 0 0 0 2px #8f5a2c, 0 4px 0 rgba(0, 0, 0, .45); border-radius: 8px; padding: 12px 14px; margin: 0 0 12px; border-top: 3px solid #2e1a0a; color: #fff; }
.ue-optionen .ue-optionen__teil:first-of-type { padding-top: 12px; }
.ue-optionen .ue-optionen__teil h4 { color: #ffd54a; font-family: 'Press Start 2P', ui-monospace, monospace; font-weight: 700; font-size: 1.15rem; text-shadow: 2px 2px 0 #2e1a0a; font-variant-ligatures: none; }
.ue-optionen .ue-optionen__teil p, .ue-optionen .ue-optionen__laden label { color: #fff; }
.ue-optionen .ue-optionen__laden input { background: #e6e3ff; color: #13205a; border: 4px solid #3a3fbf; box-shadow: 0 0 0 3px #f5c518; border-radius: 6px; font-family: 'Press Start 2P', ui-monospace, monospace; font-size: .8rem; }
.ue-optionen .btn-primary { background: #f5c518; color: #1b1b3a; border: 4px solid #2e1a0a; border-radius: 8px; box-shadow: inset 0 0 0 2px #ffe680, 0 5px 0 #8a5a12; font-family: 'Nunito', sans-serif; font-weight: 900; }
.ue-optionen .btn-outline { background: #13205a; color: #fff; border: 4px solid #e8b923; border-radius: 8px; box-shadow: 0 5px 0 #0a1238; font-family: 'Nunito', sans-serif; font-weight: 900; }
.ue-optionen .ue-musik { background: #f6ecd2; color: #1f2a4d; border: 4px solid #6b4220; box-shadow: inset 0 0 0 2px #c79a5c, 0 5px 0 rgba(0, 0, 0, .4); border-radius: 8px; padding: 12px 14px; }
.ue-optionen .ue-musik * { color: #1f2a4d; }
.ue-optionen .ue-rueckmeldung:not(:empty) { background: #f6ecd2; color: #1f2a4d; border: 4px solid #6b4220; box-shadow: inset 0 0 0 2px #c79a5c, 0 5px 0 rgba(0, 0, 0, .4); border-radius: 8px; padding: 6px 10px; }

.ue-optionen .ue-optionen__kasten { background: repeating-linear-gradient(180deg, #6e4220 0 12px, #5e3818 12px 14px); padding: 0 16px 16px;
  border: 6px solid #3d2410; box-shadow: inset 0 0 0 3px #8f5a2c, 0 0 0 3px #2e1a0a, 0 12px 40px rgba(0, 0, 0, .55); }
.ue-optionen .ue-optionen__titel { position: relative; margin: -2px -16px 14px; padding: 12px 16px; text-align: center; color: #fff;
  background: repeating-linear-gradient(180deg, #7a4a24 0 10px, #6a3e1c 10px 12px); border-bottom: 4px solid #2e1a0a; box-shadow: inset 0 0 0 2px #9a6232; font-size: 2rem; }
.ue-optionen .ue-optionen__titel::before, .ue-optionen .ue-optionen__titel::after { content: ""; position: absolute; top: 50%; width: 10px; height: 10px; margin-top: -5px; border-radius: 50%; background: #b9c0d6; box-shadow: inset -2px -2px 0 #6b7390; }
.ue-optionen .ue-optionen__titel::before { left: 14px; }
.ue-optionen .ue-optionen__titel::after { right: 14px; }
.ue-optionen .ue-optionen__teil { background: #f6ecd2; color: #1f2a4d; border: 4px solid #6b4220; box-shadow: inset 0 0 0 2px #e6cf9c, 0 4px 0 rgba(0, 0, 0, .35); border-radius: 6px; color: #1f2a4d; padding: 12px 16px 14px; }
.ue-optionen .ue-optionen__teil h4 { color: #1f2a4d; text-shadow: none; font-size: 1.35rem; padding-bottom: 8px; margin-bottom: 8px; border-bottom: 2px dashed #c79a5c; }
.ue-optionen .ue-optionen__teil p, .ue-optionen .ue-optionen__laden label { color: #1f2a4d; }
.ue-optionen .ue-optionen__laden input { background: #fffaf0; box-shadow: none; border: 3px solid #1f2a6b; font-family: 'Nunito', sans-serif; font-weight: 800; font-size: 1rem; letter-spacing: .06em; }
.ue-optionen .btn-primary, .ue-optionen .btn-outline { position: relative; background: #f5c518; color: #1b1b3a; border: 4px solid #2e1a0a; box-shadow: inset 0 0 0 2px #ffe680, 0 5px 0 #8a5a12; padding: 10px 28px; }
.ue-optionen #ue-optionen-zu { width: 100%; font-size: 1.15rem; }
.ue-optionen .ue-musik { background: #fbf3df; border: 2px dashed #c79a5c; box-shadow: none; }
.ue-optionen .ue-knoepfe { margin-top: 4px; }
.ue-optionen .ue-optionen__titel { position: sticky; top: 0; z-index: 2; }
.ue-optionen .ue-optionen__kasten { scroll-padding-top: 70px; }

.ue-app .ue-karte:not(.ue-prolog) { background: linear-gradient(180deg, rgba(5, 10, 40, .55) 0%, rgba(5, 10, 40, .25) 40%, rgba(5, 10, 40, 0) 70%), #0b1440 var(--ue-welt, url('/images/lernmission-1x1/spiel/spielwelt.webp')) 86% bottom / cover no-repeat; }
:root[data-ue-tageszeit="tag"] .ue-app .ue-karte:not(.ue-prolog) { background-color: #6fb6ff; }
.ue-titel { background: #0b1440 var(--ue-titelwelt, url('/images/lernmission-1x1/spiel/hintergrund.webp')) center / cover no-repeat; }
@media (max-width: 720px) { .ue-app .ue-karte:not(.ue-prolog) { background-position: 88% bottom; } }

.ue-app .ue-karte:not(.ue-prolog) > p:not(.ue-karte__nr):not(.ue-rueckmeldung):not(.ue-form-satz), .ue-app .ue-karte:not(.ue-prolog) .ue-kohle > p, .ue-app .ue-karte:not(.ue-prolog) > .ue-zaehler, .ue-app .ue-karte:not(.ue-prolog) > .ue-warte-zeile, .ue-app .ue-karte:not(.ue-prolog) .ue-naschbaer p:not(.ue-naschbaer__plus), .ue-app .ue-karte:not(.ue-prolog) .ue-inv, .ue-app .ue-karte:not(.ue-prolog) .ue-werkstatt, .ue-app .ue-karte:not(.ue-prolog) .ue-farm__kiste, .ue-app .ue-karte:not(.ue-prolog) #ue-farm-platz > p { border-style: solid; border-width: 13px; border-color: transparent; border-image: url('/images/lernmission-1x1/spiel/ui/holzleiste.webp') 26 fill / 13px / 0 stretch; background: none; box-shadow: none; border-radius: 0; padding: 6px 10px; image-rendering: pixelated; filter: drop-shadow(0 4px 0 rgba(0, 0, 0, .35)); color: #fff !important; }
.ue-app .ue-karte:not(.ue-prolog) .ue-kopf__eis, .ue-app .ue-karte:not(.ue-prolog) .ue-karte__nr, .ue-app .ue-karte:not(.ue-prolog) .ue-punkte, .ue-app .ue-karte:not(.ue-prolog) .ue-gruppen { border-style: solid; border-width: 10px; border-color: transparent; border-image: url('/images/lernmission-1x1/spiel/ui/holz-schild.webp') 20 fill / 10px / 0 stretch; background: none; box-shadow: none; border-radius: 0; padding: 4px 8px; image-rendering: pixelated; filter: drop-shadow(0 4px 0 rgba(0, 0, 0, .35)); }
.ue-app .ue-karte:not(.ue-prolog) .ue-frage-bild, .ue-app .ue-karte:not(.ue-prolog) .ue-geschichte, .ue-app .ue-karte:not(.ue-prolog) .ue-memory, .ue-app .ue-karte:not(.ue-prolog) .ue-bruecke, .ue-app .ue-karte:not(.ue-prolog) .ue-herleitung__zeile, .ue-app .ue-karte:not(.ue-prolog) .ue-ueberblick, .ue-app .ue-karte:not(.ue-prolog) .ue-tabelle, .ue-app .ue-karte:not(.ue-prolog) .ue-pyramide, .ue-app .ue-karte:not(.ue-prolog) .ue-form-satz, .ue-app .ue-karte:not(.ue-prolog) .ue-rezept, .ue-app .ue-karte:not(.ue-prolog) .ue-kohle__zeile, .ue-app .ue-karte:not(.ue-prolog) .ue-spiel, .ue-app .ue-karte:not(.ue-prolog) .ue-turmrechnung, .ue-app .ue-karte:not(.ue-prolog) .ue-rueckmeldung:not(:empty), .ue-app .ue-karte:not(.ue-prolog) .ue-code, .ue-app .ue-karte:not(.ue-prolog) .ue-wette, .ue-app .ue-karte:not(.ue-prolog) .ue-naschbaer .ue-naschbaer__plus { border-style: solid; border-width: 16px; border-color: transparent; border-image: url('/images/lernmission-1x1/spiel/ui/pergament-gross.webp') 32 fill / 16px / 0 stretch; background: none; box-shadow: none; border-radius: 0; padding: 6px 10px; image-rendering: pixelated; filter: drop-shadow(0 4px 0 rgba(0, 0, 0, .35)); color: #1f2a4d; }
.ue-app .ue-karte:not(.ue-prolog) .ue-fuenf span, .ue-app .ue-karte:not(.ue-prolog) .ue-skala__wahl, .ue-app .ue-karte:not(.ue-prolog) .ue-auswahl__bild, .ue-app .ue-karte:not(.ue-prolog) .ue-wahl-rechnung, .ue-app .ue-karte:not(.ue-prolog) .ue-aufdecken, .ue-app .ue-karte:not(.ue-prolog) .ue-basteln__feld { border-style: solid; border-width: 13px; border-color: transparent; border-image: url('/images/lernmission-1x1/spiel/ui/pergament-quadrat.webp') 26 fill / 13px / 0 stretch; background: none; box-shadow: none; border-radius: 0; padding: 4px 8px; image-rendering: pixelated; filter: drop-shadow(0 4px 0 rgba(0, 0, 0, .35)); color: #1f2a4d; }
.ue-app .ue-karte:not(.ue-prolog) .ue-skala__wahl[aria-checked='true'], .ue-app .ue-karte:not(.ue-prolog) .ue-auswahl__bild[aria-pressed='true'], .ue-app .ue-karte:not(.ue-prolog) .ue-wahl-rechnung.is-richtig { border-image-source: url('/images/lernmission-1x1/spiel/ui/gelb-quadrat.webp'); }
.ue-app .ue-karte:not(.ue-prolog) .btn-primary { border-style: solid; border-width: 12px; border-color: transparent; border-image: url('/images/lernmission-1x1/spiel/ui/gelb-breit.webp') 24 fill / 12px / 0 stretch; background: none; box-shadow: none; border-radius: 0; padding: 6px 18px; image-rendering: pixelated; filter: drop-shadow(0 4px 0 rgba(0, 0, 0, .35)); color: #1b1b3a; }
.ue-app .ue-karte:not(.ue-prolog) .btn-outline, .ue-app .ue-karte:not(.ue-prolog) .ue-kopf__pause, .ue-app .ue-karte:not(.ue-prolog) .ue-farm-knopf { border-style: solid; border-width: 13px; border-color: transparent; border-image: url('/images/lernmission-1x1/spiel/ui/blau-leiste.webp') 26 fill / 13px / 0 stretch; background: none; box-shadow: none; border-radius: 0; padding: 4px 14px; image-rendering: pixelated; filter: drop-shadow(0 4px 0 rgba(0, 0, 0, .35)); color: #fff; }
.ue-app .ue-karte:not(.ue-prolog) .btn-primary:hover, .ue-app .ue-karte:not(.ue-prolog) .btn-outline:hover { filter: drop-shadow(0 4px 0 rgba(0, 0, 0, .35)) brightness(1.08); transform: none; }
.ue-app .ue-karte:not(.ue-prolog) .btn:active { transform: translateY(2px); filter: drop-shadow(0 2px 0 rgba(0, 0, 0, .35)); }
.ue-app .ue-karte:not(.ue-prolog) .btn, .ue-app .ue-karte:not(.ue-prolog) .ue-kopf__pause, .ue-app .ue-karte:not(.ue-prolog) .ue-farm-knopf, .ue-app .ue-karte:not(.ue-prolog) .ue-kopf__eis, .ue-app .ue-karte:not(.ue-prolog) h3, .ue-app .ue-karte:not(.ue-prolog) .ue-gruppen { font-family: 'Press Start 2P', ui-monospace, monospace; font-weight: 700; font-variant-ligatures: none; font-feature-settings: 'liga' 0, 'clig' 0; letter-spacing: .02em; }
.ue-app .ue-karte:not(.ue-prolog) .btn { font-size: 1.1rem; }
.ue-optionen .ue-optionen__kasten { border-style: solid; border-width: 17px; border-color: transparent; border-image: url('/images/lernmission-1x1/spiel/ui/brett-gross.webp') 34 fill / 17px / 0 stretch; background: none; box-shadow: none; border-radius: 0; padding: 0 10px 12px; image-rendering: pixelated; filter: drop-shadow(0 4px 0 rgba(0, 0, 0, .35)); filter: drop-shadow(0 12px 30px rgba(0, 0, 0, .55)); }
.ue-optionen .ue-optionen__titel { margin: 0 -10px 10px; padding: 10px 16px; }
.ue-optionen .ue-optionen__teil { border-style: solid; border-width: 16px; border-color: transparent; border-image: url('/images/lernmission-1x1/spiel/ui/pergament-gross.webp') 32 fill / 16px / 0 stretch; background: none; box-shadow: none; border-radius: 0; padding: 8px 10px 10px; image-rendering: pixelated; filter: drop-shadow(0 4px 0 rgba(0, 0, 0, .35)); color: #1f2a4d; margin: 0 0 10px; }
.ue-optionen .btn-primary, .ue-optionen .btn-outline { border-style: solid; border-width: 12px; border-color: transparent; border-image: url('/images/lernmission-1x1/spiel/ui/gelb-breit.webp') 24 fill / 12px / 0 stretch; background: none; box-shadow: none; border-radius: 0; padding: 6px 18px; image-rendering: pixelated; filter: drop-shadow(0 4px 0 rgba(0, 0, 0, .35)); color: #1b1b3a; font-family: 'Press Start 2P', ui-monospace, monospace; font-weight: 700; font-size: 1.1rem; }

.ue-app [style], .ue-titel__punkt, .ue-karte__titel, .ue-optionen__titel { font-synthesis: none; }

.ue-app .ue-karte:not(.ue-prolog) .ue-karte__nr { font-size: 1.05rem; letter-spacing: .04em; }
.ue-app .ue-karte:not(.ue-prolog) .ue-fuenf span, .ue-app .ue-karte:not(.ue-prolog) .ue-wahl-rechnung { font-size: 1.35rem; }
.ue-app .ue-karte:not(.ue-prolog) .ue-rechnung { font-size: clamp(1.4rem, 4.4vw, 2.1rem); }
.ue-app .ue-karte:not(.ue-prolog) .ue-skala__wahl b, .ue-app .ue-karte:not(.ue-prolog) .ue-memory__zahl { font-size: 1.8rem; }
.ue-app .ue-karte:not(.ue-prolog) .ue-karte__titel { font-size: clamp(1.9rem, 5vw, 2.8rem); }
.ue-prolog__mathe { font-size: clamp(1.1rem, 4.4vw, 1.7rem); }
.ue-titel__punkt { font-size: 4.2cqw; }

.ue-app .ue-karte:not(.ue-prolog) .ue-auswahl__bild, .ue-app .ue-karte:not(.ue-prolog) .ue-basteln__feld { box-sizing: border-box; width: 112px; height: 112px; padding: 0; display: inline-grid; place-items: center; overflow: visible; }
.ue-app .ue-karte:not(.ue-prolog) .ue-auswahl__bild .ue-bild { font-size: 2.9rem; }
.ue-app .ue-karte:not(.ue-prolog) .ue-basteln__feld .ue-bild { font-size: 2.6rem; }
.ue-app .ue-karte:not(.ue-prolog) .ue-auswahl__bild--breit { width: auto; min-width: 124px; padding: 0 8px; display: inline-flex; }
.ue-app .ue-karte:not(.ue-prolog) .ue-auswahl__bild--breit .ue-bild { font-size: 2.2rem; }
@media (max-width: 560px) { .ue-app .ue-karte:not(.ue-prolog) .ue-auswahl__bild, .ue-app .ue-karte:not(.ue-prolog) .ue-basteln__feld { width: 88px; height: 88px; } .ue-app .ue-karte:not(.ue-prolog) .ue-auswahl__bild .ue-bild { font-size: 2.2rem; } }

.ue-app .ue-karte:not(.ue-prolog) .ue-tafelbrett { position: relative; z-index: 1; max-width: 680px; margin: 10px auto 14px; padding: 14px 22px 18px; text-align: center; color: #1f2a4d;
  border-style: solid; border-width: 18px; border-color: transparent; border-image: url('/images/lernmission-1x1/spiel/ui/pergament-gross.webp') 32 fill / 18px / 0 stretch;
  image-rendering: pixelated; filter: drop-shadow(0 8px 0 rgba(0, 0, 0, .35)); }
.ue-app .ue-karte:not(.ue-prolog) .ue-tafelbrett .ue-karte__titel { color: #1f2a4d; text-shadow: none; margin: 0 0 10px; }

.ue-app .ue-karte:not(.ue-prolog) .ue-tafelbrett > p, .ue-app .ue-karte:not(.ue-prolog) .ue-tafelbrett .ue-frage-bild, .ue-app .ue-karte:not(.ue-prolog) .ue-tafelbrett .ue-geschichte, .ue-app .ue-karte:not(.ue-prolog) .ue-tafelbrett .ue-memory, .ue-app .ue-karte:not(.ue-prolog) .ue-tafelbrett .ue-bruecke, .ue-app .ue-karte:not(.ue-prolog) .ue-tafelbrett .ue-herleitung__zeile, .ue-app .ue-karte:not(.ue-prolog) .ue-tafelbrett .ue-form-satz, .ue-app .ue-karte:not(.ue-prolog) .ue-tafelbrett .ue-pyramide,
.ue-app .ue-karte:not(.ue-prolog) .ue-tafelbrett .ue-kohle__zeile, .ue-app .ue-karte:not(.ue-prolog) .ue-tafelbrett .ue-spiel, .ue-app .ue-karte:not(.ue-prolog) .ue-tafelbrett .ue-turmrechnung, .ue-app .ue-karte:not(.ue-prolog) .ue-tafelbrett .ue-rueckmeldung, .ue-app .ue-karte:not(.ue-prolog) .ue-tafelbrett .ue-code, .ue-app .ue-karte:not(.ue-prolog) .ue-tafelbrett .ue-wette, .ue-app .ue-karte:not(.ue-prolog) .ue-tafelbrett .ue-naschbaer p, .ue-app .ue-karte:not(.ue-prolog) .ue-tafelbrett .ue-tabelle,
.ue-app .ue-karte:not(.ue-prolog) .ue-tafelbrett .ue-ueberblick, .ue-app .ue-karte:not(.ue-prolog) .ue-tafelbrett .ue-rezept, .ue-app .ue-karte:not(.ue-prolog) .ue-tafelbrett .ue-kohle > p {
  border: 0; border-image: none; background: none; box-shadow: none; filter: none; padding: 4px 0; margin: 6px 0; color: #1f2a4d !important; }
.ue-app .ue-karte:not(.ue-prolog) .ue-tafelbrett > p b, .ue-app .ue-karte:not(.ue-prolog) .ue-tafelbrett p b { color: #1f2a4d; }
.ue-app .ue-karte:not(.ue-prolog) .ue-tafelbrett .ue-herleitung__zeile--ziel { color: #1b6b2f !important; }
.ue-app .ue-karte:not(.ue-prolog) .ue-tafelbrett .ue-rueckmeldung.is-richtig { color: #1b8a3a !important; }
.ue-app .ue-karte:not(.ue-prolog) .ue-tafelbrett .ue-rueckmeldung.is-falsch { color: #c0392b !important; }
.ue-app .ue-karte:not(.ue-prolog) .ue-tafelbrett .ue-naschbaer .ue-naschbaer__plus { border: 0; border-image: none; background: none; filter: none; color: #1f2a4d; }
.ue-app .ue-karte:not(.ue-prolog) .ue-tafelbrett h3 { color: #1f2a4d; text-shadow: none; }

.ue-app .ue-karte:not(.ue-prolog) > .ue-karte__nr, .ue-app .ue-karte:not(.ue-prolog) > .ue-gruppen, .ue-app .ue-karte:not(.ue-prolog) > .ue-punkte { border: 0; border-image: none; background: none; box-shadow: none; filter: drop-shadow(2px 2px 0 #0a0f2e); padding: 0; }
.ue-app .ue-karte:not(.ue-prolog) > .ue-karte__nr { color: #ffd54a; }
.ue-app .ue-karte:not(.ue-prolog) > .ue-gruppen { color: #fff; }
.ue-app .ue-karte:not(.ue-prolog):has(.ue-tafelbrett) > .ue-knoepfe { position: relative; z-index: 1; }

.ue-app .ue-karte:not(.ue-prolog) .ue-karte__titel { font-size: clamp(1.2rem, 3.4vw, 1.9rem); line-height: 1.35; }
.ue-app .ue-karte:not(.ue-prolog) .ue-karte__nr { font-size: .62rem; }
.ue-app .ue-karte:not(.ue-prolog) .btn, .ue-optionen .btn, .ue-kopf__pause, .ue-farm-knopf, .ue-kopf__eis { font-size: .78rem; line-height: 1.5; }
.ue-app .ue-karte:not(.ue-prolog) .ue-fuenf span, .ue-app .ue-karte:not(.ue-prolog) .ue-wahl-rechnung { font-size: .85rem; }
.ue-app .ue-karte:not(.ue-prolog) .ue-rechnung { font-size: clamp(.95rem, 3vw, 1.4rem); }
.ue-app .ue-karte:not(.ue-prolog) .ue-skala__wahl b, .ue-app .ue-karte:not(.ue-prolog) .ue-memory__zahl { font-size: 1.2rem; }
.ue-app .ue-karte:not(.ue-prolog) h3, .ue-optionen .ue-optionen__teil h4 { font-size: .9rem; line-height: 1.5; }
.ue-optionen .ue-optionen__titel { font-size: 1.3rem; }
.ue-prolog__mathe { font-size: clamp(.8rem, 3.2vw, 1.2rem); }
.ue-titel__punkt { font-size: 2.6cqw; }
.ue-app .ue-karte:not(.ue-prolog) .ue-gruppen { font-size: .6rem; }

.ue-app .ue-karte:not(.ue-prolog) .ue-auswahl__bild, .ue-app .ue-karte:not(.ue-prolog) .ue-basteln__feld, .ue-app .ue-karte:not(.ue-prolog) .ue-skala__wahl, .ue-app .ue-karte:not(.ue-prolog) .ue-wahl-rechnung, .ue-app .ue-karte:not(.ue-prolog) .ue-aufdecken {
  border-image-source: url('/images/lernmission-1x1/spiel/ui/holz-quadrat.webp'); color: #fff; }
.ue-app .ue-karte:not(.ue-prolog) .ue-skala__wahl small { color: #ffe7a0; }
.ue-app .ue-karte:not(.ue-prolog) .ue-wahl-rechnung { border-image-source: url('/images/lernmission-1x1/spiel/ui/holzleiste.webp'); }

.ue-app .ue-karte:not(.ue-prolog) .ue-memory__zahl { font-size: clamp(2.6rem, 8vw, 3.6rem); line-height: 1.1; color: #5b3fd6; text-shadow: 3px 3px 0 #c7bbff; }
.ue-app .ue-karte:not(.ue-prolog) .ue-memory .ue-bild { font-size: 5rem; }

.ue-app .ue-karte:not(.ue-prolog) .ue-tafelbrett, .ue-app .ue-karte:not(.ue-prolog) .ue-tafelbrett *:not(.ue-bild) { font-family: 'Nunito', sans-serif !important; font-size-adjust: none; letter-spacing: normal; }
.ue-app .ue-karte:not(.ue-prolog) .ue-tafelbrett .ue-karte__titel { font-family: var(--font-display), 'Nunito', sans-serif !important; font-weight: 700; font-size: clamp(1.6rem, 4.2vw, 2.3rem); line-height: 1.2; }
.ue-app .ue-karte:not(.ue-prolog) .ue-tafelbrett .ue-rechnung, .ue-app .ue-karte:not(.ue-prolog) .ue-tafelbrett .ue-rechnung b, .ue-app .ue-karte:not(.ue-prolog) .ue-tafelbrett .ue-fuenf span, .ue-app .ue-karte:not(.ue-prolog) .ue-tafelbrett .ue-wahl-rechnung, .ue-app .ue-karte:not(.ue-prolog) .ue-tafelbrett .ue-memory__zahl, .ue-app .ue-karte:not(.ue-prolog) .ue-tafelbrett .ue-skala__wahl b, .ue-app .ue-karte:not(.ue-prolog) .ue-tafelbrett .ue-frage__feld { font-weight: 900; }
.ue-app .ue-karte:not(.ue-prolog) .ue-tafelbrett .ue-rechnung { font-size: clamp(1.3rem, 4vw, 1.9rem); }
.ue-app .ue-karte:not(.ue-prolog) .ue-tafelbrett .ue-fuenf span, .ue-app .ue-karte:not(.ue-prolog) .ue-tafelbrett .ue-wahl-rechnung { font-size: 1.15rem; }
.ue-app .ue-karte:not(.ue-prolog) .ue-tafelbrett .ue-memory__zahl { font-size: clamp(3rem, 9vw, 4rem); }
.ue-app .ue-karte:not(.ue-prolog) .ue-tafelbrett .ue-skala__wahl b { font-size: 1.6rem; }
.ue-app .ue-karte:not(.ue-prolog) .ue-tafelbrett .ue-frage__feld { font-size: 1.6rem; }

.ue-app .ue-karte:not(.ue-prolog) .ue-auswahl__bild.is-treffer { border-image-source: url('/images/lernmission-1x1/spiel/ui/gelb-quadrat.webp'); }
.ue-auswahl__bild.is-treffer { background: var(--yellow); }

.ue-app .ue-karte:not(.ue-prolog) .ue-tafel__plus, .ue-app .ue-karte:not(.ue-prolog) .ue-rechnung i, .ue-app .ue-karte:not(.ue-prolog) .ue-pyramide i {
  font-style: normal; font-family: 'Nunito', sans-serif !important; font-weight: 900; color: #1f2a4d; }
.ue-app .ue-karte:not(.ue-prolog) .ue-tafel__plus { font-size: 2rem; margin: 0 4px; }
.ue-app .ue-karte:not(.ue-prolog) .ue-auswahl__bild .ue-tafel__plus { color: #fff; text-shadow: 2px 2px 0 #2e1a0a, -1px -1px 0 #2e1a0a, 1px -1px 0 #2e1a0a, -1px 1px 0 #2e1a0a; }

.ue-naschbaer__sprite { animation-duration: 4.8s; }

.ue-app .ue-karte:not(.ue-prolog) .ue-tafelbrett .ue-frage-bild { line-height: 1.25; padding: 8px 0 14px; margin-bottom: 8px; }
.ue-app .ue-karte:not(.ue-prolog) .ue-tafelbrett .ue-frage-bild .ue-bild { vertical-align: middle; line-height: 1; }

.ue-optionen .ue-menue-liste { display: flex; flex-direction: column; gap: 10px; padding: 6px 4px 12px; }
.ue-optionen .ue-menue-liste[hidden], .ue-optionen .ue-optionen__teil[hidden] { display: none; }
.ue-optionen .ue-menue-liste .btn { width: 100%; justify-content: flex-start; text-align: left; font-size: .95rem; padding: 12px 18px; }
.ue-optionen .ue-optionen__kasten { width: min(460px, 100%); }
.ue-optionen #ue-menue-zurueck { flex: 0 0 auto; }
.ue-optionen #ue-optionen-zu { width: auto; flex: 1 1 auto; }
.ue-optionen .ue-musik__titel small { display: none; }

.ue-titel__punkt { white-space: nowrap; }

.ue-titel { width: min(100%, calc((100svh - 110px) * 4 / 3)); margin: 0 auto; }

@media (orientation: portrait) and (max-width: 760px) {
  .ue-titel { aspect-ratio: 3 / 4; width: 100%; background-position: 30% center; }
  .ue-titel__logo { width: 94%; top: 2%; }
  .ue-titel__tafel-bild { width: 40%; left: 3%; top: 22%; }
  .ue-titel__turm { width: 32%; bottom: 31%; }
  .ue-titel__menue { width: 78%; bottom: 3%; padding: 2cqw; gap: .8cqw; }
  .ue-titel__punkt { font-size: 5cqw; padding: 1.2cqw 2cqw 1.2cqw 7cqw; }
  .ue-titel__punkt.is-gewaehlt::before { left: 2.4cqw; }
}

.ue-buehne.is-vollbild { padding: 8px; background: #050a24; }
.ue-buehne.is-vollbild .ue-app, .ue-buehne.is-vollbild .ue-buehne__leiste { max-width: none; }
.ue-buehne.is-vollbild .ue-buehne__leiste { position: absolute; right: 10px; top: 10px; z-index: 5; margin: 0; }
.ue-buehne.is-vollbild .ue-leiste { display: none; }
.ue-buehne.is-vollbild .ue-titel { width: min(100%, calc((100svh - 16px) * 4 / 3)); }
.ue-buehne.is-vollbild .ue-karte { min-height: calc(100svh - 16px); max-width: 1100px; margin: 0 auto; }
@media (orientation: portrait) and (max-width: 760px) {
  .ue-buehne.is-vollbild .ue-titel { width: min(100%, calc((100svh - 16px) * 3 / 4)); }
}

@media (orientation: landscape) and (max-height: 520px) {
  .ue-app .ue-karte:not(.ue-prolog) { padding: 10px 14px 70px; }
  .ue-app .ue-karte:not(.ue-prolog) .ue-tafelbrett { margin: 6px auto 8px; padding: 6px 14px 10px; }
  .ue-app .ue-karte:not(.ue-prolog) .ue-tafelbrett .ue-karte__titel { font-size: 1.3rem; margin-bottom: 4px; }
  .ue-app .ue-karte:not(.ue-prolog)::after { width: 46px; }
}

@media not ((orientation: portrait) and (max-width: 760px)) { .ue-titel__menue { width: 40%; } .ue-titel__punkt { font-size: 2.3cqw; } }

.ue-app .ue-karte:not(.ue-prolog) .ue-tafelbrett .ue-geschichte:has(.ue-kleeblatt) { position: relative; width: fit-content; margin-left: auto; margin-right: auto; }
.ue-app .ue-karte:not(.ue-prolog) .ue-tafelbrett .ue-kleeblatt { top: -14px; right: -30px; }

.ue-app .ue-karte:not(.ue-prolog) .ue-auswahl__bild, .ue-app .ue-karte:not(.ue-prolog) .ue-basteln__feld, .ue-app .ue-karte:not(.ue-prolog) .ue-skala__wahl,
.ue-app .ue-karte:not(.ue-prolog) .ue-wahl-rechnung, .ue-app .ue-karte:not(.ue-prolog) .ue-aufdecken { color: #fff !important; }
.ue-app .ue-karte:not(.ue-prolog) .ue-auswahl__bild *:not(.ue-bild), .ue-app .ue-karte:not(.ue-prolog) .ue-basteln__feld *:not(.ue-bild), .ue-app .ue-karte:not(.ue-prolog) .ue-skala__wahl *:not(.ue-bild),
.ue-app .ue-karte:not(.ue-prolog) .ue-wahl-rechnung *:not(.ue-bild), .ue-app .ue-karte:not(.ue-prolog) .ue-aufdecken *:not(.ue-bild) { color: #fff !important; text-shadow: 2px 2px 0 #2e1a0a; }
.ue-app .ue-karte:not(.ue-prolog) .ue-skala__wahl small { color: #ffe7a0 !important; }

.ue-app .ue-karte:not(.ue-prolog) .ue-auswahl__bild.is-treffer, .ue-app .ue-karte:not(.ue-prolog) .ue-auswahl__bild.is-treffer *,
.ue-app .ue-karte:not(.ue-prolog) .ue-skala__wahl[aria-checked='true'], .ue-app .ue-karte:not(.ue-prolog) .ue-skala__wahl[aria-checked='true'] *,
.ue-app .ue-karte:not(.ue-prolog) .ue-wahl-rechnung.is-richtig, .ue-app .ue-karte:not(.ue-prolog) .ue-auswahl__bild[aria-pressed='true'] * { color: #1f2a4d !important; text-shadow: none; }

.ue-app .ue-karte:not(.ue-prolog) > .ue-karte__nr { margin-right: 18px; }
.ue-app .ue-karte:not(.ue-prolog) > .ue-gruppen { margin-left: 0; gap: 6px; }
.ue-app .ue-karte:not(.ue-prolog) > .ue-punkte { margin-left: 14px; }

.ue-app .ue-karte:not(.ue-prolog) .ue-farm { max-width: 520px; padding: 16px 18px; background: url('/images/lernmission-1x1/spiel/farm/gras-blumen.webp') 0 0 / 96px, url('/images/lernmission-1x1/spiel/farm/gras.webp') 0 0 / 64px; image-rendering: pixelated; }
.ue-app .ue-karte:not(.ue-prolog) .ue-farm__baeume { gap: 4px; }
.ue-app .ue-karte:not(.ue-prolog) .ue-farm__baum { width: 54px; height: 70px; padding: 0; background: url('/images/lernmission-1x1/spiel/farm/baum.webp') center bottom / contain no-repeat; filter: drop-shadow(0 4px 0 rgba(0, 0, 0, .25)); }
.ue-app .ue-karte:not(.ue-prolog) .ue-farm__baum > span { visibility: hidden; }
.ue-app .ue-karte:not(.ue-prolog) .ue-farm__gehege { padding: 14px 10px 26px; gap: 8px; border: 0; border-radius: 6px; background: url('/images/lernmission-1x1/spiel/farm/zaun.webp') center bottom / 70% auto no-repeat, rgba(122, 76, 32, .25); box-shadow: inset 0 0 0 4px #7a4a24; }
.ue-app .ue-karte:not(.ue-prolog) .ue-farm__feld { width: 74px; height: 74px; border: 0; border-radius: 0; background: url('/images/lernmission-1x1/spiel/farm/beet.webp') center / 100% 100% no-repeat; }
.ue-app .ue-karte:not(.ue-prolog) .ue-farm__feld.is-satt { background: url('/images/lernmission-1x1/spiel/farm/beet.webp') center / 100% 100% no-repeat; box-shadow: 0 0 0 3px #3fbf3f; }
.ue-app .ue-karte:not(.ue-prolog) .ue-farm__feld.is-beet { background: url('/images/lernmission-1x1/spiel/farm/beet.webp') center / 100% 100% no-repeat; }
.ue-farm__sau { display: block; width: 58px; aspect-ratio: 1; background: url('/images/lernmission-1x1/spiel/schwein-sprites.webp') 66.667% 50% / 400% 300% no-repeat; image-rendering: pixelated; }
.ue-farm__feld.is-tier:hover .ue-farm__sau, .ue-farm__feld.is-schnappt .ue-farm__sau { animation: ue-sau-laufen .5s steps(4) infinite; background-position-y: 0%; }
.ue-app .ue-karte:not(.ue-prolog) .ue-farm-flaeche { column-gap: 18px; }
.ue-app .ue-karte:not(.ue-prolog) .ue-region { border-style: solid; border-width: 14px; border-color: transparent; border-image: url('/images/lernmission-1x1/spiel/ui/pergament-quadrat.webp') 26 fill / 14px / 0 stretch; background: none; box-shadow: none; padding: 6px 10px; filter: drop-shadow(0 4px 0 rgba(0, 0, 0, .35)); }
.ue-app .ue-karte:not(.ue-prolog) .ue-region__name, .ue-app .ue-karte:not(.ue-prolog) .ue-region__ab { color: #1f2a4d; }

.ue-app .ue-karte:not(.ue-prolog) .ue-gebirge { max-width: 760px; height: auto; aspect-ratio: 16 / 9; background: url('/images/lernmission-1x1/spiel/farm/gebirge.webp') center / cover no-repeat; image-rendering: pixelated; }
.ue-app .ue-karte:not(.ue-prolog) .ue-gebirge__berg, .ue-app .ue-karte:not(.ue-prolog) .ue-gebirge__tropfen, .ue-app .ue-karte:not(.ue-prolog) .ue-gebirge__see { display: none; }
.ue-app .ue-karte:not(.ue-prolog) .ue-gebirge__wasserfall { left: 66% !important; top: 30% !important; bottom: auto !important; width: 12%; height: 30%; background: none; border: 0; }
.ue-app .ue-karte:not(.ue-prolog) .ue-gebirge__fels { width: 13%; aspect-ratio: 160 / 125; padding: 0; border: 0; background: url('/images/lernmission-1x1/spiel/farm/fels.webp') center bottom / contain no-repeat; filter: drop-shadow(0 4px 0 rgba(0, 0, 0, .3)); }
.ue-app .ue-karte:not(.ue-prolog) .ue-gebirge__fels > span { visibility: hidden; }
.ue-app .ue-karte:not(.ue-prolog) .ue-gebirge__fels:not(.is-zu)::before { content: ""; position: absolute; left: 30%; top: 8%; width: 40%; height: 40%; background: radial-gradient(circle, rgba(255, 240, 150, .85) 0%, rgba(255, 240, 150, 0) 70%); animation: ue-funkeln 1.6s ease-in-out infinite; pointer-events: none; }
.ue-app .ue-karte:not(.ue-prolog) .ue-gebirge__baum { width: 7%; height: auto; aspect-ratio: 160 / 206; }
.ue-app .ue-karte:not(.ue-prolog) .ue-gebirge__kiste { display: flex; flex-wrap: wrap; justify-content: center; gap: 10px; }

.ue-app .ue-karte:not(.ue-prolog) p.ue-rueckmeldung:empty, .ue-app .ue-karte:not(.ue-prolog) #ue-farm-platz > p:empty { display: none; }

.ue-app .ue-karte:not(.ue-prolog) .ue-farm__baum { width: 44px; height: 58px; }
.ue-app .ue-karte:not(.ue-prolog) .ue-farm__baeume:not(.ue-farm__baeume--seite) { justify-content: space-evenly; }

.ue-prolog__sprung { width: 64px; height: 64px; border: 3px solid #e8b923; border-radius: 50%; background: #1b2a6b; color: #fff; font-size: 1.6rem; cursor: pointer; touch-action: none; user-select: none; box-shadow: 0 4px 0 #0d1540; }
.ue-prolog__sprung:active { transform: translateY(2px); box-shadow: 0 2px 0 #0d1540; }
.ue-prolog__steuer { align-items: center; }
.ue-prolog__schwein .ue-sau { transition: none; }
.ue-prolog__schwein.is-springt .ue-sau { animation: ue-sau-sprung .6s cubic-bezier(.3, .7, .4, 1) both; }
.ue-prolog__schwein.is-springt.is-laeuft .ue-sau { animation: ue-sau-sprung .6s cubic-bezier(.3, .7, .4, 1) both, ue-sau-laufen .5s steps(4) infinite; }
@keyframes ue-sau-sprung { 0% { translate: 0 0; } 45% { translate: 0 -70px; } 100% { translate: 0 0; } }

.ue-app .ue-karte:not(.ue-prolog) .ue-gebirge__fels { width: 14%; height: 18%; aspect-ratio: auto; margin: 0; transform: translate(-50%, 50%); background: none; filter: none; border-radius: 40%; }
.ue-app .ue-karte:not(.ue-prolog) .ue-gebirge__fels:hover, .ue-app .ue-karte:not(.ue-prolog) .ue-gebirge__fels:focus-visible { box-shadow: 0 0 0 3px rgba(255, 235, 59, .8); outline: none; }
.ue-app .ue-karte:not(.ue-prolog) .ue-gebirge__fels.is-halten { animation: ue-fels-wackeln .18s linear infinite; }
@keyframes ue-fels-wackeln { 0%, 100% { transform: translate(-50%, 50%); } 50% { transform: translate(-50%, 50%) rotate(-4deg); } }

.ue-titel__turm { width: 26%; bottom: 26%; }
.ue-titel__sau { width: 52%; }
.ue-titel__tafel-bild { width: 20%; left: 5%; top: 34%; }
@media (orientation: portrait) and (max-width: 760px) { .ue-titel__turm { width: 40%; bottom: 29%; } .ue-titel__tafel-bild { width: 34%; } }

.ue-farm__feld.is-tier:not(:hover):not(.is-schnappt) .ue-farm__sau { animation: ue-sau-schnueffeln 6s steps(1) infinite; }
.ue-farm__feld.is-tier:nth-child(2n):not(:hover):not(.is-schnappt) .ue-farm__sau { animation-delay: -2.7s; }
@keyframes ue-sau-schnueffeln {
  0%, 38% { background-position: 66.667% 50%; }
  40%, 46% { background-position: 33.333% 50%; }
  48%, 50% { background-position: 66.667% 50%; }
  52%, 70% { background-position: 33.333% 50%; transform: translateY(1px); }
  72%, 100% { background-position: 66.667% 50%; transform: none; }
}
@media (prefers-reduced-motion: reduce) { .ue-farm__feld.is-tier .ue-farm__sau { animation: none !important; } }

.ue-app .ue-karte:not(.ue-prolog) .ue-farm__gefressen { bottom: -10px; left: 50%; right: auto; transform: translateX(-50%); padding: 1px 5px; border-radius: 999px;
  background: #fff8e1; box-shadow: 0 0 0 2px #7a4a24, 0 2px 0 rgba(0, 0, 0, .35); font-size: 1rem; letter-spacing: 0; white-space: nowrap; z-index: 2; }
.ue-app .ue-karte:not(.ue-prolog) .ue-farm__gefressen:empty { display: none; }

@media not ((orientation: portrait) and (max-width: 760px)) {
  .ue-titel__menue { width: 36%; bottom: 2%; padding: .6cqw 1cqw; gap: 0; }
  .ue-titel__punkt { font-size: 2cqw; padding: .55cqw 1cqw .55cqw 3.2cqw; line-height: 1.3; }
  .ue-titel__turm { width: 25%; bottom: 22%; }
  .ue-titel__sau { width: 46%; margin-bottom: -3%; }
}
@media not ((orientation: portrait) and (max-width: 760px)) {
  .ue-titel__menue { width: 44%; }
  .ue-titel__turm { width: 23%; bottom: 27%; }
}

.ue-app .ue-karte:not(.ue-prolog) .ue-gebirge__wasserfall { left: 71% !important; top: 41% !important; width: 10%; height: 27%; padding: 0; margin: 0; border-radius: 40%; cursor: pointer; }
.ue-app .ue-karte:not(.ue-prolog) .ue-gebirge__wasserfall:hover, .ue-app .ue-karte:not(.ue-prolog) .ue-gebirge__wasserfall:focus-visible { box-shadow: 0 0 0 3px rgba(255, 235, 59, .8); outline: none; }

@media (orientation: landscape) and (max-height: 520px) {
  .ue-app .ue-karte:not(.ue-prolog) { display: flex; flex-direction: column; min-height: calc(100svh - 16px); max-height: calc(100svh - 16px); padding: 6px 10px 8px; box-sizing: border-box; }
  .ue-app .ue-karte:not(.ue-prolog)::after { width: 40px; bottom: 4px; }
  .ue-app .ue-karte:not(.ue-prolog) .ue-kopf { flex: none; }
  .ue-app .ue-karte:not(.ue-prolog) .ue-kopf__eis, .ue-app .ue-karte:not(.ue-prolog) .ue-kopf__pause, .ue-app .ue-karte:not(.ue-prolog) .ue-farm-knopf { font-size: .62rem; padding: 2px 8px; }
  .ue-app .ue-karte:not(.ue-prolog) .ue-farm-knopf__tipp { display: none; }
  .ue-app .ue-karte:not(.ue-prolog) > .ue-karte__nr, .ue-app .ue-karte:not(.ue-prolog) > .ue-gruppen, .ue-app .ue-karte:not(.ue-prolog) > .ue-punkte { flex: none; margin: 2px 8px 2px 0; font-size: .55rem; }
  .ue-app .ue-karte:not(.ue-prolog) > .ue-gruppen .ue-gruppen__nr { width: 18px; height: 18px; font-size: .55rem; }
  .ue-app .ue-karte:not(.ue-prolog) > .ue-karte__titel { font-size: 1.1rem; margin: 2px 0; flex: none; }
  .ue-app .ue-karte:not(.ue-prolog) > p { flex: none; margin: 2px 0; padding: 3px 10px; font-size: .78rem; }

  .ue-app .ue-karte:not(.ue-prolog) .ue-tafelbrett { flex: 1 1 auto; min-height: 0; overflow: auto; margin: 4px auto; width: 100%; max-width: none; box-sizing: border-box; padding: 2px 12px 6px; border-width: 12px; }
  .ue-app .ue-karte:not(.ue-prolog) .ue-tafelbrett .ue-karte__titel { font-size: 1.05rem; margin: 0 0 2px; }
  .ue-app .ue-karte:not(.ue-prolog) .ue-tafelbrett > p { font-size: .8rem; margin: 2px 0; padding: 0; }
  .ue-app .ue-karte:not(.ue-prolog) .ue-tafelbrett .ue-memory { margin: 0; gap: 0; }
  .ue-app .ue-karte:not(.ue-prolog) .ue-tafelbrett .ue-memory .ue-bild { font-size: 2.6rem; }
  .ue-app .ue-karte:not(.ue-prolog) .ue-tafelbrett .ue-memory__zahl { font-size: 1.8rem; }
  .ue-app .ue-karte:not(.ue-prolog) .ue-tafelbrett .ue-rechnung { font-size: 1.1rem; }
  .ue-app .ue-karte:not(.ue-prolog) .ue-tafelbrett .ue-rechnung .ue-bild { font-size: 1.8rem; }
  .ue-app .ue-karte:not(.ue-prolog) .ue-tafelbrett .ue-tafel { transform: scale(.72); transform-origin: top center; margin-bottom: -40px; }
  .ue-app .ue-karte:not(.ue-prolog) .ue-tafelbrett .ue-frage-bild { padding: 2px 0 4px; margin: 0; }
  .ue-app .ue-karte:not(.ue-prolog) .ue-tafelbrett .ue-frage { margin: 4px 0 0; }
  .ue-app .ue-karte:not(.ue-prolog) .ue-tafelbrett .ue-frage__feld { height: 40px; width: 100px; font-size: 1.2rem; }
  .ue-app .ue-karte:not(.ue-prolog) .ue-tafelbrett .ue-rueckmeldung { min-height: 0; margin: 2px 0; font-size: .8rem; }
  .ue-app .ue-karte:not(.ue-prolog) .ue-tafelbrett .ue-fuenf { flex-wrap: nowrap; justify-content: center; gap: 6px; margin: 4px 0; }
  .ue-app .ue-karte:not(.ue-prolog) .ue-tafelbrett .ue-fuenf span { font-size: .8rem; padding: 2px 6px; border-width: 10px; }
  .ue-app .ue-karte:not(.ue-prolog) .ue-tafelbrett .ue-skala { flex-wrap: nowrap; gap: 6px; }
  .ue-app .ue-karte:not(.ue-prolog) .ue-tafelbrett .ue-skala__wahl { min-width: 0; flex: 1 1 0; padding: 2px; border-width: 10px; }
  .ue-app .ue-karte:not(.ue-prolog) .ue-tafelbrett .ue-skala__emoji { font-size: 1.3rem; }
  .ue-app .ue-karte:not(.ue-prolog) .ue-tafelbrett .ue-skala__wahl b { font-size: 1rem; }
  .ue-app .ue-karte:not(.ue-prolog) .ue-tafelbrett .ue-skala__wahl small { display: block; font-size: .6rem; }
  .ue-app .ue-karte:not(.ue-prolog) .ue-tafelbrett .ue-auswahl { gap: 8px; margin: 4px 0; }
  .ue-app .ue-karte:not(.ue-prolog) .ue-auswahl__bild, .ue-app .ue-karte:not(.ue-prolog) .ue-basteln__feld { width: 64px; height: 64px; border-width: 10px; }
  .ue-app .ue-karte:not(.ue-prolog) .ue-auswahl__bild .ue-bild, .ue-app .ue-karte:not(.ue-prolog) .ue-basteln__feld .ue-bild { font-size: 1.7rem; }
  .ue-app .ue-karte:not(.ue-prolog) .ue-turmrechnung { margin: 2px 0; }
  .ue-app .ue-karte:not(.ue-prolog) .ue-naschbaer__sprite { width: 110px; }
  .ue-app .ue-karte:not(.ue-prolog) .ue-punkte { margin: 0 0 2px; }

  .ue-app .ue-karte:not(.ue-prolog) > .ue-knoepfe, .ue-app .ue-karte:not(.ue-prolog) .ue-knoepfe--zurueck { flex: none; margin: 0; padding: 0 0 0 46px; }
  .ue-app .ue-karte:not(.ue-prolog) .btn { font-size: .65rem; padding: 4px 12px; min-height: 0; }

  .ue-app .ue-karte:not(.ue-prolog):has(#ue-farm-platz), .ue-app .ue-karte:not(.ue-prolog):has(.ue-farm-fenster) { max-height: none; }
  .ue-app .ue-karte:not(.ue-prolog) .ue-farm-flaeche { grid-template-columns: auto auto auto auto; grid-template-areas: "links wiese bereich stall" "links wiese bereich kiste"; align-items: center; }
  .ue-app .ue-karte:not(.ue-prolog) .ue-farm { padding: 6px 8px; transform: scale(.62); transform-origin: center; margin: -60px -40px; }
  .ue-app .ue-karte:not(.ue-prolog) .ue-region { min-width: 0; padding: 2px 4px; border-width: 10px; font-size: .7rem; }
  .ue-app .ue-karte:not(.ue-prolog) .ue-gebirge { max-width: none; width: auto; height: calc(100svh - 190px); aspect-ratio: 16 / 9; margin: 4px auto; }
  .ue-app .ue-karte:not(.ue-prolog) .ue-inv__leiste .ue-mc__slot { width: 32px; height: 32px; }
  .ue-app .ue-karte:not(.ue-prolog) .ue-inv, .ue-app .ue-karte:not(.ue-prolog) .ue-werkstatt, .ue-app .ue-karte:not(.ue-prolog) .ue-farm__kiste { padding: 2px 6px; border-width: 10px; font-size: .7rem; }

  .ue-buehne.is-vollbild .ue-buehne__leiste { right: auto; left: 50%; transform: translateX(-50%); top: 6px; }
  .ue-buehne.is-vollbild .ue-vollbild__text { display: none; }
  .ue-buehne.is-vollbild .ue-vollbild { padding: 3px 6px; }
  .ue-buehne.is-vollbild { padding: 4px; }
  .ue-buehne.is-vollbild .ue-karte { min-height: calc(100svh - 8px); max-height: calc(100svh - 8px); }
}
@media (orientation: landscape) and (max-height: 520px) {
  .ue-app .ue-karte:not(.ue-prolog) .ue-karte__titel { font-size: 1.05rem !important; margin: 0 0 2px !important; }
  .ue-app .ue-karte:not(.ue-prolog) #ue-farm-platz > p, .ue-app .ue-karte:not(.ue-prolog) .ue-farm-fenster p:not(.ue-rueckmeldung) { font-size: .72rem; padding: 2px 8px; margin: 2px 0; border-width: 8px; }
  .ue-app .ue-karte:not(.ue-prolog) .ue-farm__hinweis { font-size: .75rem; padding: 4px 8px; margin: 2px 0 4px; }
  .ue-app .ue-karte:not(.ue-prolog) .ue-farm__hinweis-bild { font-size: 1.2rem; }

  .ue-app .ue-karte:not(.ue-prolog) .ue-farm-flaeche { display: flex; flex-wrap: nowrap; align-items: center; justify-content: center; gap: 6px; }
  .ue-app .ue-karte:not(.ue-prolog) .ue-farm { transform: none; margin: 0; padding: 4px; max-width: none; }
  .ue-app .ue-karte:not(.ue-prolog) .ue-farm__baum { width: 22px; height: 28px; }
  .ue-app .ue-karte:not(.ue-prolog) .ue-farm__baeume--seite { gap: 2px; }
  .ue-app .ue-karte:not(.ue-prolog) .ue-farm__mitte { gap: 4px; margin: 2px 0; }
  .ue-app .ue-karte:not(.ue-prolog) .ue-farm__gehege { padding: 4px 4px 12px; gap: 4px; grid-template-columns: repeat(2, 46px) !important; }
  .ue-app .ue-karte:not(.ue-prolog) .ue-farm__feld { width: 46px; height: 46px; }
  .ue-app .ue-karte:not(.ue-prolog) .ue-farm__sau { width: 38px; }
  .ue-app .ue-karte:not(.ue-prolog) .ue-farm__stall, .ue-app .ue-karte:not(.ue-prolog) .ue-farm__kiste { flex-direction: column; margin: 0; }
  .ue-app .ue-karte:not(.ue-prolog) .ue-farm__kiste-knoepfe .ue-werkstatt__oeffnen { font-size: .62rem; padding: 2px 6px; }
  .ue-app .ue-karte:not(.ue-prolog) .ue-inv__leiste { grid-template-columns: repeat(3, auto); }
  .ue-app .ue-karte:not(.ue-prolog) .ue-region { font-size: .62rem; }
  .ue-app .ue-karte:not(.ue-prolog) .ue-region__bild, .ue-app .ue-karte:not(.ue-prolog) .ue-region__schloss { font-size: 1.2rem; }

  .ue-app .ue-karte:not(.ue-prolog) .ue-gebirge { height: calc(100svh - 150px); margin: 2px auto; }
  .ue-app .ue-karte:not(.ue-prolog) .ue-gebirge__kiste { flex-wrap: nowrap; gap: 6px; }

  .ue-app .ue-karte:not(.ue-prolog) .ue-auswahl__bild, .ue-app .ue-karte:not(.ue-prolog) .ue-basteln__feld { width: 50px; height: 50px; border-width: 8px; }
  .ue-app .ue-karte:not(.ue-prolog) .ue-auswahl__bild .ue-bild, .ue-app .ue-karte:not(.ue-prolog) .ue-basteln__feld .ue-bild { font-size: 1.35rem; }
  .ue-app .ue-karte:not(.ue-prolog) .ue-auswahl__bild--breit { min-width: 80px; height: 50px; }
  .ue-app .ue-karte:not(.ue-prolog) .ue-basteln__ziel .ue-bild { font-size: 1.6rem; }
  .ue-app .ue-karte:not(.ue-prolog) .ue-turmrechnung { gap: 4px; }
  .ue-app .ue-karte:not(.ue-prolog) .ue-pyramide { margin: 0; padding: 0; }
  .ue-app .ue-karte:not(.ue-prolog) .ue-pyramide__block { font-size: .8rem; padding: 2px 6px; }
  .ue-app .ue-karte:not(.ue-prolog) .ue-pyramide__block .ue-bild { font-size: 1.1rem; }
  .ue-app .ue-karte:not(.ue-prolog) .ue-pyramide__zeile--teile { margin-top: 8px; }
}
@media (orientation: landscape) and (max-height: 520px) {

  .ue-app .ue-karte:not(.ue-prolog) > .ue-gruppen { position: absolute; top: 40px; right: 12px; margin: 0; z-index: 3; }
  .ue-app .ue-karte:not(.ue-prolog) > .ue-punkte { display: none; }
  .ue-app .ue-karte:not(.ue-prolog) .ue-tafelbrett > .ue-punkte { display: none; }
  .ue-app .ue-karte:not(.ue-prolog) .ue-tafelbrett > p:not(.ue-rueckmeldung) { display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
  .ue-app .ue-karte:not(.ue-prolog) .ue-auswahl__bild, .ue-app .ue-karte:not(.ue-prolog) .ue-basteln__feld { width: 44px; height: 44px; }
  .ue-app .ue-karte:not(.ue-prolog) .ue-basteln__ziel { transform: scale(.8); }
  .ue-app .ue-karte:not(.ue-prolog) .ue-basteln__zeichen { width: 26px; height: 22px; font-size: .8rem; }
  .ue-app .ue-karte:not(.ue-prolog) .ue-pyramide__zeile--teile { margin-top: 4px; }
  .ue-app .ue-karte:not(.ue-prolog) .ue-pyramide { transform: scale(.85); transform-origin: top center; margin-bottom: -10px; }

  .ue-app .ue-karte:not(.ue-prolog) .ue-gebirge { height: calc(100svh - 205px); }
  .ue-app .ue-karte:not(.ue-prolog) #ue-farm-platz .ue-knoepfe, .ue-app .ue-karte:not(.ue-prolog) .ue-farm-fenster .ue-knoepfe { margin: 2px 0 0; }
  .ue-app .ue-karte:not(.ue-prolog) .ue-gebirge__kiste .ue-inv__leiste { grid-template-columns: repeat(6, auto); }
  .ue-app .ue-karte:not(.ue-prolog) .ue-gebirge__kiste .ue-mc__label { display: none; }
}
@media (orientation: landscape) and (max-height: 520px) {
  .ue-app .ue-karte:not(.ue-prolog) .ue-werkstatt__oeffnen { font-size: .62rem !important; padding: 2px 6px !important; min-height: 0; }
  .ue-app .ue-karte:not(.ue-prolog) .ue-farm__kiste-bild { font-size: 1.1rem; }
  .ue-app .ue-karte:not(.ue-prolog) .ue-gebirge { height: calc(100svh - 225px); }
}
@media (orientation: landscape) and (max-height: 520px) {
  .ue-app .ue-karte:not(.ue-prolog) .ue-farm__kiste button, .ue-app .ue-karte:not(.ue-prolog) .ue-gebirge__kiste button:not(.ue-mc__slot) { font-size: .6rem !important; padding: 2px 6px !important; min-height: 0 !important; height: auto !important; width: auto !important; border-width: 2px !important; }
  .ue-app .ue-karte:not(.ue-prolog) .ue-gebirge__kiste { margin-top: 0; }
  .ue-app .ue-karte:not(.ue-prolog) .ue-gebirge__kiste > * { padding: 2px 6px; }
}
@media (orientation: landscape) and (max-height: 520px) {
  .ue-app .ue-karte:not(.ue-prolog) .ue-werkstatt__oeffnen > span[aria-hidden], .ue-app .ue-karte:not(.ue-prolog) .ue-farm__kiste-bild { display: none; }
  .ue-app .ue-karte:not(.ue-prolog) .ue-gebirge__kiste { gap: 4px; }
  .ue-app .ue-karte:not(.ue-prolog) .ue-gebirge__kiste .ue-farm__kiste, .ue-app .ue-karte:not(.ue-prolog) .ue-gebirge__kiste .ue-inv { flex-direction: row; max-width: none; padding: 0 4px; }
  .ue-app .ue-karte:not(.ue-prolog) .ue-gebirge__kiste .ue-farm__kiste-knoepfe { flex-wrap: nowrap; flex-basis: auto; }
  .ue-app .ue-karte:not(.ue-prolog) .ue-gebirge { height: calc(100svh - 215px); }
  .ue-app .ue-karte:not(.ue-prolog) .ue-gebirge ~ .ue-knoepfe .btn { padding: 2px 10px; }
}
@media (orientation: landscape) and (max-height: 520px) { .ue-app .ue-karte:not(.ue-prolog) .ue-gebirge { height: calc(100svh - 250px); min-height: 110px; } }

@media (orientation: landscape) and (min-height: 521px) {
  .ue-app .ue-karte:not(.ue-prolog) { display: flex; flex-direction: column; height: calc(100svh - 96px); max-height: calc(100svh - 96px); box-sizing: border-box; padding-top: 14px; padding-bottom: 14px; overflow: hidden; }
  .ue-buehne.is-vollbild .ue-karte:not(.ue-prolog) { height: calc(100svh - 16px); max-height: calc(100svh - 16px); }
  .ue-app .ue-karte:not(.ue-prolog) > * { flex: none; }
  .ue-app .ue-karte:not(.ue-prolog) > .ue-hand { position: absolute !important; top: 0; left: 0; }
  .ue-app .ue-karte:not(.ue-prolog) > .ue-karte__titel { margin: 2px 0 6px; font-size: clamp(1.4rem, 3.4vh, 2.4rem); }
  .ue-app .ue-karte:not(.ue-prolog) > .ue-karte__nr { margin: 6px 0 2px; }
  .ue-app .ue-karte:not(.ue-prolog) .ue-tafelbrett { flex: 1 1 auto; min-height: 0; overflow: auto; margin: 8px auto; width: min(100%, 860px); box-sizing: border-box; display: flex; flex-direction: column; justify-content: center; }
  .ue-app .ue-karte:not(.ue-prolog) .ue-tafelbrett > * { flex: none; }
  .ue-app .ue-karte:not(.ue-prolog) > .ue-knoepfe { margin-top: auto; }

  .ue-app .ue-karte:not(.ue-prolog) > #ue-farm-platz { flex: 1 1 auto; min-height: 0; display: flex; flex-direction: column; }
  .ue-app .ue-karte:not(.ue-prolog) > #ue-farm-platz > * { flex: none; }
  .ue-app .ue-karte:not(.ue-prolog) #ue-farm-platz > p { margin: 4px 0; padding: 6px 14px; }
  .ue-app .ue-karte:not(.ue-prolog) #ue-farm-platz > .ue-knoepfe { margin-top: auto; }
  .ue-app .ue-karte:not(.ue-prolog) .ue-farm-flaeche { display: flex; flex-wrap: nowrap; align-items: center; justify-content: center; gap: 14px; flex: 1 1 auto; min-height: 0; }
  .ue-app .ue-karte:not(.ue-prolog) .ue-farm { margin: 0; }
  .ue-app .ue-karte:not(.ue-prolog) .ue-farm-flaeche > .ue-farm__stall, .ue-app .ue-karte:not(.ue-prolog) .ue-farm-flaeche > .ue-farm__kiste { flex-direction: column; margin: 0; }
  .ue-app .ue-karte:not(.ue-prolog) .ue-farm-flaeche .ue-inv__leiste { grid-template-columns: repeat(3, auto); }
  .ue-app .ue-karte:not(.ue-prolog) .ue-farm__baum { width: clamp(30px, 4.6vh, 48px); height: clamp(40px, 6vh, 62px); }
  .ue-app .ue-karte:not(.ue-prolog) .ue-farm__gehege { grid-template-columns: repeat(2, clamp(54px, 8vh, 74px)) !important; }
  .ue-app .ue-karte:not(.ue-prolog) .ue-farm__feld { width: clamp(54px, 8vh, 74px); height: clamp(54px, 8vh, 74px); }
  .ue-app .ue-karte:not(.ue-prolog) .ue-gebirge { height: clamp(150px, calc(100svh - 440px), 560px); width: auto; max-width: 100%; aspect-ratio: 16 / 9; margin: 6px auto; }
  .ue-buehne.is-vollbild .ue-app .ue-karte:not(.ue-prolog) .ue-gebirge { height: clamp(150px, calc(100svh - 360px), 620px); }
  .ue-app .ue-karte:not(.ue-prolog) .ue-gebirge__kiste { display: flex; flex-wrap: nowrap; justify-content: center; gap: 10px; }
  .ue-app .ue-karte:not(.ue-prolog) .ue-gebirge__kiste .ue-inv__leiste { grid-template-columns: repeat(6, auto); }
  .ue-app .ue-karte:not(.ue-prolog) .ue-gebirge ~ .ue-knoepfe { margin-top: 4px; }

  .ue-app .ue-karte:not(.ue-prolog) .ue-raster { flex: 1 1 auto; min-height: 0; overflow: auto; }
  .ue-app .ue-karte:not(.ue-prolog) .ue-zelle { padding: 0; min-height: 0; height: clamp(22px, calc((100svh - 470px) / 10), 46px); }
}

.ue-app .ue-karte:not(.ue-prolog) { background-image: linear-gradient(180deg, rgba(4, 8, 32, .62) 0%, rgba(4, 8, 32, .42) 45%, rgba(4, 8, 32, .5) 100%), var(--ue-welt, url('/images/lernmission-1x1/spiel/spielwelt.webp')); }
.ue-app .ue-karte:not(.ue-prolog) .btn-primary, .ue-optionen .btn-primary {
  filter: drop-shadow(0 0 0 #000) drop-shadow(0 4px 0 #2e1a0a) drop-shadow(0 0 10px rgba(255, 210, 60, .55)); }
.ue-app .ue-karte:not(.ue-prolog) .btn-primary:not(:disabled) { animation: ue-knopf-glimmen 2.4s ease-in-out infinite; }
@keyframes ue-knopf-glimmen { 50% { filter: drop-shadow(0 4px 0 #2e1a0a) drop-shadow(0 0 16px rgba(255, 220, 80, .85)); } }
.ue-app .ue-karte:not(.ue-prolog) .btn-primary:disabled { filter: grayscale(.6) brightness(.8); animation: none; }
.ue-app .ue-karte:not(.ue-prolog) .btn-outline { filter: drop-shadow(0 4px 0 #050a24); }
@media (prefers-reduced-motion: reduce) { .ue-app .ue-karte:not(.ue-prolog) .btn-primary { animation: none; } }

.ue-app .ue-karte:not(.ue-prolog) #ue-farm-platz .ue-rueckmeldung#ue-rm:not(:empty) {
  position: absolute; left: 84px; bottom: 58px; z-index: 6; max-width: min(460px, 60%); margin: 0; padding: 10px 14px; text-align: left;
  border: 3px solid #2e1a0a; border-image: none; border-radius: 12px; background: #fff8e1; color: #1f2a4d !important; font-size: .95rem; line-height: 1.35;
  box-shadow: 0 4px 0 rgba(0, 0, 0, .45); filter: none; animation: ue-auftauchen .3s ease-out; }
.ue-app .ue-karte:not(.ue-prolog) #ue-farm-platz .ue-rueckmeldung#ue-rm:not(:empty)::after {
  content: ""; position: absolute; left: -14px; bottom: 6px; border: 8px solid transparent; border-right: 12px solid #2e1a0a; border-left: 0; }
.ue-app .ue-karte:not(.ue-prolog) #ue-farm-platz .ue-rueckmeldung#ue-rm:not(:empty)::before {
  content: ""; position: absolute; left: -9px; bottom: 8px; border: 6px solid transparent; border-right: 9px solid #fff8e1; border-left: 0; z-index: 1; }
.ue-app .ue-karte:not(.ue-prolog):has(#ue-farm-platz .ue-rueckmeldung#ue-rm:not(:empty))::after { animation: ue-sau-reden .6s steps(1) infinite; }
@keyframes ue-sau-reden { 50% { background-position: 33.333% 50%; } }
@media (orientation: landscape) and (max-height: 520px) {
  .ue-app .ue-karte:not(.ue-prolog) #ue-farm-platz .ue-rueckmeldung#ue-rm:not(:empty) { left: 52px; bottom: 40px; font-size: .7rem; padding: 5px 8px; }
}
@media (orientation: landscape) and (min-height: 521px) {

  .ue-app .ue-karte:not(.ue-prolog) .ue-tafelbrett { justify-content: safe center; }

  .ue-app .ue-karte:not(.ue-prolog) .ue-farm-flaeche { display: grid; grid-template-columns: auto auto auto; grid-template-areas: "links wiese bereich" "stall wiese kiste"; align-items: center; justify-content: center; gap: 10px 18px; }
  .ue-app .ue-karte:not(.ue-prolog) .ue-farm-flaeche > .ue-farm { grid-area: wiese; }
  .ue-app .ue-karte:not(.ue-prolog) .ue-farm-flaeche > .ue-farm__stall { grid-area: stall; }
  .ue-app .ue-karte:not(.ue-prolog) .ue-farm-flaeche > .ue-farm__kiste { grid-area: kiste; max-width: 220px; }
  .ue-app .ue-karte:not(.ue-prolog) .ue-farm__baum { width: clamp(26px, 4vh, 44px); height: clamp(34px, 5.2vh, 58px); }
  .ue-app .ue-karte:not(.ue-prolog) .ue-farm__gehege { grid-template-columns: repeat(2, clamp(48px, 7vh, 72px)) !important; }
  .ue-app .ue-karte:not(.ue-prolog) .ue-farm__feld { width: clamp(48px, 7vh, 72px); height: clamp(48px, 7vh, 72px); }

  .ue-app .ue-karte:not(.ue-prolog) .ue-gebirge { height: clamp(150px, calc(100svh - 500px), 560px); }
  .ue-buehne.is-vollbild .ue-app .ue-karte:not(.ue-prolog) .ue-gebirge { height: clamp(150px, calc(100svh - 420px), 620px); }

  .ue-app .ue-karte:not(.ue-prolog) .ue-ueberblick__feld { min-height: 0; height: clamp(18px, calc((100svh - 470px) / 10), 34px); }
}
@media (orientation: landscape) and (min-height: 521px) {
  .ue-app .ue-karte:not(.ue-prolog) .ue-gebirge { height: clamp(140px, calc(100svh - 540px), 560px); }
  .ue-app .ue-karte:not(.ue-prolog) .ue-ueberblick__feld { height: clamp(16px, calc((100svh - 560px) / 10), 34px); font-size: .7rem; }
  .ue-app .ue-karte:not(.ue-prolog) .ue-ueberblick { gap: 2px; margin: 4px 0; }
  .ue-app .ue-karte:not(.ue-prolog) .ue-zerlegen__liste, .ue-app .ue-karte:not(.ue-prolog) .ue-zerlegen { display: flex; flex-wrap: wrap; justify-content: center; gap: 8px; }
  .ue-app .ue-karte:not(.ue-prolog) .ue-zerlegen__wahl { margin: 0; }
  .ue-app .ue-karte:not(.ue-prolog) .ue-naschbaer__sprite { width: clamp(100px, 22vh, 230px); }
  .ue-app .ue-karte:not(.ue-prolog) .ue-naschbaer { gap: 6px; }
}
@media (orientation: landscape) and (min-height: 521px) {
  .ue-app .ue-karte:not(.ue-prolog) .ue-tafelbrett .ue-zerlegen { display: grid !important; grid-template-columns: repeat(2, minmax(0, auto)); justify-content: center; gap: 8px 12px; }
  .ue-app .ue-karte:not(.ue-prolog) .ue-gebirge { height: clamp(140px, calc(100svh - 560px), 560px); }
  .ue-app .ue-karte:not(.ue-prolog) #ue-farm-platz:has(.ue-gebirge) .ue-rueckmeldung#ue-rm:not(:empty) { bottom: auto; top: 46%; left: 50%; transform: translateX(-50%); }
  .ue-app .ue-karte:not(.ue-prolog) #ue-farm-platz:has(.ue-gebirge) .ue-rueckmeldung#ue-rm:not(:empty)::before, .ue-app .ue-karte:not(.ue-prolog) #ue-farm-platz:has(.ue-gebirge) .ue-rueckmeldung#ue-rm:not(:empty)::after { display: none; }
}

.ue-titel__menue { width: max-content !important; min-width: 36%; max-width: 92%; box-sizing: border-box; }
.ue-titel__punkt { white-space: nowrap; }
@media not ((orientation: portrait) and (max-width: 760px)) { .ue-titel__punkt { font-size: 1.9cqw; padding-left: 3.6cqw; padding-right: 2cqw; } }

.ue-prolog__welt:not(.is-schwein) .ue-prolog__schwein { visibility: hidden; }
.ue-prolog__feuer .ue-feuer { animation: ue-feuer-flackern .8s steps(8) infinite; }
.ue-prolog__steuer { display: none !important; }
.ue-prolog__welt { touch-action: none; outline: none; }
.ue-prolog__blase { position: absolute; z-index: 4; bottom: 96px; display: flex; flex-direction: column; gap: 2px; padding: 8px 12px; border: 3px solid #2e1a0a; border-radius: 12px;
  background: #fff8e1; color: #1f2a4d; font-size: 1.35rem; line-height: 1.2; white-space: nowrap; box-shadow: 0 4px 0 rgba(0, 0, 0, .45);
  opacity: 0; transform: translateY(6px) scale(.9); transition: opacity .25s, transform .25s; pointer-events: none; }
.ue-prolog__blase.is-da { opacity: 1; transform: none; }
.ue-prolog__blase i { font-style: normal; font-weight: 900; color: #7c5cff; }
.ue-prolog__blase::after { content: ""; position: absolute; left: 22px; bottom: -14px; border: 10px solid transparent; border-top: 12px solid #2e1a0a; border-bottom: 0; }
.ue-prolog__blase::before { content: ""; position: absolute; left: 25px; bottom: -8px; border: 7px solid transparent; border-top: 9px solid #fff8e1; border-bottom: 0; z-index: 1; }
@media (max-width: 560px) { .ue-prolog__blase { font-size: 1rem; bottom: 74px; } }
.ue-prolog__blase b { font-family: 'Nunito', sans-serif; font-weight: 900; font-size: .95rem; white-space: normal; max-width: 240px; margin-bottom: 2px; }
@media (max-width: 560px) { .ue-prolog__blase b { font-size: .8rem; max-width: 180px; } }

.ue-prolog__schwein.is-springt .ue-sau, .ue-prolog__schwein.is-springt.is-laeuft .ue-sau { animation: ue-sau-sprung .6s cubic-bezier(.3, .7, .4, 1) both, ue-sau-sprungbild .6s steps(1) both; }
@keyframes ue-sau-sprungbild { 0% { background-position: 66.667% 50%; } 12%, 85% { background-position: 100% 50%; } 100% { background-position: 66.667% 50%; } }
.ue-prolog__schwein.is-brennt.is-springt .ue-sau { animation: ue-sau-sprung .6s cubic-bezier(.3, .7, .4, 1) both, ue-sau-laufen .5s steps(4) infinite; background-position-y: 100%; }

.ue-prolog__aufloesung { position: absolute; inset: 0; z-index: 8; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 8px; padding: 16px;
  background: rgba(5, 10, 40, .72); animation: ue-auftauchen .5s ease-out; text-align: center; }
.ue-prolog__aufloesung .ue-prolog__schild { margin: 0; width: min(380px, 80%); filter: drop-shadow(0 6px 0 rgba(0, 0, 0, .45)); }
.ue-prolog__aufloesung .ue-prolog__rechnung { color: #fff; margin: 4px 0 0; text-shadow: 2px 2px 0 #0a0f2e; }
.ue-prolog__aufloesung .ue-prolog__rechnung i { color: #ffd54a; }
.ue-prolog__aufloesung .ue-prolog__satz { color: #fff; margin: 0 0 6px; }
.ue-prolog__aufloesung .btn-primary { background: #f5c518; color: #1b1b3a; border: 4px solid #2e1a0a; box-shadow: inset 0 0 0 2px #ffe680, 0 5px 0 #8a5a12, 0 0 16px rgba(255, 220, 80, .7); font-family: 'Press Start 2P', ui-monospace, monospace; font-size: .9rem; }
@media (max-width: 560px) { .ue-prolog__aufloesung .ue-prolog__rechnung { font-size: .7rem; } .ue-prolog__aufloesung .ue-prolog__satz { font-size: .8rem; } }

.ue-prolog__feld { position: relative; overflow: visible; contain: layout; }
.ue-prolog__feld .ue-tnt-bild { position: absolute; inset: 0; width: 100%; height: 100%; }
.ue-prolog__feldraster { grid-auto-rows: 1fr; }

.ue-kopf__eis { display: inline-flex; align-items: center; gap: 8px; }
.ue-kopf__eis-bild { width: auto; height: 34px; margin: -10px 0 -8px; image-rendering: pixelated; filter: drop-shadow(0 2px 0 rgba(0, 0, 0, .45)); }
@media (orientation: landscape) and (max-height: 520px) { .ue-kopf__eis-bild { height: 22px; margin: -6px 0 -4px; } }

.ue-app .ue-karte .ue-szene { position: relative; overflow: hidden; height: clamp(220px, calc(100svh - 330px), 460px); margin: 8px 0; padding: 0; border-radius: 10px; touch-action: none; user-select: none;
  background: #0b1440 var(--ue-welt, url('/images/lernmission-1x1/spiel/spielwelt.webp')) center 70% / cover no-repeat; box-shadow: inset 0 0 0 4px #6b4220; }
.ue-szene .ue-prolog__schwein { bottom: 10%; }
.ue-szene .ue-sau { width: clamp(64px, 12vh, 110px); }
.ue-szene__karotte { position: absolute; left: 55%; bottom: 11%; font-size: clamp(2rem, 6vh, 3.4rem); line-height: 1; transform: rotate(-30deg); animation: ue-wippen 1.4s ease-in-out infinite; transition: opacity .4s, transform .4s; }
.ue-szene__karotte.is-weg { opacity: 0; transform: scale(.3) rotate(-30deg); }
.ue-prolog__schwein.is-frisst .ue-sau { animation: ue-sau-knabbern .35s steps(1) infinite; }
@keyframes ue-sau-knabbern { 0% { background-position: 33.333% 50%; } 50% { background-position: 66.667% 50%; } }
.ue-szene__eins { position: absolute; bottom: 38%; margin-left: 2%; font-family: 'Press Start 2P', ui-monospace, monospace; font-size: clamp(1.4rem, 5vh, 2.4rem); color: #ffd54a; text-shadow: 3px 3px 0 #2e1a0a; opacity: 0; pointer-events: none; }
.ue-szene__eins.is-da { animation: ue-eins-steigt 2.4s ease-out forwards; }
@keyframes ue-eins-steigt { 0% { opacity: 0; transform: translateY(20px) scale(.6); } 20% { opacity: 1; transform: none; } 80% { opacity: 1; } 100% { opacity: 0; transform: translateY(-40px); } }
.ue-szene__herzen { position: absolute; bottom: 30%; display: flex; gap: 6px; font-size: 1.4rem; opacity: 0; pointer-events: none; }
.ue-szene__herzen.is-da { opacity: 1; }
.ue-szene__herzen.is-da i { font-style: normal; animation: ue-herz-steigt 1.4s ease-out forwards; }
.ue-szene__herzen.is-da i:nth-child(2) { animation-delay: .2s; } .ue-szene__herzen.is-da i:nth-child(3) { animation-delay: .4s; }
.ue-szene__pfeil { position: absolute; right: 3%; top: 50%; font-size: clamp(3rem, 12vh, 6rem); line-height: 1; transform: translateY(-50%); opacity: 0; pointer-events: none; filter: drop-shadow(0 4px 0 rgba(0, 0, 0, .5)); }
.ue-szene__pfeil.is-da { opacity: 1; animation: ue-pfeil-stupsen 1s ease-in-out infinite; }
@keyframes ue-pfeil-stupsen { 50% { transform: translate(14px, -50%); } }
.ue-szene .ue-prolog__blase { bottom: calc(10% + clamp(70px, 13vh, 120px)); }

@media (orientation: landscape) and (max-height: 520px) {
  .ue-app .ue-prolog { display: flex; flex-direction: column; height: calc(100svh - 16px); box-sizing: border-box; padding: 6px 10px; }
  .ue-app .ue-prolog .ue-prolog__kopf { flex: none; }
  .ue-app .ue-prolog .ue-karte__titel { font-size: .9rem; margin: 0; }
  .ue-app .ue-prolog .ue-prolog__ueberspringen { font-size: .6rem; padding: 2px 6px; }
  .ue-app .ue-prolog .ue-prolog__text, .ue-app .ue-prolog .ue-prolog__zaehler { display: none; }
  .ue-app .ue-prolog .ue-prolog__welt { flex: 1 1 auto; min-height: 0; margin: 4px 0 0; padding: 34px 8px 8px; }
  .ue-app .ue-prolog .ue-prolog__feldraster { width: calc((100svh - 130px) * 6 / 7); margin: 0 auto 0 14%; }
  .ue-app .ue-prolog .ue-prolog__mathe { top: 4px; font-size: .7rem; padding: 4px 10px; }
  .ue-app .ue-prolog .ue-prolog__leiste { flex: none; padding: 3px; }
  .ue-app .ue-prolog .ue-prolog__platz { width: 26px; height: 26px; }
  .ue-app .ue-prolog .ue-sau { width: 48px; }
  .ue-app .ue-prolog .ue-feuer { width: 44px; }
  .ue-app .ue-prolog .ue-prolog__blase { font-size: .8rem; bottom: 56px; padding: 4px 8px; }
  .ue-app .ue-prolog .ue-prolog__blase b { font-size: .7rem; }
  .ue-app .ue-karte .ue-szene { height: calc(100svh - 120px); }
}

.ue-app .ue-karte:has(.ue-szene)::after { display: none; }

.ue-app .ue-karte:not(.ue-prolog) .ue-farm__stall > span { display: inline-block; margin-top: 6px; padding: 4px 10px; border: 2px solid #2e1a0a; border-radius: 8px;
  background: #fff8e1; color: #1f2a4d; font-weight: 800; font-size: .85rem; box-shadow: 0 3px 0 rgba(0, 0, 0, .4); }

.ue-app .ue-karte:not(.ue-prolog) .ue-farm__kiste { width: auto; max-width: 100%; box-sizing: border-box; padding: 6px 12px; }
.ue-app .ue-karte:not(.ue-prolog) .ue-farm__kiste-knoepfe { display: flex; flex-wrap: wrap; justify-content: center; gap: 6px; }
.ue-app .ue-karte:not(.ue-prolog) .ue-farm__kiste-knoepfe .ue-werkstatt__oeffnen { margin: 0; flex: 0 0 auto; }
@media (orientation: landscape) and (min-height: 521px) { .ue-app .ue-karte:not(.ue-prolog) .ue-farm-flaeche > .ue-farm__kiste { max-width: 260px; } }

#ue-prolog-welt, #ue-prolog-welt.is-nacht { background-image: url('/images/lernmission-1x1/spiel/spielwelt-ohne-mond.webp'); }
#ue-prolog-welt::before { content: ""; position: absolute; inset: 0; z-index: 0; pointer-events: none; background: url('/images/lernmission-1x1/spiel/spielwelt-mond.webp') center 70% / cover no-repeat;
  opacity: 0; transform: translateY(18%); transition: opacity 2.2s ease, transform 3s ease-out; image-rendering: pixelated; }
#ue-prolog-welt.is-mond::before { opacity: 1; transform: none; }

.ue-app .ue-karte:not(.ue-prolog) .ue-fuenf { justify-content: center; }

.ue-ueberblick__feld.is-erreichbar { background: #dbe8ff; color: #1f3a8a; border-color: #8fb0f0; gap: 0; letter-spacing: -1px; }
.ue-ueberblick__feld.is-erreichbar .ue-bild { font-size: .8rem; }
.ue-ueberblick__feld.is-erreichbar i, .ue-ueberblick__feld.is-erreichbar .ue-tafel__plus { font-size: .7rem; margin: 0; color: #1f3a8a; font-weight: 900; }
.ue-ueberblick__blau { display: inline-block; padding: 0 6px; border-radius: 4px; background: #dbe8ff; color: #1f3a8a; font-weight: 900; }

.ue-ueberblick__feld.is-erreichbar { overflow: hidden; white-space: nowrap; font-size: .62rem; padding: 0 1px; }
.ue-ueberblick__feld.is-erreichbar .ue-bild { font-size: .68rem; }
.ue-ueberblick__feld.is-erreichbar b { font-weight: 800; font-size: .62rem; }
.ue-ueberblick__feld.is-erreichbar i, .ue-ueberblick__feld.is-erreichbar .ue-tafel__plus { font-size: .62rem; margin: 0 1px; }

@media (orientation: landscape) and (min-height: 521px) {
  .ue-app .ue-karte:not(.ue-prolog) #ue-farm-platz .ue-gebirge,
  .ue-buehne.is-vollbild .ue-app .ue-karte:not(.ue-prolog) #ue-farm-platz .ue-gebirge { flex: 1 1 0; min-height: 120px; height: auto; width: auto; max-width: 100%; aspect-ratio: 16 / 9; align-self: center; margin: 6px auto; }
}

.ue-app .ue-karte .ue-weg { height: clamp(240px, calc(100svh - 300px), 480px); background: #6fb6ff url('/images/lernmission-1x1/spiel/farm/gebirge.webp') center 40% / cover no-repeat; touch-action: auto; }
.ue-weg__pfad { position: absolute; left: 4%; right: 4%; bottom: 13%; height: 9%; border-radius: 999px; background: repeating-linear-gradient(90deg, #c8955a 0 18px, #b9844a 18px 22px);
  box-shadow: inset 0 3px 0 rgba(255, 255, 255, .25), inset 0 -4px 0 rgba(0, 0, 0, .25), 0 3px 0 rgba(0, 0, 0, .3); }
.ue-weg__station { position: absolute; bottom: 20%; transform: translateX(-50%); display: flex; flex-direction: column; align-items: center; gap: 4px; opacity: .55; transition: opacity .4s, transform .4s; }
.ue-weg__station.is-erreicht { opacity: 1; transform: translateX(-50%) scale(1.06); }
.ue-weg__schild { display: flex; flex-direction: column; align-items: center; padding: 4px 12px; border: 3px solid #2e1a0a; border-radius: 6px;
  background: repeating-linear-gradient(180deg, #7a4a24 0 8px, #6a3e1c 8px 10px); color: #fff; font-family: 'Nunito', sans-serif; font-weight: 900; font-size: clamp(.85rem, 2.2vh, 1.15rem);
  white-space: nowrap; box-shadow: 0 4px 0 rgba(0, 0, 0, .45); text-shadow: 1px 1px 0 #2e1a0a; }
.ue-weg__schild b { font-family: 'Press Start 2P', ui-monospace, monospace; font-weight: 400; font-size: clamp(.9rem, 2.6vh, 1.4rem); color: #ffd54a; margin-top: 2px; }
.ue-weg__station--stein .ue-weg__schild { border-radius: 50%; padding: 8px 12px; background: #8b8f9c; border-color: #3b3e48; font-size: clamp(.9rem, 2.4vh, 1.25rem); }
.ue-weg__station--ziel .ue-weg__schild { background: #f5c518; color: #1b1b3a; text-shadow: none; }
.ue-weg__station--ziel .ue-weg__schild b { color: #1b1b3a; }
.ue-weg__station--ziel.is-erreicht .ue-weg__schild { box-shadow: 0 4px 0 rgba(0, 0, 0, .45), 0 0 18px rgba(255, 220, 80, .9); }
.ue-weg__bild { padding: 2px 8px; border-radius: 10px; background: rgba(255, 248, 225, .92); border: 2px solid #2e1a0a; font-size: clamp(1.1rem, 3.4vh, 1.8rem); line-height: 1.2; white-space: nowrap; }
.ue-weg__bild .ue-bild { font-size: inherit; }
.ue-weg__bild .ue-tafel__plus { font-style: normal; font-weight: 900; color: #1f2a4d; margin: 0 2px; }
.ue-weg__sau { bottom: 13%; transition: left 1.05s linear; z-index: 3; }
.ue-weg .ue-sau { width: clamp(48px, 9vh, 80px); }
@media (orientation: landscape) and (max-height: 520px) { .ue-app .ue-karte .ue-weg { height: calc(100svh - 120px); } }

.ue-app .ue-karte:not(.ue-prolog) .ue-spass { display: flex; flex-wrap: wrap; justify-content: center; gap: 10px; margin: 8px 0 14px; }
.ue-app .ue-karte:not(.ue-prolog) .ue-spass button { cursor: pointer; min-width: 64px; min-height: 52px; font-size: 1.8rem; transition: transform .12s; }
.ue-app .ue-karte:not(.ue-prolog) .ue-spass button.ue-wort { font-size: 1rem; font-weight: 900; padding: 6px 16px; }
.ue-app .ue-karte:not(.ue-prolog) .ue-spass button:hover { transform: translateY(-2px); }
.ue-app .ue-karte:not(.ue-prolog) .ue-spass button[aria-checked='true'] { border-image-source: url('/images/lernmission-1x1/spiel/ui/gelb-quadrat.webp'); background: #f5c518; color: #1b1b3a !important; transform: scale(1.08); }
.ue-app .ue-karte:not(.ue-prolog) .ue-spass button[data-morgen='Ja'] { background: #ff9f1c; color: #1b1b3a !important; border-image-source: url('/images/lernmission-1x1/spiel/ui/gelb-quadrat.webp'); }
.ue-app .ue-karte:not(.ue-prolog) .ue-spass button[data-morgen='Ja'][aria-checked='true'] { background: #ff8a00; box-shadow: 0 0 0 3px #fff3b0; }

@media (orientation: landscape) and (max-height: 520px) {
  .ue-app .ue-karte:not(.ue-prolog) .ue-tafelbrett .ue-karte__titel, .ue-app .ue-karte:not(.ue-prolog) .ue-karte__titel { font-size: 1.55rem !important; line-height: 1.15; margin: 0 0 4px !important; }
  .ue-app .ue-karte:not(.ue-prolog) .ue-tafelbrett { padding-top: 0; }
}

@media (orientation: landscape) {
  .ue-app .ue-karte:not(.ue-prolog):has(.ue-raster) { display: grid !important; grid-template-columns: minmax(0, 1fr) auto; grid-auto-rows: min-content; align-content: start; column-gap: 16px; }
  .ue-app .ue-karte:not(.ue-prolog):has(.ue-raster) > * { grid-column: 1; }
  .ue-app .ue-karte:not(.ue-prolog):has(.ue-raster) > .ue-kopf { grid-column: 1 / -1; }
  .ue-app .ue-karte:not(.ue-prolog):has(.ue-raster) > .ue-raster { grid-column: 2; grid-row: 2 / span 20; align-self: start;
    --kante: min(calc(100svh - 150px), 62vw); width: var(--kante); height: var(--kante); box-sizing: border-box; overflow: hidden; padding: 4px; gap: 2px; display: grid; grid-template-rows: repeat(10, 1fr); }
  .ue-buehne.is-vollbild .ue-app .ue-karte:not(.ue-prolog):has(.ue-raster) > .ue-raster { --kante: min(calc(100svh - 70px), 62vw); }
  .ue-app .ue-karte:not(.ue-prolog):has(.ue-raster) .ue-raster__reihe { gap: 2px; min-height: 0; }
  .ue-app .ue-karte:not(.ue-prolog):has(.ue-raster) .ue-zelle { height: auto !important; min-height: 0; padding: 0; font-size: clamp(.45rem, calc(var(--kante) / 52), .8rem); border-width: 1px; border-radius: 4px; }
  .ue-app .ue-karte:not(.ue-prolog):has(.ue-raster) .ue-zelle i { font-size: .8em; right: 2px; bottom: 0; }
  .ue-app .ue-karte:not(.ue-prolog):has(.ue-raster) .ue-legende { flex-direction: column; align-items: flex-start; gap: 4px; }
  .ue-app .ue-karte:not(.ue-prolog):has(.ue-raster) > .ue-knoepfe { align-self: end; flex-wrap: wrap; }
  .ue-app .ue-karte:not(.ue-prolog):has(.ue-raster) .ue-warte-zeile { flex-direction: column; align-items: flex-start; }
  .ue-app .ue-karte:not(.ue-prolog):has(.ue-raster) .ue-tempo { margin-left: 0; }
}
@media (orientation: landscape) and (max-height: 520px) {
  .ue-app .ue-karte:not(.ue-prolog):has(.ue-raster) > .ue-raster { --kante: min(calc(100svh - 70px), 58vw); }
  .ue-app .ue-karte:not(.ue-prolog):has(.ue-raster) > p { font-size: .68rem !important; }
  .ue-app .ue-karte:not(.ue-prolog):has(.ue-raster) .ue-karte__titel { font-size: 1rem !important; }
  .ue-app .ue-karte:not(.ue-prolog):has(.ue-raster) .ue-legende span { font-size: .6rem; padding: 1px 6px; }
}

@media (orientation: landscape) {
  .ue-app .ue-karte:not(.ue-prolog):has(.ue-raster) { container-type: inline-size; grid-template-columns: minmax(240px, 1fr) auto; }
  .ue-app .ue-karte:not(.ue-prolog):has(.ue-raster) > .ue-raster { --kante: min(calc(100svh - 150px), calc(100cqw - 290px)); }
  .ue-buehne.is-vollbild .ue-app .ue-karte:not(.ue-prolog):has(.ue-raster) > .ue-raster { --kante: min(calc(100svh - 110px), calc(100cqw - 290px)); }
  .ue-app .ue-karte:not(.ue-prolog):has(.ue-raster) .ue-karte__titel { font-size: clamp(1.1rem, 2.6vw, 1.8rem) !important; }
  .ue-app .ue-karte:not(.ue-prolog):has(.ue-raster) > p { font-size: .85rem; }
  .ue-app .ue-karte:not(.ue-prolog):has(.ue-raster) .ue-legende { margin: 4px 0; }
  .ue-app .ue-karte:not(.ue-prolog):has(.ue-raster) .ue-legende span { opacity: 1; background: #fff8e1; color: #1f2a4d; }
  .ue-app .ue-karte:not(.ue-prolog):has(.ue-raster) .ue-legende span.is-aus { opacity: .55; }
}
@media (orientation: landscape) and (max-height: 520px) {
  .ue-app .ue-karte:not(.ue-prolog):has(.ue-raster) { grid-template-columns: minmax(200px, 1fr) auto; }
  .ue-app .ue-karte:not(.ue-prolog):has(.ue-raster) > .ue-raster { --kante: min(calc(100svh - 64px), calc(100cqw - 230px)); }
}

.ue-buehne.is-vollbild .ue-leiste { display: flex; max-width: 1100px; margin: 0 auto 4px; }
.ue-buehne.is-vollbild .ue-karte { min-height: calc(100svh - 60px) !important; max-height: calc(100svh - 60px) !important; height: calc(100svh - 60px) !important; }
.ue-buehne.is-vollbild .ue-karte { min-height: calc(100svh - 68px) !important; max-height: calc(100svh - 68px) !important; height: calc(100svh - 68px) !important; }
@media (orientation: landscape) {
  .ue-app .ue-karte:not(.ue-prolog):has(.ue-raster) { grid-template-columns: minmax(280px, 1fr) auto; }
  .ue-app .ue-karte:not(.ue-prolog):has(.ue-raster) > .ue-raster { --kante: min(calc(100svh - 150px), calc(100cqw - 340px)); }
  .ue-buehne.is-vollbild .ue-app .ue-karte:not(.ue-prolog):has(.ue-raster) > .ue-raster { --kante: min(calc(100svh - 120px), calc(100cqw - 340px)); }
  .ue-app .ue-karte:not(.ue-prolog):has(.ue-raster) .ue-legende { display: grid; grid-template-columns: auto auto; justify-content: start; }
  .ue-app .ue-karte:not(.ue-prolog):has(.ue-raster) .ue-tempo .btn { padding: 2px 8px; font-size: .7rem; }
  .ue-app .ue-karte:not(.ue-prolog):has(.ue-raster) > .ue-warte-zeile, .ue-app .ue-karte:not(.ue-prolog):has(.ue-raster) > .ue-zaehler { margin: 4px 0; padding: 4px 10px; }
  .ue-app .ue-karte:not(.ue-prolog):has(.ue-raster) > .ue-knoepfe { margin-top: 6px; }
}
@media (orientation: landscape) and (max-height: 520px) {
  .ue-app .ue-karte:not(.ue-prolog):has(.ue-raster) { grid-template-columns: minmax(230px, 1fr) auto; }
  .ue-app .ue-karte:not(.ue-prolog):has(.ue-raster) > .ue-raster { --kante: min(calc(100svh - 96px), calc(100cqw - 260px)); }
  .ue-app .ue-karte:not(.ue-prolog):has(.ue-raster) > .ue-zaehler { display: none; }

  .ue-buehne.is-vollbild .ue-leiste { margin-bottom: 2px; }
  .ue-buehne .ue-leiste li span { width: 18px; height: 18px; font-size: .6rem; border-width: 1px; }
  .ue-buehne .ue-leiste li, .ue-buehne .ue-leiste__knopf { font-size: 0; gap: 0; }
  .ue-buehne.is-vollbild .ue-karte { min-height: calc(100svh - 32px) !important; max-height: calc(100svh - 32px) !important; height: calc(100svh - 32px) !important; }
}

@media (orientation: landscape) {
  .ue-app .ue-karte:not(.ue-prolog):has(.ue-raster) > .ue-zaehler { display: none; }
  .ue-app .ue-karte:not(.ue-prolog):has(.ue-raster) > .ue-raster { grid-row: 2 / span 6; }
  .ue-app .ue-karte:not(.ue-prolog):has(.ue-raster) > .ue-knoepfe { grid-column: 2; grid-row: 8; justify-content: space-between; margin: 6px 0 0; }
  .ue-app .ue-karte:not(.ue-prolog):has(.ue-raster) > .ue-raster { --kante: min(calc(100svh - 200px), calc(100cqw - 340px)); }
  .ue-buehne.is-vollbild .ue-app .ue-karte:not(.ue-prolog):has(.ue-raster) > .ue-raster { --kante: min(calc(100svh - 170px), calc(100cqw - 340px)); }
}
@media (orientation: landscape) and (max-height: 520px) {
  .ue-app .ue-karte:not(.ue-prolog):has(.ue-raster) > p:not(.ue-karte__nr) { display: none; }
  .ue-app .ue-karte:not(.ue-prolog):has(.ue-raster) .ue-karte__titel { font-size: 1rem !important; }
  .ue-app .ue-karte:not(.ue-prolog):has(.ue-raster) > .ue-raster { --kante: min(calc(100svh - 120px), calc(100cqw - 260px)); }
  .ue-buehne.is-vollbild .ue-app .ue-karte:not(.ue-prolog):has(.ue-raster) > .ue-raster { --kante: min(calc(100svh - 110px), calc(100cqw - 260px)); }
}
@media (orientation: landscape) and (max-height: 520px) {
  .ue-app .ue-karte:not(.ue-prolog):has(.ue-raster) > .ue-raster,
  .ue-buehne.is-vollbild .ue-app .ue-karte:not(.ue-prolog):has(.ue-raster) > .ue-raster { --kante: min(calc(100svh - 150px), calc(100cqw - 260px)); }
}

.ue-ende__bild { display: block; width: min(100%, 560px); height: auto; margin: 4px auto 10px; border: 4px solid #6b4220; border-radius: 8px; box-shadow: 0 6px 0 rgba(0, 0, 0, .4); image-rendering: pixelated; }
@media (orientation: landscape) and (max-height: 520px) { .ue-ende__bild { width: min(100%, 300px); } }

@media (orientation: landscape) {
  .ue-app .ue-karte:not(.ue-prolog):has(.ue-raster) .ue-warte-zeile { max-width: 100%; box-sizing: border-box; overflow: hidden; }
  .ue-app .ue-karte:not(.ue-prolog):has(.ue-raster) .ue-tempo { flex-wrap: wrap; gap: 6px; max-width: 100%; }
  .ue-app .ue-karte:not(.ue-prolog):has(.ue-raster) .ue-tempo .btn { flex: 1 1 auto; min-width: 0; white-space: nowrap; }
}

.ue-prolog__leiste, .ue-app .ue-karte:not(.ue-prolog) .ue-inv__leiste { gap: 0 !important; }
.ue-prolog__platz, .ue-app .ue-karte:not(.ue-prolog) .ue-inv__leiste .ue-mc__slot {
  width: 44px; height: 40px; border: 0 !important; border-radius: 0; box-shadow: none !important; outline: none;
  background: url('/images/lernmission-1x1/spiel/ui/platz.webp') center / 100% 100% no-repeat !important; image-rendering: pixelated; }
.ue-prolog__platz:first-child, .ue-app .ue-karte:not(.ue-prolog) .ue-inv__leiste .ue-mc__slot:first-child { width: 55px; background-image: url('/images/lernmission-1x1/spiel/ui/hotbar-links.webp') !important; }
.ue-prolog__platz:last-child, .ue-app .ue-karte:not(.ue-prolog) .ue-inv__leiste .ue-mc__slot:last-child { width: 55px; background-image: url('/images/lernmission-1x1/spiel/ui/hotbar-rechts.webp') !important; }
.ue-prolog__platz.is-gewaehlt, .ue-app .ue-karte:not(.ue-prolog) .ue-inv__leiste .ue-mc__slot.is-gewaehlt { background-image: url('/images/lernmission-1x1/spiel/ui/platz-gewaehlt.webp') !important; outline: none; }
.ue-prolog__platz .ue-tnt-bild { width: 62%; height: 62%; }
.ue-prolog__leiste { background: none; box-shadow: none; padding: 6px 0; }
.ue-app .ue-karte:not(.ue-prolog) .ue-inv__leiste { grid-template-columns: repeat(6, auto) !important; }
.ue-app .ue-karte:not(.ue-prolog) .ue-inv__leiste .ue-mc__slot > * { transform: scale(.8); }
.ue-app .ue-karte:not(.ue-prolog) .ue-inv__leiste .ue-mc__slot b { color: #fff; text-shadow: 1px 1px 0 #000; }
@media (max-width: 480px), (orientation: landscape) and (max-height: 520px) {
  .ue-prolog__platz, .ue-app .ue-karte:not(.ue-prolog) .ue-inv__leiste .ue-mc__slot { width: 32px; height: 29px; }
  .ue-prolog__platz:first-child, .ue-prolog__platz:last-child, .ue-app .ue-karte:not(.ue-prolog) .ue-inv__leiste .ue-mc__slot:first-child, .ue-app .ue-karte:not(.ue-prolog) .ue-inv__leiste .ue-mc__slot:last-child { width: 40px; }
}

.ue-prolog .ue-prolog__mathe { border-style: solid; border-width: 14px; border-color: transparent; border-image: url('/images/lernmission-1x1/spiel/ui/tafel-blau.webp') 40 fill / 14px / 0 stretch;
  background: none; box-shadow: none; padding: 2px 10px; color: #ffd54a; text-shadow: 2px 2px 0 #0a1238; filter: drop-shadow(0 4px 0 rgba(0, 0, 0, .4)); image-rendering: pixelated; }
@media (orientation: landscape) and (min-height: 521px) { .ue-app .ue-karte:not(.ue-prolog) .ue-farm-flaeche .ue-inv__leiste { grid-template-columns: repeat(3, auto) !important; }
  .ue-app .ue-karte:not(.ue-prolog) .ue-farm-flaeche .ue-inv__leiste .ue-mc__slot:nth-child(3) { width: 55px; background-image: url('/images/lernmission-1x1/spiel/ui/hotbar-rechts.webp') !important; }
  .ue-app .ue-karte:not(.ue-prolog) .ue-farm-flaeche .ue-inv__leiste .ue-mc__slot:nth-child(4) { width: 55px; background-image: url('/images/lernmission-1x1/spiel/ui/hotbar-links.webp') !important; } }

.ue-weg__bild b { color: #1f2a4d; font-family: 'Nunito', sans-serif; font-weight: 900; }

@media (orientation: portrait) and (max-width: 760px) {
  .ue-buehne { position: relative; }
  .ue-buehne.is-vollbild { padding: 4px; }
  .ue-buehne .ue-buehne__leiste, .ue-buehne.is-vollbild .ue-buehne__leiste { position: absolute; top: 4px; right: 4px; left: auto; z-index: 7; margin: 0; transform: none; }
  .ue-buehne .ue-vollbild { width: 32px; height: 32px; padding: 0; justify-content: center; }
  .ue-buehne .ue-vollbild svg { width: 18px; height: 18px; }
  .ue-buehne .ue-vollbild__text { display: none; }

  .ue-buehne .ue-leiste, .ue-buehne.is-vollbild .ue-leiste { display: flex; height: 40px; margin: 0 !important; padding: 0 0 0 2px; gap: 3px; align-items: center; justify-content: flex-start; overflow: visible; }
  .ue-buehne .ue-leiste li, .ue-buehne .ue-leiste li.is-jetzt, .ue-buehne .ue-leiste__knopf { font-size: 0; gap: 0; }
  .ue-buehne .ue-leiste li span { width: 24px; height: 24px; font-size: .68rem; border-width: 2px; }
  .ue-buehne .ue-leiste__bilder { display: none !important; }

  .ue-app .ue-karte:not(.ue-prolog) { overflow: visible; padding-top: 8px !important; }
  .ue-app .ue-karte:not(.ue-prolog) > .ue-kopf { position: absolute; top: -40px; right: 36px; left: auto; z-index: 6; height: 32px; margin: 0; padding: 0; display: flex; align-items: center; gap: 4px; }
  .ue-app .ue-karte:not(.ue-prolog) > .ue-kopf .ue-kopf__rechts { flex-wrap: nowrap; gap: 4px; }
  .ue-app .ue-karte:not(.ue-prolog) .ue-kopf__wort { display: none; }
  .ue-app .ue-karte:not(.ue-prolog) .ue-kopf__eis,
  .ue-app .ue-karte:not(.ue-prolog) .ue-kopf__pause,
  .ue-app .ue-karte:not(.ue-prolog) .ue-farm-knopf { height: 32px; min-width: 32px; box-sizing: border-box; padding: 0 6px !important; border-width: 8px !important; font-size: .8rem !important; line-height: 1; display: inline-flex; align-items: center; justify-content: center; gap: 3px; filter: none; }
  .ue-app .ue-karte:not(.ue-prolog) .ue-kopf__eis-bild { height: 18px; margin: 0; }
  .ue-app .ue-karte:not(.ue-prolog) .ue-farm-knopf__tipp { display: none; }
  .ue-app .ue-karte:not(.ue-prolog) .ue-farm-knopf.is-neu::after { top: -10px; right: -6px; font-size: .55rem; }

  .ue-app .ue-karte:not(.ue-prolog) .ue-karte__nr,
  .ue-app .ue-karte:not(.ue-prolog) .ue-gruppen,
  .ue-app .ue-karte:not(.ue-prolog) .ue-punkte { display: none !important; }

  .ue-titel__menue { width: 84% !important; min-width: 0; padding: 1.6cqw; gap: .4cqw; }
  .ue-titel__punkt { font-size: 3.7cqw !important; padding: 1cqw 1.5cqw 1cqw 6cqw !important; }
  .ue-titel__punkt.is-gewaehlt::before { left: 2cqw; }
}
@media (orientation: portrait) and (max-width: 760px) {

  .ue-app .ue-karte:not(.ue-prolog) { display: flex; flex-direction: column; max-height: calc(100svh - 150px); box-sizing: border-box; padding-bottom: 10px !important; }
  .ue-app .ue-karte:not(.ue-prolog) > * { flex: none; }
  .ue-app .ue-karte:not(.ue-prolog) > .ue-hand { position: absolute !important; top: 0; left: 0; }
  .ue-app .ue-karte:not(.ue-prolog) > .ue-tafelbrett { flex: 0 1 auto; min-height: 0; overflow: auto; }
  .ue-app .ue-karte:not(.ue-prolog) > .ue-knoepfe { margin-top: auto; padding-top: 6px; }

  .ue-app .ue-karte:not(.ue-prolog)::after { display: none; }

  .ue-start__bild, .ue-regel__ziel, .ue-fortsetzen__bild { display: none !important; }

  .ue-prolog .ue-prolog__kopf { flex-wrap: nowrap; gap: 8px; align-items: center; }
  .ue-prolog .ue-karte__titel { font-size: 1rem !important; line-height: 1.3; }
  .ue-prolog .ue-prolog__ueberspringen { flex: none; font-size: .7rem !important; padding: 4px 8px; }
}

.ue-app .ue-karte:not(.ue-prolog) #ue-farm-platz .ue-rueckmeldung.ue-rm--gebirge:not(:empty) {
  position: static !important; transform: none !important; inset: auto !important; max-width: none; margin: 4px 0 6px; text-align: center; }
.ue-app .ue-karte:not(.ue-prolog) #ue-farm-platz .ue-rueckmeldung.ue-rm--gebirge::before,
.ue-app .ue-karte:not(.ue-prolog) #ue-farm-platz .ue-rueckmeldung.ue-rm--gebirge::after { display: none !important; }
.ue-app .ue-karte:not(.ue-prolog) #ue-farm-platz .ue-rueckmeldung#ue-rm:not(:empty) { cursor: pointer; }

.ue-buehne.is-vollbild .ue-app { min-height: 0; }

.ue-modal__kasten, .ue-optionen__kasten { max-height: calc(100svh - 32px); }

.ue-buehne.is-vollbild { display: flex; flex-direction: column; }
.ue-buehne.is-vollbild .ue-buehne__leiste { flex: none; }
.ue-buehne.is-vollbild .ue-app { flex: 1 1 0; min-height: 0; display: flex; flex-direction: column; width: 100%; box-sizing: border-box; }
.ue-buehne.is-vollbild .ue-app > .ue-karte { flex: 1 1 0; min-height: 0 !important; height: auto !important; max-height: none !important; width: 100%; box-sizing: border-box; }
.ue-buehne.is-vollbild .ue-app > :not(.ue-karte) { flex: none; }
@media (orientation: landscape) and (max-height: 520px) {
  .ue-buehne.is-vollbild .ue-buehne__leiste { left: auto !important; right: 4px !important; transform: none !important; top: 2px !important; }
  .ue-start.ue-start--held, .ue-fortsetzen.ue-fortsetzen--karte { display: block !important; }
  .ue-start__bild, .ue-regel__ziel, .ue-fortsetzen__bild { display: none !important; }
  .ue-buehne.is-vollbild .ue-app > .ue-karte { flex: 1 1 0; min-height: 0 !important; height: auto !important; max-height: none !important; width: 100% !important; max-width: none !important; box-sizing: border-box; }
  .ue-buehne.is-vollbild .ue-app > :not(.ue-karte) { flex: none; }
}

@media (max-width: 760px), (orientation: landscape) and (max-height: 520px) {
  .ue-start.ue-start--held { padding: 14px 16px; }
  .ue-fortsetzen.ue-fortsetzen--karte { padding: 10px 16px; margin-top: 8px; }
}

@media (orientation: landscape) and (max-height: 520px) {
  .ue-buehne.is-vollbild .ue-app:has(> .ue-start) { flex-direction: row; align-items: flex-start; gap: 8px; }
  .ue-buehne.is-vollbild .ue-app:has(> .ue-start) > .ue-start { flex: 3 1 0 !important; min-width: 0; }
  .ue-buehne.is-vollbild .ue-app:has(> .ue-start) > .ue-fortsetzen { flex: 2 1 0 !important; min-width: 0; margin-top: 0; }
}

.ue-app .ue-karte:not(.ue-prolog) .ue-knoepfe { flex-wrap: nowrap !important; align-items: center; }
.ue-app .ue-karte:not(.ue-prolog) .ue-knoepfe > .btn { flex: 0 1 auto; min-width: 0; white-space: nowrap; }
.ue-app .ue-karte:not(.ue-prolog) #ue-zurueck, .ue-app .ue-karte:not(.ue-prolog) .ue-pfeil-zurueck { flex: none; font-size: 0 !important; width: 52px; min-width: 52px; padding-left: 0 !important; padding-right: 0 !important; justify-content: center; }
.ue-app .ue-karte:not(.ue-prolog) #ue-zurueck::before, .ue-app .ue-karte:not(.ue-prolog) .ue-pfeil-zurueck::before { content: '◀'; font-size: 1rem; line-height: 1; color: #fff; }

.ue-app.is-zu-klein .ue-karte:not(.ue-prolog) { flex: none !important; height: auto !important; max-height: none !important; overflow: visible !important; }
.ue-app.is-zu-klein .ue-karte:not(.ue-prolog) > .ue-tafelbrett { flex: none !important; overflow: visible !important; }

@media (orientation: portrait) and (max-width: 760px) {
  .ue-buehne .ue-leiste li span { width: clamp(16px, calc((100vw - 190px) / 6 - 3px), 24px); height: clamp(16px, calc((100vw - 190px) / 6 - 3px), 24px); }
}
@media (orientation: portrait) and (max-width: 360px) {
  .ue-app .ue-karte:not(.ue-prolog) .ue-kopf__eis, .ue-app .ue-karte:not(.ue-prolog) .ue-kopf__pause, .ue-app .ue-karte:not(.ue-prolog) .ue-farm-knopf { height: 28px; min-width: 28px; padding: 0 3px !important; }
  .ue-app .ue-karte:not(.ue-prolog) > .ue-kopf { top: -38px; right: 34px; gap: 2px; }
  .ue-buehne .ue-vollbild { width: 28px; height: 28px; }
}

.ue-buehne.is-vollbild .ue-app > .ue-karte:not(.ue-prolog):not(:has(.ue-raster)) { display: flex; flex-direction: column; }
.ue-buehne.is-vollbild .ue-app > .ue-karte:not(.ue-prolog):not(:has(.ue-raster)) > * { flex: none; }
.ue-buehne.is-vollbild .ue-app > .ue-karte:not(.ue-prolog):not(:has(.ue-raster)) > .ue-tafelbrett { flex: 0 1 auto; min-height: 0; overflow: auto; }
.ue-buehne.is-vollbild .ue-app > .ue-karte:not(.ue-prolog):not(:has(.ue-raster)) > .ue-knoepfe { margin-top: auto; }
.ue-buehne.is-vollbild .ue-app > .ue-karte:not(.ue-prolog):not(:has(.ue-raster)) > .ue-hand { position: absolute !important; }
.ue-app .ue-karte:not(.ue-prolog) .ue-knoepfe__rechts { flex-wrap: nowrap !important; flex: 0 1 auto; min-width: 0; }
.ue-app .ue-karte:not(.ue-prolog) .ue-knoepfe__rechts > .btn { flex: 0 1 auto; min-width: 0; white-space: nowrap; }

.ue-app .ue-karte .ue-frage-bild { position: relative; }
.ue-samenkorn { position: absolute; z-index: 4; display: grid; place-items: center; width: 44px; height: 44px; padding: 0; border: 3px solid #6b4220; border-radius: 50%; background: #f6ecd2; box-shadow: 0 3px 0 rgba(0, 0, 0, .35); font-size: 1.5rem; cursor: pointer; animation: ue-samen-wippen 1.6s ease-in-out infinite; }
.ue-samenkorn.is-gesammelt { width: auto; padding: 0 8px; border-radius: 999px; font-size: .9rem; font-weight: 800; color: #146b38; pointer-events: none; animation: ue-samen-weg 1s ease-out forwards; }
@keyframes ue-samen-wippen { 50% { transform: translateY(-4px) rotate(-6deg); } }
@keyframes ue-samen-weg { to { opacity: 0; transform: translateY(-24px); } }

.ue-schweinblase { display: flex; align-items: center; gap: 8px; max-width: 420px; margin: 10px auto 0; padding: 6px 12px; border: 3px solid #2e1a0a; border-radius: 12px; background: #fff8e1; color: #1f2a4d; font-size: .85rem; text-align: left; animation: ue-auftauchen .3s ease-out; }
.ue-schweinblase img { flex: none; width: 44px; height: auto; image-rendering: pixelated; }

.ue-zeitaufgabe { display: grid; gap: 6px; justify-items: center; padding: 8px 10px; border: 4px solid #6b4220; border-radius: 10px; background: #f6ecd2; box-shadow: 0 5px 0 rgba(0, 0, 0, .4); color: #1f2a4d; }
.ue-zeitaufgabe__frage { margin: 0; font-size: 1.5rem; font-weight: 800; }
.ue-zeitaufgabe__uhr { display: block; width: 100%; height: 8px; border-radius: 4px; background: #d9c9a0; overflow: hidden; }
.ue-zeitaufgabe__uhr i { display: block; height: 100%; background: #e2462f; transform-origin: left; animation: ue-uhr-ab linear forwards; }
@keyframes ue-uhr-ab { from { transform: scaleX(1); } to { transform: scaleX(0); } }
.ue-zeitaufgabe__wahl { display: grid; grid-template-columns: repeat(4, minmax(48px, 1fr)); gap: 6px; width: 100%; }
.ue-zeitaufgabe__knopf { min-height: 48px; border: 3px solid #2e1a0a; border-radius: 8px; background: #fff; color: #1f2a4d; font: 800 1.2rem/1 'Nunito', sans-serif; cursor: pointer; box-shadow: 0 3px 0 #8a5a12; }
.ue-zeitaufgabe__knopf:focus-visible { outline: 3px solid #f5c518; outline-offset: 2px; }

.ue-klippe { position: relative; overflow: hidden; width: 100%; max-width: 760px; aspect-ratio: 16 / 9; margin: 6px auto; border: 4px solid #2e1a0a; border-radius: 10px; background: #5aa0e6 url('/images/lernmission-1x1/spiel/klippe-oben.webp') center / cover no-repeat; image-rendering: pixelated; }
.ue-klippe--unten { background-image: url('/images/lernmission-1x1/spiel/klippe-unten.webp'); }
.ue-klippe__sau { position: absolute; bottom: 22%; left: var(--start, 10%); width: clamp(40px, 9%, 72px); padding: 0; border: 0; background: none; cursor: pointer; animation: ue-sau-wandern var(--dauer, 8s) ease-in-out var(--verzug, 0s) infinite alternate; }
.ue-klippe__sau img { display: block; width: 100%; height: auto; image-rendering: pixelated; }
.ue-klippe__sau.is-wartet { animation-play-state: paused; filter: drop-shadow(0 0 6px #ffd23a); }
.ue-klippe__sau.is-weg { opacity: 0; transform: translateX(-120%); transition: opacity .6s, transform .6s; pointer-events: none; }
@keyframes ue-sau-wandern { 0% { transform: translateX(0) scaleX(1); } 49% { transform: translateX(200%) scaleX(1); } 50% { transform: translateX(200%) scaleX(-1); } 100% { transform: translateX(0) scaleX(-1); } }
.ue-klippe__aufgabe { position: absolute; left: 50%; top: 6%; z-index: 5; width: min(92%, 360px); transform: translateX(-50%); }
.ue-klippe__aufgabe:empty { display: none; }
.ue-klippe__sand { position: relative; display: flex; margin: 4px auto; }
.ue-klippe__sand.is-zu { opacity: .85; }
.ue-klippe__stand { display: flex; flex-wrap: wrap; justify-content: center; gap: 6px 16px; margin: 4px 0; font-size: .85rem; }
.ue-klippe__herzen i { font-style: normal; }
.ue-klippe__herzen i.is-leer { opacity: .5; }

.ue-klippe__faller { position: absolute; left: 22%; top: 18%; z-index: 3; width: clamp(40px, 10%, 76px); }
.ue-klippe__faller img { display: block; width: 100%; height: auto; image-rendering: pixelated; }
.ue-klippe.is-faellt .ue-klippe__faller { animation: ue-sau-faellt 2.2s cubic-bezier(.45, 0, .9, .6) forwards; }
@keyframes ue-sau-faellt { 0% { top: 18%; transform: rotate(0); } 100% { top: 72%; transform: rotate(160deg); } }
.ue-klippe.is-gerettet.is-gelandet .ue-klippe__faller { animation: ue-sau-plumps .5s ease-out forwards; top: 72%; }
@keyframes ue-sau-plumps { 0% { transform: rotate(160deg) translateY(0); } 40% { transform: rotate(0) translateY(14%); } 100% { transform: rotate(0) translateY(0); } }
.ue-klippe.is-autsch.is-gelandet .ue-klippe__faller { top: 72%; transform: rotate(0); animation: ue-autsch .35s steps(2) 4; }
@keyframes ue-autsch { 50% { filter: brightness(1.7) saturate(.3); transform: translateX(-4%); } }
.ue-klippe__eimer { position: absolute; left: 21%; top: 78%; z-index: 2; width: clamp(44px, 12%, 88px); font-size: clamp(1.6rem, 5vw, 3rem); line-height: 1; text-align: center; opacity: 0; transform: scale(.2); transform-origin: 50% 100%; }
.ue-klippe__wasser { position: absolute; left: 50%; bottom: 60%; font-size: .7em; transform: translateX(-50%); }
.ue-klippe.is-gerettet .ue-klippe__eimer { animation: ue-eimer-da .25s ease-out forwards; }
@keyframes ue-eimer-da { to { opacity: 1; transform: scale(1); } }
.ue-klippe.is-gerettet.is-gelandet .ue-klippe__wasser { animation: ue-platsch .6s ease-out; }
@keyframes ue-platsch { 50% { transform: translateX(-50%) scale(1.8); } }
.ue-klippe.is-gerettet.is-raus .ue-klippe__eimer { opacity: 1; transform: none; animation: ue-eimer-raus .7s ease-in forwards; }
@keyframes ue-eimer-raus { to { opacity: 0; transform: translateY(-140%) scale(.6); } }
.ue-klippe.is-autsch .ue-klippe__eimer { animation: ue-eimer-kippt 1.2s ease-out forwards; }
@keyframes ue-eimer-kippt { 0% { opacity: 0; transform: translateX(120%) scale(.2); } 25% { opacity: 1; transform: translateX(120%) scale(1); } 60% { opacity: 1; transform: translateX(120%) rotate(80deg); } 100% { opacity: 1; transform: translateX(120%) rotate(88deg); } }
.ue-klippe.is-autsch .ue-klippe__eimer { transform-origin: 100% 100%; }
.ue-klippe.is-autsch .ue-klippe__wasser { opacity: .8; }

.ue-sandgebiet { position: relative; overflow: hidden; width: 100%; max-width: 760px; aspect-ratio: 16 / 9; margin: 6px auto; border: 4px solid #2e1a0a; border-radius: 10px;
  background: linear-gradient(180deg, #8ecdf6 0 38%, #f7d98b 38% 60%, #e8bf62 60% 100%); }
.ue-sandgebiet__deko { position: absolute; font-size: clamp(1.6rem, 5vw, 3rem); }
.ue-sandgebiet__haufen { position: absolute; }

.ue-wassereimer { position: relative; display: inline-grid; place-items: center; }
.ue-wassereimer i { position: absolute; right: -4px; bottom: -4px; font-style: normal; font-size: .7em; }
.ue-farm__feld.is-saat .ue-bild { animation: ue-samen-wippen 1.6s ease-in-out infinite; }
@media (prefers-reduced-motion: reduce) { .ue-klippe__sau, .ue-samenkorn { animation: none; } }

.ue-app .ue-karte.ue-karte--farm > :not(.ue-farm-fenster):not(.ue-kopf) { display: none !important; }

.ue-app .ue-karte.ue-karte--farm > .ue-kopf { display: flex !important; }

.ue-klippe__aufgabe--unter { position: static; width: min(100%, 420px); margin: 4px auto; transform: none; }

.ue-sandgebiet__haufen { position: absolute; width: clamp(56px, 12%, 96px); aspect-ratio: 2 / 1; margin-left: -6%; padding: 0; border: 0; border-radius: 50% 50% 8px 8px / 100% 100% 8px 8px;
  background: radial-gradient(ellipse at 40% 30%, #fbe6a8, #e2b65a 60%, #b98a35); box-shadow: 0 4px 0 rgba(0, 0, 0, .25); cursor: pointer; touch-action: none; }
.ue-sandgebiet__haufen:focus-visible { outline: 3px solid #1f2a4d; outline-offset: 3px; }

.ue-klippe, .ue-sandgebiet { width: min(100%, 760px, calc((100svh - 330px) * 16 / 9)); }
@media (orientation: landscape) and (max-height: 520px) {
  .ue-klippe, .ue-sandgebiet { width: min(100%, calc((100svh - 170px) * 16 / 9)); min-width: 200px; }
}

@media (orientation: landscape) and (max-height: 520px) {
  .ue-klippe.ue-klippe--unten, #ue-farm-platz:has(.ue-zeitaufgabe) .ue-klippe, .ue-farm-fenster:has(.ue-zeitaufgabe) .ue-klippe { width: min(100%, calc((100svh - 250px) * 16 / 9)); min-width: 160px; }
  .ue-zeitaufgabe { padding: 4px 8px; gap: 3px; }
  .ue-zeitaufgabe__frage { font-size: 1.1rem; }
  .ue-zeitaufgabe__knopf { min-height: 38px; font-size: 1rem; }
}
@media (orientation: landscape) and (max-height: 520px) {

  .ue-farm-fenster:has(.ue-zeitaufgabe) :is(.ue-klippe__sand, .ue-gebirge__kiste, .ue-klippe__stand, .ue-werkstatt),
  .ue-farm-fenster:has(.ue-zeitaufgabe) .ue-farm-fenster > p:first-child { display: none !important; }
}

.ue-raster__reihe.is-leer { display: grid; }

.ue-klippe.is-autsch .ue-klippe__eimer { transform-origin: 100% 100%; animation: ue-eimer-spaet .3s ease-out forwards; }
@keyframes ue-eimer-spaet { from { opacity: 0; transform: scale(.2); } to { opacity: 1; transform: scale(1); } }
.ue-klippe.is-autsch.is-gelandet .ue-klippe__eimer { opacity: 1; animation: ue-eimer-umkippen .5s ease-in forwards; }
@keyframes ue-eimer-umkippen { from { transform: rotate(0); } to { transform: rotate(85deg); } }
.ue-klippe.is-autsch.is-gelandet .ue-klippe__wasser { animation: ue-wasser-raus .6s ease-out forwards; }
@keyframes ue-wasser-raus { to { opacity: 0; transform: translate(80%, 120%) scale(1.6); } }
.ue-klippe.is-autsch.is-gelandet .ue-klippe__faller { top: 72%; animation: ue-purzeln .7s ease-out forwards, ue-autsch .35s steps(2) .7s 4; }
@keyframes ue-purzeln { 0% { transform: translate(0, 0) rotate(160deg); } 40% { transform: translate(20%, -25%) rotate(250deg); } 100% { transform: translate(-70%, 8%) rotate(360deg); } }

.ue-klippe__sau .ue-sau { width: 100%; background-position-y: 0%; animation: ue-sau-laufen .5s steps(4) infinite; }
.ue-klippe__sau.is-wartet .ue-sau { animation: none; background-position: 66.667% 50%; }
.ue-klippe__faller .ue-sau { width: 100%; background-position: 100% 50%; }
.ue-klippe.is-gerettet.is-gelandet .ue-klippe__faller .ue-sau { background-position: 66.667% 50%; }
.ue-schweinblase .ue-sau { flex: none; width: 44px; }
.ue-klippe--unten { cursor: pointer; }
@media (prefers-reduced-motion: reduce) { .ue-klippe__sau .ue-sau { animation: none; } }

.ue-klippe--unten .ue-klippe__faller { left: 22%; top: 16%; }
.ue-klippe--unten.is-faellt .ue-klippe__faller { animation: ue-mlg-fall 2.2s cubic-bezier(.5, 0, .85, .55) forwards !important; }
@keyframes ue-mlg-fall { 0% { top: 16%; } 100% { top: 62%; } }
.ue-klippe--unten.is-gelandet .ue-klippe__faller { top: 62%; animation: none !important; transform: none !important; }
.ue-klippe--unten .ue-klippe__faller .ue-sau { background-position: 100% 50%; }
.ue-klippe--unten.is-gelandet .ue-klippe__faller .ue-sau { background-position: 66.667% 50%; }

.ue-mlg__hand { position: absolute; left: 78%; top: 38%; width: 60%; font-size: clamp(1rem, 3vw, 1.6rem); line-height: 1; opacity: 0; transform: scale(.4); transition: opacity .15s, transform .15s; }
.ue-klippe.is-bereit .ue-mlg__hand { opacity: 1; transform: none; }
.ue-klippe.is-wasser .ue-mlg__hand .ue-wassereimer i, .ue-klippe.is-wasser .ue-mlg__platz--eimer .ue-wassereimer i { visibility: hidden; }
.ue-klippe.is-geborgen .ue-mlg__hand .ue-wassereimer i, .ue-klippe.is-geborgen .ue-mlg__platz--eimer .ue-wassereimer i { visibility: visible; }
.ue-klippe.is-geborgen .ue-mlg__hand { opacity: 0; transition-delay: .5s; }

.ue-mlg__wasser { position: absolute; left: 20%; top: 74%; z-index: 4; width: clamp(48px, 13%, 100px); aspect-ratio: 1 / .62; opacity: 0; transform: scaleY(.1); transform-origin: 50% 100%;
  background: repeating-linear-gradient(180deg, rgba(120, 170, 255, .9) 0 3px, rgba(52, 102, 220, .85) 3px 9px), #3466dc; box-shadow: inset 0 3px 0 rgba(200, 225, 255, .9); image-rendering: pixelated; }
.ue-klippe.is-wasser .ue-mlg__wasser { opacity: .82; transform: none; transition: opacity .08s, transform .12s ease-out; animation: ue-mlg-wellen .8s steps(4) infinite; }
@keyframes ue-mlg-wellen { to { background-position: 0 9px; } }
.ue-klippe.is-wasser.is-gelandet .ue-mlg__wasser { box-shadow: inset 0 3px 0 rgba(200, 225, 255, .9), 0 -6px 0 -2px rgba(200, 225, 255, .8); }
.ue-klippe.is-geborgen .ue-mlg__wasser { opacity: 0; transform: scaleY(.1); transition: opacity .25s, transform .25s ease-in; animation: none; }

.ue-klippe--unten.is-autsch.is-gelandet .ue-klippe__faller .ue-sau { animation: ue-mlg-schaden .5s steps(1) 2 !important; }
@keyframes ue-mlg-schaden { 0% { filter: sepia(1) saturate(9) hue-rotate(-40deg) brightness(.85); } 50% { filter: none; } }

.ue-mlg__hud { position: absolute; left: 50%; bottom: 2%; z-index: 5; display: grid; justify-items: start; gap: 2px; transform: translateX(-50%); pointer-events: none; }
.ue-mlg__herzen { display: flex; gap: 2px; }
.ue-mlg__herzen i { font-style: normal; font-size: clamp(.8rem, 2.4vw, 1.2rem); line-height: 1; text-shadow: 1px 1px 0 #000, -1px -1px 0 #000, 1px -1px 0 #000, -1px 1px 0 #000; }
.ue-mlg__herzen i::before { content: '❤'; }
.ue-mlg__herzen i.is-voll { color: #e3262b; }
.ue-mlg__herzen i.is-leer { color: #3b1214; }
.ue-mlg__herzen i.is-blinkt { animation: ue-mlg-herz .3s steps(1) 4; }
@keyframes ue-mlg-herz { 0% { color: #fff; } 50% { color: #e3262b; } }
.ue-mlg__leiste { display: flex; }
.ue-mlg__platz { display: grid; place-items: center; width: clamp(28px, 6vw, 44px); aspect-ratio: 1.1; background: url('/images/lernmission-1x1/spiel/ui/platz.webp') center / 100% 100% no-repeat; image-rendering: pixelated; font-size: clamp(.8rem, 2.4vw, 1.3rem); }
.ue-mlg__platz > * { transform: scale(.85); }
.ue-klippe.is-bereit .ue-mlg__platz--eimer { background-image: url('/images/lernmission-1x1/spiel/ui/platz-gewaehlt.webp'); }

@keyframes ue-mlg-fall { 0% { top: 16%; } 100% { top: 68%; } }
.ue-klippe--unten.is-gelandet .ue-klippe__faller { top: 68%; }
.ue-mlg__wasser { top: 80%; }

.ue-mlg__hud { left: auto; right: 3%; transform: none; justify-items: end; }

.ue-app .ue-karte:not(.ue-prolog) .ue-modal .ue-knoepfe, .ue-app .ue-karte:not(.ue-prolog) .ue-modal .ue-knoepfe__rechts { flex-wrap: wrap !important; justify-content: center; }
.ue-app .ue-karte:not(.ue-prolog) .ue-modal .ue-knoepfe > .btn, .ue-app .ue-karte:not(.ue-prolog) .ue-modal .ue-knoepfe__rechts > .btn { flex: 0 1 auto; min-width: auto; white-space: normal; }

.ue-mc__slot .ue-farm__sau, .ue-ofen__platz .ue-farm__sau { width: 100%; max-width: 40px; }
.btn .ue-farm__sau, .ue-mlg__platz .ue-farm__sau { display: inline-block; width: 1.8em; vertical-align: middle; }

.ue-klippe--unten.is-davon .ue-klippe__faller { transform: translateX(-420%) scaleX(-1) !important; opacity: 0; transition: transform 1.2s ease-in, opacity .4s ease-in .8s; }
.ue-klippe--unten.is-davon .ue-klippe__faller .ue-sau { background-position-y: 0%; animation: ue-sau-laufen .4s steps(4) infinite !important; }

@media (max-width: 760px) {
  .ue-app .ue-karte:not(.ue-prolog) .ue-knoepfe > .btn:not(#ue-zurueck):not(.ue-pfeil-zurueck),
  .ue-app .ue-karte:not(.ue-prolog) .ue-knoepfe__rechts > .btn { padding-left: 10px !important; padding-right: 10px !important; }
}

.ue-box { max-width: var(--container, 1180px); }

@media (orientation: landscape) and (min-width: 900px) and (min-height: 521px) {
  .ue-farm-fenster:has(> .ue-klippe), .ue-farm-fenster:has(> .ue-sandgebiet) { display: grid; grid-template-columns: minmax(0, 1fr) minmax(220px, 300px); column-gap: 16px; align-items: start; align-content: start; }
  .ue-farm-fenster:has(> .ue-klippe) > *, .ue-farm-fenster:has(> .ue-sandgebiet) > * { grid-column: 1 / -1; }
  .ue-farm-fenster:has(> .ue-klippe) > .ue-klippe, .ue-farm-fenster:has(> .ue-sandgebiet) > .ue-sandgebiet { grid-column: 1; grid-row: span 2; width: min(100%, calc((100svh - 360px) * 16 / 9)); max-width: none; margin: 0 auto; }
  .ue-farm-fenster:has(> .ue-klippe) > :is(.ue-klippe__sand, .ue-klippe__stand),
  .ue-farm-fenster:has(> .ue-sandgebiet) > .ue-spiel__rechnung { grid-column: 2; margin: 0 0 8px; }
  .ue-farm-fenster:has(> .ue-klippe) > .ue-klippe__stand { flex-direction: column; align-items: flex-start; }
  .ue-farm-fenster:has(> .ue-klippe) > .ue-klippe__aufgabe { grid-column: 1; }
}
@media (orientation: landscape) and (min-width: 900px) and (min-height: 521px) {

  .ue-farm-fenster:has(> .ue-klippe) > .ue-klippe__aufgabe { grid-column: 2; margin: 0 0 8px; }
  .ue-farm-fenster:has(> .ue-klippe) > .ue-klippe__aufgabe .ue-zeitaufgabe__wahl { grid-template-columns: repeat(2, minmax(48px, 1fr)); }
}
@media (orientation: landscape) and (min-width: 900px) and (min-height: 521px) {
  .ue-farm-fenster:has(> .ue-klippe) > .ue-klippe { grid-row: span 3; }
}

:where(.ue-buehne, .ue-buehne *) { touch-action: manipulation; }
.ue-zeitaufgabe__knopf { touch-action: manipulation; -webkit-tap-highlight-color: transparent; user-select: none; -webkit-user-select: none; }
.ue-zeitaufgabe__knopf:active, .ue-zeitaufgabe__knopf.is-gewaehlt { transform: translateY(2px); box-shadow: 0 1px 0 #8a5a12; background: #fff4c2; }

html[lang="en"] .ue-auswahl__bild--neu::after,
html[lang="en"] .ue-region.is-neu::after,
html[lang="en"] .ue-farm-knopf.is-neu::after { content: "new"; }

html[lang="en"] .ue-titel__logo { width: 55%; }
@media (orientation: portrait) and (max-width: 760px) {
  html[lang="en"] .ue-titel__logo { width: 78%; }
}