/* Lost Constellation finale. Raster alien atlases and generated panoramic sky. */
.alien-party-level { z-index: 120; background: #f5f0e4; color: #253540; overscroll-behavior: contain; font-family: "Nunito", sans-serif; }
.alien-party-shell { width: min(1180px, calc(100% - 48px)); margin: 20px auto 36px; }
.alien-party-header { display: flex; align-items: center; justify-content: space-between; gap: 16px; }
.alien-party-header button { min-height: 46px; padding: 10px 16px; border: 1px solid #d3d6cd; border-radius: 14px; background: #fffdf4; color: #30484b; font: inherit; font-size: .85rem; font-weight: 900; cursor: pointer; }
.alien-party-chapter { display: flex; align-items: center; gap: 14px; font-size: .65rem; font-weight: 1000; letter-spacing: .16em; color: #647b76; }
.alien-party-chapter > span { padding: 7px 10px; border-radius: 6px; background: #e3e9d9; color: #59744d; letter-spacing: .08em; }
.alien-party-heading { display: flex; align-items: center; justify-content: space-between; gap: 20px; margin: 24px 0 20px; }
.alien-party-heading p { margin: 0 0 6px; font-size: .7rem; letter-spacing: .16em; font-weight: 1000; color: #ba7654; }
.alien-party-heading h1 { margin: 0; font-family: "Fraunces", Georgia, serif; font-size: clamp(2.1rem, 4.2vw, 3.7rem); font-weight: 700; line-height: 1.06; letter-spacing: -.045em; color: #244c4e; }
.alien-party-chapters { display: flex; gap: 20px; flex-shrink: 0; margin: 0; padding: 0; list-style: none; }
.alien-party-chapters li { display: grid; justify-items: center; gap: 6px; color: #8a9187; font-size: .7rem; font-weight: 900; }
.alien-party-chapters i { display: grid; place-items: center; width: 30px; height: 30px; border: 1px solid #d5d8ce; border-radius: 50%; background: #faf7ee; font-style: normal; }
.alien-party-chapters .is-current { color: #276d62; }
.alien-party-chapters .is-current i { color: #fff; background: #3f8a7c; border-color: #3f8a7c; box-shadow: 0 0 0 4px #dce8da; }
.alien-party-chapters .is-done i { background: #dfebc6; border-color: #b9d286; color: #526c35; }
.alien-party-stage { position: relative; height: clamp(320px, 32vw, 420px); overflow: hidden; border-radius: 30px; isolation: isolate; background: #254951; box-shadow: 0 12px 36px #34534a1a; }
.alien-party-sky { position: absolute; z-index: -4; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: center 62%; filter: saturate(.95); }
.alien-party-stage-shade { position: absolute; z-index: -3; inset: 0; background: linear-gradient(180deg, #193c5540, #19494c00 42%, #234f4775); }
.alien-party-moon { position: absolute; z-index: -2; right: 13%; top: 12%; width: 48px; height: 48px; border-radius: 50%; background: #fff6cbbb; box-shadow: 0 0 45px #fff4a370; }
.alien-party-stage-caption { position: absolute; top: 18px; left: 20px; max-width: calc(100% - 40px); padding: 9px 15px; border-radius: 99px; background: #ffffe7e8; box-shadow: 0 3px 0 #234b4c19; color: #325c53; font-size: .82rem; font-weight: 900; text-align: center; }
.alien-party-floor { position: absolute; z-index: -1; left: 9%; bottom: -14%; width: 82%; height: 42%; border: 2px solid #ffe99855; border-radius: 50%; background: radial-gradient(ellipse at 50% 35%, #ffefba5c, #699b6661 45%, #326055a6 80%); box-shadow: 0 -10px 70px #dae89f2b, inset 0 5px 12px #fffbce30; }
.alien-party-band { position: absolute; inset: auto 16% 27px; display: flex; align-items: end; justify-content: space-between; }
.alien-party-friend { position: relative; width: clamp(98px, 15vw, 160px); flex-shrink: 0; transform-origin: 50% 95%; }
.alien-party-friend:nth-child(2) { margin-bottom: -3px; animation-delay: -.12s; }
.alien-party-friend:nth-child(3) { animation-delay: -.24s; }
.alien-party-sprite { position: relative; width: 100%; aspect-ratio: 300 / 416; overflow: hidden; filter: drop-shadow(0 8px 8px #1e3d4366); }
.alien-party-atlas { position: absolute; width: 682.667% !important; max-width: none !important; height: auto !important; left: calc(-35.333% - var(--alien-col) * 170.667%); top: calc(-23.077% - var(--alien-row) * 123.077%); pointer-events: none; user-select: none; }
.alien-party-shadow { position: absolute; bottom: 15px; left: 5%; width: 90%; height: 20px; border-radius: 50%; background: #193e3b4d; filter: blur(5px); }
.alien-party-name { position: absolute; bottom: -12px; left: 50%; transform: translateX(-50%); padding: 5px 14px; border-radius: 12px; background: #fffdebeb; color: #32504c; box-shadow: 0 3px 0 #1d383c33; font-size: .75rem; font-weight: 1000; }
.alien-party-friend.is-active .alien-party-sprite { filter: drop-shadow(0 0 16px var(--friend-color)); }
.alien-party-friend.is-active .alien-party-name { background: var(--friend-color); }
.alien-party-friend.is-dancing.dance-bounce { animation: alien-party-bounce .8s ease-in-out infinite; }
.alien-party-friend.is-dancing.dance-wiggle { animation: alien-party-wiggle .6s ease-in-out infinite; }
.alien-party-friend.is-dancing.dance-float { animation: alien-party-float 1.8s ease-in-out infinite; }
.alien-party-lanterns { position: absolute; inset: 0; z-index: -1; pointer-events: none; }
.alien-party-lanterns i { position: absolute; left: var(--lantern-x); bottom: 9%; width: 11px; height: 14px; border-radius: 40% 40% 50% 50%; background: #ffefb6; box-shadow: 0 0 16px 5px #ffe39966; animation: alien-party-lantern 5s var(--lantern-delay) ease-in-out infinite; }
.alien-party-lanterns i:nth-child(2n) { bottom: 28%; width: 7px; height: 10px; opacity: .75; }
.alien-party-note-burst { position: absolute; inset: 0; pointer-events: none; }
.alien-party-note-burst i { position: absolute; bottom: 16%; left: 50%; width: 14px; height: 14px; border-radius: 50%; border: 2px solid #fffbe4; background: var(--beat-color); box-shadow: 0 0 22px var(--beat-color); animation: alien-party-note .6s ease-out both; }
.alien-party-note-burst i:nth-child(2) { left: 29%; animation-delay: .04s; }
.alien-party-note-burst i:nth-child(3) { left: 72%; animation-delay: .08s; }
.alien-party-constellation { position: absolute; width: 220px; height: 220px; left: 50%; top: -39px; transform: translateX(-50%); transition: filter 1s; }
.alien-party-star { position: absolute; width: 9px; height: 9px; border-radius: 50%; background: #ffffff22; box-shadow: 0 0 0 3px #ffffff0d; transform: translate(-50%, -50%); transition: background .35s, box-shadow .35s; }
.alien-party-star.is-lit { background: #fff9cc; box-shadow: 0 0 0 4px #fff7aa38, 0 0 24px 8px #fff3a576; animation: alien-party-star-pop .8s var(--star-delay) both; }
.alien-party-star-thread { position: absolute; display: block; height: 2px; transform-origin: 0 50%; background: #fff4b100; transition: background .5s, box-shadow .5s; }
.alien-party-star-thread.is-lit { background: #fff4b1b8; box-shadow: 0 0 9px #fff4b1; }
.alien-party-constellation.is-home { filter: drop-shadow(0 0 20px #fff6b899); }
.phase-complete .alien-party-stage { background: #5e7b70; }
.phase-complete .alien-party-stage-shade { background: linear-gradient(180deg, #e0b6d23b, #eddb9c30); }
.phase-complete .alien-party-constellation { animation: alien-party-sky-breathe 3s ease-in-out infinite; }
.alien-party-playboard { position: relative; margin: -1px 20px 0; padding: 18px 26px 24px; border: 1px solid #dfdfcf; border-top: 0; border-radius: 0 0 26px 26px; background: #fffdf4; box-shadow: 0 16px 30px #5267440a; }
.alien-party-message { min-height: 28px; margin: 0 auto 16px; text-align: center; font-size: clamp(.95rem, 1.5vw, 1.1rem); font-weight: 800; line-height: 1.45; color: #365853; }
.alien-party-story-start { display: flex; justify-content: center; align-items: center; gap: 26px; }
.alien-party-story-start p { max-width: 44ch; margin: 0; color: #738378; line-height: 1.45; font-size: .92rem; }
.alien-party-greeting { display: flex; justify-content: center; align-items: center; gap: 14px; margin: -3px 0 13px; }
.alien-party-greeting span { display: flex; align-items: center; gap: 7px; padding: 5px 12px; border: 1px solid #e1e4d8; border-radius: 99px; color: #8a9787; font-size: .76rem; font-weight: 900; }
.alien-party-greeting i { width: 10px; height: 10px; border: 1px solid #cbd1c6; border-radius: 50%; }
.alien-party-greeting .is-next { color: #326556; border-color: #8cb998; background: #f1f7df; }
.alien-party-greeting .is-done i { background: var(--friend-color); border-color: #7ca47c; }
.alien-party-greeting .is-done { color: #426355; }
.alien-party-pads { display: grid; grid-template-columns: repeat(3, 1fr); gap: 14px; max-width: 750px; margin: 0 auto; }
.alien-party-pads button { position: relative; min-height: 95px; padding: 11px 17px 12px 72px; display: flex; flex-direction: column; align-items: flex-start; justify-content: center; gap: 2px; border: 2px solid color-mix(in srgb, var(--friend-color) 75%, #a6b8a0); border-radius: 20px; background: color-mix(in srgb, var(--friend-color) 35%, #fffced); color: #284d4b; box-shadow: 0 5px 0 color-mix(in srgb, var(--friend-color) 65%, #a5bca6); font: inherit; cursor: pointer; touch-action: manipulation; transition: transform .15s, box-shadow .15s, filter .15s; }
.alien-party-pads button strong { font-size: 1.45rem; line-height: 1.1; font-weight: 1000; }
.alien-party-pads button > span:last-child { font-size: .73rem; font-weight: 800; }
.alien-party-pads kbd { position: absolute; right: 12px; bottom: 10px; width: 21px; height: 21px; display: grid; place-items: center; border: 1px solid #31584722; border-radius: 6px; color: #476758; background: #ffffec55; font: inherit; font-size: .66rem; }
.alien-party-pads button:disabled { cursor: default; opacity: .6; }
.alien-party-pads button.is-playing { transform: translateY(4px); box-shadow: 0 1px 0 #8fa89a, 0 0 24px color-mix(in srgb, var(--friend-color) 70%, transparent); filter: saturate(1.3); }
.alien-party-pads button.is-cued { outline: 3px solid #fff; outline-offset: -6px; }
.alien-party-pad-mark { position: absolute; left: 22px; top: 27px; width: 31px; height: 33px; display: flex; align-items: center; justify-content: center; gap: 4px; }
.alien-party-pad-mark i { width: 5px; height: 24px; background: #38675b; border-radius: 99px; }
.alien-party-pad-mark i:nth-child(2) { height: 34px; }
.mark-wave i { transform: rotate(-18deg); }
.mark-hop i:first-child { transform: rotate(40deg) translate(4px, 0); height: 23px; }
.mark-hop i:nth-child(2) { transform: rotate(-40deg) translate(-4px, 0); height: 23px; }
.mark-hop i:last-child, .mark-clap i:last-child { display: none; }
.mark-clap i { height: 24px; transform: rotate(25deg); }
.mark-clap i:nth-child(2) { transform: rotate(-25deg); height: 24px; }
.alien-party-remix-tools { display: flex; align-items: center; justify-content: space-between; gap: 14px; margin-bottom: 14px; }
.alien-party-choices { display: flex; gap: 5px; padding: 4px; border-radius: 13px; background: #f0f1e7; }
.alien-party-choices button { min-height: 44px; border: 1px solid transparent; border-radius: 10px; background: transparent; color: #6d7d70; padding: 6px 12px; font: inherit; font-size: .73rem; font-weight: 900; cursor: pointer; }
.alien-party-choices button[aria-pressed="true"] { color: #356d5e; border-color: #cbdbc8; background: #fffef5; box-shadow: 0 2px 3px #7888670f; }
.alien-party-tape { display: flex; justify-content: center; gap: 7px; margin: 19px 0 0; }
.alien-party-tape span { display: grid; place-items: center; width: 35px; height: 35px; border: 1px dashed #d1d6c9; border-radius: 8px; color: #b6bba8; background: #f7f7ec; font-size: .85rem; font-weight: 1000; transition: transform .12s; }
.alien-party-tape .is-filled { background: var(--friend-color); color: #3f6556; border: 1px solid #698d642b; }
.alien-party-tape .is-playing { transform: translateY(-5px); box-shadow: 0 4px 0 #52665222; outline: 2px solid #527264; }
.alien-party-actions { display: flex; justify-content: center; align-items: center; gap: 12px; margin-top: 17px; }
.alien-party-actions:empty { display: none; }
.alien-party-primary, .alien-party-secondary { min-height: 51px; border: 1px solid #d3dec9; border-radius: 14px; padding: 12px 21px; font: inherit; font-weight: 900; font-size: .87rem; cursor: pointer; touch-action: manipulation; }
.alien-party-primary { border-color: #32675d; color: #fffdf1; background: #3b806e; box-shadow: 0 4px 0 #2c5d50; }
.alien-party-secondary { color: #47785e; background: #eef4e3; box-shadow: 0 3px 0 #d9e5cd; }
.alien-party-primary:disabled, .alien-party-secondary:disabled { color: #94a18e; background: #eaf0e1; border-color: #d6dfcd; box-shadow: 0 3px 0 #dce3d4; cursor: default; }
.alien-party-level button:focus-visible { outline: 3px solid #b26430; outline-offset: 4px; }
.alien-party-level button:not(:disabled):hover { filter: brightness(1.04); }
.alien-party-launch-star { display: flex; align-items: center; gap: 18px; min-height: 80px; padding: 12px 30px; background: #3d7a64; font-size: 1.15rem; }
.alien-party-launch-star > span:last-child { padding: 7px 11px; border-radius: 10px; background: #235c484a; font-size: .78rem; }
.alien-party-launch-spark { width: 20px; height: 20px; background: #fff1aa; border-radius: 50%; box-shadow: 0 0 15px #ffeaae; }
body:has(.app[data-active-game="alienLanguage"] .game-finish-fireworks) .alien-party-shell { visibility: hidden; pointer-events: none; }
@keyframes alien-party-bounce { 0%, 100% { transform: translateY(0) rotate(-2deg); } 50% { transform: translateY(-13px) rotate(2deg); } }
@keyframes alien-party-wiggle { 0%, 100% { transform: rotate(-6deg); } 50% { transform: rotate(6deg) scale(1.04, .97); } }
@keyframes alien-party-float { 0%, 100% { transform: translateY(0) rotate(-3deg); } 50% { transform: translateY(-25px) rotate(3deg); } }
@keyframes alien-party-lantern { 0%, 100% { transform: translateY(0); opacity: .5; } 50% { transform: translateY(-20px); opacity: 1; } }
@keyframes alien-party-note { from { transform: translateY(0) scale(.6); opacity: 1; } to { transform: translateY(-180px) scale(1.6); opacity: 0; } }
@keyframes alien-party-star-pop { 0% { transform: translate(-50%, -50%) scale(.2); } 60% { transform: translate(-50%, -50%) scale(1.6); } 100% { transform: translate(-50%, -50%) scale(1); } }
@keyframes alien-party-sky-breathe { 50% { filter: drop-shadow(0 0 32px #fff6b8); } }
@media (max-width: 850px) {
  .alien-party-shell { width: calc(100% - 30px); margin-top: 14px; }
  .alien-party-chapter { gap: 8px; letter-spacing: .08em; }.alien-party-chapter > span { display: none; }
  .alien-party-heading { margin: 22px 0 16px; gap: 15px; }.alien-party-heading h1 { font-size: 2.5rem; }
  .alien-party-chapters { gap: 13px; }.alien-party-stage { height: 330px; }.alien-party-band { inset-inline: 13%; }
  .alien-party-playboard { margin-inline: 10px; padding: 18px 18px 22px; }.alien-party-remix-tools { justify-content: center; flex-wrap: wrap; gap: 7px; }
  .alien-party-pads button { padding-left: 59px; }.alien-party-pad-mark { left: 16px; }
}
@media (max-width: 560px) {
  .alien-party-shell { width: calc(100% - 20px); margin: 10px auto 24px; }.alien-party-header { gap: 6px; }
  .alien-party-header button { min-height: 44px; padding: 8px 11px; font-size: .72rem; border-radius: 11px; }.alien-party-chapter { display: none; }
  .alien-party-heading { margin: 20px 3px 13px; display: block; }.alien-party-heading p { font-size: .62rem; margin-bottom: 5px; }.alien-party-heading h1 { font-size: clamp(1.85rem, 7.8vw, 2.55rem); }
  .alien-party-chapters { justify-content: flex-start; gap: 17px; margin-top: 15px; }.alien-party-chapters li { display: flex; gap: 7px; font-size: .67rem; }.alien-party-chapters i { width: 25px; height: 25px; }
  .alien-party-stage { height: 280px; border-radius: 22px; }.alien-party-stage-caption { top: 12px; left: 12px; max-width: calc(100% - 24px); padding: 7px 10px; font-size: .7rem; }
  .alien-party-band { inset: auto 5% 28px; }.alien-party-friend { width: clamp(86px, 26vw, 120px); }.alien-party-name { font-size: .66rem; padding: 4px 10px; }
  .alien-party-constellation { width: 176px; height: 176px; top: -3px; }.alien-party-moon { width: 32px; height: 32px; top: 21%; right: 10%; }.alien-party-floor { bottom: -8%; left: -4%; width: 108%; }
  .alien-party-playboard { margin: 0 2px; padding: 14px 11px 20px; border-radius: 0 0 20px 20px; }.alien-party-message { min-height: 42px; font-size: .87rem; margin-bottom: 13px; }
  .alien-party-story-start { flex-direction: column; gap: 17px; }.alien-party-story-start p { text-align: center; font-size: .83rem; }.alien-party-story-start button { width: 100%; }
  .alien-party-pads { gap: 8px; }.alien-party-pads button { min-height: 108px; padding: 13px 4px 10px; align-items: center; gap: 5px; border-radius: 17px; }
  .alien-party-pad-mark { position: static; width: 25px; height: 29px; }.alien-party-pad-mark i { width: 4px; height: 19px; }.alien-party-pad-mark i:nth-child(2) { height: 27px; }
  .alien-party-pads button strong { font-size: 1.18rem; }.alien-party-pads button > span:last-child { font-size: .63rem; }.alien-party-pads kbd { display: none; }
  .alien-party-greeting { gap: 6px; }.alien-party-greeting span { padding: 5px 10px; font-size: .67rem; }
  .alien-party-remix-tools { display: grid; gap: 7px; }.alien-party-choices { justify-content: center; padding: 3px; }.alien-party-choices button { min-height: 44px; padding: 6px 10px; font-size: .68rem; }.tempo-choices button { min-width: 82px; }
  .alien-party-tape { gap: 5px; margin-top: 17px; }.alien-party-tape span { width: 29px; height: 29px; }
  .alien-party-actions { gap: 8px; flex-wrap: wrap; margin-top: 16px; }.alien-party-actions > button { flex: 1 1 auto; padding: 11px 12px; font-size: .78rem; }
  .alien-party-launch-star { flex-wrap: wrap; justify-content: center; gap: 11px; min-height: 78px; }.alien-party-launch-star > span:last-child { font-size: .7rem; }
  .phase-finale .alien-party-stage, .phase-complete .alien-party-stage { height: 315px; }.phase-finale .alien-party-constellation, .phase-complete .alien-party-constellation { top: -5px; width: 215px; height: 215px; }

  /* Keep the band and its playing pads together on a 390 x 844 phone.
     Compact surrounding space while retaining the same DOM and tab order. */
  .phase-remix .alien-party-heading { margin: 12px 3px 10px; }
  .phase-remix .alien-party-heading p { display: none; }
  .phase-remix .alien-party-heading h1 { font-size: clamp(1.7rem, 7.2vw, 2rem); }
  .phase-remix .alien-party-chapters { margin-top: 9px; }
  .phase-remix .alien-party-stage { height: 210px; }
  .phase-remix .alien-party-stage-caption { top: 9px; padding-block: 6px; }
  .phase-remix .alien-party-band { bottom: 23px; }
  .phase-remix .alien-party-playboard { padding: 12px 11px 18px; }
  .phase-remix .alien-party-message { min-height: 40px; margin-bottom: 10px; }
  .phase-remix .alien-party-remix-tools { gap: 6px; margin-bottom: 12px; }
  .phase-remix .alien-party-choices { padding: 0; background: transparent; }
  .phase-remix .alien-party-choices button { min-height: 44px; background: #f0f1e7; }
  .phase-remix .alien-party-choices button[aria-pressed="true"] { background: #fffef5; }
  .phase-remix .alien-party-pads button { min-height: 100px; padding-block: 9px; }
  .phase-remix .alien-party-tape { margin-top: 12px; }
  .phase-remix .alien-party-tape span { width: 27px; height: 27px; }
  .phase-remix .alien-party-actions { margin-top: 12px; }
}
@media (prefers-reduced-motion: reduce) { .alien-party-level *, .alien-party-level *::before, .alien-party-level *::after { animation: none !important; transition: none !important; }.alien-party-note-burst { display: none; } }
