/* Story farm: readable dialogue, explicit interaction and no timed-task clutter. */
.mama-thought { position:absolute; z-index:15; left:30%; top:24%; display:flex; align-items:center; gap:6px; padding:8px 12px; background:#fffef6; border:3px solid #eed478; border-radius:50%; box-shadow:0 5px 16px #233a3930; transform:translate(-50%,-100%); pointer-events:none; }
.mama-thought[hidden] { display:none; }
.mama-outro { position:absolute; inset:0; z-index:24; display:grid; place-items:center; padding:clamp(18px,5vw,64px); pointer-events:none; text-align:center; color:#fff6de; background:rgb(14 24 24 / var(--outro-shade,0)); border-radius:inherit; }
.mama-outro[hidden] { display:none; }
.game-page-simple.is-mama-game .mama-pause-note { z-index:26; }
.mama-outro-copy { opacity:var(--outro-title,0); max-width:760px; text-shadow:0 3px 18px #0008; }
.mama-outro-copy>span { display:block; font-size:clamp(2rem,6vw,4rem); margin-bottom:12px; }
.mama-outro-copy strong { display:block; font-size:clamp(1.8rem,5vw,3.8rem); line-height:1.12; text-wrap:balance; color:#fff1bf; }
.mama-outro-copy p { font-size:clamp(1.05rem,2.6vw,1.65rem); line-height:1.4; margin:18px 0 10px; text-wrap:balance; }
.mama-outro-copy small { font-size:clamp(.9rem,2vw,1.1rem); color:#e7decb; }
/* The result must be above the WebGL canvas, not painted underneath it. */
.game-page-simple.is-mama-game .game-message { z-index:32; pointer-events:auto; }
.game-page-simple.is-mama-complete .game-message { padding:16px; backdrop-filter:none; background:linear-gradient(#12262299,#122622ed); }
.game-page-simple.is-mama-complete .game-message-card { width:min(100%,640px); max-height:100%; min-height:0; overflow:auto; padding:clamp(18px,3vw,28px); gap:12px; border-color:#ffe4a580; background:#153d3aee; touch-action:pan-y; }
.game-page-simple.is-mama-complete .game-message-card>* { flex-shrink:0; }
.game-page-simple.is-mama-complete .game-board-wrap { touch-action:pan-y; }
.is-mama-complete .game-result-actions { display:grid!important; grid-template-columns:1fr 1fr; gap:10px; width:100%; }
.is-mama-complete .game-result-actions .btn { margin:0; min-height:50px; font-size:1rem; line-height:1.25; }
.is-mama-complete #mama-continue { grid-column:1/-1; order:0; background:#ffe098; color:#233d30; font-size:1.12rem; }
.is-mama-complete #restart-game { order:1; }
.is-mama-complete #game-menu { order:2; }
.is-mama-complete #game-song-link { order:3; }
.is-mama-complete #mama-spotify { order:4; background:#dcf8de; color:#15452b; }
.is-mama-complete .game-result-summary,.is-mama-complete .game-result-badges,.is-mama-complete .game-challenge-label,.is-mama-complete .game-message-star { display:none!important; }
.mama-stars { position:absolute; z-index:14; top:12px; left:12px; display:flex; align-items:center; gap:9px; padding:9px 14px; border:2px solid #edc76a; border-radius:16px; color:#28483c; background:#fff8deee; box-shadow:0 4px 14px #142e2725; pointer-events:none; font-variant-numeric:tabular-nums; }
.mama-stars[hidden],#mama-spotify[hidden] { display:none!important; }
.mama-stars>span:first-child { font-size:1.6rem; }
.mama-stars small { display:block; font-size:.875rem; font-weight:700; }
.mama-stars strong { display:block; font-size:1.1rem; line-height:1.1; }
.game-page-simple.is-mama-game .mama-camera-button { top:83px; left:12px; }
@media(max-width:600px) {
  .game-page-simple.is-mama-game .game-quick-controls { max-width:calc(100% - 160px); }
  .is-mama-complete .game-result-actions { grid-template-columns:1fr; }
  .game-page-simple.is-mama-complete .game-message-card>strong { font-size:1.65rem; }
}
.mama-thought::before,.mama-thought::after { content:""; position:absolute; border:2px solid #eed478; background:#fffef6; border-radius:50%; }
.mama-thought::before { width:13px; height:13px; bottom:-16px; left:42%; }
.mama-thought::after { width:7px; height:7px; bottom:-28px; left:47%; }
.mama-thought b { font-size:2.5rem; color:#b97c1c; }
.mama-thought-portrait { position:relative; width:72px; height:72px; overflow:hidden; border-radius:50%; }
.mama-thought-portrait img { width:100%!important; height:100%!important; object-fit:contain; }
.game-page-simple.is-mama-game .mama-move-controls { grid-template-columns:1fr 1fr; }
.game-page-simple.is-mama-game .mama-action-button { display:none!important; }
.game-page-simple #mama-character-strip { display: none !important; }
.mama-horn-button { display:none; }
.is-mama-game .mama-horn-button { display:inline-flex; }
.mama-recover-button { display:none; }
.is-mama-game .mama-recover-button { display:grid; }
.game-page-simple.is-mama-game .game-board-wrap { touch-action: none; }
@media(max-width:600px) {
  .game-page-simple.is-mama-game .mama-camera-button { top:83px; left:12px; }
  .game-page-simple.is-mama-game .game-quick-controls { gap: 5px; max-width:calc(100% - 160px); flex-wrap:wrap; justify-content:flex-end; }
  .game-page-simple.is-mama-game .game-icon-control { min-width:44px; min-height:44px; }
}
.game-page-simple.is-mama-game .mama-dialogue {
  bottom: 22px; top: auto; width: min(560px, 88%); padding: 16px 20px;
  border: 3px solid #f3cf62; border-radius: 23px; background: #fffdf5;
  color: #234745; box-shadow: 0 8px 25px #16352e35; pointer-events: none;
}
.game-page-simple.is-mama-game .mama-dialogue::before {
  content: ""; position: absolute; top: -15px; left: 27%; width: 24px; height: 24px;
  background: #fffdf5; border-left: 3px solid #f3cf62; border-top: 3px solid #f3cf62;
  transform: rotate(45deg);
}
.game-page-simple.is-mama-game .mama-dialogue[data-speaker="animal"]::before { left: 65%; }
.game-page-simple.is-mama-game .mama-dialogue small { font-size: .9rem; color: #536453; }
.game-page-simple.is-mama-game .mama-dialogue strong { font-size: clamp(1.05rem, 2.8vw, 1.6rem); line-height: 1.3; }
.game-page-simple.is-mama-game .mama-action-button.is-question { min-width: 100px; min-height: 64px; background: #fff0a2; color: #234745; }
.game-page-simple.is-mama-game .mama-control-hint { font-size: 1rem; line-height: 1.5; }
@media(max-width:600px) {
  .game-page-simple.is-mama-game .mama-dialogue { bottom: 12px; padding: 12px 14px; }
  .game-page-simple.is-mama-game .mama-dialogue small { font-size: .875rem; }
}
