.menu-list {
    padding: 15px;
}

.modal:not(.opened) {
    transform: translateY(100%);
}

.modal-background {
    position: fixed;
    top: 0;
    left: 0;
    width: 100vw;
    height: 100vh;
    z-index: 2297;
    background: rgba(var(--mdui-color-scrim),.4);
}

body:not(:has(.modal.opened)) .modal-background {
    display: none;
}

.modal {
    position: fixed;
    z-index: 2298;
}

.full-screen-modal {
    top: 0;
    left: 0;
    height: 100vh;
    width: 100vw;
    background: rgb(var(--mdui-color-surface));
}

.bottom-panel-modal {
    position: fixed;
    bottom: 0;
    left: 0;
    width: 100%;
    border-radius: 1rem 1rem 0 0;
    transition: transform 0.3s;
}

.power-up-modal {
    background: #3a0961 !important;
}

.shop-modal {
    background: #3d6abb !important;
}

.bottom-panel-modal > div {
    padding: 15px;
}

.start mdui-button, .bottom-panel-modal mdui-button {
    width: 100%;
}

.full-screen-modal > .modal-content {
    width: 100%;
    height: calc(100vh - 4rem);
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
}

.add-tracker-modal .modal-content > * {
    width: calc(80% - 40px);
}

.add-tracker-modal .modal-content .qr {
    width: min-content;
    padding: 20px;
    background: white;
    border-radius: 0.5rem;
    margin-bottom: 1rem;
}

.add-tracker-modal .modal-content .code {
    font-size: var(--mdui-typescale-title-large-size);
    text-align: center;
    padding: 0.5rem;
}

.add-tracker-modal.loading > .modal-content > *:not(mdui-linear-progress) {
    display: none;
}

.add-tracker-modal:not(.loading) mdui-linear-progress {
    display: none;
}

.profile .name {
    display: flex;
    align-items: center;
    gap: 1rem;
}