body {
                margin: 0;
                font-family: 'Inter', sans-serif;
                background: radial-gradient(circle at top, #1a1a1d, #0b0b0d);
                color: #fff;
                display: flex;
                justify-content: center;
                align-items: center;
                height: 100vh;
            }

            .container {
                width: 380px;
                padding: 30px;
                border-radius: 16px;
                background: rgba(20,20,20,0.6);
                backdrop-filter: blur(12px);
                border: 1px solid rgba(255,255,255,0.05);
                box-shadow: 0 10px 40px rgba(0,0,0,0.6);
            }

            /* Logo */
            .logo-container {
                display: flex;
                justify-content: center;
                margin-bottom: 10px;
            }

            .logo-img {
                width: 70px;
                height: 70px;
                border-radius: 50%;
            }

            /* Title */
            .title-small {
                text-align: center;
                color: #aaa;
                margin-bottom: 5px;
            }

            .title {
                text-align: center;
                font-size: 26px;
                font-weight: 600;
                margin-bottom: 25px;
            }

            /* Input */
            .input-box {
                position: relative;
                margin-bottom: 20px;
            }

            .input {
                width: 100%;
                padding: 14px;
                border-radius: 12px;
                border: 1px solid #262626;
                background: transparent;
                color: #fff;
                outline: none;
            }

            .input:focus {
                border-color: #6366f1;
                box-shadow: 0 0 0 1px #6366f1;
            }

            .input-box label {
                position: absolute;
                left: 14px;
                top: 14px;
                color: #888;
                font-size: 13px;
                transition: 0.2s;
            }

            .input:focus + label,
            .input:not(:placeholder-shown) + label {
                top: -8px;
                left: 10px;
                font-size: 11px;
                color: #6366f1;
                background: #0b0b0d;
                padding: 0 5px;
            }

            /* Password */
            .password-wrapper {
                position: relative;
            }

            .password-wrapper i {
                position: absolute;
                right: 12px;
                top: 50%;
                transform: translateY(-50%);
                cursor: pointer;
                color: #777;
            }

            /* Button */
            .register-btn {
                width: 100%;
                padding: 14px;
                border-radius: 12px;
                border: none;
                background: linear-gradient(135deg, #6366f1, #4f46e5);
                color: #fff;
                font-weight: 500;
                cursor: pointer;
            }

            .register-btn:disabled {
                background: #444;
            }

            /* Footer */
            .footer {
                text-align: center;
                margin-top: 15px;
                color: #aaa;
            }

            .footer a {
                color: #fff;
                text-decoration: underline;
            }

            .logo-img {
                width: 70px;
                height: 70px;
                border-radius: 50%;
                box-shadow: 0 0 20px rgba(255, 215, 0, 0.3);
                transition: 0.3s;
            }

            .logo-img:hover {
                transform: scale(1.05);
                box-shadow: 0 0 30px rgba(255, 215, 0, 0.6);
            }
            img.logo-img {
                display: block;
                margin: 0 auto 10px;
            }