.row-btns{display:flex;gap:8px;margin-top:8px}
.cta{margin-top:24px;text-align:center}

.picked{display:flex;flex-wrap:wrap;gap:14px;justify-content:center;padding:24px 0}
.picked .person{padding:18px 28px;border-radius:18px;
  background:linear-gradient(135deg,rgba(125,108,255,.25),rgba(38,164,255,.18));
  border:1px solid rgba(141,225,255,.3);
  font-size:24px;font-weight:700;color:var(--ink);letter-spacing:.05em;
  box-shadow:0 10px 40px rgba(125,108,255,.25);
  animation:pop .35s ease-out}
@keyframes pop{0%{transform:scale(.8);opacity:0}60%{transform:scale(1.08)}100%{transform:scale(1);opacity:1}}

.history{display:flex;flex-wrap:wrap;gap:6px}
.history .hist-chip{padding:5px 11px;border-radius:999px;
  background:var(--paper-2);border:1px solid var(--line);
  font-size:12px;color:var(--ink-soft)}
.history .hist-chip.recent{color:var(--primary);border-color:rgba(141,225,255,.3);background:var(--sage-soft)}
.history-empty{color:var(--ink-soft);font-size:13px;padding:8px 0}

/* 슬롯머신 오버레이 */
.slot-overlay{position:fixed;inset:0;z-index:999;display:flex;align-items:center;justify-content:center;
  background:rgba(10,10,18,.88);backdrop-filter:blur(20px)}
.slot-name{font-family:"Space Grotesk","Noto Sans KR",sans-serif;font-size:min(18vw,180px);font-weight:700;
  color:#fff;text-shadow:0 4px 20px rgba(0,0,0,.45);
  letter-spacing:-.02em;line-height:1;animation:slot-shake .08s linear infinite}
.slot-overlay.done .slot-name{animation:slot-pop .5s ease-out}
@keyframes slot-shake{0%,100%{transform:translateY(0)}50%{transform:translateY(-8px)}}
@keyframes slot-pop{0%{transform:scale(1)}30%{transform:scale(1.2)}60%{transform:scale(.95)}100%{transform:scale(1)}}

/* ===== 옵션: 연출 선택 · 미션 카드 ===== */
.anim-style{margin:6px 0 10px}
.mission-box{display:flex;flex-direction:column;gap:6px;margin:4px 0 10px;padding-left:46px}
.mission-label{font-size:11px;color:var(--ink-soft);letter-spacing:.04em}

/* ============================================================
   🎰 캡슐 가챠 머신
   ============================================================ */
.gacha-overlay{position:fixed;inset:0;z-index:999;display:flex;align-items:center;justify-content:center;
  background:rgba(10,10,18,.92);backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px)}
.gacha-close{position:fixed;top:18px;right:18px;z-index:2}
.gacha-stage{display:flex;flex-direction:column;align-items:center;gap:18px;padding:20px;width:100%;max-width:560px}
.gacha-progress{font-family:"Space Grotesk","Noto Sans KR",sans-serif;color:var(--primary);letter-spacing:.24em;font-size:13px}
.gacha-machine-wrap{display:flex;flex-direction:column;align-items:center;gap:26px}
.gacha-key{font-size:11px;opacity:.7;border:1px solid var(--line);border-radius:5px;padding:1px 6px;margin-left:4px}

/* 머신 본체 */
.gacha-machine{width:min(300px,74vw);user-select:none}
.gacha-machine.shaking{animation:gacha-shake .12s linear infinite}
@keyframes gacha-shake{
  0%,100%{transform:translate(0,0) rotate(0)}
  25%{transform:translate(-5px,2px) rotate(-1.6deg)}
  50%{transform:translate(4px,-2px) rotate(1.2deg)}
  75%{transform:translate(-3px,-1px) rotate(-1deg)}}

/* 투명 돔 */
.gacha-dome{position:relative;width:100%;aspect-ratio:1/1;border-radius:50%;overflow:hidden;z-index:0;
  background:radial-gradient(circle at 32% 26%, rgba(255,255,255,.30), var(--line-soft) 45%, var(--sage-soft) 68%, rgba(0,0,0,.28));
  border:4px solid var(--line);
  box-shadow:inset 0 -20px 44px rgba(0,0,0,.38), 0 12px 44px rgba(125,108,255,.28)}
.gacha-dome::after{content:"";position:absolute;top:9%;left:15%;width:26%;height:13%;border-radius:50%;
  background:rgba(255,255,255,.38);filter:blur(2px);transform:rotate(-24deg)}

/* 돔 속 캡슐들 */
.gacha-cap{position:absolute;width:17%;aspect-ratio:1/1;border-radius:50%;
  background:linear-gradient(180deg,var(--c,#ff6b8a) 0%,var(--c,#ff6b8a) 48%,#f4f6ff 52%,#c9d1e6 100%);
  box-shadow:inset -3px -4px 6px rgba(0,0,0,.22), inset 2px 3px 4px rgba(255,255,255,.5), 0 4px 10px var(--paper-2);
  animation:gacha-idle var(--d,3s) ease-in-out var(--dl,0s) infinite alternate}
@keyframes gacha-idle{
  0%{transform:translate(0,0) rotate(0)}
  100%{transform:translate(var(--tx,8px),var(--ty,-10px)) rotate(var(--r,40deg))}}
.gacha-machine.shaking .gacha-cap{animation:gacha-wild .2s ease-in-out var(--dl,0s) infinite alternate}
@keyframes gacha-wild{
  0%{transform:translate(calc(var(--tx,8px) * -1),-30px) rotate(-70deg)}
  100%{transform:translate(var(--tx,10px),18px) rotate(90deg)}}

/* 몸통(다이얼 + 배출구) */
.gacha-body{position:relative;margin:-16px auto 0;width:84%;height:118px;z-index:1;
  border-radius:16px 16px 24px 24px;
  background:linear-gradient(180deg,#ff5d7e,#d23a63 58%,#a92e50);
  border:1px solid var(--line);
  box-shadow:0 18px 50px rgba(210,58,99,.35), inset 0 2px 0 rgba(255,255,255,.25)}
.gacha-dial{position:absolute;left:16%;top:50%;transform:translateY(-50%);width:54px;height:54px;border-radius:50%;
  background:radial-gradient(circle at 35% 35%,#fff,#d8dce8 60%,#a7aec4);
  box-shadow:0 5px 12px rgba(0,0,0,.35), inset 0 -3px 6px rgba(0,0,0,.15)}
.gacha-dial::after{content:"";position:absolute;left:50%;top:11%;width:7px;height:78%;border-radius:4px;
  background:linear-gradient(180deg,#3c4257,#5a6178);transform:translateX(-50%)}
.gacha-machine.shaking .gacha-dial{animation:gacha-dial 1.5s ease-in-out}
@keyframes gacha-dial{to{transform:translateY(-50%) rotate(720deg)}}
.gacha-chute{position:absolute;right:14%;top:50%;transform:translateY(-50%);width:72px;height:58px;border-radius:12px;
  background:linear-gradient(180deg,#1a1626,#080810 70%);
  box-shadow:inset 0 8px 16px rgba(0,0,0,.85), 0 0 0 3px rgba(255,255,255,.14)}
.gacha-drop{position:absolute;right:calc(14% + 14px);top:calc(50% - 22px);width:44px;height:44px;border-radius:50%;z-index:2;
  background:linear-gradient(180deg,var(--c,#ffb84d) 0%,var(--c,#ffb84d) 48%,#f4f6ff 52%,#c9d1e6 100%);
  box-shadow:inset -3px -4px 6px var(--paper-2), 0 6px 14px rgba(0,0,0,.4);
  animation:gacha-fall .65s cubic-bezier(.3,.7,.4,1.3) forwards}
@keyframes gacha-fall{
  0%{transform:translateY(-96px) scale(.55) rotate(-90deg);opacity:0}
  40%{opacity:1}
  68%{transform:translateY(8px) scale(1) rotate(10deg)}
  84%{transform:translateY(-7px) rotate(-4deg)}
  100%{transform:translateY(3px) rotate(0)}}
.gacha-feet{margin:0 auto;width:60%;height:14px;border-radius:0 0 12px 12px;
  background:linear-gradient(180deg,#7c2340,#521729);box-shadow:0 10px 24px rgba(0,0,0,.4)}

/* 개봉 화면 */
.gacha-reveal{display:flex;flex-direction:column;align-items:center;gap:20px}
.gacha-big{position:relative;width:min(230px,58vw);aspect-ratio:1/1;cursor:pointer;
  animation:gacha-appear .5s cubic-bezier(.2,.9,.3,1.25)}
@keyframes gacha-appear{0%{transform:scale(.2) translateY(140px);opacity:0}100%{transform:scale(1) translateY(0);opacity:1}}
.gacha-half{position:absolute;left:0;width:100%;height:53%;
  transition:transform .55s cubic-bezier(.3,.7,.3,1.35), opacity .55s ease}
.gacha-half.top{top:0;border-radius:999px 999px 34px 34px;
  background:radial-gradient(circle at 34% 32%, rgba(255,255,255,.5), rgba(255,255,255,0) 55%), var(--c,#ff6b8a);
  box-shadow:inset -8px -10px 20px var(--paper-2), 0 6px 24px rgba(0,0,0,.35)}
.gacha-half.bottom{bottom:0;border-radius:34px 34px 999px 999px;
  background:radial-gradient(circle at 34% 45%, #ffffff, #d6dcee 70%, #b9c2dc);
  box-shadow:inset -8px 10px 20px rgba(0,0,0,.18), 0 14px 34px rgba(0,0,0,.4)}
.gacha-big:not(.open):hover .gacha-half.top{transform:translateY(-5px) rotate(-2deg)}
.gacha-big.open{cursor:default}
.gacha-big.open .gacha-half.top{transform:translateY(-110px) rotate(-26deg) scale(.9);opacity:0}
.gacha-big.open .gacha-half.bottom{transform:translateY(110px) rotate(20deg) scale(.9);opacity:0}
.gacha-name{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;text-align:center;
  font-family:"Space Grotesk","Noto Sans KR",sans-serif;font-size:min(12vw,72px);font-weight:900;line-height:1.15;
  color:#fff;text-shadow:0 4px 20px rgba(0,0,0,.45);
  letter-spacing:-.02em;animation:gacha-namepop .5s cubic-bezier(.2,.9,.3,1.4);
  text-shadow:none;white-space:nowrap}
@keyframes gacha-namepop{0%{transform:scale(.3);opacity:0}70%{transform:scale(1.12)}100%{transform:scale(1);opacity:1}}
.gacha-hint{color:var(--primary);font-size:15px;animation:gacha-hint 1.1s ease-in-out infinite}
@keyframes gacha-hint{0%,100%{opacity:.55;transform:translateY(0)}50%{opacity:1;transform:translateY(-4px)}}

/* 미션/찬스 카드 */
.gacha-card{perspective:900px;width:250px;height:140px}
.gacha-card-inner{position:relative;width:100%;height:100%;transform-style:preserve-3d;
  transition:transform .65s cubic-bezier(.3,.7,.3,1.15)}
.gacha-card.flip .gacha-card-inner{transform:rotateY(180deg)}
.gacha-card-face{position:absolute;inset:0;backface-visibility:hidden;-webkit-backface-visibility:hidden;
  border-radius:16px;display:flex;align-items:center;justify-content:center;padding:16px;text-align:center}
.gacha-card-face.front{font-family:"Space Grotesk",sans-serif;font-size:20px;letter-spacing:.3em;color:var(--ink);font-weight:700;
  background:linear-gradient(135deg,#7d6cff,#26a4ff);
  box-shadow:0 14px 40px rgba(125,108,255,.4)}
.gacha-card-face.back{transform:rotateY(180deg);font-size:20px;font-weight:700;color:var(--ink);line-height:1.4;
  background:linear-gradient(135deg,rgba(255,184,77,.28),rgba(255,107,138,.22)), #191428;
  border:1px solid rgba(255,184,77,.45);
  box-shadow:0 14px 40px rgba(255,184,77,.25)}

@media(max-width:520px){
  .gacha-body{height:96px}
  .gacha-dial{width:44px;height:44px}
  .gacha-chute{width:58px;height:48px}
  .gacha-name{font-size:min(11vw,44px)}
}