/* Reino Pixel Online v3 — Economia (Troca, Mercado, Banco). Arte: Designer v3 (assets/v3/hud). Janela/abas/botões a 2× (inteiro, sem suavização). */
.eco{--gold:#f5c542;--gold2:#ffe9a8;--ink:#f2f0e4;--mut:#a8b0c2;--navy:#1b2233;--navy2:#141a2a;--line:#3a4566;--ok:#5fd35f;--bad:#ff6a6a;image-rendering:pixelated;font-family:system-ui,sans-serif;color:var(--ink)}
.ecoWin{position:absolute;z-index:40;left:50%;top:50%;transform:translate(-50%,-50%);width:min(97%,740px);max-height:97%;display:flex;flex-direction:column;
 border:16px solid transparent;border-image:url(assets/v3/hud/janela-moldura-9slice.png) 8 fill / 16px stretch;background:transparent;filter:drop-shadow(0 10px 0 rgba(0,0,0,.45));animation:ecoIn .16s ease-out}
.ecoWin.bank{width:min(97%,520px)}
.ecoWin.hidden{display:none!important}
@keyframes ecoIn{from{opacity:0;transform:translate(-50%,-47%)}to{opacity:1;transform:translate(-50%,-50%)}}
.ecoTitle{position:relative;height:40px;margin:-8px -8px 4px;border:0 solid transparent;border-image:url(assets/v3/hud/janela-titulo-9slice.png) 0 8 / 0 16px stretch;border-left-width:16px;border-right-width:16px;display:flex;align-items:center;justify-content:space-between;cursor:grab;user-select:none;padding:0 4px}
.ecoTitle b{font:10px 'Press Start 2P',monospace;color:var(--gold2);text-shadow:2px 2px 0 #3a0e1c;letter-spacing:.5px}
.ecoClose{width:32px;height:32px;border:0;padding:0;background:url(assets/v3/hud/botao-fechar-16-4estados.png) 0 0/128px 32px no-repeat;cursor:pointer;image-rendering:pixelated}
.ecoClose:hover{background-position:-32px 0}.ecoClose:active{background-position:-64px 0}
.ecoBody{overflow:auto;padding:2px 6px 8px;min-height:0;flex:1;scrollbar-width:thin;scrollbar-color:#7a5834 #0b0e18}
.ecoBody::-webkit-scrollbar{width:12px}.ecoBody::-webkit-scrollbar-track{background:#0b0e18;border-left:2px solid #1b2233}.ecoBody::-webkit-scrollbar-thumb{background:#7a5834;border:2px solid #0b0e18}
/* abas */
.ecoTabs{display:flex;gap:2px;margin:0 0 6px;border-bottom:2px solid #7a5834}
.ecoTab{height:32px;padding:0 14px;color:var(--mut);font:600 12px system-ui;cursor:pointer;background:none;border:0 solid transparent;border-top-width:10px;border-left-width:10px;border-right-width:10px;border-image:url(assets/v3/hud/ui/tab-off.png) 5 5 0 5 fill / 10px 10px 0 10px stretch;margin-bottom:-2px;display:flex;align-items:center;gap:6px}
.ecoTab.on{color:var(--gold2);border-image-source:url(assets/v3/hud/ui/tab-on.png)}.ecoTab:hover{color:#fff}
.ecoTab .dot{width:8px;height:8px;border-radius:50%;background:var(--bad);display:none;box-shadow:0 0 6px var(--bad)}.ecoTab.alert .dot{display:inline-block;animation:ecoPulse 1s infinite}
@keyframes ecoPulse{50%{opacity:.35}}
/* botões */
.ecoBtn{font:700 12px system-ui;color:#2a1a00;min-height:40px;padding:0 6px;border:12px solid transparent;border-image:url(assets/v3/hud/ui/btn-normal.png) 6 fill / 12px stretch;background:none;cursor:pointer;display:inline-flex;align-items:center;justify-content:center;gap:6px;margin:0 2px;white-space:nowrap;line-height:1;color:var(--ink);text-shadow:1px 1px 0 #000}
.ecoBtn{border-width:6px 12px;height:40px}
.ecoBtn:hover:not(:disabled){border-image-source:url(assets/v3/hud/ui/btn-hover.png)}.ecoBtn:active:not(:disabled){border-image-source:url(assets/v3/hud/ui/btn-pressed.png);padding-top:2px}
.ecoBtn:disabled{border-image-source:url(assets/v3/hud/ui/btn-disabled.png);color:#7a8196;cursor:not-allowed;text-shadow:none}
.ecoBtn.pri{border-image-source:url(assets/v3/hud/ui/btn-primary.png)}.ecoBtn.pri:hover:not(:disabled){filter:brightness(1.15)}
.ecoBtn.sm{min-height:20px;height:28px;border-width:6px 6px;font-size:11px;padding:0 2px;border-image-width:6px}
.ecoBtn.sm:active:not(:disabled){padding-top:1px}
.ecoBtn.pulse:not(:disabled){animation:ecoGlow 1.1s infinite}
@keyframes ecoGlow{50%{filter:brightness(1.3) drop-shadow(0 0 6px #7dff6a)}}
/* painéis internos */
.ecoBox{background:var(--navy2);border:2px solid var(--line);outline:2px solid #0b0e18;padding:8px;margin:0 0 8px;position:relative}
.ecoBox h4{margin:0 0 6px;font:9px 'Press Start 2P',monospace;color:var(--gold);letter-spacing:.5px}
.ecoRow{display:flex;gap:8px;align-items:center;flex-wrap:wrap}
.ecoCols{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.eco small,.eco .mut{color:var(--mut)}
.eco input[type=text],.eco input[type=number],.eco select{background:#0b0e18;color:var(--ink);border:2px solid var(--line);border-radius:0;padding:6px 8px;font:13px system-ui;min-width:0;outline:none}
.eco input:focus,.eco select:focus{border-color:var(--gold)}
.eco select{padding:5px 4px}
/* slots */
.slotE{position:relative;width:36px;height:36px;background:url(assets/v3/hud/slot-estados-36.png) 0 0/288px 36px no-repeat;display:inline-flex;align-items:center;justify-content:center;flex:none;cursor:pointer;image-rendering:pixelated;vertical-align:top}
.slotE:hover{background-position:-36px 0}.slotE.sel{background-position:-72px 0}.slotE.lock{background-position:-108px 0;cursor:not-allowed}.slotE.off{background-position:-180px 0;opacity:.55;cursor:not-allowed}.slotE.good{background-position:-216px 0}.slotE.badE{background-position:-252px 0}
.slotE img.pxi{width:32px;height:32px;position:absolute;left:2px;top:2px;pointer-events:none}
.slotE .rf{position:absolute;inset:0;background:url(assets/v3/icons/molduras-raridade-36.png) 0 0/180px 36px no-repeat;pointer-events:none}
.slotE.r-incomum .rf{background-position:-36px 0}.slotE.r-raro .rf{background-position:-72px 0}.slotE.r-epico .rf{background-position:-108px 0}.slotE.r-lendario .rf{background-position:-144px 0}
.slotE.r-lendario{animation:ecoLeg 2.2s infinite}@keyframes ecoLeg{50%{filter:drop-shadow(0 0 4px #ffa53a)}}
.slotE .q{position:absolute;right:2px;bottom:0;font:700 11px system-ui;color:#fff;text-shadow:1px 1px 0 #000,-1px -1px 0 #000,1px -1px 0 #000,-1px 1px 0 #000;pointer-events:none}
.slotE.pop{animation:ecoPop .28s ease-out}@keyframes ecoPop{0%{transform:scale(.4);opacity:0}70%{transform:scale(1.15)}100%{transform:scale(1);opacity:1}}
.slotE.dragover{outline:2px dashed var(--gold);outline-offset:1px}
.grid{display:grid;grid-template-columns:repeat(6,36px);gap:3px;justify-content:start}
.grid.g8{grid-template-columns:repeat(8,36px)}
.offerZone{min-height:78px;border:2px dashed #3a4566;padding:4px;background:#0b0e1855;transition:border-color .15s,background .15s}
.offerZone.dragover{border-color:var(--gold);background:#f5c54222}
.offerZone .hint{color:#5d6580;font-size:12px;padding:8px 4px}
.bag{max-height:150px;overflow:auto;padding:2px}
/* troca */
.tradeSide.ok .ecoBox,.tradeSide .ecoBox.ok{border-color:var(--ok);box-shadow:0 0 0 2px #0b0e18,0 0 12px #5fd35f55 inset}
.tradeSide .who{display:flex;justify-content:space-between;align-items:center;margin-bottom:6px;font-weight:700}
.chip{display:inline-block;font:8px 'Press Start 2P',monospace;padding:3px 5px;border-radius:2px;background:#252e47;color:var(--mut)}
.chip.ok{background:#1d4d24;color:#c8ffd0;animation:ecoPop .3s}.chip.wait{background:#4d3a16;color:var(--gold2)}.chip.bad{background:#5a1a1a;color:#ffd0d0}
.gp{display:inline-flex;align-items:center;gap:4px;color:var(--gold);font-weight:700}
.gp i.coin,.coin16{width:16px;height:16px;display:inline-block;image-rendering:pixelated;flex:none}
.lockbar{height:6px;background:#0b0e18;border:1px solid var(--line);margin:6px 0}.lockbar i{display:block;height:100%;background:linear-gradient(90deg,#c9952a,#ffe9a8);transition:width .1s linear}
.confirmSheet{position:absolute;inset:0;background:#0a0e1a;z-index:5;padding:10px;overflow:auto;animation:ecoIn2 .18s}
@keyframes ecoIn2{from{opacity:0}to{opacity:1}}
.confirmSheet h3{margin:0 0 8px;font:10px 'Press Start 2P',monospace;color:var(--gold2);text-align:center}
.cfArrow{text-align:center;font-size:22px;color:var(--gold);margin:2px 0}
.invite{background:linear-gradient(#3a2a10,#22180a);border:2px solid #a07a2a;padding:8px;margin-bottom:8px;animation:ecoPop .3s}
.nearRow,.histRow,.offRow,.logRow{display:flex;align-items:center;gap:8px;padding:5px 4px;border-bottom:1px solid #252e47}
.nearRow:hover,.offRow:hover{background:#ffffff0a}
.offRow .nm{font-weight:700;min-width:0}.offRow .grow,.nearRow .grow{flex:1;min-width:0}
.afx{display:inline-block;font-size:10px;color:#c9b8ff;background:#2a2050;border:1px solid #4a3a8a;padding:0 4px;margin:1px 2px 0 0}
.afx.gem{color:#8fe9ff;background:#10343f;border-color:#2a6b7c}.afx.set{color:#9fe0a0;background:#17351c;border-color:#2f7a3f}.afx.uni{color:#ffd28a;background:#4a300c;border-color:#a0661a}
.price{color:var(--gold);font-weight:700;white-space:nowrap}
.mkbar{display:flex;gap:4px;flex-wrap:wrap;align-items:center;margin-bottom:6px}
.mkbar input[type=text]{flex:1;min-width:120px}
.pager{display:flex;gap:6px;align-items:center;justify-content:center;margin-top:6px}
.statGrid{display:grid;grid-template-columns:repeat(4,1fr);gap:6px;margin:6px 0}.statGrid div{background:#0b0e18;border:2px solid var(--line);padding:6px;text-align:center}.statGrid b{display:block;color:var(--gold);font-size:14px}.statGrid small{font-size:10px}
.spark{display:block;width:100%;height:60px;background:#0b0e18;border:2px solid var(--line)}
/* banco */
.balBig{font:14px 'Press Start 2P',monospace;color:var(--gold2);text-shadow:2px 2px 0 #3a2a00;margin:2px 0}
.balCard{display:flex;gap:10px;align-items:center;justify-content:space-between}
.coinRow{display:flex;gap:6px;flex-wrap:wrap;align-items:center}
.coinStack{display:inline-flex;align-items:center;gap:3px;background:#0b0e18;border:2px solid var(--line);padding:2px 6px 2px 2px;font-weight:700;font-size:12px}
.logRow .k{font:8px 'Press Start 2P',monospace;min-width:62px;color:var(--mut);white-space:nowrap}#mkBody .logRow .k{font:12px system-ui;min-width:88px}.logRow .v{margin-left:auto;font-weight:700}.v.pos{color:#7dff6a}.v.neg{color:#ff8a8a}
/* tooltip */
#ecoTip{position:fixed;z-index:200;pointer-events:none;min-width:190px;max-width:270px;border:8px solid transparent;border-image:url(assets/v3/hud/tooltip-9slice.png) 4 fill / 8px stretch;font-size:12px;line-height:1.35;color:var(--ink);image-rendering:pixelated;filter:drop-shadow(0 4px 0 rgba(0,0,0,.5))}
#ecoTip.hidden{display:none}#ecoTip .tn{font-weight:700;font-size:13px}#ecoTip .ts{margin:3px 0;color:var(--mut)}#ecoTip .st{color:#9fe0a0}#ecoTip .gold{color:var(--gold)}
/* toasts e efeitos */
.ecoToast{position:absolute;left:50%;bottom:92px;transform:translateX(-50%);z-index:60;min-width:220px;max-width:80%;text-align:left;padding:6px 6px 6px 4px;font:700 13px system-ui;color:#fff;text-shadow:1px 1px 0 #000;border-style:solid;border-color:transparent;border-width:14px 14px 14px 49px;border-image:url(assets/v3/hud/ui/toast-1.png) 8 8 8 28 fill / 14px 14px 14px 49px stretch;animation:ecoToast 3.2s ease-out forwards;pointer-events:none;image-rendering:pixelated}
.ecoToast::before{content:'';position:absolute;left:-44px;top:50%;margin-top:-14px;width:28px;height:28px;background:url(assets/v3/hud/toast-icones-16.png) 0 0/140px 28px no-repeat;image-rendering:pixelated}
.ecoToast.t0::before{background-position:0 0}.ecoToast.t1::before{background-position:-28px 0}.ecoToast.t2::before{background-position:-56px 0}.ecoToast.t3::before{background-position:-84px 0}.ecoToast.t4::before{background-position:-112px 0}
.ecoToast.t0{border-image-source:url(assets/v3/hud/ui/toast-0.png)}.ecoToast.t2{border-image-source:url(assets/v3/hud/ui/toast-2.png)}.ecoToast.t3{border-image-source:url(assets/v3/hud/ui/toast-3.png)}.ecoToast.t4{border-image-source:url(assets/v3/hud/ui/toast-4.png)}
@keyframes ecoToast{0%{opacity:0;transform:translate(-50%,14px)}10%{opacity:1;transform:translate(-50%,0)}85%{opacity:1}100%{opacity:0;transform:translate(-50%,-6px)}}
.ecoCoinFx{position:absolute;width:16px;height:16px;z-index:70;pointer-events:none;image-rendering:pixelated;animation:ecoFall 1.1s cubic-bezier(.2,.7,.4,1) forwards}
@keyframes ecoFall{0%{transform:translate(0,0) scale(.6);opacity:1}60%{opacity:1}100%{transform:translate(var(--dx),var(--dy)) scale(1) rotate(var(--rot));opacity:0}}
.ecoFlash{position:absolute;inset:0;background:radial-gradient(circle,#ffe9a888,transparent 65%);z-index:65;pointer-events:none;animation:ecoFlash .7s ease-out forwards}@keyframes ecoFlash{from{opacity:1}to{opacity:0}}
.qtyPop{position:fixed;z-index:210;background:var(--navy);border:2px solid var(--gold);outline:2px solid #0b0e18;padding:8px;display:flex;gap:6px;align-items:center;box-shadow:0 6px 0 #0008}
.qtyPop input{width:90px}
.ctxMenu{position:fixed;z-index:220;background:var(--navy);border:2px solid var(--gold);outline:2px solid #0b0e18;min-width:170px;box-shadow:0 6px 0 #0008}
.ctxMenu div{padding:7px 12px;cursor:pointer;font-size:13px}.ctxMenu div:hover{background:#f5c54233;color:#fff}.ctxMenu .h{color:var(--gold);cursor:default;font:8px 'Press Start 2P',monospace;background:#0b0e18}.ctxMenu .h:hover{background:#0b0e18;color:var(--gold)}
#btnTrade.pend{animation:ecoGlow 1s infinite}
#coins.ecoCoins{cursor:help}
.bagCoins{display:flex;gap:6px;flex-wrap:wrap;align-items:center;margin:6px 0;font-size:12px}
body.mport .ecoWin{width:99%}body.mport .ecoCols{grid-template-columns:1fr}
@media (prefers-reduced-motion:reduce){.eco *,.ecoWin,.ecoToast,.slotE{animation:none!important}}
.offRow .price+small{display:block;margin-top:2px}