/* random-kit.css — coin flip, random number and random picker (assets/js/random-kit.js) */
#studio.ps{display:block}
.rk{display:grid;grid-template-columns:minmax(0,1fr) 300px;gap:16px;align-items:start;text-align:left;color:var(--text,#1e2635)}
.rk-main{min-width:0;display:flex;flex-direction:column;gap:14px}
.rk-side{position:sticky;top:calc(var(--ps-top,0px) + 12px);display:flex;flex-direction:column;gap:12px;min-width:0}
.rk-side .ps-box h3{margin-bottom:10px!important}
.rk-card{background:var(--panel,#fff);border:1px solid var(--border,#e4e9f2);border-radius:16px;padding:16px 18px;min-width:0}
.rk-card h3{margin:0 0 10px;font-size:15px}
.rk-card h3 small{font-weight:500;color:var(--faint,#8a94a7)}
.rk-row{display:flex;gap:10px;align-items:center;flex-wrap:wrap}
.rk-c{justify-content:center}
.rk-two{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.rk-note{font-size:12.5px;color:var(--muted,#5a6377);margin:0;line-height:1.5}
.rk-in{height:38px;border:1px solid var(--border,#e4e9f2);border-radius:10px;padding:0 10px;background:var(--panel,#fff);color:inherit;font:inherit;font-size:14px;box-sizing:border-box}
.rk-ta{width:100%;min-height:220px;box-sizing:border-box;border:1px solid var(--border,#e4e9f2);border-radius:10px;padding:10px 12px;font:14px/1.55 system-ui,sans-serif;resize:vertical;background:var(--panel,#fff);color:inherit}
.rk .ts-chips{display:flex;flex-wrap:wrap;gap:6px}
.rk .ts-chips button{padding:7px 12px;border-radius:999px;border:1px solid var(--border-2,#dfe4ee);background:var(--panel,#fff);color:var(--text,#1e2635);font:600 13px inherit;font-family:inherit;cursor:pointer}
.rk .ts-chips button.on,.rk .ts-chips button:hover{border-color:var(--accent,#4f6ef7);background:var(--accent-soft,#eef1fe);color:var(--accent-dark,#3a52c4)}
.rk-big{min-width:180px;font-size:17px!important;padding:12px 28px!important;width:auto}
.rk-stage{display:flex;flex-direction:column;align-items:center;gap:16px;padding:28px 18px;text-align:center}
/* coin */
.rk-coins{display:flex;flex-wrap:wrap;gap:18px;justify-content:center;perspective:900px}
.rk-coin{width:200px;height:200px;border:0;background:none;padding:0;cursor:pointer;perspective:900px}
.rk-coins.some .rk-coin{width:110px;height:110px}.rk-coins.many{gap:8px}.rk-coins.many .rk-coin{width:54px;height:54px}
.rk-coinin{position:relative;width:100%;height:100%;transform-style:preserve-3d}
.rk-coin.toss{animation:rktoss 1s cubic-bezier(.3,.6,.3,1)}
@keyframes rktoss{0%{transform:translateY(0)}40%{transform:translateY(-60px) scale(1.08)}100%{transform:translateY(0)}}
.rk-face{position:absolute;inset:0;border-radius:50%;backface-visibility:hidden;-webkit-backface-visibility:hidden;display:flex;align-items:center;justify-content:center;background:radial-gradient(circle at 35% 30%,#fff8 0,transparent 40%),linear-gradient(145deg,var(--c1),var(--c2));box-shadow:inset 0 0 0 7px rgba(0,0,0,.12),inset 0 0 0 11px rgba(255,255,255,.35),0 8px 18px rgba(15,23,42,.25);overflow:hidden}
.rk-face span{font:800 34px/1 system-ui,sans-serif;color:rgba(0,0,0,.55);text-shadow:0 1px 0 rgba(255,255,255,.6);padding:0 14px;overflow-wrap:anywhere}
.rk-coins.some .rk-face span{font-size:19px}.rk-coins.many .rk-face span{font-size:10px;padding:0 4px}
.rk-face img{width:100%;height:100%;object-fit:cover;border-radius:50%}
.rk-b{transform:rotateY(180deg)}
.rk-result{font-size:20px;color:var(--muted,#5a6377);min-height:30px}
.rk-result b{color:var(--text,#1e2635);font-size:30px}
.rk-win{margin-top:6px;font-size:17px;font-weight:700;color:#15803d}.rk-sub{margin-top:4px;font-size:14px}
.rk-statgrid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px}
.rk-statgrid>div{background:var(--field,#f6f8fb);border-radius:12px;padding:10px 12px;min-width:0}
.rk-statgrid span{display:block;font-size:12px;color:var(--muted,#5a6377);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.rk-statgrid b{font-size:22px;font-variant-numeric:tabular-nums}
.rk-statgrid i{display:block;font-style:normal;font-size:12px;color:var(--faint,#8a94a7)}
.rk-ratio{height:8px;border-radius:4px;background:#94a3b8;margin-top:12px;overflow:hidden}
.rk-ratio i{display:block;height:100%;background:#f5c542;transition:width .3s}
.rk-hist{display:flex;flex-wrap:wrap;gap:4px;max-height:120px;overflow:auto}
.rk-hist i{width:24px;height:24px;border-radius:50%;display:flex;align-items:center;justify-content:center;font:700 11px system-ui;font-style:normal;background:#f5c542;color:#6b4f00}
.rk-hist i.b{background:#cbd5e1;color:#334155}
.rk-styles{display:grid;grid-template-columns:1fr 1fr;gap:6px;margin-bottom:10px}
.rk-styles button{display:flex;align-items:center;gap:8px;border:1.5px solid var(--border-2,#dfe4ee);background:var(--panel,#fff);border-radius:10px;padding:7px 9px;font:600 13px inherit;font-family:inherit;color:inherit;cursor:pointer}
.rk-styles button i{width:18px;height:18px;border-radius:50%;background:linear-gradient(145deg,var(--c1),var(--c2));flex:none}
.rk-styles button.on{border-color:var(--accent,#4f6ef7);background:var(--accent-soft,#eef1fe)}
/* number */
.rk-big-out{min-height:120px;display:flex;align-items:center;justify-content:center;width:100%}
.rk-num{font:800 clamp(56px,12vw,110px)/1 system-ui,sans-serif;color:var(--accent-dark,#3a52c4);font-variant-numeric:tabular-nums;letter-spacing:-.02em;overflow-wrap:anywhere}
.rk-num.pop{animation:rkpop .25s}
@keyframes rkpop{50%{transform:scale(1.12)}}
.rk-many{display:flex;flex-wrap:wrap;gap:6px;justify-content:center;max-height:340px;overflow:auto}
.rk-many span{min-width:44px;padding:8px 10px;border-radius:10px;background:var(--accent-soft,#eef1fe);color:var(--accent-dark,#3a52c4);font:700 17px system-ui;font-variant-numeric:tabular-nums}
.rk-sum{margin:0;font-size:13.5px;color:var(--muted,#5a6377)}
.rk-dice{display:flex;flex-wrap:wrap;gap:14px;justify-content:center}
.rk-die{width:84px;height:84px;border-radius:16px;background:#fff;border:2px solid #e2e8f0;box-shadow:0 6px 14px rgba(15,23,42,.15);display:grid;grid-template-columns:repeat(3,1fr);grid-template-rows:repeat(3,1fr);padding:10px;box-sizing:border-box}
.rk-die i{display:block;margin:auto;width:14px;height:14px;border-radius:50%}
.rk-die i.p{background:#111827}
.rk-poly{width:84px;height:84px;display:flex;align-items:center;justify-content:center;font:800 32px system-ui;color:#fff;background:linear-gradient(145deg,#7c3aed,#4f46e5);clip-path:polygon(50% 0,100% 25%,100% 75%,50% 100%,0 75%,0 25%)}
.roll{animation:rkroll .5s}
@keyframes rkroll{0%{transform:rotate(-200deg) scale(.4);opacity:0}100%{transform:none;opacity:1}}
.rk-total{margin-top:10px;font:700 20px system-ui}
.rk-balls{display:flex;flex-wrap:wrap;gap:10px;justify-content:center}
.rk-ball{width:58px;height:58px;border-radius:50%;display:flex;align-items:center;justify-content:center;font:800 22px system-ui;color:#111827;background:radial-gradient(circle at 35% 30%,#fff 0,#f1f5f9 35%,#cbd5e1 100%);box-shadow:0 4px 10px rgba(0,0,0,.18);animation:rkroll .5s}
.rk-ball.extra{background:radial-gradient(circle at 35% 30%,#fecaca 0,#ef4444 60%,#b91c1c 100%);color:#fff}
.rk-hlist{margin:0;padding-left:22px;display:flex;flex-direction:column;gap:6px;max-height:300px;overflow:auto;font-size:13.5px}
.rk-hlist li b{overflow-wrap:anywhere}
.rk-hlist li span{display:block;font-size:12px;color:var(--faint,#8a94a7)}
/* picker */
.rk-tabs{display:flex;gap:6px;flex-wrap:wrap;margin-bottom:14px}
.rk-tabs button{border:1px solid var(--border,#e4e9f2);background:var(--panel,#fff);border-radius:999px;padding:8px 14px;font:600 13.5px inherit;font-family:inherit;color:inherit;cursor:pointer}
.rk-tabs button.on{background:var(--accent,#4f6ef7);border-color:var(--accent,#4f6ef7);color:#fff}
.rk-wheelwrap{position:relative;width:min(100%,520px);margin:0 auto;aspect-ratio:1}
.rk-wheel{width:100%;height:100%;display:block;cursor:pointer;border-radius:50%;box-shadow:0 10px 30px rgba(15,23,42,.18)}
.rk-pointer{position:absolute;left:50%;top:-6px;transform:translateX(-50%);width:0;height:0;border-left:18px solid transparent;border-right:18px solid transparent;border-top:34px solid #111827;filter:drop-shadow(0 2px 2px rgba(0,0,0,.3))}
.rk-spin{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:86px;height:86px;border-radius:50%;border:5px solid #fff;background:#111827;color:#fff;font:800 16px system-ui;cursor:pointer;box-shadow:0 4px 12px rgba(0,0,0,.3);padding:0}
.rk-presult{margin-top:14px}
.rk-presult:empty{display:none}
.rk-winner{text-align:center;padding:14px;border-radius:14px;background:linear-gradient(135deg,#eef2ff,#fdf4ff);margin-bottom:8px}
.rk-winner span{display:block;font-size:13px;text-transform:uppercase;letter-spacing:.08em;color:var(--muted,#5a6377)}
.rk-winner b{display:block;font:800 30px/1.3 system-ui;color:#4338ca;overflow-wrap:anywhere}
.rk-teams{display:grid;grid-template-columns:repeat(auto-fill,minmax(160px,1fr));gap:10px;margin-bottom:8px}
.rk-teams>div{border-top:4px solid var(--c);background:var(--field,#f6f8fb);border-radius:10px;padding:10px 12px}
.rk-teams ol,.rk-order{margin:6px 0 0;padding-left:20px;font-size:14px}
.rk-saved{display:flex;flex-wrap:wrap;gap:6px;margin-top:8px}
.rk-saved span{display:inline-flex;align-items:center;border:1px solid var(--border,#e4e9f2);border-radius:999px;overflow:hidden}
.rk-saved button{border:0;background:none;padding:5px 10px;font:600 12.5px inherit;font-family:inherit;color:inherit;cursor:pointer}
.rk-saved i{font-style:normal;padding:0 9px 0 4px;cursor:pointer;color:var(--faint,#8a94a7)}
@media (max-width:900px){.rk{grid-template-columns:minmax(0,1fr)}.rk-side{position:static}}
@media (max-width:600px){.rk-coin{width:160px;height:160px}.rk-statgrid{grid-template-columns:repeat(2,minmax(0,1fr))}.rk-die,.rk-poly{width:64px;height:64px}.rk-die i{width:11px;height:11px}.rk-ball{width:46px;height:46px;font-size:18px}.rk-card{padding:14px}}