/* Recodet V138 — approved Main Hub */ :root{--hub138-gold:#e7b943;--hub138-hi:#ffd76f;--hub138-line:#9b7626;--hub138-emblem:url("./recodet-emblem.svg")} body:has(#viewMain:not(.hidden)){background:radial-gradient(85% 44% at 50% 3%,rgba(231,185,67,.10),transparent 72%),#050504!important} #viewMain{width:min(100%,760px)!important;margin:0 auto!important;padding:8px 12px 104px!important;gap:12px!important} #viewMain .hubSignoutRow,#viewMain .hubModulesHead{display:none!important} #viewMain .hubProHero{position:relative;height:156px;margin:2px 0 6px;overflow:hidden;border:1px solid rgba(231,185,67,.56);border-radius:22px;background: radial-gradient(ellipse 95% 78% at 50% 112%,rgba(239,192,63,.12) 0 44%,rgba(231,185,67,.42) 44.6%,transparent 46%), repeating-radial-gradient(ellipse 100% 82% at 50% 116%,transparent 0 15px,rgba(231,185,67,.055) 16px 17px), repeating-linear-gradient(15deg,transparent 0 29px,rgba(231,185,67,.038) 30px 31px), linear-gradient(180deg,#151005,#060604 76%);box-shadow:inset 0 0 38px rgba(231,185,67,.045),0 10px 26px rgba(0,0,0,.38)} #viewMain .hubProHero::before{content:"BUILD\A MOVE\A EARN\A TOGETHER";white-space:pre;position:absolute;left:16px;top:48px;color:#d8b758;font:700 9px/1.75 system-ui;letter-spacing:.28em;z-index:2} #viewMain .hubProHero::after{content:"A BRIGHTER\A TOMORROW";white-space:pre;position:absolute;right:16px;top:50px;color:#d9c281;text-align:right;font:700 8px/1.75 system-ui;letter-spacing:.22em;z-index:2} #viewMain .hubProHeroMark{display:none!important} #viewMain .mainModuleElectronicsGrid{display:grid!important;grid-template-columns:repeat(3,minmax(0,1fr))!important;gap:10px!important} #viewMain .mainModuleElectronicsGrid>[data-screen="INV_00_HOME"]{display:none!important} #viewMain .mainModuleElectronicsGrid>.hubModuleTile.menuModuleCard,#viewMain .mainModuleElectronicsGrid>.hubModuleTile.menuModuleCard.hubPrimaryCard{position:relative!important;aspect-ratio:1.42/1!important;min-height:0!important;padding:11px 8px 9px!important;display:flex!important;flex-direction:column!important;justify-content:center!important;align-items:center!important;gap:6px!important;border:1px solid rgba(101,105,113,.58)!important;border-radius:17px!important;color:#aeb1b8!important;background:linear-gradient(180deg,#131519,#0c0e11)!important;box-shadow:inset 0 0 0 3px #090a0c,inset 0 0 0 4px rgba(77,82,91,.62),0 8px 18px rgba(0,0,0,.28)!important} #viewMain .mainModuleElectronicsGrid>.hubModuleTile.menuModuleCard::before{content:""!important;position:absolute!important;inset:7px!important;border:1px solid rgba(113,118,128,.30)!important;border-radius:12px!important;background:none!important;opacity:1!important;pointer-events:none!important} #viewMain .mainModuleElectronicsGrid>.hubModuleTile.menuModuleCard:not(.launchAccessLocked).is-selected,#viewMain .mainModuleElectronicsGrid>.hubModuleTile.menuModuleCard.hubPrimaryCard:not(.launchAccessLocked){color:#ffd255!important;border-color:rgba(231,185,67,.92)!important;background:radial-gradient(80% 75% at 50% 24%,rgba(231,185,67,.17),transparent 70%),linear-gradient(180deg,#17140d,#0c0b08)!important;box-shadow:inset 0 0 0 3px #0a0906,inset 0 0 0 4px rgba(231,185,67,.65),0 0 22px rgba(231,185,67,.15),0 8px 18px rgba(0,0,0,.34)!important} #viewMain .mainModuleElectronicsGrid>.hubModuleTile.menuModuleCard.launchAccessLocked{color:#8b8f97!important;border-color:rgba(102,106,114,.48)!important;background:linear-gradient(180deg,#121419,#0d0f12)!important;box-shadow:inset 0 0 0 3px #090a0c,inset 0 0 0 4px rgba(73,78,87,.52),0 8px 18px rgba(0,0,0,.28)!important} #viewMain .mainModuleElectronicsGrid .hubModuleIcon,#viewMain .mainModuleElectronicsGrid .hubPrimaryCard .hubModuleIcon{position:relative!important;z-index:1!important;display:grid!important;place-items:center!important;width:50%!important;height:auto!important;aspect-ratio:1/1!important;margin:0!important;color:inherit!important;background:transparent!important;filter:drop-shadow(0 0 7px rgba(231,185,67,.08))!important} #viewMain .mainModuleElectronicsGrid .hubModuleIcon svg{width:78%!important;height:78%!important} #viewMain .mainModuleSeq,#viewMain .mainModuleCode,#viewMain .mainModuleDivider,#viewMain .mainModuleSub{display:none!important} #viewMain .hubModuleLabel,#viewMain .mainModuleElectronicsGrid .hubModuleLabel,#viewMain .mainModuleElectronicsGrid .hubPrimaryCard .hubModuleLabel{display:block!important;position:relative!important;z-index:1!important;width:auto!important;height:auto!important;margin:0!important;padding:0!important;color:inherit!important;font:800 clamp(11px,3.2vw,16px)/1.05 system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif!important;letter-spacing:-.02em!important;overflow:visible!important;white-space:nowrap!important} #viewMain .hubModuleTile.launchAccessLocked::after{top:10px!important;right:8px!important;min-height:18px!important;padding:3px 6px!important;border-radius:999px!important;font-size:7px!important} /* approved top identity row */ body:has(#viewMain:not(.hidden)) .topbar.topbarTwoRow{position:relative!important;min-height:68px!important;height:68px!important;padding:0 8px!important;background:#050504!important;border-bottom:1px solid rgba(231,185,67,.18)!important;box-shadow:none!important} body:has(#viewMain:not(.hidden)) .topbarPrimaryRow{position:absolute!important;left:50%!important;top:8px!important;transform:translateX(-50%)!important;width:118px!important;height:52px!important;display:flex!important;align-items:center!important;justify-content:center!important} body:has(#viewMain:not(.hidden)) .globalBackBtn,body:has(#viewMain:not(.hidden)) .compactHomeBtn{display:none!important} body:has(#viewMain:not(.hidden)) #pageTitle{display:flex!important;align-items:center!important;justify-content:center!important;gap:6px!important;width:118px!important;height:50px!important;max-width:none!important;font-size:0!important;color:#e9bd49!important} body:has(#viewMain:not(.hidden)) #pageTitle::before{content:"";width:45px;height:48px;background-image:var(--hub138-emblem);background-size:contain;background-repeat:no-repeat;background-position:center;filter:drop-shadow(0 0 8px rgba(231,185,67,.16))} body:has(#viewMain:not(.hidden)) #pageTitle::after{content:"RECODET";color:#e8bd4d;font:800 12px/1 system-ui;letter-spacing:.14em} body:has(#viewMain:not(.hidden)) #pageTitle>*{display:none!important} body:has(#viewMain:not(.hidden)) .topbarSecondaryRow{position:static!important;width:100%!important;height:68px!important} body:has(#viewMain:not(.hidden)) .topbarSecondaryActions{position:static!important;width:100%!important;height:68px!important;display:block!important} body:has(#viewMain:not(.hidden)) #teamTopBadge{display:flex!important;position:absolute!important;left:8px!important;top:12px!important;width:88px!important;height:44px!important;align-items:center!important;gap:5px!important;padding:4px 7px!important;border:1px solid rgba(231,185,67,.66)!important;border-radius:999px!important;background:#090805!important;color:#f4f0e7!important} body:has(#viewMain:not(.hidden)) #teamTopBadge .teamBadgeMark{display:grid!important;place-items:center!important;width:32px!important;height:32px!important;flex:0 0 32px!important;overflow:hidden!important;border:1px solid rgba(231,185,67,.48)!important;border-radius:50%!important;background:#13110b!important} body:has(#viewMain:not(.hidden)) #teamTopBadge .teamBadgeMark img{width:100%!important;height:100%!important;object-fit:cover!important;border-radius:50%!important} body:has(#viewMain:not(.hidden)) #teamTopBadge .teamBadgeName{display:block!important;max-width:38px!important;overflow:hidden!important;text-overflow:ellipsis!important;white-space:nowrap!important;font:700 10px/1 system-ui!important} body:has(#viewMain:not(.hidden)) #coinPill{display:flex!important;position:absolute!important;right:86px!important;top:12px!important;width:66px!important;height:44px!important;align-items:center!important;justify-content:center!important;gap:4px!important;padding:4px 7px!important;border:1px solid rgba(231,185,67,.66)!important;border-radius:999px!important;background:#090805!important;color:#f4f0e7!important} body:has(#viewMain:not(.hidden)) #coinPill .coinIcon{width:22px!important;height:22px!important} body:has(#viewMain:not(.hidden)) #coinPill .coinValueWrap{display:flex!important;gap:2px!important;align-items:baseline!important} body:has(#viewMain:not(.hidden)) #coinPill .coinAmt{font-size:11px!important} body:has(#viewMain:not(.hidden)) #coinPill small{font-size:8px!important} body:has(#viewMain:not(.hidden)) #coinPill .coinOpenArrow{display:none!important} body:has(#viewMain:not(.hidden)) #topicons{display:flex!important;position:absolute!important;right:8px!important;top:12px!important;gap:4px!important} body:has(#viewMain:not(.hidden)) #btnSearch,body:has(#viewMain:not(.hidden)) #btnSort{display:none!important} body:has(#viewMain:not(.hidden)) #btnChat,body:has(#viewMain:not(.hidden)) #hubProNotifications{display:grid!important;place-items:center!important;width:36px!important;height:44px!important;padding:0!important;border:1px solid rgba(121,125,132,.45)!important;border-radius:13px!important;background:#090a0b!important;color:#ece7d9!important} body:has(#viewMain:not(.hidden)) #btnChat svg,body:has(#viewMain:not(.hidden)) #hubProNotifications svg{width:20px!important;height:20px!important} body:has(#viewMain:not(.hidden)) .chatFab{display:none!important} /* approved four-button bottom bar */ body:has(#viewMain:not(.hidden)) #mainMenuMobileNav{display:grid!important;position:fixed!important;left:10px!important;right:10px!important;bottom:max(10px,env(safe-area-inset-bottom))!important;z-index:140!important;grid-template-columns:repeat(4,1fr)!important;height:74px!important;padding:6px!important;border:1px solid rgba(231,185,67,.72)!important;border-radius:25px!important;background:rgba(5,5,4,.97)!important;box-shadow:0 14px 34px rgba(0,0,0,.48),inset 0 1px 0 rgba(255,226,145,.05)!important;backdrop-filter:blur(18px)!important} body:has(#viewMain:not(.hidden)) #mainMenuMobileNav button{display:flex!important;flex-direction:column!important;align-items:center!important;justify-content:center!important;gap:3px!important;width:100%!important;height:100%!important;padding:0!important;border:0!important;border-radius:19px!important;background:transparent!important;color:#d2d4d7!important} body:has(#viewMain:not(.hidden)) #mainMenuMobileNav button.active{color:#ffd55d!important;background:radial-gradient(circle at 50% 50%,rgba(231,185,67,.16),rgba(231,185,67,.025) 66%,transparent 67%)!important;box-shadow:inset 0 0 0 1px rgba(231,185,67,.24)!important} body:has(#viewMain:not(.hidden)) #mainMenuMobileNav .mainMobileNavIcon{width:28px!important;height:28px!important} body:has(#viewMain:not(.hidden)) #mainMenuMobileNav .mainMobileNavIcon svg{width:28px!important;height:28px!important} body:has(#viewMain:not(.hidden)) #mainMenuMobileNav button>span:not(.mainMobileNavIcon){display:block!important;font:700 9px/1 system-ui!important} @media(max-width:390px){body:has(#viewMain:not(.hidden)) .topbarPrimaryRow{width:104px!important}body:has(#viewMain:not(.hidden)) #pageTitle{width:104px!important}body:has(#viewMain:not(.hidden)) #pageTitle::before{width:36px;height:42px}body:has(#viewMain:not(.hidden)) #pageTitle::after{font-size:10px}body:has(#viewMain:not(.hidden)) #teamTopBadge{width:78px!important;padding:4px 5px!important}body:has(#viewMain:not(.hidden)) #teamTopBadge .teamBadgeName{max-width:31px!important}body:has(#viewMain:not(.hidden)) #coinPill{right:78px!important;width:59px!important;padding:4px!important}} @media(min-width:761px){#viewMain{width:min(100%,1040px)!important}#viewMain .hubProHero{height:210px}#viewMain .mainModuleElectronicsGrid{grid-template-columns:repeat(4,minmax(0,1fr))!important}body:has(#viewMain:not(.hidden)) #mainMenuMobileNav{max-width:620px;margin:auto}} /* Recodet V139 — Hub cleanup from live QA */ #viewMain .hubProHero{display:none!important} /* Tight, non-overlapping one-row Hub header */ body:has(#viewMain:not(.hidden)) .topbar.topbarTwoRow{ position:relative!important; height:62px!important; min-height:62px!important; padding:0!important; overflow:hidden!important; background:#050504!important; border-bottom:1px solid rgba(231,185,67,.20)!important; } body:has(#viewMain:not(.hidden)) .topbarPrimaryRow{ position:absolute!important; left:82px!important; top:6px!important; transform:none!important; width:92px!important; height:50px!important; margin:0!important; padding:0!important; } body:has(#viewMain:not(.hidden)) #pageTitle{ position:relative!important; display:flex!important; width:92px!important; height:50px!important; min-width:92px!important; max-width:92px!important; margin:0!important; padding:0!important; align-items:center!important; justify-content:center!important; gap:5px!important; overflow:hidden!important; color:transparent!important; font-size:0!important; line-height:0!important; text-indent:0!important; } body:has(#viewMain:not(.hidden)) #pageTitle::before{ content:""!important; display:block!important; width:34px!important; height:40px!important; flex:0 0 34px!important; background-image:var(--hub138-emblem)!important; background-size:contain!important; background-repeat:no-repeat!important; background-position:center!important; } body:has(#viewMain:not(.hidden)) #pageTitle::after{ content:"REC0DET"!important; display:block!important; color:#e7ba43!important; font:800 9px/1 system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif!important; letter-spacing:.10em!important; white-space:nowrap!important; } body:has(#viewMain:not(.hidden)) #pageTitle>*{display:none!important} body:has(#viewMain:not(.hidden)) .topbarSecondaryRow, body:has(#viewMain:not(.hidden)) .topbarSecondaryActions{ position:static!important; width:100%!important; height:62px!important; margin:0!important; padding:0!important; } body:has(#viewMain:not(.hidden)) #teamTopBadge{ display:flex!important; position:absolute!important; left:6px!important; top:9px!important; width:70px!important; height:44px!important; padding:4px 6px!important; gap:5px!important; overflow:hidden!important; } body:has(#viewMain:not(.hidden)) #teamTopBadge .teamBadgeMark{ width:30px!important; height:30px!important; flex:0 0 30px!important; } body:has(#viewMain:not(.hidden)) #teamTopBadge .teamBadgeName{ display:block!important; max-width:27px!important; font:700 9px/1 system-ui!important; overflow:hidden!important; text-overflow:ellipsis!important; white-space:nowrap!important; } body:has(#viewMain:not(.hidden)) #coinPill{ display:flex!important; position:absolute!important; right:78px!important; top:9px!important; width:62px!important; height:44px!important; padding:4px 5px!important; gap:3px!important; overflow:hidden!important; } body:has(#viewMain:not(.hidden)) #coinPill .coinIcon{ width:20px!important; height:20px!important; flex:0 0 20px!important; } body:has(#viewMain:not(.hidden)) #coinPill .coinAmt{font-size:10px!important} body:has(#viewMain:not(.hidden)) #coinPill small{font-size:7px!important} body:has(#viewMain:not(.hidden)) #topicons{ display:flex!important; position:absolute!important; right:6px!important; top:9px!important; width:68px!important; height:44px!important; gap:4px!important; align-items:center!important; } body:has(#viewMain:not(.hidden)) #btnChat, body:has(#viewMain:not(.hidden)) #hubProNotifications{ display:grid!important; place-items:center!important; width:32px!important; min-width:32px!important; height:44px!important; padding:0!important; border-radius:12px!important; } body:has(#viewMain:not(.hidden)) #btnChat svg, body:has(#viewMain:not(.hidden)) #hubProNotifications svg{ width:18px!important; height:18px!important; } /* Hub content starts immediately after the fixed header */ #viewMain{padding-top:10px!important} @media(max-width:350px){ body:has(#viewMain:not(.hidden)) .topbarPrimaryRow{left:72px!important;width:78px!important} body:has(#viewMain:not(.hidden)) #pageTitle{width:78px!important;min-width:78px!important;max-width:78px!important} body:has(#viewMain:not(.hidden)) #pageTitle::before{width:30px!important;height:36px!important;flex-basis:30px!important} body:has(#viewMain:not(.hidden)) #pageTitle::after{font-size:8px!important;letter-spacing:.06em!important} body:has(#viewMain:not(.hidden)) #teamTopBadge{width:62px!important} body:has(#viewMain:not(.hidden)) #teamTopBadge .teamBadgeName{max-width:20px!important} body:has(#viewMain:not(.hidden)) #coinPill{right:72px!important;width:56px!important} body:has(#viewMain:not(.hidden)) #topicons{right:4px!important;width:64px!important} body:has(#viewMain:not(.hidden)) #btnChat, body:has(#viewMain:not(.hidden)) #hubProNotifications{width:30px!important;min-width:30px!important} } /* Recodet V140 — mobile Main Hub readability pass */ @media(max-width:760px){ body:has(#viewMain:not(.hidden)) main.content{ padding-left:10px!important; padding-right:10px!important; } #viewMain{ width:100%!important; max-width:100%!important; padding:10px 0 94px!important; gap:10px!important; } #viewMain .mainModuleElectronicsGrid{ grid-template-columns:repeat(2,minmax(0,1fr))!important; gap:10px!important; } #viewMain .mainModuleElectronicsGrid>.hubModuleTile.menuModuleCard, #viewMain .mainModuleElectronicsGrid>.hubModuleTile.menuModuleCard.hubPrimaryCard{ aspect-ratio:1.46/1!important; min-height:108px!important; padding:12px 10px 10px!important; gap:5px!important; border-radius:16px!important; border-width:1px!important; box-shadow:0 7px 18px rgba(0,0,0,.28)!important; } #viewMain .mainModuleElectronicsGrid>.hubModuleTile.menuModuleCard::before{ inset:6px!important; border-radius:11px!important; border-color:rgba(113,118,128,.20)!important; } #viewMain .mainModuleElectronicsGrid>.hubModuleTile.menuModuleCard:not(.launchAccessLocked).is-selected, #viewMain .mainModuleElectronicsGrid>.hubModuleTile.menuModuleCard.hubPrimaryCard:not(.launchAccessLocked){ box-shadow:0 8px 20px rgba(0,0,0,.32),0 0 14px rgba(231,185,67,.10)!important; } #viewMain .mainModuleElectronicsGrid .hubModuleIcon, #viewMain .mainModuleElectronicsGrid .hubPrimaryCard .hubModuleIcon{ width:58px!important; height:58px!important; aspect-ratio:1/1!important; flex:0 0 58px!important; } #viewMain .mainModuleElectronicsGrid .hubModuleIcon svg{ width:48px!important; height:48px!important; } #viewMain .hubModuleLabel, #viewMain .mainModuleElectronicsGrid .hubModuleLabel, #viewMain .mainModuleElectronicsGrid .hubPrimaryCard .hubModuleLabel{ font-size:14px!important; line-height:1.05!important; } body:has(#viewMain:not(.hidden)) .topbar.topbarTwoRow{ height:60px!important; min-height:60px!important; } body:has(#viewMain:not(.hidden)) .topbarPrimaryRow{ left:50%!important; top:6px!important; transform:translateX(-50%)!important; width:78px!important; height:48px!important; } body:has(#viewMain:not(.hidden)) #pageTitle{ width:78px!important; min-width:78px!important; max-width:78px!important; height:48px!important; gap:3px!important; } body:has(#viewMain:not(.hidden)) #pageTitle::before{ width:30px!important; height:36px!important; flex-basis:30px!important; } body:has(#viewMain:not(.hidden)) #pageTitle::after{ font-size:8.5px!important; letter-spacing:.07em!important; } body:has(#viewMain:not(.hidden)) .topbarSecondaryRow, body:has(#viewMain:not(.hidden)) .topbarSecondaryActions{ height:60px!important; } body:has(#viewMain:not(.hidden)) #teamTopBadge{ left:6px!important; top:8px!important; width:46px!important; height:44px!important; padding:5px!important; justify-content:center!important; border-radius:15px!important; } body:has(#viewMain:not(.hidden)) #teamTopBadge .teamBadgeMark{ width:32px!important; height:32px!important; flex:0 0 32px!important; } body:has(#viewMain:not(.hidden)) #teamTopBadge .teamBadgeName{ display:none!important; } body:has(#viewMain:not(.hidden)) #coinPill{ right:76px!important; top:8px!important; width:50px!important; height:44px!important; padding:4px!important; gap:2px!important; } body:has(#viewMain:not(.hidden)) #coinPill .coinIcon{ width:17px!important; height:17px!important; flex-basis:17px!important; } body:has(#viewMain:not(.hidden)) #coinPill .coinAmt{font-size:9px!important} body:has(#viewMain:not(.hidden)) #coinPill small{font-size:6.5px!important} body:has(#viewMain:not(.hidden)) #topicons{ right:6px!important; top:8px!important; width:66px!important; height:44px!important; gap:4px!important; } body:has(#viewMain:not(.hidden)) #btnChat, body:has(#viewMain:not(.hidden)) #hubProNotifications{ width:31px!important; min-width:31px!important; height:44px!important; border-radius:12px!important; } body:has(#viewMain:not(.hidden)) #mainMenuMobileNav{ left:8px!important; right:8px!important; bottom:max(8px,env(safe-area-inset-bottom))!important; height:68px!important; padding:5px!important; border-radius:21px!important; } body:has(#viewMain:not(.hidden)) #mainMenuMobileNav button{ border-radius:16px!important; } body:has(#viewMain:not(.hidden)) #mainMenuMobileNav .mainMobileNavIcon, body:has(#viewMain:not(.hidden)) #mainMenuMobileNav .mainMobileNavIcon svg{ width:25px!important; height:25px!important; } body:has(#viewMain:not(.hidden)) #mainMenuMobileNav button>span:not(.mainMobileNavIcon){ font-size:9px!important; } } @media(max-width:350px){ body:has(#viewMain:not(.hidden)) .topbarPrimaryRow{ left:50%!important; width:70px!important; } body:has(#viewMain:not(.hidden)) #pageTitle{ width:70px!important; min-width:70px!important; max-width:70px!important; } body:has(#viewMain:not(.hidden)) #pageTitle::before{ width:27px!important; height:34px!important; flex-basis:27px!important; } body:has(#viewMain:not(.hidden)) #pageTitle::after{font-size:8px!important} body:has(#viewMain:not(.hidden)) #coinPill{ right:70px!important; width:46px!important; } body:has(#viewMain:not(.hidden)) #topicons{ right:4px!important; width:62px!important; gap:2px!important; } body:has(#viewMain:not(.hidden)) #btnChat, body:has(#viewMain:not(.hidden)) #hubProNotifications{ width:30px!important; min-width:30px!important; } #viewMain .mainModuleElectronicsGrid{gap:8px!important} } /* Recodet V141 — mobile Main Hub top bar only */ @media(max-width:760px){ body:has(#viewMain:not(.hidden)) .topbar.topbarTwoRow{ display:grid!important; grid-template-columns:44px minmax(0,1fr) 58px 44px 44px!important; grid-template-rows:60px!important; column-gap:4px!important; align-items:center!important; box-sizing:border-box!important; width:100%!important; height:60px!important; min-height:60px!important; padding:0 6px!important; overflow:visible!important; background:#050504!important; border-bottom:1px solid rgba(231,185,67,.24)!important; } body:has(#viewMain:not(.hidden)) .topbarPrimaryRow, body:has(#viewMain:not(.hidden)) .topbarSecondaryRow, body:has(#viewMain:not(.hidden)) .topbarSecondaryActions, body:has(#viewMain:not(.hidden)) #topicons{ display:contents!important; } body:has(#viewMain:not(.hidden)) .globalBackBtn, body:has(#viewMain:not(.hidden)) .compactHomeBtn, body:has(#viewMain:not(.hidden)) #btnSearch, body:has(#viewMain:not(.hidden)) #btnSort{ display:none!important; } body:has(#viewMain:not(.hidden)) #teamTopBadge{ grid-column:1!important; grid-row:1!important; position:static!important; display:grid!important; place-items:center!important; box-sizing:border-box!important; width:44px!important; min-width:44px!important; max-width:44px!important; height:44px!important; min-height:44px!important; margin:0!important; padding:4px!important; overflow:visible!important; border:1px solid rgba(231,185,67,.68)!important; border-radius:14px!important; background:linear-gradient(180deg,#151109,#080705)!important; box-shadow:inset 0 0 0 1px rgba(255,218,111,.08)!important; } body:has(#viewMain:not(.hidden)) #teamTopBadge .teamBadgeMark{ display:grid!important; place-items:center!important; box-sizing:border-box!important; width:34px!important; min-width:34px!important; height:34px!important; min-height:34px!important; flex:0 0 34px!important; overflow:hidden!important; border:1px solid rgba(231,185,67,.52)!important; border-radius:50%!important; background:#11100c!important; } body:has(#viewMain:not(.hidden)) #teamTopBadge .teamBadgeMark img{ display:block!important; width:100%!important; height:100%!important; object-fit:cover!important; border-radius:50%!important; } body:has(#viewMain:not(.hidden)) #teamTopBadge .teamBadgeName{ display:none!important; } body:has(#viewMain:not(.hidden)) .topbarPrimaryRow{ grid-column:2!important; grid-row:1!important; position:static!important; width:auto!important; height:auto!important; min-width:0!important; transform:none!important; } body:has(#viewMain:not(.hidden)) #pageTitle{ grid-column:2!important; grid-row:1!important; position:static!important; display:flex!important; align-items:center!important; justify-content:center!important; box-sizing:border-box!important; width:100%!important; min-width:0!important; max-width:none!important; height:48px!important; margin:0!important; padding:0 2px!important; gap:5px!important; overflow:visible!important; color:transparent!important; font-size:0!important; line-height:0!important; } body:has(#viewMain:not(.hidden)) #pageTitle::before{ content:""!important; display:block!important; width:30px!important; height:38px!important; flex:0 0 30px!important; background-image:var(--hub138-emblem)!important; background-size:contain!important; background-repeat:no-repeat!important; background-position:center!important; filter:drop-shadow(0 0 7px rgba(231,185,67,.18))!important; } body:has(#viewMain:not(.hidden)) #pageTitle::after{ content:"REC0DET"!important; display:block!important; color:#e7ba43!important; font:850 10px/1 system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif!important; letter-spacing:.09em!important; white-space:nowrap!important; } body:has(#viewMain:not(.hidden)) #pageTitle>*{ display:none!important; } body:has(#viewMain:not(.hidden)) #coinPill{ grid-column:3!important; grid-row:1!important; position:static!important; display:flex!important; align-items:center!important; justify-content:center!important; box-sizing:border-box!important; width:58px!important; min-width:58px!important; max-width:58px!important; height:44px!important; min-height:44px!important; margin:0!important; padding:4px 5px!important; gap:3px!important; overflow:visible!important; border:1px solid rgba(231,185,67,.68)!important; border-radius:14px!important; background:linear-gradient(180deg,#151109,#080705)!important; color:#fff3c8!important; box-shadow:inset 0 0 0 1px rgba(255,218,111,.08)!important; } body:has(#viewMain:not(.hidden)) #coinPill .coinIcon{ display:grid!important; place-items:center!important; width:18px!important; min-width:18px!important; height:18px!important; flex:0 0 18px!important; } body:has(#viewMain:not(.hidden)) #coinPill .coinIcon svg{ width:18px!important; height:18px!important; } body:has(#viewMain:not(.hidden)) #coinPill .coinValueWrap{ display:grid!important; min-width:0!important; gap:1px!important; line-height:1!important; text-align:left!important; } body:has(#viewMain:not(.hidden)) #coinPill .coinAmt{ color:#fff3c8!important; font:850 11px/1 system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif!important; white-space:nowrap!important; } body:has(#viewMain:not(.hidden)) #coinPill small{ display:block!important; color:#bca66a!important; font:800 7px/1 system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif!important; letter-spacing:.08em!important; white-space:nowrap!important; } body:has(#viewMain:not(.hidden)) #coinPill .coinOpenArrow{ display:none!important; } body:has(#viewMain:not(.hidden)) #btnChat, body:has(#viewMain:not(.hidden)) #hubProNotifications{ grid-row:1!important; position:static!important; display:grid!important; place-items:center!important; box-sizing:border-box!important; width:44px!important; min-width:44px!important; max-width:44px!important; height:44px!important; min-height:44px!important; margin:0!important; padding:0!important; overflow:visible!important; border:1px solid rgba(121,125,132,.48)!important; border-radius:14px!important; background:linear-gradient(180deg,#111216,#08090b)!important; color:#f2ead6!important; box-shadow:inset 0 0 0 1px rgba(255,255,255,.025)!important; } body:has(#viewMain:not(.hidden)) #btnChat{ grid-column:4!important; } body:has(#viewMain:not(.hidden)) #hubProNotifications{ grid-column:5!important; } body:has(#viewMain:not(.hidden)) #btnChat svg, body:has(#viewMain:not(.hidden)) #hubProNotifications svg{ display:block!important; width:20px!important; height:20px!important; } } @media(max-width:340px){ body:has(#viewMain:not(.hidden)) .topbar.topbarTwoRow{ grid-template-columns:44px minmax(0,1fr) 54px 42px 42px!important; column-gap:3px!important; padding-right:4px!important; padding-left:4px!important; } body:has(#viewMain:not(.hidden)) #pageTitle{ gap:3px!important; padding:0!important; } body:has(#viewMain:not(.hidden)) #pageTitle::before{ width:27px!important; height:35px!important; flex-basis:27px!important; } body:has(#viewMain:not(.hidden)) #pageTitle::after{ font-size:9px!important; letter-spacing:.055em!important; } body:has(#viewMain:not(.hidden)) #coinPill{ width:54px!important; min-width:54px!important; max-width:54px!important; padding-right:4px!important; padding-left:4px!important; } body:has(#viewMain:not(.hidden)) #coinPill .coinIcon, body:has(#viewMain:not(.hidden)) #coinPill .coinIcon svg{ width:16px!important; min-width:16px!important; height:16px!important; flex-basis:16px!important; } body:has(#viewMain:not(.hidden)) #btnChat, body:has(#viewMain:not(.hidden)) #hubProNotifications{ width:42px!important; min-width:42px!important; max-width:42px!important; } } /* Recodet V142 — mobile Hub grid transform correction */ @media(max-width:760px){ body:has(#viewMain:not(.hidden)) .topbarPrimaryRow, body:has(#viewMain:not(.hidden)) .topbarSecondaryRow, body:has(#viewMain:not(.hidden)) .topbarSecondaryActions, body:has(#viewMain:not(.hidden)) #topicons{ position:static!important; inset:auto!important; margin:0!important; transform:none!important; } body:has(#viewMain:not(.hidden)) #teamTopBadge, body:has(#viewMain:not(.hidden)) #pageTitle, body:has(#viewMain:not(.hidden)) #coinPill, body:has(#viewMain:not(.hidden)) #btnChat, body:has(#viewMain:not(.hidden)) #hubProNotifications{ position:static!important; inset:auto!important; transform:none!important; align-self:center!important; } } /* Recodet V144 — mobile Main Hub 4 x 3 grid */ @media(max-width:760px){ #viewMain .mainModuleElectronicsGrid{ grid-template-columns:repeat(4,minmax(0,1fr))!important; gap:6px!important; } #viewMain .mainModuleElectronicsGrid>.hubModuleTile.menuModuleCard[data-screen="INV_00_HOME"]{ display:none!important; } #viewMain .mainModuleElectronicsGrid>.hubModuleTile.menuModuleCard, #viewMain .mainModuleElectronicsGrid>.hubModuleTile.menuModuleCard.hubPrimaryCard{ aspect-ratio:auto!important; min-height:82px!important; height:82px!important; padding:7px 3px 6px!important; gap:2px!important; border-radius:13px!important; } #viewMain .mainModuleElectronicsGrid>.hubModuleTile.menuModuleCard::before{ inset:4px!important; border-radius:9px!important; } #viewMain .mainModuleElectronicsGrid .hubModuleIcon, #viewMain .mainModuleElectronicsGrid .hubPrimaryCard .hubModuleIcon{ width:36px!important; height:36px!important; flex:0 0 36px!important; } #viewMain .mainModuleElectronicsGrid .hubModuleIcon svg{ width:30px!important; height:30px!important; } #viewMain .hubModuleLabel, #viewMain .mainModuleElectronicsGrid .hubModuleLabel, #viewMain .mainModuleElectronicsGrid .hubPrimaryCard .hubModuleLabel{ max-width:100%!important; font-size:clamp(9px,2.8vw,10px)!important; line-height:1!important; } #viewMain .hubModuleTile.launchAccessLocked::after{ top:4px!important; right:3px!important; min-height:14px!important; padding:2px 4px!important; font-size:5px!important; } } /* Recodet V145 — two-row mobile Hub header and larger 4 x 3 modules */ @media(max-width:760px){ body:has(#viewMain:not(.hidden)) .topbar.topbarTwoRow{ display:grid!important; grid-template-columns:repeat(12,minmax(0,1fr))!important; grid-template-rows:54px 48px!important; column-gap:3px!important; row-gap:4px!important; align-items:center!important; box-sizing:border-box!important; width:100%!important; height:118px!important; min-height:118px!important; padding:6px!important; overflow:visible!important; background:#050504!important; border-bottom:1px solid rgba(231,185,67,.28)!important; box-shadow:inset 0 -1px 0 rgba(255,214,105,.03)!important; } body:has(#viewMain:not(.hidden)) #teamTopBadge{ grid-column:1 / 3!important; grid-row:1!important; width:100%!important; min-width:0!important; max-width:none!important; height:48px!important; min-height:48px!important; border-radius:15px!important; } body:has(#viewMain:not(.hidden)) #teamTopBadge .teamBadgeMark{ width:36px!important; min-width:36px!important; height:36px!important; min-height:36px!important; flex-basis:36px!important; } body:has(#viewMain:not(.hidden)) #pageTitle{ grid-column:3 / 10!important; grid-row:1!important; width:100%!important; height:52px!important; gap:7px!important; } body:has(#viewMain:not(.hidden)) #pageTitle::before{ width:34px!important; height:44px!important; flex-basis:34px!important; } body:has(#viewMain:not(.hidden)) #pageTitle::after{ font-size:11px!important; letter-spacing:.11em!important; } body:has(#viewMain:not(.hidden)) #coinPill{ grid-column:10 / 13!important; grid-row:1!important; width:100%!important; min-width:0!important; max-width:none!important; height:48px!important; min-height:48px!important; border-radius:15px!important; } body:has(#viewMain:not(.hidden)) #btnChat, body:has(#viewMain:not(.hidden)) #hubProNotifications{ grid-row:2!important; display:flex!important; align-items:center!important; justify-content:center!important; width:100%!important; min-width:0!important; max-width:none!important; height:46px!important; min-height:46px!important; gap:8px!important; border-radius:14px!important; border-color:rgba(231,185,67,.34)!important; background:linear-gradient(180deg,#12130f,#080906)!important; color:#f2ead6!important; } body:has(#viewMain:not(.hidden)) #btnChat{ grid-column:1 / 7!important; } body:has(#viewMain:not(.hidden)) #hubProNotifications{ grid-column:7 / 13!important; } body:has(#viewMain:not(.hidden)) #btnChat::after, body:has(#viewMain:not(.hidden)) #hubProNotifications::after{ display:block!important; color:#d8cda9!important; font:800 10px/1 system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif!important; letter-spacing:.035em!important; } body:has(#viewMain:not(.hidden)) #btnChat::after{ content:"Chat"!important; } body:has(#viewMain:not(.hidden)) #hubProNotifications::after{ content:"Notifications"!important; } body:has(#viewMain:not(.hidden)) #btnChat svg, body:has(#viewMain:not(.hidden)) #hubProNotifications svg{ width:21px!important; height:21px!important; flex:0 0 21px!important; } body:has(#viewMain:not(.hidden)) main.content{ padding-left:6px!important; padding-right:6px!important; } #viewMain .mainModuleElectronicsGrid{ gap:5px!important; } #viewMain .mainModuleElectronicsGrid>.hubModuleTile.menuModuleCard, #viewMain .mainModuleElectronicsGrid>.hubModuleTile.menuModuleCard.hubPrimaryCard{ min-height:94px!important; height:94px!important; padding:8px 3px 7px!important; gap:3px!important; border-radius:14px!important; } #viewMain .mainModuleElectronicsGrid>.hubModuleTile.menuModuleCard::before{ inset:4px!important; border-radius:10px!important; } #viewMain .mainModuleElectronicsGrid .hubModuleIcon, #viewMain .mainModuleElectronicsGrid .hubPrimaryCard .hubModuleIcon{ width:42px!important; height:42px!important; flex:0 0 42px!important; } #viewMain .mainModuleElectronicsGrid .hubModuleIcon svg{ width:35px!important; height:35px!important; } #viewMain .hubModuleLabel, #viewMain .mainModuleElectronicsGrid .hubModuleLabel, #viewMain .mainModuleElectronicsGrid .hubPrimaryCard .hubModuleLabel{ font-size:clamp(9.5px,2.9vw,10.5px)!important; } } /* Recodet V146 — compact right actions and reward balance bar */ @keyframes hubMoneyShine{ 0%,68%{transform:translateX(-170%) skewX(-18deg)} 100%{transform:translateX(360%) skewX(-18deg)} } @media(max-width:760px){ body:has(#viewMain:not(.hidden)) #pageTitle{ grid-column:3 / 11!important; } body:has(#viewMain:not(.hidden)) #coinPill{ grid-column:1 / 9!important; grid-row:2!important; position:relative!important; display:grid!important; grid-template-columns:34px minmax(0,1fr) auto!important; align-items:center!important; justify-content:stretch!important; width:100%!important; min-width:0!important; max-width:none!important; height:46px!important; min-height:46px!important; margin:0!important; padding:4px 9px 4px 5px!important; gap:8px!important; overflow:hidden!important; border:1px solid rgba(247,198,67,.86)!important; border-radius:14px!important; background: radial-gradient(circle at 16% 45%,rgba(255,215,96,.22),transparent 28%), linear-gradient(105deg,#171005 0%,#302006 52%,#130d04 100%)!important; color:#ffe58d!important; box-shadow: 0 0 18px rgba(231,185,67,.18), inset 0 1px 0 rgba(255,235,159,.17), inset 0 0 0 1px rgba(129,88,15,.22)!important; } body:has(#viewMain:not(.hidden)) #coinPill::before{ content:""!important; position:absolute!important; z-index:0!important; top:-20%!important; left:0!important; width:42%!important; height:140%!important; pointer-events:none!important; background:linear-gradient(90deg,transparent,rgba(255,242,184,.20),transparent)!important; animation:hubMoneyShine 4.2s ease-in-out infinite!important; } body:has(#viewMain:not(.hidden)) #coinPill>*{ position:relative!important; z-index:1!important; } body:has(#viewMain:not(.hidden)) #coinPill .coinIcon{ display:grid!important; place-items:center!important; width:34px!important; min-width:34px!important; height:34px!important; min-height:34px!important; border:1px solid rgba(255,220,105,.78)!important; border-radius:50%!important; background: radial-gradient(circle at 36% 30%,#fff0a7 0 8%,#e7b943 9% 38%,#8d5f0c 72%,#3b2605 100%)!important; color:#2a1a02!important; box-shadow: 0 0 11px rgba(255,202,65,.34), inset 0 0 0 2px rgba(71,43,2,.22)!important; } body:has(#viewMain:not(.hidden)) #coinPill .coinIcon svg{ width:21px!important; height:21px!important; filter:drop-shadow(0 1px 0 rgba(255,245,196,.32))!important; } body:has(#viewMain:not(.hidden)) #coinPill .coinValueWrap{ display:grid!important; grid-template-columns:auto auto!important; grid-template-rows:auto auto!important; justify-content:start!important; align-items:end!important; column-gap:4px!important; row-gap:1px!important; min-width:0!important; text-align:left!important; } body:has(#viewMain:not(.hidden)) #coinPill .coinValueWrap::before{ content:"RC BALANCE"!important; grid-column:1 / 3!important; color:#bfa761!important; font:800 6.5px/1 system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif!important; letter-spacing:.13em!important; white-space:nowrap!important; } body:has(#viewMain:not(.hidden)) #coinPill .coinAmt{ grid-column:1!important; grid-row:2!important; color:#fff0b2!important; font:900 17px/1 system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif!important; letter-spacing:-.02em!important; text-shadow:0 0 10px rgba(255,211,88,.20)!important; } body:has(#viewMain:not(.hidden)) #coinPill small{ grid-column:2!important; grid-row:2!important; display:block!important; align-self:end!important; padding-bottom:1px!important; color:#e7bd4d!important; font:850 8px/1 system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif!important; letter-spacing:.08em!important; } body:has(#viewMain:not(.hidden)) #coinPill .coinOpenArrow{ display:block!important; color:#eac75f!important; font:500 25px/1 system-ui!important; opacity:.86!important; transform:translateY(-1px)!important; } body:has(#viewMain:not(.hidden)) #btnChat, body:has(#viewMain:not(.hidden)) #hubProNotifications{ grid-row:2!important; display:grid!important; place-items:center!important; width:100%!important; min-width:0!important; max-width:none!important; height:46px!important; min-height:46px!important; padding:0!important; gap:0!important; border:1px solid rgba(154,145,119,.42)!important; border-radius:14px!important; background:linear-gradient(180deg,#12130f,#080906)!important; color:#f2ead6!important; } body:has(#viewMain:not(.hidden)) #btnChat{ grid-column:9 / 11!important; } body:has(#viewMain:not(.hidden)) #hubProNotifications{ grid-column:11 / 13!important; } body:has(#viewMain:not(.hidden)) #btnChat::after, body:has(#viewMain:not(.hidden)) #hubProNotifications::after{ content:none!important; display:none!important; } body:has(#viewMain:not(.hidden)) #btnChat svg, body:has(#viewMain:not(.hidden)) #hubProNotifications svg{ width:22px!important; height:22px!important; flex:none!important; } } @media(max-width:760px) and (prefers-reduced-motion:reduce){ body:has(#viewMain:not(.hidden)) #coinPill::before{ animation:none!important; display:none!important; } } /* Recodet V147 — full mobile RC amount */ @media(max-width:760px){ body:has(#viewMain:not(.hidden)) #coinPill .coinValueWrap{ width:auto!important; max-width:none!important; overflow:visible!important; text-overflow:clip!important; } body:has(#viewMain:not(.hidden)) #coinPill .coinAmt{ width:auto!important; min-width:38px!important; max-width:none!important; overflow:visible!important; text-overflow:clip!important; } body:has(#viewMain:not(.hidden)) #coinPill .coinOpenArrow{ width:auto!important; min-width:8px!important; max-width:none!important; overflow:visible!important; text-overflow:clip!important; } } /* Recodet V148 — larger mobile team badge and brand */ @media(max-width:760px){ body:has(#viewMain:not(.hidden)) .topbar.topbarTwoRow{ grid-template-rows:56px 46px!important; } body:has(#viewMain:not(.hidden)) #teamTopBadge{ height:52px!important; min-height:52px!important; padding:2px!important; } body:has(#viewMain:not(.hidden)) #teamTopBadge .teamBadgeMark{ width:40px!important; min-width:40px!important; height:40px!important; min-height:40px!important; flex-basis:40px!important; } body:has(#viewMain:not(.hidden)) #pageTitle{ height:54px!important; gap:8px!important; } body:has(#viewMain:not(.hidden)) #pageTitle::before{ width:38px!important; height:48px!important; flex-basis:38px!important; } body:has(#viewMain:not(.hidden)) #pageTitle::after{ font-size:12px!important; letter-spacing:.115em!important; } } /* V163 — five-item main navigation + Services accent */ body:has(#viewMain:not(.hidden)) #mainMenuMobileNav{ grid-template-columns:repeat(5,minmax(0,1fr))!important; } body:has(#viewMain:not(.hidden)) #mainMenuMobileNav .servicesMainNavItem{ color:#52e5ff!important; } body:has(#viewMain:not(.hidden)) #mainMenuMobileNav .servicesMainNavItem .mainMobileNavIcon{ filter:drop-shadow(0 0 8px rgba(41,220,255,.18)); } body:has(#viewMain:not(.hidden)) #mainMenuMobileNav .servicesMainNavItem.active{ color:#7cecff!important; background:radial-gradient(circle at 50% 50%,rgba(41,220,255,.15),rgba(41,220,255,.025) 66%,transparent 67%)!important; box-shadow:inset 0 0 0 1px rgba(41,220,255,.24)!important; } @media(max-width:380px){ body:has(#viewMain:not(.hidden)) #mainMenuMobileNav{ left:6px!important; right:6px!important; padding:4px!important; } body:has(#viewMain:not(.hidden)) #mainMenuMobileNav button{ border-radius:14px!important; } body:has(#viewMain:not(.hidden)) #mainMenuMobileNav .mainMobileNavIcon, body:has(#viewMain:not(.hidden)) #mainMenuMobileNav .mainMobileNavIcon svg{ width:23px!important; height:23px!important; } body:has(#viewMain:not(.hidden)) #mainMenuMobileNav button>span:not(.mainMobileNavIcon){ font-size:8px!important; } } /* V188 — LOCKED MOBILE TOP BAR One fixed two-row header across every signed-in menu: Row 1: Back | Team | REC0DET | Search Row 2: RC balance | Chat | Notifications Geometry stays identical while screens change. */ @media(max-width:760px){ body .topbar.topbarTwoRow.v78MobileShell{ display:grid!important; grid-template-columns:repeat(12,minmax(0,1fr))!important; grid-template-rows:56px 46px!important; column-gap:3px!important; row-gap:4px!important; align-items:center!important; box-sizing:border-box!important; width:100%!important; height:118px!important; min-height:118px!important; padding:6px!important; overflow:visible!important; background:#050504!important; border:0!important; border-bottom:1px solid rgba(231,185,67,.28)!important; box-shadow:inset 0 -1px 0 rgba(255,214,105,.03)!important; } body .topbar.topbarTwoRow.v78MobileShell .topbarPrimaryRow, body .topbar.topbarTwoRow.v78MobileShell .topbarSecondaryRow, body .topbar.topbarTwoRow.v78MobileShell .topbarSecondaryActions, body .topbar.topbarTwoRow.v78MobileShell #topicons{ display:contents!important; position:static!important; inset:auto!important; width:auto!important; height:auto!important; min-height:0!important; margin:0!important; padding:0!important; transform:none!important; } body .topbar.topbarTwoRow.v78MobileShell .compactHomeBtn, body .topbar.topbarTwoRow.v78MobileShell #btnSort{ display:none!important; } body .topbar.topbarTwoRow.v78MobileShell .globalBackBtn{ grid-column:1 / 3!important; grid-row:1!important; position:static!important; justify-self:center!important; align-self:center!important; display:grid!important; place-items:center!important; width:46px!important; min-width:46px!important; height:46px!important; min-height:46px!important; margin:0!important; padding:0!important; border:1px solid rgba(231,185,67,.42)!important; border-radius:14px!important; background:linear-gradient(180deg,#151109,#080705)!important; color:#efc85e!important; transform:none!important; } body .topbar.topbarTwoRow.v78MobileShell .globalBackBtn[aria-disabled="true"]{ opacity:.34!important; } body .topbar.topbarTwoRow.v78MobileShell #teamTopBadge{ grid-column:3 / 5!important; grid-row:1!important; position:static!important; align-self:center!important; justify-self:stretch!important; display:grid!important; place-items:center!important; box-sizing:border-box!important; width:100%!important; min-width:0!important; max-width:none!important; height:52px!important; min-height:52px!important; margin:0!important; padding:2px!important; border:1px solid rgba(231,185,67,.66)!important; border-radius:15px!important; background:#090805!important; transform:none!important; } body .topbar.topbarTwoRow.v78MobileShell #teamTopBadge .teamBadgeMark{ display:grid!important; place-items:center!important; width:40px!important; min-width:40px!important; height:40px!important; min-height:40px!important; flex-basis:40px!important; overflow:hidden!important; border:1px solid rgba(231,185,67,.48)!important; border-radius:50%!important; background:#13110b!important; } body .topbar.topbarTwoRow.v78MobileShell #teamTopBadge .teamBadgeMark img{ width:100%!important; height:100%!important; object-fit:cover!important; border-radius:50%!important; } body .topbar.topbarTwoRow.v78MobileShell #teamTopBadge .teamBadgeName{ display:none!important; } body .topbar.topbarTwoRow.v78MobileShell #pageTitle{ grid-column:5 / 11!important; grid-row:1!important; position:static!important; align-self:center!important; display:flex!important; align-items:center!important; justify-content:center!important; box-sizing:border-box!important; width:100%!important; min-width:0!important; max-width:none!important; height:54px!important; margin:0!important; padding:0!important; gap:8px!important; overflow:visible!important; color:transparent!important; font-size:0!important; line-height:0!important; transform:none!important; } body .topbar.topbarTwoRow.v78MobileShell #pageTitle::before{ content:""!important; display:block!important; width:38px!important; height:48px!important; flex:0 0 38px!important; background-image:var(--hub138-emblem)!important; background-size:contain!important; background-repeat:no-repeat!important; background-position:center!important; filter:drop-shadow(0 0 7px rgba(231,185,67,.18))!important; } body .topbar.topbarTwoRow.v78MobileShell #pageTitle::after{ content:"REC0DET"!important; display:block!important; color:#e7ba43!important; font:850 12px/1 system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif!important; letter-spacing:.115em!important; white-space:nowrap!important; } body .topbar.topbarTwoRow.v78MobileShell #pageTitle>*{ display:none!important; } body .topbar.topbarTwoRow.v78MobileShell #btnSearch{ grid-column:11 / 13!important; grid-row:1!important; position:static!important; justify-self:center!important; align-self:center!important; display:grid!important; place-items:center!important; width:46px!important; min-width:46px!important; height:46px!important; min-height:46px!important; margin:0!important; padding:0!important; border:1px solid rgba(231,185,67,.42)!important; border-radius:14px!important; background:linear-gradient(180deg,#151109,#080705)!important; color:#efc85e!important; transform:none!important; } body .topbar.topbarTwoRow.v78MobileShell #btnSearch svg, body .topbar.topbarTwoRow.v78MobileShell .globalBackBtn svg{ width:21px!important; height:21px!important; } body .topbar.topbarTwoRow.v78MobileShell #coinPill{ grid-column:1 / 9!important; grid-row:2!important; position:relative!important; align-self:center!important; display:grid!important; grid-template-columns:34px minmax(0,1fr) auto!important; align-items:center!important; justify-content:stretch!important; box-sizing:border-box!important; width:100%!important; min-width:0!important; max-width:none!important; height:46px!important; min-height:46px!important; margin:0!important; padding:4px 9px 4px 5px!important; gap:8px!important; overflow:hidden!important; border:1px solid rgba(247,198,67,.86)!important; border-radius:14px!important; background:radial-gradient(circle at 16% 45%,rgba(255,215,96,.22),transparent 28%),linear-gradient(105deg,#171005 0%,#302006 52%,#130d04 100%)!important; color:#ffe58d!important; box-shadow:0 0 18px rgba(231,185,67,.18),inset 0 1px 0 rgba(255,235,159,.17),inset 0 0 0 1px rgba(129,88,15,.22)!important; transform:none!important; } body .topbar.topbarTwoRow.v78MobileShell #coinPill::before{ content:""!important; position:absolute!important; z-index:0!important; top:-20%!important; left:0!important; width:42%!important; height:140%!important; pointer-events:none!important; background:linear-gradient(90deg,transparent,rgba(255,242,184,.20),transparent)!important; animation:hubMoneyShine 4.2s ease-in-out infinite!important; } body .topbar.topbarTwoRow.v78MobileShell #coinPill>*{ position:relative!important; z-index:1!important; } body .topbar.topbarTwoRow.v78MobileShell #coinPill .coinIcon{ display:grid!important; place-items:center!important; width:34px!important; min-width:34px!important; height:34px!important; min-height:34px!important; border:1px solid rgba(255,220,105,.78)!important; border-radius:50%!important; background:radial-gradient(circle at 36% 30%,#fff0a7 0 8%,#e7b943 9% 38%,#8d5f0c 72%,#3b2605 100%)!important; color:#2a1a02!important; } body .topbar.topbarTwoRow.v78MobileShell #coinPill .coinIcon svg{ width:21px!important; height:21px!important; } body .topbar.topbarTwoRow.v78MobileShell #coinPill .coinValueWrap{ display:grid!important; grid-template-columns:auto auto!important; grid-template-rows:auto auto!important; justify-content:start!important; align-items:end!important; column-gap:4px!important; row-gap:1px!important; min-width:0!important; width:auto!important; overflow:visible!important; text-align:left!important; } body .topbar.topbarTwoRow.v78MobileShell #coinPill .coinValueWrap::before{ content:"RC BALANCE"!important; grid-column:1 / 3!important; color:#bfa761!important; font:800 6.5px/1 system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif!important; letter-spacing:.13em!important; white-space:nowrap!important; } body .topbar.topbarTwoRow.v78MobileShell #coinPill .coinAmt{ grid-column:1!important; grid-row:2!important; min-width:38px!important; max-width:none!important; overflow:visible!important; color:#fff0b2!important; font:900 17px/1 system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif!important; letter-spacing:-.02em!important; white-space:nowrap!important; } body .topbar.topbarTwoRow.v78MobileShell #coinPill small{ grid-column:2!important; grid-row:2!important; display:block!important; align-self:end!important; padding-bottom:1px!important; color:#e7bd4d!important; font:850 8px/1 system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif!important; letter-spacing:.08em!important; } body .topbar.topbarTwoRow.v78MobileShell #coinPill .coinOpenArrow{ display:block!important; width:auto!important; min-width:8px!important; color:#eac75f!important; font:500 25px/1 system-ui!important; opacity:.86!important; } body .topbar.topbarTwoRow.v78MobileShell #btnChat, body .topbar.topbarTwoRow.v78MobileShell #hubProNotifications{ grid-row:2!important; position:static!important; align-self:center!important; display:grid!important; place-items:center!important; box-sizing:border-box!important; width:100%!important; min-width:0!important; max-width:none!important; height:46px!important; min-height:46px!important; margin:0!important; padding:0!important; border:1px solid rgba(154,145,119,.42)!important; border-radius:14px!important; background:linear-gradient(180deg,#12130f,#080906)!important; color:#f2ead6!important; transform:none!important; } body .topbar.topbarTwoRow.v78MobileShell #btnChat{ grid-column:9 / 11!important; } body .topbar.topbarTwoRow.v78MobileShell #hubProNotifications{ grid-column:11 / 13!important; } body .topbar.topbarTwoRow.v78MobileShell #btnChat::after, body .topbar.topbarTwoRow.v78MobileShell #hubProNotifications::after{ content:none!important; display:none!important; } body .topbar.topbarTwoRow.v78MobileShell #btnChat svg, body .topbar.topbarTwoRow.v78MobileShell #hubProNotifications svg{ width:22px!important; height:22px!important; } body .topbar.topbarTwoRow.v78MobileShell + .shopContextBar, body .shopContextBar{ top:118px!important; } body .shopSearchDock{ top:176px!important; } } @media(max-width:360px){ body .topbar.topbarTwoRow.v78MobileShell{ padding-left:4px!important; padding-right:4px!important; column-gap:2px!important; } body .topbar.topbarTwoRow.v78MobileShell .globalBackBtn, body .topbar.topbarTwoRow.v78MobileShell #btnSearch{ width:42px!important; min-width:42px!important; height:42px!important; min-height:42px!important; } body .topbar.topbarTwoRow.v78MobileShell #pageTitle{ gap:5px!important; } body .topbar.topbarTwoRow.v78MobileShell #pageTitle::before{ width:31px!important; height:42px!important; flex-basis:31px!important; } body .topbar.topbarTwoRow.v78MobileShell #pageTitle::after{ font-size:10px!important; letter-spacing:.08em!important; } } /* V189 — exact Main Hub mobile header on every signed-in screen. Row 1: Team | REC0DET Row 2: RC balance | Chat | Notifications Back and Search are intentionally removed so the bar never changes shape. */ @media(max-width:760px){ body .topbar.topbarTwoRow.v78MobileShell .globalBackBtn, body .topbar.topbarTwoRow.v78MobileShell #btnSearch, body .topbar.topbarTwoRow.v78MobileShell #btnSort, body .topbar.topbarTwoRow.v78MobileShell .compactHomeBtn{ display:none!important; } body .topbar.topbarTwoRow.v78MobileShell #teamTopBadge{ grid-column:1 / 3!important; grid-row:1!important; width:100%!important; min-width:0!important; max-width:none!important; height:52px!important; min-height:52px!important; justify-self:stretch!important; } body .topbar.topbarTwoRow.v78MobileShell #pageTitle{ grid-column:3 / 11!important; grid-row:1!important; width:100%!important; min-width:0!important; max-width:none!important; height:54px!important; } body .topbar.topbarTwoRow.v78MobileShell #coinPill{ grid-column:1 / 9!important; grid-row:2!important; } body .topbar.topbarTwoRow.v78MobileShell #btnChat{ grid-column:9 / 11!important; grid-row:2!important; } body .topbar.topbarTwoRow.v78MobileShell #hubProNotifications{ grid-column:11 / 13!important; grid-row:2!important; } } /* V190 — authoritative mobile header geometry. Use one exact Main Hub position map on every signed-in screen. */ @media(max-width:760px){ html body.recodet-pro #app .topbar.topbarTwoRow.v78MobileShell{ position:relative!important; top:auto!important; left:auto!important; right:auto!important; display:grid!important; grid-template-columns:repeat(12,minmax(0,1fr))!important; grid-template-rows:56px 46px!important; column-gap:3px!important; row-gap:4px!important; align-items:center!important; box-sizing:border-box!important; width:100%!important; height:118px!important; min-height:118px!important; margin:0!important; padding:6px!important; overflow:visible!important; } html body.recodet-pro #app .topbar.topbarTwoRow.v78MobileShell .topbarPrimaryRow, html body.recodet-pro #app .topbar.topbarTwoRow.v78MobileShell .topbarSecondaryRow, html body.recodet-pro #app .topbar.topbarTwoRow.v78MobileShell .topbarSecondaryActions, html body.recodet-pro #app .topbar.topbarTwoRow.v78MobileShell #topicons{ display:contents!important; position:static!important; inset:auto!important; width:auto!important; height:auto!important; min-height:0!important; margin:0!important; padding:0!important; transform:none!important; } html body.recodet-pro #app .topbar.topbarTwoRow.v78MobileShell .globalBackBtn, html body.recodet-pro #app .topbar.topbarTwoRow.v78MobileShell #btnSearch, html body.recodet-pro #app .topbar.topbarTwoRow.v78MobileShell #btnSort, html body.recodet-pro #app .topbar.topbarTwoRow.v78MobileShell .compactHomeBtn{ display:none!important; } html body.recodet-pro #app .topbar.topbarTwoRow.v78MobileShell #teamTopBadge{ grid-column:1 / 3!important; grid-row:1!important; position:static!important; inset:auto!important; align-self:center!important; justify-self:stretch!important; display:grid!important; place-items:center!important; width:100%!important; min-width:0!important; max-width:none!important; height:52px!important; min-height:52px!important; margin:0!important; transform:none!important; } html body.recodet-pro #app .topbar.topbarTwoRow.v78MobileShell #pageTitle{ grid-column:3 / 11!important; grid-row:1!important; position:static!important; inset:auto!important; align-self:center!important; justify-self:stretch!important; width:100%!important; min-width:0!important; max-width:none!important; height:54px!important; margin:0!important; transform:none!important; } html body.recodet-pro #app .topbar.topbarTwoRow.v78MobileShell #coinPill{ grid-column:1 / 9!important; grid-row:2!important; position:relative!important; inset:auto!important; align-self:center!important; justify-self:stretch!important; width:100%!important; min-width:0!important; max-width:none!important; height:46px!important; min-height:46px!important; margin:0!important; transform:none!important; } html body.recodet-pro #app .topbar.topbarTwoRow.v78MobileShell #btnChat{ grid-column:9 / 11!important; grid-row:2!important; } html body.recodet-pro #app .topbar.topbarTwoRow.v78MobileShell #hubProNotifications{ grid-column:11 / 13!important; grid-row:2!important; } html body.recodet-pro #app .topbar.topbarTwoRow.v78MobileShell #btnChat, html body.recodet-pro #app .topbar.topbarTwoRow.v78MobileShell #hubProNotifications{ position:static!important; inset:auto!important; align-self:center!important; justify-self:stretch!important; display:grid!important; place-items:center!important; width:100%!important; min-width:0!important; max-width:none!important; height:46px!important; min-height:46px!important; margin:0!important; transform:none!important; } } /* V191 — fixed professional REC0DET brand sizing across every mobile screen. */ @media(max-width:760px){ html body.recodet-pro #app .topbar.topbarTwoRow.v78MobileShell #pageTitle{ display:flex!important; align-items:center!important; justify-content:center!important; gap:10px!important; width:100%!important; min-width:0!important; max-width:none!important; height:54px!important; min-height:54px!important; padding:0!important; margin:0!important; overflow:visible!important; color:transparent!important; font-size:0!important; line-height:0!important; letter-spacing:0!important; white-space:nowrap!important; transform:none!important; } html body.recodet-pro #app .topbar.topbarTwoRow.v78MobileShell #pageTitle>*{ display:none!important; } html body.recodet-pro #app .topbar.topbarTwoRow.v78MobileShell #pageTitle::before{ content:""!important; display:block!important; width:44px!important; min-width:44px!important; max-width:44px!important; height:52px!important; min-height:52px!important; max-height:52px!important; flex:0 0 44px!important; background-image:var(--hub138-emblem)!important; background-size:contain!important; background-repeat:no-repeat!important; background-position:center!important; filter:drop-shadow(0 0 9px rgba(231,185,67,.22))!important; } html body.recodet-pro #app .topbar.topbarTwoRow.v78MobileShell #pageTitle::after{ content:"REC0DET"!important; display:block!important; flex:0 0 auto!important; color:#efc44f!important; font:900 13.5px/1 system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif!important; letter-spacing:.125em!important; text-transform:uppercase!important; white-space:nowrap!important; text-shadow:0 0 10px rgba(231,185,67,.14)!important; } } @media(max-width:360px){ html body.recodet-pro #app .topbar.topbarTwoRow.v78MobileShell #pageTitle{ gap:7px!important; } html body.recodet-pro #app .topbar.topbarTwoRow.v78MobileShell #pageTitle::before{ width:40px!important; min-width:40px!important; max-width:40px!important; height:48px!important; min-height:48px!important; max-height:48px!important; flex-basis:40px!important; } html body.recodet-pro #app .topbar.topbarTwoRow.v78MobileShell #pageTitle::after{ font-size:12px!important; letter-spacing:.105em!important; } }