/* 今夜のお店ルーレット [yk_roulette] */
.ykr{--ykr-pink:#e8336f;max-width:520px;margin:24px auto;padding:20px 16px 24px;border-radius:20px;background:linear-gradient(160deg,#2a1033,#4a1747);color:#fff;text-align:center;box-sizing:border-box}
.ykr *{box-sizing:border-box}
.ykr .ykr-ttl{margin:0 0 4px;font-size:20px;font-weight:800;letter-spacing:.05em}
.ykr .ykr-sub{margin:0 0 16px;font-size:13px;opacity:.85}
.ykr-stage{position:relative;width:min(340px,86vw);aspect-ratio:1;margin:0 auto}
.ykr-pin{position:absolute;left:50%;top:-6px;transform:translateX(-50%);width:0;height:0;border-left:14px solid transparent;border-right:14px solid transparent;border-top:26px solid #ffd54a;z-index:3}
.ykr-wheel{position:absolute;inset:0;border-radius:50%;border:6px solid #ffd54a;box-shadow:0 0 0 4px rgba(255,255,255,.15),0 8px 24px rgba(0,0,0,.4);transition:transform 4.6s cubic-bezier(.12,.72,.1,1);overflow:hidden;background:#4a1747}
.ykr-lbl{position:absolute;left:50%;top:50%;width:46%;height:20px;margin-top:-10px;transform-origin:0 50%;font-size:11.5px;font-weight:700;line-height:20px;text-align:right;padding-right:10px;color:#fff;text-shadow:0 1px 2px rgba(0,0,0,.45);white-space:nowrap;overflow:hidden}
.ykr-hub{position:absolute;left:50%;top:50%;width:64px;height:64px;margin:-32px 0 0 -32px;border-radius:50%;background:#fff;color:var(--ykr-pink);font-weight:800;font-size:12px;display:flex;align-items:center;justify-content:center;z-index:2}
.ykr-btn{margin-top:18px;padding:12px 32px;border:0;border-radius:999px;background:var(--ykr-pink);color:#fff;font-size:16px;font-weight:800;cursor:pointer;box-shadow:0 4px 0 #a51f4d}
.ykr-btn:disabled{opacity:.6}
.ykr-res{margin-top:16px;min-height:24px;font-size:14px}
.ykr-card{display:none;margin-top:12px;padding:14px;border-radius:14px;background:#fff;color:#2a1033;text-align:left}
.ykr-card.on{display:block}
.ykr-card b{display:block;font-size:17px;color:var(--ykr-pink);margin-bottom:4px}
.ykr-card p{margin:0 0 8px;font-size:13px;line-height:1.6;color:#2a1033}
.ykr-card a{display:inline-block;padding:8px 16px;border-radius:999px;background:var(--ykr-pink);color:#fff!important;text-decoration:none;font-size:13px;font-weight:700}
.ykr-cp{margin:0 0 10px;padding:8px 12px;border:2px dashed var(--ykr-pink);border-radius:10px;background:#fff4f8}
.ykr-cp small{display:block;font-size:11px;font-weight:700;color:var(--ykr-pink)}
.ykr-cp strong{font-size:14px;color:#2a1033}
/* ヨイちゃん（盤の左下）。状態は roulette.js が is-○○ で切り替える */
.ykr-yoi{position:absolute;left:-14px;bottom:-18px;width:96px;z-index:4;pointer-events:none;transform-origin:50% 100%}
.ykr-yoi img{display:block;width:100%;height:auto;filter:drop-shadow(0 4px 6px rgba(0,0,0,.35))}
.ykr-bub{position:absolute;left:52px;bottom:92px;white-space:nowrap;background:#fff;color:var(--ykr-pink);font-size:12px;font-weight:800;line-height:1;padding:7px 10px;border-radius:999px;box-shadow:0 2px 6px rgba(0,0,0,.25)}
.ykr-bub::after{content:"";position:absolute;left:12px;bottom:-6px;border:6px solid transparent;border-top-color:#fff;border-bottom:0}
.ykr-yoi.is-idle{animation:ykrFloat 2.4s ease-in-out infinite}
.ykr-yoi.is-sway{animation:ykrSway .5s ease-in-out infinite alternate}
.ykr-yoi.is-hop{animation:ykrHop .45s cubic-bezier(.3,0,.5,1) infinite alternate}
.ykr-yoi.is-peek{animation:ykrPeek 1.6s ease-in-out infinite}
.ykr-yoi.is-twirl img{animation:ykrTwirl 1.1s linear infinite}
.ykr-yoi.is-win{animation:ykrWin .9s cubic-bezier(.2,1.4,.4,1) both}
.ykr-yoi.is-win .ykr-bub{animation:ykrPop .5s .2s both}
@keyframes ykrFloat{0%,100%{transform:translateY(0)}50%{transform:translateY(-6px)}}
@keyframes ykrSway{from{transform:rotate(-9deg)}to{transform:rotate(9deg)}}
@keyframes ykrHop{from{transform:translateY(0) scale(1,1)}to{transform:translateY(-16px) scale(.96,1.04)}}
@keyframes ykrPeek{0%,100%{transform:translateX(-34px) rotate(-14deg)}45%,60%{transform:translateX(0) rotate(4deg)}}
@keyframes ykrTwirl{from{transform:rotateY(0)}to{transform:rotateY(360deg)}}
@keyframes ykrWin{0%{transform:translateY(0) scale(1)}40%{transform:translateY(-26px) scale(1.18)}70%{transform:translateY(0) scale(.95,1.05)}100%{transform:translateY(0) scale(1.06)}}
@keyframes ykrPop{from{transform:scale(.4);opacity:0}to{transform:scale(1);opacity:1}}
@media (max-width:420px){.ykr-yoi{width:78px;left:-8px;bottom:-14px}.ykr-bub{left:40px;bottom:74px;font-size:11px}}
@media (prefers-reduced-motion:reduce){.ykr-wheel{transition-duration:.3s}.ykr-yoi,.ykr-yoi img,.ykr-bub{animation:none!important}}
