:root{--color-bg: #1e1e1e;--color-release-bg: #686868;--color-release-border: #d9d9d9;--color-teal: #046172;--color-red: #e93c1f;--color-white: #ffffff;--release-w: 2600px;--release-h: 1922px;--release-pad: 120px;--card: 240px;--gap: 120px;--stack-offset: 80px;--scale: .45}*{box-sizing:border-box}html,body{margin:0;padding:0;background:var(--color-bg);font-family:Lato,system-ui,sans-serif;color:var(--color-white);-webkit-font-smoothing:antialiased;min-height:100vh}#root{min-height:100vh}.app{display:flex;flex-direction:column;align-items:flex-start;padding:32px 48px 64px;gap:24px}.page-title{font-size:28px;font-weight:400;margin:0}.stage{width:100%;display:flex;justify-content:center;overflow:hidden}.stack{position:relative;transform:scale(var(--scale));transform-origin:top left;width:calc(var(--release-w) + 3 * var(--stack-offset));height:calc(var(--release-h) + 3 * var(--stack-offset));margin-right:calc((var(--release-w) + 3 * var(--stack-offset)) * (var(--scale) - 1));margin-bottom:calc((var(--release-h) + 3 * var(--stack-offset)) * (var(--scale) - 1))}.release{position:absolute;top:calc(3 * var(--stack-offset));left:calc(3 * var(--stack-offset));width:var(--release-w);height:var(--release-h);background:var(--color-release-bg);border:1px solid var(--color-release-border);box-shadow:10px 10px 20px #00000040;transition:transform .32s cubic-bezier(.22,1,.36,1);will-change:transform}.release--back{cursor:pointer}.release--back:hover{filter:brightness(1.05)}.release--front{cursor:default}.release__header{position:absolute;top:0;left:0;display:contents;pointer-events:none}.release__version-label{position:absolute;top:23px;left:23px;font-size:24px;font-weight:400;line-height:1}.release__evolution{position:absolute;top:100px;left:23px;font-size:36px;font-weight:400;line-height:1}.release__grid{position:absolute;top:120px;left:120px;width:2400px;height:1680px;display:grid;grid-template-columns:repeat(7,var(--card));grid-template-rows:repeat(5,var(--card));column-gap:var(--gap);row-gap:var(--gap)}.release__depth-header{position:absolute;top:0;left:1008px;font-size:36px;line-height:1.15;pointer-events:none}.release__depth-line1{font-weight:400}.release__depth-line2{font-weight:300}.release__width-header{position:absolute;top:588px;left:0;font-size:36px;line-height:1.15;pointer-events:none}.release__width-line1{font-weight:400}.release__width-line2{font-weight:300}.release__arrows{position:absolute;top:0;left:0;width:100%;height:100%;pointer-events:none}.card{position:relative;width:var(--card);height:var(--card);padding:16px;display:flex;flex-direction:column;gap:12px;color:var(--color-white);cursor:pointer;transition:transform .22s cubic-bezier(.22,1,.36,1),box-shadow .22s cubic-bezier(.22,1,.36,1);transform-origin:center center;will-change:transform}.card--teal{background:var(--color-teal)}.card--red{background:var(--color-red)}.card:hover{transform:scale(2);box-shadow:0 12px 32px #00000059;z-index:5}.card__number{font-size:24px;font-weight:300;line-height:1}.card__title{font-size:24px;font-weight:400;line-height:1.1}.card__description{font-size:16px;font-weight:300;line-height:1.25;flex:1}.card__icon{width:48px;height:48px;display:flex;align-items:center;justify-content:center}.card__icon .material-symbols-outlined{font-size:32px;color:var(--color-white);font-variation-settings:"FILL" 0,"wght" 300,"GRAD" 0,"opsz" 24}.release--back .card{pointer-events:none}.release--back .release__evolution,.release--back .release__depth-header,.release--back .release__width-header,.release--back .release__arrows,.release--back .card{display:none}@media (max-width: 1600px){:root{--scale: .42}}@media (max-width: 1400px){:root{--scale: .36}}@media (max-width: 1200px){:root{--scale: .3}}@media (max-width: 900px){:root{--scale: .24}}