/* TradingHub cinematic DOOMER homepage — realistic MP4 background + procedural weather. */
.page-home-doomer{--font-display:ui-monospace,"SFMono-Regular",Menlo,Consolas,monospace;--font-body:system-ui,-apple-system,"Segoe UI",Arial,sans-serif;--font-mono:ui-monospace,"SFMono-Regular",Menlo,Consolas,monospace;background:#020304 radial-gradient(ellipse 86% 42% at 50% 3%,rgba(47,58,66,.16),transparent 72%)}
.page-home-doomer .site-header{width:calc(100% - 36px);width:min(1260px,calc(100% - 36px));max-width:1260px;margin:18px auto 0;border:1px solid rgba(255,255,255,.085);border-bottom:0;background:rgba(4,6,8,.78)}
.page-home-doomer .site-header::before{background:rgba(5,7,9,.78)}
.page-home-doomer .ticker{border-top:1px solid rgba(255,255,255,.045);background:rgba(1,3,5,.9)}
.page-home-doomer main{position:relative}
.hero.hero--doomer{position:relative;width:100%;max-width:none;min-height:516px;margin:0;padding:0;overflow:hidden;display:flex;align-items:center;justify-content:center;isolation:isolate;background:#010203;border-top:1px solid rgba(255,255,255,.085);border-bottom:1px solid rgba(255,255,255,.085)}
.hero.hero--doomer::before,.hero.hero--doomer::after{display:none}.hero.hero--doomer>*{position:relative;z-index:2}.hero.hero--doomer>.doomer{position:absolute;z-index:0}
.page-home-doomer .hero-bg{display:none!important}
.hero-inner{width:100%;max-width:1180px;margin:0 auto;padding:48px 34px 56px;text-align:center}.hero.hero--doomer .eyebrow{justify-content:center;color:#c7cbcf;text-shadow:0 2px 18px rgba(0,0,0,.96)}
.hero.hero--doomer h1{max-width:27ch!important;margin-left:auto!important;margin-right:auto!important;font-size:clamp(34px,4.35vw,58px);line-height:1.04;letter-spacing:-.025em;color:#eef0f1;text-shadow:0 4px 36px rgba(0,0,0,1),0 1px 3px rgba(0,0,0,1)}
.hero.hero--doomer .lede{max-width:62ch;margin-left:auto!important;margin-right:auto!important;color:#aeb4b9;text-shadow:0 2px 18px rgba(0,0,0,1)}.hero.hero--doomer .hero-cta{justify-content:center!important}.hero.hero--doomer .btn{border-radius:2px;backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px)}.hero.hero--doomer .btn-ghost{background:rgba(2,4,6,.76);border-color:rgba(255,255,255,.12);box-shadow:0 10px 34px rgba(0,0,0,.34)}

.doomer{--video-brightness:1.08;--video-saturate:.90;--video-contrast:1.03;--video-sepia:.02;--fog-rgb:112,126,139;--fog-opacity:.12;--lamp-rgb:255,196,104;--lamp-opacity:.30;--grade-a:rgba(17,30,44,.05);--grade-b:rgba(4,10,18,.10);--camera-x:0px;--camera-y:0px;position:absolute;inset:0;overflow:hidden;pointer-events:none;background-color:#010203;background-size:cover;background-position:center 54%}
html[data-home-season="winter"] .doomer{background-image:url("doomer-video/winter-poster.webp?v=20260828-v146")}
html[data-home-season="spring"] .doomer{background-image:url("doomer-video/spring-poster.webp?v=20260828-v146")}
html[data-home-season="summer"] .doomer{background-image:url("doomer-video/summer-poster.webp?v=20260828-v146")}
html[data-home-season="autumn"] .doomer{background-image:url("doomer-video/autumn-poster.webp?v=20260828-v146")}
.doomer[data-season=spring]{--video-brightness:1.16;--video-saturate:.94;--video-contrast:1.02;--video-sepia:.01;--fog-rgb:92,115,106;--fog-opacity:.13;--lamp-rgb:242,182,98;--grade-a:rgba(16,45,37,.04);--grade-b:rgba(4,14,13,.09)}
.doomer[data-season=summer]{--video-brightness:1.12;--video-saturate:.96;--video-contrast:1.02;--video-sepia:.02;--fog-rgb:104,111,106;--fog-opacity:.10;--lamp-rgb:255,174,79;--grade-a:rgba(43,34,19,.04);--grade-b:rgba(8,11,10,.08)}
.doomer[data-season=autumn]{--video-brightness:1.10;--video-saturate:1;--video-contrast:1.03;--video-sepia:.04;--fog-rgb:124,101,82;--fog-opacity:.14;--lamp-rgb:255,145,55;--grade-a:rgba(70,34,14,.05);--grade-b:rgba(15,8,5,.11)}

.doomer-poster{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center 54%;display:none}.doomer-video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center 54%;display:block;opacity:0;visibility:visible;filter:brightness(var(--video-brightness)) saturate(var(--video-saturate)) contrast(var(--video-contrast)) sepia(var(--video-sepia));transform:none;transition:opacity 1.55s ease,filter 1.55s ease;will-change:opacity}.doomer-video.is-active{opacity:1}.doomer.is-changing .doomer-video.is-active{opacity:.90}
.doomer-weather{position:absolute;inset:0;width:100%;height:100%;opacity:.82;visibility:visible;mix-blend-mode:screen;pointer-events:none;filter:blur(.1px)}
.doomer-colorgrade{position:absolute;inset:0;background:linear-gradient(180deg,rgba(1,3,5,.11) 0%,rgba(2,5,8,.02) 26%,transparent 52%,rgba(0,0,0,.16) 100%),linear-gradient(90deg,rgba(0,0,0,.16) 0%,transparent 27%,transparent 64%,rgba(0,0,0,.14) 100%),linear-gradient(180deg,var(--grade-a),var(--grade-b))}
.doomer-scrim{position:absolute;inset:0;background:radial-gradient(ellipse 42% 46% at 50% 42%,rgba(0,0,0,.03) 0%,rgba(0,0,0,.07) 54%,rgba(0,0,0,.20) 100%),linear-gradient(180deg,rgba(0,0,0,.02),transparent 38%,rgba(0,0,0,.12) 100%)}
.doomer-vignette{position:absolute;inset:-1px;box-shadow:inset 0 0 130px 28px rgba(0,0,0,.28),inset 0 -80px 80px -52px rgba(0,0,0,.31)}
.doomer-grain{position:absolute;inset:-30%;opacity:.12;visibility:visible;background-image:url("/assets/doomer-grain.webp?v=20260920-v539");background-repeat:repeat;background-size:180px 180px;mix-blend-mode:soft-light;contain:strict;will-change:transform;animation:doomerGrain .24s steps(2,end) infinite}@keyframes doomerGrain{0%{transform:translate3d(-2%,1%,0)}25%{transform:translate3d(1%,-2%,0)}50%{transform:translate3d(2%,2%,0)}75%{transform:translate3d(-1%,-1%,0)}100%{transform:translate3d(-2%,1%,0)}}

.doomer-fog{position:absolute;left:-18%;width:136%;height:54%;bottom:-13%;opacity:var(--fog-opacity);visibility:visible;filter:blur(38px);background:radial-gradient(ellipse 24% 40% at 10% 67%,rgba(var(--fog-rgb),.62),transparent 74%),radial-gradient(ellipse 33% 46% at 42% 56%,rgba(var(--fog-rgb),.50),transparent 73%),radial-gradient(ellipse 28% 44% at 76% 64%,rgba(var(--fog-rgb),.55),transparent 72%),radial-gradient(ellipse 23% 38% at 98% 56%,rgba(var(--fog-rgb),.48),transparent 72%);will-change:transform;animation:doomerFog 22s ease-in-out infinite alternate}.doomer-fog--back{bottom:10%;opacity:calc(var(--fog-opacity)*.55);filter:blur(54px);animation-duration:31s}.doomer-fog--front{bottom:-22%;opacity:calc(var(--fog-opacity)*.72);filter:blur(48px);animation-duration:27s;animation-direction:alternate-reverse}@keyframes doomerFog{from{transform:translate3d(-4%,1%,0) scale(1.02)}to{transform:translate3d(5%,-4%,0) scale(1.09)}}

.doomer-reflections{position:absolute;left:0;right:0;bottom:-8%;height:42%;opacity:.43;visibility:visible;filter:blur(12px);mix-blend-mode:screen;background:radial-gradient(ellipse 6% 58% at 18% 100%,rgba(var(--lamp-rgb),.24),transparent 68%),radial-gradient(ellipse 5% 55% at 50% 100%,rgba(var(--lamp-rgb),.21),transparent 70%),radial-gradient(ellipse 5% 55% at 76% 100%,rgba(255,54,37,.16),transparent 68%);will-change:transform,opacity;animation:wetRoad 7s ease-in-out infinite alternate}@keyframes wetRoad{from{opacity:.31;transform:scaleX(.96)}to{opacity:.50;transform:scaleX(1.02)}}

.doomer-lamps{position:absolute;inset:0;visibility:visible}.doomer-lamp{position:absolute;width:170px;height:170px;border-radius:50%;background:radial-gradient(circle,rgba(var(--lamp-rgb),.36) 0%,rgba(var(--lamp-rgb),.14) 19%,rgba(var(--lamp-rgb),.045) 42%,transparent 72%);filter:blur(8px);opacity:var(--lamp-opacity);mix-blend-mode:screen;will-change:opacity;animation:lampPulse 7.6s ease-in-out infinite}.doomer-lamp--a{left:25%;top:4%;animation-delay:-2.3s}.doomer-lamp--b{left:36%;top:34%;width:122px;height:122px;animation-duration:9.1s;animation-delay:-4.7s}.doomer-lamp--c{left:47%;top:49%;width:80px;height:80px;animation-duration:6.4s;animation-delay:-1.9s;opacity:.25}.doomer-lamp.is-flicker{animation:lampHardFlicker .42s steps(2,end) 1!important}@keyframes lampPulse{0%,40%,49%,100%{opacity:.28}43%{opacity:.52}44%{opacity:.17}45%{opacity:.46}70%{opacity:.33}}@keyframes lampHardFlicker{0%{opacity:.44}18%{opacity:.08}31%{opacity:.58}46%{opacity:.12}61%{opacity:.50}78%{opacity:.18}100%{opacity:.38}}

.doomer-flash{position:absolute;inset:0;background:linear-gradient(180deg,rgba(194,214,239,.58),rgba(158,190,225,.15));opacity:0;visibility:visible;mix-blend-mode:screen;will-change:opacity}.doomer-flash.is-flashing{animation:doomerFlash .56s ease-out 1}@keyframes doomerFlash{0%{opacity:0}12%{opacity:.42}18%{opacity:.03}29%{opacity:.22}50%,100%{opacity:0}}
.doomer-shadow-pulse{position:absolute;inset:0;background:rgba(0,0,0,.30);opacity:0;visibility:visible;will-change:opacity}.doomer.is-power-dip .doomer-shadow-pulse{animation:powerDip .7s ease 1}@keyframes powerDip{0%,100%{opacity:0}22%{opacity:.26}31%{opacity:.04}43%{opacity:.18}58%{opacity:.02}}

.page-home-doomer .hub--brand{position:relative;z-index:3;display:block;width:100%;max-width:1260px;margin:0 auto;padding:42px 24px 68px}
.page-home-doomer .hub--brand::before{content:"";position:absolute;z-index:-1;top:0;left:50%;width:100vw;height:100%;transform:translateX(-50%);background:linear-gradient(180deg,rgba(2,3,4,.78),#050607 24%);border-top:1px solid rgba(255,255,255,.05);pointer-events:none}
.hub-intro{display:flex;align-items:center;margin:0 0 20px}.hub-intro h2{display:flex;align-items:center;gap:12px;margin:0;font-size:20px;font-weight:600;letter-spacing:-.015em;color:#d9dcde}.hub-intro h2::before{content:"";width:22px;height:1px;background:var(--signal)}
.hub-grid{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:14px}
.page-home-doomer .hub-grid .hub-card{min-height:252px;padding:22px 20px 19px;border:1px solid rgba(255,255,255,.09);border-radius:2px;background:rgba(7,9,10,.94);box-shadow:0 18px 46px rgba(0,0,0,.18);backdrop-filter:none;-webkit-backdrop-filter:none;transition:transform .22s ease,border-color .22s ease,background .22s ease,box-shadow .22s ease}
.page-home-doomer .hub-grid .hub-card:hover{transform:translateY(-2px);border-color:rgba(255,200,87,.30);background:#0a0c0d;box-shadow:0 22px 52px rgba(0,0,0,.27)}
.page-home-doomer .hub-card--featured{border-color:rgba(79,196,122,.27);box-shadow:0 18px 46px rgba(0,0,0,.18),0 0 0 1px rgba(79,196,122,.035);animation:th-home-trading-pulse 4.6s ease-in-out infinite}.page-home-doomer .hub-card--featured:hover{border-color:rgba(79,196,122,.46);box-shadow:0 22px 52px rgba(0,0,0,.27),0 0 20px rgba(79,196,122,.075)}
@keyframes th-home-trading-pulse{0%,100%{border-color:rgba(79,196,122,.24);box-shadow:0 18px 46px rgba(0,0,0,.18),0 0 0 1px rgba(79,196,122,.025)}50%{border-color:rgba(79,196,122,.38);box-shadow:0 18px 46px rgba(0,0,0,.20),0 0 18px rgba(79,196,122,.07)}}
.page-home-doomer .hub-grid .hub-card .icon{width:39px;height:39px;margin:0 0 20px;border:1px solid rgba(255,200,87,.18);border-radius:2px;background:rgba(255,200,87,.065);color:var(--signal)}.page-home-doomer .hub-grid .hub-card .icon svg{width:20px;height:20px}.page-home-doomer .hub-card--featured .icon{border-color:rgba(79,196,122,.20);background:rgba(79,196,122,.06);color:#60d48a}
.page-home-doomer .hub-grid .hub-card h3{margin:0 0 11px;font-size:20px;line-height:1.15;letter-spacing:-.015em;color:#e6e8e9}
.page-home-doomer .hub-card__detail{flex:1;margin:0!important;font-size:13px!important;line-height:1.58!important;color:#92999f!important}
.page-home-doomer .hub-grid .hub-card .card-foot{margin-top:20px;padding-top:14px;border-color:rgba(255,255,255,.065)}
.page-home-doomer .hub-grid .hub-card .meta{font-size:11px;font-weight:500;letter-spacing:.02em;color:#afb4b8}.page-home-doomer .hub-grid .hub-card .arrow{color:#73797e}.page-home-doomer .hub-grid .hub-card:hover .meta,.page-home-doomer .hub-grid .hub-card:hover .arrow{color:var(--signal)}.page-home-doomer .hub-card--featured:hover .meta,.page-home-doomer .hub-card--featured:hover .arrow{color:#60d48a}
.page-home-doomer .hub-card__badge{top:20px;right:20px;padding:3px 7px 3px 6px;border-radius:2px;background:rgba(79,196,122,.07);border-color:rgba(79,196,122,.22);font-size:9px;color:#65d58e}.page-home-doomer .hub-card__badge .dot{width:5px;height:5px;background:#65d58e;animation:hub-badge-pulse 2.4s ease-in-out infinite}
@media(max-width:1180px){.hub-grid{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media(max-width:980px){.hub-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.page-home-doomer .hub-grid .hub-card{min-height:230px}}
@media(max-width:560px){.page-home-doomer .hub--brand{padding:34px 18px 52px}.hub-intro{margin-bottom:16px}.hub-intro h2{font-size:18px}.hub-grid{grid-template-columns:1fr;gap:11px}.page-home-doomer .hub-grid .hub-card{min-height:210px;padding:20px 18px}.page-home-doomer .hub-card__badge{top:18px;right:18px}}
@media(min-width:901px){.hero.hero--doomer+.continue-widget+.hub{margin-top:0;position:relative;z-index:3}}
@media(max-width:1296px){.page-home-doomer .site-header{width:100%;margin-top:0;border-left:0;border-right:0}}
@media(min-width:761px){
.page-home-doomer .hub-card--featured{animation:none}
.page-home-doomer .hub-card--featured::before{content:"";position:absolute;inset:0;z-index:0;border:1px solid rgba(79,196,122,.38);box-shadow:inset 0 0 18px rgba(79,196,122,.07);opacity:.45;pointer-events:none;will-change:opacity;animation:th-home-compositor-pulse 4.6s ease-in-out infinite}
.page-home-doomer .hub-card--featured>*:not(.hub-card__badge){position:relative;z-index:1}
.page-home-doomer .hub-card--featured>.hub-card__badge{position:absolute;z-index:2}
.page-home-doomer .nav-links a[href$="trading"]{animation:none;color:#ffe0a0}
.page-home-doomer .nav-links a[href$="trading"]::after{box-shadow:0 0 9px rgba(255,200,87,.24);animation:th-home-compositor-pulse 3.8s ease-in-out infinite}
.page-home-doomer .btn[href$="trading"]{position:relative;animation:none}
.page-home-doomer .btn[href$="trading"]::after{content:"";position:absolute;inset:0;box-shadow:0 0 16px rgba(255,200,87,.16);opacity:.35;pointer-events:none;will-change:opacity;animation:th-home-compositor-pulse 4.2s ease-in-out infinite}
.page-home-doomer .hub-card__badge .dot{box-shadow:0 0 8px var(--pulse);animation:th-home-badge-opacity 1.6s ease-in-out infinite}
@keyframes th-home-compositor-pulse{0%,100%{opacity:.28}50%{opacity:.82}}
@keyframes th-home-badge-opacity{0%,100%{opacity:1}50%{opacity:.4}}
}
@media(max-width:760px){.page-home-doomer .site-header::before{backdrop-filter:none;-webkit-backdrop-filter:none}.hero.hero--doomer{min-height:400px}.hero-inner{padding:42px 20px 20px}.hero.hero--doomer .hero-cta{margin-bottom:0}.hero.hero--doomer h1{font-size:clamp(31px,8.5vw,44px)}.doomer{background-image:none!important}.doomer-poster{display:block}.doomer-video,.doomer-weather,.doomer-grain{display:none!important}.doomer-fog,.doomer-lamp,.doomer-reflections{animation:none!important}.doomer-vignette{box-shadow:inset 0 0 90px 18px rgba(0,0,0,.28),inset 0 -65px 70px -44px rgba(0,0,0,.31)}}
@media(max-width:760px){.page-home-doomer .nav-links a[href$="trading"],.page-home-doomer .nav-links a[href$="trading"]::after,.page-home-doomer .btn[href$="trading"],.page-home-doomer .hub-card--featured,.page-home-doomer .hub-card__badge .dot{animation:none!important}}
@media(max-width:560px){.hero.hero--doomer{min-height:380px}.hero-inner{padding:44px 18px 16px}.hero.hero--doomer .hero-cta{margin-bottom:0}.hero.hero--doomer .hero-cta .btn{flex:1 1 100%}.page-home-doomer .hub--brand{padding-top:24px}}

/* The Learn continuation card and the ad are independent block surfaces.
   Keep both in normal document flow on the dashboard so late ad activation or
   mobile stylesheet hydration cannot place the progress card over inventory. */
.page-home-doomer #main > .th-ad-slot{ position:relative; z-index:1; clear:both; }
.page-home-doomer #main > #continueWidget:not([hidden]){
  position:relative; inset:auto; z-index:1; clear:both;
  display:block; width:100%; box-sizing:border-box;
  margin:14px auto 8px !important; transform:none;
}
@media(max-width:760px){
  .page-home-doomer #main > #continueWidget:not([hidden]){
    max-width:344px !important; padding:0 12px !important; margin-top:20px !important;
  }
  .page-home-doomer #main > #continueWidget .continue-card{ transform:none !important; }
  .page-home-doomer #main > .th-ad-slot--mobile-banner{
    --th-ad-height:100px; --th-ad-label-height:20px;
    height:120px !important; min-height:120px !important; overflow:hidden;
  }
}

/* Homepage mobile advertising keeps its final 320x100 + 20px label geometry
   from first paint. advertising.css may hydrate later, but it must never
   collapse this one dashboard slot while inventory/runtime state changes. */
@media(max-width:980px){
  .page-home-doomer #main > .th-ad-slot[data-ad-slot="home-mobile-banner"]{
    --th-ad-height:100px; --th-ad-label-height:20px;
    display:block !important; box-sizing:border-box;
    width:320px; max-width:100%; height:120px !important; min-height:120px !important;
    margin:14px auto !important; overflow:hidden; contain:layout paint; isolation:isolate;
  }
}

/* Homepage desktop advertising reserves the final 728x90 + 16px label geometry
   from first paint. The async advertising runtime may hydrate later, but the
   dashboard leaderboard must not collapse while inventory/runtime state changes. */
@media(min-width:981px){
  .page-home-doomer #main > .th-ad-slot[data-ad-slot="home-desktop-leaderboard"]{
    --th-ad-height:90px; --th-ad-label-height:16px;
    display:block !important; box-sizing:border-box;
    width:728px; max-width:100%; height:106px !important; min-height:106px !important;
    margin:10px auto 8px !important; overflow:hidden; contain:layout paint; isolation:isolate;
  }
}

@media(prefers-reduced-motion:reduce){.doomer-video{transform:none}.doomer-grain,.doomer-fog,.doomer-lamp,.doomer-reflections{animation:none!important}.doomer-grain{display:none}.doomer-weather{display:none}}