.upgrade-arena{display:grid;grid-template-columns:minmax(0,1fr) 300px minmax(0,1fr);align-items:center;gap:22px;padding:20px 35px;background:radial-gradient(ellipse at center,#26230e44,transparent 60%)}.upgrade-pedestal{min-height:260px;border:1px solid #323334;border-radius:12px;background:radial-gradient(ellipse at center,#d5b52220,transparent 75%),#171a20;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:20px;text-align:center;gap:12px}.upgrade-pedestal img{width:100%;height:150px;object-fit:contain;filter:drop-shadow(0 10px 20px #0008)}.upgrade-pedestal b{font-size:14px}.upgrade-pedestal small{color:#ffd526}.pedestal-placeholder{font-size:90px;color:#69591a;line-height:1}.upgrade-pedestal p{font-size:13px;color:#969795}.dial-column{text-align:center}.upgrade-dial{width:280px;height:280px;position:relative;margin:0 auto 28px;border-radius:50%;background:conic-gradient(from 0deg,#ffdd21 0deg,#f69530 var(--chance),#292b2d var(--chance),#292b2d 360deg);box-shadow:0 0 0 10px #111419,0 0 0 12px #30302a,0 0 35px #efc3230c}.dial-core{position:absolute;inset:24px;border:10px solid #101318;border-radius:50%;background:#191b20;display:flex;flex-direction:column;align-items:center;justify-content:center}.dial-core strong{font:700 38px 'Roboto Condensed',Arial,sans-serif;color:#ffda22}.dial-core>span:last-child{font-size:10px;letter-spacing:1px;color:#a5a7ae;margin-top:8px}.double-chevron{font-size:65px;color:#f5ce20;line-height:45px}.dial-ticks{position:absolute;inset:-18px;border-radius:50%;background:repeating-conic-gradient(#51514a 0 1deg,transparent 1deg 12deg);mask:radial-gradient(transparent 67%,#000 68%,#000 70%,transparent 71%)}.dial-pointer{position:absolute;inset:-12px;pointer-events:none}.dial-pointer span{position:absolute;top:-4px;left:calc(50% - 9px);font-size:25px;color:#fff3aa;transform:rotate(180deg);text-shadow:0 0 10px #ffe000}.dial-column>.primary{background:#f6d322;color:#201d0d;border-radius:10px;width:100%;font-size:18px;padding:17px}.upgrade-caption{text-align:center;font-size:12px;color:#969ba4}.upgrade-won{box-shadow:0 0 0 10px #111419,0 0 0 12px #8db459,0 0 45px #97d94b55}.upgrade-lost{box-shadow:0 0 0 10px #111419,0 0 0 12px #8c4b47,0 0 40px #cb4b3f33}.contract-slots{display:grid;grid-template-columns:repeat(10,minmax(0,1fr));gap:9px;margin:25px}.contract-slot{height:100px;background:#10151d;border:1px solid #252d37;position:relative;text-align:center;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:4px;color:#525969}.contract-slot>span{font-size:28px}.contract-slot small{font-size:10px}.contract-slot img{width:100%;height:65px;object-fit:contain}.contract-slot.filled{border-color:#b57b42;animation:slot-enter .3s ease-out}.contract-slot.filled small{color:#d9b387}.contract-slot .slot-remove{position:absolute;right:3px;top:0;font-size:17px;color:#bbb}.contract-bar{max-width:none;display:flex;align-items:center;justify-content:space-between;margin:0 25px;padding:10px 22px}.contract-bar p{margin:0}.contract-bar .primary{margin:0;min-width:200px}.contract-theater{height:310px;position:relative;display:grid;place-items:center;overflow:hidden;margin:0 25px;background:radial-gradient(ellipse,#64492d22,transparent 65%)}.contract-paper{width:350px;min-height:235px;background:#d7c8ab;color:#493d30;padding:24px 25px;box-shadow:0 14px 35px #0005;position:relative;transform:rotate(-1deg)}.paper-heading{font-size:16px;font-weight:bold;border-bottom:2px solid #6c5d45;padding-bottom:10px}.paper-heading span{display:block;font-size:9px;letter-spacing:2px;margin-top:7px}.paper-lines{height:30px;margin-top:12px;background:repeating-linear-gradient(0deg,transparent 0 8px,#877a6555 9px 10px)}.contract-paper p{font-size:11px;line-height:1.5;color:#776853}.signature{width:210px;height:54px;position:absolute;bottom:12px;left:20px}.signature path{stroke:#293d60;stroke-width:2.5;fill:none;stroke-linecap:round;stroke-dasharray:1;stroke-dashoffset:1}.signing .signature path{animation:sign-contract 1.15s ease forwards}.contract-stamp{position:absolute;bottom:25px;right:10px;border:3px double #a64b38;color:#a64b38;font-size:16px;padding:7px;transform:rotate(-15deg) scale(2);opacity:0}.sealed .signature path{stroke-dashoffset:0}.sealed .contract-stamp{animation:stamp .35s ease forwards}.contract-reward{text-align:center;position:relative;z-index:2}.contract-reward>span{font-size:11px;color:#d5a46b;letter-spacing:2px}.contract-reward img{display:block;width:300px;height:160px;object-fit:contain;margin:auto;filter:drop-shadow(0 0 25px #f8b85055)}.contract-reward h3{font-size:18px;margin:0 0 8px}.contract-reward strong{color:#f0bf71}.contract-reward small{display:block;font-size:12px;margin-top:7px;color:#929ca8}.contract-flash{position:absolute;inset:0;background:radial-gradient(ellipse,#ffe4ae,transparent 65%);opacity:0;pointer-events:none}.revealed .contract-flash{animation:reward-flash .8s ease-out}.motion-busy .choice,.motion-busy .contract-slot{pointer-events:none;opacity:.6}.motion-busy [data-view],.motion-busy #reset,.motion-busy #topup{pointer-events:none;opacity:.55}@keyframes sign-contract{to{stroke-dashoffset:0}}@keyframes stamp{to{opacity:1;transform:rotate(-15deg) scale(1)}}@keyframes reward-flash{0%{opacity:.8}100%{opacity:0}}@keyframes slot-enter{from{transform:translateY(8px);opacity:.3}to{transform:none;opacity:1}}@media(max-width:1150px){.upgrade-arena{grid-template-columns:minmax(0,1fr) 220px minmax(0,1fr);padding:20px;gap:14px}.upgrade-dial{width:200px;height:200px}.dial-core strong{font-size:30px}.dial-core{inset:18px}.upgrade-pedestal{min-height:210px;padding:10px}.contract-slots{grid-template-columns:repeat(5,minmax(0,1fr))}}@media(max-width:720px){.upgrade-arena{grid-template-columns:1fr 1fr;gap:12px;padding:15px}.dial-column{grid-column:1/-1;grid-row:2;max-width:270px;justify-self:center;width:100%;margin-top:20px}.upgrade-pedestal{min-height:160px}.upgrade-pedestal img{height:85px}.upgrade-pedestal b{font-size:12px}.upgrade-dial{width:220px;height:220px}.contract-slots{margin:15px 12px;gap:5px}.contract-slot{height:72px}.contract-slot img{height:44px}.contract-slot small{font-size:8px}.contract-bar{margin:0 12px;display:block;text-align:center}.contract-bar .primary{margin-top:12px}.contract-theater{margin:0 12px;height:285px}.contract-paper{width:280px;padding:20px;min-height:230px}.paper-heading{font-size:14px}.contract-stamp{font-size:12px}.contract-reward img{width:250px}}@media(prefers-reduced-motion:reduce){.signing .signature path,.sealed .contract-stamp,.revealed .contract-flash,.contract-slot.filled{animation:none}.signing .signature path{stroke-dashoffset:0}}
