@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600&family=Playfair+Display:wght@600;700&display=swap');

body {
  font-family: 'Inter', ui-sans-serif, system-ui, sans-serif;
}

/* Answer sheet bubbles */
.bubble input { position: absolute; opacity: 0; pointer-events: none; }
.bubble span {
  display: inline-flex; align-items: center; justify-content: center;
  width: 2.25rem; height: 2.25rem; border-radius: 9999px;
  border: 1.5px solid #a1afc7; font-weight: 600; font-size: 0.875rem;
  color: #425071; cursor: pointer; user-select: none;
  transition: background-color 0.1s, color 0.1s, border-color 0.1s;
}
.bubble:hover span { border-color: #175a80; }
.bubble input:checked + span { background: #141a2e; border-color: #141a2e; color: #fdfaf0; }
.bubble input:focus-visible + span { outline: 2px solid #2f8cc2; outline-offset: 2px; }