* { box-sizing: border-box; }
html, body { margin: 0; min-height: 100%; }
body {
  font-family: Inter, ui-rounded, "Noto Sans Thai", "Segoe UI", system-ui, -apple-system, sans-serif;
  color: var(--ink);
  background:
    radial-gradient(circle at 18% 18%, rgba(192, 235, 255, .55), transparent 24rem),
    radial-gradient(circle at 82% 12%, rgba(231, 218, 255, .9), transparent 28rem),
    linear-gradient(135deg, #fbfcff 0%, #f3f4ff 48%, #f7fbff 100%);
  overflow-x: hidden;
}
button { font: inherit; cursor: pointer; }
.ambient { position: fixed; inset: 0; overflow: hidden; pointer-events: none; z-index: -1; }
.orb { position: absolute; border-radius: 999px; filter: blur(24px); opacity: .65; animation: floaty 9s ease-in-out infinite; }
.orb-a { width: 34rem; height: 34rem; left: -10rem; top: 16rem; background: #d7f7ff; }
.orb-b { width: 30rem; height: 30rem; right: -10rem; top: 4rem; background: #e5dcff; animation-delay: -3s; }
.orb-c { width: 28rem; height: 28rem; left: 45%; bottom: -12rem; background: #fff0f7; animation-delay: -6s; }
@keyframes floaty { 50% { transform: translateY(22px) scale(1.04); } }