body { font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif; background: #f5f5f5; margin: 0; padding: 20px; }
.container { max-width: 600px; margin: 0 auto; background: white; border-radius: 16px; padding: 20px; box-shadow: 0 2px 8px rgba(0,0,0,0.1); }
.user-card { display: flex; align-items: center; gap: 15px; background: linear-gradient(135deg, #f0f7ff 0%, #e9f0fa 100%); padding: 12px 20px; border-radius: 30px; margin-bottom: 20px; }
.user-details { flex: 1; }
.user-name { font-size: 18px; font-weight: bold; color: #333; }
.user-welcome { font-size: 14px; color: #666; }
.avatar { width: 56px; height: 56px; border-radius: 50%; object-fit: cover; border: 2px solid #07c160; background: #fff; }
.logout-btn { background: #ff5a00; color: white; border: none; padding: 6px 12px; border-radius: 20px; font-size: 12px; text-decoration: none; cursor: pointer; margin-left: auto; }
.membership-badge { background: #fff3e0; padding: 10px; border-radius: 12px; margin-bottom: 20px; text-align: center; }
.service-card, .plan-card { background: #fafafa; border-radius: 16px; padding: 20px; text-align: center; margin-bottom: 20px; border: 1px solid #eee; }
.price { font-size: 28px; font-weight: bold; color: #ff5a00; margin: 10px 0; }
.desc { color: #666; font-size: 14px; text-align: left; }
.deploy-form input { width: 100%; margin-bottom: 10px; padding: 10px; border: 1px solid #ddd; border-radius: 8px; box-sizing: border-box; }
.buy-btn, .pay-btn, .btn-primary { background: #07c160; color: white; border: none; padding: 12px 20px; border-radius: 30px; cursor: pointer; font-size: 16px; width: 100%; margin-top: 10px; }
.btn-cancel { background: #999; color: white; border: none; padding: 8px 16px; border-radius: 20px; cursor: pointer; text-decoration: none; display: inline-block; }
.order-list { margin-top: 30px; border-top: 1px solid #eee; padding-top: 20px; }
.order-item { border: 1px solid #eee; padding: 12px; margin-bottom: 12px; border-radius: 12px; }
.btn-small { background: #07c160; color: white; padding: 4px 12px; border-radius: 20px; text-decoration: none; font-size: 12px; display: inline-block; }
.form-group { margin-bottom: 16px; }
.form-group label { display: block; font-weight: bold; margin-bottom: 6px; }
.form-group input, .form-group select { width: 100%; padding: 10px; border: 1px solid #ddd; border-radius: 8px; }
.admin-entry { margin-top: 20px; text-align: center; }
.login-container { text-align: center; padding: 50px 20px; }
.membership-info { background: #e6f7ff; padding: 15px; border-radius: 12px; margin-bottom: 20px; }