* { box-sizing: border-box; margin: 0; padding: 0; -webkit-tap-highlight-color: transparent; }

html, body { height: 100%; }

body { 

    font-family: system-ui, -apple-system, sans-serif; 

    background-color: var(--bg-main); color: var(--text-main);

    display: flex; flex-direction: column; overflow-x: hidden;

}
body.light-theme { background: #eef2f7; }

@keyframes shake {

    0% { transform: translateX(0); }

    25% { transform: translateX(-2px); }

    75% { transform: translateX(2px); }

    100% { transform: translateX(0); }

}
.blink {
    animation: blink 1s infinite ease-in-out;
}

@keyframes slideDown { from { transform: translateY(-20px); opacity: 0; } to { transform: translateY(0); opacity: 1; } }
@keyframes spin { 0% { transform: rotate(0deg); } 100% { transform: rotate(360deg); } }

* {
    touch-action: manipulation;

    -webkit-user-select: none; /* Khóa bôi đen text */

    user-select: none;

    -webkit-tap-highlight-color: transparent; /* Xóa vùng sáng khi bấm trên mobile */

}

 .modal {display: none; /* Mặc định ẩn hẳn, không sợ bị lòi ra ở Safari */ position: fixed; top: 0; left: 0; width: 100%; height: 100%; background: rgba(0, 0, 0, 0.5); z-index: 999; justify-content: center; align-items: center; opacity: 0; visibility: hidden; transition: opacity 0.3s ease, visibility 0.3s ease; }



/*@@@@@@@@@@@@@@@                            PANEL                                  @@@@@@@@@@@@@@@@@@@@@@@*/

