html,body{background-color:#e0e0e0;min-height:100%;margin:0;padding:0;overflow:hidden}body{justify-content:center;align-items:center;font-family:Roboto;display:flex}#root{background-color:#f5f5f5;flex-direction:column;align-items:center;width:100%;max-width:450px;height:100vh;display:flex;position:relative;overflow:hidden auto;box-shadow:0 0 20px #0003}@media (width<=768px){#root{height:100vh;box-shadow:none}}.app-wrapper{flex-direction:column;align-items:center;display:flex}.menu-wrapper{z-index:1000;box-sizing:border-box;background-color:#f5f5f5;border-bottom:1px solid #d3d3d3;width:100%;padding:10px 0;position:sticky;top:0}.menu-row{box-sizing:border-box;justify-content:space-between;align-items:center;width:400px;padding:0 16px;display:flex}.menu-title{white-space:nowrap;margin:0;font-size:32px;font-weight:600}.menu-icon-right{border-radius:10px;justify-content:flex-end;align-items:center;padding:5px;display:flex}.menu-icon-right:active{background-color:#d3d3d3}.menu-button-icon{font-size:40px!important}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}@keyframes slideIn{0%{opacity:0;transform:translate(-50%,-60%)}to{opacity:1;transform:translate(-50%,-50%)}}@keyframes pulse{0%{transform:scale(1)}50%{transform:scale(1.1)}to{transform:scale(1)}}.footer-wrapper{box-sizing:border-box;background-color:#f5f5f5;border-top:2px solid #d3d3d3;justify-content:space-between;align-items:center;width:100%;max-width:410px;height:60px;margin:0 20px;padding:10px 40px;display:flex;position:fixed;bottom:0}.footer-button-icon{font-size:40px!important}.footer-button-inactive{border-radius:10px;padding:5px 10px}.footer-button-inactive:active{box-shadow:2px 2px 10px #d3d3d3}.footer-button-active{background-color:#e8e8e8;border-radius:10px;padding:5px 10px;box-shadow:2px 2px 10px #d3d3d3}.startpage-wrapper{flex-direction:column;width:100%;display:flex}.startpage-title{margin:20px 10px;font-size:24px}.tank-display-wrapper{border:2px solid #000;border-radius:5px;flex-direction:column;display:flex}.td-tank-name{margin:20px 0 0 20px;font-size:16px;font-weight:700}.td-info-wrapper{flex-direction:column;margin:5px 10px;display:flex}.td-info{margin:4px 10px}.td-bar-background{background-color:gray;width:90%;height:50px;margin:10px 5%}.td-bar-progress{background-color:green}.logout-overlay{z-index:9999;-webkit-backdrop-filter:blur(3px);backdrop-filter:blur(3px);background:#0009;justify-content:center;align-items:center;width:100%;height:100vh;animation:.3s ease-out fadeIn;display:flex;position:absolute;top:0;left:0}.logout-content{text-align:center;-webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px);background:#fff;border:1px solid #0000000d;border-radius:20px;flex-direction:column;width:80%;height:auto;padding:30px 25px;animation:.4s cubic-bezier(.175,.885,.32,1.275) slideIn;display:flex;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);box-shadow:0 20px 50px #0000004d}.logout-content-icon{color:#ff4757;align-self:center;margin:15px 0;font-size:60px;animation:2s infinite pulse}.logout-content-title{color:#333;margin:10px 0;font-size:22px;font-weight:700;line-height:1.3}.logout-content-text{color:#666;margin:20px 0;font-size:16px;font-weight:400;line-height:1.6}.logout-buttons{flex-flow:wrap;justify-content:center;gap:15px;margin-top:25px;display:flex}.logout-cancel-btn{cursor:pointer;color:#1c2a5d;background-color:#f6f0f5;border:2px solid #1c2a5d;border-radius:12px;justify-content:center;align-items:center;width:140px;height:45px;font-size:16px;font-weight:600;transition:all .3s;display:flex;box-shadow:0 4px 10px #1c2a5d26}.logout-cancel-btn:hover{background-color:#e9d7e9;transform:translateY(-2px);box-shadow:0 6px 15px #1c2a5d33}.logout-send-btn{color:#fff;cursor:pointer;background-color:#ff4757;border:2px solid #ff4757;border-radius:12px;justify-content:center;align-items:center;width:140px;height:45px;font-size:16px;font-weight:600;transition:all .3s;display:flex;box-shadow:0 4px 10px #ff475733}.logout-send-btn:hover{background-color:#ff2e43;transform:translateY(-2px);box-shadow:0 6px 15px #ff47574d}.login-wrapper{box-sizing:border-box;flex-direction:column;align-items:center;width:min(65%,520px);height:100%;margin:0 auto;display:flex}.login-wrapper form{flex-direction:column;width:100%;display:flex}.login-wrapper form label{padding-left:5px;font-weight:700}.login-wrapper form input{box-sizing:border-box;border:1px solid #1c2a5d;border-radius:4px;width:100%;height:40px;margin-top:10px;margin-bottom:40px;padding:0 14px;font-size:16px}.input-box,#login-password-box{width:100%}#login-password-user-input{align-items:center;width:100%;margin-top:10px;margin-bottom:10px;display:flex;position:relative}#login-password-user-input input{box-sizing:border-box;border:1px solid #1c2a5d;border-radius:4px;width:90%;height:40px;margin:0;padding:0 14px;font-size:16px}#login-visible-password-button{cursor:pointer;z-index:2;color:#2a4252;justify-content:center;align-items:center;line-height:1;display:flex;position:absolute;top:50%;left:280px;transform:translateY(-50%)}#login-visible-password-button svg{pointer-events:none}.login-button{cursor:pointer;box-sizing:border-box;border:1px solid #95ba85;border-radius:6px;justify-content:center;align-items:center;width:100%;height:65px;margin:60px 0 20px;font-size:24px;font-weight:600;display:flex;box-shadow:5px 5px 5px #d3d3d3}#login-signin{background-color:#95ba85}#login-signin:active{background-color:#6e8963}#login-logo{width:80%;margin-top:10vh;margin-bottom:100px;display:block}#login-password-reset{color:gray;margin:8px 0 0 auto;font-size:16px;text-decoration:none;display:block}#login-password-reset:hover{text-decoration:underline}#login-accountinfo-text{color:#2a4252;text-align:center;margin:auto 0 40px;font-size:16px}#login-agb-text{color:#2a4252;text-align:center;margin:auto 0 40px;font-size:20px}.login-wrapper form input:focus,#login-password-user-input input:focus{outline:none;box-shadow:0 0 0 3px #1c2a5d2e}@media (width<=768px){.login-wrapper{width:90%}#login-logo{width:85%;margin-bottom:60px}.login-button{height:56px;font-size:20px}#login-agb-text{font-size:16px}}