:root{--main-font-family: "Helvetica", "Arial", sans-serif;--main-font-size: 13px}html,body,#app{margin:0;height:100vh;width:100vw}#app{display:grid;grid-template-rows:auto 1fr auto;grid-template-columns:300px 1fr;grid-template-areas:"header  header" "sidebar main" "footer  footer"}#app>header{grid-area:header;background:#dafaff;border:2px solid #8df0ff;align-items:center;text-align:center;padding:.1em 1rem;margin:5px;font-family:var(--main-font-family);font-size:14px}#app>header img{height:2em;width:2em;margin:.3em .6em;vertical-align:-.9em;border-radius:5px}#app>main{grid-area:main;overflow:auto;margin:7px 18px;font-family:var(--main-font-family);font-size:var(--main-font-size)}#app>aside{background:#f6f6f6;border:2px solid #e2e2e2;grid-area:sidebar;overflow:hidden;padding:.8em;margin:0 5px;font-family:var(--main-font-family);font-size:var(--main-font-size)}#app input:not([type=file]),#app select,#app button,#app input[type=file]::file-selector-button{border:2px solid #8b8b8b;border-radius:0;font-family:var(--main-font-family);font-size:var(--main-font-size);color:#000;padding:3px 5px}#app select{background:#fff url(data:image/svg+xml;base64,PHN2ZyBpZD0iTGF5ZXJfMSIgZGF0YS1uYW1lPSJMYXllciAxIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCA0Ljk1IDEwIj48ZGVmcz48c3R5bGU+LmNscy0xe2ZpbGw6I2ZmZjt9LmNscy0ye2ZpbGw6IzQ0NDt9PC9zdHlsZT48L2RlZnM+PHRpdGxlPmFycm93czwvdGl0bGU+PHJlY3QgY2xhc3M9ImNscy0xIiB3aWR0aD0iNC45NSIgaGVpZ2h0PSIxMCIvPjxwb2x5Z29uIGNsYXNzPSJjbHMtMiIgcG9pbnRzPSIxLjQxIDQuNjcgMi40OCAzLjE4IDMuNTQgNC42NyAxLjQxIDQuNjciLz48cG9seWdvbiBjbGFzcz0iY2xzLTIiIHBvaW50cz0iMy41NCA1LjMzIDIuNDggNi44MiAxLjQxIDUuMzMgMy41NCA1LjMzIi8+PC9zdmc+) no-repeat 95% 50%;-moz-appearance:none;-webkit-appearance:none;appearance:none}#app button,#app input[type=file]::file-selector-button{background:#f6f6f6}#app button:hover,#app input[type=file]::file-selector-button:hover{background:#e2e2e2}#app button:active,#app input[type=file]::file-selector-button:active{background:#f6f6f6}#app button:disabled{background:#f6f6f6;color:#8b8b8b;border-color:#e2e2e2}#app>aside details{border:1px solid black;padding:.5em 1em 0}#app>aside summary{margin-bottom:.5em}#app>aside .row{display:flex;justify-content:space-between;align-items:center;margin-top:1em;margin-bottom:1em}#picker{margin-bottom:1.5em}#sport{width:170px}#app>footer{grid-area:footer;background:#e5ffcc;border:2px solid #98fb00;display:flex;align-items:center;justify-content:center;margin:5px;padding:.4em 0;font-family:var(--main-font-family);font-size:var(--main-font-size)}#app>footer p{margin:0}#explainer{display:flex;align-items:center;justify-content:center;width:100%;height:80%;margin:2em 0}#explainer>div{text-align:center;width:80%}@media (max-width: 768px){#app{grid-template-rows:auto auto 1fr 40px;grid-template-columns:1fr;grid-template-areas:"header" "sidebar" "main" "footer"}#app>aside{width:auto;overflow:visible}#elevatorpitch{display:none}}