*,:after,:before{box-sizing:inherit}body,html{padding:0;margin:0}input::-webkit-inner-spin-button,input::-webkit-outer-spin-button{-webkit-appearance:none;appearance:none;margin:0}input[type=number]{-webkit-appearance:textfield;-moz-appearance:textfield;appearance:textfield}.field.racedistances,.field.system{-webkit-appearance:none;-moz-appearance:none;appearance:none;background:url("data:image/svg+xml;utf8,<svg viewBox='0 0 140 140' width='24' height='24' xmlns='http://www.w3.org/2000/svg'><path d='m 20 60 l 50 50 l 50 -50' fill='none' stroke='white' stroke-width='16' stroke-linecap='round' stroke-linejoin='round' /></svg>") no-repeat}.field.system{background-position:right 5px top 50%;padding-right:35px}.field.racedistances{background-position:50%;padding-right:60px;width:60px}.field.system::after{content:"";display:block;width:1em;height:1em;background:#000}html{box-sizing:border-box;font-family:Avenir,sans-serif;font-size:3em;color:#f3f3f3;background:#00467f;background:linear-gradient(to right bottom,#a5cc82,#00467f);background-size:cover;background-repeat:no-repeat;background-attachment:fixed;height:100%}.app{display:flex;align-items:center;justify-content:center;height:75vh;min-height:12em}.field{font:inherit;border:0;padding:0;margin:0;width:2em;background-color:transparent;color:#1e1e1e;outline:0;font-weight:900}.system{color:currentColor;font-weight:400;width:auto}.timeinput{display:flex;gap:.5em}.numberinput{border-bottom:3px solid}.timeinput .numberinput{display:inline-flex;flex-direction:row-reverse}.row{display:flex;gap:.5em;margin-bottom:.5em}.distance{border-bottom:3px solid currentColor}.distance .field{border-bottom:none}.distance .floatinput{width:3.9em}.content{position:relative;background:#f3f3f3;color:#1e1e1e;font-size:18px;padding:3em 0}.content::before{content:"";display:block;position:absolute;width:100%;top:0;height:40vh;margin-top:-5vh;background-color:#f3f3f3;-webkit-transform:skewY(-2.5deg);transform:skewY(-2.5deg);z-index:-1}.content .inner{max-width:540px;margin:auto;padding:20px}@media screen and (max-width:550px){html{font-size:1.8em;align-items:flex-start}.app{margin:2.5em auto;height:auto}.field.system{background-size:16px;padding-right:25px}.field.racedistances{background-size:16px;background-position:50%;padding-right:44px;width:44px}.content{padding-top:2em}.distance .floatinput{width:3.3em}}