/* Forja de Sangue — interface de refino (Claude) */
#refine-ui{z-index:90}
#refine-ui .rf-win{width:min(940px,100%);max-height:92dvh;overflow:auto;background:#1c1428;border:3px solid #0c0812;box-shadow:0 0 0 2px #6b2a3a,inset 0 0 0 2px #3e2238,0 0 60px #e0283f33;padding:14px 16px;color:#e3dcef}
#refine-ui header{display:flex;justify-content:space-between;align-items:center;border-bottom:2px solid #4a2236;padding-bottom:8px;margin-bottom:12px}
#refine-ui h2{font:32px Pix;color:#f0d28e;margin:0;text-shadow:0 0 10px #e0283f88,2px 2px 0 #0c0812}
#refine-ui header small{color:#b79aa8;font-size:14px}
#refine-ui button{font-family:Pix;cursor:pointer}
.rf-x{padding:8px 12px;background:#3a2232;border:2px solid #0c0812;box-shadow:inset 0 2px #7a4a5c;color:#eadceb;font-size:16px}
.rf-body{display:grid;grid-template-columns:210px 1fr 250px;gap:12px;min-height:400px}
/* lista */
.rf-list{display:flex;flex-direction:column;gap:4px;max-height:430px;overflow:auto;padding-right:2px}
.rf-lh{font:16px Pix;color:#c9a9b6;margin-bottom:2px}
.rf-li{display:flex;align-items:center;gap:8px;padding:5px 6px;background:#251a33;border:2px solid #0c0812;box-shadow:inset 3px 0 0 var(--rc);color:#e3dcef;text-align:left;transition:transform .12s,background .12s}
.rf-li:hover{background:#33223f;transform:translateX(3px)}
.rf-li.on{background:#43223a;box-shadow:inset 3px 0 0 var(--rc),0 0 0 2px #e0283f99}
.rf-li img{width:32px;height:32px;image-rendering:pixelated;flex:none}
.rf-li span{display:flex;flex-direction:column;min-width:0;flex:1}
.rf-li b{font:15px Pix;font-weight:normal;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.rf-li small{font-size:11px;color:#8e86a3}
.rf-li em{font:18px Pix;font-style:normal;text-shadow:0 0 6px currentColor}
.rf-empty{color:#8e86a3;font-size:14px}
/* palco */
.rf-stage{position:relative;overflow:hidden;min-height:400px;border:2px solid #0c0812;box-shadow:inset 0 0 0 2px #3e2238;
  background:radial-gradient(ellipse at 50% 46%,color-mix(in srgb,var(--gc,#e0283f) 22%,transparent) 0%,transparent 45%),radial-gradient(ellipse at 50% 100%,#4a0f1d 0%,transparent 60%),#120c1a;--gc:#e0283f;--gs:0px;--pulse:2s}
.rf-fx{position:absolute;inset:0;width:100%;height:100%;image-rendering:pixelated;pointer-events:none;z-index:3}
.rf-ring{position:absolute;left:50%;top:44%;width:210px;height:210px;margin:-105px 0 0 -105px;border-radius:50%;border:2px dashed color-mix(in srgb,var(--gc) 55%,#5a2a3a);opacity:.55;animation:rf-spin 18s linear infinite}
.rf-ring.b{width:160px;height:160px;margin:-80px 0 0 -80px;border-style:dotted;animation-duration:11s;animation-direction:reverse;opacity:.4}
.rf-stage[data-tier="-1"] .rf-ring{border-color:#3e2a44}
.rf-altar{position:absolute;left:50%;bottom:30px;width:150px;height:46px;margin-left:-75px;background:linear-gradient(#4a3a52,#2a1f33 60%,#1a1222);border:3px solid #0c0812;box-shadow:inset 0 3px #6a5672,0 6px 0 #0c0812}
.rf-altar i{position:absolute;left:12px;right:12px;top:-12px;height:12px;background:#3a2c44;border:3px solid #0c0812;border-bottom:0;box-shadow:inset 0 2px #6a5672}
.rf-altar::after{content:"";position:absolute;left:50%;top:14px;width:46px;height:8px;margin-left:-23px;background:#e0283f;box-shadow:0 0 10px #e0283f;opacity:.7;animation:rf-pulse var(--pulse) ease-in-out infinite}
.rf-item{position:absolute;left:50%;top:44%;width:128px;height:128px;margin:-64px 0 0 -64px;z-index:2}
.rf-bob{position:relative;width:100%;height:100%;animation:rf-bob 2.4s ease-in-out infinite}
.rf-img,.rf-half img{width:128px;height:128px;image-rendering:pixelated;display:block}
.rf-img{filter:drop-shadow(0 0 var(--gs) var(--gc)) drop-shadow(0 0 calc(var(--gs) / 2) var(--gc));animation:rf-glow var(--pulse) ease-in-out infinite}
.rf-stage[data-tier="2"] .rf-img,.rf-stage[data-tier="3"] .rf-img{animation:rf-glow var(--pulse) ease-in-out infinite,rf-tremble .18s steps(2) infinite}
.rf-half{position:absolute;inset:0;overflow:hidden;visibility:hidden}
.rf-half.l{clip-path:polygon(0 0,58% 0,44% 30%,60% 52%,40% 74%,52% 100%,0 100%)}
.rf-half.r{clip-path:polygon(58% 0,100% 0,100% 100%,52% 100%,40% 74%,60% 52%,44% 30%)}
.rf-flash{position:absolute;inset:0;opacity:0;pointer-events:none;z-index:4;mix-blend-mode:screen}
.rf-flash.go{animation:rf-flash .7s ease-out}
.rf-lvl{position:absolute;left:0;right:0;top:12px;text-align:center;font:44px Pix;text-shadow:0 0 12px currentColor,3px 3px 0 #0c0812;z-index:5}
.rf-name{position:absolute;left:0;right:0;bottom:4px;text-align:center;font:18px Pix;text-shadow:2px 2px 0 #0c0812;z-index:5}
.rf-pop{position:absolute;left:0;right:0;top:36%;text-align:center;font:34px Pix;opacity:0;z-index:6;pointer-events:none;text-shadow:0 0 14px currentColor,3px 3px 0 #0c0812}
.rf-pop.big{font-size:60px}
.rf-pop.show{animation:rf-popup 1.5s cubic-bezier(.2,1.6,.4,1) forwards}
/* estados */
.rf-stage.swap .rf-bob{animation:rf-swap .45s cubic-bezier(.2,1.6,.4,1),rf-bob 2.4s ease-in-out .45s infinite}
.rf-stage.charging .rf-bob{animation:rf-charge 1.3s ease-in forwards}
.rf-stage.charging .rf-img{animation:rf-glowfast .16s linear infinite}
.rf-stage.charging .rf-ring{animation-duration:1.2s;opacity:.9}
.rf-stage.ok .rf-bob{animation:rf-jump 1s cubic-bezier(.2,1.4,.4,1)}
.rf-stage.ok .rf-img{animation:rf-shine 1s ease-out}
.rf-stage.fail .rf-bob{animation:rf-dud 1s ease-out}
.rf-stage.fail .rf-img{animation:none;filter:grayscale(.8) brightness(.7);transition:filter .8s}
.rf-stage.broke .rf-img{visibility:hidden!important}
.rf-stage.broke .rf-half{visibility:visible}
.rf-stage.broke .rf-half.l{animation:rf-split-l 1.6s cubic-bezier(.3,.1,.6,1) forwards}
.rf-stage.broke .rf-half.r{animation:rf-split-r 1.6s cubic-bezier(.3,.1,.6,1) forwards}
.rf-stage.broke .rf-half img{filter:sepia(1) saturate(4) hue-rotate(-30deg) brightness(.8)}
.rf-win.jolt{animation:rf-jolt .16s}
.rf-win.quake{animation:rf-quake .5s}
/* lateral */
.rf-side{display:flex;flex-direction:column;gap:10px}
.rf-step{display:flex;align-items:center;justify-content:center;gap:10px;font:40px Pix;background:#140e1c;border:2px solid #0c0812;box-shadow:inset 0 0 0 2px #3e2238;padding:8px;text-shadow:0 0 10px currentColor}
.rf-step i{font-style:normal;color:#8e86a3;font-size:26px;text-shadow:none}
.rf-step .max{font-size:22px;color:#f7d77a}
.rf-preview{min-height:34px;padding:7px 9px;background:#10101a;border:1px solid #3e344f;color:#a9d7b6;font:13px/1.4 Txt,sans-serif;text-align:center}
.rf-preview b{color:#f7d77a;font-weight:700}
.rf-chance span{font:15px Pix;color:#c9a9b6}
.rf-bar{height:14px;background:#0b0712;border:2px solid #0c0812;box-shadow:inset 0 0 0 1px #3e2238;margin:4px 0}
.rf-bar i{display:block;height:100%;transition:width .4s,background .4s}
.rf-chance b{font:22px Pix;font-weight:normal;color:#efe6d6}
.rf-costs{display:flex;flex-direction:column;gap:4px}
.rf-costs div{display:flex;align-items:center;gap:6px;background:#140e1c;border:2px solid #0c0812;padding:4px 6px;font-size:13px}
.rf-costs img{width:24px;height:24px;image-rendering:pixelated}
.rf-costs span{flex:1;color:#c9bcd6}
.rf-costs b{font:18px Pix;font-weight:normal;color:#f7d77a}
.rf-costs small{color:#8e86a3}
.rf-costs .bad b{color:#e0283f}
.rf-costs .bone{width:24px;height:24px;background:radial-gradient(circle,#f7d77a 0 30%,#b88a2a 31% 45%,transparent 46%);flex:none}
.rf-safe{display:flex;align-items:center;gap:8px;text-align:left;padding:6px;background:#1d1a2c;border:2px solid #0c0812;box-shadow:inset 0 0 0 2px #3a3456;color:#e3dcef;transition:box-shadow .2s,background .2s}
.rf-safe img{width:32px;height:32px;image-rendering:pixelated}
.rf-safe span{display:flex;flex-direction:column;flex:1}
.rf-safe b{font:15px Pix;font-weight:normal}
.rf-safe small{font:11px Txt,sans-serif;color:#8e86a3}
.rf-safe em{font-style:normal;width:22px;height:22px;display:grid;place-items:center;border:2px solid #0c0812;background:#0b0712;color:#9fe0a0}
.rf-safe.on{background:#1f2a3a;box-shadow:inset 0 0 0 2px #6fa3d8,0 0 12px #6fa3d855}
.rf-safe:disabled{opacity:.45;cursor:default}
.rf-warn{font-size:13px;color:#9fb3c8;min-height:18px}
.rf-warn.danger{color:#ff6a7c;animation:rf-blink 1.4s ease-in-out infinite}
.rf-go{margin-top:auto;padding:14px;font-size:26px!important;color:#fff3d6;background:linear-gradient(#a8162f,#6b0f1f);border:3px solid #0c0812;box-shadow:inset 0 3px #e0566a,0 0 18px #e0283f66;letter-spacing:2px;text-shadow:2px 2px 0 #0c0812;transition:transform .1s,filter .2s}
.rf-go:hover:not(:disabled){filter:brightness(1.2);transform:translateY(-2px)}
.rf-go:active:not(:disabled){transform:translateY(1px)}
.rf-go:disabled{filter:grayscale(.8) brightness(.6);cursor:default}
.rf-msg{font-size:13px;color:#e6d3ac;min-height:34px}
@media (max-width:820px){.rf-body{grid-template-columns:1fr}.rf-list{flex-direction:row;overflow-x:auto;max-height:none}.rf-li{min-width:160px}.rf-stage{min-height:320px}}
/* animações */
@keyframes rf-spin{to{transform:rotate(360deg)}}
@keyframes rf-bob{0%,100%{transform:translateY(0)}50%{transform:translateY(-9px)}}
@keyframes rf-pulse{0%,100%{opacity:.35}50%{opacity:1}}
@keyframes rf-glow{0%,100%{filter:drop-shadow(0 0 var(--gs) var(--gc)) drop-shadow(0 0 calc(var(--gs)/2) var(--gc))}50%{filter:drop-shadow(0 0 calc(var(--gs)*1.7) var(--gc)) drop-shadow(0 0 var(--gs) var(--gc)) brightness(1.15)}}
@keyframes rf-glowfast{0%{filter:drop-shadow(0 0 6px #f7d77a) drop-shadow(0 0 14px #e0283f) brightness(1.2)}50%{filter:drop-shadow(0 0 14px #fff) drop-shadow(0 0 24px #e0283f) brightness(1.6)}100%{filter:drop-shadow(0 0 6px #f7d77a) drop-shadow(0 0 14px #e0283f) brightness(1.2)}}
@keyframes rf-tremble{0%{translate:0 0}50%{translate:1px -1px}}
@keyframes rf-swap{0%{transform:translateY(40px) scale(.4);opacity:0}100%{transform:none;opacity:1}}
@keyframes rf-charge{0%{transform:translate(0,0) rotate(0)}20%{transform:translate(-2px,-14px) rotate(-3deg)}40%{transform:translate(3px,-20px) rotate(4deg)}55%{transform:translate(-4px,-24px) rotate(-6deg)}70%{transform:translate(5px,-26px) rotate(7deg) scale(1.05)}82%{transform:translate(-6px,-28px) rotate(-8deg) scale(1.08)}92%{transform:translate(6px,-30px) rotate(9deg) scale(1.1)}100%{transform:translate(0,-30px) rotate(0) scale(1.12)}}
@keyframes rf-jump{0%{transform:translateY(-30px) scale(1.12)}15%{transform:translateY(-60px) scale(1.45) rotate(-8deg)}30%{transform:translateY(-20px) scale(1.2) rotate(8deg)}42%{transform:translateY(-34px) scale(1.25) rotate(-6deg)}55%{transform:translateY(-8px) scale(1.08) rotate(4deg)}70%{transform:translateY(-14px) scale(1.1) rotate(-2deg)}100%{transform:translateY(0) scale(1) rotate(0)}}
@keyframes rf-shine{0%{filter:brightness(4) drop-shadow(0 0 30px #fff)}40%{filter:brightness(1.8) drop-shadow(0 0 22px var(--gc)) drop-shadow(0 0 40px var(--gc))}100%{filter:drop-shadow(0 0 var(--gs) var(--gc)) drop-shadow(0 0 calc(var(--gs)/2) var(--gc))}}
@keyframes rf-dud{0%{transform:translateY(-30px) scale(1.1)}25%{transform:translateY(6px) scale(.95)}35%{transform:translate(-6px,4px)}45%{transform:translate(6px,4px)}55%{transform:translate(-4px,2px)}65%{transform:translate(3px,1px)}100%{transform:none}}
@keyframes rf-split-l{0%{transform:translateY(-30px)}12%{transform:translate(-4px,-30px) rotate(-4deg)}100%{transform:translate(-90px,140px) rotate(-70deg);opacity:0}}
@keyframes rf-split-r{0%{transform:translateY(-30px)}12%{transform:translate(4px,-30px) rotate(4deg)}100%{transform:translate(90px,150px) rotate(80deg);opacity:0}}
@keyframes rf-flash{0%{opacity:0}12%{opacity:1}100%{opacity:0}}
@keyframes rf-popup{0%{opacity:0;transform:translateY(20px) scale(.4)}18%{opacity:1;transform:translateY(-10px) scale(1.15)}30%{transform:translateY(-14px) scale(1)}80%{opacity:1;transform:translateY(-30px)}100%{opacity:0;transform:translateY(-50px)}}
@keyframes rf-jolt{0%{transform:translate(0,0)}50%{transform:translate(0,3px)}100%{transform:translate(0,0)}}
@keyframes rf-quake{0%,100%{transform:translate(0,0)}15%{transform:translate(-8px,4px)}30%{transform:translate(7px,-5px)}45%{transform:translate(-6px,3px)}60%{transform:translate(5px,-2px)}75%{transform:translate(-3px,2px)}}
@keyframes rf-blink{0%,100%{opacity:1}50%{opacity:.55}}

/* item que o personagem não pode usar (classe/nível) */
#inv .b.cant-use{position:relative}
#inv .b.cant-use>img{filter:grayscale(.7) brightness(.65)}
#inv .b.cant-use::after{content:"";position:absolute;inset:0;background:#e0283f2e;box-shadow:inset 0 0 0 2px #e0283f88;pointer-events:none}
.item-reqs{margin-top:6px;font-size:13px;line-height:1.5}
