* { box-sizing: border-box; -webkit-tap-highlight-color: transparent; user-select: none; -webkit-user-select: none; -webkit-touch-callout: none; }
html, body { margin: 0; height: 100%; overflow: hidden; touch-action: manipulation; overscroll-behavior: none; }
:root {
  --pink: #ff4f9a; --pink-dark: #d12f76; --pink-soft: #ffd6ec;
  --blue: #3a9bff; --blue-dark: #1e6fcc; --blue-soft: #d4ebff;
  --yellow: #ffd23f; --purple: #8b5cf6;
  --ink: #3b2a4a;
  --spd: .4s;
}
body {
  font-family: "Rubik", "Comic Sans MS", system-ui, sans-serif; font-weight: 800; color: var(--ink);
  background: linear-gradient(160deg, #ffe1f1 0%, #f1e4ff 50%, #d9f0ff 100%);
}
button { font: inherit; color: inherit; }

/* Плавающие пузыри на фоне */
#bg { position: fixed; inset: 0; overflow: hidden; pointer-events: none; }
#bg i { position: absolute; border-radius: 50%; opacity: .45; filter: blur(2px); animation: float 14s ease-in-out infinite alternate; }
#bg i:nth-child(1) { width: 40vmin; height: 40vmin; left: -10vmin; top: 10vh; background: #ffb3d9; }
#bg i:nth-child(2) { width: 28vmin; height: 28vmin; right: -6vmin; top: 4vh; background: #b9dcff; animation-delay: -3s; }
#bg i:nth-child(3) { width: 22vmin; height: 22vmin; left: 30vw; bottom: -6vmin; background: #ffe58a; animation-delay: -6s; }
#bg i:nth-child(4) { width: 34vmin; height: 34vmin; right: 5vw; bottom: 8vh; background: #d6c2ff; animation-delay: -9s; }
#bg i:nth-child(5) { width: 14vmin; height: 14vmin; left: 12vw; top: 60vh; background: #9ff0c8; animation-delay: -2s; }
#bg i:nth-child(6) { width: 18vmin; height: 18vmin; right: 30vw; top: 30vh; background: #ffc6a8; animation-delay: -7s; }

.screen {
  position: fixed; inset: 0; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 4vmin;
  padding: env(safe-area-inset-top) env(safe-area-inset-right) env(safe-area-inset-bottom) env(safe-area-inset-left);
  animation: screenIn .45s cubic-bezier(.3,1.4,.5,1);
}
.hidden { display: none !important; }

/* Заголовок: каждая буква прыгает отдельно */
.title { margin: 0; font-size: 13vmin; font-weight: 900; color: var(--pink); text-align: center; line-height: 1; pointer-events: none;
  text-shadow: 0 .8vmin 0 #fff, 0 1.6vmin 0 rgba(209,47,118,.25); white-space: nowrap; }
.title.small { font-size: 9vmin; }
.title span { display: inline-block; animation: letter 1.6s ease-in-out infinite; }

/* Фото в кружке */
.face {
  width: 30vmin; height: 30vmin; border-radius: 50%; overflow: hidden; background: #fff; flex: none;
  display: flex; align-items: center; justify-content: center; font-size: 22vmin; line-height: 1;
  border: 1.4vmin solid #fff; box-shadow: 0 1vmin 2.5vmin rgba(59,42,74,.2);
}
.face img { width: 100%; height: 100%; object-fit: cover; pointer-events: none; }
.face[data-who^="vlada"] { border-color: var(--pink); }
.face[data-who="pasha"] { border-color: var(--blue); }
.face.big { width: 36vmin; height: 36vmin; font-size: 26vmin; }

/* Кнопки */
.round-btn {
  width: 30vmin; height: 30vmin; border-radius: 50%; border: 1.4vmin solid #fff; cursor: pointer;
  background: radial-gradient(circle at 35% 30%, #ff8cc2, var(--pink)); color: #fff; font-size: 13vmin; padding-left: 2vmin;
  box-shadow: 0 1.6vmin 0 var(--pink-dark), 0 3vmin 5vmin rgba(209,47,118,.35);
  animation: pulse 1.2s ease-in-out infinite; transition: transform .1s;
}
.round-btn:active { transform: translateY(1.2vmin) !important; box-shadow: 0 .4vmin 0 var(--pink-dark); }
#again { position: fixed; bottom: 5vmin; right: 5vmin; z-index: 10; width: 22vmin; height: 22vmin; font-size: 10vmin; }
.mini-btn { width: 12vmin; height: 12vmin; border-radius: 50%; border: none; background: #fff9; font-size: 6vmin; cursor: pointer; box-shadow: 0 .6vmin 0 #0001; }
.mini-spacer { width: 12vmin; }

/* Звёзды уровня */
.stars { display: flex; gap: 1.5vmin; }
.stars b { font-size: 7vmin; line-height: 1; color: #fff; -webkit-text-stroke: .4vmin #e9c6dd; transition: transform .3s; }
.stars b.on { color: var(--yellow); -webkit-text-stroke: .4vmin #e2a800; filter: drop-shadow(0 .5vmin 0 rgba(226,168,0,.35)); }
.stars.pick b { cursor: pointer; padding: 1vmin; }
.stars.pick b.cur { transform: scale(1.3); }
.stars.huge b { font-size: 14vmin; }
.stars b.new { animation: starPop .9s cubic-bezier(.3,1.8,.5,1) both; }

/* Старт */
.peek { display: flex; align-items: center; gap: 3vmin; }
.peek .face:first-child { transform: rotate(-8deg); animation: peekL 3s ease-in-out infinite; }
.peek .face:last-child { transform: rotate(8deg); animation: peekR 3s ease-in-out infinite; }
.vs { font-size: 16vmin; font-weight: 900; color: var(--purple); animation: pulse 1s ease-in-out infinite; }

/* Игра */
.topbar { position: absolute; top: calc(env(safe-area-inset-top) + 3vmin); left: 3vmin; right: 3vmin; display: flex; align-items: center; justify-content: space-between; z-index: 8; }
#cards { display: flex; gap: 8vmin; align-items: center; justify-content: center; flex-wrap: wrap; }
.card {
  position: relative; width: 40vmin; padding: 3.5vmin 3vmin 3vmin; border-radius: 7vmin; border: none; cursor: pointer;
  display: flex; flex-direction: column; align-items: center; gap: 2.5vmin;
  transition: left var(--spd) cubic-bezier(.3,1.5,.5,1), top var(--spd) cubic-bezier(.3,1.5,.5,1), transform .35s, opacity .3s;
}
.card .name { font-size: 6.5vmin; font-weight: 900; color: #fff; padding: .8vmin 4vmin; border-radius: 99px; }
#vlada { background: var(--pink-soft); box-shadow: 0 1.6vmin 0 #f3a9cf, 0 3vmin 5vmin rgba(209,47,118,.2); z-index: 2; }
#vlada .name { background: var(--pink); }
#vlada .face { animation: invite 2.2s ease-in-out infinite; }
#vlada:active { transform: translateY(1vmin) scale(.97); }
#pasha, .clone { background: var(--blue-soft); box-shadow: 0 1.6vmin 0 #a9cdf3, 0 3vmin 5vmin rgba(30,111,204,.2); }
#pasha .name, .clone .name { background: var(--blue); }
#pasha.disguise { background: var(--pink-soft); }
#pasha.disguise .name { background: var(--pink); }
#pasha.disguise .face { border-color: var(--pink); }
#pasha.loose { position: fixed; z-index: 5; margin: 0; }
#pasha.behind { z-index: 1; }
.clone { position: fixed; z-index: 4; animation: screenIn .3s; }
.clone .bubble, .clone .hat { display: none; }

/* Сколько раз осталось поймать Пашу */
.progress { display: flex; gap: 2vmin; }
.slot { width: 10vmin; height: 10vmin; border-radius: 50%; border: .8vmin dashed #c9a7e8; background: #fff8;
  display: flex; align-items: center; justify-content: center; font-size: 6vmin; line-height: 1; }
.slot.on { border: .8vmin solid var(--blue); background: #fff; animation: starPop .5s cubic-bezier(.3,1.8,.5,1); }

/* место Паши в раскладке, пока он бегает (чтобы Влада не съезжала) */
.card-ghost { flex: none; }

/* Паша сдался: светится и ждёт нажатия */
#pasha.giveup { animation: giveup 1s ease-in-out infinite; box-shadow: 0 0 0 1.5vmin #fff, 0 0 8vmin 3vmin var(--yellow); }

/* Палец-подсказка */
#hint { position: fixed; z-index: 30; font-size: 14vmin; line-height: 1; pointer-events: none;
  animation: tapHint .9s ease-in-out infinite; filter: drop-shadow(0 1vmin 1vmin rgba(0,0,0,.25)); }

/* Шапка по уровню (над фото) */
.hat { position: absolute; top: -9vmin; left: 50%; transform: translateX(-50%) rotate(-8deg); font-size: 15vmin; line-height: 1; z-index: 3; pointer-events: none; }
.hat.eyes { top: 7vmin; font-size: 17vmin; transform: translateX(-50%); }

/* Пузырь с эмоцией */
.bubble { position: absolute; top: -6vmin; right: -7vmin; z-index: 4; font-size: 9vmin; line-height: 1; padding: 2vmin; pointer-events: none;
  background: #fff; border-radius: 50% 50% 50% 8%; box-shadow: 0 1vmin 2vmin rgba(59,42,74,.2);
  transform: scale(0); transition: transform .25s cubic-bezier(.3,1.8,.5,1); }
.bubble.show { transform: scale(1); }
#pasha.bubble-left .bubble { right: auto; left: -7vmin; border-radius: 50% 50% 8% 50%; }

.shake { animation: shake .5s; }
.jump { animation: jump .6s; }
.dance { animation: dance .3s ease-in-out infinite alternate; }
.taunt { animation: taunt .6s ease-in-out 2; }
.fx { position: fixed; z-index: 20; pointer-events: none; font-size: 10vmin; line-height: 1; }
.poof { animation: poof .7s forwards; }
.spark { animation: spark .8s ease-out forwards; }

/* Новый уровень */
#levelup { background: radial-gradient(circle, #a77bff 0%, #5b2bbf 70%); overflow: hidden; gap: 6vmin; }
.rays { position: absolute; width: 250vmax; height: 250vmax; left: 50%; top: 50%; margin: -125vmax 0 0 -125vmax; opacity: .25;
  background: repeating-conic-gradient(#fff 0 10deg, transparent 10deg 20deg); animation: spin 18s linear infinite; }
.lvl-pasha { position: relative; animation: wobble 1.4s ease-in-out infinite; }
.lvl-pasha .hat { top: -14vmin; font-size: 20vmin; }
.lvl-pasha .hat.eyes { top: 4vmin; font-size: 22vmin; }
#lvlGo { background: radial-gradient(circle at 35% 30%, #ffe680, #ffb800); box-shadow: 0 1.6vmin 0 #c98a00, 0 3vmin 5vmin rgba(0,0,0,.3); }

/* Дразнилка */
#party { overflow: hidden; }
/* радуга переливается только на фоне — фото остаются нормального цвета */
#party::before { content: ''; position: absolute; inset: 0;
  background: linear-gradient(45deg, #ff004c, #ff9a00, #ffe600, #00e05a, #00b7ff, #8f3bff, #ff00c8);
  background-size: 400% 400%; animation: bgmove 3s ease-in-out infinite alternate, hue 4s linear infinite; }
#partyFace { position: relative; z-index: 2; cursor: pointer; animation: wobble 1s ease-in-out infinite; }
#partyFace .face { width: 58vmin; height: 58vmin; font-size: 44vmin; border-width: 2.2vmin; border-color: #fff; }
#partyFace.squish .face { animation: squish .4s; }
#acc { position: absolute; left: 50%; transform: translateX(-50%); line-height: 1; pointer-events: none; }
.tease { margin: 0; font-size: 15vmin; font-weight: 900; color: #fff; z-index: 2; text-align: center; pointer-events: none;
  -webkit-text-stroke: .7vmin var(--ink); paint-order: stroke fill; animation: textcolor 1s steps(2) infinite, bounce .5s ease-in-out infinite alternate; }
#laugher { position: fixed; left: 5vmin; bottom: 5vmin; z-index: 4; animation: laugh .35s ease-in-out infinite alternate; pointer-events: none; }
#laugher .face { width: 24vmin; height: 24vmin; font-size: 17vmin; border-color: #fff; }
#laugher .bubble { right: -9vmin; }
.drop { position: absolute; top: -15vmin; font-size: 10vmin; animation: fall linear forwards; pointer-events: none; }
.balloon { position: absolute; bottom: -25vmin; font-size: 18vmin; line-height: 1; cursor: pointer; z-index: 3; padding: 2vmin; animation: rise linear forwards; }

@keyframes screenIn { from { opacity: 0; transform: scale(.92); } }
@keyframes float { to { transform: translate(6vmin, -8vmin) scale(1.15); } }
@keyframes letter { 0%,100% { transform: translateY(0) rotate(0); } 25% { transform: translateY(-2.5vmin) rotate(-5deg); } 50% { transform: translateY(0) rotate(0); } }
@keyframes pulse { 50% { transform: scale(1.07); } }
@keyframes peekL { 0%,100% { transform: rotate(-8deg); } 50% { transform: rotate(-14deg) translateY(-2vmin); } }
@keyframes peekR { 0%,100% { transform: rotate(8deg); } 50% { transform: rotate(14deg) translateY(-2vmin); } }
@keyframes invite { 0%,70%,100% { transform: rotate(0); } 80% { transform: rotate(-10deg) scale(1.05); } 90% { transform: rotate(10deg) scale(1.05); } }
@keyframes shake { 0%,100% { transform: rotate(0); } 20%,60% { transform: rotate(-15deg); } 40%,80% { transform: rotate(15deg); } }
@keyframes jump { 0%,100% { transform: translateY(0); } 50% { transform: translateY(-40vmin) rotate(360deg); } }
@keyframes dance { from { transform: rotate(-12deg) translateY(0); } to { transform: rotate(12deg) translateY(-4vmin); } }
@keyframes taunt { 0%,100% { transform: rotate(0) scale(1); } 25% { transform: rotate(-6deg) scale(1.06); } 75% { transform: rotate(6deg) scale(1.06); } }
@keyframes poof { to { transform: scale(2.2); opacity: 0; } }
@keyframes spark { to { transform: translate(var(--dx), var(--dy)) scale(.4) rotate(360deg); opacity: 0; } }
@keyframes squish { 30% { transform: scale(1.25, .75); } 60% { transform: scale(.85, 1.15); } 100% { transform: scale(1); } }
@keyframes starPop { 0% { transform: scale(0) rotate(-180deg); } 100% { transform: scale(1) rotate(0); } }
@keyframes spin { to { transform: rotate(360deg); } }
@keyframes giveup { 50% { transform: scale(1.08); } }
@keyframes tapHint { 0%,100% { transform: translate(0, 0); } 50% { transform: translate(-1.5vmin, -3vmin) scale(.9); } }
@keyframes bgmove { 0% { background-position: 0% 50%; } 100% { background-position: 100% 50%; } }
@keyframes hue { to { filter: hue-rotate(360deg); } }
@keyframes wobble { 0%,100% { transform: rotate(-8deg); } 50% { transform: rotate(8deg) scale(1.06); } }
@keyframes laugh { from { transform: rotate(-10deg) translateY(0); } to { transform: rotate(10deg) translateY(-2vmin); } }
@keyframes textcolor { 0% { color: #fff; } 100% { color: #ffe600; } }
@keyframes bounce { to { transform: translateY(-3vmin) scale(1.06); } }
@keyframes fall { to { transform: translateY(130vh) rotate(720deg); } }
@keyframes rise { 0% { transform: translateY(0) rotate(-6deg); } 50% { transform: translateY(-65vh) rotate(6deg); } 100% { transform: translateY(-135vh) rotate(-6deg); } }

/* ---------- Секретный раунд ---------- */
#secret { background: radial-gradient(circle at 50% 30%, #4b2a8c, #150a2e 70%); overflow: hidden; gap: 6vmin; }
.secret-sky { position: absolute; inset: 0; pointer-events: none;
  background-image: radial-gradient(2px 2px at 20% 30%, #fff, transparent), radial-gradient(2px 2px at 70% 20%, #fff, transparent),
    radial-gradient(1.5px 1.5px at 40% 70%, #fff, transparent), radial-gradient(2px 2px at 85% 60%, #ffe680, transparent),
    radial-gradient(1.5px 1.5px at 10% 80%, #fff, transparent), radial-gradient(2px 2px at 55% 45%, #ffe680, transparent);
  animation: twinkle 2s ease-in-out infinite alternate; }
.secret-lock { font-size: 24vmin; line-height: 1; animation: wobble 1.2s ease-in-out infinite; }
.secret-faces { display: flex; gap: 3vmin; }
.secret-faces .face { width: 26vmin; height: 26vmin; font-size: 18vmin; animation: pulse 1.4s ease-in-out infinite; }
.secret-faces .face:nth-child(2) { animation-delay: .2s; }
.secret-faces .face:nth-child(3) { animation-delay: .4s; }
.face[data-who="mama"] { border-color: var(--purple); }
#game.secret { background: radial-gradient(circle at 50% 30%, #5a34a6, #1d0f3d 75%); }
#game.secret .title { color: var(--yellow); text-shadow: 0 .8vmin 0 #5b2bbf, 0 0 4vmin rgba(255,210,63,.6); }
#game.secret .slot { border-color: #ffe680; }
#cards.three { gap: 4vmin; }
#cards.three .card { width: 32vmin; }
#cards.three .face { width: 24vmin; height: 24vmin; font-size: 17vmin; }
#pasha.mama { background: #eadcff; box-shadow: 0 1.6vmin 0 #c9b0f5, 0 0 6vmin rgba(255,210,63,.5); }
#pasha.mama .name { background: var(--purple); }
#extra { background: var(--blue-soft); box-shadow: 0 1.6vmin 0 #a9cdf3; }
#extra .name { background: var(--blue); }

/* ---------- Мини-игры ---------- */
#mini { justify-content: flex-start; }
#miniArea { position: absolute; left: 0; right: 0; bottom: 0; top: calc(env(safe-area-inset-top) + 17vmin); }

/* «Найди Пашу» */
.spot { position: absolute; transform: translate(-50%, -50%); width: 28vmin; height: 28vmin; padding: 0; border: none; background: none; cursor: pointer;
  transition: left var(--shuf, .5s) ease-in-out, top var(--shuf, .5s) ease-in-out; }
.spot .cover { position: absolute; inset: 0; display: flex; align-items: center; justify-content: center; font-size: 26vmin; line-height: 1; z-index: 2;
  transition: transform .5s cubic-bezier(.3,1.4,.5,1), opacity .5s; filter: drop-shadow(0 1.5vmin 1vmin rgba(59,42,74,.25)); }
.spot.open .cover { transform: translateY(-60%) rotate(-14deg) scale(.75); opacity: .35; }
.spot .inside { position: absolute; inset: 0; display: flex; align-items: center; justify-content: center; font-size: 18vmin; line-height: 1;
  transform: scale(0); transition: transform .35s cubic-bezier(.3,1.8,.5,1) .15s; }
.spot.open .inside { transform: scale(1); }
.spot .inside .face { width: 22vmin; height: 22vmin; font-size: 16vmin; }
.spot.wiggle { animation: spotWiggle .5s; }
.hider { position: absolute; left: 50%; top: 4%; width: 30vmin; height: 30vmin; font-size: 22vmin; transform: translate(-50%, 0); z-index: 1;
  transition: left .6s ease-in, top .6s ease-in, transform .6s ease-in, opacity .6s ease-in; }
.hider.hiding { transform: translate(-50%, -50%) scale(.3); opacity: 0; }

/* «Лопни шарики» */
.bunch { position: absolute; left: 0; top: 0; }
.bunch .strings { position: absolute; inset: 0; width: 100%; height: 100%; pointer-events: none; }
.bunch .strings line { stroke: #8a7a99; stroke-width: .35; }
.bln { position: absolute; width: 16vmin; height: 19vmin; font-size: 16vmin; line-height: 1; padding: 0; border: none; background: none; cursor: pointer;
  animation: blnBob 1.6s ease-in-out infinite alternate; }
.face.hanging { position: absolute; width: 26vmin; height: 26vmin; font-size: 19vmin; }
.face.squash { animation: squish .5s; }
.bunch .bubble { top: auto; }

/* «Найди настоящего» */
.twins { display: grid; gap: 3vmin; justify-content: center; align-content: center; height: 100%; }
.twin { position: relative; padding: 0; border: none; background: none; cursor: pointer; transition: transform .3s, opacity .3s; }
.twin .face { width: 26vmin; height: 26vmin; font-size: 19vmin; }
.twins.many .twin .face { width: 21vmin; height: 21vmin; font-size: 15vmin; }
.twin .hat { top: -6vmin; font-size: 11vmin; }
.twin .hat.eyes { top: 5vmin; font-size: 13vmin; }
.twins.many .twin .hat { font-size: 9vmin; }
.twin .tell { position: absolute; left: 50%; top: 60%; font-size: 9vmin; line-height: 1; pointer-events: none; transform: translate(-50%, 0) scale(0); transition: transform .2s cubic-bezier(.3,1.8,.5,1); }
.twin.telling .tell { transform: translate(-50%, 0) scale(1); }
.twin.telling { animation: taunt .6s ease-in-out; }
.twin.gone { opacity: 0; transform: scale(.3); pointer-events: none; }
.twin.found { transform: scale(1.2); }

/* «Сдуй Пашу» */
.branch { position: absolute; top: 5vmin; left: 8%; right: 8%; height: 3.5vmin; border-radius: 99px; background: linear-gradient(#a8743f, #7a4f24);
  box-shadow: 0 1vmin 0 rgba(59,42,74,.15); }
.branch::before, .branch::after { content: '🍃'; position: absolute; top: -5vmin; font-size: 8vmin; }
.branch::before { left: 6%; } .branch::after { right: 6%; transform: scaleX(-1); }
.hanger { position: absolute; top: 3vmin; left: 50%; width: 32vmin; margin-left: -16vmin; transform-origin: 50% 0;
  display: flex; flex-direction: column; align-items: center; }
.hands { font-size: 9vmin; line-height: 1; letter-spacing: 7vmin; margin-right: -7vmin; }
.hanger .face { width: 28vmin; height: 28vmin; font-size: 20vmin; margin-top: -1vmin; }
.hanger .bubble { top: 10vmin; right: -10vmin; }
.mic { position: absolute; bottom: 20vmin; left: 50%; width: 24vmin; height: 24vmin; margin-left: -12vmin; display: flex; align-items: center; justify-content: center; pointer-events: none; }
.mic-ring { position: absolute; inset: 0; border-radius: 50%; background: rgba(255,79,154,.25); border: .8vmin solid rgba(255,79,154,.5); transition: transform .08s; }
.mic-icon { position: relative; font-size: 14vmin; line-height: 1; }
.windbar { position: absolute; bottom: 7vmin; left: 10%; right: 10%; height: 6vmin; border-radius: 99px; background: #fff9; border: .8vmin solid #fff; overflow: hidden; pointer-events: none; }
.windbar i { display: block; height: 100%; width: 0; background: linear-gradient(90deg, #9be7ff, #3a9bff); border-radius: 99px; }
.windfly { animation: windfly 1s ease-out forwards; }

@keyframes twinkle { to { opacity: .4; } }
@keyframes spotWiggle { 0%,100% { transform: translate(-50%, -50%) rotate(0); } 25% { transform: translate(-50%, -50%) rotate(-9deg); } 75% { transform: translate(-50%, -50%) rotate(9deg); } }
@keyframes blnBob { from { transform: translateY(0) rotate(-4deg); } to { transform: translateY(-1.5vmin) rotate(4deg); } }
@keyframes windfly { to { transform: translate(-6vmin, -40vh) scale(1.5); opacity: 0; } }

/* ---------- Правила раунда ---------- */
.rules-card { position: relative; width: min(92vw, 620px); max-height: 92vh; overflow-y: auto; background: #fff; border-radius: 6vmin;
  padding: 5vmin 6vmin; box-shadow: 0 2vmin 6vmin rgba(59,42,74,.2); display: flex; flex-direction: column; align-items: center; gap: 2.5vmin; }
.rules-pic { font-size: 18vmin; line-height: 1; animation: wobble 1.6s ease-in-out infinite; }
.rules-title { margin: 0; font-size: clamp(22px, 7vmin, 36px); font-weight: 900; color: var(--pink); text-align: center; }
.rules-list { margin: 0; padding-left: 1.2em; font-weight: 600; font-size: clamp(16px, 4.3vmin, 21px); line-height: 1.45; color: var(--ink); align-self: stretch; }
.rules-list li + li { margin-top: .5em; }
.rules-new { margin: 0; align-self: stretch; padding: 3vmin 4vmin; border-radius: 4vmin; background: #fff4cc; font-weight: 600; font-size: clamp(15px, 4vmin, 19px); line-height: 1.4; }
.rules-btns { display: flex; align-items: center; gap: 5vmin; margin-top: 1vmin; }
.rules-btns .round-btn { width: 24vmin; height: 24vmin; font-size: 10vmin; }
#rulesStars b { font-size: 5vmin; }