/* DonutRich — Rock Paper Scissors (Robot vs you, 3D cubes). Loaded after main.css. */
/* --- Rock Paper Scissors --- */
#rps{--s:132px;padding:18px 18px 20px;background:radial-gradient(ellipse at 50% -10%,rgba(160,180,210,.12),transparent 55%),var(--p1)}
.rps-head{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px;margin-bottom:12px}
.rps-stat{padding:8px 12px;border-radius:12px;background:linear-gradient(180deg,#1a1820,#111016);border:1px solid var(--line2);min-width:0}
.rps-stat span{display:block;font-size:.6rem;letter-spacing:.12em;text-transform:uppercase;color:var(--mute);font-weight:600}
.rps-stat b{font-family:var(--font-d);font-size:1.15rem;color:var(--sun);font-variant-numeric:tabular-nums;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;display:block}
.rps-arena{position:relative;display:grid;grid-template-columns:1fr auto 1fr;align-items:center;min-height:calc(var(--s) * 2.5);padding:26px 10px 34px;border-radius:22px;overflow:hidden;border:1.5px solid rgba(212,175,55,.3);
 background:radial-gradient(ellipse at 22% 78%,rgba(95,140,255,.16),transparent 45%),radial-gradient(ellipse at 78% 78%,rgba(229,99,111,.16),transparent 45%),radial-gradient(ellipse at 50% 0%,rgba(255,226,140,.12),transparent 60%),repeating-linear-gradient(0deg,rgba(255,255,255,.02) 0 2px,transparent 2px 6px),linear-gradient(180deg,#17141d,#08070b);
 box-shadow:0 20px 50px rgba(0,0,0,.5),inset 0 0 60px rgba(0,0,0,.5);transition:border-color .4s,box-shadow .4s}
.rps-arena:before{content:"";position:absolute;left:-10%;right:-10%;bottom:-38%;height:70%;background:repeating-linear-gradient(90deg,rgba(212,175,55,.12) 0 1px,transparent 1px 60px),repeating-linear-gradient(0deg,rgba(212,175,55,.12) 0 1px,transparent 1px 40px);transform:perspective(420px) rotateX(62deg);transform-origin:50% 0;opacity:.7;pointer-events:none;-webkit-mask-image:linear-gradient(180deg,#000,transparent 85%);mask-image:linear-gradient(180deg,#000,transparent 85%)}
.rps-arena.win{border-color:rgba(95,211,107,.7);box-shadow:0 0 40px rgba(95,211,107,.25),inset 0 0 60px rgba(0,0,0,.5)}
.rps-arena.lose{border-color:rgba(229,99,111,.7);box-shadow:0 0 40px rgba(229,99,111,.25),inset 0 0 60px rgba(0,0,0,.5)}
.rps-arena.shake{animation:rpssh .45s}
@keyframes rpssh{15%{transform:translate(-7px,3px)}35%{transform:translate(6px,-4px)}55%{transform:translate(-4px,2px)}75%{transform:translate(3px,-1px)}}
.rps-fx{position:absolute;inset:0;width:100%;height:100%;z-index:4;pointer-events:none;background:transparent;border-radius:0}
.rps-side{position:relative;z-index:2;display:flex;flex-direction:column;align-items:center;gap:6px}
.rps-who{display:flex;align-items:center;gap:8px;max-width:100%;padding:4px 14px 4px 4px;border-radius:999px;background:rgba(0,0,0,.5);border:1px solid rgba(95,140,255,.55);box-shadow:0 0 18px rgba(95,140,255,.18);transition:transform .3s,box-shadow .3s,border-color .3s}
.rps-who b{font-size:.78rem;letter-spacing:.08em;text-transform:uppercase;color:#c3d4ff;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;min-width:0}
.rps-who.bot{border-color:rgba(229,99,111,.55);box-shadow:0 0 18px rgba(229,99,111,.18)}.rps-who.bot b{color:#ffb0b8}
.rps-av{display:block;width:30px;height:30px;flex:none;border-radius:8px;overflow:hidden;background:#15141a;image-rendering:pixelated}
.rps-av img{width:100%;height:100%;display:block;image-rendering:pixelated}
.rps-robot{background:center/100% no-repeat;transition:filter .3s}
.rps-who.hot{transform:scale(1.08)}.rps-who.you.hot{box-shadow:0 0 26px rgba(95,140,255,.55)}
.rps-who.bot.hot{box-shadow:0 0 26px rgba(255,74,86,.6)}.rps-who.bot.hot .rps-robot{filter:drop-shadow(0 0 6px #ff4a56) brightness(1.25)}
.rps-who.ko{animation:rpsko .5s}.rps-who.ko .rps-av{filter:grayscale(1) brightness(.7)}
@keyframes rpsko{20%{transform:translateX(-5px) rotate(-3deg)}40%{transform:translateX(5px) rotate(3deg)}60%{transform:translateX(-3px)}80%{transform:translateX(2px)}}
.rps-scene{position:relative;width:calc(var(--s) * 1.5);height:calc(var(--s) * 1.7);display:grid;place-items:center;perspective:760px;perspective-origin:50% 30%}
.rps-cube{position:relative;width:var(--s);height:var(--s);transform-style:preserve-3d;will-change:transform;z-index:1}
.rps-f{position:absolute;inset:0;border-radius:12%;overflow:hidden;background:radial-gradient(circle at 32% 26%,rgba(255,255,255,.28),transparent 46%),linear-gradient(160deg,var(--fa),var(--fb));box-shadow:inset 0 0 0 calc(var(--s) * .028) var(--fe),inset 0 0 0 calc(var(--s) * .06) rgba(0,0,0,.35),inset 0 calc(var(--s) * -.08) calc(var(--s) * .14) rgba(0,0,0,.45)}
.rps-f span{position:absolute;inset:16%;background:center/contain no-repeat;image-rendering:pixelated;filter:drop-shadow(0 calc(var(--s) * .03) 0 rgba(0,0,0,.45))}
.rps-f i{position:absolute;inset:0;background:#000;opacity:.2;pointer-events:none}
.rps-core{position:absolute;inset:4%;background:#0b0a0e}
.rps-core.x{transform:rotateY(90deg)}.rps-core.y{transform:rotateX(90deg)}
.rps-sh{position:absolute;left:50%;bottom:4%;width:calc(var(--s) * 1.05);height:calc(var(--s) * .2);margin-left:calc(var(--s) * -.525);border-radius:50%;background:radial-gradient(ellipse,rgba(0,0,0,.8),transparent 70%);pointer-events:none}
.rps-vs{position:relative;z-index:3;display:flex;flex-direction:column;align-items:center;gap:8px;min-width:90px}
.rps-vs b{font-family:var(--font-d);font-size:2.2rem;font-weight:700;letter-spacing:.06em;background:linear-gradient(180deg,#fff3b8,#e8b84a 55%,#a8780f);-webkit-background-clip:text;background-clip:text;color:transparent;filter:drop-shadow(0 3px 10px rgba(255,200,60,.35))}
#rpscd{min-height:1.6em;font-family:var(--font-d);font-weight:700;font-size:1.05rem;letter-spacing:.06em;color:#fff;text-transform:uppercase;text-shadow:0 2px 12px rgba(0,0,0,.8);white-space:nowrap}
#rpscd.go{animation:rpscd .32s cubic-bezier(.2,1.6,.4,1)}#rpscd.big{font-size:1.5rem;color:var(--sun)}
@keyframes rpscd{from{transform:scale(1.8);opacity:0}}
.rps-banner{position:absolute;left:50%;bottom:14px;z-index:5;transform:translateX(-50%);display:flex;align-items:baseline;gap:12px;padding:8px 20px;border-radius:999px;background:rgba(8,7,10,.85);border:1.5px solid var(--line3);white-space:nowrap;opacity:0;pointer-events:none}
.rps-banner.on{opacity:1;animation:rpsbn .45s cubic-bezier(.2,1.4,.3,1)}
@keyframes rpsbn{from{opacity:0;transform:translate(-50%,16px) scale(.85)}}
.rps-banner b{font-family:var(--font-d);font-size:1.15rem;letter-spacing:.1em;text-transform:uppercase}
.rps-banner span{font-family:var(--font-d);font-weight:600;font-variant-numeric:tabular-nums}
.rps-banner.w{border-color:#5fd36b;box-shadow:0 0 26px rgba(95,211,107,.35)}.rps-banner.w b,.rps-banner.w span{color:#7fe3a0}
.rps-banner.l{border-color:#f0646e;box-shadow:0 0 26px rgba(240,100,110,.3)}.rps-banner.l b{color:#ff8a96}.rps-banner.l span{color:var(--mute)}
.rps-banner.d b{color:var(--sun)}.rps-banner.d span{color:var(--mute)}
.rps-pick{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;margin:14px 0 12px}
.rps-ch{position:relative;display:flex;flex-direction:column;align-items:center;gap:2px;padding:12px 8px 10px;border-radius:16px;border:1.5px solid var(--line);background:linear-gradient(180deg,#1b1922,#0f0e13);color:var(--text);font:inherit;transition:transform .2s,border-color .2s,box-shadow .2s,opacity .2s}
.rps-ch[data-ch="0"]{--c:159,179,201}.rps-ch[data-ch="1"]{--c:55,179,146}.rps-ch[data-ch="2"]{--c:214,64,79}
.rps-ch .rps-ico{width:56px;height:56px;background:center/contain no-repeat;image-rendering:pixelated;filter:drop-shadow(0 4px 4px rgba(0,0,0,.5));transition:transform .25s cubic-bezier(.2,1.6,.4,1)}
.rps-ch b{font-size:.92rem;letter-spacing:.08em;text-transform:uppercase}
.rps-ch small{font-size:.68rem;color:var(--mute)}
.rps-ch kbd{position:absolute;top:7px;right:8px;font:600 .62rem var(--font);color:var(--dim);border:1px solid var(--line2);border-radius:5px;padding:1px 5px}
.rps-ch:hover:not(:disabled){transform:translateY(-3px);border-color:rgba(var(--c),.8)}
.rps-ch:hover:not(:disabled) .rps-ico{transform:scale(1.1) rotate(-5deg)}
.rps-ch.on{border-color:rgb(var(--c));background:radial-gradient(ellipse at 50% 0%,rgba(var(--c),.28),transparent 70%),linear-gradient(180deg,#1b1922,#0f0e13);box-shadow:0 0 24px rgba(var(--c),.3),inset 0 0 22px rgba(var(--c),.12)}
.rps-ch.on b{color:rgb(var(--c))}
.rps-ch:disabled{cursor:default}.rps-ch:disabled:not(.on){opacity:.4}
.rps-row{margin-bottom:6px}
#rpsgo{min-width:200px;min-height:50px;font-size:1.05rem;letter-spacing:.06em;text-transform:uppercase}
.rps-hist{display:flex;gap:6px;flex-wrap:wrap;justify-content:center;min-height:34px;margin-top:6px}
.rps-hist i{display:flex;align-items:center;gap:3px;padding:3px 7px;border-radius:10px;font-style:normal;background:linear-gradient(180deg,#1b1922,#111016);border:1px solid var(--line2);border-bottom:3px solid #6b6b74;animation:fi .3s}
.rps-hist i.w{border-bottom-color:var(--mint)}.rps-hist i.l{border-bottom-color:var(--bad)}.rps-hist i.d{border-bottom-color:var(--sun)}
.rps-hist u{display:block;width:20px;height:20px;background:center/contain no-repeat;image-rendering:pixelated}
.rps-hist em{font-style:normal;font-size:.6rem;color:var(--dim);text-transform:uppercase}
.rps-keys{text-align:center;margin:8px 0 0}
@media (max-width:899px){
  #rps{--s:100px}
  .rps-head{gap:5px;margin-bottom:10px}.rps-stat{padding:6px 7px}.rps-stat span{font-size:.5rem;letter-spacing:.06em}.rps-stat b{font-size:.92rem}
  .rps-arena{padding:20px 4px 54px}
  .rps-vs{min-width:56px}.rps-vs b{font-size:1.6rem}#rpscd{font-size:.82rem}#rpscd.big{font-size:1.1rem}
  .rps-keys{display:none}
  #rpsgo{flex:1 1 100%}
}
@media (max-width:420px){
  #rps{--s:78px}
  .rps-scene{width:calc(var(--s) * 1.45)}
  .rps-ch{padding:10px 4px 8px}.rps-ch .rps-ico{width:44px;height:44px}.rps-ch small,.rps-ch kbd{display:none}
}
@media (hover:none){.rps-ch kbd{display:none}}
html[data-theme=light] .rps-arena,html[data-theme=light] .rps-ch,html[data-theme=light] .rps-stat,html[data-theme=light] .rps-hist i{--text:#f4efe1;--mute:#b5ac94;--line:#3a3425;--line2:rgba(255,255,255,.08);--sun:#f2cf66;color:#f4efe1}

/* 3D choice tiles: thickness + press-down */
.rps-pick{perspective:700px}
.rps-ch{box-shadow:0 6px 0 #050407,0 12px 22px rgba(0,0,0,.45),inset 0 1px 0 rgba(255,255,255,.08);transition:transform .18s,box-shadow .18s,border-color .2s,opacity .2s}
.rps-ch:hover:not(:disabled){transform:translateY(-3px) rotateX(8deg)}
.rps-ch:active:not(:disabled){transform:translateY(5px);box-shadow:0 1px 0 #050407,0 4px 10px rgba(0,0,0,.4)}
.rps-ch.on{transform:translateY(2px);box-shadow:0 4px 0 rgba(var(--c),.55),0 0 24px rgba(var(--c),.3),inset 0 0 22px rgba(var(--c),.12)}
@media (max-width:420px){.rps-who{padding-right:10px}.rps-who b{font-size:.66rem;max-width:84px}.rps-av{width:24px;height:24px}}