/* ミニゲーム「激闘！東平山 めんこバトラー」（js/menko.js） */
.ry2 { position: fixed; inset: 0; z-index: 92; display: grid; place-items: center; padding: 10px; background: radial-gradient(circle at 50% 40%, rgba(90, 30, 10, .55), rgba(20, 8, 2, .8)); backdrop-filter: blur(3px); font-family: "M PLUS Rounded 1c", sans-serif; perspective: 1400px; }
.ry2-box { position: relative; width: min(94vw, 90vh, 820px); aspect-ratio: 1; border-radius: 30px; transform-style: preserve-3d; animation: ry2-in .6s cubic-bezier(.25, 1.4, .5, 1);
  box-shadow: 0 0 0 7px #c0392b, 0 0 0 12px #ffd23d, 0 0 0 16px #7a1f10, 0 30px 80px rgba(0, 0, 0, .6), 0 0 60px rgba(255, 170, 40, .35); user-select: none; -webkit-user-select: none; }
@keyframes ry2-in { from { transform: rotateX(38deg) translateY(60px) scale(.8); opacity: 0; } }
.ry2-cv { position: absolute; inset: 0; width: 100%; height: 100%; border-radius: 30px; touch-action: none; cursor: grab; }
.ry2-cv:active { cursor: grabbing; }
.ry2-x { position: absolute; right: -14px; top: -14px; z-index: 5; width: 46px; height: 46px; border: 0; border-radius: 50%; background: #fffaf0; color: #c0392b; font-size: 18px; font-weight: 900; cursor: pointer; box-shadow: inset 0 0 0 3px #c0392b, 0 4px 8px rgba(0, 0, 0, .3); }
.ry2-timer, .ry2-tries { position: absolute; top: 3%; z-index: 3; margin: 0; display: flex; align-items: center; gap: 6px; padding: 6px 16px; border-radius: 18px; background: rgba(255, 250, 238, .95); box-shadow: 0 4px 0 #7a1f10; pointer-events: none; }
.ry2-timer { left: 3%; } .ry2-tries { right: 3%; }
.ry2-timer b { font-size: clamp(26px, 6vmin, 48px); font-weight: 900; color: #c0392b; line-height: 1; }
.ry2-timer.is-hurry b { color: #ff3b30; animation: ry2-beat .5s ease-in-out infinite; }
.ry2-tries i { width: clamp(22px, 4.4vmin, 34px); aspect-ratio: 1; border-radius: 50%; background: #d8cfc0; box-shadow: inset 0 -3px 0 rgba(0, 0, 0, .15); transition: transform .3s; }
.ry2-tries i.is-on { background: radial-gradient(circle at 35% 30%, #ffe27a, #e8412d); box-shadow: inset 0 0 0 3px #ffd23d, 0 2px 4px rgba(0, 0, 0, .3); }
.ry2-ov { position: absolute; inset: 0; z-index: 4; display: grid; place-items: center; pointer-events: none; }
.ry2-ov[hidden] { display: none; }
.ry2-ov > * { pointer-events: auto; }
.ry2-ov > .ry2-hint { pointer-events: none; align-self: end; margin-bottom: 5%; padding: 10px 22px; border-radius: 999px; background: rgba(255, 250, 238, .95); color: #7a1f10; font-weight: 900; font-size: clamp(14px, 2.8vmin, 20px); box-shadow: 0 5px 0 #c0392b; white-space: nowrap; animation: ry2-bob 1.6s ease-in-out infinite; }
@keyframes ry2-bob { 50% { transform: translateY(-8px); } }
.ry2-card { position: relative; width: min(76%, 500px); margin-top: 20%; padding: 22px 22px 18px; border-radius: 24px; text-align: center; color: #3b2a14; background: linear-gradient(180deg, #fffaf0, #ffeede);
  box-shadow: inset 0 0 0 4px #ffb366, 0 16px 40px rgba(0, 0, 0, .4); animation: ry2-pop .45s cubic-bezier(.3, 1.6, .5, 1); }
@keyframes ry2-pop { from { transform: scale(.6); opacity: 0; } }
.ry2-chara { position: absolute; left: 50%; bottom: calc(100% - 26px); width: 40%; transform: translateX(-50%); filter: drop-shadow(0 10px 14px rgba(0, 0, 0, .35)); animation: ry2-jump .8s cubic-bezier(.3, 1.6, .5, 1); pointer-events: none; }
.ry2-card.is-win .ry2-chara { animation: ry2-jump .8s cubic-bezier(.3, 1.6, .5, 1), ry2-dance 1.1s ease-in-out .8s infinite; }
@keyframes ry2-jump { from { transform: translateX(-50%) translateY(120px) scale(.4); opacity: 0; } 60% { transform: translateX(-50%) translateY(-30px) scale(1.15); opacity: 1; } }
@keyframes ry2-dance { 50% { transform: translateX(-50%) translateY(-10px) rotate(-5deg); } }
.ry2-card h2 { margin: 0 0 10px; font-size: clamp(22px, 4.6vmin, 36px); font-weight: 900; line-height: 1.25; color: #e8412d; -webkit-text-stroke: 1px #6b1a0a; word-break: keep-all; }
.ry2-card p { margin: 0 0 10px; font-weight: 800; font-size: clamp(13px, 2.5vmin, 18px); line-height: 1.6; }
/* 金の 立体文字 */
.ry2-yatta { font-size: clamp(34px, 7.4vmin, 60px) !important; background: linear-gradient(180deg, #fffbe0 0%, #ffe27a 35%, #f5a90e 60%, #c27400 100%); -webkit-background-clip: text; background-clip: text; color: transparent !important;
  -webkit-text-stroke: 2px #7a3a00 !important; filter: drop-shadow(0 2px 0 #b35f00) drop-shadow(0 4px 0 #8a4400) drop-shadow(0 6px 0 #5c2c00) drop-shadow(0 10px 14px rgba(0, 0, 0, .4)); animation: ry2-gold .9s cubic-bezier(.3, 1.8, .5, 1); }
@keyframes ry2-gold { from { transform: scale(2.6) rotate(-8deg); opacity: 0; } 60% { transform: scale(.9) rotate(2deg); opacity: 1; } }
.ry2-prize { padding: 8px 12px; border-radius: 14px; background: #fff3d6; }
.ry2-prize.is-demo { background: #eaf4ff; color: #1b4f8a; font-size: 14px !important; }
.ry2-badge { display: inline-flex !important; align-items: center; gap: 8px; padding: 8px 22px !important; border-radius: 20px; color: #fff; font-size: clamp(28px, 6vmin, 44px) !important; font-weight: 900; background: linear-gradient(180deg, #ffd23d, #f5a90e); text-shadow: 0 3px 0 rgba(150, 70, 0, .5); box-shadow: 0 6px 0 #9a5a06, 0 0 28px rgba(255, 210, 60, .9); animation: ry2-pop .8s .25s cubic-bezier(.3, 1.8, .5, 1) both, ry2-shine 1.4s 1s ease-in-out infinite; }
@keyframes ry2-shine { 50% { box-shadow: 0 6px 0 #9a5a06, 0 0 44px rgba(255, 230, 100, 1); } }
.ry2-badge img { width: 1.2em; height: auto; } .ry2-badge small { font-size: .5em; }
.ry2-go, .ry2-sub { display: block; width: 100%; min-height: 58px; margin-top: 8px; border: 0; border-radius: 16px; cursor: pointer; font: inherit; font-weight: 900; font-size: clamp(18px, 3.4vmin, 23px); }
.ry2-go { color: #fff; background: linear-gradient(180deg, #ff6b4a, #c0392b); box-shadow: 0 6px 0 #7a1f10, 0 10px 18px rgba(192, 57, 43, .4); }
.ry2-go:active { transform: translateY(5px); box-shadow: 0 1px 0 #7a1f10; }
.ry2-sub { min-height: 46px; font-size: 16px; color: #7a1f10; background: #fff; box-shadow: inset 0 0 0 2px #ffc7a8; }
.ry2-cd { margin: 0; font-size: clamp(90px, 26vmin, 220px); font-weight: 900; color: #fff; -webkit-text-stroke: 8px #c0392b; paint-order: stroke fill; text-shadow: 0 10px 0 #6b1a0a; animation: ry2-cdin .55s cubic-bezier(.3, 1.8, .5, 1); }
.ry2-cd.is-go { font-size: clamp(50px, 13vmin, 110px); color: #ffe27a; }
@keyframes ry2-cdin { from { transform: scale(2.4); opacity: 0; } 60% { transform: scale(.92); opacity: 1; } }
@keyframes ry2-beat { 50% { transform: scale(1.18); } }
.ry2-confetti { position: fixed; inset: 0; z-index: 96; width: 100vw; height: 100vh; pointer-events: none; }
/* 受付の「あそぶ」ボタン（ネオン） */
.ry2-open-btn { position: relative; background: linear-gradient(135deg, #ff6b4a, #c0392b 60%, #7a1f10) !important;
  box-shadow: inset 0 0 0 3px rgba(255, 220, 120, .55), 0 0 0 2px #ffd23d, 0 0 18px rgba(255, 90, 60, .75), 0 5px 0 #5c1508, 0 12px 22px rgba(192, 57, 43, .4) !important; animation: ry2-neon 1.8s ease-in-out infinite; }
@keyframes ry2-neon { 50% { box-shadow: inset 0 0 0 3px rgba(255, 240, 160, .9), 0 0 0 2px #fff3a0, 0 0 30px rgba(255, 120, 60, 1), 0 5px 0 #5c1508, 0 12px 22px rgba(192, 57, 43, .4) !important; } }
@media (prefers-reduced-motion: reduce) { .ry2-open-btn, .ry2-ov > .ry2-hint, .ry2-badge { animation: none; } }
@media (max-width: 720px) {
  .ry2-card { width: 84%; margin-top: 26%; padding: 14px 14px 12px; }
  .ry2-chara { width: 34%; }
  .ry2-go { min-height: 50px; } .ry2-sub { min-height: 42px; }
}
/* 青龍：水と光の わく */
.ry2 { background: radial-gradient(circle at 50% 40%, rgba(20, 70, 140, .6), rgba(2, 8, 24, .88)); }
.ry2-box { box-shadow: 0 0 0 6px #7fe3ff, 0 0 0 11px #1e7fe0, 0 0 0 15px #0b3f7a, 0 0 60px rgba(90, 200, 255, .7), 0 30px 80px rgba(0, 0, 0, .6); }
.ry2-box::before { content: ""; position: absolute; inset: -22px; z-index: -1; border-radius: 44px; background: conic-gradient(from 0deg, #38c8ff, #bff4ff, #1e7fe0, #7fe3ff, #38c8ff); filter: blur(18px); opacity: .55; animation: ry2-spin 6s linear infinite; }
@keyframes ry2-spin { to { transform: rotate(360deg); } }
.ry2-timer, .ry2-count { box-shadow: 0 4px 0 #0b3f7a; }
.ry2-timer b { color: #1e7fe0; }
.ry2-count { right: 3%; left: auto; } .ry2-count b { font-size: clamp(26px, 6vmin, 48px); font-weight: 900; color: #1e7fe0; line-height: 1; } .ry2-count i { font-style: normal; font-weight: 900; color: #0b3f7a; }
.ry2-count.is-clear b { color: #ffb000; }
.ry2-card { background: linear-gradient(180deg, #f6fcff, #dff2ff); box-shadow: inset 0 0 0 4px #7fe3ff, 0 0 30px rgba(90, 200, 255, .6), 0 16px 40px rgba(0, 0, 0, .4); }
.ry2-card h2 { color: #1e7fe0; -webkit-text-stroke: 1px #0b3f7a; }
.ry2-chara { width: 38%; bottom: calc(100% - 20px); }
.ry2-go { background: linear-gradient(180deg, #5fd0ff, #1e7fe0); box-shadow: 0 6px 0 #0b3f7a, 0 10px 18px rgba(30, 127, 224, .4); }
.ry2-go:active { box-shadow: 0 1px 0 #0b3f7a; }
.ry2-sub { color: #0b3f7a; box-shadow: inset 0 0 0 2px #b8e4ff; }
.ry2-cd { -webkit-text-stroke-color: #1e7fe0; text-shadow: 0 10px 0 #0b3f7a, 0 0 30px #7fe3ff; }
.ry2-cd.is-go { color: #bff4ff; }
.ry2-ov > .ry2-hint { color: #0b3f7a; box-shadow: 0 5px 0 #1e7fe0, 0 0 20px rgba(127, 227, 255, .8); }
.ry2-mark { display: none; }
.ry2-open-btn { background: linear-gradient(135deg, #7fe3ff, #1e7fe0 55%, #0b3f7a) !important;
  box-shadow: inset 0 0 0 3px rgba(255, 255, 255, .5), 0 0 0 2px #bff4ff, 0 0 20px rgba(90, 200, 255, .85), 0 5px 0 #06254a, 0 12px 22px rgba(30, 127, 224, .4) !important; animation: ry2-neon 1.8s ease-in-out infinite !important; }
@keyframes ry2-neon { 50% { box-shadow: inset 0 0 0 3px rgba(255, 255, 255, .9), 0 0 0 2px #fff, 0 0 34px rgba(160, 235, 255, 1), 0 5px 0 #06254a, 0 12px 22px rgba(30, 127, 224, .4) !important; } }
@media (prefers-reduced-motion: reduce) { .ry2-box::before { animation: none; } }
.ry2-card { margin-top: 28%; }
.ry2.is-won .ry2-timer, .ry2.is-won .ry2-count { opacity: 0; transition: opacity .3s; }
.ry2-score { font-size: 1.6em; color: #1e7fe0; }
.ry2-score-line { margin: 0 0 8px !important; }
.ry2-new { font-style: normal; color: #ff5a3c; font-weight: 900; animation: mk2-beat .6s ease-in-out infinite; display: inline-block; }
