/* LumiLino v105 – sichtbarer, kinderfreundlicher 3D-Ladestatus für Wo ist Mama? */
#start-mama { position: relative; overflow: hidden; }
#start-mama .game-choice-loading {
  position: absolute;
  inset: 0;
  z-index: 8;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 5px;
  padding: 12px;
  background: rgba(247, 252, 245, .96);
  color: #114e55;
  opacity: 0;
  visibility: hidden;
  transition: opacity .16s ease;
  pointer-events: none;
}
#start-mama.is-loading .game-choice-loading { opacity: 1; visibility: visible; }
#start-mama .game-choice-loading i,
.mama-loading-spinner {
  display: block;
  width: 34px;
  height: 34px;
  border: 4px solid rgba(12, 139, 149, .18);
  border-top-color: #078a96;
  border-right-color: #f1b82f;
  border-radius: 50%;
  animation: lumilino-mama-loading-spin .75s linear infinite;
}
#start-mama .game-choice-loading strong { font-size: clamp(1rem, 2.4vw, 1.3rem); }
#start-mama .game-choice-loading small { font-size: .86rem; color: #37666b; }
#start-mama[aria-busy="true"] { cursor: progress; }

.mama-start-loading {
  position: absolute;
  inset: 0;
  z-index: 80;
  display: grid;
  place-items: center;
  padding: 20px;
  background:
    radial-gradient(circle at 50% 42%, rgba(255,255,255,.86), rgba(230,247,238,.96) 54%, rgba(188,229,205,.98));
  text-align: center;
}
.mama-start-loading[hidden] { display: none !important; }
.mama-start-loading-card {
  width: min(440px, calc(100% - 24px));
  display: grid;
  justify-items: center;
  gap: 9px;
  padding: clamp(18px, 4vw, 30px);
  border: 3px solid rgba(7,138,150,.18);
  border-radius: 28px;
  background: rgba(255,255,255,.94);
  box-shadow: 0 18px 46px rgba(21,78,72,.2);
  color: #124f55;
}
.mama-start-loading-card strong { font-size: clamp(1.05rem, 3.2vw, 1.55rem); line-height: 1.15; }
.mama-start-loading-card small { max-width: 32ch; font-size: clamp(.83rem, 2vw, .98rem); line-height: 1.35; color: #3c686a; }
.mama-loading-tractor {
  font-size: clamp(2.2rem, 7vw, 3.5rem);
  line-height: 1;
  animation: lumilino-mama-loading-bob .9s ease-in-out infinite alternate;
}
@keyframes lumilino-mama-loading-spin { to { transform: rotate(360deg); } }
@keyframes lumilino-mama-loading-bob { to { transform: translateY(-4px) rotate(-2deg); } }
@media (prefers-reduced-motion: reduce) {
  #start-mama .game-choice-loading i,
  .mama-loading-spinner,
  .mama-loading-tractor { animation: none; }
}
