/* Shape Vision: only the additions on top of number.css (shapes in the question row and the answer tiles). */
.nsg .qrow{left:40%; right:4%; top:22px; height:58%; justify-content:center}
.nsg .qpic{height:100%; width:auto; aspect-ratio:1/1; max-width:100%; display:grid; place-items:center; border-radius:50%; background:radial-gradient(circle at 50% 45%, rgba(255,255,255,.12), rgba(255,255,255,.02) 70%)}
.nsg .qpic svg{width:100%; height:100%; filter:drop-shadow(0 6px 10px rgba(0,0,0,.35)); display:block}
.nsg .qpic.ask{font-family:var(--display); font-size:clamp(3rem,12vw,5rem); line-height:1; color:var(--yellow); background:var(--night-3); text-shadow:0 0 18px rgba(255,227,77,.45)}
.nsg .field{display:grid; grid-template-columns:repeat(3,1fr); gap:6px; height:100%; aspect-ratio:1/1; max-width:100%; padding:8px; box-sizing:border-box; background:rgba(255,255,255,.04); border-radius:18px; align-content:center}
.nsg .field.many{grid-template-columns:repeat(4,1fr)}
.nsg .fi svg{width:100%; height:auto; display:block}
.nsg .choice.shape{aspect-ratio:1/1; min-height:0; padding:8px; font-size:inherit; background:#1b0d3b}
.nsg .choice.shape svg{width:100%; height:100%; max-height:118px; display:block}
.nsg .choice.num .word{font-family:var(--display); font-size:2.8rem; line-height:1}
@media (max-width:480px){
  .nsg .qrow{left:38%; top:14px}
  .nsg .choice.num .word{font-size:2.3rem}
}
/* mirror and symmetry rounds: a rounded square instead of a circle behind the picture */
.nsg .qpic.sym{border-radius:24px}