/* Isolated reward surface: no inherited card or primary-button effects. */
html:has(.loot-dialog[open]){overflow:hidden}
.loot-dialog{box-sizing:border-box;width:min(510px,calc(100% - 32px));max-width:510px;max-height:calc(100dvh - 32px);margin:auto;padding:0;overflow:auto;border:1px solid #ffffff1a;border-radius:22px;background:#151c29;color:#e9edf6;box-shadow:0 30px 110px #000b;text-align:center;isolation:isolate;animation:loot-dialog-in .35s cubic-bezier(.2,.8,.2,1)}
.loot-dialog::backdrop{background:#050912c9;backdrop-filter:blur(14px);animation:loot-backdrop-in .25s ease-out}
.loot-header{height:58px;box-sizing:border-box;padding:0 18px 0 24px;display:flex;align-items:center;justify-content:space-between;background:#111824;border-bottom:1px solid #ffffff07}
.loot-header>span{display:flex;align-items:center;gap:9px;font-size:10px;font-weight:600;letter-spacing:1.7px;color:#c5cedd}
.loot-header i{font-style:normal;display:grid;place-items:center;width:20px;height:20px;border-radius:50%;background:#8bd7af12;color:#95d3b3;font-size:11px}
.loot-dialog button{font-family:inherit;cursor:pointer;box-sizing:border-box;transition:background .2s,color .2s,border-color .2s;box-shadow:none;text-transform:none;letter-spacing:0}
.loot-dialog .loot-close{display:grid;place-items:center;width:32px;height:32px;padding:0;border:1px solid #ffffff0d;border-radius:9px;background:transparent;color:#8d9ab0}
.loot-dialog .loot-close:hover{background:#ffffff08;color:#fff}
.loot-stage{height:235px;position:relative;display:grid;place-items:center;overflow:hidden;isolation:isolate;background:radial-gradient(ellipse at center,color-mix(in srgb,var(--loot-tone) 13%,transparent),transparent 72%),linear-gradient(140deg,#182130,#111926)}
.loot-stage:after{content:'';position:absolute;left:15%;right:15%;bottom:0;height:1px;background:linear-gradient(90deg,transparent,color-mix(in srgb,var(--loot-tone) 60%,transparent),transparent)}
.loot-halo{position:absolute;inset:15% 20%;z-index:-1;background:radial-gradient(ellipse,color-mix(in srgb,var(--loot-tone) 14%,transparent),transparent 70%);filter:blur(12px)}
.loot-ring{position:absolute;width:168px;height:168px;left:calc(50% - 84px);top:34px;z-index:-1;border:1px solid color-mix(in srgb,var(--loot-tone) 24%,transparent);border-radius:50%}
.loot-ring:before,.loot-ring:after{content:'';position:absolute;inset:12px;border:1px solid #ffffff04;border-radius:50%}.loot-ring:after{inset:-16px;border-color:#ffffff04}
.loot-stage img{display:block;width:80%;height:180px;object-fit:contain;filter:drop-shadow(0 14px 14px #0008);animation:loot-art-in .7s cubic-bezier(.16,1,.3,1) both}
.loot-stage-label{position:absolute;top:18px;left:0;right:0;color:#6f8099;font-size:8px;letter-spacing:2.4px}
.loot-category{position:absolute;bottom:16px;padding:5px 12px;color:#c3cee0;background:#ffffff05;border:1px solid #ffffff09;border-radius:5px;font-size:9px;letter-spacing:1.2px}
.loot-body{padding:22px 26px 17px;background:linear-gradient(160deg,#19212f,#141c28)}
.loot-dialog h2{margin:0 0 19px;color:#f0f3fa;font-size:26px;font-weight:600;line-height:1.2;letter-spacing:-.4px;overflow-wrap:anywhere}
.loot-value{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:12px 0 18px;border-top:1px solid #ffffff08}
.loot-value>span{color:#8d9bb0;font-size:11px;text-align:left}.loot-value strong{color:#f4c98e;font-size:23px;line-height:1.2;font-weight:600;font-variant-numeric:tabular-nums;white-space:nowrap}
.loot-actions{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.loot-actions button{min-height:46px;padding:12px 10px;border-radius:9px;font-size:12px;font-weight:600;line-height:1.25}
.loot-sell{background:linear-gradient(115deg,#f3ca90,#e7ad66);color:#322317;border:1px solid #f5ce98}.loot-sell:hover{background:#ffd9a6}
.loot-upgrade{background:#ffffff04;border:1px solid #ffffff19;color:#d8e0ed}.loot-upgrade span{margin-left:9px;color:#d9b88e}.loot-upgrade:hover{background:#ffffff09;border-color:#ffffff30}
.loot-actions .loot-keep{grid-column:1/-1;min-height:38px;background:transparent;border:1px solid #ffffff0b;color:#aab8cc;font-weight:400}.loot-actions .loot-keep:hover{background:#ffffff04;color:#e4eaf4}
.loot-dialog #loot-saved{margin:14px 0 0;font-size:10px;line-height:1.5;color:#657890}.loot-dialog #loot-saved span{color:#78a98d;margin-right:4px}
.loot-dialog button:focus-visible{outline:2px solid #edc28b;outline-offset:3px}
@keyframes loot-dialog-in{from{opacity:0;transform:translateY(12px) scale(.98)}to{opacity:1;transform:none}}
@keyframes loot-art-in{from{opacity:0;transform:translateY(10px) scale(.9)}to{opacity:1;transform:none}}
@keyframes loot-backdrop-in{from{opacity:0}to{opacity:1}}
@media(max-width:600px){.loot-dialog{width:calc(100% - 28px);border-radius:18px}.loot-header{height:52px;padding:0 13px 0 18px}.loot-header>span{font-size:9px;letter-spacing:1.1px}.loot-stage{height:205px}.loot-stage img{height:153px}.loot-ring{width:145px;height:145px;left:calc(50% - 72.5px);top:30px}.loot-body{padding:20px 18px 16px}.loot-dialog h2{font-size:24px}.loot-value strong{font-size:21px}.loot-actions button{font-size:11px}.loot-stage-label{font-size:7px}}
@media(max-height:640px){.loot-stage{height:150px}.loot-stage img{height:110px}.loot-stage-label{top:9px}.loot-category{bottom:8px}.loot-ring{width:106px;height:106px;left:calc(50% - 53px);top:23px}.loot-body{padding-top:15px}.loot-dialog h2{margin-bottom:10px}.loot-header{height:45px}.loot-value{padding-bottom:12px}}
.loot-dialog.quiet,.loot-dialog.quiet *,.loot-dialog.quiet::backdrop{animation:none!important}
@media(prefers-reduced-motion:reduce){.loot-dialog,.loot-dialog *,.loot-dialog::backdrop{animation:none!important}}
