/* One product window contains the whole example. */
.explainer-workspace{width:100%;max-width:700px;margin:0 auto}
.explainer-workspace .product-window{transform:none}
.original-workspace{max-width:630px;padding:10px}
.original-workspace .product-window{background:linear-gradient(#fff,#fafafb);border:1px solid #e0e0e5;border-radius:22px;box-shadow:0 22px 65px -24px #00000020;transform:perspective(1200px) rotateY(-5deg) rotateX(2deg);transition:transform .7s}
.original-workspace .product-window:hover{transform:perspective(1200px) rotateY(0) rotateX(0)}
.original-workspace .window-top{height:46px;background:#f9f9fa;padding:0 18px;font-size:10px}
.original-workspace .product-content{padding:25px}
.original-workspace .ui-title h3{font-size:26px;margin-top:4px}.original-workspace .ui-title small{font-size:9px;color:#92929c;letter-spacing:1px}.original-workspace .scan-status{font-size:10px}
.original-workspace .ui-metrics{grid-template-columns:repeat(3,1fr);margin:23px 0;padding:17px 0;gap:8px}
.original-workspace .ui-metrics>div:first-child{display:block}.original-workspace .ui-metrics>div:last-child{text-align:left}.original-workspace .ui-metrics small{font-size:9px;color:#92929e}.original-workspace .ui-metrics b{font:400 24px var(--f-display);margin-top:5px}
.original-workspace .ui-opportunity{border:1px solid #e4e4e9;background:white;padding:20px;border-radius:14px}
.original-workspace .ui-row,.original-workspace .ui-row small{font-size:9px;color:#92929c}
.original-workspace .ui-opportunity h4{font:500 26px var(--f-display);margin:13px 0 15px}.original-workspace .ui-opportunity h4 span{font-size:13px;color:#9d9da5;padding:0 5px}
.original-workspace .ui-book{gap:14px;padding:13px 0;font-size:12px}.original-workspace .ui-book img{width:53px;height:26px}.original-workspace .ui-book small{color:#94949f;margin-left:7px}.original-workspace .ui-book>b{font:400 18px var(--f-display)}
.original-workspace .outcome-label{font-size:11px;margin:20px 0 10px}.original-workspace .winner-switch{margin:0 0 22px;gap:10px}.original-workspace .winner-switch button{font-size:12px;padding:12px 10px}
.original-workspace .simple-return{padding-top:18px;border-top:1px solid #ededf0;display:flex;justify-content:space-between;gap:15px}.original-workspace .simple-return small{display:block;font-size:10px;color:#92929c}.original-workspace .simple-return strong{font:500 29px var(--f-body);letter-spacing:-.8px}.original-workspace .simple-return>div:last-child{text-align:right}
.original-workspace .result-story{font-size:11px;line-height:1.7;color:#787882;margin:15px 0 0}.original-workspace .result-story b{font-weight:500}
.original-workspace .ui-foot{font-size:9px;line-height:1.6;color:#92929c;margin-top:15px;display:block}
@media(max-width:760px){.original-workspace{padding:0}.original-workspace .product-window,.original-workspace .product-window:hover{transform:none}.original-workspace .product-content{padding:17px}.original-workspace .ui-opportunity{padding:15px}.original-workspace .ui-title h3{font-size:23px}.original-workspace .scan-status{font-size:8px}.original-workspace .ui-metrics b{font-size:22px}.original-workspace .ui-book{gap:9px}.original-workspace .ui-book img{width:46px}.original-workspace .ui-book small{margin-left:4px;font-size:10px}.original-workspace .ui-book>b{font-size:17px}.original-workspace .simple-return strong{font-size:25px}}
@media(prefers-reduced-motion:reduce){.original-workspace .product-window,.original-workspace .product-window:hover{transform:none;transition:none}}
/* Include the currency prefix inside the focus treatment. */
.stake-setting>span{display:inline-flex;align-items:center;gap:7px;padding:10px 12px;color:#555560;transition:border-color .2s,box-shadow .2s}
.stake-setting>span:focus-within{border-color:#269849;box-shadow:0 0 0 2px #2698491f}
.stake-setting input{min-width:0;width:86px;padding:0;line-height:1.3;color:#28282f}
.stake-setting input:focus,.stake-setting input:focus-visible{outline:none;border-radius:0;box-shadow:none}
#what .sec-head{max-width:850px;margin-bottom:40px}
#what .lead{max-width:700px}
.compact-workspace{max-width:1040px;margin:auto;padding:0;overflow:hidden;border:1px solid #e0e0e5;border-radius:24px;background:white;box-shadow:0 18px 70px #171b2710}
.workspace-chrome{display:flex;justify-content:space-between;align-items:center;padding:17px 26px;background:#fafafa;border-bottom:1px solid #ededf0;color:#85858d;font-size:11px}
.workspace-chrome>span:first-child{display:flex;gap:8px;align-items:center;color:#2e3035;font-size:14px;font-weight:500}.workspace-chrome img{width:20px;height:20px}
.compact-body{display:grid;grid-template-columns:1.15fr 1fr}
.compact-bets{padding:32px}.compact-bets h3{font-size:33px;margin:20px 0 27px}.compact-bets h3 span{font-size:17px}
.compact-bets .example-top{font-size:10px;letter-spacing:.03em}.compact-bets .example-leg{padding:15px 13px;gap:12px;border:1px solid #ebebee;border-radius:13px;background:#fafafa;margin:12px 0;display:grid;grid-template-columns:65px 1fr auto}
.compact-bets .example-leg img{width:65px;height:42px;object-fit:contain;background:transparent;border-radius:0;padding:0}
.compact-bets .example-leg b{font-size:14px}.compact-bets .example-leg small{font-size:11px;margin-top:5px}.compact-bets .leg-state{display:none}.compact-bets .example-leg.winning{border-color:#cbded0;background:#fafcfb}
.compact-outcome{padding:32px;background:#fcfcfd;border-left:1px solid #ededf0;display:flex;flex-direction:column;justify-content:center}
.compact-outcome .outcome-label{margin:0 0 12px;color:#70717b;font-size:12px}.compact-outcome .winner-switch{margin:0 0 27px;gap:8px}.compact-outcome .winner-switch button{font-size:13px;padding:12px 10px}
.compact-outcome .simple-return{display:block;margin:0;padding:0;border:0}.compact-outcome .simple-return>div{display:flex;align-items:center;justify-content:space-between;gap:10px;text-align:left}
.compact-outcome .simple-return small{font-size:12px;color:#777982}.compact-outcome .return-line strong{font:500 25px var(--f-body);letter-spacing:-.7px;color:#34363b}.compact-outcome .cost-line{margin:13px 0 18px}.compact-outcome .cost-line>span{font:400 18px var(--f-body);color:#7b7e84}.compact-outcome .profit-line{border-top:1px solid #e1e5e2;padding-top:18px}.compact-outcome .profit-line strong{font:500 34px var(--f-body);letter-spacing:-1px;color:#27894a}
.compact-outcome .result-story{font-size:12px;line-height:1.7;margin:20px 0 0;color:#74767f}.compact-outcome .result-story b{font-weight:500;color:#373b40}
.compact-workspace .example-caption{display:block;margin:0;padding:16px 26px;border-top:1px solid #ededf0;color:#93949d;font-size:10px;line-height:1.6}
/* Six large logos, entirely within the CTA. */
.stack-cta.with-logos{display:grid;grid-template-columns:1.1fr 1fr;gap:50px;padding:55px;overflow:visible;align-items:center}
.with-logos .stack-copy{width:100%}.cta-logo-study{width:100%;max-width:none;gap:16px;grid-template-columns:1fr 1fr}
.cta-logo-study>div{min-height:100px;padding:14px;border-radius:16px;background:#fff;border:1px solid #e8e8eb;transform:none!important}
.cta-logo-study img,.cta-logo-study img[alt=DraftKings],.cta-logo-study img[alt=Caesars]{width:155px;height:75px;max-width:100%;object-fit:contain}
@media(max-width:760px){
 .video-hero:has(#hero-autoplay:not([hidden])) .hero-grid{grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr);gap:14px 14px;align-items:center}
 .video-hero:has(#hero-autoplay:not([hidden])) .hero-grid>div:first-child{display:contents}
 .video-hero:has(#hero-autoplay:not([hidden])) .hero .kicker{grid-column:1;grid-row:1;align-self:end;font-size:8px;letter-spacing:1.1px;margin:0;line-height:1.7}
 .video-hero:has(#hero-autoplay:not([hidden])) .hero h1{grid-column:1;grid-row:2;font-size:clamp(28px,7.8vw,45px);letter-spacing:-1.4px;line-height:1.04;margin:0}
 .video-hero:has(#hero-autoplay:not([hidden])) .hero-actions{grid-column:1;grid-row:3;align-self:start;margin:0}
 .video-hero:has(#hero-autoplay:not([hidden])) .hero-actions .btn{font-size:11px;padding:12px 13px;gap:7px;white-space:nowrap}
 #hero-autoplay{grid-column:2;grid-row:1/4;width:min(100%,30.9375svh);margin:0;justify-self:end}
 #hero-autoplay .hero-video-controls{justify-content:center;padding:7px 4px;gap:5px}
 #hero-autoplay .video-time{flex-basis:100%;text-align:center;font-size:9px;margin:0}
 #hero-autoplay .hero-video-controls button{font-size:9px;padding:5px 7px}
 .video-hero:has(#hero-autoplay:not([hidden])) .hero .sub{grid-column:1/-1;grid-row:4;margin:15px 0 0;font-size:15px;line-height:1.75}
 .video-hero:has(#hero-autoplay:not([hidden])) .hero-product-line{grid-column:1/-1;grid-row:5;margin:0;font-size:14px;line-height:1.75}
 .video-hero:has(#hero-autoplay:not([hidden])) .hero-trust{grid-column:1/-1;grid-row:6;margin:8px 0 0;justify-content:flex-start;gap:10px;font-size:9px}
 .compact-body{grid-template-columns:1fr}.compact-bets{padding:23px 20px 10px}.compact-bets h3{font-size:30px;margin:18px 0}.compact-outcome{padding:20px;border-left:0;border-top:1px solid #ededf0}.compact-bets .example-leg{grid-template-columns:51px 1fr auto;gap:9px;padding:13px 10px}.compact-bets .example-leg img{width:51px}.compact-bets .example-leg b{font-size:12px}.compact-bets .example-leg small{font-size:10px}.workspace-chrome{padding:14px 20px}.compact-workspace .example-caption{padding:14px 20px}.compact-outcome .winner-switch{margin-bottom:24px}
 .stack-cta.with-logos{grid-template-columns:1fr;padding:32px 22px;gap:30px}.cta-logo-study{max-width:350px;margin:auto;padding:0;gap:12px}.cta-logo-study>div{min-height:85px;padding:12px}.cta-logo-study img,.cta-logo-study img[alt=DraftKings],.cta-logo-study img[alt=Caesars]{height:65px}
}

/* Keep the explanation and complete interactive example in one desktop view. */
#what{padding-block:44px}
#what>.container{display:grid;grid-template-columns:minmax(0,.92fr) minmax(0,1.08fr);gap:clamp(28px,4vw,64px);align-items:center;max-width:1200px}
#what .sec-head{max-width:none;margin:0;text-align:left}
#what h2{font-size:clamp(32px,3.3vw,45px);line-height:1.12;letter-spacing:-1.6px;margin:20px 0}
#what .lead{font-size:16px;line-height:1.75;margin:0;max-width:42ch}
#what .kicker{font-size:10px;letter-spacing:1.6px}
#what .original-workspace{max-width:560px;min-width:0;padding:4px;margin:0 auto}
#what .window-top{height:34px}
#what .product-content{padding:18px}
#what .ui-title h3{font-size:23px}
#what .ui-metrics{margin:12px 0;padding:10px 0}
#what .ui-metrics b{font-size:21px;margin-top:3px}
#what .ui-opportunity{padding:15px}
#what .ui-opportunity h4{font-size:25px;margin:10px 0}
#what .ui-book{padding:10px 0}
#what .outcome-label{margin:13px 0 8px}
#what .winner-switch{margin:0 0 14px}
#what .winner-switch button{padding:10px;min-height:44px}
#what .simple-return{padding-top:12px}
#what .simple-return strong{font-size:28px;margin-top:5px}
#what .result-story{margin-top:11px;padding-top:10px;line-height:1.5;min-height:43px}
#what .ui-foot{margin-top:10px;line-height:1.5}
@media(max-width:760px){
 #what{padding-block:32px}
 #what>.container{grid-template-columns:1fr;gap:24px}
 #what h2{font-size:30px;margin:14px 0;letter-spacing:-1px}
 #what .lead{font-size:14px;line-height:1.6;max-width:none}
 #what .original-workspace{max-width:520px;padding:0}
 #what .product-content{padding:14px}
 #what .ui-opportunity{padding:12px}
 #what .simple-return strong{font-size:25px}
}

/* Give the landscape hero film a little more room. */
@media(min-width:761px){
 .video-hero:has(#hero-autoplay:not([hidden])) .hero-grid{max-width:1320px;grid-template-columns:minmax(0,.94fr) minmax(0,1.06fr);gap:48px}
 .video-hero #hero-autoplay{max-width:680px;width:100%}
}
@media(min-width:761px) and (max-width:1050px){
 .video-hero:has(#hero-autoplay:not([hidden])) .hero-grid{gap:30px}
}