.you-page {
  display: flex;
  align-items: center;
  min-height: 100vh;
  padding-top: calc(var(--header-height) + var(--space-10));
  padding-bottom: var(--space-16);
  text-align: center;
}
.you-page__inner {
  display: flex;
  flex-direction: column;
  align-items: center;
  width: 100%;
}
.you-title {
  max-width: 18ch;
  font-size: var(--text-5xl);
  font-weight: var(--weight-bold);
  letter-spacing: var(--tracking-tight);
  line-height: var(--leading-tight);
}
.you-question[hidden],
.you-result[hidden] { display: none }
.you-stage {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: var(--space-4);
  width: 100%;
  min-height: clamp(280px, 46vh, 460px);
  margin-top: var(--space-10);
}
.you-stage .btn {
  justify-content: center;
  min-width: 120px;
}
.you-no {
  position: relative;
  z-index: 2;
  background: var(--color-surface);
  transition: transform 280ms cubic-bezier(0.22, 1, 0.36, 1);
  will-change: transform;
}
.you-no:hover { background: var(--color-surface) }
.you-result {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: var(--space-6);
  margin-top: var(--space-8);
  animation: you-reveal var(--duration-normal) var(--ease-out) both;
}
.you-gif {
  display: block;
  width: min(320px, 70vw);
  height: auto;
  border-radius: var(--radius-xl);
  box-shadow: var(--shadow-lg);
}
.you-verdict {
  font-size: var(--text-3xl);
  font-weight: var(--weight-bold);
  letter-spacing: var(--tracking-wide);
  line-height: var(--leading-tight);
}
.you-again { margin-top: var(--space-2) }
@keyframes you-reveal {
  from { opacity: 0; transform: translateY(12px) }
  to { opacity: 1; transform: none }
}
@media (prefers-reduced-motion: reduce) {
  .you-no { transition: none }
  .you-result { animation: none }
}
@media (max-width: 640px) {
  .you-page {
    min-height: 100vh;
    padding-top: calc(var(--header-height) + var(--space-8));
    padding-bottom: var(--space-10);
  }
  .you-stage {
    min-height: 200px;
    gap: var(--space-3);
    margin-top: var(--space-8);
  }
  .you-stage .btn { min-width: 104px }
  .you-verdict { font-size: var(--text-2xl) }
}
