.scene-button {
  min-height: 3rem;
  min-width: 3rem;
  padding: .4rem .8rem;
  display: inline-flex;
  justify-content: center;
  align-items: center;
  gap: .4rem;
  border-radius: .9rem;
  font: inherit;
  font-weight: 800;
  background: #eadfff;
  color: #352459;
  box-shadow: inset 0 -3px #ccb8ea;
  cursor: pointer;
  transition: transform .14s ease, filter .14s ease;
}
.scene-button span { font-size: 1.35em; line-height: 1; }
.scene-button:hover:not(:disabled) { filter: brightness(1.07); }
.scene-button:active:not(:disabled) { transform: scale(.94); }
.scene-button:disabled { opacity: .45; cursor: default; }

.orbit-scene { width: min(100%, 880px); display: grid; justify-items: center; gap: .7rem; }
.orbit-sky {
  position: relative;
  isolation: isolate;
  overflow: hidden;
  width: 100%;
  display: grid;
  justify-items: center;
  gap: .35rem;
  padding: clamp(.6rem, 2vw, 1.4rem);
  border: 1px solid #8e7bd470;
  border-radius: 1.6rem;
  background:
    radial-gradient(circle at 7% 22%, #eaddff 0 1px, transparent 2px),
    radial-gradient(circle at 16% 69%, #ffe691 0 2px, transparent 3px),
    radial-gradient(circle at 89% 37%, #f8c4ec 0 2px, transparent 3px),
    radial-gradient(circle at 83% 75%, #eaddff 0 1px, transparent 2px),
    radial-gradient(ellipse at 44% 3%, #4c429c, #231543 77%);
}
.orbit-sky::before,
.orbit-sky::after {
  content: "";
  position: absolute;
  z-index: -1;
  pointer-events: none;
  aspect-ratio: 1;
  width: 20%;
  border-radius: 50%;
}
.orbit-sky::before {
  top: -35%; left: -1%;
  background: radial-gradient(circle at 65% 60%, #eaa4df, #926ace 69%);
  box-shadow: 0 0 2.3rem #cfa2ff70;
}
.orbit-sky::after {
  bottom: -35%; right: -2%;
  background: radial-gradient(circle at 30% 20%, #aca7ee, #5242a4 65%);
  box-shadow: 0 0 2.2rem #a499ef8c;
}
.orbit-scene .space-grid {
  position: relative;
  width: min(100%, 530px);
  padding: 0;
  gap: 0;
  border: 1px solid #b6a5f08f;
  border-radius: 1.1rem;
  overflow: hidden;
  background: #302557;
  box-shadow: 0 .35rem 1.5rem #160f36ab;
}
.orbit-scene .space-cell {
  position: relative;
  height: clamp(2.7rem, 7.3vw, 5rem);
  border: 1px solid #b09ae845;
  border-radius: 0;
  padding: 0;
  background: #382c63;
  transition: background .16s ease, box-shadow .16s ease;
}
.orbit-scene .space-cell:disabled { opacity: 1; cursor: default; }
.orbit-scene .space-cell:nth-of-type(even) { background: #403573; }
.orbit-scene .space-cell.passed { background: #454b87; }
.orbit-scene .space-cell.rock { background: #281f4a; }
.orbit-scene .space-cell.moon { background: #585584; }
.orbit-scene .space-cell.star { color: #ffe37a; }
.orbit-scene .space-cell.gone .space-terrain { opacity: 0; transform: scale(.45); }
.orbit-scene .space-cell.lit {
  background: #5955a0;
  box-shadow: inset 0 0 0 2px #baafff;
}
.orbit-scene .space-cell:not(:disabled) { cursor: pointer; }
.orbit-scene .space-cell:not(:disabled):hover { background: #7568bd; }
.orbit-scene .space-cell:not(:disabled):focus-visible { outline-offset: -4px; z-index: 1; }
.orbit-scene .space-cell.first-step .space-waypoint { animation: guide-tap .85s ease-in-out 3 alternate; }
@keyframes guide-tap { to { transform: scale(1.2); box-shadow: 0 0 .7rem #fff3aaad; } }
.orbit-scene .space-cell.ship { background: #504d88; animation: none; }
.space-terrain {
  line-height: 1;
  font-size: clamp(1.15rem, 4vw, 2.9rem);
  transition: opacity .2s ease, transform .2s ease;
}
.space-waypoint {
  position: absolute;
  bottom: .2rem;
  right: .2rem;
  display: grid;
  place-content: center;
  min-width: 1.28rem;
  min-height: 1.28rem;
  padding-inline: .2rem;
  border-radius: 999px;
  background: #ebe1ff;
  color: #3c2c69;
  font: inherit;
  font-weight: 900;
  font-size: clamp(.7rem, 1.45vw, .92rem);
}
.space-waypoint:empty { display: none; }
.orbit-scene .space-cell.lit .space-waypoint { background: #ffdc82; color: #3b2c43; }
.orbit-scene .space-rocket {
  position: absolute;
  top: 0;
  left: 0;
  width: calc(100% / var(--columns));
  height: calc(100% / var(--rows));
  display: grid;
  place-content: center;
  transform: translate(calc(var(--x, 0) * 100%), calc(var(--y, 0) * 100%));
  transition: transform .28s cubic-bezier(.23,.8,.45,1);
  pointer-events: none;
}
.rocket-sprite {
  display: block;
  position: relative;
  width: clamp(1.15rem, 2.7vw, 2rem);
  height: clamp(1.72rem, 4.1vw, 3.16rem);
  transform: rotate(34deg);
  filter: drop-shadow(0 0 .34rem #e7d8ffab);
}
.rocket-hull {
  position: absolute;
  inset: 0 14% 12%;
  border-radius: 70% 70% 28% 28%;
  background: linear-gradient(to bottom, #ff6d7c 0 32%, #fff7f1 34% 83%, #dfcdf7 85%);
  box-shadow: inset -.16rem 0 #a586c441;
}
.rocket-sprite::before, .rocket-sprite::after {
  content: "";
  position: absolute;
  bottom: 5%;
  width: 47%;
  height: 42%;
  border-radius: 90% 50% 40% 40%;
  background: #f56689;
}
.rocket-sprite::before { left: 0; transform: rotate(25deg); }
.rocket-sprite::after { right: 0; transform: rotate(-25deg); z-index: -1; }
.rocket-port {
  position: absolute;
  top: 36%;
  left: 30%;
  width: 40%;
  aspect-ratio: 1;
  border-radius: 50%;
  background: radial-gradient(circle at 34% 32%, #e3fbff 8%, #68dcf2 18% 62%, #8764c8 65%);
  border: 1px solid #a485db;
}
.rocket-tail {
  position: absolute;
  top: 81%;
  left: 34%;
  width: 33%;
  height: 34%;
  background: linear-gradient(#fff496, #ffb567 70%, #ee777f);
  border-radius: 35% 35% 80% 80%;
  transform-origin: center top;
}
.orbit-scene[data-phase="flight"] .rocket-tail { animation: thrust .14s ease-in-out 12 alternate; }
@keyframes thrust { to { transform: scaleY(.68); } }
.space-cargo { display: flex; justify-content: center; gap: .5rem; }
.space-cargo span { color: #a299bc; font-size: 1.22rem; }
.space-cargo .collected { color: #ffe284; animation: action-pop .36s ease-out; }
@keyframes action-pop { from { transform: scale(.68); } 65% { transform: scale(1.19); } }
.orbit-plan { display: grid; justify-items: center; gap: .4rem; width: 100%; }
.orbit-strip, .vault-display {
  display: flex;
  gap: .34rem;
  justify-content: center;
  max-width: 100%;
}
.space-slot, .vault-slot {
  min-width: clamp(1.7rem, 5vw, 2.9rem);
  height: clamp(1.8rem, 5vw, 3rem);
  border-radius: .55rem;
  border: 1px solid #beabe47d;
  display: grid;
  place-content: center;
  background: #251942;
  color: #d2c0ee;
  font-size: clamp(1.05rem, 3vw, 1.65rem);
  font-weight: 850;
}
.space-slot.set { background: #c6b6fb; color: #362557; }
.space-slot.flown { background: #98dfb7; color: #173e34; }
.orbit-panel, .orbit-arrows, .vault-keys, .garden-pictures, .lab-time {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  align-items: center;
  gap: .4rem;
}
.orbit-arrows .space-arrow b { display: none; }
.orbit-primary, .orbit-launch, .spy-finish, .spy-next, .vault-open, .vault-next,
.garden-reward, .garden-check, .garden-close, .lab-done {
  background: #ffdf88;
  color: #49375d;
  box-shadow: inset 0 -3px #dfb765;
}
.orbit-launch:disabled { box-shadow: none; }

.spy-table, .spy-lineup, .spy-console {
  width: min(100%, 775px);
  display: grid;
  justify-items: center;
  gap: .75rem;
  padding: clamp(.6rem, 2vw, 1.3rem);
  border: 1px solid #b39be17c;
  border-radius: 1.5rem;
  background: radial-gradient(ellipse at 50% 0%, #594781, #2f234f 77%);
  box-shadow: inset 0 0 0 .28rem #2b204854;
}
.spy-table .memory-grid {
  width: min(100%, 455px);
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: .68rem;
}
.spy-table .spy-card {
  min-height: clamp(4.2rem, 11vw, 7.25rem);
  border: 0;
  box-shadow: none;
  background: transparent;
  color: inherit;
  border-radius: .8rem;
  padding: 0;
  cursor: pointer;
  perspective: 760px;
}
.spy-table .spy-card:disabled { opacity: 1; cursor: default; }
.spy-card-inner {
  display: grid;
  position: relative;
  width: 100%;
  height: 100%;
  min-height: inherit;
  transform-style: preserve-3d;
  transition: transform .29s cubic-bezier(.2,.75,.35,1);
}
.spy-card.flipped .spy-card-inner { transform: rotateY(180deg); }
.spy-card-back, .spy-card-face {
  grid-area: 1 / 1;
  display: grid;
  place-content: center;
  border: 2px solid #a58edf;
  border-radius: .8rem;
  backface-visibility: hidden;
  font-size: clamp(1.9rem, 5.5vw, 3.7rem);
  font-weight: 950;
  line-height: 1;
}
.spy-card-back {
  background:
    radial-gradient(circle at center, #69529c 0 32%, transparent 33%),
    repeating-linear-gradient(45deg, #504080 0 13px, #564486 13px 26px);
  box-shadow: inset 0 -4px #352957;
  color: #edddff;
}
.spy-card-face {
  transform: rotateY(180deg);
  background: #f5e9ff;
  border-color: #fff4ff;
  box-shadow: inset 0 -4px #d6bbea;
  color: #5b3790;
}
.spy-card.matched .spy-card-face {
  background: #aee5bd;
  border-color: #ddfae3;
  box-shadow: inset 0 -4px #80bd9b;
  color: #195a47;
}
.spy-vault {
  display: flex;
  justify-content: center;
  gap: .4rem;
  align-items: center;
  color: #d0bbea;
}
.spy-vault > span { font-size: 1.45rem; color: #cba4ea; }
.spy-vault .agent-lock { display: flex; gap: .25rem; }
.spy-vault .agent-lock i { font-style: normal; color: #7e6c9c; }
.spy-vault .agent-lock .found { color: #ffdf88; animation: action-pop .36s ease-out; }
.spy-dossier { display: grid; justify-items: center; gap: .3rem; color: #f8e7ff; font-weight: 850; }
.spy-dossier > div {
  background: #392c58;
  border: 2px solid #ceb7f4;
  border-radius: 1rem;
  padding: .35rem 1.05rem;
  box-shadow: 0 0 .75rem #d1a2f642;
}
.spy-portrait {
  display: grid;
  justify-items: center;
  align-content: center;
  position: relative;
  border-radius: 44% 44% 36% 36%;
  min-width: clamp(2.45rem, 10vw, 4.55rem);
  min-height: clamp(3rem, 10vw, 5.75rem);
  background: #d7b9f2;
  color: #4d3466;
  box-shadow: inset 0 -.2rem #8f65be75;
}
.spy-rose { background: #ffc0d0; box-shadow: inset 0 -.2rem #c8789890; }
.spy-vert { background: #b0e6be; box-shadow: inset 0 -.2rem #77a98295; }
.spy-feature { display: block; line-height: .95; font-size: clamp(1.05rem, 3.5vw, 1.9rem); }
.spy-feature.feature-0 { margin-top: -.23rem; }
.spy-feature.feature-1 { font-size: clamp(.95rem, 3.2vw, 1.7rem); }
.spy-feature.feature-2 { font-size: clamp(.75rem, 2.6vw, 1.3rem); color: #60408a; }
.spy-suspects {
  width: min(100%, 550px);
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(64px, 1fr));
  justify-content: center;
  gap: .4rem;
}
.spy-suspect {
  padding: .32rem;
  display: grid;
  justify-items: center;
  gap: .26rem;
  border: 1px solid #c4a8ef72;
  border-radius: .78rem;
  min-width: 0;
  background: #4c3a73;
  color: #f0e1ff;
  cursor: pointer;
  transition: background .2s ease, opacity .2s ease, scale .2s ease;
}
.spy-suspect:active:not(:disabled) { scale: .95; }
.spy-suspect.scanned { opacity: .42; }
.spy-suspect.identified {
  background: #265b53;
  border-color: #b0efc3;
  box-shadow: 0 0 1rem #9cdec57a;
}
.spy-card-number { font-size: .95rem; }
.spy-console[data-phase="opened"] { border-color: #f7d47b; box-shadow: inset 0 0 2rem #f7d47b4f; }
.spy-example { display: flex; flex-wrap: wrap; gap: .42rem; justify-content: center; }
.spy-example .token { color: #372250; }
.vault-slot.set { background: #d2bbf6; color: #4b3271; }
.vault-key span { color: #62458c; }
.vault-key b { font-size: .82rem; }

.living-garden {
  position: relative;
  width: min(100%, 980px);
  isolation: isolate;
  overflow: hidden;
  border-radius: 1.35rem;
  border: 1px solid #a7db9b;
  background: #94cb55;
}
.living-garden img {
  display: block;
  width: 100%;
  height: clamp(10.3rem, 28vw, 19.8rem);
  object-fit: fill;
}
.living-garden .garden-soil {
  position: absolute;
  display: grid;
  place-content: center;
  left: 52%;
  top: 48.5%;
  width: 11%;
  height: 20%;
  transform: translate(-50%, -50%);
  background: radial-gradient(ellipse, #784321 35%, #734222 62%, #77432100 72%);
  font-size: clamp(.7rem, 2.55vw, 1.8rem);
}
.living-garden .garden-soil.wet { background: radial-gradient(ellipse, #543019 35%, #603719 59%, #78432100 72%); }
.living-garden .garden-grown {
  position: absolute;
  left: 51.6%;
  bottom: 51%;
  width: 1.6%;
  height: 18%;
  border-radius: 60% 60% 10% 10%;
  transform-origin: bottom center;
  background: linear-gradient(90deg, #318643, #9cd95c);
  transition: height .52s cubic-bezier(.18,.8,.32,1);
}
.living-garden .garden-grown.leafy { height: 30%; }
.living-garden .garden-grown.flower { height: 38%; }
.living-garden .garden-grown i {
  position: absolute;
  display: block;
  top: 35%;
  left: 50%;
  width: clamp(.7rem, 2.15vw, 1.75rem);
  height: clamp(.37rem, 1.15vw, .9rem);
  background: linear-gradient(170deg, #b4e85c, #4d9f37);
  border-radius: 0 75% 0 75%;
  transform: rotate(-35deg);
  transform-origin: left;
}
.living-garden .garden-grown i + i {
  top: 59%;
  left: auto;
  right: 55%;
  transform: rotate(35deg);
  transform-origin: right;
  border-radius: 75% 0 75% 0;
}
.living-garden .garden-grown b {
  display: none;
  position: absolute;
  bottom: 82%;
  left: 50%;
  transform: translateX(-50%);
  font-size: clamp(1.75rem, 5.3vw, 4rem);
  line-height: 1;
}
.living-garden .garden-grown.flower b { display: block; animation: flower-open .62s cubic-bezier(.18,.78,.24,1.2) both; }
@keyframes flower-open { from { scale: .3; opacity: .18; } }
.living-garden[data-age="1"] .garden-grown { animation: seedling .55s cubic-bezier(.22,.8,.3,1); }
@keyframes seedling { from { scale: .55 .22; } }
.garden-drops, .garden-sun {
  position: absolute;
  pointer-events: none;
  font-size: clamp(1rem, 3.4vw, 2.35rem);
  line-height: 1;
}
.garden-drops { left: 43%; top: 29%; animation: water-drops .8s ease-in both; }
@keyframes water-drops {
  from { transform: translateY(-62%); opacity: 0; }
  27% { opacity: 1; }
  to { transform: translateY(62%); opacity: 0; }
}
.garden-sun { top: 7%; right: 6%; filter: drop-shadow(0 0 .7rem #fff39c); }
.garden-night {
  position: absolute;
  inset: 0;
  pointer-events: none;
  background: #422973;
  opacity: 0;
  animation: garden-nightfall .66s ease-in-out;
}
@keyframes garden-nightfall { 45% { opacity: .48; } }
.garden-day, .garden-lab-day {
  padding: .3rem .62rem;
  border-radius: 999px;
  background: #255042;
  color: #fff7de;
  font-size: clamp(.76rem, 2vw, 1rem);
  font-weight: 850;
}
.garden-day { position: absolute; left: 4%; bottom: 8%; }
.garden-object {
  position: absolute;
  display: grid;
  place-content: center;
  width: clamp(2.8rem, 6vw, 4.65rem);
  height: clamp(2.8rem, 6vw, 4.65rem);
  transform: translate(-50%, -50%);
  border: 2px solid #f9f3d0;
  border-radius: 50%;
  background: #f8f0d6;
  color: #46385d;
  font-size: clamp(1.3rem, 3.65vw, 2.45rem);
  line-height: 1;
  box-shadow: 0 .18rem .6rem #44366060;
  cursor: pointer;
  transition: scale .18s ease;
}
.garden-object:active { scale: .92; }
.garden-object.guide-object { outline: 3px solid #ffe587; outline-offset: 3px; animation: garden-guide .8s ease-in-out 3 alternate; }
@keyframes garden-guide { to { outline-offset: 6px; } }
.garden-object.object-dig { left: 51.8%; top: 48%; }
.garden-object.object-seed { left: 72%; top: 65%; }
.garden-object.object-water { left: 79%; top: 64%; background: #d7f4ff; }
.garden-object.object-sun { left: 68%; top: 21%; background: #fff1b5; }
.garden-object.object-night { left: 88%; top: 21%; background: #eee1fb; }
.garden-reward { position: absolute; bottom: 8%; right: 5%; }

.living-book, .living-lab {
  width: min(100%, 680px);
  display: grid;
  justify-items: center;
  gap: .6rem;
  padding: clamp(.68rem, 2vw, 1.25rem);
  background: radial-gradient(ellipse at top, #4c7151, #284b3b 78%);
  border: 1px solid #a1cd91b0;
  border-radius: 1.25rem;
}
.garden-film {
  display: grid;
  grid-template-columns: repeat(4, minmax(0,1fr));
  width: min(100%, 390px);
  gap: .42rem;
}
.garden-frame {
  min-width: 0;
  min-height: clamp(3.2rem, 9vw, 5rem);
  background: #305444;
  border: 2px dashed #a1c395bd;
  border-radius: .66rem;
  color: #eff9da;
  display: grid;
  grid-template-rows: auto 1fr;
  justify-items: center;
  align-items: center;
}
.garden-frame small { padding-top: .17rem; font-weight: 800; }
.garden-frame b { font-size: clamp(1.1rem, 3.6vw, 2.15rem); line-height: 1; }
.garden-frame.placed { background: #d9edba; color: #355045; border: 2px solid #e4f0c8; }
.garden-picture {
  background: #e8f3c8;
  color: #3a5540;
  box-shadow: inset 0 -3px #b8d896;
}
.living-lab .two-pots { width: min(100%, 460px); }
.living-lab .pot-choice {
  position: relative;
  padding: .54rem .27rem;
  min-height: clamp(6rem, 14vw, 9.8rem);
  background: #427159;
  color: #fff8dd;
  border: 1px solid #9bc18d;
  display: grid;
  grid-template-rows: .55fr 1fr auto auto;
  align-items: center;
  justify-items: center;
  gap: .1rem;
  cursor: pointer;
  transition: background .23s ease;
}
.living-lab .pot-choice:disabled { opacity: 1; cursor: default; }
.living-lab .pot-choice.watered { background: #306764; }
.living-lab .pot-choice b, .living-lab .pot-choice small { font-size: clamp(.74rem, 1.85vw, 1rem); }
.living-lab .pot-choice .garden-lab-plant { font-size: clamp(1.15rem, 3.9vw, 2.25rem); }
.living-lab .pot-choice.sprouted .garden-lab-plant { animation: seedling .55s ease-out; }
.garden-lab-pot {
  width: clamp(2.1rem, 6vw, 3.8rem);
  height: clamp(1.3rem, 4.4vw, 2.8rem);
  border-top: .25rem solid #ffa16c;
  border-radius: 12% 12% 30% 30%;
  background: linear-gradient(110deg, #b95236, #e7804c 68%);
  box-shadow: inset 0 .1rem .3rem #8d422e;
}

@media (max-width: 520px) {
  .scene-button { min-height: 2.7rem; padding: .35rem .56rem; }
  .orbit-panel, .orbit-arrows, .vault-keys { gap: .26rem; }
  .space-slot, .vault-slot { min-width: clamp(1.45rem, 7vw, 2rem); }
  .spy-suspects { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .living-garden img { height: clamp(10.9rem, 42vw, 12rem); }
}
@media (prefers-reduced-motion: reduce) {
  .orbit-scene *, .spy-table *, .spy-console *, .living-garden *, .living-lab * {
    transition: none !important;
    animation: none !important;
  }
}

.flight-workshop .workshop-map {
  background: #1c1b3b;
}
.flight-workshop .workshop-cell.passed {
  background: #306b83;
  box-shadow: inset 0 0 0 1px #68c6bd;
}
.flight-workshop .workshop-cell.workshop-focus,
.workshop-arrow.workshop-focus {
  z-index: 1;
  box-shadow: inset 0 0 0 3px #ffda90;
}
.workshop-pin {
  position: absolute;
  bottom: .22rem;
  right: .23rem;
  display: grid;
  place-items: center;
  min-width: 1.45rem;
  min-height: 1.45rem;
  border-radius: 50%;
  background: #ffe1a4;
  color: #352457;
  font-size: .88rem;
  font-weight: 900;
}
.workshop-pin:empty { display: none; }
.workshop-tools, .workshop-code, .workshop-score, .pattern-adjust {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: clamp(.32rem, 1vw, .64rem);
}
.workshop-score span { color: #b5a7c8; font-size: clamp(1.15rem, 2.8vw, 2.05rem); }
.workshop-score .collected { color: #ffde87; animation: action-pop .36s ease-out; }
.workshop-arrow {
  display: grid;
  place-items: center;
  gap: .13rem;
  min-width: clamp(2.48rem, 8vw, 4.15rem);
  min-height: 3rem;
  padding: .25rem .38rem;
  border: 1px solid #a897d9;
  border-radius: .68rem;
  color: #f0e4ff;
  background: #443879;
}
.workshop-arrow:not(:disabled) { cursor: pointer; }
.workshop-arrow small { font-size: .71rem; color: #dfcdfb; }
.workshop-arrow b { font-size: clamp(1.22rem, 3.5vw, 2.4rem); line-height: 1; }

.pattern-machine .pattern-columns {
  width: min(100%, 36rem);
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: clamp(.45rem, 2vw, 1.25rem);
}
.pattern-column {
  min-width: 0;
  display: grid;
  justify-items: center;
  gap: .5rem;
  border-radius: .95rem;
  padding: .55rem;
  background: #493568;
  border: 1px solid #be9eec7d;
}
.pattern-column + .pattern-column { background: #42506d; border-color: #9fcce67d; }
.pattern-model { width: 100%; display: grid; gap: .3rem; }
.pattern-example, .pattern-answer {
  min-height: 2rem;
  position: relative;
  display: grid;
  grid-template-columns: repeat(6, minmax(0, 1fr));
  align-items: center;
  gap: .1rem;
  border-radius: .45rem;
  padding: .22rem .38rem .22rem 1.55rem;
  color: #edcdff;
  background: #372953;
  font-size: clamp(.82rem, 2.25vw, 1.7rem);
  line-height: 1;
}
.pattern-column + .pattern-column .pattern-model > div { color: #bff3e5; background: #324260; }
.pattern-example::before, .pattern-answer::before {
  position: absolute;
  top: 50%;
  left: .45rem;
  translate: 0 -50%;
  color: #e4d2fb;
  font-size: .79rem;
  font-weight: 800;
}
.pattern-example:first-child::before { content: "1"; }
.pattern-example:nth-child(2)::before { content: "2"; }
.pattern-answer::before { content: "3"; }
.pattern-model .pattern-answer {
  border: 1px solid #f5d98c;
  box-shadow: inset 0 0 0 1px #f5d98c;
}
.pattern-adjust .scene-button { min-width: 2.65rem; min-height: 2.7rem; }
.pattern-adjust .scene-button b { display: none; }

.plant-diagnostic {
  width: min(100%, 39rem);
  display: grid;
  justify-items: center;
  gap: .72rem;
  padding: clamp(.65rem, 2vw, 1.15rem);
  border-radius: 1.35rem;
  background: #285b50;
  border: 1px solid #bce2a998;
}
.plant-exhibit {
  position: relative;
  width: min(100%, 30rem);
  min-height: clamp(6.5rem, 17vw, 12.5rem);
  display: grid;
  align-content: center;
  justify-items: center;
  border-radius: .95rem;
  background: radial-gradient(ellipse at 72% 15%, #f6ecac 0%, #a9d99c 45%, #629e85 100%);
  transition: background .25s ease;
}
.plant-in-shadow .plant-exhibit {
  background: radial-gradient(ellipse at 72% 15%, #9bb9cb 0%, #82acac 48%, #5c8d84 100%);
}
.plant-weather { position: absolute; top: .5rem; right: .65rem; font-size: clamp(1.2rem, 3.2vw, 2.05rem); }
.plant-day {
  position: absolute;
  left: .5rem;
  bottom: .5rem;
  border-radius: 999px;
  padding: .3rem .58rem;
  background: #325e4d;
  color: #faf2d9;
  font-size: .86rem;
}
.plant-flower { display: grid; place-items: center; gap: .06rem; }
.plant-flower span {
  display: block;
  font-size: clamp(2.1rem, 7vw, 5.35rem);
  transform-origin: 60% 90%;
  transition: transform .32s ease;
  line-height: 1;
}
.plant-thirsty .plant-flower span { transform: rotate(-23deg); }
.plant-readings { display: flex; flex-wrap: wrap; justify-content: center; gap: .44rem; }
.plant-reading {
  display: inline-flex;
  align-items: center;
  gap: .37rem;
  min-height: 2rem;
  padding: .27rem .56rem;
  border: 1px solid #abd29a;
  border-radius: 999px;
  color: #244a38;
  background: #d8efd0;
  font-size: .9rem;
}
.plant-reading i { font-style: normal; }
.plant-reading.needs-care { border-color: #f1c87b; background: #ffe2a7; color: #664217; }

@media (prefers-reduced-motion: reduce) {
  .workshop-score .collected, .plant-flower span { animation: none; transition: none; }
}