@font-face{font-family:AkkuratLL-Regular;src:url(/content/dam/spglobal/commodity-insights/en/content-design/infographics/common/fonts/AkkuratLL-Regular.woff2)format("woff2");font-display:swap}@font-face{font-family:AkkuratLL-Light;src:url(/content/dam/spglobal/commodity-insights/en/content-design/infographics/common/fonts/AkkuratLL-Light.woff2)format("woff2");font-display:swap}@font-face{font-family:AkkuratLL-Bold;src:url(/content/dam/spglobal/commodity-insights/en/content-design/infographics/common/fonts/AkkuratLL-Bold.woff2)format("woff2");font-display:swap}*,:before,:after{box-sizing:border-box}html,body{width:100%;height:100%;margin:0;padding:0;font-family:AkkuratLL-Light;overflow-x:hidden;line-height:normal!important}h1,h2,h3,h4,h5,h6,p{margin:0;padding:0;line-height:normal!important}p{margin-block:0}ul,ol{margin:0;padding:0;list-style:none;line-height:normal!important}button{background:0 0;border:none;padding:0}iframe{margin:0!important}#root{flex-direction:column;min-height:100vh;display:flex}main.final-wrapper{flex:1;width:100%;position:relative;overflow:hidden}section.map-layer{z-index:0;width:100%;height:100%;position:absolute;inset:0}.map-img{object-fit:cover;width:100%;height:100%;display:block}section.left-panel{color:#fff;z-index:2;background-color:#0a0a0ab3;flex-direction:column;width:23%;height:100%;display:flex;position:absolute;top:0;left:0;overflow:hidden}.left-panel-content{scrollbar-width:none;flex-direction:column;gap:clamp(.5rem,.25rem + .625vw,1rem);height:100%;padding:clamp(2rem,1rem + 2.5vw,4rem) clamp(.25rem,.125rem + .3125vw,.5rem) 0;display:flex;overflow-y:auto}.left-panel-content::-webkit-scrollbar{display:none}.page-description{padding:0 clamp(.25rem,.125rem + .3125vw,.5rem) 0 clamp(.5rem,.25rem + .625vw,1rem);font-family:AkkuratLL-Bold;font-size:clamp(.7rem,.6rem + .4444vw,1rem)}.timeline-list{flex-direction:column;gap:clamp(.6rem,.3rem + .75vw,1.2rem);padding-left:clamp(1rem,.5rem + 1.25vw,2rem);padding-right:clamp(.25rem,.125rem + .3125vw,.5rem);display:flex;position:relative}.timeline-list>li{width:fit-content;position:relative}.timeline-list>li:before{content:"";z-index:1;background-color:#fff;border-radius:50%;width:clamp(.3rem,.15rem + .375vw,.6rem);height:clamp(.3rem,.15rem + .375vw,.6rem);position:absolute;top:.25rem;left:clamp(-1rem,-.8125rem - .1562vw,-.875rem)}.timeline-list>li:after{content:"";z-index:1;background-color:#fff9;width:1px;height:calc(100% + 1rem);position:absolute;top:clamp(.25rem,.125rem + .3125vw,.5rem);left:-.75rem}.timeline-list>li:last-child:after{display:none}.timeline-item-year{font-family:AkkuratLL-Bold;font-size:clamp(.9rem,.75rem + .375vw,1.2rem)}.timeline-list ul{margin:.35rem 0 0;padding-left:0;list-style:none}.timeline-list ul li{width:auto;position:static}.timeline-list ul li:before,.timeline-list ul li:after{content:none}.timeline-item-desc{margin-top:clamp(.3rem,.15rem + .375vw,.6rem);font-size:clamp(.7rem,.575rem + .3125vw,.95rem)}.timeline-attribution{flex-direction:column;gap:.2rem;padding:clamp(.5rem,.25rem + .625vw,1rem) 0 0 clamp(.5rem,.25rem + .625vw,1rem);font-size:.8rem;display:flex}@media (max-width:1024px){section.left-panel{width:26%}}@media (max-width:769px){section.left-panel{width:29%}}.scroll-hint{pointer-events:none;background:linear-gradient(#0000 0%,#00000026 40%,#00000059 65%,#0000008c 85%,#000000b3 100%);justify-content:center;align-items:center;width:100%;height:4rem;display:flex;position:absolute;bottom:0;left:0;right:0}.scroll-arrow{filter:drop-shadow(0 0 8px #ffffff73)drop-shadow(0 4px 8px #000000b3);border-bottom:3px solid #edf86f;border-left:3px solid #edf86f;width:1rem;height:1rem;animation:1.4s infinite scroll-bounce;display:block;transform:rotate(-45deg)}@keyframes scroll-bounce{0%,to{opacity:.6;transform:translateY(-2px)rotate(-45deg)}50%{opacity:1;transform:translateY(4px)rotate(-45deg)}}section.right-panel{z-index:3;will-change:transform;background-color:#0a0a0ab3;width:28%;transition:transform .5s;position:absolute;top:0;bottom:0;right:0;transform:translate(0);box-shadow:-6px 0 18px #00000059}section.right-panel.closed{transform:translate(100%)}.panel-toggle{z-index:4;cursor:pointer;background-color:#0000;border:none;justify-content:center;align-items:center;width:clamp(1.5rem,.75rem + 1.875vw,3rem);height:clamp(1.5rem,.75rem + 1.875vw,3rem);padding:0;transition:transform .15s;display:flex;position:absolute;top:clamp(.5rem,.25rem + .625vw,1rem);right:clamp(.5rem,.25rem + .625vw,1rem)}.panel-toggle span{transform-origin:50%;background-color:#edf86f;border-radius:3px;width:clamp(1.25rem,1rem + .625vw,1.75rem);height:4px;transition:transform .4s cubic-bezier(.4,0,.2,1),opacity .2s;position:absolute}.panel-toggle span:after{content:"";transform-origin:50%;background-color:#fff;transition:transform .45s ease-out;position:absolute;inset:0;transform:scaleX(0)}.panel-toggle span:first-child{transform:translateY(-9px)}.panel-toggle span:nth-child(2){transform:translateY(0)}.panel-toggle span:nth-child(3){transform:translateY(9px)}.panel-toggle:not(.open):hover span:first-child{transform:translateY(-9px)translate(-5px)scaleX(1.25)}.panel-toggle:not(.open):hover span:nth-child(2){transform:scaleX(.6)}.panel-toggle:not(.open):hover span:nth-child(3){transform:translateY(9px)translate(5px)scaleX(1.25)}.panel-toggle.open span:first-child{transform:rotate(45deg)}.panel-toggle.open span:nth-child(2){opacity:0}.panel-toggle.open span:nth-child(3){transform:rotate(-45deg)}.panel-toggle.open:hover span:after{transform:scaleX(1)}.right-panel-inner{height:100%;padding:clamp(2rem,1rem + 2.5vw,4rem) clamp(.5rem,.25rem + .625vw,1rem) clamp(.5rem,.25rem + .625vw,1rem);overflow-y:auto}.right-panel-inner::-webkit-scrollbar{width:3px}.right-panel-inner::-webkit-scrollbar-track{background:0 0}.right-panel-inner::-webkit-scrollbar-thumb{background-color:#edf86f;border-radius:2px}.frame-container{flex-direction:column;gap:clamp(.5rem,.25rem + .625vw,1rem);height:100%;display:flex}.frame{border:0;flex:1 1 0;width:100%}.frame:first-of-type{min-height:300px}.frame:nth-of-type(2){min-height:400px}@media (max-width:1024px){section.right-panel{width:32%}}@media (max-width:768px){section.right-panel{width:36%}}
