/* tasks/anket.css — the compatibility survey (js/tasks/anket.js), "Bu mu,
   şu mu?" on Sıfat Gezegeni. Evren's high-tech device is a small screen that
   counts questions on the way in and percent on the way out. */

.ank-room {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 26px;
  padding: 8px 0 36px;
}

.ank-device {
  padding: 8px 22px;
  border-radius: 12px;
  border: 1.5px solid rgba(116, 176, 255, 0.4);
  background: rgba(116, 176, 255, 0.07);
  box-shadow: 0 0 18px rgba(116, 176, 255, 0.12), inset 0 0 14px rgba(0, 0, 0, 0.3);
}

.ank-screen {
  font-family: 'DM Sans', sans-serif;
  font-size: 1.05rem;
  letter-spacing: 0.12em;
  color: #74B0FF;
  text-shadow: 0 0 10px rgba(116, 176, 255, 0.5);
  min-width: 64px;
  text-align: center;
}

.ank-device.ank-judging { animation: ankHum 0.6s ease infinite alternate; }
@keyframes ankHum {
  from { box-shadow: 0 0 14px rgba(116, 176, 255, 0.12), inset 0 0 14px rgba(0, 0, 0, 0.3); }
  to { box-shadow: 0 0 30px rgba(116, 176, 255, 0.35), inset 0 0 14px rgba(0, 0, 0, 0.3); }
}

.ank-device.ank-done { animation: none; }

/* The question, big and serif, the way Evren asks everything that matters. */
.ank-q {
  font-family: 'Playfair Display', serif;
  font-size: 1.5rem;
  line-height: 1.5;
  text-align: center;
  color: #F3EAD8;
  max-width: 620px;
  min-height: 2.2rem;
}

.ank-q.ank-in { animation: ankIn 0.45s ease; }
@keyframes ankIn {
  from { opacity: 0; transform: translateY(6px); }
  to { opacity: 1; transform: translateY(0); }
}

.ank-pills {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 14px;
  min-height: 52px;
}

.ank-verdict {
  font-family: 'Playfair Display', serif;
  font-size: 1.15rem;
  line-height: 1.7;
  text-align: center;
  color: #F3EAD8;
  max-width: 560px;
}

/* The way out is appended to the stage after the room, and it should stand
   where every other beat's answer pill stands: a clear breath below the
   text, not pressed against the verdict. */
.ank-room ~ .pill { margin-top: 64px; }