.fx-sky-canvas{position:fixed;inset:0;width:100%;height:100%;z-index:0;pointer-events:none;display:block}

.fx-letter{display:inline-block;opacity:0;filter:blur(6px);transform:translateY(10px);animation:fxLetterIn var(--dur-2) var(--ease-out) forwards;animation-delay:calc(140ms + var(--i,0) * 38ms)}
@keyframes fxLetterIn{to{opacity:1;filter:blur(0);transform:none}}

.fx-split-wrap{word-break:keep-all;overflow-wrap:normal;hyphens:manual}
.fx-word{display:inline-block;white-space:nowrap}

h1[data-fx-split],h2[data-fx-split]{word-break:keep-all;overflow-wrap:normal;hyphens:manual}

.result-drawing-title,
.co-gen-title,
.co-preview-title{font-size:clamp(22px,6vw,30px)}

.quiz-card.is-selected::after,
.quiz-chip.is-selected::after{
  content:"";
  position:absolute;
  inset:0;
  border-radius:inherit;
  padding:1.5px;
  background:conic-gradient(from 0deg, transparent 0% 60%, var(--sky-gold) 80%, var(--gold-bright) 88%, var(--sky-gold) 94%, transparent 100%);
  -webkit-mask:linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
  -webkit-mask-composite:xor;
  mask-composite:exclude;
  pointer-events:none;
  z-index:1;
}
.quiz-chip{position:relative}

.fx-fade-in{opacity:0;animation:fxFadeIn .55s var(--ease-out) forwards}
@keyframes fxFadeIn{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}

.quiz-card{transition:transform .2s var(--ease)}
.quiz-card::before{content:"";position:absolute;inset:0;background:radial-gradient(circle at var(--mx,50%) var(--my,50%), rgba(209,177,105,.35), transparent 60%);mix-blend-mode:screen;pointer-events:none;z-index:1;opacity:0;transition:opacity .2s}
.quiz-card.fx-tilt-active::before{opacity:1}

.quiz-natal-wheel .qnw-ring-outer,
.quiz-natal-wheel .qnw-ring-inner,
.quiz-natal-wheel .qnw-sector{
  transform-box:fill-box;
  transform-origin:50% 50%;
}
.quiz-natal-wheel .qnw-dot{
  transform-box:fill-box;
  transform-origin:50% 50%;
}