*{box-sizing:border-box}article{display:block}aside{display:block}details{display:block}figcaption{display:block}figure{display:block;margin:0}footer{display:block}header{display:block}hgroup{display:block}nav{display:block}section{display:block}audio{display:inline}canvas{display:inline}video{display:inline}audio:not([controls]){display:none}[hidden]{display:none}html{color:#222;font-family:sans-serif;font-size:100%;-webkit-text-size-adjust:100%;-ms-text-size-adjust:100%}button{-webkit-appearance:button;color:#222;cursor:pointer;font-family:sans-serif;font-size:100%;line-height:normal;margin:0;overflow:visible;vertical-align:middle}input{color:#222;font-family:sans-serif;font-size:100%;line-height:normal;margin:0;vertical-align:middle}select{color:#222;font-family:sans-serif;font-size:100%;margin:0;vertical-align:middle}textarea{color:#222;font-family:sans-serif;font-size:100%;margin:0;overflow:auto;resize:vertical;vertical-align:top}body{font-size:1em;line-height:1.4;margin:0}::-moz-selection{background:#333;color:#fff;text-shadow:none}::selection{background:#333;color:#fff;text-shadow:none}a{color:#00e}a:hover{color:#06e;outline:0}a:active{outline:0}abbr[title]{border-bottom:1px dotted}b,strong{font-weight:700}blockquote{margin:1em 40px}dfn{font-style:italic}hr{border:0;border-top:1px solid #ccc;display:block;height:1px;margin:1em 0;padding:0}ins{background:#ff9;color:#000;text-decoration:none}mark{background:#ff0;color:#000;font-style:italic;font-weight:700}pre{font-family:monospace,serif;_font-family:"courier new",monospace;font-size:1em;white-space:pre-wrap;word-wrap:break-word}code,kbd,samp{font-family:monospace,serif;_font-family:"courier new",monospace;font-size:1em}q{quotes:none}q:before{content:none}q:after{content:none}small{font-size:85%}sub{bottom:-.25em;font-size:75%;line-height:0;position:relative;vertical-align:baseline}sup{font-size:75%;line-height:0;position:relative;top:-.5em;vertical-align:baseline}ul,ol{margin:1em 0;padding:0 0 0 40px}dd{margin:0 0 0 40px}nav ul{list-style:none;list-style-image:none;margin:0;padding:0}nav ol{list-style:none;list-style-image:none;margin:0;padding:0}img{border:0;-ms-interpolation-mode:bicubic;vertical-align:middle}svg:not(:root){overflow:hidden}form{margin:0}fieldset{border:0;margin:0;padding:0}label{cursor:pointer}legend{border:0;margin-left:-7px;padding:0;white-space:normal}input[type=button],input[type=reset],input[type=submit]{-webkit-appearance:button;cursor:pointer;overflow:visible}button[disabled],input[disabled]{cursor:default}input[type=checkbox],input[type=radio]{box-sizing:border-box;height:13px;padding:0;width:13px}input[type=search]{-webkit-appearance:textfield;-moz-box-sizing:content-box;-webkit-box-sizing:content-box;box-sizing:content-box}input[type=search]::-webkit-search-decoration{-webkit-appearance:none}input[type=search]::-webkit-search-cancel-button{-webkit-appearance:none}button::-moz-focus-inner{border:0;padding:0}input::-moz-focus-inner{border:0;padding:0}input:invalid{background-color:#f0dddd}textarea:invalid{background-color:#f0dddd}table{border-collapse:collapse;border-spacing:0}td{vertical-align:top}.chromeframe{background:#ccc;color:#000;margin:.2em 0;padding:.2em 0}@font-face{font-display:swap;font-family:Readex Pro;font-style:normal;font-weight:200;src:url(/math-comparator-game-v2/assets/ReadexPro-ExtraLight-Db47ryAe.woff) format("woff")}@font-face{font-display:swap;font-family:Readex Pro;font-style:normal;font-weight:300;src:url(/math-comparator-game-v2/assets/ReadexPro-Light-sck4epja.woff) format("woff")}@font-face{font-display:swap;font-family:Readex Pro;font-style:normal;font-weight:400;src:url(/math-comparator-game-v2/assets/ReadexPro-Regular-HuteJ5qw.woff) format("woff")}@font-face{font-display:swap;font-family:Readex Pro;font-style:normal;font-weight:500;src:url(/math-comparator-game-v2/assets/ReadexPro-Medium-4M0Ipz8W.woff) format("woff")}@font-face{font-display:swap;font-family:Readex Pro;font-style:normal;font-weight:600;src:url(/math-comparator-game-v2/assets/ReadexPro-SemiBold-DG0D4Y6i.woff) format("woff")}@font-face{font-display:swap;font-family:Readex Pro;font-style:normal;font-weight:700;src:url(/math-comparator-game-v2/assets/ReadexPro-Bold-0I_rjQY7.woff) format("woff")}:root{--white: #FFFFFF;--white-70: #FFFFFFB3;--blue: #1E90FF;--blue-25: #1E90FF40;--dark-blue: #001932;--light-blue: #BBDEFF;--lighter-blue: #E2F1FF;--body-font: "Readex Pro", Helvetica, Arial, sans-serif;--spacing-xsmall: 16px;--spacing-small: 24px;--spacing-medium: 32px;--spacing-large: 40px;--spacing-xlarge: 48px}body{background:var(--dark-blue);color:var(--dark-blue);display:block;font:700 1.125rem /calc(22 / 18) var(--body-font);margin:0;-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased}.accessibility{backface-visibility:hidden;left:-9999999999px;opacity:0;position:absolute}h1,h2,h3,h4,h5,h6,p{margin:0}.eyebrow{font-size:.75rem;letter-spacing:1.2px;line-height:1.25;margin:0 0 var(--spacing-small);text-align:center;text-transform:uppercase;-webkit-user-select:none;user-select:none;width:100%}.btn{background:var(--white-70);border:unset;border-radius:8px;font:700 1.125rem /calc(22 / 18) var(--body-font);padding:var(--spacing-xsmall);text-align:center;transition:all .25s ease}.btn:not([disabled]):hover{background:var(--white)}input[type=number]:focus{outline:none}input[type=number]::-webkit-inner-spin-button,input[type=number]::-webkit-outer-spin-button{-webkit-appearance:none;margin:0}input[type=number]{-moz-appearance:textfield}.game{align-items:center;display:flex;gap:80px;justify-content:space-between;height:100vh;min-height:max-content;padding:40px}.game .right-column{display:flex;flex-direction:column;gap:var(--spacing-xlarge);height:818px;justify-content:flex-end;width:calc(448 / 1440 * 100vw)}.game h1{color:var(--white);font-size:4.25rem;line-height:1.25;text-align:center;-webkit-user-select:none;user-select:none}body:has(.stack.grabbing),body:has(.stack.grabbing) .interactive-window.update .stack,body:has(.stack.grabbing) .stack-container .ice-cube{cursor:grabbing}.interactive-window{align-items:center;background:var(--blue-25);border-radius:24px;display:flex;height:818px;justify-content:space-between;min-height:max-content;padding:100px 100px 40px;position:relative;width:calc(752 / 1440 * 100vw)}.interactive-window .floating-ice-cube{aspect-ratio:1;height:auto;left:0;opacity:0;pointer-events:none;position:fixed;top:0;transition:opacity .25s ease;transition-delay:.1s;width:60px}.interactive-window .floating-ice-cube.active{opacity:1}.interactive-window .floating-ice-cube svg{height:auto;width:100%}.stack{align-items:center;display:flex;height:100%;min-height:max-content;padding:0 0 140px;position:relative}.interactive-window.update .stack{cursor:pointer}.stack-wrapper{height:max-content;position:relative}.stack-container{display:flex;flex-direction:column;justify-content:center;height:max-content;position:relative;scale:1 -1}.stack-container .ice-cube{position:relative;transition:all .25s ease}.interactive-window.update .stack-container .ice-cube{cursor:grab}.stack-container .ice-cube:before{aspect-ratio:1;box-shadow:0 -4px 40px #ffffff8c;content:"";height:auto;left:50%;position:absolute;top:50%;transition:all .25s ease;translate:-50% -50%;width:40px}.interactive-window.update .stack-container .ice-cube:hover{translate:0 5px}.interactive-window.update .stack-container .ice-cube:hover:before{box-shadow:0 -4px 40px #fff}.stack-container .ice-cube:not(:first-child){margin-top:-12px}.stack-container svg{height:auto;scale:1 -1;width:60px}.interactive-window .connector-container{left:0;opacity:0;pointer-events:none;position:absolute;top:0;transition:opacity .25s ease}.interactive-window.active-connectors .connector-container{opacity:1}.interactive-window .connector-container path{filter:drop-shadow(0 0 16px rgba(255,255,255,.75));opacity:0;transition:opacity .25s ease}.stack .connector{aspect-ratio:1;background:unset;border:unset;border-radius:100%;height:auto;left:50%;opacity:0;pointer-events:none;position:absolute;transition:all .25s ease;translate:-50% 0;visibility:hidden;width:56px}.stack .connector:before,.stack .connector:after{background:radial-gradient(var(--blue),transparent);border-radius:100%;content:"";height:100%;left:0;position:absolute;scale:.8;top:0;transition:all .4s ease;width:100%}.stack .connector:after{opacity:0}.stack .connector.top{top:-64px}.stack .connector.bottom{bottom:-64px}.stack .connector.active{opacity:.5;pointer-events:auto;visibility:visible}.stack .connector.active:before{animation:connector-pulse 3s ease infinite}.stack .connector.active:hover{opacity:.9}.interactive-window:has(.connector.active:hover) .connector:before{animation-play-state:paused}.stack .connector.active:hover:before{opacity:0}.stack .connector.active:hover:after{opacity:1;scale:1}@keyframes connector-pulse{0%{scale:.8}50%{scale:1}to{scale:.8}}.stack h3{bottom:0;color:var(--white);font-size:3.125rem;line-height:1.24;margin-top:var(--spacing-large);position:absolute;text-align:center;-webkit-user-select:none;user-select:none;width:100%}.control-panel{align-items:center;background:var(--light-blue);border-radius:24px;display:flex;flex-direction:column;padding:var(--spacing-large) var(--spacing-large) var(--spacing-xlarge)}.control-panel .stack-inputs,.control-panel .mouse-controls{display:flex;gap:0 var(--spacing-small);flex-wrap:wrap;width:100%}.control-panel .stack-input{align-items:center;background:var(--white-70);border-radius:8px;display:flex;flex-direction:column;gap:var(--spacing-xsmall);padding:var(--spacing-xsmall);position:relative;text-align:center;transition:all .25s ease;width:calc((100% - var(--spacing-small)) / 2)}.control-panel .stack-input:has(input[type=number]:focus),.control-panel .mouse-controls .btn.active{background:var(--white);box-shadow:inset 0 0 0 2px var(--blue)}.control-panel .stack-input>*{position:relative;z-index:1}.control-panel input{background:unset;border:unset;color:var(--dark-blue);font:700 1.375rem /calc(28 / 22) var(--body-font);padding:0;text-align:center;width:100%}.control-panel label{text-transform:capitalize;-webkit-user-select:none;user-select:none}.control-panel .stack-inputs+.mouse-controls{margin-top:var(--spacing-large)}.control-panel .mouse-controls .btn{align-items:center;display:flex;gap:var(--spacing-xsmall);justify-content:center;width:calc((100% - var(--spacing-small)) / 2)}.control-panel .mouse-controls svg{aspect-ratio:1;height:auto;pointer-events:none;width:23px}.control-panel .mouse-controls svg rect,.control-panel .mouse-controls svg path{fill:var(--dark-blue)}.control-panel .btn.play,.control-panel .btn.reset{align-items:center;display:flex;justify-content:center;margin:105px 0 0;width:100%}.control-panel .btn.play svg{height:22px;width:auto}.control-panel .btn.play[disabled]{opacity:.6}.control-panel .btn.reset{margin:24px 0 0}.toggle-control-panel{display:none}@media only screen and (max-width: 87.5rem){.game h1{font-size:calc(68 / 1400 * 100vw)}.interactive-window{width:calc((100vw - 56px - 80px) / 5 * 3)}.game .right-column{width:calc((100vw - 136px)*.4)}}@media only screen and (max-width: 68.75rem){.game:before{background:var(--dark-blue);content:"";height:100vh;left:0;opacity:0;pointer-events:none;position:fixed;top:0;transition:all .25s ease;visibility:hidden;width:100vw;z-index:1}.game.controls-open:before{opacity:.4;pointer-events:auto;visibility:visible}.game h1{display:none}.toggle-control-panel{align-items:center;background:var(--light-blue);border:unset;border-radius:4px 0 0 4px;display:flex;height:56px;justify-content:center;position:fixed;right:0;top:50%;transition:background .25s ease;translate:0 -50%;width:28px;z-index:2}.toggle-control-panel:hover{background:var(--lighter-blue)}.toggle-control-panel svg{height:16px;left:-1px;position:relative;transition:all .25s ease;width:auto}.controls-open .toggle-control-panel svg{left:1px;scale:-1 1}.interactive-window{max-height:100%;width:100%}.game .right-column{height:max-content;left:100%;max-width:calc(100vw - 80px);position:fixed;top:50%;transition:all .25s ease;translate:0 -50%;width:350px;z-index:2}.game.controls-open .right-column{translate:calc(-100% - var(--spacing-large)) -50%}}@media only screen and (max-width: 40.625rem){.interactive-window{padding:var(--spacing-large) var(--spacing-large) var(--spacing-small)}.interactive-window .floating-ice-cube{width:42px}.stack-container .ice-cube:before{width:26px}.stack-container svg{width:42px}.stack{padding:0 0 90px}.stack .connector{width:44px}.stack .connector.top{top:-50px}.stack .connector.bottom{bottom:-54px}.stack h3{font-size:2.375rem}.control-panel{border-radius:16px;padding:var(--spacing-medium) var(--spacing-small)}}