/* 가위바위보 오락실 — 모든 클래스는 rps- 접두어로 테마와 충돌하지 않게 한다 */
.rps-page{--rps-gold:#f4c542;--rps-navy:#1d2b73;--rps-led:#ff9d2e;--rps-win:#ff3b6b;--rps-draw:#ffc233;--rps-lose:#3d8bff;--rps-ink:#0b0920}
.rps-standalone{min-height:100vh;background:radial-gradient(circle at 50% 0,#2b2370,#0d0a24 70%);padding:12px 0 40px}
.rps{max-width:440px;margin:20px auto;padding:0 12px;font-family:'Jua',system-ui,-apple-system,'Malgun Gothic',sans-serif;color:#fff;box-sizing:border-box;-webkit-tap-highlight-color:transparent}
.rps-standalone .rps{margin-top:0}
.rps *,.rps *::before,.rps *::after{box-sizing:border-box}
.rps button{font-family:inherit}

.rps-top{display:flex;justify-content:space-between;align-items:center;padding:4px 4px 12px;font-size:14px;color:#b9b3e8}
.rps-top a{color:#b9b3e8;text-decoration:none}
.rps-top a:hover{color:#fff}

/* 캐비닛 */
.rps-cab{position:relative;background:linear-gradient(170deg,#332a7a,#1a1541 60%,#120e30);border-radius:28px;padding:14px 14px 12px;box-shadow:inset 0 0 0 3px #4a3fa0,inset 0 0 0 7px #1a1541,0 24px 50px rgba(0,0,0,.45)}

.rps-marquee{position:relative;text-align:center;background:var(--rps-ink);border-radius:16px;padding:14px 10px 12px;overflow:hidden;box-shadow:inset 0 0 0 2px #2c2566}
.rps-marquee h1{position:relative;margin:0;font-size:26px;font-weight:400;color:var(--rps-gold);letter-spacing:3px;text-shadow:0 0 10px rgba(244,197,66,.75),0 2px 0 #9b6b00}
.rps-bulbs{position:absolute;inset:3px 6px;pointer-events:none}
.rps-bulbs::before,.rps-bulbs::after{content:'';position:absolute;left:0;right:0;top:0;height:6px;background:radial-gradient(circle,var(--rps-gold) 0 2px,transparent 2.5px) 0 0/14px 6px repeat-x;animation:rps-bulb 1s steps(2) infinite}
.rps-bulbs::after{top:auto;bottom:0;background-position:7px 0;animation-delay:-.5s}
@keyframes rps-bulb{0%{opacity:1}100%{opacity:.25}}

/* 결과 램프 */
.rps-lamps{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin:12px 0}
.rps-lamp{border-radius:10px;padding:6px 0;text-align:center;font:900 14px/1.4 'Orbitron',sans-serif;letter-spacing:3px;background:var(--rps-ink);color:#3b3470;border:2px solid #2a2458;transition:all .15s}
.rps-lamp.on{color:#fff;animation:rps-blink .35s steps(2) 4}
.rps-lamp.on[data-lamp=W]{background:var(--rps-win);border-color:#ff9db5;box-shadow:0 0 22px var(--rps-win)}
.rps-lamp.on[data-lamp=D]{background:var(--rps-draw);border-color:#ffe39a;color:#3a2600;box-shadow:0 0 22px var(--rps-draw)}
.rps-lamp.on[data-lamp=L]{background:var(--rps-lose);border-color:#a9cbff;box-shadow:0 0 22px var(--rps-lose)}
@keyframes rps-blink{50%{filter:brightness(.55)}}

/* 룰렛 보드 */
.rps-board{position:relative;width:100%;aspect-ratio:1;container-type:inline-size;border-radius:50%;background:#0d0a26;box-shadow:0 0 0 4px #5b4fc0,0 0 0 8px #1a1541,0 0 0 10px #6d61d6,0 10px 30px rgba(0,0,0,.5)}
.rps-ring,.rps-hi{position:absolute;inset:3%;border-radius:50%;-webkit-mask:radial-gradient(closest-side,transparent 64%,#000 64.6%);mask:radial-gradient(closest-side,transparent 64%,#000 64.6%)}
.rps-hi{opacity:0;background:conic-gradient(from var(--rps-a,0deg),rgba(255,255,255,.95) 0 var(--rps-s,22.5deg),transparent 0);transition:opacity .15s}
.rps-hi.on{opacity:1}
.rps-hi.jackpot{animation:rps-flash .18s steps(2) 8}
@keyframes rps-flash{50%{opacity:.15}}
.rps-nums{position:absolute;inset:0;pointer-events:none}
.rps-num{position:absolute;transform:translate(-50%,-50%);font:900 6.2cqw/1 'Orbitron',sans-serif}
.rps-num.a{color:var(--rps-navy)}
.rps-num.b{color:var(--rps-gold)}
.rps-num.on{color:var(--rps-win);transform:translate(-50%,-50%) scale(1.3)}
.rps-center{position:absolute;inset:23.5%;border-radius:50%;background:#070512;box-shadow:0 0 0 1.4cqw #2c2566,0 0 0 2.4cqw #0d0a26,inset 0 0 4cqw rgba(0,0,0,.9)}
.rps-center canvas{position:absolute;inset:6%;width:88%;height:88%}

.rps-msg{min-height:48px;margin:12px 0 10px;padding:8px;border-radius:12px;background:var(--rps-ink);text-align:center;font-size:18px;line-height:32px;color:#e9e5ff;box-shadow:inset 0 0 0 2px #2a2458}
.rps-msg.win{color:var(--rps-gold);text-shadow:0 0 10px rgba(244,197,66,.6)}
.rps-msg.err{color:#ff8fa3}

/* 베팅/포인트 표시 */
.rps-panel{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.rps-disp{background:var(--rps-ink);border-radius:10px;padding:5px 10px 6px;box-shadow:inset 0 0 0 2px #2a2458;min-width:0}
.rps-disp span{display:block;font:700 10px 'Orbitron',sans-serif;letter-spacing:3px;color:#7f77c4}
.rps-disp b{display:block;font:900 21px/1.2 'Orbitron',sans-serif;color:var(--rps-led);text-align:right;text-shadow:0 0 8px rgba(255,157,46,.55);font-variant-numeric:tabular-nums;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}

.rps-chips{display:flex;gap:6px;margin-top:8px}
.rps-chip{flex:1;min-width:0;border:0;border-radius:999px;padding:7px 0;font:700 12px 'Orbitron',sans-serif;color:#cfc9ff;background:#282060;box-shadow:inset 0 0 0 2px #3d3490;cursor:pointer;transition:all .12s}
.rps-chip:hover{background:#342a7c}
.rps-chip.on{background:var(--rps-gold);color:#3a2600;box-shadow:0 0 12px rgba(244,197,66,.6)}
.rps-chip:disabled{opacity:.35;cursor:default}

/* 가위바위보 버튼 */
.rps-hands{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin-top:14px}
.rps-hand{--c1:#5ee0b8;--c2:#12a37a;--c3:#07684d;position:relative;aspect-ratio:1;border:0;border-radius:50%;cursor:pointer;color:#fff;background:radial-gradient(circle at 35% 28%,var(--c1),var(--c2) 70%);box-shadow:0 7px 0 var(--c3),0 10px 18px rgba(0,0,0,.35),inset 0 -4px 0 rgba(0,0,0,.15);transition:transform .08s,box-shadow .08s,filter .2s}
.rps-hand[data-hand="1"]{--c1:#ff8aa6;--c2:#e23462;--c3:#8f1236}
.rps-hand[data-hand="2"]{--c1:#8cb8ff;--c2:#3b73e6;--c3:#1b3f93}
.rps-hand i{display:block;font-style:normal;font-size:clamp(30px,10vw,42px);line-height:1}
.rps-hand small{display:block;font-size:14px;margin-top:2px;text-shadow:0 1px 0 rgba(0,0,0,.3)}
.rps-hand:hover{filter:brightness(1.08)}
.rps-hand:active,.rps-hand.pick{transform:translateY(5px);box-shadow:0 2px 0 var(--c3),0 4px 8px rgba(0,0,0,.35),inset 0 -4px 0 rgba(0,0,0,.15)}
.rps-hand.pick{outline:3px solid #fff;outline-offset:3px}
.rps.busy .rps-hand:not(.pick){filter:grayscale(.7) brightness(.6);cursor:default}
.rps-hand:focus-visible,.rps-chip:focus-visible,.rps-sound:focus-visible{outline:3px solid var(--rps-gold);outline-offset:3px}

.rps-foot{display:flex;align-items:center;gap:8px;margin-top:14px;font-size:13px;color:#9b94d6}
.rps-hist{flex:1;display:flex;gap:3px;overflow:hidden;min-width:0}
.rps-hist i{flex:none;font:700 9px/18px 'Orbitron',sans-serif;font-style:normal;min-width:18px;height:18px;padding:0 3px;border-radius:5px;text-align:center;color:#fff}
.rps-hist i.W{background:var(--rps-win)}
.rps-hist i.D{background:var(--rps-draw);color:#3a2600}
.rps-hist i.L{background:#39327a}
.rps-sound{border:0;background:#282060;border-radius:10px;width:36px;height:30px;font-size:15px;cursor:pointer}

.rps-login{position:absolute;left:14px;right:14px;bottom:12px;padding:16px;border-radius:16px;text-align:center;background:rgba(11,9,32,.92);box-shadow:0 0 0 2px var(--rps-gold)}
.rps-login p{margin:0 0 10px;font-size:16px}
.rps-login a{display:inline-block;padding:8px 22px;border-radius:999px;background:var(--rps-gold);color:#3a2600;text-decoration:none;font-size:16px}

/* 하단 안내 */
.rps-info{display:grid;gap:12px;margin-top:16px}
.rps-info section{background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.1);border-radius:16px;padding:14px 16px;color:#d9d5f5;font-family:system-ui,-apple-system,'Malgun Gothic',sans-serif;font-size:14px;line-height:1.6}
.rps-info h2{margin:0 0 8px;font:400 17px 'Jua',sans-serif;color:#fff}
.rps-info ul,.rps-info ol{margin:0;padding-left:20px}
.rps-info ul{list-style:none;padding:0}
.rps-info ul li{display:flex;gap:8px;align-items:baseline;padding:3px 0;border-bottom:1px dashed rgba(255,255,255,.08)}
.rps-info ul li b{flex:1;font-weight:600;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.rps-info ul li em{font:900 12px 'Orbitron',sans-serif;color:var(--rps-win);font-style:normal}
.rps-info ul li span{color:var(--rps-gold);font-variant-numeric:tabular-nums}
.rps-info p{margin:0}
.rps-keys{margin-top:8px!important;color:#9b94d6}
.rps-info kbd{display:inline-block;border:1px solid rgba(255,255,255,.25);border-radius:4px;padding:0 5px;font-size:12px}

/* 사이트 레이아웃 안(밝은 배경)에 들어갈 때 안내 카드 색 보정 */
.rps-page:not(.rps-standalone) .rps-info section{background:#1a1541;border-color:#2c2566}
.rps-page:not(.rps-standalone) .rps-top{display:none}

@media (prefers-reduced-motion:reduce){.rps-bulbs::before,.rps-bulbs::after,.rps-lamp.on,.rps-hi.jackpot{animation:none}}
