/* bs.css — тема страниц Bubble Shooter. Подключается ПОСЛЕ base.css.
   Направление: вечерняя аркада — глубокий фиолет, глянцевые леденцовые пузыри,
   мягкие световые пятна. Никакого неба AW и латуни Ship War: у каждой игры
   своя тема (см. site/README.md). */

@import url('https://fonts.googleapis.com/css2?family=Baloo+2:wght@600;700&display=swap');

:root {
  --bg: #f3effc;                 /* светлая лаванда */
  --surface: #ffffff;
  --line: rgba(66, 45, 130, 0.16);
  --text: #241d54;
  --muted: #544a86;
  --dim: #8c83b8;
  --accent: #8b5cf6;             /* фиолетовый пузырь */
  --accent2: #ec4899;            /* розовый градиентный хвост */
  --on-accent: #ffffff;

  --display: 'Baloo 2', 'Trebuchet MS', sans-serif;
}

body {
  background-image: linear-gradient(180deg, #e6ddfa 0%, #f3effc 45%, #faf7ff 100%);
  background-repeat: no-repeat;
}

/* мягкие «пузыри» света на фоне */
body::before {
  content: '';
  position: fixed;
  inset: 0;
  pointer-events: none;
  z-index: 0;
  background:
    radial-gradient(circle at 12% 18%, rgba(139, 92, 246, 0.10) 0, transparent 240px),
    radial-gradient(circle at 88% 30%, rgba(236, 72, 153, 0.08) 0, transparent 280px),
    radial-gradient(circle at 70% 80%, rgba(56, 189, 248, 0.08) 0, transparent 260px);
}

h1, h2 { font-weight: 700; }
h1 { letter-spacing: -0.01em; }

.brand { font-family: var(--body); font-weight: 800; }
.top nav a { font-weight: 600; }

.btn {
  border-radius: 999px;
  background: linear-gradient(135deg, var(--accent), var(--accent2));
  box-shadow: 0 8px 22px -8px rgba(139, 92, 246, 0.6);
}
.btn.ghost { background: none; box-shadow: none; }
.btn[aria-disabled='true'] { box-shadow: none; }

footer { border-top-color: var(--line); }
footer a { color: var(--muted); }
footer .req { color: var(--dim); }

hr.rule {
  background: none;
  border: none;
  height: 14px;
  margin: 66px 0 40px;
  /* пунктир прицельной траектории */
  background-image: radial-gradient(circle, rgba(139, 92, 246, 0.4) 3px, transparent 3.5px);
  background-size: 26px 14px;
  background-repeat: repeat-x;
  background-position: 0 50%;
}