@font-face {
            font-family: 'ConsolasCustom';
            src: url('https://soctrungkien.github.io/KeyGen/consolas.ttf') format('truetype');
            font-display: swap;     
        }
        @keyframes scaleIn { 0% { transform: scale(0.85); opacity: 0; } 100% { transform: scale(1); opacity: 1; } }
        .animate-scaleIn { animation: scaleIn 0.18s cubic-bezier(.4,2,.6,1) 1; }
        body, html { font-family: 'DIN Next Rounded', Nunito, Arial, sans-serif; }
        .key-text { font-family: 'ConsolasCustom', Consolas, monospace, Sono !important; }
        select {
            -webkit-appearance: none;
            -moz-appearance: none;
            appearance: none;
            background-color: #eef2ff;
            color: #3730a3;
            font-weight: 600;
            border: 2px solid #a5b4fc;
            border-radius: 0.75rem;
            box-shadow: 0 2px 8px 0 #6366f140;
            padding-right: 2.5rem;
            transition: border-color 0.2s, background 0.2s;
        }
        select:focus {
            border-color: #6366f1;
            background: #e0e7ff;
            outline: none;
        }
        option {
            background: #eef2ff;
            color: #3730a3;
            font-weight: 600;
        }
        /* Ẩn mũi tên tăng/giảm trên Chrome, Safari, Edge */
        input[type=number]::-webkit-inner-spin-button,
        input[type=number]::-webkit-outer-spin-button {
          -webkit-appearance: none;
          margin: 0;
        }
        .toggle-checkbox:checked + label .toggle-dot {
            transform: translateX(1.25rem);
            background: #fff;
            border: 2px solid #6366f1;
        }
        .toggle-checkbox + label .toggle-dot {
            background: #fff;
            border: 2px solid #a5b4fc;
        }
        .toggle-checkbox:checked + label span.w-10 {
            background: #6366f1;
        }
        #customToggle input:checked ~ div:last-child {
            box-shadow: 0 2px 8px 0 #6366f1a0;
        }