/*
 * Rampage — tema Matrix (html.matrix)
 * Carregado por último no <head>; só age quando html tem a classe .matrix.
 */

html.matrix {
    --mx-green: #00ff41;
    --mx-bright: #b6ffc4;
    --mx-dim: #1fbf4a;
    --mx-faint: #0f7a2e;
    --mx-line: rgba(0, 255, 65, .35);
    --mx-line-soft: rgba(0, 255, 65, .18);
    --mx-panel: rgba(0, 8, 2, .86);
    --mx-panel-2: rgba(0, 20, 6, .9);
    --mx-glow: 0 0 6px rgba(0, 255, 65, .45);
    --mx-font: ui-monospace, "Cascadia Mono", "SF Mono", Menlo, Consolas, "Liberation Mono", "Courier New", monospace, "Apple Color Emoji", "Segoe UI Emoji", "Noto Color Emoji";
    --mx-danger: #ff4d4d;

    color-scheme: dark;
    background: #000;
    scrollbar-color: var(--mx-faint) #000;
}

html.matrix body {
    background: #000 !important;
    color: var(--mx-green);
    font-family: var(--mx-font) !important;
    text-shadow: 0 0 5px rgba(0, 255, 65, .3);
    caret-color: var(--mx-green);
}

html.matrix *,
html.matrix *::before,
html.matrix *::after {
    font-family: var(--mx-font) !important;
}

/* ícones do Font Awesome continuam com a fonte deles (inclusive no ::before, onde o ícone é desenhado) */
html.matrix .fa,
html.matrix [class^="fa-"],
html.matrix [class*=" fa-"],
html.matrix .fa::before,
html.matrix [class^="fa-"]::before,
html.matrix [class*=" fa-"]::before {
    font-family: var(--_fa-family, "Font Awesome 7 Free") !important;
}

html.matrix ::selection {
    background: var(--mx-green);
    color: #000;
    text-shadow: none;
}

/* ---------- fundo: chuva de código + CRT ---------- */

html.matrix .app-backdrop {
    display: none !important;
}

.mx-rain {
    position: fixed;
    inset: 0;
    z-index: 0;
    width: 100vw;
    height: 100vh;
    opacity: .28;
    pointer-events: none;
}

/* linhas de varredura + vinheta de monitor */
html.matrix body::after {
    content: '';
    position: fixed;
    inset: 0;
    z-index: 200;
    pointer-events: none;
    background:
        repeating-linear-gradient(180deg, rgba(0, 0, 0, 0) 0 2px, rgba(0, 0, 0, .22) 2px 3px),
        radial-gradient(ellipse at center, rgba(0, 0, 0, 0) 60%, rgba(0, 0, 0, .55) 100%);
}

/* ---------- genéricos (Tailwind e afins) ---------- */

html.matrix [class*="bg-white"],
html.matrix [class*="bg-slate-"],
html.matrix [class*="bg-gray-"],
html.matrix [class*="bg-zinc-"],
html.matrix [class*="bg-neutral-"],
html.matrix .card,
html.matrix .panel,
html.matrix .container-box {
    background-color: var(--mx-panel) !important;
    background-image: none !important;
}

html.matrix [class*="bg-indigo-"],
html.matrix [class*="bg-blue-"],
html.matrix [class*="bg-green-"],
html.matrix [class*="bg-emerald-"],
html.matrix [class*="bg-teal-"],
html.matrix [class*="bg-sky-"],
html.matrix [class*="bg-amber-"],
html.matrix [class*="bg-orange-"],
html.matrix [class*="bg-yellow-"],
html.matrix [class*="bg-purple-"],
html.matrix [class*="bg-violet-"] {
    background: transparent !important;
    color: var(--mx-green) !important;
    box-shadow: inset 0 0 0 1px var(--mx-green) !important;
}

html.matrix [class*="bg-red-"],
html.matrix [class*="bg-rose-"] {
    background: transparent !important;
    color: var(--mx-danger) !important;
    box-shadow: inset 0 0 0 1px var(--mx-danger) !important;
}

html.matrix [class*="text-slate-"],
html.matrix [class*="text-gray-"],
html.matrix [class*="text-zinc-"],
html.matrix [class*="text-neutral-"],
html.matrix [class*="text-blue-"],
html.matrix [class*="text-indigo-"],
html.matrix [class*="text-emerald-"],
html.matrix [class*="text-green-"],
html.matrix [class*="text-amber-"],
html.matrix h1, html.matrix h2, html.matrix h3, html.matrix h4, html.matrix h5, html.matrix h6,
html.matrix p, html.matrix span, html.matrix label, html.matrix li, html.matrix td, html.matrix th,
html.matrix a {
    color: var(--mx-green) !important;
}

html.matrix [class*="text-red-"],
html.matrix [class*="text-rose-"] {
    color: var(--mx-danger) !important;
}

html.matrix [class*="border"],
html.matrix table, html.matrix th, html.matrix td, html.matrix hr {
    border-color: var(--mx-line) !important;
}

html.matrix [class*="shadow"] {
    box-shadow: none !important;
}

html.matrix [class*="rounded"] {
    border-radius: 2px !important;
}

html.matrix input,
html.matrix textarea,
html.matrix select {
    background: #000 !important;
    color: var(--mx-green) !important;
    border: 1px solid var(--mx-line) !important;
    border-radius: 2px !important;
    box-shadow: none !important;
    caret-color: var(--mx-green);
}

html.matrix input::placeholder,
html.matrix textarea::placeholder {
    color: var(--mx-faint) !important;
}

html.matrix input:focus,
html.matrix textarea:focus,
html.matrix select:focus {
    outline: none !important;
    border-color: var(--mx-green) !important;
    box-shadow: 0 0 0 1px var(--mx-green), 0 0 12px rgba(0, 255, 65, .35) !important;
}

html.matrix :focus-visible {
    outline: 1px dashed var(--mx-green) !important;
    outline-offset: 3px !important;
}

html.matrix img,
html.matrix .app-topbar form button > * {
    filter: grayscale(1) sepia(1) hue-rotate(70deg) saturate(5) brightness(.9);
}

/* ---------- cabeçalho ---------- */

html.matrix .app-topbar {
    background: rgba(0, 0, 0, .9) !important;
    border-bottom: 1px solid var(--mx-line) !important;
    box-shadow: 0 1px 0 rgba(0, 255, 65, .08), 0 8px 30px -12px rgba(0, 255, 65, .15) !important;
    -webkit-backdrop-filter: none !important;
    backdrop-filter: none !important;
}

html.matrix .app-brand-mark:not(.app-brand-mark-v2) {
    background: #000 !important;
    color: var(--mx-green) !important;
    box-shadow: inset 0 0 0 1px var(--mx-green), var(--mx-glow) !important;
    border-radius: 3px !important;
}

html.matrix .app-brand-mark-v2 svg {
    filter: drop-shadow(0 0 4px rgba(0, 255, 65, .6)) !important;
}

html.matrix .app-brand-mark-v2 .rb-back,
html.matrix .app-brand-mark-v2 .rb-front path {
    fill: #000 !important;
    stroke: var(--mx-green);
    stroke-width: 1.4;
}

html.matrix .app-brand-mark-v2 .rb-paper {
    fill: var(--mx-faint) !important;
}

html.matrix .app-brand-mark-v2 .rb-front text {
    fill: var(--mx-green) !important;
    stroke: none !important;
}

html.matrix .app-brand-title {
    color: var(--mx-bright) !important;
    text-shadow: var(--mx-glow);
}

html.matrix .app-brand-subtitle {
    color: var(--mx-dim) !important;
    letter-spacing: .08em !important;
    white-space: nowrap;
}

html.matrix .app-brand-title {
    letter-spacing: .18em !important;
}

html.matrix .app-nav-link {
    white-space: nowrap;
    padding-left: .7rem !important;
    padding-right: .7rem !important;
}

html.matrix .app-nav-link,
html.matrix .app-dropdown-link,
html.matrix .app-mobile-link {
    color: var(--mx-green) !important;
    background: transparent !important;
    border-radius: 2px !important;
    box-shadow: none !important;
    transform: none !important;
}

html.matrix .app-nav-link:hover,
html.matrix .app-dropdown-link:hover,
html.matrix .app-mobile-link:hover {
    background: rgba(0, 255, 65, .1) !important;
}

/* item ativo = texto "selecionado" no terminal */
html.matrix .app-nav-link-active,
html.matrix .app-nav-link-active:hover,
html.matrix .app-dropdown-link-active,
html.matrix .app-mobile-link-active {
    background: var(--mx-green) !important;
    color: #000 !important;
    text-shadow: none !important;
}

html.matrix .app-nav-link-active *,
html.matrix .app-dropdown-link-active *,
html.matrix .app-mobile-link-active * {
    color: #000 !important;
}

html.matrix .app-dropdown-panel,
html.matrix .app-mobile-group {
    background: #000 !important;
    border: 1px solid var(--mx-line) !important;
    border-radius: 2px !important;
    box-shadow: 0 0 24px rgba(0, 255, 65, .12) !important;
    -webkit-backdrop-filter: none !important;
    backdrop-filter: none !important;
}

html.matrix .app-dropdown-icon {
    background: transparent !important;
    color: var(--mx-green) !important;
    box-shadow: inset 0 0 0 1px var(--mx-line-soft);
    border-radius: 2px !important;
}

html.matrix .app-dropdown-label,
html.matrix .app-mobile-label,
html.matrix .app-dropdown-meta {
    color: var(--mx-dim) !important;
}

html.matrix .app-dropdown-divider {
    border-color: var(--mx-line-soft) !important;
}

html.matrix .app-user-button,
html.matrix .app-icon-button,
html.matrix .app-topbar button[aria-pressed],
html.matrix .rp-help-button,
html.matrix .mx-toggle {
    background: #000 !important;
    border: 1px solid var(--mx-line) !important;
    border-radius: 2px !important;
    color: var(--mx-green) !important;
    box-shadow: none !important;
}

html.matrix .app-user-button:hover,
html.matrix .app-icon-button:hover,
html.matrix .app-topbar button[aria-pressed]:hover,
html.matrix .rp-help-button:hover {
    background: rgba(0, 255, 65, .12) !important;
}

html.matrix .app-user-avatar {
    background: #000 !important;
    color: var(--mx-green) !important;
    box-shadow: inset 0 0 0 1px var(--mx-green) !important;
    border-radius: 2px !important;
}

html.matrix .app-badge {
    background: transparent !important;
    color: var(--mx-bright) !important;
    box-shadow: inset 0 0 0 1px var(--mx-bright);
}

/* botão >_ */
.mx-toggle {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 36px;
    height: 34px;
    padding: 0;
    border: 1px solid var(--rp-help-line, rgba(148, 163, 184, .35));
    border-radius: 10px;
    background: transparent;
    color: #0a7d2c;
    font: 800 12px/1 ui-monospace, "Cascadia Mono", Consolas, "Courier New", monospace;
    letter-spacing: -.02em;
    cursor: pointer;
    transition: background-color .2s ease, transform .2s ease;
}

html.dark .mx-toggle { color: #3ddc71; }

.mx-toggle:hover { background: rgba(0, 200, 60, .1); }
.mx-toggle:active { transform: scale(.96); }
.mx-toggle:focus-visible { outline: 2px solid #1fbf4a; outline-offset: 2px; }

html.matrix .mx-toggle[aria-pressed="true"] {
    background: var(--mx-green) !important;
    color: #000 !important;
    text-shadow: none;
    box-shadow: 0 0 12px rgba(0, 255, 65, .6) !important;
}

/* ---------- página de favoritos ---------- */

html.matrix .favoritos-topbar-title {
    color: var(--mx-bright) !important;
    text-shadow: var(--mx-glow);
}

html.matrix .favoritos-topbar-title::before {
    content: '~/';
    color: var(--mx-dim);
}

html.matrix .favoritos-topbar-title::after {
    content: '_';
    margin-left: .15em;
    animation: mx-cursor 1s steps(1) infinite;
}

@keyframes mx-cursor {
    50% { opacity: 0; }
}

html.matrix .favoritos-topbar-meta,
html.matrix .favoritos-topbar-meta * {
    color: var(--mx-dim) !important;
}

/* barra de ações: [ comando ] */
html.matrix .favorites-toolbar {
    background: var(--mx-panel) !important;
    border: 1px solid var(--mx-line) !important;
    border-radius: 2px !important;
    box-shadow: none !important;
}

html.matrix .favorites-toolbar .favoritos-action-button,
html.matrix .favorites-toolbar .favoritos-action-delete,
html.matrix .favorites-toolbar > .favoritos-action-button {
    background: #000 !important;
    border: 1px solid var(--mx-line) !important;
    border-radius: 2px !important;
    color: var(--mx-green) !important;
    box-shadow: none !important;
    transition: background-color .12s linear, color .12s linear !important;
}

html.matrix .favorites-toolbar .favoritos-action-label {
    color: inherit !important;
    text-transform: uppercase;
    letter-spacing: .06em;
}

html.matrix .favorites-toolbar .favoritos-action-label::before { content: '[ '; opacity: .6; }
html.matrix .favorites-toolbar .favoritos-action-label::after { content: ' ]'; opacity: .6; }

html.matrix .favorites-toolbar .favoritos-action-icon {
    color: inherit !important;
}

html.matrix .favorites-toolbar .favoritos-action-button:hover,
html.matrix .favorites-toolbar .favoritos-mobile-icon-button-active {
    background: var(--mx-green) !important;
    color: #000 !important;
    text-shadow: none !important;
}

html.matrix .favorites-toolbar .favoritos-action-delete {
    border-color: rgba(255, 77, 77, .5) !important;
    color: var(--mx-danger) !important;
}

html.matrix .favorites-toolbar .favoritos-action-delete:hover {
    background: var(--mx-danger) !important;
    color: #000 !important;
}

html.matrix .favoritos-switch-track {
    background: #000 !important;
    box-shadow: inset 0 0 0 1px var(--mx-line);
}

html.matrix .peer:checked + .favoritos-switch-track {
    background: var(--mx-faint) !important;
}

html.matrix .favoritos-switch-thumb {
    background: var(--mx-green) !important;
    border-radius: 1px !important;
    box-shadow: var(--mx-glow) !important;
}

html.matrix .favoritos-panel-header {
    border-color: var(--mx-line-soft) !important;
}

/* pastas: diretórios de terminal (visual novo) */
html.matrix .favoritos-page.fav-v2 {
    --f-tab: var(--mx-faint);
    --f-back: #000;
    --f-front: #000;
    --f-front-hi: transparent;
    --f-edge: var(--mx-line);
    --f-shadow: 0 0 0 1px var(--mx-line-soft);
    --f-shadow-hover: 0 0 0 1px var(--mx-line), 0 0 18px rgba(0, 255, 65, .2);
    --f-title: var(--mx-bright);
    --f-meta: var(--mx-dim);
    --f-paper: #000;
    --f-paper-2: #000;
    --f-peek: var(--mx-faint);
    --f-peek-2: #0a4d1d;
    --f-paper-edge: var(--mx-line-soft);
    --f-link: var(--mx-green);
    --f-link-hover-bg: var(--mx-green);
    --f-dot: var(--mx-green);
    --f-focus: var(--mx-green);
    --u-ink: var(--mx-green);
    --u-muted: var(--mx-dim);
    --u-line: var(--mx-line);
    --u-surface: #000;
    --u-surface-2: #000;
    --u-accent: var(--mx-green);
    --u-accent-soft: rgba(0, 255, 65, .1);
    --u-danger: var(--mx-danger);
}

html.matrix .favoritos-page.fav-v2 .favoritos-group-card::before {
    border-radius: 2px 2px 0 0 !important;
    clip-path: none !important;
    box-shadow: inset 0 0 0 1px var(--mx-line);
}

html.matrix .favoritos-page.fav-v2 .favoritos-group-card::after {
    border-radius: 0 3px 3px 3px !important;
    box-shadow: inset 0 0 0 1px var(--mx-line), 0 0 14px rgba(0, 255, 65, .08) !important;
}

html.matrix .favoritos-page.fav-v2 .favoritos-group-header::after {
    border-radius: 2px !important;
    box-shadow: inset 0 0 0 1px var(--mx-line) !important;
}

html.matrix .favoritos-page.fav-v2 .favoritos-group-card-open .favoritos-group-header::after,
html.matrix .favoritos-page.fav-v2 .favoritos-group-card:hover .favoritos-group-header::after {
    box-shadow: inset 0 0 0 1px var(--mx-green), 0 0 16px rgba(0, 255, 65, .25) !important;
}

html.matrix .favoritos-page.fav-v2 .favoritos-group-title {
    color: var(--mx-bright) !important;
}

html.matrix .favoritos-page.fav-v2 .favoritos-group-title::after {
    content: '/';
    color: var(--mx-dim);
}

html.matrix .favoritos-page.fav-v2 .favoritos-group-meta {
    color: var(--mx-dim) !important;
}

html.matrix .favoritos-page.fav-v2 .fav-folder-icon-back,
html.matrix .favoritos-page.fav-v2 .fav-folder-icon-front {
    fill: #000 !important;
    stroke: var(--mx-green) !important;
    stroke-width: 1.2 !important;
}

html.matrix .favoritos-page.fav-v2 .fav-folder-icon-paper {
    fill: var(--mx-faint) !important;
}

html.matrix .favoritos-page.fav-v2 .fav-folder-icon {
    filter: drop-shadow(0 0 3px rgba(0, 255, 65, .5)) !important;
}

html.matrix .favoritos-page.fav-v2 .favoritos-links-grid {
    border-radius: 2px !important;
    box-shadow: inset 0 0 0 1px var(--mx-line-soft) !important;
}

/* link = linha de terminal com prompt */
html.matrix .favoritos-link-accent {
    width: auto !important;
    height: auto !important;
    background: none !important;
    box-shadow: none !important;
    opacity: 1 !important;
}

html.matrix .favoritos-link-accent::before {
    content: '>';
    color: var(--mx-dim);
    font-weight: 700;
}

html.matrix .favoritos-link-card {
    border-radius: 1px !important;
    background: transparent !important;
    border-color: transparent !important;
}

html.matrix .favoritos-link-card:hover {
    background: var(--mx-green) !important;
}

html.matrix .favoritos-link-card:hover *,
html.matrix .favoritos-link-card:hover .favoritos-link-accent::before {
    color: #000 !important;
    text-shadow: none !important;
}

html.matrix .favoritos-link-title {
    color: var(--mx-green) !important;
    text-decoration: none !important;
}

html.matrix .favoritos-link-action,
html.matrix .favoritos-icon-action,
html.matrix .favoritos-drag-handle {
    color: var(--mx-dim) !important;
    border-radius: 1px !important;
}

html.matrix .favoritos-link-action-danger,
html.matrix .favoritos-icon-action-danger {
    color: var(--mx-danger) !important;
}

/* pastas no visual clássico */
html.matrix .favoritos-page:not(.fav-v2) .favoritos-group-card,
html.matrix .favoritos-page:not(.fav-v2) .favoritos-folder-window {
    background: var(--mx-panel) !important;
    border: 1px solid var(--mx-line) !important;
    border-radius: 2px !important;
    box-shadow: none !important;
}

html.matrix .favoritos-page:not(.fav-v2) .favoritos-group-card::before {
    display: none;
}

html.matrix .favoritos-group-folder {
    background: transparent !important;
    color: var(--mx-green) !important;
}

/* rodapé da pasta, pasta vazia, nova pasta */
html.matrix .fav-empty {
    background: #000 !important;
    border: 1px dashed var(--mx-line) !important;
    border-radius: 2px !important;
}

html.matrix .fav-empty svg,
html.matrix .fav-empty-hint {
    color: var(--mx-dim) !important;
}

html.matrix .fav-empty-title {
    color: var(--mx-green) !important;
}

html.matrix .fav-add-link {
    background: #000 !important;
    border: 1px solid var(--mx-line) !important;
    border-radius: 2px !important;
    color: var(--mx-green) !important;
}

html.matrix .fav-add-link:hover {
    background: var(--mx-green) !important;
}

html.matrix .fav-add-link:hover * {
    color: #000 !important;
    text-shadow: none !important;
}

html.matrix .fav-new-folder,
html.matrix .fav-new-folder::before {
    background: transparent !important;
    border-color: var(--mx-line) !important;
    border-radius: 2px !important;
    color: var(--mx-green) !important;
}

html.matrix .fav-new-folder-icon {
    background: transparent !important;
    color: var(--mx-green) !important;
    box-shadow: inset 0 0 0 1px var(--mx-line);
    border-radius: 2px !important;
}

html.matrix .fav-new-folder:hover {
    background: rgba(0, 255, 65, .08) !important;
    border-color: var(--mx-green) !important;
}

/* arraste */
html.matrix .fav-drag-ghost {
    background: #000;
    color: var(--mx-green);
    border-radius: 2px;
    box-shadow: 0 0 0 1px var(--mx-green), 0 0 18px rgba(0, 255, 65, .45);
}

html.matrix .fav-drag-ghost-icon {
    background: #000;
    box-shadow: inset 0 0 0 1px var(--mx-green);
}

/* aviso (toast) */
html.matrix .fav-toast {
    background: #000;
    color: var(--mx-green);
    border: 1px solid var(--mx-green);
    border-radius: 2px;
    box-shadow: 0 0 18px rgba(0, 255, 65, .35);
}

html.matrix .fav-toast-dot {
    border-radius: 0;
    background: var(--mx-green);
    animation: mx-cursor 1s steps(1) infinite;
}

html.matrix .fav-toast.is-error { color: var(--mx-danger); border-color: var(--mx-danger); }
html.matrix .fav-toast.is-error .fav-toast-dot { background: var(--mx-danger); }

/* janelas (modais) */
html.matrix .favoritos-modal-primary,
html.matrix .favoritos-modal-secondary {
    background: #000 !important;
    color: var(--mx-green) !important;
    border: 1px solid var(--mx-line) !important;
    border-radius: 2px !important;
    box-shadow: none !important;
}

html.matrix .favoritos-modal-primary {
    border-color: var(--mx-green) !important;
}

html.matrix .favoritos-modal-primary:hover,
html.matrix .favoritos-modal-secondary:hover {
    background: var(--mx-green) !important;
    color: #000 !important;
    text-shadow: none !important;
}

html.matrix [class*="bg-slate-950/"] {
    background: rgba(0, 0, 0, .8) !important;
}

html.matrix .fav-form-error { color: var(--mx-danger) !important; }

/* ajuda */
html.matrix {
    --rp-help-ink: var(--mx-bright);
    --rp-help-muted: var(--mx-green);
    --rp-help-line: var(--mx-line);
    --rp-help-surface: #000;
    --rp-help-surface-2: rgba(0, 20, 6, .6);
    --rp-help-accent: var(--mx-green);
    --rp-help-accent-soft: rgba(0, 255, 65, .1);
    --rp-help-care: var(--mx-danger);
    --rp-help-care-soft: rgba(255, 77, 77, .05);
}

html.matrix .rp-help-dialog,
html.matrix .rp-help-section,
html.matrix .rp-help-close,
html.matrix .rp-help-icon {
    border-radius: 2px !important;
}

html.matrix .rp-help-dialog {
    box-shadow: 0 0 0 1px var(--mx-green), 0 0 40px rgba(0, 255, 65, .2) !important;
}

html.matrix .rp-help-title::before {
    content: '$ man rampage';
    display: block;
    margin-bottom: .4rem;
    font-size: .75rem;
    font-weight: 400;
    color: var(--mx-dim);
}

html.matrix .rp-help-list li::before {
    content: '>';
    width: auto;
    height: auto;
    top: 0;
    background: none;
    color: var(--mx-dim);
    opacity: 1;
}

html.matrix .rp-help-list li { padding-left: 1.1rem; }

/* ---------- abertura "Wake up, Neo" ---------- */

.mx-boot {
    position: fixed;
    inset: 0;
    z-index: 300;
    display: flex;
    align-items: flex-start;
    justify-content: flex-start;
    padding: 12vh 8vw;
    background: #000;
    cursor: pointer;
    transition: opacity .45s ease;
}

.mx-boot-line {
    color: #00ff41;
    font: 400 clamp(1.1rem, 2.6vw, 1.7rem)/1.4 ui-monospace, "Cascadia Mono", Consolas, "Courier New", monospace;
    text-shadow: 0 0 8px rgba(0, 255, 65, .6);
}

.mx-boot-line::after {
    content: '█';
    margin-left: .1em;
    animation: mx-cursor 1s steps(1) infinite;
}

.mx-boot-out {
    opacity: 0;
}

@media (prefers-reduced-motion: reduce) {
    html.matrix .favoritos-topbar-title::after,
    html.matrix .fav-toast-dot,
    .mx-boot-line::after {
        animation: none;
    }
}

@media (max-width: 640px) {
    html.matrix .app-brand-subtitle {
        display: none;
    }
}

/* páginas de visitante (login, cadastro, esqueci a senha): com o formulário mais alto que a
   tela, o centro vertical cortava o topo e não deixava rolar até ele */
.mx-guest {
    align-items: flex-start !important;
    overflow: visible !important;
    padding-block: clamp(1.5rem, 6vh, 4rem);
}

@media (min-height: 60rem) {
    .mx-guest {
        align-items: center !important;
    }
}
