:root{--10ft-px: min( calc( 100vw / 960 ), calc( 100vh / 540 ) );--10ft-vw: calc( var(--10ft-px) * 9.6 );--10ft-vh: calc( var(--10ft-px) * 5.4 );--10ft-safe-x: calc( 5 * var(--10ft-vw) );--10ft-safe-y: calc( 5 * var(--10ft-vh) );--10ft-danger-x: calc( 2.5 * var(--10ft-vw) );--10ft-danger-y: calc( 2.5 * var(--10ft-vh) );--10ft-color-bg: #202020;--10ft-color-fg: #f1f1f1;--10ft-color-p1: #ff0000;--10ft-color-p2: #0042ff;--10ft-color-p3: #EBE129;--10ft-color-p4: #540081;--10ft-color-p5: #168000;--10ft-color-p6: #fe8a0e;--10ft-color-p7: #e55bb0;--10ft-color-p8: #4e2a04;--10ft-color-p9: #400000;--10ft-color-p10: #1ca7ea;--10ft-color-gold: #ffd700;--10ft-color-silver: #c0c0c0;--10ft-color-bronze: #cd7f32;--10ft-font-base: calc( 12 * var(--10ft-px) );--10ft-font-growth: 1.25;--10ft-font-xs: calc( var(--10ft-font-base) / var(--10ft-font-growth) );--10ft-font-sm: calc( var(--10ft-font-base) * pow( var(--10ft-font-growth), 0 ) );--10ft-font-md: calc( var(--10ft-font-base) * pow( var(--10ft-font-growth), 1 ) );--10ft-font-lg: calc( var(--10ft-font-base) * pow( var(--10ft-font-growth), 2 ) );--10ft-font-xl: calc( var(--10ft-font-base) * pow( var(--10ft-font-growth), 3 ) );--10ft-font-2x: calc( var(--10ft-font-base) * pow( var(--10ft-font-growth), 4 ) );--10ft-font-3x: calc( var(--10ft-font-base) * pow( var(--10ft-font-growth), 5 ) );--10ft-font-4x: calc( var(--10ft-font-base) * pow( var(--10ft-font-growth), 6 ) );--progress-width: 0}*,*:before,*:after{box-sizing:border-box}html,body{position:relative;margin:0;padding:0;background-color:var(--10ft-color-bg);color:var(--10ft-color-fg);fill:currentColor;stroke:currentColor;font-family:arial,helvetica,sans-serif;overflow:hidden}.page{display:flex;width:100vw;height:100vh;padding:var(--10ft-safe-x) var(--10ft-safe-x);background-color:var(--10ft-color-bg);position:relative;overflow:hidden;z-index:1;align-items:center;justify-content:center}.page>.cover-image{content:"";position:absolute;width:180vw;height:180vw;top:50%;left:50%;transform:translate(-50%,-50%);z-index:0;opacity:.33;pointer-events:none;background:url(jj.jpg) center center no-repeat;background-size:cover;filter:blur(calc(50 * var(--10ft-px)))}.left-half,.right-half{position:relative;width:50%;height:100%;display:flex;flex-direction:column;align-items:center;justify-content:center}.left-half{padding-right:var(--10ft-safe-x)}.right-half{padding-left:var(--10ft-safe-x);border-left:solid var(--10ft-px);border-color:var(--10ft-color-fg)}.outer{display:flex;flex-direction:column;justify-content:center;align-items:center}.inner{width:100%;aspect-ratio:1;display:flex;flex-direction:column;justify-content:space-between}.upper,.lower{width:100%}.left-half img.cover-image{display:block;width:100%;height:auto;aspect-ratio:1;object-fit:cover;box-shadow:0 calc(4*var(--10ft-px)) calc(6*var(--10ft-px)) #000000a8}h1{font-size:var(--10ft-font-3x);margin:0}h2{font-size:var(--10ft-font-lg);margin:0;margin-top:calc(1 * var(--10ft-px))}a{color:var(--10ft-color-fg)}.controls{display:flex;flex-direction:row;align-items:center;justify-content:center;gap:calc(25 * var(--10ft-px));margin-top:calc(50 * var(--10ft-px))}.control-button{background-color:var(--10ft-color-fg);color:var(--10ft-color-bg);fill:var(--10ft-color-bg);border:none;border-radius:50%;aspect-ratio:1;line-height:1;margin:0;padding:calc(5 * var(--10ft-px));display:inline-block}.control-button svg{display:block;width:calc(48 * var(--10ft-px));height:calc(48 * var(--10ft-px));fill:var(--10ft-color-bg);stroke:var(--10ft-color-bg)}.control-button:nth-child(2) svg{width:calc(72 * var(--10ft-px));height:calc(72 * var(--10ft-px))}.progress-container{display:flex;flex-direction:row;align-items:center;justify-content:space-between;flex-wrap:wrap;margin-top:calc(20 * var(--10ft-px));font-size:var(--10ft-font-lg);width:100%}.progress-bar{position:relative;width:100%;height:calc(15 * var(--10ft-px));border:var(--10ft-px) solid var(--10ft-color-fg);overflow:hidden;--progress-width: attr(data-progress type(<number>))}.progress-bar-fill{content:"";display:block;position:absolute;top:0;left:0;height:100%;background-color:var(--10ft-color-fg)}.app-description{margin:calc(20 * var(--10ft-px)) auto 0 auto;font-size:var(--10ft-font-md);color:var(--10ft-color-fg);opacity:.75;max-width:75%;text-align:center}