* { margin: 0; padding: 0; box-sizing: border-box; }
        body { font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif; background: linear-gradient(135deg, #581c87, #6b21a8, #1f2937); color: white; min-height: 100vh; }
        .container { max-width: 1200px; margin: 0 auto; padding: 0 1rem; }
        .header { position: fixed; top: 0; width: 100%; background: rgba(88, 28, 135, 0.95); backdrop-filter: blur(10px); z-index: 50; box-shadow: 0 4px 6px rgba(0, 0, 0, 0.3); }
        .card { background: rgba(107, 33, 168, 0.3); backdrop-filter: blur(10px); border-radius: 1rem; padding: 2rem; border: 1px solid rgba(168, 85, 247, 0.3); box-shadow: 0 20px 25px rgba(0, 0, 0, 0.3); transition: all 0.3s; }
        .card:hover { transform: translateY(-5px); border-color: rgba(168, 85, 247, 0.6); }
        .btn-primary { background: linear-gradient(to right, #9333ea, #a855f7); padding: 1rem 2rem; border-radius: 0.5rem; font-weight: 600; transition: all 0.3s; border: none; cursor: pointer; color: white; }
        .btn-primary:hover { background: linear-gradient(to right, #a855f7, #c084fc); transform: scale(1.05); }
        .floating-btn { position: fixed; bottom: 1.5rem; right: 1.5rem; z-index: 40; display: flex; flex-direction: column; gap: 1rem; }
        .floating-btn button { width: 60px; height: 60px; border-radius: 50%; border: none; cursor: pointer; box-shadow: 0 20px 25px rgba(0, 0, 0, 0.5); transition: all 0.3s; display: flex; align-items: center; justify-content: center; }
        .floating-btn button:hover { transform: scale(1.1); }
        .modal { display: none; position: fixed; inset: 0; background: rgba(0, 0, 0, 0.7); backdrop-filter: blur(5px); z-index: 60; align-items: center; justify-content: center; padding: 1rem; }
        .modal.active { display: flex; }
        .modal-content { background: linear-gradient(135deg, #6b21a8, #7c3aed); border-radius: 1rem; padding: 2rem; max-width: 400px; width: 100%; box-shadow: 0 25px 50px rgba(0, 0, 0, 0.5); }
        input, textarea { width: 100%; padding: 0.75rem 1rem; border-radius: 0.5rem; background: rgba(107, 33, 168, 0.5); border: 1px solid #9333ea; color: white; margin-top: 0.5rem; }
        input:focus, textarea:focus { outline: none; border-color: #a855f7; }
        input::placeholder, textarea::placeholder { color: rgba(255, 255, 255, 0.5); }
        .action-btn { background: linear-gradient(135deg, #7c3aed, #9333ea); padding: 1rem 1.5rem; border-radius: 0.75rem; font-weight: 600; transition: all 0.3s; border: none; cursor: pointer; color: white; text-align: center; display: inline-flex; align-items: center; gap: 0.5rem; justify-content: center; }
        .action-btn:hover { background: linear-gradient(135deg, #9333ea, #a855f7); transform: translateY(-3px); box-shadow: 0 10px 20px rgba(147, 51, 234, 0.4); }
        table { width: 100%; border-collapse: collapse; }
        th, td { padding: 1rem; text-align: left; }
        th { background: rgba(147, 51, 234, 0.4); }
        tr { border-bottom: 1px solid rgba(147, 51, 234, 0.2); }
        .mobile-menu { display: none; }
        .mobile-menu.active { display: block; }
        .pulse { animation: pulse 2s infinite; }
        @keyframes pulse { 0%, 100% { opacity: 1; } 50% { opacity: 0.7; } }
        @media (min-width: 768px) {
            #desktop-nav { display: flex !important; }
            #mobile-menu-btn { display: none !important; }
        }