/* GunBound Legacy — Halloween 2026 — Theme V2.4 TOPBAR APPROVED Solo ajusta: Tus Almas + Cómo conseguir Almas. No toca actividades. */ :root{ --hw24-orange:#ff7a12; --hw24-orange2:#ffb13b; --hw24-border:rgba(255,113,16,.72); --hw24-purple:rgba(187,49,255,.46); --hw24-panel:rgba(18,5,6,.82); --hw24-panel2:rgba(14,4,12,.82); } /* Banda superior: baja, alineada y centrada como en el mockup aprobado. */ .gbl-hw-v22-topbar{ width:min(1060px,calc(100% - 42px))!important; margin:-46px auto 18px!important; padding:0!important; position:relative!important; z-index:12!important; background:transparent!important; border:0!important; box-shadow:none!important; } .gbl-hw-v22-topbar .gbl-hw-v19-shell, #gbl-hw-v19-shell{ width:100%!important; max-width:none!important; margin:0!important; padding:0!important; display:grid!important; grid-template-columns:330px minmax(0,1fr)!important; gap:10px!important; align-items:stretch!important; background:transparent!important; } /* ===== SALDO ===== */ .gbl-hw-v22-topbar .gbl-hw-v19-balance{ min-height:84px!important; height:84px!important; margin:0!important; padding:9px 15px 9px 10px!important; display:grid!important; grid-template-columns:66px minmax(0,1fr)!important; align-items:center!important; gap:13px!important; overflow:hidden!important; border:1px solid var(--hw24-border)!important; border-radius:8px!important; background: linear-gradient(100deg,rgba(70,16,6,.88),rgba(23,5,5,.84) 54%,rgba(13,3,6,.82))!important; -webkit-backdrop-filter:blur(7px) saturate(1.12)!important; backdrop-filter:blur(7px) saturate(1.12)!important; box-shadow: 0 8px 24px rgba(0,0,0,.34), 0 0 14px rgba(255,82,0,.13), inset 0 0 22px rgba(255,93,0,.035)!important; } .gbl-hw-v22-topbar .gbl-hw-v19-balance__icon{ width:62px!important; height:62px!important; display:flex!important; align-items:center!important; justify-content:center!important; margin:0!important; border:1px solid rgba(255,151,49,.82)!important; border-radius:10px!important; background:linear-gradient(145deg,rgba(112,31,5,.88),rgba(42,9,3,.88))!important; box-shadow:inset 0 0 18px rgba(255,116,0,.15),0 0 10px rgba(255,74,0,.18)!important; font-size:34px!important; line-height:1!important; filter:drop-shadow(0 0 7px rgba(255,93,0,.80))!important; } .gbl-hw-v22-topbar .gbl-hw-v19-balance__label{ margin:0 0 1px!important; color:#fff0dd!important; font:900 12px/1.1 Arial,sans-serif!important; letter-spacing:.65px!important; text-transform:uppercase!important; white-space:nowrap!important; } .gbl-hw-v22-topbar .gbl-hw-v19-balance__value{ color:#ffb126!important; font:900 32px/.98 Arial,sans-serif!important; letter-spacing:-.5px!important; text-shadow:0 0 12px rgba(255,112,0,.52)!important; } .gbl-hw-v22-topbar .gbl-hw-v19-balance__unit{ color:#ffbd43!important; font:900 11px/1 Arial,sans-serif!important; margin-left:5px!important; } .gbl-hw-v22-topbar .gbl-hw-v19-balance__status{ display:none!important; } /* ===== GUÍA ===== */ .gbl-hw-v22-topbar .gbl-hw-v19-guide{ min-height:84px!important; margin:0!important; padding:9px 12px!important; display:grid!important; grid-template-columns:58px minmax(0,1fr) auto!important; grid-template-rows:auto!important; align-items:center!important; column-gap:13px!important; row-gap:10px!important; overflow:visible!important; border:1px solid rgba(182,56,255,.48)!important; border-radius:8px!important; background: linear-gradient(100deg,rgba(29,7,17,.86),rgba(14,4,12,.83) 65%,rgba(25,5,18,.84))!important; -webkit-backdrop-filter:blur(7px) saturate(1.10)!important; backdrop-filter:blur(7px) saturate(1.10)!important; box-shadow: 0 8px 24px rgba(0,0,0,.34), 0 0 12px rgba(196,43,255,.08), inset 0 0 24px rgba(179,44,255,.025)!important; } .gbl-hw-v24-guide-icon{ width:56px!important; height:56px!important; display:flex!important; align-items:center!important; justify-content:center!important; border:1px solid rgba(255,137,38,.36)!important; border-radius:9px!important; background:linear-gradient(145deg,rgba(89,27,6,.44),rgba(28,8,12,.55))!important; box-shadow:inset 0 0 14px rgba(255,99,0,.06)!important; font-size:29px!important; line-height:1!important; filter:drop-shadow(0 0 4px rgba(255,118,0,.24))!important; } .gbl-hw-v24-guide-copy{ min-width:0!important; align-self:center!important; } .gbl-hw-v22-topbar .gbl-hw-v19-guide__title{ margin:0 0 3px!important; padding:0!important; text-align:left!important; color:#fff1dd!important; font:900 15px/1.12 Arial,sans-serif!important; text-transform:uppercase!important; letter-spacing:.15px!important; text-shadow:none!important; } .gbl-hw-v22-topbar .gbl-hw-v19-guide__intro{ max-width:none!important; margin:0!important; padding:0!important; text-align:left!important; color:#e1cfc5!important; font:600 11px/1.36 Arial,sans-serif!important; } .gbl-hw-v22-topbar .gbl-hw-v2-guide-toggle{ position:static!important; right:auto!important; top:auto!important; transform:none!important; min-width:154px!important; height:38px!important; margin:0!important; padding:0 14px!important; display:inline-flex!important; align-items:center!important; justify-content:center!important; border:1px solid rgba(255,152,33,.86)!important; border-radius:7px!important; background:linear-gradient(180deg,rgba(89,29,5,.95),rgba(43,12,3,.96))!important; color:#ffe7b5!important; font:900 11px/1 Arial,sans-serif!important; white-space:nowrap!important; box-shadow:0 0 11px rgba(255,89,0,.12),inset 0 0 9px rgba(255,138,0,.035)!important; cursor:pointer!important; transition:transform .15s ease,filter .15s ease,background .15s ease!important; } .gbl-hw-v22-topbar .gbl-hw-v2-guide-toggle:hover{ transform:translateY(-1px)!important; filter:brightness(1.12)!important; background:linear-gradient(180deg,rgba(126,42,6,.98),rgba(58,16,3,.98))!important; } /* Cuando se abren las instrucciones, conservamos la franja y desplegamos el contenido debajo. */ .gbl-hw-v22-topbar .gbl-hw-v19-guide__grid, .gbl-hw-v22-topbar .gbl-hw-v19-guide__note{ grid-column:1/-1!important; } .gbl-hw-v22-topbar .gbl-hw-v19-guide:not(.gbl-hw-v2-collapsed){ min-height:84px!important; height:auto!important; align-items:start!important; } .gbl-hw-v22-topbar .gbl-hw-v19-guide:not(.gbl-hw-v2-collapsed) .gbl-hw-v24-guide-icon, .gbl-hw-v22-topbar .gbl-hw-v19-guide:not(.gbl-hw-v2-collapsed) .gbl-hw-v24-guide-copy, .gbl-hw-v22-topbar .gbl-hw-v19-guide:not(.gbl-hw-v2-collapsed) .gbl-hw-v2-guide-toggle{ align-self:center!important; } /* No alteramos Ritual/Desafíos/Bazar en esta versión. */ @media(max-width:900px){ .gbl-hw-v22-topbar{width:min(94%,1060px)!important;margin:-34px auto 14px!important} .gbl-hw-v22-topbar .gbl-hw-v19-shell,#gbl-hw-v19-shell{grid-template-columns:280px minmax(0,1fr)!important;gap:8px!important} .gbl-hw-v22-topbar .gbl-hw-v19-balance{grid-template-columns:54px minmax(0,1fr)!important;height:78px!important;min-height:78px!important;padding:8px 11px 8px 8px!important;gap:10px!important} .gbl-hw-v22-topbar .gbl-hw-v19-balance__icon{width:50px!important;height:50px!important;font-size:29px!important} .gbl-hw-v22-topbar .gbl-hw-v19-balance__value{font-size:28px!important} .gbl-hw-v22-topbar .gbl-hw-v19-guide{min-height:78px!important;grid-template-columns:48px minmax(0,1fr) auto!important;gap:9px!important;padding:8px 9px!important} .gbl-hw-v24-guide-icon{width:46px!important;height:46px!important;font-size:24px!important} .gbl-hw-v22-topbar .gbl-hw-v19-guide__title{font-size:13px!important} .gbl-hw-v22-topbar .gbl-hw-v19-guide__intro{font-size:10px!important} .gbl-hw-v22-topbar .gbl-hw-v2-guide-toggle{min-width:132px!important;height:34px!important;font-size:10px!important;padding:0 10px!important} } @media(max-width:690px){ .gbl-hw-v22-topbar{margin:-14px auto 12px!important;width:94%!important} .gbl-hw-v22-topbar .gbl-hw-v19-shell,#gbl-hw-v19-shell{grid-template-columns:1fr!important;gap:7px!important} .gbl-hw-v22-topbar .gbl-hw-v19-balance{height:72px!important;min-height:72px!important} .gbl-hw-v22-topbar .gbl-hw-v19-guide{min-height:78px!important;grid-template-columns:45px minmax(0,1fr)!important} .gbl-hw-v22-topbar .gbl-hw-v2-guide-toggle{grid-column:1/-1!important;width:100%!important;height:34px!important} }