:root{--main-bg-color:black;--secondary-bg-color:#3a3a3a;--tertiary-bg-color:#595959;--robot-red-color:#b22028;--robot-red-color-light:#c96369;--robot-red-color-light-2:#ec9ca2;--darkened-font:#ccc;color:#fff}.color-robot{color:var(--robot-red-color)}html{font-size:14px}body{background-color:var(--main-bg-color);padding:1em;font-family:sans-serif;margin-bottom:12em}h1{color:var(--robot-red-color-light);text-align:center}h2{color:var(--darkened-font);font-size:1em;margin-bottom:.2em;font-weight:400}div.card{background-color:var(--secondary-bg-color);padding:1em;border-radius:.2em;margin-bottom:2em}select{width:100%;max-width:30em;border:none;background-color:var(--tertiary-bg-color);color:#fff;font-size:1.3em;font-weight:700;padding:.5em}select:disabled{background-color:var(--secondary-bg-color);color:var(--tertiary-bg-color);cursor:not-allowed}button,input.btn{background-color:var(--robot-red-color);border-radius:.5em;padding:10px;border:0;color:#fff;transition:.1s all ease-in-out;cursor:pointer;box-shadow:0 4px 5px 1px rgba(0,0,0,.1)}.btn.button-not-urgent,button.button-not-urgent{background-color:var(--tertiary-bg-color)}.btn:hover:enabled,button:hover:enabled{background-color:var(--robot-red-color-light)}.btn:disabled,button:disabled{background-color:var(--tertiary-bg-color);color:var(--secondary-bg-color);cursor:not-allowed}.btn:active:enabled,button:active:enabled{background-color:var(--robot-red-color-light)}footer{background-color:var(--secondary-bg-color);position:fixed;z-index:100;bottom:0;height:7em;left:0;right:0;display:flex;justify-content:center}footer>a{flex-grow:1;color:#fff;background-color:inherit;border:none;display:flex;justify-content:center;align-items:center;text-decoration:none;flex-direction:column;transition:all ease-in-out .1s}footer>a.active>img{filter:none}footer>a>img{filter:brightness(1000%);width:2rem}footer>a:hover{background-color:var(--robot-red-color-light);color:#fff!important}footer>a:hover>img{filter:brightness(1000%)}footer>a.active{color:var(--robot-red-color-light)}.loader{border:8px solid var(--robot-red-color-light);border-top:8px solid var(--robot-red-color-light-2);border-radius:50%;width:10px;height:10px;animation:spin 1s linear infinite}@keyframes spin{0%{transform:rotate(0)}100%{transform:rotate(360deg)}}div.card.wifi-info{display:flex}div.card.wifi-info #wifi-connected-status{display:flex;justify-content:center;align-items:center;margin-right:1em}div.card.wifi-info #wifi-connected-status #wifi-connected-check{font-size:2em}div.card.wifi-info #wifi-connected-info{display:flex;flex-direction:column}div.card.wifi-info #wifi-connected-info .wifi-name{font-size:1.3em;font-weight:700}div.card.wifi-info #wifi-connected-info .wifi-ip{font-size:1em;font-weight:100;color:var(--darkened-font)}div.card table{border:none;width:100%;font-size:1em}div.card table td{border-bottom:1px solid var(--tertiary-bg-color);padding:.5em 0}.motor-info table td,th{text-align:left;width:33%}.th-info table td,th{text-align:left;width:33%}.motor-info table thead{text-align:left;font-size:.8em}.motor-info td.motor-name{font-size:1.1em}.motor-info td.motor-th,td.motor-state{font-size:.9em;color:var(--darkened-font)}.th-info table thead{text-align:left;font-size:.8em}.th-info td.th-name{font-size:1.1em}.th-info td.th-temperature,td.th-setpoint{font-size:.9em;color:var(--darkened-font)}.motor-info{text-align:center}.motor-info-state{text-align:center;font-size:1.5em;text-transform:uppercase;padding:.7em;font-weight:700;color:var(--robot-red-color-light)}.motor-info-state small{text-transform:none;color:var(--darkened-font);font-size:.7em;margin-right:.5em;font-weight:100}.card.motor-info h2{font-size:1.5em;font-weight:700;margin:0;padding:0;margin-bottom:10px}.card.motor-info.change-confirm{animation:fadeOutConfirm 2s forwards}@keyframes fadeOutConfirm{0%{background-color:auto}10%{background-color:green}100%{background-color:auto}}.th-select-container{position:relative;max-width:30em;width:100%;margin:auto}div.card.wifi-info .wifi-name{font-size:1.3em;font-weight:700}#wifi-connected{display:flex}#wifi-connected .conn-icon{display:flex;justify-content:center;align-items:center;margin-right:1em}#wifi-connected-check{font-size:2em;font-weight:700}#wifi-connected .conn-name{display:flex;flex-direction:column}#wifi-actions-container{margin-left:auto;display:flex;align-items:center;gap:1em}#wifi-actions-container button{font-size:.8em}#av-networks{margin-top:1em;display:flex;justify-content:space-between}#wifi-refresh-btn{margin:1em 0;font-size:.8em;padding:.7em;background-color:var(--tertiary-bg-color)}.card.wifi-select{display:flex}div.card.wifi-info .wifi-ip{font-size:1em;font-weight:100;color:var(--darkened-font)}.wifi-select td.connect{text-align:right}#wifi-do-connect{text-align:center;display:none;position:fixed;top:0;height:100vh;left:0;right:0;z-index:100}#wifi-do-connect button{margin-top:1em;width:100%;max-width:300px}#wifi-do-connect .password-input{background-color:var(--main-bg-color);border:none;padding:1em;width:100%;max-width:300px;color:#fff;font-size:1.2em}.available-connect-btn{background-color:inherit;box-shadow:none;border:0;color:var(--robot-red-color-light);font-weight:700;font-size:1em}.available-connect-btn:hover{color:#fff}main#test-container h2{font-size:1.4em;font-weight:700}main#test-container .flex-form{display:flex;align-items:center}main#test-container .flex-form div{margin:.4em 0}main#test-container .flex-form div:first-of-type{width:15em}main#test-container input{border:none;background-color:var(--tertiary-bg-color);color:#fff;font-size:1.1em;font-weight:700;padding:.3em;border-radius:.1em}main#test-container input:disabled{background-color:var(--secondary-bg-color);color:var(--tertiary-bg-color);cursor:not-allowed}main#test-container .flex-form button{font-size:1em;font-weight:600}