/* These controls belong to the island, outside the falling-egg play area. */
.chick-mission-guest.chick-personalization { align-items: flex-start; justify-content: flex-start; gap: 14px; width: 650px; max-width: calc(100% - 24px); margin: 12px auto; padding: 14px; border: 1px solid #cbdcba; border-radius: 18px; background: #fffdf3ed; color: #355441; pointer-events: auto; }
.chick-personalization, .chick-personalization * { box-sizing: border-box; }
.chick-personalization-art-button { display: block; flex: 0 0 148px; align-self: center; min-width: 44px; min-height: 44px; max-width: 100%; margin: 0; padding: 4px; border: 2px solid transparent; border-radius: 16px; background: transparent; color: #355441; touch-action: manipulation; }
.chick-personalization-art-button .chick-mission-art { width: 136px; height: auto; max-width: 100%; margin: auto; fill: none; stroke: none; stroke-width: 0; }
.chick-personalization-art-button:hover:not(:disabled) { border-color: #b7cea2; background: #f2f7e7; }
.chick-personalization-art-button.is-greeting { border-color: #d4be75; }
.chick-personalization-details { flex: 1 1 0; min-width: 0; max-width: 100%; }
.chick-personalization-details h3 { margin: 0 0 5px; color: #355441; font-size: 16px; font-weight: 800; line-height: 1.3; overflow-wrap: anywhere; }
.chick-personalization .chick-mission-guest-label { display: block; max-width: 100%; margin: 0 0 4px; padding: 0; background: none; font-size: 12px; line-height: 1.4; }
.chick-personalization .chick-rescue-save-note { margin: 4px 0; font-size: 10px; text-align: start; line-height: 1.45; }
.chick-personalization-choices { display: flex; flex-wrap: wrap; gap: 6px; min-width: 0; margin: 11px 0 0; padding: 0; border: 0; }
.chick-personalization-choices legend { max-width: 100%; margin-bottom: 6px; padding: 0; color: #4b6748; font-size: 12px; font-weight: 750; line-height: 1.4; overflow-wrap: anywhere; }
.chick-personalization-choices button { display: flex; flex: 1 1 0; align-items: center; justify-content: center; gap: 5px; min-width: 44px; min-height: 44px; max-width: 100%; margin: 0; padding: 8px 7px; border: 1px solid #c5d6b6; border-radius: 10px; background: #f8faee; color: #355441; font-size: 12px; font-weight: 650; line-height: 1.25; text-align: center; overflow-wrap: anywhere; touch-action: manipulation; }
.chick-personalization-choices button:hover:not(:disabled) { border-color: #8da76f; background: #eef5dd; }
.chick-personalization-choices button[aria-pressed="true"] { border-color: #638553; background: #e5f1d4; box-shadow: inset 0 0 0 1px #638553; font-weight: 800; }
.chick-personalization-choices button[data-flower-color]::before { content: ''; display: block; flex: 0 0 13px; width: 13px; height: 13px; border: 1px solid #64764b; border-radius: 50%; }
.chick-personalization-choices button[data-flower-color="yellow"]::before { background: #f1cc68; }
.chick-personalization-choices button[data-flower-color="pink"]::before { background: #ed9eba; }
.chick-personalization-choices button[data-flower-color="purple"]::before { background: #b39ad8; }
.chick-personalization button:focus-visible { outline: 3px solid #2559a8; outline-offset: 2px; }
.chick-personalization button:disabled { cursor: default; }
.chick-personalization-hint, .chick-personalization-lock-note, .chick-personalization-save-note, .chick-personalization-greeting { max-width: 100%; margin: 8px 0 0; font-size: 11px; line-height: 1.45; text-align: start; overflow-wrap: anywhere; }
.chick-personalization-hint { color: #536c48; }
.chick-personalization-save-note { color: #6a775e; font-size: 10px; }
.chick-personalization-greeting { min-height: 16px; margin-top: 4px; color: #6a542f; font-weight: 750; }
.chick-personalization[hidden], .chick-personalization [hidden] { display: none !important; }
[dir="rtl"] .chick-personalization { direction: rtl; }
.chick-personalization-wing-left { transform-box: view-box; transform-origin: 76px 66px; }
.chick-personalization-wing-right { transform-box: view-box; transform-origin: 104px 66px; }
.chick-personalization-art-button.is-greeting .chick-personalization-wing-left { animation: chick-personalization-flap-left 720ms ease-in-out 1; }
.chick-personalization-art-button.is-greeting .chick-personalization-wing-right { animation: chick-personalization-flap-right 720ms ease-in-out 1; }
@keyframes chick-personalization-flap-left { 0%, 100% { transform: rotate(0deg); } 18%, 52%, 84% { transform: rotate(65deg); } 35%, 69% { transform: rotate(0deg); } }
@keyframes chick-personalization-flap-right { 0%, 100% { transform: rotate(0deg); } 18%, 52%, 84% { transform: rotate(-65deg); } 35%, 69% { transform: rotate(0deg); } }
@media (max-width: 550px) {
  .chick-mission-guest.chick-personalization { flex-direction: column; align-items: stretch; gap: 7px; max-width: calc(100% - 16px); padding: 11px; }
  .chick-personalization-art-button { flex: 0 0 auto; width: 126px; align-self: center; }
  .chick-personalization-art-button .chick-mission-art { width: 114px; }
  .chick-personalization-details h3 { font-size: 15px; }
  .chick-personalization-choices { gap: 5px; margin-top: 9px; }
  .chick-personalization-choices button { padding: 7px 4px; font-size: 11px; }
}
@media (orientation: landscape) and (max-height: 520px) {
  .chick-mission-guest.chick-personalization { padding: 10px; gap: 11px; }
  .chick-personalization-art-button { flex-basis: 126px; }
  .chick-personalization-art-button .chick-mission-art { width: 114px; }
}
@media (prefers-reduced-motion: reduce) {
  .chick-personalization, .chick-personalization * { animation: none !important; transition: none !important; }
}
