/* PhantomNode Chat — оформление Element Web: стеклянная авторизация + своя приветственная страница. */
@font-face { font-family: "Space Grotesk"; font-weight: 400 700; font-display: swap;
             src: url("/phantom-theme/fonts/space-grotesk.woff2") format("woff2"); }
@font-face { font-family: "JetBrains Mono"; font-weight: 300 500; font-display: swap;
             src: url("/phantom-theme/fonts/jetbrains-mono.woff2") format("woff2"); }

/* --- экран авторизации: стекло на мягком фоне --- */
.mx_AuthPage { background: #0b0d0c url("/phantom-theme/bg.svg") center / cover no-repeat fixed !important; }
.mx_AuthPage_modal {
    background: linear-gradient(160deg, rgba(255,255,255,0.09), rgba(255,255,255,0.03)) !important;
    border: 1px solid rgba(255,255,255,0.12) !important;
    border-radius: 24px !important;
    backdrop-filter: blur(28px) saturate(140%) !important;
    -webkit-backdrop-filter: blur(28px) saturate(140%) !important;
    box-shadow: 0 20px 60px rgba(0,0,0,0.35), inset 0 1px 0 rgba(255,255,255,0.10) !important;
    overflow: hidden;
}
.mx_AuthPage_modalBlur { display: none !important; }
.mx_AuthPage_modalContent, .mx_AuthPage_modalContent > [class^="_glass_"], .mx_AuthPage_modalContent > [class*=" _glass_"] {
    background: transparent !important; border: none !important; box-shadow: none !important; padding: 0 !important;
}
.mx_AuthFooter { display: none !important; }          /* «На технологии Matrix» */
.mx_AuthHeaderLogo img { max-width: 220px; }

/* --- приветственная страница (Element вычищает её стили, поэтому оформляем отсюда) --- */
.mx_WelcomePage_body > div {
    display: flex; flex-direction: column; align-items: center; text-align: center;
    padding: 44px 34px 26px;
    font-family: "Segoe UI Variable Text", "Segoe UI", Inter, system-ui, sans-serif;
}
.mx_WelcomePage_body > div > div:first-child {       /* ● PRIVATE CHAT */
    display: inline-flex; align-items: center; gap: 8px; padding: 5px 12px; margin-bottom: 20px;
    border: 1px solid rgba(255,255,255,.12); border-radius: 999px; background: rgba(255,255,255,.04);
    font-family: "JetBrains Mono", monospace; font-size: 10px; letter-spacing: 2px; text-transform: uppercase; color: #a7aeaa;
}
.mx_WelcomePage_body > div > div:first-child i {
    display: inline-block; width: 6px; height: 6px; border-radius: 50%;
    background: #c8ff00; opacity: .85; box-shadow: 0 0 10px rgba(200,255,0,.6);
}
.mx_WelcomePage_body h1 {
    font-family: "Space Grotesk", sans-serif !important; font-weight: 700 !important; font-size: 44px !important;
    letter-spacing: -1.5px; line-height: 1; color: #ececec !important; margin: 0 0 12px !important;
}
.mx_WelcomePage_body h1 span { color: #c8ff00; opacity: .9; }
.mx_WelcomePage_body p { color: #a7aeaa !important; font-size: 14px; margin: 0 0 30px !important; }
.mx_WelcomePage_body a[href="#/login"] {
    display: block; width: 100%; max-width: 300px; box-sizing: border-box; padding: 13px 18px; border-radius: 12px;
    text-decoration: none !important; font-size: 15px; font-weight: 600; color: #f2ffe0 !important;
    background: linear-gradient(180deg, rgba(200,255,0,.20), rgba(200,255,0,.10));
    border: 1px solid rgba(200,255,0,.32); transition: background .2s, box-shadow .2s;
}
.mx_WelcomePage_body a[href="#/login"]:hover {
    background: linear-gradient(180deg, rgba(200,255,0,.28), rgba(200,255,0,.15));
    box-shadow: 0 6px 24px rgba(200,255,0,.12);
}
.mx_WelcomePage_body > div > div:nth-last-child(2) { margin-top: 18px; color: #6f7773; font-size: 12px; }
.mx_WelcomePage_body > div > div:last-child {
    margin-top: 26px; color: rgba(255,255,255,.28); font-size: 11px; letter-spacing: 1px; font-family: "JetBrains Mono", monospace;
}
.mx_AuthBody_language { opacity: .6; }

/* --- телефон --- */
@media (max-width: 600px) {
    .mx_AuthPage {
        display: flex !important; align-items: center !important; justify-content: center !important;
        min-height: 100vh; min-height: 100dvh; padding: 16px !important; box-sizing: border-box !important;
    }
    .mx_AuthPage_modal {
        width: 100% !important; max-width: 440px !important; margin: 0 auto !important;
        border-radius: 22px !important;
    }
    .mx_AuthPage_modalContent, .mx_AuthPage_modalContent > div, .mx_Welcome, .mx_AuthBody {
        width: 100% !important; min-width: 0 !important; max-width: 100% !important; box-sizing: border-box !important;
    }
    .mx_Welcome { padding: 18px 14px 10px !important; }
    .mx_WelcomePage_body > div { padding: 22px 6px 14px; }
    .mx_WelcomePage_body h1 { font-size: 38px !important; }
    .mx_WelcomePage_body a[href="#/login"] { max-width: none; padding: 15px 18px; font-size: 16px; }
}