/* ===== V56 Upgrader – bet panel | wheel | target panel + skin catalogue. Moonclutch dark palette, gold accent. ===== */
#moon-upgrader{container-type:inline-size;width:100%}
section.up{--pn:#12151B;--area:#171A20;--ln:#2A2F38;--tx:#F2F3F5;--mu:#949BA6;--gd:#F5B84D;--pos:#36BE83;--neg:#E34D59;--btn:#1F232B;
 font-family:'MoonInter','Inter',system-ui,Arial,sans-serif;color:var(--tx);display:grid;gap:14px;font-weight:600;font-size:14px;line-height:1.3;position:relative}
section.up button,section.up input,section.up select{font:inherit}section.up button{cursor:pointer}section.up [hidden]{display:none!important}section.up button:disabled{cursor:not-allowed}
.up-loading{padding:60px;text-align:center;color:var(--mu)}
.up-top{display:flex;justify-content:space-between;align-items:center;gap:10px}
.up-title{display:flex;align-items:center;gap:10px;height:40px;padding:0 16px 0 12px;background:#221E16;border-radius:8px;font-weight:700;font-size:15px}
.up-title-ic svg{width:18px;height:18px;color:var(--gd);display:block}
.up-top-r{display:flex;align-items:center;gap:8px}.up-ic{width:40px;height:40px;border:0;background:#1d2027;color:var(--tx);border-radius:8px;font-size:15px}.up-ic:hover{background:#252932}
.up-top-r input[type=range]{width:70px;accent-color:var(--gd);height:4px;padding:0;border:0;background:transparent}
.up-fairbtn{display:flex;align-items:center;gap:8px;height:40px;padding:0 16px 0 12px;background:#1d2027;border-radius:8px;color:#aab0bb;font-weight:700;font-size:14px;text-decoration:none;transition:background .18s,color .18s}
.up-fairbtn svg{width:18px;height:18px}.up-fairbtn:hover{background:#252932;color:var(--tx)}
.up-main{display:grid;grid-template-columns:clamp(250px,24%,340px) minmax(0,1fr) clamp(250px,24%,340px);background:var(--area);border-radius:10px;overflow:hidden;min-height:560px}
.up-panel{display:flex;flex-direction:column;padding:clamp(14px,1.8cqw,24px);background:var(--pn);min-width:0}
.up-left{border-right:1px solid #1d2128}.up-right{border-left:1px solid #1d2128}
.up-lab{display:flex;justify-content:space-between;align-items:center;font-size:14px;font-weight:700;color:#9aa1ad;margin:0 0 8px}.up-panel>.up-lab:not(:first-child),.up-panel>.up-field+.up-quick+.up-lab{margin-top:18px}
.up-bal{font-size:12px;font-weight:600}.up-bal b{color:var(--tx)}
.up-field{display:flex;align-items:center;gap:10px;height:52px;padding:0 14px;background:var(--pn);border:2px solid #232831;border-radius:9px;transition:border-color .15s}.up-field:focus-within{border-color:#3a4150}
.up-coin{display:inline-grid;width:26px;height:26px;flex:none}.up-coin svg{width:100%;height:100%}.up-coin.sm{width:14px;height:14px;display:inline-block;vertical-align:-2px;margin-right:4px}
#app .up-field input{flex:1;min-width:0;width:100%;height:100%;background:transparent!important;border:0!important;outline:0!important;box-shadow:none!important;color:var(--tx);font-weight:700;font-size:18px;padding:0!important}
.up-x{color:var(--gd);font-weight:800;font-size:18px;width:26px;text-align:center}.up-mfield{height:46px;margin-top:8px}
.up-quick{display:grid;grid-template-columns:repeat(4,1fr);gap:3px;margin-top:10px}
.up-quick button,.up-mults button,.up-dir button,.up-filt button{height:42px;border:0;background:var(--btn);color:#aab0bb;font-weight:700;font-size:14px;transition:background .15s,color .15s,box-shadow .15s}
.up-quick button:first-child{border-radius:6px 0 0 6px}.up-quick button:last-child{border-radius:0 6px 6px 0}
.up-quick button:hover:not(:disabled),.up-mults button:hover:not(:disabled),.up-dir button:hover:not(:disabled),.up-filt button:hover{background:#2a2f39;color:var(--tx)}
.up-mults{display:grid;grid-template-columns:repeat(5,1fr);gap:4px}.up-mults button{border-radius:6px;padding:0;height:40px}
.up-mults button[aria-pressed=true],.up-dir button[aria-pressed=true]{background:#3a2f1a;color:#F1DFB5;box-shadow:inset 0 0 0 2px var(--gd)}
.up-dir{display:grid;grid-template-columns:1fr 1fr;gap:4px;margin-top:12px}.up-dir button{border-radius:6px}
.up-go{display:inline-flex;align-items:center;justify-content:center;gap:8px;height:52px;margin-top:16px;padding:0 22px;border:0;border-radius:9px;background:var(--gd);color:#2a1d07;font-weight:800;font-size:17px;transition:filter .15s,transform .1s;text-decoration:none}
.up-go:hover:not(:disabled){filter:brightness(1.08)}.up-go:active:not(:disabled){transform:translateY(1px)}.up-go:disabled{background:#4a4130;color:#a79a7a}
.up-note{min-height:1.3em;margin:10px 0 0;font-size:12.5px;color:#ff8d86;font-weight:600}
/* wheel */
.up-center{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:16px;padding:clamp(14px,2cqw,28px);min-width:0;background:radial-gradient(ellipse at 50% 40%,#1b1810 0,#12151B 62%)}
.up-stage{position:relative;width:min(100%,clamp(300px,36cqw,470px));aspect-ratio:1}
.up-wheel{width:100%;height:100%;display:block;overflow:visible}
#upRing{will-change:transform}
.up-core{position:absolute;inset:0;display:grid;place-content:center;justify-items:center;text-align:center;pointer-events:none}
.up-core b{font-size:clamp(28px,4.6cqw,54px);font-weight:800;letter-spacing:-.01em;font-variant-numeric:tabular-nums}
.up-core small{margin-top:6px;font-size:clamp(11px,1.1cqw,14px);font-weight:700;color:#9aa1ad;letter-spacing:.08em}
.up-core.spin b{color:var(--gd)}
.up-stage.is-win b{color:var(--gd);animation:upPop .6s cubic-bezier(.2,1.6,.4,1)}.up-stage.is-lose b{color:var(--neg);animation:upShake .5s}
.up-stage.is-win #upWin,.up-stage.is-win #upWinGlow{animation:upGlow 1.1s ease-out 2}
.up-stage.is-lose #upWin{opacity:.35}
@keyframes upPop{0%{transform:scale(.6);opacity:0}100%{transform:none;opacity:1}}
@keyframes upShake{0%,100%{transform:none}20%{transform:translateX(-7px)}40%{transform:translateX(6px)}60%{transform:translateX(-4px)}80%{transform:translateX(3px)}}
@keyframes upGlow{0%{filter:brightness(1)}40%{filter:brightness(1.8) drop-shadow(0 0 14px #F5B84D)}100%{filter:brightness(1)}}
.up-burst{position:absolute;inset:0;pointer-events:none}.up-burst i{position:absolute;left:50%;top:50%;width:var(--s);height:var(--s);margin:calc(var(--s)/-2);border-radius:50%;background:radial-gradient(circle at 35% 30%,#fff3c4,#F5B84D 60%,#a77c2f);opacity:0}
.up-burst.go i{animation:upSpark var(--t) cubic-bezier(.1,.7,.3,1) forwards}
@keyframes upSpark{0%{opacity:1;transform:rotate(var(--a)) translateY(0) scale(1)}100%{opacity:0;transform:rotate(var(--a)) translateY(calc(var(--d)*-1.6)) scale(.3)}}
.up-hist{display:flex;gap:6px;flex-wrap:wrap;justify-content:center;min-height:30px}
.uh{height:28px;padding:0 10px;border:0;border-radius:6px;font-weight:800;font-size:12px;background:#1d2027;color:#aab0bb}.uh.w{background:#12362a;color:var(--pos)}.uh.l{background:#3a1d22;color:#ff8d86}.uh:hover{filter:brightness(1.2)}
.up-muted{font-size:12px;color:var(--mu);font-weight:500}
/* target panel */
.up-tgt{display:grid;justify-items:center;gap:6px;padding:14px 10px 12px;background:#171A20;border:2px solid #232831;border-radius:10px;text-align:center;box-shadow:inset 0 -3px 0 var(--rc,#232831)}
.up-tgt .uc-art{width:100%;max-width:230px}.up-tn{font-size:15px;font-weight:700}.up-tw{font-size:12px;color:var(--mu);font-weight:500}.up-tp{display:inline-flex;align-items:center;font-weight:800;color:var(--gd);font-size:16px}
.up-tgt.empty{min-height:170px;align-content:center}.up-ph{width:46px;height:46px;display:grid;place-items:center;border-radius:50%;background:#1d2027;color:#5b6270}.up-ph svg{width:26px;height:26px}
.up-stats{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-top:14px}.up-stats>div{padding:10px 12px;background:#171A20;border-radius:8px;border:1px solid #20242c}.up-stats .wide{grid-column:1/-1}
.up-stats small{display:block;font-size:11px;color:var(--mu);font-weight:700;letter-spacing:.04em;text-transform:uppercase;margin-bottom:3px}.up-stats b{font-size:20px;font-weight:800;display:inline-flex;align-items:center}.up-stats b.gd{color:var(--gd)}
.up-fair{margin-top:auto;padding-top:16px}.up-fair p{margin:0 0 6px;font-size:12px;color:#9aa1ad;font-weight:500}.up-fair code{display:block;margin-top:2px;font-size:11px;color:#c9ced8;word-break:break-all;font-family:ui-monospace,Menlo,monospace}
/* result */
.up-result{width:min(100%,400px)}
.ur-card{display:grid;justify-items:center;gap:8px;padding:18px 18px 16px;background:rgba(18,21,27,.96);border:2px solid #2A2F38;border-radius:12px;box-shadow:0 20px 60px rgba(0,0,0,.6);backdrop-filter:blur(6px);animation:urIn .35s cubic-bezier(.2,1.2,.4,1)}
.up-result.win .ur-card{border-color:var(--gd);box-shadow:0 0 0 1px #5a431a,0 20px 60px rgba(245,184,77,.18)}.up-result.lose .ur-card{border-color:#5a2a30}
.ur-card .uc-art{width:70%}.ur-h{font-size:18px;font-weight:800;letter-spacing:.04em}.up-result.win .ur-h{color:var(--gd)}.up-result.lose .ur-h{color:#ff8d86}
.ur-p{margin:0;text-align:center;font-size:13.5px;color:#c9ced8;font-weight:500}.ur-p b{color:var(--tx)}
.ur-s{display:flex;gap:14px;flex-wrap:wrap;justify-content:center;font-size:12px;color:var(--mu)}.ur-s b{color:var(--tx)}.ur-s b.pos{color:var(--pos)}.ur-s b.neg{color:#ff8d86}
.ur-b{display:flex;gap:12px;align-items:center;flex-wrap:wrap;justify-content:center}.ur-b .up-go{margin-top:6px;height:44px;font-size:15px}.up-link{color:#aab0bb;font-size:13px;text-decoration:underline;margin-top:6px}
@keyframes urIn{from{opacity:0;transform:translateY(14px) scale(.94)}to{opacity:1;transform:none}}
/* catalogue */
.up-cat{background:var(--area);border-radius:10px;padding:clamp(14px,1.8cqw,24px)}
.up-cat-h{display:flex;justify-content:space-between;align-items:baseline;gap:10px;margin-bottom:12px}.up-cat-h h2{margin:0;font-size:18px;font-weight:800}.up-cat-n{font-size:12px;color:var(--mu)}
.up-tools{display:flex;flex-wrap:wrap;gap:10px;align-items:center;margin-bottom:14px}
.up-search{display:flex;align-items:center;gap:8px;height:42px;padding:0 12px;flex:1 1 220px;max-width:340px;background:var(--pn);border:2px solid #232831;border-radius:8px;color:var(--mu)}.up-search svg{width:18px;height:18px;flex:none}
#app .up-search input{flex:1;min-width:0;height:100%;background:transparent!important;border:0!important;outline:0!important;box-shadow:none!important;color:var(--tx);font-size:14px;padding:0!important}
.up-filt{display:flex;flex-wrap:wrap;gap:4px}.up-filt button{height:38px;padding:0 14px;border-radius:6px}.up-filt button[aria-pressed=true]{background:#3a2f1a;color:#F1DFB5;box-shadow:inset 0 0 0 2px var(--gd)}
#app .up-tools select{height:42px;padding:0 12px;background:var(--btn);color:var(--tx);border:0;border-radius:8px;margin-left:auto}
.up-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(168px,1fr));gap:10px}
.uc{position:relative;display:grid;justify-items:center;gap:3px;padding:12px 10px 10px;border:2px solid #232831;border-radius:10px;background:#12151B;color:var(--tx);text-align:center;box-shadow:inset 0 -3px 0 var(--rc);transition:transform .15s,border-color .15s,background .15s,opacity .15s}
.uc:hover{transform:translateY(-2px);background:#171b22;border-color:#343b48}
.uc.sel{border-color:var(--gd);background:#1d1a12;box-shadow:inset 0 -3px 0 var(--rc),0 0 0 2px rgba(245,184,77,.25)}.uc.sel::after{content:'✓';position:absolute;top:6px;right:8px;color:var(--gd);font-weight:800}
.uc.out{opacity:.38}.uc.out:hover{opacity:.6}
.uc-art{position:relative;display:block;width:100%;aspect-ratio:2/1}.uc-art svg,.uc-art img{position:absolute;inset:0;width:100%;height:100%;object-fit:contain}
.uc-w{font-size:12px;color:var(--mu);font-weight:600}.uc-n{font-size:13.5px;font-weight:700;line-height:1.15;min-height:2.3em;display:grid;align-items:center}
.uc-tags{display:flex;gap:4px;flex-wrap:wrap;justify-content:center;min-height:16px}.uc-tag{font-style:normal;font-size:10px;font-weight:800;padding:1px 5px;border-radius:4px;background:#232831;color:#aab0bb}.uc-tag.st{background:#4a2410;color:#ff9b57}.uc-tag.sv{background:#3a3316;color:#f0d36a}
.uc-p{display:inline-flex;align-items:center;font-weight:800;font-size:14px;color:var(--gd)}.uc[data-mult]:not([data-mult=""])::before{content:attr(data-mult);position:absolute;top:6px;left:8px;font-size:11px;font-weight:800;color:#c9ced8;background:#20242c;padding:1px 6px;border-radius:4px}
.up-empty{grid-column:1/-1;text-align:center;color:var(--mu);padding:30px}
.up-how{background:var(--area);border-radius:10px;padding:14px 18px}.up-how summary{cursor:pointer;font-weight:700}.up-how p{color:#aab0bb;font-weight:500;line-height:1.55;margin:10px 0 0}.up-how a{color:var(--gd)}
/* tablet / mobile: stack, wheel first */
@container (max-width:980px){.up-main{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}.up-center{grid-column:1/-1;grid-row:1}.up-left{border-right:1px solid #1d2128}}
@container (max-width:640px){.up-main{grid-template-columns:minmax(0,1fr)}.up-center{grid-row:auto;padding:16px 8px}.up-left,.up-right{border:0}.up-stage{width:min(100%,360px)}
 .up-left{order:2}.up-right{order:3}.up-center{order:1}.up-grid{grid-template-columns:repeat(auto-fill,minmax(140px,1fr))}.up-tools select{margin-left:0;width:100%}.up-search{max-width:none;flex-basis:100%}
 .up-filt{overflow-x:auto;flex-wrap:nowrap;width:100%;scrollbar-width:none}.up-filt button{flex:none}.up-go{height:54px}}
@media (prefers-reduced-motion:reduce){section.up *{animation:none!important;transition:none!important}}
.up-title,.up-fairbtn,.up-top-r{white-space:nowrap}.up-stats .up-coin.sm{width:16px;height:16px;margin-right:6px;vertical-align:middle}
@container (max-width:640px){.up-fairbtn span{display:none}.up-fairbtn{padding:0 12px}.up-top-r input[type=range]{width:54px}}

.up-pager{display:flex;align-items:center;justify-content:center;gap:14px;margin:18px 0 6px;color:#949BA6;font-size:14px}
.up-pager[hidden]{display:none}
.up-pager button{width:38px;height:38px;border-radius:10px;border:1px solid #2A2F38;background:#191D24;color:#F2F3F5;font-size:20px;cursor:pointer}
.up-pager button:hover:not(:disabled){background:#242932}
.up-pager button:disabled{opacity:.35;cursor:default}
.uc-art img[data-uimg]{object-fit:contain}
.uc-art.has-img>svg{visibility:hidden}
/* V57 – CSGOWIN-style wheel: ring stands still, pointer + trail circles */
#upRing{will-change:auto}#upPtr{will-change:transform}
.up-gh{opacity:0;transition:opacity .25s}.up-stage.rolling .up-gh.g1{opacity:.55}.up-stage.rolling .up-gh.g2{opacity:.28}
.up-core .up-range{margin-top:4px;font-size:clamp(9px,.9cqw,12px);color:#7fb8ff;letter-spacing:.04em}.up-core .up-range i{font-style:normal;color:#5aa7ff}
.up-core.spin b{color:#F2F3F5;opacity:.45}
.up-stage.is-win b,.up-stage.is-lose b{font-size:clamp(20px,3.2cqw,38px);letter-spacing:.02em}
.up-stage.is-win b{color:#7CF0B0;text-shadow:0 0 18px rgba(54,190,131,.7);animation:upPop .5s ease-out}
.up-stage.is-lose b{color:#E34D59}
.up-stage.is-win .up-core small{color:#7CF0B0}.up-stage.is-lose .up-core small{color:#d98a91}
.up-stage.is-win .up-wheel{filter:drop-shadow(0 0 14px rgba(54,190,131,.55))}
.up-stage.is-win #upWin,.up-stage.is-win #upWinGlow{animation:none;stroke:#36BE83}
.up-stage.is-win #upOk{filter:drop-shadow(0 0 8px #36BE83)}

.up-stage{touch-action:none;outline:none}.up-stage.drag{cursor:grabbing}
.up-stage:not(.rolling) .up-wheel #upRing{cursor:grab}.up-stage.drag .up-wheel #upRing{cursor:grabbing}
section.up.over .up-dir [data-d="over"][aria-pressed="true"]{background:#E34D59;border-color:#E34D59;color:#fff}
section.up.over .up-core .up-range{color:#ff7b6b}section.up.over .up-core .up-range i{color:#ff5a4a}
.up-dir [data-d="under"][aria-pressed="true"]{background:#1f4e84;color:#dbeaff;box-shadow:inset 0 0 0 2px #3b8be0}