:root{--color-button:#455471;--color-button-hovered:#4f81b9;--color-text:#2f3b52;--color-text-white:#fff;--color-menu-background:#2f3b52;--color-menu-background-footer:#2c364b;--color-menu-text:#98a7b9;--color-menu-border:#39465c;--color-text-screen:#7bc14e;--color-menu-item-selected-background:#232e44;--color-menu-dropdown-background:#374869;--color-menu-children-background:#293449;--color-border:#e2e8ed;--color-background-body:#f9f9fc;--color-background-body-group:#fff;--font-size-small:12px;--font-size-medium:16px;--font-size-large:30px;font-family:Roboto,sans-serif;font-size:16px}html,body{width:100%;height:100%}body,p{margin:0}.x-not-found{background-image:url(/assets/not-found-BuSiL-xF.jpg);background-position:top;background-repeat:no-repeat;background-size:cover;flex:1;justify-content:center;align-items:center;display:flex}.x-not-found .x-not-found-wrapper{position:absolute;bottom:50px}.x-not-found .x-not-found-wrapper .x-not-found-link{color:var(--color-text-white);background:var(--color-button);font-size:var(--font-size-medium);border-radius:12px;padding:8px 16px;text-decoration:none}.x-not-found .x-not-found-wrapper .x-not-found-link:hover{background:var(--color-button-hovered)}.x-not-found .x-not-found-wrapper .x-not-found-title{color:var(--color-text-white);font-weight:700;font-size:var(--font-size-large);margin-bottom:24px}.x-main-container{text-align:center;box-sizing:border-box;max-width:100%;height:100%;margin:0 auto;display:flex}.x-main-container .x-main-left-menu{background-color:var(--color-menu-background);flex-direction:column;width:210px;height:100%;display:flex}.x-main-container .x-main-left-menu .x-main-left-menu-header{text-align:left;border-bottom:1px solid var(--color-menu-border);font-size:var(--font-size-large);background-image:linear-gradient(to right, var(--color-text-screen) 0, var(--color-text-screen) 3ch, var(--color-text-white) 6ch);color:#0000;-webkit-background-clip:text;background-clip:text;align-items:center;gap:8px;padding:12px 8px;display:flex}.x-main-container .x-main-left-menu .x-main-left-menu-header:before{content:"";background:url(/logo.svg) 50%/contain no-repeat;width:40px;height:36px;margin-bottom:4px;display:inline-block}.x-main-container .x-main-left-menu .x-main-left-menu-content{flex:1;min-height:0;overflow-y:auto}.x-main-container .x-main-left-menu .x-main-left-menu-footer{background-color:var(--color-menu-background-footer);padding:16px}.x-main-container .x-main-left-menu .x-main-left-menu-language{align-items:center;display:flex}.x-main-container .x-main-left-menu .x-main-left-menu-language .x-main-left-menu-title{text-transform:capitalize;color:var(--color-menu-text);font-size:var(--font-size-small)}.x-main-container .x-main-left-menu .x-main-left-menu-language .x-main-left-menu-dropdown{color:var(--color-text-white);background-color:var(--color-menu-dropdown-background);border:none;border-radius:8px;flex:1;margin-left:8px;padding:6px}.x-main-container .x-main-left-menu .x-main-left-menu-item{cursor:pointer;color:var(--color-menu-text);font-size:var(--font-size-small);text-align:left;border-radius:16px;align-items:center;gap:0;padding:6px 8px 6px 2px;line-height:20px;text-decoration:none;display:flex}.x-main-container .x-main-left-menu .x-main-left-menu-item:hover{color:var(--color-text-white)!important}.x-main-container .x-main-left-menu .x-main-left-menu-item.active{color:var(--color-text-screen);background-color:var(--color-menu-item-selected-background)}.x-main-container .x-main-left-menu .x-main-menu-group-button{cursor:pointer;width:100%;height:36px;color:var(--color-menu-text);background-color:#2f3b52;border:none;border-radius:0;align-items:center;padding:8px 16px;display:flex}.x-main-container .x-main-left-menu .x-main-menu-group-button:hover{color:var(--color-text-white)!important}.x-main-container .x-main-left-menu .x-main-menu-group-button.active{background-color:var(--color-menu-item-selected-background);color:var(--color-text-screen)}.x-main-container .x-main-left-menu .x-main-menu-group-button .x-main-menu-group-button-content{flex:1;align-items:center;gap:12px;display:flex}.x-main-container .x-main-left-menu .x-main-menu-children{background-color:var(--color-menu-children-background);flex-direction:column;gap:8px;padding:8px 12px;display:flex}.x-main-container .x-main-body{background-color:var(--color-background-body);flex:1;height:100%}.x-main-container .x-main-body-group{background-color:var(--color-background-body-group);border-radius:12px;margin:12px;box-shadow:0 0 12px #0000001f}.x-keyboard{-webkit-user-select:none;user-select:none;outline:none;padding:20px}.x-keyboard .keyboard-row{gap:10px;margin-bottom:10px;display:flex}.x-keyboard .keyboard-row .keyboard-key{border:1px solid var(--color-border);border-radius:12px;flex:1;justify-content:center;align-items:center;height:50px;font-weight:700;transition:all .12s;display:flex}.x-keyboard .keyboard-row .keyboard-key.pressed{color:#fff;border-color:var(--color-button);background:linear-gradient(135deg, var(--color-button), var(--color-button-hovered));transform:translateY(2px)}