.upg{gap:var(--space-4);grid-template-columns:minmax(0,1fr);width:100%;max-width:980px;margin:0 auto;display:grid}@media (min-width:1100px){.upg{grid-template-columns:minmax(0,1fr) minmax(0,1fr);align-items:start;max-width:1240px}.upg-head,.upg-rules{grid-column:1/-1}.upg-pick{grid-area:2/2/span 1}.upg:not(:has(.upg-pick)){grid-template-columns:minmax(0,1fr);max-width:980px}}.upg-head{gap:4px;padding:0 2px;display:grid}.upg-eyebrow{color:var(--accent);letter-spacing:.12em;text-transform:uppercase;margin:0;font-size:12px;font-weight:800}.upg-head h1{margin:0;font-size:clamp(28px,7vw,40px);font-weight:900;line-height:1.05}.upg-sub{color:var(--text-secondary);font-size:var(--text-md);max-width:56ch;margin:0;line-height:1.4}.upg-stage{gap:var(--space-4);padding:var(--space-4);background:radial-gradient(90% 60% at 50% 0%, color-mix(in srgb, var(--accent) 18%, transparent), transparent 70%), linear-gradient(180deg, color-mix(in srgb, var(--bg-raised) 90%, #fff 5%), var(--bg-overlay));display:grid;position:relative;overflow:hidden}.upg-wheel{aspect-ratio:1;width:min(100%,380px);margin:0 auto;position:relative}.upg-wheel:before{content:"";pointer-events:none;z-index:0;background:radial-gradient(closest-side, color-mix(in srgb, var(--accent) 22%, transparent), transparent 70%);animation:3.2s ease-in-out infinite upg-breathe;position:absolute;inset:-14%}.upg-wheel.is-won:before{background:radial-gradient(closest-side, color-mix(in srgb, var(--accent) 55%, transparent), transparent 72%);animation:upg-flash .9s var(--ease-out) both}.upg-wheel.is-lost:before{background:radial-gradient(closest-side, color-mix(in srgb, var(--danger,#ff5d5d) 30%, transparent), transparent 70%);animation:upg-flash .9s var(--ease-out) both}.upg .wheel-host{z-index:1;position:absolute;inset:0}.upg .wheel-host canvas{touch-action:pan-y;display:block;width:100%!important;height:100%!important}.upg .wheel-host[data-webgl=pending]{background:radial-gradient(circle, var(--bg-overlay), var(--bg-sunken));border-radius:50%}.upg-wheel-chance{z-index:2;pointer-events:none;background:color-mix(in srgb, var(--bg-overlay) 82%, transparent);box-shadow:inset 0 0 0 1px color-mix(in srgb, var(--accent) 35%, transparent);border-radius:999px;align-items:baseline;gap:6px;padding:4px 12px;display:flex;position:absolute;bottom:3%;left:50%;transform:translate(-50%)}.upg-wheel-chance-value{color:var(--accent);font-size:20px;font-weight:900;line-height:1}.upg-wheel-chance-label{color:var(--text-secondary);font-size:12px;font-weight:700}.upg-duel{align-items:center;gap:var(--space-2);grid-template-columns:minmax(0,1fr) auto minmax(0,1fr);display:grid}.upg-slot{border-radius:var(--r-card);font:inherit;color:var(--text-primary);cursor:pointer;background:color-mix(in srgb, var(--bg-raised) 70%, transparent);min-width:0;box-shadow:inset 0 0 0 1px var(--line);transition:transform .2s var(--ease-out), box-shadow .2s var(--ease-out);border:0;justify-items:center;gap:4px;padding:10px 8px 12px;display:grid}.upg-slot:active{transform:scale(.97)}.upg-slot.is-set{box-shadow:inset 0 0 0 1px color-mix(in srgb, var(--accent) 45%, transparent), 0 8px 24px -14px var(--accent)}.upg-slot-art{place-items:center;width:84px;height:72px;display:grid;position:relative}.upg-slot-art img{object-fit:contain;filter:drop-shadow(0 6px 12px #00000059);width:72px;height:72px;animation:3.4s ease-in-out infinite upg-float}.upg-stack{transform:translateX(calc((var(--i) - 1) * 16px)) rotate(calc((var(--i) - 1) * 7deg));color:var(--text-primary);position:absolute}.upg-stack .item-art{filter:drop-shadow(0 6px 10px #0006) drop-shadow(0 0 10px color-mix(in srgb, var(--rarity) 50%, transparent));width:64px!important;height:64px!important}.upg-slot-empty{width:56px;height:56px;color:var(--accent);background:color-mix(in srgb, var(--accent) 12%, transparent);box-shadow:inset 0 0 0 1.5px color-mix(in srgb, var(--accent) 40%, transparent);border-radius:16px;place-items:center;font-size:28px;font-weight:900;animation:2.4s ease-in-out infinite upg-breathe;display:grid}.upg-more{background:var(--accent);color:var(--text-inverse);border-radius:999px;padding:1px 7px;font-size:12px;font-weight:800;position:absolute;bottom:-2px;right:-4px}.upg-slot-label{color:var(--text-secondary);text-transform:uppercase;letter-spacing:.08em;font-size:12px;font-weight:700}.upg-slot-value{font-size:var(--text-md);font-weight:800}.upg-arrow{justify-items:center;gap:4px;width:56px;display:grid;position:relative}.upg-arrow i{background:color-mix(in srgb, var(--text-primary) 8%, transparent);border-radius:7px;width:52px;height:14px;display:block;position:relative;overflow:hidden}.upg-arrow i:before{content:"";background:repeating-linear-gradient(90deg, transparent 0 6px, color-mix(in srgb, var(--accent) 80%, transparent) 6px 12px);opacity:.35;width:200%;position:absolute;inset:0;-webkit-mask:linear-gradient(90deg,#0000,#000 30% 70%,#0000);mask:linear-gradient(90deg,#0000,#000 30% 70%,#0000)}.upg-arrow.is-live i:before{opacity:1;animation:.7s linear infinite upg-run}.upg-arrow b{color:var(--accent);font-size:15px;font-weight:900}.upg-go{gap:var(--space-2);display:grid}.upg-cta{width:100%}.upg-hint{text-align:center;min-height:1.4em;font-size:var(--text-sm);color:var(--text-secondary);margin:0}.upg-hint.is-error{color:var(--danger,#ff7a7a);font-weight:700}.upg-result{justify-items:center;gap:var(--space-3);padding:var(--space-4);border-radius:var(--r-card);text-align:center;animation:upg-pop .5s var(--ease-out) both;display:grid}.upg-result.is-won{background:radial-gradient(80% 90% at 50% 20%, color-mix(in srgb, var(--accent) 22%, transparent), transparent), color-mix(in srgb, var(--bg-raised) 70%, transparent);box-shadow:inset 0 0 0 1px color-mix(in srgb, var(--accent) 50%, transparent)}.upg-result.is-lost{background:color-mix(in srgb, var(--bg-raised) 70%, transparent);box-shadow:inset 0 0 0 1px var(--line)}.upg-result-art{color:var(--text-primary);place-items:center;display:grid;position:relative}.upg-result-art:before{content:"";pointer-events:none;background:repeating-conic-gradient(from 0deg, color-mix(in srgb, var(--rarity) 30%, transparent) 0 10deg, transparent 10deg 30deg);border-radius:50%;animation:9s linear infinite upg-rays;position:absolute;inset:-30%;-webkit-mask:radial-gradient(closest-side,#000 40%,#0000);mask:radial-gradient(closest-side,#000 40%,#0000)}.upg-result-art .item-art{filter:drop-shadow(0 10px 18px #0006) drop-shadow(0 0 16px color-mix(in srgb, var(--rarity) 60%, transparent));animation:3s ease-in-out infinite upg-float;position:relative;width:112px!important;height:112px!important}.upg-result-copy{gap:4px;display:grid}.upg-result-copy b{font-size:var(--text-lg);font-weight:900}.upg-result.is-won .upg-result-copy b{color:var(--accent)}.upg-result-copy span{color:var(--text-secondary);font-size:var(--text-sm)}.upg-result-actions{gap:var(--space-2);grid-auto-flow:column;width:100%;display:grid}.upg-result-actions>*{min-width:0}.upg-result-actions .button{white-space:nowrap;padding-inline:var(--space-3)}.upg-pick{gap:var(--space-3);padding:var(--space-4);background:linear-gradient(180deg, color-mix(in srgb, var(--bg-raised) 90%, #fff 4%), var(--bg-overlay));display:grid}.upg-tabs{width:100%}.upg-note{color:var(--text-secondary);font-size:var(--text-sm);margin:0;line-height:1.4}.upg-mults{gap:var(--space-2);flex-wrap:wrap;display:flex}.upg-mults .chip{justify-content:center;min-width:56px;font-weight:800}.upg-empty{justify-items:center;gap:var(--space-3);padding:var(--space-5) var(--space-3);text-align:center;color:var(--text-secondary);display:grid}.upg-empty p{margin:0}.upg-grid{grid-template-columns:repeat(auto-fill,minmax(104px,1fr));gap:10px;display:grid}@media (min-width:900px){.upg-grid{grid-template-columns:repeat(auto-fill,minmax(140px,1fr));gap:12px}}.upg-tile{--tile-r:var(--rarity,var(--accent));min-width:0;min-height:150px;font:inherit;color:var(--text-primary);cursor:pointer;text-align:center;background:radial-gradient(100% 60% at 50% 25%, color-mix(in srgb, var(--tile-r) 22%, transparent), transparent 70%), color-mix(in srgb, var(--bg-raised) 85%, #fff 3%);box-shadow:inset 0 0 0 1px color-mix(in srgb, var(--tile-r) 22%, var(--line));transition:transform .2s var(--ease-out), box-shadow .2s var(--ease-out), opacity .2s;content-visibility:auto;contain-intrinsic-size:auto 150px;border:0;border-radius:16px;align-content:start;justify-items:center;gap:4px;padding:8px 6px 10px;display:grid;position:relative}.upg-tile:active:not(:disabled){transform:scale(.96)}.upg-tile:disabled{cursor:default;opacity:.5}.upg-tile.is-picked{opacity:1;box-shadow:inset 0 0 0 2px var(--accent), 0 0 0 3px color-mix(in srgb, var(--accent) 25%, transparent), 0 10px 26px -14px var(--accent)}.upg-tile.is-picked:after{content:"✓";width:22px;height:22px;color:var(--text-inverse);background:var(--accent);animation:upg-pop .3s var(--ease-out) both;border-radius:50%;place-items:center;font-size:13px;font-weight:900;display:grid;position:absolute;top:6px;right:6px}.upg-tile-art{place-items:center;width:100%;height:84px;display:grid}.upg-tile-art .item-art{filter:drop-shadow(0 6px 10px #00000059);width:80px!important;height:80px!important}.upg-tile-art img{object-fit:contain;filter:drop-shadow(0 6px 10px #00000059);width:80px;height:80px}.upg-tile.is-picked .upg-tile-art>*{animation:3s ease-in-out infinite upg-float}.upg-tile-name{overflow-wrap:anywhere;-webkit-line-clamp:2;-webkit-box-orient:vertical;font-size:13px;font-weight:700;line-height:1.2;display:-webkit-box;overflow:hidden}.upg-tile-price{color:var(--text-secondary);font-size:13px;font-weight:800}.upg-tile-chance{color:var(--accent);background:color-mix(in srgb, var(--accent) 14%, var(--bg-overlay));border-radius:999px;padding:1px 7px;font-size:12px;font-weight:900;position:absolute;top:6px;left:6px}.upg-tile.is-skel{min-height:150px}.upg-rules{padding:var(--space-4)}.upg-rules h2{margin:0 0 var(--space-2);font-size:var(--text-lg)}.upg-rules ol{margin:0 0 var(--space-2);color:var(--text-secondary);font-size:var(--text-sm);gap:6px;padding-left:1.2em;line-height:1.45;display:grid}@keyframes upg-breathe{0%,to{opacity:.75;transform:scale(.97)}50%{opacity:1;transform:scale(1.03)}}@keyframes upg-flash{0%{opacity:0;transform:scale(.8)}40%{opacity:1;transform:scale(1.06)}to{opacity:.85;transform:scale(1)}}@keyframes upg-float{0%,to{transform:translateY(0)rotate(-2deg)}50%{transform:translateY(-6px)rotate(2deg)}}@keyframes upg-run{0%{transform:translate(-50%)}to{transform:translate(0)}}@keyframes upg-pop{0%{opacity:0;transform:scale(.85)translateY(8px)}to{opacity:1;transform:none}}@keyframes upg-rays{to{transform:rotate(360deg)}}@media (prefers-reduced-motion:reduce){.upg-wheel:before,.upg-slot-empty,.upg-slot-art img,.upg-arrow.is-live i:before,.upg-result,.upg-result-art:before,.upg-result-art .item-art,.upg-tile.is-picked .upg-tile-art>*,.upg-tile.is-picked:after{animation:none}}
