/* StockRepublic extra slides (agent B): the hot-companies dossier, full width between the deck's top bar (72px) and footer
   (84px). The t_hot chapter break uses round2.css (.t2). Pricing styles live in pricing.css. */
.sx-frame{position:absolute;left:0;right:0;top:72px;bottom:84px;z-index:1;background:#fff;border-top:.75px solid rgba(28,6,47,.06);border-bottom:.75px solid rgba(28,6,47,.06)}
.sx-frame iframe{display:block;width:100%;height:100%;border:0;background:#fff}
body.embedded .sx-frame{top:0;bottom:0}

/* StockRepublic fit (C1, 5 Nov 2026): phone layout (<= 600px wide) for "idea" and "price"; the desktop sizes are unchanged. */
@media (max-width:600px){
 .t2-pts{gap:10px;align-content:start}
 .t2-pt{min-height:0;padding:14px 18px;gap:4px;border-radius:18px}
 .t2-pt .t2-ic{display:none}
 .t2-pt .t2-n{top:14px;right:16px}
 .t2-pt h3{margin-top:0;font-size:20px}
 .t2-pt p{min-height:0;font-size:14px;line-height:1.4}
 .t2-val{font-size:40px}
 .sx-offer .jo-price.sx-two .jo-p{font-size:clamp(30px,9.6vw,48px)}
 .jo-cv-globe{top:calc(76px + 59vw)}
}

/* StockRepublic fit (C1, 5 Nov 2026): on a phone the denser data slides (search, criteria, sources) scroll inside the space between the
   top bar and the footer instead of running under them; their grids stack. Desktop sizes are unchanged. */
@media (max-width:600px){
 #stage .slide:has(> .split),#stage .slide:has(> .crit),#stage .slide:has(> .dsrc){bottom:84px;padding-bottom:20px;overflow-y:auto;overscroll-behavior:contain}
 #stage .slide:has(> .split)>*,#stage .slide:has(> .crit)>*,#stage .slide:has(> .dsrc)>*{flex-shrink:0}
 #stage .slide>.crit{flex:none;grid-template-columns:1fr;align-content:start}
 #stage .slide>.dsrc{flex:none}
 .src-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
}
/* StockRepublic colours over the engine's yellow (C1, 5 Nov 2026): top-bar dot, slide glow, orbit core, field "Shortlisted", timeline lead lane, badges */
.top i{background:#B380F1}
.slide{background:radial-gradient(900px 520px at var(--gx,85%) var(--gy,10%),rgba(102,51,153,.09),transparent 65%),radial-gradient(700px 480px at var(--hx,8%) var(--hy,95%),rgba(179,128,241,.13),transparent 62%),radial-gradient(600px 420px at 55% 55%,rgba(153,76,229,.05),transparent 70%),var(--bg)}
.core::before{background:radial-gradient(circle,rgba(179,128,241,.42),rgba(102,51,153,.16) 50%,transparent 70%)}
.hypo{background:linear-gradient(90deg,rgba(179,128,241,.9),rgba(179,128,241,.55))}
.quad2 .q.capped{background:linear-gradient(135deg,#E0D6EB,#B380F1);box-shadow:0 24px 60px rgba(179,128,241,.35)}
.btc.dark .btn{background:#B380F1}
#stage [fill="#B380F1" i],#stage [fill="#FFCC00" i]{fill:#663399!important}
#stage i[style*="#B380F1" i],#stage i[style*="#FFCC00" i]{background:#663399!important}
/* phone: the map stacks (copy, then the map), inside the scrolling slide */
@media (max-width:600px){
 #stage .slide>.split:has(.mapwrap){grid-template-columns:minmax(0,1fr);gap:14px}
 .split:has(.mapwrap)>.copy{overflow:visible;justify-content:flex-start}
 .split:has(.mapwrap)>.visual{height:230px;flex:none}
}

/* orbit : with reduced motion the engine drops the chips' centring transform, so they sat half a chip to the
   right; keep them centred. On a phone the 17 chips become a wrapped list (rings and core hidden) inside the scrolling slide. */
@media (prefers-reduced-motion:reduce){#stage .orbit-wrap .chipn{transform:translate(-50%,-50%)}}
@media (max-width:600px){
 #stage .slide:has(> .orbit-wrap){bottom:84px;padding-bottom:20px;overflow-y:auto;overscroll-behavior:contain}
 #stage .slide:has(> .orbit-wrap)>*{flex-shrink:0}
 #stage .orbit-wrap{flex:none;display:flex;flex-wrap:wrap;gap:8px;align-content:flex-start}
 #stage .orbit-wrap .ring,#stage .orbit-wrap .core{display:none}
 #stage .orbit-wrap .chipn{position:static;transform:none!important;animation:none}
 #stage .orbit-wrap .olegend{position:static;width:100%;order:-1;margin-bottom:4px}
}
/* criteria: the weight bar keeps its height when the card's text runs long */
#stage .ccard .wbar{flex:none}

/* engine ring colours (blue / violet / mint, inline) -> StockRepublic: head-on accent, other tiers light accent, backups muted */
#stage .chipn .mono[style*="#3D6BFF" i],#stage .olegend i[style*="#3D6BFF" i]{background:#663399!important}
#stage .chipn .mono[style*="#8B6CFF" i],#stage .olegend i[style*="#8B6CFF" i]{background:#B380F1!important}
#stage .chipn .mono[style*="#20C997" i],#stage .olegend i[style*="#20C997" i]{background:#A89BB5!important}
#stage .pcv .b i{background:#B380F1}
/* engine blues and violets on the field, map and timeline (SVG attributes, inline legend dots) -> StockRepublic */
#stage [fill="#3D6BFF" i]{fill:#663399!important}
#stage [fill="#8B6CFF" i]{fill:#B380F1!important}
#stage [fill="#20C997" i]{fill:#A89BB5!important}
#stage [fill="#7FA2FF" i],#stage [fill="rgb(127, 162, 255)"]{fill:#B380F1!important}
#stage i[style*="#7FA2FF" i]{background:#B380F1!important}
#stage [stop-color="#8B6CFF" i]{stop-color:#B380F1!important}
#stage [stop-color="#3D6BFF" i]{stop-color:#663399!important}
#stage .state{fill:#EFEBF3}
#stage .state.hit{fill:#E0D6EB}
/* timeline dots: the engine's per-competitor palette -> StockRepublic */
#stage [fill="#3D7BFF" i]{fill:#663399!important}
#stage [fill="#2FD39A" i]{fill:#8E7FA3!important}
#stage [fill="#FF7A59" i]{fill:#B380F1!important}
#stage [fill="#9B7BFF" i]{fill:#321055!important}

/* map slide on short Mac screens (1440x690): smaller headline so the last country row is not cut off */
@media (min-width:601px) and (max-height:720px){
 .split:has(.mapwrap)>.copy h1,.split:has(.mapwrap)>.copy h2{font-size:38px;line-height:1.08}
 .split:has(.mapwrap)>.copy{gap:8px}
}

.px-fit{overflow:hidden;background:#fbfaff}
