/* ══════════════════════════════════════════════════════
   MOBILE LOCK
   - tidak bisa zoom (pinch / double-tap zoom dikunci lewat
     meta viewport di index.html + touch-action di sini)
   - tidak bisa geser kiri/kanan, hanya scroll naik-turun
══════════════════════════════════════════════════════ */
html {
    width: 100%;
    overflow-x: hidden;
    touch-action: pan-y;
    -ms-touch-action: pan-y;
    overscroll-behavior-x: none;
}

html, body {
    max-width: 100vw;
}

/* Animasi masuk dari atas */
@keyframes moveTitle {
    0% { transform: translateY(-300px); opacity: 0; }
    100% { transform: translateY(0); opacity: 1; }
}

/* Animasi mengayun (bobbing) */
@keyframes bob {
    0%, 100% { transform: translateY(0px); }
    50% { transform: translateY(15px); }
}

@keyframes ticker {
    0% { transform: translateX(0); }
    100% { transform: translateX(-50%); }
}

.mxps-container {
    position: relative;
    width: min(420px, 78vw);
    margin: 0 auto;
    animation: moveTitle 1s ease-out forwards;
}

.mxps-logo {
    display: block;
    width: 100%;
    height: auto;
    animation: bob 1.5s ease-in-out infinite;
}

body {
    background-color: #0a0202;
    color: #f0d0d0;
    text-shadow: 0 0 10px rgba(255, 0, 0, 0.5);
    font-family: 'Rajdhani', sans-serif;
    margin: 0;
    min-height: 100vh;
    position: relative;
    overflow-x: hidden;
    touch-action: pan-y;
    -ms-touch-action: pan-y;
    overscroll-behavior-x: none;
    -webkit-text-size-adjust: 100%;
    text-size-adjust: 100%;
}

body::before {
    content: "";
    position: fixed;
    inset: 0;

    background-image: url('mars.png');
    background-size: cover;
    background-position: center bottom;
    background-repeat: no-repeat;

    z-index: -1;

    transition: all 0.4s ease;
}

body.scrolled::before {
    filter: blur(15px) brightness(0.6);
    transform: scale(1.08);
}

/* Gaya Link Dasar */
.link-mps {
    color: #ff3333;          /* Warna merah terang khas growtopia.id */
    font-weight: 800;        /* Sangat tebal */
    text-decoration: none;   /* Menghapus garis bawah standar */
    transition: color 0.2s ease-in-out; /* Efek transisi halus saat disentuh */
    word-break: break-word;
}

/* Gaya saat disentuh / hover (desktop) */
.link-mps:hover,
.link-mps:active {
    color: #ff6666;          /* Merah yang sedikit lebih terang */
    text-decoration: underline; /* Muncul garis bawah saat disentuh */
}